bitty-tui 0.0.22 → 0.1.0

package/dist/app.js

@@ -1,10 +1,15 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
+import { useInput } from "ink";
 import { LoginView } from "./login/LoginView.js";
 import { DashboardView } from "./dashboard/DashboardView.js";
 import { useRefreshResize } from "./hooks/refresh-resize.js";
 export default function App() {
     const [view, setView] = useState("login");
     const r = useRefreshResize();
+    useInput((input, key) => {
+        if (input === "c" && key.ctrl)
+            process.exit(0);
+    });
     return (_jsxs(_Fragment, { children: [view === "login" ? (_jsx(LoginView, { onLogin: () => setView("dashboard") })) : (_jsx(DashboardView, { onLogout: () => setView("login") })), r] }));
 }

package/dist/cli.js

@@ -4,6 +4,7 @@ import { render } from "ink";
 import App from "./app.js";
 import { StatusMessageProvider } from "./hooks/status-message.js";
 import { MouseProvider } from "./hooks/use-mouse.js";
+import { KeybindingsProvider } from "./hooks/keybindings.js";
 import { readPackageUpSync } from "read-package-up";
 import { art } from "./theme/art.js";
 import path from "node:path";
@@ -29,4 +30,10 @@ if (args.includes("--help") || args.includes("-h")) {
 `);
     process.exit(0);
 }
-render(_jsx(StatusMessageProvider, { children: _jsx(MouseProvider, { children: _jsx(App, {}) }) }));
+render(_jsx(KeybindingsProvider, { children: _jsx(StatusMessageProvider, { children: _jsx(MouseProvider, { children: _jsx(App, {}) }) }) }), {
+    exitOnCtrlC: false,
+    kittyKeyboard: {
+        mode: "enabled",
+        flags: ["disambiguateEscapeCodes"],
+    },
+});

package/dist/components/TextInput.js

@@ -6,6 +6,7 @@ import clipboard from "clipboardy";
 import chalk from "chalk";
 import { useStatusMessage } from "../hooks/status-message.js";
 import { useMouseTarget } from "../hooks/use-mouse.js";
+import { matchBinding, useKeybindings } from "../hooks/keybindings.js";
 export const TextInput = ({ id, placeholder, value, isPassword, showPasswordOnFocus, isActive, autoFocus, inline, multiline, maxLines = 1, onChange, onSubmit, onCopy, ...props }) => {
     const [cursor, setCursor] = useState(onChange ? value.length : 0);
     const [scrollOffset, setScrollOffset] = useState(0);
@@ -14,6 +15,7 @@ export const TextInput = ({ id, placeholder, value, isPassword, showPasswordOnFo
     const { isFocused } = useFocus({ id: effectiveId, isActive, autoFocus });
     const { showStatusMessage } = useStatusMessage();
     const { focusNext } = useFocusManager();
+    const { keybindings } = useKeybindings();
     const boxRef = useRef(null);
     useMouseTarget(effectiveId, boxRef);
     const displayValue = useMemo(() => {
@@ -82,7 +84,7 @@ export const TextInput = ({ id, placeholder, value, isPassword, showPasswordOnFo
         }
     }, [value, cursor, multiline, maxLines]);
     useInput((input, key) => {
-        if (key.ctrl && input === "y") {
+        if (matchBinding(input, key, keybindings.copyField)) {
             if (onCopy) {
                 onCopy(value);
             }
@@ -95,7 +97,7 @@ export const TextInput = ({ id, placeholder, value, isPassword, showPasswordOnFo
             onChange?.(value.slice(0, Math.max(0, cursor - 1)) + value.slice(cursor));
             setCursor(cursor - 1);
         }
-        else if (key.ctrl && input === "e") {
+        else if (matchBinding(input, key, keybindings.cursorEnd)) {
             if (multiline) {
                 const nextNewline = value.indexOf("\n", cursor);
                 if (nextNewline !== -1) {
@@ -105,7 +107,7 @@ export const TextInput = ({ id, placeholder, value, isPassword, showPasswordOnFo
             }
             setCursor(value.length);
         }
-        else if (key.ctrl && input === "a") {
+        else if (matchBinding(input, key, keybindings.cursorStart)) {
             if (multiline) {
                 const prevNewline = value.lastIndexOf("\n", Math.max(0, cursor - 1));
                 if (prevNewline !== -1) {
@@ -166,7 +168,17 @@ export const TextInput = ({ id, placeholder, value, isPassword, showPasswordOnFo
             }
         }
         else if (key.return) {
-            if (multiline && cursor > 0 && value[cursor - 1] === "\\") {
+            if (multiline && (key.shift || key.meta)) {
+                const newValue = value.slice(0, cursor) + "\n" + value.slice(cursor);
+                const newCursor = cursor + 1;
+                const newCurrentLine = newValue.substring(0, newCursor).split("\n").length - 1;
+                if (newCurrentLine >= scrollOffset + maxLines) {
+                    setScrollOffset(newCurrentLine - maxLines + 1);
+                }
+                onChange?.(newValue);
+                setCursor(newCursor);
+            }
+            else if (multiline && cursor > 0 && value[cursor - 1] === "\\") {
                 const newValue = value.slice(0, cursor - 1) + "\n" + value.slice(cursor);
                 const newCurrentLine = newValue.substring(0, cursor).split("\n").length - 1;
                 if (newCurrentLine >= scrollOffset + maxLines) {

package/dist/dashboard/DashboardView.js

@@ -1,15 +1,17 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useMemo } from "react";
 import { Box, Text, useFocusManager, useInput, useStdout } from "ink";
 import { TextInput } from "../components/TextInput.js";
 import { VaultList } from "./components/VaultList.js";
 import { CipherDetail } from "./components/CipherDetail.js";
 import { HelpBar } from "./components/HelpBar.js";
+import { KeybindingsView } from "./KeybindingsView.js";
 import { primary } from "../theme/style.js";
 import { bwClient, clearConfig, createEmptyCipher, emptyCipher, useBwSync } from "../hooks/bw.js";
 import { useStatusMessage } from "../hooks/status-message.js";
 import { useMouseSubscribe } from "../hooks/use-mouse.js";
 import { TabButton } from "../components/TabButton.js";
+import { matchBinding, useKeybindings } from "../hooks/keybindings.js";
 export function DashboardView({ onLogout }) {
     const { sync, error, fetchSync } = useBwSync();
     const [syncState, setSyncState] = useState(sync);
@@ -20,9 +22,11 @@ export function DashboardView({ onLogout }) {
     const [detailMode, setDetailMode] = useState("view");
     const [editedCipher, setEditedCipher] = useState(null);
     const [activeTab, setActiveTab] = useState("main");
+    const [showKeybindings, setShowKeybindings] = useState(false);
     const { focus, focusNext } = useFocusManager();
     const { stdout } = useStdout();
     const { statusMessage, statusMessageColor, showStatusMessage } = useStatusMessage();
+    const { keybindings } = useKeybindings();
     const filteredCiphers = useMemo(() => {
         return (syncState?.ciphers.filter((c) => {
             if (c.deletedDate)
@@ -73,11 +77,20 @@ export function DashboardView({ onLogout }) {
             showStatusMessage(error, "error");
     }, [error]);
     useInput(async (input, key) => {
-        if (key.ctrl && input === "w") {
+        if (matchBinding(input, key, keybindings.logout)) {
             await logout();
             return;
         }
-        if (key.shift && key.rightArrow) {
+        if (matchBinding(input, key, keybindings.openKeybindings)) {
+            setShowKeybindings(true);
+            return;
+        }
+        if (matchBinding(input, key, keybindings.refresh)) {
+            await fetchSync();
+            showStatusMessage("Refreshed!", "success");
+            return;
+        }
+        if (matchBinding(input, key, keybindings.nextTab)) {
             setActiveTab((prev) => {
                 if (prev === "main")
                     return "more";
@@ -87,7 +100,7 @@ export function DashboardView({ onLogout }) {
             });
             return;
         }
-        if (key.shift && key.leftArrow) {
+        if (matchBinding(input, key, keybindings.prevTab)) {
             setActiveTab((prev) => {
                 if (prev === "main")
                     return syncState?.collections?.length ? "collections" : "more";
@@ -97,12 +110,12 @@ export function DashboardView({ onLogout }) {
             });
             return;
         }
-        if (input === "/" && focusedComponent === "list") {
+        if (matchBinding(input, key, keybindings.focusSearch) && focusedComponent === "list") {
             setFocusedComponent("search");
             focus("search");
             return;
         }
-        if (key.ctrl && input === "n") {
+        if (matchBinding(input, key, keybindings.newCipher)) {
             setDetailMode("new");
             setEditedCipher(emptyCipher);
             setFocusedComponent("detail");
@@ -131,105 +144,105 @@ export function DashboardView({ onLogout }) {
                 setShowDetails(false);
             }
         }
-    });
+    }, { isActive: !showKeybindings });
     useEffect(() => {
         if (showDetails)
             return;
         setShowDetails(true);
         setTimeout(focusNext, 50);
     }, [showDetails]);
-    return (_jsxs(Box, { flexDirection: "column", width: "100%", height: stdout.rows - 2, children: [_jsx(Box, { borderStyle: "double", borderColor: primary, paddingX: 2, justifyContent: "center", flexShrink: 0, children: _jsx(Text, { bold: true, color: primary, children: "BiTTY" }) }), _jsxs(Box, { flexShrink: 0, children: [_jsx(Box, { width: "40%", children: _jsx(TextInput, { id: "search", placeholder: focusedComponent === "search" ? "" : "[/] Search in vault", value: searchQuery, isActive: false, onChange: setSearchQuery, onSubmit: () => {
-                                setFocusedComponent("list");
-                                focusNext();
-                            } }) }), _jsxs(Box, { width: "60%", paddingX: 1, justifyContent: "space-between", children: [statusMessage ? (_jsx(Box, { padding: 1, flexShrink: 1, children: _jsx(Text, { color: statusMessageColor, children: statusMessage }) })) : (_jsx(Box, {})), selectedCipher && (_jsxs(Box, { gap: 1, flexShrink: 0, children: [_jsx(TabButton, { active: false, onClick: async () => {
-                                            await fetchSync();
-                                            showStatusMessage("Refreshed!", "success");
-                                        }, children: "\uD83D\uDD04" }), _jsx(TabButton, { active: activeTab === "main", onClick: () => setActiveTab("main"), children: "Main" }), _jsx(TabButton, { active: activeTab === "more", onClick: () => setActiveTab("more"), children: "More" }), !!syncState?.collections?.length && (_jsx(TabButton, { active: activeTab === "collections", onClick: () => setActiveTab("collections"), children: "Collections" }))] }))] })] }), _jsxs(Box, { minHeight: 20, flexGrow: 1, children: [_jsx(VaultList, { filteredCiphers: filteredCiphers, isFocused: ["list", "search"].includes(focusedComponent), selected: listIndex, onSelect: (index) => setListSelected(filteredCiphers[index] || null) }), _jsx(CipherDetail, { selectedCipher: showDetails ? selectedCipher : null, mode: detailMode, activeTab: activeTab, collections: writableCollections, organizations: organizations, isFocused: focusedComponent === "detail", onTypeChange: (type) => {
-                            const fresh = createEmptyCipher(type);
-                            fresh.name = editedCipher?.name ?? "";
-                            fresh.notes = editedCipher?.notes ?? null;
-                            fresh.collectionIds = editedCipher?.collectionIds ?? [];
-                            fresh.organizationId = editedCipher?.organizationId ?? null;
-                            setEditedCipher(fresh);
-                        }, onReset: async () => {
-                            bwClient.decryptedSyncCache = null;
-                            await fetchSync(false);
-                            showStatusMessage("Resetted!", "success");
-                        }, onChange: (cipher) => {
-                            if (detailMode === "new") {
-                                setEditedCipher(cipher);
-                                return;
-                            }
-                            const updatedCiphers = syncState?.ciphers.map((c) => c.id === cipher.id ? cipher : c);
-                            setSyncState((prev) => ({ ...prev, ciphers: updatedCiphers }));
-                        }, onDelete: async (cipher) => {
-                            showStatusMessage("Deleting...");
-                            try {
-                                await bwClient.deleteSecret(cipher.id);
-                                fetchSync();
-                                showStatusMessage("Deleted!", "success");
-                                setFocusedComponent("list");
-                                setActiveTab("main");
-                            }
-                            catch (e) {
-                                showStatusMessage("Delete error", "error");
-                            }
-                        }, onSave: async (cipher) => {
-                            showStatusMessage("Saving...");
-                            if (detailMode === "new") {
-                                try {
-                                    if (cipher.organizationId && !cipher.collectionIds?.length) {
-                                        showStatusMessage("Select at least one collection", "error");
+    return (_jsxs(Box, { flexDirection: "column", width: "100%", height: stdout.rows - 2, children: [_jsx(Box, { borderStyle: "double", borderColor: primary, paddingX: 2, justifyContent: "center", flexShrink: 0, children: _jsx(Text, { bold: true, color: primary, children: "BiTTY" }) }), showKeybindings ? (_jsx(KeybindingsView, { onClose: () => setShowKeybindings(false) })) : (_jsxs(_Fragment, { children: [_jsxs(Box, { flexShrink: 0, children: [_jsx(Box, { width: "40%", children: _jsx(TextInput, { id: "search", placeholder: focusedComponent === "search" ? "" : "[/] Search in vault", value: searchQuery, isActive: false, onChange: setSearchQuery, onSubmit: () => {
+                                        setFocusedComponent("list");
+                                        focusNext();
+                                    } }) }), _jsxs(Box, { width: "60%", paddingX: 1, justifyContent: "space-between", children: [statusMessage ? (_jsx(Box, { padding: 1, flexShrink: 1, children: _jsx(Text, { color: statusMessageColor, children: statusMessage }) })) : (_jsx(Box, {})), _jsxs(Box, { gap: 1, flexShrink: 0, children: [_jsx(TabButton, { active: false, onClick: () => setShowKeybindings(true), children: "\u2699" }), _jsx(TabButton, { active: false, onClick: async () => {
+                                                    await fetchSync();
+                                                    showStatusMessage("Refreshed!", "success");
+                                                }, children: "\u27F3" }), selectedCipher && (_jsxs(_Fragment, { children: [_jsx(TabButton, { active: activeTab === "main", onClick: () => setActiveTab("main"), children: "Main" }), _jsx(TabButton, { active: activeTab === "more", onClick: () => setActiveTab("more"), children: "More" }), !!syncState?.collections?.length && (_jsx(TabButton, { active: activeTab === "collections", onClick: () => setActiveTab("collections"), children: "Collections" }))] }))] })] })] }), _jsxs(Box, { minHeight: 20, flexGrow: 1, children: [_jsx(VaultList, { filteredCiphers: filteredCiphers, isFocused: ["list", "search"].includes(focusedComponent), selected: listIndex, onSelect: (index) => setListSelected(filteredCiphers[index] || null) }), _jsx(CipherDetail, { selectedCipher: showDetails ? selectedCipher : null, mode: detailMode, activeTab: activeTab, collections: writableCollections, organizations: organizations, isFocused: focusedComponent === "detail", onTypeChange: (type) => {
+                                    const fresh = createEmptyCipher(type);
+                                    fresh.name = editedCipher?.name ?? "";
+                                    fresh.notes = editedCipher?.notes ?? null;
+                                    fresh.collectionIds = editedCipher?.collectionIds ?? [];
+                                    fresh.organizationId = editedCipher?.organizationId ?? null;
+                                    setEditedCipher(fresh);
+                                }, onReset: async () => {
+                                    bwClient.decryptedSyncCache = null;
+                                    await fetchSync(false);
+                                    showStatusMessage("Resetted!", "success");
+                                }, onChange: (cipher) => {
+                                    if (detailMode === "new") {
+                                        setEditedCipher(cipher);
                                         return;
                                     }
-                                    await bwClient.createSecret(cipher);
-                                    fetchSync();
-                                    showStatusMessage("Saved!", "success");
-                                    setDetailMode("view");
-                                    setFocusedComponent("list");
-                                    setActiveTab("main");
-                                }
-                                catch (e) {
-                                    showStatusMessage("Synchronization error", "error");
-                                }
-                            }
-                            else {
-                                try {
-                                    const original = sync?.ciphers.find((c) => c.id === cipher.id);
-                                    const originalOrgId = original?.organizationId ?? null;
-                                    const originalCollections = original?.collectionIds ?? [];
-                                    const newCollections = [...cipher.collectionIds ?? []];
-                                    // Sharing: personal cipher being assigned to an org
-                                    if (!originalOrgId && cipher.organizationId) {
-                                        if (!newCollections.length) {
-                                            showStatusMessage("Select at least one collection to share", "error");
-                                            return;
-                                        }
-                                        await bwClient.shareCipher(cipher.id, cipher, newCollections);
+                                    const updatedCiphers = syncState?.ciphers.map((c) => c.id === cipher.id ? cipher : c);
+                                    setSyncState((prev) => ({ ...prev, ciphers: updatedCiphers }));
+                                }, onDelete: async (cipher) => {
+                                    showStatusMessage("Deleting...");
+                                    try {
+                                        await bwClient.deleteSecret(cipher.id);
                                         fetchSync();
-                                        showStatusMessage("Shared!", "success");
+                                        showStatusMessage("Deleted!", "success");
                                         setFocusedComponent("list");
                                         setActiveTab("main");
-                                        return;
                                     }
-                                    const updated = await bwClient.updateSecret(cipher.id, cipher);
-                                    const collectionsChanged = originalCollections.length !== newCollections.length ||
-                                        originalCollections.some((id) => !newCollections.includes(id));
-                                    if (collectionsChanged) {
-                                        await bwClient.updateCollections(cipher.id, newCollections);
+                                    catch (e) {
+                                        showStatusMessage("Delete error", "error");
                                     }
-                                    if (!updated && !collectionsChanged) {
-                                        showStatusMessage("Nothing to save");
-                                        return;
+                                }, onSave: async (cipher) => {
+                                    showStatusMessage("Saving...");
+                                    if (detailMode === "new") {
+                                        try {
+                                            if (cipher.organizationId && !cipher.collectionIds?.length) {
+                                                showStatusMessage("Select at least one collection", "error");
+                                                return;
+                                            }
+                                            await bwClient.createSecret(cipher);
+                                            fetchSync();
+                                            showStatusMessage("Saved!", "success");
+                                            setDetailMode("view");
+                                            setFocusedComponent("list");
+                                            setActiveTab("main");
+                                        }
+                                        catch (e) {
+                                            showStatusMessage("Synchronization error", "error");
+                                        }
+                                    }
+                                    else {
+                                        try {
+                                            const original = sync?.ciphers.find((c) => c.id === cipher.id);
+                                            const originalOrgId = original?.organizationId ?? null;
+                                            const originalCollections = original?.collectionIds ?? [];
+                                            const newCollections = [...cipher.collectionIds ?? []];
+                                            // Sharing: personal cipher being assigned to an org
+                                            if (!originalOrgId && cipher.organizationId) {
+                                                if (!newCollections.length) {
+                                                    showStatusMessage("Select at least one collection to share", "error");
+                                                    return;
+                                                }
+                                                await bwClient.shareCipher(cipher.id, cipher, newCollections);
+                                                fetchSync();
+                                                showStatusMessage("Shared!", "success");
+                                                setFocusedComponent("list");
+                                                setActiveTab("main");
+                                                return;
+                                            }
+                                            const updated = await bwClient.updateSecret(cipher.id, cipher);
+                                            const collectionsChanged = originalCollections.length !== newCollections.length ||
+                                                originalCollections.some((id) => !newCollections.includes(id));
+                                            if (collectionsChanged) {
+                                                await bwClient.updateCollections(cipher.id, newCollections);
+                                            }
+                                            if (!updated && !collectionsChanged) {
+                                                showStatusMessage("Nothing to save");
+                                                return;
+                                            }
+                                            fetchSync();
+                                            showStatusMessage("Saved!", "success");
+                                            setFocusedComponent("list");
+                                            setActiveTab("main");
+                                        }
+                                        catch (e) {
+                                            showStatusMessage("Synchronization error", "error");
+                                        }
                                     }
-                                    fetchSync();
-                                    showStatusMessage("Saved!", "success");
-                                    setFocusedComponent("list");
-                                    setActiveTab("main");
-                                }
-                                catch (e) {
-                                    showStatusMessage("Synchronization error", "error");
-                                }
-                            }
-                        } })] }), _jsx(HelpBar, { focus: focusedComponent, cipher: selectedCipher, mode: detailMode })] }));
+                                } })] }), _jsx(HelpBar, { focus: focusedComponent, cipher: selectedCipher, mode: detailMode })] }))] }));
 }

package/dist/dashboard/KeybindingsView.d.ts

@@ -0,0 +1,5 @@
+type Props = {
+    onClose: () => void;
+};
+export declare function KeybindingsView({ onClose }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/dashboard/KeybindingsView.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useInput, useStdout } from "ink";
+import { useState } from "react";
+import { primary } from "../theme/style.js";
+import { DEFAULT_KEYBINDINGS, KEYBINDING_LABELS, KEYBINDING_ORDER, captureBinding, displayBinding, useKeybindings, } from "../hooks/keybindings.js";
+export function KeybindingsView({ onClose }) {
+    const { keybindings, updateKeybindings } = useKeybindings();
+    const { stdout } = useStdout();
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const [capturing, setCapturing] = useState(false);
+    const [capturingId, setCapturingId] = useState(null);
+    const [justReset, setJustReset] = useState(false);
+    // Total items: all bindings + "Reset to defaults" row
+    const totalItems = KEYBINDING_ORDER.length + 1;
+    const isResetSelected = selectedIndex === KEYBINDING_ORDER.length;
+    // How many list rows can fit on screen (leave room for header, hints, reset row)
+    const maxVisible = Math.max(stdout.rows - 10, 5);
+    const [offset, setOffset] = useState(0);
+    useInput(async (input, key) => {
+        if (capturing) {
+            // Bare Escape cancels capture without saving
+            if (key.escape && !key.ctrl && !key.shift && !key.meta) {
+                setCapturing(false);
+                setCapturingId(null);
+                return;
+            }
+            const binding = captureBinding(input, key);
+            if (binding && capturingId) {
+                await updateKeybindings({ ...keybindings, [capturingId]: binding });
+                setCapturing(false);
+                setCapturingId(null);
+            }
+            return;
+        }
+        if (key.upArrow) {
+            const newIndex = Math.max(0, selectedIndex - 1);
+            setSelectedIndex(newIndex);
+            if (newIndex < offset)
+                setOffset(newIndex);
+            return;
+        }
+        if (key.downArrow) {
+            const newIndex = Math.min(totalItems - 1, selectedIndex + 1);
+            setSelectedIndex(newIndex);
+            if (newIndex >= offset + maxVisible)
+                setOffset(newIndex - maxVisible + 1);
+            return;
+        }
+        if (key.escape) {
+            onClose();
+            return;
+        }
+        if (key.return) {
+            if (isResetSelected) {
+                await updateKeybindings({ ...DEFAULT_KEYBINDINGS });
+                setJustReset(true);
+                setTimeout(() => setJustReset(false), 1500);
+                return;
+            }
+            const id = KEYBINDING_ORDER[selectedIndex];
+            if (id) {
+                setCapturingId(id);
+                setCapturing(true);
+            }
+        }
+    });
+    const visibleBindings = KEYBINDING_ORDER.slice(offset, offset + maxVisible);
+    return (_jsxs(Box, { flexDirection: "column", flexGrow: 1, borderStyle: "round", borderColor: primary, paddingX: 2, paddingY: 1, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { bold: true, color: primary, children: "Keybindings" }) }), _jsx(Box, { marginBottom: 1, children: _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "\u2191/\u2193" }), " Navigate  ", _jsx(Text, { bold: true, children: "Enter" }), " Edit  ", _jsx(Text, { bold: true, children: "Esc" }), " Close"] }) }), _jsxs(Box, { paddingX: 1, marginBottom: 1, children: [_jsx(Box, { width: 36, children: _jsx(Text, { color: "#9f9f9f", bold: true, children: "Action" }) }), _jsx(Text, { color: "#9f9f9f", bold: true, children: "Binding" })] }), visibleBindings.map((id, visibleIdx) => {
+                const actualIndex = visibleIdx + offset;
+                const isSelected = selectedIndex === actualIndex;
+                const isEditing = capturing && capturingId === id;
+                const binding = keybindings[id];
+                return (_jsxs(Box, { paddingX: 1, children: [_jsx(Box, { width: 2, flexShrink: 0, children: _jsx(Text, { color: isSelected ? primary : "#9f9f9f", children: isSelected ? "▶" : " " }) }), _jsx(Box, { width: 34, flexShrink: 0, children: _jsx(Text, { color: isSelected ? "white" : "default", wrap: "truncate", children: KEYBINDING_LABELS[id] }) }), _jsx(Text, { color: isEditing ? "yellow" : isSelected ? primary : "#9f9f9f", children: isEditing ? "Press new key..." : displayBinding(binding) })] }, id));
+            }), KEYBINDING_ORDER.length > maxVisible && (_jsx(Box, { paddingX: 3, children: _jsx(Text, { color: "#9f9f9f", children: offset + maxVisible < KEYBINDING_ORDER.length ? "▼ more" : "" }) })), selectedIndex >= offset + maxVisible - 1 ||
+                isResetSelected ||
+                KEYBINDING_ORDER.length <= maxVisible ? (_jsxs(Box, { paddingX: 1, marginTop: 1, children: [_jsx(Box, { width: 2, flexShrink: 0, children: _jsx(Text, { color: isResetSelected ? primary : "#9f9f9f", children: isResetSelected ? "▶" : " " }) }), _jsx(Text, { color: isResetSelected ? "white" : "#9f9f9f", children: justReset ? "Reset done!" : "Reset to defaults" })] })) : null] }));
+}

package/dist/dashboard/components/HelpBar.js

@@ -1,34 +1,37 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { Box, Text } from "ink";
 import { CipherType } from "../../clients/bw.js";
+import { displayBinding, useKeybindings } from "../../hooks/keybindings.js";
 export function HelpBar({ focus, cipher, mode, }) {
-    return (_jsxs(Box, { borderStyle: "single", borderColor: "#9f9f9f", marginTop: 1, paddingX: 1, flexShrink: 0, justifyContent: "space-around", children: [_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "/ " }), "Search"] }), focus === "list" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "\u2191/\u2193 " }), "Navigate"] })) : focus === "detail" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Tab/Enter " }), "Next Field"] })) : (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Esc " }), "Clear Search"] })), focus === "list" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Tab/Enter " }), "Select"] })) : focus === "detail" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Esc " }), "Focus List"] })) : (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Tab/Enter " }), "Focus List"] })), mode !== "new" && (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+n " }), "New"] })), ...copyButtons(focus, cipher), _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+w " }), "Logout"] })] }));
+    const { keybindings } = useKeybindings();
+    const kb = keybindings;
+    return (_jsxs(Box, { borderStyle: "single", borderColor: "#9f9f9f", marginTop: 1, paddingX: 1, flexShrink: 0, justifyContent: "space-around", children: [_jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.focusSearch), " "] }), "Search"] }), focus === "list" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "\u2191/\u2193 " }), "Navigate"] })) : focus === "detail" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Tab/Enter " }), "Next Field"] })) : (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Esc " }), "Clear Search"] })), focus === "list" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Tab/Enter " }), "Select"] })) : focus === "detail" ? (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Esc " }), "Focus List"] })) : (_jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Tab/Enter " }), "Focus List"] })), mode !== "new" && (_jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.newCipher), " "] }), "New"] })), ...copyButtons(focus, cipher, kb), _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.logout), " "] }), "Logout"] })] }));
 }
-const copyButtons = (focus, cipher) => {
+const copyButtons = (focus, cipher, kb) => {
     if (focus === "detail") {
         return [
-            _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+y " }), "Copy Field"] }),
+            _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.copyField), " "] }), "Copy Field"] }),
         ];
     }
     switch (cipher?.type) {
         case CipherType.Login:
             return [
-                _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+y " }), "Copy Password"] }, "copy-password"),
+                _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.copyPrimary), " "] }), "Copy Password"] }, "copy-password"),
                 ...(cipher.login?.totp
                     ? [
-                        _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+t " }), "Copy TOTP"] }, "copy-totp"),
+                        _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.copyTotp), " "] }), "Copy TOTP"] }, "copy-totp"),
                     ]
                     : []),
-                _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+u " }), "Copy Username"] }, "copy-username"),
+                _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.copySecondary), " "] }), "Copy Username"] }, "copy-username"),
             ];
         case CipherType.SecureNote:
             return [
-                _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+y " }), "Copy Note"] }, "copy-note"),
+                _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.copyPrimary), " "] }), "Copy Note"] }, "copy-note"),
             ];
         case CipherType.SSHKey:
             return [
-                _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+y " }), "Copy Private Key"] }, "copy-private-key"),
-                _jsxs(Text, { color: "#9f9f9f", children: [_jsx(Text, { bold: true, children: "Ctrl+u " }), "Copy Public Key"] }, "copy-public-key"),
+                _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.copyPrimary), " "] }), "Copy Private Key"] }, "copy-private-key"),
+                _jsxs(Text, { color: "#9f9f9f", children: [_jsxs(Text, { bold: true, children: [displayBinding(kb.copySecondary), " "] }), "Copy Public Key"] }, "copy-public-key"),
             ];
         default:
             return [];

package/dist/dashboard/components/VaultList.js

@@ -7,6 +7,7 @@ import clipboard from "clipboardy";
 import { useStatusMessage } from "../../hooks/status-message.js";
 import { useRef } from "react";
 import { useMouseTarget } from "../../hooks/use-mouse.js";
+import { matchBinding, useKeybindings } from "../../hooks/keybindings.js";
 const getTypeIcon = (type) => {
     switch (type) {
         case CipherType.Login:
@@ -24,6 +25,7 @@ const getTypeIcon = (type) => {
 export function VaultList({ filteredCiphers, isFocused, selected, onSelect, }) {
     const { stdout } = useStdout();
     const { showStatusMessage } = useStatusMessage();
+    const { keybindings } = useKeybindings();
     const boxRef = useRef(null);
     const scrollOffsetRef = useRef(0);
     useMouseTarget("list", boxRef, {
@@ -40,7 +42,7 @@ export function VaultList({ filteredCiphers, isFocused, selected, onSelect, }) {
         const cipher = selected !== null ? filteredCiphers[selected] : null;
         let field;
         let fldName;
-        if (key.ctrl && input === "y") {
+        if (matchBinding(input, key, keybindings.copyPrimary)) {
             switch (cipher?.type) {
                 case CipherType.Login:
                     field = cipher.login?.password;
@@ -56,7 +58,7 @@ export function VaultList({ filteredCiphers, isFocused, selected, onSelect, }) {
                     break;
             }
         }
-        else if (key.ctrl && input === "u") {
+        else if (matchBinding(input, key, keybindings.copySecondary)) {
             switch (cipher?.type) {
                 case CipherType.Login:
                     field = cipher.login?.username;
@@ -68,7 +70,7 @@ export function VaultList({ filteredCiphers, isFocused, selected, onSelect, }) {
                     break;
             }
         }
-        else if (key.ctrl && input === "t") {
+        else if (matchBinding(input, key, keybindings.copyTotp)) {
             if (cipher?.type === CipherType.Login) {
                 field = cipher.login?.currentTotp;
                 fldName = "TOTP";

package/dist/hooks/keybindings.d.ts

@@ -0,0 +1,34 @@
+import { type ReactNode } from "react";
+import type { Key } from "ink";
+export type KeybindingId = "logout" | "nextTab" | "prevTab" | "focusSearch" | "newCipher" | "copyPrimary" | "copySecondary" | "copyTotp" | "copyField" | "cursorEnd" | "cursorStart" | "openKeybindings" | "refresh";
+export interface KeyBinding {
+    ctrl?: boolean;
+    shift?: boolean;
+    meta?: boolean;
+    key: string;
+}
+export type KeybindingsMap = Record<KeybindingId, KeyBinding>;
+export declare const KEYBINDING_LABELS: Record<KeybindingId, string>;
+export declare const KEYBINDING_ORDER: KeybindingId[];
+export declare const DEFAULT_KEYBINDINGS: KeybindingsMap;
+export declare function loadKeybindings(): Promise<KeybindingsMap>;
+export declare function saveKeybindings(keybindings: KeybindingsMap): Promise<void>;
+export declare function displayBinding(binding: KeyBinding): string;
+/**
+ * Capture a key combination from raw Ink input.
+ * Returns null if the combination should not be captured (Ctrl+C, Ctrl+Z, bare Escape).
+ */
+export declare function captureBinding(input: string, key: Key): KeyBinding | null;
+/**
+ * Returns true if the given (input, key) pair matches the binding.
+ */
+export declare function matchBinding(input: string, key: Key, binding: KeyBinding): boolean;
+interface KeybindingsContextValue {
+    keybindings: KeybindingsMap;
+    updateKeybindings: (newBindings: KeybindingsMap) => Promise<void>;
+}
+export declare function KeybindingsProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useKeybindings(): KeybindingsContextValue;
+export {};

package/dist/hooks/keybindings.js

@@ -0,0 +1,202 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import os from "os";
+import fs from "fs";
+import path from "path";
+import { createContext, useContext, useState, useEffect, } from "react";
+export const KEYBINDING_LABELS = {
+    logout: "Logout",
+    nextTab: "Next Tab",
+    prevTab: "Previous Tab",
+    focusSearch: "Focus Search",
+    newCipher: "New Cipher",
+    copyPrimary: "Copy Primary (Password/Note/Key)",
+    copySecondary: "Copy Secondary (Username/Pub Key)",
+    copyTotp: "Copy TOTP",
+    copyField: "Copy Field (in editor)",
+    cursorEnd: "Cursor to End",
+    cursorStart: "Cursor to Start",
+    openKeybindings: "Open Keybindings",
+    refresh: "Refresh Vault",
+};
+export const KEYBINDING_ORDER = [
+    "logout",
+    "nextTab",
+    "prevTab",
+    "focusSearch",
+    "newCipher",
+    "copyPrimary",
+    "copySecondary",
+    "copyTotp",
+    "copyField",
+    "cursorEnd",
+    "cursorStart",
+    "openKeybindings",
+    "refresh",
+];
+export const DEFAULT_KEYBINDINGS = {
+    logout: { ctrl: true, key: "w" },
+    nextTab: { shift: true, key: "rightArrow" },
+    prevTab: { shift: true, key: "leftArrow" },
+    focusSearch: { key: "/" },
+    newCipher: { ctrl: true, key: "n" },
+    copyPrimary: { ctrl: true, key: "y" },
+    copySecondary: { ctrl: true, key: "u" },
+    copyTotp: { ctrl: true, key: "t" },
+    copyField: { ctrl: true, key: "y" },
+    cursorEnd: { ctrl: true, key: "e" },
+    cursorStart: { ctrl: true, key: "a" },
+    openKeybindings: { ctrl: true, key: "k" },
+    refresh: { ctrl: true, key: "r" },
+};
+const configDir = path.join(os.homedir(), ".config", "bitty");
+const keybindsPath = path.join(configDir, "keybinds.json");
+export async function loadKeybindings() {
+    try {
+        if (fs.existsSync(keybindsPath)) {
+            const content = await fs.promises.readFile(keybindsPath, "utf-8");
+            const overrides = JSON.parse(content);
+            return { ...DEFAULT_KEYBINDINGS, ...overrides };
+        }
+    }
+    catch { }
+    return { ...DEFAULT_KEYBINDINGS };
+}
+export async function saveKeybindings(keybindings) {
+    const overrides = {};
+    for (const [id, binding] of Object.entries(keybindings)) {
+        const def = DEFAULT_KEYBINDINGS[id];
+        if (JSON.stringify(binding) !== JSON.stringify(def)) {
+            overrides[id] = binding;
+        }
+    }
+    await fs.promises.mkdir(configDir, { recursive: true });
+    await fs.promises.writeFile(keybindsPath, JSON.stringify(overrides, null, 2));
+}
+const SPECIAL_KEY_DISPLAY = {
+    upArrow: "↑",
+    downArrow: "↓",
+    leftArrow: "←",
+    rightArrow: "→",
+    escape: "Esc",
+    return: "Enter",
+    tab: "Tab",
+    backspace: "Backspace",
+    delete: "Delete",
+    pageUp: "PgUp",
+    pageDown: "PgDn",
+    space: "Space",
+};
+export function displayBinding(binding) {
+    const parts = [];
+    if (binding.ctrl)
+        parts.push("Ctrl");
+    if (binding.shift)
+        parts.push("Shift");
+    if (binding.meta)
+        parts.push("Meta");
+    const keyDisplay = SPECIAL_KEY_DISPLAY[binding.key] ?? binding.key.toUpperCase();
+    parts.push(keyDisplay);
+    return parts.join("+");
+}
+/**
+ * Capture a key combination from raw Ink input.
+ * Returns null if the combination should not be captured (Ctrl+C, Ctrl+Z, bare Escape).
+ */
+export function captureBinding(input, key) {
+    // Never capture Ctrl+C or Ctrl+Z (terminal signals)
+    if (key.ctrl && (input === "c" || input === "z"))
+        return null;
+    // Bare Escape is used to cancel capture mode
+    if (key.escape && !key.ctrl && !key.shift && !key.meta)
+        return null;
+    let keyName;
+    if (key.upArrow)
+        keyName = "upArrow";
+    else if (key.downArrow)
+        keyName = "downArrow";
+    else if (key.leftArrow)
+        keyName = "leftArrow";
+    else if (key.rightArrow)
+        keyName = "rightArrow";
+    else if (key.return)
+        keyName = "return";
+    else if (key.tab)
+        keyName = "tab";
+    else if (key.backspace)
+        keyName = "backspace";
+    else if (key.delete)
+        keyName = "delete";
+    else if (key.pageUp)
+        keyName = "pageUp";
+    else if (key.pageDown)
+        keyName = "pageDown";
+    else if (input === " ")
+        keyName = "space";
+    else if (input)
+        keyName = input.toLowerCase();
+    else
+        return null;
+    return {
+        ctrl: key.ctrl || undefined,
+        shift: key.shift || undefined,
+        meta: key.meta || undefined,
+        key: keyName,
+    };
+}
+/**
+ * Returns true if the given (input, key) pair matches the binding.
+ */
+export function matchBinding(input, key, binding) {
+    if (!!binding.ctrl !== !!key.ctrl)
+        return false;
+    if (!!binding.shift !== !!key.shift)
+        return false;
+    if (!!binding.meta !== !!key.meta)
+        return false;
+    switch (binding.key) {
+        case "upArrow":
+            return !!key.upArrow;
+        case "downArrow":
+            return !!key.downArrow;
+        case "leftArrow":
+            return !!key.leftArrow;
+        case "rightArrow":
+            return !!key.rightArrow;
+        case "escape":
+            return !!key.escape;
+        case "return":
+            return !!key.return;
+        case "tab":
+            return !!key.tab;
+        case "backspace":
+            return !!key.backspace;
+        case "delete":
+            return !!key.delete;
+        case "pageUp":
+            return !!key.pageUp;
+        case "pageDown":
+            return !!key.pageDown;
+        case "space":
+            return input === " ";
+        default:
+            return input === binding.key;
+    }
+}
+const KeybindingsContext = createContext({
+    keybindings: DEFAULT_KEYBINDINGS,
+    updateKeybindings: async () => { },
+});
+export function KeybindingsProvider({ children }) {
+    const [keybindings, setKeybindings] = useState(DEFAULT_KEYBINDINGS);
+    useEffect(() => {
+        loadKeybindings().then(setKeybindings);
+    }, []);
+    const updateKeybindings = async (newBindings) => {
+        await saveKeybindings(newBindings);
+        setKeybindings(newBindings);
+    };
+    return (_jsx(KeybindingsContext.Provider, { value: { keybindings, updateKeybindings }, children: children }));
+}
+export function useKeybindings() {
+    return useContext(KeybindingsContext);
+}

package/dist/hooks/use-mouse.js

@@ -21,6 +21,8 @@ function getAbsolutePosition(node) {
     return { x, y };
 }
 export const MouseProvider = ({ children, }) => {
+    // ink 7 removed internal_eventEmitter from PublicProps type, but it is still
+    // present at runtime inside the StdinContext. Cast through unknown to access it.
     const { internal_eventEmitter } = useStdin();
     const { focus } = useFocusManager();
     const targetsRef = useRef(new Map());

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bitty-tui",
-  "version": "0.0.22",
+  "version": "0.1.0",
   "license": "MIT",
   "repository": "https://github.com/mceck/bitty",
   "keywords": [
@@ -17,7 +17,7 @@
   },
   "type": "module",
   "engines": {
-    "node": ">=16"
+    "node": ">=22"
   },
   "scripts": {
     "build": "tsc",
@@ -32,18 +32,18 @@
     "argon2": "^0.44.0",
     "chalk": "^5.6.2",
     "clipboardy": "^5.3.1",
-    "ink": "^6.8.0",
+    "ink": "^7.0.1",
     "otplib": "^13.4.0",
     "react": "^19.2.5",
     "read-package-up": "^12.0.0"
   },
   "devDependencies": {
     "@sindresorhus/tsconfig": "^8.1.0",
-    "@types/node": "^24.12.2",
+    "@types/node": "^25.6.0",
     "@types/react": "^19.2.14",
     "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
     "ink-testing-library": "^4.0.0",
-    "typescript": "^5.9.3"
+    "typescript": "^6.0.3"
   }
 }

package/readme.md

@@ -23,6 +23,12 @@ Works also with Vaultwarden.
 
 If you check "Remember me" during login, your vault encryption keys will be stored in plain text in your home folder (`$HOME/.config/bitty/config.json`). Use this option only if you are the only user of your machine.
 
+## Custom keybindings
+
+Click the **⚙** button in the toolbar, or press `Ctrl+K`, to open the keybindings editor. Use `↑`/`↓` to select an action, `Enter` to capture a new key combination, and `Esc` to close.
+
+Overrides are saved to `~/.config/bitty/keybinds.json` and merged with the defaults on startup. Delete the file (or use "Reset to defaults" inside the editor) to go back to the defaults.
+
 
 ## Acknowledgments
 - [Bitwarden whitepaper](https://bitwarden.com/help/bitwarden-security-white-paper)