ai-schadcn-chat 0.1.0

package/dist/components/chat/ChatProvider.js

@@ -0,0 +1,145 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useMemo, useRef, useSyncExternalStore, } from "react";
+import { ChatEngine as ChatEngineImpl } from "../../lib/chat-engine.js";
+import { buildDefaultMiniMaxConfig } from "../../types/presets.js";
+const ChatContext = createContext(null);
+/**
+ * Mount a chat engine for the lifetime of the React subtree. Multiple
+ * ChatProviders can coexist; each gets its own engine. The provider
+ * uses useSyncExternalStore for concurrent-mode-safe subscriptions.
+ */
+export function ChatProvider(props) {
+    const engineRef = useRef(null);
+    if (engineRef.current === null) {
+        engineRef.current = new ChatEngineImpl(props.config);
+    }
+    // Whenever the `config` prop changes, sync it into the engine.
+    // We compare by JSON to avoid spurious updates that would still
+    // trigger a re-render through the subscription.
+    const configRef = useRef(props.config);
+    if (!shallowEqual(configRef.current, props.config)) {
+        configRef.current = props.config;
+        engineRef.current.updateConfig(props.config);
+    }
+    // useSyncExternalStore requires the subscribe callback to be stable
+    // across renders — otherwise React tears down + recreates the
+    // subscription on every render and emits are lost. Memoize once
+    // against the engineRef, which itself is stable for the provider's
+    // lifetime.
+    const subscribe = useCallback((cb) => engineRef.current.subscribe(cb), []);
+    const getMessages = useCallback(() => engineRef.current.getMessagesSnapshot(), []);
+    const getConfigSnapshot = useCallback(() => engineRef.current.getConfig(), []);
+    const getActiveConversationId = useCallback(() => engineRef.current.getActiveConversationId(), []);
+    const getIsStreaming = useCallback(() => engineRef.current
+        .getMessagesSnapshot()
+        .some((m) => m.status === "streaming"), []);
+    const messages = useSyncExternalStore(subscribe, getMessages, getMessages);
+    const config = useSyncExternalStore(subscribe, getConfigSnapshot, getConfigSnapshot);
+    const conversationId = useSyncExternalStore(subscribe, getActiveConversationId, getActiveConversationId);
+    const isStreaming = useSyncExternalStore(subscribe, getIsStreaming, getIsStreaming);
+    const updateConfig = useCallback((arg) => {
+        engineRef.current.updateConfig(arg);
+    }, []);
+    const setConversationId = useCallback((id) => {
+        engineRef.current.setActiveConversationId(id);
+    }, []);
+    const send = useCallback(async (text, attachments) => {
+        await engineRef.current.sendUserMessage(text, attachments);
+    }, []);
+    const sendFiles = useCallback(async (text, files) => {
+        await engineRef.current.sendFiles(text, files);
+    }, []);
+    const abort = useCallback(() => engineRef.current.abort(), []);
+    const regenerate = useCallback(() => engineRef.current.regenerate(), []);
+    const editAndResend = useCallback((id, content) => engineRef.current.editAndResend(id, content), []);
+    const clear = useCallback(() => engineRef.current.clear(), []);
+    const newConversation = useCallback(() => engineRef.current.newConversation(), []);
+    const deleteMessage = useCallback((messageId) => {
+        engineRef.current.deleteMessage(messageId);
+    }, []);
+    const deleteConversation = useCallback((id) => {
+        engineRef.current.deleteConversation(id);
+    }, []);
+    const listConversations = useCallback(() => engineRef.current.listConversationIds(), []);
+    const listConversationsMeta = useCallback(() => engineRef.current.listConversationsMeta(), []);
+    const getActiveToolCallCount = useCallback(() => engineRef.current.getActiveToolCallCount(), []);
+    const value = useMemo(() => ({
+        engine: engineRef.current,
+        config,
+        updateConfig,
+        messages,
+        isStreaming,
+        conversationId,
+        setConversationId,
+        send,
+        sendFiles,
+        abort,
+        regenerate,
+        editAndResend,
+        clear,
+        newConversation,
+        deleteMessage,
+        deleteConversation,
+        listConversations,
+        listConversationsMeta,
+        getActiveToolCallCount,
+    }), [
+        config,
+        messages,
+        isStreaming,
+        conversationId,
+        updateConfig,
+        setConversationId,
+        send,
+        sendFiles,
+        abort,
+        regenerate,
+        editAndResend,
+        clear,
+        newConversation,
+        deleteMessage,
+        deleteConversation,
+        listConversations,
+        listConversationsMeta,
+        getActiveToolCallCount,
+    ]);
+    return _jsx(ChatContext.Provider, { value: value, children: props.children });
+}
+/**
+ * Hook to access the chat engine. Throws when used outside a ChatProvider.
+ */
+export function useChat() {
+    const value = useContext(ChatContext);
+    if (!value) {
+        throw new Error("useChat must be used inside <ChatProvider>");
+    }
+    return value;
+}
+/**
+ * Variant of useChat that returns null instead of throwing. Use in
+ * components that may render both inside and outside a provider.
+ */
+export function useOptionalChat() {
+    return useContext(ChatContext);
+}
+/**
+ * Default config helper for the MiniMax provider.
+ */
+export function defaultConfig(overrides = {}) {
+    return buildDefaultMiniMaxConfig(overrides);
+}
+function shallowEqual(a, b) {
+    if (a === b)
+        return true;
+    if (a.model.id !== b.model.id)
+        return false;
+    if (a.provider.baseUrl !== b.provider.baseUrl)
+        return false;
+    if (a.provider.credentials.apiKey !== b.provider.credentials.apiKey)
+        return false;
+    if (a.systemPrompt !== b.systemPrompt)
+        return false;
+    if (a.temperature !== b.temperature)
+        return false;
+    return true;
+}

