baseui 10.9.2 → 10.11.1

package/es/toast/styled-components.js

@@ -77,13 +77,11 @@ export function getPlacement(placement) {
       flexDirection: 'column-reverse'
     }
   }[placement];
-} // $FlowFixMe https://github.com/facebook/flow/issues/7745
-
-export const Root = styled('div', props => {
-  const {
-    $placement,
-    $theme
-  } = props;
+}
+export const Root = styled('div', ({
+  $placement,
+  $theme
+}) => {
   return {
     pointerEvents: 'none',
     position: 'fixed',
@@ -96,19 +94,17 @@ export const Root = styled('div', props => {
     marginRight: $theme.sizing.scale600,
     ...getPlacement($placement)
   };
-}); // $FlowFixMe https://github.com/facebook/flow/issues/7745
-
+});
 Root.displayName = "Root";
-export const InnerContainer = styled('div', {}); // $FlowFixMe https://github.com/facebook/flow/issues/7745
-
+export const InnerContainer = styled('div', // eslint-disable-next-line no-empty-pattern
+({}) => ({}));
 InnerContainer.displayName = "InnerContainer";
-export const Body = styled('div', props => {
-  const {
-    $isVisible,
-    $kind,
-    $type,
-    $theme
-  } = props;
+export const Body = styled('div', ({
+  $isVisible,
+  $kind,
+  $type,
+  $theme
+}) => {
   const isInline = $type === TYPE.inline;
   return { ...$theme.typography.font300,
     pointerEvents: 'auto',
@@ -134,15 +130,21 @@ export const Body = styled('div', props => {
     display: 'flex',
     justifyContent: 'space-between'
   };
-}); // $FlowFixMe https://github.com/facebook/flow/issues/7745
-
-Body.displayName = "Body";
-export const CloseIconSvg = styled('svg', props => {
-  return { ...getSvgStyles(props),
-    cursor: 'pointer',
-    width: props.$size || '16px',
-    flexShrink: 0,
-    outline: props.$isFocusVisible ? `3px solid ${props.$theme.colors.accent}` : 'none'
-  };
 });
+Body.displayName = "Body";
+export const CloseIconSvg = styled('svg', ({
+  $theme,
+  $size,
+  $color,
+  $isFocusVisible
+}) => ({ ...getSvgStyles({
+    $theme,
+    $size,
+    $color
+  }),
+  cursor: 'pointer',
+  width: $size || '16px',
+  flexShrink: 0,
+  outline: $isFocusVisible ? `3px solid ${$theme.colors.accent}` : 'none'
+}));
 CloseIconSvg.displayName = "CloseIconSvg";

package/es/toast/toaster.js

@@ -140,11 +140,10 @@ export class ToasterContainer extends React.Component {
         Body: StyledBody,
         CloseIcon: StyledCloseIcon,
         InnerContainer: StyledInnerContainer
-      }, // $FlowFixMe
-      {
-        Body: BodyOverride,
-        CloseIcon: CloseIconOverride,
-        InnerContainer: InnerContainerOverride
+      }, {
+        Body: BodyOverride || {},
+        CloseIcon: CloseIconOverride || {},
+        InnerContainer: InnerContainerOverride || {}
       });
       const toastOverrides = mergeOverrides(globalToastOverrides, toastProps.overrides);
       return /*#__PURE__*/React.createElement(Toast, _extends({}, restProps, {
@@ -198,8 +197,7 @@ export class ToasterContainer extends React.Component {
     }, sharedProps, rootProps), toastsToRender); //Only render the portal in the browser, otherwise render the toasts and children
 
     if (this.state.isMounted) {
-      return /*#__PURE__*/React.createElement(React.Fragment, null, this.props.usePortal && typeof document !== 'undefined' ? /*#__PURE__*/ReactDOM.createPortal(root, // $FlowFixMe
-      document.body) : root, this.props.children);
+      return /*#__PURE__*/React.createElement(React.Fragment, null, this.props.usePortal && typeof document !== 'undefined' && document.body ? /*#__PURE__*/ReactDOM.createPortal(root, document.body) : root, this.props.children);
     } else {
       return /*#__PURE__*/React.createElement(React.Fragment, null, this.props.children);
     }

package/es/toast/types.js

@@ -4,7 +4,5 @@ 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 flowtype/generic-spacing */
 import * as React from 'react';
 import { KIND, PLACEMENT, TYPE } from './constants.js';

package/es/tree-view/tree-label-interactable.js

@@ -15,10 +15,14 @@ const TreeLabelInteractable = ({
   ...props
 }) => {
   const LabelInteractable = getOverride(overrides.LabelInteractable) || StyledLabelInteractable;
-  return /*#__PURE__*/React.createElement(LabelInteractable, _extends({
-    onClick: e => e.stopPropagation(),
-    onKeyDown: e => e.stopPropagation()
-  }, props));
+  return (
+    /*#__PURE__*/
+    // $FlowExpectedError[cannot-spread-inexact]
+    React.createElement(LabelInteractable, _extends({
+      onClick: e => e.stopPropagation(),
+      onKeyDown: e => e.stopPropagation()
+    }, props))
+  );
 };
 
 export default TreeLabelInteractable;

package/es/tree-view/tree-label.js

@@ -46,7 +46,11 @@ const TreeLabel = ({
   const LeafIconContainer = getOverride(LeafIconContainerOverride) || StyledIconContainer;
   const LeafIcon = getOverride(LeafIconOverride) || BlankIcon;
   const TreeItemContent = getOverride(TreeItemContentOverride) || StyledItemContent;
-  return /*#__PURE__*/React.createElement(TreeItemContent, _extends({}, sharedProps, props), hasChildren && /*#__PURE__*/React.createElement(IconContainer, _extends({}, sharedProps, getOverrideProps(IconContainerOverride)), !isExpanded ? /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, theme => theme.direction === 'rtl' ? /*#__PURE__*/React.createElement(Left, _extends({}, sharedProps, LeftProps)) : /*#__PURE__*/React.createElement(Right, _extends({}, sharedProps, RightProps))) : /*#__PURE__*/React.createElement(CollapseIcon, _extends({}, sharedProps, getOverrideProps(CollapseIconOverride)))), !hasChildren && LeafIcon && /*#__PURE__*/React.createElement(LeafIconContainer, _extends({}, sharedProps, getOverrideProps(LeafIconContainerOverride)), /*#__PURE__*/React.createElement(LeafIcon, _extends({}, sharedProps, getOverrideProps(LeafIconOverride)))), typeof label === 'function' ? label(node) : label);
+  return (
+    /*#__PURE__*/
+    // $FlowExpectedError[cannot-spread-inexact]
+    React.createElement(TreeItemContent, _extends({}, sharedProps, props), hasChildren && /*#__PURE__*/React.createElement(IconContainer, _extends({}, sharedProps, getOverrideProps(IconContainerOverride)), !isExpanded ? /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, theme => theme.direction === 'rtl' ? /*#__PURE__*/React.createElement(Left, _extends({}, sharedProps, LeftProps)) : /*#__PURE__*/React.createElement(Right, _extends({}, sharedProps, RightProps))) : /*#__PURE__*/React.createElement(CollapseIcon, _extends({}, sharedProps, getOverrideProps(CollapseIconOverride)))), !hasChildren && LeafIcon && /*#__PURE__*/React.createElement(LeafIconContainer, _extends({}, sharedProps, getOverrideProps(LeafIconContainerOverride)), /*#__PURE__*/React.createElement(LeafIcon, _extends({}, sharedProps, getOverrideProps(LeafIconOverride)))), typeof label === 'function' ? label(node) : label)
+  );
 };
 
 export default TreeLabel;

package/es/tree-view/tree-node.js

@@ -87,7 +87,7 @@ export default class TreeNode extends React.Component {
       onKeyDown: e => onKeyDown && onKeyDown(e, node),
       onBlur: onBlur,
       onFocus: this.onFocus,
-      "aria-expanded": isExpanded ? true : false,
+      "aria-expanded": isExpanded,
       $isLeafNode: !hasChildren
     }, getOverrideProps(TreeItemOverride)), /*#__PURE__*/React.createElement(TreeLabel, _extends({
       onClick: this.onToggle,

package/es/tree-view/tree-view.js

@@ -25,23 +25,23 @@ export default function TreeView(props) {
     Root: RootOverride
   } = overrides;
   const Root = getOverride(RootOverride) || StyledTreeItemList;
-  const firstId = data.length && getId(data[0]);
+  const firstId = data.length > 0 ? getId(data[0]) : 0;
   const [selectedNodeId, setSelectedNodeId] = React.useState(firstId);
   const [focusVisible, setFocusVisible] = React.useState(false);
   const [typeAheadChars, setTypeAheadChars] = React.useState('');
   const timeOutRef = React.useRef(null);
-  const treeItemRefs = React.useRef({});
+  const treeItemRefs = {};
 
   const focusTreeItem = id => {
     if (!id) return;
     setSelectedNodeId(id);
-    const refs = treeItemRefs.current[id];
+    const refs = treeItemRefs[id];
     const node = refs && refs.current;
     if (node) node.focus();
   };
 
   const onKeyDown = (e, node) => {
-    // eslint-disable-next-line flowtype/no-weak-types
+    // flowlint-next-line unclear-type:off
     const elementId = e.target.getAttribute('data-nodeid'); // this check prevents bubbling
 
     if (elementId !== getId(node) && parseInt(elementId) !== getId(node)) {
@@ -154,10 +154,10 @@ export default function TreeView(props) {
     onFocus: onFocus,
     onBlur: onBlur,
     addRef: (id, ref) => {
-      treeItemRefs.current[id] = ref;
+      treeItemRefs[id] = ref;
     },
     removeRef: id => {
-      delete treeItemRefs.current[id];
+      delete treeItemRefs[id];
     },
     isFocusVisible: focusVisible
   })));

package/es/typography/index.js

@@ -8,7 +8,10 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import Block from '../block/block.js';
-export const DisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const DisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-displaylarge"
 }, props, {
   font: props.font || 'DisplayLarge',
@@ -16,7 +19,10 @@ export const DisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__P
   ref: ref
 })));
 DisplayLarge.displayName = 'DisplayLarge';
-export const DisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const DisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-displaymedium"
 }, props, {
   font: props.font || 'DisplayMedium',
@@ -24,7 +30,10 @@ export const DisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__
   ref: ref
 })));
 DisplayMedium.displayName = 'DisplayMedium';
