@sybilion/uilib 1.3.68 → 1.3.71

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

@@ -1,6 +1,6 @@
 import styleInject from 'style-inject';
 
-var css_248z = ".ChatMessage_root__6rnsF{background:var(--bg-secondary);display:flex;flex-direction:column;gap:var(--p-1);padding:var(--p-4);padding-bottom:var(--p-1)}.ChatMessage_text__Y1XNR{color:var(--text-secondary);font-size:var(--text-sm);max-width:100%;min-width:0;overflow-wrap:anywhere;-webkit-user-select:text;-moz-user-select:text;user-select:text;width:-moz-fit-content;width:fit-content;word-break:break-word}.ChatMessage_role-assistant__wketE+.ChatMessage_role-assistant__wketE,.ChatMessage_role-system__g13OP+.ChatMessage_role-system__g13OP,.ChatMessage_role-user__u4JPV+.ChatMessage_role-user__u4JPV{padding-top:var(--p-1)}.ChatMessage_role-user__u4JPV{align-items:flex-end;max-width:100%;min-width:0}.ChatMessage_role-user__u4JPV .ChatMessage_userColumn__cQM6-{align-items:flex-end;display:flex;flex-direction:column;gap:var(--p-2);max-width:100%;min-width:0}.ChatMessage_role-user__u4JPV .ChatMessage_text__Y1XNR{background-color:var(--sb-slate-100);border-radius:var(--p-4);border-bottom-right-radius:0;box-sizing:border-box;overflow:hidden;padding:var(--p-3) var(--p-4);white-space:pre-wrap}.dark .ChatMessage_role-user__u4JPV .ChatMessage_text__Y1XNR{background-color:var(--sb-gray-800)}.ChatMessage_role-system__g13OP{align-items:center}.ChatMessage_role-system__g13OP .ChatMessage_text__Y1XNR{color:var(--muted-foreground);width:100%}.ChatMessage_role-assistant__wketE .ChatMessage_text__Y1XNR{width:100%}.ChatMessage_role-assistant__wketE h3{line-height:2.4}.ChatMessage_role-assistant__wketE h4{font-size:1.1em;font-weight:600;line-height:2.2}.ChatMessage_role-assistant__wketE .ChatMessage_bullet__6vAhq{display:inline-block;margin-left:4px;margin-right:6px}.ChatMessage_role-assistant__wketE .ChatMessage_bullet__6vAhq:before{color:var(--text-secondary);content:\"•\";display:inline-block}.ChatMessage_role-assistant__wketE .ChatMessage_scrollHorizontal__Rms9n{max-width:100%}.ChatMessage_role-assistant__wketE table{border:1px solid var(--border);border-collapse:collapse;border-radius:var(--p-2);border-spacing:0;margin:var(--p-4) 0;overflow:hidden}.ChatMessage_role-assistant__wketE table td,.ChatMessage_role-assistant__wketE table th{border:1px solid var(--border);min-width:100px;padding:var(--p-1)}.ChatMessage_role-assistant__wketE table th{text-align:left}.ChatMessage_role-assistant__wketE ol,.ChatMessage_role-assistant__wketE ul{padding-left:var(--p-4)}.ChatMessage_role-assistant__wketE ul{list-style-type:disc}.ChatMessage_role-assistant__wketE ol{list-style-type:decimal}.ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T{align-items:center;border:1px dashed var(--sb-slate-300);border-radius:8px;color:var(--foreground);display:inline-flex;font-size:var(--text-xs);gap:6px;margin:1px;max-width:100%;padding:2px 6px 2px 4px;text-decoration:none;vertical-align:middle}.ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T:hover{background-color:var(--sb-slate-50);border-color:var(--sb-slate-400);border-style:solid}.dark .ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T{border-color:var(--sb-gray-600)}.dark .ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T:hover{background-color:var(--sb-gray-900)}.ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLinkLabel__PMU7e{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ChatMessage_role-assistant__wketE .ChatMessage_quickReplyWrap__1UFyD{display:inline-block;margin:var(--p-1) var(--p-1) var(--p-1) 0;vertical-align:middle}.ChatMessage_role-assistant__wketE .ChatMessage_downloadButtons__RygM-{display:flex;gap:var(--p-2);margin-top:var(--p-4)}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa{align-items:center;background-color:var(--background);border-radius:var(--p-3);box-shadow:0 0 0 1px var(--border);cursor:pointer;display:flex;gap:var(--p-4);margin-top:var(--p-3);padding:var(--p-3);padding-right:var(--p-4);transition:all .15s;width:-moz-fit-content;width:fit-content}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa:hover{background-color:var(--sb-gray-50);border-color:var(--border)}.dark .ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa{background-color:var(--sb-gray-900);border-color:var(--border)}.dark .ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa:hover{background-color:var(--sb-gray-800)}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardIcon__jkxDJ{align-items:center;border-radius:var(--p-2);display:flex;flex-shrink:0;height:32px;justify-content:center;width:32px}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardContent__PTPwz{display:flex;flex:1;flex-direction:column;min-width:0}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardTitle__K1wqr{font-size:var(--text-base);font-weight:600;line-height:1.4}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardSubtitle__fVeF2{color:var(--muted-foreground);font-size:var(--text-sm);line-height:1.4}";
+var css_248z = ".ChatMessage_root__6rnsF{background:var(--bg-secondary);display:flex;flex-direction:column;gap:var(--p-1);padding:var(--p-4);padding-bottom:var(--p-1)}.ChatMessage_text__Y1XNR{color:var(--text-secondary);font-size:var(--text-sm);max-width:100%;min-width:0;overflow-wrap:anywhere;-webkit-user-select:text;-moz-user-select:text;user-select:text;width:-moz-fit-content;width:fit-content;word-break:break-word}.ChatMessage_role-assistant__wketE+.ChatMessage_role-assistant__wketE,.ChatMessage_role-system__g13OP+.ChatMessage_role-system__g13OP,.ChatMessage_role-user__u4JPV+.ChatMessage_role-user__u4JPV{padding-top:var(--p-1)}.ChatMessage_role-user__u4JPV{align-items:flex-end;max-width:100%;min-width:0}.ChatMessage_role-user__u4JPV .ChatMessage_userColumn__cQM6-{align-items:flex-end;display:flex;flex-direction:column;gap:var(--p-2);max-width:100%;min-width:0}.ChatMessage_role-user__u4JPV .ChatMessage_text__Y1XNR{background-color:var(--sb-slate-100);border-radius:var(--p-4);border-bottom-right-radius:0;box-sizing:border-box;overflow:hidden;padding:var(--p-3) var(--p-4);white-space:pre-wrap}.dark .ChatMessage_role-user__u4JPV .ChatMessage_text__Y1XNR{background-color:var(--sb-gray-900)}.ChatMessage_role-system__g13OP{align-items:center}.ChatMessage_role-system__g13OP .ChatMessage_text__Y1XNR{color:var(--muted-foreground);width:100%}.ChatMessage_role-assistant__wketE .ChatMessage_text__Y1XNR{width:100%}.ChatMessage_role-assistant__wketE h3{line-height:2.4}.ChatMessage_role-assistant__wketE h4{font-size:1.1em;font-weight:600;line-height:2.2}.ChatMessage_role-assistant__wketE .ChatMessage_bullet__6vAhq{display:inline-block;margin-left:4px;margin-right:6px}.ChatMessage_role-assistant__wketE .ChatMessage_bullet__6vAhq:before{color:var(--text-secondary);content:\"•\";display:inline-block}.ChatMessage_role-assistant__wketE .ChatMessage_scrollHorizontal__Rms9n{max-width:100%}.ChatMessage_role-assistant__wketE table{border:1px solid var(--border);border-collapse:collapse;border-radius:var(--p-2);border-spacing:0;margin:var(--p-4) 0;overflow:hidden}.ChatMessage_role-assistant__wketE table td,.ChatMessage_role-assistant__wketE table th{border:1px solid var(--border);min-width:100px;padding:var(--p-1)}.ChatMessage_role-assistant__wketE table th{text-align:left}.ChatMessage_role-assistant__wketE ol,.ChatMessage_role-assistant__wketE ul{padding-left:var(--p-4)}.ChatMessage_role-assistant__wketE ul{list-style-type:disc}.ChatMessage_role-assistant__wketE ol{list-style-type:decimal}.ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T{align-items:center;border:1px dashed var(--sb-slate-300);border-radius:8px;color:var(--foreground);display:inline-flex;font-size:var(--text-xs);gap:6px;margin:1px;max-width:100%;padding:2px 6px 2px 4px;text-decoration:none;vertical-align:middle}.ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T:hover{background-color:var(--sb-slate-50);border-color:var(--sb-slate-400);border-style:solid}.dark .ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T{border-color:var(--sb-gray-600)}.dark .ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLink__Pxy-T:hover{background-color:var(--sb-gray-900)}.ChatMessage_role-assistant__wketE .ChatMessage_datasetAppLinkLabel__PMU7e{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ChatMessage_role-assistant__wketE .ChatMessage_quickReplyWrap__1UFyD{display:inline-block;margin:var(--p-1) var(--p-1) var(--p-1) 0;vertical-align:middle}.ChatMessage_role-assistant__wketE .ChatMessage_downloadButtons__RygM-{display:flex;gap:var(--p-2);margin-top:var(--p-4)}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa{align-items:center;background-color:var(--background);border-radius:var(--p-3);box-shadow:0 0 0 1px var(--border);cursor:pointer;display:flex;gap:var(--p-4);margin-top:var(--p-3);padding:var(--p-3);padding-right:var(--p-4);transition:all .15s;width:-moz-fit-content;width:fit-content}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa:hover{background-color:var(--sb-gray-50);border-color:var(--border)}.dark .ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa{background-color:var(--sb-gray-900);border-color:var(--border)}.dark .ChatMessage_role-assistant__wketE .ChatMessage_downloadCard__NsNRa:hover{background-color:var(--sb-gray-800)}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardIcon__jkxDJ{align-items:center;border-radius:var(--p-2);display:flex;flex-shrink:0;height:32px;justify-content:center;width:32px}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardContent__PTPwz{display:flex;flex:1;flex-direction:column;min-width:0}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardTitle__K1wqr{font-size:var(--text-base);font-weight:600;line-height:1.4}.ChatMessage_role-assistant__wketE .ChatMessage_downloadCardSubtitle__fVeF2{color:var(--muted-foreground);font-size:var(--text-sm);line-height:1.4}";
 var S = {"root":"ChatMessage_root__6rnsF","text":"ChatMessage_text__Y1XNR","role-user":"ChatMessage_role-user__u4JPV","role-assistant":"ChatMessage_role-assistant__wketE","role-system":"ChatMessage_role-system__g13OP","userColumn":"ChatMessage_userColumn__cQM6-","bullet":"ChatMessage_bullet__6vAhq","scrollHorizontal":"ChatMessage_scrollHorizontal__Rms9n","datasetAppLink":"ChatMessage_datasetAppLink__Pxy-T","datasetAppLinkLabel":"ChatMessage_datasetAppLinkLabel__PMU7e","quickReplyWrap":"ChatMessage_quickReplyWrap__1UFyD","downloadButtons":"ChatMessage_downloadButtons__RygM-","downloadCard":"ChatMessage_downloadCard__NsNRa","downloadCardIcon":"ChatMessage_downloadCardIcon__jkxDJ","downloadCardContent":"ChatMessage_downloadCardContent__PTPwz","downloadCardTitle":"ChatMessage_downloadCardTitle__K1wqr","downloadCardSubtitle":"ChatMessage_downloadCardSubtitle__fVeF2"};
 styleInject(css_248z);
 

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

