@statistikzh/leu 0.6.0 → 0.7.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [0.7.0](https://github.com/statistikZH/leu/compare/v0.6.0...v0.7.0) (2024-07-08)
+
+
+### Features
+
+* **chip-group:** implement value setter ([dd1557a](https://github.com/statistikZH/leu/commit/dd1557ab1063ec7421a74057c489529b26e6d805))
+* **input:** add inputAsNumber getter that matches the native inputs method with the same name ([552f1ff](https://github.com/statistikZH/leu/commit/552f1ff18680c6a2866c7813fe40c462ea834802))
+
+
+### Bug Fixes
+
+* **chip-group:** handle the chip children during the event capture phase ([552f1ff](https://github.com/statistikZH/leu/commit/552f1ff18680c6a2866c7813fe40c462ea834802))
+* **radio-group:** handle the radio children during the event capture phase ([552f1ff](https://github.com/statistikZH/leu/commit/552f1ff18680c6a2866c7813fe40c462ea834802))
+
 ## [0.6.0](https://github.com/statistikZH/leu/compare/v0.5.1...v0.6.0) (2024-07-01)
 
 

package/dist/Accordion.d.ts

@@ -28,5 +28,5 @@ export class LeuAccordion extends LeuElement {
     _handleToggleClick(): void;
     render(): import("lit-html").TemplateResult;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.js';
 //# sourceMappingURL=Accordion.d.ts.map

package/dist/Accordion.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, nothing } from 'lit';
 import { html, unsafeStatic } from 'lit/static-html.js';
 

package/dist/Breadcrumb.d.ts

@@ -64,6 +64,6 @@ export class LeuBreadcrumb extends LeuElement {
     renderDropdown(): import("lit-html").TemplateResult<1> | typeof nothing;
     render(): import("lit-html").TemplateResult<1> | typeof nothing;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { nothing } from 'lit';
 //# sourceMappingURL=Breadcrumb.d.ts.map

package/dist/Breadcrumb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.d.ts","sourceRoot":"","sources":["Breadcrumb.js"],"names":[],"mappings":"AAuHA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH;IAOM,yBAA+C;IAO7C,uBAAyB;IACzB,0BAA6B;IAY7B,qBAAqB;IASvB,yBAA4C;IAW9C,aAAe;IACf,wDAAwD;IACxD,UADW,OAAO,CACG;IAErB,gBAAgB;IAChB,iEAAgC;IAehC,+BAEQ;IAEV,qBAEC;IACD,+CAOC;IAOD,gBAAgB;IAChB,sBAEC;IAED,gBAAgB;IAChB,4BAEC;IACD;;;;;OAKG;IACH,eAFa,IAAI,CA4BhB;IACD;;;OAGG;IACH,wEAqCC;IACD,gEAmCC;CACF;gCAzWqD,0BAA0B;wBAC7C,KAAK"}
+{"version":3,"file":"Breadcrumb.d.ts","sourceRoot":"","sources":["Breadcrumb.js"],"names":[],"mappings":"AAyHA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH;IAOM,yBAA+C;IAO7C,uBAAyB;IACzB,0BAA6B;IAY7B,qBAAqB;IASvB,yBAA4C;IAW9C,aAAe;IACf,wDAAwD;IACxD,UADW,OAAO,CACG;IAErB,gBAAgB;IAChB,iEAAgC;IAehC,+BAEQ;IAEV,qBAEC;IACD,+CAOC;IAOD,gBAAgB;IAChB,sBAEC;IAED,gBAAgB;IAChB,4BAEC;IACD;;;;;OAKG;IACH,eAFa,IAAI,CA4BhB;IACD;;;OAGG;IACH,wEAqCC;IACD,gEAmCC;CACF;gCA3WqD,0BAA0B;wBAC7C,KAAK"}

package/dist/Breadcrumb.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, nothing, html } from 'lit';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { classMap } from 'lit/directives/class-map.js';
@@ -20,6 +20,8 @@ var css_248z = css`:host,
   --breadcrumb-font-regular: var(--leu-font-family-regular);
   --breadcrumb-font-black: var(--leu-font-family-black);
 
+  font-family: var(--leu-font-family-regular);
+
   font-family: var(--breadcrumb-font-regular);
   line-height: 1.5;
   color: var(--leu-color-black-100);

package/dist/{Button-9692e403.d.ts → Button-7370f901.d.ts}

@@ -77,7 +77,7 @@ declare class LeuButton extends LeuElement {
 declare const BUTTON_SIZES: string[];
 declare const BUTTON_TYPES: string[];
 declare const BUTTON_EXPANDED_OPTIONS: string[];
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { nothing } from 'lit';
 export { BUTTON_VARIANTS as B, HasSlotController as H, LeuButton as L, BUTTON_SIZES as a, BUTTON_TYPES as b, BUTTON_EXPANDED_OPTIONS as c };
-//# sourceMappingURL=Button-9692e403.d.ts.map
+//# sourceMappingURL=Button-7370f901.d.ts.map

package/dist/Button-7370f901.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button-7370f901.d.ts","sourceRoot":"","sources":["Button-7370f901.js"],"names":[],"mappings":";;;iCAaa,OAAO,KAAK,EAAE,kBAAkB;AAyW7C,wCAA0D;AAhX1D;;;GAGG;AAEH;;;;GAIG;AACH;IACE,uCAcC;IAHC,UAAgB;IAEhB,eAA0B;IAG5B;;;OAGG;IACH,uBAeC;IAED;;;;OAIG;IACH,qBAEC;IAED;;;OAGG;IACH,gCAEC;IACD,sBAEC;IACD,yBAEC;CACF;AAmTD;;;;;GAKG;AACH;IAQI,WAAiB;IACjB,qBAAqB;IACrB,MADW,MAAM,CACI;IACrB,qBAAqB;IACrB,SADW,MAAM,CACO;IACxB,4CAA4C;IAC5C,MADW,QAAQ,GAAG,QAAQ,GAAG,OAAO,CACpB;IAEpB,qBAAqB;IACrB,eADW,MAAM,CACa;IAE9B,sBAAsB;IACtB,UADW,OAAO,CACG;IACrB,+EAA+E;IAC/E,OADW,OAAO,CACA;IAClB,sBAAsB;IACtB,QADW,OAAO,CACC;IACnB,wDAAwD;IACxD,UADW,OAAO,CACG;IAErB,gGAAgG;IAChG,OADW,OAAO,CACA;IAElB;;;OAGG;IACH,UAFU,CAAC,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAEf;IAE3B,6EAOC;IACD;;;MAaC;IACD,0BAEC;IACD,+CAiCC;CACF;AA7GD,qCAA0C;AAE1C,qCAAmD;AAEnD,gDAAkD;gCA5XI,0BAA0B;wBAC7C,KAAK"}

package/dist/{Button-9692e403.js → Button-7370f901.js}

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, html, nothing } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 import { ifDefined } from 'lit/directives/if-defined.js';

package/dist/Button.d.ts

@@ -1,2 +1,2 @@
-export { c as BUTTON_EXPANDED_OPTIONS, a as BUTTON_SIZES, b as BUTTON_TYPES, B as BUTTON_VARIANTS, L as LeuButton } from "./Button-9692e403.js";
+export { c as BUTTON_EXPANDED_OPTIONS, a as BUTTON_SIZES, b as BUTTON_TYPES, B as BUTTON_VARIANTS, L as LeuButton } from "./Button-7370f901.js";
 //# sourceMappingURL=Button.d.ts.map

package/dist/Button.js

@@ -1,6 +1,6 @@
-import './LeuElement-6de6f209.js';
+import './LeuElement-ba5ea33d.js';
 import 'lit';
 import 'lit/directives/class-map.js';
 import 'lit/directives/if-defined.js';
 import './Icon.js';
-export { c as BUTTON_EXPANDED_OPTIONS, a as BUTTON_SIZES, b as BUTTON_TYPES, B as BUTTON_VARIANTS, L as LeuButton } from './Button-9692e403.js';
+export { c as BUTTON_EXPANDED_OPTIONS, a as BUTTON_SIZES, b as BUTTON_TYPES, B as BUTTON_VARIANTS, L as LeuButton } from './Button-7370f901.js';

package/dist/ButtonGroup.d.ts

@@ -20,5 +20,5 @@ export class LeuButtonGroup extends LeuElement {
     _handleButtonClick(button: any): void;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.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,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"}
+{"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;gCApGqD,0BAA0B"}

package/dist/ButtonGroup.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, html } from 'lit';
 
 var css_248z = css`:host,

package/dist/Checkbox.d.ts

@@ -10,5 +10,5 @@ export class LeuCheckbox extends LeuElement {
     handleInput(event: any): void;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.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":"AA+FA;;GAEG;AACH;IAGI,iBAAoB;IACpB,kBAAqB;IACrB,aAAc;IACd,cAAe;IAEjB,+BAIC;IACD,8BAEC;IACD,+CAgBC;CACF;gCAnIqD,0BAA0B"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["Checkbox.js"],"names":[],"mappings":"AAiGA;;GAEG;AACH;IAGI,iBAAoB;IACpB,kBAAqB;IACrB,aAAc;IACd,cAAe;IAEjB,+BAIC;IACD,8BAEC;IACD,+CAgBC;CACF;gCArIqD,0BAA0B"}

package/dist/Checkbox.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, html } from 'lit';
 import { LeuIcon } from './Icon.js';
 
@@ -20,6 +20,8 @@ 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);
 }
 

package/dist/CheckboxGroup.d.ts

@@ -9,5 +9,5 @@ export class LeuCheckboxGroup extends LeuElement {
     handleItems(): void;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.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":"AAmCA;;GAEG;AACH;IAGI,oBAA+B;IAC/B,aAAe;IAEjB,mBAEC;IACD,yBAEC;IACD,oBAEC;IACD,+CAWC;CACF;gCAjEqD,0BAA0B"}
+{"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;gCAnEqD,0BAA0B"}

package/dist/CheckboxGroup.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, html } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 
@@ -6,6 +6,8 @@ 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);
 }
 

package/dist/Chip.d.ts

@@ -1,5 +1,5 @@
 export class LeuChipBase extends LeuElement {
     inverted: boolean;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.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":"AAsJA;IAGI,kBAAqB;CAExB;gCA3JqD,0BAA0B"}
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["Chip.js"],"names":[],"mappings":"AAwJA;IAGI,kBAAqB;CAExB;gCA7JqD,0BAA0B"}

package/dist/Chip.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css } from 'lit';
 
 var css_248z = css`:host,
@@ -11,17 +11,17 @@ var css_248z = css`:host,
 :host {
   --chip-background-color-default: var(--leu-color-black-transp-10);
   --chip-background-color-hover: var(--leu-color-black-transp-20);
-  --chip-background-color-selected: var(--leu-color-black-100);
-  --chip-background-color-selected-hover: var(--leu-color-black-transp-80);
+  --chip-background-color-checked: var(--leu-color-black-100);
+  --chip-background-color-checked-hover: var(--leu-color-black-transp-80);
 
   --chip-color-default: var(--leu-color-black-transp-60);
   --chip-color-hover: var(--leu-color-black-100);
-  --chip-color-selected: var(--leu-color-black-0);
+  --chip-color-checked: var(--leu-color-black-0);
 
   --chip-radio-border-default: var(--leu-color-black-transp-40);
-  --chip-radio-border-selected: var(--leu-color-black-0);
+  --chip-radio-border-checked: var(--leu-color-black-0);
   --chip-radio-background-default: var(--leu-color-black-0);
-  --chip-radio-background-selected: var(--leu-color-func-cyan);
+  --chip-radio-background-checked: var(--leu-color-func-cyan);
 
   --chip-font-regular: var(--leu-font-family-regular);
   --chip-font-black: var(--leu-font-family-black);
@@ -33,6 +33,8 @@ var css_248z = css`:host,
 
   --leu-icon-size: 1rem;
 
+  font-family: var(--leu-font-family-regular);
+
   font-family: var(--chip-font-regular);
 
   /* Allow shrinking to achieve text truncation (ellipsis) */
@@ -45,14 +47,14 @@ var css_248z = css`:host,
 
   --chip-color-default: var(--leu-color-black-0);
   --chip-color-hover: var(--leu-color-black-0);
-  --chip-color-selected: var(--leu-color-black-0);
+  --chip-color-checked: var(--leu-color-black-0);
 }
 
-:host([selected]) {
-  --chip-background-color: var(--chip-background-color-selected);
-  --chip-color: var(--chip-color-selected);
-  --chip-radio-border: var(--chip-radio-border-selected);
-  --chip-radio-background: var(--chip-radio-background-selected);
+:host([checked]) {
+  --chip-background-color: var(--chip-background-color-checked);
+  --chip-color: var(--chip-color-checked);
+  --chip-radio-border: var(--chip-radio-border-checked);
+  --chip-radio-background: var(--chip-radio-background-checked);
 }
 
 .button {
@@ -101,10 +103,10 @@ var css_248z = css`:host,
   text-decoration: none;
 }
 
-:host([selected]) .button:hover,
-:host([selected]) .button:focus-visible {
-  --chip-background-color: var(--chip-background-color-selected-hover);
-  --chip-color: var(--chip-color-selected);
+:host([checked]) .button:hover,
+:host([checked]) .button:focus-visible {
+  --chip-background-color: var(--chip-background-color-checked-hover);
+  --chip-color: var(--chip-color-checked);
 }
 
 :host([href][size="large"]) .button {
@@ -132,7 +134,7 @@ var css_248z = css`:host,
   border-radius: 50%;
 }
 
-:host([variant="radio"][selected]) .button::before {
+:host([variant="radio"][checked]) .button::before {
   border-width: 3px;
 }
 

package/dist/ChipGroup.d.ts

@@ -10,7 +10,13 @@ export class LeuChipGroup extends LeuElement {
     label: string;
     /** @type {"single" | "multiple" | "none"} */
     selectionMode: "single" | "multiple" | "none";
-    get value(): any[];
+    /**
+     * Checks the items with the given values.
+     * If the selectionMode is single, only the first item with the given value is checked.
+     * @param {string[]} valueList
+     */
+    set value(valueList: string[]);
+    get value(): string[];
     /**
      * Determines the heading tag of the accordion toggle.
      * The headingLevel shouldn't be used directly to render the heading tag
@@ -26,5 +32,5 @@ export const SELECTION_MODES: Readonly<{
     multiple: "multiple";
     none: "none";
 }>;
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.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;IAKf,6CAA6C;IAC7C,eADW,QAAQ,GAAG,UAAU,GAAG,MAAM,CACA;IAU3C,mBAEC;IAED;;;;;;OAMG;IACH,yBAMC;IACD,4CAeC;CACF;AAlFD;;;;GAIG;gCA5BmD,0BAA0B"}
+{"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;IA0B3C;;;;OAIG;IACH,+BAQC;IAjBD,sBAEC;IAiBD;;;;;;OAMG;IACH,yBAMC;IACD,4CAeC;CACF;AA7GD;;;;GAIG;gCA5BmD,0BAA0B"}

package/dist/ChipGroup.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { html, unsafeStatic } from 'lit/static-html.js';
 import { css } from 'lit';
 
@@ -40,7 +40,7 @@ class LeuChipGroup extends LeuElement {
     _defineProperty(this, "handleInput", e => {
       if (this.selectionMode === SELECTION_MODES.single) {
         this.items.forEach(item => {
-          item.selected = item === e.target; // eslint-disable-line no-param-reassign
+          item.checked = item === e.target; // eslint-disable-line no-param-reassign
         });
       }
     });
@@ -64,14 +64,41 @@ class LeuChipGroup extends LeuElement {
   }
   connectedCallback() {
     super.connectedCallback();
-    this.addEventListener("input", this.handleInput);
+
+    /**
+     * It is technically possible to add an event listener to the host element
+     * before it is connected to the dom. In that case the outside event listener would
+     * be called before the following event listener. But at this point multiple
+     * radio chips could be selected at the same time because `handleInput` hasn't been
+     * called yet. That's why we use the capture phase.
+     */
+    this.addEventListener("input", this.handleInput, {
+      capture: true
+    });
   }
   disconnectedCallback() {
     super.disconnectedCallback();
-    this.removeEventListener("input", this.handleInput);
+    this.removeEventListener("input", this.handleInput, {
+      capture: true
+    });
   }
   get value() {
-    return this.items.filter(i => i.selected).map(i => i.value);
+    return this.items.filter(i => i.checked).map(i => i.value);
+  }
+
+  /**
+   * Checks the items with the given values.
+   * If the selectionMode is single, only the first item with the given value is checked.
+   * @param {string[]} valueList
+   */
+  set value(valueList) {
+    let hasChanged = false;
+    for (const item of this.items) {
+      item.checked = hasChanged ? false : valueList.includes(item.value);
+      if (this.selectionMode === SELECTION_MODES.single && item.checked) {
+        hasChanged = true;
+      }
+    }
   }
 
   /**

package/dist/ChipLink.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty } from './LeuElement-ba5ea33d.js';
 import { html } from 'lit';
 import { LeuChipBase } from './Chip.js';
 

package/dist/ChipRemovable.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty } from './LeuElement-ba5ea33d.js';
 import { html } from 'lit';
 import { LeuChipBase } from './Chip.js';
 import { LeuIcon } from './Icon.js';

package/dist/ChipSelectable.d.ts

@@ -4,6 +4,8 @@
  * @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.
+ * @prop {boolean} checked - Whether the chip is selected.
+ * @prop {string} value - The value of the chip.
  */
 export class LeuChipSelectable extends LeuChipBase {
     size: string;
@@ -14,7 +16,7 @@ export class LeuChipSelectable extends LeuChipBase {
      * @default "toggle"
      */
     variant: string;
-    selected: boolean;
+    checked: boolean;
     handleClick(): void;
     render(): import("lit-html").TemplateResult<1>;
 }

package/dist/ChipSelectable.d.ts.map

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"ChipSelectable.d.ts","sourceRoot":"","sources":["ChipSelectable.js"],"names":[],"mappings":"AAaA;;;;;;;;GAQG;AACH;IAGI,aAAyB;IAEzB;;;;;OAKG;IACH,gBAA8B;IAC9B,iBAAoB;IAKtB,oBAiBC;IACD,+CAQC;CACF;;;;;;;;;4BAhE2B,WAAW"}

package/dist/ChipSelectable.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty } from './LeuElement-ba5ea33d.js';
 import { html } from 'lit';
 import { LeuChipBase } from './Chip.js';
 
@@ -17,6 +17,8 @@ const VARIANTS = {
  * @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.
+ * @prop {boolean} checked - Whether the chip is selected.
+ * @prop {string} value - The value of the chip.
  */
 class LeuChipSelectable extends LeuChipBase {
   constructor() {
@@ -30,23 +32,23 @@ class LeuChipSelectable extends LeuChipBase {
      * @default "toggle"
      */
     this.variant = VARIANTS.toggle;
-    this.selected = false;
+    this.checked = false;
     if (this.variant === VARIANTS.radio && this.size === SIZES.small) {
       console.warn("Small size has no effect on radio variant");
     }
   }
   handleClick() {
-    let nextSelectedState = this.selected;
+    let nextcheckedState = this.checked;
     if (this.variant === VARIANTS.radio) {
-      nextSelectedState = true;
+      nextcheckedState = true;
     } else {
-      nextSelectedState = !this.selected;
+      nextcheckedState = !this.checked;
     }
-    if (nextSelectedState !== this.selected) {
-      this.selected = nextSelectedState;
+    if (nextcheckedState !== this.checked) {
+      this.checked = nextcheckedState;
       this.dispatchEvent(new CustomEvent("input", {
         detail: {
-          selected: this.selected
+          checked: this.checked
         },
         bubbles: true,
         composed: true
@@ -55,9 +57,9 @@ class LeuChipSelectable extends LeuChipBase {
   }
   render() {
     return html`<button
-      @click=${e => this.handleClick(e)}
+      @click=${() => this.handleClick()}
       class="button"
-      aria-pressed=${this.selected ? "true" : "false"}
+      aria-pressed=${this.checked ? "true" : "false"}
     >
       <span class="label"><slot></slot></span>
     </button>`;
@@ -73,7 +75,7 @@ _defineProperty(LeuChipSelectable, "properties", {
     type: String,
     reflect: true
   },
-  selected: {
+  checked: {
     type: Boolean,
     reflect: true
   },

package/dist/Dropdown.d.ts

@@ -15,5 +15,5 @@ export class LeuDropdown extends LeuElement {
     _getMenu(): any;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.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":"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"}
+{"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,gBAEC;IACD,+CA6BC;CACF;gCAhJqD,0BAA0B"}

package/dist/Dropdown.js

@@ -1,7 +1,7 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, html, nothing } from 'lit';
 import { createRef, ref } from 'lit/directives/ref.js';
-import { H as HasSlotController, L as LeuButton } from './Button-9692e403.js';
+import { H as HasSlotController, L as LeuButton } from './Button-7370f901.js';
 import { LeuMenu } from './Menu.js';
 import { LeuMenuItem } from './MenuItem.js';
 import { LeuPopup } from './Popup.js';

package/dist/Icon.d.ts

@@ -1,4 +1,100 @@
-export type IconPathName = "search" | "link" | "map" | "filter" | "time" | "hide" | "show" | "location" | "file" | "pause" | "play" | "stop" | "remove" | "clear" | "overflow" | "menu" | "close" | "home" | "email" | "forward" | "next" | "confirm" | "print" | "user" | "calendar" | "arrowDown" | "arrowUp" | "delete" | "minus" | "plus" | "comment" | "download" | "files" | "list" | "addNew" | "angleDropDown" | "angleDropup" | "angleLeft" | "angleRight" | "arrowLeft" | "arrowRight" | "caution" | "chatMessage" | "check" | "conference" | "confirmPlain" | "documents" | "edit" | "fileOutline" | "floppy" | "getInformation" | "lock" | "login" | "logout" | "mapLocateMe" | "mapLocation" | "mapNavigation" | "mapPin" | "menuOverflow" | "openMail" | "paperplane" | "paragraph" | "phoneCall" | "pin" | "resizeText" | "upload" | "cc" | "fastForward" | "fastRewind" | "fullScreen" | "playButton" | "previews" | "skipNext" | "skipPrevious" | "facebook" | "google" | "instagram" | "kununu" | "like" | "linkedin" | "love" | "repost" | "share" | "snapchat" | "twitter" | "users" | "vote" | "xing" | "youtube" | "youtubeLogo" | "smileyThrilled" | "smileySmile" | "smileyIndifferent" | "smileySad" | "smileyDevastated";
+export type IconPathName = keyof {
+    addNew: string;
+    angleDropDown: string;
+    angleDropup: string;
+    angleLeft: string;
+    angleRight: string;
+    arrowDown: string;
+    arrowLeft: string;
+    arrowRight: string;
+    arrowUp: string;
+    calendar: string;
+    caution: string;
+    chatMessage: string;
+    check: string;
+    clear: string;
+    close: string;
+    conference: string;
+    confirm: string;
+    confirmPlain: string;
+    delete: string;
+    documents: string;
+    download: string;
+    edit: string;
+    email: string;
+    file: string;
+    fileOutline: string;
+    files: string;
+    filter: string;
+    floppy: string;
+    forward: string;
+    getInformation: string;
+    hide: string;
+    home: string;
+    link: string;
+    list: string;
+    lock: string;
+    location: string;
+    login: string;
+    logout: string;
+    map: string;
+    mapLocateMe: string;
+    mapLocation: string;
+    mapNavigation: string;
+    mapPin: string;
+    menu: string;
+    menuOverflow: string;
+    minus: string;
+    openMail: string;
+    overflow: string;
+    paperplane: string;
+    paragraph: string;
+    phoneCall: string;
+    pin: string;
+    plus: string;
+    print: string;
+    remove: string;
+    resizeText: string;
+    search: string;
+    show: string;
+    time: string;
+    upload: string;
+    cc: string;
+    fastForward: string;
+    fastRewind: string;
+    fullScreen: string;
+    next: string;
+    pause: string;
+    play: string;
+    playButton: string;
+    previews: string;
+    skipNext: string;
+    skipPrevious: string;
+    stop: string;
+    comment: string;
+    facebook: string;
+    google: string;
+    instagram: string;
+    kununu: string;
+    like: string;
+    linkedin: string;
+    love: string;
+    repost: string;
+    share: string;
+    snapchat: string;
+    twitter: string;
+    user: string;
+    users: string;
+    vote: string;
+    xing: string;
+    youtube: string;
+    youtubeLogo: string;
+    smileyThrilled: string;
+    smileySmile: string;
+    smileyIndifferent: string;
+    smileySad: string;
+    smileyDevastated: string;
+};
 /**
  * A component to render all defined zhWeb icons.
  * The `fill` of the icon is set to `currentColor` and
@@ -16,5 +112,5 @@ export class LeuIcon extends LeuElement {
     name: any | "";
     render(): import("lit-html").TemplateResult<1>;
 }
-import { L as LeuElement } from './LeuElement-6de6f209.js';
+import { L as LeuElement } from './LeuElement-ba5ea33d.js';
 //# sourceMappingURL=Icon.d.ts.map

package/dist/Icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["Icon.js"],"names":[],"mappings":";AAsHA;;;;;;;;;GASG;AACH;IAII;;OAEG;IACH,MAFU,GAA8B,GAAG,EAAE,CAE/B;IAEhB,+CAiBC;CACF;gCA3JqD,0BAA0B"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["Icon.js"],"names":[],"mappings":"2BAca;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAW;AAwGxB;;;;;;;;;GASG;AACH;IAII;;OAEG;IACH,MAFU,MAAiC,EAAE,CAE/B;IAEhB,+CAiBC;CACF;gCA3JqD,0BAA0B"}

package/dist/Icon.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-6de6f209.js';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { css, html, svg } from 'lit';
 
 var css_248z = css`svg,