@spothero/ui 22.3.2 → 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.
Files changed (176) hide show
  1. package/dist/components/Accordion/Accordion.stories.js +39 -29
  2. package/dist/components/Accordion/AccordionActionButton.js +15 -12
  3. package/dist/components/Accordion/index.js +15 -14
  4. package/dist/components/Accordion/styles/index.js +10 -9
  5. package/dist/components/Alert/Alert.js +45 -37
  6. package/dist/components/Alert/Alert.stories.js +36 -21
  7. package/dist/components/Alert/index.js +5 -4
  8. package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +121 -100
  9. package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +11 -7
  10. package/dist/components/AutoSuggestSelect/index.js +5 -4
  11. package/dist/components/Badge/Badge.js +4 -3
  12. package/dist/components/Badge/Badge.stories.js +20 -16
  13. package/dist/components/Badge/styles/index.js +10 -9
  14. package/dist/components/Button/Button.js +55 -20
  15. package/dist/components/Button/Button.spec.js +6 -6
  16. package/dist/components/Button/Button.styles.js +39 -37
  17. package/dist/components/Button/button-props.js +20 -18
  18. package/dist/components/Button/index.js +7 -6
  19. package/dist/components/Button/stories/button.js +15 -13
  20. package/dist/components/Button/stories/index.stories.js +37 -28
  21. package/dist/components/Button/stories/overview.js +49 -35
  22. package/dist/components/Card/Card.js +20 -14
  23. package/dist/components/Card/Card.stories.js +13 -9
  24. package/dist/components/Checkbox/Checkbox.js +24 -18
  25. package/dist/components/Checkbox/Checkbox.stories.js +10 -6
  26. package/dist/components/Checkbox/index.js +5 -4
  27. package/dist/components/Checkbox/styles/index.js +9 -8
  28. package/dist/components/Container/Container.js +14 -8
  29. package/dist/components/Container/Container.stories.js +29 -19
  30. package/dist/components/Container/Container.styles.js +5 -4
  31. package/dist/components/CreatableSelect/CreatableSelect.js +98 -74
  32. package/dist/components/CreatableSelect/CreatableSelect.stories.js +43 -29
  33. package/dist/components/CreatableSelect/index.js +5 -4
  34. package/dist/components/Divider/Divider.js +16 -11
  35. package/dist/components/Divider/Divider.stories.js +12 -7
  36. package/dist/components/Divider/Divider.styles.js +6 -5
  37. package/dist/components/Drawer/Drawer.js +17 -12
  38. package/dist/components/Drawer/Drawer.stories.js +24 -13
  39. package/dist/components/Drawer/index.js +19 -18
  40. package/dist/components/Drawer/styles/index.js +29 -25
  41. package/dist/components/FormControl/FormControl.js +63 -56
  42. package/dist/components/Grid/Grid.js +19 -12
  43. package/dist/components/Grid/Grid.stories.js +68 -51
  44. package/dist/components/Grid/Grid.styles.js +4 -3
  45. package/dist/components/Grid/GridItem.js +14 -8
  46. package/dist/components/Grid/GridItem.styles.js +5 -4
  47. package/dist/components/Grid/index.js +8 -7
  48. package/dist/components/Heading/Heading.js +19 -12
  49. package/dist/components/Heading/Heading.stories.js +13 -8
  50. package/dist/components/Heading/Heading.styles.js +33 -27
  51. package/dist/components/Icon/Icon.js +4 -3
  52. package/dist/components/Icon/Icon.stories.js +27 -23
  53. package/dist/components/Image/Image.js +54 -43
  54. package/dist/components/Image/Image.spec.js +17 -17
  55. package/dist/components/Image/Image.stories.js +18 -12
  56. package/dist/components/Input/Input.js +24 -19
  57. package/dist/components/Input/Input.stories.js +13 -9
  58. package/dist/components/Input/index.js +5 -4
  59. package/dist/components/Input/styles/index.js +8 -7
  60. package/dist/components/Link/Link.js +4 -3
  61. package/dist/components/Link/Link.stories.js +34 -31
  62. package/dist/components/Link/Link.styles.js +12 -11
  63. package/dist/components/List/List.js +26 -18
  64. package/dist/components/List/List.stories.js +42 -25
  65. package/dist/components/List/index.js +7 -6
  66. package/dist/components/List/styles/index.js +7 -6
  67. package/dist/components/List/styles/item.styles.js +5 -4
  68. package/dist/components/Loader/Loader.js +29 -20
  69. package/dist/components/Loader/Loader.stories.js +36 -28
  70. package/dist/components/Menu/Menu.js +6 -5
  71. package/dist/components/Menu/Menu.stories.js +68 -58
  72. package/dist/components/Menu/Menu.styles.js +8 -7
  73. package/dist/components/Menu/index.js +19 -18
  74. package/dist/components/Modal/Modal.js +20 -16
  75. package/dist/components/Modal/Modal.stories.js +112 -71
  76. package/dist/components/Modal/index.js +11 -10
  77. package/dist/components/Modal/styles/body.js +23 -14
  78. package/dist/components/Modal/styles/closeButton.js +21 -20
  79. package/dist/components/Modal/styles/dialog.js +19 -18
  80. package/dist/components/Modal/styles/dialogContainer.js +9 -7
  81. package/dist/components/Modal/styles/footer.js +4 -3
  82. package/dist/components/Modal/styles/header.js +14 -13
  83. package/dist/components/Modal/styles/index.js +18 -15
  84. package/dist/components/Modal/styles/overlay.js +4 -3
  85. package/dist/components/Popover/Popover.js +24 -16
  86. package/dist/components/Popover/Popover.stories.js +54 -47
  87. package/dist/components/Popover/PopoverArrow.js +12 -8
  88. package/dist/components/Popover/PopoverCloseButton.js +12 -8
  89. package/dist/components/Popover/PopoverContent.js +23 -19
  90. package/dist/components/Popover/index.js +15 -14
  91. package/dist/components/Popover/styles/index.js +15 -12
  92. package/dist/components/Popover/styles/popover-arrow.js +10 -8
  93. package/dist/components/Popover/styles/popover-body.js +9 -6
  94. package/dist/components/Popover/styles/popover-close-button.js +36 -22
  95. package/dist/components/Popover/styles/popover-content.js +26 -22
  96. package/dist/components/Popover/styles/popover-header.js +5 -4
  97. package/dist/components/Popover/styles/popper.js +5 -4
  98. package/dist/components/Progress/Progress.js +16 -11
  99. package/dist/components/Progress/Progress.stories.js +29 -18
  100. package/dist/components/Progress/Progress.styles.js +44 -59
  101. package/dist/components/Radio/Radio.js +24 -18
  102. package/dist/components/Radio/Radio.stories.js +14 -15
  103. package/dist/components/Radio/RadioGroup.js +27 -22
  104. package/dist/components/Radio/index.js +8 -7
  105. package/dist/components/Radio/styles/index.js +13 -12
  106. package/dist/components/RefreshedInput/Button/Button.js +28 -23
  107. package/dist/components/RefreshedInput/Button/Button.stories.js +22 -16
  108. package/dist/components/RefreshedInput/Button/index.js +5 -4
  109. package/dist/components/RefreshedInput/Button/styles/index.js +22 -12
  110. package/dist/components/RefreshedInput/FormControl/index.js +60 -51
  111. package/dist/components/RefreshedInput/Input/Input.js +28 -22
  112. package/dist/components/RefreshedInput/Input/Input.stories.js +19 -14
  113. package/dist/components/RefreshedInput/Input/index.js +5 -4
  114. package/dist/components/RefreshedInput/Input/styles/index.js +18 -8
  115. package/dist/components/RefreshedInput/Select/Select.js +30 -25
  116. package/dist/components/RefreshedInput/Select/Select.stories.js +26 -21
  117. package/dist/components/RefreshedInput/Select/index.js +5 -4
  118. package/dist/components/RefreshedInput/Select/styles/index.js +19 -11
  119. package/dist/components/RefreshedInput/index.js +14 -13
  120. package/dist/components/RefreshedInput/storyAid/index.js +13 -10
  121. package/dist/components/Select/Select.js +25 -20
  122. package/dist/components/Select/Select.stories.js +21 -17
  123. package/dist/components/Select/index.js +5 -4
  124. package/dist/components/Select/styles/index.js +12 -7
  125. package/dist/components/SelectionCard/SelectionCard.js +31 -25
  126. package/dist/components/SelectionCard/SelectionCard.stories.js +10 -9
  127. package/dist/components/SelectionCard/index.js +5 -4
  128. package/dist/components/Skeleton/Skeleton.stories.js +17 -9
  129. package/dist/components/Skeleton/Skeleton.styles.js +4 -3
  130. package/dist/components/Skeleton/index.js +8 -7
  131. package/dist/components/Spinner/Spinner.js +17 -12
  132. package/dist/components/Spinner/Spinner.stories.js +56 -45
  133. package/dist/components/Spinner/Spinner.styles.js +41 -59
  134. package/dist/components/Switch/Switch.js +22 -17
  135. package/dist/components/Switch/Switch.stories.js +10 -6
  136. package/dist/components/Switch/index.js +5 -4
  137. package/dist/components/Switch/styles/index.js +29 -19
  138. package/dist/components/Table/Table.js +4 -3
  139. package/dist/components/Table/Table.stories.js +31 -20
  140. package/dist/components/Table/Table.styles.js +27 -16
  141. package/dist/components/Table/index.js +21 -20
  142. package/dist/components/Tabs/Tabs.js +18 -18
  143. package/dist/components/Tabs/Tabs.stories.js +14 -9
  144. package/dist/components/Tabs/combineSizeWithVariant.js +12 -13
  145. package/dist/components/Tabs/index.js +13 -12
  146. package/dist/components/Tabs/styles/index.js +6 -5
  147. package/dist/components/Text/Text.js +14 -12
  148. package/dist/components/Text/Text.stories.js +13 -8
  149. package/dist/components/Text/Text.styles.js +26 -18
  150. package/dist/components/Text/combineAsWithVariant.js +40 -37
  151. package/dist/components/Text/options.js +5 -4
  152. package/dist/components/Textarea/Textarea.js +24 -19
  153. package/dist/components/Textarea/Textarea.stories.js +14 -11
  154. package/dist/components/Textarea/index.js +5 -4
  155. package/dist/components/Textarea/styles/index.js +8 -7
  156. package/dist/components/ThemeProvider/ThemeProvider.js +29 -21
  157. package/dist/components/ThemeProvider/ThemeProvider.stories.js +20 -19
  158. package/dist/components/Toast/Toast.stories.js +24 -17
  159. package/dist/components/ToggleButtonGroup/ToggleButtonGroup.js +40 -34
  160. package/dist/components/ToggleButtonGroup/ToggleButtonGroup.stories.js +24 -15
  161. package/dist/components/ToggleButtonGroup/index.js +5 -4
  162. package/dist/components/ToggleButtonGroup/styles/index.js +6 -5
  163. package/dist/components/index.js +252 -238
  164. package/dist/components/styles.js +80 -79
  165. package/dist/theme/base/breakpoints.js +5 -4
  166. package/dist/theme/base/colors.js +50 -44
  167. package/dist/theme/base/index.js +29 -28
  168. package/dist/theme/base/notifications.js +8 -9
  169. package/dist/theme/base/shadows.js +5 -4
  170. package/dist/theme/base/sizes.js +7 -6
  171. package/dist/theme/base/typography.js +7 -6
  172. package/dist/theme/base/zindices.js +5 -4
  173. package/dist/theme/global.js +18 -89
  174. package/dist/theme/index.js +27 -15
  175. package/dist/utils/Spaces.js +15 -10
  176. package/package.json +26 -20
