@playruo/embed 1.2.2 → 1.2.5

package/dist/index.cjs

@@ -33,8 +33,8 @@ __export(index_exports, {
   EmbedTester: () => EmbedTester,
   PlayruoEmbed: () => PlayruoEmbed,
   buildEmbedUrl: () => buildEmbedUrl,
-  isPlayruoEmbedCommand: () => isPlayruoEmbedCommand,
-  isPlayruoEmbedMessage: () => isPlayruoEmbedMessage
+  isPlayruoEmbedMessage: () => isPlayruoEmbedMessage,
+  isPlayruoInternalMessage: () => isPlayruoInternalMessage
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -76,9 +76,7 @@ var PlayruoEmbed = ({
   const [isMobile, setIsMobile] = (0, import_react.useState)(false);
   const [isValidChromium, setIsValidChromium] = (0, import_react.useState)(true);
   const [errorMessage, setErrorMessage] = (0, import_react.useState)(null);
-  const escapeKeyTimer = (0, import_react.useRef)(null);
-  const escapeKeyPressed = (0, import_react.useRef)(false);
-  const ESCAPE_HOLD_DURATION = 1500;
+  const [iframeState, setIframeState] = (0, import_react.useState)(null);
   const src = (0, import_react.useMemo)(() => buildEmbedUrl({ baseUrl, operation, storeUrl }), [baseUrl, operation, storeUrl]);
   (0, import_react.useEffect)(() => {
     if (typeof window === "undefined") return;
@@ -96,81 +94,34 @@ var PlayruoEmbed = ({
   }, []);
   const isCompatible = !isMobile && isValidChromium;
   const isReady = isCompatible ? isIframeLoaded : true;
-  const currentState = (0, import_react.useMemo)(() => ({
-    hasPlayedOnce,
-    tryNow: {
-      available: isCompatible,
-      status: !isCompatible ? "Browser not compatible" : hasPlayedOnce ? "Click to replay" : "Ready"
-    },
-    buyNow: {
-      available: true,
-      status: "Ready"
-    }
-  }), [hasPlayedOnce, isCompatible]);
-  const checkKeyboardLockPermission = (0, import_react.useCallback)(async () => {
-    if (!navigator.permissions) {
-      console.log("[PlayruoEmbed] Permissions API not supported");
-      return false;
+  const currentState = (0, import_react.useMemo)(() => {
+    if (iframeState) {
+      return iframeState;
     }
-    try {
-      const { state } = await navigator.permissions.query({
-        name: "keyboard-lock"
-      });
-      if (state === "granted" || state === "prompt") {
-        console.log(`[PlayruoEmbed] Keyboard lock permission: ${state}`);
-        return true;
+    return {
+      hasPlayedOnce,
+      tryNow: {
+        available: isCompatible,
+        status: !isCompatible ? "Browser not compatible" : hasPlayedOnce ? "Click to resume" : "Ready"
+      },
+      buyNow: {
+        available: true,
+        status: "Ready"
       }
-      console.log("[PlayruoEmbed] Keyboard lock permission denied");
-      return false;
-    } catch (error) {
-      console.warn("[PlayruoEmbed] Error checking keyboard lock permission:", error);
-      return false;
-    }
-  }, []);
-  const requestFullscreenWithKeyboardLock = (0, import_react.useCallback)(async () => {
-    const iframe = iframeRef.current;
-    if (!iframe?.requestFullscreen) {
-      console.log("[PlayruoEmbed] Fullscreen not supported on this browser");
-      return false;
-    }
-    try {
-      const fullscreenPromise = iframe.requestFullscreen();
-      if (navigator.keyboard && window.self === window.top) {
-        try {
-          const permissionPromise = checkKeyboardLockPermission();
-          const keyboardLockPromise = navigator.keyboard.lock(["Escape"]);
-          void Promise.all([permissionPromise, keyboardLockPromise]).then(([hasPermission]) => {
-            if (hasPermission) {
-              console.log("[PlayruoEmbed] Keyboard locked successfully");
-            }
-          }).catch((err) => {
-            const isTopLevelContextError = err?.name === "InvalidStateError" && err?.message?.includes("primary top-level browsing context");
-            if (!isTopLevelContextError) {
-              console.warn("[PlayruoEmbed] Keyboard lock failed:", err);
-            }
-          });
-        } catch (err) {
-          const isTopLevelContextError = err?.name === "InvalidStateError" && err?.message?.includes("primary top-level browsing context");
-          if (!isTopLevelContextError) {
-            console.warn("[PlayruoEmbed] Keyboard lock error:", err);
-          }
-        }
-      } else if (!navigator.keyboard) {
-        console.log("[PlayruoEmbed] Keyboard API not supported");
-      } else {
-        console.log("[PlayruoEmbed] Keyboard lock not available (not in top-level context)");
+    };
+  }, [hasPlayedOnce, isCompatible, iframeState]);
+  const hasIframeConfirmed = Boolean(iframeState?.tryNow?.available === true);
+  const exposedState = (0, import_react.useMemo)(
+    () => ({
+      ...currentState,
+      tryNow: {
+        ...currentState.tryNow,
+        available: hasIframeConfirmed,
+        status: currentState.tryNow.status ?? (hasIframeConfirmed ? "Ready" : isCompatible ? "Checking availability\u2026" : "Browser not compatible")
       }
-      void fullscreenPromise.then(() => {
-        console.log("[PlayruoEmbed] Fullscreen activated successfully");
-      }).catch((err) => {
-        console.warn("[PlayruoEmbed] Fullscreen failed:", err);
-      });
-      return true;
-    } catch (error) {
-      console.error("[PlayruoEmbed] Error requesting fullscreen:", error);
-      return false;
-    }
-  }, [iframeRef, checkKeyboardLockPermission]);
+    }),
+    [currentState, hasIframeConfirmed, isCompatible]
+  );
   const handleTryNow = (0, import_react.useCallback)(() => {
     if (!isCompatible) {
       console.warn("[PlayruoEmbed] Browser not compatible");
@@ -190,12 +141,10 @@ var PlayruoEmbed = ({
         } catch {
         }
       }
-      requestFullscreenWithKeyboardLock();
       iframe.contentWindow?.postMessage({
         type: "playruo",
         action: "tryNowClick",
         fromEmbed: true,
-        isFullscreen: true,
         isReplay: hasPlayedOnce
       }, "*");
       console.log("[PlayruoEmbed] Sent tryNowClick to game", hasPlayedOnce ? "(replay)" : "(first time)");
@@ -209,7 +158,7 @@ var PlayruoEmbed = ({
       setErrorMessage("Failed to start game");
       onError?.("Failed to start game");
     }
-  }, [isCompatible, hasPlayedOnce, onError, iframeRef, requestFullscreenWithKeyboardLock]);
+  }, [isCompatible, hasPlayedOnce, onError, iframeRef]);
   const handleBuyNow = (0, import_react.useCallback)(() => {
     if (!storeUrl) {
       console.warn("[PlayruoEmbed] No store URL provided");
@@ -219,9 +168,9 @@ var PlayruoEmbed = ({
   }, [storeUrl, onPurchaseRequest]);
   (0, import_react.useEffect)(() => {
     if (isReady) {
-      onStateChange?.(currentState);
+      onStateChange?.(exposedState);
     }
-  }, [isReady, currentState, onStateChange]);
+  }, [isReady, exposedState, onStateChange]);
   (0, import_react.useEffect)(() => {
     if (isReady) {
       onReady?.();
@@ -229,18 +178,112 @@ var PlayruoEmbed = ({
   }, [isReady, onReady]);
   (0, import_react.useEffect)(() => {
     const handleGameMessage = (event) => {
-      const { type } = event.data || {};
+      const { type, data } = event.data || {};
+      const iframe = iframeRef.current;
+      if (!iframe || event.source !== iframe.contentWindow) {
+        return;
+      }
+      console.log("\u{1F537} [Embed] Message received from iframe:", { type, data });
+      if (type === "playruo_ready") {
+        console.log("\u{1F537} [Embed] playruo_ready received");
+        onReady?.();
+      } else if (type === "playruo_state_update" && data) {
+        console.log("\u{1F537} [Embed] playruo_state_update received:", data);
+        setIframeState(data);
+        if (data.hasPlayedOnce !== void 0) {
+          setHasPlayedOnce(data.hasPlayedOnce);
+        }
+        onStateChange?.(data);
+      } else if (type === "playruo_purchase_request" && data?.storeUrl) {
+        console.log("\u{1F537} [Embed] playruo_purchase_request received:", data);
+        onPurchaseRequest?.(data);
+      } else if (type === "playruo_demo_completed" && data) {
+        console.log("\u{1F537} [Embed] playruo_demo_completed received:", data);
+        setHasPlayedOnce(true);
+        onDemoCompleted?.(data);
+      } else if (type === "playruo_error") {
+        const errorMessage2 = typeof data === "string" ? data : data?.message || "Unknown error";
+        console.log("\u{1F537} [Embed] playruo_error received:", errorMessage2);
+        setErrorMessage(errorMessage2);
+        const errorState = {
+          hasPlayedOnce,
+          tryNow: {
+            available: false,
+            status: `Error: ${errorMessage2}`
+          },
+          buyNow: {
+            available: true,
+            status: "Ready"
+          }
+        };
+        setIframeState(errorState);
+        onStateChange?.(errorState);
+        onError?.(errorMessage2);
+      } else if (type === "playruo_session_over" && data) {
+        console.log("\u{1F537} [Embed] playruo_session_over received:", data);
+        setHasPlayedOnce(true);
+        setIframeState(data);
+        onStateChange?.(data);
+      } else if (type === "playruo_stream_start") {
+        console.log("\u{1F537} [Embed] playruo_stream_start received");
+      }
       if (type === "error" || type === "closeForBuy" || type === "goToStore") {
+        console.log("\u{1F537} [Embed] Legacy message received:", type);
         setHasPlayedOnce(true);
-        onDemoCompleted?.({
+        const payload = {
           reason: "Demo session ended",
           storeUrl
-        });
+        };
+        onDemoCompleted?.(payload);
       }
     };
     window.addEventListener("message", handleGameMessage);
     return () => window.removeEventListener("message", handleGameMessage);
-  }, [storeUrl, onDemoCompleted]);
+  }, [storeUrl, onDemoCompleted, onReady, onStateChange, onPurchaseRequest, onError, iframeRef]);
+  const generateUUID = () => {
+    if (self.crypto.randomUUID) return self.crypto.randomUUID();
+    const bytes = new Uint8Array(16);
+    self.crypto.getRandomValues(bytes);
+    bytes[6] = bytes[6] & 15 | 64;
+    bytes[8] = bytes[8] & 63 | 128;
+    return [...bytes].map(
+      (b, i) => ([4, 6, 8, 10].includes(i) ? "-" : "") + b.toString(16).padStart(2, "0")
+    ).join("");
+  };
+  (0, import_react.useEffect)(() => {
+    const handleUUIDMessage = (event) => {
+      const iframe = iframeRef.current;
+      if (!iframe || event.source !== iframe.contentWindow) {
+        return;
+      }
+      const { type, requestId } = event.data || {};
+      if (type === "playruo_uuid_request") {
+        try {
+          let storedUUID = localStorage.getItem("playruo_uuid");
+          if (!storedUUID) {
+            storedUUID = generateUUID();
+            localStorage.setItem("playruo_uuid", storedUUID);
+          }
+          iframe.contentWindow?.postMessage(
+            {
+              type: "playruo_uuid_response",
+              requestId,
+              uuid: storedUUID
+            },
+            "*"
+          );
+        } catch (e) {
+        }
+      } else if (type === "playruo_uuid_remove") {
+        try {
+          localStorage.removeItem("playruo_uuid");
+        } catch (e) {
+        }
+      }
+    };
+    window.addEventListener("message", handleUUIDMessage);
+    return () => window.removeEventListener("message", handleUUIDMessage);
+  }, [iframeRef]);
   (0, import_react.useEffect)(() => {
     const handleFullscreenChange = () => {
       const doc = document;
@@ -254,10 +297,17 @@ var PlayruoEmbed = ({
           }, 200);
         }
       } else {
-        escapeKeyPressed.current = false;
-        if (escapeKeyTimer.current) {
-          clearTimeout(escapeKeyTimer.current);
-          escapeKeyTimer.current = null;
+        const iframe = iframeRef.current;
+        if (iframe) {
+          try {
+            iframe.contentWindow?.postMessage({
+              type: "playruo",
+              action: "exitFullscreen",
+              fromEmbed: true
+            }, "*");
+          } catch {
+            console.error("[PlayruoEmbed] Failed to exit fullscreen");
+          }
         }
         setShowGameIframe(false);
         setHasPlayedOnce(true);
@@ -278,56 +328,6 @@ var PlayruoEmbed = ({
       document.removeEventListener("MSFullscreenChange", handleFullscreenChange);
     };
   }, [storeUrl, onDemoCompleted, iframeRef]);
-  (0, import_react.useEffect)(() => {
-    const handleKeyDown = (event) => {
-      if (event.key === "Escape" && !escapeKeyPressed.current) {
-        escapeKeyPressed.current = true;
-        event.preventDefault();
-        escapeKeyTimer.current = setTimeout(() => {
-          if (document.fullscreenElement) {
-            document.exitFullscreen();
-          }
-        }, ESCAPE_HOLD_DURATION);
-      }
-      if (event.ctrlKey && event.shiftKey && event.key === "R") {
-        event.preventDefault();
-        if (document.fullscreenElement) {
-          document.exitFullscreen().catch(console.warn);
-        }
-        setTimeout(() => {
-          window.location.reload();
-        }, 500);
-      }
-    };
-    const handleKeyUp = (event) => {
-      if (event.key === "Escape" && escapeKeyPressed.current) {
-        escapeKeyPressed.current = false;
-        if (escapeKeyTimer.current) {
-          clearTimeout(escapeKeyTimer.current);
-          escapeKeyTimer.current = null;
-        }
-      }
-    };
-    document.addEventListener("keydown", handleKeyDown);
-    document.addEventListener("keyup", handleKeyUp);
-    return () => {
-      document.removeEventListener("keydown", handleKeyDown);
-      document.removeEventListener("keyup", handleKeyUp);
-    };
-  }, []);
-  (0, import_react.useEffect)(() => {
-    const isVisible = showGameIframe || showIframe;
-    const iframe = iframeRef.current;
-    if (!iframe || !isIframeLoaded) return;
-    try {
-      iframe.contentWindow?.postMessage({
-        type: "playruo",
-        action: isVisible ? "unmute" : "mute",
-        fromEmbed: true
-      }, "*");
-    } catch {
-    }
-  }, [showGameIframe, showIframe, isIframeLoaded, iframeRef]);
   (0, import_react.useEffect)(() => {
     const logCrossOriginStatus = () => {
       const isIsolated = self.crossOriginIsolated;
@@ -406,22 +406,28 @@ var PlayruoEmbed = ({
       logCrossOriginStatus();
     }
   }, [isReady]);
-  const isAvailable = Boolean(isReady && isCompatible);
+  const isAvailable = Boolean(isReady && isCompatible && hasIframeConfirmed);
   const renderContent = () => {
     if (!renderState) return null;
+    const canTryNow = Boolean(
+      !errorMessage && isReady && isCompatible && hasIframeConfirmed
+    );
     const actions = {
       tryNow: handleTryNow,
       buyNow: handleBuyNow,
-      canTryNow: Boolean(isReady && isCompatible),
+      canTryNow,
       canBuyNow: Boolean(isReady)
     };
     if (errorMessage) {
       return renderState({ status: "error", message: errorMessage, actions });
     }
     if (!isReady) {
-      return renderState({ status: "loading", actions });
+      return renderState({ status: "loading", message: "Loading\u2026", actions });
+    }
+    if (isCompatible && !iframeState) {
+      return renderState({ status: "loading", message: "Checking availability\u2026", actions });
     }
-    const message = !isAvailable ? currentState.tryNow.status : void 0;
+    const message = !isAvailable ? currentState.tryNow.status ?? exposedState.tryNow.status : void 0;
     return renderState({
       status: isAvailable ? "available" : "unavailable",
       message,
@@ -436,7 +442,6 @@ var PlayruoEmbed = ({
         ref: iframeRef,
         src,
         allow: "cross-origin-isolated; fullscreen *; autoplay *; gamepad *; clipboard-write *; web-share *; encrypted-media *; accelerometer *; gyroscope *",
-        allowFullScreen: true,
         className: "w-full h-[70vh] rounded-lg border",
         ...{ credentialless: "true" },
         sandbox: "allow-same-origin allow-scripts allow-popups allow-forms allow-presentation allow-top-navigation allow-modals allow-pointer-lock",
@@ -655,6 +660,10 @@ var EmbedTester = (props = {}) => {
             /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: embedState.hasPlayedOnce ? successStatus : errorStatus, children: embedState.hasPlayedOnce ? "\u2705 Played" : "\u274C Not Played" }),
             /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: embedState.tryNow?.available ? successStatus : errorStatus, children: embedState.tryNow?.available ? "\u2705 Try Now" : "\u274C Try Now" }),
             /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: embedState.buyNow?.available ? successStatus : errorStatus, children: embedState.buyNow?.available ? "\u2705 Buy Now" : "\u274C Buy Now" })
+          ] }),
+          !embedState.tryNow?.available && embedState.tryNow?.status && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { style: { margin: "8px 0 0 0", fontSize: "12px", color: "#a3a3a3" }, children: [
+            "Try Now reason: ",
+            embedState.tryNow.status
           ] })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: cardStyle, children: [
@@ -684,7 +693,8 @@ var EmbedTester = (props = {}) => {
             backgroundColor: "#0a0a0a",
             padding: "12px",
             borderRadius: "4px",
-            height: "200px",
+            minHeight: "200px",
+            height: "min(50vh, 480px)",
             overflowY: "auto",
             fontFamily: "monospace",
             fontSize: "12px",
@@ -829,19 +839,18 @@ var isPlayruoEmbedMessage = (data) => {
   if (!data || typeof data !== "object") return false;
   const msg = data;
   if (typeof msg.type !== "string") return false;
-  return msg.type === "playruo_ready" || msg.type === "playruo_state_update" || msg.type === "playruo_purchase_request" || msg.type === "playruo_demo_completed" || msg.type === "playruo_error";
+  return msg.type === "playruo_ready" || msg.type === "playruo_state_update" || msg.type === "playruo_purchase_request" || msg.type === "playruo_demo_completed" || msg.type === "playruo_error" || msg.type === "playruo_session_over" || msg.type === "playruo_stream_start" || msg.type === "playruo_stream_stop";
 };
-var isPlayruoEmbedCommand = (data) => {
+var isPlayruoInternalMessage = (data) => {
   if (!data || typeof data !== "object") return false;
-  const cmd = data;
-  if (typeof cmd.type !== "string") return false;
-  return cmd.type === "try_now" || cmd.type === "buy_now" || cmd.type === "get_state";
+  const msg = data;
+  return msg.type === "playruo" && typeof msg.action === "string" && (msg.action === "tryNowClick" || msg.action === "exitFullscreen" || msg.action === "mute" || msg.action === "unmute") && msg.fromEmbed === true;
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   EmbedTester,
   PlayruoEmbed,
   buildEmbedUrl,
-  isPlayruoEmbedCommand,
-  isPlayruoEmbedMessage
+  isPlayruoEmbedMessage,
+  isPlayruoInternalMessage
 });

package/dist/index.d.cts

@@ -10,6 +10,7 @@ interface PlayruoEmbedState {
     buyNow: {
         available: boolean;
         status?: string;
+        storeUrl?: string;
     };
 }
 interface DemoCompletedPayload {
@@ -17,15 +18,6 @@ interface DemoCompletedPayload {
     storeUrl?: string;
 }
 
-interface Keyboard {
-    lock: (keys: string[]) => Promise<void>;
-    unlock: () => void;
-}
-declare global {
-    interface Navigator {
-        keyboard?: Keyboard;
-    }
-}
 interface PlayruoEmbedActions {
     /** Start the demo session */
     tryNow: () => void;
@@ -98,25 +90,35 @@ interface PlayruoErrorMessage {
         message: string;
     } | string;
 }
-type PlayruoEmbedMessage = PlayruoReadyMessage | PlayruoStateUpdateMessage | PlayruoPurchaseRequestMessage | PlayruoDemoCompletedMessage | PlayruoErrorMessage;
-interface TryNowCommand {
-    type: "try_now";
+interface PlayruoSessionOverMessage {
+    type: "playruo_session_over";
+    data: PlayruoEmbedState;
+}
+interface PlayruoStreamStartMessage {
+    type: "playruo_stream_start";
 }
-interface BuyNowCommand {
-    type: "buy_now";
+interface PlayruoStreamStopMessage {
+    type: "playruo_stream_stop";
 }
-interface GetStateCommand {
-    type: "get_state";
+type PlayruoEmbedMessage = PlayruoReadyMessage | PlayruoStateUpdateMessage | PlayruoPurchaseRequestMessage | PlayruoDemoCompletedMessage | PlayruoErrorMessage | PlayruoSessionOverMessage | PlayruoStreamStartMessage | PlayruoStreamStopMessage;
+interface PlayruoInternalMessage {
+    type: "playruo";
+    action: "tryNowClick" | "exitFullscreen" | "mute" | "unmute";
+    fromEmbed: true;
+    isReplay?: boolean;
+    parentWillHandleFullscreen?: boolean;
 }
-type PlayruoEmbedCommand = TryNowCommand | BuyNowCommand | GetStateCommand;
 /**
  * Type guard to check if a message event is a Playruo embed message
+ * Messages FROM Embed → Host via postMessage
  */
 declare const isPlayruoEmbedMessage: (data: unknown) => data is PlayruoEmbedMessage;
 /**
- * Type guard to check if a command is a valid Playruo embed command
+ * Type guard to check if a message is a Playruo internal message
+ * Format: { type: 'playruo', action: '...', fromEmbed: true }
+ * These are messages sent TO the iframe (game), not to the parent
  */
-declare const isPlayruoEmbedCommand: (data: unknown) => data is PlayruoEmbedCommand;
+declare const isPlayruoInternalMessage: (data: unknown) => data is PlayruoInternalMessage;
 
 interface BuildUrlParams {
     baseUrl: string;
@@ -131,4 +133,4 @@ interface BuildUrlParams {
  */
 declare const buildEmbedUrl: ({ baseUrl, operation, storeUrl }: BuildUrlParams) => string;
 
-export { type BuyNowCommand, type DemoCompletedPayload, EmbedTester, type EmbedTesterProps, type GetStateCommand, type PlayruoDemoCompletedMessage, PlayruoEmbed, type PlayruoEmbedActions, type PlayruoEmbedCommand, type PlayruoEmbedMessage, type PlayruoEmbedProps, type PlayruoEmbedRenderState, type PlayruoEmbedState, type PlayruoErrorMessage, type PlayruoPurchaseRequestMessage, type PlayruoReadyMessage, type PlayruoStateUpdateMessage, type TryNowCommand, buildEmbedUrl, isPlayruoEmbedCommand, isPlayruoEmbedMessage };
+export { type DemoCompletedPayload, EmbedTester, type EmbedTesterProps, type PlayruoDemoCompletedMessage, PlayruoEmbed, type PlayruoEmbedActions, type PlayruoEmbedMessage, type PlayruoEmbedProps, type PlayruoEmbedRenderState, type PlayruoEmbedState, type PlayruoErrorMessage, type PlayruoInternalMessage, type PlayruoPurchaseRequestMessage, type PlayruoReadyMessage, type PlayruoSessionOverMessage, type PlayruoStateUpdateMessage, type PlayruoStreamStartMessage, buildEmbedUrl, isPlayruoEmbedMessage, isPlayruoInternalMessage };

package/dist/index.d.ts

@@ -10,6 +10,7 @@ interface PlayruoEmbedState {
     buyNow: {
         available: boolean;
         status?: string;
+        storeUrl?: string;
     };
 }
 interface DemoCompletedPayload {
@@ -17,15 +18,6 @@ interface DemoCompletedPayload {
     storeUrl?: string;
 }
 
-interface Keyboard {
-    lock: (keys: string[]) => Promise<void>;
-    unlock: () => void;
-}
-declare global {
-    interface Navigator {
-        keyboard?: Keyboard;
-    }
-}
 interface PlayruoEmbedActions {
     /** Start the demo session */
     tryNow: () => void;
@@ -98,25 +90,35 @@ interface PlayruoErrorMessage {
         message: string;
     } | string;
 }
-type PlayruoEmbedMessage = PlayruoReadyMessage | PlayruoStateUpdateMessage | PlayruoPurchaseRequestMessage | PlayruoDemoCompletedMessage | PlayruoErrorMessage;
-interface TryNowCommand {
-    type: "try_now";
+interface PlayruoSessionOverMessage {
+    type: "playruo_session_over";
+    data: PlayruoEmbedState;
+}
+interface PlayruoStreamStartMessage {
+    type: "playruo_stream_start";
 }
-interface BuyNowCommand {
-    type: "buy_now";
+interface PlayruoStreamStopMessage {
+    type: "playruo_stream_stop";
 }
-interface GetStateCommand {
-    type: "get_state";
+type PlayruoEmbedMessage = PlayruoReadyMessage | PlayruoStateUpdateMessage | PlayruoPurchaseRequestMessage | PlayruoDemoCompletedMessage | PlayruoErrorMessage | PlayruoSessionOverMessage | PlayruoStreamStartMessage | PlayruoStreamStopMessage;
+interface PlayruoInternalMessage {
+    type: "playruo";
+    action: "tryNowClick" | "exitFullscreen" | "mute" | "unmute";
+    fromEmbed: true;
+    isReplay?: boolean;
+    parentWillHandleFullscreen?: boolean;
 }
-type PlayruoEmbedCommand = TryNowCommand | BuyNowCommand | GetStateCommand;
 /**
  * Type guard to check if a message event is a Playruo embed message
+ * Messages FROM Embed → Host via postMessage
  */
 declare const isPlayruoEmbedMessage: (data: unknown) => data is PlayruoEmbedMessage;
 /**
- * Type guard to check if a command is a valid Playruo embed command
+ * Type guard to check if a message is a Playruo internal message
+ * Format: { type: 'playruo', action: '...', fromEmbed: true }
+ * These are messages sent TO the iframe (game), not to the parent
  */
-declare const isPlayruoEmbedCommand: (data: unknown) => data is PlayruoEmbedCommand;
+declare const isPlayruoInternalMessage: (data: unknown) => data is PlayruoInternalMessage;
 
 interface BuildUrlParams {
     baseUrl: string;
@@ -131,4 +133,4 @@ interface BuildUrlParams {
  */
 declare const buildEmbedUrl: ({ baseUrl, operation, storeUrl }: BuildUrlParams) => string;
 
-export { type BuyNowCommand, type DemoCompletedPayload, EmbedTester, type EmbedTesterProps, type GetStateCommand, type PlayruoDemoCompletedMessage, PlayruoEmbed, type PlayruoEmbedActions, type PlayruoEmbedCommand, type PlayruoEmbedMessage, type PlayruoEmbedProps, type PlayruoEmbedRenderState, type PlayruoEmbedState, type PlayruoErrorMessage, type PlayruoPurchaseRequestMessage, type PlayruoReadyMessage, type PlayruoStateUpdateMessage, type TryNowCommand, buildEmbedUrl, isPlayruoEmbedCommand, isPlayruoEmbedMessage };
+export { type DemoCompletedPayload, EmbedTester, type EmbedTesterProps, type PlayruoDemoCompletedMessage, PlayruoEmbed, type PlayruoEmbedActions, type PlayruoEmbedMessage, type PlayruoEmbedProps, type PlayruoEmbedRenderState, type PlayruoEmbedState, type PlayruoErrorMessage, type PlayruoInternalMessage, type PlayruoPurchaseRequestMessage, type PlayruoReadyMessage, type PlayruoSessionOverMessage, type PlayruoStateUpdateMessage, type PlayruoStreamStartMessage, buildEmbedUrl, isPlayruoEmbedMessage, isPlayruoInternalMessage };

package/dist/index.js

@@ -36,9 +36,7 @@ var PlayruoEmbed = ({
   const [isMobile, setIsMobile] = useState(false);
   const [isValidChromium, setIsValidChromium] = useState(true);
   const [errorMessage, setErrorMessage] = useState(null);
-  const escapeKeyTimer = useRef(null);
-  const escapeKeyPressed = useRef(false);
-  const ESCAPE_HOLD_DURATION = 1500;
+  const [iframeState, setIframeState] = useState(null);
   const src = useMemo(() => buildEmbedUrl({ baseUrl, operation, storeUrl }), [baseUrl, operation, storeUrl]);
   useEffect(() => {
     if (typeof window === "undefined") return;
@@ -56,81 +54,34 @@ var PlayruoEmbed = ({
   }, []);
   const isCompatible = !isMobile && isValidChromium;
   const isReady = isCompatible ? isIframeLoaded : true;
-  const currentState = useMemo(() => ({
-    hasPlayedOnce,
-    tryNow: {
-      available: isCompatible,
-      status: !isCompatible ? "Browser not compatible" : hasPlayedOnce ? "Click to replay" : "Ready"
-    },
-    buyNow: {
-      available: true,
-      status: "Ready"
-    }
-  }), [hasPlayedOnce, isCompatible]);
-  const checkKeyboardLockPermission = useCallback(async () => {
-    if (!navigator.permissions) {
-      console.log("[PlayruoEmbed] Permissions API not supported");
-      return false;
+  const currentState = useMemo(() => {
+    if (iframeState) {
+      return iframeState;
     }
-    try {
-      const { state } = await navigator.permissions.query({
-        name: "keyboard-lock"
-      });
-      if (state === "granted" || state === "prompt") {
-        console.log(`[PlayruoEmbed] Keyboard lock permission: ${state}`);
-        return true;
+    return {
+      hasPlayedOnce,
+      tryNow: {
+        available: isCompatible,
+        status: !isCompatible ? "Browser not compatible" : hasPlayedOnce ? "Click to resume" : "Ready"
+      },
+      buyNow: {
+        available: true,
+        status: "Ready"
       }
-      console.log("[PlayruoEmbed] Keyboard lock permission denied");
-      return false;
-    } catch (error) {
-      console.warn("[PlayruoEmbed] Error checking keyboard lock permission:", error);
-      return false;
-    }
-  }, []);
-  const requestFullscreenWithKeyboardLock = useCallback(async () => {
-    const iframe = iframeRef.current;
-    if (!iframe?.requestFullscreen) {
-      console.log("[PlayruoEmbed] Fullscreen not supported on this browser");
-      return false;
-    }
-    try {
-      const fullscreenPromise = iframe.requestFullscreen();
-      if (navigator.keyboard && window.self === window.top) {
-        try {
-          const permissionPromise = checkKeyboardLockPermission();
-          const keyboardLockPromise = navigator.keyboard.lock(["Escape"]);
-          void Promise.all([permissionPromise, keyboardLockPromise]).then(([hasPermission]) => {
-            if (hasPermission) {
-              console.log("[PlayruoEmbed] Keyboard locked successfully");
-            }
-          }).catch((err) => {
-            const isTopLevelContextError = err?.name === "InvalidStateError" && err?.message?.includes("primary top-level browsing context");
-            if (!isTopLevelContextError) {
-              console.warn("[PlayruoEmbed] Keyboard lock failed:", err);
-            }
-          });
-        } catch (err) {
-          const isTopLevelContextError = err?.name === "InvalidStateError" && err?.message?.includes("primary top-level browsing context");
-          if (!isTopLevelContextError) {
-            console.warn("[PlayruoEmbed] Keyboard lock error:", err);
-          }
-        }
-      } else if (!navigator.keyboard) {
-        console.log("[PlayruoEmbed] Keyboard API not supported");
-      } else {
-        console.log("[PlayruoEmbed] Keyboard lock not available (not in top-level context)");
+    };
+  }, [hasPlayedOnce, isCompatible, iframeState]);
+  const hasIframeConfirmed = Boolean(iframeState?.tryNow?.available === true);
+  const exposedState = useMemo(
+    () => ({
+      ...currentState,
+      tryNow: {
+        ...currentState.tryNow,
+        available: hasIframeConfirmed,
+        status: currentState.tryNow.status ?? (hasIframeConfirmed ? "Ready" : isCompatible ? "Checking availability\u2026" : "Browser not compatible")
       }
-      void fullscreenPromise.then(() => {
-        console.log("[PlayruoEmbed] Fullscreen activated successfully");
-      }).catch((err) => {
-        console.warn("[PlayruoEmbed] Fullscreen failed:", err);
-      });
-      return true;
-    } catch (error) {
-      console.error("[PlayruoEmbed] Error requesting fullscreen:", error);
-      return false;
-    }
-  }, [iframeRef, checkKeyboardLockPermission]);
+    }),
+    [currentState, hasIframeConfirmed, isCompatible]
+  );
   const handleTryNow = useCallback(() => {
     if (!isCompatible) {
       console.warn("[PlayruoEmbed] Browser not compatible");
@@ -150,12 +101,10 @@ var PlayruoEmbed = ({
         } catch {
         }
       }
-      requestFullscreenWithKeyboardLock();
       iframe.contentWindow?.postMessage({
         type: "playruo",
         action: "tryNowClick",
         fromEmbed: true,
-        isFullscreen: true,
         isReplay: hasPlayedOnce
       }, "*");
       console.log("[PlayruoEmbed] Sent tryNowClick to game", hasPlayedOnce ? "(replay)" : "(first time)");
@@ -169,7 +118,7 @@ var PlayruoEmbed = ({
       setErrorMessage("Failed to start game");
       onError?.("Failed to start game");
     }
-  }, [isCompatible, hasPlayedOnce, onError, iframeRef, requestFullscreenWithKeyboardLock]);
+  }, [isCompatible, hasPlayedOnce, onError, iframeRef]);
   const handleBuyNow = useCallback(() => {
     if (!storeUrl) {
       console.warn("[PlayruoEmbed] No store URL provided");
@@ -179,9 +128,9 @@ var PlayruoEmbed = ({
   }, [storeUrl, onPurchaseRequest]);
   useEffect(() => {
     if (isReady) {
-      onStateChange?.(currentState);
+      onStateChange?.(exposedState);
     }
-  }, [isReady, currentState, onStateChange]);
+  }, [isReady, exposedState, onStateChange]);
   useEffect(() => {
     if (isReady) {
       onReady?.();
@@ -189,18 +138,112 @@ var PlayruoEmbed = ({
   }, [isReady, onReady]);
   useEffect(() => {
     const handleGameMessage = (event) => {
-      const { type } = event.data || {};
+      const { type, data } = event.data || {};
+      const iframe = iframeRef.current;
+      if (!iframe || event.source !== iframe.contentWindow) {
+        return;
+      }
+      console.log("\u{1F537} [Embed] Message received from iframe:", { type, data });
+      if (type === "playruo_ready") {
+        console.log("\u{1F537} [Embed] playruo_ready received");
+        onReady?.();
+      } else if (type === "playruo_state_update" && data) {
+        console.log("\u{1F537} [Embed] playruo_state_update received:", data);
+        setIframeState(data);
+        if (data.hasPlayedOnce !== void 0) {
+          setHasPlayedOnce(data.hasPlayedOnce);
+        }
+        onStateChange?.(data);
+      } else if (type === "playruo_purchase_request" && data?.storeUrl) {
+        console.log("\u{1F537} [Embed] playruo_purchase_request received:", data);
+        onPurchaseRequest?.(data);
+      } else if (type === "playruo_demo_completed" && data) {
+        console.log("\u{1F537} [Embed] playruo_demo_completed received:", data);
+        setHasPlayedOnce(true);
+        onDemoCompleted?.(data);
+      } else if (type === "playruo_error") {
+        const errorMessage2 = typeof data === "string" ? data : data?.message || "Unknown error";
+        console.log("\u{1F537} [Embed] playruo_error received:", errorMessage2);
+        setErrorMessage(errorMessage2);
+        const errorState = {
+          hasPlayedOnce,
+          tryNow: {
+            available: false,
+            status: `Error: ${errorMessage2}`
+          },
+          buyNow: {
+            available: true,
+            status: "Ready"
+          }
+        };
+        setIframeState(errorState);
+        onStateChange?.(errorState);
+        onError?.(errorMessage2);
+      } else if (type === "playruo_session_over" && data) {
+        console.log("\u{1F537} [Embed] playruo_session_over received:", data);
+        setHasPlayedOnce(true);
+        setIframeState(data);
+        onStateChange?.(data);
+      } else if (type === "playruo_stream_start") {
+        console.log("\u{1F537} [Embed] playruo_stream_start received");
+      }
       if (type === "error" || type === "closeForBuy" || type === "goToStore") {
+        console.log("\u{1F537} [Embed] Legacy message received:", type);
         setHasPlayedOnce(true);
-        onDemoCompleted?.({
+        const payload = {
           reason: "Demo session ended",
           storeUrl
-        });
+        };
+        onDemoCompleted?.(payload);
       }
     };
     window.addEventListener("message", handleGameMessage);
     return () => window.removeEventListener("message", handleGameMessage);
-  }, [storeUrl, onDemoCompleted]);
+  }, [storeUrl, onDemoCompleted, onReady, onStateChange, onPurchaseRequest, onError, iframeRef]);
+  const generateUUID = () => {
+    if (self.crypto.randomUUID) return self.crypto.randomUUID();
+    const bytes = new Uint8Array(16);
+    self.crypto.getRandomValues(bytes);
+    bytes[6] = bytes[6] & 15 | 64;
+    bytes[8] = bytes[8] & 63 | 128;
+    return [...bytes].map(
+      (b, i) => ([4, 6, 8, 10].includes(i) ? "-" : "") + b.toString(16).padStart(2, "0")
+    ).join("");
+  };
+  useEffect(() => {
+    const handleUUIDMessage = (event) => {
+      const iframe = iframeRef.current;
+      if (!iframe || event.source !== iframe.contentWindow) {
+        return;
+      }
+      const { type, requestId } = event.data || {};
+      if (type === "playruo_uuid_request") {
+        try {
+          let storedUUID = localStorage.getItem("playruo_uuid");
+          if (!storedUUID) {
+            storedUUID = generateUUID();
+            localStorage.setItem("playruo_uuid", storedUUID);
+          }
+          iframe.contentWindow?.postMessage(
+            {
+              type: "playruo_uuid_response",
+              requestId,
+              uuid: storedUUID
+            },
+            "*"
+          );
+        } catch (e) {
+        }
+      } else if (type === "playruo_uuid_remove") {
+        try {
+          localStorage.removeItem("playruo_uuid");
+        } catch (e) {
+        }
+      }
+    };
+    window.addEventListener("message", handleUUIDMessage);
+    return () => window.removeEventListener("message", handleUUIDMessage);
+  }, [iframeRef]);
   useEffect(() => {
     const handleFullscreenChange = () => {
       const doc = document;
@@ -214,10 +257,17 @@ var PlayruoEmbed = ({
           }, 200);
         }
       } else {
-        escapeKeyPressed.current = false;
-        if (escapeKeyTimer.current) {
-          clearTimeout(escapeKeyTimer.current);
-          escapeKeyTimer.current = null;
+        const iframe = iframeRef.current;
+        if (iframe) {
+          try {
+            iframe.contentWindow?.postMessage({
+              type: "playruo",
+              action: "exitFullscreen",
+              fromEmbed: true
+            }, "*");
+          } catch {
+            console.error("[PlayruoEmbed] Failed to exit fullscreen");
+          }
         }
         setShowGameIframe(false);
         setHasPlayedOnce(true);
@@ -238,56 +288,6 @@ var PlayruoEmbed = ({
       document.removeEventListener("MSFullscreenChange", handleFullscreenChange);
     };
   }, [storeUrl, onDemoCompleted, iframeRef]);
-  useEffect(() => {
-    const handleKeyDown = (event) => {
-      if (event.key === "Escape" && !escapeKeyPressed.current) {
-        escapeKeyPressed.current = true;
-        event.preventDefault();
-        escapeKeyTimer.current = setTimeout(() => {
-          if (document.fullscreenElement) {
-            document.exitFullscreen();
-          }
-        }, ESCAPE_HOLD_DURATION);
-      }
-      if (event.ctrlKey && event.shiftKey && event.key === "R") {
-        event.preventDefault();
-        if (document.fullscreenElement) {
-          document.exitFullscreen().catch(console.warn);
-        }
-        setTimeout(() => {
-          window.location.reload();
-        }, 500);
-      }
-    };
-    const handleKeyUp = (event) => {
-      if (event.key === "Escape" && escapeKeyPressed.current) {
-        escapeKeyPressed.current = false;
-        if (escapeKeyTimer.current) {
-          clearTimeout(escapeKeyTimer.current);
-          escapeKeyTimer.current = null;
-        }
-      }
-    };
-    document.addEventListener("keydown", handleKeyDown);
-    document.addEventListener("keyup", handleKeyUp);
-    return () => {
-      document.removeEventListener("keydown", handleKeyDown);
-      document.removeEventListener("keyup", handleKeyUp);
-    };
-  }, []);
-  useEffect(() => {
-    const isVisible = showGameIframe || showIframe;
-    const iframe = iframeRef.current;
-    if (!iframe || !isIframeLoaded) return;
-    try {
-      iframe.contentWindow?.postMessage({
-        type: "playruo",
-        action: isVisible ? "unmute" : "mute",
-        fromEmbed: true
-      }, "*");
-    } catch {
-    }
-  }, [showGameIframe, showIframe, isIframeLoaded, iframeRef]);
   useEffect(() => {
     const logCrossOriginStatus = () => {
       const isIsolated = self.crossOriginIsolated;
@@ -366,22 +366,28 @@ var PlayruoEmbed = ({
       logCrossOriginStatus();
     }
   }, [isReady]);
-  const isAvailable = Boolean(isReady && isCompatible);
+  const isAvailable = Boolean(isReady && isCompatible && hasIframeConfirmed);
   const renderContent = () => {
     if (!renderState) return null;
+    const canTryNow = Boolean(
+      !errorMessage && isReady && isCompatible && hasIframeConfirmed
+    );
     const actions = {
       tryNow: handleTryNow,
       buyNow: handleBuyNow,
-      canTryNow: Boolean(isReady && isCompatible),
+      canTryNow,
       canBuyNow: Boolean(isReady)
     };
     if (errorMessage) {
       return renderState({ status: "error", message: errorMessage, actions });
     }
     if (!isReady) {
-      return renderState({ status: "loading", actions });
+      return renderState({ status: "loading", message: "Loading\u2026", actions });
+    }
+    if (isCompatible && !iframeState) {
+      return renderState({ status: "loading", message: "Checking availability\u2026", actions });
     }
-    const message = !isAvailable ? currentState.tryNow.status : void 0;
+    const message = !isAvailable ? currentState.tryNow.status ?? exposedState.tryNow.status : void 0;
     return renderState({
       status: isAvailable ? "available" : "unavailable",
       message,
@@ -396,7 +402,6 @@ var PlayruoEmbed = ({
         ref: iframeRef,
         src,
         allow: "cross-origin-isolated; fullscreen *; autoplay *; gamepad *; clipboard-write *; web-share *; encrypted-media *; accelerometer *; gyroscope *",
-        allowFullScreen: true,
         className: "w-full h-[70vh] rounded-lg border",
         ...{ credentialless: "true" },
         sandbox: "allow-same-origin allow-scripts allow-popups allow-forms allow-presentation allow-top-navigation allow-modals allow-pointer-lock",
@@ -615,6 +620,10 @@ var EmbedTester = (props = {}) => {
             /* @__PURE__ */ jsx2("span", { style: embedState.hasPlayedOnce ? successStatus : errorStatus, children: embedState.hasPlayedOnce ? "\u2705 Played" : "\u274C Not Played" }),
             /* @__PURE__ */ jsx2("span", { style: embedState.tryNow?.available ? successStatus : errorStatus, children: embedState.tryNow?.available ? "\u2705 Try Now" : "\u274C Try Now" }),
             /* @__PURE__ */ jsx2("span", { style: embedState.buyNow?.available ? successStatus : errorStatus, children: embedState.buyNow?.available ? "\u2705 Buy Now" : "\u274C Buy Now" })
+          ] }),
+          !embedState.tryNow?.available && embedState.tryNow?.status && /* @__PURE__ */ jsxs2("p", { style: { margin: "8px 0 0 0", fontSize: "12px", color: "#a3a3a3" }, children: [
+            "Try Now reason: ",
+            embedState.tryNow.status
           ] })
         ] }),
         /* @__PURE__ */ jsxs2("div", { style: cardStyle, children: [
@@ -644,7 +653,8 @@ var EmbedTester = (props = {}) => {
             backgroundColor: "#0a0a0a",
             padding: "12px",
             borderRadius: "4px",
-            height: "200px",
+            minHeight: "200px",
+            height: "min(50vh, 480px)",
             overflowY: "auto",
             fontFamily: "monospace",
             fontSize: "12px",
@@ -789,18 +799,17 @@ var isPlayruoEmbedMessage = (data) => {
   if (!data || typeof data !== "object") return false;
   const msg = data;
   if (typeof msg.type !== "string") return false;
-  return msg.type === "playruo_ready" || msg.type === "playruo_state_update" || msg.type === "playruo_purchase_request" || msg.type === "playruo_demo_completed" || msg.type === "playruo_error";
+  return msg.type === "playruo_ready" || msg.type === "playruo_state_update" || msg.type === "playruo_purchase_request" || msg.type === "playruo_demo_completed" || msg.type === "playruo_error" || msg.type === "playruo_session_over" || msg.type === "playruo_stream_start" || msg.type === "playruo_stream_stop";
 };
-var isPlayruoEmbedCommand = (data) => {
+var isPlayruoInternalMessage = (data) => {
   if (!data || typeof data !== "object") return false;
-  const cmd = data;
-  if (typeof cmd.type !== "string") return false;
-  return cmd.type === "try_now" || cmd.type === "buy_now" || cmd.type === "get_state";
+  const msg = data;
+  return msg.type === "playruo" && typeof msg.action === "string" && (msg.action === "tryNowClick" || msg.action === "exitFullscreen" || msg.action === "mute" || msg.action === "unmute") && msg.fromEmbed === true;
 };
 export {
   EmbedTester,
   PlayruoEmbed,
   buildEmbedUrl,
-  isPlayruoEmbedCommand,
-  isPlayruoEmbedMessage
+  isPlayruoEmbedMessage,
+  isPlayruoInternalMessage
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@playruo/embed",
-  "version": "1.2.2",
+  "version": "1.2.5",
   "description": "React SDK to embed Playruo with postMessage API.",
   "license": "MIT",
   "type": "module",