genesys-spark-components 4.160.1 → 4.162.0

package/dist/collection/components/stable/gux-dropdown/gux-dropdown.css

@@ -4,7 +4,7 @@
 }
 
 .gux-field,
-.gux-target-container-expanded {
+.gux-target-container-filterable {
   all: unset;
   box-sizing: border-box;
   display: flex;
@@ -22,22 +22,22 @@
   background-color: var(--gse-ui-formControl-input-backgroundColor);
 }
 
-.gux-target-container-expanded,
-.gux-target-container-collapsed .gux-field {
+.gux-target-container-filterable,
+.gux-target-container-not-filterable .gux-field {
   padding: var(--gse-ui-formControl-input-padding);
 }
 
-.gux-error.gux-target-container-collapsed .gux-field-button, .gux-error.gux-target-container-expanded {
+.gux-error.gux-target-container-not-filterable .gux-field-button, .gux-error.gux-target-container-filterable {
   border: var(--gse-ui-formControl-input-error-border-width) var(--gse-ui-formControl-input-error-border-style) var(--gse-ui-formControl-input-error-border-color);
 }
 
-.gux-disabled.gux-target-container-collapsed .gux-field-button, .gux-disabled.gux-target-container-expanded {
+.gux-disabled.gux-target-container-not-filterable .gux-field-button, .gux-disabled.gux-target-container-filterable {
   user-select: none;
   border: var(--gse-ui-formControl-input-disabled-border-width) var(--gse-ui-formControl-input-disabled-border-style) var(--gse-ui-formControl-input-disabled-border-color);
 }
 
-.gux-target-container-collapsed .gux-field-button:hover,
-.gux-target-container-expanded:hover {
+.gux-target-container-not-filterable .gux-field-button:hover,
+.gux-target-container-filterable:hover {
   border: var(--gse-ui-formControl-input-hover-border-width) var(--gse-ui-formControl-input-hover-border-style) var(--gse-ui-formControl-input-hover-border-color);
 }
 
@@ -100,27 +100,35 @@
   color: var(--gse-ui-formControl-input-inputIcon-iconEndColor);
 }
 
-.gux-target-container-expanded {
+.gux-target-container-filterable {
+  border: var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) var(--gse-ui-formControl-input-default-border-color);
+  border-radius: var(--gse-ui-formControl-input-borderRadius);
+}
+.gux-target-container-filterable.gux-target-container-filterable-active {
   border: var(--gse-ui-formControl-input-active-border-width) var(--gse-ui-formControl-input-active-border-style) var(--gse-ui-formControl-input-active-border-color);
   border-radius: var(--gse-ui-formControl-input-borderRadius);
 }
-.gux-target-container-expanded:focus-visible {
+.gux-target-container-filterable:focus-visible {
   outline: var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);
   outline-offset: var(--gse-semantic-focusOutline-offset);
 }
-.gux-target-container-expanded:focus-within:has(:focus-visible) {
+.gux-target-container-filterable:focus-within:has(:focus-visible) {
   outline: var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);
   outline-offset: var(--gse-semantic-focusOutline-offset);
 }
-.gux-target-container-expanded .gux-filter-input {
+.gux-target-container-filterable .gux-filter-input {
   background-color: inherit;
   border: none;
 }
-.gux-target-container-expanded .gux-filter-input:focus {
+.gux-target-container-filterable .gux-filter-input:focus {
   outline: none;
   border: none;
 }
-.gux-target-container-expanded .gux-field-button {
+.gux-target-container-filterable .gux-filter-input::selection {
+  color: inherit; /* Keep text color the same */
+  background: transparent; /* Make selection background invisible */
+}
+.gux-target-container-filterable .gux-field-button {
   inline-size: auto;
   block-size: var(--gse-ui-formControl-input-contentText-lineHeight);
   margin: 0;
@@ -129,19 +137,19 @@
   border: none;
   box-shadow: none;
 }
-.gux-target-container-expanded .gux-field-button:focus {
+.gux-target-container-filterable .gux-field-button:focus {
   outline: none;
 }
 
-.gux-target-container-collapsed .gux-field-button {
+.gux-target-container-not-filterable .gux-field-button {
   border: var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) var(--gse-ui-formControl-input-default-border-color);
   border-radius: var(--gse-ui-formControl-input-borderRadius);
 }
-.gux-target-container-collapsed .gux-field-button:focus-visible {
+.gux-target-container-not-filterable .gux-field-button:focus-visible {
   outline: var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);
   outline-offset: var(--gse-semantic-focusOutline-offset);
 }
-.gux-target-container-collapsed .gux-field-button:focus-within:has(:focus-visible) {
+.gux-target-container-not-filterable .gux-field-button:focus-within:has(:focus-visible) {
   outline: var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);
   outline-offset: var(--gse-semantic-focusOutline-offset);
 }

package/dist/collection/components/stable/gux-dropdown/gux-dropdown.js

@@ -47,6 +47,7 @@ export class GuxDropdown {
     watchExpanded(expanded) {
         if (!expanded) {
             this.filter = '';
+            this.filterElement.value = '';
         }
     }
     watchValue(newValue) {
@@ -113,6 +114,10 @@ export class GuxDropdown {
     }
     onFocusin(event) {
         this.stopPropagationOfInternalFocusEvents(event);
+        if (this.isFilterable() &&
+            !this.root.contains(event === null || event === void 0 ? void 0 : event.relatedTarget)) {
+            this.filterElement.focus();
+        }
     }
     onClickOutside() {
         this.collapseListbox('noFocusChange');
@@ -335,8 +340,8 @@ export class GuxDropdown {
             } }, h("gux-icon", { "icon-name": iconOption.iconName, style: iconStyle, decorative: true, size: "small" }), h("gux-truncate", { ref: el => (this.truncateElement = el) }, optionText)));
     }
     renderFilterInputField() {
-        if (this.expanded && this.isFilterable()) {
-            return (h("div", { class: "gux-field gux-input-field", dir: "auto" }, h("div", { class: "gux-field-content" }, h("div", { class: "gux-filter" }, h("div", { class: "gux-filter-display" }, h("span", { class: "gux-filter-text" }, this.filter), h("span", { class: "gux-filter-suggestion" }, this.getTypeaheadText(this.filter))), h("div", { class: "input-and-dropdown-button" }, h("input", { onClick: this.fieldButtonClick.bind(this), class: "gux-filter-input", type: "text", "aria-label": this.i18n('filterResults'), ref: el => (this.filterElement = el), onInput: this.filterInput.bind(this), onKeyDown: this.filterKeydown.bind(this), onKeyUp: this.filterKeyup.bind(this), disabled: this.disabled }))))));
+        if (this.isFilterable()) {
+            return (h("div", { class: "gux-field gux-input-field", dir: "auto" }, h("div", { class: "gux-field-content" }, h("div", { class: "gux-filter" }, h("div", { class: "gux-filter-display" }, h("span", { class: "gux-filter-text" }, this.filter), h("span", { class: "gux-filter-suggestion" }, this.getTypeaheadText(this.filter))), h("div", { class: "input-and-dropdown-button" }, h("input", { class: "gux-filter-input", type: "text", "aria-label": this.i18n('filterResults'), ref: el => (this.filterElement = el), onInput: this.filterInput.bind(this), onKeyDown: this.filterKeydown.bind(this), onKeyUp: this.filterKeyup.bind(this), onFocus: () => (this.expanded = true), disabled: this.disabled }), this.renderTargetContent())))));
         }
     }
     renderPopup() {
@@ -344,11 +349,12 @@ export class GuxDropdown {
     }
     renderTarget() {
         return (h("div", { class: {
-                'gux-target-container-expanded': this.expanded && this.isFilterable(),
-                'gux-target-container-collapsed': !(this.expanded && this.isFilterable()),
+                'gux-target-container-filterable': this.isFilterable(),
+                'gux-target-container-filterable-active': this.expanded && this.isFilterable(),
+                'gux-target-container-not-filterable': !this.isFilterable(),
                 'gux-error': this.hasError,
                 'gux-disabled': this.disabled
-            }, slot: "target" }, this.renderFilterInputField(), h("button", { type: "button", class: "gux-field gux-field-button", disabled: calculateInputDisabledState(this.root), onClick: this.fieldButtonClick.bind(this), onFocusin: this.showTooltip.bind(this), onFocusout: this.hideTooltip.bind(this), ref: el => (this.fieldButtonElement = el), "aria-haspopup": "listbox", "aria-expanded": this.expanded.toString() }, this.renderTargetContent(), this.renderRadialLoading(), h("gux-icon", { class: {
+            }, slot: "target" }, this.renderFilterInputField(), h("button", { type: "button", class: "gux-field gux-field-button", disabled: calculateInputDisabledState(this.root), onClick: this.fieldButtonClick.bind(this), onFocusin: this.showTooltip.bind(this), onFocusout: this.hideTooltip.bind(this), ref: el => (this.fieldButtonElement = el), "aria-haspopup": "listbox", "aria-expanded": this.expanded.toString() }, !this.isFilterable() && this.renderTargetContent(), this.renderRadialLoading(), h("gux-icon", { class: {
                 'gux-expand-icon': true
             }, "screenreader-text": this.i18n('dropdown'), size: "small", iconName: this.expanded
                 ? 'custom/chevron-up-small-regular'
@@ -365,7 +371,7 @@ export class GuxDropdown {
         }
     }
     render() {
-        return (h("gux-popup", { key: '1489eb86035a07be578c9add3edf616e95061f16', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()));
+        return (h("gux-popup", { key: '49c7e8f06f4de5511cf7d70953d281fb2b7326de', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()));
     }
     static get is() { return "gux-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-dropdown-multi/gux-dropdown-multi-tag/gux-dropdown-multi-tag.js

@@ -33,7 +33,7 @@ export class GuxDropdownMultiTag {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: '736f46e03112b67563ab34cff27d60a81b74d06f', class: {
+        return (h("div", { key: '974b5a86160b5aacae364e031e274067a8c49aaf', class: {
                 'gux-tag': true,
                 'gux-disabled': this.disabled
             }, "aria-disabled": this.disabled.toString() }, this.numberSelected.toString(), this.renderRemoveButton()));

package/dist/collection/components/stable/gux-dropdown-multi/gux-dropdown-multi.js

@@ -407,7 +407,7 @@ export class GuxDropdownMulti {
     }
     render() {
         return [
-            h("div", { key: '21470eb5abc8ce97d749c5b4199c97c3209b63d4', class: "gux-dropdown-container" }, h("gux-popup", { key: 'a46922d1410cd946f8a8c4d873dfb26fe61de9c3', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()))
+            h("div", { key: 'c20af3c7255018600ecae391f368f5393524abbd', class: "gux-dropdown-container" }, h("gux-popup", { key: 'a8fe4f4356451bcdfe2256336ee2753c5365a34a', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()))
         ];
     }
     static get is() { return "gux-dropdown-multi"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-flyout-menu.js

@@ -183,10 +183,10 @@ export class GuxFlyoutMenu {
         }
     }
     render() {
-        return (h(Host, { key: '7ad3efd714c201938298cf87b5acc6e86a4618c0', tabIndex: 0, "aria-haspopup": "true" }, h("gux-announce-beta", { key: 'f2c96a97da0e807e8a0506b12b01e7d9dc4e03f1', ref: el => (this.announceElement = el) }), h("span", { key: '92702bfb121a185695edac754f6bc29371b7f635', ref: el => (this.targetElement = el) }, h("slot", { key: '6b6e3221ea75d5f498466c178e1229f1eb27e675', name: "target" })), h("div", { key: '701eb459b5a0f71395b55c5785f549bef720d23d', class: {
+        return (h(Host, { key: '6cf59014f90870cbe8d838110c2aa096543a114b', tabIndex: 0, "aria-haspopup": "true" }, h("gux-announce-beta", { key: '1695c676fccd04b1f329a03ebf07887236ef08f3', ref: el => (this.announceElement = el) }), h("span", { key: '0e5f007704cf3ceee5e6de231a417eed53c72d57', ref: el => (this.targetElement = el) }, h("slot", { key: '0dbf1fe885215ab2e70266ae2c09be958ae48657', name: "target" })), h("div", { key: '6e475181c87066e81feda5ce432c75bf700f17a6', class: {
                 'gux-flyout-menu-content': true,
                 'gux-shown': this.isShown
-            }, ref: el => (this.menuContentElement = el) }, h("div", { key: 'acf809c3553c47e9c7807695dd4598251268ed7a', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: 'efea8e265eee0be91e5a95867b869fe0d7c92f6d', class: "gux-arrow-caret" })), h("slot", { key: '7ab7ae4ec3ade19ff50e2eec0d0fc1b20d3d7c93', name: "menu" }))));
+            }, ref: el => (this.menuContentElement = el) }, h("div", { key: '4026a9def2ebdfde26aa0e5300673e5a8c1b9c1c', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: '2cbd5a5d8ebc4726dacebf764a4a33465fa34b1e', class: "gux-arrow-caret" })), h("slot", { key: '46ac2c59463c9ee24f3c931ba4aeed791291bd98', name: "menu" }))));
     }
     static get is() { return "gux-flyout-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-menu/gux-menu-option/gux-menu-option.js

@@ -31,7 +31,7 @@ export class GuxMenuOption {
         }
     }
     render() {
-        return (h("button", { key: 'a6e20affe6260ec5c17148cefdbfebe4a53ad9c6', type: "button", class: "gux-menu-option-button", "aria-haspopup": "false", tabIndex: -1, ref: el => (this.buttonElement = el) }, h("span", { key: '446395c2040c00b76ea1ce85e5f5599cae769aa7', class: "gux-menu-option-button-text" }, h("slot", { key: '4cd4228be9a88d2c02e9ec1431eb3128b72c02e5' }))));
+        return (h("button", { key: 'e2015bcc33546750074b4a3534103c69b62e9b50', type: "button", class: "gux-menu-option-button", "aria-haspopup": "false", tabIndex: -1, ref: el => (this.buttonElement = el) }, h("span", { key: '91a724efb57a0f0ba34a9963aec8e28c47aa2952', class: "gux-menu-option-button-text" }, h("slot", { key: 'a13f5c4d6c79f95f47724a764b9aaaf85d27ced7' }))));
     }
     static get is() { return "gux-menu-option"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-menu/gux-menu.js

@@ -4,7 +4,7 @@ import { h, Host } from "@stencil/core";
  */
 export class GuxMenu {
     render() {
-        return (h(Host, { key: '0e69a50f9eaaed2e1ed5b8d9f612101dad7d7282', role: "menu" }, h("slot", { key: '37cb104c320d31ddf8770b323a9c72ff3e7bdf53' })));
+        return (h(Host, { key: '3dd5718ab15b76897fdce21ff09f870b87bff8f9', role: "menu" }, h("slot", { key: 'eaa9274b7fa89faaed30f93ac1a82aa346097be1' })));
     }
     static get is() { return "gux-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-menu/gux-submenu/gux-submenu.js

@@ -142,13 +142,13 @@ export class GuxSubmenu {
         }
     }
     render() {
-        return (h(Host, { key: '6b7e91ec42d7960b344d59407c9a89ea8666e32a' }, h("button", { key: 'e5b59a39c084eff76454799bdc799b05aca52959', type: "button", class: {
+        return (h(Host, { key: '27965e4e4f85b48f970fb6483304c642b94e5f4e' }, h("button", { key: 'd43d582fb7705d47e890d9035f34694463fe7a04', type: "button", class: {
                 'gux-submenu-button': true,
                 'gux-submenu-button-active': this.isShown
-            }, role: "menuitem", tabIndex: -1, ref: el => (this.buttonElement = el), "aria-haspopup": "true", "aria-expanded": this.isShown.toString() }, h("span", { key: '63c7252401b34b26ecd67994c590edcbbb18776b', class: "gux-submenu-button-text" }, this.label), h("gux-icon", { key: '7b3ac1e4a44b6e2e0d827d458ab5a9f6ba9daa3e', class: "gux-submenu-open-icon", "icon-name": "custom/chevron-right-small-regular", decorative: true, size: "small" })), h("div", { key: '0678dc9499e9b927f4a0212832407bbe06785bba', ref: el => (this.submenuElement = el), class: {
+            }, role: "menuitem", tabIndex: -1, ref: el => (this.buttonElement = el), "aria-haspopup": "true", "aria-expanded": this.isShown.toString() }, h("span", { key: 'f38245fbb3da327a731cb0dd5bb5b06611750d0f', class: "gux-submenu-button-text" }, this.label), h("gux-icon", { key: 'f395df960996fc4318bf59e5acf4491890c2e4d5', class: "gux-submenu-open-icon", "icon-name": "custom/chevron-right-small-regular", decorative: true, size: "small" })), h("div", { key: 'da54d4d56dd582f64b3bbf82e67962325d35ec13', ref: el => (this.submenuElement = el), class: {
                 'gux-submenu-wrapper': true,
                 'gux-shown': this.isShown
-            } }, h("div", { key: '0e361310e24daaecfa946fce6b06696a06a43d7c', role: "menu", class: "gux-submenu-content", ref: el => (this.submenuContentElement = el) }, h("slot", { key: '19f8cd9928b11e23a103f8f6cb91a496fe4e77b5' })))));
+            } }, h("div", { key: '59704a49050ba1d941fd5b52e43bdb6eef95f331', role: "menu", class: "gux-submenu-content", ref: el => (this.submenuContentElement = el) }, h("slot", { key: 'ae62f3e1a397322d09ff811104a3ce78bb32ff4c' })))));
     }
     static get is() { return "gux-submenu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-checkbox/gux-form-field-checkbox.js

@@ -47,10 +47,10 @@ export class GuxFormFieldCheckbox {
         }
     }
     render() {
-        return (h(Host, { key: '9b37ae14b5aa5d2904c22ffcf8393a2d845dc4d4', class: {
+        return (h(Host, { key: '8581778dc168bd68805734f4f1a1d96935327f4b', class: {
                 'gux-input-error': this.hasError || this.hasGroupError,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '88dcd1250fae77eb5dce53948b529bdbf7d2a305', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: 'f1286e98b0c3e00b42c97f171f9e0050d5b13ee4', class: "gux-input-label" }, h("div", { key: '1884ee7889b14035720aee337ddf9de0d9d1d1b4', class: "gux-input" }, h("slot", { key: 'cc7e9eb9a01cb65e48b93d1acd53f0aeba2b3d4d', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '8427792713aa87fd81f71ec3d206cb1723083f77', class: `gux-label-${this.labelPosition}`, "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: '378f25400af0eb3243918c677435746e41035576', name: "label" }))), h("div", { key: '5af392b1b7a9f2340deda557b9b4c8cb44c80623', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '2f04e17d935c9368401fc6bb6521a070b646910b', show: this.hasError }, h("slot", { key: 'cc324117414007141e0205fad334897811c5f80b', name: "error" })), h(GuxFormFieldHelp, { key: '4f918830189307a41cbfa00893015102ca5136f4', show: !this.hasError && this.hasHelp }, h("slot", { key: '1b464e2b2ea883e46cf2ff7b4d12baef04f2d444', name: "help" }))))));
+            } }, h("div", { key: '4c63f70ff1db923a238e21f456bab8f29a72781b', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '38e009c001bf831543477875ba840e8862c44f48', class: "gux-input-label" }, h("div", { key: 'f7f71142b086d18d54cac7bb6e4362b6d9ca2401', class: "gux-input" }, h("slot", { key: '2e318e7cc9c99514508dae735501a5c3c541f5d9', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '6c65b22cb643656764009eb9dc70e9aefca1e208', class: `gux-label-${this.labelPosition}`, "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: 'c5cd085547086688333042b5876f1a9401c012b9', name: "label" }))), h("div", { key: 'ad15e5dce7b496eff018ed618c317aad85b1b6c0', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '7906a5bd3d48c8b48beedc24a1116564357cc847', show: this.hasError }, h("slot", { key: 'd7b98fe8e361f77bdaee472f8de50a252103bf41', name: "error" })), h(GuxFormFieldHelp, { key: '810453eeb0afef16b13d7af52232560678980523', show: !this.hasError && this.hasHelp }, h("slot", { key: '71d2c1db3e2b9c964b125bdb93992a485d86960c', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition.toLowerCase();

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-checkbox-group/gux-form-field-checkbox-group.js

@@ -150,8 +150,8 @@ export class GuxFormFieldCheckboxGroupBeta {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: 'e510f0c0fcf9fd76c3c391bd66ec2fef75b7be9a', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: 'bc4bb057d2d535f204cefe85ad27d9b6217dec46' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), h(GuxFormFieldVisualLabel, { key: '5e5164adc2563d6d3bab22188a5d75440c572e27', position: "above", required: this.required }, h("slot", { key: '0906ef1243947d52d9c3d2618c0c88a62b94b945', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '19e888030a5c2078c38dab9b5685e6c8e4dcb4f9', variant: this.indicatorMark, required: this.required }), h("slot", { key: '5dd452934445d8269cd667ae910f1533aee27f75', name: "group-label-info" })), h("slot", { key: '4155cf7d2f092ffe73188f573c04b62a50aacdc2', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: '34ef875c9dc46ff37eb3574ef94b065e44199c21', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: 'e367804623750343279f24afbb6030c7405f0360', show: this.hasGroupError }, h("slot", { key: 'e140d2c5cf27f58464cabc70f7f49023061696ec', name: "group-error" })), h(GuxFormFieldHelp, { key: '6828d92569eee8d5fdadbe1fbcd93910091ae9b0', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: '2b5e8829043e90f7f55c13ec14842436ce6dfa29', name: "group-help" }))));
+        return (h(GuxFormFieldFieldsetContainer, { key: '1bd55cd30c1d66f866ff614711307af7b2753049', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: '53c77e1bab69f3b770f6a7b0a8b12aa0dcf29a74' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), h(GuxFormFieldVisualLabel, { key: '3232b20676b1951a6f8b47d6bb557d3debae43e5', position: "above", required: this.required }, h("slot", { key: '6a87a0c77c616b89be18115ec37ca270fa26cc12', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'fdf1091895b1a02a6575e563e0778798d6a15fb2', variant: this.indicatorMark, required: this.required }), h("slot", { key: '40e09a0c533ff7b39d5d31e7c0f6b515783589d8', name: "group-label-info" })), h("slot", { key: '4e9debc65762b8e86889c08c8a897caa49160198', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: 'f0efc758f04c597f1d45902794423bfc35326595', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: '942ca8456bed376cb8ea987d422acdda34fa5167', show: this.hasGroupError }, h("slot", { key: '126c1015d36a535c8e88eb729840831c3738f5e9', name: "group-error" })), h(GuxFormFieldHelp, { key: '4764c245a4f74de1e23b811605a16f8a56c344d3', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: 'f48dd8183237c169b655fca54749a89424d30dca', name: "group-help" }))));
     }
     setLabel() {
         this.label = this.root.querySelector('label[slot="group-label"]');

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-color/gux-form-field-color.js

@@ -85,13 +85,13 @@ export class GuxFormFieldColor {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '9bb0ee43e91d6bc55f14c79bf205615caef36b6f', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '94e0d29db2d749880f35701ce99aa22015d23325', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '97a0e24aea02d952179317e1453cea220738733e', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '9efa9064b0e6270f48f756de90d71e5081b6eb3a', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ea8cce3efc4e54fbb18ca9b498f684457f16166d', name: "label-info" })), h("div", { key: '85730bcafa56972ec24edfff30b7cba3e22e4f7d', class: "gux-input-and-error-container" }, h("div", { key: 'b64c5aaea6f3f16dc9dd05aaca7e4ba4e558a55e', class: {
+        return (h(GuxFormFieldContainer, { key: '545246d9da1c49969b9a9d27cde862b01bdb188f', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '928e5e60935b41818ff2b60542c838120c4516b4', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'b2bbf26060dca87fd94e57e86e81aae1c4a3fac9', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '17bc94c09d012c9f2a8bb9463b8b83a29b4b3a1e', variant: this.indicatorMark, required: this.required }), h("slot", { key: '1fdf0abf89df7cb6cac5ad6b0b4984e3d03413c6', name: "label-info" })), h("div", { key: 'daa1acf1cfae60f89fcd62449b9c940c36dca4cf', class: "gux-input-and-error-container" }, h("div", { key: '2646e6dbf2548d6a34c7ce33edf8585de8315db8', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '41c6dcd864d396fd51ef29c381ffe6d157a950c8', class: {
+            } }, h("div", { key: 'fee91e931225b2a0376b0bd1c368bd18979449e8', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '0b967d0efd9eca208a40369679725389f4feccb9', name: "input", onSlotchange: () => this.setInput() }))), h(GuxFormFieldError, { key: '03c36ee06dc975ee41dbe176e4c225cf520d3145', show: this.hasError }, h("slot", { key: '5f39c0b374eab15bdc51bcc8d4b66d8099a1bae2', name: "error" })), h(GuxFormFieldHelp, { key: '308153f1fa7f016ea9e724626e335a48171b8722', show: !this.hasError && this.hasHelp }, h("slot", { key: '13d012116faf9688ba1d98b080c545c286d3cb6c', name: "help" })))));
+            } }, h("slot", { key: 'e4bc50afcc9a4d5dc84fe73d36adfe32f318628d', name: "input", onSlotchange: () => this.setInput() }))), h(GuxFormFieldError, { key: 'ba46aae96078cbd4cb8e2c4a7e8f0ecf88ffe96b', show: this.hasError }, h("slot", { key: '0b86d27ae8c5748a5f3c47911047baae5fdd379a', name: "error" })), h(GuxFormFieldHelp, { key: '4bec11ed658bb83deb9e396338cff69af2c2fdc1', show: !this.hasError && this.hasHelp }, h("slot", { key: 'abdd45619889cdddade102f5589ad0f0168db166', name: "help" })))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-dropdown/gux-form-field-dropdown.js

@@ -99,11 +99,11 @@ export class GuxFormFieldDropdown {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '9020a7db668f3cb5c6ef3db9a230e008ace4bed1', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '52a423218fba63fa959e8563b323e23316da0ea2' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent(this.root, 'help'), this.hasHelp), this.renderText(getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), h(GuxFormFieldVisualLabel, { key: '61d0d48c3ed153d93c4973615b1285dabc474847', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'cf6a6a962503f69bc33bb8fe4dbe633561e29985', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '9d529f92d0fc5977033217a41faf43dcb57bdaf4', variant: this.indicatorMark, required: this.required }), h("slot", { key: '5a93d1502c8337f4037c65fa06870c1244f574ec', name: "label-info" })), h("div", { key: '19ee8d6085059cc637cb46ffee99279c2481ddb8', class: "gux-input-and-error-container" }, h("div", { key: '179346ac87f748081e7a591612f5a69de233e9f1', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '596bb0a9daaafca0972f9a6b85b20f8b934dfe09', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '31ff833828ec9d6ada68a1ed2212762cab337c9f' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent(this.root, 'help'), this.hasHelp), this.renderText(getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), h(GuxFormFieldVisualLabel, { key: '1876dbd7c222526cbd793382c33a4a5cf6313f22', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '57176f9da8cc8e51c9eb8e0e73c8d6b25bd36513', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '2eda5ae93db8bac0f6760fab263b3d3204bc918b', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'f151bbc8a07a7cb3ae1e034c440279f927a5538c', name: "label-info" })), h("div", { key: '341a3ee72c67e6fb6039152bbe4641175c51d0d5', class: "gux-input-and-error-container" }, h("div", { key: 'd49d5d689935c59450b9c45108d476087f1ec769', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("slot", { key: '7a91ec18082348fc7334733f22a36738d74b6d0b' })), h(GuxFormFieldError, { key: 'bb4687aed62b3ba2246967125884897861afdc03', show: this.hasError }, h("slot", { key: '1a7d9292bb9afdfef87cadfd73c042f4ca223ecf', name: "error" })), h(GuxFormFieldHelp, { key: '600311438afad613d07e99aced9b948809b430ae', show: !this.hasError && this.hasHelp }, h("slot", { key: '7590cb2f825a03586d6b4375479cd7c25abbf620', name: "help" })))));
+            } }, h("slot", { key: '7e17c222eeb244ae7c250f47dc58a5bc4ae4ffbb' })), h(GuxFormFieldError, { key: 'dc95fd03d59f87d4664c2eb6f13c5936dd60b945', show: this.hasError }, h("slot", { key: '2dbc4edeb102145a556b910a05413d9b274e6f35', name: "error" })), h(GuxFormFieldHelp, { key: '0e508b39d190fce5609540bb6eaefdaacc887f16', show: !this.hasError && this.hasHelp }, h("slot", { key: '23c6cbd1bef40176dcf070eaea4ba55140094ae1', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-file/gux-form-field-file.js

@@ -102,7 +102,7 @@ export class GuxFormFieldFile {
         return `${type}-${labelPositionVariant}`;
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'c81fbfa48e90ff635a168d726efb0317912e8eec', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'df4978a1e3d8b36f15f6a38194513a4dc3608a38', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'bcb8e39bf89e2a56ae2863d9fdececb28450aa29', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '27fe84a8081016d09788b5f054fa37cda4f5673b', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'faffd8212a5705085e9c279cd8b5dc209bc95b67', name: "label-info" })), h("div", { key: '92e9275b73d2952e66e0409ebc9dbe933b591c1c', class: "gux-input-and-error-container" }, h("slot", { key: '976de47774150f01eab0302f77818917fcc8c5a6', name: "input", onSlotchange: () => this.setInput() }), h(GuxFormFieldError, { key: '73113ae0f0e5447df7466f0cfb77ced4d9177078', show: this.hasError }, h("slot", { key: 'c55abb34569f8e1ac336698613f8846df65a35f7', name: "error" })), h(GuxFormFieldHelp, { key: '89df5ee890bffc28be97e4181e5450bfdb97bd91', show: !this.hasError && this.hasHelp }, h("slot", { key: '0f5a5a4124ae5bfbf8988ecd3710dd66428416cf', name: "help" })))));
+        return (h(GuxFormFieldContainer, { key: 'afbe0d255c886bdb7ef76136ba1a0266ce02928f', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '4150a02f330208c2f79b0e7df5112614ba24b7d3', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '963c1669469579e49ce6702649d1c5469cef7322', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'b5d67f2ba79201a15c885d66ecdf6570b63be400', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'b3531081795eaf2f954dc0e42340986b4b00696a', name: "label-info" })), h("div", { key: '09ac2a78594f80c404297404e535bc10159290b4', class: "gux-input-and-error-container" }, h("slot", { key: 'feccb4c1f2526d8400f2253114573bd159dd3c14', name: "input", onSlotchange: () => this.setInput() }), h(GuxFormFieldError, { key: '5f1191145e144f3ab6da99c66adf1eb578136214', show: this.hasError }, h("slot", { key: '28980350a36385b61fa21f79f71facc4fe953b71', name: "error" })), h(GuxFormFieldHelp, { key: '50eac306bde1f09eed4197bcd8f0767f3aad1ef2', show: !this.hasError && this.hasHelp }, h("slot", { key: '89683766e4e0486175a6e1416d8dc239107720da', name: "help" })))));
     }
     static get is() { return "gux-form-field-file"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-file-beta/components/gux-file-list-item/gux-file-list-item.css

@@ -35,10 +35,10 @@
   color: var(--gse-ui-fileUpload-fileCard-fileName-default);
 }
 .gux-file-list-item .gux-info .gux-indicator[icon-name="fa/circle-check-solid"] {
-  --gse-ui-formControl-label-tooltipTrigger-color: ui.$gse-ui-fileUpload-fileCard-statusIcon-success;
+  --gse-ui-formControl-label-tooltipTrigger-color: var(--gse-ui-fileUpload-fileCard-statusIcon-success);
 }
 .gux-file-list-item .gux-info .gux-indicator[icon-name="fa/hexagon-exclamation-solid"] {
-  --gse-ui-formControl-label-tooltipTrigger-color: ui.$gse-ui-fileUpload-fileCard-statusIcon-error;
+  --gse-ui-formControl-label-tooltipTrigger-color: var(--gse-ui-fileUpload-fileCard-statusIcon-error);
 }
 .gux-file-list-item .gux-info gux-button-slot {
   inline-size: var(--gse-ui-button-dismiss-small-width);

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-file-beta/components/gux-file-list-item/gux-file-list-item.js

@@ -11,11 +11,11 @@ export class GuxFileListItem {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: 'f3728cb6a3f569b8e40e2306f6f352bbf3ba32d3', class: {
+        return (h("div", { key: 'd49c0767377da03e5365273f91a39bad62062500', class: {
                 'gux-file-list-item': true,
                 [`gux-${this.status}`]: true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: 'ab8b83c2c6e544d5061311b15661d823f2dc48da', class: "gux-info" }, h("gux-truncate", { key: '9d43e488a09c57d3b7c6623609b58571d032e79a' }, h("span", { key: '3026f444ac1c121e3a6cbdb5a084217de0eb9fab', class: "gux-file-name" }, this.name)), this.renderStatusIndicator(), this.renderFileRemoveButton()), this.renderAdditionalInfo()));
+            } }, h("div", { key: 'a33471c150928e030a4c05dff3d702588641a1e9', class: "gux-info" }, h("gux-truncate", { key: 'dc3765ded0e84e51262359a7d0bc64ca62dac65d' }, h("span", { key: '6aecdc1894a57119fbecdea686e2e2d5a0a5f6d5', class: "gux-file-name" }, this.name)), this.renderStatusIndicator(), this.renderFileRemoveButton()), this.renderAdditionalInfo()));
     }
     renderStatusIndicator() {
         switch (this.status) {

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-file-beta/gux-form-field-file.js

@@ -91,7 +91,7 @@ export class GuxFormFieldFileBeta {
         (_c = this.multipleObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '8451c2a30bb00d14fad89e1fbb993a1c5058ad5a', labelPosition: "above" }, h(GuxFormFieldLabel, { key: '3dcf64d426c989bb005eddb277411e8bea6b1852', position: "above", required: this.required }, h("slot", { key: '3ea96a58a420162f051ffaeb07cc0e3697cf695a', name: "label" }), h("gux-form-field-label-indicator", { key: '924a17317d4b72fc4c69e5cfb38cf384db936b79', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'b381194dade9716256eb6fab4e52d6916a5c275b', name: "label-info" })), h("div", { key: '6226c9f869e8ecef880151f338bc97fcb55869a4', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: 'ffac960d9eecf25043264127195d89d22d789c79', show: this.hasHelp }, h("slot", { key: 'a11355486ece569db8df0933ac7924792e891ef9', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: '276793d8e2fde30fddcd52ced436aeab2e056c17', show: this.hasError }, h("slot", { key: 'ea31b2604bfc7e070d857659b43badcc70fd3afc', name: "error" })), this.renderFileList())));
+        return (h(GuxFormFieldContainer, { key: 'b9023b70ad5ff7522f61bb41925f5a5ae7b56890', labelPosition: "above" }, h(GuxFormFieldLabel, { key: '351a0f61a4f37ae17336c2235e7ec5e78e8c2f1a', position: "above", required: this.required }, h("slot", { key: 'fabb6eca3ee70511de095f242aaeef09f3bcf189', name: "label" }), h("gux-form-field-label-indicator", { key: 'f9af4d8e81d64c5d1e7d05b4e5ac70519f6e766c', variant: this.indicatorMark, required: this.required }), h("slot", { key: '9fd5f19b6815f393c0b36efb6b1e6a61396c0b0c', name: "label-info" })), h("div", { key: 'a19837c2d873443682fa1908a246456471c4f787', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: 'df5cdae8921bd3f0b47e79249e729d4c76b6600c', show: this.hasHelp }, h("slot", { key: '5ccc21f83e3a012eb863a00ec58e9462ad5ff02e', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: 'bc0c10fde130a357f9e8978ed8b5b5f17de3045b', show: this.hasError }, h("slot", { key: '26456e741cd563033b52ad5cc1f5abf24189d041', name: "error" })), this.renderFileList())));
     }
     setInput() {
         this.input = getSlottedInput(this.root, 'input[type="file"][slot="input"]');

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-number/gux-form-field-number.js

@@ -102,14 +102,14 @@ export class GuxFormFieldNumber {
     }
     render() {
         const showClearButton = this.clearable && this.hasContent && !this.disabled;
-        return (h(GuxFormFieldContainer, { key: 'edb6b56da16df96351ddb058dddb8d9b14e14392', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'f6ea1699ba8db6572769e468fd1c97b8d305f28a', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'cdb3dc75c64bbfcadc13def9dab2d310e392d8fa', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'c49ba227f4d66e5418b0c21f9e7f5c1bb6e48212', variant: this.indicatorMark, required: this.required }), h("slot", { key: '55aa21efa1f278a0e816e5c27ee99ce926dca80b', name: "label-info" })), h("div", { key: '73d9ce4436dd94c458c281ac9a288b6c101cbac9', class: "gux-input-and-error-container" }, h("div", { key: 'ef7d9d1f4e5be99d839ad69b6be888a208eed405', class: {
+        return (h(GuxFormFieldContainer, { key: '7b28edd43bc818d8f1498486c396e7f9f9aee678', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '017d5eeaf123163fc06f3f3da23691ad863c9960', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '0e4ba199221759c31601b3e95dc333fcace3efd5', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'f929df4b73135f282a69cdaab59c7dc21ba5601d', variant: this.indicatorMark, required: this.required }), h("slot", { key: '7422744e0637c50382a085fbf8c23b6ee31549f3', name: "label-info" })), h("div", { key: '06613d1746aca0caa7527a60b37d2fe50056e8a1', class: "gux-input-and-error-container" }, h("div", { key: 'bb85a923c23b32711b277335f361a885644914c9', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            }, part: "input-section" }, h("div", { key: '2611ee74b88f36ea13e737a9ca2628ce239c2723', class: {
+            }, part: "input-section" }, h("div", { key: '0a4119d2dd03b289d96abf142ac49f9e173bf5a2', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-clear': showClearButton
-            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: 'ce295da6ddf992d86bd463ddf8145bdfdfb67788', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { key: '7b2083a27f83ab12bca4dc3f9741029d03ab09eb', onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: 'e319a958a910322f1e5ea30eba226cd50fbf494e', show: this.hasError }, h("slot", { key: '60bbbecb56a2c6e97e85f2a032853f561e946c9c', name: "error" })), h(GuxFormFieldHelp, { key: '33279665977b056a4d17a515cfdfb11b7fd45016', show: !this.hasError && this.hasHelp }, h("slot", { key: 'eb112d1eacfd8b341a8ef72a2e1e4b673f6e6ff9', name: "help" })))));
+            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '024dd3b3d7301fda75af59a9b871f84ebaf11773', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { key: 'ce023e6cc138081233dda3c254e7c330419b4474', onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: '6fd65820dd73e0716a9deda87d083b7dbdf368e4', show: this.hasError }, h("slot", { key: 'a3e0ae95fe2f96d1f6c6938a718a01bb2b422fa3', name: "error" })), h(GuxFormFieldHelp, { key: '9b03426a3901e9e40f8bf78da47939df67ad4b8e', show: !this.hasError && this.hasHelp }, h("slot", { key: '9670369675c0700943a6e9b3c3e66205240fdf0e', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-phone/gux-form-field-phone.js

@@ -95,14 +95,14 @@ export class GuxFormFieldPhone {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '84fb36ddae824e95b57ed1bd01658a94a3b6647b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: 'b9054d4ab45c67a347abcff39f938ce98c93e252' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), h(GuxFormFieldVisualLabel, { key: 'bc002ae72821d78a90bd2c2585908b0e54e08538', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '6e5b2bed76416bbcc247f9263df9f40141c436f8', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '147c97654d5598e45b84f32c3d8a9e3bf794ecca', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'd915277d0a0a7f6ef7b57158f7fd3ef1e3397004', name: "label-info" })), h("div", { key: '20aa48151cd584bb3f932639d2e2c5cf6d0fb1aa', class: "gux-input-and-error-container" }, h("div", { key: '301d5dddcd2557cfabfa637556c8dad695d780e5', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '6d6bb87376f707dcbca3fa8acdb804bc3f27ff8a', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: 'a57866c2b0a2d6e934c85d3ab748651249d8516a' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), h(GuxFormFieldVisualLabel, { key: '96d9d56ff4c3281bf0f12125ebbf35348af38783', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'fa79113bc2e0979feeb863692bc45cb0c8668b4d', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'a41fa1fe3559d93d5eedb1b06230cfe17e95d29b', variant: this.indicatorMark, required: this.required }), h("slot", { key: '920d7aa1dd49ff53efdccfd50f5988880e154348', name: "label-info" })), h("div", { key: '44a4574b847810c6ee309a231a55aad133a9e9c3', class: "gux-input-and-error-container" }, h("div", { key: '335e198d51279ee6ddbc83b0bea4a6a6f72ef705', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '02ceeccbe07de8777c292d5dc6fcfc4243009eef', class: {
+            } }, h("div", { key: '6c0208ba28179b72d39fb1789fa92db0e91a447a', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '2b40a34bfd3da43d81e5ba8b2c98be33a3bb631b' }))), h(GuxFormFieldError, { key: 'defff04d82a5caf40dd2adca0eb74861618a14f9', show: this.hasError }, h("slot", { key: '8bbfb9bf2dc1938027f97c163ce4940d641ff692', name: "error" })), h(GuxFormFieldHelp, { key: '4b9ada38eaffa65c80a24c2e035447f01c04e04a', show: !this.hasError && this.hasHelp }, h("slot", { key: 'bb45642d29768d246dca2ce61e9121cc4aa34206', name: "help" })))));
+            } }, h("slot", { key: '0b45742c85ec5c7fab69a48066e4088536473dc9' }))), h(GuxFormFieldError, { key: '2e2b2af70208bf36133f8e1ec3e0dc887dec1f35', show: this.hasError }, h("slot", { key: 'ffb20ed836f2ff03f9bc1d41b32774cdc4d427b4', name: "error" })), h(GuxFormFieldHelp, { key: '68826c18d750dedecb55929a76cd97f324b02022', show: !this.hasError && this.hasHelp }, h("slot", { key: 'e2befac8788e1cdb6acb815886fa4ea33cf019ab', name: "help" })))));
     }
     renderText(text, condition = false) {
         if (condition) {

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-radio/gux-form-field-radio.js

@@ -46,10 +46,10 @@ export class GuxFormFieldRadio {
         }
     }
     render() {
-        return (h(Host, { key: 'e9b9c79eb41ac2d19d0bcc932f7ec95a199b9903', class: {
+        return (h(Host, { key: '0fc87bd8939fa7756405779b81bab2afc11918b0', class: {
                 'gux-input-error': this.hasError || this.hasGroupError,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '1da2143e7a310bcbc1516e59e15c9b4fd9f26fdd', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '93853b97a827184389f35d5b280d11977c099ca8', class: "gux-input-label" }, h("div", { key: '8f0c0905566540f255a83de16db9a89b3421876a', class: "gux-input" }, h("slot", { key: '946aeb85de8bc850756baf6a60e72dc05eff2de6', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '5b4cdf94ddff3cc059fe5ac76abfa52ca4db01e1', class: "gux-label" }, h("slot", { key: 'aab275c888fc44566fdbeae133e1950addbff70e', name: "label" }))), h("div", { key: '5b06a11563515764b09ce8d66f9c9ed8600f63ba', class: "error-and-help-text" }, h(GuxFormFieldError, { key: 'db447c98e56b06fca8a73c5db54b7a2af8ff0a3c', show: this.hasError }, h("slot", { key: '372a75fe6ac5a8144b5a516049de6d334b4dff44', name: "error" })), h(GuxFormFieldHelp, { key: '1aecda0403524cbf79fa34e572d83d22a9cab2a9', show: !this.hasError && this.hasHelp }, h("slot", { key: '221aae6237ca1072200759a0ee0fe75c0e227e8b', name: "help" }))))));
+            } }, h("div", { key: '3533a71ee0de82b20c4af4563ae1f9f41f8221bf', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '1fb60e41be82ce62401e255123173735cab93405', class: "gux-input-label" }, h("div", { key: 'e8d6805b1317aae71ffaeedf7806329a45aaf506', class: "gux-input" }, h("slot", { key: '95e6be748f354157e1a87b5d6bf5351b9f9296f0', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '1e7a1e337c3cf8664e032650dc21962f47dfba35', class: "gux-label" }, h("slot", { key: '8dcf4029d96767701a5853f16c3abe51c0731b8f', name: "label" }))), h("div", { key: '3c152b4b9b2e0f121df1c6ba9f30e19c71277838', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '8aa688ff3ea75c07dd210e0d4b9e70629db64beb', show: this.hasError }, h("slot", { key: 'd8b4195b2eb40afc8f93678746f8031e3df17b7a', name: "error" })), h(GuxFormFieldHelp, { key: 'dd89a3c1fdf31dba1cd91e39f83f281116bb7d56', show: !this.hasError && this.hasHelp }, h("slot", { key: '7930fafbd92062eaa6a9e7d55bb23bf4ca27f514', name: "help" }))))));
     }
     setInput() {
         this.input = getSlottedInput(this.root, 'input[type="radio"][slot="input"]');

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-radio-group/gux-form-field-radio-group.js

@@ -121,8 +121,8 @@ export class GuxFormFieldRadioGroupBeta {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: 'fad484fb7fa8ec26abc118586b82c66b5952915c', labelPosition: "above", disabled: this.disabled }, h(GuxFormFieldScreenreaderLabel, { key: 'e8446de191e32faf08297a3baaa710caceda7290' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), h(GuxFormFieldVisualLabel, { key: 'ee8f1870612c16fd90dfa7ae69155abdd0768013', position: "above", required: this.required }, h("slot", { key: '6b20419b25b7b7381740834b42d6f057db18ad2a', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'de00848bbb489b3db197dfd92328940f529cc85c', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'd1bd07ac555ca287b40a850458b212f0ea13728d', name: "group-label-info" })), h("slot", { key: '525f68e3742ae671bdf928c8578581893eddca07' }), h(GuxFormFieldError, { key: '46e74e1785062aab209be58ac7a34d4f9041353f', show: this.hasGroupError }, h("slot", { key: '41824728fe7ae908f4428147f3f3696c7d139c5e', name: "group-error" })), h(GuxFormFieldHelp, { key: '1e3c4ab5237c81ed55d6d075f5d0c6983c04dbd7', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: 'b89ae47b91befcb31fbca744ea3a5768ffe40060', name: "group-help" }))));
+        return (h(GuxFormFieldFieldsetContainer, { key: 'b48e98393a2f14f772c9ebbae8819e33b6761013', labelPosition: "above", disabled: this.disabled }, h(GuxFormFieldScreenreaderLabel, { key: '41e06e4fbf992e7eda41e94995dbab1e4b5aeede' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), h(GuxFormFieldVisualLabel, { key: '37f4c6a4366d0791612bd2e2ba1e323b9e003104', position: "above", required: this.required }, h("slot", { key: '5cb0627366019750c9e44ef14e21d57e34af0cb7', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '04f3c53e0c5589cc8f97d8a25eb242ce14b87cdb', variant: this.indicatorMark, required: this.required }), h("slot", { key: '64ba1ac4e0e02df1ca97958656b0efab3909b40b', name: "group-label-info" })), h("slot", { key: 'd29d92c2a46559a11265bf074145578c685b090c' }), h(GuxFormFieldError, { key: '80a102f2762fbffc31f11dbea75f26c12f59749c', show: this.hasGroupError }, h("slot", { key: 'c3679a1330676e89b32f6d867338a1e46a59c6e6', name: "group-error" })), h(GuxFormFieldHelp, { key: '8e922cb4385a18798336ca4f93d9ac18e464b339', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: '4d43e0a2de8711ac7c7ece2a0489414303b6cb9d', name: "group-help" }))));
     }
     setLabel() {
         this.label = this.root.querySelector('label[slot="group-label"]');

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-range/gux-form-field-range.js

@@ -111,9 +111,9 @@ export class GuxFormFieldRange {
         clearInterval(this.valueWatcherId);
     }
     render() {
-        return (h(Host, { key: '704aa9e8e576207449de82b964c9b3d25b921914', class: {
+        return (h(Host, { key: '353cb39fef8b4b878ce5e7eff30d2e8c7e8bc2fb', class: {
                 'gux-active': this.active
-            } }, h(GuxFormFieldContainer, { key: 'a6a6b949bde45af0deb032e32bb40656e347c745', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '1d49479d7ffa693dffdfe2198d14e542a165ee1c', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'c556f745745618de8e456287f7bf554cc317b450', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '879302e5c9f9525d9a7d77dc1cce1e169d5f96a3', variant: this.indicatorMark, required: this.required }), h("slot", { key: '07981edbf4a7c9cb5da907c969857709a3a7d720', name: "label-info" })), h("div", { key: '19c858be378a68cfeb1a62adb01f59877168385c', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: 'f7031aafcec8679dbf0c848d052735a557bff3ea', show: this.hasError }, h("slot", { key: '5def458db570387d21ab82be06d4fab06b262ac1', name: "error" })), h(GuxFormFieldHelp, { key: '0f8c192c8f5b3f4cb3ec3af98d96dd8dea796cbf', show: !this.hasError && this.hasHelp }, h("slot", { key: '44f652b4b0a8b468569165737db0faae3f3a25bc', name: "help" }))))));
+            } }, h(GuxFormFieldContainer, { key: 'a320c1345b2d62bd16a39295b5b46631615a2597', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '4bff0c5785ef63dd26f7e0b29345b959bcef96f1', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '8ae21786e3e36efe888c4c3947933a4d754ae979', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '6bf840d6f663c0537ffc280b8d32f9b18061f8cd', variant: this.indicatorMark, required: this.required }), h("slot", { key: '75c733ba873e04a0dd22e95cbd1c00e4bf807136', name: "label-info" })), h("div", { key: '18ead08a1a523583561b40a3015cd84def405ec3', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: '38be771dcf052017eb3632303c31a20c960802e1', show: this.hasError }, h("slot", { key: 'd57861be4cd0021fe3d6d8483bc7d68c6dde210d', name: "error" })), h(GuxFormFieldHelp, { key: '29244b6b046284637a7f3fb7b55c8b07f56c9f96', show: !this.hasError && this.hasHelp }, h("slot", { key: 'e55bef0ad84834ed1f63dd988f73f57a69e2e23a', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-search/gux-form-field-search.js

@@ -96,13 +96,13 @@ export class GuxFormFieldSearch {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '8a63dea595a1c5d42dcb4cd8facc9d460a9e5a1b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'cfd0eec1ecf20523561684958daa1f6acf972caa', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'a3aaeff0832e5a64d1df1117d740c278c9c272af', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '70fe33bfb767af9d906cedcc9ce9ee60ca747af8', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'a56375db0f57772478adc032a6098545abef2a19', name: "label-info" })), h("div", { key: 'c018d09f0cec6cca6986fc5e3dbe3d2ed110e1cd', class: "gux-input-and-error-container" }, h("div", { key: '612e3730ffec8c4e2c6cd1a99f6b236f7f4c3294', class: {
+        return (h(GuxFormFieldContainer, { key: 'f694f1398fd3bdda4d7b2b22b4758974b15c5606', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'a5918e90d78c73f16db3edefda88f95031f33337', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'b0d8641d120e52aa48bfdecb95b792cbabcbbf45', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '0c0ae13e161f8f47e127ba291ed71d89d1e2838b', variant: this.indicatorMark, required: this.required }), h("slot", { key: '032d213a879df04ceb54497924bba6bc1a4a5030', name: "label-info" })), h("div", { key: 'b0420d94346a7486787e78490712df4458feaa00', class: "gux-input-and-error-container" }, h("div", { key: '5e8694f49e46e8dcd81c7c6746de07e0c264beb1', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '4484c395ec89c16ea0e431ce4ba40c7f12f07f4c', class: {
+            } }, h("div", { key: 'd46b8936acf4f3a48c76681d482e9447fea2ca01', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            }, onClick: () => focusInputElement(this.input) }, h("gux-icon", { key: 'fc268ba929820ea0cb29914dc49dfc6a2ca65128', "icon-name": "fa/magnifying-glass-regular", decorative: true, size: "small" }), h("slot", { key: '7454d1c6c2bdce9896dc23bc146186da366fcc2a', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: 'f503f5d0aa5b2ec5528002b88364eab21e698824', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'bbc51e468617a53ac4e6765ca62b5b4a3c9f4d56', show: this.hasError }, h("slot", { key: '694a574192897e77f2ddee09372e79918625e835', name: "error" })), h(GuxFormFieldHelp, { key: 'b790d4a1238ca6d77415785f8c98c0fba45143eb', show: !this.hasError && this.hasHelp }, h("slot", { key: '710ab2c334609e1d6d803046a08e25abf3e6ce6a', name: "help" })))));
+            }, onClick: () => focusInputElement(this.input) }, h("gux-icon", { key: 'a74dea834e231496b6f77fd843bc08f072456fd0', "icon-name": "fa/magnifying-glass-regular", decorative: true, size: "small" }), h("slot", { key: '66a603d2c99990ee3504fc289b60a444b99d8d12', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: '11fbe39fda16ceb8480e6c0b33949d31b632c80c', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'd2c504dc5617d304072ee0e978d029f317388674', show: this.hasError }, h("slot", { key: '1084f35eb84ef867a6c7bb077b4bdf54a2ac0399', name: "error" })), h(GuxFormFieldHelp, { key: 'e65e0a4c18d32bc2cb9e162dbe08b45eb33989f6', show: !this.hasError && this.hasHelp }, h("slot", { key: '5a966108930eae25e0f3946058c6685ed82b6b67', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-select/gux-form-field-select.js

@@ -86,13 +86,13 @@ export class GuxFormFieldSelect {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'b6ce224a4b33a6a2d3a950494d34ae3844e9c0a7', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '01336b42268cbe502fb800dcaf5e7b18c1c200b6', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'b08d39ff081c8bf5b832874738ebc3cdbb944ff4', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '96a20d06e3ead1697adb52cdd0ccfb71bdb7be66', variant: this.indicatorMark, required: this.required }), h("slot", { key: '68a80e71e4ca4e92c0fe6d1e00fedda401c1e3b3', name: "label-info" })), h("div", { key: '4d45d92191e7054e2540bd27ced7c19d2adc4be8', class: "gux-input-and-error-container" }, h("div", { key: '95df686d8f03b2dd4e22a4e9703ad8c96558ea85', class: {
+        return (h(GuxFormFieldContainer, { key: '0ec716077e334ca13a6186d3e959b1f869503cd0', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '9c4f336b0fdfe4e2e3cec1eb33826ea63dbb71b8', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '123da25e2f802afe26d895bfb31c7a4255047b68', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '102a4e30c5022418acdbc811f9727dd09109f1ff', variant: this.indicatorMark, required: this.required }), h("slot", { key: '27006a1e4a743888007b59892d85925443573372', name: "label-info" })), h("div", { key: '5c20c687b71a90484521e83fc2ea4724e025dfec', class: "gux-input-and-error-container" }, h("div", { key: 'fd0350980b91f744e7d7d58e3e1bcc1f9775d754', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '25ecbf15b554772fbb9b49d85c1bd11dab27471b', class: {
+            } }, h("div", { key: '95a941eb1f373a096c9ba7e0962cd37f6ea171c4', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '62a0c05ec3535f0e7b34194ea219c482e4f2c0e7', name: "input" }), h("gux-icon", { key: '9de257807857681d39181e538ceaff0446fc818b', "icon-name": "custom/chevron-down-small-regular", decorative: true, size: "small" }))), h(GuxFormFieldError, { key: '7dfe214d32e27283fcfc5b66104e4ae8b98fce74', show: this.hasError }, h("slot", { key: '502d6075ab0b2d19bffec4563f737ea9ed77feed', name: "error" })), h(GuxFormFieldHelp, { key: '14a7b1a64d1b6d25f531cd9b3d08316742510c2d', show: !this.hasError && this.hasHelp }, h("slot", { key: '543d618d86f2a83229ef0fe0489c9f5ead55baea', name: "help" })))));
+            } }, h("slot", { key: 'cdb69f55dd0ca3ea03ba4fb5c0f4c64ef2ca8b09', name: "input" }), h("gux-icon", { key: 'a76ff8b0e2fc54acc82508612553ba560d71bb49', "icon-name": "custom/chevron-down-small-regular", decorative: true, size: "small" }))), h(GuxFormFieldError, { key: '1a5b480eb5f43d5784654d3f0ec4024dc644fa12', show: this.hasError }, h("slot", { key: '65862b15656a9d61006cc9e6b5d4b5cde1042f2b', name: "error" })), h(GuxFormFieldHelp, { key: 'b7fa9f77b3626e6226c4f55857f151f44c109e37', show: !this.hasError && this.hasHelp }, h("slot", { key: 'd23ec6e6f93d7e6110e7e1fadb22d36ff67846a0', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-text-like/gux-form-field-text-like.js

@@ -111,15 +111,15 @@ export class GuxFormFieldTextLike {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '6e268f9b2f5cdefcf05f51b95bbdabfc7f90a58b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '8da38ac30c89cc7f4a6d7a9ca95096622354f786', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'f4f8cb4dd7165fab77df91759603cf2a67b9d967', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'b742165e6f2ae4bae2527cf2e23fc02793ae8b92', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'c86c3d5580a44bfc070d801f85797333c68340df', name: "label-info" })), h("div", { key: '97a46a9562bf08388684e4c13781cbc67ffa00b4', class: "gux-input-and-error-container" }, h("div", { key: 'faa6d68074db30e416db0f0712467e10322d5551', class: {
+        return (h(GuxFormFieldContainer, { key: '2c26c044afa4fe0fc89c66d6d810800e847425f8', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '793a39d42bbc5b9b42c9598f2e67f8c8f2e41cd1', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '4727e8347e3b607891a4c5117ba9ca9d86b1fc89', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '10a619b84c488418394c810463fd738f364c9418', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'b4aa4dbb29075476b84ccffc375a4b6932b02ae5', name: "label-info" })), h("div", { key: 'a02fe33f1ad823c7e23d0c3932f72e0833c8d0d9', class: "gux-input-and-error-container" }, h("div", { key: '648d2bae9cd932fcf700784b7d5903b446d50815', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'f29ddc3ae15dab4002423197ce745426a9b81989', class: {
+            } }, h("div", { key: '97d46f61b778fb08cca7a397cb4264894d128a1a', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-has-prefix': this.hasPrefix,
                 'gux-has-suffix': this.hasSuffix
-            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '159068cc7389df4caa747e849b3443b6a8e68525', name: "prefix" }), h("slot", { key: 'a1a529019ed80868047a04eeade0257efafff654', name: "input" }), this.renderRadialLoading(), h("slot", { key: 'ed703884556dd9302248d1c3a25fcb8bed8ac661', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: '7f47627751268f2703b3246884ecf1ba4a719cb6', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '243eba4b6bb5dbfba50e68b376f9df5dd1352e72', show: this.hasError }, h("slot", { key: '77f90dec9b23318b005379b5c35c66b922b3c6bb', name: "error" })), h(GuxFormFieldHelp, { key: '48da44761dc115f5f1f451a7a61f338098ea0e93', show: !this.hasError && this.hasHelp }, h("slot", { key: '4355d3580e354d94639d8ceeaf0d862172bb0fb7', name: "help" })))));
+            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '8ea8a1a08250fb40cfff761f9d109a28e7672879', name: "prefix" }), h("slot", { key: '4f3407d94f2d1d51ed50b1f40f184a3ad3392fb3', name: "input" }), this.renderRadialLoading(), h("slot", { key: 'd437a21d3c67d86b0538b229a283684f621fcc67', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: '3e74257a9681cd8f15816a584cb8237ca7fbf18f', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '4047ae32297fb17d702074b7490992f674789fd9', show: this.hasError }, h("slot", { key: 'af7ff17fbae6dba561aa59234b616aa94eadc7cb', name: "error" })), h(GuxFormFieldHelp, { key: '78b2fb8e712dd97563ec1d7937fb19bf5c691d40', show: !this.hasError && this.hasHelp }, h("slot", { key: '0cfffb19d5ef2da8031c3ddb51fefb1341d6b42b', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition