bitty-tui 0.0.17 → 0.0.19

package/dist/cli.js

@@ -3,6 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { render } from "ink";
 import App from "./app.js";
 import { StatusMessageProvider } from "./hooks/status-message.js";
+import { MouseProvider } from "./hooks/use-mouse.js";
 import { readPackageUpSync } from "read-package-up";
 import { art } from "./theme/art.js";
 import path from "node:path";
@@ -26,4 +27,4 @@ if (args.includes("--help") || args.includes("-h")) {
 `);
     process.exit(0);
 }
-render(_jsx(StatusMessageProvider, { children: _jsx(App, {}) }));
+render(_jsx(StatusMessageProvider, { children: _jsx(MouseProvider, { children: _jsx(App, {}) }) }));

package/dist/clients/bw.d.ts

@@ -45,7 +45,7 @@ export interface Cipher {
     type: CipherType;
     key?: string | null;
     folderId?: string | null;
-    organizationId: string | null;
+    organizationId?: string | null;
     collectionIds?: string[] | null;
     deletedDate: string | null;
     name: string;
@@ -63,6 +63,14 @@ export interface Cipher {
         totp?: string | null;
         currentTotp?: string | null;
     };
+    card?: {
+        cardholderName: string | null;
+        brand: string | null;
+        number: string | null;
+        expMonth: string | null;
+        expYear: string | null;
+        code: string | null;
+    };
     identity?: {
         address1: string | null;
         address2: string | null;
@@ -94,6 +102,12 @@ export interface Cipher {
         type: number;
     }[];
 }
+export interface Collection {
+    id: string;
+    organizationId: string;
+    name: string;
+    readOnly: boolean;
+}
 export type CipherDto = Omit<Cipher, "id" | "data">;
 export declare enum KdfType {
     PBKDF2 = 0,
@@ -101,6 +115,7 @@ export declare enum KdfType {
 }
 export interface SyncResponse {
     ciphers: Cipher[];
+    collections?: Collection[];
     profile?: {
         organizations?: {
             id: string;
@@ -184,6 +199,9 @@ export declare class Client {
     createSecret(obj: CipherDto): Promise<any>;
     objectDiff(obj1: any, obj2: any): any;
     updateSecret(id: string, patch: Partial<CipherDto>): Promise<any>;
+    deleteSecret(id: string): Promise<void>;
+    shareCipher(id: string, cipher: Partial<CipherDto>, collectionIds: string[]): Promise<any>;
+    updateCollections(id: string, collectionIds: string[]): Promise<any>;
     encrypt(value: string | null, key?: any): string;
     decrypt(value: string | null | undefined, key?: any): string | null | undefined;
     encryptCipher(obj: Partial<CipherDto>, key?: any): {
@@ -208,6 +226,14 @@ export declare class Client {
             totp?: string | null;
             currentTotp?: string | null;
         } | undefined;
+        card?: {
+            cardholderName: string | null;
+            brand: string | null;
+            number: string | null;
+            expMonth: string | null;
+            expYear: string | null;
+            code: string | null;
+        } | undefined;
         identity?: {
             address1: string | null;
             address2: string | null;

package/dist/clients/bw.js

@@ -504,6 +504,13 @@ export class Client {
         }
         this.decryptedSyncCache = {
             ...this.syncCache,
+            collections: this.syncCache.collections?.map((col) => {
+                const orgKey = this.orgKeys[col.organizationId];
+                return {
+                    ...col,
+                    name: orgKey ? this.decrypt(col.name, orgKey) ?? col.name : col.name,
+                };
+            }),
             ciphers: this.syncCache.ciphers.map((cipher) => {
                 const key = this.getDecryptionKey(cipher);
                 const ret = JSON.parse(JSON.stringify(cipher));
@@ -555,6 +562,17 @@ export class Client {
                             this.decrypt(cipher.identity.username, key),
                     };
                 }
+                if (cipher.card) {
+                    ret.card = {
+                        cardholderName: cipher.card.cardholderName &&
+                            this.decrypt(cipher.card.cardholderName, key),
+                        brand: cipher.card.brand && this.decrypt(cipher.card.brand, key),
+                        number: cipher.card.number && this.decrypt(cipher.card.number, key),
+                        expMonth: cipher.card.expMonth && this.decrypt(cipher.card.expMonth, key),
+                        expYear: cipher.card.expYear && this.decrypt(cipher.card.expYear, key),
+                        code: cipher.card.code && this.decrypt(cipher.card.code, key),
+                    };
+                }
                 if (cipher.sshKey) {
                     ret.sshKey = {
                         keyFingerprint: cipher.sshKey.keyFingerprint &&
@@ -602,13 +620,21 @@ export class Client {
     }
     async createSecret(obj) {
         const key = this.getDecryptionKey(obj);
-        const s = await fetchApi(`${this.apiUrl}/ciphers`, {
+        const encrypted = this.encryptCipher(obj, key);
+        const hasCollections = obj.collectionIds?.length;
+        const url = hasCollections
+            ? `${this.apiUrl}/ciphers/create`
+            : `${this.apiUrl}/ciphers`;
+        const body = hasCollections
+            ? { cipher: encrypted, collectionIds: obj.collectionIds }
+            : encrypted;
+        const s = await fetchApi(url, {
             method: "POST",
             headers: {
                 Authorization: `Bearer ${this.token}`,
                 "Content-Type": "application/json",
             },
-            body: JSON.stringify(this.encryptCipher(obj, key)),
+            body: JSON.stringify(body),
         });
         return s.json();
     }
@@ -661,6 +687,60 @@ export class Client {
         this.syncCache = null;
         return s.json();
     }
+    async deleteSecret(id) {
+        await this.checkToken();
+        await fetchApi(`${this.apiUrl}/ciphers/${id}`, {
+            method: "DELETE",
+            headers: {
+                Authorization: `Bearer ${this.token}`,
+            },
+        });
+        this.decryptedSyncCache = null;
+        this.syncCache = null;
+    }
+    async shareCipher(id, cipher, collectionIds) {
+        if (!collectionIds.length) {
+            throw new Error("At least one collection is required to share a cipher");
+        }
+        await this.getDecryptedSync();
+        const original = this.syncCache?.ciphers.find((c) => c.id === id);
+        if (!original) {
+            throw new Error("Secret not found in cache. Please sync first.");
+        }
+        const key = this.getDecryptionKey(cipher);
+        const encrypted = this.encryptCipher(cipher, key);
+        const data = this.patchObject(original, encrypted);
+        data.data = undefined;
+        await this.checkToken();
+        const s = await fetchApi(`${this.apiUrl}/ciphers/${id}/share`, {
+            method: "PUT",
+            headers: {
+                Authorization: `Bearer ${this.token}`,
+                "Content-Type": "application/json",
+            },
+            body: JSON.stringify({ cipher: data, collectionIds }),
+        });
+        this.decryptedSyncCache = null;
+        this.syncCache = null;
+        return s.json();
+    }
+    async updateCollections(id, collectionIds) {
+        if (!collectionIds.length) {
+            return;
+        }
+        await this.checkToken();
+        const s = await fetchApi(`${this.apiUrl}/ciphers/${id}/collections_v2`, {
+            method: "PUT",
+            headers: {
+                Authorization: `Bearer ${this.token}`,
+                "Content-Type": "application/json",
+            },
+            body: JSON.stringify({ collectionIds }),
+        });
+        this.decryptedSyncCache = null;
+        this.syncCache = null;
+        return s.json();
+    }
     encrypt(value, key) {
         if (!value)
             return value;
@@ -752,6 +832,28 @@ export class Client {
                     : ret.identity.username,
             };
         }
+        if (ret.card) {
+            ret.card = {
+                cardholderName: ret.card.cardholderName
+                    ? this.encrypt(ret.card.cardholderName, key)
+                    : ret.card.cardholderName,
+                brand: ret.card.brand
+                    ? this.encrypt(ret.card.brand, key)
+                    : ret.card.brand,
+                number: ret.card.number
+                    ? this.encrypt(ret.card.number, key)
+                    : ret.card.number,
+                expMonth: ret.card.expMonth
+                    ? this.encrypt(ret.card.expMonth, key)
+                    : ret.card.expMonth,
+                expYear: ret.card.expYear
+                    ? this.encrypt(ret.card.expYear, key)
+                    : ret.card.expYear,
+                code: ret.card.code
+                    ? this.encrypt(ret.card.code, key)
+                    : ret.card.code,
+            };
+        }
         if (ret.login) {
             ret.login = {
                 ...ret.login,
@@ -761,6 +863,9 @@ export class Client {
                 password: ret.login.password
                     ? this.encrypt(ret.login.password, key)
                     : ret.login.password,
+                totp: ret.login.totp
+                    ? this.encrypt(ret.login.totp, key)
+                    : ret.login.totp,
                 uri: ret.login.uri ? this.encrypt(ret.login.uri, key) : ret.login.uri,
                 uris: ret.login.uris?.map((uri) => ({
                     uri: uri.uri ? this.encrypt(uri.uri, key) : uri.uri,

package/dist/components/Button.d.ts

@@ -3,9 +3,10 @@ import { ReactNode } from "react";
 type Props = {
     isActive?: boolean;
     doubleConfirm?: boolean;
+    tripleConfirm?: boolean;
     autoFocus?: boolean;
     onClick: () => void;
     children: ReactNode;
 } & React.ComponentProps<typeof Box>;
-export declare const Button: ({ isActive, doubleConfirm, onClick, children, autoFocus, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const Button: ({ isActive, doubleConfirm, tripleConfirm, onClick, children, autoFocus, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Button.js

@@ -1,24 +1,47 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Text, Box, useFocus, useInput } from "ink";
-import { useRef, useState } from "react";
+import { useId, useRef, useState } from "react";
 import { primary } from "../theme/style.js";
-export const Button = ({ isActive = true, doubleConfirm, onClick, children, autoFocus = false, ...props }) => {
-    const { isFocused } = useFocus({ autoFocus: autoFocus });
+import { useMouseTarget } from "../hooks/use-mouse.js";
+export const Button = ({ isActive = true, doubleConfirm, tripleConfirm, onClick, children, autoFocus = false, ...props }) => {
+    const generatedId = useId();
+    const { isFocused } = useFocus({ id: generatedId, autoFocus: autoFocus });
     const [askConfirm, setAskConfirm] = useState(false);
+    const [ask2Confirm, setAsk2Confirm] = useState(false);
     const timeoutRef = useRef(null);
-    useInput((input, key) => {
-        if (key.return) {
-            if (timeoutRef.current)
-                clearTimeout(timeoutRef.current);
-            if (doubleConfirm && !askConfirm) {
-                setAskConfirm(true);
-                timeoutRef.current = setTimeout(() => setAskConfirm(false), 1000);
-                return;
-            }
-            if (askConfirm)
+    const boxRef = useRef(null);
+    const handlePress = () => {
+        if (timeoutRef.current)
+            clearTimeout(timeoutRef.current);
+        if ((doubleConfirm || tripleConfirm) && !askConfirm) {
+            setAskConfirm(true);
+            timeoutRef.current = setTimeout(() => setAskConfirm(false), 1000);
+            return;
+        }
+        if (tripleConfirm && !ask2Confirm) {
+            setAsk2Confirm(true);
+            timeoutRef.current = setTimeout(() => {
                 setAskConfirm(false);
-            onClick();
+                setAsk2Confirm(false);
+            }, 1000);
+            return;
         }
+        if (askConfirm)
+            setAskConfirm(false);
+        if (ask2Confirm)
+            setAsk2Confirm(false);
+        onClick();
+    };
+    useMouseTarget(generatedId, boxRef, { onClick: handlePress });
+    useInput((input, key) => {
+        if (key.return)
+            handlePress();
     }, { isActive: isFocused && isActive });
-    return (_jsx(Box, { borderStyle: "round", borderColor: isFocused && isActive ? primary : "gray", alignItems: "center", justifyContent: "center", ...props, children: _jsx(Text, { color: isFocused && isActive ? (askConfirm ? "yellow" : "white") : "gray", children: askConfirm ? "Confirm?" : children }) }));
+    return (_jsx(Box, { ref: boxRef, borderStyle: "round", borderColor: isFocused && isActive ? primary : "gray", alignItems: "center", justifyContent: "center", ...props, children: _jsx(Text, { color: isFocused && isActive
+                ? ask2Confirm
+                    ? "red"
+                    : askConfirm
+                        ? "yellow"
+                        : "white"
+                : "gray", children: ask2Confirm ? "Are you sure?" : askConfirm ? "Confirm?" : children }) }));
 };

package/dist/components/Checkbox.js

@@ -1,12 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Text, Box, useFocus, useInput } from "ink";
+import { useId, useRef } from "react";
 import { primary } from "../theme/style.js";
+import { useMouseTarget } from "../hooks/use-mouse.js";
 export const Checkbox = ({ isActive = true, value, label, onToggle, ...props }) => {
-    const { isFocused } = useFocus();
+    const generatedId = useId();
+    const { isFocused } = useFocus({ id: generatedId });
+    const boxRef = useRef(null);
+    useMouseTarget(generatedId, boxRef, {
+        onClick: () => onToggle(!value),
+    });
     useInput((input, key) => {
         if (input === " ") {
             onToggle(!value);
         }
     }, { isActive: isFocused && isActive });
-    return (_jsxs(Box, { ...props, children: [_jsx(Box, { width: 5, height: 3, flexShrink: 0, borderStyle: "round", borderColor: isFocused && isActive ? primary : "gray", children: value && (_jsx(Box, { width: 1, height: 1, marginLeft: 1, children: _jsx(Text, { color: isFocused && isActive ? primary : "gray", children: "X" }) })) }), _jsx(Box, { marginTop: 1, marginLeft: 1, children: _jsx(Text, { children: label }) })] }));
+    return (_jsxs(Box, { ref: boxRef, ...props, children: [_jsx(Box, { width: 5, height: 3, flexShrink: 0, borderStyle: "round", borderColor: isFocused && isActive ? primary : "gray", children: value && (_jsx(Box, { width: 1, height: 1, marginLeft: 1, children: _jsx(Text, { color: isFocused && isActive ? primary : "gray", children: "X" }) })) }), _jsx(Box, { marginTop: 1, marginLeft: 1, children: _jsx(Text, { children: label }) })] }));
 };

package/dist/components/ScrollView.d.ts

@@ -1,11 +1,12 @@
 import { ReactNode } from "react";
-export declare const ScrollView: <T>({ count, list, isActive, selectedIndex, onSelect, onSubmit, children, }: {
+export declare const ScrollView: <T>({ count, list, isActive, selectedIndex, onSelect, onSubmit, offsetRef, children, }: {
     count: number;
     list: T[];
     isActive: boolean;
     selectedIndex: number;
     onSelect?: (position: number) => void;
     onSubmit?: (position: number) => void;
+    offsetRef?: React.MutableRefObject<number>;
     children: (arg: {
         el: T;
         index: number;

package/dist/components/ScrollView.js

@@ -1,8 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Box, useInput } from "ink";
 import { useEffect, useState } from "react";
-export const ScrollView = ({ count, list, isActive, selectedIndex, onSelect, onSubmit, children, }) => {
+export const ScrollView = ({ count, list, isActive, selectedIndex, onSelect, onSubmit, offsetRef, children, }) => {
     const [offset, setOffset] = useState(0);
+    if (offsetRef)
+        offsetRef.current = offset;
     useInput((input, key) => {
         if (key.upArrow) {
             if (selectedIndex === offset && offset > 0) {

package/dist/components/TabButton.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+type Props = {
+    active?: boolean;
+    onClick: () => void;
+    children: ReactNode;
+    borderLess?: boolean;
+};
+export declare const TabButton: ({ active, onClick, children, borderLess }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/TabButton.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Text, Box } from "ink";
+import { useId, useRef } from "react";
+import { primary } from "../theme/style.js";
+import { useMouseTarget } from "../hooks/use-mouse.js";
+export const TabButton = ({ active, onClick, children, borderLess }) => {
+    const id = useId();
+    const boxRef = useRef(null);
+    useMouseTarget(id, boxRef, { onClick });
+    return (_jsx(Box, { ref: boxRef, borderStyle: borderLess ? undefined : "round", borderColor: active ? primary : "gray", alignItems: "center", justifyContent: "center", paddingX: 1, children: _jsx(Text, { color: active ? "white" : "gray", children: children }) }));
+};

package/dist/components/TextInput.js

@@ -1,16 +1,21 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Text, Box, useFocus, useInput, useFocusManager } from "ink";
+import { Text, Box, useFocus, useInput, useFocusManager, } from "ink";
 import { primary } from "../theme/style.js";
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useId, useMemo, useRef, useState } from "react";
 import clipboard from "clipboardy";
 import chalk from "chalk";
 import { useStatusMessage } from "../hooks/status-message.js";
+import { useMouseTarget } from "../hooks/use-mouse.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);
-    const { isFocused } = useFocus({ id, isActive, autoFocus });
+    const generatedId = useId();
+    const effectiveId = id ?? generatedId;
+    const { isFocused } = useFocus({ id: effectiveId, isActive, autoFocus });
     const { showStatusMessage } = useStatusMessage();
     const { focusNext } = useFocusManager();
+    const boxRef = useRef(null);
+    useMouseTarget(effectiveId, boxRef);
     const displayValue = useMemo(() => {
         let displayValue = value;
         if (isPassword && (showPasswordOnFocus ? !isFocused : true)) {
@@ -189,5 +194,5 @@ export const TextInput = ({ id, placeholder, value, isPassword, showPasswordOnFo
             }
         }
     }, { isActive: isFocused });
-    return (_jsx(Box, { borderStyle: "round", borderColor: isFocused ? primary : "gray", borderBottom: !inline, borderTop: !inline, borderLeft: !inline, borderRight: !inline, flexGrow: 1, flexShrink: 0, paddingX: inline ? 0 : 1, overflow: "hidden", minHeight: inline ? 1 : 3, ...props, children: _jsx(Text, { color: value ? "white" : "gray", children: displayValue }) }));
+    return (_jsx(Box, { ref: boxRef, borderStyle: "round", borderColor: isFocused ? primary : "gray", borderBottom: !inline, borderTop: !inline, borderLeft: !inline, borderRight: !inline, flexGrow: 1, flexShrink: 0, paddingX: inline ? 0 : 1, overflow: "hidden", minHeight: inline ? 1 : 3, ...props, children: _jsx(Text, { color: value ? "white" : "gray", children: displayValue }) }));
 };

package/dist/dashboard/DashboardView.js

@@ -6,8 +6,10 @@ import { VaultList } from "./components/VaultList.js";
 import { CipherDetail } from "./components/CipherDetail.js";
 import { HelpBar } from "./components/HelpBar.js";
 import { primary } from "../theme/style.js";
-import { bwClient, clearConfig, emptyCipher, useBwSync } from "../hooks/bw.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";
 export function DashboardView({ onLogout }) {
     const { sync, error, fetchSync } = useBwSync();
     const [syncState, setSyncState] = useState(sync);
@@ -17,6 +19,7 @@ export function DashboardView({ onLogout }) {
     const [focusedComponent, setFocusedComponent] = useState("list");
     const [detailMode, setDetailMode] = useState("view");
     const [editedCipher, setEditedCipher] = useState(null);
+    const [activeTab, setActiveTab] = useState("main");
     const { focus, focusNext } = useFocusManager();
     const { stdout } = useStdout();
     const { statusMessage, statusMessageColor, showStatusMessage } = useStatusMessage();
@@ -41,18 +44,27 @@ export function DashboardView({ onLogout }) {
         return i < 0 ? 0 : i;
     }, [listSelected, filteredCiphers]);
     const selectedCipher = detailMode === "new" ? editedCipher : filteredCiphers[listIndex];
+    const writableCollections = useMemo(() => (syncState?.collections ?? []).filter((c) => !c.readOnly && c.organizationId === selectedCipher?.organizationId), [syncState, editedCipher, filteredCiphers[listIndex]]);
+    const organizations = useMemo(() => (syncState?.profile?.organizations ?? []).map(({ id, name }) => ({ id, name })), [syncState]);
     const logout = async () => {
         bwClient.logout();
         await clearConfig();
         onLogout();
     };
+    useMouseSubscribe((targetId) => {
+        if (targetId === "search") {
+            setFocusedComponent("search");
+        }
+        else if (targetId === "list") {
+            setFocusedComponent("list");
+        }
+        else {
+            setFocusedComponent("detail");
+        }
+    });
     useEffect(() => {
         setSyncState(sync);
     }, [sync]);
-    useEffect(() => {
-        if (focusedComponent === "detail")
-            focusNext();
-    }, [focusedComponent]);
     useEffect(() => {
         if (error)
             showStatusMessage(error, "error");
@@ -71,12 +83,14 @@ export function DashboardView({ onLogout }) {
             setDetailMode("new");
             setEditedCipher(emptyCipher);
             setFocusedComponent("detail");
+            setActiveTab("main");
             setShowDetails(false);
             return;
         }
         if (key.escape) {
             setFocusedComponent("list");
             setDetailMode("view");
+            setActiveTab("main");
         }
         if (focusedComponent === "search") {
             if (key.escape && searchQuery?.length) {
@@ -104,22 +118,46 @@ 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: ["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) => {
+                            } }) }), _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: 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);
+                        }, 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;
+                                    }
                                     await bwClient.createSecret(cipher);
                                     fetchSync();
                                     showStatusMessage("Saved!", "success");
                                     setDetailMode("view");
                                     setFocusedComponent("list");
+                                    setActiveTab("main");
                                 }
                                 catch (e) {
                                     showStatusMessage("Synchronization error", "error");
@@ -127,14 +165,37 @@ export function DashboardView({ onLogout }) {
                             }
                             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);
-                                    if (!updated) {
+                                    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");

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

@@ -1,8 +1,15 @@
-import { Cipher } from "../../clients/bw.js";
-export declare function CipherDetail({ selectedCipher, isFocused, mode, onChange, onSave, }: {
+import { Cipher, CipherType, Collection } from "../../clients/bw.js";
+import { Organization } from "./MoreInfoTab.js";
+export type DetailTab = "main" | "more" | "collections";
+export declare function CipherDetail({ selectedCipher, isFocused, mode, activeTab, collections, organizations, onChange, onSave, onDelete, onTypeChange, }: {
     selectedCipher: Cipher | null | undefined;
     isFocused: boolean;
     mode: "view" | "new";
+    activeTab: DetailTab;
+    collections: Collection[];
+    organizations: Organization[];
     onChange: (cipher: Cipher) => void;
     onSave: (cipher: Cipher) => void;
+    onDelete: (cipher: Cipher) => void;
+    onTypeChange?: (type: CipherType) => void;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/dashboard/components/CipherDetail.js

@@ -1,12 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box } from "ink";
 import { primaryLight } from "../../theme/style.js";
-import { CipherType } from "../../clients/bw.js";
 import { Button } from "../../components/Button.js";
-import { useState } from "react";
 import { MoreInfoTab } from "./MoreInfoTab.js";
 import { MainTab } from "./MainTab.js";
-export function CipherDetail({ selectedCipher, isFocused, mode, onChange, onSave, }) {
-    const [isMoreInfoTab, setIsMoreInfoTab] = useState(false);
-    return (_jsx(Box, { flexDirection: "column", width: "60%", flexGrow: 1, paddingX: 1, borderStyle: "round", borderColor: isFocused ? primaryLight : "gray", borderLeftColor: "gray", children: selectedCipher && (_jsxs(Box, { flexDirection: "column", justifyContent: "space-between", flexGrow: 1, children: [isMoreInfoTab ? (_jsx(MoreInfoTab, { isFocused: isFocused, selectedCipher: selectedCipher, onChange: onChange })) : (_jsx(MainTab, { isFocused: isFocused, selectedCipher: selectedCipher, onChange: onChange })), _jsxs(Box, { marginTop: 1, flexShrink: 0, gap: 1, children: [mode !== "new" && (_jsx(Button, { width: "50%", isActive: isFocused, onClick: () => setIsMoreInfoTab(!isMoreInfoTab), children: "More" })), selectedCipher.type !== CipherType.SSHKey && (_jsx(Button, { doubleConfirm: true, width: "50%", isActive: isFocused, onClick: () => onSave(selectedCipher), children: "Save" }))] })] })) }));
+import { CollectionsTab } from "./CollectionsTab.js";
+export function CipherDetail({ selectedCipher, isFocused, mode, activeTab, collections, organizations, onChange, onSave, onDelete, onTypeChange, }) {
+    return (_jsx(Box, { flexDirection: "column", width: "60%", flexGrow: 1, paddingX: 1, borderStyle: "round", borderColor: isFocused ? primaryLight : "gray", borderLeftColor: "gray", children: selectedCipher && (_jsxs(Box, { flexDirection: "column", justifyContent: "space-between", flexGrow: 1, children: [activeTab === "more" ? (_jsx(MoreInfoTab, { isFocused: isFocused, selectedCipher: selectedCipher, organizations: organizations, onChange: onChange })) : activeTab === "collections" ? (_jsx(CollectionsTab, { isFocused: isFocused, selectedCipher: selectedCipher, collections: collections, onChange: onChange })) : (_jsx(MainTab, { isFocused: isFocused, selectedCipher: selectedCipher, mode: mode, onChange: onChange, onTypeChange: onTypeChange })), _jsxs(Box, { marginTop: 1, flexShrink: 0, gap: 1, children: [_jsx(Button, { doubleConfirm: true, width: "50%", isActive: isFocused, onClick: () => onSave(selectedCipher), children: "Save" }), mode !== "new" && (_jsx(Button, { tripleConfirm: true, width: "50%", isActive: isFocused, onClick: () => onDelete(selectedCipher), children: "Delete" }))] })] })) }));
 }

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

@@ -0,0 +1,7 @@
+import { Cipher, Collection } from "../../clients/bw.js";
+export declare function CollectionsTab({ isFocused, selectedCipher, collections, onChange, }: {
+    isFocused: boolean;
+    selectedCipher: Cipher;
+    collections: Collection[];
+    onChange: (cipher: Cipher) => void;
+}): import("react/jsx-runtime").JSX.Element;