@justifi/webcomponents 5.3.4 → 5.3.5

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: '074b9925b7092b69d4073b86e926bc6e627ba8cd' }, h("div", { key: '195acd38db8ecc931e86e517a5e626ced44ce66f', class: "table-wrapper" }, h("table", { key: '6534aba9b68490de5a7bd03d9760021db02e3f61', class: "table table-hover", part: table }, h("thead", { key: 'bf8dc807e1b31ed1e8040f952b5bfc3cfa77116d', class: "table-head sticky-top" }, h("tr", { key: 'b6828dbb38504d1f410f4c1199ea12d03b66292a', class: "table-light text-nowrap" }, this.terminalsTable.columnData.map((column) => column))), h("tbody", { key: '2080463e7f6ac9995b30e38e52f1650f75983dab', class: "table-body" }, h(TableLoadingState, { key: '36b61e1fb8c23dea61aa3a41b2749f80dbfb34bb', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'c2a11b7e3ebb37538522026854faf3f10e405271', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: 'a40dd753552ee8ad3fae2655a4e890e67a8c14f0', 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: '0af6b6aefe2160a36e773deabed1c6d006d0cde2', class: "sticky-bottom" }, h("tr", { key: '8576eee95c757c41d6b0a6838933e9c123f519d3', class: "table-light align-middle" }, h("td", { key: '87ca55905ecb734ddb059dce080256af6a7f1be1', part: tableCell, colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: '08f29c2415998948e4dc020487fe10215bf10c3d', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) })))))))));
+        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 }) })))))))));
     }
     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: '9e55f56855ebf7f0755c5750bfe4ae57bcc2a48e' }, h("table-filters-menu", { key: 'dae12779f49c3264cb3a5362cc4e4edc2aa6447c', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '9767d61b94a7de6bc290a1dc97e5ecdb7e75beb8', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: 'cab20a5aab288920f205835c4343b44502cc4a1e', class: "p-2" }, h("form-control-text", { key: '58600a426dded8a9efc05e444439c36e3eab5bc8', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: '81f513ae03435ea2c97e43f460aab430ebd4a490', class: "p-2" }, h("form-control-select", { key: 'ee04592e4f117f7b58984932d10081a4383d7a65', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
+        return (h(StyledHost, { key: 'c0dc68ecfc49cbb1ec3297c1ae9b66e4d21fecc5' }, h("table-filters-menu", { key: '74a2627c14a61251052647bc41b6a9d331f04a20', params: filterMenuParams, clearParams: clearParams, part: terminalsListFilterMenu }, h("div", { key: '0aa6684df6548ffc721507ba11d8494a7ac56d46', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '6cb0918e840d7651e41b11c262cae4c6932c32ef', class: "p-2" }, h("form-control-text", { key: 'b5b134f5c243596b1232404b8f341bd46f69ae40', name: "terminal_id", label: "Terminal ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.terminalId || filterParams.terminal_id, disabled: !!this.terminalId, part: terminalIdTerminalsListFilterParam })), h("div", { key: '8d88708e80c08fcfa9fb204afa1b0aade761d440', class: "p-2" }, h("form-control-select", { key: 'cfd6300240fd31d6e826f9f0662cdabf5b950497', name: "status", label: "Status", options: this.terminalStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.terminalStatus || filterParams.status, disabled: !!this.terminalStatus, part: terminalStatusTerminalsListFilterParam }))))));
     }
     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: '1534781e6264057b7c780e6b44f4a7a66a561296' }, h("terminals-list-core", { key: '8c0fb664d5ebe4fedcf6e45046e931adffb9d381', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (h(StyledHost, { key: '8829e2070592554b23ea8593c2528a6582374b1e' }, h("terminals-list-core", { key: '7dfa54f94366214f53fae5240050955a5f5750f4', getTerminals: this.getTerminals, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get is() { return "justifi-terminals-list"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,15 +1,17 @@
 import { h } from "@stencil/core";
 import { MapTerminalStatusToBadge } from "./terminals-status";
 import { getAlternateTableCellPart, tableHeadCell } from "../../styles/parts";
-export const defaultColumnsKeys = 'nickname,provider_id,status';
+export const defaultColumnsKeys = 'nickname,provider_serial_number,status';
 export const terminalTableColumns = {
     nickname: () => (h("th", { part: tableHeadCell, scope: "col", title: "The nickname associated with the terminal" }, "Nickname")),
-    provider_id: () => (h("th", { part: tableHeadCell, scope: "col", title: "The serial number / provider ID of the terminal" }, "Serial Number")),
+    provider_serial_number: () => (h("th", { part: tableHeadCell, scope: "col", title: "The serial number of the terminal" }, "Serial Number")),
+    provider_id: () => (h("th", { part: tableHeadCell, scope: "col", title: "The provider ID of the terminal" }, "Provider ID")),
     sub_account_name: () => (h("th", { part: tableHeadCell, scope: "col", title: "The sub account associated with the terminal" }, "Sub Account")),
     status: () => (h("th", { part: tableHeadCell, scope: "col", title: "The current status of each terminal" }, "Status")),
 };
 export const terminalTableCells = {
     nickname: (terminal, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminal.nickname)),
+    provider_serial_number: (terminal, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminal.provider_serial_number)),
     provider_id: (terminal, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminal.provider_id)),
     sub_account_name: (terminal, index) => (h("td", { part: getAlternateTableCellPart(index) }, terminal.sub_account_name)),
     status: (terminal, index) => (h("td", { part: getAlternateTableCellPart(index) }, MapTerminalStatusToBadge(terminal.status))),

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: 'ac989aa84f6262ff1b72a88fc7c4ebb0e62175dc' }, h("form", { key: '482ebf3ca3ac67738fdd0243de8d29ad66754313' }, h("fieldset", { key: 'e563783b34d570bafd1788949a486454ce70ab4a' }, h("div", { key: 'a42f5625f5d0860153f4260aa9c5f76f4afcad06', class: "row gy-3" }, h("div", { key: 'f64bb331c9922be711bfdd9a50d76530773867c0', class: "col-12" }, h("justifi-payment-method-options", { key: 'dc23821a9130ee6435c92e20574a0bf056e1c29c', ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": false, paymentMethodGroupId: this.paymentMethodGroupId, "show-saved-payment-methods": false, hideCardBillingForm: this.hideCardBillingForm, authToken: this.authToken, "account-id": this.accountId, iframeOrigin: this.iframeOrigin })), h("div", { key: '29ec96487c4a5d54c4883c4cfe4a6ee4a309042f', class: "col-12" }, h(Button, { key: 'fe116e392e79debf6a858c993ba11a21d417d998', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.hideSubmitButton }, this.submitButtonText || 'Submit')))))));
+        return (h(StyledHost, { key: '8377b1e614cb8c1f737ce7f81b35017c7bf4b390' }, h("form", { key: 'a30d047312977dec17fc810dd7039d64a71396d0' }, h("fieldset", { key: 'ffda409f721f09fef1397cef899b49c2f70d51e3' }, h("div", { key: 'cbaa2c97e2be236df2f2e7e3a1df0eca0b20f75a', class: "row gy-3" }, h("div", { key: 'cc9bac328a0feaf2c1754c50e9790eb1dbd04768', class: "col-12" }, h("justifi-payment-method-options", { key: 'bc646adf579be124bc110aa04256bcafe419ca3b', ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": false, paymentMethodGroupId: this.paymentMethodGroupId, "show-saved-payment-methods": false, hideCardBillingForm: this.hideCardBillingForm, authToken: this.authToken, "account-id": this.accountId, iframeOrigin: this.iframeOrigin })), h("div", { key: 'e65e8a79fd265a053e46e9ee215f84abb57e1212', class: "col-12" }, h(Button, { key: 'f568dc1cb0c6ca2f22897b3ad94f37383ac8ac26', variant: "primary", type: "submit", onClick: event => this.tokenizePaymentMethod(event), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.hideSubmitButton }, this.submitButtonText || 'Submit')))))));
     }
     static get is() { return "justifi-tokenize-payment-method"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/styles/parts.js

@@ -14,6 +14,7 @@ export const heading2 = `heading-2 ${heading}`;
 export const heading3 = `heading-3 ${heading}`;
 export const heading4 = `heading-4 ${heading}`;
 export const heading5 = `heading-5 ${heading}`;
+export const link = `link ${text}`;
 // Button
 export const button = `button ${text}`;
 export const buttonPrimary = `button-primary ${button}`;
@@ -79,6 +80,8 @@ export const listGroup = `list-group ${text} ${backgroundColor}`;
 export const listGroupItem = `list-group-item ${text} ${backgroundColor}`;
 // Skeleton
 export const skeleton = `skeleton`;
+// Image
+export const image = `image`;
 // Component specific
 // This allows specific sections of a component to be hidden, for example
 // ::part(billing-form) { display: none; }

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: '1b95226961006ba80bb96911078f7cde90f32def' }, h("style", { key: '3b20790da8600b3835e5874acab8cd49a741dbfa' }, `
+        return (h("div", { key: '1ea99d6aaa69619c4c1120c1f2fc4e0fcc1cc802' }, h("style", { key: 'b8a785d6c4dc1de3459aa84e8fecc2170c1c52cf' }, `
           .popper-content {
             display: none;
           }
@@ -89,7 +89,7 @@ export class CustomPopper {
             display: block;
             z-index: 1030;
           }
-          `), h("div", { key: '05d166976a3aa254c1d0722c272bd9b0adc24862', class: "popper-content", ref: (el) => this.popperContentRef = el }, h("slot", { key: '95d3a563a9d7a1598ec35c8042a9a1088070a4bc' }))));
+          `), h("div", { key: 'fbd29d61602df70db874c80749397b40426f967a', class: "popper-content", ref: (el) => this.popperContentRef = el }, h("slot", { key: 'a75954430d14e1eb0a070650495a2c8e87bbb31d' }))));
     }
     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: '8161ae3e7ce79824b21b97647b403646dd7d2db8' }, h("div", { key: 'e1aae62dd392cf208c342d727182a4b98dcabbbc', class: 'form-group d-flex flex-column' }, h("div", { key: '582178c2b18f6d535f692d2b1f16e71555bb6f2e', class: "form-check" }, h("input", { key: '531a98078cee60acc5c8838a3ea7ea43c84fe846', ref: el => (this.checkboxElement = el), type: "checkbox", id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        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: () => {
                 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: '8a12404a24a3b1c4cbec230444436c80faeba2d8', class: "form-check-label", htmlFor: this.name, part: label }, this.label)), h(FormControlHelpText, { key: '8cda3874473523f86dadc9e1e3dfb3e4448f3a6f', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '951395dc28c0af8d35aa8c8f38011204a82eb008', 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: '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 }))));
     }
     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: 'c1add6b2191a1b3263c12bcbf5d0be368df38dab' }, h("div", { key: '34be414bc3a4499a8fef8de45855ecc1e00edcd4', class: "form-group d-flex flex-column" }, h("div", { key: 'f5198a9aabd0e12c0f1597ac357a433a84ce56a6', class: "d-flex gap-2" }, h("label", { key: '084a1eb6ddfd7b728e0c5402c995b1f561e9cc7d', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '0328133482e9cc0f3082aa41c143fd21e95ee8ee', helpText: this.helpText })), h("input", { key: '59cbf8ccd7d2a08f38f07c73b1b457eb109d1571', 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: '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: () => {
                 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: 'd71b3de2d560c4a44a3a00a7e5f28d9bfc5843b1', 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: '01217373b82eee84fae370f504cfee157c6f83ec', 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

@@ -1,4 +1,5 @@
 import { Host, h, } from "@stencil/core";
+import { FormControlErrorText } from "./form-helpers/form-control-error-text";
 export class FileInput {
     constructor() {
         this.files = undefined;
@@ -11,7 +12,7 @@ export class FileInput {
         this.disabled = undefined;
     }
     render() {
-        return (h(Host, { key: '68bfcee3ae8e8baa627c2e03731de655f7a29ef5', exportparts: "label,input,input-invalid" }, h("div", { key: 'a63ff9900d7612d933e35a0fd95335e8abc45ea7', class: "form-group d-flex flex-column" }, h("div", { key: '74124ffdbf2ac3c28299a78469f387c494140db5', class: "d-flex align-items-start gap-2" }, h("label", { key: 'ec6c237392b1b520a5aab9c6f6a9cb328613e663', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '60f734ebac8d88e2e2775deb0433e2dfe3002402', helpText: this.helpText })), h("input", { key: '2859f4d46dcd5a666017fdb6ae0f10a266bdea4a', 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() }), h("form-control-error-text", { key: 'c667c4882412d5d43b60beae55e3ebab2c43f07d', errorText: this.errorText, name: this.name }))));
+        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 }))));
     }
     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: '09e633d625a1f8f2233d80e8b999fcd7e4a16f62' }, h("div", { key: 'b788fd0963c0ab62d0f7e236fb47ea86430b522e', class: "form-group d-flex flex-column" }, h("div", { key: '1e7a11e13ec3c386c9f30b5cd38c3afa99c88da5', class: "d-flex align-items-start gap-2" }, h("label", { key: '45cd0d97ae44c32b4d1e0d87187ac1871511c319', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: 'd312e4f181dfb18c0b86048960ec0a333760f290', helpText: this.helpText })), h("input", { key: '73ff59959c75dc99cccddde819ebbeb6bc1de4ab', 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: '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: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            } }), h(FormControlErrorText, { key: 'cb9c8bd4f623ebd82bdbd9725805f6038b0e1f8c', errorText: this.errorText, name: this.name }))));
+            } }), h(FormControlErrorText, { key: '5747821abcfedb2bf33a65907f333ea48478c37a', 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: 'c7a92629b644f797bc0c199b66f2b3a7802e24af' }, h("div", { key: 'b21ec4bd76d52d6ebe23de04748b344529bd5e91', class: "form-group d-flex flex-column" }, h("label", { key: 'c1a4d2c44d19a81ea594c36c8ce537956e32f8be', part: label, class: "form-label", htmlFor: this.name }, this.label), h("div", { key: '3c7858f3b1bff3d304e2d6ef4613570307abb031', class: "input-group" }, h("span", { key: '57f667463d22682820a688ff4583429203d35c88', class: "input-group-text", part: text }, "$"), h("input", { key: '8027bd97c1e8974089b9438972e449c9fe00e984', ref: el => (this.textInput = el), id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        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: () => {
                 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: '2b983d18e5544d78015ce9d9f15ac0fba9991193', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '1cbf33304b3243fed47f2d6cc5459010d9502347', 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: '8158ef70a7e3179433bf0d06b6ab3ac84cc99432', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '2ff89c0f5b9667b7a93f580891f1e314528c5d14', 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: '84b2b9707b77df0865ca506c3c974f9974f698e3' }, h("div", { key: '6817ba99efccf056fa28535db39a672cdb18bc0a', class: "form-group d-flex flex-column" }, h("div", { key: '2f0f64dc35352659740292397f82f6490f32b6ee', class: "d-flex align-items-start gap-2" }, h("label", { key: 'f5eff8109b6403b2cdc53e6c0a23538ef3dcb817', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '633b66f6d99fea7688652fa6e5f11e0d68666f69', helpText: this.helpText })), h("input", { key: '3df0af7941cb957ddf3df89f3216a2d3187e1e9d', ref: el => (this.textInput = el), id: this.name, name: this.name, onFocus: () => (this.isFocused = true), onBlur: () => {
+        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: () => {
                 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: '9d634135126b399aea1071fd5cc53784728b01c1', 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: 'b0c95b90958073dd5c695dad53618536a1f0ddae', 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: '8c60e7494ce6878f591699baa07e5a5d562090b4' }, h("div", { key: '49c2ebe33aa6317c5960ab8a1cc1d8998e06ff9e', class: 'form-group d-flex flex-column' }, h("label", { key: '9132628d047ad3c2b243e87b013b77f367aef274', part: label, class: "form-label", htmlFor: this.name }, this.label), h("input", { key: '25d4df4f8bc7eafde56f8b6aaf77eac3acd78035', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        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: () => {
                 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: '47d213b459ddfb9d9704d217f82e0d30d3166465', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '4835e71589d825d56d36ef99b00fdd877690a04d', 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: '1013d3b9060dca903372a6a15e340b0e07d011e7', helpText: this.helpText, name: this.name }), h(FormControlErrorText, { key: '4911a0cd712df5789e9ebde0e10e8e0e323f908c', 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: 'dd02a226957e079505a8149565e42883eb0c63e8', class: 'form-group d-flex flex-column' }, h("div", { key: '8951df4569607dc68808b57423566dd1d60caa0c', class: "form-check" }, h("input", { key: '7b2e93768b210191dbb3aa9cf81e2520ffaac5ff', ref: el => (this.radioElement = el), type: "radio", id: `${this.name}-${this.value}`, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        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: () => {
                 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: 'fd413c400f607c07d704cfe56d7e304082027d5c', class: "form-check-label", htmlFor: `${this.name}-${this.value}`, part: label }, this.label)), h("form-control-help-text", { key: '4e7cc2ac52d39092be5e46f1a2df1a7d31f380eb', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '420052233ae56f98712559707a4372644f915aec', 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: '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 })));
     }
     static get is() { return "form-control-radio"; }
     static get properties() {

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

@@ -45,10 +45,10 @@ export class TextInput {
         return input;
     }
     render() {
-        return (h(Host, { key: 'd84e000c15b64815eb0f8eb2e1e1f774fd786956' }, h("div", { key: 'fc751f6b2da9d20bee791e854a2bb7d3f9ce7456', class: "form-group d-flex flex-column" }, h("div", { key: '6853a85e1dced30edb8b84070d7dc16b65e47ce6', class: "d-flex align-items-start gap-2" }, h("label", { key: '5c020f8419308ceac4c00220ce9df8fac8ce1f0f', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '81662d978c47c8d3e10342cb2b2a005af4ecf608', helpText: this.helpText })), h("input", { key: '14fd9610e3a92e0b6125ab41a5878268a7cc3157', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: '5fd5420403a86c3a3cd1051bc195ce2aad1efce1' }, h("div", { key: 'd145ef0c3ef1ac6e5d5bce4faf6dd19a6e96b34a', class: "form-group d-flex flex-column" }, h("div", { key: 'a4f8efe5b6d8862388ac3a564ebe7522e3b5643a', class: "d-flex align-items-start gap-2" }, h("label", { key: '3e3d0f3d8ba2e32e9b18002e5884ccadd2ca8194', part: label, class: "form-label", htmlFor: this.name }, this.label), h("form-control-tooltip", { key: '199ddd92c25bfa7ac6cde94bfe40087645ee3370', helpText: this.helpText })), h("input", { key: 'f960d4968f7c71b7eaa69610b16462ee84e62b91', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", type: "text", disabled: this.disabled }), h(FormControlErrorText, { key: 'be05bd72e34afa9c8b4dd42cb5eda4fb6407224d', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", type: "text", disabled: this.disabled }), h(FormControlErrorText, { key: '9eda3817d987fac142a584d95b6242950658eb5f', 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

@@ -47,10 +47,10 @@ export class TextInput {
         return input;
     }
     render() {
-        return (h(Host, { key: 'beabdb77220c0ad180cf1e0143521ce03fea1eb5' }, h("div", { key: '16e2375d19c75d34c7f1ad1eb1a3a5920fa4ba08', class: "form-group d-flex flex-column" }, h("label", { key: 'dbe6e6816c5b500363964c771654d772bb25de62', part: label, class: "form-label", htmlFor: this.name }, this.label), h("textarea", { key: 'b7c5f64138c846756051bd4984152ad382f24dba', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (h(Host, { key: 'bd2917d7d1b655c1c901a3a3de5d7184fedb1c3d' }, h("div", { key: '87e1651c5cc4ad9d88bcfc29278d797e30e285e0', class: "form-group d-flex flex-column" }, h("label", { key: 'ea65895b454b1f92550100849354ee0a63493501', part: label, class: "form-label", htmlFor: this.name }, this.label), h("textarea", { key: 'f069eee75bbebc663e18648c441969e4c0893b61', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled }), h("form-control-help-text", { key: '65ef4b15eda7ac206e935aa13b8ed30000af23d8', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '3fa530e3c915efdb63776a0146356873cf8e1e6a', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled }), h("form-control-help-text", { key: '804bc50bd1fa9763a23ccff43c7afb0485a0ef4c', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '42b936fd91f1b7b2d0fea7e08b393e28bd83d07c', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-textarea"; }
     static get properties() {

package/dist/collection/ui-components/form/hidden-input.js

@@ -73,7 +73,7 @@ export class HiddenInput {
         return input;
     }
     render() {
-        return (h(Host, { key: '7bfd14ae6eb04d3bccb6f95398213655bc5c1073' }, h("input", { key: 'a40b6c6b2fd4e217af572f2032b158cc0ad603d2', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
+        return (h(Host, { key: '68a2c54e46bbac93bee4a47e94d73d88104fb22b' }, h("input", { key: 'b558c0fe75e6c6cdd394a74e7abb4d6da8e7f4e9', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
     }
     static get is() { return "hidden-input"; }
     static get states() {

package/dist/collection/ui-components/form/iframe-input.js

@@ -81,10 +81,10 @@ export class IframeInput {
         return params;
     }
     render() {
-        return (h(Host, { key: '871d71c6240e94e24f7ccc4c4ec8225b4123d865', class: "form-group d-flex flex-column" }, h("div", { key: '0a1d98cba0960599d29db3c269bb8b458cdfddc8', style: {
+        return (h(Host, { key: '8bd5db2440fd1b9fac9cc543351dc131b275848f', class: "form-group d-flex flex-column" }, h("div", { key: '5cb9d0b36e11eecaa83aaece84cbfa6255adc5ec', style: {
                 visibility: this.iframeLoaded ? 'visible' : 'hidden',
                 height: this.iframeLoaded ? 'auto' : '0',
-            } }, h("label", { key: 'bfd2e61b544db648cada7a52b45809bebf5722a8', class: "form-label", htmlFor: "", part: label }, this.label || ''), h("div", { key: '53e9f9a29e07edcdcbb00b023ba0f24d09d852ab', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, h("iframe", { key: '2adc709c4094c44181dd83906763b4809b3f168b', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
+            } }, h("label", { key: '4bbf84b5246bae6b6951e7148b75cd5aea31f085', class: "form-label", htmlFor: "", part: label }, this.label || ''), h("div", { key: 'b9322c63b4d85cb7622bba2d2f2c5860d7ecc11a', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, h("iframe", { key: 'fdec589df0be0aab897c06f97b028791d9311ff7', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
                 this.iframeElement = el;
                 this.initializeFrameCommunicationService();
             }, width: "100%", onLoad: () => {
@@ -94,7 +94,7 @@ export class IframeInput {
                         this.iframeLoaded.emit();
                     }
                 }, this.iframeElement);
-            } })), h(FormControlErrorText, { key: 'c54bafd097b1e3e896901252d3520bfdfe5c71b6', errorText: this.errorText, name: this.inputId }))));
+            } })), h(FormControlErrorText, { key: '86d9464628d833e2526b50648eb87abeec20b24d', errorText: this.errorText, name: this.inputId }))));
     }
     static get is() { return "iframe-input"; }
     static get properties() {