package/dist/components/chat/Chatbubble.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Chatbubble — sourced from `apps/v4/styles/radix-rhea/ui/bubble.tsx` in
+ * the official `shadcn-ui/ui` repo (https://github.com/shadcn-ui/ui).
+ *
+ * File renamed `bubble.tsx` → `Chatbubble.tsx` so the import paths in
+ * this package line up with the kebab-case file naming convention used
+ * throughout (`Message.tsx`, `MessageMarker.tsx`, etc.).
+ *
+ * Source paths in the original module were remapped:
+ *   - `@/lib/utils`     → `../../lib/utils.js`
+ *   - `radix-ui` (Slot) → `@radix-ui/react-slot`
+ */
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare function BubbleGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare const bubbleVariants: (props?: ({
+    variant?: "default" | "destructive" | "ghost" | "muted" | "outline" | "secondary" | "tinted" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Bubble({ variant, align, className, ...props }: React.ComponentProps<"div"> & VariantProps<typeof bubbleVariants> & {
+    align?: "start" | "end";
+}): React.JSX.Element;
+declare function BubbleContent({ asChild, className, ...props }: React.ComponentProps<"div"> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+declare function BubbleReactions({ side, align, className, ...props }: React.ComponentProps<"div"> & {
+    align?: "start" | "end";
+    side?: "top" | "bottom";
+}): React.JSX.Element;
+export { BubbleGroup, Bubble, BubbleContent, BubbleReactions, type VariantProps as BubbleVariantProps, };
+//# sourceMappingURL=Chatbubble.d.ts.map

package/dist/components/chat/Chatbubble.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chatbubble.d.ts","sourceRoot":"","sources":["../../../src/components/chat/Chatbubble.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,QAAA,MAAM,cAAc;;8EAyBnB,CAAC;AAEF,iBAAS,MAAM,CAAC,EACd,OAAmB,EACnB,KAAe,EACf,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAC5B,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;CACzB,qBAUF;AAED,iBAAS,aAAa,CAAC,EACrB,OAAe,EACf,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,qBAaA;AAsBD,iBAAS,eAAe,CAAC,EACvB,IAAe,EACf,KAAa,EACb,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IACxB,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;CACzB,qBAUA;AAED,OAAO,EACL,WAAW,EACX,MAAM,EACN,aAAa,EACb,eAAe,EACf,KAAK,YAAY,IAAI,kBAAkB,GACxC,CAAC"}

package/dist/components/chat/Chatbubble.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { Slot } from "@radix-ui/react-slot";
+import { cn } from "../../lib/utils.js";
+function BubbleGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "bubble-group", className: cn("flex min-w-0 flex-col gap-2", className), ...props }));
+}
+const bubbleVariants = cva("group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full", {
+    variants: {
+        variant: {
+            default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
+            secondary: "*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]",
+            muted: "*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
+            tinted: "*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.93_calc(c*0.4)_h)] *:data-[slot=bubble-content]:text-foreground dark:*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.3_calc(c*0.4)_h)] [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.88_calc(c*0.5)_h)] dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.35_calc(c*0.5)_h)]",
+            outline: "*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-input/30",
+            ghost: "border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:p-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted/50",
+            destructive: "*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive dark:*:data-[slot=bubble-content]:bg-destructive/20 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20 dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/30",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function Bubble({ variant = "default", align = "start", className, ...props }) {
+    return (_jsx("div", { "data-slot": "bubble", "data-variant": variant, "data-align": align, className: cn(bubbleVariants({ variant }), className), ...props }));
+}
+function BubbleContent({ asChild = false, className, ...props }) {
+    const Comp = asChild ? Slot : "div";
+    return (_jsx(Comp, { "data-slot": "bubble-content", className: cn("w-fit max-w-full min-w-0 overflow-hidden rounded-3xl border border-transparent px-3 py-2.5 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/30", className), ...props }));
+}
+const bubbleReactionsVariants = cva("absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-muted px-1.5 py-0.5 text-sm ring-3 ring-card has-[button]:p-0", {
+    variants: {
+        side: {
+            top: "top-0 -translate-y-3/4",
+            bottom: "bottom-0 translate-y-3/4",
+        },
+        align: {
+            start: "left-3",
+            end: "right-3",
+        },
+    },
+    defaultVariants: {
+        side: "bottom",
+        align: "end",
+    },
+});
+function BubbleReactions({ side = "bottom", align = "end", className, ...props }) {
+    return (_jsx("div", { "data-slot": "bubble-reactions", "data-align": align, "data-side": side, className: cn(bubbleReactionsVariants({ side, align }), className), ...props }));
+}
+export { BubbleGroup, Bubble, BubbleContent, BubbleReactions, };

package/dist/components/chat/Markdown.d.ts

@@ -0,0 +1,35 @@
+import { type CSSProperties } from "react";
+import type { TypesetConfig } from "../../types/chat.js";
+export interface MarkdownProps {
+    children: string;
+    className?: string;
+    /**
+     * Optional typeset styling. When provided, the container becomes a
+     * `.typeset` element with the chosen preset + rhythm overrides. When
+     * undefined, the container falls back to the package's `ai-prose` class
+     * (the look every chat shipped with before this feature).
+     *
+     * The consumer app typically wires this from `config.ui.typeset` via the
+     * parent component. Passing it directly is supported for callers that
+     * want to bypass config plumbing (custom renderers, tests).
+     */
+    typeset?: TypesetConfig;
+    /**
+     * When false, the syntax-highlight plugin is skipped. Defaults to true
+     * (highlights are on). Consumers wire this from `config.ui.enableCodeHighlight`.
+     */
+    enableCodeHighlight?: boolean;
+    /**
+     * When false, the per-code-block Copy button is omitted. Defaults to
+     * true. Consumers wire this from `config.ui.enableCopyButtons`.
+     */
+    enableCopyButtons?: boolean;
+}
+/**
+ * Resolves which CSS class + inline style the markdown container should use.
+ * Pure function, exported for unit tests.
+ */
+export declare function typesetClassName(typeset: TypesetConfig | undefined): string;
+export declare function typesetInlineStyle(typeset: TypesetConfig | undefined): CSSProperties | undefined;
+export declare const Markdown: import("react").MemoExoticComponent<({ children, className, typeset, enableCodeHighlight, enableCopyButtons, }: MarkdownProps) => import("react").JSX.Element>;
+//# sourceMappingURL=Markdown.d.ts.map

package/dist/components/chat/Markdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../src/components/chat/Markdown.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAkB,KAAK,aAAa,EAAkB,MAAM,OAAO,CAAC;AAO3E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AA4CzD,MAAM,WAAW,aAAa;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,aAAa,GAAG,SAAS,GAAG,MAAM,CAQ3E;AAED,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,aAAa,GAAG,SAAS,GAAG,aAAa,GAAG,SAAS,CAUhG;AAED,eAAO,MAAM,QAAQ,kHAMlB,aAAa,iCAoId,CAAC"}

package/dist/components/chat/Markdown.js

@@ -0,0 +1,130 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Markdown — renders assistant/tool message content as rich GitHub-flavored
+ * Markdown with syntax-highlighted code blocks (copy + language label),
+ * tables, links, and lists.
+ *
+ * Pipeline: react-markdown + remark-gfm (tables/strikethrough/autolinks) +
+ * rehype-raw (inline HTML) + rehype-highlight (highlight.js token classes,
+ * themed in globals.css). The renderer is memoized so re-renders during
+ * streaming only re-parse when the text actually changes.
+ *
+ * Styling: when `typeset` is set, the container gets `typeset` + the chosen
+ * preset class + CSS variables for any rhythm overrides. When omitted or
+ * `enabled === false`, we fall back to `ai-prose` so existing consumers see
+ * no change. Either way, the per-element classes in `components` below still
+ * apply — Tailwind utilities win specificity over typeset's `:where()` rules.
+ */
+import { Check, Copy } from "lucide-react";
+import { memo, useState } from "react";
+import ReactMarkdown from "react-markdown";
+import rehypeHighlight from "rehype-highlight";
+import rehypeRaw from "rehype-raw";
+import remarkGfm from "remark-gfm";
+import { Button } from "../ui/button.js";
+import { cn } from "../../lib/utils.js";
+function CopyButton({ getText }) {
+    const [copied, setCopied] = useState(false);
+    return (_jsx(Button, { type: "button", variant: "ghost", "aria-label": "Copy code", onClick: () => {
+            try {
+                void navigator.clipboard?.writeText(getText());
+                setCopied(true);
+                setTimeout(() => setCopied(false), 1600);
+            }
+            catch {
+                /* ignore */
+            }
+        }, className: "h-7 gap-1.5 px-2 text-[11px] font-medium text-muted-foreground hover:bg-foreground/10 hover:text-foreground", children: copied ? (_jsxs(_Fragment, { children: [_jsx(Check, { className: "size-3 text-success" }), " Copied"] })) : (_jsxs(_Fragment, { children: [_jsx(Copy, { className: "size-3" }), " Copy"] })) }));
+}
+function nodeToText(node) {
+    if (node == null || typeof node === "boolean")
+        return "";
+    if (typeof node === "string" || typeof node === "number")
+        return String(node);
+    if (Array.isArray(node))
+        return node.map(nodeToText).join("");
+    if (typeof node === "object" && "props" in node) {
+        const props = node.props;
+        return nodeToText(props?.children);
+    }
+    return "";
+}
+/**
+ * Resolves which CSS class + inline style the markdown container should use.
+ * Pure function, exported for unit tests.
+ */
+export function typesetClassName(typeset) {
+    if (!typeset || typeset.enabled === false) {
+        // Legacy look. Keep the same class so existing snapshots stay stable.
+        return cn("ai-prose", "text-[0.9375rem] leading-relaxed");
+    }
+    const presetClass = typeset.preset && typeset.preset !== "default" ? `typeset-${typeset.preset}` : "typeset";
+    return cn(presetClass, "text-[var(--typeset-size)]");
+}
+export function typesetInlineStyle(typeset) {
+    if (!typeset || typeset.enabled === false)
+        return undefined;
+    const vars = {};
+    if (typeset.size)
+        vars["--typeset-size"] = typeset.size;
+    if (typeof typeset.leading === "number")
+        vars["--typeset-leading"] = typeset.leading;
+    if (typeset.flow)
+        vars["--typeset-flow"] = typeset.flow;
+    if (typeset.fontBody)
+        vars["--typeset-font-body"] = typeset.fontBody;
+    if (typeset.fontHeading)
+        vars["--typeset-font-heading"] = typeset.fontHeading;
+    if (typeset.fontMono)
+        vars["--typeset-font-mono"] = typeset.fontMono;
+    return Object.keys(vars).length > 0 ? vars : undefined;
+}
+export const Markdown = memo(function Markdown({ children, className, typeset, enableCodeHighlight = true, enableCopyButtons = true, }) {
+    const containerClass = typesetClassName(typeset);
+    const containerStyle = typesetInlineStyle(typeset);
+    // rehypePlugins: omit `rehype-highlight` when `enableCodeHighlight` is off.
+    // react-markdown's Pluggable[] type is `[Plugin, ...params]`; we cast so we
+    // can branch at runtime without TypeScript narrowing the array shape.
+    const rehypePlugins = (enableCodeHighlight
+        ? [rehypeRaw, [rehypeHighlight, { detect: true, ignoreMissing: true }]]
+        : [rehypeRaw]);
+    return (_jsx("div", { className: cn(containerClass, className), style: containerStyle, children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], rehypePlugins: rehypePlugins, components: {
+                p: ({ children }) => _jsx("p", { className: "my-2.5", children: children }),
+                a: ({ children, href }) => (_jsx("a", { href: href, target: "_blank", rel: "noreferrer noopener", className: "font-medium text-primary underline decoration-primary/30 underline-offset-2 transition-colors hover:decoration-primary", children: children })),
+                img: ({ src, alt }) => (_jsx("img", { src: typeof src === "string" ? src : undefined, alt: alt ?? "", loading: "lazy", className: "my-2 h-auto max-h-80 max-w-full rounded-xl border border-border object-contain" })),
+                ul: ({ children }) => (_jsx("ul", { className: "my-2.5 list-disc space-y-1 pl-5 marker:text-muted-foreground", children: children })),
+                ol: ({ children }) => (_jsx("ol", { className: "my-2.5 list-decimal space-y-1 pl-5 marker:text-muted-foreground", children: children })),
+                li: ({ children }) => _jsx("li", { className: "pl-1", children: children }),
+                h1: ({ children }) => (_jsx("h1", { className: "mb-2 mt-4 text-lg font-semibold tracking-tight", children: children })),
+                h2: ({ children }) => (_jsx("h2", { className: "mb-2 mt-4 text-base font-semibold tracking-tight", children: children })),
+                h3: ({ children }) => (_jsx("h3", { className: "mb-1.5 mt-3 text-sm font-semibold tracking-tight", children: children })),
+                blockquote: ({ children }) => (_jsx("blockquote", { className: "my-3 rounded-r-md border-l-2 border-primary/40 bg-primary/5 py-1 pl-3 text-muted-foreground", children: children })),
+                hr: () => _jsx("hr", { className: "my-4 border-border" }),
+                table: ({ children }) => (_jsx("div", { className: "my-3 overflow-x-auto rounded-lg border border-border", children: _jsx("table", { className: "w-full border-collapse text-sm", children: children }) })),
+                thead: ({ children }) => (_jsx("thead", { className: "bg-muted/60", children: children })),
+                th: ({ children }) => (_jsx("th", { className: "border-b border-border px-3 py-2 text-left font-semibold", children: children })),
+                td: ({ children }) => (_jsx("td", { className: "border-b border-border/60 px-3 py-2 align-top", children: children })),
+                code: ({ className: cls, children, ...props }) => {
+                    const isBlock = /language-/.test(cls ?? "");
+                    if (!isBlock) {
+                        return (_jsx("code", { className: "rounded-md border border-border/70 bg-muted/70 px-1.5 py-0.5 font-mono text-[0.85em] text-foreground", ...props, children: children }));
+                    }
+                    return (_jsx("code", { className: cls, ...props, children: children }));
+                },
+                pre: ({ children }) => {
+                    const lang = extractLang(children);
+                    return (_jsxs("div", { className: "group/code my-3 overflow-hidden rounded-xl border border-border bg-[oklch(0.16_0.02_285)] shadow-sm", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-white/10 bg-white/[0.03] px-3 py-1.5", children: [_jsx("span", { className: "font-mono text-[11px] font-medium uppercase tracking-wide text-white/50", children: lang || "code" }), enableCopyButtons && (_jsx(CopyButton, { getText: () => nodeToText(children) }))] }), _jsx("pre", { className: "overflow-x-auto px-4 py-3 text-[0.8125rem] leading-relaxed text-white/90 [&_code]:bg-transparent [&_code]:p-0", children: children })] }));
+                },
+            }, children: children }) }));
+});
+function extractLang(children) {
+    // <pre><code class="hljs language-ts">…
+    const child = Array.isArray(children) ? children[0] : children;
+    const cls = (child &&
+        typeof child === "object" &&
+        "props" in child &&
+        child.props?.className) ||
+        "";
+    const m = /language-([\w-]+)/.exec(cls);
+    return m ? m[1] : "";
+}

package/dist/components/chat/Message.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Message — sourced from `apps/v4/styles/radix-rhea/ui/message.tsx` in
+ * the official `shadcn-ui/ui` repo (https://github.com/shadcn-ui/ui).
+ *
+ * Source paths in the original module were remapped:
+ *   - `@/lib/utils` → `../../lib/utils.js`
+ *
+ * The component is a presentational frame that the consumer composes with
+ * `Bubble` (text), `Attachment` (files), `Marker` (tool calls, errors), and
+ * `MessageAvatar` (icon / image).
+ */
+import * as React from "react";
+declare function MessageGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function Message({ className, align, ...props }: React.ComponentProps<"div"> & {
+    align?: "start" | "end";
+}): React.JSX.Element;
+declare function MessageAvatar({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function MessageContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function MessageHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function MessageFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { MessageGroup, Message, MessageAvatar, MessageContent, MessageFooter, MessageHeader, };
+//# sourceMappingURL=Message.d.ts.map

package/dist/components/chat/Message.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../../src/components/chat/Message.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQzE;AAED,iBAAS,OAAO,CAAC,EACf,SAAS,EACT,KAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;CAAE,qBAY3D;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW1E;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW3E;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW1E;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW1E;AAED,OAAO,EACL,YAAY,EACZ,OAAO,EACP,aAAa,EACb,cAAc,EACd,aAAa,EACb,aAAa,GACd,CAAC"}

package/dist/components/chat/Message.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+function MessageGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "message-group", className: cn("flex min-w-0 flex-col gap-2", className), ...props }));
+}
+function Message({ className, align = "start", ...props }) {
+    return (_jsx("div", { "data-slot": "message", "data-align": align, className: cn("group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse", className), ...props }));
+}
+function MessageAvatar({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "message-avatar", className: cn("flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-8", className), ...props }));
+}
+function MessageContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "message-content", className: cn("flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end", className), ...props }));
+}
+function MessageHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "message-header", className: cn("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0", className), ...props }));
+}
+function MessageFooter({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "message-footer", className: cn("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end", className), ...props }));
+}
+export { MessageGroup, Message, MessageAvatar, MessageContent, MessageFooter, MessageHeader, };

