genesys-spark-components 4.43.0 → 4.44.0

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

@@ -7,8 +7,9 @@ const onInputDisabledStateChange = require('./on-input-disabled-state-change-660
 const onMutation = require('./on-mutation-3d294d15.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
-const usage = require('./usage-a814956f.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
+const usage = require('./usage-f12fac9e.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -50,10 +51,10 @@ const GuxFormFieldCheckbox = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '498059b32cd38f579ee9f806d43faa576e0d08c4', class: {
+        return (index.h(index.Host, { key: '96fff4b1513189f94c3692b5c22e77be7e504232', class: {
                 'gux-input-error': this.hasError,
                 'gux-disabled': this.disabled
-            } }, index.h("div", { key: 'b5034b3d051aa62be14c1e4235bdbbf79ce6e115', class: "gux-form-field-container" }, index.h("div", { key: '0580a9d3343673ca24b3f592adb77186075193e2', class: "gux-input-label" }, index.h("div", { key: '9db86cd78f4d801cdb2216ca3ab013449c2ef39d', class: "gux-input" }, index.h("slot", { key: '0b6e8e16fbf5cc8a884bc4af19af1ce04646b83f', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: 'be750c1fdeb509c5b5b13d857a3e284494124eb1', class: `gux-label-${this.labelPosition}` }, index.h("slot", { key: 'dd8665a0129da11925d6b850ea02e159651e0cab', name: "label" }), index.h(guxFormField_service.GuxFormFieldError, { key: '8a7af33d43a30bf475be7a0afdad4cde0ed9393e', show: this.hasError }, index.h("slot", { key: '1f68295ce67a0196e786b4fc4a0573e240d765f3', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: 'ee53a9bdd261c7c990edace0a6d93c82f83805ac', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '04888d3115b8c6b903f0690d652556347a89ad8a', name: "help" })))))));
+            } }, index.h("div", { key: 'bbb75648e1bbbb1c8874c0db1d104b97f213fd3d', class: "gux-form-field-container" }, index.h("div", { key: '52f58decb8b614620d0ad938102e612bf40641ef', class: "gux-input-label" }, index.h("div", { key: 'd41d0da867592a776de9d89e599f267132c72e1a', class: "gux-input" }, index.h("slot", { key: '505e32836f2a2898f6970fa08f5cbc2899156cdc', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: '461c4ec05c0750e3dad7f2bc1b76ed7359623c50', class: `gux-label-${this.labelPosition}` }, index.h("slot", { key: '8e848948354415a959fe03288b47a5bf34db2c06', name: "label" }), index.h(guxFormFieldError.GuxFormFieldError, { key: 'ae66b8a54a66e20db14b7feaf86a664efca0562a', show: this.hasError }, index.h("slot", { key: '50be51561facb7217290478231682f22e085acf3', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'f2ff184fb0801dc56d4fdce757aa9c35864c3abd', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '5e03cb37e7fa21ca776f4f43b3c7bc84dbfae1f9', name: "help" })))))));
     }
     get variant() {
         return this.labelPosition.toLowerCase();

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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -58,13 +59,13 @@ const GuxFormFieldColor = class {
         }
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '0c1a690a11037b67bbf23ec40ee27170181e02ff', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'dac320aabbc9cd3a3b899253150f7ef24977763e', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '358bbdacaf7eb7a54e50ae9e3bece8bbde0e64ca', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '56879b9d3e88b020028e4792117601028405fedd', class: "gux-input-and-error-container" }, index.h("div", { key: '685359fc45e9af4d6f2e7551a5aef8aed8b7fa89', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '3f795869960ada33259048d5a593c89d6ebcde9e', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '57df598023f7973c26b94a9f0deefd2f95356598', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '5ebf072111e0d5a7dd27ae310b5ccb2872d08c8e', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '2d33fbd10607a56bec6fce9190d0eee56651711c', class: "gux-input-and-error-container" }, index.h("div", { key: '8634c1ce815f8a6e609cdd3c7b4986a60f02eeba', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: '97d61d652b68f8774e5a603e88f68af1e18eecdf', class: {
+            } }, index.h("div", { key: '1392fc7e81e1287133599507532e4e3b0628757e', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("slot", { key: '3239a900d6356a09031aec24bc2b73ca8a874e16', name: "input", onSlotchange: () => this.setInput() }))), index.h(guxFormField_service.GuxFormFieldError, { key: 'd2711f3c98eb142e758dbdaff3009f921d54c7aa', show: this.hasError }, index.h("slot", { key: '624693443856b65b4da07e940170159fd6a49dea', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '23b76d817c4c306494ff1b3e6e220464bfb7a14b', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '6a777f78883e2af16fb2de135ac63a98fe2fce0b', name: "help" })))));
+            } }, index.h("slot", { key: '5e35a48643fb9806f8cc5d250acf697d17708e06', name: "input", onSlotchange: () => this.setInput() }))), index.h(guxFormFieldError.GuxFormFieldError, { key: '80d6ee82ce0c72ecdb730c2badecd13763956adc', show: this.hasError }, index.h("slot", { key: '726ea064e2aea06a9d0655a5a55fdb1bea31e6bf', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '9b6851c027e7b92857cd92ee70466ded6bde76d0', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '4d61d70c7b9e80b7c642a38ef934e8cd958cb1d8', name: "help" })))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

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

