@zakmandhro/bunti 0.1.4 → 0.2.0

package/dist/components/Card.js

@@ -0,0 +1,79 @@
+import { adjustBrightness } from '../colors';
+import { visibleWidth } from '../utils';
+import { Box } from './Box';
+/**
+ * Tactical Card Component
+ * A structural container with an integrated header. Colors derive from
+ * ctx.theme tokens:
+ * - default: border `theme.border`, title `theme.muted`
+ * - accent:  border `theme.border`, title `theme.accent`
+ * - danger:  border `theme.danger`, title `theme.danger`
+ *
+ * With an `id`, hovering lifts the border to `theme.focus` and shifts the
+ * background one step. Hover styling reads the hitbox registered on the
+ * previous frame (immediate-mode: geometry is only exact after a render),
+ * which is invisible at interactive frame rates.
+ */
+export function Card(ctx, props, callback) {
+    const { color, theme } = ctx;
+    const variant = props.variant ?? props.theme ?? 'default';
+    let borderColor = theme.border;
+    let titleColor = theme.muted;
+    if (variant === 'accent') {
+        titleColor = theme.accent;
+    }
+    else if (variant === 'danger') {
+        borderColor = theme.danger;
+        titleColor = theme.danger;
+    }
+    // Hover affordance (previous-frame hover state; see docblock).
+    const hoverable = props.id !== undefined;
+    const hovered = hoverable
+        ? (ctx.state.hoverStates.get(props.id) ?? false)
+        : false;
+    let bgColor = props.bgColor;
+    let finalBorder = props.borderColor || borderColor;
+    if (hovered) {
+        finalBorder = theme.focus;
+        const shift = theme.mode === 'dark' ? 12 : -12;
+        bgColor =
+            bgColor !== undefined &&
+                !(typeof bgColor === 'object' && 'colors' in bgColor)
+                ? adjustBrightness(bgColor, shift)
+                : (bgColor ?? theme.surface);
+    }
+    const startY = ctx.cursorY;
+    const rendered = Box(ctx, {
+        x: props.x,
+        y: props.y,
+        anchor: props.anchor,
+        width: props.width || '100%',
+        height: props.height,
+        minHeight: props.minHeight,
+        border: props.border || 'frame',
+        borderColor: finalBorder,
+        padding: props.padding || [1, 2],
+        bgColor,
+    }, (sub) => {
+        if (props.title) {
+            sub.text(color.fg(titleColor, color.bold(`${props.title.toUpperCase()}\n\n`)));
+        }
+        callback(sub);
+    });
+    if (hoverable) {
+        const lines = rendered.split('\n');
+        const h = lines.length;
+        const w = Math.max(0, ...lines.map(visibleWidth));
+        // Mirror resolveBoxArea's placement defaults (centered when unplaced).
+        const area = ctx.resolveLocalRect({
+            x: props.x,
+            y: props.y ?? (startY || undefined),
+            width: w,
+            height: h,
+            anchor: props.anchor,
+        });
+        ctx.hitbox(props.id, area);
+    }
+    return rendered;
+}
+//# sourceMappingURL=Card.js.map

package/dist/components/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../src/components/Card.ts"],"names":[],"mappings":"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"}

package/dist/components/Header.d.ts

@@ -0,0 +1,23 @@
+import type { BuntiContext } from '../dsl';
+/** Props for Header. */
+export interface HeaderProps {
+    /** Centered bar title. */
+    title: string;
+    /** Brand glyph on the left edge (use ctx.icon(name)). */
+    leftIcon?: string;
+    /** Muted telemetry/exit label on the right edge. */
+    rightLabel?: string;
+    /**
+     * @deprecated Colors now derive from `ctx.theme` tokens; wrap the Header
+     * in `ctx.themed(...)` to restyle it. This prop is ignored.
+     */
+    theme?: 'light' | 'dark';
+}
+/**
+ * Enterprise Tactical Header
+ * A full-width, high-signal branding bar. Colors derive from ctx.theme:
+ * bar `theme.surfaceRaised`, title `theme.foreground`, brand icon
+ * `theme.accent`, right label `theme.muted`.
+ */
+export declare function Header(ctx: BuntiContext, props: HeaderProps): void;
+//# sourceMappingURL=Header.d.ts.map

