@bounded-sh/client 0.0.112-ux-audit.2 → 0.0.112

package/dist/{index-DJeEMevo.js → index-BmNNZlTl.js}

@@ -3897,9 +3897,13 @@ async function ensureSolanaMobileWalletRegistered(config, network) {
             }
             catch (_e) {
                 throw new WalletConfigError(`Bounded: Solana Mobile wallet support needs the optional peer dependency ` +
-                    `'@solana-mobile/wallet-standard-mobile', which is not installed. Install it ` +
-                    `in your app to enable the mobile wallet, or leave the Solana Mobile wallet ` +
-                    `out of this app's wallet configuration.`);
+                    `'@solana-mobile/wallet-standard-mobile', which is not installed. Until it is, ` +
+                    `Android users (Seeker, Saga, any phone browser) get NO wallet to connect: ` +
+                    `installed wallet apps are never injected into a page there, the mobile adapter ` +
+                    `is the only route. Fix: npm install @solana-mobile/wallet-standard-mobile ` +
+                    `(a web app also needs legacy-peer-deps=true in its .npmrc, because the adapter's ` +
+                    `protocol package declares react-native as a peer). Or leave the Solana Mobile ` +
+                    `wallet out of this app's wallet configuration on purpose.`);
             }
             const { registerMwa, createDefaultChainSelector, SolanaMobileWalletAdapterWalletName, SolanaMobileWalletAdapterRemoteWalletName, } = mwa;
             const before = new Set(getWallets().get());
