@genex-ai/embed-sdk 0.9.0 → 0.11.0

package/dist/{chunk-BWJ2FVCH.js → chunk-EEOKYBXG.js}

@@ -25,6 +25,7 @@ var authWaiters = [];
 var playerWaiters = [];
 var overlayEl = null;
 var popoverEl = null;
+var popoverMinimizeTimer;
 var pendingPlayerSave;
 var hasPendingPlayerSave = false;
 var pendingScores = /* @__PURE__ */ new Map();
@@ -621,19 +622,91 @@ function enterBlocked() {
 }
 var OVERLAY_TEXT = {
   // Delayed (text grace period): most connects finish before the text ever
-  // shows — a sub-second text flash reads as a glitch.
-  connecting: { title: "Connecting\u2026" },
-  // Same copy as `connecting` so the whole standalone bounce (gate ->
+  // shows — a sub-second text flash reads as a glitch. `wordmark` states show
+  // GENEX in the breathing decrypt loop instead of an instruction.
+  connecting: { title: "GENEX", wordmark: true },
+  // Same treatment as `connecting` so the whole standalone bounce (gate ->
   // /play/authorize -> gate) reads as ONE continuous screen. Still neutral:
   // the automatic bounce precedes GUEST play as often as sign-in.
-  redirecting: { title: "Connecting\u2026" },
+  redirecting: { title: "GENEX", wordmark: true },
   // Terminal states need the visitor to act — text shows immediately.
   "blocked-standalone": { title: "Sign in to play", button: "Sign in", instant: true },
   "blocked-embedded": { title: "Sign in on the Genex dashboard to continue", instant: true }
 };
-var OVERLAY_FONT_URL = "https://cdn.genex.technology/fonts/Geist-variable.woff2";
-var OVERLAY_FONT_STACK = "'Geist',system-ui,-apple-system,sans-serif";
+var OVERLAY_FONT_URL = "https://cdn.genex.technology/fonts/GeistMono-variable.woff2";
+var OVERLAY_FONT_STACK = "'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace";
 var overlayFontRequested = false;
