1 | import React from 'react';
|
2 | import * as ReactIs from 'react-is';
|
3 | import { observer } from 'mobx-react';
|
4 | import Grid from '@material-ui/core/Grid';
|
5 | import Inputs from './Inputs';
|
6 | const FieldRenderObserver = ({ component, propsForm, }) => {
|
7 | let FieldComponent = component;
|
8 | try {
|
9 | FieldComponent = observer(component);
|
10 | }
|
11 | catch (error) { }
|
12 | return React.createElement(FieldComponent, Object.assign({}, propsForm));
|
13 | };
|
14 | class FieldRender extends React.PureComponent {
|
15 | render() {
|
16 | const { field, changeField } = this.props;
|
17 | const breakpoints = Object.assign({}, field.breakpoints);
|
18 | const { xs = 12 } = breakpoints;
|
19 | const { sm = xs } = breakpoints;
|
20 | const { md = sm } = breakpoints;
|
21 | const { lg = md } = breakpoints;
|
22 | const { xl = lg } = breakpoints;
|
23 | const { component: Component, render, type, grid = typeof this.props.grid !== 'undefined'
|
24 | ? this.props.grid
|
25 | : true, } = field;
|
26 | const propsForm = {
|
27 | field,
|
28 | changeField,
|
29 | };
|
30 | const formInput = React.createElement(Inputs, Object.assign({}, propsForm));
|
31 | if (render)
|
32 | return render({
|
33 | children: formInput,
|
34 | props: propsForm,
|
35 | });
|
36 | if (type === 'component') {
|
37 | if (React.isValidElement(Component) &&
|
38 | typeof Component !== 'function') {
|
39 | return (React.createElement(Component.type, Object.assign({}, Object.assign(Object.assign({}, Component.props), propsForm))));
|
40 | }
|
41 | if (ReactIs.isValidElementType(Component))
|
42 | return (React.createElement(FieldRenderObserver, { component: Component, propsForm: propsForm }));
|
43 | return null;
|
44 | }
|
45 | return grid ? (React.createElement(Grid, { item: true, xs: xs, sm: sm, md: md, lg: lg, xl: xl }, formInput)) : (formInput);
|
46 | }
|
47 | }
|
48 | export { FieldRender };
|
49 | export default FieldRender;
|
50 |
|
\ | No newline at end of file |