@kortix/ui 0.14.3 → 0.14.5

package/dist/session/tool/shared/surface.js

@@ -0,0 +1,84 @@
+'use client';
+import { createContext, useContext } from 'react';
+export const ToolSurfaceContext = createContext('inline');
+/**
+ * The left offset a card under a tool row needs to line up with the row's TEXT,
+ * not its icon.
+ *
+ * {@link ToolHeaderRow} renders a `size-4` icon and `TOOL_ROW_CLASS` sets
+ * `gap-1.5`, so the text column starts 22px in. (`bash` used to hardcode `ml-7`
+ * against a `gap-3` that this row class does not have, which put its block 6px
+ * past the text above it.)
+ *
+ * 22px is the DEFAULT, not the law, because the gap it derives from can be
+ * overridden by the surface. A tool row inside a chain of thought is forced to
+ * `gap-3` so its label lines up with the thought and file rows above it
+ * (`turn/activity-step.tsx`), which moves the text column to 28px and left the
+ * card 6px short — the same 6px error the note above records, mirrored. A
+ * hardcoded value cannot follow a gap it cannot see, so the surface sets
+ * `--tool-indent` alongside the gap it overrides and the two can no longer
+ * drift apart. Every other surface leaves the variable unset and gets 22px.
+ *
+ * It lives beside the surface context, not in `infrastructure.tsx`, for exactly
+ * the reason written above the context: `result-card.tsx` needs the indent and
+ * `infrastructure.tsx` renders `result-card.tsx`, so importing it from there
+ * would close the cycle this module exists to avoid.
+ */
+export const TOOL_INDENT = 'ml-[var(--tool-indent,1.375rem)]';
+/**
+ * The indent, or nothing, depending on which surface the tool is drawn on.
+ *
+ * An inline row leads with a `size-4` icon and a `gap-1.5`, so its text column
+ * starts 22px in and a card below it has to match. A panel row's body has no
+ * icon gutter and supplies its own `px-3 py-3`, so the same indent only pushes
+ * the card 22px off the trigger it sits under.
+ *
+ * Every bordered card reads the indent from HERE. Two of them used to hardcode
+ * `ml-7` (28px) against this 22px, so the same expanded row could show a card
+ * at two different left edges depending on which branch drew it.
+ */
+export function useToolIndent() {
+    return useContext(ToolSurfaceContext) === 'inline' ? TOOL_INDENT : '';
+}
+/** The hairline card every payload draws around itself on the INLINE surface.
+ *  Module-private: {@link useToolCardFrame} is the only sanctioned reader, so a
+ *  card cannot take the frame without also taking the surface gate. */
+const TOOL_CARD_FRAME = 'border-border bg-popover rounded-md border';
+/** The inset a payload card puts between its frame and its content.
+ *  Module-private for the same reason as {@link TOOL_CARD_FRAME} — read it
+ *  through {@link useToolCardPad}. */
+const TOOL_CARD_PAD = 'p-3';
+/**
+ * The frame a payload card draws — or nothing, on the panel, where the row
+ * card IS the frame.
+ *
+ * An opened panel row used to draw three frames around one payload: the row
+ * card's `bg-popover rounded-md border`, the disclosure body's `border-t px-3
+ * py-3`, and then the payload's own `bg-popover rounded-md border`. Three
+ * edges and two insets to say one thing. Inline the payload needs its own
+ * frame — it hangs under a trigger row on the page background with nothing
+ * else to bound it — but on the panel it is the only thing inside a card that
+ * already bounds it, so the frame is redundant and the second inset is the
+ * "inset twice for no added meaning" the gate filed.
+ *
+ * A tint is NOT a frame: {@link ToolResultCard} keeps its destructive border
+ * and wash on both surfaces, because that edge carries the failure and the row
+ * card cannot.
+ */
+export function useToolCardFrame() {
+    return useContext(ToolSurfaceContext) === 'inline' ? TOOL_CARD_FRAME : '';
+}
+/**
+ * The card's own content inset — or nothing, on the panel.
+ *
+ * The other half of {@link useToolCardFrame}: dropping the frame alone would
+ * leave the payload inset twice (the body's `px-3 py-3` plus the card's own
+ * `p-3`, 24px of gutter around a 420px pane). The row body's inset is the one
+ * that survives, so the panel reads as one frame with one 12px gutter.
+ *
+ * Callers keep their `pr-11` copy-button reserve AFTER this class so the
+ * right-hand reserve survives the merge on both surfaces.
+ */
+export function useToolCardPad() {
+    return useContext(ToolSurfaceContext) === 'inline' ? TOOL_CARD_PAD : '';
+}

