@apps-in-toss/framework 0.0.0-dev.1744801739343 → 0.0.0-dev.1752049503789

package/dist/index.d.cts

@@ -1,1187 +1,27 @@
+import * as react from 'react';
 import { ComponentType, PropsWithChildren } from 'react';
-import { InitialProps, BedrockProps } from 'react-native-bedrock';
-import { EmitterSubscription } from 'react-native';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _apps_in_toss_analytics from '@apps-in-toss/analytics';
+export * from '@apps-in-toss/analytics';
+import { InitialProps, GraniteProps } from '@granite-js/react-native';
 import { PartnerWebViewScreenProps, ExternalWebViewScreenProps } from '@toss-design-system/react-native';
-import { WebViewProps as WebViewProps$1 } from '@react-native-bedrock/native/react-native-webview';
-
-type AppsInTossProps = Pick<BedrockProps, 'context'>;
-declare function registerApp(container: ComponentType<PropsWithChildren<InitialProps>>, { context }: AppsInTossProps): (initialProps: InitialProps) => JSX.Element;
-
-declare const AppsInToss: {
-    registerApp: typeof registerApp;
-};
-
-interface EventEmitterSchema<K extends string, P extends unknown[]> {
-    name: K;
-    params: P;
-}
-
-/**
- * @public
- * @category 위치 정보
- * @name Accuracy
- * @description 위치 정확도 옵션이에요.
- */
-declare enum Accuracy {
-    /**
-     * 오차범위 3KM 이내
-     */
-    Lowest = 1,
-    /**
-     * 오차범위 1KM 이내
-     */
-    Low = 2,
-    /**
-     * 오차범위 몇 백미터 이내
-     */
-    Balanced = 3,
-    /**
-     * 오차범위 10M 이내
-     */
-    High = 4,
-    /**
-     * 가장 높은 정확도
-     */
-    Highest = 5,
-    /**
-     * 네비게이션을 위한 최고 정확도
-     */
-    BestForNavigation = 6
-}
-/**
- * @public
- * @category 위치 정보
- * @name Location
- * @description 위치 정보를 나타내는 객체예요.
- */
-interface Location {
-    /**
-     * Android에서만 지원하는 옵션이에요.
-     *
-     * - `FINE`: 정확한 위치
-     * - `COARSE`: 대략적인 위치
-     *
-     * @see https://developer.android.com/codelabs/approximate-location
-     */
-    accessLocation?: 'FINE' | 'COARSE';
-    /**
-     * 위치가 업데이트된 시점의 유닉스 타임스탬프예요.
-     */
-    timestamp: number;
-    /**
-     * @description 위치 정보를 나타내는 객체예요. 자세한 내용은 [LocationCoords](/react-native/reference/framework/Types/LocationCoords.html)을 참고해주세요.
-     */
-    coords: LocationCoords;
-}
-/**
- * @public
- * @category 위치 정보
- * @name LocationCoords
- * @description 세부 위치 정보를 나타내는 객체예요.
- */
-interface LocationCoords {
-    /**
-     * 위도
-     */
-    latitude: number;
-    /**
-     * 경도
-     */
-    longitude: number;
-    /**
-     * 높이
-     */
-    altitude: number;
-    /**
-     * 위치 정확도
-     */
-    accuracy: number;
-    /**
-     * 고도 정확도
-     */
-    altitudeAccuracy: number;
-    /**
-     * 방향
-     */
-    heading: number;
-}
-/**
- * 사진 조회 결과를 나타내는 타입이에요.
- */
-interface ImageResponse {
-    /** 가져온 사진의 고유 ID예요. */
-    id: string;
-    /** 사진의 데이터 URI예요. `base64` 옵션이 `true`인 경우 Base64 문자열로 반환돼요. */
-    dataUri: string;
-}
-
-interface StartUpdateLocationOptions {
-    /**
-     * 위치 정확도를 설정해요.
-     */
-    accuracy: Accuracy;
-    /**
-     * 위치 업데이트 주기를 밀리초(ms) 단위로 설정해요.
-     */
-    timeInterval: number;
-    /**
-     * 위치 변경 거리를 미터(m) 단위로 설정해요.
-     */
-    distanceInterval: number;
-}
-interface StartUpdateLocationSubscription extends EmitterSubscription {
-    remove: () => Promise<void>;
-}
-/**
- * @name UpdateLocationEventEmitter
- * @kind typedef
- * @description
- * 디바이스의 위치 정보 변경을 감지해요
- * @extends {EventEmitterSchema<'updateLocation', [Location]>}
- */
-interface UpdateLocationEventEmitter extends EventEmitterSchema<'updateLocation', [Location]> {
-}
-/**
- * @public
- * @category 위치 정보
- * @name startUpdateLocation
- * @description  디바이스의 위치 정보를 지속적으로 감지하고, 위치가 변경되면 콜백을 실행하는 함수예요. 콜백 함수를 등록하면 위치가 변경될 때마다 자동으로 호출돼요.
- * 실시간 위치 추적이 필요한 기능을 구현할 때 사용할 수 있어요. 예를 들어 지도 앱에서 사용자의 현재 위치를 실시간으로 업데이트할 때, 운동 앱에서 사용자의 이동 거리를 기록할 때 등이에요.
- * 위치 업데이트 주기와 정확도를 조정해 배터리 소모를 최소화하면서도 필요한 정보를 얻을 수 있어요.
- *
- * @param {StartUpdateLocationOptions} options - 위치 정보 감지에 필요한 설정 객체에요.
- * @param {number} [options.accuracy] 위치 정확도를 설정해요.
- * @param {number} [options.timeInterval] 위치 정보를 업데이트하는 최소 주기로, 단위는 밀리초(ms)예요. 이 값은 위치 업데이트가 발생하는 가장 짧은 간격을 설정하지만, 시스템이나 환경의 영향을 받아 지정한 주기보다 더 긴 간격으로 업데이트될 수 있어요.
- * @param {number} [options.distanceInterval] 위치 변경 거리를 미터(m) 단위로 설정해요.
- * @param {(location: Location) => void} [options.callback] 위치 정보가 변경될 때 호출되는 콜백 함수예요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
- *
- * @example
- * ### 위치 정보 변경 감지하기
- *
- * ```tsx
- * import React, { useState, useEffect } from 'react';
- * import { View, Text, Button } from 'react-native';
- * import { startUpdateLocation } from '@apps-in-toss/framework';
- *
- * // 위치 정보 변경 감지하기
- * function LocationWatcher() {
- *   const [location, setLocation] = useState(null);
- *
- *   useEffect(() => {
- *     return startUpdateLocation({
- *       options: {
- *         accuracy: Accuracy.Balanced,
- *         timeInterval: 3000,
- *         distanceInterval: 10,
- *       },
- *       onEvent: (location) => {
- *         setLocation(location);
- *       },
- *       onError: (error) => {
- *         console.error('위치 정보를 가져오는데 실패했어요:', error);
- *       },
- *     });
- *   }, []);
- *
- *   if (location == null) {
- *     return <Text>위치 정보를 가져오는 중이에요...</Text>;
- *   }
- *
- *   return (
- *     <View>
- *       <Text>위도: {location.coords.latitude}</Text>
- *       <Text>경도: {location.coords.longitude}</Text>
- *       <Text>위치 정확도: {location.coords.accuracy}m</Text>
- *       <Text>높이: {location.coords.altitude}m</Text>
- *       <Text>고도 정확도: {location.coords.altitudeAccuracy}m</Text>
- *       <Text>방향: {location.coords.heading}°</Text>
- *     </View>
- *   );
- * }
- * ```
- */
-declare function startUpdateLocation(eventParams: {
-    onEvent: (response: Location) => void;
-    onError: (error: unknown) => void;
-    options: StartUpdateLocationOptions;
-}): () => void;
-
-/**
- * @public
- * @category 토스페이
- * @name CheckoutPaymentOptions
- * @description 토스페이 결제를 생성할 때 필요한 옵션 객체예요.
- * @property {string} orderNo 가맹점의 상품 주문번호예요.
- * @property {string} productDesc 상품 설명이에요.
- * @property {number} amount 결제 금액이에요.
- * @property {number} amountTaxFree 결제 금액 중 비과세 금액이에요.
- * @property {number} [amountTaxable] 결제 금액 중 과세 금액이에요.
- * @property {number} [amountVat] 결제 금액 중 부가세예요.
- * @property {number} [amountServiceFee] 결제 금액 중 봉사료예요.
- * @property {'TOSS_MONEY' | 'CARD' | null} [enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
- * @property {boolean} [cashReceipt] 현금영수증 발급 가능 여부예요.
- * @property {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
- * @property {'USE' | 'NO_USE'} [installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
- */
-interface CheckoutPaymentOptions {
-    /**
-     * 가맹점의 상품 주문번호에요.
-     */
-    orderNo: string;
-    /**
-     * 상품 설명이에요.
-     */
-    productDesc: string;
-    /**
-     * 결제 금액이예요.
-     */
-    amount: number;
-    /**
-     * 결제 금액 중 비과세 금액이에요.
-     */
-    amountTaxFree: number;
-    /**
-     * 결제 금액 중 과세 금액이에요.
-     */
-    amountTaxable?: number;
-    /**
-     * 결제 금액 중 부가세예요.
-     */
-    amountVat?: number;
-    /**
-     * 결제 금액 중 봉사료예요.
-     */
-    amountServiceFee?: number;
-    /**
-     * 결제수단 구분 변수예요.
-     *
-     * - 'TOSS_MONEY': 결제수단 중 토스머니만 노출
-     * - 'CARD': 결제수단 중 카드만 노출
-     * - null: 상점에 설정된 기본 결제 수단 노출
-     */
-    enablePayMethods?: 'TOSS_MONEY' | 'CARD' | null;
-    /**
-     * 현금영수증 발급 가능 여부예요.
-     */
-    cashReceipt?: boolean;
-    /**
-     * 현금영수증 발급 타입이에요.
-     *
-     * - 'CULTURE': 문화비
-     * - 'GENERAL': 일반(기본값)
-     * - 'PUBLIC_TP': 교통비
-     */
-    cashReceiptTradeOption?: 'CULTURE' | 'GENERAL' | 'PUBLIC_TP';
-    /**
-     * 할부를 사용할 지 말 지 여부에요.
-     *
-     * - 'USE': 사용(기본값)
-     * - 'NO_USE': 할부 미사용
-     */
-    installment?: 'USE' | 'NO_USE';
-}
-/**
- * @public
- * @category 토스페이
- * @name checkoutPayment
- * @description 토스페이 결제를 생성하는 함수예요.
- *
- * @param {CheckoutPaymentOptions} options 결제를 생성할 때 필요한 옵션 객체예요.
- * @param {string} options.orderNo 가맹점의 상품 주문번호예요.
- * @param {string} options.productDesc 상품 설명이에요.
- * @param {number} options.amount 결제 금액이에요.
- * @param {number} options.amountTaxFree 결제 금액 중 비과세 금액이에요.
- * @param {number} [options.amountTaxable] 결제 금액 중 과세 금액이에요.
- * @param {number} [options.amountVat] 결제 금액 중 부가세예요.
- * @param {number} [options.amountServiceFee] 결제 금액 중 봉사료예요.
- * @param {'TOSS_MONEY' | 'CARD' | null} [options.enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
- * @param {boolean} [options.cashReceipt] 현금영수증 발급 가능 여부예요.
- * @param {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [options.cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
- * @param {'USE' | 'NO_USE'} [options.installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
- * @returns {Promise<{ payToken: string }>} 결제 인증 후 발급된 결제 토큰 값이 포함된 객체를 반환해요.
- *
- * @example
- * ### 결제 생성하기
- *
- * ```tsx
- * import { TossPay } from '@apps-in-toss/framework';
- *
- * async function handlePayment() {
- *   try {
- *     const result = await TossPay.checkoutPayment({
- *       orderNo: 'ORDER_12345',
- *       productDesc: '티셔츠',
- *       amount: 15000,
- *       amountTaxFree: 0,
- *       amountTaxable: 13636,
- *       amountVat: 1364,
- *       enablePayMethods: 'CARD',
- *       installment: 'USE'
- *     });
- *
- *     console.log('결제 토큰:', result.payToken);
- *   } catch (error) {
- *     console.error('결제 생성에 실패했어요:', error);
- *   }
- * }
- * ```
- */
-declare function checkoutPayment(options: CheckoutPaymentOptions): Promise<{
-    payToken: string;
-}>;
-
-/**
- * @public
- * @category 토스페이
- * @name ExecutePaymentOptions
- * @description 생성한 토스페이 결제를 실행할 때 필요한 옵션이에요.
- * @property {string} orderNo 결제를 생성할 때 사용한 주문번호예요.
- * @property {string} payToken 결제 인증 과정에서 전달받은 결제 토큰이에요. 결제를 실행할 때 사용해요.
- */
-interface ExecutePaymentOptions {
-    /**
-     * 결제를 생성할 때 사용한 주문번호예요.
-     */
-    orderNo: string;
-    /**
-     * 결제 인증 과정에서 전달받은 Pay 토큰이에요.
-     */
-    payToken: string;
-}
-/**
- * @public
- * @category 토스페이
- * @name CardExecutePaymentResult
- * @description 카드로 결제 요청을 실행한 뒤 돌아오는 결제 결과 객체예요. 결제 승인 여부, 결제된 금액, 주문 정보 등을 담고 있어요.
- * @property {'CARD'} payMethod 결제 수단이에요.
- * @property {number} code 결제 요청의 결과 코드예요.
- * @property {'LIVE' | 'TEST'} mode 현재 결제 환경이에요.
- * @property {string} orderNo 주문번호예요.
- * @property {number} amount 총 결제 금액이에요.
- * @property {string} approvalTime 결제가 승인된 시간이에요. (ISO 8601 형식)
- * @property {string} stateMsg 결제 상태 메시지예요.
- * @property {number} discountedAmount 적용된 할인 금액이에요.
- * @property {number} paidAmount 실제 결제된 금액이에요.
- * @property {string} payToken 결제 요청 시 사용한 Pay 토큰이에요.
- * @property {string} transactionId 거래 ID예요.
- * @property {number} cardCompanyCode 카드사 코드예요.
- * @property {string} cardCompanyName 카드사 이름이에요.
- * @property {string} cardAuthorizationNo 카드사 승인 번호예요. (라이브 결제 환경에서만 확인 가능해요)
- * @property {number} spreadOut 할부 개월 수예요. (5만원 미만 금액 및 일시불 결제의 경우에는 `0`)
- * @property {boolean} noInterest 무이자 할부 여부예요.
- * @property {string} salesCheckLinkUrl 결제 내역을 확인할 수 있는 매출전표 URL이에요.
- * @property {'CREDIT' | 'CHECK' | 'PREPAYMENT'} cardMethodType 카드 유형이에요.
- * @property {string} cardNumber 마스킹된 카드 번호예요. (`****-****-****-1234` 형식)
- * @property {string} cardNum4Print 카드 번호의 마지막 4자리예요.
- * @property {string} cardBinNumber 카드 BIN 번호예요.
- */
-interface CardExecutePaymentResult {
-    /**
-     * 결제 수단이에요.
-     */
-    payMethod: 'CARD';
-    /**
-     * 결제 요청의 결과 코드예요.
-     */
-    code: number;
-    /**
-     * 현재 결제 환경이에요.
-     *
-     * - `LIVE`: 실제 환경
-     * - `TEST`: 테스트 환경
-     */
-    mode: 'LIVE' | 'TEST';
-    /**
-     * 주문번호예요.
-     */
-    orderNo: string;
-    /**
-     * 총 결제 금액이에요.
-     */
-    amount: number;
-    /**
-     * 결제가 승인된 시간이에요. (ISO 8601 형식)
-     */
-    approvalTime: string;
-    /**
-     * 결제 상태 메시지예요.
-     */
-    stateMsg: string;
-    /**
-     * 적용된 할인 금액이에요.
-     */
-    discountedAmount: number;
-    /**
-     * 실제 결제된 금액이에요.
-     */
-    paidAmount: number;
-    /**
-     * 결제 요청 시 사용한 Pay 토큰이에요.
-     */
-    payToken: string;
-    /**
-     * 거래 ID예요.
-     */
-    transactionId: string;
-    /**
-     * 카드사 코드예요.
-     */
-    cardCompanyCode: number;
-    /**
-     * 카드사 이름이에요.
-     */
-    cardCompanyName: string;
-    /**
-     * 카드사 승인 번호예요. (라이브 결제 환경에서만 확인 가능해요)
-     */
-    cardAuthorizationNo: string;
-    /**
-     * 할부 개월 수예요. (5만원 미만 금액 및 일시불 결제의 경우에는 `0`)
-     */
-    spreadOut: number;
-    /**
-     * 무이자 할부 여부예요.
-     */
-    noInterest: boolean;
-    /**
-     * 결제 내역을 확인할 수 있는 매출전표 URL이에요.
-     */
-    salesCheckLinkUrl: string;
-    /**
-     * 카드 유형이에요.
-     *
-     * - 'CREDIT': 신용카드
-     * - 'CHECK': 체크카드
-     * - 'PREPAYMENT': 선불카드
-     */
-    cardMethodType: 'CREDIT' | 'CHECK' | 'PREPAYMENT';
-    /**
-     * 마스킹된 카드 번호예요. (`****-****-****-1234` 형식)
-     */
-    cardNumber: string;
-    /**
-     * 카드 사용자 구분을 나타내는 값이에요.
-     *
-     * - 'PERSONAL': 개인 카드
-     * - 'PERSONAL_FAMILY': 가족 카드
-     * - 'CORP_PERSONAL': 법인지정 결제계좌 (임직원)
-     * - 'CORP_PRIVATE': 법인 공용
-     * - 'CORP_COMPANY': 법인지정 결제계좌 회사 (하나카드 Only)
-     */
-    cardUserType: 'PERSONAL' | 'PERSONAL_FAMILY' | 'CORP_PERSONAL' | 'CORP_PRIVATE' | 'CORP_COMPANY';
-    /**
-     * 카드 번호의 마지막 4자리예요.
-     */
-    cardNum4Print: string;
-    /**
-     * 카드 BIN 번호예요.
-     */
-    cardBinNumber: string;
-}
-/**
- * @public
- * @category 토스페이
- * @name TossMoneyExecutePaymentResult
- * @description 토스머니로 결제 요청을 실행한 뒤 돌아오는 결제 결과 객체예요. 결제 승인 여부, 결제된 금액, 주문 정보 등을 담고 있어요.
- * @property {'TOSS_MONEY'} payMethod 결제 수단이에요.
- * @property {number} code 결제 요청의 결과 코드예요.
- * @property {'LIVE' | 'TEST'} mode 현재 결제 환경이에요.
- * @property {string} orderNo 주문번호예요.
- * @property {number} amount 총 결제 금액이에요.
- * @property {string} approvalTime 결제가 승인된 시간이에요. (ISO 8601 형식)
- * @property {string} stateMsg 결제 상태 메시지예요.
- * @property {number} discountedAmount 적용된 할인 금액이에요.
- * @property {number} paidAmount 실제 결제된 금액이에요.
- * @property {string} payToken 결제 요청 시 사용한 Pay 토큰이에요.
- * @property {string} transactionId 거래 ID예요.
- * @property {string} cashReceiptMgtKey 현금영수증 관리번호 식별값이에요.
- * @property {string} accountBankName 결제된 은행의 코드예요.
- * @property {string} accountNumber 결제된 계좌번호예요.
- */
-interface TossMoneyExecutePaymentResult {
-    /**
-     * 결제에 사용된 결제 수단이에요.
-     */
-    payMethod: 'TOSS_MONEY';
-    /**
-     * 결제 요청의 결과 코드예요.
-     */
-    code: number;
-    /**
-     * 현재 결제 환경이에요.
-     *
-     * - `LIVE`: 실제 환경
-     * - `TEST`: 테스트 환경
-     */
-    mode: 'LIVE' | 'TEST';
-    /**
-     * 결제 승인된 상품의 주문번호예요.
-     */
-    orderNo: string;
-    /**
-     * 결제 승인된 상품의 총 결제 금액이에요.
-     */
-    amount: number;
-    /**
-     * 결제가 승인된 시간이에요. (ISO 8601 형식)
-     */
-    approvalTime: string;
-    /**
-     * 결제 상태 메시지예요.
-     */
-    stateMsg: string;
-    /**
-     * 적용된 할인 금액이에요.
-     */
-    discountedAmount: number;
-    /**
-     * 실제 결제 승인된 금액이에요.
-     */
-    paidAmount: number;
-    /**
-     * 결제 요청 시 사용한 Pay 토큰이에요.
-     */
-    payToken: string;
-    /**
-     * 거래 ID예요.
-     */
-    transactionId: string;
-    /**
-     * 현금영수증 관리번호 식별값이에요.
-     */
-    cashReceiptMgtKey: string;
-    /**
-     * 결제된 은행의 코드예요.
-     */
-    accountBankName: string;
-    /**
-     * 결제된 계좌번호예요.
-     */
-    accountNumber: string;
-}
-/**
- * @public
- * @category 토스페이
- * @name executePayment
- * @description 구매자가 결제를 시도하면, 먼저 결제 정보를 생성하고 인증을 받아요. 이때 결제 상태는 '대기' 중이에요. 이후 결제를 실제로 승인하려면 주어진 주문번호와 결제 토큰을 사용해서 이 함수로 생성된 결제를 승인해요. 결제 승인이 완료되면, 구매자의 결제 수단(예: 카드, 계좌)에서 실제로 금액이 출금돼요. 이 함수를 호출하지 않으면 결제가 자동으로 만료되고, 출금도 발생하지 않아요.
- *
- * @param {ExecutePaymentOptions} options 결제를 실행할 때 필요한 옵션이에요.
- * @param {string} options.orderNo 결제를 생성할 때 사용한 주문번호예요.
- * @param {string} options.payToken 결제 인증 과정에서 전달받은 결제 토큰이에요. 결제를 실행할 때 사용해요.
- * @returns {Promise<CardExecutePaymentResult | TossMoneyExecutePaymentResult>} 결제 결과 객체를 반환해요. 자세한 내용은 [카드 결제 결과](/react-native/reference/framework/토스페이/CardExecutePaymentResult.html) 또는 [토스머니 결제 결과](/react-native/reference/framework/토스페이/TossMoneyExecutePaymentResult.html)를 참고하세요.
- *
- * @example
- *
- * ### 카드 결제 실행하기
- *
- * ```tsx
- * import { TossPay } from '@apps-in-toss/framework';
- *
- * async function handlePayment() {
- *   try {
- *     const payToken = 'PAY_TOKEN_12345'; // 결제 인증 후 받은 토큰
- *
- *     const result = await TossPay.executePayment({
- *       orderNo: 'ORDER_12345',
- *       payToken,
- *     });
- *
- *     console.log('결제가 완료되었어요:', result);
- *   } catch (error) {
- *     console.error('결제에 실패했어요:', error);
- *   }
- * }
- * ```
- */
-declare function executePayment(options: ExecutePaymentOptions): Promise<CardExecutePaymentResult | TossMoneyExecutePaymentResult>;
-
-/**
- * @public
- * @category 클립보드
- * @name setClipboardText
- * @description 텍스트를 클립보드에 복사해서 사용자가 다른 곳에 붙여 넣기 할 수 있어요.
- * @param {Promise<void>} text - 클립보드에 복사할 텍스트예요. 문자열 형식으로 입력해요.
- *
- * @example
- * ### 텍스트를 클립보드에 복사하기
- *
- * ```tsx
- * import { Button } from 'react-native';
- * import { setClipboardText } from '@apps-in-toss/framework';
- *
- * // '복사' 버튼을 누르면 "복사할 텍스트"가 클립보드에 복사돼요.
- * function CopyButton() {
- *   const handleCopy = async () => {
- *     try {
- *       await setClipboardText('복사할 텍스트');
- *       console.log('텍스트가 복사됐어요!');
- *     } catch (error) {
- *       console.error('텍스트 복사에 실패했어요:', error);
- *     }
- *   };
- *
- *   return <Button title="복사" onPress={handleCopy} />;
- * }
- * ```
- */
-declare function setClipboardText(text: string): Promise<void>;
-
-/**
- * @public
- * @category 클립보드
- * @name getClipboardText
- * @description 클립보드에 저장된 텍스트를 가져오는 함수예요. 복사된 텍스트를 읽어서 다른 작업에 활용할 수 있어요.
- * @returns {Promise<string>} - 클립보드에 저장된 텍스트를 반환해요. 클립보드에 텍스트가 없으면 빈 문자열을 반환해요.
- *
- * @example
- * ### 클립보드의 텍스트 가져오기
- *
- * ```tsx
- * import React, { useState } from 'react';
- * import { View, Text, Button } from 'react-native';
- * import { getClipboardText } from '@apps-in-toss/framework';
- *
- * // '붙여넣기' 버튼을 누르면 클립보드에 저장된 텍스트를 가져와 화면에 표시해요.
- * function PasteButton() {
- *   const [text, setText] = useState('');
- *
- *   const handlePress = async () => {
- *     try {
- *       const clipboardText = await getClipboardText();
- *       setText(clipboardText || '클립보드에 텍스트가 없어요.');
- *     } catch (error) {
- *       console.error('클립보드에서 텍스트를 가져오지 못했어요:', error);
- *     }
- *   };
- *
- *   return (
- *     <View>
- *       <Text>{text}</Text>
- *       <Button title="붙여넣기" onPress={handlePress} />
- *     </View>
- *   );
- * }
- * ```
- */
-declare function getClipboardText(): Promise<string>;
-
-/**
- * 연락처 정보를 나타내는 타입이에요.
- */
-interface ContactEntity {
-    /** 연락처 이름이에요. */
-    name: string;
-    /** 연락처 전화번호로, 문자열 형식이에요. */
-    phoneNumber: string;
-}
-/**
- * @public
- * @category 연락처
- * @name fetchContacts
- * @description 사용자의 연락처 목록을 페이지 단위로 가져오는 함수예요.
- * @param size - 한 번에 가져올 연락처 개수예요. 예를 들어, 10을 전달하면 최대 10개의 연락처를 가져와요.
- * @param offset - 가져올 연락처의 시작 지점이에요. 처음 호출할 때는 `0`을 전달해야 해요. 이후에는 이전 호출에서 반환된 `nextOffset` 값을 사용해요.
- * @param query - 추가적인 필터링 옵션이에요.
- * @param query.contains - 이름에 특정 문자열이 포함된 연락처만 가져오고 싶을 때 사용해요. 이 값을 전달하지 않으면 모든 연락처를 가져와요.
- * @returns {Promise<{result: { name: string; phoneNumber: string }[]; nextOffset: number | null; done: boolean}>}
- * 연락처 목록과 페이지네이션 정보를 포함한 객체를 반환해요.
- * - `result`: 가져온 연락처 목록이에요.
- * - `nextOffset`: 다음 호출에 사용할 오프셋 값이에요. 더 가져올 연락처가 없으면 `null`이에요.
- * - `done`: 모든 연락처를 다 가져왔는지 여부를 나타내요. 모두 가져왔다면 `true`예요.
- *
- * @signature
- * ```typescript
- * function fetchContacts({ size, offset, query }: {
- *  size: number;
- *  offset: number;
- *  query?: {
- *    contains?: string;
- *  };
- * }): Promise<{
- *  result: ContactEntity[];
- *  nextOffset: number | null;
- *  done: boolean;
- *  }>;
- * ```
- *
- * @example
- * ### 특정 문자열이 포함된 연락처 목록 가져오기
- *
- * ```tsx
- * import React, { useState } from 'react';
- * import { View, Text, Button } from 'react-native';
- * import { fetchContacts, ContactEntity } from '@apps-in-toss/framework';
- *
- * // 특정 문자열을 포함한 연락처 목록을 가져와 화면에 표시하는 컴포넌트
- * function ContactsList() {
- *   const [contacts, setContacts] = useState<{
- *     result: ContactEntity[];
- *     nextOffset: number | null;
- *     done: boolean;
- *   }>({
- *     result: [],
- *     nextOffset: null,
- *     done: false,
- *   });
- *
- *   const handlePress = async () => {
- *     try {
- *       if (contacts.done) {
- *         console.log('모든 연락처를 가져왔어요.');
- *         return;
- *       }
- *
- *       const response = await fetchContacts({
- *         size: 10,
- *         offset: contacts.nextOffset ?? 0,
- *         query: { contains: '김' },
- *       });
- *       setContacts((prev) => ({
- *         result: [...prev.result, ...response.result],
- *         nextOffset: response.nextOffset,
- *         done: response.done,
- *       }));
- *     } catch (error) {
- *       console.error('연락처를 가져오는 데 실패했어요:', error);
- *     }
- *   };
- *
- *   return (
- *     <View>
- *       {contacts.result.map((contact, index) => (
- *         <Text key={index}>{contact.name}: {contact.phoneNumber}</Text>
- *       ))}
- *       <Button
- *         title={contacts.done ? '모든 연락처를 가져왔어요.' : '다음 연락처 가져오기'}
- *         disabled={contacts.done}
- *         onPress={handlePress}
- *       />
- *     </View>
- *   );
- * }
- * ```
- */
-declare function fetchContacts({ size, offset, query, }: {
-    size: number;
-    offset: number;
-    query?: {
-        contains?: string;
+import { WebViewProps as WebViewProps$1 } from '@granite-js/native/react-native-webview';
+import { StartUpdateLocationOptions, Location } from '@apps-in-toss/native-modules';
+export * from '@apps-in-toss/native-modules';
+
+interface AppsInTossProps {
+    context: GraniteProps['context'];
+    analytics?: {
+        /**
+         * 분석 로그 출력 여부를 설정해요. 기본값은 `__DEV__` 예요.
+         */
+        debug?: boolean;
     };
-}): Promise<{
-    result: ContactEntity[];
-    nextOffset: number | null;
-    done: boolean;
-}>;
-
-/**
- * 앨범 사진을 조회할 때 사용하는 옵션 타입이에요.
- */
-interface FetchAlbumPhotosOptions {
-    /** 가져올 사진의 최대 개수를 설정해요. 숫자를 입력하고 기본값은 10이에요. */
-    maxCount?: number;
-    /** 사진의 최대 폭을 제한해요. 단위는 픽셀이고 기본값은 1024이에요. */
-    maxWidth?: number;
-    /** 이미지를 base64 형식으로 반환할지 설정해요. 기본값은 `false`예요. */
-    base64?: boolean;
 }
-/**
- * @public
- * @category 사진
- * @name fetchAlbumPhotos
- * @description
- * 사용자의 앨범에서 사진 목록을 불러오는 함수예요.
- * 최대 개수와 해상도를 설정할 수 있고 갤러리 미리보기, 이미지 선택 기능 등에 활용할 수 있어요.
- *
- * @param options - 조회 옵션을 담은 객체예요.
- * @param {number} [options.maxCount=10] 가져올 사진의 최대 개수를 설정해요. 숫자로 입력하며 기본값은 10이에요.
- * @param {number} [options.maxWidth=1024] 사진의 최대 폭을 제한해요. 단위는 픽셀이며 기본값은 `1024`이에요.
- * @param {boolean} [options.base64=false] 이미지를 base64 형식으로 반환할지 설정해요. 기본값은 `false`예요.
- * @returns {Promise<ImageResponse[]>}
- * 앨범 사진의 고유 ID와 데이터 URI를 포함한 배열을 반환해요.
- *
- * @example
- * ### 사진의 최대 폭을 360px로 제한하여 가져오기
- *
- * ```tsx
- * import React, { useState } from 'react';
- * import { View, Image, Button } from 'react-native';
- * import { fetchAlbumPhotos } from '@apps-in-toss/framework';
- *
- * const base64 = true;
- *
- * // 앨범 사진 목록을 가져와 화면에 표시하는 컴포넌트
- * function AlbumPhotoList() {
- *   const [albumPhotos, setAlbumPhotos] = useState([]);
- *
- *   const handlePress = async () => {
- *     try {
- *       const response = await fetchAlbumPhotos({
- *         base64,
- *         maxWidth: 360,
- *       });
- *       setAlbumPhotos((prev) => ([...prev, ...response]));
- *     } catch (error) {
- *       console.error('앨범을 가져오는 데 실패했어요:', error);
- *     }
- *   };
- *
- *   return (
- *     <View>
- *       {albumPhotos.map((image) => {
- *         // base64 형식으로 반환된 이미지를 표시하려면 데이터 URL 스키마 Prefix를 붙여야해요.
- *         const imageUri = base64 ? 'data:image/jpeg;base64,' + image.dataUri : image.dataUri;
- *
- *         return <Image source={{ uri: imageUri }} key={image.id} />;
- *       })}
- *       <Button title="앨범 가져오기" onPress={handlePress} />
- *     </View>
- *   );
- * }
- * ```
- */
-declare function fetchAlbumPhotos(options: FetchAlbumPhotosOptions): Promise<ImageResponse[]>;
-
-interface GetCurrentLocationOptions {
-    /**
-     * 위치 정보를 가져올 정확도 수준이에요.
-     */
-    accuracy: Accuracy;
-}
-/**
- * @public
- * @category 위치 정보
- * @name getCurrentLocation
- * @description 디바이스의 현재 위치 정보를 가져오는 함수예요.
- * 위치 기반 서비스를 구현할 때 사용되고, 한 번만 호출되어 현재 위치를 즉시 반환해요.
- * 예를 들어 지도 앱에서 사용자의 현재 위치를 한 번만 가져올 때, 날씨 앱에서 사용자의 위치를 기반으로 기상 정보를 제공할 때, 매장 찾기 기능에서 사용자의 위치를 기준으로 가까운 매장을 검색할 때 사용하면 유용해요.
- *
- * @param {GetCurrentLocationOptions} options 위치 정보를 가져올 때 사용하는 옵션 객체예요.
- * @param {Accuracy} [options.accuracy] 위치 정보의 정확도 수준이에요. 정확도는 `Accuracy` 타입으로 설정돼요.
- * @returns {Promise<Location>} 디바이스의 위치 정보가 담긴 객체를 반환해요. 자세한 내용은 [Location](/react-native/reference/framework/Types/Location.html)을 참고해주세요.
- *
- * @example
- * ### 디바이스의 현재 위치 정보 가져오기
- *
- * ```tsx
- * import React, { useState } from 'react';
- * import { View, Text, Button } from 'react-native';
- * import { getCurrentLocation } from '@apps-in-toss/framework';
- *
- * // 현재 위치 정보를 가져와 화면에 표시하는 컴포넌트
- * function CurrentPosition() {
- *   const [position, setPosition] = useState(null);
- *
- *   const handlePress = async () => {
- *     try {
- *       const response = await getCurrentLocation({ accuracy: Accuracy.Balanced });
- *       setPosition(response);
- *     } catch (error) {
- *       console.error('위치 정보를 가져오는 데 실패했어요:', error);
- *     }
- *   };
- *
- *   return (
- *     <View>
- *       {position ? (
- *         <Text>위치: {position.coords.latitude}, {position.coords.longitude}</Text>
- *       ) : (
- *         <Text>위치 정보를 아직 가져오지 않았어요</Text>
- *       )}
- *       <Button title="현재 위치 정보 가져오기" onPress={handlePress} />
- *     </View>
- *   );
- * }
- * ```
- */
-declare function getCurrentLocation(options: GetCurrentLocationOptions): Promise<Location>;
-
-interface OpenCameraOptions {
-    /**
-     * 이미지를 Base64 형식으로 반환할지 여부를 나타내는 불리언 값이에요.
-     *
-     * 기본값: `false`.
-     */
-    base64?: boolean;
-    /**
-     * 이미지의 최대 너비를 나타내는 숫자 값이에요.
-     *
-     * 기본값: `1024`.
-     */
-    maxWidth?: number;
-}
-/**
- * @public
- * @category 카메라
- * @name openCamera
- * @description 카메라를 실행해서 촬영된 이미지를 반환하는 함수예요.
- * @param {OpenCameraOptions} options - 카메라 실행 시 사용되는 옵션 객체예요.
- * @param {boolean} [options.base64=false] - 이미지를 Base64 형식으로 반환할지 여부를 나타내는 불리언 값이에요. 기본값은 `false`예요. `true`로 설정하면 `dataUri` 대신 Base64 인코딩된 문자열을 반환해요.
- * @param {number} [options.maxWidth=1024] - 이미지의 최대 너비를 나타내는 숫자 값이에요. 기본값은 `1024`예요.
- * @returns {Promise<ImageResponse>}
- * 촬영된 이미지 정보를 포함한 객체를 반환해요. 반환 객체의 구성은 다음과 같아요:
- * - `id`: 이미지의 고유 식별자예요.
- * - `dataUri`: 이미지 데이터를 표현하는 데이터 URI예요.
- *
- * @example
- * ### 카메라 실행 후 촬영된 사진 가져오기
- *
- * ```tsx
- * import React, { useState } from 'react';
- * import { View, Text, Button, Image } from 'react-native';
- * import { openCamera } from '@apps-in-toss/framework';
- *
- * const base64 = true;
- *
- * // 카메라를 실행하고 촬영된 이미지를 화면에 표시하는 컴포넌트
- * function Camera() {
- *   const [image, setImage] = useState(null);
- *
- *   const handlePress = async () => {
- *     try {
- *       const response = await openCamera({ base64 });
- *       setImage(response);
- *     } catch (error) {
- *       console.error('사진을 가져오는 데 실패했어요:', error);
- *     }
- *   };
- *
- *   // base64 형식으로 반환된 이미지를 표시하려면 데이터 URL 스키마 Prefix를 붙여야해요.
- *   const imageUri = base64 ? 'data:image/jpeg;base64,' + image.dataUri : image.dataUri;
- *
- *   return (
- *     <View>
- *       {image ? (
- *         <Image source={{ uri: imageUri }} style={{ width: 200, height: 200 }} />
- *       ) : (
- *         <Text>사진이 없어요</Text>
- *       )}
- *       <Button title="사진 촬영하기" onPress={handlePress} />
- *     </View>
- *   );
- * }
- * ```
- */
-declare function openCamera(options?: OpenCameraOptions): Promise<ImageResponse>;
+declare function registerApp(container: ComponentType<PropsWithChildren<InitialProps>>, { context, analytics }: AppsInTossProps): (initialProps: InitialProps) => JSX.Element;
 
-/**
- * @public
- * @category 로그인
- * @name appLogin
- * @description 토스 인증으로 로그인해요. 로그인이 완료되면 다시 토스 앱으로 이동해요.
- * @example
- *
- * ### 토스 인증을 통해 로그인을 하는 예제
- *
- * ```tsx
- * import { Button } from 'react-native';
- * import { appLogin } from '@apps-in-toss/framework';
- *
- * function Page() {
- *   const handleLogin = async () => {
- *     const { authorizationCode, referrer } = await appLogin();
- *
- *     // 획득한 인가 코드(`authorizationCode`)와 `referrer`를 서버로 전달해요.
- *   }
- *
- *   return <Button title="로그인" onPress={handleLogin} />;
- * }
- * ```
- */
-declare function appLogin(): Promise<{
-    authorizationCode: string;
-    referrer: "DEFAULT" | "SANDBOX";
-}>;
-
-/**
- * @public
- * @category 환경 확인
- * @kind function
- * @name getOperationalEnvironment
- * @description
- * 현재 실행 중인 앱의 운영 환경을 확인해요.
- * 토스 앱에서 실행 중이라면 `'toss'`, 샌드박스 환경에서 실행 중이라면 `'sandbox'`를 반환해요.
- *
- * 운영 환경은 앱이 실행되는 컨텍스트를 의미하며, 특정 기능의 사용 가능 여부를 판단하는 데 활용할 수 있어요.
- *
- * @returns {'toss' | 'sandbox'}
- * 현재 운영 환경을 나타내는 문자열이에요.
- * - `'toss'`: 토스 앱에서 실행 중이에요.
- * - `'sandbox'`: 샌드박스 환경에서 실행 중이에요.
- *
- * @example
- * ### 현재 운영 환경 확인하기
- *
- * ```tsx
- * import { getOperationalEnvironment } from '@apps-in-toss/framework';
- * import { Text } from 'react-native';
- *
- * function EnvironmentInfo() {
- *   const environment = getOperationalEnvironment();
- *
- *   return (
- *     <Text>현재 운영 환경: {environment}</Text>
- *   );
- * }
- * ```
- */
-declare function getOperationalEnvironment(): 'toss' | 'sandbox';
-
-/**
- * @public
- * @category 환경 확인
- * @name getTossAppVersion
- * @description 토스 앱 버전을 가져옵니다. 예를 들어, `5.206.0`과 같은 형태로 반환돼요. 토스 앱 버전을 로그로 남기거나, 특정 기능이 특정 버전 이상에서만 실행될 때 사용돼요.
- * @signature
- * ```typescript
- * function getTossAppVersion(): string
- * ```
- *
- * @returns {string} 토스 앱 버전
- *
- * @example
- *
- *
- * ### 토스 앱 버전 확인하기
- *
- * ```tsx
- * import { getTossAppVersion } from '@apps-in-toss/framework';
- * import { Text } from 'react-native';
- *
- * export function TossAppVersionPage() {
- *  return (
- *   <Text>{getTossAppVersion()}</Text>
- *  )
- * }
- * ```
- */
-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 저장소
- * @name getItem
- * @description 모바일 앱의 로컬 저장소에서 문자열 데이터를 가져와요. 주로 앱이 종료되었다가 다시 시작해도 데이터가 유지되어야 하는 경우에 사용해요.
- * @param {string} key - 가져올 아이템의 키를 입력해요.
- * @returns {Promise<string | null>} 지정한 키에 저장된 문자열 값을 반환해요. 값이 없으면 `null`을 반환해요.
- * @example
- *
- * ### `my-key`에 저장된 아이템 가져오기
- * ```ts
- * const value = await Storage.getItem('my-key');
- * console.log(value); // 'value'
- * ```
- */
-declare function getItem(key: string): Promise<string | null>;
-/**
- * @public
- * @category 저장소
- * @name setItem
- * @description 모바일 앱의 로컬 저장소에 문자열 데이터를 저장해요. 주로 앱이 종료되었다가 다시 시작해도 데이터가 유지되어야 하는 경우에 사용해요.
- * @param {string} key - 저장할 아이템의 키를 입력해요.
- * @param {string} value - 저장할 아이템의 값을 입력해요.
- * @returns {Promise<void>} 아이템을 성공적으로 저장하면 아무 값도 반환하지 않아요.
- * @example
- *
- * ### `my-key`에 아이템 저장하기
- * ```ts
- * import { Storage } from '@apps-in-toss/framework';
- *
- * await Storage.setItem('my-key', 'value');
- * ```
- */
-declare function setItem(key: string, value: string): Promise<void>;
-/**
- * @public
- * @category 저장소
- * @name removeItem
- * @description 모바일 앱의 로컬 저장소에서 특정 키에 해당하는 아이템을 삭제해요.
- * @param {string} key - 삭제할 아이템의 키를 입력해요.
- * @returns {Promise<void>} 아이템을 삭제하면 아무 값도 반환하지 않아요.
- * @example
- *
- * ### `my-key`에 저장된 아이템 삭제하기
- * ```ts
- * import { Storage } from '@apps-in-toss/framework';
- *
- * await Storage.removeItem('my-key');
- * ```
- */
-declare function removeItem(key: string): Promise<void>;
-/**
- * @public
- * @category 저장소
- * @name clearItems
- * @description 모바일 앱의 로컬 저장소의 모든 아이템을 삭제해요.
- * @returns {Promise<void>} 아이템을 삭제하면 아무 값도 반환하지 않고 저장소가 초기화돼요.
- * @example
- *
- * ### 저장소 초기화하기
- * ```ts
- * import { Storage } from '@apps-in-toss/framework';
- *
- * await Storage.clearItems();
- * ```
- */
-declare function clearItems(): Promise<void>;
-/**
- * @public
- * @category 저장소
- * @name Storage
- * @description 네이티브의 저장소를 사용해요.
- * @property {typeof getItem} [getItem] 모바일 앱의 로컬 저장소에서 아이템을 가져오는 함수예요. 자세한 내용은 [getItem](/react-native/reference/framework/저장소/getItem)을 참고하세요.
- * @property {typeof setItem} [setItem] 모바일 앱의 로컬 저장소에 아이템을 저장하는 함수예요. 자세한 내용은 [setItem](/react-native/reference/framework/저장소/setItem)을 참고하세요.
- * @property {typeof removeItem} [removeItem] 모바일 앱의 로컬 저장소에서 아이템을 삭제하는 함수예요. 자세한 내용은 [removeItem](/react-native/reference/framework/저장소/removeItem)을 참고하세요.
- * @property {typeof clearItems} [clearItems] 모바일 앱의 로컬 저장소를 초기화하는 함수예요. 자세한 내용은 [clearItems](/react-native/reference/framework/저장소/clearItems)을 참고하세요.
- */
-declare const Storage: {
-    getItem: typeof getItem;
-    setItem: typeof setItem;
-    removeItem: typeof removeItem;
-    clearItems: typeof clearItems;
-};
-
-/**
- * @public
- * @category 토스페이
- * @name TossPay
- * @description 토스페이 결제 관련 함수를 모아둔 객체예요.
- * @property {typeof checkoutPayment} [checkoutPayment] 토스페이 결제를 생성하는 함수예요. 자세한 내용은 [checkoutPayment](/react-native/reference/framework/토스페이/checkoutPayment)를 참고하세요.
- * @property {typeof executePayment} [executePayment] 토스페이 결제를 실행하는 함수예요. 자세한 내용은 [executePayment](/react-native/reference/framework/토스페이/executePayment)를 참고하세요.
- */
-declare const TossPay: {
-    checkoutPayment: typeof checkoutPayment;
-    executePayment: typeof executePayment;
+declare const AppsInToss: {
+    registerApp: typeof registerApp;
 };
 
 type GameWebViewProps$1 = WebViewProps$1;
@@ -1256,4 +96,11 @@ 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 };
+declare const Analytics: {
+    init: (options: _apps_in_toss_analytics.AnalyticsConfig) => void;
+    Impression: ({ enabled, impression: impressionType, ...props }: _apps_in_toss_analytics.LoggingImpressionProps) => react_jsx_runtime.JSX.Element;
+    Press: react.ForwardRefExoticComponent<_apps_in_toss_analytics.LoggingPressProps & react.RefAttributes<unknown>>;
+    Area: ({ children, params: _params, ...props }: _apps_in_toss_analytics.LoggingAreaProps) => react_jsx_runtime.JSX.Element;
+};
+
+export { Analytics, AppsInToss, type ExternalWebViewProps, type GameWebViewProps, type PartnerWebViewProps, type UseGeolocationOptions, WebView, type WebViewProps, env, useGeolocation };