@epicbagel/saas-kit 1.25.1 → 1.27.0

package/dist/primitives/chat.cjs

@@ -17,24 +17,20 @@ var _chunkPNI354BYcjs = require('../chunk-PNI354BY.cjs');
 var _chunkM4V7OJNFcjs = require('../chunk-M4V7OJNF.cjs');
 
 
-
-var _chunkB765DSRGcjs = require('../chunk-B765DSRG.cjs');
-
+var _chunkVMXKT67Ecjs = require('../chunk-VMXKT67E.cjs');
 
 
+var _chunkU7XNNLVPcjs = require('../chunk-U7XNNLVP.cjs');
 
 
 
-
-var _chunk23IETCLVcjs = require('../chunk-23IETCLV.cjs');
-require('../chunk-DMPSKGFM.cjs');
+var _chunkB765DSRGcjs = require('../chunk-B765DSRG.cjs');
 
 
 
 
 
 var _chunkNWDPH2Z7cjs = require('../chunk-NWDPH2Z7.cjs');
-require('../chunk-Z2H4LJVG.cjs');
 
 
 
@@ -44,6 +40,14 @@ require('../chunk-2HV2KKOE.cjs');
 
 
 
+
+
+
+var _chunkDHXKCMKYcjs = require('../chunk-DHXKCMKY.cjs');
+require('../chunk-NQK5ZWC7.cjs');
+
+
+
 var _chunkZLEM2SAUcjs = require('../chunk-ZLEM2SAU.cjs');
 
 
@@ -63,6 +67,19 @@ var _chunk2BHI5ZWJcjs = require('../chunk-2BHI5ZWJ.cjs');
 
 
 var _chunkZAITUDYDcjs = require('../chunk-ZAITUDYD.cjs');
+
+
+var _chunkZBWL7OUWcjs = require('../chunk-ZBWL7OUW.cjs');
+
+
+
+
+
+
+
+var _chunk23IETCLVcjs = require('../chunk-23IETCLV.cjs');
+require('../chunk-DMPSKGFM.cjs');
+require('../chunk-Z2H4LJVG.cjs');
 require('../chunk-U2NES7VR.cjs');
 
 
@@ -114,6 +131,7 @@ var _chunkH2UFRLLNcjs = require('../chunk-H2UFRLLN.cjs');
 
 
 
+
 var _react = require('react');
 
 
@@ -162,6 +180,24 @@ function timelineMarkers(messages, now) {
 function TimelineMarker({ label }) {
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB765DSRGcjs.Marker, { variant: "separator", role: "separator", "aria-label": label, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkB765DSRGcjs.MarkerContent, { children: label }) });
 }
