@cosva-lab/form-builder/inputsTypes/Input/index.js

React form builder.

'use strict';

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

var _tslib = require('../../_virtual/_tslib.js');
var React = require('react');
var clsx = require('clsx');
var mobxReact = require('mobx-react');
var mobx = require('mobx');
var TextField = require('@mui/material/TextField');
var FormControl = require('@mui/material/FormControl');
var FormHelperText = require('@mui/material/FormHelperText');
var isEmpty = require('../../utils/isEmpty.js');
var TransformLabel = require('../../utils/TransformLabel.js');
var RenderErrorsDefault = require('../../RenderErrorsDefault.js');
var Input_module = require('./Input.module.scss.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);
var clsx__default = /*#__PURE__*/_interopDefault(clsx);
var TextField__default = /*#__PURE__*/_interopDefault(TextField);
var FormControl__default = /*#__PURE__*/_interopDefault(FormControl);
var FormHelperText__default = /*#__PURE__*/_interopDefault(FormHelperText);

var Input = /** @class */ (function (_super) {
    _tslib.__extends(Input, _super);
    function Input(props) {
        var _this = _super.call(this, props) || this;
        _this.errors = [];
        _this.animation = true;
        _this.getProps = function (props) { return (_tslib.__assign({}, props.field)); };
        _this.getLastProps = function () { return _this.getProps(_this.props); };
        _this.state = { type: props.type };
        return _this;
    }
    Input.prototype.componentDidMount = function () {
        var _this = this;
        var field = this.props.field;
        mobx.intercept(field, 'errors', function (change) {
            _this.animation = true;
            return change;
        });
    };
    Input.prototype.render = function () {
        var _this = this;
        var _a = this.props; _a.onChangeField; var field = _a.field;
        var ns = field.ns, label = field.label, name = field.name, disabled = field.disabled, _b = field.fullWidth, fullWidth = _b === void 0 ? true : _b, errors = field.errors, autoComplete = field.autoComplete, InputProps = field.InputProps, textFieldProps = field.textFieldProps, value = field.value, RenderErrors = field.renderErrors;
        var type = this.state.type;
        var errorsNode = errors &&
            ((RenderErrors && React__default.default.createElement(RenderErrors, _tslib.__assign({}, { errors: errors, field: field }))) || (React__default.default.createElement(RenderErrorsDefault.RenderErrorsDefault, _tslib.__assign({}, { errors: errors, field: field }))));
        return (React__default.default.createElement(FormControl__default.default, _tslib.__assign({}, { fullWidth: fullWidth }, { className: Input_module.formControl, variant: "outlined" }),
            React__default.default.createElement(TextField__default.default, _tslib.__assign({ label: React__default.default.createElement(TransformLabel.TransformLabel, _tslib.__assign({}, { label: label, ns: ns, name: name })), inputRef: function (element) { return (field.inputRef = element); }, error: !isEmpty.isEmpty(errors), InputProps: typeof InputProps === 'function'
                    ? InputProps({
                        type: type,
                        field: field,
                        changeType: function (type, callback) {
                            if (type !== _this.state.type)
                                _this.setState({ type: type }, callback);
                        },
                    })
                    : InputProps, InputLabelProps: {
                    shrink: type === 'date' ? true : undefined,
                    classes: {
                        root: clsx__default.default(Input_module.InputLabelProps, Input_module.widthNormal),
                    },
                }, onChange: function (e) {
                    var onChange = field.onChange;
                    var value = e.target.value;
                    if (onChange)
                        onChange({ name: field.name, value: value, field: field }, e);
                    else
                        field.setValue(value);
                }, onBlur: function () {
                    var field = _this.props.field;
                    field && field.markAsTouched();
                }, name: name.toString() }, _tslib.__assign(_tslib.__assign({}, textFieldProps), { type: type, value: value, disabled: disabled, autoComplete: autoComplete }))),
            errorsNode && (React__default.default.createElement(FormHelperText__default.default, { component: "div", error: true, className: Input_module.formHelperTextPropsRoot }, errorsNode))));
    };
    Input = _tslib.__decorate([
        mobxReact.observer
    ], Input);
    return Input;
}(React__default.default.Component));

exports.Input = Input;
exports.default = Input;
//# sourceMappingURL=index.js.map