genesys-spark-components 4.67.0 → 4.69.0

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-6c10f2a2.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: 'bd8ffd5498ce8e610991bde0e504f17155013320', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '9110741b56cad3534699aa46c1c9f4906415544b', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '3ae714696acf45e871d5ff5dd17462c007946291', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '778127f519439c2222eb2e2cefb06dafe4ccd580', variant: "required", required: this.required }), index.h("slot", { key: '458b80b587e2a71a6b74c254b17d0254af689242', name: "label-info" })), index.h("div", { key: 'be307b732e213e887e603285883939d517a0f515', class: "gux-input-and-error-container" }, index.h("div", { key: '99606aa771b9cd0d7dc905f5bf372d0611b0cf24', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: '6cfea92820ee7bb5adb8dbdcf91ee1cb7e96719a', class: {
+            } }, index.h("div", { key: 'e8f5424a77f503939194845952a600942881fac3', 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: '5165395c1c2e170ff5a36595d6c818c9f32eec84', name: "input", onSlotchange: () => this.setInput() }))), index.h(guxFormFieldError.GuxFormFieldError, { key: '0d485bd468bd554a68079a95646137c244ed0a9d', show: this.hasError }, index.h("slot", { key: 'e18a74f723d34c6b250b7848c1638c3cfe31c782', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'cefe2b17cbcb4d1b54be05bccba3b116d303144d', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'bb60e7a17e4e3ccbcb32f157976c7dd082a8edf9', 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-6c10f2a2.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: '63361cf42ffcd8c77f343dee01c3adf81dc0941d', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: '031c0715fe3cf6987a40233ab80aa5acc6e7710a' }, (_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: 'd325b9b5ebcb0ff61e6a60de667632518e957c56', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '42c42440dbb653efc0d04f2e0b3f136f1656f6f5', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '696d9ddb331ceed2538a74fc23e7b4ed30aa5b09', variant: "required", required: this.required }), index.h("slot", { key: 'ecd3c58e1d31cb8d94627f38569b441d8e0b486a', name: "label-info" })), index.h("div", { key: '648d4ee2732fec9cc56acde6a5f646e09f79c7cd', class: "gux-input-and-error-container" }, index.h("div", { key: '65e1736e94fcff744a62ade04f1e18af77254f3c', 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: '9411d1f82b80e013850c8ebfc7f55843d643acf7' })), index.h(guxFormFieldError.GuxFormFieldError, { key: '52f1e48db508e83c7cfc4b375d81f032609b6776', show: this.hasError }, index.h("slot", { key: '41d22e038c502a355f1c45befb38ac7e190ea43a', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '10c388c498f1dcf67a6377ae01673c70fefae884', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'd128221341c321854206652607cc4b0078a024f2', 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-6c10f2a2.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: 'b45503dabdcb64f1df72928b99305aa5efaef423', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'f09e291be24f57e678a72e417b2f1b7bb977082e', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'fc9b9068354b8da568006d4d44640fef4123fa9e', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '3ef29064e0601bd2c8af11a19c9a1a8b9e986b0e', variant: "required", required: this.required }), index.h("slot", { key: '83ae1424fcb54708af961155db4c26fcbd059cbd', name: "label-info" })), index.h("div", { key: '33b58d805d61f1d8b27a50b0db96c31caca6f54b', class: "gux-input-and-error-container" }, index.h("slot", { key: '4fe2f05d1b6012908ac312d1bacb3a3d62f28c8c', name: "input", onSlotchange: () => this.setInput() }), index.h(guxFormFieldError.GuxFormFieldError, { key: 'f82044540fa10d5cd81806e7ecccba3419fb6667', show: this.hasError }, index.h("slot", { key: '9142937b77c997e8bfc0ffc80b2e363609e72b88', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '6ceb51c3e58b3cd3023e7a7184e171e8c2f75027', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '60641e4d45948eaa1b9d8faad04aa70f12ab1693', 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-6c10f2a2.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: 'f16b595c0688c619aaeacb7e7c099fb1530ad489', tabIndex: -1, type: "button", title: this.i18n('clear') }, index.h("gux-icon", { key: 'af8f1f7813fdc524978215781fafe1832e29895e', "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-6c10f2a2.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-6c10f2a2.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: '7cd63e19283a6dc3eaf8806073246206834e063c', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'bccccd9a17d23d2d4446fd9685eb9cbe9404a9d1', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: 'e8886a901750434ae6be0da8f769c82aef5adb17', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'f79a65869ea22e74831f01fed54d875cce02e7b4', variant: "required", required: this.required }), index.h("slot", { key: '0386c4fbff1aa3cd83103e35dd499c8ad4262558', name: "label-info" })), index.h("div", { key: '6abf848f8a230821fd95429e9e52f724edcdcf8b', class: "gux-input-and-error-container" }, index.h("div", { key: '16d8e83feacb453361be85817dac8b7941189bab', 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: 'dab06cf421271d09ed7298b54435a984c281d181', 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: '83e0717bb788c2fb31934824355dbce50bbd750c', 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: '45adac5e37cf049f696cafab18457c89fc2446f1', show: this.hasError }, index.h("slot", { key: 'a6e96e5c56a29622d84ae629f2962d35823e7418', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '25283d15c640fcd203efaa9d8e108a5524649f6e', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'e30a17304b3d059bd3938b788c910bd9f4c37268', 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: '2820c182b85e0299720d4abbc157a8604586736e' }, index.h("button", { key: 'f5281a55dfa45a66d70a94c00b500398cdc802e4', 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: 'f76d0448816482e93a94735df84f9461f921f0b5', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), index.h("gux-tooltip", { key: 'f4cffff7d04b8940ce6481533f27a16176e93489', for: "popover-target" }, index.h("div", { key: 'd8415ca69b5d2a30430a29e3aa199429f96c4559', slot: "content" }, this.i18n('goToPage'))), index.h("gux-popover", { key: 'd242c1ac2b74e7ad8f3e3ac263b3f25d2a410544', "is-open": this.isOpen, for: "popover-target" }, index.h("span", { key: 'aeada09ea4194538e1f7c784f06c0305632e283a', slot: "title" }, this.i18n('goToPage')), index.h("gux-form-field-number", { key: 'd1fdda287990b81432fb0ea1fba701feaa0313e9' }, index.h("input", { key: '71523be8c50ee40138a4560574523060f3c8a834', 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: '3a0c0d349584f5e8c105c1104c654aeb8077a8ae', 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: '73bc102bb15e3558f9ce9bf3d0d9a227c7c7d066', 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: 'b4de1be84cda8c3ec3648e3764b91ba9e79c430c', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, index.h("div", { key: '61e3578e40ece777e9b361a10c6595fed291a402', class: "gux-arrow-caret" })), index.h("div", { key: '92641ff8f3fc763886a1a94b61354339938124d8', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, index.h("slot", { key: '9c544091c84b663706ea62a4e39a659947fc9a31', name: "title" }), this.renderDismissButton()), index.h("div", { key: '42d1a067d01bc84700d055c76764c68c2263bda3', class: "gux-popover-content" }, index.h("slot", { key: '46b29b5905512f76b5e3f25a3d7978e0a4cfa4cd' }))));
     }
     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-6c10f2a2.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: '5e79706a4106eb71219a0fccecf9fecc70ad029f', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: 'beaea1fd3d613ab90ac5e097c025096e7c83244f' }, (_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: 'dfe696f2a760552fff055c424a5cd9e394eeb20b', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '730a6a00c0b6872099d7aa44bdafc923af385d77', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '3d1362cfc275d089d41e4d6495aed11a4fbd3056', variant: "required", required: this.required }), index.h("slot", { key: '734d9a3e505bb48a27b676a6b16c13717ebb87d7', name: "label-info" })), index.h("div", { key: 'c5151c7762ecfa31164375ae23f7ca48b8b1548d', class: "gux-input-and-error-container" }, index.h("div", { key: '83a99c191cb03b34ef4ee5e37b9be5f4237556b3', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: '6ceb1a48dc60d604b7400ab7d80cb0e8ec8b4940', class: {
+            } }, index.h("div", { key: 'ece2e66fdc6612ab711f4243d803363fabff2b8e', 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: 'aeeb02d360867cd9400046b6d63c61f588df9713' }))), index.h(guxFormFieldError.GuxFormFieldError, { key: '6ffda1db40ad30c409c431339c8183168d7dbb64', show: this.hasError }, index.h("slot", { key: 'f75504d4695a26edf90b30cf2db36fb354db4f29', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'f171c53e11efd91de79c2e0337682188d465e134', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '3858cad08f08ec51f79b1c52461a0d2bb36cb6e9', 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-6c10f2a2.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: '18fb0c21924bc28ff5ab47fd67c5de6ef6b34df5', labelPosition: "above", disabled: this.disabled }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldScreenreaderLabel, { key: 'e33a6c28e3a2fafbbdff9107a33bc3ce6cc3e680' }, (_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: 'c6420ade388fef239f6cf7e43b062992c6f5ef40', position: "above", required: false }, index.h("slot", { key: '51ce44d7ebd941cd80de57dabe1afdd28a287aac', name: "group-label", onSlotchange: () => this.setLabel() }), index.h("slot", { key: 'cdefdcf43799bcb758ea0a27a555fb0c3323c96b', name: "group-label-info" })), index.h("slot", { key: '1b79439e6930fa43d2c508f16a79b2763b369e2c' }), index.h(guxFormFieldError.GuxFormFieldError, { key: '2eb19786e466d0d8f4dbe3efd6866eee5b7cc9d0', show: this.hasGroupError }, index.h("slot", { key: '73f97a0982220c438e51086db8b26c7c4d0db509', name: "group-error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'd947d3ad2e58438d770785baf504d2e12705069a', show: !this.hasGroupError && this.hasGroupHelp }, index.h("slot", { key: 'f102ee933a12c6ae5cd4290e8adb9bae3c6cdee9', 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-6c10f2a2.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: 'dee308de65283a8fc44ce06f2da458e3f108024a', 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: '84c778ad31cbc0879422d1b57ffbbfb51c4d733b', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("div", { key: 'f29e1012c2140654c626dbdf2e49c6492675f59e', class: "gux-input-label" }, index.h("div", { key: '9324b917de2d38e872fd6f858198ff7d6971dac1', class: "gux-input" }, index.h("slot", { key: 'dca06eb2f5370cc6979ea6dd4119083397bcf5ac', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: 'ebccb4e6bb0438b183f1a7dd542120933b6dd2e1', class: "gux-label" }, index.h("slot", { key: '204dfc4315640ac7974df1ec434f06691148078b', name: "label" }))), index.h("div", { key: 'ccffe3e77740d2231216e9e6021f65fd035d1ed1', class: "error-and-help-text" }, index.h(guxFormFieldError.GuxFormFieldError, { key: '8b6701eb9a7ac2131597ce9f9f08513e3c46bcbf', show: this.hasError }, index.h("slot", { key: 'fe09527fd9035f25c6d91c3f6285839a09e5c423', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'fd58af8ee7e72a1389c45b37cd46a55798db6efa', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '7a76298da2764985c0c7febcf744ca9efb40ada8', 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-6c10f2a2.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: '7174da64feed7ecfd06b26be8d77ca5cd0b2fa5a', 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: 'ac0ecc73aedb6bdd9b0536bbfed55d665ae5f248', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'b24dd5d42a34beb41887e92b8bcceb3d7bda56e4', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '12ed0520d9b9f1c404b6a31f6ec45fdd0b4c1bfe', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'b07b2c6c7f0e118f65be5e01cae6cae15959dc34', variant: "required", required: this.required }), index.h("slot", { key: '0b06bc69c256872d0726d93344a26a8664955df3', name: "label-info" })), index.h("div", { key: '3360fc5b2bcfa941f02345e6c4f2ee855c85b9c6', class: "gux-input-and-error-container" }, this.renderRangeInput(), index.h(guxFormFieldError.GuxFormFieldError, { key: '48fd7c3a7e142e298fdbfb213b5954b3cfce4a54', show: this.hasError }, index.h("slot", { key: '91ec76d697c26a0a014f34c30de6d3596044abf1', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '9df5deee6beb4a35cfe4051dd2383bb493b412b1', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'da27f8af64910cf341f25e31034753526cb1e7c4', 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;

package/dist/cjs/gux-form-field-search.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-6c10f2a2.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
 
-const guxFormFieldSearchCss = ".gux-form-field-container.gux-beside{display:flex;flex-direction:row}.gux-form-field-error{display:none;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-formControl-helper-gap);place-content:stretch flex-start;align-items:center;padding:var(--gse-ui-formControl-helper-errorPadding);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error.gux-show{display:flex}.gux-form-field-error gux-icon{flex:0 1 auto;align-self:start;order:0;min-width:var(--gse-ui-icon-size-sm);min-height:var(--gse-ui-icon-size-sm);color:var(--gse-ui-formControl-helper-errorColor)}.gux-form-field-error .gux-message{flex:0 1 auto;align-self:auto;order:0}.gux-form-field-label{display:inline-flex;flex:1 0 auto}.gux-form-field-label ::slotted(gux-label-info-beta){padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-required gux-form-field-label-indicator{padding-inline-start:var(--gse-ui-formControl-label-gap)}.gux-form-field-label.gux-beside{position:relative;top:var(--gse-ui-formControl-input-top);width:fit-content;min-width:var(--gse-ui-formControl-input-textfield-minWidth);max-width:fit-content;margin-right:var(--gse-ui-formControl-group-gapItems)}.gux-form-field-label.gux-above{padding:var(--gse-ui-formControl-label-padding)}.gux-form-field-label.gux-screenreader{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}.gux-form-field-help{display:none;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;justify-content:flex-start;padding:var(--gse-ui-formControl-helper-paddingSmall);font-family:var(--gse-ui-formControl-helper-helperText-fontFamily);font-size:var(--gse-ui-formControl-helper-helperText-fontSize);line-height:var(--gse-ui-formControl-helper-helperText-lineHeight);color:var(--gse-ui-formControl-helper-defaultColor)}.gux-form-field-help.gux-show{display:flex}.gux-form-field-help .gux-message{flex:0 1 auto;align-self:none;order:0}:host{display:block}::slotted(label){font-family:var(--gse-ui-formControl-label-text-fontFamily);font-size:var(--gse-ui-formControl-label-text-fontSize);font-weight:var(--gse-ui-formControl-label-text-fontWeight);line-height:var(--gse-ui-formControl-label-text-lineHeight);color:var(--gse-ui-formControl-label-labelColor)}::slotted(input){flex:1 1 auto;align-self:auto;order:0;width:100%;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);color:var(--gse-ui-formControl-input-populatedColor);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: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);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;border:var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) var(--gse-ui-formControl-input-default-border-color);border-radius:var(--gse-ui-formControl-input-borderRadius)}.gux-input-and-error-container .gux-input .gux-input-container.gux-disabled{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container .gux-input .gux-input-container gux-icon[icon-name=search]{flex:0 0 auto;align-self:auto;order:0;width:var(--gse-ui-formControl-input-inputIcon-size);height:var(--gse-ui-formControl-input-inputIcon-size);color:var(--gse-ui-formControl-input-inputIcon-defaultColor)}.gux-input-and-error-container .gux-input .gux-input-container:focus-within{border:var(--gse-ui-formControl-input-active-border-width) var(--gse-ui-formControl-input-active-border-style) var(--gse-ui-formControl-input-active-border-color);border-radius:var(--gse-ui-formControl-focusRing-borderRadius);outline:var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);outline-offset:var(--gse-semantic-focusRing-offset)}.gux-input-and-error-container .gux-input .gux-input-container:hover:not(.gux-disabled){border:var(--gse-ui-formControl-input-hover-border-width) var(--gse-ui-formControl-input-hover-border-style) var(--gse-ui-formControl-input-hover-border-color)}.gux-input-and-error-container .gux-input.gux-input-error .gux-input-container{border-color:var(--gse-ui-formControl-input-error-border-color)}";
+const guxFormFieldSearchCss = ".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%;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);color:var(--gse-ui-formControl-input-populatedColor);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: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);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;border:var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) var(--gse-ui-formControl-input-default-border-color);border-radius:var(--gse-ui-formControl-input-borderRadius)}.gux-input-and-error-container .gux-input .gux-input-container.gux-disabled{opacity:var(--gse-ui-formControl-input-disabled-opacity)}.gux-input-and-error-container .gux-input .gux-input-container gux-icon[icon-name=search]{flex:0 0 auto;align-self:auto;order:0;width:var(--gse-ui-formControl-input-inputIcon-size);height:var(--gse-ui-formControl-input-inputIcon-size);color:var(--gse-ui-formControl-input-inputIcon-defaultColor)}.gux-input-and-error-container .gux-input .gux-input-container:focus-within{border:var(--gse-ui-formControl-input-active-border-width) var(--gse-ui-formControl-input-active-border-style) var(--gse-ui-formControl-input-active-border-color);border-radius:var(--gse-ui-formControl-focusRing-borderRadius);outline:var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);outline-offset:var(--gse-semantic-focusRing-offset)}.gux-input-and-error-container .gux-input .gux-input-container:hover:not(.gux-disabled){border:var(--gse-ui-formControl-input-hover-border-width) var(--gse-ui-formControl-input-hover-border-style) var(--gse-ui-formControl-input-hover-border-color)}.gux-input-and-error-container .gux-input.gux-input-error .gux-input-container{border-color:var(--gse-ui-formControl-input-error-border-color)}";
 const GuxFormFieldSearchStyle0 = guxFormFieldSearchCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -97,13 +97,13 @@ const GuxFormFieldSearch = class {
         }
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'ef96177e5e1480b4ca642e24fc76978a5975a068', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '2f57a79271df2635b4b94aafdd54014cf3e68807', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '5f83442364ebcad43ae2d3c1fae7b5505357b21c', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: '2a8f39c847a5d30a4ce87e9da0839da0e7fdf04e', variant: "required", required: this.required }), index.h("slot", { key: '41e72a5f6ad41378d91e6767bb91f91d5cd68a8a', name: "label-info" })), index.h("div", { key: 'ccac0b555024cf9fbae23e62a343451f88231351', class: "gux-input-and-error-container" }, index.h("div", { key: 'f97951825cc335a257dc7b9b0735c80e6cd83142', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '58166543ea3396b6a2f010d8ad25839f6da9862e', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '81f159bde9db11ef976e52c7229a8ffe7a06f22a', required: this.required, position: this.computedLabelPosition }, index.h("slot", { key: '7d3c829d0551f6924f393a597f00caa1cc6e7bc8', name: "label", onSlotchange: () => this.setLabel() }), index.h("gux-form-field-label-indicator", { key: 'adf56d285a6dd185e3b245c0830c238d250025a8', variant: "required", required: this.required }), index.h("slot", { key: '666f6a5e421b15988c8b62cd6ce3e1b6336a88cb', name: "label-info" })), index.h("div", { key: '7a74fab6c5ea13071f9b3d76ce45558e635d9c92', class: "gux-input-and-error-container" }, index.h("div", { key: 'b546aee27c23e2c78c0737506a6b24c71d01bf81', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: 'ec5e78d90797b98275bb80f2efccae240e03c081', class: {
+            } }, index.h("div", { key: '9fcd7df004c874c3d5ab3f7d4bef0835e7a924c0', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("gux-icon", { key: '36f8527ec1bd5ba4080037d9216f8f035f354fca', "icon-name": "fa/magnifying-glass-regular", decorative: true }), index.h("slot", { key: 'e30a445cd5d25bfb51365619f869267edd254a80', name: "input" }), this.clearable && this.hasContent && !this.disabled && (index.h("gux-form-field-input-clear-button", { onClick: () => guxFormField_service.clearInput(this.input) })))), index.h(guxFormFieldError.GuxFormFieldError, { key: 'c2f8a7ea0d69672c8ffda1dc5dc4c1857ce216df', show: this.hasError }, index.h("slot", { key: '633e0a0f84f360b349c4c928dba275906599d453', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '1c968ea45350d2c0c9396e79848d81711dfeef20', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'c71533a3cd0f2363c7f2b9803648307f7b946544', name: "help" })))));
+            } }, index.h("gux-icon", { key: 'a84a5af69848417cb3722dc9cb0827ad4ba47fef', "icon-name": "fa/magnifying-glass-regular", decorative: true }), index.h("slot", { key: 'fab262d30b38203f5ec6ceb9bf2c733b7920530a', name: "input" }), this.clearable && this.hasContent && !this.disabled && (index.h("gux-form-field-input-clear-button", { onClick: () => guxFormField_service.clearInput(this.input) })))), index.h(guxFormFieldError.GuxFormFieldError, { key: 'd6f71131cc9d8870ac0e4b40177ddec6806b89e7', show: this.hasError }, index.h("slot", { key: 'f847c4449ebd17bc83307aca26e61242b900decc', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'a80e3898c62e3f2e1617d5f1babb73001744aed9', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '8bdd443766bf846d9e02593167152fcfe144bef2', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition