@apps-in-toss/framework 0.0.13 → 0.0.14

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/index.cjs CHANGED
@@ -32,6 +32,7 @@ var src_exports = {};
32
32
  __export(src_exports, {
33
33
  Accuracy: () => Accuracy2,
34
34
  AppsInToss: () => AppsInToss,
35
+ TossPay: () => TossPay,
35
36
  WebView: () => WebView,
36
37
  appLogin: () => appLogin,
37
38
  env: () => env,
@@ -146,6 +147,16 @@ function startUpdateLocation(eventParams) {
146
147
  return appsInTossEvent.addEventListener("updateLocationEvent", eventParams);
147
148
  }
148
149
 
150
+ // src/native-modules/checkoutPayment.ts
151
+ async function checkoutPayment(options) {
152
+ return AppsInTossModule.checkoutPayment(options);
153
+ }
154
+
155
+ // src/native-modules/executePayment.ts
156
+ async function executePayment(options) {
157
+ return AppsInTossModule.executePayment(options);
158
+ }
159
+
149
160
  // src/native-modules/setClipboardText.ts
150
161
  async function setClipboardText(text) {
151
162
  const permissionStatus = await requestPermission({ name: "clipboard", access: "write" });
@@ -232,6 +243,12 @@ function getOperationalEnvironment() {
232
243
  return AppsInTossModule.operationalEnvironment;
233
244
  }
234
245
 
246
+ // src/native-modules/index.ts
247
+ var TossPay = {
248
+ checkoutPayment,
249
+ executePayment
250
+ };
251
+
235
252
  // src/components/WebView.tsx
236
253
  var import_react_native_webview = require("@react-native-bedrock/native/react-native-webview");
237
254
  var import_react = require("react");
@@ -243,6 +260,8 @@ var bedrockConstantBridges = __toESM(require("react-native-bedrock/constant-brid
243
260
  var async_bridges_exports = {};
244
261
  __export(async_bridges_exports, {
245
262
  appLogin: () => appLogin,
263
+ checkoutPayment: () => checkoutPayment,
264
+ executePayment: () => executePayment,
246
265
  fetchAlbumPhotos: () => fetchAlbumPhotos,
247
266
  fetchContacts: () => fetchContacts,
248
267
  getClipboardText: () => getClipboardText,
@@ -355,6 +374,7 @@ var Accuracy2 = /* @__PURE__ */ ((Accuracy3) => {
355
374
  0 && (module.exports = {
356
375
  Accuracy,
357
376
  AppsInToss,
377
+ TossPay,
358
378
  WebView,
359
379
  appLogin,
360
380
  env,
package/dist/index.d.cts CHANGED
@@ -206,6 +206,395 @@ declare function startUpdateLocation(eventParams: {
206
206
  options: StartUpdateLocationOptions;
207
207
  }): () => void;
208
208
 
209
+ /**
210
+ * @public
211
+ * @category 토스페이
212
+ * @name CheckoutPaymentOptions
213
+ * @description 토스페이 결제를 생성할 때 필요한 옵션 객체예요.
214
+ * @property {string} orderNo 가맹점의 상품 주문번호예요.
215
+ * @property {string} productDesc 상품 설명이에요.
216
+ * @property {number} amount 결제 금액이에요.
217
+ * @property {number} amountTaxFree 결제 금액 중 비과세 금액이에요.
218
+ * @property {number} [amountTaxable] 결제 금액 중 과세 금액이에요.
219
+ * @property {number} [amountVat] 결제 금액 중 부가세예요.
220
+ * @property {number} [amountServiceFee] 결제 금액 중 봉사료예요.
221
+ * @property {'TOSS_MONEY' | 'CARD' | null} [enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
222
+ * @property {boolean} [cashReceipt] 현금영수증 발급 가능 여부예요.
223
+ * @property {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
224
+ * @property {'USE' | 'NO_USE'} [installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
225
+ */
226
+ interface CheckoutPaymentOptions {
227
+ /**
228
+ * 가맹점의 상품 주문번호에요.
229
+ */
230
+ orderNo: string;
231
+ /**
232
+ * 상품 설명이에요.
233
+ */
234
+ productDesc: string;
235
+ /**
236
+ * 결제 금액이예요.
237
+ */
238
+ amount: number;
239
+ /**
240
+ * 결제 금액 중 비과세 금액이에요.
241
+ */
242
+ amountTaxFree: number;
243
+ /**
244
+ * 결제 금액 중 과세 금액이에요.
245
+ */
246
+ amountTaxable?: number;
247
+ /**
248
+ * 결제 금액 중 부가세예요.
249
+ */
250
+ amountVat?: number;
251
+ /**
252
+ * 결제 금액 중 봉사료예요.
253
+ */
254
+ amountServiceFee?: number;
255
+ /**
256
+ * 결제수단 구분 변수예요.
257
+ *
258
+ * - 'TOSS_MONEY': 결제수단 중 토스머니만 노출
259
+ * - 'CARD': 결제수단 중 카드만 노출
260
+ * - null: 상점에 설정된 기본 결제 수단 노출
261
+ */
262
+ enablePayMethods?: 'TOSS_MONEY' | 'CARD' | null;
263
+ /**
264
+ * 현금영수증 발급 가능 여부예요.
265
+ */
266
+ cashReceipt?: boolean;
267
+ /**
268
+ * 현금영수증 발급 타입이에요.
269
+ *
270
+ * - 'CULTURE': 문화비
271
+ * - 'GENERAL': 일반(기본값)
272
+ * - 'PUBLIC_TP': 교통비
273
+ */
274
+ cashReceiptTradeOption?: 'CULTURE' | 'GENERAL' | 'PUBLIC_TP';
275
+ /**
276
+ * 할부를 사용할 지 말 지 여부에요.
277
+ *
278
+ * - 'USE': 사용(기본값)
279
+ * - 'NO_USE': 할부 미사용
280
+ */
281
+ installment?: 'USE' | 'NO_USE';
282
+ }
283
+ /**
284
+ * @public
285
+ * @category 토스페이
286
+ * @name checkoutPayment
287
+ * @description 토스페이 결제를 생성하는 함수예요.
288
+ *
289
+ * @param {CheckoutPaymentOptions} options 결제를 생성할 때 필요한 옵션 객체예요.
290
+ * @param {string} options.orderNo 가맹점의 상품 주문번호예요.
291
+ * @param {string} options.productDesc 상품 설명이에요.
292
+ * @param {number} options.amount 결제 금액이에요.
293
+ * @param {number} options.amountTaxFree 결제 금액 중 비과세 금액이에요.
294
+ * @param {number} [options.amountTaxable] 결제 금액 중 과세 금액이에요.
295
+ * @param {number} [options.amountVat] 결제 금액 중 부가세예요.
296
+ * @param {number} [options.amountServiceFee] 결제 금액 중 봉사료예요.
297
+ * @param {'TOSS_MONEY' | 'CARD' | null} [options.enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
298
+ * @param {boolean} [options.cashReceipt] 현금영수증 발급 가능 여부예요.
299
+ * @param {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [options.cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
300
+ * @param {'USE' | 'NO_USE'} [options.installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
301
+ * @returns {Promise<{ payToken: string }>} 결제 인증 후 발급된 결제 토큰 값이 포함된 객체를 반환해요.
302
+ *
303
+ * @example
304
+ * ### 결제 생성하기
305
+ *
306
+ * ```tsx
307
+ * import { TossPay } from '@apps-in-toss/framework';
308
+ *
309
+ * async function handlePayment() {
310
+ * try {
311
+ * const result = await TossPay.checkoutPayment({
312
+ * orderNo: 'ORDER_12345',
313
+ * productDesc: '티셔츠',
314
+ * amount: 15000,
315
+ * amountTaxFree: 0,
316
+ * amountTaxable: 13636,
317
+ * amountVat: 1364,
318
+ * enablePayMethods: 'CARD',
319
+ * installment: 'USE'
320
+ * });
321
+ *
322
+ * console.log('결제 토큰:', result.payToken);
323
+ * } catch (error) {
324
+ * console.error('결제 생성에 실패했어요:', error);
325
+ * }
326
+ * }
327
+ * ```
328
+ */
329
+ declare function checkoutPayment(options: CheckoutPaymentOptions): Promise<{
330
+ payToken: string;
331
+ }>;
332
+
333
+ /**
334
+ * @public
335
+ * @category 토스페이
336
+ * @name ExecutePaymentOptions
337
+ * @description 생성한 토스페이 결제를 실행할 때 필요한 옵션이에요.
338
+ * @property {string} orderNo 결제를 생성할 때 사용한 주문번호예요.
339
+ * @property {string} payToken 결제 인증 과정에서 전달받은 결제 토큰이에요. 결제를 실행할 때 사용해요.
340
+ */
341
+ interface ExecutePaymentOptions {
342
+ /**
343
+ * 결제를 생성할 때 사용한 주문번호예요.
344
+ */
345
+ orderNo: string;
346
+ /**
347
+ * 결제 인증 과정에서 전달받은 Pay 토큰이에요.
348
+ */
349
+ payToken: string;
350
+ }
351
+ /**
352
+ * @public
353
+ * @category 토스페이
354
+ * @name CardExecutePaymentResult
355
+ * @description 카드로 결제 요청을 실행한 뒤 돌아오는 결제 결과 객체예요. 결제 승인 여부, 결제된 금액, 주문 정보 등을 담고 있어요.
356
+ * @property {'CARD'} payMethod 결제 수단이에요.
357
+ * @property {number} code 결제 요청의 결과 코드예요.
358
+ * @property {'LIVE' | 'TEST'} mode 현재 결제 환경이에요.
359
+ * @property {string} orderNo 주문번호예요.
360
+ * @property {number} amount 총 결제 금액이에요.
361
+ * @property {string} approvalTime 결제가 승인된 시간이에요. (ISO 8601 형식)
362
+ * @property {string} stateMsg 결제 상태 메시지예요.
363
+ * @property {number} discountedAmount 적용된 할인 금액이에요.
364
+ * @property {number} paidAmount 실제 결제된 금액이에요.
365
+ * @property {string} payToken 결제 요청 시 사용한 Pay 토큰이에요.
366
+ * @property {string} transactionId 거래 ID예요.
367
+ * @property {number} cardCompanyCode 카드사 코드예요.
368
+ * @property {string} cardCompanyName 카드사 이름이에요.
369
+ * @property {string} cardAuthorizationNo 카드사 승인 번호예요. (라이브 결제 환경에서만 확인 가능해요)
370
+ * @property {number} spreadOut 할부 개월 수예요. (5만원 미만 금액 및 일시불 결제의 경우에는 `0`)
371
+ * @property {boolean} noInterest 무이자 할부 여부예요.
372
+ * @property {string} salesCheckLinkUrl 결제 내역을 확인할 수 있는 매출전표 URL이에요.
373
+ * @property {'CREDIT' | 'CHECK' | 'PREPAYMENT'} cardMethodType 카드 유형이에요.
374
+ * @property {string} cardNumber 마스킹된 카드 번호예요. (`****-****-****-1234` 형식)
375
+ * @property {string} cardNum4Print 카드 번호의 마지막 4자리예요.
376
+ * @property {string} cardBinNumber 카드 BIN 번호예요.
377
+ */
378
+ interface CardExecutePaymentResult {
379
+ /**
380
+ * 결제 수단이에요.
381
+ */
382
+ payMethod: 'CARD';
383
+ /**
384
+ * 결제 요청의 결과 코드예요.
385
+ */
386
+ code: number;
387
+ /**
388
+ * 현재 결제 환경이에요.
389
+ *
390
+ * - `LIVE`: 실제 환경
391
+ * - `TEST`: 테스트 환경
392
+ */
393
+ mode: 'LIVE' | 'TEST';
394
+ /**
395
+ * 주문번호예요.
396
+ */
397
+ orderNo: string;
398
+ /**
399
+ * 총 결제 금액이에요.
400
+ */
401
+ amount: number;
402
+ /**
403
+ * 결제가 승인된 시간이에요. (ISO 8601 형식)
404
+ */
405
+ approvalTime: string;
406
+ /**
407
+ * 결제 상태 메시지예요.
408
+ */
409
+ stateMsg: string;
410
+ /**
411
+ * 적용된 할인 금액이에요.
412
+ */
413
+ discountedAmount: number;
414
+ /**
415
+ * 실제 결제된 금액이에요.
416
+ */
417
+ paidAmount: number;
418
+ /**
419
+ * 결제 요청 시 사용한 Pay 토큰이에요.
420
+ */
421
+ payToken: string;
422
+ /**
423
+ * 거래 ID예요.
424
+ */
425
+ transactionId: string;
426
+ /**
427
+ * 카드사 코드예요.
428
+ */
429
+ cardCompanyCode: number;
430
+ /**
431
+ * 카드사 이름이에요.
432
+ */
433
+ cardCompanyName: string;
434
+ /**
435
+ * 카드사 승인 번호예요. (라이브 결제 환경에서만 확인 가능해요)
436
+ */
437
+ cardAuthorizationNo: string;
438
+ /**
439
+ * 할부 개월 수예요. (5만원 미만 금액 및 일시불 결제의 경우에는 `0`)
440
+ */
441
+ spreadOut: number;
442
+ /**
443
+ * 무이자 할부 여부예요.
444
+ */
445
+ noInterest: boolean;
446
+ /**
447
+ * 결제 내역을 확인할 수 있는 매출전표 URL이에요.
448
+ */
449
+ salesCheckLinkUrl: string;
450
+ /**
451
+ * 카드 유형이에요.
452
+ *
453
+ * - 'CREDIT': 신용카드
454
+ * - 'CHECK': 체크카드
455
+ * - 'PREPAYMENT': 선불카드
456
+ */
457
+ cardMethodType: 'CREDIT' | 'CHECK' | 'PREPAYMENT';
458
+ /**
459
+ * 마스킹된 카드 번호예요. (`****-****-****-1234` 형식)
460
+ */
461
+ cardNumber: string;
462
+ /**
463
+ * 카드 사용자 구분을 나타내는 값이에요.
464
+ *
465
+ * - 'PERSONAL': 개인 카드
466
+ * - 'PERSONAL_FAMILY': 가족 카드
467
+ * - 'CORP_PERSONAL': 법인지정 결제계좌 (임직원)
468
+ * - 'CORP_PRIVATE': 법인 공용
469
+ * - 'CORP_COMPANY': 법인지정 결제계좌 회사 (하나카드 Only)
470
+ */
471
+ cardUserType: 'PERSONAL' | 'PERSONAL_FAMILY' | 'CORP_PERSONAL' | 'CORP_PRIVATE' | 'CORP_COMPANY';
472
+ /**
473
+ * 카드 번호의 마지막 4자리예요.
474
+ */
475
+ cardNum4Print: string;
476
+ /**
477
+ * 카드 BIN 번호예요.
478
+ */
479
+ cardBinNumber: string;
480
+ }
481
+ /**
482
+ * @public
483
+ * @category 토스페이
484
+ * @name TossMoneyExecutePaymentResult
485
+ * @description 토스머니로 결제 요청을 실행한 뒤 돌아오는 결제 결과 객체예요. 결제 승인 여부, 결제된 금액, 주문 정보 등을 담고 있어요.
486
+ * @property {'TOSS_MONEY'} payMethod 결제 수단이에요.
487
+ * @property {number} code 결제 요청의 결과 코드예요.
488
+ * @property {'LIVE' | 'TEST'} mode 현재 결제 환경이에요.
489
+ * @property {string} orderNo 주문번호예요.
490
+ * @property {number} amount 총 결제 금액이에요.
491
+ * @property {string} approvalTime 결제가 승인된 시간이에요. (ISO 8601 형식)
492
+ * @property {string} stateMsg 결제 상태 메시지예요.
493
+ * @property {number} discountedAmount 적용된 할인 금액이에요.
494
+ * @property {number} paidAmount 실제 결제된 금액이에요.
495
+ * @property {string} payToken 결제 요청 시 사용한 Pay 토큰이에요.
496
+ * @property {string} transactionId 거래 ID예요.
497
+ * @property {string} cashReceiptMgtKey 현금영수증 관리번호 식별값이에요.
498
+ * @property {string} accountBankName 결제된 은행의 코드예요.
499
+ * @property {string} accountNumber 결제된 계좌번호예요.
500
+ */
501
+ interface TossMoneyExecutePaymentResult {
502
+ /**
503
+ * 결제에 사용된 결제 수단이에요.
504
+ */
505
+ payMethod: 'TOSS_MONEY';
506
+ /**
507
+ * 결제 요청의 결과 코드예요.
508
+ */
509
+ code: number;
510
+ /**
511
+ * 현재 결제 환경이에요.
512
+ *
513
+ * - `LIVE`: 실제 환경
514
+ * - `TEST`: 테스트 환경
515
+ */
516
+ mode: 'LIVE' | 'TEST';
517
+ /**
518
+ * 결제 승인된 상품의 주문번호예요.
519
+ */
520
+ orderNo: string;
521
+ /**
522
+ * 결제 승인된 상품의 총 결제 금액이에요.
523
+ */
524
+ amount: number;
525
+ /**
526
+ * 결제가 승인된 시간이에요. (ISO 8601 형식)
527
+ */
528
+ approvalTime: string;
529
+ /**
530
+ * 결제 상태 메시지예요.
531
+ */
532
+ stateMsg: string;
533
+ /**
534
+ * 적용된 할인 금액이에요.
535
+ */
536
+ discountedAmount: number;
537
+ /**
538
+ * 실제 결제 승인된 금액이에요.
539
+ */
540
+ paidAmount: number;
541
+ /**
542
+ * 결제 요청 시 사용한 Pay 토큰이에요.
543
+ */
544
+ payToken: string;
545
+ /**
546
+ * 거래 ID예요.
547
+ */
548
+ transactionId: string;
549
+ /**
550
+ * 현금영수증 관리번호 식별값이에요.
551
+ */
552
+ cashReceiptMgtKey: string;
553
+ /**
554
+ * 결제된 은행의 코드예요.
555
+ */
556
+ accountBankName: string;
557
+ /**
558
+ * 결제된 계좌번호예요.
559
+ */
560
+ accountNumber: string;
561
+ }
562
+ /**
563
+ * @public
564
+ * @category 토스페이
565
+ * @name executePayment
566
+ * @description 구매자가 결제를 시도하면, 먼저 결제 정보를 생성하고 인증을 받아요. 이때 결제 상태는 '대기' 중이에요. 이후 결제를 실제로 승인하려면 주어진 주문번호와 결제 토큰을 사용해서 이 함수로 생성된 결제를 승인해요. 결제 승인이 완료되면, 구매자의 결제 수단(예: 카드, 계좌)에서 실제로 금액이 출금돼요. 이 함수를 호출하지 않으면 결제가 자동으로 만료되고, 출금도 발생하지 않아요.
567
+ *
568
+ * @param {ExecutePaymentOptions} options 결제를 실행할 때 필요한 옵션이에요.
569
+ * @param {string} options.orderNo 결제를 생성할 때 사용한 주문번호예요.
570
+ * @param {string} options.payToken 결제 인증 과정에서 전달받은 결제 토큰이에요. 결제를 실행할 때 사용해요.
571
+ * @returns {Promise<CardExecutePaymentResult | TossMoneyExecutePaymentResult>} 결제 결과 객체를 반환해요. 자세한 내용은 [카드 결제 결과](reference/framework/토스페이/CardExecutePaymentResult.html) 또는 [토스머니 결제 결과](reference/framework/토스페이/TossMoneyExecutePaymentResult.html)를 참고하세요.
572
+ *
573
+ * @example
574
+ *
575
+ * ### 카드 결제 실행하기
576
+ *
577
+ * ```tsx
578
+ * import { TossPay } from '@apps-in-toss/framework';
579
+ *
580
+ * async function handlePayment() {
581
+ * try {
582
+ * const payToken = 'PAY_TOKEN_12345'; // 결제 인증 후 받은 토큰
583
+ *
584
+ * const result = await TossPay.executePayment({
585
+ * orderNo: 'ORDER_12345',
586
+ * payToken,
587
+ * });
588
+ *
589
+ * console.log('결제가 완료되었어요:', result);
590
+ * } catch (error) {
591
+ * console.error('결제에 실패했어요:', error);
592
+ * }
593
+ * }
594
+ * ```
595
+ */
596
+ declare function executePayment(options: ExecutePaymentOptions): Promise<CardExecutePaymentResult | TossMoneyExecutePaymentResult>;
597
+
209
598
  /**
210
599
  * @public
211
600
  * @category 클립보드
@@ -637,6 +1026,19 @@ declare function appLogin(): Promise<{
637
1026
  */
638
1027
  declare function getOperationalEnvironment(): 'toss' | 'sandbox';
639
1028
 
1029
+ /**
1030
+ * @public
1031
+ * @category 토스페이
1032
+ * @name TossPay
1033
+ * @description 토스페이 결제 관련 함수를 모아둔 객체예요.
1034
+ * @property {typeof checkoutPayment} [checkoutPayment] 토스페이 결제를 생성하는 함수예요. 자세한 내용은 [checkoutPayment](reference/framework/토스페이/checkoutPayment)를 참고하세요.
1035
+ * @property {typeof executePayment} [executePayment] 토스페이 결제를 실행하는 함수예요. 자세한 내용은 [executePayment](reference/framework/토스페이/executePayment)를 참고하세요.
1036
+ */
1037
+ declare const TossPay: {
1038
+ checkoutPayment: typeof checkoutPayment;
1039
+ executePayment: typeof executePayment;
1040
+ };
1041
+
640
1042
  interface WebViewProps extends Omit<WebViewProps$1, 'cacheEnabled' | 'source' | 'sharedCookiesEnabled' | 'thirdPartyCookiesEnabled' | 'injectedJavaScriptBeforeContentLoaded'> {
641
1043
  local: {
642
1044
  port: number;
@@ -695,4 +1097,4 @@ declare const env: {
695
1097
  getDeploymentId: () => string | undefined;
696
1098
  };
697
1099
 
698
- export { Accuracy, AppsInToss, type ContactEntity, type FetchAlbumPhotosOptions, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getOperationalEnvironment, openCamera, setClipboardText, startUpdateLocation, useGeolocation };
1100
+ export { Accuracy, AppsInToss, type ContactEntity, type FetchAlbumPhotosOptions, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, TossPay, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getOperationalEnvironment, openCamera, setClipboardText, startUpdateLocation, useGeolocation };
package/dist/index.d.ts CHANGED
@@ -206,6 +206,395 @@ declare function startUpdateLocation(eventParams: {
206
206
  options: StartUpdateLocationOptions;
207
207
  }): () => void;
208
208
 
209
+ /**
210
+ * @public
211
+ * @category 토스페이
212
+ * @name CheckoutPaymentOptions
213
+ * @description 토스페이 결제를 생성할 때 필요한 옵션 객체예요.
214
+ * @property {string} orderNo 가맹점의 상품 주문번호예요.
215
+ * @property {string} productDesc 상품 설명이에요.
216
+ * @property {number} amount 결제 금액이에요.
217
+ * @property {number} amountTaxFree 결제 금액 중 비과세 금액이에요.
218
+ * @property {number} [amountTaxable] 결제 금액 중 과세 금액이에요.
219
+ * @property {number} [amountVat] 결제 금액 중 부가세예요.
220
+ * @property {number} [amountServiceFee] 결제 금액 중 봉사료예요.
221
+ * @property {'TOSS_MONEY' | 'CARD' | null} [enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
222
+ * @property {boolean} [cashReceipt] 현금영수증 발급 가능 여부예요.
223
+ * @property {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
224
+ * @property {'USE' | 'NO_USE'} [installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
225
+ */
226
+ interface CheckoutPaymentOptions {
227
+ /**
228
+ * 가맹점의 상품 주문번호에요.
229
+ */
230
+ orderNo: string;
231
+ /**
232
+ * 상품 설명이에요.
233
+ */
234
+ productDesc: string;
235
+ /**
236
+ * 결제 금액이예요.
237
+ */
238
+ amount: number;
239
+ /**
240
+ * 결제 금액 중 비과세 금액이에요.
241
+ */
242
+ amountTaxFree: number;
243
+ /**
244
+ * 결제 금액 중 과세 금액이에요.
245
+ */
246
+ amountTaxable?: number;
247
+ /**
248
+ * 결제 금액 중 부가세예요.
249
+ */
250
+ amountVat?: number;
251
+ /**
252
+ * 결제 금액 중 봉사료예요.
253
+ */
254
+ amountServiceFee?: number;
255
+ /**
256
+ * 결제수단 구분 변수예요.
257
+ *
258
+ * - 'TOSS_MONEY': 결제수단 중 토스머니만 노출
259
+ * - 'CARD': 결제수단 중 카드만 노출
260
+ * - null: 상점에 설정된 기본 결제 수단 노출
261
+ */
262
+ enablePayMethods?: 'TOSS_MONEY' | 'CARD' | null;
263
+ /**
264
+ * 현금영수증 발급 가능 여부예요.
265
+ */
266
+ cashReceipt?: boolean;
267
+ /**
268
+ * 현금영수증 발급 타입이에요.
269
+ *
270
+ * - 'CULTURE': 문화비
271
+ * - 'GENERAL': 일반(기본값)
272
+ * - 'PUBLIC_TP': 교통비
273
+ */
274
+ cashReceiptTradeOption?: 'CULTURE' | 'GENERAL' | 'PUBLIC_TP';
275
+ /**
276
+ * 할부를 사용할 지 말 지 여부에요.
277
+ *
278
+ * - 'USE': 사용(기본값)
279
+ * - 'NO_USE': 할부 미사용
280
+ */
281
+ installment?: 'USE' | 'NO_USE';
282
+ }
283
+ /**
284
+ * @public
285
+ * @category 토스페이
286
+ * @name checkoutPayment
287
+ * @description 토스페이 결제를 생성하는 함수예요.
288
+ *
289
+ * @param {CheckoutPaymentOptions} options 결제를 생성할 때 필요한 옵션 객체예요.
290
+ * @param {string} options.orderNo 가맹점의 상품 주문번호예요.
291
+ * @param {string} options.productDesc 상품 설명이에요.
292
+ * @param {number} options.amount 결제 금액이에요.
293
+ * @param {number} options.amountTaxFree 결제 금액 중 비과세 금액이에요.
294
+ * @param {number} [options.amountTaxable] 결제 금액 중 과세 금액이에요.
295
+ * @param {number} [options.amountVat] 결제 금액 중 부가세예요.
296
+ * @param {number} [options.amountServiceFee] 결제 금액 중 봉사료예요.
297
+ * @param {'TOSS_MONEY' | 'CARD' | null} [options.enablePayMethods] 결제수단 구분 변수예요. (TOSS_MONEY: 토스머니만, CARD: 카드만, null: 기본 결제수단)
298
+ * @param {boolean} [options.cashReceipt] 현금영수증 발급 가능 여부예요.
299
+ * @param {'CULTURE' | 'GENERAL' | 'PUBLIC_TP'} [options.cashReceiptTradeOption] 현금영수증 발급 타입이에요. (CULTURE: 문화비, GENERAL: 일반, PUBLIC_TP: 교통비)
300
+ * @param {'USE' | 'NO_USE'} [options.installment] 할부를 사용할 지 말 지 여부에요. (USE: 사용, NO_USE: 할부 미사용)
301
+ * @returns {Promise<{ payToken: string }>} 결제 인증 후 발급된 결제 토큰 값이 포함된 객체를 반환해요.
302
+ *
303
+ * @example
304
+ * ### 결제 생성하기
305
+ *
306
+ * ```tsx
307
+ * import { TossPay } from '@apps-in-toss/framework';
308
+ *
309
+ * async function handlePayment() {
310
+ * try {
311
+ * const result = await TossPay.checkoutPayment({
312
+ * orderNo: 'ORDER_12345',
313
+ * productDesc: '티셔츠',
314
+ * amount: 15000,
315
+ * amountTaxFree: 0,
316
+ * amountTaxable: 13636,
317
+ * amountVat: 1364,
318
+ * enablePayMethods: 'CARD',
319
+ * installment: 'USE'
320
+ * });
321
+ *
322
+ * console.log('결제 토큰:', result.payToken);
323
+ * } catch (error) {
324
+ * console.error('결제 생성에 실패했어요:', error);
325
+ * }
326
+ * }
327
+ * ```
328
+ */
329
+ declare function checkoutPayment(options: CheckoutPaymentOptions): Promise<{
330
+ payToken: string;
331
+ }>;
332
+
333
+ /**
334
+ * @public
335
+ * @category 토스페이
336
+ * @name ExecutePaymentOptions
337
+ * @description 생성한 토스페이 결제를 실행할 때 필요한 옵션이에요.
338
+ * @property {string} orderNo 결제를 생성할 때 사용한 주문번호예요.
339
+ * @property {string} payToken 결제 인증 과정에서 전달받은 결제 토큰이에요. 결제를 실행할 때 사용해요.
340
+ */
341
+ interface ExecutePaymentOptions {
342
+ /**
343
+ * 결제를 생성할 때 사용한 주문번호예요.
344
+ */
345
+ orderNo: string;
346
+ /**
347
+ * 결제 인증 과정에서 전달받은 Pay 토큰이에요.
348
+ */
349
+ payToken: string;
350
+ }
351
+ /**
352
+ * @public
353
+ * @category 토스페이
354
+ * @name CardExecutePaymentResult
355
+ * @description 카드로 결제 요청을 실행한 뒤 돌아오는 결제 결과 객체예요. 결제 승인 여부, 결제된 금액, 주문 정보 등을 담고 있어요.
356
+ * @property {'CARD'} payMethod 결제 수단이에요.
357
+ * @property {number} code 결제 요청의 결과 코드예요.
358
+ * @property {'LIVE' | 'TEST'} mode 현재 결제 환경이에요.
359
+ * @property {string} orderNo 주문번호예요.
360
+ * @property {number} amount 총 결제 금액이에요.
361
+ * @property {string} approvalTime 결제가 승인된 시간이에요. (ISO 8601 형식)
362
+ * @property {string} stateMsg 결제 상태 메시지예요.
363
+ * @property {number} discountedAmount 적용된 할인 금액이에요.
364
+ * @property {number} paidAmount 실제 결제된 금액이에요.
365
+ * @property {string} payToken 결제 요청 시 사용한 Pay 토큰이에요.
366
+ * @property {string} transactionId 거래 ID예요.
367
+ * @property {number} cardCompanyCode 카드사 코드예요.
368
+ * @property {string} cardCompanyName 카드사 이름이에요.
369
+ * @property {string} cardAuthorizationNo 카드사 승인 번호예요. (라이브 결제 환경에서만 확인 가능해요)
370
+ * @property {number} spreadOut 할부 개월 수예요. (5만원 미만 금액 및 일시불 결제의 경우에는 `0`)
371
+ * @property {boolean} noInterest 무이자 할부 여부예요.
372
+ * @property {string} salesCheckLinkUrl 결제 내역을 확인할 수 있는 매출전표 URL이에요.
373
+ * @property {'CREDIT' | 'CHECK' | 'PREPAYMENT'} cardMethodType 카드 유형이에요.
374
+ * @property {string} cardNumber 마스킹된 카드 번호예요. (`****-****-****-1234` 형식)
375
+ * @property {string} cardNum4Print 카드 번호의 마지막 4자리예요.
376
+ * @property {string} cardBinNumber 카드 BIN 번호예요.
377
+ */
378
+ interface CardExecutePaymentResult {
379
+ /**
380
+ * 결제 수단이에요.
381
+ */
382
+ payMethod: 'CARD';
383
+ /**
384
+ * 결제 요청의 결과 코드예요.
385
+ */
386
+ code: number;
387
+ /**
388
+ * 현재 결제 환경이에요.
389
+ *
390
+ * - `LIVE`: 실제 환경
391
+ * - `TEST`: 테스트 환경
392
+ */
393
+ mode: 'LIVE' | 'TEST';
394
+ /**
395
+ * 주문번호예요.
396
+ */
397
+ orderNo: string;
398
+ /**
399
+ * 총 결제 금액이에요.
400
+ */
401
+ amount: number;
402
+ /**
403
+ * 결제가 승인된 시간이에요. (ISO 8601 형식)
404
+ */
405
+ approvalTime: string;
406
+ /**
407
+ * 결제 상태 메시지예요.
408
+ */
409
+ stateMsg: string;
410
+ /**
411
+ * 적용된 할인 금액이에요.
412
+ */
413
+ discountedAmount: number;
414
+ /**
415
+ * 실제 결제된 금액이에요.
416
+ */
417
+ paidAmount: number;
418
+ /**
419
+ * 결제 요청 시 사용한 Pay 토큰이에요.
420
+ */
421
+ payToken: string;
422
+ /**
423
+ * 거래 ID예요.
424
+ */
425
+ transactionId: string;
426
+ /**
427
+ * 카드사 코드예요.
428
+ */
429
+ cardCompanyCode: number;
430
+ /**
431
+ * 카드사 이름이에요.
432
+ */
433
+ cardCompanyName: string;
434
+ /**
435
+ * 카드사 승인 번호예요. (라이브 결제 환경에서만 확인 가능해요)
436
+ */
437
+ cardAuthorizationNo: string;
438
+ /**
439
+ * 할부 개월 수예요. (5만원 미만 금액 및 일시불 결제의 경우에는 `0`)
440
+ */
441
+ spreadOut: number;
442
+ /**
443
+ * 무이자 할부 여부예요.
444
+ */
445
+ noInterest: boolean;
446
+ /**
447
+ * 결제 내역을 확인할 수 있는 매출전표 URL이에요.
448
+ */
449
+ salesCheckLinkUrl: string;
450
+ /**
451
+ * 카드 유형이에요.
452
+ *
453
+ * - 'CREDIT': 신용카드
454
+ * - 'CHECK': 체크카드
455
+ * - 'PREPAYMENT': 선불카드
456
+ */
457
+ cardMethodType: 'CREDIT' | 'CHECK' | 'PREPAYMENT';
458
+ /**
459
+ * 마스킹된 카드 번호예요. (`****-****-****-1234` 형식)
460
+ */
461
+ cardNumber: string;
462
+ /**
463
+ * 카드 사용자 구분을 나타내는 값이에요.
464
+ *
465
+ * - 'PERSONAL': 개인 카드
466
+ * - 'PERSONAL_FAMILY': 가족 카드
467
+ * - 'CORP_PERSONAL': 법인지정 결제계좌 (임직원)
468
+ * - 'CORP_PRIVATE': 법인 공용
469
+ * - 'CORP_COMPANY': 법인지정 결제계좌 회사 (하나카드 Only)
470
+ */
471
+ cardUserType: 'PERSONAL' | 'PERSONAL_FAMILY' | 'CORP_PERSONAL' | 'CORP_PRIVATE' | 'CORP_COMPANY';
472
+ /**
473
+ * 카드 번호의 마지막 4자리예요.
474
+ */
475
+ cardNum4Print: string;
476
+ /**
477
+ * 카드 BIN 번호예요.
478
+ */
479
+ cardBinNumber: string;
480
+ }
481
+ /**
482
+ * @public
483
+ * @category 토스페이
484
+ * @name TossMoneyExecutePaymentResult
485
+ * @description 토스머니로 결제 요청을 실행한 뒤 돌아오는 결제 결과 객체예요. 결제 승인 여부, 결제된 금액, 주문 정보 등을 담고 있어요.
486
+ * @property {'TOSS_MONEY'} payMethod 결제 수단이에요.
487
+ * @property {number} code 결제 요청의 결과 코드예요.
488
+ * @property {'LIVE' | 'TEST'} mode 현재 결제 환경이에요.
489
+ * @property {string} orderNo 주문번호예요.
490
+ * @property {number} amount 총 결제 금액이에요.
491
+ * @property {string} approvalTime 결제가 승인된 시간이에요. (ISO 8601 형식)
492
+ * @property {string} stateMsg 결제 상태 메시지예요.
493
+ * @property {number} discountedAmount 적용된 할인 금액이에요.
494
+ * @property {number} paidAmount 실제 결제된 금액이에요.
495
+ * @property {string} payToken 결제 요청 시 사용한 Pay 토큰이에요.
496
+ * @property {string} transactionId 거래 ID예요.
497
+ * @property {string} cashReceiptMgtKey 현금영수증 관리번호 식별값이에요.
498
+ * @property {string} accountBankName 결제된 은행의 코드예요.
499
+ * @property {string} accountNumber 결제된 계좌번호예요.
500
+ */
501
+ interface TossMoneyExecutePaymentResult {
502
+ /**
503
+ * 결제에 사용된 결제 수단이에요.
504
+ */
505
+ payMethod: 'TOSS_MONEY';
506
+ /**
507
+ * 결제 요청의 결과 코드예요.
508
+ */
509
+ code: number;
510
+ /**
511
+ * 현재 결제 환경이에요.
512
+ *
513
+ * - `LIVE`: 실제 환경
514
+ * - `TEST`: 테스트 환경
515
+ */
516
+ mode: 'LIVE' | 'TEST';
517
+ /**
518
+ * 결제 승인된 상품의 주문번호예요.
519
+ */
520
+ orderNo: string;
521
+ /**
522
+ * 결제 승인된 상품의 총 결제 금액이에요.
523
+ */
524
+ amount: number;
525
+ /**
526
+ * 결제가 승인된 시간이에요. (ISO 8601 형식)
527
+ */
528
+ approvalTime: string;
529
+ /**
530
+ * 결제 상태 메시지예요.
531
+ */
532
+ stateMsg: string;
533
+ /**
534
+ * 적용된 할인 금액이에요.
535
+ */
536
+ discountedAmount: number;
537
+ /**
538
+ * 실제 결제 승인된 금액이에요.
539
+ */
540
+ paidAmount: number;
541
+ /**
542
+ * 결제 요청 시 사용한 Pay 토큰이에요.
543
+ */
544
+ payToken: string;
545
+ /**
546
+ * 거래 ID예요.
547
+ */
548
+ transactionId: string;
549
+ /**
550
+ * 현금영수증 관리번호 식별값이에요.
551
+ */
552
+ cashReceiptMgtKey: string;
553
+ /**
554
+ * 결제된 은행의 코드예요.
555
+ */
556
+ accountBankName: string;
557
+ /**
558
+ * 결제된 계좌번호예요.
559
+ */
560
+ accountNumber: string;
561
+ }
562
+ /**
563
+ * @public
564
+ * @category 토스페이
565
+ * @name executePayment
566
+ * @description 구매자가 결제를 시도하면, 먼저 결제 정보를 생성하고 인증을 받아요. 이때 결제 상태는 '대기' 중이에요. 이후 결제를 실제로 승인하려면 주어진 주문번호와 결제 토큰을 사용해서 이 함수로 생성된 결제를 승인해요. 결제 승인이 완료되면, 구매자의 결제 수단(예: 카드, 계좌)에서 실제로 금액이 출금돼요. 이 함수를 호출하지 않으면 결제가 자동으로 만료되고, 출금도 발생하지 않아요.
567
+ *
568
+ * @param {ExecutePaymentOptions} options 결제를 실행할 때 필요한 옵션이에요.
569
+ * @param {string} options.orderNo 결제를 생성할 때 사용한 주문번호예요.
570
+ * @param {string} options.payToken 결제 인증 과정에서 전달받은 결제 토큰이에요. 결제를 실행할 때 사용해요.
571
+ * @returns {Promise<CardExecutePaymentResult | TossMoneyExecutePaymentResult>} 결제 결과 객체를 반환해요. 자세한 내용은 [카드 결제 결과](reference/framework/토스페이/CardExecutePaymentResult.html) 또는 [토스머니 결제 결과](reference/framework/토스페이/TossMoneyExecutePaymentResult.html)를 참고하세요.
572
+ *
573
+ * @example
574
+ *
575
+ * ### 카드 결제 실행하기
576
+ *
577
+ * ```tsx
578
+ * import { TossPay } from '@apps-in-toss/framework';
579
+ *
580
+ * async function handlePayment() {
581
+ * try {
582
+ * const payToken = 'PAY_TOKEN_12345'; // 결제 인증 후 받은 토큰
583
+ *
584
+ * const result = await TossPay.executePayment({
585
+ * orderNo: 'ORDER_12345',
586
+ * payToken,
587
+ * });
588
+ *
589
+ * console.log('결제가 완료되었어요:', result);
590
+ * } catch (error) {
591
+ * console.error('결제에 실패했어요:', error);
592
+ * }
593
+ * }
594
+ * ```
595
+ */
596
+ declare function executePayment(options: ExecutePaymentOptions): Promise<CardExecutePaymentResult | TossMoneyExecutePaymentResult>;
597
+
209
598
  /**
210
599
  * @public
211
600
  * @category 클립보드
@@ -637,6 +1026,19 @@ declare function appLogin(): Promise<{
637
1026
  */
638
1027
  declare function getOperationalEnvironment(): 'toss' | 'sandbox';
639
1028
 
1029
+ /**
1030
+ * @public
1031
+ * @category 토스페이
1032
+ * @name TossPay
1033
+ * @description 토스페이 결제 관련 함수를 모아둔 객체예요.
1034
+ * @property {typeof checkoutPayment} [checkoutPayment] 토스페이 결제를 생성하는 함수예요. 자세한 내용은 [checkoutPayment](reference/framework/토스페이/checkoutPayment)를 참고하세요.
1035
+ * @property {typeof executePayment} [executePayment] 토스페이 결제를 실행하는 함수예요. 자세한 내용은 [executePayment](reference/framework/토스페이/executePayment)를 참고하세요.
1036
+ */
1037
+ declare const TossPay: {
1038
+ checkoutPayment: typeof checkoutPayment;
1039
+ executePayment: typeof executePayment;
1040
+ };
1041
+
640
1042
  interface WebViewProps extends Omit<WebViewProps$1, 'cacheEnabled' | 'source' | 'sharedCookiesEnabled' | 'thirdPartyCookiesEnabled' | 'injectedJavaScriptBeforeContentLoaded'> {
641
1043
  local: {
642
1044
  port: number;
@@ -695,4 +1097,4 @@ declare const env: {
695
1097
  getDeploymentId: () => string | undefined;
696
1098
  };
697
1099
 
698
- export { Accuracy, AppsInToss, type ContactEntity, type FetchAlbumPhotosOptions, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getOperationalEnvironment, openCamera, setClipboardText, startUpdateLocation, useGeolocation };
1100
+ export { Accuracy, AppsInToss, type ContactEntity, type FetchAlbumPhotosOptions, type GetCurrentLocationOptions, type ImageResponse, type Location, type LocationCoords, type OpenCameraOptions, type StartUpdateLocationOptions, type StartUpdateLocationSubscription, TossPay, type UpdateLocationEventEmitter, type UseGeolocationOptions, WebView, type WebViewProps, appLogin, env, fetchAlbumPhotos, fetchContacts, getClipboardText, getCurrentLocation, getOperationalEnvironment, openCamera, setClipboardText, startUpdateLocation, useGeolocation };
package/dist/index.js CHANGED
@@ -103,6 +103,16 @@ function startUpdateLocation(eventParams) {
103
103
  return appsInTossEvent.addEventListener("updateLocationEvent", eventParams);
104
104
  }
105
105
 
106
+ // src/native-modules/checkoutPayment.ts
107
+ async function checkoutPayment(options) {
108
+ return AppsInTossModule.checkoutPayment(options);
109
+ }
110
+
111
+ // src/native-modules/executePayment.ts
112
+ async function executePayment(options) {
113
+ return AppsInTossModule.executePayment(options);
114
+ }
115
+
106
116
  // src/native-modules/setClipboardText.ts
107
117
  async function setClipboardText(text) {
108
118
  const permissionStatus = await requestPermission({ name: "clipboard", access: "write" });
@@ -189,6 +199,12 @@ function getOperationalEnvironment() {
189
199
  return AppsInTossModule.operationalEnvironment;
190
200
  }
191
201
 
202
+ // src/native-modules/index.ts
203
+ var TossPay = {
204
+ checkoutPayment,
205
+ executePayment
206
+ };
207
+
192
208
  // src/components/WebView.tsx
193
209
  import {
194
210
  WebView as OriginalWebView
@@ -202,6 +218,8 @@ import * as bedrockConstantBridges from "react-native-bedrock/constant-bridges";
202
218
  var async_bridges_exports = {};
203
219
  __export(async_bridges_exports, {
204
220
  appLogin: () => appLogin,
221
+ checkoutPayment: () => checkoutPayment,
222
+ executePayment: () => executePayment,
205
223
  fetchAlbumPhotos: () => fetchAlbumPhotos,
206
224
  fetchContacts: () => fetchContacts,
207
225
  getClipboardText: () => getClipboardText,
@@ -313,6 +331,7 @@ var Accuracy2 = /* @__PURE__ */ ((Accuracy3) => {
313
331
  export {
314
332
  Accuracy2 as Accuracy,
315
333
  AppsInToss,
334
+ TossPay,
316
335
  WebView,
317
336
  appLogin,
318
337
  env,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@apps-in-toss/framework",
3
3
  "type": "module",
4
- "version": "0.0.13",
4
+ "version": "0.0.14",
5
5
  "description": "The framework for Apps In Toss",
6
6
  "scripts": {
7
7
  "prepack": "yarn build",
@@ -55,7 +55,7 @@
55
55
  "ait": "./bin/ait.js"
56
56
  },
57
57
  "dependencies": {
58
- "@apps-in-toss/cli": "0.0.13"
58
+ "@apps-in-toss/cli": "0.0.14"
59
59
  },
60
60
  "devDependencies": {
61
61
  "@react-native-bedrock/mpack-next": "0.0.13",
@@ -90,5 +90,5 @@
90
90
  "publishConfig": {
91
91
  "access": "public"
92
92
  },
93
- "gitHead": "c5fa235b136ffaefc7687b35b473de5f6a1dca6f"
93
+ "gitHead": "4ed1e356e1a1b3bb14ef33b2fcbd2466c9445b0f"
94
94
  }
@@ -5,3 +5,5 @@ export * from './native-modules/fetchAlbumPhotos.js';
5
5
  export * from './native-modules/getCurrentLocation.js';
6
6
  export * from './native-modules/openCamera.js';
7
7
  export * from './native-modules/appLogin.js';
8
+ export * from './native-modules/checkoutPayment.js';
9
+ export * from './native-modules/executePayment.js';