import { Host, h } from "@stencil/core";
export class XQuantity {
    constructor() {
        this.min = 0;
        this.max = undefined;
        this.value = 1;
        this.number = undefined;
    }
    /**
     * On value attribute change
     *
     * @param value
     */
    onValueChange(value) {
        this.number = typeof value === 'number' ? value : parseInt(value);
        this.internals.setFormValue(this.number.toString());
    }
    /**
     * On component will be loaded hook
     */
    componentWillLoad() {
        this.number = this.value;
        this.internals.setFormValue(this.number.toString());
    }
    /**
     * On element change input value
     *
     * @param event
     */
    handleChange(event) {
        this.value = event.target.value;
        this.internals.setFormValue(event.target.value);
    }
    /**
     * Increment number value
     *
     * @returns
     */
    onPlusClick() {
        if (!Number.isNaN(this.number) && this.number + 1 > this.max) {
            return;
        }
        this.number++;
        this.sum.emit(this.number);
    }
    /**
     * Decrement number value
     *
     * @returns
     */
    onMinusClick() {
        if (!Number.isNaN(this.number) && this.number - 1 < this.min) {
            return;
        }
        this.number--;
        this.sub.emit(this.number);
    }
    /**
     * Render element
     */
    render() {
        return h(Host, { key: 'bf3d39314e4e32c95102aa4fa27747f121f6f16a' }, h("x-chip", { key: '3422b39e9b3adfd50325ba305bfbef66b5e69a9e', hoverable: true }, h("x-button", { key: '412df00631a714992838f6fa254e76baf4bafa73', icon: "plus", onClick: this.onPlusClick.bind(this) }), h("input", { key: '5839335e6c343b24e9b5a8f20adde2ee0f824740', type: "number", value: this.number, min: this.min, max: this.max, onInput: this.handleChange.bind(this) }), h("x-button", { key: '0a5ea6ecb54b4fba5a0e5a8def341638220b1714', icon: "minus", onClick: this.onMinusClick.bind(this) })));
    }
    static get is() { return "x-quantity"; }
    static get formAssociated() { return true; }
    static get originalStyleUrls() {
        return {
            "$": ["./style.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["style.css"]
        };
    }
    static get properties() {
        return {
            "min": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element minimal number limit, default is 0"
                },
                "attribute": "min",
                "reflect": false,
                "defaultValue": "0"
            },
            "max": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element maximun number limit,default is infinite"
                },
                "attribute": "max",
                "reflect": false
            },
            "value": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element initial input value"
                },
                "attribute": "value",
                "reflect": false,
                "defaultValue": "1"
            }
        };
    }
    static get states() {
        return {
            "number": {}
        };
    }
    static get events() {
        return [{
                "method": "sub",
                "name": "sub",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Substraction event button click"
                },
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                }
            }, {
                "method": "sum",
                "name": "sum",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Sumarize event button click"
                },
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                }
            }];
    }
    static get watchers() {
        return [{
                "propName": "value",
                "methodName": "onValueChange"
            }];
    }
    static get attachInternalsMemberName() { return "internals"; }
}
