@spothero/ui 17.0.2 → 17.0.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 +1 -2
- package/dist/components/Accordion/Accordion.stories.js +13 -22
- package/dist/components/Accordion/index.js +5 -8
- package/dist/components/Accordion/styles/button.js +1 -3
- package/dist/components/Accordion/styles/container.js +1 -1
- package/dist/components/Accordion/styles/index.js +4 -13
- package/dist/components/Accordion/styles/panel.js +1 -1
- package/dist/components/Alert/Alert.js +23 -44
- package/dist/components/Alert/Alert.stories.js +8 -12
- package/dist/components/Alert/index.js +1 -3
- package/dist/components/Alert/styles/index.js +12 -35
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +84 -119
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +4 -12
- package/dist/components/AutoSuggestSelect/index.js +1 -3
- package/dist/components/Badge/Badge.js +1 -2
- package/dist/components/Badge/Badge.stories.js +12 -20
- package/dist/components/Badge/styles/index.js +6 -12
- package/dist/components/Button/Button.js +17 -47
- package/dist/components/Button/Button.spec.js +4 -10
- package/dist/components/Button/Button.styles.js +36 -49
- package/dist/components/Button/button-props.js +2 -20
- package/dist/components/Button/index.js +2 -5
- package/dist/components/Button/stories/button.js +5 -17
- package/dist/components/Button/stories/index.stories.js +24 -48
- package/dist/components/Button/stories/overview.js +34 -62
- package/dist/components/Card/Card.js +11 -26
- package/dist/components/Card/Card.stories.js +5 -15
- package/dist/components/Checkbox/Checkbox.js +1 -2
- package/dist/components/Checkbox/Checkbox.stories.js +2 -10
- package/dist/components/Checkbox/index.js +1 -3
- package/dist/components/Checkbox/styles/index.js +3 -11
- package/dist/components/Container/Container.js +5 -21
- package/dist/components/Container/Container.stories.js +14 -43
- package/dist/components/Container/Container.styles.js +1 -1
- package/dist/components/Divider/Divider.js +8 -24
- package/dist/components/Divider/Divider.stories.js +3 -15
- package/dist/components/Divider/Divider.styles.js +2 -8
- package/dist/components/FormControl/FormControl.js +14 -29
- package/dist/components/Grid/Grid.js +7 -24
- package/dist/components/Grid/Grid.stories.js +36 -60
- package/dist/components/Grid/Grid.styles.js +2 -2
- package/dist/components/Grid/GridItem.js +5 -21
- package/dist/components/Grid/GridItem.styles.js +2 -1
- package/dist/components/Grid/index.js +2 -5
- package/dist/components/Heading/Heading.js +8 -29
- package/dist/components/Heading/Heading.stories.js +4 -15
- package/dist/components/Heading/Heading.styles.js +24 -38
- package/dist/components/Icon/Icon.js +1 -2
- package/dist/components/Icon/Icon.stories.js +19 -28
- package/dist/components/Image/Image.js +39 -69
- package/dist/components/Image/Image.spec.js +16 -22
- package/dist/components/Image/Image.stories.js +8 -19
- package/dist/components/Input/Input.js +14 -31
- package/dist/components/Input/Input.stories.js +5 -15
- package/dist/components/Input/index.js +1 -3
- package/dist/components/Input/styles/index.js +4 -10
- package/dist/components/Link/Link.js +1 -2
- package/dist/components/Link/Link.stories.js +5 -12
- package/dist/components/Link/Link.styles.js +8 -8
- package/dist/components/List/List.js +14 -37
- package/dist/components/List/List.stories.js +19 -55
- package/dist/components/List/index.js +2 -5
- package/dist/components/List/styles/index.js +2 -9
- package/dist/components/List/styles/item.styles.js +1 -1
- package/dist/components/Loader/Loader.js +17 -33
- package/dist/components/Loader/Loader.stories.js +24 -44
- package/dist/components/Modal/Modal.js +17 -23
- package/dist/components/Modal/Modal.stories.js +30 -100
- package/dist/components/Modal/index.js +1 -3
- package/dist/components/Modal/styles/body.js +11 -28
- 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 +5 -11
- package/dist/components/Modal/styles/header.js +5 -5
- package/dist/components/Modal/styles/index.js +12 -28
- package/dist/components/Popover/Popover.js +12 -33
- package/dist/components/Popover/Popover.stories.js +36 -62
- package/dist/components/Popover/PopoverArrow.js +3 -17
- package/dist/components/Popover/PopoverCloseButton.js +3 -17
- package/dist/components/Popover/PopoverContent.js +10 -27
- package/dist/components/Popover/index.js +4 -8
- package/dist/components/Popover/styles/index.js +9 -22
- package/dist/components/Popover/styles/popover-arrow.js +4 -4
- package/dist/components/Popover/styles/popover-body.js +3 -7
- package/dist/components/Popover/styles/popover-close-button.js +7 -10
- package/dist/components/Popover/styles/popover-content.js +5 -7
- 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 +12 -27
- package/dist/components/Radio/Radio.stories.js +2 -12
- package/dist/components/Radio/RadioGroup.js +17 -33
- package/dist/components/Radio/index.js +2 -5
- package/dist/components/Radio/styles/index.js +5 -13
- package/dist/components/Select/Select.js +14 -33
- package/dist/components/Select/Select.stories.js +13 -22
- package/dist/components/Select/index.js +1 -3
- package/dist/components/Select/styles/index.js +4 -14
- package/dist/components/Skeleton/Skeleton.stories.js +6 -20
- package/dist/components/Skeleton/Skeleton.styles.js +0 -3
- package/dist/components/Skeleton/index.js +3 -4
- package/dist/components/Spinner/Spinner.js +9 -25
- package/dist/components/Spinner/Spinner.stories.js +42 -70
- package/dist/components/Spinner/Spinner.styles.js +56 -43
- package/dist/components/Switch/Switch.js +13 -30
- package/dist/components/Switch/Switch.stories.js +2 -10
- package/dist/components/Switch/index.js +1 -3
- package/dist/components/Switch/styles/index.js +10 -31
- package/dist/components/Table/Table.js +1 -2
- package/dist/components/Table/Table.stories.js +17 -37
- package/dist/components/Table/Table.styles.js +13 -32
- package/dist/components/Table/index.js +8 -11
- package/dist/components/Tabs/Tabs.js +14 -22
- package/dist/components/Tabs/Tabs.stories.js +4 -20
- package/dist/components/Tabs/combineSizeWithVariant.js +11 -17
- package/dist/components/Tabs/index.js +5 -8
- package/dist/components/Tabs/styles/index.js +2 -8
- package/dist/components/Text/Text.js +8 -17
- package/dist/components/Text/Text.stories.js +3 -15
- package/dist/components/Text/Text.styles.js +15 -35
- package/dist/components/Text/combineAsWithVariant.js +36 -57
- package/dist/components/Text/options.js +1 -1
- package/dist/components/ThemeProvider/ThemeProvider.js +10 -33
- package/dist/components/ThemeProvider/ThemeProvider.stories.js +7 -16
- package/dist/components/index.js +74 -117
- package/dist/components/styles.js +21 -43
- package/dist/theme/base/breakpoints.js +1 -4
- package/dist/theme/base/colors.js +32 -45
- package/dist/theme/base/index.js +7 -13
- package/dist/theme/base/sizes.js +4 -4
- package/dist/theme/base/typography.js +5 -6
- package/dist/theme/base/zindices.js +1 -2
- package/dist/theme/global.js +87 -20
- package/dist/theme/index.js +15 -41
- package/dist/utils/Spaces.js +5 -12
- package/package.json +2 -2
|
@@ -1,45 +1,25 @@
|
|
|
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
|
-
|
|
9
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
10
|
-
|
|
11
4
|
Object.defineProperty(exports, "__esModule", {
|
|
12
5
|
value: true
|
|
13
6
|
});
|
|
14
7
|
exports.default = void 0;
|
|
15
|
-
|
|
16
|
-
var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
|
|
17
|
-
|
|
18
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
19
|
-
|
|
20
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
21
|
-
|
|
22
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
23
|
-
|
|
24
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
25
|
-
|
|
26
11
|
var _react2 = require("@chakra-ui/react");
|
|
27
|
-
|
|
28
|
-
var
|
|
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 = {
|
|
12
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
+
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; }
|
|
14
|
+
const unorderedProps = {
|
|
35
15
|
as: 'ul',
|
|
36
16
|
styleType: 'disc'
|
|
37
17
|
};
|
|
38
|
-
|
|
18
|
+
const orderedProps = {
|
|
39
19
|
as: 'ol',
|
|
40
20
|
styleType: 'decimal'
|
|
41
21
|
};
|
|
42
|
-
|
|
22
|
+
const STYLE_POSITIONS = {
|
|
43
23
|
unset: 'unset',
|
|
44
24
|
revert: 'revert',
|
|
45
25
|
inside: 'inside',
|
|
@@ -47,28 +27,26 @@ var STYLE_POSITIONS = {
|
|
|
47
27
|
initial: 'initial',
|
|
48
28
|
inherit: 'inherit'
|
|
49
29
|
};
|
|
50
|
-
|
|
30
|
+
const TYPES = {
|
|
51
31
|
ordered: 'ordered',
|
|
52
32
|
unstyled: 'unstyled',
|
|
53
33
|
unordered: 'unordered'
|
|
54
34
|
};
|
|
55
|
-
|
|
56
|
-
var getListProps = function getListProps(type) {
|
|
35
|
+
const getListProps = type => {
|
|
57
36
|
switch (type) {
|
|
58
37
|
case TYPES.ordered:
|
|
59
38
|
return orderedProps;
|
|
60
|
-
|
|
61
39
|
case TYPES.unordered:
|
|
62
40
|
return unorderedProps;
|
|
63
|
-
|
|
64
41
|
default:
|
|
65
42
|
return;
|
|
66
43
|
}
|
|
67
44
|
};
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
45
|
+
const List = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
46
|
+
let {
|
|
47
|
+
type,
|
|
48
|
+
...props
|
|
49
|
+
} = _ref;
|
|
72
50
|
return /*#__PURE__*/_react.default.createElement(_react2.List, (0, _extends2.default)({}, getListProps(type), props, {
|
|
73
51
|
ref: ref
|
|
74
52
|
}));
|
|
@@ -79,10 +57,9 @@ List.defaultProps = {
|
|
|
79
57
|
};
|
|
80
58
|
List.propTypes = {
|
|
81
59
|
/** The position of the list style */
|
|
82
|
-
stylePosition: _propTypes.default.oneOf(
|
|
83
|
-
|
|
60
|
+
stylePosition: _propTypes.default.oneOf(Object.keys(STYLE_POSITIONS)),
|
|
84
61
|
/** Changes the underlying markdown to be an ordered or unorderd list, (unstyled will render a ul by default) */
|
|
85
|
-
type: _propTypes.default.oneOf(
|
|
62
|
+
type: _propTypes.default.oneOf(Object.keys(TYPES))
|
|
86
63
|
};
|
|
87
64
|
var _default = List;
|
|
88
65
|
exports.default = _default;
|
|
@@ -1,62 +1,31 @@
|
|
|
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
|
-
|
|
13
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
14
|
-
|
|
15
4
|
Object.defineProperty(exports, "__esModule", {
|
|
16
5
|
value: true
|
|
17
6
|
});
|
|
18
7
|
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
|
-
|
|
26
8
|
var _react = _interopRequireDefault(require("react"));
|
|
27
|
-
|
|
28
9
|
var _testDataBot = require("@jackfranklin/test-data-bot");
|
|
29
|
-
|
|
30
10
|
var _List = _interopRequireDefault(require("./List"));
|
|
31
|
-
|
|
32
11
|
var _index = require("./index");
|
|
33
|
-
|
|
34
12
|
var _Spaces = _interopRequireDefault(require("../../utils/Spaces"));
|
|
35
|
-
|
|
36
13
|
var _Text = _interopRequireDefault(require("../Text/Text"));
|
|
37
|
-
|
|
38
14
|
var _disableArgs = _interopRequireDefault(require("storybook/utils/disable-args"));
|
|
39
|
-
|
|
40
|
-
|
|
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', {
|
|
15
|
+
const DISABLE_TYPE = (0, _disableArgs.default)('type');
|
|
16
|
+
const randomListText = (0, _testDataBot.build)('ListText', {
|
|
46
17
|
fields: {
|
|
47
|
-
text: (0, _testDataBot.fake)(
|
|
48
|
-
return f.random.words(10);
|
|
49
|
-
})
|
|
18
|
+
text: (0, _testDataBot.fake)(f => f.random.words(10))
|
|
50
19
|
}
|
|
51
20
|
});
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
21
|
+
const Usage = _ref => {
|
|
22
|
+
let {
|
|
23
|
+
type
|
|
24
|
+
} = _ref;
|
|
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, {
|
|
56
26
|
spaces: 6
|
|
57
27
|
}), "...", /*#__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>");
|
|
58
28
|
};
|
|
59
|
-
|
|
60
29
|
var _default = {
|
|
61
30
|
title: 'v2/List',
|
|
62
31
|
component: _List.default,
|
|
@@ -69,25 +38,17 @@ var _default = {
|
|
|
69
38
|
}
|
|
70
39
|
};
|
|
71
40
|
exports.default = _default;
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
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({});
|
|
41
|
+
const OverviewTemplate = props => /*#__PURE__*/_react.default.createElement(_List.default, props, Array(10).fill(null).map((_, index) => /*#__PURE__*/_react.default.createElement(_index.ListItem, {
|
|
42
|
+
key: index
|
|
43
|
+
}, randomListText().text)));
|
|
44
|
+
const Overview = OverviewTemplate.bind({});
|
|
84
45
|
exports.Overview = Overview;
|
|
85
46
|
Overview.parameters = {
|
|
86
47
|
usage: [/*#__PURE__*/_react.default.createElement(Usage, {
|
|
87
48
|
key: 1
|
|
88
49
|
})]
|
|
89
50
|
};
|
|
90
|
-
|
|
51
|
+
const Unordered = OverviewTemplate.bind({});
|
|
91
52
|
exports.Unordered = Unordered;
|
|
92
53
|
Unordered.argTypes = DISABLE_TYPE;
|
|
93
54
|
Unordered.parameters = {
|
|
@@ -99,7 +60,7 @@ Unordered.parameters = {
|
|
|
99
60
|
Unordered.args = {
|
|
100
61
|
type: 'unordered'
|
|
101
62
|
};
|
|
102
|
-
|
|
63
|
+
const Ordered = OverviewTemplate.bind({});
|
|
103
64
|
exports.Ordered = Ordered;
|
|
104
65
|
Ordered.argTypes = DISABLE_TYPE;
|
|
105
66
|
Ordered.parameters = {
|
|
@@ -111,14 +72,17 @@ Ordered.parameters = {
|
|
|
111
72
|
Ordered.args = {
|
|
112
73
|
type: 'ordered'
|
|
113
74
|
};
|
|
114
|
-
|
|
75
|
+
const Unstyled = OverviewTemplate.bind({});
|
|
115
76
|
exports.Unstyled = Unstyled;
|
|
116
77
|
Unstyled.parameters = {
|
|
117
78
|
usage: [/*#__PURE__*/_react.default.createElement(Usage, {
|
|
118
79
|
key: 1
|
|
119
80
|
})]
|
|
120
81
|
};
|
|
121
|
-
Unstyled.argTypes =
|
|
82
|
+
Unstyled.argTypes = {
|
|
83
|
+
...DISABLE_TYPE,
|
|
84
|
+
...(0, _disableArgs.default)('stylePosition')
|
|
85
|
+
};
|
|
122
86
|
Unstyled.args = {
|
|
123
87
|
type: 'unstyled'
|
|
124
88
|
};
|
|
@@ -1,23 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
Object.defineProperty(exports, "ListItem", {
|
|
9
8
|
enumerable: true,
|
|
10
|
-
get: function
|
|
9
|
+
get: function () {
|
|
11
10
|
return _react.ListItem;
|
|
12
11
|
}
|
|
13
12
|
});
|
|
14
13
|
Object.defineProperty(exports, "default", {
|
|
15
14
|
enumerable: true,
|
|
16
|
-
get: function
|
|
15
|
+
get: function () {
|
|
17
16
|
return _List.default;
|
|
18
17
|
}
|
|
19
18
|
});
|
|
20
|
-
|
|
21
19
|
var _List = _interopRequireDefault(require("./List"));
|
|
22
|
-
|
|
23
20
|
var _react = require("@chakra-ui/react");
|
|
@@ -1,24 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
11
|
-
|
|
12
9
|
var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
|
|
13
|
-
|
|
14
10
|
var _item = _interopRequireDefault(require("./item.styles"));
|
|
15
|
-
|
|
16
|
-
var baseStyle = {
|
|
11
|
+
const baseStyle = {
|
|
17
12
|
item: _item.default
|
|
18
13
|
};
|
|
19
|
-
|
|
20
14
|
var _default = (0, _merge.default)(_theme.default.components.List, {
|
|
21
|
-
baseStyle
|
|
15
|
+
baseStyle
|
|
22
16
|
});
|
|
23
|
-
|
|
24
17
|
exports.default = _default;
|
|
@@ -1,52 +1,37 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = void 0;
|
|
9
|
-
|
|
10
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
11
|
-
|
|
12
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
13
|
-
|
|
14
9
|
var _react = _interopRequireDefault(require("react"));
|
|
15
|
-
|
|
16
10
|
var _react2 = require("@chakra-ui/react");
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
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
|
-
|
|
11
|
+
const Loader = _ref => {
|
|
12
|
+
let {
|
|
13
|
+
color = 'success',
|
|
14
|
+
loaderBackgroundColor = 'transparent',
|
|
15
|
+
isInfinite = true,
|
|
16
|
+
size = 12,
|
|
17
|
+
thickness = 2,
|
|
18
|
+
trackColor = 'gray.medium',
|
|
19
|
+
value = 0,
|
|
20
|
+
...props
|
|
21
|
+
} = _ref;
|
|
37
22
|
/* -------------------------------------------------------------------- *\
|
|
38
23
|
Note: Since most of the props for this component control multiple
|
|
39
24
|
styles at a time, it was decided that it made the most sense to set
|
|
40
25
|
up the default style-related properties here in lou of creating an
|
|
41
26
|
overly complex styles file.
|
|
42
27
|
\* -------------------------------------------------------------------- */
|
|
43
|
-
|
|
44
|
-
color
|
|
28
|
+
const loaderDefaultProps = {
|
|
29
|
+
color,
|
|
45
30
|
isIndeterminate: isInfinite,
|
|
46
|
-
size
|
|
47
|
-
thickness
|
|
48
|
-
trackColor
|
|
49
|
-
value
|
|
31
|
+
size,
|
|
32
|
+
thickness,
|
|
33
|
+
trackColor,
|
|
34
|
+
value,
|
|
50
35
|
capIsRound: true
|
|
51
36
|
};
|
|
52
37
|
return /*#__PURE__*/_react.default.createElement(_react2.CircularProgress, (0, _extends2.default)({
|
|
@@ -57,6 +42,5 @@ var Loader = function Loader(_ref) {
|
|
|
57
42
|
}
|
|
58
43
|
}, loaderDefaultProps, props));
|
|
59
44
|
};
|
|
60
|
-
|
|
61
45
|
var _default = Loader;
|
|
62
46
|
exports.default = _default;
|
|
@@ -1,36 +1,14 @@
|
|
|
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
|
-
|
|
13
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
14
|
-
|
|
15
4
|
Object.defineProperty(exports, "__esModule", {
|
|
16
5
|
value: true
|
|
17
6
|
});
|
|
18
7
|
exports.default = exports.Overview = exports.InfiniteLoader = exports.FiniteLoader = void 0;
|
|
19
|
-
|
|
20
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
21
|
-
|
|
22
8
|
var _react = _interopRequireDefault(require("react"));
|
|
23
|
-
|
|
24
9
|
var _disableArgs = _interopRequireDefault(require("storybook/utils/disable-args"));
|
|
25
|
-
|
|
26
10
|
var _createControl = require("storybook/utils/create-control");
|
|
27
|
-
|
|
28
11
|
var _Loader = _interopRequireDefault(require("./Loader"));
|
|
29
|
-
|
|
30
|
-
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; }
|
|
31
|
-
|
|
32
|
-
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; }
|
|
33
|
-
|
|
34
12
|
var _default = {
|
|
35
13
|
title: 'v2/Loader',
|
|
36
14
|
component: _Loader.default,
|
|
@@ -38,7 +16,7 @@ var _default = {
|
|
|
38
16
|
removeBaseHtmlClass: true,
|
|
39
17
|
importBy: 'Loader'
|
|
40
18
|
},
|
|
41
|
-
argTypes:
|
|
19
|
+
argTypes: {
|
|
42
20
|
color: {
|
|
43
21
|
options: ['primary.default', 'secondary.default', 'white', 'success', 'warning', 'error'],
|
|
44
22
|
control: {
|
|
@@ -96,25 +74,23 @@ var _default = {
|
|
|
96
74
|
white: 'White'
|
|
97
75
|
}
|
|
98
76
|
}
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
77
|
+
},
|
|
78
|
+
...(0, _createControl.createRangeControl)({
|
|
79
|
+
name: 'thickness',
|
|
80
|
+
min: 2,
|
|
81
|
+
max: 16,
|
|
82
|
+
step: 2
|
|
83
|
+
}),
|
|
84
|
+
...(0, _createControl.createRangeControl)({
|
|
85
|
+
name: 'value',
|
|
86
|
+
min: 1,
|
|
87
|
+
max: 100
|
|
88
|
+
})
|
|
89
|
+
}
|
|
110
90
|
};
|
|
111
91
|
exports.default = _default;
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
return /*#__PURE__*/_react.default.createElement(_Loader.default, props);
|
|
115
|
-
};
|
|
116
|
-
|
|
117
|
-
var Overview = Template.bind({});
|
|
92
|
+
const Template = props => /*#__PURE__*/_react.default.createElement(_Loader.default, props);
|
|
93
|
+
const Overview = Template.bind({});
|
|
118
94
|
exports.Overview = Overview;
|
|
119
95
|
Overview.args = {
|
|
120
96
|
color: 'success',
|
|
@@ -125,16 +101,20 @@ Overview.args = {
|
|
|
125
101
|
trackColor: 'gray.medium',
|
|
126
102
|
value: 35
|
|
127
103
|
};
|
|
128
|
-
|
|
104
|
+
const FiniteLoader = Template.bind({});
|
|
129
105
|
exports.FiniteLoader = FiniteLoader;
|
|
130
|
-
FiniteLoader.argTypes =
|
|
106
|
+
FiniteLoader.argTypes = {
|
|
107
|
+
...(0, _disableArgs.default)(['color', 'isInfinite', 'loaderBackgroundColor', 'size', 'thickness', 'trackColor'])
|
|
108
|
+
};
|
|
131
109
|
FiniteLoader.args = {
|
|
132
110
|
isInfinite: false,
|
|
133
111
|
value: 35
|
|
134
112
|
};
|
|
135
|
-
|
|
113
|
+
const InfiniteLoader = Template.bind({});
|
|
136
114
|
exports.InfiniteLoader = InfiniteLoader;
|
|
137
|
-
InfiniteLoader.argTypes =
|
|
115
|
+
InfiniteLoader.argTypes = {
|
|
116
|
+
...(0, _disableArgs.default)(['color', 'loaderBackgroundColor', 'size', 'thickness', 'trackColor', 'value'])
|
|
117
|
+
};
|
|
138
118
|
InfiniteLoader.args = {
|
|
139
119
|
isInfinite: true
|
|
140
120
|
};
|
|
@@ -1,52 +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
|
-
|
|
9
3
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
10
|
-
|
|
11
4
|
Object.defineProperty(exports, "__esModule", {
|
|
12
5
|
value: true
|
|
13
6
|
});
|
|
14
7
|
exports.default = void 0;
|
|
15
|
-
|
|
16
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
17
|
-
|
|
18
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
19
|
-
|
|
20
10
|
var _react2 = require("@chakra-ui/react");
|
|
21
|
-
|
|
22
11
|
var _header = _interopRequireDefault(require("./styles/header"));
|
|
23
|
-
|
|
24
|
-
function
|
|
25
|
-
|
|
26
|
-
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; }
|
|
27
|
-
|
|
12
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
+
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; }
|
|
28
14
|
/**
|
|
29
15
|
* @param {boolean} isMobile - Whether or not the Modal is opened in a mobile viewport
|
|
30
16
|
* @param {boolean} isOpen - Whether or not the Modal is open
|
|
31
17
|
* @param {React.ReactNode} children - The header text of the modal
|
|
32
18
|
* @param {()=>void} [onClose] - Callback invoked to close the Modal. Not required, but strongly suggested.
|
|
33
19
|
* @param {('sm'|'md'|'lg')} [size] - The size of the modal. If unspecified, uses "md" styles.
|
|
20
|
+
* @param {object} [contentStyling] - Style props to be passed into the modal content
|
|
21
|
+
* @param {object} [headerStyling] - Style props to be passed into the modal header
|
|
22
|
+
* @param {object} [footerStyling] - Style props to be passed into the modal footer
|
|
34
23
|
* @param {React.ReactNode} [header] - The node for the header. Likely just a string.
|
|
35
24
|
* @param {React.ReactNode} [footer] - The node for the footer. Likely some control buttons.
|
|
36
25
|
* @param {React.ReactNode} [hideCloseButton] - Whether or not to show the close button
|
|
37
26
|
* @returns {React.ReactElement} - The Modal component
|
|
38
27
|
*/
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
28
|
+
const Modal = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
|
|
29
|
+
const {
|
|
30
|
+
header,
|
|
31
|
+
footer,
|
|
32
|
+
children,
|
|
33
|
+
hideCloseButton,
|
|
34
|
+
isMobile,
|
|
35
|
+
contentStyling = {},
|
|
36
|
+
headerStyling = {},
|
|
37
|
+
footerStyling = {}
|
|
38
|
+
} = props;
|
|
45
39
|
return /*#__PURE__*/_react.default.createElement(_react2.Modal, (0, _extends2.default)({
|
|
46
40
|
motionPreset: isMobile ? 'slideInBottom' : 'scale'
|
|
47
41
|
}, props, {
|
|
48
42
|
ref: ref
|
|
49
|
-
}), /*#__PURE__*/_react.default.createElement(_react2.ModalOverlay, null), /*#__PURE__*/_react.default.createElement(_react2.ModalContent,
|
|
43
|
+
}), /*#__PURE__*/_react.default.createElement(_react2.ModalOverlay, null), /*#__PURE__*/_react.default.createElement(_react2.ModalContent, contentStyling, header ? /*#__PURE__*/_react.default.createElement(_react2.ModalHeader, headerStyling, header) : /*#__PURE__*/_react.default.createElement(_react2.Box, (0, _header.default)(props)), hideCloseButton ? null : /*#__PURE__*/_react.default.createElement(_react2.ModalCloseButton, null), /*#__PURE__*/_react.default.createElement(_react2.ModalBody, null, children), footer ? /*#__PURE__*/_react.default.createElement(_react2.ModalFooter, footerStyling, footer) : null));
|
|
50
44
|
});
|
|
51
45
|
var _default = Modal;
|
|
52
46
|
exports.default = _default;
|