@limetech/lime-elements 40.18.2 → 40.19.0

package/dist/cjs/limel-hotkey_4.cjs.entry.js

@@ -132,7 +132,7 @@ const Hotkey = class {
         const parts = hotkeys.tokenizeHotkeyString(this.value);
         const displayParts = parts.map((part) => formatDisplayToken(part, this.isApple));
         const ariaLabel = getHotkeyAriaLabel(this.value, this.isApple);
-        return (index.h(index.Host, { key: '6c2857b3a8827d78ea18379d7338f0e31c3f44a9', "aria-label": ariaLabel || undefined }, displayParts.map(({ display, isGlyph }, index$1) => (index.h("kbd", { key: `${parts[index$1]}-${index$1}`, class: isGlyph ? 'is-glyph' : undefined }, index.h("span", null, display))))));
+        return (index.h(index.Host, { key: '0cf81f7754511dce0358be8ba428e047e6bf6ab5', "aria-label": ariaLabel || undefined }, displayParts.map(({ display, isGlyph }, index$1) => (index.h("kbd", { key: `${parts[index$1]}-${index$1}`, class: isGlyph ? 'is-glyph' : undefined }, index.h("span", null, display))))));
     }
 };
 Hotkey.style = hotkeyCss();
@@ -2004,7 +2004,7 @@ const Portal = class {
         this.showContainer();
     }
     render() {
-        return index.h("slot", { key: '153c97264598d26b0c043075c889ed882bf5e9de' });
+        return index.h("slot", { key: '37784f868a6be293c052c90eaa87b40f97717694' });
     }
     onVisible() {
         if (!this.container && this.visible) {
@@ -2420,10 +2420,10 @@ const Tooltip = class {
     }
     render() {
         const tooltipZIndex = getComputedStyle(this.host).getPropertyValue('--tooltip-z-index');
-        return (index.h("div", { key: 'd3fb680f623403a5951303e4d104c07fc7a21d4e', class: "trigger-anchor" }, index.h("limel-portal", { key: '4050fdb323fce7e7f9953ce76c70e98e92a73eac', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
+        return (index.h("div", { key: '9b893c590d0626f4e7c88f97f14e9c87cb1520d7', class: "trigger-anchor" }, index.h("limel-portal", { key: 'de7ee98705df289e59a034f49daf33823ab6aa86', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
                 'z-index': tooltipZIndex,
                 'pointer-events': 'none',
-            }, anchor: this.ownerElement }, index.h("limel-tooltip-content", { key: '53ca0371e38f9dcb7ea1382fd20e892d4e0e4b72', label: this.label, helperLabel: this.helperLabel, hotkey: this.hotkey, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open }))));
+            }, anchor: this.ownerElement }, index.h("limel-tooltip-content", { key: '83ae108e4c32627527c9962a3f82a2b77ecda873', label: this.label, helperLabel: this.helperLabel, hotkey: this.hotkey, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open }))));
     }
     async updateDescription() {
         if (!this.ownerElement) {
@@ -2495,7 +2495,7 @@ const TooltipContent = class {
         const style = this.maxlength
             ? { '--tooltip-max-width-of-text': `${this.maxlength}ch` }
             : undefined;
-        return (index.h(index.Host, { key: 'f9735b1c49a51e6945014d8a5a23a3e284b53ace', class: { 'has-column-layout': isLabelsTextLong }, style: style }, index.h("div", { key: '12ed325f94deb0788c72e8ce643adce1127af675', class: "label" }, this.label), this.renderHelperLabel(), this.renderHotkey()));
+        return (index.h(index.Host, { key: '05369a8209c96b17763eaa4074c82543f96cd908', class: { 'has-column-layout': isLabelsTextLong }, style: style }, index.h("div", { key: '1bfac9e319921070cc262a74347b9280de12e025', class: "label" }, this.label), this.renderHelperLabel(), this.renderHotkey()));
     }
     renderHelperLabel() {
         if (!this.helperLabel) {

package/dist/cjs/limel-icon-button.cjs.entry.js

@@ -49,7 +49,7 @@ const IconButton = class {
         if (this.host.hasAttribute('tabindex')) {
             buttonAttributes.tabindex = this.host.getAttribute('tabindex');
         }
-        return (index.h(index.Host, { key: 'ecf9bef958b6d3f2666d61c8eb10b6790311706d', onClick: this.filterClickWhenDisabled }, index.h("button", Object.assign({ key: 'fcadafff6a3e2a36082f4baad0c342a448c4126f', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
+        return (index.h(index.Host, { key: '24e71b62ab7e2d038ecc9c8982ffad932ecf89c0', onClick: this.filterClickWhenDisabled }, index.h("button", Object.assign({ key: '435485320ca03a49d4ecce7e45d641e53ccbd107', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
     }
     renderIcon() {
         var _a, _b;

package/dist/cjs/limel-icon.cjs.entry.js

@@ -186,7 +186,7 @@ const Icon = class {
         this.loadIcon(this.name);
     }
     render() {
-        return index.h("div", { key: '68180e22c8eda7efb4a5ca9085ff0dc127052b3f', class: "container" });
+        return index.h("div", { key: '154a32782255d3b6870d1ea67bdf8e8906655c9a', class: "container" });
     }
     updateAccessibility() {
         if (!this.internals) {

package/dist/cjs/limel-info-tile.cjs.entry.js

@@ -116,9 +116,9 @@ const InfoTile = class {
             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 = linkHelper.getRel((_f = this.link) === null || _f === void 0 ? void 0 : _f.target, (_g = this.link) === null || _g === void 0 ? void 0 : _g.rel);
-        return (index.h(index.Host, { key: '4ae5614ddf0ecc7cb112788bd1c42ca4747cf431', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, class: { 'has-primary-slot-content': this.hasPrimarySlot } }, index.h("a", { key: '5cb4cd396a5472c050e5911f54aa0272cf1d324d', 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 (index.h(index.Host, { key: '2d5b3fb9509298316af814acac20bbb1f6c22f85', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, class: { 'has-primary-slot-content': this.hasPrimarySlot } }, index.h("a", { key: '2ce2856cca107671b539b5b462af04c3a9536a39', 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(), index.h("slot", { key: 'd111590fd120c7f4a784430d9f13423e6813d88f', name: "primary", onSlotchange: this.updateHasPrimarySlotContent }), index.h("div", { key: '717a54afb2ffe8c434fdbbe403bbc816ba231fbd', class: "value-group" }, this.renderPrefix(), index.h("div", { key: '569a6cbb516d6c455757c7685d48a2af9692eca2', class: "value-and-suffix" }, this.renderValue(), this.renderSuffix()), this.renderSpinner()), this.renderLabel(), index.h("limel-3d-hover-effect-glow", { key: '2afedffb05ddd550677d943a58564565965194dc' })), this.renderNotification()));
+            } }, this.renderIcon(), this.renderProgress(), index.h("slot", { key: '8cf1cdd2c841a3c30512b390748ec7af9ccaaa06', name: "primary", onSlotchange: this.updateHasPrimarySlotContent }), index.h("div", { key: '4b999b693dd6e882370006edfede8a54488a2873', class: "value-group" }, this.renderPrefix(), index.h("div", { key: '5b06443fe1171e158f78cadb11291501507e16bc', class: "value-and-suffix" }, this.renderValue(), this.renderSuffix()), this.renderSpinner()), this.renderLabel(), index.h("limel-3d-hover-effect-glow", { key: '18c6b6dd3bdaacce430ddd4e2f7dbc65e400b3d0' })), this.renderNotification()));
     }
     checkProps(propValue) {
         return propValue ? propValue + ' ' : '';

package/dist/cjs/limel-list-item.cjs.entry.js

@@ -5,7 +5,7 @@ var getIconProps = require('./get-icon-props-CwpDdQDI.js');
 var randomString = require('./random-string-CFCtFh5l.js');
 var renderListComponent = require('./render-list-component-BtAliHQp.js');
 var checkbox_template = require('./checkbox.template-CNJ29zDR.js');
-var translations = require('./translations-CLSqfR3x.js');
+var translations = require('./translations-CqJEWcfw.js');
 var image_template = require('./image.template-DlF-f23b.js');
 require('./language-v-MMS6ym.js');
 
@@ -131,9 +131,9 @@ const ListItemComponent = class {
             // also keep for `menuitem` for visual state consistency
             ariaProps['aria-selected'] = this.selected ? 'true' : 'false';
         }
-        return (index.h(index.Host, Object.assign({ key: '0ff3eea71319a17641cc264d85ba35c1c8db83c8', role: this.getHostRole(), class: {
+        return (index.h(index.Host, Object.assign({ key: 'fc4d7eab0b57e21d39c7d4fcc5ec7678a4e9662f', 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(), index.h("div", { key: 'e38dc3bb9a09cf08892e7485681a4421a5bdd2ba', class: "text" }, this.renderLabel(), this.renderDescription()), this.renderActionMenu(this.actions)));
+            } }, ariaProps), this.renderRadioButton(), this.renderCheckbox(), this.renderIcon(), this.renderImage(), this.renderPrimaryComponent(), index.h("div", { key: 'bf56c25af2a5f6c0e7ed7ea7b5cd6952888efb61', class: "text" }, this.renderLabel(), this.renderDescription()), this.renderActionMenu(this.actions)));
     }
     /**
      * Returns a stable reference for the provided actions array to avoid

package/dist/cjs/limel-markdown.cjs.entry.js

@@ -1,9 +1,9 @@
 'use strict';
 
 var index$1 = require('./index-BlsqxTB1.js');
-var markdownParser = require('./markdown-parser-BYtTHL4W.js');
+var markdownParser = require('./markdown-parser-toAp9-Eq.js');
 var config = require('./config-dit--4m5.js');
-var index = require('./index-zZvs6xK-.js');
+var index = require('./index-DIiA99Er.js');
 var adaptColorContrast = require('./adapt-color-contrast-h6iwOfZd.js');
 require('./_commonjsHelpers-CFO10eej.js');
 
@@ -1138,7 +1138,7 @@ const Markdown = class {
      */
     async toMarkdown() {
         await this.rendering;
-        const { exportMarkdown } = await Promise.resolve().then(function () { return require('./markdown-exporter-VtX_2D1d.js'); });
+        const { exportMarkdown } = await Promise.resolve().then(function () { return require('./markdown-exporter-BWS2EBxq.js'); });
         return exportMarkdown(this.rootElement, this.cachedCombinedWhitelist);
     }
     textChanged() {
@@ -1193,7 +1193,7 @@ const Markdown = class {
         this.cleanupImageIntersectionObserver();
     }
     render() {
-        return (index$1.h(index$1.Host, { key: '3121124a57e9522dced4b749bfedfbe8dea2ea70' }, index$1.h("div", { key: '6f2b983303c0921a7b979cf0bbbdcc657e7555f8', id: "markdown", ref: (el) => (this.rootElement = el) })));
+        return (index$1.h(index$1.Host, { key: '847bffc9b7fa4fbec42b705d3019c635d88fb6c6' }, index$1.h("div", { key: 'cd84ef0919fc4b2b80090de836366b317e60e51a', id: "markdown", ref: (el) => (this.rootElement = el) })));
     }
     setupImageIntersectionObserver() {
         if (this.lazyLoadImages) {

package/dist/cjs/limel-masonry-layout.cjs.entry.js

@@ -44,7 +44,7 @@ const MasonryLayout = class {
         const style = {
             height: `${this.containerHeight}rem`,
         };
-        return (index.h(index.Host, { key: 'db11d17d15303afcf0d767e085dbe653ab90f9dd', style: style, class: { 'is-laid-out': this.hasRendered } }, index.h("slot", { key: '7a4f2639e7b02720b08b778d437e536ee5707cfa' })));
+        return (index.h(index.Host, { key: '08a40d19c6457ff0d8a1da75de5b3e9379b05999', style: style, class: { 'is-laid-out': this.hasRendered } }, index.h("slot", { key: '736ef2dd358e6fb03daf87fe9b23d4625c5c3d64' })));
     }
     setupObservers() {
         this.resizeObserver = new ResizeObserver(() => {

package/dist/cjs/limel-menu-item-meta.cjs.entry.js

@@ -18,7 +18,7 @@ const MenuItemMeta = class {
         this.showChevron = false;
     }
     render() {
-        return (index.h(index.Host, { key: 'd4bb2de50d260fdf49eafe2449ca388f0369a682' }, this.renderCommandText(), this.renderBadge(), this.renderChevron()));
+        return (index.h(index.Host, { key: '966057ee998af91916099c59398ea93742175fb5' }, this.renderCommandText(), this.renderBadge(), this.renderChevron()));
     }
     renderCommandText() {
         if (this.hotkey) {

package/dist/cjs/limel-pagination-jump.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-BlsqxTB1.js');
-var translations = require('./translations-CLSqfR3x.js');
+var translations = require('./translations-CqJEWcfw.js');
 var keycodes = require('./keycodes-BQ_AERli.js');
 var pagination_util = require('./pagination.util-B5zzH8vg.js');
 require('./language-v-MMS6ym.js');

package/dist/cjs/limel-pagination.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-BlsqxTB1.js');
-var translations = require('./translations-CLSqfR3x.js');
+var translations = require('./translations-CqJEWcfw.js');
 var randomString = require('./random-string-CFCtFh5l.js');
 var language = require('./language-v-MMS6ym.js');
 var pagination_util = require('./pagination.util-B5zzH8vg.js');
@@ -289,7 +289,7 @@ const Pagination = class {
     }
     render() {
         const { slots } = this.view;
-        return (index.h(index.Host, { key: '7d7e26956a5df97a75d2e9d4a8d5b2407b2b65a3' }, index.h("nav", { key: 'e2b6b6a1bb513e3136b6fcc2e34c668be8e64089', "aria-label": this.translate('pagination.label'), "aria-busy": this.loading ? 'true' : null }, this.renderArrow('previous'), slots.map((slot, index) => this.renderSlot(slot, index)), this.renderArrow('next')), index.h("span", { key: '00e74cdbf6ca753b7bac6b4731a5b63c4ac4d338', class: "live-region", "aria-live": "polite" }, this.liveMessage)));
+        return (index.h(index.Host, { key: '924becb588f7d773572b61865b9dd79b14171153' }, index.h("nav", { key: 'f517b62cf0107c912d576f08e9d99594f868be44', "aria-label": this.translate('pagination.label'), "aria-busy": this.loading ? 'true' : null }, this.renderArrow('previous'), slots.map((slot, index) => this.renderSlot(slot, index)), this.renderArrow('next')), index.h("span", { key: '21758520849acfe32f43e86570fe60a040cf2748', class: "live-region", "aria-live": "polite" }, this.liveMessage)));
     }
     /**
      * Without a count we know where the user is but not how far the set goes,

package/dist/cjs/limel-picker.cjs.entry.js

@@ -1,10 +1,11 @@
 'use strict';
 
 var index = require('./index-BlsqxTB1.js');
-var translations = require('./translations-CLSqfR3x.js');
-var dom = require('./dom-BWMDM6En.js');
+var translations = require('./translations-CqJEWcfw.js');
+var liveMessage = require('./live-message-BNl3Ihcz.js');
 var keycodes = require('./keycodes-BQ_AERli.js');
 var randomString = require('./random-string-CFCtFh5l.js');
+var typeahead = require('./typeahead-CnyIjog_.js');
 var getIconProps = require('./get-icon-props-CwpDdQDI.js');
 var debounce = require('./debounce-DgDnRSlt.js');
 require('./language-v-MMS6ym.js');
@@ -13,7 +14,7 @@ require('./toNumber-v-1DEwWD.js');
 require('./isSymbol-DxAVNJfH.js');
 require('./isObjectLike-Dlpn-j-1.js');
 
-const pickerCss = () => `:host{position:relative;display:block}:host([hidden]){display:none}`;
+const pickerCss = () => `@charset "UTF-8";:host{position:relative;display:block}:host([hidden]){display:none}.suggestions-message{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap}`;
 
 const SEARCH_DEBOUNCE = 300;
 const CHIP_SET_TAG_NAME = 'limel-chip-set';
@@ -89,11 +90,13 @@ const Picker = class {
          */
         this.badgeIcons = false;
         this.textValue = '';
+        this.suggestionsEngaged = false;
         this.loading = false;
         this.chips = [];
         // Should NOT be decorated with State(), since this
         // should not trigger a re-render by itself.
         this.chipSetEditMode = false;
+        this.suggestionsMessage = liveMessage.createLiveMessage(() => this.getSuggestionsMessage());
         this.getValueId = (item) => {
             const value = item.value;
             if (!!value && typeof value === 'object') {
@@ -172,8 +175,12 @@ const Picker = class {
         this.chipSet = this.host.shadowRoot.querySelector(CHIP_SET_TAG_NAME);
         this.updateTabIndex();
     }
+    componentDidRender() {
+        this.suggestionsMessage.update();
+    }
     disconnectedCallback() {
         this.debouncedSearch.cancel();
+        this.suggestionsMessage.update.cancel();
     }
     onDisabledChange() {
         this.updateTabIndex();
@@ -193,13 +200,11 @@ const Picker = class {
     }
     render() {
         const props = {};
+        const dropdownContent = this.getDropdownContentList();
         if (!this.multiple) {
             props.maxItems = 1;
         }
-        return [
-            index.h("limel-chip-set", Object.assign({ key: 'eed0789b538bd50638936e1c6ad7e9deaef954ec', 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, language: this.language, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, emptyInputOnChange: false, clearAllButton: this.multiple && !this.chipSetEditMode }, props)),
-            this.renderDropdown(),
-        ];
+        return (index.h(index.Host, { key: 'b8a2414331b89aa646ecdab2a0e5fb9bfce06de4' }, index.h("limel-chip-set", Object.assign({ key: 'bf4fe7ed7973f40c903116cd538f485e3f44881d', 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, language: this.language, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, emptyInputOnChange: false, clearAllButton: this.multiple && !this.chipSetEditMode, suggestionListId: this.canOpenList() ? this.portalId : undefined, suggestionListOpen: this.suggestionsEngaged && dropdownContent.length > 0 }, props)), this.renderPortal(dropdownContent), index.h("span", { key: '3967fc14d3207567c5976c48c1154b96ea3fe285', class: "suggestions-message", "aria-live": "polite", ref: this.suggestionsMessage.setElement })));
     }
     onChangeValue() {
         this.chips = this.createChips(this.value);
@@ -211,27 +216,44 @@ const Picker = class {
         return null;
     }
     /**
-     * Renders the dropdown with the items to pick from, or a spinner if the picker
-     * is waiting for items to be received
+     * Collects what the dropdown shows: the items to pick from, or a spinner
+     * if the picker is waiting for items to be received, and the actions. The
+     * dropdown is open when there is anything to show.
      *
-     * @returns picker dropdown
+     * @returns the pieces of the dropdown
      */
-    renderDropdown() {
+    getDropdownContentList() {
         const dropDownContent = this.getDropdownContent();
         const content = [];
         if (this.shouldShowDropDownContent()) {
             const actionContent = this.getActionContent();
-            if (this.actionPosition === 'top') {
+            if (actionContent && this.actionPosition === 'top') {
                 content.push(actionContent);
             }
             if (dropDownContent) {
                 content.push(dropDownContent);
             }
-            if (this.actionPosition === 'bottom') {
+            if (actionContent && this.actionPosition === 'bottom') {
                 content.push(actionContent);
             }
         }
-        return this.renderPortal(content);
+        return content;
+    }
+    getSuggestionsMessage() {
+        var _a;
+        if (!this.shouldShowDropDownContent()) {
+            return '';
+        }
+        if (this.loading) {
+            return translations.translations.get('loading', this.language);
+        }
+        if (!((_a = this.items) === null || _a === void 0 ? void 0 : _a.length)) {
+            return this.textValue === '' ? '' : this.getEmptyResultMessage();
+        }
+        const count = this.items.filter((item) => !('separator' in item)).length;
+        return count
+            ? translations.translations.get('suggestions.available', this.language, { count })
+            : '';
     }
     getActionContent() {
         var _a, _b;
@@ -245,17 +267,17 @@ const Picker = class {
                     'is-on-top': this.actionPosition === 'top',
                     'is-at-bottom': this.actionPosition === 'bottom',
                     'has-position-sticky': this.actionScrollBehavior === 'sticky',
-                }, badgeIcons: true, type: 'selectable', onChange: this.handleActionListChange, items: this.actions.map(this.removeUnusedPropertiesOnAction) }),
+                }, badgeIcons: true, type: 'selectable', onChange: this.handleActionListChange, onKeyDown: this.onListKeyDown, items: this.actions.map(this.removeUnusedPropertiesOnAction) }),
         ];
     }
     removeUnusedPropertiesOnAction(action) {
         return Object.assign(Object.assign({}, action), { actions: [] });
     }
+    canOpenList() {
+        return !this.readonly && !this.isFull();
+    }
     shouldShowDropDownContent() {
-        if (this.readonly || this.isFull()) {
-            return false;
-        }
-        return !!this.chipSetEditMode;
+        return this.canOpenList() && !!this.chipSetEditMode;
     }
     getDropdownContent() {
         var _a;
@@ -295,11 +317,14 @@ const Picker = class {
                 padding: '1rem 0',
             } }, index.h("limel-spinner", { limeBranded: false })));
     }
-    renderEmptyMessage() {
-        const text = this.emptyResultMessage ||
+    getEmptyResultMessage() {
+        return (this.emptyResultMessage ||
             translations.translations.get('picker.no-matching-results', this.language, {
                 query: this.textValue,
-            });
+            }));
+    }
+    renderEmptyMessage() {
+        const text = this.getEmptyResultMessage();
         const style = {
             color: 'rgb(var(--contrast-1100))',
             textAlign: 'center',
@@ -309,7 +334,7 @@ const Picker = class {
         return index.h("p", { style: style }, text);
     }
     renderListResult() {
-        return (index.h("limel-list", { badgeIcons: this.badgeIcons, onChange: this.handleListChange, onKeyDown: this.onListKeyDown, type: "selectable", items: this.items }));
+        return (index.h("limel-list", { "data-suggestions": "", accessibleLabel: this.label || this.searchLabel, badgeIcons: this.badgeIcons, onChange: this.handleListChange, onKeyDown: this.onListKeyDown, type: "selectable", items: this.items }));
     }
     onListKeyDown(event) {
         if (event.key === keycodes.ESCAPE) {
@@ -321,7 +346,7 @@ const Picker = class {
             this.chipSet.setFocus();
             return;
         }
-        if ([keycodes.TAB, keycodes.ENTER].includes(event.key)) {
+        if ([keycodes.TAB, keycodes.ENTER].includes(event.key) || typeahead.isTextEditingKey(event)) {
             this.chipSet.setFocus();
         }
     }
@@ -341,10 +366,11 @@ const Picker = class {
         // However, document.activeElement will return the actual focused element instead of the outermost shadow host
         const element = this.host.shadowRoot.activeElement || document.activeElement;
         const portalElement = document.querySelector(`#${this.portalId}`);
-        if (dom.isDescendant(element, this.host) ||
-            dom.isDescendant(element, portalElement)) {
+        if (liveMessage.isDescendant(element, this.host) ||
+            liveMessage.isDescendant(element, portalElement)) {
             return;
         }
+        this.suggestionsEngaged = false;
         this.clearInputField();
     }
     /**
@@ -356,6 +382,7 @@ const Picker = class {
         event.stopPropagation();
         const query = event.detail;
         this.textValue = query;
+        this.suggestionsEngaged = true;
         this.debouncedSearch(query);
         // If the search-query is an empty string, bypass debouncing.
         if (query === '') {
@@ -450,10 +477,8 @@ const Picker = class {
      * @param event - event
      */
     handleInputKeyDown(event) {
-        const isForwardTab = event.key === keycodes.TAB &&
-            !event.altKey &&
-            !event.metaKey &&
-            !event.shiftKey;
+        var _a;
+        this.suggestionsEngaged = true;
         const isUp = event.key === keycodes.ARROW_UP;
         const isDown = event.key === keycodes.ARROW_DOWN;
         const isEscape = event.key === keycodes.ESCAPE;
@@ -463,14 +488,14 @@ const Picker = class {
             this.handleEscape();
             return;
         }
-        if (!isForwardTab && !isUp && !isDown) {
+        if (!isUp && !isDown) {
             return;
         }
-        const list = document.querySelector(` #${this.portalId} limel-list`);
+        const list = (_a = document.querySelector(` #${this.portalId} limel-list[data-suggestions]`)) !== null && _a !== void 0 ? _a : document.querySelector(` #${this.portalId} limel-list`);
         if (!list) {
             return;
         }
-        if (isForwardTab || isDown) {
+        if (isDown) {
             // Match by class only (not `:first-child`) so a leading
             // `ListSeparator` doesn't shadow the first focusable item.
             const listElement = list.shadowRoot.querySelector('.mdc-deprecated-list-item');
@@ -481,9 +506,6 @@ const Picker = class {
             listElement.focus();
             return;
         }
-        if (!isUp) {
-            return;
-        }
         const listItems = list.shadowRoot.querySelectorAll('.mdc-deprecated-list-item');
         const listElement = [...listItems].at(-1);
         if (!listElement) {

package/dist/cjs/limel-popover_2.cjs.entry.js

@@ -4,6 +4,7 @@ var index = require('./index-BlsqxTB1.js');
 var randomString = require('./random-string-CFCtFh5l.js');
 var keycodes = require('./keycodes-BQ_AERli.js');
 var focusTriggerElement = require('./focus-trigger-element-Sr7Yjtmk.js');
+var controlledElement = require('./controlled-element-Ajn5eA-q.js');
 require('./_assignValue-DQh76m39.js');
 require('./_defineProperty-Csu6P9HT.js');
 require('./_getNative-Cf52giNE.js');
@@ -82,7 +83,7 @@ const Popover = class {
             // `aria-expanded` is needed even when the popover is closed. Without
             // it, the trigger reads as an ordinary button to a screen reader.
             element.setAttribute('aria-expanded', this.open ? 'true' : 'false');
-            this.setControlledPopup(element);
+            controlledElement.setControlledElement(element, this.portalId);
             element.setAttribute('role', 'button');
         };
         this.portalId = randomString.createRandomString();
@@ -141,7 +142,7 @@ const Popover = class {
     render() {
         const cssProperties = this.getCssProperties();
         const popoverZIndex = getComputedStyle(this.host).getPropertyValue('--popover-z-index');
-        return (index.h("div", { key: 'f314178b0648433c2e764a31b64c94c85f31d7ce', class: "trigger-anchor" }, index.h("slot", { key: '93953d9f7bf5c1c0550e445a4e49591029408725', name: "trigger", ref: this.setTriggerRef }), index.h("limel-portal", { key: '01d43457e8eeebd3c135ea823bb26e0e3e336d12', visible: this.open, containerId: this.portalId, containerStyle: { 'z-index': popoverZIndex }, openDirection: this.openDirection }, index.h("limel-popover-surface", { key: '6c368bcc7a3914fa62525b01f912cf4d0e640531', contentCollection: this.host.children, popupRole: this.getNamedPopupRole(), accessibleLabel: this.accessibleLabel, style: cssProperties }))));
+        return (index.h("div", { key: '25f9721cd8faad3f7f8d2d6f6f5152bfa507783c', class: "trigger-anchor" }, index.h("slot", { key: 'b3a48d53f82b3caaf6ba3123b8df0c6b2880a6d7', name: "trigger", ref: this.setTriggerRef }), index.h("limel-portal", { key: '3707b6a5157e89bc57f0687ef2ca74a592226e70', visible: this.open, containerId: this.portalId, containerStyle: { 'z-index': popoverZIndex }, openDirection: this.openDirection }, index.h("limel-popover-surface", { key: 'bb5eb9c961732fe8582cc3e95787803efec6e6a4', contentCollection: this.host.children, popupRole: this.getNamedPopupRole(), accessibleLabel: this.accessibleLabel, style: cssProperties }))));
     }
     globalClickListener(event) {
         const element = event.target;
@@ -176,14 +177,6 @@ const Popover = class {
         }
         this.hasWarnedAboutMissingName = hasNoName;
     }
-    setControlledPopup(element) {
-        const popup = document.querySelector(`#${this.portalId}`);
-        if ('ariaControlsElements' in element) {
-            element.ariaControlsElements = popup ? [popup] : null;
-            return;
-        }
-        element.setAttribute('aria-controls', this.portalId);
-    }
     get host() { return index.getElement(this); }
     static get watchers() { return {
         "open": [{
@@ -203,7 +196,7 @@ const PopoverSurface = class {
         this.appendElement();
     }
     render() {
-        return (index.h("div", { key: '0391463d9777ee0a43de19b4fcf97e5b1ef120d9', class: "limel-popover-surface", tabindex: "0", role: this.popupRole, "aria-label": this.accessibleLabel }));
+        return (index.h("div", { key: 'b3b766fa5d9b26b48136c0856bbfb40745498b7c', class: "limel-popover-surface", tabindex: "0", role: this.popupRole, "aria-label": this.accessibleLabel }));
     }
     appendElement() {
         const portalContainer = this.host.shadowRoot.querySelector('.limel-popover-surface');

package/dist/cjs/limel-profile-picture.cjs.entry.js

@@ -3,7 +3,7 @@
 var index = require('./index-BlsqxTB1.js');
 var files = require('./files-DpGigQ8k.js');
 var getIconProps = require('./get-icon-props-CwpDdQDI.js');
-var translations = require('./translations-CLSqfR3x.js');
+var translations = require('./translations-CqJEWcfw.js');
 var randomString = require('./random-string-CFCtFh5l.js');
 var imageResize = require('./image-resize-JlRLB97I.js');
 var image_template = require('./image.template-DlF-f23b.js');

package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js

@@ -2,10 +2,10 @@
 
 var index$1 = require('./index-BlsqxTB1.js');
 var types = require('./types-C7gNcwzE.js');
-var markdownParser = require('./markdown-parser-BYtTHL4W.js');
+var markdownParser = require('./markdown-parser-toAp9-Eq.js');
 var cloneDeep = require('./cloneDeep-CiuKX6HE.js');
-var translations = require('./translations-CLSqfR3x.js');
-var index = require('./index-zZvs6xK-.js');
+var translations = require('./translations-CqJEWcfw.js');
+var index = require('./index-DIiA99Er.js');
 var randomString = require('./random-string-CFCtFh5l.js');
 var isItem = require('./is-item-DMELyaao.js');
 var files = require('./files-DpGigQ8k.js');
@@ -28659,7 +28659,7 @@ const ProsemirrorAdapter = class {
         (_e = this.view) === null || _e === void 0 ? void 0 : _e.destroy();
     }
     render() {
-        return (index$1.h(index$1.Host, { key: 'f5d3b059f54cdb32f9499b9063e4b3c732490f0e', onFocus: this.handleFocus }, index$1.h("div", { key: '81aa602b9cf3575da987261e60629e008c03269c', id: "editor" }), this.renderToolbar(), this.renderLinkMenu()));
+        return (index$1.h(index$1.Host, { key: '8146122990b6020e7c1062938123d233e6c4e6aa', onFocus: this.handleFocus }, index$1.h("div", { key: '49dfd2b845efad4528689a9890e2f59cb5cd030e', id: "editor" }), this.renderToolbar(), this.renderLinkMenu()));
     }
     renderToolbar() {
         if (this.actionBarItems.length === 0 || this.ui === 'no-toolbar') {

package/dist/cjs/limel-radio-button-group.cjs.entry.js

@@ -26,7 +26,7 @@ const RadioButtonGroup = class {
         };
     }
     render() {
-        return (index.h("limel-list", { key: 'c2126217b6d0e46fa2697ad357fa441dfd611e84', items: this.createItems(), type: "radio", badgeIcons: this.badgeIcons, maxLinesSecondaryText: this.maxLinesSecondaryText, onChange: this.handleChange }));
+        return (index.h("limel-list", { key: 'b9c2e1312803c82e8729e0f55b2e2c06e24c00a0', items: this.createItems(), type: "radio", badgeIcons: this.badgeIcons, maxLinesSecondaryText: this.maxLinesSecondaryText, onChange: this.handleChange }));
     }
     createItems() {
         return this.items.map((option) => {

package/dist/cjs/limel-radio-button.cjs.entry.js

@@ -9,12 +9,12 @@ const RadioButtonComponent = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '6a13619b314af79329c8bb375b13db650ff84bc0', class: {
+        return (index.h(index.Host, { key: '9fd754e0cad07b0dafc27ff12966f1ecc43ac94c', class: {
                 'boolean-input': true,
                 'radio-button': true,
                 checked: this.checked,
                 disabled: this.disabled,
-            } }, index.h("input", { key: '766fe9899d9c4b0ef0b4cce2a579d70d95ddc4ef', type: "radio", id: this.id, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), index.h("div", { key: '95c155149a1e2e0c90f0f32c960b7fb02844a352', class: "box" }), index.h("label", { key: 'c79892604f14bdc55ea207a9e95214c2b3c365dc', class: "boolean-input-label", htmlFor: this.id }, this.label)));
+            } }, index.h("input", { key: 'e6dfb4a56fd955db9718400bdf9f1315d768883c', type: "radio", id: this.id, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), index.h("div", { key: '371b6ff8362f34dc1dcedb254c99246c36bbd8db', class: "box" }), index.h("label", { key: '2a65aee91c5f82a13b9e469f6bd5eb9126d798cf', class: "boolean-input-label", htmlFor: this.id }, this.label)));
     }
 };
 RadioButtonComponent.style = radioButtonCss();

package/dist/cjs/limel-resize-handle.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-BlsqxTB1.js');
-var translations = require('./translations-CLSqfR3x.js');
+var translations = require('./translations-CqJEWcfw.js');
 var keycodes = require('./keycodes-BQ_AERli.js');
 require('./language-v-MMS6ym.js');
 
@@ -248,7 +248,7 @@ const ResizeHandle = class {
     }
     render() {
         const name = this.getName();
-        return (index.h(index.Host, { key: '60afc9a25d46b0353ea82e5d952c4f16ea966af9', onKeyDown: this.handleKeyDown, onPointerEnter: this.handlePointerEnter, onPointerLeave: this.handlePointerLeave }, index.h("div", { key: 'cf668350fd88ceb546b2ba5d9f2e256fad850633', role: "separator", id: SEPARATOR_ID, tabindex: "0", "aria-orientation": getOrientation(this.location), "aria-label": name, "aria-valuenow": this.value, "aria-valuemin": this.min, "aria-valuemax": this.max, onFocus: this.handleFocus, onBlur: this.handleBlur }, index.h("div", { key: '581a96a20905d70ed32f5a25b8db803ea4daee6a', role: "presentation" }, index.h("span", { key: 'a06b14126c53c2a28c32897cf27d95f2d86d6e71' }), index.h("span", { key: 'b0b80786f6fa842b562c3e17c82f6d569f977d6f' }), index.h("span", { key: 'f1604f9a3e96bf59558bba08a3c9388f97ecb17e' }))), index.h("limel-tooltip", { key: '43c3a9a2502f30e58067f1eb16e53129face2bf4', elementId: SEPARATOR_ID, label: name, helperLabel: this.getHint(), openDirection: this.location })));
+        return (index.h(index.Host, { key: 'ae82ff62dfeb954f5dec181a8d3e0a0e564e0219', onKeyDown: this.handleKeyDown, onPointerEnter: this.handlePointerEnter, onPointerLeave: this.handlePointerLeave }, index.h("div", { key: '68826930c86850047893b5f8edcb8203000b0126', role: "separator", id: SEPARATOR_ID, tabindex: "0", "aria-orientation": getOrientation(this.location), "aria-label": name, "aria-valuenow": this.value, "aria-valuemin": this.min, "aria-valuemax": this.max, onFocus: this.handleFocus, onBlur: this.handleBlur }, index.h("div", { key: '15be73014f20e7788cdb3a9ff0d332a0c036a1fe', role: "presentation" }, index.h("span", { key: '69e9b4c0496d659db9b82d91339ab60e455b8bcc' }), index.h("span", { key: '9549feb07707e9ba8751ab4d06e6c2b5f9d1bbd7' }), index.h("span", { key: '4ce59a99ca80989774915fa499a5251ef041db83' }))), index.h("limel-tooltip", { key: 'cbadd628e570b83c4bd3944e7e87d5834dbcd418', elementId: SEPARATOR_ID, label: name, helperLabel: this.getHint(), openDirection: this.location })));
     }
     getName() {
         if (!this.resizableRegionLabel) {