@@ -143,8 +143,11 @@ function useChatPromptEditor({ disabled, placeholder, slashCommandItems, onSlash
             const dom = chatPromptSafeEditorDom(editor);
             if (dom)
                 syncChatPromptComposerHeight(dom, t);
+            if (!disabled && !editor.isDestroyed) {
+                editor.chain().focus('end').run();
+            }
         });
-    }, [editor, prefillMessage]);
+    }, [editor, prefillMessage, disabled]);
     useLayoutEffect(() => {
         if (!editor)
             return;

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

@@ -45,17 +45,18 @@ function Renamer({ value = '', onInput, onChange, children, className, placehold
         setName(value);
         setIsRenaming(true);
     }, [value]);
-    const sizeMap = {
+    const inputSizeMap = {
         sm: 'sm',
         md: 'md',
-        lg: 'lg',
+        // lg typography comes from Renamer `.size-lg`; avoid Input size-lg (text-base).
+        lg: 'md',
     };
     const buttonSizeMap = {
         sm: 'sm',
         md: 'md',
         lg: 'lg',
     };
-    return (jsx("div", { className: cn(S.root, !value && S.empty, className), onKeyDown: onKeyDown, children: isRenaming ? (jsx(Input, { className: S.input, autoFocus: !isMobile, variant: "clean", size: sizeMap[size], placeholder: placeholder, value: name, onChange: handleInputChange, onBlur: handleBlur, onKeyDown: onKeyDown })) : (jsxs(Fragment, { children: [jsx("span", { className: S.value, children: children }), jsxs(Tooltip, { children: [jsx(TooltipTrigger, { asChild: true, children: jsx(Button, { className: S.button, variant: "ghost", onPointerDown: e => {
+    return (jsx("div", { className: cn(S.root, S[`size-${size}`], !value && S.empty, className), onKeyDown: onKeyDown, children: isRenaming ? (jsx(Input, { className: S.input, autoFocus: !isMobile, variant: "clean", size: inputSizeMap[size], placeholder: placeholder, value: name, onChange: handleInputChange, onBlur: handleBlur, onKeyDown: onKeyDown })) : (jsxs(Fragment, { children: [jsx("span", { className: S.value, children: children }), jsxs(Tooltip, { children: [jsx(TooltipTrigger, { asChild: true, children: jsx(Button, { className: S.button, variant: "ghost", onPointerDown: e => {
                                     e.preventDefault();
                                     e.stopPropagation();
                                 }, onClick: e => {

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

@@ -1,7 +1,7 @@
 import styleInject from 'style-inject';
 
-var css_248z = ".Renamer_root__26OvT{align-items:center;display:flex}.Renamer_value__G8b1D{padding-right:var(--p-2)}.Renamer_input__KRnGn label{border-radius:var(--p-2)!important;font-size:18px!important}.Renamer_empty__A7xx1 .Renamer_input__KRnGn label{background-color:var(--accent)/.1}.Renamer_button__jKMLc{opacity:.5;padding-left:0;transition:opacity .2s ease-out}.Renamer_root__26OvT:hover .Renamer_button__jKMLc{opacity:1}";
-var S = {"root":"Renamer_root__26OvT","value":"Renamer_value__G8b1D","input":"Renamer_input__KRnGn","empty":"Renamer_empty__A7xx1","button":"Renamer_button__jKMLc"};
+var css_248z = ".Renamer_root__26OvT{align-items:center;display:flex}.Renamer_value__G8b1D{padding-right:var(--p-2)}.Renamer_size-lg__dfVhW.Renamer_root__26OvT .Renamer_input__KRnGn,.Renamer_size-lg__dfVhW.Renamer_root__26OvT .Renamer_value__G8b1D{color:var(--foreground);font-family:var(--font-family-heading);font-size:var(--text-2xl);font-weight:300;line-height:var(--text-2xl)}.Renamer_size-lg__dfVhW.Renamer_root__26OvT .Renamer_input__KRnGn{border-radius:var(--p-4);box-shadow:0 0 0 1px var(--border);height:auto;min-height:var(--text-2xl);padding:4px 12px 4px 0}.Renamer_empty__A7xx1.Renamer_size-lg__dfVhW.Renamer_root__26OvT .Renamer_input__KRnGn{background-color:var(--accent)/.1}.Renamer_button__jKMLc{opacity:.5;padding-left:0;transition:opacity .2s ease-out}.Renamer_root__26OvT:hover .Renamer_button__jKMLc{opacity:1}";
+var S = {"root":"Renamer_root__26OvT","value":"Renamer_value__G8b1D","size-lg":"Renamer_size-lg__dfVhW","input":"Renamer_input__KRnGn","empty":"Renamer_empty__A7xx1","button":"Renamer_button__jKMLc"};
 styleInject(css_248z);
 
 export { S as default };

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

@@ -12,12 +12,23 @@ import S from './WorkspaceAppSwitcher.styl.js';
 function entryKey(entry) {
     return entry.id;
 }
-function IconTile({ iconKey, accentMuted, accent, }) {
-    const IconComponent = WORKSPACE_APP_ICONS[iconKey];
+function renderIconContent(icon, iconKey) {
+    if (icon != null) {
+        return (jsx("span", { className: S.icon, "aria-hidden": true, children: icon }));
+    }
+    if (iconKey != null) {
+        const IconComponent = WORKSPACE_APP_ICONS[iconKey];
+        if (IconComponent) {
+            return jsx(IconComponent, { className: S.icon, "aria-hidden": true });
+        }
+    }
+    return null;
+}
+function IconTile({ icon, iconKey, accentMuted, accent, }) {
     return (jsx("span", { className: S.iconTile, style: {
             '--bg-color': accentMuted,
             '--fg-color': accent,
-        }, children: jsx(IconComponent, { className: S.icon, "aria-hidden": true }) }));
+        }, children: renderIconContent(icon, iconKey) }));
 }
 function useResolvedApps(appsStorageKey, defaultApps) {
     const [apps, setApps] = useState(() => {
@@ -51,11 +62,11 @@ function WorkspaceAppSwitcher({ pathname, onNavigate, authenticated = true, defa
     if (!displayApp) {
         return null;
     }
-    return (jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs(Button, { variant: "ghost", className: S.trigger, "aria-label": "Select workspace app", children: [jsx(IconTile, { iconKey: displayApp.iconKey, accentMuted: displayApp.accentMuted, accent: displayApp.accent }), jsxs("span", { className: S.textCol, children: [jsx("span", { className: S.name, children: displayApp.displayName }), jsx("span", { className: S.sub, children: displayApp.subtitle })] }), jsx(ChevronDown, { className: S.chevron, size: 12, "aria-hidden": true })] }) }), jsx(DropdownMenuContent, { className: S.menuContent, align: "start", sideOffset: 8, elevation: "md", children: apps.map(entry => {
+    return (jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs(Button, { variant: "ghost", className: S.trigger, "aria-label": "Select workspace app", children: [jsx(IconTile, { icon: displayApp.icon, iconKey: displayApp.iconKey, accentMuted: displayApp.accentMuted, accent: displayApp.accent }), jsxs("span", { className: S.textCol, children: [jsx("span", { className: S.name, children: displayApp.displayName }), jsx("span", { className: S.sub, children: displayApp.subtitle })] }), jsx(ChevronDown, { className: S.chevron, size: 12, "aria-hidden": true })] }) }), jsx(DropdownMenuContent, { className: S.menuContent, align: "start", sideOffset: 8, elevation: "md", children: apps.map(entry => {
                     const active = current != null ? entryKey(entry) === entryKey(current) : false;
                     return (jsxs(DropdownMenuItem, { className: cn(S.item, active && S.itemActive), onSelect: () => {
                             onNavigate(entry.href);
-                        }, children: [jsx(IconTile, { iconKey: entry.iconKey, accentMuted: entry.accentMuted, accent: entry.accent }), jsxs("span", { className: S.textCol, children: [jsx("span", { className: S.name, children: entry.displayName }), jsx("span", { className: S.sub, children: entry.subtitle })] })] }, entry.id));
+                        }, children: [jsx(IconTile, { icon: entry.icon, iconKey: entry.iconKey, accentMuted: entry.accentMuted, accent: entry.accent }), jsxs("span", { className: S.textCol, children: [jsx("span", { className: S.name, children: entry.displayName }), jsx("span", { className: S.sub, children: entry.subtitle })] })] }, entry.id));
                 }) })] }));
 }
 

package/dist/esm/components/ui/WorkspaceAppSwitcher/WorkspaceAppSwitcher.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)}}.WorkspaceAppSwitcher_trigger__s6qYT{align-items:center;background:transparent;border:none;border-radius:12px;color:inherit;cursor:pointer;display:flex;font:inherit;gap:var(--p-2);height:auto;margin-left:var(--p-3)!important;max-width:320px;padding:var(--p-1)!important;padding-right:var(--p-3)!important;text-align:left}.WorkspaceAppSwitcher_trigger__s6qYT:hover{background-color:var(--muted)}@media (max-width:768px){.WorkspaceAppSwitcher_trigger__s6qYT{gap:0;margin-left:0!important;max-width:none;padding-right:var(--p-1)!important}.WorkspaceAppSwitcher_trigger__s6qYT .WorkspaceAppSwitcher_chevron__7kAqO,.WorkspaceAppSwitcher_trigger__s6qYT .WorkspaceAppSwitcher_textCol__K1gfI{display:none}}.WorkspaceAppSwitcher_iconTile__tVDr8{align-items:center;border-radius:10px;color:var(--fg-color);display:flex;flex-shrink:0;height:40px;justify-content:center;position:relative;width:40px}.WorkspaceAppSwitcher_iconTile__tVDr8:after,.WorkspaceAppSwitcher_iconTile__tVDr8:before{border-radius:inherit;content:\"\";display:block;height:100%;position:absolute;width:100%}.WorkspaceAppSwitcher_iconTile__tVDr8:before{background-color:var(--background)}.WorkspaceAppSwitcher_iconTile__tVDr8:after{background-color:var(--bg-color)}.WorkspaceAppSwitcher_icon__Jgw14{color:var(--fg-color)!important;height:22px!important;width:22px!important;z-index:1}.WorkspaceAppSwitcher_textCol__K1gfI{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.WorkspaceAppSwitcher_name__ewMYP{color:var(--foreground);font-size:var(--text-sm);font-weight:600}.WorkspaceAppSwitcher_name__ewMYP,.WorkspaceAppSwitcher_sub__b7w1p{line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.WorkspaceAppSwitcher_sub__b7w1p{color:var(--muted-foreground);font-size:var(--text-xs)}.WorkspaceAppSwitcher_menuContent__4-UNY{max-width:360px;min-width:280px}.WorkspaceAppSwitcher_item__nnufY{align-items:center;cursor:pointer;display:flex;gap:var(--p-3);outline:none;padding:var(--p-3)}.WorkspaceAppSwitcher_itemActive__3mPlO{background-color:var(--muted)}";
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.WorkspaceAppSwitcher_trigger__s6qYT{align-items:center;background:transparent;border:none;border-radius:12px;color:inherit;cursor:pointer;display:flex;font:inherit;gap:var(--p-2);height:auto;margin-left:var(--p-3)!important;max-width:320px;padding:var(--p-1)!important;padding-right:var(--p-3)!important;text-align:left}.WorkspaceAppSwitcher_trigger__s6qYT:hover{background-color:var(--muted)}@media (max-width:768px){.WorkspaceAppSwitcher_trigger__s6qYT{gap:0;margin-left:0!important;max-width:none;padding-right:var(--p-1)!important}.WorkspaceAppSwitcher_trigger__s6qYT .WorkspaceAppSwitcher_chevron__7kAqO,.WorkspaceAppSwitcher_trigger__s6qYT .WorkspaceAppSwitcher_textCol__K1gfI{display:none}}.WorkspaceAppSwitcher_iconTile__tVDr8{align-items:center;border-radius:10px;color:var(--fg-color);display:flex;flex-shrink:0;height:40px;justify-content:center;position:relative;width:40px}.WorkspaceAppSwitcher_iconTile__tVDr8:after,.WorkspaceAppSwitcher_iconTile__tVDr8:before{border-radius:inherit;content:\"\";display:block;height:100%;position:absolute;width:100%}.WorkspaceAppSwitcher_iconTile__tVDr8:before{background-color:var(--background)}.WorkspaceAppSwitcher_iconTile__tVDr8:after{background-color:var(--bg-color)}.WorkspaceAppSwitcher_icon__Jgw14{align-items:center;display:flex;justify-content:center;z-index:1}.WorkspaceAppSwitcher_icon__Jgw14,.WorkspaceAppSwitcher_icon__Jgw14 svg{color:var(--fg-color)!important;height:22px!important;width:22px!important}.WorkspaceAppSwitcher_textCol__K1gfI{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.WorkspaceAppSwitcher_name__ewMYP{color:var(--foreground);font-size:var(--text-sm);font-weight:600}.WorkspaceAppSwitcher_name__ewMYP,.WorkspaceAppSwitcher_sub__b7w1p{line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.WorkspaceAppSwitcher_sub__b7w1p{color:var(--muted-foreground);font-size:var(--text-xs)}.WorkspaceAppSwitcher_menuContent__4-UNY{max-width:360px;min-width:280px}.WorkspaceAppSwitcher_item__nnufY{align-items:center;cursor:pointer;display:flex;gap:var(--p-3);outline:none;padding:var(--p-3)}.WorkspaceAppSwitcher_itemActive__3mPlO{background-color:var(--muted)}";
 var S = {"trigger":"WorkspaceAppSwitcher_trigger__s6qYT","textCol":"WorkspaceAppSwitcher_textCol__K1gfI","chevron":"WorkspaceAppSwitcher_chevron__7kAqO","iconTile":"WorkspaceAppSwitcher_iconTile__tVDr8","icon":"WorkspaceAppSwitcher_icon__Jgw14","name":"WorkspaceAppSwitcher_name__ewMYP","sub":"WorkspaceAppSwitcher_sub__b7w1p","menuContent":"WorkspaceAppSwitcher_menuContent__4-UNY","item":"WorkspaceAppSwitcher_item__nnufY","itemActive":"WorkspaceAppSwitcher_itemActive__3mPlO"};
 styleInject(css_248z);
 

package/dist/esm/components/widgets/SybilionAppHeader/SybilionAppHeader.js

@@ -12,7 +12,7 @@ import 'lucide-react';
 import S from './SybilionAppHeader.styl.js';
 
 function SybilionAppHeader({ pageHeaderId, actionsAnchorId = PAGE_HEADER_ACTIONS_ID, actionsAnchorClassName, actionsStart, actionsEnd, pathname, onNavigate, authenticated, defaultApps, appsStorageKey, logo, logoAreaClassName, welcomeBannerOffset, ...navUserHeaderProps }) {
-    return (jsxs(AppHeaderPortal, { pageHeaderId: pageHeaderId, children: [jsx("div", { className: cn(S.logoArea, welcomeBannerOffset && S.logoAreaWithBanner, logoAreaClassName), children: jsx(Link, { to: "/", className: S.logoLink, children: logo ?? jsx(Logo, { size: "md", "aria-hidden": true }) }) }), jsx(WorkspaceAppSwitcher, { pathname: pathname, onNavigate: onNavigate, authenticated: authenticated, defaultApps: defaultApps, appsStorageKey: appsStorageKey }), jsx(Gap, {}), jsxs("div", { id: actionsAnchorId, className: cn(S.actionsAnchor, actionsAnchorClassName), children: [actionsStart, jsx(NavUserHeader, { ...navUserHeaderProps }), actionsEnd] })] }));
+    return (jsxs(AppHeaderPortal, { pageHeaderId: pageHeaderId, children: [jsx("div", { className: cn(S.logoArea, welcomeBannerOffset && S.logoAreaWithBanner, logoAreaClassName), children: jsx(Link, { to: "/", className: S.logoLink, children: logo ?? jsx(Logo, { size: "md", "aria-hidden": true }) }) }), jsx(WorkspaceAppSwitcher, { pathname: pathname, onNavigate: onNavigate, authenticated: authenticated, defaultApps: defaultApps, appsStorageKey: appsStorageKey }), jsx(Gap, {}), jsxs("div", { className: cn(S.actionsAnchor, actionsAnchorClassName), children: [jsx("div", { id: actionsAnchorId, className: S.pageActionsPortal }), actionsStart, jsx(NavUserHeader, { ...navUserHeaderProps }), actionsEnd] })] }));
 }
 
 export { SybilionAppHeader };

package/dist/esm/components/widgets/SybilionAppHeader/SybilionAppHeader.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)}}.SybilionAppHeader_actionsAnchor__ress2{align-items:center;display:flex;flex-shrink:0;gap:var(--p-4)}.SybilionAppHeader_logoArea__3HAhG{align-items:center;display:flex;gap:var(--p-2);left:40px;position:absolute;top:22px;z-index:10}@media (max-width:768px){.SybilionAppHeader_logoArea__3HAhG{left:32px}}@media (min-width:768px){[data-slot=sidebar-wrapper][data-state=expanded] .SybilionAppHeader_logoArea__3HAhG{position:fixed}}.SybilionAppHeader_logoAreaWithBanner__7Iy78{top:22px;top:calc(22px + var(--welcome-banner-height, 0px))}@media (min-width:768px){[data-slot=sidebar-wrapper][data-state=collapsed] .SybilionAppHeader_logoAreaWithBanner__7Iy78{top:22px}}.SybilionAppHeader_logoLink__bH-KX{align-items:center;color:var(--color-foreground);display:flex;font-size:1.5rem;font-weight:400;gap:.5rem;text-decoration:none;white-space:nowrap;width:-moz-fit-content;width:fit-content}.SybilionAppHeader_logoLink__bH-KX svg{display:inline-flex;flex-shrink:0;height:32px;transition:transform .1s ease-in-out;width:auto}.SybilionAppHeader_logoLink__bH-KX:hover svg{transform:scale(1.05)}";
-var S = {"actionsAnchor":"SybilionAppHeader_actionsAnchor__ress2","logoArea":"SybilionAppHeader_logoArea__3HAhG","logoAreaWithBanner":"SybilionAppHeader_logoAreaWithBanner__7Iy78","logoLink":"SybilionAppHeader_logoLink__bH-KX"};
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.SybilionAppHeader_actionsAnchor__ress2,.SybilionAppHeader_pageActionsPortal__9C5ww{align-items:center;display:flex;flex-shrink:0;gap:var(--p-4)}.SybilionAppHeader_pageActionsPortal__9C5ww:empty{display:none}.SybilionAppHeader_logoArea__3HAhG{align-items:center;display:flex;gap:var(--p-2);left:40px;position:absolute;top:22px;z-index:10}@media (max-width:768px){.SybilionAppHeader_logoArea__3HAhG{left:32px}}@media (min-width:768px){[data-slot=sidebar-wrapper][data-state=expanded] .SybilionAppHeader_logoArea__3HAhG{position:fixed}}.SybilionAppHeader_logoAreaWithBanner__7Iy78{top:22px;top:calc(22px + var(--welcome-banner-height, 0px))}@media (min-width:768px){[data-slot=sidebar-wrapper][data-state=collapsed] .SybilionAppHeader_logoAreaWithBanner__7Iy78{top:22px}}.SybilionAppHeader_logoLink__bH-KX{align-items:center;color:var(--color-foreground);display:flex;font-size:1.5rem;font-weight:400;gap:.5rem;text-decoration:none;white-space:nowrap;width:-moz-fit-content;width:fit-content}.SybilionAppHeader_logoLink__bH-KX svg{display:inline-flex;flex-shrink:0;height:32px;transition:transform .1s ease-in-out;width:auto}.SybilionAppHeader_logoLink__bH-KX:hover svg{transform:scale(1.05)}";
+var S = {"actionsAnchor":"SybilionAppHeader_actionsAnchor__ress2","pageActionsPortal":"SybilionAppHeader_pageActionsPortal__9C5ww","logoArea":"SybilionAppHeader_logoArea__3HAhG","logoAreaWithBanner":"SybilionAppHeader_logoAreaWithBanner__7Iy78","logoLink":"SybilionAppHeader_logoLink__bH-KX"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/types/src/components/ui/WorkspaceAppSwitcher/workspaceApp.types.d.ts

@@ -1,3 +1,4 @@
+import type { ReactNode } from 'react';
 import type { WorkspaceAppIconKey } from './workspaceAppIcons';
 /** Path segment for slug apps: pathname matches `/apps/{id}` */
 export declare const WORKSPACE_APP_SLUG_BASE_PATH = "/apps";
@@ -7,7 +8,10 @@ export type WorkspaceAppEntry = {
     id: string;
     displayName: string;
     subtitle: string;
-    iconKey: WorkspaceAppIconKey;
+    /** Custom icon for display; not persisted to localStorage. */
+    icon?: ReactNode;
+    /** Built-in icon lookup when `icon` is omitted (required for localStorage entries). */
+    iconKey?: WorkspaceAppIconKey;
     accent: string;
     accentMuted: string;
     href: string;

package/dist/esm/types/src/docs/pages/ChatComposerPrefillPage.d.ts

@@ -0,0 +1 @@
+export default function ChatComposerPrefillPage(): import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sybilion/uilib",
-  "version": "1.3.68",
+  "version": "1.3.71",
   "description": "Sybilion Design System — React UI components (Webpack + Stylus)",
   "publishConfig": {
     "access": "public",

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

@@ -48,7 +48,7 @@
     box-sizing border-box
 
     :global(.dark) &
-      background-color var(--sb-gray-800)
+      background-color var(--sb-gray-900)
 
 .role-system
   align-items center

package/src/components/ui/Chat/ChatPrompt/useChatPromptEditor.ts

@@ -208,8 +208,11 @@ export function useChatPromptEditor({
     queueMicrotask(() => {
       const dom = chatPromptSafeEditorDom(editor);
       if (dom) syncChatPromptComposerHeight(dom, t);
+      if (!disabled && !editor.isDestroyed) {
+        editor.chain().focus('end').run();
+      }
     });
-  }, [editor, prefillMessage]);
+  }, [editor, prefillMessage, disabled]);
 
   useLayoutEffect(() => {
     if (!editor) return;

package/src/components/ui/Renamer/Renamer.styl

@@ -5,12 +5,28 @@
 .value
   padding-right var(--p-2)
 
-.input
-  label
-    font-size 18px !important
-    border-radius var(--p-2) !important
+// Matches PageHeader .title h1 typography (page title context).
+.size-lg.root
+  .value
+    font-family var(--font-family-heading)
+    font-weight 300
+    font-size var(--text-2xl)
+    line-height var(--text-2xl)
+    color var(--foreground)
 
-.empty .input label
+  .input
+    font-family var(--font-family-heading)
+    font-weight 300
+    font-size var(--text-2xl)
+    line-height var(--text-2xl)
+    color var(--foreground)
+    height auto
+    min-height var(--text-2xl)
+    padding 4px 12px 4px 0
+    border-radius var(--p-4)
+    box-shadow 0 0 0 1px var(--border)
+
+.empty.size-lg.root .input
   background-color var(--accent) / 0.1
 
 .button

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

@@ -5,6 +5,7 @@ interface CssExports {
   'empty': string;
   'input': string;
   'root': string;
+  'size-lg': string;
   'value': string;
 }
 export const cssExports: CssExports;

package/src/components/ui/Renamer/Renamer.tsx

@@ -74,10 +74,11 @@ export function Renamer({
     setIsRenaming(true);
   }, [value]);
 
-  const sizeMap = {
+  const inputSizeMap = {
     sm: 'sm' as const,
     md: 'md' as const,
-    lg: 'lg' as const,
+    // lg typography comes from Renamer `.size-lg`; avoid Input size-lg (text-base).
+    lg: 'md' as const,
   };
 
   const buttonSizeMap = {
@@ -88,7 +89,7 @@ export function Renamer({
 
   return (
     <div
-      className={cn(S.root, !value && S.empty, className)}
+      className={cn(S.root, S[`size-${size}`], !value && S.empty, className)}
       onKeyDown={onKeyDown}
     >
       {isRenaming ? (
@@ -96,7 +97,7 @@ export function Renamer({
           className={S.input}
           autoFocus={!isMobile}
           variant="clean"
-          size={sizeMap[size]}
+          size={inputSizeMap[size]}
           placeholder={placeholder}
           value={name}
           onChange={handleInputChange}

package/src/components/ui/WorkspaceAppSwitcher/WorkspaceAppSwitcher.styl

@@ -59,10 +59,18 @@
 
 .icon
   z-index 1
+  display flex
+  align-items center
+  justify-content center
   width 22px !important
   height 22px !important
   color var(--fg-color) !important
 
+  :global(svg)
+    width 22px !important
+    height 22px !important
+    color var(--fg-color) !important
+
 .textCol
   display flex
   flex-direction column

package/src/components/ui/WorkspaceAppSwitcher/WorkspaceAppSwitcher.tsx

@@ -1,5 +1,5 @@
 import cn from 'classnames';
-import type { CSSProperties } from 'react';
+import type { CSSProperties, ReactNode } from 'react';
 import { useEffect, useState } from 'react';
 
 import { Button } from '#uilib/components/ui/Button/Button';
@@ -32,16 +32,37 @@ function entryKey(entry: WorkspaceAppEntry): string {
   return entry.id;
 }
 
+function renderIconContent(
+  icon: ReactNode | undefined,
+  iconKey: WorkspaceAppEntry['iconKey'],
+): ReactNode {
+  if (icon != null) {
+    return (
+      <span className={S.icon} aria-hidden>
+        {icon}
+      </span>
+    );
+  }
+  if (iconKey != null) {
+    const IconComponent = WORKSPACE_APP_ICONS[iconKey];
+    if (IconComponent) {
+      return <IconComponent className={S.icon} aria-hidden />;
+    }
+  }
+  return null;
+}
+
 function IconTile({
+  icon,
   iconKey,
   accentMuted,
   accent,
 }: {
-  iconKey: WorkspaceAppEntry['iconKey'];
+  icon?: ReactNode;
+  iconKey?: WorkspaceAppEntry['iconKey'];
   accentMuted: string;
   accent: string;
 }) {
-  const IconComponent = WORKSPACE_APP_ICONS[iconKey];
   return (
     <span
       className={S.iconTile}
@@ -52,7 +73,7 @@ function IconTile({
         } as CSSProperties
       }
     >
-      <IconComponent className={S.icon} aria-hidden />
+      {renderIconContent(icon, iconKey)}
     </span>
   );
 }
@@ -116,6 +137,7 @@ export function WorkspaceAppSwitcher({
           aria-label="Select workspace app"
         >
           <IconTile
+            icon={displayApp.icon}
             iconKey={displayApp.iconKey}
             accentMuted={displayApp.accentMuted}
             accent={displayApp.accent}
@@ -146,6 +168,7 @@ export function WorkspaceAppSwitcher({
               }}
             >
               <IconTile
+                icon={entry.icon}
                 iconKey={entry.iconKey}
                 accentMuted={entry.accentMuted}
                 accent={entry.accent}

package/src/components/ui/WorkspaceAppSwitcher/workspaceApp.types.ts

@@ -1,3 +1,5 @@
+import type { ReactNode } from 'react';
+
 import type { WorkspaceAppIconKey } from './workspaceAppIcons';
 
 /** Path segment for slug apps: pathname matches `/apps/{id}` */
@@ -9,7 +11,10 @@ export type WorkspaceAppEntry = {
   id: string;
   displayName: string;
   subtitle: string;
-  iconKey: WorkspaceAppIconKey;
+  /** Custom icon for display; not persisted to localStorage. */
+  icon?: ReactNode;
+  /** Built-in icon lookup when `icon` is omitted (required for localStorage entries). */
+  iconKey?: WorkspaceAppIconKey;
   accent: string;
   accentMuted: string;
   href: string;

package/src/components/widgets/SybilionAppHeader/SybilionAppHeader.styl

@@ -6,6 +6,15 @@
   gap var(--p-4)
   flex-shrink 0
 
+.pageActionsPortal
+  display flex
+  align-items center
+  gap var(--p-4)
+  flex-shrink 0
+
+  &:empty
+    display none
+
 .logoArea
   position absolute
   top 22px

package/src/components/widgets/SybilionAppHeader/SybilionAppHeader.styl.d.ts

@@ -5,6 +5,7 @@ interface CssExports {
   'logoArea': string;
   'logoAreaWithBanner': string;
   'logoLink': string;
+  'pageActionsPortal': string;
 }
 export const cssExports: CssExports;
 export default cssExports;

package/src/components/widgets/SybilionAppHeader/SybilionAppHeader.tsx

@@ -69,10 +69,8 @@ export function SybilionAppHeader({
         appsStorageKey={appsStorageKey}
       />
       <Gap />
-      <div
-        id={actionsAnchorId}
-        className={cn(S.actionsAnchor, actionsAnchorClassName)}
-      >
+      <div className={cn(S.actionsAnchor, actionsAnchorClassName)}>
+        <div id={actionsAnchorId} className={S.pageActionsPortal} />
         {actionsStart}
         <NavUserHeader {...navUserHeaderProps} />
         {actionsEnd}

package/src/docs/pages/ChatComposerPrefillPage.tsx

@@ -0,0 +1,202 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+
+import { Button } from '#uilib/components/ui/Button';
+import {
+  ChatChrome,
+  type ChatSheetActions,
+  type Message,
+  MessageRole,
+} from '#uilib/components/ui/Chat';
+import { PageContentSection } from '#uilib/components/ui/Page';
+import { ScrollRef } from '@homecode/ui';
+import { MessageSquare } from 'lucide-react';
+
+import { AppPageHeader } from '../components/AppPageHeader/AppPageHeader';
+import { DOCS_CHAT_USER_KEY } from '../docsConstants';
+import { DocsHeaderActions } from '../docsHeaderActions';
+
+const NO_QUICK_REPLY_KEYS: ReadonlySet<string> = new Set();
+
+const SAMPLE_PREFILL =
+  'Summarize revenue trends for Q4 and highlight outliers.';
+
+const ASSISTANT_REPLY_TEXT =
+  'Prefill demo reply — composer should stay editable after send.';
+
+function makeMessage(role: MessageRole, text: string): Message {
+  return {
+    id: crypto.randomUUID(),
+    role,
+    text,
+    timestamp: Date.now(),
+  };
+}
+
+const DOCS_CHAT_PREFILL_SCOPE_ID = `${DOCS_CHAT_USER_KEY}-docs-composer-prefill`;
+
+export default function ChatComposerPrefillPage() {
+  const [messages, setMessages] = useState<Message[]>([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [inlinePrefill, setInlinePrefill] = useState<string | null>(null);
+  const replyTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const scrollRef = useRef<ScrollRef>(null);
+  const sheetActionsRef = useRef<ChatSheetActions | null>(null);
+
+  useEffect(() => {
+    return () => {
+      if (replyTimeoutRef.current != null) {
+        clearTimeout(replyTimeoutRef.current);
+      }
+    };
+  }, []);
+
+  const isEmpty = messages.length === 0 && !isLoading;
+  const isLastMessageFromUser =
+    messages.length > 0 &&
+    messages[messages.length - 1]?.role === MessageRole.USER;
+
+  const onSubmit = useCallback(
+    (raw: string) => {
+      const text = raw.trim();
+      if (!text || isLoading) return;
+
+      setMessages(prev => [...prev, makeMessage(MessageRole.USER, text)]);
+      setIsLoading(true);
+      setInlinePrefill(null);
+
+      if (replyTimeoutRef.current != null) {
+        clearTimeout(replyTimeoutRef.current);
+      }
+      replyTimeoutRef.current = setTimeout(() => {
+        replyTimeoutRef.current = null;
+        setMessages(prev => [
+          ...prev,
+          makeMessage(MessageRole.ASSISTANT, ASSISTANT_REPLY_TEXT),
+        ]);
+        setIsLoading(false);
+      }, 900);
+    },
+    [isLoading],
+  );
+
+  const prefillInlineComposer = useCallback(() => {
+    setInlinePrefill(SAMPLE_PREFILL);
+  }, []);
+
+  const openSheetWithPrefill = useCallback(() => {
+    sheetActionsRef.current?.openNewChatWithPrefill(SAMPLE_PREFILL);
+  }, []);
+
+  const promptDeepLink = `/docs/chat-composer-prefill?prompt=${encodeURIComponent(SAMPLE_PREFILL)}`;
+
+  return (
+    <>
+      <AppPageHeader
+        breadcrumbs={[{ label: 'Chat' }, { label: 'Composer prefill' }]}
+        title="Chat — composer prefill & focus"
+        subheader="Prefill the TipTap composer via prefillMessage, ChatSheetActions.openNewChatWithPrefill, or a ?prompt= deep link. Cursor lands at end; message is not auto-sent."
+        actions={
+          <DocsHeaderActions
+            actionsRef={sheetActionsRef}
+            scopeId={DOCS_CHAT_PREFILL_SCOPE_ID}
+            triggerLabel={<MessageSquare size={20} />}
+            triggerAriaLabel="AI Assistant"
+            emptyState={{
+              title: 'Start a conversation',
+              description:
+                'Use the buttons below or ?prompt= to pre-fill this composer.',
+            }}
+          />
+        }
+      />
+      <PageContentSection>
+        <p style={{ marginBottom: 12, fontSize: 14, lineHeight: 1.5 }}>
+          After prefill, the composer receives focus at the end of the text so
+          users can edit before sending. Wired through{' '}
+          <code style={{ fontSize: 13 }}>useChatPromptEditor</code> (
+          <code style={{ fontSize: 13 }}>prefillMessage</code>) and{' '}
+          <code style={{ fontSize: 13 }}>useChatPanelChromeModel</code> (
+          <code style={{ fontSize: 13 }}>promptPrefill</code> /{' '}
+          <code style={{ fontSize: 13 }}>openNewChatWithPrefill</code>).
+        </p>
+        <p
+          style={{
+            marginBottom: 16,
+            display: 'flex',
+            flexWrap: 'wrap',
+            gap: 8,
+          }}
+        >
+          <Button
+            type="button"
+            variant="outline"
+            size="sm"
+            onClick={prefillInlineComposer}
+          >
+            Prefill inline composer
+          </Button>
+          <Button
+            type="button"
+            variant="outline"
+            size="sm"
+            onClick={openSheetWithPrefill}
+          >
+            Open portal chat with prefill
+          </Button>
+          <Button type="button" variant="outline" size="sm" asChild>
+            <a href={promptDeepLink}>Try ?prompt= deep link</a>
+          </Button>
+        </p>
+        <h3 style={{ marginBottom: 8, fontSize: 14, fontWeight: 600 }}>
+          What to verify
+        </h3>
+        <ul
+          style={{
+            margin: '0 0 16px',
+            paddingLeft: 20,
+            fontSize: 14,
+            lineHeight: 1.6,
+          }}
+        >
+          <li>Composer shows sample text; caret at end (not start)</li>
+          <li>User can type or edit before Enter / submit</li>
+          <li>Prefill does not send until user submits</li>
+          <li>
+            Portal path: new session opens, panel visible, same focus behavior
+          </li>
+          <li>
+            Deep link strips <code style={{ fontSize: 13 }}>?prompt=</code> and
+            opens chat with prefill once
+          </li>
+        </ul>
+        <ChatChrome
+          showResizeHandle={false}
+          resizeHandle={undefined}
+          onClose={undefined}
+          isEmpty={isEmpty}
+          renderPresets={() => null}
+          messages={messages}
+          onQuickReply={() => {}}
+          suppressedQuickReplyKeys={NO_QUICK_REPLY_KEYS}
+          isLoading={isLoading}
+          scriptContinueLabel={undefined}
+          onScriptContinue={undefined}
+          showSyntheticBranchButtons={false}
+          unusedBranchKeys={[]}
+          showInlinePresets={false}
+          isLastMessageFromUser={isLastMessageFromUser}
+          scrollRef={scrollRef}
+          effectiveScopeId="docs-chat-composer-prefill-inline"
+          onPromptSubmit={onSubmit}
+          onChatDeleted={() => {}}
+          promptPrefill={inlinePrefill}
+          emptyState={{
+            title: 'Inline prefill demo',
+            description:
+              'Click “Prefill inline composer” or type below. Portal and ?prompt= use the header ChatSheet.',
+          }}
+        />
+      </PageContentSection>
+    </>
+  );
+}

package/src/docs/registry.ts

@@ -139,6 +139,12 @@ export const DOC_REGISTRY: DocEntry[] = [
     section: 'Chat',
     load: () => import('./pages/ChatAttachmentsDropzonePage'),
   },
+  {
+    slug: 'chat-composer-prefill',
+    title: 'Chat composer prefill',
+    section: 'Chat',
+    load: () => import('./pages/ChatComposerPrefillPage'),
+  },
   {
     slug: 'checkbox',
     title: 'Checkbox',