diff options
author | Stefan Malzner <stefan@adlk.io> | 2019-01-28 11:35:25 +0100 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2019-01-28 11:35:25 +0100 |
commit | 9a5b313ea12bdb9dc3e3873ca3a2639bd7483e46 (patch) | |
tree | 038dc5e0a209d06e1c15c1e3c4740d5bdda96f8a /uidev/src/stories/icon.stories.tsx | |
parent | Add href and type to button component (diff) | |
download | ferdium-app-9a5b313ea12bdb9dc3e3873ca3a2639bd7483e46.tar.gz ferdium-app-9a5b313ea12bdb9dc3e3873ca3a2639bd7483e46.tar.zst ferdium-app-9a5b313ea12bdb9dc3e3873ca3a2639bd7483e46.zip |
Update packages
Diffstat (limited to 'uidev/src/stories/icon.stories.tsx')
-rw-r--r-- | uidev/src/stories/icon.stories.tsx | 53 |
1 files changed, 53 insertions, 0 deletions
diff --git a/uidev/src/stories/icon.stories.tsx b/uidev/src/stories/icon.stories.tsx new file mode 100644 index 000000000..c8e7f8ced --- /dev/null +++ b/uidev/src/stories/icon.stories.tsx | |||
@@ -0,0 +1,53 @@ | |||
1 | import { observable } from 'mobx'; | ||
2 | import { observer } from 'mobx-react'; | ||
3 | import React from 'react'; | ||
4 | import uuid from 'uuid/v4'; | ||
5 | |||
6 | import { Icon } from '@meetfranz/ui'; | ||
7 | import { storiesOf } from '../stores/stories'; | ||
8 | |||
9 | // interface IStoreArgs { | ||
10 | // value?: boolean; | ||
11 | // checked?: boolean; | ||
12 | // label?: string; | ||
13 | // id?: string; | ||
14 | // name?: string; | ||
15 | // disabled?: boolean; | ||
16 | // error?: string; | ||
17 | // } | ||
18 | |||
19 | // const createStore = (args?: IStoreArgs) => { | ||
20 | // return observable(Object.assign({ | ||
21 | // id: `element-${uuid()}`, | ||
22 | // name: 'toggle', | ||
23 | // label: 'Label', | ||
24 | // value: true, | ||
25 | // checked: false, | ||
26 | // disabled: false, | ||
27 | // error: '', | ||
28 | // }, args)); | ||
29 | // }; | ||
30 | |||
31 | // const WithStoreToggle = observer(({ store }: { store: any }) => ( | ||
32 | // <> | ||
33 | // <Toggle | ||
34 | // value={store.value} | ||
35 | // checked={store.checked} | ||
36 | // label={store.label} | ||
37 | // id={store.id} | ||
38 | // name={store.name} | ||
39 | // disabled={store.disabled} | ||
40 | // error={store.error} | ||
41 | // onChange={() => store.checked = !store.checked} | ||
42 | // /> | ||
43 | // </> | ||
44 | // )); | ||
45 | |||
46 | storiesOf('Icon') | ||
47 | .add('Basic', () => ( | ||
48 | <> | ||
49 | <Icon icon="mdiAccountCircle" /> | ||
50 | <Icon icon="mdiAccountCircle" size={2} /> | ||
51 | <Icon icon="mdiAccountCircle" size={3} /> | ||
52 | </> | ||
53 | )); | ||