genesys-spark-components 4.138.5 → 4.140.0

package/dist/esm/gux-inline-dropdown-beta.entry.js

@@ -0,0 +1,270 @@
+import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement } from './index-1f4f2f77.js';
+import { O as OnClickOutside } from './on-click-outside-6c2e399b.js';
+import { b as buildI18nForComponent } from './index-4f1356d9.js';
+import { s as simulateNativeEvent } from './simulate-native-event-e0631897.js';
+import { b as afterNextRender } from './after-next-render-07a41f53.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
+import { O as OnMutation } from './on-mutation-751e68e4.js';
+import { s as setInitialActiveOption, b as getListOptions } from './gux-listbox.service-250c2b08.js';
+import { h as hasSlot } from './has-slot-f24a46a6.js';
+import './get-closest-element-728b9f18.js';
+
+const filterResults = "Type to filter dropdown results";
+const noSelection = "Select...";
+const dropdown = "Dropdown";
+const translationResources = {
+	filterResults: filterResults,
+	noSelection: noSelection,
+	dropdown: dropdown
+};
+
+const guxInlineDropdownCss = ":host{box-sizing:border-box}::slotted(gux-listbox){inline-size:fit-content}.gux-field,.gux-target-container-expanded{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;place-content:stretch center;align-items:center;block-size:var(--gse-ui-formControl-input-textfield-height);font-family:var(--gse-ui-dataTableItems-inlineDropdown-label-fontFamily);font-size:var(--gse-ui-dataTableItems-inlineDropdown-label-fontSize);font-weight:var(--gse-ui-dataTableItems-inlineDropdown-label-fontWeight);line-height:var(--gse-ui-dataTableItems-inlineDropdown-label-lineHeight);cursor:pointer;background-color:var(--gse-ui-formControl-input-backgroundColor)}.gux-target-container-expanded,.gux-target-container-collapsed .gux-field{padding-block:4px;padding-inline:8px}.gux-target-container-collapsed .gux-field-button:hover,.gux-target-container-expanded:hover{background-color:var(--gse-ui-dataTableItems-statusIndicator-hover)}.gux-field.gux-input-field{block-size:var(--gse-ui-dataTableItems-inlineDropdown-label-lineHeight)}.gux-field .gux-field-content{--gux-zindex-tooltip:3;display:inline-flex;flex:1 1 0;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;min-inline-size:0;block-size:var(--gse-ui-dataTableItems-inlineDropdown-label-lineHeight)}.gux-field .gux-field-content .gux-filter,.gux-field .gux-field-content .gux-selected-option,.gux-field .gux-field-content .gux-placeholder{flex:1 1 auto;align-self:auto;order:0;padding:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gux-field .gux-field-content .gux-placeholder{color:var(--gse-ui-dataTableItems-inlineDropdown-text)}.gux-field .gux-expand-icon{flex:0 0 auto;align-self:auto;order:0;padding-inline-start:var(--gse-ui-dataTableItems-inlineDropdown-gap);color:var(--gse-ui-dataTableItems-inlineDropdown-chevron-default)}.gux-target-container-expanded{background-color:var(--gse-ui-dataTableItems-inlineDropdown-active);border-radius:var(--gse-ui-dataTableItems-statusIndicator-borderRadius)}.gux-target-container-expanded:focus-visible{outline:var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);outline-offset:var(--gse-semantic-focusOutline-offset)}.gux-target-container-expanded:focus-within:has(:focus-visible){outline:var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);outline-offset:var(--gse-semantic-focusOutline-offset)}.gux-target-container-expanded .gux-filter-input{background-color:inherit;border:none}.gux-target-container-expanded .gux-filter-input:focus{outline:none;border:none}.gux-target-container-expanded .gux-field-button{inline-size:auto;block-size:var(--gse-ui-dataTableItems-inlineDropdown-label-lineHeight);margin:0;outline:none;background:inherit;border:none;box-shadow:none}.gux-target-container-expanded .gux-field-button:focus{outline:none}.gux-target-container-collapsed .gux-field-button{border-radius:var(--gse-ui-dataTableItems-statusIndicator-borderRadius)}.gux-target-container-collapsed .gux-field-button:focus-visible{outline:var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);outline-offset:var(--gse-semantic-focusOutline-offset)}.gux-target-container-collapsed .gux-field-button:focus-within:has(:focus-visible){outline:var(--gse-ui-formControl-input-focus-border-width) var(--gse-ui-formControl-input-focus-border-style) var(--gse-ui-formControl-input-focus-border-color);outline-offset:var(--gse-semantic-focusOutline-offset)}::slotted(gux-listbox){outline:none;box-shadow:var(--gse-ui-menu-boxShadow)}.gux-selected-icon{display:flex;flex-direction:row;align-items:center}.gux-selected-icon.gux-icon-position-end{flex-direction:row-reverse}.gux-selected-icon gux-icon{padding-inline-end:var(--gse-ui-dataTableItems-inlineDropdown-gap)}.gux-status-indicator{display:inline-flex;gap:var(--gse-ui-dataTableItems-statusIndicator-gap);align-items:center}.gux-status-icon{display:inline-flex}.gux-status-icon::before{content:\"\"}.gux-status-icon-info::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M6 0C7.59 0 9.12 0.629997 10.245 1.755C11.37 2.88 12 4.41 12 6C12 7.59 11.37 9.12 10.245 10.245C9.12 11.37 7.59 12 6 12C4.41 12 2.88 11.37 1.755 10.245C0.629997 9.12 0 7.59 0 6C0 4.41 0.629997 2.88 1.755 1.755C2.88 0.629997 4.41 0 6 0Z' /%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M6 0C7.59 0 9.12 0.629997 10.245 1.755C11.37 2.88 12 4.41 12 6C12 7.59 11.37 9.12 10.245 10.245C9.12 11.37 7.59 12 6 12C4.41 12 2.88 11.37 1.755 10.245C0.629997 9.12 0 7.59 0 6C0 4.41 0.629997 2.88 1.755 1.755C2.88 0.629997 4.41 0 6 0Z' /%3E%3C/svg%3E\");inline-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);block-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);background:var(--gse-ui-statusGlyph-information)}.gux-status-icon-warning::before{inline-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);block-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M6.16516 0.749268C6.49521 0.749268 6.80275 0.921791 6.97527 1.21434L12.0386 9.8407C12.2111 10.1332 12.2111 10.4933 12.0386 10.7783C11.8735 11.0709 11.5585 11.2509 11.2285 11.2509H1.10186C0.764303 11.2509 0.456764 11.0709 0.291738 10.7783C0.126712 10.4858 0.126712 10.1257 0.291738 9.8407L5.35504 1.21434C5.52757 0.929292 5.8276 0.749268 6.16516 0.749268Z' /%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M6.16516 0.749268C6.49521 0.749268 6.80275 0.921791 6.97527 1.21434L12.0386 9.8407C12.2111 10.1332 12.2111 10.4933 12.0386 10.7783C11.8735 11.0709 11.5585 11.2509 11.2285 11.2509H1.10186C0.764303 11.2509 0.456764 11.0709 0.291738 10.7783C0.126712 10.4858 0.126712 10.1257 0.291738 9.8407L5.35504 1.21434C5.52757 0.929292 5.8276 0.749268 6.16516 0.749268Z' /%3E%3C/svg%3E\");background:var(--gse-ui-statusGlyph-neutral)}.gux-status-icon-error::before{inline-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);block-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M0.236102 6.88C-0.0787008 6.33785 -0.0787008 5.66215 0.236102 5.12L2.36477 1.38C2.67957 0.837853 3.24922 0.5 3.87133 0.5H8.12867C8.75078 0.5 9.32043 0.837853 9.63523 1.38L11.7639 5.12C12.0787 5.66215 12.0787 6.33785 11.7639 6.88L9.63523 10.62C9.32043 11.1621 8.75078 11.5 8.12867 11.5H3.87133C3.24922 11.5 2.67957 11.1621 2.36477 10.62L0.236102 6.88Z' /%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M0.236102 6.88C-0.0787008 6.33785 -0.0787008 5.66215 0.236102 5.12L2.36477 1.38C2.67957 0.837853 3.24922 0.5 3.87133 0.5H8.12867C8.75078 0.5 9.32043 0.837853 9.63523 1.38L11.7639 5.12C12.0787 5.66215 12.0787 6.33785 11.7639 6.88L9.63523 10.62C9.32043 11.1621 8.75078 11.5 8.12867 11.5H3.87133C3.24922 11.5 2.67957 11.1621 2.36477 10.62L0.236102 6.88Z' /%3E%3C/svg%3E\");background:var(--gse-ui-statusGlyph-negative)}.gux-status-icon-success::before{inline-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);block-size:var(--gse-ui-dataTableItems-statusIndicator-label-fontSize);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M6 0C7.59 0 9.12 0.629997 10.245 1.755C11.37 2.88 12 4.41 12 6C12 7.59 11.37 9.12 10.245 10.245C9.12 11.37 7.59 12 6 12C4.41 12 2.88 11.37 1.755 10.245C0.629997 9.12 0 7.59 0 6C0 4.41 0.629997 2.88 1.755 1.755C2.88 0.629997 4.41 0 6 0Z' /%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' %3E%3Cpath d='M6 0C7.59 0 9.12 0.629997 10.245 1.755C11.37 2.88 12 4.41 12 6C12 7.59 11.37 9.12 10.245 10.245C9.12 11.37 7.59 12 6 12C4.41 12 2.88 11.37 1.755 10.245C0.629997 9.12 0 7.59 0 6C0 4.41 0.629997 2.88 1.755 1.755C2.88 0.629997 4.41 0 6 0Z' /%3E%3C/svg%3E\");background:var(--gse-ui-statusGlyph-positive)}";
+const GuxInlineDropdownBetaStyle0 = guxInlineDropdownCss;
+
+var __decorate = (undefined && undefined.__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;
+};
+const GuxDropdown = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.guxexpanded = createEvent(this, "guxexpanded", 7);
+        this.guxcollapsed = createEvent(this, "guxcollapsed", 7);
+        this.required = false;
+        this.expanded = false;
+    }
+    watchValue(newValue) {
+        this.validateValue(newValue, this.listboxElement);
+    }
+    onKeydown(event) {
+        switch (event.key) {
+            case 'Escape':
+                this.collapseListbox('focusFieldButton');
+                return;
+            case 'Tab':
+                this.collapseListbox('noFocusChange');
+                return;
+            case 'ArrowDown':
+                if (this.activeElementNotListbox()) {
+                    event.preventDefault();
+                    this.expanded = true;
+                    setInitialActiveOption(this.listboxElement);
+                }
+                return;
+        }
+    }
+    onInternallistboxoptionsupdated(event) {
+        event.stopPropagation();
+        forceUpdate(this.root);
+    }
+    onBlur(event) {
+        this.stopPropagationOfInternalFocusEvents(event);
+    }
+    onFocus(event) {
+        this.stopPropagationOfInternalFocusEvents(event);
+    }
+    onFocusout(event) {
+        this.stopPropagationOfInternalFocusEvents(event);
+    }
+    onFocusin(event) {
+        this.stopPropagationOfInternalFocusEvents(event);
+    }
+    onClickOutside() {
+        this.collapseListbox('noFocusChange');
+    }
+    onMutation() {
+        var _a;
+        if (this.listboxElement) {
+            return;
+        }
+        this.listboxElement = (_a = this.root) === null || _a === void 0 ? void 0 : _a.querySelector('gux-listbox');
+        this.applyListboxEventListeners();
+    }
+    onInternalExpanded(event) {
+        event.stopPropagation();
+        this.guxexpanded.emit();
+        if (this.listboxElement) {
+            afterNextRender(() => {
+                this.listboxElement.focus();
+            });
+        }
+    }
+    onInternalCollapsed(event) {
+        event.stopPropagation();
+        this.guxcollapsed.emit();
+    }
+    connectedCallback() {
+        var _a;
+        this.listboxElement = (_a = this.root) === null || _a === void 0 ? void 0 : _a.querySelector('gux-listbox');
+        if (this.listboxElement) {
+            this.validateValue(this.value, this.listboxElement);
+        }
+    }
+    async componentWillLoad() {
+        trackComponent(this.root);
+        this.i18n = await buildI18nForComponent(this.root, translationResources);
+    }
+    componentDidLoad() {
+        this.applyListboxEventListeners();
+    }
+    componentWillRender() {
+        if (this.listboxElement) {
+            this.validateValue(this.value, this.listboxElement);
+        }
+    }
+    showTooltip() {
+        var _a;
+        void ((_a = this.truncateElement) === null || _a === void 0 ? void 0 : _a.setShowTooltip());
+    }
+    hideTooltip() {
+        var _a;
+        void ((_a = this.truncateElement) === null || _a === void 0 ? void 0 : _a.setHideTooltip());
+    }
+    validateValue(newValue, listboxElement) {
+        if (newValue === undefined) {
+            if (listboxElement) {
+                listboxElement.value = newValue;
+            }
+            return;
+        }
+        const selectedListboxOptionElement = this.getOptionElementByValue(newValue);
+        if (selectedListboxOptionElement) {
+            listboxElement.value = newValue;
+            return;
+        }
+    }
+    applyListboxEventListeners() {
+        var _a, _b;
+        (_a = this.listboxElement) === null || _a === void 0 ? void 0 : _a.addEventListener('input', (event) => {
+            event.stopPropagation();
+            this.updateValue(event.target.value);
+        });
+        (_b = this.listboxElement) === null || _b === void 0 ? void 0 : _b.addEventListener('change', (event) => {
+            event.stopPropagation();
+        });
+    }
+    stopPropagationOfInternalFocusEvents(event) {
+        if (this.root.contains(event.relatedTarget)) {
+            return event.stopImmediatePropagation();
+        }
+    }
+    get optionElements() {
+        return getListOptions(this.listboxElement);
+    }
+    getOptionElementByValue(value) {
+        return this.optionElements.find(optionElement => {
+            return optionElement.value === value;
+        });
+    }
+    fieldButtonClick() {
+        this.expanded = !this.expanded;
+    }
+    activeElementNotListbox() {
+        return document.activeElement !== this.listboxElement;
+    }
+    collapseListbox(focusChange) {
+        if (this.expanded) {
+            this.expanded = false;
+        }
+        if (focusChange === 'focusFieldButton') {
+            this.fieldButtonElement.focus();
+        }
+    }
+    updateValue(newValue) {
+        if (this.value !== newValue) {
+            this.value = newValue;
+            simulateNativeEvent(this.root, 'input');
+            simulateNativeEvent(this.root, 'change');
+        }
+        this.collapseListbox('focusFieldButton');
+    }
+    renderTargetDisplay() {
+        const selectedListboxOptionElement = this.getOptionElementByValue(this.value);
+        if (selectedListboxOptionElement) {
+            return (h("div", { class: "gux-selected-option" }, this.renderSelectedItem(selectedListboxOptionElement)));
+        }
+        return (h("div", { class: "gux-placeholder" }, this.placeholder || this.i18n('noSelection')));
+    }
+    /**
+     * Renders the selection display for the selected item. This function needs a branch to handle
+     * each type defined in GuxDropdownOptionType
+     *
+     * @param item The selected item. This can be any of the node types defined in GuxDropdownOptionType.
+     * @returns Rendered selection details.
+     */
+    renderSelectedItem(item) {
+        const tag = item.tagName.toLowerCase();
+        switch (tag) {
+            case 'gux-option':
+                return this.renderOption(item);
+            case 'gux-option-icon':
+                return this.renderIconOption(item);
+            case 'gux-option-status-beta':
+                return this.renderStatusOption(item);
+            default:
+                // eslint-disable-next-line no-case-declarations
+                const _exhaustiveCheck = tag;
+                return _exhaustiveCheck;
+        }
+    }
+    renderOption(option) {
+        let optionText = option.textContent;
+        if (hasSlot(option, 'subtext')) {
+            const subtext = option.querySelector('[slot=subtext]');
+            optionText = optionText.substring(0, optionText.length - subtext.textContent.length);
+        }
+        return (h("gux-truncate", { ref: el => (this.truncateElement = el), dir: "auto" }, optionText));
+    }
+    renderIconOption(iconOption) {
+        let iconStyle = null;
+        if (iconOption.iconColor !== null) {
+            iconStyle = { color: iconOption.iconColor };
+        }
+        return (h("span", { class: {
+                'gux-selected-icon': true,
+                'gux-icon-position-end': iconOption.iconPosition === 'end'
+            } }, h("gux-icon", { "icon-name": iconOption.iconName, style: iconStyle, decorative: true, size: "small" }), h("gux-truncate", { ref: el => (this.truncateElement = el) }, iconOption.textContent)));
+    }
+    renderStatusOption(statusOption) {
+        const optionText = statusOption.textContent;
+        return (h("div", { class: "gux-status-indicator" }, h("span", { class: `gux-status-icon gux-status-icon-${statusOption.accent}` }), h("div", { class: "gux-status-indicator-text" }, optionText)));
+    }
+    renderPopup() {
+        return (h("slot", { slot: "popup" }));
+    }
+    renderTarget() {
+        return (h("div", { class: {
+                'gux-target-container-collapsed': true
+            }, slot: "target" }, h("button", { type: "button", class: "gux-field gux-field-button", onClick: this.fieldButtonClick.bind(this), onFocusin: this.showTooltip.bind(this), onFocusout: this.hideTooltip.bind(this), ref: el => (this.fieldButtonElement = el), "aria-haspopup": "listbox", "aria-expanded": this.expanded.toString() }, this.renderTargetContent(), h("gux-icon", { class: {
+                'gux-expand-icon': true
+            }, "screenreader-text": this.i18n('dropdown'), size: "small", iconName: this.expanded
+                ? 'custom/chevron-up-small-regular'
+                : 'custom/chevron-down-small-regular' }))));
+    }
+    renderTargetContent() {
+        return (h("div", { class: "gux-field-content" }, this.renderTargetDisplay()));
+    }
+    render() {
+        return (h("gux-popup", { key: '6f566a720410ee762c917adc41daddd5270fc70c', expanded: this.expanded, inline: true }, this.renderTarget(), this.renderPopup()));
+    }
+    static get delegatesFocus() { return true; }
+    get root() { return getElement(this); }
+    static get watchers() { return {
+        "value": ["watchValue"]
+    }; }
+};
+__decorate([
+    OnClickOutside({ triggerEvents: 'mousedown' })
+], GuxDropdown.prototype, "onClickOutside", null);
+__decorate([
+    OnMutation({ childList: true, subtree: true })
+], GuxDropdown.prototype, "onMutation", null);
+GuxDropdown.style = GuxInlineDropdownBetaStyle0;
+
+export { GuxDropdown as gux_inline_dropdown_beta };

