/*!
 * Built by ShiftSoftware
 * Copyright (c)
 */
import { Host, h } from "@stencil/core";
import cn from "../../global/lib/cn";
import { getInputLocalization } from "../../features/form-hook/index";
import { FormInputLabel } from "./components/form-input-label";
import { FormErrorMessage } from "./components/form-error-message";
const partKeyPrefix = 'form-textarea-';
export class FormTextArea {
    constructor() {
        this.localization = {};
    }
    async componentWillLoad() {
        this.form.subscribe(this.name, this);
        this.onStaticValueChange(this.staticValue, false);
    }
    async onStaticValueChange(newStaticValue, notInitialLoad = true) {
        if (!!newStaticValue) {
            this.defaultValue = newStaticValue;
            this.inputRef.value = newStaticValue;
        }
        else if (notInitialLoad) {
            this.defaultValue = '';
            this.inputRef.value = '';
        }
    }
    async componentDidLoad() {
        this.inputRef = this.el.getElementsByClassName(partKeyPrefix + this.name)[0];
    }
    async disconnectedCallback() {
        this.form.unsubscribe(this.name);
    }
    reset(newValue) {
        const value = newValue || this.defaultValue || '';
        this.inputRef.value = value;
    }
    render() {
        const { disabled, isRequired, meta, isError, errorMessage } = this.form.getInputState(this.name);
        const { label, placeholder, errorTextMessage } = getInputLocalization(this, meta, errorMessage);
        const isDisabled = disabled || this.isLoading || !!this.staticValue || this.isDisabled;
        return (h(Host, { key: 'bc62eed7119763aac1501028b736b2d847a365fc', translate: "no" }, h("label", { key: '2fd748bfee9e5eb76e1a89320ecdd00f9ceee4f6', part: `form-textarea ${this.name}`, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, { disabled: isDisabled }) }, h(FormInputLabel, { key: '628d9ecc72704ba8bd6abeffc6d202e1311744cf', name: this.name, isRequired: isRequired, label: label }), h("div", { key: '79d9cc8cbe3678db7c2ce030bde38c412a6d41d9', part: `${this.name}-container form-input-container`, class: "form-input-container" }, h("textarea", { key: '671f5139c759a3932a6440c9218483b34164f39d', name: this.name, disabled: isDisabled, placeholder: placeholder, part: `${this.name}-textarea form-input-textarea`, class: cn('form-input-style form-input-textarea-style', partKeyPrefix + this.name, {
                'form-input-error-style': isError,
            }) }, this.defaultValue)), h("div", { key: '6dd64696bf929479eb707d3380301251e1d83457', class: "-mt-1" }, h(FormErrorMessage, { key: '567ad33649ecd2b4666be21b2b3f34cda9d72404', name: this.name, isError: isError, errorMessage: errorTextMessage })))));
    }
    static get is() { return "form-text-area"; }
    static get originalStyleUrls() {
        return {
            "$": ["form-inputs.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["form-inputs.css"]
        };
    }
    static get properties() {
        return {
            "name": {
                "type": "string",
                "attribute": "name",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false
            },
            "wrapperId": {
                "type": "string",
                "attribute": "wrapper-id",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false
            },
            "form": {
                "type": "unknown",
                "attribute": "form",
                "mutable": false,
                "complexType": {
                    "original": "FormHook<any>",
                    "resolved": "FormHook<any>",
                    "references": {
                        "FormHook": {
                            "location": "import",
                            "path": "~features/form-hook",
                            "id": "src/features/form-hook/index.ts::FormHook"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false
            },
            "isLoading": {
                "type": "boolean",
                "attribute": "is-loading",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false
            },
            "defaultValue": {
                "type": "string",
                "attribute": "default-value",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false
            },
            "wrapperClass": {
                "type": "string",
                "attribute": "wrapper-class",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false
            },
            "staticValue": {
                "type": "string",
                "attribute": "static-value",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false
            },
            "isDisabled": {
                "type": "boolean",
                "attribute": "is-disabled",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false
            },
            "localization": {
                "type": "unknown",
                "attribute": "localization",
                "mutable": false,
                "complexType": {
                    "original": "FormInputLocalization",
                    "resolved": "{ [lang: string]: { label?: string; placeholder?: string; require?: string; format?: string; minMessage: string; maxMessage: string; betweenMessage: string; }; }",
                    "references": {
                        "FormInputLocalization": {
                            "location": "import",
                            "path": "~features/form-hook",
                            "id": "src/features/form-hook/index.ts::FormInputLocalization"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "defaultValue": "{}"
            }
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "staticValue",
                "methodName": "onStaticValueChange"
            }];
    }
}
