import './demo3.css';
import DatePicker from '../../date-picker';
import Form from '..';
import Input from '../../input';
import NumberPicker from '../../number-picker';
import Radio from '../../radio';
import React from 'react';
import ReactDOM from 'react-dom';
import Select from '../../select';
import Switch from '../../switch';
const FormItem = Form.Item;
const formItemLayout = {
    labelCol: { span: 8 },
    wrapperCol: { span: 16 },
};
class Demo extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            size: 'medium',
        };
        this.handleChange = v => {
            this.setState({
                size: v,
            });
        };
    }
    render() {
        return (React.createElement("div", null,
            React.createElement(Form, Object.assign({}, formItemLayout, { size: this.state.size, style: { maxWidth: '500px' } }),
                React.createElement(FormItem, { label: "Size:" },
                    React.createElement(Radio.Group, { shape: "button", value: this.state.size, onChange: this.handleChange },
                        React.createElement(Radio, { value: "small" }, "small"),
                        React.createElement(Radio, { value: "medium" }, "medium"),
                        React.createElement(Radio, { value: "large" }, "large"))),
                React.createElement(FormItem, { label: "Input:" },
                    React.createElement(Input, { placeholder: "Please enter your user name", id: "userName" })),
                React.createElement(FormItem, { label: "Select:" },
                    React.createElement(Select, null,
                        React.createElement(Select.Option, { value: "test" }, "test"))),
                React.createElement(FormItem, { label: "NumberPicker:" },
                    React.createElement(NumberPicker, null)),
                React.createElement(FormItem, { label: "DatePicker:" },
                    React.createElement(DatePicker, null)),
                React.createElement(FormItem, { label: "Switch:" },
                    React.createElement(Switch, null)))));
    }
}
ReactDOM.render(React.createElement(Demo, null), document.getElementById('form-demo-3'));
