genesys-spark-components 4.67.0 → 4.68.0

package/dist/cjs/gux-flyout-menu.cjs.entry.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-7fb02c8c.js');
 const floatingUi_dom_esm = require('./floating-ui.dom.esm-f8b4cd90.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 const guxMenu_common = require('./gux-menu.common-4025206c.js');
 
-const guxFlyoutMenuCss = ":host{z-index:var(--gse-semantic-zIndex-popover);color:var(--gse-ui-menu-option-label-foregroundColor);cursor:default}:host(:focus){outline:none}:host(:focus-visible){outline:var(--gse-semantic-focusRing-default-border-color) var(--gse-semantic-focusRing-default-border-style) var(--gse-semantic-focusRing-default-border-width);outline-offset:var(--gse-semantic-focusRing-offset)}.gux-flyout-menu-content{position:fixed;display:none;border:none;border-radius:var(--gse-ui-menu-borderRadius)}.gux-flyout-menu-content.gux-shown{display:flex}.gux-flyout-menu-content .gux-arrow{position:absolute;z-index:-1;width:var(--gse-ui-popover-anchor-width);height:var(--gse-ui-popover-anchor-height);background:var(--gse-ui-popover-backgroundColor);border:none;box-shadow:var(--gse-ui-menu-boxShadow-x) var(--gse-ui-menu-boxShadow-y) var(--gse-ui-menu-boxShadow-blur) var(--gse-ui-menu-boxShadow-spread) var(--gse-ui-menu-boxShadow-color)}";
+const guxFlyoutMenuCss = ":host{z-index:var(--gse-semantic-zIndex-popover);color:var(--gse-ui-menu-option-label-foregroundColor);cursor:default}:host(:focus){outline:none}:host(:focus-visible){outline:var(--gse-semantic-focusRing-default-border-color) var(--gse-semantic-focusRing-default-border-style) var(--gse-semantic-focusRing-default-border-width);outline-offset:var(--gse-semantic-focusRing-offset)}.gux-flyout-menu-content{position:fixed;display:none;border:none;border-radius:var(--gse-ui-menu-borderRadius)}.gux-flyout-menu-content.gux-shown{display:flex}.gux-flyout-menu-content .gux-arrow{position:absolute;width:var(--gse-ui-popover-anchor-width);height:var(--gse-ui-popover-anchor-height);padding-bottom:4px;overflow:hidden}.gux-flyout-menu-content .gux-arrow-caret{width:0;height:0;filter:drop-shadow(var(--gse-ui-popover-boxShadow-x) var(--gse-ui-popover-boxShadow-y) calc(var(--gse-ui-popover-boxShadow-blur) / 2) var(--gse-ui-tooltip-boxShadow-color));border-top:calc(var(--gse-ui-popover-anchor-width) / 2) solid var(--gse-ui-popover-backgroundColor);border-right:calc(var(--gse-ui-popover-anchor-width) / 2) solid transparent;border-left:calc(var(--gse-ui-popover-anchor-width) / 2) solid transparent}";
 const GuxFlyoutMenuStyle0 = guxFlyoutMenuCss;
 
 const GuxFlyoutMenu = class {
@@ -99,7 +99,6 @@ const GuxFlyoutMenu = class {
     updatePosition() {
         // This is 13 because this makes the arrow look aligned
         const arrowLen = 13;
-        const borderWidth = 1;
         if (this.root) {
             void floatingUi_dom_esm.computePosition(this.targetElement, this.menuContentElement, {
                 placement: 'bottom-start',
@@ -126,6 +125,12 @@ const GuxFlyoutMenu = class {
                     bottom: 'top',
                     left: 'right'
                 }[side];
+                const arrowRotation = {
+                    top: 0,
+                    right: 90,
+                    bottom: 180,
+                    left: -90
+                }[side];
                 if (middlewareData.arrow) {
                     const { x, y } = middlewareData.arrow;
                     Object.assign((_a = this.arrowElement) === null || _a === void 0 ? void 0 : _a.style, {
@@ -133,8 +138,8 @@ const GuxFlyoutMenu = class {
                         top: y != null ? `${y}px` : '',
                         right: '',
                         bottom: '',
-                        [staticSide]: `${-arrowLen / 2 - borderWidth}px`,
-                        transform: 'rotate(-45deg)'
+                        [staticSide]: `${-arrowLen}px`,
+                        transform: `rotate(${arrowRotation}deg)`
                     });
                 }
             });
@@ -171,10 +176,10 @@ const GuxFlyoutMenu = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '1acb09a1f3e783b3a1d56c2f41aca77008d66845', tabIndex: 0, "aria-haspopup": "true" }, index.h("span", { key: 'e52eb8f2f8ccccaf129054c4ff81d58b5ddfe2d2', ref: el => (this.targetElement = el) }, index.h("slot", { key: '4e3685669a6f8f109b67e447ed37b3c32fa1f143', name: "target" })), index.h("div", { key: '8b578fcf85f62b614ff8bee35a0a326972cbe9ca', class: {
+        return (index.h(index.Host, { key: '3a57e1bea9c8ba547849e8975a45f0cec5e16587', tabIndex: 0, "aria-haspopup": "true" }, index.h("span", { key: 'e6e2e0851c0d12806bbbe89fa799f80867d428fb', ref: el => (this.targetElement = el) }, index.h("slot", { key: '95155de5c8d9b4a4871302f33b650a8da0cdebc5', name: "target" })), index.h("div", { key: '236a63c0c8a888df386c57569a387b16d7b1a111', class: {
                 'gux-flyout-menu-content': true,
                 'gux-shown': this.isShown
-            }, ref: el => (this.menuContentElement = el) }, index.h("div", { key: '3fa2563f223d425561f12dc4a2bd1f5c12afc46b', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), index.h("slot", { key: '854d0c0a021ab9754a8e5fc50644a029896c11c8', name: "menu" }))));
+            }, ref: el => (this.menuContentElement = el) }, index.h("div", { key: '5eca899d1973df57ca76f621a69efea5c7698473', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, index.h("div", { key: '2371e0ad36a907f78932e753f7f73e800e6096b6', class: "gux-arrow-caret" })), index.h("slot", { key: '9a95cf351f93d214c2239b8ecf03b0cea27d46cf', name: "menu" }))));
     }
     get root() { return index.getElement(this); }
 };

package/dist/cjs/gux-form-field-checkbox.cjs.entry.js

@@ -8,7 +8,7 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 const guxFormField_service = require('./gux-form-field.service-57a00684.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
@@ -51,10 +51,10 @@ const GuxFormFieldCheckbox = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'dbc5b820711914bae07225ad9b1811a854e7ad28', class: {
+        return (index.h(index.Host, { key: 'dee0442f1e572b4d987e3b5a0560de13622453b1', class: {
                 'gux-input-error': this.hasError,
                 'gux-disabled': this.disabled
-            } }, index.h("div", { key: '186bcc2e645fce34ff39d7b2d696cf7c7d58131b', class: "gux-form-field-container" }, index.h("div", { key: '91220d71212ae4b89c44e0a790db090b935bbc88', class: "gux-input-label" }, index.h("div", { key: '1d87509253e088d326b210641b4db5681274a0b1', class: "gux-input" }, index.h("slot", { key: '87d57b5275189477095effcfea5e302190feebd4', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: 'b80f9c7374c178938701ae94c5387e3112e7a294', class: `gux-label-${this.labelPosition}` }, index.h("slot", { key: '8b4ea705ea70dfabb4fc0fe533da4b257c814bb5', name: "label" }))), index.h("div", { key: 'e747b80480bf4452b100f2bc85034c05bc32eb96', class: "error-and-help-text" }, index.h(guxFormFieldError.GuxFormFieldError, { key: '1173252d333786c6560c43ffdad803dcd02bffff', show: this.hasError }, index.h("slot", { key: '1d9f2b06eb3ae099a510b314354cbcd5ffbbdb1f', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'd6cbc4777257dd64a53160a6aa6f6577d088c45b', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '0338e7913998dce8886c45899cd0d2312e3b902b', name: "help" }))))));
+            } }, index.h("div", { key: '0928db5746d7bbce8210cc75ab5ab2d95a05fdcd', class: "gux-form-field-container" }, index.h("div", { key: '783384edaee35f8bce42b1a048001e6e73e0892d', class: "gux-input-label" }, index.h("div", { key: '7407bc64c2870a2c900d3ec1a166a569d947ed76', class: "gux-input" }, index.h("slot", { key: 'a8e3e79c4a4f3ca18d2b44c81e319f7ec25e9f0c', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: 'e532eb9aa6932518eb55a35b93e0e6867a6f886e', class: `gux-label-${this.labelPosition}` }, index.h("slot", { key: '0dd9ad2ca420a8a5876dfd309e09c6eac5318829', name: "label" }))), index.h("div", { key: 'e212774341421a73caed19db23bac5d805a1a573', class: "error-and-help-text" }, index.h(guxFormFieldError.GuxFormFieldError, { key: 'f6617a568e74bfa5e696253315852187d2f064be', show: this.hasError }, index.h("slot", { key: '745b35f338ee3f3bd58151623e134722eea239e5', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '1ffae08152920fb4847fa01c5d0ca64db35048f4', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'dba436e95dbc3b789b4dd598f5a87bfa4361ad17', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition.toLowerCase();

package/dist/cjs/gux-form-field-color.cjs.entry.js

@@ -11,12 +11,12 @@ const hasSlot = require('./has-slot-3edae188.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
 const guxFormField_service = require('./gux-form-field.service-57a00684.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
 
-const guxFormFieldColorCss = ".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:0 1 auto;align-self:auto;order:0;width:var(--gse-ui-colorPicker-input-swatchSizing);min-width:var(--gse-ui-colorPicker-input-swatchSizing);height:var(--gse-ui-colorPicker-input-swatchSizing);padding:0;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);color:var(--gse-ui-formControl-input-populatedColor);text-align:right;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}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:center}.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;align-self:auto;order:0;width:var(--gse-ui-formControl-input-colorPicker-size);height:var(--gse-ui-formControl-input-colorPicker-size);font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);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-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{cursor:pointer;border-color: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 guxFormFieldColorCss = ".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-textBold-fontFamily);font-size:var(--gse-ui-formControl-label-textBold-fontSize);font-weight:var(--gse-ui-formControl-label-textBold-fontWeight);line-height:var(--gse-ui-formControl-label-textBold-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(input){flex:0 1 auto;align-self:auto;order:0;width:var(--gse-ui-colorPicker-input-swatchSizing);min-width:var(--gse-ui-colorPicker-input-swatchSizing);height:var(--gse-ui-colorPicker-input-swatchSizing);padding:0;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);color:var(--gse-ui-formControl-input-populatedColor);text-align:right;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}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:center}.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;align-self:auto;order:0;width:var(--gse-ui-formControl-input-colorPicker-size);height:var(--gse-ui-formControl-input-colorPicker-size);font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);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-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{cursor:pointer;border-color: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 GuxFormFieldColorStyle0 = guxFormFieldColorCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -88,13 +88,13 @@ const GuxFormFieldColor = class {
         }
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'f92e953034fbbe4f864248608c3a25404829062c', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'cd4f2a3d91a25f63cd254a54868b5182767f42c2', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: 'ee0773dcaf16f82184811d17ef1f58a13ae0cdf2', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'eff53af5d047f4bb14dae0a2357fe8fc679ab5e6', variant: "required", required: this.required }), index.h("slot", { key: 'eb28e019d6ed98b186f45bcc2756717ff2bcb57f', name: "label-info" })), index.h("div", { key: '187fc972554c6f0d7880a01e701043ac9d7d065d', class: "gux-input-and-error-container" }, index.h("div", { key: '80752846a3df0102b698407ec1dd0b546b447d68', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '0bc6791fef204c4f1695eac9b9e81c8fafdcd5aa', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '605eb31afd984a20faa2b2050df96834f5e6955d', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '9294fd2a8d4ebc7421f26edfe4566eed3e0ecb20', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '103addd93f9c42465a7372a5a4a3f20283080f76', variant: "required", required: this.required }), index.h("slot", { key: 'aaf912c0fba76c666d5a64f40745edb92a4c0142', name: "label-info" })), index.h("div", { key: 'c43d73275bd4d87390a0c8c6fc6bbb43deba89d1', class: "gux-input-and-error-container" }, index.h("div", { key: 'eb165c18249a3e97d36cddb3e789763b7c07dcb2', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: '6cfea92820ee7bb5adb8dbdcf91ee1cb7e96719a', class: {
+            } }, index.h("div", { key: '71a5695af21256cc7564c83046ba3d628dd991e7', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("slot", { key: 'cb427702841a197a2cf5690e354e10829d0e8609', name: "input", onSlotchange: () => this.setInput() }))), index.h(guxFormFieldError.GuxFormFieldError, { key: 'a112c9e846436ad66eb355e59c6f316b3f264cda', show: this.hasError }, index.h("slot", { key: '73921eb2a20829dfc743f4a29139dc444082f213', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '44d2a5be7d27fd223393e092f548fd5974570240', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'fbb93ca9d4368bbfbb38ddf4e83fc9053d95fe16', name: "help" })))));
+            } }, index.h("slot", { key: 'a8fffef5cc7fef1de7dddb0cc1463f39f5fb4a6b', name: "input", onSlotchange: () => this.setInput() }))), index.h(guxFormFieldError.GuxFormFieldError, { key: 'fc56b4d472b06ca651417c5eba70c5b1ee2aa36f', show: this.hasError }, index.h("slot", { key: '1db20e7effe6a57bac9f16215d51e6721e05d204', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '744072356234864296661edde9535d56773820af', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'a9fd83d7589d34a7b25cdb6df5112378b0221fbd', name: "help" })))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

package/dist/cjs/gux-form-field-dropdown.cjs.entry.js

@@ -11,7 +11,7 @@ const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormFieldFieldsetContainer = require('./gux-form-field-fieldset-container-bf86cba7.js');
 const getSlotTextContent = require('./get-slot-text-content-83cb3c6d.js');
 const guxFormField_service = require('./gux-form-field.service-57a00684.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 require('./get-closest-element-9e41d6b9.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
@@ -22,7 +22,7 @@ const componentResources = {
 	required: required
 };
 
-const guxFormFieldDropdownCss = ".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}: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)}.gux-input-and-error-container{flex-grow:1;width:100%}";
+const guxFormFieldDropdownCss = ".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}:host{display:block}::slotted(label){font-family:var(--gse-ui-formControl-label-textBold-fontFamily);font-size:var(--gse-ui-formControl-label-textBold-fontSize);font-weight:var(--gse-ui-formControl-label-textBold-fontWeight);line-height:var(--gse-ui-formControl-label-textBold-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}.gux-input-and-error-container{flex-grow:1;width:100%}";
 const GuxFormFieldDropdownStyle0 = guxFormFieldDropdownCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -106,11 +106,11 @@ const GuxFormFieldDropdown = class {
     }
     render() {
         var _a;
-        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '769d0863b4adc96bbe6733f067043ac96dea27eb', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: 'af328e637e5b57668e8a31e71a922d2c32194c82' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'help'), this.hasHelp), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), index.h(guxFormFieldFieldsetContainer.GuxFormFieldVisualLabel, { key: 'e9de0468d74cd89ca37bcef0082abc9bdf3d0c27', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'd8cf52f49ede1c0cdd7e546fd6fb01ad61a22e10', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '44e3ef7c0a5f691ab96aef8573451b94636b1331', variant: "required", required: this.required }), index.h("slot", { key: '82bca75b4f869e32bee1ddad211767a24553910d', name: "label-info" })), index.h("div", { key: '5dde879d43dfb5f1c1483595cee7ef0a279021db', class: "gux-input-and-error-container" }, index.h("div", { key: '044adc97b3ba5fee8b51c4e65628b385bec4693c', class: {
+        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '9a352ab8c07fdccf1c637f30d7acc975c9e9e515', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: 'ad8a83c58dd09d9c62b7ab0b89b39c8ff983e14c' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'help'), this.hasHelp), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), index.h(guxFormFieldFieldsetContainer.GuxFormFieldVisualLabel, { key: 'deafd07f1e5928837d6334b5c54c77cadd6c3ed5', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'a38ae7efbc8ec4fbf41b3c45e56de5c4cee0fa29', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '5d0c454ef39edccb721fb30b7023f35a31c84150', variant: "required", required: this.required }), index.h("slot", { key: 'd65940990b9bd1deab10a6a3e9fc51edefc78200', name: "label-info" })), index.h("div", { key: '358fb1554f11fcf10aececdab5d9aef5806dffd9', class: "gux-input-and-error-container" }, index.h("div", { key: 'b76f74abccf55f58f1c2a325ac5798aea973c11a', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("slot", { key: 'd8d5ccf59dc3ff470c96f3941d70f2a2801c1a73' })), index.h(guxFormFieldError.GuxFormFieldError, { key: '21b34c5cfd1af2508e34023f1570c7cc395f2501', show: this.hasError }, index.h("slot", { key: '6c4295be90f42a2a195ff1bfc72fcb414775c680', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '6f6a76b4ccdfed413f0ce93e6a4073081a92fffb', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '07f4340cf8c6ee21e8875db697b8cd568e8c994c', name: "help" })))));
+            } }, index.h("slot", { key: '29ed3b19cb95dfcd8949c3a9a4d24254b3645aef' })), index.h(guxFormFieldError.GuxFormFieldError, { key: 'c6b2f11b400d1a6dcd102c6262cbefc7384bbb53', show: this.hasError }, index.h("slot", { key: '56a74cb9955061daea5c6c95bb79aae2a7062072', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'c3f7e39d954b6be98776d95d981e699e0b7932c8', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '068bdcc922d1d5aacbf06186a745361bdde2cf39', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/cjs/gux-form-field-file.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-7fb02c8c.js');
 const onMutation = require('./on-mutation-3d294d15.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
 const guxFormField_service = require('./gux-form-field.service-57a00684.js');
@@ -15,7 +15,7 @@ require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
 
-const guxFormFieldFileCss = ".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)}.gux-input-and-error-container{flex-grow:1}";
+const guxFormFieldFileCss = ".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-textBold-fontFamily);font-size:var(--gse-ui-formControl-label-textBold-fontSize);font-weight:var(--gse-ui-formControl-label-textBold-fontWeight);line-height:var(--gse-ui-formControl-label-textBold-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}.gux-input-and-error-container{flex-grow:1}";
 const GuxFormFieldFileStyle0 = guxFormFieldFileCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -103,7 +103,7 @@ const GuxFormFieldFile = class {
         return `${type}-${labelPositionVariant}`;
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'a3528820f1ce0da415f1f88cb481b24c50da1bb3', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'ad8d2fedd105b44a6d33d76dfbaebcc540c440b6', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '349c6b669d7ec163ce889e4b4c698291af62fece', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '642a9a0956b212bacdfb411342124f6a70d73e66', variant: "required", required: this.required }), index.h("slot", { key: 'ee0edc22b7c211f33192ac7b1fb078d990744c8f', name: "label-info" })), index.h("div", { key: 'f1a85660385ef5f7831446b1f1cf6a59c69d2230', class: "gux-input-and-error-container" }, index.h("slot", { key: '41ccbd999248f5c4d29480c63ac2b57d02ce59db', name: "input", onSlotchange: () => this.setInput() }), index.h(guxFormFieldError.GuxFormFieldError, { key: 'c9bf25630a50f4b8c383dd1d6f8fd38df89f458a', show: this.hasError }, index.h("slot", { key: 'b4a362e2059e1af1bfece334f1b670b875507317', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '141246a74aceff5d1895bad4da1b88fb5d8ce2ed', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '219153e535b6778eb71a75edc6d1a04d93a45968', name: "help" })))));
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '0525a78d391dc34115520686d84b2469cb03e73a', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '688782d0b2054dfd0d6d365e32f2d9c1c761bcb6', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '31e5d8f4388dafc1f72635443626c8066b55eb13', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '6e3436cf4295a44d34605d9c5ebeb703c21e2160', variant: "required", required: this.required }), index.h("slot", { key: '30daa2fa2355c361bef1f22a535de7917cfb078d', name: "label-info" })), index.h("div", { key: 'd7a20c504f8727c864699f035e913d3924447207', class: "gux-input-and-error-container" }, index.h("slot", { key: 'e3300b633b42b9b7db6a712bc4d7dd827902f24f', name: "input", onSlotchange: () => this.setInput() }), index.h(guxFormFieldError.GuxFormFieldError, { key: 'a2b928b0979b9899776d9b51d55d2b613d4269ea', show: this.hasError }, index.h("slot", { key: 'c1739682633318bc460cf17f6276809b89bbaa82', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '5bf1dd36e9a50db936e40172ebef765829aa7d4e', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '1849ec0347a435c8ae96f25cb26513831172f116', name: "help" })))));
     }
     get root() { return index.getElement(this); }
 };

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7fb02c8c.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 const index$1 = require('./index-a1a48d79.js');
 require('./get-closest-element-9e41d6b9.js');
 
