@desynova-digital/components 9.0.26 → 9.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (170) hide show
  1. package/_helpers/globals.js +9 -10
  2. package/_helpers/pagination.js +10 -15
  3. package/_helpers/story-example.js +16 -39
  4. package/_helpers/story-helpers.js +15 -14
  5. package/_helpers/story-stack.js +22 -43
  6. package/_helpers/uniqueId.js +2 -5
  7. package/_helpers/utils.js +28 -4
  8. package/atoms/avatar/avatar.js +19 -42
  9. package/atoms/avatar/avatar.story.js +25 -58
  10. package/atoms/avatar/index.js +13 -11
  11. package/atoms/badge/badge.js +14 -37
  12. package/atoms/badge/badge.story.js +45 -103
  13. package/atoms/badge/index.js +12 -10
  14. package/atoms/button/button.js +85 -161
  15. package/atoms/button/button.story.js +354 -508
  16. package/atoms/button/index.js +5 -9
  17. package/atoms/card/card.js +26 -55
  18. package/atoms/card/card.story.js +39 -88
  19. package/atoms/card/index.js +12 -10
  20. package/atoms/cardStack/cardStack.js +88 -147
  21. package/atoms/cardStack/cardStack.story.js +106 -210
  22. package/atoms/cardStack/index.js +12 -10
  23. package/atoms/cardV2/cardV2.js +57 -106
  24. package/atoms/cardV2/cardV2.story.js +184 -232
  25. package/atoms/cardV2/content.js +154 -256
  26. package/atoms/cardV2/index.js +4 -8
  27. package/atoms/cardV2/thumbnail.js +138 -208
  28. package/atoms/cardV2/timeline.js +167 -123
  29. package/atoms/checkbox/checkbox.js +85 -157
  30. package/atoms/checkbox/checkbox.story.js +237 -365
  31. package/atoms/checkbox/index.js +4 -9
  32. package/atoms/customSelect/customSelect.js +136 -215
  33. package/atoms/customSelect/customSelect.story.js +745 -851
  34. package/atoms/customSelect/index.js +4 -8
  35. package/atoms/datePicker/datePicker.js +299 -431
  36. package/atoms/datePicker/datePicker.story.js +453 -501
  37. package/atoms/datePicker/index.js +4 -8
  38. package/atoms/dateTime/dateTime.js +3 -6
  39. package/atoms/dateTime/dateTime.story.js +17 -63
  40. package/atoms/dateTime/index.js +5 -9
  41. package/atoms/draftInputText/draftInputText.js +121 -189
  42. package/atoms/draftInputText/draftInputText.story.js +200 -249
  43. package/atoms/draftInputText/index.js +5 -9
  44. package/atoms/dropdown/dropdown.js +38 -66
  45. package/atoms/dropdown/dropdown.story.js +102 -262
  46. package/atoms/dropdown/index.js +4 -8
  47. package/atoms/dropdownList/dropdownList.js +78 -108
  48. package/atoms/dropdownList/dropdownList.story.js +1546 -1621
  49. package/atoms/dropdownList/index.js +4 -8
  50. package/atoms/graphs/barGraph/barGraph.js +95 -146
  51. package/atoms/graphs/barGraph/barGraph.story.js +65 -87
  52. package/atoms/graphs/barGraph/index.js +4 -8
  53. package/atoms/graphs/circleDonut/circleDonut.js +177 -229
  54. package/atoms/graphs/circleDonut/circleDonut.story.js +328 -394
  55. package/atoms/graphs/circleDonut/index.js +5 -9
  56. package/atoms/graphs/circleGraph/circleGraph.js +60 -90
  57. package/atoms/graphs/circleGraph/circleGraph.story.js +36 -54
  58. package/atoms/graphs/circleGraph/index.js +4 -8
  59. package/atoms/graphs/circleNested/circleNested.js +216 -262
  60. package/atoms/graphs/circleNested/circleNested.story.js +91 -116
  61. package/atoms/graphs/circleNested/index.js +5 -9
  62. package/atoms/graphs/pieChart/index.js +4 -8
  63. package/atoms/graphs/pieChart/pieChart.js +162 -191
  64. package/atoms/graphs/pieChart/pieChart.story.js +147 -176
  65. package/atoms/graphs/verticalBarGraph/index.js +5 -9
  66. package/atoms/graphs/verticalBarGraph/verticalBarGraph.js +75 -98
  67. package/atoms/graphs/verticalBarGraph/verticalBarGraph.story.js +26 -45
  68. package/atoms/icon/icon.js +41 -72
  69. package/atoms/icon/icon.story.js +831 -260
  70. package/atoms/icon/index.js +19 -12
  71. package/atoms/image/image.js +18 -32
  72. package/atoms/image/image.story.js +10 -19
  73. package/atoms/image/index.js +4 -8
  74. package/atoms/inputText/index.js +4 -8
  75. package/atoms/inputText/inputText.js +86 -131
  76. package/atoms/inputText/inputText.story.js +191 -255
  77. package/atoms/label/index.js +4 -8
  78. package/atoms/label/label.js +25 -50
  79. package/atoms/label/label.story.js +42 -83
  80. package/atoms/loader/CircleLoader.js +29 -63
  81. package/atoms/loader/ShimmerComponent/CollabShimmerCard.js +39 -50
  82. package/atoms/loader/ShimmerComponent/CollabShimmerCardTray.js +41 -42
  83. package/atoms/loader/ShimmerComponent/FiltersShimmer.js +30 -30
  84. package/atoms/loader/ShimmerComponent/GraphDetailShimmer.js +21 -34
  85. package/atoms/loader/ShimmerComponent/GraphTitleShimmer.js +30 -34
  86. package/atoms/loader/ShimmerComponent/GraphsComponentShimmer.js +23 -32
  87. package/atoms/loader/ShimmerComponent/Shimmer.js +24 -32
  88. package/atoms/loader/ThreeDotLoader.js +14 -29
  89. package/atoms/loader/index.js +13 -11
  90. package/atoms/loader/loader.js +34 -58
  91. package/atoms/loader/loader.story.js +48 -52
  92. package/atoms/loader/spinningLoader.js +23 -34
  93. package/atoms/popup/index.js +5 -9
  94. package/atoms/popup/popup.js +123 -208
  95. package/atoms/popup/popup.story.js +97 -131
  96. package/atoms/radio/index.js +18 -11
  97. package/atoms/radio/radio.js +58 -112
  98. package/atoms/radio/radio.story.js +197 -420
  99. package/atoms/select/index.js +4 -8
  100. package/atoms/select/select.js +48 -86
  101. package/atoms/sideBar/index.js +5 -9
  102. package/atoms/sideBar/sidebar.js +89 -140
  103. package/atoms/switch/index.js +4 -8
  104. package/atoms/switch/switch.js +56 -86
  105. package/atoms/switch/switch.story.js +268 -415
  106. package/atoms/tag/index.js +12 -10
  107. package/atoms/tag/tag.js +29 -63
  108. package/atoms/tag/tag.story.js +135 -209
  109. package/atoms/textarea/index.js +5 -9
  110. package/atoms/textarea/textarea.js +55 -99
  111. package/atoms/textarea/textarea.story.js +48 -41
  112. package/atoms/thematicBreak/index.js +12 -10
  113. package/atoms/thematicBreak/thematicBreak.js +20 -38
  114. package/atoms/thematicBreak/thematicBreak.story.js +25 -37
  115. package/atoms/timeCodeInput/index.js +4 -8
  116. package/atoms/timeCodeInput/timCodeInput.story.js +21 -35
  117. package/atoms/timeCodeInput/timeCodeInput.js +33 -51
  118. package/atoms/timer/index.js +5 -9
  119. package/atoms/timer/timer.js +57 -108
  120. package/atoms/timer/timer.story.js +13 -26
  121. package/atoms/toast/index.js +5 -9
  122. package/atoms/toast/toast.js +81 -116
  123. package/atoms/toast/toast.story.js +50 -76
  124. package/atoms/videoCard/index.js +12 -10
  125. package/atoms/videoCard/videoCard.js +265 -447
  126. package/atoms/videoCard/videoCard.story.js +495 -710
  127. package/components.js +411 -294
  128. package/index.js +350 -61
  129. package/molecules/carousel/carousel.js +121 -207
  130. package/molecules/carousel/carousel.story.js +240 -223
  131. package/molecules/carousel/index.js +5 -9
  132. package/molecules/errorScreen/CollabErrorScreen.js +35 -66
  133. package/molecules/errorScreen/TableErrorScreen.js +109 -102
  134. package/molecules/errorScreen/TableErrorScreen.jsx +7 -6
  135. package/molecules/errorScreen/errorScreen.js +41 -94
  136. package/molecules/filter/constants.js +1 -0
  137. package/molecules/filter/filter.js +378 -562
  138. package/molecules/filter/filter.story.js +79 -104
  139. package/molecules/filter/index.js +5 -9
  140. package/molecules/graphCard/graphCard.js +97 -193
  141. package/molecules/graphCard/graphCard.story.js +159 -191
  142. package/molecules/graphCard/index.js +4 -8
  143. package/molecules/graphCard/loader.js +28 -68
  144. package/molecules/graphDetailCard/graphDetailCard.js +115 -183
  145. package/molecules/graphDetailCard/graphDetailCard.story.js +218 -254
  146. package/molecules/graphDetailCard/index.js +5 -9
  147. package/molecules/pageHeader/index.js +12 -10
  148. package/molecules/pageHeader/pageHeader.js +38 -79
  149. package/molecules/pageHeader/pageHeader.story.js +34 -55
  150. package/molecules/pagination/index.js +4 -8
  151. package/molecules/pagination/pagination.js +126 -202
  152. package/molecules/pagination/pagination.story.js +40 -52
  153. package/molecules/richTextInput/RichTextInput.js +354 -0
  154. package/molecules/richTextInput/RichTextInput.story.js +50 -0
  155. package/molecules/richTextInput/index.js +9 -0
  156. package/molecules/table/index.js +4 -8
  157. package/molecules/table/table-column.js +10 -16
  158. package/molecules/table/table-header.js +31 -72
  159. package/molecules/table/table.js +743 -1075
  160. package/molecules/table/table.story.js +274 -304
  161. package/molecules/tabs/index.js +4 -8
  162. package/molecules/tabs/tabs.js +112 -184
  163. package/molecules/tabs/tabs.story.js +66 -133
  164. package/molecules/videoCardList/index.js +4 -8
  165. package/molecules/videoCardList/videoCardList.js +24 -41
  166. package/molecules/videoCardList/videoCardList.story.js +449 -664
  167. package/molecules/videoPlayer/index.js +4 -8
  168. package/molecules/videoPlayer/videoPlayer.js +1019 -1097
  169. package/molecules/videoPlayer/videoPlayer.story.js +10 -21
  170. package/package.json +2 -2
