@cosva-lab/form-builder/esm/FieldRender.js

React form builder.

import { __extends, __assign } from './_virtual/_tslib.js';
import React from 'react';
import * as ReactIs from 'react-is';
import { observer } from 'mobx-react';
import Grid from '@mui/material/Grid';
import { Inputs } from './Inputs.js';

var FieldRenderObserver = function (_a) {
    var component = _a.component, propsForm = _a.propsForm;
    var FieldComponent = component;
    try {
        FieldComponent = observer(component);
    }
    catch (error) { }
    return React.createElement(FieldComponent, __assign({}, propsForm));
};
var FieldRender = /** @class */ (function (_super) {
    __extends(FieldRender, _super);
    function FieldRender() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.onChangeField = function (e, callback) {
            var onChangeField = _this.props.onChangeField;
            onChangeField === null || onChangeField === void 0 ? void 0 : onChangeField(e, callback);
        };
        return _this;
    }
    FieldRender.prototype.render = function () {
        var field = this.props.field;
        var breakpoints = __assign({}, field.breakpoints);
        var _a = breakpoints.xs, xs = _a === void 0 ? 12 : _a;
        var _b = breakpoints.sm, sm = _b === void 0 ? xs : _b;
        var _c = breakpoints.md, md = _c === void 0 ? sm : _c;
        var _d = breakpoints.lg, lg = _d === void 0 ? md : _d;
        var _e = breakpoints.xl, xl = _e === void 0 ? lg : _e;
        var Component = field.component, render = field.render, type = field.type, _f = field.grid, grid = _f === void 0 ? typeof this.props.grid !== 'undefined'
            ? this.props.grid
            : true : _f;
        var propsForm = {
            field: field,
            onChangeField: this.onChangeField,
        };
        var formInput = React.createElement(Inputs, __assign({}, propsForm));
        if (render)
            return render({
                children: formInput,
                props: propsForm,
            });
        if (type === 'component') {
            if (Component)
                Component.displayName = "[fields.".concat(field.name.toString(), "].component");
            if (React.isValidElement(Component))
                return (React.createElement(Component.type, __assign({}, __assign(__assign({}, Component.props), propsForm))));
            if (ReactIs.isValidElementType(Component))
                return (React.createElement(FieldRenderObserver, { component: Component, propsForm: propsForm }));
            return null;
        }
        return grid ? (React.createElement(Grid, { item: true, xs: xs, sm: sm, md: md, lg: lg, xl: xl }, formInput)) : (formInput);
    };
    return FieldRender;
}(React.PureComponent));

export { FieldRender as default };
//# sourceMappingURL=FieldRender.js.map