@justifi/webcomponents 5.7.1 → 5.7.3-rc-01

package/dist/cjs/{bank-account-form_9.cjs.entry.js → bank-account-form_7.cjs.entry.js}

@@ -1,23 +1,24 @@
 'use strict';
 
-var index = require('./index-BYd8IvAa.js');
-var skeleton = require('./skeleton-aMh0RMHq.js');
-var configState = require('./config-state-D7p-XunE.js');
-var iframeInputStylesState = require('./iframe-input-styles-state-D9vhHzZQ.js');
+var index = require('./index-2GwnTbNA.js');
+var skeleton = require('./skeleton-ByLavxr1.js');
+var configState = require('./config-state-BTfJl-LU.js');
+var form = require('./form-CWW8IM-X.js');
+var schemaValidations = require('./schema-validations-C0BNwMBi.js');
 var parts = require('./parts-9jMf1erK.js');
-var index_esm = require('./index.esm-CVuJLXJZ.js');
-var schemaValidations = require('./schema-validations-Bhz09M42.js');
-var header3 = require('./header-3-B-bXHCpC.js');
+var header3 = require('./header-3-DxUQJ7TT.js');
 require('./event-types-YOY5TKUN.js');
 var utils = require('./utils-DAyWinG2.js');
 var stateOptions = require('./state-options-CIT9xdTz.js');
