Adding agent studio section with a curation widget.

apps/docs/content/docs/experiences/agent-studio/curation-agent.mdx

@@ -0,0 +1,98 @@
+---
+title: Curation Agent
+description: "Use Algolia Ask AI to curate and answer questions about highlighted text on your page."
+---
+
+import { File, Folder, Files } from 'fumadocs-ui/components/files';
+import { Tabs, TabsList, TabsTrigger, TabsContent, TabsContents } from '@/components/animate-ui/components/animate/tabs';
+import { LogosShadcn } from '@/components/icons/shadcn';
+import { LogosJavascript } from '@/components/icons/javascript';
+import { CurationAgent } from '@/registry/experiences/curation-agent/components/curation-agent';
+import { PreviewCurationAgent } from '@/components/previews';
+
+Leverage [Algolia Ask AI](https://www.algolia.com/products/ai/ask-ai)'s context to answer questions about any highlighted text on your page.
+
+## Use cases
+
+- Documentation websites
+- Interactive blog posts and tutorials
+- Content curation workflows
+
+## Preview
+
+<PreviewCurationAgent />
+
+<Tabs>
+  <div className="flex items-center justify-between gap-2 mt-20 mb-2">
+    <h2 className="!my-0 mr-4">Usage</h2>
+    <TabsList className="flex items-center gap-2">
+      <TabsTrigger value="shadcn" className="flex items-center gap-2 px-2"> <LogosShadcn /> <span>shadcn/ui</span></TabsTrigger>
+    </TabsList>
+  </div>
+  <TabsContents>
+    <TabsContent value="shadcn">
+```tsx
+npx shadcn@latest add @algolia/curation-agent
+```
+
+This will add the `Curation Agent` experience to your project under `components/curation-agent`. Use it like this:
+
+```tsx
+import CurationAgent from "@/components/curation-agent";
+
+<CurationAgent 
+  applicationId="06YAZFOHSQ"
+  apiKey="94b6afdc316917b6e6cdf2763fa561df"
+  indexName="algolia_podcast_sample_dataset"
+  assistantId="UpR727VnXnoG"
+  excludeElements={["pre", "code"]}
+  askButtonLabel="Ask AI?"
+  onAsk={(payload) => {
+    console.log(payload);
+  }}
+>
+  <article>
+    <h1>My Article</h1>
+    <p>This is my article content.</p>
+  </article>
+</CurationAgent>
+```
+
+### Configuration
+
+Required props for using the `CurationAgent` component:
+
+- `applicationId`: The Algolia application ID
+- `apiKey`: The Algolia API key
+- `indexName`: The Algolia index name
+- `assistantId`: The Ask AI assistant ID
+
+Optional props:
+
+- `excludeElements`: An array of HTML elements to exclude from the highlighted text.
+- `askButtonLabel`: The label for the ask button.
+- `onAsk`: A callback function that will be called when the ask button is clicked.
+
+### Structure
+
+<Files>
+  <Folder name="app">
+    <File name="page.tsx" />
+  </Folder>
+  <Folder name="components" defaultOpen>
+    <File name="curation-agent.tsx" />
+  </Folder>
+  <Folder name="hooks" defaultOpen>
+    <File name="use-askai.tsx" />
+  </Folder>
+  <File name="package.json" />
+</Files>
+    </TabsContent>
+  </TabsContents>
+</Tabs>
+
+## Extending further
+
+- Change the styling to match your brand
+- Open in v0 for more customization
+

apps/docs/content/docs/experiences/agent-studio/sidepanel-agent-studio.mdx

@@ -0,0 +1,153 @@
+---
+title: Sidepanel Agent Studio
+description: "Sidepanel chat experience with Agent Studio, powered by Algolia's Agent Studio. Opens as a side panel that doesn't block the rest of the page."
+---
+
+import { File, Folder, Files } from 'fumadocs-ui/components/files';
+import { Tabs, TabsList, TabsTrigger, TabsContent, TabsContents } from '@/components/animate-ui/components/animate/tabs';
+import { LogosShadcn } from '@/components/icons/shadcn';
+import { TypeTable } from 'fumadocs-ui/components/type-table';
+import { PreviewSidepanelAgentStudio } from '@/components/previews';
+
+A sidepanel chat experience that opens from the right side of the screen, allowing users to interact with [Algolia's Agent Studio](https://www.algolia.com/products/ai/agent-studio) without blocking the rest of the page. Perfect for documentation sites, help centers, or any context where users need quick AI assistance while browsing.
+
+## Use cases
+
+- Documentation site AI assistant
+- Help center chat support
+- Non-blocking AI chat interface
+- Side-by-side browsing and AI interaction
+- Keyboard-accessible chat experience
+
+## Preview
+
+<PreviewSidepanelAgentStudio />
+
+<Tabs>
+  <div className="flex items-center justify-between gap-2 mt-20 mb-2">
+    <h2 className="!my-0 mr-4">Usage</h2>
+    <TabsList className="flex items-center gap-2">
+      <TabsTrigger value="shadcn" className="flex items-center gap-2 px-2"> <LogosShadcn /> <span>shadcn/ui</span></TabsTrigger>
+    </TabsList>
+  </div>
+  <TabsContents>
+    <TabsContent value="shadcn">
+```tsx
+npx shadcn@latest add @algolia/sidepanel-agent-studio
+```
+
+This will add the `Sidepanel Agent Studio` experience to your project under `components/sidepanel-agent-studio`. Use it like this:
+
+```tsx
+import SidepanelExperience from "@/components/sidepanel-agent-studio";
+
+<SidepanelExperience
+  applicationId="06YAZFOHSQ"
+  apiKey="94b6afdc316917b6e6cdf2763fa561df"
+  assistantId="UpR727VnXnoG"
+/>
+```
+
+### Configuration
+
+Required props for using the `SidepanelExperience` component:
+
+- `applicationId`: The Algolia application ID
+- `apiKey`: The Algolia API key
+- `assistantId`: The Agent Studio agent ID
+
+### Structure
+
+<Files>
+  <Folder name="app">
+    <File name="page.tsx" />
+  </Folder>
+  <Folder name="components" defaultOpen>
+    <File name="sidepanel-agent-studio.tsx" />
+  </Folder>
+  <Folder name="hooks" defaultOpen>
+    <File name="use-agent-studio.ts" />
+  </Folder>
+  <File name="package.json" />
+</Files>
+    </TabsContent>
+  </TabsContents>
+</Tabs>
+
+## Behavior
+
+- **Opens via button or keyboard**: Click the "Ask AI" button or press `Cmd+I` (Mac) / `Ctrl+I` (Windows)
+- **Non-blocking**: The rest of the page remains interactive while the sidepanel is open
+- **Resizable**: Toggle between 360px (default) and 580px (maximized) width on desktop
+- **Keyboard accessible**: Press `Escape` to close, `Enter` to send messages
+- **Auto-scroll**: Chat automatically scrolls to show new messages
+- **Mobile responsive**: Full-width on mobile, fixed width on desktop
+
+## References
+<TypeTable
+  type={{
+    applicationId: {
+      description: "Algolia Application ID (required)",
+      type: "string",
+      required: true,
+    },
+    apiKey: {
+      description: "Algolia API Key (required)",
+      type: "string",
+      required: true,
+    },
+    assistantId: {
+      description: "Agent Studio Agent ID (required for chat functionality)",
+      type: "string",
+      required: true,
+    },
+    suggestedQuestionsEnabled: {
+      description: "Suggested Questions Enabled (optional, defaults to false)",
+      type: "boolean",
+      default: false,
+      required: false,
+    },
+    placeholder: {
+      description: "Placeholder text for input (optional, defaults to \"Ask AI anything about Algolia\")",
+      type: "string",
+      default: "\"Ask AI anything about Algolia\"",
+      required: false,
+    },
+    buttonText: {
+      description: "Custom button text (optional, defaults to \"Ask AI\")",
+      type: "string",
+      default: "\"Ask AI\"",
+      required: false,
+    },
+    buttonProps: {
+      description: "Custom button props (optional)",
+      type: "ComponentProps<typeof Button>",
+      parameters: [
+        {
+          name: "onClick",
+          description: "The function to call when the button is clicked",
+        },
+        {
+          name: "children",
+          description: "The children to render in the button (optional)",
+        },
+      ],
+      required: false,
+    },
+    variant: {
+      description: "Display variant (optional, defaults to 'floating')",
+      type: "\"floating\" | \"inline\"",
+      default: "\"floating\"",
+      required: false,
+    },
+  }}
+/>
+
+## Extending further
+
+- Change the styling to match your brand
+- Customize the sidepanel width and animations
+- Add custom message handlers
+- Integrate with your analytics system
+- Open in v0 for more customization
+

apps/docs/content/docs/meta.json

@@ -12,6 +12,8 @@
     "experiences/dropdown-search",
     "---Ask AI Experiences---",
     "experiences/ask-ai/sidepanel-askai",
-    "experiences/ask-ai/highlight-to-askai"
+    "experiences/ask-ai/highlight-to-askai",
+    "---Agent Studio---",
+    "experiences/agent-studio/curation-agent"
   ]
 }