@aragon-agent/tui 0.0.0-stage → 0.0.1

package/dist/ui/Markdown.js

@@ -0,0 +1,116 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { pickGlyphs } from './glyphs.js';
+import { railBorderProps } from './layout/Gutter.js';
+import { highlightCached, parseMarkdownCached } from './render-cache.js';
+import { formatTable, isRule, parseHeading, parseInline, } from './markdown-blocks.js';
+/** Width of the `---` rule. Fixed so it cannot force a wrap on narrow frames. */
+const RULE_WIDTH = 24;
+export function Markdown({ text, theme, caps }) {
+    const glyphs = pickGlyphs(caps);
+    const blocks = parseMarkdownCached(text);
+    return (_jsx(Box, { flexDirection: "column", children: blocks.map((block, i) => renderBlock(block, i, theme, glyphs)) }));
+}
+function renderBlock(block, key, theme, glyphs) {
+    switch (block.kind) {
+        case 'code':
+            return (_jsx(CodeBlock, { code: block.code, lang: block.lang, theme: theme, glyphs: glyphs }, `b${key}`));
+        case 'table': {
+            // Glyphs are injected rather than hardcoded: this module is inside the
+            // ASCII-only scan, and the pure parser defaults to ASCII `|` / `-`.
+            const formatted = formatTable(block.rows, block.align, {
+                separator: glyphs.railVertical,
+                rule: glyphs.hrule,
+            });
+            return (_jsx(Box, { flexDirection: "column", children: formatted.map((row, r) => (_jsx(Text, { wrap: "truncate", bold: r === 0, color: tableRowColor(r, theme), children: row }, r))) }, `b${key}`));
+        }
+        default:
+            return _jsx(InlineLine, { line: block.text, theme: theme, glyphs: glyphs }, `b${key}`);
+    }
+}
+/**
+ * Table row 0 is the header (bold + accent); row 1 is the divider drawn under it.
+ *
+ * The divider must stay distinguishable at colour level 0, where bold is dropped
+ * to nothing, so it is MUTED and never bold: in `--no-color` the `----` run is
+ * itself the signal, and in a coloured tier the weight difference separates the
+ * header from the rule beneath it.
+ */
+function tableRowColor(index, theme) {
+    if (index === 0)
+        return theme.accent;
+    if (index === 1)
+        return theme.muted;
+    return undefined;
+}
+/**
+ * Fenced code. The round border is gone (§4.3): nested inside a tool card it
+ * produced a box inside a box and squeezed an 80-column terminal down to 74
+ * usable columns. A left rail plus the language tag conveys the same "this is
+ * code" boundary for 1 column and 0 rows.
+ *
+ * The language tag is a muted TITLE, not a body row: it used to carry a chip
+ * background and one padding space either side of the text, so it rendered as
+ * `  |  ts` above code rows that start at `| export ...` — a body line that
+ * happened to be the language. It keeps its own row on purpose: the height
+ * estimator (`virtual-window.estimateEntryRows`) counts RAW markdown lines and
+ * has no code-block branch, so the fence line must still occupy exactly 1 row.
+ */
+function CodeBlock({ code, lang, theme, glyphs, }) {
+    const rendered = highlightCached(code, lang);
+    return (_jsxs(Box, { flexDirection: "column", flexShrink: 0, paddingLeft: 1, ...railBorderProps(glyphs.railVertical, theme.border), children: [lang.length > 0 && (_jsx(Text, { bold: true, color: theme.muted, children: lang })), _jsx(Text, { children: rendered })] }));
+}
+/** Six heading levels used to render identically; now they carry three weights. */
+function headingStyle(level, theme) {
+    if (level <= 2)
+        return { color: theme.primary };
+    if (level === 3)
+        return { color: theme.accent };
+    return { color: theme.assistant };
+}
+function InlineLine({ line, theme, glyphs, }) {
+    const heading = parseHeading(line);
+    if (heading) {
+        const style = headingStyle(heading.level, theme);
+        if (heading.level === 1) {
+            return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: style.color, children: heading.text }), _jsx(Text, { color: theme.border, children: glyphs.hrule.repeat(RULE_WIDTH) })] }));
+        }
+        return (_jsx(Text, { bold: true, color: style.color, children: heading.text }));
+    }
+    if (isRule(line)) {
+        return _jsx(Text, { color: theme.border, children: glyphs.hrule.repeat(RULE_WIDTH) });
+    }
+    const quote = /^>\s?(.*)$/.exec(line);
+    if (quote) {
+        return (_jsxs(Text, { color: theme.muted, italic: true, children: [glyphs.railVertical, " ", renderInline(quote[1] ?? '', theme)] }));
+    }
+    const bullet = /^(\s*)([-*+])\s+(.*)$/.exec(line);
+    if (bullet) {
+        return (_jsxs(Text, { children: [bullet[1], _jsxs(Text, { color: theme.accent, children: [glyphs.bullet, " "] }), renderInline(bullet[3] ?? '', theme)] }));
+    }
+    const ordered = /^(\s*)(\d+)\.\s+(.*)$/.exec(line);
+    if (ordered) {
+        return (_jsxs(Text, { children: [ordered[1], _jsxs(Text, { color: theme.accent, children: [ordered[2], ". "] }), renderInline(ordered[3] ?? '', theme)] }));
+    }
+    return _jsx(Text, { children: renderInline(line, theme) });
+}
+/** Turn parsed inline spans into Ink `<Text>` nodes. */
+export function renderInline(text, theme) {
+    const spans = parseInline(text);
+    if (spans.length === 0)
+        return text;
+    return spans.map((span, i) => {
+        switch (span.kind) {
+            case 'code':
+                return (_jsx(Text, { color: theme.code, children: span.text }, `i${i}`));
+            case 'bold':
+                return (_jsx(Text, { bold: true, children: span.text }, `i${i}`));
+            case 'italic':
+                return (_jsx(Text, { italic: true, children: span.text }, `i${i}`));
+            case 'strike':
+                return (_jsx(Text, { strikethrough: true, children: span.text }, `i${i}`));
+            default:
+                return span.text;
+        }
+    });
+}

