genesys-spark-components 4.101.0 → 4.102.0

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: '7e7b13628134491dc96164750ce686c8f1a5307d' }, h("div", { key: 'cee69f74aead704128f52f646677ae1fe77b9b4d', class: "gux-action-group-container" }, h("slot", { key: 'b9c30070198e8b7bc67eb13a5e22697cf7702e8c' })), 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: '23c2fbfcc6ebbb5533b1220440d2b0667dec07e6', class: {
+        return (h("div", { key: '6fc5d8f521df5df2178ad338a8d91d339378c74c', class: {
                 'gux-rich-text-editor-container': true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '6fc00023659d263ae0de23bfba03bb7feb394183', class: "gux-rich-text-editor-toolbar-container" }, this.renderTypographicalEmphasis(), this.renderTextStyling(), this.renderListsIndentation(), this.renderInserting(), this.renderGlobalAction()), h("slot", { key: '59700c2d73f3ac5c20223cb24dded4149f807077', 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: '0d9fa88365514e8f07545990008398a539a9fda1', class: "gux-sr-only" }, h("slot", { key: '50a7fad51d81ba2484b607ee83de3f0c0a7782ec' })));
+        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: 'c2d36dae08d9d2262a104da36db66f646acd6b7a', 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: 'd44f43beff655a8a7bdb58e1198016fc31ad8d84', 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: 'e8f7ed22abddccec02bed82091466283f4b3bc39', 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: '47565f55434b6dc98b40bbe40f607e22a2ccc521', 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: '1952a10a27ff6ad93d8d711d0d9071268d02cad7', role: "group" }, h("slot", { key: '01161b8c664e5331e200d48acc8ef0d159e5d314', 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: 'e1eba4d4cff38b06b9fdd9129ee7921af161167f', class: {
+        return (h("div", { key: 'b91fc84d1ce6c64879e00b4a6c1403b44fa35ff4', class: {
                 'gux-selector-card': true,
                 [`gux-${this.variant}`]: true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '948053b1bdd37ced09ce5420d9c314a9108bbb7d', class: "gux-content" }, h("div", { key: '30d43b5616912e6bcac064e6a9b0f0a256d59798', class: "gux-icon" }, h("slot", { key: 'd91dcf98ae0fb5946963b991e6d8c8e7b332a78c', name: "icon" })), h("div", { key: '71e9c985bad98ffbe4ff9f1a1f4539a778f9f47b', class: "gux-label-container" }, h("slot", { key: '8653b677ed5ab4f935e4ea51adb143e414109ff3', name: "label" })), h("slot", { key: 'eb6d511e381ac945979128b8ddc76388af07f5ce', 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: '9d3133901881d869194d763fb34b7f42a4c00127', class: "gux-selector-cards" }, h("slot", { key: 'a61a8c6998dcde294198684d628a13ca8330a0b9' })));
+        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: '6432f5c8e6362fbf9cf973d0a10af4b1d2079b18' }, 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: '0f182bfb6955009e9f6b0ca8fb09baf1f50f4984' }, 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: '9a8977bd6dcd0435ab027fee2b5a14586a634606', 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: '363bbc22f7e454bbc51a77ce3c3db38a009d8a9f', "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: 'fe5a55694aa89aa47535e6123df49abc821e79b2', 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: 'eba12e9121d51cc2fea5f3c65eb263ab288aeaf6', 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: '1be0f1bb77bacf2f1e3e84b11800e0269c88a37c', 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: '7d7bae7b81ba9af26eda2d2fff931c6abbb11c20', id: this.id, role: this.role }, h("gux-tooltip-base-beta", { key: 'd568293cb39955822bb1c9a3a3b00234a918262c', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, visualOnly: this.visualOnly, ref: el => (this.baseTooltip = el) }, h("span", { key: 'f5965423967f9167d2a1eec62a4f49d1fc3fa5f7', slot: "content" }, h("slot", { key: '69305099094fb46797b54ab75813f7930ab79135', name: "content" }, h("slot", { key: 'e28e74106bac620730a20e395d72ee425aed6b75' }))))));
+        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: 'e910c2091671903ba6678bc8c9c7df7cc81b8e4e' }, h("div", { key: 'bea9fbda05d91817d859c9b2dbf5ba8e57de8cf5', class: "gux-header" }, h("div", { key: 'fa91a5df005ce407d89be95eba0cf82e33e51eb9', class: "gux-icon" }, h("slot", { key: '76e757532b23e273e7a3141c8b3941145a45e254', name: "icon" })), h("div", { key: '51a5fb4275acd1b6c03e27e5ee2393735651c46e', class: "gux-title" }, h("slot", { key: '809978e3312625578c012838be621543655c28db', name: "title" }))), h("div", { key: '9ff1aabb3e01ea9ea65129aea2dc0e4a34a12123', class: "gux-message" }, h("slot", { key: '6611226bca9cbd51552787159611fbbc05c231ba', name: "message" })), h("div", { key: '028538d3f12b2359c2b43f448eb81f77a1361b06', class: "gux-action-buttons" }, h("div", { key: '1060b432dc6ee520a70e05a01e0a3448b2af7e72', class: "gux-positive-button" }, h("slot", { key: '0b8829d395a7637d3a831e1f1c083e7799de85f6', name: "positive-button" })), h("div", { key: 'cf79a83bb53e071378804f91728f33667b1a7ac7', class: "gux-negative-button" }, h("slot", { key: 'e156acc6355467568ba53b21ec8fe7ebcb611816', 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: '1c8a172832ff159bac312d8cffcad1d9e4b0225b', 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: '4166eb7fbbfea786ce8e1b5baaf83674ba95248f', expanded: this.opened, disabled: this.disabled }, h("div", { key: 'c5a4be5999a5c99bbe17732a60584432061fea08', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: '6cb0759f595dbcb60fff7c99eedf8b53878a4c68', 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: 'eb8a7638dccac8a049eec486c56c54d1a5719829', class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { key: 'b90a25c704ef87a7e91e350334ebae60a9388808', class: "gux-select-value", title: this.value }, this.value))), h("div", { key: 'd2bc8729c1276c717c69e1f761cef1ea1d19f28b', class: "gux-icon-wrapper" }, h("gux-icon", { key: '6b89a96a30a7ab66e3e459523fe11c0e392f5467', decorative: true, "icon-name": "custom/chevron-down-small-regular" }))), h("div", { key: 'fbbfdbf4c72f4db7bfa7fc2c547ffe75a3463920', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: 'dd6cbbbe2e56509627e6568d807ff3ed58644d23', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: '4bdaaec0094554b748457879fa620ac8a087f3dd', "label-position": "screenreader" }, h("label", { key: '600fdded20c0f4ee37c55e1d752b0f20ea17b91c', slot: "label" }, this.i18n('searchAria')), h("input", { key: 'cedc871ffb53fff5bd78e37f115a049d793fe80d', 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: 'cf6467ed42dbebe12928107eb16af05370e489d7', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: '146cd86c93dc3ea4fd6107bc8f6d1f76b4f7a7ea' }))))));
+            }, 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: '380bf93e1ab0b7afe053d76c51e17fe04ad55c5f', class: `gux-disclosure-button-container gux-${this.position}` }, h("button", { key: 'b7ee2cce68baa350ca54bd250178dc47108c33bf', 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: '7d782bb3c8fc59c2c607414734032b3468373b3a', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '8299192dc83ccc26d9f0a5b7c9c502c1e2e16771', 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: '289522bbb7a1828b2c0bfdcf9b6c4e8e54d389fb', 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: '7a943954edd102cd24a11874d50abe663e06cc87', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: '9b7cf9cc2baec0a35dcc5b0357f1a8c3ac92e43e', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '456bfe750706c395febbb4c96118e31ff3e1c52e', class: "gux-modal-header", id: titleID }, h("slot", { key: '783b8718ea3ea02dd2811f91ef33146d765a0c02', name: "title" }))), h("gux-dismiss-button", { key: '69eed2fcf8332f8fbb196a873a0ad172358c0df5', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: '9352d439b16722dce40341909ba3973e6d98c7b0', 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: '0055481b84e464e9f99d70217e0ac114149fdcf2' }, h("slot", { key: '12dd0d0b9327f0586ab2f69756aba55d2b5aacc3', name: "content" }))), hasFooterButtons && (h("div", { key: 'e5e2f768762dc20049637b8d55ca49acf4a5db1f', class: "gux-button-footer" }, h("div", { key: '3df016757d97dafeab0f2b15317d60eb3962733a', class: "gux-left-align-buttons" }, h("slot", { key: '0a7298eb91522626559564a2b7121368b2e320ab', name: "left-align-buttons" })), h("div", { key: 'd605b78e41e4aa20ae291ad81d0173fc3480731d', class: "gux-right-align-buttons" }, h("slot", { key: '714fadd6525b0375d149413a55b3854d61f0cd55', 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: '57855bd523d8094976b2432321e2e6ce5c2c55d8' }, h("div", { key: '7ba34b2ff5b35c136566fd7ccb0ad3e95eed5201', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '51dbe884721af6e752d9639119d5ae7b8ff1eef0', name: "icon" })), h("div", { key: 'ba8b02229cb19ebd6f4e840053f07f54ba3f48d2', class: "gux-content" }, h("gux-truncate", { key: '0640385628f1350805f4d9f7540b49166ec6a1de', class: "gux-title", "max-lines": 1 }, h("slot", { key: '62a05d4c570593a19f579556c7d59865233e7740', name: "title" })), h("gux-truncate", { key: 'a5faf6e12b5bc643024c67fd08d5759863af2c87', class: "gux-message", "max-lines": 2 }, h("slot", { key: 'cda23674fdd22d2453c7777b81f0fe7283833bf2', name: "message" }))), h("gux-dismiss-button", { key: '3be6658f04b7a271dfb7964e94af768bbe643acb', 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: '63f25242d8f57533e0472cc7b2dde6343f9cc461', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '69f6fa72263132acf189416eda2ba0eec746126e', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'a6df3a314c823bc710e6b631bd58216e9e37f098', accent: "ghost" }, h("button", { key: 'f67ed197ecac37fde86f1c35dc05f879d5e44e2d', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: 'ac087e56dc8985d4caae009f77cbb37dcc47739c', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: 'e3f46f270f2420b563f61023be4ce0c729b870cc', accent: "ghost" }, h("button", { key: '092511af1995070a3276fe927234f0ebdc81968e', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: 'd4f2f403bb776ec4fc7db62e99e0a94fa6d2d015', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPagePicker(this.layout), h("div", { key: '53171cb1a79c4546af339f58b33717144eae4b86', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'f22becc2f8cd95ef0c16b4702d44c98d2ad69ee0', accent: "ghost" }, h("button", { key: '3e67ffdd6f4dcecdc5df5f43271ebeeee8763815', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: 'd7ab04a202d803f8095df59f276205d7c0d76d4d', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: '8b1b19b39688d6e7e47486a2e0a5ef1631e03290', accent: "ghost" }, h("button", { key: 'b975116faa3edb01d80083dbc7563c8e76e8ad4a', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '235ed5444b79ce05e92221c6fccda9f8f764ef66', 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: 'e07678f89cd0ad68035a44cc0bb188845c4aadf3', class: "gux-pagination-item-counts-container" }, h("span", { key: '0ad495a7e4935c4ca9c39ec413b541f577372517', 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: '0ec25b4413086c37f148cd94800438baaf83b0ee' }, 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: '0189325ebbf1469d4e95a3df1a3ce96839e0366e', class: "gux-pagination-items-per-page-container" }, h("div", { key: '48a9e130c47efa5f0a1d42d075d5ffc81db26c4c', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: '01dced62d3184e62bb85eee7952eee2527ff1ddc', 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: '22b47645b61ca44ddccd36980f79af2596f2601f', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '3ce9e0fe6b3bfdeeb71c86e6926845a90bf0192c', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: '81b6ea9789fb6c1f0be8d5bd9f8d9bb5a6f8b57b', 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: '91a7b9d2b40a814fba37e659cbb32e74b328b497' }, h("div", { key: 'a3566d34608e319b302a92a64a58e92e055bff89', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '56b8a5cf3b867cfd9314af9e281e50f336f5d8f2', name: "icon" })), h("gux-truncate", { key: 'b3228d05b1900cd02f52469004e6c20a38633850', class: "gux-message", "max-lines": 2 }, h("slot", { key: '98a05ff8453bbbf851a6f67224fc4c46af6f6992', name: "message" })), h("gux-dismiss-button", { key: 'b35400665b335f55a70b5bc3913b88ecb12cb868', 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();