---
name: Input
menu: Components
---

# Input
import Input from './index'
import { Playground, Props } from 'docz'
import './style/index.scss'

## Props & Methods
<Props of={Input} />

## Sizes
<Playground>
    <Input placeholder="Small size" size="s" />
    <span style={{display: 'inline-block', width: '15px',}}></span>
    <Input placeholder="Medium size" />
    <span style={{display: 'inline-block', width: '15px',}}></span>
    <Input placeholder="Large size" size="l" />
    <span style={{display: 'inline-block', width: '15px',}}></span>
    <Input placeholder="Long size" size="long" />
</Playground>

## Textarea
<Playground>
    <Input placeholder="Default Textarea" type="textarea" />
    <div style={{height: '10px',}}></div>
    <Input placeholder="Textarea with Counter" type="textarea" counter={100} />
    <div style={{height: '10px',}}></div>
    <Input placeholder="中文计数，数字和字符两个算一个" lan="ch" type="textarea" counter={100} />
</Playground>

## Disabled
<Playground>
    <Input placeholder="disabled text" disabled/>
    <div style={{height: '10px',}}></div>
    <Input placeholder="disabled textarea" type="textarea" disabled />
</Playground>