@stripe/stripe-js 1.20.2 → 1.21.2

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

@@ -1,140 +1,140 @@
-///<reference path='./base.d.ts' />
+import {StripeElementBase, StripeElementClasses} from './base';
+import {PaymentRequest} from '../payment-request';
+import {Omit} from '../../utils';
 
-declare module '@stripe/stripe-js' {
-  type StripePaymentRequestButtonElement = StripeElementBase & {
-    /**
-     * Triggered when the payment request button is clicked.
-     */
-    on(
-      eventType: 'click',
-      handler: (event: StripePaymentRequestButtonElementClickEvent) => any
-    ): StripePaymentRequestButtonElement;
-    once(
-      eventType: 'click',
-      handler: (event: StripePaymentRequestButtonElementClickEvent) => any
-    ): StripePaymentRequestButtonElement;
-    off(
-      eventType: 'click',
-      handler?: (event: StripePaymentRequestButtonElementClickEvent) => any
-    ): StripePaymentRequestButtonElement;
+export type StripePaymentRequestButtonElement = StripeElementBase & {
+  /**
+   * Triggered when the payment request button is clicked.
+   */
+  on(
+    eventType: 'click',
+    handler: (event: StripePaymentRequestButtonElementClickEvent) => any
+  ): StripePaymentRequestButtonElement;
+  once(
+    eventType: 'click',
+    handler: (event: StripePaymentRequestButtonElementClickEvent) => any
+  ): StripePaymentRequestButtonElement;
+  off(
+    eventType: 'click',
+    handler?: (event: StripePaymentRequestButtonElementClickEvent) => any
+  ): StripePaymentRequestButtonElement;
 
-    /**
-     * Triggered when the element is fully rendered and can accept `element.focus` calls.
-     */
-    on(
-      eventType: 'ready',
-      handler: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
-    once(
-      eventType: 'ready',
-      handler: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
-    off(
-      eventType: 'ready',
-      handler?: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
+  /**
+   * Triggered when the element is fully rendered and can accept `element.focus` calls.
+   */
+  on(
+    eventType: 'ready',
+    handler: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
+  once(
+    eventType: 'ready',
+    handler: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
+  off(
+    eventType: 'ready',
+    handler?: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
 
-    /**
-     * Triggered when the element gains focus.
-     */
-    on(
-      eventType: 'focus',
-      handler: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
-    once(
-      eventType: 'focus',
-      handler: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
-    off(
-      eventType: 'focus',
-      handler?: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
+  /**
+   * Triggered when the element gains focus.
+   */
+  on(
+    eventType: 'focus',
+    handler: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
+  once(
+    eventType: 'focus',
+    handler: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
+  off(
+    eventType: 'focus',
+    handler?: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
 
-    /**
-     * Triggered when the element loses focus.
-     */
-    on(
-      eventType: 'blur',
-      handler: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
-    once(
-      eventType: 'blur',
-      handler: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
-    off(
-      eventType: 'blur',
-      handler?: (event: {elementType: 'paymentRequestButton'}) => any
-    ): StripePaymentRequestButtonElement;
+  /**
+   * Triggered when the element loses focus.
+   */
+  on(
+    eventType: 'blur',
+    handler: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
+  once(
+    eventType: 'blur',
+    handler: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
+  off(
+    eventType: 'blur',
+    handler?: (event: {elementType: 'paymentRequestButton'}) => any
+  ): StripePaymentRequestButtonElement;
 
-    /**
-     * Updates the options the `PaymentRequestButtonElement` was initialized with.
-     * Updates are merged into the existing configuration.
-     *
-     * The styles of an `PaymentRequestButtonElement` 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<
-        Omit<StripePaymentRequestButtonElementOptions, 'paymentRequest'>
-      >
-    ): void;
-  };
+  /**
+   * Updates the options the `PaymentRequestButtonElement` was initialized with.
+   * Updates are merged into the existing configuration.
+   *
+   * The styles of an `PaymentRequestButtonElement` 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<
+      Omit<StripePaymentRequestButtonElementOptions, 'paymentRequest'>
+    >
+  ): void;
+};
 
-  interface StripePaymentRequestButtonElementOptions {
-    classes?: StripeElementClasses;
+export interface StripePaymentRequestButtonElementOptions {
+  classes?: StripeElementClasses;
 
-    /**
-     * An object used to customize the appearance of the Payment Request Button.
-     * The object must have a single `paymentRequestButton` field, containing any of the following sub-fields
-     */
-    style?: {
-      paymentRequestButton: {
-        /**
-         * Preferred button type to display. Available types, by wallet:
-         *
-         * Browser card: default, book, buy, or donate.
-         *
-         * Google Pay: default, buy, or donate.
-         *
-         * Apple Pay: default, book, buy, donate, check-out, subscribe, reload, add-money, top-up, order, rent, support, contribute, tip
-         *
-         * When a wallet does not support the provided value, default is used as a fallback.
-         */
-        type?:
-          | 'default'
-          | 'book'
-          | 'buy'
-          | 'donate'
-          | 'check-out'
-          | 'subscribe'
-          | 'reload'
-          | 'add-money'
-          | 'top-up'
-          | 'order'
-          | 'rent'
-          | 'support'
-          | 'contribute'
-          | 'tip';
+  /**
+   * An object used to customize the appearance of the Payment Request Button.
+   * The object must have a single `paymentRequestButton` field, containing any of the following sub-fields
+   */
+  style?: {
+    paymentRequestButton: {
+      /**
+       * Preferred button type to display. Available types, by wallet:
+       *
+       * Browser card: default, book, buy, or donate.
+       *
+       * Google Pay: default, buy, or donate.
+       *
+       * Apple Pay: default, book, buy, donate, check-out, subscribe, reload, add-money, top-up, order, rent, support, contribute, tip
+       *
+       * When a wallet does not support the provided value, default is used as a fallback.
+       */
+      type?:
+        | 'default'
+        | 'book'
+        | 'buy'
+        | 'donate'
+        | 'check-out'
+        | 'subscribe'
+        | 'reload'
+        | 'add-money'
+        | 'top-up'
+        | 'order'
+        | 'rent'
+        | 'support'
+        | 'contribute'
+        | 'tip';
 
-        /**
-         * One of dark, light, or light-outline. The default is dark.
-         */
-        theme?: 'dark' | 'light' | 'light-outline';
+      /**
+       * One of dark, light, or light-outline. The default is dark.
+       */
+      theme?: 'dark' | 'light' | 'light-outline';
 
-        /**
-         * The height of the Payment Request Button. Accepts px unit values.
-         */
-        height?: string;
-      };
+      /**
+       * The height of the Payment Request Button. Accepts px unit values.
+       */
+      height?: string;
     };
+  };
 
-    /**
-     * A `PaymentRequest` object used to configure the element.
-     */
-    paymentRequest: PaymentRequest;
-  }
+  /**
+   * A `PaymentRequest` object used to configure the element.
+   */
+  paymentRequest: PaymentRequest;
+}
 
-  interface StripePaymentRequestButtonElementClickEvent {
-    preventDefault: () => void;
-  }
+export interface StripePaymentRequestButtonElementClickEvent {
+  preventDefault: () => void;
 }

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

@@ -1,170 +1,191 @@
-///<reference path='./base.d.ts' />
-
-declare module '@stripe/stripe-js' {
-  type StripePaymentElement = StripeElementBase & {
-    /**
-     * The change event is triggered when the `Element`'s value changes.
-     */
-    on(
-      eventType: 'change',
-      handler: (event: StripePaymentElementChangeEvent) => any
-    ): StripePaymentElement;
-    once(
-      eventType: 'change',
-      handler: (event: StripePaymentElementChangeEvent) => any
-    ): StripePaymentElement;
-    off(
-      eventType: 'change',
-      handler?: (event: StripePaymentElementChangeEvent) => any
-    ): StripePaymentElement;
-
-    /**
-     * Triggered when the element is fully rendered and can accept `element.focus` calls.
-     */
-    on(
-      eventType: 'ready',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    once(
-      eventType: 'ready',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    off(
-      eventType: 'ready',
-      handler?: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-
-    /**
-     * Triggered when the element gains focus.
-     */
-    on(
-      eventType: 'focus',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    once(
-      eventType: 'focus',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    off(
-      eventType: 'focus',
-      handler?: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-
-    /**
-     * Triggered when the element loses focus.
-     */
-    on(
-      eventType: 'blur',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    once(
-      eventType: 'blur',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    off(
-      eventType: 'blur',
-      handler?: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-
-    /**
-     * Triggered when the escape key is pressed within the element.
-     */
-    on(
-      eventType: 'escape',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    once(
-      eventType: 'escape',
-      handler: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-    off(
-      eventType: 'escape',
-      handler?: (event: {elementType: 'payment'}) => any
-    ): StripePaymentElement;
-
-    /**
-     * Updates the options the `PaymentElement` was initialized with.
-     * Updates are merged into the existing configuration.
-     */
-    update(options: Partial<StripePaymentElementOptions>): StripePaymentElement;
-
-    /**
-     * Collapses the Payment Element into a row of payment method tabs.
-     */
-    collapse(): StripePaymentElement;
-  };
-
-  type FieldOption = 'auto' | 'never';
-
-  interface FieldsOption {
-    billingDetails?:
-      | FieldOption
-      | {
-          name?: FieldOption;
-          email?: FieldOption;
-          phone?: FieldOption;
-          address?:
-            | FieldOption
-            | {
-                country?: FieldOption;
-                postalCode?: FieldOption;
-                state?: FieldOption;
-                city?: FieldOption;
-                line1?: FieldOption;
-                line2?: FieldOption;
-              };
-        };
-  }
-
-  type TermOption = 'auto' | 'always' | 'never';
-
-  interface TermsOption {
-    bancontact?: TermOption;
-    card?: TermOption;
-    ideal?: TermOption;
-    sepaDebit?: TermOption;
-    sofort?: TermOption;
-  }
-
-  interface StripePaymentElementOptions {
-    /**
-     * Override the business name displayed in the Payment Element.
-     * By default the PaymentElement will use your Stripe account or business name.
-     */
-    business?: {name: string};
-
-    /**
-     * Override the order in which payment methods are displayed in the Payment Element.
-     * By default, the Payment Element will use a dynamic ordering that optimizes payment method display for each user.
-     */
-    paymentMethodOrder?: string[];
-
-    /**
-     * Control which fields are displayed in the Payment Element.
-     */
-    fields?: FieldsOption;
-
-    /**
-     * Control terms display in the Payment Element.
-     */
-    terms?: TermsOption;
-  }
-
-  interface StripePaymentElementChangeEvent
-    extends Omit<StripeElementChangeEvent, 'error'> {
-    /**
-     * The type of element that emitted this event.
-     */
-    elementType: 'payment';
-
-    /**
-     * Whether or not the Payment Element is currently collapsed.
-     */
-    collapsed: boolean;
-
-    /**
-     * An object containing the currently selected PaymentMethod type.
-     */
-    value: {type: string};
-  }
+import {StripeElementBase} from './base';
+
+export type StripePaymentElement = StripeElementBase & {
+  /**
+   * The change event is triggered when the `Element`'s value changes.
+   */
+  on(
+    eventType: 'change',
+    handler: (event: StripePaymentElementChangeEvent) => any
+  ): StripePaymentElement;
+  once(
+    eventType: 'change',
+    handler: (event: StripePaymentElementChangeEvent) => any
+  ): StripePaymentElement;
+  off(
+    eventType: 'change',
+    handler?: (event: StripePaymentElementChangeEvent) => any
+  ): StripePaymentElement;
+
+  /**
+   * Triggered when the element is fully rendered and can accept `element.focus` calls.
+   */
+  on(
+    eventType: 'ready',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  once(
+    eventType: 'ready',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  off(
+    eventType: 'ready',
+    handler?: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+
+  /**
+   * Triggered when the element gains focus.
+   */
+  on(
+    eventType: 'focus',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  once(
+    eventType: 'focus',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  off(
+    eventType: 'focus',
+    handler?: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+
+  /**
+   * Triggered when the element loses focus.
+   */
+  on(
+    eventType: 'blur',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  once(
+    eventType: 'blur',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  off(
+    eventType: 'blur',
+    handler?: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+
+  /**
+   * Triggered when the escape key is pressed within the element.
+   */
+  on(
+    eventType: 'escape',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  once(
+    eventType: 'escape',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  off(
+    eventType: 'escape',
+    handler?: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+
+  /**
+   * Updates the options the `PaymentElement` was initialized with.
+   * Updates are merged into the existing configuration.
+   */
+  update(options: Partial<StripePaymentElementOptions>): StripePaymentElement;
+
+  /**
+   * Collapses the Payment Element into a row of payment method tabs.
+   */
+  collapse(): StripePaymentElement;
+};
+
+export type FieldOption = 'auto' | 'never';
+
+export interface FieldsOption {
+  billingDetails?:
+    | FieldOption
+    | {
+        name?: FieldOption;
+        email?: FieldOption;
+        phone?: FieldOption;
+        address?:
+          | FieldOption
+          | {
+              country?: FieldOption;
+              postalCode?: FieldOption;
+              state?: FieldOption;
+              city?: FieldOption;
+              line1?: FieldOption;
+              line2?: FieldOption;
+            };
+      };
+}
+
+export type TermOption = 'auto' | 'always' | 'never';
+
+export interface TermsOption {
+  bancontact?: TermOption;
+  card?: TermOption;
+  ideal?: TermOption;
+  sepaDebit?: TermOption;
+  sofort?: TermOption;
+  auBecsDebit?: TermOption;
+  usBankAccount?: TermOption;
+}
+
+export type WalletOption = 'auto' | 'never';
+
+export interface WalletsOption {
+  applePay?: WalletOption;
+  googlePay?: WalletOption;
+}
+
+export interface StripePaymentElementOptions {
+  /**
+   * Override the business name displayed in the Payment Element.
+   * By default the PaymentElement will use your Stripe account or business name.
+   */
+  business?: {name: string};
+
+  /**
+   * Override the order in which payment methods are displayed in the Payment Element.
+   * By default, the Payment Element will use a dynamic ordering that optimizes payment method display for each user.
+   */
+  paymentMethodOrder?: string[];
+
+  /**
+   * Control which fields are displayed in the Payment Element.
+   */
+  fields?: FieldsOption;
+
+  /**
+   * Control terms display in the Payment Element.
+   */
+  terms?: TermsOption;
+
+  /**
+   * Control wallets display in the Payment Element.
+   */
+  wallets?: WalletsOption;
+}
+
+export interface StripePaymentElementChangeEvent {
+  /**
+   * The type of element that emitted this event.
+   */
+  elementType: 'payment';
+
+  /**
+   * `true` if the all inputs in the Payment Element are empty.
+   */
+  empty: boolean;
+
+  /**
+   * `true` if the every input in the Payment Element is well-formed and potentially complete.
+   */
+  complete: boolean;
+
+  /**
+   * Whether or not the Payment Element is currently collapsed.
+   */
+  collapsed: boolean;
+
+  /**
+   * An object containing the currently selected PaymentMethod type (in snake_case, for example "afterpay_clearpay").
+   */
+  value: {type: string};
 }