@apps-in-toss/framework 1.0.2 → 1.1.0

package/dist/index.js

@@ -3,9 +3,10 @@ import { Analytics as InternalAnalytics } from "@apps-in-toss/analytics";
 
 // src/core/registerApp.tsx
 import { Analytics } from "@apps-in-toss/analytics";
-import { isMinVersionSupported, setIosSwipeGestureEnabled, eventLog } from "@apps-in-toss/native-modules";
-import { Granite as Granite3 } from "@granite-js/react-native";
+import { isMinVersionSupported as isMinVersionSupported2, setIosSwipeGestureEnabled, eventLog } from "@apps-in-toss/native-modules";
+import { Granite as Granite6 } from "@granite-js/react-native";
 import { TDSProvider } from "@toss-design-system/react-native";
+import { AppRegistry } from "react-native";
 
 // src/core/components/AppEvent.tsx
 import { INTERNAL__module as INTERNAL__module2 } from "@apps-in-toss/native-modules";
@@ -148,10 +149,276 @@ function AppUpdate() {
   return /* @__PURE__ */ jsx(Fragment, {});
 }
 
-// src/core/hooks/useAppsInTossBridge.ts
+// src/core/components/BuiltinNavigationBar/index.tsx
 import { appsInTossEvent } from "@apps-in-toss/native-modules";
-import { useBridge } from "@toss-design-system/react-native";
-import { useEffect as useEffect4 } from "react";
+import { closeView, useBackEventContext, useNavigation } from "@granite-js/react-native";
+import { useDialog as useDialog2 } from "@toss-design-system/react-native";
+import { NavigationBackButton, NavigationLeft, TopNavigation } from "@toss-design-system/react-native/private";
+import { josa } from "es-hangul";
+import { useCallback as useCallback3, useEffect as useEffect5, useRef as useRef2 } from "react";
+import { BackHandler } from "react-native";
+
+// src/core/components/BuiltinNavigationBar/useBuiltinNavigationBarLogging.tsx
+import { INTERNAL__module as INTERNAL__module3 } from "@apps-in-toss/native-modules";
+import { Granite as Granite3 } from "@granite-js/react-native";
+var NAVI_BAR_IMPRESSION_SCHEMA_ID = 1596837;
+var NAVI_BAR_IMPRESSION_LOG_NAME = "appsintoss_app_visit__common_module::impression__navigation_bar";
+var CLOSE_POPUP_SHOW_SCHEMA_ID = 1644490;
+var CLOSE_POPUP_SHOW_LOG_NAME = "appsintoss_app_visit__common_module::popup__close_app";
+var CLOSE_BUTTON_CLICK_SCHEMA_ID = 1596831;
+var CLOSE_BUTTON_CLICK_LOG_NAME = "appsintoss_app_visit__common_module::click__icon_close";
+var CLOSE_POPUP_CTA_CLICK_SCHEMA_ID = 1644492;
+var CLOSE_POPUP_CTA_CLICK_LOG_NAME = "appsintoss_app_visit__common_module::popup__close_app::click__cta";
+var HOME_BUTTON_CLICK_SCHEMA_ID = 1596839;
+var HOME_BUTTON_CLICK_LOG_NAME = "appsintoss_app_visit__common_module::click__icon_home";
+function useBuiltinNavigationBarLogging() {
+  const referrer = useReferrer();
+  const baseParams = {
+    referrer,
+    app_name: Granite3.appName
+  };
+  const logNavBarImpression = (naviBarConfig) => {
+    INTERNAL__module3.tossCoreEventLog({
+      log_name: NAVI_BAR_IMPRESSION_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...naviBarConfig,
+        ...baseParams,
+        event_type: "impression",
+        schema_id: NAVI_BAR_IMPRESSION_SCHEMA_ID
+      }
+    });
+  };
+  const logHomeButtonClick = () => {
+    INTERNAL__module3.tossCoreEventLog({
+      log_name: HOME_BUTTON_CLICK_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        event_type: "click",
+        schema_id: HOME_BUTTON_CLICK_SCHEMA_ID
+      }
+    });
+  };
+  const logCloseButtonClick = () => {
+    INTERNAL__module3.tossCoreEventLog({
+      log_name: CLOSE_BUTTON_CLICK_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        event_type: "click",
+        schema_id: CLOSE_BUTTON_CLICK_SCHEMA_ID
+      }
+    });
+  };
+  const logClosePopupShow = () => {
+    INTERNAL__module3.tossCoreEventLog({
+      log_name: CLOSE_POPUP_SHOW_LOG_NAME,
+      log_type: "popup",
+      params: {
+        ...baseParams,
+        schema_id: CLOSE_POPUP_SHOW_SCHEMA_ID
+      }
+    });
+  };
+  const logClosePopupCtaClick = (confirm) => {
+    INTERNAL__module3.tossCoreEventLog({
+      log_name: CLOSE_POPUP_CTA_CLICK_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        close_yn: confirm ? "Y" : "N",
+        schema_id: CLOSE_POPUP_CTA_CLICK_SCHEMA_ID,
+        event_type: "click"
+      }
+    });
+  };
+  return {
+    navBarImpression: logNavBarImpression,
+    closePopupShow: logClosePopupShow,
+    closePopupCtaClick: logClosePopupCtaClick,
+    closeButtonClick: logCloseButtonClick,
+    homeButtonClick: logHomeButtonClick
+  };
+}
+
+// src/core/hooks/useMoreButtonBottomSheet/index.tsx
+import { INTERNAL__appBridgeHandler, isMinVersionSupported } from "@apps-in-toss/native-modules";
+import { openURL as openURL3 } from "@granite-js/react-native";
+import { BottomSheet, List, ListHeader, ListRow } from "@toss-design-system/react-native";
+import { useAdaptive, useOverlay } from "@toss-design-system/react-native/private";
+import { useEffect as useEffect4, useState } from "react";
+
+// src/core/hooks/useMoreButtonBottomSheet/useMoreButtonBottomSheetLogging.tsx
+import { INTERNAL__module as INTERNAL__module4 } from "@apps-in-toss/native-modules";
+import { Granite as Granite4 } from "@granite-js/react-native";
+var BOTTOM_SHEET_SCHEMA_ID = 1596825;
+var BOTTOM_SHEET_LOG_NAME = "appsintoss_app_visit__common_module::bottomsheet__more";
+var BOTTOM_SHEET_OPEN_SCHEMA_ID = 1596829;
+var BOTTOM_SHEET_OPEN_LOG_NAME = "appsintoss_app_visit__common_module::click__icon_more";
+var BOTTOM_SHEET_CLOSE_CLICK_SCHEMA_ID = 1596843;
+var BOTTOM_SHEET_CLOSE_CLICK_LOG_NAME = "appsintoss_app_visit__common_module::bottomsheet__more::click__close";
+var BOTTOM_SHEET_MENU_CLICK_SCHEMA_ID = 1596841;
+var BOTTOM_SHEET_MENU_CLICK_LOG_NAME = "appsintoss_app_visit__common_module::bottomsheet__more::click__menu";
+function useMoreButtonBottomSheetLogging() {
+  const referrer = useReferrer();
+  const baseParams = {
+    referrer,
+    app_name: Granite4.appName
+  };
+  const logBottomSheetShow = () => {
+    INTERNAL__module4.tossCoreEventLog({
+      log_name: BOTTOM_SHEET_LOG_NAME,
+      log_type: "popup",
+      params: {
+        ...baseParams,
+        schema_id: BOTTOM_SHEET_SCHEMA_ID
+      }
+    });
+  };
+  const logBottomSheetOpen = () => {
+    INTERNAL__module4.tossCoreEventLog({
+      log_name: BOTTOM_SHEET_OPEN_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        schema_id: BOTTOM_SHEET_OPEN_SCHEMA_ID,
+        event_type: "click"
+      }
+    });
+  };
+  const logBottomSheetCloseClick = () => {
+    INTERNAL__module4.tossCoreEventLog({
+      log_name: BOTTOM_SHEET_CLOSE_CLICK_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        schema_id: BOTTOM_SHEET_CLOSE_CLICK_SCHEMA_ID,
+        event_type: "click"
+      }
+    });
+  };
+  const logBottomSheetMenuClick = ({ title }) => {
+    INTERNAL__module4.tossCoreEventLog({
+      log_name: BOTTOM_SHEET_MENU_CLICK_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        schema_id: BOTTOM_SHEET_MENU_CLICK_SCHEMA_ID,
+        event_type: "click",
+        item_title: title
+      }
+    });
+  };
+  return {
+    show: logBottomSheetShow,
+    open: logBottomSheetOpen,
+    close: logBottomSheetCloseClick,
+    menuClick: logBottomSheetMenuClick
+  };
+}
+
+// src/hooks/useAppUpdateDialog.tsx
+import { INTERNAL__module as INTERNAL__module5 } from "@apps-in-toss/native-modules";
+import { Granite as Granite5, openURL as openURL2 } from "@granite-js/react-native";
+import { useDialog } from "@toss-design-system/react-native";
+import { useCallback as useCallback2 } from "react";
+
+// src/utils/market.ts
+import { Platform } from "react-native";
+var PLAYSTORE_LINK = "https://play.google.com/store/apps/details?id=viva.republica.toss";
+var APPSTORE_LINK = "https://itunes.apple.com/app/id839333328";
+var getMarketLink = () => {
+  return Platform.OS === "android" ? PLAYSTORE_LINK : APPSTORE_LINK;
+};
+
+// src/hooks/useAppUpdateDialog.tsx
+function useAppUpdateDialog() {
+  const { openConfirm } = useDialog();
+  const logging = useAppUpdateDialogLogging();
+  const openAppUpdateDialog = useCallback2(
+    async ({
+      title,
+      description,
+      leftButton = "\uB2EB\uAE30",
+      rightButton = "\uC5C5\uB370\uC774\uD2B8\uD558\uAE30"
+    }) => {
+      logging.show();
+      const isConfirmed = await openConfirm({
+        title,
+        description,
+        leftButton,
+        rightButton,
+        closeOnDimmerClick: true
+      });
+      if (!isConfirmed) {
+        logging.close();
+        return;
+      }
+      logging.update();
+      const STORE_SCHEME = getMarketLink();
+      openURL2(`supertoss://web?url=${STORE_SCHEME}&external=browser`);
+    },
+    [logging, openConfirm]
+  );
+  return {
+    open: openAppUpdateDialog
+  };
+}
+var UPDATE_DIALOG_SCHEMA_ID = 1634992;
+var UPDATE_DIALOG_LOG_NAME = "appsintoss_app_visit__common_module::bottomsheet__app_update";
+var UPDATE_DIALOG_CTA_CLICK_SCHEMA_ID = 1634996;
+var UPDATE_DIALOG_CTA_CLICK_LOG_NAME = "appsintoss_app_visit__common_module::bottomsheet__app_update::click__cta";
+function useAppUpdateDialogLogging() {
+  const referrer = useReferrer();
+  const baseParams = {
+    referrer,
+    app_name: Granite5.appName
+  };
+  const logUpdateClick = () => {
+    INTERNAL__module5.tossCoreEventLog({
+      log_name: UPDATE_DIALOG_CTA_CLICK_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        schema_id: UPDATE_DIALOG_CTA_CLICK_SCHEMA_ID,
+        event_type: "click",
+        button_type: "update"
+      }
+    });
+  };
+  const logCloseClick = () => {
+    INTERNAL__module5.tossCoreEventLog({
+      log_name: UPDATE_DIALOG_CTA_CLICK_LOG_NAME,
+      log_type: "event",
+      params: {
+        ...baseParams,
+        schema_id: UPDATE_DIALOG_CTA_CLICK_SCHEMA_ID,
+        event_type: "click",
+        button_type: "close"
+      }
+    });
+  };
+  const logDialogShow = () => {
+    INTERNAL__module5.tossCoreEventLog({
+      log_name: UPDATE_DIALOG_LOG_NAME,
+      log_type: "popup",
+      params: {
+        ...baseParams,
+        schema_id: UPDATE_DIALOG_SCHEMA_ID
+      }
+    });
+  };
+  return { update: logUpdateClick, close: logCloseClick, show: logDialogShow };
+}
+
+// src/core/utils/ensureValue.ts
+function ensureValue(value, name) {
+  if (value === void 0) {
+    throw new Error(`${name} is required`);
+  }
+  return value;
+}
 
 // src/core/utils/getAppsInTossGlobals.ts
 function getAppsInTossGlobals() {
@@ -161,73 +428,312 @@ function getAppsInTossGlobals() {
   return global.__appsInToss;
 }
 
+// src/core/hooks/useMoreButtonBottomSheet/index.tsx
+import { Fragment as Fragment2, jsx as jsx2 } from "react/jsx-runtime";
+var APP_BRIDGE_METHOD_NAME = "getMiniAppsSupportContact";
+function useMoreButtonBottomSheet() {
+  const globals = getAppsInTossGlobals();
+  const adaptive = useAdaptive();
+  const [itemList, setItemList] = useState([]);
+  const appUpdateDialog = useAppUpdateDialog();
+  const logging = useMoreButtonBottomSheetLogging();
+  const overlay = useOverlay();
+  const title = ensureValue(globals.brandDisplayName, "displayName");
+  const isSupported = isMinVersionSupported({
+    android: "5.226.0",
+    ios: "5.226.0"
+  });
+  useEffect4(() => {
+    if (!isSupported) {
+      return;
+    }
+    INTERNAL__appBridgeHandler.invokeAppBridgeMethod(
+      APP_BRIDGE_METHOD_NAME,
+      {},
+      {
+        onSuccess: ({ items }) => setItemList(items),
+        onError: (error) => console.error("\uBA54\uB274 \uBAA9\uB85D\uC744 \uAC00\uC838\uC624\uB294 \uB370 \uC2E4\uD328\uD588\uC5B4\uC694:", error)
+      }
+    );
+  }, [isSupported]);
+  const onClickHandler = async () => {
+    logging.open();
+    if (!isSupported) {
+      await appUpdateDialog.open({
+        title: `\uC774 \uAE30\uB2A5\uC744 \uC4F0\uB824\uBA74 \uC571 \uC5C5\uB370\uC774\uD2B8\uAC00 \uD544\uC694\uD574\uC694`,
+        description: `\uBB38\uC758, \uAD8C\uD55C \uC124\uC815, \uC2E0\uACE0 \uB4F1 \uAE30\uB2A5\uC744 \uC4F8 \uC218 \uC788\uC5B4\uC694`
+      });
+      return;
+    }
+    overlay.open(({ isOpen, exit, close }) => {
+      const handleClose = () => {
+        logging.close();
+        close();
+      };
+      return /* @__PURE__ */ jsx2(BottomSheetImpressionArea, { children: /* @__PURE__ */ jsx2(
+        BottomSheet.Root,
+        {
+          header: /* @__PURE__ */ jsx2(
+            ListHeader,
+            {
+              title: /* @__PURE__ */ jsx2(ListHeader.TitleParagraph, { color: adaptive.grey800, fontWeight: "bold", typography: "t5", children: title })
+            }
+          ),
+          open: isOpen,
+          cta: /* @__PURE__ */ jsx2(
+            BottomSheet.CTA,
+            {
+              size: "large",
+              type: "dark",
+              style: "weak",
+              onPress: () => {
+                handleClose();
+              },
+              children: "\uB2EB\uAE30"
+            }
+          ),
+          onClose: handleClose,
+          onExited: exit,
+          children: /* @__PURE__ */ jsx2(List, { rowSeparator: "none", children: itemList.map((item) => {
+            return /* @__PURE__ */ jsx2(
+              ListRow,
+              {
+                left: /* @__PURE__ */ jsx2(
+                  ListRow.Icon,
+                  {
+                    color: globals.brandPrimaryColor,
+                    source: { uri: item.contactIconUrl },
+                    type: "background"
+                  }
+                ),
+                contents: /* @__PURE__ */ jsx2(
+                  ListRow.Texts,
+                  {
+                    type: "1RowTypeA",
+                    top: item.contactItemName,
+                    topProps: { color: adaptive.grey700 }
+                  }
+                ),
+                verticalPadding: "extraSmall",
+                onPress: () => {
+                  logging.menuClick({ title: item.contactItemName });
+                  openURL3(item.contactUri);
+                }
+              },
+              item.contactItemName
+            );
+          }) })
+        }
+      ) });
+    });
+  };
+  return { open: onClickHandler };
+}
+function BottomSheetImpressionArea({ children }) {
+  const logging = useMoreButtonBottomSheetLogging();
+  useEffect4(() => {
+    logging.show();
+  }, [logging]);
+  return /* @__PURE__ */ jsx2(Fragment2, { children });
+}
+
+// src/core/utils/safeParseNavigationBar.ts
+function safeParseNavigationBar(navigationBar) {
+  if (typeof navigationBar === "object") {
+    return navigationBar;
+  }
+  try {
+    return JSON.parse(navigationBar);
+  } catch {
+    return null;
+  }
+}
+
 // src/core/utils/toIcon.ts
 function toIcon(source) {
   return source.startsWith("http") ? { source: { uri: source } } : { name: source };
 }
 
+// src/core/components/BuiltinNavigationBar/index.tsx
+import { Fragment as Fragment3, jsx as jsx3 } from "react/jsx-runtime";
+function BuiltinNavigationBar() {
+  const globals = getAppsInTossGlobals();
+  const { captureExitLog } = useCaptureExitLog();
+  const logging = useBuiltinNavigationBarLogging();
+  const { openConfirm } = useDialog2();
+  const { open: openMoreButtonBottomSheet } = useMoreButtonBottomSheet();
+  const parsedNavigationBar = globals.navigationBar != null ? safeParseNavigationBar(globals.navigationBar) : null;
+  const withHomeButton = parsedNavigationBar?.withHomeButton ?? false;
+  const withBackButton = parsedNavigationBar?.withBackButton ?? true;
+  const initialAccessoryButton = parsedNavigationBar?.initialAccessoryButton;
+  const isExternalWebView = globals.webViewType === "external";
+  const isGameWebView = globals.webViewType === "game";
+  const backEventContext = useBackEventContext();
+  const overrideCanGoBack = !backEventContext.hasBackEvent;
+  const handleBackOrClose = useBackOrCloseNavigation();
+  const navigation = useNavigation();
+  const handlePressTitle = useCallback3(() => {
+    logging.homeButtonClick();
+    if (globals.webViewType != null) {
+      appsInTossEvent.emit("homeIconButtonClickEvent", void 0);
+      return;
+    }
+    navigation.navigate("/");
+  }, [logging, globals.webViewType, navigation]);
+  const handleBack = useCallback3(() => {
+    if (!overrideCanGoBack) {
+      backEventContext.onBack();
+      return;
+    }
+    handleBackOrClose();
+  }, [overrideCanGoBack, handleBackOrClose, backEventContext]);
+  const handleClose = useCallback3(async () => {
+    logging.closeButtonClick();
+    const isConfirmed = await openConfirm({
+      title: `${josa(globals.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());
+      closeView();
+    }
+  }, [captureExitLog, globals.brandDisplayName, logging, openConfirm]);
+  useEffect5(() => {
+    const backHandler = () => {
+      handleClose();
+      return true;
+    };
+    BackHandler.addEventListener("hardwareBackPress", backHandler);
+    return () => {
+      BackHandler.removeEventListener("hardwareBackPress", backHandler);
+    };
+  }, [handleClose]);
+  if (isExternalWebView) {
+    return /* @__PURE__ */ jsx3(Fragment3, {});
+  }
+  return /* @__PURE__ */ jsx3(BuiltinNavigationBarImpressionArea, { withHomeButton, children: /* @__PURE__ */ jsx3(
+    TopNavigation,
+    {
+      title: globals.brandDisplayName,
+      icon: toIcon(globals.brandIcon),
+      onPressDots: openMoreButtonBottomSheet,
+      contentVisible: isGameWebView ? false : true,
+      onPressTitle: withHomeButton ? handlePressTitle : void 0,
+      onPressClose: handleClose,
+      withHome: withHomeButton,
+      fixedRightButton: initialAccessoryButton ? {
+        title: initialAccessoryButton.title,
+        icon: initialAccessoryButton.icon,
+        id: initialAccessoryButton.id
+      } : void 0,
+      children: isGameWebView === false ? /* @__PURE__ */ jsx3(NavigationLeft, { visible: withBackButton, children: /* @__PURE__ */ jsx3(NavigationBackButton, { onPress: handleBack, canGoBack: false }) }) : null
+    }
+  ) });
+}
+function useBackOrCloseNavigation() {
+  const navigation = useNavigation();
+  return useCallback3(() => {
+    if (navigation.canGoBack()) {
+      navigation.goBack();
+    } else {
+      closeView();
+    }
+  }, [navigation]);
+}
+function BuiltinNavigationBarImpressionArea({
+  children,
+  withHomeButton
+}) {
+  const hasLogged = useRef2(false);
+  const logging = useBuiltinNavigationBarLogging();
+  useEffect5(() => {
+    if (hasLogged.current === false) {
+      logging.navBarImpression({ home_icon_yn: withHomeButton ? "Y" : "N" });
+      hasLogged.current = true;
+    }
+  }, []);
+  return /* @__PURE__ */ jsx3(Fragment3, { children });
+}
+
 // src/core/hooks/useAppsInTossBridge.ts
+import { appsInTossEvent as appsInTossEvent2 } from "@apps-in-toss/native-modules";
+import { useBridge } from "@toss-design-system/react-native";
+import { useEffect as useEffect6 } from "react";
 function useAppsInTossBridge() {
   const controller = useBridge();
-  const appsInTossGlobals2 = getAppsInTossGlobals();
-  useEffect4(() => {
+  const appsInTossGlobals = getAppsInTossGlobals();
+  useEffect6(() => {
     const commonProps = {
-      serviceName: appsInTossGlobals2.brandDisplayName,
-      icon: toIcon(appsInTossGlobals2.brandIcon),
-      color: appsInTossGlobals2.brandPrimaryColor,
-      colorMode: appsInTossGlobals2.brandBridgeColorMode
+      serviceName: appsInTossGlobals.brandDisplayName,
+      icon: toIcon(appsInTossGlobals.brandIcon),
+      color: appsInTossGlobals.brandPrimaryColor,
+      colorMode: appsInTossGlobals.brandBridgeColorMode
     };
     controller.open({
       ...commonProps,
       onExited: () => {
-        appsInTossEvent.emit("entryMessageExited", void 0);
+        appsInTossEvent2.emit("entryMessageExited", void 0);
       }
     });
   }, []);
 }
 
 // src/core/registerApp.tsx
-import { Fragment as Fragment2, jsx as jsx2, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx4, jsxs } from "react/jsx-runtime";
 function AppsInTossContainer(Container, { children, ...initialProps }) {
-  if (!isMinVersionSupported({
+  if (!isMinVersionSupported2({
     android: "5.220.0",
     ios: "5.221.0"
   })) {
-    return /* @__PURE__ */ jsxs(Fragment2, { children: [
-      /* @__PURE__ */ jsx2(AppEvent.Entry, {}),
-      /* @__PURE__ */ jsx2(AppEvent.System, { ...initialProps }),
-      /* @__PURE__ */ jsx2(AppUpdate, {})
+    return /* @__PURE__ */ jsxs(Fragment4, { children: [
+      /* @__PURE__ */ jsx4(AppEvent.Entry, {}),
+      /* @__PURE__ */ jsx4(AppEvent.System, { ...initialProps }),
+      /* @__PURE__ */ jsx4(AppUpdate, {})
     ] });
   }
-  return /* @__PURE__ */ jsxs(Fragment2, { children: [
-    /* @__PURE__ */ jsx2(AppEvent.StayTime, {}),
-    /* @__PURE__ */ jsx2(AppEvent.Entry, {}),
-    /* @__PURE__ */ jsx2(AppEvent.System, { ...initialProps }),
-    /* @__PURE__ */ jsx2(Container, { ...initialProps, children: /* @__PURE__ */ jsx2(TDSProvider, { colorPreference: "light", token: { color: { primary: getAppsInTossGlobals().brandPrimaryColor } }, children: /* @__PURE__ */ jsx2(TDSContainer, { ...initialProps, children }) }) })
+  return /* @__PURE__ */ jsxs(Fragment4, { children: [
+    /* @__PURE__ */ jsx4(AppEvent.StayTime, {}),
+    /* @__PURE__ */ jsx4(AppEvent.Entry, {}),
+    /* @__PURE__ */ jsx4(AppEvent.System, { ...initialProps }),
+    /* @__PURE__ */ jsx4(Container, { ...initialProps, children: /* @__PURE__ */ jsx4(TDSProvider, { colorPreference: "light", token: { color: { primary: getAppsInTossGlobals().brandPrimaryColor } }, children: /* @__PURE__ */ jsx4(TDSContainer, { ...initialProps, children }) }) })
   ] });
 }
 function TDSContainer({ children }) {
   useAppsInTossBridge();
-  return /* @__PURE__ */ jsx2(Fragment2, { children });
+  return /* @__PURE__ */ jsx4(Fragment4, { children });
 }
 function registerApp(container, { context, analytics }) {
-  Analytics.init({
-    logger: (params) => void eventLog(params),
-    debug: analytics?.debug ?? __DEV__
-  });
-  const App = Granite3.registerApp(AppsInTossContainer.bind(null, container), {
-    appName: getAppName(),
-    context,
-    setIosSwipeGestureEnabled,
-    router: {
-      screenContainer: Analytics.Screen,
-      defaultScreenOption: {
-        statusBarStyle: "dark"
+  const appName = getAppName();
+  const isRegistered = AppRegistry.getAppKeys().includes(appName);
+  if (!isRegistered) {
+    Analytics.init({
+      logger: (params) => void eventLog(params),
+      debug: analytics?.debug ?? __DEV__
+    });
+    const App = Granite6.registerApp(AppsInTossContainer.bind(null, container), {
+      appName,
+      context,
+      setIosSwipeGestureEnabled,
+      router: {
+        screenContainer: AppsInTossScreenContainer,
+        defaultScreenOption: {
+          statusBarStyle: "dark"
+        }
       }
-    }
-  });
-  global.Page = App;
-  return App;
+    });
+    global.Page = App;
+  }
+  return global.Page;
+}
+function AppsInTossScreenContainer({ children }) {
+  return /* @__PURE__ */ jsxs(Analytics.Screen, { children: [
+    /* @__PURE__ */ jsx4(BuiltinNavigationBar, {}),
+    children
+  ] });
 }
 function getAppName() {
   try {
@@ -244,38 +750,30 @@ var AppsInToss = {
 };
 
 // src/components/WebView.tsx
-import { GoogleAdMob, IAP, Storage, AppsInTossModule, appsInTossEvent as appsInTossEvent3 } from "@apps-in-toss/native-modules";
+import { GoogleAdMob, IAP, Storage, AppsInTossModule, appsInTossEvent as appsInTossEvent4 } from "@apps-in-toss/native-modules";
 import * as appsInTossAsyncBridges from "@apps-in-toss/native-modules/async-bridges";
 import * as appsInTossConstantBridges from "@apps-in-toss/native-modules/constant-bridges";
 import * as appsInTossEventBridges from "@apps-in-toss/native-modules/event-bridges";
 import { getSchemeUri as getSchemeUri5, useGraniteEvent } from "@granite-js/react-native";
 import * as graniteAsyncBridges from "@granite-js/react-native/async-bridges";
 import * as graniteConstantBridges from "@granite-js/react-native/constant-bridges";
-import {
-  ExternalWebViewScreen,
-  PartnerWebViewScreen,
-  tdsEvent,
-  usePartnerNavigation
-} from "@toss-design-system/react-native";
-import { useSafeAreaBottom, useSafeAreaTop as useSafeAreaTop2 } from "@toss-design-system/react-native/private";
-import { useCallback as useCallback5, useEffect as useEffect8, useMemo as useMemo3, useState as useState4 } from "react";
-import { BackHandler as BackHandler2, Platform as Platform6 } from "react-native";
+import { ExternalWebViewScreen, tdsEvent } from "@toss-design-system/react-native";
+import { useSafeAreaBottom, useSafeAreaTop, useTopNavigation } from "@toss-design-system/react-native/private";
+import { useCallback as useCallback6, useEffect as useEffect10, useMemo as useMemo3, useState as useState5 } from "react";
+import { BackHandler as BackHandler2, Platform as Platform3 } from "react-native";
 
 // src/components/GameWebView.tsx
-import { setIosSwipeGestureEnabled as setIosSwipeGestureEnabled2, appsInTossEvent as appsInTossEvent2, getOperationalEnvironment } from "@apps-in-toss/native-modules";
+import { setIosSwipeGestureEnabled as setIosSwipeGestureEnabled2, appsInTossEvent as appsInTossEvent3, getOperationalEnvironment } from "@apps-in-toss/native-modules";
 import {
   WebView as PlainWebView
 } from "@granite-js/native/react-native-webview";
-import { closeView as closeView2 } from "@granite-js/react-native";
-import { useDialog as useDialog2 } from "@toss-design-system/react-native";
-import { josa as josa2 } from "es-hangul";
-import { forwardRef, useCallback as useCallback3, useEffect as useEffect6, useState as useState2 } from "react";
-import { BackHandler, Platform as Platform5 } from "react-native";
+import { forwardRef, useEffect as useEffect8, useState as useState3 } from "react";
+import { Platform as Platform2 } from "react-native";
 
 // src/components/GameProfile.tsx
-import { getGameCenterGameProfile as getGameCenterGameProfile2, isMinVersionSupported as isMinVersionSupported2 } from "@apps-in-toss/native-modules";
+import { getGameCenterGameProfile as getGameCenterGameProfile2, isMinVersionSupported as isMinVersionSupported3 } from "@apps-in-toss/native-modules";
 import { Loader } from "@toss-design-system/react-native";
-import { useEffect as useEffect5 } from "react";
+import { useEffect as useEffect7 } from "react";
 import { Pressable, View } from "react-native";
 
 // src/constant/game-center.ts
@@ -287,21 +785,21 @@ var GAME_CENTER_MIN_VERSION = {
 
 // src/hooks/useGameCenterProfile.ts
 import { getGameCenterGameProfile } from "@apps-in-toss/native-modules";
-import { closeView, openURL as openURL3 } from "@granite-js/react-native";
-import { useDialog } from "@toss-design-system/react-native";
-import { josa } from "es-hangul";
-import { useCallback as useCallback2, useRef as useRef2, useState } from "react";
+import { closeView as closeView2, openURL as openURL5 } from "@granite-js/react-native";
+import { useDialog as useDialog3 } from "@toss-design-system/react-native";
+import { josa as josa2 } from "es-hangul";
+import { useCallback as useCallback4, useRef as useRef3, useState as useState2 } from "react";
 
 // src/components/GameProfileToast.tsx
 import { Asset, Toast } from "@toss-design-system/react-native";
-import { AdaptiveColorProvider, ColorPreferenceProvider, useOverlay } from "@toss-design-system/react-native/private";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { AdaptiveColorProvider, ColorPreferenceProvider, useOverlay as useOverlay2 } from "@toss-design-system/react-native/private";
+import { jsx as jsx5 } from "react/jsx-runtime";
 var useGameProfileToast = () => {
-  const overlay = useOverlay();
+  const overlay = useOverlay2();
   const openGameProfileToast = (nickname, profileImageUri) => {
     return new Promise((resolve) => {
       overlay.open(({ isOpen, close, exit }) => {
-        return /* @__PURE__ */ jsx3(ColorPreferenceProvider, { colorPreference: "dark", children: /* @__PURE__ */ jsx3(AdaptiveColorProvider, { children: /* @__PURE__ */ jsx3(
+        return /* @__PURE__ */ jsx5(ColorPreferenceProvider, { colorPreference: "dark", children: /* @__PURE__ */ jsx5(AdaptiveColorProvider, { children: /* @__PURE__ */ jsx5(
           Toast,
           {
             open: isOpen,
@@ -312,7 +810,7 @@ var useGameProfileToast = () => {
             onExited: exit,
             position: "top",
             text: `${nickname}\uB2D8 \uBC18\uAC00\uC6CC\uC694!`,
-            icon: /* @__PURE__ */ jsx3(
+            icon: /* @__PURE__ */ jsx5(
               Asset.Image,
               {
                 style: { borderRadius: 64, overflow: "hidden" },
@@ -334,16 +832,8 @@ var DEFAULT_ERROR = {
   description: "\uBB38\uC81C\uAC00 \uACC4\uC18D\uB418\uBA74 \uD1A0\uC2A4 \uACE0\uAC1D\uC13C\uD130(1599-4905)\uB85C \uBB38\uC758\uD574\uC8FC\uC138\uC694."
 };
 
-// src/utils/market.ts
-import { Platform } from "react-native";
-var PLAYSTORE_LINK = "https://play.google.com/store/apps/details?id=viva.republica.toss";
-var APPSTORE_LINK = "https://itunes.apple.com/app/id839333328";
-var getMarketLink = () => {
-  return Platform.OS === "android" ? PLAYSTORE_LINK : APPSTORE_LINK;
-};
-
 // src/utils/openTransparentWebView.ts
-import { openURL as openURL2 } from "@granite-js/react-native";
+import { openURL as openURL4 } from "@granite-js/react-native";
 
 // src/private.ts
 import { onVisibilityChangedByTransparentServiceWeb } from "@apps-in-toss/native-modules";
@@ -377,29 +867,29 @@ var openTransparentWebView = ({
       }
     }
   });
-  openURL2(url.toString());
+  openURL4(url.toString());
 };
 
 // src/hooks/useGameCenterProfile.ts
 var useGameCenterProfile = (isReadyForProfileUI) => {
-  const [profileData, setProfileData] = useState(void 0);
-  const [isProfileDataLoading, setIsProfileDataLoading] = useState(true);
-  const [isProfileDataRefetching, setIsProfileDataRefetching] = useState(false);
+  const [profileData, setProfileData] = useState2(void 0);
+  const [isProfileDataLoading, setIsProfileDataLoading] = useState2(true);
+  const [isProfileDataRefetching, setIsProfileDataRefetching] = useState2(false);
   const shouldShowLoadingOverlay = isProfileDataLoading && isReadyForProfileUI;
   const shouldShowProfileNotFoundOverlay = profileData?.statusCode === "PROFILE_NOT_FOUND" && isReadyForProfileUI && !isProfileDataRefetching;
   const canShowBottomSheetOrToast = !isProfileDataLoading && isReadyForProfileUI;
-  const [isWebviewLoading, setIsWebviewLoading] = useState(false);
-  const isCompletedProfileFlow = useRef2(false);
-  const { openAlert, openConfirm } = useDialog();
+  const [isWebviewLoading, setIsWebviewLoading] = useState2(false);
+  const isCompletedProfileFlow = useRef3(false);
+  const { openAlert, openConfirm } = useDialog3();
   const { openGameProfileToast } = useGameProfileToast();
-  const openErrorAlert = useCallback2(async () => {
+  const openErrorAlert = useCallback4(async () => {
     await openAlert({
       title: DEFAULT_ERROR.title,
       description: DEFAULT_ERROR.description
     });
-    closeView();
+    closeView2();
   }, [openAlert]);
-  const openProfileWebview = useCallback2(() => {
+  const openProfileWebview = useCallback4(() => {
     if (isWebviewLoading) {
       return;
     }
@@ -428,9 +918,9 @@ var useGameCenterProfile = (isReadyForProfileUI) => {
       }
     });
   }, [isWebviewLoading, openGameProfileToast, openErrorAlert]);
-  const updateAppToSupportedMinVersion = useCallback2(async () => {
+  const updateAppToSupportedMinVersion = useCallback4(async () => {
     const upddateConfirmDialogLabel = {
-      title: `${josa(getAppsInTossGlobals().brandDisplayName, "\uC744/\uB97C")} \uD558\uB824\uBA74 
+      title: `${josa2(getAppsInTossGlobals().brandDisplayName, "\uC744/\uB97C")} \uD558\uB824\uBA74 
 \uC571\uC744 \uC5C5\uB370\uC774\uD2B8\uD574\uC8FC\uC138\uC694`,
       leftButton: "\uB2EB\uAE30",
       rightButton: "\uC5C5\uB370\uC774\uD2B8\uD558\uAE30"
@@ -442,11 +932,11 @@ var useGameCenterProfile = (isReadyForProfileUI) => {
       closeOnDimmerClick: true
     });
     if (!isConfirmed) {
-      closeView();
+      closeView2();
       return;
     }
     const STORE_SCHEME = getMarketLink();
-    openURL3(`supertoss://web?url=${STORE_SCHEME}&external=browser`);
+    openURL5(`supertoss://web?url=${STORE_SCHEME}&external=browser`);
   }, [openConfirm]);
   return {
     profileData,
@@ -475,7 +965,7 @@ var Z_INDEX = {
 };
 
 // src/components/GameProfile.tsx
-import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
 var GameProfile = ({ children, isReadyForProfileUI }) => {
   const {
     profileData,
@@ -491,7 +981,7 @@ var GameProfile = ({ children, isReadyForProfileUI }) => {
     openErrorAlert,
     openGameProfileToast
   } = useGameCenterProfile(isReadyForProfileUI);
-  useEffect5(() => {
+  useEffect7(() => {
     try {
       const getProfileData = async () => {
         const data = await getGameCenterGameProfile2();
@@ -504,7 +994,7 @@ var GameProfile = ({ children, isReadyForProfileUI }) => {
       setIsProfileDataLoading(false);
     }
   }, []);
-  useEffect5(() => {
+  useEffect7(() => {
     const handleGameProfileFlow = async () => {
       if (!canShowBottomSheetOrToast) {
         return;
@@ -513,7 +1003,7 @@ var GameProfile = ({ children, isReadyForProfileUI }) => {
         return;
       }
       isCompletedProfileFlow.current = true;
-      if (!isMinVersionSupported2(GAME_CENTER_MIN_VERSION)) {
+      if (!isMinVersionSupported3(GAME_CENTER_MIN_VERSION)) {
         updateAppToSupportedMinVersion();
         return;
       }
@@ -534,10 +1024,10 @@ var GameProfile = ({ children, isReadyForProfileUI }) => {
     profileData,
     updateAppToSupportedMinVersion
   ]);
-  if (!isMinVersionSupported2(GAME_CENTER_MIN_VERSION)) {
-    return /* @__PURE__ */ jsxs2(Fragment3, { children: [
-      /* @__PURE__ */ jsx4(View, { style: { flex: 1, position: "relative" }, children }),
-      /* @__PURE__ */ jsx4(
+  if (!isMinVersionSupported3(GAME_CENTER_MIN_VERSION)) {
+    return /* @__PURE__ */ jsxs2(Fragment5, { children: [
+      /* @__PURE__ */ jsx6(View, { style: { flex: 1, position: "relative" }, children }),
+      /* @__PURE__ */ jsx6(
         Pressable,
         {
           style: {
@@ -551,9 +1041,9 @@ var GameProfile = ({ children, isReadyForProfileUI }) => {
     ] });
   }
   if (shouldShowLoadingOverlay || isProfileDataRefetching) {
-    return /* @__PURE__ */ jsxs2(Fragment3, { children: [
-      /* @__PURE__ */ jsx4(View, { style: { flex: 1, position: "relative" }, children }),
-      /* @__PURE__ */ jsx4(
+    return /* @__PURE__ */ jsxs2(Fragment5, { children: [
+      /* @__PURE__ */ jsx6(View, { style: { flex: 1, position: "relative" }, children }),
+      /* @__PURE__ */ jsx6(
         View,
         {
           style: {
@@ -562,15 +1052,15 @@ var GameProfile = ({ children, isReadyForProfileUI }) => {
             alignItems: "center",
             backgroundColor: "rgba(0, 0, 0, 0.2)"
           },
-          children: /* @__PURE__ */ jsx4(Loader, { size: "large", type: "light" })
+          children: /* @__PURE__ */ jsx6(Loader, { size: "large", type: "light" })
         }
       )
     ] });
   }
   if (shouldShowProfileNotFoundOverlay) {
-    return /* @__PURE__ */ jsxs2(Fragment3, { children: [
-      /* @__PURE__ */ jsx4(View, { style: { flex: 1, position: "relative" }, children }),
-      shouldShowProfileNotFoundOverlay && /* @__PURE__ */ jsx4(
+    return /* @__PURE__ */ jsxs2(Fragment5, { children: [
+      /* @__PURE__ */ jsx6(View, { style: { flex: 1, position: "relative" }, children }),
+      shouldShowProfileNotFoundOverlay && /* @__PURE__ */ jsx6(
         Pressable,
         {
           style: {
@@ -583,7 +1073,7 @@ var GameProfile = ({ children, isReadyForProfileUI }) => {
       )
     ] });
   }
-  return /* @__PURE__ */ jsx4(Fragment3, { children: /* @__PURE__ */ jsx4(View, { style: { flex: 1, position: "relative" }, children }) });
+  return /* @__PURE__ */ jsx6(Fragment5, { children: /* @__PURE__ */ jsx6(View, { style: { flex: 1, position: "relative" }, children }) });
 };
 var overlayStyle = {
   position: "absolute",
@@ -594,123 +1084,12 @@ var overlayStyle = {
   zIndex: Z_INDEX.PROFILE_OVERLAY
 };
 
-// src/components/GameWebViewNavigationBar/GameNavigationBar.tsx
-import { SvgXml } from "@granite-js/native/react-native-svg";
-import { PageNavbar } from "@toss-design-system/react-native";
-import { Platform as Platform4, TouchableOpacity, View as View3 } from "react-native";
-
-// src/components/GameWebViewNavigationBar/HeaderRight.tsx
-import { StyleSheet, View as View2 } from "react-native";
-
-// src/components/GameWebViewNavigationBar/byPlatform.ts
-import { Platform as Platform2 } from "react-native";
-function byPlatform({
-  ...props
-}) {
-  return (props[Platform2.OS] ?? props.fallback)();
-}
-
-// src/components/GameWebViewNavigationBar/constants.ts
-var RIGHT_MARGIN = 24;
-var IOS_DEFAULT_MARGIN = 20;
-
-// src/components/GameWebViewNavigationBar/HeaderRight.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
-function IOSHeaderRight(props) {
-  return /* @__PURE__ */ jsx5(View2, { style: styles.ios, ...props });
-}
-function AndroidHeaderRight(props) {
-  return /* @__PURE__ */ jsx5(View2, { style: styles.android, ...props });
-}
-function HeaderRight(props) {
-  return byPlatform({
-    ios: () => /* @__PURE__ */ jsx5(IOSHeaderRight, { ...props }),
-    android: () => /* @__PURE__ */ jsx5(AndroidHeaderRight, { ...props }),
-    fallback: () => /* @__PURE__ */ jsx5(IOSHeaderRight, { ...props })
-  });
-}
-var styles = StyleSheet.create({
-  ios: {
-    marginRight: -IOS_DEFAULT_MARGIN + RIGHT_MARGIN,
-    flexDirection: "row"
-  },
-  android: {
-    flexDirection: "row"
-  }
-});
-
-// src/components/GameWebViewNavigationBar/useSafeAreaTop.ts
-import { useSafeAreaInsets } from "@granite-js/native/react-native-safe-area-context";
-import { Platform as Platform3 } from "react-native";
-function useSafeAreaTop() {
-  const safeAreaInsets = useSafeAreaInsets();
-  const hasDynamicIsland = Platform3.OS === "ios" && safeAreaInsets.top > 50;
-  const safeAreaTop = hasDynamicIsland ? safeAreaInsets.top - 5 : safeAreaInsets.top;
-  return safeAreaTop;
-}
-
-// src/components/GameWebViewNavigationBar/GameNavigationBar.tsx
-import { Fragment as Fragment4, jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
-var originXML = '<svg fill="none" height="30" viewBox="0 0 30 30" width="30" xmlns="https://www.w3.org/2000/svg"><rect fill="#031832" fill-opacity=".46" height="30" rx="15" width="30"/><rect height="29.5" rx="14.75" stroke="#d9d9ff" stroke-opacity=".11" stroke-width=".5" width="29.5" x=".25" y=".25"/><path clip-rule="evenodd" d="m16.5119 15.0014 4.7092-4.7092c.0929-.0928.1666-.2031.2169-.32441.0503-.12134.0762-.25141.0762-.38276.0001-.13136-.0258-.26144-.076-.38281s-.1239-.23166-.2167-.32457c-.0929-.09291-.2031-.16662-.3245-.21692-.1213-.05031-.2514-.07622-.3827-.07626-.1314-.00004-.2615.0258-.3828.07603-.1214.05023-.2317.12388-.3246.21673l-4.7092 4.70997-4.71-4.70997c-.1897-.17718-.4408-.27373-.70034-.26927s-.5072.10959-.69069.2932c-.1835.1836-.28848.43132-.29279.69087-.00432.25954.09238.51057.26968.70017l4.71004 4.7092-4.71004 4.7092c-.1392.1401-.23385.3183-.27204.5121-.0382.1939-.01823.3946.05739.5771s.20351.3386.36759.4486.35702.169.55456.1697c.25583 0 .51164-.0975.70664-.2925l4.71-4.71 4.7092 4.71c.0927.093.2029.1668.3243.2172.1213.0504.2514.0763.3828.0763s.2614-.0259.3828-.0763c.1213-.0504.2315-.1242.3243-.2172.0929-.0929.1667-.2032.217-.3246s.0762-.2515.0762-.3829-.0259-.2616-.0762-.383-.1241-.2317-.217-.3245z" fill="#fdfdfe" fill-opacity=".89" fill-rule="evenodd"/></svg>';
-function GameNavigationBar({ onClose }) {
-  const safeAreaTop = useSafeAreaTop();
-  return /* @__PURE__ */ jsxs3(Fragment4, { children: [
-    /* @__PURE__ */ jsx6(PageNavbar, { preference: { type: "none" } }),
-    /* @__PURE__ */ jsx6(
-      View3,
-      {
-        style: {
-          width: "100%",
-          height: Platform4.OS === "ios" ? 44 : 54,
-          flexDirection: "row",
-          alignItems: "center",
-          justifyContent: "flex-end",
-          position: "absolute",
-          zIndex: Z_INDEX.CLOSE_BUTTON,
-          marginTop: safeAreaTop,
-          paddingRight: Platform4.OS === "ios" ? 10 : 8
-        },
-        pointerEvents: "box-none",
-        children: /* @__PURE__ */ jsx6(HeaderRight, { children: /* @__PURE__ */ jsx6(
-          TouchableOpacity,
-          {
-            hitSlop: { left: 8, right: 8 },
-            accessibilityRole: "button",
-            accessible: true,
-            accessibilityLabel: "\uAC8C\uC784\uC885\uB8CC",
-            style: {
-              padding: Platform4.OS === "ios" ? 7 : 9
-            },
-            onPress: onClose,
-            children: /* @__PURE__ */ jsx6(SvgXml, { xml: originXML, width: 30, height: 30 })
-          }
-        ) })
-      }
-    )
-  ] });
-}
-
 // src/components/GameWebView.tsx
-import { Fragment as Fragment5, jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx7 } from "react/jsx-runtime";
 var GameWebView = forwardRef(function GameWebView2(props, ref) {
-  const { openConfirm } = useDialog2();
-  const { brandDisplayName } = getAppsInTossGlobals();
-  const { captureExitLog } = useCaptureExitLog();
-  const [isEntryMessageExited, setIsEntryMessageExited] = useState2(false);
-  const handleClose = useCallback3(async () => {
-    const isConfirmed = await openConfirm({
-      title: `${josa2(brandDisplayName, "\uC744/\uB97C")} \uC885\uB8CC\uD560\uAE4C\uC694?`,
-      leftButton: "\uCDE8\uC18C",
-      rightButton: "\uC885\uB8CC\uD558\uAE30",
-      closeOnDimmerClick: true
-    });
-    if (isConfirmed) {
-      captureExitLog(Date.now());
-      closeView2();
-    }
-  }, [brandDisplayName, captureExitLog, openConfirm]);
-  useEffect6(() => {
-    if (Platform5.OS === "ios") {
+  const [isEntryMessageExited, setIsEntryMessageExited] = useState3(false);
+  useEffect8(() => {
+    if (Platform2.OS === "ios") {
       setIosSwipeGestureEnabled2({ isEnabled: false });
       return () => {
         setIosSwipeGestureEnabled2({ isEnabled: true });
@@ -718,31 +1097,47 @@ var GameWebView = forwardRef(function GameWebView2(props, ref) {
     }
     return;
   }, []);
-  useEffect6(() => {
-    const backHandler = () => {
-      handleClose();
-      return true;
-    };
-    BackHandler.addEventListener("hardwareBackPress", backHandler);
-    return () => {
-      BackHandler.removeEventListener("hardwareBackPress", backHandler);
-    };
-  }, [handleClose]);
-  useEffect6(() => {
-    appsInTossEvent2.addEventListener("entryMessageExited", {
+  useEffect8(() => {
+    appsInTossEvent3.addEventListener("entryMessageExited", {
       onEvent: () => {
         setIsEntryMessageExited(true);
       }
     });
   }, []);
-  return /* @__PURE__ */ jsxs4(Fragment5, { children: [
-    /* @__PURE__ */ jsx7(GameNavigationBar, { onClose: handleClose }),
-    getOperationalEnvironment() === "toss" ? /* @__PURE__ */ jsx7(GameProfile, { isReadyForProfileUI: isEntryMessageExited, children: /* @__PURE__ */ jsx7(PlainWebView, { ref, ...props }) }) : /* @__PURE__ */ jsx7(PlainWebView, { ref, ...props })
-  ] });
+  return /* @__PURE__ */ jsx7(Fragment6, { children: getOperationalEnvironment() === "toss" ? /* @__PURE__ */ jsx7(GameProfile, { isReadyForProfileUI: isEntryMessageExited, children: /* @__PURE__ */ jsx7(PlainWebView, { ref, ...props }) }) : /* @__PURE__ */ jsx7(PlainWebView, { ref, ...props }) });
 });
 
+// src/components/PartnerWebView.tsx
+import {
+  WebView as PlainWebView2
+} from "@granite-js/native/react-native-webview";
+import { forwardRef as forwardRef2, useRef as useRef4 } from "react";
+
+// 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/components/PartnerWebView.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+var PartnerWebView = forwardRef2(
+  function PartnerWebViewScreen(webViewProps, ref) {
+    const webViewRef = useRef4(null);
+    const refs = mergeRefs(ref, webViewRef);
+    return /* @__PURE__ */ jsx8(PlainWebView2, { ref: refs, ...webViewProps, style: { flex: 1 } });
+  }
+);
+
 // src/bridge-handler/useBridgeHandler.tsx
-import { useCallback as useCallback4, useMemo as useMemo2, useRef as useRef3 } from "react";
+import { useCallback as useCallback5, useMemo as useMemo2, useRef as useRef5 } from "react";
 function serializeError(error) {
   return JSON.stringify(error, (_, value) => {
     if (value instanceof Error) {
@@ -791,7 +1186,7 @@ function useBridgeHandler({
   eventListenerMap,
   injectedJavaScript: originalInjectedJavaScript
 }) {
-  const ref = useRef3(null);
+  const ref = useRef5(null);
   const injectedJavaScript = useMemo2(
     () => [
       `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
@@ -814,11 +1209,12 @@ function useBridgeHandler({
     `);
   };
   const createHandleOnError = (functionName, eventId) => (error) => {
+    const serializedError = serializeError(error);
     ref.current?.injectJavaScript(`
-      window.__GRANITE_NATIVE_EMITTER.emit('${functionName}/onError/${eventId}', ${JSON.stringify(error, null, 0)});
+      window.__GRANITE_NATIVE_EMITTER.emit('${functionName}/onError/${eventId}', ${serializedError});
     `);
   };
-  const $onMessage = useCallback4(
+  const $onMessage = useCallback5(
     async (e) => {
       onMessage?.(e);
       const data = JSON.parse(e.nativeEvent.data);
@@ -1027,11 +1423,11 @@ function useCreateUserAgent({
 // src/hooks/useGeolocation.ts
 import { startUpdateLocation } from "@apps-in-toss/native-modules";
 import { useVisibility as useVisibility3 } from "@granite-js/react-native";
-import { useState as useState3, useEffect as useEffect7 } from "react";
+import { useEffect as useEffect9, useState as useState4 } from "react";
 function useGeolocation({ accuracy, distanceInterval, timeInterval }) {
   const isVisible = useVisibility3();
-  const [location, setLocation] = useState3(null);
-  useEffect7(() => {
+  const [location, setLocation] = useState4(null);
+  useEffect9(() => {
     if (!isVisible) {
       return;
     }
@@ -1098,12 +1494,11 @@ var trackScreen = (url) => {
 };
 
 // src/components/WebView.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
-var appsInTossGlobals = getAppsInTossGlobals();
+import { jsx as jsx9 } from "react/jsx-runtime";
 var operationalEnvironment = appsInTossConstantBridges.getOperationalEnvironment();
 var TYPES = ["partner", "external", "game"];
 var WEBVIEW_TYPES = {
-  partner: PartnerWebViewScreen,
+  partner: PartnerWebView,
   external: ExternalWebViewScreen,
   game: GameWebView
 };
@@ -1135,10 +1530,10 @@ function WebView({ type, local, onMessage, ...props }) {
   }
   const graniteEvent = useGraniteEvent();
   const uri = useMemo3(() => getWebViewUri(local), [local]);
-  const top = useSafeAreaTop2();
+  const top = useSafeAreaTop();
   const bottom = useSafeAreaBottom();
   const global2 = getAppsInTossGlobals();
-  const partner = usePartnerNavigation();
+  const topNavigation = useTopNavigation();
   const disableTextSelectionCSS = `
     (function() {
       const style = document.createElement('style');
@@ -1146,7 +1541,7 @@ function WebView({ type, local, onMessage, ...props }) {
       document.head.appendChild(style);
     })();
   `;
-  const [allowsBackForwardNavigationGestures, setAllowsBackForwardNavigationGestures] = useState4(
+  const [allowsBackForwardNavigationGestures, setAllowsBackForwardNavigationGestures] = useState5(
     props.allowsBackForwardNavigationGestures
   );
   const handler = useBridgeHandler({
@@ -1155,15 +1550,12 @@ function WebView({ type, local, onMessage, ...props }) {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     eventListenerMap: {
       ...appsInTossEventBridges,
-      navigationAccessoryEvent: ({ onEvent, onError }) => tdsEvent.addEventListener("navigationAccessoryEvent", {
-        onEvent,
-        onError
-      }),
+      navigationAccessoryEvent: ({ onEvent, onError }) => tdsEvent.addEventListener("navigationAccessoryEvent", { onEvent, onError }),
       backEvent: ({ onEvent, onError, options }) => graniteEvent.addEventListener("backEvent", { onEvent, onError, options }),
-      entryMessageExited: ({ onEvent, onError }) => appsInTossEvent3.addEventListener("entryMessageExited", { onEvent, onError }),
-      updateLocationEvent: ({ onEvent, onError, options }) => appsInTossEvent3.addEventListener("updateLocationEvent", { onEvent, onError, options }),
+      entryMessageExited: ({ onEvent, onError }) => appsInTossEvent4.addEventListener("entryMessageExited", { onEvent, onError }),
+      updateLocationEvent: ({ onEvent, onError, options }) => appsInTossEvent4.addEventListener("updateLocationEvent", { onEvent, onError, options }),
       /** @internal */
-      appBridgeCallbackEvent: ({ onEvent, onError, options }) => appsInTossEvent3.addEventListener("appBridgeCallbackEvent", { onEvent, onError, options }),
+      appBridgeCallbackEvent: ({ onEvent, onError, options }) => appsInTossEvent4.addEventListener("appBridgeCallbackEvent", { onEvent, onError, options }),
       /** AdMob */
       loadAdMobInterstitialAd: GoogleAdMob.loadAdMobInterstitialAd,
       showAdMobInterstitialAd: GoogleAdMob.showAdMobInterstitialAd,
@@ -1197,10 +1589,18 @@ function WebView({ type, local, onMessage, ...props }) {
         setAllowsBackForwardNavigationGestures(options.isEnabled);
         return appsInTossAsyncBridges.setIosSwipeGestureEnabled(options);
       },
-      addAccessoryButton: async (params) => partner.addAccessoryButton(params),
-      removeAccessoryButton: async () => partner.removeAccessoryButton(),
-      /** internal */
-      openPermissionDialog: AppsInTossModule.openPermissionDialog,
+      addAccessoryButton: async (params) => topNavigation.addAccessoryButton(params),
+      removeAccessoryButton: async () => topNavigation.removeAccessoryButton(),
+      /** permissions */
+      requestPermission: appsInTossAsyncBridges.requestPermission,
+      openPermissionDialog: appsInTossAsyncBridges.openPermissionDialog,
+      getPermission: appsInTossAsyncBridges.getPermission,
+      getClipboardText: appsInTossAsyncBridges.getClipboardText,
+      setClipboardText: appsInTossAsyncBridges.setClipboardText,
+      fetchAlbumPhotos: appsInTossAsyncBridges.fetchAlbumPhotos,
+      fetchContacts: appsInTossAsyncBridges.fetchContacts,
+      getCurrentLocation: appsInTossAsyncBridges.getCurrentLocation,
+      openCamera: appsInTossAsyncBridges.openCamera,
       /** Storage */
       getStorageItem: Storage.getItem,
       setStorageItem: Storage.setItem,
@@ -1211,37 +1611,25 @@ function WebView({ type, local, onMessage, ...props }) {
       iapGetProductItemList: IAP.getProductItemList
     }
   });
-  const baseProps = useMemo3(() => {
-    switch (type) {
-      case "partner": {
-        const headerOnlyProp = {
-          header: {
-            ..."header" in props ? props.header : {},
-            icon: toIcon(ensureValue(appsInTossGlobals.brandIcon, "icon")),
-            title: ensureValue(appsInTossGlobals.brandDisplayName, "displayName")
-          }
-        };
-        return headerOnlyProp;
-      }
-      case "external": {
-        const headerOnlyProp = {
-          header: {
-            ..."header" in props ? props.header : {},
-            icon: toIcon(ensureValue(appsInTossGlobals.brandIcon, "icon")),
-            title: ensureValue(appsInTossGlobals.brandDisplayName, "displayName")
-          }
-        };
-        return headerOnlyProp;
-      }
-      default: {
-        return {};
-      }
+  const headerPropForExternalWebView = useMemo3(() => {
+    const parsedNavigationBar = global2.navigationBar != null ? safeParseNavigationBar(global2.navigationBar) : null;
+    const initialAccessoryButton = parsedNavigationBar?.initialAccessoryButton;
+    const withBackButton = parsedNavigationBar?.withBackButton ?? true;
+    if (type === "external" && initialAccessoryButton != null) {
+      return {
+        header: {
+          withBackButton,
+          title: initialAccessoryButton.title,
+          icon: initialAccessoryButton.icon
+        }
+      };
     }
-  }, [type, props]);
+    return {};
+  }, [global2.navigationBar, type]);
   const BaseWebView = WEBVIEW_TYPES[type];
   const webViewDebuggingEnabled = operationalEnvironment === "sandbox";
-  const [canHistoryGoBack, setCanHistoryGoBack] = useState4(false);
-  const handleNavigationStateChange = useCallback5(
+  const [canHistoryGoBack, setCanHistoryGoBack] = useState5(false);
+  const handleNavigationStateChange = useCallback6(
     (event) => {
       if (event.url) {
         trackScreen(event.url);
@@ -1253,7 +1641,7 @@ function WebView({ type, local, onMessage, ...props }) {
   const userAgent = useCreateUserAgent({
     colorPreference: "light"
   });
-  const handleBackEvent = useCallback5(() => {
+  const handleBackEvent = useCallback6(() => {
     if (canHistoryGoBack) {
       handler.ref.current?.goBack();
       return true;
@@ -1261,16 +1649,28 @@ function WebView({ type, local, onMessage, ...props }) {
       return false;
     }
   }, [canHistoryGoBack, handler]);
-  useEffect8(() => {
+  useEffect10(() => {
     BackHandler2.addEventListener("hardwareBackPress", handleBackEvent);
     return () => BackHandler2.removeEventListener("hardwareBackPress", handleBackEvent);
   }, [handleBackEvent]);
-  return /* @__PURE__ */ jsx8(
+  useEffect10(() => {
+    return appsInTossEvent4.addEventListener("homeIconButtonClickEvent", {
+      onEvent: () => {
+        handler.ref?.current?.injectJavaScript(`
+          (function() {
+          window.history.replaceState(null, '', '/');
+          true;
+          })();
+        `);
+      }
+    });
+  }, [handler.ref]);
+  return /* @__PURE__ */ jsx9(
     BaseWebView,
     {
       ref: handler.ref,
       ...props,
-      ...baseProps,
+      ...headerPropForExternalWebView,
       source: {
         uri,
         // NOTE: https://github.com/react-native-webview/react-native-webview/pull/3133
@@ -1278,7 +1678,7 @@ function WebView({ type, local, onMessage, ...props }) {
           "User-Agent": userAgent
         }
       },
-      userAgent: Platform6.OS === "ios" ? userAgent : void 0,
+      userAgent: Platform3.OS === "ios" ? userAgent : void 0,
       sharedCookiesEnabled: true,
       webviewDebuggingEnabled: webViewDebuggingEnabled,
       thirdPartyCookiesEnabled: true,
@@ -1286,21 +1686,17 @@ function WebView({ type, local, onMessage, ...props }) {
       onNavigationStateChange: handleNavigationStateChange,
       injectedJavaScript: handler.injectedJavaScript,
       injectedJavaScriptBeforeContentLoaded: handler.injectedJavaScript,
-      decelerationRate: Platform6.OS === "ios" ? 1 : void 0,
+      decelerationRate: Platform3.OS === "ios" ? 1 : void 0,
       allowsBackForwardNavigationGestures
     }
   );
 }
-function ensureValue(value, name) {
-  if (value === void 0) {
-    throw new Error(`${name} is required`);
-  }
-  return value;
-}
 
 // src/index.ts
 export * from "@apps-in-toss/analytics";
+import { useTopNavigation as useTopNavigation2 } from "@toss-design-system/react-native/private";
 export * from "@apps-in-toss/native-modules";
+export * from "@apps-in-toss/types";
 var Analytics2 = {
   init: InternalAnalytics.init,
   Impression: InternalAnalytics.Impression,
@@ -1314,5 +1710,6 @@ export {
   WebView,
   env,
   useCreateUserAgent,
-  useGeolocation
+  useGeolocation,
+  useTopNavigation2 as useTopNavigation
 };