@kontextso/sdk-react-native 3.1.0-rc.2 → 3.1.0-rc.4

package/dist/index.js

@@ -57,7 +57,7 @@ function handleIframeMessage(handler, opts) {
 // src/formats/Format.tsx
 var import_sdk_react = require("@kontextso/sdk-react");
 var import_react2 = require("react");
-var import_react_native2 = require("react-native");
+var import_react_native3 = require("react-native");
 
 // src/frame-webview.tsx
 var import_react = require("react");
@@ -98,10 +98,43 @@ var FrameWebView = (0, import_react.forwardRef)(
 );
 var frame_webview_default = FrameWebView;
 
+// src/services/SkOverlay.ts
+var import_react_native2 = require("react-native");
+
 // src/NativeRNKontext.ts
 var import_react_native = require("react-native");
 var NativeRNKontext_default = import_react_native.TurboModuleRegistry.getEnforcing("RNKontext");
 
+// src/services/SkOverlay.ts
+var isValidAppStoreId = (id) => {
+  return typeof id === "string" && /^\d+$/.test(id);
+};
+var isValidPosition = (p) => {
+  return p === "bottom" || p === "bottomRaised";
+};
+async function presentSKOverlay(params) {
+  if (import_react_native2.Platform.OS !== "ios") {
+    return false;
+  }
+  let { appStoreId, position, dismissible } = params;
+  if (!isValidAppStoreId(appStoreId)) {
+    return false;
+  }
+  if (!isValidPosition(position)) {
+    position = "bottom";
+  }
+  if (typeof dismissible !== "boolean") {
+    dismissible = Boolean(dismissible);
+  }
+  return NativeRNKontext_default.presentSKOverlay(appStoreId, position, dismissible);
+}
+async function dismissSKOverlay() {
+  if (import_react_native2.Platform.OS !== "ios") {
+    return false;
+  }
+  return NativeRNKontext_default.dismissSKOverlay();
+}
+
 // src/formats/Format.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var sendMessage = (webViewRef, type, code, data) => {
@@ -141,7 +174,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
   const messageStatusRef = (0, import_react2.useRef)("none" /* None */);
   const modalInitTimeoutRef = (0, import_react2.useRef)(null);
   const isModalInitRef = (0, import_react2.useRef)(false);
-  const { height: windowHeight, width: windowWidth } = (0, import_react_native2.useWindowDimensions)();
+  const { height: windowHeight, width: windowWidth } = (0, import_react_native3.useWindowDimensions)();
   const keyboardHeightRef = (0, import_react2.useRef)(0);
   const isAdViewVisible = showIframe && iframeLoaded;
   const reset = () => {
@@ -150,7 +183,6 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
     setContainerStyles({});
     setIframeStyles({});
     setIframeLoaded(false);
-    closeSkOverlay();
     resetModal();
     context?.resetAll();
     context?.captureError(new Error("Processing iframe error"));
@@ -161,6 +193,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
       modalInitTimeoutRef.current = null;
     }
     isModalInitRef.current = false;
+    closeSkOverlay();
     setModalOpen(false);
     setModalLoaded(false);
     setModalShown(false);
@@ -195,22 +228,31 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
   };
   const openSkOverlay = async (appStoreId, position, dismissible) => {
     try {
-      await NativeRNKontext_default.presentSKOverlay(appStoreId, position, dismissible);
+      if (!await presentSKOverlay({ appStoreId, position, dismissible })) {
+        return;
+      }
       sendMessage(webViewRef, "update-skoverlay-iframe", code, {
         open: true
       });
     } catch (e) {
+      debug("error-open-skoverlay-iframe", {
+        error: e
+      });
       console.error("error opening sk overlay", e);
-      reset();
     }
   };
   const closeSkOverlay = async () => {
     try {
-      await NativeRNKontext_default.dismissSKOverlay();
+      if (!await dismissSKOverlay()) {
+        return;
+      }
       sendMessage(webViewRef, "update-skoverlay-iframe", code, {
         open: false
       });
     } catch (e) {
+      debug("error-dismiss-skoverlay-iframe", {
+        error: e
+      });
       console.error("error dismissing sk overlay", e);
     }
   };
