aboutsummaryrefslogtreecommitdiffstats
path: root/uidev/src/stories/toggle.stories.tsx
diff options
context:
space:
mode:
authorLibravatar Stefan Malzner <stefan@adlk.io>2019-03-18 03:28:03 -0700
committerLibravatar GitHub <noreply@github.com>2019-03-18 03:28:03 -0700
commit6134c1b49f919dd2c578bc490829d68e4d210f4e (patch)
tree1ad6530fbb7f19e4e9c9a235c6b44e0dfdbc47d4 /uidev/src/stories/toggle.stories.tsx
parentAdd missing bracket in brew install help (#1205) (diff)
downloadferdium-app-6134c1b49f919dd2c578bc490829d68e4d210f4e.tar.gz
ferdium-app-6134c1b49f919dd2c578bc490829d68e4d210f4e.tar.zst
ferdium-app-6134c1b49f919dd2c578bc490829d68e4d210f4e.zip
Release/5.0.1 beta.1 (#1344)
* Add lerna * Add theme * Add forms * Add misty config to build theme & forms * reset packages version * Publish - @meetfranz/forms@1.0.0 - @meetfranz/theme@1.0.0 * Reset package version * restructure packages * try ci with lerna * Fix missing packages in build * move storybook to root + typescript TODO: fix modules * Add lerna instructions * Merge * wip * Make packages work in electron, node and web * Finalize packages & replace storybook with homegrown `uidev` * Bring package-lock back in sync * Publish - @meetfranz/forms@1.0.1 - @meetfranz/theme@1.0.1 * fix webpack issue * expose legacy styles * Add toggle element to @meetfranz/forms * start typings package * Update package.json * Add buttons * Update theme * add types * Add mdi icons to buttons * Publish - @meetfranz/forms@1.0.2 - @meetfranz/theme@1.0.2 - @meetfranz/typings@0.0.1 * Button, add missing success state * Update lerna packages * Try to disable automatic npm ci * Try to get a working bundle * Add href and type to button component * Update packages * update versions * cleanup * Update package versions [ci skip] * Update versions * Add withTheme context to button * Update & reuse electron-rebuild * feat(Windows): Add option to quit Franz from Taskbar icon * Add missing withTheme * Fix package versions * Update versions * Add pageview event * Simplify analytics calls * Pin gulp-sass-variables to 1.1.1 * Add onFocus event * Add modal overlay color * remove legacy theme files * remove code * Add dialog to share franz on social media * Fix service count * remove ping * replace ms time strings with ms module * remove unused packages * fix value setter * new payment flow * fix module reference * feat(Spell check): Add en-gb spell check languages (#1306) * move devmode info * fix(Windows): Fix losing window when "Keep Franz in background" is enabled * fix(Service): Fix service zoom (cmd/ctrl+ & cmd/ctrl-) * fixes appveyor build issue * feat(App): Update electron to 4.0.7 * ignore intellij idea project files * Automatic i18n update (i18n.meetfranz.com) * feat(App): Add security checks for external URLs * setup react-intl translations managing script * use same zooming logic for all os * feat(Linux): Add auto updater for Linux AppImage builds * Add ctrl+ for zoom in on Windows * move translation scripts into src/i18n folder * only manage en-US translations * manage translations before git pushes * Fix unused i18n strings * Bump version to 5.0.1-beta.1 * fix(Service) shortcuts for activating prev/next service fixes #1298 * fix(Service): Fix shortcut for (un)muting notifications & audio * add missing react-intl files * correctly update services submenu on language change * fix(Windows): Fix copy & paste in service context menus Closes #1316 * fix(Linux): Fix minimized window focusing (#1304) (@skoruppa) * trigger build * Check if window is minimized before restoring it * restore() should be executed only when window is minimized * fix(Notifications): Fix notifications & notification click when icon is blob * Fix/service webview unmounting (#1328) * detach service when underlying webview unmounts * disable no-param-reassign eslint rule * Add notification debug events * Update electron to 4.0.8 Update required in order to fix performance degradation due to memory leak issue https://github.com/electron/electron/pull/16772. * Automatic i18n update (i18n.meetfranz.com) * Automatic i18n update (i18n.meetfranz.com) * 5.0.1-beta.1
Diffstat (limited to 'uidev/src/stories/toggle.stories.tsx')
-rw-r--r--uidev/src/stories/toggle.stories.tsx70
1 files changed, 70 insertions, 0 deletions
diff --git a/uidev/src/stories/toggle.stories.tsx b/uidev/src/stories/toggle.stories.tsx
new file mode 100644
index 000000000..091342496
--- /dev/null
+++ b/uidev/src/stories/toggle.stories.tsx
@@ -0,0 +1,70 @@
1import { observable } from 'mobx';
2import { observer } from 'mobx-react';
3import React from 'react';
4import uuid from 'uuid/v4';
5
6import { Toggle } from '@meetfranz/forms';
7import { storiesOf } from '../stores/stories';
8
9interface IStoreArgs {
10 value?: boolean;
11 checked?: boolean;
12 label?: string;
13 id?: string;
14 name?: string;
15 disabled?: boolean;
16 error?: string;
17}
18
19const 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
31const 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
46storiesOf('Toggle')
47 .add('Basic', () => (
48 <WithStoreToggle store={createStore()} />
49 ))
50 .add('Checked', () => (
51 <WithStoreToggle store={createStore({
52 checked: true,
53 })} />
54 ))
55 .add('Disabled', () => (
56 <WithStoreToggle store={createStore({
57 checked: true,
58 disabled: true,
59 })} />
60 ))
61 .add('Long label', () => (
62 <WithStoreToggle store={createStore({
63 label: 'Hello world, this is an insanely long label for this toggle. We need to make sure that it will be displayed correctly.',
64 })} />
65 ))
66 .add('With error', () => (
67 <WithStoreToggle store={createStore({
68 error: 'Something went wrong',
69 })} />
70 ));