@justifi/webcomponents 5.4.4 → 5.6.0

package/dist/cjs/bank-account-form_9.cjs.entry.js

@@ -1,16 +1,23 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5b9a3b5f.js');
-const skeleton = require('./skeleton-e8aa41d0.js');
-const iframeInputStylesState = require('./iframe-input-styles-state-d0de0b24.js');
-const parts = require('./parts-5ca90f9a.js');
-const header3 = require('./header-3-eb250a04.js');
-const Payment = require('./Payment-bccd8f7d.js');
-const utils = require('./utils-4120664c.js');
-require('./index-d2d0b181.js');
-require('./Dispute-eb6bad54.js');
+var index = require('./index-BRQfozbS.js');
+var skeleton = require('./skeleton-BXVndBVC.js');
+var iframeInputStylesState = require('./iframe-input-styles-state-jHHRvqzM.js');
+var parts = require('./parts-D_uKOPFe.js');
+var index_esm = require('./index.esm-CVuJLXJZ.js');
+var schemaValidations = require('./schema-validations-p4OCdblz.js');
+var header3 = require('./header-3-CNWIH9ZU.js');
+var utils = require('./utils-DAyWinG2.js');
+var stateOptions = require('./state-options-CIT9xdTz.js');
+var Payment = require('./Payment-CQCmj3Ck.js');
+var utils$1 = require('./utils-DmZ8Dia3.js');
+require('./index-DzQdh5ij.js');
+require('./_commonjsHelpers-BJu3ubxk.js');
+require('./business-form-options-BCj0efiD.js');
+require('./Business-DyiDiIuO.js');
+require('./helpers-B5OCqlIM.js');
+require('./Document-rXGBUaOh.js');
+require('./Dispute-CruQTF6_.js');
 
 const BankAccountFormSkeleton = (props) => {
     const { isReady } = props;
@@ -31,7 +38,6 @@ const BankAccountFormSkeleton = (props) => {
 const BankAccountForm = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.iframeOrigin = undefined;
         this.isReady = false;
     }
     async validate() {
@@ -86,7 +92,6 @@ const CardFormSkeleton = (props) => {
 const CardForm = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.iframeOrigin = undefined;
         this.isReady = false;
     }
     componentDidRender() {
@@ -115,10 +120,10 @@ const CardForm = class {
         return this.cardNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        return (index.h(index.Host, { key: 'fdbbbe01ef33117408fd49e1b478a6c3f0be56a6' }, index.h(CardFormSkeleton, { key: '859d45e5e9aa80f999aeece561e7d7971289786b', isReady: this.isReady }), index.h("div", { key: '586ca0f390ed57f34432930298662d2f85341dfa', class: "container-fluid p-0", style: {
+        return (index.h(index.Host, { key: '035f015833d7c16a99ffb3cc4c1b88f44928839f' }, index.h(CardFormSkeleton, { key: '4f6a98efb4bb1ec08bc7660fe8fb11cf1f91aac4', isReady: this.isReady }), index.h("div", { key: 'efe85d9a9f3cd1ecabd6014b4e6ef6a22dce94f1', class: "container-fluid p-0", style: {
                 opacity: this.isReady ? '1' : '0',
                 height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: '61f374b426d49a29f16ca1d56d5d9e82e74f12aa', class: "mb-3" }, index.h("iframe-input", { key: '965ad04d1ea086a026917078f7e8fc7b24d2c02e', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: '0485b76a5b5f2d524eb942a7a36e534953730a4e', class: "row" }, index.h("div", { key: '9ffbe45585e6989e096430310dd21d5e31f1aa2f', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '5fc0327c43a2823245261391074aba703791ecc7', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: '22090d11cf2e4f017db46a7d2525f65d1e85a469', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'a7b220a1081a241663b71619dad519611c2b98f5', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: '9b6b26802c21b0b73fe71f251a584f33bed6179f', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '59094373c4476437645d96779d65d5cea3f690d0', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
+            } }, index.h("div", { key: 'd72b1e2e6034d556eccbc6bd68b1469ce51ae257', class: "mb-3" }, index.h("iframe-input", { key: 'd5d4ae255037b01aced2c90c59bb74d65053b88a', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: '1ff59862ecaf86c067638bc86a7a21425ee27ec0', class: "row" }, index.h("div", { key: '3f6803d69bc30890eb39f005c32c06d0cfb6cf0d', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'a328d46fbfea56f3fd483194a74e6d8520cbc2ae', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: '46594d660b45a68f5b578823ed54db1a570a0291', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'e107c2515d16a339d52a3b08f91537eca3c92a23', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: '3df8a556f5e0bade368137a673e814774ad507b9', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '3432154c7645eda22beb1fe180936357b5b4b2c2', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
     }
 };
 
@@ -195,54 +200,68 @@ const HiddenInput = class {
         return parts.input;
     }
     render() {
-        return (index.h(index.Host, { key: 'bd707d25b1b5f0a870ff6c778291cf008ecd212b' }, index.h("input", { key: '639af920d20d2d5e9c2791c251f00368137c7798', 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' } })));
+        return (index.h(index.Host, { key: '170a3d6232e5ecee555da05387d127b56b07f7df' }, index.h("input", { key: '8acef653371ebbe45c624f8ea233b9c9c6c40714', 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 BillingFormWrapper = class {
+const billingFormSchema = (postalOnly) => {
+    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(),
+        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 = index_esm.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;
+};
+
+const BillingForm = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.legend = undefined;
-        this.hideCardBillingForm = undefined;
-        this.paymentMethodType = undefined;
+        this.errors = {};
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
     }
-    get hideFullBillingForm() {
-        return this.hideCardBillingForm && this.paymentMethodType === 'card';
+    componentWillLoad() {
+        const postalOnly = this.isPostalOnlyMode;
+        this.formController = new index_esm.FormController(billingFormSchema(postalOnly));
     }
-    async fill(fields) {
-        if (this.hideFullBillingForm) {
-            this.postalFormRef.fill(fields);
-        }
-        else {
-            this.billingFormRef.fill(fields);
-        }
+    componentDidLoad() {
+        this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
+    }
+    get isPostalOnlyMode() {
+        return this.paymentMethodType === 'card' && this.hideCardBillingForm;
+    }
+    get hideAllBillingFields() {
+        return this.paymentMethodType === 'bankAccount' && this.hideBankAccountBillingForm;
     }
     async getValues() {
-        if (this.hideFullBillingForm) {
-            return this.postalFormRef.getValues();
-        }
-        else {
-            return this.billingFormRef.getValues();
-        }
+        return this.formController.values.getValue();
     }
-    async validate() {
-        if (this.hideFullBillingForm) {
-            return this.postalFormRef.validate();
-        }
-        else {
-            return this.billingFormRef.validate();
-        }
+    async fill(fields) {
+        this.formController.setInitialValues(fields);
     }
-    get renderedForm() {
-        if (this.hideFullBillingForm) {
-            return (index.h("postal-form", { ref: (el) => (this.postalFormRef = el) }));
-        }
-        else {
-            return (index.h("div", null, index.h(header3.Header3, { text: "Billing address", class: "fs-6 fw-bold lh-lg mb-4" }), index.h("billing-form", { ref: (el) => (this.billingFormRef = el) })));
-        }
+    async validate() {
+        let isValid = await this.formController.validate();
+        return { isValid: isValid };
     }
     render() {
-        return (index.h(index.Host, { key: 'be6dea58ab65001a820f6c0bb62f91f8b5698c76' }, index.h("div", { key: '7f69a59cdfb80ac8723b07243379ba61bb1f30c9', part: parts.billingForm }, this.renderedForm)));
+        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 }))))))));
     }
 };
 
@@ -253,29 +272,22 @@ const PaymentMethodTypeLabels = {
 const NewPaymentMethod = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected", 7);
+        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected");
+        this.saveNewPaymentMethodChecked = false;
         this.onPaymentMethodOptionClick = (e) => {
             e.preventDefault();
             this.paymentMethodOptionSelected.emit(this.paymentMethodOption);
         };
-        this.authToken = undefined;
-        this.accountId = undefined;
-        this.paymentMethodOption = undefined;
-        this.paymentMethodGroupId = undefined;
-        this.isSelected = undefined;
-        this.hideCardBillingForm = undefined;
-        this.iframeOrigin = undefined;
-        this.saveNewPaymentMethodChecked = false;
     }
     handleCheckboxChanged(event) {
         this.saveNewPaymentMethodChecked = event.detail;
     }
     async fillBillingForm(fields) {
-        this.billingFormWrapperRef.fill(fields);
+        this.billingFormRef.fill(fields);
     }
     async resolvePaymentMethod(insuranceValidation) {
         var _a, _b;
-        if (!this.paymentMethodFormRef || !this.billingFormWrapperRef)
+        if (!this.paymentMethodFormRef || !this.billingFormRef)
             return;
         try {
             const isValid = await this.validate();
@@ -299,13 +311,13 @@ const NewPaymentMethod = class {
         }
     }
     async validate() {
-        const billingFormValidation = await this.billingFormWrapperRef.validate();
+        const billingFormValidation = await this.billingFormRef.validate();
         const paymentMethodFormValidation = await this.paymentMethodFormRef.validate();
         return billingFormValidation.isValid && paymentMethodFormValidation.isValid;
     }
     async tokenize() {
         try {
-            const billingFormFieldValues = await this.billingFormWrapperRef.getValues();
+            const billingFormFieldValues = await this.billingFormRef.getValues();
             let paymentMethodData;
             if (this.saveNewPaymentMethodChecked) {
                 paymentMethodData = Object.assign(Object.assign({}, billingFormFieldValues), { payment_method_group_id: this.paymentMethodGroupId });
@@ -324,11 +336,14 @@ const NewPaymentMethod = class {
     showNewPaymentMethodForm() {
         var _a;
         const paymentMethodType = (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id;
-        return (index.h("div", { class: "mt-4 pb-4" }, index.h("hidden-input", null), index.h("div", { class: "mb-4" }, paymentMethodType === 'card' ? (index.h("card-form", { ref: (el) => this.paymentMethodFormRef = el, iframeOrigin: this.iframeOrigin })) : (index.h("bank-account-form", { ref: (el) => this.paymentMethodFormRef = el, iframeOrigin: this.iframeOrigin }))), index.h("justifi-billing-form-wrapper", { ref: (el) => (this.billingFormWrapperRef = el), hideCardBillingForm: this.hideCardBillingForm, paymentMethodType: paymentMethodType }), index.h("justifi-save-new-payment-method", { hidden: !this.paymentMethodGroupId })));
+        return (index.h("div", { class: "mt-4 pb-4" }, index.h("hidden-input", null), paymentMethodType === 'card' ? (index.h("card-form", { ref: (el) => this.paymentMethodFormRef = el, iframeOrigin: this.iframeOrigin })) : (index.h("bank-account-form", { ref: (el) => this.paymentMethodFormRef = el, iframeOrigin: this.iframeOrigin })), index.h("justifi-billing-form", { ref: (el) => (this.billingFormRef = el), hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, paymentMethodType: paymentMethodType }), index.h("justifi-save-new-payment-method", { hidden: !this.paymentMethodGroupId })));
+    }
+    get hiddenRadioInput() {
+        return !this.showAch || !this.showCard;
     }
     render() {
         var _a, _b;
-        return (index.h(index.Host, { key: '6d2d33cea2442744a4593e0635b1b2fcd6197275', class: "payment-method" }, index.h("div", { key: '5dc7a8e50668c3abf7b43a4251a6bbaa17c624d2', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick }, index.h("form-control-radio", { key: '2bd2cdff094dc1c103fe1c79a6a8a4ee7f6c17be', 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: 'a3da4a7aa5c5f68bec412be9eb210e8d45d81e80', class: "payment-method" }, index.h("div", { key: 'b15cf071a206e09333d55d5c7af26b71a79c46cf', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick, hidden: this.hiddenRadioInput }, index.h("form-control-radio", { key: 'd6ff109905c264b201ff3d6f09001a17e4cc351b', 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));
     }
 };
 
@@ -337,7 +352,7 @@ class PaymentMethodOption {
         this.id = paymentMethod.id;
         this.brand = paymentMethod.brand;
         this.acct_last_four = paymentMethod.acct_last_four;
-        this.type = utils.snakeToCamel(paymentMethod.type);
+        this.type = utils$1.snakeToCamel(paymentMethod.type);
     }
 }
 var CardBrandLabels;
@@ -355,20 +370,7 @@ var CardBrandLabels;
 const PaymentMethodOptions = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.showCard = undefined;
-        this.showAch = undefined;
-        this.showBnpl = undefined;
-        this.showSavedPaymentMethods = undefined;
-        this.paymentMethodGroupId = undefined;
-        this.bnpl = undefined;
-        this.insuranceToggled = undefined;
-        this.authToken = undefined;
-        this.accountId = undefined;
         this.savedPaymentMethods = [];
-        this.paymentAmount = undefined;
-        this.hideCardBillingForm = undefined;
-        this.iframeOrigin = undefined;
-        this.selectedPaymentMethodId = undefined;
         this.paymentMethodOptions = [];
     }
     async fillBillingForm(fields) {
@@ -409,15 +411,20 @@ const PaymentMethodOptions = class {
         var _a;
         return await ((_a = this.selectedPaymentMethodOptionRef) === null || _a === void 0 ? void 0 : _a.resolvePaymentMethod(insuranceValidation));
     }
+    async validate() {
+        const newPaymentMethodElement = this.selectedPaymentMethodOptionRef;
+        const isValid = await newPaymentMethodElement.validate();
+        return { isValid: isValid };
+    }
     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: '2cf31e17412eb30afabe6749b86b7d1a6f308114' }, (_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, paymentMethodGroupId: this.paymentMethodGroupId, hideCardBillingForm: this.hideCardBillingForm, iframeOrigin: this.iframeOrigin, ref: (el) => {
+                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, iframeOrigin: this.iframeOrigin, ref: (el) => {
                         if (isSelected) {
                             this.selectedPaymentMethodOptionRef = el;
                         }
@@ -447,7 +454,7 @@ const PaymentMethodOptions = class {
 const SaveNewPaymentMethod = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.checkboxChanged = index.createEvent(this, "checkboxChanged", 7);
+        this.checkboxChanged = index.createEvent(this, "checkboxChanged");
         this.isChecked = false;
     }
     handleCheckboxChange(_name, value) {
@@ -462,13 +469,11 @@ const SaveNewPaymentMethod = class {
 const SavedPaymentMethod = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected", 7);
+        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected");
         this.onPaymentMethodOptionClick = (e) => {
             e.preventDefault();
             this.paymentMethodOptionSelected.emit(this.paymentMethodOption);
         };
-        this.paymentMethodOption = undefined;
-        this.isSelected = undefined;
     }
     async resolvePaymentMethod(insuranceValidation) {
         var _a;
@@ -493,7 +498,7 @@ const sezzleLogo = (index.h("img", { class: "sezzle-smart-button-logo-img", src:
 const SezzlePaymentMethod = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected", 7);
+        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected");
         this.onPaymentMethodOptionClick = (e) => {
             e.preventDefault();
             this.paymentMethodOptionSelected.emit(this.paymentMethodOption);
@@ -525,15 +530,6 @@ const SezzlePaymentMethod = class {
             this.sezzleCheckout = checkout;
             this.installmentPlan = this.sezzleCheckout.getInstallmentPlan(amount);
         };
-        this.bnpl = undefined;
-        this.clientId = undefined;
-        this.accountId = undefined;
-        this.paymentMethodOption = undefined;
-        this.isSelected = undefined;
-        this.paymentAmount = undefined;
-        this.installmentPlan = undefined;
-        this.sezzleCheckout = undefined;
-        this.sezzlePromise = undefined;
     }
     componentDidRender() {
         this.scriptRef.onload = () => {
@@ -550,14 +546,14 @@ const SezzlePaymentMethod = class {
     }
     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.formatCurrency((_c = this.installmentPlan) === null || _c === void 0 ? void 0 : _c.installments[0].amountInCents))))) }))));
+        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_wrapper = BillingFormWrapper;
+exports.justifi_billing_form = BillingForm;
 exports.justifi_new_payment_method = NewPaymentMethod;
 exports.justifi_payment_method_options = PaymentMethodOptions;
 exports.justifi_save_new_payment_method = SaveNewPaymentMethod;

package/dist/cjs/{business-additional-questions-schema-8568cb79.js → business-additional-questions-schema-mzZ2gYHQ.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const index_esm = require('./index.esm-544c08fd.js');
-const schemaValidations = require('./schema-validations-a7cefbdf.js');
+var index_esm = require('./index.esm-CVuJLXJZ.js');
+var schemaValidations = require('./schema-validations-p4OCdblz.js');
 
 const businessCoreInfoSchema = (allowOptionalFields) => {
     const schema = index_esm.create$3({

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

@@ -1,12 +1,10 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5b9a3b5f.js');
-const utils = require('./utils-f8714daa.js');
-const styledHost = require('./styled-host-94309bab.js');
-const skeleton = require('./skeleton-e8aa41d0.js');
-require('./parts-5ca90f9a.js');
+var index = require('./index-BRQfozbS.js');
+var utils = require('./utils-DxbncJhj.js');
+var styledHost = require('./styled-host-CzJ8Ux1t.js');
+var skeleton = require('./skeleton-BXVndBVC.js');
+require('./parts-D_uKOPFe.js');
 
 const BusinessDetailsLoading = () => {
     const Block = () => (index.h("div", { class: "mt-5" },
@@ -37,9 +35,7 @@ var RENDER_STATES;
 const BusinessDetailsCore = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.errorEvent = index.createEvent(this, "error-event", 7);
-        this.getBusiness = undefined;
-        this.business = undefined;
+        this.errorEvent = index.createEvent(this, "error-event");
         this.renderState = RENDER_STATES.LOADING;
         this.errorMessage = 'An error ocurred.';
     }

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

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

package/dist/cjs/{business-identity-schema-518ab6eb.js → business-identity-schema-dt0zCW0R.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const index_esm = require('./index.esm-544c08fd.js');
-const schemaValidations = require('./schema-validations-a7cefbdf.js');
+var index_esm = require('./index.esm-CVuJLXJZ.js');
+var schemaValidations = require('./schema-validations-p4OCdblz.js');
 
 const addressSchema = (allowOptionalFields) => {
     const schema = index_esm.create$3({

package/dist/cjs/{business.service-6e8a29a2.js → business.service-Crmkeulk.js}

@@ -1,41 +1,56 @@
 'use strict';
 
-const Api = require('./Api-83d93333.js');
+var Api = require('./Api-KMweahmp.js');
 
 class BusinessService {
     async fetchBusiness(businessId, authToken, apiOrigin = "https://wc-proxy.justifi.ai") {
         const endpoint = `entities/business/${businessId}`;
-        return Api.Api({ authToken, apiOrigin }).get(endpoint);
+        return Api.Api({ authToken, apiOrigin }).get({ endpoint });
     }
     async patchBusiness(authToken, businessId, payload) {
         const endpoint = `entities/business/${businessId}`;
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).patch(endpoint, payload);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).patch({
+            endpoint,
+            body: payload,
+        });
     }
 }
 class IdentityService {
     async fetchIdentity(identityId, authToken) {
         const endpoint = `entities/identity/${identityId}`;
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).get(endpoint);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).get({ endpoint });
     }
     async patchIdentity(authToken, identityId, payload) {
         const endpoint = `entities/identity/${identityId}`;
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).patch(endpoint, payload);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).patch({
+            endpoint,
+            body: payload,
+        });
     }
     async postIdentity(authToken, payload) {
         const endpoint = `entities/identity`;
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post(endpoint, payload);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post({
+            endpoint,
+            body: payload,
+        });
     }
 }
 class BusinessBankAccountService {
     async postBankAccount(authToken, payload) {
         const endpoint = `entities/bank_accounts`;
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post(endpoint, payload);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post({
+            endpoint,
+            body: payload,
+        });
     }
 }
 class DocumentRecordService {
     async postDocumentRecord(authToken, payload) {
         const endpoint = `entities/document`;
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post(endpoint, payload);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post({
+            endpoint,
+            body: payload,
+        });
     }
 }
 

package/dist/cjs/{button-4a9fd41e.js → button-Cp4u5YgP.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const index = require('./index-5b9a3b5f.js');
-const parts = require('./parts-5ca90f9a.js');
+var index = require('./index-BRQfozbS.js');
+var parts = require('./parts-D_uKOPFe.js');
 
 const ButtonSpinner = () => (index.h("div", { class: "spinner-border spinner-border-sm", role: "status", part: "button-spinner" },
     index.h("span", { class: "visually-hidden" }, "Loading...")));

package/dist/cjs/{check-pkg-version-e6dcbeb7.js → check-pkg-version-C4d9pl8G.js}

@@ -1,12 +1,12 @@
 'use strict';
 
-const _package = require('./package-5a9f02b2.js');
-const Api = require('./Api-83d93333.js');
+var _package = require('./package-S6wVKDKx.js');
+var Api = require('./Api-KMweahmp.js');
 
 class AnalyticsService {
     async record(body) {
         const endpoint = 'analytics';
-        return Api.Api({ apiOrigin: "https://wc-proxy.justifi.ai" }).post(endpoint, body);
+        return Api.Api({ apiOrigin: "https://wc-proxy.justifi.ai" }).post({ endpoint, body });
     }
 }
 

package/dist/cjs/{checkout.service-0a7835dc.js → checkout.service-DP9FnXBx.js}

@@ -1,17 +1,17 @@
 'use strict';
 
-const Api = require('./Api-83d93333.js');
-require('./ComponentError-233ac749.js');
-require('./Checkout-5352009d.js');
-require('./Pagination-0da8f095.js');
-require('./Payment-bccd8f7d.js');
-require('./SubAccount-2a302ead.js');
-require('./Document-0b828345.js');
+var Api = require('./Api-KMweahmp.js');
+require('./ComponentError-C4MdBBMe.js');
+require('./Checkout-RAGvjVPj.js');
+require('./Pagination-Dediz133.js');
+require('./Payment-CQCmj3Ck.js');
+require('./Refund-CpurRc4w.js');
+require('./Document-rXGBUaOh.js');
 
 class CheckoutService {
     async fetchCheckout(authToken, checkoutId) {
         const endpoint = `checkouts/${checkoutId}`;
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).get(endpoint);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).get({ endpoint });
     }
     async fetchCheckouts(accountId, authToken, params, apiOrigin) {
         if (!apiOrigin) {
@@ -20,7 +20,7 @@ class CheckoutService {
         const headers = { Account: accountId };
         const api = Api.Api({ authToken, apiOrigin: apiOrigin });
         const endpoint = 'checkouts';
-        return api.get(endpoint, params, null, headers);
+        return api.get({ endpoint, params, headers });
     }
     async complete(authToken, checkoutId, payment) {
         const endpoint = `checkouts/${checkoutId}/complete`;
@@ -30,7 +30,10 @@ class CheckoutService {
         if (payment.payment_token) {
             payload.payment_token = payment.payment_token;
         }
-        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post(endpoint, payload);
+        return Api.Api({ authToken, apiOrigin: "https://wc-proxy.justifi.ai" }).post({
+            endpoint,
+            body: payload,
+        });
     }
 }