package/dist/esm/gux-label-info-beta.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-1f4f2f77.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 import { g as getSlotTextContent } from './get-slot-text-content-95a85429.js';
 
 const guxLabelInfoCss = ".gux-label-info{inline-size:fit-content;padding:0;line-height:0;background-color:transparent;border:none;border-radius:var(--gse-ui-formControl-label-tooltipTrigger-borderRadius)}.gux-label-info gux-tooltip{padding-inline-start:0}.gux-label-info gux-icon{vertical-align:bottom;color:var(--gse-ui-formControl-label-tooltipTrigger-color)}";
@@ -32,7 +32,7 @@ const GuxLabelInfo = class {
         return await this.tooltipElement.hideTooltip();
     }
     render() {
-        return (h("div", { key: '56d47ce5f2b632072104e8cd5e9367d9abb73097', class: "gux-label-info" }, h("gux-screen-reader-beta", { key: 'a720884b1bb912502416c10087878d16885e6431' }, getSlotTextContent(this.root, 'content')), h("gux-icon", { key: 'd998e3257efcfe68159cd3bbe1ea5fedac6d56f2', "icon-name": this.getVariantIcon(this.variant), size: "small", decorative: true }), h("gux-tooltip-beta", { key: 'bb243c88b2c7ad7217cf88c156f7a7e01617b38c', placement: this.placement, ref: el => (this.tooltipElement = el) }, h("slot", { key: 'c15c6233b298c2f03cb0a6a9d4b6c3d62c062a2a', name: "content" }))));
+        return (h("div", { key: 'b76ff06369ed70fd75e794f96f74be8e3f8a76b5', class: "gux-label-info" }, h("gux-screen-reader-beta", { key: '454ab062488bc37d73fb88b769236ce243cd38f4' }, getSlotTextContent(this.root, 'content')), h("gux-icon", { key: '27713594a6c58c34b262f6eb22605bacc63d8fcd', "icon-name": this.getVariantIcon(this.variant), size: "small", decorative: true }), h("gux-tooltip-beta", { key: 'bf484212d4525b01e8b448ef2b7ff90d7299a4c3', placement: this.placement, ref: el => (this.tooltipElement = el) }, h("slot", { key: 'a3c28acb003422167bc32707208f5539081bbed1', name: "content" }))));
     }
     get root() { return getElement(this); }
 };

