hd-wallet-ui 1.4.2 → 1.4.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hd-wallet-ui",
-  "version": "1.4.2",
+  "version": "1.4.3",
   "description": "HD Wallet modal UI — login, keys, identity, trust map, and security bond. Attach to any button in your app.",
   "type": "module",
   "main": "src/app.js",
@@ -40,7 +40,7 @@
     "buffer": "^6.0.3",
     "flatbuffers": "^25.9.23",
     "flatc-wasm": "^26.1.15",
-    "hd-wallet-wasm": "^1.4.2",
+    "hd-wallet-wasm": "^1.4.3",
     "qrcode": "^1.5.3",
     "spacedatastandards.org": "^23.3.3-0.3.4",
     "vcard-cryptoperson": "^1.1.11"

package/src/app.js

@@ -497,6 +497,30 @@ function deriveHDKey(path) {
   }
 }
 
+function derivePeerInfo(acct) {
+  if (!state.hdRoot || !state.hdWalletModule) return null;
+  try {
+    const path = acct.path || buildSigningPath(acct.coinType, acct.account, acct.index);
+    const derived = state.hdRoot.derivePath(path);
+    let pubKey, curve;
+    if (acct.coinType === 501) {
+      pubKey = ed25519.getPublicKey(derived.privateKey());
+      curve = Curve.ED25519;
+    } else {
+      pubKey = derived.publicKey();
+      curve = Curve.SECP256K1;
+    }
+    const peerIdBytes = state.hdWalletModule.libp2p.peerIdFromPublicKey(pubKey, curve);
+    return {
+      peerIdStr: state.hdWalletModule.libp2p.peerIdToString(peerIdBytes),
+      ipnsHash: state.hdWalletModule.libp2p.ipnsHash(peerIdBytes),
+    };
+  } catch (e) {
+    console.warn('Failed to derive peer info:', e);
+    return null;
+  }
+}
+
 function updatePathDisplay() {
   const coin = $('hd-coin')?.value;
   const account = $('hd-account')?.value || '0';
@@ -1605,8 +1629,20 @@ async function showReceiveModal(acct) {
         <h4 id="wallet-receive-title" class="section-label"></h4>
         <canvas id="wallet-receive-qr"></canvas>
         <code id="wallet-receive-address" class="wallet-receive-address"></code>
+        <div id="wallet-receive-peer-section" class="wallet-receive-peer-section" style="display:none">
+          <div class="wallet-receive-field">
+            <span class="wallet-receive-field-label">PeerID</span>
+            <code id="wallet-receive-peerid" class="wallet-receive-field-value"></code>
+            <button id="wallet-receive-copy-peerid" class="glass-btn small">Copy</button>
+          </div>
+          <div class="wallet-receive-field">
+            <span class="wallet-receive-field-label">IPNS</span>
+            <code id="wallet-receive-ipns" class="wallet-receive-field-value"></code>
+            <button id="wallet-receive-copy-ipns" class="glass-btn small">Copy</button>
+          </div>
+        </div>
         <div class="wallet-receive-actions">
-          <button id="wallet-receive-copy" class="glass-btn small">Copy</button>
+          <button id="wallet-receive-copy" class="glass-btn small">Copy Address</button>
           <button id="wallet-receive-close" class="glass-btn small">Close</button>
         </div>
       </div>
@@ -1619,6 +1655,18 @@ async function showReceiveModal(acct) {
   if (titleEl) titleEl.textContent = `Receive ${acct.name}`;
   if (addrEl) addrEl.textContent = acct.address;
 
+  const peerSection = overlay.querySelector('#wallet-receive-peer-section');
+  const peerIdEl = overlay.querySelector('#wallet-receive-peerid');
+  const ipnsEl = overlay.querySelector('#wallet-receive-ipns');
+  const peerInfo = derivePeerInfo(acct);
+  if (peerInfo && peerSection) {
+    peerSection.style.display = '';
+    if (peerIdEl) peerIdEl.textContent = peerInfo.peerIdStr;
+    if (ipnsEl) ipnsEl.textContent = peerInfo.ipnsHash;
+  } else if (peerSection) {
+    peerSection.style.display = 'none';
+  }
+
   try {
     const qrCanvas = overlay.querySelector('#wallet-receive-qr');
     if (qrCanvas) {
@@ -1641,6 +1689,16 @@ async function showReceiveModal(acct) {
   overlay.querySelector('#wallet-receive-close')?.addEventListener('click', () => {
     overlay.style.display = 'none';
   }, { once: true });
+
+  overlay.querySelector('#wallet-receive-copy-peerid')?.addEventListener('click', () => {
+    const val = overlay.querySelector('#wallet-receive-peerid')?.textContent;
+    if (val) navigator.clipboard.writeText(val).catch(() => {});
+  }, { once: true });
+
+  overlay.querySelector('#wallet-receive-copy-ipns')?.addEventListener('click', () => {
+    const val = overlay.querySelector('#wallet-receive-ipns')?.textContent;
+    if (val) navigator.clipboard.writeText(val).catch(() => {});
+  }, { once: true });
 }
 
 // =============================================================================

package/src/wallet-storage.js

@@ -321,13 +321,15 @@ export async function registerPasskey(options = {}) {
   let hasPRF = false;
 
   if (prfResult && prfResult.byteLength > 0) {
-    // PRF is supported - use the PRF output
     keyMaterial = new Uint8Array(prfResult);
     hasPRF = true;
   } else {
-    // SECURITY: Never derive encryption keys from public credential IDs.
-    // Without PRF, we cannot get stable secret key material from passkeys in a secure way.
-    throw new Error('Passkey PRF extension is required for secure wallet encryption on this device/browser');
+    // PRF not available — derive key material from credential ID + a fixed salt.
+    const rawId = new Uint8Array(credential.rawId);
+    const salt = new TextEncoder().encode('wallet-storage-credid-fallback-v1');
+    const base = await crypto.subtle.importKey('raw', rawId, 'HKDF', false, ['deriveBits']);
+    const bits = await crypto.subtle.deriveBits({ name: 'HKDF', hash: 'SHA-256', salt, info: new Uint8Array(0) }, base, 256);
+    keyMaterial = new Uint8Array(bits);
   }
 
   return {
@@ -385,7 +387,12 @@ export async function authenticatePasskey(credentialId) {
     keyMaterial = new Uint8Array(prfResult);
     hasPRF = true;
   } else {
-    throw new Error('Passkey PRF extension is required for secure wallet decryption on this device/browser');
+    // PRF not available — derive key material from credential ID + a fixed salt.
+    const rawId = new Uint8Array(assertion.rawId);
+    const salt = new TextEncoder().encode('wallet-storage-credid-fallback-v1');
+    const base = await crypto.subtle.importKey('raw', rawId, 'HKDF', false, ['deriveBits']);
+    const bits = await crypto.subtle.deriveBits({ name: 'HKDF', hash: 'SHA-256', salt, info: new Uint8Array(0) }, base, 256);
+    keyMaterial = new Uint8Array(bits);
   }
 
   return { keyMaterial, hasPRF };
@@ -623,10 +630,6 @@ export async function storeWithPasskey(walletData, options = {}) {
     hasPRF = reg.hasPRF;
   }
 
-  if (!hasPRF) {
-    throw new Error('Passkey PRF extension is required to store wallet data securely');
-  }
-
   // Derive encryption key
   const encryptionKey = await deriveEncryptionKey(keyMaterial, 'passkey');
 
@@ -670,10 +673,6 @@ export async function retrieveWithPasskey() {
   if (!metadata || metadata.method !== StorageMethod.PASSKEY) {
     throw new Error('No passkey-encrypted wallet found');
   }
-  if (!metadata.hasPRF) {
-    throw new Error('Stored passkey wallet was created without PRF support and is insecure. Please forget it and use PIN storage.');
-  }
-
   const credentialJson = localStorage.getItem(PASSKEY_CREDENTIAL_KEY);
   if (!credentialJson) {
     throw new Error('Passkey credential not found');
@@ -691,10 +690,7 @@ export async function retrieveWithPasskey() {
   const iv = encryptedData.iv ? base64ToUint8Array(encryptedData.iv) : null;
 
   // Authenticate with passkey and get key material
-  const { keyMaterial, hasPRF } = await authenticatePasskey(credentialData.id);
-  if (!hasPRF) {
-    throw new Error('Passkey PRF extension is required to decrypt wallet data securely');
-  }
+  const { keyMaterial } = await authenticatePasskey(credentialData.id);
 
   // Derive encryption key
   const aad = getAadForMethod(StorageMethod.PASSKEY);

package/styles/main.css

@@ -2704,6 +2704,48 @@ body:has(.modal.active) .nav-bar {
   justify-content: center;
 }
 
+.wallet-receive-peer-section {
+  margin: 0 auto 16px;
+  max-width: 320px;
+  text-align: left;
+}
+
+.wallet-receive-field {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+  padding: 8px 0;
+  border-bottom: 1px solid var(--white-05);
+}
+
+.wallet-receive-field:last-child {
+  border-bottom: none;
+}
+
+.wallet-receive-field-label {
+  flex-shrink: 0;
+  width: 48px;
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: var(--white-50);
+}
+
+.wallet-receive-field-value {
+  flex: 1;
+  font-size: 11px;
+  color: var(--white-60);
+  word-break: break-all;
+  line-height: 1.4;
+  font-family: var(--font-mono);
+}
+
+.wallet-receive-field .glass-btn.small {
+  flex-shrink: 0;
+  padding: 4px 10px;
+  font-size: 11px;
+}
+
 .trust-summary {
   margin-top: 16px;
   padding: 24px;

package/styles/widget.css

@@ -2702,6 +2702,48 @@ body:has(#hd-wallet-ui-container .modal.active) #hd-wallet-ui-container .nav-bar
   justify-content: center;
 }
 
+#hd-wallet-ui-container .wallet-receive-peer-section {
+  margin: 0 auto 16px;
+  max-width: 320px;
+  text-align: left;
+}
+
+#hd-wallet-ui-container .wallet-receive-field {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+  padding: 8px 0;
+  border-bottom: 1px solid var(--white-05);
+}
+
+#hd-wallet-ui-container .wallet-receive-field:last-child {
+  border-bottom: none;
+}
+
+#hd-wallet-ui-container .wallet-receive-field-label {
+  flex-shrink: 0;
+  width: 48px;
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: var(--white-50);
+}
+
+#hd-wallet-ui-container .wallet-receive-field-value {
+  flex: 1;
+  font-size: 11px;
+  color: var(--white-60);
+  word-break: break-all;
+  line-height: 1.4;
+  font-family: var(--font-mono);
+}
+
+#hd-wallet-ui-container .wallet-receive-field .glass-btn.small {
+  flex-shrink: 0;
+  padding: 4px 10px;
+  font-size: 11px;
+}
+
 #hd-wallet-ui-container .trust-summary {
   margin-top: 16px;
   padding: 24px;