@assistant-ui/mcp-docs-server 0.1.24 → 0.1.25

package/.docs/raw/docs/(reference)/legacy/styled/scrollbar.mdx

@@ -1,72 +0,0 @@
----
-title: Custom Scrollbar
-description: Integrate custom scrollbar UI using Radix UI Scroll Area.
----
-
-If you want to show a custom scrollbar UI of the Thread.Viewport in place of the system default, you can integrate `@radix-ui/react-scroll-area`.
-An example implementation of this is [shadcn-ui's Scroll Area](https://ui.shadcn.com/docs/components/scroll-area).
-
-## Add shadcn Scroll Area
-
-```sh
-npx shadcn@latest add scroll-area
-```
-
-### @radix-ui/react-scroll-area v1.2.0 release candidate required
-
-The v1.2.0-rc.x release candidate can be installed via
-
-```sh
-pnpm add @radix-ui/react-scroll-area@next
-```
-
-## Additional Styles
-
-The radix-ui Viewport component adds an intermediate `<div data-radix-scroll-area-content>` element.
-Add the following CSS to your `globals.css`:
-
-```css title="@/app/globals.css"
-.aui-thread-viewport > [data-radix-scroll-area-content] {
-  @apply flex flex-col items-center self-stretch bg-inherit;
-}
-```
-
-## Integration
-
-- Decompose `Thread` into `MyThread` (see [Decomposition](/docs/legacy/styled/decomposition))
-- Wrap `Thread.Root` with `<ScrollAreaPrimitive.Root asChild>`
-- Wrap `Thread.Viewport` with `<ScrollAreaPrimitive.Viewport asChild>`
-- Add shadcn's `<ScrollBar />` to `Thread.Root`
-
-The resulting MyThread component should look like this:
-
-```tsx
-import {
-  Thread,
-  ThreadWelcome,
-  Composer,
-  type ThreadConfig,
-} from "@assistant-ui/react-ui";
-import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"; // [!code highlight]
-import { ScrollBar } from "@/components/ui/scroll-area"; // [!code highlight]
-
-const MyThread: FC<ThreadConfig> = (config) => {
-  return (
-    <ScrollAreaPrimitive.Root asChild> /* [!code highlight] */
-      <Thread.Root config={config}>
-        <ScrollAreaPrimitive.Viewport asChild> /* [!code highlight] */
-          <Thread.Viewport>
-            <ThreadWelcome />
-            <Thread.Messages />
-            <Thread.ViewportFooter>
-              <Thread.ScrollToBottom />
-              <Composer />
-            </Thread.ViewportFooter>
-          </Thread.Viewport>
-        </ScrollAreaPrimitive.Viewport> /* [!code highlight] */
-        <ScrollBar /> /* [!code highlight] */
-      </Thread.Root>
-    </ScrollAreaPrimitive.Root> /* [!code highlight] */
-  );
-};
-```

package/.docs/raw/docs/(reference)/legacy/styled/thread-width.mdx

@@ -1,22 +0,0 @@
----
-title: Thread Width
-description: Customize thread max width using CSS variables.
----
-
-You can modify the max width of the thread via the CSS variable `--aui-thread-max-width`.
-
-## Wider Thread
-
-```css title="@/app/globals.css"
-:root {
-  --aui-thread-max-width: 600px;
-}
-```
-
-## Take up the whole screen
-
-```css title="@/app/globals.css"
-:root {
-  --aui-thread-max-width: infinity;
-}
-```

package/.docs/raw/docs/(reference)/legacy/styled/thread.mdx

@@ -1,77 +0,0 @@
----
-title: Thread
-description: Full-screen message list and composer UI for chat interfaces.
----
-
-
-## Overview
-
-The raw message list and message composer UI. Useful for full screen chat use cases.
-
-## Getting Started
-
-<Steps>
-  <Step>
-
-### Install `@assistant-ui/react-ui`
-
-<InstallCommand npm={["@assistant-ui/react-ui"]} />
-
-  </Step>
-  <Step>
-
-### Import CSS styles
-
-Add the following to your `tailwind.config.ts`:
-
-<Tabs items={["Tailwind", "Tailwind + shadcn-ui"]}>
-
-```ts title="/tailwind.config.ts" tab="Tailwind"
-{
-  plugins: [
-    require("tailwindcss-animate"), // make sure to "npm install tailwindcss-animate"
-    require("@assistant-ui/react-ui/tailwindcss")({
-      components: ["thread"],
-    })
-  ],
-}
-```
-
-```ts title="/tailwind.config.ts" tab="Tailwind + shadcn-ui"
-{
-  plugins: [
-    require("tailwindcss-animate"), // make sure to "npm install tailwindcss-animate"
-    require("@assistant-ui/react-ui/tailwindcss")({
-      components: ["thread"],
-      shadcn: true
-    })
-  ],
-}
-```
-
-</Tabs>
-
-  </Step>
-  <Step>
-
-### Use it in your app
-
-```tsx title="/app/page.tsx"
-import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
-import { Thread } from "@assistant-ui/react-ui";
-
-const MyApp = () => {
-  const runtime = useChatRuntime({
-    api: "/api/chat",
-  });
-
-  return (
-    <div className="h-full">
-      <Thread runtime={runtime} />
-    </div>
-  );
-};
-```
-
-  </Step>
-</Steps>