@justifi/webcomponents 5.3.4 → 5.3.5

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

@@ -4,12 +4,22 @@ import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import { c as checkPkgVersion } from './check-pkg-version.js';
 import { J as JustifiAnalytics } from './Analytics.js';
-import { C as ComponentErrorCodes, a as ComponentErrorSeverity } from './ComponentError.js';
+import { a as ComponentErrorSeverity, C as ComponentErrorCodes } from './ComponentError.js';
 import { B as BusinessService } from './business.service.js';
 import { E as ErrorState } from './utils.js';
 import { a as Business } from './Business.js';
 import { m as makeGetBusiness } from './get-business.js';
 import { S as Skeleton } from './skeleton.js';
+import './Checkout.js';
+import './Pagination.js';
+import './Payment.js';
+import { T as TerminalModel, a as TerminalOrder } from './SubAccount.js';
+import './Document.js';
+import { g as getErrorMessage, a as getErrorCode } from './utils4.js';
+import { T as TerminalService } from './terminal.service.js';
+import { d as defineCustomElement$4 } from './custom-popper2.js';
+import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
+import { d as defineCustomElement$2 } from './terminal-quantity-selector2.js';
 
 const FormBlock = () => (h("div", { class: "row gap-3" },
     h("div", { class: "col-12" },
@@ -31,6 +41,54 @@ const OrderTerminalsLoading = () => {
         h(FormBlock, null)));
 };
 
+const TerminalSelectorLoading = () => {
+    return (h("div", { class: "terminal-selector-skeleton mt-4 rounded shadow-sm" },
+        h("div", { class: "d-flex align-items-center gap-3" },
+            h(Skeleton, { width: "125px", height: "125px", styles: { borderRadius: '8px' } }),
+            h("div", { class: "flex-grow-1" },
+                h("div", { class: "d-flex row flex-row" },
+                    h("div", { class: "col-6 flex-column" },
+                        h(Skeleton, null),
+                        h(Skeleton, { width: "60%" })),
+                    h("div", { class: "d-flex justify-content-end align-items-center gap-2 col-6" },
+                        h(Skeleton, { width: "32px", height: "32px", styles: { borderRadius: '50%' } }),
+                        h(Skeleton, { width: "80px", height: "32px" }),
+                        h(Skeleton, { width: "32px", height: "32px", styles: { borderRadius: '50%' } }))),
+                h("div", { class: "mt-4" },
+                    h("div", { class: "d-flex flex-column gap-2" },
+                        h(Skeleton, null),
+                        h(Skeleton, null)))))));
+};
+
+const makeGetTerminalModels = ({ id, authToken, service }) => async ({ onSuccess, onError }) => {
+    var _a, _b, _c, _d;
+    try {
+        const response = await service.fetchTerminalModels(id, authToken);
+        if (!response.error) {
+            const terminals = ((_b = (_a = response.data) === null || _a === void 0 ? void 0 : _a.terminal_order_models) === null || _b === void 0 ? void 0 : _b.map((dataItem) => new TerminalModel(dataItem))) || [];
+            const orderLimit = (_c = response.data) === null || _c === void 0 ? void 0 : _c.order_limit;
+            onSuccess({ terminals, orderLimit });
+        }
+        else {
+            const responseError = getErrorMessage(response.error);
+            const code = getErrorCode((_d = response.error) === null || _d === void 0 ? void 0 : _d.code);
+            return onError({
+                error: responseError,
+                code,
+                severity: ComponentErrorSeverity.ERROR,
+            });
+        }
+    }
+    catch (error) {
+        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
+        return onError({
+            error: error.message || error,
+            code,
+            severity: ComponentErrorSeverity.ERROR,
+        });
+    }
+};
+
 const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals extends HTMLElement {
     constructor() {
         super();
@@ -39,16 +97,22 @@ const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals ext
         this.errorEvent = createEvent(this, "error-event", 7);
         this.businessId = undefined;
         this.authToken = undefined;
+        this.accountId = undefined;
         this.errorMessage = undefined;
-        this.isLoading = true;
+        this.businessIsLoading = true;
+        this.terminalsIsLoading = true;
         this.business = undefined;
+        this.terminalModels = undefined;
+        this.orderLimit = undefined;
+        this.order = new TerminalOrder({});
+        this.totalQuantity = 0;
     }
     componentWillLoad() {
         checkPkgVersion();
         this.analytics = new JustifiAnalytics(this);
-        this.initializeGetBusiness();
+        this.loadData();
     }
-    initializeGetBusiness() {
+    loadData() {
         if (!this.businessId || !this.authToken) {
             this.errorMessage = 'Invalid business id or auth token';
             this.errorEvent.emit({
@@ -58,6 +122,10 @@ const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals ext
             });
             return;
         }
+        this.initializeGetBusiness();
+        this.initializeGetTerminalModels();
+    }
+    initializeGetBusiness() {
         const getBusiness = makeGetBusiness({
             id: this.businessId,
             authToken: this.authToken,
@@ -66,7 +134,7 @@ const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals ext
         getBusiness({
             onSuccess: ({ business }) => {
                 this.business = new Business(business);
-                this.isLoading = false;
+                this.businessIsLoading = false;
             },
             onError: ({ error, code, severity }) => {
                 this.errorMessage = error;
@@ -75,40 +143,88 @@ const OrderTerminals = /*@__PURE__*/ proxyCustomElement(class OrderTerminals ext
                     message: error,
                     severity,
                 });
-                this.isLoading = false;
+                this.businessIsLoading = false;
             }
         });
     }
+    initializeGetTerminalModels() {
+        const getTerminalModels = makeGetTerminalModels({
+            id: this.accountId,
+            authToken: this.authToken,
+            service: new TerminalService(),
+        });
+        getTerminalModels({
+            onSuccess: ({ terminals, orderLimit }) => {
+                this.terminalModels = terminals;
+                this.orderLimit = orderLimit;
+                this.terminalsIsLoading = false;
+            },
+            onError: ({ error, code, severity }) => {
+                this.errorMessage = error;
+                this.errorEvent.emit({
+                    errorCode: code,
+                    message: error,
+                    severity,
+                });
+                this.terminalsIsLoading = false;
+            }
+        });
+    }
+    onSelectedQuantityChange(event) {
+        this.order.updateTerminal(event.detail.modelName, event.detail.quantity);
+        this.totalQuantity = this.order.totalQuantity;
+    }
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
-        return (h(StyledHost, { key: 'd5ac7406c2ec045832411cb7a7deecde13243a41' }, this.isLoading && h(OrderTerminalsLoading, { key: 'ec71fe4b766244bbf2c04714bca66b69f367ece5' }), !this.isLoading && this.errorMessage && ErrorState(this.errorMessage), !this.isLoading && !this.errorMessage && this.business && (h("div", { key: '6492a8df913cb3360153715192bd30d656df4968', class: "row gap-5 pt-5", part: text }, h("div", { key: '607b534001238efc4d226cb26d8f1c1288b5ac29', class: "row" }, h("div", { key: '55e7bae0aad2ae9ec9a28961269cd532a2e00922', class: "col-12" }, h("h2", { key: 'c4e01bd6e3a9e46cb15d8b72093dc9de2d463feb', part: heading4 }, "Business Information:"), h("p", { key: 'cd3c01f074c8d55b968e713ec4805a22f1ffc3ba' }, "Business Name: ", this.business.legal_name))), h("div", { key: '20062e4aa0cad46f002821972fec7ec1fc8be01e', class: "row" }, h("div", { key: '433a4a200edd564fa0d206378a706ad84aa2696e', class: "col-6" }, h("h2", { key: 'e4a4fc4c632ccb3b6b187ccb87fb5cce398e43ca', part: heading4 }, "Representative:"), h("ul", { key: '02449f299dddc9fee8544fed405acc436217a60b', class: "list-group", part: listGroup }, h("li", { key: 'a1eff4e8974b8fe57c206fb9c6ce30e89c79d702', class: "list-group-item", part: listGroupItem }, "Name: ", (_b = (_a = this.business) === null || _a === void 0 ? void 0 : _a.representative) === null || _b === void 0 ? void 0 :
-            _b.name), h("li", { key: '4e04f41d044b92560f401e6edbb1993b84fca7a6', class: "list-group-item", part: listGroupItem }, "Title: ", (_d = (_c = this.business) === null || _c === void 0 ? void 0 : _c.representative) === null || _d === void 0 ? void 0 :
-            _d.title), h("li", { key: 'b354a893098b9f26819ab34966a5e47226fd280b', class: "list-group-item", part: listGroupItem }, "Email: ", (_f = (_e = this.business) === null || _e === void 0 ? void 0 : _e.representative) === null || _f === void 0 ? void 0 :
-            _f.email), h("li", { key: 'd1d94089d4f7db78c64143820601b359a77ab09f', class: "list-group-item", part: listGroupItem }, "Phone: ", (_h = (_g = this.business) === null || _g === void 0 ? void 0 : _g.representative) === null || _h === void 0 ? void 0 :
-            _h.phone))), h("div", { key: '91ee402f8f7886c1750b8050433992cfd9964b02', class: "col-6" }, h("h2", { key: '143f76c17de7af724c325439767275efa7c8e903', part: heading4 }, "Shipping Address:"), h("ul", { key: 'dae75ec772c3971a9e690648e4e28b2eec22c638', class: "list-group", part: listGroup }, h("li", { key: '0d83cea35521361eee13912f1cb107bf7496abcc', class: "list-group-item", part: listGroupItem }, "Street: ", (_j = this.business.legal_address) === null || _j === void 0 ? void 0 :
-            _j.line1), h("li", { key: 'be4d3d8a0c61645ac4f622235f7ecf2f3ac8e097', class: "list-group-item", part: listGroupItem }, (_k = this.business.legal_address) === null || _k === void 0 ? void 0 : _k.line2), h("li", { key: '2572604b85008e401a835abdbf6c291c3191a9c7', class: "list-group-item", part: listGroupItem }, "Postal Code: ", (_l = this.business.legal_address) === null || _l === void 0 ? void 0 :
-            _l.postal_code), h("li", { key: 'e5fd5aa1d9b1bf78c75ca667b058629575be06d3', class: "list-group-item", part: listGroupItem }, "City: ", (_m = this.business.legal_address) === null || _m === void 0 ? void 0 :
-            _m.city), h("li", { key: '9acd18a7faed0ab283e110c616d9314410a93cee', class: "list-group-item", part: listGroupItem }, "State: ", (_o = this.business.legal_address) === null || _o === void 0 ? void 0 :
-            _o.state))))))));
+        return (h(StyledHost, { key: 'd0839c5f8e62091959cfac6c19fd8e6010ed17fa' }, this.businessIsLoading && h(OrderTerminalsLoading, { key: '4f2e27a144af74dc7a5b24afd04319169af85975' }), !this.businessIsLoading && this.errorMessage && ErrorState(this.errorMessage), !this.businessIsLoading && !this.errorMessage && this.business && (h("div", { key: '275c0bdc797dd7deb0b9a6e0bcb4b8bb1bb5a0c7', class: "gap-5 pt-5", part: text }, h("div", { key: '34cff142a272edd3ee7ac19da4e897dcbd29053a', class: "row" }, h("div", { key: '5ced2a28b10f3c3a6df1967df4ff3963fa210aeb', class: "col-12" }, h("h2", { key: 'cddb025d86d3b20e0fdbe44f38a01f4c9f8b0cc9', part: heading4 }, "Business Information:"), h("p", { key: '1729e714fbde0db3bfa2335b984191c88a821d48' }, "Business Name: ", this.business.legal_name))), h("div", { key: '07e0124bf74aa1e6019f3831e1101612ea22a974', class: "row" }, h("div", { key: '984fa3b23a5f963c0132db5629a84a0f33b5876f', class: "col-6" }, h("h2", { key: '620518c99e7c24323908964069a845bdc6bc7977', part: heading4 }, "Representative:"), h("ul", { key: '2a647948f4dd177f727caeb564874025e685154d', class: "list-group", part: listGroup }, h("li", { key: 'eef9b978a739e423e500f2c684adbd29b615d672', class: "list-group-item", part: listGroupItem }, "Name: ", (_b = (_a = this.business) === null || _a === void 0 ? void 0 : _a.representative) === null || _b === void 0 ? void 0 :
+            _b.name), h("li", { key: 'f668a95618f4f9f15a3f393e0f832edf019495d4', class: "list-group-item", part: listGroupItem }, "Title: ", (_d = (_c = this.business) === null || _c === void 0 ? void 0 : _c.representative) === null || _d === void 0 ? void 0 :
+            _d.title), h("li", { key: '7b0f4f9b59ce658b2589d794759a8eb2d286618d', class: "list-group-item", part: listGroupItem }, "Email: ", (_f = (_e = this.business) === null || _e === void 0 ? void 0 : _e.representative) === null || _f === void 0 ? void 0 :
+            _f.email), h("li", { key: '6868db3079895895817b46f577a4aec763370c8a', class: "list-group-item", part: listGroupItem }, "Phone: ", (_h = (_g = this.business) === null || _g === void 0 ? void 0 : _g.representative) === null || _h === void 0 ? void 0 :
+            _h.phone))), h("div", { key: '58e3a903859cfcb48ee9c94eae603e6013b49ddc', class: "col-6" }, h("h2", { key: '5575e0a3882f6118784f0a2ae5ba3b16ca2cf3d0', part: heading4 }, "Shipping Address:"), h("ul", { key: 'a786f951ba416a8a87b2cbd041208a00316a654c', class: "list-group", part: listGroup }, h("li", { key: 'f195e9fe86e532e5082fa6cec74d498fd3721b9f', class: "list-group-item", part: listGroupItem }, "Street: ", (_j = this.business.legal_address) === null || _j === void 0 ? void 0 :
+            _j.line1), h("li", { key: 'cc3effbf28ed5529ab453c9a3df593faed8453b0', class: "list-group-item", part: listGroupItem }, (_k = this.business.legal_address) === null || _k === void 0 ? void 0 : _k.line2), h("li", { key: '024d702c7483ff81ad3ac877b5ae708ca18f0441', class: "list-group-item", part: listGroupItem }, "Postal Code: ", (_l = this.business.legal_address) === null || _l === void 0 ? void 0 :
+            _l.postal_code), h("li", { key: 'b49173b42d91e1bad378912fb9ecf8cd74c38110', class: "list-group-item", part: listGroupItem }, "City: ", (_m = this.business.legal_address) === null || _m === void 0 ? void 0 :
+            _m.city), h("li", { key: '87656e83f01433a2f8116996d42e482a906fbc43', class: "list-group-item", part: listGroupItem }, "State: ", (_o = this.business.legal_address) === null || _o === void 0 ? void 0 :
+            _o.state)))))), this.terminalsIsLoading && (h("div", { key: 'f136b3b5ea1d28b8d4f2dcf18445c21afc8ff94b', class: "mt-5" }, h(TerminalSelectorLoading, { key: 'eaf847a6fa517aae9af8abd6138ea6b7084e26ab' }), h(TerminalSelectorLoading, { key: '9bc4ca1106c9c96b30d8318e11bca7d5b976dde2' }), h(TerminalSelectorLoading, { key: 'eb8885c81374329c42194e7a32c9031eeccf68ba' }))), !this.terminalsIsLoading && this.terminalModels && this.terminalModels.map((terminal) => (h("terminal-quantity-selector", { modelName: terminal.model_name, description: terminal.description, imageUrl: terminal.image_url, helpUrl: terminal.help_url, limit: this.orderLimit - this.order.totalQuantity, onSelectedQuantityChange: this.onSelectedQuantityChange.bind(this) })))));
     }
 }, [1, "justifi-order-terminals", {
         "businessId": [1, "business-id"],
         "authToken": [1, "auth-token"],
+        "accountId": [1, "account-id"],
         "errorMessage": [32],
-        "isLoading": [32],
-        "business": [32]
+        "businessIsLoading": [32],
+        "terminalsIsLoading": [32],
+        "business": [32],
+        "terminalModels": [32],
+        "orderLimit": [32],
+        "order": [32],
+        "totalQuantity": [32]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-order-terminals"];
+    const components = ["justifi-order-terminals", "custom-popper", "form-control-tooltip", "terminal-quantity-selector"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-order-terminals":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, OrderTerminals);
             }
             break;
+        case "custom-popper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "form-control-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "terminal-quantity-selector":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
     } });
 }
 defineCustomElement$1();

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

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { l as lodash } from './lodash.js';
 import { f as filterParams, p as propsParams, c as clearParams } from './payments-list-params-state.js';