+function authorLines(messages, markers) {
+  let previous = null;
+  return messages.map((message, index) => {
+    if (message.status === "running") return false;
+    const shown = Boolean(message.author) && (!previous || Boolean(markers[index]) || previous.role !== message.role || _optionalChain([previous, 'access', _ => _.author, 'optionalAccess', _2 => _2.id]) !== message.author.id);
+    previous = message;
+    return shown;
+  });
+}
+function ChatAuthorLine({ author, align }) {
+  const avatar = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkU7XNNLVPcjs.PersonAvatar, { name: author.name, photoUrl: author.avatarUrl, size: 20, fallbackClassName: "text-[9px]" });
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "data-slot": "chat-author", className: _chunkKWLSBTB2cjs.cn.call(void 0, "flex items-center gap-2 text-xs", align === "end" ? "self-end" : "self-start"), children: [
+    align === "start" ? avatar : null,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium text-foreground", children: author.name }),
+    author.detail ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-muted-foreground", children: author.detail }) : null,
+    align === "end" ? avatar : null
+  ] });
+}
 function ChatRunningLine({
   label,
   align = "start",
@@ -183,9 +219,13 @@ var ChatThread = _react.forwardRef.call(void 0,
     onOpenAttachment,
     attachmentAction = "open",
     messageActions,
+    navigator,
+    navigatorLabel,
+    navigatorSide,
     className
   }, ref) {
     const markers = timelineMarkers(messages, /* @__PURE__ */ new Date());
+    const authorShown = authorLines(messages, markers);
     const anchorId = useArrivingUserTurnId(messages);
     const workspace = appearance === "workspace";
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk23IETCLVcjs.MessageScrollerProvider, { autoScroll: true, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -226,6 +266,7 @@ var ChatThread = _react.forwardRef.call(void 0,
                       children: [
                         marker ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TimelineMarker, { label: marker }) : null,
                         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNWDPH2Z7cjs.Message, { align: isUser ? "end" : "start", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkNWDPH2Z7cjs.MessageContent, { children: [
+                          m.author && authorShown[index] ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ChatAuthorLine, { author: m.author, align: isUser ? "end" : "start" }) : null,
                           (m.content || m.text) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                             _chunkV4YWTRLDcjs.Bubble,
                             {
@@ -285,7 +326,17 @@ var ChatThread = _react.forwardRef.call(void 0,
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunk23IETCLVcjs.MessageScrollerButton, { variant: "outline", className: "rounded-full shadow-sm", children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ArrowDown, { className: "h-4 w-4" }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: scrollButtonLabel })
-          ] })
+          ] }),
+          navigator && navigator.length > 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkZBWL7OUWcjs.ChatTurnNavigator,
+            {
+              items: navigator,
+              order: messages.map((m) => m.id),
+              label: navigatorLabel,
+              side: navigatorSide,
+              columnWidth: workspace ? 768 : void 0
+            }
+          ) : null
         ]
       }
     ) });
@@ -308,7 +359,7 @@ function ChatCopyAction({
       "data-copied": copied || void 0,
       onClick: async () => {
         const ok = await copy(text);
-        _optionalChain([onCopy, 'optionalCall', _ => _(ok)]);
+        _optionalChain([onCopy, 'optionalCall', _3 => _3(ok)]);
       },
       children: copied ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Check, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Copy, {})
     }
@@ -353,7 +404,7 @@ function ChatAttachmentList({
             {
               "aria-label": `${verb} ${attachment.name}`,
               title: `${verb} ${attachment.name}`,
-              onClick: () => _optionalChain([onOpen, 'optionalCall', _2 => _2(attachment)]),
+              onClick: () => _optionalChain([onOpen, 'optionalCall', _4 => _4(attachment)]),
               className: "rounded-xl focus-visible:ring-2 focus-visible:ring-ring/50"
             }
           ),
@@ -533,7 +584,7 @@ function ChatInput({
                     "data-slot": "chat-input-actions",
                     onClick: (event) => {
                       if (!event.currentTarget.contains(event.target)) return;
-                      if (!event.target.closest("button")) _optionalChain([ref, 'access', _3 => _3.current, 'optionalAccess', _4 => _4.focus, 'call', _5 => _5()]);
+                      if (!event.target.closest("button")) _optionalChain([ref, 'access', _5 => _5.current, 'optionalAccess', _6 => _6.focus, 'call', _7 => _7()]);
                     },
                     className: _chunkKWLSBTB2cjs.cn.call(void 0, 
                       compact ? "gap-1 px-2 pb-2 pt-0" : "gap-2",
@@ -552,7 +603,7 @@ function ChatInput({
                             children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Plus, { className: _chunkKWLSBTB2cjs.cn.call(void 0, spacious && "h-5 w-5") })
                           }
                         ) }),
-                        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZAITUDYDcjs.DropdownMenuContent, { align: "start", side: "top", className: "min-w-52", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkZAITUDYDcjs.DropdownMenuItem, { onSelect: () => _optionalChain([fileInputRef, 'access', _6 => _6.current, 'optionalAccess', _7 => _7.click, 'call', _8 => _8()]), children: [
+                        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZAITUDYDcjs.DropdownMenuContent, { align: "start", side: "top", className: "min-w-52", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkZAITUDYDcjs.DropdownMenuItem, { onSelect: () => _optionalChain([fileInputRef, 'access', _8 => _8.current, 'optionalAccess', _9 => _9.click, 'call', _10 => _10()]), children: [
                           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Paperclip, { className: "h-4 w-4" }),
                           addFilesLabel
                         ] }) })
@@ -719,6 +770,92 @@ function ChatSuggestions({
     )
   ] });
 }
