@smart-react-components/ui/Textarea/index.js

SRC UI includes React and Styled components.

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const dom_1 = require("@smart-react-components/core/util/dom");
const react_1 = __importDefault(require("react"));
const Input_1 = __importDefault(require("../Input"));
const InputElement_1 = __importDefault(require("../components/Input/InputElement"));
const Textarea = react_1.default.forwardRef((props, forwardRef) => {
    const ref = react_1.default.useRef(null);
    const calculateHeight = () => {
        const el = (forwardRef !== null && forwardRef !== void 0 ? forwardRef : ref).current;
        if (!el) {
            return;
        }
        el.style.height = 'auto';
        let height = el.scrollHeight + 5;
        if (height < props.areaMinHeight) {
            height = props.areaMinHeight;
        }
        else if (props.areaMaxHeight > -1 && height > props.areaMaxHeight) {
            height = props.areaMaxHeight;
        }
        el.style.height = `${height}px`;
    };
    react_1.default.useEffect(() => {
        if (props.areaMaxHeight > -1 || props.areaMinHeight > -1) {
            const calculateHeightDebounce = (0, dom_1.debounce)(calculateHeight);
            (0, dom_1.addEventListener)(window, ['resize'], calculateHeightDebounce);
            return () => {
                (0, dom_1.removeEventListener)(window, ['resize'], calculateHeightDebounce);
            };
        }
    }, [props.areaMaxHeight, props.areaMinHeight]);
    react_1.default.useEffect(() => {
        if (props.areaMaxHeight > -1 || props.areaMinHeight > -1) {
            calculateHeight();
        }
    }, [props.value, props.areaMaxHeight, props.areaMinHeight]);
    return (react_1.default.createElement(Input_1.default, Object.assign({}, props, { ref: forwardRef !== null && forwardRef !== void 0 ? forwardRef : ref, template: react_1.default.cloneElement(props.template, { resize: props.resize }) })));
});
Textarea.defaultProps = Object.assign(Object.assign({}, Input_1.default.defaultProps), { areaMaxHeight: 350, areaMinHeight: 150, resize: 'none', template: react_1.default.createElement(InputElement_1.default, { as: "textarea" }) });
exports.default = Textarea;