@dexto/tui 1.15.0-beta.0 → 1.15.0-beta.1

package/dist/components/CustomInput.cjs

@@ -23,6 +23,7 @@ __export(CustomInput_exports, {
 module.exports = __toCommonJS(CustomInput_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_ink = require("ink");
+var import_signal = require("../signal/index.js");
 function CustomInput({
   value,
   onChange,
@@ -66,12 +67,12 @@ function CustomInput({
     const firstChar = placeholder[0] || " ";
     const rest = placeholder.slice(1);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "black", backgroundColor: "green", children: firstChar }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: rest })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("bg"), backgroundColor: (0, import_signal.tone)("add"), children: firstChar }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: rest })
     ] });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { children: [
     value,
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "black", backgroundColor: "green", children: " " })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("bg"), backgroundColor: (0, import_signal.tone)("add"), children: " " })
   ] });
 }

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

@@ -1 +1 @@
-{"version":3,"file":"CustomInput.d.ts","sourceRoot":"","sources":["../../src/components/CustomInput.tsx"],"names":[],"mappings":"AAEA,UAAU,gBAAgB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,YAAoB,EACpB,YAAY,EACZ,YAAY,EACZ,iBAAiB,GACpB,EAAE,gBAAgB,2CAoElB"}
+{"version":3,"file":"CustomInput.d.ts","sourceRoot":"","sources":["../../src/components/CustomInput.tsx"],"names":[],"mappings":"AAGA,UAAU,gBAAgB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,YAAoB,EACpB,YAAY,EACZ,YAAY,EACZ,iBAAiB,GACpB,EAAE,gBAAgB,2CAoElB"}

package/dist/components/CustomInput.js

