@limetech/lime-elements 39.11.0 → 39.12.0

package/dist/collection/components/masonry-layout/masonry-layout.js

@@ -0,0 +1,267 @@
+import { h, Host } from "@stencil/core";
+/**
+ * A responsive masonry grid layout component.
+ *
+ * This component arranges slotted elements into a masonry-style grid,
+ * where items are placed in the shortest column, resulting in a
+ * Pinterest-like layout with minimal vertical gaps.
+ *
+ * The component uses JavaScript to calculate positions, providing
+ * reliable cross-browser support — unlike CSS-only approaches such as
+ * `columns` or `grid-template-rows: masonry`, which have limited
+ * browser support or produce poor results.
+ *
+ * The number of columns is determined automatically based on the
+ * available width and the minimum column width.
+ *
+ * @exampleComponent limel-example-masonry-layout-basic
+ * @exampleComponent limel-example-masonry-layout-images
+ * @exampleComponent limel-example-masonry-layout-ordered
+ * @slot - Items to arrange in the masonry layout
+ * @beta
+ */
+export class MasonryLayout {
+    constructor() {
+        /**
+         * When `true`, items are placed left-to-right in DOM order.
+         * When `false` (default), items are placed in the shortest column.
+         */
+        this.ordered = false;
+        this.containerHeight = 0;
+        this.hasRendered = false;
+        this.pendingLayoutFrame = null;
+    }
+    onOrderedChange() {
+        this.scheduleLayout();
+    }
+    componentDidLoad() {
+        this.setupObservers();
+        this.layoutItems();
+        this.hasRendered = true;
+    }
+    connectedCallback() {
+        if (this.hasRendered) {
+            this.setupObservers();
+            this.scheduleLayout();
+        }
+    }
+    disconnectedCallback() {
+        var _a, _b, _c;
+        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        (_b = this.mutationObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
+        (_c = this.itemResizeObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
+        if (this.pendingLayoutFrame !== null) {
+            cancelAnimationFrame(this.pendingLayoutFrame);
+        }
+    }
+    render() {
+        const style = {
+            height: `${this.containerHeight}rem`,
+        };
+        return (h(Host, { key: 'e41aecdf81962515dabef9b872cac4a44facf45d', style: style, class: { 'is-laid-out': this.hasRendered } }, h("slot", { key: '94e9603630597a47bef3861a076fca9a8e90dd3c' })));
+    }
+    setupObservers() {
+        this.resizeObserver = new ResizeObserver(() => {
+            this.scheduleLayout();
+        });
+        this.resizeObserver.observe(this.host);
+        this.itemResizeObserver = new ResizeObserver(() => {
+            this.scheduleLayout();
+        });
+        this.mutationObserver = new MutationObserver(() => {
+            this.observeItemSizes();
+            this.scheduleLayout();
+        });
+        this.mutationObserver.observe(this.host, { childList: true });
+        this.observeItemSizes();
+    }
+    observeItemSizes() {
+        var _a;
+        (_a = this.itemResizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        const items = this.getItems();
+        for (const item of items) {
+            this.itemResizeObserver.observe(item);
+        }
+    }
+    getItems() {
+        return [...this.host.children].filter((child) => child instanceof HTMLElement);
+    }
+    getRootFontSize() {
+        return Number.parseFloat(getComputedStyle(document.documentElement).fontSize);
+    }
+    pxToRem(px, rootFontSize) {
+        return px / rootFontSize;
+    }
+    /**
+     * Reads a CSS custom property from the host element and resolves
+     * its value to pixels. Falls back to the provided default if the
+     * property is not set.
+     *
+     * @param property - The CSS custom property name to read.
+     * @param fallback - The fallback CSS value if the property is not set.
+     * @param rootFontSize - The root font size in pixels for rem conversion.
+     */
+    getCssPropertyInPx(property, fallback, rootFontSize) {
+        const value = getComputedStyle(this.host).getPropertyValue(property).trim() ||
+            fallback;
+        const number = Number.parseFloat(value);
+        if (value.endsWith('px')) {
+            return number;
+        }
+        // Assume rem for any other unit (rem is the project standard)
+        return number * rootFontSize;
+    }
+    /**
+     * Debounces layout recalculations using `requestAnimationFrame`
+     * to coalesce multiple observer callbacks into a single layout
+     * pass per frame, avoiding layout thrashing.
+     */
+    scheduleLayout() {
+        if (this.pendingLayoutFrame !== null) {
+            cancelAnimationFrame(this.pendingLayoutFrame);
+        }
+        this.pendingLayoutFrame = requestAnimationFrame(() => {
+            this.pendingLayoutFrame = null;
+            this.layoutItems();
+        });
+    }
+    layoutItems() {
+        const items = this.getItems();
+        if (items.length === 0) {
+            this.containerHeight = 0;
+            return;
+        }
+        const hostWidth = this.host.offsetWidth;
+        if (!hostWidth) {
+            return;
+        }
+        const rootFontSize = this.getRootFontSize();
+        const gapPx = this.getCssPropertyInPx('--masonry-layout-gap', '1rem', rootFontSize);
+        const { columnCount, columnWidth } = this.calculateColumns(hostWidth, gapPx, rootFontSize);
+        const columnHeights = this.positionItems(items, columnCount, columnWidth, gapPx, rootFontSize);
+        const newHeight = this.pxToRem(Math.max(...columnHeights) - gapPx, rootFontSize);
+        if (Math.abs(newHeight - this.containerHeight) > 0.1) {
+            this.containerHeight = newHeight;
+        }
+    }
+    calculateColumns(hostWidth, gapPx, rootFontSize) {
+        const minColumnWidthPx = this.getCssPropertyInPx('--masonry-layout-min-column-width', '12rem', rootFontSize);
+        const columnCount = Math.max(1, Math.floor((hostWidth + gapPx) / (minColumnWidthPx + gapPx)));
+        const columnWidth = (hostWidth - (columnCount - 1) * gapPx) / columnCount;
+        return { columnCount, columnWidth };
+    }
+    /**
+     * Absolutely positions each item into the grid. In ordered mode,
+     * items are placed left-to-right via round-robin. In default mode,
+     * each item is placed in the shortest column for balanced heights.
+     *
+     * @param items - The child elements to position.
+     * @param columnCount - The number of columns in the grid.
+     * @param columnWidth - The width of each column in pixels.
+     * @param gapPx - The gap between items in pixels.
+     * @param rootFontSize - The root font size in pixels for rem conversion.
+     * @returns The cumulative height of each column in pixels.
+     */
+    positionItems(items, columnCount, columnWidth, gapPx, rootFontSize) {
+        const columnHeights = Array.from({ length: columnCount }, () => 0);
+        let index = 0;
+        for (const item of items) {
+            const column = this.ordered
+                ? index % columnCount
+                : columnHeights.indexOf(Math.min(...columnHeights));
+            const x = column * (columnWidth + gapPx);
+            const y = columnHeights[column];
+            item.style.position = 'absolute';
+            item.style.left = `${this.pxToRem(x, rootFontSize)}rem`;
+            item.style.top = `${this.pxToRem(y, rootFontSize)}rem`;
+            item.style.width = `${this.pxToRem(columnWidth, rootFontSize)}rem`;
+            if (!this.hasRendered) {
+                this.staggerFadeIn(item, index);
+            }
+            columnHeights[column] += item.offsetHeight + gapPx;
+            index++;
+        }
+        return columnHeights;
+    }
+    /**
+     * Applies a staggered fade-in transition to an item.
+     * Inline `transition` and `transitionDelay` styles are set
+     * temporarily and cleaned up via a `transitionend` listener
+     * so they don't interfere with the consumer's own transitions.
+     *
+     * The listener filters by `event.target` to avoid reacting to
+     * bubbled events from descendant elements.
+     *
+     * Skipped entirely when `prefers-reduced-motion: reduce` is
+     * active — items become visible instantly via the CSS
+     * `is-laid-out` class instead.
+     *
+     * @param item - The element to fade in.
+     * @param index - The item's position in the list, used to calculate the delay.
+     */
+    staggerFadeIn(item, index) {
+        const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+        if (prefersReducedMotion) {
+            return;
+        }
+        item.style.transition = 'opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1)';
+        item.style.transitionDelay = `${index * 20}ms`;
+        const cleanup = (event) => {
+            if (event.target !== item || event.propertyName !== 'opacity') {
+                return;
+            }
+            item.style.transition = '';
+            item.style.transitionDelay = '';
+            item.removeEventListener('transitionend', cleanup);
+        };
+        item.addEventListener('transitionend', cleanup);
+    }
+    static get is() { return "limel-masonry-layout"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["masonry-layout.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["masonry-layout.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "ordered": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "When `true`, items are placed left-to-right in DOM order.\nWhen `false` (default), items are placed in the shortest column."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "ordered",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "containerHeight": {}
+        };
+    }
+    static get elementRef() { return "host"; }
+    static get watchers() {
+        return [{
+                "propName": "ordered",
+                "methodName": "onOrderedChange"
+            }];
+    }
+}

package/dist/collection/components/menu/menu.js

@@ -557,7 +557,7 @@ export class Menu {
         const cssProperties = this.getCssProperties();
         const dropdownZIndex = getComputedStyle(this.host).getPropertyValue('--dropdown-z-index');
         const menuSurfaceWidth = this.getMenuSurfaceWidth(cssProperties['--menu-surface-width']);
-        return (h("div", { key: '720330cf7d07c491a5a9e58a2567896f5526c45a', class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, h("slot", { key: 'd3db72fa9e12bafbb039e6a94a1052edf64e060e', ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), h("limel-portal", { key: '591f97a745488fbff7eb8fc06b14d2f6e0d21fa6', visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, h("limel-menu-surface", { key: '829a9578894165b28100c4cab519ced0cb7689a0', open: this.open, onDismiss: this.onClose, style: Object.assign(Object.assign({}, cssProperties), { '--menu-surface-width': menuSurfaceWidth, '--limel-menu-surface-display': 'flex', '--limel-menu-surface-flex-direction': 'column' }), class: {
+        return (h("div", { key: '2092a7969b69b03062b4db3188b5c14e63cb20c5', class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, h("slot", { key: 'a6b4e705ec6cf6b77d4a4071faee771b2bb3a86b', ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), h("limel-portal", { key: 'c574ec67d773a18900cd9e85b6df4a7664f1018c', visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, h("limel-menu-surface", { key: '56edb093385ecc773f8a4abb8373b3c98c21f2d4', open: this.open, onDismiss: this.onClose, style: Object.assign(Object.assign({}, cssProperties), { '--menu-surface-width': menuSurfaceWidth, '--limel-menu-surface-display': 'flex', '--limel-menu-surface-flex-direction': 'column' }), class: {
                 'has-grid-layout': this.gridLayout,
             } }, this.renderSearchField(), this.renderBreadcrumb(), this.renderLoader(), this.renderEmptyMessage(), this.renderMenuList()))));
     }

package/dist/collection/components/menu-list/menu-list.js

@@ -88,7 +88,7 @@ export class MenuList {
             iconSize: this.iconSize,
         };
         const html = this.MenuListRenderer.render(this.items, this.config);
-        return h("div", { key: '1c044c711555d155c5559f8b787a3bbad09b7526', class: "mdc-menu mdc-menu-surface" }, html);
+        return h("div", { key: '4740635dd33eb64cccfaa762ae6a51bbff6d8a6f', class: "mdc-menu mdc-menu-surface" }, html);
     }
     itemsChanged() {
         setTimeout(() => {

package/dist/collection/components/menu-surface/menu-surface.js

@@ -105,7 +105,7 @@ export class MenuSurface {
             'mdc-elevation-transition': true,
             'mdc-elevation--z4': true,
         };
-        return (h("div", { key: '254247a3cd25908f96e55028df567663dd4d736a', class: classList, tabindex: "-1" }, h("slot", { key: 'eb7d1042a28585242d212cf40a34018240cb0502' })));
+        return (h("div", { key: '730ef068d80ac9e2fd561cd871cca45c16747b56', class: classList, tabindex: "-1" }, h("slot", { key: 'bc02c14a725340086b2c6459f5218242854341b4' })));
     }
     static get is() { return "limel-menu-surface"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/notched-outline/notched-outline.js

@@ -59,7 +59,7 @@ export class NotchedOutline {
         this.hasFloatingLabel = false;
     }
     render() {
-        return (h("div", { key: '5dd66f7356821043d750963f18ef8f39889e65cc', class: "limel-notched-outline" }, h("slot", { key: '1b2072f7acd112137188b570229470677458ace7', name: "content" }), h("span", { key: '3d1d04a75ff0459b53294a2b2bbb4f15192409cd', class: "limel-notched-outline--outlines", "aria-hidden": "true" }, h("span", { key: '9677d3b3bc1f37e954c3ab2907e98db8b9122466', class: "limel-notched-outline--leading-outline" }), this.renderLabel(), h("span", { key: '62a494be847b2181cdd00f20e50cffbbc121bfd2', class: "limel-notched-outline--trailing-outline" }), this.renderEmptyReadonlyValue())));
+        return (h("div", { key: '075d440c16ca092fd36dfc72b59937d09db55b50', class: "limel-notched-outline" }, h("slot", { key: '5efa4c54ce73c15d7d259d2f8d856be9e40ebc16', name: "content" }), h("span", { key: '2ad07b5b8b404d2ac59b05de0a22e52c77ced6a3', class: "limel-notched-outline--outlines", "aria-hidden": "true" }, h("span", { key: '1f70d37ebf40173162e71b3ca4bd31bf14bf3dec', class: "limel-notched-outline--leading-outline" }), this.renderLabel(), h("span", { key: '0097c9838a78c1972a014faa4f6439f40c6dee66', class: "limel-notched-outline--trailing-outline" }), this.renderEmptyReadonlyValue())));
     }
     renderLabel() {
         if (!this.label) {

package/dist/collection/components/picker/picker.js

@@ -188,7 +188,7 @@ export class Picker {
             props.maxItems = 1;
         }
         return [
-            h("limel-chip-set", Object.assign({ key: 'e20f22b6907ad1d28f8b8c0847e5080faca09b3b', type: "input", inputType: "search", label: this.label, helperText: this.helperText, leadingIcon: this.leadingIcon, value: this.chips, disabled: this.disabled, invalid: this.invalid, delimiter: this.renderDelimiter(), readonly: this.readonly, required: this.required, searchLabel: this.searchLabel, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, clearAllButton: this.multiple && !this.chipSetEditMode }, props)),
+            h("limel-chip-set", Object.assign({ key: '4f760b3049b45f6db36e19fd776479dcef11403f', type: "input", inputType: "search", label: this.label, helperText: this.helperText, leadingIcon: this.leadingIcon, value: this.chips, disabled: this.disabled, invalid: this.invalid, delimiter: this.renderDelimiter(), readonly: this.readonly, required: this.required, searchLabel: this.searchLabel, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, clearAllButton: this.multiple && !this.chipSetEditMode }, props)),
             this.renderDropdown(),
         ];
     }

package/dist/collection/components/popover/popover.js

@@ -127,7 +127,7 @@ export class Popover {
     render() {
         const cssProperties = this.getCssProperties();
         const popoverZIndex = getComputedStyle(this.host).getPropertyValue('--popover-z-index');
-        return (h("div", { key: '53e64435fa661015fbbf2e449890864c8008c329', class: "trigger-anchor" }, h("slot", { key: '85336e8f76377921850ffc7704c7588707c45066', name: "trigger", ref: this.setTriggerRef }), h("limel-portal", { key: 'a40bfde87375a494ac5404911b4b1f058a55becf', visible: this.open, containerId: this.portalId, containerStyle: { 'z-index': popoverZIndex }, openDirection: this.openDirection }, h("limel-popover-surface", { key: '396e369ae3e61a79bfd2f520e05187a6ff85f834', contentCollection: this.host.children, style: cssProperties }))));
+        return (h("div", { key: '7bc94b0e636ab16a04e76947731eb815f9a33e38', class: "trigger-anchor" }, h("slot", { key: 'e35b20eb6e38755cd50f71ada0413efcc79ce9e0', name: "trigger", ref: this.setTriggerRef }), h("limel-portal", { key: '397107a1f1fa9f796f0801da60df81084a0862ea', visible: this.open, containerId: this.portalId, containerStyle: { 'z-index': popoverZIndex }, openDirection: this.openDirection }, h("limel-popover-surface", { key: 'f63f011a8d529a68b535fcbed4685a5bb508dded', contentCollection: this.host.children, style: cssProperties }))));
     }
     globalClickListener(event) {
         const element = event.target;

package/dist/collection/components/popover-surface/popover-surface.js

@@ -8,7 +8,7 @@ export class PopoverSurface {
         this.appendElement();
     }
     render() {
-        return h("div", { key: '72e73b254be6cebbd27332329b10a58210ae0352', class: "limel-popover-surface", tabindex: "0" });
+        return h("div", { key: '2ade664e817c3559b6721f0567736c8942afd2f1', class: "limel-popover-surface", tabindex: "0" });
     }
     appendElement() {
         const portalContainer = this.host.shadowRoot.querySelector('.limel-popover-surface');

package/dist/collection/components/portal/portal.js

@@ -120,7 +120,7 @@ export class Portal {
         }
     }
     render() {
-        return h("slot", { key: 'd6ed0d276afec19ba5ffd4d6a6fcf96937127d6a' });
+        return h("slot", { key: 'c8e7ba60cdab45dd239eae6c9123f673a48e8e22' });
     }
     onVisible() {
         if (!this.container && this.visible) {

package/dist/collection/components/radio-button-group/radio-button-group.js

@@ -37,7 +37,7 @@ export class RadioButtonGroup {
         };
     }
     render() {
-        return (h("limel-list", { key: 'd42e6342d4fd79d34cb2c6a9d25d3dfe577e9a99', items: this.createItems(), type: "radio", badgeIcons: this.badgeIcons, maxLinesSecondaryText: this.maxLinesSecondaryText, onChange: this.handleChange }));
+        return (h("limel-list", { key: '0a68f90122f1e246d966e3b747f0e13bed2c901b', items: this.createItems(), type: "radio", badgeIcons: this.badgeIcons, maxLinesSecondaryText: this.maxLinesSecondaryText, onChange: this.handleChange }));
     }
     createItems() {
         return this.items.map((option) => {

package/dist/collection/components/radio-button-group/radio-button.js

@@ -31,12 +31,12 @@ import { Host, h } from "@stencil/core";
  */
 export class RadioButtonComponent {
     render() {
-        return (h(Host, { key: '64623e09534c5b4e457029cbed4865d97d3cc19e', class: {
+        return (h(Host, { key: 'd198242b1e1a066b38b1d6ddc55fcd8dd7817c36', class: {
                 'boolean-input': true,
                 'radio-button': true,
                 checked: this.checked,
                 disabled: this.disabled,
-            } }, h("input", { key: '4eb816e8031d20bbfa5beb32798e50e5d3747895', type: "radio", id: this.id, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), h("div", { key: '9e7d7db22981a16b4655d7cbcd7c3eb2462a7953', class: "box" }), h("label", { key: '4b2061d351b2d4d03d6e5763bc132be46d146e48', class: "boolean-input-label", htmlFor: this.id }, this.label)));
+            } }, h("input", { key: '7b2a009c5753d4ad9bad3c1ee9d8aa2b1fc30db8', type: "radio", id: this.id, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), h("div", { key: '8eef5a56df7502ec7b6cb1ed84c8b8f0a72cd21c', class: "box" }), h("label", { key: 'bcd0883bf0dbdd307508a47e98402e590167fa00', class: "boolean-input-label", htmlFor: this.id }, this.label)));
     }
     static get is() { return "limel-radio-button"; }
     static get originalStyleUrls() {

package/dist/collection/components/select/select.js

@@ -104,7 +104,7 @@ export class Select {
     }
     render() {
         const dropdownZIndex = getComputedStyle(this.host).getPropertyValue('--dropdown-z-index');
-        return (h(SelectTemplate, { key: '0bc73012998fd97b022c0bdbab31e6806a3ddfd3', id: this.portalId, disabled: this.disabled || this.readonly, readonly: this.readonly, required: this.required, invalid: this.invalid, label: this.label, helperText: this.helperText, value: this.value, options: this.options, onMenuChange: this.handleMenuChange, onNativeChange: this.handleNativeChange, onTriggerPress: this.handleMenuTriggerKeyPress, multiple: this.multiple, isOpen: this.menuOpen, open: this.openMenu, close: this.closeMenu, checkValid: this.checkValid, native: this.isMobileDevice && !this.multiple, dropdownZIndex: dropdownZIndex, anchor: this.getAnchorElement() }));
+        return (h(SelectTemplate, { key: '10e53df1cc7d3e629da0e5b18a96045e4f8e6224', id: this.portalId, disabled: this.disabled || this.readonly, readonly: this.readonly, required: this.required, invalid: this.invalid, label: this.label, helperText: this.helperText, value: this.value, options: this.options, onMenuChange: this.handleMenuChange, onNativeChange: this.handleNativeChange, onTriggerPress: this.handleMenuTriggerKeyPress, multiple: this.multiple, isOpen: this.menuOpen, open: this.openMenu, close: this.closeMenu, checkValid: this.checkValid, native: this.isMobileDevice && !this.multiple, dropdownZIndex: dropdownZIndex, anchor: this.getAnchorElement() }));
     }
     watchOpen(newValue, oldValue) {
         if (this.checkValid) {

package/dist/collection/components/shortcut/shortcut.js

@@ -56,7 +56,7 @@ export class Shortcut {
     render() {
         var _a, _b, _c, _d, _e;
         const rel = getRel((_a = this.link) === null || _a === void 0 ? void 0 : _a.target, (_b = this.link) === null || _b === void 0 ? void 0 : _b.rel);
-        return (h(Host, { key: '68fa485e1c6552337de3e8304dcb14bd2056f3cc', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("a", { key: 'e83e54fcd7776e92938795a2f623e23df14985b0', "aria-disabled": this.disabled, href: (_c = this.link) === null || _c === void 0 ? void 0 : _c.href, target: (_d = this.link) === null || _d === void 0 ? void 0 : _d.target, rel: rel, tabindex: "0", "aria-label": this.getAriaLabel(), title: (_e = this.link) === null || _e === void 0 ? void 0 : _e.title }, h("limel-icon", { key: 'b1aa7fec058ef958c71b0a01fc3c1340e66a0422', name: this.icon }), h("limel-3d-hover-effect-glow", { key: '59132d5f6b5d99f38bba8143a2ff39166dce8648' })), this.renderLabel(), this.renderNotification()));
+        return (h(Host, { key: 'cfca58724948367892595cd9dd49d4482ac61bf3', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("a", { key: 'f13f91fa379319448a95ca0182f61d375636b952', "aria-disabled": this.disabled, href: (_c = this.link) === null || _c === void 0 ? void 0 : _c.href, target: (_d = this.link) === null || _d === void 0 ? void 0 : _d.target, rel: rel, tabindex: "0", "aria-label": this.getAriaLabel(), title: (_e = this.link) === null || _e === void 0 ? void 0 : _e.title }, h("limel-icon", { key: '3d5b929acb6a26081626098f69cd29fb70b42faa', name: this.icon }), h("limel-3d-hover-effect-glow", { key: '05dd83b54485aa7fdbc103e84f50532313e4b8f0' })), this.renderLabel(), this.renderNotification()));
     }
     static get is() { return "limel-shortcut"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/slider/slider.js

@@ -150,9 +150,9 @@ export class Slider {
         if (this.disabled || this.readonly) {
             inputProps.disabled = true;
         }
-        return (h(Host, { key: 'fa9695563f078bdab1707422cad3aaef2610e592', class: this.getContainerClassList() }, h("limel-notched-outline", { key: '8b71ef15e9544a6b346248217c2c2fa8acbba6e7', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasFloatingLabel: true }, h("div", { key: '0327cf7d5295bb1d56e2e34b8dca15cfc3e15c0d', slot: "content" }, h("div", { key: '83fade77119ba9fa1d24ae8fdcd54317648918b3', class: "slider", style: { '--slider-fraction': `${fraction}` } }, h("input", Object.assign({ key: '5181430787abe75b4556923e31ebe8520df977e9', type: "range", min: min, max: max, value: this.displayValue, "aria-labelledby": this.labelId, "aria-describedby": this.helperText
+        return (h(Host, { key: '00987f40cc3a4a7d47a5efec7257acbfcde2df06', class: this.getContainerClassList() }, h("limel-notched-outline", { key: '90d73bb40733a3bd85b0c7d6fb0420f4b48de9e9', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasFloatingLabel: true }, h("div", { key: 'd35d56c074af9c68663a7f2c475794f82cc2f924', slot: "content" }, h("div", { key: '28367643903a7c888eb4c381e498d179afb2374a', class: "slider", style: { '--slider-fraction': `${fraction}` } }, h("input", Object.assign({ key: '9e2f5519e946f39444b21c893fa7c45db769b1d6', type: "range", min: min, max: max, value: this.displayValue, "aria-labelledby": this.labelId, "aria-describedby": this.helperText
                 ? this.helperTextId
-                : undefined, onInput: this.handleInput, onChange: this.handleChange }, inputProps)), h("div", { key: '6ee95d718f1d01e92adcf9592882ed1d32e4ba67', class: "track" }, h("div", { key: 'bba420e41501990bdeb1326e59e6eff57000848d', class: "active" }), this.renderStepDots(min, max)), h("div", { key: '46e5a45adbda4e1a650d01408c3d228f1c6be68d', class: "thumb" }, h("div", { key: 'eeba995f52ff3291e2e7818528b05c7c1dec1b32', class: "knob" }), h("div", { key: 'd0321459ed22c6870d939da54df43fe2bfef6333', class: "indicator", "aria-hidden": "true" }, this.displayValue))), h("div", { key: 'bcc4449d7605343fd64f4b89b50c8e5d665f6937', class: "range-labels" }, h("span", { key: '301c78b1640551fe814ad3b2768bb40f9b682b39', class: "min" }, this.multiplyByFactor(this.valuemin), this.unit), h("span", { key: '7f8d741f63030b6f8e88231e5215448b815bf3ca', class: "max" }, this.multiplyByFactor(this.valuemax), this.unit)))), this.renderHelperLine()));
+                : undefined, onInput: this.handleInput, onChange: this.handleChange }, inputProps)), h("div", { key: '58525aba7ff932188e1395a71f43a5b3a448cfcc', class: "track" }, h("div", { key: '4e4c6f0eb6fea869a9e204c79adb8ca2c481f566', class: "active" }), this.renderStepDots(min, max)), h("div", { key: '326cefe13667b61450ed270fee96ec6bca479fa6', class: "thumb" }, h("div", { key: '716621ccf495c5f9ec27758b62d5f15b9995cf06', class: "knob" }), h("div", { key: '110c06b6803a4120ee1c613880b2ea8243702c89', class: "indicator", "aria-hidden": "true" }, this.displayValue))), h("div", { key: '0c82e7f841b39be2380a450898c231c37282e502', class: "range-labels" }, h("span", { key: '40088f1c268470bc585f5dbcf92f479641a6c2e0', class: "min" }, this.multiplyByFactor(this.valuemin), this.unit), h("span", { key: '8375f191def455fb3967209d18d839ada677c477', class: "max" }, this.multiplyByFactor(this.valuemax), this.unit)))), this.renderHelperLine()));
     }
     watchValue() {
         this.displayValue = this.multiplyByFactor(this.getValue());

package/dist/collection/components/snackbar/snackbar.js

@@ -121,14 +121,14 @@ export class Snackbar {
         }
     }
     render() {
-        return (h("aside", { key: '0c9605ecafcab256f9e1b2ac43b72c70695c1719', popover: "manual", style: {
+        return (h("aside", { key: 'f6658fa4fb12f30db4bed68726dfc8a45acb0075', popover: "manual", style: {
                 '--snackbar-timeout': `${Math.max(this.timeout || 0, 0)}ms`,
                 '--snackbar-distance-to-top-edge': `${this.offset}px`,
             }, class: {
                 open: this.open,
                 'is-closing': this.closing,
                 'limel-portal--parent': true,
-            }, id: this.snackbarId, role: this.setAriaRoles(), "aria-atomic": this.open ? 'true' : undefined, "aria-relevant": this.open ? 'additions' : undefined }, h("div", { key: '58b4d6d2f94be604273c46e0babccade357798ab', class: "surface" }, h("div", { key: '148001236225eb6980f3894151e04fd43037863e', class: "label" }, this.message), this.renderActions(this.actionText), this.renderDismissButton(this.dismissible))));
+            }, id: this.snackbarId, role: this.setAriaRoles(), "aria-atomic": this.open ? 'true' : undefined, "aria-relevant": this.open ? 'additions' : undefined }, h("div", { key: '2656ead3fd0b2e1e478229141a5651ed6fbf9c53', class: "surface" }, h("div", { key: '767a77e8558909e5f050715c94e2f72e7f3904e5', class: "label" }, this.message), this.renderActions(this.actionText), this.renderDismissButton(this.dismissible))));
     }
     setAriaRoles() {
         if (!this.open) {

package/dist/collection/components/spinner/spinner.js

@@ -16,7 +16,7 @@ export class Spinner {
         this.limeBranded = false;
     }
     render() {
-        return (h(Host, { key: 'bb72728921dd48ab02cad031e3b35641c92b4dce' }, h("svg", { key: 'fccd59e394e3e4a0101d2e7f903b1b4f9dffc630', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, this.renderSpinner())));
+        return (h(Host, { key: 'b5577d30805f87fcb6f670886ff22af94554d18a' }, h("svg", { key: '895db390ea2b9393d315622ffb9e23b40f036c39', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, this.renderSpinner())));
     }
     renderSpinner() {
         if (!this.limeBranded) {

package/dist/collection/components/split-button/split-button.js

@@ -55,9 +55,9 @@ export class SplitButton {
         };
     }
     render() {
-        return (h(Host, { key: '4ddbc6a1d81d69c50340512ed8a7112b2288fa3e', class: {
+        return (h(Host, { key: '461a17ec679b6f3e17ae9e89d03ebf00b1c28127', class: {
                 'has-menu': this.items.length > 0,
-            }, onClick: this.filterClickWhenDisabled }, h("limel-button", { key: '050586c28af81bc598021a602d4f274afd7a777b', label: this.label, primary: this.primary, icon: this.icon, disabled: this.disabled, loading: this.loading, loadingFailed: this.loadingFailed }), this.renderMenu()));
+            }, onClick: this.filterClickWhenDisabled }, h("limel-button", { key: 'a2493b1f91c1ab1376685f2f9eec5fb8bbc7b1e8', label: this.label, primary: this.primary, icon: this.icon, disabled: this.disabled, loading: this.loading, loadingFailed: this.loadingFailed }), this.renderMenu()));
     }
     static get is() { return "limel-split-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/switch/switch.js

@@ -78,7 +78,7 @@ export class Switch {
         removeEnterClickable(this.host);
     }
     render() {
-        return (h(Host, { key: '4adc29ba50c4e06948efef7b922c0fb70bb58ecb' }, this.readonly
+        return (h(Host, { key: 'dd6c6cb7fabaf8bae143a4787845c56aebf2fe74' }, this.readonly
             ? this.renderReadonly()
             : this.renderInteractive(), this.renderHelperLine()));
     }

package/dist/collection/components/tab-bar/tab-bar.js

@@ -62,11 +62,11 @@ export class TabBar {
         this.tearDown();
     }
     render() {
-        return (h("div", { key: '011bbe3e75ebeb4fefe4942704ef003ad64e92fc', class: "mdc-tab-bar", role: "tablist" }, h("div", { key: '6119888fd94f5ea3d474c1a14016e456ff98923e', class: {
+        return (h("div", { key: '5fcbc5f69907b3437a7c17d18d5356ac45f84ea4', class: "mdc-tab-bar", role: "tablist" }, h("div", { key: '0ec7bac2105ac5a2620379a907fc660344387539', class: {
                 'mdc-tab-scroller': true,
                 'can-scroll-left': this.canScrollLeft,
                 'can-scroll-right': this.canScrollRight,
-            } }, h("div", { key: 'ac46f8471cbdbaec95bed2d5541d6f927eee0fb7', class: "mdc-tab-scroller__scroll-area lime-hide-scrollbars" }, h("div", { key: 'a12f6a5112ff94c5c70a6800972e81998fd51517', class: "mdc-tab-scroller__scroll-content" }, this.tabs.map(this.renderTab))), h("div", { key: '2891ceddace39d210b314c203bdaaf1cf50257da', class: "scroll-fade left" }), h("div", { key: '52d16debe5cba91b876d2c1ebc3fa0b65554193c', class: "scroll-button left" }, h("button", { key: 'a9c6c3bc7027e7dfcfdc999f542911533d2ad97d', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollLeft, onClick: this.handleLeftScrollClick }, h("limel-icon", { key: '6d910230e3e7182c0431508603f97a8da195454f', name: "angle_left" }))), h("div", { key: '47ab1002864f2603fcaee518c5cf8604512a5294', class: "scroll-fade right" }), h("div", { key: 'cebdcc16ed78ecbeafcf4bfbc9e1c59277f3c959', class: "scroll-button right" }, h("button", { key: 'd35caa827d3f4218537f91522cfe1b4b85d0de29', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollRight, onClick: this.handleRightScrollClick }, h("limel-icon", { key: '875ee1bfc8a28a6fbed1d6323974f732f5d3274e', name: "angle_right" }))))));
+            } }, h("div", { key: 'e4bd200335ff91ff6cb6476fef0c30ff90ee1c44', class: "mdc-tab-scroller__scroll-area lime-hide-scrollbars" }, h("div", { key: 'c3f774e3524131d4d42c34eb1884ac95a173422e', class: "mdc-tab-scroller__scroll-content" }, this.tabs.map(this.renderTab))), h("div", { key: 'babdaf65720c52c03cf4bfedee68993ead018e94', class: "scroll-fade left" }), h("div", { key: 'fe06945559ccf14921f523776a15f68f62496804', class: "scroll-button left" }, h("button", { key: '5a6098a7776d635f9aaa9a7f59b4e7024f270ee1', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollLeft, onClick: this.handleLeftScrollClick }, h("limel-icon", { key: '89bdf714b634b0ec7d56d3b1b66961a74999e9e6', name: "angle_left" }))), h("div", { key: 'e7c6d0adb6634015c3482a3787451ffcfa37ee90', class: "scroll-fade right" }), h("div", { key: '97d2229df3f45d495ec59f97ae92c53fa63a5cab', class: "scroll-button right" }, h("button", { key: '1d4c1bf329e8739802faa4040d7438aa4c2056f0', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollRight, onClick: this.handleRightScrollClick }, h("limel-icon", { key: '1bc8b53f7958170c51aac799e05d441e5d6666c7', name: "angle_right" }))))));
     }
     tabsChanged(newTabs = [], oldTabs = []) {
         const newIds = newTabs.map((tab) => tab.id);

package/dist/collection/components/tab-panel/tab-panel.js

@@ -56,7 +56,7 @@ export class TabPanel {
         this.tabs.forEach(this.setTabStatus);
     }
     render() {
-        return (h(Host, { key: 'ebab881a0b0efc36b64c866b58b919890c526525', onChangeTab: this.handleChangeTabs }, h("div", { key: '1417a34aea0af009e44cd91ac8fd425412a2b706', class: "tab-panel" }, h("limel-tab-bar", { key: '5b420eeec41fdd353ba0ba36bb0e475c3fd26821', tabs: this.tabs }), h("div", { key: 'aa3d6f711a824a07eed6f2b5120497dd4218ed7b', class: "tab-content" }, h("slot", { key: '7ba511fa07bd96018e4d8d288d7b1dca572cead0' })))));
+        return (h(Host, { key: 'cc2be22eb941e72c7333ee435d912e55bc38fd20', onChangeTab: this.handleChangeTabs }, h("div", { key: 'a5ea8894f2bb8121320dabf15757ec6d667c3e9d', class: "tab-panel" }, h("limel-tab-bar", { key: '42be419551f9c3e1310de21bb89bab89bd759dee', tabs: this.tabs }), h("div", { key: '13e156b564873aaa4de691bd3cefc703ba7d2f65', class: "tab-content" }, h("slot", { key: 'b48cff50f857f337af2c60a0d7411a6b8860ae3d' })))));
     }
     setSlotElements() {
         const slot = this.getSlot();

package/dist/collection/components/table/table.js

@@ -578,16 +578,16 @@ export class Table {
     render() {
         var _a, _b;
         const totalRows = (_a = this.totalRows) !== null && _a !== void 0 ? _a : this.data.length;
-        return (h(Host, { key: '83aff83d2e82d2b6bb71cca08a0f9532f084edf7', class: {
+        return (h(Host, { key: '9277abb7977cb9acb8b8f4eb89b65d960d5e86c6', class: {
                 'has-low-density': this.layout === 'lowDensity',
                 'has-pagination-on-top': this.paginationLocation === 'top',
-            } }, h("div", { key: '159ef3258158b9987c2023612bc9975163253d91', id: "tabulator-container", class: {
+            } }, h("div", { key: '75386d5a89d461ce2c0c6318ed3c465abb92c8e9', id: "tabulator-container", class: {
                 'has-pagination': totalRows > this.pageSize,
                 'has-aggregation': this.hasAggregation(this.columns),
                 'has-movable-columns': this.movableColumns,
                 'has-rowselector': this.selectable,
                 'has-selection': (_b = this.tableSelection) === null || _b === void 0 ? void 0 : _b.hasSelection,
-            } }, h("div", { key: '74fbcc4af5ee32f05f19987127f1c26c71794cd3', id: "tabulator-loader", style: { display: this.loading ? 'flex' : 'none' } }, h("limel-spinner", { key: 'b9da01750a35d99e2ea2f6ba024c5a3b25ac1aef', size: "large" })), this.renderEmptyMessage(), this.renderSelectAll(), h("div", { key: 'dc3936c5ea3999ded14c4929ad7a03eef11418b1', id: "tabulator-table" }))));
+            } }, h("div", { key: 'e3ab9bf53c9b5f4192ab65c49245bfc5be555940', id: "tabulator-loader", style: { display: this.loading ? 'flex' : 'none' } }, h("limel-spinner", { key: 'ccef86fe3824a5117495e3fb96ea2928217663ce', size: "large" })), this.renderEmptyMessage(), this.renderSelectAll(), h("div", { key: 'cc7c274d6b0f81ac24b5a56467dc38fb204ed306', id: "tabulator-table" }))));
     }
     renderSelectAll() {
         var _a, _b, _c;

package/dist/collection/components/text-editor/link-menu/editor-link-menu.js

@@ -106,9 +106,9 @@ export class TextEditorLinkMenu {
         var _a, _b;
         const isValid = this.isValid(this.link.href);
         return [
-            h("limel-input-field", { key: 'f91dd3a9c03bb52cb91ea0f3251288f5a612cd3a', label: this.getTranslation('editor-link-menu.text'), value: ((_a = this.link) === null || _a === void 0 ? void 0 : _a.text) || '', leadingIcon: "text_cursor", onChange: this.handleLinkTitleChange, onKeyDown: this.handleKeyDown, ref: (el) => (this.textInput = el) }),
-            h("limel-input-field", { key: '1034663268cae0a749397331b43ea44387431c78', label: this.getTranslation('editor-link-menu.link'), value: ((_b = this.link) === null || _b === void 0 ? void 0 : _b.href) || '', type: "text", leadingIcon: "-lime-text-link", trailingIcon: "external_link", invalid: !isValid, onChange: this.handleLinkValueChange, onAction: this.handleLinkInputAction, onKeyDown: this.handleKeyDown }),
-            h("div", { key: '5c4b46deb47d9369a0a59e1e5908934093322755', class: "actions" }, h("limel-button", { key: '62c2dcc49a7907d938a27e2887432caa3e1a75ff', label: this.getTranslation('cancel'), onClick: this.handleCancel }), h("limel-button", { key: '5252752da58d02fd81abef41fc9788a07e277738', primary: true, label: this.getTranslation('save'), disabled: !isValid, onClick: this.handleSave, ref: (el) => (this.saveButton = el), slot: "button" })),
+            h("limel-input-field", { key: '453392d104185e6ad22ee90e204960da0c0f1def', label: this.getTranslation('editor-link-menu.text'), value: ((_a = this.link) === null || _a === void 0 ? void 0 : _a.text) || '', leadingIcon: "text_cursor", onChange: this.handleLinkTitleChange, onKeyDown: this.handleKeyDown, ref: (el) => (this.textInput = el) }),
+            h("limel-input-field", { key: '78c1dcc14cde3e8e6a053560e92fa9828b55d266', label: this.getTranslation('editor-link-menu.link'), value: ((_b = this.link) === null || _b === void 0 ? void 0 : _b.href) || '', type: "text", leadingIcon: "-lime-text-link", trailingIcon: "external_link", invalid: !isValid, onChange: this.handleLinkValueChange, onAction: this.handleLinkInputAction, onKeyDown: this.handleKeyDown }),
+            h("div", { key: '2d77225e278410cb4af77b35ba756f0805f30b8c', class: "actions" }, h("limel-button", { key: 'bf2ad2a86c6231517e18f50a65a41785f5d0c38b', label: this.getTranslation('cancel'), onClick: this.handleCancel }), h("limel-button", { key: 'b86cddda73e5027fb88c0cb36ed784341b1081a7', primary: true, label: this.getTranslation('save'), disabled: !isValid, onClick: this.handleSave, ref: (el) => (this.saveButton = el), slot: "button" })),
         ];
     }
     static get is() { return "limel-text-editor-link-menu"; }

package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.js

@@ -246,7 +246,7 @@ export class ProsemirrorAdapter {
         (_e = this.view) === null || _e === void 0 ? void 0 : _e.destroy();
     }
     render() {
-        return (h(Host, { key: '125d6d80cfc94a3121cde5d121d3cb2a26cf1635', onFocus: this.handleFocus }, h("div", { key: 'eb076afa683c0dfcb57b6688bc94ce1b81ce5710', id: "editor" }), this.renderToolbar(), this.renderLinkMenu()));
+        return (h(Host, { key: 'b7dbbd5a73e68e2df2b52f36f6d57bc0885f87a3', onFocus: this.handleFocus }, h("div", { key: 'a630b7eacb1b5be9460b85944e2a3a5955661437', id: "editor" }), this.renderToolbar(), this.renderLinkMenu()));
     }
     renderToolbar() {
         if (this.actionBarItems.length === 0 || this.ui === 'no-toolbar') {

package/dist/collection/components/text-editor/text-editor.js

@@ -142,7 +142,7 @@ export class TextEditor {
         this.editorId = createRandomString();
     }
     render() {
-        return (h(Host, { key: '31661aea27e0dea61827560c031587bd208f8bed' }, h("limel-notched-outline", { key: '81571a171ba0b629117d8b153e091e6d34c98c70', labelId: this.editorId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasFloatingLabel: true }, this.renderEditor(), this.renderPlaceholder()), this.renderHelperLine()));
+        return (h(Host, { key: 'bde3c6cc9cb0ed28fc72a3749a178b40d8694633' }, h("limel-notched-outline", { key: '344abd4bc6c049085605d9ea74cb942f93b331a6', labelId: this.editorId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasFloatingLabel: true }, this.renderEditor(), this.renderPlaceholder()), this.renderHelperLine()));
     }
     renderEditor() {
         if (this.readonly) {

package/dist/collection/components/tooltip/tooltip-content.js

@@ -18,7 +18,7 @@ export class TooltipContent {
             };
         }
         return [
-            h("text", Object.assign({ key: '14fbfda34a833644fd73cbfabb4e481ab5979c69', class: { 'has-column-layout': isLabelsTextLong } }, props), h("div", { key: '672c23e4d0f992395a422f684436ffb18720bd12', class: "label" }, this.label), h("div", { key: '132cffce86c4cd1a274ffbfd3d0ec1bfb9c3c073', class: "helper-label" }, this.helperLabel)),
+            h("text", Object.assign({ key: 'c19e656075b926d26447a5620a0a779686445129', class: { 'has-column-layout': isLabelsTextLong } }, props), h("div", { key: '3e6c1220fde6121d6da548c48c776cbfbb83f4cd', class: "label" }, this.label), h("div", { key: 'e0dd60dc54481586a4af70a6c133ded3b32bb688', class: "helper-label" }, this.helperLabel)),
         ];
     }
     static get is() { return "limel-tooltip-content"; }

package/dist/collection/components/tooltip/tooltip.js

@@ -78,10 +78,10 @@ export class Tooltip {
     }
     render() {
         const tooltipZIndex = getComputedStyle(this.host).getPropertyValue('--tooltip-z-index');
-        return (h("div", { key: 'ffc3b079a0fcb1a4065c176228d720c64ca57d2e', class: "trigger-anchor" }, h("limel-portal", { key: 'e18fa14f5c328485f6755bc62c402c16d6dd0fd1', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
+        return (h("div", { key: '41e07fbdde2814c108805286e919ac0da916c0f3', class: "trigger-anchor" }, h("limel-portal", { key: '4bb06a6307a3ccb934cc30c76ebde152fb784beb', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
                 'z-index': tooltipZIndex,
                 'pointer-events': 'none',
-            }, anchor: this.ownerElement }, h("limel-tooltip-content", { key: 'cc3a5f98a22082b4e8c2d0ec6bd71d5cf5770c0a', label: this.label, helperLabel: this.helperLabel, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open, id: this.tooltipId }))));
+            }, anchor: this.ownerElement }, h("limel-tooltip-content", { key: 'eb24b1a7df99ef054b4d0108275480568c22eede', label: this.label, helperLabel: this.helperLabel, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open, id: this.tooltipId }))));
     }
     setOwnerAriaLabel() {
         var _a;