@spothero/ui 17.0.3 → 17.1.0-beta.3

package/dist/components/Datepicker/common/utils/sharedPropTypes.js

@@ -0,0 +1,147 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.inputComponentOverridesProps = exports.datepickerHeaderOverridesProps = exports.datepickerDaysOverridesProps = exports.datepickerBodyOverridesProps = exports.dateRowOverridesProps = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var inputComponentOverridesProps = _propTypes.default.shape({
+  /**
+   * Overrides for the parent Box component that wraps the Inputs and Form control,
+   * see https://chakra-ui.com/docs/components/box/usage for more
+   */
+  inputGroupContainer: _propTypes.default.object,
+
+  /**
+   * Overrides for the parent FormControl component,
+   * see https://chakra-ui.com/docs/components/form-control/props for more
+   */
+  formControl: _propTypes.default.object,
+
+  /**
+   * Overrides for the FormLabel component,
+   * see https://chakra-ui.com/docs/components/form-control/props and/or https://chakra-ui.com/docs/components/form-control/usage for more
+   */
+  formLabel: _propTypes.default.object,
+
+  /**
+   * Overrides for the InputGroup component,
+   * see https://chakra-ui.com/docs/components/input/usage#left-and-right-addons for more
+   */
+  inputGroup: _propTypes.default.object,
+
+  /**
+   * Overrides for the Input component,
+   * see https://chakra-ui.com/docs/components/input/props for more
+   */
+  input: _propTypes.default.object,
+
+  /**
+   * Overrides for the InputRightElement component,
+   * see https://chakra-ui.com/docs/components/input/usage#add-elements-inside-input for more
+   */
+  inputRightElement: _propTypes.default.object,
+
+  /**
+   * Overrides for the FormControl ErrorMessage component,
+   * see https://chakra-ui.com/docs/components/form-control/usage#error-message for more
+   */
+  formErrorMessage: _propTypes.default.object
+});
+
+exports.inputComponentOverridesProps = inputComponentOverridesProps;
+
+var datepickerHeaderOverridesProps = _propTypes.default.shape({
+  /**
+   * Overrides for the Flex component that wraps the Header Title and navigation Buttons,
+   * see https://chakra-ui.com/docs/components/flex/props for more
+   */
+  headerContainer: _propTypes.default.object,
+
+  /**
+   * Overrides for the IconButton component used as navigation for the Header,
+   * see https://chakra-ui.com/docs/components/icon-button, for more
+   */
+  iconButton: _propTypes.default.object,
+
+  /**
+   * Overrides for the Flex component that wraps the Header Title,
+   * see https://chakra-ui.com/docs/components/flex/props for more
+   */
+  title: _propTypes.default.object
+});
+
+exports.datepickerHeaderOverridesProps = datepickerHeaderOverridesProps;
+
+var dateRowOverridesProps = _propTypes.default.shape({
+  /**
+   * Overrides for the Tbody component that contains the Calendar display
+   * see https://chakra-ui.com/docs/components/table/props for more
+   */
+  tbody: _propTypes.default.object,
+
+  /**
+   * Overrides for the Tr component that contains the rows of the month within the Calendar display
+   * see https://chakra-ui.com/docs/components/table/props for more
+   */
+  tr: _propTypes.default.object,
+
+  /**
+   * Overrides for the Td component that contains the individual date within the Calendar display
+   * see https://chakra-ui.com/docs/components/table/props for more
+   */
+  td: _propTypes.default.object,
+
+  /**
+   * Overrides for the Button component that contains the individual date within the Calendar display
+   * see https://chakra-ui.com/docs/components/button/props for more
+   */
+  button: _propTypes.default.object
+});
+
+exports.dateRowOverridesProps = dateRowOverridesProps;
+
+var datepickerDaysOverridesProps = _propTypes.default.shape({
+  /**
+   * Overrides for the Table component containing the Calendar display,
+   * see https://chakra-ui.com/docs/components/table/props#table for more
+   */
+  table: _propTypes.default.object,
+
+  /**
+   * Overrides for the Thead component containing the names of the days of the week,
+   * see https://chakra-ui.com/docs/components/table/props for more
+   */
+  thead: _propTypes.default.object,
+
+  /**
+   * Overrides for the Th component containing the name of the single day names,
+   * see https://chakra-ui.com/docs/components/table/props for more
+   */
+  th: _propTypes.default.object,
+
+  /** An optional Object containing style and prop overrides for the DateRow component */
+  dateRowOverrides: dateRowOverridesProps
+});
+
+exports.datepickerDaysOverridesProps = datepickerDaysOverridesProps;
+
+var datepickerBodyOverridesProps = _propTypes.default.shape({
+  /**
+   * Overrides for the PopoverBody component,
+   * see https://chakra-ui.com/docs/components/popover/props#other-props for more
+   */
+  popoverBody: _propTypes.default.object,
+
+  /** An optional Object containing style and prop overrides to be applied to the components that compose the Header section */
+  datepickerHeaderOverrides: datepickerHeaderOverridesProps,
+
+  /** An optional Object containing style and prop overrides to be applied to the components that compose the Calendar section */
+  datepickerDaysOverrides: datepickerDaysOverridesProps
+});
+
+exports.datepickerBodyOverridesProps = datepickerBodyOverridesProps;