package/dist/components/chat/MessageInput.d.ts

@@ -0,0 +1,24 @@
+import { type ReactNode } from "react";
+import type { AttachmentMeta } from "../../types/chat.js";
+export interface MessageInputProps {
+    /** Optional headless submit handler. When omitted, the input calls
+     *  `useChat().send(text, attachments)`. */
+    onSend?: (content: string, attachments: AttachmentMeta[]) => void | Promise<void>;
+    /** Streaming state — toggles the trailing button between "send" and "stop". */
+    streaming?: boolean;
+    /** Disable the input entirely (e.g. while uploading). */
+    disabled?: boolean;
+    /** Override the trailing button render. */
+    renderSendButton?: (props: {
+        disabled: boolean;
+        onClick: () => void;
+    }) => ReactNode;
+    /** Extra className on the form. */
+    className?: string;
+    /** Extra className on the inner content wrapper (the composer card and hint
+     *  text), merged over the default `max-w-3xl` via tailwind-merge. Use this
+     *  to let the composer use more horizontal space in wide layouts. */
+    contentClassName?: string;
+}
+export declare function MessageInput(props: MessageInputProps): import("react").JSX.Element;
+//# sourceMappingURL=MessageInput.d.ts.map

package/dist/components/chat/MessageInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageInput.d.ts","sourceRoot":"","sources":["../../../src/components/chat/MessageInput.tsx"],"names":[],"mappings":"AA+BA,OAAO,EAUL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AA+Bf,OAAO,KAAK,EACV,cAAc,EAGf,MAAM,qBAAqB,CAAC;AAG7B,MAAM,WAAW,iBAAiB;IAChC;+CAC2C;IAC3C,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAClF,+EAA+E;IAC/E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE;QACzB,QAAQ,EAAE,OAAO,CAAC;QAClB,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,KAAK,SAAS,CAAC;IAChB,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;yEAEqE;IACrE,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BA6ZpD"}