@ibgib/web-gib 0.0.61 → 0.0.62

package/src/identity/passkey.respec.mts

@@ -0,0 +1,194 @@
+import { respecfully, ifWe, ifWeMight, iReckon } from '@ibgib/helper-gib/dist/respec-gib/respec-gib.mjs';
+import { getIbGibGlobalThis_IbGib } from '../helpers.mjs';
+import {
+    bufferToHex,
+    hexToUint8Array,
+    normalizeSaltTo32Bytes,
+    isPasskeyPrfSupported,
+    registerPasskeyCredential,
+    evaluatePasskeyPrf,
+    createPasskeyDeviceSyncDelegate
+} from './passkey-helper.mjs';
+import { getDeviceDelegateSecret } from './device-delegate-helper.mjs';
+
+const sir = `[${import.meta.url}]`;
+
+// Initialize global db & store names for tests
+const globalThisIbGib = getIbGibGlobalThis_IbGib();
+globalThisIbGib.dbName_hack = 'space_gib_db';
+globalThisIbGib.storeName_hack = 'space_gib_store';
+
+// Mock storage substrate for Node test environment
+const inMemoryStore = new Map<string, string>();
+
+if (typeof globalThis.indexedDB === 'undefined') {
+    (globalThis as any).indexedDB = {
+        open: (dbName: string) => {
+            const req: any = {};
+            setTimeout(() => {
+                const db = {
+                    objectStoreNames: { contains: () => true },
+                    transaction: (storeName: string) => ({
+                        objectStore: (sName: string) => ({
+                            get: (key: string) => {
+                                const getReq: any = {};
+                                setTimeout(() => {
+                                    const val = inMemoryStore.get(key);
+                                    getReq.result = val !== undefined ? { value: val } : undefined;
+                                    if (getReq.onsuccess) getReq.onsuccess({ target: getReq });
+                                }, 0);
+                                return getReq;
+                            },
+                            put: (datum: any) => {
+                                const putReq: any = {};
+                                setTimeout(() => {
+                                    inMemoryStore.set(datum.key, datum.value);
+                                    if (putReq.onsuccess) putReq.onsuccess({ target: putReq });
+                                }, 0);
+                                return putReq;
+                            },
+                            delete: (key: string) => {
+                                const delReq: any = {};
+                                setTimeout(() => {
+                                    inMemoryStore.delete(key);
+                                    if (delReq.onsuccess) delReq.onsuccess({ target: delReq });
+                                }, 0);
+                                return delReq;
+                            }
+                        })
+                    }),
+                    close: () => {}
+                };
+                req.result = db;
+                if (req.onsuccess) req.onsuccess({ target: req });
+            }, 0);
+            return req;
+        }
+    };
+}
+
+// Setup environment profile
+process.env.KEYSTONE_PROFILE_SOVEREIGN_SYNC = 'sync-profile.dev';
+
+class MockIbGibSpace {
+    store = new Map<string, any>();
+    ib: string = 'witness space mock-space mock_space_id user';
+
+    constructor(public name: string = "mock_space") { }
+
+    async put({ ibGib }: { ibGib: any }): Promise<void> {
+        const addr = `${ibGib.ib}^${ibGib.gib}`;
+        this.store.set(addr, JSON.parse(JSON.stringify(ibGib)));
+    }
+
+    async get({ addr }: { addr: string }): Promise<any | null> {
+        const data = this.store.get(addr);
+        return data ? JSON.parse(JSON.stringify(data)) : null;
+    }
+
+    async argy({ argData, ibGibs }: { argData: any; ibGibs?: any[] }): Promise<any> {
+        return {
+            ib: 'arg^gib',
+            gib: 'arg_gib',
+            data: argData,
+            ibGibs,
+        };
+    }
+
+    async witness(arg: any): Promise<any> {
+        return { data: { success: true } };
+    }
+}
+
+class MockMetaspaceService {
+    constructor(public space: MockIbGibSpace) { }
+
+    async getLocalUserSpace({ lock }: { lock?: boolean } = {}): Promise<MockIbGibSpace> {
+        return this.space;
+    }
+
+    async put(args: any): Promise<void> {
+        const target = args.space || this.space;
+        return target.put(args);
+    }
+
+    async registerNewIbGib({ ibGib }: { ibGib: any }): Promise<void> {
+        return this.put({ ibGib });
+    }
+
+    async get(args: { addr?: string; addrs?: string[]; space?: any }): Promise<{ success: boolean; ibGibs?: any[] }> {
+        const target = args.space || this.space;
+        if (args.addr) {
+            const x = await target.get({ addr: args.addr });
+            return { success: !!x, ibGibs: x ? [x] : [] };
+        }
+        return { success: true, ibGibs: [] };
+    }
+}
+
+const mockSpace = new MockIbGibSpace();
+const mockMetaspace = new MockMetaspaceService(mockSpace);
+
+await respecfully(sir, 'Passkey WebAuthn PRF Helper Service', async () => {
+
+    await ifWe(sir, 'bufferToHex and hexToUint8Array roundtrip correctly', async () => {
+        const originalBytes = new Uint8Array([0xde, 0xad, 0xbe, 0xef, 0x01, 0x23, 0x45, 0x67, 0x89, 0xab, 0xcd, 0xef]);
+        const hex = bufferToHex(originalBytes.buffer);
+        iReckon(sir, hex).willEqual('deadbeef0123456789abcdef');
+
+        const roundtripBytes = hexToUint8Array(hex);
+        iReckon(sir, roundtripBytes.length).willEqual(originalBytes.length);
+        for (let i = 0; i < originalBytes.length; i++) {
+            iReckon(sir, roundtripBytes[i]).willEqual(originalBytes[i]);
+        }
+    });
+
+    await ifWe(sir, 'normalizeSaltTo32Bytes normalizes various salt inputs to 32 bytes', async () => {
+        // 1. Hex string of 64 chars (32 bytes)
+        const hex64 = '0123456789abcdef0123456789abcdef0123456789abcdef0123456789abcdef';
+        const normHex = normalizeSaltTo32Bytes(hex64);
+        iReckon(sir, normHex.length).willEqual(32);
+        iReckon(sir, bufferToHex(normHex.buffer)).willEqual(hex64);
+
+        // 2. Text string
+        const textSalt = 'ibgib_passkey_salt_domain_123';
+        const normText = normalizeSaltTo32Bytes(textSalt);
+        iReckon(sir, normText.length).willEqual(32);
+
+        // 3. Uint8Array
+        const rawBytes = new Uint8Array(32);
+        rawBytes.fill(0x42);
+        const normRaw = normalizeSaltTo32Bytes(rawBytes);
+        iReckon(sir, normRaw.length).willEqual(32);
+        iReckon(sir, normRaw[0]).willEqual(0x42);
+    });
+
+    await ifWe(sir, 'isPasskeyPrfSupported evaluates capabilities cleanly', async () => {
+        // In Node environment without window
+        const supported = await isPasskeyPrfSupported();
+        iReckon(sir, typeof supported).willEqual('boolean');
+    });
+
+    await ifWe(sir, 'createPasskeyDeviceSyncDelegate creates standard passkey sync delegate', async () => {
+        const username = 'alice';
+        const primaryTjpAddr = 'keystone^alice_primary_tjp.addr';
+        const passkeySecret = 'deadbeefdeadbeefdeadbeefdeadbeefdeadbeefdeadbeefdeadbeefdeadbeef';
+
+        const { delegateKeystone, deviceTag, delegateSecret } = await createPasskeyDeviceSyncDelegate({
+            username,
+            primaryTjpAddr,
+            passkeySecret,
+            transports: ['internal'],
+            metaspace: mockMetaspace as any,
+            space: mockSpace as any,
+        });
+
+        iReckon(sir, delegateKeystone).asTo('delegateKeystone is generated').isGonnaBeTruthy();
+        iReckon(sir, deviceTag.startsWith('passkey-alice-')).asTo('deviceTag follows passkey naming format').isGonnaBeTrue();
+        iReckon(sir, delegateSecret).asTo('delegateSecret is derived').isGonnaBeTruthy();
+
+        // Verify stored in IndexedDB
+        const storedSecret = await getDeviceDelegateSecret({ primaryTjpAddr });
+        iReckon(sir, storedSecret).willEqual(delegateSecret);
+    });
+});

