veryfront 0.1.47 → 0.1.49

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

@@ -0,0 +1,165 @@
+import * as React from "react";
+import { cn, generateTokenCSS } from "./theme.js";
+import { Chat } from "./chat/index.js";
+import { ChatSidebar } from "./chat/components/sidebar.js";
+import { TabSwitcher } from "./chat/components/tab-switcher.js";
+import { useThreads } from "./chat/hooks/use-threads.js";
+import { PanelLeftIcon } from "./icons/index.js";
+export const ChatWithSidebar = React.forwardRef(function ChatWithSidebar({ chat, sidebar, models, attachments, quickActions, message, features, tabs, voice, className, maxHeight, theme, placeholder, emptyState, children, }, ref) {
+    const storageKey = sidebar?.storageKey;
+    const controlledOpen = sidebar?.open;
+    const onSidebarToggle = sidebar?.onToggle;
+    const showSidebar = sidebar?.visible ?? true;
+    const setMessages = chat.setMessages;
+    const messages = chat.messages;
+    const model = chat.model;
+    const onModelChange = chat.onModelChange;
+    const controlledTab = tabs?.active;
+    const chatProps = {
+        input: chat.input,
+        onChange: chat.onChange,
+        onSubmit: chat.onSubmit,
+        stop: chat.stop,
+        reload: chat.reload,
+        setInput: chat.setInput,
+        isLoading: chat.isLoading,
+        error: chat.error,
+        placeholder,
+        maxHeight,
+        theme,
+        renderMessage: message?.render,
+        renderTool: message?.renderTool,
+        suggestions: quickActions?.suggestions,
+        onSuggestionClick: quickActions?.onSuggestionClick,
+        emptyState,
+        showScrollButton: features?.scrollButton,
+        showMessageActions: features?.messageActions,
+        models: models?.options,
+        activeModel: chat.activeModel,
+        inferenceMode: chat.inferenceMode,
+        browserStatus: chat.browserStatus,
+        showSources: features?.sources,
+        onSourceClick: message?.onSourceClick,
+        onAttach: attachments?.onAttach,
+        onDrop: attachments?.onDrop,
+        attachAccept: attachments?.accept,
+        attachments: attachments?.items,
+        onRemoveAttachment: attachments?.onRemoveItem,
+        showExport: features?.export,
+        onFeedback: message?.onFeedback,
+        editMessage: chat.editMessage,
+        getBranches: chat.getBranches,
+        switchBranch: chat.switchBranch,
+        showSteps: features?.steps,
+        showTabs: features?.tabs,
+        uploads: attachments?.uploads,
+        onRemoveUpload: attachments?.onRemoveUpload,
+        quickActions: quickActions?.actions,
+        onQuickAction: quickActions?.onAction,
+        enableVoice: voice?.enabled,
+        onVoice: voice?.onVoice,
+        children,
+    };
+    const { activeThreadId, createThread, deleteThread, renameThread, selectThread, threads, updateThread, } = useThreads({ storageKey });
+    const [internalOpen, setInternalOpen] = React.useState(false);
+    const [internalTab, setInternalTab] = React.useState("chat");
+    const showTabs = chatProps.showTabs ?? false;
+    const isSidebarControlled = controlledOpen !== undefined;
+    const sidebarOpen = isSidebarControlled ? controlledOpen : internalOpen;
+    const toggleSidebar = React.useCallback(() => {
+        if (isSidebarControlled) {
+            onSidebarToggle?.();
+            return;
+        }
+        setInternalOpen((prev) => {
+            const next = !prev;
+            onSidebarToggle?.();
+            return next;
+        });
+    }, [isSidebarControlled, onSidebarToggle]);
+    const isTabControlled = controlledTab !== undefined;
+    const activeTab = controlledTab ?? internalTab;
+    const handleTabChange = React.useCallback((tab) => {
+        if (!isTabControlled) {
+            setInternalTab(tab);
+        }
+        tabs?.onChange?.(tab);
+    }, [isTabControlled, tabs]);
+    // Keep refs in sync so callbacks always read current values
+    const activeIdRef = React.useRef(activeThreadId);
+    activeIdRef.current = activeThreadId;
+    const messagesRef = React.useRef(messages);
+    messagesRef.current = messages;
+    const threadsRef = React.useRef(threads);
+    threadsRef.current = threads;
+    // Sync current messages to active thread on change
+    const prevMessagesRef = React.useRef(messages);
+    React.useEffect(() => {
+        const currentActiveId = activeIdRef.current;
+        if (!currentActiveId || messages === prevMessagesRef.current)
+            return;
+        prevMessagesRef.current = messages;
+        if (messages.length > 0) {
+            // Auto-title from first user message — combine with message sync
+            // into a single updateThread call to avoid racing setThreads batches
+            const activeThread = threadsRef.current.find((t) => t.id === currentActiveId);
+            let title;
+            if (activeThread?.title === "New Chat") {
+                const firstUserMsg = messages.find((m) => m.role === "user");
+                if (firstUserMsg) {
+                    const text = firstUserMsg.parts
+                        .filter((p) => p.type === "text")
+                        .map((p) => p.text)
+                        .join("")
+                        .trim();
+                    if (text)
+                        title = text.slice(0, 30);
+                }
+            }
+            updateThread(currentActiveId, title ? { messages, title } : { messages });
+        }
+    }, [messages, updateThread]);
+    const setInput = chat.setInput;
+    const stopChat = chat.stop;
+    const handleSelectThread = React.useCallback((id) => {
+        stopChat?.();
+        const currentActiveId = activeIdRef.current;
+        if (currentActiveId && messagesRef.current.length > 0) {
+            updateThread(currentActiveId, { messages: messagesRef.current });
+        }
+        selectThread(id);
+        const thread = threadsRef.current.find((t) => t.id === id);
+        setMessages(thread?.messages ?? []);
+        setInput?.("");
+    }, [selectThread, updateThread, setMessages, setInput, stopChat]);
+    const handleNewThread = React.useCallback(() => {
+        stopChat?.();
+        const currentActiveId = activeIdRef.current;
+        if (currentActiveId && messagesRef.current.length > 0) {
+            updateThread(currentActiveId, { messages: messagesRef.current });
+        }
+        const nextThread = createThread();
+        setMessages(nextThread.messages);
+        setInput?.("");
+    }, [createThread, updateThread, setMessages, setInput, stopChat]);
+    if (!showSidebar) {
+        return (React.createElement(Chat, { ref: ref, messages: messages, model: model, onModelChange: onModelChange, className: className, ...chatProps }));
+    }
+    const tokenCSS = React.useMemo(() => generateTokenCSS(), []);
+    return (React.createElement("div", { ref: ref, className: cn("flex h-full bg-[var(--background)]", className), "data-vf-chat": "" },
+        React.createElement("style", { dangerouslySetInnerHTML: { __html: tokenCSS } }),
+        sidebarOpen && (React.createElement(ChatSidebar, { threads: threads, activeThreadId: activeThreadId, onSelectThread: handleSelectThread, onDeleteThread: (id) => {
+                deleteThread(id);
+                const next = threadsRef.current.find((t) => t.id !== id);
+                setMessages(next?.messages ?? []);
+            }, onRenameThread: renameThread, onNewThread: handleNewThread })),
+        React.createElement("div", { className: "flex-1 min-w-0 flex flex-col" },
+            React.createElement("div", { className: "flex items-center px-3 pt-4 pb-1 shrink-0" },
+                React.createElement("button", { type: "button", onClick: toggleSidebar, className: "size-8 inline-flex items-center justify-center 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", "aria-label": sidebarOpen ? "Close sidebar" : "Open sidebar" },
+                    React.createElement(PanelLeftIcon, { className: "size-[18px]" })),
+                showTabs && (React.createElement("div", { className: "flex-1 flex justify-center" },
+                    React.createElement(TabSwitcher, { activeTab: activeTab, onTabChange: handleTabChange, className: "py-0" }))),
+                showTabs && React.createElement("div", { className: "size-8 shrink-0" })),
+            React.createElement(Chat, { messages: messages, model: model, onModelChange: onModelChange, className: "flex-1 min-h-0", activeTab: activeTab, onTabChange: handleTabChange, hideTabSwitcher: true, ...chatProps }))));
+});
+ChatWithSidebar.displayName = "ChatWithSidebar";

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

