@db-ux/wc-core-components 1.0.0-test-13b991d

package/dist/collection/components/input/input.js

@@ -0,0 +1,1118 @@
+import { cls, delay, getHideProp, hasVoiceOver, isArrayOfStrings, stringPropVisible, uuid, } from "../../utils";
+import { DEFAULT_DATALIST_ID_SUFFIX, DEFAULT_INVALID_MESSAGE, DEFAULT_INVALID_MESSAGE_ID_SUFFIX, DEFAULT_LABEL, DEFAULT_MESSAGE_ID_SUFFIX, DEFAULT_PLACEHOLDER, DEFAULT_VALID_MESSAGE, DEFAULT_VALID_MESSAGE_ID_SUFFIX, } from "../../shared/constants";
+import { h } from "@stencil/core";
+/**
+ * @slot children - This is a default/unnamed slot
+
+ */
+export class DBInput {
+    constructor() {
+        this._id = undefined;
+        this._messageId = undefined;
+        this._validMessageId = undefined;
+        this._invalidMessageId = undefined;
+        this._dataListId = undefined;
+        this._descByIds = "";
+        this._value = "";
+        this._voiceOverFallback = "";
+    }
+    handleInput(event) {
+        if (this.onInput) {
+            this.onInput.emit(event);
+        }
+        if (this.input) {
+            this.input(event);
+        }
+    }
+    handleChange(event) {
+        var _a, _b, _c, _d, _e, _f;
+        if (this.onChange) {
+            this.onChange.emit(event);
+        }
+        if (this.change) {
+            this.change(event);
+        }
+        /* For a11y reasons we need to map the correct message with the input */
+        if (!((_a = this._ref) === null || _a === void 0 ? void 0 : _a.validity.valid) || this.validation === "invalid") {
+            this._descByIds = this._invalidMessageId;
+            if (hasVoiceOver()) {
+                this._voiceOverFallback =
+                    (_d = (_b = this.invalidMessage) !== null && _b !== void 0 ? _b : (_c = this._ref) === null || _c === void 0 ? void 0 : _c.validationMessage) !== null && _d !== void 0 ? _d : DEFAULT_INVALID_MESSAGE;
+                delay(() => (this._voiceOverFallback = ""), 1000);
+            }
+        }
+        else if (this.validation === "valid" ||
+            (((_e = this._ref) === null || _e === void 0 ? void 0 : _e.validity.valid) &&
+                (this.required || this.minLength || this.maxLength || this.pattern))) {
+            this._descByIds = this._validMessageId;
+            if (hasVoiceOver()) {
+                this._voiceOverFallback = (_f = this.validMessage) !== null && _f !== void 0 ? _f : DEFAULT_VALID_MESSAGE;
+                delay(() => (this._voiceOverFallback = ""), 1000);
+            }
+        }
+        else if (stringPropVisible(this.message, this.showMessage)) {
+            this._descByIds = this._messageId;
+        }
+        else {
+            this._descByIds = "";
+        }
+    }
+    handleBlur(event) {
+        if (this.onBlur) {
+            this.onBlur.emit(event);
+        }
+        if (this.blur) {
+            this.blur(event);
+        }
+    }
+    handleFocus(event) {
+        if (this.onFocus) {
+            this.onFocus.emit(event);
+        }
+        if (this.focus) {
+            this.focus(event);
+        }
+    }
+    getDataList(_list) {
+        return Array.from((isArrayOfStrings(_list)
+            ? _list.map((val) => ({
+                value: val,
+                label: undefined,
+            }))
+            : _list) || []);
+    }
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    enableAttributePassing(element, customElementSelector) {
+        const parent = element === null || element === void 0 ? void 0 : element.closest(customElementSelector);
+        if (element && parent) {
+            const attributes = parent.attributes;
+            for (let i = 0; i < attributes.length; i++) {
+                const attr = attributes.item(i);
+                if (attr &&
+                    (attr.name.startsWith("data-") || attr.name.startsWith("aria-"))) {
+                    element.setAttribute(attr.name, attr.value);
+                    parent.removeAttribute(attr.name);
+                }
+                if (attr && attr.name === "class") {
+                    const isWebComponent = attr.value.includes("hydrated");
+                    const value = attr.value.replace("hydrated", "").trim();
+                    const currentClass = element.getAttribute("class");
+                    element.setAttribute(attr.name, `${currentClass ? `${currentClass} ` : ""}${value}`);
+                    if (isWebComponent) {
+                        // Stencil is using this class for lazy loading component
+                        parent.setAttribute("class", "hydrated");
+                    }
+                    else {
+                        parent.removeAttribute(attr.name);
+                    }
+                }
+            }
+        }
+    }
+    componentDidLoad() {
+        var _a;
+        this.enableAttributePassing(this._ref, "db-input");
+        const mId = (_a = this.id) !== null && _a !== void 0 ? _a : `input-${uuid()}`;
+        this._id = mId;
+        this._messageId = mId + DEFAULT_MESSAGE_ID_SUFFIX;
+        this._validMessageId = mId + DEFAULT_VALID_MESSAGE_ID_SUFFIX;
+        this._invalidMessageId = mId + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;
+        this._dataListId = mId + DEFAULT_DATALIST_ID_SUFFIX;
+    }
+    componentDidUpdate() {
+        var _a;
+        if (this._id) {
+            const messageId = this._id + DEFAULT_MESSAGE_ID_SUFFIX;
+            this._messageId = messageId;
+            this._validMessageId = this._id + DEFAULT_VALID_MESSAGE_ID_SUFFIX;
+            this._invalidMessageId = this._id + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;
+            this._dataListId =
+                (_a = this.dataListId) !== null && _a !== void 0 ? _a : this._id + DEFAULT_DATALIST_ID_SUFFIX;
+            if (stringPropVisible(this.message, this.showMessage)) {
+                this._descByIds = messageId;
+            }
+        }
+        this._value = this.value;
+    }
+    render() {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        return (h("div", { key: '0f521207be8cf0672a87922ec9639f47ef9d39ac', class: cls("db-input", this.className), "data-variant": this.variant, "data-hide-label": getHideProp(this.showLabel), "data-hide-icon": getHideProp(this.showIcon), "data-icon": this.icon, "data-icon-after": this.iconAfter, "data-hide-icon-after": getHideProp(this.showIcon) }, h("label", { key: '711cfa71b5f0e1b2d6ba89a6e43e2f6e7f97d089', htmlFor: this._id }, (_a = this.label) !== null && _a !== void 0 ? _a : DEFAULT_LABEL), h("input", { key: '4f5316e89c031116fc09c3a42f4c42e3d430ad7f', "aria-invalid": this.validation === "invalid", "data-custom-validity": this.validation, ref: (el) => {
+                this._ref = el;
+            }, id: this._id, name: this.name, type: this.type || "text", placeholder: (_b = this.placeholder) !== null && _b !== void 0 ? _b : DEFAULT_PLACEHOLDER, disabled: this.disabled, required: this.required, step: this.step, value: (_c = this.value) !== null && _c !== void 0 ? _c : this._value, maxLength: this.maxLength, minLength: this.minLength, max: this.max, min: this.min, readOnly: this.readOnly, form: this.form, pattern: this.pattern, autoComplete: this.autocomplete, autoFocus: this.autofocus, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), onBlur: (event) => this.handleBlur(event), onFocus: (event) => this.handleFocus(event), list: this.dataList && this._dataListId, "aria-describedby": this._descByIds }), this.dataList ? (h("datalist", { id: this._dataListId }, (_d = this.getDataList(this.dataList)) === null || _d === void 0 ? void 0 : _d.map((option) => (h("option", { key: this._dataListId + "-option-" + option.value, value: option.value }, option.label))))) : null, h("slot", { key: 'd8989ce54df793e12783e695c47fdd0459ff76a2' }), stringPropVisible(this.message, this.showMessage) ? (h("db-infotext", { size: "small", icon: this.messageIcon, id: this._messageId }, this.message)) : null, h("db-infotext", { key: '38ff43ca42a686082cda229801079baa2cd14101', size: "small", semantic: "successful", id: this._validMessageId }, (_e = this.validMessage) !== null && _e !== void 0 ? _e : DEFAULT_VALID_MESSAGE), h("db-infotext", { key: '713f3e75192a41fcae4de9b6829bfa17c461097d', size: "small", semantic: "critical", id: this._invalidMessageId }, (_h = (_f = this.invalidMessage) !== null && _f !== void 0 ? _f : (_g = this._ref) === null || _g === void 0 ? void 0 : _g.validationMessage) !== null && _h !== void 0 ? _h : DEFAULT_INVALID_MESSAGE), h("span", { key: '8ebbf7d87f4adc7ebcf7e8ea138c6a4cac88b588', "data-visually-hidden": "true", role: "status" }, this._voiceOverFallback)));
+    }
+    static get is() { return "db-input"; }
+    static get properties() {
+        return {
+            "id": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"id\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "id",
+                "reflect": false
+            },
+            "dataListId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"dataListId\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "data-list-id",
+                "reflect": false
+            },
+            "message": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"message\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "message",
+                "reflect": false
+            },
+            "showMessage": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"showMessage\"]",
+                    "resolved": "boolean",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "show-message",
+                "reflect": false
+            },
+            "value": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"value\"]",
+                    "resolved": "any",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "value",
+                "reflect": false
+            },
+            "input": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"input\"]",
+                    "resolved": "(event: Event) => void",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "change": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"change\"]",
+                    "resolved": "(event: Event) => void",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "validation": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"validation\"]",
+                    "resolved": "\"invalid\" | \"no-validation\" | \"valid\"",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "validation",
+                "reflect": false
+            },
+            "invalidMessage": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"invalidMessage\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "invalid-message",
+                "reflect": false
+            },
+            "required": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"required\"]",
+                    "resolved": "boolean",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "required",
+                "reflect": false
+            },
+            "minLength": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"minLength\"]",
+                    "resolved": "number",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "min-length",
+                "reflect": false
+            },
+            "maxLength": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"maxLength\"]",
+                    "resolved": "number",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "max-length",
+                "reflect": false
+            },
+            "pattern": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"pattern\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "pattern",
+                "reflect": false
+            },
+            "validMessage": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"validMessage\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "valid-message",
+                "reflect": false
+            },
+            "blur": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"blur\"]",
+                    "resolved": "(event: FocusEvent) => void",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "focus": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"focus\"]",
+                    "resolved": "(event: FocusEvent) => void",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "className": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"className\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "classname",
+                "reflect": false
+            },
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"variant\"]",
+                    "resolved": "\"above\" | \"floating\"",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "variant",
+                "reflect": false
+            },
+            "showLabel": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"showLabel\"]",
+                    "resolved": "boolean",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "show-label",
+                "reflect": false
+            },
+            "showIcon": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"showIcon\"]",
+                    "resolved": "boolean",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "show-icon",
+                "reflect": false
+            },
+            "icon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"icon\"]",
+                    "resolved": "BaseIconTypes | LooseAutocomplete",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "icon",
+                "reflect": false
+            },
+            "iconAfter": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"iconAfter\"]",
+                    "resolved": "BaseIconTypes | LooseAutocomplete",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "icon-after",
+                "reflect": false
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"label\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "label",
+                "reflect": false
+            },
+            "name": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"name\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "name",
+                "reflect": false
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"type\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "type",
+                "reflect": false
+            },
+            "placeholder": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"placeholder\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "placeholder",
+                "reflect": false
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"disabled\"]",
+                    "resolved": "boolean",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "disabled",
+                "reflect": false
+            },
+            "step": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"step\"]",
+                    "resolved": "number | string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "step",
+                "reflect": false
+            },
+            "max": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"max\"]",
+                    "resolved": "number | string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "max",
+                "reflect": false
+            },
+            "min": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"min\"]",
+                    "resolved": "number | string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "min",
+                "reflect": false
+            },
+            "readOnly": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"readOnly\"]",
+                    "resolved": "boolean",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "read-only",
+                "reflect": false
+            },
+            "form": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"form\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "form",
+                "reflect": false
+            },
+            "autocomplete": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"autocomplete\"]",
+                    "resolved": "string",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "autocomplete",
+                "reflect": false
+            },
+            "autofocus": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"autofocus\"]",
+                    "resolved": "boolean",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "autofocus",
+                "reflect": false
+            },
+            "dataList": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"dataList\"]",
+                    "resolved": "ValueLabelType[] | string[]",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "messageIcon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DBInputProps[\"messageIcon\"]",
+                    "resolved": "BaseIconTypes | LooseAutocomplete",
+                    "references": {
+                        "DBInputProps": {
+                            "location": "import",
+                            "path": "./model",
+                            "id": "src/components/input/model.ts::DBInputProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "message-icon",
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "_id": {},
+            "_messageId": {},
+            "_validMessageId": {},
+            "_invalidMessageId": {},
+            "_dataListId": {},
+            "_descByIds": {},
+            "_value": {},
+            "_voiceOverFallback": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "onInput",
+                "name": "onInput",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "onChange",
+                "name": "onChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "onBlur",
+                "name": "onBlur",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "onFocus",
+                "name": "onFocus",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=input.js.map