@dexto/tui 1.14.6 → 1.15.0-beta.1

package/dist/components/overlays/ContextStatsOverlay.js

@@ -1,6 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect, forwardRef, useImperativeHandle } from "react";
 import { Box, Text } from "ink";
+import { tone } from "../../signal/index.js";
 const BREAKDOWN_ITEMS = [
   "systemPrompt",
   "tools",
@@ -8,12 +9,12 @@ const BREAKDOWN_ITEMS = [
   "freeSpace",
   "autoCompactBuffer"
 ];
-const ITEM_COLORS = {
-  systemPrompt: "cyan",
-  tools: "yellow",
-  messages: "blue",
-  freeSpace: "gray",
-  autoCompactBuffer: "magenta"
+const ITEM_ROLES = {
+  systemPrompt: "teal",
+  tools: "amberDim",
+  messages: "fg",
+  freeSpace: "dim",
+  autoCompactBuffer: "faint"
 };
 function formatTokens(tokens) {
   if (tokens >= 1e3) {
@@ -43,29 +44,39 @@ function createStackedBar(breakdown, maxContextTokens, thresholdPercent, totalWi
   if (sysWidth > 0) {
     segments.push({
       char: "\u2588",
-      color: ITEM_COLORS.systemPrompt,
+      color: tone(ITEM_ROLES.systemPrompt),
       width: sysWidth,
       item: "systemPrompt"
     });
   }
   if (toolsWidth > 0) {
-    segments.push({ char: "\u2588", color: ITEM_COLORS.tools, width: toolsWidth, item: "tools" });
+    segments.push({
+      char: "\u2588",
+      color: tone(ITEM_ROLES.tools),
+      width: toolsWidth,
+      item: "tools"
+    });
   }
   if (msgsWidth > 0) {
     segments.push({
       char: "\u2588",
-      color: ITEM_COLORS.messages,
+      color: tone(ITEM_ROLES.messages),
       width: msgsWidth,
       item: "messages"
     });
   }
   if (adjustedFreeWidth > 0) {
-    segments.push({ char: "\u2591", color: "gray", width: adjustedFreeWidth, item: "freeSpace" });
+    segments.push({
+      char: "\u2591",
+      color: tone("dim"),
+      width: adjustedFreeWidth,
+      item: "freeSpace"
+    });
   }
   if (reservedWidth > 0) {
     segments.push({
       char: "\u2592",
-      color: ITEM_COLORS.autoCompactBuffer,
+      color: tone(ITEM_ROLES.autoCompactBuffer),
       width: reservedWidth,
       item: "autoCompactBuffer"
     });
@@ -152,12 +163,12 @@ const ContextStatsOverlay = forwardRef(
         {
           flexDirection: "column",
           borderStyle: "round",
-          borderColor: "cyan",
+          borderColor: tone("teal"),
           paddingX: 2,
           paddingY: 1,
           children: [
-            /* @__PURE__ */ jsx(Text, { color: "cyan", bold: true, children: "\u{1F4CA} Context Usage" }),
-            /* @__PURE__ */ jsx(Text, { color: "gray", children: "Loading..." })
+            /* @__PURE__ */ jsx(Text, { color: tone("teal"), bold: true, children: "\u{1F4CA} Context Usage" }),
+            /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Loading..." })
           ]
         }
       );
@@ -168,13 +179,13 @@ const ContextStatsOverlay = forwardRef(
         {
           flexDirection: "column",
           borderStyle: "round",
-          borderColor: "red",
+          borderColor: tone("red"),
           paddingX: 2,
           paddingY: 1,
           children: [
-            /* @__PURE__ */ jsx(Text, { color: "red", bold: true, children: "Error" }),
-            /* @__PURE__ */ jsx(Text, { color: "gray", children: error }),
-            /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", dimColor: true, children: "Press Esc to close" }) })
+            /* @__PURE__ */ jsx(Text, { color: tone("red"), bold: true, children: "Error" }),
+            /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: error }),
+            /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), dimColor: true, children: "Press Esc to close" }) })
           ]
         }
       );
