@justifi/webcomponents 4.22.2 → 4.23.1

package/dist/collection/components/payouts-list/payouts-list-filters.js

@@ -0,0 +1,72 @@
+import { h } from "@stencil/core";
+import { convertToLocal, convertToUTC } from "../../utils/utils";
+export class PayoutsListFilters {
+    constructor() {
+        this.handleDateInput = (name, value) => {
+            const utcDate = convertToUTC(value, { setEndOfDay: true });
+            this.setParamsOnChange(name, utcDate);
+        };
+        this.params = undefined;
+        this.setParamsOnChange = undefined;
+        this.clearParams = undefined;
+    }
+    render() {
+        return (h("table-filters-menu", { key: '2f80b6ac3308af53f20f1c8c8fbc596937eeda1d', params: this.params, clearParams: this.clearParams }, h("div", { key: '6e0bf319268d1bcbbd81e922f0855eb1c497815f', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '8c29a63ea0c4836a0b002db9adc75ea69cdde988', class: "p-2" }, h("form-control-date", { key: '74399fdd150d71758f817454944ef34c9b443240', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.params.created_after, { showInputDate: true }) })), h("div", { key: 'e98911d5b92ed5a6642d8f59b23abbebf4f1f85b', class: "p-2" }, h("form-control-date", { key: '4f233e95aeae496357938c69f25336123fbf1f0f', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.params.created_before, { showInputDate: true }) })))));
+    }
+    static get is() { return "payouts-list-filters"; }
+    static get properties() {
+        return {
+            "params": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "PayoutsTableFilterParams",
+                    "resolved": "PayoutsTableFilterParams",
+                    "references": {
+                        "PayoutsTableFilterParams": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::PayoutsTableFilterParams"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            },
+            "setParamsOnChange": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(name: string, value: string) => void",
+                    "resolved": "(name: string, value: string) => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            },
+            "clearParams": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "() => void",
+                    "resolved": "() => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            }
+        };
+    }
+}

package/dist/collection/components/payouts-list/payouts-list.js

@@ -1,12 +1,15 @@
 import { h } from "@stencil/core";
-import { tableExportedParts } from "../../ui-components/table/exported-parts";
+import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api/ComponentError";
+import JustifiAnalytics from "../../api/Analytics";
+import { checkPkgVersion } from "../../utils/check-pkg-version";
+import { config } from "../../../config";
 import { PayoutService } from "../../api/services/payout.service";
 import { makeGetPayouts } from "./get-payouts";
-import { ComponentErrorCodes } from "../../api/ComponentError";
-import JustifiAnalytics from "../../api/Analytics";
 import { makeGetPayoutCSV } from "../payout-details/get-payout-csv";