@@ -1,3 +1,12 @@
-export { Chat, ChatComponents, ChatFooter, ChatHeader, ChatInput, ChatMessages, type ChatProps, ConversationEmptyState, type ConversationEmptyStateProps, ConversationScrollButton, type ConversationScrollButtonProps, getTextContent, groupPartsInOrder, isReasoningPart, isToolPart, Loader, MessageActions, type MessageActionsProps, type PartGroup, ReasoningCard, Shimmer, Suggestion, type SuggestionProps, Suggestions, type SuggestionsProps, ToolCallCard, ToolStatusBadge, } from "./chat/index.js";
+/**
+ * Chat re-export aggregator — single import path for all chat components.
+ *
+ * @module ai/react/components/ai/chat
+ */
+export { Chat, ChatComponents, type ChatProps } from "./chat/index.js";
+export { ChatComposer, type ChatComposerProps, ChatEmpty, type ChatEmptyProps, ChatIf, type ChatIfProps, ChatMessageList, type ChatMessageListProps, ChatRoot, type ChatRootProps, ErrorBanner, type ErrorBannerProps, Message, type MessageRootProps, ModelAvatar, type ModelAvatarProps, } from "./chat/index.js";
+export { ChatContextProvider, type ChatContextValue, ComposerContextProvider, type ComposerContextValue, MessageContextProvider, type MessageContextValue, ThreadListContextProvider, type ThreadListContextValue, useChatContext, useChatContextOptional, useComposerContext, useComposerContextOptional, useMessageContext, useMessageContextOptional, useThreadListContext, useThreadListContextOptional, } from "./chat/index.js";
+export { type AttachmentInfo, AttachmentPill, type AttachmentPillProps, BranchPicker, type BranchPickerProps, ChatSidebar, type ChatSidebarProps, type ChatTab, type CodeBlockProps, ConversationEmptyState, type ConversationEmptyStateProps, ConversationScrollButton, type ConversationScrollButtonProps, downloadMarkdown, DropZoneOverlay, type DropZoneOverlayProps, exportAsMarkdown, extractSourcesFromParts, FadeIn, type FeedbackValue, getTextContent, groupPartsInOrder, InferenceBadge, type InferenceBadgeProps, InlineCitation, type InlineCitationProps, isReasoningPart, isSkillToolPart, isToolPart, Loader, MessageActions, type MessageActionsProps, MessageEditForm, type MessageEditFormProps, MessageFeedback, type MessageFeedbackProps, type PartGroup, type QuickAction, QuickActions, type QuickActionsProps, ReasoningCard, RichCodeBlock, Shimmer, SkillBadge, type SkillBadgeProps, type Source, Sources, type SourcesProps, StepIndicator, type StepIndicatorProps, Suggestion, type SuggestionProps, Suggestions, type SuggestionsProps, TabSwitcher, type TabSwitcherProps, type Thread, ToolCallCard, ToolStatusBadge, UpgradeCTA, type UpgradeCTAProps, type UploadedFile, UploadsPanel, type UploadsPanelProps, useThreads, type UseThreadsOptions, type UseThreadsResult, } from "./chat/index.js";
 export { type ModelOption, ModelSelector, type ModelSelectorProps } from "./model-selector.js";