@@ -200,15 +211,15 @@ const ContextStatsOverlay = forwardRef(
       const isSelected = selectedIndex === index;
       const prefix = isLast ? "\u2514\u2500" : "\u251C\u2500";
       const expandIcon = expandable ? isToolsExpanded ? "\u25BC" : "\u25B6" : " ";
-      const itemColor = ITEM_COLORS[item];
+      const itemColor = tone(ITEM_ROLES[item]);
       const indicator = item === "freeSpace" ? "\u2591" : item === "autoCompactBuffer" ? "\u2592" : "\u2588";
       return /* @__PURE__ */ jsxs(Box, { children: [
-        /* @__PURE__ */ jsxs(Text, { color: isSelected ? "white" : "gray", children: [
+        /* @__PURE__ */ jsxs(Text, { color: isSelected ? tone("hi") : tone("dim"), children: [
           prefix,
           " "
         ] }),
         /* @__PURE__ */ jsx(Text, { color: itemColor, bold: isSelected, children: indicator }),
-        /* @__PURE__ */ jsxs(Text, { color: isSelected ? "white" : "gray", bold: isSelected, children: [
+        /* @__PURE__ */ jsxs(Text, { color: isSelected ? tone("hi") : tone("dim"), bold: isSelected, children: [
           " ",
           expandIcon,
           " ",
@@ -219,7 +230,7 @@ const ContextStatsOverlay = forwardRef(
           pct(tokens),
           ")"
         ] }),
-        isSelected && expandable && /* @__PURE__ */ jsxs(Text, { color: "gray", dimColor: true, children: [
+        isSelected && expandable && /* @__PURE__ */ jsxs(Text, { color: tone("dim"), dimColor: true, children: [
           " ",
           "(Enter to ",
           isToolsExpanded ? "collapse" : "expand",
@@ -234,34 +245,34 @@ const ContextStatsOverlay = forwardRef(
       {
         flexDirection: "column",
         borderStyle: "round",
-        borderColor: "cyan",
+        borderColor: tone("teal"),
         paddingX: 2,
         paddingY: 1,
         children: [
           /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
-            /* @__PURE__ */ jsx(Text, { color: "cyan", bold: true, children: "\u{1F4CA} Context Usage" }),
-            /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+            /* @__PURE__ */ jsx(Text, { color: tone("teal"), bold: true, children: "\u{1F4CA} Context Usage" }),
+            /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
               " - ",
               stats.modelDisplayName
             ] })
           ] }),
           /* @__PURE__ */ jsx(Box, { children: barSegments.map((segment, idx) => {
             const isHighlighted = BREAKDOWN_ITEMS[selectedIndex] === segment.item;
-            return /* @__PURE__ */ jsx(Text, { color: "white", children: isHighlighted ? "\u25BC".repeat(segment.width) : " ".repeat(segment.width) }, idx);
+            return /* @__PURE__ */ jsx(Text, { color: tone("hi"), children: isHighlighted ? "\u25BC".repeat(segment.width) : " ".repeat(segment.width) }, idx);
           }) }),
           /* @__PURE__ */ jsx(Box, { children: barSegments.map((segment, idx) => /* @__PURE__ */ jsx(Text, { color: segment.color, children: segment.char.repeat(segment.width) }, idx)) }),
           /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
-            /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+            /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
               tokenDisplay,
               " / ",
               formatTokens(totalTokenSpace),
               " tokens"
             ] }),
-            /* @__PURE__ */ jsx(Text, { color: "gray", children: " \u2022 " }),
+            /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: " \u2022 " }),
             /* @__PURE__ */ jsxs(
               Text,
               {
-                color: stats.usagePercent > 80 ? "red" : stats.usagePercent > 60 ? "yellow" : "green",
+                color: stats.usagePercent > 80 ? tone("red") : stats.usagePercent > 60 ? tone("amberDim") : tone("add"),
                 children: [
                   stats.usagePercent,
                   "% used"
@@ -270,7 +281,7 @@ const ContextStatsOverlay = forwardRef(
             )
           ] }),
           /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
-            /* @__PURE__ */ jsx(Text, { color: "white", children: "Breakdown:" }),
+            /* @__PURE__ */ jsx(Text, { color: tone("hi"), children: "Breakdown:" }),
             renderRow(
               0,
               "systemPrompt",
@@ -286,10 +297,10 @@ const ContextStatsOverlay = forwardRef(
               false,
               true
             ),
-            isToolsExpanded && /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginLeft: 4, children: stats.breakdown.tools.perTool.length === 0 ? /* @__PURE__ */ jsx(Text, { color: "gray", dimColor: true, children: "No tools registered" }) : [...stats.breakdown.tools.perTool].sort((a, b) => b.tokens - a.tokens).map((tool, idx, arr) => /* @__PURE__ */ jsxs(Text, { color: "gray", dimColor: true, children: [
+            isToolsExpanded && /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginLeft: 4, children: stats.breakdown.tools.perTool.length === 0 ? /* @__PURE__ */ jsx(Text, { color: tone("dim"), dimColor: true, children: "No tools registered" }) : [...stats.breakdown.tools.perTool].sort((a, b) => b.tokens - a.tokens).map((tool, idx, arr) => /* @__PURE__ */ jsxs(Text, { color: tone("dim"), dimColor: true, children: [
               idx === arr.length - 1 ? "\u2514\u2500" : "\u251C\u2500",
               " ",
-              /* @__PURE__ */ jsx(Text, { color: "yellow", dimColor: true, children: tool.name }),
+              /* @__PURE__ */ jsx(Text, { color: tone("amberDim"), dimColor: true, children: tool.name }),
               ": ",
               formatTokens(tool.tokens),
               " (",
@@ -307,22 +318,22 @@ const ContextStatsOverlay = forwardRef(
             )
           ] }),
           /* @__PURE__ */ jsxs(Box, { marginTop: 1, flexDirection: "column", children: [
-            /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+            /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
               "Messages: ",
               stats.filteredMessageCount,
               " visible (",
               stats.messageCount,
               " total)"
             ] }),
-            stats.prunedToolCount > 0 && /* @__PURE__ */ jsxs(Text, { color: "yellow", children: [
+            stats.prunedToolCount > 0 && /* @__PURE__ */ jsxs(Text, { color: tone("amberDim"), children: [
               "\u{1F5D1}\uFE0F ",
               stats.prunedToolCount,
               " tool output(s) pruned"
             ] }),
-            stats.hasSummary && /* @__PURE__ */ jsx(Text, { color: "blue", children: "\u{1F4E6} Context has been compacted (summary present)" }),
-            stats.usagePercent > 100 && /* @__PURE__ */ jsx(Text, { color: "yellow", children: "\u{1F4A1} Use /compact to manually compact, or send a message to trigger auto-compaction" })
+            stats.hasSummary && /* @__PURE__ */ jsx(Text, { color: tone("fg"), children: "\u{1F4E6} Context has been compacted (summary present)" }),
+            stats.usagePercent > 100 && /* @__PURE__ */ jsx(Text, { color: tone("amberDim"), children: "\u{1F4A1} Use /compact to manually compact, or send a message to trigger auto-compaction" })
           ] }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", dimColor: true, children: "\u2191\u2193: navigate | Enter: expand/collapse | Esc: close" }) })
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), dimColor: true, children: "\u2191\u2193: navigate | Enter: expand/collapse | Esc: close" }) })
         ]
       }
     );

package/dist/components/overlays/CustomModelWizard.cjs

@@ -39,6 +39,7 @@ var import_core = require("@dexto/core");
 var import_provider_config = require("./custom-model-wizard/provider-config.js");
 var import_shared = require("./custom-model-wizard/shared/index.js");
 var import_LocalModelWizard = __toESM(require("./custom-model-wizard/LocalModelWizard.js"), 1);
+var import_signal = require("../../signal/index.js");
 const CustomModelWizard = (0, import_react.forwardRef)(
   function CustomModelWizard2({ isVisible, onComplete, onClose, initialModel }, ref) {
     const [selectedProvider, setSelectedProvider] = (0, import_react.useState)(null);
@@ -314,13 +315,13 @@ const CustomModelWizard = (0, import_react.forwardRef)(
       {
         flexDirection: "column",
         borderStyle: "round",
-        borderColor: "green",
+        borderColor: (0, import_signal.tone)("add"),
         paddingX: 1,
         marginTop: 1,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { marginBottom: 1, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { bold: true, color: "green", children: isEditing ? "Edit Custom Model" : "Add Custom Model" }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "gray", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { bold: true, color: (0, import_signal.tone)("add"), children: isEditing ? "Edit Custom Model" : "Add Custom Model" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: [
               " ",
               "(",
               providerConfig.displayName,
@@ -349,7 +350,7 @@ const CustomModelWizard = (0, import_react.forwardRef)(
               additionalContent: currentStepConfig.field === "apiKey" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_shared.ApiKeyStep, { provider: selectedProvider }) : void 0
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "gray", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: [
             "Enter to continue \u2022 Esc to",
             " ",
             currentStep > 0 ? "go back" : "back to provider"

package/dist/components/overlays/CustomModelWizard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CustomModelWizard.d.ts","sourceRoot":"","sources":["../../../src/components/overlays/CustomModelWizard.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,qCAAqC,CAAC;AAC/D,OAAO,EAGH,KAAK,WAAW,EAMnB,MAAM,yBAAyB,CAAC;AAqBjC,UAAU,sBAAsB;IAC5B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,uEAAuE;IACvE,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CACrC;AAED,MAAM,WAAW,uBAAuB;IACpC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC;CACrD;AAED;;;GAGG;AACH,QAAA,MAAM,iBAAiB,wGA4YtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"CustomModelWizard.d.ts","sourceRoot":"","sources":["../../../src/components/overlays/CustomModelWizard.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,qCAAqC,CAAC;AAC/D,OAAO,EAGH,KAAK,WAAW,EAMnB,MAAM,yBAAyB,CAAC;AAsBjC,UAAU,sBAAsB;IAC5B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,uEAAuE;IACvE,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CACrC;AAED,MAAM,WAAW,uBAAuB;IACpC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC;CACrD;AAED;;;GAGG;AACH,QAAA,MAAM,iBAAiB,wGA4YtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/overlays/CustomModelWizard.js

@@ -30,6 +30,7 @@ import {
   ApiKeyStep
 } from "./custom-model-wizard/shared/index.js";
 import LocalModelWizard from "./custom-model-wizard/LocalModelWizard.js";
+import { tone } from "../../signal/index.js";
 const CustomModelWizard = forwardRef(
   function CustomModelWizard2({ isVisible, onComplete, onClose, initialModel }, ref) {
     const [selectedProvider, setSelectedProvider] = useState(null);
@@ -305,13 +306,13 @@ const CustomModelWizard = forwardRef(
       {
         flexDirection: "column",
         borderStyle: "round",
-        borderColor: "green",
+        borderColor: tone("add"),
         paddingX: 1,
         marginTop: 1,
         children: [
           /* @__PURE__ */ jsxs(Box, { marginBottom: 1, children: [
-            /* @__PURE__ */ jsx(Text, { bold: true, color: "green", children: isEditing ? "Edit Custom Model" : "Add Custom Model" }),
-            /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+            /* @__PURE__ */ jsx(Text, { bold: true, color: tone("add"), children: isEditing ? "Edit Custom Model" : "Add Custom Model" }),
+            /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
               " ",
               "(",
               providerConfig.displayName,
@@ -340,7 +341,7 @@ const CustomModelWizard = forwardRef(
               additionalContent: currentStepConfig.field === "apiKey" ? /* @__PURE__ */ jsx(ApiKeyStep, { provider: selectedProvider }) : void 0
             }
           ),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
             "Enter to continue \u2022 Esc to",
             " ",
             currentStep > 0 ? "go back" : "back to provider"

package/dist/components/overlays/ExportWizard.cjs

@@ -36,6 +36,7 @@ var import_react = require("react");
 var import_ink = require("ink");
 var import_promises = __toESM(require("fs/promises"), 1);
 var import_path = __toESM(require("path"), 1);
+var import_signal = require("../../signal/index.js");
 function generateDefaultFilename(sessionId, format) {
   const date = (/* @__PURE__ */ new Date()).toISOString().split("T")[0];
   const shortId = sessionId ? sessionId.slice(0, 6) : "unknown";
@@ -289,91 +290,91 @@ const ExportWizard = (0, import_react.forwardRef)(function ExportWizard2({ isVis
     {
       flexDirection: "column",
       borderStyle: "round",
-      borderColor: "cyan",
+      borderColor: (0, import_signal.tone)("teal"),
       paddingX: 1,
       marginTop: 1,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginBottom: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { bold: true, color: "cyan", children: "\u{1F4E4} Export Conversation" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginBottom: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { bold: true, color: (0, import_signal.tone)("teal"), children: "\u{1F4E4} Export Conversation" }) }),
         step === "format" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: "Select export format:" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { marginTop: 1, flexDirection: "column", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 0 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 0 ? { color: (0, import_signal.tone)("teal") } : {}, children: [
               selectedIndex === 0 ? "\u276F " : "  ",
               "Markdown (.md) - Human readable"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 1 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 1 ? { color: (0, import_signal.tone)("teal") } : {}, children: [
               selectedIndex === 1 ? "\u276F " : "  ",
               "JSON (.json) - Structured data"
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
         ] }),
         step === "toolCalls" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: "Include tool calls and results?" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { marginTop: 1, flexDirection: "column", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 0 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 0 ? { color: (0, import_signal.tone)("teal") } : {}, children: [
               selectedIndex === 0 ? "\u276F " : "  ",
               "Yes - Include all tool interactions"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 1 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 1 ? { color: (0, import_signal.tone)("teal") } : {}, children: [
               selectedIndex === 1 ? "\u276F " : "  ",
               "No - Only user and assistant messages"
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
         ] }),
         step === "filename" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: "Filename:" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { marginTop: 1, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "cyan", children: "> " }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("teal"), children: "> " }),
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: filenameInput }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "cyan", children: "_" })
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("teal"), children: "_" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "Enter to continue \u2022 Esc to cancel" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "Enter to continue \u2022 Esc to cancel" }) })
         ] }),
         step === "confirm" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: "Export with these settings?" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { marginTop: 1, flexDirection: "column", marginLeft: 2, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "gray", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: [
               "Format:",
               " ",
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "white", children: options.format === "markdown" ? "Markdown" : "JSON" })
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("hi"), children: options.format === "markdown" ? "Markdown" : "JSON" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "gray", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: [
               "Tool calls:",
               " ",
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "white", children: options.includeToolCalls ? "Yes" : "No" })
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("hi"), children: options.includeToolCalls ? "Yes" : "No" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "gray", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: [
               "File: ",
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "white", children: filenameInput })
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("hi"), children: filenameInput })
             ] })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { marginTop: 1, flexDirection: "column", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 0 ? { color: "green" } : {}, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 0 ? { color: (0, import_signal.tone)("add") } : {}, children: [
               selectedIndex === 0 ? "\u276F " : "  ",
               "Export"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 1 ? { color: "red" } : {}, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { ...selectedIndex === 1 ? { color: (0, import_signal.tone)("red") } : {}, children: [
               selectedIndex === 1 ? "\u276F " : "  ",
               "Cancel"
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "\u2191\u2193 to select \u2022 Enter to confirm" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "\u2191\u2193 to select \u2022 Enter to confirm" }) })
         ] }),
-        step === "exporting" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { flexDirection: "column", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "yellow", children: "Exporting..." }) }),
+        step === "exporting" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { flexDirection: "column", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("amberDim"), children: "Exporting..." }) }),
         step === "done" && exportResult?.success && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "green", children: "\u2713 Exported successfully!" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("add"), children: "\u2713 Exported successfully!" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { marginTop: 1, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "Saved to: " }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "Saved to: " }),
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { children: exportResult.path })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "Press Enter or Esc to close" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "Press Enter or Esc to close" }) })
         ] }),
         step === "error" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "column", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "red", children: "\u2717 Export failed" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "red", children: exportResult?.error }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: "Press Enter or Esc to close" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("red"), children: "\u2717 Export failed" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("red"), children: exportResult?.error }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: (0, import_signal.tone)("dim"), children: "Press Enter or Esc to close" }) })
         ] })
       ]
     }

