import { __esDecorate, __runInitializers } from "tslib";
import { html } from 'lit';
import { property } from 'lit/decorators.js';
import { ifDefined } from 'lit/directives/if-defined.js';
import { live } from 'lit/directives/live.js';
import { styleMap } from 'lit/directives/style-map.js';
import Input from '../../input/Input.js';
let TextAreaElement = (() => {
    let _classSuper = Input;
    let _cols_decorators;
    let _cols_initializers = [];
    let _cols_extraInitializers = [];
    let _rows_decorators;
    let _rows_initializers = [];
    let _rows_extraInitializers = [];
    let _wrap_decorators;
    let _wrap_initializers = [];
    let _wrap_extraInitializers = [];
    return class TextAreaElement extends _classSuper {
        static {
            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
            _cols_decorators = [property({ type: Number })];
            _rows_decorators = [property({ type: Number })];
            _wrap_decorators = [property({ type: String })];
            __esDecorate(this, null, _cols_decorators, { kind: "accessor", name: "cols", static: false, private: false, access: { has: obj => "cols" in obj, get: obj => obj.cols, set: (obj, value) => { obj.cols = value; } }, metadata: _metadata }, _cols_initializers, _cols_extraInitializers);
            __esDecorate(this, null, _rows_decorators, { kind: "accessor", name: "rows", static: false, private: false, access: { has: obj => "rows" in obj, get: obj => obj.rows, set: (obj, value) => { obj.rows = value; } }, metadata: _metadata }, _rows_initializers, _rows_extraInitializers);
            __esDecorate(this, null, _wrap_decorators, { kind: "accessor", name: "wrap", static: false, private: false, access: { has: obj => "wrap" in obj, get: obj => obj.wrap, set: (obj, value) => { obj.wrap = value; } }, metadata: _metadata }, _wrap_initializers, _wrap_extraInitializers);
            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
        }
        #cols_accessor_storage = __runInitializers(this, _cols_initializers, void 0);
        /**
         * Binds this to the `<textarea>`'s `cols` property.
         * @attr
         */
        get cols() { return this.#cols_accessor_storage; }
        set cols(value) { this.#cols_accessor_storage = value; }
        #rows_accessor_storage = (__runInitializers(this, _cols_extraInitializers), __runInitializers(this, _rows_initializers, void 0));
        /**
         * Binds this to the `<textarea>`'s `rows` property.
         * @attr
         */
        get rows() { return this.#rows_accessor_storage; }
        set rows(value) { this.#rows_accessor_storage = value; }
        #wrap_accessor_storage = (__runInitializers(this, _rows_extraInitializers), __runInitializers(this, _wrap_initializers, void 0));
        /**
         * Binds this to the `<textarea>`'s `wrap` property.
         * @attr
         */
        get wrap() { return this.#wrap_accessor_storage; }
        set wrap(value) { this.#wrap_accessor_storage = value; }
        connectedCallback() {
            super.connectedCallback();
            this.setAttribute('aria-multiline', 'true');
        }
        renderInput() {
            const placeholderValue = this.placeholder || undefined;
            const maxLengthValue = this.maxLength > -1 ? this.maxLength : undefined;
            const roleValue = this.dataRole || undefined;
            const { disabled } = this;
            const style = {};
            if (this.textDirection) {
                style.direction = this.textDirection;
            }
            const ariaActiveDescendantValue = this.ariaActiveDescendant || undefined;
            const ariaAutoCompleteValue = this.ariaAutoComplete || undefined;
            const ariaControlsValue = this.ariaControls || undefined;
            const ariaDescribedByValue = this.getAriaDescribedBy() || undefined;
            const ariaExpandedValue = this.ariaExpanded || undefined;
            const ariaLabelValue = this.ariaLabel || this.label || undefined;
            const ariaLabelledByValue = this.ariaLabelledBy || undefined;
            return html `
      <textarea
        class="input"
        style=${styleMap(style)}
        name="${ifDefined(this.name)}"
        .value=${live(this.getInputValue())}
        maxlength=${ifDefined(maxLengthValue)}
        minlength=${ifDefined(this.minLength)}
        placeholder=${ifDefined(placeholderValue)}
        role=${ifDefined(roleValue)}
        ?disabled=${disabled}
        ?readonly=${this.readOnly}
        ?required=${this.required}
        autocomplete="${ifDefined(this.autocomplete)}"
        autocapitalize="${ifDefined(this.autocapitalize)}"
        inputmode="${ifDefined(this.inputMode)}"
        cols="${ifDefined(this.cols)}"
        rows="${ifDefined(this.rows)}"
        wrap="${ifDefined(this.wrap)}"
        spellcheck="${ifDefined(this.spellcheck)}"
        @change=${this.retargetEvent}
        @input=${this.handleInput}
        @select=${this.retargetEvent}
        @invalid=${this.invalidHandler}
        aria-activedescendant=${ifDefined(ariaActiveDescendantValue)}
        aria-autocomplete=${ifDefined(ariaAutoCompleteValue)}
        aria-controls=${ifDefined(ariaControlsValue)}
        aria-describedby=${ifDefined(ariaDescribedByValue)}
        aria-expanded=${ifDefined(ariaExpandedValue)}
        aria-invalid=${this.getError()}
        aria-label=${ifDefined(ariaLabelValue)}
        aria-labelledby=${ifDefined(ariaLabelledByValue)}
      ></textarea>
    `;
        }
        constructor() {
            super(...arguments);
            __runInitializers(this, _wrap_extraInitializers);
        }
    };
})();
export default TextAreaElement;
//# sourceMappingURL=TextAreaElement.js.map