@deepseek-harness-tui/dsh-tui 0.5.0

package/lib/types/components/Spinner/spinnerUtils.js

@@ -0,0 +1,104 @@
+/**
+ * Spinner animation utilities, ported from the leaked Claude Code source
+ * (`src/components/Spinner/utils.ts`).
+ */
+/**
+ * The platform-appropriate default spinner character set.
+ * @returns The spinner frame characters for the current terminal/platform.
+ */
+export function getDefaultCharacters() {
+    if (process.env.TERM === 'xterm-ghostty') {
+        return ['·', '✢', '✳', '✶', '✻', '*'];
+    }
+    return process.platform === 'darwin'
+        ? ['·', '✢', '✳', '✶', '✻', '✽']
+        : ['·', '✢', '*', '✶', '✻', '✽'];
+}
+/**
+ * Interpolate between two RGB colors.
+ * @param color1 - Start color.
+ * @param color2 - End color.
+ * @param t - Interpolation factor, 0 to 1.
+ * @returns The interpolated color, components rounded to integers.
+ */
+export function interpolateColor(color1, color2, t) {
+    return {
+        r: Math.round(color1.r + (color2.r - color1.r) * t),
+        g: Math.round(color1.g + (color2.g - color1.g) * t),
+        b: Math.round(color1.b + (color2.b - color1.b) * t),
+    };
+}
+/**
+ * Convert an RGB object to an `rgb()` color string for the Text component.
+ * @param color - The RGB color to format.
+ * @returns The `rgb(r,g,b)` string.
+ */
+export function toRGBColor(color) {
+    return `rgb(${color.r},${color.g},${color.b})`;
+}
+/**
+ * Convert an HSL hue to RGB, using voice-mode waveform parameters (s=0.7, l=0.6).
+ * @param hue - Hue in degrees (0–360; wrapped into range).
+ * @returns The RGB color for the hue.
+ */
+export function hueToRgb(hue) {
+    const h = ((hue % 360) + 360) % 360;
+    const s = 0.7;
+    const l = 0.6;
+    const c = (1 - Math.abs(2 * l - 1)) * s;
+    const x = c * (1 - Math.abs(((h / 60) % 2) - 1));
+    const m = l - c / 2;
+    let r = 0;
+    let g = 0;
+    let b = 0;
+    if (h < 60) {
+        r = c;
+        g = x;
+    }
+    else if (h < 120) {
+        r = x;
+        g = c;
+    }
+    else if (h < 180) {
+        g = c;
+        b = x;
+    }
+    else if (h < 240) {
+        g = x;
+        b = c;
+    }
+    else if (h < 300) {
+        r = x;
+        b = c;
+    }
+    else {
+        r = c;
+        b = x;
+    }
+    return {
+        r: Math.round((r + m) * 255),
+        g: Math.round((g + m) * 255),
+        b: Math.round((b + m) * 255),
+    };
+}
+const RGB_CACHE = new Map();
+/**
+ * Parse an `rgb(r,g,b)` color string, memoized per input.
+ * @param colorStr - The color string to parse.
+ * @returns The parsed RGB color, or null when the string is not `rgb(r,g,b)`.
+ */
+export function parseRGB(colorStr) {
+    const cached = RGB_CACHE.get(colorStr);
+    if (cached !== undefined)
+        return cached;
+    const match = colorStr.match(/rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/);
+    const result = match
+        ? {
+            r: parseInt(match[1], 10),
+            g: parseInt(match[2], 10),
+            b: parseInt(match[3], 10),
+        }
+        : null;
+    RGB_CACHE.set(colorStr, result);
+    return result;
+}