package/dist/components/overlays/ExportWizard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExportWizard.d.ts","sourceRoot":"","sources":["../../../src/components/overlays/ExportWizard.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAA4E,MAAM,OAAO,CAAC;AAIjG,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,qCAAqC,CAAC;AAC/D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAY9D,UAAU,iBAAiB;IACvB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,eAAe,CAAC;IACvB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,kBAAkB;IAC/B,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC;CACrD;AA4JD;;GAEG;AACH,QAAA,MAAM,YAAY,8FA+UhB,CAAC;AAEH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ExportWizard.d.ts","sourceRoot":"","sources":["../../../src/components/overlays/ExportWizard.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAA4E,MAAM,OAAO,CAAC;AAIjG,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,qCAAqC,CAAC;AAC/D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAa9D,UAAU,iBAAiB;IACvB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,eAAe,CAAC;IACvB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,kBAAkB;IAC/B,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,OAAO,CAAC;CACrD;AA4JD;;GAEG;AACH,QAAA,MAAM,YAAY,8FAqVhB,CAAC;AAEH,eAAe,YAAY,CAAC"}

package/dist/components/overlays/ExportWizard.js

@@ -3,6 +3,7 @@ import { useState, useEffect, forwardRef, useImperativeHandle, useCallback } fro
 import { Box, Text } from "ink";
 import fs from "fs/promises";
 import path from "path";
