@tomkapa/tayto 0.1.2 → 0.3.0

package/dist/{tui-JNZRBEIQ.js → tui-5JJH67YY.js}

@@ -1,19 +1,20 @@
 #!/usr/bin/env node
 import {
   DependencyType,
+  TaskLevel,
   TaskStatus,
   TaskType,
   UIDependencyType,
   isTerminalStatus,
   logger
-} from "./chunk-6NQOFUIQ.js";
+} from "./chunk-FUNYPBWJ.js";
 
 // src/tui/index.tsx
 import { render } from "ink";
 
 // src/tui/components/App.tsx
-import { useReducer, useEffect, useCallback as useCallback2, useMemo } from "react";
-import { Box as Box14, Text as Text14, useInput as useInput5, useApp } from "ink";
+import { useReducer, useEffect as useEffect2, useCallback as useCallback2, useMemo as useMemo2, useState as useState6 } from "react";
+import { Box as Box16, Text as Text16, useInput as useInput6, useApp, useStdout as useStdout4 } from "ink";
 
 // src/tui/types.ts
 var ViewType = {
@@ -24,9 +25,144 @@ var ViewType = {
   ProjectSelector: "project-selector",
   ProjectCreate: "project-create",
   DependencyList: "dependency-list",
+  EpicPicker: "epic-picker",
   Help: "help"
 };
 
+// src/tui/theme.ts
+var theme = {
+  // Body
+  fg: "#1E90FF",
+  // dodgerblue
+  bg: "black",
+  logo: "#FFA500",
+  // orange
+  // Table
+  table: {
+    fg: "#00FFFF",
+    // aqua
+    cursorFg: "black",
+    cursorBg: "#00FFFF",
+    // aqua
+    headerFg: "white",
+    markColor: "#98FB98",
+    // palegreen
+    depHighlightBg: "#1A5276",
+    // dark steel blue – non-terminal dep rows
+    blockedCursorBg: "#C0392B"
+    // strong red – selected row blocked by non-terminal dep
+  },
+  // Status colors (row-level)
+  status: {
+    new: "#87CEFA",
+    // lightskyblue
+    modified: "#ADFF2F",
+    // greenyellow
+    added: "#1E90FF",
+    // dodgerblue
+    error: "#FF4500",
+    // orangered
+    pending: "#FF8C00",
+    // darkorange
+    highlight: "#00FFFF",
+    // aqua
+    kill: "#9370DB",
+    // mediumpurple
+    completed: "#778899"
+    // lightslategray
+  },
+  // Frame / borders
+  border: "#1E90FF",
+  // dodgerblue
+  borderFocus: "#00FFFF",
+  // aqua
+  // Title
+  title: "#00FFFF",
+  // aqua
+  titleHighlight: "#FF00FF",
+  // fuchsia
+  titleCounter: "#FFEFD5",
+  // papayawhip
+  titleFilter: "#2E8B57",
+  // seagreen
+  // Prompt
+  prompt: "#5F9EA0",
+  // cadetblue
+  promptSuggest: "#1E90FF",
+  // dodgerblue
+  // Dialog
+  dialog: {
+    fg: "#1E90FF",
+    // dodgerblue
+    buttonFg: "black",
+    buttonBg: "#1E90FF",
+    buttonFocusFg: "white",
+    buttonFocusBg: "#FF00FF",
+    // fuchsia
+    label: "#FF00FF",
+    // fuchsia
+    field: "#1E90FF"
+  },
+  // Detail/YAML
+  yaml: {
+    key: "#4682B4",
+    // steelblue
+    colon: "white",
+    value: "#FFEFD5"
+    // papayawhip
+  },
+  // Crumbs
+  crumb: {
+    fg: "black",
+    bg: "#4682B4",
+    // steelblue
+    activeBg: "#FFA500"
+    // orange
+  },
+  // Flash
+  flash: {
+    info: "#FFDEAD",
+    // navajowhite
+    warn: "#FFA500",
+    // orange
+    error: "#FF4500"
+    // orangered
+  },
+  // Menu / key hints
+  menu: {
+    key: "#1E90FF",
+    // dodgerblue
+    numKey: "#FF00FF",
+    // fuchsia
+    desc: "white"
+  }
+};
+
+// src/tui/constants.ts
+var STATUS_VALUES = Object.values(TaskStatus);
+var TYPE_VALUES = Object.values(TaskType);
+var PAGE_SIZE = 20;
+var STATUS_COLOR = {
+  [TaskStatus.Backlog]: theme.status.completed,
+  [TaskStatus.Todo]: theme.status.new,
+  [TaskStatus.InProgress]: theme.status.pending,
+  [TaskStatus.Review]: theme.status.modified,
+  [TaskStatus.Done]: theme.status.added,
+  [TaskStatus.Cancelled]: theme.status.kill
+};
+var TYPE_COLOR = {
+  [TaskType.Epic]: theme.status.modified,
+  [TaskType.Story]: theme.status.highlight,
+  [TaskType.TechDebt]: theme.status.pending,
+  [TaskType.Bug]: theme.status.error
+};
+var DEP_TYPE_LABEL = {
+  [DependencyType.Blocks]: "blocks",
+  [DependencyType.RelatesTo]: "relates-to",
+  [DependencyType.Duplicates]: "duplicates",
+  [UIDependencyType.BlockedBy]: "blocked-by"
+};
+
 // src/tui/state.ts
 var initialState = {
   activeView: ViewType.TaskList,
@@ -51,7 +187,13 @@ var initialState = {
   depSelectedIndex: 0,
   isAddingDep: false,
   addDepInput: "",
-  focusedPanel: "list"
+  focusedPanel: "list",
+  detailScrollOffset: 0,
+  epics: [],
+  epicSelectedIndex: 0,
+  selectedEpicIds: /* @__PURE__ */ new Set(),
+  isEpicReordering: false,
+  epicReorderSnapshot: null
 };
 function appReducer(state, action) {
   switch (action.type) {
@@ -111,14 +253,19 @@ function appReducer(state, action) {
     case "MOVE_CURSOR": {
       const maxIndex = Math.max(0, state.tasks.length - 1);
       const newIndex = action.direction === "up" ? Math.max(0, state.selectedIndex - 1) : Math.min(maxIndex, state.selectedIndex + 1);
-      return { ...state, selectedIndex: newIndex };
+      return { ...state, selectedIndex: newIndex, detailScrollOffset: 0 };
+    }
+    case "PAGE_CURSOR": {
+      const maxIndex = Math.max(0, state.tasks.length - 1);
+      const newIndex = action.direction === "up" ? Math.max(0, state.selectedIndex - PAGE_SIZE) : Math.min(maxIndex, state.selectedIndex + PAGE_SIZE);
+      return { ...state, selectedIndex: newIndex, detailScrollOffset: 0 };
     }
     case "SET_CURSOR": {
       const maxIndex = Math.max(0, state.tasks.length - 1);
       return { ...state, selectedIndex: Math.max(0, Math.min(action.index, maxIndex)) };
     }
     case "SELECT_TASK":
-      return { ...state, selectedTask: action.task };
+      return { ...state, selectedTask: action.task, detailScrollOffset: 0 };
     case "SET_FORM_DATA":
       return { ...state, formData: action.data };
     case "ENTER_REORDER":
@@ -181,151 +328,98 @@ function appReducer(state, action) {
       return { ...state, addDepInput: action.input };
     case "SET_PANEL_FOCUS":
       return { ...state, focusedPanel: action.panel };
+    case "DETAIL_SCROLL":
+      return {
+        ...state,
+        detailScrollOffset: action.direction === "up" ? Math.max(0, state.detailScrollOffset - 1) : state.detailScrollOffset + 1
+      };
+    case "DETAIL_RESET_SCROLL":
+      return { ...state, detailScrollOffset: 0 };
+    case "SET_EPICS":
+      return {
+        ...state,
+        epics: action.epics,
+        epicSelectedIndex: Math.min(state.epicSelectedIndex, Math.max(0, action.epics.length - 1))
+      };
+    case "EPIC_MOVE_CURSOR": {
+      if (state.epics.length === 0) return state;
+      const maxIdx = Math.max(0, state.epics.length - 1);
+      const newIdx = action.direction === "up" ? Math.max(0, state.epicSelectedIndex - 1) : Math.min(maxIdx, state.epicSelectedIndex + 1);
+      return { ...state, epicSelectedIndex: newIdx };
+    }
+    case "TOGGLE_EPIC": {
+      const next = new Set(state.selectedEpicIds);
+      if (next.has(action.epicId)) {
+        next.delete(action.epicId);
+      } else {
+        next.add(action.epicId);
+      }
+      return { ...state, selectedEpicIds: next, selectedIndex: 0 };
+    }
+    case "CLEAR_EPIC_SELECTION":
+      return { ...state, selectedEpicIds: /* @__PURE__ */ new Set(), selectedIndex: 0 };
+    case "ENTER_EPIC_REORDER":
+      return {
+        ...state,
+        isEpicReordering: true,
+        epicReorderSnapshot: [...state.epics]
+      };
+    case "EPIC_REORDER_MOVE": {
+      if (!state.isEpicReordering) return state;
+      const idx = state.epicSelectedIndex;
+      const epics = [...state.epics];
+      const swapIdx = action.direction === "up" ? idx - 1 : idx + 1;
+      if (swapIdx < 0 || swapIdx >= epics.length) return state;
+      const current = epics[idx];
+      const swap = epics[swapIdx];
+      if (!current || !swap) return state;
+      epics[idx] = swap;
+      epics[swapIdx] = current;
+      return {
+        ...state,
+        epics,
+        epicSelectedIndex: swapIdx
+      };
+    }
+    case "EXIT_EPIC_REORDER": {
+      if (!action.save && state.epicReorderSnapshot) {
+        return {
+          ...state,
+          isEpicReordering: false,
+          epics: state.epicReorderSnapshot,
+          epicReorderSnapshot: null
+        };
+      }
+      return {
+        ...state,
+        isEpicReordering: false,
+        epicReorderSnapshot: null
+      };
+    }
   }
 }
 
-// src/tui/theme.ts
-var theme = {
-  // Body
-  fg: "#1E90FF",
-  // dodgerblue
-  bg: "black",
-  logo: "#FFA500",
-  // orange
-  // Table
-  table: {
-    fg: "#00FFFF",
-    // aqua
-    cursorFg: "black",
-    cursorBg: "#00FFFF",
-    // aqua
-    headerFg: "white",
-    markColor: "#98FB98",
-    // palegreen
-    depHighlightBg: "#1A5276",
-    // dark steel blue – non-terminal dep rows
-    blockedCursorBg: "#C0392B"
-    // strong red – selected row blocked by non-terminal dep
-  },
-  // Status colors (row-level)
-  status: {
-    new: "#87CEFA",
-    // lightskyblue
-    modified: "#ADFF2F",
-    // greenyellow
-    added: "#1E90FF",
-    // dodgerblue
-    error: "#FF4500",
-    // orangered
-    pending: "#FF8C00",
-    // darkorange
-    highlight: "#00FFFF",
-    // aqua
-    kill: "#9370DB",
-    // mediumpurple
-    completed: "#778899"
-    // lightslategray
-  },
-  // Frame / borders
-  border: "#1E90FF",
-  // dodgerblue
-  borderFocus: "#00FFFF",
-  // aqua
-  // Title
-  title: "#00FFFF",
-  // aqua
-  titleHighlight: "#FF00FF",
-  // fuchsia
-  titleCounter: "#FFEFD5",
-  // papayawhip
-  titleFilter: "#2E8B57",
-  // seagreen
-  // Prompt
-  prompt: "#5F9EA0",
-  // cadetblue
-  promptSuggest: "#1E90FF",
-  // dodgerblue
-  // Dialog
-  dialog: {
-    fg: "#1E90FF",
-    // dodgerblue
-    buttonFg: "black",
-    buttonBg: "#1E90FF",
-    buttonFocusFg: "white",
-    buttonFocusBg: "#FF00FF",
-    // fuchsia
-    label: "#FF00FF",
-    // fuchsia
-    field: "#1E90FF"
-  },
-  // Detail/YAML
-  yaml: {
-    key: "#4682B4",
-    // steelblue
-    colon: "white",
-    value: "#FFEFD5"
-    // papayawhip
-  },
-  // Crumbs
-  crumb: {
-    fg: "black",
-    bg: "#4682B4",
-    // steelblue
-    activeBg: "#FFA500"
-    // orange
-  },
-  // Flash
-  flash: {
-    info: "#FFDEAD",
-    // navajowhite
-    warn: "#FFA500",
-    // orange
-    error: "#FF4500"
-    // orangered
-  },
-  // Menu / key hints
-  menu: {
-    key: "#1E90FF",
-    // dodgerblue
-    numKey: "#FF00FF",
-    // fuchsia
-    desc: "white"
-  }
-};
-
-// src/tui/constants.ts
-var STATUS_VALUES = Object.values(TaskStatus);
-var TYPE_VALUES = Object.values(TaskType);
-var STATUS_COLOR = {
-  [TaskStatus.Backlog]: theme.status.completed,
-  [TaskStatus.Todo]: theme.status.new,
-  [TaskStatus.InProgress]: theme.status.pending,
-  [TaskStatus.Review]: theme.status.modified,
-  [TaskStatus.Done]: theme.status.added,
-  [TaskStatus.Cancelled]: theme.status.kill
-};
-var TYPE_COLOR = {
-  [TaskType.Story]: theme.status.highlight,
-  [TaskType.TechDebt]: theme.status.pending,
-  [TaskType.Bug]: theme.status.error
-};
-var DEP_TYPE_LABEL = {
-  [DependencyType.Blocks]: "blocks",
-  [DependencyType.RelatesTo]: "relates-to",
-  [DependencyType.Duplicates]: "duplicates",
-  [UIDependencyType.BlockedBy]: "blocked-by"
-};
-
 // src/tui/components/Header.tsx
 import { Box, Text } from "ink";
 import { jsx, jsxs } from "react/jsx-runtime";
-function getKeyHints(view, isSearchActive) {
+function getKeyHints(view, isSearchActive, focusedPanel) {
   if (isSearchActive) {
     return [
       { key: "enter", desc: "apply" },
       { key: "esc", desc: "cancel" }
     ];
   }
+  if (view === "task-list" && focusedPanel === "epic") {
+    return [
+      { key: "j/k", desc: "nav" },
+      { key: "space", desc: "toggle" },
+      { key: "\u2190", desc: "reorder" },
+      { key: "0", desc: "clear" },
+      { key: "tab", desc: "tasks" },
+      { key: "?", desc: "help" },
+      { key: "q", desc: "quit" }
+    ];
+  }
   if (view === "task-list") {
     return [
       { key: "enter", desc: "view" },
@@ -333,11 +427,15 @@ function getKeyHints(view, isSearchActive) {
       { key: "e", desc: "edit" },
       { key: "d", desc: "del" },
       { key: "s", desc: "status" },
+      { key: "a", desc: "assign" },
+      { key: "A", desc: "unassign" },
       { key: "\u2190", desc: "reorder" },
       { key: "/", desc: "search" },
       { key: "p", desc: "project" },
       { key: "f", desc: "status-f" },
       { key: "t", desc: "type-f" },
+      { key: "PgDn/Up", desc: "page" },
+      { key: "tab", desc: "panel" },
       { key: "?", desc: "help" },
       { key: "q", desc: "quit" }
     ];
@@ -362,10 +460,10 @@ function getKeyHints(view, isSearchActive) {
 function Header({ state }) {
   const projectName = state.activeProject?.name ?? "none";
   const taskCount = state.tasks.length;
-  const hints = getKeyHints(state.activeView, state.isSearchActive);
+  const hints = getKeyHints(state.activeView, state.isSearchActive, state.focusedPanel);
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
     /* @__PURE__ */ jsxs(Box, { gap: 2, children: [
-      /* @__PURE__ */ jsx(Text, { color: theme.logo, bold: true, children: "TaskCLI" }),
+      /* @__PURE__ */ jsx(Text, { color: theme.logo, bold: true, children: "Tayto" }),
       /* @__PURE__ */ jsx(Text, { color: theme.logo, children: "Project:" }),
       /* @__PURE__ */ jsx(Text, { color: "white", bold: true, children: projectName }),
       /* @__PURE__ */ jsx(Text, { dimColor: true, children: "|" }),
@@ -426,7 +524,6 @@ function FlashMessage({ message, level }) {
 // src/tui/components/TaskList.tsx
 import { Box as Box4, Text as Text4 } from "ink";
 import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
-var PAGE_SIZE = 20;
 var COL = {
   rank: 5,
   type: 12,
@@ -443,7 +540,8 @@ function TaskList({
   nonTerminalBlockerIds,
   nonTerminalDependentIds,
   isSelectedBlocked,
-  isFocused = true
+  isFocused = true,
+  epicFilterActive = false
 }) {
   const currentPage = Math.floor(selectedIndex / PAGE_SIZE);
   const viewStart = currentPage * PAGE_SIZE;
@@ -478,6 +576,7 @@ function TaskList({
             " ",
             "REORDER"
           ] }),
+          epicFilterActive && /* @__PURE__ */ jsx4(Text4, { color: theme.titleHighlight, children: " [epic]" }),
           filterText && /* @__PURE__ */ jsxs2(Text4, { color: theme.titleFilter, children: [
             " /",
             filterText
@@ -495,7 +594,7 @@ function TaskList({
           /* @__PURE__ */ jsx4(Text4, { color: theme.table.headerFg, bold: true, children: "STATUS".padEnd(COL.status) }),
           /* @__PURE__ */ jsx4(Text4, { color: theme.table.headerFg, bold: true, children: "NAME" })
         ] }),
-        tasks.length === 0 ? /* @__PURE__ */ jsx4(Box4, { paddingX: 2, paddingY: 1, children: /* @__PURE__ */ jsx4(Text4, { color: theme.fg, children: "No tasks found. Press 'c' to create one." }) }) : visibleTasks.map((task, i) => {
+        /* @__PURE__ */ jsx4(Box4, { flexDirection: "column", flexGrow: 1, overflowY: "hidden", children: tasks.length === 0 ? /* @__PURE__ */ jsx4(Box4, { paddingX: 2, paddingY: 1, children: /* @__PURE__ */ jsx4(Text4, { color: theme.fg, children: "No tasks found. Press 'c' to create one." }) }) : visibleTasks.map((task, i) => {
           const actualIndex = viewStart + i;
           const isSelected = actualIndex === selectedIndex;
           const isNonTerminalBlocker = nonTerminalBlockerIds.has(task.id);
@@ -529,8 +628,7 @@ function TaskList({
             /* @__PURE__ */ jsx4(Text4, { color: STATUS_COLOR[task.status] ?? rowColor, children: task.status.padEnd(COL.status) }),
             /* @__PURE__ */ jsx4(Text4, { color: rowColor, children: task.name })
           ] }, task.id);
-        }),
-        /* @__PURE__ */ jsx4(Box4, { flexGrow: 1 }),
+        }) }),
         tasks.length > PAGE_SIZE && /* @__PURE__ */ jsx4(Box4, { justifyContent: "flex-end", paddingRight: 1, children: /* @__PURE__ */ jsxs2(Text4, { dimColor: true, children: [
           "[",
           viewStart + 1,
@@ -546,7 +644,9 @@ function TaskList({
 }
 
 // src/tui/components/TaskDetail.tsx
-import { Box as Box6, Text as Text6 } from "ink";
+import { useMemo } from "react";
+import { Box as Box6, Text as Text6, useStdout } from "ink";
+import chalk2 from "chalk";
 
 // src/tui/components/Markdown.tsx
 import { Text as Text5, Box as Box5 } from "ink";
@@ -638,15 +738,10 @@ function createRenderer() {
   );
 }
 var marked = createRenderer();
-function Markdown({ content }) {
-  if (!content.trim()) {
-    return /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "No content" });
-  }
+function renderMarkdown(content) {
+  if (!content.trim()) return "";
   const rendered = marked.parse(content);
-  if (typeof rendered !== "string") {
-    return /* @__PURE__ */ jsx5(Text5, { children: content });
-  }
-  return /* @__PURE__ */ jsx5(Text5, { children: rendered.trimEnd() });
+  return typeof rendered === "string" ? rendered.trimEnd() : content;
 }
 function MermaidHint({ content }) {
   const blocks = extractMermaidBlocks(content);
@@ -675,93 +770,109 @@ function openAllMermaidDiagrams(content) {
 
 // src/tui/components/TaskDetail.tsx
 import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
-function Field({ label, value }) {
-  return /* @__PURE__ */ jsxs4(Box6, { gap: 0, children: [
-    /* @__PURE__ */ jsx6(Text6, { color: theme.yaml.key, bold: true, children: label }),
-    /* @__PURE__ */ jsx6(Text6, { color: theme.yaml.colon, children: ": " }),
-    /* @__PURE__ */ jsx6(Text6, { color: theme.yaml.value, children: value })
-  ] });
+var PAD = " ";
+function field(label, value) {
+  return PAD + chalk2.hex(theme.yaml.key).bold(label) + chalk2.hex(theme.yaml.colon)(": ") + chalk2.hex(theme.yaml.value)(value);
+}
+function sectionHeader(title) {
+  return PAD + chalk2.hex(theme.title).bold(`--- ${title} ---`);
+}
+function markdownLines(content) {
+  const rendered = renderMarkdown(content);
+  if (!rendered) return [];
+  return rendered.split("\n").map((line) => PAD + line);
 }
+function buildContentLines(task, blockers, dependents, related, duplicates) {
+  const lines = [];
+  lines.push(field("id", task.id));
+  lines.push(field("type", task.type));
+  lines.push(field("status", task.status));
+  lines.push(field("created", new Date(task.createdAt).toLocaleString()));
+  lines.push(field("updated", new Date(task.updatedAt).toLocaleString()));
+  if (task.parentId) lines.push(field("parent", task.parentId));
+  const hasDeps = blockers.length > 0 || dependents.length > 0 || related.length > 0 || duplicates.length > 0;
+  if (hasDeps) {
+    lines.push(sectionHeader("dependencies"));
+    if (blockers.length > 0) {
+      lines.push(
+        PAD + chalk2.hex(theme.status.error).bold("blocked by: ") + chalk2.hex(theme.yaml.value)(blockers.map((t) => t.id).join(", "))
+      );
+    }
+    if (dependents.length > 0) {
+      lines.push(
+        PAD + chalk2.hex(theme.status.added).bold("blocks: ") + chalk2.hex(theme.yaml.value)(dependents.map((t) => t.id).join(", "))
+      );
+    }
+    if (related.length > 0) {
+      lines.push(
+        PAD + chalk2.hex(theme.status.new).bold("relates to: ") + chalk2.hex(theme.yaml.value)(related.map((t) => t.id).join(", "))
+      );
+    }
+    if (duplicates.length > 0) {
+      lines.push(
+        PAD + chalk2.hex(theme.status.pending).bold("duplicates: ") + chalk2.hex(theme.yaml.value)(duplicates.map((t) => t.id).join(", "))
+      );
+    }
+    lines.push(PAD + chalk2.dim("press D to manage dependencies"));
+  }
+  lines.push(sectionHeader("description"));
+  if (task.description.trim()) {
+    lines.push(...markdownLines(task.description));
+  } else {
+    lines.push(PAD + chalk2.dim("No description"));
+  }
+  if (task.technicalNotes.trim()) {
+    lines.push(sectionHeader("technical notes"));
+    lines.push(...markdownLines(task.technicalNotes));
+  }
+  if (task.additionalRequirements.trim()) {
+    lines.push(sectionHeader("requirements"));
+    lines.push(...markdownLines(task.additionalRequirements));
+  }
+  return lines;
+}
+var CHROME_LINES = 8;
 function TaskDetail({
   task,
-  blockers,
-  dependents,
-  related,
-  duplicates,
-  isFocused = true
+  blockers = [],
+  dependents = [],
+  related = [],
+  duplicates = [],
+  isFocused = true,
+  scrollOffset = 0
 }) {
+  const { stdout } = useStdout();
   const allText = `${task.description}
 ${task.technicalNotes}
 ${task.additionalRequirements}`;
+  const contentLines = useMemo(
+    () => buildContentLines(task, blockers, dependents, related, duplicates),
+    [task, blockers, dependents, related, duplicates]
+  );
+  const viewportHeight = Math.max(1, (stdout.rows > 0 ? stdout.rows : 24) - CHROME_LINES);
+  const visibleLines = contentLines.slice(scrollOffset, scrollOffset + viewportHeight);
   return /* @__PURE__ */ jsxs4(
     Box6,
     {
       flexDirection: "column",
       flexGrow: 1,
       borderStyle: "bold",
-      borderColor: isFocused ? theme.borderFocus : theme.border,
-      children: [
-        /* @__PURE__ */ jsxs4(Box6, { gap: 0, children: [
-          /* @__PURE__ */ jsxs4(Text6, { color: theme.title, bold: true, children: [
-            " ",
-            "detail"
-          ] }),
-          /* @__PURE__ */ jsx6(Text6, { color: theme.fg, children: "(" }),
-          /* @__PURE__ */ jsx6(Text6, { color: theme.titleHighlight, bold: true, children: task.name }),
-          /* @__PURE__ */ jsx6(Text6, { color: theme.fg, children: ")" })
-        ] }),
-        /* @__PURE__ */ jsxs4(Box6, { flexDirection: "column", paddingX: 1, paddingY: 0, children: [
-          /* @__PURE__ */ jsx6(Field, { label: "id", value: task.id }),
-          /* @__PURE__ */ jsx6(Field, { label: "type", value: task.type }),
-          /* @__PURE__ */ jsx6(Field, { label: "status", value: task.status }),
-          /* @__PURE__ */ jsx6(Field, { label: "created", value: new Date(task.createdAt).toLocaleString() }),
-          /* @__PURE__ */ jsx6(Field, { label: "updated", value: new Date(task.updatedAt).toLocaleString() }),
-          task.parentId && /* @__PURE__ */ jsx6(Field, { label: "parent", value: task.parentId })
-        ] }),
-        (blockers && blockers.length > 0 || dependents && dependents.length > 0 || related && related.length > 0 || duplicates && duplicates.length > 0) && /* @__PURE__ */ jsxs4(Box6, { flexDirection: "column", paddingX: 1, children: [
-          /* @__PURE__ */ jsx6(Text6, { color: theme.title, bold: true, children: "--- dependencies ---" }),
-          blockers && blockers.length > 0 && /* @__PURE__ */ jsxs4(Box6, { gap: 0, children: [
-            /* @__PURE__ */ jsxs4(Text6, { color: theme.status.error, bold: true, children: [
-              "blocked by:",
-              " "
-            ] }),
-            /* @__PURE__ */ jsx6(Text6, { color: theme.yaml.value, children: blockers.map((t) => t.id).join(", ") })
-          ] }),
-          dependents && dependents.length > 0 && /* @__PURE__ */ jsxs4(Box6, { gap: 0, children: [
-            /* @__PURE__ */ jsxs4(Text6, { color: theme.status.added, bold: true, children: [
-              "blocks:",
-              " "
-            ] }),
-            /* @__PURE__ */ jsx6(Text6, { color: theme.yaml.value, children: dependents.map((t) => t.id).join(", ") })
-          ] }),
-          related && related.length > 0 && /* @__PURE__ */ jsxs4(Box6, { gap: 0, children: [
-            /* @__PURE__ */ jsxs4(Text6, { color: theme.status.new, bold: true, children: [
-              "relates to:",
-              " "
-            ] }),
-            /* @__PURE__ */ jsx6(Text6, { color: theme.yaml.value, children: related.map((t) => t.id).join(", ") })
-          ] }),
-          duplicates && duplicates.length > 0 && /* @__PURE__ */ jsxs4(Box6, { gap: 0, children: [
-            /* @__PURE__ */ jsxs4(Text6, { color: theme.status.pending, bold: true, children: [
-              "duplicates:",
-              " "
-            ] }),
-            /* @__PURE__ */ jsx6(Text6, { color: theme.yaml.value, children: duplicates.map((t) => t.id).join(", ") })
+      borderColor: isFocused ? theme.borderFocus : theme.border,
+      children: [
+        /* @__PURE__ */ jsxs4(Box6, { gap: 0, children: [
+          /* @__PURE__ */ jsxs4(Text6, { color: theme.title, bold: true, children: [
+            " ",
+            "detail"
           ] }),
-          /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: "press D to manage dependencies" })
-        ] }),
-        /* @__PURE__ */ jsxs4(Box6, { flexDirection: "column", paddingX: 1, children: [
-          /* @__PURE__ */ jsx6(Text6, { color: theme.title, bold: true, children: "--- description ---" }),
-          task.description.trim() ? /* @__PURE__ */ jsx6(Markdown, { content: task.description }) : /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: "No description" })
-        ] }),
-        task.technicalNotes.trim() && /* @__PURE__ */ jsxs4(Box6, { flexDirection: "column", paddingX: 1, children: [
-          /* @__PURE__ */ jsx6(Text6, { color: theme.title, bold: true, children: "--- technical notes ---" }),
-          /* @__PURE__ */ jsx6(Markdown, { content: task.technicalNotes })
-        ] }),
-        task.additionalRequirements.trim() && /* @__PURE__ */ jsxs4(Box6, { flexDirection: "column", paddingX: 1, children: [
-          /* @__PURE__ */ jsx6(Text6, { color: theme.title, bold: true, children: "--- requirements ---" }),
-          /* @__PURE__ */ jsx6(Markdown, { content: task.additionalRequirements })
+          /* @__PURE__ */ jsx6(Text6, { color: theme.fg, children: "(" }),
+          /* @__PURE__ */ jsx6(Text6, { color: theme.titleHighlight, bold: true, children: task.name }),
+          /* @__PURE__ */ jsx6(Text6, { color: theme.fg, children: ")" }),
+          scrollOffset > 0 && /* @__PURE__ */ jsxs4(Text6, { dimColor: true, children: [
+            " \u2191",
+            scrollOffset
+          ] })
         ] }),
+        /* @__PURE__ */ jsx6(Text6, { children: visibleLines.join("\n") }),
         /* @__PURE__ */ jsx6(Box6, { flexGrow: 1 }),
         /* @__PURE__ */ jsx6(Box6, { paddingX: 1, children: /* @__PURE__ */ jsx6(MermaidHint, { content: allText }) })
       ]
@@ -808,7 +919,7 @@ function openInEditor(content, filename) {
 
 // src/tui/components/TaskPicker.tsx
 import { useState } from "react";
-import { Box as Box7, Text as Text7, useInput, useStdout } from "ink";
+import { Box as Box7, Text as Text7, useInput, useStdout as useStdout2 } from "ink";
 import { Fragment, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 var DEP_TYPE_VALUES = Object.values(UIDependencyType);
 var DEP_TYPE_COLOR = {
@@ -818,7 +929,7 @@ var DEP_TYPE_COLOR = {
   [UIDependencyType.BlockedBy]: theme.status.modified
 };
 function TaskPicker({ tasks, excludeIds, initialSelection, onConfirm, onCancel }) {
-  const { stdout } = useStdout();
+  const { stdout } = useStdout2();
   const termHeight = stdout.rows > 0 ? stdout.rows : 24;
   const maxVisible = Math.max(3, termHeight - 12);
   const [searchQuery, setSearchQuery] = useState("");
@@ -1041,13 +1152,13 @@ function TaskForm({ editingTask, allTasks, initialDeps, onSave, onCancel }) {
   const [pickedDeps, setPickedDeps] = useState2(initialDeps ?? []);
   const currentField = FIELDS[focusIndex];
   const launchEditor = useCallback(
-    (field) => {
+    (field2) => {
       setEditorActive(true);
       setTimeout(() => {
-        const content = values[field.key] ?? "";
-        const result = openInEditor(content, field.editorFilename ?? `${field.key}.md`);
+        const content = values[field2.key] ?? "";
+        const result = openInEditor(content, field2.editorFilename ?? `${field2.key}.md`);
         if (result !== null) {
-          setValues((v) => ({ ...v, [field.key]: result }));
+          setValues((v) => ({ ...v, [field2.key]: result }));
         }
         setEditorActive(false);
       }, 50);
@@ -1155,37 +1266,37 @@ function TaskForm({ editingTask, allTasks, initialDeps, onSave, onCancel }) {
       " ",
       isEdit ? "edit" : "create"
     ] }) }),
-    /* @__PURE__ */ jsx8(Box8, { flexDirection: "column", paddingX: 1, paddingY: 0, children: FIELDS.map((field, i) => {
+    /* @__PURE__ */ jsx8(Box8, { flexDirection: "column", paddingX: 1, paddingY: 0, children: FIELDS.map((field2, i) => {
       const isFocused = i === focusIndex;
-      const value = field.key === "dependsOn" ? depSummary : values[field.key] ?? "";
+      const value = field2.key === "dependsOn" ? depSummary : values[field2.key] ?? "";
       const displayValue = value;
       return /* @__PURE__ */ jsxs6(Box8, { gap: 1, children: [
         /* @__PURE__ */ jsxs6(Text8, { color: isFocused ? theme.dialog.label : theme.yaml.key, bold: isFocused, children: [
           isFocused ? ">" : " ",
           " ",
-          field.label.padEnd(14)
+          field2.label.padEnd(14)
         ] }),
-        field.type === "inline" && /* @__PURE__ */ jsxs6(Text8, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
+        field2.type === "inline" && /* @__PURE__ */ jsxs6(Text8, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
           displayValue,
           isFocused ? /* @__PURE__ */ jsx8(Text8, { color: theme.titleHighlight, children: "_" }) : ""
         ] }),
-        field.type === "picker" && /* @__PURE__ */ jsxs6(Text8, { children: [
+        field2.type === "picker" && /* @__PURE__ */ jsxs6(Text8, { children: [
           displayValue ? /* @__PURE__ */ jsx8(Text8, { color: theme.status.added, children: displayValue.length > 60 ? displayValue.slice(0, 60) + "..." : displayValue }) : /* @__PURE__ */ jsx8(Text8, { dimColor: true, children: isFocused ? "press enter to select" : "none" }),
           isFocused && /* @__PURE__ */ jsx8(Text8, { color: theme.menu.key, children: " [enter: open picker]" })
         ] }),
-        field.type === "editor" && /* @__PURE__ */ jsxs6(Text8, { children: [
+        field2.type === "editor" && /* @__PURE__ */ jsxs6(Text8, { children: [
           displayValue ? /* @__PURE__ */ jsxs6(Text8, { color: theme.status.added, children: [
             displayValue.split("\n")[0]?.slice(0, 50),
             displayValue.length > 50 || displayValue.includes("\n") ? "..." : ""
           ] }) : /* @__PURE__ */ jsx8(Text8, { dimColor: true, children: isFocused ? "press enter" : "empty" }),
           isFocused && /* @__PURE__ */ jsx8(Text8, { color: theme.menu.key, children: " [enter: $EDITOR]" })
         ] }),
-        field.type === "select" && /* @__PURE__ */ jsxs6(Text8, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
+        field2.type === "select" && /* @__PURE__ */ jsxs6(Text8, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
           isFocused ? "< " : "  ",
           displayValue,
           isFocused ? " >" : ""
         ] })
-      ] }, field.key);
+      ] }, field2.key);
     }) }),
     /* @__PURE__ */ jsx8(Box8, { flexGrow: 1 }),
     /* @__PURE__ */ jsx8(Box8, { paddingX: 1, children: /* @__PURE__ */ jsx8(Text8, { dimColor: true, children: "tab: next | shift+tab: prev | ctrl+s: save | esc: cancel" }) }),
@@ -1353,26 +1464,26 @@ function ProjectForm({ onSave, onCancel }) {
       " ",
       "new project"
     ] }) }),
-    /* @__PURE__ */ jsx10(Box10, { flexDirection: "column", paddingX: 1, paddingY: 0, children: FIELDS2.map((field, i) => {
+    /* @__PURE__ */ jsx10(Box10, { flexDirection: "column", paddingX: 1, paddingY: 0, children: FIELDS2.map((field2, i) => {
       const isFocused = i === focusIndex;
-      const value = values[field.key] ?? "";
+      const value = values[field2.key] ?? "";
       return /* @__PURE__ */ jsxs8(Box10, { gap: 1, children: [
         /* @__PURE__ */ jsxs8(Text10, { color: isFocused ? theme.dialog.label : theme.yaml.key, bold: isFocused, children: [
           isFocused ? ">" : " ",
           " ",
-          field.label.padEnd(14)
+          field2.label.padEnd(14)
         ] }),
-        field.type === "inline" && /* @__PURE__ */ jsxs8(Text10, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
+        field2.type === "inline" && /* @__PURE__ */ jsxs8(Text10, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
           value,
           isFocused ? /* @__PURE__ */ jsx10(Text10, { color: theme.titleHighlight, children: "_" }) : "",
-          field.key === "key" && !value && /* @__PURE__ */ jsx10(Text10, { dimColor: true, children: isFocused ? " (auto from name)" : "" })
+          field2.key === "key" && !value && /* @__PURE__ */ jsx10(Text10, { dimColor: true, children: isFocused ? " (auto from name)" : "" })
         ] }),
-        field.type === "toggle" && /* @__PURE__ */ jsxs8(Text10, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
+        field2.type === "toggle" && /* @__PURE__ */ jsxs8(Text10, { color: isFocused ? theme.yaml.value : theme.table.fg, children: [
           isFocused ? "< " : "  ",
           value,
           isFocused ? " >" : ""
         ] })
-      ] }, field.key);
+      ] }, field2.key);
     }) }),
     /* @__PURE__ */ jsx10(Box10, { flexGrow: 1 }),
     /* @__PURE__ */ jsx10(Box10, { paddingX: 1, children: /* @__PURE__ */ jsx10(Text10, { dimColor: true, children: "tab: next | shift+tab: prev | ctrl+s: save | esc: cancel" }) })
@@ -1388,6 +1499,8 @@ var SECTIONS = [
     keys: [
       ["j/k", "Up/Down"],
       ["g/G", "Top/Bottom"],
+      ["PgDn", "Page down"],
+      ["PgUp", "Page up"],
       ["enter", "View"],
       ["esc", "Back"]
     ]
@@ -1634,8 +1747,256 @@ function DependencyList({
   ] });
 }
 
-// src/tui/components/App.tsx
+// src/tui/components/EpicPanel.tsx
+import { Box as Box14, Text as Text14 } from "ink";
 import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+var PAGE_SIZE2 = 20;
+function EpicPanel({
+  epics,
+  selectedIndex,
+  selectedEpicIds,
+  isFocused,
+  isReordering = false
+}) {
+  const filterActive = selectedEpicIds.size > 0;
+  const currentPage = Math.floor(selectedIndex / PAGE_SIZE2);
+  const viewStart = currentPage * PAGE_SIZE2;
+  const visibleEpics = epics.slice(viewStart, viewStart + PAGE_SIZE2);
+  return /* @__PURE__ */ jsxs12(
+    Box14,
+    {
+      flexDirection: "column",
+      width: 48,
+      borderStyle: "bold",
+      borderColor: isFocused ? theme.borderFocus : theme.border,
+      children: [
+        /* @__PURE__ */ jsxs12(Box14, { children: [
+          /* @__PURE__ */ jsxs12(Text14, { color: theme.title, bold: true, children: [
+            " ",
+            "epics"
+          ] }),
+          /* @__PURE__ */ jsxs12(Text14, { color: theme.titleCounter, bold: true, children: [
+            "[",
+            epics.length,
+            "]"
+          ] }),
+          isReordering && /* @__PURE__ */ jsxs12(Text14, { color: theme.flash.warn, bold: true, children: [
+            " ",
+            "REORDER"
+          ] }),
+          filterActive && /* @__PURE__ */ jsxs12(Text14, { color: theme.titleFilter, children: [
+            " *",
+            selectedEpicIds.size
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx14(Box14, { flexDirection: "column", flexGrow: 1, overflowY: "hidden", children: epics.length === 0 ? /* @__PURE__ */ jsx14(Box14, { paddingX: 1, children: /* @__PURE__ */ jsx14(Text14, { dimColor: true, children: "No epics" }) }) : visibleEpics.map((epic, i) => {
+          const actualIndex = viewStart + i;
+          const isSelected = actualIndex === selectedIndex && isFocused;
+          const isChecked = selectedEpicIds.has(epic.id);
+          const marker = isChecked ? "[x]" : "[ ]";
+          const statusColor = STATUS_COLOR[epic.status] ?? theme.table.fg;
+          if (isSelected) {
+            const cursorBg = isReordering ? theme.flash.warn : theme.table.cursorBg;
+            return /* @__PURE__ */ jsx14(Box14, { children: /* @__PURE__ */ jsxs12(Text14, { backgroundColor: cursorBg, color: theme.table.cursorFg, bold: true, children: [
+              isReordering ? "~ " : " ",
+              marker,
+              " ",
+              epic.name
+            ] }) }, epic.id);
+          }
+          return /* @__PURE__ */ jsx14(Box14, { children: /* @__PURE__ */ jsxs12(Text14, { color: isChecked ? theme.titleHighlight : statusColor, children: [
+            " ",
+            marker,
+            " ",
+            epic.name
+          ] }) }, epic.id);
+        }) }),
+        epics.length > PAGE_SIZE2 && /* @__PURE__ */ jsx14(Box14, { justifyContent: "flex-end", paddingRight: 1, children: /* @__PURE__ */ jsxs12(Text14, { dimColor: true, children: [
+          "[",
+          viewStart + 1,
+          "-",
+          Math.min(viewStart + PAGE_SIZE2, epics.length),
+          "/",
+          epics.length,
+          "]"
+        ] }) })
+      ]
+    }
+  );
+}
+
+// src/tui/components/EpicPicker.tsx
+import { useState as useState5 } from "react";
+import { Box as Box15, Text as Text15, useInput as useInput5, useStdout as useStdout3 } from "ink";
+import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+function EpicPicker({ epics, currentEpicId, onSelect, onCancel }) {
+  const { stdout } = useStdout3();
+  const termHeight = stdout.rows > 0 ? stdout.rows : 24;
+  const maxVisible = Math.max(3, termHeight - 10);
+  const [searchQuery, setSearchQuery] = useState5("");
+  const [isSearching, setIsSearching] = useState5(false);
+  const [cursorIndex, setCursorIndex] = useState5(0);
+  const filtered = epics.filter((e) => {
+    if (!searchQuery.trim()) return true;
+    const q = searchQuery.toLowerCase();
+    return e.id.toLowerCase().includes(q) || e.name.toLowerCase().includes(q) || e.description.toLowerCase().includes(q);
+  });
+  let viewStart = 0;
+  if (cursorIndex >= viewStart + maxVisible) {
+    viewStart = cursorIndex - maxVisible + 1;
+  }
+  if (cursorIndex < viewStart) {
+    viewStart = cursorIndex;
+  }
+  const visible = filtered.slice(viewStart, viewStart + maxVisible);
+  useInput5((input, key) => {
+    if (isSearching) {
+      if (key.escape) {
+        setIsSearching(false);
+        return;
+      }
+      if (key.return) {
+        setIsSearching(false);
+        setCursorIndex(0);
+        return;
+      }
+      if (key.backspace || key.delete) {
+        setSearchQuery((q) => q.slice(0, -1));
+        setCursorIndex(0);
+        return;
+      }
+      if (input && !key.ctrl && !key.meta) {
+        setSearchQuery((q) => q + input);
+        setCursorIndex(0);
+        return;
+      }
+      return;
+    }
+    if (key.upArrow || input === "k") {
+      setCursorIndex((i) => Math.max(0, i - 1));
+      return;
+    }
+    if (key.downArrow || input === "j") {
+      setCursorIndex((i) => Math.min(filtered.length - 1, i + 1));
+      return;
+    }
+    if (key.return) {
+      const epic = filtered[cursorIndex];
+      if (epic) {
+        onSelect(epic.id);
+      }
+      return;
+    }
+    if (input === "x") {
+      onSelect(null);
+      return;
+    }
+    if (input === "/") {
+      setIsSearching(true);
+      setSearchQuery("");
+      return;
+    }
+    if (key.escape || input === "q") {
+      onCancel();
+      return;
+    }
+  });
+  return /* @__PURE__ */ jsxs13(Box15, { flexDirection: "column", borderStyle: "bold", borderColor: theme.borderFocus, flexGrow: 1, children: [
+    /* @__PURE__ */ jsxs13(Box15, { gap: 0, children: [
+      /* @__PURE__ */ jsxs13(Text15, { color: theme.title, bold: true, children: [
+        " ",
+        "assign to epic"
+      ] }),
+      /* @__PURE__ */ jsxs13(Text15, { color: theme.titleCounter, bold: true, children: [
+        " ",
+        "[",
+        epics.length,
+        "]"
+      ] })
+    ] }),
+    isSearching ? /* @__PURE__ */ jsxs13(Box15, { borderStyle: "round", borderColor: theme.prompt, paddingX: 1, children: [
+      /* @__PURE__ */ jsx15(Text15, { color: theme.prompt, children: "/" }),
+      /* @__PURE__ */ jsx15(Text15, { color: theme.prompt, children: searchQuery }),
+      /* @__PURE__ */ jsx15(Text15, { color: theme.promptSuggest, children: "_" })
+    ] }) : searchQuery ? /* @__PURE__ */ jsx15(Box15, { paddingX: 1, children: /* @__PURE__ */ jsxs13(Text15, { color: theme.titleFilter, children: [
+      "/",
+      searchQuery
+    ] }) }) : null,
+    /* @__PURE__ */ jsx15(Box15, { paddingX: 1, children: /* @__PURE__ */ jsxs13(Text15, { color: theme.table.headerFg, bold: true, children: [
+      "  ",
+      "ID".padEnd(14),
+      "STATUS".padEnd(14),
+      "NAME"
+    ] }) }),
+    filtered.length === 0 ? /* @__PURE__ */ jsx15(Box15, { paddingX: 2, paddingY: 1, children: /* @__PURE__ */ jsx15(Text15, { dimColor: true, children: "No epics match the filter" }) }) : visible.map((epic, i) => {
+      const actualIndex = viewStart + i;
+      const isCursor = actualIndex === cursorIndex;
+      const isCurrent = epic.id === currentEpicId;
+      const marker = isCurrent ? "* " : "  ";
+      const statusColor = STATUS_COLOR[epic.status] ?? theme.table.fg;
+      return /* @__PURE__ */ jsx15(Box15, { paddingX: 1, children: isCursor ? /* @__PURE__ */ jsxs13(Text15, { backgroundColor: theme.table.cursorBg, color: theme.table.cursorFg, bold: true, children: [
+        "> ",
+        epic.id.padEnd(14),
+        epic.status.padEnd(14),
+        epic.name
+      ] }) : /* @__PURE__ */ jsxs13(Fragment3, { children: [
+        /* @__PURE__ */ jsx15(Text15, { color: isCurrent ? theme.titleHighlight : theme.table.fg, children: marker }),
+        /* @__PURE__ */ jsx15(Text15, { color: theme.yaml.value, children: epic.id.padEnd(14) }),
+        /* @__PURE__ */ jsx15(Text15, { color: statusColor, children: epic.status.padEnd(14) }),
+        /* @__PURE__ */ jsx15(Text15, { color: isCurrent ? theme.titleHighlight : theme.table.fg, children: epic.name })
+      ] }) }, epic.id);
+    }),
+    /* @__PURE__ */ jsx15(Box15, { flexGrow: 1 }),
+    filtered.length > maxVisible && /* @__PURE__ */ jsx15(Box15, { justifyContent: "flex-end", paddingRight: 1, children: /* @__PURE__ */ jsxs13(Text15, { dimColor: true, children: [
+      "[",
+      viewStart + 1,
+      "-",
+      Math.min(viewStart + maxVisible, filtered.length),
+      "/",
+      filtered.length,
+      "]"
+    ] }) }),
+    /* @__PURE__ */ jsx15(Box15, { paddingX: 1, children: /* @__PURE__ */ jsx15(Text15, { dimColor: true, children: "enter: assign | x: unassign | /: search | esc: cancel" }) })
+  ] });
+}
+
+// src/tui/useAutoRefetch.ts
+import { useEffect, useRef } from "react";
+import { watchFile, unwatchFile } from "fs";
+var POLL_INTERVAL_MS = 1e3;
+var DEBOUNCE_MS = 200;
+function useAutoRefetch(dbPath, onRefetch) {
+  const callbackRef = useRef(onRefetch);
+  callbackRef.current = onRefetch;
+  useEffect(() => {
+    let debounceTimer = null;
+    const handleChange = () => {
+      if (debounceTimer) clearTimeout(debounceTimer);
+      debounceTimer = setTimeout(() => {
+        logger.info("useAutoRefetch: external db change detected, refetching");
+        callbackRef.current();
+      }, DEBOUNCE_MS);
+    };
+    const walPath = `${dbPath}-wal`;
+    const listener = (curr, prev) => {
+      if (curr.mtimeMs !== prev.mtimeMs) {
+        handleChange();
+      }
+    };
+    watchFile(dbPath, { interval: POLL_INTERVAL_MS }, listener);
+    watchFile(walPath, { interval: POLL_INTERVAL_MS }, listener);
+    logger.info(`useAutoRefetch: watching ${dbPath} (poll ${POLL_INTERVAL_MS}ms)`);
+    return () => {
+      unwatchFile(dbPath, listener);
+      unwatchFile(walPath, listener);
+      if (debounceTimer) clearTimeout(debounceTimer);
+      logger.info("useAutoRefetch: stopped watching");
+    };
+  }, [dbPath]);
+}
+
+// src/tui/components/App.tsx
+import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
 var STATUS_CYCLE = [
   TaskStatus.Backlog,
   TaskStatus.Todo,
@@ -1643,9 +2004,25 @@ var STATUS_CYCLE = [
   TaskStatus.Review,
   TaskStatus.Done
 ];
+var EPIC_PANEL_WIDTH = 48;
 function App({ container, initialProject }) {
   const { exit } = useApp();
+  const { stdout } = useStdout4();
   const [state, dispatch] = useReducer(appReducer, initialState);
+  const [, setResizeTick] = useState6(0);
+  useEffect2(() => {
+    const onResize = () => {
+      setResizeTick((n) => n + 1);
+    };
+    stdout.on("resize", onResize);
+    return () => {
+      stdout.off("resize", onResize);
+    };
+  }, [stdout]);
+  const termWidth = stdout.columns > 0 ? stdout.columns : 120;
+  const remaining = Math.max(0, termWidth - EPIC_PANEL_WIDTH - 2);
+  const taskListWidth = Math.floor(remaining * 0.6);
+  const taskDetailWidth = remaining - taskListWidth;
   const loadProjects = useCallback2(() => {
     const result = container.projectService.listProjects();
     if (result.ok) {
@@ -1658,10 +2035,13 @@ function App({ container, initialProject }) {
   }, [container]);
   const loadTasks = useCallback2(() => {
     logger.startSpan("TUI.loadTasks", () => {
-      const filter = { ...state.filter };
+      const filter = { ...state.filter, level: TaskLevel.Work };
       if (state.activeProject) {
         filter.projectId = state.activeProject.id;
       }
+      if (state.selectedEpicIds.size > 0) {
+        filter.parentIds = [...state.selectedEpicIds];
+      }
       const result = container.taskService.listTasks(filter);
       if (result.ok) {
         logger.info(`TUI.loadTasks: loaded ${result.value.length} tasks`);
@@ -1671,7 +2051,19 @@ function App({ container, initialProject }) {
         dispatch({ type: "FLASH", message: result.error.message, level: "error" });
       }
     });
-  }, [container, state.filter, state.activeProject]);
+  }, [container, state.filter, state.activeProject, state.selectedEpicIds]);
+  const loadEpics = useCallback2(() => {
+    if (!state.activeProject) return;
+    const result = container.taskService.listTasks({
+      projectId: state.activeProject.id,
+      level: TaskLevel.Epic
+    });
+    if (result.ok) {
+      dispatch({ type: "SET_EPICS", epics: result.value });
+    } else {
+      logger.error("TUI.loadEpics: failed", result.error);
+    }
+  }, [container, state.activeProject]);
   const loadDeps = useCallback2(
     (taskId) => {
       const blockersResult = container.dependencyService.listBlockers(taskId);
@@ -1700,11 +2092,12 @@ function App({ container, initialProject }) {
           dispatch({ type: "SELECT_TASK", task: result.value });
         }
         loadTasks();
+        loadEpics();
       } else {
         dispatch({ type: "FLASH", message: result.error.message, level: "error" });
       }
     },
-    [container, state.selectedTask, loadTasks]
+    [container, state.selectedTask, loadTasks, loadEpics]
   );
   const saveReorder = useCallback2(() => {
     const tasks = state.tasks;
@@ -1722,10 +2115,32 @@ function App({ container, initialProject }) {
     });
     loadTasks();
   }, [container, state.tasks, state.selectedIndex, loadTasks]);
-  useEffect(() => {
+  const saveEpicReorder = useCallback2(() => {
+    const epics = state.epics;
+    const idx = state.epicSelectedIndex;
+    const epic = epics[idx];
+    if (!epic) return;
+    const prev = epics[idx - 1];
+    const next = epics[idx + 1];
+    const result = prev ? container.taskService.rerankTask({ taskId: epic.id, afterId: prev.id }) : next ? container.taskService.rerankTask({ taskId: epic.id, beforeId: next.id }) : container.taskService.rerankTask({ taskId: epic.id, position: 1 });
+    dispatch({ type: "EXIT_EPIC_REORDER", save: result.ok });
+    dispatch({
+      type: "FLASH",
+      message: result.ok ? "Epic rank saved" : result.error.message,
+      level: result.ok ? "info" : "error"
+    });
+    loadEpics();
+  }, [container, state.epics, state.epicSelectedIndex, loadEpics]);
+  const refetchAll = useCallback2(() => {
+    loadProjects();
+    loadTasks();
+    loadEpics();
+  }, [loadProjects, loadTasks, loadEpics]);
+  useAutoRefetch(container.dbPath, refetchAll);
+  useEffect2(() => {
     loadProjects();
   }, [loadProjects]);
-  useEffect(() => {
+  useEffect2(() => {
     if (state.projects.length > 0 && !state.activeProject) {
       logger.info(`TUI.resolveProject: resolving initialProject=${initialProject ?? "(default)"}`);
       const result = container.projectService.resolveProject(initialProject);
@@ -1742,12 +2157,13 @@ function App({ container, initialProject }) {
       }
     }
   }, [state.projects, state.activeProject, initialProject, container]);
-  useEffect(() => {
+  useEffect2(() => {
     if (state.activeProject) {
       loadTasks();
+      loadEpics();
     }
-  }, [state.activeProject, state.filter, loadTasks]);
-  useEffect(() => {
+  }, [state.activeProject, state.filter, loadTasks, loadEpics]);
+  useEffect2(() => {
     if (state.flash) {
       const timer = setTimeout(() => {
         dispatch({ type: "CLEAR_FLASH" });
@@ -1758,7 +2174,7 @@ function App({ container, initialProject }) {
     }
     return void 0;
   }, [state.flash]);
-  useInput5((input, key) => {
+  useInput6((input, key) => {
     if (state.confirmDelete) {
       if (input === "y") {
         const result = container.taskService.deleteTask(state.confirmDelete.id);
@@ -1769,6 +2185,7 @@ function App({ container, initialProject }) {
             dispatch({ type: "GO_BACK" });
           }
           loadTasks();
+          loadEpics();
         } else {
           dispatch({ type: "FLASH", message: result.error.message, level: "error" });
           dispatch({ type: "CANCEL_DELETE" });
@@ -1782,7 +2199,7 @@ function App({ container, initialProject }) {
       dispatch({ type: "GO_BACK" });
       return;
     }
-    if (state.activeView === ViewType.TaskCreate || state.activeView === ViewType.TaskEdit || state.activeView === ViewType.ProjectSelector || state.activeView === ViewType.ProjectCreate) {
+    if (state.activeView === ViewType.TaskCreate || state.activeView === ViewType.TaskEdit || state.activeView === ViewType.ProjectSelector || state.activeView === ViewType.ProjectCreate || state.activeView === ViewType.EpicPicker) {
       return;
     }
     if (state.activeView === ViewType.DependencyList && state.isAddingDep) {
@@ -1853,6 +2270,26 @@ function App({ container, initialProject }) {
       }
       return;
     }
+    if (state.isEpicReordering) {
+      if (key.upArrow || input === "k") {
+        dispatch({ type: "EPIC_REORDER_MOVE", direction: "up" });
+        return;
+      }
+      if (key.downArrow || input === "j") {
+        dispatch({ type: "EPIC_REORDER_MOVE", direction: "down" });
+        return;
+      }
+      if (key.rightArrow) {
+        saveEpicReorder();
+        return;
+      }
+      if (key.escape || key.leftArrow) {
+        dispatch({ type: "EXIT_EPIC_REORDER", save: false });
+        dispatch({ type: "FLASH", message: "Epic reorder cancelled", level: "info" });
+        return;
+      }
+      return;
+    }
     if (state.isReordering) {
       if (key.upArrow || input === "k") {
         dispatch({ type: "REORDER_MOVE", direction: "up" });
@@ -1889,13 +2326,49 @@ function App({ container, initialProject }) {
       dispatch({ type: "NAVIGATE_TO", view: ViewType.Help });
       return;
     }
-    if (key.tab && state.activeView === ViewType.TaskList && previewTask) {
-      dispatch({
-        type: "SET_PANEL_FOCUS",
-        panel: state.focusedPanel === "list" ? "detail" : "list"
-      });
+    if (key.tab && state.activeView === ViewType.TaskList) {
+      const panels = previewTask ? ["epic", "list", "detail"] : ["epic", "list"];
+      const curIdx = panels.indexOf(state.focusedPanel);
+      const nextPanel = panels[(curIdx + 1) % panels.length] ?? "list";
+      dispatch({ type: "SET_PANEL_FOCUS", panel: nextPanel });
       return;
     }
+    if (state.activeView === ViewType.TaskList && state.focusedPanel === "epic") {
+      if (key.upArrow || input === "k") {
+        dispatch({ type: "EPIC_MOVE_CURSOR", direction: "up" });
+        return;
+      }
+      if (key.downArrow || input === "j") {
+        dispatch({ type: "EPIC_MOVE_CURSOR", direction: "down" });
+        return;
+      }
+      if (input === " " || key.return) {
+        const epic = state.epics[state.epicSelectedIndex];
+        if (epic) {
+          dispatch({ type: "TOGGLE_EPIC", epicId: epic.id });
+        }
+        return;
+      }
+      if (input === "0") {
+        dispatch({ type: "CLEAR_EPIC_SELECTION" });
+        return;
+      }
+      if (key.leftArrow) {
+        if (state.epics.length > 0) {
+          dispatch({ type: "ENTER_EPIC_REORDER" });
+          dispatch({
+            type: "FLASH",
+            message: "Reorder: \u2191\u2193 move, \u2192 save, \u2190 cancel",
+            level: "info"
+          });
+        }
+        return;
+      }
+      if (input === "q") {
+        exit();
+        return;
+      }
+    }
     if (state.activeView === ViewType.TaskList && state.focusedPanel === "list") {
       if (key.upArrow || input === "k") {
         dispatch({ type: "MOVE_CURSOR", direction: "up" });
@@ -1913,6 +2386,14 @@ function App({ container, initialProject }) {
         dispatch({ type: "SET_CURSOR", index: state.tasks.length - 1 });
         return;
       }
+      if (key.pageDown || key.ctrl && input === "d") {
+        dispatch({ type: "PAGE_CURSOR", direction: "down" });
+        return;
+      }
+      if (key.pageUp || key.ctrl && input === "u") {
+        dispatch({ type: "PAGE_CURSOR", direction: "up" });
+        return;
+      }
       if (key.return) {
         const task = state.tasks[state.selectedIndex];
         if (task) {
@@ -1949,6 +2430,30 @@ function App({ container, initialProject }) {
         }
         return;
       }
+      if (input === "a") {
+        const task = state.tasks[state.selectedIndex];
+        if (task) {
+          dispatch({ type: "SELECT_TASK", task });
+          dispatch({ type: "NAVIGATE_TO", view: ViewType.EpicPicker });
+        }
+        return;
+      }
+      if (input === "A") {
+        const task = state.tasks[state.selectedIndex];
+        if (task && task.parentId) {
+          const result = container.taskService.updateTask(task.id, { parentId: null });
+          if (result.ok) {
+            dispatch({ type: "FLASH", message: "Unassigned from epic", level: "info" });
+            loadTasks();
+            loadEpics();
+          } else {
+            dispatch({ type: "FLASH", message: result.error.message, level: "error" });
+          }
+        } else if (task) {
+          dispatch({ type: "FLASH", message: "Task has no epic", level: "warn" });
+        }
+        return;
+      }
       if (input === "/") {
         dispatch({ type: "SET_SEARCH_ACTIVE", active: true });
         dispatch({ type: "SET_SEARCH_QUERY", query: "" });
@@ -1959,6 +2464,22 @@ function App({ container, initialProject }) {
         return;
       }
       if (key.leftArrow) {
+        if (state.selectedEpicIds.size > 0) {
+          dispatch({
+            type: "FLASH",
+            message: "Clear epic filter (0) before reordering",
+            level: "warn"
+          });
+          return;
+        }
+        if (state.filter.status || state.filter.type || state.filter.search) {
+          dispatch({
+            type: "FLASH",
+            message: "Clear filters (0) before reordering",
+            level: "warn"
+          });
+          return;
+        }
         if (state.tasks.length > 0) {
           dispatch({ type: "ENTER_REORDER" });
           dispatch({ type: "FLASH", message: "Reorder: \u2191\u2193 move, \u2192 save, \u2190 cancel", level: "info" });
@@ -1987,6 +2508,14 @@ function App({ container, initialProject }) {
       }
     }
     if (state.activeView === ViewType.TaskList && state.focusedPanel === "detail" && previewTask) {
+      if (key.upArrow || input === "k") {
+        dispatch({ type: "DETAIL_SCROLL", direction: "up" });
+        return;
+      }
+      if (key.downArrow || input === "j") {
+        dispatch({ type: "DETAIL_SCROLL", direction: "down" });
+        return;
+      }
       if (input === "e") {
         dispatch({ type: "SELECT_TASK", task: previewTask });
         dispatch({ type: "NAVIGATE_TO", view: ViewType.TaskEdit });
@@ -2022,6 +2551,14 @@ ${previewTask.additionalRequirements}`;
       }
     }
     if (state.activeView === ViewType.TaskDetail) {
+      if (key.upArrow || input === "k") {
+        dispatch({ type: "DETAIL_SCROLL", direction: "up" });
+        return;
+      }
+      if (key.downArrow || input === "j") {
+        dispatch({ type: "DETAIL_SCROLL", direction: "down" });
+        return;
+      }
       if (input === "e" && state.selectedTask) {
         dispatch({ type: "NAVIGATE_TO", view: ViewType.TaskEdit });
         return;
@@ -2141,22 +2678,53 @@ ${state.selectedTask.additionalRequirements}`;
         loadDeps(taskId);
         dispatch({ type: "GO_BACK" });
         loadTasks();
+        loadEpics();
       } else {
         const result = container.taskService.createTask(data, state.activeProject?.id);
         if (result.ok) {
           dispatch({ type: "FLASH", message: "Task created", level: "info" });
           dispatch({ type: "GO_BACK" });
           loadTasks();
+          loadEpics();
         } else {
           dispatch({ type: "FLASH", message: result.error.message, level: "error" });
         }
       }
     },
-    [container, state.activeView, state.selectedTask, state.activeProject, loadTasks, loadDeps]
+    [
+      container,
+      state.activeView,
+      state.selectedTask,
+      state.activeProject,
+      loadTasks,
+      loadDeps,
+      loadEpics
+    ]
   );
   const handleFormCancel = useCallback2(() => {
     dispatch({ type: "GO_BACK" });
   }, []);
+  const handleEpicPickerSelect = useCallback2(
+    (epicId) => {
+      if (!state.selectedTask) return;
+      const result = container.taskService.updateTask(state.selectedTask.id, {
+        parentId: epicId
+      });
+      if (result.ok) {
+        const msg = epicId ? `Assigned to ${epicId}` : "Unassigned from epic";
+        dispatch({ type: "FLASH", message: msg, level: "info" });
+        loadTasks();
+        loadEpics();
+      } else {
+        dispatch({ type: "FLASH", message: result.error.message, level: "error" });
+      }
+      dispatch({ type: "GO_BACK" });
+    },
+    [container, state.selectedTask, loadTasks, loadEpics]
+  );
+  const handleEpicPickerCancel = useCallback2(() => {
+    dispatch({ type: "GO_BACK" });
+  }, []);
   const handleProjectSelect = useCallback2((project) => {
     dispatch({ type: "SET_ACTIVE_PROJECT", project });
     dispatch({ type: "GO_BACK" });
@@ -2167,7 +2735,11 @@ ${state.selectedTask.additionalRequirements}`;
       const result = container.projectService.updateProject(project.id, { isDefault: true });
       if (result.ok) {
         logger.info(`TUI.setDefault: set key=${result.value.key} as default`);
-        dispatch({ type: "FLASH", message: `Default project: ${result.value.name}`, level: "info" });
+        dispatch({
+          type: "FLASH",
+          message: `Default project: ${result.value.name}`,
+          level: "info"
+        });
         loadProjects();
       } else {
         logger.error("TUI.setDefault: failed", result.error);
@@ -2212,7 +2784,7 @@ ${state.selectedTask.additionalRequirements}`;
     dispatch({ type: "GO_BACK" });
   }, []);
   const previewTask = state.tasks[state.selectedIndex] ?? null;
-  const initialDepsForEdit = useMemo(() => {
+  const initialDepsForEdit = useMemo2(() => {
     return [
       ...state.depBlockers.map((t) => ({ id: t.id, name: t.name, type: DependencyType.Blocks })),
       ...state.depRelated.map((t) => ({ id: t.id, name: t.name, type: DependencyType.RelatesTo })),
@@ -2223,23 +2795,33 @@ ${state.selectedTask.additionalRequirements}`;
       }))
     ];
   }, [state.depBlockers, state.depRelated, state.depDuplicates]);
-  const allProjectTasks = useMemo(() => {
+  const allProjectTasks = useMemo2(() => {
     if (!state.activeProject) return [];
     const result = container.taskService.listTasks({ projectId: state.activeProject.id });
     return result.ok ? result.value : [];
   }, [container, state.activeProject, state.tasks]);
   const previewTaskId = previewTask?.id ?? null;
-  useEffect(() => {
+  useEffect2(() => {
     if (state.activeView === ViewType.TaskList && previewTaskId) {
       loadDeps(previewTaskId);
     }
   }, [state.activeView, previewTaskId, loadDeps]);
-  return /* @__PURE__ */ jsxs12(Box14, { flexDirection: "column", height: "100%", children: [
-    /* @__PURE__ */ jsx14(Header, { state }),
-    /* @__PURE__ */ jsxs12(Box14, { flexDirection: "column", flexGrow: 1, children: [
-      state.confirmDelete && /* @__PURE__ */ jsx14(ConfirmDialog, { task: state.confirmDelete }),
-      !state.confirmDelete && state.activeView === ViewType.TaskList && /* @__PURE__ */ jsxs12(Box14, { flexDirection: "row", flexGrow: 1, children: [
-        /* @__PURE__ */ jsx14(Box14, { width: "50%", children: /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsxs14(Box16, { flexDirection: "column", height: stdout.rows, children: [
+    /* @__PURE__ */ jsx16(Header, { state }),
+    /* @__PURE__ */ jsxs14(Box16, { flexDirection: "column", flexGrow: 1, overflowY: "hidden", children: [
+      state.confirmDelete && /* @__PURE__ */ jsx16(ConfirmDialog, { task: state.confirmDelete }),
+      !state.confirmDelete && state.activeView === ViewType.TaskList && /* @__PURE__ */ jsxs14(Box16, { flexDirection: "row", flexGrow: 1, children: [
+        /* @__PURE__ */ jsx16(
+          EpicPanel,
+          {
+            epics: state.epics,
+            selectedIndex: state.epicSelectedIndex,
+            selectedEpicIds: state.selectedEpicIds,
+            isFocused: state.focusedPanel === "epic",
+            isReordering: state.isEpicReordering
+          }
+        ),
+        /* @__PURE__ */ jsx16(Box16, { width: taskListWidth, children: /* @__PURE__ */ jsx16(
           TaskList,
           {
             tasks: state.tasks,
@@ -2256,10 +2838,11 @@ ${state.selectedTask.additionalRequirements}`;
               state.depDependents.filter((t) => !isTerminalStatus(t.status)).map((t) => t.id)
             ),
             isSelectedBlocked: state.depBlockers.some((t) => !isTerminalStatus(t.status)),
-            isFocused: state.focusedPanel === "list"
+            isFocused: state.focusedPanel === "list",
+            epicFilterActive: state.selectedEpicIds.size > 0
           }
         ) }),
-        /* @__PURE__ */ jsx14(Box14, { flexGrow: 1, children: previewTask ? /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx16(Box16, { width: taskDetailWidth, children: previewTask ? /* @__PURE__ */ jsx16(
           TaskDetail,
           {
             task: previewTask,
@@ -2267,36 +2850,38 @@ ${state.selectedTask.additionalRequirements}`;
             dependents: state.depDependents,
             related: state.depRelated,
             duplicates: state.depDuplicates,
-            isFocused: state.focusedPanel === "detail"
+            isFocused: state.focusedPanel === "detail",
+            scrollOffset: state.detailScrollOffset
           }
-        ) : /* @__PURE__ */ jsxs12(
-          Box14,
+        ) : /* @__PURE__ */ jsxs14(
+          Box16,
           {
             flexDirection: "column",
             flexGrow: 1,
             borderStyle: "bold",
             borderColor: theme.border,
             children: [
-              /* @__PURE__ */ jsx14(Box14, { children: /* @__PURE__ */ jsxs12(Text14, { color: theme.title, bold: true, children: [
+              /* @__PURE__ */ jsx16(Box16, { children: /* @__PURE__ */ jsxs14(Text16, { color: theme.title, bold: true, children: [
                 " ",
                 "detail"
               ] }) }),
-              /* @__PURE__ */ jsx14(Box14, { flexGrow: 1, justifyContent: "center", alignItems: "center", children: /* @__PURE__ */ jsx14(Text14, { dimColor: true, children: "No task selected" }) })
+              /* @__PURE__ */ jsx16(Box16, { flexGrow: 1, justifyContent: "center", alignItems: "center", children: /* @__PURE__ */ jsx16(Text16, { dimColor: true, children: "No task selected" }) })
             ]
           }
         ) })
       ] }),
-      !state.confirmDelete && state.activeView === ViewType.TaskDetail && state.selectedTask && /* @__PURE__ */ jsx14(
+      !state.confirmDelete && state.activeView === ViewType.TaskDetail && state.selectedTask && /* @__PURE__ */ jsx16(
         TaskDetail,
         {
           task: state.selectedTask,
           blockers: state.depBlockers,
           dependents: state.depDependents,
           related: state.depRelated,
-          duplicates: state.depDuplicates
+          duplicates: state.depDuplicates,
+          scrollOffset: state.detailScrollOffset
         }
       ),
-      !state.confirmDelete && state.activeView === ViewType.DependencyList && state.selectedTask && /* @__PURE__ */ jsx14(
+      !state.confirmDelete && state.activeView === ViewType.DependencyList && state.selectedTask && /* @__PURE__ */ jsx16(
         DependencyList,
         {
           task: state.selectedTask,
@@ -2309,7 +2894,7 @@ ${state.selectedTask.additionalRequirements}`;
           addDepInput: state.addDepInput
         }
       ),
-      !state.confirmDelete && (state.activeView === ViewType.TaskCreate || state.activeView === ViewType.TaskEdit) && /* @__PURE__ */ jsx14(
+      !state.confirmDelete && (state.activeView === ViewType.TaskCreate || state.activeView === ViewType.TaskEdit) && /* @__PURE__ */ jsx16(
         TaskForm,
         {
           editingTask: state.activeView === ViewType.TaskEdit ? state.selectedTask : null,
@@ -2319,7 +2904,16 @@ ${state.selectedTask.additionalRequirements}`;
           onCancel: handleFormCancel
         }
       ),
-      !state.confirmDelete && state.activeView === ViewType.ProjectSelector && /* @__PURE__ */ jsx14(
+      !state.confirmDelete && state.activeView === ViewType.EpicPicker && state.selectedTask && /* @__PURE__ */ jsx16(
+        EpicPicker,
+        {
+          epics: state.epics,
+          currentEpicId: state.selectedTask.parentId,
+          onSelect: handleEpicPickerSelect,
+          onCancel: handleEpicPickerCancel
+        }
+      ),
+      !state.confirmDelete && state.activeView === ViewType.ProjectSelector && /* @__PURE__ */ jsx16(
         ProjectSelector,
         {
           projects: state.projects,
@@ -2330,18 +2924,18 @@ ${state.selectedTask.additionalRequirements}`;
           onCancel: handleProjectCancel
         }
       ),
-      !state.confirmDelete && state.activeView === ViewType.ProjectCreate && /* @__PURE__ */ jsx14(ProjectForm, { onSave: handleProjectFormSave, onCancel: handleProjectFormCancel }),
-      !state.confirmDelete && state.activeView === ViewType.Help && /* @__PURE__ */ jsx14(HelpOverlay, {})
+      !state.confirmDelete && state.activeView === ViewType.ProjectCreate && /* @__PURE__ */ jsx16(ProjectForm, { onSave: handleProjectFormSave, onCancel: handleProjectFormCancel }),
+      !state.confirmDelete && state.activeView === ViewType.Help && /* @__PURE__ */ jsx16(HelpOverlay, {})
     ] }),
-    /* @__PURE__ */ jsx14(Crumbs, { breadcrumbs: state.breadcrumbs }),
-    state.flash && /* @__PURE__ */ jsx14(FlashMessage, { message: state.flash.message, level: state.flash.level })
+    /* @__PURE__ */ jsx16(Crumbs, { breadcrumbs: state.breadcrumbs }),
+    state.flash && /* @__PURE__ */ jsx16(FlashMessage, { message: state.flash.message, level: state.flash.level })
   ] });
 }
 
 // src/tui/index.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 async function launchTUI(container, initialProject) {
-  const instance = render(/* @__PURE__ */ jsx15(App, { container, initialProject }), {
+  const instance = render(/* @__PURE__ */ jsx17(App, { container, initialProject }), {
     exitOnCtrlC: true
   });
   await instance.waitUntilExit();
@@ -2349,4 +2943,4 @@ async function launchTUI(container, initialProject) {
 export {
   launchTUI
 };
-//# sourceMappingURL=tui-JNZRBEIQ.js.map
+//# sourceMappingURL=tui-5JJH67YY.js.map