package/atoms/checkbox/checkbox.story.js CHANGED
@@ -1,369 +1,241 @@
1
- 'use strict';
1
+ "use strict";
2
2
 
3
- var _react = require('react');
4
-
5
- var _react2 = _interopRequireDefault(_react);
6
-
7
- var _react3 = require('@storybook/react');
8
-
9
- var _storyHelpers = require('../../_helpers/story-helpers');
10
-
11
- var _components = require('../../components');
12
-
13
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
14
-
15
- (0, _react3.storiesOf)('Checkbox').add('light theme', function () {
16
- return _react2.default.createElement(
17
- _storyHelpers.Example,
18
- null,
19
- _react2.default.createElement(
20
- _components.Checkbox.Group,
21
- { name: 'example2', readOnly: true, align: 'horizontal', selected: ['one', 'two'] },
22
- _react2.default.createElement(
23
- _components.Checkbox,
24
- { value: 'one' },
25
- 'Option 1'
26
- ),
27
- _react2.default.createElement(
28
- _components.Checkbox,
29
- { value: 'two' },
30
- 'Option 2'
31
- ),
32
- _react2.default.createElement(
33
- _components.Checkbox,
34
- { value: 'three' },
35
- 'Option 3'
36
- ),
37
- _react2.default.createElement(
38
- _components.Checkbox,
39
- { value: 'four' },
40
- 'Option 4'
41
- )
42
- ),
43
- _react2.default.createElement(
44
- _components.Checkbox.Group,
45
- {
46
- name: 'example2',
47
- type: 'label',
48
- onChange: function onChange(e) {
49
- console.log(e.target.value, e.target.checked);
50
- },
51
- align: 'horizontal',
52
- selected: ['one', 'two']
53
- },
54
- _react2.default.createElement(
55
- _components.Checkbox,
56
- { value: 'one' },
57
- 'ONE'
58
- ),
59
- _react2.default.createElement(
60
- _components.Checkbox,
61
- { value: 'two' },
62
- 'TWO'
63
- ),
64
- _react2.default.createElement(
65
- _components.Checkbox,
66
- { value: 'three' },
67
- 'THREE'
68
- ),
69
- _react2.default.createElement(
70
- _components.Checkbox,
71
- { value: 'four' },
72
- 'FOUR'
73
- )
74
- ),
75
- _react2.default.createElement(
76
- _components.Checkbox.Group,
77
- {
78
- name: 'example2',
79
- onChange: function onChange(e) {
80
- console.log(e.target.value, e.target.checked);
81
- },
82
- align: 'vertical',
83
- selected: ['one', 'two', 'three']
84
- },
85
- _react2.default.createElement(
86
- _components.Checkbox,
87
- { value: 'one' },
88
- 'Option 1'
89
- ),
90
- _react2.default.createElement(
91
- _components.Checkbox,
92
- { value: 'two' },
93
- 'Option 2'
94
- ),
95
- _react2.default.createElement(
96
- _components.Checkbox,
97
- { value: 'three', readOnly: true },
98
- 'Option 3'
99
- ),
100
- _react2.default.createElement(
101
- _components.Checkbox,
102
- { value: 'four' },
103
- 'Option 4'
104
- )
105
- )
106
- );
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _react = _interopRequireDefault(require("react"));
5
+ var _react2 = require("@storybook/react");
6
+ var _storyHelpers = require("../../_helpers/story-helpers");
7
+ var _components = require("../../components");
8
+ (0, _react2.storiesOf)('Checkbox').add('light theme', function () {
9
+ return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, null, /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
10
+ name: "example2",
11
+ readOnly: true,
12
+ align: "horizontal",
13
+ selected: ['one', 'two']
14
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
15
+ value: "one"
16
+ }, "Option 1"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
17
+ value: "two"
18
+ }, "Option 2"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
19
+ value: "three"
20
+ }, "Option 3"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
21
+ value: "four"
22
+ }, "Option 4")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
23
+ name: "example2",
24
+ type: "label",
25
+ onChange: function onChange(e) {
26
+ console.log(e.target.value, e.target.checked);
27
+ },
28
+ align: "horizontal",
29
+ selected: ['one', 'two']
30
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
31
+ value: "one"
32
+ }, "ONE"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
33
+ value: "two"
34
+ }, "TWO"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
35
+ value: "three"
36
+ }, "THREE"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
37
+ value: "four"
38
+ }, "FOUR")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
39
+ name: "example2",
40
+ onChange: function onChange(e) {
41
+ console.log(e.target.value, e.target.checked);
42
+ },
43
+ align: "vertical",
44
+ selected: ['one', 'two', 'three']
45
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
46
+ value: "one"
47
+ }, "Option 1"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
48
+ value: "two"
49
+ }, "Option 2"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
50
+ value: "three",
51
+ readOnly: true
52
+ }, "Option 3"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
53
+ value: "four"
54
+ }, "Option 4")));
107
55
  });