+import { tone } from "../../signal/index.js";
 function generateDefaultFilename(sessionId, format) {
   const date = (/* @__PURE__ */ new Date()).toISOString().split("T")[0];
   const shortId = sessionId ? sessionId.slice(0, 6) : "unknown";
@@ -256,91 +257,91 @@ const ExportWizard = forwardRef(function ExportWizard2({ isVisible, agent, sessi
     {
       flexDirection: "column",
       borderStyle: "round",
-      borderColor: "cyan",
+      borderColor: tone("teal"),
       paddingX: 1,
       marginTop: 1,
       children: [
-        /* @__PURE__ */ jsx(Box, { marginBottom: 1, children: /* @__PURE__ */ jsx(Text, { bold: true, color: "cyan", children: "\u{1F4E4} Export Conversation" }) }),
+        /* @__PURE__ */ jsx(Box, { marginBottom: 1, children: /* @__PURE__ */ jsx(Text, { bold: true, color: tone("teal"), children: "\u{1F4E4} Export Conversation" }) }),
         step === "format" && /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
           /* @__PURE__ */ jsx(Text, { children: "Select export format:" }),
           /* @__PURE__ */ jsxs(Box, { marginTop: 1, flexDirection: "column", children: [
-            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 0 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 0 ? { color: tone("teal") } : {}, children: [
               selectedIndex === 0 ? "\u276F " : "  ",
               "Markdown (.md) - Human readable"
             ] }),
-            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 1 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 1 ? { color: tone("teal") } : {}, children: [
               selectedIndex === 1 ? "\u276F " : "  ",
               "JSON (.json) - Structured data"
             ] })
           ] }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
         ] }),
         step === "toolCalls" && /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
           /* @__PURE__ */ jsx(Text, { children: "Include tool calls and results?" }),
           /* @__PURE__ */ jsxs(Box, { marginTop: 1, flexDirection: "column", children: [
-            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 0 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 0 ? { color: tone("teal") } : {}, children: [
               selectedIndex === 0 ? "\u276F " : "  ",
               "Yes - Include all tool interactions"
             ] }),
-            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 1 ? { color: "cyan" } : {}, children: [
+            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 1 ? { color: tone("teal") } : {}, children: [
               selectedIndex === 1 ? "\u276F " : "  ",
               "No - Only user and assistant messages"
             ] })
           ] }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "\u2191\u2193 to select \u2022 Enter to continue \u2022 Esc to cancel" }) })
         ] }),
         step === "filename" && /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
           /* @__PURE__ */ jsx(Text, { children: "Filename:" }),
           /* @__PURE__ */ jsxs(Box, { marginTop: 1, children: [
-            /* @__PURE__ */ jsx(Text, { color: "cyan", children: "> " }),
+            /* @__PURE__ */ jsx(Text, { color: tone("teal"), children: "> " }),
             /* @__PURE__ */ jsx(Text, { children: filenameInput }),
-            /* @__PURE__ */ jsx(Text, { color: "cyan", children: "_" })
+            /* @__PURE__ */ jsx(Text, { color: tone("teal"), children: "_" })
           ] }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: "Enter to continue \u2022 Esc to cancel" }) })
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Enter to continue \u2022 Esc to cancel" }) })
         ] }),
         step === "confirm" && /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
           /* @__PURE__ */ jsx(Text, { children: "Export with these settings?" }),
           /* @__PURE__ */ jsxs(Box, { marginTop: 1, flexDirection: "column", marginLeft: 2, children: [
-            /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+            /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
               "Format:",
               " ",
-              /* @__PURE__ */ jsx(Text, { color: "white", children: options.format === "markdown" ? "Markdown" : "JSON" })
+              /* @__PURE__ */ jsx(Text, { color: tone("hi"), children: options.format === "markdown" ? "Markdown" : "JSON" })
             ] }),
