genesys-spark-components 4.187.1 → 4.188.0

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: '4d9630ede06fb0989481b0f589def995c272d4a4', class: {
+        return (h(Host, { key: '5f3785649f75c7a2e2638548b05d55024cd80c38', class: {
                 'gux-input-error': this.hasError || this.hasGroupError,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '092cf0d03dcfec769c442a2ae0ae839fd51e23a0', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: 'a70e4938842857fa1197e0e27fde900531931c53', class: "gux-input-label" }, h("div", { key: '56a26456c1874e6b95e8a9bcebd24ad00c81cba3', class: "gux-input" }, h("slot", { key: '1977afce7fe112fa5fd9fffdd932b0e9726463d7', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: 'a2c123ddbe72a247009b57f3165db8b5999a8df4', class: `gux-label-${this.labelPosition}`, "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: '7953cee6f008f3b4e7d5b26efe0055447c21d48d', name: "label" }))), h("div", { key: 'fc6601d65352a4c5b3c51cb868f38272950808e2', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '3a41894d1e687f8349caf6ce97e5db98dc85156a', show: this.hasError }, h("slot", { key: 'c7c0c4b9c87e86ccf49c1f0f88e53b7f7bb3ddf8', name: "error" })), h(GuxFormFieldHelp, { key: '40d43775a46cbc809b4f9ec1cee434a3f033924b', show: !this.hasError && this.hasHelp }, h("slot", { key: '7285032fe39638e54f10166670f0262103b41866', name: "help" }))))));
+            } }, h("div", { key: '7a1c8456e16e188895d1b43e075030fc8a7562fb', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '17f6993bf2c457c397a33df428d835942f2a6f44', class: "gux-input-label" }, h("div", { key: '4eeca51ec3a6fcf71b7b646c476f8353c6aaf750', class: "gux-input" }, h("slot", { key: '7bca8844ad94595d9e59ad17d7f9d20697b598d6', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '8250484b80ade7447d156cbf69971c15ad4ec92d', class: `gux-label-${this.labelPosition}`, "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: '8d86952fd4f5f9ed72cb24cfccecd8eee04682dd', name: "label" }))), h("div", { key: 'a481af37f9cb672bbdb2a58c56f85dfbffa1f42f', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '8db617175bdb15e6176df86da61fe8d859ca8859', show: this.hasError }, h("slot", { key: 'ef8a5d0379f6f35676bdabee5ece0fc516638c06', name: "error" })), h(GuxFormFieldHelp, { key: '7721d0b1c62d3741134693034822a5546c048c62', show: !this.hasError && this.hasHelp }, h("slot", { key: 'e00bd909e58a0de48e030f4526ab4cf7b93e0ee6', 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: '399d41ad13dd4ed186f354287c59c6729b5e3ef9', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: '762b773f81ce1403e6f2791df8266f5691c653c5' }, (_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: '3bbc293ac496b877d5d147bba7189e3158b5d0ad', position: "above", required: this.required }, h("slot", { key: '25a3b6493e4a9c921950fc08383cb640f639e3f0', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'dcfd98494e6eca217d14b89a63d3bb86d9fe3dfb', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ed183232ef0880790e62d650f83221b049dc6abd', name: "group-label-info" })), h("slot", { key: 'eb50a04b9990f406807d59d0d1b18dbe3f54e305', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: 'e049cf31ede4b3bc76b99e0afe635ca8b9a18ee6', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: 'b066d0fd7c0a67ebc26b98e9fc4f7b8c54e2ab9e', show: this.hasGroupError }, h("slot", { key: 'b11e8bcd41dd40908f09662914e70133168abdd4', name: "group-error" })), h(GuxFormFieldHelp, { key: '34f97f6c1f1a7f22f4f450fc5f6cf2e5aa3f014f', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: 'fac350ea567fdd8ce10d70bed481cd5b6d8caff2', name: "group-help" }))));
+        return (h(GuxFormFieldFieldsetContainer, { key: '39d089b1a29281e4548047282d0c21ced0664238', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: '1dc0f41fcf3f05bf44c3527b1ca837b39b7ae75e' }, (_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: 'ff0df059eedea0671156605427e5e6ae53db86a9', position: "above", required: this.required }, h("slot", { key: '42cdb1d413e349e40757f61cf5a901897b1c64c0', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '96e6c9fcfa22513d122d09a22855d549f3c2e5f8', variant: this.indicatorMark, required: this.required }), h("slot", { key: '6959da0cdd600fc35a202238693fcffeedb5dba5', name: "group-label-info" })), h("slot", { key: 'e6ec34d9152b1cb78454dd62dce3bc1f8396f9ed', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: '06ffdaf1284b74a6350ce91cdd420c18d3015287', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: 'd0a1f5fafa32b6be3c55c9c18e3909136331b661', show: this.hasGroupError }, h("slot", { key: '773cba21d4b1131425cc1875b6e36da27feeb053', name: "group-error" })), h(GuxFormFieldHelp, { key: '94ba36e3faf7603179706bb2cb3937310e1d27e2', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: '7d816fdd3f3fa7a4a209da146a55645cc0cb635d', 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

@@ -88,13 +88,13 @@ export class GuxFormFieldColor {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'b0dff68fe51e564a03de305463201bda9b0e6a02', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '63047e23a939942a6c8c052b304c4e9c97f05ecd', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '3dc3778704883f80e9c9095bff6e9eeb44b9b557', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'dc90b7fa687fde89265ce7f831aa0dc203bb5260', variant: this.indicatorMark, required: this.required }), h("slot", { key: '0985e952104b7b4eb671d7e2d8694cba80de5d2d', name: "label-info" })), h("div", { key: '3dbdee93b27211f1cdadf3cabb8b41ed9c651105', class: "gux-input-and-error-container" }, h("div", { key: '1c93f6789571d4015631cd45bcd137333316c116', class: {
+        return (h(GuxFormFieldContainer, { key: 'ad5e3507b19363da0013dec594572db85875e92c', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'fa6da12edc56db3ac2712630135c1e3760ab5760', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'ebdf3ac3cefeb5b917601564fbf1bd004b045f9e', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '227f23f679f9f263a909afb47114f27d85fa7455', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'e86b485705cfe0593ef907cf924efb083716f702', name: "label-info" })), h("div", { key: '744e7c8e61469efcaed3551339bcfeea5112aa9e', class: "gux-input-and-error-container" }, h("div", { key: '3d29474352a8110976c82499b913a85868255cb6', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '18d1bbbaf82b756aa81a0412da7ea6ab1eb4a420', class: {
+            } }, h("div", { key: '42d5c9b830926af6b5a9774b225d984fd44e16d6', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '7f8a5b88d5f593a05d272c69deebbf57ecb46139', name: "input", onSlotchange: () => this.setInput() }))), h(GuxFormFieldError, { key: 'b457a9c40422980f9f3f82b28ac8e5bbdfa286ef', show: this.hasError }, h("slot", { key: 'c46ba6ed3a74062df00e9c15ac0c1ddab1df7351', name: "error" })), h(GuxFormFieldHelp, { key: '166ad2fbd5e9a4e52da024143686f86acd6a49bc', show: !this.hasError && this.hasHelp }, h("slot", { key: '4c9ff51d12dd65b521cad5fda710a1463f534a93', name: "help" })))));
+            } }, h("slot", { key: '3e66617a006fc577dfa7d36b9ac11cd9d91775e6', name: "input", onSlotchange: () => this.setInput() }))), h(GuxFormFieldError, { key: '237a375286d99b1cfb1c097672f36508f42d80ec', show: this.hasError }, h("slot", { key: 'a5f54be3d51be6cc967ca6af6671546183b44ce1', name: "error" })), h(GuxFormFieldHelp, { key: 'a389ea72e7f7af73d0a8c614e584211a4b20c4b1', show: !this.hasError && this.hasHelp }, h("slot", { key: 'f9a6298f22871598ca89d317fa76162b3a6eed5a', 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

@@ -102,11 +102,11 @@ export class GuxFormFieldDropdown {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '95cf0334aae89c2b185512975a3caa46b616f319', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '17a7d9db1d359d99b375e659d74e8ee198fead89' }, (_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: 'e0c6290b8960073a60caed07a95761b489572569', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '093143723c654b514a86d9ba11bdd669343e678a', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'b5c53840b29e7edb7016fd655ef325af5c4613c8', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ad3d8db913a2054061a2cf17e55221e8f547df6f', name: "label-info" })), h("div", { key: 'b9d47e7fd0f101bd2bf50d7d8a5aaf5560d4a7d3', class: "gux-input-and-error-container" }, h("div", { key: '5f924b84c374f4eab9a5af090faa0b6dd5c0ae96', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: 'c55506028075010580036cf430008af29b73b2a0', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '40b6eb605168484203272a582c504f9b8a7c9425' }, (_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: '4604a5488d1f73dee58fa9da4a66d847fa612e07', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '6fdb7a2dd39f243fe3732773e82fc64d63a6cffa', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'e334bb065680c63c8cd10797d3e4f070eec332fa', variant: this.indicatorMark, required: this.required }), h("slot", { key: '7485b99a3d4163858479c0b92df2f0f58a72af91', name: "label-info" })), h("div", { key: '84566ab5a944b5267274f09bb3fc50a5a1d63ab7', class: "gux-input-and-error-container" }, h("div", { key: '28ade6dff038c4d9ab63baf834bb2ad150e4de32', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("slot", { key: 'e38e6e5580339bd8124d850064478838ed91fd4f' })), h(GuxFormFieldError, { key: 'f59489537e647d013f7cbb29765edc9f233126e8', show: this.hasError }, h("slot", { key: 'b238051d5d4c804cdd2bd80ab039c285a51cd24b', name: "error" })), h(GuxFormFieldHelp, { key: '49f27c2c46e71f7708fde91c35562a836f1dc9f2', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ead90e5f779f712ea1156e111b543e733e949eb2', name: "help" })))));
+            } }, h("slot", { key: 'dd6e549d5c284aeaaa69345ad036bfab7a059e8f' })), h(GuxFormFieldError, { key: '388ad2e687697ea0cecf9b6010c4a69371c2d16f', show: this.hasError }, h("slot", { key: '1553e292accc1072a74f267f315641f3832ce18c', name: "error" })), h(GuxFormFieldHelp, { key: '2f79e47073f8359740087f34bc3d01d0b8b240b2', show: !this.hasError && this.hasHelp }, h("slot", { key: '85976402223662223286dc862b6d6b3d202ef374', 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

@@ -105,7 +105,7 @@ export class GuxFormFieldFile {
         return `${type}-${labelPositionVariant}`;
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '87fd01d5f4f842e4a60a3fd8903b1f47a25fa87c', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '768146a270b2f9c795818e50eb346e9ef4c0f18e', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '41d509f25e61218e8ff44205e0066efc9871c48b', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'b18a6439eb3e331eadc8befe7d4a6625e5a2fe78', variant: this.indicatorMark, required: this.required }), h("slot", { key: '019080783c0879090b3b20df3c34a82fee01366f', name: "label-info" })), h("div", { key: '09756ffd657327ec2bc2a8ae5e39b2a5cf33ecda', class: "gux-input-and-error-container" }, h("slot", { key: 'ff1bffdc217f9eff4caead89b0ec19179e9c0669', name: "input", onSlotchange: () => this.setInput() }), h(GuxFormFieldError, { key: '7623a79ff314b2286cdcf03c00e964e317627414', show: this.hasError }, h("slot", { key: '1b29ff15208bec388a11900e21f81e5b60300211', name: "error" })), h(GuxFormFieldHelp, { key: '4fc70bf6a7764f229f4a46bba5cf4ec3e0f5394a', show: !this.hasError && this.hasHelp }, h("slot", { key: '42030254f9c567f2b9aa7aaee0a5458cb08583d7', name: "help" })))));
+        return (h(GuxFormFieldContainer, { key: '0388360b8ffd364cb113edad7bbd2cd417aa0738', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '0eea04bc0700ff76a37dfc1d8c642bb319cc7583', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '1fe4e4f8f9e178b4db023452c8fef586c20fd639', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '850a5ea4ea31aed7ec8a2d24b97833e0c6651d87', variant: this.indicatorMark, required: this.required }), h("slot", { key: '90e0fc3ab8cb27d1b907f41fcfdfe53d73512d68', name: "label-info" })), h("div", { key: '9cbc089ee1182d873a4da96c77a03a8fba01f0fc', class: "gux-input-and-error-container" }, h("slot", { key: '2fdaacde8ab249e618b86072e66dd291c4790157', name: "input", onSlotchange: () => this.setInput() }), h(GuxFormFieldError, { key: '3f6e546494f001ee6dddef3c3bf65837939e4fc4', show: this.hasError }, h("slot", { key: '547e941bb527ef5c23e68170fdbf584307ae107b', name: "error" })), h(GuxFormFieldHelp, { key: '49565bfbe9981f787951385891f2aafbbcf55684', show: !this.hasError && this.hasHelp }, h("slot", { key: '9d46b39b1296b7d9a2248f51df19bdc42f036bf3', 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.js

@@ -11,11 +11,11 @@ export class GuxFileListItem {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: '09ee5fd05bcb70aafea251c390baa7a5a8d3a784', class: {
+        return (h("div", { key: 'c92ad88787a05315f94720369e9e3489c9cce64a', class: {
                 'gux-file-list-item': true,
                 [`gux-${this.status}`]: true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '7ac3f917cb8060f4beff69db1b287caad6967d7c', class: "gux-info" }, h("gux-truncate", { key: '270073a4d92044a3730ab8215f7a02d2ce06b7d3' }, h("span", { key: '87dc4ff844480d7ee736d2f77b9161e4152bdfd6', class: "gux-file-name" }, this.name)), this.renderStatusIndicator(), this.renderFileRemoveButton()), this.renderAdditionalInfo()));
+            } }, h("div", { key: '2d7b6ca9ab12d2adb75aa72ad233d4b9954000b9', class: "gux-info" }, h("gux-truncate", { key: '9126db2eedd2a9e26f37f28e1546348bb5375f91' }, h("span", { key: '27e75690e5ede1b2309f79dc02ec12f854ab4e9a', 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

@@ -94,7 +94,7 @@ export class GuxFormFieldFileBeta {
         (_c = this.multipleObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '08375562c5f4fccba27ae887e75286a0c8316209', labelPosition: "above" }, h(GuxFormFieldLabel, { key: '2da1a8ccfb6fb0ffad13d6b7e17eb8c006ec3fec', position: "above", required: this.required }, h("slot", { key: '86c7bf4b43eac86d082075326f247da876690128', name: "label" }), h("gux-form-field-label-indicator", { key: '13ff56e6483c61e4f698c69a51adb0e8d37b4929', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'a23675a2164c4080677980f3d6aa55ea1b05c163', name: "label-info" })), h("div", { key: '269ea5528a86db45b366c8f6f0528aeeb6636ba0', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: 'e1afa7df59e08f6820097d88fbe542e7ddbfcb09', show: this.hasHelp }, h("slot", { key: '176674d3b557f621f8c28d67fc7d8843be91623c', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: '4dd69a7d5c0c9dbfe3129c24773d6efdc082d35b', show: this.hasError }, h("slot", { key: '4ac9a75500eb2fde0de2809718dd02f16c2eaf3f', name: "error" })), this.renderFileList())));
+        return (h(GuxFormFieldContainer, { key: 'e6168b89ec2e7e319eafd52f850440c7c8611baf', labelPosition: "above" }, h(GuxFormFieldLabel, { key: 'c43bbd379ce7088f1b229e0759aeb650e540e749', position: "above", required: this.required }, h("slot", { key: '076818f70f0b4d576d0c29c589d65365f9922196', name: "label" }), h("gux-form-field-label-indicator", { key: '8d40c98ce91d58f80ee19a0f2cc56a8b7b0da22b', variant: this.indicatorMark, required: this.required }), h("slot", { key: '5a55650d45ff8d7867e5a5137d4da1c5d971405d', name: "label-info" })), h("div", { key: '89117ae5350897d66668b85b49c5253b4c714881', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: '7951b8ff1b3cbedaec1616cd0d3e9c93cb0e0274', show: this.hasHelp }, h("slot", { key: 'e47262515b64ccdf3f76b79afbbba7f653636cd9', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: '4504a6087b27a3d7e42251a17974a7bc2985a4ca', show: this.hasError }, h("slot", { key: '7b80111adbbc9febb6f4b3446c60fa040d5b17ba', 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

@@ -105,14 +105,14 @@ export class GuxFormFieldNumber {
     }
     render() {
         const showClearButton = this.clearable && this.hasContent && !this.disabled;
-        return (h(GuxFormFieldContainer, { key: '137a3979f9996ba04d92dd420167dd84d8bd678b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '7d5bf5c68f8537a328d7c1b8e7a2c366cdce2128', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '102f722e3e88f68a49e11133c227c892032a28cf', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'd88bf90fa98f018248a28f08ed9e217466ddce18', variant: this.indicatorMark, required: this.required }), h("slot", { key: '37df5a0dd779d9da8cf3b60f84d5e52115e1fa46', name: "label-info" })), h("div", { key: '5937c320d96258cde309337a7e055d42790b54fb', class: "gux-input-and-error-container" }, h("div", { key: 'd8391d88ec67783d1259f2e4942392db97e67904', class: {
+        return (h(GuxFormFieldContainer, { key: '1e07c3f124e8707f6261b4df25690d812c9c7dd1', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'c4d3286b441ffc8b976ecab571420ef3f9f5731a', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'dd3eb099e1b96030198fa1d5980327b9b37372b9', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '9299e783143e6d5d3ed8e2654f388182bceecd09', variant: this.indicatorMark, required: this.required }), h("slot", { key: '26742f9f77b85ec871c12b8069d188685b1c1bd6', name: "label-info" })), h("div", { key: 'f76998d3d2b4f6cd9ecc21be8283a07dad189f0c', class: "gux-input-and-error-container" }, h("div", { key: 'db694b9aa71dfae2b1ac0df8988838f9c44ff559', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            }, part: "input-section" }, h("div", { key: 'ab857c5c2c6e1123c881ac599a508554ce6b4b7c', class: {
+            }, part: "input-section" }, h("div", { key: 'e10e9afd527017c32e2784409c6fba2211cf099f', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-clear': showClearButton
-            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '92c76a08f4e0cce0f905c06451e4c08c208813e6', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { key: '958fb87df1cb20157aaa4238422bc1e957ebd830', onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: '73894cf0dd8900be644733ace75042f75db6f8da', show: this.hasError }, h("slot", { key: 'abf56087a30c56684cd3992365f9d1bd6be9129b', name: "error" })), h(GuxFormFieldHelp, { key: 'a9d02d2ae53c77fd0866b60ab1f88addf9c42673', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ce70b5209a863db0f86ebe207e0cce4c9bc34f31', name: "help" })))));
+            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '6850be66b8b17f1c2cf0c4f7328aebcf3ba30690', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { key: 'c74281f4423eda417f7c79380d6dde369a2af1e7', onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: 'f28cc3e3fb7e49fd1da638376046d2d1fcfe051c', show: this.hasError }, h("slot", { key: '92a20e2c9b9c8988b86b3bf84f7ed3ee53504940', name: "error" })), h(GuxFormFieldHelp, { key: '884b1ccd768b8da7ab2de002c323dc768ca56160', show: !this.hasError && this.hasHelp }, h("slot", { key: 'cc86c01124eb1c7975649d1c2d516bd8193f52f6', 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

@@ -98,14 +98,14 @@ export class GuxFormFieldPhone {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '6ea123b795f941d395a7c1d7e8248c8184635f9d', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: 'e35180713387b8b87a982794b63cf5197749b05f' }, (_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: '0128e7171270e19de005c0a96111aeac91c87a87', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'e2e1ed9d712606fe4346ea71b1deb5156afc9362', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '400be36b93fcc6631d8daa566e7ba5cc60da27b4', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'b2141b31fea069c1bb53e09f6e94c7fcac247248', name: "label-info" })), h("div", { key: '0368025904483b8dd6e1d8eb9ed09b90c2fcc585', class: "gux-input-and-error-container" }, h("div", { key: '65f23143dcafc6e43a7f015cd17a129c5cbeaf9b', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '613378ec2b9693daa0d18c873bd38194adcc8d4a', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '714b94c9baea910a5557478a175af7b484d419f4' }, (_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: 'f5cd6e7de34d23b88af5a5c28d7249e1d3cc9ca5', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'dd43169118d9b259d1e264393e00d25ea21345f9', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '61b7d9650aa32bc485eec34b7b2c96dca71bbc39', variant: this.indicatorMark, required: this.required }), h("slot", { key: '3f159b032cc9ac1a8592d1e8c7a46c8f01a02ed4', name: "label-info" })), h("div", { key: 'a255777cea26f2ebc3584c008fdef471470979b7', class: "gux-input-and-error-container" }, h("div", { key: 'a3efa67c24b78802d2eda00d5d18e19104c537aa', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'dc607e41a5778de6e0d13b6a68234d3cd62d3c76', class: {
+            } }, h("div", { key: '24f51dd5ce104bba05b99dbec535787f38605e9c', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: 'b72d8f134d6ad1ae8f385bf5463975682dfcf2cb' }))), h(GuxFormFieldError, { key: '47a516a955b5ea38ac3958bf7ec088819ae6a627', show: this.hasError }, h("slot", { key: 'f010fbaca29bdb66305ef43898b0166c75dc1b31', name: "error" })), h(GuxFormFieldHelp, { key: '69d4e91c95728faa37a37305688d3cda67baa9d2', show: !this.hasError && this.hasHelp }, h("slot", { key: '42b6207240a081af47c1be54b0d9e9a46fbe6c1b', name: "help" })))));
+            } }, h("slot", { key: 'b113dede3ddca50431087a10f334a68fa42c3705' }))), h(GuxFormFieldError, { key: '6257297b31c53af850adb599dbda8a79678055fe', show: this.hasError }, h("slot", { key: '53a58ab2005a598ffa97ab16f894e642e8dc6884', name: "error" })), h(GuxFormFieldHelp, { key: '34abd49c63cc0617f0f940be16dad10525a8f42f', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ac6905a7b49d47dab653ce3ad3d0c5899f2ca5f1', 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: '2a07ccdfa483bedb9bd7317bd5dc6bd1529f081a', class: {
+        return (h(Host, { key: 'f7dc4e7c2f80984974904582d5cc2b9dd5c67fe6', class: {
                 'gux-input-error': this.hasError || this.hasGroupError,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: 'c8a3bdf5ee71bbe4991d3a5e3cd9ee61dd06a290', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '332b5681500d15e60b9310c3cb802150e55dc7ba', class: "gux-input-label" }, h("div", { key: '72203629b351ccbba635c919ef76f6dc328d7403', class: "gux-input" }, h("slot", { key: 'abeae9fb7b1203eb8c240fa08dc9e4d7cc934996', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: 'bbf5041bf73d34bc4dd14a4218f02b9b1a6a6963', class: "gux-label" }, h("slot", { key: 'a967102925864849bc62718fbaa834e93364ff78', name: "label" }))), h("div", { key: '7a62d57b6b56a20c0c38402508e19e643b9b2877', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '22c26e650b61d4e7f0d4b56adaaddf83438d5d54', show: this.hasError }, h("slot", { key: '767a2b5bc7ae8346503371df88f0bdcd655dc8b0', name: "error" })), h(GuxFormFieldHelp, { key: 'e7d2f365b35ff06030147c66f296fc96362509c4', show: !this.hasError && this.hasHelp }, h("slot", { key: 'd7b71e1858e4981ef423f763ef4e6533cd3ef9e3', name: "help" }))))));
+            } }, h("div", { key: 'a1f12b9fb10c3c37751aebc02964b05969acfe86', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: 'b86f210373fac683d085236e558492d130fa5c25', class: "gux-input-label" }, h("div", { key: '1ec27063205b05b0569daee06db75328b7ffbbd3', class: "gux-input" }, h("slot", { key: 'c38d40a89108c29b74925b3b2c54464ddc818fbc', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '0b6939d4f955c5d028d4b34e4c51d86a99442ed7', class: "gux-label" }, h("slot", { key: 'defaaf9b388c1ec65d711cc0df93feff683b84e7', name: "label" }))), h("div", { key: '31813aaff5b026ab9ba7101fdf817bff59db1108', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '05d8a17940b0daa4c2fe80470223be99761fa564', show: this.hasError }, h("slot", { key: 'c9b45fe30d06f75142b55c67705c814950faf1a5', name: "error" })), h(GuxFormFieldHelp, { key: '4b4cd37bddb6629d1d992f401b453b696e0db392', show: !this.hasError && this.hasHelp }, h("slot", { key: '25d292684f9b5b17a4ef7e6f1198d96f6c87e2b8', 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

@@ -124,8 +124,8 @@ export class GuxFormFieldRadioGroupBeta {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: 'aa74a0a167f00c3a64afb9a1ac74906393e93b7b', labelPosition: "above", disabled: this.disabled }, h(GuxFormFieldScreenreaderLabel, { key: 'fbee0e9663f864c367fb9c5443b001a07cf5af50' }, (_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: '16d264679463de752d0c24e5709586e3a0e31e0f', position: "above", required: this.required }, h("slot", { key: 'ccbe1cbcf87cc55287ff48a61e3c4ed913c63acb', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '1abb12f3d9af3848a7c491660378d05ed1311bbc', variant: this.indicatorMark, required: this.required }), h("slot", { key: '2271df407dfd329251b62812b5af094fe779d991', name: "group-label-info" })), h("slot", { key: '41c1116bb04c07868aaebc9552fd21e9f7759f49' }), h(GuxFormFieldError, { key: '7772c645665c4c9f5de81dc08a29970b89366439', show: this.hasGroupError }, h("slot", { key: '654fe35787e357c5e4ed113b48afc81d7bd27049', name: "group-error" })), h(GuxFormFieldHelp, { key: '43855ebb7ca5320723db4d6a6f7f2e7c2c8c3ed1', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: 'a6c7b086edf4deae14fcbe9e9e78690c0bd81236', name: "group-help" }))));
+        return (h(GuxFormFieldFieldsetContainer, { key: 'acfba046d414d134764bb8d63c0d944ae190ef0b', labelPosition: "above", disabled: this.disabled }, h(GuxFormFieldScreenreaderLabel, { key: 'fc6c07690055a4422007cf2976e7c15cfc1e2b32' }, (_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: 'b910b0eab97d6aaff27123f8f3b7388f987e3153', position: "above", required: this.required }, h("slot", { key: 'e5b77b04269f5fdce492a3c42cf48fcf569cfe38', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '0bb67f0d56898360c3388e9e188c7c1b523844c1', variant: this.indicatorMark, required: this.required }), h("slot", { key: '6a7b260dc69e954062eb7d262ff1dd709a1d3fa0', name: "group-label-info" })), h("slot", { key: '324bdaa5590740c1fa0c86490c0ffc6fd50d0258' }), h(GuxFormFieldError, { key: 'bf9c69816c159a8a180f71ad1654476ee28b8ca2', show: this.hasGroupError }, h("slot", { key: '7c6500b5062b211d57b7aab257d8a43ad4d7d193', name: "group-error" })), h(GuxFormFieldHelp, { key: '7eced387d0ac6e21de3c5ba2b6a9561a910a701d', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: 'cc323eb191b6d5139ee85b1a8e9b22c750d624e3', 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

@@ -114,9 +114,9 @@ export class GuxFormFieldRange {
         clearInterval(this.valueWatcherId);
     }
     render() {
-        return (h(Host, { key: 'bc17164c8473b7fdf04e2bbfdfb6580ef14b1aa5', class: {
+        return (h(Host, { key: 'f0ea43710ef4a39ce8f00f0aaa5444e4e2c11644', class: {
                 'gux-active': this.active
-            } }, h(GuxFormFieldContainer, { key: '3d1822229e53b3753c486c35c0bc4f63206adcde', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'c3bb26e77789bfba19bed7d1f4885f84a19d1d57', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '1cdfa1597694762bc753b2f24f92497620e3bf32', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '98dbeff398d089a6840083072fd2337372001a65', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'bf723a251796ce6d07f401ae83ba8c0d17a4c3f4', name: "label-info" })), h("div", { key: '23c49e029982a5a78023c4e05558dde97f9917b9', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: '82e313cb42b83c40b758accd2596631068a3ea49', show: this.hasError }, h("slot", { key: '42847d83952fdc18764a117e209a07a008a63f36', name: "error" })), h(GuxFormFieldHelp, { key: 'adab703b517deb2c01d475ff6515e26eabdab680', show: !this.hasError && this.hasHelp }, h("slot", { key: 'f2123fda5b0ab320bec4cc53e4ee775905fb2072', name: "help" }))))));
+            } }, h(GuxFormFieldContainer, { key: '5425aa03f151449e14a6fbc22e22cd5cd41a6937', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '3776c2b6167ed2a3786c173eb1df81feec4c9d55', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '0ef71134e1128d90d8120448cbf601c157a271a4', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'd93000d3b47ab3d4e82ae25e4e66173cfb041670', variant: this.indicatorMark, required: this.required }), h("slot", { key: '7d98fb6acd4c53835929869bfd6073d5d786137f', name: "label-info" })), h("div", { key: 'd812bffc149d767637f4c31613dfcd6c5096965b', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: 'c3bae4f5efb6902bbb403e1e5f941f01cda056ba', show: this.hasError }, h("slot", { key: 'a37c59e74573413fc69e3bc85e18b501df46217a', name: "error" })), h(GuxFormFieldHelp, { key: '8dd139f4e664c185f58fd510d5725033f6a37796', show: !this.hasError && this.hasHelp }, h("slot", { key: 'eef51ba6ca031acf3a9df9ddba55e2c77cce56a2', 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

@@ -99,13 +99,13 @@ export class GuxFormFieldSearch {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'd8e7979a398c2d2cb253a8963dcb73097071913a', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '0d660a0f7f1cca5fcee9e5e5e286c78c6cda27cf', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '7ebeaf339f5d7d1711e178055c4290b937dbead1', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'd2061f8d3881b5205886d5a4de3e4d4e1fbc63db', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'f22f7f97322585e46e0b0c6b531249923cabf72e', name: "label-info" })), h("div", { key: '1ffa3def92c9ed7ef2b2eabf7148c3126fcc0136', class: "gux-input-and-error-container" }, h("div", { key: '236f2873311d703f441604085aef6c4b36769dcc', class: {
+        return (h(GuxFormFieldContainer, { key: 'b6fd9cc1299ad98c62eb26ed723b50f252a1d960', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '85317cd753898a4994bee108ffe9de8a10280acd', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '2de444abac4cb87ccaac33bfd3c9a8fd8fb7b781', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'd7d70bb3d250dfabfbff3028abe0a14baa1a97a9', variant: this.indicatorMark, required: this.required }), h("slot", { key: '0834958114c7bb532aff2340bd615ffba436ff4b', name: "label-info" })), h("div", { key: 'e8e51be1997d6edd73742b41a505fc8c24c6eebf', class: "gux-input-and-error-container" }, h("div", { key: '98479f702b194a4afea9c2bd4b92fa2c18baa33f', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '2150cdfb85ae8958143f1665ae2b7df92ccf25db', class: {
+            } }, h("div", { key: '81559bc37b88fe02dabaa9cee25083ebda55e0d1', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            }, onClick: () => focusInputElement(this.input) }, h("gux-icon", { key: '03e96968f01aae2c30253b3ad9a791f97284b003', "icon-name": "fa/magnifying-glass-regular", decorative: true, size: "small" }), h("slot", { key: 'a6dc120633867712474d085001dd155694f07ba5', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: '8e4b4e775a10328088ae79e9f5c661d2740c3758', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '69f90a44bd6c4d0ebd1f82404646375ef7a488ec', show: this.hasError }, h("slot", { key: 'f0622f95157ae583e3282925f5d17d7d9cb47a55', name: "error" })), h(GuxFormFieldHelp, { key: '698dbaabec30e0348bf9ce6ee29972bddae2234b', show: !this.hasError && this.hasHelp }, h("slot", { key: '4f1238030632208d372842e9452f97739b3564fb', name: "help" })))));
+            }, onClick: () => focusInputElement(this.input) }, h("gux-icon", { key: 'f3706a1a58d52caa4398527adc123c796cf583ad', "icon-name": "fa/magnifying-glass-regular", decorative: true, size: "small" }), h("slot", { key: '26dafd78af632c3418d57daa2acaab3bd3c40e05', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: '7f9f2917f9a41cef175770ba9ae537a4de5e60f7', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '2ffcf69bae8c23fafdf3ca207a22dba5ace612c9', show: this.hasError }, h("slot", { key: 'dd600061ead761ee0a705e3e5fb9c9f54616ed29', name: "error" })), h(GuxFormFieldHelp, { key: '3d45df101daa9bafc3852edd369bacc4ffaf1b1e', show: !this.hasError && this.hasHelp }, h("slot", { key: '04a36d9a887e68426db0e41f44c91afcdcb48e59', 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

@@ -89,13 +89,13 @@ export class GuxFormFieldSelect {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '8c5479b8fd09bbc9073cacfb06af0c7d9f9dd08d', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '2328cf2f6608d0c6ca834636ffea363837bc9f20', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '05786d917bc60c7320bd7a91da1a51ccb2ffaff8', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '511c4b47c9a5404006c2ca14d278f096fe34fd31', variant: this.indicatorMark, required: this.required }), h("slot", { key: '60be6e914d33a654baed04a7787fd31acc76c769', name: "label-info" })), h("div", { key: 'be7230bca4a5ac4668d5906ab48465dbb1807dfb', class: "gux-input-and-error-container" }, h("div", { key: '8cc741be5b94dda1474c4e47c5b4d2f33c630d61', class: {
+        return (h(GuxFormFieldContainer, { key: '36d80cb0c83b9c7e683a21a3b1ee8b319cf4bd73', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'd7ab019e29ff3b6fcea76250ceea22038c17e4e0', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'f374ef61481fa4d2f6c2e53908886ee151e8660a', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '114211228486a8f146e41127c1acd56280b4b1aa', variant: this.indicatorMark, required: this.required }), h("slot", { key: '2d50de846e94d63aa6dd9cca126d3febe1845121', name: "label-info" })), h("div", { key: '5c83a9e15b35464eb8880f609dd01cec4494e895', class: "gux-input-and-error-container" }, h("div", { key: 'ede183b4ff75a8915cbceca9a5fce9f73fdfee1d', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '5af314bb0e48c2ab8da00be983cd76f7c96807a2', class: {
+            } }, h("div", { key: '3ffa5170a267850f556fbcfd9ec18078087dbee6', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '8253322c41297ef2295e0b1cb7908014310a187e', name: "input" }), h("gux-icon", { key: '414fd118181dd6a87cad8ae1abaaf5b73ee45a33', "icon-name": "custom/chevron-down-small-regular", decorative: true, size: "small" }))), h(GuxFormFieldError, { key: 'ae8743e1cda6d0c5342b03ad6fd67a2a01599f2f', show: this.hasError }, h("slot", { key: '84eab9fd4a7712f812dfe05cd1a31fb8681bdd3d', name: "error" })), h(GuxFormFieldHelp, { key: 'da3fb38e991924f1a87ddc3b823ebb99875d9cfc', show: !this.hasError && this.hasHelp }, h("slot", { key: '7de985c4c6ab83808d9090e1b62eac449d3c4f61', name: "help" })))));
+            } }, h("slot", { key: '4e4881a00101024bb2a0940d7b517e4f52892451', name: "input" }), h("gux-icon", { key: 'a700cd27972bbcd45a985b98e62f0a9fad62c34e', "icon-name": "custom/chevron-down-small-regular", decorative: true, size: "small" }))), h(GuxFormFieldError, { key: '1d3132a1292256096f8ec2fda877fb1d808b4466', show: this.hasError }, h("slot", { key: '5c6ce7083f67f2488ebdab5877cae6ce3e034df1', name: "error" })), h(GuxFormFieldHelp, { key: 'b836165487d038ba425ca14de727d0f8d0391b9f', show: !this.hasError && this.hasHelp }, h("slot", { key: 'eeb6aed6c059152d2507c110befb5d47491be583', 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

@@ -114,15 +114,15 @@ export class GuxFormFieldTextLike {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '3aae89e5a9e34e64fdaf202ca32750974b70f25b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'cab23d517a69ae2708d3893429c34b4bb09f4a62', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '368437105310fa272294d0df9eb9b9d741b44003', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'aab5d0450aada4a9727653bbcca84251f8d06b36', variant: this.indicatorMark, required: this.required }), h("slot", { key: '999514abce677aaa46c3361ff14c4881d72ae2ac', name: "label-info" })), h("div", { key: 'a36229ad90648c4dcaee9c8f32d7c0e286a8fb81', class: "gux-input-and-error-container" }, h("div", { key: 'dac2dd9e5b3837723ee488585da2e62265a67c1e', class: {
+        return (h(GuxFormFieldContainer, { key: '753266bb9ecf15ba5cacfaaee364e59c765b7c4d', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '26c4366085f69d644050943fa29c7e7794671281', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '78f39c5b6f908265ae43cd15ad86747051cf8269', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'ba5f56697af6bb08d7b24220e16a2b2db53ecfb7', variant: this.indicatorMark, required: this.required }), h("slot", { key: '73264427cdeb03ba95a0f2bf263219b4625b3d4f', name: "label-info" })), h("div", { key: '0d3baed6cdeeebb07295a2c9ea40527bd3cb77a2', class: "gux-input-and-error-container" }, h("div", { key: '83817ebd3819a5b104da9e6f100b0bc534dcb4a9', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '513e5efef0697c77660342ebaa5381b014558f20', class: {
+            } }, h("div", { key: '9e39750d06ebd16ebfb7397f966c909025982ddc', 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: '6fa9abcd69b8e834f338c424e0a5295400718e88', name: "prefix" }), h("slot", { key: 'b9ea3983bfb38b05fc0274aa8c1042c7d117a550', name: "input" }), this.renderRadialLoading(), h("slot", { key: 'f0da41ca1dbca2296834c84104e60ac2d54914fe', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: '6d39235478e7282efa3753e1eabdad8bae160337', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'b47c0a8d858e5e9596c83202cbde4082c244f72d', show: this.hasError }, h("slot", { key: 'c93308a6bc3fb318fc909ad284692912cd224586', name: "error" })), h(GuxFormFieldHelp, { key: 'e9b5190399bbb70517d3c70b9165c42bef7db285', show: !this.hasError && this.hasHelp }, h("slot", { key: '67035512f0b6e178eb4c50f754bd0e51090a9cc0', name: "help" })))));
+            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '438115de7518408190cb8129c41bd05de5132096', name: "prefix" }), h("slot", { key: '3bcb0b6ed7c8f6c9bc3768b512b17641f4606ffd', name: "input" }), this.renderRadialLoading(), h("slot", { key: '596540127449c6813feb7879b180c14263f907d6', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { key: '3b37dd7db5888ddd73ed191c863fdb128712e404', onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'ccd2d0274f514aba8bb8d9a19259d3d47e5c13d5', show: this.hasError }, h("slot", { key: '56c72130ce6bf75d99dcb3da20059c6b52239b1c', name: "error" })), h(GuxFormFieldHelp, { key: '90fe1b60aaaf959583b21822da1a9905b8dd72e9', show: !this.hasError && this.hasHelp }, h("slot", { key: '9d943aecae00baec1eb04210d4c02e8b51c64de3', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -93,12 +93,12 @@ export class GuxFormFieldTextarea {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '989ec6439601ed674996b95f803efdc8e5184d4b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '862ce006386692f5e93309f6735d0d653c42394e', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '2313fa07bab8373addd04faf624ab0083b415c54', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '630cdd1a052d2888545845afb7fedd79ebc019df', variant: this.indicatorMark, required: this.required }), h("slot", { key: '5e4357e39379df103af426266466750c5031a9de', name: "label-info" })), h("div", { key: 'eecf4870471748aa5ead808f1bc09281d4d842e3', class: "gux-input-and-error-container" }, h("div", { key: 'f1c25eb869c58712eae8906f3325b0bc6c3c57d2', ref: el => (this.textareaContainerElement = el), class: {
+        return (h(GuxFormFieldContainer, { key: '96e4bb7f50b658ba71f58eef6364a7b4c40b5c14', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'f589df9755a80ba802a9a27956148e445c6c2c4a', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'ca92d6a1d0c292bb767b702155efd18cf71eadfe', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'd9489ab61733ea7e7ccab22236b559beaeb94b15', variant: this.indicatorMark, required: this.required }), h("slot", { key: '6d5f591c954a9a0cfff971d818edd1c3377c996e', name: "label-info" })), h("div", { key: '70638e7f09f965fca80fcd6f67ef75786456f0d0', class: "gux-input-and-error-container" }, h("div", { key: 'ecb2ba7cb6308ecd0b2bfc76114843fa4b2dd43a', 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: '7e415e054e384235e792ad23fa9094042ad5dd06', name: "input" })), h(GuxFormFieldError, { key: 'fc564bf18ac064d60d79465e055cc2ce7a2ffbee', show: this.hasError }, h("slot", { key: '332994a6d8fa4e295eafc0b30a53e49b80c083d8', name: "error" })), h(GuxFormFieldHelp, { key: '1523d395d422f10916d89139e3103a86eb3e1bc5', show: !this.hasError && this.hasHelp }, h("slot", { key: 'dc6c5c0839950a91ffc6901fc7e98fbb89f05347', name: "help" })))));
+            } }, h("slot", { key: '145743ba9567e5db383883e7983e26bf3d5dff68', name: "input" })), h(GuxFormFieldError, { key: '5b129317959e6ba6efe7ca779974f8c5fd22fdab', show: this.hasError }, h("slot", { key: 'd75956631a0c7ff0cb1b3b373803e717141f5bb1', name: "error" })), h(GuxFormFieldHelp, { key: '2ec0ca5ea4d3bb33587e020ed7d68d8ba276159a', show: !this.hasError && this.hasHelp }, h("slot", { key: 'f747f9e35e0270ee3eb330507cd4de4e589253e4', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -98,14 +98,14 @@ export class GuxFormFieldTimePicker {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '2f6284bf2bd3a191aac85384490bab2d398c67b8', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: 'b9c7224d76977974cdecb991c6496caf712c2dad' }, (_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: '121ff318bcdf6b58b326e90b863c7e99e58f4c87', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '83b00e7aa3372ae0f99371fac3b1d99980f78cb6', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '3c9fc718823faff9cfe366662dbed9019950a0a4', variant: this.indicatorMark, required: this.required }), h("slot", { key: '191738908ec12ea8f5877a716951011a62a44b84', name: "label-info" })), h("div", { key: 'a61936aec738bf45351fff022f59c55a26a01754', class: "gux-input-and-error-container" }, h("div", { key: 'caa8258090f789e8110964df86e5179cb2417fce', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '2a590162d4336de472cbf26d40e29b54e074f6b5', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '8097110d65499e6426539eb8a3955773fcb26313' }, (_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: 'ef18ff5e0ef2de7068a42d8045425d6ff827fbb8', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'c0ca466f74f190dcac95dd9078b6ce733864301c', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'adb9c4e9905961806e88d73ecbdd15e9a70f445a', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ebe5cc98c6aebc1745a59582b6a7bdf2bb5dc9b8', name: "label-info" })), h("div", { key: '47c76e583ffd91528f3a4da145cb5a47a6dc04c5', class: "gux-input-and-error-container" }, h("div", { key: '7f1be7d0bc7436f4cf1ef1762b8d1aea231483f4', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '9a63c91f1fc6c7734ffd1d4fc56a43289206f701', class: {
+            } }, h("div", { key: '1cc80c6073e344954dcf8d82a1ae841cc2607a32', class: {
                 'gux-time-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: 'f6ba67bed6ba3100e562803db5b144470ceae780' }))), h(GuxFormFieldError, { key: '14444e36f3dd4a30e3c7925b67a198ae9ddb0aa0', show: this.hasError }, h("slot", { key: '25107814efa1dceab24dd57cfa04fdf7a31401fe', name: "error" })), h(GuxFormFieldHelp, { key: 'f40f273f9c14cb1b80b8903bd824b0c81edbae0b', show: !this.hasError && this.hasHelp }, h("slot", { key: 'f28e67e86167d4f0ee3ce3519124840836f5d219', name: "help" })))));
+            } }, h("slot", { key: 'e20ca61994751a5679e0712a466a6b55b7234e47' }))), h(GuxFormFieldError, { key: '01893585f8ac5a83e6d4eca90fb41e1da013a291', show: this.hasError }, h("slot", { key: '2444179a580fa3662112dd762c639ec5b79f1de4', name: "error" })), h(GuxFormFieldHelp, { key: 'a864aae889748c1b96398a1a42c4ba4811a0e8e0', show: !this.hasError && this.hasHelp }, h("slot", { key: '24d91c276abcfdbec50703d6069bad2453644ac6', name: "help" })))));
     }
     renderText(text, condition = false) {
         if (condition) {

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-time-zone-picker/gux-form-field-time-zone-picker.js

@@ -99,13 +99,13 @@ export class GuxFormFieldTimeZonePicker {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: 'a2c68942760261ead99de690292e5212c7e51c68', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: 'bce390a211dc6ec360e98351dffd94ea587b9f1c' }, (_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: 'd33286d7b2907c45cc7ae016ada4a376844a2382', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '0f28f6cf1f6206dac20b921c6801fc867d3c4d84', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '8a3a4fd4ea3a8e7d936cdb2b0381c0630f5466be', variant: this.indicatorMark, required: this.required }), h("slot", { key: '6b40b670b50fc08cd2bdf5a4a746dd49f0b75ee7', name: "label-info" })), h("slot", { key: '7e652012704350ded87227440248ded99d958c71', name: "label-info" }), h("div", { key: '3d623fb3dadea4922acb2bb1cc3f6b5d06b3add7', class: "gux-input-and-error-container" }, h("div", { key: '03bd1920912a114ed96eb778cbf508ce796df886', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '253f126bad039d8597e5e04720da30e359b0bc31', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '5b2379af4fda9bd34de7be21e24271aa0be376b3' }, (_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: '431a3a5a3737aaaf3362bcca8a3f5ea121eeb67b', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '94a662cd42c271c5c3fcfc69844bb88ea038d17e', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '41169379f5472c2c1f1ded1bb0dc08c2cced1f20', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ca2408560747429d605ab9e21639eb79136670ea', name: "label-info" })), h("slot", { key: 'c7657a3fc244cc380626010fbb07e3fe6161d4ba', name: "label-info" }), h("div", { key: '4452ed2293e7a9155b27b80057e747a955e7fb5c', class: "gux-input-and-error-container" }, h("div", { key: '0f1b9da635a172a90a32bbf5edd980078cf56f47', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError,
                 'gux-time-zone-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '08c31da81e638aac148c261ea0ce907a573b330d' })), h(GuxFormFieldError, { key: 'a42aa3900bae7604743901f0d02cf142deb0895d', show: this.hasError }, h("slot", { key: '043484bc6874dad6c94b82f6641c61b6d1bef498', name: "error" })), h(GuxFormFieldHelp, { key: 'ea9e1555da10f5b2db0191b2cbe4573c55c04b6d', show: !this.hasError && this.hasHelp }, h("slot", { key: '0f5cea2ef4a9d9ade78cb103cc41214fc7409b99', name: "help" })))));
+            } }, h("slot", { key: 'c088e3e49036cbb9121eb9fa5ec4f87fb8f989f2' })), h(GuxFormFieldError, { key: '84898fa29cc83489cacb7e322b472a179caa3b39', show: this.hasError }, h("slot", { key: 'c8b6b862e266dc3d7c856967094acc830612ca24', name: "error" })), h(GuxFormFieldHelp, { key: '786af2950e6463f7a89e6e7cc3f950dd1148397c', show: !this.hasError && this.hasHelp }, h("slot", { key: '9c08e443a5bf0268a14cd75660a869de0999f04d', name: "help" })))));
     }
     renderText(text, condition = false) {
         if (condition) {

package/dist/collection/components/stable/gux-form-field/helper-components/gux-form-field-input-clear-button/gux-form-field-input-clear-button.js

@@ -8,7 +8,7 @@ export class GuxFormFieldInputClearButton {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("button", { key: '69c846a9dac078cf1b2affbbd802bcdf5e342671', tabIndex: -1, type: "button", "aria-label": this.i18n('clear') }, h("gux-icon", { key: '75f116fced0dc325f669efbc3dcaa8a44ee52e7c', "icon-name": "fa/xmark-large-regular", decorative: true, size: "small" }), h("gux-tooltip-beta", { key: '752ef91c7cc3d5e0f0e320b799f6b75fd7a28caa', "visual-only": true }, h("div", { key: '082c3d468a87dcfdd360a79f22e13f33b1b4cfb9', slot: "content" }, this.i18n('clear')))));
+        return (h("button", { key: '64404e9437de8a45385161b1dee6b8811543895c', tabIndex: -1, type: "button", "aria-label": this.i18n('clear') }, h("gux-icon", { key: '5a4d5acbd2b2243bcb142559c834986ac15c4bad', "icon-name": "fa/xmark-large-regular", decorative: true, size: "small" }), h("gux-tooltip-beta", { key: 'ebd62167e9f3484066e68dc0110af280a50976e5', "visual-only": true }, h("div", { key: '7bc3633e898beddd15386e0268596f28660fe70b', slot: "content" }, this.i18n('clear')))));
     }
     static get is() { return "gux-form-field-input-clear-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -73,7 +73,7 @@ export class GuxIcon {
         return svgElement.outerHTML;
     }
     render() {
-        return (this.svgHtml && (h("div", { key: '99218862a4c35ffce4c199f28a8b1ea5a7e940f4', class: "gux-icon-container", innerHTML: this.svgHtml })));
+        return (this.svgHtml && (h("div", { key: 'f0428ad587ae63465b9352564c3fd7bdafe0a693', class: "gux-icon-container", innerHTML: this.svgHtml })));
     }
     static get is() { return "gux-icon"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-inline-alert/gux-inline-alert.js

@@ -28,10 +28,10 @@ export class GuxAlert {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: '067e78adfbddb40428133b36b0297665ac02433e', role: "alert", class: {
+        return (h("div", { key: '0cc56669d4391255b4ab87778692902d125f9dc5', role: "alert", class: {
                 'gux-inline-alert': true,
                 [`gux-${this.accent}`]: true
-            } }, h("div", { key: '66463583a6c6868cf4b6daad0ffec4ae6f806203', class: "gux-message-wrapper" }, h("gux-icon", { key: '8f9e2580c6990f14c082519ff656a1f1032318dd', "icon-name": this.getIcon(this.accent), decorative: true, size: "small" }), h("gux-screen-reader-beta", { key: '53e3e6259dca207e4384cff943c456840c16f419' }, this.i18n(this.accent)), h("div", { key: '6d00d57345d1aa0a96f02042e51a6106e72cc61d', class: "gux-content" }, h("slot", { key: '10dd2c655f71f7d32c7e13bbb65c7307c5016652', name: "content" }, h("slot", { key: '5397c26961c174b093c0d9f0d3b561cc49c8792a' }))))));
+            } }, h("div", { key: '012b260d9f1a98288646e1160bed5a845f42b3b5', class: "gux-message-wrapper" }, h("gux-icon", { key: '372a76f372efc221936de7ed79ba410877621f11', "icon-name": this.getIcon(this.accent), decorative: true, size: "small" }), h("gux-screen-reader-beta", { key: 'c4da670c1421a824d4f895b3c3d63a75b41aeb49' }, this.i18n(this.accent)), h("div", { key: '947363b18e34685adcc1668261dd695a2b3e852d', class: "gux-content" }, h("slot", { key: '80cd34a7b53ec01b57ad4c61482099a0acb4af17', name: "content" }, h("slot", { key: 'af09ac4f9428e935698143d185ead50ccf032e2a' }))))));
     }
     static get is() { return "gux-inline-alert"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-list/gux-list-divider/gux-list-divider.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class GuxListDivider {
     render() {
-        return (h(Host, { key: '41458da7139ee853dd9f3c17725ec64a2a24a4b4', role: "presentation" }));
+        return (h(Host, { key: 'dcbbe61c502bb8163134ce0ab46df25592e32a1f', role: "presentation" }));
     }
     static get is() { return "gux-list-divider"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-list/gux-list-item/gux-list-item.js

@@ -7,7 +7,7 @@ export class GuxListItem {
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: 'a3efef4785ff821a9767e92760c2ac368e874303', role: "listitem" }, h("button", { key: '7fc1d32872b8c5f475ff740ad5f15ccf2a09cfcc', type: "button", tabIndex: -1, disabled: this.disabled, "data-testid": "list-item-button" }, h("slot", { key: '0a13d6573be93a1db42c774bf19c6a4d79386575' }))));
+        return (h(Host, { key: 'c8b2de3bbca939674315a674ccefce3663018b21', role: "listitem" }, h("button", { key: 'db9e5a47ee8cf68cabc83d9a9f0ed8ff421879e5', type: "button", tabIndex: -1, disabled: this.disabled, "data-testid": "list-item-button" }, h("slot", { key: '2d031fbc9d6b2f63ed2c3ca327a709b4e674ad1c' }))));
     }
     static get is() { return "gux-list-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -46,7 +46,7 @@ export class GuxList {
         last(this.root, validFocusableItems);
     }
     render() {
-        return (h(Host, { key: 'bc06758cc8fabd24b777290099a0846baca46170', tabindex: "-1", role: "list" }, h("slot", { key: 'd872eaf91cde5d80bf2e9f639223ed1978706178' })));
+        return (h(Host, { key: '83e17b06638c42f03e85dfd27ef96869aa61ec83', tabindex: "-1", role: "list" }, h("slot", { key: '2634eed100b5f167b8c5e552acbf3f5048789bb1' })));
     }
     static get is() { return "gux-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-listbox/option-group/gux-option-group.js

@@ -50,7 +50,7 @@ export class GuxOptionGroup {
         }
     }
     render() {
-        return (h(Host, { key: '52464228f18966a498446e964bb2e841dd041d4e', class: { 'gux-filtered': this.filtered } }, h("div", { key: '41ad1da60a63157795b9262c00596369e02fca4e', class: "gux-option-group" }, h("div", { key: '169506c4a56c9c005aa67ab88637e761cd16d037', class: "gux-option-group-label", role: "presentation" }, this.label), h("div", { key: '6c54b05602b83efcfd88c868bbe875c74ef0bb80', role: "group" }, h("slot", { key: 'd525c39742eca5e6face2a7eba2658b3c9877734' })), this.renderDivider())));
+        return (h(Host, { key: 'ac61c52ea48efea48438e02d7741e13e6932e241', class: { 'gux-filtered': this.filtered } }, h("div", { key: 'f620551c2a9623467e306b9444b4438e13abd683', class: "gux-option-group" }, h("div", { key: 'eb05cb1d31ef39fce6fe3b984e1a9eabeb24635b', class: "gux-option-group-label", role: "presentation" }, this.label), h("div", { key: 'ce351ee678adf3b54283d54d173829bceb8fb442', role: "group" }, h("slot", { key: '02c714e9c78f6d3c3cdecf1394f43913d61d7eb7' })), this.renderDivider())));
     }
     static get is() { return "gux-option-group-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-listbox/options/gux-option/gux-option.js

@@ -43,13 +43,13 @@ export class GuxOption {
         return parentListbox === null || parentListbox === void 0 ? void 0 : parentListbox.disabled;
     }
     render() {
-        return (h(Host, { key: 'ec21be1002f3280612de75e37db95eb6972593fc', role: "option", class: {
+        return (h(Host, { key: '3b32039f09c90fe88bdafcb3597943337ae79ff4', role: "option", class: {
                 'gux-active': this.active,
                 'gux-disabled': this.disabled || this.hasDisabledParent(),
                 'gux-filtered': this.filtered,
                 'gux-selected': this.selected,
                 'gux-show-subtext': this.hasSubtext
-            }, "aria-selected": this.getAriaSelected(), "aria-disabled": booleanString(this.disabled || this.hasDisabledParent()) }, h("div", { key: '69c26d456a4f74f169b2018fd03525299fa5149f', class: "gux-option-wrapper" }, h("gux-truncate", { key: '1c3c096df3bd18259cade9903165839d681377a4', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: 'f03c6a93e3d1764634aef45e40069e3be586c88d' })), h("slot", { key: 'd15ee648db04cd5ee3cd065abbb0dedf9a631c3b', onSlotchange: () => this.onSubtextChange(), name: "subtext" }))));
+            }, "aria-selected": this.getAriaSelected(), "aria-disabled": booleanString(this.disabled || this.hasDisabledParent()) }, h("div", { key: 'e12ee238fe0bf8b88ea2ff9c422ff7a53a4f92cc', class: "gux-option-wrapper" }, h("gux-truncate", { key: '07bf888b0cb355764fe8aa4343f84395389ac32a', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: '632f29668ec685018e381967833e9ac0e22e6991' })), h("slot", { key: '3f6c9039cbcccc0002d21913ce2f253fd149b70a', onSlotchange: () => this.onSubtextChange(), name: "subtext" }))));
     }
     static get is() { return "gux-option"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-listbox/options/gux-option-icon/gux-option-icon.js

@@ -62,14 +62,14 @@ export class GuxOptionIcon {
         return (h("gux-icon", { decorative: this.iconSrText == null, "screenreader-text": this.iconSrText, "icon-name": this.iconName, style: iconStyle, size: "small" }));
     }
     render() {
-        return (h(Host, { key: 'ca198d8c122c9d9ee5fe0dce4987dd3175fd86b8', role: "option", class: {
+        return (h(Host, { key: '0678a2b4f2dbe030e5f84d38f3f06c730dd610da', role: "option", class: {
                 'gux-active': this.active,
                 'gux-disabled': this.disabled || this.hasDisabledParent(),
                 'gux-filtered': this.filtered,
                 'gux-hovered': this.hovered,
                 'gux-selected': this.selected,
                 'gux-show-subtext': this.hasSubtext
-            }, "aria-selected": this.getAriaSelected(), "aria-disabled": booleanString(this.disabled || this.hasDisabledParent()) }, this.renderMaybeIcon('start'), h("div", { key: 'c70d615c64c0bf3217e9cc9d5f0e3b3fe18779c9', class: "gux-option-wrapper" }, h("gux-truncate", { key: 'd39442f8b4c51d75b82eb7a0ce9aa6ed641f844b', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: 'cc353195cf978b0c095267ca591ab87df4765e83' })), h("slot", { key: 'aa33fcf61ee602912956b6d433eed2123605da87', onSlotchange: () => this.onSubtextChange(), name: "subtext" })), this.renderMaybeIcon('end')));
+            }, "aria-selected": this.getAriaSelected(), "aria-disabled": booleanString(this.disabled || this.hasDisabledParent()) }, this.renderMaybeIcon('start'), h("div", { key: '1f0468cf83a5a2a51412fd66afc158d414cb1b49', class: "gux-option-wrapper" }, h("gux-truncate", { key: '0ce2ebbf207c70be25dabfedfbd27b5f491ae46c', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: '8d7a267adfb3e5a84832f1a8ed682b87b7c6c9e9' })), h("slot", { key: 'fb501045e53353a2d32bdd87ff5e15c3f0a08ff7', onSlotchange: () => this.onSubtextChange(), name: "subtext" })), this.renderMaybeIcon('end')));
     }
     static get is() { return "gux-option-icon"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-listbox-multi/gux-create-option/gux-create-option.css

@@ -36,12 +36,4 @@
 }
 :host .gux-option {
   display: inline-flex;
-}
-:host .gux-screenreader {
-  position: absolute;
-  top: auto;
-  left: -10000px;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
 }

package/dist/collection/components/stable/gux-listbox-multi/gux-create-option/gux-create-option.js

@@ -29,14 +29,14 @@ export class GuxCreateOption {
     // COMUI-3905: Without this method the dropdown multi's add option button triggers an infinite loop when it is hidden adter being displayed.
     async componentWillRender() { }
     renderCustomOptionInstructions() {
-        return (h("span", { class: "gux-screenreader" }, this.i18n('createCustomOptionInstructions')));
+        return (h("gux-screen-reader-beta", null, this.i18n('createCustomOptionInstructions')));
     }
     render() {
-        return (h(Host, { key: 'c92d141ba5fbf37a5080365119b1e6db171d6e05', role: "option", "aria-selected": false, class: {
+        return (h(Host, { key: '0729ebc0999cea75abe1343b990c541a77f1b256', role: "option", "aria-selected": false, class: {
                 'gux-active': this.active,
                 'gux-hovered': this.hovered,
                 'gux-filtered': this.filtered
-            } }, h("div", { key: 'ffcf2df8c0041a5311f833cd4fa1588ebd93671b', class: "gux-option" }, h("gux-icon", { key: '6112d8631bf2482e2152955ca52667e33f89f583', decorative: true, "icon-name": "fa/plus-regular", size: "small" }), h("div", { key: '31f37ce25a3e437a3e79d693708e32b79d0ddfea', class: "gux-create-text" }, this.i18n('createOption', {
+            } }, h("div", { key: '7c9d28546510035aef071668a270138c9d3e66af', class: "gux-option" }, h("gux-icon", { key: '99559a6e25df446f5f59ec7e4fb0bebb987f9a60', decorative: true, "icon-name": "fa/plus-regular", size: "small" }), h("div", { key: 'd547101e200c946fa69b448699b7f38ed70f8464', class: "gux-create-text" }, this.i18n('createOption', {
             optionValue: this.value
         })), this.renderCustomOptionInstructions())));
     }

package/dist/collection/components/stable/gux-listbox-multi/gux-option-multi/gux-option-multi.css

@@ -82,12 +82,4 @@
 }
 :host:host(.gux-filtered) {
   display: none;
-}
-:host .gux-screenreader {
-  position: absolute;
-  top: auto;
-  left: -10000px;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
 }