import React, { Component, Children, cloneElement } from 'react';
import hocImmutable, { imShallowEqual } from '../../utils/HOC/hocImmutable';
import { Form } from 'antd';
import FormItem from './FormItem';

const Comp = hocImmutable(({ layout = 'vertical', children, ...props }) => {
    children = Children.map(children, item => {
        if (item && item.props && item.props.____$formItem$) {
            const { style = {}, labelCol = {}, wrapperCol = {} } = item.props;
            if (layout === 'horizontal') {
                return cloneElement(item, {
                    style: Object.assign(style, {
                        display: 'flex',
                        flexWrap: 'nowrap'
                    }),
                    labelCol: {
                        ...labelCol,
                        style: Object.assign(
                            labelCol.style || {},
                            {
                                flexBasis: labelCol.basis, flexGrow: 0,
                                flexShrink: 0
                            }
                        )
                    },
                    wrapperCol: {
                        ...wrapperCol,
                        style: Object.assign(
                            labelCol.style || {},
                            { flexGrow: 1, flexShrink: 1 }
                        )
                    }
                })
            } else if (layout === 'vertical') {
                return cloneElement(item, {
                    colon: false,
                    labelCol: {},
                    wrapperCol: {}
                });
            }
        } else {
            return item;
        }
    })
    return <Form {...props}
        layout={'horizontal'}
        children={children}
    />
});
Comp.Item = FormItem;
Comp.create = Form.create;
export default Comp;