@limetech/lime-elements 39.26.0 → 39.28.0

package/dist/collection/components/dock/dock.js

@@ -79,11 +79,11 @@ export class Dock {
         this.resizeObserver.disconnect();
     }
     render() {
-        return (h(Host, { key: '3a859df9c1fb4b56bb1ba18b846a2da353075b0f', class: {
+        return (h(Host, { key: '206ac399202f8fddff9466c329d4de7b595d3f78', class: {
                 dock: true,
                 expanded: this.expanded,
                 'has-mobile-layout': this.useMobileLayout,
-            } }, h("nav", { key: '75303da2b5c8f86a4a6e1be7e76811e3dce8a303', "aria-label": this.accessibleLabel }, this.dockItems.map(this.renderDockItem), this.renderSeparator(), this.dockFooterItems.map(this.renderDockItem)), this.renderExpandShrinkToggle()));
+            } }, h("nav", { key: '6bb724bf6d07c82ff9a36484562d4551e24b1eb7', "aria-label": this.accessibleLabel }, this.dockItems.map(this.renderDockItem), this.renderSeparator(), this.dockFooterItems.map(this.renderDockItem)), this.renderExpandShrinkToggle()));
     }
     renderExpandShrinkToggle() {
         if (this.useMobileLayout || !this.allowResize) {

package/dist/collection/components/drag-handle/drag-handle.js

@@ -51,7 +51,7 @@ export class DragHandleComponent {
     render() {
         const tooltipLabel = translate.get('drag-handle.drag-to-reorder', this.language);
         const ariaLabel = translate.get('drag-handle.drag-handle', this.language);
-        return (h(Host, { key: 'e83ce402fe42d2b8f457e381ace449847333ddc2' }, h("button", { key: '56956b7efc28c4c72a5d2538026495055ed810ff', "data-drag-handle": true, type: "button", class: "limel-drag-handle", tabindex: -1, "aria-label": ariaLabel, id: this.dragHandleId, onClick: this.handleClick }, h("div", { key: 'e51e6c69aeef13b6edd48f46e12e830cfdd3016c', class: "drag-icon", role: "presentation", "aria-hidden": "true" }, h("div", { key: "1" }), h("div", { key: "2" }), h("div", { key: "3" }), h("div", { key: "4" }), h("div", { key: "5" }), h("div", { key: "6" })), h("limel-tooltip", { key: 'ca44d8fe5178e099976c41a517f95ebfff780bcf', openDirection: this.tooltipOpenDirection, elementId: this.dragHandleId, label: tooltipLabel }))));
+        return (h(Host, { key: '73d94aff2fe3748634cf2e81ed9f064e52368da4' }, h("button", { key: '43277535b5759d921a5e02c75c304d12d89d5420', "data-drag-handle": true, type: "button", class: "limel-drag-handle", tabindex: -1, "aria-label": ariaLabel, id: this.dragHandleId, onClick: this.handleClick }, h("div", { key: 'a1f003fd07b139ebd966097ecfd0c8bfad96b3ed', class: "drag-icon", role: "presentation", "aria-hidden": "true" }, h("div", { key: "1" }), h("div", { key: "2" }), h("div", { key: "3" }), h("div", { key: "4" }), h("div", { key: "5" }), h("div", { key: "6" })), h("limel-tooltip", { key: 'd7c11c5bb0a294a9dde74df8aea095efc6ef6f1a', openDirection: this.tooltipOpenDirection, elementId: this.dragHandleId, label: tooltipLabel }))));
     }
     static get is() { return "limel-drag-handle"; }
     static get originalStyleUrls() {

package/dist/collection/components/email-viewer/email-viewer.js

@@ -75,7 +75,7 @@ export class EmailViewer {
         }
     }
     render() {
-        return (h(Host, { key: '675006a3bc305063d7205aef84da1652f0c082f4' }, h("div", { key: '10661de173c5fbac42362c903f1a1a5658e6c9e3', class: "email", part: "email" }, this.renderHeaders(), this.renderRemoteImageBanner(), h("section", { key: 'c8102541316aaf4749cbf298adb5c3c41d9dda47' }, this.renderAttachments(), this.renderBody()))));
+        return (h(Host, { key: 'a2beb0e4d0dadd8e745aff449e07466b6becf725' }, h("div", { key: '1592e35fe27e50b8e81346e9bc02473e8cb495cc', class: "email", part: "email" }, this.renderHeaders(), this.renderRemoteImageBanner(), h("section", { key: 'e9f848430487075e272e25672eb9e032e85d4a59' }, this.renderAttachments(), this.renderBody()))));
     }
     renderHeaders() {
         const headerFields = [

package/dist/collection/components/file/file.js

@@ -89,7 +89,7 @@ export class File {
         };
     }
     render() {
-        return (h(Host, { key: '4b91f02cff596bca5da1a635ce24d2bb8a5154e1' }, h("limel-file-dropzone", { key: 'c3636964ee41bd5396fe667cc983a74256845af5', disabled: this.disabled || this.readonly || !!this.value, accept: this.accept, onFilesSelected: this.handleNewFiles }, this.renderChipset()), this.renderDragAndDropTip()));
+        return (h(Host, { key: '401aab598ccb204e781169a80e6e2d0585c76d8a' }, h("limel-file-dropzone", { key: '1979ee6425b29c7f20e353226c074ff9ed13b233', disabled: this.disabled || this.readonly || !!this.value, accept: this.accept, onFilesSelected: this.handleNewFiles }, this.renderChipset()), this.renderDragAndDropTip()));
     }
     renderDragAndDropTip() {
         if (this.value || this.disabled || this.readonly) {

package/dist/collection/components/file-dropzone/file-dropzone.js

@@ -90,7 +90,7 @@ export class FileDropzone {
         };
     }
     render() {
-        return (h(Host, { key: 'a66ef9c3d9a005567749b61967a63caa4496135a', onDrop: this.handleDrop, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave }, h("slot", { key: '7a770aa9f98365da4b83038662f04c0e9e5c20c6' }), this.renderOnDragLayout()));
+        return (h(Host, { key: '099fe487311b6a593f84f455d278eea2322741d6', onDrop: this.handleDrop, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave }, h("slot", { key: '1e26e166c84e6fbc41c4890427bee228b825d0db' }), this.renderOnDragLayout()));
     }
     static get is() { return "limel-file-dropzone"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/file-input/file-input.js

@@ -71,7 +71,7 @@ export class FileInput {
         this.fileInput = this.element.shadowRoot.getElementById(this.fileInputId);
     }
     render() {
-        return (h(Host, { key: '62d72f49b1a71bef9c5b91c36f34f763a04d78e2', onClick: this.handleClick, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown }, h("input", { key: '72272f710f8ffb09eec2ace7409ab516ec4f80bd', hidden: true, id: this.fileInputId, onChange: this.handleFileChange, type: "file", accept: this.accept, disabled: this.disabled, multiple: this.multiple }), h("slot", { key: '7ecff23ba41d76a23a2b8a542f56044615cb8b24' })));
+        return (h(Host, { key: 'e8f45ab6b7378ea357ae920e99bf137eda289a5e', onClick: this.handleClick, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown }, h("input", { key: 'bcb7df16d5d645892294c7f6e3b38d55a02a2dfe', hidden: true, id: this.fileInputId, onChange: this.handleFileChange, type: "file", accept: this.accept, disabled: this.disabled, multiple: this.multiple }), h("slot", { key: '320bf90892159e3bf3df59b862c8cae7c960bc82' })));
     }
     handleKeyDown(event) {
         if (event.code === 'Tab' ||

package/dist/collection/components/flex-container/flex-container.js

@@ -31,7 +31,7 @@ export class FlexContainer {
         console.warn('limel-flex-container is deprecated, please use CSS instead: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox');
     }
     render() {
-        return h("slot", { key: 'f308350023b1ced85d78be3fe3f2365cb30aeabd' });
+        return h("slot", { key: 'fd157b39594a7aa1a7ac4ee7496c8a89301c8296' });
     }
     static get is() { return "limel-flex-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/form/form.js

@@ -82,7 +82,7 @@ export class Form {
         this.initialized = false;
     }
     render() {
-        return h("div", { key: '56c9180ab3e5b4ee3282db2c38b5eaf522e8c60f', class: "root" });
+        return h("div", { key: '03688903604549430697702a6c65df6c191c93dc', class: "root" });
     }
     reactRender() {
         if (!this.root) {

package/dist/collection/components/grid/grid.js

@@ -12,7 +12,7 @@ export class Grid {
         console.warn('limel-grid is deprecated, please use CSS instead: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout');
     }
     render() {
-        return h("slot", { key: '7248c244edbe50a29b32b327a8317d7be106bd18' });
+        return h("slot", { key: '8ec4bbb25d004dc1aa8106750554d43044635947' });
     }
     static get is() { return "limel-grid"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/header/header.js

@@ -61,7 +61,7 @@ export class Header {
         this.subheadingDivider = '·';
     }
     render() {
-        return (h(Host, { key: '9187592e41befbd12fbef3bb4c8b5cb6bc6bed25' }, h("div", { key: '2a667a272a2e9fc4de7be1708abf34806174c33f', class: "information" }, this.renderIcon(), h("div", { key: '4dac266d2bfd7435f8b31cb1f1f85cf7ea4f66bd', class: "headings" }, h("h1", { key: 'f60ebe3ca473586291c806ce025df8e05a9468c4', class: "heading", title: this.heading }, this.heading), h("h2", { key: '37db047610cf146c8c738dc87911678144e90466', class: "subheading", title: this.subheading }, this.subheading, this.renderSupportingText()))), h("slot", { key: '3bb8cc3adb53bc3ed9216cd568af490ec93a2c96', name: "actions" }, h("slot", { key: '5f3caca6968905f52717c3ffb5c18a097ba7808e' }))));
+        return (h(Host, { key: '7b4bb2afba2edc1aa92f095334d3357ef7d43119' }, h("div", { key: '378af719cf876c5df13b843b411ffedbd11e105b', class: "information" }, this.renderIcon(), h("div", { key: '0cc76fd71596306ba168c06c9eb3ec5a97a9f40f', class: "headings" }, h("h1", { key: 'a8ac4616c41979de148d4a84b26567ea2b484b37', class: "heading", title: this.heading }, this.heading), h("h2", { key: '541fff2f1234da2aef156967715344aec7db48d3', class: "subheading", title: this.subheading }, this.subheading, this.renderSupportingText()))), h("slot", { key: '3eacc9f93ce32d0e28d1cd64363b80080345e2e4', name: "actions" }, h("slot", { key: 'aa627b14a02dd3106e52680bc1e194e5130eaf1c' }))));
     }
     renderIcon() {
         var _a, _b, _c, _d, _e;

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

@@ -19,7 +19,7 @@ export class HelpContent {
         };
     }
     render() {
-        return (h(Host, { key: '6f52a747b64fe7136596a1edb660cd030021f473' }, h("limel-markdown", { key: '7c0913d1a8c39d38f392529ee8fd4a1531aae638', value: this.value }), this.renderReadMoreLink()));
+        return (h(Host, { key: 'd8348566878d1ebc277acd98741b6069a5ba41ae' }, h("limel-markdown", { key: '28a3655258389463093dff17a4c928d8f8e0c6d1', value: this.value }), this.renderReadMoreLink()));
     }
     static get is() { return "limel-help-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/help/help.js

@@ -41,9 +41,9 @@ export class HelpComponent {
         };
     }
     render() {
-        return (h(Host, { key: 'a52d9b4c220e21005011449735b97599cffb542e' }, h("limel-popover", { key: '8b6690894351ec32f5b982ca5d3aeac7300f5576', open: this.isOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, h("button", { key: '98e5dc4abcff54df74b02c737e4889e17639ddc6', slot: "trigger", type: "button", onClick: this.openPopover, class: {
+        return (h(Host, { key: 'bb98d15ffbc75245a879209cd9198237cdb687fa' }, h("limel-popover", { key: '4f508fccb54a611c594b82bdcd0cf371aa449a17', open: this.isOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, h("button", { key: '338edb90b5f181639d96ef9dfcda1bea732ab063', slot: "trigger", type: "button", onClick: this.openPopover, class: {
                 'is-open': this.isOpen,
-            } }, this.trigger), h("limel-help-content", { key: '10b2d483aa459403b3d922add805bf6f64ae66e3', value: this.value, readMoreLink: this.readMoreLink }))));
+            } }, this.trigger), h("limel-help-content", { key: '012a79ec5695adb852f8b8ec98a718e516faf113', value: this.value, readMoreLink: this.readMoreLink }))));
     }
     static get is() { return "limel-help"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/helper-line/helper-line.js

@@ -46,9 +46,9 @@ export class HelperLine {
         };
     }
     render() {
-        return (h(Host, { key: '8ef6eb3b3e372e5dc61af1424a88c1c342023d13', tabIndex: -1, class: {
+        return (h(Host, { key: 'a98bee6c37925cbbf8c27957e61bc94912cecf2f', tabIndex: -1, class: {
                 invalid: this.invalid,
-            }, style: this.hasContent() ? {} : { display: 'none' }, "aria-hidden": !this.hasContent() }, h("div", { key: '3b4e31c23f5964aabb67556e68bd1785c871d934' }, this.renderHelperText(), this.renderCharacterCounter())));
+            }, style: this.hasContent() ? {} : { display: 'none' }, "aria-hidden": !this.hasContent() }, h("div", { key: 'e2f8640001f002c5fcb825a52c8020aa85e40b9c' }, this.renderHelperText(), this.renderCharacterCounter())));
     }
     static get is() { return "limel-helper-line"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/hotkey/hotkey.js

@@ -32,7 +32,7 @@ export class Hotkey {
             .map((p) => p.ariaName)
             .filter(Boolean)
             .join(' ');
-        return (h(Host, { key: 'ab1b9d31080740d19a4633c8c5bc92b02625c111', "aria-label": ariaLabel || undefined }, displayParts.map(({ display, isGlyph }, index) => (h("kbd", { key: `${parts[index]}-${index}`, class: isGlyph ? 'is-glyph' : undefined }, h("span", null, display))))));
+        return (h(Host, { key: '64fe94022e5b3d6fad796b04223408ce4ce8abfd', "aria-label": ariaLabel || undefined }, displayParts.map(({ display, isGlyph }, index) => (h("kbd", { key: `${parts[index]}-${index}`, class: isGlyph ? 'is-glyph' : undefined }, h("span", null, display))))));
     }
     static get is() { return "limel-hotkey"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/icon/icon.js

@@ -12,13 +12,14 @@ import iconCache from "../../global/icon-cache/factory";
  * @exampleComponent limel-example-icon-name
  * @exampleComponent limel-example-icon-size
  * @exampleComponent limel-example-icon-color
+ * @exampleComponent limel-example-icon-svg-class
  */
 export class Icon {
     componentDidLoad() {
         this.loadIcon(this.name);
     }
     render() {
-        return h("div", { key: '23b5f2c90c98461f65c0bcdb291f9958e00ac353', class: "container" });
+        return h("div", { key: '24f5b154eb8ee0229ed1eff823b14bee7f6f0070', class: "container" });
     }
     async loadIcon(name) {
         if (name === undefined || name === '') {
@@ -46,6 +47,25 @@ export class Icon {
         const container = this.host.shadowRoot.querySelector('div.container');
         if (container) {
             container.innerHTML = svgData;
+            // On initial render, only override the SVG's class if the
+            // consumer set `svgClass`. Otherwise leave the SVG's baked-in
+            // class alone — that's the default state stateless icons rely on.
+            if (this.svgClass !== undefined) {
+                this.applySvgClass(this.svgClass);
+            }
+        }
+    }
+    applySvgClass(value) {
+        var _a;
+        const svg = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('svg');
+        if (!svg) {
+            return;
+        }
+        if (value === undefined) {
+            svg.removeAttribute('class');
+        }
+        else {
+            svg.setAttribute('class', value);
         }
     }
     static get is() { return "limel-icon"; }
@@ -125,6 +145,25 @@ export class Icon {
                 "setter": false,
                 "reflect": true,
                 "attribute": "badge"
+            },
+            "svgClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Sets the `class` attribute on the inner `<svg>` element rendered by\nthis component, replacing whatever class the source SVG shipped with.\n\nThis is meant for icons whose SVG file contains internal `<style>`\nblocks with rules that respond to classes \u2014 a single file that ships\nwith multiple visual states selectable via class names. Setting\n`svgClass` is how a consumer reaches across the shadow boundary to\npick which of those states is active.\n\nFor typical stateless icons, this prop has no visible effect."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "svg-class"
             }
         };
     }
@@ -133,6 +172,9 @@ export class Icon {
         return [{
                 "propName": "name",
                 "methodName": "loadIcon"
+            }, {
+                "propName": "svgClass",
+                "methodName": "applySvgClass"
             }];
     }
 }

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

@@ -52,7 +52,7 @@ export class IconButton {
         if (this.host.hasAttribute('tabindex')) {
             buttonAttributes.tabindex = this.host.getAttribute('tabindex');
         }
-        return (h(Host, { key: 'ffea4e0d48339c908b3ae9afc4d3b46922189ad6', onClick: this.filterClickWhenDisabled }, h("button", Object.assign({ key: 'e4689ca52a6c0c81ddb6e9637584fe140846025b', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
+        return (h(Host, { key: '2b7e9fa78a431c534a75cc547e514c37d56fb99d', onClick: this.filterClickWhenDisabled }, h("button", Object.assign({ key: '969e377c71b0e04dc14418b0233a1407e05d1c27', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
     }
     renderIcon() {
         var _a, _b;

package/dist/collection/components/info-tile/info-tile.js

@@ -116,9 +116,9 @@ export class InfoTile {
             this.checkProps((_d = this === null || this === void 0 ? void 0 : this.link) === null || _d === void 0 ? void 0 : _d.title);
         const link = this.disabled ? '#' : (_e = this.link) === null || _e === void 0 ? void 0 : _e.href;
         const rel = getRel((_f = this.link) === null || _f === void 0 ? void 0 : _f.target, (_g = this.link) === null || _g === void 0 ? void 0 : _g.rel);
-        return (h(Host, { key: '3754cadd6c7cf0ee99e0f5dc2234732126dcdc1e', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, class: { 'has-primary-slot-content': this.hasPrimarySlot } }, h("a", { key: 'c812a64253f3687f230c9a306727addae91ac685', title: (_h = this.link) === null || _h === void 0 ? void 0 : _h.title, href: link, target: (_j = this.link) === null || _j === void 0 ? void 0 : _j.target, rel: rel, tabindex: "0", "aria-label": extendedAriaLabel, "aria-disabled": this.disabled, "aria-busy": this.loading ? 'true' : 'false', "aria-live": "polite", class: {
+        return (h(Host, { key: 'a12dddce4afb401b0895bfbe3e8fc14c31d33e8f', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, class: { 'has-primary-slot-content': this.hasPrimarySlot } }, h("a", { key: 'd703439fe830283cfaf3e43cfe40be11359d9485', title: (_h = this.link) === null || _h === void 0 ? void 0 : _h.title, href: link, target: (_j = this.link) === null || _j === void 0 ? void 0 : _j.target, rel: rel, tabindex: "0", "aria-label": extendedAriaLabel, "aria-disabled": this.disabled, "aria-busy": this.loading ? 'true' : 'false', "aria-live": "polite", class: {
                 'is-clickable': !!((_k = this.link) === null || _k === void 0 ? void 0 : _k.href) && !this.disabled,
-            } }, this.renderIcon(), this.renderProgress(), h("slot", { key: '62e330f8b945d562b5ee4677a62ab21ec1b6defe', name: "primary", onSlotchange: this.updateHasPrimarySlotContent }), h("div", { key: 'de41a8bc66d7f706153188f84b96481dfa25f8f9', class: "value-group" }, this.renderPrefix(), h("div", { key: '8ae36080dadd6b4a7135c7280e51a88015f30fbc', class: "value-and-suffix" }, this.renderValue(), this.renderSuffix()), this.renderSpinner()), this.renderLabel(), h("limel-3d-hover-effect-glow", { key: '0221c5e66f2a30b60e619bc7d6fe35e66d1db653' })), this.renderNotification()));
+            } }, this.renderIcon(), this.renderProgress(), h("slot", { key: '5225e11cc2b03040cb9a9208fb0f3967251af1da', name: "primary", onSlotchange: this.updateHasPrimarySlotContent }), h("div", { key: '4151efa75f96d89c660cd17c94a507ddb53e88e3', class: "value-group" }, this.renderPrefix(), h("div", { key: '4af9db956ab1c4670fd9757b9a65ab646f7c4bb3', class: "value-and-suffix" }, this.renderValue(), this.renderSuffix()), this.renderSpinner()), this.renderLabel(), h("limel-3d-hover-effect-glow", { key: '04a5fb2d9dbaeaf6596a9289470fedb971baf138' })), this.renderNotification()));
     }
     checkProps(propValue) {
         return propValue ? propValue + ' ' : '';

package/dist/collection/components/input-field/input-field.js

@@ -588,7 +588,7 @@ export class InputField {
         if (ariaControls) {
             properties['aria-controls'] = ariaControls;
         }
-        return (h(Host, { key: '9d9f875efe46cf089691d76d8ee2ae3962bd7e61' }, h("limel-notched-outline", { key: '8ffe928fde6db049df4b16acdd56c1d0e310c0db', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid || this.isInvalid(), disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasLeadingIcon: !!this.leadingIcon }, h("label", { key: '10ab035f3e6f4259e2e0e09c6e3ba78288155698', slot: "content", class: this.getContainerClassList() }, this.renderLeadingIcon(), this.renderPrefix(), this.renderFormattedNumber(), this.renderInput(properties), this.renderSuffix(), this.renderTextarea(properties), this.renderTrailingLinkOrButton())), this.renderHelperLine(), this.renderAutocompleteList()));
+        return (h(Host, { key: '34d09f71861157cae3b4caa923c0c6c717f746a0' }, h("limel-notched-outline", { key: '6184e68299c829dab64010a244801df550278f1c', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid || this.isInvalid(), disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasLeadingIcon: !!this.leadingIcon }, h("label", { key: '6edebc70941a0a6d3867beb4398a2dd9ccbace03', slot: "content", class: this.getContainerClassList() }, this.renderLeadingIcon(), this.renderPrefix(), this.renderFormattedNumber(), this.renderInput(properties), this.renderSuffix(), this.renderTextarea(properties), this.renderTrailingLinkOrButton())), this.renderHelperLine(), this.renderAutocompleteList()));
     }
     valueWatcher(newValue) {
         if (!this.mdcTextField) {

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

@@ -143,7 +143,7 @@ export class List {
             maxLinesSecondaryText = 1;
         }
         const html = this.listRenderer.render(this.items, this.config);
-        return (h(Host, { key: 'cbe0fda77189118ad3515dc3c4ab02c6cd9bc58a', style: {
+        return (h(Host, { key: 'e757da44c3f4481f3410cf40ab2361f76ebd0a32', style: {
                 '--maxLinesSecondaryText': `${maxLinesSecondaryText}`,
             } }, html));
     }

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

@@ -157,9 +157,9 @@ export class ListItemComponent {
             // also keep for `menuitem` for visual state consistency
             ariaProps['aria-selected'] = this.selected ? 'true' : 'false';
         }
-        return (h(Host, Object.assign({ key: '53571b4a11273ceaaada5eaa7b867fc4ce0385e7', role: this.getHostRole(), class: {
+        return (h(Host, Object.assign({ key: '29af1206ab6cd86e16a8e33a4353ab41802e0e0d', role: this.getHostRole(), class: {
                 'has-primary-component': !!((_a = this.primaryComponent) === null || _a === void 0 ? void 0 : _a.name),
-            } }, ariaProps), this.renderRadioButton(), this.renderCheckbox(), this.renderIcon(), this.renderImage(), this.renderPrimaryComponent(), h("div", { key: 'a42ecf417e353adab3f53086ef379c2782f2fd1f', class: "text" }, this.renderLabel(), this.renderDescription()), this.renderActionMenu(this.actions)));
+            } }, ariaProps), this.renderRadioButton(), this.renderCheckbox(), this.renderIcon(), this.renderImage(), this.renderPrimaryComponent(), h("div", { key: '9758d2cc300f17797d8d279900f091bcb1edbb31', class: "text" }, this.renderLabel(), this.renderDescription()), this.renderActionMenu(this.actions)));
     }
     /**
      * Returns a stable reference for the provided actions array to avoid

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

@@ -22,7 +22,7 @@ export class MenuItemMeta {
         this.showChevron = false;
     }
     render() {
-        return (h(Host, { key: '4341b1cd34952fdd2dc40bc3c4b7eb909646d880' }, this.renderCommandText(), this.renderBadge(), this.renderChevron()));
+        return (h(Host, { key: '6a43a3fe582330918957583bc6d7949578c77167' }, this.renderCommandText(), this.renderBadge(), this.renderChevron()));
     }
     renderCommandText() {
         if (this.hotkey) {

package/dist/collection/components/markdown/markdown.js

@@ -142,7 +142,7 @@ export class Markdown {
         this.cleanupImageIntersectionObserver();
     }
     render() {
-        return (h(Host, { key: '3e247fb8cee298825b5f9330fb30a1a71d634a1a' }, h("div", { key: '5f469a73b6722096ba9f0965355c5d5221753097', id: "markdown", ref: (el) => (this.rootElement = el) })));
+        return (h(Host, { key: '11f47d10f91be0bc34d28442fdaaef0f6ed933b8' }, h("div", { key: '3c17e3eb60e16808752d86ca7ac80cd31fe8eaed', id: "markdown", ref: (el) => (this.rootElement = el) })));
     }
     setupImageIntersectionObserver() {
         if (this.lazyLoadImages) {

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

@@ -58,7 +58,7 @@ export class MasonryLayout {
         const style = {
             height: `${this.containerHeight}rem`,
         };
-        return (h(Host, { key: 'e41aecdf81962515dabef9b872cac4a44facf45d', style: style, class: { 'is-laid-out': this.hasRendered } }, h("slot", { key: '94e9603630597a47bef3861a076fca9a8e90dd3c' })));
+        return (h(Host, { key: '96474303b8e0669127598445ef7b5daf391fa5ca', style: style, class: { 'is-laid-out': this.hasRendered } }, h("slot", { key: '02ad70f00a6863657c3f26a6fb048861752e3c4b' })));
     }
     setupObservers() {
         this.resizeObserver = new ResizeObserver(() => {

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

@@ -579,7 +579,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: 'd911676c80671cb52377c34839ee1b6207ac8cec', class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, h("slot", { key: '05deed61d89abe5eb8ded594e987b5c4355df1d2', ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), h("limel-portal", { key: '957ca9f932788fba43d2b7e81997086fc04dc2b9', visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, h("limel-menu-surface", { key: '70437f2fc4fb50a823f87afd0bbf3b93ae2cce3d', 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: '2addbcfc2cbca1caa57fdb4a427b451f60454ede', class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, h("slot", { key: '333676daa0bc2b081ff01d291d5d3a638005f914', ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), h("limel-portal", { key: '0edcb78babb961011c386df3d014e08863588846', visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, h("limel-menu-surface", { key: 'cba2146082e1576d472814235bae368ff5b546a3', 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: '4740635dd33eb64cccfaa762ae6a51bbff6d8a6f', class: "mdc-menu mdc-menu-surface" }, html);
+        return h("div", { key: '1c044c711555d155c5559f8b787a3bbad09b7526', 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: '730ef068d80ac9e2fd561cd871cca45c16747b56', class: classList, tabindex: "-1" }, h("slot", { key: 'bc02c14a725340086b2c6459f5218242854341b4' })));
+        return (h("div", { key: '254247a3cd25908f96e55028df567663dd4d736a', class: classList, tabindex: "-1" }, h("slot", { key: 'eb7d1042a28585242d212cf40a34018240cb0502' })));
     }
     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: '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())));
+        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())));
     }
     renderLabel() {
         if (!this.label) {