@spothero/ui 22.3.0 → 22.3.5
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.stories.js +39 -29
- package/dist/components/Accordion/AccordionActionButton.js +15 -12
- package/dist/components/Accordion/index.js +15 -14
- package/dist/components/Accordion/styles/index.js +10 -9
- package/dist/components/Alert/Alert.js +45 -37
- package/dist/components/Alert/Alert.stories.js +36 -21
- package/dist/components/Alert/index.js +5 -4
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +121 -100
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +11 -7
- package/dist/components/AutoSuggestSelect/index.js +5 -4
- package/dist/components/Badge/Badge.js +4 -3
- package/dist/components/Badge/Badge.stories.js +20 -16
- package/dist/components/Badge/styles/index.js +10 -9
- package/dist/components/Button/Button.js +55 -20
- package/dist/components/Button/Button.spec.js +6 -6
- package/dist/components/Button/Button.styles.js +39 -37
- package/dist/components/Button/button-props.js +20 -18
- package/dist/components/Button/index.js +7 -6
- package/dist/components/Button/stories/button.js +15 -13
- package/dist/components/Button/stories/index.stories.js +37 -28
- package/dist/components/Button/stories/overview.js +49 -35
- package/dist/components/Card/Card.js +20 -14
- package/dist/components/Card/Card.stories.js +13 -9
- package/dist/components/Checkbox/Checkbox.js +24 -18
- package/dist/components/Checkbox/Checkbox.stories.js +10 -6
- package/dist/components/Checkbox/index.js +5 -4
- package/dist/components/Checkbox/styles/index.js +9 -8
- package/dist/components/Container/Container.js +14 -8
- package/dist/components/Container/Container.stories.js +29 -19
- package/dist/components/Container/Container.styles.js +5 -4
- package/dist/components/CreatableSelect/CreatableSelect.js +98 -74
- package/dist/components/CreatableSelect/CreatableSelect.stories.js +43 -29
- package/dist/components/CreatableSelect/index.js +5 -4
- package/dist/components/Divider/Divider.js +16 -11
- package/dist/components/Divider/Divider.stories.js +12 -7
- package/dist/components/Divider/Divider.styles.js +6 -5
- package/dist/components/Drawer/Drawer.js +17 -12
- package/dist/components/Drawer/Drawer.stories.js +24 -13
- package/dist/components/Drawer/index.js +19 -18
- package/dist/components/Drawer/styles/index.js +29 -25
- package/dist/components/FormControl/FormControl.js +63 -56
- package/dist/components/Grid/Grid.js +19 -12
- package/dist/components/Grid/Grid.stories.js +68 -51
- package/dist/components/Grid/Grid.styles.js +4 -3
- package/dist/components/Grid/GridItem.js +14 -8
- package/dist/components/Grid/GridItem.styles.js +5 -4
- package/dist/components/Grid/index.js +8 -7
- package/dist/components/Heading/Heading.js +19 -12
- package/dist/components/Heading/Heading.stories.js +13 -8
- package/dist/components/Heading/Heading.styles.js +33 -27
- package/dist/components/Icon/Icon.js +4 -3
- package/dist/components/Icon/Icon.stories.js +27 -23
- package/dist/components/Image/Image.js +54 -43
- package/dist/components/Image/Image.spec.js +17 -17
- package/dist/components/Image/Image.stories.js +18 -12
- package/dist/components/Input/Input.js +24 -19
- package/dist/components/Input/Input.stories.js +13 -9
- package/dist/components/Input/index.js +5 -4
- package/dist/components/Input/styles/index.js +8 -7
- package/dist/components/Link/Link.js +4 -3
- package/dist/components/Link/Link.stories.js +34 -31
- package/dist/components/Link/Link.styles.js +12 -11
- package/dist/components/List/List.js +26 -18
- package/dist/components/List/List.stories.js +42 -25
- package/dist/components/List/index.js +7 -6
- package/dist/components/List/styles/index.js +7 -6
- package/dist/components/List/styles/item.styles.js +5 -4
- package/dist/components/Loader/Loader.js +29 -20
- package/dist/components/Loader/Loader.stories.js +36 -28
- package/dist/components/Menu/Menu.js +6 -5
- package/dist/components/Menu/Menu.stories.js +68 -58
- package/dist/components/Menu/Menu.styles.js +8 -7
- package/dist/components/Menu/index.js +19 -18
- package/dist/components/Modal/Modal.js +20 -16
- package/dist/components/Modal/Modal.stories.js +112 -71
- package/dist/components/Modal/index.js +11 -10
- package/dist/components/Modal/styles/body.js +23 -14
- package/dist/components/Modal/styles/closeButton.js +21 -20
- package/dist/components/Modal/styles/dialog.js +19 -18
- package/dist/components/Modal/styles/dialogContainer.js +9 -7
- package/dist/components/Modal/styles/footer.js +4 -3
- package/dist/components/Modal/styles/header.js +14 -13
- package/dist/components/Modal/styles/index.js +18 -15
- package/dist/components/Modal/styles/overlay.js +4 -3
- package/dist/components/Popover/Popover.js +24 -16
- package/dist/components/Popover/Popover.stories.js +54 -47
- package/dist/components/Popover/PopoverArrow.js +12 -8
- package/dist/components/Popover/PopoverCloseButton.js +12 -8
- package/dist/components/Popover/PopoverContent.js +23 -19
- package/dist/components/Popover/index.js +15 -14
- package/dist/components/Popover/styles/index.js +15 -12
- package/dist/components/Popover/styles/popover-arrow.js +10 -8
- package/dist/components/Popover/styles/popover-body.js +9 -6
- package/dist/components/Popover/styles/popover-close-button.js +36 -22
- package/dist/components/Popover/styles/popover-content.js +26 -22
- package/dist/components/Popover/styles/popover-header.js +5 -4
- package/dist/components/Popover/styles/popper.js +5 -4
- package/dist/components/Progress/Progress.js +16 -11
- package/dist/components/Progress/Progress.stories.js +29 -18
- package/dist/components/Progress/Progress.styles.js +44 -59
- package/dist/components/Radio/Radio.js +24 -18
- package/dist/components/Radio/Radio.stories.js +14 -15
- package/dist/components/Radio/RadioGroup.js +27 -22
- package/dist/components/Radio/index.js +8 -7
- package/dist/components/Radio/styles/index.js +13 -12
- package/dist/components/RefreshedInput/Button/Button.js +31 -27
- package/dist/components/RefreshedInput/Button/Button.stories.js +22 -16
- package/dist/components/RefreshedInput/Button/index.js +5 -4
- package/dist/components/RefreshedInput/Button/styles/index.js +22 -12
- package/dist/components/RefreshedInput/FormControl/index.js +60 -51
- package/dist/components/RefreshedInput/Input/Input.js +28 -22
- package/dist/components/RefreshedInput/Input/Input.stories.js +19 -14
- package/dist/components/RefreshedInput/Input/index.js +5 -4
- package/dist/components/RefreshedInput/Input/styles/index.js +18 -8
- package/dist/components/RefreshedInput/Select/Select.js +30 -25
- package/dist/components/RefreshedInput/Select/Select.stories.js +26 -21
- package/dist/components/RefreshedInput/Select/index.js +5 -4
- package/dist/components/RefreshedInput/Select/styles/index.js +19 -11
- package/dist/components/RefreshedInput/index.js +14 -13
- package/dist/components/RefreshedInput/storyAid/index.js +13 -10
- package/dist/components/Select/Select.js +25 -20
- package/dist/components/Select/Select.stories.js +21 -17
- package/dist/components/Select/index.js +5 -4
- package/dist/components/Select/styles/index.js +12 -7
- package/dist/components/SelectionCard/SelectionCard.js +31 -25
- package/dist/components/SelectionCard/SelectionCard.stories.js +10 -9
- package/dist/components/SelectionCard/index.js +5 -4
- package/dist/components/Skeleton/Skeleton.stories.js +17 -9
- package/dist/components/Skeleton/Skeleton.styles.js +4 -3
- package/dist/components/Skeleton/index.js +8 -7
- package/dist/components/Spinner/Spinner.js +17 -12
- package/dist/components/Spinner/Spinner.stories.js +56 -45
- package/dist/components/Spinner/Spinner.styles.js +41 -59
- package/dist/components/Switch/Switch.js +22 -17
- package/dist/components/Switch/Switch.stories.js +10 -6
- package/dist/components/Switch/index.js +5 -4
- package/dist/components/Switch/styles/index.js +29 -19
- package/dist/components/Table/Table.js +4 -3
- package/dist/components/Table/Table.stories.js +31 -20
- package/dist/components/Table/Table.styles.js +27 -16
- package/dist/components/Table/index.js +21 -20
- package/dist/components/Tabs/Tabs.js +18 -18
- package/dist/components/Tabs/Tabs.stories.js +14 -9
- package/dist/components/Tabs/combineSizeWithVariant.js +12 -13
- package/dist/components/Tabs/index.js +13 -12
- package/dist/components/Tabs/styles/index.js +6 -5
- package/dist/components/Text/Text.js +14 -12
- package/dist/components/Text/Text.stories.js +13 -8
- package/dist/components/Text/Text.styles.js +26 -18
- package/dist/components/Text/combineAsWithVariant.js +40 -37
- package/dist/components/Text/options.js +5 -4
- package/dist/components/Textarea/Textarea.js +24 -19
- package/dist/components/Textarea/Textarea.stories.js +14 -11
- package/dist/components/Textarea/index.js +5 -4
- package/dist/components/Textarea/styles/index.js +8 -7
- package/dist/components/ThemeProvider/ThemeProvider.js +29 -21
- package/dist/components/ThemeProvider/ThemeProvider.stories.js +20 -19
- package/dist/components/Toast/Toast.stories.js +24 -17
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.js +40 -34
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.stories.js +24 -15
- package/dist/components/ToggleButtonGroup/index.js +5 -4
- package/dist/components/ToggleButtonGroup/styles/index.js +6 -5
- package/dist/components/index.js +252 -238
- package/dist/components/styles.js +80 -79
- package/dist/theme/base/breakpoints.js +5 -4
- package/dist/theme/base/colors.js +50 -44
- package/dist/theme/base/index.js +29 -28
- package/dist/theme/base/notifications.js +8 -9
- package/dist/theme/base/shadows.js +5 -4
- package/dist/theme/base/sizes.js +7 -6
- package/dist/theme/base/typography.js +7 -6
- package/dist/theme/base/zindices.js +5 -4
- package/dist/theme/global.js +18 -89
- package/dist/theme/index.js +27 -15
- package/dist/utils/Spaces.js +15 -10
- package/package.json +24 -18
|
@@ -1,23 +1,33 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
|
|
4
|
+
var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
|
|
5
|
+
var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
|
|
6
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
7
|
+
var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
|
|
8
|
+
var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
|
|
9
|
+
var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
|
|
10
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
3
11
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
12
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
13
|
value: true
|
|
6
14
|
});
|
|
7
|
-
exports
|
|
15
|
+
exports["default"] = exports.CreatableSelect = void 0;
|
|
16
|
+
var _bind = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/bind"));
|
|
8
17
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
18
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
9
19
|
var _react = _interopRequireDefault(require("react"));
|
|
10
20
|
var _createControl = require("storybook/utils/create-control");
|
|
11
21
|
var _CreatableSelect = require("./CreatableSelect");
|
|
12
|
-
var
|
|
22
|
+
function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
23
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
24
|
+
var _default = exports["default"] = {
|
|
13
25
|
title: 'v2/CreatableSelect',
|
|
14
26
|
component: _CreatableSelect.CreatableSelectNode,
|
|
15
27
|
parameters: {
|
|
16
28
|
removeBaseHtmlClass: true
|
|
17
29
|
},
|
|
18
|
-
argTypes: {
|
|
19
|
-
...(0, _createControl.createSelectControl)('createOptionPosition', ['first', 'last'])
|
|
20
|
-
},
|
|
30
|
+
argTypes: _objectSpread({}, (0, _createControl.createSelectControl)('createOptionPosition', ['first', 'last'])),
|
|
21
31
|
args: {
|
|
22
32
|
label: 'Say Something',
|
|
23
33
|
isClearable: true,
|
|
@@ -30,26 +40,30 @@ var _default = exports.default = {
|
|
|
30
40
|
errorMessage: 'Oh no'
|
|
31
41
|
}
|
|
32
42
|
};
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
43
|
+
var CreatableSelectTemplate = function CreatableSelectTemplate(props) {
|
|
44
|
+
return /*#__PURE__*/_react["default"].createElement(_CreatableSelect.CreatableSelectNode, (0, _extends2["default"])({
|
|
45
|
+
id: "say-something-select",
|
|
46
|
+
allowCreateWhileLoading: true,
|
|
47
|
+
createOptionPosition: "first",
|
|
48
|
+
options: [{
|
|
49
|
+
value: "",
|
|
50
|
+
label: "Say Nothing"
|
|
51
|
+
}, {
|
|
52
|
+
value: "hello",
|
|
53
|
+
label: "Hello"
|
|
54
|
+
}, {
|
|
55
|
+
value: "goodbye",
|
|
56
|
+
label: "Goodbye"
|
|
57
|
+
}, {
|
|
58
|
+
value: "cool",
|
|
59
|
+
label: "Cool"
|
|
60
|
+
}, {
|
|
61
|
+
value: "raisins",
|
|
62
|
+
label: "What is your opinion on raisins?"
|
|
63
|
+
}],
|
|
64
|
+
formatCreateLabel: function formatCreateLabel(other) {
|
|
65
|
+
return "Say \"".concat(other, "\"");
|
|
66
|
+
}
|
|
67
|
+
}, props));
|
|
68
|
+
};
|
|
69
|
+
var CreatableSelect = exports.CreatableSelect = (0, _bind["default"])(CreatableSelectTemplate).call(CreatableSelectTemplate, {});
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
|
-
|
|
8
|
+
_Object$defineProperty(exports, "CreatableSelect", {
|
|
8
9
|
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
-
return _CreatableSelect
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _CreatableSelect["default"];
|
|
11
12
|
}
|
|
12
13
|
});
|
|
13
14
|
var _CreatableSelect = _interopRequireDefault(require("./CreatableSelect"));
|
|
@@ -1,22 +1,27 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
|
|
4
|
+
var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
|
|
5
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
6
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
3
7
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
8
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
9
|
value: true
|
|
6
10
|
});
|
|
7
|
-
exports
|
|
11
|
+
exports["default"] = void 0;
|
|
8
12
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
13
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
9
14
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
15
|
var _react2 = require("@chakra-ui/react");
|
|
11
16
|
var _Divider = require("./Divider.styles");
|
|
12
|
-
|
|
13
|
-
function
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
return /*#__PURE__*/_react
|
|
17
|
+
var _excluded = ["variant", "colorScheme"];
|
|
18
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof _WeakMap) return null; var r = new _WeakMap(), t = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
19
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? _Object$getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? _Object$defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
20
|
+
var Divider = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
21
|
+
var variant = _ref.variant,
|
|
22
|
+
borderColor = _ref.colorScheme,
|
|
23
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
24
|
+
return /*#__PURE__*/_react["default"].createElement(_react2.Divider, (0, _extends2["default"])({}, _Divider.colorScheme[borderColor], {
|
|
20
25
|
variant: variant
|
|
21
26
|
}, props, {
|
|
22
27
|
ref: ref
|
|
@@ -26,4 +31,4 @@ Divider.defaultProps = {
|
|
|
26
31
|
variant: 'solid',
|
|
27
32
|
colorScheme: 'medium'
|
|
28
33
|
};
|
|
29
|
-
var _default = exports
|
|
34
|
+
var _default = exports["default"] = Divider;
|
|
@@ -1,22 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
|
-
exports
|
|
8
|
+
exports["default"] = exports.Divider = void 0;
|
|
9
|
+
var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
|
|
10
|
+
var _bind = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/bind"));
|
|
8
11
|
var _react = _interopRequireDefault(require("react"));
|
|
9
12
|
var _Divider = require("./Divider.styles");
|
|
10
13
|
var _Divider2 = _interopRequireDefault(require("./Divider"));
|
|
11
14
|
var _react2 = require("@chakra-ui/react");
|
|
12
|
-
var _default = exports
|
|
15
|
+
var _default = exports["default"] = {
|
|
13
16
|
title: 'v2/Divider',
|
|
14
|
-
component: _Divider2
|
|
17
|
+
component: _Divider2["default"],
|
|
15
18
|
argTypes: {
|
|
16
19
|
colorScheme: {
|
|
17
20
|
control: {
|
|
18
21
|
type: 'select',
|
|
19
|
-
options:
|
|
22
|
+
options: (0, _keys["default"])(_Divider.colorScheme)
|
|
20
23
|
}
|
|
21
24
|
},
|
|
22
25
|
variant: {
|
|
@@ -27,8 +30,10 @@ var _default = exports.default = {
|
|
|
27
30
|
}
|
|
28
31
|
}
|
|
29
32
|
};
|
|
30
|
-
|
|
31
|
-
|
|
33
|
+
var Template = function Template(props) {
|
|
34
|
+
return /*#__PURE__*/_react["default"].createElement(_react2.Box, null, /*#__PURE__*/_react["default"].createElement(_react2.Text, null, "Over HowdyHowdyHowdy"), /*#__PURE__*/_react["default"].createElement(_Divider2["default"], props), /*#__PURE__*/_react["default"].createElement(_react2.Text, null, "Under HowdyHowdyHowdy"));
|
|
35
|
+
};
|
|
36
|
+
var Divider = exports.Divider = (0, _bind["default"])(Template).call(Template, {});
|
|
32
37
|
Divider.args = {
|
|
33
38
|
variant: 'solid',
|
|
34
39
|
colorScheme: 'medium'
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
|
-
exports
|
|
8
|
+
exports["default"] = exports.colorScheme = void 0;
|
|
8
9
|
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
9
10
|
var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
|
|
10
|
-
|
|
11
|
+
var colorScheme = exports.colorScheme = {
|
|
11
12
|
low: {
|
|
12
13
|
borderColor: 'gray.100'
|
|
13
14
|
},
|
|
@@ -15,6 +16,6 @@ const colorScheme = exports.colorScheme = {
|
|
|
15
16
|
borderColor: 'gray.200'
|
|
16
17
|
}
|
|
17
18
|
};
|
|
18
|
-
var _default = exports
|
|
19
|
-
colorScheme
|
|
19
|
+
var _default = exports["default"] = (0, _merge["default"])(_theme["default"].components.Divider, {
|
|
20
|
+
colorScheme: colorScheme
|
|
20
21
|
});
|
|
@@ -1,24 +1,29 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
|
|
4
|
+
var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
|
|
5
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
6
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
3
7
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
8
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
9
|
value: true
|
|
6
10
|
});
|
|
7
|
-
exports
|
|
11
|
+
exports["default"] = void 0;
|
|
8
12
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
13
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
9
14
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
15
|
var _react2 = require("@chakra-ui/react");
|
|
11
|
-
|
|
12
|
-
function
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
return /*#__PURE__*/_react
|
|
16
|
+
var _excluded = ["header", "children"];
|
|
17
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof _WeakMap) return null; var r = new _WeakMap(), t = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
18
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? _Object$getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? _Object$defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
19
|
+
var Drawer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
20
|
+
var header = _ref.header,
|
|
21
|
+
children = _ref.children,
|
|
22
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
23
|
+
return /*#__PURE__*/_react["default"].createElement(_react2.Drawer, (0, _extends2["default"])({
|
|
19
24
|
placement: "right"
|
|
20
25
|
}, props, {
|
|
21
26
|
ref: ref
|
|
22
|
-
}), /*#__PURE__*/_react
|
|
27
|
+
}), /*#__PURE__*/_react["default"].createElement(_react2.DrawerOverlay, null), /*#__PURE__*/_react["default"].createElement(_react2.DrawerContent, null, /*#__PURE__*/_react["default"].createElement(_react2.DrawerHeader, null, header, /*#__PURE__*/_react["default"].createElement(_react2.DrawerCloseButton, null)), children));
|
|
23
28
|
});
|
|
24
|
-
var _default = exports
|
|
29
|
+
var _default = exports["default"] = Drawer;
|
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
|
|
4
|
+
var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
|
|
5
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
6
|
+
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
3
7
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
8
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
9
|
value: true
|
|
6
10
|
});
|
|
7
|
-
exports
|
|
11
|
+
exports["default"] = exports.Drawer = void 0;
|
|
12
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
|
|
8
13
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
14
|
var _Text = _interopRequireDefault(require("../Text/Text"));
|
|
10
15
|
var _Button = require("../Button");
|
|
11
16
|
var _index = require("./index");
|
|
12
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof
|
|
13
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" !=
|
|
14
|
-
var _default = exports
|
|
17
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof _WeakMap) return null; var r = new _WeakMap(), t = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
18
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? _Object$getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? _Object$defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
19
|
+
var _default = exports["default"] = {
|
|
15
20
|
title: 'v2/Drawer',
|
|
16
21
|
component: _index.Drawer,
|
|
17
22
|
subcomponents: {
|
|
@@ -25,15 +30,21 @@ var _default = exports.default = {
|
|
|
25
30
|
chakraLink: 'https://chakra-ui.com/docs/components/drawer'
|
|
26
31
|
}
|
|
27
32
|
};
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
33
|
+
var Drawer = exports.Drawer = function Drawer(props) {
|
|
34
|
+
var _useState = (0, _react.useState)(true),
|
|
35
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
36
|
+
isOpen = _useState2[0],
|
|
37
|
+
setIsOpen = _useState2[1];
|
|
38
|
+
var toggleDrawer = function toggleDrawer() {
|
|
39
|
+
return setIsOpen(function (prevState) {
|
|
40
|
+
return !prevState;
|
|
41
|
+
});
|
|
42
|
+
};
|
|
43
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Button.Button, {
|
|
32
44
|
onClick: toggleDrawer
|
|
33
|
-
}, "Open"), /*#__PURE__*/_react
|
|
45
|
+
}, "Open"), /*#__PURE__*/_react["default"].createElement(_index.Drawer, {
|
|
34
46
|
isOpen: isOpen,
|
|
35
47
|
onClose: toggleDrawer,
|
|
36
48
|
header: " Sample Drawer Header"
|
|
37
|
-
}, /*#__PURE__*/_react
|
|
38
|
-
};
|
|
39
|
-
exports.Drawer = Drawer;
|
|
49
|
+
}, /*#__PURE__*/_react["default"].createElement(_index.DrawerBody, null, /*#__PURE__*/_react["default"].createElement(_Text["default"], null, "Sample Drawer Body")), /*#__PURE__*/_react["default"].createElement(_index.DrawerFooter, null, /*#__PURE__*/_react["default"].createElement(_Text["default"], null, "Sample Drawer Footer"))));
|
|
50
|
+
};
|
|
@@ -1,54 +1,55 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
|
-
|
|
8
|
+
_Object$defineProperty(exports, "Drawer", {
|
|
8
9
|
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
-
return _Drawer
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _Drawer["default"];
|
|
11
12
|
}
|
|
12
13
|
});
|
|
13
|
-
|
|
14
|
+
_Object$defineProperty(exports, "DrawerBody", {
|
|
14
15
|
enumerable: true,
|
|
15
|
-
get: function () {
|
|
16
|
+
get: function get() {
|
|
16
17
|
return _react.DrawerBody;
|
|
17
18
|
}
|
|
18
19
|
});
|
|
19
|
-
|
|
20
|
+
_Object$defineProperty(exports, "DrawerCloseButton", {
|
|
20
21
|
enumerable: true,
|
|
21
|
-
get: function () {
|
|
22
|
+
get: function get() {
|
|
22
23
|
return _react.DrawerCloseButton;
|
|
23
24
|
}
|
|
24
25
|
});
|
|
25
|
-
|
|
26
|
+
_Object$defineProperty(exports, "DrawerContainer", {
|
|
26
27
|
enumerable: true,
|
|
27
|
-
get: function () {
|
|
28
|
+
get: function get() {
|
|
28
29
|
return _react.Drawer;
|
|
29
30
|
}
|
|
30
31
|
});
|
|
31
|
-
|
|
32
|
+
_Object$defineProperty(exports, "DrawerContent", {
|
|
32
33
|
enumerable: true,
|
|
33
|
-
get: function () {
|
|
34
|
+
get: function get() {
|
|
34
35
|
return _react.DrawerContent;
|
|
35
36
|
}
|
|
36
37
|
});
|
|
37
|
-
|
|
38
|
+
_Object$defineProperty(exports, "DrawerFooter", {
|
|
38
39
|
enumerable: true,
|
|
39
|
-
get: function () {
|
|
40
|
+
get: function get() {
|
|
40
41
|
return _react.DrawerFooter;
|
|
41
42
|
}
|
|
42
43
|
});
|
|
43
|
-
|
|
44
|
+
_Object$defineProperty(exports, "DrawerHeader", {
|
|
44
45
|
enumerable: true,
|
|
45
|
-
get: function () {
|
|
46
|
+
get: function get() {
|
|
46
47
|
return _react.DrawerHeader;
|
|
47
48
|
}
|
|
48
49
|
});
|
|
49
|
-
|
|
50
|
+
_Object$defineProperty(exports, "DrawerOverlay", {
|
|
50
51
|
enumerable: true,
|
|
51
|
-
get: function () {
|
|
52
|
+
get: function get() {
|
|
52
53
|
return _react.DrawerOverlay;
|
|
53
54
|
}
|
|
54
55
|
});
|
|
@@ -1,23 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
+
_Object$defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
|
-
exports
|
|
8
|
+
exports["default"] = void 0;
|
|
9
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
|
|
8
10
|
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
9
11
|
var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
var _excluded = ["hasFooter"];
|
|
13
|
+
var body = function body(_ref) {
|
|
14
|
+
var hasFooter = _ref.hasFooter,
|
|
15
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
14
16
|
return {
|
|
15
17
|
overflowY: 'auto',
|
|
16
18
|
padding: 6,
|
|
17
19
|
paddingBottom: hasFooter ? 24 : 6
|
|
18
20
|
};
|
|
19
21
|
};
|
|
20
|
-
|
|
22
|
+
var footer = function footer(props) {
|
|
21
23
|
return {
|
|
22
24
|
padding: 6,
|
|
23
25
|
backgroundColor: 'white',
|
|
@@ -26,7 +28,7 @@ const footer = props => {
|
|
|
26
28
|
width: '100%'
|
|
27
29
|
};
|
|
28
30
|
};
|
|
29
|
-
|
|
31
|
+
var header = function header(props) {
|
|
30
32
|
return {
|
|
31
33
|
paddingY: 3,
|
|
32
34
|
paddingX: 6,
|
|
@@ -39,7 +41,7 @@ const header = props => {
|
|
|
39
41
|
fontWeight: 'semibold'
|
|
40
42
|
};
|
|
41
43
|
};
|
|
42
|
-
|
|
44
|
+
var closeButton = function closeButton(props) {
|
|
43
45
|
return {
|
|
44
46
|
width: 8,
|
|
45
47
|
height: 8,
|
|
@@ -64,30 +66,32 @@ const closeButton = props => {
|
|
|
64
66
|
}
|
|
65
67
|
};
|
|
66
68
|
};
|
|
67
|
-
|
|
69
|
+
var dialogContainer = function dialogContainer(props) {
|
|
68
70
|
return {
|
|
69
71
|
zIndex: 'layer2',
|
|
70
72
|
backgroundColor: 'transparent'
|
|
71
73
|
};
|
|
72
74
|
};
|
|
73
|
-
|
|
75
|
+
var dialog = function dialog(props) {
|
|
74
76
|
return {
|
|
75
77
|
backgroundColor: 'white',
|
|
76
78
|
boxShadow: 'drawer'
|
|
77
79
|
};
|
|
78
80
|
};
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
81
|
+
var baseStyle = function baseStyle(props) {
|
|
82
|
+
return {
|
|
83
|
+
body: body(props),
|
|
84
|
+
footer: footer(props),
|
|
85
|
+
header: header(props),
|
|
86
|
+
dialog: dialog(props),
|
|
87
|
+
closeButton: closeButton(props),
|
|
88
|
+
dialogContainer: dialogContainer(props)
|
|
89
|
+
};
|
|
90
|
+
};
|
|
91
|
+
var defaultProps = {
|
|
88
92
|
size: 'xs'
|
|
89
93
|
};
|
|
90
|
-
|
|
94
|
+
var sizes = {
|
|
91
95
|
xs: {
|
|
92
96
|
dialog: {
|
|
93
97
|
maxWidth: {
|
|
@@ -97,8 +101,8 @@ const sizes = {
|
|
|
97
101
|
}
|
|
98
102
|
}
|
|
99
103
|
};
|
|
100
|
-
var _default = exports
|
|
101
|
-
defaultProps,
|
|
102
|
-
baseStyle,
|
|
103
|
-
sizes
|
|
104
|
+
var _default = exports["default"] = (0, _merge["default"])(_theme["default"].components.Drawer, {
|
|
105
|
+
defaultProps: defaultProps,
|
|
106
|
+
baseStyle: baseStyle,
|
|
107
|
+
sizes: sizes
|
|
104
108
|
});
|