@jini-ai/chat 0.6.5 → 0.6.7

package/dist/react/features/chat-pane/styles.js

@@ -37,7 +37,7 @@ export const CHAT_PANE_STYLES = `
   overflow: clip;
   color: var(--jini-chat-text);
   background: var(--jini-chat-bg);
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei UI", "Noto Sans", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-family: var(--jini-chat-font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei UI", "Noto Sans", Roboto, "Helvetica Neue", Arial, sans-serif);
   font-size: 13.5px;
   line-height: 1.5;
   -webkit-font-smoothing: antialiased;
@@ -61,7 +61,7 @@ export const CHAT_PANE_STYLES = `
   display: block;
   margin-bottom: 4px;
   color: var(--jini-chat-muted);
-  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-family: var(--jini-chat-font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
   font-size: 10px;
   letter-spacing: .1em;
   text-transform: uppercase;
@@ -109,6 +109,39 @@ export const CHAT_PANE_STYLES = `
   padding: 20px 22px calc(var(--jini-chat-controls-height, 240px) + 24px);
   scrollbar-width: thin;
 }
+/*
+ * 'Jump to latest' (MessageList.tsx's JumpToLatest): a zero-height sticky last child, so it floats
+ * centred just above the composer overlay without taking layout space. Sticky offsets measure from
+ * the scrollport edge, not the padding, hence the controls height in 'bottom'.
+ */
+.jini-message-list__jump {
+  position: sticky;
+  bottom: calc(var(--jini-chat-controls-height, 240px) + 8px);
+  height: 0;
+  display: flex;
+  justify-content: center;
+  align-items: flex-end;
+  z-index: 2;
+  pointer-events: none;
+}
+.jini-message-list__jump-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 5px 12px;
+  border: 1px solid var(--jini-chat-border);
+  border-radius: 999px;
+  background: var(--jini-chat-panel);
+  color: var(--jini-chat-muted);
+  box-shadow: var(--jini-chat-popover-shadow);
+  font-size: 12px;
+  line-height: 1.2;
+  white-space: nowrap;
+  cursor: pointer;
+  pointer-events: auto;
+}
+.jini-message-list__jump-btn:hover { color: var(--jini-chat-text-strong); }
+.jini-message-list__jump-btn:focus-visible { outline: 2px solid var(--jini-chat-accent); outline-offset: 2px; }
 .jini-chat-pane .jini-message {
   margin-bottom: 20px;
   color: var(--jini-chat-text);
@@ -152,6 +185,9 @@ export const CHAT_PANE_STYLES = `
   padding: 10px 13px;
   width: fit-content;
   max-width: 88%;
+  /* MOVE: Answers may contain long labels or pasted URLs; wrap them within narrow chat panes. */
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
   /* User bubbles share this style at every nesting depth, regardless of message length. */
   background: var(--jini-chat-user-bubble, #1a1b1c);
   color: var(--jini-chat-user-bubble-ink, #fff);
@@ -645,8 +681,11 @@ export const CHAT_PANE_STYLES = `
 }
 /* Phones: the 25px "x" gets an invisible 44px tap area; the chip keeps its size. The area ends at the
    chip's bottom edge and grows up into the tray's 8px top padding / row gap, because growing down
-   past the last row would make the 88px tray scroll by a few pixels. */
+   past the last row would make the 88px tray scroll by a few pixels. Rows are 8px apart here, not
+   6: at a 42px row pitch the second row's area covered the bottom 2.5px of the first row's, leaving
+   the top row a 41.5px target. 8px top padding + two 36px rows + an 8px gap is exactly the 88px cap. */
 @media (max-width: 640px), (pointer: coarse) {
+  .jini-chat-pane .jini-attachment-tray { row-gap: 8px; }
   .jini-chat-pane .jini-attachment-remove { position: relative; }
   .jini-chat-pane .jini-attachment-remove::before {
     content: '';
@@ -882,7 +921,7 @@ export const CHAT_PANE_STYLES = `
 }
 .jini-chat-pane .jini-composer-workdir-confirm {
   padding: 6px 10px;
-  color: white;
+  color: var(--jini-chat-panel);
   white-space: nowrap;
   background: var(--jini-chat-text-strong);
   border: 0;
@@ -895,34 +934,52 @@ export const CHAT_PANE_STYLES = `
 .jini-runtime-spinner,
 .jini-icon-spin { animation: jini-chat-spin .8s linear infinite; }
 @keyframes jini-chat-spin { to { transform: rotate(360deg); } }
+/* The model/effort cluster sits at the trailing edge beside send (owner, 2026-10-18); the "+"
+   stays at the start. The auto margin takes the free space, and gives it back first when a narrow
+   bar needs the room for the model label. */
 .jini-chat-pane .jini-composer-footer-accessories {
   display: flex;
-  margin-left: auto;
   min-width: 0;
+  margin-left: auto;
+}
+/* Basis 0: the hint takes only the room the runtime row leaves and wraps into it, instead of
+   claiming its one-line width and squeezing the picker under its icon/effort labels. */
+.jini-chat-pane .jini-composer-send-blocker {
+  flex: 1 1 0;
+  align-self: center;
+  margin-right: 8px;
+  color: var(--jini-chat-muted);
+  font-size: 12px;
 }
+/* Always pushed to the trailing edge. This also covers a footer with no attach/accessory controls
+   before the send group (a public visitor chat), which would otherwise leave the lone send button
+   at the start under the footer's space-between. */
 .jini-chat-pane .jini-composer-send-group {
   display: flex;
   flex-shrink: 0;
   gap: 6px;
+  margin-left: auto;
 }
-/* A footer with no attach/accessory controls before the send group (a public visitor chat) would
-   leave the lone send button at the start under the footer's space-between; keep it at the end. */
-.jini-chat-pane .jini-composer-send-group:first-child { margin-left: auto; }
+/* After the cluster, the send group sits right beside it instead of splitting the free space. */
+.jini-chat-pane .jini-composer-footer-accessories ~ .jini-composer-send-group { margin-left: 0; }
+/* Inverse ink: the fill is the strong text colour, so the icon takes the panel colour rather than a
+   fixed white. A host dark theme flips text-strong to near-white, and fixed white icons then drew a
+   blank white square (owner report, 2026-10-21). Disabled uses the theme's subtle/faint pair too. */
 .jini-chat-pane .jini-composer-send {
   display: grid;
   place-items: center;
   width: 32px;
   height: 32px;
   padding: 0;
-  color: white;
+  color: var(--jini-chat-panel);
   background: var(--jini-chat-text-strong);
   border: 0;
   border-radius: 8px;
   cursor: pointer;
 }
 .jini-chat-pane .jini-composer-send:disabled {
-  color: #aaa59e;
-  background: #ece8e2;
+  color: var(--jini-chat-faint);
+  background: var(--jini-chat-subtle);
   cursor: default;
 }
 .jini-chat-pane__workdir {
@@ -1095,40 +1152,100 @@ export const CHAT_PANE_STYLES = `
   white-space: nowrap;
   opacity: .7;
 }
-.jini-runtime-picker { position: relative; }
-.jini-runtime-trigger {
-  display: inline-grid;
-  grid-template-columns: 24px 14px;
+/* Composer-bar runtime row: [agent icon] [model ⌄] [effort ⌄] -- compact, borderless, muted text.
+   The icon opens the runtime popover; model and effort each open a drop-up (RuntimeDropUp). */
+.jini-runtime-picker {
+  position: relative;
+  display: flex;
+  align-items: center;
+  min-width: 0;
+}
+.jini-runtime-trigger,
+.jini-runtime-dropup-trigger {
+  display: inline-flex;
   align-items: center;
-  gap: 7px;
+  gap: 4px;
   height: 32px;
   min-width: 0;
-  padding: 3px 7px 3px 5px;
-  color: var(--jini-chat-text);
+  padding: 3px 6px;
+  color: var(--jini-chat-muted);
   background: transparent;
   border: 0;
   border-radius: 8px;
+  font: inherit;
+  font-size: 13px;
   cursor: pointer;
 }
-.jini-runtime-trigger:hover { background: var(--jini-chat-subtle); }
-.jini-runtime-trigger__copy { display: none; }
+.jini-runtime-trigger { gap: 6px; padding: 3px 4px; }
+/* Local mode's trigger is the icon alone, so it has nothing to give way: shrunk under the shared
+   \`min-width: 0\` on a narrow bar, the 22px icon spilled over the model/effort labels beside it
+   (owner report, 2026-10-21). API mode keeps shrinking -- its model label ellipsizes. */
+.jini-runtime-trigger--icon-only { flex: none; }
+.jini-runtime-trigger:hover,
+.jini-runtime-dropup-trigger:hover,
+.jini-runtime-dropup-trigger[aria-expanded="true"] { color: var(--jini-chat-text); background: var(--jini-chat-subtle); }
+.jini-runtime-trigger:focus-visible,
+.jini-runtime-dropup-trigger:focus-visible { outline: 2px solid var(--jini-chat-accent); outline-offset: 1px; }
+/* 'contents' so the hidden name (absolutely positioned) adds no flex gap beside the icon-only
+   local trigger, and the API-mode model label is a direct, shrinkable flex item. */
+.jini-runtime-trigger__copy { display: contents; }
+/* Kept in the text (see the component), not shown: the icon already names the agent. */
 .jini-runtime-trigger__copy strong {
+  position: absolute;
+  width: 1px;
+  height: 1px;
   overflow: hidden;
-  max-width: 122px;
-  font-size: 11px;
-  font-weight: 650;
-  text-overflow: ellipsis;
+  clip: rect(0 0 0 0);
   white-space: nowrap;
 }
-.jini-runtime-trigger__copy small {
+.jini-runtime-trigger__copy small,
+.jini-runtime-dropup-trigger__label {
   overflow: hidden;
-  max-width: 122px;
-  color: var(--jini-chat-muted);
-  font-size: 9px;
+  max-width: 180px;
+  font-size: inherit;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.jini-runtime-trigger__chevron { color: var(--jini-chat-muted); font-size: 12px; }
+.jini-runtime-trigger__chevron { flex: none; }
+/* The effort label is short; the model label is the one that gives way on a narrow bar. */
+.jini-runtime-dropup-trigger--effort { flex: none; }
+.jini-runtime-dropup {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  padding: 4px;
+  color: var(--jini-chat-text);
+  background: var(--jini-chat-panel);
+  border: 1px solid var(--jini-chat-border);
+  border-radius: 10px;
+  box-shadow: var(--jini-chat-popover-shadow, 0 18px 46px rgba(13, 12, 10, .15), 0 2px 8px rgba(13, 12, 10, .06));
+  font-size: 13px;
+  line-height: 1.4;
+}
+.jini-runtime-dropup__note {
+  padding: 4px 10px 6px;
+  color: var(--jini-chat-muted);
+  font-size: 11.5px;
+}
+.jini-runtime-dropup__item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  min-height: 32px;
+  padding: 6px 10px;
+  color: inherit;
+  background: transparent;
+  border: 0;
+  border-radius: 6px;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+.jini-runtime-dropup__item:hover,
+.jini-runtime-dropup__item:focus-visible { background: var(--jini-chat-subtle); outline: none; }
+.jini-runtime-dropup__item.is-active { font-weight: 600; }
+.jini-runtime-dropup__item-label { flex: 1; min-width: 0; overflow-wrap: anywhere; }
 .jini-runtime-agent-icon.agent-icon { flex: 0 0 auto; object-fit: contain; }
 .jini-runtime-agent-icon.agent-icon-mono {
   display: inline-block;
@@ -1165,8 +1282,8 @@ export const CHAT_PANE_STYLES = `
   background: var(--jini-chat-panel);
   border: 1px solid var(--jini-chat-border);
   border-radius: 12px;
-  box-shadow: 0 18px 46px rgba(13, 12, 10, .15), 0 2px 8px rgba(13, 12, 10, .06);
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei UI", "Noto Sans", Roboto, "Helvetica Neue", Arial, sans-serif;
+  box-shadow: var(--jini-chat-popover-shadow, 0 18px 46px rgba(13, 12, 10, .15), 0 2px 8px rgba(13, 12, 10, .06));
+  font-family: var(--jini-chat-font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei UI", "Noto Sans", Roboto, "Helvetica Neue", Arial, sans-serif);
   font-size: 13.5px;
   line-height: 1.5;
   -webkit-font-smoothing: antialiased;
@@ -1359,7 +1476,7 @@ export const CHAT_PANE_STYLES = `
 .jini-chat-pane .op-path,
 .jini-chat-pane .op-command,
 .jini-chat-pane .op-output {
-  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-family: var(--jini-chat-font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
   font-size: 12px;
   background: var(--jini-chat-panel);
   border: 1px solid var(--jini-chat-border);
@@ -1444,7 +1561,7 @@ export const CHAT_PANE_STYLES = `
   background: var(--jini-chat-subtle);
   border: 1px solid var(--jini-chat-border);
   border-radius: 8px;
-  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-family: var(--jini-chat-font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
   font-size: 12.5px;
   line-height: 1.5;
 }
@@ -1460,7 +1577,7 @@ export const CHAT_PANE_STYLES = `
   background: var(--jini-chat-subtle);
   border: 1px solid var(--jini-chat-border);
   border-radius: 4px;
-  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-family: var(--jini-chat-font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
   font-size: .9em;
 }
 /*
@@ -1593,7 +1710,7 @@ export const CHAT_PANE_STYLES = `
   background: var(--jini-chat-panel);
   border: 1px solid var(--jini-chat-border);
   border-radius: 12px;
-  box-shadow: 0 18px 46px rgba(13, 12, 10, .15), 0 2px 8px rgba(13, 12, 10, .06);
+  box-shadow: var(--jini-chat-popover-shadow, 0 18px 46px rgba(13, 12, 10, .15), 0 2px 8px rgba(13, 12, 10, .06));
 }
 .jini-md-table-modal::backdrop {
   background: rgba(0, 0, 0, .4);
@@ -1638,7 +1755,7 @@ export const CHAT_PANE_STYLES = `
   background: var(--jini-chat-panel);
   border: 1px solid var(--jini-chat-border);
   border-radius: 12px;
-  box-shadow: 0 18px 46px rgba(13, 12, 10, .15), 0 2px 8px rgba(13, 12, 10, .06);
+  box-shadow: var(--jini-chat-popover-shadow, 0 18px 46px rgba(13, 12, 10, .15), 0 2px 8px rgba(13, 12, 10, .06));
 }
 .jini-attachment-preview-dialog::backdrop {
   background: rgba(0, 0, 0, .4);
@@ -1694,6 +1811,8 @@ export const CHAT_PANE_STYLES = `
   margin: auto;
 }
 .jini-attachment-preview-text {
+  /* Preserve this preview's wider fallback stack when the host does not supply a chat font. */
+  --jini-chat-font-mono: var(--jini-theme-chat-font-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
   width: 100%;
   max-height: calc(80vh - 90px);
   margin: 0;
@@ -1703,7 +1822,7 @@ export const CHAT_PANE_STYLES = `
   background: var(--jini-chat-subtle);
   border: 1px solid var(--jini-chat-border-soft);
   border-radius: 8px;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  font-family: var(--jini-chat-font-mono);
   font-size: 12px;
   line-height: 1.5;
   white-space: pre-wrap;

package/dist/react/features/chat-pane/types.d.ts

@@ -66,6 +66,10 @@ export interface ChatPaneAgentSelection {
 /** Host I/O effects used by the package-owned runtime inventory controller. */
 export interface ChatPaneRuntimeAccess {
     listAgents: () => Promise<readonly ChatPaneAgent[]>;
+    /** Earliest time a cached inventory read can refresh (epoch ms); read after listAgents settles.
+     * Pending retries honor this deadline so a remounted pane does not spend its retry budget on
+     * cached answers. Omit for hosts without a cooldown. Example: () => cachedInventory.expiresAt. */
+    getAgentsRefreshAt?: () => number | undefined;
     rescanAgents: () => Promise<readonly ChatPaneAgent[]>;
     daemonOnline: () => Promise<boolean>;
 }
@@ -177,10 +181,11 @@ export type DeliverTypedAnswer = ((input: {
  * any more (it is ending); `'failed'` — the host could not tell (network error, unexpected status).
  */
 export type MidRunMessageDelivery = 'delivered' | 'unsupported' | 'not-running' | 'failed';
-/** Delivers text typed while a run streams to that run's live agent. `createMidRunMessagePoster` builds one. */
+/** Delivers a complete turn to the live agent; unsupported attachments must reject the whole turn. */
 export type DeliverMidRunMessage = (input: {
     runId: string;
     text: string;
+    attachments?: readonly ChatAttachment[];
 }) => Promise<MidRunMessageDelivery>;
 export interface ChatPaneProps extends UserTextRedactionOptions {
     transport: ChatTransport;
@@ -217,6 +222,8 @@ export interface ChatPaneProps extends UserTextRedactionOptions {
     composerHistoryScope?: string;
     /** Optional storage effects; omitted uses bounded browser storage with memory fallback. */
     composerHistoryStorage?: ComposerHistoryStoragePort;
+    /** Recall retention; defaults to 100. */
+    composerHistoryCap?: number;
     /**
      * Confirms which previously staged attachments still exist, so a draft restored after a reload
      * never shows a chip for a file the backend has since garbage-collected — that looks intact and
@@ -241,19 +248,19 @@ export interface ChatPaneProps extends UserTextRedactionOptions {
      * Called instead of queueing when the human types while the running agent is holding a question
      * open in the transcript (an interactive surface whose call to `deliverTypedAnswer.toolName` has
      * not returned — `isAwaitingTypedAnswer`) and the turn carries no attachments. `'delivered'` clears the draft
-     * (only if unchanged since it went out); any other outcome, or a throw, leaves the draft in place with a
-     * notice and NEVER queues it — a queued answer would go out after the run ends as a new, paid run
-     * answering nothing. A draft typed while the question waited stays held after it closes, until the
-     * human clears it or picks "Send as a new message" (`useChatPane`'s `sendAsNewMessage`).
+     * (only if unchanged since it went out). A definitive `'not-pending'` refusal falls back once to
+     * the ordinary message queue without a notice; a failure or throw retains the draft with a notice.
+     * Terminal runs and answered or superseded cards do not accept typed answers.
      *
      * Omit it and typing while a run streams queues exactly as before.
      */
     deliverTypedAnswer?: DeliverTypedAnswer;
     /**
-     * Called instead of queueing when the human sends text (no attachments) while a run streams, so
+     * Called instead of queueing when the human sends a message while a run streams, so
      * the message reaches the running agent now rather than after it finishes. The draft clears at
-     * once. `'delivered'` leaves the run going; `'unsupported'` stops the run and sends the text as
-     * the next turn (a resuming agent keeps its session); `'not-running'`, `'failed'` or a throw
+     * once. `'delivered'` leaves the run going; `'unsupported'` queues attachment turns until the
+     * reply finishes, or stops the run for a text-only turn (a resuming agent keeps its session).
+     * `'not-running'`, `'failed'` or a throw
      * queue it behind the ending run. Never silently dropped. A held-open question still goes to
      * {@link deliverTypedAnswer} first.
      *
@@ -311,6 +318,8 @@ export interface ChatPaneProps extends UserTextRedactionOptions {
     toolCallDisplay?: ToolCallDisplay;
     showUsageLine?: boolean;
     showThinking?: boolean;
+    /** Hide prior automatic-usage chips immediately when the host selects Off. Loading policy stays server-owned. */
+    agentPluginsMode?: 'auto' | 'ask' | 'off';
     uploadAttachments?: (files: File[], options?: ChatPaneAttachmentUploadOptions) => Promise<ChatAttachment[]>;
     attachmentAccept?: string;
     disabled?: boolean;

package/dist/react/hooks/assistant-chats.js

@@ -143,13 +143,20 @@ export function createAssistantChatsClient({ ports }, _options = {}) {
      * {@link attemptSave}.
      *
      * Never rejects, so a caller can treat the result as data rather than wrapping every call.
+     *
+     * A `do…while` on the attempt's own verdict rather than `for (;;)` with an inner `return`: the
+     * unconditional loop had an exit path no input could ever reach (it only ever left by `return`),
+     * while this loop exits exactly when an attempt is done. Termination is unchanged — every
+     * attempt past the end of the delay ladder is done.
      */
     async function saveWithRetry(port, conversationId, message, isDisposed) {
-        for (let attempt = 0;; attempt += 1) {
-            const result = await attemptSave(port, conversationId, message, attempt, isDisposed);
-            if (result.done)
-                return result.outcome;
-        }
+        let attempt = 0;
+        let result;
+        do {
+            result = await attemptSave(port, conversationId, message, attempt, isDisposed);
+            attempt += 1;
+        } while (!result.done);
+        return result.outcome;
     }
     /**
      * Decides what a settled batch of message-save outcomes means for `flush`'s bookkeeping: which