tuidoscope 0.1.4

package/dist/index.js

@@ -0,0 +1,1717 @@
+// @bun
+// src/index.tsx
+import { render, extend } from "@opentui/solid";
+import { GhosttyTerminalRenderable } from "ghostty-opentui/terminal-buffer";
+
+// src/app.tsx
+import { Show as Show3, createSignal as createSignal4, createEffect as createEffect2, onCleanup, createMemo as createMemo3 } from "solid-js";
+import { useKeyboard as useKeyboard4, useTerminalDimensions, useRenderer } from "@opentui/solid";
+
+// src/components/TabList.tsx
+import { For, createMemo } from "solid-js";
+
+// src/components/TabItem.tsx
+import { jsxDEV } from "@opentui/solid/jsx-dev-runtime";
+function getStatusIndicator(status) {
+  switch (status) {
+    case "running":
+      return "\u25CF";
+    case "stopped":
+      return "\u25CB";
+    case "error":
+      return "\u2716";
+  }
+}
+function getStatusColor(status, theme) {
+  switch (status) {
+    case "running":
+      return "#9ece6a";
+    case "stopped":
+      return theme.muted;
+    case "error":
+      return "#f7768e";
+  }
+}
+var TabItem = (props) => {
+  const truncatedName = () => {
+    const maxLen = props.width - 4;
+    if (props.entry.name.length > maxLen) {
+      return props.entry.name.slice(0, maxLen - 1) + "\u2026";
+    }
+    return props.entry.name;
+  };
+  const bgColor = () => {
+    if (props.isActive) {
+      return props.theme.primary;
+    }
+    if (props.isFocused) {
+      return props.theme.muted;
+    }
+    return props.theme.background;
+  };
+  const fgColor = () => {
+    if (props.isActive) {
+      return props.theme.background;
+    }
+    return props.theme.foreground;
+  };
+  return /* @__PURE__ */ jsxDEV("box", {
+    height: 1,
+    width: props.width,
+    flexDirection: "row",
+    onMouseDown: props.onSelect,
+    children: [
+      /* @__PURE__ */ jsxDEV("text", {
+        fg: getStatusColor(props.status, props.theme),
+        children: getStatusIndicator(props.status)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV("text", {
+        children: " "
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV("text", {
+        fg: fgColor(),
+        bg: bgColor(),
+        children: props.isActive ? /* @__PURE__ */ jsxDEV("b", {
+          children: truncatedName()
+        }, undefined, false, undefined, this) : truncatedName()
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+
+// src/components/TabList.tsx
+import { jsxDEV as jsxDEV2 } from "@opentui/solid/jsx-dev-runtime";
+var TabList = (props) => {
+  const visibleHeight = () => props.height - 2;
+  const visibleEntries = createMemo(() => {
+    const start = props.scrollOffset;
+    const end = start + visibleHeight();
+    return props.entries.slice(start, end);
+  });
+  const hasScrollUp = () => props.scrollOffset > 0;
+  const hasScrollDown = () => props.scrollOffset + visibleHeight() < props.entries.length;
+  return /* @__PURE__ */ jsxDEV2("box", {
+    flexDirection: "column",
+    width: props.width,
+    height: props.height,
+    borderStyle: "single",
+    borderColor: props.isFocused ? props.theme.primary : props.theme.muted,
+    children: [
+      /* @__PURE__ */ jsxDEV2("box", {
+        height: 1,
+        width: props.width - 2,
+        children: /* @__PURE__ */ jsxDEV2("text", {
+          fg: props.theme.accent,
+          children: /* @__PURE__ */ jsxDEV2("b", {
+            children: [
+              "Apps ",
+              hasScrollUp() ? "\u25B2" : " ",
+              hasScrollDown() ? "\u25BC" : " "
+            ]
+          }, undefined, true, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV2("box", {
+        flexDirection: "column",
+        flexGrow: 1,
+        children: /* @__PURE__ */ jsxDEV2(For, {
+          each: visibleEntries(),
+          children: (entry, index) => {
+            const actualIndex = () => props.scrollOffset + index();
+            return /* @__PURE__ */ jsxDEV2(TabItem, {
+              entry,
+              status: props.getStatus(entry.id),
+              isActive: entry.id === props.activeTabId,
+              isFocused: props.isFocused && actualIndex() === props.selectedIndex,
+              width: props.width - 2,
+              theme: props.theme,
+              onSelect: () => props.onSelect(entry.id)
+            }, undefined, false, undefined, this);
+          }
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV2("box", {
+        height: 1,
+        width: props.width - 2,
+        onMouseDown: props.onAddClick,
+        children: /* @__PURE__ */ jsxDEV2("text", {
+          fg: props.theme.muted,
+          children: "[+ Add]"
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+
+// src/components/TerminalPane.tsx
+import { Show } from "solid-js";
+import { jsxDEV as jsxDEV3 } from "@opentui/solid/jsx-dev-runtime";
+var TerminalPane = (props) => {
+  const contentWidth = () => Math.max(1, props.width - 2);
+  const contentHeight = () => Math.max(1, props.height - 3);
+  return /* @__PURE__ */ jsxDEV3("box", {
+    flexDirection: "column",
+    flexGrow: 1,
+    height: props.height,
+    borderStyle: "single",
+    borderColor: props.isFocused ? props.theme.primary : props.theme.muted,
+    children: /* @__PURE__ */ jsxDEV3(Show, {
+      when: props.runningApp,
+      fallback: /* @__PURE__ */ jsxDEV3("box", {
+        flexGrow: 1,
+        justifyContent: "center",
+        alignItems: "center",
+        children: /* @__PURE__ */ jsxDEV3("text", {
+          fg: props.theme.muted,
+          children: "No app selected. Press Ctrl+T to add one."
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      children: (app) => /* @__PURE__ */ jsxDEV3("box", {
+        flexDirection: "column",
+        flexGrow: 1,
+        children: [
+          /* @__PURE__ */ jsxDEV3("box", {
+            height: 1,
+            flexDirection: "row",
+            children: [
+              /* @__PURE__ */ jsxDEV3("text", {
+                fg: props.theme.accent,
+                children: /* @__PURE__ */ jsxDEV3("b", {
+                  children: app().entry.name
+                }, undefined, false, undefined, this)
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV3("text", {
+                fg: props.theme.muted,
+                children: [
+                  " ",
+                  "(",
+                  app().status,
+                  ")"
+                ]
+              }, undefined, true, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV3("box", {
+            width: contentWidth(),
+            height: contentHeight(),
+            overflow: "hidden",
+            children: /* @__PURE__ */ jsxDEV3("ghostty-terminal", {
+              ansi: app().buffer,
+              cols: contentWidth(),
+              rows: contentHeight(),
+              showCursor: true,
+              style: { width: contentWidth(), height: contentHeight() }
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+};
+
+// src/components/StatusBar.tsx
+import { Show as Show2 } from "solid-js";
+
+// src/lib/keybinds.ts
+function parseKeybind(keybind) {
+  const parts = keybind.toLowerCase().split("+");
+  const key = parts[parts.length - 1];
+  return {
+    key,
+    ctrl: parts.includes("ctrl"),
+    alt: parts.includes("alt"),
+    shift: parts.includes("shift"),
+    meta: parts.includes("meta") || parts.includes("cmd")
+  };
+}
+function matchesKeybind(event, keybind) {
+  const parsed = parseKeybind(keybind);
+  const eventAlt = event.option ?? false;
+  const eventName = event.name.toLowerCase();
+  const isSpaceKey = parsed.key === "space";
+  const eventIsSpace = eventName === "space" || eventName === " " || event.sequence === " " || event.sequence === "\x00";
+  const ctrlSequence = parsed.ctrl && parsed.key.length === 1 && parsed.key >= "a" && parsed.key <= "z" ? String.fromCharCode(parsed.key.charCodeAt(0) - 96) : null;
+  const ctrlSequenceMatch = !!ctrlSequence && event.sequence === ctrlSequence;
+  const keyMatches = isSpaceKey ? eventIsSpace : eventName === parsed.key || ctrlSequenceMatch;
+  const ctrlMatches = parsed.ctrl ? event.ctrl || ctrlSequenceMatch : !event.ctrl;
+  return keyMatches && ctrlMatches && eventAlt === parsed.alt && event.shift === parsed.shift && event.meta === parsed.meta;
+}
+function createKeybindHandler(config, handlers) {
+  const keybindMap = {
+    [config.next_tab]: "next_tab",
+    [config.prev_tab]: "prev_tab",
+    [config.close_tab]: "close_tab",
+    [config.new_tab]: "new_tab",
+    [config.toggle_focus]: "toggle_focus",
+    [config.edit_app]: "edit_app",
+    [config.restart_app]: "restart_app",
+    [config.command_palette]: "command_palette",
+    [config.stop_app]: "stop_app",
+    [config.kill_all]: "kill_all",
+    [config.quit]: "quit"
+  };
+  return (event) => {
+    for (const [keybind, action] of Object.entries(keybindMap)) {
+      if (matchesKeybind(event, keybind)) {
+        const handler = handlers[action];
+        if (handler) {
+          handler();
+          return true;
+        }
+      }
+    }
+    return false;
+  };
+}
+function formatKeybind(keybind) {
+  return keybind.split("+").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("+");
+}
+
+// src/components/StatusBar.tsx
+import { jsxDEV as jsxDEV4 } from "@opentui/solid/jsx-dev-runtime";
+var StatusBar = (props) => {
+  return /* @__PURE__ */ jsxDEV4("box", {
+    height: 1,
+    flexDirection: "row",
+    backgroundColor: props.theme.muted,
+    children: [
+      /* @__PURE__ */ jsxDEV4("box", {
+        flexGrow: 1,
+        children: /* @__PURE__ */ jsxDEV4("text", {
+          fg: props.theme.foreground,
+          children: [
+            " ",
+            formatKeybind(props.keybinds.toggle_focus),
+            ":Focus",
+            " | ",
+            formatKeybind(props.keybinds.command_palette),
+            ":Palette",
+            " | ",
+            formatKeybind(props.keybinds.edit_app),
+            ":Edit",
+            " | ",
+            formatKeybind(props.keybinds.stop_app),
+            ":Stop",
+            " | ",
+            formatKeybind(props.keybinds.kill_all),
+            ":KillAll",
+            " | ",
+            formatKeybind(props.keybinds.quit),
+            ":Quit"
+          ]
+        }, undefined, true, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV4("box", {
+        children: /* @__PURE__ */ jsxDEV4(Show2, {
+          when: props.message,
+          fallback: /* @__PURE__ */ jsxDEV4(Show2, {
+            when: props.appName,
+            children: /* @__PURE__ */ jsxDEV4("text", {
+              fg: props.theme.accent,
+              children: [
+                props.appName,
+                props.appStatus ? ` (${props.appStatus})` : ""
+              ]
+            }, undefined, true, undefined, this)
+          }, undefined, false, undefined, this),
+          children: /* @__PURE__ */ jsxDEV4("text", {
+            fg: props.theme.accent,
+            children: /* @__PURE__ */ jsxDEV4("b", {
+              children: props.message
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV4("box", {
+        children: /* @__PURE__ */ jsxDEV4("text", {
+          fg: props.theme.foreground,
+          children: [
+            props.focusMode === "terminal" ? "[TERMINAL]" : "[TABS]",
+            " "
+          ]
+        }, undefined, true, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+
+// src/components/CommandPalette.tsx
+import { For as For2, createSignal, createMemo as createMemo2, createEffect } from "solid-js";
+import { useKeyboard } from "@opentui/solid";
+
+// src/lib/fuzzy.ts
+import Fuse from "fuse.js";
+function createAppSearch(entries) {
+  const fuse = new Fuse(entries, {
+    keys: ["name", "command", "args"],
+    threshold: 0.4,
+    includeScore: true
+  });
+  return {
+    search: (query) => {
+      if (!query.trim()) {
+        return entries.map((item) => ({ item, score: 0 }));
+      }
+      const results = fuse.search(query);
+      return results.map((r) => ({
+        item: r.item,
+        score: r.score ?? 0
+      }));
+    },
+    update: (newEntries) => {
+      fuse.setCollection(newEntries);
+    }
+  };
+}
+
+// src/lib/command.ts
+function buildCommand(command, args) {
+  const trimmedArgs = args?.trim();
+  return trimmedArgs ? `${command} ${trimmedArgs}` : command;
+}
+function buildEntryCommand(entry) {
+  return buildCommand(entry.command, entry.args);
+}
+
+// src/components/CommandPalette.tsx
+import { jsxDEV as jsxDEV5 } from "@opentui/solid/jsx-dev-runtime";
+var CommandPalette = (props) => {
+  const [query, setQuery] = createSignal("");
+  const [selectedIndex, setSelectedIndex] = createSignal(0);
+  const search = createMemo2(() => createAppSearch(props.entries));
+  const results = createMemo2(() => {
+    return search().search(query());
+  });
+  useKeyboard((event) => {
+    if (event.name === "escape") {
+      props.onClose();
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "return" || event.name === "enter") {
+      const selected = results()[selectedIndex()];
+      if (selected) {
+        props.onSelect(selected.item, "switch");
+      }
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "x") {
+      const selected = results()[selectedIndex()];
+      if (selected) {
+        props.onSelect(selected.item, "stop");
+      }
+      event.preventDefault();
+      return;
+    }
+    if (event.ctrl && event.name === "e" || event.sequence === "\x05") {
+      const selected = results()[selectedIndex()];
+      if (selected) {
+        props.onSelect(selected.item, "edit");
+      }
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "up" || event.name === "k") {
+      setSelectedIndex((current) => Math.max(0, current - 1));
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "down" || event.name === "j") {
+      setSelectedIndex((current) => Math.min(results().length - 1, current + 1));
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "backspace") {
+      setQuery((current) => current.slice(0, -1));
+      event.preventDefault();
+      return;
+    }
+    if (!event.ctrl && !event.meta && !event.option && event.sequence && event.sequence.length === 1) {
+      setQuery((current) => current + event.sequence);
+      event.preventDefault();
+    }
+  });
+  createEffect(() => {
+    results();
+    setSelectedIndex(0);
+  });
+  return /* @__PURE__ */ jsxDEV5("box", {
+    position: "absolute",
+    top: "20%",
+    left: "20%",
+    width: "60%",
+    height: "60%",
+    flexDirection: "column",
+    borderStyle: "double",
+    borderColor: props.theme.primary,
+    backgroundColor: props.theme.background,
+    children: [
+      /* @__PURE__ */ jsxDEV5("box", {
+        height: 1,
+        flexDirection: "row",
+        borderStyle: "single",
+        borderColor: props.theme.muted,
+        children: /* @__PURE__ */ jsxDEV5("text", {
+          fg: props.theme.foreground,
+          children: `> ${query()}\u2588`
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV5("box", {
+        flexDirection: "column",
+        flexGrow: 1,
+        overflow: "hidden",
+        children: /* @__PURE__ */ jsxDEV5(For2, {
+          each: results().slice(0, 10),
+          children: (result, index) => /* @__PURE__ */ jsxDEV5("box", {
+            height: 1,
+            width: "100%",
+            flexDirection: "row",
+            backgroundColor: index() === selectedIndex() ? props.theme.primary : props.theme.background,
+            onMouseDown: () => props.onSelect(result.item, "switch"),
+            children: /* @__PURE__ */ jsxDEV5("text", {
+              width: "100%",
+              fg: index() === selectedIndex() ? props.theme.background : props.theme.foreground,
+              bg: index() === selectedIndex() ? props.theme.primary : props.theme.background,
+              children: [
+                " ",
+                `${result.item.name} - ${buildEntryCommand(result.item)}`
+              ]
+            }, undefined, true, undefined, this)
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV5("box", {
+        height: 1,
+        borderStyle: "single",
+        borderColor: props.theme.muted,
+        children: /* @__PURE__ */ jsxDEV5("text", {
+          fg: props.theme.muted,
+          children: "Enter:Select | x:Stop | Ctrl+E:Edit | Esc:Close | \u2191\u2193:Navigate"
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+
+// src/components/AddTabModal.tsx
+import { createSignal as createSignal2 } from "solid-js";
+import { useKeyboard as useKeyboard2 } from "@opentui/solid";
+import { jsxDEV as jsxDEV6 } from "@opentui/solid/jsx-dev-runtime";
+var AddTabModal = (props) => {
+  const [name, setName] = createSignal2("");
+  const [command, setCommand] = createSignal2("");
+  const [args, setArgs] = createSignal2("");
+  const [cwd, setCwd] = createSignal2("~");
+  const [focusedField, setFocusedField] = createSignal2("name");
+  const fields = [
+    { key: "name", label: "Name", value: name, setValue: setName },
+    { key: "command", label: "Command", value: command, setValue: setCommand },
+    { key: "args", label: "Arguments", value: args, setValue: setArgs },
+    { key: "cwd", label: "Directory", value: cwd, setValue: setCwd }
+  ];
+  const focusIndex = () => fields.findIndex((field) => field.key === focusedField());
+  const setFocusByIndex = (index) => {
+    const clamped = Math.max(0, Math.min(fields.length - 1, index));
+    setFocusedField(fields[clamped].key);
+  };
+  const handleSubmit = () => {
+    if (name() && command()) {
+      props.onAdd({
+        name: name(),
+        command: command(),
+        args: args().trim() || undefined,
+        cwd: cwd() || "~",
+        autostart: false
+      });
+    }
+  };
+  useKeyboard2((event) => {
+    if (event.name === "escape") {
+      props.onClose();
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "tab") {
+      const direction = event.shift ? -1 : 1;
+      setFocusByIndex(focusIndex() + direction);
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "return" || event.name === "enter") {
+      handleSubmit();
+      event.preventDefault();
+      return;
+    }
+    const focused = fields[focusIndex()];
+    if (!focused) {
+      return;
+    }
+    if (event.name === "backspace") {
+      focused.setValue(focused.value().slice(0, -1));
+      event.preventDefault();
+      return;
+    }
+    if (!event.ctrl && !event.meta && !event.option && event.sequence && event.sequence.length === 1) {
+      focused.setValue(focused.value() + event.sequence);
+      event.preventDefault();
+    }
+  });
+  return /* @__PURE__ */ jsxDEV6("box", {
+    position: "absolute",
+    top: "30%",
+    left: "25%",
+    width: "50%",
+    height: 11,
+    flexDirection: "column",
+    borderStyle: "double",
+    borderColor: props.theme.primary,
+    backgroundColor: props.theme.background,
+    children: [
+      /* @__PURE__ */ jsxDEV6("box", {
+        height: 1,
+        children: /* @__PURE__ */ jsxDEV6("text", {
+          fg: props.theme.accent,
+          children: /* @__PURE__ */ jsxDEV6("b", {
+            children: " Add New App"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      fields.map((field) => {
+        const isFocused = () => focusedField() === field.key;
+        return /* @__PURE__ */ jsxDEV6("box", {
+          height: 1,
+          flexDirection: "row",
+          children: [
+            /* @__PURE__ */ jsxDEV6("box", {
+              width: 12,
+              children: /* @__PURE__ */ jsxDEV6("text", {
+                fg: isFocused() ? props.theme.accent : props.theme.muted,
+                children: [
+                  field.label,
+                  ":"
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV6("text", {
+              fg: isFocused() ? props.theme.foreground : props.theme.muted,
+              bg: isFocused() ? props.theme.primary : undefined,
+              children: [
+                " ",
+                field.value(),
+                isFocused() ? "\u2588" : " "
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this);
+      }),
+      /* @__PURE__ */ jsxDEV6("box", {
+        height: 1,
+        children: /* @__PURE__ */ jsxDEV6("text", {
+          fg: props.theme.muted,
+          children: "Enter:Add | Esc:Cancel | Tab:Next field"
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+
+// src/components/EditAppModal.tsx
+import { createSignal as createSignal3 } from "solid-js";
+import { useKeyboard as useKeyboard3 } from "@opentui/solid";
+import { jsxDEV as jsxDEV7 } from "@opentui/solid/jsx-dev-runtime";
+var EditAppModal = (props) => {
+  const [name, setName] = createSignal3(props.entry.name ?? "");
+  const [command, setCommand] = createSignal3(props.entry.command ?? "");
+  const [args, setArgs] = createSignal3(props.entry.args ?? "");
+  const [cwd, setCwd] = createSignal3(props.entry.cwd ?? "");
+  const [focusedField, setFocusedField] = createSignal3("name");
+  const fields = [
+    { key: "name", label: "Name", value: name, setValue: setName },
+    { key: "command", label: "Command", value: command, setValue: setCommand },
+    { key: "args", label: "Arguments", value: args, setValue: setArgs },
+    { key: "cwd", label: "Directory", value: cwd, setValue: setCwd }
+  ];
+  const focusIndex = () => fields.findIndex((field) => field.key === focusedField());
+  const setFocusByIndex = (index) => {
+    const clamped = Math.max(0, Math.min(fields.length - 1, index));
+    setFocusedField(fields[clamped].key);
+  };
+  const handleSubmit = () => {
+    if (name() && command()) {
+      props.onSave({
+        name: name(),
+        command: command(),
+        args: args().trim() || undefined,
+        cwd: cwd() || "~"
+      });
+    }
+  };
+  useKeyboard3((event) => {
+    if (event.name === "escape") {
+      props.onClose();
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "tab") {
+      const direction = event.shift ? -1 : 1;
+      setFocusByIndex(focusIndex() + direction);
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "return" || event.name === "enter") {
+      handleSubmit();
+      event.preventDefault();
+      return;
+    }
+    const focused = fields[focusIndex()];
+    if (!focused) {
+      return;
+    }
+    if (event.name === "backspace") {
+      focused.setValue(focused.value().slice(0, -1));
+      event.preventDefault();
+      return;
+    }
+    if (!event.ctrl && !event.meta && !event.option && event.sequence && event.sequence.length === 1) {
+      focused.setValue(focused.value() + event.sequence);
+      event.preventDefault();
+    }
+  });
+  return /* @__PURE__ */ jsxDEV7("box", {
+    position: "absolute",
+    top: "30%",
+    left: "25%",
+    width: "50%",
+    height: 12,
+    flexDirection: "column",
+    borderStyle: "double",
+    borderColor: props.theme.primary,
+    backgroundColor: props.theme.background,
+    children: [
+      /* @__PURE__ */ jsxDEV7("box", {
+        height: 1,
+        children: /* @__PURE__ */ jsxDEV7("text", {
+          fg: props.theme.accent,
+          children: /* @__PURE__ */ jsxDEV7("b", {
+            children: " Edit App"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      fields.map((field) => {
+        const isFocused = () => focusedField() === field.key;
+        return /* @__PURE__ */ jsxDEV7("box", {
+          height: 1,
+          flexDirection: "row",
+          children: [
+            /* @__PURE__ */ jsxDEV7("box", {
+              width: 12,
+              children: /* @__PURE__ */ jsxDEV7("text", {
+                fg: isFocused() ? props.theme.accent : props.theme.muted,
+                children: [
+                  field.label,
+                  ":"
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV7("text", {
+              fg: isFocused() ? props.theme.foreground : props.theme.muted,
+              bg: isFocused() ? props.theme.primary : undefined,
+              children: [
+                " ",
+                field.value(),
+                isFocused() ? "\u2588" : " "
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this);
+      }),
+      /* @__PURE__ */ jsxDEV7("box", {
+        height: 1,
+        children: /* @__PURE__ */ jsxDEV7("text", {
+          fg: props.theme.muted,
+          children: "Enter:Save | Esc:Cancel | Tab:Next field"
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+
+// src/stores/apps.ts
+import { createStore } from "solid-js/store";
+function generateId() {
+  return Math.random().toString(36).substring(2, 11);
+}
+function configToEntry(config) {
+  return {
+    id: generateId(),
+    name: config.name,
+    command: config.command,
+    args: config.args,
+    cwd: config.cwd,
+    env: config.env,
+    autostart: config.autostart ?? false,
+    restartOnExit: config.restart_on_exit ?? false
+  };
+}
+function createAppsStore(initialApps = []) {
+  const [store, setStore] = createStore({
+    entries: initialApps.map(configToEntry)
+  });
+  const addEntry = (config) => {
+    const entry = configToEntry(config);
+    setStore("entries", (entries) => [...entries, entry]);
+    return entry;
+  };
+  const removeEntry = (id) => {
+    setStore("entries", (entries) => entries.filter((e) => e.id !== id));
+  };
+  const updateEntry = (id, updates) => {
+    setStore("entries", (entry) => entry.id === id, updates);
+  };
+  const getEntry = (id) => {
+    return store.entries.find((e) => e.id === id);
+  };
+  return {
+    store,
+    addEntry,
+    removeEntry,
+    updateEntry,
+    getEntry
+  };
+}
+
+// src/stores/tabs.ts
+import { createStore as createStore2 } from "solid-js/store";
+function createTabsStore() {
+  const [store, setStore] = createStore2({
+    activeTabId: null,
+    runningApps: new Map,
+    focusMode: "tabs",
+    scrollOffset: 0
+  });
+  const setActiveTab = (id) => {
+    setStore("activeTabId", id);
+  };
+  const setFocusMode = (mode) => {
+    setStore("focusMode", mode);
+  };
+  const toggleFocus = () => {
+    setStore("focusMode", (current) => current === "tabs" ? "terminal" : "tabs");
+  };
+  const addRunningApp = (app) => {
+    setStore("runningApps", (apps) => {
+      const newApps = new Map(apps);
+      newApps.set(app.entry.id, app);
+      return newApps;
+    });
+  };
+  const removeRunningApp = (id) => {
+    setStore("runningApps", (apps) => {
+      const newApps = new Map(apps);
+      newApps.delete(id);
+      return newApps;
+    });
+  };
+  const updateAppStatus = (id, status) => {
+    setStore("runningApps", (apps) => {
+      const app = apps.get(id);
+      if (app) {
+        const newApps = new Map(apps);
+        newApps.set(id, { ...app, status });
+        return newApps;
+      }
+      return apps;
+    });
+  };
+  const updateRunningEntry = (id, updates) => {
+    setStore("runningApps", (apps) => {
+      const app = apps.get(id);
+      if (app) {
+        const newApps = new Map(apps);
+        newApps.set(id, { ...app, entry: { ...app.entry, ...updates } });
+        return newApps;
+      }
+      return apps;
+    });
+  };
+  const appendToBuffer = (id, data) => {
+    const MAX_BUFFER_CHARS = 200000;
+    setStore("runningApps", (apps) => {
+      const app = apps.get(id);
+      if (app) {
+        const nextBuffer = (app.buffer + data).slice(-MAX_BUFFER_CHARS);
+        const newApps = new Map(apps);
+        newApps.set(id, { ...app, buffer: nextBuffer });
+        return newApps;
+      }
+      return apps;
+    });
+  };
+  const getRunningApp = (id) => {
+    return store.runningApps.get(id);
+  };
+  const setScrollOffset = (offset) => {
+    setStore("scrollOffset", offset);
+  };
+  return {
+    store,
+    setActiveTab,
+    setFocusMode,
+    toggleFocus,
+    addRunningApp,
+    removeRunningApp,
+    updateAppStatus,
+    updateRunningEntry,
+    appendToBuffer,
+    getRunningApp,
+    setScrollOffset
+  };
+}
+
+// src/stores/ui.ts
+import { createStore as createStore3 } from "solid-js/store";
+function createUIStore() {
+  const [store, setStore] = createStore3({
+    activeModal: null,
+    statusMessage: null
+  });
+  const openModal = (modal) => {
+    setStore("activeModal", modal);
+  };
+  const closeModal = () => {
+    setStore("activeModal", null);
+  };
+  const setStatusMessage = (message) => {
+    setStore("statusMessage", message);
+  };
+  const showTemporaryMessage = (message, durationMs = 3000) => {
+    setStore("statusMessage", message);
+    setTimeout(() => {
+      setStore("statusMessage", (current) => current === message ? null : current);
+    }, durationMs);
+  };
+  return {
+    store,
+    openModal,
+    closeModal,
+    setStatusMessage,
+    showTemporaryMessage
+  };
+}
+
+// src/lib/config.ts
+import { parse, stringify } from "yaml";
+import { z } from "zod";
+import { readFile, writeFile, mkdir } from "fs/promises";
+import { existsSync } from "fs";
+import { homedir } from "os";
+import { dirname, join, resolve } from "path";
+var CONFIG_DIR = join(homedir(), ".config", "tuidoscope");
+var CONFIG_PATH = join(CONFIG_DIR, "config.yaml");
+var LOCAL_CONFIG_PATH = "./tuidoscope.yaml";
+var ThemeSchema = z.object({
+  primary: z.string().default("#7aa2f7"),
+  background: z.string().default("#1a1b26"),
+  foreground: z.string().default("#c0caf5"),
+  accent: z.string().default("#bb9af7"),
+  muted: z.string().default("#565f89")
+});
+var KeybindSchema = z.object({
+  next_tab: z.string().default("ctrl+n"),
+  prev_tab: z.string().default("ctrl+p"),
+  close_tab: z.string().default("ctrl+w"),
+  new_tab: z.string().default("ctrl+t"),
+  toggle_focus: z.string().default("ctrl+a"),
+  edit_app: z.string().optional(),
+  rename_tab: z.string().optional(),
+  restart_app: z.string().default("ctrl+shift+r"),
+  command_palette: z.string().default("ctrl+space"),
+  stop_app: z.string().default("ctrl+x"),
+  kill_all: z.string().default("ctrl+shift+k"),
+  quit: z.string().default("ctrl+q")
+}).transform(({ rename_tab, edit_app, ...rest }) => ({
+  ...rest,
+  edit_app: edit_app ?? rename_tab ?? "ctrl+e"
+}));
+var AppEntrySchema = z.object({
+  name: z.string(),
+  command: z.string(),
+  args: z.string().optional(),
+  cwd: z.string().default("~"),
+  autostart: z.boolean().default(false),
+  restart_on_exit: z.boolean().default(false),
+  env: z.record(z.string()).optional()
+});
+var SessionSchema = z.object({
+  persist: z.boolean().default(true),
+  file: z.string().default("~/.local/state/tuidoscope/session.yaml")
+});
+var ConfigSchema = z.object({
+  version: z.number().default(1),
+  theme: ThemeSchema.default({}),
+  keybinds: KeybindSchema.default({}),
+  tab_width: z.number().default(20),
+  apps: z.array(AppEntrySchema).default([]),
+  session: SessionSchema.default({})
+});
+var configPath = CONFIG_PATH;
+var configDir = CONFIG_DIR;
+function expandPath(path) {
+  let expanded = path;
+  if (expanded.startsWith("~")) {
+    expanded = expanded.replace("~", homedir());
+  }
+  if (expanded.includes("<CONFIG_DIR>")) {
+    expanded = expanded.replace("<CONFIG_DIR>", configDir);
+  }
+  return resolve(expanded);
+}
+async function loadConfig() {
+  if (existsSync(LOCAL_CONFIG_PATH)) {
+    configPath = resolve(LOCAL_CONFIG_PATH);
+    configDir = dirname(configPath);
+  } else if (existsSync(CONFIG_PATH)) {
+    configPath = CONFIG_PATH;
+    configDir = CONFIG_DIR;
+  } else {
+    return ConfigSchema.parse({});
+  }
+  try {
+    const content = await readFile(configPath, "utf-8");
+    const parsed = parse(content);
+    const validated = ConfigSchema.parse(parsed);
+    return validated;
+  } catch (error) {
+    console.error(`Error loading config from ${configPath}:`, error);
+    return ConfigSchema.parse({});
+  }
+}
+async function saveConfig(config) {
+  await mkdir(dirname(configPath), { recursive: true });
+  const yamlContent = stringify(config, {
+    indent: 2,
+    lineWidth: 0
+  });
+  await writeFile(configPath, yamlContent, "utf-8");
+}
+
+// src/lib/pty.ts
+var INTERACTIVE_SHELLS = ["bash", "zsh", "fish", "sh", "dash", "ksh", "tcsh", "csh"];
+var DEFAULT_FG = "#c0caf5";
+var DEFAULT_BG = "#1a1b26";
+function normalizeHexColor(value, fallback) {
+  if (!value)
+    return fallback;
+  const trimmed = value.trim();
+  if (/^#[0-9a-fA-F]{6}$/.test(trimmed))
+    return trimmed.toLowerCase();
+  if (/^#[0-9a-fA-F]{3}$/.test(trimmed)) {
+    const chars = trimmed.slice(1).split("");
+    return `#${chars.map((c) => c + c).join("")}`.toLowerCase();
+  }
+  return fallback;
+}
+function hexToOscRgb(hex) {
+  const normalized = normalizeHexColor(hex, DEFAULT_BG).slice(1);
+  const r = normalized.slice(0, 2);
+  const g = normalized.slice(2, 4);
+  const b = normalized.slice(4, 6);
+  return `rgb:${r}/${g}/${b}`;
+}
+function buildColorResponse(code, hex) {
+  return `\x1B]${code};${hexToOscRgb(hex)}\x1B\\`;
+}
+function buildCursorPositionReport() {
+  return "\x1B[1;1R";
+}
+function stripTerminalQueries(input, colors) {
+  let output = "";
+  const responses = [];
+  let i = 0;
+  const prefixes = ["\x1B[6n", "\x1B[?6n", "\x1B]10;?", "\x1B]11;?"];
+  while (i < input.length) {
+    const char = input[i];
+    if (char !== "\x1B") {
+      output += char;
+      i += 1;
+      continue;
+    }
+    const remaining = input.slice(i);
+    const hasPartialPrefix = prefixes.some((prefix) => prefix.startsWith(remaining) && remaining.length < prefix.length);
+    if (hasPartialPrefix) {
+      return { output, responses, pending: remaining };
+    }
+    const next = input[i + 1];
+    if (next === "[") {
+      if (input.startsWith("\x1B[6n", i)) {
+        responses.push(buildCursorPositionReport());
+        i += 4;
+        continue;
+      }
+      if (input.startsWith("\x1B[?6n", i)) {
+        responses.push(buildCursorPositionReport());
+        i += 5;
+        continue;
+      }
+    }
+    if (next === "]") {
+      if (input.startsWith("\x1B]10;?", i) || input.startsWith("\x1B]11;?", i)) {
+        const isForeground = input.startsWith("\x1B]10;?", i);
+        const terminatorIndex = input.indexOf("\x07", i + 5);
+        const stIndex = input.indexOf("\x1B\\", i + 5);
+        let endIndex = -1;
+        let terminatorLength = 0;
+        if (terminatorIndex !== -1) {
+          endIndex = terminatorIndex;
+          terminatorLength = 1;
+        } else if (stIndex !== -1) {
+          endIndex = stIndex;
+          terminatorLength = 2;
+        } else {
+          return { output, responses, pending: input.slice(i) };
+        }
+        responses.push(buildColorResponse(isForeground ? "10" : "11", isForeground ? colors.fg : colors.bg));
+        i = endIndex + terminatorLength;
+        continue;
+      }
+    }
+    output += char;
+    i += 1;
+  }
+  return { output, responses, pending: "" };
+}
+function buildCommandString(command) {
+  const trimmed = command.trim();
+  if (!trimmed.includes(" ") && INTERACTIVE_SHELLS.includes(trimmed)) {
+    return `${trimmed} -i`;
+  }
+  return trimmed;
+}
+function parseCommand(command) {
+  const trimmed = command.trim();
+  if (!trimmed.includes(" ")) {
+    if (INTERACTIVE_SHELLS.includes(trimmed)) {
+      return { program: trimmed, args: ["-i"] };
+    }
+    return { program: trimmed, args: [] };
+  }
+  const shell = process.env.SHELL || "/bin/sh";
+  return { program: shell, args: ["-c", trimmed] };
+}
+function spawnPty(entry, options = {}) {
+  const { cols = 80, rows = 24 } = options;
+  const cwd = expandPath(entry.cwd);
+  const colorOverrides = {
+    fg: normalizeHexColor(entry.env?.TUIDISCOPE_FG ?? process.env.TUIDISCOPE_FG, DEFAULT_FG),
+    bg: normalizeHexColor(entry.env?.TUIDISCOPE_BG ?? process.env.TUIDISCOPE_BG, DEFAULT_BG)
+  };
+  const env = {
+    ...process.env,
+    TERM: "xterm-256color",
+    COLUMNS: String(cols),
+    LINES: String(rows),
+    ...entry.env
+  };
+  const useScript = process.platform !== "win32" && !process.env.TUIDISCOPE_NO_SCRIPT;
+  const entryCommand = buildEntryCommand(entry);
+  const commandString = buildCommandString(entryCommand);
+  const { program, args } = parseCommand(entryCommand);
+  let spawnProgram;
+  let spawnArgs;
+  if (useScript) {
+    spawnProgram = "script";
+    if (process.platform === "darwin") {
+      spawnArgs = ["-q", "/dev/null", program, ...args];
+    } else {
+      spawnArgs = ["-q", "-c", commandString, "/dev/null"];
+    }
+  } else {
+    spawnProgram = program;
+    spawnArgs = args;
+  }
+  let dataCallback = null;
+  let exitCallback = null;
+  let pendingControl = "";
+  const terminal = new Bun.Terminal({
+    cols,
+    rows,
+    data(_term, data) {
+      const str = typeof data === "string" ? data : new TextDecoder().decode(data);
+      const parsed = stripTerminalQueries(pendingControl + str, colorOverrides);
+      pendingControl = parsed.pending;
+      if (parsed.responses.length > 0) {
+        terminal.write(parsed.responses.join(""));
+      }
+      if (dataCallback && parsed.output.length > 0) {
+        dataCallback(parsed.output);
+      }
+    },
+    exit(_term) {}
+  });
+  const proc = Bun.spawn([spawnProgram, ...spawnArgs], {
+    terminal,
+    cwd,
+    env
+  });
+  proc.exited.then((exitCode) => {
+    if (exitCallback) {
+      exitCallback({ exitCode, signal: 0 });
+    }
+  }).catch(() => {
+    if (exitCallback) {
+      exitCallback({ exitCode: 1, signal: 0 });
+    }
+  });
+  const ptyProcess = {
+    terminal,
+    proc,
+    pid: proc.pid,
+    write(data) {
+      terminal.write(data);
+    },
+    resize(cols2, rows2) {
+      terminal.resize(cols2, rows2);
+    },
+    kill() {
+      proc.kill();
+      terminal.close();
+    },
+    onData(callback) {
+      dataCallback = callback;
+    },
+    onExit(callback) {
+      exitCallback = callback;
+    }
+  };
+  return ptyProcess;
+}
+function resizePty(ptyProcess, cols, rows) {
+  ptyProcess.resize(cols, rows);
+}
+function killPty(ptyProcess) {
+  ptyProcess.kill();
+}
+
+// src/lib/session.ts
+import { parse as parse2, stringify as stringify2 } from "yaml";
+import { readFile as readFile2, writeFile as writeFile2, mkdir as mkdir2 } from "fs/promises";
+import { existsSync as existsSync2 } from "fs";
+import { dirname as dirname2 } from "path";
+var sessionPath = null;
+function initSessionPath(config) {
+  sessionPath = expandPath(config.session.file);
+}
+async function saveSession(data) {
+  if (!sessionPath) {
+    throw new Error("Session path not initialized");
+  }
+  await mkdir2(dirname2(sessionPath), { recursive: true });
+  const yamlContent = stringify2(data, {
+    indent: 2,
+    lineWidth: 0
+  });
+  await writeFile2(sessionPath, yamlContent, "utf-8");
+}
+async function restoreSession() {
+  if (!sessionPath || !existsSync2(sessionPath)) {
+    return null;
+  }
+  try {
+    const content = await readFile2(sessionPath, "utf-8");
+    const parsed = parse2(content);
+    if (typeof parsed === "object" && parsed !== null && Array.isArray(parsed.runningApps) && typeof parsed.timestamp === "number") {
+      return parsed;
+    }
+    return null;
+  } catch {
+    return null;
+  }
+}
+
+// src/lib/debug.ts
+import { appendFileSync } from "fs";
+var DEBUG_LOG_PATH = process.env.TUIDOSCOPE_DEBUG_LOG || "tuidoscope-debug.log";
+function debugLog(message) {
+  if (!process.env.TUIDOSCOPE_DEBUG) {
+    return;
+  }
+  try {
+    const line = message.endsWith(`
+`) ? message : `${message}
+`;
+    appendFileSync(DEBUG_LOG_PATH, line);
+  } catch {}
+}
+
+// src/app.tsx
+import { jsxDEV as jsxDEV8 } from "@opentui/solid/jsx-dev-runtime";
+var App = (props) => {
+  const renderer = useRenderer();
+  const appsStore = createAppsStore(props.config.apps);
+  const tabsStore = createTabsStore();
+  const uiStore = createUIStore();
+  const terminalDims = useTerminalDimensions();
+  const [selectedIndex, setSelectedIndex] = createSignal4(0);
+  initSessionPath(props.config);
+  const [hasAutostarted, setHasAutostarted] = createSignal4(false);
+  const [isQuitting, setIsQuitting] = createSignal4(false);
+  const [editingEntryId, setEditingEntryId] = createSignal4(null);
+  const getPtyDimensions = () => {
+    const dims = terminalDims();
+    const cols = dims.width - props.config.tab_width - 2;
+    const rows = dims.height - 4;
+    return { cols, rows };
+  };
+  const startApp = (entry) => {
+    if (tabsStore.store.runningApps.has(entry.id)) {
+      return;
+    }
+    const dims = terminalDims();
+    const { cols, rows } = getPtyDimensions();
+    if (cols < 10 || rows < 3) {
+      console.warn(`Skipping start for ${entry.name}: invalid dimensions ${cols}x${rows}`);
+      return;
+    }
+    const ptyProcess = spawnPty(entry, { cols, rows });
+    const runningApp = {
+      entry,
+      pty: ptyProcess,
+      status: "running",
+      buffer: ""
+    };
+    let pendingOutput = "";
+    let flushTimer = null;
+    const flushOutput = () => {
+      if (pendingOutput.length === 0) {
+        flushTimer = null;
+        return;
+      }
+      tabsStore.appendToBuffer(entry.id, pendingOutput);
+      pendingOutput = "";
+      flushTimer = null;
+    };
+    ptyProcess.onData((data) => {
+      pendingOutput += data;
+      if (!flushTimer) {
+        flushTimer = setTimeout(flushOutput, 50);
+      }
+    });
+    ptyProcess.onExit(({ exitCode }) => {
+      flushOutput();
+      if (exitCode === 0) {
+        tabsStore.updateAppStatus(entry.id, "stopped");
+      } else {
+        tabsStore.updateAppStatus(entry.id, "error");
+      }
+      if (entry.restartOnExit && exitCode !== 0) {
+        setTimeout(() => startApp(entry), 1000);
+      }
+    });
+    tabsStore.addRunningApp(runningApp);
+    tabsStore.setActiveTab(entry.id);
+    uiStore.showTemporaryMessage(`Started: ${entry.name}`);
+  };
+  const stopApp = (id, options = {}) => {
+    const app = tabsStore.getRunningApp(id);
+    if (app) {
+      killPty(app.pty);
+      tabsStore.removeRunningApp(id);
+      if (!options.silent) {
+        uiStore.showTemporaryMessage(`Stopped: ${app.entry.name}`);
+      }
+    }
+  };
+  const stopAllApps = (options = {}) => {
+    const runningIds = Array.from(tabsStore.store.runningApps.keys());
+    if (runningIds.length === 0) {
+      if (options.showMessage) {
+        uiStore.showTemporaryMessage("No running apps");
+      }
+      return;
+    }
+    for (const id of runningIds) {
+      stopApp(id, { silent: true });
+    }
+    tabsStore.setActiveTab(null);
+    if (options.showMessage) {
+      uiStore.showTemporaryMessage(`Stopped ${runningIds.length} app${runningIds.length === 1 ? "" : "s"}`);
+    }
+  };
+  const restartApp = (id) => {
+    const app = tabsStore.getRunningApp(id);
+    if (app) {
+      stopApp(id);
+      setTimeout(() => {
+        const entry = appsStore.getEntry(id);
+        if (entry)
+          startApp(entry);
+      }, 500);
+    }
+  };
+  const getAppStatus = (id) => {
+    const app = tabsStore.getRunningApp(id);
+    return app?.status ?? "stopped";
+  };
+  const handleTabNavigation = (direction) => {
+    const entries = appsStore.store.entries;
+    if (entries.length === 0)
+      return;
+    setSelectedIndex((current) => {
+      if (direction === "up") {
+        return Math.max(0, current - 1);
+      } else {
+        return Math.min(entries.length - 1, current + 1);
+      }
+    });
+    const visibleHeight = 20;
+    const currentOffset = tabsStore.store.scrollOffset;
+    const newIndex = selectedIndex();
+    if (newIndex < currentOffset) {
+      tabsStore.setScrollOffset(newIndex);
+    } else if (newIndex >= currentOffset + visibleHeight) {
+      tabsStore.setScrollOffset(newIndex - visibleHeight + 1);
+    }
+  };
+  const handleSelectApp = (id) => {
+    const entry = appsStore.getEntry(id);
+    if (!entry)
+      return;
+    if (!tabsStore.store.runningApps.has(id)) {
+      startApp(entry);
+    } else {
+      tabsStore.setActiveTab(id);
+    }
+  };
+  const persistAppsConfig = async () => {
+    const nextApps = appsStore.store.entries.map((entry) => ({
+      name: entry.name,
+      command: entry.command,
+      args: entry.args?.trim() || undefined,
+      cwd: entry.cwd,
+      autostart: entry.autostart,
+      restart_on_exit: entry.restartOnExit,
+      env: entry.env
+    }));
+    const nextConfig = { ...props.config, apps: nextApps };
+    props.config.apps = nextApps;
+    try {
+      await saveConfig(nextConfig);
+    } catch (error) {
+      console.error("Failed to save config:", error);
+      uiStore.showTemporaryMessage("Failed to save config");
+    }
+  };
+  const openEditModal = (id) => {
+    setEditingEntryId(id);
+    uiStore.openModal("edit-app");
+  };
+  const handleAddApp = (config) => {
+    const entry = appsStore.addEntry(config);
+    uiStore.closeModal();
+    uiStore.showTemporaryMessage(`Added: ${entry.name}`);
+    persistAppsConfig();
+  };
+  const handleEditApp = (id, updates) => {
+    appsStore.updateEntry(id, updates);
+    tabsStore.updateRunningEntry(id, updates);
+    uiStore.closeModal();
+    setEditingEntryId(null);
+    const updatedName = appsStore.getEntry(id)?.name ?? updates.name;
+    if (tabsStore.store.runningApps.has(id)) {
+      uiStore.showTemporaryMessage(`Updated: ${updatedName} (restart to apply)`);
+    } else {
+      uiStore.showTemporaryMessage(`Updated: ${updatedName}`);
+    }
+    persistAppsConfig();
+  };
+  const handleKeybind = createKeybindHandler(props.config.keybinds, {
+    next_tab: () => handleTabNavigation("down"),
+    prev_tab: () => handleTabNavigation("up"),
+    toggle_focus: () => tabsStore.toggleFocus(),
+    new_tab: () => uiStore.openModal("add-tab"),
+    edit_app: () => {
+      if (tabsStore.store.focusMode !== "tabs") {
+        uiStore.showTemporaryMessage("Switch to tabs to edit");
+        return;
+      }
+      const entry = appsStore.store.entries[selectedIndex()];
+      if (!entry) {
+        uiStore.showTemporaryMessage("No app selected");
+        return;
+      }
+      openEditModal(entry.id);
+    },
+    command_palette: () => uiStore.openModal("command-palette"),
+    close_tab: () => {
+      const activeId = tabsStore.store.activeTabId;
+      if (activeId)
+        stopApp(activeId);
+    },
+    stop_app: () => {
+      if (tabsStore.store.focusMode === "tabs") {
+        const entries = appsStore.store.entries;
+        const entry = entries[selectedIndex()];
+        if (!entry) {
+          uiStore.showTemporaryMessage("No app selected");
+          return;
+        }
+        if (tabsStore.store.runningApps.has(entry.id)) {
+          stopApp(entry.id);
+        } else {
+          uiStore.showTemporaryMessage(`Not running: ${entry.name}`);
+        }
+        return;
+      }
+      const activeId = tabsStore.store.activeTabId;
+      if (activeId) {
+        stopApp(activeId);
+      } else {
+        uiStore.showTemporaryMessage("No active app");
+      }
+    },
+    kill_all: () => stopAllApps({ showMessage: true }),
+    restart_app: () => {
+      const activeId = tabsStore.store.activeTabId;
+      if (activeId)
+        restartApp(activeId);
+    },
+    quit: () => {
+      if (isQuitting()) {
+        return;
+      }
+      setIsQuitting(true);
+      if (props.config.session.persist) {
+        const runningIds = Array.from(tabsStore.store.runningApps.keys());
+        saveSession({
+          runningApps: runningIds,
+          activeTab: tabsStore.store.activeTabId,
+          timestamp: Date.now()
+        });
+      }
+      stopAllApps({ showMessage: false });
+      renderer.destroy();
+      setTimeout(() => process.exit(0), 50);
+    }
+  });
+  useKeyboard4((event) => {
+    debugLog(`[App] key: ${event.name} modal: ${uiStore.store.activeModal} prevented: ${event.defaultPrevented}`);
+    if (uiStore.store.activeModal) {
+      if (event.name === "escape") {
+        if (uiStore.store.activeModal === "edit-app") {
+          setEditingEntryId(null);
+        }
+        uiStore.closeModal();
+        event.preventDefault();
+      }
+      return;
+    }
+    if (tabsStore.store.focusMode === "terminal") {
+      if (handleKeybind(event)) {
+        event.preventDefault();
+        return;
+      }
+      const activeApp = tabsStore.store.activeTabId ? tabsStore.getRunningApp(tabsStore.store.activeTabId) : undefined;
+      if (activeApp && event.sequence) {
+        activeApp.pty.write(event.sequence);
+        event.preventDefault();
+      }
+      return;
+    }
+    if (handleKeybind(event)) {
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "j" || event.name === "down") {
+      handleTabNavigation("down");
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "k" || event.name === "up") {
+      handleTabNavigation("up");
+      event.preventDefault();
+      return;
+    }
+    if (event.name === "return" || event.name === "enter") {
+      const entries = appsStore.store.entries;
+      if (entries.length > 0 && selectedIndex() < entries.length) {
+        handleSelectApp(entries[selectedIndex()].id);
+        event.preventDefault();
+      }
+      return;
+    }
+  });
+  createEffect2(() => {
+    const { cols, rows } = getPtyDimensions();
+    if (cols < 10 || rows < 3 || hasAutostarted()) {
+      return;
+    }
+    setHasAutostarted(true);
+    for (const entry of appsStore.store.entries) {
+      if (entry.autostart) {
+        startApp(entry);
+      }
+    }
+    if (props.session) {
+      for (const id of props.session.runningApps) {
+        const entry = appsStore.getEntry(id);
+        if (entry && !entry.autostart) {
+          startApp(entry);
+        }
+      }
+      if (props.session.activeTab) {
+        tabsStore.setActiveTab(props.session.activeTab);
+      }
+    }
+  });
+  createEffect2(() => {
+    const { cols: termWidth, rows: termHeight } = getPtyDimensions();
+    if (termWidth < 10 || termHeight < 3) {
+      return;
+    }
+    for (const [, app] of tabsStore.store.runningApps) {
+      if (app.status === "running") {
+        resizePty(app.pty, termWidth, termHeight);
+      }
+    }
+  });
+  const handleTerminalInput = (data) => {
+    const activeApp = tabsStore.store.activeTabId ? tabsStore.getRunningApp(tabsStore.store.activeTabId) : undefined;
+    if (activeApp) {
+      activeApp.pty.write(data);
+    }
+  };
+  onCleanup(() => {
+    for (const [id] of tabsStore.store.runningApps) {
+      stopApp(id, { silent: true });
+    }
+  });
+  const activeRunningApp = createMemo3(() => {
+    const activeId = tabsStore.store.activeTabId;
+    return activeId ? tabsStore.getRunningApp(activeId) : undefined;
+  });
+  const editingEntry = createMemo3(() => {
+    const id = editingEntryId();
+    const entry = id ? appsStore.getEntry(id) : undefined;
+    return entry;
+  });
+  return /* @__PURE__ */ jsxDEV8("box", {
+    flexDirection: "column",
+    width: "100%",
+    height: "100%",
+    children: [
+      /* @__PURE__ */ jsxDEV8("box", {
+        flexDirection: "row",
+        flexGrow: 1,
+        children: [
+          /* @__PURE__ */ jsxDEV8(TabList, {
+            entries: appsStore.store.entries,
+            activeTabId: tabsStore.store.activeTabId,
+            selectedIndex: selectedIndex(),
+            getStatus: getAppStatus,
+            isFocused: tabsStore.store.focusMode === "tabs",
+            width: props.config.tab_width,
+            height: terminalDims().height - 1,
+            scrollOffset: tabsStore.store.scrollOffset,
+            theme: props.config.theme,
+            onSelect: handleSelectApp,
+            onAddClick: () => uiStore.openModal("add-tab")
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV8(TerminalPane, {
+            runningApp: activeRunningApp(),
+            isFocused: tabsStore.store.focusMode === "terminal",
+            width: terminalDims().width - props.config.tab_width,
+            height: terminalDims().height - 1,
+            theme: props.config.theme,
+            onInput: handleTerminalInput
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV8(StatusBar, {
+        appName: activeRunningApp()?.entry.name ?? null,
+        appStatus: activeRunningApp()?.status ?? null,
+        focusMode: tabsStore.store.focusMode,
+        message: uiStore.store.statusMessage,
+        theme: props.config.theme,
+        keybinds: {
+          toggle_focus: props.config.keybinds.toggle_focus,
+          command_palette: props.config.keybinds.command_palette,
+          edit_app: props.config.keybinds.edit_app,
+          stop_app: props.config.keybinds.stop_app,
+          kill_all: props.config.keybinds.kill_all,
+          quit: props.config.keybinds.quit
+        }
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV8(Show3, {
+        when: uiStore.store.activeModal === "command-palette",
+        children: /* @__PURE__ */ jsxDEV8(CommandPalette, {
+          entries: appsStore.store.entries,
+          theme: props.config.theme,
+          onSelect: (entry, action) => {
+            if (action === "edit") {
+              openEditModal(entry.id);
+              return;
+            }
+            uiStore.closeModal();
+            if (action === "switch") {
+              handleSelectApp(entry.id);
+            } else if (action === "stop") {
+              if (tabsStore.store.runningApps.has(entry.id)) {
+                stopApp(entry.id);
+              } else {
+                uiStore.showTemporaryMessage(`Not running: ${entry.name}`);
+              }
+            }
+          },
+          onClose: () => uiStore.closeModal()
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV8(Show3, {
+        when: uiStore.store.activeModal === "add-tab",
+        children: /* @__PURE__ */ jsxDEV8(AddTabModal, {
+          theme: props.config.theme,
+          onAdd: handleAddApp,
+          onClose: () => uiStore.closeModal()
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV8(Show3, {
+        when: uiStore.store.activeModal === "edit-app" && editingEntry(),
+        children: /* @__PURE__ */ jsxDEV8(EditAppModal, {
+          theme: props.config.theme,
+          entry: editingEntry(),
+          onSave: (updates) => handleEditApp(editingEntry().id, updates),
+          onClose: () => {
+            uiStore.closeModal();
+            setEditingEntryId(null);
+          }
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+};
+
+// src/index.tsx
+import { jsxDEV as jsxDEV9 } from "@opentui/solid/jsx-dev-runtime";
+extend({ "ghostty-terminal": GhosttyTerminalRenderable });
+async function main() {
+  try {
+    const config = await loadConfig();
+    initSessionPath(config);
+    const session = config.session.persist ? await restoreSession() : null;
+    await render(() => /* @__PURE__ */ jsxDEV9(App, {
+      config,
+      session
+    }, undefined, false, undefined, this));
+    const handleShutdown = () => {
+      console.log(`
+Shutting down tuidoscope...`);
+      process.exit(0);
+    };
+    process.on("SIGINT", handleShutdown);
+    process.on("SIGTERM", handleShutdown);
+  } catch (error) {
+    console.error("Failed to start tuidoscope:", error);
+    process.exit(1);
+  }
+}
+main();