bitty-tui 0.0.7 → 0.0.8

package/dist/components/ScrollView.js

@@ -25,7 +25,7 @@ export const ScrollView = ({ count, list, isActive, selectedIndex, onSelect, onS
     }, { isActive });
     useEffect(() => {
         if (selectedIndex < offset)
-            setOffset(selectedIndex);
+            setOffset(selectedIndex > 0 ? selectedIndex : 0);
     }, [selectedIndex]);
     return (_jsx(Box, { flexDirection: "column", overflow: "hidden", children: list.slice(offset, offset + count).map((el, index) => children({
             el,

package/dist/dashboard/DashboardView.js

@@ -37,16 +37,14 @@ export function DashboardView({ onLogout }) {
     const listIndex = useMemo(() => {
         if (!listSelected)
             return 0;
-        return filteredCiphers.findIndex((c) => c.id === listSelected.id);
+        const i = filteredCiphers.findIndex((c) => c.id === listSelected.id);
+        return i < 0 ? 0 : i;
     }, [listSelected, filteredCiphers]);
     const selectedCipher = detailMode === "new" ? editedCipher : filteredCiphers[listIndex];
     const logout = async () => {
         await clearConfig();
         onLogout();
     };
-    useEffect(() => {
-        setListSelected(null);
-    }, [searchQuery]);
     useEffect(() => {
         setSyncState(sync);
     }, [sync]);
@@ -104,7 +102,7 @@ export function DashboardView({ onLogout }) {
     return (_jsxs(Box, { flexDirection: "column", width: "100%", height: stdout.rows - 1, children: [_jsx(Box, { borderStyle: "double", borderColor: primary, paddingX: 2, justifyContent: "center", flexShrink: 0, children: _jsx(Text, { bold: true, color: primary, children: "BiTTY" }) }), _jsxs(Box, { 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();
-                            } }) }), statusMessage && (_jsx(Box, { width: "60%", padding: 1, children: _jsx(Text, { color: statusMessageColor, children: statusMessage }) }))] }), _jsxs(Box, { minHeight: 20, flexGrow: 1, children: [_jsx(VaultList, { filteredCiphers: filteredCiphers, isFocused: focusedComponent === "list", selected: listIndex, onSelect: (index) => setListSelected(filteredCiphers[index] || null) }), _jsx(CipherDetail, { selectedCipher: showDetails ? selectedCipher : null, mode: detailMode, isFocused: focusedComponent === "detail", onChange: (cipher) => {
+                            } }) }), statusMessage && (_jsx(Box, { width: "60%", padding: 1, children: _jsx(Text, { color: statusMessageColor, children: statusMessage }) }))] }), _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, isFocused: focusedComponent === "detail", onChange: (cipher) => {
                             if (detailMode === "new") {
                                 setEditedCipher(cipher);
                                 return;
@@ -140,5 +138,5 @@ export function DashboardView({ onLogout }) {
                                     showStatusMessage("Synchronization error", "error");
                                 }
                             }
-                        } })] }), _jsx(HelpBar, { focus: focusedComponent })] }));
+                        } })] }), _jsx(HelpBar, { focus: focusedComponent, cipher: selectedCipher })] }));
 }

package/dist/dashboard/components/HelpBar.d.ts