package/dist/esm/gux-link-beta.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1f4f2f77.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 import { g as getClosestElement } from './get-closest-element-728b9f18.js';
 
 const guxLinkCss = ":host{padding-block:var(--gse-ui-links-inLine-padding)}:host ::slotted(a){inline-size:fit-content;font-family:var(--gse-ui-links-inLine-medium-text-fontFamily), var(--gse-semantic-theme-fontFamily-body), sans-serif;font-size:var(--gse-ui-links-inLine-medium-text-fontSize);font-weight:var(--gse-ui-links-inLine-medium-text-fontWeight);line-height:var(--gse-ui-links-inLine-medium-text-lineHeight);color:var(--gse-ui-links-default-foregroundColor) !important;border-radius:var(--gse-ui-links-focusOutline-borderRadius) !important}:host ::slotted(a:hover){color:var(--gse-ui-links-hover-foregroundColor) !important}:host ::slotted(a:active){color:var(--gse-ui-links-active-foregroundColor) !important}:host ::slotted(a:visited){color:var(--gse-ui-links-visited-foregroundColor) !important}:host ::slotted(a:focus-visible){outline:var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);outline-offset:var(--gse-semantic-focusOutline-offset)}:host([size=small]) ::slotted(a){font-family:var(--gse-ui-links-inLine-small-text-fontFamily), var(--gse-semantic-theme-fontFamily-body), sans-serif;font-size:var(--gse-ui-links-inLine-small-text-fontSize);font-weight:var(--gse-ui-links-inLine-small-text-fontWeight);line-height:var(--gse-ui-links-inLine-small-text-lineHeight)}:host([standalone]){display:block;padding-block:var(--gse-ui-links-standalone-padding)}:host([standalone]) ::slotted(a){display:flex;gap:var(--gse-ui-links-standalone-gap);align-items:center;inline-size:fit-content;font-family:var(--gse-ui-links-standalone-medium-text-fontFamily), var(--gse-semantic-theme-fontFamily-body), sans-serif;font-size:var(--gse-ui-links-standalone-medium-text-fontSize);font-weight:var(--gse-ui-links-standalone-medium-text-fontWeight);line-height:var(--gse-ui-links-standalone-medium-text-lineHeight);text-decoration:none !important}:host([standalone]) ::slotted(a:hover){font-family:var(--gse-ui-links-standalone-medium-underlinedText-fontFamily), var(--gse-semantic-theme-fontFamily-body), sans-serif;font-size:var(--gse-ui-links-standalone-medium-underlinedText-fontSize);font-weight:var(--gse-ui-links-standalone-medium-underlinedText-fontWeight);line-height:var(--gse-ui-links-standalone-medium-underlinedText-lineHeight);text-decoration:var(--gse-ui-links-standalone-medium-underlinedText-textDecoration) !important}:host([standalone]) ::slotted(a:active){text-decoration:none !important}:host([size=small][standalone]) ::slotted(a){font-family:var(--gse-ui-links-standalone-small-text-fontFamily), var(--gse-semantic-theme-fontFamily-body), sans-serif;font-size:var(--gse-ui-links-standalone-small-text-fontSize);font-weight:var(--gse-ui-links-standalone-small-text-fontWeight);line-height:var(--gse-ui-links-standalone-small-text-lineHeight)}:host([size=small][standalone]) ::slotted(a:hover){font-family:var(--gse-ui-links-standalone-small-underlinedText-fontFamily), var(--gse-semantic-theme-fontFamily-body), sans-serif;font-size:var(--gse-ui-links-standalone-small-underlinedText-fontSize);font-weight:var(--gse-ui-links-standalone-small-underlinedText-fontWeight);line-height:var(--gse-ui-links-standalone-small-underlinedText-lineHeight);text-decoration:var(--gse-ui-links-standalone-small-underlinedText-textDecoration) !important}:host([standalone][class=gux-breadcrumb-link]){padding:0}";