package/src/index.mts

@@ -20,6 +20,7 @@ export * from "./api/ibgib-api-bridge.mjs";
 export * from "./identity/keystone-sync-service.mjs";
 export * from "./identity/device-delegate-helper.mjs";
 export * from "./identity/sso-popup-helper.mjs";
+export * from "./identity/passkey-helper.mjs";
 
 // Identity UI components
 export * from "./ui/component/identity/index.mjs";

package/src/ui/component/identity/add-device/add-device.mts

@@ -615,6 +615,7 @@ export class AddDeviceComponentInstance
                 parentKeystone: primaryKeystone,
                 delegateKeystone,
                 masterSecret,
+                signingPoolId: 'manage',
                 allowedVerbs: [KEYSTONE_VERB_SYNC, KEYSTONE_VERB_CONNECT],
                 metaspace,
                 space,

package/src/ui/component/identity/keystone-creator/keystone-creator.html

@@ -4,11 +4,13 @@
     <!-- Mode Selector Tabs -->
     <div class="mode-tabs">
         <button id="tab-quick" class="mode-tab active">⚡ Quick (Passwordless)</button>
+        <button id="tab-passkey" class="mode-tab">🛡️ Passkey / Hardware</button>
         <button id="tab-password" class="mode-tab">🔑 Password-based</button>
     </div>
 
     <!-- Mode Subtitles -->
     <p id="subtitle-quick" class="subtitle">⚡ Skip passwords — sign in with Google, GitHub, or an Email code. You can always set up a password later.</p>
