import * as React from "react";
import { storiesOf } from "@storybook/react";
import { Input } from "../src/index";

const onChange = (value) => {
  console.log(value)
}
const onBlur = (e) => {
  console.log(e)
}

storiesOf("Input", module).add("Input", () => {
  return (
    <div id='app-wrapper'>
      <div id='app'>
        <Input
          hasClear
          // defaultValue="clear by click"
          placeholder='填入信息'
          size="small"
          aria-label="input with config of hasClear"
          onChange={onChange}
          
        />
        <br />
        <br />

        <Input
          hasClear
          defaultValue="2019-09-10 10:10:20"
          aria-label="input with config of hasClear"
          onChange={onChange}
          onBlur={onBlur}
          hint="calendar"
          type='line'
          theme='dark'
          size="small"
        />
        <br />
        <br />

        <Input
          hasClear
          defaultValue="clear by click"
          size="large"
          aria-label="input with config of hasClear"
          onChange={onChange}
          type='noborder'
        />
        <Input.TextArea placeholder="TextArea" type='noborder' aria-label="TextArea" />
        <br />
        <br />
      </div>
    </div>
  );
});