@chatsdk-dev/ui 0.0.1 → 0.1.2

package/dist/molecules/ai/queue.d.ts

@@ -0,0 +1,62 @@
+import { Button } from "@chatsdk-dev/ui/atoms/button";
+import { Collapsible, CollapsibleContent } from "@chatsdk-dev/ui/atoms/collapsible";
+import { ScrollArea } from "@chatsdk-dev/ui/atoms/scroll-area";
+import type { ComponentProps } from "react";
+export interface QueueMessagePart {
+    type: string;
+    text?: string;
+    url?: string;
+    filename?: string;
+    mediaType?: string;
+}
+export interface QueueMessage {
+    id: string;
+    parts: QueueMessagePart[];
+}
+export interface QueueTodo {
+    id: string;
+    title: string;
+    description?: string;
+    status?: "pending" | "completed";
+}
+export type QueueItemProps = ComponentProps<"li">;
+export declare const QueueItem: ({ className, ...props }: QueueItemProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemIndicatorProps = ComponentProps<"span"> & {
+    completed?: boolean;
+};
+export declare const QueueItemIndicator: ({ completed, className, ...props }: QueueItemIndicatorProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemContentProps = ComponentProps<"span"> & {
+    completed?: boolean;
+};
+export declare const QueueItemContent: ({ completed, className, ...props }: QueueItemContentProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemDescriptionProps = ComponentProps<"div"> & {
+    completed?: boolean;
+};
+export declare const QueueItemDescription: ({ completed, className, ...props }: QueueItemDescriptionProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemActionsProps = ComponentProps<"div">;
+export declare const QueueItemActions: ({ className, ...props }: QueueItemActionsProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemActionProps = Omit<ComponentProps<typeof Button>, "variant" | "size">;
+export declare const QueueItemAction: ({ className, ...props }: QueueItemActionProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemAttachmentProps = ComponentProps<"div">;
+export declare const QueueItemAttachment: ({ className, ...props }: QueueItemAttachmentProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemImageProps = ComponentProps<"img">;
+export declare const QueueItemImage: ({ className, ...props }: QueueItemImageProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueItemFileProps = ComponentProps<"span">;
+export declare const QueueItemFile: ({ children, className, ...props }: QueueItemFileProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueListProps = ComponentProps<typeof ScrollArea>;
+export declare const QueueList: ({ children, className, ...props }: QueueListProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueSectionProps = ComponentProps<typeof Collapsible>;
+export declare const QueueSection: ({ className, defaultOpen, ...props }: QueueSectionProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueSectionTriggerProps = ComponentProps<"button">;
+export declare const QueueSectionTrigger: ({ children, className, ...props }: QueueSectionTriggerProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueSectionLabelProps = ComponentProps<"span"> & {
+    count?: number;
+    label: string;
+    icon?: React.ReactNode;
+};
+export declare const QueueSectionLabel: ({ count, label, icon, className, ...props }: QueueSectionLabelProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueSectionContentProps = ComponentProps<typeof CollapsibleContent>;
+export declare const QueueSectionContent: ({ className, ...props }: QueueSectionContentProps) => import("react/jsx-runtime").JSX.Element;
+export type QueueProps = ComponentProps<"div">;
+export declare const Queue: ({ className, ...props }: QueueProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=queue.d.ts.map

package/dist/molecules/ai/queue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"queue.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/queue.tsx"],"names":[],"mappings":"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"}

package/dist/molecules/ai/queue.js

@@ -0,0 +1,28 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "@chatsdk-dev/ui/atoms/button";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from "@chatsdk-dev/ui/atoms/collapsible";
+import { ScrollArea } from "@chatsdk-dev/ui/atoms/scroll-area";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { ChevronDownIcon, PaperclipIcon } from "lucide-react";
+export const QueueItem = ({ className, ...props }) => (_jsx("li", { className: cn("group flex flex-col gap-1 rounded-md px-3 py-1 text-sm transition-colors hover:bg-muted", className), ...props }));
+export const QueueItemIndicator = ({ completed = false, className, ...props }) => (_jsx("span", { className: cn("mt-0.5 inline-block size-2.5 rounded-full border", completed
+        ? "border-muted-foreground/20 bg-muted-foreground/10"
+        : "border-muted-foreground/50", className), ...props }));
+export const QueueItemContent = ({ completed = false, className, ...props }) => (_jsx("span", { className: cn("line-clamp-1 grow break-words", completed
+        ? "text-muted-foreground/50 line-through"
+        : "text-muted-foreground", className), ...props }));
+export const QueueItemDescription = ({ completed = false, className, ...props }) => (_jsx("div", { className: cn("ml-6 text-xs", completed
+        ? "text-muted-foreground/40 line-through"
+        : "text-muted-foreground", className), ...props }));
+export const QueueItemActions = ({ className, ...props }) => (_jsx("div", { className: cn("flex gap-1", className), ...props }));
+export const QueueItemAction = ({ className, ...props }) => (_jsx(Button, { className: cn("size-auto rounded p-1 text-muted-foreground opacity-0 transition-opacity hover:bg-muted-foreground/10 hover:text-foreground group-hover:opacity-100", className), size: "icon", type: "button", variant: "ghost", ...props }));
+export const QueueItemAttachment = ({ className, ...props }) => (_jsx("div", { className: cn("mt-1 flex flex-wrap gap-2", className), ...props }));
+export const QueueItemImage = ({ className, ...props }) => (_jsx("img", { alt: "", className: cn("h-8 w-8 rounded border object-cover", className), height: 32, width: 32, ...props }));
+export const QueueItemFile = ({ children, className, ...props }) => (_jsxs("span", { className: cn("flex items-center gap-1 rounded border bg-muted px-2 py-1 text-xs", className), ...props, children: [_jsx(PaperclipIcon, { size: 12 }), _jsx("span", { className: "max-w-[100px] truncate", children: children })] }));
+export const QueueList = ({ children, className, ...props }) => (_jsx(ScrollArea, { className: cn("mt-2 -mb-1", className), ...props, children: _jsx("div", { className: "max-h-40 pr-4", children: _jsx("ul", { children: children }) }) }));
+export const QueueSection = ({ className, defaultOpen = true, ...props }) => (_jsx(Collapsible, { className: cn(className), defaultOpen: defaultOpen, ...props }));
+export const QueueSectionTrigger = ({ children, className, ...props }) => (_jsx(CollapsibleTrigger, { render: () => (_jsx("button", { className: cn("group flex w-full items-center justify-between rounded-md bg-muted/40 px-3 py-2 text-left font-medium text-muted-foreground text-sm transition-colors hover:bg-muted", className), type: "button", ...props, children: children })) }));
+export const QueueSectionLabel = ({ count, label, icon, className, ...props }) => (_jsxs("span", { className: cn("flex items-center gap-2", className), ...props, children: [_jsx(ChevronDownIcon, { className: "size-4 transition-transform group-data-[state=closed]:-rotate-90" }), icon, _jsxs("span", { children: [count, " ", label] })] }));
+export const QueueSectionContent = ({ className, ...props }) => (_jsx(CollapsibleContent, { className: cn(className), ...props }));
+export const Queue = ({ className, ...props }) => (_jsx("div", { className: cn("flex flex-col gap-2 rounded-xl border border-border bg-background px-3 pt-2 pb-2 shadow-xs", className), ...props }));

package/dist/molecules/ai/reasoning.d.ts

@@ -0,0 +1,27 @@
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@chatsdk-dev/ui/atoms/collapsible";
+import type { ComponentProps, ReactNode } from "react";
+interface ReasoningContextValue {
+    isStreaming: boolean;
+    isOpen: boolean;
+    setIsOpen: (open: boolean) => void;
+    duration: number | undefined;
+}
+export declare const useReasoning: () => ReasoningContextValue;
+export type ReasoningProps = ComponentProps<typeof Collapsible> & {
+    isStreaming?: boolean;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    duration?: number;
+};
+export declare const Reasoning: import("react").MemoExoticComponent<({ className, isStreaming, open, defaultOpen, onOpenChange, duration: durationProp, children, ...props }: ReasoningProps) => import("react/jsx-runtime").JSX.Element>;
+export type ReasoningTriggerProps = ComponentProps<typeof CollapsibleTrigger> & {
+    getThinkingMessage?: (isStreaming: boolean, duration?: number) => ReactNode;
+};
+export declare const ReasoningTrigger: import("react").MemoExoticComponent<({ className, children, getThinkingMessage, ...props }: ReasoningTriggerProps) => import("react/jsx-runtime").JSX.Element>;
+export type ReasoningContentProps = ComponentProps<typeof CollapsibleContent> & {
+    children: string;
+};
+export declare const ReasoningContent: import("react").MemoExoticComponent<({ className, children, ...props }: ReasoningContentProps) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=reasoning.d.ts.map

package/dist/molecules/ai/reasoning.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reasoning.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/reasoning.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,WAAW,EACX,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,mCAAmC,CAAC;AAO3C,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAevD,UAAU,qBAAqB;IAC7B,WAAW,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;CAC9B;AAID,eAAO,MAAM,YAAY,6BAMxB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,GAAG;IAChE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAKF,eAAO,MAAM,SAAS,gJAUjB,cAAc,6CAiFlB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAChD,OAAO,kBAAkB,CAC1B,GAAG;IACF,kBAAkB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,SAAS,CAAC;CAC7E,CAAC;AAYF,eAAO,MAAM,gBAAgB,8FAMxB,qBAAqB,6CA0BzB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAChD,OAAO,kBAAkB,CAC1B,GAAG;IACF,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAIF,eAAO,MAAM,gBAAgB,0EACS,qBAAqB,6CAY1D,CAAC"}

package/dist/molecules/ai/reasoning.js

@@ -0,0 +1,95 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useControllableState } from "@radix-ui/react-use-controllable-state";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from "@chatsdk-dev/ui/atoms/collapsible";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { cjk } from "@streamdown/cjk";
+import { code } from "@streamdown/code";
+import { math } from "@streamdown/math";
+import { mermaid } from "@streamdown/mermaid";
+import { BrainIcon, ChevronDownIcon } from "lucide-react";
+import { createContext, memo, useCallback, useContext, useEffect, useMemo, useRef, useState, } from "react";
+import { Streamdown } from "streamdown";
+import { Shimmer } from "./shimmer";
+const ReasoningContext = createContext(null);
+export const useReasoning = () => {
+    const context = useContext(ReasoningContext);
+    if (!context) {
+        throw new Error("Reasoning components must be used within Reasoning");
+    }
+    return context;
+};
+const AUTO_CLOSE_DELAY = 1000;
+const MS_IN_S = 1000;
+export const Reasoning = memo(({ className, isStreaming = false, open, defaultOpen, onOpenChange, duration: durationProp, children, ...props }) => {
+    const resolvedDefaultOpen = defaultOpen ?? isStreaming;
+    // Track if defaultOpen was explicitly set to false (to prevent auto-open)
+    const isExplicitlyClosed = defaultOpen === false;
+    const [isOpen, setIsOpen] = useControllableState({
+        defaultProp: resolvedDefaultOpen,
+        onChange: onOpenChange,
+        prop: open,
+    });
+    const [duration, setDuration] = useControllableState({
+        defaultProp: undefined,
+        prop: durationProp,
+    });
+    const hasEverStreamedRef = useRef(isStreaming);
+    const [hasAutoClosed, setHasAutoClosed] = useState(false);
+    const startTimeRef = useRef(null);
+    // Track when streaming starts and compute duration
+    useEffect(() => {
+        if (isStreaming) {
+            hasEverStreamedRef.current = true;
+            if (startTimeRef.current === null) {
+                startTimeRef.current = Date.now();
+            }
+        }
+        else if (startTimeRef.current !== null) {
+            setDuration(Math.ceil((Date.now() - startTimeRef.current) / MS_IN_S));
+            startTimeRef.current = null;
+        }
+    }, [isStreaming, setDuration]);
+    // Auto-open when streaming starts (unless explicitly closed)
+    useEffect(() => {
+        if (isStreaming && !isOpen && !isExplicitlyClosed) {
+            setIsOpen(true);
+        }
+    }, [isStreaming, isOpen, setIsOpen, isExplicitlyClosed]);
+    // Auto-close when streaming ends (once only, and only if it ever streamed)
+    useEffect(() => {
+        if (hasEverStreamedRef.current &&
+            !isStreaming &&
+            isOpen &&
+            !hasAutoClosed) {
+            const timer = setTimeout(() => {
+                setIsOpen(false);
+                setHasAutoClosed(true);
+            }, AUTO_CLOSE_DELAY);
+            return () => clearTimeout(timer);
+        }
+    }, [isStreaming, isOpen, setIsOpen, hasAutoClosed]);
+    const handleOpenChange = useCallback((newOpen) => {
+        setIsOpen(newOpen);
+    }, [setIsOpen]);
+    const contextValue = useMemo(() => ({ duration, isOpen, isStreaming, setIsOpen }), [duration, isOpen, isStreaming, setIsOpen]);
+    return (_jsx(ReasoningContext.Provider, { value: contextValue, children: _jsx(Collapsible, { className: cn("not-prose mb-4", className), onOpenChange: handleOpenChange, open: isOpen, ...props, children: children }) }));
+});
+const defaultGetThinkingMessage = (isStreaming, duration) => {
+    if (isStreaming || duration === 0) {
+        return _jsx(Shimmer, { duration: 1, children: "Thinking..." });
+    }
+    if (duration === undefined) {
+        return _jsx("p", { children: "Thought for a few seconds" });
+    }
+    return _jsxs("p", { children: ["Thought for ", duration, " seconds"] });
+};
+export const ReasoningTrigger = memo(({ className, children, getThinkingMessage = defaultGetThinkingMessage, ...props }) => {
+    const { isStreaming, isOpen, duration } = useReasoning();
+    return (_jsx(CollapsibleTrigger, { className: cn("flex w-full items-center gap-2 text-muted-foreground text-sm transition-colors hover:text-foreground", className), ...props, children: children ?? (_jsxs(_Fragment, { children: [_jsx(BrainIcon, { className: "size-4" }), getThinkingMessage(isStreaming, duration), _jsx(ChevronDownIcon, { className: cn("size-4 transition-transform", isOpen ? "rotate-180" : "rotate-0") })] })) }));
+});
+const streamdownPlugins = { cjk, code, math, mermaid };
+export const ReasoningContent = memo(({ className, children, ...props }) => (_jsx(CollapsibleContent, { className: cn("mt-4 text-sm", "data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2 text-muted-foreground outline-none data-[state=closed]:animate-out data-[state=open]:animate-in", className), ...props, children: _jsx(Streamdown, { plugins: streamdownPlugins, children: children }) })));
+Reasoning.displayName = "Reasoning";
+ReasoningTrigger.displayName = "ReasoningTrigger";
+ReasoningContent.displayName = "ReasoningContent";

package/dist/molecules/ai/response.d.ts

@@ -0,0 +1,6 @@
+import { type ComponentProps } from "react";
+import { Streamdown } from "streamdown";
+type ResponseProps = ComponentProps<typeof Streamdown>;
+export declare const Response: import("react").MemoExoticComponent<({ className, ...props }: ResponseProps) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=response.d.ts.map

package/dist/molecules/ai/response.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"response.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/response.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAQ,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAIxC,KAAK,aAAa,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC;AAEvD,eAAO,MAAM,QAAQ,gEACO,aAAa,6CAsBxC,CAAC"}

package/dist/molecules/ai/response.js

@@ -0,0 +1,18 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from "react";
+import { Streamdown } from "streamdown";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+export const Response = memo(({ className, ...props }) => (_jsx(Streamdown, { className: cn("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", 
+    // "[&>*:first-child]:mt-0 [&>*:last-child]:mb-0",
+    // "[&_p]:my-2 [&_p]:leading-relaxed",
+    // "[&_h1]:mt-4 [&_h1]:mb-2 [&_h1]:text-sm [&_h1]:font-bold [&_h1:first-child]:mt-0",
+    // "[&_h2]:mt-3 [&_h2]:mb-2 [&_h2]:text-xs! [&_h2]:font-bold [&_h2:first-child]:mt-0",
+    // "[&_h3]:mt-2 [&_h3]:mb-1 [&_h3]:text-xs! [&_h3]:font-semibold [&_h3:first-child]:mt-0",
+    // "[&_h4]:mt-2 [&_h4]:mb-1 [&_h4]:text-xs! [&_h4]:font-medium [&_h4:first-child]:mt-0",
+    "[&_ul]:list-disc [&_ul]:pl-4", "[&_ol]:list-decimal [&_ol]:pl-4", "[&_li]:pl-1 [&_li]:leading-relaxed [&_li_p]:inline", 
+    // "[&_table]:my-2 [&_table]:w-full [&_table]:border-collapse [&_table]:text-[12px]",
+    // "[&_th]:border-border [&_th]:border-b [&_th]:p-1.5 [&_th]:text-left [&_th]:text-[12px] [&_th]:font-semibold",
+    // "[&_td]:border-border [&_td]:border-b [&_td]:p-1.5 [&_td]:text-[12px]",
+    className), ...props })), (prevProps, nextProps) => prevProps.children === nextProps.children);
+Response.displayName = "Response";

package/dist/molecules/ai/sandbox.d.ts

@@ -0,0 +1,25 @@
+import { Collapsible, CollapsibleContent } from "@chatsdk-dev/ui/atoms/collapsible";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@chatsdk-dev/ui/atoms/tabs";
+import type { ToolUIPart } from "ai";
+import type { ComponentProps } from "react";
+export type SandboxRootProps = ComponentProps<typeof Collapsible>;
+export declare const Sandbox: ({ className, ...props }: SandboxRootProps) => import("react/jsx-runtime").JSX.Element;
+export interface SandboxHeaderProps {
+    title?: string;
+    state: ToolUIPart["state"];
+    className?: string;
+}
+export declare const SandboxHeader: ({ className, title, state, ...props }: SandboxHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export type SandboxContentProps = ComponentProps<typeof CollapsibleContent>;
+export declare const SandboxContent: ({ className, ...props }: SandboxContentProps) => import("react/jsx-runtime").JSX.Element;
+export type SandboxTabsProps = ComponentProps<typeof Tabs>;
+export declare const SandboxTabs: ({ className, ...props }: SandboxTabsProps) => import("react/jsx-runtime").JSX.Element;
+export type SandboxTabsBarProps = ComponentProps<"div">;
+export declare const SandboxTabsBar: ({ className, ...props }: SandboxTabsBarProps) => import("react/jsx-runtime").JSX.Element;
+export type SandboxTabsListProps = ComponentProps<typeof TabsList>;
+export declare const SandboxTabsList: ({ className, ...props }: SandboxTabsListProps) => import("react/jsx-runtime").JSX.Element;
+export type SandboxTabsTriggerProps = ComponentProps<typeof TabsTrigger>;
+export declare const SandboxTabsTrigger: ({ className, ...props }: SandboxTabsTriggerProps) => import("react/jsx-runtime").JSX.Element;
+export type SandboxTabContentProps = ComponentProps<typeof TabsContent>;
+export declare const SandboxTabContent: ({ className, ...props }: SandboxTabContentProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sandbox.d.ts.map

package/dist/molecules/ai/sandbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sandbox.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/sandbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,WAAW,EACX,kBAAkB,EAEnB,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAEpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,IAAI,CAAC;AAErC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAC;AAElE,eAAO,MAAM,OAAO,GAAI,yBAAyB,gBAAgB,4CAShE,CAAC;AAEF,MAAM,WAAW,kBAAkB;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,GAAI,uCAK3B,kBAAkB,4CAepB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAE5E,eAAO,MAAM,cAAc,GAAI,yBAG5B,mBAAmB,4CAQrB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAE3D,eAAO,MAAM,WAAW,GAAI,yBAAyB,gBAAgB,4CAEpE,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAExD,eAAO,MAAM,cAAc,GAAI,yBAG5B,mBAAmB,4CAQrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,QAAQ,CAAC,CAAC;AAEnE,eAAO,MAAM,eAAe,GAAI,yBAG7B,oBAAoB,4CAKtB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAC;AAEzE,eAAO,MAAM,kBAAkB,GAAI,yBAGhC,uBAAuB,4CAQzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAC;AAExE,eAAO,MAAM,iBAAiB,GAAI,yBAG/B,sBAAsB,4CAExB,CAAC"}

package/dist/molecules/ai/sandbox.js

@@ -0,0 +1,15 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from "@chatsdk-dev/ui/atoms/collapsible";
+import { Tabs, TabsContent, TabsList, TabsTrigger, } from "@chatsdk-dev/ui/atoms/tabs";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { ChevronDownIcon, Code } from "lucide-react";
+import { getStatusBadge } from "./tool";
+export const Sandbox = ({ className, ...props }) => (_jsx(Collapsible, { className: cn("not-prose group mb-4 w-full overflow-hidden rounded-md border", className), defaultOpen: true, ...props }));
+export const SandboxHeader = ({ className, title, state, ...props }) => (_jsxs(CollapsibleTrigger, { className: cn("flex w-full items-center justify-between gap-4 p-3", className), ...props, children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Code, { className: "size-4 text-muted-foreground" }), _jsx("span", { className: "font-medium text-sm", children: title }), getStatusBadge(state)] }), _jsx(ChevronDownIcon, { className: "size-4 text-muted-foreground transition-transform group-data-[state=open]:rotate-180" })] }));
+export const SandboxContent = ({ className, ...props }) => (_jsx(CollapsibleContent, { className: cn("data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2 outline-none data-[state=closed]:animate-out data-[state=open]:animate-in", className), ...props }));
+export const SandboxTabs = ({ className, ...props }) => (_jsx(Tabs, { className: cn("w-full gap-0", className), ...props }));
+export const SandboxTabsBar = ({ className, ...props }) => (_jsx("div", { className: cn("flex w-full items-center border-border border-t border-b", className), ...props }));
+export const SandboxTabsList = ({ className, ...props }) => (_jsx(TabsList, { className: cn("h-auto rounded-none border-0 bg-transparent p-0", className), ...props }));
+export const SandboxTabsTrigger = ({ className, ...props }) => (_jsx(TabsTrigger, { className: cn("rounded-none border-0 border-transparent border-b-2 px-4 py-2 font-medium text-muted-foreground text-sm transition-colors data-[state=active]:border-primary data-[state=active]:bg-transparent data-[state=active]:text-foreground data-[state=active]:shadow-none", className), ...props }));
+export const SandboxTabContent = ({ className, ...props }) => (_jsx(TabsContent, { className: cn("mt-0 text-sm", className), ...props }));

package/dist/molecules/ai/schema-display.d.ts

@@ -0,0 +1,56 @@
+import { Badge } from "@chatsdk-dev/ui/atoms/badge";
+import { Collapsible } from "@chatsdk-dev/ui/atoms/collapsible";
+import type { ComponentProps, HTMLAttributes } from "react";
+type HttpMethod = "GET" | "POST" | "PUT" | "PATCH" | "DELETE";
+interface SchemaParameter {
+    name: string;
+    type: string;
+    required?: boolean;
+    description?: string;
+    location?: "path" | "query" | "header";
+}
+interface SchemaProperty {
+    name: string;
+    type: string;
+    required?: boolean;
+    description?: string;
+    properties?: SchemaProperty[];
+    items?: SchemaProperty;
+}
+export type SchemaDisplayHeaderProps = HTMLAttributes<HTMLDivElement>;
+export declare const SchemaDisplayHeader: ({ className, children, ...props }: SchemaDisplayHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayMethodProps = ComponentProps<typeof Badge>;
+export declare const SchemaDisplayMethod: ({ className, children, ...props }: SchemaDisplayMethodProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayPathProps = HTMLAttributes<HTMLSpanElement>;
+export declare const SchemaDisplayPath: ({ className, children, ...props }: SchemaDisplayPathProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayDescriptionProps = HTMLAttributes<HTMLParagraphElement>;
+export declare const SchemaDisplayDescription: ({ className, children, ...props }: SchemaDisplayDescriptionProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayContentProps = HTMLAttributes<HTMLDivElement>;
+export declare const SchemaDisplayContent: ({ className, children, ...props }: SchemaDisplayContentProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayParameterProps = HTMLAttributes<HTMLDivElement> & SchemaParameter;
+export declare const SchemaDisplayParameter: ({ name, type, required, description, location, className, ...props }: SchemaDisplayParameterProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayParametersProps = ComponentProps<typeof Collapsible>;
+export declare const SchemaDisplayParameters: ({ className, children, ...props }: SchemaDisplayParametersProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayPropertyProps = HTMLAttributes<HTMLDivElement> & SchemaProperty & {
+    depth?: number;
+};
+export declare const SchemaDisplayProperty: ({ name, type, required, description, properties, items, depth, className, ...props }: SchemaDisplayPropertyProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayRequestProps = ComponentProps<typeof Collapsible>;
+export declare const SchemaDisplayRequest: ({ className, children, ...props }: SchemaDisplayRequestProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayResponseProps = ComponentProps<typeof Collapsible>;
+export declare const SchemaDisplayResponse: ({ className, children, ...props }: SchemaDisplayResponseProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayProps = HTMLAttributes<HTMLDivElement> & {
+    method: HttpMethod;
+    path: string;
+    description?: string;
+    parameters?: SchemaParameter[];
+    requestBody?: SchemaProperty[];
+    responseBody?: SchemaProperty[];
+};
+export declare const SchemaDisplay: ({ method, path, description, parameters, requestBody, responseBody, className, children, ...props }: SchemaDisplayProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayBodyProps = HTMLAttributes<HTMLDivElement>;
+export declare const SchemaDisplayBody: ({ className, children, ...props }: SchemaDisplayBodyProps) => import("react/jsx-runtime").JSX.Element;
+export type SchemaDisplayExampleProps = HTMLAttributes<HTMLPreElement>;
+export declare const SchemaDisplayExample: ({ className, children, ...props }: SchemaDisplayExampleProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=schema-display.d.ts.map

package/dist/molecules/ai/schema-display.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-display.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/schema-display.tsx"],"names":[],"mappings":"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"}

package/dist/molecules/ai/schema-display.js

@@ -0,0 +1,73 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Badge } from "@chatsdk-dev/ui/atoms/badge";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from "@chatsdk-dev/ui/atoms/collapsible";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { ChevronRightIcon } from "lucide-react";
+import { createContext, useContext, useMemo } from "react";
+const SchemaDisplayContext = createContext({
+    method: "GET",
+    path: "",
+});
+const methodStyles = {
+    DELETE: "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400",
+    GET: "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400",
+    PATCH: "bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400",
+    POST: "bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400",
+    PUT: "bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-400",
+};
+export const SchemaDisplayHeader = ({ className, children, ...props }) => (_jsx("div", { className: cn("flex items-center gap-3 border-b px-4 py-3", className), ...props, children: children }));
+export const SchemaDisplayMethod = ({ className, children, ...props }) => {
+    const { method } = useContext(SchemaDisplayContext);
+    return (_jsx(Badge, { className: cn("font-mono text-xs", methodStyles[method], className), variant: "secondary", ...props, children: children ?? method }));
+};
+export const SchemaDisplayPath = ({ className, children, ...props }) => {
+    const { path } = useContext(SchemaDisplayContext);
+    // Highlight path parameters
+    const highlightedPath = path.replaceAll(/\{([^}]+)\}/g, '<span class="text-blue-600 dark:text-blue-400">{$1}</span>');
+    return (_jsx("span", { className: cn("font-mono text-sm", className), 
+        // oxlint-disable-next-line eslint-plugin-react(no-danger)
+        dangerouslySetInnerHTML: { __html: children ?? highlightedPath }, ...props }));
+};
+export const SchemaDisplayDescription = ({ className, children, ...props }) => {
+    const { description } = useContext(SchemaDisplayContext);
+    return (_jsx("p", { className: cn("border-b px-4 py-3 text-muted-foreground text-sm", className), ...props, children: children ?? description }));
+};
+export const SchemaDisplayContent = ({ className, children, ...props }) => (_jsx("div", { className: cn("divide-y", className), ...props, children: children }));
+export const SchemaDisplayParameter = ({ name, type, required, description, location, className, ...props }) => (_jsxs("div", { className: cn("px-4 py-3 pl-10", className), ...props, children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "font-mono text-sm", children: name }), _jsx(Badge, { className: "text-xs", variant: "outline", children: type }), location && (_jsx(Badge, { className: "text-xs", variant: "secondary", children: location })), required && (_jsx(Badge, { className: "bg-red-100 text-red-700 text-xs dark:bg-red-900/30 dark:text-red-400", variant: "secondary", children: "required" }))] }), description && (_jsx("p", { className: "mt-1 text-muted-foreground text-sm", children: description }))] }));
+export const SchemaDisplayParameters = ({ className, children, ...props }) => {
+    const { parameters } = useContext(SchemaDisplayContext);
+    return (_jsxs(Collapsible, { className: cn(className), defaultOpen: true, ...props, children: [_jsxs(CollapsibleTrigger, { className: "group flex w-full items-center gap-2 px-4 py-3 text-left transition-colors hover:bg-muted/50", children: [_jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }), _jsx("span", { className: "font-medium text-sm", children: "Parameters" }), _jsx(Badge, { className: "ml-auto text-xs", variant: "secondary", children: parameters?.length })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "divide-y border-t", children: children ??
+                        parameters?.map((param) => (_jsx(SchemaDisplayParameter, { ...param }, param.name))) }) })] }));
+};
+export const SchemaDisplayProperty = ({ name, type, required, description, properties, items, depth = 0, className, ...props }) => {
+    const hasChildren = properties || items;
+    const paddingLeft = 40 + depth * 16;
+    if (hasChildren) {
+        return (_jsxs(Collapsible, { defaultOpen: depth < 2, children: [_jsxs(CollapsibleTrigger, { className: cn("group flex w-full items-center gap-2 py-3 text-left transition-colors hover:bg-muted/50", className), style: { paddingLeft }, children: [_jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }), _jsx("span", { className: "font-mono text-sm", children: name }), _jsx(Badge, { className: "text-xs", variant: "outline", children: type }), required && (_jsx(Badge, { className: "bg-red-100 text-red-700 text-xs dark:bg-red-900/30 dark:text-red-400", variant: "secondary", children: "required" }))] }), description && (_jsx("p", { className: "pb-2 text-muted-foreground text-sm", style: { paddingLeft: paddingLeft + 24 }, children: description })), _jsx(CollapsibleContent, { children: _jsxs("div", { className: "divide-y border-t", children: [properties?.map((prop) => (_jsx(SchemaDisplayProperty, { ...prop, depth: depth + 1 }, prop.name))), items && (_jsx(SchemaDisplayProperty, { ...items, depth: depth + 1, name: `${name}[]` }))] }) })] }));
+    }
+    return (_jsxs("div", { className: cn("py-3 pr-4", className), style: { paddingLeft }, ...props, children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "size-4" }), _jsx("span", { className: "font-mono text-sm", children: name }), _jsx(Badge, { className: "text-xs", variant: "outline", children: type }), required && (_jsx(Badge, { className: "bg-red-100 text-red-700 text-xs dark:bg-red-900/30 dark:text-red-400", variant: "secondary", children: "required" }))] }), description && (_jsx("p", { className: "mt-1 pl-6 text-muted-foreground text-sm", children: description }))] }));
+};
+export const SchemaDisplayRequest = ({ className, children, ...props }) => {
+    const { requestBody } = useContext(SchemaDisplayContext);
+    return (_jsxs(Collapsible, { className: cn(className), defaultOpen: true, ...props, children: [_jsxs(CollapsibleTrigger, { className: "group flex w-full items-center gap-2 px-4 py-3 text-left transition-colors hover:bg-muted/50", children: [_jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }), _jsx("span", { className: "font-medium text-sm", children: "Request Body" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "border-t", children: children ??
+                        requestBody?.map((prop) => (_jsx(SchemaDisplayProperty, { ...prop, depth: 0 }, prop.name))) }) })] }));
+};
+export const SchemaDisplayResponse = ({ className, children, ...props }) => {
+    const { responseBody } = useContext(SchemaDisplayContext);
+    return (_jsxs(Collapsible, { className: cn(className), defaultOpen: true, ...props, children: [_jsxs(CollapsibleTrigger, { className: "group flex w-full items-center gap-2 px-4 py-3 text-left transition-colors hover:bg-muted/50", children: [_jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }), _jsx("span", { className: "font-medium text-sm", children: "Response" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "border-t", children: children ??
+                        responseBody?.map((prop) => (_jsx(SchemaDisplayProperty, { ...prop, depth: 0 }, prop.name))) }) })] }));
+};
+export const SchemaDisplay = ({ method, path, description, parameters, requestBody, responseBody, className, children, ...props }) => {
+    const contextValue = useMemo(() => ({
+        description,
+        method,
+        parameters,
+        path,
+        requestBody,
+        responseBody,
+    }), [description, method, parameters, path, requestBody, responseBody]);
+    return (_jsx(SchemaDisplayContext.Provider, { value: contextValue, children: _jsx("div", { className: cn("overflow-hidden rounded-lg border bg-background", className), ...props, children: children ?? (_jsxs(_Fragment, { children: [_jsx(SchemaDisplayHeader, { children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(SchemaDisplayMethod, {}), _jsx(SchemaDisplayPath, {})] }) }), description && _jsx(SchemaDisplayDescription, {}), _jsxs(SchemaDisplayContent, { children: [parameters && parameters.length > 0 && (_jsx(SchemaDisplayParameters, {})), requestBody && requestBody.length > 0 && (_jsx(SchemaDisplayRequest, {})), responseBody && responseBody.length > 0 && (_jsx(SchemaDisplayResponse, {}))] })] })) }) }));
+};
+export const SchemaDisplayBody = ({ className, children, ...props }) => (_jsx("div", { className: cn("divide-y", className), ...props, children: children }));
+export const SchemaDisplayExample = ({ className, children, ...props }) => (_jsx("pre", { className: cn("mx-4 mb-4 overflow-auto rounded-md bg-muted p-4 font-mono text-sm", className), ...props, children: children }));