+var DEFAULT_EMPTY_ACTIONS_LABEL = "Pick up where you left off";
+function ChatEmptyActionIcon({ icon }) {
+  if (!icon) return null;
+  if (_react.isValidElement.call(void 0, icon)) return icon;
+  if (typeof icon === "function" || typeof icon === "object" && icon !== null && "render" in icon) {
+    const IconComp = icon;
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, IconComp, { "aria-hidden": true });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: icon });
+}
+function ChatEmptyActions({
+  items,
+  label,
+  onError,
+  className
+}) {
+  const labelId = _react.useId.call(void 0, );
+  const [running, setRunning] = _react.useState.call(void 0, null);
+  if (items.length === 0) return null;
+  const showLabel = label.length > 0;
+  const pick = async (item) => {
+    if (running !== null) return;
+    let result;
+    try {
+      result = item.onSelect();
+    } catch (cause) {
+      onError(cause);
+      return;
+    }
+    if (!result || typeof result.then !== "function") return;
+    setRunning(item.id);
+    try {
+      await result;
+    } catch (cause) {
+      onError(cause);
+    } finally {
+      setRunning(null);
+    }
+  };
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "data-slot": "chat-empty-actions", className: _chunkKWLSBTB2cjs.cn.call(void 0, "w-full text-left", className), children: [
+    showLabel && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { id: labelId, "data-slot": "chat-empty-actions-label", className: "mb-1.5 px-3 text-xs text-muted-foreground", children: label }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "div",
+      {
+        role: "group",
+        "aria-labelledby": showLabel ? labelId : void 0,
+        "aria-label": showLabel ? void 0 : DEFAULT_EMPTY_ACTIONS_LABEL,
+        className: "flex flex-col gap-0.5",
+        children: items.map((item) => {
+          const busy = running === item.id;
+          return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkDHXKCMKYcjs.Item, { asChild: true, size: "sm", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+            "button",
+            {
+              type: "button",
+              "data-slot": "chat-empty-action",
+              "data-state": busy ? "loading" : void 0,
+              "aria-busy": busy || void 0,
+              disabled: item.disabled || running !== null,
+              onClick: () => void pick(item),
+              className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+                "min-h-11 cursor-pointer flex-nowrap text-left",
+                "hover:bg-muted focus-visible:bg-muted",
+                "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-transparent",
+                busy && "disabled:opacity-100"
+              ),
+              children: [
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                  _chunkDHXKCMKYcjs.ItemMedia,
+                  {
+                    variant: "icon",
+                    className: "size-8 self-center rounded-md bg-muted text-muted-foreground group-has-data-[slot=item-description]/item:translate-y-0 group-has-data-[slot=item-description]/item:self-center",
+                    children: busy ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVMXKT67Ecjs.Spinner, { "aria-hidden": true }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ChatEmptyActionIcon, { icon: item.icon })
+                  }
+                ),
+                /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkDHXKCMKYcjs.ItemContent, { className: "min-w-0 flex-row flex-wrap items-baseline gap-x-2 gap-y-0.5 md:flex-nowrap", children: [
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkDHXKCMKYcjs.ItemTitle, { className: "w-auto min-w-0 shrink-0 font-normal text-foreground md:max-w-[60%] md:truncate", children: item.label }),
+                  item.detail && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkDHXKCMKYcjs.ItemDescription, { className: "line-clamp-1 min-w-0 flex-1 truncate text-xs md:text-sm", children: item.detail })
+                ] })
+              ]
+            }
+          ) }, item.id);
+        })
+      }
+    )
+  ] });
+}
 function MobileReplySuggestions({
   items,
   onSelect,
@@ -790,11 +927,11 @@ function MobileReplySuggestions({
         className: "max-h-[min(85dvh,40rem)] overflow-hidden pb-[env(safe-area-inset-bottom)]",
         onOpenAutoFocus: (event) => {
           event.preventDefault();
-          _optionalChain([closeRef, 'access', _9 => _9.current, 'optionalAccess', _10 => _10.focus, 'call', _11 => _11({ preventScroll: true })]);
+          _optionalChain([closeRef, 'access', _11 => _11.current, 'optionalAccess', _12 => _12.focus, 'call', _13 => _13({ preventScroll: true })]);
         },
         onCloseAutoFocus: (event) => {
           event.preventDefault();
-          if (_optionalChain([triggerRef, 'access', _12 => _12.current, 'optionalAccess', _13 => _13.isConnected]) && !triggerRef.current.disabled) {
+          if (_optionalChain([triggerRef, 'access', _14 => _14.current, 'optionalAccess', _15 => _15.isConnected]) && !triggerRef.current.disabled) {
             triggerRef.current.focus({ preventScroll: true });
           }
         },
@@ -874,6 +1011,8 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
   emptySubtitle,
   examplePrompts = [],
   examplePromptsLabel = "Try",
+  emptyActions = [],
+  emptyActionsLabel = DEFAULT_EMPTY_ACTIONS_LABEL,
   examplePromptsVariant = "chips",
   examplePromptsLoading = false,
   examplePromptsLoadingLabel = "Loading suggestions\u2026",
@@ -921,6 +1060,9 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
   onOpenAttachment,
   attachmentAction,
   messageActions,
+  navigator,
+  navigatorLabel,
+  navigatorSide,
   className
 }, ref) {
   const isMobile = _chunkR35FT53Gcjs.useIsMobile.call(void 0, );
@@ -951,7 +1093,7 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
         }
         reportSendError(cause);
       }
-      window.setTimeout(() => _optionalChain([inputRef, 'access', _14 => _14.current, 'optionalAccess', _15 => _15.focus, 'call', _16 => _16()]), 0);
+      window.setTimeout(() => _optionalChain([inputRef, 'access', _16 => _16.current, 'optionalAccess', _17 => _17.focus, 'call', _18 => _18()]), 0);
     },
     [attachments, mode, onSend, pending, reportSendError]
   );
