@justifi/webcomponents 4.23.1 → 5.0.0-rc-2

package/dist/module/additional-questions-details2.js

@@ -2,9 +2,6 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 import { D as DetailSectionTitle, a as DetailItem } from './utils.js';
 import { i as isEmptyObject } from './utils2.js';
 
-const sharedBusinessDetailsCss = ".flex-1{flex:1}";
-const AdditionalQuestionsDetailsStyle0 = sharedBusinessDetailsCss;
-
 const AdditionalQuestionsDetails = /*@__PURE__*/ proxyCustomElement(class AdditionalQuestionsDetails extends HTMLElement {
     constructor() {
         super();
@@ -15,9 +12,8 @@ const AdditionalQuestionsDetails = /*@__PURE__*/ proxyCustomElement(class Additi
         var _a, _b;
         if (isEmptyObject(this.additionalQuestions))
             return null;
-        return (h(Host, null, h(DetailSectionTitle, { sectionTitle: "Additional Questions" }), h("div", { class: "d-table gap-2 w-100" }, h("div", { class: "row gy-3" }, h("div", { class: "col-12 col-md-6" }, h(DetailItem, { title: "Business Revenue", value: (_a = this.additionalQuestions.business_revenue) === null || _a === void 0 ? void 0 : _a.toString() }), h(DetailItem, { title: "Business Payment Volume", value: (_b = this.additionalQuestions.business_payment_volume) === null || _b === void 0 ? void 0 : _b.toString() }))))));
+        return (h(Host, null, h(DetailSectionTitle, { sectionTitle: "Additional Questions" }), h("div", { class: "d-table gap-2 w-100 mt-3" }, h("div", { class: "row gy-3" }, h("div", { class: "col-12 col-md-6" }, h(DetailItem, { title: "Business Revenue", value: (_a = this.additionalQuestions.business_revenue) === null || _a === void 0 ? void 0 : _a.toString() }), h(DetailItem, { title: "Business Payment Volume", value: (_b = this.additionalQuestions.business_payment_volume) === null || _b === void 0 ? void 0 : _b.toString() }))))));
     }
-    static get style() { return AdditionalQuestionsDetailsStyle0; }
 }, [0, "additional-questions-details", {
         "additionalQuestions": [16]
     }]);

package/dist/module/additional-questions.js

@@ -1,9 +1,8 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { b as businessServiceReceivedOptions, r as recurringPaymentsOptions, s as seasonalBusinessOptions } from './business-form-options.js';
 import { C as CURRENCY_MASK } from './form-input-masks.js';
-import { d as defineCustomElement$7 } from './custom-popper2.js';
-import { d as defineCustomElement$6 } from './form-control-error-text2.js';
-import { d as defineCustomElement$5 } from './form-control-help-text2.js';
+import { h as heading2 } from './parts.js';
+import { d as defineCustomElement$5 } from './custom-popper2.js';
 import { d as defineCustomElement$4 } from './form-control-monetary2.js';
 import { d as defineCustomElement$3 } from './form-control-select2.js';
 import { d as defineCustomElement$2 } from './form-control-text2.js';
@@ -28,7 +27,7 @@ const AdditionalQuestions = /*@__PURE__*/ proxyCustomElement(class AdditionalQue
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
         const additionalQuestionsDefaultValue = this.formController.getInitialValues().additional_questions;
-        return (h(Host, { key: '61cc057bc6c5776e27de37de03fd89c11e222b48', exportparts: "label,input,input-invalid" }, h("fieldset", { key: 'b979a8632db229a28fe4c7e209963d9750cb3af3' }, h("legend", { key: 'f0228638af05f24d265ff3ff08da34d9026b8bc8' }, "Additional Questions"), h("hr", { key: '985908ab74473185e4f63edf8d2ae67d21aa2c4c' }), h("div", { key: '3e5b107b36d8f02d1a7ec7f5be04cc7560dacb9b', class: "row gy-3" }, h("div", { key: '7bca3143f0e7c813b02b08bf685ed7d83a6f17d3', class: "col-12 col-md-6" }, h("form-control-monetary", { key: '7b96fb49733b41cb4a100d9fbdf85054409d46d8', name: "business_revenue", label: "What is the business' estimated annual revenue from its primary business activities?", inputHandler: this.inputHandler, errorText: (_b = (_a = this.errors) === null || _a === void 0 ? void 0 : _a.additional_questions) === null || _b === void 0 ? void 0 : _b.business_revenue, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_revenue, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: '3103b2355eccb404733e25b1a812faf7d33643de', class: "col-12 col-md-6" }, h("form-control-monetary", { key: '2bd4f9de5e18f8e9f7337e09b20ef2027f8efe10', name: "business_payment_volume", label: "What is the business' annual credit card & ACH volume anticipated to process?", inputHandler: this.inputHandler, errorText: (_d = (_c = this.errors) === null || _c === void 0 ? void 0 : _c.additional_questions) === null || _d === void 0 ? void 0 : _d.business_payment_volume, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_payment_volume, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: '3947678da024eacc36a4895dc82133543904ec10', class: "col-12" }, h("form-control-select", { key: 'cb6473c4ca9b410e1f73fb6821a1e6a9c4e8ba3c', name: 'business_when_service_received', label: 'On average, how long after paying will your customers typically receive their goods or services?', inputHandler: this.inputHandler, errorText: (_f = (_e = this.errors) === null || _e === void 0 ? void 0 : _e.additional_questions) === null || _f === void 0 ? void 0 : _f.business_when_service_received, options: businessServiceReceivedOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_when_service_received })), h("div", { key: '3ba6b5469e8b55fdf9607458ea82db534060b4da', class: "col-12" }, h("form-control-select", { key: '9239ce8bf9b5f54847dcd946b70b84cb2b188476', name: 'business_recurring_payments', label: 'Does your business offer recurring payments?', inputHandler: this.inputHandler, errorText: (_h = (_g = this.errors) === null || _g === void 0 ? void 0 : _g.additional_questions) === null || _h === void 0 ? void 0 : _h.business_recurring_payments, options: recurringPaymentsOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments })), h("div", { key: '3acb380a8932d9df99c1bec4bf77806d23f16376', class: "col-12" }, h("form-control-text", { key: '71a01a5936b25f95ecd1d7a4ae926c34f0ab8f42', name: 'business_recurring_payments_percentage', label: 'What percent of revenue is generated from each recurring payment type offered?', inputHandler: this.inputHandler, errorText: (_k = (_j = this.errors) === null || _j === void 0 ? void 0 : _j.additional_questions) === null || _k === void 0 ? void 0 : _k.business_recurring_payments_percentage, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments_percentage })), h("div", { key: 'e31135b0483e5ab0e71ad4126bed49c2ce8e2f2d', class: "col-12" }, h("form-control-select", { key: '00c4567411859e568ac6c8663476d8a35e11dd59', name: 'business_seasonal', label: 'Is this business seasonal?', inputHandler: this.inputHandler, errorText: (_m = (_l = this.errors) === null || _l === void 0 ? void 0 : _l.additional_questions) === null || _m === void 0 ? void 0 : _m.business_seasonal, options: seasonalBusinessOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_seasonal })), h("div", { key: 'f30fdb514b300844feb0a0c1bb2492d234f5f050', class: "col-12" }, h("form-control-text", { key: '6d7cf0947be6991725bee50c2fcad1298677d5e3', name: 'business_other_payment_details', label: 'Is there anything else you would like us to know about how your customers pay the business?', inputHandler: this.inputHandler, errorText: (_p = (_o = this.errors) === null || _o === void 0 ? void 0 : _o.additional_questions) === null || _p === void 0 ? void 0 : _p.business_other_payment_details, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_other_payment_details }))))));
+        return (h(Host, { key: 'bb84bd6a1e3fa028c187a1d50c905e726549793d' }, h("fieldset", { key: '749a84c04210a561575b7182740fc6e5225756cb' }, h("legend", { key: '9b469b3014f11c3b108ca1ab85cfe61e202b9948', part: heading2 }, "Additional Questions"), h("div", { key: '1681a5e6f88b005dbf12c6e85c5b3b451a32d326', class: "row gy-3" }, h("div", { key: '8b29f94ac08449ed9d1995e1b3bd8e61692defa0', class: "col-12 col-md-6" }, h("form-control-monetary", { key: 'c05f4c9e4c14e2be2ce71f669d4f80661fac5812', name: "business_revenue", label: "What is the business' estimated annual revenue from its primary business activities?", inputHandler: this.inputHandler, errorText: (_b = (_a = this.errors) === null || _a === void 0 ? void 0 : _a.additional_questions) === null || _b === void 0 ? void 0 : _b.business_revenue, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_revenue, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: 'bb7b1d913c72ead01ed7c1887ab3822082e156b4', class: "col-12 col-md-6" }, h("form-control-monetary", { key: '33c9e231009d4368b5dcc45851f96e6329de64aa', name: "business_payment_volume", label: "What is the business' annual credit card & ACH volume anticipated to process?", inputHandler: this.inputHandler, errorText: (_d = (_c = this.errors) === null || _c === void 0 ? void 0 : _c.additional_questions) === null || _d === void 0 ? void 0 : _d.business_payment_volume, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_payment_volume, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: 'b2e265d1eb6199f37cc667df427213f874764450', class: "col-12" }, h("form-control-select", { key: '0eb29219e1ee105088cd7b4953db890f31060a27', name: 'business_when_service_received', label: 'On average, how long after paying will your customers typically receive their goods or services?', inputHandler: this.inputHandler, errorText: (_f = (_e = this.errors) === null || _e === void 0 ? void 0 : _e.additional_questions) === null || _f === void 0 ? void 0 : _f.business_when_service_received, options: businessServiceReceivedOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_when_service_received })), h("div", { key: '368372379f4e361c1a85e56b4f5f9f46f490024e', class: "col-12" }, h("form-control-select", { key: '20c055aaecbc1c98861f675416bd17631f4427af', name: 'business_recurring_payments', label: 'Does your business offer recurring payments?', inputHandler: this.inputHandler, errorText: (_h = (_g = this.errors) === null || _g === void 0 ? void 0 : _g.additional_questions) === null || _h === void 0 ? void 0 : _h.business_recurring_payments, options: recurringPaymentsOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments })), h("div", { key: 'bd9761c491278329673db6fc552aa81d410d3d4e', class: "col-12" }, h("form-control-text", { key: '7824d74e9855743c0fa3192aa67d091676ac8032', name: 'business_recurring_payments_percentage', label: 'What percent of revenue is generated from each recurring payment type offered?', inputHandler: this.inputHandler, errorText: (_k = (_j = this.errors) === null || _j === void 0 ? void 0 : _j.additional_questions) === null || _k === void 0 ? void 0 : _k.business_recurring_payments_percentage, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments_percentage })), h("div", { key: '5eaf43f760d3ca83fe6ce92934827eda00bce848', class: "col-12" }, h("form-control-select", { key: 'bf239e5e8ea008e0617f4930836e2cc54b7d0bfb', name: 'business_seasonal', label: 'Is this business seasonal?', inputHandler: this.inputHandler, errorText: (_m = (_l = this.errors) === null || _l === void 0 ? void 0 : _l.additional_questions) === null || _m === void 0 ? void 0 : _m.business_seasonal, options: seasonalBusinessOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_seasonal })), h("div", { key: '67bf5e9add4e24d12feb6398fd55bd8d29d293ff', class: "col-12" }, h("form-control-text", { key: 'c7956d361e51bb80a96e42f208af4b3499a54c66', name: 'business_other_payment_details', label: 'Is there anything else you would like us to know about how your customers pay the business?', inputHandler: this.inputHandler, errorText: (_p = (_o = this.errors) === null || _o === void 0 ? void 0 : _o.additional_questions) === null || _p === void 0 ? void 0 : _p.business_other_payment_details, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_other_payment_details }))))));
     }
 }, [0, "justifi-additional-questions", {
         "formController": [16],
@@ -39,7 +38,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-additional-questions", "custom-popper", "form-control-error-text", "form-control-help-text", "form-control-monetary", "form-control-select", "form-control-text", "form-control-tooltip"];
+    const components = ["justifi-additional-questions", "custom-popper", "form-control-monetary", "form-control-select", "form-control-text", "form-control-tooltip"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-additional-questions":
             if (!customElements.get(tagName)) {
@@ -47,16 +46,6 @@ function defineCustomElement() {
             }
             break;
         case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "form-control-error-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "form-control-help-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }

package/dist/module/additional-statement.js

@@ -1,25 +1,69 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { d as defineCustomElement$6 } from './custom-popper2.js';
-import { d as defineCustomElement$5 } from './form-control-error-text2.js';
-import { d as defineCustomElement$4 } from './form-control-file2.js';
-import { d as defineCustomElement$3 } from './form-control-help-text2.js';
+import { c as create$3, a as create$6, F as FormController } from './form.js';
+import { D as DisputeEvidenceDocument, a as DisputeResponseFormStep } from './dispute-response-form-types.js';
+import { J as heading5 } from './parts.js';
+import { d as defineCustomElement$5 } from './custom-popper2.js';
+import { d as defineCustomElement$4 } from './form-control-file-v22.js';
+import { d as defineCustomElement$3 } from './form-control-help-text3.js';
 import { d as defineCustomElement$2 } from './form-control-textarea2.js';
 import { d as defineCustomElement$1 } from './form-control-tooltip2.js';
 
+const AdditionalStatementSchema = create$3({
+    additional_statement: create$6().nullable(),
+});
+
 const AdditionalStatement = /*@__PURE__*/ proxyCustomElement(class AdditionalStatement extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+        this.inputHandler = (name, value) => {
+            this.form.setValues(Object.assign(Object.assign({}, this.form.values.getValue()), { [name]: value }));
+        };
+        this.handleFileSelection = (e) => {
+            const target = e.target;
+            const name = target.name;
+            const files = target.files;
+            for (const file of files) {
+                this.documentList.push(new DisputeEvidenceDocument(file, name));
+            }
+        };
+        this.disputeResponse = undefined;
+        this.form = undefined;
+        this.errors = {};
+        this.documentList = [];
+        this.acceptedTerms = false;
+        this.acceptedTermsErrorText = undefined;
+    }
+    async validateAndSubmit(onSuccess) {
+        this.form.validateAndSubmit((formData) => onSuccess(formData, this.documentList, DisputeResponseFormStep.additionalStatement));
+    }
+    ;
+    componentWillLoad() {
+        this.form = new FormController(AdditionalStatementSchema);
+    }
+    componentDidLoad() {
+        this.form.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
     }
     render() {
-        return (h("div", { key: '21cee41c41fa70a5cc6b82f14ea49ee01086fa71' }, h("div", { key: '90d9a279089ce3d5e6861aaab2175ded06a5b8b3', class: "row gy-3" }, h("div", { key: '15a2cdde695c98c47bae644964457c7275e0933f', class: "col-12" }, h("h2", { key: '515f18bc0215936f6dc28cefbabbdbdb12c6ba61', class: "h5" }, "Additional Evidence")), h("div", { key: 'e1ee3b76fb7455c4feeaef6bb9368b4b07ed361b', class: "col-12" }, h("form-control-textarea", { key: '3d4ce8f83f457dd28f08dc5f973a76f9a9d4e362', label: "Is there anything else you would like to say about this dispute?", name: "additional_statement" })), h("div", { key: '46445fa4158cd16fb3e2e26111c4a62fe386bbc0', class: "col-12" }, h("form-control-file", { key: '025ada3f8f2c0a2c185f9be0bfbb9816a560371e', label: "Additional files", name: "uncategorized_file", multiple: true, helpText: "Upload any additional pieces of evidence that have not already been provided." })))));
+        var _a;
+        return (h("div", { key: 'b87dba6b6f0cfd8be3bd034996ad0848f31df3da' }, h("div", { key: 'b2af872dd182dede7cb2c697aa8297acc49eb6c1', class: "row gy-3" }, h("div", { key: '34815036600a5030f388c0dcb840ab7f4db0b66f', class: "col-12" }, h("h2", { key: 'c7922a6dd81112aefc028d1f7662aed993cd4c58', class: "h5", part: heading5 }, "Additional Evidence")), h("div", { key: '1e760ad49f1a7494181b4658f8e73a3f6ede2a22', class: "col-12" }, h("form-control-textarea", { key: '7226c1a3ef90a9f2db529f20470678bf8277738f', label: "Is there anything else you would like to say about this dispute?", name: "additional_statement", defaultValue: (_a = this.disputeResponse) === null || _a === void 0 ? void 0 : _a.additional_statement, inputHandler: this.inputHandler, errorText: this.errors.additional_statement })), h("div", { key: 'cbf8886bd32f9859e6cbe75d5c499ea3eb23aea3', class: "col-12" }, h("form-control-file-v2", { key: '05d52880aa75af84bab03122ef39c2fbc0d0cf7b', label: "Additional files", name: "uncategorized_file", multiple: true, helpText: "Upload any additional pieces of evidence that have not already been provided.", onChange: this.handleFileSelection })))));
     }
-}, [0, "justifi-additional-statement"]);
+}, [0, "justifi-additional-statement", {
+        "disputeResponse": [8, "dispute-response"],
+        "form": [32],
+        "errors": [32],
+        "documentList": [32],
+        "acceptedTerms": [32],
+        "acceptedTermsErrorText": [32],
+        "validateAndSubmit": [64]
+    }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-additional-statement", "custom-popper", "form-control-error-text", "form-control-file", "form-control-help-text", "form-control-textarea", "form-control-tooltip"];
+    const components = ["justifi-additional-statement", "custom-popper", "form-control-file-v2", "form-control-help-text", "form-control-textarea", "form-control-tooltip"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-additional-statement":
             if (!customElements.get(tagName)) {
@@ -27,16 +71,11 @@ function defineCustomElement() {
             }
             break;
         case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "form-control-error-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }
             break;
-        case "form-control-file":
+        case "form-control-file-v2":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }

package/dist/module/{justifi-card-form.d.ts → bank-account-form.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface JustifiCardForm extends Components.JustifiCardForm, HTMLElement {}
-export const JustifiCardForm: {
-    prototype: JustifiCardForm;
-    new (): JustifiCardForm;
+interface BankAccountForm extends Components.BankAccountForm, HTMLElement {}
+export const BankAccountForm: {
+    prototype: BankAccountForm;
+    new (): BankAccountForm;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/module/bank-account-form.js

@@ -0,0 +1,6 @@
+import { B as BankAccountForm$1, d as defineCustomElement$1 } from './bank-account-form2.js';
+
+const BankAccountForm = BankAccountForm$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BankAccountForm, defineCustomElement };

package/dist/module/bank-account-form2.js

@@ -0,0 +1,44 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1 } from './iframe-input2.js';
+
+const BankAccountForm = /*@__PURE__*/ proxyCustomElement(class BankAccountForm extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+    }
+    async validate() {
+        const accountNumberIsValid = await this.accountNumberIframeElement.validate();
+        const routingNumberIsValid = await this.routingNumberIframeElement.validate();
+        return accountNumberIsValid && routingNumberIsValid;
+    }
+    async tokenize(clientId, paymentMethodMetadata, account) {
+        return this.accountNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
+    }
+    render() {
+        return (h(Host, { key: 'd0f0426565fedc6697eb46e6bc8d03d31eee9c37' }, h("div", { key: '6e792d5cba9421d7d106805d0e0e070ef5b116f9', class: "container-fluid p-0" }, h("div", { key: '89def9b854a7dc9a2e2fbb62d70bc6eaccfa6b0f', class: "row mb-3" }, h("iframe-input", { key: '2c0392ed840edb2364922c0d523f509ea84b3cd3', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${"https://components.justifi.ai/v2"}/accountNumber` })), h("div", { key: '6dbe7911ab8693a4850a60e2d86f4539382a341c', class: "row" }, h("iframe-input", { key: '042153db083d7fa8f4e6d2c5704054fbcf6c1af1', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${"https://components.justifi.ai/v2"}/routingNumber` })))));
+    }
+}, [0, "bank-account-form", {
+        "validate": [64],
+        "tokenize": [64]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["bank-account-form", "iframe-input"];
+    components.forEach(tagName => { switch (tagName) {
+        case "bank-account-form":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BankAccountForm);
+            }
+            break;
+        case "iframe-input":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { BankAccountForm as B, defineCustomElement as d };

package/dist/module/billing-form.js

@@ -1,11 +1,9 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { c as create$3, F as FormController } from './form.js';
 import { i as identityNameValidation, l as lineOneValidation, c as lineTwoValidation, d as cityValidation, e as stateValidation, f as postalValidation } from './schema-validations.js';
 import { S as StateOptions } from './state-options.js';
-import { n as numberOnlyHandler } from './utils5.js';
-import { S as StyledHost } from './styled-host.js';
-import { d as defineCustomElement$5 } from './custom-popper2.js';
-import { d as defineCustomElement$4 } from './form-control-error-text2.js';
+import { n as numberOnlyHandler } from './utils4.js';
+import { d as defineCustomElement$4 } from './custom-popper2.js';
 import { d as defineCustomElement$3 } from './form-control-select2.js';
 import { d as defineCustomElement$2 } from './form-control-text2.js';
 import { d as defineCustomElement$1 } from './form-control-tooltip2.js';
@@ -19,14 +17,10 @@ const BillingFormSchema = create$3({
     address_postal_code: postalValidation.required('Enter postal code'),
 });
 
-const billingFormCss = ":host{display:block}justifi-billing-form{margin-left:calc(var(--jfi-layout-padding) * -1);margin-right:calc(var(--jfi-layout-padding) * -1)}*::part(label){color:var(--jfi-form-label-color);font-family:var(--jfi-form-label-font-family);font-weight:var(--jfi-form-label-font-weight);font-size:var(--jfi-form-label-font-size);margin:var(--jfi-form-label-margin)}*::part(input){background-color:var(--jfi-form-control-background-color);border-color:var(--jfi-form-control-border-color);border-width:var(--jfi-form-control-border-width);border-bottom-width:var(--jfi-form-control-border-bottom-width);border-left-width:var(--jfi-form-control-border-left-width);border-right-width:var(--jfi-form-control-border-right-width);border-top-width:var(--jfi-form-control-border-top-width);border-radius:var(--jfi-form-control-border-radius);border-style:var(--jfi-form-control-border-style);box-shadow:var(--jfi-form-control-box-shadow);color:var(--jfi-form-control-color);font-size:var(--jfi-form-control-font-size);font-weight:var(--jfi-form-control-font-weight);line-height:var(--jfi-form-control-line-height);margin:var(--jfi-form-control-margin);padding:var(--jfi-form-control-padding)}*::part(input):focus{color:var(--jfi-form-control-color-focus);border-color:var(--jfi-form-control-border-color-focus);box-shadow:var(--jfi-form-control-box-shadow-focus)}*::part(input-invalid){border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error)}*::part(input-invalid):focus{border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error-focus)}";
-const JustifiBillingFormStyle0 = billingFormCss;
-
 const BillingForm = /*@__PURE__*/ proxyCustomElement(class BillingForm extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
-        this.__attachShadow();
         this.inputHandler = (name, value) => {
             this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
         };
@@ -56,10 +50,9 @@ const BillingForm = /*@__PURE__*/ proxyCustomElement(class BillingForm extends H
     }
     render() {
         const billingFormDefaultValue = this.formController.getInitialValues();
-        return (h(StyledHost, { key: '221838c3ba8255b62db0f2feee7b227b0d240627', exportparts: "label,input,input-invalid" }, h("form", { key: '87377d7776c3fdf7ffa351f25522921b233dd16f' }, h("fieldset", { key: '821487e408ec634dd23417604f02f1aa212dcb2a' }, this.legend && h("legend", { key: 'c042f51480e23ad455a6d3fc420f494c33d93f2c' }, this.legend), h("div", { key: '6a9f2c0fd10c7786b132f7208036cf878e3fe8c1', class: "row gy-3" }, h("div", { key: 'b375c19faeb23927e290c4a60b4347dc64868840', class: "col-12" }, h("form-control-text", { key: 'be3b78234607f996efe8971082ff457e63767e22', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), h("div", { key: '95d3f3bb6ff7df39deb2967db11017e8f80ca5a9', class: "col-12" }, h("form-control-text", { key: '9e719038219bf7b7651679b617b2131ab5336289', name: 'address_line1', label: 'Street Address', defaultValue: billingFormDefaultValue.address_line1, errorText: this.errors.address_line1, inputHandler: this.inputHandler })), h("div", { key: '0945bca70a70abfdce40c8d52537eb06479aface', class: "col-12" }, h("form-control-text", { key: '59b9b87c005609daf501b0d7d6a8d640297c75c4', name: 'address_line2', label: "Apartment, Suite, etc. (optional)", defaultValue: billingFormDefaultValue.address_line2, errorText: this.errors.address_line2, inputHandler: this.inputHandler })), h("div", { key: 'f3e9d8297e9e4009a0b16f331eeffb1316a92030', class: "col-12" }, h("form-control-text", { key: '158a4d2e3e85700a5c80304e0316391090b52f74', name: 'address_city', label: "City", defaultValue: billingFormDefaultValue.address_city, errorText: this.errors.address_city, inputHandler: this.inputHandler })), h("div", { key: '67110a816d76d4c98062859733def72e88f1a3d9', class: "col-12" }, h("form-control-select", { key: 'd26b22251d6da9d8f7b8bb109126e804cdfbccb0', name: 'address_state', label: 'State', options: StateOptions, defaultValue: billingFormDefaultValue.address_state, errorText: this.errors.address_state, inputHandler: this.inputHandler })), h("div", { key: 'a248ef0a4860d9d634f46e96cc953c8ca0ee64f1', class: "col-12" }, h("form-control-text", { key: '36f96a7e94088dd140ca9774903387ae2be3cad8', name: 'address_postal_code', label: "ZIP", defaultValue: billingFormDefaultValue.address_postal_code, errorText: this.errors.address_postal_code, inputHandler: this.inputHandler, maxLength: 5, keyDownHandler: numberOnlyHandler })))))));
+        return (h(Host, { key: 'b3bb548839b39a87ad330b9048426baff317cae0' }, h("form", { key: '32e999825e5094e8e5399d46f67b67186f18d7b2' }, h("fieldset", { key: 'c8f13e2d392c45804bb51907a21ff80cb1148fd3' }, this.legend && h("legend", { key: 'c4117087a3391f8c28815069d832d6133459b250' }, this.legend), h("div", { key: '61d9de519f93d42bab36670108a6b923e30cff7f', class: "row gy-3" }, h("div", { key: '4753e297cbab92db6f073e9679ea9f3e9dacf432', class: "col-12" }, h("form-control-text", { key: '1f366def4cd8449cc242eb3bd71952a1548def08', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), h("div", { key: 'c7efc6968d6f776be84ac16b56a785965a81501b', class: "col-12" }, h("form-control-text", { key: '789ca132aabfe42381ce55ec343494b9ac766e73', name: 'address_line1', label: 'Street Address', defaultValue: billingFormDefaultValue.address_line1, errorText: this.errors.address_line1, inputHandler: this.inputHandler })), h("div", { key: 'f750e3800a361e78c58a31091b8d07437fe7fdcf', class: "col-12" }, h("form-control-text", { key: '66e06c53dec8b254bf5f7b1d4029c17523f2ceb7', name: 'address_line2', label: "Apartment, Suite, etc. (optional)", defaultValue: billingFormDefaultValue.address_line2, errorText: this.errors.address_line2, inputHandler: this.inputHandler })), h("div", { key: '9868c2a9bcbed8c65ac8ca8d89ea2102fd0dd1c6', class: "col-12" }, h("form-control-text", { key: 'a637775b91a89fa32c54c97e6a97ec18b2e69024', name: 'address_city', label: "City", defaultValue: billingFormDefaultValue.address_city, errorText: this.errors.address_city, inputHandler: this.inputHandler })), h("div", { key: '274656a1a879790c99a684da3aa6070f473e2d0b', class: "col-12" }, h("form-control-select", { key: '5fca9ff62f2e2f26fc936474133dbdf24183e86d', name: 'address_state', label: 'State', options: StateOptions, defaultValue: billingFormDefaultValue.address_state, errorText: this.errors.address_state, inputHandler: this.inputHandler })), h("div", { key: 'e24b2e9961e1a464a1d99fa4982814e7d43c5a79', class: "col-12" }, h("form-control-text", { key: '1992d68c496b1331a0efbbbeb03153f9155a77d3', name: 'address_postal_code', label: "ZIP", defaultValue: billingFormDefaultValue.address_postal_code, errorText: this.errors.address_postal_code, inputHandler: this.inputHandler, maxLength: 5, keyDownHandler: numberOnlyHandler })))))));
     }
-    static get style() { return JustifiBillingFormStyle0; }
-}, [1, "justifi-billing-form", {
+}, [0, "justifi-billing-form", {
         "legend": [1025],
         "formController": [32],
         "billingInfo": [32],
@@ -72,7 +65,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-billing-form", "custom-popper", "form-control-error-text", "form-control-select", "form-control-text", "form-control-tooltip"];
+    const components = ["justifi-billing-form", "custom-popper", "form-control-select", "form-control-text", "form-control-tooltip"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-billing-form":
             if (!customElements.get(tagName)) {
@@ -80,11 +73,6 @@ function defineCustomElement() {
             }
             break;
         case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "form-control-error-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }

package/dist/module/business-additional-questions-form-step-core.js

@@ -2,12 +2,11 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/i
 import { a as additionalQuestionsSchema } from './business-additional-questions-schema.js';
 import { F as FormController } from './form.js';
 import { A as AdditionalQuestions } from './Business.js';
-import { B as BusinessFormStepV2 } from './business-form-types.js';
 import { C as CURRENCY_MASK } from './form-input-masks.js';
+import { h as heading2 } from './parts.js';
 import { b as businessServiceReceivedOptions, r as recurringPaymentsOptions, s as seasonalBusinessOptions } from './business-form-options.js';
-import { d as defineCustomElement$7 } from './custom-popper2.js';
-import { d as defineCustomElement$6 } from './form-control-error-text2.js';
-import { d as defineCustomElement$5 } from './form-control-help-text2.js';
+import { B as BusinessFormStep } from './event-types2.js';
+import { d as defineCustomElement$5 } from './custom-popper2.js';
 import { d as defineCustomElement$4 } from './form-control-monetary2.js';
 import { d as defineCustomElement$3 } from './form-control-select2.js';
 import { d as defineCustomElement$2 } from './form-control-text2.js';
@@ -17,10 +16,9 @@ const AdditionalQuestionsFormStepCore = /*@__PURE__*/ proxyCustomElement(class A
     constructor() {
         super();
         this.__registerHost();
-        this.submitted = createEvent(this, "submitted", 7);
-        this.stepCompleted = createEvent(this, "form-step-completed", 7);
-        this.formLoading = createEvent(this, "formLoading", 7);
+        this.stepCompleteEvent = createEvent(this, "complete-form-step-event", 7);
         this.errorEvent = createEvent(this, "error-event", 7);
+        this.formLoading = createEvent(this, "formLoading", 7);
         this.getData = () => {
             this.formLoading.emit(true);
             this.getBusiness({
@@ -56,8 +54,7 @@ const AdditionalQuestionsFormStepCore = /*@__PURE__*/ proxyCustomElement(class A
                     });
                 },
                 final: () => {
-                    this.submitted.emit({ data: { submittedData } });
-                    this.stepCompleted.emit({ data: submittedData, formStep: BusinessFormStepV2.additionalQuestions });
+                    this.stepCompleteEvent.emit({ response: submittedData, formStep: BusinessFormStep.additionalQuestions });
                     this.formLoading.emit(false);
                 }
             });
@@ -102,7 +99,7 @@ const AdditionalQuestionsFormStepCore = /*@__PURE__*/ proxyCustomElement(class A
     render() {
         var _a, _b, _c, _d, _e, _f, _g;
         const additionalQuestionsDefaultValue = this.formController.getInitialValues();
-        return (h("form", { key: '469cda15cbb05da33e26bc645cc51ebbbdf6e7fc' }, h("fieldset", { key: 'b00875b7d3f3d3ad338c38000cc29b3a550e8a50' }, h("div", { key: '6dfc3d60d5b5469613681715bf1965752fdb9662', class: "d-flex align-items-center gap-2" }, h("legend", { key: '65b2a3769f96714563a468eca3f1d7e82d6a1538', class: "mb-0" }, "Additional Questions"), h("form-control-tooltip", { key: '7a51538fe74cf8e0f3ed49042d6301fb2bd7909b', helpText: "This information helps us understand the business and identify and monitor trends to safeguard you and your customers." })), h("hr", { key: '42496d5e78ed4922a0165caab9e6e7e48cb44616', class: "mt-2" }), h("div", { key: '0d7ff24d81a3f54e223293c393d4ce89588a1c58', class: "row gy-3" }, h("div", { key: '12a1c72e5e5802f7729f2a09764a5cffa194639d', class: "col-12 col-md-6" }, h("form-control-monetary", { key: 'c9f4aecc5b7108c788237f776953c5cd9ae844b8', name: "business_revenue", label: "What is your business\u2019 estimated annual revenue from its primary business activities?", inputHandler: this.inputHandler, errorText: (_a = this.errors) === null || _a === void 0 ? void 0 : _a.business_revenue, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_revenue, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: 'ecd78939d2a7ac81932898f65f3c9424f157fb3d', class: "col-12 col-md-6" }, h("form-control-monetary", { key: '5df34b238082a11a4589a05e24c53650bd2c0b79', name: "business_payment_volume", label: "What is your business' annual credit card & ACH volume anticipated to process?", inputHandler: this.inputHandler, errorText: (_b = this.errors) === null || _b === void 0 ? void 0 : _b.business_payment_volume, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_payment_volume, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: '9db14123245c84eb3dc33d28154ac9be458987cc', class: "col-12" }, h("form-control-select", { key: '7e9899a2e41c14ae968c5451e46d445cbaa289a4', name: "business_when_service_received", label: "On average, how long after paying will your customers typically receive their goods or services?", inputHandler: this.inputHandler, errorText: (_c = this.errors) === null || _c === void 0 ? void 0 : _c.business_when_service_received, options: businessServiceReceivedOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_when_service_received })), h("div", { key: 'f5ebffe9294cbe7e16487c8e63009f7c4901fee1', class: "col-12" }, h("form-control-select", { key: '32a0f978252a52cff90a3a9c1e675515960ee016', name: "business_recurring_payments", label: "Does your business offer recurring payments?", inputHandler: this.inputHandler, errorText: (_d = this.errors) === null || _d === void 0 ? void 0 : _d.business_recurring_payments, options: recurringPaymentsOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments })), h("div", { key: '0aa20a223c15959c7b1e36b8570c17c11c193a8c', class: 'col-12', hidden: !this.recurringPayments }, h("form-control-text", { key: 'e6abbe38ef92091d87c04f832c860ac1a34e855f', name: "business_recurring_payments_percentage", label: "What percent of revenue is generated from each recurring payment type offered?", inputHandler: this.inputHandler, errorText: (_e = this.errors) === null || _e === void 0 ? void 0 : _e.business_recurring_payments_percentage, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments_percentage, helpText: "For example: 50% monthly, 50% annual." })), h("div", { key: '1c2fbe366315babd398e48b38861cb2b8336b287', class: "col-12" }, h("form-control-select", { key: 'eb45c69781ea51ab35f3f0782d1245f553ff63a5', name: "business_seasonal", label: "Is this business seasonal?", inputHandler: this.inputHandler, errorText: (_f = this.errors) === null || _f === void 0 ? void 0 : _f.business_seasonal, options: seasonalBusinessOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_seasonal })), h("div", { key: 'ded80ce1cf8b0fd1b580d5002a1a869aed132f62', class: "col-12" }, h("form-control-text", { key: '80612b8d9381072e0ae670f07b649f01f1cfed66', name: "business_other_payment_details", label: "Is there anything else you would like us to know about how your customers pay the business? (optional)", inputHandler: this.inputHandler, errorText: (_g = this.errors) === null || _g === void 0 ? void 0 : _g.business_other_payment_details, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_other_payment_details }))))));
+        return (h("form", { key: '064a079c1a44d2d0149f68cf9d30086205275838' }, h("fieldset", { key: 'b380a225a7080f9b733de3adf7e3ee574116e870' }, h("div", { key: 'caa57d2bd552fb384f9d703524fb908d7df75e03', class: "d-flex align-items-center gap-2" }, h("legend", { key: '3be6ea38780905e7b3fe261fa901445cd1a0259f', class: "mb-0", part: heading2 }, "Additional Questions"), h("form-control-tooltip", { key: '3aab9d08eeeea7a65fc6a8f38f4a0210fa8ee718', helpText: "This information helps us understand the business and identify and monitor trends to safeguard you and your customers." })), h("hr", { key: 'b92e8f12fd4155efcb05739501fb4639403e0694', class: "mt-2" }), h("div", { key: 'b4b8cac0c7039084e2a1a1b34974bb7f89bf24a2', class: "row gy-3" }, h("div", { key: '11f218ce7b13285d3aad396d72d9e5a07ddd1ad7', class: "col-12 col-md-6" }, h("form-control-monetary", { key: '96b53fe22ce54cd5caa9819897581b13174ff701', name: "business_revenue", label: "What is your business\u2019 estimated annual revenue from its primary business activities?", inputHandler: this.inputHandler, errorText: (_a = this.errors) === null || _a === void 0 ? void 0 : _a.business_revenue, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_revenue, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: 'a2b06ca931b4ac3e7a48b81e65195390ed0042cf', class: "col-12 col-md-6" }, h("form-control-monetary", { key: '5b894031a24d627f3ae91410c3af026509fc8d45', name: "business_payment_volume", label: "What is your business' annual credit card & ACH volume anticipated to process?", inputHandler: this.inputHandler, errorText: (_b = this.errors) === null || _b === void 0 ? void 0 : _b.business_payment_volume, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_payment_volume, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { key: '244c089ad87fbbca94b4d164016f4f446945b6e3', class: "col-12" }, h("form-control-select", { key: '2664aa0485966ed8a4742d2f78ae706283f7a9a9', name: "business_when_service_received", label: "On average, how long after paying will your customers typically receive their goods or services?", inputHandler: this.inputHandler, errorText: (_c = this.errors) === null || _c === void 0 ? void 0 : _c.business_when_service_received, options: businessServiceReceivedOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_when_service_received })), h("div", { key: 'ea44cfd2e01d1a214c28b9a3c21a374b55f7d6df', class: "col-12" }, h("form-control-select", { key: '9f6e6929ac702b71e6b9861cd06f0ee06bc41cb8', name: "business_recurring_payments", label: "Does your business offer recurring payments?", inputHandler: this.inputHandler, errorText: (_d = this.errors) === null || _d === void 0 ? void 0 : _d.business_recurring_payments, options: recurringPaymentsOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments })), h("div", { key: '58091269a3d5e0957271a2917aa34c85052a93b8', class: 'col-12', hidden: !this.recurringPayments }, h("form-control-text", { key: '18fa653b4c9aec51d054ffad35e6c3f030ad89a4', name: "business_recurring_payments_percentage", label: "What percent of revenue is generated from each recurring payment type offered?", inputHandler: this.inputHandler, errorText: (_e = this.errors) === null || _e === void 0 ? void 0 : _e.business_recurring_payments_percentage, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments_percentage, helpText: "For example: 50% monthly, 50% annual." })), h("div", { key: 'c525df2e0565502408bfb285051fa28d5bf21ccf', class: "col-12" }, h("form-control-select", { key: '10422ff6edece7ce860586dfc244583805fd3f50', name: "business_seasonal", label: "Is this business seasonal?", inputHandler: this.inputHandler, errorText: (_f = this.errors) === null || _f === void 0 ? void 0 : _f.business_seasonal, options: seasonalBusinessOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_seasonal })), h("div", { key: '2a3cb0362556081e331a78065fbca341f156ba33', class: "col-12" }, h("form-control-text", { key: 'c7a9edc8d9a465197afa813906a9abd6455a45f0', name: "business_other_payment_details", label: "Is there anything else you would like us to know about how your customers pay the business? (optional)", inputHandler: this.inputHandler, errorText: (_g = this.errors) === null || _g === void 0 ? void 0 : _g.business_other_payment_details, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_other_payment_details }))))));
     }
     static get watchers() { return {
         "additional_questions": ["recurringPaymentsWatcher"]
@@ -123,7 +120,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-additional-questions-form-step-core", "custom-popper", "form-control-error-text", "form-control-help-text", "form-control-monetary", "form-control-select", "form-control-text", "form-control-tooltip"];
+    const components = ["justifi-additional-questions-form-step-core", "custom-popper", "form-control-monetary", "form-control-select", "form-control-text", "form-control-tooltip"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-additional-questions-form-step-core":
             if (!customElements.get(tagName)) {
@@ -131,16 +128,6 @@ function defineCustomElement() {
             }
             break;
         case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "form-control-error-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "form-control-help-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }

package/dist/module/business-additional-questions-form-step.js

@@ -2,9 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/i
 import { C as ComponentErrorCodes, a as ComponentErrorSeverity } from './ComponentError.js';
 import { m as makeGetBusiness, a as makePatchBusiness } from './payment-provisioning-actions.js';
 import { B as BusinessService } from './business.service.js';
-import { d as defineCustomElement$8 } from './custom-popper2.js';
-import { d as defineCustomElement$7 } from './form-control-error-text2.js';
-import { d as defineCustomElement$6 } from './form-control-help-text2.js';
+import { d as defineCustomElement$6 } from './custom-popper2.js';
 import { d as defineCustomElement$5 } from './form-control-monetary2.js';
 import { d as defineCustomElement$4 } from './form-control-select2.js';
 import { d as defineCustomElement$3 } from './form-control-text2.js';
@@ -53,7 +51,7 @@ const AdditionalQuestionsFormStep = /*@__PURE__*/ proxyCustomElement(class Addit
         }
     }
     render() {
-        return (h("justifi-additional-questions-form-step-core", { key: '6ca8443cbe837d993be4381a9d650caaaf51f2df', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: el => this.coreComponent = el }));
+        return (h("justifi-additional-questions-form-step-core", { key: 'bef3e4d67c4ccbb25dae52291ba9a399e854fb53', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: el => this.coreComponent = el }));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
@@ -74,7 +72,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-additional-questions-form-step", "custom-popper", "form-control-error-text", "form-control-help-text", "form-control-monetary", "form-control-select", "form-control-text", "form-control-tooltip", "justifi-additional-questions-form-step-core"];
+    const components = ["justifi-additional-questions-form-step", "custom-popper", "form-control-monetary", "form-control-select", "form-control-text", "form-control-tooltip", "justifi-additional-questions-form-step-core"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-additional-questions-form-step":
             if (!customElements.get(tagName)) {
@@ -82,16 +80,6 @@ function defineCustomElement() {
             }
             break;
         case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "form-control-error-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "form-control-help-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$6();
             }

package/dist/module/business-bank-account-form-step.js

@@ -1,18 +1,18 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { c as create$3, F as FormController } from './form.js';
-import { a as BusinessFormStep, B as BusinessFormStepV2 } from './business-form-types.js';
 import { g as bankNameValidation, n as nicknameValidation, i as identityNameValidation, h as accountTypeValidation, j as accountNumberValidation, k as routingNumberValidation } from './schema-validations.js';
-import { c as bankAccountTypeOptions } from './business-form-options.js';
 import { A as Api } from './Api.js';
 import './Checkout.js';
 import './Pagination.js';
 import './Payment.js';
 import './SubAccount.js';
 import { c as config } from './config.js';
-import { n as numberOnlyHandler } from './utils5.js';
+import { n as numberOnlyHandler } from './utils4.js';
 import { C as ComponentErrorCodes, a as ComponentErrorSeverity } from './ComponentError.js';
-import { d as defineCustomElement$5 } from './custom-popper2.js';
-import { d as defineCustomElement$4 } from './form-control-error-text2.js';
+import { h as heading2 } from './parts.js';
+import { c as bankAccountTypeOptions } from './business-form-options.js';
+import { B as BusinessFormStep } from './event-types2.js';
+import { d as defineCustomElement$4 } from './custom-popper2.js';
 import { d as defineCustomElement$3 } from './form-control-select2.js';
 import { d as defineCustomElement$2 } from './form-control-text2.js';
 import { d as defineCustomElement$1 } from './form-control-tooltip2.js';
@@ -62,10 +62,9 @@ const BusinessBankAccountFormStep = /*@__PURE__*/ proxyCustomElement(class Busin
     constructor() {
         super();
         this.__registerHost();
-        this.submitted = createEvent(this, "submitted", 7);
-        this.stepCompleted = createEvent(this, "form-step-completed", 7);
-        this.formLoading = createEvent(this, "formLoading", 7);
+        this.stepCompleteEvent = createEvent(this, "complete-form-step-event", 7);
         this.errorEvent = createEvent(this, "error-event", 7);
+        this.formLoading = createEvent(this, "formLoading", 7);
         this.fetchData = async () => {
             this.formLoading.emit(true);
             try {
@@ -142,12 +141,11 @@ const BusinessBankAccountFormStep = /*@__PURE__*/ proxyCustomElement(class Busin
         else {
             onSuccess();
         }
-        this.submitted.emit({ data: response, metadata: { completedStep: BusinessFormStep.bankAccount } });
-        this.stepCompleted.emit({ data: response, formStep: BusinessFormStepV2.bankAccount });
+        this.stepCompleteEvent.emit({ response: response, formStep: BusinessFormStep.bankAccount });
     }
     async validateAndSubmit({ onSuccess }) {
         if (this.formDisabled) {
-            this.stepCompleted.emit({ data: null, formStep: BusinessFormStepV2.bankAccount, metadata: 'no data submitted' });
+            this.stepCompleteEvent.emit({ response: null, formStep: BusinessFormStep.bankAccount, metadata: 'no data submitted' });
             onSuccess();
         }
         else {
@@ -170,7 +168,7 @@ const BusinessBankAccountFormStep = /*@__PURE__*/ proxyCustomElement(class Busin
     }
     render() {
         const bankAccountDefaultValue = this.formController.getInitialValues();
-        return (h("form", { key: '7ae39afd400c9bc2a86f75aeb2a529a36ecd849c' }, h("fieldset", { key: 'd01072ed3710acfbb7916de8ffb9fb80770750af' }, h("div", { key: '75228827d492fcdbd603963a3574c1dca84530b4', class: "d-flex align-items-center gap-2" }, h("legend", { key: '23600460d0b1486d3d4cd612bc9532ba30d5da0e', class: "mb-0" }, "Bank Account Info"), h("form-control-tooltip", { key: 'fed3ad0eef074985a25488a9c093b9eb0cbafabb', helpText: "The Direct Deposit Account is the business bank account where your funds will be deposited. The name of this account must match the registered business name exactly. We are not able to accept personal accounts unless your business is a registered sole proprietorship." })), h("hr", { key: 'f7405cf23ee0a90d46f2c394d09ae421fe9472ee', class: "mt-2" }), h("div", { key: '4cc1d09daed6a897778440f69bd0a9dbd99c1270', class: "row gy-3" }, h("div", { key: 'f7e0e160adaf0925b4ea5ada12137dcf3e5c5d35', class: "col-12" }, h("form-control-text", { key: 'd7cbdb427b9bf332dd9da5885ccfc73d0dd4b40b', name: "bank_name", label: "Bank Name", defaultValue: bankAccountDefaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '010c5dd53d8d31f9edc4f0e7ca225c0d2c8a1e09', class: "col-12" }, h("form-control-text", { key: 'f524266d5fcd4e3e35539c130f6dfe742d620593', name: "nickname", label: "Nickname", defaultValue: bankAccountDefaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '1875fc9bb5e0741e1c2aff205effa030aafcd0e2', class: "col-12" }, h("form-control-text", { key: '343754af2350ca668f39270513fa44be416834ba', name: "account_owner_name", label: "Account Owner Name", defaultValue: bankAccountDefaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '9870781e41bd5879ec161569a7b60ecc049690cc', class: "col-12" }, h("form-control-select", { key: '1ade0e3e0f470e3165d227b67c9dd4054d8443fc', name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: bankAccountDefaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: 'c5e531aaded367bd825913cb100dd3225d1c6f61', class: "col-12" }, h("form-control-text", { key: '39cd3bca5b86a0ca175c26be3982bc0e98953439', name: "account_number", label: "Account Number", defaultValue: bankAccountDefaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "Please copy the account number as shown on your statement/check. Do not include spaces or dashes." })), h("div", { key: '8c3306dde7149b49d1ad6ba426634674e318b4fd', class: "col-12" }, h("form-control-text", { key: '970305b04e9517f56bcb8217cd938b8971ca34b4', name: "routing_number", label: "Routing Number", defaultValue: bankAccountDefaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "A valid routing number is nine digits. Please include any leading or trailing zeroes." }))))));
+        return (h("form", { key: 'd326af8d567422ee342571d35119497cd5983a7f' }, h("fieldset", { key: '4ada14e070e9f9b1f12aa3288af50e78c8d7e2f3' }, h("div", { key: 'e9e104ca5ddd22fbddb2154d026ec0cb6610426a', class: "d-flex align-items-center gap-2" }, h("legend", { key: '7800c3648bebce9ca000162e3c85f0cc558f045e', class: "mb-0", part: heading2 }, "Bank Account Info"), h("form-control-tooltip", { key: '3dbc31dfc1f7f60b68f10f2666e58ae208bb36cb', helpText: "The Direct Deposit Account is the business bank account where your funds will be deposited. The name of this account must match the registered business name exactly. We are not able to accept personal accounts unless your business is a registered sole proprietorship." })), h("hr", { key: '489cf91c3af1050ee1f0babe8fa6ba7fa9d1912d', class: "mt-2" }), h("div", { key: 'cace0eee0e8b9849294b11bad15452b77dcd9ee9', class: "row gy-3" }, h("div", { key: '0697524d52d53ccfab7201e1f06c0f8f477c8da7', class: "col-12" }, h("form-control-text", { key: 'b391b6e7e3f9c1c92f5bb651da2291ca75afc7f3', name: "bank_name", label: "Bank Name", defaultValue: bankAccountDefaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '84afc5c90399809d228561e348f4a6f5fbeeaa48', class: "col-12" }, h("form-control-text", { key: 'add80854eae161c51dfc3006e8f03ef01113291c', name: "nickname", label: "Nickname", defaultValue: bankAccountDefaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: 'f5d31db2be25a09b6f57b78fcac9b6031077d235', class: "col-12" }, h("form-control-text", { key: '5a916bfbad467bd2a55f0159716c29cb78d4d9d0', name: "account_owner_name", label: "Account Owner Name", defaultValue: bankAccountDefaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: 'ebce663decaf9bd6b46794b820197c7ba8a450cc', class: "col-12" }, h("form-control-select", { key: 'dd42e72741934d015a1d405b09e7c14b8f865606', name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: bankAccountDefaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler, disabled: this.formDisabled })), h("div", { key: '2fa3139ed30465e1e0f9a5075eb13e9c3874aa0a', class: "col-12" }, h("form-control-text", { key: 'f309563391770bd1074b7c29b47c39c5c7ecec5f', name: "account_number", label: "Account Number", defaultValue: bankAccountDefaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "Please copy the account number as shown on your statement/check. Do not include spaces or dashes." })), h("div", { key: '80424fa942fe444ba9137e724ecd50fb4839c59f', class: "col-12" }, h("form-control-text", { key: 'c5e08a9cdbb11c92e3271d6507f6bd3225abdf2f', name: "routing_number", label: "Routing Number", defaultValue: bankAccountDefaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, disabled: this.formDisabled, helpText: "A valid routing number is nine digits. Please include any leading or trailing zeroes." }))))));
     }
 }, [0, "justifi-business-bank-account-form-step", {
         "authToken": [1, "auth-token"],
@@ -185,7 +183,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-business-bank-account-form-step", "custom-popper", "form-control-error-text", "form-control-select", "form-control-text", "form-control-tooltip"];
+    const components = ["justifi-business-bank-account-form-step", "custom-popper", "form-control-select", "form-control-text", "form-control-tooltip"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-business-bank-account-form-step":
             if (!customElements.get(tagName)) {
@@ -193,11 +191,6 @@ function defineCustomElement() {
             }
             break;
         case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "form-control-error-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }