genesys-spark-components 4.65.1 → 4.66.0

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

@@ -6,13 +6,13 @@ import { p as preventBrowserValidationStyling } from './prevent-browser-validati
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { G as GuxFormFieldError, a as GuxFormFieldHelp } from './gux-form-field-error-4d654b58.js';
 import { G as GuxFormFieldLabel, a as GuxFormFieldContainer } from './gux-form-field-container-777ec473.js';
-import { h as hasContent, b as setSlotAriaDescribedby, c as clearInput, g as getSlottedInput, v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-6cfb4f6f.js';
-import { t as trackComponent } from './usage-09e4c7d9.js';
+import { h as hasContent, b as setSlotAriaDescribedby, c as clearInput, g as getSlottedInput, v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-46fea82d.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
 import './simulate-native-event-e0631897.js';
 
-const guxFormFieldTextLikeCss = ".gux-form-field-container.gux-beside{display:flex;flex-direction:row}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-label.gux-required::after{color:var(--gse-ui-formControl-label-indicator-requiredColor);content:\" *\"}.gux-form-field-label.gux-beside{position:relative;top:8px;width:fit-content;min-width:45px;margin-right:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-label.gux-screenreader{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}:host{display:block}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(input){flex:1 1 auto;align-self:auto;order:0;width:100%;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);text-overflow:ellipsis;background-color:var(--gse-ui-formControl-input-backgroundColor);border:none;outline:none}::slotted(input)::placeholder{color:var(--gse-ui-formControl-input-placeholderColor);opacity:1}slot[name=prefix],slot[name=suffix]{font-family:var(--gse-ui-formControl-input-prefixSufix-text-fontFamily);font-size:var(--gse-ui-formControl-input-prefixSufix-text-fontSize);line-height:var(--gse-ui-formControl-input-prefixSufix-text-lineHeight);color:var(--gse-ui-formControl-input-prefixSufix-defaultColor);text-align:center;text-decoration:none;white-space:nowrap}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input .gux-input-container{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-input-gap);place-content:stretch center;align-items:center;width:100%;height:var(--gse-ui-formControl-input-textfield-height);padding:var(--gse-ui-formControl-input-padding);font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;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-input-and-error-container .gux-input .gux-input-container.gux-has-suffix:not(.gux-input-and-error-container .gux-input .gux-input-container.gux-has-prefix) ::slotted(input){text-align:right}.gux-input-and-error-container .gux-input .gux-input-container.gux-disabled{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container .gux-input .gux-input-container:focus-within{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-focusRing-borderRadius);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-focusRing-offset)}.gux-input-and-error-container .gux-input .gux-input-container:hover:not(.gux-disabled){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)}.gux-input-and-error-container .gux-input.gux-input-error .gux-input-container{border-color:var(--gse-ui-formControl-input-error-border-color)}";
+const guxFormFieldTextLikeCss = ".gux-form-field-container.gux-beside{display:flex;flex-direction:row}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-label{display:inline-flex;flex:1 0 auto}.gux-form-field-label ::slotted(gux-label-info-beta){padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-required gux-form-field-label-indicator{padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-beside{position:relative;top:var(--gse-ui-formControl-input-top);width:fit-content;min-width:var(--gse-ui-formControl-input-textfield-minWidth);max-width:fit-content;margin-right:var(--gse-ui-formControl-group-gapItems)}.gux-form-field-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-label.gux-screenreader{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}:host{display:block}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(input){flex:1 1 auto;align-self:auto;order:0;width:100%;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);text-overflow:ellipsis;background-color:var(--gse-ui-formControl-input-backgroundColor);border:none;outline:none}::slotted(input)::placeholder{color:var(--gse-ui-formControl-input-placeholderColor);opacity:1}slot[name=prefix],slot[name=suffix]{font-family:var(--gse-ui-formControl-input-prefixSufix-text-fontFamily);font-size:var(--gse-ui-formControl-input-prefixSufix-text-fontSize);line-height:var(--gse-ui-formControl-input-prefixSufix-text-lineHeight);color:var(--gse-ui-formControl-input-prefixSufix-defaultColor);text-align:center;text-decoration:none;white-space:nowrap}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input .gux-input-container{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-input-gap);place-content:stretch center;align-items:center;width:100%;height:var(--gse-ui-formControl-input-textfield-height);padding:var(--gse-ui-formControl-input-padding);font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;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-input-and-error-container .gux-input .gux-input-container.gux-has-suffix:not(.gux-input-and-error-container .gux-input .gux-input-container.gux-has-prefix) ::slotted(input){text-align:right}.gux-input-and-error-container .gux-input .gux-input-container.gux-disabled{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container .gux-input .gux-input-container:focus-within{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-focusRing-borderRadius);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-focusRing-offset)}.gux-input-and-error-container .gux-input .gux-input-container:hover:not(.gux-disabled){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)}.gux-input-and-error-container .gux-input.gux-input-error .gux-input-container{border-color:var(--gse-ui-formControl-input-error-border-color)}";
 const GuxFormFieldTextLikeStyle0 = guxFormFieldTextLikeCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -41,9 +41,37 @@ const GuxFormFieldTextLike = class {
         this.hasHelp = false;
     }
     onMutation() {
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
     }
+    handleKeyup(event) {
+        var _a, _b;
+        switch (event.key) {
+            case 'Tab': {
+                if (this.input.matches(':focus-visible')) {
+                    void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.showTooltip());
+                    this.hideLabelInfoTimeout = setTimeout(() => {
+                        var _a;
+                        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+                    }, 6000);
+                }
+                break;
+            }
+            default: {
+                if (this.input.matches(':focus-visible')) {
+                    void ((_b = this.labelInfo) === null || _b === void 0 ? void 0 : _b.hideTooltip());
+                    clearTimeout(this.hideLabelInfoTimeout);
+                }
+                break;
+            }
+        }
+    }
+    onFocusout() {
+        var _a;
+        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+        clearTimeout(this.hideLabelInfoTimeout);
+    }
     // eslint-disable-next-line @typescript-eslint/require-await
     async guxForceUpdate() {
         this.hasContent = hasContent(this.input);
@@ -59,6 +87,7 @@ const GuxFormFieldTextLike = class {
     componentWillLoad() {
         this.setInput();
         this.setLabel();
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
         this.hasPrefix = Boolean(this.root.querySelector('[slot="prefix"]'));
@@ -80,15 +109,15 @@ const GuxFormFieldTextLike = class {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '86a510be1423b2e46f8f0e8457dde0c1e9df13ed', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '63c3fc02eb3ec146075c2da84c462f27822ca808', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '4ef1afb40888de7df1642f23286e5cffcf6d5864', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'fd35d679cdac2f9c64eedbe144e5792a2cfa03ad', class: "gux-input-and-error-container" }, h("div", { key: 'ae0d6f2d3662997b8e2d7dcb8895ee2a57033119', class: {
+        return (h(GuxFormFieldContainer, { key: 'bb6c077df61d47169ddbd8af74d6906cd5354a18', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'b71214d65749df1743a9b37cba6f9808ed26afed', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'e8b921f53a2f96e4e7de5c0a1050da1dbc893a19', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'c29409c64ae4f46149e61a8c937d983dbad8566e', variant: "required", required: this.required }), h("slot", { key: '7e9d51f99a6fa3c3771ba2d01f8eee1707d5de1a', name: "label-info" })), h("div", { key: '597300a419b56423ed9d79765f1e0d7e7834a43c', class: "gux-input-and-error-container" }, h("div", { key: '1fbe34b0a399b38077681c29b2bdb03b0a147043', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'faced97c3fd4504e59eb8086b0adef95b9ec881f', class: {
+            } }, h("div", { key: '9994182f2aaa915bb5445836b754c037052cbebb', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-has-prefix': this.hasPrefix,
                 'gux-has-suffix': this.hasSuffix
-            } }, h("slot", { key: '7e936d0be636981e6404c559e20a29dbd8654eee', name: "prefix" }), h("slot", { key: '3945e2a3c79ff28178c355002c576c6fa0fbe099', name: "input" }), this.renderRadialLoading(), h("slot", { key: '2ed2ac89134fe77eb62e286a84d0c0ffe4fe13d2', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '3abfa87d4642948fd21dfd8748e30efbcd18d527', show: this.hasError }, h("slot", { key: 'b77a1af625c5901e31809fee6e88aeadbb76c851', name: "error" })), h(GuxFormFieldHelp, { key: '1e1e5474f87d937186c140690f2e8d85cde0c14a', show: !this.hasError && this.hasHelp }, h("slot", { key: 'cffc4e02f2ce1e6c0f64621e760bcf6f5b67c627', name: "help" })))));
+            } }, h("slot", { key: '4be921cb58fd54171f9bc81409451b45904fcdd9', name: "prefix" }), h("slot", { key: 'c942c81394a5c2f79e030484191dc1878e7ba9ad', name: "input" }), this.renderRadialLoading(), h("slot", { key: '52428b82056bf77902ded5c730ed3f976d24be13', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'debc94e90a94c098c21be404daaf3e339ae8f5c0', show: this.hasError }, h("slot", { key: '04d219fd899ac0b09468c0e9a1360c5c9ff52ec9', name: "error" })), h(GuxFormFieldHelp, { key: '07600d7b0bbb3b1fcb25ac23283944c2f143284f', show: !this.hasError && this.hasHelp }, h("slot", { key: '87b4f9fdf2eb08d4da0ccf197d279f99d73fc04c', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -6,13 +6,13 @@ import { p as preventBrowserValidationStyling } from './prevent-browser-validati
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { G as GuxFormFieldError, a as GuxFormFieldHelp } from './gux-form-field-error-4d654b58.js';
 import { G as GuxFormFieldLabel, a as GuxFormFieldContainer } from './gux-form-field-container-777ec473.js';
-import { v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-6cfb4f6f.js';
-import { t as trackComponent } from './usage-09e4c7d9.js';
+import { v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-46fea82d.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
 import './simulate-native-event-e0631897.js';
 
-const guxFormFieldTextareaCss = ".gux-form-field-container.gux-beside{display:flex;flex-direction:row}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-label.gux-required::after{color:var(--gse-ui-formControl-label-indicator-requiredColor);content:\" *\"}.gux-form-field-label.gux-beside{position:relative;top:8px;width:fit-content;min-width:45px;margin-right:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-label.gux-screenreader{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}:host{display:block}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(textarea){flex:1 1 auto;align-self:auto;order:0;font-family:inherit;font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);resize:vertical;background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;border:none;border-radius:var(--gse-ui-formControl-input-borderRadius);outline:none;padding:var(--gse-ui-formControl-textarea-padding);margin:0}::slotted(textarea)::placeholder{color:var(--gse-ui-formControl-input-placeholderColor);opacity:1}::slotted(textarea)[disabled]{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input{position:relative;display:flex;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);outline:none}.gux-input-and-error-container .gux-input:focus-within{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-focusRing-borderRadius);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-focusRing-offset)}.gux-input-and-error-container .gux-input:hover:not(.gux-disabled){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)}.gux-input-and-error-container .gux-input.gux-input-error{border-color:var(--gse-ui-formControl-input-error-border-color)}.gux-input-and-error-container .gux-input.gux-disabled{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container .gux-input.gux-resize-none ::slotted(textarea){resize:none}.gux-input-and-error-container .gux-input.gux-resize-auto{display:grid;overflow:hidden;word-break:normal;word-break:break-word;overflow-wrap:anywhere}.gux-input-and-error-container .gux-input.gux-resize-auto::after{grid-row-start:1;grid-row-end:2;grid-column-start:1;grid-column-end:2;white-space:pre-wrap;visibility:hidden;content:attr(data-replicated-value) \" \";padding:var(--gse-ui-formControl-textarea-padding);margin:0}.gux-input-and-error-container .gux-input.gux-resize-auto ::slotted(textarea){grid-row-start:1;grid-row-end:2;grid-column-start:1;grid-column-end:2;overflow-x:hidden;resize:none}";
+const guxFormFieldTextareaCss = ".gux-form-field-container.gux-beside{display:flex;flex-direction:row}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-label{display:inline-flex;flex:1 0 auto}.gux-form-field-label ::slotted(gux-label-info-beta){padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-required gux-form-field-label-indicator{padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-beside{position:relative;top:var(--gse-ui-formControl-input-top);width:fit-content;min-width:var(--gse-ui-formControl-input-textfield-minWidth);max-width:fit-content;margin-right:var(--gse-ui-formControl-group-gapItems)}.gux-form-field-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-label.gux-screenreader{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}:host{display:block}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(textarea){flex:1 1 auto;align-self:auto;order:0;font-family:inherit;font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);resize:vertical;background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;border:none;border-radius:var(--gse-ui-formControl-input-borderRadius);outline:none;padding:var(--gse-ui-formControl-textarea-padding);margin:0}::slotted(textarea)::placeholder{color:var(--gse-ui-formControl-input-placeholderColor);opacity:1}::slotted(textarea)[disabled]{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input{position:relative;display:flex;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);outline:none}.gux-input-and-error-container .gux-input:focus-within{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-focusRing-borderRadius);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-focusRing-offset)}.gux-input-and-error-container .gux-input:hover:not(.gux-disabled){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)}.gux-input-and-error-container .gux-input.gux-input-error{border-color:var(--gse-ui-formControl-input-error-border-color)}.gux-input-and-error-container .gux-input.gux-disabled{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container .gux-input.gux-resize-none ::slotted(textarea){resize:none}.gux-input-and-error-container .gux-input.gux-resize-auto{display:grid;overflow:hidden;word-break:normal;word-break:break-word;overflow-wrap:anywhere}.gux-input-and-error-container .gux-input.gux-resize-auto::after{grid-row-start:1;grid-row-end:2;grid-column-start:1;grid-column-end:2;white-space:pre-wrap;visibility:hidden;content:attr(data-replicated-value) \" \";padding:var(--gse-ui-formControl-textarea-padding);margin:0}.gux-input-and-error-container .gux-input.gux-resize-auto ::slotted(textarea){grid-row-start:1;grid-row-end:2;grid-column-start:1;grid-column-end:2;overflow-x:hidden;resize:none}";
 const GuxFormFieldTextareaStyle0 = guxFormFieldTextareaCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -37,12 +37,41 @@ const GuxFormFieldTextarea = class {
         this.hasHelp = false;
     }
     onMutation() {
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
     }
+    handleKeyup(event) {
+        var _a, _b;
+        switch (event.key) {
+            case 'Tab': {
+                if (this.input.matches(':focus-visible')) {
+                    void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.showTooltip());
+                    this.hideLabelInfoTimeout = setTimeout(() => {
+                        var _a;
+                        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+                    }, 6000);
+                }
+                break;
+            }
+            default: {
+                if (this.input.matches(':focus-visible')) {
+                    void ((_b = this.labelInfo) === null || _b === void 0 ? void 0 : _b.hideTooltip());
+                    clearTimeout(this.hideLabelInfoTimeout);
+                }
+                break;
+            }
+        }
+    }
+    onFocusout() {
+        var _a;
+        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+        clearTimeout(this.hideLabelInfoTimeout);
+    }
     componentWillLoad() {
         this.setInput();
         this.setLabel();
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
         trackComponent(this.root, { variant: this.variant });
@@ -59,12 +88,12 @@ const GuxFormFieldTextarea = class {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'c9f234ba85bd5c74f2055e0e92da75ffa2387f7b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'b3a0ffa00cd263edbc3f324586482006c631c0f0', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '653cb3c9e3951eb736124457ef8d61e576a16100', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'cc1db32ae61b2080033b01970162e2bc8d4407c5', class: "gux-input-and-error-container" }, h("div", { key: '1698d45688f8b70cce2707c39a5a064b6e6328d0', ref: el => (this.textareaContainerElement = el), class: {
+        return (h(GuxFormFieldContainer, { key: '43b28391a715f32a263ef1df852c3ea5e2803dfc', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '77baab9e20d6d06a1bfb3154fd53ff8e8b4df5db', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '583f964f54dac1ac3eb0aa9f496581f7f04cb8b4', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '61e42f3d04fa6b1e0fe4d8c72b24dce4a1881d7e', variant: "required", required: this.required }), h("slot", { key: '657d582d2b3d8a91aaff3ee1c251e0289314dba6', name: "label-info" })), h("div", { key: '7b8037f91f519b1eeb3b4474ea95d0a99e8a046c', class: "gux-input-and-error-container" }, h("div", { key: 'a8a5a626920f09415420cdb4e9f3e6be4b279eed', 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: '4a6ad15452fc7ddb08e80e6bbf72512096d67af4', name: "input" })), h(GuxFormFieldError, { key: '8ad3247396074f2901a03ef0e8b8730516665a06', show: this.hasError }, h("slot", { key: '51a86cb8c4c0aa7afcbfd6c21d4b7ce4a61503c2', name: "error" })), h(GuxFormFieldHelp, { key: 'f2e760497107c5d9f38e778898b2802de7d7598f', show: !this.hasError && this.hasHelp }, h("slot", { key: '953db9f931de9c98faa53ed05ac7aad23e9475f6', name: "help" })))));
+            } }, h("slot", { key: '399fbd6427a990fa1289c21d73eb3249ca7cc6b4', name: "input" })), h(GuxFormFieldError, { key: '797230dacb7209b2e4b3a1707b6a8395a305767d', show: this.hasError }, h("slot", { key: '74833e0052505904200713348721c7fcf25a447a', name: "error" })), h(GuxFormFieldHelp, { key: 'b1f1359ea640b61de1512d6ae91c99dbb7e97505', show: !this.hasError && this.hasHelp }, h("slot", { key: '128c2c4c7f6f28df86ef618f44cf5cd3e572f23d', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -5,9 +5,9 @@ import { a as onDisabledChange, o as onRequiredChange } from './on-attribute-cha
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { g as getSlotTextContent } from './get-slot-text-content-95a85429.js';
 import { G as GuxFormFieldError, a as GuxFormFieldHelp } from './gux-form-field-error-4d654b58.js';
-import { G as GuxFormFieldLegendLabel, a as GuxFormFieldFieldsetContainer } from './gux-form-field-fieldset-container-8d2b9425.js';
-import { v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-6cfb4f6f.js';
-import { t as trackComponent } from './usage-09e4c7d9.js';
+import { G as GuxFormFieldVisualLabel, a as GuxFormFieldScreenreaderLabel, b as GuxFormFieldFieldsetContainer } from './gux-form-field-fieldset-container-1769a15e.js';
+import { v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-46fea82d.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
 import './get-closest-element-728b9f18.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
@@ -18,7 +18,7 @@ const componentResources = {
 	required: required
 };
 
-const guxFormFieldTimePickerCss = ".gux-form-field-fieldset-container{display:flex;min-width:0;padding:0;margin:0;border:none}.gux-form-field-fieldset-container.gux-beside{flex-direction:row}.gux-form-field-fieldset-container.gux-above{flex-direction:column}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-legend-label ::slotted(label){white-space:nowrap}.gux-form-field-legend-label.gux-required::after{color:var(--gse-ui-formControl-label-indicator-requiredColor);content:\" *\"}.gux-form-field-legend-label.gux-beside{position:relative;top:var(--gse-ui-formControl-input-top);float:left;width:fit-content;min-width:45px;margin-right:var(--gse-ui-formControl-label-gap)}.gux-form-field-legend-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-legend-label.gux-screenreader{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}.gux-input-and-error-container{flex-grow:1}";
+const guxFormFieldTimePickerCss = ".gux-form-field-fieldset-container{display:flex;min-width:0;padding:0;margin:0;border:none}.gux-form-field-fieldset-container.gux-beside{flex-direction:row}.gux-form-field-fieldset-container.gux-above{flex-direction:column}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}.gux-form-field-visual-label{display:inline-flex;flex:1 0 auto}.gux-form-field-visual-label ::slotted(gux-label-info-beta){padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-visual-label.gux-required gux-form-field-label-indicator{padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-visual-label.gux-beside{position:relative;top:var(--gse-ui-formControl-input-top);width:fit-content;min-width:var(--gse-ui-formControl-input-textfield-minWidth);max-width:fit-content;margin-right:var(--gse-ui-formControl-group-gapItems)}.gux-form-field-visual-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-visual-label.gux-screenreader{display:none}.gux-form-field-screenreader-label{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}.gux-input-and-error-container{flex-grow:1}";
 const GuxFormFieldTimePickerStyle0 = guxFormFieldTimePickerCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -40,6 +40,7 @@ const GuxFormFieldTimePicker = class {
         this.required = undefined;
         this.hasError = false;
         this.hasHelp = false;
+        this.hasLabelInfo = false;
     }
     watchValue(hasError) {
         const timePickerSlot = this.root.querySelector('gux-time-picker');
@@ -48,15 +49,44 @@ const GuxFormFieldTimePicker = class {
         }
     }
     onMutation() {
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
     }
+    handleKeyup(event) {
+        var _a;
+        switch (event.key) {
+            case 'Tab': {
+                if (this.input.matches(':focus-within')) {
+                    void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.showTooltip());
+                    this.hideLabelInfoTimeout = setTimeout(() => {
+                        var _a;
+                        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+                    }, 6000);
+                }
+                break;
+            }
+            default: {
+                if (this.input.matches(':focus-within')) {
+                    clearTimeout(this.hideLabelInfoTimeout);
+                }
+                break;
+            }
+        }
+    }
+    onFocusout() {
+        var _a;
+        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+        clearTimeout(this.hideLabelInfoTimeout);
+    }
     async componentWillLoad() {
         this.getI18nValue = await buildI18nForComponent(this.root, componentResources);
         this.setInput();
         this.setLabel();
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
+        this.hasLabelInfo = hasSlot(this.root, 'label-info');
         trackComponent(this.root, { variant: this.variant });
     }
     disconnectedCallback() {
@@ -69,17 +99,18 @@ const GuxFormFieldTimePicker = class {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '567e8415a3056f89a631927079a8853dfa3be29d', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '885ad3676005e7ef8b42d4a57975a8106ede917c', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '19bd0809e858a22af995909e15304040f6a8d0ee', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: 'ba77f4248745a859c40fa02d576df03296ac740a', class: "gux-input-and-error-container" }, h("div", { key: '5d4482c64e9dd26b09d555c478c5bbb9ce05dcc1', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: 'bd16f2509036be8ed9accbbce974b3957b0ca423', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: 'fc1f9321ca0a297c6b3bd8b13af88bfc8c7f87f0' }, (_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: '1f506df71beeb9068ea26ffa74dd413ed8eecc89', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'dc34aa447c7b720a04edd72fb7dd192fde747baa', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '73b6105b2076dacd64527990b8a0b3aa783d124f', variant: "required", required: this.required }), h("slot", { key: '115ddb550dd5bcf9f3495a109aa524b31f4c9f4d', name: "label-info" })), h("div", { key: '63af6d9cdd5793ac7a764c449bf5e71507c02580', class: "gux-input-and-error-container" }, h("div", { key: 'd2692c414be3cd7481285fb3569862e4151479c7', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'a42797e638481307999e2642017967c5d64a36c6', class: {
+            } }, h("div", { key: '3ee8b3b75baaf416f618ff9bdd211ad5f699ba65', class: {
                 'gux-time-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: 'a6377d5ccf68b6c71aad7f24d08e8e350b621ca2' }))), h(GuxFormFieldError, { key: '6e9d3e43724562991bee6e4e4460416409bb2120', show: this.hasError }, h("slot", { key: '84468b92e25b1d05c0f986f3843002c7cb9eaa78', name: "error" })), h(GuxFormFieldHelp, { key: 'ed2b787bb6a6cce1183f2da2760322de1b8c7ae1', show: !this.hasError && this.hasHelp }, h("slot", { key: '9e51298096553178c7ebef0fb56209db18cb7eed', name: "help" })))));
+            } }, h("slot", { key: 'd658d265fa0172d60ec07d804cefac8530f3c549' }))), h(GuxFormFieldError, { key: '83d10344b28bd3d955a62471523d575aaafd5b74', show: this.hasError }, h("slot", { key: '7b20eb00e85eff6abb42fe6fad1d03a1cf822870', name: "error" })), h(GuxFormFieldHelp, { key: '5bbbeb9e59b2c8812fcbaa49e6dc9e0e49a2a83d', show: !this.hasError && this.hasHelp }, h("slot", { key: 'fea51cb027c05f4df03a17c751e4dd152acc7bd4', name: "help" })))));
     }
-    renderScreenReaderText(text, condition = true) {
+    renderText(text, condition = false) {
         if (condition) {
-            return (h("gux-screen-reader-beta", null, text));
+            return ' ' + text;
         }
     }
     get variant() {
@@ -90,16 +121,16 @@ const GuxFormFieldTimePicker = class {
         return `${type}-${labelPositionVariant}`;
     }
     setInput() {
-        this.timePickerElement = this.root.querySelector('gux-time-picker');
-        this.disabled = this.timePickerElement.disabled;
-        this.required = this.timePickerElement.required;
-        this.disabledObserver = onDisabledChange(this.timePickerElement, (disabled) => {
+        this.input = this.root.querySelector('gux-time-picker');
+        this.disabled = this.input.disabled;
+        this.required = this.input.required;
+        this.disabledObserver = onDisabledChange(this.input, (disabled) => {
             this.disabled = disabled;
         });
-        this.requiredObserver = onRequiredChange(this.timePickerElement, (required) => {
+        this.requiredObserver = onRequiredChange(this.input, (required) => {
             this.required = required;
         });
-        validateFormIds(this.root, this.timePickerElement);
+        validateFormIds(this.root, this.input);
     }
     setLabel() {
         this.label = this.root.querySelector('label[slot="label"]');

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

@@ -5,9 +5,9 @@ import { a as onDisabledChange, o as onRequiredChange } from './on-attribute-cha
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 import { g as getSlotTextContent } from './get-slot-text-content-95a85429.js';
 import { G as GuxFormFieldError, a as GuxFormFieldHelp } from './gux-form-field-error-4d654b58.js';
-import { G as GuxFormFieldLegendLabel, a as GuxFormFieldFieldsetContainer } from './gux-form-field-fieldset-container-8d2b9425.js';
-import { v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-6cfb4f6f.js';
-import { t as trackComponent } from './usage-09e4c7d9.js';
+import { G as GuxFormFieldVisualLabel, a as GuxFormFieldScreenreaderLabel, b as GuxFormFieldFieldsetContainer } from './gux-form-field-fieldset-container-1769a15e.js';
+import { v as validateFormIds, a as getComputedLabelPosition } from './gux-form-field.service-46fea82d.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
 import './get-closest-element-728b9f18.js';
 import './random-html-id-81ac821b.js';
 import './log-error-274efeb7.js';
@@ -18,7 +18,7 @@ const componentResources = {
 	required: required
 };
 
-const guxFormFieldTimeZonePickerCss = ".gux-form-field-fieldset-container{display:flex;min-width:0;padding:0;margin:0;border:none}.gux-form-field-fieldset-container.gux-beside{flex-direction:row}.gux-form-field-fieldset-container.gux-above{flex-direction:column}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-legend-label ::slotted(label){white-space:nowrap}.gux-form-field-legend-label.gux-required::after{color:var(--gse-ui-formControl-label-indicator-requiredColor);content:\" *\"}.gux-form-field-legend-label.gux-beside{position:relative;top:var(--gse-ui-formControl-input-top);float:left;width:fit-content;min-width:45px;margin-right:var(--gse-ui-formControl-label-gap)}.gux-form-field-legend-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-legend-label.gux-screenreader{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}.gux-input-and-error-container{flex-grow:1}";
+const guxFormFieldTimeZonePickerCss = ".gux-form-field-fieldset-container{display:flex;min-width:0;padding:0;margin:0;border:none}.gux-form-field-fieldset-container.gux-beside{flex-direction:row}.gux-form-field-fieldset-container.gux-above{flex-direction:column}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}.gux-form-field-visual-label{display:inline-flex;flex:1 0 auto}.gux-form-field-visual-label ::slotted(gux-label-info-beta){padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-visual-label.gux-required gux-form-field-label-indicator{padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-visual-label.gux-beside{position:relative;top:var(--gse-ui-formControl-input-top);width:fit-content;min-width:var(--gse-ui-formControl-input-textfield-minWidth);max-width:fit-content;margin-right:var(--gse-ui-formControl-group-gapItems)}.gux-form-field-visual-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-visual-label.gux-screenreader{display:none}.gux-form-field-screenreader-label{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}.gux-input-and-error-container{flex-grow:1}";
 const GuxFormFieldTimeZonePickerStyle0 = guxFormFieldTimeZonePickerCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -40,6 +40,7 @@ const GuxFormFieldTimeZonePicker = class {
         this.required = undefined;
         this.hasError = false;
         this.hasHelp = false;
+        this.hasLabelInfo = false;
     }
     watchValue(hasError) {
         const timeZonePickerSlot = this.root.querySelector('gux-time-zone-picker-beta');
@@ -48,15 +49,45 @@ const GuxFormFieldTimeZonePicker = class {
         }
     }
     onMutation() {
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
     }
+    handleKeyup(event) {
+        var _a, _b;
+        switch (event.key) {
+            case 'Tab': {
+                if (this.input.matches(':focus-within')) {
+                    void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.showTooltip());
+                    this.hideLabelInfoTimeout = setTimeout(() => {
+                        var _a;
+                        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+                    }, 6000);
+                }
+                break;
+            }
+            default: {
+                if (this.input.matches(':focus-within')) {
+                    void ((_b = this.labelInfo) === null || _b === void 0 ? void 0 : _b.hideTooltip());
+                    clearTimeout(this.hideLabelInfoTimeout);
+                }
+                break;
+            }
+        }
+    }
+    onFocusout() {
+        var _a;
+        void ((_a = this.labelInfo) === null || _a === void 0 ? void 0 : _a.hideTooltip());
+        clearTimeout(this.hideLabelInfoTimeout);
+    }
     async componentWillLoad() {
         this.getI18nValue = await buildI18nForComponent(this.root, componentResources);
         this.setInput();
         this.setLabel();
+        this.labelInfo = this.root.querySelector('[slot=label-info]');
         this.hasError = hasSlot(this.root, 'error');
         this.hasHelp = hasSlot(this.root, 'help');
+        this.hasLabelInfo = hasSlot(this.root, 'label-info');
         trackComponent(this.root, { variant: this.variant });
     }
     disconnectedCallback() {
@@ -69,16 +100,17 @@ const GuxFormFieldTimeZonePicker = class {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '15ffed26b936f5d57f7839012009e29a5612b2ae', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '721b5ad0a2679aed79890808338c940b30d479c2', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '9906b0708f0361f70d92dac5a7da230afd851fa6', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '4e6870799ce3cfc28dc0009ad72486e1574f4bc6', class: "gux-input-and-error-container" }, h("div", { key: '2104167a9235bfeb76a5f8b893982c32501214f5', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: 'cd7a52de8202d9e8e96ed0ae2fb91e3d828e0057', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: 'c1e0a47c46fa60b6b85709f7d37534d569879dc1' }, (_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: '3f689034df08073eca1f35b0e13e712bbc128fa2', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'bd7c6b19318c913dbe2aa81c679d5c8771185447', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'e851d78b940f5f7acfa3a5204df16a2bc63d5b82', variant: "required", required: this.required }), h("slot", { key: '40b42c8fe3f164a20c1908b24dc801005360e732', name: "label-info" })), h("slot", { key: '3e566ee0225e91891d53bfc7af5144d92389ba09', name: "label-info" }), h("div", { key: '43014eb26b0393aeae60fcf8f35c9a721dea08a9', class: "gux-input-and-error-container" }, h("div", { key: 'f4f45913f2a8226ab5760af4ff13be713c3901fc', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError,
                 'gux-time-zone-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: 'b486aa93ebb8c1cefe20aa8e387717ba73ac4514' })), h(GuxFormFieldError, { key: '994796fc6a3b3e504d57ca44812638934b63e2ac', show: this.hasError }, h("slot", { key: '5adf48d91774ab8ab67b2606d05079d8ba186635', name: "error" })), h(GuxFormFieldHelp, { key: 'b5bd31ce326bfe81663c08cb341f0117b97cdc83', show: !this.hasError && this.hasHelp }, h("slot", { key: 'a57644c2e2771833535ccd85c284442ffcf890a2', name: "help" })))));
+            } }, h("slot", { key: '81b73b33dca30f5d6c5f063255a7993e6624e028' })), h(GuxFormFieldError, { key: 'd64cd9cb465aade7d6dae6c627c64005d57fb3ee', show: this.hasError }, h("slot", { key: '6b65ea0a3f59e25b8a82ddad9bc88ba1284fb0ef', name: "error" })), h(GuxFormFieldHelp, { key: '2a511ab56e7abc242a58aadb1de277ce757a0f8e', show: !this.hasError && this.hasHelp }, h("slot", { key: '8c7093c30053111c12a4a1127f6feef81b6c646b', name: "help" })))));
     }
-    renderScreenReaderText(text, condition = true) {
+    renderText(text, condition = false) {
         if (condition) {
-            return (h("gux-screen-reader-beta", null, text));
+            return ' ' + text;
         }
     }
     get variant() {
@@ -89,16 +121,16 @@ const GuxFormFieldTimeZonePicker = class {
         return `${type}-${labelPositionVariant}`;
     }
     setInput() {
-        this.timeZonePickerElement = this.root.querySelector('gux-time-zone-picker-beta');
-        this.disabled = this.timeZonePickerElement.disabled;
-        this.required = this.timeZonePickerElement.required;
-        this.disabledObserver = onDisabledChange(this.timeZonePickerElement, (disabled) => {
+        this.input = this.root.querySelector('gux-time-zone-picker-beta');
+        this.disabled = this.input.disabled;
+        this.required = this.input.required;
+        this.disabledObserver = onDisabledChange(this.input, (disabled) => {
             this.disabled = disabled;
         });
-        this.requiredObserver = onRequiredChange(this.timeZonePickerElement, (required) => {
+        this.requiredObserver = onRequiredChange(this.input, (required) => {
             this.required = required;
         });
-        validateFormIds(this.root, this.timeZonePickerElement);
+        validateFormIds(this.root, this.input);
     }
     setLabel() {
         this.label = this.root.querySelector('label[slot="label"]');

package/dist/esm/{gux-form-field.service-6cfb4f6f.js → gux-form-field.service-46fea82d.js}

@@ -32,7 +32,7 @@ function getComputedLabelPosition(label, labelPosition) {
     }
 }
 function validateFormIds(root, input) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e, _f;
     if (hasLabelSlot(root)) {
         const label = root.querySelector('label[slot="label"]');
         const inputHasId = Boolean(input.hasAttribute('id'));
@@ -88,6 +88,21 @@ function validateFormIds(root, input) {
             .getAttribute('aria-describedby')) === null || _d === void 0 ? void 0 : _d.split(' ').filter(id => !id.startsWith(`gux-form-field-help`))) || [];
         input.setAttribute('aria-describedby', describedByIds.join(' '));
     }
+    if (hasSlot(root, 'label-info')) {
+        const labelInfo = root.querySelector('[slot="label-info"]');
+        const labelInfoId = randomHTMLId('gux-label-info-beta');
+        const describedByIds = ((_e = input
+            .getAttribute('aria-describedby')) === null || _e === void 0 ? void 0 : _e.split(' ').filter(id => !id.startsWith(`gux-label-info-beta`))) || [];
+        labelInfo.setAttribute('id', labelInfoId);
+        describedByIds.push(labelInfoId);
+        describedByIds &&
+            input.setAttribute('aria-describedby', describedByIds.join(' '));
+    }
+    else if (input.getAttribute('aria-describedby')) {
+        const describedByIds = ((_f = input
+            .getAttribute('aria-describedby')) === null || _f === void 0 ? void 0 : _f.split(' ').filter(id => !id.startsWith(`gux-label-info-beta`))) || [];
+        input.setAttribute('aria-describedby', describedByIds.join(' '));
+    }
 }
 function setSlotAriaAttribute(root, attribute, input, slotName) {
     var _a;

package/dist/esm/gux-form-footer.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-da21b737.js';
-import { t as trackComponent } from './usage-09e4c7d9.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
 
 const guxFormFooterCss = ":host ::slotted(footer){display:flex;align-items:center;justify-content:flex-start;padding:var(--gse-semantic-forms-formFooter-verticalPadding) var(--gse-semantic-forms-margin);margin-top:var(--gse-semantic-forms-formBody-paddingBottom);border-top:var(--gse-ui-formFooter-separator-width) var(--gse-ui-formFooter-separator-style) var(--gse-ui-formFooter-separator-color)}:host(.gux-form-footer-page-desktop) ::slotted(footer){gap:var(--gse-ui-formFooter-page-desktop-gap);padding:var(--gse-ui-formFooter-page-desktop-topPadding) var(--gse-ui-formFooter-page-desktop-horizontalPadding) var(--gse-ui-formFooter-page-desktop-bottomPadding) var(--gse-ui-formFooter-page-desktop-horizontalPadding)}:host(.gux-form-footer-page-mobile) ::slotted(footer){flex-direction:column;gap:var(--gse-ui-formFooter-page-mobile-gap);align-items:stretch;justify-content:center;padding:var(--gse-ui-formFooter-page-mobile-topPadding) var(--gse-ui-formFooter-page-mobile-horizontalPadding) var(--gse-ui-formFooter-page-mobile-bottomPadding) var(--gse-ui-formFooter-page-mobile-horizontalPadding)}:host(.gux-form-footer-side-sheet-desktop) ::slotted(footer){gap:var(--gse-ui-formFooter-sideSheet-desktop-gap);padding:var(--gse-ui-formFooter-sideSheet-desktop-topPadding) var(--gse-ui-formFooter-sideSheet-desktop-horizontalPadding) var(--gse-ui-formFooter-sideSheet-desktop-bottomPadding) var(--gse-ui-formFooter-sideSheet-desktop-horizontalPadding)}:host(.gux-form-footer-modal-desktop) ::slotted(footer){gap:var(--gse-ui-formFooter-sideSheet-desktop-gap);justify-content:flex-end;padding:var(--gse-ui-formFooter-modal-desktop-topPadding) var(--gse-ui-formFooter-modal-desktop-horizontalPadding) var(--gse-ui-formFooter-modal-desktop-bottomPadding) var(--gse-ui-formFooter-modal-desktop-horizontalPadding)}";
 const GuxFormFooterStyle0 = guxFormFooterCss;

package/dist/esm/gux-icon-tooltip-beta.entry.js

@@ -0,0 +1,36 @@
+import { r as registerInstance, h, g as getElement } from './index-da21b737.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
+import { g as getSlotTextContent } from './get-slot-text-content-95a85429.js';
+
+const guxIconTooltipCss = ".gux-icon-tooltip{width:fit-content;padding:0;line-height:0;background-color:transparent;border:none;border-radius:var(--gse-ui-formControl-label-tooltipTrigger-borderRadius)}.gux-icon-tooltip gux-tooltip{padding-inline-start:0}.gux-icon-tooltip gux-icon{color:var(--gse-ui-formControl-label-tooltipTrigger-optionalColor);vertical-align:bottom}";
+const GuxIconTooltipBetaStyle0 = guxIconTooltipCss;
+
+const GuxIconTooltip = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.iconName = undefined;
+        this.placement = 'right';
+    }
+    componentWillLoad() {
+        trackComponent(this.root);
+    }
+    /*
+     * Show tooltip
+     */
+    async showTooltip() {
+        return await this.tooltip.showTooltip();
+    }
+    /*
+     * Hide tooltip
+     */
+    async hideTooltip() {
+        return await this.tooltip.hideTooltip();
+    }
+    render() {
+        return (h("div", { key: '3f75501370f8559bb18fc29ca3d9e37aa0a45255', class: "gux-icon-tooltip" }, h("gux-screen-reader-beta", { key: '20a8c51282437c0ef07e3016786e8f7c4fa8e6b0' }, h("slot", { key: 'da380d60ce08aa86220dbec37865f08d267b5ced', name: "content" })), h("gux-icon", { key: '3761341ef5966ef321e8eb8a251e87d76d6fd480', "icon-name": this.iconName, size: "small", decorative: true }), h("gux-tooltip-beta", { key: '66cd0158ffe6bc4bb47ff089c68a6bbfd85c06a4', placement: this.placement, ref: el => (this.tooltip = el) }, h("div", { key: 'bec88a9f896f9756ded8219a92924c35c94d9fab', slot: "content" }, getSlotTextContent(this.root, 'content')))));
+    }
+    get root() { return getElement(this); }
+};
+GuxIconTooltip.style = GuxIconTooltipBetaStyle0;
+
+export { GuxIconTooltip as gux_icon_tooltip_beta };

package/dist/esm/gux-icon.entry.js

@@ -1,5 +1,5 @@
 import { a as getAssetPath, r as registerInstance, h, g as getElement } from './index-da21b737.js';
-import { t as trackComponent } from './usage-09e4c7d9.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
 import { l as logError } from './log-error-274efeb7.js';
 
 const legacyIconNames = [
@@ -545,7 +545,7 @@ const GuxIcon = class {
         return svgElement.outerHTML;
     }
     render() {
-        return (this.svgHtml && (h("div", { key: 'c9f06d9670d3832359a62fa531e82c17e40caf2c', class: "gux-icon-container", innerHTML: this.svgHtml })));
+        return (this.svgHtml && (h("div", { key: '4de002dd6d2408b201277c6d3665e1825e899e96', class: "gux-icon-container", innerHTML: this.svgHtml })));
     }
     static get assetsDirs() { return ["icons"]; }
     get root() { return getElement(this); }

package/dist/esm/gux-inline-alert.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, g as getElement } from './index-da21b737.js';
 import { b as buildI18nForComponent } from './index-3f1e5ba8.js';
-import { t as trackComponent } from './usage-09e4c7d9.js';
+import { t as trackComponent } from './usage-dd9c1784.js';
 import './get-closest-element-728b9f18.js';
 
 const info = "Information alert with message";
@@ -41,10 +41,10 @@ const GuxAlert = class {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: '441d71a8c6cfe5e0c7c1dfe62b70d7a607503d32', class: {
+        return (h("div", { key: '3f7a988f3399a0ed980c388d6c3c0f366e1be9f1', class: {
                 'gux-inline-alert': true,
                 [`gux-${this.accent}`]: true
-            } }, h("div", { key: 'aec305145d4cc0c58fe7b3762a6cd77fb4551787', class: "gux-message-wrapper" }, h("gux-icon", { key: '636814087e9f5d3acb4228cccd1aa28f59ec2966', "icon-name": this.getIcon(this.accent), decorative: true }), h("div", { key: '50a2b862dabc781d586b46e8ee8e3a2a5f39c114', class: "gux-sr-only" }, this.i18n(this.accent)), h("div", { key: '89980c218894c919fc1577f1d330458b007df78b', class: "gux-content" }, h("slot", { key: 'd083d3e2d5cdabf5b19f4b92ff2202dadccc7cd2', name: "content" }, h("slot", { key: '76ce00860b2058b3993a759a30c92e40b944db54' }))))));
+            } }, h("div", { key: 'ba1716c5cd54ed2c59613e2f3688f12973a047f6', class: "gux-message-wrapper" }, h("gux-icon", { key: 'f8e371d3e4fecc7704083ae7467f2b39f4bc53d1', "icon-name": this.getIcon(this.accent), decorative: true }), h("div", { key: '5dcddaaa4459358757b1f7d0751521d31e40510a', class: "gux-sr-only" }, this.i18n(this.accent)), h("div", { key: '82fb28d33dd951506a1b2fbaf51e36c123364ff5', class: "gux-content" }, h("slot", { key: '20d27aee6d02d133f5fdfac4379ae15897f66321', name: "content" }, h("slot", { key: '2e24cd792085c73b1cb0d413d0d17024b9bce856' }))))));
     }
     get root() { return getElement(this); }
 };