package/dist/components/Datepicker/index.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "DatepickerRange", {
+  enumerable: true,
+  get: function get() {
+    return _DatepickerRange.default;
+  }
+});
+Object.defineProperty(exports, "DatepickerSingle", {
+  enumerable: true,
+  get: function get() {
+    return _DatepickerSingle.default;
+  }
+});
+
+var _DatepickerRange = _interopRequireDefault(require("./Range/DatepickerRange"));
+
+var _DatepickerSingle = _interopRequireDefault(require("./Single/DatepickerSingle"));

package/dist/components/Divider/Divider.js

@@ -1,22 +1,38 @@
 "use strict";
 
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _react2 = require("@chakra-ui/react");
+
 var _Divider = require("./Divider.styles");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const Divider = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    variant,
-    colorScheme: borderColor,
-    ...props
-  } = _ref;
+
+var _excluded = ["variant", "colorScheme"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var Divider = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var variant = _ref.variant,
+      borderColor = _ref.colorScheme,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_react2.Divider, (0, _extends2.default)({}, _Divider.colorScheme[borderColor], {
     variant: variant
   }, props, {

package/dist/components/Divider/Divider.stories.js

@@ -1,14 +1,22 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Divider = void 0;
+
+var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
+
 var _react = _interopRequireDefault(require("react"));
+
 var _Divider = require("./Divider.styles");
+
 var _Divider2 = _interopRequireDefault(require("./Divider"));
+
 var _react2 = require("@chakra-ui/react");
+
 var _default = {
   title: 'v2/Divider',
   component: _Divider2.default,
@@ -16,7 +24,7 @@ var _default = {
     colorScheme: {
       control: {
         type: 'select',
-        options: Object.keys(_Divider.colorScheme)
+        options: (0, _keys.default)(_Divider.colorScheme)
       }
     },
     variant: {
@@ -28,8 +36,12 @@ var _default = {
   }
 };
 exports.default = _default;
-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"));
-const Divider = Template.bind({});
+
+var Template = function Template(props) {
+  return /*#__PURE__*/_react.default.createElement(_react2.Box, null, /*#__PURE__*/_react.default.createElement(_react2.Text, null, "Over HowdyHowdyHowdy"), /*#__PURE__*/_react.default.createElement(_Divider2.default, props), /*#__PURE__*/_react.default.createElement(_react2.Text, null, "Under HowdyHowdyHowdy"));
+};
+
+var Divider = Template.bind({});
 exports.Divider = Divider;
 Divider.args = {
   variant: 'solid',

package/dist/components/Divider/Divider.styles.js

@@ -1,13 +1,17 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.colorScheme = void 0;
+
 var _merge = _interopRequireDefault(require("lodash/merge"));
+
 var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
-const colorScheme = {
+
+var colorScheme = {
   low: {
     borderColor: 'gray.100'
   },
@@ -16,7 +20,9 @@ const colorScheme = {
   }
 };
 exports.colorScheme = colorScheme;
+
 var _default = (0, _merge.default)(_theme.default.components.Divider, {
-  colorScheme
+  colorScheme: colorScheme
 });
+
 exports.default = _default;

package/dist/components/FormControl/FormControl.js

@@ -1,27 +1,42 @@
 "use strict";
 
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _react2 = require("@chakra-ui/react");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const FormControl = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    children,
-    label,
-    inputId,
-    helperText,
-    errorMessage,
-    isFieldset,
-    isOptional,
-    ...props
-  } = _ref;
+
+var _excluded = ["children", "label", "inputId", "helperText", "errorMessage", "isFieldset"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var FormControl = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var children = _ref.children,
+      label = _ref.label,
+      inputId = _ref.inputId,
+      helperText = _ref.helperText,
+      errorMessage = _ref.errorMessage,
+      isFieldset = _ref.isFieldset,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_react2.FormControl, (0, _extends2.default)({}, props, {
     ref: ref,
     as: isFieldset ? 'fieldset' : 'div',
@@ -34,7 +49,7 @@ const FormControl = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     htmlFor: inputId,
     as: isFieldset ? 'legend' : 'label',
     requiredIndicator: "",
-    optionalIndicator: isOptional && !(props !== null && props !== void 0 && props.isRequired) ? /*#__PURE__*/_react.default.createElement(_react2.Text, {
+    optionalIndicator: props !== null && props !== void 0 && props.isOptional && !(props !== null && props !== void 0 && props.isRequired) ? /*#__PURE__*/_react.default.createElement(_react2.Text, {
       marginLeft: 1,
       as: "span",
       variant: "caption",

package/dist/components/Grid/Grid.js

@@ -1,22 +1,39 @@
 "use strict";
 
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _react2 = require("@chakra-ui/react");
+
 var _Grid = require("./Grid.styles");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const Grid = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    isCompact,
-    ...props
-  } = _ref;
+
+var _excluded = ["isCompact"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var Grid = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var isCompact = _ref.isCompact,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_react2.Grid, (0, _extends2.default)({}, _Grid.baseStyles, isCompact && _Grid.compactStyles, props, {
     ref: ref
   }));

package/dist/components/Grid/Grid.stories.js

@@ -1,27 +1,43 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.GridItemStartEnd = exports.GridItemSpan = exports.GridColumnLayout = exports.Grid = void 0;
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _fill = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/fill"));
+
 var _react = _interopRequireDefault(require("react"));
+
 var _react2 = require("@chakra-ui/react");
+
 var _Grid = _interopRequireDefault(require("./Grid"));
+
 var _ = require("./..");
-const rangeControl = function (max) {
-  let min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
+
+var _excluded = ["isCompact"];
+
+var rangeControl = function rangeControl(max) {
+  var min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
   return {
     control: {
-      max,
-      min,
+      max: max,
+      min: min,
       step: 1,
       type: 'range'
     }
   };
 };
-const spanMap = {
+
+var spanMap = {
   1: 12,
   2: 6,
   3: 4,
@@ -43,27 +59,30 @@ var _default = {
   }
 };
 exports.default = _default;
-const GridTemplate = (args, _ref) => {
-  let {
-    hasDarkBackground
-  } = _ref;
+
+var GridTemplate = function GridTemplate(args, _ref) {
+  var _context, _context2;
+
+  var hasDarkBackground = _ref.hasDarkBackground;
   return /*#__PURE__*/_react.default.createElement(_.Container, null, /*#__PURE__*/_react.default.createElement(_Grid.default, (0, _extends2.default)({}, args, {
     bg: hasDarkBackground ? 'secondary.700' : 'secondary.default'
-  }), Array(12).fill(null).map((Item, index) => /*#__PURE__*/_react.default.createElement(_.GridItem, {
-    key: `GridItem-${index}`,
-    colSpan: 1
-  }, /*#__PURE__*/_react.default.createElement(_react2.Box, {
-    h: "20rem",
-    bg: hasDarkBackground ? 'primary.400' : 'primary.default'
-  })))));
+  }), (0, _map.default)(_context = (0, _fill.default)(_context2 = Array(12)).call(_context2, null)).call(_context, function (Item, index) {
+    return /*#__PURE__*/_react.default.createElement(_.GridItem, {
+      key: "GridItem-".concat(index),
+      colSpan: 1
+    }, /*#__PURE__*/_react.default.createElement(_react2.Box, {
+      h: "20rem",
+      bg: hasDarkBackground ? 'primary.400' : 'primary.default'
+    }));
+  })));
 };
-const Grid = GridTemplate.bind({});
+
+var Grid = GridTemplate.bind({});
 exports.Grid = Grid;
-const GridItemTemplate = _ref2 => {
-  let {
-    isCompact,
-    ...args
-  } = _ref2;
+
+var GridItemTemplate = function GridItemTemplate(_ref2) {
+  var isCompact = _ref2.isCompact,
+      args = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   return /*#__PURE__*/_react.default.createElement(_.Container, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
     bg: "secondary.default",
     isCompact: isCompact
@@ -72,7 +91,8 @@ const GridItemTemplate = _ref2 => {
     bg: "primary.default"
   }))));
 };
-const GridItemSpan = GridItemTemplate.bind({});
+
+var GridItemSpan = GridItemTemplate.bind({});
 exports.GridItemSpan = GridItemSpan;
 GridItemSpan.storyName = 'GridItem - span prop';
 GridItemSpan.argTypes = {
@@ -81,7 +101,7 @@ GridItemSpan.argTypes = {
 GridItemSpan.args = {
   colSpan: 12
 };
-const GridItemStartEnd = GridItemTemplate.bind({});
+var GridItemStartEnd = GridItemTemplate.bind({});
 exports.GridItemStartEnd = GridItemStartEnd;
 GridItemStartEnd.storyName = 'GridItem - start/end prop';
 GridItemStartEnd.argTypes = {
@@ -92,21 +112,25 @@ GridItemStartEnd.args = {
   colStart: 1,
   colEnd: 2
 };
-const ColumnLayoutTemplate = _ref3 => {
-  let {
-    numberOfColumns
-  } = _ref3;
+
+var ColumnLayoutTemplate = function ColumnLayoutTemplate(_ref3) {
+  var _context3, _context4;
+
+  var numberOfColumns = _ref3.numberOfColumns;
   return /*#__PURE__*/_react.default.createElement(_.Container, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
     bg: "secondary.default"
-  }, Array(numberOfColumns).fill(null).map((item, index) => /*#__PURE__*/_react.default.createElement(_.GridItem, {
-    key: `GridItem-${index}`,
-    colSpan: spanMap[numberOfColumns]
-  }, /*#__PURE__*/_react.default.createElement(_react2.Box, {
-    h: "20rem",
-    bg: "primary.default"
-  })))));
+  }, (0, _map.default)(_context3 = (0, _fill.default)(_context4 = Array(numberOfColumns)).call(_context4, null)).call(_context3, function (item, index) {
+    return /*#__PURE__*/_react.default.createElement(_.GridItem, {
+      key: "GridItem-".concat(index),
+      colSpan: spanMap[numberOfColumns]
+    }, /*#__PURE__*/_react.default.createElement(_react2.Box, {
+      h: "20rem",
+      bg: "primary.default"
+    }));
+  })));
 };
-const GridColumnLayout = ColumnLayoutTemplate.bind({});
+
+var GridColumnLayout = ColumnLayoutTemplate.bind({});
 exports.GridColumnLayout = GridColumnLayout;
 GridColumnLayout.storyName = 'Grid - MultiColumn Layout';
 GridColumnLayout.argTypes = {

package/dist/components/Grid/Grid.styles.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.compactStyles = exports.baseStyles = void 0;
 // NOTE: considering adding a specifc prop for grid row padding
-const baseStyles = {
+var baseStyles = {
   gap: {
     base: 4,
     tablet: 8
@@ -13,7 +13,7 @@ const baseStyles = {
   templateColumns: 'repeat(12, 1fr)'
 };
 exports.baseStyles = baseStyles;
-const compactStyles = {
+var compactStyles = {
   gap: 4
 };
 exports.compactStyles = compactStyles;

package/dist/components/Grid/GridItem.js

@@ -1,18 +1,34 @@
 "use strict";
 
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _react2 = require("@chakra-ui/react");
+
 var _GridItem = _interopRequireDefault(require("./GridItem.styles"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const GridItem = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => /*#__PURE__*/_react.default.createElement(_react2.GridItem, (0, _extends2.default)({}, _GridItem.default, props, {
-  ref: ref
-})));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var GridItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+  return /*#__PURE__*/_react.default.createElement(_react2.GridItem, (0, _extends2.default)({}, _GridItem.default, props, {
+    ref: ref
+  }));
+});
 var _default = GridItem;
 exports.default = _default;

package/dist/components/Grid/GridItem.styles.js

@@ -6,8 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 // NOTE: styles NOT in the Chakra's base styles do not need to explicitly export baseStyles
 // TODO: move this comment to the readme
-
-const styles = {
+var styles = {
   colSpan: 12
 };
 var _default = styles;