@@ -1,5 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useInput, Text } from "ink";
+import { tone } from "../signal/index.js";
 function CustomInput({
   value,
   onChange,
@@ -43,13 +44,13 @@ function CustomInput({
     const firstChar = placeholder[0] || " ";
     const rest = placeholder.slice(1);
     return /* @__PURE__ */ jsxs(Text, { children: [
-      /* @__PURE__ */ jsx(Text, { color: "black", backgroundColor: "green", children: firstChar }),
-      /* @__PURE__ */ jsx(Text, { color: "gray", children: rest })
+      /* @__PURE__ */ jsx(Text, { color: tone("bg"), backgroundColor: tone("add"), children: firstChar }),
+      /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: rest })
     ] });
   }
   return /* @__PURE__ */ jsxs(Text, { children: [
     value,
-    /* @__PURE__ */ jsx(Text, { color: "black", backgroundColor: "green", children: " " })
+    /* @__PURE__ */ jsx(Text, { color: tone("bg"), backgroundColor: tone("add"), children: " " })
   ] });
 }
 export {

package/dist/components/DeckArea.cjs

@@ -0,0 +1,43 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var DeckArea_exports = {};
+__export(DeckArea_exports, {
+  DeckArea: () => DeckArea
+});
+module.exports = __toCommonJS(DeckArea_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_signal = require("../signal/index.js");
+var import_useDeckState = require("../hooks/useDeckState.js");
+var import_deck_state = require("../utils/deck-state.js");
+function DeckArea({ children, ...input }) {
+  const state = (0, import_useDeckState.useDeckState)(input);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_signal.Deck,
+    {
+      state,
+      collapsed: (0, import_deck_state.deckCollapsed)(input.ui.activeOverlay),
+      paused: input.ui.copyModeEnabled,
+      children
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DeckArea
+});

package/dist/components/DeckArea.d.ts

@@ -0,0 +1,14 @@
+/**
+ * The Signal deck wired to the CLI: the band (wordmark, trace, status) above the input.
+ * Mounted only on the Signal palette, so the legacy screens don't pay for its git and credit
+ * lookups. Focused overlays budget for the whole screen, so the band collapses under them
+ * while the Deck stays mounted, which keeps the input in place in the tree. It stays up during
+ * an approval, where its mode says the agent is waiting.
+ */
+import type { ReactNode } from 'react';
+import { type DeckStateInput } from '../hooks/useDeckState.js';
+export interface DeckAreaProps extends DeckStateInput {
+    children: ReactNode;
+}
+export declare function DeckArea({ children, ...input }: DeckAreaProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DeckArea.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DeckArea.d.ts","sourceRoot":"","sources":["../../src/components/DeckArea.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAgB,KAAK,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAG7E,MAAM,WAAW,aAAc,SAAQ,cAAc;IACjD,QAAQ,EAAE,SAAS,CAAC;CACvB;AAED,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAW7D"}

package/dist/components/DeckArea.js

@@ -0,0 +1,19 @@
+import { jsx } from "react/jsx-runtime";
+import { Deck } from "../signal/index.js";
+import { useDeckState } from "../hooks/useDeckState.js";
+import { deckCollapsed } from "../utils/deck-state.js";
+function DeckArea({ children, ...input }) {
+  const state = useDeckState(input);
+  return /* @__PURE__ */ jsx(
+    Deck,
+    {
+      state,
+      collapsed: deckCollapsed(input.ui.activeOverlay),
+      paused: input.ui.copyModeEnabled,
+      children
+    }
+  );
+}
+export {
+  DeckArea
+};

package/dist/components/EditableMultiLineInput.cjs

@@ -24,6 +24,7 @@ module.exports = __toCommonJS(EditableMultiLineInput_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_ink = require("ink");
+var import_signal = require("../signal/index.js");
 function EditableMultiLineInput({
   value,
   onChange,
@@ -117,7 +118,7 @@ function EditableMultiLineInput({
     const prefix = lineIdx === 0 ? "\xBB " : "  ";
     if (cursorCol < 0) {
       return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "cyan", children: prefix }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("teal"), children: prefix }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: line || " " })
       ] }, lineIdx);
     }
@@ -125,27 +126,27 @@ function EditableMultiLineInput({
     const atCursor = line.charAt(cursorCol) || " ";
     const after = line.slice(cursorCol + 1);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "cyan", children: prefix }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("teal"), children: prefix }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: before }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { backgroundColor: "green", color: "black", children: atCursor }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { backgroundColor: (0, import_signal.tone)("add"), color: (0, import_signal.tone)("bg"), children: atCursor }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: after })
     ] }, lineIdx);
   };
   if (!value && placeholder) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "cyan", children: "\xBB " }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { backgroundColor: "green", color: "black", children: " " }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "gray", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("teal"), children: "\xBB " }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { backgroundColor: (0, import_signal.tone)("add"), color: (0, import_signal.tone)("bg"), children: " " }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: [
           " ",
           placeholder
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
     ] });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
     lines.map((line, idx) => renderLine(line, idx)),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
   ] });
 }

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

