@limetech/lime-elements 36.1.0-next.14 → 36.1.0-next.15

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-11cd0b60.js';
+import { r as registerInstance, c as createEvent, h } from './index-cdfd351d.js';
 import { c as createRandomString } from './random-string-2246b81e.js';
 
 const dockButtonCss = ".button{all:unset;cursor:pointer;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;box-sizing:border-box;display:flex;align-items:center;position:relative;width:100%;height:var(--dock-item-height);border-radius:0.375rem;font-size:0.875rem;padding:0 0.5rem;min-width:var(--dock-item-height);color:var(--limel-dock-item-text-color);background-color:var(--dock-background-color)}.button:hover{box-shadow:var(--button-shadow-hovered)}.button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.button:focus{outline:none}.button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.button:hover{z-index:1}.button.selected{color:var(--limel-dock-item-text-color--selected);background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)));box-shadow:var(--button-shadow-inset)}.button.selected:focus-visible{box-shadow:var(--button-shadow-inset), var(--shadow-depth-8-focused)}.button.selected .icon{color:var(--limel-dock-item-text--selected)}limel-popover{display:grid;grid-template-columns:100%}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:0.5rem;padding-right:0.75rem}.icon{flex-shrink:0;width:calc(var(--dock-item-height) - 1rem);height:calc(var(--dock-item-height) - 1rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}";