@@ -964,14 +1106,14 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
       } catch (cause) {
         reportSendError(cause);
       }
-      if (focusInput) window.setTimeout(() => _optionalChain([inputRef, 'access', _17 => _17.current, 'optionalAccess', _18 => _18.focus, 'call', _19 => _19()]), 0);
+      if (focusInput) window.setTimeout(() => _optionalChain([inputRef, 'access', _19 => _19.current, 'optionalAccess', _20 => _20.focus, 'call', _21 => _21()]), 0);
     },
     [onSend, pending, reportSendError]
   );
   _react.useImperativeHandle.call(void 0, 
     ref,
     () => ({
-      focusInput: () => _optionalChain([inputRef, 'access', _20 => _20.current, 'optionalAccess', _21 => _21.focus, 'call', _22 => _22()]),
+      focusInput: () => _optionalChain([inputRef, 'access', _22 => _22.current, 'optionalAccess', _23 => _23.focus, 'call', _24 => _24()]),
       clearInput: () => setInput("")
     }),
     []
@@ -979,7 +1121,7 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
   const dropFiles = _react.useCallback.call(void 0, 
     (files) => {
       if (!conversationStarted && mode === "voice") setUserMode("text");
-      return _optionalChain([onFilesSelected, 'optionalCall', _23 => _23(files)]);
+      return _optionalChain([onFilesSelected, 'optionalCall', _25 => _25(files)]);
     },
     [conversationStarted, mode, onFilesSelected]
   );
@@ -1110,6 +1252,15 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
                     }
                   ),
                   error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ChatError, { children: error }),
