@webiny/ui 5.27.0 → 5.29.0-beta.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 (360) hide show
  1. package/Accordion/Accordion.js +27 -13
  2. package/Accordion/Accordion.js.map +1 -1
  3. package/Accordion/Accordion.stories.js +34 -23
  4. package/Accordion/Accordion.stories.js.map +1 -1
  5. package/Accordion/AccordionItem.js +60 -36
  6. package/Accordion/AccordionItem.js.map +1 -1
  7. package/Accordion/index.js +31 -2
  8. package/Accordion/index.js.map +1 -1
  9. package/Alert/Alert.js +21 -10
  10. package/Alert/Alert.js.map +1 -1
  11. package/Alert/Alert.stories.js +22 -13
  12. package/Alert/Alert.stories.js.map +1 -1
  13. package/Alert/index.js +18 -1
  14. package/Alert/index.js.map +1 -1
  15. package/AutoComplete/AutoComplete.js +100 -77
  16. package/AutoComplete/AutoComplete.js.map +1 -1
  17. package/AutoComplete/AutoComplete.stories.js +27 -17
  18. package/AutoComplete/AutoComplete.stories.js.map +1 -1
  19. package/AutoComplete/MultiAutoComplete.js +164 -139
  20. package/AutoComplete/MultiAutoComplete.js.map +1 -1
  21. package/AutoComplete/MultiAutoComplete.stories.js +39 -28
  22. package/AutoComplete/MultiAutoComplete.stories.js.map +1 -1
  23. package/AutoComplete/index.js +31 -2
  24. package/AutoComplete/index.js.map +1 -1
  25. package/AutoComplete/styles.js +14 -4
  26. package/AutoComplete/styles.js.map +1 -1
  27. package/AutoComplete/types.js +5 -1
  28. package/AutoComplete/types.js.map +1 -1
  29. package/AutoComplete/utils.js +19 -4
  30. package/AutoComplete/utils.js.map +1 -1
  31. package/Avatar/Avatar.js +30 -15
  32. package/Avatar/Avatar.js.map +1 -1
  33. package/Avatar/Avatar.stories.js +19 -10
  34. package/Avatar/Avatar.stories.js.map +1 -1
  35. package/Avatar/index.js +18 -1
  36. package/Avatar/index.js.map +1 -1
  37. package/Button/Button.js +52 -23
  38. package/Button/Button.js.map +1 -1
  39. package/Button/Button.stories.js +42 -29
  40. package/Button/Button.stories.js.map +1 -1
  41. package/Button/CopyButton/CopyButton.js +24 -11
  42. package/Button/CopyButton/CopyButton.js.map +1 -1
  43. package/Button/CopyButton/CopyButton.stories.js +20 -10
  44. package/Button/CopyButton/CopyButton.stories.js.map +1 -1
  45. package/Button/IconButton/IconButton.js +14 -4
  46. package/Button/IconButton/IconButton.js.map +1 -1
  47. package/Button/IconButton/IconButton.stories.js +31 -19
  48. package/Button/IconButton/IconButton.stories.js.map +1 -1
  49. package/Button/index.js +44 -3
  50. package/Button/index.js.map +1 -1
  51. package/Carousel/Carousel.js +34 -21
  52. package/Carousel/Carousel.js.map +1 -1
  53. package/Carousel/Carouser.stories.js +27 -17
  54. package/Carousel/Carouser.stories.js.map +1 -1
  55. package/Carousel/index.js +15 -1
  56. package/Carousel/index.js.map +1 -1
  57. package/Checkbox/Checkbox.js +37 -22
  58. package/Checkbox/Checkbox.js.map +1 -1
  59. package/Checkbox/Checkbox.stories.js +27 -16
  60. package/Checkbox/Checkbox.stories.js.map +1 -1
  61. package/Checkbox/Checkbox.styles.js +11 -4
  62. package/Checkbox/Checkbox.styles.js.map +1 -1
  63. package/Checkbox/CheckboxGroup.js +36 -21
  64. package/Checkbox/CheckboxGroup.js.map +1 -1
  65. package/Checkbox/CheckboxGroup.stories.js +29 -18
  66. package/Checkbox/CheckboxGroup.stories.js.map +1 -1
  67. package/Checkbox/index.js +23 -2
  68. package/Checkbox/index.js.map +1 -1
  69. package/Chips/Chip.js +21 -7
  70. package/Chips/Chip.js.map +1 -1
  71. package/Chips/ChipIcon.js +21 -7
  72. package/Chips/ChipIcon.js.map +1 -1
  73. package/Chips/Chips.js +29 -12
  74. package/Chips/Chips.js.map +1 -1
  75. package/Chips/Chips.stories.js +27 -16
  76. package/Chips/Chips.stories.js.map +1 -1
  77. package/Chips/index.js +44 -3
  78. package/Chips/index.js.map +1 -1
  79. package/Chips/styles.js +14 -4
  80. package/Chips/styles.js.map +1 -1
  81. package/CodeEditor/CodeEditor.js +48 -29
  82. package/CodeEditor/CodeEditor.js.map +1 -1
  83. package/CodeEditor/CodeEditor.stories.js +30 -17
  84. package/CodeEditor/CodeEditor.stories.js.map +1 -1
  85. package/CodeEditor/index.js +18 -1
  86. package/CodeEditor/index.js.map +1 -1
  87. package/ColorPicker/ColorPicker.js +58 -44
  88. package/ColorPicker/ColorPicker.js.map +1 -1
  89. package/ColorPicker/ColorPicker.stories.js +26 -15
  90. package/ColorPicker/ColorPicker.stories.js.map +1 -1
  91. package/ColorPicker/index.js +18 -1
  92. package/ColorPicker/index.js.map +1 -1
  93. package/ConfirmationDialog/ConfirmationDialog.js +51 -42
  94. package/ConfirmationDialog/ConfirmationDialog.js.map +1 -1
  95. package/ConfirmationDialog/ConfirmationDialog.stories.js +22 -12
  96. package/ConfirmationDialog/ConfirmationDialog.stories.js.map +1 -1
  97. package/ConfirmationDialog/index.js +31 -2
  98. package/ConfirmationDialog/index.js.map +1 -1
  99. package/ConfirmationDialog/withConfirmation.js +19 -6
  100. package/ConfirmationDialog/withConfirmation.js.map +1 -1
  101. package/Dialog/Dialog.js +68 -37
  102. package/Dialog/Dialog.js.map +1 -1
  103. package/Dialog/Dialog.stories.js +26 -16
  104. package/Dialog/Dialog.stories.js.map +1 -1
  105. package/Dialog/index.js +18 -1
  106. package/Dialog/index.js.map +1 -1
  107. package/Drawer/Drawer.js +20 -6
  108. package/Drawer/Drawer.js.map +1 -1
  109. package/Drawer/Drawer.stories.js +26 -15
  110. package/Drawer/Drawer.stories.js.map +1 -1
  111. package/Drawer/index.js +18 -1
  112. package/Drawer/index.js.map +1 -1
  113. package/DynamicFieldset/Fieldset.js +56 -47
  114. package/DynamicFieldset/Fieldset.js.map +1 -1
  115. package/DynamicFieldset/index.js +15 -1
  116. package/DynamicFieldset/index.js.map +1 -1
  117. package/Elevation/Elevation.js +17 -6
  118. package/Elevation/Elevation.js.map +1 -1
  119. package/Elevation/Elevation.stories.js +27 -16
  120. package/Elevation/Elevation.stories.js.map +1 -1
  121. package/Elevation/index.js +18 -1
  122. package/Elevation/index.js.map +1 -1
  123. package/FormElementMessage/FormElementMessage.js +15 -5
  124. package/FormElementMessage/FormElementMessage.js.map +1 -1
  125. package/FormElementMessage/index.js +13 -1
  126. package/FormElementMessage/index.js.map +1 -1
  127. package/FullName/FullName.js +8 -1
  128. package/FullName/FullName.js.map +1 -1
  129. package/FullName/index.js +18 -1
  130. package/FullName/index.js.map +1 -1
  131. package/Grid/Grid.js +26 -9
  132. package/Grid/Grid.js.map +1 -1
  133. package/Grid/Grid.stories.js +21 -12
  134. package/Grid/Grid.stories.js.map +1 -1
  135. package/Grid/index.js +18 -1
  136. package/Grid/index.js.map +1 -1
  137. package/Helpers/ClassNames.js +16 -7
  138. package/Helpers/ClassNames.js.map +1 -1
  139. package/Helpers/index.js +13 -2
  140. package/Helpers/index.js.map +1 -1
  141. package/Icon/Icon.js +19 -7
  142. package/Icon/Icon.js.map +1 -1
  143. package/Icon/Icon.stories.js +33 -20
  144. package/Icon/Icon.stories.js.map +1 -1
  145. package/Icon/index.js +18 -1
  146. package/Icon/index.js.map +1 -1
  147. package/Image/Image.js +15 -7
  148. package/Image/Image.js.map +1 -1
  149. package/Image/Image.stories.js +21 -11
  150. package/Image/Image.stories.js.map +1 -1
  151. package/Image/index.js +18 -1
  152. package/Image/index.js.map +1 -1
  153. package/ImageEditor/ImageEditor.js +75 -65
  154. package/ImageEditor/ImageEditor.js.map +1 -1
  155. package/ImageEditor/index.js +18 -1
  156. package/ImageEditor/index.js.map +1 -1
  157. package/ImageEditor/toolbar/crop.js +30 -13
  158. package/ImageEditor/toolbar/crop.js.map +1 -1
  159. package/ImageEditor/toolbar/filter.js +61 -44
  160. package/ImageEditor/toolbar/filter.js.map +1 -1
  161. package/ImageEditor/toolbar/flip.js +32 -15
  162. package/ImageEditor/toolbar/flip.js.map +1 -1
  163. package/ImageEditor/toolbar/icons/index.js +69 -8
  164. package/ImageEditor/toolbar/icons/index.js.map +1 -1
  165. package/ImageEditor/toolbar/index.js +39 -4
  166. package/ImageEditor/toolbar/index.js.map +1 -1
  167. package/ImageEditor/toolbar/rotate.js +58 -35
  168. package/ImageEditor/toolbar/rotate.js.map +1 -1
  169. package/ImageEditor/toolbar/types.js +5 -1
  170. package/ImageEditor/toolbar/types.js.map +1 -1
  171. package/ImageUpload/Image.js +57 -35
  172. package/ImageUpload/Image.js.map +1 -1
  173. package/ImageUpload/ImageEditorDialog.js +48 -30
  174. package/ImageUpload/ImageEditorDialog.js.map +1 -1
  175. package/ImageUpload/MultiImageUpload.js +88 -70
  176. package/ImageUpload/MultiImageUpload.js.map +1 -1
  177. package/ImageUpload/MultiImageUpload.stories.js +26 -15
  178. package/ImageUpload/MultiImageUpload.stories.js.map +1 -1
  179. package/ImageUpload/SingleImageUpload.js +68 -45
  180. package/ImageUpload/SingleImageUpload.js.map +1 -1
  181. package/ImageUpload/SingleImageUpload.stories.js +27 -16
  182. package/ImageUpload/SingleImageUpload.stories.js.map +1 -1
  183. package/ImageUpload/index.js +39 -4
  184. package/ImageUpload/index.js.map +1 -1
  185. package/ImageUpload/styled.d.ts +2 -2
  186. package/ImageUpload/styled.js +29 -15
  187. package/ImageUpload/styled.js.map +1 -1
  188. package/Input/Input.js +52 -35
  189. package/Input/Input.js.map +1 -1
  190. package/Input/Input.stories.js +62 -46
  191. package/Input/Input.stories.js.map +1 -1
  192. package/Input/__tests__/Input.test.js +37 -26
  193. package/Input/__tests__/Input.test.js.map +1 -1
  194. package/Input/index.js +18 -1
  195. package/Input/index.js.map +1 -1
  196. package/List/CollapsibleList/CollapsibleList.stories.js +27 -16
  197. package/List/CollapsibleList/CollapsibleList.stories.js.map +1 -1
  198. package/List/CollapsibleList/index.js +21 -6
  199. package/List/CollapsibleList/index.js.map +1 -1
  200. package/List/DataList/DataList.js +89 -60
  201. package/List/DataList/DataList.js.map +1 -1
  202. package/List/DataList/DataList.stories.js +37 -25
  203. package/List/DataList/DataList.stories.js.map +1 -1
  204. package/List/DataList/DataListModalOverlay/DataListModalOverlay.js +29 -10
  205. package/List/DataList/DataListModalOverlay/DataListModalOverlay.js.map +1 -1
  206. package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js +27 -9
  207. package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js.map +1 -1
  208. package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js +24 -8
  209. package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js.map +1 -1
  210. package/List/DataList/DataListModalOverlay/index.js +35 -3
  211. package/List/DataList/DataListModalOverlay/index.js.map +1 -1
  212. package/List/DataList/Loader.js +25 -13
  213. package/List/DataList/Loader.js.map +1 -1
  214. package/List/DataList/NoData.js +19 -6
  215. package/List/DataList/NoData.js.map +1 -1
  216. package/List/DataList/icons/index.js +83 -38
  217. package/List/DataList/icons/index.js.map +1 -1
  218. package/List/DataList/index.js +48 -3
  219. package/List/DataList/index.js.map +1 -1
  220. package/List/DataList/types.js +5 -1
  221. package/List/DataList/types.js.map +1 -1
  222. package/List/List.js +92 -49
  223. package/List/List.js.map +1 -1
  224. package/List/List.stories.js +52 -37
  225. package/List/List.stories.js.map +1 -1
  226. package/List/icons/index.js +23 -3
  227. package/List/icons/index.js.map +1 -1
  228. package/List/index.js +60 -3
  229. package/List/index.js.map +1 -1
  230. package/Menu/Menu.js +58 -46
  231. package/Menu/Menu.js.map +1 -1
  232. package/Menu/Menu.stories.js +24 -14
  233. package/Menu/Menu.stories.js.map +1 -1
  234. package/Menu/index.js +18 -1
  235. package/Menu/index.js.map +1 -1
  236. package/Mosaic/Mosaic.js +16 -7
  237. package/Mosaic/Mosaic.js.map +1 -1
  238. package/Mosaic/Mosaic.stories.js +37 -28
  239. package/Mosaic/Mosaic.stories.js.map +1 -1
  240. package/Mosaic/index.js +18 -1
  241. package/Mosaic/index.js.map +1 -1
  242. package/Progress/CircularProgress.js +25 -11
  243. package/Progress/CircularProgress.js.map +1 -1
  244. package/Progress/index.js +15 -1
  245. package/Progress/index.js.map +1 -1
  246. package/Radio/Radio.js +37 -22
  247. package/Radio/Radio.js.map +1 -1
  248. package/Radio/Radio.styles.js +11 -4
  249. package/Radio/Radio.styles.js.map +1 -1
  250. package/Radio/RadioGroup.js +33 -19
  251. package/Radio/RadioGroup.js.map +1 -1
  252. package/Radio/RadioGroup.stories.js +29 -18
  253. package/Radio/RadioGroup.stories.js.map +1 -1
  254. package/Radio/index.js +23 -2
  255. package/Radio/index.js.map +1 -1
  256. package/RichTextEditor/RichTextEditor.js +56 -32
  257. package/RichTextEditor/RichTextEditor.js.map +1 -1
  258. package/RichTextEditor/RichTextEditor.stories.js +21 -10
  259. package/RichTextEditor/RichTextEditor.stories.js.map +1 -1
  260. package/RichTextEditor/createPropsFromConfig.js +15 -4
  261. package/RichTextEditor/createPropsFromConfig.js.map +1 -1
  262. package/RichTextEditor/index.js +30 -2
  263. package/RichTextEditor/index.js.map +1 -1
  264. package/Ripple/Ripple.js +16 -5
  265. package/Ripple/Ripple.js.map +1 -1
  266. package/Ripple/Ripple.stories.js +57 -42
  267. package/Ripple/Ripple.stories.js.map +1 -1
  268. package/Ripple/index.js +18 -1
  269. package/Ripple/index.js.map +1 -1
  270. package/Scrollbar/Scrollbar.js +14 -4
  271. package/Scrollbar/Scrollbar.js.map +1 -1
  272. package/Scrollbar/Scrollbar.stories.js +18 -9
  273. package/Scrollbar/Scrollbar.stories.js.map +1 -1
  274. package/Scrollbar/index.js +18 -1
  275. package/Scrollbar/index.js.map +1 -1
  276. package/Section/Section.stories.js +22 -12
  277. package/Section/Section.stories.js.map +1 -1
  278. package/Section/index.js +30 -15
  279. package/Section/index.js.map +1 -1
  280. package/Select/Select.js +37 -18
  281. package/Select/Select.js.map +1 -1
  282. package/Select/Select.stories.js +36 -25
  283. package/Select/Select.stories.js.map +1 -1
  284. package/Select/index.js +18 -1
  285. package/Select/index.js.map +1 -1
  286. package/Slider/Slider.js +43 -27
  287. package/Slider/Slider.js.map +1 -1
  288. package/Slider/Slider.stories.js +27 -16
  289. package/Slider/Slider.stories.js.map +1 -1
  290. package/Slider/index.js +15 -1
  291. package/Slider/index.js.map +1 -1
  292. package/Snackbar/Snackbar.js +38 -20
  293. package/Snackbar/Snackbar.js.map +1 -1
  294. package/Snackbar/Snackbar.stories.js +44 -30
  295. package/Snackbar/Snackbar.stories.js.map +1 -1
  296. package/Snackbar/index.js +19 -1
  297. package/Snackbar/index.js.map +1 -1
  298. package/Switch/Switch.js +43 -27
  299. package/Switch/Switch.js.map +1 -1
  300. package/Switch/Switch.stories.js +27 -16
  301. package/Switch/Switch.stories.js.map +1 -1
  302. package/Switch/index.js +18 -1
  303. package/Switch/index.js.map +1 -1
  304. package/Tabs/Tab.js +21 -7
  305. package/Tabs/Tab.js.map +1 -1
  306. package/Tabs/Tabs.js +49 -28
  307. package/Tabs/Tabs.js.map +1 -1
  308. package/Tabs/Tabs.stories.js +34 -22
  309. package/Tabs/Tabs.stories.js.map +1 -1
  310. package/Tabs/index.js +31 -2
  311. package/Tabs/index.js.map +1 -1
  312. package/Tags/Tags.js +64 -40
  313. package/Tags/Tags.js.map +1 -1
  314. package/Tags/Tags.stories.js +27 -16
  315. package/Tags/Tags.stories.js.map +1 -1
  316. package/Tags/index.js +18 -1
  317. package/Tags/index.js.map +1 -1
  318. package/Tooltip/Tooltip.js +38 -24
  319. package/Tooltip/Tooltip.js.map +1 -1
  320. package/Tooltip/Tooltip.stories.js +20 -11
  321. package/Tooltip/Tooltip.stories.js.map +1 -1
  322. package/Tooltip/index.js +18 -1
  323. package/Tooltip/index.js.map +1 -1
  324. package/TopAppBar/TopAppBar.js +18 -7
  325. package/TopAppBar/TopAppBar.js.map +1 -1
  326. package/TopAppBar/TopAppBar.stories.js +39 -25
  327. package/TopAppBar/TopAppBar.stories.js.map +1 -1
  328. package/TopAppBar/TopAppBarActionItem.js +14 -4
  329. package/TopAppBar/TopAppBarActionItem.js.map +1 -1
  330. package/TopAppBar/TopAppBarNavigationIcon.js +14 -4
  331. package/TopAppBar/TopAppBarNavigationIcon.js.map +1 -1
  332. package/TopAppBar/TopAppBarPrimary.js +18 -7
  333. package/TopAppBar/TopAppBarPrimary.js.map +1 -1
  334. package/TopAppBar/TopAppBarSecondary.js +18 -7
  335. package/TopAppBar/TopAppBarSecondary.js.map +1 -1
  336. package/TopAppBar/TopAppBarSection.js +18 -7
  337. package/TopAppBar/TopAppBarSection.js.map +1 -1
  338. package/TopAppBar/TopAppBarTitle.js +18 -7
  339. package/TopAppBar/TopAppBarTitle.js.map +1 -1
  340. package/TopAppBar/index.js +96 -7
  341. package/TopAppBar/index.js.map +1 -1
  342. package/TopProgressBar/TopProgressBar.js +20 -7
  343. package/TopProgressBar/TopProgressBar.js.map +1 -1
  344. package/TopProgressBar/TopProgressBar.stories.js +22 -12
  345. package/TopProgressBar/TopProgressBar.stories.js.map +1 -1
  346. package/TopProgressBar/hoc/index.js +15 -1
  347. package/TopProgressBar/hoc/index.js.map +1 -1
  348. package/TopProgressBar/hoc/withTopProgressBar.js +16 -5
  349. package/TopProgressBar/hoc/withTopProgressBar.js.map +1 -1
  350. package/TopProgressBar/index.js +18 -1
  351. package/TopProgressBar/index.js.map +1 -1
  352. package/Typography/Typography.js +14 -4
  353. package/Typography/Typography.js.map +1 -1
  354. package/Typography/Typography.stories.js +43 -34
  355. package/Typography/Typography.stories.js.map +1 -1
  356. package/Typography/index.js +18 -1
  357. package/Typography/index.js.map +1 -1
  358. package/package.json +9 -9
  359. package/types.js +5 -1
  360. package/types.js.map +1 -1