+export { ChatWithSidebar, type ChatWithSidebarAttachmentConfig, type ChatWithSidebarChatController, type ChatWithSidebarFeatureConfig, type ChatWithSidebarGroupedProps, type ChatWithSidebarMessageConfig, type ChatWithSidebarModelConfig, type ChatWithSidebarProps, type ChatWithSidebarQuickActionsConfig, type ChatWithSidebarSidebarConfig, type ChatWithSidebarTabsConfig, type ChatWithSidebarVoiceConfig, } from "./chat-with-sidebar.js";
 //# sourceMappingURL=chat.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"chat.d.ts","sourceRoot":"","sources":["../../../../../src/src/react/components/ai/chat.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,cAAc,EACd,UAAU,EACV,UAAU,EACV,SAAS,EACT,YAAY,EACZ,KAAK,SAAS,EACd,sBAAsB,EACtB,KAAK,2BAA2B,EAChC,wBAAwB,EACxB,KAAK,6BAA6B,EAClC,cAAc,EACd,iBAAiB,EACjB,eAAe,EACf,UAAU,EACV,MAAM,EACN,cAAc,EACd,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACd,aAAa,EACb,OAAO,EACP,UAAU,EACV,KAAK,eAAe,EACpB,WAAW,EACX,KAAK,gBAAgB,EACrB,YAAY,EACZ,eAAe,GAChB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,KAAK,WAAW,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"chat.d.ts","sourceRoot":"","sources":["../../../../../src/src/react/components/ai/chat.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAKH,OAAO,EAAE,IAAI,EAAE,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAKvE,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,SAAS,EACT,KAAK,cAAc,EACnB,MAAM,EACN,KAAK,WAAW,EAChB,eAAe,EACf,KAAK,oBAAoB,EACzB,QAAQ,EACR,KAAK,aAAa,EAClB,WAAW,EACX,KAAK,gBAAgB,EACrB,OAAO,EACP,KAAK,gBAAgB,EACrB,WAAW,EACX,KAAK,gBAAgB,GACtB,MAAM,iBAAiB,CAAC;AAKzB,OAAO,EACL,mBAAmB,EACnB,KAAK,gBAAgB,EACrB,uBAAuB,EACvB,KAAK,oBAAoB,EACzB,sBAAsB,EACtB,KAAK,mBAAmB,EACxB,yBAAyB,EACzB,KAAK,sBAAsB,EAC3B,cAAc,EACd,sBAAsB,EACtB,kBAAkB,EAClB,0BAA0B,EAC1B,iBAAiB,EACjB,yBAAyB,EACzB,oBAAoB,EACpB,4BAA4B,GAC7B,MAAM,iBAAiB,CAAC;AAKzB,OAAO,EACL,KAAK,cAAc,EACnB,cAAc,EACd,KAAK,mBAAmB,EACxB,YAAY,EACZ,KAAK,iBAAiB,EACtB,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,OAAO,EACZ,KAAK,cAAc,EACnB,sBAAsB,EACtB,KAAK,2BAA2B,EAChC,wBAAwB,EACxB,KAAK,6BAA6B,EAClC,gBAAgB,EAChB,eAAe,EACf,KAAK,oBAAoB,EACzB,gBAAgB,EAChB,uBAAuB,EACvB,MAAM,EACN,KAAK,aAAa,EAClB,cAAc,EACd,iBAAiB,EACjB,cAAc,EACd,KAAK,mBAAmB,EACxB,cAAc,EACd,KAAK,mBAAmB,EACxB,eAAe,EACf,eAAe,EACf,UAAU,EACV,MAAM,EACN,cAAc,EACd,KAAK,mBAAmB,EACxB,eAAe,EACf,KAAK,oBAAoB,EACzB,eAAe,EACf,KAAK,oBAAoB,EACzB,KAAK,SAAS,EACd,KAAK,WAAW,EAChB,YAAY,EACZ,KAAK,iBAAiB,EACtB,aAAa,EACb,aAAa,EACb,OAAO,EACP,UAAU,EACV,KAAK,eAAe,EACpB,KAAK,MAAM,EACX,OAAO,EACP,KAAK,YAAY,EACjB,aAAa,EACb,KAAK,kBAAkB,EACvB,UAAU,EACV,KAAK,eAAe,EACpB,WAAW,EACX,KAAK,gBAAgB,EACrB,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,MAAM,EACX,YAAY,EACZ,eAAe,EACf,UAAU,EACV,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,YAAY,EACZ,KAAK,iBAAiB,EACtB,UAAU,EACV,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,iBAAiB,CAAC;AAKzB,OAAO,EAAE,KAAK,WAAW,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAC/F,OAAO,EACL,eAAe,EACf,KAAK,+BAA+B,EACpC,KAAK,6BAA6B,EAClC,KAAK,4BAA4B,EACjC,KAAK,2BAA2B,EAChC,KAAK,4BAA4B,EACjC,KAAK,0BAA0B,EAC/B,KAAK,oBAAoB,EACzB,KAAK,iCAAiC,EACtC,KAAK,4BAA4B,EACjC,KAAK,yBAAyB,EAC9B,KAAK,0BAA0B,GAChC,MAAM,wBAAwB,CAAC"}

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

