@stripe/connect-js 3.1.0 → 3.1.1-beta.1

package/README.md

@@ -5,7 +5,7 @@ This NPM package contains initialization logic for Connect embedded components a
 
 Calling `loadConnectAndInitialize` always loads the latest version of Connect.js, regardless of which version of `@stripe/connect-js` you use. Updates for this package only impact tooling around the `loadConnectAndInitialize` helper itself and the TypeScript type definitions provided for Connect.js. Updates do not affect runtime availability of features of Connect.js.
 
-The embedded onboarding component is generally available now. Please refer to our [documentation](https://stripe.com/docs/connect/get-started-connect-embedded-components#account-onboarding) for more information.
+The embedded onboarding component is generally available now. Please refer to our [documentation](https://stripe.com/docs/connect/supported-embedded-components#account-onboarding) for more information.
 
 Note: Majority of Connect embedded components are currently still in beta. Please [contact us](https://stripe.com/docs/connect/get-started-connect-embedded-components#access) to request beta access.
 

package/dist/connect.esm.js

@@ -1,22 +1,44 @@
 /* eslint-disable @typescript-eslint/no-empty-function */
 /* eslint-disable @typescript-eslint/no-unused-vars */
 const ConnectElementCustomMethodConfig = {
+  "payment-details": {
+    setPayment: _payment => {},
+    setOnClose: _listener => {}
+  },
   "account-onboarding": {
-    setFullTermsOfServiceUrl: termOfServiceUrl => {},
-    setRecipientTermsOfServiceUrl: recipientTermsOfServiceUrl => {},
-    setPrivacyPolicyUrl: privacyPolicyUrl => {},
-    setSkipTermsOfServiceCollection: skipTermsOfServiceCollection => {},
-    setOnExit: listener => {}
+    setFullTermsOfServiceUrl: _termOfServiceUrl => {},
+    setRecipientTermsOfServiceUrl: _recipientTermsOfServiceUrl => {},
+    setPrivacyPolicyUrl: _privacyPolicyUrl => {},
+    setSkipTermsOfServiceCollection: _skipTermsOfServiceCollection => {},
+    setOnExit: _listener => {}
+  },
+  "issuing-card": {
+    setDefaultCard: _defaultCard => {},
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
+  },
+  "issuing-cards-list": {
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
   }
 };
 
 const componentNameMapping = {
-  "account-onboarding": "stripe-connect-account-onboarding"
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding",
+  "payment-method-settings": "stripe-connect-payment-method-settings",
+  "account-management": "stripe-connect-account-management",
+  "notification-banner": "stripe-connect-notification-banner",
+  "instant-payouts": "stripe-connect-instant-payouts",
+  "issuing-card": "stripe-connect-issuing-card",
+  "issuing-cards-list": "stripe-connect-issuing-cards-list"
 };
 const EXISTING_SCRIPT_MESSAGE = "loadConnect was called but an existing Connect.js script already exists in the document; existing script parameters will be used";
-const V0_URL = "https://connect-js.stripe.com/v1.0/connect.js";
+const V0_URL = "https://connect-js.stripe.com/v0.1/connect.js";
 const findScript = () => {
-  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0];
+  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0] || null;
 };
 const injectScript = () => {
   const script = document.createElement("script");
@@ -125,7 +147,7 @@ const createWrapper = stripeConnect => {
           sdk: true,
           sdkOptions: {
             // This will be replaced by the npm package version when bundling
-            sdkVersion: "3.1.0"
+            sdkVersion: "3.1.1-beta.1"
           }
         })
       }));

package/dist/connect.js

@@ -5,22 +5,44 @@ Object.defineProperty(exports, '__esModule', { value: true });
 /* eslint-disable @typescript-eslint/no-empty-function */
 /* eslint-disable @typescript-eslint/no-unused-vars */
 const ConnectElementCustomMethodConfig = {
+  "payment-details": {
+    setPayment: _payment => {},
+    setOnClose: _listener => {}
+  },
   "account-onboarding": {
-    setFullTermsOfServiceUrl: termOfServiceUrl => {},
-    setRecipientTermsOfServiceUrl: recipientTermsOfServiceUrl => {},
-    setPrivacyPolicyUrl: privacyPolicyUrl => {},
-    setSkipTermsOfServiceCollection: skipTermsOfServiceCollection => {},
-    setOnExit: listener => {}
+    setFullTermsOfServiceUrl: _termOfServiceUrl => {},
+    setRecipientTermsOfServiceUrl: _recipientTermsOfServiceUrl => {},
+    setPrivacyPolicyUrl: _privacyPolicyUrl => {},
+    setSkipTermsOfServiceCollection: _skipTermsOfServiceCollection => {},
+    setOnExit: _listener => {}
+  },
+  "issuing-card": {
+    setDefaultCard: _defaultCard => {},
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
+  },
+  "issuing-cards-list": {
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
   }
 };
 
 const componentNameMapping = {
-  "account-onboarding": "stripe-connect-account-onboarding"
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding",
+  "payment-method-settings": "stripe-connect-payment-method-settings",
+  "account-management": "stripe-connect-account-management",
+  "notification-banner": "stripe-connect-notification-banner",
+  "instant-payouts": "stripe-connect-instant-payouts",
+  "issuing-card": "stripe-connect-issuing-card",
+  "issuing-cards-list": "stripe-connect-issuing-cards-list"
 };
 const EXISTING_SCRIPT_MESSAGE = "loadConnect was called but an existing Connect.js script already exists in the document; existing script parameters will be used";
-const V0_URL = "https://connect-js.stripe.com/v1.0/connect.js";
+const V0_URL = "https://connect-js.stripe.com/v0.1/connect.js";
 const findScript = () => {
-  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0];
+  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0] || null;
 };
 const injectScript = () => {
   const script = document.createElement("script");
@@ -129,7 +151,7 @@ const createWrapper = stripeConnect => {
           sdk: true,
           sdkOptions: {
             // This will be replaced by the npm package version when bundling
-            sdkVersion: "3.1.0"
+            sdkVersion: "3.1.1-beta.1"
           }
         })
       }));

package/dist/pure.esm.js

@@ -1,22 +1,44 @@
 /* eslint-disable @typescript-eslint/no-empty-function */
 /* eslint-disable @typescript-eslint/no-unused-vars */
 const ConnectElementCustomMethodConfig = {
+  "payment-details": {
+    setPayment: _payment => {},
+    setOnClose: _listener => {}
+  },
   "account-onboarding": {
-    setFullTermsOfServiceUrl: termOfServiceUrl => {},
-    setRecipientTermsOfServiceUrl: recipientTermsOfServiceUrl => {},
-    setPrivacyPolicyUrl: privacyPolicyUrl => {},
-    setSkipTermsOfServiceCollection: skipTermsOfServiceCollection => {},
-    setOnExit: listener => {}
+    setFullTermsOfServiceUrl: _termOfServiceUrl => {},
+    setRecipientTermsOfServiceUrl: _recipientTermsOfServiceUrl => {},
+    setPrivacyPolicyUrl: _privacyPolicyUrl => {},
+    setSkipTermsOfServiceCollection: _skipTermsOfServiceCollection => {},
+    setOnExit: _listener => {}
+  },
+  "issuing-card": {
+    setDefaultCard: _defaultCard => {},
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
+  },
+  "issuing-cards-list": {
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
   }
 };
 
 const componentNameMapping = {
-  "account-onboarding": "stripe-connect-account-onboarding"
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding",
+  "payment-method-settings": "stripe-connect-payment-method-settings",
+  "account-management": "stripe-connect-account-management",
+  "notification-banner": "stripe-connect-notification-banner",
+  "instant-payouts": "stripe-connect-instant-payouts",
+  "issuing-card": "stripe-connect-issuing-card",
+  "issuing-cards-list": "stripe-connect-issuing-cards-list"
 };
 const EXISTING_SCRIPT_MESSAGE = "loadConnect was called but an existing Connect.js script already exists in the document; existing script parameters will be used";
-const V0_URL = "https://connect-js.stripe.com/v1.0/connect.js";
+const V0_URL = "https://connect-js.stripe.com/v0.1/connect.js";
 const findScript = () => {
-  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0];
+  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0] || null;
 };
 const injectScript = () => {
   const script = document.createElement("script");
@@ -125,7 +147,7 @@ const createWrapper = stripeConnect => {
           sdk: true,
           sdkOptions: {
             // This will be replaced by the npm package version when bundling
-            sdkVersion: "3.1.0"
+            sdkVersion: "3.1.1-beta.1"
           }
         })
       }));