package/dist/components/Header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/components/Header.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAI3C,wBAAwB;AACxB,MAAM,WAAW,WAAW;IAC1B,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oDAAoD;IACpD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC1B;AAED;;;;;GAKG;AACH,wBAAgB,MAAM,CAAC,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,WAAW,QA0D3D"}

package/dist/components/Header.js

@@ -0,0 +1,58 @@
+import { box as engineBox } from '../layout';
+import { Box } from './Box';
+/**
+ * Enterprise Tactical Header
+ * A full-width, high-signal branding bar. Colors derive from ctx.theme:
+ * bar `theme.surfaceRaised`, title `theme.foreground`, brand icon
+ * `theme.accent`, right label `theme.muted`.
+ */
+export function Header(ctx, props) {
+    const { color, joinHorizontal, theme } = ctx;
+    const bg = theme.surfaceRaised;
+    const fg = theme.foreground;
+    // Master Background Box
+    Box(ctx, {
+        anchor: 'top',
+        width: '100%',
+        height: 1,
+        bgColor: bg,
+        border: 'none',
+        padding: [0, 2],
+    }, ({ text, split }) => {
+        const [leftArea, midArea, rightArea] = split({
+            direction: 'horizontal',
+            constraints: [12, '1fr', 12],
+        });
+        // 1. Left: Branding
+        const leftStr = props.leftIcon
+            ? color.fg(theme.accent, props.leftIcon)
+            : '';
+        const leftNode = engineBox(leftStr, {
+            width: leftArea?.width ?? 0,
+            align: 'left',
+            border: 'none',
+            padding: [0, 0],
+        });
+        // 2. Center: Title
+        const midStr = color.fg(fg, color.bold(props.title));
+        const midNode = engineBox(midStr, {
+            width: midArea?.width ?? 0,
+            align: 'center',
+            border: 'none',
+            padding: [0, 0],
+        });
+        // 3. Right: Telemetry / Exit
+        const rightStr = props.rightLabel
+            ? color.fg(theme.muted, props.rightLabel)
+            : '';
+        const rightNode = engineBox(rightStr, {
+            width: rightArea?.width ?? 0,
+            align: 'right',
+            border: 'none',
+            padding: [0, 0],
+        });
+        // Join and push to render pipeline
+        text(joinHorizontal(leftNode, midNode, rightNode));
+    });
+}
+//# sourceMappingURL=Header.js.map

package/dist/components/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../src/components/Header.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,IAAI,SAAS,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAiB5B;;;;;GAKG;AACH,MAAM,UAAU,MAAM,CAAC,GAAiB,EAAE,KAAkB;IAC1D,MAAM,EAAE,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,GAAG,GAAG,CAAC;IAE7C,MAAM,EAAE,GAAG,KAAK,CAAC,aAAa,CAAC;IAC/B,MAAM,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC;IAE5B,wBAAwB;IACxB,GAAG,CACD,GAAG,EACH;QACE,MAAM,EAAE,KAAK;QACb,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,EAAE;QACX,MAAM,EAAE,MAAM;QACd,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;KAChB,EACD,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE;QAClB,MAAM,CAAC,QAAQ,EAAE,OAAO,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC;YAC3C,SAAS,EAAE,YAAY;YACvB,WAAW,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC;SAC7B,CAAC,CAAC;QAEH,oBAAoB;QACpB,MAAM,OAAO,GAAG,KAAK,CAAC,QAAQ;YAC5B,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC;YACxC,CAAC,CAAC,EAAE,CAAC;QACP,MAAM,QAAQ,GAAG,SAAS,CAAC,OAAO,EAAE;YAClC,KAAK,EAAE,QAAQ,EAAE,KAAK,IAAI,CAAC;YAC3B,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;SAChB,CAAC,CAAC;QAEH,mBAAmB;QACnB,MAAM,MAAM,GAAG,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;QACrD,MAAM,OAAO,GAAG,SAAS,CAAC,MAAM,EAAE;YAChC,KAAK,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;YAC1B,KAAK,EAAE,QAAQ;YACf,MAAM,EAAE,MAAM;YACd,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;SAChB,CAAC,CAAC;QAEH,6BAA6B;QAC7B,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU;YAC/B,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC;YACzC,CAAC,CAAC,EAAE,CAAC;QACP,MAAM,SAAS,GAAG,SAAS,CAAC,QAAQ,EAAE;YACpC,KAAK,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;YAC5B,KAAK,EAAE,OAAO;YACd,MAAM,EAAE,MAAM;YACd,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;SAChB,CAAC,CAAC;QAEH,mCAAmC;QACnC,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC;IACrD,CAAC,CACF,CAAC;AACJ,CAAC"}