@@ -1 +1 @@
-{"version":3,"file":"EditableMultiLineInput.d.ts","sourceRoot":"","sources":["../../src/components/EditableMultiLineInput.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAKH,UAAU,2BAA2B;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAC,EAC3C,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,YAAoB,EACpB,kBAAkB,GACrB,EAAE,2BAA2B,2CAoK7B"}
+{"version":3,"file":"EditableMultiLineInput.d.ts","sourceRoot":"","sources":["../../src/components/EditableMultiLineInput.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAMH,UAAU,2BAA2B;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAC,EAC3C,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,YAAoB,EACpB,kBAAkB,GACrB,EAAE,2BAA2B,2CAoK7B"}

package/dist/components/EditableMultiLineInput.js

@@ -1,6 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useMemo } from "react";
 import { Box, Text, useInput } from "ink";
+import { tone } from "../signal/index.js";
 function EditableMultiLineInput({
   value,
   onChange,
@@ -94,7 +95,7 @@ function EditableMultiLineInput({
     const prefix = lineIdx === 0 ? "\xBB " : "  ";
     if (cursorCol < 0) {
       return /* @__PURE__ */ jsxs(Text, { children: [
-        /* @__PURE__ */ jsx(Text, { color: "cyan", children: prefix }),
+        /* @__PURE__ */ jsx(Text, { color: tone("teal"), children: prefix }),
         /* @__PURE__ */ jsx(Text, { children: line || " " })
       ] }, lineIdx);
     }
@@ -102,28 +103,28 @@ function EditableMultiLineInput({
     const atCursor = line.charAt(cursorCol) || " ";
     const after = line.slice(cursorCol + 1);
     return /* @__PURE__ */ jsxs(Text, { children: [
-      /* @__PURE__ */ jsx(Text, { color: "cyan", children: prefix }),
+      /* @__PURE__ */ jsx(Text, { color: tone("teal"), children: prefix }),
       /* @__PURE__ */ jsx(Text, { children: before }),
-      /* @__PURE__ */ jsx(Text, { backgroundColor: "green", color: "black", children: atCursor }),
+      /* @__PURE__ */ jsx(Text, { backgroundColor: tone("add"), color: tone("bg"), children: atCursor }),
       /* @__PURE__ */ jsx(Text, { children: after })
     ] }, lineIdx);
   };
   if (!value && placeholder) {
     return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
       /* @__PURE__ */ jsxs(Text, { children: [
-        /* @__PURE__ */ jsx(Text, { color: "cyan", children: "\xBB " }),
-        /* @__PURE__ */ jsx(Text, { backgroundColor: "green", color: "black", children: " " }),
-        /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+        /* @__PURE__ */ jsx(Text, { color: tone("teal"), children: "\xBB " }),
+        /* @__PURE__ */ jsx(Text, { backgroundColor: tone("add"), color: tone("bg"), children: " " }),
+        /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
           " ",
           placeholder
         ] })
       ] }),
-      /* @__PURE__ */ jsx(Text, { color: "gray", children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
+      /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
     ] });
   }
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
     lines.map((line, idx) => renderLine(line, idx)),
-    /* @__PURE__ */ jsx(Text, { color: "gray", children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
+    /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Multi-line mode \u2022 Cmd/Ctrl+Enter to submit \u2022 Shift+Enter for single-line" })
   ] });
 }
 export {

package/dist/components/ElicitationForm.cjs

@@ -37,6 +37,7 @@ var import_ink = require("ink");
 var import_wrap_ansi = __toESM(require("wrap-ansi"), 1);
 var import_useTerminalSize = require("../hooks/useTerminalSize.js");
 var import_elicitationSchema = require("../utils/elicitationSchema.js");
+var import_signal = require("../signal/index.js");
 function hasOwn(obj, key) {
   return Object.prototype.hasOwnProperty.call(obj, key);
 }
@@ -71,7 +72,9 @@ const ElicitationForm = (0, import_react.forwardRef)(
       const desired = Math.max(minViewportHeight, Math.floor(terminalRows * 0.6));
       return Math.min(maxHeight, desired);
     }, [footerHeight, maxHeaderHeight, minContentHeight, terminalRows]);
-    const availableWidth = Math.max(20, terminalColumns - 2);
+    const { palette, glyphs } = (0, import_signal.useCaps)();
+    const signal = palette === "signal";
+    const availableWidth = Math.max(20, terminalColumns - (signal ? 6 : 2));
     const fields = (0, import_react.useMemo)(() => {
       return (0, import_elicitationSchema.parseElicitationSchema)(metadata.schema);
     }, [metadata.schema]);
@@ -348,6 +351,10 @@ const ElicitationForm = (0, import_react.forwardRef)(
                 }
                 return true;
               }
+              if (signal && /^[1-9]$/.test(input) && Number(input) <= values.length) {
+                setEnumIndex(Number(input) - 1);
+                return true;
+              }
               break;
             }
             case "array-enum": {
@@ -439,6 +446,7 @@ const ElicitationForm = (0, import_react.forwardRef)(
         }
       }),
       [
+        signal,
         activeField,
         activeFieldIndex,
         arraySelections,
@@ -460,7 +468,7 @@ const ElicitationForm = (0, import_react.forwardRef)(
       ]
     );
     if (fields.length === 0) {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "red", children: "Invalid form schema" }) });
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("red"), children: "Invalid form schema" }) });
     }
     const isAnswered = (field) => {
       if (field.type === "boolean") return hasOwn(formData, field.name);
@@ -475,7 +483,7 @@ const ElicitationForm = (0, import_react.forwardRef)(
       return value2 !== void 0 && value2 !== null && value2 !== "";
     };
     if (!isReviewing && !activeField) {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "red", children: "Invalid form state" }) });
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("red"), children: "Invalid form state" }) });
     }
     const value = activeField ? formData[activeField.name] : void 0;
     const currentInput = activeField && hasOwn(draftInputs, activeField.name) ? draftInputs[activeField.name] ?? "" : value === void 0 || value === null ? "" : String(value);
