@ibgib/web-gib 0.0.62 → 0.0.63

package/src/helpers.web.mts

@@ -427,9 +427,13 @@ export async function promptForText({
 import { evaluatePasskeyPrf, isPasskeyPrfSupported } from "./identity/passkey-helper.mjs";
 import { KeystonePasskeyEntry } from "@ibgib/core-gib/dist/keystone/keystone-types.mjs";
 
+export interface AuthoritySecretResult {
+    secret: string;
+    poolId: string;
+}
+
 /**
- * not implemented atow (12/2024). I think we'll have perhaps a modal dialog
- * with a known name and get at it that way.
+ * Prompts the user for a secret, supporting both master password and passkey/hardware authenticators.
  */
 export async function promptForSecret({
     msg,
@@ -444,7 +448,7 @@ export async function promptForSecret({
     try {
         if (logalot) { console.log(`${lc} starting... (I: 795a4ce348ddb9a5119770f4c572ac24)`); }
 
-        let result: string | undefined = undefined;
+        let result: any = undefined;
 
         let firstTry = true;
         let attempts = 0;
@@ -458,6 +462,7 @@ export async function promptForSecret({
                     credentialId: passkeyEntry.credentialId,
                     salt: passkeyEntry.salt,
                     transports: passkeyEntry.transports,
+                    userVerification: 'preferred'
                 });
                 return passkeySecret;
             }
@@ -481,9 +486,13 @@ export async function promptForSecret({
             });
             if (result === undefined) { throw new Error(`user cancelled (E: 91519d04378e84106f3df8eb36d99725)`); }
 
+            if (typeof result === 'object' && result?.secret !== undefined) {
+                result = result.secret;
+            }
+
             if (confirm) {
                 await delay(250);
-                let result2 = await showFullscreenDialog({
+                let result2: any = await showFullscreenDialog({
                     title: 'Shh...',
                     msg: 'Confirm...',
                     prompt: true,
@@ -492,6 +501,9 @@ export async function promptForSecret({
                     defaultValue: undefined,
                 });
                 if (result2 === undefined) { result = undefined; }
+                if (typeof result2 === 'object' && result2?.secret !== undefined) {
+                    result2 = result2.secret;
+                }
                 if (result !== result2) {
                     result = undefined;
                     firstTry = false;
@@ -499,7 +511,6 @@ export async function promptForSecret({
                 }
             }
 
-
         } while (result === undefined);
 
         return result;
@@ -511,6 +522,85 @@ export async function promptForSecret({
     }
 }
 
+/**
+ * Unified authority prompt that inspects the candidate pools on a keystone and prompts the user
+ * to authorize via either Master Password or a specific Passkey.
+ * Returns both the verified secret and the exact signingPoolId to use for keystone operations.
+ */
+export async function promptForAuthoritySecret({
+    keystone,
+    aggregatedDetails,
+    title,
+    msg,
+    verb = 'manage',
+}: {
+    keystone: any;
+    aggregatedDetails?: any;
+    title?: string;
+    msg?: string;
+    verb?: string;
+}): Promise<AuthoritySecretResult> {
+    const lc = `[${promptForAuthoritySecret.name}]`;
+    try {
+        const passkeysMap = aggregatedDetails?.passkeys
+            || (keystone.data as any)?.frameDetails?.passkeys
+            || (keystone.data as any)?.passkeys
+            || {};
+
+        const prfSupported = await isPasskeyPrfSupported().catch(() => false);
+        const onPasskeyAuth = (prfSupported && passkeysMap && Object.keys(passkeysMap).length > 0)
+            ? async (passkeyEntry?: any) => {
+                if (!passkeyEntry) return undefined;
+                const { passkeySecret } = await evaluatePasskeyPrf({
+                    credentialId: passkeyEntry.credentialId,
+                    salt: passkeyEntry.salt,
+                    transports: passkeyEntry.transports,
+                    userVerification: 'preferred'
+                });
+                return passkeySecret;
+            }
+            : undefined;
+
+        const candidatePools = (keystone.data?.challengePools || []).filter((p: any) =>
+            p.id === 'manage' ||
+            p.id.startsWith('passkey-manage-') ||
+            (p.config?.allowedVerbs && verb && p.config.allowedVerbs.includes(verb))
+        );
+
+        const hasPasswordPool = candidatePools.some((p: any) => p.id === 'manage');
+
+        const dialogResult: any = await showFullscreenDialog({
+            title: title || 'Authorize Action',
+            msg: msg || 'Authorize this action with your master password or passkey:',
+            prompt: true,
+            showInput: hasPasswordPool,
+            isPassword: true,
+            defaultValue: undefined,
+            passkeys: passkeysMap,
+            onPasskeyAuth,
+        });
+
+        if (!dialogResult) {
+            throw new Error("Action cancelled by user.");
+        }
+
+        if (typeof dialogResult === 'object' && dialogResult.secret !== undefined) {
+            return {
+                secret: dialogResult.secret,
+                poolId: dialogResult.poolId || 'manage'
+            };
+        }
+
+        return {
+            secret: String(dialogResult),
+            poolId: 'manage'
+        };
+    } catch (error) {
+        console.error(`${lc} ${extractErrorMsg(error)}`);
+        throw error;
+    }
+}
+
 /**
  * prompt specifically looking to confirm something. if "cancelled", returns
  * false.

package/src/identity/passkey-helper.mts

@@ -91,12 +91,18 @@ export async function registerPasskeyCredential({
     rpName = 'ibgib',
     rpId,
     salt,
+    userVerification = 'preferred',
+    authenticatorAttachment,
+    hints = ['security-key', 'client-device', 'hybrid'],
 }: {
     username: string;
     displayName?: string;
     rpName?: string;
     rpId?: string;
     salt?: string | Uint8Array;
+    userVerification?: UserVerificationRequirement;
+    authenticatorAttachment?: AuthenticatorAttachment;
+    hints?: ('security-key' | 'client-device' | 'hybrid')[];
 }): Promise<{
     credentialId: string;
     rawId: ArrayBuffer;
@@ -137,8 +143,10 @@ export async function registerPasskeyCredential({
                 ],
                 authenticatorSelection: {
                     residentKey: 'required',
-                    userVerification: 'required'
+                    userVerification,
+                    ...(authenticatorAttachment ? { authenticatorAttachment } : {})
                 },
+                ...(hints && hints.length > 0 ? { hints } : {}),
                 extensions: {
                     prf: prfExtension
                 } as any
@@ -184,11 +192,15 @@ export async function evaluatePasskeyPrf({
     credentialId,
     transports,
     rpId,
+    userVerification = 'preferred',
+    hints = ['security-key', 'client-device', 'hybrid'],
 }: {
     salt: string | Uint8Array;
     credentialId?: string;
     transports?: AuthenticatorTransport[];
     rpId?: string;
+    userVerification?: UserVerificationRequirement;
+    hints?: ('security-key' | 'client-device' | 'hybrid')[];
 }): Promise<{
     passkeySecret: string;
     credentialId: string;
@@ -203,6 +215,7 @@ export async function evaluatePasskeyPrf({
         const challenge = crypto.getRandomValues(new Uint8Array(32));
         const saltBuffer = normalizeSaltTo32Bytes(salt);
 
+        let credentialIdBase64Url: string | undefined = undefined;
         let allowCredentials: PublicKeyCredentialDescriptor[] | undefined = undefined;
         if (credentialId) {
             const rawBytes = hexToUint8Array(credentialId);
@@ -211,6 +224,24 @@ export async function evaluatePasskeyPrf({
                 type: 'public-key' as const,
                 ...(transports && transports.length > 0 ? { transports } : {})
             }];
+            let binary = '';
+            for (let i = 0; i < rawBytes.byteLength; i++) {
+                binary += String.fromCharCode(rawBytes[i]);
+            }
+            credentialIdBase64Url = btoa(binary).replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
+        }
+
+        const prfExtension: any = {
+            eval: {
+                first: saltBuffer
+            }
+        };
+        if (credentialIdBase64Url) {
+            prfExtension.evalByCredential = {
+                [credentialIdBase64Url]: {
+                    first: saltBuffer
+                }
+            };
         }
 
         const assertion = await navigator.credentials.get({
@@ -218,13 +249,10 @@ export async function evaluatePasskeyPrf({
                 challenge,
                 ...(effectiveRpId ? { rpId: effectiveRpId } : {}),
                 allowCredentials,
-                userVerification: 'required',
+                userVerification,
+                ...(hints && hints.length > 0 ? { hints } : {}),
                 extensions: {
-                    prf: {
-                        eval: {
-                            first: saltBuffer
-                        }
-                    }
+                    prf: prfExtension
                 } as any
             }
         }) as PublicKeyCredential;
@@ -235,11 +263,16 @@ export async function evaluatePasskeyPrf({
 
         const resolvedCredentialId = bufferToHex(assertion.rawId);
         const extResults: any = assertion.getClientExtensionResults?.() || {};
-        console.log(`${lc} WebAuthn assertion clientExtensionResults:`, extResults);
-        const prfResult = extResults.prf?.results?.first;
+        console.log(`${lc} WebAuthn assertion clientExtensionResults:`, JSON.stringify(extResults), extResults);
+        
+        let prfResult: ArrayBuffer | undefined = extResults.prf?.results?.first;
+        if (!prfResult && credentialIdBase64Url && extResults.prf?.resultsByCredential?.[credentialIdBase64Url]?.first) {
+            prfResult = extResults.prf.resultsByCredential[credentialIdBase64Url].first;
+            console.log(`${lc} Extracted PRF result from resultsByCredential!`);
+        }
 
         if (!prfResult) {
-            console.error(`${lc} Extension results did not contain PRF evaluation:`, extResults);
+            console.error(`${lc} Extension results did not contain PRF evaluation:`, JSON.stringify(extResults), extResults);
             throw new Error('Authenticator did not return a PRF evaluation. PRF extension may not be supported on this authenticator.');
         }
 

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

@@ -199,4 +199,30 @@ h2 {
 input::placeholder {
     color: rgba(255, 255, 255, 0.35);
     opacity: 1;
+}
+
+.public-directory-notice {
+    padding: 0.75rem 1rem;
+    border-radius: 8px;
+    background: rgba(137, 180, 250, 0.08);
+    border: 1px solid rgba(137, 180, 250, 0.25);
+    display: flex;
+    gap: 0.6rem;
+    align-items: flex-start;
+    text-align: left;
+}
+
+.notice-icon {
+    font-size: 1.1rem;
+    line-height: 1.2;
+}
+
+.notice-body {
+    font-size: 0.82rem;
+    color: var(--clr-text, #cdd6f4);
+    line-height: 1.45;
+}
+
+.notice-body strong {
+    color: #89b4fa;
 }

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

@@ -80,6 +80,15 @@
                 <input type="text" id="input-passkey-name" placeholder="e.g. MacBook Touch ID, YubiKey 5Ci, Android Phone..." class="text-input">
             </div>
 
+            <div class="input-group">
+                <label for="select-passkey-attachment">Authenticator Device Target</label>
+                <select id="select-passkey-attachment" class="text-input" style="cursor: pointer;">
+                    <option value="any" selected>Any / Smart Chooser (All Options, No Forced Windows PIN)</option>
+                    <option value="cross-platform">Hardware Security Key (USB / NFC YubiKey Directly)</option>
+                    <option value="platform">Built-in Biometrics (Windows Hello, Touch ID, Fingerprint)</option>
+                </select>
+            </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>
@@ -150,13 +159,21 @@
             <p class="warning">⚠️ Store this address safely. It is your root identity for this space.</p>
         </div>
 
+        <!-- Public Directory Notice Callout -->
+        <div class="public-directory-notice">
+            <span class="notice-icon">ℹ️</span>
+            <div class="notice-body">
+                <strong>Public Directory Notice:</strong> Your username and registered email address are associated with your public identity keystone and can be queried on the network (similar to a public PGP key or public DNS record).
+            </div>
+        </div>
+
         <div class="switch-workflow" style="margin-top: 1.2rem; text-align: center; font-size: 0.9rem; color: #a6adc8;">
             Already have a device paired? <button id="btn-switch-sign-in" class="link-btn" style="background: none; border: none; color: #89b4fa; font-weight: 600; cursor: pointer; text-decoration: underline; padding: 0; font-size: 0.9rem;">Pair New Device</button>
         </div>
 
         <!-- Privacy Footer Note -->
         <div class="privacy-footer" style="margin-top: 1rem; text-align: center; font-size: 0.78rem; color: #a6adc8; line-height: 1.4;">
-            ℹ️ Primary email addresses and identity keystones form part of the public graph for account discovery. Business data requires authorized sync delegates. Learn more in our <a id="link-privacy-policy" href="#privacy" style="color: #89b4fa; text-decoration: underline;">Privacy Policy</a>.
+            Identity keystones form part of the public graph for account discovery. Learn more in our <a id="link-privacy-policy" href="/privacy" target="_blank" rel="noopener" style="color: #89b4fa; text-decoration: underline;">Privacy Policy</a>.
         </div>
     </div>
 </div>

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

@@ -696,12 +696,21 @@ export class KeystoneCreatorComponentInstance
                 animationEmoji: '🛡️'
             });
 
+            const selectAttachment = this.shadowRoot?.querySelector('#select-passkey-attachment') as HTMLSelectElement | null;
+            const attachmentVal = selectAttachment?.value;
+            const authenticatorAttachment: AuthenticatorAttachment | undefined =
+                (attachmentVal === 'cross-platform' || attachmentVal === 'platform')
+                    ? attachmentVal
+                    : undefined;
+
             const rawSalt = crypto.getRandomValues(new Uint8Array(32));
             const saltHex = bufferToHex(rawSalt.buffer as ArrayBuffer);
             const regResult = await registerPasskeyCredential({
                 username,
                 displayName: username,
-                salt: saltHex
+                salt: saltHex,
+                authenticatorAttachment,
+                userVerification: 'preferred'
             });
             const { credentialId, transports } = regResult;
 
@@ -710,7 +719,8 @@ export class KeystoneCreatorComponentInstance
                 const prfResult = await evaluatePasskeyPrf({
                     credentialId,
                     salt: saltHex,
-                    transports
+                    transports,
+                    userVerification: 'preferred'
                 });
                 passkeySecret = prfResult.passkeySecret;
             }

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

@@ -97,6 +97,14 @@
                     </tbody>
                 </table>
             </div>
+            <div class="form-group" style="margin-top: 1rem; max-width: 360px;">
+                <label for="select-passkey-attachment" style="font-size: 0.85rem; color: var(--clr-text-secondary, #b3b3b3);">Authenticator Device Target</label>
+                <select id="select-passkey-attachment" class="form-control" style="width: 100%; padding: 0.4rem 0.6rem; margin-top: 0.25rem; border-radius: 4px; background: rgba(0,0,0,0.3); color: inherit; border: 1px solid rgba(255,255,255,0.2);">
+                    <option value="">Any (Default / Auto-Detect)</option>
+                    <option value="cross-platform">🔑 Hardware Security Key (USB / NFC)</option>
+                    <option value="platform">💻 Built-in Biometrics (Fingerprint / Touch ID)</option>
+                </select>
+            </div>
             <div class="action-row" style="margin-top: 0.5rem;">
                 <button id="btn-add-passkey" class="action-btn">
                     🛡️ Register New Passkey / Security Key