package/dist/molecules/ai/shimmer.d.ts

@@ -0,0 +1,10 @@
+import type { ElementType } from "react";
+export interface TextShimmerProps {
+    children: string;
+    as?: ElementType;
+    className?: string;
+    duration?: number;
+    spread?: number;
+}
+export declare const Shimmer: import("react").MemoExoticComponent<({ children, as: Component, className, duration, spread, }: TextShimmerProps) => import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=shimmer.d.ts.map

package/dist/molecules/ai/shimmer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shimmer.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/shimmer.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAiB,WAAW,EAAO,MAAM,OAAO,CAAC;AAoB7D,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AA6CD,eAAO,MAAM,OAAO,kGArCjB,gBAAgB,6CAqC0B,CAAC"}

package/dist/molecules/ai/shimmer.js

@@ -0,0 +1,28 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { motion } from "motion/react";
+import { memo, useMemo } from "react";
+// Cache motion components at module level to avoid creating during render
+const motionComponentCache = new Map();
+const getMotionComponent = (element) => {
+    let component = motionComponentCache.get(element);
+    if (!component) {
+        component = motion.create(element);
+        motionComponentCache.set(element, component);
+    }
+    return component;
+};
+const ShimmerComponent = ({ children, as: Component = "p", className, duration = 2, spread = 2, }) => {
+    const MotionComponent = getMotionComponent(Component);
+    const dynamicSpread = useMemo(() => (children?.length ?? 0) * spread, [children, spread]);
+    return (_jsx(MotionComponent, { animate: { backgroundPosition: "0% center" }, className: cn("relative inline-block bg-[length:250%_100%,auto] bg-clip-text text-transparent", "[--bg:linear-gradient(90deg,#0000_calc(50%-var(--spread)),var(--color-background),#0000_calc(50%+var(--spread)))] [background-repeat:no-repeat,padding-box]", className), initial: { backgroundPosition: "100% center" }, style: {
+            "--spread": `${dynamicSpread}px`,
+            backgroundImage: "var(--bg), linear-gradient(var(--color-muted-foreground), var(--color-muted-foreground))",
+        }, transition: {
+            duration,
+            ease: "linear",
+            repeat: Number.POSITIVE_INFINITY,
+        }, children: children }));
+};
+export const Shimmer = memo(ShimmerComponent);

