@webiny/ui 0.0.0-unstable.40876133bb → 0.0.0-unstable.496cf268ac
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.d.ts +1 -1
- package/Accordion/Accordion.js +5 -19
- package/Accordion/Accordion.js.map +1 -1
- package/Accordion/Accordion.stories.js +0 -8
- package/Accordion/Accordion.stories.js.map +1 -1
- package/Accordion/AccordionItem.d.ts +21 -2
- package/Accordion/AccordionItem.js +49 -71
- package/Accordion/AccordionItem.js.map +1 -1
- package/Accordion/AccordionItemActions.d.ts +8 -0
- package/Accordion/AccordionItemActions.js +28 -0
- package/Accordion/AccordionItemActions.js.map +1 -0
- package/Accordion/index.js +0 -4
- package/Accordion/index.js.map +1 -1
- package/Alert/Alert.d.ts +1 -1
- package/Alert/Alert.js +4 -11
- package/Alert/Alert.js.map +1 -1
- package/Alert/Alert.stories.js +0 -6
- package/Alert/Alert.stories.js.map +1 -1
- package/Alert/index.js +0 -2
- package/Alert/index.js.map +1 -1
- package/AutoComplete/AutoComplete.js +38 -88
- package/AutoComplete/AutoComplete.js.map +1 -1
- package/AutoComplete/AutoComplete.stories.js +0 -7
- package/AutoComplete/AutoComplete.stories.js.map +1 -1
- package/AutoComplete/MultiAutoComplete.js +52 -128
- package/AutoComplete/MultiAutoComplete.js.map +1 -1
- package/AutoComplete/MultiAutoComplete.stories.js +0 -8
- package/AutoComplete/MultiAutoComplete.stories.js.map +1 -1
- package/AutoComplete/index.js +0 -4
- package/AutoComplete/index.js.map +1 -1
- package/AutoComplete/styles.js +0 -2
- package/AutoComplete/styles.js.map +1 -1
- package/AutoComplete/utils.js +0 -8
- package/AutoComplete/utils.js.map +1 -1
- package/Avatar/Avatar.js +7 -18
- package/Avatar/Avatar.js.map +1 -1
- package/Avatar/Avatar.stories.js +0 -6
- package/Avatar/Avatar.stories.js.map +1 -1
- package/Avatar/index.js +0 -2
- package/Avatar/index.js.map +1 -1
- package/Button/Button.d.ts +30 -1
- package/Button/Button.js +39 -63
- package/Button/Button.js.map +1 -1
- package/Button/Button.stories.js +0 -10
- package/Button/Button.stories.js.map +1 -1
- package/Button/Button.styles.js +0 -2
- package/Button/Button.styles.js.map +1 -1
- package/Button/CopyButton/CopyButton.js +2 -12
- package/Button/CopyButton/CopyButton.js.map +1 -1
- package/Button/CopyButton/CopyButton.stories.js +0 -7
- package/Button/CopyButton/CopyButton.stories.js.map +1 -1
- package/Button/IconButton/IconButton.js +6 -12
- package/Button/IconButton/IconButton.js.map +1 -1
- package/Button/IconButton/IconButton.stories.js +0 -9
- package/Button/IconButton/IconButton.stories.js.map +1 -1
- package/Button/index.js +0 -6
- package/Button/index.js.map +1 -1
- package/Carousel/Carousel.js +0 -14
- package/Carousel/Carousel.js.map +1 -1
- package/Carousel/Carouser.stories.js +0 -7
- package/Carousel/Carouser.stories.js.map +1 -1
- package/Carousel/index.js +0 -2
- package/Carousel/index.js.map +1 -1
- package/Checkbox/Checkbox.d.ts +1 -0
- package/Checkbox/Checkbox.js +13 -31
- package/Checkbox/Checkbox.js.map +1 -1
- package/Checkbox/Checkbox.stories.js +0 -8
- package/Checkbox/Checkbox.stories.js.map +1 -1
- package/Checkbox/Checkbox.styles.js +0 -2
- package/Checkbox/Checkbox.styles.js.map +1 -1
- package/Checkbox/CheckboxGroup.js +7 -24
- package/Checkbox/CheckboxGroup.js.map +1 -1
- package/Checkbox/CheckboxGroup.stories.js +2 -10
- package/Checkbox/CheckboxGroup.stories.js.map +1 -1
- package/Checkbox/index.js +0 -3
- package/Checkbox/index.js.map +1 -1
- package/Chips/Chip.js +1 -8
- package/Chips/Chip.js.map +1 -1
- package/Chips/Chips.js +3 -13
- package/Chips/Chips.js.map +1 -1
- package/Chips/Chips.stories.js +0 -8
- package/Chips/Chips.stories.js.map +1 -1
- package/Chips/index.js +0 -4
- package/Chips/index.js.map +1 -1
- package/Chips/styles.js +0 -2
- package/Chips/styles.js.map +1 -1
- package/CodeEditor/CodeEditor.js +8 -36
- package/CodeEditor/CodeEditor.js.map +1 -1
- package/CodeEditor/CodeEditor.stories.js +0 -10
- package/CodeEditor/CodeEditor.stories.js.map +1 -1
- package/CodeEditor/index.js +0 -2
- package/CodeEditor/index.js.map +1 -1
- package/ColorPicker/ColorPicker.js +7 -31
- package/ColorPicker/ColorPicker.js.map +1 -1
- package/ColorPicker/ColorPicker.stories.js +0 -8
- package/ColorPicker/ColorPicker.stories.js.map +1 -1
- package/ColorPicker/index.js +0 -2
- package/ColorPicker/index.js.map +1 -1
- package/ConfirmationDialog/ConfirmationDialog.js +33 -65
- package/ConfirmationDialog/ConfirmationDialog.js.map +1 -1
- package/ConfirmationDialog/ConfirmationDialog.stories.js +0 -7
- package/ConfirmationDialog/ConfirmationDialog.stories.js.map +1 -1
- package/ConfirmationDialog/index.js +0 -4
- package/ConfirmationDialog/index.js.map +1 -1
- package/ConfirmationDialog/withConfirmation.js +0 -5
- package/ConfirmationDialog/withConfirmation.js.map +1 -1
- package/DataTable/DataTable.d.ts +16 -1
- package/DataTable/DataTable.js +62 -42
- package/DataTable/DataTable.js.map +1 -1
- package/DataTable/DataTable.stories.js +0 -6
- package/DataTable/DataTable.stories.js.map +1 -1
- package/DataTable/index.js +0 -2
- package/DataTable/index.js.map +1 -1
- package/DataTable/styled.d.ts +30 -1
- package/DataTable/styled.js +25 -7
- package/DataTable/styled.js.map +1 -1
- package/DelayedOnChange/DelayedOnChange.js +19 -35
- package/DelayedOnChange/DelayedOnChange.js.map +1 -1
- package/DelayedOnChange/index.js +0 -3
- package/DelayedOnChange/index.js.map +1 -1
- package/DelayedOnChange/withDelayedOnChange.js +3 -9
- package/DelayedOnChange/withDelayedOnChange.js.map +1 -1
- package/Dialog/Dialog.js +7 -39
- package/Dialog/Dialog.js.map +1 -1
- package/Dialog/Dialog.stories.js +0 -7
- package/Dialog/Dialog.stories.js.map +1 -1
- package/Dialog/index.js +0 -2
- package/Dialog/index.js.map +1 -1
- package/Drawer/Drawer.js +0 -9
- package/Drawer/Drawer.js.map +1 -1
- package/Drawer/Drawer.stories.js +0 -8
- package/Drawer/Drawer.stories.js.map +1 -1
- package/Drawer/index.js +0 -2
- package/Drawer/index.js.map +1 -1
- package/DynamicFieldset/Fieldset.js +7 -34
- package/DynamicFieldset/Fieldset.js.map +1 -1
- package/DynamicFieldset/index.js +0 -2
- package/DynamicFieldset/index.js.map +1 -1
- package/Elevation/Elevation.js +0 -5
- package/Elevation/Elevation.js.map +1 -1
- package/Elevation/Elevation.stories.js +0 -8
- package/Elevation/Elevation.stories.js.map +1 -1
- package/Elevation/index.js +0 -2
- package/Elevation/index.js.map +1 -1
- package/FormElementMessage/FormElementMessage.js +0 -5
- package/FormElementMessage/FormElementMessage.js.map +1 -1
- package/FormElementMessage/index.js +0 -1
- package/FormElementMessage/index.js.map +1 -1
- package/FullName/FullName.js +0 -7
- package/FullName/FullName.js.map +1 -1
- package/FullName/index.js +0 -2
- package/FullName/index.js.map +1 -1
- package/Grid/Grid.js +1 -9
- package/Grid/Grid.js.map +1 -1
- package/Grid/Grid.stories.js +0 -6
- package/Grid/Grid.stories.js.map +1 -1
- package/Grid/index.js +0 -2
- package/Grid/index.js.map +1 -1
- package/Helpers/ClassNames.js +0 -9
- package/Helpers/ClassNames.js.map +1 -1
- package/Helpers/index.js +0 -1
- package/Helpers/index.js.map +1 -1
- package/Icon/Icon.js +1 -7
- package/Icon/Icon.js.map +1 -1
- package/Icon/Icon.stories.js +0 -10
- package/Icon/Icon.stories.js.map +1 -1
- package/Icon/index.js +0 -2
- package/Icon/index.js.map +1 -1
- package/Image/Image.js +0 -8
- package/Image/Image.js.map +1 -1
- package/Image/Image.stories.js +0 -7
- package/Image/Image.stories.js.map +1 -1
- package/Image/index.js +0 -2
- package/Image/index.js.map +1 -1
- package/ImageEditor/ImageEditor.js +46 -107
- package/ImageEditor/ImageEditor.js.map +1 -1
- package/ImageEditor/index.js +0 -2
- package/ImageEditor/index.js.map +1 -1
- package/ImageEditor/toolbar/crop.js +1 -16
- package/ImageEditor/toolbar/crop.js.map +1 -1
- package/ImageEditor/toolbar/filter.js +11 -36
- package/ImageEditor/toolbar/filter.js.map +1 -1
- package/ImageEditor/toolbar/flip.js +0 -17
- package/ImageEditor/toolbar/flip.js.map +1 -1
- package/ImageEditor/toolbar/icons/index.js +0 -8
- package/ImageEditor/toolbar/icons/index.js.map +1 -1
- package/ImageEditor/toolbar/index.js +0 -5
- package/ImageEditor/toolbar/index.js.map +1 -1
- package/ImageEditor/toolbar/rotate.js +8 -43
- package/ImageEditor/toolbar/rotate.js.map +1 -1
- package/ImageUpload/Image.js +10 -34
- package/ImageUpload/Image.js.map +1 -1
- package/ImageUpload/ImageEditorDialog.js +11 -33
- package/ImageUpload/ImageEditorDialog.js.map +1 -1
- package/ImageUpload/MultiImageUpload.js +111 -175
- package/ImageUpload/MultiImageUpload.js.map +1 -1
- package/ImageUpload/MultiImageUpload.stories.js +0 -8
- package/ImageUpload/MultiImageUpload.stories.js.map +1 -1
- package/ImageUpload/SingleImageUpload.js +38 -79
- package/ImageUpload/SingleImageUpload.js.map +1 -1
- package/ImageUpload/SingleImageUpload.stories.js +0 -8
- package/ImageUpload/SingleImageUpload.stories.js.map +1 -1
- package/ImageUpload/index.js +0 -5
- package/ImageUpload/index.js.map +1 -1
- package/ImageUpload/styled.d.ts +27 -17
- package/ImageUpload/styled.js +0 -5
- package/ImageUpload/styled.js.map +1 -1
- package/Input/Input.d.ts +2 -12
- package/Input/Input.js +86 -149
- package/Input/Input.js.map +1 -1
- package/Input/Input.stories.js +0 -13
- package/Input/Input.stories.js.map +1 -1
- package/Input/__tests__/Input.test.js +4 -30
- package/Input/__tests__/Input.test.js.map +1 -1
- package/Input/index.js +0 -2
- package/Input/index.js.map +1 -1
- package/List/CollapsibleList/CollapsibleList.stories.js +0 -8
- package/List/CollapsibleList/CollapsibleList.stories.js.map +1 -1
- package/List/CollapsibleList/index.js +0 -6
- package/List/CollapsibleList/index.js.map +1 -1
- package/List/DataList/DataList.js +18 -97
- package/List/DataList/DataList.js.map +1 -1
- package/List/DataList/DataList.stories.js +2 -10
- package/List/DataList/DataList.stories.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.d.ts +8 -6
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js +5 -16
- package/List/DataList/DataListModalOverlay/DataListModalOverlay.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js +3 -14
- package/List/DataList/DataListModalOverlay/DataListModalOverlayAction.js.map +1 -1
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js +3 -12
- package/List/DataList/DataListModalOverlay/DataListModalOverlayContext.js.map +1 -1
- package/List/DataList/DataListModalOverlay/index.js +0 -3
- package/List/DataList/DataListModalOverlay/index.js.map +1 -1
- package/List/DataList/DataListWithSections.js +4 -48
- package/List/DataList/DataListWithSections.js.map +1 -1
- package/List/DataList/Loader.js +0 -7
- package/List/DataList/Loader.js.map +1 -1
- package/List/DataList/NoData.js +0 -7
- package/List/DataList/NoData.js.map +1 -1
- package/List/DataList/icons/index.js +0 -29
- package/List/DataList/icons/index.js.map +1 -1
- package/List/DataList/index.js +0 -6
- package/List/DataList/index.js.map +1 -1
- package/List/List.js +0 -39
- package/List/List.js.map +1 -1
- package/List/List.stories.js +0 -12
- package/List/List.stories.js.map +1 -1
- package/List/icons/index.js +0 -3
- package/List/icons/index.js.map +1 -1
- package/List/index.js +0 -4
- package/List/index.js.map +1 -1
- package/Menu/Menu.js +2 -28
- package/Menu/Menu.js.map +1 -1
- package/Menu/Menu.stories.js +0 -7
- package/Menu/Menu.stories.js.map +1 -1
- package/Menu/index.js +0 -2
- package/Menu/index.js.map +1 -1
- package/Mosaic/Mosaic.js +3 -7
- package/Mosaic/Mosaic.js.map +1 -1
- package/Mosaic/Mosaic.stories.js +0 -6
- package/Mosaic/Mosaic.stories.js.map +1 -1
- package/Mosaic/index.js +0 -2
- package/Mosaic/index.js.map +1 -1
- package/Progress/CircularProgress.js +6 -14
- package/Progress/CircularProgress.js.map +1 -1
- package/Progress/index.js +0 -2
- package/Progress/index.js.map +1 -1
- package/Radio/Radio.js +9 -28
- package/Radio/Radio.js.map +1 -1
- package/Radio/Radio.styles.js +0 -2
- package/Radio/Radio.styles.js.map +1 -1
- package/Radio/RadioGroup.js +5 -21
- package/Radio/RadioGroup.js.map +1 -1
- package/Radio/RadioGroup.stories.js +2 -10
- package/Radio/RadioGroup.stories.js.map +1 -1
- package/Radio/index.js +0 -3
- package/Radio/index.js.map +1 -1
- package/RichTextEditor/RichTextEditor.js +30 -64
- package/RichTextEditor/RichTextEditor.js.map +1 -1
- package/RichTextEditor/RichTextEditor.stories.js +0 -7
- package/RichTextEditor/RichTextEditor.stories.js.map +1 -1
- package/RichTextEditor/createPropsFromConfig.js +0 -4
- package/RichTextEditor/createPropsFromConfig.js.map +1 -1
- package/RichTextEditor/index.js +0 -3
- package/RichTextEditor/index.js.map +1 -1
- package/Ripple/Ripple.js +0 -6
- package/Ripple/Ripple.js.map +1 -1
- package/Ripple/Ripple.stories.js +0 -12
- package/Ripple/Ripple.stories.js.map +1 -1
- package/Ripple/index.js +0 -2
- package/Ripple/index.js.map +1 -1
- package/Scrollbar/Scrollbar.js +0 -5
- package/Scrollbar/Scrollbar.js.map +1 -1
- package/Scrollbar/Scrollbar.stories.js +0 -6
- package/Scrollbar/Scrollbar.stories.js.map +1 -1
- package/Scrollbar/index.js +0 -2
- package/Scrollbar/index.js.map +1 -1
- package/Section/Section.stories.js +0 -7
- package/Section/Section.stories.js.map +1 -1
- package/Section/index.js +2 -12
- package/Section/index.js.map +1 -1
- package/Select/Select.js +9 -32
- package/Select/Select.js.map +1 -1
- package/Select/Select.stories.js +0 -8
- package/Select/Select.stories.js.map +1 -1
- package/Select/index.js +0 -2
- package/Select/index.js.map +1 -1
- package/Skeleton/Skeleton.d.ts +6 -2
- package/Skeleton/Skeleton.js +8 -11
- package/Skeleton/Skeleton.js.map +1 -1
- package/Skeleton/Skeleton.stories.js +0 -6
- package/Skeleton/Skeleton.stories.js.map +1 -1
- package/Skeleton/index.js +0 -2
- package/Skeleton/index.js.map +1 -1
- package/Slider/Slider.js +7 -29
- package/Slider/Slider.js.map +1 -1
- package/Slider/Slider.stories.js +1 -9
- package/Slider/Slider.stories.js.map +1 -1
- package/Slider/index.js +0 -2
- package/Slider/index.js.map +1 -1
- package/Snackbar/Snackbar.js +0 -19
- package/Snackbar/Snackbar.js.map +1 -1
- package/Snackbar/Snackbar.stories.js +0 -23
- package/Snackbar/Snackbar.stories.js.map +1 -1
- package/Snackbar/index.js +0 -1
- package/Snackbar/index.js.map +1 -1
- package/Switch/Switch.d.ts +1 -1
- package/Switch/Switch.js +5 -28
- package/Switch/Switch.js.map +1 -1
- package/Switch/Switch.stories.js +0 -8
- package/Switch/Switch.stories.js.map +1 -1
- package/Switch/index.js +0 -2
- package/Switch/index.js.map +1 -1
- package/Tabs/Tab.d.ts +1 -0
- package/Tabs/Tab.js +3 -9
- package/Tabs/Tab.js.map +1 -1
- package/Tabs/Tabs.d.ts +1 -0
- package/Tabs/Tabs.js +15 -28
- package/Tabs/Tabs.js.map +1 -1
- package/Tabs/Tabs.stories.js +0 -10
- package/Tabs/Tabs.stories.js.map +1 -1
- package/Tabs/index.js +0 -4
- package/Tabs/index.js.map +1 -1
- package/Tags/Tags.d.ts +8 -15
- package/Tags/Tags.js +77 -130
- package/Tags/Tags.js.map +1 -1
- package/Tags/Tags.stories.js +0 -8
- package/Tags/Tags.stories.js.map +1 -1
- package/Tags/index.js +0 -2
- package/Tags/index.js.map +1 -1
- package/Tooltip/Tooltip.js +0 -19
- package/Tooltip/Tooltip.js.map +1 -1
- package/Tooltip/Tooltip.stories.js +0 -6
- package/Tooltip/Tooltip.stories.js.map +1 -1
- package/Tooltip/index.js +0 -2
- package/Tooltip/index.js.map +1 -1
- package/TopAppBar/TopAppBar.js +1 -8
- package/TopAppBar/TopAppBar.js.map +1 -1
- package/TopAppBar/TopAppBar.stories.js +3 -16
- package/TopAppBar/TopAppBar.stories.js.map +1 -1
- package/TopAppBar/TopAppBarActionItem.js +0 -5
- package/TopAppBar/TopAppBarActionItem.js.map +1 -1
- package/TopAppBar/TopAppBarNavigationIcon.js +0 -5
- package/TopAppBar/TopAppBarNavigationIcon.js.map +1 -1
- package/TopAppBar/TopAppBarPrimary.js +1 -8
- package/TopAppBar/TopAppBarPrimary.js.map +1 -1
- package/TopAppBar/TopAppBarSecondary.js +3 -10
- package/TopAppBar/TopAppBarSecondary.js.map +1 -1
- package/TopAppBar/TopAppBarSection.js +1 -8
- package/TopAppBar/TopAppBarSection.js.map +1 -1
- package/TopAppBar/TopAppBarTitle.js +1 -8
- package/TopAppBar/TopAppBarTitle.js.map +1 -1
- package/TopAppBar/index.js +0 -14
- package/TopAppBar/index.js.map +1 -1
- package/TopProgressBar/TopProgressBar.js +0 -5
- package/TopProgressBar/TopProgressBar.js.map +1 -1
- package/TopProgressBar/TopProgressBar.stories.js +1 -8
- package/TopProgressBar/TopProgressBar.stories.js.map +1 -1
- package/TopProgressBar/hoc/index.js +0 -2
- package/TopProgressBar/hoc/index.js.map +1 -1
- package/TopProgressBar/hoc/withTopProgressBar.js +2 -8
- package/TopProgressBar/hoc/withTopProgressBar.js.map +1 -1
- package/TopProgressBar/index.js +0 -2
- package/TopProgressBar/index.js.map +1 -1
- package/Typography/Typography.d.ts +2 -2
- package/Typography/Typography.js +0 -5
- package/Typography/Typography.js.map +1 -1
- package/Typography/Typography.stories.js +0 -6
- package/Typography/Typography.stories.js.map +1 -1
- package/Typography/index.js +0 -2
- package/Typography/index.js.map +1 -1
- package/package.json +17 -15
- package/types.d.ts +3 -3
- package/types.js.map +1 -1
package/Carousel/Carousel.js
CHANGED
|
@@ -1,38 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
-
|
|
12
9
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
-
|
|
14
10
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
15
|
-
|
|
16
11
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
17
|
-
|
|
18
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
19
|
-
|
|
20
13
|
var _react = _interopRequireDefault(require("react"));
|
|
21
|
-
|
|
22
14
|
var _nukaCarousel = _interopRequireDefault(require("nuka-carousel"));
|
|
23
|
-
|
|
24
15
|
var _pick = _interopRequireDefault(require("lodash/pick"));
|
|
25
|
-
|
|
26
16
|
var Carousel = /*#__PURE__*/function (_React$Component) {
|
|
27
17
|
(0, _inherits2.default)(Carousel, _React$Component);
|
|
28
|
-
|
|
29
18
|
var _super = (0, _createSuper2.default)(Carousel);
|
|
30
|
-
|
|
31
19
|
function Carousel() {
|
|
32
20
|
(0, _classCallCheck2.default)(this, Carousel);
|
|
33
21
|
return _super.apply(this, arguments);
|
|
34
22
|
}
|
|
35
|
-
|
|
36
23
|
(0, _createClass2.default)(Carousel, [{
|
|
37
24
|
key: "render",
|
|
38
25
|
value: function render() {
|
|
@@ -47,7 +34,6 @@ var Carousel = /*#__PURE__*/function (_React$Component) {
|
|
|
47
34
|
}]);
|
|
48
35
|
return Carousel;
|
|
49
36
|
}(_react.default.Component);
|
|
50
|
-
|
|
51
37
|
(0, _defineProperty2.default)(Carousel, "defaultProps", {
|
|
52
38
|
swiping: true,
|
|
53
39
|
dragging: false,
|
package/Carousel/Carousel.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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":"
|
|
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;AAA+B,IAgBzBA,QAAQ;EAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA,OAwBV,kBAAyB;MACrB,oBACI,6BAAC,qBAAY,oBACL,IAAAC,aAAI,EAAC,IAAI,CAACC,KAAK,EAAEF,QAAQ,CAACG,SAAS,CAAC,EACnC,IAAI,CAACD,KAAK,CAACE,mBAAmB,GAC7B;QAAEC,wBAAwB,EAAE,IAAI,CAACH,KAAK,CAACE;MAAoB,CAAC,GAC5D,CAAC,CAAC,EACH,IAAI,CAACF,KAAK,CAACI,eAAe,GACzB;QAAEC,yBAAyB,EAAE,IAAI,CAACL,KAAK,CAACI;MAAgB,CAAC,GACzD,CAAC,CAAC,EACH,IAAI,CAACJ,KAAK,CAACM,eAAe,GACzB;QAAEC,0BAA0B,EAAE,IAAI,CAACP,KAAK,CAACM;MAAgB,CAAC,GAC1D,CAAC,CAAC,GAEP,IAAI,CAACN,KAAK,CAACQ,QAAQ,CACT;IAEvB;EAAC;EAAA;AAAA,EAzCkBC,cAAK,CAACC,SAAS;AAAA,8BAAhCZ,QAAQ,kBACY;EAClBa,OAAO,EAAE,IAAI;EACbC,QAAQ,EAAE,KAAK;EACfC,UAAU,EAAE,OAAO;EACnBC,MAAM,EAAE;AACZ,CAAC;AAAA,8BANChB,QAAQ,eAQS,CACf,UAAU,EACV,YAAY,EACZ,UAAU,EACV,kBAAkB,EAClB,aAAa,EACb,UAAU,EACV,QAAQ,EACR,YAAY,EACZ,cAAc,EACd,YAAY,EACZ,OAAO,EACP,SAAS,EACT,gBAAgB,CACnB;AAAA,eAsBUA,QAAQ;AAAA"}
|
|
@@ -1,19 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
|
|
7
5
|
var _react2 = require("@storybook/react");
|
|
8
|
-
|
|
9
6
|
var _Story = require("@webiny/storybook-utils/Story");
|
|
10
|
-
|
|
11
7
|
var _addonKnobs = require("@storybook/addon-knobs");
|
|
12
|
-
|
|
13
8
|
var _README = _interopRequireDefault(require("./README.md"));
|
|
14
|
-
|
|
15
9
|
var _Carousel = _interopRequireDefault(require("./Carousel"));
|
|
16
|
-
|
|
17
10
|
var story = (0, _react2.storiesOf)("Components/Carousel", module);
|
|
18
11
|
story.addDecorator(_addonKnobs.withKnobs);
|
|
19
12
|
story.add("usage - single", function () {
|
|
@@ -1 +1 @@
|
|
|
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":"
|
|
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,iBAAS,EAAC,qBAAqB,EAAEC,MAAM,CAAC;AACtDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,gBAAgB,EAChB,YAAM;EACF,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA+C,gBACvE,6BAAC,iBAAQ,qBACL;IAAK,GAAG,EAAC;EAAyD,EAAG,eACrE;IAAK,GAAG,EAAC;EAAyD,EAAG,eACrE;IAAK,GAAG,EAAC;EAAyD,EAAG,eACrE;IAAK,GAAG,EAAC;EAAyD,EAAG,eACrE;IAAK,GAAG,EAAC;EAAyD,EAAG,eACrE;IAAK,GAAG,EAAC;EAAyD,EAAG,CAC9D,CACO,eACtB,6BAAC,uBAAgB,wqBAWE,CACR,CACX;AAEhB,CAAC,EACD;EAAEC,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,iBAAQ;EAAE;AAAE,CAAC,CACvC"}
|
package/Carousel/index.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "Carousel", {
|
|
|
11
10
|
return _Carousel.default;
|
|
12
11
|
}
|
|
13
12
|
});
|
|
14
|
-
|
|
15
13
|
var _Carousel = _interopRequireDefault(require("./Carousel"));
|
package/Carousel/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Carousel } from \"./Carousel\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Carousel } from \"./Carousel\";\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
package/Checkbox/Checkbox.d.ts
CHANGED
package/Checkbox/Checkbox.js
CHANGED
|
@@ -1,30 +1,19 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
-
|
|
12
9
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
-
|
|
14
10
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
15
|
-
|
|
16
11
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
17
|
-
|
|
18
12
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
19
|
-
|
|
20
13
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
21
|
-
|
|
22
14
|
var _react = _interopRequireDefault(require("react"));
|
|
23
|
-
|
|
24
15
|
var _checkbox = require("@rmwc/checkbox");
|
|
25
|
-
|
|
26
16
|
var _FormElementMessage = require("../FormElementMessage");
|
|
27
|
-
|
|
28
17
|
/**
|
|
29
18
|
* Single Checkbox component can be used to store simple boolean values.
|
|
30
19
|
*
|
|
@@ -33,41 +22,33 @@ var _FormElementMessage = require("../FormElementMessage");
|
|
|
33
22
|
*/
|
|
34
23
|
var Checkbox = /*#__PURE__*/function (_React$Component) {
|
|
35
24
|
(0, _inherits2.default)(Checkbox, _React$Component);
|
|
36
|
-
|
|
37
25
|
var _super = (0, _createSuper2.default)(Checkbox);
|
|
38
|
-
|
|
39
26
|
function Checkbox() {
|
|
40
27
|
var _this;
|
|
41
|
-
|
|
42
28
|
(0, _classCallCheck2.default)(this, Checkbox);
|
|
43
|
-
|
|
44
29
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
45
30
|
args[_key] = arguments[_key];
|
|
46
31
|
}
|
|
47
|
-
|
|
48
32
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
49
33
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (e) {
|
|
50
34
|
_this.props.onChange && _this.props.onChange(e.target.checked);
|
|
51
35
|
});
|
|
52
36
|
return _this;
|
|
53
37
|
}
|
|
54
|
-
|
|
55
38
|
(0, _createClass2.default)(Checkbox, [{
|
|
56
39
|
key: "render",
|
|
57
40
|
value: function render() {
|
|
58
41
|
var _this$props = this.props,
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
42
|
+
value = _this$props.value,
|
|
43
|
+
label = _this$props.label,
|
|
44
|
+
disabled = _this$props.disabled,
|
|
45
|
+
indeterminate = _this$props.indeterminate,
|
|
46
|
+
description = _this$props.description,
|
|
47
|
+
validation = _this$props.validation,
|
|
48
|
+
_onClick = _this$props.onClick;
|
|
67
49
|
var _ref = validation || {},
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
50
|
+
validationIsValid = _ref.isValid,
|
|
51
|
+
validationMessage = _ref.message;
|
|
71
52
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_checkbox.Checkbox, {
|
|
72
53
|
indeterminate: indeterminate,
|
|
73
54
|
disabled: disabled,
|
|
@@ -75,9 +56,11 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
|
|
|
75
56
|
onChange: this.onChange,
|
|
76
57
|
onClick: function onClick() {
|
|
77
58
|
return typeof _onClick === "function" && _onClick(Boolean(value));
|
|
78
|
-
}
|
|
59
|
+
}
|
|
60
|
+
// @ts-ignore Although the label is React.ReactNode internally, an error is still thrown.
|
|
79
61
|
,
|
|
80
|
-
label: label
|
|
62
|
+
label: label,
|
|
63
|
+
"data-testid": this.props["data-testid"]
|
|
81
64
|
}), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
|
|
82
65
|
error: true
|
|
83
66
|
}, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
|
|
@@ -85,6 +68,5 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
|
|
|
85
68
|
}]);
|
|
86
69
|
return Checkbox;
|
|
87
70
|
}(_react.default.Component);
|
|
88
|
-
|
|
89
71
|
var _default = Checkbox;
|
|
90
72
|
exports.default = _default;
|
package/Checkbox/Checkbox.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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":"
|
|
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 // For testing purposes.\n \"data-testid\"?: 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 data-testid={this.props[\"data-testid\"]}\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;AAuBA;AACA;AACA;AACA;AACA;AACA;AALA,IAMMA,QAAQ;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;MAAA;IAAA;IAAA;IAAA,uFACC,UAACC,CAAyC,EAAK;MACtD,MAAKC,KAAK,CAACC,QAAQ,IAAI,MAAKD,KAAK,CAACC,QAAQ,CAAEF,CAAC,CAACG,MAAM,CAASC,OAAO,CAAC;IACzE,CAAC;IAAA;EAAA;EAAA;IAAA;IAAA,OAED,kBAAyB;MACrB,kBACI,IAAI,CAACH,KAAK;QADNI,KAAK,eAALA,KAAK;QAAEC,KAAK,eAALA,KAAK;QAAEC,QAAQ,eAARA,QAAQ;QAAEC,aAAa,eAAbA,aAAa;QAAEC,WAAW,eAAXA,WAAW;QAAEC,UAAU,eAAVA,UAAU;QAAEC,QAAO,eAAPA,OAAO;MAG/E,WAAmED,UAAU,IAAI,CAAC,CAAC;QAAlEE,iBAAiB,QAA1BC,OAAO;QAA8BC,iBAAiB,QAA1BC,OAAO;MAE3C,oBACI,6BAAC,cAAK,CAAC,QAAQ,qBACX,6BAAC,kBAAY;QACT,aAAa,EAAEP,aAAc;QAC7B,QAAQ,EAAED,QAAS;QACnB,OAAO,EAAES,OAAO,CAACX,KAAK,CAAE;QACxB,QAAQ,EAAE,IAAI,CAACH,QAAS;QACxB,OAAO,EAAE;UAAA,OAAM,OAAOS,QAAO,KAAK,UAAU,IAAIA,QAAO,CAACK,OAAO,CAACX,KAAK,CAAC,CAAC;QAAA;QACvE;QAAA;QACA,KAAK,EAAEC,KAAM;QACb,eAAa,IAAI,CAACL,KAAK,CAAC,aAAa;MAAE,EACzC,EACDW,iBAAiB,KAAK,KAAK,iBACxB,6BAAC,sCAAkB;QAAC,KAAK;MAAA,GAAEE,iBAAiB,CAC/C,EAEAF,iBAAiB,KAAK,KAAK,IAAIH,WAAW,iBACvC,6BAAC,sCAAkB,QAAEA,WAAW,CACnC,CACY;IAEzB;EAAC;EAAA;AAAA,EAhCkBQ,cAAK,CAACC,SAAS;AAAA,eAmCvBnB,QAAQ;AAAA"}
|
|
@@ -1,21 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
|
|
7
5
|
var _react2 = require("@storybook/react");
|
|
8
|
-
|
|
9
6
|
var _Story = require("@webiny/storybook-utils/Story");
|
|
10
|
-
|
|
11
7
|
var _addonKnobs = require("@storybook/addon-knobs");
|
|
12
|
-
|
|
13
8
|
var _README_Checkbox = _interopRequireDefault(require("./README_Checkbox.md"));
|
|
14
|
-
|
|
15
9
|
var _form = require("@webiny/form");
|
|
16
|
-
|
|
17
10
|
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
18
|
-
|
|
19
11
|
var story = (0, _react2.storiesOf)("Components/Checkbox", module);
|
|
20
12
|
story.addDecorator(_addonKnobs.withKnobs);
|
|
21
13
|
story.add("usage - single", function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","readme","Bind","info","propTables","Checkbox"],"sources":["Checkbox.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, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_Checkbox.md\";\n\nimport { Form } from \"@webiny/form\";\nimport Checkbox from \"./Checkbox\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage - single\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple checkbox with a label and description\"}>\n <Form>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Checkbox\n label={\"Remember me\"}\n disabled={disabled}\n description={\n \"You won't be logged out after you leave the app.\"\n }\n />\n </Bind>\n )}\n </Form>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Form>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Checkbox\n label={\"Remember me\"}\n disabled={disabled}\n description={\"You won't be logged out after you leave the app.\"}\n />\n </Bind>\n )}\n </Form>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Checkbox] } }\n);\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","readme","Bind","info","propTables","Checkbox"],"sources":["Checkbox.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, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_Checkbox.md\";\n\nimport { Form } from \"@webiny/form\";\nimport Checkbox from \"./Checkbox\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage - single\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple checkbox with a label and description\"}>\n <Form>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Checkbox\n label={\"Remember me\"}\n disabled={disabled}\n description={\n \"You won't be logged out after you leave the app.\"\n }\n />\n </Bind>\n )}\n </Form>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Form>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Checkbox\n label={\"Remember me\"}\n disabled={disabled}\n description={\"You won't be logged out after you leave the app.\"}\n />\n </Bind>\n )}\n </Form>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Checkbox] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AACA;AAEA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,qBAAqB,EAAEC,MAAM,CAAC;AACtDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,gBAAgB,EAChB,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAO,EAAC,UAAU,EAAE,KAAK,CAAC;EAE3C,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,wBAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA+C,gBACvE,6BAAC,UAAI,QACA;IAAA,IAAGC,IAAI,QAAJA,IAAI;IAAA,oBACJ,6BAAC,IAAI;MAAC,IAAI,EAAC;IAAY,gBACnB,6BAAC,iBAAQ;MACL,KAAK,EAAE,aAAc;MACrB,QAAQ,EAAEH,QAAS;MACnB,WAAW,EACP;IACH,EACH,CACC;EAAA,CACV,CACE,CACW,eACtB,6BAAC,uBAAgB,4iBAcE,CACR,CACX;AAEhB,CAAC,EACD;EAAEI,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,iBAAQ;EAAE;AAAE,CAAC,CACvC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["webinyCheckboxTitle","css","textTransform","fontWeight","marginBottom"],"sources":["Checkbox.styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst webinyCheckboxTitle = css(\n {},\n {\n \"&.mdc-text-field-helper-text\": {\n //paddingLeft: 10,\n textTransform: \"uppercase\",\n fontWeight: \"bold\",\n marginBottom: \"5px\"\n }\n }\n);\n\nexport { webinyCheckboxTitle };\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["webinyCheckboxTitle","css","textTransform","fontWeight","marginBottom"],"sources":["Checkbox.styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst webinyCheckboxTitle = css(\n {},\n {\n \"&.mdc-text-field-helper-text\": {\n //paddingLeft: 10,\n textTransform: \"uppercase\",\n fontWeight: \"bold\",\n marginBottom: \"5px\"\n }\n }\n);\n\nexport { webinyCheckboxTitle };\n"],"mappings":";;;;;;AAAA;AAEA;AACA;AACA;AACA;AACA,IAAMA,mBAAmB,gBAAG,IAAAC,YAAG,EAC3B,CAAC,CAAC,EACF;EACI,8BAA8B,EAAE;IAC5B;IACAC,aAAa,EAAE,WAAW;IAC1BC,UAAU,EAAE,MAAM;IAClBC,YAAY,EAAE;EAClB;AACJ,CAAC,+BACJ;AAAC"}
|
|
@@ -1,51 +1,37 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
11
|
-
|
|
12
9
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
13
|
-
|
|
14
10
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
15
|
-
|
|
16
11
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
17
|
-
|
|
18
12
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
19
|
-
|
|
20
13
|
var _react = _interopRequireDefault(require("react"));
|
|
21
|
-
|
|
22
14
|
var _Checkbox = require("./Checkbox.styles");
|
|
23
|
-
|
|
24
15
|
var _FormElementMessage = require("../FormElementMessage");
|
|
25
|
-
|
|
26
16
|
var CheckboxGroup = /*#__PURE__*/function (_React$Component) {
|
|
27
17
|
(0, _inherits2.default)(CheckboxGroup, _React$Component);
|
|
28
|
-
|
|
29
18
|
var _super = (0, _createSuper2.default)(CheckboxGroup);
|
|
30
|
-
|
|
31
19
|
function CheckboxGroup() {
|
|
32
20
|
(0, _classCallCheck2.default)(this, CheckboxGroup);
|
|
33
21
|
return _super.apply(this, arguments);
|
|
34
22
|
}
|
|
35
|
-
|
|
36
23
|
(0, _createClass2.default)(CheckboxGroup, [{
|
|
37
24
|
key: "render",
|
|
38
25
|
value: function render() {
|
|
39
26
|
var _this = this;
|
|
40
|
-
|
|
41
27
|
var _this$props = this.props,
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
28
|
+
description = _this$props.description,
|
|
29
|
+
label = _this$props.label,
|
|
30
|
+
_this$props$validatio = _this$props.validation,
|
|
31
|
+
validation = _this$props$validatio === void 0 ? {
|
|
32
|
+
isValid: null,
|
|
33
|
+
message: null
|
|
34
|
+
} : _this$props$validatio;
|
|
49
35
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, label && /*#__PURE__*/_react.default.createElement("div", {
|
|
50
36
|
className: "mdc-text-field-helper-text mdc-text-field-helper-text--persistent " + _Checkbox.webinyCheckboxTitle
|
|
51
37
|
}, label), this.props.children({
|
|
@@ -53,13 +39,11 @@ var CheckboxGroup = /*#__PURE__*/function (_React$Component) {
|
|
|
53
39
|
return function () {
|
|
54
40
|
var values = Array.isArray(_this.props.value) ? (0, _toConsumableArray2.default)(_this.props.value) : [];
|
|
55
41
|
var index = values.indexOf(value);
|
|
56
|
-
|
|
57
42
|
if (index > -1) {
|
|
58
43
|
values.splice(index, 1);
|
|
59
44
|
} else {
|
|
60
45
|
values.push(value);
|
|
61
46
|
}
|
|
62
|
-
|
|
63
47
|
_this.props.onChange && _this.props.onChange(values);
|
|
64
48
|
};
|
|
65
49
|
},
|
|
@@ -74,6 +58,5 @@ var CheckboxGroup = /*#__PURE__*/function (_React$Component) {
|
|
|
74
58
|
}]);
|
|
75
59
|
return CheckboxGroup;
|
|
76
60
|
}(_react.default.Component);
|
|
77
|
-
|
|
78
61
|
var _default = CheckboxGroup;
|
|
79
62
|
exports.default = _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["CheckboxGroup","props","description","label","validation","isValid","message","webinyCheckboxTitle","children","onChange","value","values","Array","isArray","index","indexOf","splice","push","getValue","id","includes","React","Component"],"sources":["CheckboxGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"./../types\";\nimport { webinyCheckboxTitle } from \"./Checkbox.styles\";\nimport { FormElementMessage } from \"../FormElementMessage\";\n\nexport interface ChildrenRenderProp {\n onChange: (id: string | number) => () => void;\n getValue: (id: string | number) => boolean;\n}\n\ntype Props = FormComponentProps & {\n // Form element's label.\n label?: string;\n\n // Form element's description.\n description?: string;\n\n // An array of Checkbox components.\n children: (props: ChildrenRenderProp) => React.ReactNode;\n};\n\nclass CheckboxGroup extends React.Component<Props> {\n public override render() {\n const { description, label, validation = { isValid: null, message: null } } = this.props;\n\n return (\n <React.Fragment>\n {label && (\n <div\n className={\n \"mdc-text-field-helper-text mdc-text-field-helper-text--persistent \" +\n webinyCheckboxTitle\n }\n >\n {label}\n </div>\n )}\n\n {this.props.children({\n onChange: value => {\n return () => {\n const values = Array.isArray(this.props.value)\n ? [...this.props.value]\n : [];\n const index = values.indexOf(value);\n if (index > -1) {\n values.splice(index, 1);\n } else {\n values.push(value);\n }\n\n this.props.onChange && this.props.onChange(values);\n };\n },\n getValue: id => {\n const values = Array.isArray(this.props.value) ? this.props.value : [];\n return values.includes(id);\n }\n })}\n\n {validation.isValid === false && (\n <FormElementMessage error>{validation.message}</FormElementMessage>\n )}\n\n {validation.isValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n }\n}\n\nexport default CheckboxGroup;\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["CheckboxGroup","props","description","label","validation","isValid","message","webinyCheckboxTitle","children","onChange","value","values","Array","isArray","index","indexOf","splice","push","getValue","id","includes","React","Component"],"sources":["CheckboxGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentProps } from \"./../types\";\nimport { webinyCheckboxTitle } from \"./Checkbox.styles\";\nimport { FormElementMessage } from \"../FormElementMessage\";\n\nexport interface ChildrenRenderProp {\n onChange: (id: string | number) => () => void;\n getValue: (id: string | number) => boolean;\n}\n\ntype Props = FormComponentProps & {\n // Form element's label.\n label?: string;\n\n // Form element's description.\n description?: string;\n\n // An array of Checkbox components.\n children: (props: ChildrenRenderProp) => React.ReactNode;\n};\n\nclass CheckboxGroup extends React.Component<Props> {\n public override render() {\n const { description, label, validation = { isValid: null, message: null } } = this.props;\n\n return (\n <React.Fragment>\n {label && (\n <div\n className={\n \"mdc-text-field-helper-text mdc-text-field-helper-text--persistent \" +\n webinyCheckboxTitle\n }\n >\n {label}\n </div>\n )}\n\n {this.props.children({\n onChange: value => {\n return () => {\n const values = Array.isArray(this.props.value)\n ? [...this.props.value]\n : [];\n const index = values.indexOf(value);\n if (index > -1) {\n values.splice(index, 1);\n } else {\n values.push(value);\n }\n\n this.props.onChange && this.props.onChange(values);\n };\n },\n getValue: id => {\n const values = Array.isArray(this.props.value) ? this.props.value : [];\n return values.includes(id);\n }\n })}\n\n {validation.isValid === false && (\n <FormElementMessage error>{validation.message}</FormElementMessage>\n )}\n\n {validation.isValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n }\n}\n\nexport default CheckboxGroup;\n"],"mappings":";;;;;;;;;;;;AAAA;AAEA;AACA;AAA2D,IAkBrDA,aAAa;EAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA,OACf,kBAAyB;MAAA;MACrB,kBAA8E,IAAI,CAACC,KAAK;QAAhFC,WAAW,eAAXA,WAAW;QAAEC,KAAK,eAALA,KAAK;QAAA,oCAAEC,UAAU;QAAVA,UAAU,sCAAG;UAAEC,OAAO,EAAE,IAAI;UAAEC,OAAO,EAAE;QAAK,CAAC;MAEzE,oBACI,6BAAC,cAAK,CAAC,QAAQ,QACVH,KAAK,iBACF;QACI,SAAS,EACL,oEAAoE,GACpEI;MACH,GAEAJ,KAAK,CAEb,EAEA,IAAI,CAACF,KAAK,CAACO,QAAQ,CAAC;QACjBC,QAAQ,EAAE,kBAAAC,KAAK,EAAI;UACf,OAAO,YAAM;YACT,IAAMC,MAAM,GAAGC,KAAK,CAACC,OAAO,CAAC,KAAI,CAACZ,KAAK,CAACS,KAAK,CAAC,oCACpC,KAAI,CAACT,KAAK,CAACS,KAAK,IACpB,EAAE;YACR,IAAMI,KAAK,GAAGH,MAAM,CAACI,OAAO,CAACL,KAAK,CAAC;YACnC,IAAII,KAAK,GAAG,CAAC,CAAC,EAAE;cACZH,MAAM,CAACK,MAAM,CAACF,KAAK,EAAE,CAAC,CAAC;YAC3B,CAAC,MAAM;cACHH,MAAM,CAACM,IAAI,CAACP,KAAK,CAAC;YACtB;YAEA,KAAI,CAACT,KAAK,CAACQ,QAAQ,IAAI,KAAI,CAACR,KAAK,CAACQ,QAAQ,CAACE,MAAM,CAAC;UACtD,CAAC;QACL,CAAC;QACDO,QAAQ,EAAE,kBAAAC,EAAE,EAAI;UACZ,IAAMR,MAAM,GAAGC,KAAK,CAACC,OAAO,CAAC,KAAI,CAACZ,KAAK,CAACS,KAAK,CAAC,GAAG,KAAI,CAACT,KAAK,CAACS,KAAK,GAAG,EAAE;UACtE,OAAOC,MAAM,CAACS,QAAQ,CAACD,EAAE,CAAC;QAC9B;MACJ,CAAC,CAAC,EAEDf,UAAU,CAACC,OAAO,KAAK,KAAK,iBACzB,6BAAC,sCAAkB;QAAC,KAAK;MAAA,GAAED,UAAU,CAACE,OAAO,CAChD,EAEAF,UAAU,CAACC,OAAO,KAAK,KAAK,IAAIH,WAAW,iBACxC,6BAAC,sCAAkB,QAAEA,WAAW,CACnC,CACY;IAEzB;EAAC;EAAA;AAAA,EAhDuBmB,cAAK,CAACC,SAAS;AAAA,eAmD5BtB,aAAa;AAAA"}
|
|
@@ -1,21 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
|
|
7
5
|
var _react2 = require("@storybook/react");
|
|
8
|
-
|
|
9
6
|
var _Story = require("@webiny/storybook-utils/Story");
|
|
10
|
-
|
|
11
7
|
var _addonKnobs = require("@storybook/addon-knobs");
|
|
12
|
-
|
|
13
8
|
var _README_CheckboxGroup = _interopRequireDefault(require("./README_CheckboxGroup.md"));
|
|
14
|
-
|
|
15
9
|
var _form = require("@webiny/form");
|
|
16
|
-
|
|
17
10
|
var _ = require(".");
|
|
18
|
-
|
|
19
11
|
var story = (0, _react2.storiesOf)("Components/Checkbox", module);
|
|
20
12
|
story.addDecorator(_addonKnobs.withKnobs);
|
|
21
13
|
story.add("usage - group", function () {
|
|
@@ -45,10 +37,10 @@ story.add("usage - group", function () {
|
|
|
45
37
|
description: "Choose only fruits you like."
|
|
46
38
|
}, function (_ref2) {
|
|
47
39
|
var onChange = _ref2.onChange,
|
|
48
|
-
|
|
40
|
+
getValue = _ref2.getValue;
|
|
49
41
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, options.map(function (_ref3) {
|
|
50
42
|
var id = _ref3.id,
|
|
51
|
-
|
|
43
|
+
name = _ref3.name;
|
|
52
44
|
return /*#__PURE__*/_react.default.createElement(_.Checkbox, {
|
|
53
45
|
disabled: disabled,
|
|
54
46
|
key: id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","options","id","name","readme","fruits","Bind","onChange","getValue","map","info","propTables","CheckboxGroup"],"sources":["CheckboxGroup.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, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_CheckboxGroup.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Checkbox, CheckboxGroup } from \".\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage - group\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n const options = [\n { id: \"apple\", name: \"Apple\" },\n { id: \"pear\", name: \"Pear\" },\n { id: \"orange\", name: \"Orange\" }\n ];\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple checkbox with label and description\"}>\n <Form data={{ fruits: [\"pear\"] }}>\n {({ Bind }) => (\n <Bind name=\"fruits\">\n <CheckboxGroup\n label=\"Fruits selection\"\n description={\"Choose only fruits you like.\"}\n >\n {({ onChange, getValue }) => (\n <React.Fragment>\n {options.map(({ id, name }) => (\n <Checkbox\n disabled={disabled}\n key={id}\n label={name}\n value={getValue(id)}\n onChange={onChange(id)}\n />\n ))}\n </React.Fragment>\n )}\n </CheckboxGroup>\n </Bind>\n )}\n </Form>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Form data={{fruits: ['pear']}}>\n {({ Bind }) => (\n <Bind name=\"fruits\">\n <CheckboxGroup\n label=\"Fruits selection\"\n description={\"Choose only fruits you like.\"}\n >\n {({ onChange, getValue }) => (\n <React.Fragment>\n {options.map(({id, name}) => (\n <Checkbox\n disabled={disabled}\n key={id}\n label={name}\n value={getValue(id)}\n onChange={onChange(id)}\n />\n ))}\n </React.Fragment>\n )}\n </CheckboxGroup>\n </Bind>\n )}\n </Form>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [CheckboxGroup] } }\n);\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","options","id","name","readme","fruits","Bind","onChange","getValue","map","info","propTables","CheckboxGroup"],"sources":["CheckboxGroup.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, boolean } from \"@storybook/addon-knobs\";\nimport readme from \"./README_CheckboxGroup.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Checkbox, CheckboxGroup } from \".\";\n\nconst story = storiesOf(\"Components/Checkbox\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage - group\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n const options = [\n { id: \"apple\", name: \"Apple\" },\n { id: \"pear\", name: \"Pear\" },\n { id: \"orange\", name: \"Orange\" }\n ];\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple checkbox with label and description\"}>\n <Form data={{ fruits: [\"pear\"] }}>\n {({ Bind }) => (\n <Bind name=\"fruits\">\n <CheckboxGroup\n label=\"Fruits selection\"\n description={\"Choose only fruits you like.\"}\n >\n {({ onChange, getValue }) => (\n <React.Fragment>\n {options.map(({ id, name }) => (\n <Checkbox\n disabled={disabled}\n key={id}\n label={name}\n value={getValue(id)}\n onChange={onChange(id)}\n />\n ))}\n </React.Fragment>\n )}\n </CheckboxGroup>\n </Bind>\n )}\n </Form>\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <Form data={{fruits: ['pear']}}>\n {({ Bind }) => (\n <Bind name=\"fruits\">\n <CheckboxGroup\n label=\"Fruits selection\"\n description={\"Choose only fruits you like.\"}\n >\n {({ onChange, getValue }) => (\n <React.Fragment>\n {options.map(({id, name}) => (\n <Checkbox\n disabled={disabled}\n key={id}\n label={name}\n value={getValue(id)}\n onChange={onChange(id)}\n />\n ))}\n </React.Fragment>\n )}\n </CheckboxGroup>\n </Bind>\n )}\n </Form>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [CheckboxGroup] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AACA;AAEA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,qBAAqB,EAAEC,MAAM,CAAC;AACtDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,eAAe,EACf,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAO,EAAC,UAAU,EAAE,KAAK,CAAC;EAE3C,IAAMC,OAAO,GAAG,CACZ;IAAEC,EAAE,EAAE,OAAO;IAAEC,IAAI,EAAE;EAAQ,CAAC,EAC9B;IAAED,EAAE,EAAE,MAAM;IAAEC,IAAI,EAAE;EAAO,CAAC,EAC5B;IAAED,EAAE,EAAE,QAAQ;IAAEC,IAAI,EAAE;EAAS,CAAC,CACnC;EAED,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,6BAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA6C,gBACrE,6BAAC,UAAI;IAAC,IAAI,EAAE;MAAEC,MAAM,EAAE,CAAC,MAAM;IAAE;EAAE,GAC5B;IAAA,IAAGC,IAAI,QAAJA,IAAI;IAAA,oBACJ,6BAAC,IAAI;MAAC,IAAI,EAAC;IAAQ,gBACf,6BAAC,eAAa;MACV,KAAK,EAAC,kBAAkB;MACxB,WAAW,EAAE;IAA+B,GAE3C;MAAA,IAAGC,QAAQ,SAARA,QAAQ;QAAEC,QAAQ,SAARA,QAAQ;MAAA,oBAClB,6BAAC,cAAK,CAAC,QAAQ,QACVP,OAAO,CAACQ,GAAG,CAAC;QAAA,IAAGP,EAAE,SAAFA,EAAE;UAAEC,IAAI,SAAJA,IAAI;QAAA,oBACpB,6BAAC,UAAQ;UACL,QAAQ,EAAEJ,QAAS;UACnB,GAAG,EAAEG,EAAG;UACR,KAAK,EAAEC,IAAK;UACZ,KAAK,EAAEK,QAAQ,CAACN,EAAE,CAAE;UACpB,QAAQ,EAAEK,QAAQ,CAACL,EAAE;QAAE,EACzB;MAAA,CACL,CAAC,CACW;IAAA,CACpB,CACW,CACb;EAAA,CACV,CACE,CACW,eACtB,6BAAC,uBAAgB,01CA2BE,CACR,CACX;AAEhB,CAAC,EACD;EAAEQ,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,eAAa;EAAE;AAAE,CAAC,CAC5C"}
|
package/Checkbox/index.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
@@ -17,7 +16,5 @@ Object.defineProperty(exports, "CheckboxGroup", {
|
|
|
17
16
|
return _CheckboxGroup.default;
|
|
18
17
|
}
|
|
19
18
|
});
|
|
20
|
-
|
|
21
19
|
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
22
|
-
|
|
23
20
|
var _CheckboxGroup = _interopRequireDefault(require("./CheckboxGroup"));
|
package/Checkbox/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Checkbox } from \"./Checkbox\";\nexport { default as CheckboxGroup } from \"./CheckboxGroup\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Checkbox } from \"./Checkbox\";\nexport { default as CheckboxGroup } from \"./CheckboxGroup\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AACA"}
|
package/Chips/Chip.js
CHANGED
|
@@ -1,24 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.Chip = void 0;
|
|
9
|
-
|
|
10
8
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
11
|
-
|
|
12
9
|
var _react = _interopRequireDefault(require("react"));
|
|
13
|
-
|
|
14
10
|
var _chip = require("@rmwc/chip");
|
|
15
|
-
|
|
16
11
|
var _excluded = ["children"];
|
|
17
|
-
|
|
18
12
|
var Chip = function Chip(props) {
|
|
19
13
|
var children = props.children,
|
|
20
|
-
|
|
14
|
+
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
21
15
|
return /*#__PURE__*/_react.default.createElement(_chip.Chip, rest, children);
|
|
22
16
|
};
|
|
23
|
-
|
|
24
17
|
exports.Chip = Chip;
|
package/Chips/Chip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Chip","props","children","rest"],"sources":["Chip.tsx"],"sourcesContent":["import React from \"react\";\nimport { Chip as RmwcChip, ChipProps as RmwcChipProps } from \"@rmwc/chip\";\n\nexport type ChipProps = RmwcChipProps;\n\nexport const Chip: React.FC<ChipProps> = props => {\n const { children, ...rest } = props;\n return <RmwcChip {...rest}>{children}</RmwcChip>;\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["Chip","props","children","rest"],"sources":["Chip.tsx"],"sourcesContent":["import React from \"react\";\nimport { Chip as RmwcChip, ChipProps as RmwcChipProps } from \"@rmwc/chip\";\n\nexport type ChipProps = RmwcChipProps;\n\nexport const Chip: React.FC<ChipProps> = props => {\n const { children, ...rest } = props;\n return <RmwcChip {...rest}>{children}</RmwcChip>;\n};\n"],"mappings":";;;;;;;;AAAA;AACA;AAA0E;AAInE,IAAMA,IAAyB,GAAG,SAA5BA,IAAyB,CAAGC,KAAK,EAAI;EAC9C,IAAQC,QAAQ,GAAcD,KAAK,CAA3BC,QAAQ;IAAKC,IAAI,0CAAKF,KAAK;EACnC,oBAAO,6BAAC,UAAQ,EAAKE,IAAI,EAAGD,QAAQ,CAAY;AACpD,CAAC;AAAC"}
|
package/Chips/Chips.js
CHANGED
|
@@ -1,34 +1,24 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.Chips = void 0;
|
|
9
|
-
|
|
10
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
|
|
12
9
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
13
|
-
|
|
14
10
|
var _react = _interopRequireDefault(require("react"));
|
|
15
|
-
|
|
16
11
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
17
|
-
|
|
18
12
|
var _chip = require("@rmwc/chip");
|
|
19
|
-
|
|
20
13
|
var _styles = require("./styles");
|
|
21
|
-
|
|
22
14
|
var _excluded = ["children", "className", "disabled"];
|
|
23
|
-
|
|
24
15
|
var Chips = function Chips(props) {
|
|
25
16
|
var children = props.children,
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
17
|
+
className = props.className,
|
|
18
|
+
disabled = props.disabled,
|
|
19
|
+
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
29
20
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_chip.ChipSet, Object.assign({}, rest, {
|
|
30
21
|
className: (0, _classnames.default)(className, _styles.chipIconWrapper, (0, _defineProperty2.default)({}, _styles.disabledChips, disabled))
|
|
31
22
|
}), children));
|
|
32
23
|
};
|
|
33
|
-
|
|
34
24
|
exports.Chips = Chips;
|