import React from 'react';
import ReactDOM from 'react-dom';
import Form from './forms';

function submit() {}

function App() {
  return (
    <div className="App">
      <Form
        heading={{ title: 'A New Form', type: 'h3' }}
        onSubmit={submit}
        initialValues={{
          name: 'name',
          email: 'email@email.com',
          password: 'password',
          checkbox: false,
          select: 'first',
          textarea: '',
          optionExample: 'option1',
          file: '',
        }}
      >
        <Form.Group property="name" type="text">
          <Form.Label>Name</Form.Label>
          <Form.TextInput />
        </Form.Group>

        <Form.Group property="email" type="email">
          <Form.Label>Email</Form.Label>
          <Form.TextInput />
        </Form.Group>
        <Form.Group property="password" type="password">
          <Form.Label>Password</Form.Label>
          <Form.TextInput />
        </Form.Group>
        <Form.Group property="checkbox" inline>
          <Form.Checkbox />
          <Form.Label>Check me out</Form.Label>
        </Form.Group>
        <Form.Group property="select">
          <Form.Label>Select something</Form.Label>
          <Form.Select options={['first', 'second', 'third']} />
        </Form.Group>
        <Form.Group property="textarea">
          <Form.Label>Write something</Form.Label>
          <Form.TextArea />
        </Form.Group>
        <Form.Group property="optionExample" id={1} inline>
          <Form.Label>Option 1</Form.Label>
          <Form.RadioButton id="option1" />
          <Form.Label>Option 2</Form.Label>
          <Form.RadioButton id="option2" />
          <Form.Label>Option 3</Form.Label>
          <Form.RadioButton id="option3" />
        </Form.Group>
        <Form.Group property="file">
          <Form.Label>Sumbit File</Form.Label>
          <Form.File />
        </Form.Group>
        <Form.SubmitButton>Submit</Form.SubmitButton>
      </Form>
    </div>
  );
}
ReactDOM.render(<App />, document.getElementById('app'));
