@justifi/webcomponents 6.10.2 → 6.10.4

package/dist/esm/checkouts-list-core.entry.js

@@ -6,15 +6,15 @@ import './Plaid-Cmyilr-q.js';
 import { p as pagingDefaults } from './Pagination-CLHwhyvu.js';
 import './Business-BcNb9bVO.js';
 import './Dispute-BH0Xfn-F.js';
-import { T as Table, a as TableComponent, b as TableHead, c as TableHeadRow, d as TableBody, e as TableLoadingState, f as TableEmptyState, g as TableErrorState, h as TableRow, i as TableFoot, j as TableFootRow, k as TableFootCell, l as TableWrapper } from './table-hHARNoRM.js';
+import { T as Table, a as TableComponent, b as TableHead, c as TableHeadRow, d as TableBody, e as TableLoadingState, f as TableEmptyState, g as TableErrorState, h as TableRow, i as TableFoot, j as TableFootRow, k as TableFootCell, l as TableWrapper } from './table-BwxLvetJ.js';
 import { T as TableClickActions } from './event-types-CZfYo5-1.js';
-import { c as checkoutTableColumns, a as checkoutTableCells } from './checkouts-table-C5aYyqpX.js';
+import { c as checkoutTableColumns, a as checkoutTableCells } from './checkouts-table-XjFiAWCw.js';
 import { o as onQueryParamsChange, g as getRequestParams } from './checkouts-list-params-state-CiGfmyWW.js';
 import './index-cDVGjRkU.js';
 import './utils-7bp92NC7.js';