@@ -9,20 +9,6 @@ const DockButton = class {
     this.itemSelected = createEvent(this, "itemSelected", 7);
     this.menuOpen = createEvent(this, "menuOpen", 7);
     this.close = createEvent(this, "close", 7);
-    /**
-     * When the dock is expanded or collapsed, dock items
-     * show labels and tooltips as suitable for the layout.
-     */
-    this.expanded = false;
-    /**
-     * When dock is using mobile layout, dock items
-     * show labels and tooltips as suitable for the layout.
-     */
-    this.useMobileLayout = false;
-    /**
-     * Indicated whether the popover that renders a component is open.
-     */
-    this.isOpen = false;
     this.openPopover = (event) => {
       event.stopPropagation();
       this.isOpen = true;
@@ -45,6 +31,10 @@ const DockButton = class {
         (_c = this.customComponentElement) === null || _c === void 0 ? void 0 : _c.focus();
       }
     };
+    this.item = undefined;
+    this.expanded = false;
+    this.useMobileLayout = false;
+    this.isOpen = false;
     this.tooltipId = createRandomString();
   }
   render() {

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-11cd0b60.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-cdfd351d.js';
 
 const dockCss = ":host(limel-dock){--dock-item-height:2.75rem;--dock-padding:0.25rem;--dock-expand-shrink-button-height:1rem;--limel-dock-item-text-color:var(\n      --dock-item-text-color,\n      rgb(var(--contrast-1100))\n  );--limel-dock-item-text-color--selected:var(\n      --dock-item-text-color--selected,\n      rgb(var(--contrast-1300))\n  );isolation:isolate;position:relative;display:inline-flex;flex-direction:column;background-color:var(--dock-background-color, rgb(var(--contrast-100)));box-shadow:0.1875rem 0 0.375rem -0.125rem rgba(var(--color-black), 0.15), 0.1875rem 0 0.625rem -0.125rem rgba(var(--color-black), 0.05)}:host(limel-dock:not(.has-mobile-layout)){height:100%;width:calc(var(--dock-padding) * 2 + var(--dock-item-height))}:host(limel-dock.expanded){width:var(--dock-expanded-max-width, max-content)}.footer-separator{margin-top:auto;justify-self:flex-end}nav{box-sizing:border-box;display:inline-flex;flex-direction:column;gap:0.375rem;flex-grow:1;padding:var(--dock-padding);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}nav::-webkit-scrollbar{display:none}:host(limel-dock.has-mobile-layout) nav{justify-content:space-between;flex-direction:row}.expand-shrink{all:unset;box-sizing:border-box;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;display:flex;justify-content:center;align-items:center;height:var(--dock-expand-shrink-button-height);padding:0 0.5rem;margin:var(--dock-padding);border-radius:0.375rem}.expand-shrink:hover{box-shadow:var(--button-shadow-hovered)}.expand-shrink:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.expand-shrink:focus{outline:none}.expand-shrink:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.expand-shrink.expanded{justify-content:flex-end}.expand-shrink.expanded limel-icon{transform:rotateY(180deg)}.expand-shrink limel-icon{width:calc(var(--dock-expand-shrink-button-height) - 0.25rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}";
 
@@ -10,45 +10,6 @@ const Dock = class {
     this.menuOpen = createEvent(this, "menuOpen", 7);
     this.close = createEvent(this, "close", 7);
     this.dockExpanded = createEvent(this, "dockExpanded", 7);
-    /**
-     * Items that are placed in the dock.
-     */
-    this.dockItems = [];
-    /**
-     * Items that are placed at the bottom of the dock. (Or at the end in mobile
-     * layout.)
-     */
-    this.dockFooterItems = [];
-    /**
-     * Defines the width of the component, when it loads.
-     * - `true`: shows both icons and labels of the Dock items.
-     * - `false`: only shows icons of the doc items, and displays
-     * their labels as tooltip.
-     *
-     * Note: when `useMobileLayout` is `true`, labels will always
-     * be shown as tooltips. Read more below…
-     */
-    this.expanded = false;
-    /**
-     * Set to `false` if you do not want to allow end-users
-     * to exapnd or shrink the Dock. This will hide the
-     * expand/shrink button, and the only things that defines
-     * the layout will be the `expanded` property, and
-     * the `mobileBreakPoint`.
-     */
-    this.allowResize = true;
-    /**
-     * Defines the breakpoint in pixles, at which the component will be rendered
-     * in a hoizontal layout. Default breakpoint is `700` pixels, which means
-     * when the screen size is smaller than `700px`, the component will automatically
-     * switch to a horizontal layout.
-     */
-    this.mobileBreakPoint = DEFAULT_MOBILE_BREAKPOINT;
-    /**
-     * Is used to render the component horizontally, and place
-     * the Dock items in a row.
-     */
-    this.useMobileLayout = false;
     this.renderSeparator = () => {
       return this.useMobileLayout ? null : h("span", { class: "footer-separator" });
     };
@@ -70,6 +31,13 @@ const Dock = class {
       this.expanded = !this.expanded;
       this.dockExpanded.emit(this.expanded);
     };
+    this.dockItems = [];
+    this.dockFooterItems = [];
+    this.accessibleLabel = undefined;
+    this.expanded = false;
+    this.allowResize = true;
+    this.mobileBreakPoint = DEFAULT_MOBILE_BREAKPOINT;
+    this.useMobileLayout = false;
   }
   componentDidLoad() {
     this.resizeObserver = new ResizeObserver(this.handleResize);

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-11cd0b60.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-cdfd351d.js';
 import { t as translate } from './translations-0d0ee941.js';
 import { c as createRandomString } from './random-string-2246b81e.js';
 import { M as MDCTextField } from './component-288691f3.js';
@@ -402,28 +402,6 @@ const File = class {
     registerInstance(this, hostRef);
     this.change = createEvent(this, "change", 7);
     this.interact = createEvent(this, "interact", 7);
-    /**
-     * Set to `true` to indicate that the field is required.
-     */
-    this.required = false;
-    /**
-     * True if the input should be disabled
-     */
-    this.disabled = false;
-    /**
-     * Set to `true` to disable adding and removing files, but allow interaction
-     * with any already existing file.
-     */
-    this.readonly = false;
-    /**
-     * The [accepted file types](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers)
-     */
-    this.accept = '*';
-    /**
-     * Defines the localisation for translations.
-     */
-    this.language = 'en';
-    this.isDraggingOverDropZone = false;
     this.fileInputId = createRandomString();
     this.handleDragEnter = (event) => {
       this.isDraggingOverDropZone = true;
@@ -438,6 +416,14 @@ const File = class {
       const dataTransfer = event.dataTransfer;
       this.handleFile(dataTransfer.files[0]);
     };
+    this.value = undefined;
+    this.label = undefined;
+    this.required = false;
+    this.disabled = false;
+    this.readonly = false;
+    this.accept = '*';
+    this.language = 'en';
+    this.isDraggingOverDropZone = false;
     this.handleFileSelection = this.handleFileSelection.bind(this);
     this.handleFileChange = this.handleFileChange.bind(this);
     this.handleChipSetChange = this.handleChipSetChange.bind(this);

package/dist/esm/limel-flatpickr-adapter.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-11cd0b60.js';
+import { r as registerInstance, c as createEvent, h } from './index-cdfd351d.js';
 import { t as translate } from './translations-0d0ee941.js';
 import { c as createCommonjsModule, a as commonjsGlobal, g as getDefaultExportFromCjs } from './_commonjsHelpers-5ec8f9b7.js';
 import { D as DateFormatter } from './dateFormatter-784c3334.js';
@@ -7558,16 +7558,13 @@ const DatePickerCalendar = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.change = createEvent(this, "change", 7);
-    /**
-     * Type of date picker.
-     */
+    this.flatPickrCreated = false;
+    this.value = undefined;
     this.type = 'datetime';
-    /**
-     * Defines the localisation for translations and date formatting.
-     * Property `format` customizes the localized date format.
-     */
+    this.format = undefined;
+    this.isOpen = undefined;
+    this.inputElement = undefined;
     this.language = 'en';
-    this.flatPickrCreated = false;
   }
   componentWillLoad() {
     switch (this.type) {

package/dist/esm/limel-flex-container.entry.js

@@ -1,25 +1,13 @@
-import { r as registerInstance, h } from './index-11cd0b60.js';
+import { r as registerInstance, h } from './index-cdfd351d.js';
 
 const flexContainerCss = ":host(limel-flex-container){display:flex}:host(limel-flex-container[hidden]){display:none}:host(limel-flex-container[direction=horizontal]){flex-direction:row}:host(limel-flex-container[direction=horizontal][reverse]){flex-direction:row-reverse}:host(limel-flex-container[direction=vertical]){flex-direction:column}:host(limel-flex-container[direction=vertical][reverse]){flex-direction:column-reverse}:host(limel-flex-container[align=start]){align-items:flex-start}:host(limel-flex-container[align=end]){align-items:flex-end}:host(limel-flex-container[align=center]){align-items:center}:host(limel-flex-container[align=stretch]){align-items:stretch}:host(limel-flex-container[justify=start]){justify-content:flex-start}:host(limel-flex-container[justify=end]){justify-content:flex-end}:host(limel-flex-container[justify=center]){justify-content:center}:host(limel-flex-container[justify=space-between]){justify-content:space-between}:host(limel-flex-container[justify=space-around]){justify-content:space-around}:host(limel-flex-container[justify=space-evenly]){justify-content:space-evenly}:host(limel-flex-container[slot=button]){gap:0.5rem;width:100%;justify-content:flex-end}:host(limel-flex-container[slot=button][direction=horizontal][reverse]){justify-content:flex-start}";
 
 const FlexContainer = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    /**
-     * Direction of the main axis
-     */
     this.direction = 'horizontal';
-    /**
-     * Specify how items are aligned along the main axis
-     */
     this.justify = 'space-between';
-    /**
-     * Specify how items are aligned along the cross axis
-     */
     this.align = 'center';
-    /**
-     * Reverse the order of the items
-     */
     this.reverse = false;
   }
   componentWillLoad() {

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h as h$1, g as getElement } from './index-11cd0b60.js';
+import { r as registerInstance, c as createEvent, h as h$1, g as getElement } from './index-cdfd351d.js';
 import { c as createCommonjsModule, a as commonjsGlobal } from './_commonjsHelpers-5ec8f9b7.js';
 import { k as keys$5, g as getTag$1, m as mapToArray$1, a as isBuffer, b as isTypedArray$1, c as isArguments$3, d as isPrototype$1, e as baseKeys$1, S as Set$2, s as setToArray$1, f as SetCache$1, h as cacheHas$1, i as isEqual$1 } from './isEqual-c5a636a4.js';
 import { i as isArray$4 } from './isArray-80298bc7.js';
@@ -29515,15 +29515,13 @@ const Form = class {
     registerInstance(this, hostRef);
     this.change = createEvent(this, "change", 7);
     this.validate = createEvent(this, "validate", 7);
-    /**
-     * The schema used to render the form
-     */
+    this.isValid = true;
     this.schema = {};
-    /**
-     * Set to `true` to disable the whole form.
-     */
+    this.value = undefined;
     this.disabled = false;
-    this.isValid = true;
+    this.propsFactory = undefined;
+    this.transformErrors = undefined;
+    this.errors = undefined;
     this.handleChange = this.handleChange.bind(this);
     this.getCustomErrorMessages = this.getCustomErrorMessages.bind(this);
   }

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-11cd0b60.js';
+import { r as registerInstance, h } from './index-cdfd351d.js';
 
 const gridCss = ":host{display:block;position:relative}:host([hidden]){display:none}slot{display:grid;grid-template-areas:var(--lime-grid-area, \"\");grid-template-columns:repeat(var(--lime-grid-columns, 4), minmax(0, 1fr));gap:var(--lime-grid-gutter, 1rem);grid-auto-flow:row dense;grid-auto-rows:var(--lime-grid-cell-height, 2.5rem);margin:0;height:100%;width:100%}";
 

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

@@ -1,10 +1,14 @@
-import { r as registerInstance, h } from './index-11cd0b60.js';
+import { r as registerInstance, h } from './index-cdfd351d.js';
 
 const headerCss = ":host(limel-header){display:flex;align-items:center;box-sizing:border-box;width:100%;background-color:var(--header-background-color, rgb(var(--contrast-300)));border-top-left-radius:var(--header-top-right-left-border-radius, 0.75rem);border-top-right-radius:var(--header-top-right-left-border-radius, 0.75rem);padding:0.25rem}.information{display:flex;flex-grow:1;align-items:center;min-width:0}.icon{flex-shrink:0;color:var(--header-icon-color, rgb(var(--contrast-1100)));background-color:var(--header-icon-background-color, transparent);width:1.75rem;margin:0 0.5rem}.headings{min-width:0;margin-left:0.25rem}.heading,.subheading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:0;padding:0}.heading{color:var(--header-heading-color, rgb(var(--contrast-1100)));font-size:1.0625rem}.subheading{color:var(--header-subheading-color, rgb(var(--contrast-900)));font-size:0.875rem;font-weight:lighter}.subheading__supporting-text{color:var(--header-supporting-text-color, var(--header-subheading-color))}.subheading__supporting-text span{margin:0 0.5rem;font-weight:bold}.actions{flex-shrink:0}:host(limel-header.is-narrow){padding:0.125rem 0.25rem}:host(limel-header.is-narrow) .icon{margin-right:0.125rem;width:1.25rem}:host(limel-header.is-narrow) .heading{font-size:0.9375rem}:host(limel-header.has-responsive-layout){display:grid;grid-template-columns:repeat(auto-fit, minmax(clamp(50%, var(--header-responsive-breakpoint, 22rem), 100%), 1fr))}:host(limel-header.has-responsive-layout) .headings{padding-right:0.5rem}:host(limel-header.has-responsive-layout) .actions{display:flex;justify-content:flex-end}";
 
 const Header = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.icon = undefined;
+    this.heading = undefined;
+    this.subheading = undefined;
+    this.supportingText = undefined;
   }
   render() {
     return [

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

@@ -1,18 +1,13 @@
-import { r as registerInstance, h, g as getElement } from './index-11cd0b60.js';
+import { r as registerInstance, h, g as getElement } from './index-cdfd351d.js';
 
 const iconButtonCss = ".mdc-icon-button{font-size:24px;width:48px;height:48px;padding:12px}.mdc-icon-button.mdc-icon-button--reduced-size{width:40px;height:40px;padding:8px}.mdc-icon-button.mdc-icon-button--reduced-size.mdc-icon-button--touch{margin-top:4px;margin-bottom:4px;margin-right:4px;margin-left:4px}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38))}.mdc-icon-button svg,.mdc-icon-button img{width:24px;height:24px}.mdc-icon-button{display:inline-block;position:relative;box-sizing:border-box;border:none;outline:none;background-color:transparent;fill:currentColor;color:inherit;text-decoration:none;cursor:pointer;user-select:none;overflow:visible}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{cursor:default;pointer-events:none}.mdc-icon-button--display-flex{align-items:center;display:inline-flex;justify-content:center}.mdc-icon-button__icon{display:inline-block}.mdc-icon-button__icon.mdc-icon-button__icon--on{display:none}.mdc-icon-button--touch{margin-top:0px;margin-bottom:0px}.mdc-icon-button--on .mdc-icon-button__icon{display:none}.mdc-icon-button--on .mdc-icon-button__icon.mdc-icon-button__icon--on{display:inline-block}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-icon-button{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-icon-button .mdc-icon-button__ripple::before,.mdc-icon-button .mdc-icon-button__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-icon-button .mdc-icon-button__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-icon-button .mdc-icon-button__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-icon-button.mdc-ripple-upgraded .mdc-icon-button__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-icon-button.mdc-ripple-upgraded .mdc-icon-button__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-icon-button.mdc-ripple-upgraded--unbounded .mdc-icon-button__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-icon-button.mdc-ripple-upgraded--foreground-activation .mdc-icon-button__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-icon-button.mdc-ripple-upgraded--foreground-deactivation .mdc-icon-button__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-icon-button .mdc-icon-button__ripple::before,.mdc-icon-button .mdc-icon-button__ripple::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-icon-button.mdc-ripple-upgraded .mdc-icon-button__ripple::before,.mdc-icon-button.mdc-ripple-upgraded .mdc-icon-button__ripple::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-icon-button.mdc-ripple-upgraded .mdc-icon-button__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-icon-button .mdc-icon-button__ripple::before,.mdc-icon-button .mdc-icon-button__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-icon-button:hover .mdc-icon-button__ripple::before,.mdc-icon-button.mdc-ripple-surface--hover .mdc-icon-button__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__ripple::before,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-icon-button:not(.mdc-ripple-upgraded) .mdc-icon-button__ripple::after{transition:opacity 150ms linear}.mdc-icon-button:not(.mdc-ripple-upgraded):active .mdc-icon-button__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-icon-button.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-icon-button .mdc-icon-button__ripple{pointer-events:none;z-index:1}:host([hidden]){display:none}:host([disabled]){pointer-events:none}.mdc-icon-button{transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:2.25rem;width:2.25rem;padding:0.125rem;border-radius:50%;background-color:var(--icon-background-color, transparent)}.mdc-icon-button:hover{box-shadow:var(--button-shadow-hovered)}.mdc-icon-button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}:host([elevated]) .mdc-icon-button:not(:hover):not(:active):not(:focus-visible){box-shadow:var(--button-shadow-normal)}.mdc-icon-button:disabled{color:var(--mdc-theme-text-disabled-on-background)}.mdc-icon-button:focus-visible{box-shadow:var(--shadow-depth-8-focused);border-radius:50%}limel-icon{width:1.25rem;height:1.25rem}";
 
 const IconButton = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    /**
-     * Set to `true` to give the button our standard "elevated" look, lifting
-     * it off the flat layout.
-     */
+    this.icon = undefined;
     this.elevated = false;
-    /**
-     * Set to `true` to disable the button.
-     */
+    this.label = undefined;
     this.disabled = false;
   }
   connectedCallback() {

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, g as getElement } from './index-11cd0b60.js';
+import { r as registerInstance, h, g as getElement } from './index-cdfd351d.js';
 import { c as config } from './config-f7362aeb.js';
 
 class IconCache {
@@ -84,6 +84,9 @@ const iconCss = ":host{background-color:var(--icon-background-color, transparent
 const Icon = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.size = undefined;
+    this.name = undefined;
+    this.badge = undefined;
   }
   componentDidLoad() {
     this.loadIcon(this.name);

package/dist/esm/limel-input-field.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-11cd0b60.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-cdfd351d.js';
 import { c as TAB_KEY_CODE, T as TAB, A as ARROW_UP, e as ARROW_UP_KEY_CODE, f as ARROW_DOWN, g as ARROW_DOWN_KEY_CODE, b as ESCAPE, E as ENTER, d as ESCAPE_KEY_CODE, a as ENTER_KEY_CODE, S as SPACE, h as SPACE_KEY_CODE } from './keycodes-9f971b46.js';
 import { g as getHref, a as getTarget } from './link-helper-b08fe56c.js';
 import { c as createRandomString } from './random-string-2246b81e.js';
@@ -226,64 +226,6 @@ const InputField = class {
     registerInstance(this, hostRef);
     this.change = createEvent(this, "change", 7);
     this.action = createEvent(this, "action", 7);
-    /**
-     * Set to `true` to disable the field.
-     * Use `disabled` to indicate that the field can normally be interacted
-     * with, but is currently disabled. This tells the user that if certain
-     * requirements are met, the field may become enabled again.
-     */
-    this.disabled = false;
-    /**
-     * Set to `true` to make the field read-only.
-     * Use `readonly` when the field is only there to present the data it holds,
-     * and will not become possible for the current user to edit.
-     */
-    this.readonly = false;
-    /**
-     * Set to `true` to indicate that the current value of the input field is
-     * invalid.
-     */
-    this.invalid = false;
-    /**
-     * Set to `true` to indicate that the field is required.
-     */
-    this.required = false;
-    /**
-     * Type of input.
-     *
-     * Note** regarding type `url`: `limel-input` uses the native validation
-     * built into the browser for many types of input fields. The native
-     * validation for `url` is very strict, and does not allow relative urls,
-     * nor any other formats that are not a "fully qualified" url. To allow
-     * such urls, use the type `urlAsText` instead. `urlAsText` works exactly
-     * like `text` in all regards, except that it enables use of the `showLink`
-     * property.
-     */
-    this.type = 'text';
-    /**
-     * Set to `true` to format the current value of the input field only
-     * if the field is of type number.
-     * The number format is determined by the current language of the browser.
-     */
-    this.formatNumber = true;
-    /**
-     * Incremental values that are valid if the field type is `number`.
-     */
-    this.step = 'any';
-    /**
-     * list of suggestions `value` can autocomplete to.
-     */
-    this.completions = [];
-    /**
-     * For inputs of type `email`, `tel`, `url`, and `urlAsText`, set this to
-     * `true` to show a trailing icon with a `mailto:`,`tel:`, or normal link,
-     * respectively. The default icon can be overridden using the `trailingIcon`
-     * property.
-     */
-    this.showLink = false;
-    this.isFocused = false;
-    this.isModified = false;
-    this.showCompletions = false;
     this.completionsList = [];
     this.initialize = () => {
       const element = this.limelInputField.shadowRoot.querySelector('.mdc-text-field');
@@ -685,6 +627,31 @@ const InputField = class {
       // circumstances when the value is changed by the scrolling.
       // Please test THOROUGHLY if you remove this event handler 😄
     };
+    this.disabled = false;
+    this.readonly = false;
+    this.invalid = false;
+    this.label = undefined;
+    this.placeholder = undefined;
+    this.helperText = undefined;
+    this.prefix = undefined;
+    this.suffix = undefined;
+    this.required = false;
+    this.value = undefined;
+    this.trailingIcon = undefined;
+    this.leadingIcon = undefined;
+    this.pattern = undefined;
+    this.type = 'text';
+    this.formatNumber = true;
+    this.step = 'any';
+    this.max = undefined;
+    this.min = undefined;
+    this.maxlength = undefined;
+    this.minlength = undefined;
+    this.completions = [];
+    this.showLink = false;
+    this.isFocused = false;
+    this.isModified = false;
+    this.showCompletions = false;
     const debounceTimeout = 300;
     this.changeEmitter = debounce(this.changeEmitter, debounceTimeout);
     this.portalId = createRandomString();

package/dist/esm/limel-linear-progress.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, g as getElement } from './index-11cd0b60.js';
+import { r as registerInstance, h, g as getElement } from './index-cdfd351d.js';
 import { M as MDCFoundation, a as MDCComponent } from './component-410aad5a.js';
 import { g as getCorrectPropertyName } from './util-f1bde91c.js';
 
@@ -428,13 +428,7 @@ const linearProgressCss = ":host{--mdc-theme-primary:var(\n      --lime-primary-
 const LinearProgress = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    /**
-     * The value of the progress bar. Should be between `0` and `1`.
-     */
     this.value = 0;
-    /**
-     * Puts the progress bar in an indeterminate state
-     */
     this.indeterminate = false;
   }
   connectedCallback() {

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

@@ -1,6 +1,6 @@
-import { h, r as registerInstance, c as createEvent, g as getElement, H as Host } from './index-11cd0b60.js';
+import { h, r as registerInstance, c as createEvent, g as getElement, H as Host } from './index-cdfd351d.js';
 import { d as MDCList, s as strings, b as MDCMenuSurface, C as Corner } from './component-fffa3419.js';
-import { C as CheckboxTemplate } from './checkbox.template-2f1bbc98.js';
+import { C as CheckboxTemplate } from './checkbox.template-fc7fcd06.js';
 import { M as MDCRipple } from './component-5b4ac85a.js';
 import { i as isDescendant } from './dom-0f79cbe7.js';
 import { b as ESCAPE, d as ESCAPE_KEY_CODE, T as TAB, c as TAB_KEY_CODE } from './keycodes-9f971b46.js';
@@ -234,18 +234,6 @@ const List = class {
     registerInstance(this, hostRef);
     this.change = createEvent(this, "change", 7);
     this.select = createEvent(this, "select", 7);
-    /**
-     * Size of the icons in the list
-     */
-    this.iconSize = 'small';
-    /**
-     * By default, lists will display 3 lines of text, and then truncate the rest.
-     * Consumers can increase or decrease this number by specifying
-     * `maxLinesSecondaryText`. If consumer enters zero or negative
-     * numbers we default to 1; and if they type decimals we round up.
-     */
-    // eslint-disable-next-line no-magic-numbers
-    this.maxLinesSecondaryText = 3;
     this.listRenderer = new ListRenderer();
     this.setup = () => {
       this.setupList();
@@ -323,6 +311,11 @@ const List = class {
     this.isListItem = (item) => {
       return !('separator' in item);
     };
+    this.items = undefined;
+    this.badgeIcons = undefined;
+    this.iconSize = 'small';
+    this.type = undefined;
+    this.maxLinesSecondaryText = 3;
   }
   connectedCallback() {
     this.setup();
@@ -386,10 +379,6 @@ const MenuSurface = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.dismiss = createEvent(this, "dismiss", 7);
-    /**
-     * True if the menu surface is open, false otherwise
-     */
-    this.open = false;
     this.setup = () => {
       const menuElement = this.host.shadowRoot.querySelector('.mdc-menu-surface');
       if (!menuElement) {
@@ -474,6 +463,8 @@ const MenuSurface = class {
         this.dismiss.emit();
       }
     };
+    this.open = false;
+    this.allowClicksElement = undefined;
   }
   connectedCallback() {
     this.setup();

package/dist/esm/limel-menu-list.entry.js

@@ -1,4 +1,4 @@
-import { h, r as registerInstance, c as createEvent, g as getElement } from './index-11cd0b60.js';
+import { h, r as registerInstance, c as createEvent, g as getElement } from './index-cdfd351d.js';
 import { M as MDCMenuSurfaceFoundation, c as cssClasses$1, a as MDCListFoundation, n as numbers$1, b as MDCMenuSurface, d as MDCList, s as strings$1 } from './component-fffa3419.js';
 import { M as MDCFoundation, a as MDCComponent } from './component-410aad5a.js';
 import { c as closest } from './ponyfill-30263d5e.js';
@@ -766,18 +766,6 @@ const MenuList = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.select = createEvent(this, "select", 7);
-    /**
-     * Size of the icons in the list
-     */
-    this.iconSize = 'small';
-    /**
-     * By default, lists will display 3 lines of text, and then truncate the rest.
-     * Consumers can increase or decrease this number by specifying
-     * `maxLinesSecondaryText`. If consumer enters zero or negative
-     * numbers we default to 1; and if they type decimals we round up.
-     */
-    // eslint-disable-next-line no-magic-numbers
-    this.maxLinesSecondaryText = 3;
     this.MenuListRenderer = new MenuListRenderer();
     this.setup = () => {
       this.setupMenu();
@@ -831,6 +819,11 @@ const MenuList = class {
     this.isMenuItem = (item) => {
       return !('separator' in item);
     };
+    this.items = undefined;
+    this.badgeIcons = undefined;
+    this.iconSize = 'small';
+    this.type = undefined;
+    this.maxLinesSecondaryText = 3;
   }
   connectedCallback() {
     this.setup();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-11cd0b60.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-cdfd351d.js';
 import { i as isDescendant } from './dom-0f79cbe7.js';
 import { T as TAB, b as ESCAPE, E as ENTER, c as TAB_KEY_CODE, d as ESCAPE_KEY_CODE, a as ENTER_KEY_CODE, A as ARROW_UP, e as ARROW_UP_KEY_CODE, f as ARROW_DOWN, g as ARROW_DOWN_KEY_CODE } from './keycodes-9f971b46.js';
 import { c as createRandomString } from './random-string-2246b81e.js';
@@ -230,54 +230,29 @@ const Picker = class {
     this.change = createEvent(this, "change", 7);
     this.interact = createEvent(this, "interact", 7);
     this.action = createEvent(this, "action", 7);
-    /**
-     * True if the picker should be disabled
-     */
+    // Should NOT be decorated with State(), since this
+    // should not trigger a re-render by itself.
+    this.chipSetEditMode = false;
     this.disabled = false;
-    /**
-     * Set to `true` to disable adding and removing items,
-     * but allow interaction with existing items.
-     */
     this.readonly = false;
-    /**
-     * True if the control requires a value
-     */
+    this.label = undefined;
+    this.searchLabel = undefined;
+    this.helperText = undefined;
+    this.leadingIcon = undefined;
+    this.emptyResultMessage = undefined;
     this.required = false;
-    /**
-     * True if multiple values are allowed
-     */
+    this.value = undefined;
+    this.searcher = undefined;
     this.multiple = false;
-    /**
-     * Sets delimiters between chips. Works only when `multiple` is `true`.
-     */
     this.delimiter = null;
-    /**
-     * Static actions that can be clicked by the user.
-     */
     this.actions = [];
-    /**
-     * Position of the custom static actions in the picker's results dropdown.
-     * Can be set to `'top'` or `'bottom'`.
-     */
     this.actionPosition = 'bottom';
-    /**
-     * Scroll behavior of the custom static actions, when user scrolls
-     * in the picker's results dropdown. Can be set to `'scroll'` which means
-     * the action items will scroll together with the list, or `'sticky'` which
-     * retains their position at the top or bottom of the drop down while
-     * scrolling.
-     */
     this.actionScrollBehavior = 'sticky';
-    /**
-     * Whether badge icons should be used in the result list or not
-     */
     this.badgeIcons = true;
+    this.items = undefined;
     this.textValue = '';
     this.loading = false;
     this.chips = [];
-    // Should NOT be decorated with State(), since this
-    // should not trigger a re-render by itself.
-    this.chipSetEditMode = false;
     this.handleTextInput = this.handleTextInput.bind(this);
     this.handleInputKeyDown = this.handleInputKeyDown.bind(this);
     this.handleDropdownKeyDown = this.handleDropdownKeyDown.bind(this);
@@ -504,7 +479,7 @@ const Picker = class {
   /**
    * Change handler for the list
    *
-   * @param {CustomEvent} event event
+   * @param {LimelListCustomEvent<ListItem>} event event
    * @returns {void}
    */
   handleListChange(event) {
@@ -525,7 +500,7 @@ const Picker = class {
   /**
    * Change handler for the list
    *
-   * @param {CustomEvent} event event
+   * @param {LimelChipSetCustomEvent} event event
    * @returns {void}
    */
   handleActionListChange(event) {