@@ -7,10 +7,11 @@ const index$1 = require('./index-a1a48d79.js');
 const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldFieldsetContainer = require('./gux-form-field-fieldset-container-366ae678.js');
 const getSlotTextContent = require('./get-slot-text-content-83cb3c6d.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./get-closest-element-9e41d6b9.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
@@ -74,10 +75,10 @@ const GuxFormFieldDropdown = class {
     }
     render() {
         var _a;
-        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: 'b6795f760c878fec170807360855c19a3cf86c34', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: '3ab1b5ff4edb22646bc7988e89e71f9107295c5d', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: '33f7bd3e8fe6a9090fbfe666df1c91ccae732d7a', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'help'), this.hasHelp)), index.h("div", { key: '9f40bcf396c553b508c5d9b053b014afb21fc21b', class: "gux-input-and-error-container" }, index.h("div", { key: 'cc6a593a3e2b8b6931f127f3cb768b244637e6b2', class: {
+        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: 'd9f6cfe54aa13cccbf20499ce1893c7116d24dc8', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: '058bf253b04d8d7eda414a18cb3483b4640ecd8b', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: 'fc391e45e3b50648f25ab7165b356c929236cda8', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'help'), this.hasHelp)), index.h("div", { key: '67bdd9490d0f53609dca951c486d6a0fef8103ac', class: "gux-input-and-error-container" }, index.h("div", { key: '9f50acdb8cc710ef857821e2498460ebd7fac2e9', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("slot", { key: 'cf4a935215026a57f9f66e0aa55b64003554b223' })), index.h(guxFormField_service.GuxFormFieldError, { key: '1fa254b89897d637622332789ad6eaa0f5f83fae', show: this.hasError }, index.h("slot", { key: '8c15e70d21f2e709c80d34052e49a6ecc11c7ddd', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '00c58d2c3a03bf6d016fc2d1f621b7703e2ae2ce', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '7896c8464a0be2e4072bc1e31484b4fca69bc540', name: "help" })))));
+            } }, index.h("slot", { key: '3ffa1597a2916cd0d4be7084fc0c1bc361f229f4' })), index.h(guxFormFieldError.GuxFormFieldError, { key: 'fb87ace7946bb9e1b9a90babd0aaf151d7b93696', show: this.hasError }, index.h("slot", { key: '66c529044a60b60edf8bca2c1cdd26ebb21224f1', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '9dd7fff46335719b8455050c78179db94a41a300', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'c33ef884e7cbfe5d7043c2868412538757e82c3c', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/cjs/gux-form-field-error-d11bcc8b.js

@@ -0,0 +1,23 @@
+'use strict';
+
+const index = require('./index-7fb02c8c.js');
+
+const GuxFormFieldHelp = ({ show }, children) => {
+    return (index.h("div", { class: {
+            'gux-form-field-help': true,
+            'gux-show': show
+        } },
+        index.h("div", { class: "gux-message" }, children)));
+};
+
+const GuxFormFieldError = ({ show }, children) => {
+    return (index.h("div", { class: {
+            'gux-form-field-error': true,
+            'gux-show': show
+        } },
+        index.h("gux-icon", { "icon-name": "fa/hexagon-exclamation-regular", decorative: true }),
+        index.h("div", { class: "gux-message" }, children)));
+};
+
+exports.GuxFormFieldError = GuxFormFieldError;
+exports.GuxFormFieldHelp = GuxFormFieldHelp;

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-a814956f.js');
+const usage = require('./usage-f12fac9e.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: 'f1ab8c5efbad04d34dffeb79d653e4fd7cb8b7c7', tabIndex: -1, type: "button", title: this.i18n('clear') }, index.h("gux-icon", { key: '147a375dd9cefa4660dd60f518e6a582533006d1', "icon-name": "fa/xmark-large-regular", decorative: true })));
+        return (index.h("button", { key: 'e25dfcaa89bf0ea1010090ab80d4ecfc2d22c422', tabIndex: -1, type: "button", title: this.i18n('clear') }, index.h("gux-icon", { key: 'a7ae73193221ebbc9d3aae75ff3b53107e3e0908', "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-number_3.cjs.entry.js

@@ -8,11 +8,12 @@ const onInputDisabledStateChange = require('./on-input-disabled-state-change-660
 const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
 const simulateNativeEvent = require('./simulate-native-event-e88bf64f.js');
 const hasSlot = require('./has-slot-3edae188.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-a814956f.js');
+const usage = require('./usage-f12fac9e.js');
 const en = require('./en-66d2b744.js');
 const onClickOutside = require('./on-click-outside-f7acdd1d.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
@@ -84,14 +85,14 @@ const GuxFormFieldNumber = class {
     }
     render() {
         const showClearButton = this.clearable && this.hasContent && !this.disabled;
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'feeabc781adfb0fd9030d8a76743c31ea64e8d76', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '4400af252249fa580fb4ca395eed8806153e3ff5', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '8864aefbdc97e8906242b3fdeb0a2ba3fc705245', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '966b4a919efeca4e4c085326967ba3bf4a3588cc', class: "gux-input-and-error-container" }, index.h("div", { key: '4c92937f061f678cff9af4719d8cb958e35a3c5e', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '1b23d969ab096d9b58e474a744f75bab108e468d', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'ed5b8944c2d68cef8a5e0bfc5f52fb6121f325e0', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '947c009c1d2ddf13434bcc9b212846cfc1bf7f76', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '45d905548b66c4484fbebe19f9a5230dd9704247', class: "gux-input-and-error-container" }, index.h("div", { key: 'bb77b85e62a4112fc249aba45694e221e38d2abe', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            }, part: "input-section" }, index.h("div", { key: '19e2f5e9856d4bdfde619f95c6c27e7ee87f6a18', class: {
+            }, part: "input-section" }, index.h("div", { key: 'c3fc5dbea16686fc48b2e4848c076310bf3bd73c', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-clear': showClearButton
-            } }, index.h("slot", { key: 'cce60afdfecda90b88e29117738e65d7398fd6fb', 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(guxFormField_service.GuxFormFieldError, { key: 'd8418fafe5ab22e81e0b4faf2dad671309cded81', show: this.hasError }, index.h("slot", { key: 'bf7081e104af51fdba6f6ddfdd23b92812e41d4e', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '9ceadb455f53579b0761cfc6fe6fd438831b4422', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '193219e3f90c7957b6edaad735b6e7d5e0a9c939', name: "help" })))));
+            } }, index.h("slot", { key: '974ef79884445b71101f5223268c87bf14617350', 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: '4d7d2c9350db33e4dacc1fc25035cda9293c90e2', show: this.hasError }, index.h("slot", { key: '0bc724484282c488a86a051dca3aa0417bd07197', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'ffce7fc2a881de2dcc01ec379bc2123ad1ac1f5a', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '9452d7ee174a8786ba4f4778967d5ec2633ca77e', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition
@@ -239,7 +240,7 @@ const GuxPaginationEllipsisButton = class {
         this.applyInputListener();
     }
     render() {
-        return (index.h(index.Host, { key: 'ab978e3ccd347f6efa6e0eeffadf27192ac12189' }, index.h("button", { key: '2727bdacd20748fa2d193ea9fc54df1459397bad', 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: '42ba22626fc336ac510345d7aeb581972c8f169f', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), index.h("gux-tooltip", { key: 'a7b21a577af9075c1d80332704d021792e613b1a', for: "popover-target" }, this.i18n('goToPage')), index.h("gux-popover", { key: '13ce1b013c33fadfd010308520d07a48bd1b6a43', "is-open": this.isOpen, for: "popover-target" }, index.h("span", { key: 'dc6a07690edc69bf950713e2f9cb98b8bfedcfd6', slot: "title" }, this.i18n('goToPage')), index.h("gux-form-field-number", { key: 'c766915eb546ef42b32db89190af4ecaf70cfb61' }, index.h("input", { key: 'c7608a943f161504f06dac309a75a970b3c68f5b', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1" }), index.h("label", { key: 'b46f6b218298ce3e23a406c2bd34e34a7514258b', slot: "label" })))));
+        return (index.h(index.Host, { key: 'd9b92cbc76229abd556e3c105859b9036d9ceda0' }, index.h("button", { key: '9348eec87d35cbd1e7507c5e9206704985ce8d0e', 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: '524af1e54e32d5719e488fc7afbea8c1660151d3', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), index.h("gux-tooltip", { key: '744521b5c901703f50d24d20b20d6e428be6ba3e', for: "popover-target" }, this.i18n('goToPage')), index.h("gux-popover", { key: '6fbe6c2c5e7889a873f3485f4d3b27fc703df99c', "is-open": this.isOpen, for: "popover-target" }, index.h("span", { key: 'cfeb18c090167e3e0bc043aca0ccdf084779012a', slot: "title" }, this.i18n('goToPage')), index.h("gux-form-field-number", { key: 'c24d56f060daa11f490397d7709afaaa5382e8de' }, index.h("input", { key: '8fea62f041f7736de67fadb7738051dd41b6b5d8', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1" }), index.h("label", { key: '9618b6ae6da2f2a7bc9d70f616cd08ec1017b424', slot: "label" })))));
     }
     get root() { return index.getElement(this); }
 };
@@ -380,10 +381,10 @@ const GuxPopover = class {
         }
     }
     render() {
-        return (index.h("div", { key: 'e957afb69a900c56dc14741e574e3909f9f43a6e', ref: (el) => (this.popupElement = el), class: {
+        return (index.h("div", { key: '2b7721555957c555503984d1b99cd0f985f02fe1', ref: (el) => (this.popupElement = el), class: {
                 'gux-hidden': !this.isOpen,
                 'gux-popover-wrapper': true
-            }, "data-placement": true }, index.h("div", { key: 'b7d160b94dd631d7f061f09c0991bf1cf5e62b46', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), index.h("div", { key: 'f1aeb9fb32a26f0e6095168773ada0fa3f66bc37', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, index.h("slot", { key: '63f1225832ec3e8d55c35f119563287ec5154b66', name: "title" }), this.renderDismissButton()), index.h("div", { key: '549cd52615c4b456c3d21f0f7081f57dcbd0da5e', class: "gux-popover-content" }, index.h("slot", { key: '61346abcaa5ab9ba4da4e0f18378c9185becd785' }))));
+            }, "data-placement": true }, index.h("div", { key: '90a304adaf89272a3ffddaea02bf06a9d9db639c', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), index.h("div", { key: 'd432fb790d09e8578f197454ae13b18b53482c4f', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, index.h("slot", { key: '8ba600c6e8ea29d85e30e9831270ae643b7de998', name: "title" }), this.renderDismissButton()), index.h("div", { key: 'bed8b420b94df4e16d69704313d346e1e5b5ca4c', class: "gux-popover-content" }, index.h("slot", { key: 'b3f2c0b68314eef4df6c74c7464ab9c43dae4fc4' }))));
     }
     get root() { return index.getElement(this); }
 };

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

@@ -6,11 +6,12 @@ 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-a814956f.js');
+const usage = require('./usage-f12fac9e.js');
 const guxFormFieldFieldsetContainer = require('./gux-form-field-fieldset-container-366ae678.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const hasSlot = require('./has-slot-3edae188.js');
 const getSlotTextContent = require('./get-slot-text-content-83cb3c6d.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
 require('./get-closest-element-9e41d6b9.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
@@ -68,13 +69,13 @@ const GuxFormFieldPhone = class {
     }
     render() {
         var _a;
-        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '2af846c9e82251c8bc2ddeb13459eb2500701014', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: 'e4bee930190d0e53fda032af3c7f045abdb998df', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: 'b54d6f71f2c52383705814413dd523ab6789baa1', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError)), index.h("div", { key: '145ef25318f4d328218cc96f150b649755040ac1', class: "gux-input-and-error-container" }, index.h("div", { key: '03883064b641906109b00555ae6ca388f3e1b749', class: {
+        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '6affd84b369755acbdb345ba1bbf0df8743f354c', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: '2f6c21bb019a326a05a8fc633cf287243bbdb85e', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: '4e27c6a54ae3cafec0c3b1f6b65367174fc4d8f1', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError)), index.h("div", { key: '3e45489dbbacd6fcce986f529ad36a4d38c170a4', class: "gux-input-and-error-container" }, index.h("div", { key: 'ebf4f827fbdbbfb50d69a6777e1c0ce2d2a720ab', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: 'cedc8d5d6541125f5570350a19cecf4a74866805', class: {
+            } }, index.h("div", { key: '1f36188ec01f54bdb1d4f817353842cd2c295084', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("slot", { key: '8dfedd2efaec8bb1a69d96496c157fc2e54dae87' }))), index.h(guxFormField_service.GuxFormFieldError, { key: '8d4aa24ff49eb9ff3861fb6eb7ed61f412a2f243', show: this.hasError }, index.h("slot", { key: 'ac9de25b22dee2e4a4e5411229eb9cf3691ed4b9', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '55fdc67eadd5922082a91b8ac5bf9e878e90c1dc', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '9fc216565e0fa779819df4048d37bb82b85a184e', name: "help" })))));
+            } }, index.h("slot", { key: 'ac12e6827d24e67285d77c1b9ac860e8b08e8687' }))), index.h(guxFormFieldError.GuxFormFieldError, { key: '2273fc8feaa403a59e2e532a694fee1679037ff0', show: this.hasError }, index.h("slot", { key: 'b6af51fc18256eecf402845a3fe4258925921551', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '7864c1a75a6e2aa91f8177bbd3e9d43077f1521b', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '34c67369ba1d977639332f9050745fe6b4f74b43', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

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

@@ -7,8 +7,9 @@ const onInputDisabledStateChange = require('./on-input-disabled-state-change-660
 const onMutation = require('./on-mutation-3d294d15.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
-const usage = require('./usage-a814956f.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -49,10 +50,10 @@ const GuxFormFieldRadio = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'a732953664a7d3bb4aad3819f3bc91cfb542959c', class: {
+        return (index.h(index.Host, { key: '28c836ab0ee2e8f2f1c8f29370c3aea7ef6df159', class: {
                 'gux-input-error': this.hasError,
                 'gux-disabled': this.disabled
-            } }, index.h("div", { key: '2734679d96c190c3d53ace05ce19d025277ff8a3', class: "gux-form-field-container" }, index.h("div", { key: 'd6f3ddb7f1fe6601e2f93b29f3dadc69be3dda43', class: "gux-input-label" }, index.h("div", { key: '7c507fb6844488bd65b533e6ccd9bfa166f334ca', class: "gux-input" }, index.h("slot", { key: 'b0aec1017ca6e16f138e5667aa05991908412f8a', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: '5620a9cdbbc45e00ce60daa20eee7b308ba985eb', class: "gux-label", "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("slot", { key: 'fba3a170eb34e062c3823f196f326c4f4dfd8402', name: "label" }), index.h(guxFormField_service.GuxFormFieldError, { key: 'c5678610e687d55427a48bb0504eacc29d7455a6', show: this.hasError }, index.h("slot", { key: '1d343ea04a274d7c588f713716d12b726cc6fce5', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: 'a3ea40aa2b1718916adf306b2d473ddb54a48d9e', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '98d2ffbabbac698bf210adb75193a0a191072780', name: "help" })))))));
+            } }, index.h("div", { key: '27f76ad5558e3fd09d481c2b2af0a3c80c38e721', class: "gux-form-field-container" }, index.h("div", { key: '7469a60c3bd46491b4c1ef05f2dd054676ec6abb', class: "gux-input-label" }, index.h("div", { key: 'c31b65a701ee08dd4c68731c4b4dd69ba5b58fe9', class: "gux-input" }, index.h("slot", { key: 'ce09e0f8e1056cb21a6b0aa144714bae8e981503', name: "input", onSlotchange: () => this.setInput() })), index.h("div", { key: 'ed217abc020868dc6a5eca71fdf84f2d270ef115', class: "gux-label", "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("slot", { key: '30428682f186ceb7441bf1ef05f162fd8a405a2d', name: "label" }), index.h(guxFormFieldError.GuxFormFieldError, { key: '9f59d5286aa67af156cc6551bc556673815a81c2', show: this.hasError }, index.h("slot", { key: '2735b8d1910c83073253a76416e0e8e390092571', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '4511c94dfce56488a0a6d05861fd39d5cf245f53', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '216fd54ab7bd211eca63e0019a92ccc5424a6e9e', 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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 const onResize = require('./on-resize-da1477df.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
@@ -87,9 +88,9 @@ const GuxFormField = class {
         clearInterval(this.valueWatcherId);
     }
     render() {
-        return (index.h(index.Host, { key: '19f5810ea8f73b055f46f3a8b969669d9707415f', class: {
+        return (index.h(index.Host, { key: 'd106ba7b1e32d5773b44f026a0440d2acc4b030c', class: {
                 'gux-active': this.active
-            } }, index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '246ce9e053cbf2a50e351ea4173d2bdde33923dc', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '56eaab0972a668e7dee2d17df83d2edb876402d0', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '59b3ff1a9a66bb9ce728b3cc6e8f704935ae1b10', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: 'fda26c8ba627a552f07c48ce68b48b67e9311a19', class: "gux-input-and-error-container" }, this.renderRangeInput(), index.h(guxFormField_service.GuxFormFieldError, { key: '6e3e43e8172a6fc81f448942beed5c997775a3cc', show: this.hasError }, index.h("slot", { key: '1e5801770cc08517d4f91b5491a1297b8334174b', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '1435be7bcaef80c1122adee4aa211c6208a8f5bc', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'caa9bff21e2c05c88253bad45108f43ce3f0abec', name: "help" }))))));
+            } }, index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '7f3c78051a807f410d61cef6cabe23694b0b8290', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '01e543a73da28c9cae99d37cf469a42ef7de9b05', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'a6535225438e845c01d0ca319e40973a599f631a', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: 'e195e858dff0216a240e923d01d06c358f6e11eb', class: "gux-input-and-error-container" }, this.renderRangeInput(), index.h(guxFormFieldError.GuxFormFieldError, { key: '60fe2010cd30e615858598d791adecabf6b7a33b', show: this.hasError }, index.h("slot", { key: 'b7f60d30ccf2e181eb4a67d0e7e7daebd1f1824e', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'd68aec504ad633beb4949eca4e2939784495df6c', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'e95cb0d5fd538442559abe36a62cf897cbc56f27', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -67,13 +68,13 @@ const GuxFormFieldSearch = class {
         }
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '58c06b70fa0c0914647cdc867d863b666b893ed3', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '80e35b2e1029815f0e13ae7d9a8b46c53fbf018c', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '96a2707dfc53b46950076154c77e2b7cb9ec3bea', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '55cfc1f52cb60b46a1852f2db6709c28f37ac2d1', class: "gux-input-and-error-container" }, index.h("div", { key: '416a6683857cfa850c531f631b71a915839dae4d', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '5081b97b6633daef74de93c86464d864dafa4b44', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '7c2c6dbc3264a345ad3b0aee1954c066f9707abd', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '54342ab897574197e795e838f3244a9bc6f5b402', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: 'e6dca15410ecfa75984d4e8f5209a37c6ae236ff', class: "gux-input-and-error-container" }, index.h("div", { key: '4306d88d4441f8a2f5bb86eecb84fcda76521350', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: 'b76bcc1d3dd8c4004f05f4d6777a0766dc0d2389', class: {
+            } }, index.h("div", { key: '099cf65d76baff73e0b55d962429922d466d30fe', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("gux-icon", { key: 'fb9a66805ffde4ba97e14c2d396d098d4380b0f0', "icon-name": "fa/magnifying-glass-regular", decorative: true }), index.h("slot", { key: '08f781d16f8c0988a88c5dbdc9ed3be3aeee194e', name: "input" }), this.clearable && this.hasContent && !this.disabled && (index.h("gux-form-field-input-clear-button", { onClick: () => guxFormField_service.clearInput(this.input) })))), index.h(guxFormField_service.GuxFormFieldError, { key: '0a418826020e8ff21b8545492c7d5eebd31692c5', show: this.hasError }, index.h("slot", { key: '75c35edcc3ca3efdd0016714457171b354cf1b86', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '305d8def2a97282b6069b7a976be25e28c9deca4', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '494163366813a80c117639bb6a2c030ba192e5ca', name: "help" })))));
+            } }, index.h("gux-icon", { key: '2492abd9eb251d81cdc4ef6507b84ab77fecf019', "icon-name": "fa/magnifying-glass-regular", decorative: true }), index.h("slot", { key: '40115a2df912ff908b7e6309bdffbaf1003eb1a1', 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: 'b9076694fc0193859cce09869ff3c11085af29d6', show: this.hasError }, index.h("slot", { key: '8c79f3e8f005285113bada2211e647d4b3b817e8', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '83607e1cac369c2293903462046d105f71d61309', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'cce01be9010f0a07c3a0101c9a852e0a771af730', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -58,13 +59,13 @@ const GuxFormFieldSelect = class {
         }
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'baab7dd21e156bfb27319ff8a999b4c7a0dd70a2', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '40a33a912c507da585c10b5f4ad138015bbe8a59', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'b82d353125d8ad20e37e449f19e2575962611a9e', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: 'd82ccb9f69e242b9fcee871bd47a8716d07e20b6', class: "gux-input-and-error-container" }, index.h("div", { key: 'd614e581925fcfb86ccd4fce07c092eaa50c3512', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '00b1fb32c5bed5c60ff34426c51ab50872cd582a', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '048b61bbc5fad4d07ac5a02292b12922ac0d0112', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '3d1e02deac0a3488571da6a634e9faeba150ebb9', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: 'dc23a33b44f49cf82fef584c92fe3d15bfd24e52', class: "gux-input-and-error-container" }, index.h("div", { key: '359ffd1f9c78b3b166f09eac180be848fcecb309', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: 'dfbbdf8d93f6a7f9f2b7a4bad3b8687d7a7ea379', class: {
+            } }, index.h("div", { key: '444b9144fed905cae3ef8ec3d057df0b6de703aa', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("slot", { key: 'd457be1be7a7954ef691c39408ac256f260d9f4e', name: "input" }), index.h("gux-icon", { key: 'be9def4d0fa60f3324e721631e4f8816ef5fcf8b', "icon-name": "custom/chevron-down-small-regular", decorative: true }))), index.h(guxFormField_service.GuxFormFieldError, { key: '38aae01a5b3f59279ad162177843183c6804a393', show: this.hasError }, index.h("slot", { key: '00ad175eb8ceff6eac2f40c4e8d1a8d2c6a80cde', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '2eeca9caa8a051909388623db696e026c6d892d3', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '6c4fe025017da98a30d191870f41922818774ad7', name: "help" })))));
+            } }, index.h("slot", { key: 'b7690f4d5c33ad8f127ff0f4c526707df2b383b4', name: "input" }), index.h("gux-icon", { key: '399d742a725f07037993d65057f472e91283fe6a', "icon-name": "custom/chevron-down-small-regular", decorative: true }))), index.h(guxFormFieldError.GuxFormFieldError, { key: '56eea40adb1b3914e8e5d55795794fc085343798', show: this.hasError }, index.h("slot", { key: 'd66343cecb40804671737e05ee091c38e3a93395', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '3fc2bd54173472e4815a36e64508b6c6b321ea70', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '6257448567632d324c9868a8c5b6d21980ad092b', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -83,15 +84,15 @@ const GuxFormFieldTextLike = class {
         }
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '55a6cf8bc3e719c0f3a0e79ea2cb2126cdf89426', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: '5f8fe6205739b0d1e92c80bf4240ee16f02a8146', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '72ca7f9e8f9946fcaf2d8c25c367476e20648b25', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '0168bf7fdf030ef6c59d635814b16565c5bc4bfa', class: "gux-input-and-error-container" }, index.h("div", { key: '74d073de52d28d38c27719b34a58fc3a8bce8b18', class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: 'a1e361d7735682c672ea37285ba9074741fb9294', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'a82502fd2b76ea9a23602bdf1dfedb78d45dbbb0', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'f2618437db42ed9fdfb6775437fdbaad9fdccdc9', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: 'cdc9435838f24392560af01749de704e891b5976', class: "gux-input-and-error-container" }, index.h("div", { key: 'af977b0a1e2c691220d528bf1636963d30dc8a63', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: '61dc9d10ac90dad8d966ebfde013856c84b9f038', class: {
+            } }, index.h("div", { key: '6b7dff7086bade928cd08663b22919cc85b64b9a', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-has-prefix': this.hasPrefix,
                 'gux-has-suffix': this.hasSuffix
-            } }, index.h("slot", { key: '285a292cbb1a04f007f084f44a77b0d993be3aab', name: "prefix" }), index.h("slot", { key: 'c8cb79face98b1c9ab838b10258d06f5ef2d2cc7', name: "input" }), this.renderRadialLoading(), index.h("slot", { key: 'b97da9467c217b7643c522dca4a2c36de2b4b395', name: "suffix" }), this.clearable && this.hasContent && !this.disabled && (index.h("gux-form-field-input-clear-button", { onClick: () => guxFormField_service.clearInput(this.input) })))), index.h(guxFormField_service.GuxFormFieldError, { key: 'd9c47e139b0f23fd349f8b62be786af3babadd7a', show: this.hasError }, index.h("slot", { key: '9ebc0ea955879b70cacf001d299763c7e4c2e6c0', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: '8e0757c1363b5e7a5da501b4e52847993f6a3ce4', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '50af9326c84242ce67e9196f12a0c273de538197', name: "help" })))));
+            } }, index.h("slot", { key: 'c13edfa38d72d1c9ce9854f774d6725183a37b77', name: "prefix" }), index.h("slot", { key: '2408f9e2926d8cf3ee1f8a326914b1fe9470015b', name: "input" }), this.renderRadialLoading(), index.h("slot", { key: '0d185123a159ba22ee3372a4c42c3d3f6c9c7a49', name: "suffix" }), 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: 'ed7f2326a2e63da22dadb873b04e3145ae91bad2', show: this.hasError }, index.h("slot", { key: '0d4bbb6f54c9ff48f2eb6befb21499ec10b0bacb', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'd9c23685e62a16adc3251be08a0ad444d018c1dc', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '73c186e24ec5980a14859dd91443c84cc111da73', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const hasSlot = require('./has-slot-3edae188.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldContainer = require('./gux-form-field-container-51849136.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
 require('./simulate-native-event-e88bf64f.js');
@@ -62,12 +63,12 @@ const GuxFormFieldTextarea = class {
         }
     }
     render() {
-        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '494682f4ac2098c5771eef06dc0a778e66182635', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'f0b218f8974dbb90f1f3e570738d79379e963533', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: 'd46087bcd856fe9372b3a6a8fde277970ecb0d02', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '3ece84df8eb602d83f4688caf00ccaefb9e447fa', class: "gux-input-and-error-container" }, index.h("div", { key: '2dcd28afcdd0a1f96e93792e74700b43472b167c', ref: el => (this.textareaContainerElement = el), class: {
+        return (index.h(guxFormFieldContainer.GuxFormFieldContainer, { key: '11ece4734590df5dbc3dd57a25396dbae6c356fb', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldContainer.GuxFormFieldLabel, { key: 'fd49c1716f36edd989e7ad8317d2d9805ae936c6', position: this.computedLabelPosition, required: this.required }, index.h("slot", { key: '27f500f0e73bad522721c36244f20be0d7b11415', name: "label", onSlotchange: () => this.setLabel() })), index.h("div", { key: '58848d83f118763cf9eb2472a432b17cfa5da114', class: "gux-input-and-error-container" }, index.h("div", { key: '1dd0fc6b6ac1f8de54b5627e3f0fe2b3dd87f13d', ref: el => (this.textareaContainerElement = el), class: {
                 'gux-input': true,
                 [`gux-resize-${this.resize}`]: true,
                 'gux-disabled': this.disabled,
                 'gux-input-error': this.hasError
-            } }, index.h("slot", { key: '15eec3f490ff8ece0e654933460e800516dc4a0c', name: "input" })), index.h(guxFormField_service.GuxFormFieldError, { key: '0d3129e289b6ce134a031df09cc3f2e31e7ebfc6', show: this.hasError }, index.h("slot", { key: '11e32e54979c6e0590598e90722b626857045241', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: 'aafcca51d6122af87162d83e3bc88c6616e9d8d5', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '7f13240605fb68bfa7796c1c32563c135224c723', name: "help" })))));
+            } }, index.h("slot", { key: '32dbc6311403f984cf919ecd65ba25365bd316a2', name: "input" })), index.h(guxFormFieldError.GuxFormFieldError, { key: '02b7a46d01a3da2406c5fbb3f2b355b401dd0ca3', show: this.hasError }, index.h("slot", { key: '581a3c77300e8742b3b048a1f885441ce8d9b146', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: 'f176631e209a4077dbf133652c8100d0c7f56b54', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'ac6121c1025518648e5873d40c1460917d14d2c3', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const hasSlot = require('./has-slot-3edae188.js');
 const getSlotTextContent = require('./get-slot-text-content-83cb3c6d.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldFieldsetContainer = require('./gux-form-field-fieldset-container-366ae678.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./get-closest-element-9e41d6b9.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
@@ -72,13 +73,13 @@ const GuxFormFieldTimePicker = class {
     }
     render() {
         var _a;
-        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: 'ae4709aaff5ee2e057a54a3a5910b0bbbc9ebc06', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: '5ee1f0147dcdb554d2d921b66f0b2afc2d6ab139', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: 'fa722b21f1b7cd9a5b2f0243f2cd489137d9996d', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError)), index.h("div", { key: '232bde02c1cea41b2d50948919645d8d8b484c1e', class: "gux-input-and-error-container" }, index.h("div", { key: 'f102981af86be2542014700a04e2fff362ef662a', class: {
+        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '2c4aa38b0077b02ac436d7ae2416e798410451f6', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: 'f179f8f2f27e34cdf2f3a1883283e914beb57de9', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: '5e40f38fd6c40f946a48c1c4084ea850826f4ddf', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError)), index.h("div", { key: '0b85674bcabd466f530847e1fece1ec922464689', class: "gux-input-and-error-container" }, index.h("div", { key: 'ced84fc0e19298b46cc9f3d83b97ff40512640d2', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, index.h("div", { key: '3cd0a101d2c74beed6ac37bca4cc0f14494da62a', class: {
+            } }, index.h("div", { key: 'fbafbca9ee75ef20ecbd9a312399998285367f25', class: {
                 'gux-time-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("slot", { key: 'f6dcbaf31b7dded9a7c3e5d14ae3e7125964345e' }))), index.h(guxFormField_service.GuxFormFieldError, { key: '14ed5f69aac4f5dd0dbe545a429a6620f4bae9b3', show: this.hasError }, index.h("slot", { key: 'd7a0445b647d33fb41f841ab33888db209c2253e', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: 'edce8c2c7f40f3f266cff656c04f9511f3b25b22', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'ca292da1fcbf617694952a51268da98c300f9e24', name: "help" })))));
+            } }, index.h("slot", { key: 'ba1095c38f9191d5f83f0c36bcde7e1019d4f0a9' }))), index.h(guxFormFieldError.GuxFormFieldError, { key: 'e212decaf9f764d05a4d0991b69c3536fd55d74e', show: this.hasError }, index.h("slot", { key: 'ddb43aa4fcb2b95a5f857cbf745fae4a69f88be7', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '658b7d869e8b5542f5c0f9cb8ea60b21e675bd6f', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '35cc61cb53a60869b96dc7b57b467f04ed89d325', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

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

@@ -8,9 +8,10 @@ const onMutation = require('./on-mutation-3d294d15.js');
 const onAttributeChange = require('./on-attribute-change-321d434b.js');
 const hasSlot = require('./has-slot-3edae188.js');
 const getSlotTextContent = require('./get-slot-text-content-83cb3c6d.js');
-const guxFormField_service = require('./gux-form-field.service-136fe9f0.js');
+const guxFormFieldError = require('./gux-form-field-error-d11bcc8b.js');
 const guxFormFieldFieldsetContainer = require('./gux-form-field-fieldset-container-366ae678.js');
-const usage = require('./usage-a814956f.js');
+const guxFormField_service = require('./gux-form-field.service-f5697509.js');
+const usage = require('./usage-f12fac9e.js');
 require('./get-closest-element-9e41d6b9.js');
 require('./random-html-id-71c43d5a.js');
 require('./log-error-7b9d4b57.js');
@@ -72,12 +73,12 @@ const GuxFormFieldTimeZonePicker = class {
     }
     render() {
         var _a;
-        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '221339c9cdc5b5aad8ce193a06eeea61fed8015b', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: '872f50bb406b15ab6076e155cf8c2ad20319c4fb', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: 'caacd633f6fbc1b831bb4bf61f9f2f9fec894d63', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError)), index.h("div", { key: '117e568a0c3157e72f6869f42bacb8b7f203fbcc', class: "gux-input-and-error-container" }, index.h("div", { key: '5598ced3dadb1a0adcc68a0a24700ab31212fdcd', class: {
+        return (index.h(guxFormFieldFieldsetContainer.GuxFormFieldFieldsetContainer, { key: '25b3485ca0ffe0c1976416408c9f246ceddbdddb', labelPosition: this.computedLabelPosition }, index.h(guxFormFieldFieldsetContainer.GuxFormFieldLegendLabel, { key: '6751438df8065382f5730f9734562f54475c7ea0', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, index.h("slot", { key: '27f468b620b5b5778b182404da7c2907ea2844cc', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent.getSlotTextContent(this.root, 'error'), this.hasError)), index.h("div", { key: '10db7a8255f72cdb8dcf7908e7c47ff99103de2b', class: "gux-input-and-error-container" }, index.h("div", { key: 'dd9c0740448bfe714028ad49822ef426632dc1a0', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError,
                 'gux-time-zone-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, index.h("slot", { key: '36d4c79ddc4c3ffe16c1be66590b7e29ec1a995a' })), index.h(guxFormField_service.GuxFormFieldError, { key: 'cecadba80ef25836dec00dc6a49722b59b21d659', show: this.hasError }, index.h("slot", { key: '1e14a287e7725a50535d89a400cfe102da714e96', name: "error" })), index.h(guxFormField_service.GuxFormFieldHelp, { key: 'b5e53038e69e460e79200cff900cc2d98ad3a07a', show: !this.hasError && this.hasHelp }, index.h("slot", { key: '29b847bb2eeaa521377984d9ea148189d722f55e', name: "help" })))));
+            } }, index.h("slot", { key: '18787fda0dab208b535a6abfdab3e34a4e0844de' })), index.h(guxFormFieldError.GuxFormFieldError, { key: '9bf97849602ecfa044e7ff035f66e4199a1619b6', show: this.hasError }, index.h("slot", { key: '54ca621f58c523e495ed2d1d083e8f772bc091f5', name: "error" })), index.h(guxFormFieldError.GuxFormFieldHelp, { key: '28b723280b51b4095cb14841500feaf473a62173', show: !this.hasError && this.hasHelp }, index.h("slot", { key: 'f188c9e2b6ff20e6442ef7771ab529a3ee19032a', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

package/dist/cjs/{gux-form-field.service-136fe9f0.js → gux-form-field.service-f5697509.js}

@@ -1,28 +1,10 @@
 'use strict';
 
-const index = require('./index-7fb02c8c.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
 const logError = require('./log-error-7b9d4b57.js');
 const simulateNativeEvent = require('./simulate-native-event-e88bf64f.js');
 const hasSlot = require('./has-slot-3edae188.js');
 
-const GuxFormFieldHelp = ({ show }, children) => {
-    return (index.h("div", { class: {
-            'gux-form-field-help': true,
-            'gux-show': show
-        } },
-        index.h("div", { class: "gux-message" }, children)));
-};
-
-const GuxFormFieldError = ({ show }, children) => {
-    return (index.h("div", { class: {
-            'gux-form-field-error': true,
-            'gux-show': show
-        } },
-        index.h("gux-icon", { "icon-name": "fa/hexagon-exclamation-regular", decorative: true }),
-        index.h("div", { class: "gux-message" }, children)));
-};
-
 function setInputValue(input, value, focusAfter) {
     input.value = value;
     simulateNativeEvent.simulateNativeEvent(input, 'input');
@@ -139,8 +121,6 @@ function hasLabelSlot(root) {
     return Boolean(root.querySelector('label[slot="label"]'));
 }
 
-exports.GuxFormFieldError = GuxFormFieldError;
-exports.GuxFormFieldHelp = GuxFormFieldHelp;
 exports.clearInput = clearInput;
 exports.getComputedLabelPosition = getComputedLabelPosition;
 exports.getSlottedInput = getSlottedInput;

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7fb02c8c.js');
-const usage = require('./usage-a814956f.js');
+const usage = require('./usage-f12fac9e.js');
 const logError = require('./log-error-7b9d4b57.js');
 
 const legacyIconNames = [
@@ -543,7 +543,7 @@ const GuxIcon = class {
         return svgElement.outerHTML;
     }
     render() {
-        return (this.svgHtml && (index.h("div", { key: '01317365fb9db76a0abee670c75282e6bbb98462', class: "gux-icon-container", innerHTML: this.svgHtml })));
+        return (this.svgHtml && (index.h("div", { key: '78f4fcfef073edb176334060c2a1d308e85404de', class: "gux-icon-container", innerHTML: this.svgHtml })));
     }
     static get assetsDirs() { return ["icons"]; }
     get root() { return index.getElement(this); }