package/dist/pure.js

@@ -5,22 +5,44 @@ Object.defineProperty(exports, '__esModule', { value: true });
 /* eslint-disable @typescript-eslint/no-empty-function */
 /* eslint-disable @typescript-eslint/no-unused-vars */
 const ConnectElementCustomMethodConfig = {
+  "payment-details": {
+    setPayment: _payment => {},
+    setOnClose: _listener => {}
+  },
   "account-onboarding": {
-    setFullTermsOfServiceUrl: termOfServiceUrl => {},
-    setRecipientTermsOfServiceUrl: recipientTermsOfServiceUrl => {},
-    setPrivacyPolicyUrl: privacyPolicyUrl => {},
-    setSkipTermsOfServiceCollection: skipTermsOfServiceCollection => {},
-    setOnExit: listener => {}
+    setFullTermsOfServiceUrl: _termOfServiceUrl => {},
+    setRecipientTermsOfServiceUrl: _recipientTermsOfServiceUrl => {},
+    setPrivacyPolicyUrl: _privacyPolicyUrl => {},
+    setSkipTermsOfServiceCollection: _skipTermsOfServiceCollection => {},
+    setOnExit: _listener => {}
+  },
+  "issuing-card": {
+    setDefaultCard: _defaultCard => {},
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
+  },
+  "issuing-cards-list": {
+    setCardArtFileLink: _cardArtFileLink => {},
+    setFetchEphemeralKey: _fetchEphemeralKey => {}
   }
 };
 
 const componentNameMapping = {
-  "account-onboarding": "stripe-connect-account-onboarding"
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding",
+  "payment-method-settings": "stripe-connect-payment-method-settings",
+  "account-management": "stripe-connect-account-management",
+  "notification-banner": "stripe-connect-notification-banner",
+  "instant-payouts": "stripe-connect-instant-payouts",
+  "issuing-card": "stripe-connect-issuing-card",
+  "issuing-cards-list": "stripe-connect-issuing-cards-list"
 };
 const EXISTING_SCRIPT_MESSAGE = "loadConnect was called but an existing Connect.js script already exists in the document; existing script parameters will be used";
-const V0_URL = "https://connect-js.stripe.com/v1.0/connect.js";
+const V0_URL = "https://connect-js.stripe.com/v0.1/connect.js";
 const findScript = () => {
-  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0];
+  return document.querySelectorAll(`script[src="${V0_URL}"]`)[0] || null;
 };
 const injectScript = () => {
   const script = document.createElement("script");
@@ -129,7 +151,7 @@ const createWrapper = stripeConnect => {
           sdk: true,
           sdkOptions: {
             // This will be replaced by the npm package version when bundling
-            sdkVersion: "3.1.0"
+            sdkVersion: "3.1.1-beta.1"
           }
         })
       }));

package/dist/src/shared.d.ts

@@ -1,6 +1,6 @@
 import { IStripeConnectInitParams, StripeConnectInstance, ConnectElementTagName } from "../types";
 export type LoadConnectAndInitialize = (initParams: IStripeConnectInitParams) => StripeConnectInstance;
