import Form from '..';
import Input from '../../input';
import Radio from '../../radio';
import React from 'react';
import ReactDOM from 'react-dom';
const FormItem = Form.Item;
const RadioGroup = Radio.Group;
const formItemLayout = {
    labelCol: {
        span: 6,
    },
    wrapperCol: {
        span: 14,
    },
};
class BasicDemo extends React.Component {
    userExists(rule, value) {
        return new Promise((resolve, reject) => {
            if (!value) {
                resolve(undefined);
            }
            else {
                setTimeout(() => {
                    if (value === 'frank') {
                        reject(new Error('Sorry, this username is already exist.'));
                    }
                    else {
                        resolve(undefined);
                    }
                }, 500);
            }
        });
    }
    render() {
        return (React.createElement(Form, Object.assign({}, formItemLayout),
            React.createElement(FormItem, { label: "Account:", hasFeedback: true, validator: this.userExists.bind(this), help: "" },
                React.createElement(Input, { placeholder: "Input frank", name: "valUsername" }),
                React.createElement(Form.Error, { name: "valUsername" }, (errors, state) => {
                    if (state === 'loading') {
                        return 'loading...';
                    }
                    return errors;
                })),
            React.createElement(FormItem, { label: "Email:", hasFeedback: true, required: true, requiredTrigger: "onBlur", format: "email" },
                React.createElement(Input, { placeholder: "Both trigget onBlur and onChange", name: "valEmail" })),
            React.createElement(FormItem, { label: "Password:", hasFeedback: true, required: true, requiredMessage: "Please enter password" },
                React.createElement(Input, { htmlType: "password", name: "valPasswd" })),
            React.createElement(FormItem, { label: "Gender:", hasFeedback: true, required: true, requiredMessage: "Please select your gender" },
                React.createElement(RadioGroup, { name: "valSex" },
                    React.createElement(Radio, { value: "male" }, "Male"),
                    React.createElement(Radio, { value: "female" }, "Female"))),
            React.createElement(FormItem, { label: "Remarks:", required: true, requiredMessage: "Really do not intend to write anything?" },
                React.createElement(Input.TextArea, { maxLength: 20, showLimitHint: true, placeholder: "Everything is ok!", name: "valTextarea" })),
            React.createElement(FormItem, { wrapperCol: { offset: 6 } },
                React.createElement(Form.Submit, { validate: true, type: "primary", onClick: (v, e) => console.log(v, e), style: { marginRight: 10 } }, "Submit"),
                React.createElement(Form.Reset, null, "Reset"))));
    }
}
ReactDOM.render(React.createElement(BasicDemo, null), document.getElementById('form-demo-10'));
