@apps-in-toss/framework 0.0.19 → 0.0.20

package/dist/index.cjs

@@ -41,6 +41,7 @@ __export(src_exports, {
   fetchContacts: () => fetchContacts,
   getClipboardText: () => getClipboardText,
   getCurrentLocation: () => getCurrentLocation,
+  getDeviceId: () => getDeviceId,
   getOperationalEnvironment: () => getOperationalEnvironment,
   getTossAppVersion: () => getTossAppVersion,
   openCamera: () => openCamera,
@@ -289,6 +290,11 @@ function getTossAppVersion() {
   return AppsInTossModule.tossAppVersion;
 }
 
+// src/native-modules/getDeviceId.ts
+function getDeviceId() {
+  return AppsInTossModule.deviceId;
+}
+
 // src/native-modules/storage.ts
 function getItem(key) {
   return AppsInTossModule.getStorageItem({ key });
@@ -329,6 +335,7 @@ var bedrockConstantBridges = __toESM(require("react-native-bedrock/constant-brid
 // src/components/GameWebView.tsx
 var import_react_native_webview = require("@react-native-bedrock/native/react-native-webview");
 var import_react_native10 = require("@toss-design-system/react-native");
+var import_es_hangul = require("es-hangul");
 var import_react2 = require("react");
 var import_react_native11 = require("react-native");
 var import_react_native_bedrock4 = require("react-native-bedrock");
@@ -416,7 +423,7 @@ function GameNavigationBar({ onClose }) {
             hitSlop: { left: 8, right: 8 },
             accessibilityRole: "button",
             accessible: true,
-            accessibilityLabel: "\uB2EB\uAE30",
+            accessibilityLabel: "\uAC8C\uC784\uC885\uB8CC",
             style: {
               padding: import_react_native9.Platform.OS === "ios" ? 7 : 9
             },
@@ -434,6 +441,17 @@ var import_jsx_runtime4 = require("react/jsx-runtime");
 var GameWebView = (0, import_react2.forwardRef)(function GameWebView2(props, ref) {
   const { openConfirm } = (0, import_react_native10.useDialog)();
   const { brandDisplayName } = getAppsInTossGlobals();
+  const handleClose = (0, import_react2.useCallback)(async () => {
+    const isConfirmed = await openConfirm({
+      title: `${(0, import_es_hangul.josa)(brandDisplayName, "\uC744/\uB97C")} \uC885\uB8CC\uD560\uAE4C\uC694?`,
+      leftButton: "\uCDE8\uC18C",
+      rightButton: "\uC885\uB8CC\uD558\uAE30",
+      closeOnDimmerClick: true
+    });
+    if (isConfirmed) {
+      (0, import_react_native_bedrock4.closeView)();
+    }
+  }, [brandDisplayName, openConfirm]);
   (0, import_react2.useEffect)(() => {
     if (import_react_native11.Platform.OS === "ios") {
       (0, import_react_native_bedrock4.setIosSwipeGestureEnabled)({ isEnabled: false });
@@ -443,23 +461,18 @@ var GameWebView = (0, import_react2.forwardRef)(function GameWebView2(props, ref
     }
     return;
   }, []);
+  (0, import_react2.useEffect)(() => {
+    const backHandler = () => {
+      handleClose();
+      return true;
+    };
+    import_react_native11.BackHandler.addEventListener("hardwareBackPress", backHandler);
+    return () => {
+      import_react_native11.BackHandler.removeEventListener("hardwareBackPress", backHandler);
+    };
+  }, [handleClose]);
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      GameNavigationBar,
-      {
-        onClose: async () => {
-          const isConfirmed = await openConfirm({
-            title: `${brandDisplayName}\uC744 \uC885\uB8CC\uD560\uAE4C\uC694?`,
-            leftButton: "\uCDE8\uC18C",
-            rightButton: "\uC885\uB8CC\uD558\uAE30",
-            closeOnDimmerClick: true
-          });
-          if (isConfirmed) {
-            (0, import_react_native_bedrock4.closeView)();
-          }
-        }
-      }
-    ),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(GameNavigationBar, { onClose: handleClose }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native11.View, { style: { flex: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native_webview.WebView, { ref, ...props }) })
   ] });
 });
@@ -481,6 +494,7 @@ __export(async_bridges_exports, {
 // src/constant-bridges.ts
 var constant_bridges_exports = {};
 __export(constant_bridges_exports, {
+  getDeviceId: () => getDeviceId,
   getOperationalEnvironment: () => getOperationalEnvironment,
   getTossAppVersion: () => getTossAppVersion
 });
@@ -531,13 +545,17 @@ function WebView({ type, local, onMessage, ...props }) {
   if (!TYPES.includes(type)) {
     throw new Error(`Invalid WebView type: '${type}'`);
   }
+  const bedrockEvent = (0, import_react_native_bedrock5.useBedrockEvent)();
   const uri = (0, import_react3.useMemo)(() => getWebViewUri(local), [local]);
   const top = (0, import_private.useSafeAreaTop)();
   const bottom = (0, import_private.useSafeAreaBottom)();
   const handler = (0, import_react_native_bedrock5.useBridgeHandler)({
     onMessage,
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    eventListenerMap: event_bridges_exports,
+    eventListenerMap: {
+      ...event_bridges_exports,
+      backEvent: ({ onEvent, onError, options }) => bedrockEvent.addEventListener("backEvent", { onEvent, onError, options })
+    },
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-expect-error
     constantHandlerMap: {
@@ -551,7 +569,7 @@ function WebView({ type, local, onMessage, ...props }) {
     asyncHandlerMap: {
       ...bedrockAsyncBridges,
       ...async_bridges_exports,
-      // internal
+      /** internal */
       openPermissionDialog: AppsInTossModule.openPermissionDialog,
       /** Storage */
       getStorageItem: Storage.getItem,
@@ -663,6 +681,7 @@ var Accuracy2 = /* @__PURE__ */ ((Accuracy3) => {
   fetchContacts,
   getClipboardText,
   getCurrentLocation,
+  getDeviceId,
   getOperationalEnvironment,
   getTossAppVersion,
   openCamera,

package/dist/index.d.cts

@@ -1057,6 +1057,36 @@ declare function getOperationalEnvironment(): 'toss' | 'sandbox';
  */
 declare function getTossAppVersion(): string;
 
+/**
+ * @public
+ * @category 환경 확인
+ * @kind function
+ * @name getDeviceId
+ * @description
+ * 사용 중인 기기의 고유 식별자를 문자열로 반환해요.
+ *
+ * 이 함수는 현재 사용 중인 기기의 고유 식별자를 문자열로 반환해요. 기기별로 설정이나 데이터를 저장하거나 사용자의 기기를 식별해서 로그를 기록하고 분석하는 데 사용할 수 있어요. 같은 사용자의 여러 기기를 구분하는 데도 유용해요.
+ *
+ * @returns {string} 기기의 고유 식별자를 나타내는 문자열이에요.
+ *
+ * @example
+ * ### 기기 고유 식별자 가져오기
+ *
+ * ```tsx
+ * import { getDeviceId } from '@apps-in-toss/framework';
+ * import { Text } from 'react-native';
+ *
+ * function MyPage() {
+ *   const id = getDeviceId();
+ *
+ *   return (
+ *     <Text>사용자의 기기 고유 식별자: {id}</Text>
+ *   );
+ * }
+ * ```
+ */
+declare function getDeviceId(): string;
+
 /**
  * @public
  * @category 저장소
@@ -1226,4 +1256,4 @@ declare const env: {
     getDeploymentId: () => string | undefined;
 };
 
-export { Accuracy, AppsInToss, type ContactEntity, type ExternalWebViewProps, type FetchAlbumPhotosOptions, type GameWebViewProps, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type PartnerWebViewProps, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, Storage, TossPay, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getOperationalEnvironment, getTossAppVersion, openCamera, setClipboardText, startUpdateLocation, useGeolocation };
+export { Accuracy, AppsInToss, type ContactEntity, type ExternalWebViewProps, type FetchAlbumPhotosOptions, type GameWebViewProps, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type PartnerWebViewProps, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, Storage, TossPay, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getDeviceId, getOperationalEnvironment, getTossAppVersion, openCamera, setClipboardText, startUpdateLocation, useGeolocation };

package/dist/index.d.ts

@@ -1057,6 +1057,36 @@ declare function getOperationalEnvironment(): 'toss' | 'sandbox';
  */
 declare function getTossAppVersion(): string;
 
+/**
+ * @public
+ * @category 환경 확인
+ * @kind function
+ * @name getDeviceId
+ * @description
+ * 사용 중인 기기의 고유 식별자를 문자열로 반환해요.
+ *
+ * 이 함수는 현재 사용 중인 기기의 고유 식별자를 문자열로 반환해요. 기기별로 설정이나 데이터를 저장하거나 사용자의 기기를 식별해서 로그를 기록하고 분석하는 데 사용할 수 있어요. 같은 사용자의 여러 기기를 구분하는 데도 유용해요.
+ *
+ * @returns {string} 기기의 고유 식별자를 나타내는 문자열이에요.
+ *
+ * @example
+ * ### 기기 고유 식별자 가져오기
+ *
+ * ```tsx
+ * import { getDeviceId } from '@apps-in-toss/framework';
+ * import { Text } from 'react-native';
+ *
+ * function MyPage() {
+ *   const id = getDeviceId();
+ *
+ *   return (
+ *     <Text>사용자의 기기 고유 식별자: {id}</Text>
+ *   );
+ * }
+ * ```
+ */
+declare function getDeviceId(): string;
+
 /**
  * @public
  * @category 저장소
@@ -1226,4 +1256,4 @@ declare const env: {
     getDeploymentId: () => string | undefined;
 };
 
-export { Accuracy, AppsInToss, type ContactEntity, type ExternalWebViewProps, type FetchAlbumPhotosOptions, type GameWebViewProps, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type PartnerWebViewProps, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, Storage, TossPay, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getOperationalEnvironment, getTossAppVersion, openCamera, setClipboardText, startUpdateLocation, useGeolocation };
+export { Accuracy, AppsInToss, type ContactEntity, type ExternalWebViewProps, type FetchAlbumPhotosOptions, type GameWebViewProps, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type PartnerWebViewProps, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, Storage, TossPay, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getDeviceId, getOperationalEnvironment, getTossAppVersion, openCamera, setClipboardText, startUpdateLocation, useGeolocation };

package/dist/index.js

@@ -243,6 +243,11 @@ function getTossAppVersion() {
   return AppsInTossModule.tossAppVersion;
 }
 
+// src/native-modules/getDeviceId.ts
+function getDeviceId() {
+  return AppsInTossModule.deviceId;
+}
+
 // src/native-modules/storage.ts
 function getItem(key) {
   return AppsInTossModule.getStorageItem({ key });
@@ -279,7 +284,7 @@ import {
 } from "@toss-design-system/react-native";
 import { useSafeAreaBottom, useSafeAreaTop as useSafeAreaTop2 } from "@toss-design-system/react-native/private";
 import { useMemo } from "react";
-import { getSchemeUri, useBridgeHandler } from "react-native-bedrock";
+import { getSchemeUri, useBridgeHandler, useBedrockEvent } from "react-native-bedrock";
 import * as bedrockAsyncBridges from "react-native-bedrock/async-bridges";
 import * as bedrockConstantBridges from "react-native-bedrock/constant-bridges";
 
@@ -288,8 +293,9 @@ import {
   WebView as PlainWebView
 } from "@react-native-bedrock/native/react-native-webview";
 import { useDialog } from "@toss-design-system/react-native";
-import { forwardRef, useEffect as useEffect2 } from "react";
-import { Platform as Platform4, View as View3 } from "react-native";
+import { josa } from "es-hangul";
+import { forwardRef, useCallback, useEffect as useEffect2 } from "react";
+import { BackHandler, Platform as Platform4, View as View3 } from "react-native";
 import { closeView, setIosSwipeGestureEnabled } from "react-native-bedrock";
 
 // src/components/GameWebViewNavigationBar/GameNavigationBar.tsx
@@ -375,7 +381,7 @@ function GameNavigationBar({ onClose }) {
             hitSlop: { left: 8, right: 8 },
             accessibilityRole: "button",
             accessible: true,
-            accessibilityLabel: "\uB2EB\uAE30",
+            accessibilityLabel: "\uAC8C\uC784\uC885\uB8CC",
             style: {
               padding: Platform3.OS === "ios" ? 7 : 9
             },
@@ -393,6 +399,17 @@ import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-run
 var GameWebView = forwardRef(function GameWebView2(props, ref) {
   const { openConfirm } = useDialog();
   const { brandDisplayName } = getAppsInTossGlobals();
+  const handleClose = useCallback(async () => {
+    const isConfirmed = await openConfirm({
+      title: `${josa(brandDisplayName, "\uC744/\uB97C")} \uC885\uB8CC\uD560\uAE4C\uC694?`,
+      leftButton: "\uCDE8\uC18C",
+      rightButton: "\uC885\uB8CC\uD558\uAE30",
+      closeOnDimmerClick: true
+    });
+    if (isConfirmed) {
+      closeView();
+    }
+  }, [brandDisplayName, openConfirm]);
   useEffect2(() => {
     if (Platform4.OS === "ios") {
       setIosSwipeGestureEnabled({ isEnabled: false });
@@ -402,23 +419,18 @@ var GameWebView = forwardRef(function GameWebView2(props, ref) {
     }
     return;
   }, []);
+  useEffect2(() => {
+    const backHandler = () => {
+      handleClose();
+      return true;
+    };
+    BackHandler.addEventListener("hardwareBackPress", backHandler);
+    return () => {
+      BackHandler.removeEventListener("hardwareBackPress", backHandler);
+    };
+  }, [handleClose]);
   return /* @__PURE__ */ jsxs2(Fragment3, { children: [
-    /* @__PURE__ */ jsx4(
-      GameNavigationBar,
-      {
-        onClose: async () => {
-          const isConfirmed = await openConfirm({
-            title: `${brandDisplayName}\uC744 \uC885\uB8CC\uD560\uAE4C\uC694?`,
-            leftButton: "\uCDE8\uC18C",
-            rightButton: "\uC885\uB8CC\uD558\uAE30",
-            closeOnDimmerClick: true
-          });
-          if (isConfirmed) {
-            closeView();
-          }
-        }
-      }
-    ),
+    /* @__PURE__ */ jsx4(GameNavigationBar, { onClose: handleClose }),
     /* @__PURE__ */ jsx4(View3, { style: { flex: 1 }, children: /* @__PURE__ */ jsx4(PlainWebView, { ref, ...props }) })
   ] });
 });
@@ -440,6 +452,7 @@ __export(async_bridges_exports, {
 // src/constant-bridges.ts
 var constant_bridges_exports = {};
 __export(constant_bridges_exports, {
+  getDeviceId: () => getDeviceId,
   getOperationalEnvironment: () => getOperationalEnvironment,
   getTossAppVersion: () => getTossAppVersion
 });
@@ -490,13 +503,17 @@ function WebView({ type, local, onMessage, ...props }) {
   if (!TYPES.includes(type)) {
     throw new Error(`Invalid WebView type: '${type}'`);
   }
+  const bedrockEvent = useBedrockEvent();
   const uri = useMemo(() => getWebViewUri(local), [local]);
   const top = useSafeAreaTop2();
   const bottom = useSafeAreaBottom();
   const handler = useBridgeHandler({
     onMessage,
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    eventListenerMap: event_bridges_exports,
+    eventListenerMap: {
+      ...event_bridges_exports,
+      backEvent: ({ onEvent, onError, options }) => bedrockEvent.addEventListener("backEvent", { onEvent, onError, options })
+    },
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-expect-error
     constantHandlerMap: {
@@ -510,7 +527,7 @@ function WebView({ type, local, onMessage, ...props }) {
     asyncHandlerMap: {
       ...bedrockAsyncBridges,
       ...async_bridges_exports,
-      // internal
+      /** internal */
       openPermissionDialog: AppsInTossModule.openPermissionDialog,
       /** Storage */
       getStorageItem: Storage.getItem,
@@ -621,6 +638,7 @@ export {
   fetchContacts,
   getClipboardText,
   getCurrentLocation,
+  getDeviceId,
   getOperationalEnvironment,
   getTossAppVersion,
   openCamera,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@apps-in-toss/framework",
   "type": "module",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "description": "The framework for Apps In Toss",
   "scripts": {
     "prepack": "yarn build",
@@ -56,13 +56,14 @@
     "ait": "./bin/ait.js"
   },
   "dependencies": {
-    "@apps-in-toss/cli": "0.0.19",
-    "@apps-in-toss/plugins": "0.0.19"
+    "@apps-in-toss/cli": "0.0.20",
+    "@apps-in-toss/plugins": "0.0.20",
+    "es-hangul": "^2.3.2"
   },
   "devDependencies": {
-    "@react-native-bedrock/mpack-next": "0.0.17",
-    "@react-native-bedrock/native": "0.0.17",
-    "@toss-design-system/react-native": "^0.4.1",
+    "@react-native-bedrock/mpack-next": "0.0.19",
+    "@react-native-bedrock/native": "0.0.19",
+    "@toss-design-system/react-native": "^0.5.0",
     "@types/kill-port": "^2.0.1",
     "@types/react": "18.3.3",
     "@types/yauzl": "^2.10.3",
@@ -72,7 +73,7 @@
     "kill-port": "^2.0.1",
     "react": "18.2.0",
     "react-native": "0.72.6",
-    "react-native-bedrock": "0.0.17",
+    "react-native-bedrock": "0.0.19",
     "tsup": "^8.3.5",
     "typescript": "4.9.5",
     "vitest": "^3.0.3",
@@ -80,15 +81,15 @@
     "yauzl": "^3.2.0"
   },
   "peerDependencies": {
-    "@react-native-bedrock/native": "*",
-    "@toss-design-system/react-native": "^0.4.1",
+    "@react-native-bedrock/native": ">= 0.0.18",
+    "@toss-design-system/react-native": ">= 0.5.0",
     "@types/react": "*",
     "react": "*",
     "react-native": "*",
-    "react-native-bedrock": "*"
+    "react-native-bedrock": ">= 0.0.18"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "205a7b9571d501f2b64c9b6ad80cae377baec49d"
+  "gitHead": "5c967237d66e19465d53f6ed842fe9c4f39b768f"
 }

package/src/constant-bridges.ts

@@ -1,2 +1,3 @@
 export * from './native-modules/getOperationalEnvironment.js';
 export * from './native-modules/getTossAppVersion.js';
+export * from './native-modules/getDeviceId.js';