@promptctl/rich-js 0.18.0 → 0.18.1

package/dist/widgets/checkbox.js

@@ -0,0 +1,157 @@
+/**
+ * Checkbox widget — boolean toggle with label.
+ * [LAW:dataflow-not-control-flow] one Segment of fixed width every render;
+ * the indicator character and style come from observable state.
+ * [LAW:one-type-per-behavior] shared widget infrastructure lives on WidgetBase.
+ *
+ * Visual states:
+ *   unchecked — "[ ] label"
+ *   checked   — "[✓] label"  (ASCII fallback "[x] label" when options.asciiOnly)
+ *   focused   — underline on the rendered segment (no width change)
+ *   disabled  — dimmed
+ */
+var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
+    var useValue = arguments.length > 2;
+    for (var i = 0; i < initializers.length; i++) {
+        value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
+    }
+    return useValue ? value : void 0;
+};
+var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
+    function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
+    var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
+    var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
+    var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
+    var _, done = false;
+    for (var i = decorators.length - 1; i >= 0; i--) {
+        var context = {};
+        for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
+        for (var p in contextIn.access) context.access[p] = contextIn.access[p];
+        context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
+        var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
+        if (kind === "accessor") {
+            if (result === void 0) continue;
+            if (result === null || typeof result !== "object") throw new TypeError("Object expected");
+            if (_ = accept(result.get)) descriptor.get = _;
+            if (_ = accept(result.set)) descriptor.set = _;
+            if (_ = accept(result.init)) initializers.unshift(_);
+        }
+        else if (_ = accept(result)) {
+            if (kind === "field") initializers.unshift(_);
+            else descriptor[key] = _;
+        }
+    }
+    if (target) Object.defineProperty(target, contextIn.name, descriptor);
+    done = true;
+};
+import { observable, action, observableRef } from "mobx";
+import { Segment } from "../core/segment.js";
+import { Style } from "../core/style.js";
+import { ColorSpec } from "../core/color.js";
+import { cellLen } from "../core/cells.js";
+import { DEFAULT_TERMINAL_THEME } from "../themes/terminalThemes.js";
+import { drawable } from "../core/protocol.js";
+import { WidgetBase } from "./widget-base.js";
+let Checkbox = (() => {
+    let _classSuper = WidgetBase;
+    let _instanceExtraInitializers = [];
+    let _label_decorators;
+    let _label_initializers = [];
+    let _label_extraInitializers = [];
+    let _checked_decorators;
+    let _checked_initializers = [];
+    let _checked_extraInitializers = [];
+    let __theme_decorators;
+    let __theme_initializers = [];
+    let __theme_extraInitializers = [];
+    let _setTheme_decorators;
+    let _handleKey_decorators;
+    let _handleMouse_decorators;
+    return class Checkbox extends _classSuper {
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _label_decorators = [observable];
+            _checked_decorators = [observable];
+            __theme_decorators = [observableRef];
+            _setTheme_decorators = [action];
+            _handleKey_decorators = [action];
+            _handleMouse_decorators = [action];
+            __esDecorate(this, null, _label_decorators, { kind: "accessor", name: "label", static: false, private: false, access: { has: obj => "label" in obj, get: obj => obj.label, set: (obj, value) => { obj.label = value; } }, metadata: _metadata }, _label_initializers, _label_extraInitializers);
+            __esDecorate(this, null, _checked_decorators, { kind: "accessor", name: "checked", static: false, private: false, access: { has: obj => "checked" in obj, get: obj => obj.checked, set: (obj, value) => { obj.checked = value; } }, metadata: _metadata }, _checked_initializers, _checked_extraInitializers);
+            __esDecorate(this, null, __theme_decorators, { kind: "accessor", name: "_theme", static: false, private: false, access: { has: obj => "_theme" in obj, get: obj => obj._theme, set: (obj, value) => { obj._theme = value; } }, metadata: _metadata }, __theme_initializers, __theme_extraInitializers);
+            __esDecorate(this, null, _setTheme_decorators, { kind: "method", name: "setTheme", static: false, private: false, access: { has: obj => "setTheme" in obj, get: obj => obj.setTheme }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _handleKey_decorators, { kind: "method", name: "handleKey", static: false, private: false, access: { has: obj => "handleKey" in obj, get: obj => obj.handleKey }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _handleMouse_decorators, { kind: "method", name: "handleMouse", static: false, private: false, access: { has: obj => "handleMouse" in obj, get: obj => obj.handleMouse }, metadata: _metadata }, null, _instanceExtraInitializers);
+            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        id = __runInitializers(this, _instanceExtraInitializers);
+        focusable = true;
+        #label_accessor_storage = __runInitializers(this, _label_initializers, void 0);
+        get label() { return this.#label_accessor_storage; }
+        set label(value) { this.#label_accessor_storage = value; }
+        #checked_accessor_storage = (__runInitializers(this, _label_extraInitializers), __runInitializers(this, _checked_initializers, void 0));
+        get checked() { return this.#checked_accessor_storage; }
+        set checked(value) { this.#checked_accessor_storage = value; }
+        #_theme_accessor_storage = (__runInitializers(this, _checked_extraInitializers), __runInitializers(this, __theme_initializers, void 0));
+        // [LAW:types-are-the-program] @observableRef so setTheme() triggers a
+        // re-render — see slider.ts.
+        get _theme() { return this.#_theme_accessor_storage; }
+        set _theme(value) { this.#_theme_accessor_storage = value; }
+        constructor(options) {
+            super();
+            __runInitializers(this, __theme_extraInitializers);
+            this.id = options.id ?? `checkbox-${options.label.toLowerCase().replace(/\s+/g, "-")}`;
+            this.label = options.label;
+            this.checked = options.checked ?? false;
+            this.disabled = options.disabled ?? false;
+            this._theme = options.theme ?? DEFAULT_TERMINAL_THEME;
+        }
+        setTheme(theme) { this._theme = theme; }
+        // --- Event handlers ---
+        handleKey(event) {
+            if (this.disabled)
+                return;
+            if (event.key === "space") {
+                this.checked = !this.checked;
+                this.emitChange();
+                event.stop();
+                return;
+            }
+            if (event.key === "enter") {
+                this.emitSubmit();
+                event.stop();
+            }
+        }
+        handleMouse(event) {
+            if (this.disabled)
+                return;
+            // A release that dragged off the checkbox cancels the press.
+            if (event.type === "mouse_up" && event.over) {
+                this.checked = !this.checked;
+                this.emitChange();
+            }
+        }
+        // --- Rendering ---
+        draw(options) {
+            const indicator = this.checked ? drawable(options, "✓", "x") : " ";
+            const text = `[${indicator}] ${this.label}`;
+            if (this.disabled) {
+                return [new Segment(text, new Style({ color: "#666666", bgcolor: "#333333", dim: true }))];
+            }
+            const fg = this.checked ? this.resolvePalette("primary") : this.resolvePalette("foreground");
+            return [new Segment(text, new Style({ color: fg, underline: this.focused }))];
+        }
+        measure(_options) {
+            // [LAW:one-source-of-truth] cellLen — see button.ts.
+            const width = cellLen(this.label) + 4;
+            return { minimum: width, maximum: width };
+        }
+        // --- Palette resolution ---
+        resolvePalette(key) {
+            const rgba = this._theme.palette.get(key);
+            // [LAW:no-defensive-null-guards] palette must contain all keys; missing is a construction bug.
+            return ColorSpec.fromRgba(rgba);
+        }
+    };
+})();
+export { Checkbox };

package/dist/widgets/dropdown.d.ts

@@ -0,0 +1,67 @@
+/**
+ * Dropdown widget — single-select from option list, with built-in filter.
+ *
+ * [LAW:one-source-of-truth] Inline footprint (always 1 row, the header)
+ * is independent of rendered shape (1 row collapsed, 1 + M rows expanded
+ * where M = filteredOptions.length, or 1 when no matches). render() emits
+ * the header row only; renderOverlay() emits option rows or a
+ * "(no matches)" placeholder.
+ *
+ * [LAW:dataflow-not-control-flow] `expanded` and `filter` are data;
+ * layout never reserves space for the option list; the overlay pass
+ * paints over whatever is below.
+ *
+ * [LAW:one-source-of-truth] `options` and `selectedIndex` are canonical.
+ * `filter` is internal view state. `filteredOptions` is the derived
+ * subsequence (case-insensitive substring match). `highlightedIndex`
+ * indexes into `filteredOptions`. Commit maps the filtered position
+ * back to canonical idx by reference, so selection survives any filter
+ * mutation.
+ *
+ * Width invariant: measure() always returns maxLabelLen(options) + 4
+ * regardless of filter state — the query is right-clipped, never wider
+ * than the header. See docs/widgets.md → Dropdown.
+ */
+import { Segment } from "../core/segment.js";
+import { type RenderOptions } from "../core/protocol.js";
+import type { TerminalTheme } from "../core/color.js";
+import { WidgetBase } from "./widget-base.js";
+import type { KeyEvent, WidgetMouseEvent, WidgetFocusEvent, OverlayRenderable } from "./types.js";
+export interface DropdownOptions {
+    options: string[];
+    selectedIndex?: number;
+    id?: string;
+    disabled?: boolean;
+    theme?: TerminalTheme;
+}
+export declare class Dropdown extends WidgetBase implements OverlayRenderable {
+    readonly id: string;
+    readonly focusable = true;
+    accessor options: string[];
+    accessor selectedIndex: number;
+    accessor expanded: boolean;
+    accessor highlightedIndex: number;
+    accessor filter: string;
+    get filteredOptions(): {
+        label: string;
+        idx: number;
+    }[];
+    private accessor _theme;
+    constructor(options: DropdownOptions);
+    private clampIndex;
+    setTheme(theme: TerminalTheme): void;
+    handleKey(event: KeyEvent): void;
+    handleMouse(event: WidgetMouseEvent): void;
+    handleFocus(event: WidgetFocusEvent): void;
+    protected draw(options: RenderOptions): Iterable<Segment>;
+    private headerText;
+    renderOverlay(_options: RenderOptions): Iterable<Segment> | null;
+    private renderNoMatchRow;
+    private renderOptionRow;
+    private maxLabelLen;
+    measure(_options: RenderOptions): {
+        minimum: number;
+        maximum: number;
+    };
+    private resolvePalette;
+}