@sybilion/uilib 1.2.15 → 1.2.17

package/dist/esm/components/ui/Chat/Chat.js

@@ -1,13 +1,14 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import cn from 'classnames';
 import { ChatPresets } from './ChatPresets/ChatPresets.js';
 import S from './Chat.styl.js';
 import { ChatEmptyState } from './ChatEmptyState/ChatEmptyState.js';
 import { ChatMessage } from './ChatMessage/ChatMessage.js';
 import { ChatPrompt } from './ChatPrompt/ChatPrompt.js';
+import { ChatSelector } from './ChatSheet/ChatSelector.js';
 
-function Chat({ children, className, isEmpty, ...props }) {
-    return (jsx("div", { className: cn(S.root, className, isEmpty && S.isEmpty), ...props, children: children }));
+function Chat({ children, className, isEmpty, scopeId, onChatDeleted, ...props }) {
+    return (jsxs("div", { className: cn(S.root, className, isEmpty && S.isEmpty), ...props, children: [scopeId ? (jsx("div", { className: S.header, children: jsx(ChatSelector, { id: scopeId, onChatDeleted: onChatDeleted }) })) : null, children] }));
 }
 Chat.Prompt = ChatPrompt;
 Chat.Message = ChatMessage;

package/dist/esm/components/ui/Chat/Chat.styl.js

@@ -1,7 +1,7 @@
 import styleInject from 'style-inject';
 
-var css_248z = ".Chat_root__IWt99{display:flex;flex-direction:column;height:100%}.Chat_isEmpty__b4ViB{padding-bottom:170px}";
-var S = {"root":"Chat_root__IWt99","isEmpty":"Chat_isEmpty__b4ViB"};
+var css_248z = ".Chat_root__IWt99{background-color:var(--background);display:flex;flex-direction:column;height:100%;min-height:0}.Chat_header__ZjwP-{align-items:center;display:flex;flex-shrink:0;min-height:64px;padding:var(--p-2) var(--p-6) 0}.Chat_isEmpty__b4ViB{padding-bottom:170px}";
+var S = {"root":"Chat_root__IWt99","header":"Chat_header__ZjwP-","isEmpty":"Chat_isEmpty__b4ViB"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/components/ui/Chat/ChatChrome/ChatChrome.js

@@ -1,5 +1,6 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import cn from 'classnames';
+import { useEffect } from 'react';
 import { displayLabelForBranchKeyFromMessages, humanizeBranchKey } from '../ChatMessage/presetScript.js';
 import { TextShimmer } from '../../TextShimmer/TextShimmer.js';
 import { Scroll } from '@homecode/ui';
@@ -10,8 +11,24 @@ import SidebarStem from '../../Sidebar/Sidebar.styl.js';
 import { Chat } from '../Chat.js';
 import S from './ChatChrome.styl.js';
 
-function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPresets, messages, onQuickReply, suppressedQuickReplyKeys, isLoading, scriptContinueLabel, onScriptContinue, renderMessageChart, showBranchActionsRow, showSyntheticBranchButtons, unusedBranchKeys, isScriptComplete, onGenerateDashboard, generatingDashboard, onGenerateDashboardClick, showInlinePresets, isLastMessageFromUser, scrollRef, effectiveScopeId, onPromptSubmit, onChatDeleted, promptPrefill, variant = 'sidebar', footerClassName, emptyState, }) {
-    return (jsxs("div", { className: cn(S.panelRoot, S[`variant-${variant}`]), children: [showResizeHandle && resizeHandle ? (jsx(PanelResizeHandle, { edge: "leading", isActive: resizeHandle.isActive, startWidthPx: resizeHandle.startWidthPx, getShellWidth: resizeHandle.getShellWidth, onDragWidth: resizeHandle.onDragWidth, onDragComplete: resizeHandle.onDragComplete, className: cn(SidebarStem.sidebarResizeHandle, S.chatResizeHandle) })) : null, jsx("div", { className: S.panelHeader, children: onClose ? (jsx(Button, { type: "button", variant: "ghost", icon: true, className: S.panelClose, "aria-label": "Close chat", onClick: onClose, children: jsx(X, { className: "size-4" }) })) : null }), jsx("div", { className: S.content, children: jsxs(Chat, { isEmpty: isEmpty, children: [isEmpty ? (jsxs(Fragment, { children: [jsx(Chat.EmptyState, { ...emptyState }), renderPresets('fixed')] })) : (jsx("div", { className: S.scrollWrapper, children: jsxs(Scroll, { y: true, yScrollbarClassName: S.scrollbar, className: S.scroll, innerClassName: S.scrollInner, offset: { y: { before: 56, after: 180 } }, fadeSize: "m", autoHide: true, ref: scrollRef, children: [messages.map((msg, index, arr) => {
+function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPresets, messages, onQuickReply, suppressedQuickReplyKeys, isLoading, scriptContinueLabel, onScriptContinue, renderMessageChart, showBranchActionsRow, showSyntheticBranchButtons, unusedBranchKeys, isScriptComplete, onGenerateDashboard, generatingDashboard, onGenerateDashboardClick, showInlinePresets, isLastMessageFromUser, scrollRef, effectiveScopeId, onPromptSubmit, onChatDeleted, promptPrefill, footerClassName, emptyState, }) {
+    useEffect(() => {
+        if (isEmpty)
+            return;
+        const scrollToBottom = () => {
+            const inner = scrollRef.current?.innerElem;
+            if (inner) {
+                inner.scrollTo({
+                    top: inner.scrollHeight + 1000,
+                    behavior: 'smooth',
+                });
+            }
+        };
+        const inner = scrollRef.current?.innerElem;
+        if (inner)
+            setTimeout(scrollToBottom, 100);
+    }, [isEmpty, messages.length]);
+    return (jsxs("div", { className: S.root, children: [showResizeHandle && resizeHandle ? (jsx(PanelResizeHandle, { edge: "leading", isActive: resizeHandle.isActive, startWidthPx: resizeHandle.startWidthPx, getShellWidth: resizeHandle.getShellWidth, onDragWidth: resizeHandle.onDragWidth, onDragComplete: resizeHandle.onDragComplete, className: cn(SidebarStem.sidebarResizeHandle, S.chatResizeHandle) })) : null, jsx("div", { className: S.panelHeader, children: onClose ? (jsx(Button, { type: "button", variant: "ghost", icon: true, className: S.panelClose, "aria-label": "Close chat", onClick: onClose, children: jsx(X, { className: "size-4" }) })) : null }), jsx("div", { className: S.content, children: jsxs(Chat, { isEmpty: isEmpty, scopeId: effectiveScopeId, onChatDeleted: onChatDeleted, children: [isEmpty ? (jsxs(Fragment, { children: [jsx(Chat.EmptyState, { ...emptyState }), renderPresets('fixed')] })) : (jsx("div", { className: S.scrollWrapper, children: jsxs(Scroll, { y: true, yScrollbarClassName: S.scrollbar, className: S.scroll, innerClassName: S.scrollInner, offset: { y: { before: 56, after: 180 } }, fadeSize: "m", autoHide: true, ref: scrollRef, children: [messages.map((msg, index, arr) => {
                                         const isLast = index === arr.length - 1;
                                         return (jsx(Chat.Message, { role: msg.role, text: msg.text, onQuickReply: onQuickReply, suppressedQuickReplyKeys: suppressedQuickReplyKeys, quickReplyDisabled: isLoading, isLastMessage: isLast, scriptContinue: isLast && scriptContinueLabel
                                                 ? { label: scriptContinueLabel }
@@ -25,7 +42,7 @@ function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPr
                                                 })
                                                 : null, isScriptComplete &&
                                                 onGenerateDashboard &&
-                                                !generatingDashboard ? (jsxs(Button, { type: "button", variant: "default", size: "lg", disabled: isLoading, onClick: onGenerateDashboardClick, children: [jsx(ChartLineIcon, {}), "Generate Dashboard"] })) : null] })), showInlinePresets && renderPresets('inline'), isLoading && isLastMessageFromUser && (jsx(TextShimmer, { duration: 1, spread: 5, className: S.loader, children: "Thinking..." }))] }) })), jsx("div", { className: cn(S.footer, footerClassName), children: jsx(Chat.Prompt, { id: effectiveScopeId, onSubmit: onPromptSubmit, disabled: isLoading, onChatDeleted: onChatDeleted, prefillMessage: promptPrefill ?? undefined }) })] }) })] }));
+                                                !generatingDashboard ? (jsxs(Button, { type: "button", variant: "default", size: "lg", disabled: isLoading, onClick: onGenerateDashboardClick, children: [jsx(ChartLineIcon, {}), "Generate Dashboard"] })) : null] })), showInlinePresets && renderPresets('inline'), isLoading && isLastMessageFromUser && (jsx(TextShimmer, { duration: 1, spread: 5, className: S.loader, children: "Thinking..." }))] }) })), jsx("div", { className: cn(S.footer, footerClassName), children: jsx(Chat.Prompt, { onSubmit: onPromptSubmit, disabled: isLoading, prefillMessage: promptPrefill ?? undefined }) })] }) })] }));
 }
 
 export { ChatChrome };

