@le-space/p2pass 0.1.0 → 0.3.0

package/dist/identity/identity-service.d.ts

@@ -24,12 +24,13 @@ export class IdentityService {
      * If no credentials, creates new passkey.
      *
      * @param {'platform'|'cross-platform'} [authenticatorType]
-     * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference }} [options]
+     * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference, webauthnUserLabel?: string }} [options]
      * @returns {Promise<{ mode: string, did: string, algorithm: string }>}
      */
     initialize(authenticatorType?: "platform" | "cross-platform", options?: {
         preferWorkerMode?: boolean;
         signingPreference?: import("./signing-preference.js").SigningPreference;
+        webauthnUserLabel?: string;
     }): Promise<{
         mode: string;
         did: string;
@@ -38,12 +39,13 @@ export class IdentityService {
     /**
      * Force create a new identity (discards existing).
      * @param {'platform'|'cross-platform'} [authenticatorType]
-     * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference }} [options]
+     * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference, webauthnUserLabel?: string }} [options]
      * @returns {Promise<{ mode: string, did: string, algorithm: string }>}
      */
     createNewIdentity(authenticatorType?: "platform" | "cross-platform", options?: {
         preferWorkerMode?: boolean;
         signingPreference?: import("./signing-preference.js").SigningPreference;
+        webauthnUserLabel?: string;
     }): Promise<{
         mode: string;
         did: string;

package/dist/identity/identity-service.js

@@ -20,7 +20,6 @@ import {
 
 import {
   storeKeypairEntry,
-  getKeypairEntry,
   storeArchiveEntry,
   getArchiveEntry,
   listKeypairs,
@@ -36,6 +35,38 @@ import { resolveSigningPreference } from './signing-preference.js';
 
 const ARCHIVE_CACHE_KEY = 'p2p_passkeys_worker_archive';
 
+/** WebAuthn user.id must be at most 64 bytes (UTF-8). */
+const WEBAUTHN_USER_ID_MAX_BYTES = 64;
+
+/**
+ * Build {@link https://www.w3.org/TR/webauthn-3/#dictdef-publickeycredentialuserentity PublicKeyCredentialUserEntity}.
+ * Empty label keeps prior defaults (random opaque user.id).
+ *
+ * @param {string} label
+ * @returns {Promise<{ id: Uint8Array, name: string, displayName: string }>}
+ */
+async function publicKeyCredentialUserFromLabel(label) {
+  const trimmed = (typeof label === 'string' ? label : '').trim();
+  if (!trimmed) {
+    return {
+      id: crypto.getRandomValues(new Uint8Array(16)),
+      name: 'p2p-user',
+      displayName: 'P2P User',
+    };
+  }
+  const encoder = new TextEncoder();
+  let idBytes = encoder.encode(trimmed);
+  if (idBytes.length > WEBAUTHN_USER_ID_MAX_BYTES) {
+    const digest = await crypto.subtle.digest('SHA-256', idBytes);
+    idBytes = new Uint8Array(digest);
+  }
+  return {
+    id: idBytes,
+    name: trimmed,
+    displayName: trimmed,
+  };
+}
+
 /**
  * Best-effort: this origin likely already has passkey / identity material (no WebAuthn prompt).
  * Uses the same signals as restore paths — false negatives are OK (same handlers still apply).
@@ -118,11 +149,11 @@ export class IdentityService {
    * If no credentials, creates new passkey.
    *
    * @param {'platform'|'cross-platform'} [authenticatorType]
-   * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference }} [options]
+   * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference, webauthnUserLabel?: string }} [options]
    * @returns {Promise<{ mode: string, did: string, algorithm: string }>}
    */
   async initialize(authenticatorType, options = {}) {
-    const { preferWorkerMode = false, signingPreference = null } = options;
+    const { preferWorkerMode = false, signingPreference = null, webauthnUserLabel = '' } = options;
     const pref = resolveSigningPreference({ preferWorkerMode, signingPreference });
     const preferWorker = pref === 'worker';
     const forceP256Hardware = pref === 'hardware-p256';
@@ -135,10 +166,16 @@ export class IdentityService {
     // Try hardware mode first (unless worker mode is selected)
     if (!preferWorker) {
       try {
-        const signer = await this.#hardwareService.initialize({
+        const trimmedLabel = webauthnUserLabel.trim();
+        const hwOpts = {
           authenticatorType,
           forceP256: forceP256Hardware,
-        });
+        };
+        if (trimmedLabel) {
+          hwOpts.userId = trimmedLabel;
+          hwOpts.displayName = trimmedLabel;
+        }
+        const signer = await this.#hardwareService.initialize(hwOpts);
 
         if (signer) {
           this.#mode = 'hardware';
@@ -161,7 +198,7 @@ export class IdentityService {
     }
 
     // No existing identity — create new worker identity
-    await this.#createWorkerIdentity(authenticatorType);
+    await this.#createWorkerIdentity(authenticatorType, webauthnUserLabel);
     console.log(`[identity] Created new worker identity, DID: ${this.#did}`);
     return this.getSigningMode();
   }
@@ -169,7 +206,7 @@ export class IdentityService {
   /**
    * Force create a new identity (discards existing).
    * @param {'platform'|'cross-platform'} [authenticatorType]
-   * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference }} [options]
+   * @param {{ preferWorkerMode?: boolean, signingPreference?: import('./signing-preference.js').SigningPreference, webauthnUserLabel?: string }} [options]
    * @returns {Promise<{ mode: string, did: string, algorithm: string }>}
    */
   async createNewIdentity(authenticatorType, options = {}) {
@@ -190,7 +227,7 @@ export class IdentityService {
    */
   async initializeFromRecovery() {
     console.log('[identity] Starting recovery via discoverable credential...');
-    const { prfSeed, rawCredentialId, credential } = await recoverPrfSeed();
+    const { prfSeed, rawCredentialId } = await recoverPrfSeed();
 
     this.#prfSeed = prfSeed;
     this.#ipnsKeyPair = await deriveIPNSKeyPair(prfSeed);
@@ -415,9 +452,9 @@ export class IdentityService {
   /**
    * Create a new worker-mode Ed25519 identity.
    */
-  async #createWorkerIdentity(authenticatorType) {
+  async #createWorkerIdentity(authenticatorType, webauthnUserLabel) {
     // Create WebAuthn credential with PRF
-    const credential = await this.#createWebAuthnCredential(authenticatorType);
+    const credential = await this.#createWebAuthnCredential(authenticatorType, webauthnUserLabel);
 
     // Extract PRF seed
     const { seed: prfSeed } = await extractPrfSeedFromCredential(credential);
@@ -468,9 +505,10 @@ export class IdentityService {
   /**
    * Create a WebAuthn credential with PRF extension.
    */
-  async #createWebAuthnCredential(authenticatorType) {
+  async #createWebAuthnCredential(authenticatorType, webauthnUserLabel) {
     const challenge = crypto.getRandomValues(new Uint8Array(32));
     const prfSalt = await computeDeterministicPrfSalt();
+    const userEntity = await publicKeyCredentialUserFromLabel(webauthnUserLabel);
 
     const createOptions = {
       publicKey: {
@@ -479,9 +517,9 @@ export class IdentityService {
           id: globalThis.location?.hostname || 'localhost',
         },
         user: {
-          id: crypto.getRandomValues(new Uint8Array(16)),
-          name: 'p2p-user',
-          displayName: 'P2P User',
+          id: userEntity.id,
+          name: userEntity.name,
+          displayName: userEntity.displayName,
         },
         challenge,
         pubKeyCredParams: [

package/dist/index.d.ts

@@ -1,12 +1,13 @@
 export const VERSION: "0.1.0";
-export { default as StorachaIntegration } from "./ui/StorachaIntegration.svelte";
-export { default as StorachaFab } from "./ui/StorachaFab.svelte";
 export { MultiDeviceManager } from "./registry/manager.js";
+import StorachaIntegration from './ui/StorachaIntegration.svelte';
+import StorachaFab from './ui/StorachaFab.svelte';
+export { StorachaIntegration, StorachaFab };
 export { IdentityService, hasLocalPasskeyHint } from "./identity/identity-service.js";
 export { detectSigningMode, getStoredSigningMode } from "./identity/mode-detector.js";
 export { SIGNING_PREFERENCE_STORAGE_KEY, SIGNING_PREFERENCE_LIST, isSigningPreference, readSigningPreferenceFromStorage, writeSigningPreferenceToStorage, resolveSigningPreference } from "./identity/signing-preference.js";
-export { createStorachaClient, parseDelegation, storeDelegation, loadStoredDelegation, clearStoredDelegation } from "./ucan/storacha-auth.js";
-export { openDeviceRegistry, registerDevice, listDevices, getDeviceByCredentialId, getDeviceByDID, grantDeviceWriteAccess, revokeDeviceAccess, hashCredentialId, coseToJwk, storeDelegationEntry, listDelegations, getDelegation, removeDelegation, storeArchiveEntry, getArchiveEntry, storeKeypairEntry, getKeypairEntry, listKeypairs } from "./registry/device-registry.js";
+export { createStorachaClient, parseDelegation, storeDelegation, loadStoredDelegation, clearStoredDelegation, formatDelegationsTooltipSummary } from "./ucan/storacha-auth.js";
+export { openDeviceRegistry, registerDevice, listDevices, getDeviceByCredentialId, getDeviceByDID, grantDeviceWriteAccess, revokeDeviceAccess, removeDeviceEntry, delegationCountForDevice, delegationsEntriesForDevice, hashCredentialId, coseToJwk, storeDelegationEntry, listDelegations, getDelegation, removeDelegation, storeArchiveEntry, getArchiveEntry, storeKeypairEntry, getKeypairEntry, listKeypairs } from "./registry/device-registry.js";
 export { LINK_DEVICE_PROTOCOL, registerLinkDeviceHandler, unregisterLinkDeviceHandler, sendPairingRequest, detectDeviceLabel, sortPairingMultiaddrs, filterPairingDialMultiaddrs, pairingFlow, PAIRING_HINT_ADDR_CAP } from "./registry/pairing-protocol.js";
 export { setupP2PStack, createLibp2pInstance, createHeliaInstance, cleanupP2PStack } from "./p2p/setup.js";
 export { listSpaces, getSpaceUsage, listStorachaFiles } from "./ui/storacha-backup.js";

package/dist/index.js

@@ -1,9 +1,10 @@
 // @le-space/p2pass — public API
 export const VERSION = '0.1.0';
 
-// UI components
-export { default as StorachaIntegration } from './ui/StorachaIntegration.svelte';
-export { default as StorachaFab } from './ui/StorachaFab.svelte';
+// Explicit default bindings (not `export { default as X } from`) — avoids star-export / default resolution errors in Vite.
+import StorachaIntegration from './ui/StorachaIntegration.svelte';
+import StorachaFab from './ui/StorachaFab.svelte';
+export { StorachaIntegration, StorachaFab };
 
 // Identity
 export { IdentityService, hasLocalPasskeyHint } from './identity/identity-service.js';
@@ -24,6 +25,7 @@ export {
   storeDelegation,
   loadStoredDelegation,
   clearStoredDelegation,
+  formatDelegationsTooltipSummary,
 } from './ucan/storacha-auth.js';
 
 // Registry (multi-device + credential storage)
@@ -36,6 +38,9 @@ export {
   getDeviceByDID,
   grantDeviceWriteAccess,
   revokeDeviceAccess,
+  removeDeviceEntry,
+  delegationCountForDevice,
+  delegationsEntriesForDevice,
   hashCredentialId,
   coseToJwk,
   storeDelegationEntry,

package/dist/registry/device-registry.d.ts

@@ -23,7 +23,7 @@ export function openDeviceRegistry(orbitdb: Object, ownerIdentityId: string, add
 /**
  * Register a device entry in the registry.
  * @param {Object} db - OrbitDB KV database
- * @param {Object} entry - { credential_id, public_key, device_label, created_at, status, ed25519_did }
+ * @param {Object} entry - { credential_id, public_key, device_label, created_at, status, ed25519_did, passkey_kind? }
  */
 export function registerDevice(db: Object, entry: Object): Promise<void>;
 /**
@@ -58,14 +58,46 @@ export function grantDeviceWriteAccess(db: Object, did: string): Promise<void>;
  * @param {string} did - Ed25519 DID to revoke
  */
 export function revokeDeviceAccess(db: Object, did: string): Promise<void>;
+/**
+ * Revoke a device's write access and remove its registry row (OrbitDB KV key).
+ *
+ * @param {Object} db - OrbitDB KV database
+ * @param {string} credentialId - device entry credential_id (same string used at registration)
+ * @returns {Promise<boolean>} true if an entry was removed
+ */
+export function removeDeviceEntry(db: Object, credentialId: string): Promise<boolean>;
+/**
+ * UCAN delegations attributed to a device (stored_by_did). Entries without stored_by_did count toward ownerDidForLegacy only.
+ *
+ * @param {Array<{ stored_by_did?: string }>} delegations
+ * @param {string} deviceDid
+ * @param {string} [ownerDidForLegacy]
+ * @returns {number}
+ */
+export function delegationCountForDevice(delegations: Array<{
+    stored_by_did?: string;
+}>, deviceDid: string, ownerDidForLegacy?: string): number;
+/**
+ * Registry delegation rows attributed to a device (same rules as {@link delegationCountForDevice}).
+ *
+ * @param {Array<{ stored_by_did?: string, delegation?: string }>} delegations
+ * @param {string} deviceDid
+ * @param {string} [ownerDidForLegacy]
+ * @returns {Array<Record<string, unknown>>}
+ */
+export function delegationsEntriesForDevice(delegations: Array<{
+    stored_by_did?: string;
+    delegation?: string;
+}>, deviceDid: string, ownerDidForLegacy?: string): Array<Record<string, unknown>>;
 /**
  * Store a UCAN delegation in the registry.
  * @param {Object} db - OrbitDB KV database
  * @param {string} delegationBase64 - raw delegation string
  * @param {string} [spaceDid] - Storacha space DID
  * @param {string} [label] - human-readable label
+ * @param {string} [storedByDid] - Ed25519 DID of the device that stored this delegation (for per-device UI)
  */
-export function storeDelegationEntry(db: Object, delegationBase64: string, spaceDid?: string, label?: string): Promise<void>;
+export function storeDelegationEntry(db: Object, delegationBase64: string, spaceDid?: string, label?: string, storedByDid?: string): Promise<void>;
 /**
  * List all stored UCAN delegations.
  * @param {Object} db - OrbitDB KV database

package/dist/registry/device-registry.js

@@ -81,7 +81,7 @@ export async function openDeviceRegistry(orbitdb, ownerIdentityId, address = nul
 /**
  * Register a device entry in the registry.
  * @param {Object} db - OrbitDB KV database
- * @param {Object} entry - { credential_id, public_key, device_label, created_at, status, ed25519_did }
+ * @param {Object} entry - { credential_id, public_key, device_label, created_at, status, ed25519_did, passkey_kind? }
  */
 export async function registerDevice(db, entry) {
   const key = await hashCredentialId(entry.credential_id);
@@ -153,6 +153,72 @@ export async function revokeDeviceAccess(db, did) {
   }
 }
 
+/**
+ * Revoke a device's write access and remove its registry row (OrbitDB KV key).
+ *
+ * @param {Object} db - OrbitDB KV database
+ * @param {string} credentialId - device entry credential_id (same string used at registration)
+ * @returns {Promise<boolean>} true if an entry was removed
+ */
+export async function removeDeviceEntry(db, credentialId) {
+  const key = await hashCredentialId(credentialId);
+  const entry = await db.get(key);
+  if (!entry) return false;
+  const did = entry.ed25519_did;
+  try {
+    if (did) await db.access.revoke('write', did);
+  } catch (err) {
+    console.warn('[device-registry] revoke write before del:', err?.message);
+  }
+  await db.del(key);
+  return true;
+}
+
+/**
+ * UCAN delegations attributed to a device (stored_by_did). Entries without stored_by_did count toward ownerDidForLegacy only.
+ *
+ * @param {Array<{ stored_by_did?: string }>} delegations
+ * @param {string} deviceDid
+ * @param {string} [ownerDidForLegacy]
+ * @returns {number}
+ */
+export function delegationCountForDevice(delegations, deviceDid, ownerDidForLegacy) {
+  if (!deviceDid) return 0;
+  let n = 0;
+  for (const d of delegations) {
+    if (d.stored_by_did === deviceDid) n++;
+  }
+  if (ownerDidForLegacy && deviceDid === ownerDidForLegacy) {
+    for (const d of delegations) {
+      if (!d.stored_by_did) n++;
+    }
+  }
+  return n;
+}
+
+/**
+ * Registry delegation rows attributed to a device (same rules as {@link delegationCountForDevice}).
+ *
+ * @param {Array<{ stored_by_did?: string, delegation?: string }>} delegations
+ * @param {string} deviceDid
+ * @param {string} [ownerDidForLegacy]
+ * @returns {Array<Record<string, unknown>>}
+ */
+export function delegationsEntriesForDevice(delegations, deviceDid, ownerDidForLegacy) {
+  if (!deviceDid) return [];
+  /** @type {Array<Record<string, unknown>>} */
+  const out = [];
+  for (const d of delegations) {
+    if (d.stored_by_did === deviceDid) out.push(d);
+  }
+  if (ownerDidForLegacy && deviceDid === ownerDidForLegacy) {
+    for (const d of delegations) {
+      if (!d.stored_by_did) out.push(d);
+    }
+  }
+  return out;
+}
+
 // ---------------------------------------------------------------------------
 // UCAN delegation entries
 // ---------------------------------------------------------------------------
@@ -163,8 +229,9 @@ export async function revokeDeviceAccess(db, did) {
  * @param {string} delegationBase64 - raw delegation string
  * @param {string} [spaceDid] - Storacha space DID
  * @param {string} [label] - human-readable label
+ * @param {string} [storedByDid] - Ed25519 DID of the device that stored this delegation (for per-device UI)
  */
-export async function storeDelegationEntry(db, delegationBase64, spaceDid, label) {
+export async function storeDelegationEntry(db, delegationBase64, spaceDid, label, storedByDid) {
   const hash = await hashCredentialId(delegationBase64);
   const key = `delegation:${hash}`;
   await db.put(key, {
@@ -172,6 +239,7 @@ export async function storeDelegationEntry(db, delegationBase64, spaceDid, label
     space_did: spaceDid || '',
     label: label || 'default',
     created_at: Date.now(),
+    stored_by_did: storedByDid || '',
   });
 }
 

package/dist/registry/index.d.ts

@@ -1,3 +1,3 @@
 export { MultiDeviceManager } from "./manager.js";
-export { openDeviceRegistry, registerDevice, listDevices, getDeviceByCredentialId, getDeviceByDID, grantDeviceWriteAccess, revokeDeviceAccess, hashCredentialId, coseToJwk, storeDelegationEntry, listDelegations, getDelegation, removeDelegation, storeArchiveEntry, getArchiveEntry, storeKeypairEntry, getKeypairEntry, listKeypairs } from "./device-registry.js";
+export { openDeviceRegistry, registerDevice, listDevices, getDeviceByCredentialId, getDeviceByDID, grantDeviceWriteAccess, revokeDeviceAccess, removeDeviceEntry, delegationCountForDevice, delegationsEntriesForDevice, hashCredentialId, coseToJwk, storeDelegationEntry, listDelegations, getDelegation, removeDelegation, storeArchiveEntry, getArchiveEntry, storeKeypairEntry, getKeypairEntry, listKeypairs } from "./device-registry.js";
 export { LINK_DEVICE_PROTOCOL, registerLinkDeviceHandler, unregisterLinkDeviceHandler, sendPairingRequest, detectDeviceLabel, sortPairingMultiaddrs, filterPairingDialMultiaddrs, pairingFlow, PAIRING_HINT_ADDR_CAP } from "./pairing-protocol.js";

package/dist/registry/index.js

@@ -13,6 +13,9 @@ export {
   getDeviceByDID,
   grantDeviceWriteAccess,
   revokeDeviceAccess,
+  removeDeviceEntry,
+  delegationCountForDevice,
+  delegationsEntriesForDevice,
   hashCredentialId,
   coseToJwk,
   // Delegation storage

package/dist/registry/manager.d.ts

@@ -59,6 +59,11 @@ export class MultiDeviceManager {
     listDevices(): Promise<any[]>;
     syncDevices(): Promise<void>;
     revokeDevice(did: any): Promise<void>;
+    /**
+     * Remove a device row from the registry and revoke its OrbitDB write access.
+     * @param {string} credentialId - value stored as device entry `credential_id`
+     */
+    removeLinkedDevice(credentialId: string): Promise<boolean>;
     processIncomingPairingRequest(requestMsg: any): Promise<{
         type: string;
         orbitdbAddress: any;

package/dist/registry/manager.js

@@ -13,6 +13,7 @@ import {
   getDeviceByDID,
   grantDeviceWriteAccess,
   revokeDeviceAccess,
+  removeDeviceEntry,
   coseToJwk,
 } from './device-registry.js';
 
@@ -140,6 +141,7 @@ export class MultiDeviceManager {
       created_at: Date.now(),
       status: 'active',
       ed25519_did: this._identity.id,
+      passkey_kind: this._identity.passkeyKind || null,
     });
 
     await this.syncDevices();
@@ -247,6 +249,7 @@ export class MultiDeviceManager {
           this._credential?.credentialId || this._credential?.id || this._libp2p.peerId.toString(),
         publicKey: null,
         deviceLabel: detectDeviceLabel(),
+        passkeyKind: this._identity.passkeyKind || null,
       },
       multiaddrs
     );
@@ -325,6 +328,15 @@ export class MultiDeviceManager {
     await revokeDeviceAccess(this._devicesDb, did);
   }
 
+  /**
+   * Remove a device row from the registry and revoke its OrbitDB write access.
+   * @param {string} credentialId - value stored as device entry `credential_id`
+   */
+  async removeLinkedDevice(credentialId) {
+    if (!this._devicesDb) throw new Error('Device registry not initialized');
+    return removeDeviceEntry(this._devicesDb, credentialId);
+  }
+
   async processIncomingPairingRequest(requestMsg) {
     if (!this._devicesDb) throw new Error('Device registry not initialized');
     const { identity } = requestMsg;
@@ -348,6 +360,7 @@ export class MultiDeviceManager {
         created_at: Date.now(),
         status: 'active',
         ed25519_did: identity.id,
+        passkey_kind: identity.passkeyKind || null,
       });
       return { type: 'granted', orbitdbAddress: this._dbAddress };
     }

package/dist/registry/pairing-protocol.d.ts

@@ -42,7 +42,7 @@ export function detectDeviceLabel(): string;
  *
  * @param {Object} libp2p - libp2p instance (Device B)
  * @param {string|Object} deviceAPeerId - peerId string or PeerId object of Device A
- * @param {Object} identity - { id, credentialId, publicKey?, deviceLabel? }
+ * @param {Object} identity - { id, credentialId, publicKey?, deviceLabel?, passkeyKind? }
  * @param {string[]} [hintMultiaddrs] - Known multiaddrs for Device A (from QR payload)
  * @returns {Promise<{type: 'granted', orbitdbAddress: string}|{type: 'rejected', reason: string}>}
  */

package/dist/registry/pairing-protocol.js

@@ -4,7 +4,7 @@
  * Protocol: /orbitdb/link-device/1.0.0
  *
  * Message flow:
- *   Device B → Device A: { type: 'request', identity: { id, credentialId, deviceLabel } }
+ *   Device B → Device A: { type: 'request', identity: { id, credentialId, deviceLabel, passkeyKind?, ... } }
  *   Device A → Device B: { type: 'granted', orbitdbAddress } | { type: 'rejected', reason }
  *
  * Copied from orbitdb-identity-provider-webauthn-did/src/multi-device/pairing-protocol.js
@@ -330,12 +330,14 @@ export async function registerLinkDeviceHandler(libp2p, db, onRequest, onDeviceL
           result = { type: 'granted', orbitdbAddress: db.address };
           if (isKnown && onDeviceLinked) {
             onDeviceLinked({
+              ...isKnown,
               credential_id: identity.credentialId,
-              public_key: identity.publicKey || null,
-              device_label: identity.deviceLabel || 'Linked Device',
+              public_key: identity.publicKey ?? isKnown.public_key ?? null,
+              device_label: identity.deviceLabel || isKnown.device_label || 'Linked Device',
               created_at: isKnown.created_at || Date.now(),
               status: 'active',
               ed25519_did: identity.id,
+              passkey_kind: identity.passkeyKind || isKnown.passkey_kind || null,
             });
           }
         } else {
@@ -365,6 +367,7 @@ export async function registerLinkDeviceHandler(libp2p, db, onRequest, onDeviceL
               created_at: Date.now(),
               status: 'active',
               ed25519_did: identity.id,
+              passkey_kind: identity.passkeyKind || null,
             };
             try {
               await registerDevice(db, deviceEntry);
@@ -528,7 +531,7 @@ export function detectDeviceLabel() {
  *
  * @param {Object} libp2p - libp2p instance (Device B)
  * @param {string|Object} deviceAPeerId - peerId string or PeerId object of Device A
- * @param {Object} identity - { id, credentialId, publicKey?, deviceLabel? }
+ * @param {Object} identity - { id, credentialId, publicKey?, deviceLabel?, passkeyKind? }
  * @param {string[]} [hintMultiaddrs] - Known multiaddrs for Device A (from QR payload)
  * @returns {Promise<{type: 'granted', orbitdbAddress: string}|{type: 'rejected', reason: string}>}
  */
@@ -628,6 +631,7 @@ export async function sendPairingRequest(libp2p, deviceAPeerId, identity, hintMu
       credentialId: identity.credentialId,
       publicKey: identity.publicKey || null,
       deviceLabel: identity.deviceLabel || detectDeviceLabel(),
+      passkeyKind: identity.passkeyKind || null,
     },
   };
   pairingFlow('BOB', 'sending link-device REQUEST (length-prefixed JSON) to Alice', {

package/dist/ucan/storacha-auth.d.ts

@@ -24,8 +24,9 @@ export function parseDelegation(proofString: string): Promise<any>;
  * @param {string} delegationBase64
  * @param {Object} [registryDb] - OrbitDB registry database
  * @param {string} [spaceDid] - Storacha space DID (for registry metadata)
+ * @param {string} [storedByDid] - device DID that imported the delegation (per-device counts in UI)
  */
-export function storeDelegation(delegationBase64: string, registryDb?: Object, spaceDid?: string): Promise<void>;
+export function storeDelegation(delegationBase64: string, registryDb?: Object, spaceDid?: string, storedByDid?: string): Promise<void>;
 /**
  * Load a stored delegation string.
  * Reads from registry DB if provided, otherwise localStorage.
@@ -43,3 +44,15 @@ export function loadStoredDelegation(registryDb?: Object): Promise<string | null
  * @param {string} [delegationBase64] - specific delegation to remove (if omitted, removes all)
  */
 export function clearStoredDelegation(registryDb?: Object, delegationBase64?: string): Promise<void>;
+/**
+ * Multi-line text suitable for a native HTML `title` on the linked-device UCAN badge.
+ * Parses each stored delegation via {@link parseDelegation}.
+ *
+ * @param {Array<{ delegation?: string, space_did?: string, label?: string }>} entries
+ * @returns {Promise<string>}
+ */
+export function formatDelegationsTooltipSummary(entries: Array<{
+    delegation?: string;
+    space_did?: string;
+    label?: string;
+}>): Promise<string>;

package/dist/ucan/storacha-auth.js

@@ -98,11 +98,12 @@ export async function parseDelegation(proofString) {
  * @param {string} delegationBase64
  * @param {Object} [registryDb] - OrbitDB registry database
  * @param {string} [spaceDid] - Storacha space DID (for registry metadata)
+ * @param {string} [storedByDid] - device DID that imported the delegation (per-device counts in UI)
  */
-export async function storeDelegation(delegationBase64, registryDb, spaceDid) {
+export async function storeDelegation(delegationBase64, registryDb, spaceDid, storedByDid) {
   if (registryDb) {
     try {
-      await storeDelegationEntry(registryDb, delegationBase64, spaceDid);
+      await storeDelegationEntry(registryDb, delegationBase64, spaceDid, undefined, storedByDid);
       console.log('[storacha] Delegation stored in registry DB');
       return;
     } catch (err) {
@@ -162,3 +163,120 @@ export async function clearStoredDelegation(registryDb, delegationBase64) {
     localStorage.removeItem(STORAGE_KEY_DELEGATION);
   }
 }
+
+/** Max characters for native `title` tooltips (browser-dependent display). */
+const DELEGATION_TOOLTIP_MAX = 1200;
+
+/**
+ * @param {string} s
+ * @param {number} max
+ */
+function truncateMiddle(s, max) {
+  if (s.length <= max) return s;
+  const half = Math.floor((max - 1) / 2);
+  return `${s.slice(0, half)}…${s.slice(s.length - half)}`;
+}
+
+/**
+ * @param {unknown} p - UCANTO principal or string
+ */
+function principalDid(p) {
+  if (p == null) return '—';
+  if (typeof p === 'string') return p;
+  if (typeof p === 'object' && p !== null && 'did' in p && typeof p.did === 'function') {
+    try {
+      return /** @type {{ did: () => string }} */ (p).did();
+    } catch {
+      return String(p);
+    }
+  }
+  return String(p);
+}
+
+/**
+ * @param {unknown} exp - UCAN expiration (seconds or ms since epoch)
+ */
+function formatUcanExpiration(exp) {
+  if (exp == null) return null;
+  const n = typeof exp === 'bigint' ? Number(exp) : Number(exp);
+  if (!Number.isFinite(n) || n <= 0) return null;
+  const ms = n > 1e12 ? n : n * 1000;
+  try {
+    return new Date(ms).toUTCString();
+  } catch {
+    return String(exp);
+  }
+}
+
+/**
+ * @param {any} d - Parsed delegation from {@link parseDelegation}
+ * @returns {string}
+ */
+function summarizeParsedDelegationForTooltip(d) {
+  const lines = [];
+  lines.push(`Issuer: ${truncateMiddle(principalDid(d?.issuer), 64)}`);
+  lines.push(`Audience: ${truncateMiddle(principalDid(d?.audience), 64)}`);
+  const expStr = formatUcanExpiration(d?.expiration);
+  if (expStr) lines.push(`Expires: ${expStr}`);
+  const nbStr = formatUcanExpiration(d?.notBefore);
+  if (nbStr) lines.push(`Not before: ${nbStr}`);
+  const caps = d?.capabilities;
+  if (Array.isArray(caps) && caps.length > 0) {
+    const shown = caps.slice(0, 6).map((c) => {
+      const can = c?.can ?? '?';
+      const w = c?.with != null ? String(c.with) : '—';
+      return `${can} → ${truncateMiddle(w, 48)}`;
+    });
+    let capBlock = shown.join('\n');
+    if (caps.length > 6) capBlock += `\n… +${caps.length - 6} more`;
+    lines.push(`Capabilities:\n${capBlock}`);
+  }
+  const facts = d?.facts;
+  if (Array.isArray(facts) && facts.length > 0) {
+    lines.push(`Facts: ${facts.length} attached`);
+  }
+  try {
+    if (d?.cid != null) lines.push(`Root CID: ${truncateMiddle(String(d.cid), 72)}`);
+  } catch {
+    /* ignore */
+  }
+  return lines.join('\n');
+}
+
+/**
+ * Multi-line text suitable for a native HTML `title` on the linked-device UCAN badge.
+ * Parses each stored delegation via {@link parseDelegation}.
+ *
+ * @param {Array<{ delegation?: string, space_did?: string, label?: string }>} entries
+ * @returns {Promise<string>}
+ */
+export async function formatDelegationsTooltipSummary(entries) {
+  if (!Array.isArray(entries) || entries.length === 0) {
+    return 'No UCAN delegations';
+  }
+  const blocks = [];
+  for (let i = 0; i < entries.length; i++) {
+    const e = entries[i];
+    const raw = e?.delegation;
+    if (typeof raw !== 'string' || !raw.trim()) continue;
+    let head =
+      entries.length > 1 ? `Delegation ${i + 1} of ${entries.length}` : 'UCAN delegation';
+    if (e.space_did) head += ` · Space ${truncateMiddle(e.space_did, 40)}`;
+    if (e.label && e.label !== 'default') head += ` · ${e.label}`;
+    try {
+      const parsed = await parseDelegation(raw);
+      blocks.push(`${head}\n${summarizeParsedDelegationForTooltip(parsed)}`);
+    } catch (err) {
+      const msg =
+        err && typeof err === 'object' && 'message' in err
+          ? String(/** @type {{ message: string }} */ (err).message)
+          : String(err);
+      blocks.push(`${head}\n(parse failed: ${truncateMiddle(msg, 100)})`);
+    }
+  }
+  if (blocks.length === 0) return 'No valid delegation payloads';
+  const joined = blocks.join('\n\n────────\n\n');
+  return joined.length > DELEGATION_TOOLTIP_MAX
+    ? truncateMiddle(joined, DELEGATION_TOOLTIP_MAX)
+    : joined;
+}

package/dist/ui/StorachaFab.svelte

@@ -13,16 +13,41 @@
     libp2p = null,
     preferWorkerMode = false,
     signingPreference = null,
+    /** When false, hide the floating FAB (e.g. host app opens the panel from the footer). */
+    fabVisible = true,
+    /**
+     * When set, panel open state is synced with this store so the host can toggle from a footer control.
+     * @type {import('svelte/store').Writable<boolean> | null}
+     */
+    panelOpenStore = null,
   } = $props();
 
   let showPanel = $state(false);
   let isHovered = $state(false);
+
+  function setPanelOpen(/** @type {boolean} */ v) {
+    showPanel = v;
+    panelOpenStore?.set(v);
+  }
+
+  function togglePanel() {
+    setPanelOpen(!showPanel);
+  }
+
+  $effect(() => {
+    if (!panelOpenStore) return;
+    const unsub = panelOpenStore.subscribe((v) => {
+      showPanel = v;
+    });
+    return unsub;
+  });
 </script>
 
 <!-- Floating Storacha FAB Button -->
+{#if fabVisible}
 <button
   data-testid="storacha-fab-toggle"
-  onclick={() => (showPanel = !showPanel)}
+  onclick={() => togglePanel()}
   onmouseenter={() => (isHovered = true)}
   onmouseleave={() => (isHovered = false)}
   title={showPanel ? 'Hide P2Pass panel' : 'Open P2Pass — passkey & UCAN, peer-to-peer'}
@@ -84,13 +109,14 @@
     />
   </svg>
 </button>
+{/if}
 
 <!-- Backdrop overlay -->
 {#if showPanel}
   <!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
   <div
-    onclick={() => (showPanel = false)}
-    onkeydown={(e) => e.key === 'Escape' && (showPanel = false)}
+    onclick={() => setPanelOpen(false)}
+    onkeydown={(e) => e.key === 'Escape' && setPanelOpen(false)}
     role="presentation"
     style="
 			position: fixed;
@@ -125,7 +151,7 @@
     {onBackup}
     {onAuthenticate}
     onPairingPromptOpen={() => {
-      showPanel = true;
+      setPanelOpen(true);
     }}
     {libp2p}
     {preferWorkerMode}

package/dist/ui/StorachaIntegration.svelte

@@ -4,8 +4,15 @@
     readSigningPreferenceFromStorage,
     writeSigningPreferenceToStorage,
   } from '../identity/signing-preference.js';
-  import { Upload, LogOut, Loader2, AlertCircle, CheckCircle, Download } from 'lucide-svelte';
-  import { listSpaces, getSpaceUsage } from './storacha-backup.js';
+  // Per-icon entrypoints avoid the root `lucide-svelte` barrel (`export *`), which can trigger
+  // "Importing binding name 'default' cannot be resolved by star export entries" in strict ESM.
+  import Upload from 'lucide-svelte/icons/upload';
+  import LogOut from 'lucide-svelte/icons/log-out';
+  import Loader2 from 'lucide-svelte/icons/loader-2';
+  import AlertCircle from 'lucide-svelte/icons/alert-circle';
+  import CheckCircle from 'lucide-svelte/icons/check-circle';
+  import Download from 'lucide-svelte/icons/download';
+  import { getSpaceUsage } from './storacha-backup.js';
   import { OrbitDBStorachaBridge } from 'orbitdb-storacha-bridge';
   import { IdentityService, hasLocalPasskeyHint } from '../identity/identity-service.js';
   import { getStoredSigningMode } from '../identity/mode-detector.js';
@@ -15,6 +22,7 @@
     storeDelegation,
     loadStoredDelegation,
     clearStoredDelegation,
+    formatDelegationsTooltipSummary,
   } from '../ucan/storacha-auth.js';
   import {
     openDeviceRegistry,
@@ -27,8 +35,10 @@
     storeArchiveEntry,
     listDelegations,
     storeDelegationEntry,
+    removeDeviceEntry,
+    delegationsEntriesForDevice,
+    hashCredentialId,
   } from '../registry/device-registry.js';
-  import { deriveIPNSKeyPair } from '../recovery/ipns-key.js';
   import {
     createManifest,
     publishManifest,
@@ -36,7 +46,7 @@
     uploadArchiveToIPFS,
     fetchArchiveFromIPFS,
   } from '../recovery/manifest.js';
-  import { backupRegistryDb, restoreRegistryDb } from '../backup/registry-backup.js';
+  import { backupRegistryDb } from '../backup/registry-backup.js';
   import { MultiDeviceManager } from '../registry/manager.js';
   import { detectDeviceLabel, pairingFlow } from '../registry/pairing-protocol.js';
   import { loadWebAuthnCredentialSafe } from '@le-space/orbitdb-identity-provider-webauthn-did/standalone';
@@ -87,10 +97,95 @@
     return '\uD83D\uDCF1';
   }
 
+  /** @param {{ mode?: string, algorithm?: string } | null} sm */
+  function passkeyKindFromSigningMode(sm) {
+    if (!sm) return null;
+    if (sm.mode === 'worker') return 'worker-ed25519';
+    if (sm.algorithm === 'P-256') return 'hardware-p256';
+    return 'hardware-ed25519';
+  }
+
+  /** Passkey kind label for a registry device row (stored passkey_kind, else local session). */
+  function linkedDevicePasskeyLabel(/** @type {Record<string, unknown>} */ device) {
+    const k = device.passkey_kind;
+    if (typeof k === 'string' && k) return k;
+    if (signingMode?.did && device.ed25519_did === signingMode.did) {
+      return passkeyKindFromSigningMode(signingMode);
+    }
+    return null;
+  }
+
+  /** UCAN delegation counts keyed by device DID (see {@link delegationsEntriesForDevice}). */
+  let ucanCountsByDid = $state(/** @type {Record<string, number>} */ ({}));
+  /** Parsed UCAN summary for each device row’s badge `title`. */
+  let ucanTooltipByDid = $state(/** @type {Record<string, string>} */ ({}));
+
+  async function refreshLinkedDeviceDelegationCounts() {
+    if (!registryDb) {
+      ucanCountsByDid = {};
+      ucanTooltipByDid = {};
+      return;
+    }
+    try {
+      const delegations = await listDelegations(registryDb);
+      const ownerDid = localStorage.getItem(OWNER_DID_KEY) || signingMode?.did || '';
+      /** @type {Record<string, number>} */
+      const next = {};
+      /** @type {Record<string, string>} */
+      const tips = {};
+      for (const dev of devices) {
+        const did = dev.ed25519_did;
+        if (typeof did !== 'string' || !did) continue;
+        const entries = delegationsEntriesForDevice(delegations, did, ownerDid);
+        next[did] = entries.length;
+        if (entries.length > 0) {
+          tips[did] = await formatDelegationsTooltipSummary(
+            /** @type {Array<{ delegation?: string, space_did?: string, label?: string }>} */ (
+              entries
+            )
+          );
+        }
+      }
+      ucanCountsByDid = next;
+      ucanTooltipByDid = tips;
+    } catch {
+      ucanCountsByDid = {};
+      ucanTooltipByDid = {};
+    }
+  }
+
+  async function confirmRemoveLinkedDevice(/** @type {Record<string, unknown>} */ device) {
+    const label = String(device.device_label || device.ed25519_did || 'this device');
+    const credId = device.credential_id;
+    if (typeof credId !== 'string' || !credId) {
+      showMessage('Cannot remove device: missing credential id.', 'error');
+      return;
+    }
+    if (
+      !confirm(
+        `Remove linked device "${label}" from the registry? Its OrbitDB write access will be revoked.`
+      )
+    ) {
+      return;
+    }
+    const db = deviceManager?.getRegistryDb?.() ?? registryDb;
+    if (!db) {
+      showMessage('Cannot remove device: registry not ready.', 'error');
+      return;
+    }
+    try {
+      await removeDeviceEntry(db, credId);
+      devices = devices.filter((d) => d.ed25519_did !== device.ed25519_did);
+      await refreshLinkedDeviceDelegationCounts();
+      showMessage('Device removed from linked devices.');
+    } catch (err) {
+      showMessage(`Failed to remove device: ${err?.message || err}`, 'error');
+    }
+  }
+
   // Component state
   let showStoracha = $state(true);
   let isLoading = $state(false);
-  let status = $state('');
   let error = $state(null);
   let success = $state(null);
 
@@ -116,7 +211,8 @@
   let signingMode = $state(null); // { mode, did, algorithm, secure }
   let delegationText = $state(''); // textarea for pasting delegation
   let isAuthenticating = $state(false);
-  let spaces = $state([]);
+  /** Shown when creating a new passkey; sent as WebAuthn user.id / name / displayName (worker path). */
+  let passkeyUserLabel = $state('');
   let spaceUsage = $state(null);
 
   // Registry DB state
@@ -226,6 +322,15 @@
     };
   });
 
+  /** Per-device UCAN delegation counts for linked-device badges. */
+  $effect(() => {
+    registryDb;
+    devices;
+    signingMode?.did;
+    isLoggedIn;
+    void refreshLinkedDeviceDelegationCounts();
+  });
+
   /** Start MultiDeviceManager once libp2p + registry exist (handles restored signingMode / late orbitdb). */
   $effect(() => {
     if (!signingMode?.did || !orbitdb || !libp2p || !registryDb || deviceManager) return;
@@ -299,16 +404,13 @@
     }, 5000);
   }
 
-  function clearForms() {
-    delegationText = '';
-  }
-
   async function handleAuthenticate() {
     isAuthenticating = true;
     try {
       signingMode = await identityService.initialize(undefined, {
         preferWorkerMode,
         signingPreference: signingPreferenceOverride ?? selectedSigningPreference,
+        ...(localPasskeyDetected ? {} : { webauthnUserLabel: passkeyUserLabel }),
       });
       showMessage(`Authenticated! Mode: ${signingMode.algorithm} (${signingMode.mode})`);
 
@@ -348,7 +450,12 @@
 
     if (store) {
       const spaceDid = storeSpaceDid || client.currentSpace()?.did?.() || '';
-      await storeDelegation(delegationStr, storeRegistryDb, spaceDid);
+      await storeDelegation(
+        delegationStr,
+        storeRegistryDb,
+        spaceDid,
+        signingMode?.did || ''
+      );
     }
 
     currentSpace = client.currentSpace();
@@ -556,7 +663,14 @@
     if (!registryDb || !signingMode?.did) return;
     try {
       const existing = await getDeviceByDID(registryDb, signingMode.did);
-      if (existing) return;
+      const kind = passkeyKindFromSigningMode(signingMode);
+      if (existing) {
+        if (kind && !existing.passkey_kind) {
+          const k = await hashCredentialId(existing.credential_id);
+          await registryDb.put(k, { ...existing, passkey_kind: kind });
+        }
+        return;
+      }
       const credential = loadWebAuthnCredentialSafe();
       await registerDevice(registryDb, {
         credential_id:
@@ -572,6 +686,7 @@
         created_at: Date.now(),
         status: 'active',
         ed25519_did: signingMode.did,
+        passkey_kind: kind,
       });
       console.log('[ui] Self-registered device in registry');
     } catch (err) {
@@ -629,7 +744,7 @@
         credential,
         orbitdb,
         libp2p,
-        identity: { id: signingMode.did },
+        identity: { id: signingMode.did, passkeyKind: passkeyKindFromSigningMode(signingMode) },
         onPairingRequest: async (request) => {
           pairingFlow(
             'ALICE',
@@ -737,7 +852,13 @@
           await storeArchiveEntry(newDb, did, archive.ciphertext, archive.iv);
         }
         for (const d of delegations) {
-          await storeDelegationEntry(newDb, d.delegation, d.space_did);
+          await storeDelegationEntry(
+            newDb,
+            d.delegation,
+            d.space_did,
+            d.label,
+            d.stored_by_did
+          );
         }
         console.log('[ui] Registry migration complete after', Date.now() - start, 'ms');
         return true;
@@ -890,7 +1011,6 @@
     isLoggedIn = false;
     client = null;
     currentSpace = null;
-    spaces = [];
     spaceUsage = null;
     signingMode = null;
     await clearStoredDelegation(registryDb);
@@ -912,21 +1032,6 @@
     }
   }
 
-  async function loadSpaces() {
-    if (!client) return;
-    isLoading = true;
-    status = 'Loading spaces...';
-    try {
-      spaces = await listSpaces(client);
-      await loadSpaceUsage();
-    } catch (err) {
-      showMessage(`Failed to load spaces: ${err.message}`, 'error');
-    } finally {
-      isLoading = false;
-      status = '';
-    }
-  }
-
   async function handleBackup() {
     if (!bridge) {
       showMessage('Please log in first', 'error');
@@ -943,7 +1048,6 @@
 
     isLoading = true;
     resetProgress();
-    status = 'Preparing backup...';
 
     try {
       // Backup user database if available
@@ -979,7 +1083,6 @@
       showMessage(`Backup failed: ${err.message}`, 'error');
     } finally {
       isLoading = false;
-      status = '';
       resetProgress();
     }
   }
@@ -992,12 +1095,10 @@
 
     isLoading = true;
     resetProgress();
-    status = 'Preparing restore...';
 
     try {
       // Close existing database if provided
       if (database) {
-        status = 'Closing existing database...';
         try {
           await database.close();
         } catch {
@@ -1005,8 +1106,6 @@
         }
       }
 
-      status = 'Starting restore...';
-
       if (!bridge) {
         throw new Error('Bridge not initialized. Please connect to Storacha first.');
       }
@@ -1028,7 +1127,6 @@
       showMessage(`Restore failed: ${err.message}`, 'error');
     } finally {
       isLoading = false;
-      status = '';
       resetProgress();
     }
   }
@@ -1158,11 +1256,12 @@
       </div>
     {:else}
       <div style="display: flex; flex-direction: column; gap: 0.375rem;">
-        {#each devices as device}
+        {#each devices as device, i (device.credential_id || device.ed25519_did || device.device_label || i)}
+          {@const passkeyBadge = linkedDevicePasskeyLabel(device)}
           <div
             data-testid="storacha-linked-device-row"
             data-device-label={device.device_label || ''}
-            style="display: flex; align-items: center; gap: 0.625rem; padding: 0.5rem; border-radius: 0.375rem; background: rgba(255, 255, 255, 0.7); border-left: 3px solid {device.status ===
+            style="display: flex; align-items: flex-start; gap: 0.625rem; padding: 0.5rem; border-radius: 0.375rem; background: rgba(255, 255, 255, 0.7); border-left: 3px solid {device.status ===
             'active'
               ? '#10b981'
               : '#E91315'};"
@@ -1181,17 +1280,53 @@
                   ? device.ed25519_did.slice(0, 16) + '...' + device.ed25519_did.slice(-8)
                   : 'N/A'}
               </code>
+              <div
+                style="display: flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.35rem; align-items: center;"
+              >
+                {#if passkeyBadge}
+                  <span
+                    style="font-size: 0.55rem; font-weight: 600; padding: 0.1rem 0.35rem; border-radius: 9999px; background: #e0e7ff; color: #3730a3; font-family: 'DM Mono', monospace;"
+                    title="Passkey signing mode for this device"
+                  >
+                    {passkeyBadge}
+                  </span>
+                {/if}
+                {#if device.ed25519_did && (ucanCountsByDid[device.ed25519_did] ?? 0) > 0}
+                  <span
+                    style="font-size: 0.55rem; font-weight: 600; padding: 0.1rem 0.35rem; border-radius: 9999px; background: #fef3c7; color: #92400e; font-family: 'DM Sans', sans-serif;"
+                    title={ucanTooltipByDid[device.ed25519_did]?.trim()
+                      ? ucanTooltipByDid[device.ed25519_did]
+                      : 'UCAN delegations on this device (parsing summary…)'}
+                  >
+                    {ucanCountsByDid[device.ed25519_did]}
+                    {ucanCountsByDid[device.ed25519_did] === 1 ? ' UCAN' : ' UCANs'}
+                  </span>
+                {/if}
+              </div>
             </div>
-            <span
-              style="font-size: 0.6rem; font-weight: 600; padding: 0.125rem 0.375rem; border-radius: 9999px; flex-shrink: 0; background: {device.status ===
-              'active'
-                ? '#dcfce7'
-                : '#fee2e2'}; color: {device.status === 'active'
-                ? '#166534'
-                : '#991b1b'}; font-family: 'DM Sans', sans-serif;"
+            <div
+              style="display: flex; flex-direction: column; align-items: flex-end; gap: 0.25rem; flex-shrink: 0;"
             >
-              {device.status}
-            </span>
+              <span
+                style="font-size: 0.6rem; font-weight: 600; padding: 0.125rem 0.375rem; border-radius: 9999px; background: {device.status ===
+                'active'
+                  ? '#dcfce7'
+                  : '#fee2e2'}; color: {device.status === 'active'
+                  ? '#166534'
+                  : '#991b1b'}; font-family: 'DM Sans', sans-serif;"
+              >
+                {device.status}
+              </span>
+              <button
+                type="button"
+                data-testid="storacha-linked-device-remove"
+                aria-label="Remove linked device"
+                onclick={() => confirmRemoveLinkedDevice(device)}
+                style="font-size: 0.6rem; font-weight: 600; padding: 0.15rem 0.4rem; border-radius: 0.25rem; background: transparent; color: #b91c1c; border: 1px solid #fca5a5; cursor: pointer; font-family: 'DM Sans', sans-serif;"
+              >
+                Remove
+              </button>
+            </div>
           </div>
         {/each}
       </div>
@@ -1516,6 +1651,33 @@
               </div>
             </fieldset>
 
+            {#if !localPasskeyDetected}
+              <label
+                style="display: flex; width: 100%; max-width: 22rem; flex-direction: column; align-items: stretch; gap: 0.35rem; text-align: left; box-sizing: border-box;"
+              >
+                <span
+                  style="font-size: 0.7rem; font-weight: 600; color: #374151; font-family: 'Epilogue', sans-serif;"
+                >
+                  Passkey name (WebAuthn user ID)
+                </span>
+                <input
+                  type="text"
+                  data-testid="storacha-passkey-user-label"
+                  bind:value={passkeyUserLabel}
+                  disabled={isAuthenticating || signingPreferenceOverride != null}
+                  placeholder="e.g. Work laptop"
+                  autocomplete="username"
+                  style="width: 100%; box-sizing: border-box; border-radius: 0.375rem; border: 1px solid rgba(233, 19, 21, 0.25); padding: 0.5rem 0.625rem; font-size: 0.8rem; font-family: 'DM Sans', sans-serif; color: #111827; background: rgba(255, 255, 255, 0.9);"
+                />
+                <span
+                  style="font-size: 0.65rem; color: #6b7280; font-family: 'DM Sans', sans-serif; line-height: 1.35;"
+                >
+                  Optional. Used for user.id (and display name) when creating a new passkey. Leave blank for an
+                  anonymous default.
+                </span>
+              </label>
+            {/if}
+
             <button
               data-testid="storacha-passkey-primary"
               class="storacha-btn-primary"
@@ -1548,6 +1710,7 @@
 
             <!-- Recover from backup (IPNS / manifest) -->
             <button
+              data-testid="storacha-recover-passkey"
               onclick={handleRecover}
               disabled={isRecovering}
               style="display: flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: 0.375rem; background-color: transparent; padding: 0.5rem 1.25rem; color: #E91315; border: 1px solid #E91315; cursor: pointer; font-family: 'Epilogue', sans-serif; font-weight: 600; font-size: 0.75rem; opacity: {isRecovering
@@ -1714,6 +1877,7 @@
                 <div style="display: flex; flex-direction: column; gap: 0.75rem;">
                   <textarea
                     class="storacha-textarea"
+                    data-testid="storacha-delegation-textarea"
                     bind:value={delegationText}
                     placeholder="Paste your UCAN delegation here (base64 encoded)..."
                     rows="4"
@@ -1721,6 +1885,7 @@
                   ></textarea>
                   <button
                     class="storacha-btn-primary"
+                    data-testid="storacha-delegation-import"
                     onclick={handleImportDelegation}
                     disabled={isLoading || !delegationText.trim()}
                     style="display: flex; width: 100%; align-items: center; justify-content: center; gap: 0.5rem; border-radius: 0.375rem; background-color: #E91315; padding: 0.5rem 1rem; color: #ffffff; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1); transition: color 150ms, background-color 150ms; border: none; cursor: pointer; font-family: 'Epilogue', sans-serif; font-weight: 600; opacity: {isLoading ||
@@ -1790,6 +1955,7 @@
                   />
                   {#if linkError}
                     <div
+                      data-testid="storacha-link-error"
                       style="font-size: 0.7rem; color: #dc2626; font-family: 'DM Sans', sans-serif;"
                     >
                       {linkError}
@@ -2395,6 +2561,7 @@
                 </div>
                 {#if linkError}
                   <div
+                    data-testid="storacha-link-error"
                     style="margin-top: 0.5rem; font-size: 0.75rem; color: #b91c1c; font-family: 'DM Sans', sans-serif;"
                   >
                     {linkError}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@le-space/p2pass",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "type": "module",
   "description": "P2Pass — peer-to-peer passkeys, UCANs, OrbitDB registry sync, and Storacha backup (Svelte)",
   "license": "MIT",
@@ -18,6 +18,7 @@
   "scripts": {
     "dev:example": "vite --config example/vite.config.js",
     "build:example": "vite build --config example/vite.config.js",
+    "kill:dev": "bash scripts/kill-relay-and-vite.sh",
     "test:e2e": "playwright test",
     "test:e2e:ui": "playwright test --ui",
     "test": "vitest run",
@@ -34,7 +35,27 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "svelte": "./dist/index.js"
+      "svelte": "./dist/index.js",
+      "browser": "./dist/index.js",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./signing-preference": {
+      "types": "./dist/identity/signing-preference.d.ts",
+      "import": "./dist/identity/signing-preference.js",
+      "default": "./dist/identity/signing-preference.js"
+    },
+    "./ui/StorachaFab": {
+      "types": "./dist/ui/StorachaFab.svelte.d.ts",
+      "svelte": "./dist/ui/StorachaFab.svelte",
+      "import": "./dist/ui/StorachaFab.svelte",
+      "default": "./dist/ui/StorachaFab.svelte"
+    },
+    "./ui/StorachaFab.svelte": {
+      "types": "./dist/ui/StorachaFab.svelte.d.ts",
+      "svelte": "./dist/ui/StorachaFab.svelte",
+      "import": "./dist/ui/StorachaFab.svelte",
+      "default": "./dist/ui/StorachaFab.svelte"
     }
   },
   "files": [