@@ -488,7 +496,7 @@ const ElicitationForm = (0, import_react.forwardRef)(
             overflowY: "scroll",
             overflowX: "hidden",
             scrollTop: reviewScrollTop,
-            scrollbarThumbColor: "gray",
+            scrollbarThumbColor: (0, import_signal.tone)("dim"),
             flexDirection: "column",
             height: contentHeight,
             paddingRight: 1,
@@ -502,10 +510,10 @@ const ElicitationForm = (0, import_react.forwardRef)(
       }
       if (!activeField) return null;
       if (activeField.type === "string" || activeField.type === "number") {
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { height: contentHeight, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { wrap: "truncate-end", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "cyan", children: "> " }),
-          currentInput || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "Type your answer\u2026" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "cyan", children: "\u258B" })
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { height: signal ? 1 : contentHeight, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { wrap: "truncate-end", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("teal"), children: "> " }),
+          currentInput || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "Type your answer\u2026" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("teal"), children: "\u258B" })
         ] }) });
       }
       const options = [];
@@ -550,18 +558,37 @@ const ElicitationForm = (0, import_react.forwardRef)(
         {
           overflowY: "scroll",
           overflowX: "hidden",
-          scrollbarThumbColor: "gray",
-          height: contentHeight,
+          scrollbarThumbColor: (0, import_signal.tone)("dim"),
+          height: signal ? Math.min(contentHeight, options.length) : contentHeight,
           scrollTop: targetScrollTop,
           flexDirection: "column",
           paddingRight: 1,
-          children: options.map((opt) => {
+          children: options.map((opt, index) => {
+            if (signal) {
+              const check = activeField.type === "array-enum" ? opt.isSelected ? "[\u2713] " : "[ ] " : "";
+              return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+                import_ink.Text,
+                {
+                  bold: opt.isFocused,
+                  color: (0, import_signal.tone)(opt.isFocused ? "hi" : "fg"),
+                  ...opt.isFocused && { backgroundColor: (0, import_signal.tone)("sel") },
+                  wrap: "truncate-end",
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { bold: true, color: (0, import_signal.tone)("amber"), children: opt.isFocused ? (0, import_signal.glyphText)("\u203A ", glyphs) : "  " }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { bold: true, color: (0, import_signal.tone)(opt.isFocused ? "amber" : "dim"), children: activeField.type === "enum" && index < 9 ? `${index + 1}  ` : "" }),
+                    (0, import_signal.glyphText)(check, glyphs),
+                    opt.label
+                  ]
+                },
+                opt.key
+              );
+            }
             const prefix = opt.isFocused ? "\u25B6 " : "  ";
             const mark = activeField.type === "array-enum" ? opt.isSelected ? "[\u2713] " : "[ ] " : "";
             return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
               import_ink.Text,
               {
-                color: opt.isFocused ? "cyan" : "gray",
+                color: opt.isFocused ? (0, import_signal.tone)("teal") : (0, import_signal.tone)("dim"),
                 wrap: "truncate-end",
                 children: [
                   prefix,
@@ -603,15 +630,48 @@ const ElicitationForm = (0, import_react.forwardRef)(
     const questionLines = wrapClampedLines(questionText, questionLineCount);
     const helpLines = wrapClampedLines(helpText, helpLineCount);
     const errorLines = wrapClampedLines(errorLineText, errorLineCount);
+    if (signal) {
+      const position = fields.length > 1 ? ` \xB7 ${activeFieldIndex + 1} of ${fields.length}` : "";
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        import_signal.GateFrame,
+        {
+          title: isReviewing ? "QUESTION \xB7 Review your answers" : `QUESTION${position} \xB7 ${questionLines.filter(Boolean).join(" ")}`,
+          hint: hintLine.replaceAll(" \u2022 ", " \xB7 "),
+          children: [
+            helpLines.filter(Boolean).map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), wrap: "truncate-end", children: line }, `help-${index}`)),
+            errorLines.filter(Boolean).map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("red"), wrap: "truncate-end", children: line }, `error-${index}`)),
+            renderContent()
+          ]
+        }
+      );
+    }
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", paddingX: 0, height: viewportHeight, children: [
-      headerLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "yellowBright", bold: true, wrap: "truncate-end", children: line || " " }, `header-${index}`)),
-      !isReviewing && stepLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", dimColor: true, wrap: "truncate-end", children: line || " " }, `step-${index}`)),
+      headerLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("amber"), bold: true, wrap: "truncate-end", children: line || " " }, `header-${index}`)),
+      !isReviewing && stepLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_ink.Text,
+        {
+          color: (0, import_signal.tone)("dim"),
+          dimColor: true,
+          wrap: "truncate-end",
+          children: line || " "
+        },
+        `step-${index}`
+      )),
       Array.from({ length: spacerAfterStepLineCount }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { wrap: "truncate-end", children: " " }, `spacer-step-${index}`)),