-export const DisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const DisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-displaysmall"
 }, props, {
   font: props.font || 'DisplaySmall',
@@ -32,7 +41,10 @@ export const DisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__P
   ref: ref
 })));
 DisplaySmall.displayName = 'DisplaySmall';
-export const DisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const DisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-displayxsmall"
 }, props, {
   font: props.font || 'DisplayXSmall',
@@ -40,7 +52,10 @@ export const DisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__
   ref: ref
 })));
 DisplayXSmall.displayName = 'DisplayXSmall';
-export const HeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const HeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-headingxxlarge",
   as: props.as || 'h1'
 }, props, {
@@ -49,7 +64,10 @@ export const HeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#_
   ref: ref
 })));
 HeadingXXLarge.displayName = 'HeadingXXLarge';
-export const HeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const HeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-headingxlarge",
   as: props.as || 'h2'
 }, props, {
@@ -58,7 +76,10 @@ export const HeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__
   ref: ref
 })));
 HeadingXLarge.displayName = 'HeadingXLarge';
-export const HeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const HeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-headinglarge",
   as: props.as || 'h3'
 }, props, {
@@ -67,7 +88,10 @@ export const HeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__P
   ref: ref
 })));
 HeadingLarge.displayName = 'HeadingLarge';
-export const HeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const HeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-headingmedium",
   as: props.as || 'h4'
 }, props, {
@@ -76,7 +100,10 @@ export const HeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__
   ref: ref
 })));
 HeadingMedium.displayName = 'HeadingMedium';