package/dist/molecules/ai/snippet.d.ts

@@ -0,0 +1,19 @@
+import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText } from "@chatsdk-dev/ui/atoms/input-group";
+import type { ComponentProps } from "react";
+export type SnippetProps = ComponentProps<typeof InputGroup> & {
+    code: string;
+};
+export declare const Snippet: ({ code, className, children, ...props }: SnippetProps) => import("react/jsx-runtime").JSX.Element;
+export type SnippetAddonProps = ComponentProps<typeof InputGroupAddon>;
+export declare const SnippetAddon: (props: SnippetAddonProps) => import("react/jsx-runtime").JSX.Element;
+export type SnippetTextProps = ComponentProps<typeof InputGroupText>;
+export declare const SnippetText: ({ className, ...props }: SnippetTextProps) => import("react/jsx-runtime").JSX.Element;
+export type SnippetInputProps = Omit<ComponentProps<typeof InputGroupInput>, "readOnly" | "value">;
+export declare const SnippetInput: ({ className, ...props }: SnippetInputProps) => import("react/jsx-runtime").JSX.Element;
+export type SnippetCopyButtonProps = ComponentProps<typeof InputGroupButton> & {
+    onCopy?: () => void;
+    onError?: (error: Error) => void;
+    timeout?: number;
+};
+export declare const SnippetCopyButton: ({ onCopy, onError, timeout, children, className, ...props }: SnippetCopyButtonProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=snippet.d.ts.map

package/dist/molecules/ai/snippet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"snippet.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/snippet.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,UAAU,EACV,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,cAAc,EACf,MAAM,mCAAmC,CAAC;AAG3C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAmB5C,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,GAAG;IAC7D,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,yCAKrB,YAAY,4CAUd,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,CAAC;AAEvE,eAAO,MAAM,YAAY,GAAI,OAAO,iBAAiB,4CAEpD,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,cAAc,CAAC,CAAC;AAErE,eAAO,MAAM,WAAW,GAAI,yBAAyB,gBAAgB,4CAKpE,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,cAAc,CAAC,OAAO,eAAe,CAAC,EACtC,UAAU,GAAG,OAAO,CACrB,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,yBAAyB,iBAAiB,4CAWtE,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,gBAAgB,CAAC,GAAG;IAC7E,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,6DAO/B,sBAAsB,4CA+CxB,CAAC"}

