@statistikzh/leu 0.21.1 → 0.22.1

package/dist/Icon.d.ts

@@ -1,156 +1,4 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
-
-type IconPathName = keyof typeof paths;
-declare const paths: {
-    addNew: string;
-    alert: string;
-    angleDropDown: string;
-    angleDropUp: string;
-    angleLeft: string;
-    angleRight: string;
-    arrowDown: string;
-    arrowLeft: string;
-    arrowRight: string;
-    arrowUp: string;
-    backward: string;
-    block: string;
-    calendar: string;
-    camera: string;
-    caution: string;
-    cc: string;
-    chart: string;
-    chatMessage: string;
-    check: string;
-    clear: string;
-    close: string;
-    comment: string;
-    conference: string;
-    confirm: string;
-    confirmPlain: string;
-    conversation: string;
-    copy: string;
-    delete: string;
-    download: string;
-    earth: string;
-    edit: string;
-    email: string;
-    file: string;
-    fileCsv: string;
-    fileOutline: string;
-    filePdf: string;
-    fileXml: string;
-    files: string;
-    filter: string;
-    floppy: string;
-    folder: string;
-    forward: string;
-    getInformation: string;
-    hide: string;
-    home: string;
-    image: string;
-    income: string;
-    launch: string;
-    levelUp: string;
-    like: string;
-    link: string;
-    list: string;
-    location: string;
-    lock: string;
-    login: string;
-    logout: string;
-    love: string;
-    emailOpen: string;
-    map: string;
-    mapLocateMe: string;
-    mapNavigation: string;
-    mapPin: string;
-    menu: string;
-    menuOverflow: string;
-    minus: string;
-    money: string;
-    moneyIncome: string;
-    organisation: string;
-    overflow: string;
-    paperplane: string;
-    paragraph: string;
-    passport: string;
-    phoneCall: string;
-    piechart: string;
-    pill: string;
-    pin: string;
-    plus: string;
-    print: string;
-    refresh: string;
-    remove: string;
-    repost: string;
-    resizeText: string;
-    ruler: string;
-    search: string;
-    securities: string;
-    setting: string;
-    share: string;
-    show: string;
-    smileyDevastated: string;
-    smileyIndifferent: string;
-    smileySad: string;
-    smileySmile: string;
-    smileyThrilled: string;
-    swissId: string;
-    time: string;
-    upload: string;
-    user: string;
-    userMultiple: string;
-    vote: string;
-    zoom: string;
-    zoomOut: string;
-    fastForward: string;
-    fastRewind: string;
-    fullScreen: string;
-    next: string;
-    pause: string;
-    play: string;
-    playButton: string;
-    previous: string;
-    skipNext: string;
-    skipPrevious: string;
-    stop: string;
-    facebook: string;
-    google: string;
-    instagram: string;
-    kununu: string;
-    linkedin: string;
-    snapchat: string;
-    tiktok: string;
-    twitter: string;
-    xing: string;
-    youtube: string;
-    youtubeLogo: string;
-};
-
-/**
- * A component to render all defined zhWeb icons.
- * The `fill` of the icon is set to `currentColor` and
- * can be overriden by setting the css `color` property.
- * If the icon name is not found, a placeholder will be displayed.
- *
- * @tagname leu-icon
- * @cssprop --leu-icon-size - The size of the icon.
- */
-declare class LeuIcon extends LeuElement {
-    static styles: lit.CSSResultGroup[];
-    static properties: {
-        name: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-    };
-    /**
-     * The name of the icon to display.
-     */
-    name: IconPathName | "";
-    render(): lit_html.TemplateResult<1>;
-}
-
-export { LeuIcon };
+import 'lit-html';
+import 'lit';
+import './LeuElement.d-BevHqLUu.js';
+export { L as LeuIcon } from './Icon.d-itcQ94ym.js';

package/dist/Icon.js

