genesys-spark-components 4.29.1-beta.0 → 4.31.0

package/dist/cjs/{usage-9db4cf68.js → usage-018c2cda.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const name = "genesys-spark-components";
-const version = "4.29.1-beta.0";
+const version = "4.31.0";
 const description = "Common webcomponents";
 const license = "MIT";
 const main = "dist/stencil-wrapper.js";
@@ -73,7 +73,6 @@ const devDependencies = {
 	"@stencil/core": "^4.12.6",
 	"@stencil/react-output-target": "^0.5.3",
 	"@stencil/sass": "^3.0.10",
-	"@stencil/utils": "0.0.5",
 	"@types/google-libphonenumber": "^7.4.30",
 	"@types/jest": "^27.5.2",
 	"@types/new-relic-browser": "^0.1118.2",

package/dist/collection/collection-manifest.json

@@ -2,6 +2,7 @@
   "entries": [
     "components/beta/gux-announce/gux-announce.js",
     "components/beta/gux-avatar/gux-avatar.js",
+    "components/beta/gux-avatar-focusable/gux-avatar-focusable.js",
     "components/beta/gux-calendar-beta/components/single/gux-calendar.js",
     "components/beta/gux-cta-group/gux-cta-group.js",
     "components/beta/gux-date/gux-date.js",

package/dist/collection/components/beta/gux-avatar-focusable/gux-avatar-focusable.js

@@ -0,0 +1,34 @@
+import { h, Host } from "@stencil/core";
+import { logWarn } from "../../../utils/error/log-error";
+export class GuxAvatarFocusable {
+    constructor() {
+        this.avatarElement = undefined;
+    }
+    componentWillLoad() {
+        this.validateSlot();
+    }
+    validateSlot() {
+        const slottedElement = this.root.querySelector('a, button');
+        if (slottedElement) {
+            this.avatarElement = slottedElement.querySelector('gux-avatar-beta');
+            if (!this.avatarElement) {
+                logWarn(this.root, 'Slotted element must contain a gux-avatar');
+            }
+        }
+        else {
+            logWarn(this.root, 'An anchor tag or button tag must be slotted into gux-avatar-focusable');
+        }
+    }
+    render() {
+        var _a, _b;
+        return (h(Host, { key: '243eebb506593c0d40bd92e7933ba5eb7dcc7d1c', "gs-avatar-size": (_b = (_a = this.avatarElement) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 'large' }, h("slot", { key: '6d700bff94c920471a6a9eabfd3349dedbf286ef' })));
+    }
+    static get is() { return "gux-avatar-focusable-beta"; }
+    static get encapsulation() { return "shadow"; }
+    static get states() {
+        return {
+            "avatarElement": {}
+        };
+    }
+    static get elementRef() { return "root"; }
+}

package/dist/collection/components/beta/gux-avatar-focusable/tests/gux-avatar-focusable.spec.js

@@ -0,0 +1,56 @@
+jest.mock('../../../../utils/error/log-error', () => ({
+    __esModule: true,
+    logWarn: jest.fn()
+}));
+import { newSpecPage } from "../../../../test/specTestUtils";
+import { GuxAvatarFocusable } from "../gux-avatar-focusable";
+import { logWarn } from "../../../../utils/error/log-error";
+describe('gux-avatar-focusable', () => {
+    describe('#render', () => {
+        [
+            `<gux-avatar-focusable-beta>
+        <button>
+          <gux-avatar-beta name="Conor Darcy"></gux-avatar-beta>
+        </button>
+      </gux-avatar-focusable-beta>`,
+            `<gux-avatar-focusable-beta>
+        <a href="#">
+          <gux-avatar-beta name="Conor Darcy"></gux-avatar-beta>
+        </a>
+      </gux-avatar-focusable-beta>`
+        ].forEach((html, index) => {
+            it(`component type (${index + 1}) with valid markup`, async () => {
+                const page = await newSpecPage({
+                    components: [GuxAvatarFocusable],
+                    html
+                });
+                expect(page.root).toMatchSnapshot();
+                expect(logWarn).not.toHaveBeenCalled();
+            });
+        });
+    });
+    describe('warnings', () => {
+        it(`should log warning for gux-avatar-focusable without gux-avatar-beta`, async () => {
+            const html = `<gux-avatar-focusable-beta>
+        <a href="#">Johnnny Dooley</a>
+      </gux-avatar-focusable-beta>`;
+            await newSpecPage({ components: [GuxAvatarFocusable], html });
+            expect(logWarn).toHaveBeenCalled();
+        });
+        [
+            `<gux-avatar-focusable-beta>
+          <gux-avatar-beta name="Conor Darcy"></gux-avatar-beta>
+      </gux-avatar-focusable-beta>`,
+            `<gux-avatar-focusable-beta>
+        <div>
+          <gux-avatar-beta name="Conor Darcy"></gux-avatar-beta>
+        </div>
+      </gux-avatar-focusable-beta>`
+        ].forEach((html, index) => {
+            it(`should log warning for gux-avatar-focusable without anchor or button tags type (${index + 1})`, async () => {
+                await newSpecPage({ components: [GuxAvatarFocusable], html });
+                expect(logWarn).toHaveBeenCalled();
+            });
+        });
+    });
+});

package/dist/collection/components/beta/gux-calendar-beta/components/single/gux-calendar.js

@@ -190,7 +190,7 @@ export class GuxCalendar {
             } }, h("span", { class: "gux-non-sr", "aria-hidden": "true" }, day.date.getDate()), h("span", { class: "gux-sr-only" }, h("gux-date-beta", { datetime: day.date.toISOString(), format: "long" })))))))))));
     }
     render() {
-        return (h("div", { key: 'de2977064f8c296d981085ff71ab4b534a490a90', class: "gux-calendar-beta" }, h("slot", { key: '236304c36e0d8995a167e6d437f0326b9d860a4c' }), this.renderHeader(), this.renderContent()));
+        return (h("div", { key: '21bec94aa840d48119fa33756a944e85b97d73f3', class: "gux-calendar-beta" }, h("slot", { key: '570f0c89199732101f40dfe270460d65b231114b' }), this.renderHeader(), this.renderContent()));
     }
     static get is() { return "gux-calendar-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-cta-group/gux-cta-group.js

@@ -62,7 +62,7 @@ export class GuxCTAGroup {
         this.validateDismissSlot(this.root.querySelector('[slot=dismiss]'));
     }
     render() {
-        return (h("div", { key: '6f38ce57bc2624989e08f8f03b4b7a2a4273cbae', class: `gux-cta-group gux-${this.align}-align` }, h("slot", { key: '65299a5ff5d99f42afc8940d02114ff87dcfe59e', name: "primary" }), h("slot", { key: '778a140e6aeac6fc47ceb9694ed714d3e2326cc8', name: "secondary" }), h("slot", { key: '176142e469341facd9e85dd4934587b0b4380b7c', name: "dismiss" })));
+        return (h("div", { key: 'b016ee7bdd8aa8f9137b5f005d826908a192c570', class: `gux-cta-group gux-${this.align}-align` }, h("slot", { key: 'a90406043d4c7d232de8054a3bd45a3c43b1cdf6', name: "primary" }), h("slot", { key: '6b710696e87676444c61d6337f02077b674cd6f6', name: "secondary" }), h("slot", { key: '5b66c14ef3fa4844c0a361418bd08289b387480c', name: "dismiss" })));
     }
     static get is() { return "gux-cta-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-date/gux-date.js

@@ -38,7 +38,7 @@ export class GuxDate {
         }
     }
     render() {
-        return (h(Host, { key: 'b0360c06209de4af12013c4ea7c6df46fb7d4521' }, this.renderDate()));
+        return (h(Host, { key: '7c5dba8ed657b7602e7b2664221cf618beee57af' }, this.renderDate()));
     }
     static get is() { return "gux-date-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-date-time/gux-date-time.js

@@ -39,7 +39,7 @@ export class GuxDateTime {
         }
     }
     render() {
-        return (h(Host, { key: '6f45c10105254b26470400e9b165fa572d3d52ee' }, this.renderDateTime()));
+        return (h(Host, { key: '34356448ca74d00976bf00d92651712b3e228c7b' }, this.renderDateTime()));
     }
     static get is() { return "gux-date-time-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-flag-icon/gux-flag-icon.js

@@ -11,7 +11,7 @@ export class GuxFlagIconBeta {
     }
     render() {
         var _a;
-        return (h("span", { key: '031662b25b8d7481baef3082be5b610d33cbcd4c', role: this.screenreaderText ? 'img' : '', class: 'gux-flag-' + ((_a = this.flag) === null || _a === void 0 ? void 0 : _a.toLowerCase()), style: { backgroundImage: `url(${spritesheetDataUrl})` }, "aria-label": this.screenreaderText }));
+        return (h("span", { key: '93fa048d24c1fabe06941516e434a8cbef36ebc3', role: this.screenreaderText ? 'img' : '', class: 'gux-flag-' + ((_a = this.flag) === null || _a === void 0 ? void 0 : _a.toLowerCase()), style: { backgroundImage: `url(${spritesheetDataUrl})` }, "aria-label": this.screenreaderText }));
     }
     static get is() { return "gux-flag-icon-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-month-picker/gux-month-calendar/gux-month-calendar.js

@@ -128,7 +128,7 @@ export class GuxMonthCalendar {
         return (h("span", { onFocus: () => this.doFocusTrap(), tabindex: "0" }));
     }
     render() {
-        return (h("div", { key: '4414615232e5f4e6e82a2d34d6713f586d3dcf9f', class: "gux-month-calendar" }, this.renderHeader(), this.renderMonths(), this.renderTrapFocusEl()));
+        return (h("div", { key: 'd420a8f43d52a11f21514ae9b09700fa01dead5f', class: "gux-month-calendar" }, this.renderHeader(), this.renderMonths(), this.renderTrapFocusEl()));
     }
     static get is() { return "gux-month-calendar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-month-picker/gux-month-calendar/gux-month-list/gux-month-list-item/gux-month-list-item.js

@@ -20,7 +20,7 @@ export class GuxMonthListItem {
         }
     }
     render() {
-        return (h(Host, { key: '0d37de3437568a8769522065242c4cff0baa07e5', role: "listitem", value: this.value }, h("div", { key: '557d40726bded727d5601dd3a8aebd82c627ccfa', class: "gux-container" }, h("button", { key: '967ec16e7c494a081059f4af5d654dbb842f3692', class: { 'gux-selected': this.selected }, type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: '2ead0e3ebe3413b6ab588b8f5dddefdb14ee6bed' })))));
+        return (h(Host, { key: '1b11ecf35e494fa8302d3810b04d4b100a9bce37', role: "listitem", value: this.value }, h("div", { key: '5fc08521ca860aeeaf42010ce21dcc8ae50da5fd', class: "gux-container" }, h("button", { key: 'e6d138f95ab92cb8e1d55414da9323d7d8aa8f55', class: { 'gux-selected': this.selected }, type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: '6cbc61ab3709e030469581f693ac0e57bc800710' })))));
     }
     static get is() { return "gux-month-list-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-month-picker/gux-month-calendar/gux-month-list/gux-month-list.js

@@ -38,7 +38,7 @@ export class GuxMonthList {
         first(this.root, validFocusableItems);
     }
     render() {
-        return (h(Host, { key: '912d2aec79af0ad26ee10fe4a6355b65267f61ac', role: "list" }, h("slot", { key: '63031334d4538ee8de05a8508008a5f1f8d9122e' })));
+        return (h(Host, { key: '147bb32f8c74fbe3541c516b546d3445537a4130', role: "list" }, h("slot", { key: '98919214c3f0cd9649d2f936b6b87d801f0b71be' })));
     }
     static get is() { return "gux-month-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-month-picker/gux-month-picker.js

@@ -194,7 +194,7 @@ export class GuxMonthPicker {
         return (h("gux-month-calendar", { slot: "popup", ref: (el) => (this.monthCalendarElement = el), onInput: () => this.onMonthCalendarInput(), value: this.value, min: this.min, max: this.max }));
     }
     render() {
-        return (h("gux-popup", { key: '3f81f5224264d20329762cafe03e04d03a396e6b', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
+        return (h("gux-popup", { key: '858eebab7d651baffabf72918a0f95cc0c6544ae', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
     }
     static get is() { return "gux-month-picker-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-phone-input/gux-phone-input.js

@@ -342,7 +342,7 @@ export class GuxPhoneInput {
         return (h("div", { slot: "popup", class: "gux-listbox-container" }, h("gux-listbox", { "aria-label": this.i18n('regionDropdown'), value: this.region ? this.region.alpha2Code : '' }, this.regionOptions)));
     }
     render() {
-        return (h("gux-popup", { key: '125397fe2bf46c465bd2482a2230b29ddf2c75e9', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
+        return (h("gux-popup", { key: '7e2dc1b8626e2f1a2afabc128d44fa7e6858679c', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
     }
     static get is() { return "gux-phone-input-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-screen-reader/gux-screen-reader.js

@@ -8,7 +8,7 @@ export class GuxScreenReader {
         trackComponent(this.root);
     }
     render() {
-        return (h("span", { key: 'fc84dd113fa4434ac8d0aebded7c13531209d434', class: "gux-sr-only" }, h("slot", { key: '9f2f069f753cc6fef7d6c175faad408d262d7f90' })));
+        return (h("span", { key: 'ccea34e243df9c03383d4d1a48e66829e6ac7869', class: "gux-sr-only" }, h("slot", { key: 'ddcbe8ed254a028c3c883ba51e7c373879d35e01' })));
     }
     static get is() { return "gux-screen-reader-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-segmented-control/gux-segmented-control-item/gux-segmented-control-item.js

@@ -45,18 +45,18 @@ export class GuxSegmentedControlItem {
         }
     }
     render() {
-        return (h("div", { key: '77708c4c0ab968593cd388525a7d8379805712f2', class: {
+        return (h("div", { key: 'ea6d18d2b2f34e809bde11950d95b3cf41b0111c', class: {
                 'gux-container': true,
                 'gux-start': this.isInStartPosition(this.root),
                 'gux-end': this.isInEndPosition(this.root)
-            } }, h("button", { key: 'd86743ecc03058a961f9bd4e9f378145130c915c', class: {
+            } }, h("button", { key: '6b7a963f730c37cb8ad0ed5174937facfadd944e', class: {
                 'gux-segmented-control-item': true,
                 'gux-icon-only': this.iconOnly,
                 'gux-selected': this.selected
-            }, type: "button", disabled: this.disabled }, this.renderIconSlot(), h("div", { key: '395726ada7e81251b44176e726e8966ab115b274', class: {
+            }, type: "button", disabled: this.disabled }, this.renderIconSlot(), h("div", { key: '1dabd619aaa056e2a21b0b003f832669450c6c19', class: {
                 'gux-text': true,
                 'gux-icon-only': this.iconOnly
-            } }, h("slot", { key: '7f32eabe5c32346487153ca4c17ecc683e027c54', name: "text" }))), this.renderTooltip()));
+            } }, h("slot", { key: 'badc4c528a7d9bc2a0069d18a4230110bb8c0b60', name: "text" }))), this.renderTooltip()));
     }
     static get is() { return "gux-segmented-control-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-segmented-control/gux-segmented-control.js

@@ -30,7 +30,7 @@ export class GuxSegmentedControl {
         });
     }
     render() {
-        return (h(Host, { key: '0affcc86e73a4d3a6e1fa9921351fa511529a030', role: "group" }, h("slot", { key: 'a6a8b0398f8dd60a6a941bdfd679a3fef5e120ad', onSlotchange: this.slotChanged.bind(this) })));
+        return (h(Host, { key: '6a0a93cfaaa538b5cd410c0287a88aef10eaca10', role: "group" }, h("slot", { key: '5b110b0b36f8c05798508f3ab237cf0142bf5e6a', onSlotchange: this.slotChanged.bind(this) })));
     }
     static get is() { return "gux-segmented-control-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-time/gux-time.js

@@ -38,7 +38,7 @@ export class GuxTime {
         }
     }
     render() {
-        return (h(Host, { key: '7d87b12cba90f865ef02e1c66fd600703c00456e' }, this.renderTime()));
+        return (h(Host, { key: '62fa9fab592fd5184965dff3fefe25cecaa3aeaa' }, this.renderTime()));
     }
     static get is() { return "gux-time-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-time-zone-picker/gux-time-zone-picker.js

@@ -146,9 +146,9 @@ export class GuxTimeZonePickerBeta {
         }
     }
     render() {
-        return (h("gux-dropdown", { key: 'bf907629437b034cfd728a477d0e34b24d4c2a95', class: {
+        return (h("gux-dropdown", { key: '05436d728a0367a9c93e6dd46079aabd9059ce12', class: {
                 'has-defaults': !!this.workspaceDefault || !!this.localDefault
-            }, "filter-type": "custom", placeholder: this.i18n('selectZone'), value: this.value, hasError: this.hasError, disabled: this.disabled }, h("gux-listbox", { key: 'c57d91d7b111d7bf8fbdc246349c48603cd881f1', "aria-label": this.i18n('timeZones') }, this.renderDefaultsList(), this.timeZoneOptionElements)));
+            }, "filter-type": "custom", placeholder: this.i18n('selectZone'), value: this.value, hasError: this.hasError, disabled: this.disabled }, h("gux-listbox", { key: '4c3d75531e4d3b5d1d1f4cc406b95e37d7ae0b71', "aria-label": this.i18n('timeZones') }, this.renderDefaultsList(), this.timeZoneOptionElements)));
     }
     static get is() { return "gux-time-zone-picker-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-tooltip-base/gux-tooltip-base.css

@@ -39,6 +39,11 @@
   height: var(--gse-ui-icon-size-sm);
   color: var(--gse-ui-tooltip-light-iconColor);
 }
+.gux-container ::slotted(*) {
+  width: 100%;
+  overflow-wrap: break-word;
+  white-space: normal;
+}
 .gux-container.gux-dark {
   color: var(--gse-ui-tooltip-dark-foregroundColor);
   background-color: var(--gse-ui-tooltip-dark-backgroundColor);

package/dist/collection/components/beta/gux-tooltip-base/gux-tooltip-base.js

@@ -4,7 +4,7 @@ import { randomHTMLId } from "../../../utils/dom/random-html-";
 import { trackComponent } from "../../../utils/tracking/usage";
 import { afterNextRender } from "../../../utils/dom/after-next-render";
 /**
- * @slot - Content of the tooltip
+ * @slot content - Slot for content
  */
 export class GuxTooltipBase {
     constructor() {
@@ -113,10 +113,10 @@ export class GuxTooltipBase {
         this.disconnectForElement();
     }
     render() {
-        return (h(Host, { key: '8f97be8dd99fa37f471bb36c2791fdc881d1bb43', id: this.tooltipId ? undefined : this.id, role: this.tooltipId ? undefined : 'tooltip', class: { 'gux-show': this.isShown } }, h("div", { key: '89da07f79de78c4c9b2d2c26b046632d1989f827', class: {
+        return (h(Host, { key: 'abbcb96d4a8a301908c1ad20df7770a89cbd4077', id: this.tooltipId ? undefined : this.id, role: this.tooltipId ? undefined : 'tooltip', class: { 'gux-show': this.isShown } }, h("div", { key: '17d69f7175afef1eea4af211140af6ff2cd9a4ae', class: {
                 'gux-container': true,
                 [`gux-${this.accent}`]: true
-            }, "data-placement": this.placement }, h("slot", { key: 'f44b0d54a2631d2287aa88b108dd2ce26c89ebe6' }))));
+            }, "data-placement": this.placement }, h("slot", { key: '3eef93b4b81a750e2edb0981871eb2ece4d3df0b', name: "content" }))));
     }
     static get is() { return "gux-tooltip-base-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-tooltip-beta/gux-tooltip.js

@@ -3,7 +3,7 @@ import { trackComponent } from "../../../utils/tracking/usage";
 import { findElementById } from "../../../utils/dom/find-element-by-";
 import { randomHTMLId } from "../../../utils/dom/random-html-";
 /**
- * @slot - Content of the tooltip
+ * @slot content - Slot for content
  */
 export class GuxTooltip {
     constructor() {
@@ -16,14 +16,12 @@ export class GuxTooltip {
     /*
      * Show tooltip
      */
-    // eslint-disable-next-line @typescript-eslint/require-await
     async showTooltip() {
         return await this.baseTooltip.showTooltip();
     }
     /*
      * Hide tooltip
      */
-    // eslint-disable-next-line @typescript-eslint/require-await
     async hideTooltip() {
         return await this.baseTooltip.hideTooltip();
     }
@@ -34,7 +32,7 @@ export class GuxTooltip {
         trackComponent(this.root, { variant: this.placement });
     }
     connectedCallback() {
-        this.forElement = this.getForElement();
+        this.updateForElement();
     }
     getForElement() {
         if (this.for) {
@@ -54,7 +52,7 @@ export class GuxTooltip {
         }
     }
     render() {
-        return (h(Host, { key: '531ab578e02b4862c94e17c4c9fc22ca8bd33758', id: this.id, role: "tooltip" }, h("gux-tooltip-base-beta", { key: 'cec38875a0f7a9935dc926de90717ba7f37d68f6', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, ref: el => (this.baseTooltip = el) }, h("slot", { key: '758d0182dff8cc6515b46e6a61b33b527d166b13' }))));
+        return (h(Host, { key: 'c81ca418dde78ddb79559a4ee5e393575a2b7818', id: this.id, role: "tooltip" }, h("gux-tooltip-base-beta", { key: 'cad04556d134af962ed372806aab159689dfcdc2', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, ref: el => (this.baseTooltip = el) }, h("span", { key: 'b3e16443ffe8e434b2d73600fad227495fbcb01e', slot: "content" }, h("slot", { key: 'e73ac2ffde960015e4e3dd2235a7ab3be935c2ac', name: "content" }, h("slot", { key: '3153ce33ca8c8a48999e29437d1df0d402992abb' }))))));
     }
     static get is() { return "gux-tooltip-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/legacy/gux-action-toast-legacy/gux-action-toast.js

@@ -12,7 +12,7 @@ export class GuxActionToast {
         trackComponent(this.root);
     }
     render() {
-        return (h(Host, { key: '98f936ebc6d66bda31d23e258d30cb78c19f802c' }, h("div", { key: '4d1a806671fc8b1588b38275437fb4f2a07e261d', class: "gux-header" }, h("div", { key: 'dbfed45e561a438680cde8e11e9ee067da7c839f', class: "gux-icon" }, h("slot", { key: 'b62b320d7b1c0e8133fbf21092c759408955a281', name: "icon" })), h("div", { key: 'de0bcdc2edb8b4dc23005fb9bfb63d79f9e61acd', class: "gux-title" }, h("slot", { key: '8a05d6b9b140aaa562bf4e6503ac99e9676f47d2', name: "title" }))), h("div", { key: '1c1f7052a7f6cf8bde07ba23407b9fb337b43c08', class: "gux-message" }, h("slot", { key: '0655ecb494f33900fdf9d6f7bc120a79c471704f', name: "message" })), h("div", { key: '80a2fcf5d0e42416dde18725610b127f219eeb79', class: "gux-action-buttons" }, h("div", { key: '4db790982f2efe5ba03a680fb7d604b7f2b57af6', class: "gux-positive-button" }, h("slot", { key: 'a2789364141d79fc7c8a636424d65227e21d7070', name: "positive-button" })), h("div", { key: '37278aaeb6eae16773c06ce503f8187ca9e9ef13', class: "gux-negative-button" }, h("slot", { key: 'b4633c703c288803c1860f2a59eb7195a68ff043', name: "negative-button" })))));
+        return (h(Host, { key: 'a883201df82ed095d8f4574357860659c77de0a4' }, h("div", { key: 'f8969f402900c487450fd08839f1840c962c210d', class: "gux-header" }, h("div", { key: '25f23f87e75fddd152605c147a07ab3a72921a99', class: "gux-icon" }, h("slot", { key: '568b7b930316116f2d1f3c714936dfe64a71030c', name: "icon" })), h("div", { key: '117c561b75c723a67f9c1a7edec46eae8dd753b9', class: "gux-title" }, h("slot", { key: 'ecd58a9eaa0610a457ccf78789ac5ef9838e51bc', name: "title" }))), h("div", { key: '3fe48963895187a3e30650e8fbba8bc4fdef75aa', class: "gux-message" }, h("slot", { key: '19122ad4a9fb9d97339fc1535acb52927e5f305d', name: "message" })), h("div", { key: 'c9d5c108ea1e03e7ea7697442a0013111b4a8b45', class: "gux-action-buttons" }, h("div", { key: '550222cac63f7276091d615a28a0a07bdb625952', class: "gux-positive-button" }, h("slot", { key: 'd571476a0f87e1ded3183c889381b68827fe9af5', name: "positive-button" })), h("div", { key: 'c9cc6adb9aeada53685b7e70722be9d49d8506e7', class: "gux-negative-button" }, h("slot", { key: '49a77b6df4e82c317ed63d52a8c73f405fc13a6f', name: "negative-button" })))));
     }
     static get is() { return "gux-action-toast-legacy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/legacy/gux-advanced-dropdown-legacy/dropdown-option/gux-dropdown-option.js

@@ -58,7 +58,7 @@ export class GuxDropdownOption {
         };
     }
     render() {
-        return (h("div", { key: 'c4bd82294e9c39d9f167bedcc04f1fc4680cb35c', class: "gux-dropdown-option", title: this.text }, this.textWithHighlights()));
+        return (h("div", { key: 'a1aa77e7480ad8fbe82cc98abae5e087b54238dd', class: "gux-dropdown-option", title: this.text }, this.textWithHighlights()));
     }
     textWithHighlights() {
         if (!this.highlight || !this.text) {

package/dist/collection/components/legacy/gux-advanced-dropdown-legacy/gux-advanced-dropdown.js

@@ -70,9 +70,9 @@ export class GuxAdvancedDropdownLegacy {
         }
     }
     render() {
-        return (h("gux-popup", { key: 'bc0eb0a6638af200613198c41caca361a768e0e1', expanded: this.opened, disabled: this.disabled }, h("div", { key: '26e56f5022441ad2475a64ee9cf90007dd578742', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: '0eee62a35985bcb96472f52fcc9552336958b618', ref: el => (this.inputBox = el), class: "gux-select-input", "aria-labelledby": this.srLabelledby, tabindex: "0", onKeyDown: e => this.inputKeyDown(e) }, this.placeholder && !this.value && (h("span", { class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { class: "gux-select-value", title: this.value }, this.value))), h("div", { key: 'bda908047b85c020ea324d864b767b7d3bfeedbf', class: "gux-icon-wrapper" }, h("gux-icon", { key: 'b91d222b4557f64d0d7d07558ee1f65ec157d41c', decorative: true, "icon-name": "chevron-small-down" }))), h("div", { key: '7909672257393378482414ff044fc520c1a789f7', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: 'eda9f8349b512b1190d3a9625e74727bad536997', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: '3f3e730d516b526b85bfb0d1faea5fe787e415d1', "label-position": "screenreader" }, h("label", { key: '8b1e4b1de95a462a345285fcece71cb8053fb871', slot: "label" }, this.i18n('searchAria')), h("input", { key: '9b1b3769a0bfbfcefbf9fe151730709c9c22e2f9', slot: "input", type: "search", onInput: (event) => {
+        return (h("gux-popup", { key: '7d6550e43465dcecdaa8560fccaa48703fb3a246', expanded: this.opened, disabled: this.disabled }, h("div", { key: 'f6d162c0806acbe6dbe6214d8267a5f8ceb16814', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: '6fc7f49f786923c00586fb3ebe85cda68fa942bc', ref: el => (this.inputBox = el), class: "gux-select-input", "aria-labelledby": this.srLabelledby, tabindex: "0", onKeyDown: e => this.inputKeyDown(e) }, this.placeholder && !this.value && (h("span", { class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { class: "gux-select-value", title: this.value }, this.value))), h("div", { key: 'df3caded426e1177383a17232fe733a04f8ac916', class: "gux-icon-wrapper" }, h("gux-icon", { key: '2da44035092380b04da9c929b55454c0bd21012d', decorative: true, "icon-name": "chevron-small-down" }))), h("div", { key: '804f1957aeb4e6c828206ad7244f6acbff076657', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: 'f03db98d2bc26a2f5959c1541f53a645544bac49', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: 'c2a21c00fd512ebaa7672fb54f5e8feda1092842', "label-position": "screenreader" }, h("label", { key: '77449ec906555a731e34dabd60c90efa6bd30b97', slot: "label" }, this.i18n('searchAria')), h("input", { key: '899c695d2c89133a4da37ad9093a54624857c1c6', slot: "input", type: "search", onInput: (event) => {
                 this.handleSearchInput(event);
-            }, ref: el => (this.searchInput = el) })), h("div", { key: '3a947579d4d26b6468100aaff812e0fd35260ec3', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: '0fa7322bca985ade12e6d6c572b4d1d7ee16c77a' }))))));
+            }, ref: el => (this.searchInput = el) })), h("div", { key: '5516540295957b8a8390fe10897daf476b578893', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: 'd69777e377dff0df4c0851384369c35c57026f5a' }))))));
     }
     updateSelectionState() {
         this.selectionOptions = this.getSelectionOptions();

package/dist/collection/components/legacy/gux-disclosure-button-legacy/gux-disclosure-button.js

@@ -38,10 +38,10 @@ export class GuxDisclosureButtonLegacy {
         this.updateIcon();
     }
     render() {
-        return (h("div", { key: '15b10ad5c1f7946bfccdb7e749d83478d36f3f5f', class: `gux-disclosure-button-container gux-${this.position}` }, h("button", { key: '052548f09eebe4441b065dcb2a89badaa02061e9', class: "gux-disclosure-button", onClick: () => this.changeState(), "aria-controls": this.panelId, "aria-expanded": this.isOpen.toString(), "aria-label": this.label || this.i18n('defaultLabel') }, h("gux-icon", { key: 'edf41195a343a13d5d5111e4cc5e13f28e4b1c2c', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '3cde9229f9888e7c8a568ae3bb86520c3be00559', id: this.panelId, class: {
+        return (h("div", { key: 'ecaeb9b6177112f93a7ef4a5aed6eeac64d0831c', class: `gux-disclosure-button-container gux-${this.position}` }, h("button", { key: '90f906915e1eb1f28f114fc4ee8a547d44f80e5c', class: "gux-disclosure-button", onClick: () => this.changeState(), "aria-controls": this.panelId, "aria-expanded": this.isOpen.toString(), "aria-label": this.label || this.i18n('defaultLabel') }, h("gux-icon", { key: '84fcd4c68d75a1649af1961c973760fe6dc2272f', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: 'a6ccee9a2b12d007db687c46217b6a2c59a01bc5', id: this.panelId, class: {
                 'gux-disclosure-panel': true,
                 'gux-active': this.isOpen
-            }, role: "region" }, h("slot", { key: 'dd4faafd96de6a8af8605631935b146b5113bd57', name: "panel-content" }))));
+            }, role: "region" }, h("slot", { key: 'c23678ee2c8a7bf59277e1a8efce641d9586b2c6', name: "panel-content" }))));
     }
     static get is() { return "gux-disclosure-button-legacy"; }
     static get encapsulation() { return "shadow"; }

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

@@ -42,10 +42,10 @@ export class GuxModalLegacy {
         const hasModalTitleSlot = this.hasModalTitleSlot();
         const hasFooterButtons = this.hasFooterButtons();
         const titleID = randomHTMLId();
-        return (h("div", { key: 'aa0adec444a0aed1a560169125a62a524cce6895', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'ed47eeefefc133fa0e85968733c6567acd906177', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { class: "gux-modal-header", id: titleID }, h("slot", { name: "title" }))), h("gux-dismiss-button", { key: 'e190fb1a40d174544f2d97fff8d6e01f4e066ace', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: '2ffc0af21612aa789dae56d60b6e408c3dd548f4', class: {
+        return (h("div", { key: 'bf5aa99c17196583643a091cadc4ac61af4e95d5', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'd13021f74577d221681404037749b2fa11a49f7c', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { class: "gux-modal-header", id: titleID }, h("slot", { name: "title" }))), h("gux-dismiss-button", { key: 'cfa6569a483402546a6c02d82eb299532eeda09c', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: 'ffcb7df17b6096b63cf4c7f7a54a363ea9e3822a', class: {
                 'gux-modal-content': true,
                 'gux-no-buttons': !hasFooterButtons
-            } }, h("p", { key: 'd6bfebc6a1670419d1ca1827b43699d78fa35f71' }, h("slot", { key: '2fa60d1feca4dfc9d3dd5aa5096449387188e2e5', name: "content" }))), hasFooterButtons && (h("div", { class: "gux-button-footer" }, h("div", { class: "gux-left-align-buttons" }, h("slot", { name: "left-align-buttons" })), h("div", { class: "gux-right-align-buttons" }, h("slot", { name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
+            } }, h("p", { key: '8abb233f4af9528d456bcaa50884f426f274c14b' }, h("slot", { key: 'a5a7e272a776c515e6719cd45d6473ebea19b970', name: "content" }))), hasFooterButtons && (h("div", { class: "gux-button-footer" }, h("div", { class: "gux-left-align-buttons" }, h("slot", { name: "left-align-buttons" })), h("div", { class: "gux-right-align-buttons" }, h("slot", { name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
     }
     // When trap-focus is enabled, focusing this element
     // will immediately redirect focus back to the dismiss button at the top of the modal.

package/dist/collection/components/legacy/gux-notification-toast-legacy/gux-notification-toast.js

@@ -13,7 +13,7 @@ export class GuxNotificationToast {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h(Host, { key: 'd9e217c311a07e034536c06802ea3061667ae772' }, h("div", { key: 'd8b9a982ac129962e9690b746b9d2fb8b8395ad4', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '94624614c49a8968bef56c5e97232455d2485d7c', name: "icon" })), h("div", { key: 'e0227f64ad74182e1f735231d422b1e9023baa29', class: "gux-content" }, h("gux-truncate", { key: '4f467b53e04eba5240d98673bed2455cf25f2ac3', class: "gux-title", "max-lines": 1 }, h("slot", { key: '004890816b7c5abe96dc3dc5376597280d1d0deb', name: "title" })), h("gux-truncate", { key: 'dec4d9504b3ceebe6abb81f8ff1801a4d97b677a', class: "gux-message", "max-lines": 2 }, h("slot", { key: '9cc1f192b3090f934e5840fe89bd489a077d35f4', name: "message" }))), h("gux-dismiss-button", { key: '1a8710ad630cca452a243ad437562893cffe0e71', onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: '95f0699e6fa45841e5d1c9cbf93469776739706b' }, h("div", { key: '40f8dc61690012e3d0f9332c259b33229da0b978', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '046d5e3ca767cd3169ac5d467c881f6440c1cf24', name: "icon" })), h("div", { key: '7e92e95c11ee47b97867e79bf2071ff094eb7896', class: "gux-content" }, h("gux-truncate", { key: 'c2f72cd81ce25da5254689c83f80f3c8115de6bb', class: "gux-title", "max-lines": 1 }, h("slot", { key: '70d07f64b0bebb2e3b52e6710862897e702edfdb', name: "title" })), h("gux-truncate", { key: 'e6abb2d9a7ef823549b144590382c426097d9b1f', class: "gux-message", "max-lines": 2 }, h("slot", { key: '2d7941c85956f06d7d039f9b40a0caf8f6f0b6d5', name: "message" }))), h("gux-dismiss-button", { key: 'd994890293510eac8732ca3ee85cbc21c110d434', onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();

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

@@ -71,7 +71,7 @@ export class GuxPaginationButtonsLegacy {
         this.i18n = await buildI18nForComponent(this.root, paginationResources);
     }
     render() {
-        return (h("div", { key: 'a37445390b137cae3d7ee03bf555a40275f80c3a', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: 'b6955f6c00efdacc30b111c1ecab4d85a20ea1ae', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'dddf7d4f94e3a83b732c1cf5b6c277c28f72d64a', accent: "ghost" }, h("button", { key: 'bd437d7d110683cc3e52c20733f42eef01269a79', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '72ff2fd5b4a3968cf79293b4e5eb6ca89420e826', decorative: true, "icon-name": "chevron-double-left" }))), h("gux-button-slot", { key: '410170a427c3e25f899dc4c4e113749e676439d6', accent: "ghost" }, h("button", { key: '1ccbeda577ff77a914a7ccab9f41546622d43927', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: '14dbd255747a292e8bd4998570b8cc9de27ee886', decorative: true, "icon-name": "chevron-small-left" })))), this.getPagePicker(this.layout), h("div", { key: '7a75c80173679042b630b7c587491e12a6945740', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '6f1c5a4c50d8028abd41c7c8637ca28434b15a8e', accent: "ghost" }, h("button", { key: '1e0a48e270cab03df0334a8e6633e8ae5386f8de', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '0709556e7fe0840d5c0c67213a38362274d34d59', decorative: true, "icon-name": "chevron-small-right" }))), h("gux-button-slot", { key: 'c8f063aee5097b1f37e0ab31e671f70e23a8697f', accent: "ghost" }, h("button", { key: 'f62e0fe9b8d6a3bb9f653b5b81dfd9cde5ab100e', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: 'c085148f543bc47b129e3408908b8aeb378b9489', decorative: true, "icon-name": "chevron-double-right" }))))));
+        return (h("div", { key: '65f5df113fcff5352c78aae19e64e1cf3aa0529d', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '342290ddf38c6ff15c96ceee1bf85856c39d1b33', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'df7a7a8f79872afc4b07bb770b17cbca146ed8ca', accent: "ghost" }, h("button", { key: '405bda85171a8954521414f02705e7be01f8346c', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '6af6ef74821a2328799c8da454d7fcbd717e71f9', decorative: true, "icon-name": "chevron-double-left" }))), h("gux-button-slot", { key: '8638a3c1fff12fd027ff9257c429784a62dbfe89', accent: "ghost" }, h("button", { key: '079e9784e585a182c73b7f08e65a8709db4403cb', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: '1d12b4830af8429f39b7a331a5d585255f9fdf02', decorative: true, "icon-name": "chevron-small-left" })))), this.getPagePicker(this.layout), h("div", { key: 'c3ee4d1d35a8c4f097bf744f3471ee79d01fdf71', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'f2cdc9899f705c318927c2c1f3e58f35716bea2a', accent: "ghost" }, h("button", { key: 'b51edb7cb1a86dbc7b6d4740a9cef5cf45df97f4', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '5495c3f4f6247b6c05e89909956dfd38a28aed06', decorative: true, "icon-name": "chevron-small-right" }))), h("gux-button-slot", { key: 'd29e779b6180d2a48fc56e0996c67c1630672ee5', accent: "ghost" }, h("button", { key: '11ce9c30b2f4b25af5a392864df4bc8509a43a54', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '2eea5b1f7b945763fb442c577c6e40d5d2bbf6be', decorative: true, "icon-name": "chevron-double-right" }))))));
     }
     static get is() { return "gux-pagination-buttons-legacy"; }
     static get originalStyleUrls() {

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

@@ -23,10 +23,10 @@ export class GuxPaginationItemCountsLegacy {
         this.i18n = await buildI18nForComponent(this.root, paginationResources);
     }
     render() {
-        return (h("div", { key: 'eecdfce8f39f06119cdd7ea01be5ba80416b9c88', class: "gux-pagination-item-counts-container" }, h("span", { key: 'afebbdc254921a8b6b6fb791281e528c39688d44', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
+        return (h("div", { key: '476ed762cb8b6a4b17cf1c25d358e57ac7e0e086', class: "gux-pagination-item-counts-container" }, h("span", { key: 'dff28dbb1df977ca0064f5ac7ba7bf9f4814b040', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
             firstItem: this.firstItem,
             lastItem: this.lastItem
-        })), h("span", { key: '3baa30824242e4817222e39442a765fec5d7faf2' }, this.i18n('totalItems', { totalItems: this.totalItems }))));
+        })), h("span", { key: '52d1d6453d903c85ba44aa39dddc2b7a534cfb75' }, this.i18n('totalItems', { totalItems: this.totalItems }))));
     }
     static get is() { return "gux-pagination-item-counts-legacy"; }
     static get originalStyleUrls() {

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

@@ -19,7 +19,7 @@ export class GuxPaginationItemsPerPageLegacy {
             }) }, 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: '67d17cc759d78b15d823a4abdcc67429f30ea0c5', class: "gux-pagination-items-per-page-container" }, h("div", { key: '231ef3e50bb20fb6bba0d34643c2f855cb393d18', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: 'a89755356ac02893943d0a300ba9489ea72dec90', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
+        return (h("div", { key: '97ddfc030e9feb9a045e82b8273f1bb53eda4d3e', class: "gux-pagination-items-per-page-container" }, h("div", { key: '45852579787a3236094372cbe3f48b1ace391fcd', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: '31d162be583a31d2b2c4859ee37f91ff2be8b69a', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
     }
     static get is() { return "gux-pagination-items-per-page-legacy"; }
     static get originalStyleUrls() {

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

@@ -58,7 +58,7 @@ export class GuxPaginationLegacy {
         this.currentPage = this.calculateCurrentPage();
     }
     render() {
-        return (h("div", { key: '2a2e8ddb9120903a48bf45ac562f89d1dc4a3a22', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '327ab4a9570515f15a133c3544b1e84ebc1e88ef', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: '5729b190bdcf636b2bc21014fd4b9ba925c12343', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
+        return (h("div", { key: 'd4285771fdf06b8c7713fed2369cd1e53d2c07be', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '339063e1ff388686b30d024c94f85850cb6031f1', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: 'bdb7fd89985d8e8a6fd22d1596a3fb006bab9c81', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
     }
     static get is() { return "gux-pagination-legacy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/legacy/gux-simple-toast-legacy/gux-simple-toast.js

@@ -12,7 +12,7 @@ export class GuxSimpleToast {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h(Host, { key: '5f4abff5db2d97a326f0da5f8360c774c1f2a5a7' }, h("div", { key: 'd355b24f097846bc3cdedf86db6cd914366ad793', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '5e17ff057970493e4fa3ab4b9e670e628b13d413', name: "icon" })), h("gux-truncate", { key: '3387b6a1c317697ec271c1895d034b2245bb417e', class: "gux-message", "max-lines": 2 }, h("slot", { key: '5fe9515b654ed86d9f2183a11bf56d68b98271b4', name: "message" })), h("gux-dismiss-button", { key: '8336a43a6b9f42381f69ba1f69518514be42eab2', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: 'bbfcdff4fb0154e14fa6037e781bd59a2eba5a81' }, h("div", { key: '74406999a20a3d58be13a9d4398c91c0a92fc314', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '084c6f8e6fc802081c14c0e6c76c7bb050ff1518', name: "icon" })), h("gux-truncate", { key: '9e29a25246b3b8621e83e5e29eae0dfe6e0b4654', class: "gux-message", "max-lines": 2 }, h("slot", { key: '63127bc7595801452ab8a77b03406dd055b1a74c', name: "message" })), h("gux-dismiss-button", { key: '97cfe5d517e0d7bd035c6442043c3a06cc316a53', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();

package/dist/collection/components/legacy/gux-switch-legacy/gux-switch-item/gux-switch-item.js

@@ -14,7 +14,7 @@ export class GuxSwitchItem {
         }
     }
     render() {
-        return (h(Host, { key: '9477760111cde092778f6a0ed990d61b271896d8', class: { 'gux-selected': this.selected } }, h("button", { key: 'ac3675451703016d360a5a797cb0e9949c598786', type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: '8501fa4a7f55e711ff18f43f0791d2e9d6fbb2f6' }))));
+        return (h(Host, { key: '56f068990fb4efa7d9bcf4bdfc804566f0278eaa', class: { 'gux-selected': this.selected } }, h("button", { key: 'e7b404cfef82ca41c150b49ebc6d91adde938a71', type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: '3d2bd71d34aa0c48301a229a0b1c396b714f9e93' }))));
     }
     static get is() { return "gux-switch-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/legacy/gux-switch-legacy/gux-switch.js

@@ -31,7 +31,7 @@ export class GuxSwitch {
         });
     }
     render() {
-        return (h(Host, { key: '432610cf0c9c117bf41bbdebeaf7577a7ff8c9d7', role: "group", class: `gux-${this.layout}` }, h("slot", { key: '97fbe60c6782cebf617c0609ba002c1a3de23f8d', onSlotchange: this.slotChanged.bind(this) })));
+        return (h(Host, { key: 'fe49b66fbc5afe91686a3953d62449e80a9a7399', role: "group", class: `gux-${this.layout}` }, h("slot", { key: '5bc85c04e73c8d8f03c70701d84785ad43473c9f', onSlotchange: this.slotChanged.bind(this) })));
     }
     static get is() { return "gux-switch-legacy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-accordion/gux-accordion-section/gux-accordion-section.js

@@ -44,20 +44,20 @@ export class GuxAccordionSection {
         this.hasIconSlot = !!this.root.querySelector('[slot="icon"]');
     }
     render() {
-        return (h("section", { key: '92264be5e193b74b3de87f892b976d2f351d449c', class: { 'gux-disabled': this.disabled } }, h("div", { key: '6d14a32c3c83b514a7a3599d64491ae6fe9dd21e', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: 'f9b97cc810abe5f5b5a5d43661171934798acf7a', class: {
+        return (h("section", { key: '2a58e71a34e93adb6380fce13b699c87419bf2fe', class: { 'gux-disabled': this.disabled } }, h("div", { key: 'a2d93a2a87dd23feeb984228d376e9067b8d1e1f', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: '60353998f0e53d0a658b508166cc83b441106528', class: {
                 'gux-header': true,
                 'gux-reverse-headings': this.reverseHeadings
-            }, type: "button", "aria-expanded": this.open.toString(), "aria-controls": this.sectionId, disabled: this.disabled, onClick: this.toggle.bind(this) }, this.hasIconSlot && h("slot", { name: "icon" }), h("div", { key: '0d4d33ec66ec642f40dbb7c0a6e331b9d923ee5b', class: {
+            }, type: "button", "aria-expanded": this.open.toString(), "aria-controls": this.sectionId, disabled: this.disabled, onClick: this.toggle.bind(this) }, this.hasIconSlot && h("slot", { name: "icon" }), h("div", { key: 'c5fe127c874da335faf416e8c1f05bc07252a934', class: {
                 'gux-header-text': true
-            } }, h("slot", { key: '47883aeae83fff06ec1c890e7d3d4348b89fe0a3', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: 'ade57783ff2afc9a188deaba32abe0e6ecb31ae4', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: 'fe4409168facdbdcfc61726102ae1f43ce13db02', class: {
+            } }, h("slot", { key: '54238e218ed6d794afaf712a0cc00b9cb14e7b25', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: 'a6255e3e57addc3c676c60377585d5d0fdd23b4a', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: '76145948b8ce5004e3588461a830f04e312492b2', class: {
                 'gux-header-icon': true,
                 'gux-expanded': this.open,
                 'gux-arrow-position-start': this.isArrowPositionBeforeText()
-            } }, h("gux-icon", { key: '09091f0c315706404cfd8a959371662e17eabbd9', decorative: true, "icon-name": "chevron-small-down" })))), h("div", { key: 'f655c10c51003150ea11ea84755ae05107dff7a6', id: this.sectionId, role: "region", "aria-labelledby": this.headerId, class: {
+            } }, h("gux-icon", { key: 'c4c55775320d8381f30f620c2ebf1127478c0666', decorative: true, "icon-name": "chevron-small-down" })))), h("div", { key: '02d0cad854972af9a7ecfdb5534c2589f1502937', id: this.sectionId, role: "region", "aria-labelledby": this.headerId, class: {
                 'gux-content': true,
                 'gux-expanded': this.open,
                 'gux-text-content-layout': this.contentLayout === 'text'
-            } }, h("slot", { key: 'dc87058e4e3c82046b991e2e2fc60b1a702a2479', name: "content" }))));
+            } }, h("slot", { key: '816524e5f64351de08633ac841b72ea843544ad2', name: "content" }))));
     }
     static get is() { return "gux-accordion-section"; }
     static get encapsulation() { return "shadow"; }