@kaban-board/tui 0.1.0

package/dist/index.js

@@ -0,0 +1,1958 @@
+#!/usr/bin/env node
+import { createRequire } from "node:module";
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __toESM = (mod, isNodeMode, target) => {
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: () => mod[key],
+        enumerable: true
+      });
+  return to;
+};
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/index.ts
+import { BoardService as BoardService2, createDb as createDb2, TaskService } from "@kaban-board/core";
+import { createCliRenderer } from "@opentui/core";
+
+// src/components/board.ts
+import { BoxRenderable as BoxRenderable2, fg, SelectRenderable, TextRenderable as TextRenderable2, t } from "@opentui/core";
+
+// src/lib/theme.ts
+var LOGO = "\uD83D\uDC17";
+var COLORS = {
+  bg: "#0d1117",
+  panel: "#161b22",
+  border: "#30363d",
+  borderActive: "#58a6ff",
+  text: "#e6edf3",
+  textMuted: "#8b949e",
+  textDim: "#6e7681",
+  accent: "#58a6ff",
+  accentBright: "#79c0ff",
+  danger: "#f85149",
+  success: "#3fb950",
+  warning: "#d29922",
+  overlay: "#00000088",
+  inputBg: "#21262d",
+  cursor: "#79c0ff"
+};
+var STATUS_COLORS = {
+  backlog: COLORS.textDim,
+  todo: COLORS.warning,
+  "in-progress": COLORS.accent,
+  done: COLORS.success
+};
+function getStatusColor(columnId) {
+  return STATUS_COLORS[columnId] ?? COLORS.textMuted;
+}
+
+// src/lib/utils.ts
+import { BoxRenderable, TextRenderable } from "@opentui/core";
+function truncate(str, maxLength) {
+  if (str.length <= maxLength)
+    return str;
+  return `${str.slice(0, maxLength - 1)}…`;
+}
+function truncateMiddle(str, maxLength) {
+  if (str.length <= maxLength)
+    return str;
+  if (maxLength <= 3)
+    return str.slice(0, maxLength);
+  const ellipsis = "...";
+  const charsToShow = maxLength - ellipsis.length;
+  const frontChars = Math.ceil(charsToShow / 2);
+  const backChars = Math.floor(charsToShow / 2);
+  return str.slice(0, frontChars) + ellipsis + str.slice(-backChars);
+}
+function formatRelativeTime(date) {
+  if (!date)
+    return "";
+  const now = new Date;
+  const diffMs = now.getTime() - date.getTime();
+  const diffSec = Math.floor(diffMs / 1000);
+  const diffMin = Math.floor(diffSec / 60);
+  const diffHour = Math.floor(diffMin / 60);
+  const diffDay = Math.floor(diffHour / 24);
+  if (diffSec < 60)
+    return "just now";
+  if (diffMin < 60)
+    return `${diffMin} min ago`;
+  if (diffHour < 24)
+    return `${diffHour}h ago`;
+  if (diffDay < 7)
+    return `${diffDay}d ago`;
+  if (diffDay < 30)
+    return `${Math.floor(diffDay / 7)}w ago`;
+  return `${Math.floor(diffDay / 30)}mo ago`;
+}
+function createSectionDivider(renderer, options) {
+  const { label, width, id } = options;
+  const labelWithPadding = `─ ${label} `;
+  const remainingWidth = width - labelWithPadding.length;
+  const line = "─".repeat(Math.max(0, remainingWidth));
+  const row = new BoxRenderable(renderer, {
+    id: `${id}-divider`,
+    width: "100%",
+    height: 1
+  });
+  const dividerText = new TextRenderable(renderer, {
+    id: `${id}-divider-text`,
+    content: labelWithPadding + line,
+    fg: COLORS.border
+  });
+  row.add(dividerText);
+  return row;
+}
+
+// src/components/board.ts
+async function refreshBoard(state) {
+  const { renderer, taskService, boardService } = state;
+  if (state.mainContainer) {
+    state.mainContainer.destroy();
+  }
+  state.columns = await boardService.getColumns();
+  state.taskSelects = new Map;
+  const tasks = await taskService.listTasks();
+  const mainContainer = new BoxRenderable2(renderer, {
+    id: "main",
+    width: "100%",
+    height: "100%",
+    flexDirection: "column",
+    backgroundColor: COLORS.bg
+  });
+  state.mainContainer = mainContainer;
+  const header = new BoxRenderable2(renderer, {
+    id: "header",
+    width: "100%",
+    height: 3,
+    backgroundColor: COLORS.panel,
+    border: true,
+    borderColor: COLORS.border,
+    justifyContent: "center",
+    alignItems: "center"
+  });
+  const headerText = new TextRenderable2(renderer, {
+    id: "header-text",
+    content: t`${fg(COLORS.warning)(LOGO)} ${fg(COLORS.accent)(state.boardName)}`
+  });
+  header.add(headerText);
+  mainContainer.add(header);
+  const columnsContainer = new BoxRenderable2(renderer, {
+    id: "columns-container",
+    flexDirection: "row",
+    width: "100%",
+    flexGrow: 1,
+    gap: 1,
+    padding: 1
+  });
+  state.columnPanels = [];
+  for (let i = 0;i < state.columns.length; i++) {
+    const column = state.columns[i];
+    const columnTasks = tasks.filter((t2) => t2.columnId === column.id);
+    const isSelected = i === state.currentColumnIndex;
+    const columnPanel = new BoxRenderable2(renderer, {
+      id: `column-${column.id}`,
+      flexGrow: 1,
+      flexDirection: "column",
+      border: true,
+      borderStyle: isSelected ? "double" : "single",
+      borderColor: isSelected ? COLORS.borderActive : COLORS.border,
+      backgroundColor: COLORS.panel,
+      padding: 1
+    });
+    const columnHeader = new BoxRenderable2(renderer, {
+      id: `column-header-${column.id}`,
+      width: "100%",
+      height: 1,
+      justifyContent: "center"
+    });
+    const columnTitle = new TextRenderable2(renderer, {
+      id: `column-title-${column.id}`,
+      content: `${column.name} (${columnTasks.length})`,
+      fg: isSelected ? COLORS.accentBright : COLORS.textMuted
+    });
+    columnHeader.add(columnTitle);
+    columnPanel.add(columnHeader);
+    const taskContainer = new BoxRenderable2(renderer, {
+      id: `task-container-${column.id}`,
+      width: "100%",
+      flexGrow: 1,
+      flexDirection: "column"
+    });
+    if (columnTasks.length > 0) {
+      const taskSelect = new SelectRenderable(renderer, {
+        id: `tasks-${column.id}`,
+        width: "100%",
+        height: "100%",
+        backgroundColor: COLORS.panel,
+        textColor: COLORS.text,
+        options: columnTasks.map((task) => ({
+          name: truncate(task.title, 30),
+          description: task.assignedTo ?? task.createdBy,
+          value: task.id
+        })),
+        selectedBackgroundColor: COLORS.bg,
+        selectedTextColor: COLORS.accent,
+        descriptionColor: COLORS.textMuted
+      });
+      state.taskSelects.set(column.id, taskSelect);
+      if (isSelected) {
+        taskSelect.focus();
+      }
+      taskContainer.add(taskSelect);
+    } else {
+      const emptyText = new TextRenderable2(renderer, {
+        id: `empty-${column.id}`,
+        content: "(empty)",
+        fg: COLORS.textDim
+      });
+      taskContainer.add(emptyText);
+    }
+    columnPanel.add(taskContainer);
+    state.columnPanels.push(columnPanel);
+    columnsContainer.add(columnPanel);
+  }
+  mainContainer.add(columnsContainer);
+  const footer = new BoxRenderable2(renderer, {
+    id: "footer",
+    width: "100%",
+    height: 3,
+    backgroundColor: COLORS.panel,
+    border: true,
+    borderColor: COLORS.border,
+    justifyContent: "center",
+    alignItems: "center"
+  });
+  const footerText = new TextRenderable2(renderer, {
+    id: "footer-text",
+    content: "[a]dd [m]ove [u]ser [d]el  [?]Help [q]uit",
+    fg: COLORS.textMuted
+  });
+  footer.add(footerText);
+  mainContainer.add(footer);
+  renderer.root.add(mainContainer);
+}
+
+// src/components/modals/add-task.ts
+import {
+  BoxRenderable as BoxRenderable5,
+  InputRenderable,
+  InputRenderableEvents,
+  TextRenderable as TextRenderable4
+} from "@opentui/core";
+
+// src/lib/button-row.ts
+import { BoxRenderable as BoxRenderable3, TextRenderable as TextRenderable3 } from "@opentui/core";
+function createButtonRow(renderer, id, buttons) {
+  const container = new BoxRenderable3(renderer, {
+    id: `${id}-button-row`,
+    width: "100%",
+    height: 1,
+    flexDirection: "row",
+    justifyContent: "center",
+    gap: 2
+  });
+  const buttonTexts = [];
+  const state = {
+    container,
+    selectedIndex: 0,
+    focused: false,
+    busy: false,
+    buttons,
+    setFocused: (focused) => {
+      state.focused = focused;
+      state.render();
+    },
+    selectNext: () => {
+      if (!state.focused)
+        return;
+      state.selectedIndex = (state.selectedIndex + 1) % buttons.length;
+      state.render();
+    },
+    selectPrev: () => {
+      if (!state.focused)
+        return;
+      state.selectedIndex = (state.selectedIndex - 1 + buttons.length) % buttons.length;
+      state.render();
+    },
+    triggerSelected: async () => {
+      if (!state.focused)
+        return;
+      if (state.busy)
+        return;
+      state.busy = true;
+      try {
+        await buttons[state.selectedIndex].action();
+      } finally {
+        state.busy = false;
+      }
+    },
+    render: () => {
+      for (let i = 0;i < buttons.length; i++) {
+        const btn = buttons[i];
+        const isSelected = state.focused && i === state.selectedIndex;
+        buttonTexts[i].content = isSelected ? `[${btn.label}]` : ` ${btn.label} `;
+        buttonTexts[i].fg = isSelected ? btn.color ?? COLORS.accentBright : COLORS.textMuted;
+        buttonTexts[i].bg = isSelected ? COLORS.inputBg : undefined;
+      }
+    }
+  };
+  for (let i = 0;i < buttons.length; i++) {
+    const btn = buttons[i];
+    const isSelected = state.focused && i === state.selectedIndex;
+    const text = new TextRenderable3(renderer, {
+      id: `${id}-btn-${i}`,
+      content: isSelected ? `[${btn.label}]` : ` ${btn.label} `,
+      fg: isSelected ? btn.color ?? COLORS.accentBright : COLORS.textMuted,
+      bg: isSelected ? COLORS.inputBg : undefined
+    });
+    buttonTexts.push(text);
+    container.add(text);
+  }
+  return state;
+}
+
+// src/components/overlay.ts
+import { BoxRenderable as BoxRenderable4 } from "@opentui/core";
+function createModalOverlay(renderer, options) {
+  const overlay = new BoxRenderable4(renderer, {
+    id: "modal-overlay",
+    width: "100%",
+    height: "100%",
+    position: "absolute",
+    top: 0,
+    left: 0,
+    backgroundColor: COLORS.overlay,
+    justifyContent: "center",
+    alignItems: "center"
+  });
+  const dialog = new BoxRenderable4(renderer, {
+    id: options.id,
+    width: options.width,
+    height: options.height,
+    flexDirection: "column",
+    border: true,
+    borderStyle: "double",
+    borderColor: options.borderColor ?? COLORS.accent,
+    backgroundColor: COLORS.panel,
+    padding: options.padding ?? 1,
+    justifyContent: options.justifyContent,
+    alignItems: options.alignItems
+  });
+  overlay.add(dialog);
+  return { overlay, dialog };
+}
+
+// src/components/modals/shared.ts
+function closeModal(state) {
+  if (state.viewTaskRuntime?.copyTimeoutId) {
+    clearTimeout(state.viewTaskRuntime.copyTimeoutId);
+  }
+  if (state.modalOverlay) {
+    state.modalOverlay.destroy();
+    state.modalOverlay = null;
+  }
+  state.taskInput = null;
+  state.buttonRow = null;
+  state.selectedTask = null;
+  state.onModalConfirm = null;
+  state.viewTaskState = null;
+  state.editTaskState = null;
+  state.viewTaskRuntime = null;
+  state.editTaskRuntime = null;
+  state.activeModal = "none";
+  refocusCurrentColumnSelect(state);
+}
+function refocusCurrentColumnSelect(state) {
+  const column = state.columns[state.currentColumnIndex];
+  if (!column)
+    return;
+  const select = state.taskSelects.get(column.id);
+  if (select) {
+    select.focus();
+  }
+}
+function blurCurrentColumnSelect(state) {
+  const column = state.columns[state.currentColumnIndex];
+  if (!column)
+    return;
+  const select = state.taskSelects.get(column.id);
+  if (select) {
+    select.blur();
+  }
+}
+
+// src/components/modals/add-task.ts
+function showAddTaskModal(state, onTaskCreated) {
+  const { renderer, columns, currentColumnIndex } = state;
+  const column = columns[currentColumnIndex];
+  if (!column)
+    return;
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "add-task-dialog",
+    width: 52,
+    height: 11
+  });
+  const titleRow = new BoxRenderable5(renderer, {
+    id: "title-row",
+    width: "100%",
+    height: 1
+  });
+  const title = new TextRenderable4(renderer, {
+    id: "dialog-title",
+    content: `Add task to "${column.name}"`,
+    fg: COLORS.accent
+  });
+  titleRow.add(title);
+  const spacer1 = new BoxRenderable5(renderer, { id: "dialog-spacer1", width: "100%", height: 1 });
+  const labelRow = new BoxRenderable5(renderer, {
+    id: "label-row",
+    width: "100%",
+    height: 1
+  });
+  const label = new TextRenderable4(renderer, {
+    id: "dialog-label",
+    content: "Task title:",
+    fg: COLORS.text
+  });
+  labelRow.add(label);
+  const input = new InputRenderable(renderer, {
+    id: "task-title-input",
+    width: 46,
+    height: 1,
+    placeholder: "Enter task title...",
+    textColor: COLORS.text,
+    placeholderColor: COLORS.textDim,
+    backgroundColor: COLORS.inputBg,
+    focusedBackgroundColor: COLORS.inputBg,
+    cursorColor: COLORS.cursor
+  });
+  const spacer2 = new BoxRenderable5(renderer, { id: "dialog-spacer2", width: "100%", height: 1 });
+  const doCreate = async () => {
+    const taskTitle = input.value.trim();
+    if (taskTitle) {
+      await state.taskService.addTask({ title: taskTitle, columnId: column.id });
+    }
+    closeModal(state);
+    await onTaskCreated();
+  };
+  const doCancel = () => {
+    closeModal(state);
+  };
+  const buttonRow = createButtonRow(renderer, "add-task", [
+    { label: "Create", action: doCreate, color: COLORS.success },
+    { label: "Cancel", action: doCancel }
+  ]);
+  dialog.add(titleRow);
+  dialog.add(spacer1);
+  dialog.add(labelRow);
+  dialog.add(input);
+  dialog.add(spacer2);
+  dialog.add(buttonRow.container);
+  renderer.root.add(overlay);
+  setImmediate(() => {
+    buttonRow.setFocused(false);
+    input.focus();
+  });
+  state.modalOverlay = overlay;
+  state.taskInput = input;
+  state.buttonRow = buttonRow;
+  state.activeModal = "addTask";
+  input.on(InputRenderableEvents.ENTER, doCreate);
+}
+// src/components/modals/assign-task.ts
+import {
+  BoxRenderable as BoxRenderable6,
+  InputRenderable as InputRenderable2,
+  InputRenderableEvents as InputRenderableEvents2,
+  TextRenderable as TextRenderable5
+} from "@opentui/core";
+
+// src/lib/types.ts
+function getSelectedTaskId(state) {
+  const column = state.columns[state.currentColumnIndex];
+  if (!column)
+    return null;
+  const select = state.taskSelects.get(column.id);
+  if (!select)
+    return null;
+  const selected = select.getSelectedOption();
+  const value = selected?.value;
+  return typeof value === "string" ? value : null;
+}
+
+// src/components/modals/assign-task.ts
+async function showAssignTaskModal(state, onAssigned) {
+  const { renderer } = state;
+  const taskId = getSelectedTaskId(state);
+  if (!taskId) {
+    return;
+  }
+  const task = await state.taskService.getTask(taskId);
+  if (!task) {
+    return;
+  }
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "assign-task-dialog",
+    width: 45,
+    height: 12
+  });
+  const titleRow = new BoxRenderable6(renderer, {
+    id: "assign-title-row",
+    width: "100%",
+    height: 1
+  });
+  const title = new TextRenderable5(renderer, {
+    id: "assign-title",
+    content: "Assign Task",
+    fg: COLORS.accent
+  });
+  titleRow.add(title);
+  const taskRow = new BoxRenderable6(renderer, {
+    id: "assign-task-row",
+    width: "100%",
+    height: 1
+  });
+  const taskText = new TextRenderable5(renderer, {
+    id: "assign-task-text",
+    content: task.title.slice(0, 40),
+    fg: COLORS.textMuted
+  });
+  taskRow.add(taskText);
+  const spacer1 = new BoxRenderable6(renderer, { id: "assign-spacer1", width: "100%", height: 1 });
+  const labelRow = new BoxRenderable6(renderer, {
+    id: "assign-label-row",
+    width: "100%",
+    height: 1
+  });
+  const currentAssignee = task.assignedTo ?? "(unassigned)";
+  const label = new TextRenderable5(renderer, {
+    id: "assign-label",
+    content: `Current: ${currentAssignee}`,
+    fg: COLORS.text
+  });
+  labelRow.add(label);
+  const input = new InputRenderable2(renderer, {
+    id: "assignee-input",
+    width: 39,
+    height: 1,
+    placeholder: "Enter username (empty to unassign)",
+    textColor: COLORS.text,
+    placeholderColor: COLORS.textDim,
+    backgroundColor: COLORS.inputBg,
+    focusedBackgroundColor: COLORS.inputBg,
+    cursorColor: COLORS.cursor
+  });
+  const spacer2 = new BoxRenderable6(renderer, { id: "assign-spacer2", width: "100%", height: 1 });
+  const doAssign = async () => {
+    const assignee = input.value.trim();
+    await state.taskService.updateTask(taskId, {
+      assignedTo: assignee || null
+    });
+    closeModal(state);
+    await onAssigned();
+  };
+  const doCancel = () => {
+    closeModal(state);
+  };
+  const buttonRow = createButtonRow(renderer, "assign-task", [
+    { label: "Assign", action: doAssign, color: COLORS.success },
+    { label: "Cancel", action: doCancel }
+  ]);
+  dialog.add(titleRow);
+  dialog.add(taskRow);
+  dialog.add(spacer1);
+  dialog.add(labelRow);
+  dialog.add(input);
+  dialog.add(spacer2);
+  dialog.add(buttonRow.container);
+  renderer.root.add(overlay);
+  setImmediate(() => {
+    buttonRow.setFocused(false);
+    input.focus();
+  });
+  state.modalOverlay = overlay;
+  state.taskInput = input;
+  state.buttonRow = buttonRow;
+  state.activeModal = "assignTask";
+  input.on(InputRenderableEvents2.ENTER, doAssign);
+}
+// src/components/modals/delete-task.ts
+import { BoxRenderable as BoxRenderable7, TextRenderable as TextRenderable6 } from "@opentui/core";
+async function showDeleteTaskModal(state, onDeleted) {
+  const { renderer } = state;
+  const taskId = getSelectedTaskId(state);
+  if (!taskId) {
+    return;
+  }
+  const task = await state.taskService.getTask(taskId);
+  if (!task) {
+    return;
+  }
+  state.selectedTask = task;
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "delete-task-dialog",
+    width: 45,
+    height: 10,
+    borderColor: COLORS.danger
+  });
+  const titleRow = new BoxRenderable7(renderer, {
+    id: "delete-title-row",
+    width: "100%",
+    height: 1,
+    justifyContent: "center"
+  });
+  const title = new TextRenderable6(renderer, {
+    id: "delete-title",
+    content: "Delete Task?",
+    fg: COLORS.danger
+  });
+  titleRow.add(title);
+  const spacer1 = new BoxRenderable7(renderer, { id: "delete-spacer1", width: "100%", height: 1 });
+  const taskRow = new BoxRenderable7(renderer, {
+    id: "delete-task-row",
+    width: "100%",
+    height: 1
+  });
+  const taskText = new TextRenderable6(renderer, {
+    id: "delete-task-text",
+    content: task.title.slice(0, 40),
+    fg: COLORS.text
+  });
+  taskRow.add(taskText);
+  const warningRow = new BoxRenderable7(renderer, {
+    id: "delete-warning-row",
+    width: "100%",
+    height: 1
+  });
+  const warning = new TextRenderable6(renderer, {
+    id: "delete-warning",
+    content: "This action cannot be undone.",
+    fg: COLORS.warning
+  });
+  warningRow.add(warning);
+  const spacer2 = new BoxRenderable7(renderer, { id: "delete-spacer2", width: "100%", height: 2 });
+  const hintRow = new BoxRenderable7(renderer, {
+    id: "delete-hint-row",
+    width: "100%",
+    height: 1,
+    justifyContent: "center"
+  });
+  const hint = new TextRenderable6(renderer, {
+    id: "delete-hint",
+    content: "[y] Delete  [n/Esc] Cancel",
+    fg: COLORS.textMuted
+  });
+  hintRow.add(hint);
+  dialog.add(titleRow);
+  dialog.add(spacer1);
+  dialog.add(taskRow);
+  dialog.add(warningRow);
+  dialog.add(spacer2);
+  dialog.add(hintRow);
+  renderer.root.add(overlay);
+  state.modalOverlay = overlay;
+  state.activeModal = "deleteTask";
+  state.onModalConfirm = async () => {
+    await state.taskService.deleteTask(taskId);
+    closeModal(state);
+    await onDeleted();
+  };
+}
+// src/components/modals/edit-task.ts
+import {
+  BoxRenderable as BoxRenderable8,
+  InputRenderable as InputRenderable3,
+  InputRenderableEvents as InputRenderableEvents3,
+  TextRenderable as TextRenderable7
+} from "@opentui/core";
+var DIALOG_WIDTH = 60;
+var DESC_INPUT_HEIGHT = 6;
+async function showEditTaskModal(state, callbacks) {
+  const { renderer } = state;
+  const task = state.selectedTask;
+  if (!task) {
+    return;
+  }
+  state.editTaskState = {
+    title: task.title,
+    description: task.description ?? "",
+    focusedField: "title"
+  };
+  const dialogHeight = 18;
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "edit-task-dialog",
+    width: DIALOG_WIDTH,
+    height: dialogHeight
+  });
+  const headerRow = new BoxRenderable8(renderer, {
+    id: "edit-header-row",
+    width: "100%",
+    height: 1
+  });
+  const headerText = new TextRenderable7(renderer, {
+    id: "edit-header-text",
+    content: `Edit Task: ${truncate(task.title, DIALOG_WIDTH - 20)}`,
+    fg: COLORS.accent
+  });
+  headerRow.add(headerText);
+  const spacer1 = new BoxRenderable8(renderer, {
+    id: "edit-spacer1",
+    width: "100%",
+    height: 1
+  });
+  const titleLabelRow = new BoxRenderable8(renderer, {
+    id: "edit-title-label-row",
+    width: "100%",
+    height: 1
+  });
+  const titleLabel = new TextRenderable7(renderer, {
+    id: "edit-title-label",
+    content: "Title",
+    fg: COLORS.textMuted
+  });
+  titleLabelRow.add(titleLabel);
+  const titleInput = new InputRenderable3(renderer, {
+    id: "edit-title-input",
+    width: DIALOG_WIDTH - 6,
+    height: 1,
+    placeholder: "Task title...",
+    textColor: COLORS.text,
+    placeholderColor: COLORS.textDim,
+    backgroundColor: COLORS.inputBg,
+    focusedBackgroundColor: COLORS.inputBg,
+    cursorColor: COLORS.cursor
+  });
+  titleInput.value = task.title;
+  const spacer2 = new BoxRenderable8(renderer, {
+    id: "edit-spacer2",
+    width: "100%",
+    height: 1
+  });
+  const descLabelRow = new BoxRenderable8(renderer, {
+    id: "edit-desc-label-row",
+    width: "100%",
+    height: 1
+  });
+  const descLabel = new TextRenderable7(renderer, {
+    id: "edit-desc-label",
+    content: "Description",
+    fg: COLORS.textMuted
+  });
+  descLabelRow.add(descLabel);
+  const descInput = new InputRenderable3(renderer, {
+    id: "edit-desc-input",
+    width: DIALOG_WIDTH - 6,
+    height: DESC_INPUT_HEIGHT,
+    placeholder: "Task description (optional)...",
+    textColor: COLORS.text,
+    placeholderColor: COLORS.textDim,
+    backgroundColor: COLORS.inputBg,
+    focusedBackgroundColor: COLORS.inputBg,
+    cursorColor: COLORS.cursor
+  });
+  descInput.value = task.description ?? "";
+  const spacer3 = new BoxRenderable8(renderer, {
+    id: "edit-spacer3",
+    width: "100%",
+    height: 1
+  });
+  const doSave = async () => {
+    const newTitle = titleInput.value.trim();
+    const newDescription = descInput.value.trim();
+    if (!newTitle) {
+      return;
+    }
+    const hasChanges = newTitle !== task.title || newDescription !== (task.description ?? "");
+    if (hasChanges) {
+      await state.taskService.updateTask(task.id, {
+        title: newTitle,
+        description: newDescription || undefined
+      });
+    }
+    closeModal(state);
+    state.editTaskState = null;
+    await callbacks.onSave();
+  };
+  const doCancel = () => {
+    closeModal(state);
+    state.editTaskState = null;
+    callbacks.onCancel();
+  };
+  const buttonRow = createButtonRow(renderer, "edit-task", [
+    { label: "Save", action: doSave, color: COLORS.success },
+    { label: "Cancel", action: doCancel }
+  ]);
+  const hintRow = new BoxRenderable8(renderer, {
+    id: "edit-hint-row",
+    width: "100%",
+    height: 1,
+    justifyContent: "center"
+  });
+  const hint = new TextRenderable7(renderer, {
+    id: "edit-hint",
+    content: "[Tab] Next    [Enter] Save    [Esc] Cancel",
+    fg: COLORS.textDim
+  });
+  hintRow.add(hint);
+  dialog.add(headerRow);
+  dialog.add(spacer1);
+  dialog.add(titleLabelRow);
+  dialog.add(titleInput);
+  dialog.add(spacer2);
+  dialog.add(descLabelRow);
+  dialog.add(descInput);
+  dialog.add(spacer3);
+  dialog.add(buttonRow.container);
+  dialog.add(hintRow);
+  renderer.root.add(overlay);
+  setImmediate(() => {
+    buttonRow.setFocused(false);
+    titleInput.focus();
+  });
+  state.modalOverlay = overlay;
+  state.taskInput = titleInput;
+  state.buttonRow = buttonRow;
+  state.activeModal = "editTask";
+  titleInput.on(InputRenderableEvents3.ENTER, doSave);
+  state.editTaskRuntime = {
+    titleInput,
+    descInput,
+    doSave,
+    doCancel
+  };
+}
+function focusNextEditField(state) {
+  if (!state.editTaskRuntime || !state.editTaskState)
+    return;
+  const { titleInput, descInput } = state.editTaskRuntime;
+  const { buttonRow } = state;
+  switch (state.editTaskState.focusedField) {
+    case "title":
+      titleInput.blur();
+      descInput.focus();
+      buttonRow?.setFocused(false);
+      state.editTaskState.focusedField = "description";
+      break;
+    case "description":
+      descInput.blur();
+      titleInput.blur();
+      buttonRow?.setFocused(true);
+      state.editTaskState.focusedField = "buttons";
+      break;
+    case "buttons":
+      buttonRow?.setFocused(false);
+      titleInput.focus();
+      state.editTaskState.focusedField = "title";
+      break;
+  }
+}
+function cancelEditTask(state) {
+  if (!state.editTaskRuntime)
+    return;
+  state.editTaskRuntime.doCancel();
+}
+// src/components/modals/help.ts
+import { BoxRenderable as BoxRenderable9, TextRenderable as TextRenderable8 } from "@opentui/core";
+var SHORTCUTS = [
+  ["<-/-> h/l", "Switch column"],
+  ["up/dn j/k", "Navigate tasks"],
+  ["Enter", "View task details"],
+  ["a", "Add new task"],
+  ["m", "Move task (change status)"],
+  ["u", "Assign user to task"],
+  ["d", "Delete task"],
+  ["?", "Show/hide help"],
+  ["q", "Quit"]
+];
+function showHelpModal(state) {
+  const { renderer } = state;
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "help-dialog",
+    width: 45,
+    height: 17,
+    padding: 2
+  });
+  const titleRow = new BoxRenderable9(renderer, {
+    id: "help-title-row",
+    width: "100%",
+    height: 1
+  });
+  const title = new TextRenderable8(renderer, {
+    id: "help-title",
+    content: "Keyboard Shortcuts",
+    fg: COLORS.accent
+  });
+  titleRow.add(title);
+  const spacer = new BoxRenderable9(renderer, { id: "help-spacer", width: "100%", height: 1 });
+  dialog.add(titleRow);
+  dialog.add(spacer);
+  for (const [key, desc] of SHORTCUTS) {
+    const row = new BoxRenderable9(renderer, {
+      id: `help-row-${key}`,
+      width: "100%",
+      height: 1,
+      flexDirection: "row"
+    });
+    const keyText = new TextRenderable8(renderer, {
+      id: `help-key-${key}`,
+      content: key.padEnd(12),
+      fg: COLORS.accentBright
+    });
+    const descText = new TextRenderable8(renderer, {
+      id: `help-desc-${key}`,
+      content: desc,
+      fg: COLORS.text
+    });
+    row.add(keyText);
+    row.add(descText);
+    dialog.add(row);
+  }
+  const hintSpacer = new BoxRenderable9(renderer, {
+    id: "help-hint-spacer",
+    width: "100%",
+    height: 1
+  });
+  const hintRow = new BoxRenderable9(renderer, {
+    id: "help-hint-row",
+    width: "100%",
+    height: 1
+  });
+  const hint = new TextRenderable8(renderer, {
+    id: "help-hint",
+    content: "[Esc] or any key to close",
+    fg: COLORS.textDim
+  });
+  hintRow.add(hint);
+  dialog.add(hintSpacer);
+  dialog.add(hintRow);
+  renderer.root.add(overlay);
+  state.modalOverlay = overlay;
+  state.activeModal = "help";
+}
+// src/components/modals/move-task.ts
+import {
+  BoxRenderable as BoxRenderable10,
+  SelectRenderable as SelectRenderable2,
+  SelectRenderableEvents,
+  TextRenderable as TextRenderable9
+} from "@opentui/core";
+async function showMoveTaskModal(state, onMoved) {
+  const { renderer, columns } = state;
+  const taskId = getSelectedTaskId(state);
+  if (!taskId) {
+    return;
+  }
+  const task = await state.taskService.getTask(taskId);
+  if (!task) {
+    return;
+  }
+  const otherColumns = columns.filter((c) => c.id !== task.columnId);
+  if (otherColumns.length === 0) {
+    return;
+  }
+  const selectHeight = Math.min(otherColumns.length, 6);
+  const dialogHeight = selectHeight + 10;
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "move-task-dialog",
+    width: 40,
+    height: dialogHeight
+  });
+  const titleRow = new BoxRenderable10(renderer, {
+    id: "move-title-row",
+    width: "100%",
+    height: 1
+  });
+  const title = new TextRenderable9(renderer, {
+    id: "move-title",
+    content: "Move Task",
+    fg: COLORS.accent
+  });
+  titleRow.add(title);
+  const taskRow = new BoxRenderable10(renderer, {
+    id: "move-task-row",
+    width: "100%",
+    height: 1
+  });
+  const taskText = new TextRenderable9(renderer, {
+    id: "move-task-text",
+    content: task.title.slice(0, 35),
+    fg: COLORS.textMuted
+  });
+  taskRow.add(taskText);
+  const spacer1 = new BoxRenderable10(renderer, { id: "move-spacer1", width: "100%", height: 1 });
+  const labelRow = new BoxRenderable10(renderer, {
+    id: "move-label-row",
+    width: "100%",
+    height: 1
+  });
+  const label = new TextRenderable9(renderer, {
+    id: "move-label",
+    content: "Select column:",
+    fg: COLORS.text
+  });
+  labelRow.add(label);
+  const columnSelect = new SelectRenderable2(renderer, {
+    id: "column-select",
+    width: "100%",
+    height: selectHeight,
+    backgroundColor: COLORS.panel,
+    textColor: COLORS.text,
+    showDescription: false,
+    options: otherColumns.map((col) => ({
+      name: col.name,
+      description: "",
+      value: col.id
+    })),
+    selectedBackgroundColor: COLORS.inputBg,
+    selectedTextColor: COLORS.accentBright
+  });
+  const spacer2 = new BoxRenderable10(renderer, { id: "move-spacer2", width: "100%", height: 1 });
+  const hintRow = new BoxRenderable10(renderer, {
+    id: "move-hint-row",
+    width: "100%",
+    height: 1
+  });
+  const hint = new TextRenderable9(renderer, {
+    id: "move-hint",
+    content: "[Enter] Move  [Esc] Cancel",
+    fg: COLORS.textDim
+  });
+  hintRow.add(hint);
+  dialog.add(titleRow);
+  dialog.add(taskRow);
+  dialog.add(spacer1);
+  dialog.add(labelRow);
+  dialog.add(columnSelect);
+  dialog.add(spacer2);
+  dialog.add(hintRow);
+  renderer.root.add(overlay);
+  setImmediate(() => columnSelect.focus());
+  state.modalOverlay = overlay;
+  state.activeModal = "moveTask";
+  columnSelect.on(SelectRenderableEvents.ITEM_SELECTED, async () => {
+    const selected = columnSelect.getSelectedOption();
+    if (selected?.value) {
+      await state.taskService.moveTask(taskId, selected.value);
+    }
+    closeModal(state);
+    await onMoved();
+  });
+}
+// src/components/modals/onboarding.ts
+import {
+  BoxRenderable as BoxRenderable11,
+  InputRenderable as InputRenderable4,
+  InputRenderableEvents as InputRenderableEvents4,
+  TextRenderable as TextRenderable10
+} from "@opentui/core";
+async function showOnboarding(renderer) {
+  return new Promise((resolvePromise) => {
+    const container = new BoxRenderable11(renderer, {
+      id: "onboarding",
+      width: "100%",
+      height: "100%",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      backgroundColor: COLORS.bg
+    });
+    const card = new BoxRenderable11(renderer, {
+      id: "card",
+      width: 52,
+      height: 13,
+      flexDirection: "column",
+      border: true,
+      borderStyle: "rounded",
+      borderColor: COLORS.accent,
+      backgroundColor: COLORS.panel,
+      paddingTop: 1,
+      paddingBottom: 1,
+      paddingLeft: 2,
+      paddingRight: 2
+    });
+    const titleRow = new BoxRenderable11(renderer, {
+      id: "title-row",
+      width: "100%",
+      height: 1
+    });
+    const title = new TextRenderable10(renderer, {
+      id: "title",
+      content: "Welcome to Kaban",
+      fg: COLORS.accent
+    });
+    titleRow.add(title);
+    const subtitleRow = new BoxRenderable11(renderer, {
+      id: "subtitle-row",
+      width: "100%",
+      height: 1
+    });
+    const subtitle = new TextRenderable10(renderer, {
+      id: "subtitle",
+      content: "No board found. Let's create one!",
+      fg: COLORS.textMuted
+    });
+    subtitleRow.add(subtitle);
+    const spacer1 = new BoxRenderable11(renderer, { id: "spacer1", width: "100%", height: 1 });
+    const labelRow = new BoxRenderable11(renderer, {
+      id: "label-row",
+      width: "100%",
+      height: 1
+    });
+    const label = new TextRenderable10(renderer, {
+      id: "label",
+      content: "Board name:",
+      fg: COLORS.text
+    });
+    labelRow.add(label);
+    const input = new InputRenderable4(renderer, {
+      id: "board-name-input",
+      width: 44,
+      height: 1,
+      placeholder: "My Project Board",
+      textColor: COLORS.text,
+      placeholderColor: COLORS.textDim,
+      backgroundColor: COLORS.inputBg,
+      focusedBackgroundColor: COLORS.inputBg,
+      cursorColor: COLORS.cursor
+    });
+    const spacer2 = new BoxRenderable11(renderer, { id: "spacer2", width: "100%", height: 1 });
+    const doCreate = () => {
+      renderer.keyInput.off("keypress", keyHandler);
+      const boardName = input.value.trim() || "Kaban Board";
+      container.destroy();
+      resolvePromise(boardName);
+    };
+    const doQuit = () => {
+      renderer.keyInput.off("keypress", keyHandler);
+      renderer.destroy();
+      process.exit(0);
+    };
+    const buttonRow = createButtonRow(renderer, "onboarding", [
+      { label: "Create", action: doCreate, color: COLORS.success },
+      { label: "Quit", action: doQuit, color: COLORS.danger }
+    ]);
+    card.add(titleRow);
+    card.add(subtitleRow);
+    card.add(spacer1);
+    card.add(labelRow);
+    card.add(input);
+    card.add(spacer2);
+    card.add(buttonRow.container);
+    container.add(card);
+    renderer.root.add(container);
+    input.focus();
+    input.on(InputRenderableEvents4.ENTER, doCreate);
+    const keyBindings = {
+      tab: () => {
+        input.blur();
+        buttonRow.setFocused(true);
+      },
+      down: () => {
+        input.blur();
+        buttonRow.setFocused(true);
+      },
+      up: () => {
+        buttonRow.setFocused(false);
+        input.focus();
+      },
+      left: () => buttonRow.selectPrev(),
+      right: () => buttonRow.selectNext(),
+      return: () => {
+        if (!input.focused)
+          buttonRow.triggerSelected();
+      },
+      escape: doQuit
+    };
+    const keyHandler = (key) => {
+      keyBindings[key.name]?.();
+    };
+    renderer.keyInput.on("keypress", keyHandler);
+  });
+}
+// src/components/modals/quit.ts
+import { BoxRenderable as BoxRenderable12, TextRenderable as TextRenderable11 } from "@opentui/core";
+function showQuitModal(state) {
+  const { renderer } = state;
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "quit-dialog",
+    width: 32,
+    height: 8,
+    borderColor: COLORS.danger
+  });
+  const titleRow = new BoxRenderable12(renderer, {
+    id: "quit-title-row",
+    width: "100%",
+    height: 1,
+    justifyContent: "center"
+  });
+  const title = new TextRenderable11(renderer, {
+    id: "quit-title",
+    content: "Quit Kaban?",
+    fg: COLORS.danger
+  });
+  titleRow.add(title);
+  const spacer = new BoxRenderable12(renderer, { id: "quit-spacer", width: "100%", height: 2 });
+  const hintRow = new BoxRenderable12(renderer, {
+    id: "quit-hint-row",
+    width: "100%",
+    height: 1,
+    justifyContent: "center"
+  });
+  const hint = new TextRenderable11(renderer, {
+    id: "quit-hint",
+    content: "[y] Yes  [n/Esc] No",
+    fg: COLORS.textMuted
+  });
+  hintRow.add(hint);
+  dialog.add(titleRow);
+  dialog.add(spacer);
+  dialog.add(hintRow);
+  renderer.root.add(overlay);
+  state.modalOverlay = overlay;
+  state.activeModal = "quit";
+}
+// src/components/modals/view-task.ts
+import { BoxRenderable as BoxRenderable13, TextRenderable as TextRenderable12 } from "@opentui/core";
+var DIALOG_WIDTH2 = 60;
+var DESC_VISIBLE_LINES = 4;
+var LABEL_WIDTH = 12;
+function formatDate(date) {
+  if (!date)
+    return "—";
+  return date.toLocaleString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function padLabel(label) {
+  return label.padEnd(LABEL_WIDTH);
+}
+async function showViewTaskModal(state, actions, taskIdOverride) {
+  const { renderer, columns } = state;
+  const taskId = taskIdOverride ?? getSelectedTaskId(state);
+  if (!taskId) {
+    return;
+  }
+  const task = await state.taskService.getTask(taskId);
+  if (!task) {
+    return;
+  }
+  blurCurrentColumnSelect(state);
+  const column = columns.find((c) => c.id === task.columnId);
+  const columnName = column?.name ?? task.columnId;
+  const statusColor = getStatusColor(task.columnId);
+  const hasDescription = task.description && task.description.trim().length > 0;
+  const allDescLines = hasDescription ? task.description?.split(`
+`) ?? [] : [];
+  const totalDescLines = allDescLines.length;
+  state.viewTaskState = {
+    descriptionScrollOffset: 0,
+    showCopiedFeedback: false
+  };
+  const dialogHeight = 24;
+  const { overlay, dialog } = createModalOverlay(renderer, {
+    id: "view-task-dialog",
+    width: DIALOG_WIDTH2,
+    height: dialogHeight
+  });
+  const headerDivider = createSectionDivider(renderer, {
+    label: "Task Details",
+    width: DIALOG_WIDTH2 - 4,
+    id: "view-header"
+  });
+  const spacerHeader = new BoxRenderable13(renderer, {
+    id: "view-spacer-header",
+    width: "100%",
+    height: 1
+  });
+  const titleRow = new BoxRenderable13(renderer, {
+    id: "view-title-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row",
+    justifyContent: "space-between"
+  });
+  const taskTitle = new TextRenderable12(renderer, {
+    id: "view-task-title",
+    content: truncate(task.title, DIALOG_WIDTH2 - 14),
+    fg: COLORS.text
+  });
+  const editHint = new TextRenderable12(renderer, {
+    id: "view-edit-hint",
+    content: "[e]dit",
+    fg: COLORS.textDim
+  });
+  titleRow.add(taskTitle);
+  titleRow.add(editHint);
+  const idRow = new BoxRenderable13(renderer, {
+    id: "view-id-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row",
+    justifyContent: "space-between"
+  });
+  const idValue = new TextRenderable12(renderer, {
+    id: "view-id-value",
+    content: truncateMiddle(task.id, DIALOG_WIDTH2 - 14),
+    fg: COLORS.textDim
+  });
+  const copyHint = new TextRenderable12(renderer, {
+    id: "view-copy-hint",
+    content: "[c]opy",
+    fg: COLORS.textDim
+  });
+  idRow.add(idValue);
+  idRow.add(copyHint);
+  const statusDivider = createSectionDivider(renderer, {
+    label: "Status",
+    width: DIALOG_WIDTH2 - 4,
+    id: "view-status"
+  });
+  const columnRow = new BoxRenderable13(renderer, {
+    id: "view-column-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row"
+  });
+  const columnLabel = new TextRenderable12(renderer, {
+    id: "view-column-label",
+    content: padLabel("Column"),
+    fg: COLORS.textMuted
+  });
+  const columnBullet = new TextRenderable12(renderer, {
+    id: "view-column-bullet",
+    content: "● ",
+    fg: statusColor
+  });
+  const columnValue = new TextRenderable12(renderer, {
+    id: "view-column-value",
+    content: columnName,
+    fg: COLORS.text
+  });
+  columnRow.add(columnLabel);
+  columnRow.add(columnBullet);
+  columnRow.add(columnValue);
+  const assigneeRow = new BoxRenderable13(renderer, {
+    id: "view-assignee-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row"
+  });
+  const assigneeLabel = new TextRenderable12(renderer, {
+    id: "view-assignee-label",
+    content: padLabel("Assignee"),
+    fg: COLORS.textMuted
+  });
+  const assigneeValue = new TextRenderable12(renderer, {
+    id: "view-assignee-value",
+    content: task.assignedTo ?? "— unassigned",
+    fg: task.assignedTo ? COLORS.success : COLORS.textDim
+  });
+  assigneeRow.add(assigneeLabel);
+  assigneeRow.add(assigneeValue);
+  const creatorRow = new BoxRenderable13(renderer, {
+    id: "view-creator-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row"
+  });
+  const creatorLabel = new TextRenderable12(renderer, {
+    id: "view-creator-label",
+    content: padLabel("Creator"),
+    fg: COLORS.textMuted
+  });
+  const creatorValue = new TextRenderable12(renderer, {
+    id: "view-creator-value",
+    content: task.createdBy,
+    fg: COLORS.text
+  });
+  creatorRow.add(creatorLabel);
+  creatorRow.add(creatorValue);
+  const labelsRow = new BoxRenderable13(renderer, {
+    id: "view-labels-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row"
+  });
+  const labelsLabel = new TextRenderable12(renderer, {
+    id: "view-labels-label",
+    content: padLabel("Labels"),
+    fg: COLORS.textMuted
+  });
+  const labelsValue = new TextRenderable12(renderer, {
+    id: "view-labels-value",
+    content: "— none",
+    fg: COLORS.textDim
+  });
+  labelsRow.add(labelsLabel);
+  labelsRow.add(labelsValue);
+  const timelineDivider = createSectionDivider(renderer, {
+    label: "Timeline",
+    width: DIALOG_WIDTH2 - 4,
+    id: "view-timeline"
+  });
+  const createdRow = new BoxRenderable13(renderer, {
+    id: "view-created-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row"
+  });
+  const createdLabel = new TextRenderable12(renderer, {
+    id: "view-created-label",
+    content: padLabel("Created"),
+    fg: COLORS.textMuted
+  });
+  const createdValue = new TextRenderable12(renderer, {
+    id: "view-created-value",
+    content: formatDate(task.createdAt),
+    fg: COLORS.textDim
+  });
+  createdRow.add(createdLabel);
+  createdRow.add(createdValue);
+  const updatedRow = new BoxRenderable13(renderer, {
+    id: "view-updated-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row",
+    justifyContent: "space-between"
+  });
+  const updatedLeft = new BoxRenderable13(renderer, {
+    id: "view-updated-left",
+    height: 1,
+    flexDirection: "row"
+  });
+  const updatedLabel = new TextRenderable12(renderer, {
+    id: "view-updated-label",
+    content: padLabel("Updated"),
+    fg: COLORS.textMuted
+  });
+  const updatedValue = new TextRenderable12(renderer, {
+    id: "view-updated-value",
+    content: formatDate(task.updatedAt),
+    fg: COLORS.textDim
+  });
+  updatedLeft.add(updatedLabel);
+  updatedLeft.add(updatedValue);
+  const relativeTime = new TextRenderable12(renderer, {
+    id: "view-relative-time",
+    content: `(${formatRelativeTime(task.updatedAt)})`,
+    fg: COLORS.textDim
+  });
+  updatedRow.add(updatedLeft);
+  updatedRow.add(relativeTime);
+  const descDivider = createSectionDivider(renderer, {
+    label: "Description",
+    width: DIALOG_WIDTH2 - 4,
+    id: "view-desc"
+  });
+  const descContainer = new BoxRenderable13(renderer, {
+    id: "view-desc-container",
+    width: "100%",
+    height: DESC_VISIBLE_LINES,
+    flexDirection: "column"
+  });
+  const descLineRenderables = [];
+  for (let i = 0;i < DESC_VISIBLE_LINES; i++) {
+    const line = new TextRenderable12(renderer, {
+      id: `view-desc-line-${i}`,
+      content: " ",
+      fg: COLORS.text
+    });
+    descLineRenderables.push(line);
+    descContainer.add(line);
+  }
+  function updateDescriptionContent(scrollOffset) {
+    if (!hasDescription) {
+      descLineRenderables[0].content = "— no description";
+      descLineRenderables[0].fg = COLORS.textDim;
+      for (let i = 1;i < DESC_VISIBLE_LINES; i++) {
+        descLineRenderables[i].content = " ";
+      }
+      return;
+    }
+    const visibleLines = allDescLines.slice(scrollOffset, scrollOffset + DESC_VISIBLE_LINES);
+    const hasMore = scrollOffset + DESC_VISIBLE_LINES < totalDescLines;
+    const hasLess = scrollOffset > 0;
+    for (let i = 0;i < DESC_VISIBLE_LINES; i++) {
+      const lineContent = visibleLines[i] ?? "";
+      const isLastLine = i === DESC_VISIBLE_LINES - 1;
+      let displayContent = truncate(lineContent, DIALOG_WIDTH2 - 12);
+      if (isLastLine && hasMore) {
+        const remaining = totalDescLines - scrollOffset - DESC_VISIBLE_LINES;
+        displayContent = `${truncate(lineContent, DIALOG_WIDTH2 - 18)} ▼ ${remaining}+`;
+      }
+      if (i === 0 && hasLess) {
+        displayContent = `▲ ${scrollOffset}+ ${truncate(lineContent, DIALOG_WIDTH2 - 18)}`;
+      }
+      descLineRenderables[i].content = displayContent || " ";
+      descLineRenderables[i].fg = i === 0 && hasLess || isLastLine && hasMore ? COLORS.textDim : COLORS.text;
+    }
+  }
+  updateDescriptionContent(0);
+  const footerDivider = new BoxRenderable13(renderer, {
+    id: "view-footer-divider",
+    width: "100%",
+    height: 1
+  });
+  const footerLine = new TextRenderable12(renderer, {
+    id: "view-footer-line",
+    content: "─".repeat(DIALOG_WIDTH2 - 4),
+    fg: COLORS.border
+  });
+  footerDivider.add(footerLine);
+  const actionsRow = new BoxRenderable13(renderer, {
+    id: "view-actions-row",
+    width: "100%",
+    height: 1,
+    flexDirection: "row",
+    justifyContent: "space-between"
+  });
+  const actionsLeft = new BoxRenderable13(renderer, {
+    id: "view-actions-left",
+    height: 1,
+    flexDirection: "row",
+    gap: 2
+  });
+  const moveAction = new TextRenderable12(renderer, {
+    id: "view-action-move",
+    content: "[m] Move",
+    fg: COLORS.textMuted
+  });
+  const assignAction = new TextRenderable12(renderer, {
+    id: "view-action-assign",
+    content: "[u] Assign",
+    fg: COLORS.textMuted
+  });
+  const editAction = new TextRenderable12(renderer, {
+    id: "view-action-edit",
+    content: "[e] Edit",
+    fg: COLORS.textMuted
+  });
+  const deleteAction = new TextRenderable12(renderer, {
+    id: "view-action-delete",
+    content: "[d] Delete",
+    fg: COLORS.danger
+  });
+  actionsLeft.add(moveAction);
+  actionsLeft.add(assignAction);
+  actionsLeft.add(editAction);
+  actionsLeft.add(deleteAction);
+  const escAction = new TextRenderable12(renderer, {
+    id: "view-action-esc",
+    content: "[Esc]",
+    fg: COLORS.textDim
+  });
+  actionsRow.add(actionsLeft);
+  actionsRow.add(escAction);
+  dialog.add(headerDivider);
+  dialog.add(spacerHeader);
+  dialog.add(titleRow);
+  dialog.add(idRow);
+  dialog.add(statusDivider);
+  dialog.add(columnRow);
+  dialog.add(assigneeRow);
+  dialog.add(creatorRow);
+  dialog.add(labelsRow);
+  dialog.add(timelineDivider);
+  dialog.add(createdRow);
+  dialog.add(updatedRow);
+  dialog.add(descDivider);
+  dialog.add(descContainer);
+  dialog.add(footerDivider);
+  dialog.add(actionsRow);
+  renderer.root.add(overlay);
+  state.modalOverlay = overlay;
+  state.activeModal = "viewTask";
+  state.selectedTask = task;
+  state.viewTaskRuntime = {
+    updateDescriptionContent,
+    totalDescLines,
+    actions,
+    idValue,
+    copyHint,
+    taskId: task.id,
+    copyTimeoutId: null
+  };
+}
+function scrollViewTaskDescription(state, direction) {
+  if (!state.viewTaskState || !state.viewTaskRuntime)
+    return;
+  const { totalDescLines, updateDescriptionContent } = state.viewTaskRuntime;
+  const maxOffset = Math.max(0, totalDescLines - DESC_VISIBLE_LINES);
+  if (direction === "down") {
+    state.viewTaskState.descriptionScrollOffset = Math.min(state.viewTaskState.descriptionScrollOffset + 1, maxOffset);
+  } else {
+    state.viewTaskState.descriptionScrollOffset = Math.max(state.viewTaskState.descriptionScrollOffset - 1, 0);
+  }
+  updateDescriptionContent(state.viewTaskState.descriptionScrollOffset);
+}
+async function copyTaskId(state) {
+  if (!state.viewTaskState || !state.viewTaskRuntime)
+    return;
+  const { taskId, idValue, copyHint } = state.viewTaskRuntime;
+  if (state.viewTaskRuntime.copyTimeoutId) {
+    clearTimeout(state.viewTaskRuntime.copyTimeoutId);
+    state.viewTaskRuntime.copyTimeoutId = null;
+  }
+  try {
+    const { exec } = await import("node:child_process");
+    const { promisify } = await import("node:util");
+    const execAsync = promisify(exec);
+    if (process.platform === "darwin") {
+      await execAsync(`echo -n "${taskId}" | pbcopy`);
+    } else if (process.platform === "linux") {
+      await execAsync(`echo -n "${taskId}" | xclip -selection clipboard`);
+    }
+    const originalContent = idValue.content.toString();
+    idValue.content = "Copied!";
+    idValue.fg = COLORS.success;
+    copyHint.content = "✓";
+    copyHint.fg = COLORS.success;
+    state.viewTaskRuntime.copyTimeoutId = setTimeout(() => {
+      if (state.viewTaskRuntime) {
+        idValue.content = originalContent;
+        idValue.fg = COLORS.textDim;
+        copyHint.content = "[c]opy";
+        copyHint.fg = COLORS.textDim;
+        state.viewTaskRuntime.copyTimeoutId = null;
+      }
+    }, 1000);
+  } catch {
+    idValue.content = "Failed!";
+    idValue.fg = COLORS.danger;
+    copyHint.content = "✗";
+    copyHint.fg = COLORS.danger;
+    state.viewTaskRuntime.copyTimeoutId = setTimeout(() => {
+      if (state.viewTaskRuntime) {
+        idValue.content = truncateMiddle(taskId, DIALOG_WIDTH2 - 14);
+        idValue.fg = COLORS.textDim;
+        copyHint.content = "[c]opy";
+        copyHint.fg = COLORS.textDim;
+        state.viewTaskRuntime.copyTimeoutId = null;
+      }
+    }, 1000);
+  }
+}
+// src/lib/keybindings.ts
+var WILDCARD = "*";
+var navigateLeft = async (state) => {
+  state.currentColumnIndex = Math.max(0, state.currentColumnIndex - 1);
+  await refreshBoard(state);
+};
+var navigateRight = async (state) => {
+  state.currentColumnIndex = Math.min(state.columns.length - 1, state.currentColumnIndex + 1);
+  await refreshBoard(state);
+};
+var quit = (state) => {
+  state.renderer.destroy();
+  process.exit(0);
+};
+var openMoveModal = async (state) => {
+  const taskId = getSelectedTaskId(state);
+  if (taskId) {
+    await showMoveTaskModal(state, () => refreshBoard(state));
+  }
+};
+var openAssignModal = async (state) => {
+  const taskId = getSelectedTaskId(state);
+  if (taskId) {
+    await showAssignTaskModal(state, () => refreshBoard(state));
+  }
+};
+var openDeleteModal = async (state) => {
+  const taskId = getSelectedTaskId(state);
+  if (taskId) {
+    await showDeleteTaskModal(state, () => refreshBoard(state));
+  }
+};
+var openEditModal = async (state) => {
+  const task = state.selectedTask;
+  if (!task)
+    return;
+  const preservedTaskId = task.id;
+  closeModal(state);
+  state.selectedTask = task;
+  await showEditTaskModal(state, {
+    onSave: async () => {
+      await refreshBoard(state);
+      await openViewModalForTask(state, preservedTaskId);
+    },
+    onCancel: async () => {
+      await openViewModalForTask(state, preservedTaskId);
+    }
+  });
+};
+async function openViewModalForTask(state, taskIdOverride) {
+  const taskId = taskIdOverride ?? getSelectedTaskId(state);
+  if (taskId) {
+    await showViewTaskModal(state, {
+      onMove: async () => {
+        await showMoveTaskModal(state, () => refreshBoard(state));
+      },
+      onAssign: async () => {
+        await showAssignTaskModal(state, () => refreshBoard(state));
+      },
+      onDelete: async () => {
+        await showDeleteTaskModal(state, () => refreshBoard(state));
+      },
+      onEdit: async () => {
+        await openEditModal(state);
+      }
+    }, taskIdOverride);
+  }
+}
+var openViewModal = (state) => openViewModalForTask(state);
+var buttonSelectPrev = (state) => {
+  if (state.taskInput?.focused)
+    return;
+  state.buttonRow?.selectPrev();
+};
+var buttonSelectNext = (state) => {
+  if (state.taskInput?.focused)
+    return;
+  state.buttonRow?.selectNext();
+};
+var buttonTrigger = (state) => {
+  if (state.taskInput?.focused)
+    return;
+  state.buttonRow?.triggerSelected();
+};
+var editTaskSave = async (state) => {
+  if (!state.editTaskRuntime)
+    return;
+  const focusedField = state.editTaskState?.focusedField;
+  if (focusedField === "title") {
+    return;
+  }
+  if (focusedField === "buttons") {
+    state.buttonRow?.triggerSelected();
+  } else {
+    await state.editTaskRuntime.doSave();
+  }
+};
+var focusButtons = (state) => {
+  state.taskInput?.blur();
+  state.buttonRow?.setFocused(true);
+};
+var focusInput = (state) => {
+  state.buttonRow?.setFocused(false);
+  state.taskInput?.focus();
+};
+var confirmModal = async (state) => {
+  await state.onModalConfirm?.();
+};
+var modalBindings = {
+  none: {
+    q: showQuitModal,
+    escape: showQuitModal,
+    left: navigateLeft,
+    h: navigateLeft,
+    right: navigateRight,
+    l: navigateRight,
+    a: (state) => showAddTaskModal(state, () => refreshBoard(state)),
+    m: openMoveModal,
+    u: openAssignModal,
+    d: openDeleteModal,
+    return: openViewModal,
+    "?": showHelpModal
+  },
+  addTask: {
+    escape: closeModal,
+    left: buttonSelectPrev,
+    right: buttonSelectNext,
+    tab: focusButtons,
+    down: focusButtons,
+    up: focusInput,
+    return: buttonTrigger
+  },
+  moveTask: {
+    escape: closeModal
+  },
+  assignTask: {
+    escape: closeModal,
+    left: buttonSelectPrev,
+    right: buttonSelectNext,
+    tab: focusButtons,
+    down: focusButtons,
+    up: focusInput,
+    return: buttonTrigger
+  },
+  deleteTask: {
+    y: confirmModal,
+    n: closeModal,
+    escape: closeModal
+  },
+  viewTask: {
+    escape: closeModal,
+    left: buttonSelectPrev,
+    right: buttonSelectNext,
+    tab: focusButtons,
+    return: buttonTrigger,
+    m: async (state) => {
+      closeModal(state);
+      await openMoveModal(state);
+    },
+    u: async (state) => {
+      closeModal(state);
+      await openAssignModal(state);
+    },
+    d: async (state) => {
+      closeModal(state);
+      await openDeleteModal(state);
+    },
+    e: openEditModal,
+    c: copyTaskId,
+    j: (state) => scrollViewTaskDescription(state, "down"),
+    k: (state) => scrollViewTaskDescription(state, "up"),
+    down: (state) => scrollViewTaskDescription(state, "down"),
+    up: (state) => scrollViewTaskDescription(state, "up")
+  },
+  editTask: {
+    escape: cancelEditTask,
+    tab: focusNextEditField,
+    left: buttonSelectPrev,
+    right: buttonSelectNext,
+    return: editTaskSave
+  },
+  help: {
+    [WILDCARD]: closeModal
+  },
+  quit: {
+    y: quit,
+    n: closeModal,
+    escape: closeModal
+  }
+};
+function handleKeypress(state, key) {
+  const bindings = modalBindings[state.activeModal];
+  const handler = bindings[key.name] ?? bindings[WILDCARD];
+  return handler?.(state);
+}
+
+// src/lib/project.ts
+import { existsSync, mkdirSync, writeFileSync } from "node:fs";
+import { resolve } from "node:path";
+import { BoardService, createDb, DEFAULT_CONFIG, initializeSchema } from "@kaban-board/core";
+function findKabanRoot(startDir) {
+  let dir = startDir;
+  while (dir !== "/") {
+    if (existsSync(resolve(dir, ".kaban"))) {
+      return dir;
+    }
+    dir = resolve(dir, "..");
+  }
+  return null;
+}
+function getKabanPaths(root) {
+  const kabanDir = resolve(root, ".kaban");
+  return {
+    kabanDir,
+    dbPath: resolve(kabanDir, "board.db"),
+    configPath: resolve(kabanDir, "config.json")
+  };
+}
+async function initializeProject(root, boardName) {
+  const { kabanDir, dbPath, configPath } = getKabanPaths(root);
+  mkdirSync(kabanDir, { recursive: true });
+  const config = {
+    ...DEFAULT_CONFIG,
+    board: { name: boardName }
+  };
+  writeFileSync(configPath, JSON.stringify(config, null, 2));
+  const db = createDb(dbPath);
+  await initializeSchema(db);
+  const boardService = new BoardService(db);
+  await boardService.initializeBoard(config);
+  return { db, boardService };
+}
+
+// src/index.ts
+var POLL_INTERVAL_MS = 500;
+async function main() {
+  const renderer = await createCliRenderer({
+    exitOnCtrlC: true
+  });
+  let projectRoot = findKabanRoot(process.cwd());
+  let db;
+  let boardService;
+  let taskService;
+  if (!projectRoot) {
+    const boardName = await showOnboarding(renderer);
+    projectRoot = process.cwd();
+    const result = await initializeProject(projectRoot, boardName);
+    db = result.db;
+    boardService = result.boardService;
+    taskService = new TaskService(db, boardService);
+  } else {
+    const { dbPath } = getKabanPaths(projectRoot);
+    db = createDb2(dbPath);
+    boardService = new BoardService2(db);
+    taskService = new TaskService(db, boardService);
+  }
+  const board = await boardService.getBoard();
+  if (!board) {
+    console.error("Error: No board found.");
+    renderer.destroy();
+    process.exit(1);
+  }
+  const state = {
+    renderer,
+    taskService,
+    boardService,
+    boardName: board.name,
+    columns: [],
+    columnPanels: [],
+    taskSelects: new Map,
+    currentColumnIndex: 0,
+    selectedTask: null,
+    mainContainer: null,
+    activeModal: "none",
+    modalOverlay: null,
+    taskInput: null,
+    buttonRow: null,
+    onModalConfirm: null,
+    viewTaskState: null,
+    editTaskState: null,
+    viewTaskRuntime: null,
+    editTaskRuntime: null
+  };
+  await refreshBoard(state);
+  let lastDataVersion = null;
+  const client = db.$client;
+  const checkForChanges = async () => {
+    if (state.activeModal !== "none")
+      return;
+    try {
+      const result = await client.execute("PRAGMA data_version");
+      const currentVersion = result.rows[0]?.[0];
+      if (lastDataVersion !== null && currentVersion !== lastDataVersion) {
+        await refreshBoard(state);
+      }
+      lastDataVersion = currentVersion;
+    } catch {}
+  };
+  const pollInterval = setInterval(checkForChanges, POLL_INTERVAL_MS);
+  const cleanup = () => clearInterval(pollInterval);
+  process.on("exit", cleanup);
+  process.on("SIGINT", cleanup);
+  process.on("SIGTERM", cleanup);
+  renderer.keyInput.on("keypress", (key) => {
+    handleKeypress(state, key);
+  });
+}
+main().catch((err) => {
+  console.error("TUI Error:", err);
+  process.exit(1);
+});