@stripe/stripe-js 1.49.0 → 1.50.0

package/dist/pure.esm.js

@@ -54,7 +54,7 @@ var registerWrapper = function registerWrapper(stripe, startTime) {
 
   stripe._registerWrapper({
     name: 'stripe-js',
-    version: "1.49.0",
+    version: "1.50.0",
     startTime: startTime
   });
 };

package/dist/pure.js

@@ -58,7 +58,7 @@ var registerWrapper = function registerWrapper(stripe, startTime) {
 
   stripe._registerWrapper({
     name: 'stripe-js',
-    version: "1.49.0",
+    version: "1.50.0",
     startTime: startTime
   });
 };

package/dist/stripe.esm.js

@@ -38,7 +38,7 @@ var registerWrapper = function registerWrapper(stripe, startTime) {
 
   stripe._registerWrapper({
     name: 'stripe-js',
-    version: "1.49.0",
+    version: "1.50.0",
     startTime: startTime
   });
 };

package/dist/stripe.js

@@ -42,7 +42,7 @@ var registerWrapper = function registerWrapper(stripe, startTime) {
 
   stripe._registerWrapper({
     name: 'stripe-js',
-    version: "1.49.0",
+    version: "1.50.0",
     startTime: startTime
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stripe/stripe-js",
-  "version": "1.49.0",
+  "version": "1.50.0",
   "description": "Stripe.js loading utility",
   "main": "dist/stripe.js",
   "module": "dist/stripe.esm.js",

package/types/api/payment-methods.d.ts

@@ -1,3 +1,4 @@
+import {StripeElement, StripeElements} from '../stripe-js';
 import {Metadata, MetadataParam, Address} from './shared';
 
 /**
@@ -316,6 +317,47 @@ export interface PaymentMethodCreateParams {
   type?: string;
 }
 
+export interface CreatePaymentMethodFromElements {
+  /**
+   * The Elements instance
+   *
+   * @docs https://stripe.com/docs/js/elements_object
+   */
+  elements: StripeElements;
+
+  /**
+   * Parameters that will be passed on to the PaymentMethod API
+   *
+   * @docs https://stripe.com/docs/api/payment_methods/create
+   */
+  params?: PaymentMethodCreateParams;
+
+  /**
+   * Set of key-value pairs that you can attach to an object. This can be useful for storing additional information about the object in a structured format. Individual keys can be unset by posting an empty value to them. All keys can be unset by posting an empty value to `metadata`.
+   */
+  metadata?: MetadataParam;
+}
+export interface CreatePaymentMethodFromElement {
+  /**
+   * The specific Element used to collect payment details
+   *
+   * @docs https://stripe.com/docs/js/element
+   */
+  element: StripeElement;
+
+  /**
+   * Parameters that will be passed on to the PaymentMethod API
+   *
+   * @docs https://stripe.com/docs/api/payment_methods/create
+   */
+  params?: PaymentMethodCreateParams;
+
+  /**
+   * Set of key-value pairs that you can attach to an object. This can be useful for storing additional information about the object in a structured format. Individual keys can be unset by posting an empty value to them. All keys can be unset by posting an empty value to `metadata`.
+   */
+  metadata?: MetadataParam;
+}
+
 export namespace PaymentMethodCreateParams {
   export interface BillingDetails {
     /**

package/types/stripe-js/elements/card.d.ts

@@ -109,7 +109,7 @@ export type StripeCardElement = StripeElementBase & {
    * The styles of an `CardElement` can be dynamically changed using `element.update`.
    * This method can be used to simulate CSS media queries that automatically adjust the size of elements when viewed on different devices.
    */
-  update(options: Partial<StripeCardElementOptions>): void;
+  update(options: StripeCardElementUpdateOptions): void;
 };
 
 export interface StripeCardElementOptions {
@@ -146,6 +146,48 @@ export interface StripeCardElementOptions {
    * Default is false.
    */
   disabled?: boolean;
+
+  /**
+   * Hides and disables the Link Button in the Card Element.
+   * Default is false.
+   */
+  disableLink?: boolean;
+}
+
+export interface StripeCardElementUpdateOptions {
+  classes?: StripeElementClasses;
+
+  style?: StripeElementStyle;
+
+  /**
+   * A pre-filled set of values to include in the input (e.g., `{postalCode: '94110'}`).
+   * Note that sensitive card information (card number, CVC, and expiration date) cannot be pre-filled.
+   */
+  value?: {postalCode?: string};
+
+  /**
+   * Hide the postal code field.
+   * Default is `false`.
+   * If you are already collecting a full billing address or postal code elsewhere, set this to `true`.
+   */
+  hidePostalCode?: boolean;
+
+  /**
+   * Appearance of the icon in the Element.
+   */
+  iconStyle?: 'default' | 'solid';
+
+  /**
+   * Hides the icon in the Element.
+   * Default is `false`.
+   */
+  hideIcon?: boolean;
+
+  /**
+   * Applies a disabled state to the Element such that user input is not accepted.
+   * Default is false.
+   */
+  disabled?: boolean;
 }
 
 export interface StripeCardElementChangeEvent extends StripeElementChangeEvent {

package/types/stripe-js/elements/payment-request-button.d.ts

@@ -126,6 +126,11 @@ export interface StripePaymentRequestButtonElementOptions {
        * The height of the Payment Request Button. Accepts px unit values.
        */
       height?: string;
+
+      /**
+       * The gap between buttons when multile buttons are shown. Accepts px unit values.
+       */
+      buttonSpacing?: string;
     };
   };
 
@@ -133,6 +138,12 @@ export interface StripePaymentRequestButtonElementOptions {
    * A `PaymentRequest` object used to configure the element.
    */
   paymentRequest: PaymentRequest;
+
+  /**
+   * Disable showing multiple buttons.
+   * Default is `false`.
+   */
+  disableMultipleButtons?: boolean;
 }
 
 export interface StripePaymentRequestButtonElementClickEvent {

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

@@ -50,6 +50,7 @@ import {
   StripeExpressCheckoutElement,
   StripeExpressCheckoutElementOptions,
 } from './elements';
+import {StripeError} from './stripe';
 
 export interface StripeElements {
   /**
@@ -64,6 +65,12 @@ export interface StripeElements {
    */
   fetchUpdates(): Promise<{error?: {message: string; status?: string}}>;
 
+  /**
+   * 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}>;
+
   /////////////////////////////
   /// address
   /////////////////////////////
@@ -619,7 +626,7 @@ export type StripeElementLocale =
 /**
  * Options to create an `Elements` instance with.
  */
-export interface StripeElementsOptions {
+interface BaseStripeElementsOptions {
   /**
    * An array of custom fonts, which elements created from the `Elements` object can use.
    */
@@ -640,13 +647,6 @@ export interface StripeElementsOptions {
    */
   appearance?: Appearance;
 
-  /**
-   * The client secret for a PaymentIntent or SetupIntent used by the Payment Element.
-   *
-   * @docs https://stripe.com/docs/api/payment_intents/object#payment_intent_object-client_secret
-   */
-  clientSecret?: string;
-
   /**
    * Display skeleton loader UI while waiting for Elements to be fully loaded, after they are mounted.
    * Supported for the `payment`, `shippingAddress`, and `linkAuthentication` Elements.
@@ -664,6 +664,54 @@ export interface StripeElementsOptions {
   customerOptions?: CustomerOptions;
 }
 
+export interface StripeElementsOptionsClientSecret
+  extends BaseStripeElementsOptions {
+  /**
+   * The client secret for a PaymentIntent or SetupIntent used by the Payment Element.
+   *
+   * @docs https://stripe.com/docs/api/payment_intents/object#payment_intent_object-client_secret
+   */
+  clientSecret?: string;
+}
+
+export interface StripeElementsOptionsMode extends BaseStripeElementsOptions {
+  /**
+   * Whether the Payment Element will be used to create a PaymentIntent, SetupIntent, or Subscription.
+   */
+  mode?: 'payment' | 'setup' | 'subscription';
+
+  /**
+   * Three character currency code (e.g., usd).
+   */
+  currency?: string;
+
+  /**
+   * The amount to be charged. Shown in Apple Pay, Google Pay, or Buy now pay later UIs, and influences available payment methods.
+   */
+  amount?: number;
+
+  /**
+   * Indicates that you intend to make future payments with this PaymentIntent’s payment method.
+   *
+   * @docs https://stripe.com/docs/api/payment_intents/create#create_payment_intent-setup_future_usage
+   */
+  setup_future_usage?: 'off_session' | 'on_session';
+
+  /**
+   * Controls when the funds will be captured from the customer’s account.
+   *
+   * @docs https://stripe.com/docs/api/payment_intents/create#create_payment_intent-capture_method
+   */
+  capture_method?: 'manual' | 'automatic';
+
+  /**
+   * Instead of using automatic payment methods, declare specific payment methods to enable.
+   *
+   * @docs https://stripe.com/docs/payments/payment-methods/overview
+   */
+  payment_method_types?: string[];
+}
+
 /*
  * Updatable options for an `Elements` instance
  */
@@ -682,6 +730,42 @@ export interface StripeElementsUpdateOptions {
    * @docs https://stripe.com/docs/stripe-js/appearance-api
    */
   appearance?: Appearance;
+
+  /**
+   * Whether the Payment Element will be used to create a PaymentIntent, SetupIntent, or Subscription.
+   */
+  mode?: 'payment' | 'setup' | 'subscription';
+
+  /**
+   * Three character currency code (e.g., usd).
+   */
+  currency?: string;
+
+  /**
+   * The amount to be charged. Shown in Apple Pay, Google Pay, or Buy now pay later UIs, and influences available payment methods.
+   */
+  amount?: number;
+
+  /**
+   * Indicates that you intend to make future payments with this PaymentIntent’s payment method.
+   *
+   * @docs https://stripe.com/docs/api/payment_intents/create#create_payment_intent-setup_future_usage
+   */
+  setup_future_usage?: 'off_session' | 'on_session';
+
+  /**
+   * Controls when the funds will be captured from the customer’s account.
+   *
+   * @docs https://stripe.com/docs/api/payment_intents/create#create_payment_intent-capture_method
+   */
+  capture_method?: 'manual' | 'automatic';
+
+  /**
+   * Instead of using automatic payment methods, declare specific payment methods to enable.
+   *
+   * @docs https://stripe.com/docs/payments/payment-methods/overview
+   */
+  payment_method_types?: string[];
 }
 
 /*

package/types/stripe-js/payment-intents.d.ts

@@ -41,6 +41,11 @@ export type CreatePaymentMethodData =
   | CreatePaymentMethodSofortData
   | CreatePaymentMethodWechatPayData;
 
+export {
+  CreatePaymentMethodFromElement,
+  CreatePaymentMethodFromElements,
+} from '../api';
+
 export interface CreatePaymentMethodAlipayData
   extends PaymentMethodCreateParams {
   type: 'alipay';
@@ -123,7 +128,8 @@ export interface CreatePaymentMethodCardData extends PaymentMethodCreateParams {
   card: StripeCardElement | StripeCardNumberElement | {token: string};
 }
 
-interface CreatePaymentMethodCashappData extends PaymentMethodCreateParams {
+export interface CreatePaymentMethodCashappData
+  extends PaymentMethodCreateParams {
   type: 'cashapp';
 }
 
@@ -652,7 +658,7 @@ export interface ConfirmCardPaymentOptions {
  * Data to be sent with a `stripe.confirmCashappPayment` request.
  * Refer to the [Payment Intents API](https://stripe.com/docs/api/payment_intents/confirm) for a full list of parameters.
  */
-interface ConfirmCashappPaymentData extends PaymentIntentConfirmParams {
+export interface ConfirmCashappPaymentData extends PaymentIntentConfirmParams {
   /**
    * The `id` of an existing [PaymentMethod](https://stripe.com/docs/api/payment_methods).
    * This field is optional if a `PaymentMethod` has already been attached to this `PaymentIntent` or a new `PaymentMethod` will be created.
@@ -670,7 +676,7 @@ interface ConfirmCashappPaymentData extends PaymentIntentConfirmParams {
 /**
  * An options object to control the behavior of `stripe.confirmCashappPayment`.
  */
-interface ConfirmCashappPaymentOptions {
+export interface ConfirmCashappPaymentOptions {
   /**
    * Set this to `false` if you want to [manually handle the authorization QR code or redirect](https://stripe.com/docs/payments/cash-app-pay/accept-a-payment?platform=web&ui=API#handle-redirect).
    * Default is `true`.

package/types/stripe-js/setup-intents.d.ts

@@ -42,7 +42,7 @@ export interface ConfirmCardSetupOptions {
   handleActions?: boolean;
 }
 
-interface ConfirmCashappSetupData extends SetupIntentConfirmParams {
+export interface ConfirmCashappSetupData extends SetupIntentConfirmParams {
   /*
    * Either the `id` of an existing [PaymentMethod](https://stripe.com/docs/api/payment_methods), or an object containing data to create a `PaymentMethod` with.
    * This field is optional if a `PaymentMethod` has already been attached to this `SetupIntent`.

package/types/stripe-js/stripe.d.ts

@@ -7,7 +7,11 @@ import * as elements from './elements';
 import * as financialConnections from './financial-connections';
 import * as ephemeralKeys from './ephemeral-keys';
 
-import {StripeElements, StripeElementsOptions} from './elements-group';
+import {
+  StripeElements,
+  StripeElementsOptionsClientSecret,
+  StripeElementsOptionsMode,
+} from './elements-group';
 import {CheckoutLocale, RedirectToCheckoutOptions} from './checkout';
 import {PaymentRequestOptions, PaymentRequest} from './payment-request';
 import {StripeElement, StripeElementLocale} from './elements-group';
@@ -21,8 +25,17 @@ export interface Stripe {
 
   /**
    * Create an `Elements` instance, which manages a group of elements.
+   *
+   * https://stripe.com/docs/js/elements_object/create
+   */
+  elements(options?: StripeElementsOptionsClientSecret): StripeElements;
+
+  /**
+   * Create an `Elements` instance, which manages a group of elements.
+   *
+   * https://stripe.com/docs/js/elements_object/create_without_intent
    */
-  elements(options?: StripeElementsOptions): StripeElements;
+  elements(options?: StripeElementsOptionsMode): StripeElements;
 
   /////////////////////////////
   /// Checkout
@@ -61,6 +74,24 @@ export interface Stripe {
     redirect: 'if_required';
   }): Promise<PaymentIntentResult>;
 
+  /**
+   * Use `stripe.confirmPayment` to confirm a PaymentIntent using data collected by the [Payment Element](https://stripe.com/docs/js/element/payment_element).
+   * When called, `stripe.confirmPayment` will attempt to complete any [required actions](https://stripe.com/docs/payments/intents), such as authenticating your user by displaying a 3DS dialog or redirecting them to a bank authorization page.
+   * Your user will be redirected to the return_url you pass once the confirmation is complete.
+   *
+   * By default, `stripe.confirmPayment` will always redirect to your return_url after a successful confirmation.
+   * If you set `redirect: "if_required"`, then `stripe.confirmPayment` will only redirect if your user chooses a redirect-based payment method.
+   * Setting `if_required` requires that you handle successful confirmations for redirect-based and non-redirect based payment methods separately.
+   *
+   * @docs https://stripe.com/docs/js/payment_intents/confirm_payment
+   */
+  confirmPayment(options: {
+    elements?: StripeElements;
+    clientSecret: string;
+    confirmParams?: Partial<paymentIntents.ConfirmPaymentData>;
+    redirect: 'if_required';
+  }): Promise<PaymentIntentResult>;
+
   /**
    * Use `stripe.confirmPayment` to confirm a PaymentIntent using data collected by the [Payment Element](https://stripe.com/docs/js/element/payment_element).
    * When called, `stripe.confirmPayment` will attempt to complete any [required actions](https://stripe.com/docs/payments/intents), such as authenticating your user by displaying a 3DS dialog or redirecting them to a bank authorization page.
@@ -74,6 +105,20 @@ export interface Stripe {
     redirect?: 'always';
   }): Promise<never | {error: StripeError}>;
 
+  /**
+   * Use `stripe.confirmPayment` to confirm a PaymentIntent using data collected by the [Payment Element](https://stripe.com/docs/js/element/payment_element).
+   * When called, `stripe.confirmPayment` will attempt to complete any [required actions](https://stripe.com/docs/payments/intents), such as authenticating your user by displaying a 3DS dialog or redirecting them to a bank authorization page.
+   * Your user will be redirected to the return_url you pass once the confirmation is complete.
+   *
+   * @docs https://stripe.com/docs/js/payment_intents/confirm_payment
+   */
+  confirmPayment(options: {
+    elements?: StripeElements;
+    clientSecret: string;
+    confirmParams: paymentIntents.ConfirmPaymentData;
+    redirect?: 'always';
+  }): Promise<never | {error: StripeError}>;
+
   /**
    * Use `stripe.confirmAcssDebitPayment` in the [Accept a Canadian pre-authorized debit payment](https://stripe.com/docs/payments/acss-debit/accept-a-payment) flow when the customer submits your payment form.
    * When called, it will automatically pop up a modal to collect bank account details and verification, accept the mandate, and confirm the [PaymentIntent](https://stripe.com/docs/api/payment_intents) when the user submits the form.
@@ -532,6 +577,24 @@ export interface Stripe {
    */
   handleCardAction(clientSecret: string): Promise<PaymentIntentResult>;
 
+  /**
+   * Use `stripe.handleNextAction` in the Payment Intents API finalizing payments on the server flow to finish confirmation of a [PaymentIntent](https://stripe.com/docs/api/payment_intents) or [SetupIntent](https://stripe.com/docs/api/setup_intents) with the `requires_action` status.
+   * It will throw an error if the `PaymentIntent` has a different status.
+   *
+   * Note that `stripe.handleNextAction` may take several seconds to complete.
+   * During that time, you should disable your form from being resubmitted and show a waiting indicator like a spinner.
+   * If you receive an error result, you should be sure to show that error to the customer, re-enable the form, and hide the waiting indicator.
+   *
+   * Additionally, `stripe.handleNextAction` may trigger a [3D Secure](https://stripe.com/docs/payments/3d-secure) authentication challenge.
+   * The authentication challenge requires a context switch that can be hard to follow on a screen-reader.
+   * Ensure that your form is accessible by ensuring that success or error messages are clearly read out.
+   *
+   * @docs https://stripe.com/docs/js/payment_intents/handle_next_action
+   */
+  handleNextAction(options: {
+    clientSecret: string;
+  }): Promise<PaymentIntentResult>;
+
   /**
    * Use `stripe.verifyMicrodepositsForPayment` in the [Accept a Canadian pre-authorized debit payment](https://stripe.com/docs/payments/acss-debit/accept-a-payment) flow
    * to verify a customer's bank account with micro-deposits.
@@ -570,6 +633,24 @@ export interface Stripe {
     paymentMethodData: paymentIntents.CreatePaymentMethodData
   ): Promise<PaymentMethodResult>;
 
+  /**
+   * Use stripe.createPaymentMethod to convert payment information collected by elements into a [PaymentMethod](https://stripe.com/docs/api/payment_methods) object that you safely pass to your server to use in an API call.
+   *
+   * @docs https://stripe.com/docs/js/payment_methods/create_payment_method_elements
+   */
+  createPaymentMethod(
+    options: paymentIntents.CreatePaymentMethodFromElements
+  ): Promise<PaymentMethodResult>;
+
+  /**
+   * Use stripe.createPaymentMethod to convert payment information collected by elements into a [PaymentMethod](https://stripe.com/docs/api/payment_methods) object that you safely pass to your server to use in an API call.
+   *
+   * @docs https://stripe.com/docs/js/payment_methods/create_payment_method_elements
+   */
+  createPaymentMethod(
+    options: paymentIntents.CreatePaymentMethodFromElement
+  ): Promise<PaymentMethodResult>;
+
   /**
    * Retrieve a [PaymentIntent](https://stripe.com/docs/api/payment_intents) using its [client secret](https://stripe.com/docs/api/payment_intents/object#payment_intent_object-client_secret).
    *
@@ -600,6 +681,24 @@ export interface Stripe {
     redirect: 'if_required';
   }): Promise<SetupIntentResult>;
 
+  /**
+   * Use `stripe.confirmSetup` to confirm a SetupIntent using data collected by the [Payment Element](https://stripe.com/docs/js/element/payment_element).
+   * When called, `stripe.confirmSetup` will attempt to complete any [required actions](https://stripe.com/docs/payments/intents), such as authenticating your user by displaying a 3DS dialog or redirecting them to a bank authorization page.
+   * Your user will be redirected to the return_url you pass once the confirmation is complete.
+   *
+   * By default, stripe.`confirmSetup` will always redirect to your return_url after a successful confirmation.
+   * If you set `redirect: "if_required"`, then `stripe.confirmSetup` will only redirect if your user chooses a redirect-based payment method.
+   * Setting `if_required` requires that you handle successful confirmations for redirect-based and non-redirect based payment methods separately.
+   *
+   * @docs https://stripe.com/docs/js/setup_intents/confirm_setup
+   */
+  confirmSetup(options: {
+    elements?: StripeElements;
+    clientSecret: string;
+    confirmParams?: Partial<paymentIntents.ConfirmPaymentData>;
+    redirect: 'if_required';
+  }): Promise<SetupIntentResult>;
+
   /**
    * Use `stripe.confirmSetup` to confirm a SetupIntent using data collected by the [Payment Element](https://stripe.com/docs/js/element/payment_element).
    * When called, `stripe.confirmSetup` will attempt to complete any [required actions](https://stripe.com/docs/payments/intents), such as authenticating your user by displaying a 3DS dialog or redirecting them to a bank authorization page.
@@ -613,6 +712,20 @@ export interface Stripe {
     redirect?: 'always';
   }): Promise<never | {error: StripeError}>;
 
+  /**
+   * Use `stripe.confirmSetup` to confirm a SetupIntent using data collected by the [Payment Element](https://stripe.com/docs/js/element/payment_element).
+   * When called, `stripe.confirmSetup` will attempt to complete any [required actions](https://stripe.com/docs/payments/intents), such as authenticating your user by displaying a 3DS dialog or redirecting them to a bank authorization page.
+   * Your user will be redirected to the return_url you pass once the confirmation is complete.
+   *
+   * @docs https://stripe.com/docs/js/setup_intents/confirm_setup
+   */
+  confirmSetup(options: {
+    elements?: StripeElements;
+    clientSecret: string;
+    confirmParams: paymentIntents.ConfirmPaymentData;
+    redirect?: 'always';
+  }): Promise<never | {error: StripeError}>;
+
   /**
    * Use `stripe.confirmAcssDebitSetup` to [save details for future payments with pre-authorized debit in Canada](https://stripe.com/docs/payments/acss-debit/set-up-payment).
    * When called, it will automatically pop up a modal to collect bank account details and verification, accept the mandate, and confirm the [SetupIntent](https://stripe.com/docs/api/setup_intents) when the user submits the form.