package/dist/components/Input.d.ts

@@ -0,0 +1,25 @@
+import type { BuntiContext } from '../dsl';
+import type { StyleOptions } from '../layout';
+/** Props for Input. */
+export interface InputProps extends StyleOptions {
+    /** Stable id: keys the value state, focus slot, and hitbox. */
+    id: string;
+    /** Label rendered above the field. */
+    label?: string;
+    /** Ghost text shown while the field is empty. */
+    placeholder?: string;
+    /** Initial value (state lives in useState(id) afterwards). */
+    value?: string;
+    /** 'password' masks every glyph as '*'. */
+    type?: 'text' | 'password';
+    /** Fires with the new value after every edit. */
+    onChange?: (value: string) => void;
+}
+/**
+ * Tactical Input Component
+ * Managed state HOC with a grapheme-aware editing cursor (insert/delete at
+ * cursor, arrows/home/end, ctrl+a/ctrl+e), an inverse-video cursor cell, and
+ * a width-aware horizontal scroll window.
+ */
+export declare function Input(ctx: BuntiContext, props: InputProps): string;
+//# sourceMappingURL=Input.d.ts.map

package/dist/components/Input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/components/Input.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAC3C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAG9C,uBAAuB;AACvB,MAAM,WAAW,UAAW,SAAQ,YAAY;IAC9C,+DAA+D;IAC/D,EAAE,EAAE,MAAM,CAAC;IACX,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iDAAiD;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2CAA2C;IAC3C,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC3B,iDAAiD;IACjD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAyJD;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,UAAU,UAyHzD"}

package/dist/components/Input.js