package/lib/types/components/Spinner/useStalledAnimation.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Tracks the transition to red when tokens stop flowing (ported from the
+ * leak's `Spinner/useStalledAnimation.ts`). Driven by the parent's animation
+ * clock time instead of independent intervals, so it slows down when the
+ * terminal is blurred.
+ * @param time - Parent animation clock time in ms.
+ * @param currentResponseLength - Chars streamed this turn; growth resets the stall timer.
+ * @param hasActiveTools - True while tools are running; tool activity never stalls.
+ * @param reducedMotion - True to apply intensity changes instantly instead of smoothing.
+ * @returns Whether the response is stalled, plus the 0–1 stalled intensity.
+ */
+export declare function useStalledAnimation(time: number, currentResponseLength: number, hasActiveTools?: boolean, reducedMotion?: boolean): {
+    isStalled: boolean;
+    stalledIntensity: number;
+};
+//# sourceMappingURL=useStalledAnimation.d.ts.map

package/lib/types/components/Spinner/useStalledAnimation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStalledAnimation.d.ts","sourceRoot":"","sources":["../../../../src/components/Spinner/useStalledAnimation.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,MAAM,EACZ,qBAAqB,EAAE,MAAM,EAC7B,cAAc,UAAQ,EACtB,aAAa,UAAQ,GACpB;IACD,SAAS,EAAE,OAAO,CAAA;IAClB,gBAAgB,EAAE,MAAM,CAAA;CACzB,CA6DA"}

package/lib/types/components/Spinner/useStalledAnimation.js

@@ -0,0 +1,71 @@
+import { useRef } from 'react';
+/**
+ * Tracks the transition to red when tokens stop flowing (ported from the
+ * leak's `Spinner/useStalledAnimation.ts`). Driven by the parent's animation
+ * clock time instead of independent intervals, so it slows down when the
+ * terminal is blurred.
+ * @param time - Parent animation clock time in ms.
+ * @param currentResponseLength - Chars streamed this turn; growth resets the stall timer.
+ * @param hasActiveTools - True while tools are running; tool activity never stalls.
+ * @param reducedMotion - True to apply intensity changes instantly instead of smoothing.
+ * @returns Whether the response is stalled, plus the 0–1 stalled intensity.
+ */
+export function useStalledAnimation(time, currentResponseLength, hasActiveTools = false, reducedMotion = false) {
+    const lastTokenTime = useRef(time);
+    const lastResponseLength = useRef(currentResponseLength);
+    const mountTime = useRef(time);
+    const stalledIntensityRef = useRef(0);
+    const lastSmoothTime = useRef(time);
+    // Reset timer when new tokens arrive (check actual length change)
+    if (currentResponseLength > lastResponseLength.current) {
+        lastTokenTime.current = time;
+        lastResponseLength.current = currentResponseLength;
+        stalledIntensityRef.current = 0;
+        lastSmoothTime.current = time;
+    }
+    // Derive time since last token from animation clock
+    let timeSinceLastToken;
+    if (hasActiveTools) {
+        timeSinceLastToken = 0;
+        lastTokenTime.current = time;
+    }
+    else if (currentResponseLength > 0) {
+        timeSinceLastToken = time - lastTokenTime.current;
+    }
+    else {
+        timeSinceLastToken = time - mountTime.current;
+    }
+    // Calculate stalled intensity based on time since last token
+    // Start showing red after 3 seconds of no new tokens (only when no tools are active)
+    const isStalled = timeSinceLastToken > 3000 && !hasActiveTools;
+    const intensity = isStalled
+        ? Math.min((timeSinceLastToken - 3000) / 2000, 1) // Fade over 2 seconds
+        : 0;
+    // Smooth intensity transition driven by animation frame ticks
+    if (!reducedMotion && (intensity > 0 || stalledIntensityRef.current > 0)) {
+        const dt = time - lastSmoothTime.current;
+        if (dt >= 50) {
+            const steps = Math.floor(dt / 50);
+            let current = stalledIntensityRef.current;
+            for (let i = 0; i < steps; i++) {
+                const diff = intensity - current;
+                if (Math.abs(diff) < 0.01) {
+                    current = intensity;
+                    break;
+                }
+                current += diff * 0.1;
+            }
+            stalledIntensityRef.current = current;
+            lastSmoothTime.current = time;
+        }
+    }
+    else {
+        stalledIntensityRef.current = intensity;
+        lastSmoothTime.current = time;
+    }
+    // When reducedMotion is enabled, use instant intensity change
+    const effectiveIntensity = reducedMotion
+        ? intensity
+        : stalledIntensityRef.current;
+    return { isStalled, stalledIntensity: effectiveIntensity };
+}

package/lib/types/components/StreamingMarkdown.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+/**
+ * Renders markdown during streaming by splitting at the last top-level block
+ * boundary: everything before is stable (memoized, never re-parsed), only the
+ * final block is re-parsed per delta (ported from the leak's
+ * `StreamingMarkdown.tsx`). marked.lexer() correctly handles unclosed code
+ * fences as a single token, so block boundaries are always safe.
+ */
+export declare function StreamingMarkdown({ children, }: {
+    children: string;
+}): React.ReactNode;
+//# sourceMappingURL=StreamingMarkdown.d.ts.map

package/lib/types/components/StreamingMarkdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StreamingMarkdown.d.ts","sourceRoot":"","sources":["../../../src/components/StreamingMarkdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,MAAM,CAAA;CACjB,GAAG,KAAK,CAAC,SAAS,CAoClB"}

package/lib/types/components/StreamingMarkdown.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { marked } from 'marked';
+import Box from '../ink/components/Box.js';
+import { stripPromptXMLTags } from '../cc/markdown.js';
+import { Markdown } from './Markdown.js';
+/**
+ * Renders markdown during streaming by splitting at the last top-level block
+ * boundary: everything before is stable (memoized, never re-parsed), only the
+ * final block is re-parsed per delta (ported from the leak's
+ * `StreamingMarkdown.tsx`). marked.lexer() correctly handles unclosed code
+ * fences as a single token, so block boundaries are always safe.
+ */
+export function StreamingMarkdown({ children, }) {
+    const stablePrefixRef = React.useRef('');
+    const stripped = stripPromptXMLTags(children);
+    // Reset if text was replaced (defensive; normally unmount handles this)
+    if (!stripped.startsWith(stablePrefixRef.current)) {
+        stablePrefixRef.current = '';
+    }
+    // Lex only from current boundary — O(unstable length), not O(full text)
+    const boundary = stablePrefixRef.current.length;
+    const tokens = marked.lexer(stripped.substring(boundary));
+    // Last non-space token is the growing block; everything before is final
+    let lastContentIdx = tokens.length - 1;
+    while (lastContentIdx >= 0 && tokens[lastContentIdx].type === 'space') {
+        lastContentIdx--;
+    }
+    let advance = 0;
+    for (let i = 0; i < lastContentIdx; i++) {
+        advance += tokens[i].raw.length;
+    }
+    if (advance > 0) {
+        stablePrefixRef.current = stripped.substring(0, boundary + advance);
+    }
+    const stablePrefix = stablePrefixRef.current;
+    const unstableSuffix = stripped.substring(stablePrefix.length);
+    return (_jsxs(Box, { flexDirection: "column", gap: 1, children: [stablePrefix && _jsx(Markdown, { children: stablePrefix }), unstableSuffix && _jsx(Markdown, { cacheTokens: false, children: unstableSuffix })] }));
+}

package/lib/types/components/ThemePicker.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { type SelectOption } from './Select.js';
+/**
+ * The full selectable theme list: the three built-in palettes (display
+ * order) followed by discovered user themes from ~/.dsh-cc/themes (sorted
+ * by file name). Shared by ThemePicker (render) and the /theme command
+ * (focus index), so both always see the same ordering.
+ */
+export declare function getThemeOptions(): SelectOption[];
+/**
+ * Color-theme picker in the ActivityPicker style: a permission-colored Pane
+ * listing the built-in palettes first, then every user theme found in
+ * ~/.dsh-cc/themes — each row shows the display name, its base and three
+ * key color swatches; `❯` marks focus, `✓` the active theme. Enter applies
+ * through the ThemeProvider setter (persists to ~/.dsh-cc/theme.json and
+ * hot swaps), Esc cancels.
+ */
+export declare function ThemePicker({ focusIndex, currentTheme, }: {
+    focusIndex: number;
+    currentTheme: string | undefined;
+}): React.ReactNode;
+//# sourceMappingURL=ThemePicker.d.ts.map

package/lib/types/components/ThemePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemePicker.d.ts","sourceRoot":"","sources":["../../../src/components/ThemePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,aAAa,CAAA;AAwCvD;;;;;GAKG;AACH,wBAAgB,eAAe,IAAI,YAAY,EAAE,CAchD;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,UAAU,EACV,YAAY,GACb,EAAE;IACD,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,EAAE,MAAM,GAAG,SAAS,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CAyBlB"}

package/lib/types/components/ThemePicker.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { t } from '../i18n.js';
+import { Box, Text } from '../ui.js';
+import { Pane } from './design-system/Pane.js';
+import { Select } from './Select.js';
+import { Byline } from './design-system/Byline.js';
+import { KeyboardShortcutHint } from './design-system/KeyboardShortcutHint.js';
+import { getTheme, THEME_NAMES } from '../theme.js';
+import { buildTheme, listCustomThemes } from '../customTheme.js';
+/** One double-block swatch character per preview key, in a row. */
+const SWATCH = '██';
+/** Theme keys previewed in the picker, chosen for visual contrast. */
+const SWATCH_KEYS = ['claude', 'text', 'success'];
+function swatches(theme) {
+    return (_jsx(_Fragment, { children: SWATCH_KEYS.map(key => (_jsx(Text, { color: theme[key], children: SWATCH }, key))) }));
+}
+/** A picker row: display name + color swatches. */
+function optionFor(name, displayName, theme, description) {
+    return {
+        value: name,
+        label: (_jsxs(_Fragment, { children: [displayName, '  ', swatches(theme)] })),
+        description,
+    };
+}
+/**
+ * The full selectable theme list: the three built-in palettes (display
+ * order) followed by discovered user themes from ~/.dsh-cc/themes (sorted
+ * by file name). Shared by ThemePicker (render) and the /theme command
+ * (focus index), so both always see the same ordering.
+ */
+export function getThemeOptions() {
+    const builtins = THEME_NAMES.map(name => {
+        const theme = getTheme(name);
+        return optionFor(name, name, theme, t('theme-builtin-base', { name }));
+    });
+    const custom = listCustomThemes().map(spec => optionFor(spec.name, spec.displayName, buildTheme(spec), t('theme-user-base', { base: spec.base, name: spec.name })));
+    return [...builtins, ...custom];
+}
+/**
+ * Color-theme picker in the ActivityPicker style: a permission-colored Pane
+ * listing the built-in palettes first, then every user theme found in
+ * ~/.dsh-cc/themes — each row shows the display name, its base and three
+ * key color swatches; `❯` marks focus, `✓` the active theme. Enter applies
+ * through the ThemeProvider setter (persists to ~/.dsh-cc/theme.json and
+ * hot swaps), Esc cancels.
+ */
+export function ThemePicker({ focusIndex, currentTheme, }) {
+    const options = React.useMemo(() => getThemeOptions(), []);
+    return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: "Color theme" }) }), _jsx(Select, { options: options, focusIndex: focusIndex, selectedValue: currentTheme, visibleOptionCount: 6 }), _jsx(Text, { dimColor: true, italic: true, children: _jsxs(Byline, { children: [_jsx(KeyboardShortcutHint, { shortcut: "Enter", action: "confirm", bold: true }), _jsx(KeyboardShortcutHint, { shortcut: "Esc", action: "exit" })] }) })] }) }));
+}

