@statistikzh/leu 0.5.1 → 0.6.0

package/dist/ButtonGroup.d.ts

@@ -4,7 +4,7 @@
  * @prop {string} value - The value of the currenty selected (active) button
  * @fires input - When the value of the group changes by clicking a button
  */
-export class LeuButtonGroup extends LitElement {
+export class LeuButtonGroup extends LeuElement {
     /**
      * @param {import("../button/Button").LeuButton} button
      * @returns {string}
@@ -20,5 +20,5 @@ export class LeuButtonGroup extends LitElement {
     _handleButtonClick(button: any): void;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { LitElement } from 'lit';
+import { L as LeuElement } from './LeuElement-6de6f209.js';
 //# sourceMappingURL=ButtonGroup.d.ts.map

package/dist/ButtonGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonGroup.d.ts","sourceRoot":"","sources":["ButtonGroup.js"],"names":[],"mappings":"AAeA;;;;;GAKG;AACH;IAME;;;OAGG;IACH,oCAFa,MAAM,CAIlB;IATC,cAAgB;IAclB,4BAMC;IAVD,oBAGC;IAQD,0BA+BC;IAED;;OAEG;IACH,sCAWC;IACD,+CAMC;CACF;2BAnGqC,KAAK"}
+{"version":3,"file":"ButtonGroup.d.ts","sourceRoot":"","sources":["ButtonGroup.js"],"names":[],"mappings":"AAeA;;;;;GAKG;AACH;IAME;;;OAGG;IACH,8BAHW,GAAoC,GAClC,MAAM,CAIlB;IATC,cAAgB;IAclB,4BAMC;IAVD,oBAGC;IAQD,0BA+BC;IAED;;OAEG;IACH,2BAFW,GAAoC,QAa9C;IACD,+CAMC;CACF;gCApGqD,0BAA0B"}

package/dist/ButtonGroup.js

@@ -1,5 +1,5 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
-import { css, LitElement, html } from 'lit';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { css, html } from 'lit';
 
 var css_248z = css`:host,
 :host * {
@@ -19,7 +19,7 @@ var css_248z = css`:host,
  * @prop {string} value - The value of the currenty selected (active) button
  * @fires input - When the value of the group changes by clicking a button
  */
-class LeuButtonGroup extends LitElement {
+class LeuButtonGroup extends LeuElement {
   constructor() {
     super();
     this._items = [];

package/dist/Checkbox.d.ts

@@ -1,13 +1,14 @@
 /**
  * @tagname leu-checkbox
  */
-export class LeuCheckbox extends LitElement {
+export class LeuCheckbox extends LeuElement {
     checked: boolean;
     disabled: boolean;
-    checkIcon: import("lit-html").TemplateResult<1>;
+    name: string;
+    value: string;
     handleChange(event: any): void;
     handleInput(event: any): void;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { LitElement } from 'lit';
+import { L as LeuElement } from './LeuElement-6de6f209.js';
 //# sourceMappingURL=Checkbox.d.ts.map

package/dist/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["Checkbox.js"],"names":[],"mappings":"AAiGA;;GAEG;AACH;IAGI,iBAAoB;IACpB,kBAAqB;IACrB,gDAA8B;IAEhC,+BAIC;IACD,8BAEC;IACD,+CAgBC;CACF;2BAnIqC,KAAK"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["Checkbox.js"],"names":[],"mappings":"AA+FA;;GAEG;AACH;IAGI,iBAAoB;IACpB,kBAAqB;IACrB,aAAc;IACd,cAAe;IAEjB,+BAIC;IACD,8BAEC;IACD,+CAgBC;CACF;gCAnIqD,0BAA0B"}

package/dist/Checkbox.js

@@ -1,6 +1,6 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
-import { css, LitElement, html } from 'lit';
-import { I as Icon } from './icon-03e86700.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { css, html } from 'lit';
+import { LeuIcon } from './Icon.js';
 
 var css_248z = css`:host {
   --checkbox-color: var(--leu-color-black-40);
@@ -20,8 +20,6 @@ var css_248z = css`:host {
   align-items: flex-start;
   gap: 0.5rem;
 
-  font-family: var(--leu-font-family-regular);
-
   font-family: var(--checkbox-font-regular);
 }
 
@@ -98,12 +96,13 @@ var css_248z = css`:host {
 /**
  * @tagname leu-checkbox
  */
-class LeuCheckbox extends LitElement {
+class LeuCheckbox extends LeuElement {
   constructor() {
     super();
     this.checked = false;
     this.disabled = false;
-    this.checkIcon = Icon("check");
+    this.name = "";
+    this.value = "";
   }
   handleChange(event) {
     this.checked = event.target.checked;
@@ -116,7 +115,7 @@ class LeuCheckbox extends LitElement {
   render() {
     return html`
       <input
-        id=${this.identifier}
+        id=${`checkbox-${this.name}`}
         class="checkbox"
         type="checkbox"
         name="${this.name}"
@@ -126,14 +125,18 @@ class LeuCheckbox extends LitElement {
         ?disabled=${this.disabled}
         .value=${this.value}
       />
-      <label for=${this.identifier} class="label">${this.label}</label>
-      <div class="icon">${this.checkIcon}</div>
+      <label for=${`checkbox-${this.name}`} class="label"><slot></slot></label>
+      <leu-icon class="icon" name="check"></leu-icon>
     `;
   }
 }
+_defineProperty(LeuCheckbox, "dependencies", {
+  "leu-icon": LeuIcon
+});
 _defineProperty(LeuCheckbox, "styles", css_248z);
+/** @internal */
 _defineProperty(LeuCheckbox, "shadowRootOptions", {
-  ...LitElement.shadowRootOptions,
+  ...LeuElement.shadowRootOptions,
   delegatesFocus: true
 });
 _defineProperty(LeuCheckbox, "properties", {
@@ -145,10 +148,6 @@ _defineProperty(LeuCheckbox, "properties", {
     type: Boolean,
     reflect: true
   },
-  identifier: {
-    type: String,
-    reflect: true
-  },
   value: {
     type: String,
     reflect: true
@@ -156,10 +155,6 @@ _defineProperty(LeuCheckbox, "properties", {
   name: {
     type: String,
     reflect: true
-  },
-  label: {
-    type: String,
-    reflect: true
   }
 });
 

package/dist/CheckboxGroup.d.ts

@@ -1,7 +1,7 @@
 /**
  * @tagname leu-checkbox-group
  */
-export class LeuCheckboxGroup extends LitElement {
+export class LeuCheckboxGroup extends LeuElement {
     orientation: string;
     items: any[];
     get value(): any[];
@@ -9,5 +9,5 @@ export class LeuCheckboxGroup extends LitElement {
     handleItems(): void;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { LitElement } from 'lit';
+import { L as LeuElement } from './LeuElement-6de6f209.js';
 //# sourceMappingURL=CheckboxGroup.d.ts.map

package/dist/CheckboxGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["CheckboxGroup.js"],"names":[],"mappings":"AAqCA;;GAEG;AACH;IAGI,oBAA+B;IAC/B,aAAe;IAEjB,mBAEC;IACD,yBAEC;IACD,oBAEC;IACD,+CAWC;CACF;2BAlEqC,KAAK"}
+{"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["CheckboxGroup.js"],"names":[],"mappings":"AAmCA;;GAEG;AACH;IAGI,oBAA+B;IAC/B,aAAe;IAEjB,mBAEC;IACD,yBAEC;IACD,oBAEC;IACD,+CAWC;CACF;gCAjEqD,0BAA0B"}

package/dist/CheckboxGroup.js

@@ -1,13 +1,11 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
-import { css, LitElement, html } from 'lit';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { css, html } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 
 var css_248z = css`:host {
   --group-font-regular: var(--leu-font-family-regular);
   --group-font-black: var(--leu-font-family-black);
 
-  font-family: var(--leu-font-family-regular);
-
   font-family: var(--group-font-regular);
 }
 
@@ -38,7 +36,7 @@ var css_248z = css`:host {
 /**
  * @tagname leu-checkbox-group
  */
-class LeuCheckboxGroup extends LitElement {
+class LeuCheckboxGroup extends LeuElement {
   constructor() {
     super();
     this.orientation = "HORIZONTAL";
@@ -51,7 +49,7 @@ class LeuCheckboxGroup extends LitElement {
     this.handleItems();
   }
   handleItems() {
-    this.items = [...this.querySelectorAll(":scope > *:not([slot])")];
+    this.items = Array.from(this.querySelectorAll(":scope > *:not([slot])"));
   }
   render() {
     const fieldsetClasses = {

package/dist/Chip.d.ts

@@ -1,5 +1,5 @@
-export class LeuChipBase extends LitElement {
+export class LeuChipBase extends LeuElement {
     inverted: boolean;
 }
-import { LitElement } from 'lit';
+import { L as LeuElement } from './LeuElement-6de6f209.js';
 //# sourceMappingURL=Chip.d.ts.map

package/dist/Chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["Chip.js"],"names":[],"mappings":"AAyJA;IAGI,kBAAqB;CAExB;2BA7J+B,KAAK"}
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["Chip.js"],"names":[],"mappings":"AAsJA;IAGI,kBAAqB;CAExB;gCA3JqD,0BAA0B"}

package/dist/Chip.js

@@ -1,5 +1,5 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
-import { css, LitElement } from 'lit';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { css } from 'lit';
 
 var css_248z = css`:host,
 :host *,
@@ -31,7 +31,7 @@ var css_248z = css`:host,
   --chip-radio-border: var(--chip-radio-border-default);
   --chip-radio-background: var(--chip-radio-background-default);
 
-  font-family: var(--leu-font-family-regular);
+  --leu-icon-size: 1rem;
 
   font-family: var(--chip-font-regular);
 
@@ -65,6 +65,7 @@ var css_248z = css`:host,
   padding: 0.5rem 1rem;
 
   color: var(--chip-color);
+  font-family: inherit;
   font-size: 0.875rem;
   line-height: 1rem;
 
@@ -143,15 +144,11 @@ var css_248z = css`:host,
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-
-.icon svg {
-  display: block;
-}
 `;
 
 /* Design: https://www.figma.com/file/d6Pv21UVUbnBs3AdcZijHmbN/KTZH-Design-System?type=design&node-id=21161-184433&mode=design&t=Kjo5VDiqivihn8dh-11 */
 
-class LeuChipBase extends LitElement {
+class LeuChipBase extends LeuElement {
   constructor() {
     super();
     this.inverted = false;
@@ -160,17 +157,13 @@ class LeuChipBase extends LitElement {
 _defineProperty(LeuChipBase, "styles", css_248z);
 /** @internal */
 _defineProperty(LeuChipBase, "shadowRootOptions", {
-  ...LitElement.shadowRootOptions,
+  ...LeuElement.shadowRootOptions,
   delegatesFocus: true
 });
 _defineProperty(LeuChipBase, "properties", {
   inverted: {
     type: Boolean,
     reflect: true
-  },
-  label: {
-    type: String,
-    reflect: true
   }
 });
 

package/dist/ChipGroup.d.ts

@@ -3,11 +3,13 @@
  * @cssproperty --leu-chip-group-gap - The gap between the chips
  * @tagname leu-chip-group
  */
-export class LeuChipGroup extends LitElement {
+export class LeuChipGroup extends LeuElement {
     items: any[];
     inverted: boolean;
     headingLevel: number;
     label: string;
+    /** @type {"single" | "multiple" | "none"} */
+    selectionMode: "single" | "multiple" | "none";
     get value(): any[];
     /**
      * Determines the heading tag of the accordion toggle.
@@ -19,10 +21,10 @@ export class LeuChipGroup extends LitElement {
     _getHeadingTag(): string;
     render(): import("lit-html").TemplateResult;
 }
-export namespace SELECTION_MODES {
-    let single: string;
-    let multiple: string;
-    let none: string;
-}
-import { LitElement } from 'lit';
+export const SELECTION_MODES: Readonly<{
+    single: "single";
+    multiple: "multiple";
+    none: "none";
+}>;
+import { L as LeuElement } from './LeuElement-6de6f209.js';
 //# sourceMappingURL=ChipGroup.d.ts.map

package/dist/ChipGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipGroup.d.ts","sourceRoot":"","sources":["ChipGroup.js"],"names":[],"mappings":"AA8BA;;;;GAIG;AACH;IAiBM,aAAkB;IAEpB,kBAAqB;IACrB,qBAAqB;IACrB,cAAe;IAajB,mBAEC;IAED;;;;;;OAMG;IACH,yBAMC;IACD,4CAeC;CACF;;;;;;2BAtG+B,KAAK"}
+{"version":3,"file":"ChipGroup.d.ts","sourceRoot":"","sources":["ChipGroup.js"],"names":[],"mappings":"AA8BA;;;;GAIG;AACH;IAiBM,aAAkB;IAEpB,kBAAqB;IACrB,qBAAqB;IACrB,cAAe;IAKf,6CAA6C;IAC7C,eADW,QAAQ,GAAG,UAAU,GAAG,MAAM,CACA;IAU3C,mBAEC;IAED;;;;;;OAMG;IACH,yBAMC;IACD,4CAeC;CACF;AAlFD;;;;GAIG;gCA5BmD,0BAA0B"}

package/dist/ChipGroup.js

@@ -1,6 +1,6 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
-import { css, LitElement } from 'lit';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
 import { html, unsafeStatic } from 'lit/static-html.js';
+import { css } from 'lit';
 
 var css_248z = css`.label {
   margin: 0 0 0.5rem;
@@ -22,18 +22,18 @@ var css_248z = css`.label {
 
 /* Figma https://www.figma.com/file/d6Pv21UVUbnBs3AdcZijHmbN/KTZH-Design-System?type=design&node-id=131766-248643&mode=design&t=Kjo5VDiqivihn8dh-11 */
 
-const SELECTION_MODES = {
+const SELECTION_MODES = Object.freeze({
   single: "single",
   multiple: "multiple",
   none: "none"
-};
+});
 
 /**
  * @slot - Place leu-chip-* elements inside this slot
  * @cssproperty --leu-chip-group-gap - The gap between the chips
  * @tagname leu-chip-group
  */
-class LeuChipGroup extends LitElement {
+class LeuChipGroup extends LeuElement {
   constructor() {
     super();
     /** @internal */
@@ -58,6 +58,9 @@ class LeuChipGroup extends LitElement {
 
     /** @internal */
     this.items = [];
+
+    /** @type {"single" | "multiple" | "none"} */
+    this.selectionMode = SELECTION_MODES.none;
   }
   connectedCallback() {
     super.connectedCallback();

package/dist/ChipLink.d.ts

@@ -1,6 +1,7 @@
 /**
- * @slot - The content of the chip
  * @tagname leu-chip-link
+ * @slot - The content of the chip
+ * @prop {keyof typeof SIZES} size - The size of the chip
  */
 export class LeuChipLink extends LeuChipBase {
     size: string;

package/dist/ChipLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipLink.d.ts","sourceRoot":"","sources":["ChipLink.js"],"names":[],"mappings":"AASA;;;GAGG;AACH;IAII,aAAyB;IACzB,aAAc;IAEhB,+CAIC;CACF;;;;;4BAvB2B,WAAW"}
+{"version":3,"file":"ChipLink.d.ts","sourceRoot":"","sources":["ChipLink.js"],"names":[],"mappings":"AASA;;;;GAIG;AACH;IAII,aAAyB;IACzB,aAAc;IAEhB,+CAIC;CACF;;;;;4BAxB2B,WAAW"}

package/dist/ChipLink.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
+import { _ as _defineProperty } from './LeuElement-6de6f209.js';
 import { html } from 'lit';
 import { LeuChipBase } from './Chip.js';
 
@@ -8,8 +8,9 @@ const SIZES = {
 };
 
 /**
- * @slot - The content of the chip
  * @tagname leu-chip-link
+ * @slot - The content of the chip
+ * @prop {keyof typeof SIZES} size - The size of the chip
  */
 class LeuChipLink extends LeuChipBase {
   constructor() {
@@ -20,16 +21,12 @@ class LeuChipLink extends LeuChipBase {
   }
   render() {
     return html`<a href=${this.href} class="button">
-      <span class="label">${this.label}</span>
+      <span class="label"><slot></slot></span>
     </a>`;
   }
 }
 _defineProperty(LeuChipLink, "properties", {
   ...LeuChipBase.properties,
-  /**
-   * The size of the chip
-   * @type {keyof typeof SIZES}
-   */
   size: {
     type: String,
     reflect: true

package/dist/ChipRemovable.d.ts

@@ -4,8 +4,6 @@
  * @fires remove - Dispatched when the user clicks on the chip
  */
 export class LeuChipRemovable extends LeuChipBase {
-    /** @internal */
-    _removeIcon: import("lit-html").TemplateResult<1>;
     handleClick(): void;
     render(): import("lit-html").TemplateResult<1>;
 }

package/dist/ChipRemovable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipRemovable.d.ts","sourceRoot":"","sources":["ChipRemovable.js"],"names":[],"mappings":"AAKA;;;;GAIG;AACH;IAII,gBAAgB;IAChB,kDAAoC;IAEtC,oBAMC;IACD,+CAKC;CACF;4BA5B2B,WAAW"}
+{"version":3,"file":"ChipRemovable.d.ts","sourceRoot":"","sources":["ChipRemovable.js"],"names":[],"mappings":"AAKA;;;;GAIG;AACH;IACE,oBAMC;IACD,+CAKC;CACF;4BAtB2B,WAAW"}

package/dist/ChipRemovable.js

@@ -1,7 +1,7 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
+import { _ as _defineProperty } from './LeuElement-6de6f209.js';
 import { html } from 'lit';
 import { LeuChipBase } from './Chip.js';
-import { I as Icon } from './icon-03e86700.js';
+import { LeuIcon } from './Icon.js';
 
 /**
  * @slot - The content of the chip
@@ -9,26 +9,23 @@ import { I as Icon } from './icon-03e86700.js';
  * @fires remove - Dispatched when the user clicks on the chip
  */
 class LeuChipRemovable extends LeuChipBase {
-  constructor() {
-    super();
-
-    /** @internal */
-    this._removeIcon = Icon("close", 16);
-  }
   handleClick() {
     const customEvent = new CustomEvent("leu:remove", {
-      bubble: true,
+      bubbles: true,
       composed: true
     });
     this.dispatchEvent(customEvent);
   }
   render() {
     return html`<button @click=${e => this.handleClick(e)} class="button">
-      <span class="label">${this.label}</span>
-      <div class="icon">${this._removeIcon}</div>
+      <span class="label"><slot></slot></span>
+      <leu-icon name="close" class="icon"></leu-icon>
     </button>`;
   }
 }
+_defineProperty(LeuChipRemovable, "dependencies", {
+  "leu-icon": LeuIcon
+});
 _defineProperty(LeuChipRemovable, "properties", {
   ...LeuChipBase.properties
 });

package/dist/ChipSelectable.d.ts

@@ -1,10 +1,18 @@
 /**
  * A chip component that can be selected.
- * @slot - The content of the chip
  * @tagname leu-chip-selectable
+ * @slot - The content of the chip
+ * @prop {keyof typeof SIZES} size - The size of the chip. Not supported for radio variant.
+ * @prop {keyof typeof VARIANTS} variant - `toggle` or `radio`. Determines if only one or multiple chips can be selected.
  */
 export class LeuChipSelectable extends LeuChipBase {
     size: string;
+    /**
+     * The variant of the chip. Has an effect not only on the visual appearance but also on the behavior.
+     * - `toggle`: The chip behaves like a toggle button.
+     * - `radio`: The chip behaves like a radio button.
+     * @default "toggle"
+     */
     variant: string;
     selected: boolean;
     handleClick(): void;

package/dist/ChipSelectable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipSelectable.d.ts","sourceRoot":"","sources":["ChipSelectable.js"],"names":[],"mappings":"AAaA;;;;GAIG;AACH;IAGI,aAAyB;IACzB,gBAA8B;IAC9B,kBAAqB;IAKvB,oBAiBC;IACD,+CAQC;CACF;;;;;;;;;4BArD2B,WAAW"}
+{"version":3,"file":"ChipSelectable.d.ts","sourceRoot":"","sources":["ChipSelectable.js"],"names":[],"mappings":"AAaA;;;;;;GAMG;AACH;IAGI,aAAyB;IAEzB;;;;;OAKG;IACH,gBAA8B;IAC9B,kBAAqB;IAKvB,oBAiBC;IACD,+CAQC;CACF;;;;;;;;;4BA9D2B,WAAW"}

package/dist/ChipSelectable.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
+import { _ as _defineProperty } from './LeuElement-6de6f209.js';
 import { html } from 'lit';
 import { LeuChipBase } from './Chip.js';
 
@@ -13,13 +13,22 @@ const VARIANTS = {
 
 /**
  * A chip component that can be selected.
- * @slot - The content of the chip
  * @tagname leu-chip-selectable
+ * @slot - The content of the chip
+ * @prop {keyof typeof SIZES} size - The size of the chip. Not supported for radio variant.
+ * @prop {keyof typeof VARIANTS} variant - `toggle` or `radio`. Determines if only one or multiple chips can be selected.
  */
 class LeuChipSelectable extends LeuChipBase {
   constructor() {
     super();
     this.size = SIZES.regular;
+
+    /**
+     * The variant of the chip. Has an effect not only on the visual appearance but also on the behavior.
+     * - `toggle`: The chip behaves like a toggle button.
+     * - `radio`: The chip behaves like a radio button.
+     * @default "toggle"
+     */
     this.variant = VARIANTS.toggle;
     this.selected = false;
     if (this.variant === VARIANTS.radio && this.size === SIZES.small) {
@@ -50,29 +59,16 @@ class LeuChipSelectable extends LeuChipBase {
       class="button"
       aria-pressed=${this.selected ? "true" : "false"}
     >
-      <span class="label">${this.label}</span>
+      <span class="label"><slot></slot></span>
     </button>`;
   }
 }
 _defineProperty(LeuChipSelectable, "properties", {
   ...LeuChipBase.properties,
-  /**
-   * The size of the chip. Not supported for radio variant.
-   * @type {keyof typeof SIZES}
-   * @default "regular"
-   */
   size: {
     type: String,
     reflect: true
   },
-  /**
-   * The variant of the chip. Has an effect not only on the visual appearance but also on the behavior.
-   * - `toggle`: The chip behaves like a toggle button.
-   * - `radio`: The chip behaves like a radio button.
-   *
-   * @type {keyof typeof VARIANTS}
-   * @default "toggle"
-   */
   variant: {
     type: String,
     reflect: true

package/dist/Dropdown.d.ts

@@ -1,15 +1,19 @@
 /**
  * @tagname leu-dropdown
  */
-export class LeuDropdown extends LitElement {
+export class LeuDropdown extends LeuElement {
     expanded: boolean;
     label: string;
-    menuItems: any[];
+    /** @type {import("lit/directives/ref").Ref<HTMLButtonElement>} */
+    _toggleRef: import("lit/directives/ref").Ref<HTMLButtonElement>;
     _keyUpHandler(event: any): void;
-    _handleSlotChange(): void;
-    _removeMenuItemListeners(): void;
+    _keyDownToggleHandler(event: any): Promise<void>;
     _handleToggleClick(): void;
+    /**
+     * @returns {import("../menu/Menu").LeuMenu}
+     */
+    _getMenu(): any;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { LitElement } from 'lit';
+import { L as LeuElement } from './LeuElement-6de6f209.js';
 //# sourceMappingURL=Dropdown.d.ts.map

package/dist/Dropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["Dropdown.js"],"names":[],"mappings":"AAuCA;;GAEG;AACH;IAKQ,kBAAqB;IAMzB,cAAe;IAEf,iBAAmB;IAarB,gCAIC;IACD,0BAIC;IACD,iCAIC;IACD,2BAEC;IACD,+CA2BC;CACF;2BAjHqC,KAAK"}
+{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["Dropdown.js"],"names":[],"mappings":"AAkCA;;GAEG;AACH;IAMQ,kBAAqB;IAqBzB,cAAe;IAGf,kEAAkE;IAClE,YADW,OAAO,oBAAoB,EAAE,GAAG,CAAC,iBAAiB,CAAC,CACjC;IAkB/B,gCAIC;IACD,iDAYC;IACD,2BAEC;IAED;;OAEG;IACH,YAFa,GAA8B,CAI1C;IACD,+CA6BC;CACF;gCAhJqD,0BAA0B"}