-export const HeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const HeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-headingsmall",
   as: props.as || 'h5'
 }, props, {
@@ -85,7 +112,10 @@ export const HeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__P
   ref: ref
 })));
 HeadingSmall.displayName = 'HeadingSmall';
-export const HeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const HeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-headingxsmall",
   as: props.as || 'h6'
 }, props, {
@@ -94,7 +124,10 @@ export const HeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__
   ref: ref
 })));
 HeadingXSmall.displayName = 'HeadingXSmall';
-export const LabelLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const LabelLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-labellarge"
 }, props, {
   font: props.font || 'LabelLarge',
@@ -102,7 +135,10 @@ export const LabelLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PUR
   ref: ref
 })));
 LabelLarge.displayName = 'LabelLarge';
-export const LabelMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const LabelMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-labelmedium"
 }, props, {
   font: props.font || 'LabelMedium',
@@ -110,7 +146,10 @@ export const LabelMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PU
   ref: ref
 })));
 LabelMedium.displayName = 'LabelMedium';
-export const LabelSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const LabelSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-labelsmall"
 }, props, {
   font: props.font || 'LabelSmall',
@@ -118,7 +157,10 @@ export const LabelSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PUR
   ref: ref
 })));
 LabelSmall.displayName = 'LabelSmall';
-export const LabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const LabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-labelxsmall"
 }, props, {
   font: props.font || 'LabelXSmall',
@@ -126,7 +168,10 @@ export const LabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PU
   ref: ref
 })));
 LabelXSmall.displayName = 'LabelXSmall';
