@spothero/ui 21.3.0 → 21.4.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Accordion/Accordion.stories.js +2 -4
- package/dist/components/Accordion/AccordionActionButton.js +3 -4
- package/dist/components/Accordion/styles/index.js +2 -3
- package/dist/components/Alert/Alert.js +3 -4
- package/dist/components/Alert/Alert.stories.js +2 -4
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +3 -4
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +2 -4
- package/dist/components/Badge/Badge.stories.js +2 -4
- package/dist/components/Badge/styles/index.js +3 -5
- package/dist/components/Button/Button.js +3 -4
- package/dist/components/Button/Button.styles.js +3 -5
- package/dist/components/Button/button-props.js +1 -2
- package/dist/components/Button/stories/button.js +1 -2
- package/dist/components/Button/stories/index.stories.js +6 -12
- package/dist/components/Button/stories/overview.js +1 -2
- package/dist/components/Card/Card.js +3 -4
- package/dist/components/Card/Card.stories.js +2 -4
- package/dist/components/Checkbox/Checkbox.js +3 -4
- package/dist/components/Checkbox/Checkbox.stories.js +2 -4
- package/dist/components/Checkbox/styles/index.js +2 -3
- package/dist/components/Container/Container.js +3 -4
- package/dist/components/Container/Container.stories.js +2 -4
- package/dist/components/Container/Container.styles.js +1 -2
- package/dist/components/Divider/Divider.js +3 -4
- package/dist/components/Divider/Divider.stories.js +2 -4
- package/dist/components/Divider/Divider.styles.js +3 -5
- package/dist/components/Drawer/Drawer.js +3 -4
- package/dist/components/Drawer/Drawer.stories.js +3 -4
- package/dist/components/Drawer/styles/index.js +2 -3
- package/dist/components/FormControl/FormControl.js +3 -4
- package/dist/components/Grid/Grid.js +3 -4
- package/dist/components/Grid/Grid.stories.js +5 -10
- package/dist/components/Grid/Grid.styles.js +3 -5
- package/dist/components/Grid/GridItem.js +3 -4
- package/dist/components/Grid/GridItem.styles.js +1 -2
- package/dist/components/Heading/Heading.js +3 -4
- package/dist/components/Heading/Heading.stories.js +2 -4
- package/dist/components/Heading/Heading.styles.js +3 -5
- package/dist/components/Icon/Icon.stories.js +2 -4
- package/dist/components/Image/Image.js +1 -2
- package/dist/components/Image/Image.stories.js +7 -14
- package/dist/components/Input/Input.js +3 -4
- package/dist/components/Input/Input.stories.js +2 -4
- package/dist/components/Input/styles/index.js +2 -3
- package/dist/components/Link/Link.stories.js +2 -4
- package/dist/components/Link/Link.styles.js +3 -5
- package/dist/components/List/List.js +3 -4
- package/dist/components/List/List.stories.js +5 -10
- package/dist/components/List/styles/index.js +2 -3
- package/dist/components/List/styles/item.styles.js +1 -2
- package/dist/components/Loader/Loader.js +1 -2
- package/dist/components/Loader/Loader.stories.js +4 -8
- package/dist/components/Modal/Modal.js +3 -4
- package/dist/components/Modal/Modal.stories.js +3 -4
- package/dist/components/Modal/styles/dialogContainer.js +2 -3
- package/dist/components/Modal/styles/footer.js +2 -3
- package/dist/components/Modal/styles/index.js +2 -3
- package/dist/components/Modal/styles/overlay.js +2 -3
- package/dist/components/Popover/Popover.js +3 -4
- package/dist/components/Popover/Popover.stories.js +5 -10
- package/dist/components/Popover/PopoverArrow.js +3 -4
- package/dist/components/Popover/PopoverCloseButton.js +3 -4
- package/dist/components/Popover/PopoverContent.js +3 -4
- package/dist/components/Popover/styles/index.js +2 -3
- package/dist/components/Popover/styles/popover-arrow.js +1 -2
- package/dist/components/Popover/styles/popover-body.js +1 -2
- package/dist/components/Popover/styles/popover-close-button.js +1 -2
- package/dist/components/Popover/styles/popover-content.js +1 -2
- package/dist/components/Popover/styles/popover-header.js +1 -2
- package/dist/components/Popover/styles/popper.js +1 -2
- package/dist/components/Progress/Progress.js +3 -4
- package/dist/components/Progress/Progress.stories.js +2 -4
- package/dist/components/Progress/Progress.styles.js +2 -3
- package/dist/components/Radio/Radio.js +3 -4
- package/dist/components/Radio/Radio.stories.js +1 -2
- package/dist/components/Radio/RadioGroup.js +3 -4
- package/dist/components/Radio/styles/index.js +3 -5
- package/dist/components/Select/Select.js +3 -4
- package/dist/components/Select/Select.stories.js +2 -4
- package/dist/components/Select/styles/index.js +2 -3
- package/dist/components/SelectionCard/SelectionCard.js +3 -4
- package/dist/components/SelectionCard/SelectionCard.stories.js +1 -2
- package/dist/components/Skeleton/Skeleton.stories.js +4 -8
- package/dist/components/Skeleton/Skeleton.styles.js +1 -2
- package/dist/components/Spinner/Spinner.js +3 -4
- package/dist/components/Spinner/Spinner.stories.js +7 -14
- package/dist/components/Spinner/Spinner.styles.js +5 -9
- package/dist/components/Switch/Switch.js +3 -4
- package/dist/components/Switch/Switch.stories.js +2 -4
- package/dist/components/Switch/styles/index.js +2 -3
- package/dist/components/Table/Table.stories.js +2 -4
- package/dist/components/Table/Table.styles.js +3 -5
- package/dist/components/Tabs/Tabs.js +4 -8
- package/dist/components/Tabs/Tabs.stories.js +4 -6
- package/dist/components/Tabs/combineSizeWithVariant.js +1 -2
- package/dist/components/Tabs/styles/index.js +2 -3
- package/dist/components/Text/Text.js +1 -2
- package/dist/components/Text/Text.stories.js +2 -4
- package/dist/components/Text/Text.styles.js +3 -5
- package/dist/components/Text/combineAsWithVariant.js +1 -2
- package/dist/components/Text/options.js +1 -2
- package/dist/components/ThemeProvider/ThemeProvider.js +3 -4
- package/dist/components/ThemeProvider/ThemeProvider.stories.js +2 -4
- package/dist/components/Toast/Toast.stories.js +4 -6
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.js +3 -4
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.stories.js +4 -6
- package/dist/components/ToggleButtonGroup/styles/index.js +5 -9
- package/dist/components/index.js +2 -2
- package/dist/theme/base/breakpoints.js +1 -2
- package/dist/theme/base/colors.js +1 -2
- package/dist/theme/base/notifications.js +2 -4
- package/dist/theme/base/shadows.js +1 -2
- package/dist/theme/base/sizes.js +1 -3
- package/dist/theme/base/typography.js +4 -7
- package/dist/theme/base/zindices.js +1 -2
- package/dist/theme/global.js +1 -2
- package/dist/theme/index.js +3 -4
- package/dist/utils/Spaces.js +1 -2
- package/package.json +9 -9
|
@@ -11,7 +11,7 @@ var _Spinner = require("./Spinner.styles");
|
|
|
11
11
|
var _createControl = require("storybook/utils/create-control");
|
|
12
12
|
var _disableArgs = _interopRequireDefault(require("storybook/utils/disable-args"));
|
|
13
13
|
var _Spinner2 = _interopRequireDefault(require("./Spinner"));
|
|
14
|
-
var _default = {
|
|
14
|
+
var _default = exports.default = {
|
|
15
15
|
title: 'v2/Spinner',
|
|
16
16
|
component: _Spinner2.default,
|
|
17
17
|
parameters: {
|
|
@@ -19,7 +19,6 @@ var _default = {
|
|
|
19
19
|
importBy: 'Spinner'
|
|
20
20
|
}
|
|
21
21
|
};
|
|
22
|
-
exports.default = _default;
|
|
23
22
|
const allColors = Object.entries(_colors.default).reduce((acc, _ref) => {
|
|
24
23
|
let [colorName, color] = _ref;
|
|
25
24
|
if (typeof color === 'string') {
|
|
@@ -33,8 +32,7 @@ const allColors = Object.entries(_colors.default).reduce((acc, _ref) => {
|
|
|
33
32
|
}, []);
|
|
34
33
|
const colorControl = key => (0, _createControl.createSelectControl)(key, allColors);
|
|
35
34
|
const Template = props => /*#__PURE__*/_react.default.createElement(_Spinner2.default, props);
|
|
36
|
-
const Overview = Template.bind({});
|
|
37
|
-
exports.Overview = Overview;
|
|
35
|
+
const Overview = exports.Overview = Template.bind({});
|
|
38
36
|
Overview.argTypes = {
|
|
39
37
|
...colorControl('color'),
|
|
40
38
|
...colorControl('emptyColor'),
|
|
@@ -52,8 +50,7 @@ Overview.args = {
|
|
|
52
50
|
color: 'primary.default',
|
|
53
51
|
emptyColor: 'gray.medium'
|
|
54
52
|
};
|
|
55
|
-
const Speed = Template.bind({});
|
|
56
|
-
exports.Speed = Speed;
|
|
53
|
+
const Speed = exports.Speed = Template.bind({});
|
|
57
54
|
Speed.argTypes = (0, _disableArgs.default)(['size', 'color', 'emptyColor', 'thickness']);
|
|
58
55
|
Speed.args = {
|
|
59
56
|
speed: '1s',
|
|
@@ -62,8 +59,7 @@ Speed.args = {
|
|
|
62
59
|
emptyColor: 'gray.medium',
|
|
63
60
|
thickness: _Spinner.thicknesses[_Spinner.SIZE_MAP['2xl']]
|
|
64
61
|
};
|
|
65
|
-
const Size = Template.bind({});
|
|
66
|
-
exports.Size = Size;
|
|
62
|
+
const Size = exports.Size = Template.bind({});
|
|
67
63
|
Size.argTypes = {
|
|
68
64
|
...(0, _createControl.createSelectControl)('size', Object.keys(_Spinner.sizes)),
|
|
69
65
|
...(0, _disableArgs.default)(['speed', 'color', 'emptyColor', 'thickness'])
|
|
@@ -71,8 +67,7 @@ Size.argTypes = {
|
|
|
71
67
|
Size.args = {
|
|
72
68
|
size: _Spinner.SIZE_MAP['2xl']
|
|
73
69
|
};
|
|
74
|
-
const Thickness = Template.bind({});
|
|
75
|
-
exports.Thickness = Thickness;
|
|
70
|
+
const Thickness = exports.Thickness = Template.bind({});
|
|
76
71
|
Thickness.argTypes = {
|
|
77
72
|
...(0, _disableArgs.default)(['speed', 'size', 'emptyColor', 'color']),
|
|
78
73
|
...(0, _createControl.createRangeControl)({
|
|
@@ -84,8 +79,7 @@ Thickness.argTypes = {
|
|
|
84
79
|
Thickness.args = {
|
|
85
80
|
thickness: _Spinner.thicknesses[_Spinner.SIZE_MAP['5xl']]
|
|
86
81
|
};
|
|
87
|
-
const Color = Template.bind({});
|
|
88
|
-
exports.Color = Color;
|
|
82
|
+
const Color = exports.Color = Template.bind({});
|
|
89
83
|
Color.argTypes = {
|
|
90
84
|
...colorControl('color'),
|
|
91
85
|
...(0, _disableArgs.default)(['speed', 'size', 'emptyColor', 'thickness'])
|
|
@@ -94,8 +88,7 @@ Color.args = {
|
|
|
94
88
|
thickness: 6,
|
|
95
89
|
color: 'primary.default'
|
|
96
90
|
};
|
|
97
|
-
const EmptyColor = Template.bind({});
|
|
98
|
-
exports.EmptyColor = EmptyColor;
|
|
91
|
+
const EmptyColor = exports.EmptyColor = Template.bind({});
|
|
99
92
|
EmptyColor.argTypes = {
|
|
100
93
|
...colorControl('emptyColor'),
|
|
101
94
|
...(0, _disableArgs.default)(['speed', 'size', 'color', 'thickness'])
|
|
@@ -8,7 +8,7 @@ exports.thicknesses = exports.sizes = exports.default = exports.SIZE_MAP = void
|
|
|
8
8
|
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
9
9
|
var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
|
|
10
10
|
const spinnerStyles = _theme.default.components.Spinner;
|
|
11
|
-
const SIZE_MAP = {
|
|
11
|
+
const SIZE_MAP = exports.SIZE_MAP = {
|
|
12
12
|
xs: 'xs',
|
|
13
13
|
sm: 'sm',
|
|
14
14
|
md: 'md',
|
|
@@ -24,8 +24,7 @@ const SIZE_MAP = {
|
|
|
24
24
|
'9xl': '9xl',
|
|
25
25
|
'10xl': '10xl'
|
|
26
26
|
};
|
|
27
|
-
exports.
|
|
28
|
-
const sizes = (0, _merge.default)(spinnerStyles.sizes, {
|
|
27
|
+
const sizes = exports.sizes = (0, _merge.default)(spinnerStyles.sizes, {
|
|
29
28
|
[SIZE_MAP['2xl']]: {
|
|
30
29
|
w: '4rem',
|
|
31
30
|
h: '4rem'
|
|
@@ -63,8 +62,7 @@ const sizes = (0, _merge.default)(spinnerStyles.sizes, {
|
|
|
63
62
|
h: '12rem'
|
|
64
63
|
}
|
|
65
64
|
});
|
|
66
|
-
exports.
|
|
67
|
-
const thicknesses = {
|
|
65
|
+
const thicknesses = exports.thicknesses = {
|
|
68
66
|
[SIZE_MAP.xl]: 3,
|
|
69
67
|
[SIZE_MAP['2xl']]: 4,
|
|
70
68
|
[SIZE_MAP['3xl']]: 5,
|
|
@@ -76,14 +74,12 @@ const thicknesses = {
|
|
|
76
74
|
[SIZE_MAP['9xl']]: 11,
|
|
77
75
|
[SIZE_MAP['10xl']]: 12
|
|
78
76
|
};
|
|
79
|
-
exports.thicknesses = thicknesses;
|
|
80
77
|
const defaultProps = {
|
|
81
78
|
speed: '2s',
|
|
82
79
|
size: SIZE_MAP['2xl'],
|
|
83
80
|
thickness: thicknesses[SIZE_MAP['2xl']]
|
|
84
81
|
};
|
|
85
|
-
var _default = {
|
|
82
|
+
var _default = exports.default = {
|
|
86
83
|
sizes,
|
|
87
84
|
defaultProps
|
|
88
|
-
};
|
|
89
|
-
exports.default = _default;
|
|
85
|
+
};
|
|
@@ -10,8 +10,8 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
10
10
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
11
|
var _react2 = require("@chakra-ui/react");
|
|
12
12
|
var _FormControl = _interopRequireDefault(require("../FormControl/FormControl"));
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
13
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
14
|
+
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; }
|
|
15
15
|
const Switch = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
16
16
|
let {
|
|
17
17
|
label,
|
|
@@ -38,5 +38,4 @@ const Switch = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
|
38
38
|
className: classes
|
|
39
39
|
}, props)));
|
|
40
40
|
});
|
|
41
|
-
var _default = Switch;
|
|
42
|
-
exports.default = _default;
|
|
41
|
+
var _default = exports.default = Switch;
|
|
@@ -7,17 +7,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.default = exports.Switch = void 0;
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
var _Switch = _interopRequireDefault(require("./Switch"));
|
|
10
|
-
var _default = {
|
|
10
|
+
var _default = exports.default = {
|
|
11
11
|
title: 'v2/Switch',
|
|
12
12
|
component: _Switch.default,
|
|
13
13
|
parameters: {
|
|
14
14
|
removeBaseHtmlClass: true
|
|
15
15
|
}
|
|
16
16
|
};
|
|
17
|
-
exports.default = _default;
|
|
18
17
|
const SwitchTemplate = props => /*#__PURE__*/_react.default.createElement(_Switch.default, props);
|
|
19
|
-
const Switch = SwitchTemplate.bind({});
|
|
20
|
-
exports.Switch = Switch;
|
|
18
|
+
const Switch = exports.Switch = SwitchTemplate.bind({});
|
|
21
19
|
Switch.argTypes = {
|
|
22
20
|
isChecked: {
|
|
23
21
|
control: {
|
|
@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
var _Table = _interopRequireDefault(require("./Table"));
|
|
10
10
|
var _Table2 = require("./Table.styles");
|
|
11
11
|
var _index = require("./index");
|
|
12
|
-
var _default = {
|
|
12
|
+
var _default = exports.default = {
|
|
13
13
|
title: 'v2/Table',
|
|
14
14
|
parameters: {
|
|
15
15
|
removeBaseHtmlClass: true
|
|
@@ -43,7 +43,6 @@ var _default = {
|
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
45
|
};
|
|
46
|
-
exports.default = _default;
|
|
47
46
|
const TableTemplate = _ref => {
|
|
48
47
|
let {
|
|
49
48
|
numberOfColumns,
|
|
@@ -62,8 +61,7 @@ const TableTemplate = _ref => {
|
|
|
62
61
|
key: index
|
|
63
62
|
}, data))))));
|
|
64
63
|
};
|
|
65
|
-
const Table = TableTemplate.bind({});
|
|
66
|
-
exports.Table = Table;
|
|
64
|
+
const Table = exports.Table = TableTemplate.bind({});
|
|
67
65
|
Table.args = {
|
|
68
66
|
numberOfColumns: 3,
|
|
69
67
|
numberOfRows: 3,
|
|
@@ -51,18 +51,16 @@ const roundedGrayVariant = {
|
|
|
51
51
|
backgroundColor: 'background.gray'
|
|
52
52
|
}
|
|
53
53
|
};
|
|
54
|
-
const variants = {
|
|
54
|
+
const variants = exports.variants = {
|
|
55
55
|
rounded: roundedWhiteVariant,
|
|
56
56
|
roundedGray: roundedGrayVariant
|
|
57
57
|
};
|
|
58
|
-
exports.variants = variants;
|
|
59
58
|
const defaultProps = {
|
|
60
59
|
variant: 'rounded'
|
|
61
60
|
};
|
|
62
|
-
var _default = {
|
|
61
|
+
var _default = exports.default = {
|
|
63
62
|
parts,
|
|
64
63
|
variants,
|
|
65
64
|
baseStyle,
|
|
66
65
|
defaultProps
|
|
67
|
-
};
|
|
68
|
-
exports.default = _default;
|
|
66
|
+
};
|
|
@@ -9,12 +9,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _react2 = require("@chakra-ui/react");
|
|
11
11
|
var _combineSizeWithVariant = _interopRequireDefault(require("./combineSizeWithVariant"));
|
|
12
|
-
const SIZE_SMALL = 'small';
|
|
13
|
-
exports.
|
|
14
|
-
const
|
|
15
|
-
exports.SIZE_BODY = SIZE_BODY;
|
|
16
|
-
const SIZE_HEADING = 'heading';
|
|
17
|
-
exports.SIZE_HEADING = SIZE_HEADING;
|
|
12
|
+
const SIZE_SMALL = exports.SIZE_SMALL = 'small';
|
|
13
|
+
const SIZE_BODY = exports.SIZE_BODY = 'body';
|
|
14
|
+
const SIZE_HEADING = exports.SIZE_HEADING = 'heading';
|
|
18
15
|
const sizeMapping = {
|
|
19
16
|
[SIZE_SMALL]: 'sm',
|
|
20
17
|
[SIZE_BODY]: 'md',
|
|
@@ -36,5 +33,4 @@ const Tabs = (0, _react2.forwardRef)((_ref, ref) => {
|
|
|
36
33
|
Tabs.defaultProps = {
|
|
37
34
|
size: SIZE_BODY
|
|
38
35
|
};
|
|
39
|
-
var _default = Tabs;
|
|
40
|
-
exports.default = _default;
|
|
36
|
+
var _default = exports.default = Tabs;
|
|
@@ -9,9 +9,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _Tabs = _interopRequireWildcard(require("./Tabs"));
|
|
11
11
|
var _index = require("./index");
|
|
12
|
-
function _getRequireWildcardCache(
|
|
13
|
-
function _interopRequireWildcard(
|
|
14
|
-
var _default = {
|
|
12
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
13
|
+
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; }
|
|
14
|
+
var _default = exports.default = {
|
|
15
15
|
title: 'v2/Tabs',
|
|
16
16
|
parameters: {
|
|
17
17
|
removeBaseHtmlClass: true
|
|
@@ -25,11 +25,9 @@ var _default = {
|
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
};
|
|
28
|
-
exports.default = _default;
|
|
29
28
|
const TabsTemplate = props => {
|
|
30
29
|
return /*#__PURE__*/_react.default.createElement(_Tabs.default, (0, _extends2.default)({
|
|
31
30
|
variant: "line"
|
|
32
31
|
}, props), /*#__PURE__*/_react.default.createElement(_index.TabList, null, /*#__PURE__*/_react.default.createElement(_index.Tab, null, "One"), /*#__PURE__*/_react.default.createElement(_index.Tab, null, "Two"), /*#__PURE__*/_react.default.createElement(_index.Tab, null, "Three")), /*#__PURE__*/_react.default.createElement(_index.TabPanels, null, /*#__PURE__*/_react.default.createElement(_index.TabPanel, null, /*#__PURE__*/_react.default.createElement("p", null, "one!")), /*#__PURE__*/_react.default.createElement(_index.TabPanel, null, /*#__PURE__*/_react.default.createElement("p", null, "two!")), /*#__PURE__*/_react.default.createElement(_index.TabPanel, null, /*#__PURE__*/_react.default.createElement("p", null, "three!"))));
|
|
33
32
|
};
|
|
34
|
-
const Tabs = TabsTemplate.bind({});
|
|
35
|
-
exports.Tabs = Tabs;
|
|
33
|
+
const Tabs = exports.Tabs = TabsTemplate.bind({});
|
|
@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
var _Text = _interopRequireDefault(require("./Text"));
|
|
10
10
|
var _options = _interopRequireDefault(require("./options"));
|
|
11
11
|
var _Text2 = require("./Text.styles");
|
|
12
|
-
var _default = {
|
|
12
|
+
var _default = exports.default = {
|
|
13
13
|
title: 'v2/Text',
|
|
14
14
|
component: _Text.default,
|
|
15
15
|
parameters: {
|
|
@@ -35,10 +35,8 @@ var _default = {
|
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
37
|
};
|
|
38
|
-
exports.default = _default;
|
|
39
38
|
const Template = props => /*#__PURE__*/_react.default.createElement(_Text.default, props);
|
|
40
|
-
const Text = Template.bind({});
|
|
41
|
-
exports.Text = Text;
|
|
39
|
+
const Text = exports.Text = Template.bind({});
|
|
42
40
|
Text.args = {
|
|
43
41
|
children: 'Bonbon lollipop tiramisu cupcake bear claw cupcake. Icing candy canes cookie caramels wafer tootsie roll soufflé halvah. Ice cream tart gummies apple pie chocolate bar. Pastry gummies macaroon fruitcake donut sweet caramels candy. Oat cake marshmallow biscuit carrot cake fruitcake brownie pastry liquorice liquorice. Topping sweet gingerbread. Chupa chups caramels brownie. Icing jujubes chupa chups cookie. Carrot cake gummi bears powder apple pie donut pudding macaroon. Icing jelly cupcake powder jelly croissant pastry. Powder jelly fruitcake gummies sweet tootsie roll candy. Icing cheesecake toffee tart pastry lemon drops lemon drops bonbon wafer. Cheesecake ice cream wafer apple pie candy canes croissant. Sweet croissant pudding carrot cake oat cake chupa chups. Gingerbread lemon drops biscuit oat cake carrot cake. Chocolate cake jelly-o cake cake candy lollipop.'
|
|
44
42
|
};
|
|
@@ -12,7 +12,7 @@ const baseStyle = {
|
|
|
12
12
|
lineHeight: 1.5,
|
|
13
13
|
fontWeight: _typography.fontWeights.normal
|
|
14
14
|
};
|
|
15
|
-
const variants = {
|
|
15
|
+
const variants = exports.variants = {
|
|
16
16
|
body: {
|
|
17
17
|
...baseStyle,
|
|
18
18
|
fontSize: {
|
|
@@ -35,13 +35,11 @@ const variants = {
|
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
37
|
};
|
|
38
|
-
exports.variants = variants;
|
|
39
38
|
const defaultProps = {
|
|
40
39
|
variant: variants.body
|
|
41
40
|
};
|
|
42
|
-
var _default = (0, _merge.default)(_theme.default.components.Text, {
|
|
41
|
+
var _default = exports.default = (0, _merge.default)(_theme.default.components.Text, {
|
|
43
42
|
variants,
|
|
44
43
|
baseStyle,
|
|
45
44
|
defaultProps
|
|
46
|
-
});
|
|
47
|
-
exports.default = _default;
|
|
45
|
+
});
|
|
@@ -5,5 +5,4 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
const options = ['a', 'abbr', 'address', 'article', 'aside', 'b', 'bdi', 'bdo', 'blockquote', 'button', 'caption', 'cite', 'code', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'fieldset', 'figure', 'footer', 'form', 'header', 'hgroup', 'i', 'input', 'ins', 'kbd', 'label', 'legend', 'li', 'link', 'main', 'map', 'mark', 'menu', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'pre', 'progress', 'q', 'rb', 'rp', 'rt', 'rtc', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'template', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video'];
|
|
8
|
-
var _default = options;
|
|
9
|
-
exports.default = _default;
|
|
8
|
+
var _default = exports.default = options;
|
|
@@ -12,8 +12,8 @@ var _react2 = require("@chakra-ui/react");
|
|
|
12
12
|
var _theme = _interopRequireDefault(require("../../theme"));
|
|
13
13
|
var _global = require("../../theme/global");
|
|
14
14
|
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
15
|
-
function _getRequireWildcardCache(
|
|
16
|
-
function _interopRequireWildcard(
|
|
15
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
16
|
+
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; }
|
|
17
17
|
const ThemeProvider = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
18
18
|
let {
|
|
19
19
|
theme,
|
|
@@ -39,5 +39,4 @@ ThemeProvider.propTypes = {
|
|
|
39
39
|
/** Adds additional themeing on top of SpotHero's default configuration */
|
|
40
40
|
theme: _propTypes.default.object
|
|
41
41
|
};
|
|
42
|
-
var _default = ThemeProvider;
|
|
43
|
-
exports.default = _default;
|
|
42
|
+
var _default = exports.default = ThemeProvider;
|
|
@@ -16,7 +16,7 @@ const Usage = () => {
|
|
|
16
16
|
spaces: 6
|
|
17
17
|
}), "<App/>", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Spaces.default, null), "</ThemeProvider>", /*#__PURE__*/_react.default.createElement("br", null), ");", /*#__PURE__*/_react.default.createElement("br", null), "...");
|
|
18
18
|
};
|
|
19
|
-
var _default = {
|
|
19
|
+
var _default = exports.default = {
|
|
20
20
|
title: 'v2/ThemeProvider',
|
|
21
21
|
component: _ThemeProvider.default,
|
|
22
22
|
parameters: {
|
|
@@ -26,7 +26,6 @@ var _default = {
|
|
|
26
26
|
})]
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
|
-
exports.default = _default;
|
|
30
29
|
const Template = (props, _ref) => {
|
|
31
30
|
let {
|
|
32
31
|
hasDarkBackground
|
|
@@ -46,8 +45,7 @@ const Template = (props, _ref) => {
|
|
|
46
45
|
color: contentTextColor
|
|
47
46
|
}, "ThemeProvider also has a ", /*#__PURE__*/_react.default.createElement(_react2.Code, null, "disableExternalFonts"), " prop that is a boolean. If true, the ThemeProvider will not load the font files from Google's CDN, and you will be able to handle fonts on a project-level."), ' ');
|
|
48
47
|
};
|
|
49
|
-
const ThemeProvider = Template.bind({});
|
|
50
|
-
exports.ThemeProvider = ThemeProvider;
|
|
48
|
+
const ThemeProvider = exports.ThemeProvider = Template.bind({});
|
|
51
49
|
ThemeProvider.parameters = {
|
|
52
50
|
importBy: 'ThemeProvider'
|
|
53
51
|
};
|
|
@@ -10,9 +10,9 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
10
10
|
var _Alert = _interopRequireDefault(require("../Alert/Alert"));
|
|
11
11
|
var _Button = _interopRequireDefault(require("../Button/Button"));
|
|
12
12
|
var _react2 = require("@chakra-ui/react");
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
15
|
-
var _default = {
|
|
13
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
14
|
+
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; }
|
|
15
|
+
var _default = exports.default = {
|
|
16
16
|
title: 'v2/Toast',
|
|
17
17
|
component: _Alert.default,
|
|
18
18
|
parameters: {
|
|
@@ -21,7 +21,6 @@ var _default = {
|
|
|
21
21
|
chakraLink: 'https://chakra-ui.com/docs/components/toast'
|
|
22
22
|
}
|
|
23
23
|
};
|
|
24
|
-
exports.default = _default;
|
|
25
24
|
const Template = props => {
|
|
26
25
|
const toast = (0, _react2.useToast)();
|
|
27
26
|
const addToast = () => {
|
|
@@ -46,8 +45,7 @@ const Template = props => {
|
|
|
46
45
|
onClick: addToast
|
|
47
46
|
}, "Show Toast"));
|
|
48
47
|
};
|
|
49
|
-
const Toast = Template.bind({});
|
|
50
|
-
exports.Toast = Toast;
|
|
48
|
+
const Toast = exports.Toast = Template.bind({});
|
|
51
49
|
Toast.argTypes = {
|
|
52
50
|
buttonProps: {
|
|
53
51
|
table: {
|
|
@@ -9,8 +9,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
|
|
|
9
9
|
var _react = require("@chakra-ui/react");
|
|
10
10
|
var _react2 = _interopRequireWildcard(require("react"));
|
|
11
11
|
var _styles = require("./styles");
|
|
12
|
-
function _getRequireWildcardCache(
|
|
13
|
-
function _interopRequireWildcard(
|
|
12
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
13
|
+
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; }
|
|
14
14
|
/**
|
|
15
15
|
* @example (
|
|
16
16
|
* <ToggleButtonGroup onChange={handleChangeValue} value={value}>
|
|
@@ -56,5 +56,4 @@ const ToggleButtonGroup = /*#__PURE__*/(0, _react2.forwardRef)((props, ref) => {
|
|
|
56
56
|
});
|
|
57
57
|
}));
|
|
58
58
|
});
|
|
59
|
-
var _default = ToggleButtonGroup;
|
|
60
|
-
exports.default = _default;
|
|
59
|
+
var _default = exports.default = ToggleButtonGroup;
|
|
@@ -10,9 +10,9 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
10
10
|
var _react2 = require("@chakra-ui/react");
|
|
11
11
|
var _Button = require("../Button");
|
|
12
12
|
var _ToggleButtonGroup = _interopRequireDefault(require("./ToggleButtonGroup"));
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
15
|
-
var _default = {
|
|
13
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
14
|
+
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; }
|
|
15
|
+
var _default = exports.default = {
|
|
16
16
|
title: 'v2/ToggleButtonGroup',
|
|
17
17
|
displayName: 'ToggleButtonGroup',
|
|
18
18
|
component: _ToggleButtonGroup.default,
|
|
@@ -24,7 +24,6 @@ var _default = {
|
|
|
24
24
|
Storybook's background is white so the ToggleButtonGroup is hard to see.
|
|
25
25
|
The ToggleButtonGroup is typically displayed against a light green background.
|
|
26
26
|
*/
|
|
27
|
-
exports.default = _default;
|
|
28
27
|
const Template = props => {
|
|
29
28
|
const [toggleValue, setToggleValue] = (0, _react.useState)("multiple");
|
|
30
29
|
const onChange = value => {
|
|
@@ -50,6 +49,5 @@ const Template = props => {
|
|
|
50
49
|
fontSize: "xs"
|
|
51
50
|
}, "Blah Bookings")));
|
|
52
51
|
};
|
|
53
|
-
const ToggleButtonGroup = Template.bind({});
|
|
54
|
-
exports.ToggleButtonGroup = ToggleButtonGroup;
|
|
52
|
+
const ToggleButtonGroup = exports.ToggleButtonGroup = Template.bind({});
|
|
55
53
|
ToggleButtonGroup.args = {};
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.inactiveStyles = exports.defaultStyles = exports.buttonGroupStyles = exports.activeStyles = void 0;
|
|
7
|
-
const defaultStyles = {
|
|
7
|
+
const defaultStyles = exports.defaultStyles = {
|
|
8
8
|
border: 0,
|
|
9
9
|
borderRadius: '4px',
|
|
10
10
|
fontWeight: 'normal',
|
|
@@ -17,8 +17,7 @@ const defaultStyles = {
|
|
|
17
17
|
boxShadow: '0 0 0 2px rgba(158, 202, 237, 1)'
|
|
18
18
|
}
|
|
19
19
|
};
|
|
20
|
-
exports.
|
|
21
|
-
const inactiveStyles = {
|
|
20
|
+
const inactiveStyles = exports.inactiveStyles = {
|
|
22
21
|
color: 'black',
|
|
23
22
|
borderColor: 'gray.100',
|
|
24
23
|
bg: 'gray.100',
|
|
@@ -29,8 +28,7 @@ const inactiveStyles = {
|
|
|
29
28
|
bg: 'gray.100'
|
|
30
29
|
}
|
|
31
30
|
};
|
|
32
|
-
exports.
|
|
33
|
-
const activeStyles = {
|
|
31
|
+
const activeStyles = exports.activeStyles = {
|
|
34
32
|
color: 'black',
|
|
35
33
|
fontWeight: 'semibold',
|
|
36
34
|
boxShadow: 'sm',
|
|
@@ -42,10 +40,8 @@ const activeStyles = {
|
|
|
42
40
|
bg: 'white'
|
|
43
41
|
}
|
|
44
42
|
};
|
|
45
|
-
exports.
|
|
46
|
-
const buttonGroupStyles = {
|
|
43
|
+
const buttonGroupStyles = exports.buttonGroupStyles = {
|
|
47
44
|
borderRadius: '4px',
|
|
48
45
|
backgroundColor: 'gray.100',
|
|
49
46
|
padding: 1
|
|
50
|
-
};
|
|
51
|
-
exports.buttonGroupStyles = buttonGroupStyles;
|
|
47
|
+
};
|
package/dist/components/index.js
CHANGED
|
@@ -644,5 +644,5 @@ var _AutoSuggestSelect = require("./AutoSuggestSelect");
|
|
|
644
644
|
var _Badge = _interopRequireDefault(require("./Badge/Badge"));
|
|
645
645
|
var _ToggleButtonGroup = _interopRequireDefault(require("./ToggleButtonGroup/ToggleButtonGroup"));
|
|
646
646
|
var _react = require("@chakra-ui/react");
|
|
647
|
-
function _getRequireWildcardCache(
|
|
648
|
-
function _interopRequireWildcard(
|
|
647
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
648
|
+
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; }
|
|
@@ -4,19 +4,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.notificationStatusStyles = exports.notificationSizeStyles = exports.notificationBaseStyle = exports.NOTIFICATION_STATUSES = void 0;
|
|
7
|
-
const NOTIFICATION_STATUSES = {
|
|
7
|
+
const NOTIFICATION_STATUSES = exports.NOTIFICATION_STATUSES = {
|
|
8
8
|
NEUTRAL: 'neutral',
|
|
9
9
|
ERROR: 'error',
|
|
10
10
|
WARNING: 'warning',
|
|
11
11
|
SUCCESS: 'success'
|
|
12
12
|
};
|
|
13
|
-
exports.NOTIFICATION_STATUSES = NOTIFICATION_STATUSES;
|
|
14
13
|
const NOTIFICATION_SIZES = {
|
|
15
14
|
SM: 'sm',
|
|
16
15
|
MD: 'md',
|
|
17
16
|
LG: 'lg'
|
|
18
17
|
};
|
|
19
|
-
const notificationBaseStyle = {
|
|
18
|
+
const notificationBaseStyle = exports.notificationBaseStyle = {
|
|
20
19
|
container: {
|
|
21
20
|
paddingY: 2,
|
|
22
21
|
borderRadius: 'base'
|
|
@@ -88,7 +87,6 @@ const notificationBaseStyle = {
|
|
|
88
87
|
}
|
|
89
88
|
}
|
|
90
89
|
};
|
|
91
|
-
exports.notificationBaseStyle = notificationBaseStyle;
|
|
92
90
|
const notificationStatusStyles = status => {
|
|
93
91
|
switch (status) {
|
|
94
92
|
case NOTIFICATION_STATUSES.NEUTRAL:
|
|
@@ -12,5 +12,4 @@ const shadows = {
|
|
|
12
12
|
// primary.400, 70% opacity
|
|
13
13
|
drawer: '-8px 0 16px 0 rgba(33,33,33,.1)'
|
|
14
14
|
};
|
|
15
|
-
var _default = (0, _merge.default)(_theme.default.shadows, shadows);
|
|
16
|
-
exports.default = _default;
|
|
15
|
+
var _default = exports.default = (0, _merge.default)(_theme.default.shadows, shadows);
|