package/dist/esm/components/ui/Chat/ChatChrome/ChatChrome.styl.js

@@ -1,7 +1,7 @@
 import styleInject from 'style-inject';
 
-var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatChrome_panelRoot__XOrBH{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden;position:relative}.ChatChrome_panelRoot__XOrBH.ChatChrome_variant-sidebar__1lK8c .ChatChrome_footer__a5Bpp{backdrop-filter:blur(30px);background-color:var(--background-alpha-800);border-top:1px solid var(--border);box-shadow:0 0 20px 16px var(--background)}.ChatChrome_panelRoot__XOrBH.ChatChrome_variant-default__NAFT5 .ChatChrome_footer__a5Bpp{--chat-chrome-footer-variant:default}.ChatChrome_chatResizeHandle__epfiT{background-color:var(--page-color);border-radius:2.5px;height:calc(100vh + 200px);left:0;opacity:0;position:absolute;right:auto;top:-200px;touch-action:none;transition:opacity .15s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:5px;z-index:30}.ChatChrome_chatResizeHandle__epfiT:before{left:0;right:auto}.ChatChrome_panelHeader__Hkfit{align-items:center;display:flex;flex-shrink:0;justify-content:flex-end;padding:var(--p-2) var(--p-3);position:absolute;width:100%;z-index:100}.ChatChrome_panelClose__DbKxz{flex-shrink:0}.ChatChrome_content__5qFEi{display:flex;flex:1;flex-direction:column;min-height:0;position:relative}.ChatChrome_scrollWrapper__m4HMu{flex:1;min-height:0;position:relative}.ChatChrome_scroll__oCxoJ{align-items:flex-end;height:100%;max-height:100%;max-width:100%;padding-bottom:var(--p-2);position:absolute;width:100%;z-index:3}.ChatChrome_scrollbar__Hu0aG{right:0!important}.ChatChrome_scrollInner__K9hIy{padding-top:var(--p-10)}.ChatChrome_scrollInner__K9hIy:after{content:\"\";display:block;height:170px}.ChatChrome_footer__a5Bpp{bottom:0;display:flex;flex-direction:column;position:absolute;width:100%;z-index:50}.ChatChrome_loader__9-lnf{color:var(--muted-foreground);margin:var(--p-2) var(--p-6) var(--p-10)}.ChatChrome_branchRow__NMDNv{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--p-6);padding:0 var(--p-6);width:100%}.ChatChrome_branchBtnWrap__aOSVP{display:inline-flex;vertical-align:middle}";
-var S = {"panelRoot":"ChatChrome_panelRoot__XOrBH","variant-sidebar":"ChatChrome_variant-sidebar__1lK8c","footer":"ChatChrome_footer__a5Bpp","variant-default":"ChatChrome_variant-default__NAFT5","chatResizeHandle":"ChatChrome_chatResizeHandle__epfiT","panelHeader":"ChatChrome_panelHeader__Hkfit","panelClose":"ChatChrome_panelClose__DbKxz","content":"ChatChrome_content__5qFEi","scrollWrapper":"ChatChrome_scrollWrapper__m4HMu","scroll":"ChatChrome_scroll__oCxoJ","scrollbar":"ChatChrome_scrollbar__Hu0aG","scrollInner":"ChatChrome_scrollInner__K9hIy","loader":"ChatChrome_loader__9-lnf","branchRow":"ChatChrome_branchRow__NMDNv","branchBtnWrap":"ChatChrome_branchBtnWrap__aOSVP"};
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatChrome_root__oh4Ay{border-radius:var(--p-4);display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden;position:relative}.ChatChrome_chatResizeHandle__epfiT{background-color:var(--page-color);border-radius:2.5px;height:calc(100vh + 200px);left:0;opacity:0;position:absolute;right:auto;top:-200px;touch-action:none;transition:opacity .15s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:5px;z-index:30}.ChatChrome_chatResizeHandle__epfiT:before{left:0;right:auto}.ChatChrome_panelHeader__Hkfit{align-items:center;display:flex;flex-shrink:0;justify-content:flex-end;min-height:70px;padding:var(--p-2) var(--p-3);position:absolute;width:100%;z-index:100}.ChatChrome_panelClose__DbKxz{flex-shrink:0}.ChatChrome_content__5qFEi{display:flex;flex:1;flex-direction:column;min-height:0;position:relative}.ChatChrome_scrollWrapper__m4HMu{flex:1;min-height:0;position:relative}.ChatChrome_scroll__oCxoJ{align-items:flex-end;height:100%;max-height:100%;max-width:100%;padding-bottom:var(--p-2);position:absolute;width:100%;z-index:3}.ChatChrome_scrollbar__Hu0aG{right:0!important}.ChatChrome_scrollInner__K9hIy{min-height:100%;padding-top:var(--p-10)}.ChatChrome_scrollInner__K9hIy:after{content:\"\";display:block;height:170px}.ChatChrome_footer__a5Bpp{backdrop-filter:blur(30px);background-color:var(--background-alpha-800);border-top:1px solid var(--border);bottom:0;box-shadow:0 0 20px 16px var(--background);display:flex;flex-direction:column;position:absolute;width:100%;z-index:50}.ChatChrome_loader__9-lnf{color:var(--muted-foreground);margin:var(--p-2) var(--p-6) var(--p-10)}.ChatChrome_branchRow__NMDNv{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--p-6);padding:0 var(--p-6);width:100%}.ChatChrome_branchBtnWrap__aOSVP{display:inline-flex;vertical-align:middle}";
+var S = {"root":"ChatChrome_root__oh4Ay","chatResizeHandle":"ChatChrome_chatResizeHandle__epfiT","panelHeader":"ChatChrome_panelHeader__Hkfit","panelClose":"ChatChrome_panelClose__DbKxz","content":"ChatChrome_content__5qFEi","scrollWrapper":"ChatChrome_scrollWrapper__m4HMu","scroll":"ChatChrome_scroll__oCxoJ","scrollbar":"ChatChrome_scrollbar__Hu0aG","scrollInner":"ChatChrome_scrollInner__K9hIy","footer":"ChatChrome_footer__a5Bpp","loader":"ChatChrome_loader__9-lnf","branchRow":"ChatChrome_branchRow__NMDNv","branchBtnWrap":"ChatChrome_branchBtnWrap__aOSVP"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/components/ui/Chat/ChatEmptyState/ChatEmptyState.js

@@ -1,8 +1,9 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import S from './ChatEmptyState.styl.js';
+import SparklesIcon from './icons/sparkles.svg.js';
 
-function ChatEmptyState({ icon, title, description, }) {
-    return (jsxs("div", { className: S.root, children: [icon && jsx("div", { className: S.icon, children: icon }), title && jsx("h2", { children: title }), description && jsx("p", { children: description })] }));
+function ChatEmptyState({ icon = jsx(SparklesIcon, {}), title = 'Start a conversation', description, additionalContent, children, }) {
+    return (jsxs("div", { className: S.root, children: [icon && jsx("div", { className: S.icon, children: icon }), title && jsx("h2", { children: title }), description && jsx("p", { children: description }), additionalContent, children] }));
 }
 
 export { ChatEmptyState };

package/dist/esm/components/ui/Chat/ChatEmptyState/ChatEmptyState.styl.js

@@ -1,6 +1,6 @@
 import styleInject from 'style-inject';
 
-var css_248z = ".ChatEmptyState_root__j1n-C{align-items:center;display:flex;flex:1;flex-direction:column;gap:var(--p-2);justify-content:center;padding:var(--p-6);text-align:center;text-size:var(--text-sm);color:var(--text-secondary)}.ChatEmptyState_icon__YSDgv{background:url(sparkles.svg) no-repeat 50%;height:26px;margin-bottom:var(--p-4);width:26px}";
+var css_248z = ".ChatEmptyState_root__j1n-C{align-items:center;display:flex;flex:1;flex-direction:column;gap:var(--p-10);justify-content:center;padding:var(--p-6);text-align:center;text-size:var(--text-sm);color:var(--text-secondary)}.ChatEmptyState_icon__YSDgv,.ChatEmptyState_icon__YSDgv>svg{height:32px;width:32px}";
 var S = {"root":"ChatEmptyState_root__j1n-C","icon":"ChatEmptyState_icon__YSDgv"};
 styleInject(css_248z);
 

package/dist/esm/components/ui/Chat/ChatEmptyState/icons/sparkles.svg.js

@@ -0,0 +1,77 @@
+import * as React from 'react';
+
+var _path, _path2, _path3, _defs;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+var SvgSparkles = function SvgSparkles(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    viewBox: "0 0 32 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M13.084 21.205 12 25l-1.084-3.795a6 6 0 0 0-4.121-4.12L3 16l3.795-1.084a6 6 0 0 0 4.12-4.121L12 7l1.084 3.795a6 6 0 0 0 4.121 4.12L21 16l-3.795 1.084a6 6 0 0 0-4.12 4.121Z",
+    stroke: "url(#sparkles_svg__a)",
+    strokeWidth: 1.33,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path2 || (_path2 = /*#__PURE__*/React.createElement("path", {
+    d: "M24.345 11.62 24 13l-.345-1.38a4.5 4.5 0 0 0-3.274-3.275L19 8l1.38-.345a4.5 4.5 0 0 0 3.275-3.274L24 3l.345 1.38a4.5 4.5 0 0 0 3.274 3.275L29 8l-1.38.345a4.5 4.5 0 0 0-3.275 3.274Z",
+    stroke: "url(#sparkles_svg__b)",
+    strokeWidth: 1.33,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path3 || (_path3 = /*#__PURE__*/React.createElement("path", {
+    d: "M22.526 27.423 22 29l-.526-1.577a3 3 0 0 0-1.897-1.897L18 25l1.577-.526a3 3 0 0 0 1.897-1.897L22 21l.526 1.577a3 3 0 0 0 1.897 1.897L26 25l-1.577.526a3 3 0 0 0-1.897 1.897Z",
+    stroke: "url(#sparkles_svg__c)",
+    strokeWidth: 1.33,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _defs || (_defs = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+    id: "sparkles_svg__a",
+    x1: 3,
+    y1: 16,
+    x2: 29,
+    y2: 16,
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#19BFE9"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 0.673,
+    stopColor: "#C670E8"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: "#DA62AB"
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    id: "sparkles_svg__b",
+    x1: 3,
+    y1: 16,
+    x2: 29,
+    y2: 16,
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#19BFE9"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 0.673,
+    stopColor: "#C670E8"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: "#DA62AB"
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    id: "sparkles_svg__c",
+    x1: 3,
+    y1: 16,
+    x2: 29,
+    y2: 16,
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#19BFE9"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 0.673,
+    stopColor: "#C670E8"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: "#DA62AB"
+  })))));
+};
+var SparklesIcon = SvgSparkles;
+
+export { SparklesIcon as default };

package/dist/esm/components/ui/Chat/ChatPrompt/ChatPrompt.js

@@ -1,29 +1,19 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import cn from 'classnames';
 import { useState, useEffect } from 'react';
-import { ChatSelector } from '../ChatSheet/ChatSelector.js';
-import { useChatsForScopeId } from '../../../../contexts/chat-context.js';
 import useEvent from '../../../../hooks/useEvent.js';
-import { SendHorizontalIcon, Trash2Icon } from 'lucide-react';
+import { SendHorizontalIcon } from 'lucide-react';
 import { Button } from '../../Button/Button.js';
 import { Input } from '../../Input/Input.js';
 import S from './ChatPrompt.styl.js';
 
-function ChatPrompt({ onSubmit, placeholder, className, footer, id, onChatDeleted, prefillMessage, }) {
+function ChatPrompt({ onSubmit, placeholder, className, footer, prefillMessage, }) {
     const [message, setMessage] = useState('');
-    const { currentChatId, deleteChat, chats } = useChatsForScopeId(id);
     useEffect(() => {
         if (prefillMessage != null && prefillMessage !== '') {
             setMessage(prefillMessage);
         }
     }, [prefillMessage]);
-    const handleDeleteChat = () => {
-        if (!currentChatId)
-            return;
-        const sid = currentChatId;
-        deleteChat(sid);
-        onChatDeleted?.(sid);
-    };
     const handleSubmit = (e) => {
         const trimmedMessage = message.trim();
         if (trimmedMessage) {
@@ -42,7 +32,7 @@ function ChatPrompt({ onSubmit, placeholder, className, footer, id, onChatDelete
             }
         },
     });
-    return (jsxs("form", { onSubmit: handleSubmit, className: cn(S.root, className), children: [jsx(Input, { type: "textarea", value: message, onChange: e => setMessage(e.target.value), placeholder: placeholder || 'Type a message...', className: cn(S.input) }), jsxs("div", { className: S.actions, children: [jsx(Button, { type: "submit", size: "sm", disabled: !message.trim(), children: jsx(SendHorizontalIcon, { size: 16 }) }), jsx("div", { className: S.notice, children: "Forecast Assistant can make mistakes." }), jsxs("div", { className: S.selectorWrapper, children: [jsx(ChatSelector, { id: id, className: S.selector }), jsx(Button, { type: "button", variant: "ghost", size: "sm", "aria-label": "Delete chat", disabled: !currentChatId || chats.length === 0, onClick: handleDeleteChat, children: jsx(Trash2Icon, { size: 16 }) })] })] }), footer] }));
+    return (jsxs("form", { onSubmit: handleSubmit, className: cn(S.root, className), children: [jsx(Input, { type: "textarea", value: message, onChange: e => setMessage(e.target.value), placeholder: placeholder || 'Type a message...', className: cn(S.input) }), jsxs("div", { className: S.actions, children: [jsx(Button, { type: "submit", size: "sm", disabled: !message.trim(), children: jsx(SendHorizontalIcon, { size: 16 }) }), jsx("div", { className: S.notice, children: "Forecast Assistant can make mistakes." })] }), footer] }));
 }
 
 export { ChatPrompt };

package/dist/esm/components/ui/Chat/ChatPrompt/ChatPrompt.styl.js

@@ -1,7 +1,7 @@
 import styleInject from 'style-inject';
 
-var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatPrompt_root__5G5bq{align-items:center;display:flex;flex-direction:column;gap:var(--p-2);padding:var(--p-6);position:relative}.ChatPrompt_input__QPKBV{border:none;border-radius:0!important;flex:1;min-height:70px;padding:0!important;resize:none}.ChatPrompt_input__QPKBV,.ChatPrompt_input__QPKBV:focus{box-shadow:none!important}.ChatPrompt_actions__pUtB-{align-items:center;display:flex;flex-direction:row-reverse;gap:var(--p-2);justify-content:space-between;width:100%}.ChatPrompt_actions__pUtB->button:focus{box-shadow:0 0 0 2px var(--brand-color-500)!important}.ChatPrompt_actions__pUtB->button:first-child{border:none;position:relative;transition:all .2s}.ChatPrompt_actions__pUtB->button:first-child:focus{transform:scale(1.2)}.ChatPrompt_actions__pUtB->button:first-child:before{bottom:-100%;content:\"\";left:-100%;position:absolute;right:-100%;top:-100%}.ChatPrompt_actions__pUtB- .ChatPrompt_attachButton__gi-qF{background-color:var(--page-color);box-shadow:0 0 20px var(--background)}.ChatPrompt_selectorWrapper__8d5mB{align-items:center;display:flex;gap:var(--p-2);min-width:200px;z-index:1000}.ChatPrompt_selectorWrapper__8d5mB>button:first-child{flex:1}.ChatPrompt_selectorWrapper__8d5mB>button:last-child{border-radius:50px;opacity:.3}.ChatPrompt_selectorWrapper__8d5mB:hover>button:last-child{opacity:1}.ChatPrompt_selector__bNjnF{box-shadow:0 0 0 1px var(--border)!important}.ChatPrompt_notice__B-RyW{color:var(--muted-foreground);font-size:var(--text-xs);text-align:center;width:100%}@media (max-width:768px){.ChatPrompt_notice__B-RyW{font-size:10px}}";
-var S = {"root":"ChatPrompt_root__5G5bq","input":"ChatPrompt_input__QPKBV","actions":"ChatPrompt_actions__pUtB-","attachButton":"ChatPrompt_attachButton__gi-qF","selectorWrapper":"ChatPrompt_selectorWrapper__8d5mB","selector":"ChatPrompt_selector__bNjnF","notice":"ChatPrompt_notice__B-RyW"};
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatPrompt_root__5G5bq{align-items:center;display:flex;flex-direction:column;gap:var(--p-2);padding:var(--p-6);position:relative}.ChatPrompt_input__QPKBV{border:none;border-radius:0!important;flex:1;min-height:70px;padding:0!important;resize:none}.ChatPrompt_input__QPKBV,.ChatPrompt_input__QPKBV:focus{box-shadow:none!important}.ChatPrompt_actions__pUtB-{align-items:center;display:flex;flex-direction:row-reverse;gap:var(--p-2);justify-content:space-between;width:100%}.ChatPrompt_actions__pUtB->button:focus{box-shadow:0 0 0 2px var(--brand-color-500)!important}.ChatPrompt_actions__pUtB->button:first-child{border:none;position:relative;transition:all .2s}.ChatPrompt_actions__pUtB->button:first-child:focus{transform:scale(1.2)}.ChatPrompt_actions__pUtB->button:first-child:before{bottom:-100%;content:\"\";left:-100%;position:absolute;right:-100%;top:-100%}.ChatPrompt_actions__pUtB- .ChatPrompt_attachButton__gi-qF{background-color:var(--page-color);box-shadow:0 0 20px var(--background)}.ChatPrompt_notice__B-RyW{color:var(--muted-foreground);font-size:var(--text-xs);text-align:center;width:100%}@media (max-width:768px){.ChatPrompt_notice__B-RyW{font-size:10px}}";
+var S = {"root":"ChatPrompt_root__5G5bq","input":"ChatPrompt_input__QPKBV","actions":"ChatPrompt_actions__pUtB-","attachButton":"ChatPrompt_attachButton__gi-qF","notice":"ChatPrompt_notice__B-RyW"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/components/ui/Chat/ChatSheet/ChatSelector.js

@@ -1,9 +1,13 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import cn from 'classnames';
 import { useChatsForScopeId } from '../../../../contexts/chat-context.js';
+import { Trash2Icon } from 'lucide-react';
+import { Button } from '../../Button/Button.js';
 import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '../../Select/Select.js';
+import S from './ChatSelector.styl.js';
 
-function ChatSelector({ id, className }) {
-    const { chats, currentChatId, setCurrentChatId, newChat } = useChatsForScopeId(id);
+function ChatSelector({ id, className, onChatDeleted, }) {
+    const { chats, currentChatId, setCurrentChatId, newChat, deleteChat } = useChatsForScopeId(id);
     const handleValueChange = (value) => {
         if (value === 'new') {
             newChat();
@@ -12,6 +16,13 @@ function ChatSelector({ id, className }) {
             setCurrentChatId(value);
         }
     };
+    const handleDeleteChat = () => {
+        if (!currentChatId)
+            return;
+        const sid = currentChatId;
+        deleteChat(sid);
+        onChatDeleted?.(sid);
+    };
     const getChatDisplayName = (chat) => {
         if (chat.name) {
             return chat.name;
@@ -23,7 +34,7 @@ function ChatSelector({ id, className }) {
         }
         return `Chat ${chat.session_id}`;
     };
-    return (jsxs(Select, { value: currentChatId?.toString() ?? '', onValueChange: handleValueChange, children: [jsx(SelectTrigger, { size: "sm", className: className, children: jsx(SelectValue, { placeholder: "Select chat" }) }), jsxs(SelectContent, { children: [jsx(SelectItem, { value: "new", children: "+ New Chat" }), chats.map(chat => (jsx(SelectItem, { value: chat.session_id.toString(), selected: chat.session_id === currentChatId, children: getChatDisplayName(chat) }, chat.session_id)))] })] }));
+    return (jsxs("div", { className: S.wrapper, children: [jsx("div", { className: S.selectGrow, children: jsxs(Select, { variant: "clear", value: currentChatId?.toString() ?? '', onValueChange: handleValueChange, children: [jsx(SelectTrigger, { size: "sm", className: className ? cn(S.selectTrigger, className) : S.selectTrigger, children: jsx(SelectValue, { placeholder: "Select chat" }) }), jsxs(SelectContent, { children: [jsx(SelectItem, { value: "new", children: "+ New Chat" }), chats.map(chat => (jsx(SelectItem, { value: chat.session_id.toString(), selected: chat.session_id === currentChatId, children: getChatDisplayName(chat) }, chat.session_id)))] })] }) }), jsx(Button, { type: "button", variant: "ghost", size: "sm", className: S.deleteBtn, "aria-label": "Delete chat", disabled: !currentChatId || chats.length === 0, onClick: handleDeleteChat, children: jsx(Trash2Icon, { size: 16 }) })] }));
 }
 
 export { ChatSelector };

package/dist/esm/components/ui/Chat/ChatSheet/ChatSelector.styl.js

@@ -0,0 +1,7 @@
+import styleInject from 'style-inject';
+
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatSelector_wrapper__8Z4wN{align-items:center;display:flex;gap:var(--p-2);min-width:200px;z-index:1000}.ChatSelector_selectGrow__bGR0A{flex:1;min-width:0}.ChatSelector_selectTrigger__DASfc{width:100%}.ChatSelector_deleteBtn__oJ-9b{border-radius:50px;flex-shrink:0;opacity:.3}.ChatSelector_wrapper__8Z4wN:hover .ChatSelector_deleteBtn__oJ-9b{opacity:1}";
+var S = {"wrapper":"ChatSelector_wrapper__8Z4wN","selectGrow":"ChatSelector_selectGrow__bGR0A","selectTrigger":"ChatSelector_selectTrigger__DASfc","deleteBtn":"ChatSelector_deleteBtn__oJ-9b"};
+styleInject(css_248z);
+
+export { S as default };

package/dist/esm/components/ui/Chat/ChatSheet/ChatSheet.js

@@ -4,7 +4,7 @@ import { Button } from '../../Button/Button.js';
 import { ChatChrome } from '../ChatChrome/ChatChrome.js';
 import { useChatPanelChromeModel } from './useChatPanelChromeModel.js';
 
-function ChatSheet({ triggerLabel = 'Open Chat', triggerAriaLabel, actionsRef, renderTrigger, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, inline = false, }) {
+function ChatSheet({ triggerLabel = 'Open Chat', triggerAriaLabel, actionsRef, renderTrigger, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, emptyState, inline = false, }) {
     const model = useChatPanelChromeModel({
         embedAsPage: inline,
         presets,
@@ -13,6 +13,7 @@ function ChatSheet({ triggerLabel = 'Open Chat', triggerAriaLabel, actionsRef, r
         onScriptComplete,
         onGenerateDashboard,
         renderMessageChart,
+        emptyState,
     });
     if (actionsRef) {
         actionsRef.current = {

package/dist/esm/components/ui/Chat/ChatSheet/useChatPanelChromeModel.js

@@ -21,7 +21,7 @@ const CHAT_NAV_COLLAPSE_BREAKPOINT_PX = 1400;
 const CHAT_QUERY_PARAM = 'chat';
 const CHAT_OPEN_VALUE = 'open';
 const PROMPT_QUERY_PARAM = 'prompt';
-function useChatPanelChromeModel({ embedAsPage, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, }) {
+function useChatPanelChromeModel({ embedAsPage, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, emptyState, }) {
     const effectiveScopeId = scopeId ?? NO_SCOPE_FALLBACK;
     const isMobile = useIsMobile();
     const { chatPanelContainer, isOpen: sidebarNavOpen, setOpen: setSidebarNavOpen, chatWidthPx, setChatWidthPx, getShellWidth, setChatPanelOpen, } = useSidebar();
@@ -117,20 +117,6 @@ function useChatPanelChromeModel({ embedAsPage, presets, scopeId, onMessage, onS
         clearUsedScriptBranchKeysForChat,
         clearIntakeForChat,
     ]);
-    const scrollToBottom = () => {
-        const inner = scrollRef.current?.innerElem;
-        if (inner) {
-            inner.scrollTo({
-                top: inner.scrollHeight + 1000,
-                behavior: 'smooth',
-            });
-        }
-    };
-    useEffect(() => {
-        const inner = scrollRef.current?.innerElem;
-        if (inner)
-            setTimeout(scrollToBottom, 100);
-    }, [chat?.messages.length]);
     const onOpenChange = (open) => {
         if (embedAsPage) {
             return;
@@ -785,6 +771,7 @@ function useChatPanelChromeModel({ embedAsPage, presets, scopeId, onMessage, onS
         onPromptSubmit: handlePromptSubmit,
         onChatDeleted: endLocalDemoFlow,
         promptPrefill: promptLinkPrefill,
+        emptyState,
     };
     const toggleOpen = () => onOpenChange(!isOpen);
     return {

package/dist/esm/components/ui/Page/AppShell/AppShell.styl.js

@@ -1,6 +1,6 @@
 import styleInject from 'style-inject';
 
-var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.AppShell_root__ONlNK{display:grid;flex:1;grid-template-areas:\"main\";grid-template-columns:1fr;min-height:0;min-height:100%;width:100%}@media (min-width:768px){.AppShell_root__ONlNK{grid-template-areas:\"sidebar main\";grid-template-columns:var(--sidebar-width) 1fr}[data-slot=sidebar-wrapper][data-state=collapsed] .AppShell_root__ONlNK{grid-template-columns:0 1fr}}.AppShell_mainColumn__Emn1p{display:flex;flex:1;flex-direction:column;grid-area:main;min-height:0;min-width:0}[data-slot=sidebar-wrapper][data-state=collapsed] .AppShell_mainColumn__Emn1p{margin-left:var(--p-3)}.AppShell_mainBody__IoVuy{background-color:var(--page-color);border-radius:var(--p-4);flex:1;min-width:0;padding-bottom:var(--page-y-padding)}";
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.AppShell_root__ONlNK{display:grid;flex:1;grid-template-areas:\"main\";grid-template-columns:1fr;min-height:0;min-height:100%;width:100%}@media (min-width:768px){.AppShell_root__ONlNK{grid-template-areas:\"sidebar main\";grid-template-columns:var(--sidebar-width) 1fr}[data-slot=sidebar-wrapper][data-state=collapsed] .AppShell_root__ONlNK{grid-template-columns:0 1fr}}.AppShell_mainColumn__Emn1p{display:flex;flex:1;flex-direction:column;grid-area:main;min-height:0;min-width:0}[data-slot=sidebar-wrapper][data-state=collapsed] .AppShell_mainColumn__Emn1p{margin-left:var(--p-3)}.AppShell_mainBody__IoVuy{background-color:var(--page-color);border-radius:var(--p-4);display:flex;flex:1;flex-direction:column;min-width:0;padding-bottom:var(--page-y-padding)}";
 var S = {"root":"AppShell_root__ONlNK","mainColumn":"AppShell_mainColumn__Emn1p","mainBody":"AppShell_mainBody__IoVuy"};
 styleInject(css_248z);
 

package/dist/esm/components/ui/Page/PageContent/PageContent.styl.js

@@ -1,6 +1,6 @@
 import styleInject from 'style-inject';
 
-var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.PageContent_root__caExB{display:flex;flex:1;flex-direction:column;max-width:var(--page-width);min-height:0;padding-bottom:var(--page-y-padding);width:100%}.PageContent_section__Wve-w{display:flex;flex-direction:column;min-height:0;padding-left:var(--page-x-padding);padding-right:var(--page-x-padding)}.PageContent_grow__Nkfqk{flex-grow:1}";
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.PageContent_root__caExB{display:flex;flex:1;flex-direction:column;max-width:var(--page-width);min-height:0;width:100%}.PageContent_section__Wve-w{display:flex;flex-direction:column;min-height:0;padding-left:var(--page-x-padding);padding-right:var(--page-x-padding)}.PageContent_grow__Nkfqk{flex-grow:1}";
 var S = {"root":"PageContent_root__caExB","section":"PageContent_section__Wve-w","grow":"PageContent_grow__Nkfqk"};
 styleInject(css_248z);
 

package/dist/esm/types/src/components/ui/Chat/Chat.d.ts

@@ -3,7 +3,7 @@ import type { ChatProps } from './Chat.types';
 import { ChatEmptyState } from './ChatEmptyState/ChatEmptyState';
 import { ChatMessage } from './ChatMessage';
 import { ChatPrompt } from './ChatPrompt';
-export declare function Chat({ children, className, isEmpty, ...props }: ChatProps): import("react/jsx-runtime").JSX.Element;
+export declare function Chat({ children, className, isEmpty, scopeId, onChatDeleted, ...props }: ChatProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Chat {
     var Prompt: typeof ChatPrompt;
     var Message: typeof ChatMessage;

package/dist/esm/types/src/components/ui/Chat/Chat.types.d.ts

@@ -46,13 +46,11 @@ export type ScriptCompletePayload = {
 };
 export interface ChatPromptProps {
     className?: string;
-    id: string;
     onSubmit: (message: string) => void;
     placeholder?: string;
     presets?: ChatPreset[];
     disabled?: boolean;
     footer?: ReactNode;
-    onChatDeleted?: (sessionId: string) => void;
     /** Deep link `?prompt=` — one-shot composer pre-fill (see useChatPanelChromeModel). */
     prefillMessage?: string | null;
 }
@@ -77,4 +75,7 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
     className?: string;
     isEmpty?: boolean;
+    /** Chat context scope; when set, header shows chat selector + delete. */
+    scopeId?: string;
+    onChatDeleted?: (sessionId: string) => void;
 }

package/dist/esm/types/src/components/ui/Chat/ChatChrome/ChatChrome.d.ts

@@ -1,2 +1,2 @@
 import type { ChatChromeProps } from './ChatChrome.types';
-export declare function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPresets, messages, onQuickReply, suppressedQuickReplyKeys, isLoading, scriptContinueLabel, onScriptContinue, renderMessageChart, showBranchActionsRow, showSyntheticBranchButtons, unusedBranchKeys, isScriptComplete, onGenerateDashboard, generatingDashboard, onGenerateDashboardClick, showInlinePresets, isLastMessageFromUser, scrollRef, effectiveScopeId, onPromptSubmit, onChatDeleted, promptPrefill, variant, footerClassName, emptyState, }: ChatChromeProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPresets, messages, onQuickReply, suppressedQuickReplyKeys, isLoading, scriptContinueLabel, onScriptContinue, renderMessageChart, showBranchActionsRow, showSyntheticBranchButtons, unusedBranchKeys, isScriptComplete, onGenerateDashboard, generatingDashboard, onGenerateDashboardClick, showInlinePresets, isLastMessageFromUser, scrollRef, effectiveScopeId, onPromptSubmit, onChatDeleted, promptPrefill, footerClassName, emptyState, }: ChatChromeProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/ui/Chat/ChatChrome/ChatChrome.types.d.ts

@@ -39,7 +39,6 @@ export interface ChatChromeProps {
     onChatDeleted: (sessionId: string) => void;
     /** `?prompt=` deep link text for one-shot composer pre-fill. */
     promptPrefill?: string | null;
-    variant?: 'default' | 'sidebar';
     footerClassName?: string;
     emptyState?: ChatEmptyStateProps;
 }

package/dist/esm/types/src/components/ui/Chat/ChatEmptyState/ChatEmptyState.d.ts

@@ -1,2 +1,3 @@
+import { PropsWithChildren } from 'react';
 import type { ChatEmptyStateProps } from './ChatEmptyState.types';
-export declare function ChatEmptyState({ icon, title, description, }: ChatEmptyStateProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatEmptyState({ icon, title, description, additionalContent, children, }: PropsWithChildren<ChatEmptyStateProps>): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/ui/Chat/ChatEmptyState/ChatEmptyState.types.d.ts

@@ -2,4 +2,6 @@ export interface ChatEmptyStateProps {
     icon?: React.ReactNode;
     title?: string;
     description?: string;
+    /** Extra block below description (works when passed via `ChatChrome` / `ChatSheet` `emptyState`). */
+    additionalContent?: React.ReactNode;
 }

package/dist/esm/types/src/components/ui/Chat/ChatPrompt/ChatPrompt.d.ts

@@ -1,2 +1,2 @@
 import type { ChatPromptProps } from '../Chat.types';
-export declare function ChatPrompt({ onSubmit, placeholder, className, footer, id, onChatDeleted, prefillMessage, }: ChatPromptProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatPrompt({ onSubmit, placeholder, className, footer, prefillMessage, }: ChatPromptProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/ui/Chat/ChatSheet/ChatSelector.d.ts

@@ -1,5 +1,6 @@
 export interface ChatSelectorProps {
     id: string;
     className?: string;
+    onChatDeleted?: (sessionId: string) => void;
 }
-export declare function ChatSelector({ id, className }: ChatSelectorProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatSelector({ id, className, onChatDeleted, }: ChatSelectorProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/ui/Chat/ChatSheet/ChatSheet.d.ts

@@ -19,4 +19,4 @@ export interface ChatSheetProps extends Omit<UseChatPanelChromeModelInput, 'embe
      */
     inline?: boolean;
 }
-export declare function ChatSheet({ triggerLabel, triggerAriaLabel, actionsRef, renderTrigger, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, inline, }: ChatSheetProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatSheet({ triggerLabel, triggerAriaLabel, actionsRef, renderTrigger, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, emptyState, inline, }: ChatSheetProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/ui/Chat/ChatSheet/useChatPanelChromeModel.d.ts

@@ -1,5 +1,6 @@
 import { ChatPreset, type ScriptCompletePayload } from '#uilib/components/ui/Chat/Chat.types';
 import type { ChatChromeProps } from '../ChatChrome';
+import type { ChatEmptyStateProps } from '../ChatEmptyState/ChatEmptyState.types';
 export type UseChatPanelChromeModelInput = {
     /** When true, skip sidebar chat slot, URL `?chat=`, and portal behavior (e.g. page main content). */
     embedAsPage: boolean;
@@ -13,6 +14,8 @@ export type UseChatPanelChromeModelInput = {
     onGenerateDashboard?: (transcript: string) => void | Promise<void>;
     /** Renders `[CHART]` tokens in assistant messages. */
     renderMessageChart?: () => React.ReactNode;
+    /** Forwarded to `ChatChrome` when the thread is empty. */
+    emptyState?: ChatEmptyStateProps;
 };
 export type UseChatPanelChromeModelResult = {
     chromeProps: ChatChromeProps;
@@ -22,4 +25,4 @@ export type UseChatPanelChromeModelResult = {
     newChat: () => void;
     chatPanelContainer: HTMLElement | null;
 };
-export declare function useChatPanelChromeModel({ embedAsPage, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, }: UseChatPanelChromeModelInput): UseChatPanelChromeModelResult;
+export declare function useChatPanelChromeModel({ embedAsPage, presets, scopeId, onMessage, onScriptComplete, onGenerateDashboard, renderMessageChart, emptyState, }: UseChatPanelChromeModelInput): UseChatPanelChromeModelResult;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sybilion/uilib",
-  "version": "1.2.15",
+  "version": "1.2.17",
   "description": "Sybilion Design System — React UI components (Webpack + Stylus)",
   "publishConfig": {
     "access": "public",
@@ -35,11 +35,6 @@
       "default": "./dist/esm/hooks/index.js"
     },
     "./src/*": "./src/*",
-    "./vite-standalone-dev": {
-      "types": "./dist/standalone/vite-sybilion-standalone-dev.d.ts",
-      "import": "./dist/standalone/vite-sybilion-standalone-dev.js",
-      "default": "./dist/standalone/vite-sybilion-standalone-dev.js"
-    },
     "./logo.svg": "./src/assets/logo.svg"
   },
   "files": [

package/src/components/ui/Chat/Chat.styl

@@ -2,6 +2,16 @@
   display flex
   flex-direction column
   height 100%
+  min-height 0
+  // max-height 100vh
+  background-color var(--background)
+
+.header
+  flex-shrink 0
+  display flex
+  align-items center
+  min-height 64px
+  padding var(--p-2) var(--p-6) 0
 
 .isEmpty
   padding-bottom 170px // goes under prompt

package/src/components/ui/Chat/Chat.styl.d.ts

@@ -1,6 +1,7 @@
 // This file is automatically generated.
 // Please do not change this file!
 interface CssExports {
+  'header': string;
   'isEmpty': string;
   'root': string;
 }

package/src/components/ui/Chat/Chat.tsx

@@ -7,10 +7,23 @@ import type { ChatProps } from './Chat.types';
 import { ChatEmptyState } from './ChatEmptyState/ChatEmptyState';
 import { ChatMessage } from './ChatMessage';
 import { ChatPrompt } from './ChatPrompt';
+import { ChatSelector } from './ChatSheet/ChatSelector';
 
-export function Chat({ children, className, isEmpty, ...props }: ChatProps) {
+export function Chat({
+  children,
+  className,
+  isEmpty,
+  scopeId,
+  onChatDeleted,
+  ...props
+}: ChatProps) {
   return (
     <div className={cn(S.root, className, isEmpty && S.isEmpty)} {...props}>
+      {scopeId ? (
+        <div className={S.header}>
+          <ChatSelector id={scopeId} onChatDeleted={onChatDeleted} />
+        </div>
+      ) : null}
       {children}
     </div>
   );

package/src/components/ui/Chat/Chat.types.ts

@@ -54,13 +54,11 @@ export type ScriptCompletePayload = {
 
 export interface ChatPromptProps {
   className?: string;
-  id: string;
   onSubmit: (message: string) => void;
   placeholder?: string;
   presets?: ChatPreset[];
   disabled?: boolean;
   footer?: ReactNode;
-  onChatDeleted?: (sessionId: string) => void;
   /** Deep link `?prompt=` — one-shot composer pre-fill (see useChatPanelChromeModel). */
   prefillMessage?: string | null;
 }
@@ -85,4 +83,7 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
   children: ReactNode;
   className?: string;
   isEmpty?: boolean;
+  /** Chat context scope; when set, header shows chat selector + delete. */
+  scopeId?: string;
+  onChatDeleted?: (sessionId: string) => void;
 }