@spothero/ui 22.3.2 → 22.3.9-beta.0

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.
Files changed (180) hide show
  1. package/dist/index.cjs.js +54151 -0
  2. package/dist/index.cjs.js.map +1 -0
  3. package/dist/index.esm.js +53999 -0
  4. package/dist/index.esm.js.map +1 -0
  5. package/package.json +39 -40
  6. package/dist/components/Accordion/Accordion.stories.js +0 -91
  7. package/dist/components/Accordion/AccordionActionButton.js +0 -29
  8. package/dist/components/Accordion/index.js +0 -44
  9. package/dist/components/Accordion/styles/index.js +0 -76
  10. package/dist/components/Alert/Alert.js +0 -83
  11. package/dist/components/Alert/Alert.stories.js +0 -49
  12. package/dist/components/Alert/index.js +0 -13
  13. package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +0 -148
  14. package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +0 -19
  15. package/dist/components/AutoSuggestSelect/index.js +0 -13
  16. package/dist/components/Badge/Badge.js +0 -12
  17. package/dist/components/Badge/Badge.stories.js +0 -28
  18. package/dist/components/Badge/styles/index.js +0 -32
  19. package/dist/components/Button/Button.js +0 -36
  20. package/dist/components/Button/Button.spec.js +0 -25
  21. package/dist/components/Button/Button.styles.js +0 -164
  22. package/dist/components/Button/button-props.js +0 -71
  23. package/dist/components/Button/index.js +0 -20
  24. package/dist/components/Button/stories/button.js +0 -45
  25. package/dist/components/Button/stories/index.stories.js +0 -94
  26. package/dist/components/Button/stories/overview.js +0 -63
  27. package/dist/components/Card/Card.js +0 -22
  28. package/dist/components/Card/Card.stories.js +0 -29
  29. package/dist/components/Checkbox/Checkbox.js +0 -38
  30. package/dist/components/Checkbox/Checkbox.stories.js +0 -65
  31. package/dist/components/Checkbox/index.js +0 -13
  32. package/dist/components/Checkbox/styles/index.js +0 -89
  33. package/dist/components/Container/Container.js +0 -17
  34. package/dist/components/Container/Container.stories.js +0 -43
  35. package/dist/components/Container/Container.styles.js +0 -16
  36. package/dist/components/CreatableSelect/CreatableSelect.js +0 -124
  37. package/dist/components/CreatableSelect/CreatableSelect.stories.js +0 -55
  38. package/dist/components/CreatableSelect/index.js +0 -13
  39. package/dist/components/Divider/Divider.js +0 -29
  40. package/dist/components/Divider/Divider.stories.js +0 -35
  41. package/dist/components/Divider/Divider.styles.js +0 -20
  42. package/dist/components/Drawer/Drawer.js +0 -24
  43. package/dist/components/Drawer/Drawer.stories.js +0 -39
  44. package/dist/components/Drawer/index.js +0 -56
  45. package/dist/components/Drawer/styles/index.js +0 -104
  46. package/dist/components/FormControl/FormControl.js +0 -67
  47. package/dist/components/Grid/Grid.js +0 -28
  48. package/dist/components/Grid/Grid.stories.js +0 -100
  49. package/dist/components/Grid/Grid.styles.js +0 -17
  50. package/dist/components/Grid/GridItem.js +0 -17
  51. package/dist/components/Grid/GridItem.styles.js +0 -13
  52. package/dist/components/Grid/index.js +0 -20
  53. package/dist/components/Heading/Heading.js +0 -27
  54. package/dist/components/Heading/Heading.stories.js +0 -41
  55. package/dist/components/Heading/Heading.styles.js +0 -63
  56. package/dist/components/Icon/Icon.js +0 -12
  57. package/dist/components/Icon/Icon.stories.js +0 -36
  58. package/dist/components/Image/Image.js +0 -73
  59. package/dist/components/Image/Image.spec.js +0 -77
  60. package/dist/components/Image/Image.stories.js +0 -74
  61. package/dist/components/Input/Input.js +0 -44
  62. package/dist/components/Input/Input.stories.js +0 -59
  63. package/dist/components/Input/index.js +0 -13
  64. package/dist/components/Input/styles/index.js +0 -64
  65. package/dist/components/Link/Link.js +0 -12
  66. package/dist/components/Link/Link.stories.js +0 -49
  67. package/dist/components/Link/Link.styles.js +0 -44
  68. package/dist/components/List/List.js +0 -61
  69. package/dist/components/List/List.stories.js +0 -75
  70. package/dist/components/List/index.js +0 -20
  71. package/dist/components/List/styles/index.js +0 -16
  72. package/dist/components/List/styles/item.styles.js +0 -10
  73. package/dist/components/Loader/Loader.js +0 -44
  74. package/dist/components/Loader/Loader.stories.js +0 -116
  75. package/dist/components/Menu/Menu.js +0 -16
  76. package/dist/components/Menu/Menu.stories.js +0 -159
  77. package/dist/components/Menu/Menu.styles.js +0 -173
  78. package/dist/components/Menu/index.js +0 -56
  79. package/dist/components/Modal/Modal.js +0 -42
  80. package/dist/components/Modal/Modal.stories.js +0 -184
  81. package/dist/components/Modal/index.js +0 -32
  82. package/dist/components/Modal/styles/body.js +0 -30
  83. package/dist/components/Modal/styles/closeButton.js +0 -24
  84. package/dist/components/Modal/styles/dialog.js +0 -22
  85. package/dist/components/Modal/styles/dialogContainer.js +0 -19
  86. package/dist/components/Modal/styles/footer.js +0 -11
  87. package/dist/components/Modal/styles/header.js +0 -17
  88. package/dist/components/Modal/styles/index.js +0 -53
  89. package/dist/components/Modal/styles/overlay.js +0 -10
  90. package/dist/components/Popover/Popover.js +0 -26
  91. package/dist/components/Popover/Popover.stories.js +0 -80
  92. package/dist/components/Popover/PopoverArrow.js +0 -19
  93. package/dist/components/Popover/PopoverCloseButton.js +0 -19
  94. package/dist/components/Popover/PopoverContent.js +0 -38
  95. package/dist/components/Popover/index.js +0 -40
  96. package/dist/components/Popover/styles/index.js +0 -24
  97. package/dist/components/Popover/styles/popover-arrow.js +0 -12
  98. package/dist/components/Popover/styles/popover-body.js +0 -10
  99. package/dist/components/Popover/styles/popover-close-button.js +0 -26
  100. package/dist/components/Popover/styles/popover-content.js +0 -26
  101. package/dist/components/Popover/styles/popover-header.js +0 -11
  102. package/dist/components/Popover/styles/popper.js +0 -10
  103. package/dist/components/Progress/Progress.js +0 -37
  104. package/dist/components/Progress/Progress.stories.js +0 -79
  105. package/dist/components/Progress/Progress.styles.js +0 -122
  106. package/dist/components/Radio/Radio.js +0 -37
  107. package/dist/components/Radio/Radio.stories.js +0 -138
  108. package/dist/components/Radio/RadioGroup.js +0 -47
  109. package/dist/components/Radio/index.js +0 -20
  110. package/dist/components/Radio/styles/index.js +0 -118
  111. package/dist/components/RefreshedInput/Button/Button.js +0 -67
  112. package/dist/components/RefreshedInput/Button/Button.stories.js +0 -79
  113. package/dist/components/RefreshedInput/Button/index.js +0 -13
  114. package/dist/components/RefreshedInput/Button/styles/index.js +0 -25
  115. package/dist/components/RefreshedInput/FormControl/index.js +0 -167
  116. package/dist/components/RefreshedInput/Input/Input.js +0 -61
  117. package/dist/components/RefreshedInput/Input/Input.stories.js +0 -74
  118. package/dist/components/RefreshedInput/Input/index.js +0 -13
  119. package/dist/components/RefreshedInput/Input/styles/index.js +0 -23
  120. package/dist/components/RefreshedInput/Select/Select.js +0 -65
  121. package/dist/components/RefreshedInput/Select/Select.stories.js +0 -80
  122. package/dist/components/RefreshedInput/Select/index.js +0 -13
  123. package/dist/components/RefreshedInput/Select/styles/index.js +0 -26
  124. package/dist/components/RefreshedInput/index.js +0 -34
  125. package/dist/components/RefreshedInput/storyAid/index.js +0 -19
  126. package/dist/components/Select/Select.js +0 -50
  127. package/dist/components/Select/Select.stories.js +0 -63
  128. package/dist/components/Select/index.js +0 -13
  129. package/dist/components/Select/styles/index.js +0 -46
  130. package/dist/components/SelectionCard/SelectionCard.js +0 -61
  131. package/dist/components/SelectionCard/SelectionCard.stories.js +0 -90
  132. package/dist/components/SelectionCard/index.js +0 -13
  133. package/dist/components/Skeleton/Skeleton.stories.js +0 -23
  134. package/dist/components/Skeleton/Skeleton.styles.js +0 -9
  135. package/dist/components/Skeleton/index.js +0 -24
  136. package/dist/components/Spinner/Spinner.js +0 -29
  137. package/dist/components/Spinner/Spinner.stories.js +0 -98
  138. package/dist/components/Spinner/Spinner.styles.js +0 -85
  139. package/dist/components/Switch/Switch.js +0 -40
  140. package/dist/components/Switch/Switch.stories.js +0 -76
  141. package/dist/components/Switch/index.js +0 -13
  142. package/dist/components/Switch/styles/index.js +0 -32
  143. package/dist/components/Table/Table.js +0 -12
  144. package/dist/components/Table/Table.stories.js +0 -69
  145. package/dist/components/Table/Table.styles.js +0 -66
  146. package/dist/components/Table/index.js +0 -62
  147. package/dist/components/Tabs/Tabs.js +0 -35
  148. package/dist/components/Tabs/Tabs.stories.js +0 -39
  149. package/dist/components/Tabs/combineSizeWithVariant.js +0 -36
  150. package/dist/components/Tabs/index.js +0 -38
  151. package/dist/components/Tabs/styles/index.js +0 -70
  152. package/dist/components/Text/Text.js +0 -33
  153. package/dist/components/Text/Text.stories.js +0 -42
  154. package/dist/components/Text/Text.styles.js +0 -45
  155. package/dist/components/Text/combineAsWithVariant.js +0 -100
  156. package/dist/components/Text/options.js +0 -8
  157. package/dist/components/Textarea/Textarea.js +0 -44
  158. package/dist/components/Textarea/Textarea.stories.js +0 -59
  159. package/dist/components/Textarea/index.js +0 -13
  160. package/dist/components/Textarea/styles/index.js +0 -64
  161. package/dist/components/ThemeProvider/ThemeProvider.js +0 -39
  162. package/dist/components/ThemeProvider/ThemeProvider.stories.js +0 -51
  163. package/dist/components/Toast/Toast.stories.js +0 -77
  164. package/dist/components/ToggleButtonGroup/ToggleButtonGroup.js +0 -59
  165. package/dist/components/ToggleButtonGroup/ToggleButtonGroup.stories.js +0 -53
  166. package/dist/components/ToggleButtonGroup/index.js +0 -13
  167. package/dist/components/ToggleButtonGroup/styles/index.js +0 -47
  168. package/dist/components/index.js +0 -785
  169. package/dist/components/styles.js +0 -188
  170. package/dist/theme/base/breakpoints.js +0 -23
  171. package/dist/theme/base/colors.js +0 -138
  172. package/dist/theme/base/index.js +0 -79
  173. package/dist/theme/base/notifications.js +0 -198
  174. package/dist/theme/base/shadows.js +0 -15
  175. package/dist/theme/base/sizes.js +0 -88
  176. package/dist/theme/base/typography.js +0 -38
  177. package/dist/theme/base/zindices.js +0 -33
  178. package/dist/theme/global.js +0 -110
  179. package/dist/theme/index.js +0 -33
  180. package/dist/utils/Spaces.js +0 -16