package/dist/session/tool/shared/todo-helpers.d.ts

@@ -0,0 +1,24 @@
+export interface TodoItem {
+    content: string;
+    status: 'completed' | 'in_progress' | 'pending' | 'cancelled';
+    priority?: string;
+}
+export declare function parseTodos(value: unknown): TodoItem[];
+/**
+ * `className` overrides the per-status tint AND the size — every state is one
+ * `<svg>` with no intrinsic `width`/`height`, so `size-[18px]` scales the whole
+ * family (this is how `plan-card.tsx` grows the rail).
+ *
+ * It exists for ONE other reason worth knowing about: `Loading` carries
+ * `in-[button]:text-background`, so an `in_progress` glyph rendered inside a
+ * `<button>` — a disclosure trigger, a summary row — silently repaints itself in
+ * the page background and disappears. `cn()` cannot save you there: twMerge only
+ * dedupes within a variant group, and `in-[button]:text-background` is prefixed,
+ * so it never collides with the tint passed here. Callers inside a button must
+ * pass an `!` important colour (or set `bg-transparent` on the button, which is
+ * `Loading`'s own escape hatch).
+ */
+export declare function TodoStatusIcon({ status, className, }: {
+    status: TodoItem['status'];
+    className?: string;
+}): import("react").JSX.Element;

package/dist/session/tool/shared/todo-helpers.js