+var SCRAMBLE_NOISE = "!<>-_/[]{}=+*^?#$%&@";
+var SCRAMBLE_TICK_MS = 50;
+var SCRAMBLE_SETTLE_TICKS = 10;
+var WORDMARK_LOOP_PHASES = [
+  { name: "churn", ticks: 5 },
+  { name: "settle", ticks: 10 },
+  { name: "hold", ticks: 12 },
+  { name: "dissolve", ticks: 8 }
+];
+function scrambleNoise(length) {
+  let out = "";
+  for (let i = 0; i < length; i++) {
+    out += SCRAMBLE_NOISE[Math.floor(Math.random() * SCRAMBLE_NOISE.length)];
+  }
+  return out;
+}
+function scrambleStatic() {
+  try {
+    const w = win();
+    if (!w || typeof w.matchMedia !== "function") return true;
+    return w.matchMedia("(prefers-reduced-motion: reduce)").matches;
+  } catch {
+    return true;
+  }
+}
+function scrambleIn(el, text) {
+  if (scrambleStatic()) {
+    el.textContent = text;
+    return () => {
+    };
+  }
+  let i = 0;
+  el.textContent = scrambleNoise(text.length);
+  const id = setInterval(() => {
+    i++;
+    if (i >= SCRAMBLE_SETTLE_TICKS) {
+      el.textContent = text;
+      clearInterval(id);
+      return;
+    }
+    const lock = Math.floor(i / SCRAMBLE_SETTLE_TICKS * text.length);
+    el.textContent = text.slice(0, lock) + scrambleNoise(text.length - lock);
+  }, SCRAMBLE_TICK_MS);
+  return () => clearInterval(id);
+}
+function wordmarkLoop(el, text) {
+  if (scrambleStatic()) {
+    el.textContent = text;
+    return () => {
+    };
+  }
+  let phase = 0;
+  let i = 0;
+  const frame = () => {
+    const p = WORDMARK_LOOP_PHASES[phase];
+    let kept;
+    if (p.name === "churn") kept = 0;
+    else if (p.name === "settle") kept = Math.floor(i / p.ticks * text.length);
+    else if (p.name === "hold") kept = text.length;
+    else kept = text.length - Math.floor(i / p.ticks * text.length);
+    el.textContent = text.slice(0, kept) + scrambleNoise(text.length - kept);
+    i++;
+    if (i >= p.ticks) {
+      i = 0;
+      phase = (phase + 1) % WORDMARK_LOOP_PHASES.length;
+    }
+  };
+  frame();
+  const id = setInterval(frame, SCRAMBLE_TICK_MS);
+  return () => clearInterval(id);
+}
 function ensureOverlayFont(d) {
   if (overlayFontRequested) return;
   overlayFontRequested = true;
@@ -641,7 +714,7 @@ function ensureOverlayFont(d) {
     const FF = win()?.FontFace;
     const fonts = d.fonts;
     if (!FF || !fonts?.add) return;
-    const face = new FF("Geist", `url(${OVERLAY_FONT_URL}) format('woff2')`, {
+    const face = new FF("Geist Mono", `url(${OVERLAY_FONT_URL}) format('woff2')`, {
       weight: "100 900",
       display: "swap"
     });
@@ -664,7 +737,7 @@ function removeOverlay(instant = false) {
     const el = overlayEl;
     overlayEl = null;
     if (!el) return;
-    el.clearTextTimer();
+    el.stopText();
     const root = el.root;
     if (instant || !root.style) {
       root.remove?.();
@@ -686,12 +759,12 @@ function buildOverlay(d) {
   ensureOverlayFont(d);
   const root = d.createElement("div");
   root.setAttribute("data-genex-embed-overlay", "");
-  root.style.cssText = `position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;background:#000;color:#fff;font-family:${OVERLAY_FONT_STACK};text-align:center;pointer-events:auto;user-select:none`;
+  root.style.cssText = `position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;background:#000;color:#fff;font-family:${OVERLAY_FONT_STACK};text-align:center;pointer-events:auto;user-select:none`;
   const title = d.createElement("div");
-  title.style.cssText = "font-size:18px;font-weight:600;padding:0 24px;opacity:0";
+  title.style.cssText = "font-size:13px;font-weight:400;line-height:1.3;padding:0 24px;opacity:0;min-height:1.3em;font-variant-ligatures:none";
   root.appendChild(title);
   const button = d.createElement("button");
-  button.style.cssText = "font-size:15px;font-weight:600;padding:10px 28px;border-radius:9px;border:none;cursor:pointer;background:#4b60bf;color:#fff;display:none";
+  button.style.cssText = "font-family:inherit;font-size:13px;font-weight:500;line-height:1.3;padding:8px 22px;border-radius:9px;border:none;cursor:pointer;background:#4b60bf;color:#fff;display:none";
   button.addEventListener("mouseenter", () => {
     button.style.background = "#3f51a8";
   });
@@ -712,29 +785,37 @@ function buildOverlay(d) {
   if (d.body) mount();
   else d.addEventListener?.("DOMContentLoaded", mount);
   let textTimer;
-  const clearTextTimer = () => {
+  let cancelScramble;
+  const stopText = () => {
     if (textTimer !== void 0) {
       clearTimeout(textTimer);
       textTimer = void 0;
     }
+    if (cancelScramble) {
+      cancelScramble();
+      cancelScramble = void 0;
+    }
   };
   return {
     root,
-    clearTextTimer,
+    stopText,
     setContent(kind) {
       const text = OVERLAY_TEXT[kind];
-      clearTextTimer();
+      stopText();
       title.textContent = text.title;
-      if (text.instant || overlayTextDelayMs <= 0) {
-        title.style.transition = "";
+      title.style.letterSpacing = text.wordmark ? "0.22em" : "";
+      title.style.marginRight = text.wordmark ? "-0.22em" : "";
+      const reveal = () => {
         title.style.opacity = "1";
+        cancelScramble = text.wordmark ? wordmarkLoop(title, text.title) : scrambleIn(title, text.title);
+      };
+      if (text.instant || overlayTextDelayMs <= 0) {
+        reveal();
       } else {
-        title.style.transition = "";
         title.style.opacity = "0";
         textTimer = setTimeout(() => {
           textTimer = void 0;
-          title.style.transition = "opacity 200ms ease";
-          title.style.opacity = "1";
+          reveal();
         }, overlayTextDelayMs);
       }
       button.style.display = text.button ? "inline-block" : "none";
@@ -752,6 +833,10 @@ function showGuestPopover() {
   }
 }
 function removeGuestPopover() {
+  if (popoverMinimizeTimer !== void 0) {
+    clearTimeout(popoverMinimizeTimer);
+    popoverMinimizeTimer = void 0;
+  }
   try {
     const root = popoverEl?.root;
     root?.remove?.();
@@ -761,15 +846,31 @@ function removeGuestPopover() {
 }
 function buildGuestPopover(d) {
   ensureOverlayFont(d);
+  let mobile = false;
+  try {
+    const w = win();
+    const nav = w?.navigator;
+    if (w && nav) {
+      const coarse = w.matchMedia?.("(pointer: coarse)").matches ?? false;
+      const touch = (nav.maxTouchPoints ?? 0) > 1;
+      const mobileUA = nav.userAgentData ? nav.userAgentData.mobile : /Mobi|Android/i.test(nav.userAgent ?? "");
+      mobile = touch && coarse || mobileUA;
+    }
+  } catch {
+  }
   const root = d.createElement("div");
   root.setAttribute("data-genex-guest-popover", "");
-  root.style.cssText = `position:fixed;top:12px;right:12px;z-index:2147483646;display:flex;align-items:center;gap:12px;padding:10px 12px 10px 16px;border-radius:12px;background:rgba(0,0,0,0.85);color:#fff;font-family:${OVERLAY_FONT_STACK};font-size:13px;box-shadow:0 4px 24px rgba(0,0,0,0.4);pointer-events:auto;user-select:none`;
+  root.style.cssText = "position:fixed;top:calc(12px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));z-index:2147483646;display:flex;justify-content:flex-end;pointer-events:none";
+  const card = d.createElement("div");
+  card.style.cssText = `display:flex;align-items:center;border-radius:12px;background:rgba(0,0,0,0.85);color:#fff;font-family:${OVERLAY_FONT_STACK};box-shadow:0 4px 24px rgba(0,0,0,0.4);pointer-events:auto;user-select:none;` + (mobile ? "gap:8px;padding:8px 8px 8px 12px;font-size:12px;max-width:calc(100vw - 88px)" : "gap:12px;padding:10px 12px 10px 16px;font-size:13px");
+  root.appendChild(card);
   const text = d.createElement("span");
-  text.textContent = user?.name ? `Playing as ${user.name} \u2014 sign in to save progress` : "Sign in to save progress";
-  root.appendChild(text);
+  text.textContent = !mobile && user?.name ? `Playing as ${user.name} \u2014 sign in to save progress` : "Sign in to save progress";
+  if (mobile) text.style.cssText = "overflow:hidden;text-overflow:ellipsis;white-space:nowrap";
+  card.appendChild(text);
   const signIn = d.createElement("button");
   signIn.textContent = "Sign in";
-  signIn.style.cssText = "font-size:13px;font-weight:600;padding:6px 16px;border-radius:9px;border:none;cursor:pointer;background:#4b60bf;color:#fff";
+  signIn.style.cssText = "font-family:inherit;font-weight:500;border-radius:9px;border:none;cursor:pointer;background:#4b60bf;color:#fff;" + (mobile ? "font-size:12px;padding:5px 12px" : "font-size:13px;padding:6px 16px");
   signIn.addEventListener("mouseenter", () => {
     signIn.style.background = "#3f51a8";
   });
@@ -783,7 +884,7 @@ function buildGuestPopover(d) {
     clearRetryFlag();
     void redirectToAuthorize(w);
   });
-  root.appendChild(signIn);
+  card.appendChild(signIn);
   const dismiss = d.createElement("button");
   dismiss.textContent = "\xD7";
   dismiss.setAttribute("aria-label", "Dismiss");
@@ -792,7 +893,24 @@ function buildGuestPopover(d) {
     writePopoverDismissed();
     removeGuestPopover();
   });
-  root.appendChild(dismiss);
+  card.appendChild(dismiss);
+  if (mobile) {
+    const chip = d.createElement("button");
+    chip.setAttribute("aria-label", "Sign in to save progress");
+    chip.style.cssText = "display:none;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;background:rgba(0,0,0,0.55);color:#fff;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:auto";
+    chip.innerHTML = '<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"/><polyline points="10 17 15 12 10 7"/><line x1="15" y1="12" x2="3" y2="12"/></svg>';
+    root.appendChild(chip);
+    const setMinimized = (v) => {
+      card.style.display = v ? "none" : "flex";
+      chip.style.display = v ? "flex" : "none";
+    };
+    popoverMinimizeTimer = setTimeout(() => setMinimized(true), 5e3);
+    card.addEventListener("pointerdown", () => {
+      if (popoverMinimizeTimer !== void 0) clearTimeout(popoverMinimizeTimer);
+      popoverMinimizeTimer = void 0;
+    });
+    chip.addEventListener("click", () => setMinimized(false));
+  }
   const mount = () => {
     if (d.body && !root.isConnected) d.body.appendChild(root);
   };

package/dist/index.js

@@ -17,7 +17,7 @@ import {
   submitScore,
   waitForAuth,
   waitForPlayer
-} from "./chunk-BWJ2FVCH.js";
+} from "./chunk-EEOKYBXG.js";
 export {
   __resetForTests,
   _stashTicketFromUrl,

package/dist/sentry.js

@@ -2,7 +2,7 @@ import {
   _stashTicketFromUrl,
   getUser,
   on
-} from "./chunk-BWJ2FVCH.js";
+} from "./chunk-EEOKYBXG.js";
 
 // src/sentry.ts
 import * as Sentry from "@sentry/browser";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@genex-ai/embed-sdk",
-  "version": "0.9.0",
+  "version": "0.11.0",
   "description": "Player identity + durable game state for genex games \u2014 signed-in or guest play, per-player save slots, shared world state, and soft-trust leaderboards.",
   "type": "module",
   "main": "./dist/index.js",