@justifi/webcomponents 6.10.3 → 6.11.0

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

@@ -7,7 +7,7 @@ import './Pagination.js';
 import './Business.js';
 import './ApplePay.js';
 import { f as filterParams, p as propsParams, c as clearParams } from './checkouts-list-params-state.js';
-import { a5 as checkoutsListFilterMenu, a6 as checkoutIdCheckoutsListFilterParam, a7 as statusCheckoutsListFilterParam, a8 as paymentModeCheckoutsListFilterParam, a9 as createdAfterCheckoutsListFilterParam, aa as createdBeforeCheckoutsListFilterParam } from './parts.js';
+import { ad as filterMenu, ae as filterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './event-types.js';
@@ -41,6 +41,7 @@ const CheckoutsListFilters = /*@__PURE__*/ proxyCustomElement(class CheckoutsLis
             status: this.checkoutStatus,
             payment_mode: this.paymentMode,
             checkout_id: this.checkoutId,
+            successful_payment_id: this.successfulPaymentId,
             created_after: this.createdAfter,
             created_before: this.createdBefore
         };
@@ -69,14 +70,15 @@ const CheckoutsListFilters = /*@__PURE__*/ proxyCustomElement(class CheckoutsLis
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '026d871e88f893ee2d565b13c72bdafaeedc1f9c' }, h("table-filters-menu", { key: 'a64b6212c54729cf08d0211720b815837187018b', params: filterMenuParams, clearParams: clearParams, part: checkoutsListFilterMenu }, h("div", { key: '11897ce900abc322fa0107516d350f53a857aa1c', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '9f926a008dc275e53aa1d82c09410e4f65b4221e', class: "p-2" }, h("form-control-text", { key: '57020a2320f442a0ee0a6ffa443f88dea855b651', name: "checkout_id", label: "Checkout ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.checkoutId || filterParams.checkout_id, disabled: !!this.checkoutId, part: checkoutIdCheckoutsListFilterParam })), h("div", { key: '40c6e5e2e342573fcb6e1f34309e324ca2a9ee2c', class: "p-2" }, h("form-control-select", { key: '7c70d0d6bdc322fc9682b3c64393778642fe8ad4', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || filterParams.status || '', disabled: !!this.checkoutStatus, part: statusCheckoutsListFilterParam })), h("div", { key: '51eb0d4cf8d3f9643af1f5fb8ef2e0908ebb18d3', class: "p-2" }, h("form-control-select", { key: '47352ceaa0f989533c366d68228cc2752ef12fec', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode || '', disabled: !!this.paymentMode, part: paymentModeCheckoutsListFilterParam })), h("div", { key: 'cee7d5487e1b4f6dd6c25230c012d69b97326392', class: "p-2" }, h("form-control-date", { key: '0b6e3821eda78c9dca9797d965020636ab31c9b9', 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: createdAfterCheckoutsListFilterParam })), h("div", { key: 'd4b38febbc6763c828761bb5eab3594bd3c29f9d', class: "p-2" }, h("form-control-date", { key: '3729809c6ec729c2c2887d722e16e29a9f405b09', 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: createdBeforeCheckoutsListFilterParam }))))));
+        return (h(StyledHost, { key: '8b9b9383e9b15d440fc3555bf3071ddb633cfb8b' }, h("table-filters-menu", { key: '588ab98c35a944eb4fd4855dc603f3f988fb8411', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: 'a52e4c7ed908568108031c9e43f41563dcec099c', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '26bdc175f9bb5c0d53e5d979a31ddbc60c8b1101', class: "p-2" }, h("form-control-text", { key: '46bf2d112facf89bb820a4f67936de87832e8283', name: "checkout_id", label: "Checkout ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.checkoutId || filterParams.checkout_id, disabled: !!this.checkoutId, part: filterParam })), h("div", { key: '441a50bf1ad6be8efc77d197927920ea8e4454de', class: "p-2" }, h("form-control-text", { key: '533c6cd714268d50eb212ea7a32538e68236b03a', name: "successful_payment_id", label: "Successful Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.successfulPaymentId || filterParams.successful_payment_id, disabled: !!this.successfulPaymentId, part: filterParam })), h("div", { key: 'bfd92f93d3fa3380ce858425f0032cb1fa6155e2', class: "p-2" }, h("form-control-select", { key: 'b35919ba574500a8921a6396c8c8e74b5a3555a4', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || filterParams.status || '', disabled: !!this.checkoutStatus, part: filterParam })), h("div", { key: '19dc994790222c1e7951275a93722affd30f3309', class: "p-2" }, h("form-control-select", { key: '6d5719c8080b2d2899b189ebbceeb538a2d4e6cb', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode || '', disabled: !!this.paymentMode, part: filterParam })), h("div", { key: '297fdb846109a9f88e6ba72fbf2d84aabadfcd11', class: "p-2" }, h("form-control-date", { key: '1385937605ae2d547a7c789b2a03f70cb53c59ef', 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: filterParam })), h("div", { key: 'b4bb5a4b6a5125d60ebb8820e0660d8505ecfc63', class: "p-2" }, h("form-control-date", { key: '91a48596c2411dfd185b791643a3329c81300628', 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: filterParam }))))));
     }
 }, [257, "justifi-checkouts-list-filters", {
         "checkoutStatus": [1, "checkout-status"],
         "paymentMode": [1, "payment-mode"],
         "checkoutId": [1, "checkout-id"],
+        "successfulPaymentId": [1, "successful-payment-id"],
         "createdAfter": [1, "created-after"],
         "createdBefore": [1, "created-before"]
     }]);

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

