loop-task 1.5.2 → 1.5.3

package/dist/board/App.js

@@ -397,7 +397,7 @@ export function App(props) {
                 }
                 else {
                     push("projects");
-                } } }), view === "board" ? (_jsx(FilterBar, { filters: filters, sort: sort, searchActive: searchActive, focusedPanel: derivedFocusedPanel, onStatusCycle: () => setFilters((prev) => ({ ...prev, status: cycleStatusFilter(prev.status) })), onSortCycle: () => setSort(cycleSortMode(sort)), onSelectProject: () => setProjectsModalOpen(true), currentProjectName: currentProjectId === "all" ? t("project.showAll") : (projects.find(p => p.id === currentProjectId)?.name ?? "Default"), onQueryChange: (value) => setFilters((prev) => ({ ...prev, query: value })), onSearchActivate: () => setSearchActive(true), onSearchDismiss: () => { setSearchActive(false); } })) : view === "task-list" ? (_jsx(TaskFilterBar, { query: taskQuery, searchActive: taskSearchActive, focusedPanel: derivedTaskPanel, onQueryChange: setTaskQuery, onSearchActivate: () => setTaskSearchActive(true), onSearchDismiss: () => { setTaskSearchActive(false); } })) : null, _jsx("box", { style: { flexGrow: 1, backgroundColor: "#0b0b0b" }, children: view === "create" ? (_jsx(CreateView, { mode: editTarget && !cloneMode ? "edit" : "create", editId: editTarget && !cloneMode ? editTarget.id : null, initial: createInitialValues(editTarget, currentProjectId), selectedTaskId: pendingTaskSelection?.id ?? null, selectedTaskName: pendingTaskSelection?.name ?? null, projects: projects, currentProjectId: currentProjectId, onCancel: cancelCreate, onDone: onCreateDone, onChooseTask: handleChooseTask })) : TASK_FORM_VIEWS.has(view) ? (_jsx(TaskForm, { mode: view === "task-edit" ? "edit" : "create", editTask: editTask, onCancel: cancelTask, onDone: onTaskDone, onCopy: () => pushToast("success", t("board.toastCopied")) })) : view === "task-list" ? (_jsxs("box", { style: { flexDirection: breakpoint === "narrow" ? "column" : "row", flexGrow: 1, backgroundColor: "#0b0b0b" }, children: [_jsx(TaskNavigator, { visible: filteredTasks, total: tasks.length, selectedIndex: taskClampedIndex, focused: derivedTaskPanel === "tasks", query: taskQuery, onSelect: (index) => { setTaskSelectedIndex(index); }, onActivate: (index) => { setTaskSelectedIndex(index); setEditTask(filteredTasks[index] ?? null); push("task-edit"); } }), _jsxs("box", { style: { flexDirection: "column", flexGrow: 1, backgroundColor: "#0b0b0b", overflow: "hidden" }, children: [_jsx(TaskInspector, { task: selectedTask, onCopy: () => pushToast("success", t("board.toastCopied")) }, `ti-${selectedTask?.id}`), _jsx(TaskActionButtons, { task: selectedTask, focused: taskActionIdx >= 0, selectedAction: derivedTaskAction, selectable: stack.includes("create") || stack.includes("task-edit"), onAction: handleTaskAction }, `tab-${selectedTask?.id}`)] })] })) : view === "projects" ? (_jsx(ProjectsPage, { projects: projects, loops: loops, headerFocused: isHeaderFocused, onClose: () => pop(), onRefresh: refreshProjects, onOpenCreate: (trigger) => { createProjectTriggerRef.current = trigger; }, onEnterHeader: () => { } })) : (_jsxs("box", { style: { flexDirection: breakpoint === "narrow" ? "column" : "row", flexGrow: 1, backgroundColor: "#0b0b0b" }, children: [_jsx(Navigator, { visible: visible, total: loops.length, selectedIndex: clampedIndex, filters: filters, sort: sort, breakpoint: breakpoint, focused: derivedFocusedPanel === "loops" || derivedFocusedPanel === "navigator", projects: projects, onSelect: (index) => setSelectedIndex(index), onActivate: (index) => { setSelectedIndex(index); const loop = visible[index]; if (loop) {
+                } } }), view === "board" ? (_jsx(FilterBar, { filters: filters, sort: sort, searchActive: searchActive, focusedPanel: derivedFocusedPanel, onStatusCycle: () => setFilters((prev) => ({ ...prev, status: cycleStatusFilter(prev.status) })), onSortCycle: () => setSort(cycleSortMode(sort)), onSelectProject: () => setProjectsModalOpen(true), currentProjectName: currentProjectId === "all" ? t("project.showAll") : (projects.find(p => p.id === currentProjectId)?.name ?? "Default"), onQueryChange: (value) => setFilters((prev) => ({ ...prev, query: value })), onSearchActivate: () => setSearchActive(true), onSearchDismiss: () => { setSearchActive(false); } })) : view === "task-list" ? (_jsx(TaskFilterBar, { query: taskQuery, searchActive: taskSearchActive, focusedPanel: derivedTaskPanel, onQueryChange: setTaskQuery, onSearchActivate: () => setTaskSearchActive(true), onSearchDismiss: () => { setTaskSearchActive(false); } })) : null, _jsx("box", { style: { flexGrow: 1, backgroundColor: "#0b0b0b" }, children: view === "create" ? (_jsx(CreateView, { mode: editTarget && !cloneMode ? "edit" : "create", editId: editTarget && !cloneMode ? editTarget.id : null, initial: createInitialValues(editTarget, currentProjectId), selectedTaskId: pendingTaskSelection?.id ?? null, selectedTaskName: pendingTaskSelection?.name ?? null, projects: projects, currentProjectId: currentProjectId, onCancel: cancelCreate, onDone: onCreateDone, onChooseTask: handleChooseTask })) : TASK_FORM_VIEWS.has(view) ? (_jsx(TaskForm, { mode: view === "task-edit" ? "edit" : "create", editTask: editTask, onCancel: cancelTask, onDone: onTaskDone, onCopy: () => pushToast("success", t("board.toastCopied")) })) : view === "task-list" ? (_jsxs("box", { style: { flexDirection: breakpoint === "narrow" ? "column" : "row", flexGrow: 1, backgroundColor: "#0b0b0b" }, children: [_jsx(TaskNavigator, { visible: filteredTasks, total: tasks.length, selectedIndex: taskClampedIndex, focused: derivedTaskPanel === "tasks", query: taskQuery, onSelect: (index) => { setTaskSelectedIndex(index); }, onActivate: (index) => { setTaskSelectedIndex(index); setEditTask(filteredTasks[index] ?? null); push("task-edit"); } }), _jsxs("box", { style: { flexDirection: "column", flexGrow: 1, backgroundColor: "#0b0b0b", overflow: "hidden" }, children: [_jsx(TaskInspector, { task: selectedTask }, `ti-${selectedTask?.id}`), _jsx(TaskActionButtons, { task: selectedTask, focused: taskActionIdx >= 0, selectedAction: derivedTaskAction, selectable: stack.includes("create") || stack.includes("task-edit"), onAction: handleTaskAction }, `tab-${selectedTask?.id}`)] })] })) : view === "projects" ? (_jsx(ProjectsPage, { projects: projects, loops: loops, headerFocused: isHeaderFocused, onClose: () => pop(), onRefresh: refreshProjects, onOpenCreate: (trigger) => { createProjectTriggerRef.current = trigger; }, onEnterHeader: () => { } })) : (_jsxs("box", { style: { flexDirection: breakpoint === "narrow" ? "column" : "row", flexGrow: 1, backgroundColor: "#0b0b0b" }, children: [_jsx(Navigator, { visible: visible, total: loops.length, selectedIndex: clampedIndex, filters: filters, sort: sort, breakpoint: breakpoint, focused: derivedFocusedPanel === "loops" || derivedFocusedPanel === "navigator", projects: projects, onSelect: (index) => setSelectedIndex(index), onActivate: (index) => { setSelectedIndex(index); const loop = visible[index]; if (loop) {
                                 setEditTarget(loop);
                                 push("create");
                             } } }), _jsxs("box", { style: { flexDirection: "column", flexGrow: 1, backgroundColor: "#0b0b0b", overflow: "hidden" }, children: [_jsx(Inspector, { loop: selected }), _jsx(RunHistory, { loop: selected, selectedRunIndex: selectedRunIndex, focused: derivedFocusedPanel === "runs" || derivedFocusedPanel === "run-history", onSelectRun: (index) => setSelectedRunIndex(index), onOpenRun: handleOpenRunLog }), _jsx(ActionButtons, { loop: selected, focused: actionIdx >= 0, selectedAction: derivedSelectedAction, onAction: handleAction })] })] })) }, viewKey(view, editTarget, editTask)), _jsx(Footer, { mode: mode }), confirm ? (_jsx(ConfirmModal, { message: confirm.message, choice: confirmChoice, onYes: () => { const action = confirm.action; setConfirm(null); void action(); }, onNo: () => setConfirm(null) })) : null, helpOpen ? _jsx(HelpModal, { view: view }) : null, contextHelpOpen ? _jsx(ContextHelpModal, { onClose: () => setContextHelpOpen(false) }) : null, logModalRun ? (_jsx(LogModal, { loopId: selectedId, run: logModalRun, logLines: logModalLines, loading: logModalLoading, onClose: () => setLogModalRun(null) })) : null, projectsModalOpen ? (_jsx(ProjectsModal, { projects: projects, loops: loops, currentProjectId: currentProjectId, onSelect: (id) => { setCurrentProjectId(id); setProjectsModalOpen(false); }, onClose: () => setProjectsModalOpen(false) })) : null, _jsx(ToastStack, { toasts: toasts })] }));

package/dist/board/components/SearchSelect.js

@@ -2,77 +2,81 @@ import { jsx as _jsx, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
 import { useRef, useState, useMemo, useEffect } from "react";
 import { useKeyboard } from "@opentui/react";
 import { t } from "../../i18n/index.js";
-import { useInputShortcuts } from "../hooks/useInputShortcuts.js";
 import { SEARCH_SELECT_HEIGHT } from "../../config/constants.js";
 export function SearchSelect(props) {
     const { options, value, onChange, focused, height } = props;
     const placeholder = props.placeholder ?? t("board.searchSelectPlaceholder");
     const maxHeight = height ?? SEARCH_SELECT_HEIGHT;
-    const inputRef = useRef(null);
     const [filter, setFilter] = useState("");
     const [selectedIndex, setSelectedIndex] = useState(0);
-    const [userNavigated, setUserNavigated] = useState(false);
+    const filterRef = useRef(filter);
+    filterRef.current = filter;
     const filtered = useMemo(() => {
         if (!filter)
             return options;
         const q = filter.toLowerCase();
         return options.filter((o) => o.name.toLowerCase().includes(q) || o.value.toLowerCase().includes(q));
     }, [options, filter]);
-    const currentIdx = filtered.findIndex((o) => o.value === value);
-    const displaySelected = userNavigated ? selectedIndex : (currentIdx >= 0 ? currentIdx : 0);
-    const clampedSelected = Math.min(displaySelected, Math.max(0, filtered.length - 1));
+    const clampedSelected = Math.min(selectedIndex, Math.max(0, filtered.length - 1));
     const filteredRef = useRef(filtered);
     filteredRef.current = filtered;
-    const selectedIdxRef = useRef(clampedSelected);
-    selectedIdxRef.current = clampedSelected;
+    const selectedRef = useRef(clampedSelected);
+    selectedRef.current = clampedSelected;
     const focusedRef = useRef(focused);
     focusedRef.current = focused;
     const onChangeRef = useRef(onChange);
     onChangeRef.current = onChange;
-    const filterRef = useRef(filter);
-    filterRef.current = filter;
+    const scrollRef = useRef(null);
     useEffect(() => {
         if (focused) {
-            setUserNavigated(false);
-            setSelectedIndex(currentIdx >= 0 ? currentIdx : 0);
+            const idx = filtered.findIndex((o) => o.value === value);
+            const target = idx >= 0 ? idx : 0;
+            setSelectedIndex(target);
+            requestAnimationFrame(() => {
+                scrollRef.current?.scrollChildIntoView(`select-option-${target}`);
+            });
         }
         else {
             setFilter("");
-            setUserNavigated(false);
         }
     }, [focused]);
-    useInputShortcuts(() => focusedRef.current ? inputRef.current : null);
+    useEffect(() => {
+        scrollRef.current?.scrollChildIntoView(`select-option-${clampedSelected}`);
+    }, [clampedSelected, filter]);
+    const computeFiltered = (f) => {
+        if (!f)
+            return options;
+        const q = f.toLowerCase();
+        return options.filter((o) => o.name.toLowerCase().includes(q) || o.value.toLowerCase().includes(q));
+    };
     useKeyboard((key) => {
         if (!focusedRef.current)
             return;
         const name = key.name;
         if (name === "up" || name === "k") {
-            const list = filteredRef.current;
+            const list = computeFiltered(filterRef.current);
             if (list.length > 0) {
-                const cur = selectedIdxRef.current;
-                const next = cur <= 0 ? list.length - 1 : cur - 1;
-                setSelectedIndex(next);
-                setUserNavigated(true);
+                const cur = Math.min(selectedRef.current, list.length - 1);
+                setSelectedIndex(cur <= 0 ? list.length - 1 : cur - 1);
             }
             key.preventDefault();
             key.stopPropagation();
             return;
         }
         if (name === "down" || name === "j") {
-            const list = filteredRef.current;
+            const list = computeFiltered(filterRef.current);
             if (list.length > 0) {
-                const cur = selectedIdxRef.current;
-                const next = cur >= list.length - 1 ? 0 : cur + 1;
-                setSelectedIndex(next);
-                setUserNavigated(true);
+                const cur = Math.min(selectedRef.current, list.length - 1);
+                setSelectedIndex(cur >= list.length - 1 ? 0 : cur + 1);
             }
             key.preventDefault();
             key.stopPropagation();
             return;
         }
         if (name === "return" || name === "enter") {
-            const list = filteredRef.current;
-            const option = list[selectedIdxRef.current];
+            const list = computeFiltered(filterRef.current);
+            const cur = Math.min(selectedRef.current, list.length - 1);
+            const option = list[cur];
             if (option) {
                 onChangeRef.current(option.value);
             }
@@ -81,21 +85,17 @@ export function SearchSelect(props) {
             return;
         }
         if (name === "escape") {
-            if (filterRef.current) {
-                setFilter("");
-                setSelectedIndex(0);
-                setUserNavigated(false);
-                if (inputRef.current)
-                    inputRef.current.value = "";
-            }
+            setFilter("");
+            setSelectedIndex(0);
             key.preventDefault();
             key.stopPropagation();
             return;
         }
         if (name === "backspace") {
-            setFilter((f) => f.slice(0, -1));
+            const newFilter = filterRef.current.slice(0, -1);
+            filterRef.current = newFilter;
+            setFilter(newFilter);
             setSelectedIndex(0);
-            setUserNavigated(false);
             key.preventDefault();
             key.stopPropagation();
             return;
@@ -110,22 +110,23 @@ export function SearchSelect(props) {
             char = key.sequence;
         }
         if (char) {
-            setFilter((f) => f + char);
+            const newFilter = filterRef.current + char;
+            filterRef.current = newFilter;
+            setFilter(newFilter);
             setSelectedIndex(0);
-            setUserNavigated(false);
             key.preventDefault();
             key.stopPropagation();
             return;
         }
     });
     const listHeight = Math.min(filtered.length, maxHeight);
-    return (_jsxs("box", { border: true, borderColor: focused ? "#38bdf8" : undefined, style: { flexDirection: "column", backgroundColor: focused ? "#0f172a" : "#0b0b0b" }, children: [_jsxs("box", { style: { height: 3, flexDirection: "row", alignItems: "center", paddingLeft: 1 }, children: [_jsx("text", { fg: "#6b7280", children: "/ " }), _jsx("text", { fg: filter ? "#e5e7eb" : "#6b7280", children: filter || placeholder })] }), _jsx("box", { style: { flexDirection: "column", height: listHeight }, children: filtered.map((option, i) => {
+    return (_jsxs("box", { border: true, borderColor: focused ? "#38bdf8" : undefined, style: { flexDirection: "column", backgroundColor: focused ? "#0f172a" : "#0b0b0b" }, children: [_jsxs("box", { style: { height: 3, flexDirection: "row", alignItems: "center", paddingLeft: 1 }, children: [_jsx("text", { fg: "#6b7280", children: "/ " }), _jsx("text", { fg: filter ? "#e5e7eb" : "#6b7280", children: filter || placeholder })] }), _jsx("scrollbox", { ref: scrollRef, style: { height: listHeight, backgroundColor: "#0b0b0b" }, children: filtered.map((option, i) => {
                     const isSelected = i === clampedSelected;
                     const isActive = option.value === value;
                     const prefix = isSelected ? "› " : "  ";
                     const colorIndicator = option.color ? `\u25cf ` : "";
                     const bg = isSelected ? "#1e3a8a" : undefined;
                     const fg = isSelected ? "#ffffff" : isActive ? "#38bdf8" : "#9ca3af";
-                    return (_jsx("box", { style: { flexDirection: "row", backgroundColor: bg }, children: _jsx("text", { fg: fg, children: `${prefix}${colorIndicator}${option.name}` }) }, option.value));
+                    return (_jsx("box", { id: `select-option-${i}`, style: { flexDirection: "row", backgroundColor: bg }, children: _jsx("text", { fg: fg, children: `${prefix}${colorIndicator}${option.name}` }) }, option.value));
                 }) })] }));
 }

package/dist/board/components/TaskBrowser.js

@@ -5,7 +5,6 @@ import { t } from "../../i18n/index.js";
 import { commandLine, truncate } from "../format.js";
 import { useHoverState } from "../hooks/useHoverState.js";
 import { HOVER_BG, ENTITY_COLORS } from "../../config/constants.js";
-import { copyToClipboard } from "../../shared/clipboard.js";
 function fit(text, width) {
     if (width <= 0)
         return "";
@@ -68,13 +67,12 @@ function TaskNavRow(props) {
     return (_jsx("box", { id: id, onMouseDown: handleClick, backgroundColor: bg, ...hoverProps, children: _jsxs("text", { fg: fg, children: [isSelected ? "›" : " ", " ", fit(name, nameW), "  ", fit(truncCmd, cmdW), "  ", fit(chains, chainsW)] }) }));
 }
 export function TaskInspector(props) {
-    const { task, onCopy } = props;
+    const { task } = props;
     if (!task) {
         return (_jsx("box", { title: t("board.inspectorTitle"), border: true, style: { backgroundColor: "#0b0b0b" }, children: _jsx("text", { fg: "#9ca3af", children: t("board.inspectorEmpty") }) }));
     }
     const cmd = commandLine(task.command, task.commandArgs);
-    const { isHovered, hoverProps } = useHoverState();
-    return (_jsxs("box", { title: t("board.inspectorTitle"), border: true, style: { flexDirection: "column", backgroundColor: "#0b0b0b" }, children: [_jsxs("text", { children: [_jsx("strong", { children: t("board.fieldId") }), " ", task.id] }), _jsxs("text", { children: [_jsx("strong", { children: t("board.taskLabelName") }), " ", task.name] }), _jsxs("box", { style: { flexDirection: "row" }, children: [_jsxs("text", { children: [_jsx("strong", { children: t("board.fieldCommand") }), " ", cmd] }), _jsx("box", { border: true, borderColor: isHovered ? "#38bdf8" : "#374151", onMouseDown: () => { copyToClipboard(cmd); onCopy?.(cmd); }, style: { paddingLeft: 1, paddingRight: 1, marginLeft: 1, backgroundColor: isHovered ? HOVER_BG : "#0b0b0b" }, ...hoverProps, children: _jsx("text", { fg: isHovered ? "#38bdf8" : "#6b7280", children: "\u2398" }) })] }), _jsxs("text", { children: [_jsx("strong", { children: t("board.taskLabelOnSuccess") }), " ", task.onSuccessTaskId ?? t("board.taskNone")] }), _jsxs("text", { children: [_jsx("strong", { children: t("board.taskLabelOnFailure") }), " ", task.onFailureTaskId ?? t("board.taskNone")] })] }));
+    return (_jsxs("box", { title: t("board.inspectorTitle"), border: true, style: { flexDirection: "column", backgroundColor: "#0b0b0b" }, children: [_jsxs("text", { children: [_jsx("strong", { children: t("board.fieldId") }), " ", task.id] }), _jsxs("text", { children: [_jsx("strong", { children: t("board.taskLabelName") }), " ", task.name] }), _jsxs("text", { children: [_jsx("strong", { children: t("board.fieldCommand") }), " ", cmd] }), _jsxs("text", { children: [_jsx("strong", { children: t("board.taskLabelOnSuccess") }), " ", task.onSuccessTaskId ?? t("board.taskNone")] }), _jsxs("text", { children: [_jsx("strong", { children: t("board.taskLabelOnFailure") }), " ", task.onFailureTaskId ?? t("board.taskNone")] })] }));
 }
 export function TaskActionButtons(props) {
     const { task, focused, selectedAction, selectable = true, onAction } = props;

package/dist/board/hooks/useBoardKeybindings.js

@@ -198,6 +198,14 @@ export function useBoardKeybindings(params) {
     const { confirm, confirmChoice, setConfirm, setConfirmChoice, helpOpen, setHelpOpen, searchActive, setSearchActive, view, push, pop, setEditTarget, setEditTask, selected, visibleCount, setSelectedIndex, setFilters, setSort, onQuit, destroyLogSocket, logModalRun, setLogModalRun, logModalLines, selectedRunIndex, setSelectedRunIndex, selectedRunCount, focusedPanel, setFocusedPanel, selectedAction, setSelectedAction, onAction, onOpenRunLog, refreshTasks, onViewTasks, onViewProjects, onViewLoops, onAddLoop, onAddTask, onSelectProject, } = params;
     useKeyboard((key) => {
         const name = key.name;
+        if (key.ctrl && name === "c") {
+            if (!logModalRun && !confirm && !helpOpen) {
+                onQuit();
+                key.preventDefault();
+                key.stopPropagation();
+                return;
+            }
+        }
         if (confirm) {
             CONFIRM_KEYS[name]?.({ confirm, confirmChoice, setConfirm, setConfirmChoice });
             key.preventDefault();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "loop-task",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "description": "Loop engineering toolkit. Run any command on a cadence, in the background, managed from a terminal board. Schedule tests, builds, syncs, or agent prompts.",
   "type": "module",
   "bin": {