@stripe/connect-js 1.0.8 → 1.0.10

package/dist/connect.esm.js

@@ -1,29 +1,11 @@
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation. All rights reserved.
-Licensed under the Apache License, Version 2.0 (the "License"); you may not use
-this file except in compliance with the License. You may obtain a copy of the
-License at http://www.apache.org/licenses/LICENSE-2.0
-
-THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
-WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
-MERCHANTABLITY OR NON-INFRINGEMENT.
-
-See the Apache Version 2.0 License for specific language governing permissions
-and limitations under the License.
-***************************************************************************** */
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-var version = "1.0.8";
+var version = "1.0.10";
 
+const componentNameMapping = {
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding"
+};
 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/v0.1/connect.js";
 const findScript = () => {
@@ -89,7 +71,7 @@ const createWrapper = stripeConnect => {
     initialize: params => {
       var _a;
       const metaOptions = (_a = params.metaOptions) !== null && _a !== void 0 ? _a : {};
-      return stripeConnect.init(Object.assign(Object.assign({}, params), {
+      const stripeConnectInstance = stripeConnect.init(Object.assign(Object.assign({}, params), {
         metaOptions: Object.assign(Object.assign({}, metaOptions), {
           sdk: true,
           sdkOptions: {
@@ -97,10 +79,17 @@ const createWrapper = stripeConnect => {
           }
         })
       }));
-    },
-    logout: () => __awaiter(void 0, void 0, void 0, function* () {
-      yield stripeConnect.logout();
-    })
+      // We wrap create so we can map its different strings to supported components
+      const oldCreate = stripeConnectInstance.create.bind(stripeConnectInstance);
+      stripeConnectInstance.create = tagName => {
+        let htmlName = componentNameMapping[tagName];
+        if (!htmlName) {
+          htmlName = tagName;
+        }
+        return oldCreate(htmlName);
+      };
+      return stripeConnectInstance;
+    }
   };
   return wrapper;
 };

package/dist/connect.js

@@ -2,32 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation. All rights reserved.
-Licensed under the Apache License, Version 2.0 (the "License"); you may not use
-this file except in compliance with the License. You may obtain a copy of the
-License at http://www.apache.org/licenses/LICENSE-2.0
-
-THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
-WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
-MERCHANTABLITY OR NON-INFRINGEMENT.
-
-See the Apache Version 2.0 License for specific language governing permissions
-and limitations under the License.
-***************************************************************************** */
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-var version = "1.0.8";
+var version = "1.0.10";
 
+const componentNameMapping = {
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding"
+};
 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/v0.1/connect.js";
 const findScript = () => {
@@ -93,7 +75,7 @@ const createWrapper = stripeConnect => {
     initialize: params => {
       var _a;
       const metaOptions = (_a = params.metaOptions) !== null && _a !== void 0 ? _a : {};
-      return stripeConnect.init(Object.assign(Object.assign({}, params), {
+      const stripeConnectInstance = stripeConnect.init(Object.assign(Object.assign({}, params), {
         metaOptions: Object.assign(Object.assign({}, metaOptions), {
           sdk: true,
           sdkOptions: {
@@ -101,10 +83,17 @@ const createWrapper = stripeConnect => {
           }
         })
       }));
-    },
-    logout: () => __awaiter(void 0, void 0, void 0, function* () {
-      yield stripeConnect.logout();
-    })
+      // We wrap create so we can map its different strings to supported components
+      const oldCreate = stripeConnectInstance.create.bind(stripeConnectInstance);
+      stripeConnectInstance.create = tagName => {
+        let htmlName = componentNameMapping[tagName];
+        if (!htmlName) {
+          htmlName = tagName;
+        }
+        return oldCreate(htmlName);
+      };
+      return stripeConnectInstance;
+    }
   };
   return wrapper;
 };

package/dist/pure.esm.js

@@ -1,29 +1,11 @@
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation. All rights reserved.
-Licensed under the Apache License, Version 2.0 (the "License"); you may not use
-this file except in compliance with the License. You may obtain a copy of the
-License at http://www.apache.org/licenses/LICENSE-2.0
-
-THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
-WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
-MERCHANTABLITY OR NON-INFRINGEMENT.
-
-See the Apache Version 2.0 License for specific language governing permissions
-and limitations under the License.
-***************************************************************************** */
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-var version = "1.0.8";
+var version = "1.0.10";
 
+const componentNameMapping = {
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding"
+};
 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/v0.1/connect.js";
 const findScript = () => {
@@ -89,7 +71,7 @@ const createWrapper = stripeConnect => {
     initialize: params => {
       var _a;
       const metaOptions = (_a = params.metaOptions) !== null && _a !== void 0 ? _a : {};
-      return stripeConnect.init(Object.assign(Object.assign({}, params), {
+      const stripeConnectInstance = stripeConnect.init(Object.assign(Object.assign({}, params), {
         metaOptions: Object.assign(Object.assign({}, metaOptions), {
           sdk: true,
           sdkOptions: {
@@ -97,10 +79,17 @@ const createWrapper = stripeConnect => {
           }
         })
       }));
-    },
-    logout: () => __awaiter(void 0, void 0, void 0, function* () {
-      yield stripeConnect.logout();
-    })
+      // We wrap create so we can map its different strings to supported components
+      const oldCreate = stripeConnectInstance.create.bind(stripeConnectInstance);
+      stripeConnectInstance.create = tagName => {
+        let htmlName = componentNameMapping[tagName];
+        if (!htmlName) {
+          htmlName = tagName;
+        }
+        return oldCreate(htmlName);
+      };
+      return stripeConnectInstance;
+    }
   };
   return wrapper;
 };

package/dist/pure.js

@@ -2,32 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation. All rights reserved.
-Licensed under the Apache License, Version 2.0 (the "License"); you may not use
-this file except in compliance with the License. You may obtain a copy of the
-License at http://www.apache.org/licenses/LICENSE-2.0
-
-THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
-WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
-MERCHANTABLITY OR NON-INFRINGEMENT.
-
-See the Apache Version 2.0 License for specific language governing permissions
-and limitations under the License.
-***************************************************************************** */
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-var version = "1.0.8";
+var version = "1.0.10";
 
+const componentNameMapping = {
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding"
+};
 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/v0.1/connect.js";
 const findScript = () => {
@@ -93,7 +75,7 @@ const createWrapper = stripeConnect => {
     initialize: params => {
       var _a;
       const metaOptions = (_a = params.metaOptions) !== null && _a !== void 0 ? _a : {};
-      return stripeConnect.init(Object.assign(Object.assign({}, params), {
+      const stripeConnectInstance = stripeConnect.init(Object.assign(Object.assign({}, params), {
         metaOptions: Object.assign(Object.assign({}, metaOptions), {
           sdk: true,
           sdkOptions: {
@@ -101,10 +83,17 @@ const createWrapper = stripeConnect => {
           }
         })
       }));
-    },
-    logout: () => __awaiter(void 0, void 0, void 0, function* () {
-      yield stripeConnect.logout();
-    })
+      // We wrap create so we can map its different strings to supported components
+      const oldCreate = stripeConnectInstance.create.bind(stripeConnectInstance);
+      stripeConnectInstance.create = tagName => {
+        let htmlName = componentNameMapping[tagName];
+        if (!htmlName) {
+          htmlName = tagName;
+        }
+        return oldCreate(htmlName);
+      };
+      return stripeConnectInstance;
+    }
   };
   return wrapper;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stripe/connect-js",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "description": "Connect.js loading utility package",
   "main": "dist/connect.js",
   "module": "dist/connect.esm.js",

package/src/shared.ts

@@ -1,8 +1,28 @@
 import { version } from ".././package.json";
-import { StripeConnectWrapper, IStripeConnectInitParams } from "../types";
+import {
+  StripeConnectWrapper,
+  IStripeConnectInitParams,
+  ConnectElementTagName
+} from "../types";
 
 export type LoadConnect = () => Promise<StripeConnectWrapper>;
 
+type ConnectElementHTMLName =
+  | "stripe-connect-payments"
+  | "stripe-connect-payouts"
+  | "stripe-connect-payment-details"
+  | "stripe-connect-account-onboarding";
+
+const componentNameMapping: Record<
+  ConnectElementTagName,
+  ConnectElementHTMLName
+> = {
+  payments: "stripe-connect-payments",
+  payouts: "stripe-connect-payouts",
+  "payment-details": "stripe-connect-payment-details",
+  "account-onboarding": "stripe-connect-account-onboarding"
+};
+
 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/v0.1/connect.js";
@@ -92,7 +112,7 @@ const createWrapper = (stripeConnect: any) => {
   const wrapper: StripeConnectWrapper = {
     initialize: (params: IStripeConnectInitParams) => {
       const metaOptions = (params as any).metaOptions ?? {};
-      return stripeConnect.init({
+      const stripeConnectInstance = stripeConnect.init({
         ...params,
         metaOptions: {
           ...metaOptions,
@@ -102,9 +122,19 @@ const createWrapper = (stripeConnect: any) => {
           }
         }
       });
-    },
-    logout: async () => {
-      await stripeConnect.logout();
+
+      // We wrap create so we can map its different strings to supported components
+      const oldCreate = stripeConnectInstance.create.bind(
+        stripeConnectInstance
+      );
+      stripeConnectInstance.create = (tagName: ConnectElementTagName) => {
+        let htmlName = componentNameMapping[tagName];
+        if (!htmlName) {
+          htmlName = tagName as ConnectElementHTMLName;
+        }
+        return oldCreate(htmlName);
+      };
+      return stripeConnectInstance;
     }
   };
   return wrapper;

package/types/shared.d.ts

@@ -10,28 +10,28 @@ export declare type UIConfigOptions = {
 export declare type AppearanceOptions = {
   colorPrimary?: string;
   // Primary Button
-  colorPrimaryButtonBorder?: string;
-  colorPrimaryButtonBackground?: string;
-  colorPrimaryButtonText?: string;
+  buttonPrimaryColorBorder?: string;
+  buttonPrimaryColorBackground?: string;
+  buttonPrimaryColorText?: string;
   // Secondary Button
-  colorSecondaryButtonBorder?: string;
-  colorSecondaryButtonBackground?: string;
-  colorSecondaryButtonText?: string;
+  buttonSecondaryColorBorder?: string;
+  buttonSecondaryColorBackground?: string;
+  buttonSecondaryColorText?: string;
   // Link
-  colorPrimaryLinkText?: string;
-  colorSecondaryLinkText?: string;
+  actionPrimaryColorText?: string;
+  actionSecondaryColorText?: string;
   // Border
   colorBorder?: string;
   // Form
-  colorFormHighlightBorder?: string;
-  colorFormAccent?: string;
+  formHighlightColorBorder?: string;
+  formAccentColor?: string;
   // Text
   colorText?: string;
   colorSecondaryText?: string;
   // Background
   colorBackground?: string;
-  colorOffsetBackground?: string;
-  colorFormBackground?: string;
+  offsetBackgroundColor?: string;
+  formBackgroundColor?: string;
 
   // Feedback Colors
   colorDanger?: string;
@@ -58,48 +58,52 @@ export declare type AppearanceOptions = {
 
   // Border Sizing
   borderRadius?: string;
-  borderRadiusButton?: string;
-  borderRadiusForm?: string;
-  borderRadiusBadge?: string;
+  buttonBorderRadius?: string;
+  formBorderRadius?: string;
+  badgeBorderRadius?: string;
+  overlayBorderRadius?: string;
+
+  // Font Sizing
+  fontSizeBase?: string;
+
+  // Spacing
+  spacingUnit?: string;
 
   // Body Typography
-  bodyLargeFontSize?: string;
-  bodyLargeFontWeight?: string;
-  bodyMediumFontSize?: string;
-  bodyMediumFontWeight?: string;
-  bodySmallFontSize?: string;
-  bodySmallFontWeight?: string;
+  bodyLgFontSize?: string;
+  bodyLgFontWeight?: string;
+  bodyMdFontSize?: string;
+  bodyMdFontWeight?: string;
+  bodySmFontSize?: string;
+  bodySmFontWeight?: string;
 
   // Label Typography
-  labelLargeFontSize?: string;
-  labelLargeFontWeight?: string;
-  labelLargeTextTransform?: string;
-  labelMediumFontSize?: string;
-  labelMediumFontWeight?: string;
-  labelMediumTextTransform?: string;
-  labelSmallFontSize?: string;
-  labelSmallFontWeight?: string;
-  labelSmallTextTransform?: string;
+  labelLgFontSize?: string;
+  labelLgFontWeight?: string;
+  labelLgTextTransform?: string;
+  labelMdFontSize?: string;
+  labelMdFontWeight?: string;
+  labelMdTextTransform?: string;
+  labelSmFontSize?: string;
+  labelSmFontWeight?: string;
+  labelSmTextTransform?: string;
 
   // Heading Typography
-  headingXLargeFontSize?: string;
-  headingXLargeFontWeight?: string;
-  headingXLargeTextTransform?: string;
-  headingLargeFontSize?: string;
-  headingLargeFontWeight?: string;
-  headingLargeTextTransform?: string;
-  headingMediumFontSize?: string;
-  headingMediumFontWeight?: string;
-  headingMediumTextTransform?: string;
-  headingSmallFontSize?: string;
-  headingSmallFontWeight?: string;
-  headingSmallTextTransform?: string;
-  headingXSmallFontSize?: string;
-  headingXSmallFontWeight?: string;
-  headingXSmallTextTransform?: string;
-
-  // Spacing
-  spacingScale?: string;
+  headingXlFontSize?: string;
+  headingXlFontWeight?: string;
+  headingXlTextTransform?: string;
+  headingLgFontSize?: string;
+  headingLgFontWeight?: string;
+  headingLgTextTransform?: string;
+  headingMdFontSize?: string;
+  headingMdFontWeight?: string;
+  headingMdTextTransform?: string;
+  headingSmFontSize?: string;
+  headingSmFontWeight?: string;
+  headingSmTextTransform?: string;
+  headingXsFontSize?: string;
+  headingXsFontWeight?: string;
+  headingXsTextTransform?: string;
 };
 
 export type IStripeConnectUpdateParams = {
@@ -122,12 +126,6 @@ export interface StripeConnectWrapper {
    * @returns A Connect JS instance.
    */
   initialize: (params: IStripeConnectInitParams) => StripeConnectInstance;
-
-  /**
-   * Logs the user out of Connect JS sessions
-   * @returns A promise that resolves when the user is logged out.
-   */
-  logout: () => Promise<void>;
 }
 
 export interface StripeConnectInstance {
@@ -143,14 +141,19 @@ export interface StripeConnectInstance {
    * @options New parameters to update the Connect instance with.
    */
   update: (options: IStripeConnectUpdateParams) => void;
-}
 
-export type ConnectElementHTMLName =
-  | "stripe-connect-payments"
-  | "stripe-connect-payouts"
-  | "stripe-connect-payment-details";
+  /**
+   * Logs the user out of Connect JS sessions
+   * @returns A promise that resolves when the user is logged out.
+   */
+  logout: () => Promise<void>;
+}
 
-export type ConnectElementTagName = "payments" | "payouts" | "payment-details";
+export type ConnectElementTagName =
+  | "payments"
+  | "payouts"
+  | "payment-details"
+  | "account-onboarding";
 
 export declare const findScript: () => HTMLScriptElement | null;