+                  !pending && emptyActions.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    ChatEmptyActions,
+                    {
+                      items: emptyActions,
+                      label: emptyActionsLabel,
+                      onError: reportSendError,
+                      className: "mt-3"
+                    }
+                  ),
                   !pending && examplePromptsLoading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ExamplePromptsLoading, { label: examplePromptsLoadingLabel }),
                   !pending && !examplePromptsLoading && examplePrompts.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                     ChatSuggestions,
@@ -1144,6 +1295,9 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
             onOpenAttachment,
             attachmentAction,
             messageActions,
+            navigator,
+            navigatorLabel,
+            navigatorSide,
             className: _chunkKWLSBTB2cjs.cn.call(void 0, 
               "mb-3",
               application && "min-h-0 flex-1 px-4 py-4 md:px-0 md:py-0",
@@ -1187,7 +1341,7 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
                       closeLabel: replySuggestionsCloseLabel,
                       disabled: pending
                     },
-                    JSON.stringify([_optionalChain([messages, 'access', _24 => _24.at, 'call', _25 => _25(-1), 'optionalAccess', _26 => _26.id]), replySuggestions])
+                    JSON.stringify([_optionalChain([messages, 'access', _26 => _26.at, 'call', _27 => _27(-1), 'optionalAccess', _28 => _28.id]), replySuggestions])
                   ) : void 0,
                   value: input,
                   onChange: setInput,