@@ -20,7 +20,7 @@ const GuxLink = class {
         return !!getClosestElement('.gux-breadcrumb-generation', this.root);
     }
     render() {
-        return (h(Host, { key: '996dc79252fa45084deaeab08b443c48af84dd61', size: this.size, standalone: this.standalone, class: { 'gux-breadcrumb-link': this.checkBreadcrumbParent() } }, h("slot", { key: '1732fcfa0f80733efc1d62cdce523e5b070808f1' })));
+        return (h(Host, { key: '9bf00be3f4e8906b91364d00f28a6bd5d2fa2f7e', size: this.size, standalone: this.standalone, class: { 'gux-breadcrumb-link': this.checkBreadcrumbParent() } }, h("slot", { key: '519c3642d33eeac030274ba7d3516d6a6cc6edff' })));
     }
     get root() { return getElement(this); }
 };

package/dist/esm/gux-list-divider.entry.js

@@ -8,7 +8,7 @@ const GuxListDivider = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '47874f242f9441edc3ad4139542262c0cd6e0189', role: "presentation" }));
+        return (h(Host, { key: 'ba070e6345303b885411921d2862a67734bc11b1', role: "presentation" }));
     }
 };
 GuxListDivider.style = GuxListDividerStyle0;

package/dist/esm/gux-list-item.entry.js

@@ -9,7 +9,7 @@ const GuxListItem = class {
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: 'b6fa93d98979ed2916d0a2d0268e57634540f6c6', role: "listitem" }, h("button", { key: '9f5234aeec44769ea23e46d04a6042e8cd78b3b7', type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: '0bce73acc9aba33f936e853e1c3225d9393a8cd3' }))));
+        return (h(Host, { key: 'f55b7ab9bb6afab9f46c88a8c7c0d0f87d20a6ef', role: "listitem" }, h("button", { key: '481088d0eadfecbb2654eb76ad8145127e04f50f', type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: 'd2103640154fef9b2320a1d1f20f067e601b3def' }))));
     }
     static get delegatesFocus() { return true; }
     get root() { return getElement(this); }

package/dist/esm/gux-list.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-1f4f2f77.js';
 import { l as last, n as next, f as first, p as previous, b as byId, c as byClosestId } from './gux-list.service-5da368db.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 
 const guxListCss = ":host{display:flex;flex-direction:column;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;padding:var(--gse-ui-menu-padding)}";
 const GuxListStyle0 = guxListCss;
@@ -53,7 +53,7 @@ const GuxList = class {
         last(this.root, validFocusableItems);
     }
     render() {
-        return (h(Host, { key: '82adb429fd4ef3143f82756c5bcf8a0abeb5f3c8', tabindex: "-1", role: "list" }, h("slot", { key: '9089f367dae30117a5d81271a45795cbf72f71b4' })));
+        return (h(Host, { key: '4645a18e635b14651b82d84fde98c61099e12a70', tabindex: "-1", role: "list" }, h("slot", { key: '22a08227bb9ecad9277e0153a362bbad5cdbd7e6' })));
     }
     get root() { return getElement(this); }
 };

package/dist/esm/gux-listbox-multi.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1f4f2f77.js';
-import { b as clearActiveOptions, h as hasActiveOption, s as setInitialActiveOption, d as setLastOptionActive, e as setFirstOptionActive, f as hasPreviousOption, i as setPreviousOptionActive, j as hasNextOption, k as setNextOptionActive, l as actOnActiveOption, m as goToOption, c as convertValueToArray, a as getOptionDefaultSlot, o as onClickedOption } from './gux-listbox.service-1b2f1a6e.js';
+import { d as clearActiveOptions, h as hasActiveOption, s as setInitialActiveOption, e as setLastOptionActive, f as setFirstOptionActive, i as hasPreviousOption, j as setPreviousOptionActive, k as hasNextOption, l as setNextOptionActive, m as actOnActiveOption, n as goToOption, c as convertValueToArray, a as getOptionDefaultSlot, o as onClickedOption } from './gux-listbox.service-250c2b08.js';
 import { b as buildI18nForComponent } from './index-4f1356d9.js';
 import { w as whenEventIsFrom } from './when-event-is-from-2aac15f0.js';
 import { s as simulateNativeEvent } from './simulate-native-event-e0631897.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 import { b as afterNextRender } from './after-next-render-07a41f53.js';
 import './get-closest-element-728b9f18.js';
 

package/dist/esm/{gux-listbox.service-1b2f1a6e.js → gux-listbox.service-250c2b08.js}

