@workerdeck/ui 0.21.0 → 0.23.0

package/README.md

@@ -127,9 +127,10 @@ lose by forgetting a second mount isn't one.
   scoping — file an issue with your case.
 - Dark mode is driven **only** by `[data-theme='dark']` on the root element (the Tailwind
   `dark:` variant is remapped to it); `prefers-color-scheme` is not consulted at CSS level.
-- The session surface centers its content at `--wd-content-max-w` (default `48rem`).
+- The session surface centers its content at `--wd-transcript-max-width` (default `48rem`).
   Embedders in narrow docks (a VS Code bottom panel, a drawer) set it to `100%` for
-  edge-to-edge content. Every component also carries `data-slot` attributes for targeted
+  edge-to-edge content. Other geometry tokens: `--wd-status-bar-height`, `--wd-composer-padding`,
+  `--wd-transcript-row-gap`. Every component also carries `data-slot` attributes for targeted
   overrides — e.g. `[data-slot='composer-hint']` is the "Enter to send" line, which a host
   whose vertical space is precious can `display: none`.
 - `SessionPanel` can hand its dialog surfaces to the embedder: `panelSurface: 'external'`

package/build/{SessionPanel-BjNAnWMF.d.mts → SessionPanel-BobynUo4.d.mts}

@@ -2,6 +2,7 @@ import * as _$react from "react";
 import { ReactNode } from "react";
 import { LucideIcon } from "lucide-react";
 import { ModelOption, PermissionMode } from "@workerdeck/protocol";
+import * as _$_workerdeck_react0 from "@workerdeck/react";
 import { ConnectionState, TranscriptState, UseToolCallHostOptions } from "@workerdeck/react";
 import { WorkerDeckClient } from "@workerdeck/client";
 
@@ -389,10 +390,10 @@ interface SessionPanelProps {
    */
   onSubagentChange?: (toolUseId: string | undefined) => void;
   /**
-   * Terminal theme only: hold the prompt of the turn you are reading at the top
-   * of the transcript, as the Claude Code CLI does. The **real row** is pinned
-   * rather than a copy drawn above it, so it lines up with the rows beneath by
-   * construction — see `TranscriptRows`.
+   * Hold the prompt of the turn you are reading at the top of the transcript.
+   * Works in both variants: the terminal clips to one line (as the CLI does),
+   * cards shows a frosted bar. The **real row** is pinned rather than a copy
+   * drawn above it, so it lines up with the rows beneath by construction.
    */
   stickyPrompt?: boolean;
   /**
@@ -505,6 +506,68 @@ interface SessionPanelProps {
    * the client cannot see.
    */
   cacheTranscript?: boolean;
+  /**
+   * Replaces the default empty state when the transcript has no messages. Pass
+   * your product's own onboarding content instead of WorkerDeck's generic
+   * "`>_` Tell the agent what to do." placeholder.
+   */
+  emptyState?: ReactNode;
+  /**
+   * Called when a link in the transcript is clicked. The embedder decides what
+   * happens: navigate in-app, open a browser tab, show a confirmation, or
+   * suppress.
+   *
+   * Return `true` (or a truthy value) to indicate the click was handled — the
+   * default action (`window.open(href, '_blank')`) is suppressed. Return
+   * `false` / `undefined` / nothing to let the browser open the link normally.
+   *
+   * Absent means "browser default" — links open in a new tab as Streamdown's
+   * `target="_blank"` intends. VS Code's webview overrides this through its own
+   * native handler (the "allow once / add to allowlist" dialog) and does not
+   * need this prop.
+   *
+   * **Typical embedder patterns:**
+   * - Relative URLs → in-app navigation, no confirmation
+   * - External URLs → confirmation dialog, or open unconditionally
+   * - Suppress all links → `() => true`
+   */
+  onLinkClick?: (href: string) => boolean | void;
+  /**
+   * Client-side tool handlers. Each key is a tool name the model can call; the
+   * handler receives the model's input and returns a result. The tool's
+   * **schema** must be registered server-side (via `tools` on
+   * `ProviderRunnerOptions`), but the handler runs here — right where the data
+   * the tool needs lives.
+   *
+   * Shorthand for `toolHost.clientTools`; when both are set, this wins for
+   * overlapping names.
+   *
+   * ```tsx
+   * <SessionPanel
+   *   clientTools={{
+   *     app_navigate: async (input) => {
+   *       router.push((input as { path: string }).path)
+   *       return { value: 'navigated' }
+   *     },
+   *   }}
+   * />
+   * ```
+   */
+  clientTools?: Record<string, _$_workerdeck_react0.ClientToolHandler>;
+  /**
+   * Base font size in **whole pixels**. Drives the overall scale of everything
+   * the panel draws — prompt, output, markdown, status bar — in both variants.
+   *
+   * Under the terminal theme it sets `--term-font-size` and derives
+   * `--term-line` at the CLI's own 13 : 18 ratio (unless {@link terminalMetrics}
+   * overrides those individually). Under cards it sets the panel root's
+   * `font-size`, which scales every `rem`/`em`-based token the type scale uses.
+   *
+   * Absent means "platform default": 13 px for the terminal theme, the
+   * inherited body size for cards. That is the right choice for a host that has
+   * no preference — the panel reads at the size the rest of the app does.
+   */
+  fontSize?: number;
   className?: string;
 }
 /** What an embedder needs to *change* a session it doesn't own the attach for. */
@@ -555,6 +618,9 @@ type SessionVitals = {
    * as its "seen" watermark while the panel is actually on screen, and compares
    * against later to know what is new. */
   itemCount: number;
+  /** Session-cumulative cost in USD. The internal status bar renders this via
+   * `formatCost`; an external host needs it to reproduce that reading. */
+  totalCostUsd: number;
 };
 /**
  * The all-in-one embeddable session surface: status bar, streaming transcript,
@@ -591,9 +657,13 @@ declare function SessionPanel({
   unseen,
   readOnly,
   toolHost,
+  clientTools,
   cacheTranscript,
+  emptyState,
+  onLinkClick,
+  fontSize,
   className
 }: SessionPanelProps): _$react.JSX.Element;
 //#endregion
 export { permissionModeChoices as C, PermissionModeSelectProps as S, useAffordances as _, SessionVitals as a, PermissionModeMeta as b, TranscriptDensityProvider as c, TranscriptVariantProvider as d, useTranscriptDensity as f, WithActions as g, TerminalAffordances as h, SessionSurfacePanel as i, TranscriptFont as l, CopyAction as m, SessionPanel as n, TerminalMetrics as o, useTranscriptVariant as p, SessionPanelProps as r, TranscriptDensity as s, SessionControls as t, TranscriptVariant as u, PERMISSION_MODES as v, permissionModeMeta as w, PermissionModeSelect as x, PermissionModeChoice as y };
-//# sourceMappingURL=SessionPanel-BjNAnWMF.d.mts.map
+//# sourceMappingURL=SessionPanel-BobynUo4.d.mts.map