-var Document = require('./Document-CL5Zc72Q.js');
-var utils$1 = require('./utils-DmZ8Dia3.js');
-require('./index-B8ljHEN1.js');
+var Payment = require('./Payment-D5UynU2f.js');
+var paymentMethodOptionUtils = require('./payment-method-option-utils-imuSE7KV.js');
+require('./index-DEMVrrsF.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
-require('./business-form-options-BCj0efiD.js');
-require('./Business-DyiDiIuO.js');
+require('./business-form-options-CMII7nIK.js');
+require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
+require('./Document-rXGBUaOh.js');
+require('./utils-qOon0GWm.js');
 require('./Dispute-CruQTF6_.js');
 
 const BankAccountFormSkeleton = (props) => {
@@ -67,10 +68,10 @@ const BankAccountForm = class {
         return this.accountNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        return (index.h(index.Host, { key: 'b6cdf5a9320d92a5390daaa0a5218274f2dfc178' }, index.h(BankAccountFormSkeleton, { key: '286fcc38a26820d166ced0bc886143ed3d880da4', isReady: this.isReady }), index.h("div", { key: '041fcacff70d7cdfc0c8f41258bd9db18703e4c1', class: "container-fluid p-0", style: {
+        return (index.h(index.Host, { key: 'cdddf967e7142731f3b5aef31bfc3d004ce97733' }, index.h(BankAccountFormSkeleton, { key: '5eafa58bd31bbbd5ff5ca90a036fc696f7bd05fb', isReady: this.isReady }), index.h("div", { key: 'c8486e0337df9a61bd1979014f3de53eef22b071', class: "container-fluid p-0", style: {
                 opacity: this.isReady ? '1' : '0',
                 height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: '94dc0eb0d79b40ade96e1961611e3e7a8eef20ea', class: "row mb-3" }, index.h("iframe-input", { key: '41c82b772e7873a45409e35ed56dfea16c20c2ee', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/v2/accountNumber` })), index.h("div", { key: '1c95618a50e2d36a3a9a3a7b691ae0dfa6a09936', class: "row" }, index.h("iframe-input", { key: '28a4dde70c8f55b4f6bf6ce2d3beee6acbebbc0b', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${this.iframeOrigin}/v2/routingNumber` })))));
+            } }, index.h("div", { key: '3db2146e4d770c024efab6e777dbfa4ace26f23a', class: "row mb-3" }, index.h("iframe-input", { key: '5f9da4873119c1a1e771c7663b98e283766a37a1', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/v2/accountNumber` })), index.h("div", { key: '7ed20c940afd5ffc4348e4102a4cfd351d8e2198', class: "row" }, index.h("iframe-input", { key: '0667de245764f1d9181682beb674c4a376447a68', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${this.iframeOrigin}/v2/routingNumber` })))));
     }
 };
 
@@ -129,92 +130,15 @@ const CardForm = class {
         return this.cardNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        return (index.h(index.Host, { key: '3d28e96f020196a359a359507237b50dd9fed020' }, index.h(CardFormSkeleton, { key: 'ee07eb10acf142fcaab1398278e335df49f1abe9', isReady: this.isReady }), index.h("div", { key: 'bfce475f392cbb2bad3fd1c76f16c6e6a6718c1f', class: "container-fluid p-0", style: {
+        return (index.h(index.Host, { key: 'c43351c7ab1eb6bf413f162634f55007798bb076' }, index.h(CardFormSkeleton, { key: 'f0a29497de2270108868e892d666b552dea27a1e', isReady: this.isReady }), index.h("div", { key: '2734b111c1f2f2275435d2141445ac30482946be', class: "container-fluid p-0", style: {
                 opacity: this.isReady ? '1' : '0',
                 height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: 'e8517852800a9a165e61308f8d1cf875a87c021e', class: "mb-3" }, index.h("iframe-input", { key: '6efe224b7f4a2f63eec601d3e48c454d78c30300', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: 'cb6df3c5d9788a22c26255d1fe94331544730d24', class: "row" }, index.h("div", { key: '895943798b131da4215b24da822f7109e045e05b', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'ebea71cabe9f783734f924cfd0b03797cd203ce7', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: 'a65042ba66ca4a2a6f520147d316eb20f82369ea', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '8ef921245a3075ba36c310955bea671b71aca658', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: 'e37d637b078a36736ba698d0d96465e138fcf5ab', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'df20adb17524ea29f55e1c223267a9f0294b6062', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
-    }
-};
-
-const HiddenInput = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.isFocused = false;
-        this.errorText = '';
-    }
-    async componentDidLoad() {
-        const fontStyles = await this.getBaseFontStyles();
-        iframeInputStylesState.iframeInputStylesSet('fontStyles', fontStyles);
-        const focusedStyles = await this.getFocusedStyles();
-        iframeInputStylesState.iframeInputStylesSet('focused', focusedStyles);
-        const focusedAndInvalidStyles = await this.getFocusedAndInvalidStyles();
-        iframeInputStylesState.iframeInputStylesSet('focusedAndInvalid', focusedAndInvalidStyles);
-    }
-    async getBaseFontStyles() {
-        return new Promise((resolve, _reject) => {
-            setTimeout(() => {
-                const computedStyles = getComputedStyle(this.hiddenInput);
-                const styles = {
-                    fontFamily: computedStyles.fontFamily,
-                    fontSize: computedStyles.fontSize,
-                    fontWeight: computedStyles.fontWeight,
-                    lineHeight: computedStyles.lineHeight,
-                    margin: computedStyles.margin,
-                    padding: computedStyles.padding,
-                    color: computedStyles.color,
-                };
-                resolve(styles);
-            }, 500);
-        });
-    }
-    ;
-    async getFocusedStyles() {
-        return new Promise((resolve, _reject) => {
-            this.hiddenInput.focus();
-            setTimeout(() => {
-                this.hiddenInput.blur();
-                let computedStyles = getComputedStyle(this.hiddenInput);
-                resolve({
-                    boxShadow: computedStyles.boxShadow,
-                    border: computedStyles.border,
-                });
-            }, 500);
-        });
-    }
-    async getFocusedAndInvalidStyles() {
-        return new Promise((resolve, _reject) => {
-            this.hiddenInput.focus();
-            this.errorText = 'Error';
-            setTimeout(() => {
-                const computedStyles = getComputedStyle(this.hiddenInput);
-                const styles = {
-                    boxShadow: computedStyles.boxShadow,
-                    border: computedStyles.border,
-                };
-                this.hiddenInput.blur();
-                resolve(styles);
-            }, 500);
-        });
-    }
-    get part() {
-        if (this.isFocused && this.errorText) {
-            return parts.inputInvalidAndFocused;
-        }
-        if (this.errorText) {
-            return parts.inputInvalid;
-        }
-        if (this.isFocused) {
-            return parts.inputFocused;
-        }
-        return parts.input;
-    }
-    render() {
-        return (index.h(index.Host, { key: '32b302de9983db3ced26f1780bf116e63091b9ad' }, index.h("input", { key: 'c8fbe6dc11c8b743d307557aab107852403441ae', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
+            } }, index.h("div", { key: '036c359caaf8fc36fa6ba56bbcad5d01de1fe9c9', class: "mb-3" }, index.h("iframe-input", { key: '9baf7dc76ff18f8dee6e6cd08b93e1ba155d5cf2', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: 'cd54e4a30da50cfe5151b557fe1d92ebb483ad7e', class: "row" }, index.h("div", { key: '6b3e84079d606a6ffd5580deae0d6e4563d4c7ef', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '9ea2ad1c93ca90bbb4bc7a4c83a72e8f4cc9da61', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: '9478f77f64decfcdfd77f888d54cb37f46ad8ab7', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '43191d41eb743e0c509236ea316c1afb180b8fbb', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: '65599647fc750e6c62fb2866190ffa87689d8a5b', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'df367f3143aaff25ba9147698090ccbcea902cbf', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
     }
 };
 
 const billingFormSchema = (postalOnly) => {
-    const fullBillingForm = index_esm.create$3({
+    const fullBillingForm = form.create$3({
         name: schemaValidations.identityNameValidation.required('Enter full name'),
         address_line1: schemaValidations.lineOneValidation.required('Enter street address'),
         address_line2: schemaValidations.lineTwoValidation.nullable(),
@@ -222,7 +146,7 @@ const billingFormSchema = (postalOnly) => {
         address_state: schemaValidations.stateValidation.required('Select state'),
         address_postal_code: schemaValidations.postalValidation.required('Enter postal code')
     });
-    const postalForm = index_esm.create$3({
+    const postalForm = form.create$3({
         name: schemaValidations.identityNameValidation.nullable(),
         address_line1: schemaValidations.lineOneValidation.nullable(),
         address_line2: schemaValidations.lineTwoValidation.nullable(),
@@ -243,7 +167,7 @@ const BillingForm = class {
     }
     componentWillLoad() {
         const postalOnly = this.isPostalOnlyMode;
-        this.formController = new index_esm.FormController(billingFormSchema(postalOnly));
+        this.formController = new form.FormController(billingFormSchema(postalOnly));
     }
     componentDidLoad() {
         this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
@@ -264,13 +188,14 @@ const BillingForm = class {
         this.formController.setInitialValues(fields);
     }
     async validate() {
-        let isValid = await this.formController.validate();
-        return { isValid: isValid };
+        const isValid = await this.formController.validate();
+        const errors = this.formController.errors.getValue();
+        return { isValid, errors };
     }
     render() {
         const billingFormDefaultValue = this.formController.getInitialValues();
         const showHeader = !this.isPostalOnlyMode && !this.hideAllBillingFields;
-        return (index.h(index.Host, { key: '0df4ecdee8c32874325b83dd79586c7449ce6d93' }, index.h("div", { key: '6d5b45f278a7c69a76fe0895036ab37b810d0262', part: parts.billingForm, class: "mt-4", hidden: this.hideAllBillingFields }, showHeader && index.h(header3.Header3, { key: 'bc8f57f42134859e28dd523500ef874101198076', text: "Billing address", class: "fs-6 fw-bold lh-lg mb-4" }), index.h("form", { key: '908b8265b028caaa01314bc56bdbfe550b632b94' }, index.h("fieldset", { key: 'af3e34fca100b0e0c3f13ef3af3a88009859e277' }, this.legend && index.h("legend", { key: '15cfcc98681d4386afad33d68910f7732e88b9a9' }, this.legend), index.h("div", { key: 'de372fbe06a6da1f512170a6f79f27c96499d790', class: "row gy-3" }, index.h("div", { key: 'bb4aab9d17a7bed7cb09e4306158f5e0ff248b8f', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: 'f8e086504b6f3fac0e4bd2a0c0dee5e2f2c3328a', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: '9a5105e1183a61c55639c8153a65169fb65998c5', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '4802e1462b0b1f433c77f817b733611332b18711', name: 'address_line1', label: 'Street Address', defaultValue: billingFormDefaultValue.address_line1, errorText: this.errors.address_line1, inputHandler: this.inputHandler })), index.h("div", { key: '3edf7b2390c2fa7d0cadd75f9102a63f88a3685b', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: 'bec348d7030fa44e5a627ebc3f67ed9689a4a5b9', name: 'address_line2', label: "Apartment, Suite, etc. (optional)", defaultValue: billingFormDefaultValue.address_line2, errorText: this.errors.address_line2, inputHandler: this.inputHandler })), index.h("div", { key: '066d141b9529aae210fc2585bd2fd386e5b82120', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '602587fcca0666d7070e5cd0316ed1c541953337', name: 'address_city', label: "City", defaultValue: billingFormDefaultValue.address_city, errorText: this.errors.address_city, inputHandler: this.inputHandler })), index.h("div", { key: '125aeec26f292763abefe1c3a1a3070a2a8b4c7c', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-select", { key: 'fb8d46d217d452809ee199ef8640e93714a91e85', name: 'address_state', label: 'State', options: stateOptions.StateOptions, defaultValue: billingFormDefaultValue.address_state, errorText: this.errors.address_state, inputHandler: this.inputHandler })), index.h("div", { key: 'b622a69cb724ed15d2fe0fb2a9039635bc96a12e', class: "col-12", hidden: this.hideAllBillingFields }, index.h("form-control-text", { key: 'a094770db85d5a65524909b5c4ec532fca167a95', name: 'address_postal_code', label: "ZIP", defaultValue: billingFormDefaultValue.address_postal_code, errorText: this.errors.address_postal_code, inputHandler: this.inputHandler, maxLength: 5, keyDownHandler: utils.numberOnlyHandler }))))))));
+        return (index.h(index.Host, { key: 'ffffb2d8a4571222645d3c47eb1e2286b8597140' }, index.h("div", { key: '69b4f6c623cacbf32a30a9b9f23c3de427835c25', part: parts.billingForm, class: "mt-4", hidden: this.hideAllBillingFields }, showHeader && index.h(header3.Header3, { key: '96c0781a9b3dd7c5ef0b75ac8667664fee0bd95e', text: "Billing address", class: "fs-6 fw-bold lh-lg mb-4" }), index.h("form", { key: '97380a90146a9732594f1c356fab952089280f99' }, index.h("fieldset", { key: 'fd8bbea485c10633f1d8cca62b222a8abb0d022f' }, this.legend && index.h("legend", { key: '8febee534a2d055093309e8f8f06078b0b35f4e4' }, this.legend), index.h("div", { key: '16ac8abe899cdb964d83322fa74cb00f737ab338', class: "row gy-3" }, index.h("div", { key: '866f73c45b807aeeea4e6addf4de5f2d3a1a232d', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '1734b2aac3eb0508f9ae2e4bf41836fc5dd71cad', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: '569c0dc60b47d3e9077af401b720d7777c903bde', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '74406a7f4efde53a41141a218d246408c4807fc8', name: 'address_line1', label: 'Street Address', defaultValue: billingFormDefaultValue.address_line1, errorText: this.errors.address_line1, inputHandler: this.inputHandler })), index.h("div", { key: 'a7f3b7f137b0dd6a92cce6999ef65f13bcff4a31', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '8b6d28170c44af6b7701499a8a4626749d4cd36d', name: 'address_line2', label: "Apartment, Suite, etc. (optional)", defaultValue: billingFormDefaultValue.address_line2, errorText: this.errors.address_line2, inputHandler: this.inputHandler })), index.h("div", { key: '3a9031a0ddbea7e1020c420cdd6811ea9c86b9e4', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '730b395bb97c349a63f669669830cbce6ba86f83', name: 'address_city', label: "City", defaultValue: billingFormDefaultValue.address_city, errorText: this.errors.address_city, inputHandler: this.inputHandler })), index.h("div", { key: '7998420d30b1957a086303862f7200f20541ead2', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-select", { key: 'b94b623a26891646957f25e59cb03038a989eabf', name: 'address_state', label: 'State', options: stateOptions.StateOptions, defaultValue: billingFormDefaultValue.address_state, errorText: this.errors.address_state, inputHandler: this.inputHandler })), index.h("div", { key: '7b0d6eae7eb90f4b33b3e73f920b6ea25920f809', class: "col-12", hidden: this.hideAllBillingFields }, index.h("form-control-text", { key: '703e429c7999f5cc143c5648bd9fbdc4f5bb6ee9', name: 'address_postal_code', label: "ZIP", defaultValue: billingFormDefaultValue.address_postal_code, errorText: this.errors.address_postal_code, inputHandler: this.inputHandler, maxLength: 5, keyDownHandler: utils.numberOnlyHandler }))))))));
     }
 };
 
@@ -299,9 +224,18 @@ const NewPaymentMethod = class {
         if (!this.paymentMethodFormRef || !this.billingFormRef)
             return;
         try {
-            const isValid = await this.validate();
+            const { isValid, errors } = await this.validate();
             if (!isValid || !insuranceValidation.isValid) {
-                return { validationError: true };
+                // get propety value from first property in errors object
+                const message = `${Object.values(errors)[0] || 'Validation error'}`;
+                return {
+                    validationError: true,
+                    error: {
+                        code: 'validation_error',
+                        message,
+                        decline_code: undefined
+                    }
+                };
             }
             const tokenizeResponse = await this.tokenize();
             if (tokenizeResponse.error) {
@@ -322,7 +256,9 @@ const NewPaymentMethod = class {
     async validate() {
         const billingFormValidation = await this.billingFormRef.validate();
         const paymentMethodFormValidation = await this.paymentMethodFormRef.validate();
-        return billingFormValidation.isValid && paymentMethodFormValidation.isValid;
+        const isValid = billingFormValidation.isValid && paymentMethodFormValidation.isValid;
+        const errors = Object.assign(Object.assign({}, billingFormValidation.errors), paymentMethodFormValidation.errors);
+        return { isValid, errors };
     }
     async tokenize() {
         try {
@@ -352,30 +288,10 @@ const NewPaymentMethod = class {
     }
     render() {
         var _a, _b;
-        return (index.h(index.Host, { key: 'b80791923e2276322ebe0ce3b25b2073beac188d', class: "payment-method" }, index.h("div", { key: '47dc555bc135d4562958cf371ca3c8b80ee7236d', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick, hidden: this.hiddenRadioInput }, index.h("form-control-radio", { key: 'e485347f39fa4b7d46d64e231931d6bdf541687c', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: PaymentMethodTypeLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id] })), this.isSelected ? this.showNewPaymentMethodForm() : null));
+        return (index.h(index.Host, { key: '137378e62a729bd2287b1bdf89cb85c702cd4e12', class: "payment-method" }, index.h("div", { key: 'dabfcf5c56169708a8968a16aeaafefb43ca3ab8', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick, hidden: this.hiddenRadioInput }, index.h("form-control-radio", { key: 'd098e2b8f6e1230fc16fdc2cbfd616559bcf2b89', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: PaymentMethodTypeLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id] })), this.isSelected ? this.showNewPaymentMethodForm() : null));
     }
 };
 
-class PaymentMethodOption {
-    constructor(paymentMethod) {
-        this.id = paymentMethod.id;
-        this.brand = paymentMethod.brand;
-        this.acct_last_four = paymentMethod.acct_last_four;
-        this.type = utils$1.snakeToCamel(paymentMethod.type);
-    }
-}
-var CardBrandLabels;
-(function (CardBrandLabels) {
-    CardBrandLabels["american_express"] = "American Express";
-    CardBrandLabels["diners_club"] = "Diners Club";
-    CardBrandLabels["discover"] = "Discover";
-    CardBrandLabels["jcb"] = "JCB";
-    CardBrandLabels["mastercard"] = "Mastercard";
-    CardBrandLabels["china_unionpay"] = "UnionPay";
-    CardBrandLabels["visa"] = "Visa";
-    CardBrandLabels["unknown"] = "Unknown";
-})(CardBrandLabels || (CardBrandLabels = {}));
-
 const PaymentMethodOptions = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
@@ -392,25 +308,22 @@ const PaymentMethodOptions = class {
         this.paymentMethodsChanged();
     }
     paymentMethodsChanged() {
-        var _a, _b;
+        var _a;
         this.paymentMethodOptions = this.savedPaymentMethods
-            .map((paymentMethod) => new PaymentMethodOption(paymentMethod))
+            .map((paymentMethod) => new paymentMethodOptionUtils.PaymentMethodOption(paymentMethod))
             .filter((paymentMethod) => {
             // Don't saved card or bank account if they are disabled
-            return ((this.showCard || paymentMethod.type !== Document.PaymentMethodTypes.card) &&
-                (this.showAch || paymentMethod.type !== Document.PaymentMethodTypes.bankAccount));
+            return ((this.showCard || paymentMethod.type !== Payment.PaymentMethodTypes.card) &&
+                (this.showAch || paymentMethod.type !== Payment.PaymentMethodTypes.bankAccount));
         });
-        if (this.showBnpl && ((_a = this.bnpl) === null || _a === void 0 ? void 0 : _a.provider) === 'sezzle' && !this.insuranceToggled) {
-            this.paymentMethodOptions.push(new PaymentMethodOption({ id: Document.PaymentMethodTypes.sezzle }));
-        }
         if (this.showCard) {
-            this.paymentMethodOptions.push(new PaymentMethodOption({ id: Document.PaymentMethodTypes.card }));
+            this.paymentMethodOptions.push(new paymentMethodOptionUtils.PaymentMethodOption({ id: Payment.PaymentMethodTypes.card }));
         }
         if (this.showAch) {
-            this.paymentMethodOptions.push(new PaymentMethodOption({ id: Document.PaymentMethodTypes.bankAccount }));
+            this.paymentMethodOptions.push(new paymentMethodOptionUtils.PaymentMethodOption({ id: Payment.PaymentMethodTypes.bankAccount }));
         }
         if (!this.selectedPaymentMethodId) {
-            this.selectedPaymentMethodId = (_b = this.paymentMethodOptions[0]) === null || _b === void 0 ? void 0 : _b.id;
+            this.selectedPaymentMethodId = (_a = this.paymentMethodOptions[0]) === null || _a === void 0 ? void 0 : _a.id;
         }
     }
     paymentMethodOptionSelected(event) {
@@ -422,16 +335,14 @@ const PaymentMethodOptions = class {
     }
     async validate() {
         const newPaymentMethodElement = this.selectedPaymentMethodOptionRef;
-        const isValid = await newPaymentMethodElement.validate();
-        return { isValid: isValid };
+        return newPaymentMethodElement.validate();
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: '506450161ed363330132c2bfa99a6a7729e94778' }, (_a = this.paymentMethodOptions) === null || _a === void 0 ? void 0 : _a.map((paymentMethodOption) => {
-            const newCard = paymentMethodOption.id === Document.PaymentMethodTypes.card;
-            const newBankAccount = paymentMethodOption.id === Document.PaymentMethodTypes.bankAccount;
+        return (index.h(index.Host, { key: '2d3dc8bc98cea3efbcf342a31b6883f30099b031' }, (_a = this.paymentMethodOptions) === null || _a === void 0 ? void 0 : _a.map((paymentMethodOption) => {
+            const newCard = paymentMethodOption.id === Payment.PaymentMethodTypes.card;
+            const newBankAccount = paymentMethodOption.id === Payment.PaymentMethodTypes.bankAccount;
             const isSelected = this.selectedPaymentMethodId === paymentMethodOption.id;
-            const sezzle = paymentMethodOption.id === Document.PaymentMethodTypes.sezzle;
             if (newCard || newBankAccount) {
                 return (index.h("justifi-new-payment-method", { paymentMethodOption: paymentMethodOption, authToken: this.authToken, "account-id": this.accountId, "is-selected": isSelected, "show-card": this.showCard, "show-ach": this.showAch, paymentMethodGroupId: this.paymentMethodGroupId, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, ref: (el) => {
                         if (isSelected) {
@@ -439,13 +350,6 @@ const PaymentMethodOptions = class {
                         }
                     } }));
             }
-            else if (sezzle) {
-                return (index.h("justifi-sezzle-payment-method", { paymentMethodOption: paymentMethodOption, "is-selected": isSelected, paymentAmount: this.paymentAmount, bnpl: this.bnpl, ref: (el) => {
-                        if (isSelected) {
-                            this.selectedPaymentMethodOptionRef = el;
-                        }
-                    } }));
-            }
             else if (this.showSavedPaymentMethods) {
                 return (index.h("justifi-saved-payment-method", { paymentMethodOption: paymentMethodOption, "is-selected": isSelected, ref: (el) => {
                         if (isSelected) {
@@ -494,77 +398,14 @@ const SavedPaymentMethod = class {
     ;
     render() {
         var _a, _b, _c;
-        return (index.h(index.Host, { key: '78487e52f549547f4c89f48a238a8916d77d4f1c', class: "payment-method" }, index.h("div", { key: 'd437a5f9e79356b1177703da2b5d7f4ca98072ce', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick }, index.h("form-control-radio", { key: '0dd03b9ebae98c441c63717aba310d77e587b1c8', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: `${CardBrandLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.brand] || ''} *${(_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.acct_last_four}` }))));
-    }
-};
-
-const sezzleLogo = (index.h("img", { class: "sezzle-smart-button-logo-img", src: "https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg", alt: "Sezzle", style: {
-        display: 'inline',
-        width: '80px',
-        marginLeft: '5px',
-        marginTop: '-5px',
-    } }));
-const SezzlePaymentMethod = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected");
-        this.onPaymentMethodOptionClick = (e) => {
-            e.preventDefault();
-            this.paymentMethodOptionSelected.emit(this.paymentMethodOption);
-        };
-        this.initializeSezzleCheckout = () => {
-            let resolveSezzlePromise;
-            this.sezzlePromise = new Promise((resolve) => { resolveSezzlePromise = resolve; });
-            const bnpl = this.bnpl;
-            const amount = +this.paymentAmount; // convert to number
-            const Checkout = window.Checkout;
-            const checkout = new Checkout({
-                mode: 'popup',
-                publicKey: bnpl.provider_client_id,
-                apiMode: bnpl.provider_mode,
-                apiVersion: bnpl.provider_api_version,
-            });
-            checkout.sezzleButtonElement = this.sezzleButtonRef;
-            checkout.init({
-                onClick: function (event) {
-                    event.preventDefault();
-                    checkout.startCheckout({
-                        checkout_url: bnpl.provider_checkout_url
-                    });
-                },
-                onComplete: (event) => resolveSezzlePromise({ bnpl: event.data }),
-                onCancel: (event) => resolveSezzlePromise({ bnpl: event.data }),
-                onFailure: (event) => resolveSezzlePromise({ bnpl: event.data }),
-            });
-            this.sezzleCheckout = checkout;
-            this.installmentPlan = this.sezzleCheckout.getInstallmentPlan(amount);
-        };
-    }
-    componentDidRender() {
-        this.scriptRef.onload = () => {
-            this.sezzleButtonRef = document.createElement('button');
-            this.initializeSezzleCheckout();
-        };
-    }
-    async resolvePaymentMethod(insuranceValidation) {
-        if (!insuranceValidation.isValid) {
-            return { validationError: true };
-        }
-        this.sezzleButtonRef.click();
-        return this.sezzlePromise;
-    }
-    render() {
-        var _a, _b, _c;
-        return (index.h(index.Host, { key: '4ae50e7bbb15d0049d069edacd0d95ba7c13dbe5', class: "payment-method" }, index.h("script", { key: '42a0590d89626ba7a93852e421eb121626b48375', src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), index.h("div", { key: '31a2a72650486c258267c6d4de3723f7afa5b063', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick }, index.h("form-control-radio", { key: 'eac1adbcd82fcb4f9c440c53c40ce34af6092991', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: index.h("div", null, index.h("div", null, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (index.h("small", null, index.h("span", null, (_b = this.installmentPlan) === null || _b === void 0 ? void 0 : _b.installments.length), "\u00A0", index.h("span", null, this.installmentPlan.schedule, " payments of"), "\u00A0", index.h("span", { class: "fw-bold" }, utils$1.formatCurrency((_c = this.installmentPlan) === null || _c === void 0 ? void 0 : _c.installments[0].amountInCents))))) }))));
+        return (index.h(index.Host, { key: '78487e52f549547f4c89f48a238a8916d77d4f1c', class: "payment-method" }, index.h("div", { key: 'd437a5f9e79356b1177703da2b5d7f4ca98072ce', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick }, index.h("form-control-radio", { key: '0dd03b9ebae98c441c63717aba310d77e587b1c8', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: `${paymentMethodOptionUtils.CardBrandLabels[(_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.brand] || ''} *${(_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.acct_last_four}` }))));
     }
 };
 
 exports.bank_account_form = BankAccountForm;
 exports.card_form = CardForm;
-exports.hidden_input = HiddenInput;
 exports.justifi_billing_form = BillingForm;
 exports.justifi_new_payment_method = NewPaymentMethod;
 exports.justifi_payment_method_options = PaymentMethodOptions;
 exports.justifi_save_new_payment_method = SaveNewPaymentMethod;
 exports.justifi_saved_payment_method = SavedPaymentMethod;
-exports.justifi_sezzle_payment_method = SezzlePaymentMethod;

package/dist/cjs/billing-form-schema-oZ4GROWP.js

@@ -0,0 +1,26 @@
+'use strict';
+
+var form = require('./form-CWW8IM-X.js');
+var schemaValidations = require('./schema-validations-C0BNwMBi.js');
+
+const billingFormSchema = (postalOnly) => {
+    const fullBillingForm = form.create$3({
+        name: schemaValidations.identityNameValidation.required('Enter full name'),
+        address_line1: schemaValidations.lineOneValidation.required('Enter street address'),
+        address_line2: schemaValidations.lineTwoValidation.nullable(),
+        address_city: schemaValidations.cityValidation.required('Enter city'),
+        address_state: schemaValidations.stateValidation.required('Select state'),
+        address_postal_code: schemaValidations.postalValidation.required('Enter postal code'),
+    });
+    const postalForm = form.create$3({
+        name: schemaValidations.identityNameValidation.nullable(),
+        address_line1: schemaValidations.lineOneValidation.nullable(),
+        address_line2: schemaValidations.lineTwoValidation.nullable(),
+        address_city: schemaValidations.cityValidation.nullable(),
+        address_state: schemaValidations.stateValidation.nullable(),
+        address_postal_code: schemaValidations.postalValidation.required('Enter postal code'),
+    });
+    return postalOnly ? postalForm : fullBillingForm;
+};
+
+exports.billingFormSchema = billingFormSchema;

package/dist/cjs/{business-additional-questions-schema-DR8vt11M.js → business-additional-questions-schema-CHOaeZot.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var index_esm = require('./index.esm-CVuJLXJZ.js');
-var schemaValidations = require('./schema-validations-Bhz09M42.js');
+var form = require('./form-CWW8IM-X.js');
+var schemaValidations = require('./schema-validations-C0BNwMBi.js');
 
 const businessCoreInfoSchema = (allowOptionalFields) => {
-    const schema = index_esm.create$3({
+    const schema = form.create$3({
         legal_name: schemaValidations.businessNameValidation.required('Enter legal name'),
         website_url: schemaValidations.websiteUrlValidation.required('Enter business website url'),
         email: schemaValidations.emailValidation.required('Enter business email'),
@@ -15,7 +15,7 @@ const businessCoreInfoSchema = (allowOptionalFields) => {
         tax_id: schemaValidations.taxIdValidation.required('Enter valid tax ID (SSN or EIN) without dashes'),
         date_of_incorporation: schemaValidations.dateOfIncorporationValidation.required('Enter date of incorporation'),
     });
-    const easySchema = index_esm.create$3({
+    const easySchema = form.create$3({
         legal_name: schemaValidations.businessNameValidation.required('Enter legal name'),
         website_url: schemaValidations.websiteUrlValidation.nullable(),
         email: schemaValidations.emailValidation.nullable(),
@@ -30,7 +30,7 @@ const businessCoreInfoSchema = (allowOptionalFields) => {
 };
 
 const additionalQuestionsSchema = (allowOptionalFields) => {
-    const schema = index_esm.create$3({
+    const schema = form.create$3({
         business_revenue: schemaValidations.revenueValidation.required('Enter business revenue'),
         business_payment_volume: schemaValidations.paymentVolumeValidation.required('Enter business payment volume'),
         business_when_service_received: schemaValidations.whenServiceReceivedValidation.required('Select when service is received'),
@@ -39,7 +39,7 @@ const additionalQuestionsSchema = (allowOptionalFields) => {
         business_seasonal: schemaValidations.seasonalBusinessValidation.required('Select business seasonal'),
         business_other_payment_details: schemaValidations.otherPaymentDetailsValidation.nullable(),
     });
-    const easySchema = index_esm.create$3({
+    const easySchema = form.create$3({
         business_revenue: schemaValidations.revenueValidation.nullable(),
         business_payment_volume: schemaValidations.paymentVolumeValidation.nullable(),
         business_when_service_received: schemaValidations.whenServiceReceivedValidation.nullable(),

package/dist/cjs/business-details-core.cjs.entry.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var index = require('./index-BYd8IvAa.js');
-var utils = require('./utils-5lco6NzU.js');
-var styledHost = require('./styled-host-udkBJV5h.js');
+var index = require('./index-2GwnTbNA.js');
+var utils = require('./utils-bn0fXuc-.js');
+var styledHost = require('./styled-host-IMxk64cc.js');
 require('./event-types-YOY5TKUN.js');
-var skeleton = require('./skeleton-aMh0RMHq.js');
+var skeleton = require('./skeleton-ByLavxr1.js');
 require('./parts-9jMf1erK.js');
 
 const BusinessDetailsLoading = () => {
@@ -38,7 +38,6 @@ const BusinessDetailsCore = class {
         index.registerInstance(this, hostRef);
         this.errorEvent = index.createEvent(this, "error-event");
         this.renderState = RENDER_STATES.LOADING;
-        this.errorMessage = 'An error ocurred.';
     }
     async componentWillLoad() {
         if (this.getBusiness) {
@@ -70,7 +69,7 @@ const BusinessDetailsCore = class {
         if (this.renderState === RENDER_STATES.ERROR) {
             return index.h(styledHost.StyledHost, null, utils.ErrorState(this.errorMessage));
         }
-        return (index.h(styledHost.StyledHost, null, index.h("generic-info-details", { business: this.business }), index.h("legal-address-details", { legalAddress: this.business.legal_address }), index.h("representative-details", { representative: this.business.representative }), index.h("owner-details", { owners: this.business.owners }), index.h("additional-questions-details", { additionalQuestions: this.business.additional_questions })));
+        return (index.h(styledHost.StyledHost, null, index.h("justifi-details", { "error-message": this.errorMessage }, index.h("div", { slot: 'detail-sections' }, index.h("core-info-details", { business: this.business }), index.h("legal-address-details", { legalAddress: this.business.legal_address }), index.h("representative-details", { representative: this.business.representative }), index.h("owner-details", { owners: this.business.owners }), index.h("additional-questions-details", { additionalQuestions: this.business.additional_questions })))));
     }
 };
 

package/dist/cjs/{business-form-options-BCj0efiD.js → business-form-options-CMII7nIK.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var Business = require('./Business-DyiDiIuO.js');
+var Business = require('./Business-DCRzZf0w.js');
 
 const businessClassificationOptions = [
     {

package/dist/cjs/{business-identity-schema-BYaCsboD.js → business-identity-schema-DmpEndsx.js}

@@ -1,46 +1,46 @@
 'use strict';
 
-var index_esm = require('./index.esm-CVuJLXJZ.js');
-var schemaValidations = require('./schema-validations-Bhz09M42.js');
+var form = require('./form-CWW8IM-X.js');
+var schemaValidations = require('./schema-validations-C0BNwMBi.js');
 
 const addressSchema = (allowOptionalFields) => {
-    const schema = index_esm.create$3({
+    const schema = form.create$3({
         line1: schemaValidations.lineOneValidation.required('Enter street address'),
         line2: schemaValidations.lineTwoValidation.nullable(),
         city: schemaValidations.cityValidation.required('Enter city'),
         state: schemaValidations.stateValidation.required('Select state'),
         postal_code: schemaValidations.postalValidation.required('Enter postal code'),
-        country: index_esm.create$6().required('Select country')
+        country: form.create$6().required('Select country')
     });
-    const easySchema = index_esm.create$3({
+    const easySchema = form.create$3({
         line1: schemaValidations.lineOneValidation.nullable(),
         line2: schemaValidations.lineTwoValidation.nullable(),
         city: schemaValidations.cityValidation.nullable(),
         state: schemaValidations.stateValidation.nullable(),
         postal_code: schemaValidations.postalValidation.nullable(),
-        country: index_esm.create$6().required('Select country')
+        country: form.create$6().required('Select country')
     });
     return allowOptionalFields ? easySchema : schema;
 };
 
 const identitySchema = (role, allowOptionalFields) => {
-    const schema = index_esm.create$3({
+    const schema = form.create$3({
         name: schemaValidations.identityNameValidation.required(`Enter ${role} name`),
         title: schemaValidations.identityTitleValidation.required(`Enter ${role} title`),
         email: schemaValidations.emailValidation.required(`Enter ${role} email`),
         phone: schemaValidations.phoneValidation.required('Enter phone number'),
         dob_full: schemaValidations.dobValidation(role).required('Enter date of birth'),
-        ssn_last4: index_esm.create$6().nullable(),
+        ssn_last4: form.create$6().nullable(),
         identification_number: schemaValidations.ssnValidation,
         address: addressSchema(allowOptionalFields),
     });
-    const easySchema = index_esm.create$3({
+    const easySchema = form.create$3({
         name: schemaValidations.identityNameValidation.required(`Enter ${role} name`),
         title: schemaValidations.identityTitleValidation.nullable(),
         email: schemaValidations.emailValidation.nullable(),
         phone: schemaValidations.phoneValidation.nullable(),
         dob_full: schemaValidations.dobValidation(role).nullable(),
-        ssn_last4: index_esm.create$6().nullable(),
+        ssn_last4: form.create$6().nullable(),
         identification_number: schemaValidations.ssnValidation.nullable(),
         address: addressSchema(allowOptionalFields),
     });

package/dist/cjs/{business.service-C2rg_zSw.js → business.service-ev-3rHag.js}

@@ -1,12 +1,13 @@
 'use strict';
 
-var Api = require('./Api-C8nf_gS9.js');
-require('./ComponentError-C4MdBBMe.js');
-require('./Checkout-RAGvjVPj.js');
+var Api = require('./Api-BTdkb3Zh.js');
+require('./ComponentError-CEv9ltwy.js');
+require('./Checkout-BsYZoJ0a.js');
 require('./Pagination-Dediz133.js');
-require('./Document-CL5Zc72Q.js');
-require('./Refund-CYxocU06.js');
-require('./Business-DyiDiIuO.js');
+require('./Payment-D5UynU2f.js');
+require('./Refund-BDFOEJv_.js');
+require('./Document-rXGBUaOh.js');
+require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
 
 const api = Api.Api();

package/dist/cjs/{button-BPFSRx4d.js → button-CCZd8WSY.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BYd8IvAa.js');
+var index = require('./index-2GwnTbNA.js');
 var parts = require('./parts-9jMf1erK.js');
 
 const ButtonSpinner = () => (index.h("div", { class: "spinner-border spinner-border-sm", role: "status", part: "button-spinner" },