@@ -1,2 +1,26 @@
-export { Chat, ChatComponents, ChatFooter, ChatHeader, ChatInput, ChatMessages, ConversationEmptyState, ConversationScrollButton, getTextContent, groupPartsInOrder, isReasoningPart, isToolPart, Loader, MessageActions, ReasoningCard, Shimmer, Suggestion, Suggestions, ToolCallCard, ToolStatusBadge, } from "./chat/index.js";
+/**
+ * Chat re-export aggregator — single import path for all chat components.
+ *
+ * @module ai/react/components/ai/chat
+ */
+// ---------------------------------------------------------------------------
+// Core preset + compound
+// ---------------------------------------------------------------------------
+export { Chat, ChatComponents } from "./chat/index.js";
+// ---------------------------------------------------------------------------
+// Composition building blocks
+// ---------------------------------------------------------------------------
+export { ChatComposer, ChatEmpty, ChatIf, ChatMessageList, ChatRoot, ErrorBanner, Message, ModelAvatar, } from "./chat/index.js";
+// ---------------------------------------------------------------------------
+// Contexts
+// ---------------------------------------------------------------------------
+export { ChatContextProvider, ComposerContextProvider, MessageContextProvider, ThreadListContextProvider, useChatContext, useChatContextOptional, useComposerContext, useComposerContextOptional, useMessageContext, useMessageContextOptional, useThreadListContext, useThreadListContextOptional, } from "./chat/index.js";
+// ---------------------------------------------------------------------------
+// Sub-components
+// ---------------------------------------------------------------------------
+export { AttachmentPill, BranchPicker, ChatSidebar, ConversationEmptyState, ConversationScrollButton, downloadMarkdown, DropZoneOverlay, exportAsMarkdown, extractSourcesFromParts, FadeIn, getTextContent, groupPartsInOrder, InferenceBadge, InlineCitation, isReasoningPart, isSkillToolPart, isToolPart, Loader, MessageActions, MessageEditForm, MessageFeedback, QuickActions, ReasoningCard, RichCodeBlock, Shimmer, SkillBadge, Sources, StepIndicator, Suggestion, Suggestions, TabSwitcher, ToolCallCard, ToolStatusBadge, UpgradeCTA, UploadsPanel, useThreads, } from "./chat/index.js";
+// ---------------------------------------------------------------------------
+// Adjacent components
+// ---------------------------------------------------------------------------
 export { ModelSelector } from "./model-selector.js";
