@ai-matrx/vault 0.1.16 → 0.1.18

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 0.1.18
+
+- The Authenticator list keeps the code and its countdown ring apart at every width (the code column never squeezes), the list header lines up with the list on wide screens, and the Add authenticator panel's camera button is icon-only so the setup-key box has room on a phone. Consumer action: none.
+
+## 0.1.17
+
+- The new/edit Authenticator box reads "Paste setup key or otpauth link", and a declared Recovery codes box reads "Backup codes, one per line" (the live `website_login` and `username_password` types now declare `recovery_codes`). Consumer action: none.
+
 ## 0.1.16
 
 - **The Authenticator is back as a first-class destination.** The codes view is named **Authenticator** everywhere (sidebar, view picker, title, empty state "Add authenticator"), and below the three-pane width (the floating window, tablets, phones) the compact header carries an **Authenticator** button beside the view picker, so it is one press away at every width. Searching "authenticator", "2fa", "totp" or "two-factor" finds every login with a code (`AUTHENTICATOR_WORDS`). Each code row shows the site's letter and, when the host gives `openItemInNewTab`, **Open in new tab**. Guard: `src/authenticator-restore.test.tsx`. **Consumer action:** web app: pass `host.openItemInNewTab` (opens `/vault/<id>` in a new tab). Extension and desktop: none.

package/dist/index.cjs

@@ -1774,7 +1774,7 @@ function CodeButton({ live, digits, size = "md", label }) {
       onClick: () => live.code && void copy(live.code),
       "aria-label": live.code ? `Copy ${label} code` : `Getting ${label} code`,
       title: live.code ? "Copy" : void 0,
-      className: (0, import_design_system8.cn)("group -mx-1.5 inline-flex max-w-full items-center gap-2.5 rounded-md px-1.5 py-1 text-left transition-colors hover:bg-accent focus-visible:bg-accent focus-visible:outline-none", size === "lg" && "gap-3"),
+      className: (0, import_design_system8.cn)("group -mx-1.5 inline-flex max-w-full shrink-0 items-center gap-3 rounded-md px-1.5 py-1 text-left transition-colors hover:bg-accent focus-visible:bg-accent focus-visible:outline-none", size === "lg" && "gap-4"),
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: (0, import_design_system8.cn)("whitespace-nowrap font-mono font-medium tabular-nums tracking-[0.08em]", size === "lg" ? "text-2xl" : "text-[1.0625rem]", live.code ? "text-foreground" : "text-disabled-foreground"), children: shown }),
         copied ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "inline-flex size-6 items-center justify-center text-success", role: "status", "aria-label": "Copied", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CheckGlyph, { className: "size-4" }) }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CountdownRing, { remaining: live.remaining, period: live.period, loading: !live.code })
@@ -2042,7 +2042,7 @@ function OtpSetupRow({ value, onChange, label = "Authenticator", placeholder = "
             label,
             actions: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
               /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_controls6.Button, { variant: "quiet", icon: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(QrGlyph, {}), "aria-label": "Choose QR image", title: "Choose or drop a QR image", disabled: disabled || reading, onClick: () => file.current?.click() }),
-              canScan ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_controls6.Button, { variant: "quiet", icon: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(CameraGlyph, {}), "aria-label": "Scan QR code with camera", title: "Scan the site's QR code with the camera", disabled, onClick: () => setScanning(true), children: "Scan" }) : null
+              canScan ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_controls6.Button, { variant: "quiet", icon: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(CameraGlyph, {}), "aria-label": "Scan QR code with camera", title: "Scan the site's QR code with the camera", disabled, onClick: () => setScanning(true) }) : null
             ] }),
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
@@ -2230,7 +2230,7 @@ function TotpEditRow({ value, onChange, hasExisting, item, port, onEnrolled, onR
         setStatus(null);
         onChange(v);
       },
-      placeholder: hasExisting ? "Paste a new key to replace" : "Setup key or otpauth link",
+      placeholder: hasExisting ? "Paste a new key to replace" : "Paste setup key or otpauth link",
       status,
       ...uploadImage ? { onImage: (f) => void uploadImage(f) } : {},
       ...onRecognized ? { onRecognized } : {}
@@ -2472,7 +2472,7 @@ function AuthenticatorView({ port, host, items, definitions, query, onOpen, onCh
   const familyOf2 = (key) => definitions.find((d) => d.key === key)?.family ?? "generic";
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("section", { "aria-label": "Authenticator", className: "flex h-full min-h-0 flex-col bg-background", children: [
     header ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "mx-auto w-full max-w-3xl px-3 pt-3 sm:px-4", children: header }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex min-h-12 items-center justify-between gap-2 px-4 pb-1 pt-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "mx-auto flex min-h-12 w-full max-w-3xl items-center justify-between gap-2 px-4 pb-1 pt-3 sm:px-5", children: [
       /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex min-w-0 items-baseline gap-2", children: [
         /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h2", { className: "truncate text-sm font-semibold text-foreground", children: "Authenticator" }),
         total > 0 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-xs tabular-nums text-muted-foreground", children: total }) : null
@@ -2562,7 +2562,7 @@ function OtpListRow({ port, item, family, entry, onOpen, onOpenInNewTab, onRenam
       /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: (0, import_design_system10.cn)("max-w-full truncate text-sm font-medium", a.enabled ? "text-foreground" : "text-muted-foreground"), children: item.name }),
       sub ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: (0, import_design_system10.cn)("max-w-full truncate text-xs", a.error ? "text-destructive" : "text-muted-foreground"), title: sub, children: sub }) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex min-w-0 justify-end", children: !a.enabled ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "flex items-center gap-1.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex shrink-0 justify-end", children: !a.enabled ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "flex items-center gap-1.5", children: [
       /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-sm text-disabled-foreground", children: "Off" }),
       canManage ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_controls9.Button, { variant: "quiet", disabled: a.busy, onClick: () => void a.setEnabled(true), children: "Turn on" }) : null
     ] }) : live.error ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "flex items-center gap-1.5", children: [
@@ -6233,7 +6233,7 @@ function ItemPane(props) {
             {
               label: f.label,
               value,
-              placeholder: hidden ? "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" : f.required ? "Required" : "",
+              placeholder: hidden ? "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" : f.required ? "Required" : isRecoveryCodesField(f) ? "Backup codes, one per line" : "",
               secret: secretKind,
               multiline: f.kind === "multiline",
               inputMode: f.kind === "url" ? "url" : USERNAME_KEYS.test(f.key) ? "email" : "text",