-type ConnectElementHTMLName = "stripe-connect-account-onboarding";
+export type ConnectElementHTMLName = "stripe-connect-payments" | "stripe-connect-payouts" | "stripe-connect-payment-details" | "stripe-connect-account-onboarding" | "stripe-connect-payment-method-settings" | "stripe-connect-account-management" | "stripe-connect-notification-banner" | "stripe-connect-instant-payouts" | "stripe-connect-issuing-card" | "stripe-connect-issuing-cards-list";
 export declare const componentNameMapping: Record<ConnectElementTagName, ConnectElementHTMLName>;
 type StripeConnectInstanceExtended = StripeConnectInstance & {
     debugInstance: () => Promise<StripeConnectInstance>;

package/dist/types/config.d.ts

@@ -1,9 +1,31 @@
+type FetchEphemeralKeyFunction = (fetchParams: {
+    issuingCard: string;
+    nonce: string;
+}) => Promise<{
+    issuingCard: string;
+    nonce: string;
+    ephemeralKeySecret: string;
+}>;
 export declare const ConnectElementCustomMethodConfig: {
+    "payment-details": {
+        setPayment: (_payment: string | undefined) => void;
+        setOnClose: (_listener: (() => void) | undefined) => void;
+    };
     "account-onboarding": {
-        setFullTermsOfServiceUrl: (termOfServiceUrl: string | undefined) => void;
-        setRecipientTermsOfServiceUrl: (recipientTermsOfServiceUrl: string | undefined) => void;
-        setPrivacyPolicyUrl: (privacyPolicyUrl: string | undefined) => void;
-        setSkipTermsOfServiceCollection: (skipTermsOfServiceCollection: boolean | undefined) => void;
-        setOnExit: (listener: (() => void) | undefined) => void;
+        setFullTermsOfServiceUrl: (_termOfServiceUrl: string | undefined) => void;
+        setRecipientTermsOfServiceUrl: (_recipientTermsOfServiceUrl: string | undefined) => void;
+        setPrivacyPolicyUrl: (_privacyPolicyUrl: string | undefined) => void;
+        setSkipTermsOfServiceCollection: (_skipTermsOfServiceCollection: boolean | undefined) => void;
+        setOnExit: (_listener: (() => void) | undefined) => void;
+    };
+    "issuing-card": {
+        setDefaultCard: (_defaultCard: string | undefined) => void;
+        setCardArtFileLink: (_cardArtFileLink: string | undefined) => void;
+        setFetchEphemeralKey: (_fetchEphemeralKey: FetchEphemeralKeyFunction | undefined) => void;
+    };
+    "issuing-cards-list": {
+        setCardArtFileLink: (_cardArtFileLink: string | undefined) => void;
+        setFetchEphemeralKey: (_fetchEphemeralKey: FetchEphemeralKeyFunction | undefined) => void;
     };
 };
+export {};

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@stripe/connect-js",
-  "version": "3.1.0",
+  "version": "3.1.1-beta.1",
   "description": "Connect.js loading utility package",
   "main": "dist/connect.js",
   "module": "dist/connect.esm.js",
   "types": "types/index.d.ts",
   "typings": "types/index.d.ts",
   "scripts": {
-    "test": "yarn lint && yarn test:unit --passWithNoTests && yarn typecheck",
+    "test": "yarn lint && yarn test:unit --passWithNoTests && yarn typecheck && yarn build",
     "test:unit": "jest",
     "test:types": "zx ./tests/types/scripts/test.mjs",
     "lint": "eslint '{src,types}/**/*.{ts,js}' && yarn prettier-check",

package/src/shared.ts

@@ -10,13 +10,32 @@ export type LoadConnectAndInitialize = (
   initParams: IStripeConnectInitParams
 ) => StripeConnectInstance;
 
-type ConnectElementHTMLName = "stripe-connect-account-onboarding";
+export type ConnectElementHTMLName =
+  | "stripe-connect-payments"
+  | "stripe-connect-payouts"
+  | "stripe-connect-payment-details"
+  | "stripe-connect-account-onboarding"
+  | "stripe-connect-payment-method-settings"
+  | "stripe-connect-account-management"
+  | "stripe-connect-notification-banner"
+  | "stripe-connect-instant-payouts"
+  | "stripe-connect-issuing-card"
+  | "stripe-connect-issuing-cards-list";
 
 export const componentNameMapping: Record<
   ConnectElementTagName,
   ConnectElementHTMLName
 > = {
-  "account-onboarding": "stripe-connect-account-onboarding"
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding",
+  "payment-method-settings": "stripe-connect-payment-method-settings",
+  "account-management": "stripe-connect-account-management",
+  "notification-banner": "stripe-connect-notification-banner",
+  "instant-payouts": "stripe-connect-instant-payouts",
+  "issuing-card": "stripe-connect-issuing-card",
+  "issuing-cards-list": "stripe-connect-issuing-cards-list"
 };
 
 type StripeConnectInstanceExtended = StripeConnectInstance & {
@@ -29,12 +48,14 @@ interface StripeConnectWrapper {
 
 const EXISTING_SCRIPT_MESSAGE =
   "loadConnect was called but an existing Connect.js script already exists in the document; existing script parameters will be used";
-const V0_URL = "https://connect-js.stripe.com/v1.0/connect.js";
+const V0_URL = "https://connect-js.stripe.com/v0.1/connect.js";
 
 export const findScript = (): HTMLScriptElement | null => {
-  return document.querySelectorAll<HTMLScriptElement>(
-    `script[src="${V0_URL}"]`
-  )[0];
+  return (
+    document.querySelectorAll<HTMLScriptElement>(
+      `script[src="${V0_URL}"]`
+    )[0] || null
+  );
 };
 
 const injectScript = (): HTMLScriptElement => {

package/types/checks.ts

@@ -0,0 +1,9 @@
+import { ConnectElementCustomMethodConfig } from "./config";
+import { ConnectElementTagName } from "./shared.d";
+
+// ensure that keys of ConnectElementCustomMethodConfig are from ConnectElementTagName
+export type HasType<T, Q extends T> = Q;
+export type CustomMethodConfigValidation = HasType<
+  ConnectElementTagName,
+  keyof typeof ConnectElementCustomMethodConfig
+>;

package/types/config.ts

@@ -1,27 +1,44 @@
-import { ConnectElementTagName } from "./shared.d";
-
 /* eslint-disable @typescript-eslint/no-empty-function */
 /* eslint-disable @typescript-eslint/no-unused-vars */
 
+type FetchEphemeralKeyFunction = (fetchParams: {
+  issuingCard: string;
+  nonce: string;
+}) => Promise<{
+  issuingCard: string;
+  nonce: string;
+  ephemeralKeySecret: string;
+}>;
+
 export const ConnectElementCustomMethodConfig = {
+  "payment-details": {
+    setPayment: (_payment: string | undefined): void => {},
+    setOnClose: (_listener: (() => void) | undefined): void => {}
+  },
   "account-onboarding": {
     setFullTermsOfServiceUrl: (
-      termOfServiceUrl: string | undefined
+      _termOfServiceUrl: string | undefined
     ): void => {},
     setRecipientTermsOfServiceUrl: (
-      recipientTermsOfServiceUrl: string | undefined
+      _recipientTermsOfServiceUrl: string | undefined
     ): void => {},
-    setPrivacyPolicyUrl: (privacyPolicyUrl: string | undefined): void => {},
+    setPrivacyPolicyUrl: (_privacyPolicyUrl: string | undefined): void => {},
     setSkipTermsOfServiceCollection: (
-      skipTermsOfServiceCollection: boolean | undefined
+      _skipTermsOfServiceCollection: boolean | undefined
     ): void => {},
-    setOnExit: (listener: (() => void) | undefined): void => {}
+    setOnExit: (_listener: (() => void) | undefined): void => {}
+  },
+  "issuing-card": {
+    setDefaultCard: (_defaultCard: string | undefined): void => {},
+    setCardArtFileLink: (_cardArtFileLink: string | undefined): void => {},
+    setFetchEphemeralKey: (
+      _fetchEphemeralKey: FetchEphemeralKeyFunction | undefined
+    ): void => {}
+  },
+  "issuing-cards-list": {
+    setCardArtFileLink: (_cardArtFileLink: string | undefined): void => {},
+    setFetchEphemeralKey: (
+      _fetchEphemeralKey: FetchEphemeralKeyFunction | undefined
+    ): void => {}
   }
 };
-
-// ensure that keys of ConnectElementCustomMethodConfig are from ConnectElementTagName
-type HasType<T, Q extends T> = Q;
-type CustomMethodConfigValidation = HasType<
-  ConnectElementTagName,
-  keyof typeof ConnectElementCustomMethodConfig
->;

package/types/shared.d.ts

@@ -76,17 +76,17 @@ export declare type AppearanceVariables = {
   fontFamily?: string;
 
   /**
-   * The baseline font size set on the embedded component root. This scales the value of other font size variables. This supports pixel values only.
+   * The baseline font size set on the embedded component root. This scales the value of other font size variables. This supports pixel values only ranging from 1px to 40px, 0.1em to 4em, and 0.1rem to 4rem.
    */
   fontSizeBase?: string;
 
   /**
-   * The base spacing unit that derives all spacing values. Increase or decrease this value to make your layout more or less spacious. This supports pixel values only.
+   * The base spacing unit that derives all spacing values. Increase or decrease this value to make your layout more or less spacious. This supports pixel values only ranging from 8px to 20px.
    */
   spacingUnit?: string;
 
   /**
-   * The general border radius used in embedded components. This sets the default border radius for all components. This supports pixel values only.
+   * The general border radius used in embedded components. This sets the default border radius for all components. This supports pixel values only, with a maximum value of 24px.
    */
   borderRadius?: string;
 
@@ -240,15 +240,15 @@ export declare type AppearanceVariables = {
    */
   buttonBorderRadius?: string;
   /**
-   * The border radius used for form elements. This supports pixel values only.
+   * The border radius used for form elements. This supports pixel values only, with a maximum value of 24px.
    */
   formBorderRadius?: string;
   /**
-   * The border radius used for badges. This supports pixel values only.
+   * The border radius used for badges. This supports pixel values only, with a maximum value of 24px.
    */
   badgeBorderRadius?: string;
   /**
-   * The border radius used for overlays. This supports pixel values only.
+   * The border radius used for overlays. This supports pixel values only, with a maximum value of 24px.
    */
   overlayBorderRadius?: string;
 
@@ -262,7 +262,7 @@ export declare type AppearanceVariables = {
 
   // Body Typography
   /**
-   * The font size for the medium body typography. Body typography variables accept a valid font size value.
+   * The font size for the medium body typography. Body typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   bodyMdFontSize?: string;
   /**
@@ -270,7 +270,7 @@ export declare type AppearanceVariables = {
    */
   bodyMdFontWeight?: string;
   /**
-   * The font size for the small body typography. Body typography variables accept a valid font size value.
+   * The font size for the small body typography. Body typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   bodySmFontSize?: string;
   /**
@@ -280,7 +280,7 @@ export declare type AppearanceVariables = {
 
   // Heading Typography
   /**
-   * The font size for the extra large heading typography. Heading typography variables accept a valid font size value.
+   * The font size for the extra large heading typography. Heading typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   headingXlFontSize?: string;
   /**
@@ -292,7 +292,7 @@ export declare type AppearanceVariables = {
    */
   headingXlTextTransform?: string;
   /**
-   * The font size for the large heading typography. Heading typography variables accept a valid font size value.
+   * The font size for the large heading typography. Heading typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   headingLgFontSize?: string;
   /**
@@ -304,7 +304,7 @@ export declare type AppearanceVariables = {
    */
   headingLgTextTransform?: string;
   /**
-   * The font size for the medium heading typography. Heading typography variables accept a valid font size value.
+   * The font size for the medium heading typography. Heading typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   headingMdFontSize?: string;
   /**
@@ -316,7 +316,7 @@ export declare type AppearanceVariables = {
    */
   headingMdTextTransform?: string;
   /**
-   * The font size for the small heading typography. Heading typography variables accept a valid font size value.
+   * The font size for the small heading typography. Heading typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   headingSmFontSize?: string;
   /**
@@ -328,7 +328,7 @@ export declare type AppearanceVariables = {
    */
   headingSmTextTransform?: string;
   /**
-   * The font size for the extra small heading typography. Heading typography variables accept a valid font size value.
+   * The font size for the extra small heading typography. Heading typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   headingXsFontSize?: string;
   /**
@@ -342,7 +342,7 @@ export declare type AppearanceVariables = {
 
   // Label Typography
   /**
-   * The font size for the medium label typography. Label typography variables accept a valid font size value.
+   * The font size for the medium label typography. Label typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   labelMdFontSize?: string;
   /**
@@ -354,7 +354,7 @@ export declare type AppearanceVariables = {
    */
   labelMdTextTransform?: string;
   /**
-   * The font size for the small label typography. Label typography variables accept a valid font size value.
+   * The font size for the small label typography. Label typography variables accept a valid font size value ranging from 1px to 200px, 0.1em to 12em, and 0.1rem to 12rem.
    */
   labelSmFontSize?: string;
   /**
@@ -446,4 +446,14 @@ export interface StripeConnectInstance {
 /**
  * Tagnames to be used with the `create` method of the Connect instance.
  */
-export type ConnectElementTagName = "account-onboarding";
+export type ConnectElementTagName =
+  | "payments"
+  | "payouts"
+  | "payment-details"
+  | "account-onboarding"
+  | "payment-method-settings"
+  | "account-management"
+  | "notification-banner"
+  | "instant-payouts"
+  | "issuing-card"
+  | "issuing-cards-list";