genesys-spark-components 4.62.2 → 4.63.1

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-radio-group/tests/gux-form-field-radio-group.e2e.js

@@ -1,17 +1,6 @@
 import { newE2EPage } from "@stencil/core/testing";
 import { newSparkE2EPage, a11yCheck } from "../../../../../../test/e2eTestUtils";
-const axeExclusions = [
-    {
-        issueId: 'color-contrast',
-        target: 'gux-form-field-radio-group-beta,span',
-        exclusionReason: 'WCAG 1.4.3 Contrast (Minimum), inactive user interface components do not need to meet contrast minimum'
-    },
-    {
-        issueId: 'color-contrast',
-        target: 'gux-form-field-radio-group-beta,span[role="presentation"]',
-        exclusionReason: 'WCAG 1.4.3 Contrast (Minimum), inactive user interface components do not need to meet contrast minimum'
-    }
-];
+const axeExclusions = [];
 async function newNonrandomE2EPage({ html }) {
     const page = await newE2EPage();
     await page.evaluateOnNewDocument(() => {
@@ -25,105 +14,109 @@ describe('gux-form-field-radio-group-beta', () => {
     describe('#render', () => {
         [
             `
-      <gux-form-field-radio-group-beta>
-        <label slot="group-label">Food</label>
-        <gux-form-field-radio>
-          <input slot="input" type="radio" name="food-1" value="pizza"/>
-          <label slot="label">Pizza</label>
-        </gux-form-field-radio>
-      </gux-form-field-radio-group-beta>
-       `,
+        <gux-form-field-radio-group-beta>
+          <label slot="group-label">Food</label>
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="pizza"/>
+            <label slot="label">Pizza</label>
+          </gux-form-field-radio>
+        </gux-form-field-radio-group-beta>
+      `,
             `
-       <gux-form-field-radio-group-beta>
-       <label slot="group-label">Food</label>
-   
-       <gux-form-field-radio>
-         <input slot="input" type="radio" name="food-1" value="pizza" />
-         <label slot="label">Pizza</label>
-       </gux-form-field-radio>
-   
-       <gux-form-field-radio>
-         <input
-           slot="input"
-           type="radio"
-           name="food-1"
-           value="sandwich"
-           disabled
-         />
-         <label slot="label">Sandwich</label>
-       </gux-form-field-radio>
-   
-       <gux-form-field-radio>
-         <input slot="input" type="radio" name="food-1" value="spaghetti" />
-         <label slot="label">Spaghetti</label>
-         <span slot="help">This is a help message</span>
-       </gux-form-field-radio>
-       <span slot="group-error">Subject to availibility</span>
-     </gux-form-field-radio-group-beta>
-       `,
-            `<gux-form-field-radio-group-beta>
-       <label slot="group-label">Food</label>
-   
-       <gux-form-field-radio>
-         <input slot="input" type="radio" name="food-1" value="pizza" />
-         <label slot="label">Pizza</label>
-       </gux-form-field-radio>
-   
-       <gux-form-field-radio>
-         <input
-           slot="input"
-           type="radio"
-           name="food-1"
-           value="sandwich"
-           disabled
-         />
-         <label slot="label">Sandwich</label>
-       </gux-form-field-radio>
-   
-       <gux-form-field-radio>
-         <input slot="input" type="radio" name="food-1" value="sushi" />
-         <label slot="label">Sushi</label>
-         <span slot="error">Subject to availibility</span>
-       </gux-form-field-radio>
-   
-       <gux-form-field-radio>
-         <input slot="input" type="radio" name="food-1" value="spaghetti" />
-         <label slot="label">Spaghetti</label>
-         <span slot="help">This is a help message</span>
-       </gux-form-field-radio>
-       <span slot="group-help">This is a group help message</span>
-     </gux-form-field-radio-group-beta>`,
-            ` <gux-form-field-radio-group-beta disabled>
-     <span label="group-label">Food</span>
- 
-     <gux-form-field-radio>
-       <input slot="input" type="radio" name="food-1" value="pizza" />
-       <label slot="label">Pizza</label>
-     </gux-form-field-radio>
- 
-     <gux-form-field-radio>
-       <input
-         slot="input"
-         type="radio"
-         name="food-1"
-         value="sandwich"
-         disabled
-       />
-       <label slot="label">Sandwich</label>
-     </gux-form-field-radio>
- 
-     <gux-form-field-radio>
-       <input slot="input" type="radio" name="food-1" value="sushi" />
-       <label slot="label">Sushi</label>
-       <span slot="error">Subject to availibility</span>
-     </gux-form-field-radio>
- 
-     <gux-form-field-radio>
-       <input slot="input" type="radio" name="food-1" value="spaghetti" />
-       <label slot="label">Spaghetti</label>
-       <span slot="help">This is a help message</span>
-     </gux-form-field-radio>
-   </gux-form-field-radio-group-beta>`
+        <gux-form-field-radio-group-beta>
+          <label slot="group-label">Food</label>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="pizza" />
+            <label slot="label">Pizza</label>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input
+              slot="input"
+              type="radio"
+              name="food-1"
+              value="sandwich"
+              disabled
+            />
+            <label slot="label">Sandwich</label>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="spaghetti" />
+            <label slot="label">Spaghetti</label>
+            <span slot="help">This is a help message</span>
+          </gux-form-field-radio>
+          <span slot="group-error">Subject to availibility</span>
+        </gux-form-field-radio-group-beta>
+      `,
+            `
+        <gux-form-field-radio-group-beta>
+          <label slot="group-label">Food</label>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="pizza" />
+            <label slot="label">Pizza</label>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input
+              slot="input"
+              type="radio"
+              name="food-1"
+              value="sandwich"
+              disabled
+            />
+            <label slot="label">Sandwich</label>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="sushi" />
+            <label slot="label">Sushi</label>
+            <span slot="error">Subject to availibility</span>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="spaghetti" />
+            <label slot="label">Spaghetti</label>
+            <span slot="help">This is a help message</span>
+          </gux-form-field-radio>
+          <span slot="group-help">This is a group help message</span>
+        </gux-form-field-radio-group-beta>
+      `,
+            `
+        <gux-form-field-radio-group-beta disabled>
+          <label slot="group-label">Food</label>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="pizza" />
+            <label slot="label">Pizza</label>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input
+              slot="input"
+              type="radio"
+              name="food-1"
+              value="sandwich"
+              disabled
+            />
+            <label slot="label">Sandwich</label>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="sushi" />
+            <label slot="label">Sushi</label>
+            <span slot="error">Subject to availibility</span>
+          </gux-form-field-radio>
+
+          <gux-form-field-radio>
+            <input slot="input" type="radio" name="food-1" value="spaghetti" />
+            <label slot="label">Spaghetti</label>
+            <span slot="help">This is a help message</span>
+          </gux-form-field-radio>
+        </gux-form-field-radio-group-beta>
+      `
         ].forEach((html, index) => {
             it(`should render component as expected (${index + 1})`, async () => {
                 const page = await newNonrandomE2EPage({ html });

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-radio-group/tests/gux-form-field-radio-group.spec.js

@@ -88,7 +88,7 @@ describe('gux-form-field-radio-beta', () => {
       <span slot="group-help">This is a group help message</span>
     </gux-form-field-radio-group-beta>`,
             ` <gux-form-field-radio-group-beta disabled>
-        <label slot="group-label">Food</span>
+        <label slot="group-label">Food</label>
 
         <gux-form-field-radio>
           <input slot="input" type="radio" name="food-1" value="pizza" />

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

@@ -82,9 +82,9 @@ export class GuxFormField {
         clearInterval(this.valueWatcherId);
     }
     render() {
-        return (h(Host, { key: 'ab911417f8987db8dae45169245281a517a2e0bc', class: {
+        return (h(Host, { key: '555a470f41986a6ab8731c8803b240b30cd4d65e', class: {
                 'gux-active': this.active
-            } }, h(GuxFormFieldContainer, { key: '4fd8e66e4a8ce9b4d089f91ff858d376530ee311', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'b216389853b2fc1159d08c6197642a962c32a6f2', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'f0e54cd4a3c8f5138718a1f5dfc0f2d25fa3606c', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '616c791c64a1f595a729f201a28efe3e2a816b20', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: '9c5a20f9fb423e34c0dd99e91aa40c994732ca54', show: this.hasError }, h("slot", { key: '6627e9d4bdf8e1f28add3de842b3305e4fda3f2f', name: "error" })), h(GuxFormFieldHelp, { key: '291c0dacc1116dc58eb41db4f54875bd3121c158', show: !this.hasError && this.hasHelp }, h("slot", { key: '97345b7e0f110c4ddd500f26848960d9c61d02d8', name: "help" }))))));
+            } }, h(GuxFormFieldContainer, { key: '39f20232cd05020500ab0a9aa9be1fdaf1291619', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '1bbfe067086bc8c7d7673b5cdc9c789052b08a86', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'eaca0784721a3cd922dc07a5cd769fe18601aabd', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '23fc47b9206f15812a47dcef4f28825021619426', class: "gux-input-and-error-container" }, this.renderRangeInput(), h(GuxFormFieldError, { key: '123775129952675ae780f24308deee4151d1c102', show: this.hasError }, h("slot", { key: '98bc664e228397f35fe3c9459d61543d33de50bc', name: "error" })), h(GuxFormFieldHelp, { key: '58bd604286dc20f3228eebe9796a92f1dae762d0', show: !this.hasError && this.hasHelp }, h("slot", { key: '6570f867aa63fa8ef6d679b419419376565e4d78', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

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

@@ -62,13 +62,13 @@ export class GuxFormFieldSearch {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'f00607cfa9dd0dd961ca87d93aadc86dada59955', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'f97392a34ffd54d453e5fa8eab87af33a19aafee', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '40386b8ea847c417561968ce09cfef3218c2b779', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '1b40b3d66c8ee971240dbb79477eccab3262daae', class: "gux-input-and-error-container" }, h("div", { key: '48596cfe8e15b3647c3446309947ae3439a2aa61', class: {
+        return (h(GuxFormFieldContainer, { key: '5ed3aaeee90391b9a7b9a5dd162fe5901d5bba64', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '6aba7a96cd2cfaed4078e7f27bbb7c35b10f565a', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'a1ba5413c0bdc64b35623b7c55acc4bdf73593fc', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '5e1e1fbd4284e0693282c4ad81c301d866c92c24', class: "gux-input-and-error-container" }, h("div", { key: '64ec4e3f17fdc0fc90e8a502e02fcdb2471c6919', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'f32239cdfa609f8637d70887364b1aa297431bc5', class: {
+            } }, h("div", { key: 'f3189f5fe549c8bacfc867684ac5b84a426aef06', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("gux-icon", { key: '2b7f2f102517c1fa52a1f68d32d559ebbe8f4c27', "icon-name": "fa/magnifying-glass-regular", decorative: true }), h("slot", { key: 'a05847665f136b0a8ab2fb3cf99ae82e38b503eb', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: 'ae5562689221e73b608d14884c32a4685023dfc9', show: this.hasError }, h("slot", { key: '4d3d2a02059ca3f22961a20b651f30698d0bb837', name: "error" })), h(GuxFormFieldHelp, { key: 'bbee0d886b9dfe5bb468b17062188df7de70fc53', show: !this.hasError && this.hasHelp }, h("slot", { key: '913206b4f832954b7d8b2e63eb4f04af3a6fc116', name: "help" })))));
+            } }, h("gux-icon", { key: '57e4528eac359bb1580e145dad3651955fda1daf', "icon-name": "fa/magnifying-glass-regular", decorative: true }), h("slot", { key: '4d4711e0186639fa96b535bc9eaec2ba9a7380d3', name: "input" }), this.clearable && this.hasContent && !this.disabled && (h("gux-form-field-input-clear-button", { onClick: () => clearInput(this.input) })))), h(GuxFormFieldError, { key: '1538996618a45b3f7029c6a64413782a4880b25d', show: this.hasError }, h("slot", { key: 'ca2785b35aa7791b17b7f8a5362229141af59b47', name: "error" })), h(GuxFormFieldHelp, { key: '24cb43bfc43dcebc9543d3353da8bebbe1d112f4', show: !this.hasError && this.hasHelp }, h("slot", { key: 'bae67ddb44efc1b45ddaf8254267115c86b72a4b', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -53,13 +53,13 @@ export class GuxFormFieldSelect {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'f58fc0d759ccdbceb99dcf2a3ad807ed8c4221b9', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '30ff86898ffb5770b3cd632d84cf481f8d1355ff', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'e4838ccd6ec174bae23902af8bc4446981503787', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: '65d278d8549366d02759698b511d60abf1db3389', class: "gux-input-and-error-container" }, h("div", { key: '8a89344b263745ef9a1f39cc66f4577daabffe87', class: {
+        return (h(GuxFormFieldContainer, { key: '71560e52fd946884252bab335b9bd4d3c799fcd8', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'b3d111f96ea13f348bba62f9081fd49b4d38c842', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'ae493203aa4f45506032269d6f4aeb17ac898c68', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'fae6260a05a95d676d9d26be8ac8193e1ac48253', class: "gux-input-and-error-container" }, h("div", { key: '0affd627db23cee070538734c270edae97112516', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: 'ba4bf085608671a1224a35fdb2c2227b04708c39', class: {
+            } }, h("div", { key: 'aa35c1b1e99ee28ec05ef4c357fb2f734766c453', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '4d8338db3bdd45abc4aefeb31f5dd3aec53d8471', name: "input" }), h("gux-icon", { key: '07d9a44ba9e17cf33bf83959c61788e9af21741e', "icon-name": "custom/chevron-down-small-regular", decorative: true }))), h(GuxFormFieldError, { key: 'cccd81f08fbd22012613882dc29391dbe0cd87bb', show: this.hasError }, h("slot", { key: '6afa10449eb38f0323b6a6d0dbb15a9516eddb8e', name: "error" })), h(GuxFormFieldHelp, { key: '3ee2f5880ce92ebc8ee37e9697235a60dc37da3e', show: !this.hasError && this.hasHelp }, h("slot", { key: 'f78fa30b128f5b50a76635475131478559473a8c', name: "help" })))));
+            } }, h("slot", { key: 'e0b55eb8b19490eb6bd5ad167382cb1bb2af3c05', name: "input" }), h("gux-icon", { key: '7c218454fcd6448f674cfae5424043c20fce2d14', "icon-name": "custom/chevron-down-small-regular", decorative: true }))), h(GuxFormFieldError, { key: '890a27ccc85e96f0e628dd9b905b3b4ed65050e4', show: this.hasError }, h("slot", { key: '6741388a2325f9c472ffae38a88eb58f34a15338', name: "error" })), h(GuxFormFieldHelp, { key: '36ad5cf7f4bbf0048abed1c3194cf852f18a93e4', show: !this.hasError && this.hasHelp }, h("slot", { key: '74a733da174b4687f88adf33ddadcad73560e0aa', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -57,12 +57,12 @@ export class GuxFormFieldTextarea {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '30002bf2fd4403de6a812ee46ab0ba04420bd58a', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '5acc27c24af2cc259363a0a9e551946ffe951cf2', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '605c33a9258b0a4b713454d59903256482e23d80', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'da821fd3c03fd7e815fcaf10d605c3218f542cc2', class: "gux-input-and-error-container" }, h("div", { key: '9c67ad442bcf103250fe0e517c4e12368efc51c8', ref: el => (this.textareaContainerElement = el), class: {
+        return (h(GuxFormFieldContainer, { key: 'c9f234ba85bd5c74f2055e0e92da75ffa2387f7b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'b3a0ffa00cd263edbc3f324586482006c631c0f0', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '653cb3c9e3951eb736124457ef8d61e576a16100', name: "label", onSlotchange: () => this.setLabel() })), h("div", { key: 'cc1db32ae61b2080033b01970162e2bc8d4407c5', class: "gux-input-and-error-container" }, h("div", { key: '1698d45688f8b70cce2707c39a5a064b6e6328d0', ref: el => (this.textareaContainerElement = el), class: {
                 'gux-input': true,
                 [`gux-resize-${this.resize}`]: true,
                 'gux-disabled': this.disabled,
                 'gux-input-error': this.hasError
-            } }, h("slot", { key: '089685c1e8e4ad74a087bce1567cfaf9ea8cb0b0', name: "input" })), h(GuxFormFieldError, { key: 'b2dab4ad4c403f313704347847af60c1e3fd48a9', show: this.hasError }, h("slot", { key: '476b6baa6fd870cc9ed37e7dc2c0e6c5507513fe', name: "error" })), h(GuxFormFieldHelp, { key: '5cfcc2330057b42e5d8fabd3bd1fc834ee07fadd', show: !this.hasError && this.hasHelp }, h("slot", { key: '9899bd978401bf2ac9bfea2b98c3c1020971c3e4', name: "help" })))));
+            } }, h("slot", { key: '4a6ad15452fc7ddb08e80e6bbf72512096d67af4', name: "input" })), h(GuxFormFieldError, { key: '8ad3247396074f2901a03ef0e8b8730516665a06', show: this.hasError }, h("slot", { key: '51a86cb8c4c0aa7afcbfd6c21d4b7ce4a61503c2', name: "error" })), h(GuxFormFieldHelp, { key: 'f2e760497107c5d9f38e778898b2802de7d7598f', show: !this.hasError && this.hasHelp }, h("slot", { key: '953db9f931de9c98faa53ed05ac7aad23e9475f6', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -61,13 +61,13 @@ export class GuxFormFieldTimePicker {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: 'f5154769059a9725983ef4d4d3b93002c102da02', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: 'd58497619db5f569c82bc9e876853271d577d7b9', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '753d15d89d8900991815ccc55afb738ec12ba1d3', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: 'ba3f292271b2cdcc6802830d5c3b1c176be107e7', class: "gux-input-and-error-container" }, h("div", { key: '380d8ebe10e0f54ef5c6b64f33c36069470d5b75', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '567e8415a3056f89a631927079a8853dfa3be29d', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '885ad3676005e7ef8b42d4a57975a8106ede917c', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '19bd0809e858a22af995909e15304040f6a8d0ee', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: 'ba77f4248745a859c40fa02d576df03296ac740a', class: "gux-input-and-error-container" }, h("div", { key: '5d4482c64e9dd26b09d555c478c5bbb9ce05dcc1', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '7f84fd70ca81b1813063b1b8f3c5d42fc525af57', class: {
+            } }, h("div", { key: 'a42797e638481307999e2642017967c5d64a36c6', class: {
                 'gux-time-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '16e96b921b2fb64bd759bb5afb2dc0532fd8ae02' }))), h(GuxFormFieldError, { key: '0a0241f374fb75ff074d9c3c9cca3ab193307d78', show: this.hasError }, h("slot", { key: '0247e4a54be9d59103c5884dde53a129b156631b', name: "error" })), h(GuxFormFieldHelp, { key: 'b4c8f4b3c20edcea1c500f118671c239d75ce894', show: !this.hasError && this.hasHelp }, h("slot", { key: '0e669a3b49fa7c7520acdd3c08a27066e90bf167', name: "help" })))));
+            } }, h("slot", { key: 'a6377d5ccf68b6c71aad7f24d08e8e350b621ca2' }))), h(GuxFormFieldError, { key: '6e9d3e43724562991bee6e4e4460416409bb2120', show: this.hasError }, h("slot", { key: '84468b92e25b1d05c0f986f3843002c7cb9eaa78', name: "error" })), h(GuxFormFieldHelp, { key: 'ed2b787bb6a6cce1183f2da2760322de1b8c7ae1', show: !this.hasError && this.hasHelp }, h("slot", { key: '9e51298096553178c7ebef0fb56209db18cb7eed', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

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

@@ -61,12 +61,12 @@ export class GuxFormFieldTimeZonePicker {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: 'd450f811957fdc581b5889f22d70a56f96dfb139', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: 'ac18a55b69ea7ff65a3caa377cb1aa0e5afbd641', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '94b4dfc511929b5e3380c62c999ec44d1e7564c5', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '58cf1488239a1511bf870df57109a9f3011b06a6', class: "gux-input-and-error-container" }, h("div", { key: '62fa2d885f76d417e6e5e76fa47a213ba4f482ed', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '15ffed26b936f5d57f7839012009e29a5612b2ae', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLegendLabel, { key: '721b5ad0a2679aed79890808338c940b30d479c2', position: this.computedLabelPosition, required: this.required, labelText: (_a = this.label) === null || _a === void 0 ? void 0 : _a.textContent }, h("slot", { key: '9906b0708f0361f70d92dac5a7da230afd851fa6', name: "label", onSlotchange: () => this.setLabel() }), this.renderScreenReaderText(this.getI18nValue('required'), this.required), this.renderScreenReaderText(getSlotTextContent(this.root, 'error'), this.hasError)), h("div", { key: '4e6870799ce3cfc28dc0009ad72486e1574f4bc6', class: "gux-input-and-error-container" }, h("div", { key: '2104167a9235bfeb76a5f8b893982c32501214f5', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError,
                 'gux-time-zone-picker-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '9bf1a71c5f329e6daa3981892cb3d1556841b945' })), h(GuxFormFieldError, { key: '1d59017b5a8194225e5773fb94c8cf0e76c8559d', show: this.hasError }, h("slot", { key: '0ba994d4492af9cb930e867be15104b030f2c036', name: "error" })), h(GuxFormFieldHelp, { key: '5014b949671c39767ee2d289c2f1d4f4abf59658', show: !this.hasError && this.hasHelp }, h("slot", { key: 'eb50b5dd63bd44d33bc6c4506bf3dce893a80d91', name: "help" })))));
+            } }, h("slot", { key: 'b486aa93ebb8c1cefe20aa8e387717ba73ac4514' })), h(GuxFormFieldError, { key: '994796fc6a3b3e504d57ca44812638934b63e2ac', show: this.hasError }, h("slot", { key: '5adf48d91774ab8ab67b2606d05079d8ba186635', name: "error" })), h(GuxFormFieldHelp, { key: 'b5bd31ce326bfe81663c08cb341f0117b97cdc83', show: !this.hasError && this.hasHelp }, h("slot", { key: 'a57644c2e2771833535ccd85c284442ffcf890a2', name: "help" })))));
     }
     renderScreenReaderText(text, condition = true) {
         if (condition) {

package/dist/collection/components/stable/gux-form-field/functional-components/gux-form-field-fieldset-container/gux-form-field-fieldset-container.js

@@ -1,7 +1,13 @@
 import { h } from "@stencil/core";
-export const GuxFormFieldFieldsetContainer = ({ labelPosition }, children) => {
+export const GuxFormFieldFieldsetContainer = ({ labelPosition, disabled }, children) => {
+    if (disabled) {
+        return (h("fieldset", { class: {
+                'gux-form-field-fieldset-container': true,
+                [`gux-${labelPosition}`]: Boolean(labelPosition)
+            }, "aria-disabled": "true" }, children));
+    }
     return (h("fieldset", { class: {
             'gux-form-field-fieldset-container': true,
-            [`gux-${labelPosition}`]: true
+            [`gux-${labelPosition}`]: Boolean(labelPosition)
         } }, children));
 };

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

@@ -8,7 +8,7 @@ export class GuxFormFieldInputClearButton {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("button", { key: 'a084accbb1073a43f220570ee24b483acd28ba00', tabIndex: -1, type: "button", title: this.i18n('clear') }, h("gux-icon", { key: '8d0b6d02390cdefb292a12fb0f0ff6417cf0e0c5', "icon-name": "fa/xmark-large-regular", decorative: true })));
+        return (h("button", { key: 'f2ca1f6b2662be485b2810c61c7f3bc6c910c4a3', tabIndex: -1, type: "button", title: this.i18n('clear') }, h("gux-icon", { key: '742e4e73ae7d607433cdff90a26ce96726fc4929', "icon-name": "fa/xmark-large-regular", decorative: true })));
     }
     static get is() { return "gux-form-field-input-clear-button"; }
     static get encapsulation() { return "shadow"; }

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

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

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

@@ -28,10 +28,10 @@ export class GuxAlert {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: 'e95ad17689a44b33f8cbc5497e45e7ba5887234a', class: {
+        return (h("div", { key: '441d71a8c6cfe5e0c7c1dfe62b70d7a607503d32', class: {
                 'gux-inline-alert': true,
                 [`gux-${this.accent}`]: true
-            } }, h("div", { key: '078ccfcc6ff24ff01f694a9af4f7bc84520369f9', class: "gux-message-wrapper" }, h("gux-icon", { key: '39f55da6f333a292b921111eabd1e8ee694c5160', "icon-name": this.getIcon(this.accent), decorative: true }), h("div", { key: 'f8e04ba95cf07f4e35b63798a5c33fab5be484b6', class: "gux-sr-only" }, this.i18n(this.accent)), h("div", { key: '2097b7e9cf9b21818b2f5ffb18c9307639cfe1d3', class: "gux-content" }, h("slot", { key: 'd32f93fbe9e146d93bb681f3614537a1809296a3', name: "content" }, h("slot", { key: 'b9030f479f208b77f40f1b9f3f1694efcf5cc623' }))))));
+            } }, h("div", { key: 'aec305145d4cc0c58fe7b3762a6cd77fb4551787', class: "gux-message-wrapper" }, h("gux-icon", { key: '636814087e9f5d3acb4228cccd1aa28f59ec2966', "icon-name": this.getIcon(this.accent), decorative: true }), h("div", { key: '50a2b862dabc781d586b46e8ee8e3a2a5f39c114', class: "gux-sr-only" }, this.i18n(this.accent)), h("div", { key: '89980c218894c919fc1577f1d330458b007df78b', class: "gux-content" }, h("slot", { key: 'd083d3e2d5cdabf5b19f4b92ff2202dadccc7cd2', name: "content" }, h("slot", { key: '76ce00860b2058b3993a759a30c92e40b944db54' }))))));
     }
     static get is() { return "gux-inline-alert"; }
     static get encapsulation() { return "shadow"; }

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

@@ -31,11 +31,11 @@ export class GuxCreateOption {
         return (h("span", { class: "gux-screenreader" }, this.i18n('createCustomOptionInstructions')));
     }
     render() {
-        return (h(Host, { key: '47304aae40590b1908c558d5b775af506a25f8d1', role: "option", "aria-selected": false, class: {
+        return (h(Host, { key: 'dd87699076773c5184631f5f5b59fdd2fd95c888', role: "option", "aria-selected": false, class: {
                 'gux-active': this.active,
                 'gux-hovered': this.hovered,
                 'gux-filtered': this.filtered
-            } }, h("div", { key: '347a6882a380ae6f52e71dd6833e403faa770c47', class: "gux-option" }, h("gux-icon", { key: 'cb81bb756fe84d5f35c8b5229c77dbcde105ee9d', decorative: true, "icon-name": "fa/plus-regular" }), h("div", { key: 'eb93e52b3517257d830f63afa3b83df387512f5b', class: "gux-create-text" }, this.i18n('createOption', {
+            } }, h("div", { key: '454362bda09d1e3be44069ef4cb9f6f41ae5bacc', class: "gux-option" }, h("gux-icon", { key: '9a24040a506ba2e7f060b21fd2eeec625e91560f', decorative: true, "icon-name": "fa/plus-regular" }), h("div", { key: '99f8a3203993e0ee6222135be58c1dd3820a1f02', class: "gux-create-text" }, this.i18n('createOption', {
             optionValue: this.value
         })), this.renderCustomOptionInstructions())));
     }

package/dist/collection/components/stable/gux-loading-message/gux-loading-message.js

@@ -10,7 +10,7 @@ export class GuxLoadingMessage {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: '6456d7e19f794642cb4f5104c7d4e5b235ff78d5', class: "gux-container", role: "alert", "aria-live": "assertive" }, h("div", { key: '5df0cb814ca9a6e73ec911f5c5f6f9aa3fec2f56', class: "gux-progress" }, h("slot", { key: '7564d594ffbd4703b6968350fdf788db677e75e5', name: "progress" })), h("div", { key: '84192e09f5375756b16d914e714a7981d0f4f80e', class: "gux-primary-message" }, h("slot", { key: '0b993daeb60f63c4b91a56e9af5c4574ebf5ed2d', name: "primary-message" })), h("div", { key: '34b79bd828d27da60fd6c95c89ffbc4c1a5bb946', class: "gux-additional-guidance" }, h("slot", { key: 'b6d49acaacf8ee3274299e27a1a97a115e77e216', name: "additional-guidance" }))));
+        return (h("div", { key: '33277af46593927d8973743ddcbded04e4b4783a', class: "gux-container", role: "alert", "aria-live": "assertive" }, h("div", { key: '68bbcba983f3ac24cf94fcc6605b6dc41dbf5b73', class: "gux-progress" }, h("slot", { key: 'e3f43dd8df60f685f870c62de67c615276cd52fc', name: "progress" })), h("div", { key: '0c8feb14ba005c1a3805bbf71167d7d7ab155ab1', class: "gux-primary-message" }, h("slot", { key: '083bbe256926363be8fc00f094ab8f31e048d717', name: "primary-message" })), h("div", { key: '2852d9fbc9623912ff43259a499d81a14d29bbef', class: "gux-additional-guidance" }, h("slot", { key: '3ba735caeb77b462151e71c1652fdfdc064c2a13', name: "additional-guidance" }))));
     }
     static get is() { return "gux-loading-message"; }
     static get encapsulation() { return "shadow"; }

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

@@ -59,7 +59,7 @@ export class GuxModal {
     render() {
         const hasModalTitleSlot = this.hasModalTitleSlot();
         const titleID = randomHTMLId();
-        return (h("dialog", { key: '7d21671835c13c9103dfd3af13cfc3a3878c9dc9', onClose: this.onCloseHandler.bind(this), ref: el => (this.dialogElement = el), "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: '53cad448d18354572a7b0278629c8d02a771a382', class: `gux-modal-container gux-${this.size}` }, h("gux-dismiss-button", { key: '17e1783ceb145a72b0aa0de7a8410e34b0ec17e3', onClick: this.onDismissHandler.bind(this) }), hasModalTitleSlot && this.renderTitle(titleID), h("div", { key: 'cfdbabe4b805c0edc0f971daf14172cf4fc75b47', class: "gux-modal-content" }, h("p", { key: '45bb9292f09d8e02362baf3ec51de1b2ecaa2a1d' }, h("slot", { key: 'a375e25b53af3cdbb257ba9862793f5be190d91f', name: "content" }))), this.renderButtonFooter())));
+        return (h("dialog", { key: '66b7450c9c38cc5f603467019298f72b5d14e492', onClose: this.onCloseHandler.bind(this), ref: el => (this.dialogElement = el), "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'e2e631b581883a894de6b346cc0f660bd1325f31', class: `gux-modal-container gux-${this.size}` }, h("gux-dismiss-button", { key: 'b37df71b42ac758cd0453d0a40d3c3830eaebf1c', onClick: this.onDismissHandler.bind(this) }), hasModalTitleSlot && this.renderTitle(titleID), h("div", { key: 'd35158e367ab833f9aa69ebbb233a936cd917f07', class: "gux-modal-content" }, h("p", { key: 'a5a1d2c2323cfd0d4774e342dec073ea813e4dbc' }, h("slot", { key: 'd8254893056105c3fd6e5e480d580d3315e4e80d', name: "content" }))), this.renderButtonFooter())));
     }
     renderTitle(titleID) {
         return (h("h1", { class: "gux-modal-header", id: titleID }, h("slot", { name: "title" })));

package/dist/collection/components/stable/gux-page-loading-spinner/gux-page-loading-spinner.js

@@ -8,7 +8,7 @@ export class GuxPageLoadingSpinner {
         trackComponent(this.root);
     }
     render() {
-        return (h("gux-radial-loading", { key: 'dda7f3014eaaa93ea46c3e0b5fa61d29b09090e6', class: "gux-spinner", "screenreader-text": this.screenreaderText, context: "full-page" }));
+        return (h("gux-radial-loading", { key: '1d60866b1067b1b1465987a97545688fddb6061c', class: "gux-spinner", "screenreader-text": this.screenreaderText, context: "full-page" }));
     }
     static get is() { return "gux-page-loading-spinner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-pagination/gux-pagination-buttons/gux-pagination-buttons.js

@@ -59,7 +59,7 @@ export class GuxPaginationButtons {
         this.i18n = await buildI18nForComponent(this.root, paginationResources);
     }
     render() {
-        return (h("div", { key: '50c3428989b6f792bd573e548d9b010507747c28', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '44a173266c12ba8043639e7ec8f027cafd11b65d', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '2bed24b1582879ad818114d4c7f73087f273d217', accent: "ghost" }, h("button", { key: 'd83dfde41e0b73bfb955ae6357dac18a6b5866f5', title: this.i18n('firstPage'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '8345ad540ca5a1a46684a62915eab8d721a09d7e', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: 'ab9fe1c9490ca10cdf1d0f4145493400947c08ec', accent: "ghost" }, h("button", { key: 'cf8e278d0a6c4e0f3818b2921d8179924b78aa0d', title: this.i18n('previousPage'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: '700014c8cd2ad764edaa62b1b40c499542ff0afa', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPageNavigation(), h("div", { key: '6a93b71497bc0c5a047eb65aa994140847ad78dc', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '62c9ee5306a2c8d875127ce343f7435cf223c2f3', accent: "ghost" }, h("button", { key: '99c6457ba2793a97cd84c7dfc41c57a3c28537be', title: this.i18n('nextPage'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: 'c467ded869b42196bc6d322beba219fdafe5bb53', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: '92715b4719202641cca5850a4c92cf91038e37d1', accent: "ghost" }, h("button", { key: '89c275871da1eb3a2a95bf8b6f89cd96a1fd9484', title: this.i18n('lastPage'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '600bb3bed7f4ee20682871001f2186627206dda7', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
+        return (h("div", { key: 'a62a2ddbb82684c0f95133d445b42a9bd4761bc6', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '9b628625b68a9f1276a83cc3154fe5875db33866', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'd4d032a628bc5835e776c9a30cdf12e78b721eda', accent: "ghost" }, h("button", { key: 'd3bfbe7f47e9206105f05679073be7ef2b4611f9', title: this.i18n('firstPage'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '63ad2d2b39cbdda52f4ccf31edeeb498e5f02e0b', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: '5e76cf87eae25cc8956dda7fc89cdb27610c0717', accent: "ghost" }, h("button", { key: '041ea06d6601a53613c42eea50097c681b668b83', title: this.i18n('previousPage'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: 'c07e481bdd1099bef5a12afe1842a62ec39af080', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPageNavigation(), h("div", { key: 'c407c42856a2fbf3ebbf174c3797207bb44f42f5', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '85d819b258a309e0fb7d9364ebb11ac937080938', accent: "ghost" }, h("button", { key: '86ed1715028f5392458b5414af27f2a06946eb44', title: this.i18n('nextPage'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '20bf233420db85b469d60f7a7187c391bac6e37a', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: 'b6bae828197b1ac3b2cb0c6f7f08fabb448b7473', accent: "ghost" }, h("button", { key: '9b21c1a1365fc7b51a7ab8d9b17ca1ed75cf9ae7', title: this.i18n('lastPage'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '48a2db0be7ed29f491ac1d3711358a9281c1c2cf', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
     }
     static get is() { return "gux-pagination-buttons"; }
     static get originalStyleUrls() {

package/dist/collection/components/stable/gux-pagination/gux-pagination-buttons/gux-pagination-ellipsis-button/gux-pagination-ellipsis-button.js

@@ -84,7 +84,7 @@ export class GuxPaginationEllipsisButton {
         this.applyInputListener();
     }
     render() {
-        return (h(Host, { key: '4f17d785d47601df23bcc31998efb22ecea701ea' }, h("button", { key: '7b33ce011297f74775730075ed84316a6d0e90b0', id: "popover-target", type: "button", ref: el => (this.ellipsisButton = el), onClick: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString() }, h("gux-icon", { key: '76862f3d8d78f178c0f440ab7e4d7f0d3273b744', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), h("gux-tooltip", { key: '828909082f45faed148e65ed19913a6f4b67dcba', for: "popover-target" }, h("div", { key: '24a09d0c262c53766c21967b2831866e429302d0', slot: "content" }, this.i18n('goToPage'))), h("gux-popover", { key: 'bb6814160b7db30bef97cabd536961c158097444', "is-open": this.isOpen, for: "popover-target" }, h("span", { key: 'a79b0a8fd816c982082b519bb98e6756bcbfc452', slot: "title" }, this.i18n('goToPage')), h("gux-form-field-number", { key: 'c2a6e9e6ab91fe06cf9b8fe06628b3f5c5e61703' }, h("input", { key: '5c810bc365fa1c3d90db10d80be9f7ab6dc016f2', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1" }), h("label", { key: '176e53c95f54b77983d8ad73973ff5e42aa892c7', slot: "label" })))));
+        return (h(Host, { key: '7125e762997358d558dad2b3656cb55d6b0c90e0' }, h("button", { key: 'c7f9683f0ab394a8f904ae74837b2420a73cb47c', id: "popover-target", type: "button", ref: el => (this.ellipsisButton = el), onClick: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString() }, h("gux-icon", { key: '40acfdcc4fa03064105d5e56cef25fc07d4a0d51', screenreaderText: this.i18n('goToPage'), "icon-name": "fa/ellipsis-regular" })), h("gux-tooltip", { key: '958eaa260b48b6c098211e046d8e9a730c6dc127', for: "popover-target" }, h("div", { key: '7dbc535f1e9557d9bc1bf85fb7ac2ba42e0b1a93', slot: "content" }, this.i18n('goToPage'))), h("gux-popover", { key: '20989aa1bf1cc97522822197277613c2546bad59', "is-open": this.isOpen, for: "popover-target" }, h("span", { key: 'ff98dcda59dac1fcd251fe6a44e9ba01fd99b0c0', slot: "title" }, this.i18n('goToPage')), h("gux-form-field-number", { key: 'c07be4bea371436110971332da2cf0f0b8cfd016' }, h("input", { key: 'dea87826ca4c9707ff568b2fda18f76e9cd4ea34', slot: "input", type: "number", ref: el => (this.inputElement = el), min: "1", max: this.totalPages, value: "1" }), h("label", { key: 'b80c9a1071b460f0e7a2d5e7d12755fed5debbeb', slot: "label" })))));
     }
     static get is() { return "gux-pagination-ellipsis-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-pagination/gux-pagination-item-counts/gux-pagination-item-counts.js

@@ -28,7 +28,7 @@ export class GuxPaginationItemCounts {
         }
     }
     render() {
-        return (h("div", { key: '9a4c3b4960ee7d29fb4a500e65e83a1faaca0046', class: "gux-pagination-item-counts-container" }, h("span", { key: '6e434b3def0128d5c02550dbe160fc2f85557df6', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
+        return (h("div", { key: '305425d6543b5352e31bcf785f03ccb510b894ce', class: "gux-pagination-item-counts-container" }, h("span", { key: '338ad32793641597370b894b73bb1b93c305ff78', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
             firstItem: this.firstItem,
             lastItem: this.lastItem
         })), this.getPaginationItemCountsRange()));

package/dist/collection/components/stable/gux-pagination/gux-pagination-items-per-page/gux-pagination-items-per-page.js

@@ -19,7 +19,7 @@ export class GuxPaginationItemsPerPage {
             }) }, h("gux-listbox", { "aria-label": this.i18n('itemsPerPage') }, h("gux-option", { value: "25" }, "25"), h("gux-option", { value: "50" }, "50"), h("gux-option", { value: "75" }, "75"), h("gux-option", { value: "100" }, "100"))));
     }
     render() {
-        return (h("div", { key: 'cea83e4daa0f40f37ae1103af315b57113d95045', class: "gux-pagination-items-per-page-container" }, h("div", { key: '25141ca4b18180eb5748c7496042ab29820057b8', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: 'f98981279f6e5e1f4fe8e22e5ffdfc2ff7f5f133', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
+        return (h("div", { key: '98caa9cf26b2cce5600fa6bf4056d366ca7ca5b3', class: "gux-pagination-items-per-page-container" }, h("div", { key: 'c4d415f767374600bf73541f39ceb058b87449c2', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: '7c1f141e8834dbb6d718d51f3febd5d00acc3c6c', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
     }
     static get is() { return "gux-pagination-items-per-page"; }
     static get originalStyleUrls() {

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

@@ -83,7 +83,7 @@ export class GuxPagination {
         }, 500);
     }
     render() {
-        return (h("div", { key: 'ba94b7e9a03900efd4a835844cf66ebdc775eb40', class: "gux-pagination-container" }, h("div", { key: 'a54f4589dd0a1a4c0394da9b6c92aa2298c8dabe', class: "gux-pagination-info" }, h("gux-pagination-item-counts", { key: '25b534588cfcd4c4e5d0d10666260c36bd71c0b5', "total-items": this.totalItems, "current-page": this.currentPage, "items-per-page": this.itemsPerPage }), this.displayedLayout === 'advanced' && (h("gux-pagination-items-per-page", { "items-per-page": this.itemsPerPage, onInternalitemsperpagechange: this.handleInternalitemsperpagechange.bind(this) }))), h("div", { key: '5b10e60b7cc221476443f4a6420b9a0d3db9b493', class: "gux-pagination-spacer" }), h("div", { key: 'e88e9b71f13d3bfa72b906644e328b45d2b8d7f9', class: "gux-pagination-change" }, h("gux-pagination-buttons", { key: 'c7d153689a23c6952a3d050b1f8ea7e0686c78af', layout: this.displayedLayout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
+        return (h("div", { key: '137f34e5a3e9cb1851657cafcdc9d88ec10ba3b0', class: "gux-pagination-container" }, h("div", { key: '289f6cbf30d4b36c957b5e88e046587bc759bb9d', class: "gux-pagination-info" }, h("gux-pagination-item-counts", { key: 'edee289f4a0760c2e5267ce382e609f98a1afe7d', "total-items": this.totalItems, "current-page": this.currentPage, "items-per-page": this.itemsPerPage }), this.displayedLayout === 'advanced' && (h("gux-pagination-items-per-page", { "items-per-page": this.itemsPerPage, onInternalitemsperpagechange: this.handleInternalitemsperpagechange.bind(this) }))), h("div", { key: '7e005b264f8a35c8f8b931c78e8d3634d1d5c099', class: "gux-pagination-spacer" }), h("div", { key: 'ed7485608a4d398832613c7cf95cf810492f8518', class: "gux-pagination-change" }, h("gux-pagination-buttons", { key: 'd1ad309e99ec1c8fb5e0cf69d7e771d96f356278', layout: this.displayedLayout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
     }
     static get is() { return "gux-pagination"; }
     static get encapsulation() { return "shadow"; }

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

@@ -155,10 +155,10 @@ export class GuxPopover {
         }
     }
     render() {
-        return (h("div", { key: 'c30a85b37617bf1676ca0a527f16ae37bbad7071', ref: (el) => (this.popupElement = el), class: {
+        return (h("div", { key: 'daafa91785956b5ee168ec5d1c14fccfbc71d8ec', ref: (el) => (this.popupElement = el), class: {
                 'gux-hidden': !this.isOpen,
                 'gux-popover-wrapper': true
-            }, "data-placement": true }, h("div", { key: 'd38544e2c9ee6331f1d8e81f7b14a5c123347cb5', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: '0b2b6f5eae361f8210a6c15164a39d99d3fc4de9', class: "gux-arrow-caret" })), h("div", { key: 'e7f9a04de6394e00b4c40355db0de1ccc1845542', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, h("slot", { key: '795e4d6d5777da67c568afa629c8885ae33a7e65', name: "title" }), this.renderDismissButton()), h("div", { key: '0abd2cd2b84f17721789cf5804c3650be2771ddf', class: "gux-popover-content" }, h("slot", { key: '7f9d80a0fa36a59de86fc397c45ed00e9264beec' }))));
+            }, "data-placement": true }, h("div", { key: 'd4528d40c000fd1664ee342e027aa006a6c7e282', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: '70b167542e5bf1368f4418f4b155828efa08c41d', class: "gux-arrow-caret" })), h("div", { key: '16fbf5fde9d42e0bec38a3cbcbedf405ffe48b5e', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, h("slot", { key: 'a19ded031fa243a1905f18d9b678f228229e630f', name: "title" }), this.renderDismissButton()), h("div", { key: 'a4e946bdac2f76f0288a4ee7f26583824cc0a354', class: "gux-popover-content" }, h("slot", { key: '7102cc6115751f81339fe0db26e7b6f24c136ef4' }))));
     }
     static get is() { return "gux-popover"; }
     static get encapsulation() { return "shadow"; }

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

@@ -126,10 +126,10 @@ export class GuxPopoverList {
         }
     }
     render() {
-        return (h("div", { key: '156d081627320ca459545e75d3ab98eba11d5835', ref: (el) => (this.popupElement = el), class: {
+        return (h("div", { key: '0292a9de51ac8fd4d7cec1ca787ac1675c19d1f1', ref: (el) => (this.popupElement = el), class: {
                 'gux-hidden': !this.isOpen,
                 'gux-popover-wrapper': true
-            }, "data-placement": true }, h("div", { key: 'cb12ed46cc145d3ea1bb675c8c5cb8251c414493', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), this.displayDismissButton && (h("gux-dismiss-button", { onClick: this.dismiss.bind(this) })), h("div", { key: 'ccb7c14648374a4b2c54d7b27dfb1b674306e177', class: "gux-popover-content" }, h("slot", { key: '19285278b28ae9f6aee1fbc92f3be5d601578752' }))));
+            }, "data-placement": true }, h("div", { key: '414b8f7ad8cd56db7d0e96b3fa95b999ca7b2492', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), this.displayDismissButton && (h("gux-dismiss-button", { onClick: this.dismiss.bind(this) })), h("div", { key: 'c2c3677bad48d4e0826d362d20337a680f23262d', class: "gux-popover-content" }, h("slot", { key: 'f9486cc0a38dcddade357886293c2697e132d33f' }))));
     }
     static get is() { return "gux-popover-list"; }
     static get encapsulation() { return "shadow"; }