-export const ParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const ParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-paragraphlarge",
   as: props.as || 'p'
 }, props, {
@@ -135,7 +180,10 @@ export const ParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#_
   ref: ref
 })));
 ParagraphLarge.displayName = 'ParagraphLarge';
-export const ParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const ParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-paragraphmedium",
   as: props.as || 'p'
 }, props, {
@@ -144,7 +192,10 @@ export const ParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#
   ref: ref
 })));
 ParagraphMedium.displayName = 'ParagraphMedium';
-export const ParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const ParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-paragraphsmall",
   as: props.as || 'p'
 }, props, {
@@ -153,7 +204,10 @@ export const ParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#_
   ref: ref
 })));
 ParagraphSmall.displayName = 'ParagraphSmall';
-export const ParagraphXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const ParagraphXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-paragraphxsmall",
   as: props.as || 'p'
 }, props, {
@@ -162,7 +216,10 @@ export const ParagraphXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#
   ref: ref
 })));
 ParagraphXSmall.displayName = 'ParagraphXSmall';
-export const MonoDisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoDisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monodisplaylarge"
 }, props, {
   font: props.font || 'MonoDisplayLarge',
@@ -170,7 +227,10 @@ export const MonoDisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*
   ref: ref
 })));
 MonoDisplayLarge.displayName = 'MonoDisplayLarge';
-export const MonoDisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoDisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monodisplaymedium"
 }, props, {
   font: props.font || 'MonoDisplayMedium',
@@ -178,7 +238,10 @@ export const MonoDisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) => /
   ref: ref
 })));
 MonoDisplayMedium.displayName = 'MonoDisplayMedium';
