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

Generate MUI form with few line of code

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib = require('tslib');
var React = require('react');
var material = require('@mui/material');
var InputAdornment = require('@mui/material/InputAdornment');
var IconButton = require('@mui/material/IconButton');
var VisibilityOutlinedIcon = require('@mui/icons-material/VisibilityOutlined');
var VisibilityOffOutlinedIcon = require('@mui/icons-material/VisibilityOffOutlined');
var TextFieldBase = require('../Bases/TextFieldBase.js');
var memo = require('../Bases/functions/memo.js');
var I18nProvider = require('../../../base/I18nProvider.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var InputAdornment__default = /*#__PURE__*/_interopDefaultLegacy(InputAdornment);
var IconButton__default = /*#__PURE__*/_interopDefaultLegacy(IconButton);
var VisibilityOutlinedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityOutlinedIcon);
var VisibilityOffOutlinedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityOffOutlinedIcon);

var TextView = function (props) {
    var allData = props.allData, name = props.name, formik = props.formik, loading = props.loading, validationSchema = props.validationSchema;
    var _a = React.useState(!(allData.inputProps.type === "password")), showPassword = _a[0], setShowPassword = _a[1];
    var mainRef = React.useRef();
    var t = I18nProvider.useI18nContext().t;
    var _b = allData.inputProps, autoComplete = _b.autoComplete, type = _b.type, InputProps = _b.InputProps, inputProps = tslib.__rest(_b, ["autoComplete", "type", "InputProps"]);
    return (React__default["default"].createElement(material.Grid, tslib.__assign({ item: true }, allData.layoutProps),
        React__default["default"].createElement(TextFieldBase.TextFieldBase, tslib.__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"
                ? tslib.__assign(tslib.__assign({}, InputProps), { endAdornment: (React__default["default"].createElement(InputAdornment__default["default"], { position: "end" },
                        React__default["default"].createElement(material.Tooltip, { title: t("textview_toggle_password_visibility") },
                            React__default["default"].createElement(IconButton__default["default"], { "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__default["default"].createElement(VisibilityOutlinedIcon__default["default"], null)) : (React__default["default"].createElement(VisibilityOffOutlinedIcon__default["default"], null)))))) }) : tslib.__assign({}, InputProps) }, inputProps))));
};
var TextView$1 = React__default["default"].memo(TextView, function (prevProps, nextProps) {
    return memo.baseMemo(prevProps, nextProps);
});

exports["default"] = TextView$1;
//# sourceMappingURL=TextView.js.map