+    <p id="subtitle-passkey" class="subtitle hidden">🛡️ Sovereign & Passwordless — secure your identity with Touch ID, Windows Hello, or a YubiKey.</p>
     <p id="subtitle-password" class="subtitle hidden">🔑 Full local ownership — your password never leaves your device. You can link Google or GitHub later.</p>
 
     <div class="content">
@@ -49,12 +51,49 @@
                 <div style="display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center;">
                     <input type="text" id="input-quick-otp" maxlength="6" placeholder="123456" class="text-input" style="font-family: monospace; font-size: 1.2rem; letter-spacing: 4px; text-align: center; max-width: 160px;">
                     <button id="btn-quick-verify-code" class="action-btn" style="white-space: nowrap; width: auto;">Verify Code</button>
+                    <button id="btn-quick-resend-code" class="action-btn secondary" type="button" style="white-space: nowrap; width: auto; font-size: 0.85rem; padding: 0.4rem 0.8rem; background: #45475a; color: #cdd6f4;">Resend Code</button>
                 </div>
             </div>
         </div>
 
         <!-- ----------------------------------------------------------------- -->
-        <!-- Tab 2: Password-based Content                                     -->
+        <!-- Tab 2: Passkey / Hardware Biometrics Content                     -->
+        <!-- ----------------------------------------------------------------- -->
+        <div id="panel-passkey" class="tab-panel hidden">
+            <div class="input-group">
+                <label for="input-passkey-username">Username</label>
+                <input type="text" id="input-passkey-username" placeholder="Enter your username..." class="text-input">
+            </div>
+
+            <div class="input-group">
+                <label for="input-passkey-description">Description (Optional)</label>
+                <input type="text" id="input-passkey-description" placeholder="Enter an optional description..." class="text-input">
+            </div>
+
+            <div class="input-group">
+                <label for="input-passkey-email">Primary Email (Optional)</label>
+                <input type="email" id="input-passkey-email" placeholder="Enter your primary email address..." class="text-input">
+            </div>
+
+            <div class="input-group">
+                <label for="input-passkey-name">Passkey / Device Label</label>
+                <input type="text" id="input-passkey-name" placeholder="e.g. MacBook Touch ID, YubiKey 5Ci, Android Phone..." class="text-input">
+            </div>
+
+            <div class="checkbox-group" style="margin-top: 0.5rem; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.5rem;">
+                <input type="checkbox" id="checkbox-passkey-make-active" checked style="cursor: pointer; width: 1rem; height: 1rem;">
+                <label for="checkbox-passkey-make-active" style="cursor: pointer; font-size: 0.9rem; user-select: none;">Make this the active identity</label>
+            </div>
+
+            <div class="action-row">
+                <button id="btn-generate-passkey" class="action-btn">
+                    🛡️ Create Identity with Passkey / Biometrics
+                </button>
+            </div>
+        </div>
+
+        <!-- ----------------------------------------------------------------- -->
+        <!-- Tab 3: Password-based Content                                     -->
         <!-- ----------------------------------------------------------------- -->
         <div id="panel-password" class="tab-panel hidden">
             <div class="input-group">
@@ -99,8 +138,8 @@
             <p style="font-size: 0.82rem; color: #a6adc8; margin-top: 0.25rem; margin-bottom: 0.75rem;">A 6-digit verification code was sent to your email. Enter it below to activate your identity:</p>
             <div style="display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center;">
                 <input type="text" id="input-verify-code" maxlength="6" placeholder="123456" class="text-input" style="font-family: monospace; font-size: 1.2rem; letter-spacing: 4px; text-align: center; max-width: 160px;">
-                <button id="btn-submit-code" class="action-btn" style="white-space: nowrap;">Verify Code</button>
-                <button id="btn-resend-code" class="action-btn" style="white-space: nowrap; background: #45475a; color: #cdd6f4;">Resend Code</button>
+                <button id="btn-submit-code" class="action-btn" style="white-space: nowrap; width: auto;">Verify Code</button>
+                <button id="btn-resend-code" class="action-btn secondary" type="button" style="white-space: nowrap; width: auto; font-size: 0.85rem; padding: 0.4rem 0.8rem; background: #45475a; color: #cdd6f4;">Resend Code</button>
             </div>
         </div>