@statistikzh/leu 0.14.2 → 0.14.4

package/dist/LeuElement-x8UlIDDl.js

@@ -0,0 +1,42 @@
+import { css, LitElement } from 'lit';
+
+var css_248z = css`:host,
+:host * {
+  box-sizing: border-box;
+  font-feature-settings: var(--leu-t-font-feature-settings);
+}
+
+/**
+ * If a custom element sets the display property to any value
+ * it will not be hidden by the [hidden] attribute.
+ * That's why we need to specify this rule.
+ */
+
+:host([hidden]) {
+  display: none;
+}
+`;
+
+class LeuElement extends LitElement {
+    static define(name, constructor = this, options = {}) {
+        Object.entries(this.dependencies).forEach(([n, c]) => c.define(n));
+        const currentlyRegisteredConstructor = customElements.get(name);
+        if (currentlyRegisteredConstructor === undefined) {
+            customElements.define(name, constructor, options);
+            return;
+        }
+        if (currentlyRegisteredConstructor !== constructor) {
+            console.warn(`The custom element with the name <${name}> is already registered with a different constructor. This can happen when the same element has been loaded from different modules (e.g. multiple CDN requests or bundles).`);
+            return;
+        }
+        if ("version" in currentlyRegisteredConstructor &&
+            currentlyRegisteredConstructor.version !== constructor.version) {
+            console.warn(`The custom element with the name <${name}> is already defined with the same constructor but a different version (${currentlyRegisteredConstructor.version}).`);
+        }
+    }
+}
+LeuElement.version = "0.14.4";
+LeuElement.dependencies = {};
+LeuElement.styles = css_248z;
+
+export { LeuElement as L };

package/dist/LeuElement.d-BevHqLUu.d.ts

@@ -0,0 +1,10 @@
+import { LitElement, CSSResultGroup } from 'lit';
+
+declare class LeuElement extends LitElement {
+    static version: string;
+    static dependencies: Record<string, typeof LeuElement>;
+    static styles: CSSResultGroup;
+    static define(name: string, constructor?: typeof LeuElement, options?: ElementDefinitionOptions): void;
+}
+
+export { LeuElement as L };

package/dist/Menu.d.ts

@@ -1,4 +1,9 @@
-export type SelectsType = "single" | "multiple" | "none";
+import * as lit_html from 'lit-html';
+import * as lit from 'lit';
+import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
+import { LeuMenuItem } from './MenuItem.js';
+import './Icon.js';
+
 /**
  * @typedef {'single' | 'multiple' | 'none'} SelectsType
  */
@@ -6,25 +11,39 @@ export type SelectsType = "single" | "multiple" | "none";
  * @tagname leu-menu
  * @property {SelectsType} selects - This has only an effect when the role is 'menu'. It defines which role the menu items will get. Default is 'none'.
  */