package/dist/molecules/ai/snippet.js

@@ -0,0 +1,46 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, } from "@chatsdk-dev/ui/atoms/input-group";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { CheckIcon, CopyIcon } from "lucide-react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState, } from "react";
+const SnippetContext = createContext({
+    code: "",
+});
+export const Snippet = ({ code, className, children, ...props }) => {
+    const contextValue = useMemo(() => ({ code }), [code]);
+    return (_jsx(SnippetContext.Provider, { value: contextValue, children: _jsx(InputGroup, { className: cn("font-mono", className), ...props, children: children }) }));
+};
+export const SnippetAddon = (props) => (_jsx(InputGroupAddon, { ...props }));
+export const SnippetText = ({ className, ...props }) => (_jsx(InputGroupText, { className: cn("pl-2 font-normal text-muted-foreground", className), ...props }));
+export const SnippetInput = ({ className, ...props }) => {
+    const { code } = useContext(SnippetContext);
+    return (_jsx(InputGroupInput, { className: cn("text-foreground", className), readOnly: true, value: code, ...props }));
+};
+export const SnippetCopyButton = ({ onCopy, onError, timeout = 2000, children, className, ...props }) => {
+    const [isCopied, setIsCopied] = useState(false);
+    const timeoutRef = useRef(0);
+    const { code } = useContext(SnippetContext);
+    const copyToClipboard = useCallback(async () => {
+        if (typeof window === "undefined" || !navigator?.clipboard?.writeText) {
+            onError?.(new Error("Clipboard API not available"));
+            return;
+        }
+        try {
+            if (!isCopied) {
+                await navigator.clipboard.writeText(code);
+                setIsCopied(true);
+                onCopy?.();
+                timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
+            }
+        }
+        catch (error) {
+            onError?.(error);
+        }
+    }, [code, onCopy, onError, timeout, isCopied]);
+    useEffect(() => () => {
+        window.clearTimeout(timeoutRef.current);
+    }, []);
+    const Icon = isCopied ? CheckIcon : CopyIcon;
+    return (_jsx(InputGroupButton, { "aria-label": "Copy", className: className, onClick: copyToClipboard, size: "icon-sm", title: "Copy", ...props, children: children ?? _jsx(Icon, { className: "size-3.5", size: 14 }) }));
+};

