@apps-in-toss/framework 0.0.20 → 0.0.22

package/dist/index.cjs

@@ -44,6 +44,7 @@ __export(src_exports, {
   getDeviceId: () => getDeviceId,
   getOperationalEnvironment: () => getOperationalEnvironment,
   getTossAppVersion: () => getTossAppVersion,
+  getTossShareLink: () => getTossShareLink,
   openCamera: () => openCamera,
   setClipboardText: () => setClipboardText,
   startUpdateLocation: () => startUpdateLocation,
@@ -99,7 +100,10 @@ function TDSContainer({ children }) {
 function registerApp(container, { context }) {
   return import_react_native_bedrock.Bedrock.registerApp(AppsInTossContainer.bind(null, container), {
     appName: getAppName(),
-    context
+    context,
+    defaultScreenOption: {
+      statusBarStyle: "dark"
+    }
   });
 }
 function getAppName() {
@@ -318,6 +322,15 @@ var Storage = {
   clearItems
 };
 
+// src/native-modules/getTossShareLink.ts
+async function getTossShareLink(path) {
+  const { shareLink } = await AppsInTossModule.getTossShareLink({});
+  const shareUrl = new URL(shareLink);
+  shareUrl.searchParams.set("deep_link_value", path);
+  shareUrl.searchParams.set("af_dp", path);
+  return shareUrl.toString();
+}
+
 // src/native-modules/index.ts
 var TossPay = {
   checkoutPayment,
@@ -327,7 +340,7 @@ var TossPay = {
 // src/components/WebView.tsx
 var import_react_native12 = require("@toss-design-system/react-native");
 var import_private = require("@toss-design-system/react-native/private");
-var import_react3 = require("react");
+var import_react4 = require("react");
 var import_react_native_bedrock5 = require("react-native-bedrock");
 var bedrockAsyncBridges = __toESM(require("react-native-bedrock/async-bridges"), 1);
 var bedrockConstantBridges = __toESM(require("react-native-bedrock/constant-bridges"), 1);
@@ -487,10 +500,137 @@ __export(async_bridges_exports, {
   fetchContacts: () => fetchContacts,
   getClipboardText: () => getClipboardText,
   getCurrentLocation: () => getCurrentLocation,
+  getTossShareLink: () => getTossShareLink,
   openCamera: () => openCamera,
   setClipboardText: () => setClipboardText
 });
 
+// src/bridge-handler/useBridgeHandler.tsx
+var import_react3 = require("react");
+function serializeError(error) {
+  return JSON.stringify(error, (_, value) => {
+    if (value instanceof Error) {
+      return {
+        name: value.name,
+        message: value.message,
+        stack: value.stack,
+        __isError: true
+      };
+    }
+    return value;
+  });
+}
+function methodHandler({
+  args,
+  eventId,
+  functionName,
+  handlerMap,
+  injectJavaScript
+}) {
+  const func = async (...args2) => {
+    const result = await handlerMap[functionName](...args2);
+    return result;
+  };
+  if (!func) {
+    console.error(`${functionName} is not a function`);
+    return;
+  }
+  func(...args).then((result) => {
+    injectJavaScript?.(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/resolve/${eventId}', ${JSON.stringify(result, null, 0)});
+    `);
+  }).catch((error) => {
+    const serializedError = serializeError(error);
+    injectJavaScript?.(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/reject/${eventId}', ${serializedError});
+    `);
+  });
+}
+var globalEventListenerMap = /* @__PURE__ */ new Map();
+function useBridgeHandler({
+  onMessage,
+  constantHandlerMap,
+  asyncHandlerMap,
+  eventListenerMap,
+  injectedJavaScript: originalInjectedJavaScript
+}) {
+  const ref = (0, import_react3.useRef)(null);
+  const injectedJavaScript = (0, import_react3.useMemo)(
+    () => [
+      `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
+        Object.entries(constantHandlerMap).reduce(
+          (acc, [key, value]) => {
+            acc[key] = typeof value === "function" ? value() : value;
+            return acc;
+          },
+          {}
+        )
+      )}`,
+      originalInjectedJavaScript,
+      "true"
+    ].join("\n"),
+    [constantHandlerMap, originalInjectedJavaScript]
+  );
+  const createHandleOnEvent = (functionName, eventId) => (response) => {
+    ref.current?.injectJavaScript(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/onEvent/${eventId}', ${JSON.stringify(response, null, 0)});
+    `);
+  };
+  const createHandleOnError = (functionName, eventId) => (error) => {
+    ref.current?.injectJavaScript(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/onError/${eventId}', ${JSON.stringify(error, null, 0)});
+    `);
+  };
+  const $onMessage = (0, import_react3.useCallback)(
+    async (e) => {
+      onMessage?.(e);
+      const data = JSON.parse(e.nativeEvent.data);
+      if (typeof data !== "object" || data === null || typeof data.functionName !== "string" || typeof data.eventId !== "string" || typeof data.type !== "string" || !["addEventListener", "removeEventListener", "method"].includes(data.type)) {
+        return;
+      }
+      switch (data.type) {
+        case "addEventListener": {
+          const handleOnEvent = createHandleOnEvent(data.functionName, data.eventId);
+          const handleOnError = createHandleOnError(data.functionName, data.eventId);
+          const remove = eventListenerMap[data.functionName]?.({
+            onEvent: handleOnEvent,
+            onError: handleOnError,
+            options: data.args
+          });
+          if (remove) {
+            globalEventListenerMap.set(`${data.functionName}/${data.eventId}`, remove);
+          }
+          break;
+        }
+        case "removeEventListener": {
+          const key = `${data.functionName}/${data.eventId}`;
+          const remove = globalEventListenerMap.get(key);
+          remove?.();
+          globalEventListenerMap.delete(key);
+          break;
+        }
+        case "method": {
+          methodHandler({
+            args: data.args,
+            eventId: data.eventId,
+            functionName: data.functionName,
+            handlerMap: asyncHandlerMap,
+            injectJavaScript: ref.current?.injectJavaScript
+          });
+          break;
+        }
+      }
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [onMessage]
+  );
+  return {
+    ref,
+    injectedJavaScript,
+    onMessage: $onMessage
+  };
+}
+
 // src/constant-bridges.ts
 var constant_bridges_exports = {};
 __export(constant_bridges_exports, {
@@ -546,10 +686,10 @@ function WebView({ type, local, onMessage, ...props }) {
     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 uri = (0, import_react4.useMemo)(() => getWebViewUri(local), [local]);
   const top = (0, import_private.useSafeAreaTop)();
   const bottom = (0, import_private.useSafeAreaBottom)();
-  const handler = (0, import_react_native_bedrock5.useBridgeHandler)({
+  const handler = useBridgeHandler({
     onMessage,
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     eventListenerMap: {
@@ -578,7 +718,7 @@ function WebView({ type, local, onMessage, ...props }) {
       clearItems: Storage.clearItems
     }
   });
-  const baseProps = (0, import_react3.useMemo)(() => {
+  const baseProps = (0, import_react4.useMemo)(() => {
     switch (type) {
       case "partner": {
         const headerOnlyProp = {
@@ -608,7 +748,7 @@ function WebView({ type, local, onMessage, ...props }) {
     }
   }, [type, props]);
   const BaseWebView = WEBVIEW_TYPES[type];
-  const webviewDebuggingEnabled = (0, import_react3.useMemo)(
+  const webviewDebuggingEnabled = (0, import_react4.useMemo)(
     () => getOperationalEnvironment() === "sandbox",
     []
   );
@@ -636,12 +776,12 @@ function ensureValue(value, name) {
 }
 
 // src/hooks/useGeolocation.ts
-var import_react4 = require("react");
+var import_react5 = require("react");
 var import_react_native_bedrock6 = require("react-native-bedrock");
 function useGeolocation({ accuracy, distanceInterval, timeInterval }) {
   const isVisible = (0, import_react_native_bedrock6.useVisibility)();
-  const [location, setLocation] = (0, import_react4.useState)(null);
-  (0, import_react4.useEffect)(() => {
+  const [location, setLocation] = (0, import_react5.useState)(null);
+  (0, import_react5.useEffect)(() => {
     if (!isVisible) {
       return;
     }
@@ -684,6 +824,7 @@ var Accuracy2 = /* @__PURE__ */ ((Accuracy3) => {
   getDeviceId,
   getOperationalEnvironment,
   getTossAppVersion,
+  getTossShareLink,
   openCamera,
   setClipboardText,
   startUpdateLocation,

package/dist/index.d.cts

@@ -70,7 +70,7 @@ interface Location {
      */
     timestamp: number;
     /**
-     * @description 위치 정보를 나타내는 객체예요. 자세한 내용은 [LocationCoords](/reference/framework/Types/LocationCoords.html)을 참고해주세요.
+     * @description 위치 정보를 나타내는 객체예요. 자세한 내용은 [LocationCoords](/react-native/reference/framework/Types/LocationCoords.html)을 참고해주세요.
      */
     coords: LocationCoords;
 }
@@ -154,7 +154,7 @@ interface UpdateLocationEventEmitter extends EventEmitterSchema<'updateLocation'
  * @param {number} [options.accuracy] 위치 정확도를 설정해요.
  * @param {number} [options.timeInterval] 위치 정보를 업데이트하는 최소 주기로, 단위는 밀리초(ms)예요. 이 값은 위치 업데이트가 발생하는 가장 짧은 간격을 설정하지만, 시스템이나 환경의 영향을 받아 지정한 주기보다 더 긴 간격으로 업데이트될 수 있어요.
  * @param {number} [options.distanceInterval] 위치 변경 거리를 미터(m) 단위로 설정해요.
- * @param {(location: Location) => void} [options.callback] 위치 정보가 변경될 때 호출되는 콜백 함수예요. 자세한 내용은 [Location](/reference/framework/Types/Location.html)을 참고해주세요.
+ * @param {(location: Location) => void} [options.callback] 위치 정보가 변경될 때 호출되는 콜백 함수예요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
  *
  * @example
  * ### 위치 정보 변경 감지하기
@@ -858,7 +858,7 @@ interface GetCurrentLocationOptions {
  *
  * @param {GetCurrentLocationOptions} options 위치 정보를 가져올 때 사용하는 옵션 객체예요.
  * @param {Accuracy} [options.accuracy] 위치 정보의 정확도 수준이에요. 정확도는 `Accuracy` 타입으로 설정돼요.
- * @returns {Promise<Location>} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/reference/framework/Types/Location.html)을 참고해주세요.
+ * @returns {Promise<Location>} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
  *
  * @example
  * ### 디바이스의 현재 위치 정보 가져오기
@@ -1171,6 +1171,36 @@ declare const Storage: {
     clearItems: typeof clearItems;
 };
 
+/**
+ * @public
+ * @category 공유
+ * @kind function
+ * @name getTossShareLink
+ * @description
+ * `getTossShareLink` 함수는 사용자가 지정한 경로를 토스 앱에서 열 수 공유 링크를 반환해요.
+ * 이 링크를 다른 사람과 공유하면 토스 앱이 실행되면서 지정한 경로로 진입해요. 토스앱이 없는 사람은 iOS 일 때는 앱스토어로 이동하고, Android 일 때는 플레이스토어로 이동해요.
+ *
+ * 경로는 토스 앱 내부 특정 화면을 나타내는 딥링크(deep link) 형식이어야 해요.
+ * 예를 들어 `intoss://<앱 이름>`이나 `intoss://<앱 이름>/about?name=test`처럼 작성해요.
+ *
+ * 이 함수를 사용하면 `deep_link_value`를 포함한 완성된 공유 링크를 만들 수 있어요.
+ *
+ * @param path - 딥링크로 열고 싶은 경로예요. `intoss://`로 시작하는 문자열이어야 해요.
+ * @returns {Promise<string>} `deep_link_value`가 포함된 토스 공유 링크를 반환해요.
+ *
+ * @example
+ * ```tsx
+ * import { getTossShareLink, share } from '@apps-in-toss/framework';
+ *
+ * // '/' 경로를 딥링크로 포함한 토스 공유 링크를 생성해요.
+ * const tossLink = await getTossShareLink('intoss://my-app');
+ *
+ * // 생성한 링크를 메시지로 공유해요.
+ * await share({ message: tossLink });
+ * ```
+ */
+declare function getTossShareLink(path: string): Promise<string>;
+
 /**
  * @public
  * @category 토스페이
@@ -1220,7 +1250,7 @@ type UseGeolocationOptions = Omit<StartUpdateLocationOptions, 'callback'>;
  * @param {Accuracy} [options.accuracy] 위치 정확도를 설정해요. `Accuracy.Lowest`: 오차범위 3KM 이내, `Accuracy.Low`: 오차범위 1KM 이내, `Accuracy.Balanced`: 오차범위 몇 백미터 이내, `Accuracy.High`: 오차범위 10M 이내, `Accuracy.Highest`: 가장 높은 정확도, `Accuracy.BestForNavigation`: 네비게이션을 위한 최고 정확도
  * @param {number} [options.timeInterval] 위치 정보를 업데이트하는 최소 주기로, 단위는 밀리초(ms)예요. 이 값은 위치 업데이트가 발생하는 가장 짧은 간격을 설정하지만, 시스템이나 환경의 영향을 받아 지정한 주기보다 더 긴 간격으로 업데이트될 수 있어요.
  * @param {number} [options.distanceInterval] 위치 변경 거리를 미터(m) 단위로 설정해요.
- * @returns {Location | null} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/reference/framework/Types/Location.html)을 참고해주세요.
+ * @returns {Location | null} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
  *
  * @example
  * ### 위치 정보 변경 감지하기
@@ -1256,4 +1286,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, getDeviceId, 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, getTossShareLink, openCamera, setClipboardText, startUpdateLocation, useGeolocation };

package/dist/index.d.ts

@@ -70,7 +70,7 @@ interface Location {
      */
     timestamp: number;
     /**
-     * @description 위치 정보를 나타내는 객체예요. 자세한 내용은 [LocationCoords](/reference/framework/Types/LocationCoords.html)을 참고해주세요.
+     * @description 위치 정보를 나타내는 객체예요. 자세한 내용은 [LocationCoords](/react-native/reference/framework/Types/LocationCoords.html)을 참고해주세요.
      */
     coords: LocationCoords;
 }
@@ -154,7 +154,7 @@ interface UpdateLocationEventEmitter extends EventEmitterSchema<'updateLocation'
  * @param {number} [options.accuracy] 위치 정확도를 설정해요.
  * @param {number} [options.timeInterval] 위치 정보를 업데이트하는 최소 주기로, 단위는 밀리초(ms)예요. 이 값은 위치 업데이트가 발생하는 가장 짧은 간격을 설정하지만, 시스템이나 환경의 영향을 받아 지정한 주기보다 더 긴 간격으로 업데이트될 수 있어요.
  * @param {number} [options.distanceInterval] 위치 변경 거리를 미터(m) 단위로 설정해요.
- * @param {(location: Location) => void} [options.callback] 위치 정보가 변경될 때 호출되는 콜백 함수예요. 자세한 내용은 [Location](/reference/framework/Types/Location.html)을 참고해주세요.
+ * @param {(location: Location) => void} [options.callback] 위치 정보가 변경될 때 호출되는 콜백 함수예요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
  *
  * @example
  * ### 위치 정보 변경 감지하기
@@ -858,7 +858,7 @@ interface GetCurrentLocationOptions {
  *
  * @param {GetCurrentLocationOptions} options 위치 정보를 가져올 때 사용하는 옵션 객체예요.
  * @param {Accuracy} [options.accuracy] 위치 정보의 정확도 수준이에요. 정확도는 `Accuracy` 타입으로 설정돼요.
- * @returns {Promise<Location>} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/reference/framework/Types/Location.html)을 참고해주세요.
+ * @returns {Promise<Location>} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
  *
  * @example
  * ### 디바이스의 현재 위치 정보 가져오기
@@ -1171,6 +1171,36 @@ declare const Storage: {
     clearItems: typeof clearItems;
 };
 
+/**
+ * @public
+ * @category 공유
+ * @kind function
+ * @name getTossShareLink
+ * @description
+ * `getTossShareLink` 함수는 사용자가 지정한 경로를 토스 앱에서 열 수 공유 링크를 반환해요.
+ * 이 링크를 다른 사람과 공유하면 토스 앱이 실행되면서 지정한 경로로 진입해요. 토스앱이 없는 사람은 iOS 일 때는 앱스토어로 이동하고, Android 일 때는 플레이스토어로 이동해요.
+ *
+ * 경로는 토스 앱 내부 특정 화면을 나타내는 딥링크(deep link) 형식이어야 해요.
+ * 예를 들어 `intoss://<앱 이름>`이나 `intoss://<앱 이름>/about?name=test`처럼 작성해요.
+ *
+ * 이 함수를 사용하면 `deep_link_value`를 포함한 완성된 공유 링크를 만들 수 있어요.
+ *
+ * @param path - 딥링크로 열고 싶은 경로예요. `intoss://`로 시작하는 문자열이어야 해요.
+ * @returns {Promise<string>} `deep_link_value`가 포함된 토스 공유 링크를 반환해요.
+ *
+ * @example
+ * ```tsx
+ * import { getTossShareLink, share } from '@apps-in-toss/framework';
+ *
+ * // '/' 경로를 딥링크로 포함한 토스 공유 링크를 생성해요.
+ * const tossLink = await getTossShareLink('intoss://my-app');
+ *
+ * // 생성한 링크를 메시지로 공유해요.
+ * await share({ message: tossLink });
+ * ```
+ */
+declare function getTossShareLink(path: string): Promise<string>;
+
 /**
  * @public
  * @category 토스페이
@@ -1220,7 +1250,7 @@ type UseGeolocationOptions = Omit<StartUpdateLocationOptions, 'callback'>;
  * @param {Accuracy} [options.accuracy] 위치 정확도를 설정해요. `Accuracy.Lowest`: 오차범위 3KM 이내, `Accuracy.Low`: 오차범위 1KM 이내, `Accuracy.Balanced`: 오차범위 몇 백미터 이내, `Accuracy.High`: 오차범위 10M 이내, `Accuracy.Highest`: 가장 높은 정확도, `Accuracy.BestForNavigation`: 네비게이션을 위한 최고 정확도
  * @param {number} [options.timeInterval] 위치 정보를 업데이트하는 최소 주기로, 단위는 밀리초(ms)예요. 이 값은 위치 업데이트가 발생하는 가장 짧은 간격을 설정하지만, 시스템이나 환경의 영향을 받아 지정한 주기보다 더 긴 간격으로 업데이트될 수 있어요.
  * @param {number} [options.distanceInterval] 위치 변경 거리를 미터(m) 단위로 설정해요.
- * @returns {Location | null} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/reference/framework/Types/Location.html)을 참고해주세요.
+ * @returns {Location | null} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
  *
  * @example
  * ### 위치 정보 변경 감지하기
@@ -1256,4 +1286,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, getDeviceId, 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, getTossShareLink, openCamera, setClipboardText, startUpdateLocation, useGeolocation };

package/dist/index.js

@@ -52,7 +52,10 @@ function TDSContainer({ children }) {
 function registerApp(container, { context }) {
   return Bedrock.registerApp(AppsInTossContainer.bind(null, container), {
     appName: getAppName(),
-    context
+    context,
+    defaultScreenOption: {
+      statusBarStyle: "dark"
+    }
   });
 }
 function getAppName() {
@@ -271,6 +274,15 @@ var Storage = {
   clearItems
 };
 
+// src/native-modules/getTossShareLink.ts
+async function getTossShareLink(path) {
+  const { shareLink } = await AppsInTossModule.getTossShareLink({});
+  const shareUrl = new URL(shareLink);
+  shareUrl.searchParams.set("deep_link_value", path);
+  shareUrl.searchParams.set("af_dp", path);
+  return shareUrl.toString();
+}
+
 // src/native-modules/index.ts
 var TossPay = {
   checkoutPayment,
@@ -283,8 +295,8 @@ import {
   ExternalWebViewScreen
 } 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, useBedrockEvent } from "react-native-bedrock";
+import { useMemo as useMemo2 } from "react";
+import { getSchemeUri, useBedrockEvent } from "react-native-bedrock";
 import * as bedrockAsyncBridges from "react-native-bedrock/async-bridges";
 import * as bedrockConstantBridges from "react-native-bedrock/constant-bridges";
 
@@ -445,10 +457,137 @@ __export(async_bridges_exports, {
   fetchContacts: () => fetchContacts,
   getClipboardText: () => getClipboardText,
   getCurrentLocation: () => getCurrentLocation,
+  getTossShareLink: () => getTossShareLink,
   openCamera: () => openCamera,
   setClipboardText: () => setClipboardText
 });
 
+// src/bridge-handler/useBridgeHandler.tsx
+import { useCallback as useCallback2, useMemo, useRef } from "react";
+function serializeError(error) {
+  return JSON.stringify(error, (_, value) => {
+    if (value instanceof Error) {
+      return {
+        name: value.name,
+        message: value.message,
+        stack: value.stack,
+        __isError: true
+      };
+    }
+    return value;
+  });
+}
+function methodHandler({
+  args,
+  eventId,
+  functionName,
+  handlerMap,
+  injectJavaScript
+}) {
+  const func = async (...args2) => {
+    const result = await handlerMap[functionName](...args2);
+    return result;
+  };
+  if (!func) {
+    console.error(`${functionName} is not a function`);
+    return;
+  }
+  func(...args).then((result) => {
+    injectJavaScript?.(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/resolve/${eventId}', ${JSON.stringify(result, null, 0)});
+    `);
+  }).catch((error) => {
+    const serializedError = serializeError(error);
+    injectJavaScript?.(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/reject/${eventId}', ${serializedError});
+    `);
+  });
+}
+var globalEventListenerMap = /* @__PURE__ */ new Map();
+function useBridgeHandler({
+  onMessage,
+  constantHandlerMap,
+  asyncHandlerMap,
+  eventListenerMap,
+  injectedJavaScript: originalInjectedJavaScript
+}) {
+  const ref = useRef(null);
+  const injectedJavaScript = useMemo(
+    () => [
+      `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
+        Object.entries(constantHandlerMap).reduce(
+          (acc, [key, value]) => {
+            acc[key] = typeof value === "function" ? value() : value;
+            return acc;
+          },
+          {}
+        )
+      )}`,
+      originalInjectedJavaScript,
+      "true"
+    ].join("\n"),
+    [constantHandlerMap, originalInjectedJavaScript]
+  );
+  const createHandleOnEvent = (functionName, eventId) => (response) => {
+    ref.current?.injectJavaScript(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/onEvent/${eventId}', ${JSON.stringify(response, null, 0)});
+    `);
+  };
+  const createHandleOnError = (functionName, eventId) => (error) => {
+    ref.current?.injectJavaScript(`
+      window.__BEDROCK_NATIVE_EMITTER.emit('${functionName}/onError/${eventId}', ${JSON.stringify(error, null, 0)});
+    `);
+  };
+  const $onMessage = useCallback2(
+    async (e) => {
+      onMessage?.(e);
+      const data = JSON.parse(e.nativeEvent.data);
+      if (typeof data !== "object" || data === null || typeof data.functionName !== "string" || typeof data.eventId !== "string" || typeof data.type !== "string" || !["addEventListener", "removeEventListener", "method"].includes(data.type)) {
+        return;
+      }
+      switch (data.type) {
+        case "addEventListener": {
+          const handleOnEvent = createHandleOnEvent(data.functionName, data.eventId);
+          const handleOnError = createHandleOnError(data.functionName, data.eventId);
+          const remove = eventListenerMap[data.functionName]?.({
+            onEvent: handleOnEvent,
+            onError: handleOnError,
+            options: data.args
+          });
+          if (remove) {
+            globalEventListenerMap.set(`${data.functionName}/${data.eventId}`, remove);
+          }
+          break;
+        }
+        case "removeEventListener": {
+          const key = `${data.functionName}/${data.eventId}`;
+          const remove = globalEventListenerMap.get(key);
+          remove?.();
+          globalEventListenerMap.delete(key);
+          break;
+        }
+        case "method": {
+          methodHandler({
+            args: data.args,
+            eventId: data.eventId,
+            functionName: data.functionName,
+            handlerMap: asyncHandlerMap,
+            injectJavaScript: ref.current?.injectJavaScript
+          });
+          break;
+        }
+      }
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [onMessage]
+  );
+  return {
+    ref,
+    injectedJavaScript,
+    onMessage: $onMessage
+  };
+}
+
 // src/constant-bridges.ts
 var constant_bridges_exports = {};
 __export(constant_bridges_exports, {
@@ -504,7 +643,7 @@ function WebView({ type, local, onMessage, ...props }) {
     throw new Error(`Invalid WebView type: '${type}'`);
   }
   const bedrockEvent = useBedrockEvent();
-  const uri = useMemo(() => getWebViewUri(local), [local]);
+  const uri = useMemo2(() => getWebViewUri(local), [local]);
   const top = useSafeAreaTop2();
   const bottom = useSafeAreaBottom();
   const handler = useBridgeHandler({
@@ -536,7 +675,7 @@ function WebView({ type, local, onMessage, ...props }) {
       clearItems: Storage.clearItems
     }
   });
-  const baseProps = useMemo(() => {
+  const baseProps = useMemo2(() => {
     switch (type) {
       case "partner": {
         const headerOnlyProp = {
@@ -566,7 +705,7 @@ function WebView({ type, local, onMessage, ...props }) {
     }
   }, [type, props]);
   const BaseWebView = WEBVIEW_TYPES[type];
-  const webviewDebuggingEnabled = useMemo(
+  const webviewDebuggingEnabled = useMemo2(
     () => getOperationalEnvironment() === "sandbox",
     []
   );
@@ -641,6 +780,7 @@ export {
   getDeviceId,
   getOperationalEnvironment,
   getTossAppVersion,
+  getTossShareLink,
   openCamera,
   setClipboardText,
   startUpdateLocation,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@apps-in-toss/framework",
   "type": "module",
-  "version": "0.0.20",
+  "version": "0.0.22",
   "description": "The framework for Apps In Toss",
   "scripts": {
     "prepack": "yarn build",
@@ -56,13 +56,13 @@
     "ait": "./bin/ait.js"
   },
   "dependencies": {
-    "@apps-in-toss/cli": "0.0.20",
-    "@apps-in-toss/plugins": "0.0.20",
+    "@apps-in-toss/cli": "0.0.22",
+    "@apps-in-toss/plugins": "0.0.22",
     "es-hangul": "^2.3.2"
   },
   "devDependencies": {
-    "@react-native-bedrock/mpack-next": "0.0.19",
-    "@react-native-bedrock/native": "0.0.19",
+    "@react-native-bedrock/mpack-next": "0.0.21",
+    "@react-native-bedrock/native": "0.0.21",
     "@toss-design-system/react-native": "^0.5.0",
     "@types/kill-port": "^2.0.1",
     "@types/react": "18.3.3",
@@ -73,7 +73,7 @@
     "kill-port": "^2.0.1",
     "react": "18.2.0",
     "react-native": "0.72.6",
-    "react-native-bedrock": "0.0.19",
+    "react-native-bedrock": "0.0.21",
     "tsup": "^8.3.5",
     "typescript": "4.9.5",
     "vitest": "^3.0.3",
@@ -91,5 +91,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "5c967237d66e19465d53f6ed842fe9c4f39b768f"
+  "gitHead": "2a6cea952ba0db69fc2f0c9a94a190b9dfabe8ef"
 }

package/src/async-bridges.ts

@@ -7,3 +7,4 @@ export * from './native-modules/openCamera.js';
 export * from './native-modules/appLogin.js';
 export * from './native-modules/checkoutPayment.js';
 export * from './native-modules/executePayment.js';
+export * from './native-modules/getTossShareLink.js';