@@ -0,0 +1,232 @@
+import { charWidth, indentBlock } from '../utils';
+/** Key names that must never insert as text. */
+const NON_TEXT_KEYS = new Set([
+    'up',
+    'down',
+    'left',
+    'right',
+    'enter',
+    'escape',
+    'tab',
+    'backspace',
+    'home',
+    'end',
+    'delete',
+    'pageup',
+    'pagedown',
+    'insert',
+    'click',
+    'wheel_up',
+    'wheel_down',
+]);
+const FN_KEY_RE = /^f\d{1,2}$/;
+function graphemes(text) {
+    if (text.length === 0)
+        return [];
+    const segmenter = new Intl.Segmenter('en', { granularity: 'grapheme' });
+    return Array.from(segmenter.segment(text), ({ segment }) => segment);
+}
+function isTextKey(key) {
+    return key.length > 0 && !NON_TEXT_KEYS.has(key) && !FN_KEY_RE.test(key);
+}
+/**
+ * Applies one frame of KeyEvents to the (value, cursor) pair. Grapheme-aware:
+ * cursor is a grapheme index, insert/delete operate on whole graphemes.
+ * Ctrl/alt combos never insert; ctrl+a/ctrl+e map to home/end (readline).
+ */
+function applyKeys(keys, value, cursor) {
+    let glyphs = graphemes(value);
+    let pos = Math.max(0, Math.min(cursor, glyphs.length));
+    let changed = false;
+    for (const event of keys) {
+        if (event.kind === 'release')
+            continue;
+        if (event.ctrl || event.alt) {
+            // Readline muscle memory; every other modified combo is ignored so
+            // control bytes can never leak into the value.
+            if (event.ctrl && !event.alt && event.key === 'a')
+                pos = 0;
+            if (event.ctrl && !event.alt && event.key === 'e')
+                pos = glyphs.length;
+            continue;
+        }
+        switch (event.key) {
+            case 'left':
+                pos = Math.max(0, pos - 1);
+                break;
+            case 'right':
+                pos = Math.min(glyphs.length, pos + 1);
+                break;
+            case 'home':
+                pos = 0;
+                break;
+            case 'end':
+                pos = glyphs.length;
+                break;
+            case 'backspace':
+                if (pos > 0) {
+                    glyphs = [...glyphs.slice(0, pos - 1), ...glyphs.slice(pos)];
+                    pos--;
+                    changed = true;
+                }
+                break;
+            case 'delete':
+                if (pos < glyphs.length) {
+                    glyphs = [...glyphs.slice(0, pos), ...glyphs.slice(pos + 1)];
+                    changed = true;
+                }
+                break;
+            default:
+                if (isTextKey(event.key)) {
+                    glyphs = [...glyphs.slice(0, pos), event.key, ...glyphs.slice(pos)];
+                    pos++;
+                    changed = true;
+                }
+        }
+    }
+    return { value: glyphs.join(''), cursor: pos, changed };
+}
+/**
+ * Computes the horizontal scroll window that keeps the cursor visible in
+ * `innerW` columns. Width-aware: wide graphemes (emoji) count their real
+ * column width, so the window never overflows the field.
+ */
+function cursorWindow(glyphs, cursor, scrollX, innerW) {
+    const widths = glyphs.map((g) => charWidth(g));
+    const cursorGlyph = cursor < glyphs.length ? glyphs[cursor] : ' ';
+    const cursorW = cursor < glyphs.length ? widths[cursor] : 1;
+    let scroll = Math.max(0, Math.min(scrollX, glyphs.length));
+    if (cursor < scroll)
+        scroll = cursor;
+    const spanWidth = (from) => {
+        let w = 0;
+        for (let i = from; i < cursor; i++)
+            w += widths[i];
+        return w + cursorW;
+    };
+    // Scroll right until the cursor cell fits (tail view when cursor at end).
+    while (scroll < cursor && spanWidth(scroll) > innerW)
+        scroll++;
+    const before = glyphs.slice(scroll, cursor).join('');
+    let used = spanWidth(scroll);
+    let after = '';
+    for (let i = cursor + 1; i < glyphs.length; i++) {
+        if (used + widths[i] > innerW)
+            break;
+        after += glyphs[i];
+        used += widths[i];
+    }
+    return { scroll, before, cursorGlyph, after };
+}
+/**
+ * Tactical Input Component
+ * Managed state HOC with a grapheme-aware editing cursor (insert/delete at
+ * cursor, arrows/home/end, ctrl+a/ctrl+e), an inverse-video cursor cell, and
+ * a width-aware horizontal scroll window.
+ */
+export function Input(ctx, props) {
+    const { box, color, focusable, state, useState, hitbox, resolveLocalRect } = ctx;
+    // 1. Mouse Hit-Testing
+    const contentWidth = 40;
+    const contentHeight = 3;
+    const labelOffset = props.label ? 1 : 0;
+    const area = resolveLocalRect({
+        y: ctx.cursorY + labelOffset,
+        width: props.width ?? contentWidth,
+        height: props.height ?? contentHeight,
+        contentWidth,
+        contentHeight,
+    });
+    const interaction = hitbox(props.id, {
+        x: area.x,
+        y: area.y,
+        width: area.width,
+        height: area.height,
+    });
+    const isHovered = interaction.hovered;
+    // If clicked, force focus state
+    if (interaction.pressed) {
+        state.focusedId = props.id;
+    }
+    // 2. Register in the global focus loop
+    const isSelected = focusable(props.id);
+    // 3. Manage internal state: value + grapheme cursor + scroll window
+    const [value, setValue] = useState(props.id, props.value || '');
+    const [storedCursor, setCursor] = useState(`${props.id}_cursor`, graphemes(value).length);
+    const [scrollX, setScrollX] = useState(`${props.id}_scroll`, 0);
+    // The value can change externally (props/onChange round-trips): re-clamp.
+    let glyphs = graphemes(value);
+    let cursor = Math.max(0, Math.min(storedCursor, glyphs.length));
+    // 4. Keyboard interaction via the KeyEvent frame queue (only when focused)
+    if (isSelected && ctx.keys.length > 0) {
+        const edit = applyKeys(ctx.keys, value, cursor);
+        if (edit.changed) {
+            setValue(edit.value);
+            if (props.onChange)
+                props.onChange(edit.value);
+            glyphs = graphemes(edit.value);
+        }
+        if (edit.cursor !== storedCursor)
+            setCursor(edit.cursor);
+        cursor = edit.cursor;
+    }
+    // 5. Resolve Theme — all colors come from ctx.theme tokens so the field
+    // restyles on live theme swaps.
+    const theme = ctx.theme;
+    const borderCol = isSelected
+        ? theme.focus
+        : isHovered
+            ? theme.muted
+            : theme.border;
+    const labelColor = theme.foreground;
+    const placeholderColor = theme.muted;
+    const textColor = theme.foreground;
+    // Inverse-video cursor cell: swap the field's fg/bg at the cursor.
+    const inverse = (s) => color.bg(theme.foreground, color.fg(theme.surface, s));
+    const displayGlyphs = props.type === 'password' ? glyphs.map(() => '*') : glyphs;
+    // Inner columns between the borders and [0,1] padding.
+    const innerW = Math.max(1, area.width - 4);
+    let fieldValue = '';
+    if (glyphs.length === 0) {
+        const placeholder = props.placeholder
+            ? color.fg(placeholderColor, props.placeholder)
+            : '';
+        // Focused empty field: inverse-space cursor, ghost placeholder after it.
+        fieldValue = isSelected ? inverse(' ') + placeholder : placeholder;
+    }
+    else if (isSelected) {
+        const win = cursorWindow(displayGlyphs, cursor, scrollX, innerW);
+        if (win.scroll !== scrollX)
+            setScrollX(win.scroll);
+        fieldValue =
+            color.fg(textColor, win.before) +
+                inverse(win.cursorGlyph) +
+                color.fg(textColor, win.after);
+    }
+    else {
+        fieldValue = color.fg(textColor, displayGlyphs.join(''));
+    }
+    const field = box({
+        x: area.x,
+        y: area.y,
+        width: area.width,
+        height: area.height,
+        border: 'rounded',
+        borderColor: borderCol,
+        bgColor: theme.surface,
+        padding: [0, 1],
+        align: 'left',
+        valign: 'middle',
+        detach: true,
+    }, ({ text }) => text(fieldValue));
+    if (props.label) {
+        ctx.text(color.fg(labelColor, props.label));
+        ctx.text('\n');
+    }
+    const renderedField = ctx.isRoot ? field : indentBlock(field, area.x);
+    if (!ctx.isRoot) {
+        ctx.text(renderedField);
+    }
+    return renderedField;
+}
+//# sourceMappingURL=Input.js.map

