veryfront 0.1.47 → 0.1.49

package/esm/src/react/components/ai/chat/components/inline-citation.js

@@ -0,0 +1,59 @@
+import * as dntShim from "../../../../../../_dnt.shims.js";
+import * as React from "react";
+import { cn } from "../../theme.js";
+export function InlineCitation({ index, source, className, onClick, }) {
+    const [showCard, setShowCard] = React.useState(false);
+    const timerRef = React.useRef(undefined);
+    const buttonRef = React.useRef(null);
+    const [cardStyle, setCardStyle] = React.useState({});
+    const show = React.useCallback(() => {
+        clearTimeout(timerRef.current);
+        timerRef.current = dntShim.setTimeout(() => {
+            // Position the card using fixed positioning to prevent overflow clipping
+            const el = buttonRef.current;
+            if (el) {
+                const rect = el.getBoundingClientRect();
+                setCardStyle({
+                    position: "fixed",
+                    left: Math.max(8, Math.min(rect.left + rect.width / 2 - 160, globalThis.innerWidth - 328)),
+                    bottom: globalThis.innerHeight - rect.top + 8,
+                    zIndex: 9999,
+                });
+            }
+            setShowCard(true);
+        }, 150);
+    }, []);
+    const hide = React.useCallback(() => {
+        clearTimeout(timerRef.current);
+        timerRef.current = dntShim.setTimeout(() => setShowCard(false), 100);
+    }, []);
+    React.useEffect(() => () => clearTimeout(timerRef.current), []);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("span", { className: "relative inline-block" },
+            React.createElement("button", { ref: buttonRef, type: "button", onClick: () => onClick?.(index), onMouseEnter: show, onMouseLeave: hide, className: cn("inline-flex items-center justify-center", "size-4 rounded text-[10px] font-medium leading-none", "bg-[var(--border)] text-[var(--card-foreground)]", "hover:bg-[var(--accent)] transition-colors", "align-super -translate-y-0.5 mx-0.5", className) }, index + 1)),
+        showCard && source && (React.createElement("div", { style: cardStyle, className: "w-80 animate-in fade-in duration-150", onMouseEnter: show, onMouseLeave: hide },
+            React.createElement("div", { className: "bg-[var(--card)] border border-[var(--border)] rounded-xl shadow-xl p-3.5 text-left" },
+                React.createElement("div", { className: "flex items-start gap-2" },
+                    React.createElement("span", { className: "flex-shrink-0 flex items-center justify-center size-5 rounded bg-[var(--border)] text-[10px] font-bold text-[var(--card-foreground)] mt-0.5" }, index + 1),
+                    React.createElement("div", { className: "min-w-0 flex-1" },
+                        React.createElement("p", { className: "text-sm font-medium text-[var(--foreground)] line-clamp-2" }, source.title),
+                        source.url && (React.createElement("p", { className: "text-[10px] text-[var(--muted-foreground)] truncate mt-0.5 flex items-center gap-1" },
+                            React.createElement("svg", { className: "size-2.5 shrink-0", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" },
+                                React.createElement("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
+                                React.createElement("polyline", { points: "15 3 21 3 21 9" }),
+                                React.createElement("line", { x1: "10", y1: "14", x2: "21", y2: "3" })),
+                            source.url)))),
+                source.snippet && (React.createElement("div", { className: "mt-2.5 pl-3 border-l-2 border-[var(--border)]" },
+                    React.createElement("p", { className: "text-xs text-[var(--card-foreground)] line-clamp-4 leading-relaxed italic" }, source.snippet))),
+                source.score != null && (React.createElement("div", { className: "mt-2.5 flex items-center gap-2" },
+                    React.createElement("span", { className: "text-[10px] text-[var(--input-placeholder)] shrink-0" }, "Relevance"),
+                    React.createElement("div", { className: "flex-1 h-1 rounded-full bg-[var(--border)] overflow-hidden" },
+                        React.createElement("div", { className: cn("h-full rounded-full transition-all", source.score >= 0.7
+                                ? "bg-emerald-500"
+                                : source.score >= 0.4
+                                    ? "bg-amber-500"
+                                    : "bg-neutral-400"), style: { width: `${Math.round(source.score * 100)}%` } })),
+                    React.createElement("span", { className: "text-[10px] tabular-nums text-[var(--input-placeholder)]" },
+                        Math.round(source.score * 100),
+                        "%"))))))));
+}

package/esm/src/react/components/ai/chat/components/message-actions.d.ts

