@apps-in-toss/framework 1.2.0 → 1.2.1

package/dist/index.cjs

@@ -34,11 +34,14 @@ __export(src_exports, {
   Analytics: () => Analytics2,
   AppsInToss: () => AppsInToss,
   INTERNAL__onVisibilityChangedByTransparentServiceWeb: () => INTERNAL__onVisibilityChangedByTransparentServiceWeb,
+  OverlayProvider: () => import_private9.OverlayProvider,
   WebView: () => WebView,
   env: () => env,
   useCreateUserAgent: () => useCreateUserAgent,
   useGeolocation: () => useGeolocation,
-  useTopNavigation: () => import_private9.useTopNavigation
+  useOverlay: () => import_private9.useOverlay,
+  useTopNavigation: () => import_private9.useTopNavigation,
+  useWaitForReturnNavigator: () => useWaitForReturnNavigator
 });
 module.exports = __toCommonJS(src_exports);
 var import_analytics2 = require("@apps-in-toss/analytics");
@@ -877,15 +880,15 @@ var AppsInToss = {
 };
 
 // src/components/WebView.tsx
-var import_native_modules18 = require("@apps-in-toss/native-modules");
+var import_native_modules17 = require("@apps-in-toss/native-modules");
 var appsInTossAsyncBridges = __toESM(require("@apps-in-toss/native-modules/async-bridges"), 1);
 var appsInTossConstantBridges = __toESM(require("@apps-in-toss/native-modules/constant-bridges"), 1);
 var appsInTossEventBridges = __toESM(require("@apps-in-toss/native-modules/event-bridges"), 1);
-var import_react_native28 = require("@granite-js/react-native");
-var import_tds_react_native12 = require("@toss/tds-react-native");
+var import_react_native29 = require("@granite-js/react-native");
+var import_tds_react_native13 = require("@toss/tds-react-native");
 var import_private8 = require("@toss/tds-react-native/private");
-var import_react19 = require("react");
-var import_react_native29 = require("react-native");
+var import_react21 = require("react");
+var import_react_native30 = require("react-native");
 
 // src/components/GameWebView.tsx
 var import_native_modules13 = require("@apps-in-toss/native-modules");