package/dist/components/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../src/components/Input.ts"],"names":[],"mappings":"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"}

package/dist/components/Link.d.ts

@@ -0,0 +1,21 @@
+import { type ColorValue } from '../colors';
+import type { BuntiContext } from '../dsl';
+export interface LinkProps {
+    id: string;
+    label: string;
+    /** Base color (default theme.accent); brightens on hover (mode-aware). */
+    color?: ColorValue;
+    onClick?: () => void;
+    /** Explicit column (default: current flow cursor). */
+    x?: number;
+    /** Explicit row (default: current flow cursor). */
+    y?: number;
+}
+/**
+ * Inline hyperlink: underlined themed text with a pointer-friendly hitbox.
+ * Hover brightens the color one step (mode-aware); clicks fire once per
+ * mouse release via the hitbox harness. Appends to the current flow and
+ * returns the styled string.
+ */
+export declare function Link(ctx: BuntiContext, props: LinkProps): string;
+//# sourceMappingURL=Link.d.ts.map

package/dist/components/Link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,UAAU,EAAM,MAAM,WAAW,CAAC;AAClE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAG3C,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,0EAA0E;IAC1E,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,sDAAsD;IACtD,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,mDAAmD;IACnD,CAAC,CAAC,EAAE,MAAM,CAAC;CACZ;AAED;;;;;GAKG;AACH,wBAAgB,IAAI,CAAC,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,SAAS,GAAG,MAAM,CAuBhE"}

package/dist/components/Link.js