@@ -0,0 +1,95 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId } from 'react';
+import Loading from '../../../primitives/loading.js';
+import { STATUS_RING, STATUS_RING_OUTER_RADIUS } from '../../../primitives/status-ring.js';
+import { cn } from '../../../lib/utils.js';
+export function parseTodos(value) {
+    if (!Array.isArray(value))
+        return [];
+    return value.flatMap((raw) => {
+        if (!raw || typeof raw !== 'object')
+            return [];
+        const content = raw.content ?? raw.step;
+        if (typeof content !== 'string' || !content.trim())
+            return [];
+        const s = raw.status;
+        const status = s === 'completed' || s === 'in_progress' || s === 'cancelled' ? s : 'pending';
+        return [{ content, status, priority: raw.priority }];
+    });
+}
+// ============================================================================
+// One geometry, four states
+// ============================================================================
+//
+// Every glyph below is drawn on `STATUS_RING` — see that module for why, and
+// for the four different circles this replaced.
+/** Marks drawn INSIDE a filled disc (the check, the cancel bar). Slightly
+ *  heavier than the ring stroke: a knockout on a solid field loses apparent
+ *  weight to the surrounding ink, so 1.5 here would read thinner than the 1.5
+ *  of the pending ring beside it. */
+const MARK_STROKE = 1.75;
+/**
+ * The check, in glyph units. Spans x 4.4 → 11.6 — 7.2 units, 51% of the
+ * 14.1-unit disc, stroked at 1.75.
+ *
+ * Phosphor's `CheckCircle` fill (the glyph this replaces) draws its mark across
+ * ~80 of its 256-unit box at a ~16-unit stroke. Rendered at `size-4` that is a
+ * 5.0px mark at 1.0px; this one is 7.2px at 1.75px — 44% wider and 75% heavier,
+ * inside a disc that is itself 13.0px → 14.1px. That is the whole "the check
+ * icon looks small" complaint, measured.
+ */
+const CHECK_PATH = 'M4.4 8.3 L6.9 10.8 L11.6 5.2';
+/**
+ * Optical seat for the check. Its two strokes converge at the bottom vertex, so
+ * the ink centroid sits ~0.5 units BELOW the bounding box centre and the mark
+ * reads low inside a perfectly centred disc. Half the error is the usual
+ * correction; the other half keeps the tail from crowding the rim.
+ */
+const CHECK_OPTICAL_LIFT = 'translate(0 -0.25)';
+/** The cancel bar. Same 45° as Phosphor's Prohibit, sized to the same span as
+ *  the check so the two terminal states carry equal visual weight. */
+const CANCEL_PATH = 'M5.1 10.9 L10.9 5.1';
+/** A filled disc with `path` punched out of it. A knockout, not a coloured
+ *  stroke: the mark then shows whatever is actually behind the glyph — the row
+ *  hover tint, a selected row, a themed surface — instead of hard-coding
+ *  `--background` and going wrong the moment the surface is not that. */
+function KnockoutDisc({ path, transform, className, maskId, }) {
+    return (_jsxs("svg", { viewBox: `0 0 ${STATUS_RING.BOX} ${STATUS_RING.BOX}`, fill: "none", "aria-hidden": true, className: className, children: [_jsxs("mask", { id: maskId, maskUnits: "userSpaceOnUse", x: "0", y: "0", width: STATUS_RING.BOX, height: STATUS_RING.BOX, children: [_jsx("circle", { cx: STATUS_RING.CENTER, cy: STATUS_RING.CENTER, r: STATUS_RING_OUTER_RADIUS, fill: "#fff" }), _jsx("path", { d: path, transform: transform, stroke: "#000", strokeWidth: MARK_STROKE, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" })] }), _jsx("circle", { cx: STATUS_RING.CENTER, cy: STATUS_RING.CENTER, r: STATUS_RING_OUTER_RADIUS, fill: "currentColor", mask: `url(#${maskId})` })] }));
+}
+/**
+ * `className` overrides the per-status tint AND the size — every state is one
+ * `<svg>` with no intrinsic `width`/`height`, so `size-[18px]` scales the whole
+ * family (this is how `plan-card.tsx` grows the rail).
+ *
+ * It exists for ONE other reason worth knowing about: `Loading` carries
+ * `in-[button]:text-background`, so an `in_progress` glyph rendered inside a
+ * `<button>` — a disclosure trigger, a summary row — silently repaints itself in
+ * the page background and disappears. `cn()` cannot save you there: twMerge only
+ * dedupes within a variant group, and `in-[button]:text-background` is prefixed,
+ * so it never collides with the tint passed here. Callers inside a button must
+ * pass an `!` important colour (or set `bg-transparent` on the button, which is
+ * `Loading`'s own escape hatch).
+ */
+export function TodoStatusIcon({ status, className, }) {
+    // Unconditional: hooks cannot live inside the switch below. `useId` emits
+    // colons, legal in an HTML id but hostile inside a `url(#…)` reference.
+    const maskId = `todo-glyph-${useId().replace(/:/g, '')}`;
+    const size = 'size-4 shrink-0';
+    switch (status) {
+        case 'completed':
+            return (_jsx(KnockoutDisc, { maskId: maskId, path: CHECK_PATH, transform: CHECK_OPTICAL_LIFT, className: cn('text-kortix-green', size, className) }));
+        case 'in_progress':
+            // The `ring` variant is this exact geometry, arc-animated — so the running
+            // state is the pending ring in motion, not a second, fatter circle.
+            return _jsx(Loading, { variant: "ring", className: cn('text-kortix-orange', size, className) });
+        case 'cancelled':
+            return (_jsx(KnockoutDisc, { maskId: maskId, path: CANCEL_PATH, className: cn('text-muted-foreground/40', size, className) }));
+        case 'pending':
+            return (_jsx("svg", { viewBox: `0 0 ${STATUS_RING.BOX} ${STATUS_RING.BOX}`, fill: "none", strokeLinejoin: "round", "aria-hidden": true, className: cn('text-muted-foreground', size, className), children: _jsx("circle", { cx: STATUS_RING.CENTER, cy: STATUS_RING.CENTER, r: STATUS_RING.RADIUS, stroke: "currentColor", fill: "none", strokeWidth: STATUS_RING.STROKE, strokeDasharray: `${STATUS_RING.DASH} ${STATUS_RING.GAP}` }) }));
+        default: {
+            const _exhaustive = status;
+            return _exhaustive;
+        }
+    }
+}

package/dist/session/tool/shared/tool-action-bar.d.ts

@@ -0,0 +1,21 @@
+import { type Icon } from '@phosphor-icons/react';
+import type { ReactNode } from 'react';
+export declare function ToolActionBar({ compact, loading, refreshLabel, menuLabel, onRefresh, secondaryLabel, secondaryIcon: SecondaryIcon, onSecondary, secondaryDisabled, secondaryDisabledClassName, secondaryIconClassName, refreshButtonClassName, secondaryButtonClassName, primary, }: {
+    compact: boolean;
+    loading: boolean;
+    refreshLabel: string;
+    menuLabel: string;
+    onRefresh: () => void;
+    secondaryLabel: string;
+    secondaryIcon: Icon;
+    onSecondary: () => void;
+    secondaryDisabled?: boolean;
+    secondaryDisabledClassName?: string;
+    /** The secondary icon's size class. Sized per caller; never derived from
+     *  a styling className prop, which callers pass only when they have styles
+     *  to add. */
+    secondaryIconClassName?: string;
+    refreshButtonClassName?: string;
+    secondaryButtonClassName?: string;
+    primary: ReactNode;
+}): import("react").JSX.Element;

package/dist/session/tool/shared/tool-action-bar.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../../primitives/button.js';
+import { ButtonGroup } from '../../../primitives/button-group.js';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from '../../../primitives/dropdown-menu.js';
+import Hint from '../../../primitives/hint.js';
+import { cn } from '../../../lib/utils.js';
+import { ArrowClockwiseIcon, DotsThreeIcon } from '@phosphor-icons/react';
+export function ToolActionBar({ compact, loading, refreshLabel, menuLabel, onRefresh, secondaryLabel, secondaryIcon: SecondaryIcon, onSecondary, secondaryDisabled, secondaryDisabledClassName, secondaryIconClassName, refreshButtonClassName, secondaryButtonClassName, primary, }) {
+    return (_jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [compact ? (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon-sm", type: "button", "aria-label": menuLabel, className: "active:scale-[0.96]", children: _jsx(DotsThreeIcon, { className: "size-4" }) }) }), _jsxs(DropdownMenuContent, { align: "end", className: "min-w-40", children: [_jsxs(DropdownMenuItem, { onSelect: onRefresh, children: [_jsx(ArrowClockwiseIcon, { className: cn(loading && 'animate-spinner-spin') }), refreshLabel] }), _jsxs(DropdownMenuItem, { disabled: secondaryDisabled, onSelect: onSecondary, children: [_jsx(SecondaryIcon, {}), secondaryLabel] })] })] })) : (
+            // Refresh and the secondary action are one secondary group; `primary`
+            // is a real primary, so it stands outside it.
+            _jsxs(ButtonGroup, { children: [_jsx(Hint, { label: refreshLabel, side: "top", children: _jsx(Button, { variant: "secondary", size: "icon-sm", type: "button", onClick: onRefresh, "aria-label": refreshLabel, className: refreshButtonClassName, children: _jsx(ArrowClockwiseIcon, { className: cn('size-4', loading && 'animate-spinner-spin') }) }) }), _jsx(Hint, { label: secondaryLabel, side: "top", children: _jsx(Button, { variant: "secondary", size: "icon-sm", type: "button", onClick: onSecondary, disabled: secondaryDisabled, "aria-label": secondaryLabel, className: cn(secondaryButtonClassName, secondaryDisabled && secondaryDisabledClassName), children: _jsx(SecondaryIcon, { className: secondaryIconClassName }) }) })] })), primary] }));
+}

package/dist/session/tool/shared/types.d.ts

@@ -0,0 +1,42 @@
+import type { ToolCallBlock } from '@kortix/sdk';
+import type { ComponentType } from 'react';
+export interface ToolProps {
+    /** The call to draw: a session-log tool call block (`ToolPartRenderer` converts a v1 part with `toolCallBlock`). */
+    call: ToolCallBlock;
+    sessionId?: string;
+    defaultOpen?: boolean;
+    forceOpen?: boolean;
+    locked?: boolean;
+    hasActiveQuestion?: boolean;
+    onPermissionReply?: (requestId: string, reply: 'once' | 'always' | 'reject') => void;
+}
+export type ToolComponent = ComponentType<ToolProps>;
+export interface BasicToolProps {
+    icon?: React.ReactNode;
+    trigger: import('../../../internal/session-types/index.js').TriggerTitle | React.ReactNode;
+    children?: React.ReactNode;
+    defaultOpen?: boolean;
+    forceOpen?: boolean;
+    locked?: boolean;
+    onSubtitleClick?: () => void;
+    badge?: React.ReactNode;
+    onClick?: () => void;
+    durationMs?: number;
+    className?: string;
+    /**
+     * One interactive control pinned to the far right of the trigger row, on both
+     * the inline and panel surfaces.
+     *
+     * Strictly for an ACTION — a node that carries its own click handler and does
+     * something the row itself cannot. A slot that only displays something is
+     * `badge`; a slot that displays something and does nothing is chrome, and a
+     * trigger row has no room for chrome.
+     *
+     * The node lives inside the disclosure's own clickable element, so it must
+     * `stopPropagation` or activating it also toggles the row, and it must be a
+     * `span role="button"` rather than a real `<button>` — nesting one button
+     * inside another is invalid HTML. `onSubtitleClick` already works this way.
+     */
+    triggerAction?: React.ReactNode;
+}
+export type { ParsedJsonFailure } from '@kortix/sdk';

package/dist/session/tool/shared/types.js

@@ -0,0 +1 @@
+export {};

package/dist/session/tool/shared/web-source-row.d.ts

@@ -0,0 +1,4 @@
+export declare function WebSourceRow({ url, title }: {
+    url: string;
+    title: string;
+}): import("react").JSX.Element;

package/dist/session/tool/shared/web-source-row.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { FaviconAvatar } from '../../../primitives/favicon-avatar.js';
+import { wsDomain } from '@kortix/sdk';
+import { safeHttpUrl } from '../../../_vendor/kortix-shared.js';
+import { cn } from '../../../lib/utils.js';
+/**
+ * One web source, flat: favicon → title → domain. The single row shape every
+ * source list shares, so a source looks the same wherever it appears.
+ * Unsafe/relative URLs render as a plain row instead of a link — never an href
+ * we can't vouch for.
+ *
+ * Radius is 4px, not a token: the row sits inside a `rounded-md` (8px) card
+ * with `p-1` (4px), and concentric radius wants inner = outer − padding.
+ * `rounded-sm` is 6px here, which would bulge against the card's corner.
+ */
+const ROW_CLASS = 'flex items-center gap-2.5 rounded-sm px-2 py-2';
+export function WebSourceRow({ url, title }) {
+    const safe = safeHttpUrl(url);
+    const domain = safe ? wsDomain(safe) : '';
+    const inner = (_jsxs(_Fragment, { children: [_jsx(FaviconAvatar, { value: safe ?? title, size: "xs", className: "shrink-0" }), _jsx("span", { className: "text-foreground min-w-0 flex-1 truncate text-sm", children: title }), domain && (_jsx("span", { className: "text-muted-foreground max-w-[40%] shrink-0 truncate text-sm", children: domain }))] }));
+    if (!safe) {
+        return (_jsx("div", { "data-component": "web-source-row", className: ROW_CLASS, children: inner }));
+    }
+    return (_jsx("a", { href: safe, target: "_blank", rel: "noopener noreferrer", "data-component": "web-source-row", className: cn(ROW_CLASS, 'hover:bg-muted transition-colors duration-150'), children: inner }));
+}

package/dist/session/tool/show-group-renderer.d.ts

@@ -0,0 +1,19 @@
+import { type ToolCallBlock } from '@kortix/sdk';
+/**
+ * A run of consecutive `show` calls as ONE card: `sessionLogShowGroupCall`
+ * merges them into one call whose input is an `items` carousel, rendered
+ * through the ordinary `ToolPartRenderer` → `ShowTool` path. N single calls and
+ * one N-item call render the same card.
+ *
+ * The merged call keeps the FIRST call's `id` and `call_id`. The segment that
+ * was a lone `show` a moment ago renders under the same key, so the card is
+ * not re-mounted when the next call joins it, and "Open" still targets a real
+ * call.
+ */
+declare function ShowGroupRendererImpl({ calls, sessionId, disableNavigation, }: {
+    calls: ToolCallBlock[];
+    sessionId?: string;
+    disableNavigation?: boolean;
+}): import("react").JSX.Element;
+export declare const ShowGroupRenderer: import("react").MemoExoticComponent<typeof ShowGroupRendererImpl>;
+export {};

package/dist/session/tool/show-group-renderer.js

@@ -0,0 +1,22 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ToolPartRenderer } from './tool-part-renderer.js';
+import { sessionLogShowGroupCall } from '@kortix/sdk';
+import { memo, useMemo } from 'react';
+/**
+ * A run of consecutive `show` calls as ONE card: `sessionLogShowGroupCall`
+ * merges them into one call whose input is an `items` carousel, rendered
+ * through the ordinary `ToolPartRenderer` → `ShowTool` path. N single calls and
+ * one N-item call render the same card.
+ *
+ * The merged call keeps the FIRST call's `id` and `call_id`. The segment that
+ * was a lone `show` a moment ago renders under the same key, so the card is
+ * not re-mounted when the next call joins it, and "Open" still targets a real
+ * call.
+ */
+function ShowGroupRendererImpl({ calls, sessionId, disableNavigation, }) {
+    const merged = useMemo(() => sessionLogShowGroupCall(calls), [calls]);
+    return _jsx(ToolPartRenderer, { call: merged, sessionId: sessionId, disableNavigation: disableNavigation });
+}
+export const ShowGroupRenderer = memo(ShowGroupRendererImpl);
+ShowGroupRenderer.displayName = 'ShowGroupRenderer';

package/dist/session/tool/tool-error.d.ts

@@ -0,0 +1,4 @@
+export declare function ToolError({ error, toolName }: {
+    error: string;
+    toolName?: string;
+}): import("react").JSX.Element;

package/dist/session/tool/tool-error.js

@@ -0,0 +1,30 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Badge } from '../../primitives/badge.js';
+import { parseErrorContent } from './shared/error-and-connector.js';
+import { ToolResultCard } from './shared/result-card.js';
+import { StructuredOutput } from './shared/structured-output.js';
+import { cn } from '../../lib/utils.js';
+import { hasStructuredContent, normalizeToolOutput, parseStructuredOutput, } from '../../internal/lib/utils/structured-output.js';
+import { ProhibitIcon as Ban, CaretRightIcon as ChevronRight, WarningCircleIcon as CircleAlert, } from '@phosphor-icons/react';
+import { useTranslations } from '../../i18n/index.js';
+import { useMemo, useState } from 'react';
+export function ToolError({ error, toolName }) {
+    const tHardcodedUi = useTranslations('hardcodedUi');
+    const [showTrace, setShowTrace] = useState(false);
+    const structuredSections = useMemo(() => {
+        const normalized = normalizeToolOutput(error);
+        if (!hasStructuredContent(normalized))
+            return null;
+        return parseStructuredOutput(normalized);
+    }, [error]);
+    const { summary, traceback, errorType, validationIssues } = useMemo(() => parseErrorContent(normalizeToolOutput(error)), [error]);
+    const displayType = errorType || 'Error';
+    if (structuredSections) {
+        return (_jsx(ToolResultCard, { children: _jsx("div", { className: "px-1 py-0.5 text-xs", children: _jsx(StructuredOutput, { sections: structuredSections }) }) }));
+    }
+    if (validationIssues && validationIssues.length > 0) {
+        return (_jsxs(ToolResultCard, { children: [_jsxs("div", { className: "flex items-center gap-2 px-2 pt-1.5 pb-1 text-xs", children: [_jsx(Ban, { className: "text-muted-foreground/70 size-3.5 shrink-0" }), _jsx("span", { className: "text-muted-foreground font-medium", children: displayType }), toolName && (_jsx("span", { className: "text-muted-foreground/50 ml-auto font-mono", children: toolName }))] }), _jsx("div", { className: "space-y-2.5 px-2 pt-1 pb-2", children: validationIssues.map((issue) => (_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-start gap-2", children: [_jsx(CircleAlert, { className: "text-muted-foreground/60 mt-0.5 size-3.5 shrink-0" }), _jsxs("div", { className: "min-w-0 flex-1", children: [issue.path.length > 0 && (_jsx(Badge, { variant: "muted", size: "xs", className: "mr-1.5 font-mono", children: issue.path.join('.') })), _jsx("span", { className: "text-foreground/80 text-xs", children: issue.message })] })] }), issue.values && issue.values.length > 0 && (_jsxs("div", { className: "ml-5.5", children: [_jsx("div", { className: "text-muted-foreground/50 mb-1 text-xs", children: tHardcodedUi.raw('componentsSessionToolRenderers.line7845JsxTextExpectedOneOf') }), _jsx("div", { className: "flex flex-wrap gap-1", children: issue.values.map((val, vi) => (_jsx(Badge, { variant: "muted", size: "xs", className: "font-mono", children: val }, vi))) })] }))] }, `${issue.path.join('.')}:${issue.message}`))) })] }));
+    }
+    return (_jsxs(ToolResultCard, { children: [_jsx("p", { className: "text-muted-foreground/80 px-2 py-1.5 font-mono text-xs leading-relaxed wrap-break-word whitespace-pre-wrap", children: summary }), traceback && (_jsxs(_Fragment, { children: [_jsxs("button", { type: "button", onClick: () => setShowTrace((v) => !v), className: "text-muted-foreground/60 hover:text-foreground hover:bg-muted flex w-full cursor-pointer items-center gap-1.5 rounded-sm px-2 py-1.5 text-left transition-colors duration-150", children: [_jsx(ChevronRight, { className: cn('size-3.5 transition-transform', showTrace && 'rotate-90') }), _jsx("span", { className: "text-xs font-medium", children: tHardcodedUi.raw('componentsSessionToolRenderers.line7883JsxTextStackTrace') })] }), showTrace && (_jsx("pre", { className: "text-muted-foreground/50 px-2 pb-1.5 font-mono text-xs leading-relaxed break-all whitespace-pre-wrap", children: traceback }))] }))] }));
+}

package/dist/session/tool/tool-meta.d.ts

@@ -0,0 +1,15 @@
+import { contextToolTrigger as sdkContextToolTrigger } from '@kortix/sdk';
+import type { UiTranslator } from '../../i18n/index.js';
+/**
+ * Moved to `@kortix/sdk` (`packages/sdk/src/core/turns/tools/tool-meta.ts`)
+ * so web and mobile render the transcript from one implementation. This file
+ * keeps the old import path working for existing web call sites.
+ */
+export { CONTEXT_TOOLS, contextToolSummary, getToolPrimaryArg, isContextTool, normalizeName, } from '@kortix/sdk';
+/**
+ * The SDK's `contextToolTrigger` with this app's translated labels.
+ */
+export declare function contextToolTrigger(part: Parameters<typeof sdkContextToolTrigger>[0], tI18nComplete: UiTranslator): {
+    title: string;
+    subtitle: string;
+};

package/dist/session/tool/tool-meta.js

@@ -0,0 +1,27 @@
+import { contextToolTrigger as sdkContextToolTrigger } from '@kortix/sdk';
+/**
+ * Moved to `@kortix/sdk` (`packages/sdk/src/core/turns/tools/tool-meta.ts`)
+ * so web and mobile render the transcript from one implementation. This file
+ * keeps the old import path working for existing web call sites.
+ */
+export { CONTEXT_TOOLS, contextToolSummary, getToolPrimaryArg, isContextTool, normalizeName, } from '@kortix/sdk';
+/**
+ * The SDK's `contextToolTrigger` with this app's translated labels.
+ */
+export function contextToolTrigger(part, tI18nComplete) {
+    return sdkContextToolTrigger(part, {
+        read: tI18nComplete.raw('text9b9a8d05a7ec'),
+        search: tI18nComplete.raw('text49c266baaaa7'),
+        list: tI18nComplete.raw('text6f202f54a7b2'),
+        shell: tI18nComplete.raw('texta733285486d5'),
+        edit: tI18nComplete.raw('text464c4ffd019e'),
+        write: tI18nComplete.raw('text3f00927a7193'),
+        fetch: tI18nComplete.raw('textcd7d61bf7e38'),
+        webSearch: tI18nComplete.raw('textd04fc7d7e197'),
+        scrape: tI18nComplete.raw('text9af605fcac97'),
+        applyPatch: tI18nComplete.raw('text01bcfe7a9296'),
+        task: tI18nComplete.raw('text4bc74b21357c'),
+        worker: tI18nComplete.raw('texta67b04cd5c49'),
+        workspace: tI18nComplete.raw('text87bb59ba2f92'),
+    });
+}

package/dist/session/tool/tool-part-renderer.d.ts

@@ -0,0 +1,39 @@
+import { type InlinePermissionReply } from './inline-permission-reply.js';
+import { type PermissionRequest, type QuestionRequest } from '../../internal/session-types/index.js';
+import { type ToolCallBlock } from '@kortix/sdk';
+interface ToolPartRendererProps {
+    /**
+     * The session-log tool call. A caller that still holds a v1 part (a child
+     * session's rows) passes `toolCallBlock(part)`. A closure-rule block is read
+     * open (`sessionLogOpenCall`), so a dead call renders the same on v1 and v2.
+     */
+    call: ToolCallBlock;
+    permission?: PermissionRequest;
+    question?: QuestionRequest;
+    onPermissionReply?: (requestId: string, reply: InlinePermissionReply) => Promise<void> | void;
+    onQuestionReply?: (requestId: string, answers: string[][]) => void;
+    onQuestionReject?: (requestId: string) => void;
+    defaultOpen?: boolean;
+    disableNavigation?: boolean;
+}
+declare function ToolPartRendererImpl({ call: given, sessionId, permission, question, onPermissionReply, onQuestionReply, onQuestionReject, defaultOpen, disableNavigation, }: ToolPartRendererProps & {
+    sessionId?: string;
+}): import("react").JSX.Element | null;
+/**
+ * The boundary that stops a settled tool row re-rendering with the stream.
+ *
+ * Everything expensive on a collapsed row lives BELOW this line: `partOutput`'s
+ * regex passes, `getToolDiagnostics`, `parseReadOutput`. The disclosure gate
+ * protects the child's render, but it protects nothing in the parent that
+ * computed the props — so without a boundary here, a fifty-turn transcript
+ * re-parses every tool's output on every SSE frame.
+ *
+ * The default shallow compare is right: `call` objects are replaced, not
+ * mutated, when they change; `onPermissionReply` and `onQuestionReply` are
+ * `useCallback`s; `permission` is either `undefined` or a store object.
+ *
+ * `memo` does not block context propagation, so `ToolSurfaceContext`,
+ * `ToolActivateContext` and `ToolOutcomeContext` still reach the tool.
+ */
+export declare const ToolPartRenderer: import("react").MemoExoticComponent<typeof ToolPartRendererImpl>;
+export {};