108
-
109
- (0, _react3.storiesOf)('Checkbox').add('dark theme', function () {
110
- return _react2.default.createElement(
111
- _storyHelpers.Example,
112
- { background: 'dark' },
113
- _react2.default.createElement(
114
- _components.Checkbox.Group,
115
- { theme: 'dark', name: 'example3', align: 'horizontal', selected: ['one', 'two'] },
116
- _react2.default.createElement(
117
- _components.Checkbox,
118
- { value: 'one' },
119
- 'Option 1'
120
- ),
121
- _react2.default.createElement(
122
- _components.Checkbox,
123
- { value: 'two' },
124
- 'Option 2'
125
- ),
126
- _react2.default.createElement(
127
- _components.Checkbox,
128
- { value: 'three' },
129
- 'Option 3'
130
- ),
131
- _react2.default.createElement(
132
- _components.Checkbox,
133
- { value: 'four' },
134
- 'Option 4'
135
- )
136
- ),
137
- _react2.default.createElement(
138
- _components.Checkbox.Group,
139
- {
140
- theme: 'dark',
141
- name: 'example4',
142
- type: 'label',
143
- onChange: function onChange(e) {
144
- console.log(e.target.value, e.target.checked);
145
- },
146
- align: 'horizontal',
147
- selected: ['one', 'two']
148
- },
149
- _react2.default.createElement(
150
- _components.Checkbox,
151
- { value: 'one' },
152
- 'ONE'
153
- ),
154
- _react2.default.createElement(
155
- _components.Checkbox,
156
- { value: 'two' },
157
- 'TWO'
158
- ),
159
- _react2.default.createElement(
160
- _components.Checkbox,
161
- { value: 'three' },
162
- 'THREE'
163
- ),
164
- _react2.default.createElement(
165
- _components.Checkbox,
166
- { value: 'four' },
167
- 'FOUR'
168
- )
169
- ),
170
- _react2.default.createElement(
171
- _components.Checkbox.Group,
172
- {
173
- theme: 'dark',
174
- name: 'example2',
175
- onChange: function onChange(e) {
176
- console.log(e.target.value, e.target.checked);
177
- },
178
- align: 'vertical',
179
- selected: ['one', 'two', 'three']
180
- },
181
- _react2.default.createElement(
182
- _components.Checkbox,
183
- { value: 'one' },
184
- 'Option 1'
185
- ),
186
- _react2.default.createElement(
187
- _components.Checkbox,
188
- { value: 'two' },
189
- 'Option 2'
190
- ),
191
- _react2.default.createElement(
192
- _components.Checkbox,
193
- { value: 'three', readOnly: true },
194
- 'Option 3'
195
- ),
196
- _react2.default.createElement(
197
- _components.Checkbox,
198
- { value: 'four' },
199
- 'Option 4'
200
- )
201
- ),
202
- _react2.default.createElement(
203
- _components.Checkbox.Group,
204
- {
205
- theme: 'dark',
206
- name: 'example5',
207
- onChange: function onChange(e) {
208
- console.log(e.target.value, e.target.checked);
209
- },
210
- align: 'horizontal',
211
- selected: ['text_aligned_left'],
212
- type: 'icon'
213
- },
214
- _react2.default.createElement(_components.Checkbox, { value: 'text_aligned_left' }),
215
- _react2.default.createElement(_components.Checkbox, { value: 'text_aligned_center' }),
216
- _react2.default.createElement(_components.Checkbox, { value: 'text_aligned_right' })
217
- ),
218
- _react2.default.createElement(
219
- _components.Checkbox.Group,
220
- {
221
- theme: 'dark',
222
- name: 'example6',
223
- onChange: function onChange(e) {
224
- console.log(e.target.value, e.target.checked);
225
- },
226
- align: 'horizontal',
227
- selected: ['text_position_bottom'],
228
- type: 'icon',
229
- width: 24,
230
- height: 16,
231
- fillRule: 'evenodd'
232
- },
233
- _react2.default.createElement(_components.Checkbox, { value: 'text_position_top' }),
234
- _react2.default.createElement(_components.Checkbox, { value: 'text_position_center' }),
235
- _react2.default.createElement(_components.Checkbox, { value: 'text_position_bottom' })
236
- )
237
- );
56
+ (0, _react2.storiesOf)('Checkbox').add('dark theme', function () {
57
+ return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
58
+ background: "dark"
59
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
60
+ theme: 'dark',
61
+ name: "example3",
62
+ align: "horizontal",
63
+ selected: ['one', 'two']
64
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
65
+ value: "one"
66
+ }, "Option 1"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
67
+ value: "two"
68
+ }, "Option 2"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
69
+ value: "three"
70
+ }, "Option 3"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
71
+ value: "four"
72
+ }, "Option 4")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
73
+ theme: 'dark',
74
+ name: "example4",
75
+ type: "label",
76
+ onChange: function onChange(e) {
77
+ console.log(e.target.value, e.target.checked);
78
+ },
79
+ align: "horizontal",
80
+ selected: ['one', 'two']
81
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
82
+ value: "one"
83
+ }, "ONE"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
84
+ value: "two"
85
+ }, "TWO"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
86
+ value: "three"
87
+ }, "THREE"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
88
+ value: "four"
89
+ }, "FOUR")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
90
+ theme: 'dark',
91
+ name: "example2",
92
+ onChange: function onChange(e) {
93
+ console.log(e.target.value, e.target.checked);
94
+ },
95
+ align: "vertical",
96
+ selected: ['one', 'two', 'three']
97
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
98
+ value: "one"
99
+ }, "Option 1"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
100
+ value: "two"
101
+ }, "Option 2"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
102
+ value: "three",
103
+ readOnly: true
104
+ }, "Option 3"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
105
+ value: "four"
106
+ }, "Option 4")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
107
+ theme: 'dark',
108
+ name: "example5",
109
+ onChange: function onChange(e) {
110
+ console.log(e.target.value, e.target.checked);
111
+ },
112
+ align: "horizontal",
113
+ selected: ['text_aligned_left'],
114
+ type: "icon"
115
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
116
+ value: "text_aligned_left"
117
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
118
+ value: "text_aligned_center"
119
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
120
+ value: "text_aligned_right"
121
+ })), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
122
+ theme: 'dark',
123
+ name: "example6",
124
+ onChange: function onChange(e) {
125
+ console.log(e.target.value, e.target.checked);
126
+ },
127
+ align: "horizontal",
128
+ selected: ['text_position_bottom'],
129
+ type: "icon",
130
+ width: 24,
131
+ height: 16,
132
+ fillRule: "evenodd"
133
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
134
+ value: "text_position_top"
135
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
136
+ value: "text_position_center"
137
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
138
+ value: "text_position_bottom"
139
+ })));
238
140
  });
