Add customPaymentMethods option for stripe.elements

tests/types/src/valid.ts

@@ -111,6 +111,14 @@ const options: StripeElementsOptions = {
     customer: 'cus_foo',
     ephemeralKey: 'ek_test_foo',
   },
+  customPaymentMethods: [
+    {
+      id: 'cpmt_123',
+      options: {
+        type: 'static',
+      },
+    },
+  ],
 };
 
 const elements: StripeElements = stripe.elements(options);
@@ -149,6 +157,14 @@ const elementsClientSecret: StripeElements = stripe.elements({
     customer: 'cus_foo',
     ephemeralKey: 'ek_test_foo',
   },
+  customPaymentMethods: [
+    {
+      id: 'cpmt_123',
+      options: {
+        type: 'static',
+      },
+    },
+  ],
 });
 
 const elementsPMCProvided = stripe.elements({
@@ -225,7 +241,7 @@ const fetchUpdates = async () => {
 };
 
 const handleSubmit = async () => {
-  const {error} = await elements.submit();
+  const {error, selectedPaymentMethod} = await elements.submit();
 };
 
 const auBankAccountElement = elements.create('auBankAccount', {});

types/stripe-js/elements-group.d.ts

@@ -69,7 +69,10 @@ export interface StripeElements {
    * Before confirming payment, call elements.submit() to validate the state of the
    * Payment Element and collect any data required for wallets.
    */
-  submit(): Promise<{error?: StripeError}>;
+  submit(): Promise<
+    | {error?: StripeError; selectedPaymentMethod?: undefined}
+    | {selectedPaymentMethod: string; error?: undefined}
+  >;
 
   /////////////////////////////
   /// address
@@ -667,6 +670,14 @@ interface BaseStripeElementsOptions {
    * Display saved PaymentMethods and Customer information.
    */
   customerSessionClientSecret?: string;
+
+  /**
+   * Requires beta access:
+   * Contact [Stripe support](https://support.stripe.com/) for more information.
+   *
+   * Display Custom Payment Methods in the Payment Element that you are already registered with.
+   */
+  customPaymentMethods?: CustomPaymentMethod[];
 }
 
 export interface StripeElementsOptionsClientSecret
@@ -1125,3 +1136,25 @@ export interface CustomerOptions {
    */
   ephemeralKey: string;
 }
+
+export interface CustomPaymentMethod {
+  /**
+   * The Custom Payment Method id, prefixed with `cpmt_`.
+   */
+  id: string;
+
+  /**
+   * Additional options to configure the Custom Payment Method.
+   */
+  options: {
+    /**
+     * The payment form type.
+     */
+    type: 'static';
+
+    /**
+     * Display additional information about the payment method, max 100 characters.
+     */
+    subtitle?: string;
+  };
+}