@justifi/webcomponents 6.10.4 → 6.12.0

package/dist/module/Analytics.js

@@ -5,48 +5,6 @@ import './Pagination.js';
 import './Business.js';
 import './ApplePay.js';
 
-const JUSTIFI_VERSION_KEY = '__JUSTIFI_WC_VERSION__';
-const detectDuplicateVersion = () => {
-    if (typeof globalThis === 'undefined')
-        return;
-    const currentVersion = webcomponentsPackageJson.version;
-    const existingVersion = globalThis[JUSTIFI_VERSION_KEY];
-    if (existingVersion && existingVersion !== currentVersion) {
-        console.error(`@justifi/webcomponents: Multiple versions detected. ` +
-            `Version ${existingVersion} was loaded first and registered all components. ` +
-            `Version ${currentVersion} is also present but its components will NOT be used. ` +
-            `To fix this, add to your package.json:\n` +
-            `"pnpm": { "overrides": { "@justifi/webcomponents": "${currentVersion}" } }`);
-        return;
-    }
-    globalThis[JUSTIFI_VERSION_KEY] = currentVersion;
-};
-const latestVersion = async (packageName) => {
-    const response = await fetch('https://registry.npmjs.org/' + packageName + '/latest');
-    const json = await response.json();
-    return json.version;
-};
-const checkPkgVersion = async () => {
-    var _a, _b;
-    detectDuplicateVersion();
-    // Skip version check in test environments to avoid async logs after tests complete
-    if (typeof process !== 'undefined' &&
-        (((_a = process.env) === null || _a === void 0 ? void 0 : _a.NODE_ENV) === 'test' || ((_b = process.env) === null || _b === void 0 ? void 0 : _b.JEST_WORKER_ID))) {
-        return;
-    }
-    const version = webcomponentsPackageJson.version;
-    const packageName = webcomponentsPackageJson.name;
-    const latest = await latestVersion(packageName);
-    // remove rc from version and everything that comes after -rc
-    const latestNotRC = latest.replace(/-rc.*/, '');
-    // checkif there's a major version difference
-    const versionParts = version.split('.');
-    const latestParts = latest.split('.');
-    if (versionParts[0] !== latestParts[0]) {
-        console.warn(`The package ${packageName} is out of date. The latest version is ${latestNotRC}. Please update.`);
-    }
-};
-
 const api = Api();
 class AnalyticsService {
     async record(body) {
@@ -130,4 +88,4 @@ class JustifiAnalytics {
     }
 }
 
-export { JustifiAnalytics as J, checkPkgVersion as c };
+export { JustifiAnalytics as J };

package/dist/module/Plaid.js

@@ -475,7 +475,7 @@ class Terminal {
         this.platform_account_id = data.platform_account_id || '';
         this.provider = data.provider || null;
         this.provider_id = data.provider_id || '';
-        this.provider_serial_number = data.provider_serial_number || '';
+        this.provider_serial_number = data.serial_number || '';
         this.created_at = data.created_at || '';
         this.updated_at = data.updated_at || '';
         this.verified_at = data.verified_at || '';
@@ -722,4 +722,4 @@ const PLAID_ERROR_SEVERITY = {
     [PlaidErrorCodes.PLAID_RATE_LIMITED]: ComponentErrorSeverity.WARNING,
 };
 
-export { ComponentErrorCodes as C, Dispute as D, EntityDocumentType as E, ICheckoutStatus as I, PLAID_ERROR_SEVERITY as P, RefundReasons as R, SubAccount as S, TerminalOrderStatus as T, ComponentErrorSeverity as a, PLAID_ERROR_MESSAGES as b, PlaidErrorCodes as c, DisputeStatus as d, Payment as e, ComponentErrorMessages as f, ICheckoutPaymentModeParam as g, PaymentStatuses as h, PayoutStatusesSafeNames as i, TerminalOrderType as j, ITerminalStatus as k, EntityDocumentStorage as l, EntityDocument as m, Checkout as n, Payout as o, Terminal as p, PaymentBalanceTransaction as q, PayoutBalanceTransaction as r, TerminalOrder as s, TerminalModel as t, RefundPayload as u };
+export { ComponentErrorSeverity as C, Dispute as D, EntityDocumentType as E, ICheckoutStatus as I, PLAID_ERROR_SEVERITY as P, RefundReasons as R, SubAccount as S, TerminalOrderStatus as T, ComponentErrorCodes as a, PLAID_ERROR_MESSAGES as b, PlaidErrorCodes as c, DisputeStatus as d, Payment as e, ComponentErrorMessages as f, ICheckoutPaymentModeParam as g, PaymentStatuses as h, PayoutStatusesSafeNames as i, TerminalOrderType as j, ITerminalStatus as k, EntityDocumentStorage as l, EntityDocument as m, Checkout as n, Payout as o, Terminal as p, PaymentBalanceTransaction as q, PayoutBalanceTransaction as r, TerminalOrder as s, TerminalModel as t, RefundPayload as u };

package/dist/module/additional-questions-form-step.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface AdditionalQuestionsFormStep extends Components.AdditionalQuestionsFormStep, HTMLElement {}
+export const AdditionalQuestionsFormStep: {
+    prototype: AdditionalQuestionsFormStep;
+    new (): AdditionalQuestionsFormStep;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

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

@@ -0,0 +1,6 @@
+import { A as AdditionalQuestionsFormStep$1, d as defineCustomElement$1 } from './additional-questions-form-step2.js';
+
+const AdditionalQuestionsFormStep = AdditionalQuestionsFormStep$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AdditionalQuestionsFormStep, defineCustomElement };

package/dist/module/{business-additional-questions-form-step.js → additional-questions-form-step2.js}

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { a as ComponentErrorSeverity, C as ComponentErrorCodes } from './Plaid.js';
+import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './Plaid.js';
 import { m as makeGetBusiness, a as makePatchBusiness } from './payment-provisioning-actions.js';
 import { B as BusinessService } from './business.service.js';
 import { a as additionalQuestionsSchema } from './business-additional-questions-schema.js';
@@ -8,7 +8,7 @@ import { A as AdditionalQuestions } from './Business.js';
 import { C as CURRENCY_MASK } from './form-input-masks.js';
 import { h as heading2 } from './parts.js';
 import { P as PaymentProvisioningLoading } from './payment-provisioning-loading.js';
-import { a as businessServiceReceivedOptions } from './business-form-options.js';
+import { b as businessServiceReceivedOptions } from './business-form-options.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-monetary-provisioning2.js';
@@ -140,7 +140,7 @@ const AdditionalQuestionsFormStep = /*@__PURE__*/ proxyCustomElement(class Addit
         "businessId": ["propChanged"],
         "additional_questions": ["recurringPaymentsWatcher"]
     }; }
-}, [256, "justifi-additional-questions-form-step", {
+}, [256, "additional-questions-form-step", {
         "authToken": [1, "auth-token"],
         "businessId": [1, "business-id"],
         "allowOptionalFields": [4, "allow-optional-fields"],
@@ -161,9 +161,9 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-additional-questions-form-step", "custom-popper", "form-control-monetary-provisioning", "form-control-select", "form-control-text", "form-control-tooltip"];
+    const components = ["additional-questions-form-step", "custom-popper", "form-control-monetary-provisioning", "form-control-select", "form-control-text", "form-control-tooltip"];
     components.forEach(tagName => { switch (tagName) {
-        case "justifi-additional-questions-form-step":
+        case "additional-questions-form-step":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, AdditionalQuestionsFormStep);
             }

package/dist/module/additional-questions.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface AdditionalQuestions extends Components.AdditionalQuestions, HTMLElement {}
+export const AdditionalQuestions: {
+    prototype: AdditionalQuestions;
+    new (): AdditionalQuestions;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/module/additional-questions.js

@@ -1,78 +1,6 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { a as businessServiceReceivedOptions, r as recurringPaymentsOptions, s as seasonalBusinessOptions } from './business-form-options.js';
-import { C as CURRENCY_MASK } from './form-input-masks.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-monetary-provisioning2.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';
+import { A as AdditionalQuestions$1, d as defineCustomElement$1 } from './additional-questions2.js';
 
-const AdditionalQuestions = /*@__PURE__*/ proxyCustomElement(class AdditionalQuestions extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.errors = {};
-        this.additional_questions = {};
-        this.inputHandler = this.inputHandler.bind(this);
-    }
-    componentDidLoad() {
-        this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors)));
-        this.formController.values.subscribe(values => (this.additional_questions = Object.assign({}, values.additional_questions)));
-    }
-    inputHandler(name, value) {
-        this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { additional_questions: Object.assign(Object.assign({}, this.formController.values.getValue().additional_questions), { [name]: value }) }));
-    }
-    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: '825ad2a859cacac1b9ba7be60ade5f3bb108abee' }, h("fieldset", { key: 'be913775846b09d99c0c5809a93dfc2779bbae9c' }, h("legend", { key: '52db62eb99455247f317f3dfce9ed260139d9b92', part: heading2 }, "Additional Questions"), h("div", { key: '9bca42f1668874643cb2c46f3ac39df85fb0cc45', class: "row gy-3" }, h("div", { key: '4f5cfbb11109a00d5427096503bceeb443349925', class: "col-12 col-md-6" }, h("form-control-monetary-provisioning", { key: '8d467c76af23e7aaa0a437a6b8631f8966dd7c41', 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: '4e5ed2a46af18734a97e498fe03d0b39b6d64895', class: "col-12 col-md-6" }, h("form-control-monetary-provisioning", { key: '5dac6143381928fa469e610a51c680dc2d6458ba', 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: '7ffc0942f4aa7a28fe5cb647af3fb4d0fbdfb19f', class: "col-12" }, h("form-control-select", { key: 'dd323dcdb5152040737ad91715e5f1eba17afaed', 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: 'f7d98dcddaee8beb583b7436007660012c856d06', class: "col-12" }, h("form-control-select", { key: 'c3dd0af43353221f0b6f34555afc6627eb6e4805', 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: '6afac5b74ebf3f833f3a773c4c364ec805c827ee', class: "col-12" }, h("form-control-text", { key: '8730d4945250eaf2aee10e2eb2327876f98e07f3', 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: '4e13389f89aad6598817c4a45e5a8125ae21b9a4', class: "col-12" }, h("form-control-select", { key: '5cb9f4af9b1a1a707f6110073356474397b46489', 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: '705affae85c29fe6d5270ad32a2af9bdeed9b6e9', class: "col-12" }, h("form-control-text", { key: '08807d448e5a4f1865a22d06d9e1e34d27bb5f5f', 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 }))))));
-    }
-}, [256, "justifi-additional-questions", {
-        "formController": [16],
-        "errors": [32],
-        "additional_questions": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["justifi-additional-questions", "custom-popper", "form-control-monetary-provisioning", "form-control-select", "form-control-text", "form-control-tooltip"];
-    components.forEach(tagName => { switch (tagName) {
-        case "justifi-additional-questions":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, AdditionalQuestions);
-            }
-            break;
-        case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "form-control-monetary-provisioning":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "form-control-select":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "form-control-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "form-control-tooltip":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
+const AdditionalQuestions = AdditionalQuestions$1;
+const defineCustomElement = defineCustomElement$1;
 
-export { AdditionalQuestions as A, defineCustomElement as d };
+export { AdditionalQuestions, defineCustomElement };

package/dist/module/additional-questions2.js

@@ -0,0 +1,78 @@
+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 { h as heading2 } from './parts.js';
+import { d as defineCustomElement$5 } from './custom-popper2.js';
+import { d as defineCustomElement$4 } from './form-control-monetary-provisioning2.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';
+
+const AdditionalQuestions = /*@__PURE__*/ proxyCustomElement(class AdditionalQuestions extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.errors = {};
+        this.additional_questions = {};
+        this.inputHandler = this.inputHandler.bind(this);
+    }
+    componentDidLoad() {
+        this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors)));
+        this.formController.values.subscribe(values => (this.additional_questions = Object.assign({}, values.additional_questions)));
+    }
+    inputHandler(name, value) {
+        this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { additional_questions: Object.assign(Object.assign({}, this.formController.values.getValue().additional_questions), { [name]: value }) }));
+    }
+    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: '2cef96e9fd7d585353deebd2149ccaa6f70601f3' }, h("fieldset", { key: '324401c967c047997b4b46c4835a2e9c28d200c3' }, h("legend", { key: '0958dcb308db0032292f54736eeeaeaf562a4dd3', part: heading2 }, "Additional Questions"), h("div", { key: '7eb6cf2912a726647937120600400f4cb70babf1', class: "row gy-3" }, h("div", { key: 'fee24c156b5e97d013520353813ef894e9295251', class: "col-12 col-md-6" }, h("form-control-monetary-provisioning", { key: 'c72df3ba128cf84444febec88c402934442023a7', 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: 'be1f0d42c19d479a56da7781316e659245a265c3', class: "col-12 col-md-6" }, h("form-control-monetary-provisioning", { key: '5a3df350a2bbb31286b4bbfadfb0067099135449', 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: '5b98b7842f1adad2d57c23c274c2ee5b70b1a5c4', class: "col-12" }, h("form-control-select", { key: '116133084185496cf6e22098b5bb1245132e361d', 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: '6b5849afeeab55f63cb3f084b9bfbfa0ce686df1', class: "col-12" }, h("form-control-select", { key: '523e2e69d6d637905efb74447785cb6e20d3d658', 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: '4b5e4167371d6d1e6f6ae764b28789741bcac145', class: "col-12" }, h("form-control-text", { key: '6e86c7d28ca2980f80c076e2359430773c47b575', 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: '55f01cf14c9e3d988672b494d9b3a50bf8d83869', class: "col-12" }, h("form-control-select", { key: 'c05d4e0ff64d61ad276e05daa86a4c574dfabfd5', 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: 'b34e0e1eecca9b43141357e0973cae5d61dc228a', class: "col-12" }, h("form-control-text", { key: '3b097d06b301c6075f0f9706f1ccca3ae504ce3c', 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 }))))));
+    }
+}, [256, "additional-questions", {
+        "formController": [16],
+        "errors": [32],
+        "additional_questions": [32]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["additional-questions", "custom-popper", "form-control-monetary-provisioning", "form-control-select", "form-control-text", "form-control-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "additional-questions":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AdditionalQuestions);
+            }
+            break;
+        case "custom-popper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "form-control-monetary-provisioning":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "form-control-select":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "form-control-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "form-control-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { AdditionalQuestions as A, defineCustomElement as d };

package/dist/module/badge.js

@@ -1,5 +1,5 @@
 import { h } from '@stencil/core/internal/client';
-import { E as badgeDark, F as badgeLight, G as badgeInfo, H as badgeWarning, I as badgeDanger, J as badgeSuccess, K as badgeSecondary, L as badgePrimary, M as badge } from './parts.js';
+import { R as badgeDark, S as badgeLight, T as badgeInfo, U as badgeWarning, V as badgeDanger, W as badgeSuccess, X as badgeSecondary, Y as badgePrimary, Z as badge } from './parts.js';
 
 var BadgeVariant;
 (function (BadgeVariant) {

package/dist/module/bank-account-billing-form-simple.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BankAccountBillingFormSimple extends Components.BankAccountBillingFormSimple, HTMLElement {}
+export const BankAccountBillingFormSimple: {
+    prototype: BankAccountBillingFormSimple;
+    new (): BankAccountBillingFormSimple;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

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

@@ -1,88 +1,6 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { n as nameOnlySchema } from './billing-form-schema.js';
-import { W as billingForm } from './parts.js';
-import { F as FormController } from './form.js';
-import { S as StyledHost } from './styled-host.js';
-import './details.js';
-import './event-types.js';
-import './justifi-radio-list-item2.js';
-import { d as defineCustomElement$3 } from './custom-popper2.js';
-import { d as defineCustomElement$2 } from './form-control-text2.js';
-import { d as defineCustomElement$1 } from './form-control-tooltip2.js';
+import { B as BankAccountBillingFormSimple$1, d as defineCustomElement$1 } from './bank-account-billing-form-simple2.js';
 
-const BankAccountBillingFormSimple = /*@__PURE__*/ proxyCustomElement(class BankAccountBillingFormSimple extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.errors = {};
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-    }
-    componentWillLoad() {
-        this.formController = new FormController(nameOnlySchema());
-    }
-    componentDidLoad() {
-        this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
-        this.formController.errors.subscribe(errors => {
-            this.errors = Object.assign({}, errors);
-        });
-    }
-    async getValues() {
-        return this.formController.values.getValue();
-    }
-    async fill(fields) {
-        this.formController.setInitialValues(fields);
-    }
-    async validate() {
-        const isValid = await this.formController.validate();
-        const errors = this.formController.errors.getValue();
-        return { isValid, errors };
-    }
-    render() {
-        const billingFormDefaultValue = this.formController.getInitialValues();
-        return (h(StyledHost, { key: '1ad536d9f27bdb1cb3da9721c486cd4f1006ecb1' }, h("div", { key: 'b1589bbc4bba3703c54e6a5651aaad5499c218f4', part: billingForm, class: "mt-4" }, h("form", { key: 'd60bc906ec293d45c1887c0864ff4c1f28845461' }, h("fieldset", { key: '166465d844cbfb0d55dae03d88b52ad202d1616c' }, this.legend && (h("legend", { key: '509d5e560791fb6f96a5e755931fd7a363b21e06' }, this.legend)), h("div", { key: '979e4bae922ff88aae107d921136215474a847ea', class: "row gy-3" }, h("div", { key: '4014b6c65739d39077d69f0e649eec0fadab0c87', class: "col-12" }, h("form-control-text", { key: '2e9e1dbb43ffdd9848415ceefc8df75ec60a35e0', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler }))))))));
-    }
-}, [257, "justifi-bank-account-billing-form-simple", {
-        "legend": [1025],
-        "formController": [32],
-        "billingInfo": [32],
-        "errors": [32],
-        "getValues": [64],
-        "fill": [64],
-        "validate": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["justifi-bank-account-billing-form-simple", "custom-popper", "form-control-text", "form-control-tooltip"];
-    components.forEach(tagName => { switch (tagName) {
-        case "justifi-bank-account-billing-form-simple":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, BankAccountBillingFormSimple);
-            }
-            break;
-        case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "form-control-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "form-control-tooltip":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
+const BankAccountBillingFormSimple = BankAccountBillingFormSimple$1;
+const defineCustomElement = defineCustomElement$1;
 
-export { BankAccountBillingFormSimple as B, defineCustomElement as d };
+export { BankAccountBillingFormSimple, defineCustomElement };

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

@@ -0,0 +1,91 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { n as nameOnlySchema } from './billing-form-schema.js';
+import { w as billingForm } from './parts.js';
+import { F as FormController } from './form.js';
+import { c as checkoutStore, o as onChange } from './checkout.store.js';
+import { d as defineCustomElement$3 } from './custom-popper2.js';
+import { d as defineCustomElement$2 } from './form-control-text2.js';
+import { d as defineCustomElement$1 } from './form-control-tooltip2.js';
+
+const BankAccountBillingFormSimple = /*@__PURE__*/ proxyCustomElement(class BankAccountBillingFormSimple extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.errors = {};
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
+    }
+    componentWillLoad() {
+        this.formController = new FormController(nameOnlySchema());
+        const fields = checkoutStore.billingFormFields;
+        if (fields && Object.keys(fields).some((k) => fields[k])) {
+            this.formController.setInitialValues(fields);
+        }
+    }
+    componentDidLoad() {
+        this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
+        this.unsubscribeFromStore = onChange('billingFormFields', (newValue) => {
+            this.formController.setInitialValues(newValue);
+        });
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.unsubscribeFromStore) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    async getValues() {
+        return this.formController.values.getValue();
+    }
+    async validate() {
+        const isValid = await this.formController.validate();
+        const errors = this.formController.errors.getValue();
+        return { isValid, errors };
+    }
+    render() {
+        const billingFormDefaultValue = this.formController.getInitialValues();
+        return (h("div", { key: 'e8c53c98793d0296d69799c8449d762084d9859b', part: billingForm, class: "mt-4" }, h("form", { key: '83e59bb7bdcf4a3e0b4ed4320358796eae91726f' }, h("fieldset", { key: 'd92a4a02c531a08a270562701bc71440add5b545' }, this.legend && (h("legend", { key: '74ac1eb2c6fc629323f31be515e3aa204ae302a2' }, this.legend)), h("div", { key: '161888eb0680a4c9d6280440961f2926b08ac1ed', class: "row gy-3" }, h("div", { key: '9f6c899b7a4ff25a5eba5278bffe7d4e86eb00df', class: "col-12" }, h("form-control-text", { key: '74a9958fb74de730067fe4d87dfac33c12522169', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })))))));
+    }
+}, [256, "bank-account-billing-form-simple", {
+        "legend": [1025],
+        "formController": [32],
+        "billingInfo": [32],
+        "errors": [32],
+        "getValues": [64],
+        "validate": [64]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["bank-account-billing-form-simple", "custom-popper", "form-control-text", "form-control-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "bank-account-billing-form-simple":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BankAccountBillingFormSimple);
+            }
+            break;
+        case "custom-popper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "form-control-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "form-control-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { BankAccountBillingFormSimple as B, defineCustomElement as d };

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

@@ -1,4 +1,4 @@
-import { B as BankAccountDocumentFormInputs$1, d as defineCustomElement$1 } from './bank-account-document-inputs.js';
+import { B as BankAccountDocumentFormInputs$1, d as defineCustomElement$1 } from './bank-account-document-form-inputs2.js';
 
 const BankAccountDocumentFormInputs = BankAccountDocumentFormInputs$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/module/{bank-account-document-inputs.js → bank-account-document-form-inputs2.js}

@@ -17,7 +17,7 @@ const BankAccountDocumentFormInputs = /*@__PURE__*/ proxyCustomElement(class Ban
         }
     }
     render() {
-        return (h("div", { key: '7f9ea576aad16f3c2ea45c987a38878ea65f2df2', class: "row gy-3" }, h("div", { key: '316fe3f20df7c7dce2b8903e6073e0fe7920e5e8', class: "col-12" }, h("form-control-file", { key: '320d6b7f3de2cfeeb30eb1e08ca4122123854ffd', name: "voided_check", label: "Voided Check", documentType: EntityDocumentType.voidedCheck, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["voided_check"], multiple: true })), h("div", { key: 'f33a936c61c14c701e40d375e4dfc4c554b8293c', class: "col-12" }, h("form-control-file", { key: '1e160d8211a71175d6a45b10590fb2c8774f61e1', name: "bank_statement", label: "Bank Statement", documentType: EntityDocumentType.bankStatement, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["bank_statement"], multiple: true }))));
+        return (h("div", { key: '21704b76489b20612c7cdd58c88eece76b22eedc', class: "row gy-3" }, h("div", { key: '2ce2b542e045ab94cb09a15edd6f5856f94568b4', class: "col-12" }, h("form-control-file", { key: '5c00356384dc5c25005d90c40ccb9c0958f927da', name: "voided_check", label: "Voided Check", documentType: EntityDocumentType.voidedCheck, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["voided_check"], multiple: true })), h("div", { key: '7736a13bf2055c797168260e3d8e3feb99f931d0', class: "col-12" }, h("form-control-file", { key: '14cc4abc95227840de14c5f4278b668fc759469e', name: "bank_statement", label: "Bank Statement", documentType: EntityDocumentType.bankStatement, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors["bank_statement"], multiple: true }))));
     }
 }, [256, "bank-account-document-form-inputs", {
         "inputHandler": [16],

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

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { b as bankAccountTypeOptions } from './business-form-options.js';
+import { a as bankAccountTypeOptions } from './business-form-options.js';
 import './event-types2.js';
-import { n as numberOnlyHandler } from './utils3.js';
+import { n as numberOnlyHandler } from './utils4.js';
 import { d as defineCustomElement$5 } from './bank-account-read-only-value2.js';
 import { d as defineCustomElement$4 } from './custom-popper2.js';
 import { d as defineCustomElement$3 } from './form-control-select2.js';
@@ -17,7 +17,7 @@ const BankAccountFormInputsCanada = /*@__PURE__*/ proxyCustomElement(class BankA
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g;
-        return (h("div", { key: '34cbf10449df73748095fd7122d0ae1355a83e13', class: "row gy-3" }, h("div", { key: '607cc5cbc70fdd2d5a325bef7002a44740394282', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Bank Name", value: (_a = this.defaultValue) === null || _a === void 0 ? void 0 : _a.bank_name })) : (h("form-control-text", { name: "bank_name", label: "Bank Name", defaultValue: this.defaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler }))), h("div", { key: 'f57f4cd733f2dd439d6d83f32078371618f5fa06', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Nickname", value: (_b = this.defaultValue) === null || _b === void 0 ? void 0 : _b.nickname })) : (h("form-control-text", { name: "nickname", label: "Nickname", defaultValue: this.defaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler }))), h("div", { key: 'b92dface0116321ea990bfcaf1b036b5629385db', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Owner Name", value: (_c = this.defaultValue) === null || _c === void 0 ? void 0 : _c.account_owner_name })) : (h("form-control-text", { name: "account_owner_name", label: "Account Owner Name", defaultValue: this.defaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler }))), h("div", { key: '45d68efa47de76ee420cedfb97e82f498a2de97b', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Type", value: (_d = this.defaultValue) === null || _d === void 0 ? void 0 : _d.account_type })) : (h("form-control-select", { name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: this.defaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler }))), h("div", { key: '8419925e8470d63d506e1f7e82ccdf1a1132ecc0', class: "col-3" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Transit Number", value: ((_e = this.defaultValue) === null || _e === void 0 ? void 0 : _e.transit_number) || '' })) : (h("form-control-text", { name: "transit_number", label: "Transit Number", defaultValue: this.defaultValue.transit_number, maxLength: 5, errorText: this.errors.transit_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "5 digits" }))), h("div", { key: 'aa6e83c409e0cf93f1903394f63c0b719ec8808e', class: "col-3" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Institution Number", value: ((_f = this.defaultValue) === null || _f === void 0 ? void 0 : _f.institution_number) || '' })) : (h("form-control-text", { name: "institution_number", label: "Institution Number", defaultValue: this.defaultValue.institution_number, maxLength: 3, errorText: this.errors.institution_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "3 digits" }))), h("div", { key: '029058c023daca9d0488f45478af6edafe359df7', class: "col-6" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Number", value: ((_g = this.defaultValue) === null || _g === void 0 ? void 0 : _g.account_number_last4) ? `**** ${this.defaultValue.account_number_last4}` : '' })) : (h("form-control-text", { name: "account_number", label: "Account Number", defaultValue: this.defaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "Please copy the account number as shown on your statement. Do not include spaces or dashes." })))));
+        return (h("div", { key: '9c6cd8a4758f33bfa57f8db04ab69739ddbe47fa', class: "row gy-3" }, h("div", { key: '7d59df10771a07fcf04ab4ca80e0a8da15d76ec0', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Bank Name", value: (_a = this.defaultValue) === null || _a === void 0 ? void 0 : _a.bank_name })) : (h("form-control-text", { name: "bank_name", label: "Bank Name", defaultValue: this.defaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler }))), h("div", { key: 'ab2d9643d66bd7ad481190a731e7f1d44daeaf35', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Nickname", value: (_b = this.defaultValue) === null || _b === void 0 ? void 0 : _b.nickname })) : (h("form-control-text", { name: "nickname", label: "Nickname", defaultValue: this.defaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler }))), h("div", { key: '5a61a86d9f9170ab19adec07fe2e86951c3579d8', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Owner Name", value: (_c = this.defaultValue) === null || _c === void 0 ? void 0 : _c.account_owner_name })) : (h("form-control-text", { name: "account_owner_name", label: "Account Owner Name", defaultValue: this.defaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler }))), h("div", { key: '415209fa3008a1cb3e690d5638aae25b2d5bc627', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Type", value: (_d = this.defaultValue) === null || _d === void 0 ? void 0 : _d.account_type })) : (h("form-control-select", { name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: this.defaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler }))), h("div", { key: 'b026df714d79815dd93906f7cff0f875d4d43216', class: "col-3" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Transit Number", value: ((_e = this.defaultValue) === null || _e === void 0 ? void 0 : _e.transit_number) || '' })) : (h("form-control-text", { name: "transit_number", label: "Transit Number", defaultValue: this.defaultValue.transit_number, maxLength: 5, errorText: this.errors.transit_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "5 digits" }))), h("div", { key: '9ebdf63a1330f891556fa0b8ca4c76705f9671ea', class: "col-3" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Institution Number", value: ((_f = this.defaultValue) === null || _f === void 0 ? void 0 : _f.institution_number) || '' })) : (h("form-control-text", { name: "institution_number", label: "Institution Number", defaultValue: this.defaultValue.institution_number, maxLength: 3, errorText: this.errors.institution_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "3 digits" }))), h("div", { key: '4735d605033bd646088b8701508000376cc690f3', class: "col-6" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Number", value: ((_g = this.defaultValue) === null || _g === void 0 ? void 0 : _g.account_number_last4) ? `**** ${this.defaultValue.account_number_last4}` : '' })) : (h("form-control-text", { name: "account_number", label: "Account Number", defaultValue: this.defaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "Please copy the account number as shown on your statement. Do not include spaces or dashes." })))));
     }
 }, [256, "bank-account-form-inputs-canada", {
         "defaultValue": [8, "default-value"],

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

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { b as bankAccountTypeOptions } from './business-form-options.js';
+import { a as bankAccountTypeOptions } from './business-form-options.js';
 import './event-types2.js';
-import { n as numberOnlyHandler } from './utils3.js';
+import { n as numberOnlyHandler } from './utils4.js';
 import { d as defineCustomElement$5 } from './bank-account-read-only-value2.js';
 import { d as defineCustomElement$4 } from './custom-popper2.js';
 import { d as defineCustomElement$3 } from './form-control-select2.js';
@@ -17,7 +17,7 @@ const BankAccountFormInputs = /*@__PURE__*/ proxyCustomElement(class BankAccount
     }
     render() {
         var _a, _b, _c, _d, _e, _f;
-        return (h("div", { key: '5dc7139f54d11979410d0d67ca29e65b02f30200', class: "row gy-3" }, h("div", { key: '118f15bf02855b24baec5ce2a2c3cf5b241b3da4', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Bank Name", value: (_a = this.defaultValue) === null || _a === void 0 ? void 0 : _a.bank_name })) : (h("form-control-text", { name: "bank_name", label: "Bank Name", defaultValue: this.defaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler }))), h("div", { key: 'db03eccee03ec4b7d0de637306315982a2cd770d', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Nickname", value: (_b = this.defaultValue) === null || _b === void 0 ? void 0 : _b.nickname })) : (h("form-control-text", { name: "nickname", label: "Nickname", defaultValue: this.defaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler }))), h("div", { key: '217120e0052b8ee41cac8f901ac4d9742b0c6ea9', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Owner Name", value: (_c = this.defaultValue) === null || _c === void 0 ? void 0 : _c.account_owner_name })) : (h("form-control-text", { name: "account_owner_name", label: "Account Owner Name", defaultValue: this.defaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler }))), h("div", { key: 'f589511545d6262966a6fa2888cb78babacfb770', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Type", value: (_d = this.defaultValue) === null || _d === void 0 ? void 0 : _d.account_type })) : (h("form-control-select", { name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: this.defaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler }))), h("div", { key: '24df83bb2666cee381c266608c43f3fd729db4cf', class: "col-6" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Number", value: ((_e = this.defaultValue) === null || _e === void 0 ? void 0 : _e.account_number_last4) ? `**** ${this.defaultValue.account_number_last4}` : '' })) : (h("form-control-text", { name: "account_number", label: "Account Number", defaultValue: this.defaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "Please copy the account number as shown on your statement/check. Do not include spaces or dashes." }))), h("div", { key: '75fe11d71e57707d088f8a90a250621fce82647f', class: "col-6" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Routing Number", value: ((_f = this.defaultValue) === null || _f === void 0 ? void 0 : _f.routing_number) || '' })) : (h("form-control-text", { name: "routing_number", label: "Routing Number", defaultValue: this.defaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "A valid routing number is nine digits. Please include any leading or trailing zeroes." })))));
+        return (h("div", { key: '99049fb4516527dfa898467b2bb990e408a41af5', class: "row gy-3" }, h("div", { key: '84f1acf2f116b9835642825cecd5acbce8a33b59', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Bank Name", value: (_a = this.defaultValue) === null || _a === void 0 ? void 0 : _a.bank_name })) : (h("form-control-text", { name: "bank_name", label: "Bank Name", defaultValue: this.defaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler }))), h("div", { key: '53e7f5892b460196d73eff31f1549e144b919935', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Nickname", value: (_b = this.defaultValue) === null || _b === void 0 ? void 0 : _b.nickname })) : (h("form-control-text", { name: "nickname", label: "Nickname", defaultValue: this.defaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler }))), h("div", { key: '07738bf8baacf5e0b5f336cfbd2a527423293de1', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Owner Name", value: (_c = this.defaultValue) === null || _c === void 0 ? void 0 : _c.account_owner_name })) : (h("form-control-text", { name: "account_owner_name", label: "Account Owner Name", defaultValue: this.defaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler }))), h("div", { key: '4f616bad64f7f3c5cb81bbc17bb0c04b3090e1f3', class: "col-12" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Type", value: (_d = this.defaultValue) === null || _d === void 0 ? void 0 : _d.account_type })) : (h("form-control-select", { name: "account_type", label: "Account Type", options: bankAccountTypeOptions, defaultValue: this.defaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler }))), h("div", { key: 'cb7294a8009929a7ff9c3a540ddfc82175845f07', class: "col-6" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Account Number", value: ((_e = this.defaultValue) === null || _e === void 0 ? void 0 : _e.account_number_last4) ? `**** ${this.defaultValue.account_number_last4}` : '' })) : (h("form-control-text", { name: "account_number", label: "Account Number", defaultValue: this.defaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "Please copy the account number as shown on your statement/check. Do not include spaces or dashes." }))), h("div", { key: '94a1ed2a323c53eb911126aed75300df5883165c', class: "col-6" }, this.formDisabled ? (h("bank-account-read-only-value", { label: "Routing Number", value: ((_f = this.defaultValue) === null || _f === void 0 ? void 0 : _f.routing_number) || '' })) : (h("form-control-text", { name: "routing_number", label: "Routing Number", defaultValue: this.defaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: numberOnlyHandler, helpText: "A valid routing number is nine digits. Please include any leading or trailing zeroes." })))));
     }
 }, [256, "bank-account-form-inputs", {
         "defaultValue": [8, "default-value"],