@limetech/lime-elements 39.17.3 → 39.19.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [39.19.0](https://github.com/Lundalogik/lime-elements/compare/v39.18.0...v39.19.0) (2026-04-29)
+
+### Features
+
+
+* **list:** add a custom CSS prop for controlling images' object fit ([dcc58d9](https://github.com/Lundalogik/lime-elements/commit/dcc58d9d9abd9c450f314c4d97688958689185b8))
+
+## [39.18.0](https://github.com/Lundalogik/lime-elements/compare/v39.17.3...v39.18.0) (2026-04-28)
+
+### Features
+
+
+* **icons:** allow 3rd party packages to provide icon names for auto completion ([396dc20](https://github.com/Lundalogik/lime-elements/commit/396dc2066da450c7dc971d931573971237e004e0)), closes [Lundalogik/crm-client#622](https://github.com/Lundalogik/crm-client/issues/622)
+
 ## [39.17.3](https://github.com/Lundalogik/lime-elements/compare/v39.17.2...v39.17.3) (2026-04-27)
 
 ### Bug Fixes

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

@@ -22,7 +22,7 @@ const Banner = class {
         this.isOpen = false;
     }
     render() {
-        return (index.h("div", { key: '4c52de06b1d1710e79d2fbe729c76b49c7a4dae9', class: `lime-banner ${this.isOpen ? 'lime-banner--open' : ''}` }, index.h("div", { key: '2085a6a5d07c036642646f6cb9cab56e7f86f48a', class: "lime-banner__surface" }, index.h("div", { key: '0b021548bdee32661d458a88e0472a6a1ef0f195', class: "lime-banner__content" }, index.h("div", { key: '65db98d6d60fdf856871e68c6c3bdaa55fb87526', class: "icon-message" }, this.renderIcon(), index.h("div", { key: '94eb50955800bc6a18c49bed8d6fd949909cf5bd' }, this.message)), index.h("div", { key: '8331420f88b294bb1a21682ca1446704e9dc0ffb', class: "lime-banner__actions" }, index.h("slot", { key: 'b784df0968fa19c093c3c0db6de980d6472154d4', name: "buttons" }))))));
+        return (index.h("div", { key: '7aa9f02c71a64eebf5afcbff9ef819addcd44217', class: `lime-banner ${this.isOpen ? 'lime-banner--open' : ''}` }, index.h("div", { key: 'c381d72fd3cec7bb82a244a2a38ba410870cfd9e', class: "lime-banner__surface" }, index.h("div", { key: '307b2422ac6391bb1a2afc4764c65211567ad935', class: "lime-banner__content" }, index.h("div", { key: '5f072a6979f5065d11472ae14cf1ad3171b0375e', class: "icon-message" }, this.renderIcon(), index.h("div", { key: '204b58d8a3d3a201aee68e8e5395bd8fa583a42e' }, this.message)), index.h("div", { key: '2637122052a4b16ed79b0cd3ac53841fea95ee64', class: "lime-banner__actions" }, index.h("slot", { key: '5950d12303938141671578dff146caf2434b3614', name: "buttons" }))))));
     }
     renderIcon() {
         if (!this.icon) {

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

@@ -671,7 +671,7 @@ const InputField = class {
         if (ariaControls) {
             properties['aria-controls'] = ariaControls;
         }
-        return (index.h(index.Host, { key: 'be352ea1f105d4c3f77b567de32626488ea4a60b' }, index.h("limel-notched-outline", { key: '0bae1383ad7421ffdc3468bbfc79af59d7c2e3cb', 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 }, index.h("label", { key: '3667d9fbf90227232d8089a421455c7ab72e4202', 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 (index.h(index.Host, { key: '9d9f875efe46cf089691d76d8ee2ae3962bd7e61' }, index.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 }, index.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()));
     }
     valueWatcher(newValue) {
         if (!this.mdcTextField) {

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

@@ -45,12 +45,12 @@ const Button = class {
         makeEnterClickable.removeEnterClickable(this.host);
     }
     render() {
-        return (index.h(index.Host, { key: '4d575a67e902fe7e6af291ea9b6df5aa9d83ba29', onClick: this.filterClickWhenDisabled }, index.h("button", { key: '887b9453b5a707db5239f499118d2bb27cc65c1a', class: {
+        return (index.h(index.Host, { key: '0c409d801aa06800490755411975a2c47fe81331', onClick: this.filterClickWhenDisabled }, index.h("button", { key: 'd6f001cc42e8ffcf0986896e546a4f9349415160', 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(), index.h("svg", { key: 'd2b52f207f0d6c6af0c55ee7585f3b12a0ee4832', 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(), index.h("svg", { key: '1a43254ec41997b2218ae39050605402685a66ed', viewBox: "0 0 30 30" }, this.renderLoadingIcons()))));
     }
     loadingWatcher(newValue, oldValue) {
         const hasFinishedLoading = this.hasFinishedLoading(newValue, oldValue);

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

@@ -106,7 +106,7 @@ const Card = class {
         this.setMarkdownElement(this.markdownElement);
     }
     render() {
-        return (index.h(index.Host, { key: 'fbb3c4a47fe819511f56bf250b52a5effdf64f15', onMouseEnter: this.show3dEffect ? this.handleMouseEnter : undefined, onMouseLeave: this.show3dEffect ? this.handleMouseLeave : undefined }, index.h("section", { key: '735df6ada728adabd822698395a280742a49cee2', 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(), index.h("div", { key: '2382833712ee8e01bbd702b30b10ea6d3a0f7dcb', class: "body" }, this.renderHeader(), this.renderSlot(), this.renderValue(), this.renderActionBar()), this.show3dEffect && index.h("limel-3d-hover-effect-glow", { key: 'd13545dc6829b59bce0d870dfdeed409f2608529' }))));
+        return (index.h(index.Host, { key: 'a60b363b72cba953f51716c4f7d31d9e40b0e442', onMouseEnter: this.show3dEffect ? this.handleMouseEnter : undefined, onMouseLeave: this.show3dEffect ? this.handleMouseLeave : undefined }, index.h("section", { key: '88b34aaf325184ee1fd89e0b940652a8036f0b46', 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(), index.h("div", { key: '229fe4c0a4ed0f93ff4687c787655b4b96d3a424', class: "body" }, this.renderHeader(), this.renderSlot(), this.renderValue(), this.renderActionBar()), this.show3dEffect && index.h("limel-3d-hover-effect-glow", { key: 'd9ca3097a18c0c7af6cb6bee0afb1b23df23332a' }))));
     }
     renderImage() {
         var _a;

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

@@ -150,7 +150,7 @@ const Chip = class {
         makeEnterClickable.removeEnterClickable(this.host);
     }
     render() {
-        return (index.h(index.Host, { key: 'ff0578a9545aa295b7a5c58dd7c17605e4a8acc2', onClick: this.filterClickWhenDisabled }, this.link ? this.renderAsLink() : this.renderAsButton()));
+        return (index.h(index.Host, { key: '32f0df7f6665bd8b7ae90c423e1052b60a6f3823', onClick: this.filterClickWhenDisabled }, this.link ? this.renderAsLink() : this.renderAsButton()));
     }
     renderPicture() {
         var _a, _b;
@@ -558,7 +558,7 @@ const ChipSet = class {
             });
         }
         const value = this.getValue();
-        return (index.h(index.Host, { key: 'cc38b12787a887fa3cf6d54412d460fffdc10d37' }, index.h("limel-notched-outline", { key: '363ee1953a0880a987acbaeb75ad7682c03c26ec', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid || this.isInvalid(), disabled: this.disabled, readonly: this.readonly, hasValue: !!((_a = this.value) === null || _a === void 0 ? void 0 : _a.length), hasLeadingIcon: !!this.leadingIcon, hasFloatingLabel: this.floatLabelAbove() }, index.h("div", Object.assign({ key: 'c05be9685e36d5283791bf30aceb937f8da0c0a0', slot: "content" }, this.getContentProps(), { class: classes }), this.renderContent(value))), this.renderHelperLine()));
+        return (index.h(index.Host, { key: '61cf1dbed2cf2009e119636c738ac14e825a7a9d' }, index.h("limel-notched-outline", { key: '0443dd8d4a39fbc53e879027633bc06eb99dab6f', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid || this.isInvalid(), disabled: this.disabled, readonly: this.readonly, hasValue: !!((_a = this.value) === null || _a === void 0 ? void 0 : _a.length), hasLeadingIcon: !!this.leadingIcon, hasFloatingLabel: this.floatLabelAbove() }, index.h("div", Object.assign({ key: '7c48b63a8b06b5a8d405fb3966deba769e100169', slot: "content" }, this.getContentProps(), { class: classes }), this.renderContent(value))), this.renderHelperLine()));
     }
     getContentProps() {
         if (this.type === 'input') {

package/dist/cjs/limel-collapsible-section.cjs.entry.js

@@ -99,7 +99,7 @@ const CollapsibleSection = class {
         makeEnterClickable.removeEnterClickable(button);
     }
     render() {
-        return (index.h("section", { key: 'a40f48753cc7e5ae281b0e2a169e19510e54cc55', class: `${this.isOpen ? 'open' : ''}`, "aria-invalid": this.invalid, "aria-labelledby": this.header ? this.headingId : null }, index.h("header", { key: '55784166942971de68e351914a6d96dc77ea75c4' }, index.h("button", { key: '0432b0b5a4af99b94fea4073de496785c8f87d36', class: "open-close-toggle", onClick: this.onClick, "aria-controls": this.bodyId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.getCollapsibleSectionAriaLabel(), type: "button" }), this.renderExpandCollapseSign(), this.renderIcon(), this.renderHeading(), index.h("div", { key: '11efcd91907a79ed0945749b4672809e466c1e00', class: "divider-line", role: "presentation" }), this.renderHeaderSlot(), this.renderActions()), index.h("div", { key: '4b74f9d5fc9533eb14180a23e20c402a436b53f7', class: "body", "aria-hidden": String(!this.isOpen), id: this.bodyId, role: "region" }, index.h("slot", { key: '42c969ae7787768247a41952f9cf6d528ca7d4fd' }))));
+        return (index.h("section", { key: '0ecf7d54f66065288472a96f4d3da5949219188a', class: `${this.isOpen ? 'open' : ''}`, "aria-invalid": this.invalid, "aria-labelledby": this.header ? this.headingId : null }, index.h("header", { key: 'b9ece52c89f5969a25a858d9bdf163a9e6de75d7' }, index.h("button", { key: '2a295e3b926627a8657362d4a2928752e758fd96', class: "open-close-toggle", onClick: this.onClick, "aria-controls": this.bodyId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.getCollapsibleSectionAriaLabel(), type: "button" }), this.renderExpandCollapseSign(), this.renderIcon(), this.renderHeading(), index.h("div", { key: '3b9d78c189b062264b26d8ca11ae2f0b599cb708', class: "divider-line", role: "presentation" }), this.renderHeaderSlot(), this.renderActions()), index.h("div", { key: '0fff2003ad63654e117a567d350f6909062a88d4', class: "body", "aria-hidden": String(!this.isOpen), id: this.bodyId, role: "region" }, index.h("slot", { key: 'd00ac66e669c70f5b877fc1ed657d35f7f828107' }))));
     }
     renderHeaderSlot() {
         return index.h("slot", { name: "header" });

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

@@ -15,7 +15,7 @@ const Header = class {
         this.subheadingDivider = '·';
     }
     render() {
-        return (index.h(index.Host, { key: '4a94e7808e3b295669faa4711d37f8d9ed50b006' }, index.h("div", { key: '7c02e31819ddac504b5c58b6200c00a621079990', class: "information" }, this.renderIcon(), index.h("div", { key: 'b38172e5332ee39476bd19f7ad4f0ce127cc30d6', class: "headings" }, index.h("h1", { key: '9ee1f899ba0f403a588e0dbca52d82c1c12e355e', class: "heading", title: this.heading }, this.heading), index.h("h2", { key: '49b81ef3a96a9c2f7fa27ec2d13a15907131624e', class: "subheading", title: this.subheading }, this.subheading, this.renderSupportingText()))), index.h("slot", { key: '29984270ca745ce430deef27704b9c63065c2964', name: "actions" }, index.h("slot", { key: '1c3b766dc1444a0255ea605359b25d148d25ba57' }))));
+        return (index.h(index.Host, { key: '9187592e41befbd12fbef3bb4c8b5cb6bc6bed25' }, index.h("div", { key: '2a667a272a2e9fc4de7be1708abf34806174c33f', class: "information" }, this.renderIcon(), index.h("div", { key: '4dac266d2bfd7435f8b31cb1f1f85cf7ea4f66bd', class: "headings" }, index.h("h1", { key: 'f60ebe3ca473586291c806ce025df8e05a9468c4', class: "heading", title: this.heading }, this.heading), index.h("h2", { key: '37db047610cf146c8c738dc87911678144e90466', class: "subheading", title: this.subheading }, this.subheading, this.renderSupportingText()))), index.h("slot", { key: '3bb8cc3adb53bc3ed9216cd568af490ec93a2c96', name: "actions" }, index.h("slot", { key: '5f3caca6968905f52717c3ffb5c18a097ba7808e' }))));
     }
     renderIcon() {
         var _a, _b, _c, _d, _e;

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: '0df3febef19dcdb72c7c7f3740090414b313be51', onClick: this.filterClickWhenDisabled }, index.h("button", Object.assign({ key: '119641239ebd336ca5af28ce3452c940a552eccb', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
+        return (index.h(index.Host, { key: 'ffea4e0d48339c908b3ae9afc4d3b46922189ad6', onClick: this.filterClickWhenDisabled }, index.h("button", Object.assign({ key: 'e4689ca52a6c0c81ddb6e9637584fe140846025b', "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-list-item.cjs.entry.js

@@ -6,7 +6,7 @@ var randomString = require('./random-string-BTzDB2ee.js');
 var checkbox_template = require('./checkbox.template-CHtKKyY1.js');
 var translations = require('./translations-D4j_eojG.js');
 
-const listItemCss = () => `@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}.boolean-input{--limel-boolean-input-box-size:1.25rem;--limel-boolean-input-gap-size:0.5rem;position:relative;isolation:isolate;display:flex;align-items:center;min-height:var(--limel-checkbox-min-height, 2.5rem);width:100%}.boolean-input input[type=checkbox],.boolean-input input[type=radio]{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;-webkit-appearance:none;-moz-appearance:none;appearance:none}label.boolean-input-label{min-width:var(--limel-boolean-input-box-size);min-height:var(--limel-boolean-input-box-size);padding-top:0.125rem;cursor:pointer;position:relative;width:100%;overflow-wrap:var(--limel-boolean-input-label-overflow-wrap, normal);font-size:var(--limel-theme-default-small-font-size);color:var(--limel-theme-text-primary-on-background-color);padding-left:calc(var(--limel-boolean-input-box-size) + var(--limel-boolean-input-gap-size))}.disabled:not([readonly]):not([readonly=true]) label.boolean-input-label{cursor:not-allowed;color:var(--limel-theme-text-disabled-color)}.required label.boolean-input-label:after{margin-left:0.0625rem;content:"*"}.invalid:not(.readonly) label.boolean-input-label{color:var(--limel-theme-error-text-color)}:host(limel-checkbox.hide-label) label.boolean-input-label,.hide-label label.boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}.box{position:absolute;pointer-events:none;transition:border-color 0.4s ease 0.2s, background-color 0.2s ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease;display:inline-block;vertical-align:middle;width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);margin-right:var(--limel-boolean-input-gap-size);border-radius:var(--limel-boolean-input-box-border-radius);border:0.125rem solid;border-color:var(--checkbox-unchecked-border-color, rgb(var(--contrast-900)));background-color:var(--limel-checkbox-background-color, rgb(var(--contrast-300)));}.checked .box,.boolean-input>input[type=checkbox]:checked+.box,.boolean-input>input[type=radio]:checked+.box{background-color:var(--lime-primary-color, var(--limel-theme-primary-color));border-color:var(--lime-primary-color, var(--limel-theme-primary-color))}.disabled .box{opacity:0.4}.box{}.boolean-input:not(.disabled):hover .box{will-change:box-shadow;box-shadow:var(--button-shadow-hovered)}.boolean-input:not(.disabled):active .box{will-change:box-shadow;box-shadow:var(--button-shadow-pressed)}.box:before{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);content:"";position:absolute;inset:-0.1875rem;border-radius:inherit;}.boolean-input>input[type=checkbox]:focus-visible+.box:before,.boolean-input>input[type=radio]:focus-visible+.box:before{will-change:box-shadow;box-shadow:var(--shadow-depth-8-focused)}.box:after{transition:opacity 0.2s ease, width 0.4s ease, box-shadow 0.6s cubic-bezier(0.68, -0.55, 0, 1.87), transform 0.6s cubic-bezier(0.68, -0.55, 0, 1.87);content:"";position:absolute;inset:0;margin:auto;border-radius:1rem;opacity:0;background-color:rgb(var(--color-white));}.boolean-input:not(.disabled):hover .box:after{will-change:opacity, box-shadow, transform, width}:host(limel-checkbox){--limel-boolean-input-label-overflow-wrap:var(       --checkbox-label-overflow-wrap,       normal   );min-height:var(--limel-checkbox-min-height, 2.5rem)}.box:after{height:0.125rem;width:0.25rem}.indeterminate .box:after{opacity:1;width:calc(var(--limel-boolean-input-box-size) - 0.5rem)}.checkbox{--limel-boolean-input-box-border-radius:0.25rem}.checkbox svg.check-mark{position:absolute;z-index:1;inset:0;transform:translate3d(-0.125rem, -0.125rem, 0);width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);padding:0.25rem;color:rgb(var(--color-white));opacity:0;stroke-width:0.1875rem;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}.checkbox svg.check-mark path{stroke-dashoffset:29.7833;stroke-dasharray:29.7833;transition:stroke-dashoffset 180ms cubic-bezier(0.4, 0, 0.6, 1)}.checkbox{}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark{opacity:1}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark path{stroke-dashoffset:0}limel-dynamic-label{margin-top:0.375rem;margin-left:-0.25rem}:host(limel-checkbox:focus),:host(limel-checkbox:focus-visible),:host(limel-checkbox:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-checkbox){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-checkbox:focus) limel-helper-line,:host(limel-checkbox:focus-visible) limel-helper-line,:host(limel-checkbox:focus-within) limel-helper-line,:host(limel-checkbox:hover) limel-helper-line{will-change:grid-template-rows}*,*:before,*:after{box-sizing:border-box}limel-list-item{min-height:2.5rem}limel-list-item:focus{outline:none}limel-list-item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}limel-list-item{transition:background-color 0.6s ease;position:relative;isolation:isolate;display:flex;align-items:center;gap:0.5rem;padding:0 1rem;background-color:rgb(var(--contrast-100))}limel-list-item:hover{z-index:1;transition:background-color 0.2s ease;border-radius:0.5rem}limel-list-item:focus,limel-list-item:focus-visible,limel-list-item:active{z-index:1;border-radius:0.5rem}limel-list-item:first-of-type{border-top-left-radius:0.5rem;border-top-right-radius:0.5rem}limel-list-item:last-of-type{border-bottom-left-radius:0.5rem;border-bottom-right-radius:0.5rem}limel-list-item:not([disabled]):not([disabled=true]){cursor:pointer}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]) .text,limel-list-item[disabled]:not([disabled=false]) limel-icon,limel-list-item[disabled]:not([disabled=false]) img,limel-list-item[disabled]:not([disabled=false]) .boolean-input{opacity:0.4}limel-list-item:not([disabled]):not([disabled=true]):hover,limel-list-item:not([disabled]):not([disabled=true]):focus-visible{background-color:rgb(var(--contrast-400))}limel-list-item[type=option]:before{transition:background-color 0.6s ease;content:"";position:absolute;inset:0;opacity:0.2;border-radius:0.5rem}limel-list-item[type=option][selected]:not([selected=false]):before{transition:background-color 0.2s ease;background-color:var(--limel-theme-primary-color)}limel-list-item .text{flex-grow:1;min-width:0;display:flex;flex-direction:column;padding:0.5rem 0;color:var(--limel-theme-text-primary-on-background-color)}limel-list-item .label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--limel-theme-default-font-size);line-height:1rem}limel-list-item .description{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:var(--maxLinesSecondaryText);line-height:1rem;font-size:var(--limel-theme-default-small-font-size);opacity:0.6}limel-list-item limel-icon{color:var(--limel-theme-text-secondary-on-background-color);flex-shrink:0;margin-left:-0.5rem}limel-list-item limel-icon:has(+img){margin-left:0;position:absolute;top:0.125rem;left:0.125rem;padding:0.1875rem;width:1.25rem;background-color:rgb(var(--contrast-200), 0.8)}limel-list-item img{flex-shrink:0;object-fit:cover;border-radius:var(--list-item-image-border-radius, 50%);width:2rem;height:2rem;box-shadow:0 0 0 1px rgb(var(--contrast-800), 0.5)}limel-list-item limel-menu{margin-right:-0.5rem;order:var(--limel-list-item-menu-order, 3)}limel-list-item[role=menuitem] limel-list-item .label{font-size:var(--limel-theme-default-small-font-size)}.boolean-input,limel-radio-button{width:var(--limel-boolean-input-box-size) !important;margin-left:-0.25rem !important}.boolean-input.checkbox{margin-right:0.25rem}limel-list-item:has(limel-icon) .boolean-input,limel-list-item:has(img) .boolean-input{margin-right:-0.25rem;margin-left:0;order:2}.boolean-input .boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}`;
+const listItemCss = () => `@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}.boolean-input{--limel-boolean-input-box-size:1.25rem;--limel-boolean-input-gap-size:0.5rem;position:relative;isolation:isolate;display:flex;align-items:center;min-height:var(--limel-checkbox-min-height, 2.5rem);width:100%}.boolean-input input[type=checkbox],.boolean-input input[type=radio]{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;-webkit-appearance:none;-moz-appearance:none;appearance:none}label.boolean-input-label{min-width:var(--limel-boolean-input-box-size);min-height:var(--limel-boolean-input-box-size);padding-top:0.125rem;cursor:pointer;position:relative;width:100%;overflow-wrap:var(--limel-boolean-input-label-overflow-wrap, normal);font-size:var(--limel-theme-default-small-font-size);color:var(--limel-theme-text-primary-on-background-color);padding-left:calc(var(--limel-boolean-input-box-size) + var(--limel-boolean-input-gap-size))}.disabled:not([readonly]):not([readonly=true]) label.boolean-input-label{cursor:not-allowed;color:var(--limel-theme-text-disabled-color)}.required label.boolean-input-label:after{margin-left:0.0625rem;content:"*"}.invalid:not(.readonly) label.boolean-input-label{color:var(--limel-theme-error-text-color)}:host(limel-checkbox.hide-label) label.boolean-input-label,.hide-label label.boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}.box{position:absolute;pointer-events:none;transition:border-color 0.4s ease 0.2s, background-color 0.2s ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease;display:inline-block;vertical-align:middle;width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);margin-right:var(--limel-boolean-input-gap-size);border-radius:var(--limel-boolean-input-box-border-radius);border:0.125rem solid;border-color:var(--checkbox-unchecked-border-color, rgb(var(--contrast-900)));background-color:var(--limel-checkbox-background-color, rgb(var(--contrast-300)));}.checked .box,.boolean-input>input[type=checkbox]:checked+.box,.boolean-input>input[type=radio]:checked+.box{background-color:var(--lime-primary-color, var(--limel-theme-primary-color));border-color:var(--lime-primary-color, var(--limel-theme-primary-color))}.disabled .box{opacity:0.4}.box{}.boolean-input:not(.disabled):hover .box{will-change:box-shadow;box-shadow:var(--button-shadow-hovered)}.boolean-input:not(.disabled):active .box{will-change:box-shadow;box-shadow:var(--button-shadow-pressed)}.box:before{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);content:"";position:absolute;inset:-0.1875rem;border-radius:inherit;}.boolean-input>input[type=checkbox]:focus-visible+.box:before,.boolean-input>input[type=radio]:focus-visible+.box:before{will-change:box-shadow;box-shadow:var(--shadow-depth-8-focused)}.box:after{transition:opacity 0.2s ease, width 0.4s ease, box-shadow 0.6s cubic-bezier(0.68, -0.55, 0, 1.87), transform 0.6s cubic-bezier(0.68, -0.55, 0, 1.87);content:"";position:absolute;inset:0;margin:auto;border-radius:1rem;opacity:0;background-color:rgb(var(--color-white));}.boolean-input:not(.disabled):hover .box:after{will-change:opacity, box-shadow, transform, width}:host(limel-checkbox){--limel-boolean-input-label-overflow-wrap:var(       --checkbox-label-overflow-wrap,       normal   );min-height:var(--limel-checkbox-min-height, 2.5rem)}.box:after{height:0.125rem;width:0.25rem}.indeterminate .box:after{opacity:1;width:calc(var(--limel-boolean-input-box-size) - 0.5rem)}.checkbox{--limel-boolean-input-box-border-radius:0.25rem}.checkbox svg.check-mark{position:absolute;z-index:1;inset:0;transform:translate3d(-0.125rem, -0.125rem, 0);width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);padding:0.25rem;color:rgb(var(--color-white));opacity:0;stroke-width:0.1875rem;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}.checkbox svg.check-mark path{stroke-dashoffset:29.7833;stroke-dasharray:29.7833;transition:stroke-dashoffset 180ms cubic-bezier(0.4, 0, 0.6, 1)}.checkbox{}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark{opacity:1}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark path{stroke-dashoffset:0}limel-dynamic-label{margin-top:0.375rem;margin-left:-0.25rem}:host(limel-checkbox:focus),:host(limel-checkbox:focus-visible),:host(limel-checkbox:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-checkbox){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-checkbox:focus) limel-helper-line,:host(limel-checkbox:focus-visible) limel-helper-line,:host(limel-checkbox:focus-within) limel-helper-line,:host(limel-checkbox:hover) limel-helper-line{will-change:grid-template-rows}*,*:before,*:after{box-sizing:border-box}limel-list-item{min-height:2.5rem}limel-list-item:focus{outline:none}limel-list-item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}limel-list-item{transition:background-color 0.6s ease;position:relative;isolation:isolate;display:flex;align-items:center;gap:0.5rem;padding:0 1rem;background-color:rgb(var(--contrast-100))}limel-list-item:hover{z-index:1;transition:background-color 0.2s ease;border-radius:0.5rem}limel-list-item:focus,limel-list-item:focus-visible,limel-list-item:active{z-index:1;border-radius:0.5rem}limel-list-item:first-of-type{border-top-left-radius:0.5rem;border-top-right-radius:0.5rem}limel-list-item:last-of-type{border-bottom-left-radius:0.5rem;border-bottom-right-radius:0.5rem}limel-list-item:not([disabled]):not([disabled=true]){cursor:pointer}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]) .text,limel-list-item[disabled]:not([disabled=false]) limel-icon,limel-list-item[disabled]:not([disabled=false]) img,limel-list-item[disabled]:not([disabled=false]) .boolean-input{opacity:0.4}limel-list-item:not([disabled]):not([disabled=true]):hover,limel-list-item:not([disabled]):not([disabled=true]):focus-visible{background-color:rgb(var(--contrast-400))}limel-list-item[type=option]:before{transition:background-color 0.6s ease;content:"";position:absolute;inset:0;opacity:0.2;border-radius:0.5rem}limel-list-item[type=option][selected]:not([selected=false]):before{transition:background-color 0.2s ease;background-color:var(--limel-theme-primary-color)}limel-list-item .text{flex-grow:1;min-width:0;display:flex;flex-direction:column;padding:0.5rem 0;color:var(--limel-theme-text-primary-on-background-color)}limel-list-item .label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--limel-theme-default-font-size);line-height:1rem}limel-list-item .description{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:var(--maxLinesSecondaryText);line-height:1rem;font-size:var(--limel-theme-default-small-font-size);opacity:0.6}limel-list-item limel-icon{color:var(--limel-theme-text-secondary-on-background-color);flex-shrink:0;margin-left:-0.5rem}limel-list-item limel-icon:has(+img){margin-left:0;position:absolute;top:0.125rem;left:0.125rem;padding:0.1875rem;width:1.25rem;background-color:rgb(var(--contrast-200), 0.8)}limel-list-item img{flex-shrink:0;object-fit:var(--list-item-image-object-fit, cover);border-radius:var(--list-item-image-border-radius, 50%);width:2rem;height:2rem;box-shadow:0 0 0 1px rgb(var(--contrast-800), 0.5)}limel-list-item limel-menu{margin-right:-0.5rem;order:var(--limel-list-item-menu-order, 3)}limel-list-item[role=menuitem] limel-list-item .label{font-size:var(--limel-theme-default-small-font-size)}.boolean-input,limel-radio-button{width:var(--limel-boolean-input-box-size) !important;margin-left:-0.25rem !important}.boolean-input.checkbox{margin-right:0.25rem}limel-list-item:has(limel-icon) .boolean-input,limel-list-item:has(img) .boolean-input{margin-right:-0.25rem;margin-left:0;order:2}.boolean-input .boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}`;
 
 const ListItemComponent = class {
     constructor(hostRef) {

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

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

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

@@ -48,7 +48,7 @@ const Shortcut = class {
     render() {
         var _a, _b, _c, _d, _e;
         const rel = linkHelper.getRel((_a = this.link) === null || _a === void 0 ? void 0 : _a.target, (_b = this.link) === null || _b === void 0 ? void 0 : _b.rel);
-        return (index.h(index.Host, { key: 'cfca58724948367892595cd9dd49d4482ac61bf3', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("a", { key: 'f13f91fa379319448a95ca0182f61d375636b952', "aria-disabled": this.disabled, href: (_c = this.link) === null || _c === void 0 ? void 0 : _c.href, target: (_d = this.link) === null || _d === void 0 ? void 0 : _d.target, rel: rel, tabindex: "0", "aria-label": this.getAriaLabel(), title: (_e = this.link) === null || _e === void 0 ? void 0 : _e.title }, index.h("limel-icon", { key: '3d5b929acb6a26081626098f69cd29fb70b42faa', name: this.icon }), index.h("limel-3d-hover-effect-glow", { key: '05dd83b54485aa7fdbc103e84f50532313e4b8f0' })), this.renderLabel(), this.renderNotification()));
+        return (index.h(index.Host, { key: 'edf3774fe6e6d8e91866e4517e3614907dd499a0', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("a", { key: '1ed137455023ec2caa34cc2a2c1e893f8178cad4', "aria-disabled": this.disabled, href: (_c = this.link) === null || _c === void 0 ? void 0 : _c.href, target: (_d = this.link) === null || _d === void 0 ? void 0 : _d.target, rel: rel, tabindex: "0", "aria-label": this.getAriaLabel(), title: (_e = this.link) === null || _e === void 0 ? void 0 : _e.title }, index.h("limel-icon", { key: 'c36a0d1d339675309d85e02a342e30d4fd002b58', name: this.icon }), index.h("limel-3d-hover-effect-glow", { key: 'ab9be4306bb4af9b5cb958acbb82a75eb3cfc4d4' })), this.renderLabel(), this.renderNotification()));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -45,9 +45,9 @@ const SplitButton = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: '461a17ec679b6f3e17ae9e89d03ebf00b1c28127', class: {
+        return (index.h(index.Host, { key: 'd76de1269634f7f6c997d60f279d6305eb098469', class: {
                 'has-menu': this.items.length > 0,
-            }, onClick: this.filterClickWhenDisabled }, index.h("limel-button", { key: 'a2493b1f91c1ab1376685f2f9eec5fb8bbc7b1e8', label: this.label, primary: this.primary, icon: this.icon, disabled: this.disabled, loading: this.loading, loadingFailed: this.loadingFailed }), this.renderMenu()));
+            }, onClick: this.filterClickWhenDisabled }, index.h("limel-button", { key: '93b69e21144ab3ee5be1c434032bce972d7d3d54', label: this.label, primary: this.primary, icon: this.icon, disabled: this.disabled, loading: this.loading, loadingFailed: this.loadingFailed }), this.renderMenu()));
     }
     static get delegatesFocus() { return true; }
 };

package/dist/collection/components/banner/banner.js

@@ -20,7 +20,7 @@ export class Banner {
         this.isOpen = false;
     }
     render() {
-        return (h("div", { key: '4c52de06b1d1710e79d2fbe729c76b49c7a4dae9', class: `lime-banner ${this.isOpen ? 'lime-banner--open' : ''}` }, h("div", { key: '2085a6a5d07c036642646f6cb9cab56e7f86f48a', class: "lime-banner__surface" }, h("div", { key: '0b021548bdee32661d458a88e0472a6a1ef0f195', class: "lime-banner__content" }, h("div", { key: '65db98d6d60fdf856871e68c6c3bdaa55fb87526', class: "icon-message" }, this.renderIcon(), h("div", { key: '94eb50955800bc6a18c49bed8d6fd949909cf5bd' }, this.message)), h("div", { key: '8331420f88b294bb1a21682ca1446704e9dc0ffb', class: "lime-banner__actions" }, h("slot", { key: 'b784df0968fa19c093c3c0db6de980d6472154d4', name: "buttons" }))))));
+        return (h("div", { key: '7aa9f02c71a64eebf5afcbff9ef819addcd44217', class: `lime-banner ${this.isOpen ? 'lime-banner--open' : ''}` }, h("div", { key: 'c381d72fd3cec7bb82a244a2a38ba410870cfd9e', class: "lime-banner__surface" }, h("div", { key: '307b2422ac6391bb1a2afc4764c65211567ad935', class: "lime-banner__content" }, h("div", { key: '5f072a6979f5065d11472ae14cf1ad3171b0375e', class: "icon-message" }, this.renderIcon(), h("div", { key: '204b58d8a3d3a201aee68e8e5395bd8fa583a42e' }, this.message)), h("div", { key: '2637122052a4b16ed79b0cd3ac53841fea95ee64', class: "lime-banner__actions" }, h("slot", { key: '5950d12303938141671578dff146caf2434b3614', name: "buttons" }))))));
     }
     renderIcon() {
         if (!this.icon) {
@@ -65,9 +65,16 @@ export class Banner {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "IconName",
                     "resolved": "string",
-                    "references": {}
+                    "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        }
+                    }
                 },
                 "required": false,
                 "optional": false,

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

@@ -66,12 +66,12 @@ export class Button {
         removeEnterClickable(this.host);
     }
     render() {
-        return (h(Host, { key: '4d575a67e902fe7e6af291ea9b6df5aa9d83ba29', onClick: this.filterClickWhenDisabled }, h("button", { key: '887b9453b5a707db5239f499118d2bb27cc65c1a', class: {
+        return (h(Host, { key: '0c409d801aa06800490755411975a2c47fe81331', onClick: this.filterClickWhenDisabled }, h("button", { key: 'd6f001cc42e8ffcf0986896e546a4f9349415160', 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: 'd2b52f207f0d6c6af0c55ee7585f3b12a0ee4832', 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: '1a43254ec41997b2218ae39050605402685a66ed', viewBox: "0 0 30 30" }, this.renderLoadingIcons()))));
     }
     loadingWatcher(newValue, oldValue) {
         const hasFinishedLoading = this.hasFinishedLoading(newValue, oldValue);
@@ -227,9 +227,15 @@ export class Button {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string | Icon",
+                    "original": "IconName | Icon",
                     "resolved": "Icon | string",
                     "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        },
                         "Icon": {
                             "location": "import",
                             "path": "../../global/shared-types/icon.types",

package/dist/collection/components/card/card.js

@@ -115,7 +115,7 @@ export class Card {
         this.setMarkdownElement(this.markdownElement);
     }
     render() {
-        return (h(Host, { key: 'fbb3c4a47fe819511f56bf250b52a5effdf64f15', onMouseEnter: this.show3dEffect ? this.handleMouseEnter : undefined, onMouseLeave: this.show3dEffect ? this.handleMouseLeave : undefined }, h("section", { key: '735df6ada728adabd822698395a280742a49cee2', 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: '2382833712ee8e01bbd702b30b10ea6d3a0f7dcb', class: "body" }, this.renderHeader(), this.renderSlot(), this.renderValue(), this.renderActionBar()), this.show3dEffect && h("limel-3d-hover-effect-glow", { key: 'd13545dc6829b59bce0d870dfdeed409f2608529' }))));
+        return (h(Host, { key: 'a60b363b72cba953f51716c4f7d31d9e40b0e442', onMouseEnter: this.show3dEffect ? this.handleMouseEnter : undefined, onMouseLeave: this.show3dEffect ? this.handleMouseLeave : undefined }, h("section", { key: '88b34aaf325184ee1fd89e0b940652a8036f0b46', 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: '229fe4c0a4ed0f93ff4687c787655b4b96d3a424', class: "body" }, this.renderHeader(), this.renderSlot(), this.renderValue(), this.renderActionBar()), this.show3dEffect && h("limel-3d-hover-effect-glow", { key: 'd9ca3097a18c0c7af6cb6bee0afb1b23df23332a' }))));
     }
     renderImage() {
         var _a;
@@ -252,9 +252,15 @@ export class Card {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string | Icon",
+                    "original": "IconName | Icon",
                     "resolved": "Icon | string",
                     "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        },
                         "Icon": {
                             "location": "import",
                             "path": "../../global/shared-types/icon.types",

package/dist/collection/components/chip/chip.js

@@ -175,7 +175,7 @@ export class Chip {
         removeEnterClickable(this.host);
     }
     render() {
-        return (h(Host, { key: 'ff0578a9545aa295b7a5c58dd7c17605e4a8acc2', onClick: this.filterClickWhenDisabled }, this.link ? this.renderAsLink() : this.renderAsButton()));
+        return (h(Host, { key: '32f0df7f6665bd8b7ae90c423e1052b60a6f3823', onClick: this.filterClickWhenDisabled }, this.link ? this.renderAsLink() : this.renderAsButton()));
     }
     renderPicture() {
         var _a, _b;
@@ -315,9 +315,15 @@ export class Chip {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string | Icon",
+                    "original": "IconName | Icon",
                     "resolved": "Icon | string",
                     "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        },
                         "Icon": {
                             "location": "import",
                             "path": "../../global/shared-types/icon.types",

package/dist/collection/components/chip-set/chip-set.js

@@ -269,7 +269,7 @@ export class ChipSet {
             });
         }
         const value = this.getValue();
-        return (h(Host, { key: 'cc38b12787a887fa3cf6d54412d460fffdc10d37' }, h("limel-notched-outline", { key: '363ee1953a0880a987acbaeb75ad7682c03c26ec', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid || this.isInvalid(), disabled: this.disabled, readonly: this.readonly, hasValue: !!((_a = this.value) === null || _a === void 0 ? void 0 : _a.length), hasLeadingIcon: !!this.leadingIcon, hasFloatingLabel: this.floatLabelAbove() }, h("div", Object.assign({ key: 'c05be9685e36d5283791bf30aceb937f8da0c0a0', slot: "content" }, this.getContentProps(), { class: classes }), this.renderContent(value))), this.renderHelperLine()));
+        return (h(Host, { key: '61cf1dbed2cf2009e119636c738ac14e825a7a9d' }, h("limel-notched-outline", { key: '0443dd8d4a39fbc53e879027633bc06eb99dab6f', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid || this.isInvalid(), disabled: this.disabled, readonly: this.readonly, hasValue: !!((_a = this.value) === null || _a === void 0 ? void 0 : _a.length), hasLeadingIcon: !!this.leadingIcon, hasFloatingLabel: this.floatLabelAbove() }, h("div", Object.assign({ key: '7c48b63a8b06b5a8d405fb3966deba769e100169', slot: "content" }, this.getContentProps(), { class: classes }), this.renderContent(value))), this.renderHelperLine()));
     }
     getContentProps() {
         if (this.type === 'input') {
@@ -752,9 +752,16 @@ export class ChipSet {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "IconName",
                     "resolved": "string",
-                    "references": {}
+                    "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        }
+                    }
                 },
                 "required": false,
                 "optional": false,

package/dist/collection/components/collapsible-section/collapsible-section.js

@@ -111,7 +111,7 @@ export class CollapsibleSection {
         removeEnterClickable(button);
     }
     render() {
-        return (h("section", { key: 'a40f48753cc7e5ae281b0e2a169e19510e54cc55', class: `${this.isOpen ? 'open' : ''}`, "aria-invalid": this.invalid, "aria-labelledby": this.header ? this.headingId : null }, h("header", { key: '55784166942971de68e351914a6d96dc77ea75c4' }, h("button", { key: '0432b0b5a4af99b94fea4073de496785c8f87d36', class: "open-close-toggle", onClick: this.onClick, "aria-controls": this.bodyId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.getCollapsibleSectionAriaLabel(), type: "button" }), this.renderExpandCollapseSign(), this.renderIcon(), this.renderHeading(), h("div", { key: '11efcd91907a79ed0945749b4672809e466c1e00', class: "divider-line", role: "presentation" }), this.renderHeaderSlot(), this.renderActions()), h("div", { key: '4b74f9d5fc9533eb14180a23e20c402a436b53f7', class: "body", "aria-hidden": String(!this.isOpen), id: this.bodyId, role: "region" }, h("slot", { key: '42c969ae7787768247a41952f9cf6d528ca7d4fd' }))));
+        return (h("section", { key: '0ecf7d54f66065288472a96f4d3da5949219188a', class: `${this.isOpen ? 'open' : ''}`, "aria-invalid": this.invalid, "aria-labelledby": this.header ? this.headingId : null }, h("header", { key: 'b9ece52c89f5969a25a858d9bdf163a9e6de75d7' }, h("button", { key: '2a295e3b926627a8657362d4a2928752e758fd96', class: "open-close-toggle", onClick: this.onClick, "aria-controls": this.bodyId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.getCollapsibleSectionAriaLabel(), type: "button" }), this.renderExpandCollapseSign(), this.renderIcon(), this.renderHeading(), h("div", { key: '3b9d78c189b062264b26d8ca11ae2f0b599cb708', class: "divider-line", role: "presentation" }), this.renderHeaderSlot(), this.renderActions()), h("div", { key: '0fff2003ad63654e117a567d350f6909062a88d4', class: "body", "aria-hidden": String(!this.isOpen), id: this.bodyId, role: "region" }, h("slot", { key: 'd00ac66e669c70f5b877fc1ed657d35f7f828107' }))));
     }
     renderHeaderSlot() {
         return h("slot", { name: "header" });
@@ -173,9 +173,15 @@ export class CollapsibleSection {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string | Icon",
+                    "original": "IconName | Icon",
                     "resolved": "Icon | string",
                     "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        },
                         "Icon": {
                             "location": "import",
                             "path": "../../global/shared-types/icon.types",

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

@@ -61,7 +61,7 @@ export class Header {
         this.subheadingDivider = '·';
     }
     render() {
-        return (h(Host, { key: '4a94e7808e3b295669faa4711d37f8d9ed50b006' }, h("div", { key: '7c02e31819ddac504b5c58b6200c00a621079990', class: "information" }, this.renderIcon(), h("div", { key: 'b38172e5332ee39476bd19f7ad4f0ce127cc30d6', class: "headings" }, h("h1", { key: '9ee1f899ba0f403a588e0dbca52d82c1c12e355e', class: "heading", title: this.heading }, this.heading), h("h2", { key: '49b81ef3a96a9c2f7fa27ec2d13a15907131624e', class: "subheading", title: this.subheading }, this.subheading, this.renderSupportingText()))), h("slot", { key: '29984270ca745ce430deef27704b9c63065c2964', name: "actions" }, h("slot", { key: '1c3b766dc1444a0255ea605359b25d148d25ba57' }))));
+        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' }))));
     }
     renderIcon() {
         var _a, _b, _c, _d, _e;
@@ -105,9 +105,15 @@ export class Header {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string | Icon",
+                    "original": "IconName | Icon",
                     "resolved": "Icon | string",
                     "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        },
                         "Icon": {
                             "location": "import",
                             "path": "../../global/shared-types/icon.types",

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: '0df3febef19dcdb72c7c7f3740090414b313be51', onClick: this.filterClickWhenDisabled }, h("button", Object.assign({ key: '119641239ebd336ca5af28ce3452c940a552eccb', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
+        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))));
     }
     renderIcon() {
         var _a, _b;
@@ -87,9 +87,15 @@ export class IconButton {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string | Icon",
+                    "original": "IconName | Icon",
                     "resolved": "Icon | string",
                     "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        },
                         "Icon": {
                             "location": "import",
                             "path": "../../global/shared-types/icon.types",

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: 'be352ea1f105d4c3f77b567de32626488ea4a60b' }, h("limel-notched-outline", { key: '0bae1383ad7421ffdc3468bbfc79af59d7c2e3cb', 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: '3667d9fbf90227232d8089a421455c7ab72e4202', 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: '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()));
     }
     valueWatcher(newValue) {
         if (!this.mdcTextField) {
@@ -832,9 +832,16 @@ export class InputField {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "IconName",
                     "resolved": "string",
-                    "references": {}
+                    "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        }
+                    }
                 },
                 "required": false,
                 "optional": false,
@@ -851,9 +858,16 @@ export class InputField {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "IconName",
                     "resolved": "string",
-                    "references": {}
+                    "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        }
+                    }
                 },
                 "required": false,
                 "optional": false,

package/dist/collection/components/list/list.css

@@ -207,6 +207,7 @@
 * @prop --list-background-color-of-even-interactive-items:  Background color of even list items, when `has-striped-rows` class is applied to the component. Defaults to `transparent`.
 * @prop --list-margin: Space around the list. Defaults to `0.25rem`, which visualizes keyboard-focused items in a better way, as it adds some space for the outline effect.
 * @prop --list-item-image-border-radius: Defines the border radius of the list item image. Defaults to `50%`.
+* @prop --list-item-image-object-fit: Defines the object-fit property of the list item image. Defaults to `cover`.
 */
 :host(limel-list) {
   --limel-list-border-radius: 0.5rem;

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

@@ -4,6 +4,7 @@
  * @prop --notification-badge-background-color: (Publicly documented in `limel-menu` too) Defines the background color of notification badges. Defaults to `--color-red-default`.
  * @prop --limel-list-item-menu-order: Defines the order of the menu, within the list item's flexbox. Defaults to `3`.
  * @prop --list-item-image-border-radius: Defines the border radius of the list item image. Defaults to `50%`.
+ * @prop --list-item-image-object-fit: Defines the object-fit property of the list item image. Defaults to `cover`.
  */
 /**
 * Note! This file is forwarded via `src/style/exports.scss`
@@ -108,6 +109,7 @@
  * @prop --notification-badge-background-color: (Publicly documented in `limel-menu` too) Defines the background color of notification badges. Defaults to `--color-red-default`.
  * @prop --limel-list-item-menu-order: Defines the order of the menu, within the list item's flexbox. Defaults to `3`.
  * @prop --list-item-image-border-radius: Defines the border radius of the list item image. Defaults to `50%`.
+ * @prop --list-item-image-object-fit: Defines the object-fit property of the list item image. Defaults to `cover`.
  */
 /**
 * :::important
@@ -142,6 +144,7 @@
  * @prop --notification-badge-background-color: (Publicly documented in `limel-menu` too) Defines the background color of notification badges. Defaults to `--color-red-default`.
  * @prop --limel-list-item-menu-order: Defines the order of the menu, within the list item's flexbox. Defaults to `3`.
  * @prop --list-item-image-border-radius: Defines the border radius of the list item image. Defaults to `50%`.
+ * @prop --list-item-image-object-fit: Defines the object-fit property of the list item image. Defaults to `cover`.
  */
 *,
 *:before,
@@ -518,7 +521,7 @@ limel-list-item limel-icon:has(+ img) {
 }
 limel-list-item img {
   flex-shrink: 0;
-  object-fit: cover;
+  object-fit: var(--list-item-image-object-fit, cover);
   border-radius: var(--list-item-image-border-radius, 50%);
   width: 2rem;
   height: 2rem;

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

@@ -207,6 +207,7 @@
 * @prop --list-background-color-of-even-interactive-items:  Background color of even list items, when `has-striped-rows` class is applied to the component. Defaults to `transparent`.
 * @prop --list-margin: Space around the list. Defaults to `0.25rem`, which visualizes keyboard-focused items in a better way, as it adds some space for the outline effect.
 * @prop --list-item-image-border-radius: Defines the border radius of the list item image. Defaults to `50%`.
+* @prop --list-item-image-object-fit: Defines the object-fit property of the list item image. Defaults to `cover`.
 */
 :host(limel-list) {
   --limel-list-border-radius: 0.5rem;

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

@@ -189,7 +189,7 @@ export class Picker {
             props.maxItems = 1;
         }
         return [
-            h("limel-chip-set", Object.assign({ key: 'd7928164dfd143478fb1b4ed248fdfa6c7c55f68', type: "input", inputType: "search", label: this.label, helperText: this.helperText, leadingIcon: this.leadingIcon, value: this.chips, disabled: this.disabled, invalid: this.invalid, delimiter: this.renderDelimiter(), readonly: this.readonly, required: this.required, searchLabel: this.searchLabel, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, clearAllButton: this.multiple && !this.chipSetEditMode }, props)),
+            h("limel-chip-set", Object.assign({ key: '92d3884770f8e3ce3c747044ab9e6061bc595b1a', type: "input", inputType: "search", label: this.label, helperText: this.helperText, leadingIcon: this.leadingIcon, value: this.chips, disabled: this.disabled, invalid: this.invalid, delimiter: this.renderDelimiter(), readonly: this.readonly, required: this.required, searchLabel: this.searchLabel, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, clearAllButton: this.multiple && !this.chipSetEditMode }, props)),
             this.renderDropdown(),
         ];
     }
@@ -595,9 +595,16 @@ export class Picker {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "IconName",
                     "resolved": "string",
-                    "references": {}
+                    "references": {
+                        "IconName": {
+                            "location": "import",
+                            "path": "../../global/shared-types/icon.types",
+                            "id": "src/global/shared-types/icon.types.ts::IconName",
+                            "referenceLocation": "IconName"
+                        }
+                    }
                 },
                 "required": false,
                 "optional": false,