package/dist/ui/PromptCaret.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface PromptCaretProps {
+    text: string;
+    active: boolean;
+    reducedMotion: boolean;
+    colorLevel: 0 | 1 | 2 | 3;
+    color?: string;
+    resetKey: object;
+}
+/** The only blinking state belongs to this leaf, never to the editor. */
+export declare function PromptCaret({ text, active, reducedMotion, colorLevel, color, resetKey, }: PromptCaretProps): React.ReactElement;

package/dist/ui/PromptCaret.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLayoutEffect, useState } from 'react';
+import { Text } from 'ink';
+import { displayWidth } from './composer-rows.js';
+function monochromeMarker(text) {
+    // Ink's output grid advances for combining marks, even though they have no
+    // terminal width. Retain them in both phases so its cell count stays stable.
+    const replace = (marker) => Array.from(text, (point) => {
+        const width = displayWidth(point);
+        return width > 0 ? marker.repeat(width) : point;
+    }).join('');
+    const underline = replace('_');
+    return underline === text ? replace('^') : underline;
+}
+/** The only blinking state belongs to this leaf, never to the editor. */
+export function PromptCaret({ text, active, reducedMotion, colorLevel, color, resetKey, }) {
+    const [visible, setVisible] = useState(true);
+    useLayoutEffect(() => {
+        setVisible(true);
+        if (!active || reducedMotion)
+            return;
+        const timer = setInterval(() => setVisible((previous) => !previous), 500);
+        return () => clearInterval(timer);
+    }, [resetKey, active, reducedMotion]);
+    const bright = active && (reducedMotion || visible);
+    let content = text;
+    if (bright && colorLevel === 0) {
+        content = monochromeMarker(text);
+    }
+    return _jsx(Text, { color: color, inverse: bright && colorLevel > 0, children: content });
+}

package/dist/ui/PromptInput.d.ts

