@webiny/ui 5.27.0 → 5.28.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.
- package/Accordion/Accordion.js +27 -13
- package/Accordion/Accordion.js.map +1 -1
- package/Accordion/Accordion.stories.js +34 -23
- package/Accordion/Accordion.stories.js.map +1 -1
- package/Accordion/AccordionItem.js +60 -36
- package/Accordion/AccordionItem.js.map +1 -1
- package/Accordion/index.js +31 -2
- package/Accordion/index.js.map +1 -1
- package/Alert/Alert.js +21 -10
- package/Alert/Alert.js.map +1 -1
- package/Alert/Alert.stories.js +22 -13
- package/Alert/Alert.stories.js.map +1 -1
- package/Alert/index.js +18 -1
- package/Alert/index.js.map +1 -1
- package/AutoComplete/AutoComplete.js +100 -77
- package/AutoComplete/AutoComplete.js.map +1 -1
- package/AutoComplete/AutoComplete.stories.js +27 -17
- package/AutoComplete/AutoComplete.stories.js.map +1 -1
- package/AutoComplete/MultiAutoComplete.js +164 -139
- package/AutoComplete/MultiAutoComplete.js.map +1 -1
- package/AutoComplete/MultiAutoComplete.stories.js +39 -28
- package/AutoComplete/MultiAutoComplete.stories.js.map +1 -1
- package/AutoComplete/index.js +31 -2
- package/AutoComplete/index.js.map +1 -1
- package/AutoComplete/styles.js +14 -4
- package/AutoComplete/styles.js.map +1 -1
- package/AutoComplete/types.js +5 -1
- package/AutoComplete/types.js.map +1 -1
- package/AutoComplete/utils.js +19 -4
- package/AutoComplete/utils.js.map +1 -1
- package/Avatar/Avatar.js +30 -15
- package/Avatar/Avatar.js.map +1 -1
- package/Avatar/Avatar.stories.js +19 -10
- package/Avatar/Avatar.stories.js.map +1 -1
- package/Avatar/index.js +18 -1
- package/Avatar/index.js.map +1 -1
- package/Button/Button.js +52 -23
- package/Button/Button.js.map +1 -1
- package/Button/Button.stories.js +42 -29
- package/Button/Button.stories.js.map +1 -1
- package/Button/CopyButton/CopyButton.js +24 -11
- package/Button/CopyButton/CopyButton.js.map +1 -1
- package/Button/CopyButton/CopyButton.stories.js +20 -10
- package/Button/CopyButton/CopyButton.stories.js.map +1 -1
- package/Button/IconButton/IconButton.js +14 -4
- package/Button/IconButton/IconButton.js.map +1 -1
- package/Button/IconButton/IconButton.stories.js +31 -19
- package/Button/IconButton/IconButton.stories.js.map +1 -1
- package/Button/index.js +44 -3
- package/Button/index.js.map +1 -1
- package/Carousel/Carousel.js +34 -21
- package/Carousel/Carousel.js.map +1 -1
- package/Carousel/Carouser.stories.js +27 -17
- package/Carousel/Carouser.stories.js.map +1 -1
- package/Carousel/index.js +15 -1
- package/Carousel/index.js.map +1 -1
- package/Checkbox/Checkbox.js +37 -22
- package/Checkbox/Checkbox.js.map +1 -1
- package/Checkbox/Checkbox.stories.js +27 -16
- package/Checkbox/Checkbox.stories.js.map +1 -1
- package/Checkbox/Checkbox.styles.js +11 -4
- package/Checkbox/Checkbox.styles.js.map +1 -1
- package/Checkbox/CheckboxGroup.js +36 -21
- package/Checkbox/CheckboxGroup.js.map +1 -1
- package/Checkbox/CheckboxGroup.stories.js +29 -18
- package/Checkbox/CheckboxGroup.stories.js.map +1 -1
- package/Checkbox/index.js +23 -2
- package/Checkbox/index.js.map +1 -1
- package/Chips/Chip.js +21 -7
- package/Chips/Chip.js.map +1 -1
- package/Chips/ChipIcon.js +21 -7
- package/Chips/ChipIcon.js.map +1 -1
- package/Chips/Chips.js +29 -12
- package/Chips/Chips.js.map +1 -1
- package/Chips/Chips.stories.js +27 -16
- package/Chips/Chips.stories.js.map +1 -1
- package/Chips/index.js +44 -3
- package/Chips/index.js.map +1 -1
- package/Chips/styles.js +14 -4
- package/Chips/styles.js.map +1 -1
- package/CodeEditor/CodeEditor.js +48 -29
- package/CodeEditor/CodeEditor.js.map +1 -1
- package/CodeEditor/CodeEditor.stories.js +30 -17
- package/CodeEditor/CodeEditor.stories.js.map +1 -1
- package/CodeEditor/index.js +18 -1
- package/CodeEditor/index.js.map +1 -1
- package/ColorPicker/ColorPicker.js +58 -44
- package/ColorPicker/ColorPicker.js.map +1 -1
- package/ColorPicker/ColorPicker.stories.js +26 -15
- package/ColorPicker/ColorPicker.stories.js.map +1 -1
- package/ColorPicker/index.js +18 -1
- package/ColorPicker/index.js.map +1 -1
- package/ConfirmationDialog/ConfirmationDialog.js +51 -42
- package/ConfirmationDialog/ConfirmationDialog.js.map +1 -1
- package/ConfirmationDialog/ConfirmationDialog.stories.js +22 -12
- package/ConfirmationDialog/ConfirmationDialog.stories.js.map +1 -1
- package/ConfirmationDialog/index.js +31 -2
- package/ConfirmationDialog/index.js.map +1 -1
- package/ConfirmationDialog/withConfirmation.js +19 -6
- package/ConfirmationDialog/withConfirmation.js.map +1 -1
- package/Dialog/Dialog.js +68 -37
- package/Dialog/Dialog.js.map +1 -1
- package/Dialog/Dialog.stories.js +26 -16
- package/Dialog/Dialog.stories.js.map +1 -1
- package/Dialog/index.js +18 -1
- package/Dialog/index.js.map +1 -1
- package/Drawer/Drawer.js +20 -6
- package/Drawer/Drawer.js.map +1 -1
- package/Drawer/Drawer.stories.js +26 -15
- package/Drawer/Drawer.stories.js.map +1 -1
- package/Drawer/index.js +18 -1
- package/Drawer/index.js.map +1 -1
- package/DynamicFieldset/Fieldset.js +56 -47
- package/DynamicFieldset/Fieldset.js.map +1 -1
- package/DynamicFieldset/index.js +15 -1
- package/DynamicFieldset/index.js.map +1 -1
- package/Elevation/Elevation.js +17 -6
- package/Elevation/Elevation.js.map +1 -1
- package/Elevation/Elevation.stories.js +27 -16
- package/Elevation/Elevation.stories.js.map +1 -1
- package/Elevation/index.js +18 -1
- package/Elevation/index.js.map +1 -1
- package/FormElementMessage/FormElementMessage.js +15 -5
- package/FormElementMessage/FormElementMessage.js.map +1 -1
- package/FormElementMessage/index.js +13 -1
- package/FormElementMessage/index.js.map +1 -1
- package/FullName/FullName.js +8 -1
- package/FullName/FullName.js.map +1 -1
- package/FullName/index.js +18 -1
- package/FullName/index.js.map +1 -1
- package/Grid/Grid.js +26 -9
- package/Grid/Grid.js.map +1 -1
- package/Grid/Grid.stories.js +21 -12
- package/Grid/Grid.stories.js.map +1 -1
- package/Grid/index.js +18 -1
- package/Grid/index.js.map +1 -1
- package/Helpers/ClassNames.js +16 -7
- package/Helpers/ClassNames.js.map +1 -1
- package/Helpers/index.js +13 -2
- package/Helpers/index.js.map +1 -1
- package/Icon/Icon.js +19 -7
- package/Icon/Icon.js.map +1 -1
- package/Icon/Icon.stories.js +33 -20
- package/Icon/Icon.stories.js.map +1 -1
- package/Icon/index.js +18 -1
- package/Icon/index.js.map +1 -1
- package/Image/Image.js +15 -7
- package/Image/Image.js.map +1 -1
- package/Image/Image.stories.js +21 -11
- package/Image/Image.stories.js.map +1 -1
- package/Image/index.js +18 -1
- package/Image/index.js.map +1 -1
- package/ImageEditor/ImageEditor.js +75 -65
- package/ImageEditor/ImageEditor.js.map +1 -1
- package/ImageEditor/index.js +18 -1
- package/ImageEditor/index.js.map +1 -1
- package/ImageEditor/toolbar/crop.js +30 -13
- package/ImageEditor/toolbar/crop.js.map +1 -1
- package/ImageEditor/toolbar/filter.js +61 -44
- package/ImageEditor/toolbar/filter.js.map +1 -1
- package/ImageEditor/toolbar/flip.js +32 -15
- package/ImageEditor/toolbar/flip.js.map +1 -1
- package/ImageEditor/toolbar/icons/index.js +69 -8
- package/ImageEditor/toolbar/icons/index.js.map +1 -1
- package/ImageEditor/toolbar/index.js +39 -4
- package/ImageEditor/toolbar/index.js.map +1 -1
- package/ImageEditor/toolbar/rotate.js +58 -35
- package/ImageEditor/toolbar/rotate.js.map +1 -1
- package/ImageEditor/toolbar/types.js +5 -1
- package/ImageEditor/toolbar/types.js.map +1 -1
- package/ImageUpload/Image.js +57 -35
- package/ImageUpload/Image.js.map +1 -1
- package/ImageUpload/ImageEditorDialog.js +48 -30
- package/ImageUpload/ImageEditorDialog.js.map +1 -1
- package/ImageUpload/MultiImageUpload.js +88 -70
- package/ImageUpload/MultiImageUpload.js.map +1 -1
- package/ImageUpload/MultiImageUpload.stories.js +26 -15
- package/ImageUpload/MultiImageUpload.stories.js.map +1 -1
- package/ImageUpload/SingleImageUpload.js +68 -45
- package/ImageUpload/SingleImageUpload.js.map +1 -1
- package/ImageUpload/SingleImageUpload.stories.js +27 -16
- package/ImageUpload/SingleImageUpload.stories.js.map +1 -1
- package/ImageUpload/index.js +39 -4
- package/ImageUpload/index.js.map +1 -1
- package/ImageUpload/styled.d.ts +2 -2
- package/ImageUpload/styled.js +29 -15
- package/ImageUpload/styled.js.map +1 -1
- package/Input/Input.js +52 -35
- package/Input/Input.js.map +1 -1
- package/Input/Input.stories.js +62 -46
- package/Input/Input.stories.js.map +1 -1
- package/Input/__tests__/Input.test.js +37 -26
- package/Input/__tests__/Input.test.js.map +1 -1
- package/Input/index.js +18 -1
- package/Input/index.js.map +1 -1
- package/List/CollapsibleList/CollapsibleList.stories.js +27 -16
- package/List/CollapsibleList/CollapsibleList.stories.js.map +1 -1
- package/List/CollapsibleList/index.js +21 -6
- package/List/CollapsibleList/index.js.map +1 -1
- package/List/DataList/DataList.js +89 -60
- package/List/DataList/DataList.js.map +1 -1
- package/List/DataList/DataList.stories.js +37 -25
- package/List/DataList/DataList.stories.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js +29 -10
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js +27 -9
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js +24 -8
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js.map +1 -1
- package/List/DataList/DataListModalOverlay/index.js +35 -3
- package/List/DataList/DataListModalOverlay/index.js.map +1 -1
- package/List/DataList/Loader.js +25 -13
- package/List/DataList/Loader.js.map +1 -1
- package/List/DataList/NoData.js +19 -6
- package/List/DataList/NoData.js.map +1 -1
- package/List/DataList/icons/index.js +83 -38
- package/List/DataList/icons/index.js.map +1 -1
- package/List/DataList/index.js +48 -3
- package/List/DataList/index.js.map +1 -1
- package/List/DataList/types.js +5 -1
- package/List/DataList/types.js.map +1 -1
- package/List/List.js +92 -49
- package/List/List.js.map +1 -1
- package/List/List.stories.js +52 -37
- package/List/List.stories.js.map +1 -1
- package/List/icons/index.js +23 -3
- package/List/icons/index.js.map +1 -1
- package/List/index.js +60 -3
- package/List/index.js.map +1 -1
- package/Menu/Menu.js +58 -46
- package/Menu/Menu.js.map +1 -1
- package/Menu/Menu.stories.js +24 -14
- package/Menu/Menu.stories.js.map +1 -1
- package/Menu/index.js +18 -1
- package/Menu/index.js.map +1 -1
- package/Mosaic/Mosaic.js +16 -7
- package/Mosaic/Mosaic.js.map +1 -1
- package/Mosaic/Mosaic.stories.js +37 -28
- package/Mosaic/Mosaic.stories.js.map +1 -1
- package/Mosaic/index.js +18 -1
- package/Mosaic/index.js.map +1 -1
- package/Progress/CircularProgress.js +25 -11
- package/Progress/CircularProgress.js.map +1 -1
- package/Progress/index.js +15 -1
- package/Progress/index.js.map +1 -1
- package/Radio/Radio.js +37 -22
- package/Radio/Radio.js.map +1 -1
- package/Radio/Radio.styles.js +11 -4
- package/Radio/Radio.styles.js.map +1 -1
- package/Radio/RadioGroup.js +33 -19
- package/Radio/RadioGroup.js.map +1 -1
- package/Radio/RadioGroup.stories.js +29 -18
- package/Radio/RadioGroup.stories.js.map +1 -1
- package/Radio/index.js +23 -2
- package/Radio/index.js.map +1 -1
- package/RichTextEditor/RichTextEditor.js +56 -32
- package/RichTextEditor/RichTextEditor.js.map +1 -1
- package/RichTextEditor/RichTextEditor.stories.js +21 -10
- package/RichTextEditor/RichTextEditor.stories.js.map +1 -1
- package/RichTextEditor/createPropsFromConfig.js +15 -4
- package/RichTextEditor/createPropsFromConfig.js.map +1 -1
- package/RichTextEditor/index.js +30 -2
- package/RichTextEditor/index.js.map +1 -1
- package/Ripple/Ripple.js +16 -5
- package/Ripple/Ripple.js.map +1 -1
- package/Ripple/Ripple.stories.js +57 -42
- package/Ripple/Ripple.stories.js.map +1 -1
- package/Ripple/index.js +18 -1
- package/Ripple/index.js.map +1 -1
- package/Scrollbar/Scrollbar.js +14 -4
- package/Scrollbar/Scrollbar.js.map +1 -1
- package/Scrollbar/Scrollbar.stories.js +18 -9
- package/Scrollbar/Scrollbar.stories.js.map +1 -1
- package/Scrollbar/index.js +18 -1
- package/Scrollbar/index.js.map +1 -1
- package/Section/Section.stories.js +22 -12
- package/Section/Section.stories.js.map +1 -1
- package/Section/index.js +30 -15
- package/Section/index.js.map +1 -1
- package/Select/Select.js +37 -18
- package/Select/Select.js.map +1 -1
- package/Select/Select.stories.js +36 -25
- package/Select/Select.stories.js.map +1 -1
- package/Select/index.js +18 -1
- package/Select/index.js.map +1 -1
- package/Slider/Slider.js +43 -27
- package/Slider/Slider.js.map +1 -1
- package/Slider/Slider.stories.js +27 -16
- package/Slider/Slider.stories.js.map +1 -1
- package/Slider/index.js +15 -1
- package/Slider/index.js.map +1 -1
- package/Snackbar/Snackbar.js +38 -20
- package/Snackbar/Snackbar.js.map +1 -1
- package/Snackbar/Snackbar.stories.js +44 -30
- package/Snackbar/Snackbar.stories.js.map +1 -1
- package/Snackbar/index.js +19 -1
- package/Snackbar/index.js.map +1 -1
- package/Switch/Switch.js +43 -27
- package/Switch/Switch.js.map +1 -1
- package/Switch/Switch.stories.js +27 -16
- package/Switch/Switch.stories.js.map +1 -1
- package/Switch/index.js +18 -1
- package/Switch/index.js.map +1 -1
- package/Tabs/Tab.js +21 -7
- package/Tabs/Tab.js.map +1 -1
- package/Tabs/Tabs.js +49 -28
- package/Tabs/Tabs.js.map +1 -1
- package/Tabs/Tabs.stories.js +34 -22
- package/Tabs/Tabs.stories.js.map +1 -1
- package/Tabs/index.js +31 -2
- package/Tabs/index.js.map +1 -1
- package/Tags/Tags.js +64 -40
- package/Tags/Tags.js.map +1 -1
- package/Tags/Tags.stories.js +27 -16
- package/Tags/Tags.stories.js.map +1 -1
- package/Tags/index.js +18 -1
- package/Tags/index.js.map +1 -1
- package/Tooltip/Tooltip.js +38 -24
- package/Tooltip/Tooltip.js.map +1 -1
- package/Tooltip/Tooltip.stories.js +20 -11
- package/Tooltip/Tooltip.stories.js.map +1 -1
- package/Tooltip/index.js +18 -1
- package/Tooltip/index.js.map +1 -1
- package/TopAppBar/TopAppBar.js +18 -7
- package/TopAppBar/TopAppBar.js.map +1 -1
- package/TopAppBar/TopAppBar.stories.js +39 -25
- package/TopAppBar/TopAppBar.stories.js.map +1 -1
- package/TopAppBar/TopAppBarActionItem.js +14 -4
- package/TopAppBar/TopAppBarActionItem.js.map +1 -1
- package/TopAppBar/TopAppBarNavigationIcon.js +14 -4
- package/TopAppBar/TopAppBarNavigationIcon.js.map +1 -1
- package/TopAppBar/TopAppBarPrimary.js +18 -7
- package/TopAppBar/TopAppBarPrimary.js.map +1 -1
- package/TopAppBar/TopAppBarSecondary.js +18 -7
- package/TopAppBar/TopAppBarSecondary.js.map +1 -1
- package/TopAppBar/TopAppBarSection.js +18 -7
- package/TopAppBar/TopAppBarSection.js.map +1 -1
- package/TopAppBar/TopAppBarTitle.js +18 -7
- package/TopAppBar/TopAppBarTitle.js.map +1 -1
- package/TopAppBar/index.js +96 -7
- package/TopAppBar/index.js.map +1 -1
- package/TopProgressBar/TopProgressBar.js +20 -7
- package/TopProgressBar/TopProgressBar.js.map +1 -1
- package/TopProgressBar/TopProgressBar.stories.js +22 -12
- package/TopProgressBar/TopProgressBar.stories.js.map +1 -1
- package/TopProgressBar/hoc/index.js +15 -1
- package/TopProgressBar/hoc/index.js.map +1 -1
- package/TopProgressBar/hoc/withTopProgressBar.js +16 -5
- package/TopProgressBar/hoc/withTopProgressBar.js.map +1 -1
- package/TopProgressBar/index.js +18 -1
- package/TopProgressBar/index.js.map +1 -1
- package/Typography/Typography.js +14 -4
- package/Typography/Typography.js.map +1 -1
- package/Typography/Typography.stories.js +43 -34
- package/Typography/Typography.stories.js.map +1 -1
- package/Typography/index.js +18 -1
- package/Typography/index.js.map +1 -1
- package/package.json +8 -8
- package/types.js +5 -1
- package/types.js.map +1 -1
|
@@ -1,18 +1,28 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var
|
|
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 = require("./../../Menu/index");
|
|
14
|
+
|
|
15
|
+
var _CopyButton = require("./CopyButton");
|
|
16
|
+
|
|
17
|
+
var story = (0, _react2.storiesOf)("Components/Button", module);
|
|
8
18
|
story.add("copy button", function () {
|
|
9
|
-
return /*#__PURE__*/
|
|
19
|
+
return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {
|
|
10
20
|
title: "Copy button"
|
|
11
|
-
}, /*#__PURE__*/
|
|
21
|
+
}, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", null, "Click the button to copy the \"Hello\" value:"), /*#__PURE__*/_react.default.createElement(_CopyButton.CopyButton, {
|
|
12
22
|
value: "Hello"
|
|
13
23
|
}))));
|
|
14
24
|
}, {
|
|
15
25
|
info: {
|
|
16
|
-
propTablesExclude: [Menu, MenuItem, Story, StoryReadme, StorySandbox]
|
|
26
|
+
propTablesExclude: [_index.Menu, _index.MenuItem, _Story.Story, _Story.StoryReadme, _Story.StorySandbox]
|
|
17
27
|
}
|
|
18
28
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","add","readme","info","propTablesExclude","Menu","MenuItem","Story","StoryReadme","StorySandbox"],"sources":["CopyButton.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./README.md\";\nimport { Menu, MenuItem } from \"./../../Menu/index\";\n\nimport { CopyButton } from \"./CopyButton\";\n\nconst story = storiesOf(\"Components/Button\", module);\n\nstory.add(\n \"copy button\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox title={\"Copy button\"}>\n <div>\n <span>Click the button to copy the "Hello" value:</span>\n <CopyButton value=\"Hello\" />\n </div>\n </StorySandbox>\n </Story>\n );\n },\n {\n info: {\n propTablesExclude: [Menu, MenuItem, Story, StoryReadme, StorySandbox]\n }\n }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,mBAAV,EAA+BC,MAA/B,CAAd;AAEAF,KAAK,CAACG,GAAN,CACI,aADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD;IAAc,KAAK,EAAE;EAArB,gBACI,uDACI,2FADJ,eAEI,6BAAC,sBAAD;IAAY,KAAK,EAAC;EAAlB,EAFJ,CADJ,CAFJ,CADJ;AAWH,CAdL,EAeI;EACIC,IAAI,EAAE;IACFC,iBAAiB,EAAE,CAACC,WAAD,EAAOC,eAAP,EAAiBC,YAAjB,EAAwBC,kBAAxB,EAAqCC,mBAArC;EADjB;AADV,CAfJ"}
|
|
@@ -1,5 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
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.IconButton = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var _iconButton = require("@rmwc/icon-button");
|
|
3
13
|
|
|
4
14
|
/**
|
|
5
15
|
* Shows the icon button.
|
|
@@ -13,7 +23,7 @@ var IconButton = function IconButton(props) {
|
|
|
13
23
|
disabled = props.disabled,
|
|
14
24
|
_props$ripple = props.ripple,
|
|
15
25
|
ripple = _props$ripple === void 0 ? true : _props$ripple;
|
|
16
|
-
return /*#__PURE__*/
|
|
26
|
+
return /*#__PURE__*/_react.default.createElement(_iconButton.IconButton, {
|
|
17
27
|
id: id,
|
|
18
28
|
"data-testid": props["data-testid"],
|
|
19
29
|
onClick: onClick,
|
|
@@ -25,4 +35,4 @@ var IconButton = function IconButton(props) {
|
|
|
25
35
|
});
|
|
26
36
|
};
|
|
27
37
|
|
|
28
|
-
|
|
38
|
+
exports.IconButton = IconButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["IconButton","props","id","icon","label","onClick","className","disabled","ripple"],"sources":["IconButton.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n IconButton as RIconButton,\n IconButtonProps as RmwcIconButtonProps\n} from \"@rmwc/icon-button\";\n\nimport { FormComponentProps } from \"../../types\";\n\nexport interface IconButtonProps extends Omit<FormComponentProps, \"onChange\">, RmwcIconButtonProps {\n id?: string;\n /**\n * Icon should be provided as an SvgComponent.\n */\n icon: React.ReactNode;\n\n /**\n * Button label\n */\n label?: string;\n\n /**\n * onClick handler\n * @param event\n */\n onClick?: (event: React.MouseEvent) => void;\n\n /**\n * Custom CSS class\n */\n className?: string;\n /**\n * For testing purposes.\n */\n\n \"data-testid\"?: string;\n\n /**\n * Should icon be disabled?\n */\n disabled?: boolean;\n}\n\n/**\n * Shows the icon button.\n */\nconst IconButton: React.FC<IconButtonProps> = props => {\n const { id, icon, label, onClick, className, disabled, ripple = true } = props;\n\n return (\n <RIconButton\n id={id}\n data-testid={props[\"data-testid\"]}\n onClick={onClick}\n disabled={disabled}\n className={className}\n label={label}\n icon={icon}\n ripple={ripple}\n />\n );\n};\n\nexport { IconButton };\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAyCA;AACA;AACA;AACA,IAAMA,UAAqC,GAAG,SAAxCA,UAAwC,CAAAC,KAAK,EAAI;EACnD,IAAQC,EAAR,GAAyED,KAAzE,CAAQC,EAAR;EAAA,IAAYC,IAAZ,GAAyEF,KAAzE,CAAYE,IAAZ;EAAA,IAAkBC,KAAlB,GAAyEH,KAAzE,CAAkBG,KAAlB;EAAA,IAAyBC,OAAzB,GAAyEJ,KAAzE,CAAyBI,OAAzB;EAAA,IAAkCC,SAAlC,GAAyEL,KAAzE,CAAkCK,SAAlC;EAAA,IAA6CC,QAA7C,GAAyEN,KAAzE,CAA6CM,QAA7C;EAAA,oBAAyEN,KAAzE,CAAuDO,MAAvD;EAAA,IAAuDA,MAAvD,8BAAgE,IAAhE;EAEA,oBACI,6BAAC,sBAAD;IACI,EAAE,EAAEN,EADR;IAEI,eAAaD,KAAK,CAAC,aAAD,CAFtB;IAGI,OAAO,EAAEI,OAHb;IAII,QAAQ,EAAEE,QAJd;IAKI,SAAS,EAAED,SALf;IAMI,KAAK,EAAEF,KANX;IAOI,IAAI,EAAED,IAPV;IAQI,MAAM,EAAEK;EARZ,EADJ;AAYH,CAfD"}
|
|
@@ -1,38 +1,50 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
var
|
|
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 _baselineCloud_done24px = require("./../assets/baseline-cloud_done-24px.svg");
|
|
14
|
+
|
|
15
|
+
var _roundMore_vert24px = require("./../assets/round-more_vert-24px.svg");
|
|
16
|
+
|
|
17
|
+
var _index = require("./../../Menu/index");
|
|
18
|
+
|
|
19
|
+
var _IconButton = require("./IconButton");
|
|
20
|
+
|
|
21
|
+
var story = (0, _react2.storiesOf)("Components/Button", module);
|
|
10
22
|
story.add("icon button", function () {
|
|
11
|
-
return /*#__PURE__*/
|
|
23
|
+
return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {
|
|
12
24
|
title: "Icon button"
|
|
13
|
-
}, /*#__PURE__*/
|
|
14
|
-
icon: /*#__PURE__*/
|
|
25
|
+
}, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
|
|
26
|
+
icon: /*#__PURE__*/_react.default.createElement(_baselineCloud_done24px.ReactComponent, null),
|
|
15
27
|
label: "Icon label",
|
|
16
28
|
onClick: function onClick() {
|
|
17
29
|
return console.log("Button clicked");
|
|
18
30
|
}
|
|
19
|
-
})), /*#__PURE__*/
|
|
31
|
+
})), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, {
|
|
20
32
|
title: "Menu example"
|
|
21
|
-
}, /*#__PURE__*/
|
|
22
|
-
handle: /*#__PURE__*/
|
|
23
|
-
icon: /*#__PURE__*/
|
|
33
|
+
}, /*#__PURE__*/_react.default.createElement(_index.Menu, {
|
|
34
|
+
handle: /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
|
|
35
|
+
icon: /*#__PURE__*/_react.default.createElement(_roundMore_vert24px.ReactComponent, null),
|
|
24
36
|
label: "Toggle menu",
|
|
25
37
|
onClick: function onClick() {
|
|
26
38
|
return console.log("Button clicked");
|
|
27
39
|
}
|
|
28
40
|
})
|
|
29
|
-
}, /*#__PURE__*/
|
|
41
|
+
}, /*#__PURE__*/_react.default.createElement(_index.MenuItem, {
|
|
30
42
|
onClick: function onClick() {
|
|
31
43
|
console.log("Apple selected!");
|
|
32
44
|
}
|
|
33
|
-
}, "Apple"), /*#__PURE__*/
|
|
45
|
+
}, "Apple"), /*#__PURE__*/_react.default.createElement(_index.MenuItem, null, "Banana"), /*#__PURE__*/_react.default.createElement(_index.MenuItem, null, "Watermelon"))));
|
|
34
46
|
}, {
|
|
35
47
|
info: {
|
|
36
|
-
propTablesExclude: [Menu, MenuItem, Story, StoryReadme, StorySandbox]
|
|
48
|
+
propTablesExclude: [_index.Menu, _index.MenuItem, _Story.Story, _Story.StoryReadme, _Story.StorySandbox]
|
|
37
49
|
}
|
|
38
50
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","add","readme","console","log","info","propTablesExclude","Menu","MenuItem","Story","StoryReadme","StorySandbox"],"sources":["IconButton.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./README.md\";\nimport { ReactComponent as CloudIcon } from \"./../assets/baseline-cloud_done-24px.svg\";\nimport { ReactComponent as MoreIcon } from \"./../assets/round-more_vert-24px.svg\";\nimport { Menu, MenuItem } from \"./../../Menu/index\";\n\nimport { IconButton } from \"./IconButton\";\n\nconst story = storiesOf(\"Components/Button\", module);\n\nstory.add(\n \"icon button\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox title={\"Icon button\"}>\n <IconButton\n icon={<CloudIcon />}\n label=\"Icon label\"\n onClick={() => console.log(\"Button clicked\")}\n />\n </StorySandbox>\n <StorySandbox title={\"Menu example\"}>\n <Menu\n handle={\n <IconButton\n icon={<MoreIcon />}\n label=\"Toggle menu\"\n onClick={() => console.log(\"Button clicked\")}\n />\n }\n >\n <MenuItem\n onClick={() => {\n console.log(\"Apple selected!\");\n }}\n >\n Apple\n </MenuItem>\n <MenuItem>Banana</MenuItem>\n <MenuItem>Watermelon</MenuItem>\n </Menu>\n </StorySandbox>\n </Story>\n );\n },\n {\n info: {\n propTablesExclude: [Menu, MenuItem, Story, StoryReadme, StorySandbox]\n }\n }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,mBAAV,EAA+BC,MAA/B,CAAd;AAEAF,KAAK,CAACG,GAAN,CACI,aADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD;IAAc,KAAK,EAAE;EAArB,gBACI,6BAAC,sBAAD;IACI,IAAI,eAAE,6BAAC,sCAAD,OADV;IAEI,KAAK,EAAC,YAFV;IAGI,OAAO,EAAE;MAAA,OAAMC,OAAO,CAACC,GAAR,CAAY,gBAAZ,CAAN;IAAA;EAHb,EADJ,CAFJ,eASI,6BAAC,mBAAD;IAAc,KAAK,EAAE;EAArB,gBACI,6BAAC,WAAD;IACI,MAAM,eACF,6BAAC,sBAAD;MACI,IAAI,eAAE,6BAAC,kCAAD,OADV;MAEI,KAAK,EAAC,aAFV;MAGI,OAAO,EAAE;QAAA,OAAMD,OAAO,CAACC,GAAR,CAAY,gBAAZ,CAAN;MAAA;IAHb;EAFR,gBASI,6BAAC,eAAD;IACI,OAAO,EAAE,mBAAM;MACXD,OAAO,CAACC,GAAR,CAAY,iBAAZ;IACH;EAHL,WATJ,eAgBI,6BAAC,eAAD,iBAhBJ,eAiBI,6BAAC,eAAD,qBAjBJ,CADJ,CATJ,CADJ;AAiCH,CApCL,EAqCI;EACIC,IAAI,EAAE;IACFC,iBAAiB,EAAE,CAACC,WAAD,EAAOC,eAAP,EAAiBC,YAAjB,EAAwBC,kBAAxB,EAAqCC,mBAArC;EADjB;AADV,CArCJ"}
|
package/Button/index.js
CHANGED
|
@@ -1,3 +1,44 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
|
|
7
|
+
var _Button = require("./Button");
|
|
8
|
+
|
|
9
|
+
Object.keys(_Button).forEach(function (key) {
|
|
10
|
+
if (key === "default" || key === "__esModule") return;
|
|
11
|
+
if (key in exports && exports[key] === _Button[key]) return;
|
|
12
|
+
Object.defineProperty(exports, key, {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _Button[key];
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
});
|
|
19
|
+
|
|
20
|
+
var _IconButton = require("./IconButton/IconButton");
|
|
21
|
+
|
|
22
|
+
Object.keys(_IconButton).forEach(function (key) {
|
|
23
|
+
if (key === "default" || key === "__esModule") return;
|
|
24
|
+
if (key in exports && exports[key] === _IconButton[key]) return;
|
|
25
|
+
Object.defineProperty(exports, key, {
|
|
26
|
+
enumerable: true,
|
|
27
|
+
get: function get() {
|
|
28
|
+
return _IconButton[key];
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
});
|
|
32
|
+
|
|
33
|
+
var _CopyButton = require("./CopyButton/CopyButton");
|
|
34
|
+
|
|
35
|
+
Object.keys(_CopyButton).forEach(function (key) {
|
|
36
|
+
if (key === "default" || key === "__esModule") return;
|
|
37
|
+
if (key in exports && exports[key] === _CopyButton[key]) return;
|
|
38
|
+
Object.defineProperty(exports, key, {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function get() {
|
|
41
|
+
return _CopyButton[key];
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
});
|
package/Button/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Button\";\nexport * from \"./IconButton/IconButton\";\nexport * from \"./CopyButton/CopyButton\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
package/Carousel/Carousel.js
CHANGED
|
@@ -1,27 +1,42 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
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 _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
+
|
|
12
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
+
|
|
14
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
15
|
+
|
|
16
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
17
|
+
|
|
18
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
19
|
+
|
|
20
|
+
var _react = _interopRequireDefault(require("react"));
|
|
21
|
+
|
|
22
|
+
var _nukaCarousel = _interopRequireDefault(require("nuka-carousel"));
|
|
23
|
+
|
|
24
|
+
var _pick = _interopRequireDefault(require("lodash/pick"));
|
|
9
25
|
|
|
10
26
|
var Carousel = /*#__PURE__*/function (_React$Component) {
|
|
11
|
-
|
|
27
|
+
(0, _inherits2.default)(Carousel, _React$Component);
|
|
12
28
|
|
|
13
|
-
var _super =
|
|
29
|
+
var _super = (0, _createSuper2.default)(Carousel);
|
|
14
30
|
|
|
15
31
|
function Carousel() {
|
|
16
|
-
|
|
17
|
-
|
|
32
|
+
(0, _classCallCheck2.default)(this, Carousel);
|
|
18
33
|
return _super.apply(this, arguments);
|
|
19
34
|
}
|
|
20
35
|
|
|
21
|
-
|
|
36
|
+
(0, _createClass2.default)(Carousel, [{
|
|
22
37
|
key: "render",
|
|
23
38
|
value: function render() {
|
|
24
|
-
return /*#__PURE__*/
|
|
39
|
+
return /*#__PURE__*/_react.default.createElement(_nukaCarousel.default, Object.assign({}, (0, _pick.default)(this.props, Carousel.nukaProps), this.props.renderPreviousSlide ? {
|
|
25
40
|
renderCenterLeftControls: this.props.renderPreviousSlide
|
|
26
41
|
} : {}, this.props.renderNextSlide ? {
|
|
27
42
|
renderCenterRightControls: this.props.renderNextSlide
|
|
@@ -30,17 +45,15 @@ var Carousel = /*#__PURE__*/function (_React$Component) {
|
|
|
30
45
|
} : {}), this.props.children);
|
|
31
46
|
}
|
|
32
47
|
}]);
|
|
33
|
-
|
|
34
48
|
return Carousel;
|
|
35
|
-
}(
|
|
49
|
+
}(_react.default.Component);
|
|
36
50
|
|
|
37
|
-
|
|
51
|
+
(0, _defineProperty2.default)(Carousel, "defaultProps", {
|
|
38
52
|
swiping: true,
|
|
39
53
|
dragging: false,
|
|
40
54
|
heightMode: "first",
|
|
41
55
|
easing: "easeExpInOut"
|
|
42
56
|
});
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
export default Carousel;
|
|
57
|
+
(0, _defineProperty2.default)(Carousel, "nukaProps", ["children", "afterSlide", "autoplay", "autoplayInterval", "beforeSlide", "dragging", "easing", "heightMode", "pauseOnHover", "slideIndex", "speed", "swiping", "transitionMode"]);
|
|
58
|
+
var _default = Carousel;
|
|
59
|
+
exports.default = _default;
|
package/Carousel/Carousel.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["Carousel","pick","props","nukaProps","renderPreviousSlide","renderCenterLeftControls","renderNextSlide","renderCenterRightControls","renderBottomNav","renderBottomCenterControls","children","React","Component","swiping","dragging","heightMode","easing"],"sources":["Carousel.tsx"],"sourcesContent":["import React from \"react\";\nimport NukaCarousel, { CarouselProps, CarouselRenderControl } from \"nuka-carousel\";\nimport pick from \"lodash/pick\";\n\ninterface Props extends CarouselProps {\n // slides as set of HTMLElements\n children: React.ReactNode;\n\n // render method for the next slide button\n renderNextSlide?: CarouselRenderControl | null;\n\n // render method for the previous slide button\n renderPreviousSlide?: CarouselRenderControl | null;\n\n // render method for the central navigation\n renderBottomNav?: CarouselRenderControl | null;\n}\n\nclass Carousel extends React.Component<Props> {\n static defaultProps = {\n swiping: true,\n dragging: false,\n heightMode: \"first\",\n easing: \"easeExpInOut\"\n };\n\n static nukaProps = [\n \"children\",\n \"afterSlide\",\n \"autoplay\",\n \"autoplayInterval\",\n \"beforeSlide\",\n \"dragging\",\n \"easing\",\n \"heightMode\",\n \"pauseOnHover\",\n \"slideIndex\",\n \"speed\",\n \"swiping\",\n \"transitionMode\"\n ];\n\n public override render() {\n return (\n <NukaCarousel\n {...pick(this.props, Carousel.nukaProps)}\n {...(this.props.renderPreviousSlide\n ? { renderCenterLeftControls: this.props.renderPreviousSlide }\n : {})}\n {...(this.props.renderNextSlide\n ? { renderCenterRightControls: this.props.renderNextSlide }\n : {})}\n {...(this.props.renderBottomNav\n ? { renderBottomCenterControls: this.props.renderBottomNav }\n : {})}\n >\n {this.props.children}\n </NukaCarousel>\n );\n }\n}\n\nexport default Carousel;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;IAgBMA,Q;;;;;;;;;;;;WAwBF,kBAAyB;MACrB,oBACI,6BAAC,qBAAD,oBACQ,IAAAC,aAAA,EAAK,KAAKC,KAAV,EAAiBF,QAAQ,CAACG,SAA1B,CADR,EAES,KAAKD,KAAL,CAAWE,mBAAX,GACC;QAAEC,wBAAwB,EAAE,KAAKH,KAAL,CAAWE;MAAvC,CADD,GAEC,EAJV,EAKS,KAAKF,KAAL,CAAWI,eAAX,GACC;QAAEC,yBAAyB,EAAE,KAAKL,KAAL,CAAWI;MAAxC,CADD,GAEC,EAPV,EAQS,KAAKJ,KAAL,CAAWM,eAAX,GACC;QAAEC,0BAA0B,EAAE,KAAKP,KAAL,CAAWM;MAAzC,CADD,GAEC,EAVV,GAYK,KAAKN,KAAL,CAAWQ,QAZhB,CADJ;IAgBH;;;EAzCkBC,cAAA,CAAMC,S;;8BAAvBZ,Q,kBACoB;EAClBa,OAAO,EAAE,IADS;EAElBC,QAAQ,EAAE,KAFQ;EAGlBC,UAAU,EAAE,OAHM;EAIlBC,MAAM,EAAE;AAJU,C;8BADpBhB,Q,eAQiB,CACf,UADe,EAEf,YAFe,EAGf,UAHe,EAIf,kBAJe,EAKf,aALe,EAMf,UANe,EAOf,QAPe,EAQf,YARe,EASf,cATe,EAUf,YAVe,EAWf,OAXe,EAYf,SAZe,EAaf,gBAbe,C;eAoCRA,Q"}
|
|
@@ -1,29 +1,39 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var
|
|
8
|
-
|
|
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 _addonKnobs = require("@storybook/addon-knobs");
|
|
12
|
+
|
|
13
|
+
var _README = _interopRequireDefault(require("./README.md"));
|
|
14
|
+
|
|
15
|
+
var _Carousel = _interopRequireDefault(require("./Carousel"));
|
|
16
|
+
|
|
17
|
+
var story = (0, _react2.storiesOf)("Components/Carousel", module);
|
|
18
|
+
story.addDecorator(_addonKnobs.withKnobs);
|
|
9
19
|
story.add("usage - single", function () {
|
|
10
|
-
return /*#__PURE__*/
|
|
20
|
+
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, {
|
|
11
21
|
title: "Simple checkbox with a label and description"
|
|
12
|
-
}, /*#__PURE__*/
|
|
22
|
+
}, /*#__PURE__*/_react.default.createElement(_Carousel.default, null, /*#__PURE__*/_react.default.createElement("img", {
|
|
13
23
|
src: "http://placehold.it/1000x400/ffffff/c0392b/&text=slide1"
|
|
14
|
-
}), /*#__PURE__*/
|
|
24
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
15
25
|
src: "http://placehold.it/1000x400/ffffff/c0392b/&text=slide2"
|
|
16
|
-
}), /*#__PURE__*/
|
|
26
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
17
27
|
src: "http://placehold.it/1000x400/ffffff/c0392b/&text=slide3"
|
|
18
|
-
}), /*#__PURE__*/
|
|
28
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
19
29
|
src: "http://placehold.it/1000x400/ffffff/c0392b/&text=slide4"
|
|
20
|
-
}), /*#__PURE__*/
|
|
30
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
21
31
|
src: "http://placehold.it/1000x400/ffffff/c0392b/&text=slide5"
|
|
22
|
-
}), /*#__PURE__*/
|
|
32
|
+
}), /*#__PURE__*/_react.default.createElement("img", {
|
|
23
33
|
src: "http://placehold.it/1000x400/ffffff/c0392b/&text=slide6"
|
|
24
|
-
}))), /*#__PURE__*/
|
|
34
|
+
}))), /*#__PURE__*/_react.default.createElement(_Story.StorySandboxCode, null, "\n <Carousel>\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide1\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide2\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide3\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide4\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide5\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide6\" />\n </Carousel>\n ")));
|
|
25
35
|
}, {
|
|
26
36
|
info: {
|
|
27
|
-
propTables: [
|
|
37
|
+
propTables: [_Carousel.default]
|
|
28
38
|
}
|
|
29
39
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","readme","info","propTables","Carousel"],"sources":["Carouser.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 { withKnobs } from \"@storybook/addon-knobs\";\nimport readme from \"./README.md\";\nimport Carousel from \"./Carousel\";\n\nconst story = storiesOf(\"Components/Carousel\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage - single\",\n () => {\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple checkbox with a label and description\"}>\n <Carousel>\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide1\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide2\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide3\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide4\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide5\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide6\" />\n </Carousel>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Carousel>\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide1\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide2\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide3\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide4\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide5\" />\n <img src=\"http://placehold.it/1000x400/ffffff/c0392b/&text=slide6\" />\n </Carousel>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Carousel] } }\n);\n"],"mappings":";;;;AAAA;;AACA;;AACA;;AAOA;;AACA;;AACA;;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAA,EAAU,qBAAV,EAAiCC,MAAjC,CAAd;AACAF,KAAK,CAACG,YAAN,CAAmBC,qBAAnB;AAEAJ,KAAK,CAACK,GAAN,CACI,gBADJ,EAEI,YAAM;EACF,oBACI,6BAAC,YAAD,qBACI,6BAAC,kBAAD,QAAcC,eAAd,CADJ,eAEI,6BAAC,mBAAD,qBACI,6BAAC,0BAAD;IAAqB,KAAK,EAAE;EAA5B,gBACI,6BAAC,iBAAD,qBACI;IAAK,GAAG,EAAC;EAAT,EADJ,eAEI;IAAK,GAAG,EAAC;EAAT,EAFJ,eAGI;IAAK,GAAG,EAAC;EAAT,EAHJ,eAII;IAAK,GAAG,EAAC;EAAT,EAJJ,eAKI;IAAK,GAAG,EAAC;EAAT,EALJ,eAMI;IAAK,GAAG,EAAC;EAAT,EANJ,CADJ,CADJ,eAWI,6BAAC,uBAAD,wqBAXJ,CAFJ,CADJ;AA6BH,CAhCL,EAiCI;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,iBAAD;EAAd;AAAR,CAjCJ"}
|
package/Carousel/index.js
CHANGED
|
@@ -1 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "Carousel", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _Carousel.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
var _Carousel = _interopRequireDefault(require("./Carousel"));
|
package/Carousel/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Carousel } from \"./Carousel\";\n"],"mappings":";;;;;;;;;;;;;;AAAA"}
|
package/Checkbox/Checkbox.js
CHANGED
|
@@ -1,12 +1,29 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
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 _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
+
|
|
12
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
+
|
|
14
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
15
|
+
|
|
16
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
17
|
+
|
|
18
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
19
|
+
|
|
20
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
21
|
+
|
|
22
|
+
var _react = _interopRequireDefault(require("react"));
|
|
23
|
+
|
|
24
|
+
var _checkbox = require("@rmwc/checkbox");
|
|
25
|
+
|
|
26
|
+
var _FormElementMessage = require("../FormElementMessage");
|
|
10
27
|
|
|
11
28
|
/**
|
|
12
29
|
* Single Checkbox component can be used to store simple boolean values.
|
|
@@ -15,29 +32,27 @@ import { FormElementMessage } from "../FormElementMessage";
|
|
|
15
32
|
* In that case, each Checkbox component must receive value and onChange callback via props.
|
|
16
33
|
*/
|
|
17
34
|
var Checkbox = /*#__PURE__*/function (_React$Component) {
|
|
18
|
-
|
|
35
|
+
(0, _inherits2.default)(Checkbox, _React$Component);
|
|
19
36
|
|
|
20
|
-
var _super =
|
|
37
|
+
var _super = (0, _createSuper2.default)(Checkbox);
|
|
21
38
|
|
|
22
39
|
function Checkbox() {
|
|
23
40
|
var _this;
|
|
24
41
|
|
|
25
|
-
|
|
42
|
+
(0, _classCallCheck2.default)(this, Checkbox);
|
|
26
43
|
|
|
27
44
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
28
45
|
args[_key] = arguments[_key];
|
|
29
46
|
}
|
|
30
47
|
|
|
31
48
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
32
|
-
|
|
33
|
-
_defineProperty(_assertThisInitialized(_this), "onChange", function (e) {
|
|
49
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (e) {
|
|
34
50
|
_this.props.onChange && _this.props.onChange(e.target.checked);
|
|
35
51
|
});
|
|
36
|
-
|
|
37
52
|
return _this;
|
|
38
53
|
}
|
|
39
54
|
|
|
40
|
-
|
|
55
|
+
(0, _createClass2.default)(Checkbox, [{
|
|
41
56
|
key: "render",
|
|
42
57
|
value: function render() {
|
|
43
58
|
var _this$props = this.props,
|
|
@@ -53,7 +68,7 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
|
|
|
53
68
|
validationIsValid = _ref.isValid,
|
|
54
69
|
validationMessage = _ref.message;
|
|
55
70
|
|
|
56
|
-
return /*#__PURE__*/
|
|
71
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_checkbox.Checkbox, {
|
|
57
72
|
indeterminate: indeterminate,
|
|
58
73
|
disabled: disabled,
|
|
59
74
|
checked: Boolean(value),
|
|
@@ -63,13 +78,13 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
|
|
|
63
78
|
} // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.
|
|
64
79
|
,
|
|
65
80
|
label: label
|
|
66
|
-
}), validationIsValid === false && /*#__PURE__*/
|
|
81
|
+
}), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
|
|
67
82
|
error: true
|
|
68
|
-
}, validationMessage), validationIsValid !== false && description && /*#__PURE__*/
|
|
83
|
+
}, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
|
|
69
84
|
}
|
|
70
85
|
}]);
|
|
71
|
-
|
|
72
86
|
return Checkbox;
|
|
73
|
-
}(
|
|
87
|
+
}(_react.default.Component);
|
|
74
88
|
|
|
75
|
-
|
|
89
|
+
var _default = Checkbox;
|
|
90
|
+
exports.default = _default;
|
package/Checkbox/Checkbox.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["Checkbox","e","props","onChange","target","checked","value","label","disabled","indeterminate","description","validation","onClick","validationIsValid","isValid","validationMessage","message","Boolean","React","Component"],"sources":["Checkbox.tsx"],"sourcesContent":["import React from \"react\";\nimport { Checkbox as RmwcCheckbox } from \"@rmwc/checkbox\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { FormComponentProps } from \"~/types\";\n\ninterface Props extends FormComponentProps {\n // Component label.\n label?: React.ReactNode;\n\n // Is checkbox disabled?\n disabled?: boolean;\n\n // onClick callback.\n onClick?: (value: boolean) => void;\n\n // Use when checkbox is not checked nor unchecked.\n indeterminate?: boolean;\n\n // Description beneath the checkbox.\n description?: string;\n}\n\n/**\n * Single Checkbox component can be used to store simple boolean values.\n *\n * Grouping multiple Checkbox components with CheckboxGroup will allow to store an array of selected values.\n * In that case, each Checkbox component must receive value and onChange callback via props.\n */\nclass Checkbox extends React.Component<Props> {\n onChange = (e: React.SyntheticEvent<HTMLInputElement>) => {\n this.props.onChange && this.props.onChange((e.target as any).checked);\n };\n\n public override render() {\n const { value, label, disabled, indeterminate, description, validation, onClick } =\n this.props;\n\n const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n return (\n <React.Fragment>\n <RmwcCheckbox\n indeterminate={indeterminate}\n disabled={disabled}\n checked={Boolean(value)}\n onChange={this.onChange}\n onClick={() => typeof onClick === \"function\" && onClick(Boolean(value))}\n // @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.\n label={label}\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}\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAoBA;AACA;AACA;AACA;AACA;AACA;IACMA,Q;;;;;;;;;;;;;;;2FACS,UAACC,CAAD,EAA+C;MACtD,MAAKC,KAAL,CAAWC,QAAX,IAAuB,MAAKD,KAAL,CAAWC,QAAX,CAAqBF,CAAC,CAACG,MAAH,CAAkBC,OAAtC,CAAvB;IACH,C;;;;;;WAED,kBAAyB;MACrB,kBACI,KAAKH,KADT;MAAA,IAAQI,KAAR,eAAQA,KAAR;MAAA,IAAeC,KAAf,eAAeA,KAAf;MAAA,IAAsBC,QAAtB,eAAsBA,QAAtB;MAAA,IAAgCC,aAAhC,eAAgCA,aAAhC;MAAA,IAA+CC,WAA/C,eAA+CA,WAA/C;MAAA,IAA4DC,UAA5D,eAA4DA,UAA5D;MAAA,IAAwEC,QAAxE,eAAwEA,OAAxE;;MAGA,WAAmED,UAAU,IAAI,EAAjF;MAAA,IAAiBE,iBAAjB,QAAQC,OAAR;MAAA,IAA6CC,iBAA7C,QAAoCC,OAApC;;MAEA,oBACI,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,kBAAD;QACI,aAAa,EAAEP,aADnB;QAEI,QAAQ,EAAED,QAFd;QAGI,OAAO,EAAES,OAAO,CAACX,KAAD,CAHpB;QAII,QAAQ,EAAE,KAAKH,QAJnB;QAKI,OAAO,EAAE;UAAA,OAAM,OAAOS,QAAP,KAAmB,UAAnB,IAAiCA,QAAO,CAACK,OAAO,CAACX,KAAD,CAAR,CAA9C;QAAA,CALb,CAMI;QANJ;QAOI,KAAK,EAAEC;MAPX,EADJ,EAUKM,iBAAiB,KAAK,KAAtB,iBACG,6BAAC,sCAAD;QAAoB,KAAK;MAAzB,GAA2BE,iBAA3B,CAXR,EAcKF,iBAAiB,KAAK,KAAtB,IAA+BH,WAA/B,iBACG,6BAAC,sCAAD,QAAqBA,WAArB,CAfR,CADJ;IAoBH;;;EA/BkBQ,cAAA,CAAMC,S;;eAkCdnB,Q"}
|