create new types for createOrder and creatVaultToken

packages/paypal-js/types/components/card-fields.d.ts

@@ -127,16 +127,31 @@ export interface PayPalCardFieldsIndividualField {
     close: () => Promise<void>;
 }
 
-export interface PayPalCardFieldsComponentOptions {
-    createOrder: () => Promise<string>;
+export interface PayPalCardFieldsComponentBasics {
     onApprove: (data: CardFieldsOnApproveData) => void;
     onError: (err: Record<string, unknown>) => void;
-    createVaultSetupToken?: () => Promise<string>;
     inputEvents?: PayPalCardFieldsInputEvents;
     style?: Record<string, PayPalCardFieldsStyleOptions>;
 }
 
-export interface PayPalCardFieldsComponent {
+export interface PayPalCardFieldsComponentCreateOrder
+    extends PayPalCardFieldsComponentBasics {
+    createOrder: () => Promise<string>;
+    createVaultSetupToken?: never;
+}
+
+export interface PayPalCardFieldsComponentCreateVaultSetupToken
+    extends PayPalCardFieldsComponentBasics {
+    createOrder?: never;
+    createVaultSetupToken: () => Promise<string>;
+}
+
+export type PayPalCardFieldsComponentOptions =
+    | PayPalCardFieldsComponentCreateOrder
+    | PayPalCardFieldsComponentCreateVaultSetupToken;
+
+export interface PayPalCardFieldsComponent
+    extends PayPalCardFieldsComponentOptions {
     getState: () => Promise<PayPalCardFieldsStateObject>;
     isEligible: () => boolean;
     submit: () => Promise<void>;

packages/paypal-js/types/tests/card-fields.test.ts

@@ -0,0 +1,48 @@
+import { test, vi, describe, expect } from "vitest";
+
+import { PayPalCardFieldsComponentOptions } from "../components/card-fields";
+
+describe("testing", () => {
+    test("only creatOrder", () => {
+        const createOrderCallback: PayPalCardFieldsComponentOptions = {
+            createOrder: vi.fn(),
+            onApprove: vi.fn(),
+            onError: vi.fn(),
+        };
+
+        expect(createOrderCallback.createVaultSetupToken).toBeUndefined();
+    });
+
+    test("only createVaultSetupToken", () => {
+        const createVaultSetupTokenCallback: PayPalCardFieldsComponentOptions =
+            {
+                createVaultSetupToken: vi.fn(),
+                onApprove: vi.fn(),
+                onError: vi.fn(),
+            };
+
+        expect(createVaultSetupTokenCallback.createOrder).toBeUndefined();
+    });
+
+    test.skip("Can't have both", () => {
+        // @ts-expect-error : should throw error if both createOrder and createVaultSetuptoken called
+        const callback: PayPalCardFieldsComponentOptions = {
+            createOrder: vi.fn(),
+            createVaultSetupToken: vi.fn(),
+            onApprove: vi.fn(),
+            onError: vi.fn(),
+        };
+
+        expect(callback).toThrowError();
+    });
+
+    test.skip("Can't have both", () => {
+        // @ts-expect-error: should throw error if neither createOrder or createVaultSetuptoken called
+        const callback: PayPalCardFieldsComponentOptions = {
+            onApprove: vi.fn(),
+            onError: vi.fn(),
+        };
+
+        expect(callback).toThrowError();
+    });
+});