@limetech/lime-elements 40.6.0 → 40.6.2

package/dist/esm/limel-breadcrumbs_6.entry.js

@@ -1,24 +1,24 @@
-import { r as registerInstance, c as createEvent, h, a as getElement, H as Host } from './index-Bnc9lzk2.js';
-import { m as makeEnterClickable, r as removeEnterClickable } from './make-enter-clickable-BgTwPGeH.js';
-import { c as createRandomString } from './random-string-JbKhhoXs.js';
+import { r as registerInstance, c as createEvent, h, a as getElement, H as Host } from './index-BU9IJqli.js';
+import { m as makeEnterClickable, r as removeEnterClickable } from './make-enter-clickable-CIf8aGSd.js';
+import { c as createRandomString } from './random-string-BrjD-ITe.js';
 import { g as getIconName, b as getIconColor } from './get-icon-props-CgNJbSP4.js';
-import { T as TAB, A as ARROW_UP, b as ARROW_DOWN, E as ESCAPE, a as ENTER, e as SPACE, c as ARROW_LEFT, d as ARROW_RIGHT } from './keycodes-C4_9qUMP.js';
+import { T as TAB, A as ARROW_UP, b as ARROW_DOWN, E as ESCAPE, a as ENTER, f as SPACE, d as ARROW_LEFT, e as ARROW_RIGHT } from './keycodes-DQ5DmW_Y.js';
 import { b as getHref, a as getTarget, g as getRel } from './link-helper-5KsJICvh.js';
 import { g as globalConfig } from './config-Dnt5w_Bp.js';
 import { d as debounce } from './debounce-B67JMchz.js';
-import { M as MDCTextField } from './component-wGVqvUmL.js';
+import { M as MDCTextField } from './component-CVihTrav.js';
 import { f as focusTriggerElement, z as zipObject } from './focus-trigger-element-BOFcjLq3.js';
-import { h as hotkeyFromKeyboardEvent, t as tokenizeHotkeyString, n as normalizeHotkeyString } from './hotkeys-BxrRWYts.js';
+import { h as hotkeyFromKeyboardEvent, t as tokenizeHotkeyString, n as normalizeHotkeyString } from './hotkeys-DjmlD0Mw.js';
 import { i as isFunction } from './isFunction-9zQTeQI8.js';
-import { _ as __extends, a as __assign, b as __values, M as MDCFoundation, c as MDCComponent, d as closest } from './ponyfill-ChRGk668.js';
-import { c as cssClasses$2, n as numbers$2, M as MDCListFoundation, a as MDCList } from './component-B2Vy44Z3.js';
-import { M as MDCRipple } from './component-7QB0OUSF.js';
+import { _ as __extends, a as __assign, b as __values, M as MDCFoundation, c as MDCComponent, d as closest } from './ponyfill-6YuZiAPi.js';
+import { c as cssClasses$2, n as numbers$2, M as MDCListFoundation, a as MDCList } from './component-kP1jCDLp.js';
+import { M as MDCRipple } from './component-CrjPGt1I.js';
 import { i as isDescendant } from './dom-B9Ofc5RB.js';
 import './isObject-BJQylLSL.js';
 import './toNumber-D6JYpQI9.js';
 import './isSymbol-ClAke5ga.js';
 import './isObjectLike-oiMYqRQ0.js';
-import './component-D4qgwaTf.js';
+import './component-CyFeUQ0l.js';
 import './_assignValue-CEFvyZxO.js';
 import './_defineProperty-C69Btzid.js';
 import './_getNative-COawFdVX.js';