@@ -20,7 +20,12 @@ function isOptionGroup(item) {
     return item.tagName === 'GUX-OPTION-GROUP-BETA';
 }
 function isOption(item) {
-    const optionTypes = ['GUX-OPTION', 'GUX-OPTION-ICON', 'GUX-OPTION-MULTI'];
+    const optionTypes = [
+        'GUX-OPTION',
+        'GUX-OPTION-ICON',
+        'GUX-OPTION-MULTI',
+        'GUX-OPTION-STATUS-BETA'
+    ];
     return optionTypes.includes(item.tagName);
 }
 function getFirstSelectedOption(list) {
@@ -150,4 +155,4 @@ function convertValueToArray(value) {
     return value ? value.split(',') : [];
 }
 
-export { getOptionDefaultSlot as a, clearActiveOptions as b, convertValueToArray as c, setLastOptionActive as d, setFirstOptionActive as e, hasPreviousOption as f, getSearchOption as g, hasActiveOption as h, setPreviousOptionActive as i, hasNextOption as j, setNextOptionActive as k, actOnActiveOption as l, goToOption as m, getListOptions as n, onClickedOption as o, matchOption as p, setInitialActiveOption as s };
+export { getOptionDefaultSlot as a, getListOptions as b, convertValueToArray as c, clearActiveOptions as d, setLastOptionActive as e, setFirstOptionActive as f, getSearchOption as g, hasActiveOption as h, hasPreviousOption as i, setPreviousOptionActive as j, hasNextOption as k, setNextOptionActive as l, actOnActiveOption as m, goToOption as n, onClickedOption as o, matchOption as p, setInitialActiveOption as s };

package/dist/esm/gux-loading-message.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-1f4f2f77.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 
 const guxLoadingMessageCss = ":host {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  container-type: inline-size;\n}\n\n.gux-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  max-inline-size: var(--gse-ui-progressAndLoading-loadingState-large-width);\n  color: var(--gse-ui-progressAndLoading-textColor);\n  text-align: center;\n}\n\n@container (width > 400px) {\n  .gux-container .gux-primary-message {\n    margin-block-start: var(--gse-ui-progressAndLoading-large-gap);\n    font-family: var(--gse-ui-progressAndLoading-loadingState-large-header-fontFamily);\n    font-size: var(--gse-ui-progressAndLoading-loadingState-large-header-fontSize);\n    font-weight: var(--gse-ui-progressAndLoading-loadingState-large-header-fontWeight);\n    line-height: var(--gse-ui-progressAndLoading-loadingState-large-header-lineHeight);\n  }\n  .gux-container .gux-additional-guidance {\n    margin-block-start: var(--gse-ui-progressAndLoading-large-gapText);\n    font-family: var(--gse-ui-progressAndLoading-loadingState-large-subheader-fontFamily);\n    font-size: var(--gse-ui-progressAndLoading-loadingState-large-subheader-fontSize);\n    font-weight: var(--gse-ui-progressAndLoading-loadingState-large-subheader-fontWeight);\n    line-height: var(--gse-ui-progressAndLoading-loadingState-large-subheader-lineHeight);\n  }\n}\n@container (width > 200px) and (width <=400px) {\n  .gux-container .gux-primary-message {\n    margin-block-start: var(--gse-ui-progressAndLoading-medium-gap);\n    font-family: var(--gse-ui-progressAndLoading-loadingState-medium-header-fontFamily);\n    font-size: var(--gse-ui-progressAndLoading-loadingState-medium-header-fontSize);\n    font-weight: var(--gse-ui-progressAndLoading-loadingState-medium-header-fontWeight);\n    line-height: var(--gse-ui-progressAndLoading-loadingState-medium-header-lineHeight);\n  }\n  .gux-container .gux-additional-guidance {\n    margin-block-start: var(--gse-ui-progressAndLoading-medium-gapText);\n    font-family: var(--gse-ui-progressAndLoading-loadingState-medium-subheader-fontFamily);\n    font-size: var(--gse-ui-progressAndLoading-loadingState-medium-subheader-fontSize);\n    font-weight: var(--gse-ui-progressAndLoading-loadingState-medium-subheader-fontWeight);\n    line-height: var(--gse-ui-progressAndLoading-loadingState-medium-subheader-lineHeight);\n  }\n}\n@container (width <=200px) {\n  .gux-container .gux-primary-message {\n    margin-block-start: var(--gse-ui-progressAndLoading-small-gap);\n    font-family: var(--gse-ui-progressAndLoading-loadingState-small-header-fontFamily);\n    font-size: var(--gse-ui-progressAndLoading-loadingState-small-header-fontSize);\n    font-weight: var(--gse-ui-progressAndLoading-loadingState-small-header-fontWeight);\n    line-height: var(--gse-ui-progressAndLoading-loadingState-small-header-lineHeight);\n  }\n  .gux-container .gux-additional-guidance {\n    margin-block-start: var(--gse-ui-progressAndLoading-small-gapText);\n    font-family: var(--gse-ui-progressAndLoading-loadingState-small-subheader-fontFamily);\n    font-size: var(--gse-ui-progressAndLoading-loadingState-small-subheader-fontSize);\n    font-weight: var(--gse-ui-progressAndLoading-loadingState-small-subheader-fontWeight);\n    line-height: var(--gse-ui-progressAndLoading-loadingState-small-subheader-lineHeight);\n  }\n}";
 const GuxLoadingMessageStyle0 = guxLoadingMessageCss;
@@ -12,7 +12,7 @@ const GuxLoadingMessage = class {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: '70356553906bdd63057fa0e9c5ad6e715b470f81', class: "gux-container", role: "alert", "aria-live": "assertive" }, h("div", { key: '281eb24bc1f0853d940a0847728bccd75dca5866', class: "gux-progress" }, h("slot", { key: 'a7be4b136d00b4a8c5b2ec81e298d1e95fd4d241', name: "progress" })), h("div", { key: '2b48c115e728d70408a3dbff44d5146270f923df', class: "gux-primary-message" }, h("slot", { key: '14ba47c353fe1dd986eb21641214d8454aaead96', name: "primary-message" })), h("div", { key: '3fb5684b3856f933cac3c1839f5b05e361308f16', class: "gux-additional-guidance" }, h("slot", { key: '62c4adfbe16f3aad8d7139a75ba8b68788ecbc0f', name: "additional-guidance" }))));
+        return (h("div", { key: '70a1f38dabb0b81325300cf8d9b3ac6992b0eda7', class: "gux-container", role: "alert", "aria-live": "assertive" }, h("div", { key: 'd404fed4ae8e9cfc825c0f71c78177a43bd3af9e', class: "gux-progress" }, h("slot", { key: 'cdc6631eda3b12ae30d68de764d5ed6144d61a62', name: "progress" })), h("div", { key: 'a0afed75afb859cbc001b51024323b17be002e18', class: "gux-primary-message" }, h("slot", { key: 'cb0d650c97439f3f17ab25915699a7d3913814e4', name: "primary-message" })), h("div", { key: 'cce443b19801997783ead52f3a8eb56ea9423c7c', class: "gux-additional-guidance" }, h("slot", { key: '6d7a23a11048e128a8cc7382c2b1d7b36b469819', name: "additional-guidance" }))));
     }
     get root() { return getElement(this); }
 };

package/dist/esm/gux-menu-option.entry.js

@@ -42,7 +42,7 @@ const GuxMenuOption = class {
         }
     }
     render() {
-        return (h("button", { key: '9ce49328409af89cd7a1c6b94ac6007b59456824', type: "button", class: "gux-menu-option-button", "aria-haspopup": "false", tabIndex: -1, ref: el => (this.buttonElement = el) }, h("span", { key: '654d588f7bcbf38138ae543c03c3f89cad7102d5', class: "gux-menu-option-button-text" }, h("slot", { key: '2494d0b57c69ee80fd24b52cb97abf74fba868c3' }))));
+        return (h("button", { key: '4b065ce574fe36728b28d769da26d1d5eb7e7143', type: "button", class: "gux-menu-option-button", "aria-haspopup": "false", tabIndex: -1, ref: el => (this.buttonElement = el) }, h("span", { key: '3c8cd5af00d1df520e074b16cde9d787ca43d3d0', class: "gux-menu-option-button-text" }, h("slot", { key: 'f1d189749e2f670e42772f5c48b14e99aacf350b' }))));
     }
     static get formAssociated() { return true; }
     get root() { return getElement(this); }

package/dist/esm/gux-menu.entry.js

@@ -8,7 +8,7 @@ const GuxMenu = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '7e4f1568e688d0b8011da0ff05391e306324fecf', role: "menu" }, h("slot", { key: 'ee2398acd2b5542994a7d142ecf3d5a06b36b66e' })));
+        return (h(Host, { key: '19c52f15d965c7aa60ce0e67ed4abd249a272acf', role: "menu" }, h("slot", { key: '21552d0d24e41b7030f51e69543246d017c2f21a' })));
     }
 };
 GuxMenu.style = GuxMenuStyle0;

package/dist/esm/gux-modal-legacy.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-1f4f2f77.js';
 import { r as randomHTMLId } from './random-html-id-81ac821b.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 
