@justifi/webcomponents 6.0.0-rc.10 → 6.0.0-rc.12

package/dist/module/justifi-checkout.js

@@ -107,9 +107,9 @@ const Checkout = /*@__PURE__*/ proxyCustomElement(class Checkout extends HTMLEle
         return !this.disableCreditCard && !this.disableBankAccount;
     }
     render() {
-        return (h(StyledHost, { key: '61cab7c3b5ca01ea70f35d23df100c2e7bd0c03a' }, h("justifi-modular-checkout", { key: '3e0c1729d51ca5e89108723b4a6ee14761965546', ref: (el) => {
+        return (h(StyledHost, { key: '61cab7c3b5ca01ea70f35d23df100c2e7bd0c03a' }, h("justifi-modular-checkout", { key: '67ed6c7b2a6bbbec0e24b47b24c2eb73b82abc43', ref: (el) => {
                 this.modularCheckoutRef = el;
-            }, authToken: this.authToken, checkoutId: this.checkoutId, savePaymentMethod: checkoutStore.savePaymentMethod }, h("div", { key: '04a19f4c090bd8b70801b48ce24fd734bbce5b73', class: "row gy-3 jfi-checkout-core" }, h("div", { key: '50e11e53ca4274441da3813504c9a2af223a0e28', class: "col-12", part: checkoutSummary }, h("justifi-header", { key: '2de0fb5500246c8c2ea63b6beade5fea57611a6d', text: "Summary", level: "h2", class: "fs-5 fw-bold pb-3" }), h("section", { key: '918f05a55424d4a2e46011b6c5fa0c71fc19bec3' }, h("justifi-checkout-summary", { key: 'e34604b589685ee13af794c15fd25cc19f9d2ee8' }))), h("div", { key: '7d1390340bfa79592f5643a56f15a65b6dc4faac', class: "col-12 mt-4" }, h("slot", { key: '783667c66419f8718378a705c5c313f8a763f64b', name: "insurance" })), h("div", { key: '63cc63309104557bc5dfd97f2cff3c366cbd62ae', class: "col-12 mt-4" }, h("justifi-header", { key: '8981556e7dc5f4f27a81415c222c274a6aa29173', text: "Payment", level: "h2", class: "fs-5 fw-bold pb-3" }), this.showPaymentTypeHeader && (h("justifi-header", { key: '86d3b2e89c5fedaf8d9023a1597134b0a3556e22', text: "Select payment type", level: "h3", class: "fs-6 fw-bold lh-lg" })), h("div", { key: 'da9b779071f32fe740f74061aa021a980db3aa34', class: "d-flex flex-column" }, h("section", { key: 'e0e953bfbd7f2ab7f558cc226878f74cde55e5dd' }, h("div", { key: 'b28c99a3298b8aa9ec65b254b43944af42c31e56' }, h("justifi-saved-payment-methods", { key: 'b22333168f775bc0ff58fd9ec502828b27ed3063' }), this.availablePaymentMethods.includes(PAYMENT_METHODS.SEZZLE) && (h("justifi-radio-list-item", { key: '9eac787dc5ce5a2c2f2d4a54ee1e2f9b2a48bbf7', name: "paymentMethodType", value: PAYMENT_METHODS.SEZZLE, checked: checkoutStore.selectedPaymentMethod.type === PaymentMethodTypes.sezzle, label: h("justifi-sezzle-payment-method", { ref: (el) => (this.sezzlePaymentMethodRef = el) }), "onRadio-click": () => { var _a; (_a = this.sezzlePaymentMethodRef) === null || _a === void 0 ? void 0 : _a.handleSelectionClick(); } })), this.availablePaymentMethods.includes(PAYMENT_METHODS.PLAID) && (h("justifi-radio-list-item", { key: '005fb466a494525ac651893afcf38a8998511e9e', name: "paymentMethodType", value: PAYMENT_METHODS.PLAID, checked: checkoutStore.selectedPaymentMethod.type === PaymentMethodTypes.plaid, label: h("justifi-plaid-payment-method", { ref: (el) => (this.plaidPaymentMethodRef = el) }), "onRadio-click": () => { var _a; (_a = this.plaidPaymentMethodRef) === null || _a === void 0 ? void 0 : _a.handleSelectionClick(); } })), h("justifi-tokenize-payment-method", { key: '75eaa74fc65172ecbcde91ddaf397ca367ba84be', ref: (el) => (this.tokenizePaymentMethodRef = el), authToken: this.authToken, accountId: checkoutStore.accountId, disableCreditCard: this.disableCreditCard, disableBankAccount: this.disableBankAccount, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, hideSubmitButton: true, paymentMethodGroupId: checkoutStore.paymentMethodGroupId }))))), h("div", { key: '3ae7b4ad2a464ec02eaaecbef65128ea204160c0', class: "mt-4" }, h("justifi-button", { key: '387e7fde5250bcf651a9ce1639fde76ac398dd3c', text: "Pay", type: "submit", variant: "primary", clickHandler: (e) => this.submit(e), disabled: this.isSubmitting, isLoading: this.isSubmitting, customStyle: { width: '100%', textAlign: "center" } }))))));
+            }, authToken: this.authToken, checkoutId: this.checkoutId }, h("div", { key: 'b02aaa188db4d619ab3f14a336fe33f4113f2799', class: "row gy-3 jfi-checkout-core" }, h("div", { key: '2c8c019f86bc181d7d05848993ff3782f1fe3ed2', class: "col-12", part: checkoutSummary }, h("justifi-header", { key: '00eb81f75652c80108ad24620b72a977a09192d9', text: "Summary", level: "h2", class: "fs-5 fw-bold pb-3" }), h("section", { key: '346d90b8cca657a1af0eea96244ef105d1274abe' }, h("justifi-checkout-summary", { key: '68784e0b3ef83b6a87d8084fe19dbce7d3348169' }))), h("div", { key: 'bb04ad56ed5074cc272c47e013c7647cc6cf5c2d', class: "col-12 mt-4" }, h("slot", { key: 'a0955737dc7af83b01608abe7818af666ac08d87', name: "insurance" })), h("div", { key: '7025fb6b7ad229879f2198f12a79e07871691b6a', class: "col-12 mt-4" }, h("justifi-header", { key: 'a7823342698429e7845cb341bba2de41f461f6c2', text: "Payment", level: "h2", class: "fs-5 fw-bold pb-3" }), this.showPaymentTypeHeader && (h("justifi-header", { key: 'b579b51c7f6adec31c7e1d39981634328a22b0c2', text: "Select payment type", level: "h3", class: "fs-6 fw-bold lh-lg" })), h("div", { key: '496812c7404b914acc03052018b06b5ebedfd230', class: "d-flex flex-column" }, h("section", { key: '227d6e265d947a5035d8e072b6ea9a87e04faa97' }, h("div", { key: 'b06b49af43c4fce8251c7b227bcc2f2dce5b531a' }, h("justifi-saved-payment-methods", { key: 'd5629c6248d780c5ce8b69c88b4bf866baab2c53' }), this.availablePaymentMethods.includes(PAYMENT_METHODS.SEZZLE) && (h("justifi-radio-list-item", { key: 'dbaf7d54d8c26315faea5537eb821a4a9314d2c4', name: "paymentMethodType", value: PAYMENT_METHODS.SEZZLE, checked: checkoutStore.selectedPaymentMethod.type === PaymentMethodTypes.sezzle, label: h("justifi-sezzle-payment-method", { ref: (el) => (this.sezzlePaymentMethodRef = el) }), "onRadio-click": () => { var _a; (_a = this.sezzlePaymentMethodRef) === null || _a === void 0 ? void 0 : _a.handleSelectionClick(); } })), this.availablePaymentMethods.includes(PAYMENT_METHODS.PLAID) && (h("justifi-radio-list-item", { key: 'dad1c44a06f6e60d27d737d36ff68d536244776b', name: "paymentMethodType", value: PAYMENT_METHODS.PLAID, checked: checkoutStore.selectedPaymentMethod.type === PaymentMethodTypes.plaid, label: h("justifi-plaid-payment-method", { ref: (el) => (this.plaidPaymentMethodRef = el) }), "onRadio-click": () => { var _a; (_a = this.plaidPaymentMethodRef) === null || _a === void 0 ? void 0 : _a.handleSelectionClick(); } })), h("justifi-tokenize-payment-method", { key: '2bf37f35ae9cb51a6622d4e3f4244359fd40606d', ref: (el) => (this.tokenizePaymentMethodRef = el), authToken: this.authToken, accountId: checkoutStore.accountId, disableCreditCard: this.disableCreditCard, disableBankAccount: this.disableBankAccount, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, hideSubmitButton: true, paymentMethodGroupId: checkoutStore.paymentMethodGroupId }))))), h("div", { key: 'a29f2e940b8c2970d09af0fdce278344cd70833a', class: "mt-4" }, h("justifi-button", { key: '6a076cff574520eaf3303cb4792227365eaf25ae', text: "Pay", type: "submit", variant: "primary", clickHandler: (e) => this.submit(e), disabled: this.isSubmitting, isLoading: this.isSubmitting, customStyle: { width: '100%', textAlign: "center" } }))))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],

package/dist/module/justifi-checkouts-list-filters.js

@@ -53,7 +53,7 @@ const CheckoutsListFilters = /*@__PURE__*/ proxyCustomElement(class CheckoutsLis
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '05a4d429a1acd7bbaf202872523284e2b2cd3677' }, h("table-filters-menu", { key: 'abf61654a75212537af580f3bfd2646042eaba8a', params: filterMenuParams, clearParams: clearParams, part: checkoutsListFilterMenu }, h("div", { key: 'f8e5cfe4b0a23723d0df939a1d1873adffcb1da9', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'd9e23e96a7269b3609e690a1e64e8c20bd125cb7', class: "p-2" }, h("form-control-select", { key: 'e1899dbc615be07486bc54f8baa395bee776d8ce', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || filterParams.status, disabled: !!this.checkoutStatus, part: statusCheckoutsListFilterParam })), h("div", { key: 'bedbc26d9d9f6906013ef4b80542d9031822b19c', class: "p-2" }, h("form-control-select", { key: '3bfef7fabeb85a29304e11093005bb1f58b23f41', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode, disabled: !!this.paymentMode, part: paymentModeCheckoutsListFilterParam }))))));
+        return (h(StyledHost, { key: '5474a09b729c816bafb47101dbf5a25aff92eb1b' }, h("table-filters-menu", { key: '92e46a05e67bdf84b74cd644c1b89d0fc4c86af9', params: filterMenuParams, clearParams: clearParams, part: checkoutsListFilterMenu }, h("div", { key: 'd8562876f8a0c1d85caa5a298cccdb1143bd7512', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '4162644cf10861d91a79dc07f845dd21a6c8d6a5', class: "p-2" }, h("form-control-select", { key: '2b13ef4af25f6ac3865f3b0edde91929655537bf', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || filterParams.status, disabled: !!this.checkoutStatus, part: statusCheckoutsListFilterParam })), h("div", { key: '9aee7f453be147b03a548fe9ea9bd9bcc6a233aa', class: "p-2" }, h("form-control-select", { key: '8f375d5660c3414e5f3796e02694fa46ed761871', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode, disabled: !!this.paymentMode, part: paymentModeCheckoutsListFilterParam }))))));
     }
 }, [257, "justifi-checkouts-list-filters", {
         "checkoutStatus": [1, "checkout-status"],

package/dist/module/justifi-checkouts-list.js

@@ -101,7 +101,7 @@ const CheckoutsList = /*@__PURE__*/ proxyCustomElement(class CheckoutsList exten
         }
     }
     render() {
-        return (h(StyledHost, { key: 'b0c774c4f56f94cd6b4a3dc8651938f9f33ca94e' }, h("checkouts-list-core", { key: 'd524423a791f70c234044f5ba27d7bc3648fc988', getCheckouts: this.getCheckouts, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '41bf633467138b6af13b1c02ccf1e1016ec54bfe' }, h("checkouts-list-core", { key: 'cd3ca431258ad73e701fe74612ecdf2c0f2a1bda', getCheckouts: this.getCheckouts, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-dispute-management.js

@@ -94,7 +94,7 @@ const DisputeManagement = /*@__PURE__*/ proxyCustomElement(class DisputeManageme
         }
     }
     render() {
-        return (h("justifi-dispute-management-core", { key: '8c800827aaa9d549a734ea05698763685e160a98', getDispute: this.getDispute, disputeId: this.disputeId, authToken: this.authToken, "onError-event": this.handleErrorEvent }));
+        return (h("justifi-dispute-management-core", { key: '4087eb105a046a3cc194d9f25c80fa11298fa0a2', getDispute: this.getDispute, disputeId: this.disputeId, authToken: this.authToken, "onError-event": this.handleErrorEvent }));
     }
     static get watchers() { return {
         "disputeId": ["propChanged"],

package/dist/module/justifi-order-terminals.js

@@ -231,7 +231,7 @@ const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals ext
         return (h("div", { class: "mt-3" }, h("div", { class: "text-end" }, "Order limit: ", this.orderLimit), h("div", { class: "d-flex justify-content-end mt-3" }, h("button", { class: "btn btn-primary submit-btn", onClick: this.submitOrder.bind(this), disabled: this.order.totalQuantity === 0 || this.submitting, part: buttonPrimary }, this.submitting ? 'Submitting...' : this.submitButtonText))));
     }
     render() {
-        return (h(StyledHost, { key: '5171ddb7b807bf4084f0f831002803a4ece698f3' }, h("div", { key: '529adf4549be8b2723fca357be3f541403dfc8a3', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
+        return (h(StyledHost, { key: 'd30fa51dfc5de12c0c70b642a8ad43093717b6e3' }, h("div", { key: '022332e39a80c3cc276ad8e0f56e98a592f14f0a', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
     }
 }, [257, "justifi-order-terminals", {
         "businessId": [1, "business-id"],

package/dist/module/justifi-payment-transactions-list.js

@@ -181,7 +181,7 @@ const PaymentTransactionsList = /*@__PURE__*/ proxyCustomElement(class PaymentTr
         return !this.showEmptyState && !this.showErrorState && !this.isLoading;
     }
     render() {
-        return (h(StyledHost, { key: '0ea0cd7e150028fa7dd07bc8d3a9900ba2de5728' }, h(TableWrapper, { key: 'cf8085e6989e1fb05c2b606a6d56c4af5ba33d33' }, h(TableComponent, { key: '2aeae7b80720b715e33b4decc824b08c95642951' }, h(TableHead, { key: '463a4486652002ec647d90d23eeba7251eccda98' }, h(TableHeadRow, { key: '8c2906ce4c1f53d196ac6134ad363332c4e831fb' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: 'bf1a2336f715ef317ee41f7b1de44b4256ac5f48' }, h(TableLoadingState, { key: '7bf57b2056d7e8a912d1e173d01b6007cc648441', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '3a578832c5c3c05fbcebad508e3922c180ee33cf', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '9cdff1699621d8e02d90ca7544a3e95340c6598e', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '9c5baf6c5bbba0c19f287fd2eddd7b06490f51df' }, h(TableFootRow, { key: '95460f894d3f6a9d20422aef2c9172cdc230e079' }, h(TableFootCell, { key: '33fa015f7a7a968c6697302616359991f5ae16cf', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: 'e1821a1b7658b503e11ff799413fa5ea368a7ae7', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: '94919675808cd7b7df82403b7fa40e72c763f676' }, h(TableWrapper, { key: 'e405a069813214b692d7efb39b1a2b8313291088' }, h(TableComponent, { key: '27c7d5a96075d6e1e3b25d18272b4f4f57e374f0' }, h(TableHead, { key: 'e80e58ed2c38902adc86b7088cf9094b1e4f2540' }, h(TableHeadRow, { key: '641c6bc3d69a20bbd4624043cca1178f6e7257ba' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: 'b1a029e801f1f87f35201ba8725bff6e9cc5eb28' }, h(TableLoadingState, { key: '8af52c5f9a0072502e64539900aeae2d08dce1ce', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: 'df0d89fd7fee252611ea45052373b59974d86c81', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '1ae2c61e4eaa643ed47cd37ec2a7fa192b99ec11', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: 'c3b9d5df20e37e8325ce8b99360ed5547078b9a6' }, h(TableFootRow, { key: '8ae2ddda61552ff945b075287654d0bfc64a8dae' }, h(TableFootCell, { key: 'ee9fe2a43b9ea6e6916d196fbfcf67f87b46821c', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '79f03d48df9fde25ee3ceb9b5a369b1d8296caa8', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get watchers() { return {
         "pagingParams": ["propChanged"],

package/dist/module/justifi-payments-list-filters.js

@@ -56,8 +56,8 @@ const PaymentsListFilters = /*@__PURE__*/ proxyCustomElement(class PaymentsListF
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: 'cc126b534ca4b07c39837310f08a7dbbf12d793c' }, h("table-filters-menu", { key: '5417f231746c0dace09e623629c0b40b0e680714', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: '50cd8592d22b12788c31dfc744a39fcec7a32a0f', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'dd64e601b8881bb940dabfd05a5b6fa5fabc75fd', class: "p-2" }, h("form-control-text", { key: '172c56e0eb8c4d13ff30ff1f2266a30ab8d59e25', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: '70db55cf54206ab03112ff88757248deb3507084', class: "p-2" }, h("form-control-text", { key: 'c7e94136b6285d8d22f2170d26c166227451e914', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'f282e92c253370922ec06ae0ed9ef55d5515f55c', class: "p-2" }, h("form-control-select", { key: '7c35feaac9958fb44586e757ef708d2230c6a31c', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentStatus || filterParams.payment_status, disabled: !!this.paymentStatus, part: paymentStatusPaymentsListFilterParam })), h("div", { key: 'e74d305502ed5676d7ba6c332011f3aac2c757f4', class: "p-2" }, h("form-control-date", { key: '96a88abb0be10f2bd5c8c96beefbbd143a9c8a61', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterPaymentsListFilterParam })), h("div", { key: '4c3e79b77675ba2cf7d5bc7746193ceabdc88aee', class: "p-2" }, h("form-control-date", { key: '275a24fbd7a806786182dda5d8f0eed1ad85528e', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+        return (h(StyledHost, { key: 'b5002714bcb9cc1e61fa95500a591c2810fdc33a' }, h("table-filters-menu", { key: '44a5340b38f0b8cbe0d6f0d008491367b9c9f282', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: '44720a808b1d5745088d06e23e63772baf385932', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '3eb2c21ffbfb14bef3689068f7f3d6b424d2c942', class: "p-2" }, h("form-control-text", { key: '12b5b93d5139e0385c42de82bfaf967ddd0f6725', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: '9ca6b70ffce0a39ae9f04302d6ce176a0b37cff0', class: "p-2" }, h("form-control-text", { key: '38f41d65e26e8cd2018ae1154dbf1a44a35ba1bb', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: '4d4676911e45812980b058e3f9b110eda7adbee2', class: "p-2" }, h("form-control-select", { key: '1bb9ac03025ef1cca4415224520bf1e37d08e212', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentStatus || filterParams.payment_status, disabled: !!this.paymentStatus, part: paymentStatusPaymentsListFilterParam })), h("div", { key: 'a1b72c587590cb39afbb09314f53e1109f6a1a3e', class: "p-2" }, h("form-control-date", { key: '939164307d2eae2b18d2ec660d5bb255288f33a1', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterPaymentsListFilterParam })), h("div", { key: '879cb627b5913c8b43f76202d7c743eda194fb0c', class: "p-2" }, h("form-control-date", { key: 'c9d9dfdb534f940d7d4510f30bf613687cfdb841', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
                 convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforePaymentsListFilterParam }))))));
     }
 }, [257, "justifi-payments-list-filters", {

package/dist/module/justifi-payments-list.js

@@ -90,7 +90,7 @@ const PaymentsList = /*@__PURE__*/ proxyCustomElement(class PaymentsList extends
         }
     }
     render() {
-        return (h(StyledHost, { key: 'bd9d7950a22c554394e46bf09f48ced038fd5c44' }, h("payments-list-core", { key: '52a88a0a20484d863ac1a61ede8f657c35454f91', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: 'dc98dc21eec289a19e15963d492b999429d4d605' }, h("payments-list-core", { key: 'd0f6d59769de1fc3ac20d228d4059ac5b9951a93', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-payout-transactions-list.js

@@ -190,7 +190,7 @@ const PayoutTransactionsList = /*@__PURE__*/ proxyCustomElement(class PayoutTran
         return Object.assign({ payout_id: this.payoutId, limit: '15' }, this.pagingParams);
     }
     render() {
-        return (h(StyledHost, { key: '45d15a8a614512709c062ba0b73b21b4be60aae4' }, h(TableWrapper, { key: 'ea65c120639a42271fa79cfc2660ae8e5fcd7989' }, h(TableComponent, { key: 'e44aa8d9e57ea1a55dd75bbe80e44955b22b4e32' }, h(TableHead, { key: 'e663b101246f11d6bc6efc36ac3e9e39a0e2528a' }, h(TableHeadRow, { key: '2b672fd701d35c1654a08fa6a189040c54de31ea' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '8c03bd811e3b7e69b74fb51d4e2596bbff1c3fb4' }, h(TableLoadingState, { key: '0e6929873aea75e3b50969e39e07deac85551c0c', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '63520b2bba3e6b171c6822b3e3c1a9cdf6b7eec6', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '107042f52f39c43327134ac0f0b942713fb438cd', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '7acf7d4c451f25015fcdad0c8f1a4f2583ca5010' }, h(TableFootRow, { key: '2f996a483df8b2d3fc735e0e8259ccde63e25875' }, h(TableFootCell, { key: '3ba8fafc0f84057e5b1490f335810ad0526e3968', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: 'f5b47b52d59a554bd8ddb2bd08214eba5293d126', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: 'fab19f2659fa5297abcae562adeaebded41eac70' }, h(TableWrapper, { key: '78c5f9820a23a91210340cc02cb43c57022ebcd2' }, h(TableComponent, { key: 'a6133e4790a58d0f758a3e8f47438bf338e0e89c' }, h(TableHead, { key: '21cc8b9db76e0fd3693974672133c34d0b426946' }, h(TableHeadRow, { key: 'e279da66e4318220bfbf24abc47e68e223c96c9a' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '0c5d0a5e90aa1074f27a223b9cb24f82c2e06744' }, h(TableLoadingState, { key: '9a73e7b326c56b0e71c8f0d418560581687f80f7', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: 'ae235f7049467b252ec2c6423dc03c27774f1af7', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '2ada40b042e00356971e98068a92a1d0dce13088', columnSpan: this.transactionsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.transactionsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '7360357eab024ac7ba4d207eb24f5ab8ffcfce11' }, h(TableFootRow, { key: '556919733baf7b61e9db840eeef074dd9cec6765' }, h(TableFootCell, { key: 'a18ea36eadf8d38cf98ed70258ef8f7c3f564bcd', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '4910c7a49d08f6c2db8ce4db34e7055111916fea', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get watchers() { return {
         "pagingParams": ["propChanged"],

package/dist/module/justifi-payouts-list-filters.js

@@ -37,8 +37,8 @@ const PayoutsListFilters = /*@__PURE__*/ proxyCustomElement(class PayoutsListFil
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '6c8121b37d463cddd5c1144a00a2941c71e578c9' }, h("table-filters-menu", { key: '60ae9a73059c2680eec39f89c10910ab59d31216', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '3e4fd2b21b87cab6fe6bfb9b7a5f5d8b5bd853e9', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '8986319d9d5a1677d63c8a958327383f504489d2', class: "p-2" }, h("form-control-date", { key: '1fc277106b203b8ce15971f1606fd7fbf5358d71', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDate: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDate: true }), disabled: !!this.createdAfter, part: createdAfterPayoutsListFilterParam })), h("div", { key: 'd86a3567ab76447c97383f694d23814132051ae1', class: "p-2" }, h("form-control-date", { key: '65e902f28fe683e58ae63eae459f6f6c582beb5d', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
+        return (h(StyledHost, { key: '527a9fe5ee51ca33480e25dfeccb19e5d8d01119' }, h("table-filters-menu", { key: '23333b0ff3d5bc75fe54bdf02682e71ec96b18a4', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '550b8d065a34d6ea7dd6d6d88cdd2e8251bda0ff', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '1ad60bfbe0cbae190707a424c8a41e42f5aaedc8', class: "p-2" }, h("form-control-date", { key: '05e7871138c213d3d96c17b7af477fbbe59252a0', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDate: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDate: true }), disabled: !!this.createdAfter, part: createdAfterPayoutsListFilterParam })), h("div", { key: '7839226398149bc15261f6b258ebbd4b08a6322c', class: "p-2" }, h("form-control-date", { key: '7e3a9c9ef1c5ffbb68bf6d7044336e1b9cc28a76', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
                 convertToLocal(filterParams.created_before, { showInputDate: true }), disabled: !!this.createdBefore, part: createdBeforePayoutsListFilterParam }))))));
     }
 }, [257, "justifi-payouts-list-filters", {

package/dist/module/justifi-payouts-list.js

@@ -104,7 +104,7 @@ const PayoutsList = /*@__PURE__*/ proxyCustomElement(class PayoutsList extends H
         }
     }
     render() {
-        return (h(StyledHost, { key: 'de3472c5070a100129ee16538e83cdb42ca85da6' }, h("payouts-list-core", { key: 'cff5883ee21662231467270a90c5030a724d7e57', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
+        return (h(StyledHost, { key: 'd18659f462fa7e34d2cec6c5bc99a25208bfe2d5' }, h("payouts-list-core", { key: 'fb0d8aade040e7b9fe6273a457ee5f9f5ee0eadb', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-terminal-orders-list-filters.js

@@ -62,8 +62,8 @@ const TerminalOrdersListFilters = /*@__PURE__*/ proxyCustomElement(class Termina
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '988e8065ca67d21d1c4b68c5bcfed4fd95c6e409' }, h("table-filters-menu", { key: '22073bfda9c93d5aecf8c613497673189df8b007', params: filterMenuParams, clearParams: clearParams, part: terminalOrdersListFilterMenu }, h("div", { key: 'a94b84892b641a137ce100bf219bc58480f832ce', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'cfc88bdfea79cd6c84a6ad8c7d35eb95c40d26b8', class: "p-2" }, h("form-control-select", { key: '984fc8a4ad675cb42666ca788b451c0873156b78', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status, disabled: !!this.orderStatus, part: orderStatusTerminalOrdersListFilterParam })), h("div", { key: '7f1d78148dbc10f3b0cb311db4fa32d47974587a', class: "p-2" }, h("form-control-select", { key: '0f229683300698549656a508279758c5e17a2730', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type, disabled: !!this.orderType, part: orderTypeTerminalOrdersListFilterParam })), h("div", { key: 'c8728a93377e1733f30ba60eb16a49e0703a9d1f', class: "p-2" }, h("form-control-date", { key: '1dabe01d1b923c40135b4a1ca2b88b13f492900c', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
-                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterTerminalOrdersListFilterParam })), h("div", { key: '446ceaa457b97bef17d2443b38b9088b979f628b', class: "p-2" }, h("form-control-date", { key: '72b6a32928b2556dacb62c427af8d8c09a5f0abb', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+        return (h(StyledHost, { key: '1260582328ade12685fc82194b9494660ae3c920' }, h("table-filters-menu", { key: '63cb3736337d0de6aea184d077ea21151f06cc30', params: filterMenuParams, clearParams: clearParams, part: terminalOrdersListFilterMenu }, h("div", { key: '34f9a90dc1ce7ea6ce83d05766bdd98f0f1cb5a9', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'f64f80aa91221e129a6a15a42e7625c9a3a3761f', class: "p-2" }, h("form-control-select", { key: 'dd840170915b7c584e74e1e32f27934c41f89f8a', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status, disabled: !!this.orderStatus, part: orderStatusTerminalOrdersListFilterParam })), h("div", { key: '7a90a376f7cfa09c3c03f55673f17abab8f6de19', class: "p-2" }, h("form-control-select", { key: 'd3d648ad27ec7a64cc339230134a0e86a3b81a80', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type, disabled: !!this.orderType, part: orderTypeTerminalOrdersListFilterParam })), h("div", { key: 'f88bc7868f89f8d352bd3625925303cf7f41dd36', class: "p-2" }, h("form-control-date", { key: 'e39cb7f23ab8b4c6984f22c1765831a641a60b82', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterTerminalOrdersListFilterParam })), h("div", { key: 'bb82b0d8c53aa19b5490b05e3030113a4dc72487', class: "p-2" }, h("form-control-date", { key: '0f2a808035f2f9c8fb9158bb69831e3b5ad723f8', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
                 convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforeTerminalOrdersListFilterParam }))))));
     }
 }, [257, "justifi-terminal-orders-list-filters", {

package/dist/module/justifi-terminal-orders-list.js

@@ -96,7 +96,7 @@ const TerminalOrdersList = /*@__PURE__*/ proxyCustomElement(class TerminalOrders
         }
     }
     render() {
-        return (h(StyledHost, { key: '770ec45855c3d0034eb5a09db38a31cdfcc6227c' }, h("terminal-orders-list-core", { key: '53a96754ad9de85d99c1a299212d74925539d193', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '9c393138daa19db378cbecd35d78d7b85d6388d9' }, h("terminal-orders-list-core", { key: '5757dd9496f72ab9e9933cae2e13726173cf75f4', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
 }, [257, "justifi-terminal-orders-list", {
         "accountId": [1, "account-id"],

package/dist/module/justifi-terminals-list-filters.js

@@ -51,7 +51,7 @@ const TerminalsListFilters = /*@__PURE__*/ proxyCustomElement(class TerminalsLis
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: 'b171691b2dd20e57f132d83f6857d15bfda36ea1' }, h("table-filters-menu", { key: '458e8a032f475812a7cc77ecfc2af6ba0e4b8398', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: 'dc1953cae02eded40a0e8351aa2d3b25f1105486', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'f676f3b75ee02a0a1db4b8b95ba6c01cbcd00cb4', class: "p-2" }, h("form-control-text", { key: '8f00314bc11246b6006d682830155fd931adf1b6', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: 'bf6704c3b84fd825c925bc212c8f76b2d6c0a3c3', class: "p-2" }, h("form-control-text", { key: '24b7ef636136f749a44d927752d54110508c5986', name: "terminal_order_id", label: "Terminal Order ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalOrderId || filterParams.terminal_order_id, disabled: !!this.terminalOrderId, part: terminalOrderIdTerminalsListFilterParam })), h("div", { key: '0c1bd807a3ca0e9a0d5bf182f4f48e6bbc78201e', class: "p-2" }, h("form-control-select", { key: 'bf9f459cbda08eabb9c6bbbb6c8c4cd82ce753b5', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
+        return (h(StyledHost, { key: 'bcaec66f4cd7fc0beb3f7386066573f801bb6b86' }, h("table-filters-menu", { key: 'c36fd3a8fd290feac832bc888fc4e9a8ddc17fab', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '62e2c00588089c303758bea41065fac8c68eea9b', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '834e38bc1773bd276028b3a44fe9267bc14d6ac8', class: "p-2" }, h("form-control-text", { key: 'ab5568f2a9a7cfe4aa1fc465142eaadf6da64359', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: '1f95d3416cea2ad9b7b40835b3b919da97630072', class: "p-2" }, h("form-control-text", { key: '213a9aaca3b6abe087727e5bd7eda3643d720e38', name: "terminal_order_id", label: "Terminal Order ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalOrderId || filterParams.terminal_order_id, disabled: !!this.terminalOrderId, part: terminalOrderIdTerminalsListFilterParam })), h("div", { key: 'e06e9accd5b0972097d845cf456389d845ed6559', class: "p-2" }, h("form-control-select", { key: 'db17b50536a06ae09a7fae6a0e9da6a64ff12e69', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
     }
 }, [257, "justifi-terminals-list-filters", {
         "terminalId": [1, "terminal-id"],

package/dist/module/justifi-terminals-list.js

@@ -101,7 +101,7 @@ const TerminalsList = /*@__PURE__*/ proxyCustomElement(class TerminalsList exten
         }
     }
     render() {
-        return (h(StyledHost, { key: '3e7a05a8497a84bf6b06d9fc95834d9bbb53d954' }, h("terminals-list-core", { key: '1653a639b594c93cc08fadb07ff56346d1ae9295', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: 'c82f6589a4c8d65b9a8770933f25ebe2b64e4672' }, h("terminals-list-core", { key: 'e7dda138b2ec45f18bd914cd03ee8aabffff1dde', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/modular-checkout.js

@@ -8,6 +8,7 @@ import './Pagination.js';
 import './Business.js';
 import { g as getErrorCode, a as getErrorMessage } from './utils4.js';
 import { C as CheckoutService } from './checkout.service.js';
+import { P as PlaidService } from './plaid.service.js';
 import { i as insuranceValuesOn, h as hasInsuranceValueChanged, a as insuranceValues } from './insurance-state.js';
 import { b as PAYMENT_MODE } from './ModularCheckout.js';
 
@@ -73,7 +74,7 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
         this.errorEvent = createEvent(this, "error-event", 7);
         this.submitEvent = createEvent(this, "submit-event", 7);
         this.checkoutChangedEvent = createEvent(this, "checkout-changed", 7);
-        this.savePaymentMethod = false;
+        this.plaidService = new PlaidService();
         this.handleApplePayCompleted = (event) => {
             const { success, token, paymentMethodId, error } = event.detail;
             if (success && token) {
@@ -104,9 +105,6 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
             checkoutStore.selectedPaymentMethod = undefined;
         };
     }
-    savePaymentMethodChanged(newValue) {
-        checkoutStore.savePaymentMethod = newValue;
-    }
     connectedCallback() {
         this.observer = new MutationObserver(() => {
             this.queryFormRefs();
@@ -133,7 +131,6 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
         this.analytics = new JustifiAnalytics(this);
         checkPkgVersion();
         checkoutStore.authToken = this.authToken;
-        checkoutStore.savePaymentMethod = this.savePaymentMethod;
         this.fetchCheckout();
         // Refresh the checkout data when insurance values actually change (not on initial load)
         insuranceValuesOn("set", (key) => {
@@ -195,6 +192,7 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
     updateStore(checkout) {
         var _a, _b, _c, _d, _e;
         checkoutStore.accountId = checkout.account_id;
+        checkoutStore.checkoutLoaded = true;
         checkoutStore.paymentMethods = checkout.payment_methods;
         checkoutStore.paymentMethodGroupId = checkout.payment_method_group_id;
         checkoutStore.paymentDescription = checkout.payment_description;
@@ -261,6 +259,7 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
     // set the selected payment method to the checkout store from outside the component
     async setSelectedPaymentMethod(paymentMethod) {
         checkoutStore.selectedPaymentMethod = paymentMethod;
+        checkoutStore.paymentToken = paymentMethod.id || undefined;
     }
     // getAvailablePaymentMethods removed in favor of checkout-changed event
     // if validation fails, the error will be emitted by the component
@@ -303,11 +302,13 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
         }
     }
     async submitCheckout(submitCheckoutArgs) {
+        var _a;
         const isValid = await this.validate();
         const isNewCard = checkoutStore.selectedPaymentMethod.type === PaymentMethodTypes.card &&
             checkoutStore.selectedPaymentMethod.id === undefined;
         const isNewBankAccount = checkoutStore.selectedPaymentMethod.type === PaymentMethodTypes.bankAccount &&
             checkoutStore.selectedPaymentMethod.id === undefined;
+        const isPlaid = checkoutStore.selectedPaymentMethod.type === PaymentMethodTypes.plaid;
         const shouldTokenize = isNewCard || isNewBankAccount;
         if (shouldTokenize) {
             const tokenizeResult = await this.tokenizePaymentMethod(submitCheckoutArgs);
@@ -320,6 +321,41 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
                 return;
             }
         }
+        // For Plaid, perform exchange at submit time using stored public token and link token id
+        if (isPlaid && !checkoutStore.paymentToken) {
+            const publicToken = checkoutStore.plaidPublicToken;
+            const linkTokenId = checkoutStore.plaidLinkTokenId;
+            if (!publicToken) {
+                this.errorEvent.emit({
+                    message: 'Missing Plaid public token. Please connect your bank.',
+                    errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
+                    severity: ComponentErrorSeverity.ERROR,
+                });
+                return;
+            }
+            try {
+                const response = await this.plaidService.tokenizeBankAccount(checkoutStore.authToken, checkoutStore.accountId, publicToken, linkTokenId || undefined, checkoutStore.savePaymentMethod ? checkoutStore.paymentMethodGroupId : undefined);
+                if (response === null || response === void 0 ? void 0 : response.error) {
+                    this.errorEvent.emit({
+                        message: typeof response.error === 'string' ? response.error : response.error.message || 'Failed to tokenize bank account',
+                        errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
+                        severity: ComponentErrorSeverity.ERROR,
+                    });
+                    return;
+                }
+                const paymentMethod = response === null || response === void 0 ? void 0 : response.data;
+                const token = ((_a = paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.bank_account) === null || _a === void 0 ? void 0 : _a.token) || (paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.token) || (paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id);
+                checkoutStore.paymentToken = token;
+            }
+            catch (err) {
+                this.errorEvent.emit({
+                    message: (err === null || err === void 0 ? void 0 : err.message) || 'Plaid exchange error',
+                    errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
+                    severity: ComponentErrorSeverity.ERROR,
+                });
+                return;
+            }
+        }
         if (!isValid) {
             this.errorEvent.emit({
                 message: "Please fill in all required fields.",
@@ -334,6 +370,7 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
                 errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
                 severity: ComponentErrorSeverity.ERROR,
             });
+            return;
         }
         let payment;
         const mapTypeToPaymentMode = (type) => {
@@ -372,21 +409,15 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
         });
     }
     render() {
-        return h(Host, { key: '4df5d1aa50fbeee7da93f8e19e45f6907b6ae2c7' });
+        return h(Host, { key: '08b6e2c3f58745ac7865f686bafba4e18cbab268' });
     }
     get hostEl() { return this; }
-    static get watchers() { return {
-        "savePaymentMethod": ["savePaymentMethodChanged"]
-    }; }
 }, [256, "justifi-modular-checkout", {
         "authToken": [1, "auth-token"],
         "checkoutId": [1, "checkout-id"],
-        "savePaymentMethod": [4, "save-payment-method"],
         "setSelectedPaymentMethod": [64],
         "validate": [64],
         "submitCheckout": [64]
-    }, undefined, {
-        "savePaymentMethod": ["savePaymentMethodChanged"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/module/package.js

@@ -1,5 +1,5 @@
 const name = "@justifi/webcomponents";
-const version = "6.0.0-rc.10";
+const version = "6.0.0-rc.12";
 var webcomponentsPackageJson = {
 	name: name,
 	version: version};

package/dist/module/payment-details-core2.js

@@ -59,16 +59,16 @@ const PaymentDetailsCore = /*@__PURE__*/ proxyCustomElement(class PaymentDetails
         });
     }
     render() {
-        return (h(StyledHost, { key: '5bb9e4baea06de90dba2e9469f14c52b68e65249' }, this.loading && h(PaymentDetailsLoading, { key: '5cbc91375b6d80958e66fad56e1e6d7ab2e15b76' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
-            this.payment && (h("justifi-details", { key: '7eedb26bfa0fb1cf1656c8bbade79c8cdbdf9764', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: 'e7912d448ac140a8164ad7c285ab95ed779d61e4', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPaymentStatusToBadge(this.payment.status), this.payment.expedited ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : null)), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: '1cd9d26abe03b8994c84b6b1d9c06fc75c4705e8', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: '4330bf0ddd130a2103ae00abb4ac787a2968e1b1', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: 'e5336b00ebc442a3d52e74e4f1f75442c06edcf9', title: "ID", value: this.payment.id })), h("div", { key: '0e07bc37f9fbb547c479167ee9e5991a59aeb54f', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '6d30461904ce2576bf3af983a6aa856c2b4fb52d', sectionTitle: "Details" }), h("div", { key: '6a1d68cfa2c03dc496768f7d29867c77aff39856', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '2669711d00298e9a84582149f423bcbeabb60de2', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: '3a93e845f845d0fd17409e3e44c096f3bb7563dc', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '4be864f58f7ab22e0e5079dc924d8bd02f3b7dd8', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: '14956ec82cf01fdec85e76170aeade66273d6a1d', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: '06cd1d7930f6c428be0c736e918147c7aa94cd80', title: "Status", value: MapPaymentStatusToBadge(this.payment.status) }), h(DetailItem, { key: '98e27c002566c3e9a093ab743951bf56501fd2a2', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: '54ab8e011a08814fe3d970f0ab7a93d558b68e22', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: 'f9875ea8913f6d46adac4175de6dfc284cedba4f', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: 'ccd5a4a44663cf14b76141e91c69d799055f83e2', title: "Description", value: this.payment.description }), h(DetailItem, { key: '4136e5f730f569bcb63e87cea1022d996596f2a0', title: "Expedited", value: this.payment.expedited ? 'Yes' : 'No' })), this.payment.payment_method.card && [
-            h(DetailSectionTitle, { key: '3a7ef3be13a9a8d8573eb5766d8d4b120baca19d', sectionTitle: "Payment Method" }),
-            h("div", { key: '695558eded8ee2cff291bed4a13d02482b619565', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '1c678964543ced0c4f1a5835fea8234322f732ae', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: '5b1c9dfda2f8b499e6d0c9fae288e58a771d63d7', title: "Payment Type", value: "Card" }), h(DetailItem, { key: '0aecf598551b5685a36dafb8cf54802cd3914482', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: 'd59d46bef4cecf2a1dcb73c9af696e6aabf5776b', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: '56588cdf9c1535cf8aa22dd56a94608805f241aa', title: "Cardholder", value: this.payment.payment_method.payersName }))
+        return (h(StyledHost, { key: 'f2b186044ccc85a72cfcb8fb144ee77667e15ba6' }, this.loading && h(PaymentDetailsLoading, { key: 'edb17ed3599ad66988a15d9834e17e49408b9507' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
+            this.payment && (h("justifi-details", { key: '62bf6dd11a6c6b31dcece28cfc375ae1eb6f9344', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: '40a3d2f1d327efe61d186f2b24126ec52bcf28bc', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPaymentStatusToBadge(this.payment.status), this.payment.expedited ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : null)), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: '83903da52e88d24f09667e1aba282377f35f8e64', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: '4f87ad37c9a2b8f8a1ecd181af3b30dbf73aea57', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: '52711a7db01db2fb3899fd7defac22021e339e99', title: "ID", value: this.payment.id })), h("div", { key: 'fce421c4a9803e24e05685fa50c0695584ebc5db', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '0734f86c73fa6ec4aee0d65c7ead7f0ae2f36cc2', sectionTitle: "Details" }), h("div", { key: '70df3fc23267c96de447842859ef570b3208a719', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '56a458e4e555e0c6eec08dfc5741e497a2d34686', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: 'f38251a639c1dc0f3299184525074cc312a495ee', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '24bd2a8275278305655b381ba364f7ef352507e5', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: '501de65bfda2966ee0ba78d5a7ef9b7f358549f1', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: 'd0296e2992ba58514e658b7b32ddfc28c5c833f5', title: "Status", value: MapPaymentStatusToBadge(this.payment.status) }), h(DetailItem, { key: '5b5ee68f54dab15339abcff35e8c7fd80504030b', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: 'ee1f690a6ce8f4b11376c7f92d9b7869642ba0a3', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '7857ee342d7b3af9cbd8e833c9ecc8947c74b5cd', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: '38fdde533028fa041c6d22cf1727461fe8691ace', title: "Description", value: this.payment.description }), h(DetailItem, { key: 'f629e61d7e7dfbbc74ff3590abf8ce9a5cc3614d', title: "Expedited", value: this.payment.expedited ? 'Yes' : 'No' })), this.payment.payment_method.card && [
+            h(DetailSectionTitle, { key: 'ee90457c952f0ac7217556e8566972fb43b29984', sectionTitle: "Payment Method" }),
+            h("div", { key: 'd6007e904c9f45d48f02ce675d75f451b09a344b', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '5fd5fae2793f2d1cb7b63e405c9b865458228e8f', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: '7e6d640a4ed7b4842d3b502901a177a49ae30637', title: "Payment Type", value: "Card" }), h(DetailItem, { key: '6d593f6ef45f8e286c3262750bdef8f686d2dd0a', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: '89301ddd84e5cefd3c6576506e590a7fb1d98749', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: '8119c2e7ccf0e4c76d93a7033311a244e3b16921', title: "Cardholder", value: this.payment.payment_method.payersName }))
         ], this.payment.payment_method.bank_account && [
-            h(DetailSectionTitle, { key: '84f146ebe0e237768df2fd8e16c2295bdb86a49a', sectionTitle: "Payment Method" }),
-            h("div", { key: '440b505ff883eadf73ecd3ca542d0feeadb8e8a8', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '2f57116a3c0a9522a18866d88e18d5856fa53b2a', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: 'c0a7c01e8c4eeece3771d29938268fd324e647c6', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: '2968ea77dbc987591dd2418d544c4f21027694d6', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '38f7129625d8d6a16818dc07343eda9ba31dd19c', title: "Account Owner", value: this.payment.payment_method.payersName }))
+            h(DetailSectionTitle, { key: 'b410bff21158a0800cddbd46c622de479315313b', sectionTitle: "Payment Method" }),
+            h("div", { key: 'f5595402cdc5f3fa2a5e19e99d6e0a21f8dbf0eb', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '6f157f4c6f0c915a47f597dd20883b4f2acfd74a', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: 'c1872ab9da698076ba617bbaeb7ef6790f5ea487', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: '0fe4b0af3aff5f03e660dbe9d4286fc3981e6ada', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '6920ce8ae22fed7bd3e12ec48e0197e0e6675257', title: "Account Owner", value: this.payment.payment_method.payersName }))
         ], this.payment.metadata && [
-            h(DetailSectionTitle, { key: 'bf0d94665bae468091534cc74219ee786b8b87f6', sectionTitle: 'Metadata' }),
-            h("div", { key: 'f92f3a4f1f2c6fa6ae6cbc32c0868f22d68b9326', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '21937177748b5322178ae75db147cc3185db78ca', metadata: this.payment.metadata }))
+            h(DetailSectionTitle, { key: '4d0be28ad0075d2ff0a5565c90d202f767d70607', sectionTitle: 'Metadata' }),
+            h("div", { key: '88a5700230f8585eec6ea505fa5f9b05fa9f21ac', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'a9e61b8eef8e0c21ae4359e18e05856734661320', metadata: this.payment.metadata }))
         ])))));
     }
     static get watchers() { return {

package/dist/module/payment-method-option.js

@@ -14,7 +14,7 @@ const PaymentMethodOption$1 = /*@__PURE__*/ proxyCustomElement(class PaymentMeth
         this.__attachShadow();
     }
     render() {
-        return (h(StyledHost, { key: '8055addaf7563d5deb7d9b31794bf36e1d273a0d', class: "payment-method" }, h("div", { key: '5fb85a3e5c94eff4e397ba5b23d3fb7a34e4c312', class: "radio-list-item p-3", part: radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, h("form-control-radio", { key: 'b36c23bb6eeee3fc7325ea6d9b46aed4fc43c21c', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
+        return (h(StyledHost, { key: '42003535aac99ae51b47511facb02f602dff703d', class: "payment-method" }, h("div", { key: 'c1ad6051d7b2dd88d2a76cd94ed69fe3f7408c7d', class: "radio-list-item p-3", part: radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, h("form-control-radio", { key: '98ea069afd3e9d09ca8599ab35f998294046463a', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
     }
 }, [257, "payment-method-option", {
         "paymentMethodOptionId": [1, "payment-method-option-id"],

package/dist/module/payments-list-core2.js

@@ -118,7 +118,7 @@ const PaymentsListCore = /*@__PURE__*/ proxyCustomElement(class PaymentsListCore
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: 'f9fe216ea30123f3a7613b74371492fdefc1f4bc' }, h(TableComponent, { key: 'b081beffb783c9e351092947864649518fbe2dfc' }, h(TableHead, { key: 'e2e47a2122561e93163bf4d3794fe6b139a30ee9' }, h(TableHeadRow, { key: '0bb6d21213e5ab335c14057e69ecca70b0381578' }, this.paymentsTable.columnData.map((column) => column))), h(TableBody, { key: '9e411aaa4fb387fe4ee3d129f05e23438313ab65' }, h(TableLoadingState, { key: '42659fe4d9f41bff6165fc5016d6dc441e3d294a', columnSpan: this.paymentsTable.columnData.length, isLoading: this.loading }), h(TableEmptyState, { key: 'b5fb94bf87bae350b48fc6969acb3477eeeb2b1d', isEmpty: this.showEmptyState, columnSpan: this.paymentsTable.columnData.length }), h(TableErrorState, { key: '220b648eabf17bfd7006b23399fc38f17e5b6952', columnSpan: this.paymentsTable.columnData.length, errorMessage: this.errorMessage }), this.showRowData && this.paymentsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '1b77f14df195e1867f6ba037757350cc7b4fab96' }, h(TableFootRow, { key: '9baa94de37beec7a33fff9c9bbb83bdf2ad8fc16' }, h(TableFootCell, { key: '08a3c1d8ba7017f6bc6c60b4b33c319f59654731', colSpan: this.paymentsTable.columnData.length }, h("pagination-menu", { key: 'a3518ce532a7539c092dda6cae4bc318147d92ed', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: '76307f63befbd801b2268273998a68c364789765' }, h(TableComponent, { key: 'd7e218e903b790723eed0d30bdde0df40eb33c66' }, h(TableHead, { key: '34b69cab817edf8553550f590f904d345d29fdb4' }, h(TableHeadRow, { key: 'b069e490f737de01e1b86ccfb1b3022938c409a3' }, this.paymentsTable.columnData.map((column) => column))), h(TableBody, { key: '35a3714a44e7b8a7092557209c527e8874901546' }, h(TableLoadingState, { key: '299d8898d12b49511d2e13b2a3a441ee4ee83814', columnSpan: this.paymentsTable.columnData.length, isLoading: this.loading }), h(TableEmptyState, { key: '5a3a6e90e7d397dac6e1525150195aaf70e4b9b1', isEmpty: this.showEmptyState, columnSpan: this.paymentsTable.columnData.length }), h(TableErrorState, { key: 'ee92c41b21951e1427dc4c8a7e5afb2cb8639a29', columnSpan: this.paymentsTable.columnData.length, errorMessage: this.errorMessage }), this.showRowData && this.paymentsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '5daca871f3d06f99442fcb8d769c34c1620c88cc' }, h(TableFootRow, { key: 'accf3d1930b2cebf2c655ce278ed8c721717b909' }, h(TableFootCell, { key: '8ea7ab50123a5c98a44b170c3961a8b61bd6c6a0', colSpan: this.paymentsTable.columnData.length }, h("pagination-menu", { key: '47f5f719048054f691da8e2d174ec2bb783268f5', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
     }
     static get watchers() { return {
         "pagingParams": ["updateOnPropChange"],

package/dist/module/payout-details-core2.js

@@ -74,9 +74,9 @@ const PayoutDetailsCore = /*@__PURE__*/ proxyCustomElement(class PayoutDetailsCo
     }
     render() {
         var _a;
-        return (h(StyledHost, { key: 'f8f7a846e1c82a2d90231060286e8d2a906e1988' }, this.loading && h(PayoutDetailsLoading, { key: 'd626ef6861f8eba2235c0405e2229c75dc7972c6' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: '209795b172c2a5250726f56a767f8c1dc6e8723f', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: 'ab602bc00824f5364eb38366f5a11b7a9284eaad', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status), this.payout.settlement_priority === 'expedited' ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : (h(Badge, { variant: BadgeVariant.SECONDARY, title: "Standard", text: "Standard" })))), title: this.payout.formattedPaymentAmount(this.payout.amount) }, h(EntityHeadInfoItem, { key: '294f615d3eefd108719bd1c292b551cdf7c67b83', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: 'eff8af7b09d32e5c61fe764de075f67857381600', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: 'd1a5d5c36fd9a7a3e4a959d890b157e224e24277', title: "ID", value: this.payout.id }), h("div", { key: '9a0b3ac70bbe2290ec3aebf83ca4037fabbd41a4', class: "m-4" }, h(Button, { key: 'e50464088db095e913cc176fbc752576faf1e483', variant: "secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: 'c1ac03ad58a631076be03f0bc152ccb71c96dd3f', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '23168d82b011053fdde169653b9d38e9afd20ca8', sectionTitle: "Details" }), h("div", { key: 'a0d48c1064dacd030dfbdb038f7f7916216120e1', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '669f79459362f38d9a8e6d5b62cf7729749fe025', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: '31c91b0e512789303456bfb2eb177d4e88009ea9', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: 'd168b4c88d22850d35f57775fed8d2fd35ce2593', title: "Payout Method", value: this.payout.delivery_method }), h(DetailItem, { key: 'a17172ea263334a99136495c3b93534b6e913c92', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: 'f896659044741ac90391795322f7da5f46ea347e', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: '9acf299858e138e1774375f747cca3ce07d40a62', sectionTitle: "Account" }), h("div", { key: 'bd65f987d50082c875952f426ac233c3d7d7033b', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '89420940ff25dfa0cd5f74fdcaebb2e7d332881a', title: "ID", value: this.payout.account_id }), h(DetailItem, { key: '5283b7c63a70458185fdf9280af31b15023c983a', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '14e79f73210ac1e7c8542e3b5de9085b1ee21993', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: 'f2dbc9f4279068e9cd5f4e6c623e8d30468ff5cc', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: '8cf9051da522924f6134d9aa3eb5f49f0f91cb61', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), this.payout.metadata && [
-            h(DetailSectionTitle, { key: '8117a4636c6d41a0137bfd58c80eb4cfaa521627', sectionTitle: 'Metadata' }),
-            h("div", { key: '91ecdff8221e907542e7d026e354c78bdd577dd2', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'a1a8d86e784eadf48af99f6576f67f37b9b7d585', metadata: this.payout.metadata }))
+        return (h(StyledHost, { key: 'd65d95e351d19934faee7ccdf4da45a36d426556' }, this.loading && h(PayoutDetailsLoading, { key: 'a1451d9d4b694ec11ecf2a91a0dda82cc64b1ea3' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: '2e1264d0097a9fe9691f9492a1d761eaf8a1349b', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: '4d784a772f89210667a6a922945ab835857142e6', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status), this.payout.settlement_priority === 'expedited' ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : (h(Badge, { variant: BadgeVariant.SECONDARY, title: "Standard", text: "Standard" })))), title: this.payout.formattedPaymentAmount(this.payout.amount) }, h(EntityHeadInfoItem, { key: '8a68c23ee95181fe2f254248d089c51fac50adea', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: '3e1ff522083f9226716f3088e40a548ae5f5213d', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: '618260bfd3af2188862739d411ad27fd65c0c22e', title: "ID", value: this.payout.id }), h("div", { key: '2358eb5e66173f1d1746ba57e1e0e6ecc807c720', class: "m-4" }, h(Button, { key: '3b1faa1ea99dfc8fef63813115b4e0d74abf475d', variant: "secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: 'c7ccf575ab9c9b16781553e1cd24b7c919149419', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '308ed84f102229263c96eb356de642b0b488b30b', sectionTitle: "Details" }), h("div", { key: '179d6727dd1855e302d1496937882aa681684f35', class: "d-table gap-2 w-100" }, h(DetailItem, { key: 'ee71826ac9132dfeee95f95a7b1627e23fbb5c22', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: '905c50a423a0fc09bee87b8a21f4cb97b20e271a', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: 'eb61b7aae884c4b0fccc6e0d63e2b1b2988cdbe9', title: "Payout Method", value: this.payout.delivery_method }), h(DetailItem, { key: '630c244cddfa9f69e3334e81e0fe899715911944', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: '309e47c1fc2c229e396899e158fcb202854d3aec', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: '42cf4752be0db19e4b399ecc68a17b0debe30176', sectionTitle: "Account" }), h("div", { key: 'c420e79af3aca398c2195f0f33858555cb266e04', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '48b3b67ede46c4bc6aef2dbd7fa7f3b33776b371', title: "ID", value: this.payout.account_id }), h(DetailItem, { key: '0e569e60700592d33bc6a43d30aca37911c0f201', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: 'e5658f5dfe522a8c7ed9d4c4bf4989202fa64165', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '403329bffcee5b762670090065c70aafb13b5a60', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: '336601026906b39107b7d6ab667866c5f5141a6c', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), this.payout.metadata && [
+            h(DetailSectionTitle, { key: 'cfa4c97844a1659db6dd5e109691b4885c9778e5', sectionTitle: 'Metadata' }),
+            h("div", { key: '22014f2d1b3ccfb415892be531ee3dcaeaa4091f', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '6ae6a7adb3dc348c5af58bd49b1545f37e325972', metadata: this.payout.metadata }))
         ])))));
     }
     static get watchers() { return {

package/dist/module/payouts-list-core2.js

@@ -173,7 +173,7 @@ const PayoutsListCore = /*@__PURE__*/ proxyCustomElement(class PayoutsListCore e
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: 'b0566bb575439c658403df18ae94472f9b5f1ad4' }, h(TableComponent, { key: 'f8be406a444817869163952579b9cd4b52090d96' }, h(TableHead, { key: '033152e7e9519608465de2824b74c4348ff1f72d' }, h(TableHeadRow, { key: '8a63f9317ca024eb6c61e1871867deac4b518261' }, this.payoutsTable.columnData.map((column) => column))), h(TableBody, { key: 'b629a21c23c0ae3ca56d28918a35746b5cbcc715' }, h(TableLoadingState, { key: 'b9c373cbe8e039f94c27170dd65034caeccee74b', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '500b8df48a9a429b6a01bac63c189410ccec92d0', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: 'bdd34fcb481d09289b708698b82c60ad5dc067c2', columnSpan: this.payoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.payoutsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: 'a007cd03fda86b83f3d95b0321b12daf2fbf050d' }, h(TableFootRow, { key: 'eac8af33f784cf64bfdc80e9b51e849ba313ee71' }, h(TableFootCell, { key: '952d9b507169e5f56423031ae33f0177eb40022e', colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: '62fd97a74939bdb68ec9ba68ee893ba315e09e9e', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: '1755ee8bd42b276e1cc4ed7c9cf68bb994225164' }, h(TableComponent, { key: 'e7db23b5195bde527f1436f4cca8aeceed51669f' }, h(TableHead, { key: '8cd1cf32af3fa88b20cecd4b87cf3e9276380413' }, h(TableHeadRow, { key: 'ac3e4ccff0cbe1d29c28d4d10c70ab0436383727' }, this.payoutsTable.columnData.map((column) => column))), h(TableBody, { key: '5b528b6049499bc9ebf8a8c1c4d6ec2e667e7c66' }, h(TableLoadingState, { key: '0e0a3ba57229bbc5bf4eb0706db4513cc8b74dc8', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'edb4ca86e0275aaedb70cf5f28b32f577ada663a', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: 'c3a6c202754b5ae071347a66f8e8ed8da09390f2', columnSpan: this.payoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.payoutsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '949ae7cbd5de7bc34150ac1db0113ad8edf7b40b' }, h(TableFootRow, { key: '5e47e5489d8a7cd6a78105e0f01a42e703c03f0d' }, h(TableFootCell, { key: 'e83b0668b0c6ffdf836eaf5b2c33c9d508942c77', colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: '850c1f7e57a83b5c0c7ff10325bcfc798151ff16', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
     }
     static get watchers() { return {
         "pagingParams": ["updateOnPropChange"],