package/lib/types/components/ThinkingToggle.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+/**
+ * The `/thinking` dialog, ported from the leak's ThinkingToggle.tsx: a
+ * permission-colored Pane with a bold title, the Enabled/Disabled select
+ * (with CC's option descriptions), and the Enter/Esc hint line.
+ *
+ * When `confirmationPending` is set (mid-conversation toggle), the select is
+ * replaced by CC's yellow warning block and the hint line becomes
+ * Enter confirm / Esc cancel; keyboard handling lives in the caller (Chat).
+ */
+export declare function ThinkingToggle({ currentValue, focusIndex, confirmationPending, }: {
+    currentValue: boolean;
+    focusIndex: number;
+    /** Set while a mid-conversation toggle awaits Enter confirmation. */
+    confirmationPending: boolean | null;
+}): React.ReactNode;
+//# sourceMappingURL=ThinkingToggle.d.ts.map

package/lib/types/components/ThinkingToggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThinkingToggle.d.ts","sourceRoot":"","sources":["../../../src/components/ThinkingToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,EAC7B,YAAY,EACZ,UAAU,EACV,mBAAmB,GACpB,EAAE;IACD,YAAY,EAAE,OAAO,CAAA;IACrB,UAAU,EAAE,MAAM,CAAA;IAClB,qEAAqE;IACrE,mBAAmB,EAAE,OAAO,GAAG,IAAI,CAAA;CACpC,GAAG,KAAK,CAAC,SAAS,CAuDlB"}

package/lib/types/components/ThinkingToggle.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from '../ui.js';
+import { Pane } from './design-system/Pane.js';
+import { Select } from './Select.js';
+import { Byline } from './design-system/Byline.js';
+import { KeyboardShortcutHint } from './design-system/KeyboardShortcutHint.js';
+/**
+ * The `/thinking` dialog, ported from the leak's ThinkingToggle.tsx: a
+ * permission-colored Pane with a bold title, the Enabled/Disabled select
+ * (with CC's option descriptions), and the Enter/Esc hint line.
+ *
+ * When `confirmationPending` is set (mid-conversation toggle), the select is
+ * replaced by CC's yellow warning block and the hint line becomes
+ * Enter confirm / Esc cancel; keyboard handling lives in the caller (Chat).
+ */
+export function ThinkingToggle({ currentValue, focusIndex, confirmationPending, }) {
+    const options = [
+        {
+            value: 'true',
+            label: 'Enabled',
+            description: 'DeepSeek will think before responding',
+        },
+        {
+            value: 'false',
+            label: 'Disabled',
+            description: 'DeepSeek will respond without extended thinking',
+        },
+    ];
+    return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, flexDirection: "column", children: [_jsx(Text, { color: "remember", bold: true, children: "Toggle thinking mode" }), _jsx(Text, { dimColor: true, children: "Enable or disable thinking for this session." })] }), confirmationPending !== null ? (_jsxs(Box, { flexDirection: "column", marginBottom: 1, gap: 1, children: [_jsx(Text, { color: "warning", children: "Changing thinking mode mid-conversation will increase latency and may reduce quality. For best results, set this at the start of a session." }), _jsx(Text, { color: "warning", children: "Do you want to proceed?" })] })) : (_jsx(Box, { flexDirection: "column", marginBottom: 1, children: _jsx(Select, { options: options, focusIndex: focusIndex, selectedValue: currentValue ? 'true' : 'false', visibleOptionCount: 2 }) }))] }), _jsx(Text, { dimColor: true, italic: true, children: _jsxs(Byline, { children: [_jsx(KeyboardShortcutHint, { shortcut: "Enter", action: "confirm", bold: true }), _jsx(KeyboardShortcutHint, { shortcut: "Esc", action: confirmationPending !== null ? 'cancel' : 'exit' })] }) })] }));
+}