@@ -1,71 +1,86 @@
1
- import React from "react";
2
- import { storiesOf } from "@storybook/react";
3
- import { Story, StoryReadme, StorySandboxCode, StorySandbox, StorySandboxExample } from "@webiny/storybook-utils/Story";
4
- import readme from "./../Ripple/README.md";
5
- import { Icon } from "../Icon";
6
- import { withKnobs, boolean } from "@storybook/addon-knobs";
7
- import { ReactComponent as AutoRenewIcon } from "./svg/baseline-autorenew-24px.svg";
8
- import { ReactComponent as CloudDoneIcon } from "./svg/baseline-cloud_done-24px.svg";
9
- import { ReactComponent as BaselineDeleteIcon } from "./svg/baseline-delete-24px.svg";
10
- import { ReactComponent as BaselineDoneIcon } from "./svg/baseline-done-24px.svg";
11
- import { Ripple } from "./Ripple";
12
- var story = storiesOf("Components/Ripple", module);
13
- story.addDecorator(withKnobs);
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+
5
+ var _react = _interopRequireDefault(require("react"));
6
+
7
+ var _react2 = require("@storybook/react");
8
+
9
+ var _Story = require("@webiny/storybook-utils/Story");
10
+
11
+ var _README = _interopRequireDefault(require("./../Ripple/README.md"));
12
+
13
+ var _Icon = require("../Icon");
14
+
15
+ var _addonKnobs = require("@storybook/addon-knobs");
16
+
17
+ var _baselineAutorenew24px = require("./svg/baseline-autorenew-24px.svg");
18
+
19
+ var _baselineCloud_done24px = require("./svg/baseline-cloud_done-24px.svg");
20
+
21
+ var _baselineDelete24px = require("./svg/baseline-delete-24px.svg");
22
+
23
+ var _baselineDone24px = require("./svg/baseline-done-24px.svg");
24
+
25
+ var _Ripple = require("./Ripple");
26
+
27
+ var story = (0, _react2.storiesOf)("Components/Ripple", module);
28
+ story.addDecorator(_addonKnobs.withKnobs);
14
29
  story.add("usage", function () {
15
- var disabled = boolean("Disabled", false);
30
+ var disabled = (0, _addonKnobs.boolean)("Disabled", false);
16
31
  var style = {
17
32
  padding: 20,
18
33
  width: 20,
19
34
  height: 20,
20
35
  display: "inline-block"
21
36
  };
22
- return /*#__PURE__*/React.createElement(Story, null, /*#__PURE__*/React.createElement(StoryReadme, null, readme), /*#__PURE__*/React.createElement(StorySandbox, {
37
+ return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {
23
38
  title: "Icon with and without ripple"
24
- }, /*#__PURE__*/React.createElement(StorySandboxExample, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, "No effect"), /*#__PURE__*/React.createElement("div", {
39
+ }, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", null, "No effect"), /*#__PURE__*/_react.default.createElement("div", {
25
40
  style: style
26
- }, /*#__PURE__*/React.createElement(Icon, {
27
- icon: /*#__PURE__*/React.createElement(AutoRenewIcon, null)
28
- })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code", null, "unbounded")), /*#__PURE__*/React.createElement(Ripple, {
41
+ }, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
42
+ icon: /*#__PURE__*/_react.default.createElement(_baselineAutorenew24px.ReactComponent, null)
43
+ })), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("code", null, "unbounded")), /*#__PURE__*/_react.default.createElement(_Ripple.Ripple, {
29
44
  type: "unbounded",
30
45
  disabled: disabled
31
- }, /*#__PURE__*/React.createElement("div", {
46
+ }, /*#__PURE__*/_react.default.createElement("div", {
32
47
  style: style
33
- }, /*#__PURE__*/React.createElement(Icon, {
34
- icon: /*#__PURE__*/React.createElement(CloudDoneIcon, null)
35
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code", null, "primary")), /*#__PURE__*/React.createElement(Ripple, {
48
+ }, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
49
+ icon: /*#__PURE__*/_react.default.createElement(_baselineCloud_done24px.ReactComponent, null)
50
+ }))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("code", null, "primary")), /*#__PURE__*/_react.default.createElement(_Ripple.Ripple, {
36
51
  type: "primary",
37
52
  disabled: disabled
38
- }, /*#__PURE__*/React.createElement("div", {
53
+ }, /*#__PURE__*/_react.default.createElement("div", {
39
54
  style: style
40
- }, /*#__PURE__*/React.createElement(Icon, {
41
- icon: /*#__PURE__*/React.createElement(BaselineDeleteIcon, null)
42
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code", null, "accent")), /*#__PURE__*/React.createElement(Ripple, {
55
+ }, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
56
+ icon: /*#__PURE__*/_react.default.createElement(_baselineDelete24px.ReactComponent, null)
57
+ }))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("code", null, "accent")), /*#__PURE__*/_react.default.createElement(_Ripple.Ripple, {
43
58
  type: "accent",
44
59
  disabled: disabled
45
- }, /*#__PURE__*/React.createElement("div", {
60
+ }, /*#__PURE__*/_react.default.createElement("div", {
46
61
  style: style
47
- }, /*#__PURE__*/React.createElement(Icon, {
48
- icon: /*#__PURE__*/React.createElement(BaselineDoneIcon, null)
49
- }))))), /*#__PURE__*/React.createElement(StorySandboxCode, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Icon, {
50
- icon: /*#__PURE__*/React.createElement(AutoRenewIcon, null)
51
- })), /*#__PURE__*/React.createElement(Ripple, {
62
+ }, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
63
+ icon: /*#__PURE__*/_react.default.createElement(_baselineDone24px.ReactComponent, null)
64
+ }))))), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
65
+ icon: /*#__PURE__*/_react.default.createElement(_baselineAutorenew24px.ReactComponent, null)
66
+ })), /*#__PURE__*/_react.default.createElement(_Ripple.Ripple, {
52
67
  type: "unbounded",
53
68
  disabled: disabled
54
- }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Icon, {
55
- icon: /*#__PURE__*/React.createElement(CloudDoneIcon, null)
56
- }))), /*#__PURE__*/React.createElement(Ripple, {
69
+ }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
70
+ icon: /*#__PURE__*/_react.default.createElement(_baselineCloud_done24px.ReactComponent, null)
71
+ }))), /*#__PURE__*/_react.default.createElement(_Ripple.Ripple, {
57
72
  type: "primary",
58
73
  disabled: disabled
59
- }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Icon, {
60
- icon: /*#__PURE__*/React.createElement(BaselineDeleteIcon, null)
61
- }))), /*#__PURE__*/React.createElement(Ripple, {
74
+ }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
75
+ icon: /*#__PURE__*/_react.default.createElement(_baselineDelete24px.ReactComponent, null)
76
+ }))), /*#__PURE__*/_react.default.createElement(_Ripple.Ripple, {
62
77
  type: "accent",
63
78
  disabled: disabled
64
- }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Icon, {
65
- icon: /*#__PURE__*/React.createElement(BaselineDoneIcon, null)
79
+ }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
80
+ icon: /*#__PURE__*/_react.default.createElement(_baselineDone24px.ReactComponent, null)
66
81
  })))))));