-      !isReviewing && questionLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "white", bold: true, wrap: "truncate-end", children: line || " " }, `question-${index}`)),
-      !isReviewing && helpLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", dimColor: true, wrap: "truncate-end", children: line || " " }, `help-${index}`)),
-      !isReviewing && errorLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "red", wrap: "truncate-end", children: line || " " }, `error-${index}`)),
+      !isReviewing && questionLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("hi"), bold: true, wrap: "truncate-end", children: line || " " }, `question-${index}`)),
+      !isReviewing && helpLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_ink.Text,
+        {
+          color: (0, import_signal.tone)("dim"),
+          dimColor: true,
+          wrap: "truncate-end",
+          children: line || " "
+        },
+        `help-${index}`
+      )),
+      !isReviewing && errorLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("red"), wrap: "truncate-end", children: line || " " }, `error-${index}`)),
       renderContent(),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", dimColor: true, wrap: "truncate-end", children: hintLine })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), dimColor: true, wrap: "truncate-end", children: hintLine })
     ] });
   }
 );

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

@@ -1 +1 @@
-{"version":3,"file":"ElicitationForm.d.ts","sourceRoot":"","sources":["../../src/components/ElicitationForm.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAA0E,MAAM,OAAO,CAAC;AAG/F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,kCAAkC,CAAC;AAI5D,MAAM,WAAW,qBAAqB;IAClC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC;CACrD;AAED,UAAU,oBAAoB;IAC1B,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IACtD,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAkBD;;GAEG;AACH,eAAO,MAAM,eAAe,oGA6uB3B,CAAC"}
+{"version":3,"file":"ElicitationForm.d.ts","sourceRoot":"","sources":["../../src/components/ElicitationForm.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAA0E,MAAM,OAAO,CAAC;AAG/F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,kCAAkC,CAAC;AAK5D,MAAM,WAAW,qBAAqB;IAClC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC;CACrD;AAED,UAAU,oBAAoB;IAC1B,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IACtD,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAkBD;;GAEG;AACH,eAAO,MAAM,eAAe,oGAuzB3B,CAAC"}

package/dist/components/ElicitationForm.js

@@ -4,6 +4,7 @@ import { Box, Text } from "ink";
 import wrapAnsi from "wrap-ansi";
 import { useTerminalSize } from "../hooks/useTerminalSize.js";
 import { parseElicitationSchema } from "../utils/elicitationSchema.js";
+import { GateFrame, glyphText, tone, useCaps } from "../signal/index.js";
 function hasOwn(obj, key) {
   return Object.prototype.hasOwnProperty.call(obj, key);
 }
@@ -38,7 +39,9 @@ const ElicitationForm = forwardRef(
       const desired = Math.max(minViewportHeight, Math.floor(terminalRows * 0.6));
       return Math.min(maxHeight, desired);
     }, [footerHeight, maxHeaderHeight, minContentHeight, terminalRows]);
-    const availableWidth = Math.max(20, terminalColumns - 2);
+    const { palette, glyphs } = useCaps();
+    const signal = palette === "signal";
+    const availableWidth = Math.max(20, terminalColumns - (signal ? 6 : 2));
     const fields = useMemo(() => {
       return parseElicitationSchema(metadata.schema);
     }, [metadata.schema]);
@@ -315,6 +318,10 @@ const ElicitationForm = forwardRef(
                 }
                 return true;
               }
