@kontextso/sdk-react-native 2.1.1-rc.0 → 2.1.1-rc.1

package/dist/index.mjs

@@ -7,7 +7,8 @@ import {
   useBid,
   useIframeUrl
 } from "@kontextso/sdk-react";
-import { Linking, Modal, View, useWindowDimensions } from "react-native";
+import { WebView } from "react-native-webview";
+import { Linking, View, useWindowDimensions } from "react-native";
 
 // ../sdk-common/dist/index.mjs
 function makeIframeMessage(type, opts) {
@@ -27,44 +28,8 @@ function handleIframeMessage(handler, opts) {
   };
 }
 
-// src/frame-webview.tsx
-import { forwardRef } from "react";
-import { WebView } from "react-native-webview";
-import { jsx } from "react/jsx-runtime";
-var FrameWebView = forwardRef(
-  ({ iframeUrl, onMessage, style, onError, onLoad }, forwardedRef) => {
-    return /* @__PURE__ */ jsx(
-      WebView,
-      {
-        ref: forwardedRef,
-        source: {
-          uri: iframeUrl
-        },
-        onMessage,
-        style,
-        allowsInlineMediaPlayback: true,
-        mediaPlaybackRequiresUserAction: false,
-        javaScriptEnabled: true,
-        domStorageEnabled: true,
-        allowsFullscreenVideo: false,
-        injectedJavaScript: `
-          window.addEventListener("message", function(event) {
-            if (window.ReactNativeWebView && event.data) {
-              // ReactNativeWebView.postMessage only supports string data
-              window.ReactNativeWebView.postMessage(JSON.stringify(event.data));
-            }
-          }, false);
-      `,
-        onError,
-        onLoad
-      }
-    );
-  }
-);
-var frame_webview_default = FrameWebView;
-
 // src/formats/Format.tsx