-const guxModalLegacyCss = "::slotted(button:active:enabled){color:var(--gse-ui-links-active-foregroundColor);text-decoration:underline;background:none}slot[name=left-align-buttons]::slotted(:not(button,gux-button)){display:flex;flex-direction:row;gap:var(--gse-ui-modal-buttonBar-gap);align-content:flex-start;align-items:center}:host .gux-modal{position:fixed;inset:0;z-index:var(--gse-semantic-zIndex-modal);display:flex;align-items:center;justify-content:center;color:#2e394c;background:var(--gse-ui-modal-shroudColor)}:host .gux-modal .gux-modal-container{position:relative;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;padding:var(--gse-ui-modal-padding) 0;background:var(--gse-ui-modal-backgroundColor);border:1px solid #b4bccb;border-radius:var(--gse-ui-modal-borderRadius);box-shadow:var(--gse-ui-modal-boxShadow)}:host .gux-modal .gux-modal-container.gux-small{width:var(--gse-ui-modal-small-width);max-height:min(368px, 100vh - 2 * 24px)}:host .gux-modal .gux-modal-container.gux-medium{width:var(--gse-ui-modal-medium-width);max-height:min(640px, 100vh - 2 * 24px)}:host .gux-modal .gux-modal-container.gux-large{width:var(--gse-ui-modal-large-width);max-height:min(640px, 100vh - 2 * 24px)}:host .gux-modal .gux-modal-container.gux-dynamic{max-width:calc(100vw - 48px);max-height:calc(100vh - 48px)}:host .gux-modal .gux-modal-container.gux-dynamic .gux-modal-content{max-height:none}:host .gux-modal .gux-modal-container .gux-modal-header{padding:0 var(--gse-ui-modal-padding);margin:0;font-family:var(--gse-ui-modal-heading-fontFamily);font-size:var(--gse-ui-modal-heading-fontSize);font-weight:var(--gse-ui-modal-heading-fontWeight);line-height:var(--gse-ui-modal-heading-fontFamily);color:var(--gse-ui-modal-headerColor);font-family:var(--gse-semantic-heading-xl-bold-fontFamily), var(--gse-semantic-theme-fontFamily-headings), sans-serif;font-size:var(--gse-semantic-heading-xl-bold-fontSize);line-height:var(--gse-semantic-heading-xl-bold-lineHeight);font-weight:var(--gse-semantic-heading-xl-bold-fontWeight)}:host .gux-modal .gux-modal-container .gux-modal-content{max-height:432px;padding:0 var(--gse-ui-modal-padding);margin-top:var(--gse-ui-modal-gap);margin-bottom:var(--gse-ui-modal-gap);overflow-y:auto}:host .gux-modal .gux-modal-container .gux-modal-content.gux-no-buttons{margin-bottom:0}:host .gux-modal .gux-modal-container .gux-button-footer{display:flex;justify-content:space-between;padding:0 var(--gse-ui-modal-padding)}@media (max-width: 416px){:host .gux-modal .gux-modal-container.gux-small,:host .gux-modal .gux-modal-container.gux-medium,:host .gux-modal .gux-modal-container.gux-large{width:100%;height:100%}}";
+const guxModalLegacyCss = "::slotted(button:active:enabled){color:var(--gse-ui-links-active-foregroundColor);text-decoration:underline;background:none}slot[name=left-align-buttons]::slotted(:not(button,gux-button)){display:flex;flex-direction:row;gap:var(--gse-ui-modal-buttonBar-gap);align-content:flex-start;align-items:center}:host .gux-modal{position:fixed;inset:0;z-index:var(--gse-semantic-zIndex-modal);display:flex;align-items:center;justify-content:center;color:var(--gse-semantic-foreground-container-highEmphasis);background:var(--gse-ui-modal-shroudColor)}:host .gux-modal .gux-modal-container{position:relative;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;padding:var(--gse-ui-modal-padding) 0;background:var(--gse-ui-modal-backgroundColor);border:1px solid var(--gse-semantic-border-container-edges-default);border-radius:var(--gse-ui-modal-borderRadius);box-shadow:var(--gse-ui-modal-boxShadow)}:host .gux-modal .gux-modal-container.gux-small{width:var(--gse-ui-modal-small-width);max-height:min(368px, 100vh - 2 * 24px)}:host .gux-modal .gux-modal-container.gux-medium{width:var(--gse-ui-modal-medium-width);max-height:min(640px, 100vh - 2 * 24px)}:host .gux-modal .gux-modal-container.gux-large{width:var(--gse-ui-modal-large-width);max-height:min(640px, 100vh - 2 * 24px)}:host .gux-modal .gux-modal-container.gux-dynamic{max-width:calc(100vw - 48px);max-height:calc(100vh - 48px)}:host .gux-modal .gux-modal-container.gux-dynamic .gux-modal-content{max-height:none}:host .gux-modal .gux-modal-container .gux-modal-header{padding:0 var(--gse-ui-modal-padding);margin:0;font-family:var(--gse-ui-modal-heading-fontFamily);font-size:var(--gse-ui-modal-heading-fontSize);font-weight:var(--gse-ui-modal-heading-fontWeight);line-height:var(--gse-ui-modal-heading-fontFamily);color:var(--gse-ui-modal-headerColor);font-family:var(--gse-semantic-heading-xl-bold-fontFamily), var(--gse-semantic-theme-fontFamily-headings), sans-serif;font-size:var(--gse-semantic-heading-xl-bold-fontSize);line-height:var(--gse-semantic-heading-xl-bold-lineHeight);font-weight:var(--gse-semantic-heading-xl-bold-fontWeight)}:host .gux-modal .gux-modal-container .gux-modal-content{max-height:432px;padding:0 var(--gse-ui-modal-padding);margin-top:var(--gse-ui-modal-gap);margin-bottom:var(--gse-ui-modal-gap);overflow-y:auto}:host .gux-modal .gux-modal-container .gux-modal-content.gux-no-buttons{margin-bottom:0}:host .gux-modal .gux-modal-container .gux-button-footer{display:flex;justify-content:space-between;padding:0 var(--gse-ui-modal-padding)}@media (max-width: 416px){:host .gux-modal .gux-modal-container.gux-small,:host .gux-modal .gux-modal-container.gux-medium,:host .gux-modal .gux-modal-container.gux-large{width:100%;height:100%}}";
 const GuxModalLegacyStyle0 = guxModalLegacyCss;
 
 const GuxModalLegacy = class {
@@ -44,10 +44,10 @@ const GuxModalLegacy = class {
         const hasModalTitleSlot = this.hasModalTitleSlot();
         const hasFooterButtons = this.hasFooterButtons();
         const titleID = randomHTMLId();
-        return (h("div", { key: '2d18a0bb73e802287f7276f624620318c58cf240', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'f9a6082c0d4472e6cbf484221ed41d287c119683', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '63ce16a375f2d5d374df0efaf65f026333f054f3', class: "gux-modal-header", id: titleID }, h("slot", { key: 'c8c78b89fd771fe39a7bbc513385ee11b7da474e', name: "title" }))), h("gux-dismiss-button", { key: '2b6e4165d02dca606879da5a6dd947dbeef8533c', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: 'b37f23a11378eb9ce1264bd81b79a0726d6eed10', class: {
+        return (h("div", { key: 'b77a732864c86ebcae03af05ae0ef397d4490ed6', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: '5a24f48ac7da1f40bd7d84084e4c8226efbafcb9', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '681568d7abf31705c4a7764e1ff22300532b4719', class: "gux-modal-header", id: titleID }, h("slot", { key: '15de5d20625efa25956d73ad7a271f480144404a', name: "title" }))), h("gux-dismiss-button", { key: 'fe03afc6b74e298513ab2d38b24ede83fb9d8e10', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: '6a29fbab6fd5772f2aac70974108361d32b72cd0', class: {
                 'gux-modal-content': true,
                 'gux-no-buttons': !hasFooterButtons
-            } }, h("p", { key: '30f622b062ed43b6fef5e7e2bbf68ac56bf98730' }, h("slot", { key: 'dc09cef7c9d6ec04ea7a3f896e0e7ddf3ed5cac0', name: "content" }))), hasFooterButtons && (h("div", { key: '6f67c283914532196a52369fb1b84cd4e948f462', class: "gux-button-footer" }, h("div", { key: '3299634c7f06b9e41ee607d383df3bb1b2e7c93b', class: "gux-left-align-buttons" }, h("slot", { key: '3890a90f49ab497b9713f5e20086e5adfdb0cc9c', name: "left-align-buttons" })), h("div", { key: '101d214018e9f8da983b074d5aeaa2c81d096912', class: "gux-right-align-buttons" }, h("slot", { key: '9e353e0aad1df37cfeee2bc944285308294a44c2', name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
+            } }, h("p", { key: '19a127ab0f7e22919908a54a9b5024973c6a38c7' }, h("slot", { key: 'bdd59bfa68e9697e0768c81720f030a803cb0e87', name: "content" }))), hasFooterButtons && (h("div", { key: '3e310ebdcadfb4d47d9c97d71f76f12c6faf9fb8', class: "gux-button-footer" }, h("div", { key: 'cc76bed3bacad99b0d41cb053f4849accac87f94', class: "gux-left-align-buttons" }, h("slot", { key: '6b41add8283be84a314a0106836071494ab393b5', name: "left-align-buttons" })), h("div", { key: '18bfaeecfa3e77c2c9fe8759359fd1d51fc048c0', class: "gux-right-align-buttons" }, h("slot", { key: '5cbb524146d92efc70cdfd3ce1efa9c6efb8282e', 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/esm/gux-modal-side-panel-beta.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-1f4f2f77.js';
 import { r as randomHTMLId } from './random-html-id-81ac821b.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 
 const guxModalSidePanelCss = "dialog{inset-inline-start:auto;block-size:100%;min-block-size:100%;padding:0;margin:unset;border:none}dialog::backdrop{background:var(--gse-ui-sidePanel-shroudColor);opacity:var(--gse-ui-sidePanel-shroud-opacity)}slot[name=description]::slotted(*){margin:0;font-family:var(--gse-ui-sidePanel-description-text-fontFamily) !important;font-size:var(--gse-ui-sidePanel-description-text-fontSize) !important;font-weight:var(--gse-ui-sidePanel-description-text-fontWeight) !important;line-height:var(--gse-ui-sidePanel-description-text-lineHeight) !important;color:var(--gse-ui-sidePanel-descriptionColor) !important}";
 const GuxModalSidePanelBetaStyle0 = guxModalSidePanelCss;
@@ -52,7 +52,7 @@ const GuxModalSidePanel = class {
     }
     render() {
         const titleID = randomHTMLId();
-        return (h("dialog", { key: 'eea0c737e4c43a0d621fee32ff4dad60bd784151', ref: el => (this.dialogElement = el), "aria-labelledby": titleID }, h("gux-side-panel-beta", { key: '11156f4073f0db092f01db1175fa3ca7c91d60a8', size: this.size }, h("div", { key: 'ea76626936c93f966c7593f3040a165f8a540359', slot: "heading", id: titleID }, h("slot", { key: '436910dde97d5b06676c8b16d2f727d371dbf9a5', name: "heading" })), hasSlot(this.root, 'description') && (h("div", { key: 'f251f7fff64fbcc70d69d0e9a6ac107cc02b619b', slot: "description" }, h("slot", { key: 'f8bf46aa948c66e33a18b5b1cee6243f98085b0c', name: "description" }))), h("div", { key: '6951c9381dd820845cb677742ab4901bd43b9504', slot: "content" }, h("slot", { key: 'fce1aac4a2799c90cfa2a0d26116f48c13563117', name: "content" })), h("div", { key: 'b0497481f705825507f461acaaf8eefc8f8e7959', slot: "footer" }, h("slot", { key: 'd7c224fd5279bb3ecf749a0610f71313061a5be1', name: "footer" })))));
+        return (h("dialog", { key: '5942094702a7d5bae430507f6e09e9a630253996', ref: el => (this.dialogElement = el), "aria-labelledby": titleID }, h("gux-side-panel-beta", { key: 'cb9581b8714a4f91a478dbbfb3059230905ff641', size: this.size }, h("div", { key: 'a7febca3dcd0efdcb29cd7406171690dfcd0976b', slot: "heading", id: titleID }, h("slot", { key: 'a2a77354ae8689e446e9e5c314f5c9344e8c5bbc', name: "heading" })), hasSlot(this.root, 'description') && (h("div", { key: '4f5db854a6b9680ed2b75198785971a2d83491c6', slot: "description" }, h("slot", { key: '7df7f2873a7bb805d544efa75998559c30e24ce4', name: "description" }))), h("div", { key: 'b8034484bf051d7a701545655b51b599397833cd', slot: "content" }, h("slot", { key: 'b98853b74adac243248fbb13939b6270c3dafa62', name: "content" })), h("div", { key: '2a15fcdba494b6aacb3faf341ef8239a64bc37c5', slot: "footer" }, h("slot", { key: '18e176956b6c3c0df2ee425d21ed004dc91ab5f1', name: "footer" })))));
     }
     get root() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/gux-modal.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-1f4f2f77.js';
 import { r as randomHTMLId } from './random-html-id-81ac821b.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 import { h as hasSlot } from './has-slot-f24a46a6.js';
 
 const guxModalCss = "::slotted(button:active:enabled){color:var(--gse-ui-links-active-foregroundColor);text-decoration:underline;background:none}slot[name=start-align-buttons]::slotted(:not(button,gux-button-slot)){display:flex;flex-direction:row;gap:var(--gse-ui-modal-buttonBar-gap);align-content:flex-start;align-items:center}:host dialog{box-sizing:border-box;justify-content:space-between;padding:0;overflow:hidden;background-color:var(--gse-ui-modal-backgroundColor);border:none;border-radius:var(--gse-ui-modal-borderRadius);box-shadow:var(--gse-ui-modal-boxShadow)}:host dialog::backdrop{background:var(--gse-ui-modal-shroudColor)}:host dialog .gux-modal-container{display:flex;flex-direction:column}:host dialog .gux-modal-container.gux-small{inline-size:var(--gse-ui-modal-small-width);max-block-size:min(368px, 100vh - 2 * 24px)}:host dialog .gux-modal-container.gux-medium{inline-size:min(var(--gse-ui-modal-medium-width), 100vw - 48px);max-block-size:min(640px, 100vh - 2 * 24px)}:host dialog .gux-modal-container.gux-large{inline-size:min(var(--gse-ui-modal-large-width), 100vw - 48px);max-block-size:min(640px, 100vh - 2 * 24px)}:host dialog .gux-modal-container.gux-dynamic{max-inline-size:calc(100vw - 48px);max-block-size:calc(100vh - 48px)}:host dialog .gux-modal-container.gux-dynamic .gux-modal-content{max-block-size:none}:host dialog .gux-modal-container .gux-modal-header{padding-block-start:var(--gse-ui-modal-padding);padding-inline:var(--gse-ui-modal-padding);margin:0;font-family:var(--gse-ui-modal-heading-fontFamily);font-size:var(--gse-ui-modal-heading-fontSize);font-weight:var(--gse-ui-modal-heading-fontWeight);line-height:var(--gse-ui-modal-heading-lineHeight);color:var(--gse-ui-modal-headerColor)}:host dialog .gux-modal-container .gux-modal-content{max-block-size:432px;padding-inline:var(--gse-ui-modal-padding);margin-block-start:var(--gse-ui-modal-gap);overflow-y:auto;color:var(--gse-semantic-foreground-container-highEmphasis)}:host dialog .gux-modal-container .gux-button-footer{display:flex;justify-content:space-between;padding-block-end:var(--gse-ui-modal-padding);padding-inline:var(--gse-ui-modal-padding);margin-block-start:var(--gse-ui-modal-gap)}:host dialog .gux-modal-container .gux-button-footer.gux-no-buttons{display:none}:host dialog .gux-modal-container footer{padding-block-end:var(--gse-ui-modal-padding);padding-inline:var(--gse-ui-modal-padding);margin-block-start:var(--gse-ui-modal-gap)}@media (max-width: 416px){:host dialog .gux-modal-container.gux-small,:host dialog .gux-modal-container.gux-medium,:host dialog .gux-modal-container.gux-large{inline-size:100%;block-size:100%}}";
@@ -82,7 +82,7 @@ const GuxModal = class {
     render() {
         const hasModalTitleSlot = this.hasModalTitleSlot();
         const titleID = randomHTMLId();
-        return (h("dialog", { key: 'bab5ac656e94ff0937fd128c414ed9f1cae8b46c', onClose: this.onCloseHandler.bind(this), ref: el => (this.dialogElement = el), "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'b6080248a5a89f5c9e8cb5110358b65d6ef043d0', class: `gux-modal-container gux-${this.size}` }, h("gux-dismiss-button", { key: 'd28c34313e211024a1ad97a4b3be79bcedf52437', onClick: this.onDismissHandler.bind(this) }), hasModalTitleSlot && this.renderTitle(titleID), h("div", { key: '8ef94027f690c637df01edcc97639cb28b12f013', class: "gux-modal-content" }, h("p", { key: 'c3055a822887fa16f11fa3d38747b116dd26ea90' }, h("slot", { key: '951d14406c48af76ba8bc0efd277eabc7a0744b7', name: "content" }))), this.renderFooter())));
+        return (h("dialog", { key: '4b61b7e4e7c9d059732c1933f9784dda0e90cdbe', onClose: this.onCloseHandler.bind(this), ref: el => (this.dialogElement = el), "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: '66a7ac7efa0210ead6e402bf7420380439e03373', class: `gux-modal-container gux-${this.size}` }, h("gux-dismiss-button", { key: '46161b5e3471dbe6f9575e4077ab4c6a20d68bfc', onClick: this.onDismissHandler.bind(this) }), hasModalTitleSlot && this.renderTitle(titleID), h("div", { key: 'a3598b51fe5ed50f1754e0d1d9b745dac6d8210e', class: "gux-modal-content" }, h("p", { key: '4ea4feae5814a7cd369f2588b0604766cb0c0c9e' }, h("slot", { key: 'd68607a3d8b03f2ad152b5f978f923b0a2f20ee7', name: "content" }))), this.renderFooter())));
     }
     renderTitle(titleID) {
         return (h("h1", { class: "gux-modal-header", id: titleID }, h("slot", { name: "title" })));

package/dist/esm/gux-month-calendar.entry.js

@@ -173,7 +173,7 @@ const GuxMonthCalendar = class {
         return (h("gux-month-list", null, monthButtons));
     }
     render() {
-        return (h("div", { key: '6e159334e362c87889cf465e6bde266b303f9a53', class: {
+        return (h("div", { key: '783ca1adbd1aceb9d82973da550d3b97fbea1411', class: {
                 'gux-hidden': !this.expanded,
                 'gux-month-calendar': true
             } }, this.renderHeader(), this.renderMonths()));

package/dist/esm/gux-month-list_2.entry.js

@@ -43,7 +43,7 @@ const GuxMonthList = class {
         first(this.root, validFocusableItems);
     }
     render() {
-        return (h(Host, { key: '532a418da8953f9781ce344f364c151173ad3416', role: "list" }, h("slot", { key: '12b8a2ffd6b4e462a2a5d53a3ad77bcfacbf36fd' })));
+        return (h(Host, { key: 'b5df0b626c793ae5930ac65714aaaba6a90b1ce8', role: "list" }, h("slot", { key: '9dea65e2038a8f1dc325792ac82e2df1462d5acb' })));
     }
     static get delegatesFocus() { return true; }
     get root() { return getElement(this); }
@@ -75,7 +75,7 @@ const GuxMonthListItem = class {
         }
     }
     render() {
-        return (h(Host, { key: '3df9e758a5cd82c9872b8aa040f79a3af5b4b84a', role: "listitem", value: this.value }, h("div", { key: 'a8e7eecc797fd129218278ab0f4114d409d749cb', class: "gux-container" }, h("button", { key: '9eca92c255e0dd7aa1d12fe8550cdaf933e1d239', class: { 'gux-selected': this.selected }, type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: '915d6dd2d5e2850f1cbac423a2a23c3389853dbb' })))));
+        return (h(Host, { key: '4efcd330bf11de04d4a3d98a53cbe7a1af5add36', role: "listitem", value: this.value }, h("div", { key: '73e87e967f4093114cc6457b1a2226b7eed49c42', class: "gux-container" }, h("button", { key: '56f774cb1d98c724bafb4d01ce095536d8f550d3', class: { 'gux-selected': this.selected }, type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: 'c6c605d5f0b08f3cf3ff25cfc116d05c86b781e6' })))));
     }
     static get delegatesFocus() { return true; }
     get root() { return getElement(this); }

package/dist/esm/gux-month-picker-beta.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-1f4f2f77.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 import { O as OnClickOutside } from './on-click-outside-6c2e399b.js';
 import { b as buildI18nForComponent, g as getDesiredLocale } from './index-4f1356d9.js';
 import { a as determineDisplayLocale } from './intl-93dbfa3b.js';
@@ -212,7 +212,7 @@ const GuxMonthPicker = class {
         return (h("gux-month-calendar", { slot: "popup", ref: (el) => (this.monthCalendarElement = el), onInput: () => this.onMonthCalendarInput(), value: this.value, min: this.min, max: this.max }));
     }
     render() {
-        return (h("gux-popup", { key: '93f458de2b8abca0b8c5d9356cb06450ed93e26f', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
+        return (h("gux-popup", { key: '81b8d5b716a6e5f71250cdb9363e07120398847e', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
     }
     get root() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/gux-notification-toast-legacy.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1f4f2f77.js';
-import { t as trackComponent } from './usage-36c49ec0.js';
+import { t as trackComponent } from './usage-86a3ca46.js';
 
-const guxNotificationToastCss = ":host{position:relative;display:flex;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;width:294px;padding:16px 8px 16px 16px;margin-bottom:4px;color:#2e394c;background:#f6f7f9;border:1px solid #b4bccb;border-color:#b4bccb;border-radius:4px;box-shadow:0 2px 4px rgba(32, 41, 55, 0.24)}.gux-icon{flex:0 1 auto;align-self:auto;order:0;margin:4px}.gux-icon ::slotted(gux-icon){width:24px !important;height:24px !important}.gux-icon.gux-alert{color:#ea0b0b}.gux-icon.gux-warning{color:#ffae00}.gux-icon.gux-positive{color:#3c8527}.gux-icon.gux-neutral{color:#203b73}.gux-content{display:flex;flex:1 1 auto;flex-direction:column;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;align-self:auto;order:0;margin:0 12px 0 8px;color:#2e394c}.gux-content .gux-title,.gux-content .gux-message{flex:1 1 auto;align-self:auto;order:0}.gux-content .gux-title{font-family:var(--gse-semantic-heading-sm-bold-fontFamily), var(--gse-semantic-theme-fontFamily-headings), sans-serif;font-size:var(--gse-semantic-heading-sm-bold-fontSize);line-height:var(--gse-semantic-heading-sm-bold-lineHeight);font-weight:var(--gse-semantic-heading-sm-bold-fontWeight)}";
+const guxNotificationToastCss = ":host{position:relative;display:flex;flex-direction:row;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;width:294px;padding:16px 8px 16px 16px;margin-bottom:4px;color:var(--gse-ui-toast-success-foregroundColor);background:var(--gse-ui-toast-success-backgroundColor);border:1px solid var(--gse-ui-card-default-border-color);border-radius:4px;box-shadow:0 2px 4px rgba(32, 41, 55, 0.24)}.gux-icon{flex:0 1 auto;align-self:auto;order:0;margin:4px}.gux-icon ::slotted(gux-icon){width:24px !important;height:24px !important}.gux-icon.gux-alert{color:var(--gse-ui-toast-error-iconColor)}.gux-icon.gux-warning{color:var(--gse-ui-toast-warning-iconColor)}.gux-icon.gux-positive{color:var(--gse-ui-toast-success-iconColor)}.gux-icon.gux-neutral{color:var(--gse-ui-toast-info-iconColor)}.gux-content{display:flex;flex:1 1 auto;flex-direction:column;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;align-self:auto;order:0;margin:0 12px 0 8px;color:var(--gse-ui-toast-success-foregroundColor)}.gux-content .gux-title,.gux-content .gux-message{flex:1 1 auto;align-self:auto;order:0}.gux-content .gux-title{font-family:var(--gse-semantic-heading-sm-bold-fontFamily), var(--gse-semantic-theme-fontFamily-headings), sans-serif;font-size:var(--gse-semantic-heading-sm-bold-fontSize);line-height:var(--gse-semantic-heading-sm-bold-lineHeight);font-weight:var(--gse-semantic-heading-sm-bold-fontWeight)}";
 const GuxNotificationToastLegacyStyle0 = guxNotificationToastCss;
 
 const GuxNotificationToast = class {
@@ -17,7 +17,7 @@ const GuxNotificationToast = class {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h(Host, { key: '05fb3239ed8a7b3b97cc88b6a613cc8b2669bf6e' }, h("div", { key: 'b5c97740a392fb8bf6dd10dfc17717ba9b236c1f', class: `gux-icon gux-${this.accent}` }, h("slot", { key: 'd8d9b5bdbc05665dee31bd29244870ff07df9078', name: "icon" })), h("div", { key: '2ea8b352598f85ad7747d86b073c96202ae05423', class: "gux-content" }, h("gux-truncate", { key: '780143649c27a9a3df52ba03624923972b20c927', class: "gux-title", "max-lines": 1 }, h("slot", { key: '763979ada598277bd68461c15685570ec37f8f58', name: "title" })), h("gux-truncate", { key: 'a87f67cde3759bcc6fa673580b2e2820ab48ba94', class: "gux-message", "max-lines": 2 }, h("slot", { key: '9c1e1d712dfc9ed9527934474c66b28caf8bb471', name: "message" }))), h("gux-dismiss-button", { key: 'ac4562e6830355aa38569035621936aa7b8bbce2', onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: '5915414bcc468b818b63e6c8aad41742ac018559' }, h("div", { key: '9228e8dcdc3d4c3c0b50c97b6a07aa78a4502769', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '29d9f4b32101e12e8de80f1f0b33de887106ef4d', name: "icon" })), h("div", { key: '9f49449d82064ea163b805306c3dcb12f3124296', class: "gux-content" }, h("gux-truncate", { key: 'b45c29a9d5e13f11770ceb831d9509540fd92ec8', class: "gux-title", "max-lines": 1 }, h("slot", { key: 'c37210ec2f9c967d4c549a686057953c5bd529ec', name: "title" })), h("gux-truncate", { key: '62f5ac015e944a799cb5d297e16808589d68d5a1', class: "gux-message", "max-lines": 2 }, h("slot", { key: 'abcb41009c9a30e8c558514e3a9b9be05045af15', name: "message" }))), h("gux-dismiss-button", { key: '2f15c435e27868efea224a01189a52c3b0a8f586', onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();