@@ -62,10 +62,10 @@ const Breadcrumbs = class {
         };
         this.renderIcon = (item) => {
             const name = getIconName(item.icon);
-            const color = getIconColor(item.icon);
             if (!name) {
                 return;
             }
+            const color = getIconColor(item.icon);
             return (h("limel-icon", { style: {
                     color: `${color}`,
                 }, name: name }));
@@ -90,7 +90,7 @@ const Breadcrumbs = class {
         };
     }
     render() {
-        return (h("ol", { key: 'ff7a7ba131355241b723f15edf1f9c03e004b7eb', role: "navigation", "aria-label": "Breadcrumb", style: { '--limel-breadcrumbs-divider': `'${this.divider}'` } }, this.renderSteps(), this.renderLastStep()));
+        return (h("ol", { key: '90915e820a8b7a4cbf13d06b14726c351a6da4b5', role: "navigation", "aria-label": "Breadcrumb", style: { '--limel-breadcrumbs-divider': `'${this.divider}'` } }, this.renderSteps(), this.renderLastStep()));
     }
     componentWillLoad() {
         makeEnterClickable(this.host);
@@ -267,9 +267,11 @@ const InputField = class {
             if (this.type === 'number') {
                 props.step = this.step;
             }
+            // eslint-disable-next-line unicorn/prefer-number-is-safe-integer -- integers beyond the safe range must still be applied
             if (this.type === 'number' && Number.isInteger(this.min)) {
                 props.min = this.min;
             }
+            // eslint-disable-next-line unicorn/prefer-number-is-safe-integer -- integers beyond the safe range must still be applied
             if (this.type === 'number' && Number.isInteger(this.max)) {
                 props.max = this.max;
             }
@@ -299,11 +301,11 @@ const InputField = class {
         };
         this.renderHelperLine = () => {
             var _a;
-            const text = this.getCurrentValue() || '';
-            const length = text.length;
             if (!this.hasHelperLine()) {
                 return;
             }
+            const text = this.getCurrentValue() || '';
+            const length = text.length;
             return (h("limel-helper-line", { helperTextId: this.helperTextId, helperText: (_a = this.helperText) !== null && _a !== void 0 ? _a : this.validationMessage, length: length, maxLength: this.maxlength, invalid: this.isInvalid() }));
         };
         this.renderSuffix = () => {
@@ -376,7 +378,7 @@ const InputField = class {
             if (!this.isInvalid() && this.hasLink()) {
                 return this.renderLinkIcon(this.getLink(), trailingIcon);
             }
-            else if (trailingIcon) {
+            if (trailingIcon) {
                 return this.renderTrailingIcon(trailingIcon);
             }
         };
@@ -478,10 +480,11 @@ const InputField = class {
                 listElement.focus();
                 return;
             }
-            if (isUp) {
-                const listElement = list.shadowRoot.querySelector('.mdc-deprecated-list-item:last-child');
-                listElement.focus();
+            if (!isUp) {
+                return;
             }
+            const listElement = list.shadowRoot.querySelector('.mdc-deprecated-list-item:last-child');
+            listElement.focus();
         };
         this.handleCompletionChange = (event) => {
             event.stopPropagation();
@@ -677,13 +680,10 @@ const InputField = class {
         if (ariaControls) {
             properties['aria-controls'] = ariaControls;
         }
-        return (h(Host, { key: '9e509e181e05f451deadc92e052dc11075032f9a' }, h("limel-notched-outline", { key: '2f2307e2c7d96eec0c5753d27bf1fc76c9ad8eb2', 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: 'a21372b10d416423aea6ff9f318bf12ef8d4832a', 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: 'f75582060395fe9167939a30d0fb07a89d225cf2' }, h("limel-notched-outline", { key: '85e40d1ceee2efb56a7175f090b876b6514a41cb', 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: '683ee7c3e879a07f590ac27e8056489cb626b36f', 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) {
-            return;
-        }
-        if (this.changeWaiting) {
+        if (!this.mdcTextField || this.changeWaiting) {
             return;
         }
         if (this.type === 'number' &&
@@ -800,10 +800,7 @@ const Menu = class {
                 return;
             }
             const pressedHotkey = hotkeyFromKeyboardEvent(event);
-            if (!pressedHotkey) {
-                return;
-            }
-            if (this.isReservedMenuHotkey(pressedHotkey)) {
+            if (!pressedHotkey || this.isReservedMenuHotkey(pressedHotkey)) {
                 return;
             }
             const matchedItem = this.findMenuItemByHotkey(pressedHotkey);
@@ -957,12 +954,13 @@ const Menu = class {
                 return;
             }
             // Down on last item: go to search input (if it exists)
-            if (isDown && this.isLastListItemFocused() && this.searchInput) {
-                event.stopPropagation();
-                event.preventDefault();
-                this.searchInput.focus();
+            if (!isDown || !this.isLastListItemFocused() || !this.searchInput) {
+                // If no search input, let MDC Menu handle wrap-around
+                return;
             }
-            // If no search input, let MDC Menu handle wrap-around
+            event.stopPropagation();
+            event.preventDefault();
+            this.searchInput.focus();
         };
         // Key handler for the menu list (bubble phase)
         // Will change focus to the search field if using shift+tab
@@ -984,16 +982,17 @@ const Menu = class {
                 (_a = this.searchInput) === null || _a === void 0 ? void 0 : _a.focus();
                 return;
             }
-            if (!this.gridLayout && (isLeft || isRight)) {
-                const currentItem = this.getCurrentItem();
-                event.stopPropagation();
-                event.preventDefault();
-                if (isRight) {
-                    this.goForward(currentItem);
-                }
-                else if (isLeft) {
-                    this.goBack();
-                }
+            if (this.gridLayout || (!isLeft && !isRight)) {
+                return;
+            }
+            const currentItem = this.getCurrentItem();
+            event.stopPropagation();
+            event.preventDefault();
+            if (isRight) {
+                this.goForward(currentItem);
+            }
+            else if (isLeft) {
+                this.goBack();
             }
         };
         // Key handler for breadcrumbs
@@ -1089,10 +1088,11 @@ const Menu = class {
                 }
                 return;
             }
-            if (this.triggersDisabledByMenu.has(element)) {
-                element.removeAttribute('disabled');
-                this.triggersDisabledByMenu.delete(element);
+            if (!this.triggersDisabledByMenu.has(element)) {
+                return;
             }
+            element.removeAttribute('disabled');
+            this.triggersDisabledByMenu.delete(element);
         };
         this.onClose = () => {
             const restoreFocus = this.shouldRestoreFocusOnClose;
@@ -1120,7 +1120,7 @@ const Menu = class {
                 this.setFocus();
                 return;
             }
-            else if (isFunction(menuItem === null || menuItem === void 0 ? void 0 : menuItem.items)) {
+            if (isFunction(menuItem === null || menuItem === void 0 ? void 0 : menuItem.items)) {
                 const menuLoader = menuItem.items;
                 this.selectedMenuItem = menuItem;
                 this.loadingSubItems = true;
@@ -1164,7 +1164,7 @@ const Menu = class {
             }
             this.list = element;
             if (this.list) {
-                this.list.addEventListener('keydown', this.handleListKeyDownCapture, true);
+                this.list.addEventListener('keydown', this.handleListKeyDownCapture, { capture: true });
             }
         };
         this.setFocus = () => {
@@ -1287,14 +1287,15 @@ const Menu = class {
     }
     componentDidRender() {
         const slotElement = this.host.shadowRoot.querySelector('slot');
-        // eslint-disable-next-line unicorn/no-array-for-each
-        slotElement.assignedElements().forEach(this.setTriggerAttributes);
+        for (const element of slotElement.assignedElements()) {
+            this.setTriggerAttributes(element);
+        }
     }
     render() {
         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: 'c66307a5cc7257e2b394f0b5d56d6fbc6fce18b1', class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, h("slot", { key: '7c37448e29deaee202f74d3288d21697529c82b5', ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), h("limel-portal", { key: 'f7f1b14ae5c6e19fa8e9651c2a847db0bb246427', visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, h("limel-menu-surface", { key: 'c2fd7257bfe8ccf820b8aabc6a8959f6d5d1cd2f', 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: '53dad76785873b9673e15413e2c2f6d3b7253725', class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, h("slot", { key: '13bb5f53e6e13101a8ecbb18dbc4df4d74ac5f27', ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), h("limel-portal", { key: 'cb64f614e55158e1b3d49fe9111e8c4ad36794b1', visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, h("limel-menu-surface", { key: 'bfe7f53832ac43ec7b0e60f8dd7ac385d0ea3f14', 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()))));
     }
@@ -1326,10 +1327,14 @@ const Menu = class {
             this.teardownGlobalHandlers();
             return;
         }
-        document.addEventListener('keydown', this.handleDocumentKeyDown, true);
+        document.addEventListener('keydown', this.handleDocumentKeyDown, {
+            capture: true,
+        });
     }
     teardownGlobalHandlers() {
-        document.removeEventListener('keydown', this.handleDocumentKeyDown, true);
+        document.removeEventListener('keydown', this.handleDocumentKeyDown, {
+            capture: true,
+        });
     }
     isFromTextInput(event) {
         const path = typeof event.composedPath === 'function'
@@ -1339,13 +1344,8 @@ const Menu = class {
             if (!(node instanceof HTMLElement)) {
                 continue;
             }
-            if (node.isContentEditable) {
-                return true;
-            }
-            const tagName = node.tagName;
-            if (tagName === 'INPUT' ||
-                tagName === 'TEXTAREA' ||
-                tagName === 'SELECT') {
+            if (node.isContentEditable ||
+                ['INPUT', 'TEXTAREA', 'SELECT'].includes(node.tagName)) {
                 return true;
             }
         }
@@ -1375,14 +1375,16 @@ const Menu = class {
         if (hasModifiers) {
             return false;
         }
-        return (key === 'arrowup' ||
-            key === 'arrowdown' ||
-            key === 'arrowleft' ||
-            key === 'arrowright' ||
-            key === 'tab' ||
-            key === 'enter' ||
-            key === 'space' ||
-            key === 'escape');
+        return [
+            'arrowup',
+            'arrowdown',
+            'arrowleft',
+            'arrowright',
+            'tab',
+            'enter',
+            'space',
+            'escape',
+        ].includes(key);
     }
     findMenuItemByHotkey(pressedHotkey) {
         for (const item of this.visibleItems) {
@@ -1458,7 +1460,7 @@ const Menu = class {
             }
             return `${assignedTriggers[0].clientWidth}px`;
         }
-        else if (this.surfaceWidth === 'inherit-from-menu') {
+        if (this.surfaceWidth === 'inherit-from-menu') {
             if (!((_c = this.host) === null || _c === void 0 ? void 0 : _c.clientWidth)) {
                 return '';
             }
@@ -1471,7 +1473,7 @@ const Menu = class {
         if (Array.isArray(this.searchResults) && this.searchValue) {
             return this.searchResults;
         }
-        else if (Array.isArray((_a = this.currentSubMenu) === null || _a === void 0 ? void 0 : _a.items)) {
+        if (Array.isArray((_a = this.currentSubMenu) === null || _a === void 0 ? void 0 : _a.items)) {
             if (this.cachedSubMenuSource !== this.currentSubMenu) {
                 this.cachedSubMenuSource = this.currentSubMenu;
                 this.cachedSubMenuItems = this.currentSubMenu.items.map((item) => (Object.assign(Object.assign({}, item), { parentItem: this.currentSubMenu })));
@@ -2989,10 +2991,10 @@ class MenuListRenderer {
          */
         this.getIndexForWhichToApplyTabIndex = (items) => {
             let result;
-            for (let i = 0, max = items.length; i < max; i += 1) {
-                if ('separator' in items[i]) ;
+            for (const [i, entry] of items.entries()) {
+                if ('separator' in entry) ;
                 else {
-                    const item = items[i];
+                    const item = entry;
                     if (item.disabled) {
                         // Skip disabled items - they should never get tabindex
                         continue;
@@ -3026,8 +3028,8 @@ class MenuListRenderer {
             if (index === this.applyTabIndexToItemAtIndex) {
                 attributes.tabindex = '0';
             }
-            const hasSubMenu = this.hasSubItems(item);
-            const hasMeta = hasSubMenu ||
+            const hasSubmenu = this.hasSubItems(item);
+            const hasMeta = hasSubmenu ||
                 item.badge !== undefined ||
                 !!item.hotkey ||
                 !!item.commandText;
@@ -3039,7 +3041,7 @@ class MenuListRenderer {
                         hotkey: item.hotkey,
                         disabled: !!item.disabled,
                         badge: item.badge,
-                        showChevron: hasSubMenu,
+                        showChevron: hasSubmenu,
                     },
                 }
                 : undefined;
@@ -3048,7 +3050,7 @@ class MenuListRenderer {
                 'mdc-deprecated-list-item': true, // required for keyboard navigation with arrow keys
                 'mdc-deprecated-list-item--disabled': !!item.disabled, // MDC’s foundation checks for the disabled class before toggling selected state
             };
-            return (h("limel-list-item", Object.assign({ key: key, class: classNames, "data-index": index }, attributes, { "aria-haspopup": hasSubMenu ? 'menu' : undefined, "aria-expanded": hasSubMenu ? 'false' : undefined, type: "menuitem", text: item.text, secondaryText: item.secondaryText, icon: item.icon, primaryComponent: primaryComponent, badgeIcon: this.config.badgeIcons, selected: item.selected, disabled: item.disabled })));
+            return (h("limel-list-item", Object.assign({ key: key, class: classNames, "data-index": index }, attributes, { "aria-haspopup": hasSubmenu ? 'menu' : undefined, "aria-expanded": hasSubmenu ? 'false' : undefined, type: "menuitem", text: item.text, secondaryText: item.secondaryText, icon: item.icon, primaryComponent: primaryComponent, badgeIcon: this.config.badgeIcons, selected: item.selected, disabled: item.disabled })));
         };
         this.renderTextForSeparator = (item) => {
             if ('text' in item) {
@@ -3061,7 +3063,7 @@ class MenuListRenderer {
         };
     }
     render(items, config = {}) {
-        items = items || [];
+        items || (items = []);
         this.config = Object.assign(Object.assign({}, this.defaultConfig), config);
         this.applyTabIndexToItemAtIndex =
             this.getIndexForWhichToApplyTabIndex(items);
@@ -3156,7 +3158,7 @@ const MenuList = class {
             iconSize: this.iconSize,
         };
         const html = this.MenuListRenderer.render(this.items, this.config);
-        return h("div", { key: 'df56cd634e8431eefe497bf49bf7767fe7211af3', class: "mdc-menu mdc-menu-surface" }, html);
+        return h("div", { key: 'd543dcdd212cd774cd4da536fba637212c4afa59', class: "mdc-menu mdc-menu-surface" }, html);
     }
     itemsChanged() {
         setTimeout(() => {
@@ -3211,10 +3213,7 @@ const MenuSurface = class {
         };
         this.handleDocumentClick = (event) => {
             const elementPath = event.composedPath ? event.composedPath() : [];
-            if (!this.open) {
-                return;
-            }
-            if (isDescendant(event.target, this.host)) {
+            if (!this.open || isDescendant(event.target, this.host)) {
                 return;
             }
             if (this.allowClicksElement) {
@@ -3259,10 +3258,11 @@ const MenuSurface = class {
         this.handleKeyDown = (event) => {
             const isEscape = event.key === ESCAPE;
             const isTab = event.key === TAB;
-            if (this.open && (isEscape || isTab)) {
-                event.stopPropagation();
-                this.dismiss.emit();
+            if (!(this.open && (isEscape || isTab))) {
+                return;
             }
+            event.stopPropagation();
+            this.dismiss.emit();
         };
     }
     connectedCallback() {
@@ -3282,7 +3282,7 @@ const MenuSurface = class {
             'mdc-elevation-transition': true,
             'mdc-elevation--z4': true,
         };
-        return (h("div", { key: '61370a07bbfbba621b506644802b10516281150b', class: classList, tabindex: "-1" }, h("slot", { key: '44076f03f8ef4b24ce3805374379ba4e7b01acb5' })));
+        return (h("div", { key: '9bc341ae3ec547e20c882d282cfeb8e876ef067a', class: classList, tabindex: "-1" }, h("slot", { key: '81a18040d209809e41d20d2d37b1a657b8e07c33' })));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/limel-button-group.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-Bnc9lzk2.js';
-import { c as createRandomString } from './random-string-JbKhhoXs.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-BU9IJqli.js';
+import { c as createRandomString } from './random-string-BrjD-ITe.js';
 
 const buttonGroupCss = () => `@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}:host(limel-button-group){display:flex;box-sizing:border-box;align-items:center;border-radius:3.75rem;background-color:var(--button-group-background-color, rgb(var(--contrast-400)));width:max-content;max-width:100%;flex-wrap:nowrap}.button{color:var(--limel-theme-on-surface-color)}.button:not(:has(:disabled)){transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:transparent}.button:not(:has(:disabled)):hover,.button:not(:has(:disabled)):focus,.button:not(:has(:disabled)):focus-visible{will-change:color, background-color, box-shadow, transform}.button:not(:has(:disabled)):hover,.button:not(:has(:disabled)):focus-visible{transform:translate3d(0, -0.04rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color)}.button:not(:has(:disabled)):hover{box-shadow:var(--button-shadow-hovered)}.button:not(:has(:disabled)):active{--limel-clickable-transform-timing-function:cubic-bezier(       0.83,       -0.15,       0.49,       1.16   );transform:translate3d(0, 0.05rem, 0);background-color:var(--limel-theme-surface-background-color);box-shadow:var(--button-shadow-inset-pressed)}.button:not(:has(:disabled)):hover,.button:not(:has(:disabled)):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}.button{position:relative;display:inline-grid;grid-auto-flow:column;align-items:center;max-width:100%;min-width:2rem;height:2rem;padding:0 0.0625rem;margin:0.125rem;border-radius:1rem;font-size:var(--limel-theme-default-font-size);user-select:none}.button:not(:last-child):after{content:"";display:block;height:1rem;width:0.125rem;border-radius:0.25rem;background-color:var(--button-group-text-color, rgb(var(--contrast-1200)));opacity:0.1;position:absolute;right:-0.1875rem;top:0;bottom:0;margin:auto}.button label{cursor:pointer;transition:color 0.2s ease;display:flex;align-items:center;flex:1;height:100%;min-width:0}.button label:has(>limel-badge) .button__label{padding-right:0.25rem}.button:has(:disabled) label{cursor:not-allowed;opacity:0.4}.button input[type=radio]{position:absolute;width:0;opacity:0}.button input[type=radio]:focus-visible+label:after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3.75rem;box-shadow:var(--shadow-depth-8-focused)}.button:focus-within{outline:none;color:var(--lime-primary-color, var(--limel-theme-primary-color))}.button:only-child .button__label{padding-left:0.75rem}.button:first-child .button__label{padding-left:0.75rem}.button.button--selected{background-color:var(--limel-theme-surface-background-color);box-shadow:var(--button-shadow-inset);color:var(--lime-primary-color, var(--limel-theme-primary-color))}.button.button--selected:not(:has(:disabled)):active{box-shadow:var(--button-shadow-inset-pressed)}.button__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--limel-theme-default-small-font-size);padding:0 0.75rem}.button__icon{border-radius:50%;vertical-align:middle}limel-badge{margin-right:0.25rem;pointer-events:none}.button:not(.button--selected){--badge-background-color:rgb(var(--contrast-200))}`;
 
@@ -33,7 +33,7 @@ const ButtonGroup = class {
         this.setSelectedButton();
     }
     render() {
-        return (h(Host, { key: '47b5c05bc255b04b0ba3cfcd703682c9921a4a5a', role: "radiogroup" }, this.value.map(this.renderButton)));
+        return (h(Host, { key: '9bb63bb91ee69fd4776a86d16ef36ed6653fe4b6', role: "radiogroup" }, this.value.map(this.renderButton)));
     }
     renderButton(button) {
         // Prefix with 'b' because html IDs cannot start with a digit,

package/dist/esm/limel-button.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host, a as getElement } from './index-Bnc9lzk2.js';
-import { m as makeEnterClickable, r as removeEnterClickable } from './make-enter-clickable-BgTwPGeH.js';
+import { r as registerInstance, h, H as Host, a as getElement } from './index-BU9IJqli.js';
+import { m as makeEnterClickable, r as removeEnterClickable } from './make-enter-clickable-CIf8aGSd.js';
 import { d as getIconTitle, g as getIconName } from './get-icon-props-CgNJbSP4.js';
 
 const buttonCss = () => `@charset "UTF-8";@keyframes reduced-presence{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(0.7)}}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded){animation:reduced-presence 0.3s ease forwards;transition:padding 0.3s ease, min-width 0.3s ease;transition-delay:0.3s;padding:0;min-width:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .label{transition:font-size 0.8s ease;transition-delay:0.3s;font-size:0;opacity:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-icon,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-spinner,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) svg,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .icon{transition:all 0.3s ease;transition-delay:0.3s;opacity:0;width:0;height:0}:host{display:inline-block}:host([hidden]){display:none}:host([aria-expanded=true]) button,:host([aria-expanded]:not([aria-expanded=false])) button{box-shadow:var(--button-shadow-inset-pressed) !important}button.mdc-button{font-family:inherit}button{--_primary-color:var(       --lime-primary-color,       var(--limel-theme-primary-color)   );display:flex;align-items:center;justify-content:center;gap:0.125rem;border:none;border-radius:0.4rem;padding-top:0;padding-right:var(--button-padding-right, 0.5rem);padding-bottom:0;padding-left:var(--button-padding-left, 0.5rem);min-height:2.25rem;width:100%}button:not(:disabled){transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}button:not(:disabled):hover,button:not(:disabled):focus,button:not(:disabled):focus-visible{will-change:color, background-color, box-shadow, transform}button:not(:disabled):hover,button:not(:disabled):focus-visible{transform:translate3d(0, -0.04rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button:not(:disabled):active{--limel-clickable-transform-timing-function:cubic-bezier(       0.83,       -0.15,       0.49,       1.16   );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}button:not(:disabled):hover,button:not(:disabled):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}button:not(:disabled):focus{outline:none}button:not(:disabled):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button:disabled{cursor:not-allowed}:host(limel-button[primary]) button:not(:disabled){color:var(--lime-on-primary-color, var(--limel-theme-on-primary-color));background-color:var(--_primary-color)}:host(limel-button[primary]) button:disabled{background-color:color-mix(in srgb, var(--_primary-color), transparent 80%)}:host(limel-button:not([primary])) button:not(:disabled){color:var(--_primary-color)}:host(limel-button:not([primary])) button:disabled.outlined{color:color-mix(in srgb, var(--_primary-color), transparent 60%);border-color:color-mix(in srgb, var(--_primary-color), transparent 70%)}:host(limel-button:not([primary])) button:disabled:not(.outlined){color:rgba(var(--contrast-1100), 0.37);background-color:rgba(var(--contrast-900), 0.1)}.label{font-size:var(--limel-theme-default-font-size);font-weight:600;letter-spacing:0.03125rem;padding:0 0.25rem}limel-spinner{position:absolute}limel-icon{width:1.25rem;flex-shrink:0;vertical-align:top}svg{height:1.875rem;opacity:0;pointer-events:none;position:absolute;width:1.875rem}svg line{stroke:rgb(var(--contrast-600));stroke-width:2}limel-icon,.label,limel-spinner,svg{transition:opacity 300ms ease-in-out}.loading limel-icon,.loading .label{opacity:0}.loading limel-spinner{opacity:1}.just-loaded limel-icon,.just-loaded .label,.just-failed limel-icon,.just-failed .label{opacity:0}.just-loaded svg,.just-failed svg{opacity:1}.just-failed{background-color:var(--limel-theme-error-color) !important;animation:shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both}.outlined{border:1px solid;border-color:var(--_primary-color)}@keyframes shake{10%,90%{transform:translate3d(-0.0625rem, 0, 0)}20%,80%{transform:translate3d(0.125rem, 0, 0)}30%,50%,70%{transform:translate3d(-0.1875rem, 0, 0)}40%,60%{transform:translate3d(0.1875rem, 0, 0)}}`;
@@ -43,12 +43,12 @@ const Button = class {
         removeEnterClickable(this.host);
     }
     render() {
-        return (h(Host, { key: '013ef0f57ddd5901c44105b4fe0fcc6b33f428eb', onClick: this.filterClickWhenDisabled }, h("button", { key: '83343ba3da3d11b6aea3825478e2db096981c3e9', class: {
+        return (h(Host, { key: 'e93ab42db5212170ff86c8c2a5f5b8e63c57ba91', onClick: this.filterClickWhenDisabled }, h("button", { key: '4c53bd6a15635afc55635c677404828bb94115da', class: {
                 loading: this.loading,
                 'just-loaded': this.justLoaded && !this.loadingFailed,
                 'just-failed': this.justLoaded && this.loadingFailed,
                 outlined: this.outlined,
-            }, disabled: this.disabled || this.loading, "aria-busy": this.loading ? 'true' : 'false', "aria-live": "polite" }, this.renderIcon(this.icon), this.renderLabel(), this.renderSpinner(), h("svg", { key: 'f4f32a801ab567b4368d701b809641e87052d09c', viewBox: "0 0 30 30" }, this.renderLoadingIcons()))));
+            }, disabled: this.disabled || this.loading, "aria-busy": this.loading ? 'true' : 'false', "aria-live": "polite" }, this.renderIcon(this.icon), this.renderLabel(), this.renderSpinner(), h("svg", { key: 'bbfdda5c889727f50bea9a5f27442afc1a53c347', viewBox: "0 0 30 30" }, this.renderLoadingIcons()))));
     }
     loadingWatcher(newValue, oldValue) {
         const hasFinishedLoading = this.hasFinishedLoading(newValue, oldValue);

package/dist/esm/limel-callout.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h, H as Host } from './index-Bnc9lzk2.js';
-import { t as translate } from './translations-DMtX4tTX.js';
-import './language-C3hECvXE.js';
+import { r as registerInstance, h, H as Host } from './index-BU9IJqli.js';
+import { t as translations } from './translations-Y4i8PVc9.js';
+import './language-ChagAaNf.js';
 
 const calloutIcons = {
     note: 'info',
@@ -33,10 +33,10 @@ function getHeading(heading, type = 'note', language = 'en') {
     }
     const key = `callout.${type}`;
     try {
-        return translate.get(key, language);
+        return translations.get(key, language);
     }
     catch (_a) {
-        return translate.get(key, 'en');
+        return translations.get(key, 'en');
     }
 }
 
@@ -57,7 +57,7 @@ const Callout = class {
         this.language = 'en';
     }
     render() {
-        return (h(Host, { key: '1fad868509e50ce5001ab34c5a24d8859a7de622' }, h("div", { key: '8b00e3ca008d783da77658d7e5c40c98b8fe6097', class: "side", role: "presentation" }, h("limel-icon", { key: '382bf738b6b93cc43d03aa81311e026f26df77fb', name: getIcon(this.icon, this.type) })), h("div", { key: '95a17ed73ffd18f4b17b5f9b0059bc92eb79f02f', class: "main" }, h("h1", { key: 'c3e5fc2c4475f1d708be437119eaf417d4bd40fe', class: "heading" }, getHeading(this.heading, this.type, this.language)), h("slot", { key: 'eefb5b4c640286a31c1ce7897c455b813c22c5fc' }))));
+        return (h(Host, { key: 'ddc015eda0b634de30943dd46f558e9a22178947' }, h("div", { key: '4b99ac3cb7c04695722b7ccc02112b6cb0a93cbf', class: "side", role: "presentation" }, h("limel-icon", { key: '7909ecad8de51938085e4d4e3ebebde8e40ac2bf', name: getIcon(this.icon, this.type) })), h("div", { key: '6edb1484b65dd185f38746f0f98f8004fcaadbbf', class: "main" }, h("h1", { key: '7bda16bedf50947c55ef10b3c6e24389fc738117', class: "heading" }, getHeading(this.heading, this.type, this.language)), h("slot", { key: '09b4acf6a2d87acbb51ed47ba58cf4b026e818fe' }))));
     }
 };
 Callout.style = calloutCss();

package/dist/esm/limel-card.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-Bnc9lzk2.js';
-import { I as ImageTemplate } from './image.template-wqMwmOF-.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-BU9IJqli.js';
+import { I as ImageTemplate } from './image.template-BGjw97m_.js';
 import { i as isItem } from './is-item-CrvUOVvg.js';
 import { g as getIconName } from './get-icon-props-CgNJbSP4.js';
 import { g as getMouseEventHandlers } from './3d-tilt-hover-effect-CllX3RLB.js';
@@ -85,10 +85,11 @@ const Card = class {
             if (event.target !== event.currentTarget) {
                 return;
             }
-            if (event.key === 'Enter' || event.key === ' ') {
-                event.preventDefault();
-                this.host.click();
+            if (!(event.key === 'Enter' || event.key === ' ')) {
+                return;
             }
+            event.preventDefault();
+            this.host.click();
         };
     }
     componentWillLoad() {
@@ -107,7 +108,7 @@ const Card = class {
         this.setMarkdownElement(this.markdownElement);
     }
     render() {
-        return (h(Host, { key: '63ae4189bacb17d95d9266a2e92a2d3d754ca0ef', onMouseEnter: this.show3dEffect ? this.handleMouseEnter : undefined, onMouseLeave: this.show3dEffect ? this.handleMouseLeave : undefined }, h("section", { key: 'd87eb9dfe663e0a1b224a928f825c001c0d4b490', tabindex: this.clickable ? 0 : undefined, role: this.clickable ? 'button' : undefined, "aria-pressed": this.clickable ? String(this.selected) : undefined, onKeyDown: this.clickable ? this.handleKeyDown : undefined }, this.renderImage(), h("div", { key: '7c43b49502c9532da33282b01800c3eab0291495', class: "body" }, this.renderHeader(), this.renderSlot(), this.renderValue(), this.renderActionBar()), this.show3dEffect && h("limel-3d-hover-effect-glow", { key: '32a4317d29dfeb8efed401aa5e4830bc2d28cbcd' }))));
+        return (h(Host, { key: '4e496b56cdab851ab0f002e18f6c5d86be22b5f0', onMouseEnter: this.show3dEffect ? this.handleMouseEnter : undefined, onMouseLeave: this.show3dEffect ? this.handleMouseLeave : undefined }, h("section", { key: 'a4d804f65b3991e0e328f6ea178e5b2f46e442c6', tabindex: this.clickable ? 0 : undefined, role: this.clickable ? 'button' : undefined, "aria-pressed": this.clickable ? String(this.selected) : undefined, onKeyDown: this.clickable ? this.handleKeyDown : undefined }, this.renderImage(), h("div", { key: '16b92c4f9edf683d03127508aeff3650c16b2abf', class: "body" }, this.renderHeader(), this.renderSlot(), this.renderValue(), this.renderActionBar()), this.show3dEffect && h("limel-3d-hover-effect-glow", { key: 'b2da47d92903869e46196bd2eaf05e259ce1abff' }))));
     }
     renderImage() {
         var _a;
@@ -125,10 +126,10 @@ const Card = class {
     renderIcon() {
         var _a;
         const icon = getIconName(this.icon);
-        const color = typeof this.icon === 'string' ? undefined : (_a = this.icon) === null || _a === void 0 ? void 0 : _a.color;
         if (!icon) {
             return;
         }
+        const color = typeof this.icon === 'string' ? undefined : (_a = this.icon) === null || _a === void 0 ? void 0 : _a.color;
         return (h("limel-icon", { style: {
                 color: `${color}`,
             }, badge: true, name: icon }));