@@ -0,0 +1,192 @@
+/**
+ * PromptInput (spec §3.6 / §3.10) — a controlled multiline input on Ink's
+ * `useInput` with: full line editing (Home/End, word jump/delete, kill-line via
+ * `input/keymap`), multi-line vertical cursor navigation, prompt-history recall
+ * at the edges, a slash-command palette, and `@file` path completion.
+ *
+ * The buffer/cursor transforms (`applyEdit`, `moveVertical`) and the suggestion
+ * computations (`slashSuggestions`, `fileTokenAt`) are pure module functions,
+ * exported for `input.test.ts`, so the component itself stays thin.
+ *
+ * THE EDITOR'S FIVE PIECES OF STATE LIVE IN ONE REDUCER, and every branch of the
+ * input handler performs AT MOST ONE `dispatch` (tui-input-flicker-fix §3.4).
+ * Ink mounts a LEGACY React root, where `setState` outside a React event handler
+ * is not batched — and `useInput` runs from a stdin `'data'` listener, which is
+ * outside React entirely. The five `setState` calls one keystroke used to make
+ * were five commits, five whole-tree Yoga layouts and, through Ink's 32 ms
+ * leading+trailing throttle, two full-frame repaints per character. `fileMatches`
+ * stays a plain `useState` because it is written from the debounced glob effect
+ * rather than from a key.
+ */
+import React from 'react';
+import type { Theme } from './theme.js';
+import type { TermCapabilities } from './capabilities.js';
+import { pickGlyphs } from './glyphs.js';
+import { type EditIntent } from '../input/keymap.js';
+import { type Suggestion } from './AutocompletePopup.js';
+import { type EditorState, type InputSegment } from './editor-reducer.js';
+import { type ComposerSubmitResult } from './composer-input.js';
+import type { AgentMode } from '../model/agent/agent-mode.js';
+export interface CommandOption {
+    name: string;
+    description: string;
+}
+interface PromptInputProps {
+    cols?: number;
+    terminalRows?: number;
+    statusExpanded?: boolean;
+    cursorVisible?: boolean;
+    onInteraction?: () => void;
+    isActive: boolean;
+    running: boolean;
+    history: string[];
+    commands: CommandOption[];
+    cwd: string;
+    theme: Theme;
+    caps: TermCapabilities;
+    /**
+     * Row budget for the completion popup (§5.2 / R-14).
+     *
+     * The popup shares the scrolling footer with the editor. Its height budget
+     * reserves visible message rows without changing the viewport or TODO rail.
+     */
+    popupMaxRows?: number;
+    /** Total menu rows, including borders and the overflow hint. */
+    popupMaxHeight?: number;
+    onPopupRowsChange?: (rows: number) => void;
+    onCompletionContextChange?: (context: 'none' | 'slash' | 'file') => void;
+    /** True only when the stdin filter normalized DEL before Ink parsed it. */
+    deleteDisambiguated?: boolean;
+    onSubmit: (text: string) => ComposerSubmitResult;
+    onHelp?: () => void;
+    onEscape?: () => void;
+    onEscapeDismiss?: () => void;
+    reducedMotion?: boolean;
+    /**
+     * Mirror of the session mode. Read for the placeholder only — the toggle
+     * itself belongs to `App`, and this component's job is to get out of its way
+     * (see the first statement of the input handler).
+     */
+    agentMode?: AgentMode;
+    borderColor?: string;
+    /**
+     * Fires when the draft flips empty ⇄ non-empty (for the border color) OR when
+     * its ROW COUNT changes (for `layout/budget.ts`) — never per keystroke.
+     *
+     * Widened from `(hasDraft: boolean)` by tui-paste-handling section 5.5. The row
+     * count is what makes I-8 true: the composer's rendered height and the
+     * `draftRows` handed to `viewportRows` have to be the same number, and the only
+     * component that knows the first one is this one. It is reported ALREADY
+     * CLAMPED, so a 218-line draft and a 400-line draft report the same value and
+     * the transcript stops moving once the composer is full (R-12).
+     */
+    onDraftChange?: (state: {
+        hasDraft: boolean;
+        rows: number;
+    }) => void;
+    /**
+     * Tell the user a paste was refused (D-11 / P1-4).
+     *
+     * `PASTE_DRAFT_MAX_BYTES` and `PASTE_MAX_BLOCKS` cannot be enforced in the
+     * filter (it does not know the draft) and cannot be enforced in the reducer (it
+     * is pure, so it can neither raise a toast nor say why it refused). This
+     * component is the only place that holds both facts.
+     */
+    onNotice?: (level: 'warn' | 'error', text: string) => void;
+    /**
+     * App-owned draft clearing (ctrl-c-clear-draft-exit): the second
+     * Ctrl+C of the armed ladder asks the editor to drop the draft. A
+     * NUMBER, not a boolean, so repeated requests stay distinguishable
+     * and the effect below never re-fires for an unchanged value.
+     * `'clear'` returns the editor to INITIAL_EDITOR_STATE, releasing
+     * paste payloads with it.
+     */
+    draftClearNonce?: number;
+    /**
+     * App-owned ONE-SHOT fill (quick-prompt-library D-6 / §4.6).
+     *
+     * The payload-carrying sibling of `draftClearNonce`: `{ nonce, text, submit }`, with
+     * the same monotonic-nonce discipline, because a nonce is the only thing that makes
+     * an effect idempotent under StrictMode and re-renders (I-8). It is applied through
+     * `transact`, NOT by dispatching and calling `onSubmit` here: the composer has
+     * exactly one submission path and a fill must not become the second one (P0-1 / I-9).
+     */
+    draftFill?: DraftFill;
+    /** `prompts.insertMode`: what a fill does to a draft that already has text. */
+    insertMode?: 'insert' | 'replace';
+    scrolledLines?: number;
+}
+/** A one-shot "put this text in the draft" payload (quick-prompt-library §4.6). */
+export interface DraftFill {
+    /** Monotonic; the same value is applied at most once. */
+    nonce: number;
+    text: string;
+    /** `true` = apply and submit in ONE transaction (the picker's `Ctrl+Enter`). */
+    submit?: boolean;
+}
+export interface ScrollChip {
+    text: string;
+    /** FIXED width, so the number gaining a digit cannot re-wrap the draft (P2-4). */
+    cells: number;
+}
+/**
+ * Build the chip, or `null` when the viewport is pinned to the newest output.
+ *
+ * Every glyph comes from `pickGlyphs` and none from a literal (I-5): on a legacy
+ * console this renders `v12` rather than mojibake, and `glyphs.test.ts`'s static
+ * scan fails the build if that rule is broken here.
+ */
+export declare function scrollChip(scrolledLines: number, cols: number, glyphs: ReturnType<typeof pickGlyphs>): ScrollChip | null;
+export interface OverflowChip {
+    text: string;
+    /** FIXED width, so a number gaining a digit cannot re-wrap the draft. */
+    cells: number;
+}
+/**
+ * Build the "there is more draft above / below this window" indicator, or `null`
+ * when the whole draft is on screen.
+ *
+ * Every glyph comes from `pickGlyphs` and none from a literal (I-5): on a legacy
+ * console this renders `^3 v7` rather than mojibake, and `glyphs.test.ts`'s
+ * static scan fails the build if that rule is broken here.
+ */
+export declare function overflowChip(hiddenAbove: number, hiddenBelow: number, glyphs: ReturnType<typeof pickGlyphs>): OverflowChip | null;
+/**
+ * Would these segments push the draft past a limit? Returns the refusal text, or
+ * `null` when the paste is allowed.
+ *
+ * Checked BEFORE `dispatch`, so a refusal dispatches nothing at all and the draft
+ * is left byte-for-byte unchanged (AC-9). The one-dispatch-per-key rule is
+ * unaffected for the same reason.
+ */
+export declare function draftLimitRefusal(segments: InputSegment[], editor: Pick<EditorState, 'pastes'>): string | null;
+/** Apply an edit intent as a pure buffer/cursor transform. */
+export declare function applyEdit(buffer: string, cursor: number, intent: EditIntent): {
+    buffer: string;
+    cursor: number;
+};
+/**
+ * Move the cursor up/down one line preserving the column. Returns `null` at the
+ * top/bottom edge (or for a single-line buffer) so the caller can fall back to
+ * prompt-history recall.
+ */
+export declare function moveVertical(buffer: string, cursor: number, dir: 'up' | 'down'): {
+    cursor: number;
+} | null;
+/**
+ * Slash-command suggestions when the buffer is a bare `/word` (no space yet).
+ *
+ * The character class covers `-` and `:` as well as `\w` (D16). Skill names are
+ * kebab-case and the namespaced fallback is `/skill:<name>`; with the original
+ * `^\/(\w*)$` a user typing `/my-sk` got NO popup at all — not an error message,
+ * just silence, which reads as "that command does not exist".
+ */
+export declare function slashSuggestions(buffer: string, commands: CommandOption[]): Suggestion[] | null;
+/** The `@file` token under the cursor (`@` + non-space run), if any. */
+export declare function fileTokenAt(buffer: string, cursor: number): {
+    start: number;
+    end: number;
+    query: string;
+} | null;
+export declare function PromptInput({ cols: colsProp, terminalRows: terminalRowsProp, statusExpanded, cursorVisible, onInteraction, isActive, running, history, commands, cwd, theme, caps, popupMaxRows, popupMaxHeight, onPopupRowsChange, onCompletionContextChange, deleteDisambiguated, agentMode, onSubmit, onHelp, onEscape, onEscapeDismiss, reducedMotion, borderColor, onDraftChange, draftClearNonce, draftFill, insertMode, onNotice, }: PromptInputProps): React.ReactElement;
+export {};