Lock with fingerprint or face. The padlock's "Protect this device?" now offers a passkey instead of a password, and Settings → Security can turn it on or off. The saved-wallets vault is sealed under a secret only that passkey's PRF produces (behind the phone's fingerprint/face check, the passkey kept by the platform's secure hardware or password manager), so nothing in this browser's storage opens it. Opening the app on a locked device asks for the passkey by itself; a cancel leaves an Unlock button. The prompts that need the vault opened (save, forget, lock a stray wallet) take the passkey too; there's no Change password for a vault that has none; the recovery words remain the way back. The lock passkey has its own PRF salt and a marked user handle, not discoverable where the platform allows — passkey sign-in refuses it rather than derive a stranger's key from it. English + Italian strings. tools/passkey-lock-test.js (Chrome's virtual authenticator with PRF).

Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01Vps2H27rhbG9ZqseGfMrc3

1 files changed, 149 insertions, 11 deletions

diff --git a/src/app.js b/src/app.js
index 02c1ef1..aab07da 100644
--- a/src/app.js
+++ b/src/app.js
@@ -2077,7 +2077,7 @@ function restoreAccountsState() {
       else { ui.screen = 'unlock'; render(); }
       return true;
     }
-    ui.screen = 'vault'; render(); return true;
+    ui.screen = 'vault'; ui.passkeyAsk = true; render(); return true;
   }
   const watch = loadWatchAccounts();
   if (watch.length) {
@@ -2096,6 +2096,17 @@ const LOCK_PW_KEY = 'btc-wallet-lockpw';
 const lockPwAsked = () => { try { return !!localStorage.getItem(LOCK_PW_KEY); } catch { return true; } };
 const markLockPwAsked = () => { try { localStorage.setItem(LOCK_PW_KEY, '1'); } catch {} };
 let vaultPassword = null; // in memory once unlocked/set this session; cleared on lock
+// Locked with a passkey instead of a password: the vault's password is then
+// a secret only that passkey's PRF produces (passkey.js), and the blob names
+// the credential to ask for. Held beside vaultPassword while it's in use.
+let vaultPasskeyId = null;
+const passkeySecret = (pw) => typeof pw === 'string' && pw.startsWith('passkey:');
+const vaultPasskey = () => (loadVaultBlob() || {}).passkey || null;
+function sealVault(list, password) {
+  const b = encryptVault(list, password);
+  if (passkeySecret(password) && vaultPasskeyId) b.passkey = vaultPasskeyId;
+  return b;
+}
 
 function loadVaultBlob() {
   try { return JSON.parse(localStorage.getItem(VAULT_KEY) || 'null'); } catch { return null; }
@@ -2110,7 +2121,7 @@ function writeVault() {
     .map((a) => (a.xprv ? { label: a.label, xprv: a.xprv, network: a.network } : { label: a.label, mnemonic: a.mnemonic, passphrase: a.passphrase || '', network: a.network }));
   try {
     if (!list.length) localStorage.removeItem(VAULT_KEY);
-    else localStorage.setItem(VAULT_KEY, JSON.stringify(encryptVault(list, vaultPassword)));
+    else localStorage.setItem(VAULT_KEY, JSON.stringify(sealVault(list, vaultPassword)));
   } catch {}
 }
 
@@ -2255,6 +2266,15 @@ function submitPw() {
     toast(t('pwChanged'));
     return;
   }
+  if (p.purpose === 'passkeyOn') {
+    let list;
+    try { list = decryptVault(loadVaultBlob(), p.v1 || ''); } catch { p.error = t('pwWrong'); render(); return; }
+    vaultPassword = p.v1 || '';
+    mergeVaultList(list);
+    ui.pw = null;
+    enablePasskeyLock();
+    return;
+  }
   if (p.purpose === 'lock') {
     if (!p.v1) { p.error = t('pwNeededToLock'); render(); return; }
     if (p.v1 !== p.v2) { p.error = t('pwMismatch'); render(); return; }
@@ -2291,12 +2311,97 @@ function submitPw() {
   render();
 }
 
+// Lock with a passkey (fingerprint or face) instead of a password. The
+// vault's wallets are re-sealed under the passkey's secret; from then on
+// opening them takes the passkey, and the recovery words remain the way back
+// if it's ever lost. `lockAfter`: the padlock's offer — lock once it's set.
+async function enablePasskeyLock({ lockAfter = false } = {}) {
+  // what the vault holds now, under whatever opens it today
+  if (hasVault()) {
+    let list;
+    try { list = decryptVault(loadVaultBlob(), vaultPassword != null ? vaultPassword : ''); } catch {
+      ui.pw = { purpose: 'passkeyOn', mode: 'enter', v0: '', v1: '', v2: '', error: '' };
+      render(); return;
+    }
+    mergeVaultList(list);
+  }
+  let made;
+  try {
+    const pass = await import('./passkey.js');
+    made = await pass.lockPasskeyCreate();
+  } catch (e) {
+    const pass = await import('./passkey.js').catch(() => null);
+    if (!(pass && pass.passkeyCancelled(e))) toast(t('passkeyLockFailed', { msg: (e && e.message) || String(e) }), 4000);
+    render(); return;
+  }
+  vaultPassword = made.secret;
+  vaultPasskeyId = made.id;
+  // a wallet that only lives in this tab joins the vault, or it couldn't come back
+  const active = activeAccount();
+  if (active && active.type === 'full' && !active.provisional) active.persisted = true;
+  writeVault();
+  persistAccounts();
+  markLockPwAsked();
+  ui.pw = null;
+  if (lockAfter) { softLock(); return; }
+  render();
+  toast(t('passkeyLockOnToast'));
+}
+// Back to no lock at all (the padlock offers a password or the passkey
+// again). Needs the passkey once, unless this session already holds it.
+async function disablePasskeyLock() {
+  let secret = passkeySecret(vaultPassword) ? vaultPassword : null;
+  if (!secret) {
+    const s2 = await passkeyVaultSecret();
+    if (!s2) return;
+    secret = s2;
+  }
+  let list;
+  try { list = decryptVault(loadVaultBlob(), secret); } catch { toast(t('pwWrong')); return; }
+  mergeVaultList(list);
+  vaultPassword = '';
+  vaultPasskeyId = null;
+  writeVault();
+  persistAccounts();
+  render();
+  toast(t('passkeyLockOffToast'));
+}
+// The fingerprint or face check: the vault's secret, or null (cancelled or
+// failed — a failure is shown where the unlock was asked for).
+async function passkeyVaultSecret() {
+  const id = vaultPasskey();
+  if (!id) return null;
+  const pass = await import('./passkey.js');
+  try { return await pass.lockPasskeyUnlock(id); } catch (e) {
+    if (!pass.passkeyCancelled(e)) { ui.vaultError = (e && e.message) || String(e); toast(ui.vaultError, 4000); render(); }
+    return null;
+  }
+}
+async function unlockVaultWithPasskey() {
+  ui.vaultError = '';
+  const secret = await passkeyVaultSecret();
+  if (!secret) return;
+  ui.vaultPw = secret;
+  unlockVault();
+  ui.vaultPw = '';
+}
+// The password prompts that only need the vault opened (save, forget, lock
+// a stray wallet) take the passkey instead when that's what locks it.
+async function submitPwWithPasskey() {
+  const p = ui.pw;
+  const secret = await passkeyVaultSecret();
+  if (!secret || ui.pw !== p) return;
+  p.v1 = secret;
+  submitPw();
+}
+
 // Try to decrypt the vault with the given password; on success, seed the
 // accounts (watch-only directory + the unlocked full wallets). Returns success.
 function attemptVaultUnlock(password) {
   let list;
   try { list = decryptVault(loadVaultBlob(), password); } catch { return false; }
   vaultPassword = password;
+  vaultPasskeyId = passkeySecret(password) ? vaultPasskey() : null;
   // Start from the durable directory (watch-only views of every known wallet),
   // then upgrade the vault-saved ones to spendable — so non-saved wallets still
   // appear (watch-only) instead of vanishing.
@@ -2513,6 +2618,7 @@ function lock({ offerPassword = false } = {}) {
   for (const f of FEATURES) { try { f.stop && f.stop(); } catch {} }
   clearAccounts();
   vaultPassword = null;
+  vaultPasskeyId = null;
   wallet.load({ mnemonic: '', passphrase: '', netName: getNetwork(), offline: false });
   wallet.mnemonic = '';
   // Wallets save themselves to this device without asking, under an empty
@@ -2652,6 +2758,7 @@ function softLock() {
   _featuresInited = false;
   for (const f of FEATURES) { try { f.stop && f.stop(); } catch {} }
   vaultPassword = null;
+  vaultPasskeyId = null;
   accounts = watch.slice();
   persistAccounts();
   const cur = accounts.find((a) => a.id === keepId) || accounts[0];
@@ -2674,7 +2781,7 @@ function lockBtn() {
           if (attemptVaultUnlock('')) {
             const cur = accounts.find((a) => a.id === activeId) || accounts[0];
             if (cur) activateAccount(cur, { fresh: true });
-          } else { ui.justLocked = false; ui.screen = 'vault'; render(); }
+          } else { ui.justLocked = false; ui.screen = 'vault'; ui.passkeyAsk = true; render(); }
         }
       : () => softLock(),
   }, h('span', { style: 'font-size:15px;line-height:1;margin-right:6px' }, locked ? '\u{1F512}' : '\u{1F513}'), locked ? t('unlock') : t('lockWallet'));
@@ -3289,7 +3396,7 @@ function accountsScreen() {
       h('button', { class: 'btn-block', onClick: signInAnother }, t('signInAnother')),
       lockBtn(),
       activeAccount() ? h('button', { class: 'btn-ghost btn-block', onClick: () => { ui.logoutConfirm = true; render(); } }, t('logout')) : null,
-      hasVault() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null,
+      hasVault() && !vaultPasskey() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null,
       h('button', { class: 'btn-ghost btn-block', onClick: () => { ui.confirmClear = true; render(); } }, t('clearAll'))
     ),
     h('button', { class: 'btn-ghost btn-block', onClick: () => goBack(() => { ui.screen = 'wallet'; }) }, t('back'))
@@ -3486,10 +3593,24 @@ function securityCard() {
   return h('div', { class: 'card col', style: 'gap:8px' },
     h('h3', {}, t('securityTitle')),
     lockBtn(),
-    hasVault() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null,
+    passkeyLockRow(),
+    hasVault() && !vaultPasskey() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null,
     anon ? h('button', { class: 'btn-block', onClick: signInAnother }, t('signInAnother')) : null,
     anon ? h('button', { class: 'btn-ghost btn-block', onClick: () => { ui.logoutConfirm = true; render(); } }, t('logout')) : null);
 }
+// Settings → Security: lock with a passkey, or say that it is and offer the
+// way back. Only where the browser does passkeys at all.
+function passkeyLockRow() {
+  if (vaultPasskey()) {
+    return h('div', { class: 'col', style: 'gap:6px' },
+      h('div', { class: 'small muted' }, '\u{1F510} ' + t('passkeyLockOnNote')),
+      h('button', { class: 'btn-ghost btn-block', onClick: disablePasskeyLock }, t('passkeyLockOff')));
+  }
+  if (typeof window === 'undefined' || !window.PublicKeyCredential || !navigator.credentials) return null;
+  return h('div', { class: 'col', style: 'gap:6px' },
+    h('button', { class: 'btn-block', onClick: () => enablePasskeyLock() }, '\u{1F510} ' + t('passkeyLockBtn')),
+    h('div', { class: 'small muted' }, t('passkeyLockDesc')));
+}
 function accountSettingsScreen() {
   if (ui.pw) return h('div', { class: 'col', style: 'gap:16px' }, brandHeader(false), pwPromptCard());
   if (ui.logoutConfirm) return logoutConfirmScreen();
@@ -3534,22 +3655,36 @@ function pwPromptCard() {
   const atLock = p.purpose === 'lock';
   const newish = change || p.mode === 'set'; // entering a (new) password with confirm
   const atLockSave = p.purpose === 'locksave'; // locking, but the vault needs its password first
+  // opening the vault when a passkey, not a password, is what locks it
+  const byPasskey = p.mode === 'enter' && !change && p.purpose !== 'passkeyOn' && !!vaultPasskey();
   return h('div', { class: 'card col' },
     h('h3', {}, atLock ? t('lockPwTitle') : atLockSave ? t('lockWallet') : change ? t('changePassword') : p.mode === 'set' ? t('setPassword') : t('enterPassword')),
     h('p', { class: 'small muted', style: 'margin:0' },
-      atLock ? t('lockPwDesc') : change ? t('changePasswordDesc') : atLockSave ? t('lockSaveDesc') : p.mode === 'set' ? t('setPasswordDesc') : t('enterPasswordDesc')),
+      atLock ? t('lockPwDesc') : change ? t('changePasswordDesc') : byPasskey ? t('passkeyEnterDesc') : atLockSave ? t('lockSaveDesc') : p.mode === 'set' ? t('setPasswordDesc') : t('enterPasswordDesc')),
+    // the padlock's offer: a fingerprint or face instead of a password
+    atLock && window.PublicKeyCredential ? h('button', { class: 'btn-primary btn-block', onClick: () => enablePasskeyLock({ lockAfter: true }) }, '\u{1F510} ' + t('passkeyLockBtn')) : null,
+    atLock && window.PublicKeyCredential ? h('div', { class: 'small muted', style: 'text-align:center' }, t('lockPwOrPassword')) : null,
+    byPasskey ? h('button', { class: 'btn-primary btn-block', onClick: submitPwWithPasskey }, '\u{1F510} ' + t('passkeyUnlock')) : null,
     change ? h('input', { type: 'password', placeholder: t('currentPassword'), value: p.v0, onInput: (e) => (p.v0 = e.target.value) }) : null,
-    h('input', { type: 'password', placeholder: newish ? t('passwordOptional') : t('password'), value: p.v1, onInput: (e) => (p.v1 = e.target.value) }),
+    byPasskey ? null : h('input', { type: 'password', placeholder: newish ? t('passwordOptional') : t('password'), value: p.v1, onInput: (e) => (p.v1 = e.target.value) }),
     newish ? h('input', { type: 'password', placeholder: t('confirmPassword'), value: p.v2, onInput: (e) => (p.v2 = e.target.value) }) : null,
     p.error && h('div', { class: 'notice err' }, p.error),
     h('div', { class: 'row gap6' },
       h('button', { class: 'btn-ghost grow', onClick: cancelPw }, atLock ? t('lockPwSkip') : t('back')),
-      h('button', { class: 'btn-primary grow', onClick: submitPw }, newish ? t('save') : atLockSave ? t('lockAction') : t('unlock'))
+      byPasskey ? null : h('button', { class: (atLock ? 'btn-ghost' : 'btn-primary') + ' grow', onClick: submitPw }, newish ? t('save') : atLockSave ? t('lockAction') : t('unlock'))
     )
   );
 }
 
+// A passkey-locked vault asks for the fingerprint as it opens — on the app's
+// own start and on the padlock's tap, not right after you locked it; once,
+// so a cancel leaves the button rather than a loop.
 function vaultScreen() {
+  const byPasskey = !!vaultPasskey();
+  if (ui.passkeyAsk) {
+    ui.passkeyAsk = false;
+    if (byPasskey) setTimeout(() => { if (ui.screen === 'vault') unlockVaultWithPasskey(); }, 0);
+  }
   return h(
     'div',
     { class: 'col', style: 'gap:16px' },
@@ -3558,8 +3693,8 @@ function vaultScreen() {
       h('div', { class: 'row gap6', style: 'align-items:center' },
         h('span', { style: 'font-size:20px;line-height:1' }, '\u{1F512}'),
         h('h3', { style: 'margin:0' }, ui.justLocked ? t('lockedTitle') : t('unlockSaved'))),
-      h('p', { class: 'small muted', style: 'margin:0' }, ui.justLocked ? t('lockedDesc') : t('unlockSavedDesc')),
-      h('input', { type: 'password', placeholder: t('password'), value: ui.vaultPw,
+      h('p', { class: 'small muted', style: 'margin:0' }, byPasskey ? t('passkeyLockedDesc') : ui.justLocked ? t('lockedDesc') : t('unlockSavedDesc')),
+      byPasskey ? null : h('input', { type: 'password', placeholder: t('password'), value: ui.vaultPw,
         onInput: (e) => (ui.vaultPw = e.target.value), onKeyDown: (e) => { if (e.key === 'Enter') unlockVault(); } }),
       h('div', { class: 'row between', style: 'align-items:center;gap:10px' },
         h('span', { class: 'small muted', style: 'white-space:nowrap;flex-shrink:0' }, t('unlockForLabel')),
@@ -3569,7 +3704,10 @@ function vaultScreen() {
             selected: (ui.unlockFor != null ? ui.unlockFor : Number(localStorage.getItem(UNLOCK_FOR_KEY)) || 0) === o.ms,
           }, t(o.label))))),
       ui.vaultError && h('div', { class: 'notice err' }, ui.vaultError),
-      h('button', { class: 'btn-primary btn-block', onClick: unlockVault }, t('unlock')),
+      byPasskey
+        ? h('button', { class: 'btn-primary btn-block', onClick: unlockVaultWithPasskey }, '\u{1F510} ' + t('passkeyUnlock'))
+        : h('button', { class: 'btn-primary btn-block', onClick: unlockVault }, t('unlock')),
+      byPasskey ? h('div', { class: 'small muted', style: 'text-align:center' }, t('passkeyLostHint')) : null,
       h('button', { class: 'btn-ghost btn-block', onClick: skipVault },
         loadWatchAccounts().length ? t('viewWithoutPassword') : t('useAnotherWallet'))
     )