diff options
author | Markus Hatvan <markus_hatvan@aon.at> | 2021-09-29 08:33:01 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-09-29 08:33:01 +0200 |
commit | 20574717c4b54635a8b757fccce64f2a98614997 (patch) | |
tree | 0f671af98b8253b13149c7bf5262d0b137881ecf /uidev/src/stories/input.stories.tsx | |
parent | 5.6.3-nightly.17 [skip ci] (diff) | |
download | ferdium-app-20574717c4b54635a8b757fccce64f2a98614997.tar.gz ferdium-app-20574717c4b54635a8b757fccce64f2a98614997.tar.zst ferdium-app-20574717c4b54635a8b757fccce64f2a98614997.zip |
chore: update various outdated node_modules (#1969)
Diffstat (limited to 'uidev/src/stories/input.stories.tsx')
-rw-r--r-- | uidev/src/stories/input.stories.tsx | 66 |
1 files changed, 15 insertions, 51 deletions
diff --git a/uidev/src/stories/input.stories.tsx b/uidev/src/stories/input.stories.tsx index 889539266..c92ebb36a 100644 --- a/uidev/src/stories/input.stories.tsx +++ b/uidev/src/stories/input.stories.tsx | |||
@@ -1,7 +1,7 @@ | |||
1 | import React from 'react'; | 1 | import React from 'react'; |
2 | import uuid from 'uuid/v4'; | ||
3 | 2 | ||
4 | import { Input } from '@meetfranz/forms'; | 3 | import { Input } from '@meetfranz/forms'; |
4 | import { v4 as uuid } from 'uuid'; | ||
5 | import { storiesOf } from '../stores/stories'; | 5 | import { storiesOf } from '../stores/stories'; |
6 | 6 | ||
7 | const defaultProps = () => { | 7 | const defaultProps = () => { |
@@ -10,7 +10,8 @@ const defaultProps = () => { | |||
10 | label: 'Label', | 10 | label: 'Label', |
11 | id: `test-${id}`, | 11 | id: `test-${id}`, |
12 | name: `test-${id}`, | 12 | name: `test-${id}`, |
13 | onChange: (e: React.ChangeEvent<HTMLInputElement>) => console.log('changed event', e), | 13 | onChange: (e: React.ChangeEvent<HTMLInputElement>) => |
14 | console.log('changed event', e), | ||
14 | }; | 15 | }; |
15 | }; | 16 | }; |
16 | 17 | ||
@@ -21,44 +22,23 @@ const defaultPasswordProps = () => { | |||
21 | id: `test-${id}`, | 22 | id: `test-${id}`, |
22 | name: `test-${id}`, | 23 | name: `test-${id}`, |
23 | type: 'password', | 24 | type: 'password', |
24 | onChange: (e: React.ChangeEvent<HTMLInputElement>) => console.log('changed event', e), | 25 | onChange: (e: React.ChangeEvent<HTMLInputElement>) => |
26 | console.log('changed event', e), | ||
25 | }; | 27 | }; |
26 | }; | 28 | }; |
27 | 29 | ||
28 | storiesOf('Input') | 30 | storiesOf('Input') |
29 | .add('Basic', () => ( | 31 | .add('Basic', () => ( |
30 | <Input | 32 | <Input {...defaultProps()} placeholder="Placeholder text" /> |
31 | {...defaultProps()} | ||
32 | placeholder="Placeholder text" | ||
33 | /> | ||
34 | )) | ||
35 | .add('Without Label', () => ( | ||
36 | <Input | ||
37 | {...defaultProps()} | ||
38 | showLabel={false} | ||
39 | /> | ||
40 | )) | ||
41 | .add('Disabled', () => ( | ||
42 | <Input {...defaultProps()} disabled /> | ||
43 | )) | ||
44 | .add('With prefix', () => ( | ||
45 | <Input | ||
46 | {...defaultProps()} | ||
47 | prefix="https://" | ||
48 | /> | ||
49 | )) | 33 | )) |
34 | .add('Without Label', () => <Input {...defaultProps()} showLabel={false} />) | ||
35 | .add('Disabled', () => <Input {...defaultProps()} disabled />) | ||
36 | .add('With prefix', () => <Input {...defaultProps()} prefix="https://" />) | ||
50 | .add('With suffix', () => ( | 37 | .add('With suffix', () => ( |
51 | <Input | 38 | <Input {...defaultProps()} suffix=".meetfranz.com" /> |
52 | {...defaultProps()} | ||
53 | suffix=".meetfranz.com" | ||
54 | /> | ||
55 | )) | 39 | )) |
56 | .add('With pre-suffix', () => ( | 40 | .add('With pre-suffix', () => ( |
57 | <Input | 41 | <Input {...defaultProps()} prefix="https://" suffix=".meetfranz.com" /> |
58 | {...defaultProps()} | ||
59 | prefix="https://" | ||
60 | suffix=".meetfranz.com" | ||
61 | /> | ||
62 | )) | 42 | )) |
63 | .add('With error', () => ( | 43 | .add('With error', () => ( |
64 | <Input | 44 | <Input |
@@ -68,32 +48,16 @@ storiesOf('Input') | |||
68 | /> | 48 | /> |
69 | )) | 49 | )) |
70 | .add('Type number with min & max', () => ( | 50 | .add('Type number with min & max', () => ( |
71 | <Input | 51 | <Input {...defaultProps()} type="number" min={1} max={10} /> |
72 | {...defaultProps()} | ||
73 | type="number" | ||
74 | min={1} | ||
75 | max={10} | ||
76 | /> | ||
77 | )); | 52 | )); |
78 | 53 | ||
79 | storiesOf('Password') | 54 | storiesOf('Password') |
80 | .add('Basic', () => ( | 55 | .add('Basic', () => <Input {...defaultPasswordProps()} />) |
81 | <Input | ||
82 | {...defaultPasswordProps()} | ||
83 | /> | ||
84 | )) | ||
85 | .add('Show password toggle', () => ( | 56 | .add('Show password toggle', () => ( |
86 | <Input | 57 | <Input {...defaultPasswordProps()} showPasswordToggle /> |
87 | {...defaultPasswordProps()} | ||
88 | showPasswordToggle | ||
89 | /> | ||
90 | )) | 58 | )) |
91 | .add('Score password', () => ( | 59 | .add('Score password', () => ( |
92 | <Input | 60 | <Input {...defaultPasswordProps()} showPasswordToggle scorePassword /> |
93 | {...defaultPasswordProps()} | ||
94 | showPasswordToggle | ||
95 | scorePassword | ||
96 | /> | ||
97 | )) | 61 | )) |
98 | .add('Score password with error', () => ( | 62 | .add('Score password with error', () => ( |
99 | <Input | 63 | <Input |