@flow-industries/id 0.3.1 → 0.6.0

package/dist/sdk/client/access-key.d.ts

@@ -1,5 +1,5 @@
 import { Account } from "viem/tempo";
-import type { AccessKeyPreparation, Address as Hex, FinalizeAccessKeyParams, FlowCredential, ResolvedAccessKeyOptions, StoredAccessKey } from "../types";
+import type { AccessKeyPreparation, FinalizeAccessKeyParams, FlowCredential, Address as Hex, ResolvedAccessKeyOptions, StoredAccessKey } from "../types";
 /**
  * Step 1 of access-key creation — runs BEFORE the dialog opens.
  *
@@ -7,8 +7,10 @@ import type { AccessKeyPreparation, Address as Hex, FinalizeAccessKeyParams, Flo
  * and builds an unsigned KeyAuthorization that grants this key permission to
  * sign on behalf of the root account until `expiry`. Returns the key pair
  * plus a signing payload (`accessKeyHash`) that gets passed into the dialog
- * so the same WebAuthn ceremony that signs the user in also signs the
- * authorization — saving a second tap.
+ * so the user's passkey can authorize it. The dialog signs `accessKeyHash`
+ * in its own WebAuthn ceremony, separate from login — Tempo's on-chain
+ * verifier requires a signature over this exact digest, so it cannot be
+ * folded into the login challenge.
  *
  * Pairs with `finalizeAccessKey()` after the dialog returns the WebAuthn
  * signature.

package/dist/sdk/client/access-key.js

@@ -1,7 +1,7 @@
-import { Account, WebCryptoP256 } from "viem/tempo";
-import { KeyAuthorization, SignatureEnvelope } from "ox/tempo";
 import * as Address from "ox/Address";
 import * as PublicKey from "ox/PublicKey";
+import { KeyAuthorization, SignatureEnvelope } from "ox/tempo";
+import { Account, WebCryptoP256 } from "viem/tempo";
 import { idb } from "./idb";
 /**
  * Step 1 of access-key creation — runs BEFORE the dialog opens.
@@ -10,8 +10,10 @@ import { idb } from "./idb";
  * and builds an unsigned KeyAuthorization that grants this key permission to
  * sign on behalf of the root account until `expiry`. Returns the key pair
  * plus a signing payload (`accessKeyHash`) that gets passed into the dialog
- * so the same WebAuthn ceremony that signs the user in also signs the
- * authorization — saving a second tap.
+ * so the user's passkey can authorize it. The dialog signs `accessKeyHash`
+ * in its own WebAuthn ceremony, separate from login — Tempo's on-chain
+ * verifier requires a signature over this exact digest, so it cannot be
+ * folded into the login challenge.
  *
  * Pairs with `finalizeAccessKey()` after the dialog returns the WebAuthn
  * signature.

package/dist/sdk/client/create-flow.js

@@ -4,6 +4,43 @@ import { METHODS } from "./methods";
 import { credentialToAddress, restoreCredential, runLogin, runLogout, } from "./session";
 import { createStore, initialFlowState } from "./store";
 const DEFAULT_HOST = "https://id.flow.industries";
+// Refresh a little before the JWT's `exp` so a token handed out by getToken()
+// is still valid by the time it reaches the relying party, absorbing request
+// latency and minor client/server clock skew.
+const EXPIRY_SKEW_MS = 60_000;
+/** Reads the `exp` (seconds since epoch) from a JWT, or null if unreadable. */
+function jwtExp(token) {
+    const parts = token.split(".");
+    if (parts.length !== 3)
+        return null;
+    try {
+        const padded = parts[1].replace(/-/g, "+").replace(/_/g, "/");
+        const payload = JSON.parse(atob(padded));
+        return typeof payload.exp === "number" ? payload.exp : null;
+    }
+    catch {
+        return null;
+    }
+}
+/** True if the token is missing an exp, already expired, or within the skew. */
+function isExpiring(token) {
+    const exp = jwtExp(token);
+    if (exp === null)
+        return true;
+    return Date.now() >= exp * 1000 - EXPIRY_SKEW_MS;
+}
+/**
+ * Runs `fn` while holding a cross-tab lock (Web Locks API) so concurrent tabs
+ * of the same origin serialize guest creation: the first tab mints and sets the
+ * shared cookie, later tabs then restore it instead of minting a duplicate
+ * guest. Falls back to running `fn` directly where Web Locks is unavailable.
+ */
+function withGuestLock(name, fn) {
+    const locks = globalThis.navigator?.locks;
+    if (locks?.request)
+        return locks.request(name, fn);
+    return fn();
+}
 /**
  * Normalizes user-supplied access-key configuration into a fully-resolved
  * shape. Accepts `true` for defaults, a partial options object, or omitted
@@ -93,7 +130,12 @@ export function createFlow(options = {}) {
                 credential: result.credential,
                 address: result.address,
             });
-            await idb.set("flow.activeCredential", result.credential);
+            // A guest restore returns a null credential; never persist that — the IDB
+            // store is reserved for a real passkey credential and writing null would
+            // erase a previously stored one.
+            if (result.credential) {
+                await idb.set("flow.activeCredential", result.credential);
+            }
             return true;
         }
         catch {
@@ -104,10 +146,94 @@ export function createFlow(options = {}) {
     // from the cookie session. We expose two names because consumers reach for
     // one or the other based on intent (page-load vs near-expiry).
     const refreshJwt = restore;
+    // Dedupe concurrent refreshes: a burst of getToken() calls that all find the
+    // cached token expired should trigger one mint, not one per call.
+    let refreshInFlight = null;
+    /**
+     * Returns a currently-valid JWT, silently minting a fresh one from the
+     * 60-day cookie session when the cached token is missing, expired, or within
+     * EXPIRY_SKEW_MS of expiring. This is the accessor to call before hitting a
+     * relying-party backend: the JWT is a 1h access token, so reading the cached
+     * `flow.jwt` from a tab open longer than an hour would send a stale token.
+     *
+     * The refresh is silent (cookie-based, no passkey prompt). Returns null only
+     * when there is no usable session — the caller should then prompt
+     * `flow.login()`. Use it inside a 401 handler too: `await flow.getToken()`
+     * before retrying the request.
+     */
+    async function getToken() {
+        const current = store.getSnapshot().jwt;
+        if (current && !isExpiring(current))
+            return current;
+        if (!refreshInFlight) {
+            refreshInFlight = refreshJwt().finally(() => {
+                refreshInFlight = null;
+            });
+        }
+        await refreshInFlight;
+        const next = store.getSnapshot().jwt;
+        return next && !isExpiring(next) ? next : null;
+    }
+    // Single-flight within this instance; the cross-tab lock below extends the
+    // dedup across tabs of the same origin.
+    let guestInFlight = null;
+    /**
+     * Ensures a session exists, silently creating a persistent guest when none
+     * does. Idempotent and never throws (a failed mint resolves false so the
+     * caller can fall back to flow.login()).
+     *
+     * Restore-first under a cross-tab lock is the dedup: a returning or
+     * concurrently-minting visitor reuses their existing guest/full session
+     * instead of spawning a duplicate. The guest-mint branch writes only to the
+     * in-memory store (never IDB) — IDB is reserved for a real passkey credential.
+     */
+    async function ensureGuest() {
+        if (store.getSnapshot().user)
+            return true;
+        if (!guestInFlight) {
+            guestInFlight = withGuestLock(`flow.id.guest:${host}`, async () => {
+                // Re-check under the lock: another tab may have minted the guest (and
+                // set the shared id.flow.industries cookie) while we waited, so
+                // restore-first collapses concurrent first-visits onto one row.
+                if (store.getSnapshot().user)
+                    return true;
+                if (await restore())
+                    return true;
+                try {
+                    const result = await getDialog().requestSilent(METHODS.guest, []);
+                    if (!result.user)
+                        return false;
+                    store.setState({
+                        user: result.user,
+                        jwt: result.jwt,
+                        // Only a guest has no credential. The server's idempotency path can
+                        // return a full session here; in that case keep any credential/
+                        // address already in state rather than stripping signing.
+                        ...(result.user.isGuest ? { credential: null, address: null } : {}),
+                    });
+                    return true;
+                }
+                catch {
+                    return false;
+                }
+            }).finally(() => {
+                guestInFlight = null;
+            });
+        }
+        return guestInFlight;
+    }
     void (async () => {
         await restoreCredential(store);
         if (options.autoRestore !== false) {
-            await restore();
+            const restored = await restore();
+            // ensureGuest re-checks under a cross-tab lock (restore-first) before
+            // minting, so calling it after a failed restore can't fork a visitor into
+            // duplicate guests across tabs — the extra restore is the dedup.
+            if (!restored && options.autoGuest)
+                await ensureGuest();
+        }
+        else if (options.autoGuest) {
+            await ensureGuest();
         }
     })();
     function buildSigningContext() {
@@ -158,7 +284,12 @@ export function createFlow(options = {}) {
                 preparation: accessKeyPrep,
             });
         }
