baseui 12.2.0 → 13.0.0

package/esm/file-uploader/file-uploader.js

@@ -40,8 +40,10 @@ import { ProgressBar } from '../progress-bar';
 import { Spinner, SIZE as SPINNER_SIZE } from '../spinner';
 import { StyledRoot, StyledFileDragAndDrop, StyledContentMessage, StyledContentSeparator, StyledErrorMessage, StyledHiddenInput } from './styled-components';
 
+// @ts-ignore
 function prependStyleProps(styleProps) {
   return Object.keys(styleProps).reduce(function (nextStyleProps, currentKey) {
+    // @ts-ignore
     nextStyleProps["$".concat(currentKey)] = styleProps[currentKey];
     return nextStyleProps;
   }, {});
@@ -111,99 +113,107 @@ function FileUploader(props) {
       progressBarProps = _getOverrides22[1];
 
   var afterFileDrop = !!(props.progressAmount || props.progressMessage || props.errorMessage);
-  return (
-    /*#__PURE__*/
-    // @ts-expect-error todo(flow->ts): dropzone api
-    React.createElement(Dropzone, _extends({}, props, {
-      disabled: props.disabled || afterFileDrop
-    }), function (renderProps) {
-      var getRootProps = renderProps.getRootProps,
-          getInputProps = renderProps.getInputProps,
-          open = renderProps.open,
-          styleProps = _objectWithoutProperties(renderProps, _excluded);
-
-      var prefixedStyledProps = prependStyleProps(_objectSpread(_objectSpread({}, styleProps), {}, {
-        isDisabled: props.disabled,
-        afterFileDrop: afterFileDrop
-      }));
-
-      var getRootPropsArgs = _objectSpread(_objectSpread({}, props.disableClick ? {
-        onClick: function onClick(evt) {
-          return evt.preventDefault();
-        }
-      } : {}), {}, {
-        tabIndex: -1
-      });
-
-      return /*#__PURE__*/React.createElement(LocaleContext.Consumer, null, function (locale) {
-        return /*#__PURE__*/React.createElement(Root, _extends({
-          "data-baseweb": "file-uploader"
-        }, prefixedStyledProps, rootProps), /*#__PURE__*/React.createElement(FileDragAndDrop, _extends({}, getRootProps(getRootPropsArgs), prefixedStyledProps, fileDragAndDropProps), !afterFileDrop && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ContentMessage, _extends({}, prefixedStyledProps, contentMessageProps), locale.fileuploader.dropFilesToUpload), /*#__PURE__*/React.createElement(ContentSeparator, _extends({}, prefixedStyledProps, contentSeparatorProps), locale.fileuploader.or), /*#__PURE__*/React.createElement(ButtonComponent, _extends({
-          disabled: props.disabled,
-          kind: KIND.secondary,
-          shape: SHAPE.pill,
-          size: BUTTON_SIZE.compact,
-          onClick: open,
-          role: "button",
-          overrides: {
-            BaseButton: {
-              style: function style(_ref) {
-                var $theme = _ref.$theme;
-                return {
-                  marginTop: $theme.sizing.scale500
-                };
-              }
+  var accept;
+
+  if (Array.isArray(props.accept)) {
+    accept = props.accept.join(',');
+  } else if (typeof props.accept === 'string') {
+    accept = props.accept;
+  }
+
+  return /*#__PURE__*/React.createElement(Dropzone, _extends({}, props, {
+    accept: accept,
+    disabled: props.disabled || afterFileDrop
+  }), function (renderProps) {
+    var getRootProps = renderProps.getRootProps,
+        getInputProps = renderProps.getInputProps,
+        open = renderProps.open,
+        styleProps = _objectWithoutProperties(renderProps, _excluded);
+
+    var prefixedStyledProps = prependStyleProps(_objectSpread(_objectSpread({}, styleProps), {}, {
+      isDisabled: props.disabled,
+      afterFileDrop: afterFileDrop
+    }));
+
+    var getRootPropsArgs = _objectSpread(_objectSpread({}, props.disableClick ? {
+      onClick: function onClick(evt) {
+        return evt.preventDefault();
+      }
+    } : {}), {}, {
+      tabIndex: -1
+    });
+
+    return /*#__PURE__*/React.createElement(LocaleContext.Consumer, null, function (locale) {
+      return /*#__PURE__*/React.createElement(Root, _extends({
+        "data-baseweb": "file-uploader"
+      }, prefixedStyledProps, rootProps), /*#__PURE__*/React.createElement(FileDragAndDrop, _extends({}, getRootProps(getRootPropsArgs), prefixedStyledProps, fileDragAndDropProps), !afterFileDrop && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ContentMessage, _extends({}, prefixedStyledProps, contentMessageProps), locale.fileuploader.dropFilesToUpload), /*#__PURE__*/React.createElement(ContentSeparator, _extends({}, prefixedStyledProps, contentSeparatorProps), locale.fileuploader.or), /*#__PURE__*/React.createElement(ButtonComponent, _extends({
+        disabled: props.disabled,
+        kind: KIND.secondary,
+        shape: SHAPE.pill,
+        size: BUTTON_SIZE.compact,
+        onClick: open,
+        role: "button",
+        overrides: {
+          BaseButton: {
+            // @ts-ignore
+            style: function style(_ref) {
+              var $theme = _ref.$theme;
+              return {
+                marginTop: $theme.sizing.scale500
+              };
             }
           }
-        }, prefixedStyledProps, buttonProps), locale.fileuploader.browseFiles)), afterFileDrop && /*#__PURE__*/React.createElement(React.Fragment, null, typeof props.progressAmount === 'number' ? /*#__PURE__*/React.createElement(ProgressBarComponent, _extends({
-          value: props.progressAmount,
-          overrides: {
-            BarProgress: {
-              style: function style(_ref2) {
-                var $theme = _ref2.$theme;
-                return {
-                  backgroundColor: props.errorMessage ? $theme.colors.negative : $theme.colors.accent
-                };
-              }
+        }
+      }, prefixedStyledProps, buttonProps), locale.fileuploader.browseFiles)), afterFileDrop && /*#__PURE__*/React.createElement(React.Fragment, null, typeof props.progressAmount === 'number' ? /*#__PURE__*/React.createElement(ProgressBarComponent, _extends({
+        value: props.progressAmount,
+        overrides: {
+          BarProgress: {
+            // @ts-ignore
+            style: function style(_ref2) {
+              var $theme = _ref2.$theme;
+              return {
+                backgroundColor: props.errorMessage ? $theme.colors.negative : $theme.colors.accent
+              };
             }
           }
-        }, progressBarProps)) : props.errorMessage ? null : /*#__PURE__*/React.createElement(SpinnerComponent, _extends({
-          $size: SPINNER_SIZE.medium,
-          $style: {
-            marginBottom: theme.sizing.scale300
-          }
-        }, spinnerProps)), (props.errorMessage || props.progressMessage) && props.errorMessage ? /*#__PURE__*/React.createElement(ErrorMessage, _extends({}, prefixedStyledProps, errorMessageProps), props.errorMessage) : /*#__PURE__*/React.createElement(ContentMessage, _extends({}, prefixedStyledProps, contentMessageProps), props.progressMessage), props.errorMessage ? /*#__PURE__*/React.createElement(RetryButtonComponent, _extends({
-          kind: KIND.tertiary,
-          onClick: function onClick() {
-            props.onRetry && props.onRetry();
-          },
-          "aria-invalid": Boolean(props.errorMessage),
-          "aria-describedby": props['aria-describedby'],
-          "aria-errormessage": props.errorMessage
-        }, retryButtonProps), locale.fileuploader.retry) : /*#__PURE__*/React.createElement(CancelButtonComponent, _extends({
-          kind: KIND.tertiary,
-          onClick: function onClick() {
-            props.onCancel && props.onCancel();
-          },
-          "aria-describedby": props['aria-describedby'],
-          overrides: {
-            BaseButton: {
-              style: function style(_ref3) {
-                var $theme = _ref3.$theme;
-                return {
-                  color: $theme.colors.contentNegative
-                };
-              }
+        }
+      }, progressBarProps)) : props.errorMessage ? null : /*#__PURE__*/React.createElement(SpinnerComponent, _extends({
+        $size: SPINNER_SIZE.medium,
+        $style: {
+          marginBottom: theme.sizing.scale300
+        }
+      }, spinnerProps)), (props.errorMessage || props.progressMessage) && props.errorMessage ? /*#__PURE__*/React.createElement(ErrorMessage, _extends({}, prefixedStyledProps, errorMessageProps), props.errorMessage) : /*#__PURE__*/React.createElement(ContentMessage, _extends({}, prefixedStyledProps, contentMessageProps), props.progressMessage), props.errorMessage ? /*#__PURE__*/React.createElement(RetryButtonComponent, _extends({
+        kind: KIND.tertiary,
+        onClick: function onClick() {
+          props.onRetry && props.onRetry();
+        },
+        "aria-invalid": Boolean(props.errorMessage),
+        "aria-describedby": props['aria-describedby'],
+        "aria-errormessage": props.errorMessage
+      }, retryButtonProps), locale.fileuploader.retry) : /*#__PURE__*/React.createElement(CancelButtonComponent, _extends({
+        kind: KIND.tertiary,
+        onClick: function onClick() {
+          props.onCancel && props.onCancel();
+        },
+        "aria-describedby": props['aria-describedby'],
+        overrides: {
+          BaseButton: {
+            // @ts-ignore
+            style: function style(_ref3) {
+              var $theme = _ref3.$theme;
+              return {
+                color: $theme.colors.contentNegative
+              };
             }
           }
-        }, cancelButtonProps), locale.fileuploader.cancel))), /*#__PURE__*/React.createElement(HiddenInput, _extends({
-          "aria-invalid": Boolean(props.errorMessage) || null,
-          "aria-describedby": props['aria-describedby'],
-          "aria-errormessage": props.errorMessage || null
-        }, getInputProps(), prefixedStyledProps, hiddenInputProps)));
-      });
-    })
-  );
+        }
+      }, cancelButtonProps), locale.fileuploader.cancel))), /*#__PURE__*/React.createElement(HiddenInput, _extends({
+        "aria-invalid": Boolean(props.errorMessage) || null,
+        "aria-describedby": props['aria-describedby'],
+        "aria-errormessage": props.errorMessage || null
+      }, getInputProps(), prefixedStyledProps, hiddenInputProps)));
+    });
+  });
 }
 
 FileUploader.defaultProps = {

package/esm/file-uploader/styled-components.js

@@ -16,7 +16,7 @@ export var StyledFileDragAndDrop = styled('div', function (props) {
   var borderStyle = props.$afterFileDrop ? 'none' : 'dashed';
   return {
     alignItems: 'center',
-    backgroundColor: props.$isDragActive ? props.$theme.colors.backgroundLightAccent : props.$theme.colors.fileUploaderBackgroundColor,
+    backgroundColor: props.$isDragActive ? props.$theme.colors.backgroundAccentLight : props.$theme.colors.fileUploaderBackgroundColor,
     borderLeftColor: borderColor,
     borderRightColor: borderColor,
     borderTopColor: borderColor,
@@ -46,7 +46,8 @@ export var StyledFileDragAndDrop = styled('div', function (props) {
 });
 StyledFileDragAndDrop.displayName = "StyledFileDragAndDrop";
 StyledFileDragAndDrop.displayName = 'StyledFileDragAndDrop';
-export var StyledContentMessage = styled('div', function (_ref) {
+export var StyledContentMessage = styled('div', // @ts-ignore
+function (_ref) {
   var $theme = _ref.$theme,
       $afterFileDrop = _ref.$afterFileDrop,
       $isDragActive = _ref.$isDragActive;
@@ -58,7 +59,8 @@ export var StyledContentMessage = styled('div', function (_ref) {
 });
 StyledContentMessage.displayName = "StyledContentMessage";
 StyledContentMessage.displayName = 'StyledContentMessage';
-export var StyledContentSeparator = StyledContentMessage;
+export var StyledContentSeparator = StyledContentMessage; // @ts-ignore
+
 export var StyledErrorMessage = styled('div', function (props) {
   return _objectSpread(_objectSpread({}, props.$theme.typography.LabelMedium), {}, {
     color: props.$theme.colors.negative,

package/esm/flex-grid/flex-grid-item.js

@@ -44,9 +44,11 @@ export var flexGridItemMediaQueryStyle = function flexGridItemMediaQueryStyle(_r
       itemIndex = _ref.flexGridItemIndex,
       itemCount = _ref.flexGridItemCount;
   // 0px needed for calc() to behave properly
+  // @ts-ignore
   var colGap = $theme.sizing[flexGridColumnGap] || flexGridColumnGap || '0px';
   var colGapQuantity = parseFloat(colGap);
-  var colGapUnit = colGap.match(/[a-zA-Z]+/)[0];
+  var colGapUnit = colGap.match(/[a-zA-Z]+/)[0]; // @ts-ignore
+
   var rowGap = $theme.sizing[flexGridRowGap] || flexGridRowGap || '0px';
   var rowGapQuantity = parseFloat(rowGap);
   var widthCalc = "(100% - ".concat((colCount - 1) * colGapQuantity).concat(colGapUnit, ") / ").concat(colCount);
@@ -59,12 +61,14 @@ export var flexGridItemMediaQueryStyle = function flexGridItemMediaQueryStyle(_r
 };
 export function getResponsiveValue(responsive, i) {
   if (!responsive) {
+    // @ts-ignore
     return null;
   }
 
   if (!Array.isArray(responsive)) {
     return responsive;
-  }
+  } // @ts-ignore
+
 
   return responsive[i] || responsive[responsive.length - 1];
 }
@@ -109,6 +113,7 @@ export var flexGridItemStyle = function flexGridItemStyle(_ref3) {
     getMediaQuery(0) : mediaQueries[i - 1];
 
     if (mediaQuery) {
+      // @ts-ignore
       acc[mediaQuery] = flexGridItemMediaQueryStyle({
         $theme: $theme,
         flexGridColumnCount: flexGridColumnCountValue || 1,

package/esm/flex-grid/flex-grid.js

@@ -65,7 +65,8 @@ var FlexGrid = function FlexGrid(_ref2) {
     ref: forwardedRef,
     as: as
   }, restProps, flexGridProps), // flatten fragments so FlexGrid correctly iterates over fragments’ children
-  flattenFragments(children).map(function (child, flexGridItemIndex, _ref3) {
+  flattenFragments(children).map( // @ts-ignore
+  function (child, flexGridItemIndex, _ref3) {
     var flexGridItemCount = _ref3.length;
     return /*#__PURE__*/React.cloneElement(child, {
       flexGridColumnCount: flexGridColumnCount,

package/esm/form-control/form-control.js

@@ -35,6 +35,7 @@ import { getOverride, getOverrideProps } from '../helpers/overrides';
 import { UIDConsumer } from 'react-uid';
 import { Label as StyledLabel, LabelEndEnhancer as StyledLabelEndEnhancer, LabelContainer as StyledLabelContainer, Caption as StyledCaption, ControlContainer as StyledControlContainer } from './styled-components';
 
+// @ts-ignore
 function chooseRenderedHint(caption, error, positive, sharedProps) {
   if (!!error && typeof error !== 'boolean') {
     return typeof error === 'function' ? error(sharedProps) : error;
@@ -162,8 +163,8 @@ var FormControl = /*#__PURE__*/function (_React$Component) {
             'aria-errormessage': error ? captionId : null,
             'aria-describedby': caption || positive ? captionId : null,
             disabled: onlyChildProps.disabled || disabled,
-            error: typeof onlyChildProps.error !== 'undefined' ? onlyChildProps.error : sharedProps.$error,
-            positive: typeof onlyChildProps.positive !== 'undefined' ? onlyChildProps.positive : sharedProps.$positive
+            error: typeof onlyChildProps.error !== 'undefined' ? onlyChildProps.error : sharedProps.$error === false ? undefined : sharedProps.$error,
+            positive: typeof onlyChildProps.positive !== 'undefined' ? onlyChildProps.positive : sharedProps.$positive === false ? undefined : sharedProps.$positive
           });
         }), (!!caption || !!error || positive) && /*#__PURE__*/React.createElement(Caption, _extends({
           "data-baseweb": "form-control-caption",
@@ -178,7 +179,9 @@ var FormControl = /*#__PURE__*/function (_React$Component) {
 
 _defineProperty(FormControl, "defaultProps", {
   overrides: {},
+  // @ts-ignore
   label: null,
+  // @ts-ignore
   caption: null,
   disabled: false,
   counter: false

package/esm/helper/stateful-helper.js

@@ -33,6 +33,7 @@ StatefulHelper.defaultProps = {
   triggerType: TRIGGER_TYPE.click,
   dismissOnClickOutside: true,
   dismissOnEsc: true,
+  // @ts-ignore
   stateReducer: function stateReducer(_, nextState) {
     return nextState;
   },

package/esm/helper/styled-components.js

@@ -34,7 +34,7 @@ import { styled } from '../styles';
 import { PLACEMENT } from '../popover';
 import { getBodyStyles } from '../popover/styled-components';
 import { getPopoverMarginStyles, splitPlacement } from '../popover/utils';
-var CLAMP_ARROW_SIZE = 16;
+var CLAMP_ARROW_SIZE = 16; // @ts-ignore
 
 function dimensions(placement) {
   switch (placement) {
@@ -49,11 +49,13 @@ function dimensions(placement) {
     default:
       return [CLAMP_ARROW_SIZE, CLAMP_ARROW_SIZE];
   }
-}
+} // @ts-ignore
+
 
 function linearGradientDirection(placement) {
   return ['to'].concat(_toConsumableArray(splitPlacement(placement))).join(' ');
-}
+} // @ts-ignore
+
 
 function conicGradientOrigin(placement) {
   switch (placement) {
@@ -72,7 +74,8 @@ function conicGradientOrigin(placement) {
     default:
       return [0, 0];
   }
-}
+} // @ts-ignore
+
 
 function conicGradientDegStart(placement) {
   switch (placement) {
@@ -91,7 +94,8 @@ function conicGradientDegStart(placement) {
     default:
       return 0;
   }
-}
+} // @ts-ignore
+
 
 function position(offsets, placement, width, height) {
   if (placement === PLACEMENT.top) {

package/esm/helpers/overrides.js

@@ -128,6 +128,7 @@ export function mergeOverrides() {
   var allIdentifiers = Object.keys(merged); // const allIdentifiers = Object.keys({...target, ...source});
 
   return allIdentifiers.reduce(function (acc, name) {
+    // @ts-ignore
     acc[name] = mergeOverride(toObjectOverride(target[name]), toObjectOverride(source[name]));
     return acc;
   }, {});

package/esm/helpers/react-helpers.js

@@ -20,7 +20,7 @@ import * as React from 'react';
 import { isFragment } from 'react-is';
 export var flattenFragments = function flattenFragments(children, ChildWrapper) {
   var depth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-  return (// @ts-expect-error
+  return (// @ts-ignore
     React.Children.toArray(children).reduce(function (acc, child, i) {
       if (isFragment(child)) {
         acc.push.apply(acc, _toConsumableArray(flattenFragments(child.props.children, ChildWrapper, depth + 1)));

package/esm/helpers/responsive-helpers.js

@@ -1,3 +1,17 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
 /*
 Copyright (c) Uber Technologies, Inc.
 
@@ -13,9 +27,48 @@ export var getMediaQuery = function getMediaQuery(breakpoint) {
   return "@media screen and (min-width: ".concat(breakpoint, "px)");
 };
 export var getMediaQueries = function getMediaQueries(breakpoints) {
-  return Object.keys(breakpoints).map(function (key) {
+  return Object.keys(breakpoints) // @ts-ignore
+  .map(function (key) {
     return breakpoints[key];
   }).sort(function (a, b) {
     return a - b;
   }).map(getMediaQuery);
+};
+export var getMinimumPageMargins = function getMinimumPageMargins(margins) {
+  var margin = Array.isArray(margins) ? margins[0] : margins;
+  return {
+    paddingInlineStart: "".concat(margin, "px"),
+    paddingInlineEnd: "".concat(margin, "px")
+  };
+};
+export var getMediaQueryPageMargins = function getMediaQueryPageMargins(theme) {
+  var result = {};
+  var mediaQueries = getMediaQueries(theme.breakpoints);
+
+  var _iterator = _createForOfIteratorHelper(mediaQueries.entries()),
+      _step;
+
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var _theme$grid$margins$i;
+
+      var _step$value = _slicedToArray(_step.value, 2),
+          index = _step$value[0],
+          query = _step$value[1];
+
+      // There is no guarantee grid.margins will have enough margins to satisfy
+      // each breakpoint.
+      var margin = Array.isArray(theme.grid.margins) ? (_theme$grid$margins$i = theme.grid.margins[index]) !== null && _theme$grid$margins$i !== void 0 ? _theme$grid$margins$i : theme.grid.margins.at(-1) : theme.grid.margins;
+      result[query] = {
+        paddingInlineStart: "".concat(margin, "px"),
+        paddingInlineEnd: "".concat(margin, "px")
+      };
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+
+  return result;
 };

package/esm/icon/alert.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function Alert(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/arrow-down.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ArrowDown(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/arrow-left.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ArrowLeft(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/arrow-right.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ArrowRight(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/arrow-up.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ArrowUp(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/blank.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function Blank(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/calendar.js

@@ -0,0 +1,66 @@
+var _excluded = ["title", "size", "color", "overrides"];
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+/*
+Copyright (c) Uber Technologies, Inc.
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+*/
+// BASEUI-GENERATED-REACT-ICON
+// DO NOT EDIT THIS FILE DIRECTLY, SEE README.md
+import * as React from 'react';
+import { useStyletron } from '../styles';
+import { mergeOverride, toObjectOverride } from '../helpers/overrides';
+import Icon from './icon';
+
+// @ts-ignore
+function Calendar(props, ref) {
+  var _useStyletron = useStyletron(),
+      _useStyletron2 = _slicedToArray(_useStyletron, 2),
+      theme = _useStyletron2[1];
+
+  var _props$title = props.title,
+      title = _props$title === void 0 ? 'Calendar' : _props$title,
+      size = props.size,
+      color = props.color,
+      _props$overrides = props.overrides,
+      overrides = _props$overrides === void 0 ? {} : _props$overrides,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  var SvgOverride = mergeOverride( // Icons from the theme target the SVG override in the underlying Icon component
+  {
+    component: theme.icons && theme.icons.Calendar ? theme.icons.Calendar : null
+  }, overrides && overrides.Svg ? toObjectOverride(overrides.Svg) : {});
+  return /*#__PURE__*/React.createElement(Icon, _extends({
+    viewBox: "0 0 24 24",
+    ref: ref,
+    title: title,
+    size: size,
+    color: color,
+    overrides: {
+      Svg: SvgOverride
+    }
+  }, restProps), /*#__PURE__*/React.createElement("path", {
+    d: "M21.1667 2.83333H19.3333V1.45833C19.3333 1.20522 19.1283 1 18.875 1H17.9583C17.705 1 17.5 1.20522 17.5 1.45833V2.83333H6.5V1.45833C6.5 1.20522 6.295 1 6.04167 1H5.125C4.87166 1 4.66667 1.20522 4.66667 1.45833V2.83333H2.83333C1.82088 2.83333 1 3.6541 1 4.66667V21.1667C1 22.1791 1.82088 23 2.83333 23H21.1667C22.1791 23 23 22.1791 23 21.1667V4.66667C23 3.6541 22.1791 2.83333 21.1667 2.83333ZM4.66667 4.66667H6.5V6.5H4.66667V4.66667V4.66667ZM8.33333 19.3333H4.66667V15.6667H8.33333V19.3333ZM13.8333 19.3333H10.1667V15.6667H13.8333V19.3333ZM13.8333 13.8333H10.1667V10.1667H13.8333V13.8333ZM19.3333 19.3333H15.6667V15.6667H19.3333V19.3333ZM19.3333 13.8333H15.6667V10.1667H19.3333V13.8333ZM19.3333 6.5H17.5V4.66667H19.3333V6.5Z"
+  }));
+}
+
+export default /*#__PURE__*/React.forwardRef(Calendar);

package/esm/icon/check-indeterminate.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function CheckIndeterminate(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/check.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function Check(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/chevron-down.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ChevronDown(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/chevron-left.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ChevronLeft(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/chevron-right.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ChevronRight(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),

package/esm/icon/chevron-up.js

@@ -31,6 +31,7 @@ import { useStyletron } from '../styles';
 import { mergeOverride, toObjectOverride } from '../helpers/overrides';
 import Icon from './icon';
 
+// @ts-ignore
 function ChevronUp(props, ref) {
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),