genesys-spark-components 4.100.0 → 4.101.1

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

@@ -0,0 +1,292 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+        r = Reflect.decorate(decorators, target, key, desc);
+    else
+        for (var i = decorators.length - 1; i >= 0; i--)
+            if (d = decorators[i])
+                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { h } from "@stencil/core";
+import { autoUpdate, computePosition, arrow, flip, offset, shift, hide } from "@floating-ui/dom";
+import { OnClickOutside } from "../../../utils/decorator/on-click-outside";
+import { trackComponent } from "../../../utils/tracking/usage";
+import { findElementById } from "../../../utils/dom/find-element-by-";
+/**
+ * @slot - popover content
+ */
+export class GuxPopoverList {
+    constructor() {
+        this.for = undefined;
+        this.position = 'bottom';
+        this.displayDismissButton = undefined;
+        this.closeOnClickOutside = false;
+        this.isOpen = false;
+    }
+    onKeyDown(event) {
+        switch (event.key) {
+            case 'Tab':
+            case 'Escape':
+                this.dismiss();
+                break;
+        }
+    }
+    checkForClickOutside(event) {
+        const clickPath = event.composedPath();
+        const forElement = findElementById(this.root, this.for);
+        const clickedForElement = clickPath.includes(forElement);
+        if ((this.closeOnClickOutside || !this.displayDismissButton) &&
+            this.isOpen &&
+            !clickedForElement) {
+            this.dismiss();
+        }
+        if (clickedForElement) {
+            this.popupElement.togglePopover();
+            this.isOpen = !this.isOpen;
+            this.runUpdatePosition();
+        }
+    }
+    runUpdatePosition() {
+        if (this.root.isConnected) {
+            this.cleanupUpdatePosition = autoUpdate(findElementById(this.root, this.for), this.popupElement, () => this.updatePosition(), {
+                ancestorScroll: true,
+                elementResize: true,
+                animationFrame: true,
+                ancestorResize: true
+            });
+        }
+        else {
+            this.disconnectedCallback();
+        }
+    }
+    updatePosition() {
+        const forElement = findElementById(this.root, this.for);
+        // This is 13 because this makes the arrow look aligned
+        const arrowLen = 13;
+        if (this.popupElement) {
+            void computePosition(forElement, this.popupElement, {
+                strategy: 'fixed',
+                placement: this.position,
+                middleware: [
+                    offset(2),
+                    flip(),
+                    shift(),
+                    hide(),
+                    arrow({
+                        element: this.arrowElement,
+                        padding: 16
+                    })
+                ]
+            }).then(({ x, y, middlewareData, placement }) => {
+                Object.assign(this.popupElement.style, {
+                    left: `${x}px`,
+                    top: `${y}px`
+                });
+                const side = placement.split('-')[0];
+                const staticSide = {
+                    top: 'bottom',
+                    right: 'left',
+                    bottom: 'top',
+                    left: 'right'
+                }[side];
+                // TODO: COMUI-3210 - Arrow currently does not show
+                if (middlewareData.arrow) {
+                    const { x, y } = middlewareData.arrow;
+                    this.popupElement.setAttribute('data-placement', placement);
+                    Object.assign(this.arrowElement.style, {
+                        left: x != null ? `${x}px` : '',
+                        top: y != null ? `${y}px` : '',
+                        right: '',
+                        bottom: '',
+                        [staticSide]: `${-arrowLen / 2}px`,
+                        transform: 'rotate(45deg)'
+                    });
+                }
+                if (middlewareData.hide) {
+                    Object.assign(this.popupElement.style, {
+                        visibility: middlewareData.hide.referenceHidden
+                            ? 'hidden'
+                            : 'visible'
+                    });
+                }
+            });
+        }
+    }
+    dismiss() {
+        const dismissEvent = this.guxdismiss.emit();
+        if (!dismissEvent.defaultPrevented) {
+            this.isOpen = false;
+            this.popupElement.togglePopover();
+        }
+    }
+    connectedCallback() {
+        trackComponent(this.root, { variant: this.position });
+    }
+    componentDidLoad() {
+        if (this.isOpen) {
+            this.popupElement.togglePopover();
+            this.runUpdatePosition();
+        }
+    }
+    componentDidUpdate() {
+        if (this.isOpen) {
+            this.runUpdatePosition();
+        }
+        else if (this.cleanupUpdatePosition) {
+            this.cleanupUpdatePosition();
+        }
+    }
+    disconnectedCallback() {
+        if (this.cleanupUpdatePosition) {
+            this.cleanupUpdatePosition();
+        }
+    }
+    render() {
+        return (h("div", { key: 'f42b52fb101ae28228a43b1b63380786c96e0ae7', ref: (el) => (this.popupElement = el), class: {
+                'gux-hidden': !this.isOpen,
+                'gux-popover-wrapper': true
+            }, "data-placement": true, popover: "manual" }, h("div", { key: '4c56c1d765988e6ab6d780f3531f5268ff8edac1', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), this.displayDismissButton && (h("gux-dismiss-button", { key: '5b57ef382386c628ce0f0f94e1cf6853c73f9331', onClick: this.dismiss.bind(this) })), h("div", { key: 'f97d9ab45434408704a6371cafa24899fd151500', class: "gux-popover-content" }, h("slot", { key: 'b363ec66ffaaf1e8995d7338097a52de3cc37d38' }))));
+    }
+    static get is() { return "gux-popover-list-beta"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gux-popover-list.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gux-popover-list.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "for": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicates the id of the element the popover should anchor to"
+                },
+                "attribute": "for",
+                "reflect": false
+            },
+            "position": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Placement",
+                    "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
+                    "references": {
+                        "Placement": {
+                            "location": "import",
+                            "path": "@floating-ui/dom",
+                            "id": "../../node_modules/@floating-ui/dom/dist/floating-ui.dom.d.ts::Placement"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicate position of popover element arrow (follow floating ui placement attribute api)"
+                },
+                "attribute": "position",
+                "reflect": false,
+                "defaultValue": "'bottom'"
+            },
+            "displayDismissButton": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicate if the dismiss button is displayed"
+                },
+                "attribute": "display-dismiss-button",
+                "reflect": false
+            },
+            "closeOnClickOutside": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Close popover when the user clicks outside of its bounds"
+                },
+                "attribute": "close-on-click-outside",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "isOpen": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Controls hiding and showing the popover"
+                },
+                "attribute": "is-open",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "guxdismiss",
+                "name": "guxdismiss",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fired when a user dismisses the popover"
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "root"; }
+    static get listeners() {
+        return [{
+                "name": "keydown",
+                "method": "onKeyDown",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
+}
+__decorate([
+    OnClickOutside({ triggerEvents: 'mousedown' })
+], GuxPopoverList.prototype, "checkForClickOutside", null);

package/dist/collection/components/beta/gux-rich-text-editor/gux-rich-text-editor-action-group/gux-rich-text-editor-action-group.js

@@ -12,7 +12,7 @@ export class GuxRichTextEditorActionGroup {
         }
     }
     render() {
-        return (h(Host, { key: '9e62d3e38876b2a5a98463118d7f508ea6381a81' }, h("div", { key: 'bc05990ef57f31faaa9f819a7a6e2b78853d12bb', class: "gux-action-group-container" }, h("slot", { key: '41db796c677c17fe907129139d9a62c4534032dc' })), this.renderActionGroupDivider()));
+        return (h(Host, { key: '031a1f2892b46409c272804d96d320fdce1b8776' }, h("div", { key: '8966532264cd6124fd123a05ebb429e7a97f8c41', class: "gux-action-group-container" }, h("slot", { key: '00a35806cdf7e5e98dec58147262400e7ac59db4' })), this.renderActionGroupDivider()));
     }
     static get is() { return "gux-rich-text-editor-action-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-rich-text-editor/gux-rich-text-editor-beta.js

@@ -34,10 +34,10 @@ export class GuxRichTextEditor {
         return this.renderSlot('global-action', 'gux-global-action-container');
     }
     render() {
-        return (h("div", { key: 'ca783004e7baf5176ec9bc95229ff642f4c77d9e', class: {
+        return (h("div", { key: '6fc5d8f521df5df2178ad338a8d91d339378c74c', class: {
                 'gux-rich-text-editor-container': true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '045681c4e1d07994986a80d4cba4fb1347dbeb8b', class: "gux-rich-text-editor-toolbar-container" }, this.renderTypographicalEmphasis(), this.renderTextStyling(), this.renderListsIndentation(), this.renderInserting(), this.renderGlobalAction()), h("slot", { key: 'f9f932c875385e22be1f9e6b7779fc2153132f52', name: "editor" })));
+            } }, h("div", { key: 'eb0173d434352148e9def109cab57539b5768543', class: "gux-rich-text-editor-toolbar-container" }, this.renderTypographicalEmphasis(), this.renderTextStyling(), this.renderListsIndentation(), this.renderInserting(), this.renderGlobalAction()), h("slot", { key: '2337bf2949d055f3987ab5a8916df139102b7251', name: "editor" })));
     }
     static get is() { return "gux-rich-text-editor-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: '0ecfbe4c440710ff030e763cd2c6ce5a03bc69ed', class: "gux-sr-only" }, h("slot", { key: '735e4cd2fa5b1ecc161fca404a6079daf68b6e94' })));
+        return (h("span", { key: '99e4b6ac03358bf032ad441c05fae657e45ee221', class: "gux-sr-only" }, h("slot", { key: 'de31dc9f2ca539eff7d97714f6d32b803c664d85' })));
     }
     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

@@ -48,19 +48,19 @@ export class GuxSegmentedControlItem {
         }
     }
     render() {
-        return (h("div", { key: 'a3163fc7d46abd6ae1b2cb350dc77c019946328e', class: {
+        return (h("div", { key: 'aefda8d25da23ee129efbb54a49c058e0d5ec04e', class: {
                 'gux-container': true,
                 'gux-parent-disabled': this.hasDisabledParent(),
                 'gux-start': this.isInStartPosition(),
                 'gux-end': this.isInEndPosition()
-            } }, h("button", { key: '188679eafba5acf1d56727a998060ff354b83ff9', class: {
+            } }, h("button", { key: '6f23fcc416eec9b564b646bb269c5f1524db2e10', class: {
                 'gux-segmented-control-item': true,
                 'gux-icon-only': this.iconOnly,
                 'gux-selected': this.selected
-            }, type: "button", disabled: this.disabled || this.hasDisabledParent() }, this.renderIconSlot(), h("div", { key: '99e6999be7ad20fde5f981b3b26278ba281a02ed', class: {
+            }, type: "button", disabled: this.disabled || this.hasDisabledParent() }, this.renderIconSlot(), h("div", { key: 'b98be18ff7f99f52c1fb32890c24f87603c12f0c', class: {
                 'gux-text': true,
                 'gux-icon-only': this.iconOnly
-            } }, h("slot", { key: '6a8363cd44d01ad0db3674ce5c15682567c70751', name: "text" }))), this.renderTooltip()));
+            } }, h("slot", { key: '641b8fb994d4238b5c32c29b5a10b8cdccf49991', 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

@@ -31,7 +31,7 @@ export class GuxSegmentedControl {
         });
     }
     render() {
-        return (h(Host, { key: '71c29eea98d3129dfed35ced4be237d97dc03f40', role: "group" }, h("slot", { key: '7ed26fd5a871bfe2366f66d4c6e278156743e05f', onSlotchange: this.slotChanged.bind(this) })));
+        return (h(Host, { key: 'ce2a752e70599cae1a95d16712b28b1b067d07a4', role: "group" }, h("slot", { key: '783879e721aad7497229b07333bdeb12df7ea29b', onSlotchange: this.slotChanged.bind(this) })));
     }
     static get is() { return "gux-segmented-control-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-selector-cards/gux-selector-card/gux-selector-card.js

@@ -50,11 +50,11 @@ export class GuxSelectorCard {
         }
     }
     render() {
-        return (h("div", { key: '8d1fbba6192ca0a41d87d798d8a2ccc1ba1611ca', class: {
+        return (h("div", { key: 'b91fc84d1ce6c64879e00b4a6c1403b44fa35ff4', class: {
                 'gux-selector-card': true,
                 [`gux-${this.variant}`]: true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '969fbb14f401d400c95c87ff4a26dfb660ffb162', class: "gux-content" }, h("div", { key: '4288c5c8d252e632d3ed6d4356973839beb93897', class: "gux-icon" }, h("slot", { key: '2f0a59c6652a3113a675651c56eba4101f61789c', name: "icon" })), h("div", { key: '046bcd334dcbede5c2aa1d8903c2f033e2e11785', class: "gux-label-container" }, h("slot", { key: '6988c4825800b7f7e289058477a243f22651bd66', name: "label" })), h("slot", { key: '051809cb3ce91a438ce99c1a0ec6e7783d7764fe', name: "input" }), this.renderDescription(), this.renderBadge())));
+            } }, h("div", { key: 'd135d3f37784619d316aa0fa126528e670663051', class: "gux-content" }, h("div", { key: 'c42a0ce13b448436a368e3fbf116800e818e8c08', class: "gux-icon" }, h("slot", { key: 'd5c7485de055122b2899a3fbc45c48c9f35c9817', name: "icon" })), h("div", { key: '153e15767f8fe6887fb0c1917c7f87c1bc3787da', class: "gux-label-container" }, h("slot", { key: '452fdce6225a5e912b9bc42d47ddd2eb27a1e77b', name: "label" })), h("slot", { key: 'f46300c3bc21ac82c0f4076da7868aa4a3fd3784', name: "input" }), this.renderDescription(), this.renderBadge())));
     }
     static get is() { return "gux-selector-card-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-selector-cards/gux-selector-cards.js

@@ -8,7 +8,7 @@ export class GuxSelectorCards {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: 'b02f3566386dec3f2dfc060a91386f32db39ac4c', class: "gux-selector-cards" }, h("slot", { key: '6334e361281bdc64fd3cd15f387bb7303927819b' })));
+        return (h("div", { key: 'f03b6a29a045a76215af8578416743e0287ecd0f', class: "gux-selector-cards" }, h("slot", { key: 'd2f29e773aac82a43e511f7e67cbef0f7c20f262' })));
     }
     static get is() { return "gux-selector-cards-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: '82b5cf6c605bde7b302d0a73deb452a34e15118a' }, this.renderTime()));
+        return (h(Host, { key: '437727e5ac1d1d91f210cc28b8476979fad97693' }, this.renderTime()));
     }
     static get is() { return "gux-time-beta"; }
     static get encapsulation() { return "shadow"; }

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

@@ -31,7 +31,7 @@ export class GuxTimeZoneBeta {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h(Host, { key: '18323c24483d93e5697275ff91ea8f8b25e21b5f' }, this.renderZoneDisplay()));
+        return (h(Host, { key: '0eee4e6790a7af5e881afc29c56c6c11ecbbe156' }, this.renderZoneDisplay()));
     }
     static get is() { return "gux-time-zone-beta"; }
     static get encapsulation() { return "shadow"; }

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

@@ -151,11 +151,11 @@ export class GuxTimeZonePickerBeta {
         return (h("gux-option-group-beta", { label: this.i18n('all') }, this.timeZoneOptionElements));
     }
     render() {
-        return (h("gux-dropdown", { key: '193500b9a5fafaa68f2c553f48968d0ea81bfdb2', class: {
+        return (h("gux-dropdown", { key: '8a8ecbe1895249e5852d0cecdf9b0f124b1f0642', class: {
                 'has-defaults': !!this.workspaceDefault ||
                     !!this.localDefault ||
                     !!this.customDefault
-            }, "filter-type": "custom", placeholder: this.i18n('selectZone'), value: this.value, hasError: this.hasError, disabled: this.disabled }, h("gux-listbox", { key: '2855646613b22f351792e137314c3e1d0dc277ce', "aria-label": this.i18n('timeZones') }, this.renderDefaultsList(), this.renderAllTimeZoneOptionsList())));
+            }, "filter-type": "custom", placeholder: this.i18n('selectZone'), value: this.value, hasError: this.hasError, disabled: this.disabled }, h("gux-listbox", { key: '038c3dc8072b022c403793a9d1a328860f32d3c2', "aria-label": this.i18n('timeZones') }, this.renderDefaultsList(), this.renderAllTimeZoneOptionsList())));
     }
     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.js

@@ -123,10 +123,10 @@ export class GuxTooltipBase {
         this.disconnectForElement();
     }
     render() {
-        return (h(Host, { key: '1ee9387e1c24fb277126461fa2babeebaa53a420', id: this.tooltipId ? undefined : this.id, role: this.tooltipId && !this.isShown ? undefined : 'tooltip', class: { 'gux-show': this.isShown }, "aria-hidden": this.visualOnly }, h("div", { key: 'b788e2bc87e9721ccd408a56f4086095e6647370', class: {
+        return (h(Host, { key: '0ecd2c660c0d0a63a8a20673fe0e556377dc4e5b', id: this.tooltipId ? undefined : this.id, role: this.tooltipId && !this.isShown ? undefined : 'tooltip', class: { 'gux-show': this.isShown }, "aria-hidden": this.visualOnly }, h("div", { key: '60a6a96fa97cd7c51d4e16b2f26270d09575578d', class: {
                 'gux-container': true,
                 [`gux-${this.accent}`]: true
-            }, "data-placement": this.placement }, h("slot", { key: 'e8cf1aa777998c6f206e06ce59ab33b09a6189da', name: "content" }))));
+            }, "data-placement": this.placement }, h("slot", { key: 'db8696adebbc85f2069dbdab66f36a8f5c40b9d4', 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

@@ -72,7 +72,7 @@ export class GuxTooltip {
         }
     }
     render() {
-        return (h(Host, { key: 'f2ebdfbd5fb382d6df0dd6fabd2f3c2eaa6f9151', id: this.id, role: this.role }, h("gux-tooltip-base-beta", { key: 'e5bf22d96ef93ea9a92e3513bbf2b4402cc3b316', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, visualOnly: this.visualOnly, ref: el => (this.baseTooltip = el) }, h("span", { key: 'f142e0d4ed78a9baba60ad5e62cbfde574a7a1c9', slot: "content" }, h("slot", { key: 'cc4c38ecb502b49c12e9d7e27f349b0c8be36170', name: "content" }, h("slot", { key: 'fa21cef8bd4692de0c637f62e3b3487002d8efeb' }))))));
+        return (h(Host, { key: 'dc719a621b4fb98478b19bc6067be9f27c816d9a', id: this.id, role: this.role }, h("gux-tooltip-base-beta", { key: '726edb14b76b5c23bf008c65a204e32658e33080', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, visualOnly: this.visualOnly, ref: el => (this.baseTooltip = el) }, h("span", { key: '52193640fc6cd44104270216061d842d71627b48', slot: "content" }, h("slot", { key: 'ac658b6501e6ca37ed0cbc5a284e9503e3188420', name: "content" }, h("slot", { key: 'e69e04aa6d3ccf538764b7cce26fe10403b862e9' }))))));
     }
     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: '39eea09a880ff581d57632782b631454d9344270' }, h("div", { key: '90137f100aff969a621e74be16a3ad1122ecc9f8', class: "gux-header" }, h("div", { key: '2b7aef705c8fd9cea541edf5fdd2de23f29bf12f', class: "gux-icon" }, h("slot", { key: '51062898df1646258a76fcd286f64ccc6102bdcb', name: "icon" })), h("div", { key: 'bbc9322af84778571014f59e0b03f8afaf958039', class: "gux-title" }, h("slot", { key: 'e2b3ca1557bbb46fe3ae3cd598c1c09afbf3e985', name: "title" }))), h("div", { key: 'ee968a9d48cfff9d48a82b67e2f553990139d532', class: "gux-message" }, h("slot", { key: '9087bf84e77ac1b314610772471f9cc2a0291e38', name: "message" })), h("div", { key: '229143a88629fb346cfeb9fd6ab33593486cae75', class: "gux-action-buttons" }, h("div", { key: '82c89befd5e68037733173cf0121de8ff8f63b23', class: "gux-positive-button" }, h("slot", { key: 'fb4a59a75a6f3edf4e53b7cb636e5accc524a1af', name: "positive-button" })), h("div", { key: 'af0c49681fb382304fe47d63277d88cb1aedccbf', class: "gux-negative-button" }, h("slot", { key: '9707d14de8db9eb424d19e1ccf7d72436c2a991c', name: "negative-button" })))));
+        return (h(Host, { key: '0d453cfdc8cc1339652a7c45b0b3aae0667591e5' }, h("div", { key: '836b20234ff71533132c7f8d776f6c0e2f103bce', class: "gux-header" }, h("div", { key: '108c1b54d037ca16e204ff201302d13120873d1b', class: "gux-icon" }, h("slot", { key: 'b7c64f54d548b0e30d066e5369a61a1bb4081391', name: "icon" })), h("div", { key: 'e26c8bd95f072cd877d27337f197621512343bc0', class: "gux-title" }, h("slot", { key: 'af4f339a62e9445f30627294deace68e2493f7fa', name: "title" }))), h("div", { key: '3ddaa58e415c0083b576fce7e1cc588308e3ebf6', class: "gux-message" }, h("slot", { key: '196ad6992f46b19d937c81a03a4734c5b917b8e3', name: "message" })), h("div", { key: '154569e2ac9f3f940a6b5d702e5d25c19c8d4f65', class: "gux-action-buttons" }, h("div", { key: '7c79b5be2fc8bdfa0a7ffce46f3ce3dfb785fe3c', class: "gux-positive-button" }, h("slot", { key: '49b965dfddaf62ad8e0f5debad26b94d36b22433', name: "positive-button" })), h("div", { key: '38ae31e0aea5812d6cd141a2e41532ddb1efe71f', class: "gux-negative-button" }, h("slot", { key: '06467ee25d32727057ea1a81f9afe15953e63eb8', 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: 'f5992bc9725a305c4ce379aafb8f899a9ff8467c', class: "gux-dropdown-option", title: this.text }, this.textWithHighlights()));
+        return (h("div", { key: 'a3bdd1c73a5fcade45681afac7fa1acd3dad88f2', 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: '137082491e948a61be16aab243a27e588b518548', expanded: this.opened, disabled: this.disabled }, h("div", { key: '0593f7f38a551a234f53adcd6a66ef3ddd8685eb', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: '79126386705c8096e4c994df0f477548db6f7a77', 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", { key: '9c416bf93781cb18cc4599b3418d5f014abb1859', class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { key: '8504fe8469b5b1dc011e47d46b4024a085d2de63', class: "gux-select-value", title: this.value }, this.value))), h("div", { key: 'fdf502465849a0e4f7468a2d200a08a1f91e3289', class: "gux-icon-wrapper" }, h("gux-icon", { key: '53f93df36c182692971bd9f96cd500ee9feec712', decorative: true, "icon-name": "custom/chevron-down-small-regular" }))), h("div", { key: '5d95bd99bf9d1145599f1d345892d2a06473a663', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: '7eb520651c465d6c93e71a7a0b0516ce660f8f5f', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: 'b55c179c839ae9211b86f52b90fa8beae41e8745', "label-position": "screenreader" }, h("label", { key: '67a6c6cdd4520e43a0c1390223e0c8e3f45fddae', slot: "label" }, this.i18n('searchAria')), h("input", { key: 'f3b4f1b4e33b3512b8bda8638e29bd410af87d63', slot: "input", type: "search", onInput: (event) => {
+        return (h("gux-popup", { key: '45d4a452b7e91fdb6ede39e466705a03ad6a7754', expanded: this.opened, disabled: this.disabled }, h("div", { key: '88192000e8584a26c0077d3bb5c45391616f985d', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: 'efe794cabf47827ae7035cc37e03089dabacb39c', 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", { key: '98d53f1e871270505d0544f359500da9045d88df', class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { key: '1b16c18118c77d3da1c16f20a1c493e7a3b67eb3', class: "gux-select-value", title: this.value }, this.value))), h("div", { key: '05634bb282f6ef01fd2c745d59fc80cfa2deab16', class: "gux-icon-wrapper" }, h("gux-icon", { key: 'fd8dffce216564bdb00db6a8b2f94b59115ad82c', decorative: true, "icon-name": "custom/chevron-down-small-regular" }))), h("div", { key: '532091c447224281c16726dd38c725372df5f391', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: '7719dc80d258a84aba644380b652da9c4c748c6a', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: 'dc70a6b451ea9a5608d3359880269ffe21c0719d', "label-position": "screenreader" }, h("label", { key: '103d944ee1b6439121dec9f08eecbbb17b7c3a6d', slot: "label" }, this.i18n('searchAria')), h("input", { key: '93832bf20890a54c0593b7bd53a55486e6702782', slot: "input", type: "search", onInput: (event) => {
                 this.handleSearchInput(event);
-            }, ref: el => (this.searchInput = el) })), h("div", { key: 'df6df0b8d2bba10bf469c4e78b4bd698dffc05e8', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: '85696e7589d49552962371ab41243cade0bebae1' }))))));
+            }, ref: el => (this.searchInput = el) })), h("div", { key: '1c71160a3f3e9cf39a5ad80775ebf5423e87e57f', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: 'f824cc42c71f6e1856c42447e48b87873c95c230' }))))));
     }
     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: '3e012aa285ba44d1bafa866f76fe75f106c46bec', class: `gux-disclosure-button-container gux-${this.position}` }, h("button", { key: 'a2f08d3d7c45fa5c46029bac455528a65d712aee', 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: '5f92ab8708b876b5dc830ddee317bccd1d91f01d', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '6507cf0d514cfce18c5bceffed5e13b2b36c3316', id: this.panelId, class: {
+        return (h("div", { key: 'f78f9dc37e2fed9414053b2e25cfd91ca4ee16d8', class: `gux-disclosure-button-container gux-${this.position}` }, h("button", { key: '205650b97b11a39cef68f57fec07df4918f9d296', 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: '77011342431a5c943dfe769b7ef5b91d819a82b2', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '3214383633a47b784b8d3990f8064481f6a5e147', id: this.panelId, class: {
                 'gux-disclosure-panel': true,
                 'gux-active': this.isOpen
-            }, role: "region" }, h("slot", { key: '0152f2061ee1cf6ad211d2c949bf99a1426a7921', name: "panel-content" }))));
+            }, role: "region" }, h("slot", { key: '7cdb146171377b4fef7ed8cc6347724aa11c72da', 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: '0b7bf1803a27712de1d2ce1e2864dc9c49e9004f', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'ab479c087a1af922272b5c7a6ed333c4b880e904', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '187bccef5bd926618c5674c18c2b33de87612de3', class: "gux-modal-header", id: titleID }, h("slot", { key: '8a35d0336b0df7cbfa1f3965594ff9c00e7332b3', name: "title" }))), h("gux-dismiss-button", { key: 'ccfcb15e7380b3838f602e30aabca386c5203b8b', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: 'f2d4711d6492ece45af28c3d25a4d470dba54152', class: {
+        return (h("div", { key: '78318ff7517eb4e8d7723167cf5bfb2f62598cd5', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: '38048b1f03a923fd678c41bf939afbe104fbb1ed', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '154187832ecb9b475ccc9860d1943429b0a0e9d1', class: "gux-modal-header", id: titleID }, h("slot", { key: 'f1bca427b206395585c14291434120ed1aebff05', name: "title" }))), h("gux-dismiss-button", { key: 'b546ac58db12248c2e69c1e0046e75436cedae9f', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: 'd94b6ef59e3b6f9e8a090ccb3a827abfa737ca8c', class: {
                 'gux-modal-content': true,
                 'gux-no-buttons': !hasFooterButtons
-            } }, h("p", { key: 'a53a92c0acaa5b9c561961937d40ed36da098c12' }, h("slot", { key: 'bd56c58ad6bf1ced890577ea660de3375f0f50ec', name: "content" }))), hasFooterButtons && (h("div", { key: '6b4ba6636c4ec443e02bcf1af00783ea20523ea5', class: "gux-button-footer" }, h("div", { key: '42ff0cdd27d1c25a6fdba0d90f440a474ad26c0c', class: "gux-left-align-buttons" }, h("slot", { key: '21c3373d83ecd0325643f482337c3d4e95c5aea4', name: "left-align-buttons" })), h("div", { key: 'da00f46b200b01eaf88cbc6674a5b24e12e82e2c', class: "gux-right-align-buttons" }, h("slot", { key: 'd58bf5c5f8ee524acaa366c2b8fec817257124bc', name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
+            } }, h("p", { key: '9e71b599f0cf0567ddd4514972ec7754e9c3283e' }, h("slot", { key: '351553dbd96f1918a85f6e3e4e0299a149185aa6', name: "content" }))), hasFooterButtons && (h("div", { key: '747f3ec8e449c0223832e43e50768fe8e2a396b9', class: "gux-button-footer" }, h("div", { key: '7a4cf92dca609b61f15569733b855a9cb0cbb3f5', class: "gux-left-align-buttons" }, h("slot", { key: 'eb18c891e7ac8225aaa4afa3e4d72d85c68c07f5', name: "left-align-buttons" })), h("div", { key: 'd4a185542b3b82076788d26041cf233aa8accffe', class: "gux-right-align-buttons" }, h("slot", { key: '86c40e3424c1a4996fb3e3cd2b81a94c71aed05d', 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: '81e1f0e6f5c908fc2f34d79870e3d0a968de4bf6' }, h("div", { key: '3bb0a7e11448c7d33a918cc90ef2e090a1b69687', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '26a5be9802c834fc3a51dcbfda55c0edaac82a94', name: "icon" })), h("div", { key: 'fc94a9cc95a742eed4954281081ee4874c4639e0', class: "gux-content" }, h("gux-truncate", { key: '716c86b33f2370dc82ad5be6e80950fdf5d216ac', class: "gux-title", "max-lines": 1 }, h("slot", { key: 'eaaaace3c7e6817286c09ec79f3610f72204c991', name: "title" })), h("gux-truncate", { key: '3049cf588bd4a5885f2dbe15a60dcb2eddcf89c1', class: "gux-message", "max-lines": 2 }, h("slot", { key: '1ba40d062fa1dc59fd67d067dba56cf3c7d6bc77', name: "message" }))), h("gux-dismiss-button", { key: '57ab0ad1ee764784351e6cad120c6b0482b8c194', onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: '29bd409866dc6a10696ef0fd10e7f5ffc84f97fd' }, h("div", { key: 'a9a5478c3645949605102e8bb782b1a6ee509b34', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '8e6fd5cca1352e95f825bb7ef8f361866695329a', name: "icon" })), h("div", { key: '1c77c88ed189344e878c53a00258a2859b99b4cc', class: "gux-content" }, h("gux-truncate", { key: '00a7784536788409f7c3bb5ff630b73d13a52fe2', class: "gux-title", "max-lines": 1 }, h("slot", { key: '79e4108e851cc46da3e69d3818f03487e3498d79', name: "title" })), h("gux-truncate", { key: '8464d829b48626ee2a5bb63bf3081752c20c4181', class: "gux-message", "max-lines": 2 }, h("slot", { key: 'b07aa706db328d15f4880955dc4fa6daab0897f2', name: "message" }))), h("gux-dismiss-button", { key: '81de69967382c3e97ddb0129ab94043ba6e3cffa', 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: '1002a9f57b994f82d4c55fe8bd44ac81aec86e05', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '0db29d47bbe35069be34418b6219bf65597c0c87', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'd09492d423a68a907c62cf8997ea6e4b82cb3d99', accent: "ghost" }, h("button", { key: '73e893c511d07567c5d0e2eca9b32e9e79e03dcf', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '0a2f5b667a98526bc9fd1468223db8a1188eb046', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: 'c89f1a7ae0c076858cd333f5c9dce5d81d829cb2', accent: "ghost" }, h("button", { key: '84659747522156ef703047d71c1248495b7083a8', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: '23ae006cdb96db54b7bf175c4f19004ea52e3fa6', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPagePicker(this.layout), h("div", { key: '817ea0b515203e1b4cb06bc8d72386d1e8ebf8b1', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'd6fb04ae44b07f1cfd056f4f4e847b057e760b64', accent: "ghost" }, h("button", { key: 'dad95f95adc33bf6cc9e8a8d6725af4ac5f095a8', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '93d95803fb291740747dc31280e106c9e7651930', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: 'b6cbebbde660a985128f227ee2ef0d313358d040', accent: "ghost" }, h("button", { key: 'a1c5fdf80c4706ca5b12d0de91d555ea9924b03a', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '706f0d4e1ac7ef44297f8bbdb5c92f5f676a3e5e', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
+        return (h("div", { key: 'd9cc666f5fb3fcd3a50cc652fdd033b6a40cd859', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '7fd62ec74d1a57ea094e37109cbfa10aa0aa66cb', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'de99a54442c3168eeea963c2c98134c2f08a800f', accent: "ghost" }, h("button", { key: 'da6954b497578ae1c9eea0f1b5000ed3bfd2a1ff', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '6462633c14d25669e981d514d6ddc0372d1af827', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: '036263cc6bf8a52d4d29e6c257559d6f1596264f', accent: "ghost" }, h("button", { key: '72ca07d538cbc942b63cc35fc5e869002466193f', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: 'e8e8f955c76dfcea3e76256f68232afb951380dc', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPagePicker(this.layout), h("div", { key: 'c1b05177d96e60c8dbab40f21cc13d6d2ba871c8', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'aea0884e9f8b66002893ee6c94f58e46bd345c08', accent: "ghost" }, h("button", { key: '27c7f68777a0aba912d4a8fb75bb66f37175ba80', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '06bac85862fb54c72d37594c9a514782334cf418', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: 'c2671535419aae0d93df96efb99ccb9f6225f01e', accent: "ghost" }, h("button", { key: 'bda0dcc81536c91cf92bf16c6f4d1b906a65aa88', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: 'b8e7eaf54b223fffea373f080fc0c06740ef25b5', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
     }
     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: '843dfc2f4a9499f00a2e4d38bdf62886a78c673b', class: "gux-pagination-item-counts-container" }, h("span", { key: 'f7774f33eb83edd54a7563b4c069156c75271656', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
+        return (h("div", { key: '3f3ede0c37facac2b9cf46c686f0818bd3d0e0bb', class: "gux-pagination-item-counts-container" }, h("span", { key: '4170e69c54e1bd437241315e286ae4e98d0bec52', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
             firstItem: this.firstItem,
             lastItem: this.lastItem
-        })), h("span", { key: 'ae705898bcc17e844c47b79dd22bb1ca926e5443' }, this.i18n('totalItems', { totalItems: this.totalItems }))));
+        })), h("span", { key: '3cd0b26ce6195e8ad0712c7f3391b6af44edcaa6' }, 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: '58cb24562a200013ad3845004fda14082166405e', class: "gux-pagination-items-per-page-container" }, h("div", { key: '2744abf9a220717e71f6d0579a7fecc6476044fc', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: '145a514daf02bd9692b637f6ed4f432392e8b5b6', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
+        return (h("div", { key: '74b3f06f813b32bf87a1b4a8605f5d7dc0715613', class: "gux-pagination-items-per-page-container" }, h("div", { key: '8ebf3086e976e6465801d1ca94d1f7e260ebbc28', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: 'b95fa0ff2bc01b62bfed3670752ef46ca5e1810c', 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: '5b21f2debbbadf6bebe3dfe94103e4e4bf55c462', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '4018afbdd1fd11843e8c72ae889531bfae857f12', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: 'be9c5c3501163de425e8ab14be9b25818f2d7d03', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
+        return (h("div", { key: 'a9e64f7b69b564109f8af1afb6ea858c643f3691', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '51ac851eeb00b918c664e8d7b3ebc2bfea5be93f', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: '67e8ac6fe84a7d7a793a253cd8023efee8f2e760', 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: 'f504de9049874db1ef706c042175bed36d423b29' }, h("div", { key: '803640396d7fec743592784adf5493fe22e68e0b', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '0b68c6cf8e77354ae526bdcdcea5fdd812889a12', name: "icon" })), h("gux-truncate", { key: 'e8d7271eae9498077c3b5d59c0032e281db51f84', class: "gux-message", "max-lines": 2 }, h("slot", { key: '365a98768b8399f4cdafc97a306c915d0c8fce36', name: "message" })), h("gux-dismiss-button", { key: '73fee5a9c5c07c3ee40829bf277000ef71776f47', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: 'db2c740647d7a8a67532e31718e0a62d7cd8c27e' }, h("div", { key: '7ea3dea9fa72a9db1359a6d38a03cdfb17c8567a', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '1383078dee16fc5e9ea9b4f0681f6fa1ecabcc2b', name: "icon" })), h("gux-truncate", { key: 'd9d448b6796b1846d0a4c3f3895ee44b2ae7822b', class: "gux-message", "max-lines": 2 }, h("slot", { key: 'dfd7532ea190c9fefefbfd7014252727d4f69332', name: "message" })), h("gux-dismiss-button", { key: '1c541ed4eaba2bab5421a0931af71582e6f27611', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();