@apps-in-toss/web-framework 0.0.22 → 0.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/prebuilt/dev.android.js +1993 -1433
- package/dist/prebuilt/dev.ios.js +1993 -1433
- package/dist/prebuilt/prod.android.js +1 -1
- package/dist/prebuilt/prod.ios.js +1 -1
- package/dist/prebuilt/prod.json +4 -4
- package/dist-web/bridge.d.ts +1 -1
- package/dist-web/bridge.js +1 -1
- package/dist-web/checkoutPayment.d.ts +41 -91
- package/dist-web/eventLog.d.ts +43 -0
- package/dist-web/getTossShareLink.d.ts +3 -2
- package/dist-web/index.d.ts +345 -1
- package/dist-web/index.js +389 -3
- package/package.json +13 -12
- package/dist-web/executePayment.d.ts +0 -266
package/dist/prebuilt/prod.json
CHANGED
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
{
|
|
3
3
|
"platform": "ios",
|
|
4
4
|
"totalModuleCount": 1607,
|
|
5
|
-
"duration":
|
|
6
|
-
"size":
|
|
5
|
+
"duration": 994.5753750000001,
|
|
6
|
+
"size": 435419
|
|
7
7
|
},
|
|
8
8
|
{
|
|
9
9
|
"platform": "android",
|
|
10
10
|
"totalModuleCount": 1607,
|
|
11
|
-
"duration":
|
|
12
|
-
"size":
|
|
11
|
+
"duration": 1003.9547079999998,
|
|
12
|
+
"size": 434798
|
|
13
13
|
}
|
|
14
14
|
]
|
package/dist-web/bridge.d.ts
CHANGED
|
@@ -17,7 +17,7 @@ export * from './getCurrentLocation';
|
|
|
17
17
|
export * from './openCamera';
|
|
18
18
|
export * from './appLogin';
|
|
19
19
|
export * from './checkoutPayment';
|
|
20
|
-
export * from './
|
|
20
|
+
export * from './eventLog';
|
|
21
21
|
export * from './getTossShareLink';
|
|
22
22
|
export * from './getOperationalEnvironment';
|
|
23
23
|
export * from './getTossAppVersion';
|
package/dist-web/bridge.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{createAsyncBridge,createConstantBridge,createEventBridge}from"@apps-in-toss/bridge-core";var createEvents=function(){return{emit:function emit(event,args){for(var callbacks=this.events[event]||[],i=0,length=callbacks.length;i<length;i++){callbacks[i](args)}},events:{},on:function on(event,cb){var _this=this;var _this_events,_event;((_this_events=this.events)[_event=event]||(_this_events[_event]=[])).push(cb);return function(){var _this_events_event;_this.events[event]=(_this_events_event=_this.events[event])===null||_this_events_event===void 0?void 0:_this_events_event.filter(function(i){return cb!==i})}}}};if(typeof window!=="undefined"){window.__BEDROCK_NATIVE_EMITTER=createEvents()}export var closeView=createAsyncBridge("closeView");export var generateHapticFeedback=createAsyncBridge("generateHapticFeedback");export var share=createAsyncBridge("share");export var setSecureScreen=createAsyncBridge("setSecureScreen");export var setScreenAwakeMode=createAsyncBridge("setScreenAwakeMode");export var getNetworkStatus=createAsyncBridge("getNetworkStatus");export var setIosSwipeGestureEnabled=createAsyncBridge("setIosSwipeGestureEnabled");export var openURL=createAsyncBridge("openURL");export var getLocale=createConstantBridge("getLocale");export var getSchemeUri=createConstantBridge("getSchemeUri");export var getPlatformOS=createConstantBridge("getPlatformOS");export var setClipboardText=createAsyncBridge("setClipboardText");export var getClipboardText=createAsyncBridge("getClipboardText");export var fetchContacts=createAsyncBridge("fetchContacts");export var fetchAlbumPhotos=createAsyncBridge("fetchAlbumPhotos");export var Accuracy=function(Accuracy){Accuracy[Accuracy["Lowest"]=1]="Lowest";Accuracy[Accuracy["Low"]=2]="Low";Accuracy[Accuracy["Balanced"]=3]="Balanced";Accuracy[Accuracy["High"]=4]="High";Accuracy[Accuracy["Highest"]=5]="Highest";Accuracy[Accuracy["BestForNavigation"]=6]="BestForNavigation";return Accuracy}({});export var getCurrentLocation=createAsyncBridge("getCurrentLocation");export var openCamera=createAsyncBridge("openCamera");export var appLogin=createAsyncBridge("appLogin");export var checkoutPayment=createAsyncBridge("checkoutPayment");export var
|
|
1
|
+
import{createAsyncBridge,createConstantBridge,createEventBridge}from"@apps-in-toss/bridge-core";var createEvents=function(){return{emit:function emit(event,args){for(var callbacks=this.events[event]||[],i=0,length=callbacks.length;i<length;i++){callbacks[i](args)}},events:{},on:function on(event,cb){var _this=this;var _this_events,_event;((_this_events=this.events)[_event=event]||(_this_events[_event]=[])).push(cb);return function(){var _this_events_event;_this.events[event]=(_this_events_event=_this.events[event])===null||_this_events_event===void 0?void 0:_this_events_event.filter(function(i){return cb!==i})}}}};if(typeof window!=="undefined"){window.__BEDROCK_NATIVE_EMITTER=createEvents()}export var closeView=createAsyncBridge("closeView");export var generateHapticFeedback=createAsyncBridge("generateHapticFeedback");export var share=createAsyncBridge("share");export var setSecureScreen=createAsyncBridge("setSecureScreen");export var setScreenAwakeMode=createAsyncBridge("setScreenAwakeMode");export var getNetworkStatus=createAsyncBridge("getNetworkStatus");export var setIosSwipeGestureEnabled=createAsyncBridge("setIosSwipeGestureEnabled");export var openURL=createAsyncBridge("openURL");export var getLocale=createConstantBridge("getLocale");export var getSchemeUri=createConstantBridge("getSchemeUri");export var getPlatformOS=createConstantBridge("getPlatformOS");export var setClipboardText=createAsyncBridge("setClipboardText");export var getClipboardText=createAsyncBridge("getClipboardText");export var fetchContacts=createAsyncBridge("fetchContacts");export var fetchAlbumPhotos=createAsyncBridge("fetchAlbumPhotos");export var Accuracy=function(Accuracy){Accuracy[Accuracy["Lowest"]=1]="Lowest";Accuracy[Accuracy["Low"]=2]="Low";Accuracy[Accuracy["Balanced"]=3]="Balanced";Accuracy[Accuracy["High"]=4]="High";Accuracy[Accuracy["Highest"]=5]="Highest";Accuracy[Accuracy["BestForNavigation"]=6]="BestForNavigation";return Accuracy}({});export var getCurrentLocation=createAsyncBridge("getCurrentLocation");export var openCamera=createAsyncBridge("openCamera");export var appLogin=createAsyncBridge("appLogin");export var checkoutPayment=createAsyncBridge("checkoutPayment");export var eventLog=createAsyncBridge("eventLog");export var getTossShareLink=createAsyncBridge("getTossShareLink");export var getOperationalEnvironment=createConstantBridge("getOperationalEnvironment");export var getTossAppVersion=createConstantBridge("getTossAppVersion");export var getDeviceId=createConstantBridge("getDeviceId");export var startUpdateLocation=createEventBridge("startUpdateLocation");
|
|
@@ -2,124 +2,74 @@
|
|
|
2
2
|
* @public
|
|
3
3
|
* @category 토스페이
|
|
4
4
|
* @name CheckoutPaymentOptions
|
|
5
|
-
* @description 토스페이
|
|
6
|
-
* @property {string}
|
|
7
|
-
* @property {string} productDesc 상품 설명이에요.
|
|
8
|
-
* @property {number} amount 결제 금액이에요.
|
|
9
|
-
* @property {number} amountTaxFree 결제 금액 중 비과세 금액이에요.
|
|
10
|
-
* @property {number} [amountTaxable] 결제 금액 중 과세 금액이에요.
|
|
11
|
-
* @property {number} [amountVat] 결제 금액 중 부가세예요.
|
|
12
|
-
* @property {number} [amountServiceFee] 결제 금액 중 봉사료예요.
|
|
13
|
-
* @property {'TOSS_MONEY' | 'CARD' | null} [enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
|
|
14
|
-
* @property {boolean} [cashReceipt] 현금영수증 발급 가능 여부예요.
|
|
15
|
-
* @property {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
|
|
16
|
-
* @property {'USE' | 'NO_USE'} [installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
|
|
5
|
+
* @description 토스페이 결제창을 띄울 때 필요한 옵션이에요.
|
|
6
|
+
* @property {string} payToken 결제 토큰이에요.
|
|
17
7
|
*/
|
|
18
8
|
export interface CheckoutPaymentOptions {
|
|
19
9
|
/**
|
|
20
|
-
*
|
|
10
|
+
* 결제 토큰이에요.
|
|
21
11
|
*/
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
*/
|
|
34
|
-
amountTaxFree: number;
|
|
35
|
-
/**
|
|
36
|
-
* 결제 금액 중 과세 금액이에요.
|
|
37
|
-
*/
|
|
38
|
-
amountTaxable?: number;
|
|
39
|
-
/**
|
|
40
|
-
* 결제 금액 중 부가세예요.
|
|
41
|
-
*/
|
|
42
|
-
amountVat?: number;
|
|
43
|
-
/**
|
|
44
|
-
* 결제 금액 중 봉사료예요.
|
|
45
|
-
*/
|
|
46
|
-
amountServiceFee?: number;
|
|
47
|
-
/**
|
|
48
|
-
* 결제수단 구분 변수예요.
|
|
49
|
-
*
|
|
50
|
-
* - 'TOSS_MONEY': 결제수단 중 토스머니만 노출
|
|
51
|
-
* - 'CARD': 결제수단 중 카드만 노출
|
|
52
|
-
* - null: 상점에 설정된 기본 결제 수단 노출
|
|
53
|
-
*/
|
|
54
|
-
enablePayMethods?: "TOSS_MONEY" | "CARD" | null;
|
|
55
|
-
/**
|
|
56
|
-
* 현금영수증 발급 가능 여부예요.
|
|
57
|
-
*/
|
|
58
|
-
cashReceipt?: boolean;
|
|
12
|
+
payToken: string;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* @public
|
|
16
|
+
* @category 토스페이
|
|
17
|
+
* @name CheckoutPaymentResult
|
|
18
|
+
* @description 토스페이 결제창에서 사용자가 인증에 성공했는지 여부예요.
|
|
19
|
+
* @property {boolean} success 인증이 성공했는지 여부예요.
|
|
20
|
+
* @property {string} [reason] 인증이 실패했을 경우의 이유예요.
|
|
21
|
+
*/
|
|
22
|
+
export interface CheckoutPaymentResult {
|
|
59
23
|
/**
|
|
60
|
-
*
|
|
61
|
-
*
|
|
62
|
-
* - 'CULTURE': 문화비
|
|
63
|
-
* - 'GENERAL': 일반(기본값)
|
|
64
|
-
* - 'PUBLIC_TP': 교통비
|
|
24
|
+
* 인증이 성공했는지 여부예요.
|
|
65
25
|
*/
|
|
66
|
-
|
|
26
|
+
success: boolean;
|
|
67
27
|
/**
|
|
68
|
-
*
|
|
69
|
-
*
|
|
70
|
-
* - 'USE': 사용(기본값)
|
|
71
|
-
* - 'NO_USE': 할부 미사용
|
|
28
|
+
* 인증이 실패했을 경우의 이유예요.
|
|
72
29
|
*/
|
|
73
|
-
|
|
30
|
+
reason?: string;
|
|
74
31
|
}
|
|
75
32
|
/**
|
|
76
33
|
* @public
|
|
77
34
|
* @category 토스페이
|
|
78
35
|
* @name checkoutPayment
|
|
79
|
-
* @description 토스페이
|
|
36
|
+
* @description 토스페이 결제창을 띄우고, 사용자 인증을 수행해요. 인증이 완료되면 성공 여부를 반환해요.
|
|
37
|
+
*
|
|
38
|
+
* 이 함수는 결제창을 통해 사용자 인증만 해요. 실제 결제 처리는 인증 성공 후 서버에서 별도로 해야 해요.
|
|
80
39
|
*
|
|
81
|
-
* @param {CheckoutPaymentOptions} options
|
|
82
|
-
* @
|
|
83
|
-
* @param {string} options.productDesc 상품 설명이에요.
|
|
84
|
-
* @param {number} options.amount 결제 금액이에요.
|
|
85
|
-
* @param {number} options.amountTaxFree 결제 금액 중 비과세 금액이에요.
|
|
86
|
-
* @param {number} [options.amountTaxable] 결제 금액 중 과세 금액이에요.
|
|
87
|
-
* @param {number} [options.amountVat] 결제 금액 중 부가세예요.
|
|
88
|
-
* @param {number} [options.amountServiceFee] 결제 금액 중 봉사료예요.
|
|
89
|
-
* @param {'TOSS_MONEY' | 'CARD' | null} [options.enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
|
|
90
|
-
* @param {boolean} [options.cashReceipt] 현금영수증 발급 가능 여부예요.
|
|
91
|
-
* @param {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [options.cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
|
|
92
|
-
* @param {'USE' | 'NO_USE'} [options.installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
|
|
93
|
-
* @returns {Promise<{ payToken: string }>} 결제 인증 후 발급된 결제 토큰 값이 포함된 객체를 반환해요.
|
|
40
|
+
* @param {CheckoutPaymentOptions} options 결제창을 띄울 때 필요한 옵션이에요.
|
|
41
|
+
* @returns {Promise<CheckoutPaymentResult>} 인증 성공 여부를 포함한 결과를 반환해요.
|
|
94
42
|
*
|
|
95
43
|
* @example
|
|
96
|
-
*
|
|
44
|
+
*
|
|
45
|
+
* ### 토스페이 결제창 띄우고 인증 처리하기
|
|
97
46
|
*
|
|
98
47
|
* ```tsx
|
|
99
48
|
* import { TossPay } from '@apps-in-toss/web-framework';
|
|
100
49
|
*
|
|
101
50
|
* async function handlePayment() {
|
|
102
51
|
* try {
|
|
103
|
-
*
|
|
104
|
-
*
|
|
105
|
-
*
|
|
106
|
-
*
|
|
107
|
-
* amountTaxFree: 0,
|
|
108
|
-
* amountTaxable: 13636,
|
|
109
|
-
* amountVat: 1364,
|
|
110
|
-
* enablePayMethods: 'CARD',
|
|
111
|
-
* installment: 'USE'
|
|
112
|
-
* });
|
|
52
|
+
* // 실제 구현 시 결제 생성 역할을 하는 API 엔드포인트로 대체해주세요.
|
|
53
|
+
* const { payToken } = await fetch('/my-api/payment/create').then(res => res.json());
|
|
54
|
+
*
|
|
55
|
+
* const { success, reason } = await TossPay.checkoutPayment({ payToken });
|
|
113
56
|
*
|
|
114
|
-
*
|
|
57
|
+
* if (success) {
|
|
58
|
+
* // 실제 구현 시 결제를 실행하는 API 엔드포인트로 대체해주세요.
|
|
59
|
+
* await fetch('/my-api/payment/execute', {
|
|
60
|
+
* method: 'POST',
|
|
61
|
+
* body: JSON.stringify({ payToken }),
|
|
62
|
+
* headers: { 'Content-Type': 'application/json' },
|
|
63
|
+
* });
|
|
64
|
+
* } else {
|
|
65
|
+
* console.log('인증 실패:', reason);
|
|
66
|
+
* }
|
|
115
67
|
* } catch (error) {
|
|
116
|
-
* console.error('결제
|
|
68
|
+
* console.error('결제 인증 중 오류가 발생했어요:', error);
|
|
117
69
|
* }
|
|
118
70
|
* }
|
|
119
71
|
* ```
|
|
120
72
|
*/
|
|
121
|
-
export declare function checkoutPayment(options: CheckoutPaymentOptions): Promise<
|
|
122
|
-
payToken: string;
|
|
123
|
-
}>;
|
|
73
|
+
export declare function checkoutPayment(options: CheckoutPaymentOptions): Promise<CheckoutPaymentResult>;
|
|
124
74
|
|
|
125
75
|
export {};
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
export type Primitive = string | number | boolean | null | undefined | symbol;
|
|
2
|
+
/**
|
|
3
|
+
* @category 로깅
|
|
4
|
+
* @kind function
|
|
5
|
+
* @name eventLog
|
|
6
|
+
* @description
|
|
7
|
+
* 이벤트 로그를 기록하는 함수예요.
|
|
8
|
+
*
|
|
9
|
+
* 이 함수는 앱 내에서 발생하는 다양한 이벤트를 로깅하는 데 사용돼요. 디버깅, 정보 제공, 경고, 오류 등 다양한 유형의 로그를 기록할 수 있어요. 샌드박스 환경에서는 콘솔에 로그가 출력되고, 실제 환경에서는 로그 시스템에 기록돼요.
|
|
10
|
+
*
|
|
11
|
+
* @param {Object} params 로그 기록에 필요한 매개변수 객체예요.
|
|
12
|
+
* @param {string} params.log_name 로그의 이름이에요.
|
|
13
|
+
* @param {'debug' | 'info' | 'warn' | 'error'} params.log_type 로그의 유형이에요.
|
|
14
|
+
* @param {Record<string, Primitive>} params.params 로그에 포함할 추가 매개변수 객체예요.
|
|
15
|
+
*
|
|
16
|
+
* @returns {Promise<void>} 로그 기록이 완료되면 해결되는 Promise예요.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* ### 이벤트 로그 기록하기
|
|
20
|
+
*
|
|
21
|
+
* ```tsx
|
|
22
|
+
* import { eventLog } from '@apps-in-toss/web-framework';
|
|
23
|
+
*
|
|
24
|
+
* function logUserAction() {
|
|
25
|
+
* eventLog({
|
|
26
|
+
* log_name: 'user_action',
|
|
27
|
+
* log_type: 'info',
|
|
28
|
+
* params: {
|
|
29
|
+
* action: 'button_click',
|
|
30
|
+
* screen: 'main',
|
|
31
|
+
* userId: 12345
|
|
32
|
+
* }
|
|
33
|
+
* });
|
|
34
|
+
* }
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
37
|
+
export declare function eventLog(params: {
|
|
38
|
+
log_name: string;
|
|
39
|
+
log_type: "debug" | "info" | "warn" | "error";
|
|
40
|
+
params: Record<string, Primitive>;
|
|
41
|
+
}): Promise<void>;
|
|
42
|
+
|
|
43
|
+
export {};
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* @kind function
|
|
5
5
|
* @name getTossShareLink
|
|
6
6
|
* @description
|
|
7
|
-
* `getTossShareLink` 함수는 사용자가 지정한 경로를 토스 앱에서 열 수 공유 링크를 반환해요.
|
|
7
|
+
* `getTossShareLink` 함수는 사용자가 지정한 경로를 토스 앱에서 열 수 있는 공유 링크를 반환해요.
|
|
8
8
|
* 이 링크를 다른 사람과 공유하면 토스 앱이 실행되면서 지정한 경로로 진입해요. 토스앱이 없는 사람은 iOS 일 때는 앱스토어로 이동하고, Android 일 때는 플레이스토어로 이동해요.
|
|
9
9
|
*
|
|
10
10
|
* 경로는 토스 앱 내부 특정 화면을 나타내는 딥링크(deep link) 형식이어야 해요.
|
|
@@ -17,7 +17,8 @@
|
|
|
17
17
|
*
|
|
18
18
|
* @example
|
|
19
19
|
* ```tsx
|
|
20
|
-
* import {
|
|
20
|
+
* import { share } from '@apps-in-toss/web-framework';
|
|
21
|
+
* import { getTossShareLink } from '@apps-in-toss/web-framework';
|
|
21
22
|
*
|
|
22
23
|
* // '/' 경로를 딥링크로 포함한 토스 공유 링크를 생성해요.
|
|
23
24
|
* const tossLink = await getTossShareLink('intoss://my-app');
|
package/dist-web/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export * from './bridge';
|
|
2
2
|
export * from '@apps-in-toss/bridge-core';
|
|
3
|
+
import { LoadAdMobInterstitialAdOptions, ShowAdMobInterstitialAdOptions, LoadAdMobRewardedAdOptions, ShowAdMobRewardedAdOptions } from '@apps-in-toss/framework';
|
|
3
4
|
|
|
4
5
|
/**
|
|
5
6
|
* @public
|
|
@@ -86,6 +87,291 @@ declare function getSafeAreaInsets(): {
|
|
|
86
87
|
bottom: number;
|
|
87
88
|
};
|
|
88
89
|
|
|
90
|
+
declare const GoogleAdMob: {
|
|
91
|
+
/**
|
|
92
|
+
* @public
|
|
93
|
+
* @category 광고
|
|
94
|
+
* @name loadAdMobInterstitialAd
|
|
95
|
+
* @description 앱 화면 전체를 덮는 전면 광고를 미리 불러와서, 광고가 필요한 시점에 바로 보여줄 수 있도록 준비하는 함수예요.
|
|
96
|
+
* @param {LoadAdMobInterstitialAdParams} params 광고를 불러올 때 사용할 설정 값이에요. 광고 ID와 광고의 동작에 대한 콜백을 설정할 수 있어요.
|
|
97
|
+
* @param {LoadAdMobInterstitialAdOptions} params.options 광고를 불러올 때 전달할 옵션 객체예요.
|
|
98
|
+
* @param {string} params.options.adUnitId 광고 단위 ID예요. 발급받은 전면 광고용 ID를 입력해요.
|
|
99
|
+
* @param {(event: LoadAdMobInterstitialAdEvent) => void} [params.onEvent] 광고 관련 이벤트가 발생했을 때 호출돼요. (예시: 광고가 닫히거나 클릭됐을 때). 자세한 이벤트 타입은 [LoadAdMobInterstitialAdEvent](/react-native/reference/framework/광고/LoadAdMobInterstitialAdEvent.html)를 참고하세요.
|
|
100
|
+
* @param {(reason: unknown) => void} [params.onError] 광고를 불러오지 못했을 때 호출돼요. (예시: 네트워크 오류나 지원하지 않는 환경일 때)
|
|
101
|
+
* @property {() => boolean} [isSupported] 현재 실행 중인 앱(예: 토스 앱, 개발용 샌드박스 앱 등)에서 Google AdMob 광고 기능을 지원하는지 확인하는 함수예요. 기능을 사용하기 전에 지원 여부를 확인해야 해요.
|
|
102
|
+
*
|
|
103
|
+
* @example
|
|
104
|
+
* ### 뷰 진입 시 전면광고 불러오기
|
|
105
|
+
* ```tsx
|
|
106
|
+
* import { GoogleAdMob } from '@apps-in-toss/framework';
|
|
107
|
+
* import { useEffect } from 'react';
|
|
108
|
+
* import { View, Text } from 'react-native';
|
|
109
|
+
*
|
|
110
|
+
* const AD_UNIT_ID = '<YOUR_AD_UNIT_ID>';
|
|
111
|
+
*
|
|
112
|
+
* function Page() {
|
|
113
|
+
* useEffect(() => {
|
|
114
|
+
* if (GoogleAdMob.loadAdMobInterstitialAd.isSupported() !== true) {
|
|
115
|
+
* return;
|
|
116
|
+
* }
|
|
117
|
+
*
|
|
118
|
+
* const cleanup = GoogleAdMob.loadAdMobInterstitialAd({
|
|
119
|
+
* options: {
|
|
120
|
+
* adUnitId: AD_UNIT_ID,
|
|
121
|
+
* },
|
|
122
|
+
* onEvent: (event) => {
|
|
123
|
+
* switch (event.type) {
|
|
124
|
+
* case 'loaded':
|
|
125
|
+
* console.log('광고 로드 성공', event.data);
|
|
126
|
+
* break;
|
|
127
|
+
*
|
|
128
|
+
* case 'clicked':
|
|
129
|
+
* console.log('광고 클릭');
|
|
130
|
+
* break;
|
|
131
|
+
*
|
|
132
|
+
* case 'dismissed':
|
|
133
|
+
* console.log('광고 닫힘');
|
|
134
|
+
* break;
|
|
135
|
+
*
|
|
136
|
+
* case 'failedToShow':
|
|
137
|
+
* console.log('광고 보여주기 실패');
|
|
138
|
+
* break;
|
|
139
|
+
*
|
|
140
|
+
* case 'impression':
|
|
141
|
+
* console.log('광고 노출');
|
|
142
|
+
* break;
|
|
143
|
+
*
|
|
144
|
+
* case 'show':
|
|
145
|
+
* console.log('광고 컨텐츠 보여졌음');
|
|
146
|
+
* break;
|
|
147
|
+
* }
|
|
148
|
+
* },
|
|
149
|
+
* onError: (error) => {
|
|
150
|
+
* console.error('광고 불러오기 실패', error);
|
|
151
|
+
* },
|
|
152
|
+
* });
|
|
153
|
+
*
|
|
154
|
+
* return cleanup;
|
|
155
|
+
* }, []);
|
|
156
|
+
*
|
|
157
|
+
* return (
|
|
158
|
+
* <View>
|
|
159
|
+
* <Text>Page</Text>
|
|
160
|
+
* </View>
|
|
161
|
+
* );
|
|
162
|
+
* }
|
|
163
|
+
* ```
|
|
164
|
+
*/
|
|
165
|
+
loadAdMobInterstitialAd: ((args: {
|
|
166
|
+
onEvent: (data: void) => void;
|
|
167
|
+
onError: (error: Error) => void;
|
|
168
|
+
options?: LoadAdMobInterstitialAdOptions | undefined;
|
|
169
|
+
}) => () => void) & {
|
|
170
|
+
isSupported: () => boolean;
|
|
171
|
+
};
|
|
172
|
+
/**
|
|
173
|
+
* @public
|
|
174
|
+
* @category 광고
|
|
175
|
+
* @name showAdMobInterstitialAd
|
|
176
|
+
* @description 앱 화면 전체를 덮는 전면 광고를 사용자에게 노출해요. 이 함수는 `loadAdMobInterstitialAd` 로 미리 불러온 광고를 실제로 사용자에게 노출해요.
|
|
177
|
+
* @param {ShowAdMobInterstitialAdParams} params 광고를 보여주기 위해 사용할 설정 값이에요. 광고 ID와과 광고의 동작에 대한 콜백을 설정할 수 있어요.
|
|
178
|
+
* @param {ShowAdMobInterstitialAdOptions} params.options 광고를 보여줄 때 전달할 옵션 객체예요.
|
|
179
|
+
* @param {string} params.options.adUnitId 광고 단위 ID예요. `loadAdMobInterstitialAd` 로 불러온 전면 광고용 ID를 입력해요.
|
|
180
|
+
* @param {(event: ShowAdMobInterstitialAdEvent) => void} [params.onEvent] 광고 관련 이벤트가 발생했을 때 호출돼요. (예시: 광고 노출을 요청했을 때). 자세한 이벤트 타입은 [ShowAdMobInterstitialAdEvent](/react-native/reference/framework/광고/ShowAdMobInterstitialAdEvent.html)를 참고하세요.
|
|
181
|
+
* @param {(reason: unknown) => void} [params.onError] 광고를 노출하지 못했을 때 호출돼요. (예시: 네트워크 오류나 지원하지 않는 환경일 때)
|
|
182
|
+
* @property {() => boolean} [isSupported] 현재 실행 중인 앱(예: 토스 앱, 개발용 샌드박스 앱 등)에서 Google AdMob 광고 기능을 지원하는지 확인하는 함수예요. 기능을 사용하기 전에 지원 여부를 확인해야 해요.
|
|
183
|
+
*
|
|
184
|
+
* @example
|
|
185
|
+
* ### 버튼 눌러 불러온 전면 광고 보여주기
|
|
186
|
+
* ```tsx
|
|
187
|
+
* import { GoogleAdMob } from '@apps-in-toss/framework';
|
|
188
|
+
* import { View, Text, Button } from 'react-native';
|
|
189
|
+
*
|
|
190
|
+
* const AD_UNIT_ID = '<YOUR_AD_UNIT_ID>';
|
|
191
|
+
*
|
|
192
|
+
* function Page() {
|
|
193
|
+
* const handlePress = () => {
|
|
194
|
+
* if (GoogleAdMob.showAdMobInterstitialAd.isSupported() !== true) {
|
|
195
|
+
* return;
|
|
196
|
+
* }
|
|
197
|
+
*
|
|
198
|
+
* GoogleAdMob.showAdMobInterstitialAd({
|
|
199
|
+
* options: {
|
|
200
|
+
* adUnitId: AD_UNIT_ID,
|
|
201
|
+
* },
|
|
202
|
+
* onEvent: (event) => {
|
|
203
|
+
* switch (event.type) {
|
|
204
|
+
* case 'requested':
|
|
205
|
+
* console.log('광고 보여주기 요청 완료');
|
|
206
|
+
* break;
|
|
207
|
+
* }
|
|
208
|
+
* },
|
|
209
|
+
* onError: (error) => {
|
|
210
|
+
* console.error('광고 보여주기 실패', error);
|
|
211
|
+
* },
|
|
212
|
+
* });
|
|
213
|
+
* }
|
|
214
|
+
*
|
|
215
|
+
* return (
|
|
216
|
+
* <Button onPress={handlePress}>
|
|
217
|
+
* <Text>광고 보기</Text>
|
|
218
|
+
* </Button>
|
|
219
|
+
* );
|
|
220
|
+
* }
|
|
221
|
+
* ```
|
|
222
|
+
*/
|
|
223
|
+
showAdMobInterstitialAd: ((args: {
|
|
224
|
+
onEvent: (data: void) => void;
|
|
225
|
+
onError: (error: Error) => void;
|
|
226
|
+
options?: ShowAdMobInterstitialAdOptions | undefined;
|
|
227
|
+
}) => () => void) & {
|
|
228
|
+
isSupported: () => boolean;
|
|
229
|
+
};
|
|
230
|
+
/**
|
|
231
|
+
* @public
|
|
232
|
+
* @category 광고
|
|
233
|
+
* @name loadAdMobRewardedAd
|
|
234
|
+
* @description 사용자가 광고를 끝까지 시청하면 리워드를 제공할 수 있는 보상형 광고를 미리 불러와서, 광고가 필요한 시점에 바로 보여줄 수 있도록 준비하는 함수예요.
|
|
235
|
+
* @param {LoadAdMobRewardedAdParams} params 광고를 불러올 때 사용할 설정 값이에요. 광고 ID와 광고의 동작에 대한 콜백을 설정할 수 있어요.
|
|
236
|
+
* @param {LoadAdMobRewardedAdOptions} params.options 광고를 불러올 때 전달할 옵션 객체예요.
|
|
237
|
+
* @param {string} params.options.adUnitId 광고 단위 ID예요. 발급받은 보상형 광고용 ID를 입력해요.
|
|
238
|
+
* @param {(event: LoadAdMobRewardedAdEvent) => void} [params.onEvent] 광고 관련 이벤트가 발생했을 때 호출돼요. (예시: 광고가 닫히거나 클릭됐을 때). 자세한 이벤트 타입은 [LoadAdMobRewardedAdEvent](/react-native/reference/framework/광고/LoadAdMobRewardedAdEvent.html)를 참고하세요.
|
|
239
|
+
* @param {(reason: unknown) => void} [params.onError] 광고를 불러오지 못했을 때 호출돼요. (예시: 네트워크 오류나 지원하지 않는 환경일 때)
|
|
240
|
+
* @property {() => boolean} [isSupported] 현재 실행 중인 앱(예: 토스 앱, 개발용 샌드박스 앱 등)에서 Google AdMob 광고 기능을 지원하는지 확인하는 함수예요. 기능을 사용하기 전에 지원 여부를 확인해야 해요.
|
|
241
|
+
*
|
|
242
|
+
* @example
|
|
243
|
+
* ### 뷰 진입 시 보상형 광고 불러오기
|
|
244
|
+
* ```tsx
|
|
245
|
+
* import { GoogleAdMob } from '@apps-in-toss/framework';
|
|
246
|
+
* import { useEffect } from 'react';
|
|
247
|
+
* import { View, Text } from 'react-native';
|
|
248
|
+
*
|
|
249
|
+
* const AD_UNIT_ID = '<YOUR_AD_UNIT_ID>';
|
|
250
|
+
*
|
|
251
|
+
* function Page() {
|
|
252
|
+
* useEffect(() => {
|
|
253
|
+
* if (GoogleAdMob.loadAdMobRewardedAd.isSupported() !== true) {
|
|
254
|
+
* return;
|
|
255
|
+
* }
|
|
256
|
+
*
|
|
257
|
+
* const cleanup = GoogleAdMob.loadAdMobRewardedAd({
|
|
258
|
+
* options: {
|
|
259
|
+
* adUnitId: AD_UNIT_ID,
|
|
260
|
+
* },
|
|
261
|
+
* onEvent: (event) => {
|
|
262
|
+
* switch (event.type) {
|
|
263
|
+
* case 'loaded':
|
|
264
|
+
* console.log('광고 로드 성공', event.data);
|
|
265
|
+
* break;
|
|
266
|
+
*
|
|
267
|
+
* case 'clicked':
|
|
268
|
+
* console.log('광고 클릭');
|
|
269
|
+
* break;
|
|
270
|
+
*
|
|
271
|
+
* case 'dismissed':
|
|
272
|
+
* console.log('광고 닫힘');
|
|
273
|
+
* break;
|
|
274
|
+
*
|
|
275
|
+
* case 'failedToShow':
|
|
276
|
+
* console.log('광고 보여주기 실패');
|
|
277
|
+
* break;
|
|
278
|
+
*
|
|
279
|
+
* case 'impression':
|
|
280
|
+
* console.log('광고 노출');
|
|
281
|
+
* break;
|
|
282
|
+
*
|
|
283
|
+
* case 'show':
|
|
284
|
+
* console.log('광고 컨텐츠 보여졌음');
|
|
285
|
+
* break;
|
|
286
|
+
*
|
|
287
|
+
* case 'userEarnedReward':
|
|
288
|
+
* console.log('사용자가 광고 시청을 완료했음');
|
|
289
|
+
* break;
|
|
290
|
+
* }
|
|
291
|
+
* },
|
|
292
|
+
* onError: (error) => {
|
|
293
|
+
* console.error('광고 불러오기 실패', error);
|
|
294
|
+
* },
|
|
295
|
+
* });
|
|
296
|
+
*
|
|
297
|
+
* return cleanup;
|
|
298
|
+
* }, []);
|
|
299
|
+
*
|
|
300
|
+
* return (
|
|
301
|
+
* <View>
|
|
302
|
+
* <Text>Page</Text>
|
|
303
|
+
* </View>
|
|
304
|
+
* );
|
|
305
|
+
* }
|
|
306
|
+
* ```
|
|
307
|
+
*/
|
|
308
|
+
loadAdMobRewardedAd: ((args: {
|
|
309
|
+
onEvent: (data: void) => void;
|
|
310
|
+
onError: (error: Error) => void;
|
|
311
|
+
options?: LoadAdMobRewardedAdOptions | undefined;
|
|
312
|
+
}) => () => void) & {
|
|
313
|
+
isSupported: () => boolean;
|
|
314
|
+
};
|
|
315
|
+
/**
|
|
316
|
+
* @public
|
|
317
|
+
* @category 광고
|
|
318
|
+
* @name showAdMobRewardedAd
|
|
319
|
+
* @description 사용자가 광고를 끝까지 보면 리워드를 받을 수 있도록, 보상형 광고를 화면에 보여줘요. 이 함수는 `loadAdMobRewardedAd` 로 미리 불러온 광고를 실제로 사용자에게 노출해요.
|
|
320
|
+
* @param {ShowAdMobRewardedAdParams} params 광고를 보여주기 위해 사용할 설정 값이에요. 광고 ID와 광고의 동작에 대한 콜백을 설정할 수 있어요.
|
|
321
|
+
* @param {ShowAdMobRewardedAdOptions} params.options 광고를 보여줄 때 전달할 옵션 객체예요.
|
|
322
|
+
* @param {string} params.options.adUnitId 광고 단위 ID예요. `loadAdMobRewardedAd` 로 불러온 보상형 광고용 ID를 입력해요.
|
|
323
|
+
* @param {(event: ShowAdMobRewardedAdEvent) => void} [params.onEvent] 광고 관련 이벤트가 발생했을 때 호출돼요. (예시: 광고 노출을 요청했을 때). 자세한 이벤트 타입은 [ShowAdMobRewardedAdEvent](/react-native/reference/framework/광고/ShowAdMobRewardedAdEvent.html)를 참고하세요.
|
|
324
|
+
* @param {(reason: unknown) => void} [params.onError] 광고를 불러오지 못했을 때 호출돼요. (예시: 네트워크 오류나 지원하지 않는 환경일 때)
|
|
325
|
+
* @property {() => boolean} [isSupported] 현재 실행 중인 앱(예: 토스 앱, 개발용 샌드박스 앱 등)에서 Google AdMob 광고 기능을 지원하는지 확인하는 함수예요. 기능을 사용하기 전에 지원 여부를 확인해야 해요.
|
|
326
|
+
*
|
|
327
|
+
* @example
|
|
328
|
+
* ### 버튼 눌러 불러온 보상형 광고 보여주기
|
|
329
|
+
* ```tsx
|
|
330
|
+
* import { GoogleAdMob } from '@apps-in-toss/framework';
|
|
331
|
+
* import { View, Text, Button } from 'react-native';
|
|
332
|
+
*
|
|
333
|
+
* const AD_UNIT_ID = '<YOUR_AD_UNIT_ID>';
|
|
334
|
+
*
|
|
335
|
+
* function Page() {
|
|
336
|
+
* const handlePress = () => {
|
|
337
|
+
* if (GoogleAdMob.showAdMobRewardedAd.isSupported() !== true) {
|
|
338
|
+
* return;
|
|
339
|
+
* }
|
|
340
|
+
*
|
|
341
|
+
* GoogleAdMob.showAdMobRewardedAd({
|
|
342
|
+
* options: {
|
|
343
|
+
* adUnitId: AD_UNIT_ID,
|
|
344
|
+
* },
|
|
345
|
+
* onEvent: (event) => {
|
|
346
|
+
* switch (event.type) {
|
|
347
|
+
* case 'requested':
|
|
348
|
+
* console.log('광고 보여주기 요청 완료');
|
|
349
|
+
* break;
|
|
350
|
+
* }
|
|
351
|
+
* },
|
|
352
|
+
* onError: (error) => {
|
|
353
|
+
* console.error('광고 보여주기 실패', error);
|
|
354
|
+
* },
|
|
355
|
+
* });
|
|
356
|
+
* }
|
|
357
|
+
*
|
|
358
|
+
* return (
|
|
359
|
+
* <Button onPress={handlePress}>
|
|
360
|
+
* <Text>광고 보기</Text>
|
|
361
|
+
* </Button>
|
|
362
|
+
* );
|
|
363
|
+
* }
|
|
364
|
+
* ```
|
|
365
|
+
*/
|
|
366
|
+
showAdMobRewardedAd: ((args: {
|
|
367
|
+
onEvent: (data: void) => void;
|
|
368
|
+
onError: (error: Error) => void;
|
|
369
|
+
options?: ShowAdMobRewardedAdOptions | undefined;
|
|
370
|
+
}) => () => void) & {
|
|
371
|
+
isSupported: () => boolean;
|
|
372
|
+
};
|
|
373
|
+
};
|
|
374
|
+
|
|
89
375
|
type BedrockEvent = {
|
|
90
376
|
backEvent: {
|
|
91
377
|
onEvent: () => void;
|
|
@@ -101,4 +387,62 @@ declare const bedrockEvent: {
|
|
|
101
387
|
}) => () => void;
|
|
102
388
|
};
|
|
103
389
|
|
|
104
|
-
|
|
390
|
+
/**
|
|
391
|
+
* @public
|
|
392
|
+
* @category 환경 확인
|
|
393
|
+
* @kind function
|
|
394
|
+
* @name isMinVersionSupported
|
|
395
|
+
* @description
|
|
396
|
+
* 현재 토스 앱 버전이 지정한 최소 버전 이상인지 확인해요.
|
|
397
|
+
*
|
|
398
|
+
* 이 함수는 현재 실행 중인 토스 앱의 버전이 파라미터로 전달된 최소 버전 요구사항을 충족하는지 확인해요. 특정 기능이 최신 버전에서만 동작할 때, 사용자에게 앱 업데이트를 안내할 수 있어요.
|
|
399
|
+
*
|
|
400
|
+
* @param {Object} minVersions 플랫폼별 최소 버전 요구사항을 지정하는 객체예요.
|
|
401
|
+
* @param {(`${number}.${number}.${number}` | 'always' | 'never')} minVersions.android 안드로이드 플랫폼의 최소 버전 요구사항이에요.
|
|
402
|
+
* @param {(`${number}.${number}.${number}` | 'always' | 'never')} minVersions.ios iOS 플랫폼의 최소 버전 요구사항이에요.
|
|
403
|
+
* @returns {boolean} 현재 앱 버전이 최소 버전 이상이면 true, 그렇지 않으면 false를 반환해요.
|
|
404
|
+
*
|
|
405
|
+
* @example
|
|
406
|
+
* ### 앱 버전 확인하기
|
|
407
|
+
*
|
|
408
|
+
* ```tsx
|
|
409
|
+
* import { isMinVersionSupported } from '@apps-in-toss/framework';
|
|
410
|
+
* import { Text, View } from 'react-native';
|
|
411
|
+
*
|
|
412
|
+
* function VersionCheck() {
|
|
413
|
+
* const isSupported = isMinVersionSupported({
|
|
414
|
+
* android: '1.2.0',
|
|
415
|
+
* ios: '1.3.0'
|
|
416
|
+
* });
|
|
417
|
+
*
|
|
418
|
+
* return (
|
|
419
|
+
* <View>
|
|
420
|
+
* {!isSupported && (
|
|
421
|
+
* <Text>최신 버전으로 업데이트가 필요해요.</Text>
|
|
422
|
+
* )}
|
|
423
|
+
* </View>
|
|
424
|
+
* );
|
|
425
|
+
* }
|
|
426
|
+
* ```
|
|
427
|
+
*/
|
|
428
|
+
declare function isMinVersionSupported(minVersions: {
|
|
429
|
+
android: `${number}.${number}.${number}` | 'always' | 'never';
|
|
430
|
+
ios: `${number}.${number}.${number}` | 'always' | 'never';
|
|
431
|
+
}): boolean;
|
|
432
|
+
|
|
433
|
+
type AppsInTossEvent = {
|
|
434
|
+
entryMessageExited: {
|
|
435
|
+
onEvent: () => void;
|
|
436
|
+
onError?: (error: Error) => void;
|
|
437
|
+
options: undefined;
|
|
438
|
+
};
|
|
439
|
+
};
|
|
440
|
+
declare const appsInTossEvent: {
|
|
441
|
+
addEventListener: <K extends keyof AppsInTossEvent>(event: K, { onEvent, onError, options, }: {
|
|
442
|
+
onEvent: AppsInTossEvent[K]["onEvent"];
|
|
443
|
+
onError?: AppsInTossEvent[K]["onError"] | undefined;
|
|
444
|
+
options?: AppsInTossEvent[K]["options"] | undefined;
|
|
445
|
+
}) => () => void;
|
|
446
|
+
};
|
|
447
|
+
|
|
448
|
+
export { type AppsInTossEvent, type BedrockEvent, GoogleAdMob, Storage, appsInTossEvent, bedrockEvent, getSafeAreaInsets, isMinVersionSupported };
|