@@ -1,13 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- Object.defineProperty(exports, "CreatableSelect", {
8
- enumerable: true,
9
- get: function () {
10
- return _CreatableSelect.default;
11
- }
12
- });
13
- var _CreatableSelect = _interopRequireDefault(require("./CreatableSelect"));
@@ -1,29 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
9
- var _react = _interopRequireWildcard(require("react"));
10
- var _react2 = require("@chakra-ui/react");
11
- var _Divider = require("./Divider.styles");
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
- const Divider = /*#__PURE__*/(0, _react.forwardRef)(({
15
- variant,
16
- colorScheme: borderColor,
17
- ...props
18
- }, ref) => {
19
- return /*#__PURE__*/_react.default.createElement(_react2.Divider, (0, _extends2.default)({}, _Divider.colorScheme[borderColor], {
20
- variant: variant
21
- }, props, {
22
- ref: ref
23
- }));
24
- });
25
- Divider.defaultProps = {
26
- variant: 'solid',
27
- colorScheme: 'medium'
28
- };
29
- var _default = exports.default = Divider;
@@ -1,35 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = exports.Divider = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var _Divider = require("./Divider.styles");
10
- var _Divider2 = _interopRequireDefault(require("./Divider"));
11
- var _react2 = require("@chakra-ui/react");
12
- var _default = exports.default = {
13
- title: 'v2/Divider',
14
- component: _Divider2.default,
15
- argTypes: {
16
- colorScheme: {
17
- control: {
18
- type: 'select',
19
- options: Object.keys(_Divider.colorScheme)
20
- }
21
- },
22
- variant: {
23
- control: {
24
- type: 'select',
25
- options: ['solid', 'dashed']
26
- }
27
- }
28
- }
29
- };
30
- const Template = props => /*#__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"));
31
- const Divider = exports.Divider = Template.bind({});
32
- Divider.args = {
33
- variant: 'solid',
34
- colorScheme: 'medium'
35
- };
@@ -1,20 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = exports.colorScheme = void 0;
8
- var _merge = _interopRequireDefault(require("lodash/merge"));
9
- var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
10
- const colorScheme = exports.colorScheme = {
11
- low: {
12
- borderColor: 'gray.100'
13
- },
14
- medium: {
15
- borderColor: 'gray.200'
16
- }
17
- };
18
- var _default = exports.default = (0, _merge.default)(_theme.default.components.Divider, {
19
- colorScheme
20
- });
@@ -1,24 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
9
- var _react = _interopRequireWildcard(require("react"));
10
- var _react2 = require("@chakra-ui/react");
11
- 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); }
12
- 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; }
13
- const Drawer = /*#__PURE__*/(0, _react.forwardRef)(({
14
- header,
15
- children,
16
- ...props
17
- }, ref) => {
18
- return /*#__PURE__*/_react.default.createElement(_react2.Drawer, (0, _extends2.default)({
19
- placement: "right"
20
- }, props, {
21
- ref: ref
22
- }), /*#__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
- });
24
- var _default = exports.default = Drawer;
@@ -1,39 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = exports.Drawer = void 0;
8
- var _react = _interopRequireWildcard(require("react"));
9
- var _Text = _interopRequireDefault(require("../Text/Text"));
10
- var _Button = require("../Button");
11
- var _index = require("./index");
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
- title: 'v2/Drawer',
16
- component: _index.Drawer,
17
- subcomponents: {
18
- DrawerHeader: _index.DrawerHeader,
19
- DrawerBody: _index.DrawerBody,
20
- DrawerFooter: _index.DrawerFooter
21
- },
22
- parameters: {
23
- importBy: 'Drawer',
24
- removeBaseHtmlClass: true,
25
- chakraLink: 'https://chakra-ui.com/docs/components/drawer'
26
- }
27
- };
28
- const Drawer = props => {
29
- const [isOpen, setIsOpen] = (0, _react.useState)(true);
30
- const toggleDrawer = () => setIsOpen(prevState => !prevState);
31
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Button.Button, {
32
- onClick: toggleDrawer
33
- }, "Open"), /*#__PURE__*/_react.default.createElement(_index.Drawer, {
34
- isOpen: isOpen,
35
- onClose: toggleDrawer,
36
- header: " Sample Drawer Header"
37
- }, /*#__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"))));
38
- };
39
- exports.Drawer = Drawer;
@@ -1,56 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- Object.defineProperty(exports, "Drawer", {
8
- enumerable: true,
9
- get: function () {
10
- return _Drawer.default;
11
- }
12
- });
13
- Object.defineProperty(exports, "DrawerBody", {
14
- enumerable: true,
15
- get: function () {
16
- return _react.DrawerBody;
17
- }
18
- });
19
- Object.defineProperty(exports, "DrawerCloseButton", {
20
- enumerable: true,
21
- get: function () {
22
- return _react.DrawerCloseButton;
23
- }
24
- });
25
- Object.defineProperty(exports, "DrawerContainer", {
26
- enumerable: true,
27
- get: function () {
28
- return _react.Drawer;
29
- }
30
- });
31
- Object.defineProperty(exports, "DrawerContent", {
32
- enumerable: true,
33
- get: function () {
34
- return _react.DrawerContent;
35
- }
36
- });
37
- Object.defineProperty(exports, "DrawerFooter", {
38
- enumerable: true,
39
- get: function () {
40
- return _react.DrawerFooter;
41
- }
42
- });
43
- Object.defineProperty(exports, "DrawerHeader", {
44
- enumerable: true,
45
- get: function () {
46
- return _react.DrawerHeader;
47
- }
48
- });
49
- Object.defineProperty(exports, "DrawerOverlay", {
50
- enumerable: true,
51
- get: function () {
52
- return _react.DrawerOverlay;
53
- }
54
- });
55
- var _react = require("@chakra-ui/react");
56
- var _Drawer = _interopRequireDefault(require("./Drawer"));
@@ -1,104 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _merge = _interopRequireDefault(require("lodash/merge"));
9
- var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
10
- const body = ({
11
- hasFooter,
12
- ...props
13
- }) => {
14
- return {
15
- overflowY: 'auto',
16
- padding: 6,
17
- paddingBottom: hasFooter ? 24 : 6
18
- };
19
- };
20
- const footer = props => {
21
- return {
22
- padding: 6,
23
- backgroundColor: 'white',
24
- position: 'absolute',
25
- bottom: 0,
26
- width: '100%'
27
- };
28
- };
29
- const header = props => {
30
- return {
31
- paddingY: 3,
32
- paddingX: 6,
33
- borderBottom: '1px solid',
34
- borderBottomColor: 'gray.100',
35
- display: 'flex',
36
- gridGap: 2,
37
- alignItems: 'center',
38
- justifyContent: 'space-between',
39
- fontWeight: 'semibold'
40
- };
41
- };
42
- const closeButton = props => {
43
- return {
44
- width: 8,
45
- height: 8,
46
- fontSize: 'xs',
47
- background: 'transparent',
48
- borderRadius: 'md',
49
- display: 'flex',
50
- alignItems: 'center',
51
- justifyContent: 'center',
52
- flexShrink: 0,
53
- transitionProperty: 'common',
54
- transitionDuration: 'normal',
55
- outline: 'transparent solid 2px',
56
- outlineOffset: '2px',
57
- color: 'gray.600',
58
- _hover: {
59
- color: 'black',
60
- background: 'gray.100'
61
- },
62
- _focus: {
63
- outlineColor: 'primary.default'
64
- }
65
- };
66
- };
67
- const dialogContainer = props => {
68
- return {
69
- zIndex: 'layer2',
70
- backgroundColor: 'transparent'
71
- };
72
- };
73
- const dialog = props => {
74
- return {
75
- backgroundColor: 'white',
76
- boxShadow: 'drawer'
77
- };
78
- };
79
- const baseStyle = props => ({
80
- body: body(props),
81
- footer: footer(props),
82
- header: header(props),
83
- dialog: dialog(props),
84
- closeButton: closeButton(props),
85
- dialogContainer: dialogContainer(props)
86
- });
87
- const defaultProps = {
88
- size: 'xs'
89
- };
90
- const sizes = {
91
- xs: {
92
- dialog: {
93
- maxWidth: {
94
- base: '100vw',
95
- mobileXL: 80
96
- }
97
- }
98
- }
99
- };
100
- var _default = exports.default = (0, _merge.default)(_theme.default.components.Drawer, {
101
- defaultProps,
102
- baseStyle,
103
- sizes
104
- });
@@ -1,67 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
9
- var _react = _interopRequireWildcard(require("react"));
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
- var _react2 = require("@chakra-ui/react");
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
- const FormControl = /*#__PURE__*/(0, _react.forwardRef)(({
15
- children,
16
- label,
17
- inputId,
18
- helperText,
19
- errorMessage,
20
- isFieldset,
21
- isOptional,
22
- customRequiredText,
23
- ...props
24
- }, ref) => /*#__PURE__*/_react.default.createElement(_react2.FormControl, (0, _extends2.default)({}, props, {
25
- ref: ref,
26
- as: isFieldset ? 'fieldset' : 'div',
27
- borderWidth: "0"
28
- }), label && /*#__PURE__*/_react.default.createElement(_react2.FormLabel, {
29
- color: "gray.600",
30
- fontWeight: "semibold",
31
- marginBottom: helperText ? 0 : 1,
32
- fontSize: "sm",
33
- htmlFor: inputId,
34
- as: isFieldset ? 'legend' : 'label',
35
- requiredIndicator: props?.isRequired && customRequiredText ? /*#__PURE__*/_react.default.createElement(_react2.Text, {
36
- marginLeft: 1,
37
- as: "span",
38
- variant: "caption",
39
- color: "text.secondary.light"
40
- }, customRequiredText) : null,
41
- optionalIndicator: isOptional && !props?.isRequired ? /*#__PURE__*/_react.default.createElement(_react2.Text, {
42
- marginLeft: 1,
43
- as: "span",
44
- variant: "caption",
45
- color: "text.secondary.light"
46
- }, "Optional") : null
47
- }, label), helperText && /*#__PURE__*/_react.default.createElement(_react2.FormHelperText, {
48
- color: "gray.600",
49
- marginBottom: 1,
50
- fontSize: "xs"
51
- }, helperText), children, /*#__PURE__*/_react.default.createElement(_react2.FormErrorMessage, {
52
- color: "error",
53
- mt: 1,
54
- fontSize: "xs"
55
- }, errorMessage)));
56
- FormControl.propTypes = {
57
- inputId: _propTypes.default.string.isRequired,
58
- label: _propTypes.default.string,
59
- helperText: _propTypes.default.string,
60
- errorMessage: _propTypes.default.string,
61
- children: _propTypes.default.element,
62
- isFieldset: _propTypes.default.bool,
63
- isOptional: _propTypes.default.bool,
64
- isRequired: _propTypes.default.bool,
65
- customRequiredText: _propTypes.default.string
66
- };
67
- var _default = exports.default = FormControl;
@@ -1,28 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
9
- var _react = _interopRequireWildcard(require("react"));
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
- var _react2 = require("@chakra-ui/react");
12
- var _Grid = require("./Grid.styles");
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
- const Grid = /*#__PURE__*/(0, _react.forwardRef)(({
16
- isCompact,
17
- ...props
18
- }, ref) => /*#__PURE__*/_react.default.createElement(_react2.Grid, (0, _extends2.default)({}, _Grid.baseStyles, isCompact && _Grid.compactStyles, props, {
19
- ref: ref
20
- })));
21
- Grid.propTypes = {
22
- /** This will reduce the grid gap by half */
23
- isCompact: _propTypes.default.bool
24
- };
25
- Grid.defaultProps = {
26
- isCompact: false
27
- };
28
- var _default = exports.default = Grid;
@@ -1,100 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = exports.GridItemStartEnd = exports.GridItemSpan = exports.GridColumnLayout = exports.Grid = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
9
- var _react = _interopRequireDefault(require("react"));
10
- var _react2 = require("@chakra-ui/react");
11
- var _Grid = _interopRequireDefault(require("./Grid"));
12
- var _ = require("./..");
13
- const rangeControl = (max, min = 1) => ({
14
- control: {
15
- max,
16
- min,
17
- step: 1,
18
- type: 'range'
19
- }
20
- });
21
- const spanMap = {
22
- 1: 12,
23
- 2: 6,
24
- 3: 4,
25
- 4: 3
26
- };
27
- var _default = exports.default = {
28
- title: 'v2/Grid',
29
- component: _Grid.default,
30
- subcomponents: {
31
- GridItemComponent: _.GridItem
32
- },
33
- parameters: {
34
- removeBaseHtmlClass: true
35
- },
36
- argTypes: {
37
- isCompact: {
38
- control: 'boolean'
39
- }
40
- }
41
- };
42
- const GridTemplate = (args, {
43
- hasDarkBackground
44
- }) => /*#__PURE__*/_react.default.createElement(_.Container, null, /*#__PURE__*/_react.default.createElement(_Grid.default, (0, _extends2.default)({}, args, {
45
- bg: hasDarkBackground ? 'secondary.700' : 'secondary.default'
46
- }), Array(12).fill(null).map((Item, index) => /*#__PURE__*/_react.default.createElement(_.GridItem, {
47
- key: `GridItem-${index}`,
48
- colSpan: 1
49
- }, /*#__PURE__*/_react.default.createElement(_react2.Box, {
50
- h: "20rem",
51
- bg: hasDarkBackground ? 'primary.400' : 'primary.default'
52
- })))));
53
- const Grid = exports.Grid = GridTemplate.bind({});
54
- const GridItemTemplate = ({
55
- isCompact,
56
- ...args
57
- }) => /*#__PURE__*/_react.default.createElement(_.Container, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
58
- bg: "secondary.default",
59
- isCompact: isCompact
60
- }, /*#__PURE__*/_react.default.createElement(_.GridItem, args, /*#__PURE__*/_react.default.createElement(_react2.Box, {
61
- h: "20rem",
62
- bg: "primary.default"
63
- }))));
64
- const GridItemSpan = exports.GridItemSpan = GridItemTemplate.bind({});
65
- GridItemSpan.storyName = 'GridItem - span prop';
66
- GridItemSpan.argTypes = {
67
- colSpan: rangeControl(12)
68
- };
69
- GridItemSpan.args = {
70
- colSpan: 12
71
- };
72
- const GridItemStartEnd = exports.GridItemStartEnd = GridItemTemplate.bind({});
73
- GridItemStartEnd.storyName = 'GridItem - start/end prop';
74
- GridItemStartEnd.argTypes = {
75
- colStart: rangeControl(12),
76
- colEnd: rangeControl(13, 2)
77
- };
78
- GridItemStartEnd.args = {
79
- colStart: 1,
80
- colEnd: 2
81
- };
82
- const ColumnLayoutTemplate = ({
83
- numberOfColumns
84
- }) => /*#__PURE__*/_react.default.createElement(_.Container, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
85
- bg: "secondary.default"
86
- }, Array(numberOfColumns).fill(null).map((item, index) => /*#__PURE__*/_react.default.createElement(_.GridItem, {
87
- key: `GridItem-${index}`,
88
- colSpan: spanMap[numberOfColumns]
89
- }, /*#__PURE__*/_react.default.createElement(_react2.Box, {
90
- h: "20rem",
91
- bg: "primary.default"
92
- })))));
93
- const GridColumnLayout = exports.GridColumnLayout = ColumnLayoutTemplate.bind({});
94
- GridColumnLayout.storyName = 'Grid - MultiColumn Layout';
95
- GridColumnLayout.argTypes = {
96
- numberOfColumns: rangeControl(4)
97
- };
98
- GridColumnLayout.args = {
99
- numberOfColumns: 2
100
- };
@@ -1,17 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.compactStyles = exports.baseStyles = void 0;
7
- // NOTE: considering adding a specifc prop for grid row padding
8
- const baseStyles = exports.baseStyles = {
9
- gap: {
10
- base: 4,
11
- tablet: 8
12
- },
13
- templateColumns: 'repeat(12, 1fr)'
14
- };
15
- const compactStyles = exports.compactStyles = {
16
- gap: 4
17
- };
@@ -1,17 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
9
- var _react = _interopRequireWildcard(require("react"));
10
- var _react2 = require("@chakra-ui/react");
11
- var _GridItem = _interopRequireDefault(require("./GridItem.styles"));
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
- const GridItem = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => /*#__PURE__*/_react.default.createElement(_react2.GridItem, (0, _extends2.default)({}, _GridItem.default, props, {
15
- ref: ref
16
- })));
17
- var _default = exports.default = GridItem;
@@ -1,13 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- // NOTE: styles NOT in the Chakra's base styles do not need to explicitly export baseStyles
8
- // TODO: move this comment to the readme
9
-
10
- const styles = {
11
- colSpan: 12
12
- };
13
- var _default = exports.default = styles;
@@ -1,20 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- Object.defineProperty(exports, "GridItem", {
8
- enumerable: true,
9
- get: function () {
10
- return _GridItem.default;
11
- }
12
- });
13
- Object.defineProperty(exports, "default", {
14
- enumerable: true,
15
- get: function () {
16
- return _Grid.default;
17
- }
18
- });
19
- var _Grid = _interopRequireDefault(require("./Grid"));
20
- var _GridItem = _interopRequireDefault(require("./GridItem"));
@@ -1,27 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
9
- var _react = _interopRequireWildcard(require("react"));
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
- var _react2 = require("@chakra-ui/react");
12
- var _Heading = require("./Heading.styles");
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
- const Heading = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => /*#__PURE__*/_react.default.createElement(_react2.Heading, (0, _extends2.default)({}, props, {
16
- ref: ref,
17
- variant: props.variant || props.as || 'h2'
18
- })));
19
- Heading.propTypes = {
20
- /** The React node that will render inside the element */
21
- children: _propTypes.default.node,
22
- /** Controls the underlying level of the html heading tag */
23
- as: _propTypes.default.oneOf(Object.keys(_Heading.variants)),
24
- /** The styling that will be applied to the component regardless of the underlying html */
25
- variant: _propTypes.default.oneOf(Object.keys(_Heading.variants))
26
- };
27
- var _default = exports.default = Heading;
@@ -1,41 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = exports.Heading = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var _Heading = require("./Heading.styles");
10
- var _Heading2 = _interopRequireDefault(require("./Heading"));
11
- var _default = exports.default = {
12
- title: 'v2/Heading',
13
- component: _Heading2.default,
14
- parameters: {
15
- removeBaseHtmlClass: true
16
- },
17
- argTypes: {
18
- as: {
19
- control: {
20
- type: 'select',
21
- options: Object.keys(_Heading.variants)
22
- }
23
- },
24
- variant: {
25
- control: {
26
- type: 'select',
27
- options: Object.keys(_Heading.variants)
28
- }
29
- },
30
- children: {
31
- control: {
32
- type: 'text'
33
- }
34
- }
35
- }
36
- };
37
- const Template = props => /*#__PURE__*/_react.default.createElement(_Heading2.default, props);
38
- const Heading = exports.Heading = Template.bind({});
39
- Heading.args = {
40
- children: 'Heading'
41
- };