@novin-dev/formalite/dist/esm/components/Formalite/elements/TextView/TextView.js

Generate MUI form with few line of code

import { __rest, __assign } from 'tslib';
import React, { useState, useRef } from 'react';
import { Grid, Tooltip } from '@mui/material';
import InputAdornment from '@mui/material/InputAdornment';
import IconButton from '@mui/material/IconButton';
import VisibilityOutlinedIcon from '@mui/icons-material/VisibilityOutlined';
import VisibilityOffOutlinedIcon from '@mui/icons-material/VisibilityOffOutlined';
import { TextFieldBase } from '../Bases/TextFieldBase.js';
import { baseMemo } from '../Bases/functions/memo.js';
import { useI18nContext } from '../../../base/I18nProvider.js';

var TextView = function (props) {
    var allData = props.allData, name = props.name, formik = props.formik, loading = props.loading, validationSchema = props.validationSchema;
    var _a = useState(!(allData.inputProps.type === "password")), showPassword = _a[0], setShowPassword = _a[1];
    var mainRef = useRef();
    var t = useI18nContext().t;
    var _b = allData.inputProps, autoComplete = _b.autoComplete, type = _b.type, InputProps = _b.InputProps, inputProps = __rest(_b, ["autoComplete", "type", "InputProps"]);
    return (React.createElement(Grid, __assign({ item: true }, allData.layoutProps),
        React.createElement(TextFieldBase, __assign({ formik: formik, loading: loading, validationSchema: validationSchema, translator: props.translator, name: String(name), mustRegex: [allData.mustRegex, props.formMustRegex], inputRef: mainRef, type: type === "password" ? "".concat(showPassword ? "text" : "password") : type, autoComplete: type === "password" ? "on" : autoComplete, InputProps: allData.inputProps.type === "password"
                ? __assign(__assign({}, InputProps), { endAdornment: (React.createElement(InputAdornment, { position: "end" },
                        React.createElement(Tooltip, { title: t("textview_toggle_password_visibility") },
                            React.createElement(IconButton, { "aria-label": t("fg-toggle-password-visibility"), onClick: function () {
                                    setShowPassword(!showPassword);
                                    if (mainRef.current) {
                                        mainRef.current.blur();
                                    }
                                }, onMouseDown: function (e) {
                                    e.preventDefault();
                                    if (mainRef.current) {
                                        mainRef.current.focus();
                                    }
                                } }, showPassword ? (React.createElement(VisibilityOutlinedIcon, null)) : (React.createElement(VisibilityOffOutlinedIcon, null)))))) }) : __assign({}, InputProps) }, inputProps))));
};
var TextView$1 = React.memo(TextView, function (prevProps, nextProps) {
    return baseMemo(prevProps, nextProps);
});

export { TextView$1 as default };
//# sourceMappingURL=TextView.js.map