-            /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+            /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
               "Tool calls:",
               " ",
-              /* @__PURE__ */ jsx(Text, { color: "white", children: options.includeToolCalls ? "Yes" : "No" })
+              /* @__PURE__ */ jsx(Text, { color: tone("hi"), children: options.includeToolCalls ? "Yes" : "No" })
             ] }),
-            /* @__PURE__ */ jsxs(Text, { color: "gray", children: [
+            /* @__PURE__ */ jsxs(Text, { color: tone("dim"), children: [
               "File: ",
-              /* @__PURE__ */ jsx(Text, { color: "white", children: filenameInput })
+              /* @__PURE__ */ jsx(Text, { color: tone("hi"), children: filenameInput })
             ] })
           ] }),
           /* @__PURE__ */ jsxs(Box, { marginTop: 1, flexDirection: "column", children: [
-            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 0 ? { color: "green" } : {}, children: [
+            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 0 ? { color: tone("add") } : {}, children: [
               selectedIndex === 0 ? "\u276F " : "  ",
               "Export"
             ] }),
-            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 1 ? { color: "red" } : {}, children: [
+            /* @__PURE__ */ jsxs(Text, { ...selectedIndex === 1 ? { color: tone("red") } : {}, children: [
               selectedIndex === 1 ? "\u276F " : "  ",
               "Cancel"
             ] })
           ] }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: "\u2191\u2193 to select \u2022 Enter to confirm" }) })
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "\u2191\u2193 to select \u2022 Enter to confirm" }) })
         ] }),