@@ -0,0 +1,29 @@
+import { adjustBrightness, fg } from '../colors';
+import { visibleWidth } from '../utils';
+/**
+ * Inline hyperlink: underlined themed text with a pointer-friendly hitbox.
+ * Hover brightens the color one step (mode-aware); clicks fire once per
+ * mouse release via the hitbox harness. Appends to the current flow and
+ * returns the styled string.
+ */
+export function Link(ctx, props) {
+    const width = visibleWidth(props.label);
+    const x = props.x ?? ctx.cursorX;
+    const y = props.y ?? ctx.cursorY;
+    const interaction = ctx.hitbox(props.id, { x, y, width, height: 1 });
+    if (interaction.clicked)
+        props.onClick?.();
+    const theme = ctx.theme;
+    const base = props.color ?? theme.accent;
+    const shift = theme.mode === 'dark' ? 25 : -25;
+    const colorNow = interaction.hovered ? adjustBrightness(base, shift) : base;
+    // Raw SGR 4/24 (not ctx.color.underline) so underline survives regardless
+    // of the vendor formatter's TTY color gate.
+    const styled = `\x1b[4m${fg(colorNow, props.label)}\x1b[24m`;
+    // When explicitly placed right of the cursor, pad the gap so the flow
+    // lands the label on its hitbox.
+    const pad = props.x !== undefined ? ' '.repeat(Math.max(0, props.x - ctx.cursorX)) : '';
+    ctx.text(pad + styled);
+    return styled;
+}
+//# sourceMappingURL=Link.js.map

package/dist/components/Link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../src/components/Link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAmB,EAAE,EAAE,MAAM,WAAW,CAAC;AAElE,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAcxC;;;;;GAKG;AACH,MAAM,UAAU,IAAI,CAAC,GAAiB,EAAE,KAAgB;IACtD,MAAM,KAAK,GAAG,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC,IAAI,GAAG,CAAC,OAAO,CAAC;IACjC,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC,IAAI,GAAG,CAAC,OAAO,CAAC;IAEjC,MAAM,WAAW,GAAG,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;IACrE,IAAI,WAAW,CAAC,OAAO;QAAE,KAAK,CAAC,OAAO,EAAE,EAAE,CAAC;IAE3C,MAAM,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC;IACxB,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC;IACzC,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/C,MAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAE5E,0EAA0E;IAC1E,4CAA4C;IAC5C,MAAM,MAAM,GAAG,UAAU,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC;IAE7D,sEAAsE;IACtE,iCAAiC;IACjC,MAAM,GAAG,GACP,KAAK,CAAC,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9E,GAAG,CAAC,IAAI,CAAC,GAAG,GAAG,MAAM,CAAC,CAAC;IACvB,OAAO,MAAM,CAAC;AAChB,CAAC"}

package/dist/components/Modal.d.ts

@@ -0,0 +1,38 @@
+import type { BuntiContext } from '../dsl';
+/** Props for Modal. */
+export interface ModalProps {
+    /** Dialog width in cells. */
+    width: number;
+    /** Dialog height in rows. */
+    height: number;
+    /** Border glyph set (default 'double'). */
+    border?: 'default' | 'rounded' | 'double' | 'dashed' | 'dotted' | 'frame' | 'thick-frame' | 'classic' | 'none';
+    /** Border color (default theme.border). */
+    borderColor?: any;
+    /** Surface color (default theme.surfaceRaised). */
+    bgColor?: any;
+    /** Horizontal content alignment (default 'center'). */
+    align?: 'left' | 'center' | 'right';
+    /** Vertical content alignment. */
+    valign?: 'top' | 'middle' | 'bottom';
+    /** [vertical, horizontal] padding inside the border, in cells. */
+    padding?: [number, number];
+    /** Keys the entrance animation when multiple modals coexist. */
+    id?: string;
+    /** Layer z-index the modal composites at (default 100). */
+    zIndex?: number;
+    /** Backdrop dim 0..1 under the modal; `false` or 0 disables (default 0.55). */
+    backdrop?: number | false;
+    /** Drop shadow under the modal surface (default true). */
+    shadow?: boolean;
+    /** 150ms fade + slide-in entrance (default true). */
+    entrance?: boolean;
+}
+/**
+ * Modal dialog: renders on its own layer with a dimmed backdrop and drop
+ * shadow, centered, with a 150ms fade/slide-in entrance. Surface and border
+ * derive from ctx.theme tokens; every visual default can be overridden or
+ * disabled via props.
+ */
+export declare function Modal(ctx: BuntiContext, props: ModalProps, callback: (sub: BuntiContext) => void): string;
+//# sourceMappingURL=Modal.d.ts.map