@@ -3986,7 +3990,7 @@ const OVERLAY_CSS = `
 :host{all:initial}
 *{box-sizing:border-box}
 .bw-ov{position:fixed;inset:0;z-index:2147483647;display:none;
-  font-family:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif}
+  font-family:"Bounded Schibsted Grotesk","Schibsted Grotesk","Helvetica Neue",Arial,sans-serif}
 .bw-ov.mounted{display:block}
 .bw-back{position:fixed;inset:0;background:rgba(4,4,5,.62);opacity:0;
   transition:opacity .24s ease;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
@@ -4019,6 +4023,29 @@ const OVERLAY_CSS = `
 }
 @media(prefers-reduced-motion:reduce){.bw-back,.bw-panel{transition:opacity .12s linear!important}}
 `;
+/**
+ * Style the shadow tree with `css` as constructed stylesheets, and say whether it could. A host
+ * CSP whose style-src lacks 'unsafe-inline' refuses an inline <style> even inside a shadow root,
+ * which left the widget unstyled (the Bounded router compiles exactly `style-src 'self'` for an
+ * app that declares browser boundaries and names no style sources); CSP does not govern
+ * constructed sheets. A browser without them (they shipped with adoptedStyleSheets everywhere)
+ * gets <style> elements instead (styleTag).
+ */
+function adoptStyles(shadow, css) {
+    if (!("adoptedStyleSheets" in shadow))
+        return false;
+    shadow.adoptedStyleSheets = css.map((text) => {
+        const sheet = new CSSStyleSheet();
+        sheet.replaceSync(text);
+        return sheet;
+    });
+    return true;
+}
+function styleTag(css) {
+    const style = document.createElement("style");
+    style.textContent = css;
+    return style;
+}
 let modal = null;
 function getModal() {
     if (modal)
@@ -4026,9 +4053,8 @@ function getModal() {
     const root = document.createElement("div");
     root.setAttribute("data-bounded-widget", "");
     const shadow = root.attachShadow({ mode: "open" });
-    const style = document.createElement("style");
-    style.textContent = OVERLAY_CSS;
-    shadow.appendChild(style);
+    if (!adoptStyles(shadow, [OVERLAY_CSS]))
+        shadow.appendChild(styleTag(OVERLAY_CSS));
     const overlay = document.createElement("div");
     overlay.className = "bw-ov";
     const back = document.createElement("div");
@@ -4163,12 +4189,15 @@ function fitPanelToContent(m) {
         m.fitObserver = ro;
     }
 }
-/** Switch the modal into NATIVE-content mode: detach any iframe, mount `node`. */
-function mountContent(m, node) {
+/** Switch the modal into NATIVE-content mode: detach any iframe, mount `node`, styled by `css` until the next mount. */
+function mountContent(m, node, css) {
     var _a;
     detachIframe(m);
     (_a = m.fitObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     m.fitObserver = null;
+    const shadow = m.root.shadowRoot;
+    if (!(shadow && adoptStyles(shadow, [OVERLAY_CSS, css] )) && css)
+        node.prepend(styleTag(css));
     m.content.replaceChildren(node);
     m.content.style.display = "block";
 }
@@ -4230,27 +4259,39 @@ function detachIframe(m) {
     m.iframeContext = "";
     m.onIframeMessage = null;
 }
-// Load the Bounded editorial typefaces (Newsreader display + Schibsted Grotesk body +
-// JetBrains Mono) once at the document level so they apply inside the shadow root. A
-// no-op if already present or off-DOM. Fonts loaded here match the hosted auth page.
-const FONTS_HREF = "https://fonts.googleapis.com/css2?family=Newsreader:opsz,wght@6..72,400;6..72,500&family=Schibsted+Grotesk:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap";
+/**
+ * The Bounded editorial typefaces the hosted auth page uses (Newsreader display, Schibsted
+ * Grotesk body), registered once at the document level so they apply inside the shadow root.
+ *
+ * The Bounded router serves them same-origin at /__bounded/fonts/*.woff2 on every site it
+ * serves (bounded-router scripts/build-widget-styles.cjs), and they load through the FontFace
+ * API: no stylesheet, so a host CSP's style-src never applies, and the only fetch is same-origin,
+ * which font-src 'self' admits. Google Fonts CSS injected here was refused by strict hosts such
+ * as the OpenApps venue (style-src 'self'), with a CSP error on every page. A page the router
+ * does not serve has none of its /__bounded/ scripts: nothing is fetched there, and the widget's
+ * font stacks fall back to the page's own faces or system ones. The Bounded-prefixed family
+ * names never restyle the host page's own text.
+ */
+const WIDGET_FONT_FACES = [
+    { family: "Bounded Newsreader", url: "/__bounded/fonts/newsreader.woff2", weight: "200 800" },
+    { family: "Bounded Schibsted Grotesk", url: "/__bounded/fonts/schibsted.woff2", weight: "400 900" },
+];
 function ensureFonts() {
-    if (!hasDOM$5())
+    if (!hasDOM$5() || typeof FontFace === "undefined" || !document.fonts)
         return;
-    if (document.querySelector('link[data-bounded-fonts="1"]'))
+    if (!document.querySelector('script[src^="/__bounded/"]'))
         return;
-    const pre1 = document.createElement("link");
-    pre1.rel = "preconnect";
-    pre1.href = "https://fonts.googleapis.com";
-    const pre2 = document.createElement("link");
-    pre2.rel = "preconnect";
-    pre2.href = "https://fonts.gstatic.com";
-    pre2.crossOrigin = "anonymous";
-    const link = document.createElement("link");
-    link.rel = "stylesheet";
-    link.href = FONTS_HREF;
-    link.setAttribute("data-bounded-fonts", "1");
-    document.head.append(pre1, pre2, link);
+    const registered = new Set();
+    document.fonts.forEach((face) => registered.add(face.family.replace(/^["']|["']$/g, "")));
+    for (const { family, url, weight } of WIDGET_FONT_FACES) {
+        if (registered.has(family))
+            continue;
+        // Against the page's origin, not its base URL: a <base href> elsewhere must not move the fetch off this origin.
+        const face = new FontFace(family, `url("${location.origin}${url}") format("woff2")`, { weight, display: "swap" });
+        document.fonts.add(face);
+        // A face that cannot load is taken back out; the font stack falls back to the next face.
+        face.load().catch(() => { document.fonts.delete(face); });
+    }
 }
 
 // turnkey-wallet-widget.ts - runs one Turnkey signer exchange inside the shared
@@ -6270,7 +6311,7 @@ async function getAuthProvider(config, fromStorage = false) {
             // manager as legacy email sessions. Human login should be started
             // with loginWithRedirect(); this provider is kept as the restore and
             // logout surface for those sessions.
-            currentAuthProvider = new (await Promise.resolve().then(function () { return require('./email-auth-provider-53sA5_i2.js'); })).EmailAuthProvider();
+            currentAuthProvider = new (await Promise.resolve().then(function () { return require('./email-auth-provider-CyFsnSzx.js'); })).EmailAuthProvider();
             break;
         case "phantom": {
             // First-class Solana WALLET LOGIN (the poof/TaroBase-style "connect
@@ -6312,7 +6353,7 @@ async function getAuthProvider(config, fromStorage = false) {
             // (bounded-login-widget.ts), so registration never counts as
             // evidence the user has a wallet.
             await ensureSolanaMobileWalletRegistered(config, configuredNetwork);
-            const { InjectedWalletProvider } = await Promise.resolve().then(function () { return require('./injected-wallet-provider-BEYwsn6M.js'); });
+            const { InjectedWalletProvider } = await Promise.resolve().then(function () { return require('./injected-wallet-provider-D8vIsUHf.js'); });
             currentAuthProvider = new InjectedWalletProvider(resolveInjectedWalletConfig(config), rpcUrl, configuredNetwork);
             break;
         }
@@ -6325,7 +6366,7 @@ async function getAuthProvider(config, fromStorage = false) {
             // Selecting authMethod:'evm-wallet' IS the opt-in — pass evmWalletConfig
             // to point at a specific wallet or set chainId/domain.
             const evmWalletConfig = ((_a = config.evmWalletConfig) !== null && _a !== void 0 ? _a : {});
-            const { InjectedEvmWalletProvider } = await Promise.resolve().then(function () { return require('./injected-evm-wallet-provider-IlkuKffc.js'); });
+            const { InjectedEvmWalletProvider } = await Promise.resolve().then(function () { return require('./injected-evm-wallet-provider-C8YItSiB.js'); });
             currentAuthProvider = new InjectedEvmWalletProvider(evmWalletConfig);
             break;
         }
@@ -6350,7 +6391,7 @@ async function getAuthProvider(config, fromStorage = false) {
             break;
         case "guest":
             // Anonymous auth: a device-local ed25519 keypair signs the challenge.
-            currentAuthProvider = new (await Promise.resolve().then(function () { return require('./guest-auth-provider-00KkSNpE.js'); })).GuestAuthProvider();
+            currentAuthProvider = new (await Promise.resolve().then(function () { return require('./guest-auth-provider-B4WIWOjV.js'); })).GuestAuthProvider();
             break;
     }
     if (!currentAuthProvider) {
@@ -6412,7 +6453,7 @@ async function signInAnonymously() {
     // Lazy-load the guest provider so its ed25519/web3 dependencies stay out of
     // the main bundle for data-only apps. Specifier is a static string literal
     // so bundle-splitting can see it.
-    const provider = new (await Promise.resolve().then(function () { return require('./guest-auth-provider-00KkSNpE.js'); })).GuestAuthProvider();
+    const provider = new (await Promise.resolve().then(function () { return require('./guest-auth-provider-B4WIWOjV.js'); })).GuestAuthProvider();
     setAuthLoading(true); // reflect "signing in…" while the guest keypair session is minted
     // adoptSessionProvider awaits only getConfig() (already resolved here) and then
     // runs every write - provider/method/config/marker/user - in one synchronous
@@ -6583,7 +6624,7 @@ function ensureSharedWalletLoginReady() {
     if (!sharedWalletReady) {
         sharedWalletReady = (async () => {
             await core.getConfig();
-            await Promise.resolve().then(function () { return require('./injected-wallet-provider-BEYwsn6M.js'); });
+            await Promise.resolve().then(function () { return require('./injected-wallet-provider-D8vIsUHf.js'); });
         })().catch((error) => {
             sharedWalletReady = null;
             throw error;
@@ -6686,7 +6727,7 @@ async function loginWithWallet(options) {
         await ensureSharedWalletLoginReady();
     else
         await ensureWalletLoginReady();
-    const { InjectedWalletProvider } = await Promise.resolve().then(function () { return require('./injected-wallet-provider-BEYwsn6M.js'); });
+    const { InjectedWalletProvider } = await Promise.resolve().then(function () { return require('./injected-wallet-provider-D8vIsUHf.js'); });
     // Keep the RAW wallet provider: the offchain wrapper forwards only a fixed
     // set of methods, so cleanup below must speak to the provider that actually
     // holds the config rather than to whatever is wrapping it.
@@ -7053,6 +7094,13 @@ function registerStorageBridge() {
         void syncStoredSession().catch((error) => console.warn('Bounded session synchronization failed:', error));
     });
 }
+function sameSessionIdentity(next, previous) {
+    if (!next || !previous)
+        return false;
+    const a = core.deriveUserIdentityFromIdToken(next);
+    const b = core.deriveUserIdentityFromIdToken(previous);
+    return !!a.id && a.id === b.id && a.address === b.address && a.email === b.email && a.evmAddress === b.evmAddress;
+}
 async function syncStoredSession() {
     const config = initializedConfig;
     if (!config)
@@ -7061,6 +7109,18 @@ async function syncStoredSession() {
     const issuer = core.WebSessionManager.getIssuer();
     if (token === observedIdToken && issuer === observedIssuer)
         return;
+    // Another tab refreshed this same session (tokens rotate every few minutes):
+    // who is signed in did not change, so keep the user and its live reads, whose
+    // sockets take the new token on their own, instead of hiding and restoring it.
+    if (currentUser && issuer === observedIssuer && sameSessionIdentity(token, observedIdToken)) {
+        const record = await core.WebSessionManager.readSessionWithGeneration();
+        if (config !== initializedConfig || core.WebSessionManager.getIdToken() !== token)
+            return;
+        if ((record === null || record === void 0 ? void 0 : record.idToken) === token && (!record.appId || record.appId === config.appId)) {
+            observedIdToken = token;
+            return;
+        }
+    }
     observedIdToken = token;
     observedIssuer = issuer;
     const generation = ++initializationGeneration;
@@ -8088,8 +8148,8 @@ const CARD_CSS = `
   --line:rgba(232,230,222,.08);--line-strong:rgba(232,230,222,.16);
   --text:#e8e6de;--dim:#9b9991;--faint:#85837c;
   --green:#58c98f;--green-bg:rgba(88,201,143,.09);--green-line:rgba(88,201,143,.28);--red:#ec8488;
