blob: 869bafa19c026aa8072064597eab8dca56c9f2ae (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
|
import React from 'react';
import { action } from '@storybook/addon-actions';
import Examples from './utils/Examples.js';
import ReactInput from '../../src/react/Input.js';
import InputDefaultHtml from '../../components/input/input.html';
import InputRequiredHtml from '../../components/input/input-required.html';
import InputNumberHtml from '../../components/input/input-number.html';
import InputViewOnlyHtml from '../../components/input/input-view-only.html';
import InputDisabledHtml from '../../components/input/input-disabled.html';
import InputPlaceholderHtml from '../../components/input/input-placeholder.html';
import InputErrorHtml from '../../components/input/input-error.html';
let examples = {
'Input Default': {
jsx: <ReactInput name='input1' value='Default' label='I am a label' onChange={ action('input-change')}/>,
html: InputDefaultHtml
},
'Input Required': {
jsx: <ReactInput name='input2' value='Default' label='I am a label' onChange={ action('input-change')} isRequired/>,
html: InputRequiredHtml
},
'Input Number': {
jsx: <ReactInput name='input3' value='3' label='I am a label' type="number" onChange={ action('input-change')}/>,
html: InputNumberHtml
},
'Input View Only': {
jsx: <ReactInput value='Read Only Text' label='I am a label' onChange={ action('input-change')} readOnly/>,
html: InputViewOnlyHtml
},
'Input Disabled': {
jsx: <ReactInput value='Default' label='I am a label' onChange={ action('input-change')} disabled/>,
html: InputDisabledHtml
},
'Input Placeholder': {
jsx: <ReactInput name='input5' placeholder='Write Here...' label='I am a label' onChange={ action('input-change')}/>,
html: InputPlaceholderHtml
},
'Input Error': {
jsx: <ReactInput value='Default' name='input6' label='I am a label' errorMessage='This is the error message' onChange={ action('input-change')}/>,
html: InputErrorHtml
}
}
const Inputs = () => (
<Examples examples={examples} />
);
export default Inputs;
|