-        dialogHost.close();
+        // The dialog owns closing in every interactive path: sign-in sends "close"
+        // immediately after responding, sign-up after its brief "Welcome" screen.
+        // Closing here would preempt the welcome screen, and — since the gate can
+        // only see the caller's intent, not the flow the user actually completed —
+        // it fired even when a flow.login() user navigated to sign-up. So don't
+        // close from the connector; let the dialog decide.
         return session;
     }
     /**
@@ -180,6 +311,11 @@ export function createFlow(options = {}) {
         }
         await runLogout(store);
         dialog?.close();
+        // An autoGuest app is never truly "signed out" — it always wants at least a
+        // guest session. Re-mint one so the UI (e.g. the profile widget pill) keeps
+        // working after logout instead of vanishing until the next page load.
+        if (options.autoGuest)
+            await ensureGuest();
     }
     const flow = {
         get user() {
@@ -197,10 +333,15 @@ export function createFlow(options = {}) {
         get isAuthenticated() {
             return store.getSnapshot().user !== null;
         },
+        get isGuest() {
+            return store.getSnapshot().user?.isGuest === true;
+        },
         login,
         logout,
         restore,
+        ensureGuest,
         refreshJwt,
+        getToken,
         signMessage: async (args) => {
             const mod = await import("./signing");
             return mod.signMessage(buildSigningContext(), args);
@@ -226,6 +367,7 @@ export function createFlow(options = {}) {
         get dialog() {
             return getDialog();
         },
+        host,
     };
     currentFlow = flow;
     return flow;

package/dist/sdk/client/dialog-host.js

@@ -1,4 +1,5 @@
 import * as Messenger from "../dialog/remote/Messenger";
+import { bridgeToWindow, makeIframe } from "./iframe-host";
 const HIDDEN_STYLE = {
     position: "fixed",
     inset: "0",
@@ -38,24 +39,20 @@ export function createDialogHost(options) {
     const pending = new Map();
     /**
      * Mounts the iframe and wires up the postMessage bridge. Idempotent — safe
-     * to call before every request. The `allow` attribute grants WebAuthn and
-     * clipboard permissions to the dialog (required for passkey ceremonies).
+     * to call before every request.
      */
     function ensureFrame() {
         if (iframe)
             return;
-        iframe = document.createElement("iframe");
-        iframe.src = `${host}`;
+        iframe = makeIframe(`${host}`);
         iframe.dataset.flowId = "";
-        iframe.allow = "publickey-credentials-create; publickey-credentials-get; clipboard-write";
         Object.assign(iframe.style, HIDDEN_STYLE);
-        iframe.style.colorScheme = "normal";
         container.appendChild(iframe);
-        messenger = Messenger.bridge({
-            from: Messenger.fromWindow(window),
-            to: Messenger.fromWindow(iframe.contentWindow),
-            waitForReady: true,
-        });
+        // Bind the bridge to this iframe's own window — a page may host more than
+        // one same-origin Flow iframe (e.g. the profile widget), and origin
+        // filtering can't tell them apart, so without the source filter their
+        // `ready`/`close` would cross-fire onto this dialog's bridge.
+        messenger = bridgeToWindow(iframe.contentWindow);
         messenger.on("rpc-response", (payload) => {
             const id = payload?.id;
             const handler = pending.get(id);
@@ -89,11 +86,7 @@ export function createDialogHost(options) {
             return;
         if (messenger)
             messenger.destroy();
-        messenger = Messenger.bridge({
-            from: Messenger.fromWindow(window),
-            to: Messenger.fromWindow(popup),
-            waitForReady: true,
-        });
+        messenger = bridgeToWindow(popup);
     }
     let initSent = false;
     /**
@@ -116,11 +109,20 @@ export function createDialogHost(options) {
         if (!iframe)
             return;
         Object.assign(iframe.style, VISIBLE_STYLE);
+        // The dialog owns its open/close animation and mounts the overlay (playing
+        // the enter animation) on this signal — same mechanism as the profile
+        // widget, so every dialog appears and disappears identically.
+        void messenger?.send("__internal", { type: "dialog-shown" });
     }
     function hide() {
         if (!iframe)
             return;
-        Object.assign(iframe.style, { display: "none", pointerEvents: "none" });
+        // Keep the iframe rendered and only drop hit-testing, so the dialog can play
+        // its exit animation. display:none would pause the iframe's
+        // requestAnimationFrame, making the close (and the next open) skip straight
+        // to the end. While hidden the overlay is transparent and click-through.
+        iframe.style.pointerEvents = "none";
+        void messenger?.send("__internal", { type: "dialog-hidden" });
     }
     function open(opts) {
         if (opts?.mode === "popup") {
@@ -128,8 +130,11 @@ export function createDialogHost(options) {
             return;
         }
         ensureFrame();
-        show();
+        // Init before show so the dialog is initialized/navigated by the time it
+        // mounts the overlay on the show signal — the card enters with its content
+        // ready rather than flashing the pre-init spinner.
         sendInit(opts);
+        show();
     }
     function close() {
         hide();
@@ -176,6 +181,7 @@ export function createDialogHost(options) {
     async function requestSilent(method, params) {
         ensureFrame();
         sendInit();
+        await messenger.waitForReady();
         return dispatchRequest(method, params);
     }
     return {

package/dist/sdk/client/iframe-host.d.ts

@@ -0,0 +1,23 @@
+import * as Messenger from "../dialog/remote/Messenger";
+/**
+ * Permissions the dialog iframe needs to run WebAuthn passkey ceremonies and
+ * copy recovery values. Shared by every Flow iframe host (the dialog host and
+ * the profile widget).
+ */
+export declare const IFRAME_ALLOW = "publickey-credentials-create; publickey-credentials-get; clipboard-write";
+/**
+ * Creates a Flow dialog iframe element: WebAuthn-permitted, borderless, and
+ * `color-scheme: normal` so the iframe itself stays transparent (the rendered
+ * theme is applied to nested card wrappers, not the iframe). The caller owns
+ * positioning/visibility and any `data-*` marker.
+ */
+export declare function makeIframe(src: string): HTMLIFrameElement;
+/**
+ * Builds a postMessage bridge to a child window (iframe `contentWindow` or
+ * popup). Inbound is filtered by `source` so multiple same-origin Flow frames
+ * on one page can't cross-fire their `ready`/`close` handshakes; `targetOrigin`
+ * pins outbound sends to the host origin when given (omit for "*").
+ */
+export declare function bridgeToWindow(target: Window, options?: {
+    targetOrigin?: string;
+}): Messenger.Bridge;

package/dist/sdk/client/iframe-host.js

@@ -0,0 +1,34 @@
+import * as Messenger from "../dialog/remote/Messenger";
+/**
+ * Permissions the dialog iframe needs to run WebAuthn passkey ceremonies and
+ * copy recovery values. Shared by every Flow iframe host (the dialog host and
+ * the profile widget).
+ */
+export const IFRAME_ALLOW = "publickey-credentials-create; publickey-credentials-get; clipboard-write";
+/**
+ * Creates a Flow dialog iframe element: WebAuthn-permitted, borderless, and
+ * `color-scheme: normal` so the iframe itself stays transparent (the rendered
+ * theme is applied to nested card wrappers, not the iframe). The caller owns
+ * positioning/visibility and any `data-*` marker.
+ */
+export function makeIframe(src) {
+    const frame = document.createElement("iframe");
+    frame.src = src;
+    frame.allow = IFRAME_ALLOW;
+    frame.style.border = "none";
+    frame.style.colorScheme = "normal";
+    return frame;
+}
+/**
+ * Builds a postMessage bridge to a child window (iframe `contentWindow` or
+ * popup). Inbound is filtered by `source` so multiple same-origin Flow frames
+ * on one page can't cross-fire their `ready`/`close` handshakes; `targetOrigin`
+ * pins outbound sends to the host origin when given (omit for "*").
+ */
+export function bridgeToWindow(target, options = {}) {
+    return Messenger.bridge({
+        from: Messenger.fromWindow(window, { source: target }),
+        to: Messenger.fromWindow(target, options.targetOrigin ? { targetOrigin: options.targetOrigin } : undefined),
+        waitForReady: true,
+    });
+}

package/dist/sdk/client/index.d.ts

@@ -1,4 +1,5 @@
+export type { AccessKeyOptions, Address, ConnectCapabilities, ConnectResponse, CreateFlowOptions, DialogHost, Flow, FlowCredential, FlowState, FlowUser, LoginOptions, MethodName, MountProfileOptions, ProfileButtonHandle, ProfilePosition, Session, } from "../types";
 export { createFlow, getFlow, requireFlow, resetFlow } from "./create-flow";
 export { createDialogHost } from "./dialog-host";
 export { METHODS } from "./methods";
-export type { AccessKeyOptions, Address, ConnectCapabilities, ConnectResponse, CreateFlowOptions, DialogHost, Flow, FlowCredential, FlowState, FlowUser, LoginOptions, MethodName, Session, } from "../types";
+export { createProfileButton } from "./profile-button";

package/dist/sdk/client/index.js

@@ -1,3 +1,4 @@
 export { createFlow, getFlow, requireFlow, resetFlow } from "./create-flow";
 export { createDialogHost } from "./dialog-host";
 export { METHODS } from "./methods";
+export { createProfileButton } from "./profile-button";

package/dist/sdk/client/methods.d.ts

@@ -5,5 +5,6 @@ export declare const METHODS: {
     readonly sendTransaction: "eth_sendTransaction";
     readonly sendCalls: "wallet_sendCalls";
     readonly restore: "wallet_restore";
+    readonly guest: "wallet_guest";
     readonly signOut: "wallet_signout";
 };

package/dist/sdk/client/methods.js

@@ -5,5 +5,6 @@ export const METHODS = {
     sendTransaction: "eth_sendTransaction",
     sendCalls: "wallet_sendCalls",
     restore: "wallet_restore",
+    guest: "wallet_guest",
     signOut: "wallet_signout",
 };

package/dist/sdk/client/profile-button.d.ts

@@ -0,0 +1,15 @@
+import type { MountProfileOptions, ProfileButtonHandle } from "../types";
+/**
+ * Mounts the universal Flow ID "profile button" — a persistent inline iframe
+ * showing the signed-in user's avatar + username (the collapsed pill). Clicking
+ * it opens the profile dialog in a SEPARATE fullscreen overlay iframe, so the
+ * pill stays in place behind the dialog's dimmed backdrop rather than morphing
+ * into it. Both iframes ride the dialog SPA at `${host}/dialog/` (routes
+ * `/dialog/profile-pill` and `/dialog/profile`) so the chrome matches the auth
+ * dialog and the widget is first-party to Flow ID (reads `/api/me`, uploads
+ * avatars with the cookie session).
+ *
+ * Resolves the Flow singleton automatically (createFlow() must have run), so
+ * callers don't thread the instance through. No-op under SSR.
+ */
+export declare function createProfileButton(options: MountProfileOptions): ProfileButtonHandle;

package/dist/sdk/client/profile-button.js

@@ -0,0 +1,189 @@
+import * as Messenger from "../dialog/remote/Messenger";
+import { getFlow, requireFlow } from "./create-flow";
+import { bridgeToWindow, makeIframe } from "./iframe-host";
+const DEFAULT_HOST = "https://id.flow.industries";
+const POSITION_STYLE = {
+    "top-right": { top: "0", right: "0" },
+    "top-left": { top: "0", left: "0" },
+    "bottom-right": { bottom: "0", right: "0" },
+    "bottom-left": { bottom: "0", left: "0" },
+};
+const OVERLAY_STYLE = {
+    position: "fixed",
+    inset: "0",
+    width: "100%",
+    height: "100%",
+    zIndex: "2147483647",
+};
+/**
+ * Mounts the universal Flow ID "profile button" — a persistent inline iframe
+ * showing the signed-in user's avatar + username (the collapsed pill). Clicking
+ * it opens the profile dialog in a SEPARATE fullscreen overlay iframe, so the
+ * pill stays in place behind the dialog's dimmed backdrop rather than morphing
+ * into it. Both iframes ride the dialog SPA at `${host}/dialog/` (routes
+ * `/dialog/profile-pill` and `/dialog/profile`) so the chrome matches the auth
+ * dialog and the widget is first-party to Flow ID (reads `/api/me`, uploads
+ * avatars with the cookie session).
+ *
+ * Resolves the Flow singleton automatically (createFlow() must have run), so
+ * callers don't thread the instance through. No-op under SSR.
+ */
+export function createProfileButton(options) {
+    if (typeof document === "undefined")
+        return { destroy() { } };
+    const flow = options.flow ?? getFlow() ?? requireFlow();
+    const host = (options.host ?? flow.host ?? DEFAULT_HOST).replace(/\/+$/, "");
+    const hostOrigin = new URL(host).origin;
+    const theme = options.theme ?? "light dark";
+    let createdContainer = null;
+    let container = options.container ?? null;
+    if (!container) {
+        const el = document.createElement("div");
+        Object.assign(el.style, {
+            position: "fixed",
+            zIndex: "2147483000",
+            // Never steal input from the host (e.g. the Godot canvas) — only the
+            // iframe re-enables pointer events for itself.
+            pointerEvents: "none",
+            padding: options.padding ?? "1.5rem",
+            ...POSITION_STYLE[options.position ?? "top-right"],
+        });
+        document.body.appendChild(el);
+        createdContainer = el;
+        container = el;
+    }
+    function makeFrame() {
+        const frame = makeIframe(`${host}/dialog/`);
+        frame.dataset.flowProfile = "";
+        frame.style.display = "block";
+        return frame;
+    }
+    // A page may host several same-origin Flow iframes (this pill, this dialog,
+    // the auth login dialog). Origin filtering can't tell them apart, so each
+    // bridge is bound to its own iframe window — otherwise their `ready`/`close`
+    // handshakes would cross-fire. Identity is pinned to the host origin so the
+    // username is never broadcast with "*".
+    function makeBridge(frame, route) {
+        const bridge = bridgeToWindow(frame.contentWindow, {
+            targetOrigin: hostOrigin,
+        });
+        bridge.send("__internal", {
+            type: "init",
+            mode: "iframe",
+            referrer: { title: document.title },
+            theme: { colorScheme: theme },
+            route,
+        });
+        return bridge;
+    }
+    function currentIdentity() {
+        const user = flow.getState().user;
+        return user
+            ? { username: user.username, isGuest: user.isGuest === true }
+            : null;
+    }
+    // ----- the persistent pill (stays mounted; sizes to its own content) -----
+    const pill = makeFrame();
+    let pillWidth = 0;
+    let pillHeight = 0;
+    function applyPillSize() {
+        Object.assign(pill.style, {
+            position: "static",
+            width: `${pillWidth}px`,
+            height: `${pillHeight}px`,
+            pointerEvents: pillWidth > 0 ? "auto" : "none",
+        });
+    }
+    applyPillSize();
+    container.appendChild(pill);
+    const pillBridge = makeBridge(pill, "/dialog/profile-pill");
+    pillBridge.on("__internal", (payload) => {
+        if (payload.type === "profile-resize") {
+            pillWidth = payload.width;
+            pillHeight = payload.height;
+            applyPillSize();
+        }
+        else if (payload.type === "profile-expand") {
+            showDialog();
+        }
+    });
+    // ----- the dialog overlay (lazy; a separate fullscreen iframe layered ABOVE
+    // the pill, so the pill shows through its dimmed backdrop) -----
+    let dialog = null;
+    let dialogBridge = null;
+    function ensureDialog() {
+        if (dialog)
+            return;
+        dialog = makeFrame();
+        Object.assign(dialog.style, OVERLAY_STYLE, {
+            pointerEvents: "none",
+        });
+        document.body.appendChild(dialog);
+        dialogBridge = makeBridge(dialog, "/dialog/profile");
+        dialogBridge.on("close", () => hideDialog());
+        dialogBridge.on("__internal", (payload) => {
+            if (payload.type === "profile-login") {
+                hideDialog();
+                void flow
+                    .login(payload.mode === "signup" ? { signUp: true } : { signIn: true })
+                    .catch(() => { });
+            }
+            else if (payload.type === "profile-logout") {
+                hideDialog();
+                void flow.logout().catch(() => { });
+            }
+        });
+        void dialogBridge.send("__internal", {
+            type: "profile-identity",
+            identity: currentIdentity(),
+        });
+    }
+    // The dialog owns its open/close animation entirely; the host only signals
+    // visibility and toggles hit-testing. The overlay iframe is NEVER set to
+    // display:none — that pauses the iframe's requestAnimationFrame, so motion's
+    // engine is asleep when the next open fires and the animation jumps straight
+    // to its end (instant). Keeping it always-rendered, transparent and
+    // click-through while hidden keeps every open/close animation reliable.
+    function showDialog() {
+        ensureDialog();
+        if (!dialog)
+            return;
+        dialog.style.pointerEvents = "auto";
+        void dialogBridge?.send("__internal", { type: "dialog-shown" });
+    }
+    function hideDialog() {
+        if (!dialog)
+            return;
+        dialog.style.pointerEvents = "none";
+        void dialogBridge?.send("__internal", { type: "dialog-hidden" });
+    }
+    // ----- keep both iframes' identity in sync with the Flow session -----
+    // flow.subscribe fires on any store change (jwt/credential/address too), so
+    // skip re-sending an identical identity (e.g. on every silent JWT refresh).
+    let lastIdentityKey;
+    function pushIdentity() {
+        const identity = currentIdentity();
+        const key = identity ? `${identity.username}|${identity.isGuest}` : "none";
+        if (key === lastIdentityKey)
+            return;
+        lastIdentityKey = key;
+        void pillBridge.send("__internal", { type: "profile-identity", identity });
+        if (dialogBridge)
+            void dialogBridge.send("__internal", {
+                type: "profile-identity",
+                identity,
+            });
+    }
+    pushIdentity();
+    const unsubscribe = flow.subscribe(pushIdentity);
+    return {
+        destroy() {
+            unsubscribe();
+            pillBridge.destroy();
+            dialogBridge?.destroy();
+            pill.remove();
+            dialog?.remove();
+            createdContainer?.remove();
+        },
+    };
+}

package/dist/sdk/client/signing.d.ts

@@ -1,5 +1,5 @@
 import { type Hex, type WalletClient } from "viem";
-import type { SendCallsArgs, SendTransactionArgs, SignMessageArgs, SignTypedDataArgs, SigningContext } from "../types";
+import type { SendCallsArgs, SendTransactionArgs, SigningContext, SignMessageArgs, SignTypedDataArgs } from "../types";
 /**
  * Constructs a viem WalletClient bound to the user's Flow account. Wraps the
  * transport in `walletNamespaceCompat` so Tempo's wallet RPC namespace is

package/dist/sdk/client/signing.js

@@ -108,7 +108,9 @@ export async function buildWalletClient(ctx, chainId) {
     return createWalletClient({
         account,
         chain: withAccessKeyAuthorization(chain, address),
-        transport: walletNamespaceCompat(transport, { account }),
+        transport: walletNamespaceCompat(transport, {
+            account,
+        }),
     });
 }
 export async function signMessage(ctx, args) {

package/dist/sdk/client/store.js

@@ -28,7 +28,10 @@ export const initialFlowState = {
 function shallowEqual(a, b) {
     if (a === b)
         return true;
-    if (typeof a !== "object" || typeof b !== "object" || a === null || b === null) {
+    if (typeof a !== "object" ||
+        typeof b !== "object" ||
+        a === null ||
+        b === null) {
         return false;
     }
     const ak = Object.keys(a);