package/lib/types/components/ToolUseLoader.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+type Props = {
+    isError: boolean;
+    isUnresolved: boolean;
+    shouldAnimate: boolean;
+};
+/**
+ * The status dot on tool-call rows (ported from the leak's ToolUseLoader):
+ * blinking `●` while running, green on success, red on error, dim when queued.
+ */
+export declare function ToolUseLoader({ isError, isUnresolved, shouldAnimate, }: Props): React.ReactNode;
+export {};
+//# sourceMappingURL=ToolUseLoader.d.ts.map

package/lib/types/components/ToolUseLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolUseLoader.d.ts","sourceRoot":"","sources":["../../../src/components/ToolUseLoader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,OAAO,CAAA;IAChB,YAAY,EAAE,OAAO,CAAA;IACrB,aAAa,EAAE,OAAO,CAAA;CACvB,CAAA;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,YAAY,EACZ,aAAa,GACd,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CAezB"}

package/lib/types/components/ToolUseLoader.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Box from '../ink/components/Box.js';
+import Text from '../ink/components/Text.js';
+import { useBlink } from '../hooks/useBlink.js';
+import { BLACK_CIRCLE } from '../cc/figures.js';
+/**
+ * The status dot on tool-call rows (ported from the leak's ToolUseLoader):
+ * blinking `●` while running, green on success, red on error, dim when queued.
+ */
+export function ToolUseLoader({ isError, isUnresolved, shouldAnimate, }) {
+    const [ref, isBlinking] = useBlink(shouldAnimate);
+    const color = isUnresolved ? undefined : isError ? 'error' : 'success';
+    const char = !shouldAnimate || isBlinking || isError || !isUnresolved
+        ? BLACK_CIRCLE
+        : ' ';
+    return (_jsx(Box, { ref: ref, minWidth: 2, children: _jsx(Text, { color: color, dimColor: isUnresolved, children: char }) }));
+}

