@webiny/ui 5.34.8 → 5.35.0-beta.1
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 +4 -14
- 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 +4 -1
- package/Accordion/AccordionItem.js +5 -26
- package/Accordion/AccordionItem.js.map +1 -1
- package/Accordion/AccordionItemActions.js +2 -10
- package/Accordion/AccordionItemActions.js.map +1 -1
- package/Accordion/index.js +0 -4
- package/Accordion/index.js.map +1 -1
- package/Alert/Alert.js +3 -10
- 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.js +39 -59
- 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 -11
- 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 +14 -1
- package/DataTable/DataTable.js +60 -45
- 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 +29 -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 +5 -40
- 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.js +34 -60
- 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 +7 -45
- 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 +8 -18
- 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 +4 -29
- 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.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.js +0 -9
- package/Tabs/Tab.js.map +1 -1
- package/Tabs/Tabs.js +15 -29
- 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.js +13 -37
- 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.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 +16 -15
package/Slider/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, "Slider", {
|
|
|
11
10
|
return _Slider.default;
|
|
12
11
|
}
|
|
13
12
|
});
|
|
14
|
-
|
|
15
13
|
var _Slider = _interopRequireDefault(require("./Slider"));
|
package/Slider/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Slider } from \"./Slider\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as Slider } from \"./Slider\";\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
package/Snackbar/Snackbar.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
|
});
|
|
@@ -12,51 +11,34 @@ Object.defineProperty(exports, "SnackbarAction", {
|
|
|
12
11
|
return _snackbar.SnackbarAction;
|
|
13
12
|
}
|
|
14
13
|
});
|
|
15
|
-
|
|
16
14
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
17
|
-
|
|
18
15
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
19
|
-
|
|
20
16
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
21
|
-
|
|
22
17
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
23
|
-
|
|
24
18
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
25
|
-
|
|
26
19
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
27
|
-
|
|
28
20
|
var _react = _interopRequireDefault(require("react"));
|
|
29
|
-
|
|
30
21
|
var _snackbar = require("@rmwc/snackbar");
|
|
31
|
-
|
|
32
22
|
/**
|
|
33
23
|
* Use Snackbar component to display an informative or alert message and allow users to act upon it.
|
|
34
24
|
*/
|
|
35
25
|
var Snackbar = /*#__PURE__*/function (_React$Component) {
|
|
36
26
|
(0, _inherits2.default)(Snackbar, _React$Component);
|
|
37
|
-
|
|
38
27
|
var _super = (0, _createSuper2.default)(Snackbar);
|
|
39
|
-
|
|
40
28
|
function Snackbar(props) {
|
|
41
29
|
var _this;
|
|
42
|
-
|
|
43
30
|
(0, _classCallCheck2.default)(this, Snackbar);
|
|
44
31
|
_this = _super.call(this, props);
|
|
45
32
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "container", null);
|
|
46
33
|
_this.container = document.getElementById("snackbar-container");
|
|
47
|
-
|
|
48
34
|
if (!_this.container) {
|
|
49
35
|
_this.container = document.createElement("div");
|
|
50
|
-
|
|
51
36
|
_this.container.setAttribute("id", "snackbar-container");
|
|
52
|
-
|
|
53
37
|
var container = _this.container;
|
|
54
38
|
document.body && document.body.appendChild(container);
|
|
55
39
|
}
|
|
56
|
-
|
|
57
40
|
return _this;
|
|
58
41
|
}
|
|
59
|
-
|
|
60
42
|
(0, _createClass2.default)(Snackbar, [{
|
|
61
43
|
key: "render",
|
|
62
44
|
value: function render() {
|
|
@@ -65,5 +47,4 @@ var Snackbar = /*#__PURE__*/function (_React$Component) {
|
|
|
65
47
|
}]);
|
|
66
48
|
return Snackbar;
|
|
67
49
|
}(_react.default.Component);
|
|
68
|
-
|
|
69
50
|
exports.Snackbar = Snackbar;
|
package/Snackbar/Snackbar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Snackbar","props","container","document","getElementById","createElement","setAttribute","body","appendChild","React","Component"],"sources":["Snackbar.tsx"],"sourcesContent":["import React from \"react\";\nimport { Snackbar as RmwcSnackbar, SnackbarAction, SnackbarProps } from \"@rmwc/snackbar\";\n\ntype Props = SnackbarProps;\n\n/**\n * Use Snackbar component to display an informative or alert message and allow users to act upon it.\n */\nclass Snackbar extends React.Component<Props> {\n public readonly container: HTMLElement | null = null;\n\n public constructor(props: Props) {\n super(props);\n\n this.container = document.getElementById(\"snackbar-container\");\n\n if (!this.container) {\n this.container = document.createElement(\"div\");\n this.container.setAttribute(\"id\", \"snackbar-container\");\n const container: HTMLElement = this.container;\n document.body && document.body.appendChild(container);\n }\n }\n\n public override render(): React.ReactElement {\n return <RmwcSnackbar {...this.props} />;\n }\n}\n\nexport { Snackbar, SnackbarAction };\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["Snackbar","props","container","document","getElementById","createElement","setAttribute","body","appendChild","React","Component"],"sources":["Snackbar.tsx"],"sourcesContent":["import React from \"react\";\nimport { Snackbar as RmwcSnackbar, SnackbarAction, SnackbarProps } from \"@rmwc/snackbar\";\n\ntype Props = SnackbarProps;\n\n/**\n * Use Snackbar component to display an informative or alert message and allow users to act upon it.\n */\nclass Snackbar extends React.Component<Props> {\n public readonly container: HTMLElement | null = null;\n\n public constructor(props: Props) {\n super(props);\n\n this.container = document.getElementById(\"snackbar-container\");\n\n if (!this.container) {\n this.container = document.createElement(\"div\");\n this.container.setAttribute(\"id\", \"snackbar-container\");\n const container: HTMLElement = this.container;\n document.body && document.body.appendChild(container);\n }\n }\n\n public override render(): React.ReactElement {\n return <RmwcSnackbar {...this.props} />;\n }\n}\n\nexport { Snackbar, SnackbarAction };\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AACA;AAIA;AACA;AACA;AAFA,IAGMA,QAAQ;EAAA;EAAA;EAGV,kBAAmBC,KAAY,EAAE;IAAA;IAAA;IAC7B,0BAAMA,KAAK;IAAE,wFAH+B,IAAI;IAKhD,MAAKC,SAAS,GAAGC,QAAQ,CAACC,cAAc,CAAC,oBAAoB,CAAC;IAE9D,IAAI,CAAC,MAAKF,SAAS,EAAE;MACjB,MAAKA,SAAS,GAAGC,QAAQ,CAACE,aAAa,CAAC,KAAK,CAAC;MAC9C,MAAKH,SAAS,CAACI,YAAY,CAAC,IAAI,EAAE,oBAAoB,CAAC;MACvD,IAAMJ,SAAsB,GAAG,MAAKA,SAAS;MAC7CC,QAAQ,CAACI,IAAI,IAAIJ,QAAQ,CAACI,IAAI,CAACC,WAAW,CAACN,SAAS,CAAC;IACzD;IAAC;EACL;EAAC;IAAA;IAAA,OAED,kBAA6C;MACzC,oBAAO,6BAAC,kBAAY,EAAK,IAAI,CAACD,KAAK,CAAI;IAC3C;EAAC;EAAA;AAAA,EAlBkBQ,cAAK,CAACC,SAAS;AAAA"}
|
|
@@ -1,62 +1,40 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
6
|
-
|
|
7
5
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
8
|
-
|
|
9
6
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
10
|
-
|
|
11
7
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
12
|
-
|
|
13
8
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
14
|
-
|
|
15
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
16
|
-
|
|
17
10
|
var _react = _interopRequireDefault(require("react"));
|
|
18
|
-
|
|
19
11
|
var _react2 = require("@storybook/react");
|
|
20
|
-
|
|
21
12
|
var _Story = require("@webiny/storybook-utils/Story");
|
|
22
|
-
|
|
23
13
|
var _README = _interopRequireDefault(require("./../Snackbar/README.md"));
|
|
24
|
-
|
|
25
14
|
var _addonKnobs = require("@storybook/addon-knobs");
|
|
26
|
-
|
|
27
15
|
var _Button = require("./../Button");
|
|
28
|
-
|
|
29
16
|
var _Snackbar = require("./Snackbar");
|
|
30
|
-
|
|
31
17
|
var story = (0, _react2.storiesOf)("Components/Snackbar", module);
|
|
32
18
|
story.addDecorator(_addonKnobs.withKnobs);
|
|
33
|
-
|
|
34
19
|
var SnackbarContainer = /*#__PURE__*/function (_React$Component) {
|
|
35
20
|
(0, _inherits2.default)(SnackbarContainer, _React$Component);
|
|
36
|
-
|
|
37
21
|
var _super = (0, _createSuper2.default)(SnackbarContainer);
|
|
38
|
-
|
|
39
22
|
function SnackbarContainer() {
|
|
40
23
|
var _this;
|
|
41
|
-
|
|
42
24
|
(0, _classCallCheck2.default)(this, SnackbarContainer);
|
|
43
|
-
|
|
44
25
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
45
26
|
args[_key] = arguments[_key];
|
|
46
27
|
}
|
|
47
|
-
|
|
48
28
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
49
29
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
|
|
50
30
|
show: false
|
|
51
31
|
});
|
|
52
32
|
return _this;
|
|
53
33
|
}
|
|
54
|
-
|
|
55
34
|
(0, _createClass2.default)(SnackbarContainer, [{
|
|
56
35
|
key: "render",
|
|
57
36
|
value: function render() {
|
|
58
37
|
var _this2 = this;
|
|
59
|
-
|
|
60
38
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Snackbar.Snackbar, {
|
|
61
39
|
open: this.state.show,
|
|
62
40
|
onClose: function onClose() {
|
|
@@ -78,7 +56,6 @@ var SnackbarContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
78
56
|
}]);
|
|
79
57
|
return SnackbarContainer;
|
|
80
58
|
}(_react.default.Component);
|
|
81
|
-
|
|
82
59
|
story.add("usage", function () {
|
|
83
60
|
var leading = (0, _addonKnobs.boolean)("leading", false);
|
|
84
61
|
return /*#__PURE__*/_react.default.createElement(_Story.Story, null, /*#__PURE__*/_react.default.createElement(_Story.StoryReadme, null, _README.default), /*#__PURE__*/_react.default.createElement(_Story.StorySandbox, null, /*#__PURE__*/_react.default.createElement(_Story.StorySandboxExample, null, /*#__PURE__*/_react.default.createElement(SnackbarContainer, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","SnackbarContainer","show","state","setState","props","leading","React","Component","add","boolean","readme","info","propTables","Snackbar"],"sources":["Snackbar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Snackbar/README.md\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\nimport { ButtonPrimary } from \"./../Button\";\nimport { Snackbar } from \"./Snackbar\";\n\nconst story = storiesOf(\"Components/Snackbar\", module);\nstory.addDecorator(withKnobs);\n\nclass SnackbarContainer extends React.Component<{ leading: boolean }, { show: boolean }> {\n public override state = {\n show: false\n };\n\n public override render() {\n return (\n <React.Fragment>\n <Snackbar\n open={this.state.show}\n onClose={() => this.setState({ show: false })}\n message=\"This is a message.\"\n leading={this.props.leading}\n action=\"Something\"\n />\n <ButtonPrimary onClick={() => this.setState({ show: true })}>\n Show message\n </ButtonPrimary>\n </React.Fragment>\n );\n }\n}\n\nstory.add(\n \"usage\",\n () => {\n const leading = boolean(\"leading\", false);\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample>\n <SnackbarContainer leading />\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <div>\n <Snackbar\n open={this.state.show}\n leading={${leading}}\n onHide={() => this.setState({ show: false })}\n message=\"This is a message.\"\n />\n <ButtonPrimary onClick={() => this.setState({ show: true })}>\n Show message\n </ButtonPrimary>\n </div>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Snackbar] } }\n);\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","SnackbarContainer","show","state","setState","props","leading","React","Component","add","boolean","readme","info","propTables","Snackbar"],"sources":["Snackbar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n Story,\n StoryReadme,\n StorySandboxCode,\n StorySandbox,\n StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Snackbar/README.md\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\nimport { ButtonPrimary } from \"./../Button\";\nimport { Snackbar } from \"./Snackbar\";\n\nconst story = storiesOf(\"Components/Snackbar\", module);\nstory.addDecorator(withKnobs);\n\nclass SnackbarContainer extends React.Component<{ leading: boolean }, { show: boolean }> {\n public override state = {\n show: false\n };\n\n public override render() {\n return (\n <React.Fragment>\n <Snackbar\n open={this.state.show}\n onClose={() => this.setState({ show: false })}\n message=\"This is a message.\"\n leading={this.props.leading}\n action=\"Something\"\n />\n <ButtonPrimary onClick={() => this.setState({ show: true })}>\n Show message\n </ButtonPrimary>\n </React.Fragment>\n );\n }\n}\n\nstory.add(\n \"usage\",\n () => {\n const leading = boolean(\"leading\", false);\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample>\n <SnackbarContainer leading />\n </StorySandboxExample>\n <StorySandboxCode>\n {`\n <div>\n <Snackbar\n open={this.state.show}\n leading={${leading}}\n onHide={() => this.setState({ show: false })}\n message=\"This is a message.\"\n />\n <ButtonPrimary onClick={() => this.setState({ show: true })}>\n Show message\n </ButtonPrimary>\n </div>\n `}\n </StorySandboxCode>\n </StorySandbox>\n </Story>\n );\n },\n { info: { propTables: [Snackbar] } }\n);\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AAOA;AACA;AACA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,qBAAqB,EAAEC,MAAM,CAAC;AACtDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAAC,IAExBC,iBAAiB;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;MAAA;IAAA;IAAA;IAAA,oFACK;MACpBC,IAAI,EAAE;IACV,CAAC;IAAA;EAAA;EAAA;IAAA;IAAA,OAED,kBAAyB;MAAA;MACrB,oBACI,6BAAC,cAAK,CAAC,QAAQ,qBACX,6BAAC,kBAAQ;QACL,IAAI,EAAE,IAAI,CAACC,KAAK,CAACD,IAAK;QACtB,OAAO,EAAE;UAAA,OAAM,MAAI,CAACE,QAAQ,CAAC;YAAEF,IAAI,EAAE;UAAM,CAAC,CAAC;QAAA,CAAC;QAC9C,OAAO,EAAC,oBAAoB;QAC5B,OAAO,EAAE,IAAI,CAACG,KAAK,CAACC,OAAQ;QAC5B,MAAM,EAAC;MAAW,EACpB,eACF,6BAAC,qBAAa;QAAC,OAAO,EAAE;UAAA,OAAM,MAAI,CAACF,QAAQ,CAAC;YAAEF,IAAI,EAAE;UAAK,CAAC,CAAC;QAAA;MAAC,GAAC,cAE7D,CAAgB,CACH;IAEzB;EAAC;EAAA;AAAA,EApB2BK,cAAK,CAACC,SAAS;AAuB/CZ,KAAK,CAACa,GAAG,CACL,OAAO,EACP,YAAM;EACF,IAAMH,OAAO,GAAG,IAAAI,mBAAO,EAAC,SAAS,EAAE,KAAK,CAAC;EAEzC,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB,qBAChB,6BAAC,iBAAiB;IAAC,OAAO;EAAA,EAAG,CACX,eACtB,6BAAC,uBAAgB,4LAKML,OAAO,maASX,CACR,CACX;AAEhB,CAAC,EACD;EAAEM,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,kBAAQ;EAAE;AAAE,CAAC,CACvC"}
|
package/Snackbar/index.js
CHANGED
package/Snackbar/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { Snackbar, SnackbarAction } from \"./Snackbar\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { Snackbar, SnackbarAction } from \"./Snackbar\";\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA"}
|
package/Switch/Switch.js
CHANGED
|
@@ -1,72 +1,50 @@
|
|
|
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.Switch = void 0;
|
|
9
|
-
|
|
10
8
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
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 _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
17
|
-
|
|
18
12
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
19
|
-
|
|
20
13
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
21
|
-
|
|
22
14
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
23
|
-
|
|
24
15
|
var _react = _interopRequireDefault(require("react"));
|
|
25
|
-
|
|
26
16
|
var _switch = require("@rmwc/switch");
|
|
27
|
-
|
|
28
17
|
var _pick = _interopRequireDefault(require("lodash/pick"));
|
|
29
|
-
|
|
30
18
|
var _FormElementMessage = require("../FormElementMessage");
|
|
31
|
-
|
|
32
19
|
var _Helpers = require("../Helpers");
|
|
33
|
-
|
|
34
20
|
/**
|
|
35
21
|
* Switch component can be used to store simple boolean values.
|
|
36
22
|
*/
|
|
37
23
|
var Switch = /*#__PURE__*/function (_React$Component) {
|
|
38
24
|
(0, _inherits2.default)(Switch, _React$Component);
|
|
39
|
-
|
|
40
25
|
var _super = (0, _createSuper2.default)(Switch);
|
|
41
|
-
|
|
42
26
|
function Switch() {
|
|
43
27
|
var _this;
|
|
44
|
-
|
|
45
28
|
(0, _classCallCheck2.default)(this, Switch);
|
|
46
|
-
|
|
47
29
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
48
30
|
args[_key] = arguments[_key];
|
|
49
31
|
}
|
|
50
|
-
|
|
51
32
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
52
33
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (e) {
|
|
53
34
|
_this.props.onChange && _this.props.onChange(e.target.checked);
|
|
54
35
|
});
|
|
55
36
|
return _this;
|
|
56
37
|
}
|
|
57
|
-
|
|
58
38
|
(0, _createClass2.default)(Switch, [{
|
|
59
39
|
key: "render",
|
|
60
40
|
value: function render() {
|
|
61
41
|
var _this$props = this.props,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
42
|
+
value = _this$props.value,
|
|
43
|
+
description = _this$props.description,
|
|
44
|
+
validation = _this$props.validation;
|
|
66
45
|
var _ref = validation || {},
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
46
|
+
validationIsValid = _ref.isValid,
|
|
47
|
+
validationMessage = _ref.message;
|
|
70
48
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_switch.Switch, Object.assign({}, (0, _Helpers.getClasses)((0, _objectSpread2.default)({}, (0, _pick.default)(this.props, Switch.rmwcProps)), "webiny-ui-switch"), {
|
|
71
49
|
checked: Boolean(value),
|
|
72
50
|
onChange: this.onChange
|
|
@@ -77,6 +55,5 @@ var Switch = /*#__PURE__*/function (_React$Component) {
|
|
|
77
55
|
}]);
|
|
78
56
|
return Switch;
|
|
79
57
|
}(_react.default.Component);
|
|
80
|
-
|
|
81
58
|
exports.Switch = Switch;
|
|
82
59
|
(0, _defineProperty2.default)(Switch, "rmwcProps", ["id", "disabled", "checked", "label", "rootProps", "className"]);
|
package/Switch/Switch.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Switch","e","props","onChange","target","checked","value","description","validation","validationIsValid","isValid","validationMessage","message","getClasses","pick","rmwcProps","Boolean","React","Component"],"sources":["Switch.tsx"],"sourcesContent":["import React from \"react\";\nimport { Switch as RmwcSwitch, SwitchProps } from \"@rmwc/switch\";\nimport { FormComponentProps } from \"~/types\";\nimport pick from \"lodash/pick\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { getClasses } from \"~/Helpers\";\n\ntype Props = Omit<SwitchProps, \"value\"> &\n FormComponentProps<boolean> & {\n // Description beneath the switch.\n description?: string;\n\n // Optional class name.\n className?: string;\n };\n\n/**\n * Switch component can be used to store simple boolean values.\n */\nclass Switch extends React.Component<Props> {\n static rmwcProps = [\"id\", \"disabled\", \"checked\", \"label\", \"rootProps\", \"className\"];\n\n onChange = (e: React.SyntheticEvent<HTMLElement>) => {\n this.props.onChange && this.props.onChange((e.target as any).checked);\n };\n\n public override render() {\n const { value, description, validation } = this.props;\n\n const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n return (\n <React.Fragment>\n <RmwcSwitch\n {...getClasses({ ...pick(this.props, Switch.rmwcProps) }, \"webiny-ui-switch\")}\n checked={Boolean(value)}\n onChange={this.onChange}\n />\n\n {validationIsValid === false && (\n <FormElementMessage error>{validationMessage}</FormElementMessage>\n )}\n\n {validationIsValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n }\n}\n\nexport { Switch };\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["Switch","e","props","onChange","target","checked","value","description","validation","validationIsValid","isValid","validationMessage","message","getClasses","pick","rmwcProps","Boolean","React","Component"],"sources":["Switch.tsx"],"sourcesContent":["import React from \"react\";\nimport { Switch as RmwcSwitch, SwitchProps } from \"@rmwc/switch\";\nimport { FormComponentProps } from \"~/types\";\nimport pick from \"lodash/pick\";\nimport { FormElementMessage } from \"~/FormElementMessage\";\nimport { getClasses } from \"~/Helpers\";\n\ntype Props = Omit<SwitchProps, \"value\"> &\n FormComponentProps<boolean> & {\n // Description beneath the switch.\n description?: string;\n\n // Optional class name.\n className?: string;\n };\n\n/**\n * Switch component can be used to store simple boolean values.\n */\nclass Switch extends React.Component<Props> {\n static rmwcProps = [\"id\", \"disabled\", \"checked\", \"label\", \"rootProps\", \"className\"];\n\n onChange = (e: React.SyntheticEvent<HTMLElement>) => {\n this.props.onChange && this.props.onChange((e.target as any).checked);\n };\n\n public override render() {\n const { value, description, validation } = this.props;\n\n const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n return (\n <React.Fragment>\n <RmwcSwitch\n {...getClasses({ ...pick(this.props, Switch.rmwcProps) }, \"webiny-ui-switch\")}\n checked={Boolean(value)}\n onChange={this.onChange}\n />\n\n {validationIsValid === false && (\n <FormElementMessage error>{validationMessage}</FormElementMessage>\n )}\n\n {validationIsValid !== false && description && (\n <FormElementMessage>{description}</FormElementMessage>\n )}\n </React.Fragment>\n );\n }\n}\n\nexport { Switch };\n"],"mappings":";;;;;;;;;;;;;;AAAA;AACA;AAEA;AACA;AACA;AAWA;AACA;AACA;AAFA,IAGMA,MAAM;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;MAAA;IAAA;IAAA;IAAA,uFAGG,UAACC,CAAoC,EAAK;MACjD,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,kBAA2C,IAAI,CAACH,KAAK;QAA7CI,KAAK,eAALA,KAAK;QAAEC,WAAW,eAAXA,WAAW;QAAEC,UAAU,eAAVA,UAAU;MAEtC,WAAmEA,UAAU,IAAI,CAAC,CAAC;QAAlEC,iBAAiB,QAA1BC,OAAO;QAA8BC,iBAAiB,QAA1BC,OAAO;MAE3C,oBACI,6BAAC,cAAK,CAAC,QAAQ,qBACX,6BAAC,cAAU,oBACH,IAAAC,mBAAU,kCAAM,IAAAC,aAAI,EAAC,IAAI,CAACZ,KAAK,EAAEF,MAAM,CAACe,SAAS,CAAC,GAAI,kBAAkB,CAAC;QAC7E,OAAO,EAAEC,OAAO,CAACV,KAAK,CAAE;QACxB,QAAQ,EAAE,IAAI,CAACH;MAAS,GAC1B,EAEDM,iBAAiB,KAAK,KAAK,iBACxB,6BAAC,sCAAkB;QAAC,KAAK;MAAA,GAAEE,iBAAiB,CAC/C,EAEAF,iBAAiB,KAAK,KAAK,IAAIF,WAAW,iBACvC,6BAAC,sCAAkB,QAAEA,WAAW,CACnC,CACY;IAEzB;EAAC;EAAA;AAAA,EA7BgBU,cAAK,CAACC,SAAS;AAAA;AAAA,8BAA9BlB,MAAM,eACW,CAAC,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW,CAAC"}
|
package/Switch/Switch.stories.js
CHANGED
|
@@ -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 = _interopRequireDefault(require("./README.md"));
|
|
14
|
-
|
|
15
9
|
var _form = require("@webiny/form");
|
|
16
|
-
|
|
17
10
|
var _Switch = require("./Switch");
|
|
18
|
-
|
|
19
11
|
var story = (0, _react2.storiesOf)("Components/Switch", module);
|
|
20
12
|
story.addDecorator(_addonKnobs.withKnobs);
|
|
21
13
|
story.add("usage", function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","readme","rememberMe","Bind","info","propTables","Switch"],"sources":["Switch.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.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Switch } from \"./Switch\";\n\nconst story = storiesOf(\"Components/Switch\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple switch with a label and description\"}>\n <Form data={{ rememberMe: true }}>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Switch\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 <Switch\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: [Switch] } }\n);\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","disabled","boolean","readme","rememberMe","Bind","info","propTables","Switch"],"sources":["Switch.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.md\";\n\nimport { Form } from \"@webiny/form\";\nimport { Switch } from \"./Switch\";\n\nconst story = storiesOf(\"Components/Switch\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n \"usage\",\n () => {\n const disabled = boolean(\"Disabled\", false);\n\n return (\n <Story>\n <StoryReadme>{readme}</StoryReadme>\n <StorySandbox>\n <StorySandboxExample title={\"Simple switch with a label and description\"}>\n <Form data={{ rememberMe: true }}>\n {({ Bind }) => (\n <Bind name=\"rememberMe\">\n <Switch\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 <Switch\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: [Switch] } }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AACA;AAEA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,mBAAmB,EAAEC,MAAM,CAAC;AACpDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,OAAO,EACP,YAAM;EACF,IAAMC,QAAQ,GAAG,IAAAC,mBAAO,EAAC,UAAU,EAAE,KAAK,CAAC;EAE3C,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY,qBACT,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAA6C,gBACrE,6BAAC,UAAI;IAAC,IAAI,EAAE;MAAEC,UAAU,EAAE;IAAK;EAAE,GAC5B;IAAA,IAAGC,IAAI,QAAJA,IAAI;IAAA,oBACJ,6BAAC,IAAI;MAAC,IAAI,EAAC;IAAY,gBACnB,6BAAC,cAAM;MACH,KAAK,EAAE,aAAc;MACrB,QAAQ,EAAEJ,QAAS;MACnB,WAAW,EACP;IACH,EACH,CACC;EAAA,CACV,CACE,CACW,eACtB,6BAAC,uBAAgB,0iBAcE,CACR,CACX;AAEhB,CAAC,EACD;EAAEK,IAAI,EAAE;IAAEC,UAAU,EAAE,CAACC,cAAM;EAAE;AAAE,CAAC,CACrC"}
|
package/Switch/index.js
CHANGED
|
@@ -3,9 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
|
|
7
6
|
var _Switch = require("./Switch");
|
|
8
|
-
|
|
9
7
|
Object.keys(_Switch).forEach(function (key) {
|
|
10
8
|
if (key === "default" || key === "__esModule") return;
|
|
11
9
|
if (key in exports && exports[key] === _Switch[key]) return;
|
package/Switch/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Switch\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Switch\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
package/Tabs/Tab.js
CHANGED
|
@@ -1,28 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
-
|
|
5
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports.Tab = void 0;
|
|
11
|
-
|
|
12
9
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
13
|
-
|
|
14
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
-
|
|
16
11
|
var _shortid = _interopRequireDefault(require("shortid"));
|
|
17
|
-
|
|
18
12
|
var _Tabs = require("./Tabs");
|
|
19
|
-
|
|
20
13
|
var Tab = /*#__PURE__*/_react.default.memo(function (props) {
|
|
21
14
|
var tabsContext = (0, _react.useContext)(_Tabs.TabsContext);
|
|
22
15
|
var idRef = (0, _react.useRef)(_shortid.default.generate());
|
|
23
16
|
(0, _react.useEffect)(function () {
|
|
24
17
|
var _props$visible;
|
|
25
|
-
|
|
26
18
|
tabsContext.addTab((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
|
|
27
19
|
id: idRef.current,
|
|
28
20
|
visible: (_props$visible = props.visible) !== null && _props$visible !== void 0 ? _props$visible : true
|
|
@@ -35,6 +27,5 @@ var Tab = /*#__PURE__*/_react.default.memo(function (props) {
|
|
|
35
27
|
}, []);
|
|
36
28
|
return null;
|
|
37
29
|
});
|
|
38
|
-
|
|
39
30
|
exports.Tab = Tab;
|
|
40
31
|
Tab.displayName = "Tab";
|
package/Tabs/Tab.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Tab","React","memo","props","tabsContext","useContext","TabsContext","idRef","useRef","shortid","generate","useEffect","addTab","id","current","visible","removeTab","displayName"],"sources":["Tab.tsx"],"sourcesContent":["import React, { useContext, useEffect, useRef } from \"react\";\nimport { TabProps as RmwcTabProps } from \"@rmwc/tabs\";\nimport shortid from \"shortid\";\nimport { TabsContext } from \"./Tabs\";\n\nexport type TabProps = RmwcTabProps & {\n visible?: boolean;\n\n tag?: string;\n /**\n * Is tab disabled?\n */\n disabled?: boolean;\n /**\n * Style object\n */\n style?: React.CSSProperties;\n /**\n * Tab ID for the testing.\n */\n \"data-testid\"?: string;\n};\n\nexport const Tab: React.FC<TabProps> = React.memo(props => {\n const tabsContext = useContext(TabsContext);\n const idRef = useRef(shortid.generate());\n\n useEffect(() => {\n tabsContext!.addTab({ ...props, id: idRef.current, visible: props.visible ?? true });\n }, [props]);\n\n useEffect(() => {\n return () => {\n return tabsContext!.removeTab(idRef.current);\n };\n }, []);\n\n return null;\n});\n\nTab.displayName = \"Tab\";\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["Tab","React","memo","props","tabsContext","useContext","TabsContext","idRef","useRef","shortid","generate","useEffect","addTab","id","current","visible","removeTab","displayName"],"sources":["Tab.tsx"],"sourcesContent":["import React, { useContext, useEffect, useRef } from \"react\";\nimport { TabProps as RmwcTabProps } from \"@rmwc/tabs\";\nimport shortid from \"shortid\";\nimport { TabsContext } from \"./Tabs\";\n\nexport type TabProps = RmwcTabProps & {\n visible?: boolean;\n\n tag?: string;\n /**\n * Is tab disabled?\n */\n disabled?: boolean;\n /**\n * Style object\n */\n style?: React.CSSProperties;\n /**\n * Tab ID for the testing.\n */\n \"data-testid\"?: string;\n};\n\nexport const Tab: React.FC<TabProps> = React.memo(props => {\n const tabsContext = useContext(TabsContext);\n const idRef = useRef(shortid.generate());\n\n useEffect(() => {\n tabsContext!.addTab({ ...props, id: idRef.current, visible: props.visible ?? true });\n }, [props]);\n\n useEffect(() => {\n return () => {\n return tabsContext!.removeTab(idRef.current);\n };\n }, []);\n\n return null;\n});\n\nTab.displayName = \"Tab\";\n"],"mappings":";;;;;;;;;AAAA;AAEA;AACA;AAoBO,IAAMA,GAAuB,gBAAGC,cAAK,CAACC,IAAI,CAAC,UAAAC,KAAK,EAAI;EACvD,IAAMC,WAAW,GAAG,IAAAC,iBAAU,EAACC,iBAAW,CAAC;EAC3C,IAAMC,KAAK,GAAG,IAAAC,aAAM,EAACC,gBAAO,CAACC,QAAQ,EAAE,CAAC;EAExC,IAAAC,gBAAS,EAAC,YAAM;IAAA;IACZP,WAAW,CAAEQ,MAAM,6DAAMT,KAAK;MAAEU,EAAE,EAAEN,KAAK,CAACO,OAAO;MAAEC,OAAO,oBAAEZ,KAAK,CAACY,OAAO,2DAAI;IAAI,GAAG;EACxF,CAAC,EAAE,CAACZ,KAAK,CAAC,CAAC;EAEX,IAAAQ,gBAAS,EAAC,YAAM;IACZ,OAAO,YAAM;MACT,OAAOP,WAAW,CAAEY,SAAS,CAACT,KAAK,CAACO,OAAO,CAAC;IAChD,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO,IAAI;AACf,CAAC,CAAC;AAAC;AAEHd,GAAG,CAACiB,WAAW,GAAG,KAAK"}
|
package/Tabs/Tabs.js
CHANGED
|
@@ -1,52 +1,40 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
-
|
|
5
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports.TabsContext = exports.Tabs = void 0;
|
|
11
|
-
|
|
12
9
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
13
|
-
|
|
14
10
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
-
|
|
16
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
17
|
-
|
|
18
12
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
19
|
-
|
|
20
13
|
var _tabs = require("@rmwc/tabs");
|
|
21
|
-
|
|
22
14
|
var disabledStyles = {
|
|
23
15
|
opacity: 0.5,
|
|
24
16
|
pointerEvents: "none"
|
|
25
17
|
};
|
|
26
18
|
var TabsContext = /*#__PURE__*/(0, _react.createContext)(undefined);
|
|
27
19
|
exports.TabsContext = TabsContext;
|
|
28
|
-
|
|
29
20
|
/**
|
|
30
21
|
* Use Tabs component to display a list of choices, once the handler is triggered.
|
|
31
22
|
*/
|
|
32
23
|
var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
33
24
|
var _useState = (0, _react.useState)(0),
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
25
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
26
|
+
activeTabIndex = _useState2[0],
|
|
27
|
+
setActiveIndex = _useState2[1];
|
|
38
28
|
var _useState3 = (0, _react.useState)([]),
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
29
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
30
|
+
tabs = _useState4[0],
|
|
31
|
+
setTabs = _useState4[1];
|
|
43
32
|
var activeIndex = props.value !== undefined ? props.value : activeTabIndex;
|
|
44
33
|
var activateTabIndex = (0, _react.useCallback)(function (index) {
|
|
45
34
|
if (typeof props.updateValue === "function") {
|
|
46
35
|
props.updateValue(index);
|
|
47
36
|
return;
|
|
48
37
|
}
|
|
49
|
-
|
|
50
38
|
setActiveIndex(index);
|
|
51
39
|
}, []);
|
|
52
40
|
(0, _react.useImperativeHandle)(ref, function () {
|
|
@@ -59,19 +47,18 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
59
47
|
}
|
|
60
48
|
};
|
|
61
49
|
});
|
|
50
|
+
|
|
62
51
|
/**
|
|
63
52
|
* This effect will make sure that disabled tabs automatically switch to the first tab.
|
|
64
53
|
*/
|
|
65
|
-
|
|
66
54
|
(0, _react.useEffect)(function () {
|
|
67
55
|
var _tabs$activeIndex;
|
|
68
|
-
|
|
69
56
|
if ((_tabs$activeIndex = tabs[activeIndex]) !== null && _tabs$activeIndex !== void 0 && _tabs$activeIndex.disabled) {
|
|
70
57
|
activateTabIndex(0);
|
|
71
58
|
}
|
|
72
59
|
});
|
|
73
|
-
/* We need to generate a key like this to trigger a proper component re-render when child tabs change. */
|
|
74
60
|
|
|
61
|
+
/* We need to generate a key like this to trigger a proper component re-render when child tabs change. */
|
|
75
62
|
var tabBar = /*#__PURE__*/_react.default.createElement(_tabs.TabBar, {
|
|
76
63
|
key: tabs.map(function (tab) {
|
|
77
64
|
return tab.id;
|
|
@@ -84,20 +71,22 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
84
71
|
} else {
|
|
85
72
|
setActiveIndex(evt.detail.index);
|
|
86
73
|
}
|
|
87
|
-
|
|
88
74
|
props.onActivate && props.onActivate(evt.detail.index);
|
|
89
75
|
}
|
|
90
76
|
}, tabs.map(function (item) {
|
|
91
77
|
if (!item.visible) {
|
|
92
|
-
return
|
|
78
|
+
return /*#__PURE__*/_react.default.createElement(_tabs.Tab, {
|
|
79
|
+
tag: "div",
|
|
80
|
+
style: {
|
|
81
|
+
display: "none"
|
|
82
|
+
},
|
|
83
|
+
key: item.id
|
|
84
|
+
});
|
|
93
85
|
}
|
|
94
|
-
|
|
95
86
|
var style = item.style || {};
|
|
96
|
-
|
|
97
87
|
if (item.disabled) {
|
|
98
88
|
Object.assign(style, disabledStyles);
|
|
99
89
|
}
|
|
100
|
-
|
|
101
90
|
return /*#__PURE__*/_react.default.createElement(_tabs.Tab, Object.assign({
|
|
102
91
|
tag: "div",
|
|
103
92
|
style: style,
|
|
@@ -107,7 +96,6 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
107
96
|
icon: item.icon
|
|
108
97
|
} : {}), item.label);
|
|
109
98
|
}));
|
|
110
|
-
|
|
111
99
|
var content = tabs.filter(Boolean).map(function (tab, index) {
|
|
112
100
|
if (activeIndex === index) {
|
|
113
101
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -129,11 +117,9 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
129
117
|
var existingIndex = tabs.findIndex(function (tab) {
|
|
130
118
|
return tab.id === props.id;
|
|
131
119
|
});
|
|
132
|
-
|
|
133
120
|
if (existingIndex > -1) {
|
|
134
121
|
return [].concat((0, _toConsumableArray2.default)(tabs.slice(0, existingIndex)), [props], (0, _toConsumableArray2.default)(tabs.slice(existingIndex + 1)));
|
|
135
122
|
}
|
|
136
|
-
|
|
137
123
|
return [].concat((0, _toConsumableArray2.default)(tabs), [props]);
|
|
138
124
|
});
|
|
139
125
|
},
|
package/Tabs/Tabs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["disabledStyles","opacity","pointerEvents","TabsContext","createContext","undefined","Tabs","forwardRef","props","ref","useState","activeTabIndex","setActiveIndex","tabs","setTabs","activeIndex","value","activateTabIndex","useCallback","index","updateValue","useImperativeHandle","getActiveIndex","switchTab","tabIndex","useEffect","disabled","tabBar","map","tab","id","join","evt","detail","onActivate","item","visible","style","Object","assign","icon","label","content","filter","Boolean","children","
|
|
1
|
+
{"version":3,"names":["disabledStyles","opacity","pointerEvents","TabsContext","createContext","undefined","Tabs","forwardRef","props","ref","useState","activeTabIndex","setActiveIndex","tabs","setTabs","activeIndex","value","activateTabIndex","useCallback","index","updateValue","useImperativeHandle","getActiveIndex","switchTab","tabIndex","useEffect","disabled","tabBar","map","tab","id","join","evt","detail","onActivate","item","visible","display","style","Object","assign","icon","label","content","filter","Boolean","children","context","useMemo","addTab","existingIndex","findIndex","slice","removeTab","classNames","className","displayName"],"sources":["Tabs.tsx"],"sourcesContent":["import React, {\n createContext,\n forwardRef,\n PropsWithChildren,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useState\n} from \"react\";\nimport classNames from \"classnames\";\nimport { TabBar, Tab as RmwcTab } from \"@rmwc/tabs\";\nimport { TabProps } from \"./Tab\";\n\nexport type TabsProps = PropsWithChildren<{\n /**\n * Append a class name.\n */\n className?: string;\n\n /**\n * Callback to execute when a tab is changed.\n */\n onActivate?: (index: number) => void;\n\n /**\n * Active tab index value.\n */\n value?: number;\n\n /**\n * Function to change active tab.\n */\n updateValue?: (index: number) => void;\n /**\n * Tab ID for the testing.\n */\n \"data-testid\"?: string;\n}>;\n\nconst disabledStyles: Record<string, string | number> = {\n opacity: 0.5,\n pointerEvents: \"none\"\n};\n\ninterface TabItem extends TabProps {\n id: string;\n}\n\ninterface TabsContext {\n addTab(props: TabItem): void;\n removeTab(id: string): void;\n}\n\nexport const TabsContext = createContext<TabsContext | undefined>(undefined);\n\nexport interface TabsImperativeApi {\n switchTab(index: number): void;\n getActiveIndex(): number;\n}\n/**\n * Use Tabs component to display a list of choices, once the handler is triggered.\n */\nexport const Tabs = forwardRef<TabsImperativeApi | undefined, TabsProps>((props, ref) => {\n const [activeTabIndex, setActiveIndex] = useState(0);\n const [tabs, setTabs] = useState<TabItem[]>([]);\n\n const activeIndex = props.value !== undefined ? props.value : activeTabIndex;\n\n const activateTabIndex = useCallback((index: number) => {\n if (typeof props.updateValue === \"function\") {\n props.updateValue(index);\n return;\n }\n\n setActiveIndex(index);\n }, []);\n\n useImperativeHandle(ref, () => ({\n getActiveIndex() {\n return activeIndex;\n },\n switchTab(tabIndex: number) {\n activateTabIndex(tabIndex);\n }\n }));\n\n /**\n * This effect will make sure that disabled tabs automatically switch to the first tab.\n */\n useEffect(() => {\n if (tabs[activeIndex]?.disabled) {\n activateTabIndex(0);\n }\n });\n\n /* We need to generate a key like this to trigger a proper component re-render when child tabs change. */\n const tabBar = (\n <TabBar\n key={tabs.map(tab => tab.id).join(\";\")}\n className=\"webiny-ui-tabs__tab-bar\"\n activeTabIndex={activeIndex}\n onActivate={evt => {\n if (typeof props.updateValue === \"function\") {\n props.updateValue(evt.detail.index);\n } else {\n setActiveIndex(evt.detail.index);\n }\n props.onActivate && props.onActivate(evt.detail.index);\n }}\n >\n {tabs.map(item => {\n if (!item.visible) {\n return <RmwcTab tag={\"div\"} style={{ display: \"none\" }} key={item.id} />;\n }\n\n const style = item.style || {};\n if (item.disabled) {\n Object.assign(style, disabledStyles);\n }\n\n return (\n <RmwcTab\n tag={\"div\"}\n style={style}\n key={item.id}\n data-testid={item[\"data-testid\"]}\n {...(item.icon ? { icon: item.icon } : {})}\n >\n {item.label}\n </RmwcTab>\n );\n })}\n </TabBar>\n );\n\n const content = tabs.filter(Boolean).map((tab, index) => {\n if (activeIndex === index) {\n return <div key={index}>{tab.children}</div>;\n } else {\n return (\n <div key={index} style={{ display: \"none\" }}>\n {tab.children}\n </div>\n );\n }\n });\n\n const context: TabsContext = useMemo(\n () => ({\n addTab(props) {\n setTabs(tabs => {\n const existingIndex = tabs.findIndex(tab => tab.id === props.id);\n if (existingIndex > -1) {\n return [\n ...tabs.slice(0, existingIndex),\n props,\n ...tabs.slice(existingIndex + 1)\n ];\n }\n return [...tabs, props];\n });\n },\n removeTab(id) {\n setTabs(tabs => tabs.filter(tab => tab.id === id));\n }\n }),\n [setTabs]\n );\n\n return (\n <div className={classNames(\"webiny-ui-tabs\", props.className)}>\n {tabBar}\n <div className={\"webiny-ui-tabs__content mdc-tab-content\"}>{content}</div>\n <TabsContext.Provider value={context}>{props.children}</TabsContext.Provider>\n </div>\n );\n});\n\nTabs.displayName = \"Tabs\";\n"],"mappings":"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"}
|