@@ -1226,4 +1380,5 @@ var Chat = _react.forwardRef.call(void 0, function Chat2({
 
 
 
-exports.Chat = Chat; exports.ChatCopyAction = ChatCopyAction; exports.ChatInput = ChatInput; exports.ChatThread = ChatThread;
+
+exports.Chat = Chat; exports.ChatCopyAction = ChatCopyAction; exports.ChatInput = ChatInput; exports.ChatThread = ChatThread; exports.authorLines = authorLines;

package/dist/primitives/chat.d.cts

@@ -1,7 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import { ReactNode } from 'react';
+import { LucideIcon } from 'lucide-react';
 import { VoiceSessionControlsProps } from './voice-session-controls.cjs';
+import { ChatNavigatorItem } from './chat-turn-navigator.cjs';
 import { MarkdownComponents } from './markdown.cjs';
 import './button.cjs';
 import 'class-variance-authority/types';
@@ -10,6 +12,17 @@ import 'react-markdown';
 import './rich-text.cjs';
 
 type ChatRole = "user" | "assistant";
+/** A turn's author, as the thread names them above their turns. */
+interface ChatMessageAuthor {
+    /** Stable for the person: consecutive turns with the same id are named once. */
+    id: string;
+    name: string;
+    /** Their photo; initials stand in without one. */
+    avatarUrl?: string | null;
+    /** A quiet note after the name, such as how the turn arrived ("by email"). */
+    detail?: string;
+}
+
 type ChatAttachment = {
     id: string;
     name: string;
@@ -38,6 +51,12 @@ type ChatMessage = {
     content?: ReactNode;
     /** Files that belong to this turn. */
     attachments?: ReadonlyArray<ChatAttachment>;
+    /**
+     * Who wrote the turn. The thread names them, with their avatar, above the
+     * first of a run of turns by the same author, so a conversation with
+     * several people in it says who said what. Turns without one are unnamed.
+     */
+    author?: ChatMessageAuthor;
     /**
      * `"running"`: a reply still being worked on. The thread draws the turn as
      * its running line, the one `pending` adds at the end, labelled with `text`
@@ -105,8 +124,24 @@ interface ChatThreadProps {
      * pointer reaches it; return `null` for none.
      */
     messageActions?: (message: ChatMessage) => ReactNode;
+    /**
+     * Places to jump to, drawn as a rail of ticks in the thread's gutter (see
+     * `ChatTurnNavigator`): the one in view marked, a preview of each on hover
+     * or focus. It shows only where the gutter has room; omit it for none.
+     */
+    navigator?: readonly ChatNavigatorItem[];
+    /** The rail's landmark name. */
+    navigatorLabel?: string;
+    /** The gutter the rail sits in. */
+    navigatorSide?: "start" | "end";
     className?: string;
 }
+/**
+ * Which turns name their author: the first of each run of turns by the same
+ * author on the same side. A time marker, a turn by someone else or a turn
+ * with no author between them starts a new run; a running line doesn't.
+ */
+declare function authorLines(messages: ReadonlyArray<ChatMessage>, markers: ReadonlyArray<string | null>): boolean[];
 /**
  * Scrollable message thread, built on shadcn's headless `MessageScroller`
  * (streaming-aware auto-scroll, anchored turns) + the `Message`/`Bubble`
@@ -225,6 +260,24 @@ interface ChatInputProps {
  * device-aware default modes.
  */
 declare function ChatInput({ value, onChange, onSend, pending, disabled, placeholder, size, uploadingLabel, voice, voiceSession, voiceTitle, voiceLang, submitLabel, autoFocus, className, inputRef, attachments, onFilesSelected, onRemoveAttachment, accept, multiple, addFilesLabel, appearance, compactOnBlur, header, helperText, privacyNote, }: ChatInputProps): react_jsx_runtime.JSX.Element;
+/** A next step offered in the empty state, under the composer (`emptyActions`). */
+interface ChatEmptyAction {
+    /** Stable key. */
+    id: string;
+    /** What picking it does, e.g. "Review 3 new people". */
+    label: ReactNode;
+    /** Where it applies, muted after the label, e.g. "Head of Sales · Northwind". One line, truncated. */
+    detail?: ReactNode;
+    /** Leading icon: a Lucide component or an element. */
+    icon?: LucideIcon | ReactNode;
+    /**
+     * Called when picked. While a returned promise is pending, that row shows a
+     * spinner and every row is disabled; a rejection re-enables them and is
+     * reported.
+     */
+    onSelect: () => void | Promise<void>;
+    disabled?: boolean;
+}
 interface ChatProps {
     /** Conversation messages. */
     messages: ChatMessage[];
@@ -270,6 +323,21 @@ interface ChatProps {
     examplePrompts?: ReadonlyArray<string>;
     /** Label above the example prompts. Defaults to "Try". */
     examplePromptsLabel?: string;
+    /**
+     * Next steps under the empty-state composer, before `examplePrompts`,
+     * ChatGPT-style: a quiet list of rows, each an icon, what picking it does
+     * and where it applies (`ChatEmptyAction`). Picking one calls its
+     * `onSelect`; nothing is sent here. While a returned promise is pending
+     * the row shows a spinner and every row is disabled. Hidden while
+     * `pending`, like the example prompts.
+     */
+    emptyActions?: ReadonlyArray<ChatEmptyAction>;
+    /**
+     * The actions' small heading and accessible name. Defaults to "Pick up
+     * where you left off"; `""` hides the heading and keeps that default as
+     * the list's accessible name.
+     */
+    emptyActionsLabel?: string;
     /**
      * `chips` (the default) wrap onto as many lines as they need; `row` is one
      * line that scrolls sideways, for a few short prompts where height is
@@ -425,6 +493,15 @@ interface ChatProps {
      * assistant turns, by default), such as `ChatCopyAction`. See `ChatThread`.
      */
     messageActions?: (message: ChatMessage) => ReactNode;
+    /**
+     * Places in the conversation to jump to, as a rail of ticks in the
+     * thread's gutter, each previewed on hover or focus. See `ChatThread`.
+     */
+    navigator?: readonly ChatNavigatorItem[];
+    /** The rail's landmark name. Defaults to "Conversation". */
+    navigatorLabel?: string;
+    /** The gutter the rail sits in. Defaults to `"start"`. */
+    navigatorSide?: "start" | "end";
     className?: string;
 }
 interface ChatHandle {
@@ -457,4 +534,4 @@ interface ChatHandle {
  */
 declare const Chat: React$1.ForwardRefExoticComponent<ChatProps & React$1.RefAttributes<ChatHandle>>;
 
-export { Chat, type ChatAttachment, type ChatAttachmentAction, ChatCopyAction, type ChatCopyActionProps, type ChatHandle, ChatInput, type ChatInputProps, type ChatMessage, type ChatProps, type ChatRole, ChatThread, type ChatThreadProps };
+export { Chat, type ChatAttachment, type ChatAttachmentAction, ChatCopyAction, type ChatCopyActionProps, type ChatEmptyAction, type ChatHandle, ChatInput, type ChatInputProps, type ChatMessage, type ChatMessageAuthor, ChatNavigatorItem, type ChatProps, type ChatRole, ChatThread, type ChatThreadProps, authorLines };

package/dist/primitives/chat.d.ts

@@ -1,7 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import { ReactNode } from 'react';
+import { LucideIcon } from 'lucide-react';
 import { VoiceSessionControlsProps } from './voice-session-controls.js';
+import { ChatNavigatorItem } from './chat-turn-navigator.js';
 import { MarkdownComponents } from './markdown.js';
 import './button.js';
 import 'class-variance-authority/types';
@@ -10,6 +12,17 @@ import 'react-markdown';
 import './rich-text.js';
 
 type ChatRole = "user" | "assistant";
+/** A turn's author, as the thread names them above their turns. */
+interface ChatMessageAuthor {
+    /** Stable for the person: consecutive turns with the same id are named once. */
+    id: string;
+    name: string;
+    /** Their photo; initials stand in without one. */
+    avatarUrl?: string | null;
+    /** A quiet note after the name, such as how the turn arrived ("by email"). */
+    detail?: string;
+}
+
 type ChatAttachment = {
     id: string;
     name: string;
@@ -38,6 +51,12 @@ type ChatMessage = {
     content?: ReactNode;
     /** Files that belong to this turn. */
     attachments?: ReadonlyArray<ChatAttachment>;
+    /**
+     * Who wrote the turn. The thread names them, with their avatar, above the
+     * first of a run of turns by the same author, so a conversation with
+     * several people in it says who said what. Turns without one are unnamed.
+     */
+    author?: ChatMessageAuthor;
     /**
      * `"running"`: a reply still being worked on. The thread draws the turn as
      * its running line, the one `pending` adds at the end, labelled with `text`
@@ -105,8 +124,24 @@ interface ChatThreadProps {
      * pointer reaches it; return `null` for none.
      */
     messageActions?: (message: ChatMessage) => ReactNode;
+    /**
+     * Places to jump to, drawn as a rail of ticks in the thread's gutter (see
+     * `ChatTurnNavigator`): the one in view marked, a preview of each on hover
+     * or focus. It shows only where the gutter has room; omit it for none.
+     */
+    navigator?: readonly ChatNavigatorItem[];
+    /** The rail's landmark name. */
+    navigatorLabel?: string;
+    /** The gutter the rail sits in. */
+    navigatorSide?: "start" | "end";
     className?: string;
 }
+/**
+ * Which turns name their author: the first of each run of turns by the same
+ * author on the same side. A time marker, a turn by someone else or a turn
+ * with no author between them starts a new run; a running line doesn't.
+ */
+declare function authorLines(messages: ReadonlyArray<ChatMessage>, markers: ReadonlyArray<string | null>): boolean[];
 /**
  * Scrollable message thread, built on shadcn's headless `MessageScroller`
  * (streaming-aware auto-scroll, anchored turns) + the `Message`/`Bubble`
@@ -225,6 +260,24 @@ interface ChatInputProps {
  * device-aware default modes.
  */
 declare function ChatInput({ value, onChange, onSend, pending, disabled, placeholder, size, uploadingLabel, voice, voiceSession, voiceTitle, voiceLang, submitLabel, autoFocus, className, inputRef, attachments, onFilesSelected, onRemoveAttachment, accept, multiple, addFilesLabel, appearance, compactOnBlur, header, helperText, privacyNote, }: ChatInputProps): react_jsx_runtime.JSX.Element;
+/** A next step offered in the empty state, under the composer (`emptyActions`). */
+interface ChatEmptyAction {
+    /** Stable key. */
+    id: string;
+    /** What picking it does, e.g. "Review 3 new people". */
+    label: ReactNode;
+    /** Where it applies, muted after the label, e.g. "Head of Sales · Northwind". One line, truncated. */
+    detail?: ReactNode;
+    /** Leading icon: a Lucide component or an element. */
+    icon?: LucideIcon | ReactNode;
+    /**
+     * Called when picked. While a returned promise is pending, that row shows a
+     * spinner and every row is disabled; a rejection re-enables them and is
+     * reported.
+     */
+    onSelect: () => void | Promise<void>;
+    disabled?: boolean;
+}
 interface ChatProps {
     /** Conversation messages. */
     messages: ChatMessage[];
@@ -270,6 +323,21 @@ interface ChatProps {
     examplePrompts?: ReadonlyArray<string>;
     /** Label above the example prompts. Defaults to "Try". */
     examplePromptsLabel?: string;
+    /**
+     * Next steps under the empty-state composer, before `examplePrompts`,
+     * ChatGPT-style: a quiet list of rows, each an icon, what picking it does
+     * and where it applies (`ChatEmptyAction`). Picking one calls its
+     * `onSelect`; nothing is sent here. While a returned promise is pending
+     * the row shows a spinner and every row is disabled. Hidden while
+     * `pending`, like the example prompts.
+     */
+    emptyActions?: ReadonlyArray<ChatEmptyAction>;
+    /**
+     * The actions' small heading and accessible name. Defaults to "Pick up
+     * where you left off"; `""` hides the heading and keeps that default as
+     * the list's accessible name.
+     */
+    emptyActionsLabel?: string;
     /**
      * `chips` (the default) wrap onto as many lines as they need; `row` is one
      * line that scrolls sideways, for a few short prompts where height is
@@ -425,6 +493,15 @@ interface ChatProps {
      * assistant turns, by default), such as `ChatCopyAction`. See `ChatThread`.
      */
     messageActions?: (message: ChatMessage) => ReactNode;
+    /**
+     * Places in the conversation to jump to, as a rail of ticks in the
+     * thread's gutter, each previewed on hover or focus. See `ChatThread`.
+     */
+    navigator?: readonly ChatNavigatorItem[];
+    /** The rail's landmark name. Defaults to "Conversation". */
+    navigatorLabel?: string;
+    /** The gutter the rail sits in. Defaults to `"start"`. */
+    navigatorSide?: "start" | "end";
     className?: string;
 }
 interface ChatHandle {
@@ -457,4 +534,4 @@ interface ChatHandle {
  */
 declare const Chat: React$1.ForwardRefExoticComponent<ChatProps & React$1.RefAttributes<ChatHandle>>;
 
-export { Chat, type ChatAttachment, type ChatAttachmentAction, ChatCopyAction, type ChatCopyActionProps, type ChatHandle, ChatInput, type ChatInputProps, type ChatMessage, type ChatProps, type ChatRole, ChatThread, type ChatThreadProps };
+export { Chat, type ChatAttachment, type ChatAttachmentAction, ChatCopyAction, type ChatCopyActionProps, type ChatEmptyAction, type ChatHandle, ChatInput, type ChatInputProps, type ChatMessage, type ChatMessageAuthor, ChatNavigatorItem, type ChatProps, type ChatRole, ChatThread, type ChatThreadProps, authorLines };