@drisp/cli 0.4.1 → 0.4.4

package/dist/chunk-2HR7FV3M.js

@@ -0,0 +1,502 @@
+// src/ui/theme/themes.ts
+var darkTheme = {
+  name: "dark",
+  // ── Text hierarchy ──────────────────────────────────────
+  text: "#c9d1d9",
+  // Primary text. Warm gray, not pure white.
+  textMuted: "#848d97",
+  // Dim text. Bumped from #6e7681 for AA compliance (~4.8:1).
+  textInverse: "#0d1117",
+  // Text on colored backgrounds.
+  // ── Accent ──────────────────────────────────────────────
+  border: "#2d333b",
+  // Bumped from #1e2a38 for visibility (~2.2:1 vs bg).
+  accent: "#58a6ff",
+  // Blue. Focus bar, branding, selection, links.
+  accentSecondary: "#bc8cff",
+  // Soft purple. Permission events.
+  // ── Status ──────────────────────────────────────────────
+  status: {
+    success: "#3fb950",
+    // Green. Completion, done glyphs.
+    error: "#f85149",
+    // Red. Failures, blocks, Tool Fail.
+    warning: "#d29922",
+    // Amber. Active stage, zero-result tint, caution.
+    info: "#58a6ff",
+    // Blue. Agent messages, Run OK.
+    working: "#d29922",
+    // Amber. Spinner state (same as warning).
+    neutral: "#9da5ae"
+    // Mid gray. Bumped from #8b949e for AA (~4.8:1).
+  },
+  // ── Context bar ─────────────────────────────────────────
+  contextBar: {
+    track: "#1e2a38",
+    // Empty segment track.
+    low: "#3fb950",
+    // Green.  0–50% budget used.
+    medium: "#d29922",
+    // Amber. 50–80% budget used.
+    high: "#f85149"
+    // Red.   80–100% budget used.
+  },
+  // ── Dialog borders ──────────────────────────────────────
+  dialog: {
+    borderPermission: "#d29922",
+    // Amber border for permission prompts.
+    borderQuestion: "#58a6ff"
+    // Blue border for question prompts.
+  },
+  // ── Input ───────────────────────────────────────────────
+  inputPrompt: "#388bfd",
+  // Blue "input" keyword in prompt.
+  inputChevron: "#484f58",
+  // Bumped from #30363d for visibility (~2.8:1).
+  inputBackground: "#141a21",
+  // Slight lift so the input row reads as its own surface.
+  // ── Feed ────────────────────────────────────────────────
+  feed: {
+    headerLabel: "#848d97",
+    // Matches textMuted.
+    stripeBackground: "#161b22",
+    // Bumped from #0d1521 for visible alternation.
+    focusBackground: "#1b2a3f"
+    // Blue tint for focused row.
+  },
+  // ── User messages ───────────────────────────────────────
+  userMessage: {
+    text: "#6e7681",
+    // Dimmed text for user messages in the message panel.
+    background: "#151d2b",
+    // Blue-tinted lift — differentiates user turns from agent.
+    border: "#30363d",
+    // Subtle border.
+    agentBorder: "#2a4a6a",
+    // Steel blue left border for agent messages.
+    focusBorder: "#58a6ff"
+    // Accent blue for focused message indicator.
+  },
+  // ── Badges ──────────────────────────────────────────────
+  badge: {
+    error: { bg: "#4b1014", fg: "#ff7b72" },
+    running: { bg: "#4a3a0c", fg: "#fbbf24" },
+    idle: { bg: "#10321d", fg: "#3fb950" },
+    search: { bg: "#1b2a3f" },
+    command: { bg: "#2a1b3f" }
+  },
+  // ── Detail view ─────────────────────────────────────────
+  detail: {
+    title: "#c9d1d9",
+    subject: "#58a6ff"
+  },
+  // ── Tool pills ──────────────────────────────────────────
+  toolPill: {
+    safe: { bg: "#0e2233", fg: "#5ba3cc" },
+    mutating: { bg: "#2a1d0a", fg: "#d4a44a" },
+    browser: { bg: "#0b2625", fg: "#5cc4ba" },
+    neutral: { bg: "#141a22", fg: "#7d8590" },
+    skill: { bg: "#2a0f24", fg: "#c98ab8" },
+    "subagent.spawn": { bg: "#0a2e22", fg: "#5cc4a0" },
+    "subagent.return": { bg: "#0a2e22", fg: "#56b492" }
+  }
+};
+var lightTheme = {
+  name: "light",
+  // ── Text hierarchy ──────────────────────────────────────
+  text: "#1f2328",
+  // Near-black. Strong contrast.
+  textMuted: "#656d76",
+  // Medium gray. Same role as dark textMuted.
+  textInverse: "#ffffff",
+  // White on colored backgrounds.
+  // ── Accent ──────────────────────────────────────────────
+  border: "#8c959f",
+  // Darker neutral border so frame lines stay visible on white.
+  accent: "#0969da",
+  // Darker blue for light backgrounds.
+  accentSecondary: "#8250df",
+  // Purple, darkened for readability.
+  // ── Status ──────────────────────────────────────────────
+  status: {
+    success: "#1a7f37",
+    // Dark green. Readable on white.
+    error: "#cf222e",
+    // Dark red.
+    warning: "#9a6700",
+    // Dark amber.
+    info: "#0969da",
+    // Dark blue. Matches accent.
+    working: "#9a6700",
+    // Dark amber.
+    neutral: "#656d76"
+    // Mid gray.
+  },
+  // ── Context bar ─────────────────────────────────────────
+  contextBar: {
+    track: "#d0d7de",
+    // Light gray track.
+    low: "#1a7f37",
+    medium: "#9a6700",
+    high: "#cf222e"
+  },
+  // ── Dialog borders ──────────────────────────────────────
+  dialog: {
+    borderPermission: "#9a6700",
+    borderQuestion: "#0969da"
+  },
+  // ── Input ───────────────────────────────────────────────
+  inputPrompt: "#0969da",
+  inputChevron: "#656d76",
+  inputBackground: "#f3f6f9",
+  // ── Feed ────────────────────────────────────────────────
+  feed: {
+    headerLabel: "#656d76",
+    stripeBackground: "#f6f8fa",
+    focusBackground: "#ddf4ff"
+    // Light blue tint for focused row.
+  },
+  // ── User messages ───────────────────────────────────────
+  userMessage: {
+    text: "#8b949e",
+    // Dimmed text for user messages in the message panel.
+    background: "#edf2fb",
+    // Blue-tinted lift — differentiates user turns from agent.
+    border: "#8c959f",
+    agentBorder: "#6cb0e0",
+    // Medium blue on white bg.
+    focusBorder: "#0969da"
+    // Accent blue for focused message indicator.
+  },
+  // ── Badges ──────────────────────────────────────────────
+  badge: {
+    error: { bg: "#ffebe9", fg: "#cf222e" },
+    running: { bg: "#fff8c5", fg: "#9a6700" },
+    idle: { bg: "#dafbe1", fg: "#1a7f37" },
+    search: { bg: "#ddf4ff" },
+    command: { bg: "#fbefff" }
+  },
+  // ── Detail view ─────────────────────────────────────────
+  detail: {
+    title: "#1f2328",
+    subject: "#0969da"
+  },
+  // ── Tool pills ──────────────────────────────────────────
+  toolPill: {
+    safe: { bg: "#ddf4ff", fg: "#0550ae" },
+    mutating: { bg: "#fff8c5", fg: "#7c5200" },
+    browser: { bg: "#dafbe1", fg: "#116329" },
+    neutral: { bg: "#f6f8fa", fg: "#424a53" },
+    skill: { bg: "#fbefff", fg: "#6639ba" },
+    "subagent.spawn": { bg: "#dafbe1", fg: "#116329" },
+    "subagent.return": { bg: "#dafbe1", fg: "#1a7f37" }
+  }
+};
+var highContrastTheme = {
+  name: "high-contrast",
+  // ── Text hierarchy ──────────────────────────────────────
+  text: "#f0f6fc",
+  // Near-white. Maximum brightness.
+  textMuted: "#9ea7b3",
+  // Bumped from #7d8590 for better contrast (~5.2:1).
+  textInverse: "#010409",
+  // Near-black.
+  // ── Accent ──────────────────────────────────────────────
+  border: "#71b7ff",
+  accent: "#71b7ff",
+  // Brighter blue. Punches through.
+  accentSecondary: "#d2a8ff",
+  // Bright purple.
+  // ── Status ──────────────────────────────────────────────
+  status: {
+    success: "#56d364",
+    // Bright green. Higher saturation.
+    error: "#ff7b72",
+    // Bright red. Softened for readability.
+    warning: "#e3b341",
+    // Bright amber.
+    info: "#71b7ff",
+    // Bright blue.
+    working: "#e3b341",
+    // Bright amber.
+    neutral: "#b1bac4"
+    // Bumped from #9ea7b3 for HC (~6.0:1).
+  },
+  // ── Context bar ─────────────────────────────────────────
+  contextBar: {
+    track: "#3d444d",
+    // HC track — brighter than dark.
+    low: "#56d364",
+    medium: "#e3b341",
+    high: "#ff7b72"
+  },
+  // ── Dialog borders ──────────────────────────────────────
+  dialog: {
+    borderPermission: "#e3b341",
+    borderQuestion: "#71b7ff"
+  },
+  // ── Input ───────────────────────────────────────────────
+  inputPrompt: "#71b7ff",
+  inputChevron: "#9ea7b3",
+  // Bumped from #7d8590 for visibility.
+  inputBackground: "#16202b",
+  // ── Feed ────────────────────────────────────────────────
+  feed: {
+    headerLabel: "#9ea7b3",
+    // Matches textMuted.
+    stripeBackground: "#0d1521",
+    // Bumped from #0b141f for visible alternation.
+    focusBackground: "#1a3350"
+    // Brighter blue tint for HC.
+  },
+  // ── User messages ───────────────────────────────────────
+  userMessage: {
+    text: "#7d8590",
+    // Dimmed text for user messages in the message panel.
+    background: "#1a2436",
+    // Blue-tinted lift — differentiates user turns from agent.
+    border: "#444c56",
+    // Bumped from #3d444d for HC visibility.
+    agentBorder: "#5599cc",
+    // Brighter blue for HC.
+    focusBorder: "#71b7ff"
+    // Accent blue for focused message indicator.
+  },
+  // ── Badges ──────────────────────────────────────────────
+  badge: {
+    error: { bg: "#6e1b16", fg: "#ff7b72" },
+    running: { bg: "#5c4813", fg: "#e3b341" },
+    idle: { bg: "#154228", fg: "#56d364" },
+    search: { bg: "#1a3350" },
+    command: { bg: "#301e50" }
+  },
+  // ── Detail view ─────────────────────────────────────────
+  detail: {
+    title: "#f0f6fc",
+    subject: "#71b7ff"
+  },
+  // ── Tool pills ──────────────────────────────────────────
+  toolPill: {
+    safe: { bg: "#122d42", fg: "#a2d2ff" },
+    mutating: { bg: "#3a2e10", fg: "#f0d070" },
+    browser: { bg: "#0f3520", fg: "#7ee28b" },
+    neutral: { bg: "#1c2128", fg: "#b1bac4" },
+    skill: { bg: "#2b1a40", fg: "#e0c0ff" },
+    "subagent.spawn": { bg: "#0f3520", fg: "#7ee28b" },
+    "subagent.return": { bg: "#0f3520", fg: "#6bcc79" }
+  }
+};
+var THEMES = {
+  dark: darkTheme,
+  light: lightTheme,
+  "high-contrast": highContrastTheme
+};
+function resolveTheme(name) {
+  if (name && name in THEMES) {
+    return THEMES[name];
+  }
+  return darkTheme;
+}
+
+// src/ui/theme/ThemeContext.tsx
+import { createContext, useContext } from "react";
+var ThemeContext = createContext(darkTheme);
+var ThemeProvider = ThemeContext.Provider;
+function useTheme() {
+  return useContext(ThemeContext);
+}
+
+// src/setup/components/StepStatus.tsx
+import { Text, Box } from "ink";
+import { jsx, jsxs } from "react/jsx-runtime";
+function StepStatus({ status, message }) {
+  const theme = useTheme();
+  const icon = status === "success" ? "\u2713" : status === "error" ? "\u2717" : "\u280B";
+  const color = status === "success" ? theme.status.success : status === "error" ? theme.status.error : theme.status.working;
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "row", marginTop: 1, children: [
+    /* @__PURE__ */ jsxs(Text, { color, bold: true, children: [
+      icon,
+      " "
+    ] }),
+    /* @__PURE__ */ jsx(Text, { color, children: message })
+  ] });
+}
+
+// src/setup/steps/McpOptionsStep.tsx
+import { useState as useState2, useCallback, useEffect as useEffect2, useRef as useRef2 } from "react";
+import { Box as Box3, Text as Text3 } from "ink";
+
+// src/setup/components/StepSelector.tsx
+import { useEffect, useRef, useState } from "react";
+import { Box as Box2, Text as Text2, useInput } from "ink";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function getInitialCursor(options, initialValue) {
+  if (initialValue) {
+    const initialIndex = options.findIndex(
+      (option) => option.value === initialValue && !option.disabled
+    );
+    if (initialIndex >= 0) {
+      return initialIndex;
+    }
+  }
+  const firstEnabled = options.findIndex((option) => !option.disabled);
+  return firstEnabled >= 0 ? firstEnabled : 0;
+}
+function StepSelector({
+  options,
+  onSelect,
+  isActive = true,
+  initialValue,
+  onHighlight,
+  gap = 0
+}) {
+  const theme = useTheme();
+  const [cursor, setCursor] = useState(
+    () => getInitialCursor(options, initialValue)
+  );
+  const highlightedRef = useRef(void 0);
+  const moveCursor = (direction) => {
+    setCursor((prev) => {
+      if (options.length <= 1) {
+        return prev;
+      }
+      let next = prev;
+      for (let i = 0; i < options.length; i += 1) {
+        const candidate = Math.max(
+          0,
+          Math.min(next + direction, options.length - 1)
+        );
+        if (candidate === next) {
+          return prev;
+        }
+        next = candidate;
+        if (!options[next]?.disabled) {
+          return next;
+        }
+      }
+      return prev;
+    });
+  };
+  useInput(
+    (_input, key) => {
+      if (key.downArrow) {
+        moveCursor(1);
+      } else if (key.upArrow) {
+        moveCursor(-1);
+      } else if (key.return) {
+        const opt = options[cursor];
+        if (!opt.disabled) {
+          onSelect(opt.value);
+        }
+      }
+    },
+    { isActive }
+  );
+  useEffect(() => {
+    if (!onHighlight) {
+      return;
+    }
+    const option = options[cursor];
+    if (option.disabled) {
+      return;
+    }
+    if (highlightedRef.current === option.value) {
+      return;
+    }
+    highlightedRef.current = option.value;
+    onHighlight(option.value);
+  }, [cursor, options, onHighlight]);
+  return /* @__PURE__ */ jsx2(Box2, { flexDirection: "column", gap, children: options.map((opt, i) => {
+    const isCursor = i === cursor;
+    return /* @__PURE__ */ jsxs2(Box2, { flexDirection: "column", children: [
+      /* @__PURE__ */ jsxs2(
+        Text2,
+        {
+          color: opt.disabled ? theme.textMuted : isCursor ? theme.accent : theme.text,
+          bold: isCursor && !opt.disabled,
+          inverse: isCursor && !opt.disabled,
+          dimColor: opt.disabled,
+          children: [
+            isCursor ? " > " : "   ",
+            opt.label,
+            isCursor ? " " : ""
+          ]
+        }
+      ),
+      opt.description && !opt.disabled ? /* @__PURE__ */ jsx2(Box2, { paddingLeft: 5, children: /* @__PURE__ */ jsxs2(Text2, { dimColor: true, italic: true, children: [
+        "\u21B3 ",
+        opt.description
+      ] }) }) : null
+    ] }, opt.value);
+  }) });
+}
+
+// src/setup/steps/McpOptionsStep.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function McpOptionsStep({ servers, onComplete }) {
+  const theme = useTheme();
+  const [serverIndex, setServerIndex] = useState2(0);
+  const choicesRef = useRef2({});
+  const autoSkippedRef = useRef2(false);
+  useEffect2(() => {
+    if (servers.length === 0 && !autoSkippedRef.current) {
+      autoSkippedRef.current = true;
+      onComplete({});
+    }
+  }, [servers.length, onComplete]);
+  const handleSelect = useCallback(
+    (value) => {
+      const server = servers[serverIndex];
+      const selectedOption = server.options[Number(value)];
+      choicesRef.current = {
+        ...choicesRef.current,
+        [server.serverName]: selectedOption.env
+      };
+      if (serverIndex + 1 < servers.length) {
+        setServerIndex((prev) => prev + 1);
+      } else {
+        onComplete(choicesRef.current);
+      }
+    },
+    [serverIndex, servers, onComplete]
+  );
+  if (servers.length === 0) {
+    return null;
+  }
+  const currentServer = servers[serverIndex];
+  const selectorOptions = currentServer.options.map((opt, i) => ({
+    label: i === 0 ? `${opt.label} (default)` : opt.label,
+    value: String(i)
+  }));
+  return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx3(Text3, { bold: true, color: theme.accent, children: "Configure MCP servers" }),
+    /* @__PURE__ */ jsxs3(Text3, { color: theme.textMuted, children: [
+      "Server ",
+      serverIndex + 1,
+      " of ",
+      servers.length,
+      ":",
+      " ",
+      /* @__PURE__ */ jsx3(Text3, { bold: true, children: currentServer.serverName })
+    ] }),
+    /* @__PURE__ */ jsx3(Box3, { marginTop: 1, children: /* @__PURE__ */ jsx3(
+      StepSelector,
+      {
+        options: selectorOptions,
+        onSelect: handleSelect
+      },
+      currentServer.serverName
+    ) })
+  ] });
+}
+
+export {
+  darkTheme,
+  resolveTheme,
+  ThemeProvider,
+  useTheme,
+  StepSelector,
+  StepStatus,
+  McpOptionsStep
+};
+//# sourceMappingURL=chunk-2HR7FV3M.js.map