-        step === "exporting" && /* @__PURE__ */ jsx(Box, { flexDirection: "column", children: /* @__PURE__ */ jsx(Text, { color: "yellow", children: "Exporting..." }) }),
+        step === "exporting" && /* @__PURE__ */ jsx(Box, { flexDirection: "column", children: /* @__PURE__ */ jsx(Text, { color: tone("amberDim"), children: "Exporting..." }) }),
         step === "done" && exportResult?.success && /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx(Text, { color: "green", children: "\u2713 Exported successfully!" }),
+          /* @__PURE__ */ jsx(Text, { color: tone("add"), children: "\u2713 Exported successfully!" }),
           /* @__PURE__ */ jsxs(Box, { marginTop: 1, children: [
-            /* @__PURE__ */ jsx(Text, { color: "gray", children: "Saved to: " }),
+            /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Saved to: " }),
             /* @__PURE__ */ jsx(Text, { children: exportResult.path })
           ] }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: "Press Enter or Esc to close" }) })
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Press Enter or Esc to close" }) })
         ] }),
         step === "error" && /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx(Text, { color: "red", children: "\u2717 Export failed" }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "red", children: exportResult?.error }) }),
-          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: "Press Enter or Esc to close" }) })
+          /* @__PURE__ */ jsx(Text, { color: tone("red"), children: "\u2717 Export failed" }),
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("red"), children: exportResult?.error }) }),
+          /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: tone("dim"), children: "Press Enter or Esc to close" }) })
         ] })
       ]
     }