@statistikzh/leu 0.5.1 → 0.7.0

package/dist/RadioGroup.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-ba5ea33d.js';
+import { css, html } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 
 var css_248z = css`:host {
@@ -38,7 +38,7 @@ var css_248z = css`:host {
 /**
  * @tagname leu-radio-group
  */
-class LeuRadioGroup extends LitElement {
+class LeuRadioGroup extends LeuElement {
   constructor() {
     super();
     _defineProperty(this, "handleFocusIn", e => {
@@ -65,11 +65,9 @@ class LeuRadioGroup extends LitElement {
       this.setTabIndex();
     });
     _defineProperty(this, "handleInput", e => {
-      if (e.target.checked) {
-        this.items.filter(item => item !== e.target).forEach(item => {
-          item.checked = false; // eslint-disable-line no-param-reassign
-        });
-      }
+      this.items.forEach(item => {
+        item.checked = item === e.target; // eslint-disable-line no-param-reassign
+      });
     });
     this.orientation = "HORIZONTAL";
     this._currentIndex = 0;
@@ -89,12 +87,23 @@ class LeuRadioGroup extends LitElement {
     this.removeEventListeners();
   }
   addEventListeners() {
-    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 buttons 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
+    });
     this.addEventListener("focusin", this.handleFocusIn);
     this.addEventListener("keydown", this.handleKeyDown);
   }
   removeEventListeners() {
-    this.removeEventListener("input", this.handleInput);
+    this.removeEventListener("input", this.handleInput, {
+      capture: true
+    });
     this.removeEventListener("focusin", this.handleFocusIn);
     this.removeEventListener("keydown", this.handleKeyDown);
   }
@@ -130,7 +139,7 @@ class LeuRadioGroup extends LitElement {
     });
   }
   handleItems() {
-    this.items = [...this.querySelectorAll(":scope > *:not([slot])")];
+    this.items = Array.from(this.querySelectorAll(":scope > *:not([slot])"));
     this.initializeIndex();
     this.setTabIndex();
   }

package/dist/ScrollTop.d.ts

@@ -1,7 +1,7 @@
 /**
  * @tagname leu-scroll-top
  */
-export class LeuScrollTop extends LitElement {
+export class LeuScrollTop extends LeuElement {
     static scrollToTop(): void;
     _scrollDown: boolean;
     /**
@@ -15,5 +15,5 @@ export class LeuScrollTop extends LitElement {
     _scrollListener: Function;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { LitElement } from 'lit';
+import { L as LeuElement } from './LeuElement-ba5ea33d.js';
 //# sourceMappingURL=ScrollTop.d.ts.map

package/dist/ScrollTop.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollTop.d.ts","sourceRoot":"","sources":["ScrollTop.js"],"names":[],"mappings":"AA8CA;;GAEG;AACH;IAwCE,2BAMC;IAtCO,qBAAwB;IAM5B;;;;OAIG;IACH,qBAA2E;IAC3E,kBAA+B;IAQjC,gBAAgB;IAChB,0BAAgC;IAkBlC,+CAgBC;CACF;2BAhHqC,KAAK"}
+{"version":3,"file":"ScrollTop.d.ts","sourceRoot":"","sources":["ScrollTop.js"],"names":[],"mappings":"AA4CA;;GAEG;AACH;IAwCE,2BAMC;IAtCO,qBAAwB;IAM5B;;;;OAIG;IACH,qBAA2E;IAC3E,kBAA+B;IAQjC,gBAAgB;IAChB,0BAAgC;IAkBlC,+CAgBC;CACF;gCA/GqD,0BAA0B"}

package/dist/ScrollTop.js

@@ -1,12 +1,10 @@
-import { _ as _defineProperty } from './_rollupPluginBabelHelpers-20f659f4.js';
-import { css, LitElement, html } from 'lit';
+import { _ as _defineProperty, L as LeuElement } from './LeuElement-ba5ea33d.js';
+import { css, html } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
-import './leu-button.js';
+import { L as LeuButton } from './Button-7370f901.js';
+import { LeuIcon } from './Icon.js';
 import { t as throttle } from './utils-65469421.js';
-import './defineElement-40372b4b.js';
-import './Button-5326c982.js';
 import 'lit/directives/if-defined.js';
-import './icon-03e86700.js';
 
 var css_248z = css`.scroll-top {
   overflow: hidden;
@@ -47,7 +45,7 @@ var css_248z = css`.scroll-top {
 /**
  * @tagname leu-scroll-top
  */
-class LeuScrollTop extends LitElement {
+class LeuScrollTop extends LeuElement {
   constructor() {
     super();
     /** @internal */
@@ -102,16 +100,20 @@ class LeuScrollTop extends LitElement {
     return html`
       <div class=${classMap(cssClasses)}>
         <leu-button
-          icon="arrowUp"
           label="Zum Seitenanfang"
           round
           @click="${() => LeuScrollTop.scrollToTop()}"
         >
+          <leu-icon name="arrowUp"></leu-icon>
         </leu-button>
       </div>
     `;
   }
 }
+_defineProperty(LeuScrollTop, "dependencies", {
+  "leu-button": LeuButton,
+  "leu-icon": LeuIcon
+});
 _defineProperty(LeuScrollTop, "styles", css_248z);
 _defineProperty(LeuScrollTop, "properties", {
   _showButton: {

package/dist/Select.d.ts

@@ -2,9 +2,22 @@
  * @tagname leu-select
  * @slot before - Optional content the appears before the option list
  * @slot after - Optional content the appears after the option list
+ * @property {string} name - Reflects to the name attribute of the hidden input field that would be used in a form
+ * @property {boolean} open - The expanded state of the popup
+ * @property {string} label - The label of the select
+ * @property {array} value - List of selected values. If they're set from outside the component, the select element tries to find all the options with the given values and selects them.
+ * @property {boolean} clearable - Show a clearable button to reset the value
+ * @property {boolean} disabled - If the select should be disabled
+ * @property {boolean} filterable - Show an input field to filter the options inside the popup
+ * @property {boolean} multiple - Allow multiple selections
+ * @attribute {string} value - The selected values separated by commas.
  */
-export class LeuSelect extends LitElement {
+export class LeuSelect extends LeuElement {
     static get properties(): {
+        name: {
+            type: StringConstructor;
+            reflect: boolean;
+        };
         open: {
             type: BooleanConstructor;
             reflect: boolean;
@@ -13,11 +26,11 @@ export class LeuSelect extends LitElement {
             type: StringConstructor;
             reflect: boolean;
         };
-        options: {
-            type: ArrayConstructor;
-        };
         value: {
             type: ArrayConstructor;
+            converter: {
+                fromAttribute(value: any): any;
+            };
         };
         clearable: {
             type: BooleanConstructor;
@@ -35,7 +48,13 @@ export class LeuSelect extends LitElement {
             type: BooleanConstructor;
             reflect: boolean;
         };
-        optionFilter: {
+        _optionFilter: {
+            state: boolean;
+        };
+        _hasFilterResults: {
+            state: boolean;
+        };
+        _displayValue: {
             state: boolean;
         };
     };
@@ -46,53 +65,72 @@ export class LeuSelect extends LitElement {
     clearable: boolean;
     filterable: boolean;
     value: any[];
-    options: any[];
     label: string;
+    name: string;
     /** @internal */
-    _arrowIcon: import("lit-html").TemplateResult<1>;
+    _optionFilter: string;
     /** @internal */
-    _clearIcon: import("lit-html").TemplateResult<1>;
+    _hasFilterResults: boolean;
     /** @internal */
-    optionFilter: string;
+    _deferedChangeEvent: boolean;
     /** @internal */
-    deferedChangeEvent: boolean;
-    /**
-     * @type {import("lit/directives/ref").Ref<import("../menu/Menu").LeuMenu>}
-     */
-    menuRef: import("lit/directives/ref").Ref<any>;
+    _displayValue: string;
     /**
      * @type {import("lit/directives/ref").Ref<import("../input/Input").LeuInput>}
      */
-    optionFilterRef: import("lit/directives/ref").Ref<any>;
+    _optionFilterRef: import("lit/directives/ref").Ref<any>;
     /**
      * @type {import("lit/directives/ref").Ref<HTMLButtonElement>}
      */
-    toggleButtonRef: import("lit/directives/ref").Ref<HTMLButtonElement>;
+    _toggleButtonRef: import("lit/directives/ref").Ref<HTMLButtonElement>;
+    /**
+     * @type {import("lit/directives/ref").Ref<import("../menu/Menu").LeuMenu>}
+     */
+    _menuRef: import("lit/directives/ref").Ref<any>;
     updated(changedProperties: any): void;
-    getDisplayValue(value: any): any;
-    getFilteredOptions(): any[];
-    emitUpdateEvents(): void;
-    emitInputEvent(): void;
-    emitChangeEvent(): void;
-    clearValue(event: any): void;
-    toggleDropdown(): void;
-    openDropdown(): void;
-    closeDropdown(): void;
     /**
-     * Adds or replaces the given option in the options array.
-     *
-     * @param {*} option
+     * Apply the current state to the menu items.
+     * - Set the active property when the value property has changed.
+     * - Hide menu items that do not match the filter.
+     */
+    _updateMenuItems(changed: any): Promise<void>;
+    /**
+     * @internal
+     * @param {KeyboardEvent} event
+     */
+    _handleToggleKeyDown(event: KeyboardEvent): Promise<void>;
+    /**
+     * @internal
+     * @param {KeyboardEvent} event
+     */
+    _handleFilterInputKeyDown(event: KeyboardEvent): void;
+    /**
+     * Determines the value or label that should be displayed inside the toggle button.
+     * @returns {String | nothing}
+     */
+    _getDisplayValue(): string | typeof nothing;
+    _emitInputEvent(): void;
+    _emitChangeEvent(): void;
+    _clearValue(event: any): void;
+    _toggleDropdown(): void;
+    _closeDropdown(): void;
+    _handleFilterInput(event: any): void;
+    /**
+     * Checks if the given value is selected.
+     * @param {String} menuItemValue
+     * @returns {Boolean}
+     */
+    _isSelected(menuItemValue: string): boolean;
+    _handleMenuItemClick(event: any): void;
+    /**
+     * Close the dropdown if the focus moves outside the component.
      */
-    selectOption(option: any): void;
-    handleApplyClick(): void;
-    handleFilterInput(event: any): void;
-    isSelected(option: any): boolean;
-    renderMenu(): import("lit-html").TemplateResult<1>;
-    renderFilterInput(): import("lit-html").TemplateResult<1> | typeof nothing;
-    renderApplyButton(): import("lit-html").TemplateResult<1> | typeof nothing;
-    renderToggleButton(): import("lit-html").TemplateResult<1>;
+    _handlePopupFocusOut(event: any): void;
+    _renderFilterInput(): import("lit-html").TemplateResult<1> | typeof nothing;
+    _renderApplyButton(): import("lit-html").TemplateResult<1> | typeof nothing;
+    _renderToggleButton(): import("lit-html").TemplateResult<1>;
     render(): import("lit-html").TemplateResult<1>;
 }
-import { LitElement } from 'lit';
+import { L as LeuElement } from './LeuElement-ba5ea33d.js';
 import { nothing } from 'lit';
 //# sourceMappingURL=Select.d.ts.map

package/dist/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["Select.js"],"names":[],"mappings":"AA6PA;;;;GAIG;AACH;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAoCC;IACD,wCAKC;IA4BC,cAAiB;IACjB,kBAAqB;IAErB,kBAAqB;IACrB,mBAAsB;IACtB,oBAAuB;IACvB,aAAe;IACf,eAAiB;IACjB,cAAe;IAEf,gBAAgB;IAChB,iDAAuC;IAEvC,gBAAgB;IAChB,iDAA+B;IAE/B,gBAAgB;IAChB,qBAAsB;IAEtB,gBAAgB;IAChB,4BAA+B;IAE/B;;OAEG;IACH,SAFU,OAAO,oBAAoB,EAAE,GAAG,KAAgC,CAEhD;IAC1B;;OAEG;IACH,iBAFU,OAAO,oBAAoB,EAAE,GAAG,KAAmC,CAE3C;IAClC;;OAEG;IACH,iBAFU,OAAO,oBAAoB,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAE3B;IAUpC,sCAUC;IACD,iCAKC;IACD,4BAKC;IACD,yBAGC;IACD,uBAMC;IACD,wBAMC;IACD,6BAMC;IACD,uBAIC;IACD,qBAEC;IACD,sBAMC;IAED;;;;OAIG;IACH,gCAYC;IACD,yBAEC;IACD,oCAEC;IACD,iCAEC;IACD,mDAqCC;IACD,2EAYC;IACD,2EAaC;IACD,2DA+BC;IACD,+CAkCC;CACF;2BAllB8C,KAAK;wBAAL,KAAK"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["Select.js"],"names":[],"mappings":"AA6PA;;;;;;;;;;;;;GAaG;AACH;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAmDC;IACD,wCAKC;IA4BC,cAAiB;IACjB,kBAAqB;IAErB,kBAAqB;IACrB,mBAAsB;IACtB,oBAAuB;IACvB,aAAe;IACf,cAAe;IACf,aAAc;IAEd,gBAAgB;IAChB,sBAAuB;IAEvB,gBAAgB;IAChB,2BAA6B;IAE7B,gBAAgB;IAChB,6BAAgC;IAEhC,gBAAgB;IAChB,sBAAuB;IAEvB;;OAEG;IACH,kBAFU,OAAO,oBAAoB,EAAE,GAAG,KAAmC,CAE1C;IACnC;;OAEG;IACH,kBAFU,OAAO,oBAAoB,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAE1B;IAEnC;;OAEG;IACH,UAFU,OAAO,oBAAoB,EAAE,GAAG,KAAgC,CAE/C;IAU7B,sCAoBC;IAED;;;;OAIG;IACH,8CA0BC;IACD;;;OAGG;IACH,4BAFW,aAAa,iBAcvB;IAED;;;OAGG;IACH,iCAFW,aAAa,QAQvB;IAED;;;OAGG;IACH,oBAFa,uBAAgB,CAO5B;IACD,wBAMC;IACD,yBAMC;IACD,8BAOC;IACD,wBAIC;IACD,uBAMC;IACD,qCAEC;IAED;;;;OAIG;IACH,4CAEC;IACD,uCAoBC;IAED;;OAEG;IACH,uCAIC;IACD,4EAaC;IACD,4EAeC;IACD,4DAmCC;IACD,+CAmDC;CACF;gCA7qBqD,0BAA0B;wBAC7C,KAAK"}