@justifi/webcomponents 5.7.4-rc-01 → 5.7.5

package/dist/cjs/{Checkout-BsYZoJ0a.js → Checkout-TZnRz3-3.js}

@@ -53,7 +53,7 @@ class Checkout {
             return ICheckoutPaymentMode.unknown;
         }
         const sortedCompletions = this.completions.sort((a, b) => {
-            return (new Date(b.updated_at).getTime() - new Date(a.updated_at).getTime());
+            return new Date(b.updated_at).getTime() - new Date(a.updated_at).getTime();
         });
         const lastCompletion = sortedCompletions[0];
         if (lastCompletion.payment_mode) {
@@ -67,9 +67,11 @@ class Checkout {
         }
         return paymentMode;
     }
+    ;
     formattedPaymentAmount(amount) {
         return utils.formatCurrency(amount, this.payment_currency);
     }
+    ;
 }
 var ICheckoutPaymentMode;
 (function (ICheckoutPaymentMode) {

package/dist/cjs/{ComponentError-CEv9ltwy.js → ComponentError-C4MdBBMe.js}

@@ -8,12 +8,10 @@ exports.ComponentErrorCodes = void 0;
     ComponentErrorCodes["POST_ERROR"] = "post-error";
     ComponentErrorCodes["UNKNOWN_ERROR"] = "unknown-error";
     ComponentErrorCodes["TOKENIZE_ERROR"] = "tokenize-error";
-    ComponentErrorCodes["COMPLETE_CHECKOUT_ERROR"] = "complete-checkout-error";
     ComponentErrorCodes["NOT_AUTHENTICATED"] = "not-authenticated";
     ComponentErrorCodes["INVALID_PARAMETER"] = "invalid-parameter";
     ComponentErrorCodes["PROVISIONING_REQUESTED"] = "provisioning-already-requested";
     ComponentErrorCodes["INVALID_REFUND_AMOUNT"] = "invalid-refund-amount";
-    ComponentErrorCodes["VALIDATION_ERROR"] = "validation-error";
 })(exports.ComponentErrorCodes || (exports.ComponentErrorCodes = {}));
 exports.ComponentErrorSeverity = void 0;
 (function (ComponentErrorSeverity) {

package/dist/cjs/{Refund-BFE-2OxN.js → Refund-DN-yzFgy.js}

@@ -288,8 +288,8 @@ class EntityDocumentStorage {
 }
 class EntityDocument {
     constructor(fileData, business_id) {
+        this.fileData = null;
         this.file = fileData.file;
-        this.fileString = this.getFileString();
         this.document_type = fileData.document_type;
         this.presigned_url = null;
         this.record_data = {
@@ -299,13 +299,22 @@ class EntityDocument {
             file_type: this.file.type,
         };
     }
-    getFileString() {
-        let reader = new FileReader();
-        reader.onload = (e) => {
-            this.fileString = e.target.result;
-        };
-        reader.readAsDataURL(this.file);
-        return this.fileString;
+    async getFileData() {
+        if (this.fileData) {
+            return this.fileData;
+        }
+        const fileDataPromise = new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            reader.onload = (e) => {
+                this.fileData = e.target.result;
+                resolve(this.fileData);
+            };
+            reader.onerror = () => {
+                reject(new Error('Error reading file'));
+            };
+            reader.readAsArrayBuffer(this.file);
+        });
+        return await fileDataPromise;
     }
     setPresignedUrl(url) {
         this.presigned_url = url;

package/dist/cjs/bank-account-document-form-inputs_4.cjs.entry.js

@@ -3,11 +3,11 @@
 var index = require('./index-D5bL1DOi.js');
 require('./config-state-Dz9bnWHg.js');
 var utils$1 = require('./utils-qOon0GWm.js');
-require('./ComponentError-CEv9ltwy.js');
-require('./Checkout-BsYZoJ0a.js');
+require('./ComponentError-C4MdBBMe.js');
+require('./Checkout-TZnRz3-3.js');
 require('./Pagination-Dediz133.js');
 require('./Payment-D5UynU2f.js');
-var Refund = require('./Refund-BFE-2OxN.js');
+var Refund = require('./Refund-DN-yzFgy.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
 var businessFormOptions = require('./business-form-options-CMII7nIK.js');
@@ -100,10 +100,10 @@ const FileInput = class {
         return part;
     }
     render() {
-        return (index.h(index.Host, { key: '329fd1cedefedb6bd17acfbb30adfefecefb19ca' }, index.h("div", { key: 'abdd1db599e47f367bc56008386026361ee8aa3b', class: "form-group d-flex flex-column" }, index.h("div", { key: '9306d438e038947b68cc3b8b2faa2ab412fab203', class: "d-flex align-items-start gap-2" }, index.h("label", { key: '164c4e92e01d5219013623d0edaa3c96a814ff6c', part: parts.label, class: "form-label", htmlFor: this.name }, this.label), index.h("form-control-tooltip", { key: '2d7fe58881cfa259f3d2ba8edbc6f07411ea26c6', helpText: this.helpText })), index.h("input", { key: '1964930b98527640df99e1e22b6322e0627bc668', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (index.h(index.Host, { key: 'c34cbf8874c33d945d81a93646372ac9dc687362' }, index.h("div", { key: 'cacf5f210a0adb6f408ac05efe4279d9eb1ae3b8', class: "form-group d-flex flex-column" }, index.h("div", { key: '936cb5268fa2c63f9931895f7a0b46ed5b4776ec', class: "d-flex align-items-start gap-2" }, index.h("label", { key: '6dc1dd3be36337cc3c4bb72a4e4d42c6e7c2a239', part: parts.label, class: "form-label", htmlFor: this.name }, this.label), index.h("form-control-tooltip", { key: '4c4a2c965882e7e96d36b16e6448fa4efd003950', helpText: this.helpText })), index.h("input", { key: '469cf033fae879306ecbfdcdb9e6d74fdb4b4265', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            } }), index.h(formControlErrorText.FormControlErrorText, { key: '02ffabfccf4e06936e0ed44fe2ad715f7f44fe3f', errorText: this.errorText, name: this.name }))));
+            } }), index.h(formControlErrorText.FormControlErrorText, { key: '7359b6f39ac038230ce1d2d60454a4d4e69c6bb9', errorText: this.errorText, name: this.name }))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -3,21 +3,21 @@
 var index = require('./index-D5bL1DOi.js');
 var skeleton = require('./skeleton-CbZBGO47.js');
 var configState = require('./config-state-Dz9bnWHg.js');
-var form = require('./form-CWW8IM-X.js');
-var schemaValidations = require('./schema-validations-CllkToCZ.js');
+var iframeInputStylesState = require('./iframe-input-styles-state-DX5gGQQF.js');
 var parts = require('./parts-9jMf1erK.js');
+var index_esm = require('./index.esm-CVuJLXJZ.js');
+var schemaValidations = require('./schema-validations-BSeMee-o.js');
 var header3 = require('./header-3-BnKbOjvz.js');
 require('./event-types-YOY5TKUN.js');
 var utils = require('./utils-DAyWinG2.js');
 var stateOptions = require('./state-options-CIT9xdTz.js');
 var Payment = require('./Payment-D5UynU2f.js');
-var paymentMethodOptionUtils = require('./payment-method-option-utils-imuSE7KV.js');
+var utils$1 = require('./utils-qOon0GWm.js');
 require('./index-BCtVWU61.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
 require('./business-form-options-CMII7nIK.js');
 require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
-require('./utils-qOon0GWm.js');
 require('./Dispute-CruQTF6_.js');
 
 const BankAccountFormSkeleton = (props) => {
@@ -67,10 +67,10 @@ const BankAccountForm = class {
         return this.accountNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        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: {
+        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: {
                 opacity: this.isReady ? '1' : '0',
                 height: this.isReady ? 'auto' : '0',
-            } }, 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` })))));
+            } }, 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` })))));
     }
 };
 
@@ -129,15 +129,92 @@ const CardForm = class {
         return this.cardNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        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: {
+        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: {
                 opacity: this.isReady ? '1' : '0',
                 height: this.isReady ? 'auto' : '0',
-            } }, 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: '080769719aa9b0d6abc9b18c46247eecd6428833', class: "d-flex align-items-start" }, index.h("div", { key: 'b3a825ed849ec0032d4a9018537f8ffab4b93ca3', class: "flex-fill me-3" }, index.h("iframe-input", { key: '5f60eb2d3b3e1303e1a0f6a3f0cd60270bb2d0b8', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Exp. Month", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: 'cfd000502f10593b59608e13f5de7911c546d030', class: "flex-fill me-3" }, index.h("iframe-input", { key: 'ab2a45264fe5890c171d03000f30720eafe354b5', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "Exp. Year", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: '637516bfd8030e56c9b1e97edfd3a635edb95f20', class: "flex-fill" }, index.h("iframe-input", { key: 'e407cc2470841fe12b1bdb84bbc8ecfb0165c72d', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
+            } }, 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: 'c14b9deb1a9d677a6ee8952cbc946fea3c95f21a', class: "d-flex align-items-start" }, index.h("div", { key: 'd0ced17b3f1d231514f81d9fe21f75cb87db145c', class: "flex-fill me-3" }, index.h("iframe-input", { key: '5b187bbe0826dde34cd49ecce1e386ab5373da93', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Exp. Month", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: 'aace0455d0a522fff3141f17af7267e9ca8dc252', class: "flex-fill me-3" }, index.h("iframe-input", { key: 'a2f2a445a2100aa1a15f3e56ca336792abed4fd0', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "Exp. Year", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: '7c4baf5981965a25ab75f1e9ce35a5cf8e293837', class: "flex-fill" }, index.h("iframe-input", { key: 'de7f0c99eb09e0bdc0bb22e485eba5bf4486e345', 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' } })));
     }
 };
 
 const billingFormSchema = (postalOnly) => {
-    const fullBillingForm = form.create$3({
+    const fullBillingForm = index_esm.create$3({
         name: schemaValidations.identityNameValidation.required('Enter full name'),
         address_line1: schemaValidations.lineOneValidation.required('Enter street address'),
         address_line2: schemaValidations.lineTwoValidation.nullable(),
@@ -145,7 +222,7 @@ const billingFormSchema = (postalOnly) => {
         address_state: schemaValidations.stateValidation.required('Select state'),
         address_postal_code: schemaValidations.postalValidation.required('Enter postal code')
     });
-    const postalForm = form.create$3({
+    const postalForm = index_esm.create$3({
         name: schemaValidations.identityNameValidation.nullable(),
         address_line1: schemaValidations.lineOneValidation.nullable(),
         address_line2: schemaValidations.lineTwoValidation.nullable(),
@@ -166,7 +243,7 @@ const BillingForm = class {
     }
     componentWillLoad() {
         const postalOnly = this.isPostalOnlyMode;
-        this.formController = new form.FormController(billingFormSchema(postalOnly));
+        this.formController = new index_esm.FormController(billingFormSchema(postalOnly));
     }
     componentDidLoad() {
         this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
@@ -194,7 +271,7 @@ const BillingForm = class {
     render() {
         const billingFormDefaultValue = this.formController.getInitialValues();
         const showHeader = !this.isPostalOnlyMode && !this.hideAllBillingFields;
-        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 }))))))));
+        return (index.h(index.Host, { key: 'df86239c476aadde3af18742bbf643d61825c051' }, index.h("div", { key: '186f3ef6c2295223da888b7645a0af7aa8df4535', part: parts.billingForm, class: "mt-4", hidden: this.hideAllBillingFields }, showHeader && index.h(header3.Header3, { key: '72284e3fcea18cbdfe879989fb7f1b007e2a37df', text: "Billing address", class: "fs-6 fw-bold lh-lg mb-4" }), index.h("form", { key: '9479d696a0486e63edfad4bd0dbe374a21cb7b8c' }, index.h("fieldset", { key: 'b780abf09a714f2e9588670ad149c3ca999cbc87' }, this.legend && index.h("legend", { key: 'f102dc51722fe2f050c951e7b56117c9577f3b83' }, this.legend), index.h("div", { key: '00d6c7e35d768f3357cc17836c916e2bf24e3a7e', class: "row gy-3" }, index.h("div", { key: 'cb2b29aa769c97ccab246dc74e463d389497edbd', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '3cb8ca5e3ecd0817f8e16aafbb5d3ca5ee7824ed', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: '781338b1c79fd815d2ab2dbc15e7b56b534a2278', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '682a37c6b417fbc0edf76b89122b5bf618603360', name: 'address_line1', label: 'Street Address', defaultValue: billingFormDefaultValue.address_line1, errorText: this.errors.address_line1, inputHandler: this.inputHandler })), index.h("div", { key: '50d657891e492c8568bf179d752b9aadf10f2387', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: 'ce1f04bfc3307af7a025390bcbcce6a6b3da6fab', name: 'address_line2', label: "Apartment, Suite, etc. (optional)", defaultValue: billingFormDefaultValue.address_line2, errorText: this.errors.address_line2, inputHandler: this.inputHandler })), index.h("div", { key: 'ddb45c1cbdc6aa5d27c6a0c4b6f29366ed0e8eba', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-text", { key: '410efdbcd5381bdf61d9c752f292f794d8e12670', name: 'address_city', label: "City", defaultValue: billingFormDefaultValue.address_city, errorText: this.errors.address_city, inputHandler: this.inputHandler })), index.h("div", { key: 'a65811acc25443a07cdb1401231ce1e703096fd4', class: "col-12", hidden: this.isPostalOnlyMode }, index.h("form-control-select", { key: 'bed28d564c9e5a2ebfc10b6ab47e43e2b17bd6e6', name: 'address_state', label: 'State', options: stateOptions.StateOptions, defaultValue: billingFormDefaultValue.address_state, errorText: this.errors.address_state, inputHandler: this.inputHandler })), index.h("div", { key: '8aca307d318e87b17e09122fa91e817c0a59c8d5', class: "col-12", hidden: this.hideAllBillingFields }, index.h("form-control-text", { key: '4dd06dc9ae01fc2953780e52f9e9c918a38a7bbd', 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 }))))))));
     }
 };
 
@@ -291,6 +368,26 @@ const NewPaymentMethod = class {
     }
 };
 
+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);
@@ -307,22 +404,25 @@ const PaymentMethodOptions = class {
         this.paymentMethodsChanged();
     }
     paymentMethodsChanged() {
-        var _a;
+        var _a, _b;
         this.paymentMethodOptions = this.savedPaymentMethods
-            .map((paymentMethod) => new paymentMethodOptionUtils.PaymentMethodOption(paymentMethod))
+            .map((paymentMethod) => new PaymentMethodOption(paymentMethod))
             .filter((paymentMethod) => {
             // Don't saved card or bank account if they are disabled
             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: Payment.PaymentMethodTypes.sezzle }));
+        }
         if (this.showCard) {
-            this.paymentMethodOptions.push(new paymentMethodOptionUtils.PaymentMethodOption({ id: Payment.PaymentMethodTypes.card }));
+            this.paymentMethodOptions.push(new PaymentMethodOption({ id: Payment.PaymentMethodTypes.card }));
         }
         if (this.showAch) {
-            this.paymentMethodOptions.push(new paymentMethodOptionUtils.PaymentMethodOption({ id: Payment.PaymentMethodTypes.bankAccount }));
+            this.paymentMethodOptions.push(new PaymentMethodOption({ id: Payment.PaymentMethodTypes.bankAccount }));
         }
         if (!this.selectedPaymentMethodId) {
-            this.selectedPaymentMethodId = (_a = this.paymentMethodOptions[0]) === null || _a === void 0 ? void 0 : _a.id;
+            this.selectedPaymentMethodId = (_b = this.paymentMethodOptions[0]) === null || _b === void 0 ? void 0 : _b.id;
         }
     }
     paymentMethodOptionSelected(event) {
@@ -338,10 +438,11 @@ const PaymentMethodOptions = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: '2d3dc8bc98cea3efbcf342a31b6883f30099b031' }, (_a = this.paymentMethodOptions) === null || _a === void 0 ? void 0 : _a.map((paymentMethodOption) => {
+        return (index.h(index.Host, { key: 'c61e82c72aaa25e87ded723799a1eb0961c05444' }, (_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 === Payment.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) {
@@ -349,6 +450,13 @@ 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) {
@@ -397,14 +505,77 @@ 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: `${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}` }))));
+        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))))) }))));
     }
 };
 
 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/{business-additional-questions-schema-C1Ot5vrv.js → business-additional-questions-schema-e3GCIHk5.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var form = require('./form-CWW8IM-X.js');
-var schemaValidations = require('./schema-validations-CllkToCZ.js');
+var index_esm = require('./index.esm-CVuJLXJZ.js');
+var schemaValidations = require('./schema-validations-BSeMee-o.js');
 
 const businessCoreInfoSchema = (allowOptionalFields) => {
-    const schema = form.create$3({
+    const schema = index_esm.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 = form.create$3({
+    const easySchema = index_esm.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 = form.create$3({
+    const schema = index_esm.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 = form.create$3({
+    const easySchema = index_esm.create$3({
         business_revenue: schemaValidations.revenueValidation.nullable(),
         business_payment_volume: schemaValidations.paymentVolumeValidation.nullable(),
         business_when_service_received: schemaValidations.whenServiceReceivedValidation.nullable(),

package/dist/cjs/{business-identity-schema-hk4UVEna.js → business-identity-schema-Diqj_WVQ.js}

@@ -1,46 +1,46 @@
 'use strict';
 
-var form = require('./form-CWW8IM-X.js');
-var schemaValidations = require('./schema-validations-CllkToCZ.js');
+var index_esm = require('./index.esm-CVuJLXJZ.js');
+var schemaValidations = require('./schema-validations-BSeMee-o.js');
 
 const addressSchema = (allowOptionalFields) => {
-    const schema = form.create$3({
+    const schema = index_esm.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: form.create$6().required('Select country')
+        country: index_esm.create$6().required('Select country')
     });
-    const easySchema = form.create$3({
+    const easySchema = index_esm.create$3({
         line1: schemaValidations.lineOneValidation.nullable(),
         line2: schemaValidations.lineTwoValidation.nullable(),
         city: schemaValidations.cityValidation.nullable(),
         state: schemaValidations.stateValidation.nullable(),
         postal_code: schemaValidations.postalValidation.nullable(),
-        country: form.create$6().required('Select country')
+        country: index_esm.create$6().required('Select country')
     });
     return allowOptionalFields ? easySchema : schema;
 };
 
 const identitySchema = (role, allowOptionalFields) => {
-    const schema = form.create$3({
+    const schema = index_esm.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: form.create$6().nullable(),
+        ssn_last4: index_esm.create$6().nullable(),
         identification_number: schemaValidations.ssnValidation,
         address: addressSchema(allowOptionalFields),
     });
-    const easySchema = form.create$3({
+    const easySchema = index_esm.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: form.create$6().nullable(),
+        ssn_last4: index_esm.create$6().nullable(),
         identification_number: schemaValidations.ssnValidation.nullable(),
         address: addressSchema(allowOptionalFields),
     });

package/dist/cjs/{business.service-BjlK8M6t.js → business.service-U2eLTrq9.js}

@@ -1,11 +1,11 @@
 'use strict';
 
 var Api = require('./Api-c8NBCwu4.js');
-require('./ComponentError-CEv9ltwy.js');
-require('./Checkout-BsYZoJ0a.js');
+require('./ComponentError-C4MdBBMe.js');
+require('./Checkout-TZnRz3-3.js');
 require('./Pagination-Dediz133.js');
 require('./Payment-D5UynU2f.js');
-require('./Refund-BFE-2OxN.js');
+require('./Refund-DN-yzFgy.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
 

package/dist/cjs/{Analytics-CLEDjTfr.js → check-pkg-version-DuL7lRe2.js}

@@ -1,34 +1,15 @@
 'use strict';
 
-var _package = require('./package-D89BDRKu.js');
+var _package = require('./package-o4g7MDiy.js');
 var Api = require('./Api-c8NBCwu4.js');
-require('./ComponentError-CEv9ltwy.js');
-require('./Checkout-BsYZoJ0a.js');
+require('./ComponentError-C4MdBBMe.js');
+require('./Checkout-TZnRz3-3.js');
 require('./Pagination-Dediz133.js');
 require('./Payment-D5UynU2f.js');
-require('./Refund-BFE-2OxN.js');
+require('./Refund-DN-yzFgy.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
 
-const latestVersion = async (packageName) => {
-    const response = await fetch('https://registry.npmjs.org/' + packageName + '/latest');
-    const json = await response.json();
-    return json.version;
-};
-const checkPkgVersion = async () => {
-    const version = _package.packageJson.version;
-    const packageName = _package.packageJson.name;
-    const latest = await latestVersion(packageName);
-    // remove rc from version and everything that comes after -rc
-    const latestNotRC = latest.replace(/-rc.*/, '');
-    // checkif there's a major version difference
-    const versionParts = version.split('.');
-    const latestParts = latest.split('.');
-    if (versionParts[0] !== latestParts[0]) {
-        console.warn(`The package ${packageName} is out of date. The latest version is ${latestNotRC}. Please update.`);
-    }
-};
-
 const api = Api.Api();
 class AnalyticsService {
     async record(body) {
@@ -111,5 +92,24 @@ class JustifiAnalytics {
     }
 }
 
+const latestVersion = async (packageName) => {
+    const response = await fetch('https://registry.npmjs.org/' + packageName + '/latest');
+    const json = await response.json();
+    return json.version;
+};
+const checkPkgVersion = async () => {
+    const version = _package.packageJson.version;
+    const packageName = _package.packageJson.name;
+    const latest = await latestVersion(packageName);
+    // remove rc from version and everything that comes after -rc
+    const latestNotRC = latest.replace(/-rc.*/, '');
+    // checkif there's a major version difference
+    const versionParts = version.split('.');
+    const latestParts = latest.split('.');
+    if (versionParts[0] !== latestParts[0]) {
+        console.warn(`The package ${packageName} is out of date. The latest version is ${latestNotRC}. Please update.`);
+    }
+};
+
 exports.JustifiAnalytics = JustifiAnalytics;
 exports.checkPkgVersion = checkPkgVersion;