@genex-ai/embed-sdk 0.6.1 → 0.7.0

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

@@ -16,6 +16,7 @@ var identityEpoch = 0;
 var handshakeTimeoutMs = 1e4;
 var refreshDelayMs = 10 * 6e4;
 var refreshRetryMs = 6e4;
+var overlayTextDelayMs = 500;
 var handshakeTimer;
 var refreshTimer;
 var messageHandler;
@@ -619,13 +620,36 @@ function enterBlocked() {
   emit("blocked");
 }
 var OVERLAY_TEXT = {
-  connecting: { title: "Connecting to Genex\u2026" },
-  // Neutral on purpose: the automatic bounce precedes GUEST play as often as
-  // sign-in — "signing you in" would be wrong for most visitors.
-  redirecting: { title: "Loading\u2026" },
-  "blocked-standalone": { title: "Sign in to play", button: "Sign in" },
-  "blocked-embedded": { title: "Sign in on the Genex dashboard to continue" }
+  // 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 ->
+  // /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" },
+  // 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 overlayFontRequested = false;
+function ensureOverlayFont(d) {
+  if (overlayFontRequested) return;
+  overlayFontRequested = true;
+  try {
+    const FF = win()?.FontFace;
+    const fonts = d.fonts;
+    if (!FF || !fonts?.add) return;
+    const face = new FF("Geist", `url(${OVERLAY_FONT_URL}) format('woff2')`, {
+      weight: "100 900",
+      display: "swap"
+    });
+    face.load().then((loaded) => fonts.add(loaded)).catch(() => {
+    });
+  } catch {
+  }
+}
 function showOverlay(kind) {
   const d = doc();
   if (!d?.createElement) return;
@@ -635,23 +659,45 @@ function showOverlay(kind) {
   } catch {
   }
 }
-function removeOverlay() {
+function removeOverlay(instant = false) {
   try {
-    const root = overlayEl?.root;
-    root?.remove?.();
+    const el = overlayEl;
+    overlayEl = null;
+    if (!el) return;
+    el.clearTextTimer();
+    const root = el.root;
+    if (instant || !root.style) {
+      root.remove?.();
+      return;
+    }
+    root.style.pointerEvents = "none";
+    root.style.transition = "opacity 180ms ease";
+    root.style.opacity = "0";
+    setTimeout(() => {
+      try {
+        root.remove?.();
+      } catch {
+      }
+    }, 220);
   } catch {
   }
-  overlayEl = null;
 }
 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:#080a14;color:#fff;font-family:system-ui,-apple-system,sans-serif;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:16px;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";
+  title.style.cssText = "font-size:18px;font-weight:600;padding:0 24px;opacity:0";
   root.appendChild(title);
   const button = d.createElement("button");
-  button.style.cssText = "font-size:15px;font-weight:600;padding:10px 28px;border-radius:8px;border:none;cursor:pointer;background:#fff;color:#111;display:none";
+  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.addEventListener("mouseenter", () => {
+    button.style.background = "#3f51a8";
+  });
+  button.addEventListener("mouseleave", () => {
+    button.style.background = "#4b60bf";
+  });
   button.addEventListener("click", () => {
     const w = win();
     if (!w) return;
@@ -665,11 +711,32 @@ function buildOverlay(d) {
   };
   if (d.body) mount();
   else d.addEventListener?.("DOMContentLoaded", mount);
+  let textTimer;
+  const clearTextTimer = () => {
+    if (textTimer !== void 0) {
+      clearTimeout(textTimer);
+      textTimer = void 0;
+    }
+  };
   return {
     root,
+    clearTextTimer,
     setContent(kind) {
       const text = OVERLAY_TEXT[kind];
+      clearTextTimer();
       title.textContent = text.title;
+      if (text.instant || overlayTextDelayMs <= 0) {
+        title.style.transition = "";
+        title.style.opacity = "1";
+      } else {
+        title.style.transition = "";
+        title.style.opacity = "0";
+        textTimer = setTimeout(() => {
+          textTimer = void 0;
+          title.style.transition = "opacity 200ms ease";
+          title.style.opacity = "1";
+        }, overlayTextDelayMs);
+      }
       button.style.display = text.button ? "inline-block" : "none";
       if (text.button) button.textContent = text.button;
       mount();
@@ -693,15 +760,22 @@ function removeGuestPopover() {
   popoverEl = null;
 }
 function buildGuestPopover(d) {
+  ensureOverlayFont(d);
   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(8,10,20,0.85);color:#fff;font-family:system-ui,-apple-system,sans-serif;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: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`;
   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);
   const signIn = d.createElement("button");
   signIn.textContent = "Sign in";
-  signIn.style.cssText = "font-size:13px;font-weight:600;padding:6px 16px;border-radius:999px;border:none;cursor:pointer;background:#fff;color:#111";
+  signIn.style.cssText = "font-size:13px;font-weight:600;padding:6px 16px;border-radius:9px;border:none;cursor:pointer;background:#4b60bf;color:#fff";
+  signIn.addEventListener("mouseenter", () => {
+    signIn.style.background = "#3f51a8";
+  });
+  signIn.addEventListener("mouseleave", () => {
+    signIn.style.background = "#4b60bf";
+  });
   signIn.addEventListener("click", () => {
     const w = win();
     if (!w) return;
@@ -734,8 +808,9 @@ function __resetForTests(overrides) {
   if (refreshTimer !== void 0) clearTimeout(refreshTimer);
   handshakeTimer = void 0;
   refreshTimer = void 0;
-  removeOverlay();
+  removeOverlay(true);
   removeGuestPopover();
+  overlayFontRequested = false;
   config = null;
   state = "pending";
   user = null;
@@ -757,6 +832,7 @@ function __resetForTests(overrides) {
   handshakeTimeoutMs = overrides?.handshakeTimeoutMs ?? 1e4;
   refreshDelayMs = overrides?.refreshDelayMs ?? 10 * 6e4;
   refreshRetryMs = overrides?.refreshRetryMs ?? 6e4;
+  overlayTextDelayMs = overrides?.overlayTextDelayMs ?? 500;
 }
 
 export {

package/dist/index.d.ts

@@ -221,6 +221,7 @@ declare function __resetForTests(overrides?: {
     handshakeTimeoutMs?: number;
     refreshDelayMs?: number;
     refreshRetryMs?: number;
+    overlayTextDelayMs?: number;
 }): void;
 
 export { type AuthState, type EmbedConfig, type EmbedEvent, type EmbedUser, type Leaderboard, type LeaderboardEntry, type PlayerStateResult, type SaveStateResult, type SubmitScoreResult, type WorldStateResult, __resetForTests, _stashTicketFromUrl, getAuthState, getColyseusAuth, getColyseusUrls, getEmbedToken, getLeaderboard, getUser, initEmbed, isEmbedded, loadPlayerState, loadWorldState, on, savePlayerState, saveWorldState, submitScore, waitForAuth, waitForPlayer };

package/dist/index.js

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

package/dist/sentry.js

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

package/package.json

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