package/dist/components/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAI3C,uBAAuB;AACvB,MAAM,WAAW,UAAU;IACzB,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,2CAA2C;IAC3C,MAAM,CAAC,EACH,SAAS,GACT,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,aAAa,GACb,SAAS,GACT,MAAM,CAAC;IACX,2CAA2C;IAC3C,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,mDAAmD;IACnD,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,kCAAkC;IAClC,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IACrC,kEAAkE;IAClE,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC3B,gEAAgE;IAChE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2DAA2D;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAC1B,0DAA0D;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAcD;;;;;GAKG;AACH,wBAAgB,KAAK,CACnB,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,CAAC,GAAG,EAAE,YAAY,KAAK,IAAI,GACpC,MAAM,CAmFR"}

package/dist/components/Modal.js

@@ -0,0 +1,87 @@
+import { fade, isThemeColor } from '../colors';
+import { clamp01, easeOutCubic } from '../easing';
+/** Entrance animation length. */
+const ENTRANCE_MS = 150;
+/** A modal unseen for this long counts as closed; reopening replays the entrance. */
+const REOPEN_MS = 250;
+/** Colors the entrance can interpolate (not gradients/styler functions). */
+function fadeable(color) {
+    if (isThemeColor(color))
+        return true;
+    if (typeof color === 'string' || typeof color === 'number')
+        return true;
+    return typeof color === 'object' && color !== null && 'r' in color;
+}
+/**
+ * Modal dialog: renders on its own layer with a dimmed backdrop and drop
+ * shadow, centered, with a 150ms fade/slide-in entrance. Surface and border
+ * derive from ctx.theme tokens; every visual default can be overridden or
+ * disabled via props.
+ */
+export function Modal(ctx, props, callback) {
+    const theme = ctx.theme;
+    const backdrop = props.backdrop === false ? 0 : (props.backdrop ?? 0.55);
+    const shadow = props.shadow ?? true;
+    // Entrance progress, keyed per modal id in componentState. `lastSeen`
+    // tracks presence so a reopened modal (absent > REOPEN_MS) replays the
+    // entrance instead of reusing its stale open timestamp.
+    let progress = 1;
+    if (props.entrance !== false) {
+        const key = `__modal_entrance:${props.id ?? 'modal'}`;
+        const now = Date.now();
+        const record = ctx.state.componentState.get(key);
+        if (!record || now - record.lastSeen > REOPEN_MS) {
+            ctx.state.componentState.set(key, { openedAt: now, lastSeen: now });
+            progress = 0;
+        }
+        else {
+            record.lastSeen = now;
+            progress = clamp01((now - record.openedAt) / ENTRANCE_MS);
+        }
+    }
+    const eased = easeOutCubic(progress);
+    let rendered = '';
+    ctx.layer({
+        zIndex: props.zIndex ?? 100,
+        backdrop: backdrop > 0 ? backdrop : undefined,
+        shadow,
+    }, (overlay) => {
+        const modalW = props.width;
+        const modalH = props.height;
+        // Slide: enter from 1 row above the resting position.
+        const slide = Math.round(1 - eased);
+        const localX = Math.max(0, Math.floor((overlay.width - modalW) / 2));
+        const localY = Math.max(0, Math.floor((overlay.height - modalH) / 2) - slide);
+        const x = overlay.offsetX + localX;
+        const y = overlay.offsetY + localY;
+        // Fade: surface bg and border sweep from the screen background color
+        // to their final colors over the entrance.
+        const targetBg = props.bgColor ?? theme.surfaceRaised;
+        const surfaceBg = eased < 1 && fadeable(targetBg)
+            ? fade(theme.background.rgb, targetBg, eased)
+            : targetBg;
+        const targetBorder = props.borderColor ?? theme.border;
+        const borderColor = eased < 1 && fadeable(targetBorder)
+            ? fade(theme.background.rgb, targetBorder, eased)
+            : targetBorder;
+        // 1. Solid background rect: the raised-surface plate the dialog
+        // floats on (guarantees full coverage under sparse content).
+        overlay.rect(x, y, modalW, modalH, { char: ' ', bg: surfaceBg });
+        // 2. The box enclosing the modal content.
+        rendered = overlay.box({
+            x: localX,
+            y: localY,
+            width: modalW,
+            height: modalH,
+            border: props.border ?? 'double',
+            borderColor,
+            // Content fallback fg: explicit ANSI styling in content still wins.
+            color: theme.foreground,
+            align: props.align ?? 'center',
+            valign: props.valign,
+            padding: props.padding,
+        }, callback);
+    });
+    return rendered;
+}
+//# sourceMappingURL=Modal.js.map