+              if (signal && /^[1-9]$/.test(input) && Number(input) <= values.length) {
+                setEnumIndex(Number(input) - 1);
+                return true;
+              }
               break;
             }
             case "array-enum": {
@@ -406,6 +413,7 @@ const ElicitationForm = forwardRef(
         }
       }),
       [
+        signal,
         activeField,
         activeFieldIndex,
         arraySelections,
@@ -427,7 +435,7 @@ const ElicitationForm = forwardRef(
       ]
     );
     if (fields.length === 0) {
-      return /* @__PURE__ */ jsx(Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ jsx(Text, { color: "red", children: "Invalid form schema" }) });
+      return /* @__PURE__ */ jsx(Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("red"), children: "Invalid form schema" }) });
     }
     const isAnswered = (field) => {
       if (field.type === "boolean") return hasOwn(formData, field.name);
@@ -442,7 +450,7 @@ const ElicitationForm = forwardRef(
       return value2 !== void 0 && value2 !== null && value2 !== "";
     };
     if (!isReviewing && !activeField) {
-      return /* @__PURE__ */ jsx(Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ jsx(Text, { color: "red", children: "Invalid form state" }) });
+      return /* @__PURE__ */ jsx(Box, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("red"), children: "Invalid form state" }) });
     }
     const value = activeField ? formData[activeField.name] : void 0;
     const currentInput = activeField && hasOwn(draftInputs, activeField.name) ? draftInputs[activeField.name] ?? "" : value === void 0 || value === null ? "" : String(value);