@@ -1225,6 +1228,7 @@ function GameWebviewNavigationBar() {
   const parsedNavigationBar = global2.navigationBar != null ? safeParseNavigationBar(global2.navigationBar) : null;
   const initialAccessoryButton = parsedNavigationBar?.initialAccessoryButton;
   const handleGameWebviewClose = (0, import_react12.useCallback)(async () => {
+    logging.closeButtonClick();
     const isConfirmed = await openConfirm({
       title: `${(0, import_es_hangul3.josa)(global2.brandDisplayName, "\uC744/\uB97C")} \uC885\uB8CC\uD560\uAE4C\uC694?`,
       leftButton: "\uCDE8\uC18C",
@@ -1238,14 +1242,6 @@ function GameWebviewNavigationBar() {
       (0, import_react_native20.closeView)();
     }
   }, [captureExitLog, global2.brandDisplayName, logging, openConfirm]);
-  (0, import_react12.useEffect)(() => {
-    const handleAndroidBackEvent = () => {
-      handleGameWebviewClose();
-      return true;
-    };
-    import_react_native21.BackHandler.addEventListener("hardwareBackPress", handleAndroidBackEvent);
-    return () => import_react_native21.BackHandler.removeEventListener("hardwareBackPress", handleAndroidBackEvent);
-  }, [handleGameWebviewClose]);
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_tds_react_native10.PageNavbar, { preference: { type: "none" } }),
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
@@ -1270,7 +1266,6 @@ function GameWebviewNavigationBar() {
             fixedRightButton: initialAccessoryButton,
             onPressDots: openMoreButtonBottomSheet,
             onPressClose: () => {
-              logging.closeButtonClick();
               handleGameWebviewClose();
             },
             theme: "dark"
@@ -1308,10 +1303,8 @@ var GameWebView = (0, import_react13.forwardRef)(function GameWebView2(props, re
 });
 
 // src/components/PartnerWebView.tsx
-var import_native_modules15 = require("@apps-in-toss/native-modules");
 var import_react_native_webview2 = require("@granite-js/native/react-native-webview");
-var import_react16 = require("react");
-var import_react_native25 = require("react-native");
+var import_react15 = require("react");
 
 // src/components/NavigationBar/PartnerWebviewNavigationBar.tsx
 var import_react_native23 = require("@granite-js/react-native");
@@ -1320,7 +1313,7 @@ var import_private7 = require("@toss/tds-react-native/private");
 var import_es_hangul4 = require("es-hangul");
 var import_react14 = require("react");
 var import_jsx_runtime11 = require("react/jsx-runtime");
-function PartnerWebviewNavigationBar({ handleBackEvent, handleHomeIconButtonClick }) {
+function PartnerWebviewNavigationBar({ onBackButtonClick, onHomeButtonClick }) {
   const globals = getAppsInTossGlobals();
   const { captureExitLog } = useCaptureExitLog();
   const logging = useNavigationBarLogging();
@@ -1330,10 +1323,6 @@ function PartnerWebviewNavigationBar({ handleBackEvent, handleHomeIconButtonClic
   const withHomeButton = parsedNavigationBar?.withHomeButton ?? false;
   const withBackButton = parsedNavigationBar?.withBackButton ?? true;
   const initialAccessoryButton = parsedNavigationBar?.initialAccessoryButton;
-  const handlePressTitle = (0, import_react14.useCallback)(() => {
-    logging.homeButtonClick();
-    handleHomeIconButtonClick();
-  }, [handleHomeIconButtonClick, logging]);
   const handleClose = (0, import_react14.useCallback)(async () => {
     logging.closeButtonClick();
     const isConfirmed = await openConfirm({
@@ -1356,200 +1345,26 @@ function PartnerWebviewNavigationBar({ handleBackEvent, handleHomeIconButtonClic
       icon: toIcon(globals.brandIcon),
       onPressDots: openMoreButtonBottomSheet,
       contentVisible: true,
-      onPressTitle: withHomeButton ? handlePressTitle : void 0,
+      onPressTitle: withHomeButton ? onHomeButtonClick : void 0,
       onPressClose: handleClose,
       withHome: withHomeButton,
       fixedRightButton: initialAccessoryButton,
-      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_private7.NavigationLeft, { visible: withBackButton, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_private7.NavigationBackButton, { onPress: handleBackEvent, canGoBack: false }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_private7.NavigationLeft, { visible: withBackButton, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_private7.NavigationBackButton, { onPress: onBackButtonClick, canGoBack: false }) })
     }
   ) });
 }
 
-// src/core/utils/mergeRefs.ts
-function mergeRefs(...refs) {
-  return (value) => {
-    refs.forEach((ref) => {
-      if (typeof ref === "function") {
-        ref(value);
-      } else if (ref != null) {
-        ref.current = value;
-      }
-    });
-  };
-}
-
-// src/hooks/useWebviewHistoryStack.tsx
-var import_react15 = require("react");
-var INITIAL_STATE = { stack: [], index: -1 };
-function reducer(state, action) {
-  switch (action.type) {
-    case "NAVIGATION_CHANGE": {
-      const { url, canGoForward } = action;
-      if (state.stack.length === 0) {
-        return { stack: [url], index: 0 };
-      }
-      const { stack, index } = state;
-      const cur = stack[index];
-      if (url === cur) {
-        return state;
-      }
-      const prev = index > 0 ? stack[index - 1] : void 0;
-      const next = index < stack.length - 1 ? stack[index + 1] : void 0;
-      if (prev && url === prev && canGoForward) {
-        return { ...state, index: index - 1 };
-      }
-      if (next && url === next) {
-        return { ...state, index: index + 1 };
-      }
-      const base = stack.slice(0, index + 1);
-      const nextStack = [...base, url];
-      return { stack: nextStack, index: nextStack.length - 1 };
-    }
-    default:
-      return state;
-  }
-}
-function useWebViewHistory() {
-  const [state, dispatch] = (0, import_react15.useReducer)(reducer, INITIAL_STATE);
-  const onNavigationStateChange = (0, import_react15.useCallback)(({ url, canGoForward: canGoForward2 }) => {
-    dispatch({ type: "NAVIGATION_CHANGE", url, canGoForward: canGoForward2 });
-  }, []);
-  const { canGoBack, canGoForward } = (0, import_react15.useMemo)(() => {
-    const canBack = state.index > 0;
-    const canFwd = state.index >= 0 && state.index < state.stack.length - 1;
-    return { canGoBack: canBack, canGoForward: canFwd };
-  }, [state.index, state.stack.length]);
-  return { onNavigationStateChange, canGoBack, canGoForward };
-}
-
-// src/utils/log.ts
-var import_native_modules14 = require("@apps-in-toss/native-modules");
-var import_react_native24 = require("@granite-js/react-native");
-
-// src/utils/extractDateFromUUIDv7.ts
-var extractDateFromUUIDv7 = (uuid) => {
-  const timestampHex = uuid.split("-").join("").slice(0, 12);
-  const timestamp = Number.parseInt(timestampHex, 16);
-  return new Date(timestamp);
-};
-
-// src/utils/log.ts
-var getGroupId = (url) => {
-  try {
-    const urlObject = new URL(url);
-    return {
-      groupId: urlObject.pathname,
-      search: urlObject.search.startsWith("?") ? urlObject.search.substring(1) : urlObject.search
-    };
-  } catch {
-    return {
-      groupId: "unknown",
-      search: "unknown"
-    };
-  }
-};
-var getReferrer = () => {
-  try {
-    const referrer = new URL((0, import_react_native24.getSchemeUri)());
-    return referrer.searchParams.get("referrer");
-  } catch {
-    return "";
-  }
-};
-var trackScreen = (url) => {
-  const { groupId, search } = getGroupId(url);
-  const log = {
-    log_type: "screen",
-    log_name: `${groupId}::screen`,
-    params: {
-      search,
-      referrer: getReferrer(),
-      deployment_id: env.getDeploymentId(),
-      deployment_timestamp: extractDateFromUUIDv7(env.getDeploymentId()).getTime()
-    }
-  };
-  return (0, import_native_modules14.eventLog)(log);
-};
-
 // src/components/PartnerWebView.tsx
 var import_jsx_runtime12 = require("react/jsx-runtime");
-var PartnerWebView = (0, import_react16.forwardRef)(
-  function PartnerWebViewScreen(webViewProps, ref) {
-    const webViewRef = (0, import_react16.useRef)(null);
-    const refs = mergeRefs(ref, webViewRef);
-    const { captureExitLog } = useCaptureExitLog();
-    const { canGoBack, onNavigationStateChange } = useWebViewHistory();
-    const historyBackScript = `
-      (function() {
-        window.history.back();
-        true;
-      })();
-    `;
-    const historyHomeScript = `
-      (function() {
-        window.location.href = '/';
-        true;
-      })();
-    `;
-    const handleBackEvent = (0, import_react16.useCallback)(() => {
-      if (canGoBack) {
-        webViewRef.current?.injectJavaScript(historyBackScript);
-      } else {
-        captureExitLog(Date.now());
-        (0, import_native_modules15.closeView)();
-      }
-    }, [canGoBack, captureExitLog, historyBackScript]);
-    (0, import_react16.useEffect)(() => {
-      const handleAndroidBackEvent = () => {
-        if (canGoBack) {
-          webViewRef.current?.injectJavaScript(historyBackScript);
-          return true;
-        } else {
-          captureExitLog(Date.now());
-          return false;
-        }
-      };
-      import_react_native25.BackHandler.addEventListener("hardwareBackPress", handleAndroidBackEvent);
-      return () => import_react_native25.BackHandler.removeEventListener("hardwareBackPress", handleAndroidBackEvent);
-    }, [canGoBack, captureExitLog, historyBackScript]);
-    const handleHomeIconButtonClick = (0, import_react16.useCallback)(() => {
-      webViewRef.current?.injectJavaScript(historyHomeScript);
-    }, [historyHomeScript]);
-    const handleNavigationStateChange = (0, import_react16.useCallback)(
-      (event) => {
-        if (event.url) {
-          trackScreen(event.url);
-        }
-        onNavigationStateChange(event);
-      },
-      [onNavigationStateChange]
-    );
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-        PartnerWebviewNavigationBar,
-        {
-          handleBackEvent,
-          handleHomeIconButtonClick
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-        import_react_native_webview2.WebView,
-        {
-          ref: refs,
-          ...webViewProps,
-          style: { flex: 1 },
-          onNavigationStateChange: (event) => {
-            webViewProps?.onNavigationStateChange?.(event);
-            handleNavigationStateChange(event);
-          }
-        }
-      )
-    ] });
-  }
-);
+var PartnerWebView = (0, import_react15.forwardRef)(function PartnerWebViewScreen({ onBackButtonClick, onHomeButtonClick, ...webViewProps }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(PartnerWebviewNavigationBar, { onBackButtonClick, onHomeButtonClick }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native_webview2.WebView, { ref, ...webViewProps, style: { flex: 1 } })
+  ] });
+});
 
 // src/bridge-handler/useBridgeHandler.tsx
-var import_react17 = require("react");
+var import_react16 = require("react");
 function serializeError(error) {
   return JSON.stringify(error, (_, value) => {
     if (value instanceof Error) {
@@ -1602,8 +1417,8 @@ function useBridgeHandler({
   eventListenerMap,
   injectedJavaScript: originalInjectedJavaScript
 }) {
-  const ref = (0, import_react17.useRef)(null);
-  const injectedJavaScript = (0, import_react17.useMemo)(
+  const ref = (0, import_react16.useRef)(null);
+  const injectedJavaScript = (0, import_react16.useMemo)(
     () => [
       `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
         Object.entries(constantHandlerMap).reduce(
@@ -1630,7 +1445,7 @@ function useBridgeHandler({
       window.__GRANITE_NATIVE_EMITTER.emit('${functionName}/onError/${eventId}', ${serializedError});
     `);
   };
-  const $onMessage = (0, import_react17.useCallback)(
+  const $onMessage = (0, import_react16.useCallback)(
     async (e) => {
       onMessage?.(e);
       const data = JSON.parse(e.nativeEvent.data);
@@ -1680,9 +1495,158 @@ function useBridgeHandler({
   };
 }
 
+// src/core/hooks/useWebBackHandler.tsx
+var import_react_native24 = require("@granite-js/react-native");
+var import_tds_react_native12 = require("@toss/tds-react-native");
+var import_es_hangul5 = require("es-hangul");
+var import_react18 = require("react");
+
+// src/hooks/useWebviewHistoryStack.tsx
+var import_react17 = require("react");
+var INITIAL_STATE = { stack: [], index: -1 };
+function reducer(state, action) {
+  switch (action.type) {
+    case "NAVIGATION_CHANGE": {
+      const { url, canGoForward } = action;
+      if (state.stack.length === 0) {
+        return { stack: [url], index: 0 };
+      }
+      const { stack, index } = state;
+      const cur = stack[index];
+      if (url === cur) {
+        return state;
+      }
+      const prev = index > 0 ? stack[index - 1] : void 0;
+      const next = index < stack.length - 1 ? stack[index + 1] : void 0;
+      if (prev && url === prev && canGoForward) {
+        return { ...state, index: index - 1 };
+      }
+      if (next && url === next) {
+        return { ...state, index: index + 1 };
+      }
+      const base = stack.slice(0, index + 1);
+      const nextStack = [...base, url];
+      return { stack: nextStack, index: nextStack.length - 1 };
+    }
+    default:
+      return state;
+  }
+}
+function useWebViewHistory() {
+  const [state, dispatch] = (0, import_react17.useReducer)(reducer, INITIAL_STATE);
+  const onNavigationStateChange = (0, import_react17.useCallback)(({ url, canGoForward: canGoForward2 }) => {
+    dispatch({ type: "NAVIGATION_CHANGE", url, canGoForward: canGoForward2 });
+  }, []);
+  const { canGoBack, canGoForward } = (0, import_react17.useMemo)(() => {
+    const canBack = state.index > 0;
+    const canFwd = state.index >= 0 && state.index < state.stack.length - 1;
+    return { canGoBack: canBack, canGoForward: canFwd };
+  }, [state.index, state.stack.length]);
+  return { onNavigationStateChange, hasHistory: canGoBack, canGoForward };
+}
+
+// src/core/hooks/useWebBackHandler.tsx
+var HISTORY_BACK_SCRIPT = `
+(function() {
+  window.history.back();
+  true;
+})();
+`;
+var HISTORY_HOME_SCRIPT = `
+  (function() {
+    window.location.href = '/';
+    true;
+  })();
+`;
+function useWebBackHandler(webViewRef) {
+  const { captureExitLog } = useCaptureExitLog();
+  const { hasHistory, onNavigationStateChange } = useWebViewHistory();
+  const {
+    handlersRef: webBackHandlersRef,
+    hasBackEvent: hasWebBackEvent,
+    addEventListener: addWebBackEventListener,
+    removeEventListener: removeWebBackEventListener
+  } = (0, import_react_native24.useBackEventState)();
+  const logging = useNavigationBarLogging();
+  const { openConfirm } = (0, import_tds_react_native12.useDialog)();
+  const global2 = getAppsInTossGlobals();
+  const addEventListener = (0, import_react18.useCallback)(
+    (handler) => {
+      addWebBackEventListener(handler);
+    },
+    [addWebBackEventListener]
+  );
+  const removeEventListener = (0, import_react18.useCallback)(
+    (handler) => {
+      removeWebBackEventListener(handler);
+    },
+    [removeWebBackEventListener]
+  );
+  const handleWebBack = (0, import_react18.useCallback)(async () => {
+    if (hasWebBackEvent) {
+      for (const handler of webBackHandlersRef) {
+        handler();
+      }
+      return;
+    }
+    if (hasHistory) {
+      webViewRef.current?.injectJavaScript(HISTORY_BACK_SCRIPT);
+    } else {
+      const isConfirmed = await openConfirm({
+        title: `${(0, import_es_hangul5.josa)(global2.brandDisplayName, "\uC744/\uB97C")} \uC885\uB8CC\uD560\uAE4C\uC694?`,
+        leftButton: "\uCDE8\uC18C",
+        rightButton: "\uC885\uB8CC\uD558\uAE30",
+        closeOnDimmerClick: true,
+        onEntered: logging.closePopupShow
+      });
+      logging.closePopupCtaClick(isConfirmed);
+      if (isConfirmed) {
+        captureExitLog(Date.now());
+        (0, import_react_native24.closeView)();
+      }
+    }
+  }, [
+    captureExitLog,
+    global2.brandDisplayName,
+    hasHistory,
+    hasWebBackEvent,
+    webBackHandlersRef,
+    logging,
+    openConfirm,
+    webViewRef
+  ]);
+  const handleWebHome = (0, import_react18.useCallback)(() => {
+    logging.homeButtonClick();
+    if (hasWebBackEvent) {
+      for (const handler of webBackHandlersRef) {
+        handler();
+      }
+      return;
+    }
+    webViewRef.current?.injectJavaScript(HISTORY_HOME_SCRIPT);
+  }, [hasWebBackEvent, webBackHandlersRef, logging, webViewRef]);
+  return (0, import_react18.useMemo)(
+    () => ({ addEventListener, removeEventListener, handleWebBack, handleWebHome, onNavigationStateChange }),
+    [addEventListener, removeEventListener, handleWebBack, handleWebHome, onNavigationStateChange]
+  );
+}
+
+// src/core/utils/mergeRefs.ts
+function mergeRefs(...refs) {
+  return (value) => {
+    refs.forEach((ref) => {
+      if (typeof ref === "function") {
+        ref(value);
+      } else if (ref != null) {
+        ref.current = value;
+      }
+    });
+  };
+}
+
 // src/hooks/useCreateUserAgent.ts
-var import_native_modules16 = require("@apps-in-toss/native-modules");
-var import_react_native26 = require("react-native");
+var import_native_modules14 = require("@apps-in-toss/native-modules");
+var import_react_native25 = require("react-native");
 var FontA11yCategory = {
   Large: "Large",
   xLarge: "xLarge",
@@ -1815,9 +1779,9 @@ function useCreateUserAgent({
   safeArea,
   safeAreaBottomTransparency
 }) {
-  const platform = (0, import_native_modules16.getPlatformOS)();
-  const appVersion = (0, import_native_modules16.getTossAppVersion)();
-  const { fontScale } = (0, import_react_native26.useWindowDimensions)();
+  const platform = (0, import_native_modules14.getPlatformOS)();
+  const appVersion = (0, import_native_modules14.getTossAppVersion)();
+  const { fontScale } = (0, import_react_native25.useWindowDimensions)();
   const platformString = platform === "ios" ? "iPhone" : "Android";
   const fontA11y = mapFontScaleToCategory(fontScale, platform);
   const normalizedFontScale = convertToAndroidStyleScale(fontScale, platform);
@@ -1837,17 +1801,17 @@ function useCreateUserAgent({
 }
 
 // src/hooks/useGeolocation.ts
-var import_native_modules17 = require("@apps-in-toss/native-modules");
-var import_react_native27 = require("@granite-js/react-native");
-var import_react18 = require("react");
+var import_native_modules15 = require("@apps-in-toss/native-modules");
+var import_react_native26 = require("@granite-js/react-native");
+var import_react19 = require("react");
 function useGeolocation({ accuracy, distanceInterval, timeInterval }) {
-  const isVisible = (0, import_react_native27.useVisibility)();
-  const [location, setLocation] = (0, import_react18.useState)(null);
-  (0, import_react18.useEffect)(() => {
+  const isVisible = (0, import_react_native26.useVisibility)();
+  const [location, setLocation] = (0, import_react19.useState)(null);
+  (0, import_react19.useEffect)(() => {
     if (!isVisible) {
       return;
     }
-    return (0, import_native_modules17.startUpdateLocation)({
+    return (0, import_native_modules15.startUpdateLocation)({
       options: {
         accuracy,
         distanceInterval,
@@ -1860,18 +1824,97 @@ function useGeolocation({ accuracy, distanceInterval, timeInterval }) {
   return location;
 }
 
+// src/hooks/useWaitForReturnNavigator.tsx
+var import_react_native27 = require("@granite-js/react-native");
+var import_react20 = require("react");
+function useWaitForReturnNavigator() {
+  const callbacks = (0, import_react20.useRef)([]).current;
+  const navigation = (0, import_react_native27.useNavigation)();
+  const startNavigating = (0, import_react20.useCallback)(
+    (route, params) => {
+      return new Promise((resolve) => {
+        callbacks.push(resolve);
+        navigation.navigate(route, params);
+      });
+    },
+    [callbacks, navigation]
+  );
+  const handleVisibilityChange = (0, import_react20.useCallback)(
+    (state) => {
+      if (state === "visible" && callbacks.length > 0) {
+        for (const callback of callbacks) {
+          callback();
+        }
+        callbacks.splice(0, callbacks.length);
+      }
+    },
+    [callbacks]
+  );
+  (0, import_react_native27.useVisibilityChange)(handleVisibilityChange);
+  return startNavigating;
+}
+
+// src/utils/log.ts
+var import_native_modules16 = require("@apps-in-toss/native-modules");
+var import_react_native28 = require("@granite-js/react-native");
+
+// src/utils/extractDateFromUUIDv7.ts
+var extractDateFromUUIDv7 = (uuid) => {
+  const timestampHex = uuid.split("-").join("").slice(0, 12);
+  const timestamp = Number.parseInt(timestampHex, 16);
+  return new Date(timestamp);
+};
+
+// src/utils/log.ts
+var getGroupId = (url) => {
+  try {
+    const urlObject = new URL(url);
+    return {
+      groupId: urlObject.pathname,
+      search: urlObject.search.startsWith("?") ? urlObject.search.substring(1) : urlObject.search
+    };
+  } catch {
+    return {
+      groupId: "unknown",
+      search: "unknown"
+    };
+  }
+};
+var getReferrer = () => {
+  try {
+    const referrer = new URL((0, import_react_native28.getSchemeUri)());
+    return referrer.searchParams.get("referrer");
+  } catch {
+    return "";
+  }
+};
+var trackScreen = (url) => {
+  const { groupId, search } = getGroupId(url);
+  const log = {
+    log_type: "screen",
+    log_name: `${groupId}::screen`,
+    params: {
+      search,
+      referrer: getReferrer(),
+      deployment_id: env.getDeploymentId(),
+      deployment_timestamp: extractDateFromUUIDv7(env.getDeploymentId()).getTime()
+    }
+  };
+  return (0, import_native_modules16.eventLog)(log);
+};
+
 // src/components/WebView.tsx
 var import_jsx_runtime13 = require("react/jsx-runtime");
 var operationalEnvironment = appsInTossConstantBridges.getOperationalEnvironment();
 var TYPES = ["partner", "external", "game"];
 var WEBVIEW_TYPES = {
   partner: PartnerWebView,
-  external: import_tds_react_native12.ExternalWebViewScreen,
+  external: import_tds_react_native13.ExternalWebViewScreen,
   game: GameWebView
 };
 function mergeSchemeQueryParamsInto(url) {
   const baseUrl = new URL(url);
-  const schemeUrl = new URL((0, import_react_native28.getSchemeUri)());
+  const schemeUrl = new URL((0, import_react_native29.getSchemeUri)());
   baseUrl.pathname = schemeUrl.pathname;
   for (const [key, value] of schemeUrl.searchParams.entries()) {
     baseUrl.searchParams.set(key, value);
@@ -1883,7 +1926,7 @@ function getWebViewUri(local) {
     const devUrl = `http://${local.host}:${local.port}`;
     return mergeSchemeQueryParamsInto(devUrl).toString();
   }
-  const { url: rawUrl } = import_native_modules18.AppsInTossModule.getWebBundleURL({});
+  const { url: rawUrl } = import_native_modules17.AppsInTossModule.getWebBundleURL({});
   const url = mergeSchemeQueryParamsInto(rawUrl);
   const deploymentId = env.getDeploymentId();
   if (deploymentId) {
@@ -1895,8 +1938,9 @@ function WebView({ type, local, onMessage, ...props }) {
   if (!TYPES.includes(type)) {
     throw new Error(`Invalid WebView type: '${type}'`);
   }
-  const graniteEvent = (0, import_react_native28.useGraniteEvent)();
-  const uri = (0, import_react19.useMemo)(() => getWebViewUri(local), [local]);
+  const webViewRef = (0, import_react21.useRef)(null);
+  const webBackHandler = useWebBackHandler(webViewRef);
+  const uri = (0, import_react21.useMemo)(() => getWebViewUri(local), [local]);
   const top = (0, import_private8.useSafeAreaTop)();
   const bottom = (0, import_private8.useSafeAreaBottom)();
   const global2 = getAppsInTossGlobals();
@@ -1908,7 +1952,7 @@ function WebView({ type, local, onMessage, ...props }) {
       document.head.appendChild(style);
     })();
   `;
-  const [allowsBackForwardNavigationGestures, setAllowsBackForwardNavigationGestures] = (0, import_react19.useState)(
+  const [allowsBackForwardNavigationGestures, setAllowsBackForwardNavigationGestures] = (0, import_react21.useState)(
     props.allowsBackForwardNavigationGestures
   );
   const handler = useBridgeHandler({
@@ -1917,23 +1961,28 @@ function WebView({ type, local, onMessage, ...props }) {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     eventListenerMap: {
       ...appsInTossEventBridges,
-      navigationAccessoryEvent: ({ onEvent, onError }) => import_tds_react_native12.tdsEvent.addEventListener("navigationAccessoryEvent", { onEvent, onError }),
-      backEvent: ({ onEvent, onError, options }) => graniteEvent.addEventListener("backEvent", { onEvent, onError, options }),
-      entryMessageExited: ({ onEvent, onError }) => import_native_modules18.appsInTossEvent.addEventListener("entryMessageExited", { onEvent, onError }),
-      updateLocationEvent: ({ onEvent, onError, options }) => import_native_modules18.appsInTossEvent.addEventListener("updateLocationEvent", { onEvent, onError, options }),
+      navigationAccessoryEvent: ({ onEvent, onError }) => import_tds_react_native13.tdsEvent.addEventListener("navigationAccessoryEvent", { onEvent, onError }),
+      backEvent: ({ onEvent }) => {
+        webBackHandler.addEventListener(onEvent);
+        return () => {
+          webBackHandler.removeEventListener(onEvent);
+        };
+      },
+      entryMessageExited: ({ onEvent, onError }) => import_native_modules17.appsInTossEvent.addEventListener("entryMessageExited", { onEvent, onError }),
+      updateLocationEvent: ({ onEvent, onError, options }) => import_native_modules17.appsInTossEvent.addEventListener("updateLocationEvent", { onEvent, onError, options }),
       /** @internal */
-      appBridgeCallbackEvent: ({ onEvent, onError, options }) => import_native_modules18.appsInTossEvent.addEventListener("appBridgeCallbackEvent", { onEvent, onError, options }),
+      appBridgeCallbackEvent: ({ onEvent, onError, options }) => import_native_modules17.appsInTossEvent.addEventListener("appBridgeCallbackEvent", { onEvent, onError, options }),
       /** AdMob */
-      loadAdMobInterstitialAd: import_native_modules18.GoogleAdMob.loadAdMobInterstitialAd,
-      showAdMobInterstitialAd: import_native_modules18.GoogleAdMob.showAdMobInterstitialAd,
-      loadAdMobRewardedAd: import_native_modules18.GoogleAdMob.loadAdMobRewardedAd,
-      showAdMobRewardedAd: import_native_modules18.GoogleAdMob.showAdMobRewardedAd,
+      loadAdMobInterstitialAd: import_native_modules17.GoogleAdMob.loadAdMobInterstitialAd,
+      showAdMobInterstitialAd: import_native_modules17.GoogleAdMob.showAdMobInterstitialAd,
+      loadAdMobRewardedAd: import_native_modules17.GoogleAdMob.loadAdMobRewardedAd,
+      showAdMobRewardedAd: import_native_modules17.GoogleAdMob.showAdMobRewardedAd,
       /** AdMobV2 */
-      loadAppsInTossAdMob: import_native_modules18.GoogleAdMob.loadAppsInTossAdMob,
-      showAppsInTossAdMob: import_native_modules18.GoogleAdMob.showAppsInTossAdMob,
+      loadAppsInTossAdMob: import_native_modules17.GoogleAdMob.loadAppsInTossAdMob,
+      showAppsInTossAdMob: import_native_modules17.GoogleAdMob.showAppsInTossAdMob,
       /** IAP */
-      iapCreateOneTimePurchaseOrder: import_native_modules18.IAP.createOneTimePurchaseOrder,
-      requestOneTimePurchase: import_native_modules18.requestOneTimePurchase
+      iapCreateOneTimePurchaseOrder: import_native_modules17.IAP.createOneTimePurchaseOrder,
+      requestOneTimePurchase: import_native_modules17.requestOneTimePurchase
     },
     constantHandlerMap: {
       ...appsInTossConstantBridges,
@@ -1941,13 +1990,13 @@ function WebView({ type, local, onMessage, ...props }) {
       getSafeAreaBottom: () => bottom,
       ...Object.fromEntries(Object.entries(global2).map(([key, value]) => [key, () => value])),
       /** AdMob */
-      loadAdMobInterstitialAd_isSupported: import_native_modules18.GoogleAdMob.loadAdMobInterstitialAd.isSupported,
-      showAdMobInterstitialAd_isSupported: import_native_modules18.GoogleAdMob.showAdMobInterstitialAd.isSupported,
-      loadAdMobRewardedAd_isSupported: import_native_modules18.GoogleAdMob.loadAdMobRewardedAd.isSupported,
-      showAdMobRewardedAd_isSupported: import_native_modules18.GoogleAdMob.showAdMobRewardedAd.isSupported,
+      loadAdMobInterstitialAd_isSupported: import_native_modules17.GoogleAdMob.loadAdMobInterstitialAd.isSupported,
+      showAdMobInterstitialAd_isSupported: import_native_modules17.GoogleAdMob.showAdMobInterstitialAd.isSupported,
+      loadAdMobRewardedAd_isSupported: import_native_modules17.GoogleAdMob.loadAdMobRewardedAd.isSupported,
+      showAdMobRewardedAd_isSupported: import_native_modules17.GoogleAdMob.showAdMobRewardedAd.isSupported,
       /** AdMobV2 */
-      loadAppsInTossAdMob_isSupported: import_native_modules18.GoogleAdMob.loadAppsInTossAdMob.isSupported,
-      showAppsInTossAdMob_isSupported: import_native_modules18.GoogleAdMob.showAppsInTossAdMob.isSupported,
+      loadAppsInTossAdMob_isSupported: import_native_modules17.GoogleAdMob.loadAppsInTossAdMob.isSupported,
+      showAppsInTossAdMob_isSupported: import_native_modules17.GoogleAdMob.showAppsInTossAdMob.isSupported,
       /** env */
       getDeploymentId: env.getDeploymentId
     },
@@ -1970,19 +2019,19 @@ function WebView({ type, local, onMessage, ...props }) {
       getCurrentLocation: appsInTossAsyncBridges.getCurrentLocation,
       openCamera: appsInTossAsyncBridges.openCamera,
       /** Storage */
-      getStorageItem: import_native_modules18.Storage.getItem,
-      setStorageItem: import_native_modules18.Storage.setItem,
-      removeStorageItem: import_native_modules18.Storage.removeItem,
-      clearItems: import_native_modules18.Storage.clearItems,
+      getStorageItem: import_native_modules17.Storage.getItem,
+      setStorageItem: import_native_modules17.Storage.setItem,
+      removeStorageItem: import_native_modules17.Storage.removeItem,
+      clearItems: import_native_modules17.Storage.clearItems,
       /** IAP */
-      iapGetProductItemList: import_native_modules18.IAP.getProductItemList,
-      iapCreateOneTimePurchaseOrder: import_native_modules18.iapCreateOneTimePurchaseOrder,
-      processProductGrant: import_native_modules18.processProductGrant,
-      getPendingOrders: import_native_modules18.IAP.getPendingOrders,
-      getCompletedOrRefundedOrders: import_native_modules18.IAP.getCompletedOrRefundedOrders
+      iapGetProductItemList: import_native_modules17.IAP.getProductItemList,
+      iapCreateOneTimePurchaseOrder: import_native_modules17.iapCreateOneTimePurchaseOrder,
+      processProductGrant: import_native_modules17.processProductGrant,
+      getPendingOrders: import_native_modules17.IAP.getPendingOrders,
+      getCompletedOrRefundedOrders: import_native_modules17.IAP.getCompletedOrRefundedOrders
     }
   });
-  const headerPropForExternalWebView = (0, import_react19.useMemo)(() => {
+  const headerPropForExternalWebView = (0, import_react21.useMemo)(() => {
     const parsedNavigationBar = global2.navigationBar != null ? safeParseNavigationBar(global2.navigationBar) : null;
     const initialAccessoryButton = parsedNavigationBar?.initialAccessoryButton;
     const withBackButton = parsedNavigationBar?.withBackButton ?? true;
@@ -2002,10 +2051,19 @@ function WebView({ type, local, onMessage, ...props }) {
   const userAgent = useCreateUserAgent({
     colorPreference: "light"
   });
+  const refs = mergeRefs(handler.ref, webViewRef);
+  (0, import_react21.useEffect)(() => {
+    const callback = () => {
+      webBackHandler.handleWebBack();
+      return true;
+    };
+    import_react_native30.BackHandler.addEventListener("hardwareBackPress", callback);
+    return () => import_react_native30.BackHandler.removeEventListener("hardwareBackPress", callback);
+  }, [webBackHandler]);
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
     BaseWebView,
     {
-      ref: handler.ref,
+      ref: refs,
       ...props,
       ...headerPropForExternalWebView,
       source: {
@@ -2015,14 +2073,23 @@ function WebView({ type, local, onMessage, ...props }) {
           "User-Agent": userAgent
         }
       },
-      userAgent: import_react_native29.Platform.OS === "ios" ? userAgent : void 0,
+      onHomeButtonClick: webBackHandler.handleWebHome,
+      onBackButtonClick: webBackHandler.handleWebBack,
+      onNavigationStateChange: (event) => {
+        if (event.url) {
+          trackScreen(event.url);
+        }
+        props.onNavigationStateChange?.(event);
+        webBackHandler.onNavigationStateChange(event);
+      },
+      userAgent: import_react_native30.Platform.OS === "ios" ? userAgent : void 0,
       sharedCookiesEnabled: true,
       webviewDebuggingEnabled: webViewDebuggingEnabled,
       thirdPartyCookiesEnabled: true,
       onMessage: handler.onMessage,
       injectedJavaScript: handler.injectedJavaScript,
       injectedJavaScriptBeforeContentLoaded: handler.injectedJavaScript,
-      decelerationRate: import_react_native29.Platform.OS === "ios" ? 1 : void 0,
+      decelerationRate: import_react_native30.Platform.OS === "ios" ? 1 : void 0,
       allowsBackForwardNavigationGestures
     }
   );
@@ -2044,11 +2111,14 @@ var Analytics2 = {
   Analytics,
   AppsInToss,
   INTERNAL__onVisibilityChangedByTransparentServiceWeb,
+  OverlayProvider,
   WebView,
   env,
   useCreateUserAgent,
   useGeolocation,
+  useOverlay,
   useTopNavigation,
+  useWaitForReturnNavigator,
   ...require("@apps-in-toss/analytics"),
   ...require("@apps-in-toss/native-modules"),
   ...require("@apps-in-toss/types")