-import { checkPkgVersion } from "../../utils/check-pkg-version";
-import { StyledHost } from "../../ui-components/styled-host/styled-host";
+import { makeGetSubAccounts } from "../../api/get-subaccounts";
+import { SubAccountService } from "../../api/services/subaccounts.service";
+import { StyledHost, tableExportedParts } from "../../ui-components";
+import { defaultColumnsKeys } from "./payouts-table";
 /**
   * @exportedPart label: Label for inputs
   * @exportedPart input: The input fields
@@ -35,29 +38,37 @@ export class PayoutsList {
             this.errorMessage = event.detail.message;
             this.errorEvent.emit(event.detail);
         };
-        this.accountId = undefined;
-        this.authToken = undefined;
         this.getPayouts = undefined;
         this.getPayoutCSV = undefined;
+        this.getSubAccounts = undefined;
         this.errorMessage = null;
+        this.accountId = undefined;
+        this.authToken = undefined;
+        this.apiOrigin = config.proxyApiOrigin;
+        this.columns = defaultColumnsKeys;
     }
     componentWillLoad() {
         checkPkgVersion();
         this.analytics = new JustifiAnalytics(this);
-        this.initializeServices();
+        this.initializeGetData();
     }
     disconnectedCallback() {
         this.analytics.cleanup();
     }
     propChanged() {
-        this.initializeServices();
+        this.initializeGetData();
     }
-    initializeServices() {
+    initializeGetData() {
+        this.initializePayoutsServices();
+        this.initializeGetSubAccounts();
+    }
+    initializePayoutsServices() {
         if (this.accountId && this.authToken) {
             const serviceParams = {
                 id: this.accountId,
                 authToken: this.authToken,
                 service: new PayoutService(),
+                apiOrigin: this.apiOrigin
             };
             this.getPayouts = makeGetPayouts(serviceParams);
             this.getPayoutCSV = makeGetPayoutCSV(serviceParams);
@@ -66,12 +77,23 @@ export class PayoutsList {
             this.errorMessage = 'Account ID and Auth Token are required';
             this.errorEvent.emit({
                 errorCode: ComponentErrorCodes.MISSING_PROPS,
-                message: 'Account ID and Auth Token are required',
+                message: this.errorMessage,
+                severity: ComponentErrorSeverity.ERROR,
+            });
+        }
+    }
+    initializeGetSubAccounts() {
+        if (this.accountId && this.authToken) {
+            this.getSubAccounts = makeGetSubAccounts({
+                accountId: this.accountId,
+                authToken: this.authToken,
+                service: new SubAccountService(),
+                apiOrigin: this.apiOrigin
             });
         }
     }
     render() {
-        return (h(StyledHost, { key: '8d72aa16705df76ed49a13a59e88a40a75c23488', exportedparts: tableExportedParts }, h("payouts-list-core", { key: '94428c879981bbc036e1d4f6c59c1e1c1146c824', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, "onError-event": this.handleOnError })));
+        return (h(StyledHost, { key: '5f482e2ab5d1a022c9f54f13a8ab31860ff4b6ec', exportedparts: tableExportedParts }, h("payouts-list-core", { key: 'fe5decfcda48b54bbcded8c605d0f3a2576c35cb', getPayouts: this.getPayouts, getPayoutCSV: this.getPayoutCSV, getSubAccounts: this.getSubAccounts, "onError-event": this.handleOnError, columns: this.columns })));
     }
     static get is() { return "justifi-payouts-list"; }
     static get encapsulation() { return "shadow"; }
@@ -110,6 +132,42 @@ export class PayoutsList {
                 },
                 "attribute": "auth-token",
                 "reflect": false
+            },
+            "apiOrigin": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "api-origin",
+                "reflect": false,
+                "defaultValue": "config.proxyApiOrigin"
+            },
+            "columns": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "columns",
+                "reflect": false,
+                "defaultValue": "defaultColumnsKeys"
             }
         };
     }
@@ -117,6 +175,7 @@ export class PayoutsList {
         return {
             "getPayouts": {},
             "getPayoutCSV": {},
+            "getSubAccounts": {},
             "errorMessage": {}
         };
     }

package/dist/collection/components/payouts-list/payouts-table.js

@@ -0,0 +1,26 @@
+import { h } from "@stencil/core";
+import { convertToLocal, formatCurrency } from "../../utils/utils";
+import { MapPayoutStatusToBadge } from "./payouts-status";
+export const defaultColumnsKeys = 'created_at,amount,status,payments_total,refunds_total,fees_total,other_total,csv';
+export const payoutTableColumns = {
+    created_at: () => (h("th", { part: "table-head-cell", scope: "col", title: "The date the payout was deposited" }, "Created")),
+    sub_account_name: () => (h("th", { part: "table-head-cell", scope: "col", title: "The sub account associated with the payout" }, "Sub Account")),
+    payments_total: () => (h("th", { part: "table-head-cell", scope: "col", title: "The total payments amount associated with the payout" }, "Payments")),
+    refunds_total: () => (h("th", { part: "table-head-cell", scope: "col", title: "The total refunds amount associated with the payout" }, "Refunds")),
+    fees_total: () => (h("th", { part: "table-head-cell", scope: "col", title: "The total fees amount associated with the payout" }, "Fees")),
+    other_total: () => (h("th", { part: "table-head-cell", scope: "col", title: "The total other amount" }, "Other")),
+    amount: () => (h("th", { part: "table-head-cell", scope: "col", title: "The total amount of the payout" }, "Amount")),
+    status: () => (h("th", { part: "table-head-cell", scope: "col", title: "The real-time status of each payout" }, "Status")),
+    csv: () => (h("th", { part: "table-head-cell", scope: "col", title: "Export CSV" })),
+};
+export const payoutTableCells = (downloadCSV) => ({
+    created_at: (value) => (h("td", { part: "table-cell" }, h("div", { class: "fw-bold" }, convertToLocal(value, { showDisplayDate: true }), " "))),
+    sub_account_name: (value) => (h("td", { part: "table-cell" }, value)),
+    payments_total: (value) => (h("td", { part: "table-cell" }, formatCurrency(value))),
+    refunds_total: (value) => (h("td", { part: "table-cell" }, formatCurrency(value))),
+    fees_total: (value) => (h("td", { part: "table-cell" }, formatCurrency(value))),
+    other_total: (value) => (h("td", { part: "table-cell" }, formatCurrency(value))),
+    amount: (value) => (h("td", { part: "table-cell" }, formatCurrency(value))),
+    status: (value) => (h("td", { part: "table-cell", innerHTML: MapPayoutStatusToBadge(value) })),
+    csv: (value) => (h("td", { part: "table-cell" }, h("a", { href: "#", onClick: (event) => { event.preventDefault(); downloadCSV(value); } }, "CSV"))),
+});

package/dist/collection/components/refund-form/refund-form.js

@@ -75,7 +75,7 @@ export class RefundForm {
     }
     render() {
         var _a;
-        return (h(StyledHost, { key: '05a417edd28ecdb609c9ca6abaa60004fe782beb' }, h("h1", { key: '05450dad6321a3cb94461d020a64dde7abfcb287' }, "Refund"), this.refundInfoText && (h("div", { key: '4874c1bbbbcb0caac057e7d29eb5d62f998e7f70', class: "d-flex align-items-center flex-row gap-4 border-top border-bottom my-4 p-3", role: "alert" }, h("img", { key: 'cb64bc85188e882e6c863bb2e56411f31f9675d3', src: "/info-icon.svg", alt: "Information", height: "30", width: "30" }), h("p", { key: 'd1497287435d3b87f77bf37d4bd1473cf1ddc4f3', class: "m-0", innerHTML: this.refundInfoText }))), h("form", { key: '4936209e143d8c5d6ef6a32ddc49d63b92711351', onSubmit: e => this.handleSubmit(e), class: "d-grid gap-4" }, h("div", { key: 'fc6e616809550f22b949d1f256b4ddc922e1fab9', class: "form-group" }, h("form-control-monetary", { key: '220c36b30960e85b30999267b7daa933062e4ca0', 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: 'd40556a67819325134ff1389a8e8018b024ce0da', class: "form-group" }, h("form-control-text", { key: '1c1cb5a345118902830bad6ec852bfb0641a983c', name: "notes", label: "Additional Notes", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.notes })), this.withButton && (h("div", { key: 'bb167956ce0a4bef63fbdee79681348a963f55be', class: "form-group d-flex flex-row-reverse" }, h("button", { key: 'd6767bf536e4416f4071271cc2028be69686a59e', type: "submit", disabled: !!this.isSubmitting, class: "btn btn-primary ml-auto" }, this.submitButtonText))))));
+        return (h(StyledHost, { key: '63863f5db62aa514fdf76c673d33634d0ce091b5' }, h("h1", { key: '3cd25385bb1d14a041abde024db70f052b913479' }, "Refund"), this.refundInfoText && (h("div", { key: 'df4fdf161bdc6330db3d04fab06b023b19dd4be6', class: "d-flex align-items-center flex-row gap-4 border-top border-bottom my-4 p-3", role: "alert" }, h("img", { key: '053bc242826eeb92456ad1869e11a0083c8a65f6', src: "/info-icon.svg", alt: "Information", height: "30", width: "30" }), h("p", { key: 'cec5c737d36aba8328e07871717aaa6107f3ff8d', class: "m-0", innerHTML: this.refundInfoText }))), h("form", { key: 'f43a1ec8344b9a6222470bb59924743583d61699', onSubmit: e => this.handleSubmit(e), class: "d-grid gap-4" }, h("div", { key: 'bdb96e4a7b9aacd6d85d5736bcc3bfa9c7b949dc', class: "form-group" }, h("form-control-monetary", { key: '59c922da8305ea8069de82f94f287a9d4a885f08', 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: '536874e5887e8085409bc6e2220de0029f986613', class: "form-group" }, h("form-control-text", { key: '25ad446fa05c176169b45b72b26fedfb759376b0', name: "notes", label: "Additional Notes", inputHandler: (name, value) => this.handleInput(name, value), errorText: this.errors.notes })), this.withButton && (h("div", { key: '51a1334769beb7911e2bee6416f1e325e9b6e456', class: "form-group d-flex flex-row-reverse" }, h("button", { key: '1fe584c4c1fcb7e4f36063774303ac17132debbf', type: "submit", disabled: !!this.isSubmitting, class: "btn btn-primary ml-auto" }, this.submitButtonText))))));
     }
     static get is() { return "justifi-refund-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/terminals-list/terminals-list-core.js

@@ -119,7 +119,7 @@ export class TerminalsListCore {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: '7f8bc3f39c1250281c2f2ad6fe081fc71bb20e79' }, h("terminals-list-filters", { key: 'd1184427fc74d970bd69d56a00d0ef4b7672516b', params: this.params, setParamsOnChange: this.setParamsOnChange, clearParams: this.clearParams }), h("div", { key: '582e37429a153cd17bf3c7ebb16e7330c774f986', class: "table-wrapper" }, h("table", { key: '1c03b2ddc8ca2da6b1f2147113f7832b3f27ec1d', class: "table table-hover" }, h("thead", { key: '811d48219cc04256f4a37854504252ff53392bd9', class: "table-head sticky-top", part: "table-head" }, h("tr", { key: 'fafa54ac3abba993dcf38ca2e47f248031226041', class: "table-light text-nowrap", part: "table-head-row" }, this.terminalsTable.columnData.map((column) => column))), h("tbody", { key: '8c9072bf6ebb7f720f1fad0faa47c72c8ed84dd2', class: "table-body", part: "table-body" }, h(TableLoadingState, { key: 'abddb3ce09e39245c0455893f09e54cc631b26bf', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '166a461ee8aaf7405fc0a2b12cd17e1e1e9553f3', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: '969bbfcce66b6bcee4dadabe465eaef37022d13b', columnSpan: this.terminalsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler, part: `table-row ${index % 2 ? "table-row-even" : "table-row-odd"}` }, data)))), this.paging && (h("tfoot", { key: 'c63268c11facddaa44452c58743ad9c03f492898', class: "sticky-bottom" }, h("tr", { key: '0e247f8968ad4ed7e8c001354b1c29d5bf7976aa', class: "table-light align-middle" }, h("td", { key: '51c5157453d911f5bf370ba2ac6a556dd1592f24', part: "pagination-bar", colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: '3a3ba65f31099125e9c01bc9c8c001c6437ed720', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }), params: this.params })))))))));
+        return (h("div", { key: 'd022a41666a6483bcb405bfe477b7eba1e5ca5dd' }, h("terminals-list-filters", { key: 'cb0d38d4b51c5cb9482c1f567dce4462bf12a055', params: this.params, setParamsOnChange: this.setParamsOnChange, clearParams: this.clearParams }), h("div", { key: '82cbf05382d9ecaf0d01c4e0b5f61618b1442690', class: "table-wrapper" }, h("table", { key: '5c8bd36b6523cf56542b016e3195188781b2cb03', class: "table table-hover" }, h("thead", { key: 'f35d86ae84f673437e0fc51ad3e26b1839153590', class: "table-head sticky-top", part: "table-head" }, h("tr", { key: '7727a4e30dddd62d6dc3c405c7ca505f91a71643', class: "table-light text-nowrap", part: "table-head-row" }, this.terminalsTable.columnData.map((column) => column))), h("tbody", { key: '4e0ee2053a33622037e7961ec289036e52632e3f', class: "table-body", part: "table-body" }, h(TableLoadingState, { key: '96cb647d4f5c2e4a1ecb33be46b868e1318762ca', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '062aeeb69a149b2f15e49c81bb3bd16a6d5a5dfd', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: '750a04c3ecb53271b3affced7e9245733c64bd57', columnSpan: this.terminalsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalsTable.rowData.map((data, index) => (h("tr", { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler, part: `table-row ${index % 2 ? "table-row-even" : "table-row-odd"}` }, data)))), this.paging && (h("tfoot", { key: '19edc599b2ccd6212c03045b754fe251335fa665', class: "sticky-bottom" }, h("tr", { key: 'dd793c33355dd6b0448e327a62b3cc08a0d09bad', class: "table-light align-middle" }, h("td", { key: '0b142d2c1b658e1bb084741fa461d7f350c3449c', part: "pagination-bar", colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: '757d9ba17e1a768aa0bcf573a2d02b455bac3df3', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }), params: this.params })))))))));
     }
     static get is() { return "terminals-list-core"; }
     static get properties() {

package/dist/collection/components/terminals-list/terminals-list-filters.js

@@ -19,7 +19,7 @@ export class TerminalsListFilters {
         ];
     }
     render() {
-        return (h("table-filters-menu", { key: '4bfd04cf078878811b2692ff166598deb22b7d92', params: this.params, clearParams: this.clearParams }, h("div", { key: '470d4eb34429c887d03beb0caedd8c9486d18900', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '34d34e8c90c36b7cab1fb3442cb04e58f9ebb334', class: "p-2" }, h("form-control-text", { key: '5234008261646f1a090686fc0d795a6e846c9e04', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.params.terminal_id })), h("div", { key: 'fdd089fa29bf030ed3825993ff4e50a9ecefa1dc', class: "p-2" }, h("form-control-select", { key: '0c078ec1ecffea26e0cec5633cb4748337a75643', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.params.status || '' })))));
+        return (h("table-filters-menu", { key: '486847f69064b497b72521312d27097690eb19b2', params: this.params, clearParams: this.clearParams }, h("div", { key: '622e3572ff1cf85a60ffa30c4fa5d39780375abb', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '2cef9085c3d09e96907cdaa8330e8b8b80d8ceec', class: "p-2" }, h("form-control-text", { key: 'a3922b71cbdc93bbdddd519e44bad25379c6b5f4', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.params.terminal_id })), h("div", { key: '1027edf52dc1ceacc4779b29bda4b7d08c8a3c8c', class: "p-2" }, h("form-control-select", { key: 'e1f122b2868282a64dccc99b3e9d19fe7cc768fb', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.params.status || '' })))));
     }
     static get is() { return "terminals-list-filters"; }
     static get properties() {

package/dist/collection/components/terminals-list/terminals-list.js

@@ -89,7 +89,7 @@ export class TerminalsList {
         }
     }
     render() {
-        return (h(StyledHost, { key: '8ffe95f21b5ef8c1c15fc0e22a9c824cff758ee6', exportparts: tableExportedParts }, h("terminals-list-core", { key: 'a550f1f85b84f6cc06bd93b5e5a9ec726b72b46c', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: 'b0109248be43245cc91a844960f83c80b09b88a3', exportparts: tableExportedParts }, h("terminals-list-core", { key: 'c1b6467303b606863c544f898a3c0b8e37c597c2', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get is() { return "justifi-terminals-list"; }
     static get encapsulation() { return "shadow"; }
@@ -156,7 +156,7 @@ export class TerminalsList {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""

package/dist/collection/components/terminals-list/terminals-table.js

@@ -8,8 +8,8 @@ export const terminalTableColumns = {
     status: () => (h("th", { part: "table-head-cell", scope: "col", title: "The current status of each terminal" }, "Status")),
 };
 export const terminalTableCells = {
-    nickname: (value) => (h("td", null, value)),
-    provider_id: (value) => (h("td", null, value)),
-    sub_account_name: (value) => (h("td", null, value)),
-    status: (value) => (h("td", { innerHTML: MapTerminalStatusToBadge(value) })),
+    nickname: (value) => (h("td", { part: "table-cell" }, value)),
+    provider_id: (value) => (h("td", { part: "table-cell" }, value)),
+    sub_account_name: (value) => (h("td", { part: "table-cell" }, value)),
+    status: (value) => (h("td", { part: "table-cell", innerHTML: MapTerminalStatusToBadge(value) })),
 };

package/dist/collection/components/tokenize-payment-method/tokenize-payment-method.js

@@ -36,7 +36,7 @@ export class TokenizePaymentMethod {
         this.paymentMethodOptionsRef.fillBillingForm(fields);
     }
     render() {
-        return (h(StyledHost, { key: 'd6b961d57ad40a36a55db9f4a338f2e4659737b8' }, h("form", { key: '478202bc0e742f132df696e317a5d87b583a65c3' }, h("fieldset", { key: '565295af010636d9746c5a3466ce6b3bf4fe5ba2' }, h("div", { key: '95736fa3b125f6c389e80505842749d40eb50318', class: "row gy-3" }, h("div", { key: '086f7078ab5301c59ea3a1003162ebf82907b594', class: "col-12" }, h("justifi-payment-method-options", { key: '13d99aee101cd0dc9cdf52abf3e510a8ee490e82', ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": false, paymentMethodGroupId: this.paymentMethodGroupId, "show-saved-payment-methods": false, authToken: this.authToken, "account-id": this.accountId })), h("div", { key: '348afe48dbcb996b268bf9e6416f25540f9b2930', class: "col-12" }, h(Button, { key: '00baa2bd2b99a9a8329b9abaace0afac36ae094a', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button" }, this.submitButtonText || 'Submit')))))));
+        return (h(StyledHost, { key: 'ff495ccfaf453b5efc1e09d6a3dbeae2f7056368' }, h("form", { key: '92e7ce29d3d7f12def1f83e35130de8ec3637140' }, h("fieldset", { key: 'b0e1b306f0ad87cabf04429760f9043319ea45c3' }, h("div", { key: '1176a0d441ed62522ddabf573f674903e39b17f2', class: "row gy-3" }, h("div", { key: 'c920e3759b0ae8dabda8947823831a5bac39b33a', class: "col-12" }, h("justifi-payment-method-options", { key: '1e764236818baef88ce825dbc8903f2767d2fa95', ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": false, paymentMethodGroupId: this.paymentMethodGroupId, "show-saved-payment-methods": false, authToken: this.authToken, "account-id": this.accountId })), h("div", { key: 'f1cd3b08d4c558933b3da04073e527b5b0958f8b', class: "col-12" }, h(Button, { key: 'd321de173c8deaf8dcb382d14d9688cbd83ee3b9', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button" }, this.submitButtonText || 'Submit')))))));
     }
     static get is() { return "justifi-tokenize-payment-method"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/ui-components/custom-popper/custom-popper.js

@@ -81,7 +81,7 @@ export class CustomPopper {
         this.hideEvent.emit();
     }
     render() {
-        return (h("div", { key: '8a37af79ca05c760a65fde19686d0c2e796fbb0b' }, h("style", { key: '9a92807c0d688d1ddc86f05bcc39e34f1da2a939' }, `
+        return (h("div", { key: '486c7b71b1b4f6d3ad8a9b9042fe5bdfe0427443' }, h("style", { key: '54a5bed99c8cf367642c63650200376cc5a90142' }, `
           .popper-content {
             display: none;
           }
@@ -89,7 +89,7 @@ export class CustomPopper {
             display: block;
             z-index: 1030;
           }
-          `), h("div", { key: 'fc9582fdc9d0b2e0ad115daad752796cd2bc4067', class: "popper-content", ref: (el) => this.popperContentRef = el }, h("slot", { key: '79ecc806af9caa4450969cd4b84868b59aa3f55b' }))));
+          `), h("div", { key: '1c4dc36300485c1c331f39998bf23127ea5e6177', class: "popper-content", ref: (el) => this.popperContentRef = el }, h("slot", { key: '9dbb8f23779595303814ef10762663b809447c32' }))));
     }
     static get is() { return "custom-popper"; }
     static get properties() {

package/dist/collection/ui-components/filters/utils.js

@@ -1,3 +1,14 @@
+export function composeQueryParams(values) {
+    const queryParams = values.map((value) => {
+        if (value === values[0]) {
+            return (value = `?${value}`);
+        }
+        else {
+            return (value = `&${value}`);
+        }
+    });
+    return queryParams.join('');
+}
 export const onFilterChange = (newFilters, params) => {
     let newParams = Object.assign({}, params);
     delete newParams.before_cursor;

package/dist/collection/ui-components/form/form-control-checkbox.js

@@ -25,7 +25,7 @@ export class CheckboxInput {
         this.updateInput(this.defaultValue);
     }
     render() {
-        return (h(Host, { key: 'c8edb4605eb989c6ace61a706eecdfaa2fdb312b', exportparts: "label,input,input-invalid" }, h("div", { key: '7e947fd7c2bb62d595b4573196c29e65c49a9fd2', class: 'form-group d-flex flex-column' }, h("div", { key: 'c436746afb9b635164d97787a2c016376293efe6', class: "form-check" }, h("input", { key: '1c49c239af1e8d40306ea9501811496fc4e4f363', ref: el => (this.checkboxElement = el), type: "checkbox", id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input-checkbox ${this.errorText ? 'input-checkbox-invalid' : ''}`, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled }), h("label", { key: 'c84eedc7331cfb4beaa2dacef387179d0d7b3edc', class: "form-check-label", htmlFor: this.name }, this.label)), h("form-control-help-text", { key: 'e7b88e259c2e8cfb11fce667d35d44770baa3283', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: 'ed6dbbb0cab64fac7b9fdf3927cdca135dcaef88', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: '62c7e5756a185d29a941dd63a431756beed3d554', exportparts: "label,input,input-invalid" }, h("div", { key: 'db89c096aa07aecd8c5205905c26f56ac4282a3a', class: 'form-group d-flex flex-column' }, h("div", { key: '8f6c06c0150eee6284d3b2465b3aca916c2d7f83', class: "form-check" }, h("input", { key: '25b9b0a620ee3fce0f4fa4892a38b289e0a0d521', ref: el => (this.checkboxElement = el), type: "checkbox", id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input-checkbox ${this.errorText ? 'input-checkbox-invalid' : ''}`, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled }), h("label", { key: '783d5dbbafeeeceab3400361eff65cd6a075f637', class: "form-check-label", htmlFor: this.name }, this.label)), h("form-control-help-text", { key: '4b129fa8360d7d305f14939d213667a9003c6b94', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '303b12a3b51634866a4266486ac6295f5d582ab6', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-checkbox"; }
     static get properties() {

package/dist/collection/ui-components/form/form-control-date.js

@@ -2,17 +2,9 @@ import { Host, h, } from "@stencil/core";
 export class DateInput {
     constructor() {
         this.handleFormControlInput = (event) => {
-            const target = event.target;
-            const localValue = target.value;
-            if (this.filterTimeZone) {
-                const utcDate = this.convertToUTC(localValue);
-                this.inputHandler(this.name, utcDate);
-                this.formControlInput.emit({ name: this.name, value: utcDate });
-            }
-            else {
-                this.inputHandler(this.name, localValue);
-                this.formControlInput.emit({ name: this.name, value: localValue });
-            }
+            const dateValue = event.target.value;
+            this.inputHandler(this.name, dateValue);
+            this.formControlInput.emit({ name: this.name, value: dateValue });
         };
         this.name = undefined;
         this.label = undefined;
@@ -21,17 +13,11 @@ export class DateInput {
         this.helpText = undefined;
         this.errorText = undefined;
         this.disabled = undefined;
-        this.filterTimeZone = false;
         this.showTime = undefined;
         this.maxDate = this.currentDate;
     }
     handleDefaultValueChange(newValue) {
-        if (this.filterTimeZone) {
-            this.updateInput(this.convertToLocal(newValue));
-        }
-        else {
-            this.updateInput(newValue);
-        }
+        this.updateInput(newValue);
     }
     get currentDate() {
         if (!this.showTime) {
@@ -42,30 +28,13 @@ export class DateInput {
         }
     }
     componentDidLoad() {
-        if (this.filterTimeZone) {
-            this.updateInput(this.convertToLocal(this.defaultValue));
-        }
-        else {
-            this.updateInput(this.defaultValue);
-        }
+        this.updateInput(this.defaultValue);
     }
     updateInput(value) {
         this.dateInput.value = value;
     }
-    convertToUTC(value) {
-        const dateObj = new Date(value);
-        return new Date(dateObj.toUTCString()).toISOString();
-    }
-    convertToLocal(value) {
-        if (!value)
-            return value;
-        const date = new Date(value);
-        // Adjust the date to the local timezone
-        const localDate = new Date(date.getTime() - date.getTimezoneOffset() * 60000);
-        return this.showTime ? localDate.toISOString().slice(0, 16) : localDate.toISOString().split('T')[0];
-    }
     render() {
-        return (h(Host, { key: 'd3fe13284d2f08b951f12d16ea6a56492864991e', exportparts: "label,input,input-invalid" }, h("div", { key: '4823a873c5a8851b094ae59869014ffc6e603328', class: "form-group d-flex flex-column" }, h("div", { key: 'c2205441e85bfe202ae80660eafb4a3f0bae3f82', class: "d-flex gap-2" }, h("label", { key: 'c82d9599db4f54b647bf930e2a44b2f82b07876c', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'b2d8b21a6dba7f4e093081eb274e02d4484198e1', helpText: this.helpText })), h("input", { key: '579063f27122ec31f3818d3168060e43c51c1889', type: this.showTime ? 'datetime-local' : 'date', ref: el => (this.dateInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled, max: this.maxDate }), h("form-control-error-text", { key: '75b7361712bbc65683b19a40398fa5b111b8b39b', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: '29a793e97ef8cc6bd532ce6f86e31028e6a3a783', exportparts: "label,input,input-invalid" }, h("div", { key: '32487660602957a69c9cd82625bd019335e76124', class: "form-group d-flex flex-column" }, h("div", { key: '5d45a740e61f328cb0bec179117b97ea9449bc03', class: "d-flex gap-2" }, h("label", { key: 'ba01fd2ce1f8f8cfa3a0599b21c01071eb6400a0', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'aeaaf6caa4b4999ec1ecd419f4699aceb72d6cb1', helpText: this.helpText })), h("input", { key: 'af713ff971ca5b8c046199ff1252db40649a8f94', type: this.showTime ? 'datetime-local' : 'date', ref: el => (this.dateInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled, max: this.maxDate }), h("form-control-error-text", { key: '02338706e4d55074014d8e177c27c002181a93e6', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-date"; }
     static get properties() {
@@ -187,24 +156,6 @@ export class DateInput {
                 "attribute": "disabled",
                 "reflect": false
             },
-            "filterTimeZone": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "attribute": "filter-time-zone",
-                "reflect": false,
-                "defaultValue": "false"
-            },
             "showTime": {
                 "type": "boolean",
                 "mutable": false,

package/dist/collection/ui-components/form/form-control-file.js

@@ -31,7 +31,7 @@ export class FileInput {
         this.fileInput = this.el.querySelector('input');
     }
     render() {
-        return (h(Host, { key: 'd3928cd6013d8e1bd23921a3d73b57de3a3f4c8f', exportparts: "label,input,input-invalid" }, h("div", { key: '5c15b542801ed84a4bdd43b7a7cb8f9a70ab5016', class: "form-group d-flex flex-column" }, h("div", { key: '1636d3a16f0da8047361cbaa87423d35e042de40', class: "d-flex align-items-start gap-2" }, h("label", { key: 'bfce95a71327cf8dd69aee4de8f1ff72c2ddcd97', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '2f6167da52618938b39e3917332a74ac3c19aba0', helpText: this.helpText })), h("input", { key: '1b06c50ddb2c1bec731ceca89cc2a19a7329e3cd', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: `input ${this.errorText ? "input-invalid " : ""}${this.disabled ? "input-disabled" : ""}`, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onBlur: () => this.formControlBlur.emit() }), h("form-control-error-text", { key: '0f38dc541504c11d49afda08f5531d9612e4911d', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: 'e67b1c78293ee490ff9f468e98533c2eed03a14a', exportparts: "label,input,input-invalid" }, h("div", { key: '373c4ccfdbdd49f00bfe3673bb284930706f7842', class: "form-group d-flex flex-column" }, h("div", { key: '93d7524b79cc2a537f4ccc6bea300182ddd31f40', class: "d-flex align-items-start gap-2" }, h("label", { key: 'f5619fd58b973b31c8ea47b52715ede5f5891283', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'fd0979253100c2e3efbb30a6fd698b756cf42bbe', helpText: this.helpText })), h("input", { key: '8185ccf0fdae02ec7c8cfd6d6cdedfe80f012f4e', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: `input ${this.errorText ? "input-invalid " : ""}${this.disabled ? "input-disabled" : ""}`, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onBlur: () => this.formControlBlur.emit() }), h("form-control-error-text", { key: '0aef8ab535103ef7a0b8f7df3b23508985559072', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-file"; }
     static get properties() {

package/dist/collection/ui-components/form/form-control-monetary.js

@@ -47,7 +47,7 @@ export class MonetaryInput {
         (_a = this.imask) === null || _a === void 0 ? void 0 : _a.destroy();
     }
     render() {
-        return (h(Host, { key: '2a65acfea8e79d22dd09c7c116d80b12a2f2a47c', exportparts: "label,input,input-group-input,input-group-text,input-invalid" }, h("div", { key: '166dfb5c261c21d58db1a0e17d8bae149834c149', class: "form-group d-flex flex-column" }, h("label", { key: '1980871936440222e2b711ba2953d7b6287bf080', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("div", { key: '4cfb60bf946fa7e745c93b391997218122c551a0', class: "input-group" }, h("span", { key: '711357a32f9dc1fef77359f15ec3167a468d0463', class: "input-group-text", part: "input-group-text" }, "$"), h("input", { key: '2489cab2ecb61096f781d339363dad50404e3c67', ref: el => (this.textInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input input-group-input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control monetary is-invalid' : 'form-control monetary', type: "text", disabled: this.disabled })), h("form-control-help-text", { key: 'f7e89f0830ca0f453b02595303a245691f448d55', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '61f03f0d09027237ab3f5c7979981ddc3dc4c916', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: '27e8570c7ddb6747f8b78fdf0222747022b2e4b2', exportparts: "label,input,input-group-input,input-group-text,input-invalid" }, h("div", { key: '1ee22eda4b9f5b5ddf42f1d15d4ec3ee084e967e', class: "form-group d-flex flex-column" }, h("label", { key: '73930260feaeca6edab8b9947da211358474b680', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("div", { key: '7da2e46e0538563151f4603bfbeee22a447e7310', class: "input-group" }, h("span", { key: '3209947bf3c65c2ecfd3b56a0da27d663b444742', class: "input-group-text", part: "input-group-text" }, "$"), h("input", { key: 'ba3d0b0a55ba25a9b7315fc9e95e408073b47cf5', ref: el => (this.textInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input input-group-input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control monetary is-invalid' : 'form-control monetary', type: "text", disabled: this.disabled })), h("form-control-help-text", { key: 'af50f5b6f8f9ce1ac80be790f64dfbcd5067f5aa', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '2d134789d103c82c545c97428e6a4e4da1c0e099', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-monetary"; }
     static get properties() {

package/dist/collection/ui-components/form/form-control-number-masked.js

@@ -52,7 +52,7 @@ export class NumberInputMasked {
         }
     }
     render() {
-        return (h(Host, { key: 'd22be5920cedfcbeb57164ba2d6909dc820fee6c', exportparts: "label,input,input-invalid" }, h("div", { key: '9ae430200ebdd26f5995dd2ccad7ad759d14ee11', class: "form-group d-flex flex-column" }, h("div", { key: '796880c67b2bd97977d09721f58357521cb76456', class: "d-flex align-items-start gap-2" }, h("label", { key: '8e4f342d1cebff5ba32b622448f759d83625d929', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '49b58ac4725e882732daefd29b3ce3c248fbe385', helpText: this.helpText })), h("input", { key: '566965701a60397807cc857813f839f56477dd81', ref: el => (this.textInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "text", disabled: this.disabled }), h("form-control-error-text", { key: '783689f60c6aacab17be5a94a2b1abbd01232a42', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: '2347d776d2ca3dba7c4c331bbeb3d4e359268704', exportparts: "label,input,input-invalid" }, h("div", { key: '16d437f201888fdef6148630e5afc75ee7c36bae', class: "form-group d-flex flex-column" }, h("div", { key: 'd776ff7c160cbba0436ec36e20cb0c81edbc380f', class: "d-flex align-items-start gap-2" }, h("label", { key: '8c6664087dc2593870380341cf51fc5511a95e35', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '1495842c0cd7117c50c62888cf90e001a4e15756', helpText: this.helpText })), h("input", { key: 'f2468b56ba6f1e7482c5437ce728a4dc39db966b', ref: el => (this.textInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "text", disabled: this.disabled }), h("form-control-error-text", { key: '7e2485e91f263e8a970b91628adf945eb3280c2d', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-number-masked"; }
     static get properties() {

package/dist/collection/ui-components/form/form-control-number.js

@@ -28,7 +28,7 @@ export class NumberInput {
         this.updateInput(this.defaultValue);
     }
     render() {
-        return (h(Host, { key: '2531e0e3e6ce1a477687be5f520f491256fb1841', exportparts: 'label,input,input-invalid' }, h("div", { key: '32df49f44e1a9737fbe62a6729007c048ed1ecac', class: 'form-group d-flex flex-column' }, h("label", { key: '33da2c09b1cf6b5d816bfa315061b4c5f211f0c5', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("input", { key: 'a890c2d80dd744194f715ab148e6229d3bb524ac', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "number", disabled: this.disabled }), h("form-control-help-text", { key: 'cb649de955887d02da58ab9934cadf5956cf7f8e', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: 'db06fb4008f3f66b3b726f67bd58ae96bd152bd8', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: '3b2f42c3cd26fb238f2b728522608c9d37d087a9', exportparts: 'label,input,input-invalid' }, h("div", { key: '01a3382ef37353f3cad6d6ffb66ce2ff5f13b8de', class: 'form-group d-flex flex-column' }, h("label", { key: '981f1089d6ec68cda5c91ced9025b5ff021aad50', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("input", { key: 'e1e2630c0d5921eb2c09f66495f534ac39f64f09', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "number", disabled: this.disabled }), h("form-control-help-text", { key: '8e2b99df6f3a2d5c3bca0903d0f74ff404a73cf8', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '03f12d2baa3aac08f460332a4867ab7ef8e82143', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-number"; }
     static get properties() {

package/dist/collection/ui-components/form/form-control-radio.js

@@ -26,7 +26,7 @@ export class RadioInput {
         this.updateInput(this.defaultChecked);
     }
     render() {
-        return (h(Host, { key: '00ddff45ec5c4c37ddd90f7e8c43559356e23d6a', exportparts: "label,input,input-invalid" }, h("div", { key: '8a853ad5c99ee78111494dff4772ba6ece292f17', class: 'form-group d-flex flex-column' }, h("div", { key: 'bd0fa6c02ad9b3b5900f53bd520f9628bac13fad', class: "form-check" }, h("input", { key: '4318242ddc4ac275660dd8daac0b86d741d6cdf3', ref: el => (this.radioElement = el), type: "radio", id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input-radio ${this.errorText ? 'input-radio-invalid' : ''}`, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, value: this.value }), h("label", { key: 'ece1080c9d76c1459649ae80dcf894623955a61c', class: "form-check-label", htmlFor: this.name }, this.label)), h("form-control-help-text", { key: '4862090450a3a9a2bab95a994d41bc54535007ec', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '6cc9c5629e0f4bc6c7307a7f0a6f1726717d50fe', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: 'd06ffa17fb7ef51b08b8c0d52c6d83ec040a15a7', exportparts: "label,input,input-invalid" }, h("div", { key: '9dc89af6c7118dae09d29daa6739847ee11ba7ff', class: 'form-group d-flex flex-column' }, h("div", { key: 'fa028b5f9901ca403fe120bc16e9fb48e2a5c92d', class: "form-check" }, h("input", { key: '78222c89d2713c070b2d38be3bc7953cd5c18677', ref: el => (this.radioElement = el), type: "radio", id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input-radio ${this.errorText ? 'input-radio-invalid' : ''}`, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, value: this.value }), h("label", { key: 'ef2c6c45bf587d87bad6883fe79622a648d80d80', class: "form-check-label", htmlFor: this.name }, this.label)), h("form-control-help-text", { key: '28b32ee27148438b72bb909cc9cc309de936b158', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '8485f4d22f4bc0bb2238de5ab5bf7071203bac2b', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-radio"; }
     static get properties() {

package/dist/collection/ui-components/form/form-control-text.js

@@ -30,7 +30,7 @@ export class TextInput {
         this.updateInput(this.defaultValue);
     }
     render() {
-        return (h(Host, { key: '3450b693ae915280ba28a38613a9bd2ebb360677', exportparts: "label,input,input-invalid" }, h("div", { key: 'f815c2ff679a73375cb2d12087ecf4a2bf17d5e4', class: "form-group d-flex flex-column" }, h("div", { key: '3119c59e3f7d6b547088b1eccab66641129ec71e', class: "d-flex align-items-start gap-2" }, h("label", { key: '4e1cd66eb84cd6b3449bed5c1099627ad9ffa213', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'fc9bd0b06d2400a6109b93ec7c8cc7f4e8955e3b', helpText: this.helpText })), h("input", { key: '9d1d615016acd3611bee6d097ed15c3c926c5e76', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: `input ${this.errorText ? "input-invalid " : ""}${this.disabled ? " input-disabled" : ""}`, class: this.errorText ? "form-control is-invalid" : "form-control", type: "text", disabled: this.disabled }), h("form-control-error-text", { key: 'ac9f44ac5411a76c8b29f00ac4bfda91f5395e71', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: '31f393afa67b52bea6b833a12be0bd06ce673bb2', exportparts: "label,input,input-invalid" }, h("div", { key: '14e875434e0f5c942623cbac1c338ef8775ed24d', class: "form-group d-flex flex-column" }, h("div", { key: '7c43ad5f89675b4db4b70e1e43a862e493ebeb30', class: "d-flex align-items-start gap-2" }, h("label", { key: '7d97de55470f39608349cf54225b927f9f029db8', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'fd857b971360bf3bc87d902e28e15b17c1484bdd', helpText: this.helpText })), h("input", { key: 'ba0e1464cd736c8761cdee43715f9986480639c7', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: `input ${this.errorText ? "input-invalid " : ""}${this.disabled ? " input-disabled" : ""}`, class: this.errorText ? "form-control is-invalid" : "form-control", type: "text", disabled: this.disabled }), h("form-control-error-text", { key: '31c1a57ce24a129a199864f20a0498957c2a43ea', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-text"; }
     static get properties() {

package/dist/collection/ui-components/form/form-control-textarea.js

@@ -30,7 +30,7 @@ export class TextInput {
         this.updateInput(this.defaultValue);
     }
     render() {
-        return (h(Host, { key: '0c4290f6731324ed511abb14a7b84e07f061e2d0', exportparts: "label,input,input-invalid" }, h("div", { key: '615c33ea0f0488b0d1224fb158d77cd1234fa311', class: "form-group d-flex flex-column" }, h("label", { key: '86f2ce13d24b447f84af7bc59a89267e988992ce', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("textarea", { key: '1dbade53d02ac7a7daa1b546ab5d6d0e18c5fb46', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: `input ${this.errorText ? 'input-invalid ' : ''}${this.disabled ? ' input-disabled' : ''}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled }), h("form-control-help-text", { key: '73974fe9a18995251e39ca494ec9cecbf90af21d', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: 'e8f10bd3ec0fbb215d113159d38888fe9b3f4689', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: 'df50b59fa604d9411c904096342910fa7bda38c5', exportparts: "label,input,input-invalid" }, h("div", { key: '586ec64cf4e9fa5c557745225a24b500ccbe2479', class: "form-group d-flex flex-column" }, h("label", { key: 'eb2134c04fb7ed8e23606eaef6257767451fc4f1', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("textarea", { key: '786ba64947c1ecfc70bbca823490a227c9fcd544', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: `input ${this.errorText ? 'input-invalid ' : ''}${this.disabled ? ' input-disabled' : ''}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled }), h("form-control-help-text", { key: 'a3d0c605439eb3f6dab7c61dc49c14dad0207623', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '0f0abe694c8b7a66378b447728a466407b51b082', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-textarea"; }
     static get properties() {

package/dist/collection/utils/table.js

@@ -3,8 +3,8 @@ export class Table {
         return this.columnKeys.map((key) => this.tableColumns[key]());
     }
     get rowData() {
-        return this.collection.map((checkout) => {
-            return this.columnKeys.map((key) => this.tableCells[key](checkout[key]));
+        return this.collection.map((dataEntry) => {
+            return this.columnKeys.map((key) => this.tableCells[key](dataEntry[key]));
         });
     }
     set collectionData(collection) {