-export const MonoDisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoDisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monodisplaysmall"
 }, props, {
   font: props.font || 'MonoDisplaySmall',
@@ -186,7 +249,10 @@ export const MonoDisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) => /*
   ref: ref
 })));
 MonoDisplaySmall.displayName = 'MonoDisplaySmall';
-export const MonoDisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoDisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monodisplayxsmall"
 }, props, {
   font: props.font || 'MonoDisplayXSmall',
@@ -194,7 +260,10 @@ export const MonoDisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /
   ref: ref
 })));
 MonoDisplayXSmall.displayName = 'MonoDisplayXSmall';
-export const MonoHeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoHeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoheadingxxlarge",
   as: props.as || 'h1'
 }, props, {
@@ -203,7 +272,10 @@ export const MonoHeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
   ref: ref
 })));
 MonoHeadingXXLarge.displayName = 'MonoHeadingXXLarge';
-export const MonoHeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoHeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoheadingxlarge",
   as: props.as || 'h2'
 }, props, {
@@ -212,7 +284,10 @@ export const MonoHeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /
   ref: ref
 })));
 MonoHeadingXLarge.displayName = 'MonoHeadingXLarge';
-export const MonoHeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoHeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoheadinglarge",
   as: props.as || 'h3'
 }, props, {
@@ -221,7 +296,10 @@ export const MonoHeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*
   ref: ref
 })));
 MonoHeadingLarge.displayName = 'MonoHeadingLarge';
-export const MonoHeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoHeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoheadingmedium",
   as: props.as || 'h4'
 }, props, {
@@ -230,7 +308,10 @@ export const MonoHeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) => /
   ref: ref
 })));
 MonoHeadingMedium.displayName = 'MonoHeadingMedium';
-export const MonoHeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoHeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoheadingsmall",
   as: props.as || 'h5'
 }, props, {
@@ -239,7 +320,10 @@ export const MonoHeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*
   ref: ref
 })));
 MonoHeadingSmall.displayName = 'MonoHeadingSmall';
-export const MonoHeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoHeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoheadingxsmall",
   as: props.as || 'h6'
 }, props, {
@@ -248,7 +332,10 @@ export const MonoHeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /
   ref: ref
 })));
 MonoHeadingXSmall.displayName = 'MonoHeadingXSmall';
-export const MonoLabelLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoLabelLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monolabellarge"
 }, props, {
   font: props.font || 'MonoLabelLarge',
@@ -256,7 +343,10 @@ export const MonoLabelLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#_
   ref: ref
 })));
 MonoLabelLarge.displayName = 'MonoLabelLarge';
-export const MonoLabelMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoLabelMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monolabelmedium"
 }, props, {
   font: props.font || 'MonoLabelMedium',
@@ -264,7 +354,10 @@ export const MonoLabelMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#
   ref: ref
 })));
 MonoLabelMedium.displayName = 'MonoLabelMedium';
-export const MonoLabelSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoLabelSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monolabelsmall"
 }, props, {
   font: props.font || 'MonoLabelSmall',
@@ -272,7 +365,10 @@ export const MonoLabelSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#_
   ref: ref
 })));
 MonoLabelSmall.displayName = 'MonoLabelSmall';
-export const MonoLabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoLabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monolabelxsmall"
 }, props, {
   font: props.font || 'MonoLabelXSmall',
@@ -280,7 +376,10 @@ export const MonoLabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#
   ref: ref
 })));
 MonoLabelXSmall.displayName = 'MonoLabelXSmall';
-export const MonoParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoparagraphlarge",
   as: props.as || 'p'
 }, props, {
@@ -289,7 +388,10 @@ export const MonoParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) =>
   ref: ref
 })));
 MonoParagraphLarge.displayName = 'MonoParagraphLarge';
-export const MonoParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoparagraphmedium",
   as: props.as || 'p'
 }, props, {
@@ -298,7 +400,10 @@ export const MonoParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) =>
   ref: ref
 })));
 MonoParagraphMedium.displayName = 'MonoParagraphMedium';
-export const MonoParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoparagraphsmall",
   as: props.as || 'p'
 }, props, {
@@ -307,7 +412,10 @@ export const MonoParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
   ref: ref
 })));
 MonoParagraphSmall.displayName = 'MonoParagraphSmall';
-export const MonoParagraphXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Block, _extends({
+export const MonoParagraphXSmall = /*#__PURE__*/React.forwardRef((props, ref) =>
+/*#__PURE__*/
+// $FlowExpectedError[cannot-spread-inexact]
+React.createElement(Block, _extends({
   "data-baseweb": "typo-monoparagraphxsmall",
   as: props.as || 'p'
 }, props, {

package/es/utils/deep-merge.js

@@ -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.
 */
 
-/* eslint-disable flowtype/no-weak-types */
+/* flowlint unclear-type:off */
 export default function deepMerge(target, ...sources) {
   target = target || {};
   const len = sources.length;
@@ -32,7 +32,7 @@ export default function deepMerge(target, ...sources) {
 
   return target;
 }
-/* eslint-enable flowtype/no-weak-types */
+/* flowlint unclear-type:error */
 
 /* eslint-disable-next-line flowtype/no-weak-types */
 

package/es/utils/deprecated-component.js

@@ -6,11 +6,11 @@ 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.
 */
-import * as React from 'react'; // eslint-disable-next-line flowtype/no-weak-types
+import * as React from 'react'; // flowlint-next-line unclear-type:off
 
 export default function (Component, displayName) {
-  // eslint-disable-next-line flowtype/no-weak-types
-  return /*#__PURE__*/React.forwardRef((props, ref) => {
+  // flowlint-next-line unclear-type:off
+  const DeprecatedComponent = /*#__PURE__*/React.forwardRef((props, ref) => {
     if (process.env.NODE_ENV !== "production") {
       console.warn(`We have stabilized the ${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!`);
     }
@@ -19,4 +19,6 @@ export default function (Component, displayName) {
       ref: ref
     }));
   });
+  DeprecatedComponent.displayName = 'DeprecatedComponent';
+  return DeprecatedComponent;
 }