genesys-spark-components 4.37.0 → 4.39.0

package/dist/esm/gux-form-field-input-clear-button.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-da21b737.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import { b as buildI18nForComponent } from './index-3f1e5ba8.js';
 import './get-closest-element-728b9f18.js';
 
@@ -20,7 +20,7 @@ const GuxFormFieldInputClearButton = class {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("button", { key: '420614ad57cbadacbbaf437ee524b7ea927a5dff', tabIndex: -1, type: "button", title: this.i18n('clear') }, h("gux-icon", { key: '56655b44bbfea2fcbbee5759f9639b4988e0555a', "icon-name": "close", decorative: true })));
+        return (h("button", { key: 'f1ab8c5efbad04d34dffeb79d653e4fd7cb8b7c7', tabIndex: -1, type: "button", title: this.i18n('clear') }, h("gux-icon", { key: '147a375dd9cefa4660dd60f518e6a582533006d1', "icon-name": "fa/xmark-large-regular", decorative: true })));
     }
     static get delegatesFocus() { return true; }
     get root() { return getElement(this); }

package/dist/esm/gux-form-field-number_3.entry.js

@@ -4,11 +4,11 @@ import { c as calculateInputDisabledState, o as onInputDisabledStateChange } fro
 import { O as OnMutation } from './on-mutation-1355c534.js';
 import { o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { p as preventBrowserValidationStyling } from './prevent-browser-validation-styling-3983eb0a.js';
-import { h as hasContent, d as clearInput, G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition, e as setInputValue } from './gux-form-field.service-f168cdd4.js';
+import { h as hasContent, d as clearInput, G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition, e as setInputValue } from './gux-form-field.service-2bda6421.js';
 import { s as simulateNativeEvent } from './simulate-native-event-e0631897.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { G as GuxFormFieldLabel, a as GuxFormFieldContainer } from './gux-form-field-container-777ec473.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import { t as translationResources } from './en-25a315a0.js';
 import { O as OnClickOutside } from './on-click-outside-6d6f4463.js';
 import { b as afterNextRender } from './after-next-render-07a41f53.js';
@@ -80,14 +80,14 @@ const GuxFormFieldNumber = class {
     }
     render() {
         const showClearButton = this.clearable && this.hasContent && !this.disabled;
-        return (h(GuxFormFieldContainer, { key: '3bccd8043ddb250e8f40637b494e34debd73b817', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'ba636b58278fb46edc3bc3c77bdef9717acf9b70', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'bb0facdeb8535a40d130bc4021108a375dafd035', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '0c087b09a172d1d185df038fa909b9419c04293f', class: "gux-input-and-error-container" }, h("div", { key: 'cf2a88b8c77b4388605674177020e8b84223eedc', class: {
+        return (h(GuxFormFieldContainer, { key: 'feeabc781adfb0fd9030d8a76743c31ea64e8d76', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '4400af252249fa580fb4ca395eed8806153e3ff5', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '8864aefbdc97e8906242b3fdeb0a2ba3fc705245', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '966b4a919efeca4e4c085326967ba3bf4a3588cc', class: "gux-input-and-error-container" }, h("div", { key: '4c92937f061f678cff9af4719d8cb958e35a3c5e', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            }, part: "input-section" }, h("div", { key: '268b1a328008ba368837a6218afa1f19966c8559', class: {
+            }, part: "input-section" }, h("div", { key: '19e2f5e9856d4bdfde619f95c6c27e7ee87f6a18', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-clear': showClearButton
-            } }, h("slot", { key: 'fb1d0b95d53bf0c3b7e3e2b5fde9b629c21bf135', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: '1fea1070b52acea88b61beef1b99d9a5f5787732', show: this.hasError }, h("slot", { key: 'cff95a06005b48601b1a0c6b2ee6a21b4338ad16', name: "error" })), h(GuxFormFieldHelp, { key: 'b40563bd805a4ffea95008218b23d31d5de8525f', show: !this.hasError && this.hasHelp }, h("slot", { key: 'de4a7c55dc4e6af39bda4392e9bdcc86bdb47582', name: "help" })))));
+            } }, h("slot", { key: 'cce60afdfecda90b88e29117738e65d7398fd6fb', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: 'd8418fafe5ab22e81e0b4faf2dad671309cded81', show: this.hasError }, h("slot", { key: 'bf7081e104af51fdba6f6ddfdd23b92812e41d4e', name: "error" })), h(GuxFormFieldHelp, { key: '9ceadb455f53579b0761cfc6fe6fd438831b4422', show: !this.hasError && this.hasHelp }, h("slot", { key: '193219e3f90c7957b6edaad735b6e7d5e0a9c939', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition
@@ -118,7 +118,7 @@ const GuxFormFieldNumber = class {
         this.computedLabelPosition = getComputedLabelPosition(this.label, this.labelPosition);
     }
     renderStepButtons(input, getI18nValue, disabled) {
-        return (h("div", { class: "gux-step-buttons-container" }, h("button", { class: "gux-step-button", tabIndex: -1, type: "button", title: getI18nValue('increment'), disabled: disabled, onClick: () => this.stepUp(input) }, h("gux-icon", { "icon-name": "chevron-small-up", decorative: true })), h("button", { class: "gux-step-button", tabIndex: -1, type: "button", title: getI18nValue('decrement'), disabled: disabled, onClick: () => this.stepDown(input) }, h("gux-icon", { "icon-name": "chevron-small-down", decorative: true }))));
+        return (h("div", { class: "gux-step-buttons-container" }, h("button", { class: "gux-step-button", tabIndex: -1, type: "button", title: getI18nValue('increment'), disabled: disabled, onClick: () => this.stepUp(input) }, h("gux-icon", { "icon-name": "custom/chevron-up-small-regular", decorative: true })), h("button", { class: "gux-step-button", tabIndex: -1, type: "button", title: getI18nValue('decrement'), disabled: disabled, onClick: () => this.stepDown(input) }, h("gux-icon", { "icon-name": "custom/chevron-down-small-regular", decorative: true }))));
     }
     stepDown(input) {
         if (input.value === '') {
@@ -235,7 +235,7 @@ const GuxPaginationEllipsisButton = class {
         this.applyInputListener();
     }
     render() {
-        return (h(Host, { key: '27f46ece4cba80658d3e8016f0b84f6c64e4b089' }, h("button", { key: '4bb71628d7af04c803cbaadcfc8e094ec3859545', id: "popover-target", type: "button", ref: el => (this.ellipsisButton = el), onClick: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString() }, h("gux-icon", { key: 'df8660dafad9ec7fa9c07ea29641fc95eff77490', screenreaderText: this.i18n('goToPage'), "icon-name": "menu-kebab-horizontal" })), h("gux-tooltip", { key: '9720ab867db23b99b310dd4a7b405516e737c6cd', for: "popover-target" }, this.i18n('goToPage')), h("gux-popover", { key: '03cbfc67816a2304fa5d77fdf8b507b85b2f0a86', "is-open": this.isOpen, for: "popover-target" }, h("span", { key: 'c4bea0e355cbb77f1681e535db90855fde06355d', slot: "title" }, this.i18n('goToPage')), h("gux-form-field-number", { key: '88aa6e5a294a563d8f1b4e43d21c74ee753cd1e8' }, h("input", { key: '7ae93a73e7a2b6ed6911a87a168d0a511740d764', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1" }), h("label", { key: '6d5d5b9a81051d81715e2df2157ff0e4f2fe4af7', slot: "label" })))));
+        return (h(Host, { key: '64365018abf52c12f0d4387bae37810817ef7b63' }, h("button", { key: '03589e513824d66ce659f51c27d552e4cf38f413', id: "popover-target", type: "button", ref: el => (this.ellipsisButton = el), onClick: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString() }, h("gux-icon", { key: '590249cb9dd76a7796ec3d5606d3e7ddb891d9e0', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), h("gux-tooltip", { key: '0e5e7afd0875094e41a56f554e364cfcdf534d3a', for: "popover-target" }, this.i18n('goToPage')), h("gux-popover", { key: 'beeb311cddf084f794a6466c5ee66bb6b2c2fff9', "is-open": this.isOpen, for: "popover-target" }, h("span", { key: 'e0635c5049e0c692651f8a5c9ae154ec9289fb1e', slot: "title" }, this.i18n('goToPage')), h("gux-form-field-number", { key: 'ebad1d2403427a9fff7d1043cd6efb4b8f39d2d7' }, h("input", { key: 'f245eeeb4731f22ec75f5fd6cfcb0fe28caee6a5', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1" }), h("label", { key: 'a43f4ab01b99eb78dc37e5a63de746a5fddaa6b0', slot: "label" })))));
     }
     get root() { return getElement(this); }
 };
@@ -376,10 +376,10 @@ const GuxPopover = class {
         }
     }
     render() {
-        return (h("div", { key: '8f5b7cfebe4481fa8248473d20433f9f56a0ad13', ref: (el) => (this.popupElement = el), class: {
+        return (h("div", { key: '0472388d213b2e02b168dcfe768a85d701b9bcca', ref: (el) => (this.popupElement = el), class: {
                 'gux-hidden': !this.isOpen,
                 'gux-popover-wrapper': true
-            }, "data-placement": true }, h("div", { key: '3baf7a504892aef49c78f4c9c227341554b2037e', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), h("div", { key: '3369119d45bc4330e70abe72b917ea90afc7e275', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, h("slot", { key: '7b7c1a2aa2126a8118be1d829152ec2b8443b544', name: "title" }), this.renderDismissButton()), h("div", { key: '99bb19c0b2c20bcdc11fd93e870e8b4b036b7933', class: "gux-popover-content" }, h("slot", { key: 'd2b6ba0dc948e0faaac740a9ac71410516b6a30a' }))));
+            }, "data-placement": true }, h("div", { key: '9d611f0597e5b9d3e2f9905c0500523bd254a787', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), h("div", { key: 'c4b6a5009d0fe2bef624e548d848b7223e68074f', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, h("slot", { key: '8f0a7b4f16fc486a21356b1a0cde0953f94b179f', name: "title" }), this.renderDismissButton()), h("div", { key: '1bf90ca550d931333343748fa81070b93f85d121', class: "gux-popover-content" }, h("slot", { key: '56baa68d711439b9425edd31d712ab0b74d74d90' }))));
     }
     get root() { return getElement(this); }
 };

package/dist/esm/gux-form-field-phone.entry.js

@@ -2,9 +2,9 @@ import { r as registerInstance, h, g as getElement } from './index-da21b737.js';
 import { b as buildI18nForComponent } from './index-3f1e5ba8.js';
 import { O as OnMutation } from './on-mutation-1355c534.js';
 import { a as onDisabledChange, o as onRequiredChange } from './on-attribute-change-f42eabee.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import { G as GuxFormFieldLegendLabel, a as GuxFormFieldFieldsetContainer } from './gux-form-field-fieldset-container-9b9fee2f.js';
-import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { g as getSlotTextContent } from './get-slot-text-content-95a85429.js';
 import './get-closest-element-728b9f18.js';
@@ -64,13 +64,13 @@ const GuxFormFieldPhone = class {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '261d989ea3e277ea0ce02e3d5c07f06fa6d235c6', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '561899806b6c42b323a25c253dd5bd72d451b0ca', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '0bbc046f8c5138245ca9693eb724ee77940f5f76', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '43f446b7a0f71333ada0241057a6cbe3ef57d8da', class: "gux-input-and-error-container" }, h("div", { key: 'b156b31b2e3e7c841ab2ee0dab8acef48cba7056', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '2af846c9e82251c8bc2ddeb13459eb2500701014', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: 'e4bee930190d0e53fda032af3c7f045abdb998df', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: 'b54d6f71f2c52383705814413dd523ab6789baa1', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '145ef25318f4d328218cc96f150b649755040ac1', class: "gux-input-and-error-container" }, h("div", { key: '03883064b641906109b00555ae6ca388f3e1b749', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'd772c1b9c36b2c6c9ee57f7e21fd7480fa8e8fa5', class: {
+            } }, h("div", { key: 'cedc8d5d6541125f5570350a19cecf4a74866805', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '1329083c024cb7d3da47b7e4ce65690ae14ed1a2' }))), h(GuxFormFieldError, { key: '2895dd8068e25c349b4be32c68eacf50083e8676', show: this.hasError }, h("slot", { key: 'b57c7d04b0b8b5de60594076ab18c6483afa8d89', name: "error" })), h(GuxFormFieldHelp, { key: '15207e0903bf700bd38af101efb8590aec04ca26', show: !this.hasError && this.hasHelp }, h("slot", { key: '24e33a6cd89d656cb07e7352bc4c3776e8698427', name: "help" })))));
+            } }, h("slot", { key: '8dfedd2efaec8bb1a69d96496c157fc2e54dae87' }))), h(GuxFormFieldError, { key: '8d4aa24ff49eb9ff3861fb6eb7ed61f412a2f243', show: this.hasError }, h("slot", { key: 'ac9de25b22dee2e4a4e5411229eb9cf3691ed4b9', name: "error" })), h(GuxFormFieldHelp, { key: '55fdc67eadd5922082a91b8ac5bf9e878e90c1dc', show: !this.hasError && this.hasHelp }, h("slot", { key: '9fc216565e0fa779819df4048d37bb82b85a184e', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

package/dist/esm/gux-form-field-radio.entry.js

@@ -3,8 +3,8 @@ import { c as calculateInputDisabledState, o as onInputDisabledStateChange } fro
 import { O as OnMutation } from './on-mutation-1355c534.js';
 import { p as preventBrowserValidationStyling } from './prevent-browser-validation-styling-3983eb0a.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
-import { G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds } from './gux-form-field.service-f168cdd4.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds } from './gux-form-field.service-2bda6421.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
 import './simulate-native-event-e0631897.js';
@@ -45,10 +45,10 @@ const GuxFormFieldRadio = class {
         }
     }
     render() {
-        return (h(Host, { key: '68383e72cc5da3051fc5c2899b4e4de83cd23c81', class: {
+        return (h(Host, { key: 'a732953664a7d3bb4aad3819f3bc91cfb542959c', class: {
                 'gux-input-error': this.hasError,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: 'ca9728d2abd9149e46d3646adc4de5e3f19906ea', class: "gux-form-field-container" }, h("div", { key: '2d6da742d4ad2ee25dc117c91467c2f7452a55f0', class: "gux-input-label" }, h("div", { key: 'edefc46b964301b4224581c251dcad6144239e86', class: "gux-input" }, h("slot", { key: 'ee2f1d59abc6f2793f9bcd8ec72495394a5d4a9d', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: 'ed147a50716367b568ddc3e9fee6e81c039ced20', class: "gux-label", "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: '6f549790fb11fd3d4731af5615e75c2172246636', name: "label" }), h(GuxFormFieldError, { key: 'adccfeedc43e0acd66e244abf7d0d3b149252a4b', show: this.hasError }, h("slot", { key: '5caebf1e236552a4cbfebb999c269f2c9badedc0', name: "error" })), h(GuxFormFieldHelp, { key: 'ce9e88771bc9b84fec6532aec5a94d3ef86c356e', show: !this.hasError && this.hasHelp }, h("slot", { key: 'f1734cd1b6b9f7568ee5268830b0a263d492050f', name: "help" })))))));
+            } }, h("div", { key: '2734679d96c190c3d53ace05ce19d025277ff8a3', class: "gux-form-field-container" }, h("div", { key: 'd6f3ddb7f1fe6601e2f93b29f3dadc69be3dda43', class: "gux-input-label" }, h("div", { key: '7c507fb6844488bd65b533e6ccd9bfa166f334ca', class: "gux-input" }, h("slot", { key: 'b0aec1017ca6e16f138e5667aa05991908412f8a', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '5620a9cdbbc45e00ce60daa20eee7b308ba985eb', class: "gux-label", "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: 'fba3a170eb34e062c3823f196f326c4f4dfd8402', name: "label" }), h(GuxFormFieldError, { key: 'c5678610e687d55427a48bb0504eacc29d7455a6', show: this.hasError }, h("slot", { key: '1d343ea04a274d7c588f713716d12b726cc6fce5', name: "error" })), h(GuxFormFieldHelp, { key: 'a3ea40aa2b1718916adf306b2d473ddb54a48d9e', show: !this.hasError && this.hasHelp }, h("slot", { key: '98d2ffbabbac698bf210adb75193a0a191072780', name: "help" })))))));
     }
     setInput() {
         this.input = getSlottedInput(this.root, 'input[type="radio"][slot="input"]');

package/dist/esm/gux-form-field-range.entry.js

@@ -4,9 +4,9 @@ import { O as OnMutation } from './on-mutation-1355c534.js';
 import { o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { p as preventBrowserValidationStyling } from './prevent-browser-validation-styling-3983eb0a.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
-import { G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { a as GuxFormFieldContainer, G as GuxFormFieldLabel } from './gux-form-field-container-777ec473.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import { O as OnResize } from './on-resize-6a194a58.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
@@ -83,9 +83,9 @@ const GuxFormField = class {
         clearInterval(this.valueWatcherId);
     }
     render() {
-        return (h(Host, { key: '187429d2a25a316f6245d9f1a2351e8f8d5d8058', class: {
+        return (h(Host, { key: '19f5810ea8f73b055f46f3a8b969669d9707415f', class: {
                 'gux-active': this.active
-            } }, h(GuxFormFieldContainer, { key: 'feef75fd616db48ecc2778e9683e24d4a5df4552', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '656c8a0e8a008491ffdaf6947cb547415efe0d01', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'c2843c4aa5677b1a7b19c5eb795295e5735694a8', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '11be810fecb1943fdb1a827623f057cae65e1d90', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: 'b981b79d35e12c100c752f69a4f9888089c6cd3e', show: this.hasError }, h("slot", { key: 'b2169aac95fd5075a6c5cf45cd7a01371bdb0857', name: "error" })), h(GuxFormFieldHelp, { key: 'e66fb80c6a4754c3a4688da1c2d14ff311777269', show: !this.hasError && this.hasHelp }, h("slot", { key: '9ba55559ce3d0a1508b2706b9541a537edec732b', name: "help" }))))));
+            } }, h(GuxFormFieldContainer, { key: '246ce9e053cbf2a50e351ea4173d2bdde33923dc', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '56eaab0972a668e7dee2d17df83d2edb876402d0', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '59b3ff1a9a66bb9ce728b3cc6e8f704935ae1b10', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'fda26c8ba627a552f07c48ce68b48b67e9311a19', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: '6e3e43e8172a6fc81f448942beed5c997775a3cc', show: this.hasError }, h("slot", { key: '1e5801770cc08517d4f91b5491a1297b8334174b', name: "error" })), h(GuxFormFieldHelp, { key: '1435be7bcaef80c1122adee4aa211c6208a8f5bc', show: !this.hasError && this.hasHelp }, h("slot", { key: 'caa9bff21e2c05c88253bad45108f43ce3f0abec', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

package/dist/esm/gux-form-field-search.entry.js

@@ -4,9 +4,9 @@ import { O as OnMutation } from './on-mutation-1355c534.js';
 import { o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { p as preventBrowserValidationStyling } from './prevent-browser-validation-styling-3983eb0a.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
-import { h as hasContent, d as clearInput, G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { h as hasContent, d as clearInput, G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { G as GuxFormFieldLabel, a as GuxFormFieldContainer } from './gux-form-field-container-777ec473.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
 import './simulate-native-event-e0631897.js';
@@ -63,13 +63,13 @@ const GuxFormFieldSearch = class {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '892a8b01e71b64d704342a819341a1ed3c3a3d47', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'd04743dd3cb6d532348236e57ef2cc32c4fe3a3b', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '0500121dd533f6ed5eeeacaefdafe3b97b997836', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '07de68ae27e18b0c63ed8c026c709964c9948986', class: "gux-input-and-error-container" }, h("div", { key: 'f4a02c717879f7ce566768ec02c4fed584f8d55a', class: {
+        return (h(GuxFormFieldContainer, { key: '58c06b70fa0c0914647cdc867d863b666b893ed3', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '80e35b2e1029815f0e13ae7d9a8b46c53fbf018c', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '96a2707dfc53b46950076154c77e2b7cb9ec3bea', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '55cfc1f52cb60b46a1852f2db6709c28f37ac2d1', class: "gux-input-and-error-container" }, h("div", { key: '416a6683857cfa850c531f631b71a915839dae4d', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '13723d13c1e1d8077bed6b492c9ffe44a0628ffc', class: {
+            } }, h("div", { key: 'b76bcc1d3dd8c4004f05f4d6777a0766dc0d2389', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("gux-icon", { key: 'd16d8bcc568b7c08e39a991e54c7481370d5acaf', "icon-name": "search", decorative: true }), h("slot", { key: '2d275c75a7fdf518932d79108513a79208fc9b5e', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'cd60f08706f424d959967bf69953c6017df559cb', show: this.hasError }, h("slot", { key: 'cb753e96b1594fc1f2bf2e94527c19cdf886034d', name: "error" })), h(GuxFormFieldHelp, { key: '7655686a50ac0392feb782404cce1c069c79b231', show: !this.hasError && this.hasHelp }, h("slot", { key: '821ec2e5dc07037cc51ef99985146d247365beb0', name: "help" })))));
+            } }, h("gux-icon", { key: 'fb9a66805ffde4ba97e14c2d396d098d4380b0f0', "icon-name": "fa/magnifying-glass-regular", decorative: true }), h("slot", { key: '08f781d16f8c0988a88c5dbdc9ed3be3aeee194e', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '0a418826020e8ff21b8545492c7d5eebd31692c5', show: this.hasError }, h("slot", { key: '75c35edcc3ca3efdd0016714457171b354cf1b86', name: "error" })), h(GuxFormFieldHelp, { key: '305d8def2a97282b6069b7a976be25e28c9deca4', show: !this.hasError && this.hasHelp }, h("slot", { key: '494163366813a80c117639bb6a2c030ba192e5ca', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/esm/gux-form-field-select.entry.js

@@ -4,9 +4,9 @@ import { O as OnMutation } from './on-mutation-1355c534.js';
 import { o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { p as preventBrowserValidationStyling } from './prevent-browser-validation-styling-3983eb0a.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
-import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { G as GuxFormFieldLabel, a as GuxFormFieldContainer } from './gux-form-field-container-777ec473.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
 import './simulate-native-event-e0631897.js';
@@ -54,13 +54,13 @@ const GuxFormFieldSelect = class {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'da7db47a8da22d28beb3584a5a689802d09a87f3', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '3700829135203974282c15fc4dc3db6da68827f9', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'be6a1b497f1bdf420ee2141afeef9a4bb031a41e', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '49a85412e7cfe89b99b3cdbe114d199156fd0594', class: "gux-input-and-error-container" }, h("div", { key: '0664805d3d8322fc381a5ad5a0da1478284e414c', class: {
+        return (h(GuxFormFieldContainer, { key: 'baab7dd21e156bfb27319ff8a999b4c7a0dd70a2', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '40a33a912c507da585c10b5f4ad138015bbe8a59', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'b82d353125d8ad20e37e449f19e2575962611a9e', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'd82ccb9f69e242b9fcee871bd47a8716d07e20b6', class: "gux-input-and-error-container" }, h("div", { key: 'd614e581925fcfb86ccd4fce07c092eaa50c3512', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'b0f7f09b23023f1fc272b782178dd739bba704e7', class: {
+            } }, h("div", { key: 'dfbbdf8d93f6a7f9f2b7a4bad3b8687d7a7ea379', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: 'fdcd6b5185f8fa25940fe8e5e2908f7629bbf448', name: "input" }), h("gux-icon", { key: '7321c0d53019005f1d58e9bbe9cee1e78ef58cc0', "icon-name": "chevron-small-down", decorative: true }))), h(GuxFormFieldError, { key: '374036b06516f77e21735027a9cae1c09862dc33', show: this.hasError }, h("slot", { key: '989e082e1c03db1a62a0f0af921a0acfe9963394', name: "error" })), h(GuxFormFieldHelp, { key: '4d2aa92cc37ebdc981ba768a8b17d0e9dff1b9fe', show: !this.hasError && this.hasHelp }, h("slot", { key: '4cee1bb8c7826aba89be5546eff7f94a75e2557e', name: "help" })))));
+            } }, h("slot", { key: 'd457be1be7a7954ef691c39408ac256f260d9f4e', name: "input" }), h("gux-icon", { key: 'be9def4d0fa60f3324e721631e4f8816ef5fcf8b', "icon-name": "custom/chevron-down-small-regular", decorative: true }))), h(GuxFormFieldError, { key: '38aae01a5b3f59279ad162177843183c6804a393', show: this.hasError }, h("slot", { key: '00ad175eb8ceff6eac2f40c4e8d1a8d2c6a80cde', name: "error" })), h(GuxFormFieldHelp, { key: '2eeca9caa8a051909388623db696e026c6d892d3', show: !this.hasError && this.hasHelp }, h("slot", { key: '6c4fe025017da98a30d191870f41922818774ad7', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/esm/gux-form-field-text-like.entry.js

@@ -4,9 +4,9 @@ import { O as OnMutation } from './on-mutation-1355c534.js';
 import { o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { p as preventBrowserValidationStyling } from './prevent-browser-validation-styling-3983eb0a.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
-import { h as hasContent, c as setSlotAriaDescribedby, d as clearInput, G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { h as hasContent, c as setSlotAriaDescribedby, d as clearInput, G as GuxFormFieldError, a as GuxFormFieldHelp, g as getSlottedInput, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { G as GuxFormFieldLabel, a as GuxFormFieldContainer } from './gux-form-field-container-777ec473.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
 import './simulate-native-event-e0631897.js';
@@ -79,15 +79,15 @@ const GuxFormFieldTextLike = class {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '11aa067706c5f6c91ff83e5f7616640e350c6e70', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'b99ce693335a34a1345c7cf3a3bb0c467adef8ee', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'f92d4903220f4f4a26857f2cb8721d687baad180', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'd1cce04d2d9787290a56a30b893333f0c69e0b96', class: "gux-input-and-error-container" }, h("div", { key: 'f80b237e084f23118db59c44d230f1ebf3986635', class: {
+        return (h(GuxFormFieldContainer, { key: '55a6cf8bc3e719c0f3a0e79ea2cb2126cdf89426', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '5f8fe6205739b0d1e92c80bf4240ee16f02a8146', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '72ca7f9e8f9946fcaf2d8c25c367476e20648b25', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '0168bf7fdf030ef6c59d635814b16565c5bc4bfa', class: "gux-input-and-error-container" }, h("div", { key: '74d073de52d28d38c27719b34a58fc3a8bce8b18', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '2849803deb586c0d66bbf1fe74f56f519de48d04', class: {
+            } }, h("div", { key: '61dc9d10ac90dad8d966ebfde013856c84b9f038', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-has-prefix': this.hasPrefix,
                 'gux-has-suffix': this.hasSuffix
-            } }, h("slot", { key: '2688c3997262b51ca3a3b8f0109afae98a42535a', name: "prefix" }), h("slot", { key: 'b8a15f02f4aaa306ba2a30718226497b266c739a', name: "input" }), this.renderRadialLoading(), h("slot", { key: 'd1fa8e46f65d35fd7bac6e986f2ff688e0ef0c31', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '9ff394f8c52df4aeeca5c40c9e8f4fb7e05681c8', show: this.hasError }, h("slot", { key: 'bf41f9fd79fb75ccd17d76b12047193aee328cd0', name: "error" })), h(GuxFormFieldHelp, { key: '4d167581382d2e90dec87eafd518e5b3dfd964b1', show: !this.hasError && this.hasHelp }, h("slot", { key: 'dfaa97a334b26097a93de84a6e37d76e08e6fb9c', name: "help" })))));
+            } }, h("slot", { key: '285a292cbb1a04f007f084f44a77b0d993be3aab', name: "prefix" }), h("slot", { key: 'c8cb79face98b1c9ab838b10258d06f5ef2d2cc7', name: "input" }), this.renderRadialLoading(), h("slot", { key: 'b97da9467c217b7643c522dca4a2c36de2b4b395', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'd9c47e139b0f23fd349f8b62be786af3babadd7a', show: this.hasError }, h("slot", { key: '9ebc0ea955879b70cacf001d299763c7e4c2e6c0', name: "error" })), h(GuxFormFieldHelp, { key: '8e0757c1363b5e7a5da501b4e52847993f6a3ce4', show: !this.hasError && this.hasHelp }, h("slot", { key: '50af9326c84242ce67e9196f12a0c273de538197', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/esm/gux-form-field-textarea.entry.js

@@ -4,9 +4,9 @@ import { O as OnMutation } from './on-mutation-1355c534.js';
 import { o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { p as preventBrowserValidationStyling } from './prevent-browser-validation-styling-3983eb0a.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
-import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { G as GuxFormFieldLabel, a as GuxFormFieldContainer } from './gux-form-field-container-777ec473.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
 import './simulate-native-event-e0631897.js';
@@ -58,12 +58,12 @@ const GuxFormFieldTextarea = class {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '142f77aa32886b981dca8886b02a5cc8968ba7f3', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'affcaa2769346a30bc9c53f3b9175a2544d69b6e', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '1ba73af3145bfcb08ebbdc49eeaed9bf1b7b3e04', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '82bf935a8c5a8cfdbd4355f49093d9600f6a5bce', class: "gux-input-and-error-container" }, h("div", { key: '2d1576865a86219604c16210e4bd7b62738443fe', ref: el => (this.textareaContainerElement = el), class: {
+        return (h(GuxFormFieldContainer, { key: '494682f4ac2098c5771eef06dc0a778e66182635', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'f0b218f8974dbb90f1f3e570738d79379e963533', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'd46087bcd856fe9372b3a6a8fde277970ecb0d02', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '3ece84df8eb602d83f4688caf00ccaefb9e447fa', class: "gux-input-and-error-container" }, h("div", { key: '2dcd28afcdd0a1f96e93792e74700b43472b167c', ref: el => (this.textareaContainerElement = el), class: {
                 'gux-input': true,
                 [`gux-resize-${this.resize}`]: true,
                 'gux-disabled': this.disabled,
                 'gux-input-error': this.hasError
-            } }, h("slot", { key: '9929c1777c7336a273f5dad95cae087fa735460b', name: "input" })), h(GuxFormFieldError, { key: 'cc061b645a4442ae33bb1dc5c4f5afe856795ed4', show: this.hasError }, h("slot", { key: '89dbb7222e7d66131f403acaf994378c251a29ed', name: "error" })), h(GuxFormFieldHelp, { key: '0918b32ef21d787434ae6d5d79774f8b81cdde46', show: !this.hasError && this.hasHelp }, h("slot", { key: '4c4c912109a80a908646e20545315a73dd8b915e', name: "help" })))));
+            } }, h("slot", { key: '15eec3f490ff8ece0e654933460e800516dc4a0c', name: "input" })), h(GuxFormFieldError, { key: '0d3129e289b6ce134a031df09cc3f2e31e7ebfc6', show: this.hasError }, h("slot", { key: '11e32e54979c6e0590598e90722b626857045241', name: "error" })), h(GuxFormFieldHelp, { key: 'aafcca51d6122af87162d83e3bc88c6616e9d8d5', show: !this.hasError && this.hasHelp }, h("slot", { key: '7f13240605fb68bfa7796c1c32563c135224c723', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/esm/gux-form-field-time-picker.entry.js

@@ -4,9 +4,9 @@ import { O as OnMutation } from './on-mutation-1355c534.js';
 import { a as onDisabledChange, o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { g as getSlotTextContent } from './get-slot-text-content-95a85429.js';
-import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { G as GuxFormFieldLegendLabel, a as GuxFormFieldFieldsetContainer } from './gux-form-field-fieldset-container-9b9fee2f.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import './get-closest-element-728b9f18.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
@@ -68,13 +68,13 @@ const GuxFormFieldTimePicker = class {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '9c105521e5d854cad208cfc9c4d5ede453ee1ee4', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '56cb1e9d5f2b34bfb302cb299934b140f7eac5e0', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '0d813de099f48d7d762586bc86e5638e8407416e', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '37c77626c3adcb44e0c1a31316a1426b53933800', class: "gux-input-and-error-container" }, h("div", { key: '289b3673030fc1e9cca70fab12668378cdc0a636', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: 'ae4709aaff5ee2e057a54a3a5910b0bbbc9ebc06', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '5ee1f0147dcdb554d2d921b66f0b2afc2d6ab139', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: 'fa722b21f1b7cd9a5b2f0243f2cd489137d9996d', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '232bde02c1cea41b2d50948919645d8d8b484c1e', class: "gux-input-and-error-container" }, h("div", { key: 'f102981af86be2542014700a04e2fff362ef662a', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '75ca1689ec63a13d7dd9deb6686db42c3d049bf1', class: {
+            } }, h("div", { key: '3cd0a101d2c74beed6ac37bca4cc0f14494da62a', class: {
                 'gux-time-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '6bbc5927c829ea4c0edd249b3be9cd02f1e729ef' }))), h(GuxFormFieldError, { key: 'da2467b63ebea01647fa379e405fede51ec190f6', show: this.hasError }, h("slot", { key: '54b24c16b2cc497df4f95875a61af23d28fdff71', name: "error" })), h(GuxFormFieldHelp, { key: '9451839717e3371a5b181e82fd20152a9314850b', show: !this.hasError && this.hasHelp }, h("slot", { key: 'e61a352f1bdbb5842fc9294595ed26a4c6dc7476', name: "help" })))));
+            } }, h("slot", { key: 'f6dcbaf31b7dded9a7c3e5d14ae3e7125964345e' }))), h(GuxFormFieldError, { key: '14ed5f69aac4f5dd0dbe545a429a6620f4bae9b3', show: this.hasError }, h("slot", { key: 'd7a0445b647d33fb41f841ab33888db209c2253e', name: "error" })), h(GuxFormFieldHelp, { key: 'edce8c2c7f40f3f266cff656c04f9511f3b25b22', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ca292da1fcbf617694952a51268da98c300f9e24', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

package/dist/esm/gux-form-field-time-zone-picker.entry.js

@@ -4,9 +4,9 @@ import { O as OnMutation } from './on-mutation-1355c534.js';
 import { a as onDisabledChange, o as onRequiredChange } from './on-attribute-change-f42eabee.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { g as getSlotTextContent } from './get-slot-text-content-95a85429.js';
-import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-f168cdd4.js';
+import { G as GuxFormFieldError, a as GuxFormFieldHelp, v as validateFormIds, b as getComputedLabelPosition } from './gux-form-field.service-2bda6421.js';
 import { G as GuxFormFieldLegendLabel, a as GuxFormFieldFieldsetContainer } from './gux-form-field-fieldset-container-9b9fee2f.js';
-import { t as trackComponent } from './usage-66bd1339.js';
+import { t as trackComponent } from './usage-b1ea9683.js';
 import './get-closest-element-728b9f18.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
@@ -68,12 +68,12 @@ const GuxFormFieldTimeZonePicker = class {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '51bb4486dee284c2c89b7c3909388e3c019175bc', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '1eed31a1f5e74f227026a46579b894d8c43ab9ec', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '7a76720e5d5396c11c2b9ee15038d9006f62638d', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: 'c32362dbf15f93b11f51570eac855fc6191e510b', class: "gux-input-and-error-container" }, h("div", { key: '47b6a4fc5814130e60fa470205ee3849b2cab324', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '221339c9cdc5b5aad8ce193a06eeea61fed8015b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '872f50bb406b15ab6076e155cf8c2ad20319c4fb', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: 'caacd633f6fbc1b831bb4bf61f9f2f9fec894d63', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '117e568a0c3157e72f6869f42bacb8b7f203fbcc', class: "gux-input-and-error-container" }, h("div", { key: '5598ced3dadb1a0adcc68a0a24700ab31212fdcd', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError,
                 'gux-time-zone-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: 'ddf9e64350ed5982e1a4caa77352b1249b25a9e7' })), h(GuxFormFieldError, { key: 'b14c0608d9871d88ca5831b7b01bd5ae5a0a6f5f', show: this.hasError }, h("slot", { key: 'b4b4417aa7e5231b742b989daff8b4f724762e75', name: "error" })), h(GuxFormFieldHelp, { key: '83e537aa17df632522dbefcd16152fa4dfa1c094', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ebc6eaa84d1b684b457c6b385222d8d59886a090', name: "help" })))));
+            } }, h("slot", { key: '36d4c79ddc4c3ffe16c1be66590b7e29ec1a995a' })), h(GuxFormFieldError, { key: 'cecadba80ef25836dec00dc6a49722b59b21d659', show: this.hasError }, h("slot", { key: '1e14a287e7725a50535d89a400cfe102da714e96', name: "error" })), h(GuxFormFieldHelp, { key: 'b5e53038e69e460e79200cff900cc2d98ad3a07a', show: !this.hasError && this.hasHelp }, h("slot", { key: '29b847bb2eeaa521377984d9ea148189d722f55e', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

package/dist/esm/gux-form-field.service-2bda6421.js

@@ -0,0 +1,140 @@
+import { h } from './index-da21b737.js';
+import { r as randomHTMLId } from './random-html-id-81ac821b.js';
+import { l as logError } from './log-error-274efeb7.js';
+import { s as simulateNativeEvent } from './simulate-native-event-e0631897.js';
+import { h as hasSlot } from './has-slot-f24a46a6.js';
+
+const GuxFormFieldHelp = ({ show }, children) => {
+    return (h("div", { class: {
+            'gux-form-field-help': true,
+            'gux-show': show
+        } },
+        h("div", { class: "gux-message" }, children)));
+};
+
+const GuxFormFieldError = ({ show }, children) => {
+    return (h("div", { class: {
+            'gux-form-field-error': true,
+            'gux-show': show
+        } },
+        h("gux-icon", { "icon-name": "fa/hexagon-exclamation-regular", decorative: true }),
+        h("div", { class: "gux-message" }, children)));
+};
+
+function setInputValue(input, value, focusAfter) {
+    input.value = value;
+    simulateNativeEvent(input, 'input');
+    simulateNativeEvent(input, 'change');
+    if (focusAfter) {
+        input.focus();
+    }
+}
+
+function clearInput(input) {
+    setInputValue(input, '', true);
+}
+function hasContent(input) {
+    return Boolean(input === null || input === void 0 ? void 0 : input.value);
+}
+function getComputedLabelPosition(label, labelPosition) {
+    if (label) {
+        if (['above', 'beside', 'screenreader'].includes(labelPosition)) {
+            return labelPosition;
+        }
+        else if (label.offsetWidth > 1 && label.offsetWidth < 40) {
+            return 'beside';
+        }
+        else {
+            return 'above';
+        }
+    }
+}
+function validateFormIds(root, input) {
+    var _a, _b, _c, _d;
+    if (hasLabelSlot(root)) {
+        const label = root.querySelector('label[slot="label"]');
+        const inputHasId = Boolean(input.hasAttribute('id'));
+        const labelHasFor = Boolean(label.hasAttribute('for'));
+        if (!inputHasId && labelHasFor) {
+            logError(root, 'A "for" attribute has been provided on the label but there is no corresponding id on the input. Either provide an id on the input or omit the "for" attribute from the label. If there is no input id and no "for" attribute provided, the component will automatically generate an id and link it to the "for" attribute.');
+        }
+        else if (!inputHasId) {
+            const defaultInputId = randomHTMLId('gux-form-field-input');
+            input.setAttribute('id', defaultInputId);
+            label.setAttribute('for', defaultInputId);
+        }
+        else if (inputHasId && !labelHasFor) {
+            const forId = input.getAttribute('id');
+            label.setAttribute('for', forId);
+        }
+        else if (inputHasId &&
+            labelHasFor &&
+            input.getAttribute('id') !== label.getAttribute('for')) {
+            logError(root, 'The input id and label for attribute should match.');
+        }
+    }
+    else {
+        logError(root, 'A label is required for this component. If a visual label is not needed for this use case, please add localized text for a screenreader and set the label-position attribute to "screenreader" to visually hide the label.');
+    }
+    if (hasSlot(root, 'error')) {
+        const error = root.querySelector('[slot="error"]');
+        const errorId = randomHTMLId('gux-form-field-error');
+        const describedByIds = ((_a = input
+            .getAttribute('aria-describedby')) === null || _a === void 0 ? void 0 : _a.split(' ').filter(id => !id.startsWith(`gux-form-field-error`))) || [];
+        error.setAttribute('id', errorId);
+        describedByIds.push(errorId);
+        describedByIds &&
+            input.setAttribute('aria-describedby', describedByIds.join(' '));
+    }
+    else if (input.getAttribute('aria-describedby')) {
+        const describedByIds = ((_b = input
+            .getAttribute('aria-describedby')) === null || _b === void 0 ? void 0 : _b.split(' ').filter(id => !id.startsWith(`gux-form-field-error`))) || [];
+        input.setAttribute('aria-describedby', describedByIds.join(' '));
+    }
+    if (hasSlot(root, 'help')) {
+        const help = root.querySelector('[slot="help"]');
+        const helpId = randomHTMLId('gux-form-field-help');
+        const describedByIds = ((_c = input
+            .getAttribute('aria-describedby')) === null || _c === void 0 ? void 0 : _c.split(' ').filter(id => !id.startsWith(`gux-form-field-help`))) || [];
+        help.setAttribute('id', helpId);
+        describedByIds.push(helpId);
+        describedByIds &&
+            input.setAttribute('aria-describedby', describedByIds.join(' '));
+    }
+    else if (input.getAttribute('aria-describedby')) {
+        const describedByIds = ((_d = input
+            .getAttribute('aria-describedby')) === null || _d === void 0 ? void 0 : _d.split(' ').filter(id => !id.startsWith(`gux-form-field-help`))) || [];
+        input.setAttribute('aria-describedby', describedByIds.join(' '));
+    }
+}
+function setSlotAriaAttribute(root, attribute, input, slotName) {
+    var _a;
+    if (hasSlot(root, slotName)) {
+        const slottedElement = root.querySelector(`[slot=${slotName}]`);
+        const randomId = randomHTMLId(`gux-${slotName}`);
+        const ariaAttributeIds = ((_a = input
+            .getAttribute(attribute)) === null || _a === void 0 ? void 0 : _a.split(' ').filter(id => !id.startsWith(`gux-${slotName}`))) || [];
+        slottedElement.setAttribute('id', randomId);
+        ariaAttributeIds === null || ariaAttributeIds === void 0 ? void 0 : ariaAttributeIds.push(randomId);
+        ariaAttributeIds &&
+            input.setAttribute(attribute, ariaAttributeIds.join(' '));
+    }
+}
+function setSlotAriaLabelledby(root, input, slotName) {
+    setSlotAriaAttribute(root, 'aria-labelledby', input, slotName);
+}
+function setSlotAriaDescribedby(root, input, slotName) {
+    setSlotAriaAttribute(root, 'aria-describedby', input, slotName);
+}
+function getSlottedInput(root, inputSelector) {
+    const inputElement = root.querySelector(inputSelector);
+    if (!inputElement) {
+        logError(root, `This component requires an input element that matches the following selector: ${inputSelector}`);
+    }
+    return inputElement;
+}
+function hasLabelSlot(root) {
+    return Boolean(root.querySelector('label[slot="label"]'));
+}
+
+export { GuxFormFieldError as G, GuxFormFieldHelp as a, getComputedLabelPosition as b, setSlotAriaDescribedby as c, clearInput as d, setInputValue as e, getSlottedInput as g, hasContent as h, setSlotAriaLabelledby as s, validateFormIds as v };