@@ -1,14 +1,15 @@
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
- Object.defineProperty(exports, "__esModule", {
5
+ _Object$defineProperty(exports, "__esModule", {
5
6
  value: true
6
7
  });
7
- exports.default = exports.baseStyle = void 0;
8
+ exports["default"] = exports.baseStyle = void 0;
8
9
  var _merge = _interopRequireDefault(require("lodash/merge"));
9
10
  var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
10
- const parts = ['control', 'label'];
11
- const baseStyle = exports.baseStyle = {
11
+ var parts = ['control', 'label'];
12
+ var baseStyle = exports.baseStyle = {
12
13
  container: {
13
14
  alignItems: 'start'
14
15
  },
@@ -32,7 +33,7 @@ const baseStyle = exports.baseStyle = {
32
33
  borderRadius: '50%',
33
34
  background: 'currentcolor',
34
35
  transition: 'all 150ms ease-in',
35
- filter: `drop-shadow(0 1px 1px rgba(0, 0, 0, 0.25))`
36
+ filter: "drop-shadow(0 1px 1px rgba(0, 0, 0, 0.25))"
36
37
  },
37
38
  _checked: {
38
39
  borderColor: 'primary.default',
@@ -63,7 +64,7 @@ const baseStyle = exports.baseStyle = {
63
64
  }
64
65
  }
65
66
  };
66
- const sizes = {
67
+ var sizes = {
67
68
  sm: {
68
69
  control: {
69
70
  minWidth: 4,
@@ -107,12 +108,12 @@ const sizes = {
107
108
  }
108
109
  }
109
110
  };
110
- const defaultProps = {
111
+ var defaultProps = {
111
112
  size: sizes.md
112
113
  };
113
- var _default = exports.default = (0, _merge.default)(_theme.default.components.Radio, {
114
- parts,
115
- baseStyle,
116
- sizes,
117
- defaultProps
114
+ var _default = exports["default"] = (0, _merge["default"])(_theme["default"].components.Radio, {
115
+ parts: parts,
116
+ baseStyle: baseStyle,
117
+ sizes: sizes,
118
+ defaultProps: defaultProps
118
119
  });
@@ -1,17 +1,23 @@
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
- Object.defineProperty(exports, "__esModule", {
8
+ _Object$defineProperty(exports, "__esModule", {
5
9
  value: true
6
10
  });
7
- exports.default = void 0;
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 _classnames = _interopRequireDefault(require("classnames"));
11
16
  var _FormControl = _interopRequireDefault(require("../FormControl"));
12
17
  var _react2 = require("@chakra-ui/react");
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; }
18
+ var _excluded = ["label", "helperText", "errorMessage", "isInvalid", "isDisabled", "isRequired", "rightElement", "leftElement", "rightElementStyles", "leftElementStyles", "buttonValue"];
19
+ 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); }
20
+ 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
21
  /**
16
22
  * A component used in the homepage/midfunnel refresh of 2024
17
23
  * Initially built as purpose built as possible with hopes of extending it to other systems
@@ -19,25 +25,24 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
19
25
  * The "value" will be the child of the button but must be passed through props like: `<RefreshedButton buttonValue="123"/>`. This aids in the styling.
20
26
  * Recommended to pass a title prop as that will aid in screen readers understanding this due to text not always being in the button
21
27
  */
22
- const Button = /*#__PURE__*/(0, _react.forwardRef)(({
23
- label,
24
- helperText,
25
- errorMessage,
26
- isInvalid,
27
- isDisabled,
28
- isRequired,
29
- rightElement,
30
- leftElement,
31
- rightElementStyles,
32
- leftElementStyles,
33
- buttonValue,
34
- ...props
35
- }, ref) => {
36
- const classes = (0, _classnames.default)({
28
+ var Button = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
29
+ var label = _ref.label,
30
+ helperText = _ref.helperText,
31
+ errorMessage = _ref.errorMessage,
32
+ isInvalid = _ref.isInvalid,
33
+ isDisabled = _ref.isDisabled,
34
+ isRequired = _ref.isRequired,
35
+ rightElement = _ref.rightElement,
36
+ leftElement = _ref.leftElement,
37
+ rightElementStyles = _ref.rightElementStyles,
38
+ leftElementStyles = _ref.leftElementStyles,
39
+ buttonValue = _ref.buttonValue,
40
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
41
+ var classes = (0, _classnames["default"])({
37
42
  'FormElement-contains-error': isInvalid
38
43
  }); //Historic carry over
39
44
 
40
- return /*#__PURE__*/_react.default.createElement(_FormControl.default, {
45
+ return /*#__PURE__*/_react["default"].createElement(_FormControl["default"], {
41
46
  isInvalid: isInvalid,
42
47
  isDisabled: isDisabled,
43
48
  isRequired: isRequired,
@@ -50,7 +55,7 @@ const Button = /*#__PURE__*/(0, _react.forwardRef)(({
50
55
  rightElementStyles: rightElementStyles,
51
56
  leftElementStyles: leftElementStyles,
52
57
  variant: "refreshed"
53
- }, /*#__PURE__*/_react.default.createElement(_react2.Button, (0, _extends2.default)({
58
+ }, /*#__PURE__*/_react["default"].createElement(_react2.Button, (0, _extends2["default"])({
54
59
  ref: ref,
55
60
  className: classes,
56
61
  variant: "refreshed",
@@ -60,8 +65,8 @@ const Button = /*#__PURE__*/(0, _react.forwardRef)(({
60
65
  isDisabled: isDisabled,
61
66
  color: isInvalid ? 'gray.600' : 'black',
62
67
  borderColor: isInvalid ? 'error' : 'gray.200',
63
- paddingTop: isInvalid ? 2.5 : 6,
68
+ paddingTop: 'var(--chakra-sizes-5-5)',
64
69
  textTransform: "none"
65
70
  }), buttonValue));
66
71
  });
67
- var _default = exports.default = Button;
72
+ var _default = exports["default"] = Button;
@@ -1,32 +1,37 @@
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
- Object.defineProperty(exports, "__esModule", {
5
+ _Object$defineProperty(exports, "__esModule", {
5
6
  value: true
6
7
  });
7
- exports.default = exports.ButtonRefreshed = void 0;
8
+ exports["default"] = exports.ButtonRefreshed = void 0;
9
+ var _bind = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/bind"));
8
10
  var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
11
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
9
12
  var _react = _interopRequireDefault(require("react"));
10
13
  var _Button = _interopRequireDefault(require("./Button"));
11
14
  var _storyAid = require("../storyAid");
12
- var _default = exports.default = {
15
+ var _excluded = ["showLeftElement", "showRightElement"];
16
+ var _default = exports["default"] = {
13
17
  title: 'v2/RefreshedInputs',
14
- component: _Button.default,
18
+ component: _Button["default"],
15
19
  parameters: {
16
20
  importBy: 'RefreshedInput',
17
21
  removeBaseHtmlClass: true,
18
22
  chakraLink: 'https://chakra-ui.com/docs/components/input'
19
23
  }
20
24
  };
21
- const ButtonRefreshedTemplate = ({
22
- showLeftElement,
23
- showRightElement,
24
- ...props
25
- }) => /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, props, {
26
- leftElement: showLeftElement && /*#__PURE__*/_react.default.createElement(_storyAid.LeftElement, null),
27
- rightElement: showRightElement && /*#__PURE__*/_react.default.createElement(_storyAid.RightElement, null)
28
- }));
29
- const ButtonRefreshed = exports.ButtonRefreshed = ButtonRefreshedTemplate.bind({});
25
+ var ButtonRefreshedTemplate = function ButtonRefreshedTemplate(_ref) {
26
+ var showLeftElement = _ref.showLeftElement,
27
+ showRightElement = _ref.showRightElement,
28
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
29
+ return /*#__PURE__*/_react["default"].createElement(_Button["default"], (0, _extends2["default"])({}, props, {
30
+ leftElement: showLeftElement && /*#__PURE__*/_react["default"].createElement(_storyAid.LeftElement, null),
31
+ rightElement: showRightElement && /*#__PURE__*/_react["default"].createElement(_storyAid.RightElement, null)
32
+ }));
33
+ };
34
+ var ButtonRefreshed = exports.ButtonRefreshed = (0, _bind["default"])(ButtonRefreshedTemplate).call(ButtonRefreshedTemplate, {});
30
35
  ButtonRefreshed.argTypes = {
31
36
  placeholder: {
32
37
  control: {
@@ -49,8 +54,9 @@ ButtonRefreshed.argTypes = {
49
54
  }
50
55
  },
51
56
  buttonValue: {
52
- control: 'select',
53
- options: ['I\'m the button value', null]
57
+ control: {
58
+ type: 'text'
59
+ }
54
60
  },
55
61
  showLeftElement: {
56
62
  control: {
@@ -73,7 +79,7 @@ ButtonRefreshed.args = {
73
79
  isDisabled: false,
74
80
  isReadOnly: false,
75
81
  isRequired: false,
76
- buttonValue: null,
82
+ buttonValue: 'This is a button',
77
83
  showLeftElement: false,
78
84
  showRightElement: false
79
85
  };
@@ -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
- Object.defineProperty(exports, "__esModule", {
5
+ _Object$defineProperty(exports, "__esModule", {
5
6
  value: true
6
7
  });
7
- Object.defineProperty(exports, "default", {
8
+ _Object$defineProperty(exports, "default", {
8
9
  enumerable: true,
9
- get: function () {
10
- return _Button.default;
10
+ get: function get() {
11
+ return _Button["default"];
11
12
  }
12
13
  });
13
14
  var _Button = _interopRequireDefault(require("./Button"));
@@ -1,25 +1,35 @@
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
- Object.defineProperty(exports, "__esModule", {
12
+ _Object$defineProperty(exports, "__esModule", {
5
13
  value: true
6
14
  });
7
- exports.default = void 0;
15
+ exports["default"] = void 0;
16
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
8
17
  var _merge = _interopRequireDefault(require("lodash/merge"));
9
18
  var _Button = _interopRequireDefault(require("../../../Button/Button.styles"));
10
19
  var _styles = _interopRequireDefault(require("../../../Input/styles"));
11
- const variants = {
12
- refreshed: {
13
- // ...inputStyles.baseStyles.field,
14
- ..._styles.default.variants.outline.field,
15
- height: '62px',
20
+ 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; }
21
+ 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; }
22
+ var variants = {
23
+ refreshed: _objectSpread(_objectSpread({}, _styles["default"].variants.outline.field), {}, {
24
+ lineHeight: "6",
16
25
  width: "100%",
17
- paddingTop: 6,
26
+ paddingTop: 5.5,
18
27
  paddingBottom: 3,
19
28
  borderRadius: 'md',
20
- justifyContent: 'flex-start'
21
- }
29
+ justifyContent: 'flex-start',
30
+ minHeight: "14"
31
+ })
22
32
  };
23
- var _default = exports.default = (0, _merge.default)(_Button.default, {
24
- variants
33
+ var _default = exports["default"] = (0, _merge["default"])(_Button["default"], {
34
+ variants: variants
25
35
  });
@@ -1,41 +1,60 @@
1
1
  "use strict";
2
2
 
3
+ var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
4
+ var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
5
+ var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
6
+ var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
7
+ var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
8
+ var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
9
+ var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
10
+ var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
11
+ var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
12
+ var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
3
13
  var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
14
+ _Object$defineProperty(exports, "__esModule", {
5
15
  value: true
6
16
  });
7
- exports.default = void 0;
17
+ exports["default"] = void 0;
8
18
  var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
19
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
20
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
9
21
  var _react = _interopRequireWildcard(require("react"));
10
22
  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; }
23
+ var _excluded = ["label", "helperText", "errorMessage", "id", "children", "rightElement", "leftElement", "rightElementStyles", "leftElementStyles"];
24
+ 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); }
25
+ 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; }
26
+ 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; }
27
+ 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; }
13
28
  // No clue how to move these into the style file so just co-located to keep from slowing down
14
29
  // Chakra V2 will heavily impact this component
15
- const labelStyle = {
30
+ var labelStyle = {
16
31
  color: 'gray.600',
17
32
  fontWeight: 'normal',
18
- top: 2,
33
+ height: '100%',
34
+ display: 'flex',
35
+ alignItems: 'center',
36
+ top: 0,
19
37
  left: 0,
20
38
  position: 'absolute',
21
39
  pointerEvents: 'none',
22
40
  padding: 'inherit',
23
41
  paddingLeft: 3,
24
- marginY: 2,
25
42
  transformOrigin: 'left top',
26
43
  // below is from chakra v2 that I'm pulling in
27
44
  transitionProperty: 'scale translate',
28
45
  transitionDuration: '200ms'
29
46
  };
30
- const activeLabelStyles = {
31
- transform: 'scale(0.85) translateY(-.75rem) translateX(.2rem)',
47
+ var activeLabelStyles = {
48
+ fontSize: '0.85em',
49
+ transform: 'translateY(-.75rem)',
32
50
  _invalid: {
51
+ color: 'error',
33
52
  '& .chakra-form__required-indicator': {
34
53
  display: 'none'
35
54
  }
36
55
  }
37
56
  };
38
- const controlStyles = {
57
+ var controlStyles = {
39
58
  position: 'relative',
40
59
  borderWidth: '0',
41
60
  sx: {
@@ -43,7 +62,7 @@ const controlStyles = {
43
62
  input: {
44
63
  '&::placeholder': {
45
64
  // below is from chakra v2 that I'm pulling in
46
- transitionProperty: 'opacity',
65
+ transitionProperty: 'opacity scale translate',
47
66
  transitionDuration: '200ms',
48
67
  opacity: 0
49
68
  },
@@ -57,7 +76,7 @@ const controlStyles = {
57
76
  },
58
77
  '& + label': {
59
78
  color: 'error',
60
- transform: 'scale(0.85) translateY(-16px)'
79
+ transform: 'translateY(-16px)'
61
80
  },
62
81
  '& + label .chakra-form__required-indicator': {
63
82
  //Styling for asterisk always to be red if invalid
@@ -69,9 +88,7 @@ const controlStyles = {
69
88
  }
70
89
  },
71
90
  // styles used for when we extend functionality - textarea:not(:placeholder-shown) ~ label
72
- 'input:not(:placeholder-shown) + label, .chakra-select__wrapper + label': {
73
- ...activeLabelStyles
74
- },
91
+ 'input:not(:placeholder-shown) + label, .chakra-select__wrapper + label': _objectSpread({}, activeLabelStyles),
75
92
  // should be a cleaner way of doing this
76
93
  '.chakra-input__group > .chakra-input__left-element ~ span input': {
77
94
  paddingLeft: 10,
@@ -87,31 +104,23 @@ const controlStyles = {
87
104
  },
88
105
  '.chakra-input__group > .chakra-input__left-element ~ span label': {
89
106
  // transform: 'scale(0.85) translateY(-1rem) translateX(.5rem)',
90
- paddingLeft: '2.75rem'
107
+ paddingLeft: '2.5rem'
91
108
  },
92
109
  // Styling for select
93
- '.chakra-select__wrapper + label': {
94
- ...activeLabelStyles,
95
- transform: 'scale(0.85) translateY(-.75rem) translateX(.25rem)'
96
- },
97
- 'button[data-value] + label': {
98
- ...activeLabelStyles
99
- },
110
+ '.chakra-select__wrapper + label': _objectSpread({}, activeLabelStyles),
100
111
  '.FormElement-contains-error': {
101
112
  borderColor: 'error'
102
113
  },
103
- '.chakra-button + label': {
114
+ '.chakra-button + label': _objectSpread(_objectSpread({}, activeLabelStyles), {}, {
104
115
  display: 'flex',
105
116
  alignItems: 'center',
106
- height: '100%',
107
- top: 0,
108
- margin: 0
109
- }
117
+ margin: 0,
118
+ marginLeft: '1px'
119
+ // marginTop: 2
120
+ })
110
121
  },
111
122
  _focusWithin: {
112
- label: {
113
- ...activeLabelStyles
114
- },
123
+ label: _objectSpread({}, activeLabelStyles),
115
124
  input: {
116
125
  '&::placeholder': {
117
126
  opacity: '1'
@@ -125,43 +134,43 @@ const controlStyles = {
125
134
  * This formControl allows us to standardize the label movement animation as well as the left/right icons
126
135
  * Can be used solo but typically will be used by the Refreshed components themselves
127
136
  */
128
- const FormControl = /*#__PURE__*/(0, _react.forwardRef)(({
129
- label,
130
- helperText,
131
- errorMessage,
132
- id = '',
133
- children,
134
- rightElement,
135
- leftElement,
136
- rightElementStyles,
137
- leftElementStyles,
138
- ...props
139
- }, ref) => {
140
- return /*#__PURE__*/_react.default.createElement(_react2.FormControl, (0, _extends2.default)({}, props, {
137
+ var FormControl = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
138
+ var label = _ref.label,
139
+ helperText = _ref.helperText,
140
+ errorMessage = _ref.errorMessage,
141
+ _ref$id = _ref.id,
142
+ id = _ref$id === void 0 ? '' : _ref$id,
143
+ children = _ref.children,
144
+ rightElement = _ref.rightElement,
145
+ leftElement = _ref.leftElement,
146
+ rightElementStyles = _ref.rightElementStyles,
147
+ leftElementStyles = _ref.leftElementStyles,
148
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
149
+ return /*#__PURE__*/_react["default"].createElement(_react2.FormControl, (0, _extends2["default"])({}, props, {
141
150
  ref: ref
142
- }, controlStyles), /*#__PURE__*/_react.default.createElement(_react2.InputGroup, null, leftElement && /*#__PURE__*/_react.default.createElement(_react2.InputLeftElement, (0, _extends2.default)({
151
+ }, controlStyles), /*#__PURE__*/_react["default"].createElement(_react2.InputGroup, null, leftElement && /*#__PURE__*/_react["default"].createElement(_react2.InputLeftElement, (0, _extends2["default"])({
143
152
  pointerEvents: "none",
144
153
  top: "52%",
145
154
  left: "1.3rem",
146
155
  transform: "translate(-50%,-50%)"
147
- }, leftElementStyles), leftElement), /*#__PURE__*/_react.default.createElement(_react2.Box, {
156
+ }, leftElementStyles), leftElement), /*#__PURE__*/_react["default"].createElement(_react2.Box, {
148
157
  as: "span",
149
158
  width: "100%",
150
159
  position: "relative"
151
- }, children, label && /*#__PURE__*/_react.default.createElement(_react2.FormLabel, {
160
+ }, children, label && /*#__PURE__*/_react["default"].createElement(_react2.FormLabel, {
152
161
  htmlFor: id
153
- }, label)), rightElement && /*#__PURE__*/_react.default.createElement(_react2.InputRightElement, (0, _extends2.default)({
162
+ }, label)), rightElement && /*#__PURE__*/_react["default"].createElement(_react2.InputRightElement, (0, _extends2["default"])({
154
163
  top: "50%",
155
164
  right: "-1rem",
156
165
  transform: "translate(-50%,-50%)"
157
- }, rightElementStyles), rightElement)), helperText && /*#__PURE__*/_react.default.createElement(_react2.FormHelperText, {
166
+ }, rightElementStyles), rightElement)), helperText && /*#__PURE__*/_react["default"].createElement(_react2.FormHelperText, {
158
167
  color: "gray.600",
159
168
  marginTop: 1,
160
169
  fontSize: "xs"
161
- }, helperText), /*#__PURE__*/_react.default.createElement(_react2.FormErrorMessage, {
170
+ }, helperText), /*#__PURE__*/_react["default"].createElement(_react2.FormErrorMessage, {
162
171
  color: "error",
163
172
  marginTop: 1,
164
173
  fontSize: "xs"
165
174
  }, errorMessage));
166
175
  });
167
- var _default = exports.default = FormControl;
176
+ var _default = exports["default"] = FormControl;
@@ -1,41 +1,47 @@
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
- Object.defineProperty(exports, "__esModule", {
8
+ _Object$defineProperty(exports, "__esModule", {
5
9
  value: true
6
10
  });
7
- exports.default = void 0;
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 _classnames = _interopRequireDefault(require("classnames"));
11
16
  var _FormControl = _interopRequireDefault(require("../FormControl"));
12
17
  var _react2 = require("@chakra-ui/react");
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; }
18
+ var _excluded = ["label", "helperText", "errorMessage", "isInvalid", "isDisabled", "isRequired", "rightElement", "leftElement", "rightElementStyles", "leftElementStyles", "placeholder"];
19
+ 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); }
20
+ 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
21
  /**
16
22
  * A component used in the homepage/midfunnel refresh of 2024
17
23
  * Initially built as purpose built as possible with hopes of extending it to other systems
18
24
  * using `<RefreshedInput/>` will bring in the core of this.
19
25
  */
20
- const Input = /*#__PURE__*/(0, _react.forwardRef)(({
21
- label,
22
- helperText,
23
- errorMessage,
24
- isInvalid,
25
- isDisabled,
26
- isRequired,
27
- rightElement,
28
- leftElement,
29
- rightElementStyles,
30
- leftElementStyles,
31
- placeholder = '',
32
- ...props
33
- }, ref) => {
34
- const classes = (0, _classnames.default)({
26
+ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
27
+ var label = _ref.label,
28
+ helperText = _ref.helperText,
29
+ errorMessage = _ref.errorMessage,
30
+ isInvalid = _ref.isInvalid,
31
+ isDisabled = _ref.isDisabled,
32
+ isRequired = _ref.isRequired,
33
+ rightElement = _ref.rightElement,
34
+ leftElement = _ref.leftElement,
35
+ rightElementStyles = _ref.rightElementStyles,
36
+ leftElementStyles = _ref.leftElementStyles,
37
+ _ref$placeholder = _ref.placeholder,
38
+ placeholder = _ref$placeholder === void 0 ? ' ' : _ref$placeholder,
39
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
40
+ var classes = (0, _classnames["default"])({
35
41
  'FormElement-contains-error': isInvalid
36
42
  }); //Historic carry over
37
43
 
38
- return /*#__PURE__*/_react.default.createElement(_FormControl.default, {
44
+ return /*#__PURE__*/_react["default"].createElement(_FormControl["default"], {
39
45
  isInvalid: isInvalid,
40
46
  isDisabled: isDisabled,
41
47
  isRequired: isRequired,
@@ -48,7 +54,7 @@ const Input = /*#__PURE__*/(0, _react.forwardRef)(({
48
54
  rightElementStyles: rightElementStyles,
49
55
  leftElementStyles: leftElementStyles,
50
56
  variant: "refreshed"
51
- }, /*#__PURE__*/_react.default.createElement(_react2.Input, (0, _extends2.default)({
57
+ }, /*#__PURE__*/_react["default"].createElement(_react2.Input, (0, _extends2["default"])({
52
58
  placeholder: placeholder,
53
59
  ref: ref,
54
60
  className: classes,
@@ -58,4 +64,4 @@ const Input = /*#__PURE__*/(0, _react.forwardRef)(({
58
64
  variant: "refreshed"
59
65
  }, props)));
60
66
  });
61
- var _default = exports.default = Input;
67
+ var _default = exports["default"] = Input;