@ai-matrx/vault 0.1.17 → 0.1.18

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # 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.

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)(
@@ -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: [