-export class LeuMenu extends LeuElement {
-    /** @type {SelectsType} */
-    selects: SelectsType;
-    value: any;
+declare class LeuMenu extends LeuElement {
+    static styles: lit.CSSResultGroup[];
+    static shadowRootOptions: {
+        delegatesFocus: boolean;
+        mode: ShadowRootMode;
+        serializable?: boolean;
+        slotAssignment?: SlotAssignmentMode;
+        customElements?: CustomElementRegistry;
+        registry?: CustomElementRegistry;
+    };
+    static properties: {
+        selects: {
+            type: StringConstructor;
+            reflect: boolean;
+        };
+    };
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     _handleSlotChange(): void;
     _setMenuItemRoles(): void;
     /**
      *
      * @returns {import("./MenuItem").LeuMenuItem[]}
      */
-    getMenuItems(): import("./MenuItem").LeuMenuItem[];
+    getMenuItems(): LeuMenuItem[];
     getVisibleMenuItems(): LeuMenuItem[];
     _handleKeyDown(event: any): void;
     setCurrentItem(index: any): any;
     focusItem(index: any): void;
     firstUpdated(): void;
     updated(changedProperties: any): void;
-    render(): import("lit-html").TemplateResult<1>;
+    render(): lit_html.TemplateResult<1>;
 }
-import { L as LeuElement } from './LeuElement-BI1CxItv.js';
-import { LeuMenuItem } from './MenuItem.js';
-//# sourceMappingURL=Menu.d.ts.map
+
+export { LeuMenu };

package/dist/Menu.js

@@ -1,5 +1,5 @@
-import { _ as _defineProperty, L as LeuElement } from './LeuElement-BI1CxItv.js';
 import { css, html } from 'lit';
+import { L as LeuElement } from './LeuElement-x8UlIDDl.js';
 import { LeuMenuItem } from './MenuItem.js';
 import 'lit/directives/if-defined.js';
 import './Icon.js';
@@ -25,125 +25,126 @@ var css_248z = css`:host {
 /**
  * @typedef {'single' | 'multiple' | 'none'} SelectsType
  */
-
 /**
  * @tagname leu-menu
  * @property {SelectsType} selects - This has only an effect when the role is 'menu'. It defines which role the menu items will get. Default is 'none'.
  */
 class LeuMenu extends LeuElement {
-  constructor() {
-    super();
-
-    /** @type {SelectsType} */
-    this.selects = "none";
-    this.value = undefined;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    if (!this.getAttribute("role")) {
-      this.setAttribute("role", "menu");
+    constructor() {
+        super();
+        /** @type {SelectsType} */
+        this.selects = "none";
+        this.value = undefined;
     }
-    this.addEventListener("keydown", this._handleKeyDown);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    this.removeEventListener("keydown", this._handleKeyDown);
-  }
-  _handleSlotChange() {
-    this.setCurrentItem(0);
-    this._setMenuItemRoles();
-  }
-  _setMenuItemRoles() {
-    const menuRole = this.getAttribute("role");
-    let menuItemRole;
-    if (menuRole === "menu") {
-      if (this.selects === "multiple") {
-        menuItemRole = "menuitemcheckbox";
-      } else if (this.selects === "single") {
-        menuItemRole = "menuitemradio";
-      } else {
-        menuItemRole = "menuitem";
-      }
-    } else if (menuRole === "listbox") {
-      menuItemRole = "option";
+    connectedCallback() {
+        super.connectedCallback();
+        if (!this.getAttribute("role")) {
+            this.setAttribute("role", "menu");
+        }
+        this.addEventListener("keydown", this._handleKeyDown);
     }
-    if (menuItemRole) {
-      this.getMenuItems().forEach(menuItem => {
-        menuItem.componentRole = menuItemRole; // eslint-disable-line no-param-reassign
-      });
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener("keydown", this._handleKeyDown);
     }
-  }
-
-  /**
-   *
-   * @returns {import("./MenuItem").LeuMenuItem[]}
-   */
-  getMenuItems() {
-    const slot = this.shadowRoot.querySelector("slot");
-    return slot.assignedElements({
-      flatten: true
-    }).filter(el => el instanceof LeuMenuItem);
-  }
-  getVisibleMenuItems() {
-    return this.getMenuItems().filter(menuItem => !menuItem.hidden);
-  }
-  _handleKeyDown(event) {
-    if (["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) {
-      event.preventDefault();
-      const menuItems = this.getVisibleMenuItems();
-      let index = menuItems.findIndex(menuItem => menuItem.tabbable);
-      if (event.key === "ArrowDown") {
-        index += 1;
-      } else if (event.key === "ArrowUp") {
-        index -= 1;
-      } else if (event.key === "Home") {
-        index = 0;
-      } else if (event.key === "End") {
-        index = menuItems.length - 1;
-      }
-      this.focusItem(index);
+    _handleSlotChange() {
+        this.setCurrentItem(0);
+        this._setMenuItemRoles();
+    }
+    _setMenuItemRoles() {
+        const menuRole = this.getAttribute("role");
+        let menuItemRole;
+        if (menuRole === "menu") {
+            if (this.selects === "multiple") {
+                menuItemRole = "menuitemcheckbox";
+            }
+            else if (this.selects === "single") {
+                menuItemRole = "menuitemradio";
+            }
+            else {
+                menuItemRole = "menuitem";
+            }
+        }
+        else if (menuRole === "listbox") {
+            menuItemRole = "option";
+        }
+        if (menuItemRole) {
+            this.getMenuItems().forEach((menuItem) => {
+                menuItem.componentRole = menuItemRole; // eslint-disable-line no-param-reassign
+            });
+        }
+    }
+    /**
+     *
+     * @returns {import("./MenuItem").LeuMenuItem[]}
+     */
+    getMenuItems() {
+        const slot = this.shadowRoot.querySelector("slot");
+        return slot
+            .assignedElements({ flatten: true })
+            .filter((el) => el instanceof LeuMenuItem);
+    }
+    getVisibleMenuItems() {
+        return this.getMenuItems().filter((menuItem) => !menuItem.hidden);
+    }
+    _handleKeyDown(event) {
+        if (["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) {
+            event.preventDefault();
+            const menuItems = this.getVisibleMenuItems();
+            let index = menuItems.findIndex((menuItem) => menuItem.tabbable);
+            if (event.key === "ArrowDown") {
+                index += 1;
+            }
+            else if (event.key === "ArrowUp") {
+                index -= 1;
+            }
+            else if (event.key === "Home") {
+                index = 0;
+            }
+            else if (event.key === "End") {
+                index = menuItems.length - 1;
+            }
+            this.focusItem(index);
+        }
+    }
+    setCurrentItem(index) {
+        const menuItems = this.getVisibleMenuItems();
+        let currentItem = null;
+        const currentItemIndex = (index + menuItems.length) % menuItems.length;
+        menuItems.forEach((menuItem, i) => {
+            if (i === currentItemIndex) {
+                currentItem = menuItem;
+                menuItem.tabbable = true; // eslint-disable-line no-param-reassign
+            }
+            else {
+                menuItem.tabbable = false; // eslint-disable-line no-param-reassign
+            }
+        });
+        return currentItem;
+    }
+    focusItem(index) {
+        const currentItem = this.setCurrentItem(index);
+        currentItem?.focus();
+    }
+    firstUpdated() {
+        this.setCurrentItem(0);
+    }
+    updated(changedProperties) {
+        if (changedProperties.has("selects")) {
+            this._setMenuItemRoles();
+        }
     }
-  }
-  setCurrentItem(index) {
-    const menuItems = this.getVisibleMenuItems();
-    let currentItem = null;
-    const currentItemIndex = (index + menuItems.length) % menuItems.length;
-    menuItems.forEach((menuItem, i) => {
-      if (i === currentItemIndex) {
-        currentItem = menuItem;
-        menuItem.tabbable = true; // eslint-disable-line no-param-reassign
-      } else {
-        menuItem.tabbable = false; // eslint-disable-line no-param-reassign
-      }
-    });
-    return currentItem;
-  }
-  focusItem(index) {
-    const currentItem = this.setCurrentItem(index);
-    currentItem.focus();
-  }
-  firstUpdated() {
-    this.setCurrentItem(0);
-  }
-  updated(changedProperties) {
-    if (changedProperties.has("selects")) {
-      this._setMenuItemRoles();
+    render() {
+        return html `<slot></slot>`;
     }
-  }
-  render() {
-    return html`<slot></slot>`;
-  }
 }
-_defineProperty(LeuMenu, "styles", [LeuElement.styles, css_248z]);
-_defineProperty(LeuMenu, "shadowRootOptions", {
-  ...LeuElement.shadowRootOptions,
-  delegatesFocus: true
-});
-_defineProperty(LeuMenu, "properties", {
-  selects: {
-    type: String,
-    reflect: true
-  }
-});
+LeuMenu.styles = [LeuElement.styles, css_248z];
+LeuMenu.shadowRootOptions = {
+    ...LeuElement.shadowRootOptions,
+    delegatesFocus: true,
+};
+LeuMenu.properties = {
+    selects: { type: String, reflect: true },
+};
 
 export { LeuMenu };

package/dist/MenuItem.d.ts

@@ -1,4 +1,9 @@
-export type MenuItemRole = "menuitem" | "menuitemcheckbox" | "menuitemradio" | "option" | "none";
+import * as lit_html from 'lit-html';
+import * as lit from 'lit';
+import { nothing } from 'lit';
+import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
+import { LeuIcon } from './Icon.js';
+
 /**
  * @typedef {'menuitem' | 'menuitemcheckbox' | 'menuitemradio' | 'option' | 'none'} MenuItemRole
  */
@@ -13,30 +18,75 @@ export type MenuItemRole = "menuitem" | "menuitemcheckbox" | "menuitemradio" | "
  * @property {boolean} tabbable - If the item should be focusable. Will be reflected as `tabindex` to the underlying button or link
  * @property {MenuItemRole} componentRole - The role of the item. This will be reflected as `role` to the underlying button or link. Default is `'menuitem'.`
  */
-export class LeuMenuItem extends LeuElement {
-    active: boolean;
-    disabled: boolean;
-    multipleSelection: boolean;
-    value: any;
-    href: any;
-    tabbable: any;
-    /** @type {MenuItemRole} */
-    componentRole: MenuItemRole;
+declare class LeuMenuItem extends LeuElement {
+    static dependencies: {
+        "leu-icon": typeof LeuIcon;
+    };
+    static styles: lit.CSSResultGroup[];
+    /**
+     * @internal
+     */
+    static shadowRootOptions: {
+        delegatesFocus: boolean;
+        mode: ShadowRootMode;
+        serializable?: boolean;
+        slotAssignment?: SlotAssignmentMode;
+        customElements?: CustomElementRegistry;
+        registry?: CustomElementRegistry;
+    };
+    static properties: {
+        active: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        multipleSelection: {
+            type: BooleanConstructor;
+            reflect: boolean;
+            attr: string;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        tabbable: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        href: {
+            type: StringConstructor;
+            reflect: boolean;
+        };
+        value: {
+            type: StringConstructor;
+            reflect: boolean;
+        };
+        componentRole: {
+            type: StringConstructor;
+            reflect: boolean;
+        };
+    };
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     _handleClick(event: any): void;
     /**
      * Returns the value of the item. If `value` is not set, it will return the inner text
      * @returns {string}
      */
-    getValue(): string;
+    getValue(): any;
     _getAria(): {
-        disabled: boolean;
+        disabled: any;
+    } | {
+        checked: any;
+        selected: any;
+        role: any;
+        disabled: any;
     };
     _getTabIndex(): 0 | -1;
-    _renderLink(content: any): import("lit-html").TemplateResult<1>;
-    _renderButton(content: any): import("lit-html").TemplateResult<1>;
-    _renderBeforeSlotDefault(): typeof nothing | import("lit-html").TemplateResult<1>;
-    render(): import("lit-html").TemplateResult<1>;
+    _renderLink(content: any): lit_html.TemplateResult<1>;
+    _renderButton(content: any): lit_html.TemplateResult<1>;
+    _renderBeforeSlotDefault(): typeof nothing | lit_html.TemplateResult<1>;
+    render(): lit_html.TemplateResult<1>;
 }
-import { L as LeuElement } from './LeuElement-BI1CxItv.js';
-import { nothing } from 'lit';
-//# sourceMappingURL=MenuItem.d.ts.map
+
+export { LeuMenuItem };