UNPKG

1.65 kBTypeScriptView Raw
1import * as React from 'react';
2import { storiesOf } from '@storybook/react';
3import styled from 'styled-components';
4
5import { Input, GlobalStyle } from '../src';
6
7const Wrapper = styled.div`
8 margin: 20px;
9 padding: 90px;
10 background-color: white;
11 border: #ebebeb 1px solid;
12`;
13
14storiesOf('Inputs', module)
15 .add('Default', () => (
16 <React.Fragment>
17 <GlobalStyle />
18 <Wrapper>
19 <Input
20 type='text'
21 placeholder='Placeholder'
22 />
23 </Wrapper>
24 </React.Fragment>
25 ))
26 .add('password', () => (
27 <React.Fragment>
28 <GlobalStyle />
29 <Wrapper>
30 <Input
31 type='password'
32 placeholder='Placeholder'
33 passwordType
34 />
35 </Wrapper>
36 </React.Fragment>
37 ))
38 .add('disabled', () => (
39 <React.Fragment>
40 <GlobalStyle />
41 <Wrapper>
42 <Input
43 type='text'
44 placeholder='campo desabilitado'
45 disabled
46 />
47 </Wrapper>
48 </React.Fragment>
49 ))
50 .add('isInvalid', () => (
51 <React.Fragment>
52 <GlobalStyle />
53 <Wrapper>
54 <Input
55 type='text'
56 placeholder='CPF'
57 isInvalid="Insira um CPF válido"
58 value='123.456.789-10'
59 css={`max-width: 360px;`}
60 />
61 </Wrapper>
62 </React.Fragment>
63 ))
64 .add('isWarning', () => (
65 <React.Fragment>
66 <GlobalStyle />
67 <Wrapper>
68 <Input
69 type='text'
70 placeholder='CPF'
71 isWarning="Insira um CPF válido"
72 value='123.456.789-10'
73 css={`max-width: 360px;`}
74 />
75 </Wrapper>
76 </React.Fragment>
77 ));
\No newline at end of file