@@ -1,3 +1,5 @@
-export declare function HelpBar({ focus }: {
+import { Cipher } from "../../clients/bw.js";
+export declare function HelpBar({ focus, cipher, }: {
     focus: "list" | "search" | "detail";
+    cipher: Cipher | null | undefined;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/dashboard/components/HelpBar.js

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

package/dist/dashboard/components/VaultList.js

@@ -23,12 +23,45 @@ export function VaultList({ filteredCiphers, isFocused, selected, onSelect, }) {
     const { stdout } = useStdout();
     const { showStatusMessage } = useStatusMessage();
     useInput((input, key) => {
+        const cipher = selected !== null ? filteredCiphers[selected] : null;
+        let field, fldName;
         if (key.ctrl && input === "y") {
-            clipboard.writeSync(filteredCiphers[selected ?? 0]?.login?.password ||
-                filteredCiphers[selected ?? 0]?.notes ||
-                filteredCiphers[selected ?? 0]?.name ||
-                "");
-            showStatusMessage("📋 Copied to clipboard!", "success");
+            switch (cipher?.type) {
+                case CipherType.Login:
+                    field = cipher.login?.password;
+                    fldName = "Password";
+                    break;
+                case CipherType.SecureNote:
+                    field = cipher.notes;
+                    fldName = "Note";
+                    break;
+                case CipherType.SSHKey:
+                    field = cipher.sshKey?.privateKey;
+                    fldName = "Private Key";
+                    break;
+            }
+        }
+        else if (key.ctrl && input === "u") {
+            switch (cipher?.type) {
+                case CipherType.Login:
+                    field = cipher.login?.username;
+                    fldName = "Username";
+                    break;
+                case CipherType.SSHKey:
+                    field = cipher.sshKey?.publicKey;
+                    fldName = "Public Key";
+                    break;
+            }
+        }
+        else if (key.ctrl && input === "t") {
+            if (cipher?.type === CipherType.Login) {
+                field = cipher.login?.totp;
+                fldName = "TOTP";
+            }
+        }
+        if (field) {
+            clipboard.writeSync(field);
+            showStatusMessage(`📋 Copied ${fldName} to clipboard!`, "success");
         }
     }, { isActive: isFocused });
     return (_jsx(Box, { flexDirection: "column", width: "40%", borderStyle: "round", borderColor: isFocused ? primaryLight : "gray", borderRightColor: "gray", paddingX: 1, overflow: "hidden", children: _jsx(ScrollView, { isActive: isFocused, count: Math.max(stdout.rows - 14, 20), list: filteredCiphers, selectedIndex: selected ?? 0, onSelect: onSelect, children: ({ el: cipher, selected }) => (_jsxs(Box, { justifyContent: "space-between", backgroundColor: selected ? (isFocused ? primary : primaryDark) : "", children: [_jsxs(Box, { children: [_jsxs(Text, { children: [getTypeIcon(cipher.type), " "] }), _jsx(Text, { color: selected && isFocused ? "white" : "default", wrap: "truncate", children: cipher.name })] }), cipher.favorite && _jsx(Text, { color: "yellow", children: "\u2605" })] }, cipher.id)) }) }));

package/dist/login/LoginView.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text, useFocusManager, useStdout } from "ink";
+import { Box, Text, useFocusManager, useInput, useStdout } from "ink";
 import { useEffect, useState } from "react";
 import { TextInput } from "../components/TextInput.js";
 import { Button } from "../components/Button.js";
@@ -27,8 +27,16 @@ export function LoginView({ onLogin }) {
     const [askMfa, setAskMfa] = useState(null);
     const [rememberMe, setRememberMe] = useState(false);
     const { stdout } = useStdout();
-    const { focusNext } = useFocusManager();
+    const { focusNext, focusPrevious } = useFocusManager();
     const { statusMessage, statusMessageColor, showStatusMessage } = useStatusMessage();
+    useInput(async (_, key) => {
+        if (key.upArrow) {
+            focusPrevious();
+        }
+        else if (key.downArrow) {
+            focusNext();
+        }
+    }, { isActive: !loading });
     const handleLogin = async () => {
         try {
             if (!email?.length || !password?.length) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bitty-tui",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "license": "MIT",
   "repository": "https://github.com/mceck/bitty",
   "keywords": [

package/readme.md

@@ -19,8 +19,8 @@ If you check "Remember me" during login, your vault encryption keys will be stor
 
 ## TODO
 
-- Implement Argon2 key derivation
 - Collections support
+- Implement Fido, Duo MFA support
 - Handle more fields editing
 - Handle creating different cipher types