package/dist/molecules/ai/sources.d.ts

@@ -0,0 +1,13 @@
+import { CollapsibleContent, CollapsibleTrigger } from "@chatsdk-dev/ui/atoms/collapsible";
+import type { ComponentProps } from "react";
+export type SourcesProps = ComponentProps<"div">;
+export declare const Sources: ({ className, ...props }: SourcesProps) => import("react/jsx-runtime").JSX.Element;
+export type SourcesTriggerProps = ComponentProps<typeof CollapsibleTrigger> & {
+    count: number;
+};
+export declare const SourcesTrigger: ({ className, count, children, ...props }: SourcesTriggerProps) => import("react/jsx-runtime").JSX.Element;
+export type SourcesContentProps = ComponentProps<typeof CollapsibleContent>;
+export declare const SourcesContent: ({ className, ...props }: SourcesContentProps) => import("react/jsx-runtime").JSX.Element;
+export type SourceProps = ComponentProps<"a">;
+export declare const Source: ({ href, title, children, ...props }: SourceProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sources.d.ts.map

package/dist/molecules/ai/sources.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sources.d.ts","sourceRoot":"","sources":["../../../src/molecules/ai/sources.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,mCAAmC,CAAC;AAG3C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAEjD,eAAO,MAAM,OAAO,GAAI,yBAAyB,YAAY,4CAK5D,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAC5E,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,0CAK5B,mBAAmB,4CAYrB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAE5E,eAAO,MAAM,cAAc,GAAI,yBAG5B,mBAAmB,4CASrB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;AAE9C,eAAO,MAAM,MAAM,GAAI,qCAAqC,WAAW,4CAetE,CAAC"}

package/dist/molecules/ai/sources.js

@@ -0,0 +1,9 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from "@chatsdk-dev/ui/atoms/collapsible";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { BookIcon, ChevronDownIcon } from "lucide-react";
+export const Sources = ({ className, ...props }) => (_jsx(Collapsible, { className: cn("not-prose mb-4 text-primary text-xs", className), ...props }));
+export const SourcesTrigger = ({ className, count, children, ...props }) => (_jsx(CollapsibleTrigger, { className: cn("flex items-center gap-2", className), ...props, children: children ?? (_jsxs(_Fragment, { children: [_jsxs("p", { className: "font-medium", children: ["Used ", count, " sources"] }), _jsx(ChevronDownIcon, { className: "h-4 w-4" })] })) }));
+export const SourcesContent = ({ className, ...props }) => (_jsx(CollapsibleContent, { className: cn("mt-3 flex w-fit flex-col gap-2", "data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2 outline-none data-[state=closed]:animate-out data-[state=open]:animate-in", className), ...props }));
+export const Source = ({ href, title, children, ...props }) => (_jsx("a", { className: "flex items-center gap-2", href: href, rel: "noreferrer", target: "_blank", ...props, children: children ?? (_jsxs(_Fragment, { children: [_jsx(BookIcon, { className: "h-4 w-4" }), _jsx("span", { className: "block font-medium", children: title })] })) }));