web-ui-pack/controls/textarea.js

Web package with UI elements

import WUPTextControl from "./text";
import WUPTextareaInput from "./textarea.input";
WUPTextareaInput.$use();
const tagName = "wup-textarea";
export default class WUPTextareaControl extends WUPTextControl {
    static get $style() {
        return `${super.$style}
        :host strong { top: 1.6em; }
        :host [contenteditable=true] {
          min-height: 4em;
          max-height: 4em;
        }`;
    }
    static $defaults = {
        ...WUPTextControl.$defaults,
        validationRules: {
            ...WUPTextControl.$defaults.validationRules,
            min: (v, setV, c, r) => WUPTextControl.$defaults.validationRules.min.call(c, v?.replace(/\n/g, ""), setV, c, r),
            max: (v, setV, c, r) => WUPTextControl.$defaults.validationRules.max.call(c, v?.replace(/\n/g, ""), setV, c, r),
        },
    };
    $refInput = document.createElement("wup-areainput");
    renderControl() {
        super.renderControl();
        const { id } = this.$refInput;
        this.$refInput.removeAttribute("id");
        this.$refInput.setAttribute("aria-labelledby", id);
        this.$refTitle.id = id;
    }
    gotChanges(propsChanged) {
        super.gotChanges(propsChanged);
        const o = this._opts;
        delete o.mask;
        delete o.maskholder;
        delete o.prefix;
        delete o.postfix;
    }
    renderPrefix() {
    }
    renderPostfix() {
    }
    gotKeyDown(e) {
        super.gotKeyDown(e);
        if (e.key === "Enter") {
            e.submitPrevented = true;
        }
    }
    gotBeforeInput(e) {
        if (e.inputType.startsWith("format")) {
            e.preventDefault();
        }
        else {
            super.gotBeforeInput(e);
        }
    }
    gotFocusLost() {
        super.gotFocusLost();
        this.setInputValue(this.$value, 3);
    }
}
let rr = ["mask", "maskholder", "prefix", "postfix"];
rr.forEach((k) => delete WUPTextareaControl.$defaults[k]);
rr = undefined;
customElements.define(tagName, WUPTextareaControl);