@@ -105,7 +105,7 @@ const CheckoutsList = /*@__PURE__*/ proxyCustomElement(class CheckoutsList exten
         }
     }
     render() {
-        return (h(StyledHost, { key: '08345e8bbe637cea344a232da2302bd0298a5ac9' }, h("checkouts-list-core", { key: '7aa34a0537810197cf6962d1a89e12e9ad9d8eea', getCheckouts: this.getCheckouts, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '4a6f911872310fdcb2600a6833eef5d7001033d6' }, h("checkouts-list-core", { key: 'd30b728b7ca2e6b1b26483f9a0c91b2afe7ea194', 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

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

package/dist/module/justifi-header2.js

@@ -20,7 +20,7 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
     }
     render() {
         const HeaderComponent = this.levels[this.level];
-        return (h(StyledHost, { key: '1fc31aaf9d222d4f53e4ca546fd323389f4154c3' }, h(HeaderComponent, { key: '6bc979a358b5a93159d378db2452b57133ed3aaa', text: this.text, class: this.class })));
+        return (h(StyledHost, { key: 'c1e23a5b492761bc527abc1bd59145dcd40b429f' }, h(HeaderComponent, { key: 'f7865a78f1671fdc7844805ef241188b5855afbf', text: this.text, class: this.class })));
     }
 }, [257, "justifi-header", {
         "text": [1],

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

@@ -1,5 +1,5 @@
 import { h, proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
-import { $ as heading4, a3 as heading5, Y as buttonPrimary, t as text } from './parts.js';
+import { $ as heading4, ab as heading5, Y as buttonPrimary, t as text } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './event-types.js';
@@ -206,7 +206,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: 'bb4aaf359b1511f493e10aeb574dfb33a5ca2834' }, h("div", { key: 'd09aef6864ba87fca3556f2e873dcf9ed2f988d4', part: text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
+        return (h(StyledHost, { key: 'e4a5a56a6876cbe10a51c95a24eaa7e8681916e0' }, h("div", { key: '094fce0c3c71c1bd09bb8a3052a3a484a20cd421', 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

@@ -14,7 +14,7 @@ import './details.js';
 import { T as TableClickActions } from './event-types.js';
 import './justifi-radio-list-item2.js';
 import { h as convertToLocal } from './utils2.js';
-import { w as tableHeadCell, ad as getAlternateTableCellPart } from './parts.js';
+import { w as tableHeadCell, ah as getAlternateTableCellPart } from './parts.js';
 import { d as defineCustomElement$2 } from './pagination-menu2.js';
 
 const makeGetPaymentTransactions = ({ id, authToken, service }) => async ({ params, onSuccess, onError, final }) => {
@@ -186,7 +186,7 @@ const PaymentTransactionsList = /*@__PURE__*/ proxyCustomElement(class PaymentTr
         return !this.showEmptyState && !this.showErrorState && !this.isLoading;
     }
     render() {
-        return (h(StyledHost, { key: '7aaa611cf9d23ff9244d8df54e57daa3ec08a635' }, h(TableWrapper, { key: 'd3f5244cfe909030c6072c7fdc4a5740029a4c17' }, h(TableComponent, { key: 'b0dc2044e5ee11b5d6a8298ed219c33f2bc42a35' }, h(TableHead, { key: '6a91d2b6968a6e969be3861c85b829c1ca5f899e' }, h(TableHeadRow, { key: 'ae84fd9d80b84054bfa1012137affa5c83b2be39' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '6a5cdec3190bb80ed3f78f295d07271838260fce' }, h(TableLoadingState, { key: '9fef843fa67a8049d77432d75f89446a2abe5ccc', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '3be23e217a98d0b2727dabc783134996ef0f9084', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '791ff61e65fb2f4e6a83f7d5142565b4a89106b5', 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: '898e2236fbed139f8196452463e3f248c01608d4' }, h(TableFootRow, { key: '9b416e1f6122d095b7516816ed686fe116479512' }, h(TableFootCell, { key: '6a12ce5ee3c5f28058ee5796cb174ef9fa4505b5', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '06984f04a928213ecbb6b3bf5acd3cb3a48e901f', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: '1d5d3794d15cce7b1c68cffc4f40afc22e4c5fd9' }, h(TableWrapper, { key: '26d9221971caea9439368b54ceae361c270f2ef7' }, h(TableComponent, { key: '82e7f2a431ea4ba39fd1d1ea42acf4a538c5cc8e' }, h(TableHead, { key: 'a24df861980ddc933aafa3547ece4fbb3fee105d' }, h(TableHeadRow, { key: '7f68e8247225c0fd65b84b8654ab8235905ac1d3' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '731ca899b5f99267e7b89ff6c70e5d261712479b' }, h(TableLoadingState, { key: '93a70a44b84d8e84c14524047d4195dd806ce6f5', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '004aa19b82b4cf23d598332cda26668d6365977e', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '7bfe7435981ef111334e10c34d92cf4a9c169416', 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: '054f18c77bde619212b8e66bcb4c94931ba278b4' }, h(TableFootRow, { key: '86ae9230a85986d6183ff17833b90ebde136f7ec' }, h(TableFootCell, { key: '437db60f446879f12bb76a7641ce15aa17053e1b', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: 'f42fb11d7ffcc52e8d7d8ac7e2b5c210444fa765', 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

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { l as lodashExports } from './lodash.js';
 import { f as filterParams, p as propsParams, c as clearParams } from './payments-list-params-state.js';
-import { ae as paymentsListFilterMenu, af as paymentIdPaymentsListFilterParam, ag as terminalIdPaymentsListFilterParam, ah as paymentStatusPaymentsListFilterParam, ai as paymentModePaymentsListFilterParam, aj as checkoutIdPaymentsListFilterParam, ak as accountHolderPaymentsListFilterParam, al as createdAfterPaymentsListFilterParam, am as createdBeforePaymentsListFilterParam } from './parts.js';
+import { ad as filterMenu, ae as filterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './event-types.js';
@@ -69,9 +69,9 @@ const PaymentsListFilters = /*@__PURE__*/ proxyCustomElement(class PaymentsListF
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '13aa135857848a72567599a2639488287ca39081' }, h("table-filters-menu", { key: 'ed4dd2ea5f26428f41fd54a477893dcb0fc149e1', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: '95eef3a3710f97e04626ebb8bee42229a63f3c5c', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'd803be62dd29001b14343e2c8319a9301c00d8dc', class: "p-2" }, h("form-control-text", { key: 'e7a6da04a9eb9b2d6fdbe4bbb22c98b96ccf5030', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: '3e36de2950a53a3db08f8647573c4032624d453b', class: "p-2" }, h("form-control-text", { key: '28d556adfd29c3d73f59de2cbf8bf78d34ca5766', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'e7645f939effafa3d9b300829b53521d4c9c758f', class: "p-2" }, h("form-control-select", { key: 'bb5e03857df5c49fe74fa518c5b81f86d3dd2885', 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: '181a66501584fadb10fee74215086bc215b271eb', class: "p-2" }, h("form-control-select", { key: '1e96d536e0aa91eb31b228710de7a3815717d003', name: "payment_mode", label: "Payment Mode", options: this.paymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode || '', disabled: !!this.paymentMode, part: paymentModePaymentsListFilterParam })), h("div", { key: '7512ec47150ba5112486fec46fc99b7c2a04e7dc', class: "p-2" }, h("form-control-text", { key: 'a2065eaa53b1ef12752c3969cb4dd8ff2694bd1d', name: "checkout_id", label: "Checkout ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.checkoutId || filterParams.checkout_id, disabled: !!this.checkoutId, part: checkoutIdPaymentsListFilterParam })), h("div", { key: 'c7921a2cd0bd2fe17b831052c4114b3e061a584d', class: "p-2" }, h("form-control-text", { key: 'f8176d5b682e37df29d03bc5bd48ab4ded36e179', name: "account_holder", label: "Account Holder", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.accountHolder || filterParams.account_holder, disabled: !!this.accountHolder, part: accountHolderPaymentsListFilterParam })), h("div", { key: 'fca79a82790ae8739872d9178ac1ae44f94a1513', class: "p-2" }, h("form-control-date", { key: 'e1a750350ec30a339c33d0b76bc6b7f045eb198b', 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: '18c93fdeec815743397ccbf1b8ed59144128d0ef', class: "p-2" }, h("form-control-date", { key: 'ded94e6169a8c3189e059353361b597926721cc1', 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 }))))));
+        return (h(StyledHost, { key: 'c23d82157dd765b66fe543532c6c7e3ff5a08581' }, h("table-filters-menu", { key: 'fe825b9df2a60075e7cf8367368dc6973b74e27a', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: 'dd0f17dac9f087b1333432c6bbe75acd2b9b7904', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '5e2581a9cd6f3ee954a6c786d068ca257d12a980', class: "p-2" }, h("form-control-text", { key: '2a5a4f455bc13835837c70a59665d05c3757f106', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: filterParam })), h("div", { key: 'b012b5f98e868b3a59f579d7a69c5cc97e83fb3d', class: "p-2" }, h("form-control-text", { key: '2548924366d327f5601b3aa828bbfe1afd7e0e56', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: filterParam })), h("div", { key: 'b83cadc6092c8399cdb7f8f4f377c20bd792bfff', class: "p-2" }, h("form-control-select", { key: '8274570ad09cd5d74a73f5f527d4ea4885ac0790', name: "payment_status", label: "Status", options: this.paymentStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentStatus || filterParams.payment_status || '', disabled: !!this.paymentStatus, part: filterParam })), h("div", { key: 'd9310627522415ab816c10052a46768b8d54b274', class: "p-2" }, h("form-control-select", { key: '2f4f5d0ea8a2b463036f954aead00d242078c901', name: "payment_mode", label: "Payment Mode", options: this.paymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode || '', disabled: !!this.paymentMode, part: filterParam })), h("div", { key: 'd604adc74f83ff5d2f9d9976ca12aa955b267d92', class: "p-2" }, h("form-control-text", { key: '9999c62ae3f576a662c40f0d35937ac8b7b3daa0', name: "checkout_id", label: "Checkout ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.checkoutId || filterParams.checkout_id, disabled: !!this.checkoutId, part: filterParam })), h("div", { key: 'ddc4d4b39c1cb223f862d4340d54c887ba1547f3', class: "p-2" }, h("form-control-text", { key: '62c1d665ec01bdafbb591ede396826dfa3fd7ae1', name: "account_holder", label: "Account Holder", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.accountHolder || filterParams.account_holder, disabled: !!this.accountHolder, part: filterParam })), h("div", { key: '8d2dae722e41ef80d71c039c75898c4ebf1a5399', class: "p-2" }, h("form-control-date", { key: '9474a5d13ccbdd6361958abbe1dcc4565db49089', 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: filterParam })), h("div", { key: '27338b915e79abd1966ed0953e8c5ee56a2d54c4', class: "p-2" }, h("form-control-date", { key: '21d865141256cb25d83c3de4d1623b3db8a1f27a', 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: filterParam }))))));
     }
 }, [257, "justifi-payments-list-filters", {
         "paymentId": [1, "payment-id"],

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

@@ -93,7 +93,7 @@ const PaymentsList = /*@__PURE__*/ proxyCustomElement(class PaymentsList extends
         }
     }
     render() {
-        return (h(StyledHost, { key: '7e8061d89c07cea6f86c61156bf82be507908bb4' }, h("payments-list-core", { key: '940a26c6b1590e4b95136262a116892281645c1d', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: 'bd9c796ee69445e241256843411b451e572d5321' }, h("payments-list-core", { key: '9521c57de8fbc5e854de042ce720841e769446af', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

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

@@ -14,7 +14,7 @@ import './details.js';
 import { T as TableClickActions } from './event-types.js';
 import './justifi-radio-list-item2.js';
 import { h as convertToLocal } from './utils2.js';
-import { w as tableHeadCell, ad as getAlternateTableCellPart } from './parts.js';
+import { w as tableHeadCell, ah as getAlternateTableCellPart } from './parts.js';
 import { d as defineCustomElement$2 } from './pagination-menu2.js';
 
 const makeGetPayoutTransactions = ({ accountId, authToken, service }) => async ({ params, onSuccess, onError, final }) => {
@@ -187,7 +187,7 @@ const PayoutTransactionsList = /*@__PURE__*/ proxyCustomElement(class PayoutTran
         return Object.assign({ payout_id: this.payoutId, limit: '15' }, this.pagingParams);
     }
     render() {
-        return (h(StyledHost, { key: '751cbfab0ac4ebff575c0d6e6677bea57498f720' }, h(TableWrapper, { key: 'c5e9ae5f08e8011efd13b8e8fc920af25ab6cd80' }, h(TableComponent, { key: 'c2dc2e83a70c9a888d7b24eedca47444fdd7df23' }, h(TableHead, { key: 'f6031a02be719e94d5b5f6e9b780bf11fa94024a' }, h(TableHeadRow, { key: 'efcbc758449f7949f206cf3406ea63913687ef16' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: '3e02a4b3d30c0e448ac8487ff1b10f0801c56972' }, h(TableLoadingState, { key: 'b2039804780914b796451e229a6d59e76987c8aa', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '020af52a09946e6711556e850a5bd973d0b8433d', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '299646c62cd4dc45d3c2ba02eb71be4506b2d11a', 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: '488b386f6f1bf9fd27a862a0061dabe9c567266a' }, h(TableFootRow, { key: '3d83e2c8b5b966ef54fbd9835cef7950c090d2af' }, h(TableFootCell, { key: 'cf4751107a9db70b50b010c1e0c31e9015d63fd8', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: '44e53f6fff05692d572bea438c06b3ec47a6fa00', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h(StyledHost, { key: '5720eed99cb9b95399c46e2472b02a70c1fa775a' }, h(TableWrapper, { key: '8b24888a5220944ab6be99421246e903ad9de6d9' }, h(TableComponent, { key: 'cb18148644180e357c8aca3eb5b4fc966ea2d9d5' }, h(TableHead, { key: 'e8fb0fceb3471ed1d96e3bf26c76664fc0992c98' }, h(TableHeadRow, { key: 'dee86ce853830c030a5a60e2d4d6ef9f8d5d8246' }, this.transactionsTable.columnData.map((column) => column))), h(TableBody, { key: 'd0621d65657ffdc545a10191b0debee1d1784d08' }, h(TableLoadingState, { key: 'd4d096bc66340ca51e4d8fe4e4a59c510f6d8b51', columnSpan: this.transactionsTable.columnKeys.length, isLoading: this.isLoading }), h(TableEmptyState, { key: '9262dcbbe2d7a43e04b241af7ca826531ee629eb', isEmpty: this.showEmptyState, columnSpan: this.transactionsTable.columnKeys.length }), h(TableErrorState, { key: '93eb78fda887c0e893bc5e5042675c9e5606c8ff', 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: '91b3c39985b8612ba62e6453f31e1ba1a05a842a' }, h(TableFootRow, { key: 'c37b899c8c3f5c944f4d75e5c633284aae5b8f57' }, h(TableFootCell, { key: '51730c9cb9d7affb7fcd5199a499183b5ad6aec7', colSpan: this.transactionsTable.columnData.length }, h("pagination-menu", { key: 'e338f5882afb1a71a8095f48fff5a599286a6994', 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

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { f as filterParams, p as propsParams, c as clearParams } from './payouts-list-params-state.js';
-import { an as payoutsListFilterMenu, ao as statusPayoutsListFilterParam, ap as createdAfterPayoutsListFilterParam, aq as createdBeforePayoutsListFilterParam } from './parts.js';
+import { ad as filterMenu, ae as filterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './event-types.js';
@@ -57,9 +57,9 @@ const PayoutsListFilters = /*@__PURE__*/ proxyCustomElement(class PayoutsListFil
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '3f9c92bb1c8343a585994ed1c5ca83167bb727f4' }, h("table-filters-menu", { key: '24541b92ce3c7849672a102423ba9a255766ab6c', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '4ff34c77d5e7604fdc7ce94a61c4d169b14365e5', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'f4b1a23f8751fce9885cd8d7b05d4a688b4a71e3', class: "p-2" }, h("form-control-select", { key: '37759ec95ccf6aec5a5259bdb182fd06897cb3c0', name: "status", label: "Status", options: this.statusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.status || filterParams.status || '', disabled: !!this.status, part: statusPayoutsListFilterParam })), h("div", { key: 'cc32187e2c4653b822e8de20305e771fea23e273', class: "p-2" }, h("form-control-date", { key: '69e75011e03b6adcfd1c5b9719c37102f7720804', 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: '9067d3377545bff47484289ef9e2a83eb40a76f6', class: "p-2" }, h("form-control-date", { key: '427582860a555d14a0e947e41c0f3d1417e83eeb', 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 }))))));
+        return (h(StyledHost, { key: 'f8e989bee50f9d877f46081060811c1e82d73fef' }, h("table-filters-menu", { key: '58f57d4b7cc46b06b90591cd978b83303bddd699', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: '4f8ce19e11804635b63e604968305fb331e82e8b', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '750eb629811a2695c94b12a055bfa583666fa9a0', class: "p-2" }, h("form-control-select", { key: '741c7cea7c16d5f750c4fb70036db61451f694b1', name: "status", label: "Status", options: this.statusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.status || filterParams.status || '', disabled: !!this.status, part: filterParam })), h("div", { key: '1da6031e4521d46c35819a3dca111e576f627719', class: "p-2" }, h("form-control-date", { key: '5b1f782e23da892428b0e8c4ec863a5119842841', 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: filterParam })), h("div", { key: 'a1b19375d9e7cd6ec6aaf86daa0b50f0af41aea6', class: "p-2" }, h("form-control-date", { key: '910a6d4dd397c09eaba5037f387014266de019f4', 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: filterParam }))))));
     }
 }, [257, "justifi-payouts-list-filters", {
         "status": [1],

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

@@ -107,7 +107,7 @@ const PayoutsList = /*@__PURE__*/ proxyCustomElement(class PayoutsList extends H
         }
     }
     render() {
-        return (h(StyledHost, { key: '482b4781f039e885ce1782e2817739fbc79994e5' }, h("payouts-list-core", { key: 'f38ce3000c1b7bc7f93aa5a1a4e87858f39d1456', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
+        return (h(StyledHost, { key: '444ba614ceace536170e1e068b67d33b6a876c14' }, h("payouts-list-core", { key: 'ff27c97d2a7f9c89f5028e0430585f88330564db', 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-skeleton.js

@@ -11,7 +11,7 @@ const JustifiSkeleton$1 = /*@__PURE__*/ proxyCustomElement(class JustifiSkeleton
         this.__attachShadow();
     }
     render() {
-        return (h(StyledHost, { key: 'b2bc4a92e34bdb2d1f5a1e74ce69bd75757ded6f' }, h(Skeleton, { key: '291eefa0f623d8c751a8a62f7da018bbcd3c2313', component: this.component, height: this.height, width: this.width, className: this.class, styles: this.customStyle })));
+        return (h(StyledHost, { key: 'd19fcf55df4b5b001d31af93c263fef39fc0d160' }, h(Skeleton, { key: '9ab49d76aa71146287fff2013050e008342f0275', component: this.component, height: this.height, width: this.width, className: this.class, styles: this.customStyle })));
     }
 }, [257, "justifi-skeleton", {
         "component": [1],

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

@@ -1,6 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { l as lodashExports } from './lodash.js';
 import { f as filterParams, p as propsParams, c as clearParams } from './terminal-orders-list-params-state.js';
-import { ar as terminalOrdersListFilterMenu, as as orderStatusTerminalOrdersListFilterParam, at as orderTypeTerminalOrdersListFilterParam, au as createdAfterTerminalOrdersListFilterParam, av as createdBeforeTerminalOrdersListFilterParam } from './parts.js';
+import { ad as filterMenu, ae as filterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './event-types.js';
@@ -11,9 +12,10 @@ import { T as TerminalOrderStatus, j as TerminalOrderType } from './Plaid.js';
 import './Pagination.js';
 import './Business.js';
 import './ApplePay.js';
-import { d as defineCustomElement$6 } from './custom-popper2.js';
-import { d as defineCustomElement$5 } from './form-control-date2.js';
-import { d as defineCustomElement$4 } from './form-control-select2.js';
+import { d as defineCustomElement$7 } from './custom-popper2.js';
+import { d as defineCustomElement$6 } from './form-control-date2.js';
+import { d as defineCustomElement$5 } from './form-control-select2.js';
+import { d as defineCustomElement$4 } from './form-control-text2.js';
 import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
 import { d as defineCustomElement$2 } from './table-filters-menu2.js';
 
@@ -33,11 +35,13 @@ const TerminalOrdersListFilters = /*@__PURE__*/ proxyCustomElement(class Termina
         };
     }
     componentWillLoad() {
+        this.debouncedSetParamsOnChange = lodashExports.debounce(this.setParamsOnChange, 300);
         const propsToSet = {
             order_status: this.orderStatus,
             order_type: this.orderType,
             created_after: this.createdAfter,
-            created_before: this.createdBefore
+            created_before: this.createdBefore,
+            company_name: this.companyName
         };
         Object.entries(propsToSet).forEach(([key, value]) => {
             if (value) {
@@ -65,21 +69,22 @@ const TerminalOrdersListFilters = /*@__PURE__*/ proxyCustomElement(class Termina
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: 'e10311bf0cdb5aab7ec7a96a05216bc39231db77' }, h("table-filters-menu", { key: '9402f8bd704c5d76504f0c7b3da78b51c519f69d', params: filterMenuParams, clearParams: clearParams, part: terminalOrdersListFilterMenu }, h("div", { key: '87af1b11432fc9dab0ce81e763e417e04d024dcc', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'b12db0f4cb4dd0256406db39cd585fbcb301f6e9', class: "p-2" }, h("form-control-select", { key: '50137d63a0f8fbf71fd0c49cb9227f180a5a4277', 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: 'aa5c6e5115a8e5fc0394fc36823a229643659968', class: "p-2" }, h("form-control-select", { key: '4b5d54c20275ff4951f9f26d780dfeab609a7b0e', 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: '6f1f85268e131865bcfc27395ca90b86f9e9aa30', class: "p-2" }, h("form-control-date", { key: '4c2173c3992e6dfd10d133c106e2b706d3ad6d10', 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: 'cc629832d18b1de06b3f513ca80648e4cf10f439', class: "p-2" }, h("form-control-date", { key: 'a4bb24199f37fce8f3971262fbe9cd62af7a18f5', 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 }))))));
+        return (h(StyledHost, { key: '7159c35aaf59635ec803fdfa8383817b50336a5d' }, h("table-filters-menu", { key: '864c07364558f1a6bb5b8cfd4ccee1f085c00d5e', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: 'c64f2a25818f2371d61451957daa3fd0af55e471', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '6809faa0d674e8f27bf3f426d07b1b3941d21544', class: "p-2" }, h("form-control-select", { key: '50cab5765526405a4d2270400010961474f8059c', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status || '', disabled: !!this.orderStatus, part: filterParam })), h("div", { key: 'e37bd6e54c5067ac6cf0d39ff258fb28eee3f582', class: "p-2" }, h("form-control-select", { key: 'ad3d829ef5c1c4e91e2eeaa45a34e54d1bb96473', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type || '', disabled: !!this.orderType, part: filterParam })), h("div", { key: 'bf26251fa2b4fffa9f33371e326fb05ceb214683', class: "p-2" }, h("form-control-date", { key: '282bb83c3e86fc9f98e9bc87579f2e742b2acbe4', 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: filterParam })), h("div", { key: '71ca8988d5093967310a2f7d93e4c81d96cbeeb4', class: "p-2" }, h("form-control-date", { key: 'dc4cc17eb30d59e7ecdee0ddfc34f19d49a1edc5', 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: filterParam })), h("div", { key: 'ca3d55cc2edabd65f42774bb64e26d840878c265', class: "p-2" }, h("form-control-text", { key: 'ccd777ad6fa3ac8af792e56507d938d5b1684d86', name: "company_name", label: "Company Name", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.companyName || filterParams.company_name, disabled: !!this.companyName, part: filterParam }))))));
     }
 }, [257, "justifi-terminal-orders-list-filters", {
         "orderStatus": [1, "order-status"],
         "orderType": [1, "order-type"],
         "createdAfter": [1, "created-after"],
-        "createdBefore": [1, "created-before"]
+        "createdBefore": [1, "created-before"],
+        "companyName": [1, "company-name"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-terminal-orders-list-filters", "custom-popper", "form-control-date", "form-control-select", "form-control-tooltip", "table-filters-menu"];
+    const components = ["justifi-terminal-orders-list-filters", "custom-popper", "form-control-date", "form-control-select", "form-control-text", "form-control-tooltip", "table-filters-menu"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-terminal-orders-list-filters":
             if (!customElements.get(tagName)) {
@@ -88,15 +93,20 @@ function defineCustomElement$1() {
             break;
         case "custom-popper":
             if (!customElements.get(tagName)) {
-                defineCustomElement$6();
+                defineCustomElement$7();
             }
             break;
         case "form-control-date":
             if (!customElements.get(tagName)) {
-                defineCustomElement$5();
+                defineCustomElement$6();
             }
             break;
         case "form-control-select":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "form-control-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }

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

@@ -99,7 +99,7 @@ const TerminalOrdersList = /*@__PURE__*/ proxyCustomElement(class TerminalOrders
         }
     }
     render() {
-        return (h(StyledHost, { key: '19a055907283ae2a126bdb2a509c3a4a991521f2' }, h("terminal-orders-list-core", { key: '04df9d1ce1cca14b07e879137abbced011d02486', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '4e2bbec59afc1541991ffa285010a144e134fa96' }, h("terminal-orders-list-core", { key: '5437117ec45fd7bf3ed81c0d373e5a50edd5b3cd', 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

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/clien
 import { l as lodashExports } from './lodash.js';
 import { e as convertToUTC, h as convertToLocal } from './utils2.js';
 import { f as filterParams, p as propsParams, c as clearParams } from './terminals-list-params-state.js';
-import { aw as terminalsListFilterMenu, ax as terminalIdTerminalsListFilterParam, ay as terminalOrderIdTerminalsListFilterParam, az as terminalStatusTerminalsListFilterParam, aA as createdAfterTerminalsListFilterParam, aB as createdBeforeTerminalsListFilterParam } from './parts.js';
+import { ad as filterMenu, ae as filterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './event-types.js';
@@ -41,6 +41,8 @@ const TerminalsListFilters = /*@__PURE__*/ proxyCustomElement(class TerminalsLis
             terminal_id: this.terminalId,
             status: this.terminalStatus,
             terminal_order_id: this.terminalOrderId,
+            provider_id: this.providerId,
+            serial_number: this.serialNumber,
             created_after: this.createdAfter,
             created_before: this.createdBefore
         };
@@ -62,11 +64,13 @@ const TerminalsListFilters = /*@__PURE__*/ proxyCustomElement(class TerminalsLis
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '0d4ac75610bd23b78f079d4f4eaf45345fa48cd4' }, h("table-filters-menu", { key: 'c580d67c2c1c95fdbfaa50ea355206d8772c8440', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '9d2d456d0806c48f73c9a035ca0f8f618390c644', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '93e926024eaaa5bc511c8c51daa8bab9704d8c89', class: "p-2" }, h("form-control-text", { key: 'c19f3177124b48882245ce4d11ef7735bb9cfd28', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: '78fc5aa6166a6e1a7f768584e73212dca1348461', class: "p-2" }, h("form-control-text", { key: 'd1ab7159dff99ca779fd4e3cd19e1c247cea2ec4', 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: '379f81c0242ceffc472cb5d502cebb0606f2d8c3', class: "p-2" }, h("form-control-select", { key: 'f5e7ed2157eacef4ab8ae560c15680b66049a044', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status || '', disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam })), h("div", { key: 'dc39eea94a616f40e896e9ce4c19e1d812419188', class: "p-2" }, h("form-control-date", { key: '403667bf603268954cc3982ba66d47badbcce911', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter || filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterTerminalsListFilterParam })), h("div", { key: '8a5ac2f05771f42b971e721277476194e2e92f4e', class: "p-2" }, h("form-control-date", { key: 'ae4d9ef25a06a319bdddda5c7023a69b9610ad49', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore || filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforeTerminalsListFilterParam }))))));
+        return (h(StyledHost, { key: 'ea9cfa8869d60008543e9ede0bc59ab6a6609fa4' }, h("table-filters-menu", { key: '2d72b1ead7a4d0bb039b940c90503ca55b69bdcb', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: '91494def7efaf06c16bfd6f2d8ffa4e6239b40dd', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'ea22abc671da4fad410be76055b2d7a3af98ae31', class: "p-2" }, h("form-control-text", { key: '053d7fda60174f71f35094bd11603ad00bfa8a76', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: filterParam })), h("div", { key: '531a673018101150063bf4a5c29be3bbd3a47d46', class: "p-2" }, h("form-control-text", { key: '01c0bcfcd4a8b45fc6d804d025bd2f99c96815a5', name: "terminal_order_id", label: "Terminal Order ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalOrderId || filterParams.terminal_order_id, disabled: !!this.terminalOrderId, part: filterParam })), h("div", { key: '3993c108c61dcc898f9feb965277d00fb6583de7', class: "p-2" }, h("form-control-text", { key: 'c28496ee67ed5e2d954b970fd1e8b4802f4f2847', name: "provider_id", label: "Device ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.providerId || filterParams.provider_id, disabled: !!this.providerId, part: filterParam })), h("div", { key: '8e7022438f266b7bfaf182593e32b7f85646e093', class: "p-2" }, h("form-control-text", { key: '855d524235f46809d236d0d8d4e11d5a0553114d', name: "serial_number", label: "Serial Number", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.serialNumber || filterParams.serial_number, disabled: !!this.serialNumber, part: filterParam })), h("div", { key: '48e099d2a8b600b11919945e99fd17559ba1b019', class: "p-2" }, h("form-control-select", { key: '4789b9f39ad91d7b8ca2e6614b8196ed48a4615a', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status || '', disabled: !!this.terminalStatus, part: filterParam })), h("div", { key: '4a07808567f36acfa238709f41f8642a83c54b7f', class: "p-2" }, h("form-control-date", { key: '1f35753ff8c241555adfbfff02af8a2640ad3905', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter || filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: filterParam })), h("div", { key: 'e9a3d3687026fb492c1b3bb33201f942a7cd07bc', class: "p-2" }, h("form-control-date", { key: '0fd59dce1c8cd1d44f1f2f1524c75f459f59e54b', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore || filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: filterParam }))))));
     }
 }, [257, "justifi-terminals-list-filters", {
         "terminalId": [1, "terminal-id"],
         "terminalOrderId": [1, "terminal-order-id"],
+        "providerId": [1, "provider-id"],
+        "serialNumber": [1, "serial-number"],
         "terminalStatus": [1, "terminal-status"],
         "createdAfter": [1, "created-after"],
         "createdBefore": [1, "created-before"]

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

@@ -104,7 +104,7 @@ const TerminalsList = /*@__PURE__*/ proxyCustomElement(class TerminalsList exten
         }
     }
     render() {
-        return (h(StyledHost, { key: 'dde640eb10f9e0f8e817afed66410042642b47e6' }, h("terminals-list-core", { key: '7e6a67f075c10cdedcd6e133aeedcd2fa9ba45ad', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: 'dbcf761d5519eb8d0170a7ff63dbba9e86a80931' }, h("terminals-list-core", { key: '6c74ff8e53cd94168a8d67bdea937be2c058d791', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

package/dist/module/justifi-tokenize-payment-method.js

@@ -38,7 +38,7 @@ const TokenizePaymentMethod = /*@__PURE__*/ proxyCustomElement(class TokenizePay
         return this.tokenizePaymentMethodRef.validate();
     }
     render() {
-        return (h("internal-tokenize-payment-method", { key: 'eeef0082ce936beae8d4ca51bb23bd7c965191ee', ref: (el) => this.tokenizePaymentMethodRef = el, authToken: this.authToken, accountId: this.accountId, disableCreditCard: this.disableCreditCard, disableBankAccount: this.disableBankAccount, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, hideSubmitButton: this.hideSubmitButton, paymentMethodGroupId: this.paymentMethodGroupId }));
+        return (h("internal-tokenize-payment-method", { key: '136cf8d3b079e2c0fb08fd55900a0c540ad43497', ref: (el) => this.tokenizePaymentMethodRef = el, authToken: this.authToken, accountId: this.accountId, disableCreditCard: this.disableCreditCard, disableBankAccount: this.disableBankAccount, hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, hideSubmitButton: this.hideSubmitButton, paymentMethodGroupId: this.paymentMethodGroupId }));
     }
 }, [257, "justifi-tokenize-payment-method", {
         "accountId": [1, "account-id"],

package/dist/module/modular-checkout.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as checkoutStore, a as onAnyChange, g as getAvailablePaymentMethodTypes, b as getCheckoutState } from './checkout.store.js';
+import { c as checkoutStore, o as onAnyChange, g as getAvailablePaymentMethodTypes, a as getCheckoutState } from './checkout.store.js';
 import { J as JustifiAnalytics, c as checkPkgVersion } from './Analytics.js';
 import './config-state.js';
 import './dinero.js';
@@ -471,7 +471,7 @@ const ModularCheckout = /*@__PURE__*/ proxyCustomElement(class ModularCheckout e
         });
     }
     render() {
-        return h(Host, { key: 'ee341d8d78767a80e2627ea5244ba46ca63cd8df' });
+        return h(Host, { key: 'dc4f1c1a2e9cc32100415e732817d4aaec063d89' });
     }
     get hostEl() { return this; }
 }, [256, "justifi-modular-checkout", {

package/dist/module/package.js

@@ -1,5 +1,5 @@
 const name = "@justifi/webcomponents";
-const version = "6.10.3";
+const version = "6.11.0";
 var webcomponentsPackageJson = {
 	name: name,
 	version: version};

package/dist/module/parts.js

@@ -16,7 +16,15 @@ const link = `link text ${fontFamily}`;
 const button = `button ${text}`;
 const buttonPrimary = `button-primary ${button}`;
 const buttonSecondary = `button-secondary ${button}`;
+const buttonDanger = `button-danger ${button}`;
+const buttonSuccess = `button-success ${button}`;
+const buttonWarning = `button-warning ${button}`;
+const buttonInfo = `button-info ${button}`;
+const buttonLight = `button-light ${button}`;
+const buttonDark = `button-dark ${button}`;
 const buttonLink = `button-link ${button}`;
+const buttonOutlinePrimary = `button-outline-primary ${button}`;
+const buttonOutlineSecondary = `button-outline-secondary ${button}`;
 const buttonLoading = `button-loading`;
 const buttonDisabled = `button-disabled ${button}`;
 // Input
@@ -97,45 +105,6 @@ const billingForm = `billing-form`;
 const checkoutSummary = `checkout-summary`;
 // Filters
 const filterMenu = `filter-menu`;
-// Payments List Filters
-const paymentsListFilterMenu = `${filterMenu} payments-list-filter-menu`;
-const paymentsListFilterParam = `payments-list-filter-param`;
-const paymentIdPaymentsListFilterParam = `${paymentsListFilterParam} payment-id-payments-list-filter-param`;
-const terminalIdPaymentsListFilterParam = `${paymentsListFilterParam} terminal-id-payments-list-filter-param`;
-const paymentStatusPaymentsListFilterParam = `${paymentsListFilterParam} payment-status-payments-list-filter-param`;
-const paymentModePaymentsListFilterParam = `${paymentsListFilterParam} payment-mode-payments-list-filter-param`;
-const checkoutIdPaymentsListFilterParam = `${paymentsListFilterParam} checkout-id-payments-list-filter-param`;
-const accountHolderPaymentsListFilterParam = `${paymentsListFilterParam} account-holder-payments-list-filter-param`;
-const createdAfterPaymentsListFilterParam = `${paymentsListFilterParam} created-after-payments-list-filter-param`;
-const createdBeforePaymentsListFilterParam = `${paymentsListFilterParam} created-before-payments-list-filter-param`;
-// Payouts List Filters
-const payoutsListFilterMenu = `${filterMenu} payouts-list-filter-menu`;
-const payoutsListFilterParam = `payouts-list-filter-param`;
-const statusPayoutsListFilterParam = `${payoutsListFilterParam} status-payouts-list-filter-param`;
-const createdAfterPayoutsListFilterParam = `${payoutsListFilterParam} created-after-payouts-list-filter-param`;
-const createdBeforePayoutsListFilterParam = `${payoutsListFilterParam} created-before-payouts-list-filter-param`;
-// Checkouts List Filters
-const checkoutsListFilterMenu = `${filterMenu} checkouts-list-filter-menu`;
-const checkoutsListFilterParam = `checkouts-list-filter-param`;
-const statusCheckoutsListFilterParam = `${checkoutsListFilterParam} checkout-status-checkouts-list-filter-param`;
-const paymentModeCheckoutsListFilterParam = `${checkoutsListFilterParam} payment-mode-checkouts-list-filter-param`;
-const checkoutIdCheckoutsListFilterParam = `${checkoutsListFilterParam} checkout-id-checkouts-list-filter-param`;
-const createdAfterCheckoutsListFilterParam = `${checkoutsListFilterParam} created-after-checkouts-list-filter-param`;
-const createdBeforeCheckoutsListFilterParam = `${checkoutsListFilterParam} created-before-checkouts-list-filter-param`;
-// Terminals List Filters
-const terminalsListFilterMenu = `${filterMenu} terminals-list-filter-menu`;
-const terminalsListFilterParam = `terminals-list-filter-param`;
-const terminalIdTerminalsListFilterParam = `${terminalsListFilterParam} terminal-id-terminals-list-filter-param`;
-const terminalOrderIdTerminalsListFilterParam = `${terminalsListFilterParam} terminal-order-id-terminals-list-filter-param`;
-const terminalStatusTerminalsListFilterParam = `${terminalsListFilterParam} terminal-status-terminals-list-filter-param`;
-const createdAfterTerminalsListFilterParam = `${terminalsListFilterParam} created-after-terminals-list-filter-param`;
-const createdBeforeTerminalsListFilterParam = `${terminalsListFilterParam} created-before-terminals-list-filter-param`;
-// Terminal Orders List Filters
-const terminalOrdersListFilterMenu = `${filterMenu} terminal-orders-list-filter-menu`;
-const terminalOrdersListFilterParam = `terminal-orders-list-filter-param`;
-const orderStatusTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} order-status-terminal-orders-list-filter-param`;
-const orderTypeTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} order-type-terminal-orders-list-filter-param`;
-const createdAfterTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} created-after-terminal-orders-list-filter-param`;
-const createdBeforeTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} created-before-terminal-orders-list-filter-param`;
+const filterParam = `filter-param`;
 
-export { heading4 as $, paginationButtonIconPrevious as A, paginationButtonText as B, paginationButtonIconNext as C, loadingSpinner as D, badgeDark as E, badgeLight as F, badgeInfo as G, badgeWarning as H, badgeDanger as I, badgeSuccess as J, badgeSecondary as K, badgePrimary as L, badge as M, alertDanger as N, inputCheckboxInvalid as O, inputCheckboxCheckedFocused as P, inputCheckboxFocused as Q, inputCheckboxChecked as R, inputCheckbox as S, inputAdornment as T, inputGroup as U, inputInvalidAndFocused as V, billingForm as W, heading3 as X, buttonPrimary as Y, buttonSecondary as Z, alert as _, heading1 as a, image as a0, buttonLink as a1, buttonLoading as a2, heading5 as a3, checkoutSummary as a4, checkoutsListFilterMenu as a5, checkoutIdCheckoutsListFilterParam as a6, statusCheckoutsListFilterParam as a7, paymentModeCheckoutsListFilterParam as a8, createdAfterCheckoutsListFilterParam as a9, createdAfterTerminalsListFilterParam as aA, createdBeforeTerminalsListFilterParam as aB, tableHead as aC, tableHeadRow as aD, tableRow as aE, tableFoot as aF, tableFootRow as aG, tableFootCell as aH, tableEmpty as aI, tableError as aJ, createdBeforeCheckoutsListFilterParam as aa, dropdownMenuButton as ab, dropdownMenu as ac, getAlternateTableCellPart as ad, paymentsListFilterMenu as ae, paymentIdPaymentsListFilterParam as af, terminalIdPaymentsListFilterParam as ag, paymentStatusPaymentsListFilterParam as ah, paymentModePaymentsListFilterParam as ai, checkoutIdPaymentsListFilterParam as aj, accountHolderPaymentsListFilterParam as ak, createdAfterPaymentsListFilterParam as al, createdBeforePaymentsListFilterParam as am, payoutsListFilterMenu as an, statusPayoutsListFilterParam as ao, createdAfterPayoutsListFilterParam as ap, createdBeforePayoutsListFilterParam as aq, terminalOrdersListFilterMenu as ar, orderStatusTerminalOrdersListFilterParam as as, orderTypeTerminalOrdersListFilterParam as at, createdAfterTerminalOrdersListFilterParam as au, createdBeforeTerminalOrdersListFilterParam as av, terminalsListFilterMenu as aw, terminalIdTerminalsListFilterParam as ax, terminalOrderIdTerminalsListFilterParam as ay, terminalStatusTerminalsListFilterParam as az, label as b, inputInvalid as c, inputDisabled as d, inputFocused as e, tooltipIcon as f, tooltip as g, heading2 as h, input as i, tooltipInner as j, textDanger as k, link as l, inputRadioInvalid as m, inputRadioCheckedFocused as n, inputRadioChecked as o, inputRadioFocused as p, inputRadio as q, radioListItem as r, skeleton as s, text as t, card as u, table as v, tableHeadCell as w, tableCell as x, paginationButton as y, paginationButtonDisabled as z };
+export { heading4 as $, paginationButtonIconPrevious as A, paginationButtonText as B, paginationButtonIconNext as C, loadingSpinner as D, badgeDark as E, badgeLight as F, badgeInfo as G, badgeWarning as H, badgeDanger as I, badgeSuccess as J, badgeSecondary as K, badgePrimary as L, badge as M, alertDanger as N, inputCheckboxInvalid as O, inputCheckboxCheckedFocused as P, inputCheckboxFocused as Q, inputCheckboxChecked as R, inputCheckbox as S, inputAdornment as T, inputGroup as U, inputInvalidAndFocused as V, billingForm as W, heading3 as X, buttonPrimary as Y, buttonSecondary as Z, alert as _, heading1 as a, image as a0, buttonLink as a1, buttonOutlineSecondary as a2, buttonOutlinePrimary as a3, buttonDark as a4, buttonLight as a5, buttonInfo as a6, buttonWarning as a7, buttonDanger as a8, buttonSuccess as a9, buttonLoading as aa, heading5 as ab, checkoutSummary as ac, filterMenu as ad, filterParam as ae, dropdownMenuButton as af, dropdownMenu as ag, getAlternateTableCellPart as ah, tableHead as ai, tableHeadRow as aj, tableRow as ak, tableFoot as al, tableFootRow as am, tableFootCell as an, tableEmpty as ao, tableError as ap, label as b, inputInvalid as c, inputDisabled as d, inputFocused as e, tooltipIcon as f, tooltip as g, heading2 as h, input as i, tooltipInner as j, textDanger as k, link as l, inputRadioInvalid as m, inputRadioCheckedFocused as n, inputRadioChecked as o, inputRadioFocused as p, inputRadio as q, radioListItem as r, skeleton as s, text as t, card as u, table as v, tableHeadCell as w, tableCell as x, paginationButton as y, paginationButtonDisabled as z };

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

@@ -63,16 +63,16 @@ const PaymentDetailsCore = /*@__PURE__*/ proxyCustomElement(class PaymentDetails
         return this.payment.status;
     }
     render() {
-        return (h(StyledHost, { key: '26b8d1cf265226bcc4507dad0cc3504e953a9389' }, this.loading && h(PaymentDetailsLoading, { key: 'd2410b583c52ca4fdab80657c82b512c4e936b87' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
-            this.payment && (h("justifi-details", { key: '9625a7b341ebab0736a5b1affd2507eaeb01aaea', errorMessage: this.errorMessage }, h(EntityHeadInfo, { key: 'e1da5f9932cb5ec4a9e9cbcc07637f16779e620f', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPaymentStatusToBadge(this.PaymentStatus), this.payment.expedited ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : null)), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: '5bf927cf2ab51c8057ff5f1d14d1fdb0112da302', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: 'dae7b63a0018af7ad5ff0b01303629b27f9e8690', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: '11c7090131fe05f995a34149e32167c50171ff4a', title: "ID", value: this.payment.id })), h("div", { key: 'ad1dafc96ed6041cc418f433dc2a941ccc1ed15e', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '4fc7d43271b7d4da55126380431fd304ec6b95ca', sectionTitle: "Details" }), h("div", { key: 'e884cca29436ae3e05c07c402c01f680395aadf8', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: 'd173c1ff5476adae63efd83c78cbd6da476893f3', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: 'c5307a082162dd6fde2e201916cb2d027b3ce1ff', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '3a8819d979eb5e49da51b80ac4cc40f9f7f06263', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: '3850b861daf0191dc2f8ebea04fe7aba4ab53bed', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: 'b48c9f01ec0fd622e4f01b6405cb4ca779113492', title: "Status", value: MapPaymentStatusToBadge(this.PaymentStatus) }), h(DetailItem, { key: '742432ff1e60ebc905ce10bfac6175855fa6ea69', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: 'aa9ff4ff17362b9b615dfbade88b89687e7a8791', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '1e37b41e112a2e04e646f599f6b9b99a5259b8c2', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: 'ec97d4f1f23083d7a780d0ccc71f4130a3553014', title: "Description", value: this.payment.description }), h(DetailItem, { key: '96b77660af6302edd62f73290811b517b39fb876', title: "Expedited", value: this.payment.expedited ? 'Yes' : 'No' })), this.payment.payment_method.card && [
-            h(DetailSectionTitle, { key: '29b79b7f832363f173a3e4befc31ac88ff574867', sectionTitle: "Payment Method" }),
-            h("div", { key: '206648ce629f705ab3483572dd2f01f1dd3bc03f', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '7c03a887918a0d9cb190c85c6dfedb89bee46b8b', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: '0cb8a2b0aed45ec1f9037bcb8c7df3fa7fe3a948', title: "Payment Type", value: "Card" }), h(DetailItem, { key: '6cf56554f1c2fe706191f3b101dbf2ecbbddf9db', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: 'a8dec356cac117498cebd61cb59ff2b4bcfc0c4c', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: '4703d991abab5ade33b1e5dd55d19290fe05ab72', title: "Cardholder", value: this.payment.payment_method.payersName }))
+        return (h(StyledHost, { key: 'b0ef5292b9f5e321bd5c66b4204f0f5262b4868d' }, this.loading && h(PaymentDetailsLoading, { key: 'aea26635451d6fb3833c50884b64968ae4e6d794' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
+            this.payment && (h("justifi-details", { key: '7cf33c1a29b2fb6d50ed57f6b84a61aa36fdbcca', errorMessage: this.errorMessage }, h(EntityHeadInfo, { key: '585d7d41bbfb41b04f703bc1bac1605426413540', slot: "head-info", badge: (h("div", { class: "d-flex gap-1" }, MapPaymentStatusToBadge(this.PaymentStatus), this.payment.expedited ? (h(Badge, { variant: BadgeVariant.WARNING, title: "Expedited", text: "Expedited" })) : null)), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: '9b231713501a12f4ac041cb87be8bb4e1b30fb26', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: '40381145240b3821787ca71a910a8fb709c8ce72', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: '9587a280a8747197c0bab21c92e875211e833ea1', title: "ID", value: this.payment.id })), h("div", { key: 'fe4949d10e1068a05dfab9cbe256e282a50beee1', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '336bfe5363f642a5cbc58cbd594b232a35e3427d', sectionTitle: "Details" }), h("div", { key: '3fbde5fd43e53b13037d79d75f0f3856c2e6d275', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '4260513ca15415d12d653aecafee9e93c8762b61', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: '1afa28ebb7873037b2881e3aec45820f0e7c1eec', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: 'ad63ad42b89bf2216924222cdb819b910d0f6ebf', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: '5c2fa5215f60d69e648116154e53a0492d5f16c3', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: 'dcd3b432ab38c1fe3be55bf13eec0cbfeafa4e3b', title: "Status", value: MapPaymentStatusToBadge(this.PaymentStatus) }), h(DetailItem, { key: '767ea4cecb0b162154945a537085d5c369db9c9c', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: '027efe0e16aba479cc0f9a1097a25ec8e03decbd', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '08d69878534824105dc3e0f5e9cf31d56abd6c25', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: 'aef3831a8a16a2e501ea45cbf8943b1a7e272f2c', title: "Description", value: this.payment.description }), h(DetailItem, { key: '12246613df2e322ea276269b897e321e4345e52c', title: "Expedited", value: this.payment.expedited ? 'Yes' : 'No' })), this.payment.payment_method.card && [
+            h(DetailSectionTitle, { key: '02d5be3b2e987842a97b0f0284b35ead993fb4d7', sectionTitle: "Payment Method" }),
+            h("div", { key: 'a92a78508d316490e2a3cdd0125d73221ca8b395', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '5a5c264f4fb7860f949c537460df12d79a79e583', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: '66545c5899ae5156ad9896d7a8b89931554ee854', title: "Payment Type", value: "Card" }), h(DetailItem, { key: '6ce2daaac72cb97f9369dd14ca0892cd29e2abe5', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: 'a0bd3851aa8beea81167c047d6a6540cda46e9df', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: 'a707a07e5ef07970a1d8aa10a564eaf045cce898', title: "Cardholder", value: this.payment.payment_method.payersName }))
         ], this.payment.payment_method.bank_account && [
-            h(DetailSectionTitle, { key: '6300a3fa99c4a0f81f0f8ff780aeb14b606a368e', sectionTitle: "Payment Method" }),
-            h("div", { key: '7b8fbfd356587b034791a0481f6cf54f31b99114', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: 'badbdc33521816af3a38c193fd89995b720dd53a', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: 'cdeff3c4459c2d29a48b631fa6ca6c81ba55dd6f', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: '2724fa6601bb5024b326853194764114115f0be2', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '236459bc401e59140bce119a0c5a12ea49d8835b', title: "Account Owner", value: this.payment.payment_method.payersName }))
+            h(DetailSectionTitle, { key: 'd61523f850e1d202731e32257382e82df7702566', sectionTitle: "Payment Method" }),
+            h("div", { key: '58c8f1ee69e360f3137f7dbbbc6207cfa7d8544d', class: "d-flex flex-column gap-2 w-100" }, h(DetailItem, { key: '7d4b9a3afdd5fdaf662ffdbc0eeeae0e973e3e0d', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: 'f02c0c07c3cc6b89605d98073b18cb247b796363', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: 'df94144bb5519de4d3432e31c7a2301a9ce0098b', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '7fe8d075f370afd3c64228d810cd8946f2631fa0', title: "Account Owner", value: this.payment.payment_method.payersName }))
         ], this.payment.metadata && [
-            h(DetailSectionTitle, { key: 'c80b4d1bd4dbc5f51848cfb1e886cd4c1c3f4026', sectionTitle: 'Metadata' }),
-            h("div", { key: 'bf7066df65a34cbb510aa3fdef414b27b622ff59', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '3a127cdeac5403079a3c822aeb40d6812e3fa914', metadata: this.payment.metadata }))
+            h(DetailSectionTitle, { key: '09f67f1719cf66843a50da15025f364efb485c49', sectionTitle: 'Metadata' }),
+            h("div", { key: '577995231bf0d25b11d90a10a98ae479236667c9', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'a17163d4ec63b650d645f9a4b8a6e5eb996f1269', metadata: this.payment.metadata }))
         ])))));
     }
     static get watchers() { return {

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

@@ -16,7 +16,7 @@ const PaymentMethodOption$1 = /*@__PURE__*/ proxyCustomElement(class PaymentMeth
         this.__attachShadow();
     }
     render() {
-        return (h(StyledHost, { key: 'cdf49c9446ea5fd6316523ecaf4f0f14be644e71', class: "payment-method" }, h("div", { key: '7de753f710389cbbb1d604ca5af97e1dfc5af2af', class: "radio-list-item p-3", part: radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, h("form-control-radio", { key: '7a3bb855c441031d7685aa23212cc471947108ec', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
+        return (h(StyledHost, { key: 'd52547314559d20607677dd96e1d7668ea527e5a', class: "payment-method" }, h("div", { key: '5d9fdf8edfe809299d5cf0d6636c7aa34853827c', class: "radio-list-item p-3", part: radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, h("form-control-radio", { key: '2519b4a0e1e38ae5ac9d9d8910ad9228282a09e7', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
     }
 }, [257, "payment-method-option", {
         "paymentMethodOptionId": [1, "payment-method-option-id"],