@justifi/webcomponents 5.3.5 → 5.4.0

package/dist/collection/components/terminal-orders-list/terminal-orders-list-core.js

@@ -4,24 +4,28 @@ import { table, tableCell } from "../../styles/parts";
 import { TableEmptyState, TableErrorState, TableLoadingState } from "../../ui-components";
 import { pagingDefaults } from "../../api";
 import { terminalOrdersTableCells, terminalOrdersTableColumns } from "./terminal-orders-table";
-import mockTerminalOrders from "../../../../../mockData/mockTerminalOrdersListSuccess.json";
+import { TableClickActions } from "../../ui-components/table/event-types";
+import { getRequestParams, onQueryParamsChange } from "./terminal-orders-list-params-state";
 export class TerminalOrdersListCore {
     constructor() {
         this.handleClickPrevious = (beforeCursor) => {
             this.pagingParams = { before_cursor: beforeCursor };
+            this.clickEvent.emit({ name: TableClickActions.previous });
         };
         this.handleClickNext = (afterCursor) => {
             this.pagingParams = { after_cursor: afterCursor };
+            this.clickEvent.emit({ name: TableClickActions.next });
         };
         this.rowClickHandler = (e) => {
             const clickedOrderId = e.target.closest('tr').dataset.rowEntityId;
             if (!clickedOrderId)
                 return;
-            console.log('clickedOrderId', clickedOrderId);
+            const orderData = this.terminalOrders.find((order) => order.id === clickedOrderId);
+            this.clickEvent.emit({ name: TableClickActions.row, data: orderData });
         };
         this.getTerminalOrders = undefined;
         this.columns = undefined;
-        this.terminalOrders = mockTerminalOrders.data;
+        this.terminalOrders = [];
         this.terminalOrdersTable = undefined;
         this.loading = true;
         this.errorMessage = undefined;
@@ -36,11 +40,38 @@ export class TerminalOrdersListCore {
         if (this.getTerminalOrders) {
             this.fetchData();
         }
+        onQueryParamsChange('set', () => {
+            this.pagingParams = {};
+        });
+        onQueryParamsChange('reset', () => {
+            this.pagingParams = {};
+            this.errorMessage = '';
+        });
     }
     fetchData() {
         this.loading = true;
-        console.log('fetching terminal orders');
-        this.loading = false;
+        this.getTerminalOrders({
+            params: this.terminalOrderParams,
+            onSuccess: async ({ terminalOrders, pagingInfo }) => {
+                this.terminalOrders = terminalOrders;
+                this.paging = pagingInfo;
+                this.terminalOrdersTable.collectionData = this.terminalOrders;
+            },
+            onError: ({ error, code, severity }) => {
+                this.errorMessage = error;
+                this.errorEvent.emit({
+                    errorCode: code,
+                    message: error,
+                    severity,
+                });
+            },
+            final: () => { this.loading = false; },
+        });
+    }
+    get terminalOrderParams() {
+        const requestParams = getRequestParams();
+        const params = Object.assign(Object.assign({}, requestParams), this.pagingParams);
+        return params;
     }
     get entityId() {
         return this.terminalOrders.map((terminalOrder) => terminalOrder.id);
@@ -55,7 +86,7 @@ export class TerminalOrdersListCore {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: 'e07bb592d2d419079a00fe017789c98dc5814202' }, h("div", { key: '1090df8ad75e0fdcd07a625c608c2fc0d38391d9', class: "table-wrapper" }, h("table", { key: '31637db0926f2cd88d1333d5f512842406b1e0ef', class: "table table-hover", part: table }, h("thead", { key: '2af2d35a486433b2cb2bab0b7d61d4be9e8d70ab', class: "table-head sticky-top" }, h("tr", { key: 'a42e578f3369b6466a331abeb34d63d9c09c0122', class: "table-light text-nowrap" }, this.terminalOrdersTable.columnData.map((column) => column))), h("tbody", { key: '16c4a9e940268fe2da49a9b14680d34a0f160ccc', class: "table-body" }, h(TableLoadingState, { key: 'a1ce6dcc9799bdd215b5d686d05e3014e594d975', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '135df5499de4e17855643d8ce4ebeb7f71aa5e85', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: '00d2f0bc0bceb46178970c1eb0a0eb87c6fa6054', columnSpan: this.terminalOrdersTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalOrdersTable.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: '49ce37b7ea5e979c8d754d48b9c803a163623387', class: "sticky-bottom" }, h("tr", { key: 'b73f32023e01d82c3eb91120c7eae907a9367517', class: "table-light align-middle" }, h("td", { key: 'cae073d169507d459d60f150fecbaad287996c74', part: tableCell, colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: '9a9fa1cd2c520ee09814adf6d060d048bd77dcc1', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h("div", { key: '07a7b40585feb4644ddcf1a8c202460c79c8b045' }, h("div", { key: 'e03fc01808d22ce86bfdfaa2086f8492f45ee64e', class: "table-wrapper" }, h("table", { key: '0c54da0a4526466e487ad5093cb6c426c4cfb81a', class: "table table-hover", part: table }, h("thead", { key: 'b4495bd1eb73750104667cb7b74061dca4bb6257', class: "table-head sticky-top" }, h("tr", { key: '8df705836f557da6c08b33094eecb0505f8d3ec8', class: "table-light text-nowrap" }, this.terminalOrdersTable.columnData.map((column) => column))), h("tbody", { key: '47b008d75931b177e1acd3bc073f6015dfb17498', class: "table-body" }, h(TableLoadingState, { key: '7f2e4e329ec342db4aac981e514e28245cdbc992', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'f4a17608ce889a890f5dd1bf689e6ae24ad28ca9', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: 'e57677d193f4eff27793d684607572631dc97d8a', columnSpan: this.terminalOrdersTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalOrdersTable.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: '7c427d0b2db99df57ebd097ef8671566f6239d50', class: "sticky-bottom" }, h("tr", { key: 'b5d8bf7d6d43119f8f31a2ea0e0966e8f0888889', class: "table-light align-middle" }, h("td", { key: 'f36bd4d815ca6be5c69a264c90b0ce6696bc6664', part: tableCell, colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: '25f4964ec46220bbceac9f763e668f77bac79299', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get is() { return "terminal-orders-list-core"; }
     static get properties() {
@@ -111,6 +142,27 @@ export class TerminalOrdersListCore {
     }
     static get events() {
         return [{
+                "method": "clickEvent",
+                "name": "click-event",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "ComponentClickEvent",
+                    "resolved": "ComponentClickEvent",
+                    "references": {
+                        "ComponentClickEvent": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::ComponentClickEvent"
+                        }
+                    }
+                }
+            }, {
                 "method": "errorEvent",
                 "name": "error-event",
                 "bubbles": true,
@@ -121,9 +173,15 @@ export class TerminalOrdersListCore {
                     "text": ""
                 },
                 "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
+                    "original": "ComponentErrorEvent",
+                    "resolved": "ComponentErrorEvent",
+                    "references": {
+                        "ComponentErrorEvent": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::ComponentErrorEvent"
+                        }
+                    }
                 }
             }];
     }

package/dist/collection/components/terminal-orders-list/terminal-orders-list-filters.js

@@ -0,0 +1,141 @@
+import { h } from "@stencil/core";
+import { filterParams, propsParams, clearParams } from "./terminal-orders-list-params-state";
+import { StyledHost } from "../../ui-components";
+import { TerminalOrderStatus, TerminalOrderType } from "../../api";
+import { convertToLocal, convertToUTC } from "../../utils/utils";
+import { terminalOrdersListFilterMenu, orderStatusTerminalOrdersListFilterParam, orderTypeTerminalOrdersListFilterParam, createdAfterTerminalOrdersListFilterParam, createdBeforeTerminalOrdersListFilterParam } from "../../styles/parts";
+export class TerminalOrdersListFilters {
+    constructor() {
+        this.setParamsOnChange = (name, value) => {
+            filterParams[name] = value;
+        };
+        this.handleDateInput = (name, value) => {
+            const utcDate = convertToUTC(value, { setExactTime: true });
+            this.setParamsOnChange(name, utcDate);
+        };
+        this.orderStatus = undefined;
+        this.orderType = undefined;
+        this.createdAfter = undefined;
+        this.createdBefore = undefined;
+    }
+    componentWillLoad() {
+        const propsToSet = {
+            order_status: this.orderStatus,
+            order_type: this.orderType,
+            created_after: this.createdAfter,
+            created_before: this.createdBefore
+        };
+        Object.entries(propsToSet).forEach(([key, value]) => {
+            if (value) {
+                propsParams[key] = value;
+            }
+        });
+    }
+    get terminalOrderStatusOptions() {
+        return [
+            { label: 'All', value: '' },
+            { label: 'Created', value: TerminalOrderStatus.created },
+            { label: 'Completed', value: TerminalOrderStatus.completed },
+            { label: 'Submitted', value: TerminalOrderStatus.submitted },
+        ];
+    }
+    get terminalOrderTypeOptions() {
+        return [
+            { label: 'All', value: '' },
+            { label: 'Boarding Only', value: TerminalOrderType.boardingOnly },
+            { label: 'Boarding Shipping', value: TerminalOrderType.boardingShipping },
+        ];
+    }
+    render() {
+        const filterMenuParams = Object.assign({}, filterParams);
+        return (h(StyledHost, { key: '9f84e2a68bbf745714bd972e6f8510eb5c864248' }, h("table-filters-menu", { key: 'f78bfdd9940b62f74cc96969946df75274e8580c', params: filterMenuParams, clearParams: clearParams, part: terminalOrdersListFilterMenu }, h("div", { key: 'e16d37583700f39e1ab513fb362555677aa77bbf', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '81e9b0f98cec6fb803b17ce10a1a79d61f302988', class: "p-2" }, h("form-control-select", { key: 'c5749e4b06a3c4af835e03384434d0fed054c22b', name: "order_status", label: "Order Status", options: this.terminalOrderStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderStatus || filterParams.order_status, disabled: !!this.orderStatus, part: orderStatusTerminalOrdersListFilterParam })), h("div", { key: 'e2367532d8147a1fc184eadce40f61894cd701cd', class: "p-2" }, h("form-control-select", { key: 'f8145506abf6879b4a21d9ae49d43061e5f6daef', name: "order_type", label: "Order Type", options: this.terminalOrderTypeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.orderType || filterParams.order_type, disabled: !!this.orderType, part: orderTypeTerminalOrdersListFilterParam })), h("div", { key: '61b3da75c15121adc65c37443f0d251c2bf0af45', class: "p-2" }, h("form-control-date", { key: 'eb8afbbb5b2148fb12705fc0b577290b9f5ac881', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: createdAfterTerminalOrdersListFilterParam })), h("div", { key: '968131100100709c91fdd1c6d2916910bb5d34b2', class: "p-2" }, h("form-control-date", { key: 'd1f34c4297a80dd7c9f3e301d798c99db82a7b80', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
+                convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: createdBeforeTerminalOrdersListFilterParam }))))));
+    }
+    static get is() { return "justifi-terminal-orders-list-filters"; }
+    static get encapsulation() { return "shadow"; }
+    static get properties() {
+        return {
+            "orderStatus": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "TerminalOrderStatus",
+                    "resolved": "TerminalOrderStatus.completed | TerminalOrderStatus.created | TerminalOrderStatus.submitted",
+                    "references": {
+                        "TerminalOrderStatus": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::TerminalOrderStatus"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "order-status",
+                "reflect": false
+            },
+            "orderType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "TerminalOrderType",
+                    "resolved": "TerminalOrderType.boardingOnly | TerminalOrderType.boardingShipping",
+                    "references": {
+                        "TerminalOrderType": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::TerminalOrderType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "order-type",
+                "reflect": false
+            },
+            "createdAfter": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "created-after",
+                "reflect": false
+            },
+            "createdBefore": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "created-before",
+                "reflect": false
+            }
+        };
+    }
+}

package/dist/collection/components/terminal-orders-list/terminal-orders-list-params-state.js

@@ -0,0 +1,14 @@
+import { createStore } from "@stencil/store";
+const filterParamsInitialState = {};
+const propsParamsInitialState = {};
+const filterParamsStore = createStore(() => filterParamsInitialState);
+const { state: filterParams, on: onQueryParamsChange } = filterParamsStore;
+const propsParamsStore = createStore(() => propsParamsInitialState);
+const { state: propsParams } = propsParamsStore;
+const getRequestParams = () => {
+    return Object.assign(Object.assign({}, filterParams), propsParams);
+};
+const clearParams = () => {
+    filterParamsStore.reset();
+};
+export { filterParams, propsParams, onQueryParamsChange, clearParams, getRequestParams };

package/dist/collection/components/terminal-orders-list/terminal-orders-list.js

@@ -2,37 +2,54 @@ import { h } from "@stencil/core";
 import { StyledHost } from "../../ui-components";
 import { checkPkgVersion } from "../../utils/check-pkg-version";
 import { defaultColumnsKeys } from "./terminal-orders-table";
+import { makeGetTerminalOrders } from "../../actions/terminal/get-terminal-orders";
+import { TerminalOrderService } from "../../api/services/terminal_orders.service";
+import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api";
+import JustifiAnalytics from "../../api/Analytics";
 export class TerminalOrdersList {
     constructor() {
+        this.handleErrorEvent = (event) => {
+            this.errorMessage = event.detail.message;
+            this.errorEvent.emit(event.detail);
+        };
         this.getTerminalOrders = undefined;
         this.errorMessage = null;
-        this.businessId = undefined;
+        this.accountId = undefined;
         this.authToken = undefined;
         this.apiOrigin = PROXY_API_ORIGIN;
         this.columns = defaultColumnsKeys;
     }
     componentWillLoad() {
         checkPkgVersion();
-        this.initializeGetTerminalOrders();
+        this.analytics = new JustifiAnalytics(this);
+        this.initializeGetData();
     }
-    initializeGetTerminalOrders() {
-        if (this.businessId && this.authToken) {
-            this.getTerminalOrders = () => {
-                console.log('getTerminalOrders');
-            };
+    initializeGetData() {
+        if (this.accountId && this.authToken) {
+            this.getTerminalOrders = makeGetTerminalOrders({
+                id: this.accountId,
+                authToken: this.authToken,
+                service: new TerminalOrderService(),
+                apiOrigin: this.apiOrigin
+            });
         }
         else {
-            this.errorMessage = 'Business ID and Auth Token are required';
+            this.errorMessage = 'Account ID and Auth Token are required';
+            this.errorEvent.emit({
+                errorCode: ComponentErrorCodes.MISSING_PROPS,
+                message: this.errorMessage,
+                severity: ComponentErrorSeverity.ERROR,
+            });
         }
     }
     render() {
-        return (h(StyledHost, { key: 'f64c444f9e93c3f520bd5c119b49b6b51163e03b' }, h("terminal-orders-list-core", { key: 'd7601588a25fd5ee08ad8faddc02807a61015d15', getTerminalOrders: this.getTerminalOrders, columns: this.columns })));
+        return (h(StyledHost, { key: '1975f9c01aa35624f1b7f0fc5b444a9b688fb01a' }, h("terminal-orders-list-core", { key: '5488661e4526af1e3db008e56baf5289c46737e6', getTerminalOrders: this.getTerminalOrders, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get is() { return "justifi-terminal-orders-list"; }
     static get encapsulation() { return "shadow"; }
     static get properties() {
         return {
-            "businessId": {
+            "accountId": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -46,7 +63,7 @@ export class TerminalOrdersList {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "business-id",
+                "attribute": "account-id",
                 "reflect": false
             },
             "authToken": {
@@ -110,4 +127,28 @@ export class TerminalOrdersList {
             "errorMessage": {}
         };
     }
+    static get events() {
+        return [{
+                "method": "errorEvent",
+                "name": "error-event",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "ComponentErrorEvent",
+                    "resolved": "ComponentErrorEvent",
+                    "references": {
+                        "ComponentErrorEvent": {
+                            "location": "import",
+                            "path": "../../api",
+                            "id": "src/api/index.ts::ComponentErrorEvent"
+                        }
+                    }
+                }
+            }];
+    }
 }

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

@@ -124,7 +124,7 @@ export class TerminalsListCore {
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h("div", { key: 'd700224838a23855b9cce179c23d40da07fd37ce' }, h("div", { key: '0a03d361d4482342edc5db06209f87a83735791f', class: "table-wrapper" }, h("table", { key: '690d3b7ea58065281171e005252d4969f6284719', class: "table table-hover", part: table }, h("thead", { key: 'c92fc6c7514afc995e0d4e148d715b69c96118cd', class: "table-head sticky-top" }, h("tr", { key: 'bfeff664d29eac8f52e12adf40841b74711e9de2', class: "table-light text-nowrap" }, this.terminalsTable.columnData.map((column) => column))), h("tbody", { key: '0e8c69e12b8a64020e1b10af92ce05f7e1864d28', class: "table-body" }, h(TableLoadingState, { key: '3fef62d6146938773a52c88f178438004d46f1eb', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'caec9eb5131fd8037e5cdccaf6c29d2f7f91ed7e', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: 'bd597887c2441bc070ff8ca9ec8d03564e62b9eb', 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 }, data)))), this.paging && (h("tfoot", { key: 'ec61caec8ae1de6f106221f21827a89dfcad5b05', class: "sticky-bottom" }, h("tr", { key: 'e99c4133f365a7fefdc18d4a8bae9ac67b877fbd', class: "table-light align-middle" }, h("td", { key: 'ed22056d675baa32eef0bcc7fd2a4ae659d563aa', part: tableCell, colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: '8dffd0065bb7d74b43d2a56a5c0356d84301e58b', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        return (h("div", { key: 'b43bce610d87129e9f509a0b62e2c8ca25187c1b' }, h("div", { key: '8a29d235532fbea5e8de8196ba11776dbd697b7e', class: "table-wrapper" }, h("table", { key: 'f52c104f03c014510c8b796d6fdaaf56d0f17cc4', class: "table table-hover", part: table }, h("thead", { key: 'c3690cf84b2208e5bf91ce781876bc42a468f96c', class: "table-head sticky-top" }, h("tr", { key: '419b8dd4d311efe4435c4ca3a15f62985d4300f3', class: "table-light text-nowrap" }, this.terminalsTable.columnData.map((column) => column))), h("tbody", { key: '5c9ef7f9d6d53b2f63c907f35cd7e6afeb44481b', class: "table-body" }, h(TableLoadingState, { key: '6b24dda78bd4c17751e8956127ff9394c720edf5', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '76d3646c7ba043f091947d5fdd536d4ac7df6902', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: '0b418d8ca3268176b47aee6b80712d75181c8d9c', 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 }, data)))), this.paging && (h("tfoot", { key: 'a46a3632e5610dd29f919d9c7b969cb1c07f67ac', class: "sticky-bottom" }, h("tr", { key: '7ef9b68abdae3cb542ecce0c261746413f1e6321', class: "table-light align-middle" }, h("td", { key: '72b477d84f6e58a5e457647e581de87ebc8f53c0', part: tableCell, colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: 'de9635642f0ea24da62b8dd2c50e05c4a2c87f37', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
     }
     static get is() { return "terminals-list-core"; }
     static get properties() {

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

@@ -35,7 +35,7 @@ export class TerminalsListFilters {
     }
     render() {
         const filterMenuParams = Object.assign({}, filterParams);
-        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 }))))));
+        return (h(StyledHost, { key: 'b731afdb3ffb0c9bc35c5e04177b0db9bc5b9a69' }, h("table-filters-menu", { key: '8ee2d6e6f4e12e03a8236b35aae3132f5a72c204', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: 'a8b6adb28c43a2f528554ee9ae582001bddcaac5', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '08cc61200740cb6fac0b123bd2005942ea9d6c3f', class: "p-2" }, h("form-control-text", { key: 'd0f572c893e3d44256d482e791b93588422bcf86', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: 'a498de1139b122bad5416267ecc949debc43491d', class: "p-2" }, h("form-control-select", { key: '6235e893b62882e993e798b9a3cc1fafc84f215c', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
     }
     static get is() { return "justifi-terminals-list-filters"; }
     static get encapsulation() { return "shadow"; }

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

@@ -66,7 +66,7 @@ export class TerminalsList {
         }
     }
     render() {
-        return (h(StyledHost, { key: '8829e2070592554b23ea8593c2528a6582374b1e' }, h("terminals-list-core", { key: '7dfa54f94366214f53fae5240050955a5f5750f4', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '9ad0d637bd745ee2296142c426d539f90cf403a5' }, h("terminals-list-core", { key: '26b420a410976adea74b8545d367b5f9df7178d3', 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"; }

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

@@ -52,7 +52,7 @@ export class TokenizePaymentMethod {
         this.paymentMethodOptionsRef.fillBillingForm(fields);
     }
     render() {
-        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')))))));
+        return (h(StyledHost, { key: 'b4c878459fb1601d429140d80ce02b898d6ca2ed' }, h("form", { key: '11917b591a4116e5711c0afd3e68b6599d064cae' }, h("fieldset", { key: 'b3c4ad0c42a424091a433e9aa8375108831e6c47' }, h("div", { key: 'bee2fa3c6c5de31d25cb102185fc977a5436a53b', class: "row gy-3" }, h("div", { key: 'fb32aa9f47716077a3dad2bfd7bfc950200014ba', class: "col-12" }, h("justifi-payment-method-options", { key: 'dca7ac67609a13e1b14bdc042eb131a07305e0d8', 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: '2218cb2eac22fd6187da4d205fc2437a980fa2a5', class: "col-12" }, h(Button, { key: '1299a5a10261b375cfec1b2599cc6de7f606bad9', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.hideSubmitButton }, this.submitButtonText || 'Submit')))))));
     }
     static get is() { return "justifi-tokenize-payment-method"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/styles/parts.js

@@ -112,3 +112,10 @@ export const terminalsListFilterMenu = `${filterMenu} terminals-list-filter-menu
 export const terminalsListFilterParam = `terminals-list-filter-param`;
 export const terminalIdTerminalsListFilterParam = `${terminalsListFilterParam} terminal-id-terminals-list-filter-param`;
 export const terminalStatusTerminalsListFilterParam = `${terminalsListFilterParam} terminal-status-terminals-list-filter-param`;
+// Terminal Orders List Filters
+export const terminalOrdersListFilterMenu = `${filterMenu} terminal-orders-list-filter-menu`;
+export const terminalOrdersListFilterParam = `terminal-orders-list-filter-param`;
+export const orderStatusTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} order-status-terminal-orders-list-filter-param`;
+export const orderTypeTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} order-type-terminal-orders-list-filter-param`;
+export const createdAfterTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} created-after-terminal-orders-list-filter-param`;
+export const createdBeforeTerminalOrdersListFilterParam = `${terminalOrdersListFilterParam} created-before-terminal-orders-list-filter-param`;

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: '1ea99d6aaa69619c4c1120c1f2fc4e0fcc1cc802' }, h("style", { key: 'b8a785d6c4dc1de3459aa84e8fecc2170c1c52cf' }, `
+        return (h("div", { key: '0da182c59e8285f0ab76d2f667218c378a402518' }, h("style", { key: 'a5cec35dd7cbe6474627f22837703e53711c104b' }, `
           .popper-content {
             display: none;
           }
@@ -89,7 +89,7 @@ export class CustomPopper {
             display: block;
             z-index: 1030;
           }
-          `), h("div", { key: 'fbd29d61602df70db874c80749397b40426f967a', class: "popper-content", ref: (el) => this.popperContentRef = el }, h("slot", { key: 'a75954430d14e1eb0a070650495a2c8e87bbb31d' }))));
+          `), h("div", { key: '657fcfafffda783f7b57af10256fb45c7c8720c9', class: "popper-content", ref: (el) => this.popperContentRef = el }, h("slot", { key: '4cf71afd1ef0e9a24a7d56c118e420d27de31e26' }))));
     }
     static get is() { return "custom-popper"; }
     static get properties() {

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

@@ -38,10 +38,10 @@ export class CheckboxInput {
         return inputCheckbox;
     }
     render() {
-        return (h(Host, { key: '6eb5805f9001ba5f27590a8f709c611bcb491cc7' }, h("div", { key: 'f8b4ee1c24087c1bcb65ac7df4874916c7dd36ad', class: 'form-group d-flex flex-column' }, h("div", { key: 'a41d4b50c7c5d2bdd6008a441d29eba5f8f94b9a', class: "form-check" }, h("input", { key: 'd6124d672dda656b4dc9061176c37f8f14d101c8', ref: el => (this.checkboxElement = el), type: "checkbox", id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: '36192fe5f4e99ccc8cb77b6a0058d68427b6dc79' }, h("div", { key: '3fd77dbca4264579b0e4293bc537dea99a9e325b', class: 'form-group d-flex flex-column' }, h("div", { key: '737b2076e66604ce3fc1b141deb1909a8ac2be27', class: "form-check" }, h("input", { key: '3d606b0c14eda0ffba58bd844b75e3ca23f0a611', ref: el => (this.checkboxElement = el), type: "checkbox", id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, checked: this.checked }), h("label", { key: '429ce242775f3ff5a7dda515bf57cd0780de8fdf', class: "form-check-label", htmlFor: this.name, part: label }, this.label)), h(FormControlHelpText, { key: '4680da9893c1015cb53a85250eb906a07551fdcc', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: 'ed5178fe1bd5cd501ef5ebadcf9e49580b1d2bda', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, checked: this.checked }), h("label", { key: '2a8af56e9bee18f4252ea436ae76d65128ee1648', class: "form-check-label", htmlFor: this.name, part: label }, this.label)), h(FormControlHelpText, { key: '013c9b143992a088692de81b623bffb6b4e5f06f', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '0b6814622ff6d0a61d251aea399600ead731ad1a', 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

@@ -50,10 +50,10 @@ export class DateInput {
         return part;
     }
     render() {
-        return (h(Host, { key: '5360f4917c4af8d4e40522a25e838703d8374480' }, h("div", { key: '56a3a99c81ebbf00d1ff5befa1a96363660806ae', class: "form-group d-flex flex-column" }, h("div", { key: '5556531a79f39fecd1cc4027568bc3642f68ed68', class: "d-flex gap-2" }, h("label", { key: 'b722b7e91adaf94c57698cf5743d43d8cbb04957', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '109aabf5047eebe8254ed49379b297af05f68ac2', helpText: this.helpText })), h("input", { key: 'eb9862be33313981dccda15889d315893344ff41', type: this.showTime ? 'datetime-local' : 'date', ref: el => (this.dateInput = el), id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: '39efc4cf0cf20cd611c775f1e47ace6b445eab99' }, h("div", { key: '82de246b4d67f3c1a234987c3d9259e8ed7fb3e5', class: "form-group d-flex flex-column" }, h("div", { key: '033c637f965aa750c6130504f70f7fabb9d1a9da', class: "d-flex gap-2" }, h("label", { key: 'ce384aeee225254eac66cfcb6fbe8b6b5677cd5e', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'a8195ae52a1904bcdaa0ee082b77164bb399e5bc', helpText: this.helpText })), h("input", { key: '07bb64ebf4727c892bc5e873d6b8327cb0e89430', type: this.showTime ? 'datetime-local' : 'date', ref: el => (this.dateInput = el), id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled, max: this.maxDate }), h(FormControlErrorText, { key: '01217373b82eee84fae370f504cfee157c6f83ec', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled, max: this.maxDate }), h(FormControlErrorText, { key: '783b7b021819a5c26441a438be7b83dabb4cfce1', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-date"; }
     static get properties() {

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

@@ -12,7 +12,7 @@ export class FileInput {
         this.disabled = undefined;
     }
     render() {
-        return (h(Host, { key: '1d12d202fde10e242d835ad9cf1baf037bf08685', exportparts: "label,input,input-invalid" }, h("div", { key: '3a1d62634eb422bb81d693edc7bf7209095031aa', class: "form-group d-flex flex-column" }, h("div", { key: '19a28fe026bdc3950cceef5985f706bc65a8a036', class: "d-flex align-items-start gap-2" }, h("label", { key: '7ef8d2699382ec129538afea93e7fb99e075755e', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'ac6fa865cb28cae95fb235984c1b8b390ed7a4e8', helpText: this.helpText })), h("input", { key: '46f3596ff86814fc15ee189c5261b74b1a163555', 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, onBlur: () => this.formControlBlur.emit(), onChange: () => this.errorText = "" }), h(FormControlErrorText, { key: 'ad1c1e9b8066cc536530423ecc1ee62a6605590b', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: '4dff12fa7d0cb33919c39db34bbc0957fdd5653f', exportparts: "label,input,input-invalid" }, h("div", { key: 'ae39b30919625c00463cbbd5bf5172a93b7bd9f1', class: "form-group d-flex flex-column" }, h("div", { key: 'f0d20dd0d0c3bed154c220722598dfe41dc4cc45', class: "d-flex align-items-start gap-2" }, h("label", { key: '768f21bee9cf3e87caacd08ebd7506d01550f206', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'ee446659b7b9503678c16f14a49d564ca8caf27a', helpText: this.helpText })), h("input", { key: 'c7eee6e890f87be8a3af204fcdb1cd5d032e5419', 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, onBlur: () => this.formControlBlur.emit(), onChange: () => this.errorText = "" }), h(FormControlErrorText, { key: '5a87d616b1b4be16b32b69d315f07b05d8d060bc', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-file-v2"; }
     static get properties() {

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

@@ -47,10 +47,10 @@ export class FileInput {
         return part;
     }
     render() {
-        return (h(Host, { key: 'b42a36acdd4b1ccbe38d3f990c1ad75dcdca427c' }, h("div", { key: 'b77e933e6ec75850cd4f81136ed6c7b1e9d4eab8', class: "form-group d-flex flex-column" }, h("div", { key: '1d106fa3f984f9339be5d532e9909e802506a070', class: "d-flex align-items-start gap-2" }, h("label", { key: '015b1ec3a10e9e6085a07d82a6f50049b33ca72a', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '7b1920d7910a8cdea94f2264f4525abd6ce12b04', helpText: this.helpText })), h("input", { key: '7fd8b89dc312b0fa773ca3f1286146906dcbcbc9', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: 'ffd39ec9c5c98ba6d51f30fe3f0877807b9218a2' }, h("div", { key: '8d95c947132661088128a20350cb8823eb50aaa1', class: "form-group d-flex flex-column" }, h("div", { key: 'c494f917ca23d99c6dafded70156a62610764223', class: "d-flex align-items-start gap-2" }, h("label", { key: '8a6ba2787312c3a6e1e531bc05e4459aaecb6229', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '5b68e00507d2211fcc481f007c701179eb4bed78', helpText: this.helpText })), h("input", { key: 'd75a0df1951b215b60cee837b102f1b0522cc810', ref: (el) => this.fileInput = el, type: "file", name: this.name, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", multiple: this.multiple, disabled: this.disabled, onChange: this.changeHandler, onInput: this.handleFormControlInput, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            } }), h(FormControlErrorText, { key: '5747821abcfedb2bf33a65907f333ea48478c37a', errorText: this.errorText, name: this.name }))));
+            } }), h(FormControlErrorText, { key: '10231eb3448127011aca32c2e653d7974ab27e2e', 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

@@ -63,10 +63,10 @@ export class MonetaryInput {
         return part;
     }
     render() {
-        return (h(Host, { key: '83294146c6f3ae050163857d50b844539397553a' }, h("div", { key: '07251dfdad902a9a80515b3cc5fd3d66ea623e0c', class: "form-group d-flex flex-column" }, h("label", { key: '96b4419c336b6b75183692f9233759c5f703dc3f', part: label, class: "form-label", htmlFor: this.name }, this.label), h("div", { key: '3f4acb21a8d950365446153df63031698032cbf6', class: "input-group" }, h("span", { key: '9d33e13f2740d2c8326eeae18d77210a32436a44', class: "input-group-text", part: text }, "$"), h("input", { key: '8521bd07c63e502699088e45d41f953b28b5fbbe', ref: el => (this.textInput = el), id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: '8389bbed996b97a2e4c7536a3f31f8b4873651e4' }, h("div", { key: '0cc9d812e034c7017ea49fdb91bcd399ac3112cc', class: "form-group d-flex flex-column" }, h("label", { key: '04bf1b6ab410d6236a8d2ea47364c844a557f3fc', part: label, class: "form-label", htmlFor: this.name }, this.label), h("div", { key: 'bc77863e0a0dc4472c62d98fbca50da4b683b14d', class: "input-group" }, h("span", { key: '28e7f0f65529fab762846711cf681b105546a04d', class: "input-group-text", part: text }, "$"), h("input", { key: 'edfac6a9f10b1914299a6f42497ebb26659717d3', ref: el => (this.textInput = el), id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control monetary is-invalid' : 'form-control monetary', type: "text", disabled: this.disabled })), h(FormControlHelpText, { key: '8158ef70a7e3179433bf0d06b6ab3ac84cc99432', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '2ff89c0f5b9667b7a93f580891f1e314528c5d14', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control monetary is-invalid' : 'form-control monetary', type: "text", disabled: this.disabled })), h(FormControlHelpText, { key: '9c28f25c98432c07678698e53b219d17d3d847a7', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '8cd3f89e1efd87fd0209cb5e6cd525b916de073a', 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

@@ -67,10 +67,10 @@ export class NumberInputMasked {
         return input;
     }
     render() {
-        return (h(Host, { key: 'ce4be8f8dbc45d56729f8dc410782d543d6d36bb' }, h("div", { key: 'f541c120af578d82943b6ad74d0b9c3072b885ff', class: "form-group d-flex flex-column" }, h("div", { key: 'bcb14b211d16aae90f30a9668988dfe9c8828b1d', class: "d-flex align-items-start gap-2" }, h("label", { key: '00e7d4b05a71de70d6b835c6c7bafefbdc9c334e', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'e327c42167cc82a32761759a51f8894f615dc682', helpText: this.helpText })), h("input", { key: 'fe0a584dba22642e87bb7ed60289e33ca9d68a5b', ref: el => (this.textInput = el), id: this.name, name: this.name, onFocus: () => (this.isFocused = true), onBlur: () => {
+        return (h(Host, { key: '33803369123a612e3a59159eca88fa851cc4bdda' }, h("div", { key: '4ec22ee1c45e050bb3c82465620f4195f0ee9f78', class: "form-group d-flex flex-column" }, h("div", { key: '54f8150c131f9e1d591e893ff850014f986ca4ce', class: "d-flex align-items-start gap-2" }, h("label", { key: '10adc8be977ddc13488f86e62d43e15cc27e8061', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'db05a1e10871fcb9cf7bf425963b57a802e8258b', helpText: this.helpText })), h("input", { key: '05e6000baf931e6bd51eb44a149613bdad453080', ref: el => (this.textInput = el), id: this.name, name: this.name, onFocus: () => (this.isFocused = true), onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "text", disabled: this.disabled }), h(FormControlErrorText, { key: 'b0c95b90958073dd5c695dad53618536a1f0ddae', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "text", disabled: this.disabled }), h(FormControlErrorText, { key: '82ec36209485f448694614454cbddfffa1acca9e', 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

@@ -43,10 +43,10 @@ export class NumberInput {
         return input;
     }
     render() {
-        return (h(Host, { key: '7f0a9eb69396c743a326a7c800c1a44758e9021e' }, h("div", { key: 'c6690d26559078214bc996c67d9d7822d8602b40', class: 'form-group d-flex flex-column' }, h("label", { key: 'b7fa671a2f4c16b748c266433ac8b3f0106a667f', part: label, class: "form-label", htmlFor: this.name }, this.label), h("input", { key: '487e6a423ba4f215f0c6937f83623d2c7fade9d2', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: 'bd8c24f0c1209334fde787d8dc7402e75ea1d91b' }, h("div", { key: 'd49ef47d17045ab070005a04a9edc5b11ba1b879', class: 'form-group d-flex flex-column' }, h("label", { key: '49bfca8efbaa753dae1f862f5490ab8943c6a9fd', part: label, class: "form-label", htmlFor: this.name }, this.label), h("input", { key: '3b4ef4300374a4cdd37f85e2155fcc26d357fdca', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "number", disabled: this.disabled }), h(FormControlHelpText, { key: '1013d3b9060dca903372a6a15e340b0e07d011e7', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '4911a0cd712df5789e9ebde0e10e8e0e323f908c', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "number", disabled: this.disabled }), h(FormControlHelpText, { key: '4bdb8dc58c7143ccdbcd50568784b62217459ba9', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '0e5a0df13a356fe03dc389fc4bf6eba9000597fc', 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

@@ -34,10 +34,10 @@ export class RadioInput {
         return inputRadio;
     }
     render() {
-        return (h(Host, { key: 'bfa0d204b4a34281c66a890e74d2cbabdde704b9', class: 'form-group d-flex flex-column' }, h("div", { key: 'f2d9e0158d35806119570996eb33b261e163f66b', class: "form-check" }, h("input", { key: '08de0c12111ed8a20c763c9b1e3b503ee069c6df', ref: el => (this.radioElement = el), type: "radio", id: `${this.name}-${this.value}`, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: '6ac053e94a211ac008c55ae97f3e1b22d76a9557', class: 'form-group d-flex flex-column' }, h("div", { key: 'fe44896b709219947f63d47ea3c8318bd7649bc0', class: "form-check" }, h("input", { key: 'c56759dc4c85da7cbb2e62b6a7eb2648cd42c278', ref: el => (this.radioElement = el), type: "radio", id: `${this.name}-${this.value}`, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onChange: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, value: this.value, checked: this.checked }), h("label", { key: '24fb4d3d6308992b65b0346dff2fd87865b1a244', class: "form-check-label", htmlFor: `${this.name}-${this.value}`, part: label }, this.label)), h("form-control-help-text", { key: 'a70371f57745f7b1929f75610bb8a769bb99a515', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '3860ec0a17a2775905e268739564791925a87fb9', errorText: this.errorText, name: this.name })));
+            }, onChange: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, value: this.value, checked: this.checked }), h("label", { key: '97949ce6465290e528e21575d3fbd4785c3568a7', class: "form-check-label", htmlFor: `${this.name}-${this.value}`, part: label }, this.label)), h("form-control-help-text", { key: 'd521e8eae3d7602f59934373c36dab803fcdefd3', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '2851bc02a7fbb665086e54f2fade679c357d34e6', errorText: this.errorText, name: this.name })));
     }
     static get is() { return "form-control-radio"; }
     static get properties() {