+export { ChatWithSidebar, } from "./chat-with-sidebar.js";

package/esm/src/react/components/ai/error-boundary.js

@@ -21,15 +21,15 @@ export class AIErrorBoundary extends React.Component {
                 return fallback(error, this.reset);
             return fallback;
         }
-        return (React.createElement("div", { className: "border border-red-200 dark:border-red-800 bg-red-50 dark:bg-red-900/20 rounded-2xl p-6", role: "alert" },
+        return (React.createElement("div", { className: "border border-[var(--destructive)]/20 bg-[var(--destructive)]/5 rounded-2xl p-6", role: "alert" },
             React.createElement("div", { className: "flex items-start gap-4" },
-                React.createElement("div", { className: "w-10 h-10 rounded-full bg-red-100 dark:bg-red-900/40 flex items-center justify-center flex-shrink-0" },
-                    React.createElement("svg", { className: "w-5 h-5 text-red-600 dark:text-red-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" },
+                React.createElement("div", { className: "size-10 rounded-full bg-[var(--destructive)]/10 flex items-center justify-center flex-shrink-0" },
+                    React.createElement("svg", { className: "size-5 text-[var(--destructive)]", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" },
                         React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }))),
                 React.createElement("div", { className: "flex-1 min-w-0" },
-                    React.createElement("h3", { className: "text-base font-semibold text-red-900 dark:text-red-100" }, errorMessage ?? "An error occurred in the AI component"),
-                    React.createElement("p", { className: "mt-1.5 text-sm text-red-700 dark:text-red-300 leading-relaxed" }, error.message),
-                    React.createElement("button", { type: "button", onClick: this.reset, className: "mt-4 px-5 py-2.5 text-sm font-medium text-white bg-red-500 hover:bg-red-600 active:scale-[0.98] rounded-full transition-all" }, "Try Again")))));
+                    React.createElement("h3", { className: "text-base font-semibold text-[var(--foreground)]" }, errorMessage ?? "An error occurred in the AI component"),
+                    React.createElement("p", { className: "mt-1.5 text-sm text-[var(--destructive)] leading-relaxed" }, error.message),
+                    React.createElement("button", { type: "button", onClick: this.reset, className: "mt-4 px-5 py-2.5 text-sm font-medium bg-[var(--destructive)] text-[var(--destructive-foreground)] hover:opacity-90 active:scale-[0.98] rounded-full transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2" }, "Try Again")))));
     }
 }
 export function useAIErrorHandler() {

package/esm/src/react/components/ai/icons/index.d.ts

@@ -20,5 +20,14 @@ export declare function SendIcon({ className }: IconProps): React.ReactElement;
 export declare function StopIcon({ className }: IconProps): React.ReactElement;
 export declare function RefreshCwIcon({ className }: IconProps): React.ReactElement;
 export declare function CopyIcon({ className }: IconProps): React.ReactElement;
+export declare function PaperclipIcon({ className }: IconProps): React.ReactElement;
 export declare function CheckIcon({ className }: IconProps): React.ReactElement;
+export declare function PlusIcon({ className }: IconProps): React.ReactElement;
+export declare function TrashIcon({ className }: IconProps): React.ReactElement;
+export declare function PanelLeftIcon({ className }: IconProps): React.ReactElement;
+export declare function PencilIcon({ className }: IconProps): React.ReactElement;
+export declare function SparklesIcon({ className }: IconProps): React.ReactElement;
+export declare function CodeBracketsIcon({ className }: IconProps): React.ReactElement;
+export declare function TargetIcon({ className }: IconProps): React.ReactElement;
+export declare function FileTextIcon({ className }: IconProps): React.ReactElement;
 //# sourceMappingURL=index.d.ts.map

package/esm/src/react/components/ai/icons/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/src/react/components/ai/icons/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,SAAS;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgKD,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEvE;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEtE;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE5E;AAED,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAExE;AAED,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEvE;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE5E;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEtE;AAED,wBAAgB,iBAAiB,CAC/B,EAAE,SAAS,EAAE,EAAE,SAAS,GACvB,KAAK,CAAC,YAAY,CAEpB;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE1E;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAErE;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAErE;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE1E;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAErE;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEtE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/src/react/components/ai/icons/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,SAAS;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAyKD,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEvE;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEtE;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE5E;AAED,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAExE;AAED,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEvE;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE5E;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEtE;AAED,wBAAgB,iBAAiB,CAC/B,EAAE,SAAS,EAAE,EAAE,SAAS,GACvB,KAAK,CAAC,YAAY,CAEpB;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE1E;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAErE;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAErE;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE1E;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAErE;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE1E;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEtE;AAyBD,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAErE;AAED,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEtE;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE1E;AAED,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEvE;AAeD,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEzE;AAqBD,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAE7E;AAED,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEvE;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAEzE"}

package/esm/src/react/components/ai/icons/index.js

@@ -116,6 +116,14 @@ const COPY_ICON_ELEMENTS = [
         props: { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" },
     },
 ];
+const PAPERCLIP_ICON_ELEMENTS = [
+    {
+        type: "path",
+        props: {
+            d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48",
+        },
+    },
+];
 const CHECK_ICON_ELEMENTS = [
     { type: "polyline", props: { points: "20 6 9 17 4 12" } },
 ];
@@ -158,6 +166,80 @@ export function RefreshCwIcon({ className }) {
 export function CopyIcon({ className }) {
     return renderIcon(className, COPY_ICON_ELEMENTS);
 }
+export function PaperclipIcon({ className }) {
+    return renderIcon(className, PAPERCLIP_ICON_ELEMENTS);
+}
 export function CheckIcon({ className }) {
     return renderIcon(className, CHECK_ICON_ELEMENTS);
 }
+const PLUS_ICON_ELEMENTS = [
+    { type: "line", props: { x1: "12", y1: "5", x2: "12", y2: "19" } },
+    { type: "line", props: { x1: "5", y1: "12", x2: "19", y2: "12" } },
+];
+const TRASH_ICON_ELEMENTS = [
+    { type: "polyline", props: { points: "3 6 5 6 21 6" } },
+    {
+        type: "path",
+        props: { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" },
+    },
+];
+const PANEL_LEFT_ICON_ELEMENTS = [
+    { type: "rect", props: { width: "18", height: "18", x: "3", y: "3", rx: "2" } },
+    { type: "line", props: { x1: "9", y1: "3", x2: "9", y2: "21" } },
+];
+const PENCIL_ICON_ELEMENTS = [
+    { type: "path", props: { d: "M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" } },
+    { type: "path", props: { d: "m15 5 4 4" } },
+];
+export function PlusIcon({ className }) {
+    return renderIcon(className, PLUS_ICON_ELEMENTS);
+}
+export function TrashIcon({ className }) {
+    return renderIcon(className, TRASH_ICON_ELEMENTS);
+}
+export function PanelLeftIcon({ className }) {
+    return renderIcon(className, PANEL_LEFT_ICON_ELEMENTS);
+}
+export function PencilIcon({ className }) {
+    return renderIcon(className, PENCIL_ICON_ELEMENTS);
+}
+const SPARKLES_ICON_ELEMENTS = [
+    {
+        type: "path",
+        props: {
+            d: "m12 3-1.912 5.813a2 2 0 0 1-1.275 1.275L3 12l5.813 1.912a2 2 0 0 1 1.275 1.275L12 21l1.912-5.813a2 2 0 0 1 1.275-1.275L21 12l-5.813-1.912a2 2 0 0 1-1.275-1.275L12 3Z",
+        },
+    },
+    { type: "path", props: { d: "M5 3v4" } },
+    { type: "path", props: { d: "M19 17v4" } },
+    { type: "path", props: { d: "M3 5h4" } },
+    { type: "path", props: { d: "M17 19h4" } },
+];
+export function SparklesIcon({ className }) {
+    return renderIcon(className, SPARKLES_ICON_ELEMENTS);
+}
+const CODE_BRACKETS_ICON_ELEMENTS = [
+    { type: "polyline", props: { points: "16 18 22 12 16 6" } },
+    { type: "polyline", props: { points: "8 6 2 12 8 18" } },
+];
+const TARGET_ICON_ELEMENTS = [
+    { type: "circle", props: { cx: "12", cy: "12", r: "10" } },
+    { type: "circle", props: { cx: "12", cy: "12", r: "6" } },
+    { type: "circle", props: { cx: "12", cy: "12", r: "2" } },
+];
+const FILE_TEXT_ICON_ELEMENTS = [
+    { type: "path", props: { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" } },
+    { type: "polyline", props: { points: "14 2 14 8 20 8" } },
+    { type: "line", props: { x1: "16", y1: "13", x2: "8", y2: "13" } },
+    { type: "line", props: { x1: "16", y1: "17", x2: "8", y2: "17" } },
+    { type: "polyline", props: { points: "10 9 9 9 8 9" } },
+];
+export function CodeBracketsIcon({ className }) {
+    return renderIcon(className, CODE_BRACKETS_ICON_ELEMENTS);
+}
+export function TargetIcon({ className }) {
+    return renderIcon(className, TARGET_ICON_ELEMENTS);
+}
+export function FileTextIcon({ className }) {
+    return renderIcon(className, FILE_TEXT_ICON_ELEMENTS);
+}

package/esm/src/react/components/ai/markdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../../../../src/src/react/components/ai/markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,aAAa;IAC5B,iCAAiC;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yEAAyE;IACzE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iCAAiC;IACjC,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9D;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAsJD,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,SAAS,EACT,aAAoB,EACpB,eAAe,GAChB,EAAE,aAAa,GAAG,KAAK,CAAC,YAAY,CA+FpC"}
+{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../../../../src/src/react/components/ai/markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,aAAa;IAC5B,iCAAiC;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yEAAyE;IACzE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iCAAiC;IACjC,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9D;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAkJD,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,SAAS,EACT,aAAoB,EACpB,eAAe,GAChB,EAAE,aAAa,GAAG,KAAK,CAAC,YAAY,CA+FpC"}

package/esm/src/react/components/ai/markdown.js

@@ -2,6 +2,7 @@ import * as React from "react";
 import { cn } from "./theme.js";
 import { isBrowserEnvironment } from "../../../platform/compat/runtime.js";
 import { validateTrustedHtml } from "../../../security/client/html-sanitizer.js";
+import { RichCodeBlock } from "./chat/components/code-block.js";
 const ESM_REACT_MARKDOWN = "https://esm.sh/react-markdown@9?external=react&target=es2022";
 const ESM_REMARK_GFM = "https://esm.sh/remark-gfm@4?target=es2022";
 const ESM_REHYPE_HIGHLIGHT = "https://esm.sh/rehype-highlight@7?target=es2022";
@@ -62,18 +63,18 @@ function MermaidDiagram({ code }) {
         };
     }, [code]);
     if (!isBrowserEnvironment()) {
-        return (React.createElement("pre", { className: "my-4 p-4 bg-neutral-100 dark:bg-neutral-800 rounded-lg overflow-auto" },
+        return (React.createElement("pre", { className: "my-4 p-4 bg-[var(--accent)] rounded-lg overflow-auto" },
             React.createElement("code", null, code)));
     }
     if (error) {
-        return (React.createElement("div", { className: "my-4 p-4 bg-red-50 dark:bg-red-900/20 rounded-lg text-red-600 dark:text-red-400 text-sm" },
+        return (React.createElement("div", { className: "my-4 p-4 bg-red-50 rounded-lg text-red-600 text-sm" },
             React.createElement("p", { className: "font-medium" }, "Mermaid Error"),
             React.createElement("p", null, error),
             React.createElement("pre", { className: "mt-2 text-xs overflow-auto" }, code)));
     }
     if (!svg) {
-        return (React.createElement("div", { className: "my-4 p-4 bg-neutral-100 dark:bg-neutral-800 rounded-lg animate-pulse" },
-            React.createElement("div", { className: "h-32 flex items-center justify-center text-neutral-400" }, "Loading diagram...")));
+        return (React.createElement("div", { className: "my-4 p-4 bg-[var(--accent)] rounded-lg animate-pulse" },
+            React.createElement("div", { className: "h-32 flex items-center justify-center text-[var(--muted-foreground)]" }, "Loading diagram...")));
     }
     return (React.createElement("div", { className: "my-4 flex justify-center overflow-auto", dangerouslySetInnerHTML: { __html: svg } }));
 }
@@ -82,16 +83,15 @@ function CodeBlock({ language, code, inline, enableMermaid, renderCodeBlock, })
         return React.createElement(React.Fragment, null, renderCodeBlock({ language, code, inline }));
     }
     if (inline) {
-        return (React.createElement("code", { className: "bg-neutral-100 dark:bg-neutral-800 px-1.5 py-0.5 rounded text-sm font-mono" }, code));
+        return (React.createElement("code", { className: "bg-[var(--accent)] px-1.5 py-0.5 rounded text-sm font-mono" }, code));
     }
     if (enableMermaid && language === "mermaid") {
         return React.createElement(MermaidDiagram, { code: code });
     }
-    return (React.createElement("pre", { className: "my-4 p-4 bg-neutral-900 dark:bg-neutral-950 rounded-lg overflow-auto" },
-        React.createElement("code", { className: language ? `language-${language} hljs` : "hljs" }, code)));
+    return React.createElement(RichCodeBlock, { language: language, code: code });
 }
 function FallbackMarkdown({ children, className, }) {
-    return (React.createElement("div", { className: cn("prose prose-sm dark:prose-invert max-w-none", className) },
+    return (React.createElement("div", { className: cn("prose prose-sm max-w-none", className) },
         React.createElement("p", { className: "whitespace-pre-wrap" }, children)));
 }
 export function Markdown({ children, className, enableMermaid = true, renderCodeBlock, }) {
@@ -121,7 +121,7 @@ export function Markdown({ children, className, enableMermaid = true, renderCode
     if (!isLoaded || !ReactMarkdown) {
         return React.createElement(FallbackMarkdown, { className: className }, children);
     }
-    return (React.createElement("div", { className: cn("prose prose-sm dark:prose-invert max-w-none", className) },
+    return (React.createElement("div", { className: cn("prose prose-sm max-w-none", className) },
         React.createElement(ReactMarkdown, { remarkPlugins: remarkGfm ? [remarkGfm] : [], rehypePlugins: rehypeHighlight ? [rehypeHighlight] : [], components: {
                 // deno-lint-ignore no-explicit-any
                 code(props) {
@@ -135,15 +135,15 @@ export function Markdown({ children, className, enableMermaid = true, renderCode
                 // deno-lint-ignore no-explicit-any
                 table(props) {
                     return (React.createElement("div", { className: "my-4 overflow-auto" },
-                        React.createElement("table", { className: "min-w-full divide-y divide-neutral-200 dark:divide-neutral-700" }, props.children)));
+                        React.createElement("table", { className: "min-w-full divide-y divide-[var(--border)]" }, props.children)));
                 },
                 // deno-lint-ignore no-explicit-any
                 a(props) {
-                    return (React.createElement("a", { href: props.href, className: "text-blue-600 dark:text-blue-400 hover:underline", target: "_blank", rel: "noopener noreferrer" }, props.children));
+                    return (React.createElement("a", { href: props.href, className: "text-blue-600 hover:underline", target: "_blank", rel: "noopener noreferrer" }, props.children));
                 },
                 // deno-lint-ignore no-explicit-any
                 blockquote(props) {
-                    return (React.createElement("blockquote", { className: "border-l-4 border-neutral-300 dark:border-neutral-600 pl-4 my-4 text-neutral-600 dark:text-neutral-400 italic" }, props.children));
+                    return (React.createElement("blockquote", { className: "border-l-4 border-[var(--border)] pl-4 my-4 text-[var(--card-foreground)] italic" }, props.children));
                 },
             } }, children)));
 }

package/esm/src/react/components/ai/model-selector.d.ts

@@ -1,8 +1,10 @@
 /**
  * ModelSelector - Dropdown for switching models at runtime
  *
- * Renders a compact dropdown that integrates with useChat's model/setModel.
- * Expects "provider/model" strings (e.g. "openai/gpt-4o").
+ * Opens upward from the trigger using fixed positioning
+ * so it never affects the surrounding layout.
+ *
+ * Implements WAI-ARIA listbox pattern with full keyboard navigation.
  */
 import * as React from "react";
 /** A "provider/model" value and its display label. */
@@ -11,6 +13,12 @@ export interface ModelOption {
     value: string;
     /** Display label (e.g. "GPT-4o") */
     label: string;
+    /** Provider name for grouping (e.g. "openai") */
+    provider?: string;
+    /** Short description shown beneath the label */
+    description?: string;
+    /** Badge text (e.g. "Local", "New") */
+    badge?: string;
 }
 /** Props for `<ModelSelector>`. */
 export interface ModelSelectorProps {

package/esm/src/react/components/ai/model-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"model-selector.d.ts","sourceRoot":"","sources":["../../../../../src/src/react/components/ai/model-selector.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,sDAAsD;AACtD,MAAM,WAAW,WAAW;IAC1B,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,mCAAmC;AACnC,MAAM,WAAW,kBAAkB;IACjC,uBAAuB;IACvB,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uCAAuC;IACvC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAgBzC"}
+{"version":3,"file":"model-selector.d.ts","sourceRoot":"","sources":["../../../../../src/src/react/components/ai/model-selector.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,sDAAsD;AACtD,MAAM,WAAW,WAAW;IAC1B,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,mCAAmC;AACnC,MAAM,WAAW,kBAAkB;IACjC,uBAAuB;IACvB,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uCAAuC;IACvC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAgBD,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAwMzC"}