-  --disp:"Newsreader","Iowan Old Style",Georgia,serif;
-  --body:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
+  --disp:"Bounded Newsreader","Newsreader","Iowan Old Style",Georgia,serif;
+  --body:"Bounded Schibsted Grotesk","Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
   position:relative;padding:34px 32px 20px;color:var(--text);font-family:var(--body);
   -webkit-font-smoothing:antialiased}
 .x{position:absolute;top:20px;right:24px;border:0;background:transparent;color:var(--faint);
@@ -8210,6 +8270,17 @@ function discoverWallets(configuredNetwork) {
 // beats a click that does nothing, which is what "one at a time" looks like from
 // the outside.
 const BUSY_MSG = "A sign-in is already in progress - finish or cancel it first.";
+// Shown instead of an empty card when no lane can be offered (wallet-only app,
+// no wallet in this browser). A phone browser never sees installed wallet apps
+// as injected providers, so the honest advice there is a different browser,
+// not "install a wallet".
+function noLaneCopy(mobile) {
+    return mobile
+        ? "No wallet is available in this browser. Open this page in your wallet app's " +
+            "browser, or on a desktop browser with a wallet extension, then try again."
+        : "No wallet was found in this browser. Install a Solana wallet extension such as " +
+            "Phantom or Solflare, reload the page, then try again.";
+}
 const METHOD_LABEL = {
     google: "Continue with Google",
     apple: "Continue with Apple",
@@ -8551,12 +8622,9 @@ async function prepareAndOpen(opts, pending) {
             cancelPendingOpens();
         };
         m.onBackdrop = cancel;
-        const style = el("style");
-        style.textContent = CARD_CSS;
         let emailDraft = "";
         const renderChoose = (initialError) => {
             const card = el("div", "c");
-            card.appendChild(style.cloneNode(true));
             const x = el("button", "x", "Close");
             x.type = "button";
             x.setAttribute("aria-label", "Close");
@@ -8773,6 +8841,24 @@ async function prepareAndOpen(opts, pending) {
                     });
                 };
             }
+            // A card with no lane at all. It happens when an app asks for wallet-only
+            // (`methods: []`, `wallet: true`) and this browser has no wallet to offer:
+            // no injected wallet, and no Solana Mobile wallet (off-Android, or the app
+            // never installed the adapter). A blank card between the title and the
+            // footer was the shipped behaviour, and it reads as "the site is broken"
+            // to the person and tells the developer nothing. Say what is missing on
+            // screen, and name the usual cause once in the console, where the
+            // developer's own preview run will show it.
+            if (!hasEmail && social.length === 0 && !walletEnabled) {
+                card.appendChild(el("p", "sub", noLaneCopy(detectMobile())));
+                console.warn("[Bounded] openBoundedWidget has no sign-in lane to show: the app asked for " +
+                    "no email or social method and no wallet is available in this browser. " +
+                    (offerMobile
+                        ? "On Android the Solana Mobile wallet is offered only when the app installs " +
+                            "'@solana-mobile/wallet-standard-mobile' (see the warning above if registration failed); "
+                        : "") +
+                    "Add a method, or make sure wallet login is enabled and the mobile adapter is installed.");
+            }
             card.appendChild(status);
             const foot = el("div", "foot");
             const poweredBy = el("a", undefined, "Powered by Bounded");
@@ -8819,7 +8905,6 @@ async function prepareAndOpen(opts, pending) {
         const renderSignInGesture = (choice, done) => {
             var _a;
             const card = el("div", "c");
-            card.appendChild(style.cloneNode(true));
             const x = el("button", "x", "Close");
             x.type = "button";
             x.setAttribute("aria-label", "Close");
@@ -8840,7 +8925,6 @@ async function prepareAndOpen(opts, pending) {
         };
         const renderWallets = (initialError) => {
             const card = el("div", "c");
-            card.appendChild(style.cloneNode(true));
             const back = el("button", "back", "\u2190 Back");
             back.type = "button";
             // Leaving the wallet list supersedes any attempt still preparing, so it
@@ -8920,7 +9004,6 @@ async function prepareAndOpen(opts, pending) {
         // experience still feels native; the code input, sealing, and verify all live behind the frame.
         const renderOtpFrame = (handle) => {
             const card = el("div", "c");
-            card.appendChild(style.cloneNode(true));
             const back = el("button", "back", "\u2190 Back");
             back.type = "button";
             card.appendChild(back);
@@ -8967,7 +9050,7 @@ async function prepareAndOpen(opts, pending) {
             // land after a newer open has taken over the DOM.
             if (!owner.owns())
                 return;
-            mountContent(m, node);
+            mountContent(m, node, CARD_CSS);
             requestAnimationFrame(() => {
                 if (owner.owns())
                     fitPanelToContent(m);
@@ -11359,4 +11442,4 @@ exports.useAuth = useAuth;
 exports.useBuildRun = useBuildRun;
 exports.useQuery = useQuery;
 exports.waitForAuthReady = waitForAuthReady;
-//# sourceMappingURL=index-DJeEMevo.js.map
+//# sourceMappingURL=index-BmNNZlTl.js.map