67
82
  }, {
68
83
  info: {
69
- propTables: [Ripple]
84
+ propTables: [_Ripple.Ripple]
70
85
  }
71
86
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["Ripple.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","readme","Icon","withKnobs","boolean","ReactComponent","AutoRenewIcon","CloudDoneIcon","BaselineDeleteIcon","BaselineDoneIcon","Ripple","story","module","addDecorator","add","disabled","style","padding","width","height","display","info","propTables"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Ripple/README.md\";\nimport { Icon } from \"~/Icon\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\n\nimport { ReactComponent as AutoRenewIcon } from \"./svg/baseline-autorenew-24px.svg\";\nimport { ReactComponent as CloudDoneIcon } from \"./svg/baseline-cloud_done-24px.svg\";\nimport { ReactComponent as BaselineDeleteIcon } from \"./svg/baseline-delete-24px.svg\";\nimport { ReactComponent as BaselineDoneIcon } from \"./svg/baseline-done-24px.svg\";\n\nimport { Ripple } from \"./Ripple\";\n\nconst story = storiesOf(\"Components/Ripple\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n const style = { padding: 20, width: 20, height: 20, display: \"inline-block\" };\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox title={\"Icon with and without ripple\"}>\n <StorySandboxExample>\n <div>\n <div>No effect</div>\n <div style={style}>\n <Icon icon={<AutoRenewIcon />} />\n </div>\n\n <div>\n <code>unbounded</code>\n </div>\n <Ripple type=\"unbounded\" disabled={disabled}>\n <div style={style}>\n <Icon icon={<CloudDoneIcon />} />\n </div>\n </Ripple>\n\n <div>\n <code>primary</code>\n </div>\n <Ripple type=\"primary\" disabled={disabled}>\n <div style={style}>\n <Icon icon={<BaselineDeleteIcon />} />\n </div>\n </Ripple>\n\n <div>\n <code>accent</code>\n </div>\n <Ripple type=\"accent\" disabled={disabled}>\n <div style={style}>\n <Icon icon={<BaselineDoneIcon />} />\n </div>\n </Ripple>\n </div>\n </StorySandboxExample>\n <StorySandboxCode>\n <div>\n <div>\n <Icon icon={<AutoRenewIcon />} />\n </div>\n\n <Ripple type=\"unbounded\" disabled={disabled}>\n <div>\n <Icon icon={<CloudDoneIcon />} />\n </div>\n </Ripple>\n\n <Ripple type=\"primary\" disabled={disabled}>\n <div>\n <Icon icon={<BaselineDeleteIcon />} />\n </div>\n </Ripple>\n\n <Ripple type=\"accent\" disabled={disabled}>\n <div>\n <Icon icon={<BaselineDoneIcon />} />\n </div>\n </Ripple>\n </div>\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Ripple] } }\n);\n"]}
1
+ {"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","style","padding","width","height","display","readme","info","propTables","Ripple"],"sources":["Ripple.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Ripple/README.md\";\nimport { Icon } from \"~/Icon\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\n\nimport { ReactComponent as AutoRenewIcon } from \"./svg/baseline-autorenew-24px.svg\";\nimport { ReactComponent as CloudDoneIcon } from \"./svg/baseline-cloud_done-24px.svg\";\nimport { ReactComponent as BaselineDeleteIcon } from \"./svg/baseline-delete-24px.svg\";\nimport { ReactComponent as BaselineDoneIcon } from \"./svg/baseline-done-24px.svg\";\n\nimport { Ripple } from \"./Ripple\";\n\nconst story = storiesOf(\"Components/Ripple\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n const style = { padding: 20, width: 20, height: 20, display: \"inline-block\" };\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox title={\"Icon with and without ripple\"}>\n <StorySandboxExample>\n <div>\n <div>No effect</div>\n <div style={style}>\n <Icon icon={<AutoRenewIcon />} />\n </div>\n\n <div>\n <code>unbounded</code>\n </div>\n <Ripple type=\"unbounded\" disabled={disabled}>\n <div style={style}>\n <Icon icon={<CloudDoneIcon />} />\n </div>\n </Ripple>\n\n <div>\n <code>primary</code>\n </div>\n <Ripple type=\"primary\" disabled={disabled}>\n <div style={style}>\n <Icon icon={<BaselineDeleteIcon />} />\n </div>\n </Ripple>\n\n <div>\n <code>accent</code>\n </div>\n <Ripple type=\"accent\" disabled={disabled}>\n <div style={style}>\n <Icon icon={<BaselineDoneIcon />} />\n </div>\n </Ripple>\n </div>\n </StorySandboxExample>\n <StorySandboxCode>\n <div>\n <div>\n <Icon icon={<AutoRenewIcon />} />\n </div>\n\n <Ripple type=\"unbounded\" disabled={disabled}>\n <div>\n <Icon icon={<CloudDoneIcon />} />\n </div>\n </Ripple>\n\n <Ripple type=\"primary\" disabled={disabled}>\n <div>\n <Icon icon={<BaselineDeleteIcon />} />\n </div>\n </Ripple>\n\n <Ripple type=\"accent\" disabled={disabled}>\n <div>\n <Icon icon={<BaselineDoneIcon />} />\n </div>\n </Ripple>\n </div>\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Ripple] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAOA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAEA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,mBAAV,EAA+BC,MAA/B,CAAd;AACAF,KAAK,CAACG,YAAN,CAAmBC,qBAAnB;AAEAJ,KAAK,CAACK,GAAN,CACI,OADJ,EAEI,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAA,EAAQ,UAAR,EAAoB,KAApB,CAAjB;EAEA,IAAMC,KAAK,GAAG;IAAEC,OAAO,EAAE,EAAX;IAAeC,KAAK,EAAE,EAAtB;IAA0BC,MAAM,EAAE,EAAlC;IAAsCC,OAAO,EAAE;EAA/C,CAAd;EAEA,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD;IAAc,KAAK,EAAE;EAArB,gBACI,6BAAC,0BAAD,qBACI,uDACI,sDADJ,eAEI;IAAK,KAAK,EAAEL;EAAZ,gBACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,qCAAD;EAAZ,EADJ,CAFJ,eAMI,uDACI,uDADJ,CANJ,eASI,6BAAC,cAAD;IAAQ,IAAI,EAAC,WAAb;IAAyB,QAAQ,EAAEF;EAAnC,gBACI;IAAK,KAAK,EAAEE;EAAZ,gBACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,sCAAD;EAAZ,EADJ,CADJ,CATJ,eAeI,uDACI,qDADJ,CAfJ,eAkBI,6BAAC,cAAD;IAAQ,IAAI,EAAC,SAAb;IAAuB,QAAQ,EAAEF;EAAjC,gBACI;IAAK,KAAK,EAAEE;EAAZ,gBACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,kCAAD;EAAZ,EADJ,CADJ,CAlBJ,eAwBI,uDACI,oDADJ,CAxBJ,eA2BI,6BAAC,cAAD;IAAQ,IAAI,EAAC,QAAb;IAAsB,QAAQ,EAAEF;EAAhC,gBACI;IAAK,KAAK,EAAEE;EAAZ,gBACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,gCAAD;EAAZ,EADJ,CADJ,CA3BJ,CADJ,CADJ,eAoCI,6BAAC,uBAAD,qBACI,uDACI,uDACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,qCAAD;EAAZ,EADJ,CADJ,eAKI,6BAAC,cAAD;IAAQ,IAAI,EAAC,WAAb;IAAyB,QAAQ,EAAEF;EAAnC,gBACI,uDACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,sCAAD;EAAZ,EADJ,CADJ,CALJ,eAWI,6BAAC,cAAD;IAAQ,IAAI,EAAC,SAAb;IAAuB,QAAQ,EAAEA;EAAjC,gBACI,uDACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,kCAAD;EAAZ,EADJ,CADJ,CAXJ,eAiBI,6BAAC,cAAD;IAAQ,IAAI,EAAC,QAAb;IAAsB,QAAQ,EAAEA;EAAhC,gBACI,uDACI,6BAAC,UAAD;IAAM,IAAI,eAAE,6BAAC,gCAAD;EAAZ,EADJ,CADJ,CAjBJ,CADJ,CApCJ,CAFJ,CADJ;AAmEH,CA1EL,EA2EI;EAAEQ,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,cAAD;EAAd;AAAR,CA3EJ"}
package/Ripple/index.js CHANGED
@@ -1 +1,18 @@
1
- export * from "./Ripple";
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+
7
+ var _Ripple = require("./Ripple");
8
+
9
+ Object.keys(_Ripple).forEach(function (key) {
10
+ if (key === "default" || key === "__esModule") return;
11
+ if (key in exports && exports[key] === _Ripple[key]) return;
12
+ Object.defineProperty(exports, key, {
13
+ enumerable: true,
14
+ get: function get() {
15
+ return _Ripple[key];
16
+ }
17
+ });
18
+ });
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from \"./Ripple\";\n"]}
1
+ {"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Ripple\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
@@ -1,11 +1,21 @@
1
- import React from "react";
2
- import { Scrollbars } from "react-custom-scrollbars";
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.Scrollbar = void 0;
9
+
10
+ var _react = _interopRequireDefault(require("react"));
11
+
12
+ var _reactCustomScrollbars = require("react-custom-scrollbars");
3
13
 
4
14
  /**
5
15
  * Use Scrollbar component to show vertical or horizontal scrollbars.
6
16
  */
7
17
  var Scrollbar = function Scrollbar(props) {
8
- return /*#__PURE__*/React.createElement(Scrollbars, props);
18
+ return /*#__PURE__*/_react.default.createElement(_reactCustomScrollbars.Scrollbars, props);
9
19
  };
10
20
 
11
- export { Scrollbar };
21
+ exports.Scrollbar = Scrollbar;
@@ -1 +1 @@
1
- {"version":3,"sources":["Scrollbar.tsx"],"names":["React","Scrollbars","Scrollbar","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAyBC,UAAzB,QAA2C,yBAA3C;;AAOA;AACA;AACA;AACA,IAAMC,SAA0B,GAAG,SAA7BA,SAA6B,CAAAC,KAAK,EAAI;AACxC,sBAAO,oBAAC,UAAD,EAAgBA,KAAhB,CAAP;AACH,CAFD;;AAIA,SAASD,SAAT","sourcesContent":["import React from \"react\";\nimport { ScrollbarProps, Scrollbars } from \"react-custom-scrollbars\";\n\ninterface Props extends ScrollbarProps {\n style?: React.CSSProperties;\n [key: string]: any;\n}\n\n/**\n * Use Scrollbar component to show vertical or horizontal scrollbars.\n */\nconst Scrollbar: React.FC<Props> = props => {\n return <Scrollbars {...props} />;\n};\n\nexport { Scrollbar };\n"]}
1
+ {"version":3,"names":["Scrollbar","props"],"sources":["Scrollbar.tsx"],"sourcesContent":["import React from \"react\";\nimport { ScrollbarProps, Scrollbars } from \"react-custom-scrollbars\";\n\ninterface Props extends ScrollbarProps {\n style?: React.CSSProperties;\n [key: string]: any;\n}\n\n/**\n * Use Scrollbar component to show vertical or horizontal scrollbars.\n */\nconst Scrollbar: React.FC<Props> = props => {\n return <Scrollbars {...props} />;\n};\n\nexport { Scrollbar };\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAOA;AACA;AACA;AACA,IAAMA,SAA0B,GAAG,SAA7BA,SAA6B,CAAAC,KAAK,EAAI;EACxC,oBAAO,6BAAC,iCAAD,EAAgBA,KAAhB,CAAP;AACH,CAFD"}
@@ -1,13 +1,22 @@
1
- import React from "react";
2
- import { storiesOf } from "@storybook/react";
3
- import { Story, StoryReadme, StorySandbox } from "@webiny/storybook-utils/Story";
4
- import readme from "./../Scrollbar/README.md";
5
- import { Scrollbar } from "./Scrollbar";
6
- var story = storiesOf("Components/Scrollbar", module);
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+
5
+ var _react = _interopRequireDefault(require("react"));
6
+
7
+ var _react2 = require("@storybook/react");
8
+
9
+ var _Story = require("@webiny/storybook-utils/Story");
10
+
11
+ var _README = _interopRequireDefault(require("./../Scrollbar/README.md"));
12
+
13
+ var _Scrollbar = require("./Scrollbar");
14
+
15
+ var story = (0, _react2.storiesOf)("Components/Scrollbar", module);
7
16
  story.add("usage", function () {
8
- return /*#__PURE__*/React.createElement(Story, null, /*#__PURE__*/React.createElement(StoryReadme, null, readme), /*#__PURE__*/React.createElement(StorySandbox, {
17
+ return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {
9
18
  title: "Scrollbar demo"
10
- }, /*#__PURE__*/React.createElement(Scrollbar, {
19
+ }, /*#__PURE__*/_react.default.createElement(_Scrollbar.Scrollbar, {
11
20
  style: {
12
21
  width: 300,
13
22
  height: 200
@@ -15,6 +24,6 @@ story.add("usage", function () {
15
24
  }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lorem leo, aliquam aliquet arcu vel, faucibus feugiat est. Nulla facilisi. Donec lobortis metus dictum sem egestas, non lobortis erat suscipit. Nunc fermentum tempor nisi, nec venenatis odio egestas at. Nulla facilisi. Fusce sed venenatis velit, ac rhoncus ligula. Integer hendrerit egestas ante, tristique posuere augue auctor non. Curabitur accumsan, ipsum cursus euismod volutpat, enim ligula interdum diam, id suscipit ipsum lectus id ligula. Ut nec odio vel lacus volutpat commodo. In hac habitasse platea dictumst. Donec nunc lacus, venenatis non tellus vel, semper porta quam. Ut fermentum mattis urna non imperdiet. Fusce tincidunt enim nec tincidunt dapibus. Aliquam eu ligula quis ligula pretium tincidunt non sit amet velit. Curabitur vel interdum enim, ut molestie ligula.")));
16
25
  }, {
17
26
  info: {
18
- propTables: [Scrollbar]
27
+ propTables: [_Scrollbar.Scrollbar]
19
28
  }
20
29
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["Scrollbar.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandbox","readme","Scrollbar","story","module","add","width","height","info","propTables"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SAASC,KAAT,EAAgBC,WAAhB,EAA6BC,YAA7B,QAAiD,+BAAjD;AACA,OAAOC,MAAP;AACA,SAASC,SAAT;AAEA,IAAMC,KAAK,GAAGN,SAAS,CAAC,sBAAD,EAAyBO,MAAzB,CAAvB;AAEAD,KAAK,CAACE,GAAN,CACI,OADJ,EAEI,YAAM;AACF,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcJ,MAAd,CADJ,eAEI,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAE;AAArB,kBACI,oBAAC,SAAD;AAAW,IAAA,KAAK,EAAE;AAAEK,MAAAA,KAAK,EAAE,GAAT;AAAcC,MAAAA,MAAM,EAAE;AAAtB;AAAlB,u1BADJ,CAFJ,CADJ;AAqBH,CAxBL,EAyBI;AAAEC,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACP,SAAD;AAAd;AAAR,CAzBJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Scrollbar/README.md\";\nimport { Scrollbar } from \"./Scrollbar\";\n\nconst story = storiesOf(\"Components/Scrollbar\", module);\n\nstory.add(\n \"usage\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox title={\"Scrollbar demo\"}>\n <Scrollbar style={{ width: 300, height: 200 }}>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lorem leo,\n aliquam aliquet arcu vel, faucibus feugiat est. Nulla facilisi. Donec\n lobortis metus dictum sem egestas, non lobortis erat suscipit. Nunc\n fermentum tempor nisi, nec venenatis odio egestas at. Nulla facilisi. Fusce\n sed venenatis velit, ac rhoncus ligula. Integer hendrerit egestas ante,\n tristique posuere augue auctor non. Curabitur accumsan, ipsum cursus euismod\n volutpat, enim ligula interdum diam, id suscipit ipsum lectus id ligula. Ut\n nec odio vel lacus volutpat commodo. In hac habitasse platea dictumst. Donec\n nunc lacus, venenatis non tellus vel, semper porta quam. Ut fermentum mattis\n urna non imperdiet. Fusce tincidunt enim nec tincidunt dapibus. Aliquam eu\n ligula quis ligula pretium tincidunt non sit amet velit. Curabitur vel\n interdum enim, ut molestie ligula.\n </Scrollbar>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Scrollbar] } }\n);\n"]}
1
+ {"version":3,"names":["story","storiesOf","module","add","readme","width","height","info","propTables","Scrollbar"],"sources":["Scrollbar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Scrollbar/README.md\";\nimport { Scrollbar } from \"./Scrollbar\";\n\nconst story = storiesOf(\"Components/Scrollbar\", module);\n\nstory.add(\n \"usage\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox title={\"Scrollbar demo\"}>\n <Scrollbar style={{ width: 300, height: 200 }}>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lorem leo,\n aliquam aliquet arcu vel, faucibus feugiat est. Nulla facilisi. Donec\n lobortis metus dictum sem egestas, non lobortis erat suscipit. Nunc\n fermentum tempor nisi, nec venenatis odio egestas at. Nulla facilisi. Fusce\n sed venenatis velit, ac rhoncus ligula. Integer hendrerit egestas ante,\n tristique posuere augue auctor non. Curabitur accumsan, ipsum cursus euismod\n volutpat, enim ligula interdum diam, id suscipit ipsum lectus id ligula. Ut\n nec odio vel lacus volutpat commodo. In hac habitasse platea dictumst. Donec\n nunc lacus, venenatis non tellus vel, semper porta quam. Ut fermentum mattis\n urna non imperdiet. Fusce tincidunt enim nec tincidunt dapibus. Aliquam eu\n ligula quis ligula pretium tincidunt non sit amet velit. Curabitur vel\n interdum enim, ut molestie ligula.\n </Scrollbar>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Scrollbar] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,sBAAV,EAAkCC,MAAlC,CAAd;AAEAF,KAAK,CAACG,GAAN,CACI,OADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD;IAAc,KAAK,EAAE;EAArB,gBACI,6BAAC,oBAAD;IAAW,KAAK,EAAE;MAAEC,KAAK,EAAE,GAAT;MAAcC,MAAM,EAAE;IAAtB;EAAlB,q1BADJ,CAFJ,CADJ;AAqBH,CAxBL,EAyBI;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,oBAAD;EAAd;AAAR,CAzBJ"}
@@ -1 +1,18 @@
1
- export * from "./Scrollbar";
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+
7
+ var _Scrollbar = require("./Scrollbar");
8
+
9
+ Object.keys(_Scrollbar).forEach(function (key) {
10
+ if (key === "default" || key === "__esModule") return;
11
+ if (key in exports && exports[key] === _Scrollbar[key]) return;
12
+ Object.defineProperty(exports, key, {
13
+ enumerable: true,
14
+ get: function get() {
15
+ return _Scrollbar[key];
16
+ }
17
+ });
18
+ });
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from \"./Scrollbar\";\n"]}
1
+ {"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Scrollbar\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
@@ -1,11 +1,21 @@
1
- import React from "react";
2
- import { storiesOf } from "@storybook/react";
3
- import { Story, StoryReadme, StorySandboxCode, StorySandbox, StorySandboxExample } from "@webiny/storybook-utils/Story";
4
- import readme from "./README.md";
5
- import Section from "./index";
6
- import styled from "@emotion/styled";
7
- var story = storiesOf("Components/Section", module);
8
- var RenderSection = /*#__PURE__*/styled("div", {
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+
5
+ var _react = _interopRequireDefault(require("react"));
6
+
7
+ var _react2 = require("@storybook/react");
8
+
9
+ var _Story = require("@webiny/storybook-utils/Story");
10
+
11
+ var _README = _interopRequireDefault(require("./README.md"));
12
+
13
+ var _index = _interopRequireDefault(require("./index"));
14
+
15
+ var _styled = _interopRequireDefault(require("@emotion/styled"));
16
+
17
+ var story = (0, _react2.storiesOf)("Components/Section", module);
18
+ var RenderSection = /*#__PURE__*/(0, _styled.default)("div", {
9
19
  target: "e1mp9e2d0",
10
20
  label: "RenderSection"
11
21
  })({
@@ -13,13 +23,13 @@ var RenderSection = /*#__PURE__*/styled("div", {
13
23
  padding: "1px 25px 0 25px"
14
24
  });
15
25
  story.add("usage", function () {
16
- return /*#__PURE__*/React.createElement(Story, null, /*#__PURE__*/React.createElement(StoryReadme, null, readme), /*#__PURE__*/React.createElement(StorySandbox, null, /*#__PURE__*/React.createElement(StorySandboxExample, null, /*#__PURE__*/React.createElement(RenderSection, null, /*#__PURE__*/React.createElement(Section, {
26
+ return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, null, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, null, /*#__PURE__*/_react.default.createElement(RenderSection, null, /*#__PURE__*/_react.default.createElement(_index.default, {
17
27
  title: "Section 1"
18
- }, "Here goes the first section"), /*#__PURE__*/React.createElement(Section, {
28
+ }, "Here goes the first section"), /*#__PURE__*/_react.default.createElement(_index.default, {
19
29
  title: "Section 2"
20
- }, "And this is the second section \uD83E\uDD84"))), /*#__PURE__*/React.createElement(StorySandboxCode, null, "\n import styled from \"@emotion/styled\";\n \n const RenderSection = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"1px 25px 0 25px\"\n });\n\n <RenderSection>\n <Section title=\"Section 1\">Here goes the first section</Section>\n <Section title=\"Section 2\">And this is the second section \uD83E\uDD84</Section>\n </RenderSection>\n ")));
30
+ }, "And this is the second section \uD83E\uDD84"))), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, "\n import styled from \"@emotion/styled\";\n \n const RenderSection = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"1px 25px 0 25px\"\n });\n\n <RenderSection>\n <Section title=\"Section 1\">Here goes the first section</Section>\n <Section title=\"Section 2\">And this is the second section \uD83E\uDD84</Section>\n </RenderSection>\n ")));
21
31
  }, {
22
32
  info: {
23
- propTables: [Section]
33
+ propTables: [_index.default]
24
34
  }
25
35
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["Section.stories.tsx"],"names":["React","storiesOf","Story","StoryReadme","StorySandboxCode","StorySandbox","StorySandboxExample","readme","Section","styled","story","module","RenderSection","backgroundColor","padding","add","info","propTables"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SACIC,KADJ,EAEIC,WAFJ,EAGIC,gBAHJ,EAIIC,YAJJ,EAKIC,mBALJ,QAMO,+BANP;AAOA,OAAOC,MAAP;AAEA,OAAOC,OAAP;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AAEA,IAAMC,KAAK,GAAGT,SAAS,CAAC,oBAAD,EAAuBU,MAAvB,CAAvB;AAEA,IAAMC,aAAa,gBAAGH,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AAChCI,EAAAA,eAAe,EAAE,6BADe;AAEhCC,EAAAA,OAAO,EAAE;AAFuB,CAAjB,CAAnB;AAKAJ,KAAK,CAACK,GAAN,CACI,OADJ,EAEI,YAAM;AACF,sBACI,oBAAC,KAAD,qBACI,oBAAC,WAAD,QAAcR,MAAd,CADJ,eAEI,oBAAC,YAAD,qBACI,oBAAC,mBAAD,qBACI,oBAAC,aAAD,qBACI,oBAAC,OAAD;AAAS,IAAA,KAAK,EAAC;AAAf,mCADJ,eAEI,oBAAC,OAAD;AAAS,IAAA,KAAK,EAAC;AAAf,mDAFJ,CADJ,CADJ,eAOI,oBAAC,gBAAD,yoBAPJ,CAFJ,CADJ;AA4BH,CA/BL,EAgCI;AAAES,EAAAA,IAAI,EAAE;AAAEC,IAAAA,UAAU,EAAE,CAACT,OAAD;AAAd;AAAR,CAhCJ","sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./README.md\";\n\nimport Section from \"./index\";\nimport styled from \"@emotion/styled\";\n\nconst story = storiesOf(\"Components/Section\", module);\n\nconst RenderSection = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"1px 25px 0 25px\"\n});\n\nstory.add(\n \"usage\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample>\n <RenderSection>\n <Section title=\"Section 1\">Here goes the first section</Section>\n <Section title=\"Section 2\">And this is the second section 🦄</Section>\n </RenderSection>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n import styled from \"@emotion/styled\";\n \n const RenderSection = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"1px 25px 0 25px\"\n });\n\n <RenderSection>\n <Section title=\"Section 1\">Here goes the first section</Section>\n <Section title=\"Section 2\">And this is the second section 🦄</Section>\n </RenderSection>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Section] } }\n);\n"]}
1
+ {"version":3,"names":["story","storiesOf","module","RenderSection","styled","backgroundColor","padding","add","readme","info","propTables","Section"],"sources":["Section.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./README.md\";\n\nimport Section from \"./index\";\nimport styled from \"@emotion/styled\";\n\nconst story = storiesOf(\"Components/Section\", module);\n\nconst RenderSection = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"1px 25px 0 25px\"\n});\n\nstory.add(\n \"usage\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample>\n <RenderSection>\n <Section title=\"Section 1\">Here goes the first section</Section>\n <Section title=\"Section 2\">And this is the second section 🦄</Section>\n </RenderSection>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n import styled from \"@emotion/styled\";\n \n const RenderSection = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"1px 25px 0 25px\"\n });\n\n <RenderSection>\n <Section title=\"Section 1\">Here goes the first section</Section>\n <Section title=\"Section 2\">And this is the second section 🦄</Section>\n </RenderSection>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Section] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAOA;;AAEA;;AACA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,oBAAV,EAAgCC,MAAhC,CAAd;AAEA,IAAMC,aAAa,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAChCC,eAAe,EAAE,6BADe;EAEhCC,OAAO,EAAE;AAFuB,CAAjB,CAAnB;AAKAN,KAAK,CAACO,GAAN,CACI,OADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD,qBACI,6BAAC,0BAAD,qBACI,6BAAC,aAAD,qBACI,6BAAC,cAAD;IAAS,KAAK,EAAC;EAAf,iCADJ,eAEI,6BAAC,cAAD;IAAS,KAAK,EAAC;EAAf,iDAFJ,CADJ,CADJ,eAOI,6BAAC,uBAAD,yoBAPJ,CAFJ,CADJ;AA4BH,CA/BL,EAgCI;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,cAAD;EAAd;AAAR,CAhCJ"}
package/Section/index.js CHANGED
@@ -1,18 +1,33 @@
1
- import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+
10
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
11
+
12
+ var _react = _interopRequireDefault(require("react"));
13
+
14
+ var _styled = _interopRequireDefault(require("@emotion/styled"));
15
+
16
+ var _emotion = require("emotion");
17
+
18
+ var _Typography = require("../Typography");
19
+
20
+ var _Elevation = require("../Elevation");
21
+
2
22
  var _excluded = ["children", "title"];
3
- import React from "react";
4
- import styled from "@emotion/styled";
5
- import { css } from "emotion";
6
- import { Typography } from "../Typography";
7
- import { Elevation } from "../Elevation";
8
- var SectionWrapper = /*#__PURE__*/styled("div", {
23
+ var SectionWrapper = /*#__PURE__*/(0, _styled.default)("div", {
9
24
  target: "e12inb750",
10
25
  label: "SectionWrapper"
11
26
  })({
12
27
  backgroundColor: "var(--mdc-theme-background)",
13
28
  padding: "0 0 25px 0"
14
29
  });
15
- var titleStyle = /*#__PURE__*/css({
30
+ var titleStyle = /*#__PURE__*/(0, _emotion.css)({
16
31
  display: "flex",
17
32
  alignItems: "center",
18
33
  color: "var(--mdc-theme-on-surface)",
@@ -24,7 +39,7 @@ var titleStyle = /*#__PURE__*/css({
24
39
  }
25
40
  }
26
41
  }, "label:titleStyle;");
27
- var ElevationContent = /*#__PURE__*/styled("div", {
42
+ var ElevationContent = /*#__PURE__*/(0, _styled.default)("div", {
28
43
  target: "e12inb751",
29
44
  label: "ElevationContent"
30
45
  })({
@@ -35,14 +50,14 @@ var ElevationContent = /*#__PURE__*/styled("div", {
35
50
  var Section = function Section(_ref) {
36
51
  var children = _ref.children,
37
52
  title = _ref.title,
38
- props = _objectWithoutProperties(_ref, _excluded);
39
-
40
- return /*#__PURE__*/React.createElement(SectionWrapper, props, /*#__PURE__*/React.createElement("h4", null, /*#__PURE__*/React.createElement(Typography, {
53
+ props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
54
+ return /*#__PURE__*/_react.default.createElement(SectionWrapper, props, /*#__PURE__*/_react.default.createElement("h4", null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
41
55
  className: titleStyle,
42
56
  use: "overline"
43
- }, title)), /*#__PURE__*/React.createElement(Elevation, {
57
+ }, title)), /*#__PURE__*/_react.default.createElement(_Elevation.Elevation, {
44
58
  z: 2
45
- }, /*#__PURE__*/React.createElement(ElevationContent, null, children)));
59
+ }, /*#__PURE__*/_react.default.createElement(ElevationContent, null, children)));
46
60
  };
47
61
 
48
- export default Section;
62
+ var _default = Section;
63
+ exports.default = _default;
@@ -1 +1 @@
1
- {"version":3,"sources":["index.tsx"],"names":["React","styled","css","Typography","Elevation","SectionWrapper","backgroundColor","padding","titleStyle","display","alignItems","color","lineHeight","svg","height","ElevationContent","Section","children","title","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,SAASC,UAAT;AACA,SAASC,SAAT;AAEA,IAAMC,cAAc,gBAAGJ,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACjCK,EAAAA,eAAe,EAAE,6BADgB;AAEjCC,EAAAA,OAAO,EAAE;AAFwB,CAAjB,CAApB;AAKA,IAAMC,UAAU,gBAAGN,GAAG,CAAC;AACnBO,EAAAA,OAAO,EAAE,MADU;AAEnBC,EAAAA,UAAU,EAAE,QAFO;AAGnBC,EAAAA,KAAK,EAAE,6BAHY;AAInB,8BAA4B;AACxBC,IAAAA,UAAU,EAAE,MADY;AAExBC,IAAAA,GAAG,EAAE;AACDC,MAAAA,MAAM,EAAE,EADP;AAEDH,MAAAA,KAAK,EAAE;AAFN;AAFmB;AAJT,CAAD,sBAAtB;AAaA,IAAMI,gBAAgB,gBAAGd,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACnCM,EAAAA,OAAO,EAAE,EAD0B;AAEnCD,EAAAA,eAAe,EAAE;AAFkB,CAAjB,CAAtB;;AASA,IAAMU,OAA+B,GAAG,SAAlCA,OAAkC,OAAmC;AAAA,MAAhCC,QAAgC,QAAhCA,QAAgC;AAAA,MAAtBC,KAAsB,QAAtBA,KAAsB;AAAA,MAAZC,KAAY;;AACvE,sBACI,oBAAC,cAAD,EAAoBA,KAApB,eACI,6CACI,oBAAC,UAAD;AAAY,IAAA,SAAS,EAAEX,UAAvB;AAAmC,IAAA,GAAG,EAAE;AAAxC,KACKU,KADL,CADJ,CADJ,eAOI,oBAAC,SAAD;AAAW,IAAA,CAAC,EAAE;AAAd,kBACI,oBAAC,gBAAD,QAAmBD,QAAnB,CADJ,CAPJ,CADJ;AAaH,CAdD;;AAgBA,eAAeD,OAAf","sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { Typography } from \"~/Typography\";\nimport { Elevation } from \"~/Elevation\";\n\nconst SectionWrapper = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"0 0 25px 0\"\n});\n\nconst titleStyle = css({\n display: \"flex\",\n alignItems: \"center\",\n color: \"var(--mdc-theme-on-surface)\",\n \".tooltip-content-wrapper\": {\n lineHeight: \"100%\",\n svg: {\n height: 13,\n color: \"var(--mdc-theme-on-surface)\"\n }\n }\n});\n\nconst ElevationContent = styled(\"div\")({\n padding: 20,\n backgroundColor: \"#fff\"\n});\n\ninterface SectionProps {\n title?: String;\n}\n\nconst Section: React.FC<SectionProps> = ({ children, title, ...props }) => {\n return (\n <SectionWrapper {...props}>\n <h4>\n <Typography className={titleStyle} use={\"overline\"}>\n {title}\n </Typography>\n </h4>\n\n <Elevation z={2}>\n <ElevationContent>{children}</ElevationContent>\n </Elevation>\n </SectionWrapper>\n );\n};\n\nexport default Section;\n"]}
1
+ {"version":3,"names":["SectionWrapper","styled","backgroundColor","padding","titleStyle","css","display","alignItems","color","lineHeight","svg","height","ElevationContent","Section","children","title","props"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { Typography } from \"~/Typography\";\nimport { Elevation } from \"~/Elevation\";\n\nconst SectionWrapper = styled(\"div\")({\n backgroundColor: \"var(--mdc-theme-background)\",\n padding: \"0 0 25px 0\"\n});\n\nconst titleStyle = css({\n display: \"flex\",\n alignItems: \"center\",\n color: \"var(--mdc-theme-on-surface)\",\n \".tooltip-content-wrapper\": {\n lineHeight: \"100%\",\n svg: {\n height: 13,\n color: \"var(--mdc-theme-on-surface)\"\n }\n }\n});\n\nconst ElevationContent = styled(\"div\")({\n padding: 20,\n backgroundColor: \"#fff\"\n});\n\ninterface SectionProps {\n title?: String;\n}\n\nconst Section: React.FC<SectionProps> = ({ children, title, ...props }) => {\n return (\n <SectionWrapper {...props}>\n <h4>\n <Typography className={titleStyle} use={\"overline\"}>\n {title}\n </Typography>\n </h4>\n\n <Elevation z={2}>\n <ElevationContent>{children}</ElevationContent>\n </Elevation>\n </SectionWrapper>\n );\n};\n\nexport default Section;\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;AAEA,IAAMA,cAAc,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACjCC,eAAe,EAAE,6BADgB;EAEjCC,OAAO,EAAE;AAFwB,CAAjB,CAApB;AAKA,IAAMC,UAAU,gBAAG,IAAAC,YAAA,EAAI;EACnBC,OAAO,EAAE,MADU;EAEnBC,UAAU,EAAE,QAFO;EAGnBC,KAAK,EAAE,6BAHY;EAInB,4BAA4B;IACxBC,UAAU,EAAE,MADY;IAExBC,GAAG,EAAE;MACDC,MAAM,EAAE,EADP;MAEDH,KAAK,EAAE;IAFN;EAFmB;AAJT,CAAJ,sBAAnB;AAaA,IAAMI,gBAAgB,oBAAGX,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACnCE,OAAO,EAAE,EAD0B;EAEnCD,eAAe,EAAE;AAFkB,CAAjB,CAAtB;;AASA,IAAMW,OAA+B,GAAG,SAAlCA,OAAkC,OAAmC;EAAA,IAAhCC,QAAgC,QAAhCA,QAAgC;EAAA,IAAtBC,KAAsB,QAAtBA,KAAsB;EAAA,IAAZC,KAAY;EACvE,oBACI,6BAAC,cAAD,EAAoBA,KAApB,eACI,sDACI,6BAAC,sBAAD;IAAY,SAAS,EAAEZ,UAAvB;IAAmC,GAAG,EAAE;EAAxC,GACKW,KADL,CADJ,CADJ,eAOI,6BAAC,oBAAD;IAAW,CAAC,EAAE;EAAd,gBACI,6BAAC,gBAAD,QAAmBD,QAAnB,CADJ,CAPJ,CADJ;AAaH,CAdD;;eAgBeD,O"}
package/Select/Select.js CHANGED
@@ -1,13 +1,30 @@
1
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = exports.Select = void 0;
9
+
10
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
+
12
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
13
+
14
+ var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
15
+
16
+ var _react = _interopRequireDefault(require("react"));
17
+
18
+ var _select = require("@rmwc/select");
19
+
20
+ var _FormElementMessage = require("../FormElementMessage");
21
+
22
+ var _emotion = require("emotion");
23
+
24
+ var _classnames = _interopRequireDefault(require("classnames"));
25
+
4
26
  var _excluded = ["value", "description", "validation"];
5
- import React from "react";
6
- import { Select as RmwcSelect } from "@rmwc/select";
7
- import { FormElementMessage } from "../FormElementMessage";
8
- import { css } from "emotion";
9
- import classNames from "classnames";
10
- var noLabel = /*#__PURE__*/css({
27
+ var noLabel = /*#__PURE__*/(0, _emotion.css)({
11
28
  "&.mdc-select": {
12
29
  height: 35,
13
30
  ".mdc-select__native-control": {
@@ -31,7 +48,7 @@ var getOptions = function getOptions(initialOptions) {
31
48
  } else if (Array.isArray(initialOptions)) {
32
49
  var options = [];
33
50
 
34
- var _iterator = _createForOfIteratorHelper(initialOptions),
51
+ var _iterator = (0, _createForOfIteratorHelper2.default)(initialOptions),
35
52
  _step;
36
53
 
37
54
  try {
@@ -91,12 +108,11 @@ var getRmwcProps = function getRmwcProps(props) {
91
108
  */
92
109
 
93
110
 
94
- export var Select = function Select(props) {
111
+ var Select = function Select(props) {
95
112
  var initialValue = props.value,
96
113
  description = props.description,
97
114
  validation = props.validation,
98
- other = _objectWithoutProperties(props, _excluded);
99
-
115
+ other = (0, _objectWithoutProperties2.default)(props, _excluded);
100
116
  var value = initialValue === null || initialValue === undefined ? "" : initialValue;
101
117
 
102
118
  var _ref = validation || {},
@@ -104,15 +120,18 @@ export var Select = function Select(props) {
104
120
  validationMessage = _ref.message;
105
121
 
106
122
  var options = getOptions(other.options);
107
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(RmwcSelect, Object.assign({}, getRmwcProps(other), {
123
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_select.Select, Object.assign({}, getRmwcProps(other), {
108
124
  options: options,
109
125
  value: value,
110
- className: classNames("webiny-ui-select", props.className, _defineProperty({}, noLabel, !props.label)),
126
+ className: (0, _classnames.default)("webiny-ui-select", props.className, (0, _defineProperty2.default)({}, noLabel, !props.label)),
111
127
  onChange: function onChange(e) {
112
128
  props.onChange && props.onChange(e.target.value);
113
129
  }
114
- })), validationIsValid === false && /*#__PURE__*/React.createElement(FormElementMessage, {
130
+ })), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
115
131
  error: true
116
- }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/React.createElement(FormElementMessage, null, description));
132
+ }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
117
133
  };
118
- export default Select;
134
+
135
+ exports.Select = Select;
136
+ var _default = Select;
137
+ exports.default = _default;
@@ -1 +1 @@
1
- {"version":3,"sources":["Select.tsx"],"names":["React","Select","RmwcSelect","FormElementMessage","css","classNames","noLabel","height","paddingTop","getOptions","initialOptions","Array","isArray","options","option","push","label","value","Object","keys","map","key","skipProps","getRmwcProps","props","newProps","filter","name","includes","forEach","initialValue","description","validation","other","undefined","validationIsValid","isValid","validationMessage","message","className","e","onChange","target"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport {\n FormattedOption,\n Select as RmwcSelect,\n SelectProps as RmwcSelectProps\n} from \"@rmwc/select\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { FormComponentProps } from \"~/types\";\nimport { css } from \"emotion\";\nimport classNames from \"classnames\";\n\nexport type SelectProps = FormComponentProps &\n RmwcSelectProps & {\n // Component label.\n label?: string;\n\n // Is checkbox disabled?\n disabled?: boolean;\n\n // Description beneath the select.\n description?: string;\n\n // Placeholder text for the form control. Set to a blank string to create a non-floating placeholder label.\n placeholder?: string;\n\n // Makes the Select have a visual box.\n box?: string;\n\n // One or more <option> or <optgroup> elements.\n children?: Array<React.ReactElement<\"option\"> | React.ReactElement<\"optgroup\">>;\n\n // IconProps for the root element. By default, additional props spread to the native select element.\n rootProps?: Object;\n\n // A className for the root element.\n className?: string;\n };\n\nconst noLabel = css({\n \"&.mdc-select\": {\n height: 35,\n \".mdc-select__native-control\": {\n paddingTop: 0\n },\n \"&.mdc-select--box\": {\n \".mdc-select__native-control\": {\n height: 35,\n paddingTop: 5\n }\n }\n }\n});\n/**\n * TODO verify that this is correct method get all options.\n */\nconst getOptions = (initialOptions: SelectProps[\"options\"]): FormattedOption[] => {\n if (!initialOptions) {\n return [];\n } else if (Array.isArray(initialOptions)) {\n const options: FormattedOption[] = [];\n for (const option of initialOptions) {\n if (typeof option === \"string\") {\n options.push({\n label: option,\n value: option\n });\n continue;\n }\n options.push({\n label: option.label,\n value: option.value,\n options: option.options\n });\n }\n return options;\n }\n return Object.keys(initialOptions).map(key => {\n return {\n label: initialOptions[key],\n value: key\n };\n });\n};\n\n/**\n * Select component lets users choose a value from given set of options.\n */\nconst skipProps = [\"validate\", \"form\"];\n\nconst getRmwcProps = (props: SelectProps): FormComponentProps & RmwcSelectProps => {\n const newProps: FormComponentProps & RmwcSelectProps = {};\n Object.keys(props)\n .filter(name => !skipProps.includes(name))\n // @ts-ignore\n .forEach((name: any) => (newProps[name] = props[name]));\n\n return newProps;\n};\n/**\n * We check for null and undefined in the value because React is complaining about those values.\n * Error says to use the empty string in null/undefined case.\n */\nexport const Select: React.FC<SelectProps> = props => {\n const { value: initialValue, description, validation, ...other } = props;\n\n const value = initialValue === null || initialValue === undefined ? \"\" : initialValue;\n\n const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n const options = getOptions(other.options);\n\n return (\n <React.Fragment>\n <RmwcSelect\n {...getRmwcProps(other)}\n options={options}\n value={value}\n className={classNames(\"webiny-ui-select\", props.className, {\n [noLabel]: !props.label\n })}\n onChange={e => {\n props.onChange && props.onChange((e.target as any).value);\n }}\n />\n\n {validationIsValid === false && (\n <FormElementMessage error>{validationMessage}</FormElementMessage>\n )}\n\n {validationIsValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n};\n\nexport default Select;\n"]}
1
+ {"version":3,"names":["noLabel","css","height","paddingTop","getOptions","initialOptions","Array","isArray","options","option","push","label","value","Object","keys","map","key","skipProps","getRmwcProps","props","newProps","filter","name","includes","forEach","Select","initialValue","description","validation","other","undefined","validationIsValid","isValid","validationMessage","message","classNames","className","e","onChange","target"],"sources":["Select.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n FormattedOption,\n Select as RmwcSelect,\n SelectProps as RmwcSelectProps\n} from \"@rmwc/select\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { FormComponentProps } from \"~/types\";\nimport { css } from \"emotion\";\nimport classNames from \"classnames\";\n\nexport type SelectProps = FormComponentProps &\n RmwcSelectProps & {\n // Component label.\n label?: string;\n\n // Is checkbox disabled?\n disabled?: boolean;\n\n // Description beneath the select.\n description?: string;\n\n // Placeholder text for the form control. Set to a blank string to create a non-floating placeholder label.\n placeholder?: string;\n\n // Makes the Select have a visual box.\n box?: string;\n\n // One or more <option> or <optgroup> elements.\n children?: Array<React.ReactElement<\"option\"> | React.ReactElement<\"optgroup\">>;\n\n // IconProps for the root element. By default, additional props spread to the native select element.\n rootProps?: Object;\n\n // A className for the root element.\n className?: string;\n };\n\nconst noLabel = css({\n \"&.mdc-select\": {\n height: 35,\n \".mdc-select__native-control\": {\n paddingTop: 0\n },\n \"&.mdc-select--box\": {\n \".mdc-select__native-control\": {\n height: 35,\n paddingTop: 5\n }\n }\n }\n});\n/**\n * TODO verify that this is correct method get all options.\n */\nconst getOptions = (initialOptions: SelectProps[\"options\"]): FormattedOption[] => {\n if (!initialOptions) {\n return [];\n } else if (Array.isArray(initialOptions)) {\n const options: FormattedOption[] = [];\n for (const option of initialOptions) {\n if (typeof option === \"string\") {\n options.push({\n label: option,\n value: option\n });\n continue;\n }\n options.push({\n label: option.label,\n value: option.value,\n options: option.options\n });\n }\n return options;\n }\n return Object.keys(initialOptions).map(key => {\n return {\n label: initialOptions[key],\n value: key\n };\n });\n};\n\n/**\n * Select component lets users choose a value from given set of options.\n */\nconst skipProps = [\"validate\", \"form\"];\n\nconst getRmwcProps = (props: SelectProps): FormComponentProps & RmwcSelectProps => {\n const newProps: FormComponentProps & RmwcSelectProps = {};\n Object.keys(props)\n .filter(name => !skipProps.includes(name))\n // @ts-ignore\n .forEach((name: any) => (newProps[name] = props[name]));\n\n return newProps;\n};\n/**\n * We check for null and undefined in the value because React is complaining about those values.\n * Error says to use the empty string in null/undefined case.\n */\nexport const Select: React.FC<SelectProps> = props => {\n const { value: initialValue, description, validation, ...other } = props;\n\n const value = initialValue === null || initialValue === undefined ? \"\" : initialValue;\n\n const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n const options = getOptions(other.options);\n\n return (\n <React.Fragment>\n <RmwcSelect\n {...getRmwcProps(other)}\n options={options}\n value={value}\n className={classNames(\"webiny-ui-select\", props.className, {\n [noLabel]: !props.label\n })}\n onChange={e => {\n props.onChange && props.onChange((e.target as any).value);\n }}\n />\n\n {validationIsValid === false && (\n <FormElementMessage error>{validationMessage}</FormElementMessage>\n )}\n\n {validationIsValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n};\n\nexport default Select;\n"],"mappings":"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"}