UNPKG

@react-form-fields/material-ui

Version:

Material UI Form Fields

29 lines 2.46 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var CircularProgress_1 = require("@material-ui/core/CircularProgress/CircularProgress"); var InputAdornment_1 = require("@material-ui/core/InputAdornment/InputAdornment"); var TextField_1 = require("@material-ui/core/TextField/TextField"); var useConfigContext_1 = require("@react-form-fields/core/hooks/useConfigContext"); var useMask_1 = require("@react-form-fields/core/hooks/useMask"); var useValidation_1 = require("@react-form-fields/core/hooks/useValidation"); var React = require("react"); var FieldText = React.memo(function (props) { var loading = props.loading, helperText = props.helperText, multiline = props.multiline, onBlur = props.onBlur, onChange = props.onChange, extraProps = tslib_1.__rest(props, ["loading", "helperText", "multiline", "onBlur", "onChange"]); var config = useConfigContext_1.default(); var _a = useMask_1.default(props), maskedValue = _a.maskedValue, maskClean = _a.maskClean; var _b = useValidation_1.default(props), setDirty = _b.setDirty, showError = _b.showError, errorMessage = _b.errorMessage; var handleChange = React.useCallback(function (event) { var value = maskClean(event.target ? event.target.value : event); config.validationOn === 'onChange' && setDirty(true); onChange(value); }, [config.validationOn, maskClean, onChange, setDirty]); var handleBlur = React.useCallback(function (e) { onBlur && onBlur(e); config.validationOn === 'onBlur' && setDirty(true); }, [config.validationOn, onBlur, setDirty]); return (React.createElement(TextField_1.default, tslib_1.__assign({}, tslib_1.__assign(tslib_1.__assign({ fullWidth: true, margin: 'normal', rows: multiline ? 4 : null }, extraProps), { multiline: multiline, value: ((maskedValue !== null && maskedValue !== void 0 ? maskedValue : '')).toString(), error: showError && !!errorMessage, helperText: showError ? errorMessage : helperText, onChange: handleChange, onBlur: handleBlur, submitted: null, touched: null, loading: null }), { InputProps: tslib_1.__assign({ endAdornment: !loading ? null : (React.createElement(InputAdornment_1.default, { position: 'end' }, React.createElement(CircularProgress_1.default, { color: 'secondary', size: 20 }))) }, (extraProps.InputProps || {})) }))); }); exports.default = FieldText; //# sourceMappingURL=Text.js.map