@@ -243,7 +285,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
               break;
             case "click-iframe":
               if (message.data.url) {
-                import_react_native2.Linking.openURL(`${context?.adServerUrl}${message.data.url}`).catch(
+                import_react_native3.Linking.openURL(`${context?.adServerUrl}${message.data.url}`).catch(
                   (err) => console.error("error opening url", err)
                 );
               }
@@ -281,7 +323,11 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
               messageStatusRef.current = "message-received" /* MessageReceived */;
               break;
             case "open-skoverlay-iframe":
-              openSkOverlay(message.data.appStoreId, message.data.position, message.data.dismissible);
+              openSkOverlay(
+                message.data.appStoreId,
+                message.data.position,
+                message.data.dismissible
+              );
               break;
             case "close-skoverlay-iframe":
               closeSkOverlay();
@@ -326,9 +372,19 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
               resetModal();
               context?.captureError(new Error("Processing modal iframe error"));
               break;
+            case "open-skoverlay-iframe":
+              openSkOverlay(
+                message.data.appStoreId,
+                message.data.position,
+                message.data.dismissible
+              );
+              break;
+            case "close-skoverlay-iframe":
+              closeSkOverlay();
+              break;
             case "click-iframe":
               if (message.data.url) {
-                import_react_native2.Linking.openURL(`${context?.adServerUrl}${message.data.url}`).catch(
+                import_react_native3.Linking.openURL(`${context?.adServerUrl}${message.data.url}`).catch(
                   (err) => console.error("error opening url", err)
                 );
               }
@@ -412,10 +468,10 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
     return () => clearInterval(interval);
   }, [isAdViewVisible]);
   (0, import_react2.useEffect)(() => {
-    const showSubscription = import_react_native2.Keyboard.addListener("keyboardDidShow", (e) => {
+    const showSubscription = import_react_native3.Keyboard.addListener("keyboardDidShow", (e) => {
       keyboardHeightRef.current = e?.endCoordinates?.height ?? 0;
     });
-    const hideSubscription = import_react_native2.Keyboard.addListener("keyboardDidHide", () => {
+    const hideSubscription = import_react_native3.Keyboard.addListener("keyboardDidHide", () => {
       keyboardHeightRef.current = 0;
     });
     return () => {
@@ -451,7 +507,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
     }
   );
   const interstitialContent = /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    import_react_native2.Modal,
+    import_react_native3.Modal,
     {
       visible: modalOpen,
       transparent: true,
@@ -459,7 +515,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
       animationType: "slide",
       statusBarTranslucent: true,
       children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        import_react_native2.View,
+        import_react_native3.View,
         {
           style: {
             flex: 1,
@@ -494,7 +550,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
   );
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      import_react_native2.View,
+      import_react_native3.View,
       {
         style: isAdViewVisible ? containerStyles : {
           height: 0,
@@ -520,11 +576,11 @@ var InlineAd_default = InlineAd;
 // src/context/AdsProvider.tsx
 var import_sdk_react2 = require("@kontextso/sdk-react");
 var import_netinfo = require("@react-native-community/netinfo");
-var import_react_native3 = require("react-native");
+var import_react_native4 = require("react-native");
 var import_react_native_device_info = __toESM(require("react-native-device-info"));
 
 // package.json
-var version = "3.1.0-rc.2";
+var version = "3.1.0-rc.4";
 
 // src/context/AdsProvider.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
@@ -540,7 +596,7 @@ var getDevice = async () => {
     const powerState = await import_react_native_device_info.default.getPowerState();
     const deviceType = import_react_native_device_info.default.getDeviceType();
     const soundOn = await NativeRNKontext_default.isSoundOn();
-    const screen = import_react_native3.Dimensions.get("screen");
+    const screen = import_react_native4.Dimensions.get("screen");
     const networkInfo = await (0, import_netinfo.fetch)();
     const mapDeviceTypeToHardwareType = () => {
       switch (deviceType) {
@@ -577,14 +633,14 @@ var getDevice = async () => {
         detail: networkInfo.type === import_netinfo.NetInfoStateType.cellular && networkInfo.details.cellularGeneration || void 0
       },
       os: {
-        name: import_react_native3.Platform.OS,
+        name: import_react_native4.Platform.OS,
         version: import_react_native_device_info.default.getSystemVersion(),
         locale: Intl.DateTimeFormat().resolvedOptions().locale,
         timezone: Intl.DateTimeFormat().resolvedOptions().timeZone
       },
       screen: {
-        darkMode: import_react_native3.Appearance.getColorScheme() === "dark",
-        dpr: import_react_native3.PixelRatio.get(),
+        darkMode: import_react_native4.Appearance.getColorScheme() === "dark",
+        dpr: import_react_native4.PixelRatio.get(),
         height: screen.height,
         width: screen.width,
         orientation: screen.width > screen.height ? "landscape" : "portrait"
@@ -617,7 +673,7 @@ var getApp = async () => {
 };
 var getSdk = async () => ({
   name: "sdk-react-native",
-  platform: import_react_native3.Platform.OS === "ios" ? "ios" : "android",
+  platform: import_react_native4.Platform.OS === "ios" ? "ios" : "android",
   version
 });
 var AdsProvider = (props) => {

package/dist/index.mjs

@@ -67,10 +67,43 @@ var FrameWebView = forwardRef(
 );
 var frame_webview_default = FrameWebView;
 
+// src/services/SkOverlay.ts
+import { Platform } from "react-native";
+
 // src/NativeRNKontext.ts
 import { TurboModuleRegistry } from "react-native";
 var NativeRNKontext_default = TurboModuleRegistry.getEnforcing("RNKontext");
 
+// src/services/SkOverlay.ts
+var isValidAppStoreId = (id) => {
+  return typeof id === "string" && /^\d+$/.test(id);
+};
+var isValidPosition = (p) => {
+  return p === "bottom" || p === "bottomRaised";
+};
+async function presentSKOverlay(params) {
+  if (Platform.OS !== "ios") {
+    return false;
+  }
+  let { appStoreId, position, dismissible } = params;
+  if (!isValidAppStoreId(appStoreId)) {
+    return false;
+  }
+  if (!isValidPosition(position)) {
+    position = "bottom";
+  }
+  if (typeof dismissible !== "boolean") {
+    dismissible = Boolean(dismissible);
+  }
+  return NativeRNKontext_default.presentSKOverlay(appStoreId, position, dismissible);
+}
+async function dismissSKOverlay() {
+  if (Platform.OS !== "ios") {
+    return false;
+  }
+  return NativeRNKontext_default.dismissSKOverlay();
+}
+
 // src/formats/Format.tsx
 import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
 var sendMessage = (webViewRef, type, code, data) => {
@@ -119,7 +152,6 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
     setContainerStyles({});
     setIframeStyles({});
     setIframeLoaded(false);
-    closeSkOverlay();
     resetModal();
     context?.resetAll();
     context?.captureError(new Error("Processing iframe error"));
@@ -130,6 +162,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
       modalInitTimeoutRef.current = null;
     }
     isModalInitRef.current = false;
+    closeSkOverlay();
     setModalOpen(false);
     setModalLoaded(false);
     setModalShown(false);
@@ -164,22 +197,31 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
   };
   const openSkOverlay = async (appStoreId, position, dismissible) => {
     try {
-      await NativeRNKontext_default.presentSKOverlay(appStoreId, position, dismissible);
+      if (!await presentSKOverlay({ appStoreId, position, dismissible })) {
+        return;
+      }
       sendMessage(webViewRef, "update-skoverlay-iframe", code, {
         open: true
       });
     } catch (e) {
+      debug("error-open-skoverlay-iframe", {
+        error: e
+      });
       console.error("error opening sk overlay", e);
-      reset();
     }
   };
   const closeSkOverlay = async () => {
     try {
-      await NativeRNKontext_default.dismissSKOverlay();
+      if (!await dismissSKOverlay()) {
+        return;
+      }
       sendMessage(webViewRef, "update-skoverlay-iframe", code, {
         open: false
       });
     } catch (e) {
+      debug("error-dismiss-skoverlay-iframe", {
+        error: e
+      });
       console.error("error dismissing sk overlay", e);
     }
   };
@@ -250,7 +292,11 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
               messageStatusRef.current = "message-received" /* MessageReceived */;
               break;
             case "open-skoverlay-iframe":
-              openSkOverlay(message.data.appStoreId, message.data.position, message.data.dismissible);
+              openSkOverlay(
+                message.data.appStoreId,
+                message.data.position,
+                message.data.dismissible
+              );
               break;
             case "close-skoverlay-iframe":
               closeSkOverlay();
@@ -295,6 +341,16 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
               resetModal();
               context?.captureError(new Error("Processing modal iframe error"));
               break;
+            case "open-skoverlay-iframe":
+              openSkOverlay(
+                message.data.appStoreId,
+                message.data.position,
+                message.data.dismissible
+              );
+              break;
+            case "close-skoverlay-iframe":
+              closeSkOverlay();
+              break;
             case "click-iframe":
               if (message.data.url) {
                 Linking.openURL(`${context?.adServerUrl}${message.data.url}`).catch(
@@ -492,11 +548,11 @@ import {
   log
 } from "@kontextso/sdk-react";
 import { fetch as fetchNetworkInfo, NetInfoStateType } from "@react-native-community/netinfo";
-import { Appearance, Dimensions, PixelRatio, Platform } from "react-native";
+import { Appearance, Dimensions, PixelRatio, Platform as Platform2 } from "react-native";
 import DeviceInfo from "react-native-device-info";
 
 // package.json
-var version = "3.1.0-rc.2";
+var version = "3.1.0-rc.4";
 
 // src/context/AdsProvider.tsx
 import { jsx as jsx4 } from "react/jsx-runtime";
@@ -549,7 +605,7 @@ var getDevice = async () => {
         detail: networkInfo.type === NetInfoStateType.cellular && networkInfo.details.cellularGeneration || void 0
       },
       os: {
-        name: Platform.OS,
+        name: Platform2.OS,
         version: DeviceInfo.getSystemVersion(),
         locale: Intl.DateTimeFormat().resolvedOptions().locale,
         timezone: Intl.DateTimeFormat().resolvedOptions().timeZone
@@ -589,7 +645,7 @@ var getApp = async () => {
 };
 var getSdk = async () => ({
   name: "sdk-react-native",
-  platform: Platform.OS === "ios" ? "ios" : "android",
+  platform: Platform2.OS === "ios" ? "ios" : "android",
   version
 });
 var AdsProvider = (props) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kontextso/sdk-react-native",
-  "version": "3.1.0-rc.2",
+  "version": "3.1.0-rc.4",
   "description": "Kontext SDK for React Native",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -20,7 +20,7 @@
     "format": "biome format --write ."
   },
   "devDependencies": {
-    "@kontextso/sdk-common": "^1.0.2",
+    "@kontextso/sdk-common": "^1.0.3",
     "@kontextso/typescript-config": "*",
     "@react-native-community/netinfo": "11.3.1",
     "@testing-library/dom": "^10.4.0",

package/src/NativeRNKontext.ts

@@ -7,4 +7,4 @@ export interface Spec extends TurboModule {
   dismissSKOverlay(): Promise<boolean>
 }
 
-export default TurboModuleRegistry.getEnforcing<Spec>("RNKontext");
+export default TurboModuleRegistry.getEnforcing<Spec>('RNKontext')

package/src/__tests__/util.test.ts

@@ -6,4 +6,4 @@ describe('utils', () => {
       expect(1).toBe(1)
     })
   })
-})
+})

package/src/formats/Format.tsx

@@ -18,7 +18,7 @@ import { useContext, useEffect, useRef, useState } from 'react'
 import { Keyboard, Linking, Modal, useWindowDimensions, View } from 'react-native'
 import type { WebView, WebViewMessageEvent } from 'react-native-webview'
 import FrameWebView from '../frame-webview'
-import NativeRNKontext from '../NativeRNKontext'
+import { presentSKOverlay, dismissSKOverlay, type SKOverlayPosition } from '../services/SkOverlay'
 
 const sendMessage = (
   webViewRef: React.RefObject<WebView>,
@@ -91,7 +91,6 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
     setContainerStyles({})
     setIframeStyles({})
     setIframeLoaded(false)
-    closeSkOverlay()
     resetModal()
     context?.resetAll()
     context?.captureError(new Error('Processing iframe error'))
@@ -104,6 +103,7 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
     }
 
     isModalInitRef.current = false
+    closeSkOverlay()
     setModalOpen(false)
     setModalLoaded(false)
     setModalShown(false)
@@ -139,25 +139,34 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
     })
   }
 
-  const openSkOverlay = async (appStoreId: string, position: string, dismissible: boolean) => {
+  const openSkOverlay = async (appStoreId: string, position: SKOverlayPosition, dismissible: boolean) => {
     try {
-      await NativeRNKontext.presentSKOverlay(appStoreId, position, dismissible)
+      if (!(await presentSKOverlay({ appStoreId, position, dismissible }))) {
+        return
+      }
       sendMessage(webViewRef, 'update-skoverlay-iframe', code, {
-        open: true
+        open: true,
       })
     } catch (e) {
+      debug('error-open-skoverlay-iframe', {
+        error: e,
+      })
       console.error('error opening sk overlay', e)
-      reset()
     }
   }
 
   const closeSkOverlay = async () => {
     try {
-      await NativeRNKontext.dismissSKOverlay()
+      if (!(await dismissSKOverlay())) {
+        return
+      }
       sendMessage(webViewRef, 'update-skoverlay-iframe', code, {
-        open: false
+        open: false,
       })
     } catch (e) {
+      debug('error-dismiss-skoverlay-iframe', {
+        error: e,
+      })
       console.error('error dismissing sk overlay', e)
     }
   }
@@ -244,7 +253,11 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
               break
 
             case 'open-skoverlay-iframe':
-              openSkOverlay(message.data.appStoreId, message.data.position, message.data.dismissible)
+              openSkOverlay(
+                message.data.appStoreId,
+                message.data.position as SKOverlayPosition,
+                message.data.dismissible
+              )
               break
 
             case 'close-skoverlay-iframe':
@@ -299,6 +312,18 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
               context?.captureError(new Error('Processing modal iframe error'))
               break
 
+            case 'open-skoverlay-iframe':
+              openSkOverlay(
+                message.data.appStoreId,
+                message.data.position as SKOverlayPosition,
+                message.data.dismissible
+              )
+              break
+
+            case 'close-skoverlay-iframe':
+              closeSkOverlay()
+              break
+
             case 'click-iframe':
               if (message.data.url) {
                 Linking.openURL(`${context?.adServerUrl}${message.data.url}`).catch((err) =>
@@ -330,12 +355,12 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
   }
 
   /*
-  * Fix for Android issue in Saylo.
-  * When the iframe is loaded, the onLoad event is sometimes called two or more times. 
-  * When these events fire too quickly, the init-iframe response from the server gets discarded. 
-  * As a result, our SDK doesn’t send the update-iframe event back to the server, and the stream never starts.
-  * This fix will send the update-iframe event even if the init-iframe isn’t received. 
-  */
+   * Fix for Android issue in Saylo.
+   * When the iframe is loaded, the onLoad event is sometimes called two or more times.
+   * When these events fire too quickly, the init-iframe response from the server gets discarded.
+   * As a result, our SDK doesn’t send the update-iframe event back to the server, and the stream never starts.
+   * This fix will send the update-iframe event even if the init-iframe isn’t received.
+   */
   useEffect(() => {
     const interval = setInterval(() => {
       if (messageStatusRef.current === MessageStatus.None) {

package/src/services/SkOverlay.ts

@@ -1,20 +1,20 @@
 import { Platform } from 'react-native'
-import NativeRNKontext from '../NativeRNKontext';
+import NativeRNKontext from '../NativeRNKontext'
 
-export type SKOverlayPosition = 'bottom' | 'bottomRaised';
+export type SKOverlayPosition = 'bottom' | 'bottomRaised'
 
 const isValidAppStoreId = (id: unknown): id is string => {
-  return typeof id === "string" && /^\d+$/.test(id);
+  return typeof id === 'string' && /^\d+$/.test(id)
 }
 
 const isValidPosition = (p: unknown): p is SKOverlayPosition => {
-  return p === "bottom" || p === "bottomRaised";
+  return p === 'bottom' || p === 'bottomRaised'
 }
 
 export async function presentSKOverlay(params: {
-  appStoreId: string;
-  position: SKOverlayPosition;
-  dismissible: boolean;
+  appStoreId: string
+  position: SKOverlayPosition
+  dismissible: boolean
 }) {
   if (Platform.OS !== 'ios') {
     return false
@@ -39,4 +39,4 @@ export async function dismissSKOverlay() {
     return false
   }
   return NativeRNKontext.dismissSKOverlay()
-}
+}