UNPKG

@flexis/ui

Version:

Styleless React Components

TrigenSoftware/flexis-ui

90 lines • 6.38 kB
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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
/* tslint:disable: no-magic-numbers */ import React from 'react'; import { action } from '@storybook/addon-actions'; import { boolean, number } from '@storybook/addon-knobs/react'; import { storiesOf } from '../../helpers/stories'; import Select, { SelectOption } from './'; export const stylableApi = ` Stylable API --- - arrows() `; export const events = { onChange: action('change') }; export default storiesOf('Select', module) .addParameters({ info: stylableApi }) .add('with basic state', () => (<Select {...events} disabled={boolean('Disabled', false)}> <SelectOption value={0}> Option #1 </SelectOption> <SelectOption value={1}> Option #2 </SelectOption> <SelectOption value={2}> Option #3 </SelectOption> </Select>)) .add('with disabled state', () => (<Select {...events} disabled={boolean('Disabled', true)}> <SelectOption value={0}> Option #1 </SelectOption> <SelectOption value={1}> Option #2 </SelectOption> <SelectOption value={2}> Option #3 </SelectOption> </Select>)) .add('with default value', () => (<Select {...events} name='select' defaultValue={1} disabled={boolean('Disabled', false)}> <SelectOption value={0}> Option #1 </SelectOption> <SelectOption value={1}> Option #2 </SelectOption> <SelectOption value={2}> Option #3 </SelectOption> </Select>)) .add('with value', () => (<Select {...events} name='select' value={number('Value', 1)} disabled={boolean('Disabled', false)}> <SelectOption value={0}> Option #1 </SelectOption> <SelectOption value={1}> Option #2 </SelectOption> <SelectOption value={2}> Option #3 </SelectOption> </Select>)) .add('with text around', () => { const select = (<Select> <SelectOption value={0}> Option #1 </SelectOption> <SelectOption value={1}> Option #2 </SelectOption> <SelectOption value={2}> Option #3 </SelectOption> </Select>); return (<div> Text {select} text </div>); }) .add('without values', () => (<Select {...events} disabled={boolean('Disabled', false)}> <SelectOption> Option #1 </SelectOption> <SelectOption> Option #2 </SelectOption> <SelectOption> Option #3 </SelectOption> </Select>)); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VsZWN0LnN0b3JpZXMuanN4Iiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvU2VsZWN0L1NlbGVjdC5zdG9yaWVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxzQ0FBc0M7QUFDdEMsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFDTixNQUFNLEVBQ04sTUFBTSwwQkFBMEIsQ0FBQztBQUNsQyxPQUFPLEVBQ04sT0FBTyxFQUNQLE1BQU0sRUFDTixNQUFNLDhCQUE4QixDQUFDO0FBQ3RDLE9BQU8sRUFDTixTQUFTLEVBQ1QsTUFBTSx1QkFBdUIsQ0FBQztBQUMvQixPQUFPLE1BQU0sRUFBRSxFQUNkLFlBQVksRUFDWixNQUFNLElBQUksQ0FBQztBQUVaLE1BQU0sQ0FBQyxNQUFNLFdBQVcsR0FBRzs7OztDQUkxQixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sTUFBTSxHQUFHO0lBQ3JCLFFBQVEsRUFBRSxNQUFNLENBQUMsUUFBUSxDQUFDO0NBQzFCLENBQUM7QUFFRixlQUFlLFNBQVMsQ0FBQyxRQUFRLEVBQUUsTUFBTSxDQUFDO0tBQ3hDLGFBQWEsQ0FBQztJQUNkLElBQUksRUFBRSxXQUFXO0NBQ2pCLENBQUM7S0FDRCxHQUFHLENBQ0gsa0JBQWtCLEVBQ2xCLEdBQUcsRUFBRSxDQUFDLENBQ0wsQ0FBQyxNQUFNLENBQ04sSUFBSSxNQUFNLENBQUMsQ0FDWCxRQUFRLENBQUMsQ0FBQyxPQUFPLENBQUMsVUFBVSxFQUFFLEtBQUssQ0FBQyxDQUFDLENBRXJDO0lBQUEsQ0FBQyxZQUFZLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQ3RCOztJQUNELEVBQUUsWUFBWSxDQUNkO0lBQUEsQ0FBQyxZQUFZLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQ3RCOztJQUNELEVBQUUsWUFBWSxDQUNkO0lBQUEsQ0FBQyxZQUFZLENBQUMsS0FBSyxDQUFDLENB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