@polterware/polter 0.4.2 → 0.5.0

package/dist/appPanel-EZOHLTBX.js

@@ -0,0 +1,1365 @@
+import {
+  CommandArgs,
+  CommandExecution,
+  CustomCommand,
+  DeclarativePlan,
+  DeclarativeStatus,
+  FlagSelection,
+  GhostBanner,
+  InitScaffold,
+  McpManage,
+  PipelineBuilder,
+  PipelineExecution,
+  PipelineList,
+  ProcessList,
+  ProcessLogs,
+  ProjectConfig,
+  ScriptPicker,
+  SelectList,
+  SelfUpdate,
+  SkillSetup,
+  ToolStatus,
+  buildHomeItems,
+  buildPinnedOnlyItems,
+  colors,
+  getPinnedCommands,
+  getPinnedRuns,
+  inkColors,
+  panel,
+  symbols,
+  togglePinnedCommand,
+  togglePinnedRun,
+  useFullscreen,
+  useTerminalDimensions
+} from "./chunk-57CZSEY5.js";
+import "./chunk-KEGROLGX.js";
+import {
+  features,
+  getFeatureById
+} from "./chunk-AK3NTS3Y.js";
+import "./chunk-XNRIN3VM.js";
+import "./chunk-U64WZOJ3.js";
+import "./chunk-BIN7BDA2.js";
+import "./chunk-GKROVUDG.js";
+import "./chunk-U6725U7K.js";
+import "./chunk-E2B5FFBU.js";
+import "./chunk-OKHPN6X7.js";
+import "./chunk-BGT5TT2A.js";
+import "./chunk-45CQFZU7.js";
+import "./chunk-6IBRTRLX.js";
+import "./chunk-ZU5VZHYD.js";
+import "./chunk-JQB2A3CA.js";
+import {
+  findCommandByValue
+} from "./chunk-GVIKF6UI.js";
+import "./chunk-ELSIHPJL.js";
+import "./chunk-RVMOIUSL.js";
+import "./chunk-TD6YNU6L.js";
+import "./chunk-3RG5ZIWI.js";
+
+// src/appPanel.tsx
+import { Box as Box9, Text as Text7, useApp, useInput as useInput2 } from "ink";
+
+// src/stores/navigationStore.ts
+import { create } from "zustand";
+var FEATURE_IDS = [
+  "database",
+  "functions",
+  "deploy",
+  "repo",
+  "cicd",
+  "auth-storage",
+  "networking",
+  "packages",
+  "infrastructure",
+  "setup"
+];
+var VIEW_MAP = {
+  pinned: "pinned",
+  "custom-command": "custom-command",
+  pipelines: "pipelines",
+  "tool-status": "tool-status",
+  config: "config",
+  "self-update": "self-update",
+  processes: "processes",
+  scripts: "scripts",
+  declarative: "declarative",
+  "skill-setup": "skill-setup"
+};
+var useNavigationStore = create((set) => ({
+  view: "pipelines",
+  featureId: "database",
+  innerScreen: "home",
+  innerParams: {},
+  innerStack: [],
+  selectSidebarItem: (itemId) => {
+    if (FEATURE_IDS.includes(itemId)) {
+      set({
+        view: "feature",
+        featureId: itemId,
+        innerScreen: "home",
+        innerParams: {},
+        innerStack: []
+      });
+      return;
+    }
+    const view = VIEW_MAP[itemId];
+    if (view) {
+      set((state) => ({
+        view,
+        featureId: state.featureId,
+        innerScreen: "home",
+        innerParams: {},
+        innerStack: []
+      }));
+    }
+  },
+  navigateInner: (screen, params) => {
+    set((state) => ({
+      innerStack: [...state.innerStack, { screen: state.innerScreen, params: state.innerParams }],
+      innerScreen: screen,
+      innerParams: params ?? {}
+    }));
+  },
+  goBackInner: () => {
+    set((state) => {
+      if (state.innerStack.length === 0) {
+        return { innerScreen: "home", innerParams: {} };
+      }
+      const newStack = [...state.innerStack];
+      const last = newStack.pop();
+      return {
+        innerStack: newStack,
+        innerScreen: last.screen,
+        innerParams: last.params
+      };
+    });
+  },
+  goHomeInner: () => {
+    set({ innerScreen: "home", innerParams: {}, innerStack: [] });
+  },
+  switchViewAndNavigate: (view, screen, params) => {
+    set({
+      view,
+      innerScreen: screen,
+      innerParams: params ?? {},
+      innerStack: [{ screen: "home", params: {} }]
+    });
+  }
+}));
+
+// src/hooks/usePanelNavigation.ts
+function usePanelNavigation() {
+  return useNavigationStore();
+}
+
+// src/stores/focusStore.ts
+import { create as create2 } from "zustand";
+var useFocusStore = create2((set) => ({
+  focused: "sidebar",
+  isSidebarFocused: true,
+  isMainFocused: false,
+  toggleFocus: () => {
+    set((state) => {
+      const next = state.focused === "sidebar" ? "main" : "sidebar";
+      return {
+        focused: next,
+        isSidebarFocused: next === "sidebar",
+        isMainFocused: next === "main"
+      };
+    });
+  },
+  focusSidebar: () => {
+    set({ focused: "sidebar", isSidebarFocused: true, isMainFocused: false });
+  },
+  focusMain: () => {
+    set({ focused: "main", isSidebarFocused: false, isMainFocused: true });
+  }
+}));
+
+// src/hooks/usePanelFocus.ts
+function usePanelFocus() {
+  return useFocusStore();
+}
+
+// src/hooks/useSidebarItems.ts
+import { useMemo } from "react";
+function useSidebarItems() {
+  return useMemo(() => {
+    const items = [];
+    items.push({ id: "__sep_workflows__", label: "---", icon: "", type: "separator", sectionTitle: "Workflows" });
+    items.push({ id: "pipelines", label: "Pipelines", icon: "\u{1F517}", type: "action", section: "workflows" });
+    items.push({ id: "pinned", label: "Pinned", icon: "\u{1F4CC}", type: "action", section: "workflows" });
+    items.push({ id: "custom-command", label: "Custom Cmd", icon: "\u270F\uFE0F", type: "action", section: "workflows" });
+    items.push({ id: "processes", label: "Processes", icon: "\u{1F4BB}", type: "action", section: "workflows" });
+    items.push({ id: "scripts", label: "Scripts", icon: "\u{1F4DC}", type: "action", section: "workflows" });
+    items.push({ id: "__sep_features__", label: "---", icon: "", type: "separator", sectionTitle: "Features" });
+    for (const feature of features) {
+      items.push({
+        id: feature.id,
+        label: feature.label,
+        icon: feature.icon,
+        type: "feature",
+        section: "features"
+      });
+    }
+    items.push({ id: "__sep_system__", label: "---", icon: "", type: "separator", sectionTitle: "System" });
+    items.push({ id: "declarative", label: "Infrastructure", icon: "\u{1F3D7}\uFE0F", type: "action", section: "system" });
+    items.push({ id: "tool-status", label: "Tool Status", icon: "\u{1F527}", type: "action", section: "system" });
+    items.push({ id: "config", label: "Config", icon: "\u2699\uFE0F", type: "action", section: "system" });
+    items.push({ id: "skill-setup", label: "Skill Setup", icon: "\u{1F9E0}", type: "action", section: "system" });
+    items.push({ id: "self-update", label: "Update", icon: "\u2B06\uFE0F", type: "action", section: "system" });
+    return items;
+  }, []);
+}
+
+// src/stores/modalStore.ts
+import { create as create3 } from "zustand";
+var useModalStore = create3((set) => ({
+  isOpen: false,
+  modalContent: null,
+  modalTitle: "",
+  openModal: (content, title) => {
+    set({ isOpen: true, modalContent: content, modalTitle: title });
+  },
+  closeModal: () => {
+    set({ isOpen: false, modalContent: null, modalTitle: "" });
+  }
+}));
+
+// src/hooks/useModal.ts
+function useModal() {
+  return useModalStore();
+}
+
+// src/components/PanelLayout.tsx
+import { Box } from "ink";
+import { jsx, jsxs } from "react/jsx-runtime";
+function PanelLayout({
+  header,
+  footer,
+  sidebar,
+  main,
+  width,
+  height,
+  bannerHeight,
+  singlePanel = false
+}) {
+  const footerHeight = 1;
+  const contentHeight = Math.max(5, height - bannerHeight - footerHeight);
+  const sidebarWidth = singlePanel ? 0 : panel.sidebarWidth(width);
+  const mainWidth = singlePanel ? width : width - sidebarWidth;
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", width, height, children: [
+    header,
+    /* @__PURE__ */ jsxs(Box, { flexDirection: "row", height: contentHeight, children: [
+      !singlePanel && /* @__PURE__ */ jsx(Box, { width: sidebarWidth, height: contentHeight, children: sidebar }),
+      /* @__PURE__ */ jsx(Box, { width: mainWidth, height: contentHeight, children: main })
+    ] }),
+    /* @__PURE__ */ jsx(Box, { height: footerHeight, children: footer })
+  ] });
+}
+
+// src/components/Panel.tsx
+import { Box as Box2, Text } from "ink";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function Panel({
+  id,
+  title,
+  width,
+  height,
+  focused = false,
+  children
+}) {
+  const borderColor = focused ? panel.borderFocused : panel.borderDim;
+  return /* @__PURE__ */ jsxs2(
+    Box2,
+    {
+      flexDirection: "column",
+      width,
+      height,
+      borderStyle: "round",
+      borderColor,
+      overflow: "hidden",
+      children: [
+        title && /* @__PURE__ */ jsx2(Box2, { marginBottom: 0, children: /* @__PURE__ */ jsxs2(Text, { color: focused ? inkColors.accent : void 0, bold: focused, dimColor: !focused, children: [
+          " ",
+          title,
+          " "
+        ] }) }),
+        /* @__PURE__ */ jsx2(Box2, { flexDirection: "column", flexGrow: 1, overflow: "hidden", children })
+      ]
+    }
+  );
+}
+
+// src/components/Sidebar.tsx
+import { useEffect, useMemo as useMemo2, useState } from "react";
+import { Box as Box3, Text as Text2, useInput } from "ink";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function groupSections(items) {
+  const groups = [];
+  let current = null;
+  for (const item of items) {
+    if (item.type === "separator" && item.sectionTitle) {
+      current = { title: item.sectionTitle, items: [] };
+      groups.push(current);
+    } else if (current) {
+      current.items.push(item);
+    }
+  }
+  return groups;
+}
+function Sidebar({
+  items,
+  selectedId,
+  isFocused,
+  height,
+  onSelect,
+  onHighlight
+}) {
+  const selectableItems = useMemo2(
+    () => items.filter((item) => item.type !== "separator"),
+    [items]
+  );
+  const selectedIdx = selectableItems.findIndex((item) => item.id === selectedId);
+  const [cursorIdx, setCursorIdx] = useState(Math.max(0, selectedIdx));
+  const sections = useMemo2(() => groupSections(items), [items]);
+  const [inputReady, setInputReady] = useState(false);
+  useEffect(() => {
+    const t = setTimeout(() => setInputReady(true), 0);
+    return () => clearTimeout(t);
+  }, []);
+  useEffect(() => {
+    const idx = selectableItems.findIndex((item) => item.id === selectedId);
+    if (idx >= 0) setCursorIdx(idx);
+  }, [selectedId, selectableItems]);
+  useInput(
+    (input, key) => {
+      if (key.upArrow || input === "k") {
+        setCursorIdx((prev) => {
+          const next = prev > 0 ? prev - 1 : selectableItems.length - 1;
+          const item = selectableItems[next];
+          if (item && onHighlight) onHighlight(item.id);
+          return next;
+        });
+      }
+      if (key.downArrow || input === "j") {
+        setCursorIdx((prev) => {
+          const next = prev < selectableItems.length - 1 ? prev + 1 : 0;
+          const item = selectableItems[next];
+          if (item && onHighlight) onHighlight(item.id);
+          return next;
+        });
+      }
+      if (key.return || key.rightArrow) {
+        const item = selectableItems[cursorIdx];
+        if (item) {
+          onSelect(item.id);
+        }
+      }
+    },
+    { isActive: isFocused && inputReady }
+  );
+  const sectionIndices = useMemo2(() => {
+    let idx = 0;
+    return sections.map((section) => {
+      const start = idx;
+      idx += section.items.length;
+      return { start, end: idx - 1 };
+    });
+  }, [sections]);
+  return /* @__PURE__ */ jsx3(Box3, { flexDirection: "column", gap: 0, children: sections.map((section, sectionIdx) => {
+    const { start: sectionStartIdx, end: sectionEndIdx } = sectionIndices[sectionIdx];
+    const hasCursorInSection = isFocused && cursorIdx >= sectionStartIdx && cursorIdx <= sectionEndIdx;
+    const hasActiveInSection = section.items.some((item) => item.id === selectedId);
+    const borderColor = hasCursorInSection || hasActiveInSection ? inkColors.accent : "#555555";
+    return /* @__PURE__ */ jsxs3(
+      Box3,
+      {
+        flexDirection: "column",
+        borderStyle: "round",
+        borderColor,
+        paddingX: 1,
+        children: [
+          /* @__PURE__ */ jsx3(Text2, { dimColor: true, bold: true, children: section.title }),
+          section.items.map((item, itemIdx) => {
+            const thisIdx = sectionStartIdx + itemIdx;
+            const isCursor = isFocused && thisIdx === cursorIdx;
+            const isActive = item.id === selectedId;
+            return /* @__PURE__ */ jsx3(Box3, { gap: 0, children: /* @__PURE__ */ jsxs3(
+              Text2,
+              {
+                color: isCursor ? inkColors.accent : isActive ? inkColors.accent : void 0,
+                bold: isCursor || isActive,
+                dimColor: !isCursor && !isActive,
+                children: [
+                  isCursor ? `${symbols.pointerActive} ` : "  ",
+                  item.icon,
+                  " ",
+                  item.label
+                ]
+              }
+            ) }, item.id);
+          })
+        ]
+      },
+      section.title
+    );
+  }) });
+}
+
+// src/components/PanelFooter.tsx
+import { Box as Box4, Text as Text3 } from "ink";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function PanelFooter({ hints, width }) {
+  return /* @__PURE__ */ jsx4(Box4, { width, children: /* @__PURE__ */ jsx4(Box4, { gap: 1, children: hints.map((hint) => /* @__PURE__ */ jsxs4(Box4, { gap: 0, children: [
+    /* @__PURE__ */ jsx4(Text3, { color: inkColors.accent, bold: true, children: hint.key }),
+    /* @__PURE__ */ jsxs4(Text3, { dimColor: true, children: [
+      ":",
+      hint.action
+    ] })
+  ] }, hint.key)) }) });
+}
+
+// src/components/Modal.tsx
+import { Box as Box5, Text as Text4 } from "ink";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function Modal({
+  title,
+  width,
+  height,
+  children
+}) {
+  const modalWidth = Math.min(width - 4, 60);
+  const modalHeight = Math.min(height - 4, 20);
+  const padX = Math.max(0, Math.floor((width - modalWidth) / 2));
+  const padY = Math.max(0, Math.floor((height - modalHeight) / 2));
+  return /* @__PURE__ */ jsxs5(Box5, { flexDirection: "column", width, height, children: [
+    padY > 0 && /* @__PURE__ */ jsx5(Box5, { height: padY }),
+    /* @__PURE__ */ jsx5(Box5, { marginLeft: padX, children: /* @__PURE__ */ jsxs5(
+      Box5,
+      {
+        flexDirection: "column",
+        width: modalWidth,
+        height: modalHeight,
+        borderStyle: "double",
+        borderColor: inkColors.accent,
+        paddingX: 1,
+        children: [
+          /* @__PURE__ */ jsx5(Box5, { marginBottom: 1, children: /* @__PURE__ */ jsx5(Text4, { color: inkColors.accent, bold: true, children: title }) }),
+          /* @__PURE__ */ jsx5(Box5, { flexDirection: "column", flexGrow: 1, overflow: "hidden", children })
+        ]
+      }
+    ) })
+  ] });
+}
+
+// src/components/FeatureCommands.tsx
+import { useMemo as useMemo3 } from "react";
+import { Box as Box6, Text as Text5 } from "ink";
+
+// src/hooks/usePinAction.ts
+import { useEffect as useEffect2 } from "react";
+import ms from "ms";
+
+// src/stores/pinStore.ts
+import { create as create4 } from "zustand";
+function loadPins() {
+  const pinnedCommands = getPinnedCommands();
+  const pinnedRuns = getPinnedRuns();
+  return {
+    pinnedCommands,
+    pinnedRuns,
+    pinnedCommandSet: new Set(pinnedCommands),
+    pinnedRunSet: new Set(pinnedRuns)
+  };
+}
+var usePinStore = create4((set, get) => ({
+  ...loadPins(),
+  pinFeedback: void 0,
+  togglePinCommand: (commandId) => {
+    const wasPinned = get().pinnedCommandSet.has(commandId);
+    togglePinnedCommand(commandId);
+    set({
+      ...loadPins(),
+      pinFeedback: wasPinned ? `Unpinned "${commandId}"` : `Pinned "${commandId}"`
+    });
+  },
+  togglePinRun: (runId) => {
+    const wasPinned = get().pinnedRunSet.has(runId);
+    togglePinnedRun(runId);
+    set({
+      ...loadPins(),
+      pinFeedback: wasPinned ? `Unpinned run "${runId}"` : `Pinned run "${runId}"`
+    });
+  },
+  refreshPins: () => {
+    set(loadPins());
+  },
+  clearFeedback: () => {
+    set({ pinFeedback: void 0 });
+  }
+}));
+
+// src/hooks/usePinAction.ts
+function usePinAction(onPinsChanged) {
+  const store = usePinStore();
+  useEffect2(() => {
+    store.refreshPins();
+  }, []);
+  useEffect2(() => {
+    if (!store.pinFeedback) return;
+    const timeout = setTimeout(() => store.clearFeedback(), ms("1.4s"));
+    return () => clearTimeout(timeout);
+  }, [store.pinFeedback]);
+  const handleRightAction = (item) => {
+    if (item.kind === "command") {
+      store.togglePinCommand(item.value);
+      onPinsChanged?.();
+      return;
+    }
+    if (item.kind === "run") {
+      store.togglePinRun(item.value);
+      onPinsChanged?.();
+    }
+  };
+  return {
+    pinnedCommands: store.pinnedCommands,
+    pinnedRuns: store.pinnedRuns,
+    pinnedCommandSet: store.pinnedCommandSet,
+    pinnedRunSet: store.pinnedRunSet,
+    pinFeedback: store.pinFeedback,
+    handleRightAction,
+    refreshPins: store.refreshPins
+  };
+}
+
+// src/components/FeatureCommands.tsx
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+function FeatureCommands({
+  feature,
+  onNavigate,
+  onExit,
+  onBack,
+  onPinsChanged,
+  width = 80,
+  height = 24,
+  isInputActive = true
+}) {
+  const {
+    pinnedCommands,
+    pinnedRuns,
+    pinFeedback,
+    handleRightAction
+  } = usePinAction(onPinsChanged);
+  const items = useMemo3(
+    () => buildHomeItems({
+      activeFeature: feature,
+      pinnedCommands,
+      pinnedRuns,
+      showPinnedSection: false,
+      showFeatureHeader: false
+    }),
+    [feature, pinnedCommands, pinnedRuns]
+  );
+  const handleSelect = (value, item) => {
+    if (!item) return;
+    if (item.kind === "command") {
+      const cmdDef = findCommandByValue(value);
+      if (cmdDef) {
+        onNavigate("command-args", {
+          command: value,
+          commandId: cmdDef.id,
+          tool: cmdDef.tool
+        });
+      } else {
+        onNavigate("command-args", { command: value, tool: "supabase" });
+      }
+      return;
+    }
+    if (item.kind === "run") {
+      const args = value.split(" ").filter(Boolean);
+      if (args.length > 0) {
+        const basePart = args[0] ?? "";
+        const cmdDef = findCommandByValue(basePart);
+        const tool = cmdDef?.tool ?? "supabase";
+        onNavigate("confirm-execute", { args, tool, interactive: cmdDef?.interactive });
+      }
+      return;
+    }
+  };
+  return /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", paddingX: 1, children: [
+    pinFeedback && /* @__PURE__ */ jsx6(Box6, { marginBottom: 1, children: /* @__PURE__ */ jsxs6(Text5, { color: inkColors.accent, children: [
+      "\u2713 ",
+      pinFeedback
+    ] }) }),
+    /* @__PURE__ */ jsx6(
+      SelectList,
+      {
+        items,
+        onSelect: handleSelect,
+        onRightAction: handleRightAction,
+        boxedSections: true,
+        width: Math.max(20, width - 4),
+        maxVisible: Math.max(6, height - 6),
+        onCancel: onBack,
+        isInputActive,
+        arrowNavigation: true,
+        panelFocused: isInputActive
+      }
+    )
+  ] });
+}
+
+// src/components/PinnedCommands.tsx
+import { useMemo as useMemo4 } from "react";
+import { Box as Box7, Text as Text6 } from "ink";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function PinnedCommands({
+  onNavigate,
+  onBack,
+  onPinsChanged,
+  width = 80,
+  height = 24,
+  isInputActive = true
+}) {
+  const {
+    pinnedCommands,
+    pinnedRuns,
+    pinFeedback,
+    handleRightAction
+  } = usePinAction(onPinsChanged);
+  const items = useMemo4(
+    () => buildPinnedOnlyItems(pinnedCommands, pinnedRuns),
+    [pinnedCommands, pinnedRuns]
+  );
+  const handleSelect = (value, item) => {
+    if (!item) return;
+    if (item.kind === "command") {
+      const cmdDef = findCommandByValue(value);
+      if (cmdDef) {
+        onNavigate("command-args", {
+          command: value,
+          commandId: cmdDef.id,
+          tool: cmdDef.tool
+        });
+      } else {
+        onNavigate("command-args", { command: value, tool: "supabase" });
+      }
+      return;
+    }
+    if (item.kind === "run") {
+      const args = value.split(" ").filter(Boolean);
+      if (args.length > 0) {
+        const basePart = args[0] ?? "";
+        const cmdDef = findCommandByValue(basePart);
+        const tool = cmdDef?.tool ?? "supabase";
+        onNavigate("confirm-execute", { args, tool, interactive: cmdDef?.interactive });
+      }
+    }
+  };
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsx7(Box7, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ jsx7(Text6, { color: "gray", children: "No pinned items. Press p on any command to pin it." }) });
+  }
+  return /* @__PURE__ */ jsxs7(Box7, { flexDirection: "column", paddingX: 1, children: [
+    pinFeedback && /* @__PURE__ */ jsx7(Box7, { marginBottom: 1, children: /* @__PURE__ */ jsxs7(Text6, { color: inkColors.accent, children: [
+      "\u2713 ",
+      pinFeedback
+    ] }) }),
+    /* @__PURE__ */ jsx7(
+      SelectList,
+      {
+        items,
+        onSelect: handleSelect,
+        onRightAction: handleRightAction,
+        boxedSections: true,
+        width: Math.max(20, width - 4),
+        maxVisible: Math.max(6, height - 6),
+        onCancel: onBack,
+        isInputActive,
+        arrowNavigation: true,
+        panelFocused: isInputActive
+      }
+    )
+  ] });
+}
+
+// src/screens/DeclarativeHome.tsx
+import { useMemo as useMemo5 } from "react";
+import { Box as Box8 } from "ink";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var ITEMS = [
+  { value: "declarative-plan", label: "Plan / Apply", hint: "Diff and apply polter.yaml", kind: "action" },
+  { value: "declarative-status", label: "Infrastructure Status", hint: "Live state from CLI tools", kind: "action" },
+  { value: "init-scaffold", label: "Init polter.yaml", hint: "Generate from detected state", kind: "action" }
+];
+function DeclarativeHome({
+  onNavigate,
+  onBack,
+  width = 80,
+  height = 24,
+  isInputActive = true
+}) {
+  const handleSelect = useMemo5(
+    () => (value) => onNavigate(value),
+    [onNavigate]
+  );
+  return /* @__PURE__ */ jsx8(Box8, { flexDirection: "column", paddingX: 1, children: /* @__PURE__ */ jsx8(
+    SelectList,
+    {
+      items: ITEMS,
+      onSelect: handleSelect,
+      onCancel: onBack,
+      width: Math.max(20, width - 4),
+      maxVisible: Math.max(6, height - 4),
+      isInputActive,
+      arrowNavigation: true,
+      panelFocused: isInputActive
+    }
+  ) });
+}
+
+// src/appPanel.tsx
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+var screenLabels = {
+  "command-args": "Args",
+  "flag-selection": "Flags",
+  "confirm-execute": "Execute",
+  "command-execution": "Execute",
+  "custom-command": "Custom Cmd",
+  "pipeline-list": "Pipelines",
+  "pipeline-builder": "Builder",
+  "pipeline-execution": "Run",
+  "self-update": "Update",
+  "tool-status": "Status",
+  "project-config": "Config",
+  "mcp-manage": "MCP",
+  "process-list": "Processes",
+  "process-logs": "Logs",
+  "declarative-plan": "Plan/Apply",
+  "declarative-status": "Status",
+  "init-scaffold": "Init",
+  "script-picker": "Scripts",
+  "skill-setup": "Skill Setup"
+};
+function buildBreadcrumb(nav) {
+  let base;
+  switch (nav.view) {
+    case "feature": {
+      const feat = getFeatureById(nav.featureId);
+      base = feat ? `${feat.icon} ${feat.label}` : nav.featureId;
+      break;
+    }
+    case "pinned":
+      base = "\u{1F4CC} Pinned";
+      break;
+    case "custom-command":
+      base = "\u270F\uFE0F Custom Cmd";
+      break;
+    case "pipelines":
+      base = "\u{1F517} Pipelines";
+      break;
+    case "tool-status":
+      base = "\u{1F527} Status";
+      break;
+    case "config":
+      base = "\u2699\uFE0F Config";
+      break;
+    case "self-update":
+      base = "\u2B06\uFE0F Update";
+      break;
+    case "processes":
+      base = "\u{1F4BB} Processes";
+      break;
+    case "scripts":
+      base = "\u{1F4DC} Scripts";
+      break;
+    case "declarative":
+      base = "\u{1F3D7}\uFE0F Infrastructure";
+      break;
+    case "skill-setup":
+      base = "\u{1F9E0} Skill Setup";
+      break;
+    default:
+      base = nav.view;
+  }
+  if (nav.innerScreen === "home") {
+    return base;
+  }
+  const parts = [base];
+  for (const entry of nav.innerStack) {
+    if (entry.screen !== "home") {
+      parts.push(screenLabels[entry.screen] ?? entry.screen);
+    }
+  }
+  parts.push(screenLabels[nav.innerScreen] ?? nav.innerScreen);
+  return parts.join(" \u203A ");
+}
+var FOOTER_HINTS = [
+  { key: "Tab", action: "focus" },
+  { key: "\u2190/Esc", action: "back" },
+  { key: "\u2192/Enter", action: "select" },
+  { key: "j/k", action: "nav" },
+  { key: "p", action: "pin" },
+  { key: "q", action: "quit" },
+  { key: "?", action: "help" }
+];
+function AppPanel() {
+  useFullscreen();
+  const { width, height } = useTerminalDimensions();
+  const { exit } = useApp();
+  const nav = usePanelNavigation();
+  const focus = usePanelFocus();
+  const sidebarItems = useSidebarItems();
+  const modal = useModal();
+  const singlePanel = width < 60 || height < 15;
+  const handleExit = () => {
+    process.stdout.write(
+      "\n" + colors.dim("Thank you for using ") + colors.primaryBold("Polter") + colors.dim("!") + "\n\n"
+    );
+    exit();
+  };
+  useInput2((input, key) => {
+    if (modal.isOpen) {
+      if (key.escape || input === "q") {
+        modal.closeModal();
+      }
+      return;
+    }
+    if (input === "q") {
+      handleExit();
+      return;
+    }
+    if (key.tab) {
+      focus.toggleFocus();
+      return;
+    }
+    if (key.leftArrow && focus.isMainFocused && nav.innerScreen === "home") {
+      focus.focusSidebar();
+      return;
+    }
+    if (key.escape && focus.isMainFocused && nav.innerScreen === "home") {
+      focus.focusSidebar();
+      return;
+    }
+    if (input === "?") {
+      modal.openModal(
+        /* @__PURE__ */ jsxs8(Box9, { flexDirection: "column", children: [
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "\u2190/\u2192" }),
+            "    Move between sidebar and main panel"
+          ] }),
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "Tab" }),
+            "     Toggle sidebar / main panel"
+          ] }),
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "j/k" }),
+            "     Navigate up/down"
+          ] }),
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "Enter" }),
+            "   Select item"
+          ] }),
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "Esc" }),
+            "     Go back (or return to sidebar)"
+          ] }),
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "q" }),
+            "       Quit Polter"
+          ] }),
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "?" }),
+            "       Show this help"
+          ] }),
+          /* @__PURE__ */ jsxs8(Text7, { children: [
+            /* @__PURE__ */ jsx9(Text7, { bold: true, children: "p" }),
+            "       Pin/unpin command"
+          ] })
+        ] }),
+        "Keyboard Shortcuts"
+      );
+    }
+  });
+  const activeSidebarId = (() => {
+    switch (nav.view) {
+      case "feature":
+        return nav.featureId;
+      case "pinned":
+        return "pinned";
+      case "custom-command":
+        return "custom-command";
+      case "pipelines":
+        return "pipelines";
+      case "tool-status":
+        return "tool-status";
+      case "config":
+        return "config";
+      case "self-update":
+        return "self-update";
+      case "processes":
+        return "processes";
+      case "scripts":
+        return "scripts";
+      case "declarative":
+        return "declarative";
+      case "skill-setup":
+        return "skill-setup";
+      default:
+        return nav.featureId;
+    }
+  })();
+  const handleSidebarHighlight = (itemId) => {
+    if (itemId === "exit") return;
+    nav.selectSidebarItem(itemId);
+  };
+  const handleSidebarSelect = (itemId) => {
+    if (itemId === "exit") {
+      handleExit();
+      return;
+    }
+    nav.selectSidebarItem(itemId);
+    focus.focusMain();
+  };
+  const bannerHeight = width < 60 ? 6 : 10;
+  const footerHints = FOOTER_HINTS;
+  const mainContentHeight = Math.max(5, height - bannerHeight - 1 - 2);
+  const mainContentWidth = singlePanel ? width : width - Math.max(20, Math.min(35, Math.floor(width * 0.3)));
+  const renderMainContent = () => {
+    if (nav.innerScreen !== "home") {
+      return renderInnerScreen();
+    }
+    switch (nav.view) {
+      case "pinned":
+        return /* @__PURE__ */ jsx9(
+          PinnedCommands,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "feature": {
+        const feature = getFeatureById(nav.featureId);
+        if (!feature) {
+          return /* @__PURE__ */ jsxs8(Text7, { color: "red", children: [
+            "Feature not found: ",
+            nav.featureId
+          ] });
+        }
+        return /* @__PURE__ */ jsx9(
+          FeatureCommands,
+          {
+            feature,
+            onNavigate: nav.navigateInner,
+            onExit: handleExit,
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      }
+      case "custom-command":
+        return /* @__PURE__ */ jsx9(
+          CustomCommand,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "pipelines":
+        return /* @__PURE__ */ jsx9(
+          PipelineList,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "tool-status":
+        return /* @__PURE__ */ jsx9(
+          ToolStatus,
+          {
+            onBack: focus.focusSidebar,
+            onNavigate: nav.navigateInner,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "processes":
+        return /* @__PURE__ */ jsx9(
+          ProcessList,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "scripts":
+        return /* @__PURE__ */ jsx9(
+          ScriptPicker,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "declarative":
+        return /* @__PURE__ */ jsx9(
+          DeclarativeHome,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "skill-setup":
+        return /* @__PURE__ */ jsx9(
+          SkillSetup,
+          {
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "config":
+        return /* @__PURE__ */ jsx9(
+          ProjectConfig,
+          {
+            onBack: focus.focusSidebar,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      case "self-update":
+        return /* @__PURE__ */ jsx9(
+          SelfUpdate,
+          {
+            onBack: focus.focusSidebar,
+            onExit: handleExit,
+            width: mainContentWidth - 2,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: focus.isMainFocused
+          }
+        );
+      default:
+        return /* @__PURE__ */ jsx9(Text7, { children: "Select an item from the sidebar" });
+    }
+  };
+  const renderInnerScreen = () => {
+    const isActive = focus.isMainFocused;
+    const w = mainContentWidth - 2;
+    switch (nav.innerScreen) {
+      case "command-args":
+        return /* @__PURE__ */ jsx9(
+          CommandArgs,
+          {
+            command: nav.innerParams.command ?? "",
+            tool: nav.innerParams.tool,
+            onNavigate: nav.navigateInner,
+            onBack: nav.goBackInner,
+            width: w,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "custom-command":
+        return /* @__PURE__ */ jsx9(
+          CustomCommand,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "flag-selection":
+        return /* @__PURE__ */ jsx9(
+          FlagSelection,
+          {
+            args: nav.innerParams.args ?? [],
+            tool: nav.innerParams.tool,
+            interactive: nav.innerParams.interactive,
+            onNavigate: nav.navigateInner,
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "confirm-execute":
+      case "command-execution":
+        return /* @__PURE__ */ jsx9(
+          CommandExecution,
+          {
+            args: nav.innerParams.args ?? [],
+            tool: nav.innerParams.tool,
+            rawCommand: nav.innerParams.rawCommand,
+            interactive: nav.innerParams.interactive,
+            cwd: nav.innerParams.cwd,
+            onBack: nav.goBackInner,
+            onHome: nav.goHomeInner,
+            onExit: handleExit,
+            onRunSuggestion: (sugTool, sugArgs) => {
+              nav.switchViewAndNavigate("custom-command", "confirm-execute", { tool: sugTool, args: sugArgs, interactive: true });
+            },
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          },
+          `${nav.view}-${nav.innerParams.tool}-${(nav.innerParams.args ?? []).join("-")}`
+        );
+      case "pipeline-list":
+        return /* @__PURE__ */ jsx9(
+          PipelineList,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "pipeline-builder":
+        return /* @__PURE__ */ jsx9(
+          PipelineBuilder,
+          {
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "pipeline-execution":
+        return /* @__PURE__ */ jsx9(
+          PipelineExecution,
+          {
+            pipelineId: nav.innerParams.pipelineId ?? "",
+            onBack: nav.goBackInner,
+            onExit: handleExit,
+            width: w,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "self-update":
+        return /* @__PURE__ */ jsx9(
+          SelfUpdate,
+          {
+            onBack: nav.goBackInner,
+            onExit: handleExit,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "tool-status":
+        return /* @__PURE__ */ jsx9(
+          ToolStatus,
+          {
+            onBack: nav.goBackInner,
+            onNavigate: nav.navigateInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "mcp-manage":
+        return /* @__PURE__ */ jsx9(
+          McpManage,
+          {
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "process-list":
+        return /* @__PURE__ */ jsx9(
+          ProcessList,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "process-logs":
+        return /* @__PURE__ */ jsx9(
+          ProcessLogs,
+          {
+            processId: nav.innerParams.processId ?? "",
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "project-config":
+        return /* @__PURE__ */ jsx9(
+          ProjectConfig,
+          {
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "declarative-plan":
+        return /* @__PURE__ */ jsx9(
+          DeclarativePlan,
+          {
+            onBack: nav.goBackInner,
+            onNavigate: nav.navigateInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "declarative-status":
+        return /* @__PURE__ */ jsx9(
+          DeclarativeStatus,
+          {
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "init-scaffold":
+        return /* @__PURE__ */ jsx9(
+          InitScaffold,
+          {
+            onBack: nav.goBackInner,
+            onNavigate: nav.navigateInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "script-picker":
+        return /* @__PURE__ */ jsx9(
+          ScriptPicker,
+          {
+            onNavigate: nav.navigateInner,
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      case "skill-setup":
+        return /* @__PURE__ */ jsx9(
+          SkillSetup,
+          {
+            onBack: nav.goBackInner,
+            width: w,
+            height: mainContentHeight,
+            panelMode: true,
+            isInputActive: isActive
+          }
+        );
+      default:
+        return /* @__PURE__ */ jsxs8(Text7, { color: "red", children: [
+          "Unknown screen: ",
+          nav.innerScreen
+        ] });
+    }
+  };
+  if (modal.isOpen) {
+    return /* @__PURE__ */ jsx9(Box9, { flexDirection: "column", width, height, children: /* @__PURE__ */ jsx9(Modal, { title: modal.modalTitle, width, height, children: modal.modalContent }) });
+  }
+  const header = /* @__PURE__ */ jsx9(GhostBanner, { width, compact: true });
+  const sidebar = /* @__PURE__ */ jsx9(
+    Panel,
+    {
+      id: "sidebar",
+      title: "Menu",
+      width: Math.max(20, Math.min(35, Math.floor(width * 0.3))),
+      height: Math.max(5, height - bannerHeight - 1),
+      focused: focus.isSidebarFocused,
+      children: /* @__PURE__ */ jsx9(
+        Sidebar,
+        {
+          items: sidebarItems,
+          selectedId: activeSidebarId,
+          isFocused: focus.isSidebarFocused,
+          height: Math.max(5, height - bannerHeight - 4),
+          onSelect: handleSidebarSelect,
+          onHighlight: handleSidebarHighlight
+        }
+      )
+    }
+  );
+  const main = /* @__PURE__ */ jsx9(
+    Panel,
+    {
+      id: "main",
+      title: buildBreadcrumb(nav),
+      width: mainContentWidth,
+      height: Math.max(5, height - bannerHeight - 1),
+      focused: focus.isMainFocused,
+      children: renderMainContent()
+    }
+  );
+  const footer = /* @__PURE__ */ jsx9(PanelFooter, { hints: footerHints, width });
+  return /* @__PURE__ */ jsx9(
+    PanelLayout,
+    {
+      header,
+      footer,
+      sidebar,
+      main,
+      width,
+      height,
+      bannerHeight,
+      singlePanel
+    }
+  );
+}
+export {
+  AppPanel
+};