@@ -455,7 +463,7 @@ const ElicitationForm = forwardRef(
             overflowY: "scroll",
             overflowX: "hidden",
             scrollTop: reviewScrollTop,
-            scrollbarThumbColor: "gray",
+            scrollbarThumbColor: tone("dim"),
             flexDirection: "column",
             height: contentHeight,
             paddingRight: 1,
@@ -469,10 +477,10 @@ const ElicitationForm = forwardRef(
       }
       if (!activeField) return null;
       if (activeField.type === "string" || activeField.type === "number") {
-        return /* @__PURE__ */ jsx(Box, { height: contentHeight, children: /* @__PURE__ */ jsxs(Text, { wrap: "truncate-end", children: [
-          /* @__PURE__ */ jsx(Text, { color: "cyan", children: "> " }),
-          currentInput || /* @__PURE__ */ jsx(Text, { color: "gray", children: "Type your answer\u2026" }),
-          /* @__PURE__ */ jsx(Text, { color: "cyan", children: "\u258B" })
+        return /* @__PURE__ */ jsx(Box, { height: signal ? 1 : contentHeight, children: /* @__PURE__ */ jsxs(Text, { wrap: "truncate-end", children: [
+          /* @__PURE__ */ jsx(Text, { color: tone("teal"), children: "> " }),
+          currentInput || /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Type your answer\u2026" }),
+          /* @__PURE__ */ jsx(Text, { color: tone("teal"), children: "\u258B" })
         ] }) });
       }
       const options = [];
@@ -517,18 +525,37 @@ const ElicitationForm = forwardRef(
         {
           overflowY: "scroll",
           overflowX: "hidden",
-          scrollbarThumbColor: "gray",
-          height: contentHeight,
+          scrollbarThumbColor: tone("dim"),
+          height: signal ? Math.min(contentHeight, options.length) : contentHeight,
           scrollTop: targetScrollTop,
           flexDirection: "column",
           paddingRight: 1,
-          children: options.map((opt) => {
+          children: options.map((opt, index) => {
+            if (signal) {
+              const check = activeField.type === "array-enum" ? opt.isSelected ? "[\u2713] " : "[ ] " : "";
+              return /* @__PURE__ */ jsxs(
+                Text,
+                {
+                  bold: opt.isFocused,
+                  color: tone(opt.isFocused ? "hi" : "fg"),
+                  ...opt.isFocused && { backgroundColor: tone("sel") },
+                  wrap: "truncate-end",
+                  children: [
+                    /* @__PURE__ */ jsx(Text, { bold: true, color: tone("amber"), children: opt.isFocused ? glyphText("\u203A ", glyphs) : "  " }),
+                    /* @__PURE__ */ jsx(Text, { bold: true, color: tone(opt.isFocused ? "amber" : "dim"), children: activeField.type === "enum" && index < 9 ? `${index + 1}  ` : "" }),
+                    glyphText(check, glyphs),
+                    opt.label
+                  ]
+                },
+                opt.key
+              );
+            }
             const prefix = opt.isFocused ? "\u25B6 " : "  ";
             const mark = activeField.type === "array-enum" ? opt.isSelected ? "[\u2713] " : "[ ] " : "";
             return /* @__PURE__ */ jsxs(
               Text,
               {
-                color: opt.isFocused ? "cyan" : "gray",
+                color: opt.isFocused ? tone("teal") : tone("dim"),
                 wrap: "truncate-end",
                 children: [
                   prefix,
@@ -570,15 +597,48 @@ const ElicitationForm = forwardRef(
     const questionLines = wrapClampedLines(questionText, questionLineCount);
     const helpLines = wrapClampedLines(helpText, helpLineCount);
     const errorLines = wrapClampedLines(errorLineText, errorLineCount);
+    if (signal) {
+      const position = fields.length > 1 ? ` \xB7 ${activeFieldIndex + 1} of ${fields.length}` : "";
+      return /* @__PURE__ */ jsxs(
+        GateFrame,
+        {
+          title: isReviewing ? "QUESTION \xB7 Review your answers" : `QUESTION${position} \xB7 ${questionLines.filter(Boolean).join(" ")}`,
+          hint: hintLine.replaceAll(" \u2022 ", " \xB7 "),
+          children: [
+            helpLines.filter(Boolean).map((line, index) => /* @__PURE__ */ jsx(Text, { color: tone("dim"), wrap: "truncate-end", children: line }, `help-${index}`)),
+            errorLines.filter(Boolean).map((line, index) => /* @__PURE__ */ jsx(Text, { color: tone("red"), wrap: "truncate-end", children: line }, `error-${index}`)),
+            renderContent()
+          ]
+        }
+      );
+    }
     return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", paddingX: 0, height: viewportHeight, children: [
-      headerLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: "yellowBright", bold: true, wrap: "truncate-end", children: line || " " }, `header-${index}`)),
-      !isReviewing && stepLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: "gray", dimColor: true, wrap: "truncate-end", children: line || " " }, `step-${index}`)),
+      headerLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: tone("amber"), bold: true, wrap: "truncate-end", children: line || " " }, `header-${index}`)),
+      !isReviewing && stepLines.map((line, index) => /* @__PURE__ */ jsx(
+        Text,
+        {
+          color: tone("dim"),
+          dimColor: true,
+          wrap: "truncate-end",
+          children: line || " "
+        },
+        `step-${index}`
+      )),
       Array.from({ length: spacerAfterStepLineCount }, (_, index) => /* @__PURE__ */ jsx(Text, { wrap: "truncate-end", children: " " }, `spacer-step-${index}`)),
-      !isReviewing && questionLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: "white", bold: true, wrap: "truncate-end", children: line || " " }, `question-${index}`)),
-      !isReviewing && helpLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: "gray", dimColor: true, wrap: "truncate-end", children: line || " " }, `help-${index}`)),
-      !isReviewing && errorLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: "red", wrap: "truncate-end", children: line || " " }, `error-${index}`)),
+      !isReviewing && questionLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: tone("hi"), bold: true, wrap: "truncate-end", children: line || " " }, `question-${index}`)),
+      !isReviewing && helpLines.map((line, index) => /* @__PURE__ */ jsx(
+        Text,
+        {
+          color: tone("dim"),
+          dimColor: true,
+          wrap: "truncate-end",
+          children: line || " "
+        },
+        `help-${index}`
+      )),
+      !isReviewing && errorLines.map((line, index) => /* @__PURE__ */ jsx(Text, { color: tone("red"), wrap: "truncate-end", children: line || " " }, `error-${index}`)),
       renderContent(),
-      /* @__PURE__ */ jsx(Text, { color: "gray", dimColor: true, wrap: "truncate-end", children: hintLine })
+      /* @__PURE__ */ jsx(Text, { color: tone("dim"), dimColor: true, wrap: "truncate-end", children: hintLine })
     ] });
   }
 );