@spothero/ui 17.0.3 → 17.1.0-beta.3
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/dist/components/Accordion/Accordion.js +2 -1
- package/dist/components/Accordion/Accordion.stories.js +22 -13
- package/dist/components/Accordion/index.js +8 -5
- package/dist/components/Accordion/styles/button.js +3 -1
- package/dist/components/Accordion/styles/container.js +1 -1
- package/dist/components/Accordion/styles/index.js +13 -4
- package/dist/components/Accordion/styles/panel.js +1 -1
- package/dist/components/Alert/Alert.js +44 -23
- package/dist/components/Alert/Alert.stories.js +12 -8
- package/dist/components/Alert/index.js +3 -1
- package/dist/components/Alert/styles/index.js +35 -12
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +119 -84
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +12 -4
- package/dist/components/AutoSuggestSelect/index.js +3 -1
- package/dist/components/Badge/Badge.js +2 -1
- package/dist/components/Badge/Badge.stories.js +20 -12
- package/dist/components/Badge/styles/index.js +12 -6
- package/dist/components/Button/Button.js +47 -17
- package/dist/components/Button/Button.spec.js +10 -4
- package/dist/components/Button/Button.styles.js +49 -36
- package/dist/components/Button/button-props.js +20 -2
- package/dist/components/Button/index.js +5 -2
- package/dist/components/Button/stories/button.js +17 -5
- package/dist/components/Button/stories/index.stories.js +48 -24
- package/dist/components/Button/stories/overview.js +62 -34
- package/dist/components/Card/Card.js +26 -11
- package/dist/components/Card/Card.stories.js +15 -5
- package/dist/components/Checkbox/Checkbox.js +2 -1
- package/dist/components/Checkbox/Checkbox.stories.js +10 -2
- package/dist/components/Checkbox/index.js +3 -1
- package/dist/components/Checkbox/styles/index.js +11 -3
- package/dist/components/Container/Container.js +21 -5
- package/dist/components/Container/Container.stories.js +43 -14
- package/dist/components/Container/Container.styles.js +1 -1
- package/dist/components/Datepicker/Range/DatepickerRange.js +67 -0
- package/dist/components/Datepicker/Range/DatepickerRange.stories.js +427 -0
- package/dist/components/Datepicker/Range/DatepickerRangeContext.js +80 -0
- package/dist/components/Datepicker/Range/components/DateRow.js +261 -0
- package/dist/components/Datepicker/Range/components/DatepickerRangeContainer.js +227 -0
- package/dist/components/Datepicker/Range/components/DatepickerRangeControls.js +80 -0
- package/dist/components/Datepicker/Range/components/index.js +31 -0
- package/dist/components/Datepicker/Range/utils/propTypes.js +158 -0
- package/dist/components/Datepicker/Single/Datepicker.stories.js +314 -0
- package/dist/components/Datepicker/Single/DatepickerContext.js +65 -0
- package/dist/components/Datepicker/Single/DatepickerSingle.js +54 -0
- package/dist/components/Datepicker/Single/components/DateRow.js +146 -0
- package/dist/components/Datepicker/Single/components/DatepickerContainer.js +167 -0
- package/dist/components/Datepicker/Single/components/DatepickerControl.js +51 -0
- package/dist/components/Datepicker/Single/components/index.js +31 -0
- package/dist/components/Datepicker/Single/utils/propTypes.js +88 -0
- package/dist/components/Datepicker/common/components/DatepickerDays.js +111 -0
- package/dist/components/Datepicker/common/components/DatepickerHeader.js +118 -0
- package/dist/components/Datepicker/common/components/DatepickerInput.js +127 -0
- package/dist/components/Datepicker/common/components/WithPopoverAnchor.js +23 -0
- package/dist/components/Datepicker/common/components/WithPortal.js +26 -0
- package/dist/components/Datepicker/common/components/index.js +39 -0
- package/dist/components/Datepicker/common/utils/constants.js +43 -0
- package/dist/components/Datepicker/common/utils/dateRowCalculations.js +92 -0
- package/dist/components/Datepicker/common/utils/generalCalculations.js +71 -0
- package/dist/components/Datepicker/common/utils/getWeeksOfMonth.js +51 -0
- package/dist/components/Datepicker/common/utils/sharedPropTypes.js +147 -0
- package/dist/components/Datepicker/index.js +23 -0
- package/dist/components/Divider/Divider.js +24 -8
- package/dist/components/Divider/Divider.stories.js +15 -3
- package/dist/components/Divider/Divider.styles.js +8 -2
- package/dist/components/FormControl/FormControl.js +29 -14
- package/dist/components/Grid/Grid.js +24 -7
- package/dist/components/Grid/Grid.stories.js +60 -36
- package/dist/components/Grid/Grid.styles.js +2 -2
- package/dist/components/Grid/GridItem.js +21 -5
- package/dist/components/Grid/GridItem.styles.js +1 -2
- package/dist/components/Grid/index.js +5 -2
- package/dist/components/Heading/Heading.js +29 -8
- package/dist/components/Heading/Heading.stories.js +15 -4
- package/dist/components/Heading/Heading.styles.js +38 -24
- package/dist/components/Icon/Icon.js +2 -1
- package/dist/components/Icon/Icon.stories.js +28 -19
- package/dist/components/Image/Image.js +69 -39
- package/dist/components/Image/Image.spec.js +22 -16
- package/dist/components/Image/Image.stories.js +19 -8
- package/dist/components/Input/Input.js +31 -14
- package/dist/components/Input/Input.stories.js +15 -5
- package/dist/components/Input/index.js +3 -1
- package/dist/components/Input/styles/index.js +10 -4
- package/dist/components/Link/Link.js +2 -1
- package/dist/components/Link/Link.stories.js +12 -5
- package/dist/components/Link/Link.styles.js +8 -8
- package/dist/components/List/List.js +37 -14
- package/dist/components/List/List.stories.js +55 -19
- package/dist/components/List/index.js +5 -2
- package/dist/components/List/styles/index.js +9 -2
- package/dist/components/List/styles/item.styles.js +1 -1
- package/dist/components/Loader/Loader.js +33 -17
- package/dist/components/Loader/Loader.stories.js +44 -24
- package/dist/components/Modal/Modal.js +23 -17
- package/dist/components/Modal/Modal.stories.js +100 -30
- package/dist/components/Modal/index.js +3 -1
- package/dist/components/Modal/styles/body.js +28 -11
- package/dist/components/Modal/styles/closeButton.js +4 -4
- package/dist/components/Modal/styles/dialog.js +4 -4
- package/dist/components/Modal/styles/dialogContainer.js +11 -5
- package/dist/components/Modal/styles/header.js +5 -5
- package/dist/components/Modal/styles/index.js +28 -12
- package/dist/components/Popover/Popover.js +33 -12
- package/dist/components/Popover/Popover.stories.js +62 -36
- package/dist/components/Popover/PopoverArrow.js +17 -3
- package/dist/components/Popover/PopoverCloseButton.js +17 -3
- package/dist/components/Popover/PopoverContent.js +27 -10
- package/dist/components/Popover/index.js +8 -4
- package/dist/components/Popover/styles/index.js +22 -9
- package/dist/components/Popover/styles/popover-arrow.js +4 -4
- package/dist/components/Popover/styles/popover-body.js +7 -3
- package/dist/components/Popover/styles/popover-close-button.js +10 -7
- package/dist/components/Popover/styles/popover-content.js +7 -5
- package/dist/components/Popover/styles/popover-header.js +1 -1
- package/dist/components/Popover/styles/popper.js +1 -1
- package/dist/components/Radio/Radio.js +27 -12
- package/dist/components/Radio/Radio.stories.js +12 -2
- package/dist/components/Radio/RadioGroup.js +33 -17
- package/dist/components/Radio/index.js +5 -2
- package/dist/components/Radio/styles/index.js +13 -5
- package/dist/components/Select/Select.js +33 -14
- package/dist/components/Select/Select.stories.js +22 -13
- package/dist/components/Select/index.js +3 -1
- package/dist/components/Select/styles/index.js +14 -4
- package/dist/components/Skeleton/Skeleton.stories.js +20 -6
- package/dist/components/Skeleton/Skeleton.styles.js +3 -0
- package/dist/components/Skeleton/index.js +4 -3
- package/dist/components/Spinner/Spinner.js +25 -9
- package/dist/components/Spinner/Spinner.stories.js +70 -42
- package/dist/components/Spinner/Spinner.styles.js +43 -56
- package/dist/components/Switch/Switch.js +30 -13
- package/dist/components/Switch/Switch.stories.js +10 -2
- package/dist/components/Switch/index.js +3 -1
- package/dist/components/Switch/styles/index.js +31 -10
- package/dist/components/Table/Table.js +2 -1
- package/dist/components/Table/Table.stories.js +37 -17
- package/dist/components/Table/Table.styles.js +32 -13
- package/dist/components/Table/index.js +11 -8
- package/dist/components/Tabs/Tabs.js +22 -14
- package/dist/components/Tabs/Tabs.stories.js +20 -4
- package/dist/components/Tabs/combineSizeWithVariant.js +17 -11
- package/dist/components/Tabs/index.js +8 -5
- package/dist/components/Tabs/styles/index.js +8 -2
- package/dist/components/Text/Text.js +17 -8
- package/dist/components/Text/Text.stories.js +15 -3
- package/dist/components/Text/Text.styles.js +35 -15
- package/dist/components/Text/combineAsWithVariant.js +57 -36
- package/dist/components/Text/options.js +1 -1
- package/dist/components/ThemeProvider/ThemeProvider.js +33 -10
- package/dist/components/ThemeProvider/ThemeProvider.stories.js +16 -7
- package/dist/components/index.js +133 -74
- package/dist/components/styles.js +43 -21
- package/dist/theme/base/breakpoints.js +4 -1
- package/dist/theme/base/colors.js +45 -32
- package/dist/theme/base/index.js +13 -7
- package/dist/theme/base/sizes.js +4 -4
- package/dist/theme/base/typography.js +6 -5
- package/dist/theme/base/zindices.js +2 -1
- package/dist/theme/global.js +20 -87
- package/dist/theme/index.js +41 -15
- package/dist/utils/Spaces.js +12 -5
- package/package.json +2 -2
|
@@ -1,29 +1,46 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
|
|
4
|
+
|
|
5
|
+
var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
|
|
6
|
+
|
|
7
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
8
|
+
|
|
3
9
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
10
|
+
|
|
4
11
|
Object.defineProperty(exports, "__esModule", {
|
|
5
12
|
value: true
|
|
6
13
|
});
|
|
7
14
|
exports.default = void 0;
|
|
15
|
+
|
|
8
16
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
17
|
+
|
|
18
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
19
|
+
|
|
9
20
|
var _react = _interopRequireWildcard(require("react"));
|
|
21
|
+
|
|
10
22
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
23
|
+
|
|
11
24
|
var _react2 = require("@chakra-ui/react");
|
|
25
|
+
|
|
12
26
|
var _FormControl = _interopRequireDefault(require("../FormControl/FormControl"));
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
+
|
|
28
|
+
var _excluded = ["label", "helperText", "errorMessage", "isInvalid", "isDisabled", "isRequired", "isOptional"];
|
|
29
|
+
|
|
30
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
31
|
+
|
|
32
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
33
|
+
|
|
34
|
+
var Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
35
|
+
var label = _ref.label,
|
|
36
|
+
helperText = _ref.helperText,
|
|
37
|
+
errorMessage = _ref.errorMessage,
|
|
38
|
+
isInvalid = _ref.isInvalid,
|
|
39
|
+
isDisabled = _ref.isDisabled,
|
|
40
|
+
isRequired = _ref.isRequired,
|
|
41
|
+
isOptional = _ref.isOptional,
|
|
42
|
+
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
43
|
+
var classes = (0, _classnames.default)({
|
|
27
44
|
'FormElement-contains-error': isInvalid
|
|
28
45
|
});
|
|
29
46
|
return /*#__PURE__*/_react.default.createElement(_FormControl.default, {
|
|
@@ -1,14 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = exports.Input = void 0;
|
|
9
|
+
|
|
8
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
11
|
+
|
|
9
12
|
var _react = _interopRequireDefault(require("react"));
|
|
13
|
+
|
|
10
14
|
var _Input = _interopRequireDefault(require("./Input"));
|
|
15
|
+
|
|
11
16
|
var _react2 = require("@chakra-ui/react");
|
|
17
|
+
|
|
12
18
|
var _default = {
|
|
13
19
|
title: 'v2/Input',
|
|
14
20
|
component: _Input.default,
|
|
@@ -19,11 +25,15 @@ var _default = {
|
|
|
19
25
|
}
|
|
20
26
|
};
|
|
21
27
|
exports.default = _default;
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
28
|
+
|
|
29
|
+
var InputTemplate = function InputTemplate(props) {
|
|
30
|
+
return /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({
|
|
31
|
+
variant: "outline",
|
|
32
|
+
maxWidth: "200px"
|
|
33
|
+
}, props));
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
var Input = InputTemplate.bind({});
|
|
27
37
|
exports.Input = Input;
|
|
28
38
|
Input.argTypes = {
|
|
29
39
|
placeholder: {
|
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
Object.defineProperty(exports, "default", {
|
|
8
9
|
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
+
get: function get() {
|
|
10
11
|
return _Input.default;
|
|
11
12
|
}
|
|
12
13
|
});
|
|
14
|
+
|
|
13
15
|
var _Input = _interopRequireDefault(require("./Input"));
|
|
@@ -1,13 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
|
|
8
10
|
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
11
|
+
|
|
9
12
|
var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
|
|
10
|
-
|
|
13
|
+
|
|
14
|
+
var baseStyle = {
|
|
11
15
|
field: {
|
|
12
16
|
_placeholder: {
|
|
13
17
|
color: 'text.secondary.light',
|
|
@@ -19,7 +23,7 @@ const baseStyle = {
|
|
|
19
23
|
}
|
|
20
24
|
}
|
|
21
25
|
};
|
|
22
|
-
|
|
26
|
+
var variants = {
|
|
23
27
|
outline: {
|
|
24
28
|
field: {
|
|
25
29
|
border: '1px solid',
|
|
@@ -58,8 +62,10 @@ const variants = {
|
|
|
58
62
|
}
|
|
59
63
|
}
|
|
60
64
|
};
|
|
65
|
+
|
|
61
66
|
var _default = (0, _merge.default)(_theme.default.components.Input, {
|
|
62
|
-
baseStyle,
|
|
63
|
-
variants
|
|
67
|
+
baseStyle: baseStyle,
|
|
68
|
+
variants: variants
|
|
64
69
|
});
|
|
70
|
+
|
|
65
71
|
exports.default = _default;
|
|
@@ -1,15 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = exports.Overview = void 0;
|
|
9
|
+
|
|
8
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
9
12
|
var _react2 = require("@chakra-ui/react");
|
|
13
|
+
|
|
10
14
|
var _share = _interopRequireDefault(require("@spothero/icons/share"));
|
|
15
|
+
|
|
11
16
|
var _Text = _interopRequireDefault(require("../Text/Text"));
|
|
17
|
+
|
|
12
18
|
var _Link = _interopRequireDefault(require("./Link"));
|
|
19
|
+
|
|
13
20
|
var _default = {
|
|
14
21
|
title: 'v2/Link',
|
|
15
22
|
component: _Link.default,
|
|
@@ -18,10 +25,9 @@ var _default = {
|
|
|
18
25
|
}
|
|
19
26
|
};
|
|
20
27
|
exports.default = _default;
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
} = _ref;
|
|
28
|
+
|
|
29
|
+
var OverviewTemplate = function OverviewTemplate(props, _ref) {
|
|
30
|
+
var hasDarkBackground = _ref.hasDarkBackground;
|
|
25
31
|
return /*#__PURE__*/_react.default.createElement(_react2.Box, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
26
32
|
color: hasDarkBackground ? 'text.primary.dark' : 'text.primary.light'
|
|
27
33
|
}, "A link with", ' ', /*#__PURE__*/_react.default.createElement(_Link.default, {
|
|
@@ -47,7 +53,8 @@ const OverviewTemplate = (props, _ref) => {
|
|
|
47
53
|
variant: hasDarkBackground ? 'onDark' : 'standard'
|
|
48
54
|
}, "React Router"), ' ', "and it will replace the ", /*#__PURE__*/_react.default.createElement("code", null, "a"), " tag with it's", ' ', /*#__PURE__*/_react.default.createElement("code", null, "Link"), "."));
|
|
49
55
|
};
|
|
50
|
-
|
|
56
|
+
|
|
57
|
+
var Overview = OverviewTemplate.bind({});
|
|
51
58
|
exports.Overview = Overview;
|
|
52
59
|
Overview.parameters = {
|
|
53
60
|
importBy: 'Link'
|
|
@@ -4,8 +4,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.variants = exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
transition:
|
|
7
|
+
var baseStyle = {
|
|
8
|
+
transition: "all 0.15s ease-out",
|
|
9
9
|
color: 'text.link.light',
|
|
10
10
|
fontWeight: 'semibold',
|
|
11
11
|
_hover: {
|
|
@@ -19,24 +19,24 @@ const baseStyle = {
|
|
|
19
19
|
verticalAlign: 'initial'
|
|
20
20
|
}
|
|
21
21
|
};
|
|
22
|
-
|
|
22
|
+
var linkOnDark = {
|
|
23
23
|
color: 'text.link.dark',
|
|
24
24
|
_hover: {
|
|
25
25
|
color: 'text.link.dark',
|
|
26
26
|
opacity: '.8'
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
|
-
|
|
29
|
+
var variants = {
|
|
30
30
|
standard: baseStyle,
|
|
31
31
|
onDark: linkOnDark
|
|
32
32
|
};
|
|
33
33
|
exports.variants = variants;
|
|
34
|
-
|
|
34
|
+
var defaultProps = {
|
|
35
35
|
variant: 'standard'
|
|
36
36
|
};
|
|
37
37
|
var _default = {
|
|
38
|
-
baseStyle,
|
|
39
|
-
variants,
|
|
40
|
-
defaultProps
|
|
38
|
+
baseStyle: baseStyle,
|
|
39
|
+
variants: variants,
|
|
40
|
+
defaultProps: defaultProps
|
|
41
41
|
};
|
|
42
42
|
exports.default = _default;
|
|
@@ -1,25 +1,45 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
|
|
4
|
+
|
|
5
|
+
var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
|
|
6
|
+
|
|
7
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
8
|
+
|
|
3
9
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
10
|
+
|
|
4
11
|
Object.defineProperty(exports, "__esModule", {
|
|
5
12
|
value: true
|
|
6
13
|
});
|
|
7
14
|
exports.default = void 0;
|
|
15
|
+
|
|
16
|
+
var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
|
|
17
|
+
|
|
8
18
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
19
|
+
|
|
20
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
21
|
+
|
|
9
22
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
23
|
+
|
|
10
24
|
var _react = _interopRequireWildcard(require("react"));
|
|
25
|
+
|
|
11
26
|
var _react2 = require("@chakra-ui/react");
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
27
|
+
|
|
28
|
+
var _excluded = ["type"];
|
|
29
|
+
|
|
30
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
31
|
+
|
|
32
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
33
|
+
|
|
34
|
+
var unorderedProps = {
|
|
15
35
|
as: 'ul',
|
|
16
36
|
styleType: 'disc'
|
|
17
37
|
};
|
|
18
|
-
|
|
38
|
+
var orderedProps = {
|
|
19
39
|
as: 'ol',
|
|
20
40
|
styleType: 'decimal'
|
|
21
41
|
};
|
|
22
|
-
|
|
42
|
+
var STYLE_POSITIONS = {
|
|
23
43
|
unset: 'unset',
|
|
24
44
|
revert: 'revert',
|
|
25
45
|
inside: 'inside',
|
|
@@ -27,26 +47,28 @@ const STYLE_POSITIONS = {
|
|
|
27
47
|
initial: 'initial',
|
|
28
48
|
inherit: 'inherit'
|
|
29
49
|
};
|
|
30
|
-
|
|
50
|
+
var TYPES = {
|
|
31
51
|
ordered: 'ordered',
|
|
32
52
|
unstyled: 'unstyled',
|
|
33
53
|
unordered: 'unordered'
|
|
34
54
|
};
|
|
35
|
-
|
|
55
|
+
|
|
56
|
+
var getListProps = function getListProps(type) {
|
|
36
57
|
switch (type) {
|
|
37
58
|
case TYPES.ordered:
|
|
38
59
|
return orderedProps;
|
|
60
|
+
|
|
39
61
|
case TYPES.unordered:
|
|
40
62
|
return unorderedProps;
|
|
63
|
+
|
|
41
64
|
default:
|
|
42
65
|
return;
|
|
43
66
|
}
|
|
44
67
|
};
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
} = _ref;
|
|
68
|
+
|
|
69
|
+
var List = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
70
|
+
var type = _ref.type,
|
|
71
|
+
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
50
72
|
return /*#__PURE__*/_react.default.createElement(_react2.List, (0, _extends2.default)({}, getListProps(type), props, {
|
|
51
73
|
ref: ref
|
|
52
74
|
}));
|
|
@@ -57,9 +79,10 @@ List.defaultProps = {
|
|
|
57
79
|
};
|
|
58
80
|
List.propTypes = {
|
|
59
81
|
/** The position of the list style */
|
|
60
|
-
stylePosition: _propTypes.default.oneOf(
|
|
82
|
+
stylePosition: _propTypes.default.oneOf((0, _keys.default)(STYLE_POSITIONS)),
|
|
83
|
+
|
|
61
84
|
/** Changes the underlying markdown to be an ordered or unorderd list, (unstyled will render a ul by default) */
|
|
62
|
-
type: _propTypes.default.oneOf(
|
|
85
|
+
type: _propTypes.default.oneOf((0, _keys.default)(TYPES))
|
|
63
86
|
};
|
|
64
87
|
var _default = List;
|
|
65
88
|
exports.default = _default;
|
|
@@ -1,31 +1,62 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
|
|
4
|
+
|
|
5
|
+
var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
|
|
6
|
+
|
|
7
|
+
var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
|
|
8
|
+
|
|
9
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
10
|
+
|
|
11
|
+
var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
|
|
12
|
+
|
|
3
13
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
14
|
+
|
|
4
15
|
Object.defineProperty(exports, "__esModule", {
|
|
5
16
|
value: true
|
|
6
17
|
});
|
|
7
18
|
exports.default = exports.Unstyled = exports.Unordered = exports.Overview = exports.Ordered = void 0;
|
|
19
|
+
|
|
20
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
21
|
+
|
|
22
|
+
var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
|
|
23
|
+
|
|
24
|
+
var _fill = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/fill"));
|
|
25
|
+
|
|
8
26
|
var _react = _interopRequireDefault(require("react"));
|
|
27
|
+
|
|
9
28
|
var _testDataBot = require("@jackfranklin/test-data-bot");
|
|
29
|
+
|
|
10
30
|
var _List = _interopRequireDefault(require("./List"));
|
|
31
|
+
|
|
11
32
|
var _index = require("./index");
|
|
33
|
+
|
|
12
34
|
var _Spaces = _interopRequireDefault(require("../../utils/Spaces"));
|
|
35
|
+
|
|
13
36
|
var _Text = _interopRequireDefault(require("../Text/Text"));
|
|
37
|
+
|
|
14
38
|
var _disableArgs = _interopRequireDefault(require("storybook/utils/disable-args"));
|
|
15
|
-
|
|
16
|
-
|
|
39
|
+
|
|
40
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
41
|
+
|
|
42
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
43
|
+
|
|
44
|
+
var DISABLE_TYPE = (0, _disableArgs.default)('type');
|
|
45
|
+
var randomListText = (0, _testDataBot.build)('ListText', {
|
|
17
46
|
fields: {
|
|
18
|
-
text: (0, _testDataBot.fake)(
|
|
47
|
+
text: (0, _testDataBot.fake)(function (f) {
|
|
48
|
+
return f.random.words(10);
|
|
49
|
+
})
|
|
19
50
|
}
|
|
20
51
|
});
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
return /*#__PURE__*/_react.default.createElement(_Text.default, null, "<List", type ? ` type="${type}"` : '', ">", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Spaces.default, null), "<ListItem>", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Spaces.default, {
|
|
52
|
+
|
|
53
|
+
var Usage = function Usage(_ref) {
|
|
54
|
+
var type = _ref.type;
|
|
55
|
+
return /*#__PURE__*/_react.default.createElement(_Text.default, null, "<List", type ? " type=\"".concat(type, "\"") : '', ">", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Spaces.default, null), "<ListItem>", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Spaces.default, {
|
|
26
56
|
spaces: 6
|
|
27
57
|
}), "...", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Spaces.default, null), "</ListItem>", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Spaces.default, null), "...", /*#__PURE__*/_react.default.createElement("br", null), "</List>");
|
|
28
58
|
};
|
|
59
|
+
|
|
29
60
|
var _default = {
|
|
30
61
|
title: 'v2/List',
|
|
31
62
|
component: _List.default,
|
|
@@ -38,17 +69,25 @@ var _default = {
|
|
|
38
69
|
}
|
|
39
70
|
};
|
|
40
71
|
exports.default = _default;
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
72
|
+
|
|
73
|
+
var OverviewTemplate = function OverviewTemplate(props) {
|
|
74
|
+
var _context, _context2;
|
|
75
|
+
|
|
76
|
+
return /*#__PURE__*/_react.default.createElement(_List.default, props, (0, _map.default)(_context = (0, _fill.default)(_context2 = Array(10)).call(_context2, null)).call(_context, function (_, index) {
|
|
77
|
+
return /*#__PURE__*/_react.default.createElement(_index.ListItem, {
|
|
78
|
+
key: index
|
|
79
|
+
}, randomListText().text);
|
|
80
|
+
}));
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
var Overview = OverviewTemplate.bind({});
|
|
45
84
|
exports.Overview = Overview;
|
|
46
85
|
Overview.parameters = {
|
|
47
86
|
usage: [/*#__PURE__*/_react.default.createElement(Usage, {
|
|
48
87
|
key: 1
|
|
49
88
|
})]
|
|
50
89
|
};
|
|
51
|
-
|
|
90
|
+
var Unordered = OverviewTemplate.bind({});
|
|
52
91
|
exports.Unordered = Unordered;
|
|
53
92
|
Unordered.argTypes = DISABLE_TYPE;
|
|
54
93
|
Unordered.parameters = {
|
|
@@ -60,7 +99,7 @@ Unordered.parameters = {
|
|
|
60
99
|
Unordered.args = {
|
|
61
100
|
type: 'unordered'
|
|
62
101
|
};
|
|
63
|
-
|
|
102
|
+
var Ordered = OverviewTemplate.bind({});
|
|
64
103
|
exports.Ordered = Ordered;
|
|
65
104
|
Ordered.argTypes = DISABLE_TYPE;
|
|
66
105
|
Ordered.parameters = {
|
|
@@ -72,17 +111,14 @@ Ordered.parameters = {
|
|
|
72
111
|
Ordered.args = {
|
|
73
112
|
type: 'ordered'
|
|
74
113
|
};
|
|
75
|
-
|
|
114
|
+
var Unstyled = OverviewTemplate.bind({});
|
|
76
115
|
exports.Unstyled = Unstyled;
|
|
77
116
|
Unstyled.parameters = {
|
|
78
117
|
usage: [/*#__PURE__*/_react.default.createElement(Usage, {
|
|
79
118
|
key: 1
|
|
80
119
|
})]
|
|
81
120
|
};
|
|
82
|
-
Unstyled.argTypes = {
|
|
83
|
-
...DISABLE_TYPE,
|
|
84
|
-
...(0, _disableArgs.default)('stylePosition')
|
|
85
|
-
};
|
|
121
|
+
Unstyled.argTypes = _objectSpread(_objectSpread({}, DISABLE_TYPE), (0, _disableArgs.default)('stylePosition'));
|
|
86
122
|
Unstyled.args = {
|
|
87
123
|
type: 'unstyled'
|
|
88
124
|
};
|
|
@@ -1,20 +1,23 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
Object.defineProperty(exports, "ListItem", {
|
|
8
9
|
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
+
get: function get() {
|
|
10
11
|
return _react.ListItem;
|
|
11
12
|
}
|
|
12
13
|
});
|
|
13
14
|
Object.defineProperty(exports, "default", {
|
|
14
15
|
enumerable: true,
|
|
15
|
-
get: function () {
|
|
16
|
+
get: function get() {
|
|
16
17
|
return _List.default;
|
|
17
18
|
}
|
|
18
19
|
});
|
|
20
|
+
|
|
19
21
|
var _List = _interopRequireDefault(require("./List"));
|
|
22
|
+
|
|
20
23
|
var _react = require("@chakra-ui/react");
|
|
@@ -1,17 +1,24 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
|
|
8
10
|
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
11
|
+
|
|
9
12
|
var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
|
|
13
|
+
|
|
10
14
|
var _item = _interopRequireDefault(require("./item.styles"));
|
|
11
|
-
|
|
15
|
+
|
|
16
|
+
var baseStyle = {
|
|
12
17
|
item: _item.default
|
|
13
18
|
};
|
|
19
|
+
|
|
14
20
|
var _default = (0, _merge.default)(_theme.default.components.List, {
|
|
15
|
-
baseStyle
|
|
21
|
+
baseStyle: baseStyle
|
|
16
22
|
});
|
|
23
|
+
|
|
17
24
|
exports.default = _default;
|
|
@@ -1,37 +1,52 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
|
|
8
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
11
|
+
|
|
12
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
13
|
+
|
|
9
14
|
var _react = _interopRequireDefault(require("react"));
|
|
15
|
+
|
|
10
16
|
var _react2 = require("@chakra-ui/react");
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
17
|
+
|
|
18
|
+
var _excluded = ["color", "loaderBackgroundColor", "isInfinite", "size", "thickness", "trackColor", "value"];
|
|
19
|
+
|
|
20
|
+
var Loader = function Loader(_ref) {
|
|
21
|
+
var _ref$color = _ref.color,
|
|
22
|
+
color = _ref$color === void 0 ? 'success' : _ref$color,
|
|
23
|
+
_ref$loaderBackground = _ref.loaderBackgroundColor,
|
|
24
|
+
loaderBackgroundColor = _ref$loaderBackground === void 0 ? 'transparent' : _ref$loaderBackground,
|
|
25
|
+
_ref$isInfinite = _ref.isInfinite,
|
|
26
|
+
isInfinite = _ref$isInfinite === void 0 ? true : _ref$isInfinite,
|
|
27
|
+
_ref$size = _ref.size,
|
|
28
|
+
size = _ref$size === void 0 ? 12 : _ref$size,
|
|
29
|
+
_ref$thickness = _ref.thickness,
|
|
30
|
+
thickness = _ref$thickness === void 0 ? 2 : _ref$thickness,
|
|
31
|
+
_ref$trackColor = _ref.trackColor,
|
|
32
|
+
trackColor = _ref$trackColor === void 0 ? 'gray.medium' : _ref$trackColor,
|
|
33
|
+
_ref$value = _ref.value,
|
|
34
|
+
value = _ref$value === void 0 ? 0 : _ref$value,
|
|
35
|
+
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
36
|
+
|
|
22
37
|
/* -------------------------------------------------------------------- *\
|
|
23
38
|
Note: Since most of the props for this component control multiple
|
|
24
39
|
styles at a time, it was decided that it made the most sense to set
|
|
25
40
|
up the default style-related properties here in lou of creating an
|
|
26
41
|
overly complex styles file.
|
|
27
42
|
\* -------------------------------------------------------------------- */
|
|
28
|
-
|
|
29
|
-
color,
|
|
43
|
+
var loaderDefaultProps = {
|
|
44
|
+
color: color,
|
|
30
45
|
isIndeterminate: isInfinite,
|
|
31
|
-
size,
|
|
32
|
-
thickness,
|
|
33
|
-
trackColor,
|
|
34
|
-
value,
|
|
46
|
+
size: size,
|
|
47
|
+
thickness: thickness,
|
|
48
|
+
trackColor: trackColor,
|
|
49
|
+
value: value,
|
|
35
50
|
capIsRound: true
|
|
36
51
|
};
|
|
37
52
|
return /*#__PURE__*/_react.default.createElement(_react2.CircularProgress, (0, _extends2.default)({
|
|
@@ -42,5 +57,6 @@ const Loader = _ref => {
|
|
|
42
57
|
}
|
|
43
58
|
}, loaderDefaultProps, props));
|
|
44
59
|
};
|
|
60
|
+
|
|
45
61
|
var _default = Loader;
|
|
46
62
|
exports.default = _default;
|