From 67cbedb2d8911fb5211ea9d37a42ff566c8896fb Mon Sep 17 00:00:00 2001
From: graceg-stripe <76074026+graceg-stripe@users.noreply.github.com>
Date: Tue, 26 Jul 2022 09:41:37 -0700
Subject: [PATCH] Add loaderstart event (#336)

---
 tests/types/src/valid.ts                         |  3 +++
 .../stripe-js/elements/link-authentication.d.ts  | 16 ++++++++++++++++
 types/stripe-js/elements/payment.d.ts            | 16 ++++++++++++++++
 types/stripe-js/elements/shipping-address.d.ts   | 16 ++++++++++++++++
 4 files changed, 51 insertions(+)

diff --git a/tests/types/src/valid.ts b/tests/types/src/valid.ts
index 5eff893f..113db7f2 100644
--- a/tests/types/src/valid.ts
+++ b/tests/types/src/valid.ts
@@ -319,6 +319,7 @@ paymentElement
   .on('ready', (e: {elementType: 'payment'}) => {})
   .on('focus', (e: {elementType: 'payment'}) => {})
   .on('blur', (e: {elementType: 'payment'}) => {})
+  .on('loaderstart', (e: {elementType: 'payment'}) => {})
   .on(
     'change',
     (e: {
@@ -472,6 +473,7 @@ linkAuthenticationElement
   .on('focus', (e: {elementType: 'linkAuthentication'}) => {})
   .on('blur', (e: {elementType: 'linkAuthentication'}) => {})
   .on('change', (e: StripeLinkAuthenticationElementChangeEvent) => {})
+  .on('loaderstart', (e: {elementType: 'linkAuthentication'}) => {})
   .on(
     'loaderror',
     (e: {
@@ -512,6 +514,7 @@ shippingAddressElement
   .on('focus', (e: {elementType: 'shippingAddress'}) => {})
   .on('blur', (e: {elementType: 'shippingAddress'}) => {})
   .on('change', (e: StripeShippingAddressElementChangeEvent) => {})
+  .on('loaderstart', (e: {elementType: 'shippingAddress'}) => {})
   .on(
     'loaderror',
     (e: {
diff --git a/types/stripe-js/elements/link-authentication.d.ts b/types/stripe-js/elements/link-authentication.d.ts
index 25018039..89726ba8 100644
--- a/types/stripe-js/elements/link-authentication.d.ts
+++ b/types/stripe-js/elements/link-authentication.d.ts
@@ -106,6 +106,22 @@ export type StripeLinkAuthenticationElement = StripeElementBase & {
       error: StripeError;
     }) => any
   ): StripeLinkAuthenticationElement;
+
+  /**
+   * Triggered when the loader UI is mounted to the DOM and ready to be displayed.
+   */
+  on(
+    eventType: 'loaderstart',
+    handler: (event: {elementType: 'linkAuthentication'}) => any
+  ): StripeLinkAuthenticationElement;
+  once(
+    eventType: 'loaderstart',
+    handler: (event: {elementType: 'linkAuthentication'}) => any
+  ): StripeLinkAuthenticationElement;
+  off(
+    eventType: 'loaderstart',
+    handler?: (event: {elementType: 'linkAuthentication'}) => any
+  ): StripeLinkAuthenticationElement;
 };
 
 export interface StripeLinkAuthenticationElementOptions {
diff --git a/types/stripe-js/elements/payment.d.ts b/types/stripe-js/elements/payment.d.ts
index ccc3645c..c10be27d 100644
--- a/types/stripe-js/elements/payment.d.ts
+++ b/types/stripe-js/elements/payment.d.ts
@@ -98,6 +98,22 @@ export type StripePaymentElement = StripeElementBase & {
     handler?: (event: {elementType: 'payment'; error: StripeError}) => any
   ): StripePaymentElement;
 
+  /**
+   * Triggered when the loader UI is mounted to the DOM and ready to be displayed.
+   */
+  on(
+    eventType: 'loaderstart',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  once(
+    eventType: 'loaderstart',
+    handler: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+  off(
+    eventType: 'loaderstart',
+    handler?: (event: {elementType: 'payment'}) => any
+  ): StripePaymentElement;
+
   /**
    * Updates the options the `PaymentElement` was initialized with.
    * Updates are merged into the existing configuration.
diff --git a/types/stripe-js/elements/shipping-address.d.ts b/types/stripe-js/elements/shipping-address.d.ts
index 18627dec..db0801fa 100644
--- a/types/stripe-js/elements/shipping-address.d.ts
+++ b/types/stripe-js/elements/shipping-address.d.ts
@@ -106,6 +106,22 @@ export type StripeShippingAddressElement = StripeElementBase & {
       error: StripeError;
     }) => any
   ): StripeShippingAddressElement;
+
+  /**
+   * Triggered when the loader UI is mounted to the DOM and ready to be displayed.
+   */
+  on(
+    eventType: 'loaderstart',
+    handler: (event: {elementType: 'shippingAddress'}) => any
+  ): StripeShippingAddressElement;
+  once(
+    eventType: 'loaderstart',
+    handler: (event: {elementType: 'shippingAddress'}) => any
+  ): StripeShippingAddressElement;
+  off(
+    eventType: 'loaderstart',
+    handler?: (event: {elementType: 'shippingAddress'}) => any
+  ): StripeShippingAddressElement;
 };
 
 export interface StripeShippingAddressElementOptions {