-import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 var sendMessage = (webViewRef, type, code, data) => {
   const message = makeIframeMessage(type, {
     data,
@@ -80,19 +45,13 @@ var Format = ({ code, messageId, wrapper, ...otherParams }) => {
   const context = useContext(AdsContext);
   const bid = useBid({ code, messageId });
   const [height, setHeight] = useState(0);
-  const iframeUrl = useIframeUrl(context, bid, code, messageId, "sdk-react-native", otherParams.theme);
-  const modalUrl = iframeUrl.replace("/api/frame/", "/api/modal/");
+  const iframeUrl = useIframeUrl(context, bid, code, messageId);
   const [showIframe, setShowIframe] = useState(false);
   const [iframeLoaded, setIframeLoaded] = useState(false);
-  const [modalOpen, setModalOpen] = useState(false);
-  const [modalShown, setModalShown] = useState(false);
-  const [modalLoaded, setModalLoaded] = useState(false);
   const [containerStyles, setContainerStyles] = useState({});
   const [iframeStyles, setIframeStyles] = useState({});
   const containerRef = useRef(null);
   const webViewRef = useRef(null);
-  const modalWebViewRef = useRef(null);
-  const modalInitTimeoutRef = useRef(null);
   const { height: windowHeight, width: windowWidth } = useWindowDimensions();
   const reset = () => {
     setHeight(0);
@@ -100,19 +59,9 @@ var Format = ({ code, messageId, wrapper, ...otherParams }) => {
     setContainerStyles({});
     setIframeStyles({});
     setIframeLoaded(false);
-    resetModal();
     context?.resetAll();
     context?.captureError(new Error("Processing iframe error"));
   };
-  const resetModal = () => {
-    if (modalInitTimeoutRef.current) {
-      clearTimeout(modalInitTimeoutRef.current);
-      modalInitTimeoutRef.current = null;
-    }
-    setModalOpen(false);
-    setModalLoaded(false);
-    setModalShown(false);
-  };
   const debug = (name, data = {}) => {
     context?.onDebugEventInternal?.(name, {
       code,
@@ -128,19 +77,6 @@ var Format = ({ code, messageId, wrapper, ...otherParams }) => {
       ...data
     });
   };
-  const debugModal = (name, data = {}) => {
-    context?.onDebugEventInternal?.(name, {
-      code,
-      messageId,
-      otherParams,
-      bid,
-      modalUrl,
-      modalOpen,
-      modalShown,
-      modalLoaded,
-      ...data
-    });
-  };
   debug("format-update-state");
   const onMessage = (event) => {
     try {
@@ -188,10 +124,6 @@ var Format = ({ code, messageId, wrapper, ...otherParams }) => {
               setContainerStyles(message.data.containerStyles);
               setIframeStyles(message.data.iframeStyles);
               break;
-            case "open-component-iframe":
-              setModalOpen(true);
-              modalInitTimeoutRef.current = setTimeout(resetModal, message.data.timeout ?? 5e3);
-              break;
           }
         },
         {
@@ -207,53 +139,6 @@ var Format = ({ code, messageId, wrapper, ...otherParams }) => {
       reset();
     }
   };
-  const onModalMessage = (event) => {
-    try {
-      const data = JSON.parse(event.nativeEvent.data);
-      debugModal("modal-iframe-message", {
-        message: data
-      });
-      const messageHandler = handleIframeMessage(
-        (message) => {
-          switch (message.type) {
-            case "close-component-iframe":
-              resetModal();
-              break;
-            case "init-component-iframe":
-              if (modalInitTimeoutRef.current) {
-                clearTimeout(modalInitTimeoutRef.current);
-                modalInitTimeoutRef.current = null;
-              }
-              setModalShown(true);
-              break;
-            case "error-component-iframe":
-            case "error-iframe":
-              resetModal();
-              break;
-            case "click-iframe":
-              if (message.data.url) {
-                Linking.openURL(`${context?.adServerUrl}${message.data.url}`).catch(
-                  (err) => console.error("error opening url", err)
-                );
-              }
-              context?.onAdClickInternal(message.data);
-              break;
-          }
-        },
-        {
-          code,
-          component: "modal"
-        }
-      );
-      messageHandler({ data });
-    } catch (e) {
-      debugModal("modal-iframe-message-error", {
-        error: e
-      });
-      console.error("error parsing message from webview", e);
-      resetModal();
-    }
-  };
   const paramsString = convertParamsToString(otherParams);
   useEffect(() => {
     if (!iframeLoaded || !context?.adServerUrl || !bid || !webViewRef.current) {
@@ -299,71 +184,57 @@ var Format = ({ code, messageId, wrapper, ...otherParams }) => {
     }
     return 0;
   };
-  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx2(Modal, { visible: modalOpen, transparent: true, onRequestClose: resetModal, children: /* @__PURE__ */ jsx2(
-      View,
-      {
-        style: {
-          flex: 1,
-          // Don't show the modal until the modal page is loaded and sends 'init-component-iframe' message back to SDK
-          ...modalShown ? { opacity: 1, pointerEvents: "auto" } : { opacity: 0, pointerEvents: "none" }
-        },
-        children: /* @__PURE__ */ jsx2(
-          frame_webview_default,
-          {
-            ref: modalWebViewRef,
-            iframeUrl: modalUrl,
-            onMessage: onModalMessage,
-            style: {
-              backgroundColor: "transparent",
-              height: "100%",
-              width: "100%",
-              borderWidth: 0
-            },
-            onError: () => {
-              debug("modal-error");
-              resetModal();
-            },
-            onLoad: () => {
-              debug("modal-load");
-              setModalLoaded(true);
-            }
+  const content = /* @__PURE__ */ jsx(View, { style: containerStyles, ref: containerRef, children: /* @__PURE__ */ jsx(
+    WebView,
+    {
+      ref: webViewRef,
+      source: {
+        uri: iframeUrl
+      },
+      onMessage,
+      style: {
+        height: getHeight(),
+        width: getWidth(),
+        ...iframeStyles
+      },
+      allowsInlineMediaPlayback: true,
+      mediaPlaybackRequiresUserAction: false,
+      javaScriptEnabled: true,
+      domStorageEnabled: true,
+      allowsFullscreenVideo: false,
+      injectedJavaScript: `
+          function sendToLog(data) {
+            window.ReactNativeWebView.postMessage(JSON.stringify({
+              type: 'log-iframe',
+              data: data
+            }));
           }
-        )
-      }
-    ) }),
-    /* @__PURE__ */ jsx2(View, { style: containerStyles, ref: containerRef, children: /* @__PURE__ */ jsx2(
-      frame_webview_default,
-      {
-        ref: webViewRef,
-        iframeUrl,
-        onMessage,
-        style: {
-          height: getHeight(),
-          width: getWidth(),
-          background: "transparent",
-          borderWidth: 0,
-          ...iframeStyles
-        },
-        onError: () => {
-          debug("iframe-error");
-          reset();
-        },
-        onLoad: () => {
-          debug("iframe-load");
-        }
+
+          window.addEventListener("message", function(event) {
+            if (window.ReactNativeWebView && event.data) {
+              // ReactNativeWebView.postMessage only supports string data
+              window.ReactNativeWebView.postMessage(JSON.stringify(event.data));
+            }
+          }, false);
+      `,
+      onError: () => {
+        debug("iframe-error");
+        reset();
+      },
+      onLoad: () => {
+        debug("iframe-load");
       }
-    ) })
-  ] });
+    }
+  ) });
   return wrapper ? wrapper(content) : content;
 };
-var FormatWithErrorBoundary = (props) => /* @__PURE__ */ jsx2(ErrorBoundary, { children: /* @__PURE__ */ jsx2(Format, { ...props }) });
+var FormatWithErrorBoundary = (props) => /* @__PURE__ */ jsx(ErrorBoundary, { children: /* @__PURE__ */ jsx(Format, { ...props }) });
 var Format_default = FormatWithErrorBoundary;
 
 // src/formats/InlineAd.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var InlineAd = ({ code, messageId, wrapper, ...props }) => {
-  return /* @__PURE__ */ jsx3(Format_default, { code, messageId, wrapper, ...props });
+  return /* @__PURE__ */ jsx2(Format_default, { code, messageId, wrapper, ...props });
 };
 var InlineAd_default = InlineAd;
 
@@ -371,8 +242,13 @@ var InlineAd_default = InlineAd;
 import { AdsProviderInternal, log } from "@kontextso/sdk-react";
 import { Platform } from "react-native";
 import DeviceInfo from "react-native-device-info";
-import { isSoundOn } from "@kontextso/soundon";
-import { jsx as jsx4 } from "react/jsx-runtime";
+
+// src/NativeRNKontext.ts
+import { TurboModuleRegistry } from "react-native";
+var NativeRNKontext_default = TurboModuleRegistry.getEnforcing("RNKontext");
+
+// src/context/AdsProvider.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
 ErrorUtils.setGlobalHandler((error, isFatal) => {
   if (!isFatal) {
     log.warn(error);
@@ -392,7 +268,7 @@ var getDevice = async () => {
     const appVersion = DeviceInfo.getVersion();
     let soundOn = false;
     try {
-      soundOn = await isSoundOn();
+      soundOn = await NativeRNKontext_default.isSoundOn();
     } catch (error) {
       log.warn("Failed to read output volume", error);
     }
@@ -416,7 +292,7 @@ var getDevice = async () => {
   return {};
 };
 var AdsProvider = (props) => {
-  return /* @__PURE__ */ jsx4(AdsProviderInternal, { ...props, getDevice });
+  return /* @__PURE__ */ jsx3(AdsProviderInternal, { ...props, getDevice });
 };
 export {
   AdsProvider,

package/ios/KontextSDK.swift

@@ -0,0 +1,26 @@
+import AVFoundation
+
+@objc(KontextSDK)
+public class KontextSDK: NSObject {
+    private static let MINIMAL_VOLUME_THRESHOLD: Float = 0.0
+
+    @objc
+    public static func isSoundOn() -> NSNumber? {
+        let session = AVAudioSession.sharedInstance()
+
+        do {
+            try session.setCategory(
+                .ambient,
+                mode: .default,
+                options: [.mixWithOthers]
+            )
+            try session.setActive(true)
+
+            return NSNumber(
+                value: session.outputVolume > MINIMAL_VOLUME_THRESHOLD
+            )
+        } catch {
+            return nil
+        }
+    }
+}

package/ios/RNKontext.h

@@ -0,0 +1,13 @@
+#import "RNKontext-Swift.h"
+
+#ifdef RCT_NEW_ARCH_ENABLED
+#import <RNKontextSpec/RNKontextSpec.h>
+
+@interface RNKontext: NSObject <NativeRNKontextSpec>
+#else
+#import <React/RCTBridgeModule.h>
+
+@interface RNKontext: NSObject <RCTBridgeModule>
+#endif
+
+@end

package/ios/RNKontext.mm

@@ -0,0 +1,36 @@
+#import "RNKontext.h"
+
+@implementation RNKontext
+
+RCT_EXPORT_MODULE()
+
+#ifdef RCT_NEW_ARCH_ENABLED
+- (void)isSoundOn:(RCTPromiseResolveBlock)resolve
+           reject:(RCTPromiseRejectBlock)reject {
+    NSNumber *isSoundOn = [KontextSDK isSoundOn];
+
+    if (isSoundOn == nil) {
+        reject(@"soundon_error", @"Failed to read output volume", nil);
+    } else {
+        resolve(isSoundOn);
+    }
+}
+
+- (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:
+    (const facebook::react::ObjCTurboModule::InitParams &)params {
+    return std::make_shared<facebook::react::NativeRNKontextSpecJSI>(params);
+}
+#else
+RCT_EXPORT_METHOD(isSoundOn : (RCTPromiseResolveBlock)
+                      resolve rejecter : (RCTPromiseRejectBlock)reject) {
+    NSNumber *isSoundOn = [KontextSDK isSoundOn];
+
+    if (isSoundOn == nil) {
+        reject(@"soundon_error", @"Failed to read output volume", nil);
+    } else {
+        resolve(isSoundOn);
+    }
+}
+#endif
+
+@end

package/package.json

@@ -1,11 +1,14 @@
 {
   "name": "@kontextso/sdk-react-native",
-  "version": "2.1.1-rc.0",
+  "version": "2.1.1-rc.1",
+  "description": "Kontext SDK for React Native",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "type": "commonjs",
   "license": "Apache-2.0",
+  "author": "Kontext",
+  "homepage": "https://github.com/kontextso",
   "scripts": {
     "dev:js": "tsup --watch",
     "dev": "npm-run-all dev:js",
@@ -52,11 +55,29 @@
     "react-native-webview": "^13.15.0"
   },
   "dependencies": {
-    "@kontextso/sdk-react": "^1.2.4",
-    "@kontextso/soundon": "^1.0.0"
+    "@kontextso/sdk-react": "^1.2.3"
   },
   "files": [
     "dist/*",
-    "LICENSE"
-  ]
+    "src",
+    "android",
+    "ios",
+    "*.podspec",
+    "LICENSE",
+    "!ios/build",
+    "!android/build",
+    "!android/gradle",
+    "!android/gradlew",
+    "!android/gradlew.bat",
+    "!android/local.properties",
+    "!**/.*"
+  ],
+  "codegenConfig": {
+    "name": "RNKontextSpec",
+    "type": "modules",
+    "jsSrcsDir": "src",
+    "android": {
+      "javaPackageName": "so.kontext.react"
+    }
+  }
 }

package/src/NativeRNKontext.ts

@@ -0,0 +1,8 @@
+import type { TurboModule } from 'react-native'
+import { TurboModuleRegistry } from 'react-native'
+
+export interface Spec extends TurboModule {
+  isSoundOn(): Promise<boolean>
+}
+
+export default TurboModuleRegistry.getEnforcing<Spec>('RNKontext')

package/src/context/AdsProvider.tsx

@@ -0,0 +1,60 @@
+'use client'
+
+import type { AdsProviderProps, Device } from '@kontextso/sdk-react'
+import { AdsProviderInternal, log } from '@kontextso/sdk-react'
+import { Platform } from 'react-native'
+import DeviceInfo from 'react-native-device-info'
+import KontextSDK from '../NativeRNKontext'
+
+ErrorUtils.setGlobalHandler((error, isFatal) => {
+  if (!isFatal) {
+    log.warn(error)
+  } else {
+    log.error(error)
+  }
+})
+
+const getDevice = async (): Promise<Device> => {
+  try {
+    const os = Platform.OS
+    const systemVersion = DeviceInfo.getSystemVersion()
+    const model = DeviceInfo.getModel()
+    const brand = DeviceInfo.getBrand()
+    const deviceId = DeviceInfo.getDeviceId()
+    const deviceType = DeviceInfo.getDeviceType()
+    const appBundleId = DeviceInfo.getBundleId()
+    const appVersion = DeviceInfo.getVersion()
+
+    let soundOn = false
+    try {
+      soundOn = await KontextSDK.isSoundOn()
+    } catch (error) {
+      log.warn('Failed to read output volume', error)
+    }
+
+    console.log('soundOn', soundOn)
+
+    const rnv = Platform.constants.reactNativeVersion
+    const reactNativeVersion = `${rnv.major}.${rnv.minor}.${rnv.patch}`
+
+    return {
+      os,
+      systemVersion,
+      reactNativeVersion,
+      model,
+      brand,
+      deviceId,
+      deviceType,
+      appBundleId,
+      appVersion,
+      soundOn,
+    }
+  } catch (error) {
+    console.error(error)
+  }
+  return {}
+}
+
+export const AdsProvider = (props: AdsProviderProps) => {
+  return <AdsProviderInternal {...props} getDevice={getDevice} />
+}