package/lib/types/components/Whale.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { type WhaleFrame } from './whaleFrames.js';
+/**
+ * Render a frame to 13 ANSI rows (one per sprite row pair). Consecutive
+ * cells sharing one style are run-length encoded; trailing transparent
+ * cells are dropped so the rows measure exactly the whale's bounding box.
+ */
+export declare function renderWhaleRows(frame: WhaleFrame): string[];
+/** Index of the `standard` frame — the settled header's static pose. */
+export declare const STANDARD_FRAME_INDEX = 0;
+/**
+ * One whale pose as an Ink component: 13 rows × 40 columns, never
+ * shrinking. Pass `frameIndex` from OPENING_SEQUENCE while animating, or
+ * STANDARD_FRAME_INDEX for the static header whale. `width` pins the box
+ * width so the neighbouring text column never shifts when frames widen
+ * (the tail-wag frames reach 4 columns further right than standard).
+ */
+export declare function WhaleArt({ frameIndex, width, }: {
+    frameIndex?: number;
+    width?: number;
+}): React.ReactNode;
+//# sourceMappingURL=Whale.d.ts.map

package/lib/types/components/Whale.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Whale.d.ts","sourceRoot":"","sources":["../../../src/components/Whale.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAgB,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAyBhE;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,EAAE,CAwC3D;AAKD,wEAAwE;AACxE,eAAO,MAAM,oBAAoB,IAAI,CAAA;AAErC;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAC,EACvB,UAAiC,EACjC,KAAK,GACN,EAAE;IACD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,GAAG,KAAK,CAAC,SAAS,CAWlB"}

package/lib/types/components/Whale.js