239
-
240
- (0, _react3.storiesOf)('Checkbox').add('nexc theme', function () {
241
- return _react2.default.createElement(
242
- _storyHelpers.Example,
243
- { background: 'dark' },
244
- _react2.default.createElement(
245
- _components.Checkbox.Group,
246
- { theme: 'nexc', name: 'example3', align: 'horizontal', selected: ['one', 'two'] },
247
- _react2.default.createElement(
248
- _components.Checkbox,
249
- { theme: 'nexc', value: 'one' },
250
- 'Option 1'
251
- ),
252
- _react2.default.createElement(
253
- _components.Checkbox,
254
- { value: 'two' },
255
- 'Option 2'
256
- ),
257
- _react2.default.createElement(
258
- _components.Checkbox,
259
- { theme: 'nexc', value: 'three' },
260
- 'Option 3'
261
- ),
262
- _react2.default.createElement(
263
- _components.Checkbox,
264
- { theme: 'nexc', value: 'four' },
265
- 'Option 4'
266
- )
267
- ),
268
- _react2.default.createElement(
269
- _components.Checkbox.Group,
270
- {
271
- theme: 'nexc',
272
- name: 'example4',
273
- type: 'label',
274
- onChange: function onChange(e) {
275
- console.log(e.target.value, e.target.checked);
276
- },
277
- align: 'horizontal',
278
- selected: ['one', 'two']
279
- },
280
- _react2.default.createElement(
281
- _components.Checkbox,
282
- { theme: 'nexc', value: 'one' },
283
- 'ONE'
284
- ),
285
- _react2.default.createElement(
286
- _components.Checkbox,
287
- { theme: 'nexc', value: 'two' },
288
- 'TWO'
289
- ),
290
- _react2.default.createElement(
291
- _components.Checkbox,
292
- { theme: 'nexc', value: 'three' },
293
- 'THREE'
294
- ),
295
- _react2.default.createElement(
296
- _components.Checkbox,
297
- { theme: 'nexc', value: 'four' },
298
- 'FOUR'
299
- )
300
- ),
301
- _react2.default.createElement(
302
- _components.Checkbox.Group,
303
- {
304
- theme: 'nexc',
305
- name: 'example2',
306
- onChange: function onChange(e) {
307
- console.log(e.target.value, e.target.checked);
308
- },
309
- align: 'vertical',
310
- selected: ['one', 'two', 'three']
311
- },
312
- _react2.default.createElement(
313
- _components.Checkbox,
314
- { theme: 'nexc', value: 'one' },
315
- 'Option 1'
316
- ),
317
- _react2.default.createElement(
318
- _components.Checkbox,
319
- { theme: 'nexc', value: 'two' },
320
- 'Option 2'
321
- ),
322
- _react2.default.createElement(
323
- _components.Checkbox,
324
- { theme: 'nexc', value: 'three', readOnly: true },
325
- 'Option 3'
326
- ),
327
- _react2.default.createElement(
328
- _components.Checkbox,
329
- { value: 'four' },
330
- 'Option 4'
331
- )
332
- ),
333
- _react2.default.createElement(
334
- _components.Checkbox.Group,
335
- {
336
- theme: 'nexc',
337
- name: 'example5',
338
- onChange: function onChange(e) {
339
- console.log(e.target.value, e.target.checked);
340
- },
341
- align: 'horizontal',
342
- selected: ['text_aligned_left'],
343
- type: 'icon'
344
- },
345
- _react2.default.createElement(_components.Checkbox, { theme: 'nexc', value: 'text_aligned_left' }),
346
- _react2.default.createElement(_components.Checkbox, { theme: 'nexc', value: 'text_aligned_center' }),
347
- _react2.default.createElement(_components.Checkbox, { theme: 'nexc', value: 'text_aligned_right' })
348
- ),
349
- _react2.default.createElement(
350
- _components.Checkbox.Group,
351
- {
352
- theme: 'nexc',
353
- name: 'example6',
354
- onChange: function onChange(e) {
355
- console.log(e.target.value, e.target.checked);
356
- },
357
- align: 'horizontal',
358
- selected: ['text_position_bottom'],
359
- type: 'icon',
360
- width: 24,
361
- height: 16,
362
- fillRule: 'evenodd'
363
- },
364
- _react2.default.createElement(_components.Checkbox, { theme: 'nexc', value: 'text_position_top' }),
365
- _react2.default.createElement(_components.Checkbox, { theme: 'nexc', value: 'text_position_center' }),
366
- _react2.default.createElement(_components.Checkbox, { theme: 'nexc', value: 'text_position_bottom' })
367
- )
368
- );
141
+ (0, _react2.storiesOf)('Checkbox').add('nexc theme', function () {
142
+ return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
143
+ background: "dark"
144
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
145
+ theme: 'nexc',
146
+ name: "example3",
147
+ align: "horizontal",
148
+ selected: ['one', 'two']
149
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
150
+ theme: "nexc",
151
+ value: "one"
152
+ }, "Option 1"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
153
+ value: "two"
154
+ }, "Option 2"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
155
+ theme: "nexc",
156
+ value: "three"
157
+ }, "Option 3"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
158
+ theme: "nexc",
159
+ value: "four"
160
+ }, "Option 4")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
161
+ theme: 'nexc',
162
+ name: "example4",
163
+ type: "label",
164
+ onChange: function onChange(e) {
165
+ console.log(e.target.value, e.target.checked);
166
+ },
167
+ align: "horizontal",
168
+ selected: ['one', 'two']
169
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
170
+ theme: "nexc",
171
+ value: "one"
172
+ }, "ONE"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
173
+ theme: "nexc",
174
+ value: "two"
175
+ }, "TWO"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
176
+ theme: "nexc",
177
+ value: "three"
178
+ }, "THREE"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
179
+ theme: "nexc",
180
+ value: "four"
181
+ }, "FOUR")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
182
+ theme: 'nexc',
183
+ name: "example2",
184
+ onChange: function onChange(e) {
185
+ console.log(e.target.value, e.target.checked);
186
+ },
187
+ align: "vertical",
188
+ selected: ['one', 'two', 'three']
189
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
190
+ theme: "nexc",
191
+ value: "one"
192
+ }, "Option 1"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
193
+ theme: "nexc",
194
+ value: "two"
195
+ }, "Option 2"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
196
+ theme: "nexc",
197
+ value: "three",
198
+ readOnly: true
199
+ }, "Option 3"), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
200
+ value: "four"
201
+ }, "Option 4")), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
202
+ theme: 'nexc',
203
+ name: "example5",
204
+ onChange: function onChange(e) {
205
+ console.log(e.target.value, e.target.checked);
206
+ },
207
+ align: "horizontal",
208
+ selected: ['text_aligned_left'],
209
+ type: "icon"
210
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
211
+ theme: "nexc",
212
+ value: "text_aligned_left"
213
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
214
+ theme: "nexc",
215
+ value: "text_aligned_center"
216
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
217
+ theme: "nexc",
218
+ value: "text_aligned_right"
219
+ })), /*#__PURE__*/_react["default"].createElement(_components.Checkbox.Group, {
220
+ theme: 'nexc',
221
+ name: "example6",
222
+ onChange: function onChange(e) {
223
+ console.log(e.target.value, e.target.checked);
224
+ },
225
+ align: "horizontal",
226
+ selected: ['text_position_bottom'],
227
+ type: "icon",
228
+ width: 24,
229
+ height: 16,
230
+ fillRule: "evenodd"
231
+ }, /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
232
+ theme: "nexc",
233
+ value: "text_position_top"
234
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
235
+ theme: "nexc",
236
+ value: "text_position_center"
237
+ }), /*#__PURE__*/_react["default"].createElement(_components.Checkbox, {
238
+ theme: "nexc",
239
+ value: "text_position_bottom"
240
+ })));
369
241
  });
package/atoms/checkbox/index.js CHANGED
@@ -1,14 +1,9 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
-
7
- var _checkbox = require("./checkbox");
8
-
9
- var _checkbox2 = _interopRequireDefault(_checkbox);
10
-
11
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
-
13
- exports.default = _checkbox2.default;
14
- // export { StyledCheckbox, StyledCheckboxOption }
7
+ exports["default"] = void 0;
8
+ var _checkbox = _interopRequireDefault(require("./checkbox"));
9
+ var _default = exports["default"] = _checkbox["default"]; // export { StyledCheckbox, StyledCheckboxOption }