@@ -24,7 +24,7 @@ const GuxFormFieldInputClearButton = class {
         this.i18n = await index$1.buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (index.h("button", { key: '396f8388e24e30c41c1cce970ffd1492668ed1ff', tabIndex: -1, type: "button", title: this.i18n('clear') }, index.h("gux-icon", { key: '28c90daa4bf9ececb2e84aa774e673eae5cd2679', "icon-name": "fa/xmark-large-regular", decorative: true })));
+        return (index.h("button", { key: 'b63d7d6a1a795cbac8b13a541fb74c8b675dd538', tabIndex: -1, type: "button", title: this.i18n('clear') }, index.h("gux-icon", { key: '5f4ce1d8150acfe8e888b47ac8c96ead4a6ea08e', "icon-name": "fa/xmark-large-regular", decorative: true })));
     }
     static get delegatesFocus() { return true; }
     get root() { return index.getElement(this); }

package/dist/cjs/gux-form-field-label-indicator.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7fb02c8c.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 
 const guxFormFieldLabelIndicatorCss = ".gux-form-field-label-indicator-required{color:var(--gse-ui-formControl-label-indicator-requiredColor)}";
 const GuxFormFieldLabelIndicatorStyle0 = guxFormFieldLabelIndicatorCss;

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

@@ -13,7 +13,7 @@ const simulateNativeEvent = require('./simulate-native-event-e88bf64f.js');
 const hasSlot = require('./has-slot-3edae188.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 const en = require('./en-66d2b744.js');
 const onClickOutside = require('./on-click-outside-6db914c3.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
@@ -31,7 +31,7 @@ const componentResources = {
 	decrement: decrement
 };
 
-const guxFormFieldNumberCss = ".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%;padding-bottom:0;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);text-align:right;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}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:center;width:100%}.gux-input-and-error-container .gux-input .gux-input-container{box-sizing:border-box;display:flex;flex:1 1 auto;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-input-gap);place-content:stretch center;align-items:center;align-self:auto;order:0;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);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-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-error .gux-input-container{border-color:var(--gse-ui-formControl-input-error-border-color)}.gux-step-buttons-container{flex:0 1 14px;align-self:auto;order:0;margin-left:var(--gse-ui-formControl-spinButton-gap)}.gux-step-buttons-container .gux-step-button{display:flex;flex:0 1 auto;align-items:center;align-self:auto;justify-content:center;order:0;padding:0;color:var(--gse-ui-formControl-input-inputIcon-defaultColor);background:transparent;border:var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) transparent}.gux-step-buttons-container .gux-step-button:not(:disabled):focus-visible,.gux-step-buttons-container .gux-step-button:not(:disabled):hover{cursor:pointer;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-step-buttons-container .gux-step-button gux-icon{flex:0 0 auto;width:14px;height:14px}";
+const guxFormFieldNumberCss = ".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-textBold-fontFamily);font-size:var(--gse-ui-formControl-label-textBold-fontSize);font-weight:var(--gse-ui-formControl-label-textBold-fontWeight);line-height:var(--gse-ui-formControl-label-textBold-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(input){flex:1 1 auto;align-self:auto;order:0;width:100%;padding-bottom:0;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);text-align:right;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}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container .gux-input{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:center;width:100%}.gux-input-and-error-container .gux-input .gux-input-container{box-sizing:border-box;display:flex;flex:1 1 auto;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-input-gap);place-content:stretch center;align-items:center;align-self:auto;order:0;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);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-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-error .gux-input-container{border-color:var(--gse-ui-formControl-input-error-border-color)}.gux-step-buttons-container{flex:0 1 14px;align-self:auto;order:0;margin-left:var(--gse-ui-formControl-spinButton-gap)}.gux-step-buttons-container .gux-step-button{display:flex;flex:0 1 auto;align-items:center;align-self:auto;justify-content:center;order:0;padding:0;color:var(--gse-ui-formControl-input-inputIcon-defaultColor);background:transparent;border:var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) transparent}.gux-step-buttons-container .gux-step-button:not(:disabled):focus-visible,.gux-step-buttons-container .gux-step-button:not(:disabled):hover{cursor:pointer;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-step-buttons-container .gux-step-button gux-icon{flex:0 0 auto;width:14px;height:14px}";
 const GuxFormFieldNumberStyle0 = guxFormFieldNumberCss;
 
 var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -114,14 +114,14 @@ const GuxFormFieldNumber = class {
     }
     render() {
         const showClearButton = this.clearable && this.hasContent && !this.disabled;
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'bd844616e9912a50b111a937633ccb42b6b2079a', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '0a5549871891eac88626d509b3f7dac2615b5ed9', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '718dbfa85a5cdd7818fbd343c2ae1293c98b8d3a', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '84829c4c2d82d003496272d0a09fe7f9eb6f5703', variant: "required", required: this.required }), index.h("slot", { key: 'd299d5edcc4c292a7d967e6849c5864172750119', name: "label-info" })), index.h("div", { key: '60467c9395c25d25d6365b194a964e04a8f37984', class: "gux-input-and-error-container" }, index.h("div", { key: '7b4002ca0cdef9eeafab4be8a21f935e5f2756a8', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '7933568b7816fa23c82e4f47f6f590dc04a06390', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '4c68d06151843ab21972d116e059b21ac96bfc79', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '54b2aac45cd433644daa6e19776d462ac783766c', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'b386246df553fd957662379ef771d4fa8f96886b', variant: "required", required: this.required }), index.h("slot", { key: 'a9ac69f91cc2835a327c1a2388677f9331c31290', name: "label-info" })), index.h("div", { key: '778ec225fa15fbb9400a4553e843a3df8c089f39', class: "gux-input-and-error-container" }, index.h("div", { key: 'c50c6a236cb308c173deac4154fbe18de4371037', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            }, part: "input-section" }, index.h("div", { key: 'b2afef44b50679f18dcbcc6ebb412ce8ffd5028a', class: {
+            }, part: "input-section" }, index.h("div", { key: 'ae16a2ef6f56fd450f5222a21e3dee12a65d63b0', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-clear': showClearButton
-            } }, index.h("slot", { key: '3ea7a185fdcab813d31d3b04cb60f840971757a0', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (index.h("gux-form-field-input-clear-button", { onClick: () => guxFormField_service.clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), index.h(guxFormFieldError.GuxFormFieldError, { key: 'f903bd2f9b7d91350490d343aa89746bcfc97585', show: this.hasError }, index.h("slot", { key: 'fff7e649267a693e5a18e8ae2c7095efd4ddb4f3', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'f1f475651ddc999a53b540a36c2cad90e8bcffc8', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '55da6946317a684039d69086e316aa6a8b5d0464', name: "help" })))));
+            } }, index.h("slot", { key: '831683b98ac47cf8910936f6a96f2227b88bb8f8', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (index.h("gux-form-field-input-clear-button", { onClick: () => guxFormField_service.clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), index.h(guxFormFieldError.GuxFormFieldError, { key: '78708993720afe3dc86fc17d647623cdd29dceb4', show: this.hasError }, index.h("slot", { key: '7ab1f64c823909396d42487f1f0c9911c52c4f56', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'da6c0e73b11b0fbde8bd453993e06ee6339dc2ee', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'a9675ff099449cbe5cec296f28caef950450cfad', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition
@@ -275,8 +275,8 @@ const GuxPaginationEllipsisButton = class {
         this.applyInputListener();
     }
     render() {
-        return (index.h(index.Host, { key: 'a188c1dce413b710c91e13f5ea4414e4de4f0d94' }, index.h("button", { key: '217631219f71adf52a7882e4104cfb4189d87351', id: "popover-target", type: "button", ref: el => (this.ellipsisButton = el), onClick: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString() }, index.h("gux-icon", { key: '854a398967e59df2ed62ed1f91f6e7e4ffdafd4d', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), index.h("gux-tooltip", { key: '3a27be4f8a205903c448649290f5983fb4eae217', for: "popover-target" }, index.h("div", { key: '543ecb926bd84e27305a86b763be0e6c655ec02c', slot: "content" }, this.i18n('goToPage'))), index.h("gux-popover", { key: '97fa5f1602cbd8368d5e492ce0ef8e93e505b9c7', "is-open": this.isOpen, for: "popover-target" }, index.h("span", { key: 'fd3efb82d2aca48c834ae9ceedf293b8f7d72f84', slot: "title" }, this.i18n('goToPage')), index.h("gux-form-field-number", { key: '4d91a45d27472a10a5025777872db3b9cc9600b4' }, index.h("input", { key: '6f1d2891a600c405abf84464bddb586cf0601b55', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1", onKeyDown: evt => ['e', 'E', '+', '-', '.'].includes(evt.key) &&
-                evt.preventDefault() }), index.h("label", { key: 'cd34ed52c6d9932dafc012eb8d92176476979a67', slot: "label" })))));
+        return (index.h(index.Host, { key: 'd6e7432da7241b1e32e3e34ecc13c02fae794954' }, index.h("button", { key: '0b0554af4a7c1609557c3c7700f1b5075c3158ac', id: "popover-target", type: "button", ref: el => (this.ellipsisButton = el), onClick: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString() }, index.h("gux-icon", { key: 'd28cfdb9e070d1461cf3e3dedb6b99eb25fc0574', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), index.h("gux-tooltip", { key: 'a9c53ce8bcc1a900227298f97ad7ecb6078a6492', for: "popover-target" }, index.h("div", { key: 'ff5e1d84f179dde70f3cc750f8c7e9efe7fb5366', slot: "content" }, this.i18n('goToPage'))), index.h("gux-popover", { key: 'd7b8f404d4bfd44bb247ddf09337b7e89a1d4abe', "is-open": this.isOpen, for: "popover-target" }, index.h("span", { key: '67a348e64bc44bedbc6becca814e462f35605f7e', slot: "title" }, this.i18n('goToPage')), index.h("gux-form-field-number", { key: 'd7c92f5a21a66f30f9f26c5203427546e3247b9b' }, index.h("input", { key: '7e81e2081b222818fde83546791802235d1afd4f', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1", onKeyDown: evt => ['e', 'E', '+', '-', '.'].includes(evt.key) &&
+                evt.preventDefault() }), index.h("label", { key: 'd321ec8e5204fbb816958422413e85ebfadb14ce', slot: "label" })))));
     }
     get root() { return index.getElement(this); }
 };
@@ -437,10 +437,10 @@ const GuxPopover = class {
         }
     }
     render() {
-        return (index.h("div", { key: '1636856365361a8e45fa477b94d6ea9acbb7b3ac', ref: (el) => (this.popupElement = el), class: {
+        return (index.h("div", { key: '444c2583793aa85b86a74a37b2dcc42aa3dc9037', ref: (el) => (this.popupElement = el), class: {
                 'gux-hidden': !this.isOpen,
                 'gux-popover-wrapper': true
-            }, "data-placement": true }, index.h("div", { key: '218fcaf5cfbab4d6c46c2b432fee2421a67a14b7', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, index.h("div", { key: 'd6458f85deff302f3b756897ead6894603d4fd14', class: "gux-arrow-caret" })), index.h("div", { key: 'cbd7052f04e354070633316a3c3c5ac544442ba3', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, index.h("slot", { key: '8675905dc5a471ca38c628caba7f15f46d9f2ebe', name: "title" }), this.renderDismissButton()), index.h("div", { key: '90289dfa658c5e425a65f5d75cada50e256be0a0', class: "gux-popover-content" }, index.h("slot", { key: '4c57be1cc853722f638fd63c4765db80393ae0b3' }))));
+            }, "data-placement": true }, index.h("div", { key: '865aacfbd91e5667682234276dcaa2a56bf77b99', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, index.h("div", { key: '1978bd54cb3033943414aa049506f0f659f77a2a', class: "gux-arrow-caret" })), index.h("div", { key: '8240de5a2cd2b27ed63ed3386001f5bf01d3d565', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, index.h("slot", { key: '319131eadce4c1d106af83c40398a7807b1e7b40', name: "title" }), this.renderDismissButton()), index.h("div", { key: '503d7a1ba3a294bff08451b9cdcb6c1c7bbe54f2', class: "gux-popover-content" }, index.h("slot", { key: '3f9d318feddcf5a0f9e6a9448ba21da628b88660' }))));
     }
     get root() { return index.getElement(this); }
 };

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

@@ -6,7 +6,7 @@ const index = require('./index-7fb02c8c.js');
 const index$1 = require('./index-a1a48d79.js');
 const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormFieldFieldsetContainer = require('./gux-form-field-fieldset-container-bf86cba7.js');
 const hasSlot = require('./has-slot-3edae188.js');
@@ -22,7 +22,7 @@ const componentResources = {
 	required: required
 };
 
-const guxFormFieldPhoneCss = ".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 guxFormFieldPhoneCss = ".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-textBold-fontFamily);font-size:var(--gse-ui-formControl-label-textBold-fontSize);font-weight:var(--gse-ui-formControl-label-textBold-fontWeight);line-height:var(--gse-ui-formControl-label-textBold-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}.gux-input-and-error-container{flex-grow:1}";
 const GuxFormFieldPhoneStyle0 = guxFormFieldPhoneCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -101,14 +101,14 @@ const GuxFormFieldPhone = class {
     }
     render() {
         var _a;
-        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '7cd455c3e6fb71c038fbaa592e6e08d29e86e07d', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: '08601e700c84bd5caa814d22ab436b195e418833' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), index.h(guxFormFieldFieldsetContainer.GuxFormFieldVisualLabel, { key: 'c12110988edb809381eb280ec80f6ecea819a5d4', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'dd2d9636c9a768509fa8a5476782ad34ccce8354', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '6aa94291315b892a6de33d3746362ad5ce9d007a', variant: "required", required: this.required }), index.h("slot", { key: 'fd5e58e5112fcaaabe7bd5cd7d124497c7f7ea98', name: "label-info" })), index.h("div", { key: '48bbe27265311a9bf329510ff68c8e13cff4b087', class: "gux-input-and-error-container" }, index.h("div", { key: '2d3a1f8c5799704242ad1752c4834b6810edb4c6', class: {
+        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '9d4c6dbffdc6bdc6ffcc837f42de50bb206928f6', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: '7169f8a5e3f9ec8ce4a3ab875bad672486c7d915' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), index.h(guxFormFieldFieldsetContainer.GuxFormFieldVisualLabel, { key: '1c01a5da652a511174ddf83a8513ac95d7dc19a4', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '97a7ba3d4a5c59f9fb646347b12739f0fff5c8c5', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'dc557c304670bc8c567d7ab43934b7eb21ce34ab', variant: "required", required: this.required }), index.h("slot", { key: '550cd3e4e3215c8de5914b60c7d70af6406ae2da', name: "label-info" })), index.h("div", { key: '8320d94a2e2aa6939f7f05e02174a6467b658b7a', class: "gux-input-and-error-container" }, index.h("div", { key: '642a2d56360fc0a94259c77db3aca4a5bfbf965f', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: '6ceb1a48dc60d604b7400ab7d80cb0e8ec8b4940', class: {
+            } }, index.h("div", { key: 'f86dd893d7f00ab5f1b84559668643ebdcaded8b', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("slot", { key: '3858fb0121cba2d4d4d366f331e25de2c045bd86' }))), index.h(guxFormFieldError.GuxFormFieldError, { key: 'fe024ed18eb6f65c1871f7fef5f6d1df516e818a', show: this.hasError }, index.h("slot", { key: '2299ab38fbd2f86e3a3852b7e2842becc84c0703', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '24e4c552c4ba13fefd0a0e321040e02b7d7c1697', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '39140e39353a3433befa751ccfc0fd455c33d877', name: "help" })))));
+            } }, index.h("slot", { key: '5d9f650056e1371cecfce924da5271f436243b5a' }))), index.h(guxFormFieldError.GuxFormFieldError, { key: 'd81fa03f01285583d6d2d935eb5337acf12a346c', show: this.hasError }, index.h("slot", { key: '9fc26f779b0db83100fcaed6a8e22de79b22b67a', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '9de13c4a3751de1e153b30c04f6902e0c2a9b6d2', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '43064b55e0a372ecaeacc2f3549801946a3d5c86', name: "help" })))));
     }
     renderText(text, condition = false) {
         if (condition) {

package/dist/cjs/gux-form-field-radio-group-beta.cjs.entry.js

@@ -8,9 +8,9 @@ const hasSlot = require('./has-slot-3edae188.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormFieldFieldsetContainer = require('./gux-form-field-fieldset-container-bf86cba7.js');
 const getSlotTextContent = require('./get-slot-text-content-83cb3c6d.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 
-const guxFormFieldRadioGroupCss = ".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-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}:host{display:block}::slotted(gux-form-field-radio){padding-top:var(--gse-ui-formControl-group-gapItems)}::slotted(gux-form-field-radio:first-of-type){padding-top:0}:host([disabled]) .gux-form-field-legend-label{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-form-field-legend-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)}";
+const guxFormFieldRadioGroupCss = ".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-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}:host{display:block}::slotted(gux-form-field-radio){padding-top:var(--gse-ui-formControl-group-gapItems)}::slotted(gux-form-field-radio:first-of-type){padding-top:0}:host([disabled]) .gux-form-field-legend-label{opacity:var(--gse-ui-formControl-input-disabled-opacity)}::slotted(label){font-family:var(--gse-ui-formControl-label-textBold-fontFamily);font-size:var(--gse-ui-formControl-label-textBold-fontSize);font-weight:var(--gse-ui-formControl-label-textBold-fontWeight);line-height:var(--gse-ui-formControl-label-textBold-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}";
 const GuxFormFieldRadioGroupBetaStyle0 = guxFormFieldRadioGroupCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -103,8 +103,8 @@ const GuxFormFieldRadioGroupBeta = class {
     }
     render() {
         var _a;
-        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: 'ff8bd3225266d39e7594f4e8c9cedce40ee35072', labelPosition: "above", disabled: this.disabled }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: '206273a0da581b0f9165fee2fa885ccdec40bf71' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), index.h(guxFormFieldFieldsetContainer.GuxFormFieldVisualLabel, { key: '0d08b1d0ed92347875f43bd9c880b14b62490add', position: "above", required: false }, index.h("slot", { key: '96a1d4a2551a802b2a9143b9be0a4b54cbfa4ae1', name: "group-label", onSlotchange: () => this.setLabel() }), index.h("slot", { key: 'f4c90bb6a6c9430d3ae3175b3dfb255e3e701a2f', name: "group-label-info" })), index.h("slot", { key: '94bf5301a0e109fe1c7bfb29fe6716fbbb79d73a' }), index.h(guxFormFieldError.GuxFormFieldError, { key: 'ec7d70173c21907b98f10a5860d340aa8430009d', show: this.hasGroupError }, index.h("slot", { key: 'f8d90f822e9ad6c8b3ea63dd8dd8b465b0f127c1', name: "group-error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '5b07f4d09346864b574c93a914a91fd40d812960', show: !this.hasGroupError && this.hasGroupHelp }, index.h("slot", { key: 'b0902bd8f39a1d6940475e4b605629e616d2749f', name: "group-help" }))));
+        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: 'e12c20790c5ba935d5b3c38b16db7230e434c077', labelPosition: "above", disabled: this.disabled }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: 'ca80c61d454567f3447456444325d0506dec504c' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent.getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), index.h(guxFormFieldFieldsetContainer.GuxFormFieldVisualLabel, { key: '2c0c16c86d9dc473cabfc0db2bb417ee2dab90b2', position: "above", required: false }, index.h("slot", { key: '30bc3c2a1969bb3af748a0b67b2d7fb26d1e3df5', name: "group-label", onSlotchange: () => this.setLabel() }), index.h("slot", { key: '35d5aa0f55e729a976cdb8e112ef03849ca5f816', name: "group-label-info" })), index.h("slot", { key: '7e603c6566ee3679f5ba2221967015fcc783e065' }), index.h(guxFormFieldError.GuxFormFieldError, { key: '8065668a4897592921dd8f76f8b147f5f3a8403b', show: this.hasGroupError }, index.h("slot", { key: '0023aaa9c6ffffe22eedd92450631eccd0b1c6cb', name: "group-error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '51c0d560e63fa06b1a6ead09d5f2752525677018', show: !this.hasGroupError && this.hasGroupHelp }, index.h("slot", { key: '19f31b38455d172042c71de7eb52b9e4ba3be939', name: "group-help" }))));
     }
     setLabel() {
         this.label = this.root.querySelector('label[slot="group-label"]');

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

@@ -9,7 +9,7 @@ const preventBrowserValidationStyling = require('./prevent-browser-validation-st
 const hasSlot = require('./has-slot-3edae188.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormField_service = require('./gux-form-field.service-57a00684.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -52,10 +52,10 @@ const GuxFormFieldRadio = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '417a99fa322982f9b02250e69a1d6db75a6c2a10', class: {
+        return (index.h(index.Host, { key: '4be53308a7caf39eaf426a33fe2f887907016f46', class: {
                 'gux-input-error': this.hasError || this.hasGroupError,
                 'gux-disabled': this.disabled
-            } }, index.h("div", { key: 'fb40c40fcc41f3d657fc402fe2ed234aef988de8', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("div", { key: 'e4c01a81247f51f6d72ac43f2d75f0b10190a1a8', class: "gux-input-label" }, index.h("div", { key: 'e331c7f3b00ed62edd7f761e4fc4e9ad617e2d04', class: "gux-input" }, index.h("slot", { key: 'c9c338a03869cd387c31681cf1f6f6a7b4399668', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: '84f5c336a564eaa9f2e37e28527a91bcf11c687f', class: "gux-label" }, index.h("slot", { key: '75c1063a6788556e10890c0fffc5b58338deebe9', name: "label" }))), index.h("div", { key: '2ae36d15932102e08fc45d92cf4f579613351568', class: "error-and-help-text" }, index.h(guxFormFieldError.GuxFormFieldError, { key: '2d3116d4f38c561001afc02034c819fd872f943c', show: this.hasError }, index.h("slot", { key: 'aad5927a627eee8478d3d7fb1e9c175c638e63c4', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '136f7f7e375ecd3fc2fc9e7e1a307b958df9313b', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'd0aeb7c95a5cf20d9770a6aca39e26b953be439d', name: "help" }))))));
+            } }, index.h("div", { key: '4972931fc0571d13319c91ff3fe995b7e8208b50', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("div", { key: 'b25001ef55d8d5bc0b63237a38ce11b6fecf9549', class: "gux-input-label" }, index.h("div", { key: '0e19497e4f0558252cc976f5227526aa34fcb960', class: "gux-input" }, index.h("slot", { key: '66cf05ecc934419d3cbce9cc08f956ddb0b222d7', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: 'aadbf0cd1d7795f0400047b55c9398653ee3da2c', class: "gux-label" }, index.h("slot", { key: '2fa716ad8d4863ebdef2a7bd1c6c52666b7d37c2', name: "label" }))), index.h("div", { key: '730560ed315257647a904692659515aca8e6f3da', class: "error-and-help-text" }, index.h(guxFormFieldError.GuxFormFieldError, { key: '8af82dd72e1ee37e2b83495b894c8b875c3a5359', show: this.hasError }, index.h("slot", { key: '41d4a359a45fcccabcc69262637864a9f9025858', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'c97b9e2b6586bc5cdddb1d50fa5dc643291db919', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'aa00f02472ea6b3eb18c2aed9f043460223c77b7', name: "help" }))))));
     }
     setInput() {
         this.input = guxFormField_service.getSlottedInput(this.root, 'input[type="radio"][slot="input"]');

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

@@ -11,13 +11,13 @@ const hasSlot = require('./has-slot-3edae188.js');
 const guxFormFieldError = require('./gux-form-field-error-4e1d6772.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
 const guxFormField_service = require('./gux-form-field.service-57a00684.js');
-const usage = require('./usage-d382fd1a.js');
+const usage = require('./usage-103c4679.js');
 const onResize = require('./on-resize-da1477df.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
 
-const guxFormFieldRangeCss = ".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[type=range]){position:absolute;width:100%;width:100%;height:var(--gse-ui-slider-bar-height);margin:calc(var(--gse-ui-slider-handle-width) / 2) 0;margin-top:calc(-1 * (var(--gse-ui-slider-handle-width) / 2 + var(--gse-ui-slider-bar-height)));-webkit-appearance:none;background:transparent}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container.gux-hidden{display:none}.gux-input-and-error-container .gux-range-input-container{display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-slider-gap);place-content:stretch flex-start;align-items:center;height:32px;font-size:var(--gse-ui-slider-label-text-fontSize)}.gux-input-and-error-container .gux-range-input-container.gux-disabled{opacity:var(--gse-ui-slider-disabled-opacity)}.gux-input-and-error-container .gux-range-input-container .gux-range{position:relative;flex:1 1 auto;align-self:center;order:0}.gux-input-and-error-container .gux-range-input-container .gux-range:hover .gux-range-tooltip,.gux-input-and-error-container .gux-range-input-container .gux-range:focus-within .gux-range-tooltip{visibility:visible}.gux-input-and-error-container .gux-range-input-container .gux-range .gux-track{width:100%;height:var(--gse-ui-slider-bar-height);margin:6px 0;background:var(--gse-ui-slider-bar-default-backgroundColor);border-radius:var(--gse-ui-slider-track-borderRadius)}.gux-input-and-error-container .gux-range-input-container .gux-range .gux-track .gux-progress{height:var(--gse-ui-slider-bar-height);background-color:var(--gse-ui-slider-bar-selected-backgroundColor);border-radius:var(--gse-ui-slider-track-borderRadius)}.gux-input-and-error-container .gux-range-input-container .gux-display{flex:0 1 auto;align-self:auto;order:0;margin:0 0 0 var(--gux-spacing-medium);font-family:var(--gse-ui-slider-label-text-fontFamily);font-size:var(--gse-ui-slider-label-text-fontSize);font-weight:var(--gse-ui-slider-label-text-fontWeight);line-height:var(--gse-ui-slider-label-text-lineHeight);text-align:right}.gux-input-and-error-container .gux-range-input-container .gux-display.gux-hidden{display:none}";
+const guxFormFieldRangeCss = ".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-textBold-fontFamily);font-size:var(--gse-ui-formControl-label-textBold-fontSize);font-weight:var(--gse-ui-formControl-label-textBold-fontWeight);line-height:var(--gse-ui-formControl-label-textBold-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(input[type=range]){position:absolute;width:100%;width:100%;height:var(--gse-ui-slider-bar-height);margin:calc(var(--gse-ui-slider-handle-width) / 2) 0;margin-top:calc(-1 * (var(--gse-ui-slider-handle-width) / 2 + var(--gse-ui-slider-bar-height)));-webkit-appearance:none;background:transparent}.gux-input-and-error-container{flex-grow:1}.gux-input-and-error-container.gux-hidden{display:none}.gux-input-and-error-container .gux-range-input-container{display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-slider-gap);place-content:stretch flex-start;align-items:center;height:32px;font-size:var(--gse-ui-slider-label-text-fontSize)}.gux-input-and-error-container .gux-range-input-container.gux-disabled{opacity:var(--gse-ui-slider-disabled-opacity)}.gux-input-and-error-container .gux-range-input-container .gux-range{position:relative;flex:1 1 auto;align-self:center;order:0}.gux-input-and-error-container .gux-range-input-container .gux-range:hover .gux-range-tooltip,.gux-input-and-error-container .gux-range-input-container .gux-range:focus-within .gux-range-tooltip{visibility:visible}.gux-input-and-error-container .gux-range-input-container .gux-range .gux-track{width:100%;height:var(--gse-ui-slider-bar-height);margin:6px 0;background:var(--gse-ui-slider-bar-default-backgroundColor);border-radius:var(--gse-ui-slider-track-borderRadius)}.gux-input-and-error-container .gux-range-input-container .gux-range .gux-track .gux-progress{height:var(--gse-ui-slider-bar-height);background-color:var(--gse-ui-slider-bar-selected-backgroundColor);border-radius:var(--gse-ui-slider-track-borderRadius)}.gux-input-and-error-container .gux-range-input-container .gux-display{flex:0 1 auto;align-self:auto;order:0;margin:0 0 0 var(--gux-spacing-medium);font-family:var(--gse-ui-slider-label-text-fontFamily);font-size:var(--gse-ui-slider-label-text-fontSize);font-weight:var(--gse-ui-slider-label-text-fontWeight);line-height:var(--gse-ui-slider-label-text-lineHeight);text-align:right}.gux-input-and-error-container .gux-range-input-container .gux-display.gux-hidden{display:none}";
 const GuxFormFieldRangeStyle0 = guxFormFieldRangeCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -118,9 +118,9 @@ const GuxFormField = class {
         clearInterval(this.valueWatcherId);
     }
     render() {
-        return (index.h(index.Host, { key: '3c79eb363dfae32c858cffad043764902d8dae85', class: {
+        return (index.h(index.Host, { key: 'ab9ac048dff6e2d11bb3c772ed451236f3ba077a', class: {
                 'gux-active': this.active
-            } }, index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'ae0bc64f1d0180332c427dd692ebc1fb94457f95', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'cb326bd43897be87ecc8d7eb31d04a1474377fb3', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: 'c6eb68766e994d20c5b930cd777816a9ca80714c', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'e10e38dcc251d9eb5d76ca3b09deb813eb84b80f', variant: "required", required: this.required }), index.h("slot", { key: 'cabdb686e15ffee841d7cfc96ef89877d5753e67', name: "label-info" })), index.h("div", { key: 'd8a55159e6fcf0c887a854c4d7c48f7d3f484c55', class: "gux-input-and-error-container" }, this.renderRangeInput(), index.h(guxFormFieldError.GuxFormFieldError, { key: '71a0770956d98d2ca991f470e3b48ab77d9304b4', show: this.hasError }, index.h("slot", { key: '9be62a32a0c0fe6dc08ac5d56584a39f71ad9731', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '4e841ac142102e97671c812bba62f963f9c4ed53', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'decbb8b0ee04d4402b2d37e3b4586c3d6ee4a1b1', name: "help" }))))));
+            } }, index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'dba594d436aead649aeb87af487ee166189b4bab', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '55700a9623002cb6b14d649220d69892d12f9262', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '6bce5f84176d71f7f55a0aa4b2790009af8c1605', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'f5a34330196fc54fc09ab3a8af2c34daf76c5462', variant: "required", required: this.required }), index.h("slot", { key: '4660b8fce4ca716350a14ffb473afa54c8419318', name: "label-info" })), index.h("div", { key: '3670a50c686cc5db998c98649ae43f38c0a31dc3', class: "gux-input-and-error-container" }, this.renderRangeInput(), index.h(guxFormFieldError.GuxFormFieldError, { key: '393e587693d47724a46b070752f97eea1f5f62e0', show: this.hasError }, index.h("slot", { key: 'b83b93a254d2700a3939dd146154ad481a6b8c62', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'cb78aadb8966a6d073cc55feff81aefc2958bb26', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '900d0ca0d05bc5916699632ec749af107ad7b724', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';
@@ -163,9 +163,10 @@ const GuxFormField = class {
         this.updatePosition();
     }
     updatePosition() {
-        const value = Number(this.input.value || 0);
-        const min = Number(this.input.min || 0);
-        const max = Number(this.input.max || 100);
+        var _a, _b, _c;
+        const value = Number(((_a = this.input) === null || _a === void 0 ? void 0 : _a.value) || 0);
+        const min = Number(((_b = this.input) === null || _b === void 0 ? void 0 : _b.min) || 0);
+        const max = Number(((_c = this.input) === null || _c === void 0 ? void 0 : _c.max) || 100);
         const placementPercentage = ((value - min) / (max - min)) * 100;
         if (this.tooltipElement) {
             const thumbDiameter = 20;