@@ -0,0 +1,78 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from '../ui.js';
+import { WHALE_FRAMES } from './whaleFrames.js';
+/** Sprite palette: D outline · B body · L belly · W mouth · `.` transparent. */
+const PALETTE = {
+    D: [20, 38, 96],
+    B: [78, 111, 255],
+    L: [190, 225, 255],
+    W: [255, 255, 255],
+};
+const fg = (rgb) => `\x1b[38;2;${rgb[0]};${rgb[1]};${rgb[2]}m`;
+const bg = (rgb) => `\x1b[48;2;${rgb[0]};${rgb[1]};${rgb[2]}m`;
+const RESET = '\x1b[0m';
+/**
+ * Render a frame to 13 ANSI rows (one per sprite row pair). Consecutive
+ * cells sharing one style are run-length encoded; trailing transparent
+ * cells are dropped so the rows measure exactly the whale's bounding box.
+ */
+export function renderWhaleRows(frame) {
+    const sprite = frame.rows;
+    const rows = [];
+    for (let r = 0; r < sprite.length; r += 2) {
+        const upper = sprite[r];
+        const lower = sprite[r + 1] ?? '';
+        let out = '';
+        let current = '';
+        for (let x = 0; x < upper.length; x++) {
+            const up = PALETTE[upper[x]];
+            const lo = PALETTE[lower[x]];
+            let seq;
+            let ch;
+            if (up !== undefined && lo !== undefined) {
+                seq = fg(up) + bg(lo);
+                ch = '▀';
+            }
+            else if (up !== undefined) {
+                seq = fg(up);
+                ch = '▀';
+            }
+            else if (lo !== undefined) {
+                seq = fg(lo);
+                ch = '▄';
+            }
+            else {
+                seq = '';
+                ch = ' ';
+            }
+            if (seq !== current) {
+                out += seq === '' ? RESET : seq;
+                current = seq;
+            }
+            out += ch;
+        }
+        // Drop the transparent tail (plain spaces paint nothing), then always
+        // close the row's style — a row ending on a colored cell would
+        // otherwise leak its SGR into the line's remaining padding.
+        let row = out.replace(/[ ]+$/, '');
+        if (!row.endsWith(RESET))
+            row += RESET;
+        rows.push(row);
+    }
+    return rows;
+}
+/** Pre-rendered ANSI rows for every frame, computed once at module load. */
+const RENDERED = WHALE_FRAMES.map(renderWhaleRows);
+/** Index of the `standard` frame — the settled header's static pose. */
+export const STANDARD_FRAME_INDEX = 0;
+/**
+ * One whale pose as an Ink component: 13 rows × 40 columns, never
+ * shrinking. Pass `frameIndex` from OPENING_SEQUENCE while animating, or
+ * STANDARD_FRAME_INDEX for the static header whale. `width` pins the box
+ * width so the neighbouring text column never shifts when frames widen
+ * (the tail-wag frames reach 4 columns further right than standard).
+ */
+export function WhaleArt({ frameIndex = STANDARD_FRAME_INDEX, width, }) {
+    const rows = RENDERED[frameIndex] ?? RENDERED[STANDARD_FRAME_INDEX];
+    return (_jsx(Box, { flexDirection: "column", flexShrink: 0, width: width, children: rows.map((row, index) => (_jsx(Text, { wrap: "truncate-end", children: row }, index))) }));
+}

package/lib/types/components/WorkingSpinner.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { SpinnerMode } from './Spinner/spinnerMode.js';
+/**
+ * The working spinner block shown between the transcript and the prompt
+ * input while a turn is in flight. Ported from the leak's `Spinner.tsx`
+ * (SpinnerWithVerb path) with the swarm/teammate/effort/tips branches
+ * removed; the channel feeds the mode, token count and thinking status.
+ *
+ * Random verb is picked once per turn (per mount of the spinner).
+ */
+export declare function WorkingSpinner({ mode, hasActiveTools, responseLengthRef, loadingStartTimeRef, totalPausedMsRef, pauseStartTimeRef, thinkingStatus, }: {
+    mode: SpinnerMode;
+    hasActiveTools: boolean;
+    responseLengthRef: React.RefObject<number>;
+    loadingStartTimeRef: React.RefObject<number>;
+    totalPausedMsRef: React.RefObject<number>;
+    pauseStartTimeRef: React.RefObject<number | null>;
+    thinkingStatus: 'thinking' | number | null;
+}): React.ReactNode;
+/**
+ * Tracks thinking status: 'thinking' while the model is streaming reasoning,
+ * then the duration in ms for a minimum 2s display (avoids UI jank). Ported
+ * from the leak's SpinnerWithVerb effect.
+ */
+export declare function useThinkingStatus(isThinking: boolean): 'thinking' | number | null;
+//# sourceMappingURL=WorkingSpinner.d.ts.map

package/lib/types/components/WorkingSpinner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkingSpinner.d.ts","sourceRoot":"","sources":["../../../src/components/WorkingSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAA;AAG1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAK3D;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,cAAc,EACd,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,GACf,EAAE;IACD,IAAI,EAAE,WAAW,CAAA;IACjB,cAAc,EAAE,OAAO,CAAA;IACvB,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;IAC1C,mBAAmB,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;IAC5C,gBAAgB,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;IACzC,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,CAAA;IACjD,cAAc,EAAE,UAAU,GAAG,MAAM,GAAG,IAAI,CAAA;CAC3C,GAAG,KAAK,CAAC,SAAS,CA2BlB;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAC/B,UAAU,EAAE,OAAO,GAClB,UAAU,GAAG,MAAM,GAAG,IAAI,CA6C5B"}

package/lib/types/components/WorkingSpinner.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { useTerminalSize } from '../ink/hooks/use-terminal-size.js';
+import { Box } from '../ui.js';
+import { SpinnerAnimationRow } from './Spinner/SpinnerAnimationRow.js';
+import { SPINNER_VERBS } from '../cc/spinnerVerbs.js';
+import { sample } from 'lodash-es';
+/**
+ * The working spinner block shown between the transcript and the prompt
+ * input while a turn is in flight. Ported from the leak's `Spinner.tsx`
+ * (SpinnerWithVerb path) with the swarm/teammate/effort/tips branches
+ * removed; the channel feeds the mode, token count and thinking status.
+ *
+ * Random verb is picked once per turn (per mount of the spinner).
+ */
+export function WorkingSpinner({ mode, hasActiveTools, responseLengthRef, loadingStartTimeRef, totalPausedMsRef, pauseStartTimeRef, thinkingStatus, }) {
+    const { columns } = useTerminalSize();
+    // Pick a random verb once per spinner mount (per turn).
+    const [randomVerb] = useState(() => sample(SPINNER_VERBS) ?? 'Working');
+    const message = `${randomVerb}…`;
+    return (_jsx(Box, { flexDirection: "column", width: "100%", alignItems: "flex-start", children: _jsx(SpinnerAnimationRow, { mode: mode, reducedMotion: false, hasActiveTools: hasActiveTools, responseLengthRef: responseLengthRef, message: message, messageColor: "claude", shimmerColor: "claudeShimmer", loadingStartTimeRef: loadingStartTimeRef, totalPausedMsRef: totalPausedMsRef, pauseStartTimeRef: pauseStartTimeRef, spinnerSuffix: null, verbose: true, columns: columns, thinkingStatus: thinkingStatus }) }));
+}
+/**
+ * Tracks thinking status: 'thinking' while the model is streaming reasoning,
+ * then the duration in ms for a minimum 2s display (avoids UI jank). Ported
+ * from the leak's SpinnerWithVerb effect.
+ */
+export function useThinkingStatus(isThinking) {
+    const [thinkingStatus, setThinkingStatus] = useState(null);
+    const thinkingStartRef = useRef(null);
+    useEffect(() => {
+        let showDurationTimer = null;
+        let clearStatusTimer = null;
+        if (isThinking) {
+            // Started thinking
+            if (thinkingStartRef.current === null) {
+                thinkingStartRef.current = Date.now();
+                setThinkingStatus('thinking');
+            }
+        }
+        else if (thinkingStartRef.current !== null) {
+            // Stopped thinking - calculate duration and ensure 2s minimum display
+            const duration = Date.now() - thinkingStartRef.current;
+            const elapsed = Date.now() - thinkingStartRef.current;
+            const remainingThinkingTime = Math.max(0, 2000 - elapsed);
+            thinkingStartRef.current = null;
+            // Show "thinking..." for remaining time if < 2s elapsed, then show duration
+            const showDuration = () => {
+                setThinkingStatus(duration);
+                // Clear after 2s
+                clearStatusTimer = setTimeout(() => setThinkingStatus(null), 2000);
+            };
+            if (remainingThinkingTime > 0) {
+                showDurationTimer = setTimeout(showDuration, remainingThinkingTime);
+            }
+            else {
+                showDuration();
+            }
+        }
+        return () => {
+            if (showDurationTimer)
+                clearTimeout(showDurationTimer);
+            if (clearStatusTimer)
+                clearTimeout(clearStatusTimer);
+        };
+    }, [isThinking]);
+    return thinkingStatus;
+}