react-base-guide/lib/components/textarea/index.js

react ui components

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const base_1 = require("./base");
const Message_1 = __importDefault(require("../input/styled/Message"));
const label_1 = __importDefault(require("../label"));
const textareaProps = (props) => {
    let newProps = Object.assign({}, props);
    delete newProps.label;
    delete newProps.message;
    delete newProps.styled;
    return newProps;
};
const Textarea = (props, ref) => {
    var _a, _b, _c, _d;
    const textareaHidden = (0, react_1.useRef)(null);
    const [height, setHeight] = (0, react_1.useState)(((_a = props.styled) === null || _a === void 0 ? void 0 : _a.height) ? +((_c = (_b = props.styled) === null || _b === void 0 ? void 0 : _b.height) === null || _c === void 0 ? void 0 : _c.replace("px", "")) : undefined);
    const [focus, setFocus] = (0, react_1.useState)(props.autoFocus || false);
    (0, react_1.useEffect)(() => {
        if (props.autosize && textareaHidden.current) {
            textareaHidden.current.innerText = props.value;
            setHeight(textareaHidden.current.clientHeight);
        }
    }, [props.autosize]);
    return ((0, jsx_runtime_1.jsxs)(label_1.default, Object.assign({ label: props.label, focus: focus, tabIndex: props.tabIndex || 0, variant: "outlined", error: props.error, warning: props.warning, success: props.success, styled: Object.assign(Object.assign({}, props.styled), { height: height ? (height + 7.5) + "px" : undefined }) }, { children: [props.message &&
                (0, jsx_runtime_1.jsx)(Message_1.default, Object.assign({ "$error": props.error, "$success": props.success, "$warning": props.warning }, { children: props.message })), props.autosize && (0, jsx_runtime_1.jsx)(base_1.TextareaHidden, Object.assign({ ref: textareaHidden }, { children: props.value || "A" })), (0, jsx_runtime_1.jsx)(base_1.TextareaBase, Object.assign({}, textareaProps(props), { onChange: e => {
                    if (props.autosize && textareaHidden.current) {
                        textareaHidden.current.innerText = e.target.value;
                        setHeight(textareaHidden.current.clientHeight);
                    }
                    props.onChange && props.onChange(e);
                }, ref: ref, placeholder: props.placeholder, onFocus: e => {
                    setFocus(true);
                    props.onFocus && props.onFocus(e);
                }, onBlur: e => {
                    setFocus(false);
                    props.onBlur && props.onBlur(e);
                }, styled: {
                    height: height ? (height + "px") : undefined,
                    minHeight: (_d = props === null || props === void 0 ? void 0 : props.styled) === null || _d === void 0 ? void 0 : _d.minHeight,
                } }))] })));
};
exports.default = (0, react_1.forwardRef)(Textarea);
//# sourceMappingURL=index.js.map