-import { a6 as paymentsListFilterMenu, a7 as paymentIdPaymentsListFilterParam, a8 as terminalIdPaymentsListFilterParam, a9 as paymentStatusPaymentsListFilterParam, aa as createdAfterPaymentsListFilterParam, ab as createdBeforePaymentsListFilterParam } from './parts.js';
+import { a7 as paymentsListFilterMenu, a8 as paymentIdPaymentsListFilterParam, a9 as terminalIdPaymentsListFilterParam, aa as paymentStatusPaymentsListFilterParam, ab as createdAfterPaymentsListFilterParam, ac as createdBeforePaymentsListFilterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import { j as convertToUTC, h as convertToLocal } from './utils2.js';
@@ -59,8 +59,8 @@ const PaymentsListFilters = /*@__PURE__*/ proxyCustomElement(class PaymentsListF
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: 'fc2c0642fefbbd5e290e445bb652d4a6bf878855' }, h("table-filters-menu", { key: '0991a2c0ac9977236ad3ecae431b6ec572116452', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: 'fc74b64ab82764a35b9dc41ad6718537b3abe794', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '862104a2f6a1a1a383557674e8ddd530a9911d06', class: "p-2" }, h("form-control-text", { key: '59ca6de9b8bf3b0ea5dcba8ce03c8d56284fe389', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: 'e63dcf0e3ff092f10a42aef36dde96155cba1630', class: "p-2" }, h("form-control-text", { key: '96a2dcfcca5ae79d7a90b37fc75b79ec84947604', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'ba6dd2eab598382e10dd250805b393acfeac9567', class: "p-2" }, h("form-control-select", { key: '8d537d77bd56aca19fc1999fd64cf4b3cd92c51f', 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: '6c077d20829125817032eac487e0f8e9f86f5dcb', class: "p-2" }, h("form-control-date", { key: '97689bfe73b875a1355bc2ff114c554f15f61490', 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: 'dcdaf5b0068795b46b19302c2bdd532947e8fc00', class: "p-2" }, h("form-control-date", { key: '991f8fc8e7f3af364db40f92e43d90cd40714e6d', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+        return (h(StyledHost, { key: 'c00c7c279eeaacb8acc1ea3154c29b2cddd99faa' }, h("table-filters-menu", { key: 'c47ba2b6da0f9463a22e50f1a8ffd26e886c1a99', params: filterMenuParams, clearParams: clearParams, part: paymentsListFilterMenu }, h("div", { key: 'e93077f53d6d22fc286701c28352872175b8db3b', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'a101154b3b747eb20667e64dac36e00d7f35f56c', class: "p-2" }, h("form-control-text", { key: '3042199c9a79162c5c5bc6053c46bc76b9f553ee', name: "payment_id", label: "Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.paymentId || filterParams.payment_id, disabled: !!this.paymentId, part: paymentIdPaymentsListFilterParam })), h("div", { key: '8877a68b1dfc50116f59e503db6d8a3afc53616d', class: "p-2" }, h("form-control-text", { key: '40747d56f2907151ee86468ecb5b72457fa4c3f6', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdPaymentsListFilterParam })), h("div", { key: 'ddb445d4da2e8f625c091c41ac080be8ae0a7b8d', class: "p-2" }, h("form-control-select", { key: '9cfe853ab39f60ed7c9130f49059b731ce308af9', 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: '4a22a12131ae097c774d6f3af3a93de7c984ff76', class: "p-2" }, h("form-control-date", { key: '0ab671ac93fe922a72f85de5bd0b00781176a61f', 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: '11d71b25672f27f3457386f960ac85f644e162de', class: "p-2" }, h("form-control-date", { key: 'd03ee67df04aa591c655944465fec021684f2b3a', 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 }))))));
     }
 }, [1, "justifi-payments-list-filters", {

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

@@ -93,7 +93,7 @@ const PaymentsList = /*@__PURE__*/ proxyCustomElement(class PaymentsList extends
         }
     }
     render() {
-        return (h(StyledHost, { key: 'e03e05c3cb3c8dbaf0a5e982958345feccec1902' }, h("payments-list-core", { key: '05f2b38a6a854e2e08bdd559e7e8dfab2d80f398', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '8df5e9111900d12bb5e4eea2ad44c59b7864cf58' }, h("payments-list-core", { key: 'ad6c2795436b8fc38f5fb7b031d3b41251a6281d', getPayments: this.getPayments, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["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 { ac as payoutsListFilterMenu, ad as createdAfterPayoutsListFilterParam, ae as createdBeforePayoutsListFilterParam } from './parts.js';
+import { ad as payoutsListFilterMenu, ae as createdAfterPayoutsListFilterParam, af as createdBeforePayoutsListFilterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import { j as convertToUTC, h as convertToLocal } from './utils2.js';
@@ -37,8 +37,8 @@ const PayoutsListFilters = /*@__PURE__*/ proxyCustomElement(class PayoutsListFil
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '195227f14aa0fc371cc2ceb62089b26df8491525' }, h("table-filters-menu", { key: '86cc1b04b210cf0cd3fc422438b1cdfc7c0b4242', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: 'c75c167f849c5f0558bf7b0569f6f79083b858f0', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '09d46810296de9dc272f66ce2bd3ba726ebc6386', class: "p-2" }, h("form-control-date", { key: '0bbd9294c788f2dada3e8630e32619e1730f7b40', 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: 'c238988bd2b31b0374e515713fc2c55f59d6f9ba', class: "p-2" }, h("form-control-date", { key: '188106d28d4ac201e48b45e3ce417f26621af46a', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDate: true }) ||
+        return (h(StyledHost, { key: '42c48bbbfa426540d33c49d5ef927d2da316fda5' }, h("table-filters-menu", { key: '7741ef6667ed7dc6ebbc312f145590939ce1b071', params: filterMenuParams, clearParams: clearParams, part: payoutsListFilterMenu }, h("div", { key: '0f983dc3e6a735ad12aea940d7663bab98cf623d', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '27faddc94394d5e52de9d1a65a69ecda2f840360', class: "p-2" }, h("form-control-date", { key: '58cd7720a5dbcc31b32151de1402b2c4b09b94de', 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: 'a2a8d153acc9fa8371c8effb4cfd0146e31a3018', class: "p-2" }, h("form-control-date", { key: '9fc58f04079445952586d0913fad92305fa537a8', 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 }))))));
     }
 }, [1, "justifi-payouts-list-filters", {

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

@@ -115,7 +115,7 @@ const PayoutsList = /*@__PURE__*/ proxyCustomElement(class PayoutsList extends H
         }
     }
     render() {
-        return (h(StyledHost, { key: '259a62df9d161fc97d731ccc8488f556580f5378', exportedparts: tableExportedParts }, h("payouts-list-core", { key: '9733d459d09173f4b9dec953d9c763910ac54e1d', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
+        return (h(StyledHost, { key: '1dc2cb28607d7afaaf9d463633a3c127e79acdfb', exportedparts: tableExportedParts }, h("payouts-list-core", { key: 'c404ee62ba0a0e6ed800073d0740182e831b3610', 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-refund-form.js

@@ -100,7 +100,7 @@ const RefundForm = /*@__PURE__*/ proxyCustomElement(class RefundForm extends HTM
     }
     render() {
         var _a;
-        return (h(StyledHost, { key: '10aa3a31daedcb1bc4213abb3062b09745427370' }, h("h1", { key: '1b0b9c6a22dda364275f6da46e8e58015eb3378d' }, "Refund"), this.refundInfoText && (h("div", { key: '1d51f74c4e2c6419afe046a95f23f16f99209982', class: "d-flex align-items-center flex-row gap-4 border-top border-bottom my-4 p-3", role: "alert" }, h("img", { key: '4d6b0140f2bd3666000df1374a2ab6573ce2a7ee', src: "/info-icon.svg", alt: "Information", height: "30", width: "30" }), h("p", { key: '1e740ebd882fd08df43d23919325f6556ac04b29', class: "m-0", innerHTML: this.refundInfoText }))), h("form", { key: '242bfd0f2a30be1fdaa477341e2d480108633551', onSubmit: e => this.handleSubmit(e), class: "d-grid gap-4" }, h("div", { key: '681a00fc41eb1701f8f189fa5139bf42ce43453f', class: "form-group" }, h("form-control-monetary", { key: '2f5a906d7a415391a339236d7e7e189db4febd95', name: "amount", label: "Refund Amount", defaultValue: ((_a = this.amount) === null || _a === void 0 ? void 0 : _a.toString()) || '', maskOptions: CURRENCY_MASK.DECIMAL, inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.amount })), h("div", { key: '9f0f6b5c2f5010ba1c51757bf4667ced40615738', class: "form-group" }, h("form-control-text", { key: 'c4f9a4431224763820dacc404ea1b693630a7ede', name: "notes", label: "Additional Notes", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.notes })), this.withButton && (h("div", { key: 'df5d528c865684da0c7583114a7d02b6cb6d5a6e', class: "form-group d-flex flex-row-reverse" }, h("button", { key: '05af832414b65d41760ca6d8b001a4affbf807c4', type: "submit", disabled: !!this.isSubmitting, class: "btn btn-primary ml-auto" }, this.submitButtonText))))));
+        return (h(StyledHost, { key: 'b5540793d02eca530f994d28487dbb17d4a7bde9' }, h("h1", { key: '4fdee343ce80c42f4592b8399d2608cf21388ef3' }, "Refund"), this.refundInfoText && (h("div", { key: '592e0e5bf3f34d2deacf6bde6d55305afad9ed93', class: "d-flex align-items-center flex-row gap-4 border-top border-bottom my-4 p-3", role: "alert" }, h("img", { key: '0d1f91e3e31d9205bdc87988a3d153c82c288316', src: "/info-icon.svg", alt: "Information", height: "30", width: "30" }), h("p", { key: '5509b76cdd8fc744b243342c70f9f17a53998f58', class: "m-0", innerHTML: this.refundInfoText }))), h("form", { key: '54c976a7e5f2eabef889051900065fdc689929dc', onSubmit: e => this.handleSubmit(e), class: "d-grid gap-4" }, h("div", { key: '8c8b2a532b0eb147b6618e4d9f5a6eff459a876f', class: "form-group" }, h("form-control-monetary", { key: 'b5e5101c9c3a911d5188b7fcf1bc8b6a6a3ea79f', name: "amount", label: "Refund Amount", defaultValue: ((_a = this.amount) === null || _a === void 0 ? void 0 : _a.toString()) || '', maskOptions: CURRENCY_MASK.DECIMAL, inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.amount })), h("div", { key: 'df2344c5721515f540a880e0fd69c44dc9782c7f', class: "form-group" }, h("form-control-text", { key: 'fc736f897af16d21bae503593b7dea26de8775c8', name: "notes", label: "Additional Notes", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.notes })), this.withButton && (h("div", { key: 'db7b4908952001857d7a56d2bce6804fa4c77176', class: "form-group d-flex flex-row-reverse" }, h("button", { key: 'f4a186765f14c59e4c096bf48dba5f371f1a65fb', type: "submit", disabled: !!this.isSubmitting, class: "btn btn-primary ml-auto" }, this.submitButtonText))))));
     }
 }, [1, "justifi-refund-form", {
         "authToken": [1, "auth-token"],

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

@@ -32,7 +32,7 @@ const TerminalOrdersList = /*@__PURE__*/ proxyCustomElement(class TerminalOrders
         }
     }
     render() {
-        return (h(StyledHost, { key: '54ebb6b9b12b123caaa6d5190d0a1c6c2198d3e3' }, h("terminal-orders-list-core", { key: '99376fd9a6b5657d8777a4873f16b98a4bcf03cf', getTerminalOrders: this.getTerminalOrders, columns: this.columns })));
+        return (h(StyledHost, { key: 'f64c444f9e93c3f520bd5c119b49b6b51163e03b' }, h("terminal-orders-list-core", { key: 'd7601588a25fd5ee08ad8faddc02807a61015d15', getTerminalOrders: this.getTerminalOrders, columns: this.columns })));
     }
 }, [1, "justifi-terminal-orders-list", {
         "businessId": [1, "business-id"],

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

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { l as lodash } from './lodash.js';
 import { f as filterParams, p as propsParams, c as clearParams } from './terminals-list-params-state.js';
-import { af as terminalsListFilterMenu, ag as terminalIdTerminalsListFilterParam, ah as terminalStatusTerminalsListFilterParam } from './parts.js';
+import { ag as terminalsListFilterMenu, ah as terminalIdTerminalsListFilterParam, ai as terminalStatusTerminalsListFilterParam } from './parts.js';
 import { S as StyledHost } from './styled-host.js';
 import './details.js';
 import './ComponentError.js';
@@ -50,7 +50,7 @@ const TerminalsListFilters = /*@__PURE__*/ proxyCustomElement(class TerminalsLis
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        return (h(StyledHost, { key: '9e55f56855ebf7f0755c5750bfe4ae57bcc2a48e' }, h("table-filters-menu", { key: 'dae12779f49c3264cb3a5362cc4e4edc2aa6447c', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '9767d61b94a7de6bc290a1dc97e5ecdb7e75beb8', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'cab20a5aab288920f205835c4343b44502cc4a1e', class: "p-2" }, h("form-control-text", { key: '58600a426dded8a9efc05e444439c36e3eab5bc8', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: '81f513ae03435ea2c97e43f460aab430ebd4a490', class: "p-2" }, h("form-control-select", { key: 'ee04592e4f117f7b58984932d10081a4383d7a65', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
+        return (h(StyledHost, { key: 'c0dc68ecfc49cbb1ec3297c1ae9b66e4d21fecc5' }, h("table-filters-menu", { key: '74a2627c14a61251052647bc41b6a9d331f04a20', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '0aa6684df6548ffc721507ba11d8494a7ac56d46', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '6cb0918e840d7651e41b11c262cae4c6932c32ef', class: "p-2" }, h("form-control-text", { key: 'b5b134f5c243596b1232404b8f341bd46f69ae40', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: '8d88708e80c08fcfa9fb204afa1b0aade761d440', class: "p-2" }, h("form-control-select", { key: 'cfd6300240fd31d6e826f9f0662cdabf5b950497', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
     }
 }, [1, "justifi-terminals-list-filters", {
         "terminalId": [1, "terminal-id"],

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

@@ -2,11 +2,11 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/i
 import { a as ComponentErrorSeverity, C as ComponentErrorCodes } from './ComponentError.js';
 import { J as JustifiAnalytics } from './Analytics.js';
 import { c as checkPkgVersion } from './check-pkg-version.js';
-import { A as Api } from './Api.js';
+import { T as TerminalService } from './terminal.service.js';
 import './Checkout.js';
 import './Pagination.js';
 import './Payment.js';
-import { T as Terminal } from './SubAccount.js';
+import { b as Terminal } from './SubAccount.js';
 import './Document.js';
 import { g as getErrorMessage, a as getErrorCode } from './utils4.js';
 import { m as makeGetSubAccounts, S as SubAccountService } from './get-subaccounts.js';
@@ -15,19 +15,6 @@ import './details.js';
 import { d as defineCustomElement$2, a as defaultColumnsKeys } from './terminals-list-core2.js';
 import { d as defineCustomElement$3 } from './pagination-menu2.js';
 
-class TerminalService {
-    async fetchTerminals(accountId, authToken, params, apiOrigin = "https://wc-proxy.justifi.ai") {
-        const headers = { Account: accountId };
-        const api = Api({ authToken, apiOrigin });
-        const endpoint = 'terminals';
-        return api.get(endpoint, params, null, headers);
-    }
-    async fetchTerminal(terminalId, authToken, apiOrigin = "https://wc-proxy.justifi.ai") {
-        const endpoint = `terminals/${terminalId}`;
-        return Api({ authToken, apiOrigin: apiOrigin }).get(endpoint);
-    }
-}
-
 const makeGetTerminals = ({ id, authToken, service, apiOrigin }) => async ({ params, onSuccess, onError }) => {
     var _a, _b;
     try {
@@ -119,7 +106,7 @@ const TerminalsList = /*@__PURE__*/ proxyCustomElement(class TerminalsList exten
         }
     }
     render() {
-        return (h(StyledHost, { key: '1534781e6264057b7c780e6b44f4a7a66a561296' }, h("terminals-list-core", { key: '8c0fb664d5ebe4fedcf6e45046e931adffb9d381', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '8829e2070592554b23ea8593c2528a6582374b1e' }, h("terminals-list-core", { key: '7dfa54f94366214f53fae5240050955a5f5750f4', 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

@@ -84,7 +84,7 @@ const TokenizePaymentMethod = /*@__PURE__*/ proxyCustomElement(class TokenizePay
         this.paymentMethodOptionsRef.fillBillingForm(fields);
     }
     render() {
-        return (h(StyledHost, { key: 'ac989aa84f6262ff1b72a88fc7c4ebb0e62175dc' }, h("form", { key: '482ebf3ca3ac67738fdd0243de8d29ad66754313' }, h("fieldset", { key: 'e563783b34d570bafd1788949a486454ce70ab4a' }, h("div", { key: 'a42f5625f5d0860153f4260aa9c5f76f4afcad06', class: "row gy-3" }, h("div", { key: 'f64bb331c9922be711bfdd9a50d76530773867c0', class: "col-12" }, h("justifi-payment-method-options", { key: 'dc23821a9130ee6435c92e20574a0bf056e1c29c', ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": false, paymentMethodGroupId: this.paymentMethodGroupId, "show-saved-payment-methods": false, hideCardBillingForm: this.hideCardBillingForm, authToken: this.authToken, "account-id": this.accountId, iframeOrigin: this.iframeOrigin })), h("div", { key: '29ec96487c4a5d54c4883c4cfe4a6ee4a309042f', class: "col-12" }, h(Button, { key: 'fe116e392e79debf6a858c993ba11a21d417d998', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.hideSubmitButton }, this.submitButtonText || 'Submit')))))));
+        return (h(StyledHost, { key: '8377b1e614cb8c1f737ce7f81b35017c7bf4b390' }, h("form", { key: 'a30d047312977dec17fc810dd7039d64a71396d0' }, h("fieldset", { key: 'ffda409f721f09fef1397cef899b49c2f70d51e3' }, h("div", { key: 'cbaa2c97e2be236df2f2e7e3a1df0eca0b20f75a', class: "row gy-3" }, h("div", { key: 'cc9bac328a0feaf2c1754c50e9790eb1dbd04768', class: "col-12" }, h("justifi-payment-method-options", { key: 'bc646adf579be124bc110aa04256bcafe419ca3b', ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": false, paymentMethodGroupId: this.paymentMethodGroupId, "show-saved-payment-methods": false, hideCardBillingForm: this.hideCardBillingForm, authToken: this.authToken, "account-id": this.accountId, iframeOrigin: this.iframeOrigin })), h("div", { key: 'e65e8a79fd265a053e46e9ee215f84abb57e1212', class: "col-12" }, h(Button, { key: 'f568dc1cb0c6ca2f22897b3ad94f37383ac8ac26', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.hideSubmitButton }, this.submitButtonText || 'Submit')))))));
     }
 }, [1, "justifi-tokenize-payment-method", {
         "authToken": [1, "auth-token"],

package/dist/module/package.js

@@ -1,5 +1,5 @@
 const name = "@justifi/webcomponents";
-const version = "5.3.4";
+const version = "5.3.5";
 const description = "JustiFi Web Components";
 const collection = "dist/collection/collection-manifest.json";
 const main = "dist/index.cjs.js";

package/dist/module/parts.js

@@ -75,6 +75,8 @@ const listGroup = `list-group ${text} ${backgroundColor}`;
 const listGroupItem = `list-group-item ${text} ${backgroundColor}`;
 // Skeleton
 const skeleton = `skeleton`;
+// Image
+const image = `image`;
 // Component specific
 // This allows specific sections of a component to be hidden, for example
 // ::part(billing-form) { display: none; }
@@ -106,4 +108,4 @@ const terminalsListFilterParam = `terminals-list-filter-param`;
 const terminalIdTerminalsListFilterParam = `${terminalsListFilterParam} terminal-id-terminals-list-filter-param`;
 const terminalStatusTerminalsListFilterParam = `${terminalsListFilterParam} terminal-status-terminals-list-filter-param`;
 
-export { checkoutsListFilterMenu as $, badgeSecondary as A, badgeSuccess as B, badgeDanger as C, badgeWarning as D, badgeInfo as E, badgeLight as F, badgeDark as G, alertDanger as H, inputCheckboxInvalid as I, inputCheckboxCheckedFocused as J, inputCheckboxFocused as K, inputCheckboxChecked as L, inputCheckbox as M, inputGroup as N, inputRadioInvalid as O, inputRadioCheckedFocused as P, inputRadioChecked as Q, inputRadioFocused as R, inputRadio as S, heading5 as T, heading3 as U, billingForm as V, buttonLoading as W, buttonPrimary as X, buttonSecondary as Y, checkoutSummary as Z, radioListItem as _, heading1 as a, statusCheckoutsListFilterParam as a0, paymentModeCheckoutsListFilterParam as a1, dropdownMenu as a2, heading4 as a3, listGroup as a4, listGroupItem as a5, paymentsListFilterMenu as a6, paymentIdPaymentsListFilterParam as a7, terminalIdPaymentsListFilterParam as a8, paymentStatusPaymentsListFilterParam as a9, createdAfterPaymentsListFilterParam as aa, createdBeforePaymentsListFilterParam as ab, payoutsListFilterMenu as ac, createdAfterPayoutsListFilterParam as ad, createdBeforePayoutsListFilterParam as ae, terminalsListFilterMenu as af, terminalIdTerminalsListFilterParam as ag, terminalStatusTerminalsListFilterParam as ah, inputInvalid as b, inputDisabled as c, inputFocused as d, tooltipIcon as e, tooltip as f, tooltipInner as g, heading2 as h, input as i, textDanger as j, inputInvalidAndFocused as k, label as l, card as m, table as n, tableHeadCell as o, tableCell as p, getAlternateTableCellPart as q, tableEmpty as r, skeleton as s, text as t, tableError as u, buttonLink as v, buttonDisabled as w, loadingSpinner as x, badge as y, badgePrimary as z };
+export { checkoutsListFilterMenu as $, badgeSecondary as A, badgeSuccess as B, badgeDanger as C, badgeWarning as D, badgeInfo as E, badgeLight as F, badgeDark as G, alertDanger as H, inputCheckboxInvalid as I, inputCheckboxCheckedFocused as J, inputCheckboxFocused as K, inputCheckboxChecked as L, inputCheckbox as M, inputGroup as N, inputRadioInvalid as O, inputRadioCheckedFocused as P, inputRadioChecked as Q, inputRadioFocused as R, inputRadio as S, heading5 as T, heading3 as U, billingForm as V, buttonLoading as W, buttonPrimary as X, buttonSecondary as Y, checkoutSummary as Z, radioListItem as _, heading1 as a, statusCheckoutsListFilterParam as a0, paymentModeCheckoutsListFilterParam as a1, dropdownMenu as a2, heading4 as a3, listGroup as a4, listGroupItem as a5, image as a6, paymentsListFilterMenu as a7, paymentIdPaymentsListFilterParam as a8, terminalIdPaymentsListFilterParam as a9, paymentStatusPaymentsListFilterParam as aa, createdAfterPaymentsListFilterParam as ab, createdBeforePaymentsListFilterParam as ac, payoutsListFilterMenu as ad, createdAfterPayoutsListFilterParam as ae, createdBeforePayoutsListFilterParam as af, terminalsListFilterMenu as ag, terminalIdTerminalsListFilterParam as ah, terminalStatusTerminalsListFilterParam as ai, inputInvalid as b, inputDisabled as c, inputFocused as d, tooltipIcon as e, tooltip as f, tooltipInner as g, heading2 as h, input as i, textDanger as j, inputInvalidAndFocused as k, label as l, card as m, table as n, tableHeadCell as o, tableCell as p, getAlternateTableCellPart as q, tableEmpty as r, skeleton as s, text as t, tableError as u, buttonLink as v, buttonDisabled as w, loadingSpinner as x, badge as y, badgePrimary as z };

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

@@ -58,14 +58,14 @@ const PaymentDetailsCore = /*@__PURE__*/ proxyCustomElement(class PaymentDetails
         });
     }
     render() {
-        return (h(StyledHost, { key: 'e03ea25b2d3a3388a613cc6fedd8912bb5092d63' }, this.loading && h(PaymentDetailsLoading, { key: '3343cc38deec7b87b2466b3bc43c0170a1962625' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
-            this.payment && (h("justifi-details", { key: '18e494e5cb1aaed74ec35dfff5c659061d30cb82', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: '466e6c0105eb09485907674aec32752001949e53', slot: "head-info", badge: MapPaymentStatusToBadge(this.payment.status), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: '4da3f6800f98c2af8dfa6bae1ef464752aba14be', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: '99a9e776d1dfc3ecf5de3d484212930824ebf4e2', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: '55795658b170234f9f94ed97dbf45c9727f865fc', title: "ID", value: this.payment.id })), h("div", { key: '2b17cd70a0b8abe36596a61f8bf0c6ae039db579', slot: 'detail-sections' }, h(DetailSectionTitle, { key: 'a663bf74079da6a51ec611addf2adb25b8e4c950', sectionTitle: "Details" }), h("div", { key: '48b0e215500c30da77c3cc1f8f46199bda52dc24', class: "d-table gap-2 w-100" }, h(DetailItem, { key: 'd8311d8cf23d4e66effc7e2f86aa0bb56456f7ec', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: '7084b4469a769fed1499f5c6cfd50e6caa88a1a5', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '40546b209614c410ff5725a01a60bbfde70cd4f6', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: 'd933346f3518d423b278a1ac41e603399c2c8b8b', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: 'f89fb7d083501dbdf481f63d0a587a6323a3fd6e', title: "Status", value: MapPaymentStatusToBadge(this.payment.status) }), h(DetailItem, { key: 'a2494f54c8a4f1792f373adf6a6e1dbab3e5798d', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: '80a1118c3043a91d37bbb3da26a9fbdcf3d3b7ee', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: '7787c8d9713ace6113c4685d2ea2279e570849eb', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: '7e12595f71d7dd2f85b8d332aa349d90df595727', title: "Description", value: this.payment.description })), this.payment.payment_method.card && [
-            h(DetailSectionTitle, { key: '9150caced60639279da39a84db67eef97199d78d', sectionTitle: "Payment Method" }),
-            h("div", { key: '5add69653bc6838ed1f1792217c04cf289f1a2f0', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '8dd22e082c3e4aa0b2836ee8e533d8dc63452498', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: 'c8130661f5684b91db68b4c9d8a45518e610d17b', title: "Payment Type", value: "Card" }), h(DetailItem, { key: 'f47a9d1689f67133bb9183e88830dff7b4ef64e8', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: '9101ce4f03dbb78d9c4f825c3747871c275c7a86', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: '93f34140d96fae056674b1767219ae94164160c7', title: "Cardholder", value: this.payment.payment_method.payersName }))
+        return (h(StyledHost, { key: '1978689b8278990966596fa7d5a155208ddbf7e2' }, this.loading && h(PaymentDetailsLoading, { key: 'c9e75ceefc675e7f198d395f53ae90b056526261' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && !this.errorMessage &&
+            this.payment && (h("justifi-details", { key: '629457b2841589c47e4d9e0127b530a40f79569e', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: '8433e393af0bc9c12dd1bfc1c74c7e71d1bd7533', slot: "head-info", badge: MapPaymentStatusToBadge(this.payment.status), title: this.payment.formattedPaymentAmount(this.payment.amount) }, h(EntityHeadInfoItem, { key: '899e2e0bfcf92ee28af12a882a0390792865e56d', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payment.updated_at)} ${formatTime(this.payment.updated_at)}` }), h(EntityHeadInfoItem, { key: '87e38c31d21643bf9e9d532f8351c5e6cdf86ce0', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payment.created_at)} ${formatTime(this.payment.created_at)}` }), h(EntityHeadInfoItem, { key: '71e629744d267e75037e226a46911ad121107855', title: "ID", value: this.payment.id })), h("div", { key: 'b1ad6c37738d078d4d0c50943fa484f73bed19ae', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '4b2407c4e45bb062c9d29da68321d58dd8f5cdb2', sectionTitle: "Details" }), h("div", { key: 'e8b1208771061477f00a2f5d5160464117b21421', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '9ac1b4794f5afac73a307dfff7b78f6d9b936b77', title: "Amount", value: this.payment.formattedPaymentAmount(this.payment.amount) }), h(DetailItem, { key: '4d36bfa5117c66288a41803df1373c3f09311c5a', title: "Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: 'edc981480e3bb975170fe8de4ec76c3074c732da', title: "Refunded", value: this.payment.formattedPaymentAmount(this.payment.amount_refunded) }), h(DetailItem, { key: '290a04ecac3267ee71389668321fcbf9987a4f2c', title: "Net", value: this.payment.formattedPaymentAmount(this.payment.balance) }), h(DetailItem, { key: 'f6995f8ba441eb7c5fdbea7ede2e5baccca79489', title: "Status", value: MapPaymentStatusToBadge(this.payment.status) }), h(DetailItem, { key: '96b1788fda31eb7090c7bf5ae61ad1c4c6517acd', title: "Payment ID", value: this.payment.id }), h(DetailItem, { key: '2e78ed29b424f8edcb5f62dcca1583aa92696797', title: "Processing Fees", value: this.payment.formattedPaymentAmount(this.payment.fee_amount) }), h(DetailItem, { key: 'd1d7025e7557f6566e519933cdbc6d3fb153b08f', title: "Statement Descriptor", value: this.payment.statement_descriptor }), h(DetailItem, { key: '8e369df9afaf1368cfe67928c9ffd3d761f7e4c5', title: "Description", value: this.payment.description })), this.payment.payment_method.card && [
+            h(DetailSectionTitle, { key: '4275caef28d50b41b4f1cf573ef21f5cad3ad137', sectionTitle: "Payment Method" }),
+            h("div", { key: '0e5414c43a1273ae8fdfab4ac2f123a584aa0015', class: "d-table gap-2 w-100" }, h(DetailItem, { key: 'fe15b439f0eaadcd44d0dd4313fa8a432f13d47a', title: "ID", value: this.payment.payment_method.card.id }), h(DetailItem, { key: 'e13a36067875455c89eaf466618507903ae515c3', title: "Payment Type", value: "Card" }), h(DetailItem, { key: '04e73a55bc15db2103c10ccdaa09417a77d5ec4b', title: "Last 4 Numbers", value: this.payment.payment_method.lastFourDigits }), h(DetailItem, { key: 'f7213832d1ddbabafe31080d8f4d9ac8b29436a6', title: "Brand", value: snakeCaseToHumanReadable(this.payment.payment_method.card.brand) }), h(DetailItem, { key: '105b7aa79ff05c0f2837ca0de9a84b05da411c7d', title: "Cardholder", value: this.payment.payment_method.payersName }))
         ], this.payment.payment_method.bank_account && [
-            h(DetailSectionTitle, { key: '67cf738bc3e636aeaf97f0d66046d515ea096a50', sectionTitle: "Payment Method" }),
-            h("div", { key: '89d17e5925ad5057972f9bf11f558ff008409004', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '31ee0758b992bbe2672ac02a699cb6ad8c3f6631', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: '43a23b3ea5c53a56b5888a798f0195f84933588b', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: '79572125fe01f0bcd1d029dc36a723fac6bf7ceb', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '76633c06b486c6b2315ff6062d2beab0f4531a6d', title: "Account Owner", value: this.payment.payment_method.payersName }))
-        ], h(DetailSectionTitle, { key: 'f537f98a91e780c460052a7530ffb5fadc077562', sectionTitle: 'Metadata' }), h("div", { key: '324a3eb360ff1091154907f996cfd3f406f8c4d6', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'b52628f75fa99b719d7ad150cb678d686e77f3bf', metadata: this.payment.metadata })))))));
+            h(DetailSectionTitle, { key: '0e98838bfda48e8680bc4732c28956df01e24e1e', sectionTitle: "Payment Method" }),
+            h("div", { key: '6d18b4960dc81742a7fc7c9d687fb47a2001026c', class: "d-table gap-2 w-100" }, h(DetailItem, { key: 'af4221654d5f15767a77660d34dd1e110a55f178', title: "ID", value: this.payment.payment_method.bank_account.id }), h(DetailItem, { key: '5ada65c0a6e924f2de218f3e75d8e72e3cebe032', title: "Last 4 Numbers", value: this.payment.last_four_digits }), h(DetailItem, { key: 'aab41f9c2221a91ce4acceba59bd8a47ab4866fa', title: "Bank Name", value: this.payment.payment_method.bank_account.brand }), h(DetailItem, { key: '7c3cf837177b6fe60a311e0044d17a9b67885ac8', title: "Account Owner", value: this.payment.payment_method.payersName }))
+        ], h(DetailSectionTitle, { key: 'f84f8d6078683651793b2021aa992aac96f015a0', sectionTitle: 'Metadata' }), h("div", { key: '06f0a1b0f18cea6f2804043dd432fe42f7352c9a', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: '06273e39e83b0bc1fa5316c65f848986b0f4c1a1', metadata: this.payment.metadata })))))));
     }
     static get watchers() { return {
         "getPaymentDetails": ["updateOnPropChange"]

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

@@ -122,7 +122,7 @@ const PaymentsListCore = /*@__PURE__*/ proxyCustomElement(class PaymentsListCore
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: '6f153085c08ed8db1508964f360f879ec5310635' }, h("div", { key: 'ca4e487642561cbf859aa30f74dc1aae00d3642c', class: "table-wrapper" }, h("table", { key: '0982554e856be77813a087baa93835cd43c3b6e1', class: "table table-hover", part: table }, h("thead", { key: 'e5eb661667dea89b13524676423758cf79d20765', class: "table-head sticky-top" }, h("tr", { key: '290dd81536e2b03f3020c72937a559aca0cef884', class: "table-light text-nowrap" }, this.paymentsTable.columnData.map((column) => column))), h("tbody", { key: 'bee3b0671e9d6f71a87d8b9f880a1630db2335ec', class: "table-body" }, h(TableLoadingState, { key: 'a9e4a373e3eadc449f4b040c1eec2e902cfe7fef', columnSpan: this.paymentsTable.columnData.length, isLoading: this.loading }), h(TableEmptyState, { key: '240af4b959cd5a55518c0fd6a025648291e63c29', isEmpty: this.showEmptyState, columnSpan: this.paymentsTable.columnData.length }), h(TableErrorState, { key: 'd6e704fd8f9d6f1717537e45e0c3743e78df38be', columnSpan: this.paymentsTable.columnData.length, errorMessage: this.errorMessage }), this.showRowData && this.paymentsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '889f70d9eb4f7e92e29735ba6a5ddb43d622a511', class: "sticky-bottom" }, h("tr", { key: '7f352e5ea2338b1209046bab5328580d1ef80e12', class: "table-light align-middle" }, h("td", { key: '310bf61ff6730cdc4a2fe83e4297b9f055981abc', part: tableCell, colSpan: this.paymentsTable.columnData.length }, h("pagination-menu", { key: '66bcae57f189313b7596133c1a91e0cf43173fef', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h("div", { key: '43aa1d53dc7c63eda036624d897d92670ff4dec7' }, h("div", { key: '84ac82efec3738e1a07bcf5fbfdf62426bacaad0', class: "table-wrapper" }, h("table", { key: '65e2ab73a63fa1d89b1b7fb0cd9809d951de657a', class: "table table-hover", part: table }, h("thead", { key: '81ff867eb4b86905049e57c9c9ee331ad9a43f22', class: "table-head sticky-top" }, h("tr", { key: 'edecfccffc49b21f4d9d01396ab4d22dda6f853b', class: "table-light text-nowrap" }, this.paymentsTable.columnData.map((column) => column))), h("tbody", { key: '1df70e89ad33f83dbf18c6c5135bcda2753413a8', class: "table-body" }, h(TableLoadingState, { key: '23cfc404da1ccfada68146b83343e9ee348bac05', columnSpan: this.paymentsTable.columnData.length, isLoading: this.loading }), h(TableEmptyState, { key: '9929a89448678aa010ecfb43377c38f53b1896d2', isEmpty: this.showEmptyState, columnSpan: this.paymentsTable.columnData.length }), h(TableErrorState, { key: '1734903104bb6c6e9b382661bc353731c5cf92aa', columnSpan: this.paymentsTable.columnData.length, errorMessage: this.errorMessage }), this.showRowData && this.paymentsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '08277c1742a8ff36079a2fd4d4c3a31e628617dc', class: "sticky-bottom" }, h("tr", { key: '6012aa5a86f140007504d056f53eba3a21aacc40', class: "table-light align-middle" }, h("td", { key: 'e67d2f48a9d1002086a18ebd4ca00a5b22903c06', part: tableCell, colSpan: this.paymentsTable.columnData.length }, h("pagination-menu", { key: 'afcfbab93aa8bb33d6aac50b11c803ebb3284bf1', 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,7 +74,7 @@ const PayoutDetailsCore = /*@__PURE__*/ proxyCustomElement(class PayoutDetailsCo
     }
     render() {
         var _a;
-        return (h(StyledHost, { key: '9b5b45052e96231367e1289cfd693346dbde365b' }, this.loading && h(PayoutDetailsLoading, { key: '6326e96a39db801b0e61a061cba006f867f1d421' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: '68642bc936f28de32ac82dee91b6a044e1212399', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: 'ddaaffc9cf37c004cf08025e6767e4e6ebba9b03', slot: "head-info", badge: MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status), title: this.payout.formattedPaymentAmount(this.payout.amount) }, h(EntityHeadInfoItem, { key: '552b9fea31e5628a7c02aaa2fec84ea659acd8c0', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: 'ed356c4b54e4c315c51ebaf381cc8c66f4246ed7', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: '1171f95890de260c20122b02bdf10ca43bc7bef1', title: "ID", value: this.payout.id }), h("div", { key: '9e823b2f42bf37e7fd0e4e8f5e87a2be5ab4db35', class: "m-4" }, h(Button, { key: 'dd4b750f7e9057b7f4845a4290d83c7cf89d7b43', variant: "secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: 'ef9384f15e0e10c2372d8af1c62fdf858d98d1a2', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '3abe895a6f65d2e26736cafd25a8656d5be1204d', sectionTitle: "Details" }), h("div", { key: '1be2f667564fa492a1fa3a44b8e67209a6617657', class: "d-table gap-2 w-100" }, h(DetailItem, { key: 'adb8c36a2b45d19ef95117d069f60758ea5ce6f0', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: 'a6245623ff251316c4fd923bfb9b91fe94aa11b1', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: '10db1599529d8f98d28c3ed1f3975539bbb8f88a', title: "Payout Method", value: this.payout.delivery_method }), h(DetailItem, { key: '7e1438bcfb7b1f2aa820ace66874e56446ef400e', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: '4afa7801a1b1e92db8c8f57b53c0d7cdd38e0f61', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: '51cf02ed3894781f88770cdac746b31bb608dcad', sectionTitle: "Account" }), h("div", { key: '865ea1514254641acf1f96941c5c912947c5fe4f', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '2812906310435422b7bb08bbe8a36c1f95a2eac5', title: "ID", value: this.payout.account_id }), h(DetailItem, { key: 'c25fef650a31522d3bc520d425f904bc002d3ecf', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: 'def9ed242797394aa21339866050bdf563ee7527', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '1542ffac52053eb8986d6fd2489d4ba6ab523c69', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: '45a289202141a852e5e57eee4d0b3db35b09cc40', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), h(DetailSectionTitle, { key: 'a9059130e4c5686d103f67a91510531af62eca5f', sectionTitle: 'Metadata' }), h("div", { key: '130ef2e82f48c8449346b56713580b975fc368cf', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'dc6fc83790f16416aa7c5b763d0ae040654f23cd', metadata: this.payout.metadata })))))));
+        return (h(StyledHost, { key: '7d648508011ea664a85dcd3e83d45835d769f195' }, this.loading && h(PayoutDetailsLoading, { key: 'c5aa47291bd8a66174c0caf11d4043d5c8084183' }), !this.loading && this.errorMessage && ErrorState(this.errorMessage), !this.loading && this.payout && (h("justifi-details", { key: 'bbb88f0e6895ab4e4a03fbcc2c33dd925ede8731', "error-message": this.errorMessage }, h(EntityHeadInfo, { key: 'c8cc282e0e53bd605d47e30f38bc924cfb20b19e', slot: "head-info", badge: MapPayoutStatusToBadge((_a = this.payout) === null || _a === void 0 ? void 0 : _a.status), title: this.payout.formattedPaymentAmount(this.payout.amount) }, h(EntityHeadInfoItem, { key: 'ada8dc55c9ad5324cf406cd8118b5087542d9958', classes: "border-1 border-end", title: "Updated At", value: `${formatDate(this.payout.updated_at)} ${formatTime(this.payout.updated_at)}` }), h(EntityHeadInfoItem, { key: 'f590cc91cd49709c8f47bfb2285d335f55153f44', classes: "border-1 border-end", title: "Created At", value: `${formatDate(this.payout.created_at)} ${formatTime(this.payout.created_at)}` }), h(EntityHeadInfoItem, { key: '95d767d779203c9d78734d35933f5d1672ae6ec9', title: "ID", value: this.payout.id }), h("div", { key: '83a7e4dd33af9d5a62a1ec7e898d0c56c71e633a', class: "m-4" }, h(Button, { key: '0f622ebc090782a89d506d22b67f43177dbfda79', variant: "secondary", class: "btn btn-outline-secondary d-flex align-items-center", onClick: this.downloadCSV }, "Export CSV"))), h("div", { key: '35300a91f58a9ce822323c03cbc139d35312bc3d', slot: 'detail-sections' }, h(DetailSectionTitle, { key: '34db8325ff9e72e166e80e4f1e3cb98b6757f750', sectionTitle: "Details" }), h("div", { key: '7515ec409c0b31c530d072684694e3721ddb1562', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '544be85ea95c951c85ffd539a8ef73fc8a65f747', title: "Date paid", value: formatDate(this.payout.deposits_at) }), h(DetailItem, { key: 'ebc505407ae3e436143d3a10c59541bef5459488', title: "Statement Description", value: this.payout.description }), h(DetailItem, { key: '3ae0229489cb9f287c3141e090b3cd260f98affd', title: "Payout Method", value: this.payout.delivery_method }), h(DetailItem, { key: 'e11e04fc8e57d5036cfdcaf8a928886a6d1ac6bc', title: "Amount", value: this.payout.formattedPaymentAmount(this.payout.amount) }), h(DetailItem, { key: 'd98c8c10d875aa9ce4a561f1813188d8ec2fe88d', title: "Fee", value: this.payout.formattedPaymentAmount(this.payout.fees_total) })), h(DetailSectionTitle, { key: '65d1ea7d5ff2e25ac89b2de8a0fdf59850a3d4ed', sectionTitle: "Account" }), h("div", { key: '0d593cec0b5ddc1ed45880410fb91acb4a210e37', class: "d-table gap-2 w-100" }, h(DetailItem, { key: '356dab04877a39166ad2cc68154c03125acb3f49', title: "ID", value: this.payout.account_id }), h(DetailItem, { key: '2a4b60d5d695fd102f8ed8bc3ad8d61d47886c89', title: "Account Type", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '1bd1c40fac3a0e409a7d6082c70f0695f0b850bc', title: "Institution", value: this.payout.bank_account.account_type }), h(DetailItem, { key: '9d08a53899f17c7fd7bdcab7a6e11f9b02ff9694', title: "Routing Number", value: this.payout.bank_account.routing_number }), h(DetailItem, { key: 'e2e8487b4555ae6e9c6ff799150a6bef49eeb82a', title: "Account Number", value: this.payout.bank_account.account_number_last4 })), h(DetailSectionTitle, { key: '82408f25fc1700cb7c55afd7b0ef116ad43659c0', sectionTitle: 'Metadata' }), h("div", { key: '16c5967632b3a95bc8cbc787a2e8400319537184', class: "d-table gap-2 w-100" }, h(CodeBlock, { key: 'e3b2041e7c2e76c8994754be30a885b92673b75d', metadata: this.payout.metadata })))))));
     }
     static get watchers() { return {
         "getPayout": ["getPayoutWatcher"]

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

@@ -179,7 +179,7 @@ const PayoutsListCore = /*@__PURE__*/ proxyCustomElement(class PayoutsListCore e
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: '2cc35b1a64da3e15a221eeb74b9de3ce011301e6' }, h("div", { key: '73e18029f462aeb03414574c76700b8c20748c0d', class: "table-wrapper", part: "table-wrapper" }, h("table", { key: '6af17bc77a5ac15503a4424ef8e9095da86ff667', class: "table table-hover", part: table }, h("thead", { key: '6340d507a8a8bcef847c4054072b1f26d49c1cb8', class: "table-head sticky-top", part: "table-head" }, h("tr", { key: 'fd84224c2b62ebb26130057d57145baecc3f1f2b', class: "table-light text-nowrap", part: "table-head-row" }, this.payoutsTable.columnData.map((column) => column))), h("tbody", { key: '4993ab0d133c3f03c42b17da22c16682f6b5ddc2', class: "table-body" }, h(TableLoadingState, { key: '580e94f393f1281a4f9f9890078073b31450fb25', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '88fa77ac3de65dcad0371d8746588d588964a2fe', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: 'ec374189d2faab1ea13388987ff977ae758cdd35', columnSpan: this.payoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.payoutsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '3543415cd5411bf599e0cfa06257b8ef19f1b652', class: "sticky-bottom" }, h("tr", { key: '8b7230df5006dfb3d3022422d391cd5cae48c5c7', class: "table-light align-middle" }, h("td", { key: '6a4ed06b9c933e09cb083b3e62e52bdf44a9678b', part: tableCell, colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: 'f87d2e1fe590205f455f236ba5afc26533f44f4e', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h("div", { key: 'b7befcaf0a42986dc821d97e371fb93920b16358' }, h("div", { key: 'c405055d05c2f1b5e622ab28fc9744962f1907a1', class: "table-wrapper", part: "table-wrapper" }, h("table", { key: 'db36400212d74c17e0aad133717475ce3b142308', class: "table table-hover", part: table }, h("thead", { key: 'a3e208126c4d2c0ab2b6d9ef27f8c1410e029907', class: "table-head sticky-top", part: "table-head" }, h("tr", { key: '37f25650e0c03cf8985ec68211eefc0980dd5a92', class: "table-light text-nowrap", part: "table-head-row" }, this.payoutsTable.columnData.map((column) => column))), h("tbody", { key: '7879e0b39a52ef735ff71960498e1405ff8f98b0', class: "table-body" }, h(TableLoadingState, { key: '91fdd3ed14d5c63ac8c536a5d8da05bb491d49a1', columnSpan: this.payoutsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '577748b2fa32b265a6a1afbad3460c4628d21ba6', isEmpty: this.showEmptyState, columnSpan: this.payoutsTable.columnKeys.length }), h(TableErrorState, { key: '351848f6ee13c7be8735757ce3dcbcce18bb4fff', columnSpan: this.payoutsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.payoutsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h("tfoot", { key: '889ef01055c10f969d4d51f6d114bd3654a06ce3', class: "sticky-bottom" }, h("tr", { key: '6c49a3b386a64023d0701445e7589cced7f4f4df', class: "table-light align-middle" }, h("td", { key: '7782a9152e0d8037afb6528897a9358da204bfb7', part: tableCell, colSpan: this.payoutsTable.columnData.length }, h("pagination-menu", { key: 'eac386f11674a29452831bdbe183bfefe4347389', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get watchers() { return {
         "pagingParams": ["updateOnPropChange"],