baseui 12.0.0 → 12.1.2

package/esm/utils/deep-merge.js

@@ -6,8 +6,6 @@ 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.
 */
-
-/* flowlint unclear-type:off */
 export default function deepMerge(target) {
   target = target || {};
   var len = arguments.length <= 1 ? 0 : arguments.length - 1;
@@ -34,9 +32,6 @@ export default function deepMerge(target) {
 
   return target;
 }
-/* flowlint unclear-type:error */
-
-/* eslint-disable-next-line flowtype/no-weak-types */
 
 function isCloneable(obj) {
   /* eslint-disable-next-line eqeqeq */

package/esm/utils/deprecated-component.js

@@ -8,6 +8,7 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 export default function (Component, displayName) {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   var DeprecatedComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
     if (process.env.NODE_ENV !== "production") {
       console.warn("We have stabilized the ".concat(displayName, " component, so you can drop the \"Unstable_\" prefix from your imports. We will remove the \"Unstable_\" exports soon, so please make these changes as soon as possible!"));

package/esm/utils/focusVisible.js

@@ -145,7 +145,8 @@ export function initFocusVisible(node) {
     prepare(node.ownerDocument);
   }
 }
-export var forkFocus = function forkFocus(rootProps, handler) {
+export var forkFocus = // eslint-disable-next-line @typescript-eslint/no-explicit-any
+function forkFocus(rootProps, handler) {
   return function (e) {
     if (typeof rootProps.onFocus === 'function') {
       rootProps.onFocus(e);
@@ -154,7 +155,8 @@ export var forkFocus = function forkFocus(rootProps, handler) {
     handler(e);
   };
 };
-export var forkBlur = function forkBlur(rootProps, handler) {
+export var forkBlur = // eslint-disable-next-line @typescript-eslint/no-explicit-any
+function forkBlur(rootProps, handler) {
   return function (e) {
     if (typeof rootProps.onBlur === 'function') {
       rootProps.onBlur(e);

package/file-uploader/file-uploader.js

@@ -128,95 +128,99 @@ function FileUploader(props) {
       progressBarProps = _getOverrides22[1];
 
   var afterFileDrop = !!(props.progressAmount || props.progressMessage || props.errorMessage);
-  return /*#__PURE__*/React.createElement(_reactDropzone.default, _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(_locale.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: _button.KIND.secondary,
-        shape: _button.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
-              };
+  return (
+    /*#__PURE__*/
+    // @ts-expect-error todo(flow->ts): dropzone api
+    React.createElement(_reactDropzone.default, _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(_locale.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: _button.KIND.secondary,
+          shape: _button.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
+                };
+              }
             }
           }
-        }
-      }, 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: {
+              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: _button.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: _button.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: _button.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: _button.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
+                };
+              }
             }
           }
-        }
-      }, 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/file-uploader/styled-components.js

@@ -48,6 +48,7 @@ var StyledFileDragAndDrop = (0, _styles.styled)('div', function (props) {
 });
 exports.StyledFileDragAndDrop = StyledFileDragAndDrop;
 StyledFileDragAndDrop.displayName = "StyledFileDragAndDrop";
+StyledFileDragAndDrop.displayName = 'StyledFileDragAndDrop';
 var StyledContentMessage = (0, _styles.styled)('div', function (_ref) {
   var $theme = _ref.$theme,
       $afterFileDrop = _ref.$afterFileDrop,
@@ -60,6 +61,7 @@ var StyledContentMessage = (0, _styles.styled)('div', function (_ref) {
 });
 exports.StyledContentMessage = StyledContentMessage;
 StyledContentMessage.displayName = "StyledContentMessage";
+StyledContentMessage.displayName = 'StyledContentMessage';
 var StyledContentSeparator = StyledContentMessage;
 exports.StyledContentSeparator = StyledContentSeparator;
 var StyledErrorMessage = (0, _styles.styled)('div', function (props) {
@@ -71,6 +73,7 @@ var StyledErrorMessage = (0, _styles.styled)('div', function (props) {
 });
 exports.StyledErrorMessage = StyledErrorMessage;
 StyledErrorMessage.displayName = "StyledErrorMessage";
+StyledErrorMessage.displayName = 'StyledErrorMessage';
 var StyledRoot = (0, _styles.styled)('div', function (props) {
   return _objectSpread(_objectSpread({}, props.$theme.typography.font300), {}, {
     color: props.$theme.colors.fileUploaderMessageColor
@@ -78,6 +81,8 @@ var StyledRoot = (0, _styles.styled)('div', function (props) {
 });
 exports.StyledRoot = StyledRoot;
 StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';
 var StyledHiddenInput = (0, _styles.styled)('input', {});
 exports.StyledHiddenInput = StyledHiddenInput;
-StyledHiddenInput.displayName = "StyledHiddenInput";
+StyledHiddenInput.displayName = "StyledHiddenInput";
+StyledHiddenInput.displayName = 'StyledHiddenInput';

package/flex-grid/flex-grid-item.d.ts

@@ -16,7 +16,7 @@ export declare const flexGridItemMediaQueryStyle: ({ $theme, flexGridColumnCount
     width: `calc(${string} - .5px)`;
     marginBottom: any;
 }>;
-export declare const getResponsiveValue: <T extends unknown>(responsive: Responsive<T>, i: number) => T;
+export declare function getResponsiveValue<T>(responsive?: Responsive<T>, i?: number): T | undefined;
 export declare const flexGridItemStyle: ({ $flexGridColumnCount, $flexGridColumnGap, $flexGridRowGap, $flexGridItemIndex, $flexGridItemCount, $theme, }: {
     $flexGridColumnCount?: Responsive<number>;
     $flexGridColumnGap?: Responsive<Scale>;

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

@@ -5,7 +5,8 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getResponsiveValue = exports.flexGridItemStyle = exports.flexGridItemMediaQueryStyle = exports.default = void 0;
+exports.flexGridItemStyle = exports.flexGridItemMediaQueryStyle = exports.default = void 0;
+exports.getResponsiveValue = getResponsiveValue;
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -66,14 +67,12 @@ var flexGridItemMediaQueryStyle = function flexGridItemMediaQueryStyle(_ref) {
     // Subtract .5px to avoid rounding issues on IE/Edge
     // See https://github.com/uber/baseweb/pull/1748
     width: "calc(".concat(widthCalc, " - .5px)")
-  }, _defineProperty(_objectSpread2, marginDirection, colGapQuantity && ( //flowlint-line sketchy-number-and:off
-  (itemIndex + 1) % colCount !== 0 ? colGap : 0)), _defineProperty(_objectSpread2, "marginBottom", rowGapQuantity && ( //flowlint-line sketchy-number-and:off
-  ~~(itemIndex / colCount) !== ~~((itemCount - 1) / colCount) ? rowGap : 0)), _objectSpread2), itemIndex === itemCount - 1 && (itemIndex + 1) % colCount !== 0 ? _defineProperty({}, marginDirection, "calc(".concat(colCount - itemIndex % colCount - 1, " * (").concat(colGap, " + ").concat(widthCalc, "))")) : {}));
+  }, _defineProperty(_objectSpread2, marginDirection, colGapQuantity && ((itemIndex + 1) % colCount !== 0 ? colGap : 0)), _defineProperty(_objectSpread2, "marginBottom", rowGapQuantity && (~~(itemIndex / colCount) !== ~~((itemCount - 1) / colCount) ? rowGap : 0)), _objectSpread2), itemIndex === itemCount - 1 && (itemIndex + 1) % colCount !== 0 ? _defineProperty({}, marginDirection, "calc(".concat(colCount - itemIndex % colCount - 1, " * (").concat(colGap, " + ").concat(widthCalc, "))")) : {}));
 };
 
 exports.flexGridItemMediaQueryStyle = flexGridItemMediaQueryStyle;
 
-var getResponsiveValue = function getResponsiveValue(responsive, i) {
+function getResponsiveValue(responsive, i) {
   if (!responsive) {
     return null;
   }
@@ -83,9 +82,7 @@ var getResponsiveValue = function getResponsiveValue(responsive, i) {
   }
 
   return responsive[i] || responsive[responsive.length - 1];
-};
-
-exports.getResponsiveValue = getResponsiveValue;
+}
 
 var flexGridItemStyle = function flexGridItemStyle(_ref3) {
   var $flexGridColumnCount = _ref3.$flexGridColumnCount,
@@ -164,6 +161,7 @@ var FlexGridItem = function FlexGridItem(_ref4) {
   var blockOverrides = overrides ? (0, _overrides.mergeOverrides)(flexGridItemOverrides, overrides) : flexGridItemOverrides;
   return /*#__PURE__*/React.createElement(_block.Block // coerced to any because of how react components are typed.
   // cannot guarantee an html element
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   , _extends({
     ref: forwardedRef,
     as: as,

package/flex-grid/flex-grid.js

@@ -90,9 +90,13 @@ var FlexGrid = function FlexGrid(_ref2) {
 };
 
 var FlexGridComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  return /*#__PURE__*/React.createElement(FlexGrid, _extends({}, props, {
-    forwardedRef: ref
-  }));
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    React.createElement(FlexGrid, _extends({}, props, {
+      forwardedRef: ref
+    }))
+  );
 });
 FlexGridComponent.displayName = 'FlexGrid';
 var _default = FlexGridComponent;

package/flex-grid/types.d.ts

@@ -1,5 +1,5 @@
 import type { BlockProps, Responsive, Scale } from '../block';
-import { ElementType } from 'react';
+import type { ElementType } from 'react';
 export declare type FlexGridProps<T extends ElementType = ElementType> = {
     /** Number of equal-width columns to allow for */
     flexGridColumnCount?: Responsive<number>;

package/form-control/styled-components.js

@@ -30,6 +30,7 @@ var Label = (0, _styles.styled)('label', function (props) {
 });
 exports.Label = Label;
 Label.displayName = "Label";
+Label.displayName = 'Label';
 var LabelContainer = (0, _styles.styled)('span', function (_ref) {
   var sizing = _ref.$theme.sizing;
   return {
@@ -43,6 +44,7 @@ var LabelContainer = (0, _styles.styled)('span', function (_ref) {
 });
 exports.LabelContainer = LabelContainer;
 LabelContainer.displayName = "LabelContainer";
+LabelContainer.displayName = 'LabelContainer';
 var LabelEndEnhancer = (0, _styles.styled)('span', function (_ref2) {
   var $disabled = _ref2.$disabled,
       $counterError = _ref2.$counterError,
@@ -57,6 +59,7 @@ var LabelEndEnhancer = (0, _styles.styled)('span', function (_ref2) {
 });
 exports.LabelEndEnhancer = LabelEndEnhancer;
 LabelEndEnhancer.displayName = "LabelEndEnhancer";
+LabelEndEnhancer.displayName = 'LabelEndEnhancer';
 var Caption = (0, _styles.styled)('div', function (props) {
   var $error = props.$error,
       $positive = props.$positive,
@@ -86,6 +89,7 @@ var Caption = (0, _styles.styled)('div', function (props) {
 });
 exports.Caption = Caption;
 Caption.displayName = "Caption";
+Caption.displayName = 'Caption';
 var ControlContainer = (0, _styles.styled)('div', function (props) {
   var sizing = props.$theme.sizing;
   return {
@@ -94,4 +98,5 @@ var ControlContainer = (0, _styles.styled)('div', function (props) {
   };
 });
 exports.ControlContainer = ControlContainer;
-ControlContainer.displayName = "ControlContainer";
+ControlContainer.displayName = "ControlContainer";
+ControlContainer.displayName = 'ControlContainer';

package/form-control/types.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { Override } from '../helpers/overrides';
 export declare type FormControlState = {
     captionId: string;

package/header-navigation/styled-components.js

@@ -32,6 +32,7 @@ var Root = (0, _styles.styled)('nav', function (props) {
 });
 exports.Root = Root;
 Root.displayName = "Root";
+Root.displayName = 'Root';
 var NavigationItem = (0, _styles.styled)('li', function (props) {
   var $theme = props.$theme;
   var scale800 = $theme.sizing.scale800;
@@ -42,6 +43,7 @@ var NavigationItem = (0, _styles.styled)('li', function (props) {
 });
 exports.NavigationItem = NavigationItem;
 NavigationItem.displayName = "NavigationItem";
+NavigationItem.displayName = 'NavigationItem';
 var NavigationList = (0, _styles.styled)('ul', function (props) {
   var $align = props.$align,
       $theme = props.$theme;
@@ -70,4 +72,5 @@ var NavigationList = (0, _styles.styled)('ul', function (props) {
   };
 });
 exports.NavigationList = NavigationList;
-NavigationList.displayName = "NavigationList";
+NavigationList.displayName = "NavigationList";
+NavigationList.displayName = 'NavigationList';

package/heading/types.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { BlockProps } from '../block';
 export declare type HeadingProps = {
     /** Set and fix the style level independently on the hierarchy context. */

package/helper/styled-components.js

@@ -202,8 +202,10 @@ var StyledBody = (0, _styles.styled)('div', function (props) {
 });
 exports.StyledBody = StyledBody;
 StyledBody.displayName = "StyledBody";
+StyledBody.displayName = 'StyledBody';
 var StyledArrow = (0, _styles.styled)('div', function (props) {
   return _objectSpread({}, clampArrowStyle(props.$arrowOffset, props.$placement, props.$theme.colors.backgroundPrimary));
 });
 exports.StyledArrow = StyledArrow;
-StyledArrow.displayName = "StyledArrow";
+StyledArrow.displayName = "StyledArrow";
+StyledArrow.displayName = 'StyledArrow';

package/helpers/overrides.js

@@ -37,6 +37,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 /**
  * Given an override argument, returns the component implementation override if it exists
  */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 function getOverride(_override) {
   if ((0, _reactIs.isValidElementType)(_override)) {
     return _override;
@@ -46,6 +47,7 @@ function getOverride(_override) {
   if (_override && _typeof(_override) === 'object') {
     // Remove this 'any' once this flow issue is fixed:
     // https://github.com/facebook/flow/issues/6666
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     return _override.component;
   } // null/undefined
 
@@ -85,11 +87,13 @@ function getOverrideProps(_override) {
 function toObjectOverride(_override) {
   if ((0, _reactIs.isValidElementType)(_override)) {
     return {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
       component: _override
     };
   } // Flow can't figure out that typeof 'function' above will
   // catch React.StatelessFunctionalComponent
   // (probably related to https://github.com/facebook/flow/issues/6666)
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
 
   return _override || {};
@@ -97,9 +101,12 @@ function toObjectOverride(_override) {
 /**
  * Get a convenient override array that will always have [component, props]
  */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 
 
-function getOverrides(_override, defaultComponent) {
+function getOverrides( // eslint-disable-next-line @typescript-eslint/no-explicit-any
+_override, // eslint-disable-next-line @typescript-eslint/no-explicit-any
+defaultComponent) {
   var Component = getOverride(_override) || defaultComponent;
 
   if (_override && _typeof(_override) === 'object' && typeof _override.props === 'function') {
@@ -126,8 +133,6 @@ function getOverrides(_override, defaultComponent) {
   var props = getOverrideProps(_override);
   return [Component, props];
 }
-/* flowlint unclear-type:error */
-
 /**
  * Merges two overrides objects – this is useful if you want to inject your own
  * overrides into a child component, but also accept further overrides from

package/helpers/overrides.js.flow

@@ -5,7 +5,7 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 // @flow
-/* eslint-disable cup/no-undef */
+
 import * as React from 'react';
 import { isValidElementType } from 'react-is';
 import deepMerge from '../utils/deep-merge.js';

package/helpers/types.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { Theme } from '../styles/types';
 import type { Override } from '../helpers/overrides';
 export declare type BaseProviderOverrides = {

package/icon/build-icons.js

@@ -7,8 +7,6 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 
-/* eslint-disable flowtype/require-valid-file-annotation */
-
 /* eslint-env node*/
 "use strict";
 

package/icon/build-icons.js.flow

@@ -7,7 +7,6 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 
-/* eslint-disable flowtype/require-valid-file-annotation */
 /* eslint-env node*/
 const fs = require('fs');
 const path = require('path');

package/icon/index.d.ts

@@ -1,6 +1,6 @@
 import type { StyledComponentArgs } from './types';
 export { default as Icon } from './icon';
-export { Svg as StyledSvg } from './styled-components';
+export { Svg as StyledSvg, getSvgStyles } from './styled-components';
 export * from './icon-exports';
 export * from './types';
 /** @deprecated use StyledComponentArgs instead. To be removed in future versions.*/

package/icon/index.js

@@ -5,7 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 var _exportNames = {
   Icon: true,
-  StyledSvg: true
+  StyledSvg: true,
+  getSvgStyles: true
 };
 Object.defineProperty(exports, "Icon", {
   enumerable: true,
@@ -19,6 +20,12 @@ Object.defineProperty(exports, "StyledSvg", {
     return _styledComponents.Svg;
   }
 });
+Object.defineProperty(exports, "getSvgStyles", {
+  enumerable: true,
+  get: function get() {
+    return _styledComponents.getSvgStyles;
+  }
+});
 
 var _icon = _interopRequireDefault(require("./icon"));
 

package/icon/index.js.flow

@@ -6,7 +6,7 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 export { default as Icon } from './icon.js';
-export { Svg as StyledSvg } from './styled-components.js';
+export { Svg as StyledSvg, getSvgStyles } from './styled-components.js';
 export * from './icon-exports.js';
 export type * from './types.js';
 

package/icon/omit-dollar-prefixed-keys.js

@@ -11,6 +11,7 @@ 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.
 */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 function omitDollarPrefixedKeys(source) {
   var result = {};
 

package/icon/styled-components.js

@@ -51,4 +51,5 @@ function getSvgStyles(_ref) {
 
 var Svg = (0, _styles.styled)('svg', getSvgStyles);
 exports.Svg = Svg;
-Svg.displayName = "Svg";
+Svg.displayName = "Svg";
+Svg.displayName = 'Svg';

package/icon/types.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { Override } from '../helpers/overrides';
 export declare type IconOverrides = {
     Svg?: Override;

package/input/base-input.js

@@ -113,23 +113,19 @@ var BaseInput = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "onFocus", function (e) {
-      if (!_this.props.readOnly) {
-        _this.setState({
-          isFocused: true
-        });
+      _this.setState({
+        isFocused: true
+      });
 
-        _this.props.onFocus(e);
-      }
+      _this.props.onFocus(e);
     });
 
     _defineProperty(_assertThisInitialized(_this), "onBlur", function (e) {
-      if (!_this.props.readOnly) {
-        _this.setState({
-          isFocused: false
-        });
+      _this.setState({
+        isFocused: false
+      });
 
-        _this.props.onBlur(e);
-      }
+      _this.props.onBlur(e);
     });
 
     _defineProperty(_assertThisInitialized(_this), "handleFocusForMaskToggle", function (event) {