-import './parts-C4FLe2pT.js';
-import './spinner-BfjGGaND.js';
-import './badge-AZ7Z3PKH.js';
+import './parts-c8J1gsDg.js';
+import './spinner-DQpyMqKv.js';
+import './badge-BfWXAKIJ.js';
 
 const CheckoutsListCore = class {
     constructor(hostRef) {

package/dist/esm/{checkouts-table-C5aYyqpX.js → checkouts-table-XjFiAWCw.js}

@@ -1,7 +1,7 @@
 import { h } from './index-CV0Pyo1O.js';
 import { d as formatTime, e as formatDate } from './utils-7bp92NC7.js';
-import { B as BadgeVariant, a as Badge } from './badge-AZ7Z3PKH.js';
-import { V as tableHeadCell, W as getAlternateTableCellPart } from './parts-C4FLe2pT.js';
+import { B as BadgeVariant, a as Badge } from './badge-BfWXAKIJ.js';
+import { V as tableHeadCell, W as getAlternateTableCellPart } from './parts-c8J1gsDg.js';
 
 const MapCheckoutStatusToBadge = (status) => {
     const statusToBadgeProps = {

package/dist/esm/custom-popper_2.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-CV0Pyo1O.js';
-import { aH as tooltip, aI as tooltipInner, aJ as tooltipIcon } from './parts-C4FLe2pT.js';
+import { aP as tooltip, aQ as tooltipInner, aR as tooltipIcon } from './parts-c8J1gsDg.js';
 
 var top = 'top';
 var bottom = 'bottom';

package/dist/esm/form-alert_5.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-CV0Pyo1O.js';
-import { aF as alertDanger, J as heading2, $ as label, Y as inputDisabled, am as buttonSecondary } from './parts-C4FLe2pT.js';
+import { aN as alertDanger, J as heading2, $ as label, Y as inputDisabled, au as buttonSecondary } from './parts-c8J1gsDg.js';
 import { b as businessServiceReceivedOptions, r as recurringPaymentsOptions, s as seasonalBusinessOptions, c as businessClassificationOptions } from './business-form-options-DRalxlqN.js';
 import { C as CURRENCY_MASK, I as IDENTITY_MASKS, P as PHONE_MASKS } from './form-input-masks-CVaOFfrI.js';
 import { e as CoreBusinessInfo, d as deconstructDate } from './Business-BcNb9bVO.js';

package/dist/esm/form-control-checkbox.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CV0Pyo1O.js';
-import { a7 as inputCheckboxInvalid, a8 as inputCheckboxCheckedFocused, a9 as inputCheckboxFocused, aa as inputCheckboxChecked, ab as inputCheckbox, $ as label } from './parts-C4FLe2pT.js';
-import { F as FormControlHelpText } from './form-control-help-text-Dgnv4IId.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
+import { a7 as inputCheckboxInvalid, a8 as inputCheckboxCheckedFocused, a9 as inputCheckboxFocused, aa as inputCheckboxChecked, ab as inputCheckbox, $ as label } from './parts-c8J1gsDg.js';
+import { F as FormControlHelpText } from './form-control-help-text-XuRclELV.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
 import './event-types-CZfYo5-1.js';
 
 const CheckboxInput = class {

package/dist/esm/form-control-date.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CV0Pyo1O.js';
-import { _ as input, $ as label, X as inputInvalid, Y as inputDisabled, Z as inputFocused } from './parts-C4FLe2pT.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
+import { _ as input, $ as label, X as inputInvalid, Y as inputDisabled, Z as inputFocused } from './parts-c8J1gsDg.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
 import './event-types-CZfYo5-1.js';
 
 const DateInput = class {

package/dist/esm/{form-control-error-text-xEskXF-M.js → form-control-error-text-D5B0Wy4Q.js}

@@ -1,5 +1,5 @@
 import { h } from './index-CV0Pyo1O.js';
-import { a1 as textDanger } from './parts-C4FLe2pT.js';
+import { a1 as textDanger } from './parts-c8J1gsDg.js';
 
 const FormControlErrorText = (props) => {
     const { errorText, name } = props;

package/dist/esm/form-control-file-v2_2.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CV0Pyo1O.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
-import { ar as inputInvalidAndFocused, X as inputInvalid, Z as inputFocused, Y as inputDisabled, _ as input, $ as label } from './parts-C4FLe2pT.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
+import { az as inputInvalidAndFocused, X as inputInvalid, Z as inputFocused, Y as inputDisabled, _ as input, $ as label } from './parts-c8J1gsDg.js';
 
 const FileInput = class {
     constructor(hostRef) {

package/dist/esm/{form-control-help-text-Dgnv4IId.js → form-control-help-text-XuRclELV.js}

@@ -1,5 +1,5 @@
 import { h } from './index-CV0Pyo1O.js';
-import { H as text } from './parts-C4FLe2pT.js';
+import { H as text } from './parts-c8J1gsDg.js';
 
 const FormControlHelpText = (props) => {
     const { helpText, name } = props;

package/dist/esm/form-control-monetary-provisioning.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CV0Pyo1O.js';
 import { I as IMask } from './index-Ce_F4E0f.js';
 import { C as CURRENCY_MASK } from './form-input-masks-CVaOFfrI.js';
-import { a6 as inputGroup, $ as label, a0 as inputAdornment, X as inputInvalid, Y as inputDisabled, Z as inputFocused } from './parts-C4FLe2pT.js';
-import { F as FormControlHelpText } from './form-control-help-text-Dgnv4IId.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
+import { a6 as inputGroup, $ as label, a0 as inputAdornment, X as inputInvalid, Y as inputDisabled, Z as inputFocused } from './parts-c8J1gsDg.js';
+import { F as FormControlHelpText } from './form-control-help-text-XuRclELV.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
 import './event-types-CZfYo5-1.js';
 
 const MonetaryInputProvisioning = class {

package/dist/esm/form-control-monetary.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CV0Pyo1O.js';
-import { X as inputInvalid, Y as inputDisabled, Z as inputFocused, _ as input, $ as label, a0 as inputAdornment } from './parts-C4FLe2pT.js';
-import { F as FormControlHelpText } from './form-control-help-text-Dgnv4IId.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
+import { X as inputInvalid, Y as inputDisabled, Z as inputFocused, _ as input, $ as label, a0 as inputAdornment } from './parts-c8J1gsDg.js';
+import { F as FormControlHelpText } from './form-control-help-text-XuRclELV.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
 import './event-types-CZfYo5-1.js';
 import { f as formatCurrency } from './utils-7bp92NC7.js';
 import './dinero-HXpYMWUU.js';

package/dist/esm/form-control-number-masked_3.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CV0Pyo1O.js';
 import { I as IMask } from './index-Ce_F4E0f.js';
-import { X as inputInvalid, Y as inputDisabled, Z as inputFocused, _ as input, $ as label } from './parts-C4FLe2pT.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
+import { X as inputInvalid, Y as inputDisabled, Z as inputFocused, _ as input, $ as label } from './parts-c8J1gsDg.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
 import './event-types-CZfYo5-1.js';
 import { C as CountryCode } from './Business-BcNb9bVO.js';
 import { n as numberOnlyHandler } from './utils-BnjCmwMr.js';

package/dist/esm/form-control-number_3.entry.js

@@ -1,12 +1,12 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CV0Pyo1O.js';
-import { ar as inputInvalidAndFocused, Z as inputFocused, X as inputInvalid, _ as input, $ as label, a2 as heading3, Y as inputDisabled, am as buttonSecondary } from './parts-C4FLe2pT.js';
-import { F as FormControlHelpText } from './form-control-help-text-Dgnv4IId.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
+import { az as inputInvalidAndFocused, Z as inputFocused, X as inputInvalid, _ as input, $ as label, a2 as heading3, Y as inputDisabled, au as buttonSecondary } from './parts-c8J1gsDg.js';
+import { F as FormControlHelpText } from './form-control-help-text-XuRclELV.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
 import './event-types-CZfYo5-1.js';
 import { F as FormController } from './index.esm-BHdVU4hV.js';
 import { O as Owner } from './Business-BcNb9bVO.js';
 import { d as identitySchemaByCountry } from './business-identity-schema-CFhSc0cA.js';
-import { B as Button } from './button-DOkTCYSa.js';
+import { B as Button } from './button-DoF-zpiW.js';
 import { B as BusinessFormClickActions } from './event-types-XYgDHrVL.js';
 import { I as IDENTITY_MASKS, P as PHONE_MASKS } from './form-input-masks-CVaOFfrI.js';
 import { u as updateFormValues, a as updateAddressFormValues, b as updateDateOfBirthFormValues } from './input-handlers-1lVyzImK.js';

package/dist/esm/form-control-radio.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CV0Pyo1O.js';
-import { ac as inputRadioInvalid, ad as inputRadioCheckedFocused, ae as inputRadioChecked, af as inputRadioFocused, ag as inputRadio, $ as label } from './parts-C4FLe2pT.js';
+import { ac as inputRadioInvalid, ad as inputRadioCheckedFocused, ae as inputRadioChecked, af as inputRadioFocused, ag as inputRadio, $ as label } from './parts-c8J1gsDg.js';
 
 const RadioInput = class {
     constructor(hostRef) {

package/dist/esm/form-control-select_2.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CV0Pyo1O.js';
-import { _ as input, $ as label, X as inputInvalid, Y as inputDisabled, Z as inputFocused } from './parts-C4FLe2pT.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
+import { _ as input, $ as label, X as inputInvalid, Y as inputDisabled, Z as inputFocused } from './parts-c8J1gsDg.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
 import './event-types-CZfYo5-1.js';
 
 const SelectInput = class {

package/dist/esm/gross-payment-chart-core.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CV0Pyo1O.js';
 import { f as formatCurrency, m as formatDisplayDate } from './utils-7bp92NC7.js';
-import { E as ErrorState } from './utils-BSpK1eMX.js';
-import { S as Spinner } from './spinner-BfjGGaND.js';
+import { E as ErrorState } from './utils-BGbtbDiV.js';
+import { S as Spinner } from './spinner-DQpyMqKv.js';
 import './dinero-HXpYMWUU.js';
-import './parts-C4FLe2pT.js';
+import './parts-c8J1gsDg.js';
 
 /*!
  * @kurkle/color v0.3.4

package/dist/esm/{header-1-xlSavD5o.js → header-1-BIaO3iDb.js}

@@ -1,5 +1,5 @@
 import { h } from './index-CV0Pyo1O.js';
-import { I as heading1 } from './parts-C4FLe2pT.js';
+import { I as heading1 } from './parts-c8J1gsDg.js';
 
 const Header1 = (props) => {
     return h("h1", { class: `header-1 ${props === null || props === void 0 ? void 0 : props.class}`, part: heading1 }, props.text);

package/dist/esm/{header-3-egutsoDI.js → header-3-UswhFvUr.js}

@@ -1,5 +1,5 @@
 import { h } from './index-CV0Pyo1O.js';
-import { a2 as heading3 } from './parts-C4FLe2pT.js';
+import { a2 as heading3 } from './parts-c8J1gsDg.js';
 
 const Header3 = (props) => {
     return h("h3", { class: `header-3 ${props === null || props === void 0 ? void 0 : props.class}`, part: heading3 }, props.text);

package/dist/esm/hidden-input_2.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-CV0Pyo1O.js';
 import { c as createStore } from './index-cDVGjRkU.js';
-import { ar as inputInvalidAndFocused, X as inputInvalid, Z as inputFocused, _ as input, $ as label } from './parts-C4FLe2pT.js';
+import { az as inputInvalidAndFocused, X as inputInvalid, Z as inputFocused, _ as input, $ as label } from './parts-c8J1gsDg.js';
 import { g as getDefaultExportFromCjs } from './_commonjsHelpers-BFTU3MAI.js';
-import { F as FormControlErrorText } from './form-control-error-text-xEskXF-M.js';
-import { p as packageJson } from './package-Bjv3eJBk.js';
+import { F as FormControlErrorText } from './form-control-error-text-D5B0Wy4Q.js';
+import { p as packageJson } from './package-Cc6518FT.js';
 
 const iframeInputStylesStore = createStore({
     focused: {

package/dist/esm/{insurance-state-jZTKdt60.js → insurance-state-MpA7uaXF.js}

@@ -1,5 +1,5 @@
 import { h } from './index-CV0Pyo1O.js';
-import { J as heading2 } from './parts-C4FLe2pT.js';
+import { J as heading2 } from './parts-c8J1gsDg.js';
 import { c as createStore } from './index-cDVGjRkU.js';
 
 const Header2 = (props) => {

package/dist/esm/internal-tokenize-payment-method_7.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, g as getElement, H as Host } from './index-CV0Pyo1O.js';
 import { S as StyledHost } from './styled-host-D6byRazK.js';
 import './event-types-CZfYo5-1.js';
-import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-BVLXSZXz.js';
+import { c as checkPkgVersion, J as JustifiAnalytics } from './check-pkg-version-QOngucT4.js';
 import { w as waitForConfig, c as configState } from './config-state-kKn89dp1.js';
 import './dinero-HXpYMWUU.js';
 import { a as ComponentErrorCodes, C as ComponentErrorSeverity } from './ComponentError-Cjcsf8ku.js';
@@ -11,11 +11,11 @@ import './Business-BcNb9bVO.js';
 import './Dispute-BH0Xfn-F.js';
 import { c as checkoutStore } from './checkout.store-iNkW80yV.js';
 import { P as PAYMENT_METHODS } from './index-DkoufM1t.js';
-import { S as Skeleton } from './skeleton-C162KC3u.js';
+import { S as Skeleton } from './skeleton-DzBAY0bs.js';
 import { b as generateTabId } from './utils-7bp92NC7.js';
-import { B as Button } from './button-DOkTCYSa.js';
-import { u as radioListItem } from './parts-C4FLe2pT.js';
-import './package-Bjv3eJBk.js';
+import { B as Button } from './button-DoF-zpiW.js';
+import { u as radioListItem } from './parts-c8J1gsDg.js';
+import './package-Cc6518FT.js';
 import './Api-CLZVsXZg.js';
 import './index-cDVGjRkU.js';
 

package/dist/esm/justifi-additional-questions-form-step_9.entry.js

@@ -6,8 +6,8 @@ import { a as additionalQuestionsSchema, c as businessCoreInfoSchemaCAN, b as bu
 import { F as FormController, c as create$3, a as create$6, b as create$8, d as create$7 } from './index.esm-BHdVU4hV.js';
 import { A as AdditionalQuestions, C as CountryCode, e as CoreBusinessInfo, R as Representative, f as Address } from './Business-BcNb9bVO.js';
 import { C as CURRENCY_MASK, P as PHONE_MASKS } from './form-input-masks-CVaOFfrI.js';
-import { J as heading2, a4 as buttonLink, am as buttonSecondary, $ as label, Y as inputDisabled, aG as alert } from './parts-C4FLe2pT.js';
-import { P as PaymentProvisioningLoading } from './payment-provisioning-loading-D_VKtlLm.js';
+import { J as heading2, au as buttonSecondary, a4 as buttonLink, $ as label, Y as inputDisabled, aO as alert } from './parts-c8J1gsDg.js';
+import { P as PaymentProvisioningLoading } from './payment-provisioning-loading-DRFgrvp1.js';
 import { b as businessServiceReceivedOptions, c as businessClassificationOptions } from './business-form-options-DRalxlqN.js';
 import { a as BusinessFormStep, B as BusinessFormClickActions } from './event-types-XYgDHrVL.js';
 import './config-state-kKn89dp1.js';
@@ -16,14 +16,14 @@ import { E as EntityDocumentType, p as EntityDocumentStorage, q as EntityDocumen
 import './Pagination-CLHwhyvu.js';
 import './Dispute-BH0Xfn-F.js';
 import { A as accountNumberValidation, B as accountTypeValidation, v as identityNameValidation, C as nicknameValidation, D as bankNameValidation, E as numbersOnlyRegex, F as routingNumberValidation } from './schema-validations-v6WGlZkq.js';
-import { B as Button } from './button-DOkTCYSa.js';
+import { B as Button } from './button-DoF-zpiW.js';
 import './event-types-CZfYo5-1.js';
 import { c as countryLabels } from './country-config-P042rrI3.js';
 import { d as identitySchemaByCountry, e as addressSchemaByCountry } from './business-identity-schema-CFhSc0cA.js';
 import { A as Api } from './Api-CLZVsXZg.js';
 import './utils-BeQLScSm.js';
 import './_commonjsHelpers-BFTU3MAI.js';
-import './skeleton-C162KC3u.js';
+import './skeleton-DzBAY0bs.js';
 import './index-cDVGjRkU.js';
 import './utils-7bp92NC7.js';
 
@@ -280,22 +280,20 @@ const BusinessBankAccountFormStep = class {
         this.existingDocuments = [];
         this.documentData = new EntityDocumentStorage();
         this.isLoading = false;
-        this.isAddingNewBankAccount = true;
+        this.viewMode = 'manual';
         this.bankAccountVerification = false;
         this.platformAccountId = null;
-        this.usePlaidVerification = true;
         this.getSchema = () => {
             const schema = bankAccountSchemaByCountry[this.country];
             return schema(this.allowOptionalFields, this.existingDocuments);
         };
         this.initializeFormController = () => {
             this.formController = new FormController(this.getSchema());
-            if (this.isAddingNewBankAccount) {
-                // Clear form when adding a new bank account
-                this.formController.setInitialValues({ business_id: this.businessId });
+            if (this.viewMode === 'readonly') {
+                this.formController.setInitialValues(Object.assign({}, this.bankAccount));
             }
             else {
-                this.formController.setInitialValues(Object.assign({}, this.bankAccount));
+                this.formController.setInitialValues({ business_id: this.businessId });
             }
             this.formController.errors.subscribe(errors => {
                 this.errors = Object.assign({}, errors);
@@ -314,20 +312,8 @@ const BusinessBankAccountFormStep = class {
             this.isLoading = true;
             this.getBusiness({
                 onSuccess: (response) => {
-                    if (response.data.bank_accounts.length > 0) {
-                        // Get the latest bank account (last in array)
-                        const bankAccounts = response.data.bank_accounts;
-                        const latestBankAccount = bankAccounts[bankAccounts.length - 1];
-                        this.bankAccount = new BankAccount(latestBankAccount);
-                        this.isAddingNewBankAccount = false;
-                    }
-                    else {
-                        this.bankAccount = new BankAccount({});
-                        this.bankAccount.business_id = this.businessId;
-                    }
-                    this.existingDocuments = response.data.documents;
-                    this.bankAccountVerification = response.data.settings.bank_account_verification === true;
-                    this.platformAccountId = response.data.platform_account_id;
+                    this.processBusinessResponse(response.data);
+                    this.determineViewMode();
                 },
                 onError: ({ error, code, severity }) => {
                     this.errorEvent.emit({
@@ -343,24 +329,20 @@ const BusinessBankAccountFormStep = class {
             });
         };
         this.handleChangeBankAccount = () => {
-            this.isAddingNewBankAccount = true;
+            this.viewMode = this.plaidAvailable ? 'plaid' : 'manual';
             this.documentData = new EntityDocumentStorage();
-            // Reset to Plaid if available when changing bank account
-            this.usePlaidVerification = this.bankAccountVerification && !!this.platformAccountId;
             this.initializeFormController();
         };
         this.handleCancel = () => {
-            this.isAddingNewBankAccount = false;
+            this.viewMode = this.existingBankAccount ? 'readonly' : 'plaid';
             this.documentData = new EntityDocumentStorage();
-            // Reset toggle state when canceling
-            this.usePlaidVerification = true;
             this.initializeFormController();
         };
         this.handleToggleToManualEntry = () => {
-            this.usePlaidVerification = false;
+            this.viewMode = 'manual';
         };
         this.handleToggleToPlaidVerification = () => {
-            this.usePlaidVerification = true;
+            this.viewMode = 'plaid';
         };
         this.handleSaveBankAccount = async () => {
             this.formController.validateAndSubmit(() => {
@@ -437,12 +419,10 @@ const BusinessBankAccountFormStep = class {
         this.formLoading.emit(newValue);
     }
     async validateAndSubmit({ onSuccess }) {
-        if (this.existingBankAccount && !this.isAddingNewBankAccount) {
-            // If a bank account already exists and we're not adding a new one, skip bank account posting; proceed directly to document upload
+        if (this.viewMode === 'readonly') {
             this.sendData(onSuccess);
         }
         else {
-            // If bank account is new, validate form inputs (bank account fields), then proceed
             this.formController.validateAndSubmit(() => this.sendData(onSuccess));
         }
     }
@@ -491,24 +471,48 @@ const BusinessBankAccountFormStep = class {
         var _a;
         return !!((_a = this.bankAccount) === null || _a === void 0 ? void 0 : _a.id);
     }
-    get showReadOnlyView() {
-        return this.existingBankAccount && !this.isAddingNewBankAccount;
+    get plaidAvailable() {
+        return this.bankAccountVerification && !!this.platformAccountId;
+    }
+    get showCancel() {
+        return this.bankAccountVerification || this.existingBankAccount;
+    }
+    processBusinessResponse(data) {
+        const { bank_accounts, documents, settings, platform_account_id } = data;
+        if (bank_accounts.length > 0) {
+            this.bankAccount = new BankAccount(bank_accounts[bank_accounts.length - 1]);
+        }
+        else {
+            this.bankAccount = new BankAccount({});
+            this.bankAccount.business_id = this.businessId;
+        }
+        this.existingDocuments = documents;
+        this.bankAccountVerification = settings.bank_account_verification === true;
+        this.platformAccountId = platform_account_id;
+    }
+    determineViewMode() {
+        if (this.existingBankAccount) {
+            this.viewMode = 'readonly';
+        }
+        else if (this.plaidAvailable) {
+            this.viewMode = 'plaid';
+        }
+        else {
+            this.viewMode = 'manual';
+        }
     }
     async sendData(onSuccess) {
         try {
-            // Post bank account data if we're adding a new bank account
-            const bankAccountPosted = this.isAddingNewBankAccount ? await this.postBankAccountData() : true;
-            if (!bankAccountPosted) {
-                return;
+            if (this.viewMode === 'manual') {
+                const bankAccountPosted = await this.postBankAccountData();
+                if (!bankAccountPosted)
+                    return;
             }
-            // Post documents only after bank account was successfully created
             const documentsUploaded = await this.postBusinessDocuments();
-            if (!documentsUploaded) {
+            if (!documentsUploaded)
                 return;
-            }
-            // Refresh bank account data after successful save
-            if (this.isAddingNewBankAccount) {
-                this.isAddingNewBankAccount = false;
+            if (this.viewMode === 'manual') {
+                this.viewMode = 'readonly';
                 await this.refreshBankAccountData();
             }
             onSuccess();
@@ -553,17 +557,8 @@ const BusinessBankAccountFormStep = class {
             this.isLoading = true;
             this.getBusiness({
                 onSuccess: (response) => {
-                    const { data } = response;
-                    const { bank_accounts, documents, settings, platform_account_id } = data;
-                    if (bank_accounts.length > 0) {
-                        // Get the latest bank account (last in array)
-                        const bankAccounts = bank_accounts;
-                        const latestBankAccount = bankAccounts[bankAccounts.length - 1];
-                        this.bankAccount = new BankAccount(latestBankAccount);
-                    }
-                    this.existingDocuments = documents;
-                    this.bankAccountVerification = settings.bank_account_verification === true;
-                    this.platformAccountId = platform_account_id;
+                    this.processBusinessResponse(response.data);
+                    this.determineViewMode();
                     this.initializeFormController();
                 },
                 onError: ({ error, code, severity }) => {
@@ -601,17 +596,30 @@ const BusinessBankAccountFormStep = class {
             this.isLoading = false;
         }
     }
+    renderBankAccountInputs(disabled) {
+        const defaultValue = this.formController.getInitialValues();
+        return this.country === CountryCode.CAN ? (h("bank-account-form-inputs-canada", { defaultValue: defaultValue, errors: this.errors, inputHandler: this.inputHandler, formDisabled: disabled })) : (h("bank-account-form-inputs", { defaultValue: defaultValue, errors: this.errors, inputHandler: this.inputHandler, formDisabled: disabled }));
+    }
+    renderReadonlyView() {
+        return (h("div", null, this.renderBankAccountInputs(true), h("div", { class: "mt-3" }, h(Button, { variant: "secondary", type: "button", onClick: this.handleChangeBankAccount, disabled: this.isLoading, part: buttonSecondary }, "Change Bank Account"))));
+    }
+    renderPlaidView() {
+        return (h("div", { class: "mt-3" }, h("plaid-verification", { authToken: this.authToken, accountId: this.platformAccountId, businessId: this.businessId, onPlaidVerificationSuccess: () => {
+                this.viewMode = 'readonly';
+                this.refreshBankAccountData();
+            } }), h("div", { class: "mt-3" }, h(Button, { type: "button", variant: "link", className: "p-0", onClick: this.handleToggleToManualEntry, disabled: this.isLoading, part: buttonLink }, "Enter bank details manually (document upload required)"))));
+    }
+    renderManualEntryView() {
+        return (h("div", null, this.plaidAvailable && (h("div", { class: "mb-3" }, h(Button, { type: "button", variant: "secondary", onClick: this.handleToggleToPlaidVerification, disabled: this.isLoading, part: buttonSecondary }, "Link bank account with Plaid instead"))), this.renderBankAccountInputs(false), h("div", { class: "mt-3 d-flex gap-2" }, this.showCancel && (h(Button, { variant: "secondary", type: "button", onClick: this.handleCancel, disabled: this.isLoading, part: buttonSecondary }, "Cancel")), h(Button, { variant: "primary", type: "button", onClick: this.handleSaveBankAccount, disabled: this.isLoading, isLoading: this.isLoading }, "Save Bank Account"))));
+    }
+    renderDocumentUploads() {
+        return (h("fieldset", { class: "mt-4" }, h("div", { class: "d-flex align-items-center gap-2" }, h("legend", { class: "mb-0", part: heading2 }, "Document Uploads"), h("form-control-tooltip", { helpText: "One document (voided check or bank statement) is required for underwriting purposes. It needs to visibly show the name tied to the account and the account number. Various file formats such as PDF, DOC, DOCX, JPEG are accepted. Multiple files can be uploaded for each document category." })), h("hr", { class: "mt-2" }), h("business-documents-on-file", { documents: this.existingDocuments, isLoading: this.isLoading }), h("bank-account-document-form-inputs", { inputHandler: this.inputHandler, errors: this.errors, storeFiles: this.storeFiles })));
+    }
     render() {
-        const bankAccountDefaultValue = this.formController.getInitialValues();
-        const shouldShowPlaidVerification = this.bankAccountVerification && this.platformAccountId;
         if (this.isLoading) {
             return h(PaymentProvisioningLoading, null);
         }
-        return (h("form", null, h("fieldset", { class: "mb-4" }, h("div", { class: "d-flex align-items-center gap-2" }, h("legend", { class: "mb-0", part: heading2 }, "Bank Account Info"), h("form-control-tooltip", { helpText: "This direct deposit account is the designated bank account where incoming 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", { class: "mt-2" }), shouldShowPlaidVerification && this.usePlaidVerification && !this.showReadOnlyView && (h("div", { class: "mt-3" }, h("plaid-verification", { authToken: this.authToken, accountId: this.platformAccountId, businessId: this.businessId, onPlaidVerificationSuccess: () => {
-                // Refresh bank account data after successful Plaid verification
-                this.isAddingNewBankAccount = false;
-                this.refreshBankAccountData();
-            } }), h("div", { class: "mt-3" }, h(Button, { type: "button", variant: "link", onClick: this.handleToggleToManualEntry, disabled: this.isLoading, part: buttonLink }, "Enter bank details manually (document upload required)")))), (!this.usePlaidVerification || this.showReadOnlyView) && (h("div", null, shouldShowPlaidVerification && !this.usePlaidVerification && !this.showReadOnlyView && (h("div", { class: "mb-3" }, h(Button, { type: "button", variant: "secondary", onClick: this.handleToggleToPlaidVerification, disabled: this.isLoading, part: buttonSecondary }, "Link bank account with Plaid instead"))), this.country === CountryCode.CAN ? (h("bank-account-form-inputs-canada", { defaultValue: bankAccountDefaultValue, errors: this.errors, inputHandler: this.inputHandler, formDisabled: this.showReadOnlyView })) : (h("bank-account-form-inputs", { defaultValue: bankAccountDefaultValue, errors: this.errors, inputHandler: this.inputHandler, formDisabled: this.showReadOnlyView })))), this.showReadOnlyView && (h("div", { class: "mt-3" }, h(Button, { variant: "secondary", type: "button", onClick: this.handleChangeBankAccount, disabled: this.isLoading, part: buttonSecondary }, "Change Bank Account"))), (!this.existingBankAccount || this.isAddingNewBankAccount) && !this.usePlaidVerification && (h("div", { class: "mt-3 d-flex gap-2" }, this.isAddingNewBankAccount && (h(Button, { variant: "secondary", type: "button", onClick: this.handleCancel, disabled: this.isLoading, part: buttonSecondary }, "Cancel")), h(Button, { variant: "primary", type: "button", onClick: this.handleSaveBankAccount, disabled: this.isLoading, isLoading: this.isLoading }, "Save Bank Account")))), (!this.usePlaidVerification || this.showReadOnlyView) && (h("fieldset", { class: "mt-4" }, h("div", { class: "d-flex align-items-center gap-2" }, h("legend", { class: "mb-0", part: heading2 }, "Document Uploads"), h("form-control-tooltip", { helpText: "One document (voided check or bank statement) is required for underwriting purposes. It needs to visibly show the name tied to the account and the account number. Various file formats such as PDF, DOC, DOCX, JPEG are accepted. Multiple files can be uploaded for each document category." })), h("hr", { class: "mt-2" }), h("business-documents-on-file", { documents: this.existingDocuments, isLoading: this.isLoading }), h("bank-account-document-form-inputs", { inputHandler: this.inputHandler, errors: this.errors, storeFiles: this.storeFiles })))));
+        return (h("form", null, h("fieldset", { class: "mb-4" }, h("div", { class: "d-flex align-items-center gap-2" }, h("legend", { class: "mb-0", part: heading2 }, "Bank Account Info"), h("form-control-tooltip", { helpText: "This direct deposit account is the designated bank account where incoming 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", { class: "mt-2" }), this.viewMode === 'readonly' && this.renderReadonlyView(), this.viewMode === 'plaid' && this.renderPlaidView(), this.viewMode === 'manual' && this.renderManualEntryView()), this.viewMode !== 'plaid' && this.renderDocumentUploads()));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],

package/dist/esm/justifi-additional-statement_8.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h } from './index-CV0Pyo1O.js';
 import { c as create$3, a as create$6, F as FormController } from './index.esm-BHdVU4hV.js';
-import { au as heading5 } from './parts-C4FLe2pT.js';
+import { aC as heading5 } from './parts-c8J1gsDg.js';
 import './_commonjsHelpers-BFTU3MAI.js';
 
 const AdditionalStatementSchema = create$3({

package/dist/esm/justifi-apple-pay_8.entry.js

@@ -3,15 +3,15 @@ import { A as Api } from './Api-CLZVsXZg.js';
 import { A as ApplePayConfig, r as ApplePayHelpers, s as ApplePayPaymentRequest, t as ApplePaySessionStatus, u as ApplePayButtonStyle, v as ApplePayButtonType, w as ApplePayMerchantCapability, I as ICheckoutStatus, m as PLAID_ERROR_SEVERITY, n as PLAID_ERROR_MESSAGES, o as PlaidErrorCodes } from './Plaid-Cmyilr-q.js';
 import { S as StyledHost } from './styled-host-D6byRazK.js';
 import './event-types-CZfYo5-1.js';
-import { S as Skeleton } from './skeleton-C162KC3u.js';
+import { S as Skeleton } from './skeleton-DzBAY0bs.js';
 import { c as checkoutStore, o as onAnyChange, g as getAvailablePaymentMethodTypes, a as getCheckoutState, b as onChange } from './checkout.store-iNkW80yV.js';
-import { H as text, u as radioListItem } from './parts-C4FLe2pT.js';
+import { H as text, u as radioListItem } from './parts-c8J1gsDg.js';
 import { f as formatCurrency } from './utils-7bp92NC7.js';
 import { w as waitForConfig, c as configState } from './config-state-kKn89dp1.js';
-import { H as Header1 } from './header-1-xlSavD5o.js';
-import { H as Header2, b as insuranceValuesOn, h as hasInsuranceValueChanged, i as insuranceValues } from './insurance-state-jZTKdt60.js';
-import { H as Header3 } from './header-3-egutsoDI.js';
-import { J as JustifiAnalytics, c as checkPkgVersion } from './check-pkg-version-BVLXSZXz.js';
+import { H as Header1 } from './header-1-BIaO3iDb.js';
+import { H as Header2, b as insuranceValuesOn, h as hasInsuranceValueChanged, i as insuranceValues } from './insurance-state-MpA7uaXF.js';
+import { H as Header3 } from './header-3-UswhFvUr.js';
+import { J as JustifiAnalytics, c as checkPkgVersion } from './check-pkg-version-QOngucT4.js';
 import './dinero-HXpYMWUU.js';
 import { C as ComponentErrorSeverity, a as ComponentErrorCodes, b as ComponentErrorMessages } from './ComponentError-Cjcsf8ku.js';
 import './Pagination-CLHwhyvu.js';
@@ -19,11 +19,11 @@ import './Business-BcNb9bVO.js';
 import './Dispute-BH0Xfn-F.js';
 import { g as getErrorCode, a as getErrorMessage } from './utils-BeQLScSm.js';
 import { C as CheckoutService } from './checkout.service-BcQ_onZq.js';
-import { P as PlaidService, p as plaidIconSvg } from './plaid-icon-B7a1QC7F.js';
+import { P as PlaidService } from './plaid.service-C59iS7tB.js';
 import { P as PAYMENT_METHODS, a as PaymentMethod, b as PAYMENT_MODE } from './index-DkoufM1t.js';
 import { C as CardBrandLabels } from './payment-method-option-utils-lUHAQVFl.js';
 import './index-cDVGjRkU.js';
-import './package-Bjv3eJBk.js';
+import './package-Cc6518FT.js';
 
 // Centralized error codes for Apple Pay service
 var ApplePayServiceErrorCode;
@@ -542,7 +542,7 @@ const ApplePay = class {
         this.isConfigValid = true;
         this.error = null;
         this.handleApplePayClick = async () => {
-            var _a, _b;
+            var _a, _b, _c;
             if (this.isProcessing || this.disabled || !this.isAvailable) {
                 return;
             }
@@ -581,13 +581,18 @@ const ApplePay = class {
                 }
             }
             catch (error) {
-                const errorMessage = error instanceof Error ? error.message : "Payment failed";
-                this.error = errorMessage;
-                this.applePayError.emit({ error: errorMessage, code: ApplePay.ErrorCode.PAYMENT_FAILED });
-                this.applePayCompleted.emit({
-                    success: false,
-                    error: errorMessage,
-                });
+                if (((_c = error === null || error === void 0 ? void 0 : error.error) === null || _c === void 0 ? void 0 : _c.code) === ApplePayServiceErrorCode.USER_CANCELLED) {
+                    this.applePayCancelled.emit();
+                }
+                else {
+                    const errorMessage = error instanceof Error ? error.message : "Payment failed";
+                    this.error = errorMessage;
+                    this.applePayError.emit({ error: errorMessage, code: ApplePay.ErrorCode.PAYMENT_FAILED });
+                    this.applePayCompleted.emit({
+                        success: false,
+                        error: errorMessage,
+                    });
+                }
             }
             finally {
                 this.isProcessing = false;
@@ -1311,6 +1316,8 @@ const ModularCheckout = class {
     get hostEl() { return getElement(this); }
 };
 
+const plaidIconSvg = 'data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgMjggMjkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgY2xhc3M9ImNzcy0xcmRhajhtIj48ZyBmaWxsPSIjMTExIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yNS43NjI5IDI2LjI2MjhMMjggMTcuNTMwOUwyNC45NjkxIDE0LjUwMDFMMjcuOTk5OSAxMS40NjkxTDI1Ljc2MjggMi43MzcwNkwxNy4wMzA5IDAuNUwxNC4wMDAxIDMuNTMxTDEwLjk2OSAwLjUwMDE0TDIuMjM3MDYgMi43MzczNEwwIDExLjQ2OTFMMy4wMzEyOCAxNC40OTk5TDAuMDAwMTQgMTcuNTMxTDIuMjM3MiAyNi4yNjI5TDEwLjk2OTEgMjguNUwxNC4wMDAxIDI1LjQ2OUwxNy4wMzEgMjguNDk5OUwyNS43NjI5IDI2LjI2MjhaTTE1LjczMjEgMjMuNzM3MUwxOC42MTg2IDIwLjg1MDVMMjIuMjkxMiAyNC41MjMzTDE3LjY5NTYgMjUuNzAwN0wxNS43MzIxIDIzLjczNzFaTTExLjExMzYgOS44ODE1NEwxNC4wMDAzIDYuOTk1MDJMMTYuODg2OCA5Ljg4MTRMMTQuMDAwMSAxMi43Njc5TDExLjExMzYgOS44ODE1NFpNMTIuMjY4MiAxNC41TDkuMzgxNTQgMTcuMzg2NUw2LjQ5NTAyIDE0LjVMOS4zODE1NCAxMS42MTM1TDEyLjI2ODIgMTQuNVpNMTguNjE4NyAxMS42MTMzTDIxLjUwNTMgMTQuNUwxOC42MTg2IDE3LjM4NjVMMTUuNzMyMSAxNC41TDE4LjYxODcgMTEuNjEzM1pNMTYuODg2NyAxOS4xMTg2TDE0LjAwMDEgMjIuMDA1MUwxMS4xMTM1IDE5LjExODVMMTQuMDAwMSAxNi4yMzE5TDE2Ljg4NjcgMTkuMTE4NlpNMTAuMzA0NCAyNS43MDA3TDUuNzA4NjQgMjQuNTIzM0w5LjM4MTU0IDIwLjg1MDRMMTIuMjY4MiAyMy43MzcxTDEwLjMwNDQgMjUuNzAwN1pNNC43NjMwOCAxNi4yMzE5TDcuNjQ5NiAxOS4xMTg1TDMuOTc2NyAyMi43OTE0TDIuNzk5MyAxOC4xOTU3TDQuNzYzMDggMTYuMjMxOVpNMy45NzY3IDYuMjA4MzZMNy42NDk3NCA5Ljg4MTRMNC43NjMwOCAxMi43NjgxTDIuNzk5MyAxMC44MDQxTDMuOTc2NyA2LjIwODM2Wk0xMi4yNjgzIDUuMjYyOTRMOS4zODE2OCA4LjE0OTZMNS43MDg5MiA0LjQ3NjdMMTAuMzA0NyAzLjI5OTNMMTIuMjY4MyA1LjI2Mjk0Wk0xNy42OTU5IDMuMjk5M0wyMi4yOTE1IDQuNDc2N0wxOC42MTg2IDguMTQ5NDZMMTUuNzMyMSA1LjI2Mjk0TDE3LjY5NTkgMy4yOTkzWk0yMy4yMzcyIDEyLjc2ODFMMjAuMzUwNSA5Ljg4MTRMMjQuMDIzMyA2LjIwODc4TDI1LjIwMDcgMTAuODA0NkwyMy4yMzcyIDEyLjc2ODFaTTI0LjAyMzMgMjIuNzkxNEwyMC4zNTA1IDE5LjExODZMMjMuMjM3MiAxNi4yMzIxTDI1LjIwMDcgMTguMTk1N0wyNC4wMjMzIDIyLjc5MTRaIj48L3BhdGg+PC9nPjwvc3ZnPgo=';
+
 const PlaidPaymentMethod = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);

package/dist/esm/justifi-bank-account-billing-form-simple_3.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, h } from './index-CV0Pyo1O.js';
 import { c as create$3, F as FormController } from './index.esm-BHdVU4hV.js';
 import { y as postalValidation, z as stateValidation, h as cityValidation, l as lineTwoValidation, j as lineOneValidation, v as identityNameValidation } from './schema-validations-v6WGlZkq.js';
-import { at as billingForm } from './parts-C4FLe2pT.js';
+import { aB as billingForm } from './parts-c8J1gsDg.js';
 import { S as StyledHost } from './styled-host-D6byRazK.js';
 import './event-types-CZfYo5-1.js';
-import { H as Header3 } from './header-3-egutsoDI.js';
+import { H as Header3 } from './header-3-UswhFvUr.js';
 import { S as StateOptions } from './Business-BcNb9bVO.js';
 import './_commonjsHelpers-BFTU3MAI.js';
 import './country-config-P042rrI3.js';