@@ -1,7 +1,8 @@
-import * as React from "react";
 export interface MessageActionsProps {
     content: string;
     className?: string;
+    /** When provided, renders an edit button that calls this handler */
+    onEdit?: (content: string) => void;
 }
-export declare function MessageActions({ content, className, }: MessageActionsProps): React.ReactElement;
+export declare const MessageActions: any;
 //# sourceMappingURL=message-actions.d.ts.map

package/esm/src/react/components/ai/chat/components/message-actions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message-actions.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/message-actions.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,SAAS,GACV,EAAE,mBAAmB,GAAG,KAAK,CAAC,YAAY,CAoD1C"}
+{"version":3,"file":"message-actions.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/message-actions.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oEAAoE;IACpE,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,eAAO,MAAM,cAAc,KAuE1B,CAAC"}

package/esm/src/react/components/ai/chat/components/message-actions.js

@@ -2,7 +2,8 @@ import * as dntShim from "../../../../../../_dnt.shims.js";
 import * as React from "react";
 import { cn } from "../../theme.js";
 import { CheckIcon, CopyIcon } from "../../icons/index.js";
-export function MessageActions({ content, className, }) {
+const ACTION_BUTTON = "inline-flex items-center justify-center size-7 text-[var(--input-placeholder)] hover:text-[var(--foreground)] hover:bg-[var(--foreground)]/5 rounded-full transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2";
+export const MessageActions = React.forwardRef(function MessageActions({ content, className, onEdit }, ref) {
     const [copied, setCopied] = React.useState(false);
     const setCopiedWithTimeout = React.useCallback(() => {
         setCopied(true);
@@ -28,12 +29,11 @@ export function MessageActions({ content, className, }) {
             setCopiedWithTimeout();
         }
     }, [content, fallbackCopy, setCopiedWithTimeout]);
-    return (React.createElement("div", { className: cn("flex items-center gap-1 mt-2", className) },
-        React.createElement("button", { type: "button", onClick: handleCopy, className: "inline-flex items-center gap-1 px-2 py-1 text-xs text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors", title: copied ? "Copied!" : "Copy to clipboard" }, copied
-            ? (React.createElement(React.Fragment, null,
-                React.createElement(CheckIcon, { className: "size-3" }),
-                React.createElement("span", null, "Copied")))
-            : (React.createElement(React.Fragment, null,
-                React.createElement(CopyIcon, { className: "size-3" }),
-                React.createElement("span", null, "Copy"))))));
-}
+    return (React.createElement("div", { ref: ref, className: cn("flex items-center gap-0.5 mt-1.5 opacity-0 group-hover/msg:opacity-100 transition-all duration-200", className) },
+        React.createElement("button", { type: "button", onClick: handleCopy, className: ACTION_BUTTON, title: copied ? "Copied!" : "Copy to clipboard", "aria-label": copied ? "Copied!" : "Copy to clipboard" }, copied ? React.createElement(CheckIcon, { className: "size-3.5" }) : React.createElement(CopyIcon, { className: "size-3.5" })),
+        onEdit && (React.createElement("button", { type: "button", onClick: () => onEdit(content), className: ACTION_BUTTON, title: "Edit message", "aria-label": "Edit message" },
+            React.createElement("svg", { className: "size-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" },
+                React.createElement("path", { d: "M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" }),
+                React.createElement("path", { d: "m15 5 4 4" }))))));
+});
+MessageActions.displayName = "MessageActions";

package/esm/src/react/components/ai/chat/components/message-edit-form.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+export interface MessageEditFormProps {
+    initialContent: string;
+    onSave: (content: string) => void;
+    onCancel: () => void;
+}
+export declare function MessageEditForm({ initialContent, onSave, onCancel, }: MessageEditFormProps): React.ReactElement;
+//# sourceMappingURL=message-edit-form.d.ts.map

package/esm/src/react/components/ai/chat/components/message-edit-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-edit-form.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/message-edit-form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,oBAAoB;IACnC,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,eAAe,CAAC,EAC9B,cAAc,EACd,MAAM,EACN,QAAQ,GACT,EAAE,oBAAoB,GAAG,KAAK,CAAC,YAAY,CAiF3C"}

package/esm/src/react/components/ai/chat/components/message-edit-form.js

@@ -0,0 +1,46 @@
+import * as React from "react";
+import { cn } from "../../theme.js";
+export function MessageEditForm({ initialContent, onSave, onCancel, }) {
+    const [content, setContent] = React.useState(initialContent);
+    const textareaRef = React.useRef(null);
+    React.useEffect(() => {
+        const el = textareaRef.current;
+        if (!el)
+            return;
+        el.focus();
+        el.selectionStart = el.value.length;
+        el.style.height = "auto";
+        el.style.height = `${el.scrollHeight}px`;
+    }, []);
+    const resize = React.useCallback(() => {
+        const el = textareaRef.current;
+        if (!el)
+            return;
+        el.style.height = "auto";
+        el.style.height = `${el.scrollHeight}px`;
+    }, []);
+    const handleKeyDown = React.useCallback((e) => {
+        if (e.key === "Escape") {
+            e.preventDefault();
+            onCancel();
+        }
+        else if (e.key === "Enter" && !e.shiftKey) {
+            e.preventDefault();
+            const trimmed = content.trim();
+            if (trimmed)
+                onSave(trimmed);
+        }
+    }, [content, onSave, onCancel]);
+    return (React.createElement("div", { className: "w-full" },
+        React.createElement("textarea", { ref: textareaRef, value: content, onChange: (e) => {
+                setContent(e.target.value);
+                resize();
+            }, onKeyDown: handleKeyDown, rows: 1, className: cn("w-full resize-none rounded-xl px-4 py-3 text-[15px] leading-relaxed", "bg-[var(--accent)]", "border border-[var(--border)]", "focus:outline-none focus-visible:border-[var(--ring)]", "text-[var(--foreground)]") }),
+        React.createElement("div", { className: "flex items-center gap-2 mt-2" },
+            React.createElement("button", { type: "button", onClick: () => {
+                    const trimmed = content.trim();
+                    if (trimmed)
+                        onSave(trimmed);
+                }, disabled: !content.trim(), className: cn("px-3 py-1.5 text-xs font-medium rounded-full transition-all", "bg-[var(--primary)] text-[var(--primary-foreground)]", "hover:opacity-90", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2", "disabled:opacity-50 disabled:pointer-events-none") }, "Save & Submit"),
+            React.createElement("button", { type: "button", onClick: onCancel, className: "px-3 py-1.5 text-xs font-medium rounded-full text-[var(--muted-foreground)] hover:text-[var(--foreground)] hover:bg-[var(--foreground)]/5 transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2" }, "Cancel"))));
+}

package/esm/src/react/components/ai/chat/components/message-feedback.d.ts

@@ -0,0 +1,9 @@
+export type FeedbackValue = "positive" | "negative";
+export interface MessageFeedbackProps {
+    messageId: string;
+    feedback?: FeedbackValue | null;
+    onFeedback: (messageId: string, feedback: FeedbackValue) => void;
+    className?: string;
+}
+export declare const MessageFeedback: any;
+//# sourceMappingURL=message-feedback.d.ts.map

package/esm/src/react/components/ai/chat/components/message-feedback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-feedback.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/message-feedback.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAChC,UAAU,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAKD,eAAO,MAAM,eAAe,KAuD3B,CAAC"}

package/esm/src/react/components/ai/chat/components/message-feedback.js

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { cn } from "../../theme.js";
+const BUTTON_BASE = "inline-flex items-center justify-center size-7 rounded-full transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2";
+export const MessageFeedback = React.forwardRef(function MessageFeedback({ messageId, feedback, onFeedback, className }, ref) {
+    return (React.createElement("div", { ref: ref, className: cn("flex items-center gap-1", className) },
+        React.createElement("button", { type: "button", onClick: () => onFeedback(messageId, "positive"), className: cn(BUTTON_BASE, feedback === "positive"
+                ? "text-emerald-500 bg-emerald-500/10"
+                : "text-[var(--input-placeholder)] hover:text-emerald-500 hover:bg-[var(--accent)]"), title: "Helpful" },
+            React.createElement("svg", { className: "size-3.5", viewBox: "0 0 24 24", fill: feedback === "positive" ? "currentColor" : "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" },
+                React.createElement("path", { d: "M7 10v12" }),
+                React.createElement("path", { d: "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z" }))),
+        React.createElement("button", { type: "button", onClick: () => onFeedback(messageId, "negative"), className: cn(BUTTON_BASE, feedback === "negative"
+                ? "text-red-500 bg-red-500/10"
+                : "text-[var(--input-placeholder)] hover:text-[var(--destructive)] hover:bg-[var(--accent)]"), title: "Not helpful" },
+            React.createElement("svg", { className: "size-3.5", viewBox: "0 0 24 24", fill: feedback === "negative" ? "currentColor" : "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" },
+                React.createElement("path", { d: "M17 14V2" }),
+                React.createElement("path", { d: "M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z" })))));
+});
+MessageFeedback.displayName = "MessageFeedback";

package/esm/src/react/components/ai/chat/components/quick-actions.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+export interface QuickAction {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    prompt?: string;
+}
+export interface QuickActionsProps {
+    actions?: QuickAction[];
+    onActionClick?: (action: QuickAction) => void;
+    className?: string;
+}
+export declare function QuickActions({ actions, onActionClick, className, }: QuickActionsProps): React.ReactElement | null;
+//# sourceMappingURL=quick-actions.d.ts.map

package/esm/src/react/components/ai/chat/components/quick-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"quick-actions.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/quick-actions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,aAAa,EACb,SAAS,GACV,EAAE,iBAAiB,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CAiB/C"}

package/esm/src/react/components/ai/chat/components/quick-actions.js

@@ -0,0 +1,7 @@
+import * as React from "react";
+import { cn } from "../../theme.js";
+export function QuickActions({ actions, onActionClick, className, }) {
+    if (!actions || actions.length === 0)
+        return null;
+    return (React.createElement("div", { className: cn("flex flex-wrap gap-2", className) }, actions.map((action) => (React.createElement("button", { key: action.id, type: "button", onClick: () => onActionClick?.(action), className: "rounded-full border border-[var(--border)] px-4 py-2 text-sm text-[var(--muted-foreground)] transition-colors hover:bg-[var(--foreground)]/[0.03] hover:text-[var(--foreground)] hover:border-[var(--input-border)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]" }, action.label)))));
+}

package/esm/src/react/components/ai/chat/components/reasoning.d.ts

@@ -1,8 +1,7 @@
-import * as React from "react";
-type ReasoningCardProps = {
+export type ReasoningCardProps = {
     text: string;
     isStreaming?: boolean;
+    className?: string;
 };
-export declare function ReasoningCard({ text, isStreaming, }: ReasoningCardProps): React.JSX.Element;
-export {};
+export declare const ReasoningCard: any;
 //# sourceMappingURL=reasoning.d.ts.map

package/esm/src/react/components/ai/chat/components/reasoning.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reasoning.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/reasoning.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,KAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,WAAmB,GACpB,EAAE,kBAAkB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAmCxC"}
+{"version":3,"file":"reasoning.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/reasoning.tsx"],"names":[],"mappings":"AAOA,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,aAAa,KAyCzB,CAAC"}

package/esm/src/react/components/ai/chat/components/reasoning.js

@@ -4,22 +4,27 @@ import { cn } from "../../theme.js";
 import { Markdown } from "../../markdown.js";
 import { BrainIcon, ChevronDownIcon } from "../../icons/index.js";
 import { Shimmer } from "./animations.js";
-export function ReasoningCard({ text, isStreaming = false, }) {
+export const ReasoningCard = React.forwardRef(function ReasoningCard({ text, isStreaming = false, className }, ref) {
     const [isOpen, setIsOpen] = React.useState(true);
+    const userToggledRef = React.useRef(false);
     React.useEffect(() => {
-        if (isStreaming || !isOpen)
+        if (isStreaming || !isOpen || userToggledRef.current)
             return;
         const timer = dntShim.setTimeout(() => setIsOpen(false), 1000);
         return () => clearTimeout(timer);
     }, [isStreaming, isOpen]);
     const label = isStreaming ? React.createElement(Shimmer, null, "Thinking...") : React.createElement("span", null, "Thought process");
-    return (React.createElement("div", { className: "not-prose mb-4" },
-        React.createElement("button", { type: "button", onClick: () => setIsOpen((open) => !open), className: "flex w-full items-center gap-2 text-muted-foreground text-sm transition-colors hover:text-foreground" },
+    return (React.createElement("div", { ref: ref, className: cn("not-prose mb-4", className) },
+        React.createElement("button", { type: "button", onClick: () => {
+                userToggledRef.current = true;
+                setIsOpen((open) => !open);
+            }, className: "flex w-full items-center gap-2 text-[var(--input-placeholder)] text-sm transition-colors hover:text-[var(--foreground)]" },
             React.createElement(BrainIcon, { className: "size-4" }),
             label,
             React.createElement(ChevronDownIcon, { className: cn("size-4 transition-transform", isOpen && "rotate-180") })),
         isOpen
-            ? (React.createElement("div", { className: "mt-4 text-sm text-muted-foreground border-l-2 border-muted pl-4 ml-2" },
+            ? (React.createElement("div", { className: "mt-4 text-sm text-[var(--muted-foreground)] border-l-2 border-[var(--border)] pl-4 ml-2" },
                 React.createElement(Markdown, { className: "text-sm" }, text)))
             : null));
-}
+});
+ReasoningCard.displayName = "ReasoningCard";

package/esm/src/react/components/ai/chat/components/sidebar.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import type { Thread } from "../hooks/use-threads.js";
+export interface ChatSidebarProps {
+    threads: Thread[];
+    activeThreadId: string | null;
+    onSelectThread: (id: string) => void;
+    onDeleteThread: (id: string) => void;
+    onRenameThread?: (id: string, title: string) => void;
+    onNewThread?: () => void;
+    className?: string;
+    isOpen?: boolean;
+}
+export declare function ChatSidebar({ threads, activeThreadId, onSelectThread, onDeleteThread, onRenameThread, onNewThread, className, isOpen, }: ChatSidebarProps): React.ReactElement | null;
+//# sourceMappingURL=sidebar.d.ts.map

package/esm/src/react/components/ai/chat/components/sidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEtD,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,cAAc,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAuHD,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,WAAW,EACX,SAAS,EACT,MAAa,GACd,EAAE,gBAAgB,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CA6D9C"}

package/esm/src/react/components/ai/chat/components/sidebar.js

@@ -0,0 +1,92 @@
+import * as React from "react";
+import { cn } from "../../theme.js";
+import { MessageSquareIcon, PlusIcon, TrashIcon } from "../../icons/index.js";
+function getRelativeGroup(timestamp) {
+    const day = 86_400_000;
+    const diff = Date.now() - timestamp;
+    const todayStart = new Date();
+    todayStart.setHours(0, 0, 0, 0);
+    const yesterdayStart = new Date(todayStart.getTime() - day);
+    if (timestamp >= todayStart.getTime())
+        return "Today";
+    if (timestamp >= yesterdayStart.getTime())
+        return "Yesterday";
+    if (diff < 7 * day)
+        return "Previous 7 days";
+    return "Older";
+}
+function groupThreads(threads) {
+    const groups = new Map();
+    const order = ["Today", "Yesterday", "Previous 7 days", "Older"];
+    for (const label of order) {
+        groups.set(label, []);
+    }
+    for (const thread of threads) {
+        const label = getRelativeGroup(thread.updatedAt);
+        groups.get(label).push(thread);
+    }
+    for (const [key, value] of groups) {
+        if (value.length === 0)
+            groups.delete(key);
+    }
+    return groups;
+}
+function ThreadItem({ thread, isActive, onSelect, onDelete, onRename, }) {
+    const [editing, setEditing] = React.useState(false);
+    const [editValue, setEditValue] = React.useState(thread.title);
+    const inputRef = React.useRef(null);
+    React.useEffect(() => {
+        if (editing)
+            inputRef.current?.focus();
+    }, [editing]);
+    function handleDoubleClick() {
+        if (!onRename)
+            return;
+        setEditValue(thread.title);
+        setEditing(true);
+    }
+    function commitRename() {
+        setEditing(false);
+        const trimmed = editValue.trim();
+        if (trimmed && trimmed !== thread.title) {
+            onRename?.(trimmed);
+        }
+    }
+    return (React.createElement("div", { className: cn("group/thread flex items-center gap-2.5 px-3 py-2.5 rounded-xl cursor-pointer transition-all", isActive
+            ? "bg-[var(--foreground)]/[0.05] text-[var(--foreground)]"
+            : "text-[var(--muted-foreground)] hover:bg-[var(--foreground)]/[0.03] hover:text-[var(--foreground)]"), onClick: !editing ? onSelect : undefined, onDoubleClick: handleDoubleClick },
+        React.createElement(MessageSquareIcon, { className: "size-4 shrink-0 opacity-50" }),
+        editing
+            ? (React.createElement("input", { ref: inputRef, value: editValue, onChange: (e) => setEditValue(e.target.value), onBlur: commitRename, onKeyDown: (e) => {
+                    if (e.key === "Enter")
+                        commitRename();
+                    if (e.key === "Escape")
+                        setEditing(false);
+                }, className: "flex-1 min-w-0 bg-transparent text-sm outline-none border-b border-[var(--input-border)]" }))
+            : (React.createElement("span", { className: "flex-1 min-w-0 truncate text-[13px] leading-snug" }, thread.title)),
+        !editing && (React.createElement("button", { type: "button", onClick: (e) => {
+                e.stopPropagation();
+                onDelete();
+            }, className: "shrink-0 opacity-0 group-hover/thread:opacity-100 p-0.5 text-[var(--muted-foreground)] hover:text-[var(--destructive)] transition-all rounded", "aria-label": "Delete thread" },
+            React.createElement(TrashIcon, { className: "size-3.5" })))));
+}
+export function ChatSidebar({ threads, activeThreadId, onSelectThread, onDeleteThread, onRenameThread, onNewThread, className, isOpen = true, }) {
+    const visibleThreads = React.useMemo(() => threads.filter((t) => t.messages.length > 0 || t.id === activeThreadId), [threads, activeThreadId]);
+    const grouped = React.useMemo(() => groupThreads(visibleThreads), [visibleThreads]);
+    const hasThreads = visibleThreads.length > 0;
+    if (!isOpen)
+        return null;
+    return (React.createElement("div", { className: cn("flex flex-col h-full shrink-0 max-sm:absolute max-sm:z-20 max-sm:shadow-xl max-sm:bg-[var(--background)]", className), style: { width: 240 } },
+        onNewThread && (React.createElement("div", { className: "px-3 pt-4 pb-1" },
+            React.createElement("button", { type: "button", onClick: onNewThread, className: "w-full inline-flex items-center justify-center gap-1.5 h-9 px-4 rounded-full text-sm font-medium text-[var(--foreground)] bg-[var(--card)] hover:opacity-80 transition-all" },
+                React.createElement(PlusIcon, { className: "size-4" }),
+                React.createElement("span", null, "New Chat")))),
+        React.createElement("div", { className: "flex-1 overflow-y-auto px-2 pt-2 pb-3 space-y-4" }, hasThreads
+            ? Array.from(grouped.entries()).map(([label, items]) => (React.createElement("div", { key: label },
+                React.createElement("div", { className: "px-3 py-1.5 text-[11px] font-semibold uppercase tracking-wider text-[var(--input-placeholder)]" }, label),
+                React.createElement("div", { className: "space-y-1" }, items.map((thread) => (React.createElement(ThreadItem, { key: thread.id, thread: thread, isActive: thread.id === activeThreadId, onSelect: () => onSelectThread(thread.id), onDelete: () => onDeleteThread(thread.id), onRename: onRenameThread
+                        ? (title) => onRenameThread(thread.id, title)
+                        : undefined })))))))
+            : (React.createElement("div", { className: "flex flex-col items-center justify-center h-full px-4 text-center text-[var(--muted-foreground)]" },
+                React.createElement("p", { className: "text-sm" }, "No chats yet"))))));
+}

package/esm/src/react/components/ai/chat/components/skill-badge.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Skill Badge — compact indicator for skill tool calls (load-skill, load-skill-reference, execute-skill-script).
+ * @module ai/react/components/chat/components/skill-badge
+ */
+import * as React from "react";
+import type { DynamicToolUIPart, ToolUIPart } from "../../../../../agent/react/index.js";
+export interface SkillBadgeProps {
+    tool: ToolUIPart | DynamicToolUIPart;
+    className?: string;
+}
+export declare function SkillBadge({ tool, className }: SkillBadgeProps): React.JSX.Element;
+//# sourceMappingURL=skill-badge.d.ts.map

package/esm/src/react/components/ai/chat/components/skill-badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-badge.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/skill-badge.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AAEzF,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,UAAU,GAAG,iBAAiB,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAmClF"}

package/esm/src/react/components/ai/chat/components/skill-badge.js

@@ -0,0 +1,34 @@
+/**
+ * Skill Badge — compact indicator for skill tool calls (load-skill, load-skill-reference, execute-skill-script).
+ * @module ai/react/components/chat/components/skill-badge
+ */
+import * as React from "react";
+import { cn } from "../../theme.js";
+import { CheckCircleIcon, SparklesIcon, XCircleIcon } from "../../icons/index.js";
+export function SkillBadge({ tool, className }) {
+    const input = tool.input;
+    const skillId = input?.skillId;
+    const isComplete = tool.state === "output-available";
+    const isError = tool.state === "output-error";
+    let label;
+    if (tool.toolName === "load-skill") {
+        label = isComplete
+            ? `Skill: ${skillId ?? "unknown"}`
+            : `Loading skill${skillId ? `: ${skillId}` : ""}...`;
+    }
+    else if (tool.toolName === "load-skill-reference") {
+        const ref = input?.reference;
+        label = isComplete ? `Reference: ${ref ?? "unknown"}` : `Reading${ref ? `: ${ref}` : ""}...`;
+    }
+    else {
+        const script = input?.script;
+        label = isComplete
+            ? `Script: ${script ?? "complete"}`
+            : `Running${script ? `: ${script}` : ""}...`;
+    }
+    return (React.createElement("span", { className: cn("inline-flex items-center gap-1.5 rounded-full px-2.5 py-1 text-xs font-medium", "bg-[var(--accent)] text-[var(--muted-foreground)] border border-[var(--border)]", className) },
+        React.createElement(SparklesIcon, { className: cn("size-3", !isComplete && !isError && "animate-pulse") }),
+        React.createElement("span", null, label),
+        isComplete && React.createElement(CheckCircleIcon, { className: "size-3 text-[var(--success)]" }),
+        isError && React.createElement(XCircleIcon, { className: "size-3 text-[var(--destructive)]" })));
+}

package/esm/src/react/components/ai/chat/components/sources.d.ts

@@ -0,0 +1,13 @@
+export interface Source {
+    title: string;
+    url?: string;
+    score?: number;
+    snippet?: string;
+}
+export interface SourcesProps {
+    sources: Source[];
+    className?: string;
+    onSourceClick?: (source: Source, index: number) => void;
+}
+export declare const Sources: any;
+//# sourceMappingURL=sources.d.ts.map

package/esm/src/react/components/ai/chat/components/sources.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sources.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/sources.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzD;AAED,eAAO,MAAM,OAAO,KAuBnB,CAAC"}

package/esm/src/react/components/ai/chat/components/sources.js

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { cn } from "../../theme.js";
+export const Sources = React.forwardRef(function Sources({ sources, className, onSourceClick }, ref) {
+    if (sources.length === 0)
+        return null;
+    return (React.createElement("div", { ref: ref, className: cn("mt-3 pt-3 border-t border-[var(--border)]", className) },
+        React.createElement("p", { className: "text-xs font-medium text-[var(--muted-foreground)] mb-2" }, "Sources"),
+        React.createElement("div", { className: "flex flex-wrap gap-1.5" }, sources.map((source, index) => (React.createElement(SourcePill, { key: `${source.title}-${index}`, source: source, index: index, onClick: onSourceClick ? () => onSourceClick(source, index) : undefined }))))));
+});
+Sources.displayName = "Sources";
+function SourcePill({ source, index, onClick }) {
+    const [showPreview, setShowPreview] = React.useState(false);
+    return (React.createElement("span", { className: "relative" },
+        React.createElement("button", { type: "button", onClick: onClick, onMouseEnter: () => setShowPreview(true), onMouseLeave: () => setShowPreview(false), className: cn("inline-flex items-center gap-1.5 px-2.5 py-1.5 rounded-full text-xs", "bg-[var(--accent)] text-[var(--card-foreground)]", "hover:bg-[var(--accent)] transition-colors", onClick ? "cursor-pointer" : "cursor-default") },
+            React.createElement("span", { className: "flex items-center justify-center size-4 rounded bg-[var(--border)] text-[10px] font-medium text-[var(--card-foreground)]" }, index + 1),
+            React.createElement("span", { className: "truncate max-w-[160px]" }, source.title),
+            source.score != null && (React.createElement("span", { className: "flex items-center gap-1 shrink-0 ml-0.5" },
+                React.createElement("span", { className: cn("size-1.5 rounded-full", source.score >= 0.7
+                        ? "bg-emerald-500"
+                        : source.score >= 0.4
+                            ? "bg-amber-500"
+                            : "bg-neutral-400") })))),
+        showPreview && source.snippet && (React.createElement("div", { className: "absolute bottom-full left-0 mb-2 z-50 w-60 pointer-events-none" },
+            React.createElement("div", { className: "bg-[var(--card)] border border-[var(--border)] rounded-xl shadow-lg p-2.5 text-left" },
+                React.createElement("p", { className: "text-xs text-[var(--card-foreground)] line-clamp-3 leading-relaxed" },
+                    source.snippet.slice(0, 150),
+                    source.snippet.length > 150 ? "..." : ""))))));
+}

package/esm/src/react/components/ai/chat/components/step-indicator.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+export interface StepIndicatorProps {
+    stepIndex: number;
+    isComplete: boolean;
+    className?: string;
+}
+export declare function StepIndicator({ stepIndex, isComplete, className, }: StepIndicatorProps): React.ReactElement;
+//# sourceMappingURL=step-indicator.d.ts.map

package/esm/src/react/components/ai/chat/components/step-indicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"step-indicator.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/step-indicator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,UAAU,EACV,SAAS,GACV,EAAE,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAkBzC"}

package/esm/src/react/components/ai/chat/components/step-indicator.js

@@ -0,0 +1,15 @@
+import * as React from "react";
+import { cn } from "../../theme.js";
+import { CheckCircleIcon } from "../../icons/index.js";
+export function StepIndicator({ stepIndex, isComplete, className, }) {
+    return (React.createElement("div", { className: cn("flex items-center gap-3 py-3 text-xs text-[var(--muted-foreground)]", className) },
+        React.createElement("div", { className: "flex-1 h-px bg-[var(--border)]" }),
+        React.createElement("div", { className: "flex items-center gap-1.5 px-2 py-0.5 rounded-full border border-[var(--border)] bg-[var(--accent)]" },
+            isComplete
+                ? React.createElement(CheckCircleIcon, { className: "size-3.5 text-[var(--success)]" })
+                : React.createElement("span", { className: "size-2 rounded-full bg-[var(--muted-foreground)] animate-pulse" }),
+            React.createElement("span", { className: "font-medium" },
+                "Step ",
+                stepIndex + 1)),
+        React.createElement("div", { className: "flex-1 h-px bg-[var(--border)]" })));
+}

package/esm/src/react/components/ai/chat/components/tab-switcher.d.ts

@@ -0,0 +1,16 @@
+/**
+ * TabSwitcher — Animated tab pill matching the Studio Tabs pattern.
+ *
+ * Uses a CSS-only sliding indicator (no Framer Motion dependency) with
+ * spring-like cubic-bezier easing to approximate Studio's motion.div.
+ * WAI-ARIA tabs pattern with keyboard navigation.
+ */
+import * as React from "react";
+export type ChatTab = "chat" | "uploads";
+export interface TabSwitcherProps {
+    activeTab: ChatTab;
+    onTabChange: (tab: ChatTab) => void;
+    className?: string;
+}
+export declare function TabSwitcher({ activeTab, onTabChange, className, }: TabSwitcherProps): React.ReactElement;
+//# sourceMappingURL=tab-switcher.d.ts.map

package/esm/src/react/components/ai/chat/components/tab-switcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-switcher.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/tab-switcher.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,MAAM,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;AAEzC,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAOD,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,WAAW,EACX,SAAS,GACV,EAAE,gBAAgB,GAAG,KAAK,CAAC,YAAY,CAwCvC"}

package/esm/src/react/components/ai/chat/components/tab-switcher.js

@@ -0,0 +1,28 @@
+/**
+ * TabSwitcher — Animated tab pill matching the Studio Tabs pattern.
+ *
+ * Uses a CSS-only sliding indicator (no Framer Motion dependency) with
+ * spring-like cubic-bezier easing to approximate Studio's motion.div.
+ * WAI-ARIA tabs pattern with keyboard navigation.
+ */
+import * as React from "react";
+import { cn } from "../../theme.js";
+const TABS = [
+    { value: "chat", label: "Chat" },
+    { value: "uploads", label: "Uploads" },
+];
+export function TabSwitcher({ activeTab, onTabChange, className, }) {
+    return (React.createElement("div", { className: cn("flex items-center justify-center py-5", className) },
+        React.createElement("div", { role: "tablist", "aria-label": "Chat view", className: "inline-flex w-fit items-center gap-1 p-1 rounded-full bg-[var(--tab-background)] h-[38px]" }, TABS.map((tab) => {
+            const isActive = activeTab === tab.value;
+            return (React.createElement("button", { key: tab.value, type: "button", role: "tab", "aria-selected": isActive, tabIndex: isActive ? 0 : -1, onClick: () => onTabChange(tab.value), onKeyDown: (e) => {
+                    if (e.key === "ArrowRight" || e.key === "ArrowLeft") {
+                        e.preventDefault();
+                        const next = tab.value === "chat" ? "uploads" : "chat";
+                        onTabChange(next);
+                    }
+                }, className: cn("inline-flex items-center h-full px-5 text-sm font-medium rounded-full transition-colors cursor-pointer", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]", isActive
+                    ? "bg-[var(--tab-active-background)] text-[var(--tab-active-foreground)]"
+                    : "text-[var(--tab-foreground)]") }, tab.label));
+        }))));
+}

package/esm/src/react/components/ai/chat/components/tool-ui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tool-ui.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/tool-ui.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AA4BzF,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAS/E;AA8ED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,GACL,EAAE;IACD,IAAI,EAAE,UAAU,GAAG,iBAAiB,CAAC;CACtC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA+DpB"}
+{"version":3,"file":"tool-ui.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/components/tool-ui.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AA4BzF,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAS/E;AA8ED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,GACL,EAAE;IACD,IAAI,EAAE,UAAU,GAAG,iBAAiB,CAAC;CACtC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAiEpB"}