@@ -1,7 +1,7 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html, svg } from 'lit';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-BLUQU9Eu.js';
+import { L as LeuElement } from './LeuElement-DfsEye-A.js';
 
 var css_248z = css`:host {
   display: contents;
@@ -182,9 +182,6 @@ class LeuIcon extends LeuElement {
     }
 }
 LeuIcon.styles = [LeuElement.styles, css_248z];
-LeuIcon.properties = {
-    name: { type: String, reflect: true },
-};
 __decorate([
     property({ type: String, reflect: true })
 ], LeuIcon.prototype, "name", void 0);

package/dist/Input.d.ts

@@ -1,37 +1,18 @@
 import * as lit_html from 'lit-html';
+import * as lit_html_directives_ref_js from 'lit-html/directives/ref.js';
 import * as lit from 'lit';
 import { nothing } from 'lit';
 import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
-import { LeuIcon } from './Icon.js';
+import { L as LeuIcon, I as IconPathName } from './Icon.d-itcQ94ym.js';
 
 declare const SIZES: Readonly<{
     SMALL: "small";
     REGULAR: "regular";
 }>;
+type InputType = "date" | "datetime-local" | "email" | "month" | "number" | "password" | "search" | "tel" | "text" | "time" | "week";
 /**
  * A text input element.
  *
- * @prop {boolean} disabled - Disables the input element.
- * @prop {boolean} required - Marks the input element as required.
- * @prop {boolean} clearable - Adds a button to clear the input element.
- * @prop {string} value - The value of the input element.
- * @prop {string} name - The name of the input element.
- * @prop {string} label - The label of the input element.
- * @prop {string} error - A custom error that is completely independent of the validity state. Useful for displaying server side errors.
- * @prop {string} size - The size of the input element.
- * @prop {string} icon - The icon that is displayed at the end of the input element.
- * @prop {string} prefix - A prefix that relates to the value of the input (e.g. CHF).
- * @prop {string} suffix - A suffix that relates to the value of the input (e.g. mm).
- * @prop {string} pattern - A regular expression that the value is checked against.
- * @prop {string} type - The type of the input element.
- * @prop {string} min - The minimum value of the input element.
- * @prop {string} max - The maximum value of the input element.
- * @prop {string} minlength - The minimum length of the input element.
- * @prop {string} maxlength - The maximum length of the input element.
- * @prop {object} validationMessages - Custom validation messages. The key is the name of the validity state and the value is the message.
- * @prop {boolean} novalidate - Disables the browser's validation.
- * @prop {string} step - The step value of the input element.
- *
  * @fires {CustomEvent} input - Dispatched when the value of the input element changes.
  * @fires {CustomEvent} change - Dispatched when the value of the input element changes and the input element loses focus.
  *
@@ -53,92 +34,49 @@ declare class LeuInput extends LeuElement {
         customElements?: CustomElementRegistry;
         registry?: CustomElementRegistry;
     };
-    static properties: {
-        disabled: {
-            type: BooleanConstructor;
-            reflect: boolean;
-        };
-        required: {
-            type: BooleanConstructor;
-            reflect: boolean;
-        };
-        clearable: {
-            type: BooleanConstructor;
-            reflect: boolean;
-        };
-        value: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        name: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        error: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        label: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        prefix: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        suffix: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        size: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        icon: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        pattern: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        type: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        min: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        max: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        maxlength: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        minlength: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        validationMessages: {
-            type: ObjectConstructor;
-        };
-        novalidate: {
-            type: BooleanConstructor;
-            reflect: boolean;
-        };
-        step: {
-            type: StringConstructor;
-            reflect: boolean;
-        };
-        _validity: {
-            state: boolean;
-        };
-    };
+    /** Disables the input element. */
+    disabled: boolean;
+    /** Marks the input element as required */
+    required: boolean;
+    /** Adds a button to clear the input element */
+    clearable: boolean;
+    /** The value of the input element. */
+    value: string;
+    /** The name of the input element. */
+    name: string;
+    /** A custom error that is completely independent of the validity state. Useful for displaying server side errors. */
+    error: string;
+    /** The label of the input element */
+    label: string;
+    /** A prefix that relates to the value of the input (e.g. CHF)  */
+    prefix: string;
+    /** A suffix that relates to the value of the input (e.g. mm). */
+    suffix: string;
+    /** The size of the input element */
+    size: "small" | "regular";
+    /** The icon that is displayed at the end of the input element */
+    icon: IconPathName;
+    /** A regular expression that the value is checked against. */
+    pattern: string;
+    /** The type of the input element. */
+    type: InputType;
+    /** The minimum value of the input element. */
+    min: number;
+    /** The maximum value of the input element. */
+    max: number;
+    /** The step value of the input element. */
+    step: number;
+    /** The maximum length of the input element. */
+    maxlength: number;
+    /** The minimum length of the input element. */
+    minlength: number;
+    /** Custom validation messages. The key is the name of the validity state and the value is the message. */
+    validationMessages: Record<string, string>;
+    /** Disables the browser's validation. */
+    novalidate: boolean;
+    _validity: ValidityState | null;
     static resolveErrorMessage(message: any, refernceValue: any): any;
-    constructor();
+    protected _inputRef: lit_html_directives_ref_js.Ref<HTMLInputElement>;
     get valueAsNumber(): number;
     /**
      * Method for handling the click event of the wrapper element.
@@ -147,56 +85,47 @@ declare class LeuInput extends LeuElement {
      * looks like the input element. But the actual input field does not
      * completely fill the wrapper element. Keyboard events don't need to be
      * handled because the actual input element is focusable.
-     * @private
-     * @param {MouseEvent|PointerEvent} event
-     * @returns {void}
      */
-    handleWrapperClick(event: any): void;
+    protected handleWrapperClick(event: MouseEvent | PointerEvent): void;
     /**
      * Method for handling the blur event of the input element.
      * Checks validity of the input element and sets the validity state.
-     * @private
-     * @param {FocusEvent & {target: HTMLInputElement}} event
-     * @returns {void}
      */
-    handleBlur(event: any): void;
+    protected handleBlur(event: FocusEvent & {
+        target: HTMLInputElement;
+    }): void;
     /**
      * Method for handling the invalid event of the input element.
      * Sets the validity state.
-     * @private
-     * @param {Event} event
-     * @returns {void}
      */
-    handleInvalid(event: any): void;
+    protected handleInvalid(event: Event & {
+        target: HTMLInputElement;
+    }): void;
     /**
      * Method for handling the change event of the input element.
      * Sets the value property and dispatches a change event so that
      * the event can be handled outside the shadow DOM.
-     * @private
-     * @param {Event} event
      * @fires {CustomEvent} change
-     * @returns {void}
      */
-    handleChange(event: any): void;
+    protected handleChange(event: Event & {
+        target: HTMLInputElement;
+    }): void;
     /**
      * Method for handling the input event of the input element.
      * Sets the value property and dispatches an input event so that
      * the event can be handled outside the shadow DOM.
-     * @private
-     * @param {Event} event
-     * @returns {void}
      */
-    handleInput(event: any): void;
+    protected handleInput(event: Event & {
+        target: HTMLInputElement;
+    }): void;
     /**
      * Method for clearing the input element.
      * Sets the value property to an empty string and dispatches
      * an input and a change event.
-     * @private
-     * @returns {void}
      * @fires {CustomEvent} input
      * @fires {CustomEvent} change
      */
-    clear(): void;
+    protected clear(): void;
     /**
      * Merge custom and default validation messages.
      * A validation message can be a function or a string.
@@ -205,29 +134,32 @@ declare class LeuInput extends LeuElement {
      * e.g.
      * `tooLong(this.maxlength)`
      * This way the framework user can create reasonable validation messages
-     *
-     * @returns {Object} validationMessages
      */
-    getValidationMessages(): any;
+    protected getValidationMessages(): {
+        badInput: string;
+        patternMismatch: string;
+        rangeOverflow: (max: any) => string;
+        rangeUnderflow: (min: any) => string;
+        stepMismatch: string;
+        tooLong: (maxlength: any) => string;
+        tooShort: (minlength: any) => string;
+        typeMismatch: string;
+        valueMissing: string;
+    };
     isInvalid(): boolean;
     /**
      * Check input validation
-     * @returns {boolean} if valid or not
      */
-    checkValidity(): any;
+    checkValidity(): boolean;
     /**
      * Creates an error list with an item for the given validity state.
-     * @returns {import("lit").TemplateResult | nothing}
      */
-    renderErrorMessages(): typeof nothing | lit_html.TemplateResult<1>;
+    protected renderErrorMessages(): typeof nothing | lit_html.TemplateResult<1>;
     /**
      * Determines the content that is displayed after the input element.
      * This can be either an icon, a clear button or an error indicator icon.
-     *
-     * @private
-     * @returns {import("lit").TemplateResult | nothing}
      */
-    renderAfterContent(): typeof nothing | lit_html.TemplateResult<1>;
+    protected renderAfterContent(): typeof nothing | lit_html.TemplateResult<1>;
     render(): lit_html.TemplateResult<1>;
 }