baseui 10.9.2 → 10.11.1

package/esm/a11y/a11y.js

@@ -170,7 +170,7 @@ export default function A11y(props) {
 
     return (
       /*#__PURE__*/
-      // eslint-disable-next-line flowtype/no-weak-types
+      // flowlint-next-line unclear-type:off
       React.createElement(Violation, {
         target: node,
         violations: violations,

package/esm/accordion/accordion.js

@@ -86,7 +86,8 @@ var Accordion = /*#__PURE__*/function (_React$Component) {
 
   _createClass(Accordion, [{
     key: "onPanelChange",
-    value: function onPanelChange(key, onChange) {
+    value: //flowlint-next-line unclear-type:off
+    function onPanelChange(key, onChange) {
       var activeKeys = this.state.expanded;
       var accordion = this.props.accordion;
 
@@ -138,7 +139,7 @@ var Accordion = /*#__PURE__*/function (_React$Component) {
           children = _this$props2.children,
           renderPanelContent = _this$props2.renderPanelContent,
           renderAll = _this$props2.renderAll,
-          overrides = _this$props2.overrides; // eslint-disable-next-line flowtype/no-weak-types
+          overrides = _this$props2.overrides; // flowlint-next-line unclear-type:off
 
       return React.Children.map(children, function (child, index) {
         if (!child) return; // If there is no key provided use the panel order as a default key

package/esm/accordion/panel.js

@@ -105,7 +105,7 @@ var Panel = function Panel(_ref) {
     }
 
     typeof onKeyDown === 'function' && onKeyDown(e);
-  }, [expanded, disabled, onChange, onKeyDown]); // eslint-disable-next-line flowtype/no-weak-types
+  }, [expanded, disabled, onChange, onKeyDown]); // flowlint-next-line unclear-type:off
 
   var _animateRef = React.useRef(null);
 

package/esm/app-nav-bar/mobile-menu.js

@@ -49,7 +49,8 @@ import UserProfileTile from './user-profile-tile.js';
 import { defaultMapItemToNode } from './utils.js';
 var USER_TITLE_ITEM = 'USER_TITLE_ITEM';
 var USER_MENU_ITEM = 'USER_MENU_ITEM';
-var PARENT_MENU_ITEM = 'PARENT_MENU_ITEM';
+var PARENT_MENU_ITEM = 'PARENT_MENU_ITEM'; // eslint-disable-next-line react/display-name
+
 var MobileNavMenuItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var item = props.item,
       _props$mapItemToNode = props.mapItemToNode,
@@ -129,21 +130,18 @@ export default function MobileMenu(props) {
   var _getOverrides3 = getOverrides(overrides.SideMenuButton, Button),
       _getOverrides4 = _slicedToArray(_getOverrides3, 2),
       SideMenuButton = _getOverrides4[0],
-      sideMenuButtonProps = _getOverrides4[1]; // $FlowFixMe
-
+      sideMenuButtonProps = _getOverrides4[1];
 
   sideMenuButtonProps.overrides = mergeOverrides({
     BaseButton: {
       component: StyledSideMenuButton
     }
-  }, // $FlowFixMe
-  sideMenuButtonProps.overrides);
+  }, sideMenuButtonProps.overrides);
 
   var _getOverrides5 = getOverrides(overrides.MobileDrawer, Drawer),
       _getOverrides6 = _slicedToArray(_getOverrides5, 2),
       MobileDrawer = _getOverrides6[0],
-      drawerProps = _getOverrides6[1]; // $FlowFixMe
-
+      drawerProps = _getOverrides6[1];
 
   drawerProps.overrides = mergeOverrides({
     DrawerBody: {
@@ -161,14 +159,12 @@ export default function MobileMenu(props) {
     Close: function Close() {
       return null;
     }
-  }, // $FlowFixMe
-  drawerProps.overrides);
+  }, drawerProps.overrides);
 
   var _getOverrides7 = getOverrides(overrides.MobileMenu, StatefulMenu),
       _getOverrides8 = _slicedToArray(_getOverrides7, 2),
       MobileMenu = _getOverrides8[0],
-      menuProps = _getOverrides8[1]; // $FlowFixMe
-
+      menuProps = _getOverrides8[1];
 
   menuProps.overrides = mergeOverrides({
     List: {
@@ -179,6 +175,7 @@ export default function MobileMenu(props) {
         boxShadow: 'none'
       }
     },
+    // eslint-disable-next-line react/display-name
     ListItem: /*#__PURE__*/React.forwardRef(function (listItemProps, ref) {
       return /*#__PURE__*/React.createElement(MobileNavMenuItem, _extends({
         ref: ref
@@ -187,8 +184,7 @@ export default function MobileMenu(props) {
         overrides: overrides
       }));
     })
-  }, // $FlowFixMe
-  menuProps.overrides);
+  }, menuProps.overrides);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SideMenuButton, _extends({
     onClick: toggleMenu
   }, sideMenuButtonProps), /*#__PURE__*/React.createElement(MenuIcon, {

package/esm/app-nav-bar/user-menu.js

@@ -34,7 +34,8 @@ import { StatefulPopover, PLACEMENT, TRIGGER_TYPE } from '../popover/index.js';
 import { StyledUserMenuButton, StyledUserMenuProfileListItem } from './styled-components.js';
 import UserProfileTile from './user-profile-tile.js';
 import { defaultMapItemToNode } from './utils.js';
-var MENU_ITEM_WIDTH = '275px';
+var MENU_ITEM_WIDTH = '275px'; // eslint-disable-next-line react/display-name
+
 var UserMenuListItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var item = props.item,
       _props$mapItemToNode = props.mapItemToNode,
@@ -76,24 +77,22 @@ export default function UserMenuComponent(props) {
   var _getOverrides3 = getOverrides(overrides.UserMenuButton, Button),
       _getOverrides4 = _slicedToArray(_getOverrides3, 2),
       UserMenuButton = _getOverrides4[0],
-      userMenuButtonProps = _getOverrides4[1]; // $FlowFixMe
-
+      userMenuButtonProps = _getOverrides4[1];
 
   userMenuButtonProps.overrides = mergeOverrides({
     BaseButton: {
       component: StyledUserMenuButton
     }
-  }, // $FlowFixMe
-  userMenuButtonProps.overrides);
+  }, userMenuButtonProps.overrides);
 
   var _getOverrides5 = getOverrides(overrides.UserMenu, StatefulMenu),
       _getOverrides6 = _slicedToArray(_getOverrides5, 2),
       UserMenu = _getOverrides6[0],
-      userMenuProps = _getOverrides6[1]; // $FlowFixMe
-
+      userMenuProps = _getOverrides6[1];
 
   userMenuProps.overrides = mergeOverrides({
     List: {
+      // eslint-disable-next-line react/display-name
       component: /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
         var children = _ref2.children,
             restProps = _objectWithoutProperties(_ref2, ["children"]);
@@ -111,6 +110,7 @@ export default function UserMenuComponent(props) {
         width: MENU_ITEM_WIDTH
       }
     },
+    // eslint-disable-next-line react/display-name
     ListItem: /*#__PURE__*/React.forwardRef(function (listItemProps, ref) {
       return /*#__PURE__*/React.createElement(UserMenuListItem, _extends({
         ref: ref
@@ -118,8 +118,7 @@ export default function UserMenuComponent(props) {
         mapItemToNode: props.mapItemToNode
       }));
     })
-  }, // $FlowFixMe
-  userMenuProps.overrides);
+  }, userMenuProps.overrides);
   return /*#__PURE__*/React.createElement(StatefulPopover, {
     content: function content(_ref3) {
       var close = _ref3.close;

package/esm/aspect-ratio-box/aspect-ratio-box.js

@@ -49,9 +49,9 @@ var AspectRatioBox = function AspectRatioBox(_ref2) {
     }
   };
   var blockOverrides = mergeOverrides(aspectRatioBoxOverrides, overrides);
-  return /*#__PURE__*/React.createElement(Block // coerced to any because because of how react components are typed.
+  return /*#__PURE__*/React.createElement(Block // coerced to any because of how react components are typed.
   // cannot guarantee an html element
-  // eslint-disable-next-line flowtype/no-weak-types
+  // flowlint-next-line unclear-type:off
   , _extends({
     ref: forwardedRef,
     overrides: blockOverrides,

package/esm/block/block.js

@@ -107,7 +107,7 @@ function Block(_ref) {
 
   return /*#__PURE__*/React.createElement(BaseBlock // coerced to any because because of how react components are typed.
   // cannot guarantee an html element
-  // eslint-disable-next-line flowtype/no-weak-types
+  // flowlint-next-line unclear-type:off
   , _extends({
     ref: forwardedRef,
     $as: as,

package/esm/breadcrumbs/breadcrumbs.js

@@ -23,7 +23,7 @@ import { LocaleContext } from '../locale/index.js';
 import { ThemeContext } from '../styles/theme-provider.js';
 import ChevronRight from '../icon/chevron-right.js';
 import ChevronLeft from '../icon/chevron-left.js';
-import { StyledRoot, StyledSeparator, StyledList, StyledListItem } from './styled-components.js';
+import { StyledList, StyledListItem, StyledRoot, StyledSeparator } from './styled-components.js';
 import { getOverrides, mergeOverrides } from '../helpers/overrides.js';
 export function Breadcrumbs(props) {
   var _props$overrides = props.overrides,
@@ -62,16 +62,13 @@ export function Breadcrumbs(props) {
       Separator = _getOverrides12[0],
       baseSeparatorProps = _getOverrides12[1];
 
-  var iconOverrides = mergeOverrides({
+  baseIconProps.overrides = mergeOverrides({
     Svg: {
       style: {
         verticalAlign: 'text-bottom'
       }
     }
-  }, // $FlowFixMe
-  baseIconProps && baseIconProps.overrides); // $FlowFixMe
-
-  baseIconProps.overrides = iconOverrides;
+  }, baseIconProps && baseIconProps.overrides);
   childrenArray.forEach(function (child, index) {
     childrenWithSeparators.push( /*#__PURE__*/React.createElement(ListItem, _extends({
       key: "breadcrumb-item-".concat(index),
@@ -84,7 +81,7 @@ export function Breadcrumbs(props) {
   });
   return /*#__PURE__*/React.createElement(LocaleContext.Consumer, null, function (locale) {
     return /*#__PURE__*/React.createElement(Root, _extends({
-      "aria-label": props.ariaLabel || locale.breadcrumbs.ariaLabel,
+      "aria-label": props['aria-label'] || props.ariaLabel || locale.breadcrumbs.ariaLabel,
       "data-baseweb": "breadcrumbs"
     }, baseRootProps), /*#__PURE__*/React.createElement(List, baseListProps, childrenWithSeparators));
   });

package/esm/button/button.js

@@ -179,7 +179,8 @@ var Button = /*#__PURE__*/function (_React$Component) {
 
 _defineProperty(Button, "defaultProps", defaultProps);
 
-var ForwardedButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
+var ForwardedButton = /*#__PURE__*/React.forwardRef( //$FlowFixMe
+function (props, ref) {
   return /*#__PURE__*/React.createElement(Button, _extends({
     forwardedRef: ref
   }, props));

package/esm/button/styled-components.js

@@ -15,6 +15,7 @@ import { KIND, SIZE, SHAPE } from './constants.js';
 export var BaseButton = styled('button', function (_ref) {
   var $theme = _ref.$theme,
       $size = _ref.$size,
+      $colors = _ref.$colors,
       $kind = _ref.$kind,
       $shape = _ref.$shape,
       $isLoading = _ref.$isLoading,
@@ -66,14 +67,14 @@ export var BaseButton = styled('button', function (_ref) {
     $theme: $theme,
     $size: $size,
     $shape: $shape
-  })), getKindStyles({
+  })), getColorStyles({
     $theme: $theme,
+    $colors: $colors,
     $kind: $kind,
     $isLoading: $isLoading,
     $isSelected: $isSelected,
     $disabled: $disabled
   })), getShapeStyles({
-    $theme: $theme,
     $shape: $shape,
     $size: $size
   }));
@@ -337,13 +338,27 @@ function getPaddingStyles(_ref12) {
   }
 }
 
-function getKindStyles(_ref13) {
+function getColorStyles(_ref13) {
   var $theme = _ref13.$theme,
+      $colors = _ref13.$colors,
       $isLoading = _ref13.$isLoading,
       $isSelected = _ref13.$isSelected,
       $kind = _ref13.$kind,
       $disabled = _ref13.$disabled;
 
+  if ($colors) {
+    return {
+      color: $colors.color,
+      backgroundColor: $colors.backgroundColor,
+      ':hover': {
+        boxShadow: 'inset 999px 999px 0px rgba(0, 0, 0, 0.04)'
+      },
+      ':active': {
+        boxShadow: 'inset 999px 999px 0px rgba(0, 0, 0, 0.08)'
+      }
+    };
+  }
+
   if ($disabled) {
     return Object.freeze({});
   }
@@ -431,8 +446,7 @@ function getKindStyles(_ref13) {
 }
 
 function getShapeStyles(_ref14) {
-  var $theme = _ref14.$theme,
-      $shape = _ref14.$shape,
+  var $shape = _ref14.$shape,
       $size = _ref14.$size;
 
   if ($shape === SHAPE.circle || $shape === SHAPE.square) {

package/esm/button/utils.js

@@ -5,13 +5,15 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 export function getSharedProps(_ref) {
-  var disabled = _ref.disabled,
+  var colors = _ref.colors,
+      disabled = _ref.disabled,
       isLoading = _ref.isLoading,
       isSelected = _ref.isSelected,
       kind = _ref.kind,
       shape = _ref.shape,
       size = _ref.size;
   return {
+    $colors: colors,
     $disabled: disabled,
     $isLoading: isLoading,
     $isSelected: isSelected,

package/esm/button-group/button-group.js

@@ -97,7 +97,6 @@ var ButtonGroup = /*#__PURE__*/function (_React$Component) {
           _this$props$mode = _this$props.mode,
           mode = _this$props$mode === void 0 ? MODE.checkbox : _this$props$mode,
           children = _this$props.children,
-          ariaLabel = _this$props.ariaLabel,
           selected = _this$props.selected,
           disabled = _this$props.disabled,
           _onClick = _this$props.onClick,
@@ -110,6 +109,7 @@ var ButtonGroup = /*#__PURE__*/function (_React$Component) {
           Root = _getOverrides2[0],
           rootProps = _getOverrides2[1];
 
+      var ariaLabel = this.props['aria-label'] || this.props.ariaLabel;
       var isRadio = mode === MODE.radio;
       var numItems = React.Children.count(children);
       return /*#__PURE__*/React.createElement(LocaleContext.Consumer, null, function (locale) {

package/esm/button-group/stateful-button-group.js

@@ -23,6 +23,10 @@ export default function StatefulButtonGroup(props) {
   }, restProps), function (_ref) {
     var containerProps = _extends({}, _ref);
 
-    return /*#__PURE__*/React.createElement(ButtonGroup, containerProps, props.children);
+    return (
+      /*#__PURE__*/
+      //$FlowFixMe
+      React.createElement(ButtonGroup, containerProps, props.children)
+    );
   });
 }

package/esm/checkbox/checkbox.js

@@ -174,8 +174,7 @@ var StatelessCheckbox = /*#__PURE__*/function (_React$Component) {
           checked = _this$props2.checked,
           children = _this$props2.children,
           required = _this$props2.required,
-          title = _this$props2.title,
-          ariaLabel = _this$props2.ariaLabel;
+          title = _this$props2.title;
       var RootOverride = overrides.Root,
           CheckmarkOverride = overrides.Checkmark,
           LabelOverride = overrides.Label,
@@ -236,7 +235,7 @@ var StatelessCheckbox = /*#__PURE__*/function (_React$Component) {
         name: name,
         checked: checked,
         required: required,
-        "aria-label": ariaLabel,
+        "aria-label": this.props['aria-label'] || this.props.ariaLabel,
         "aria-checked": isIndeterminate ? 'mixed' : checked,
         "aria-describedby": this.props['aria-describedby'],
         "aria-errormessage": this.props['aria-errormessage'],

package/esm/combobox/combobox.js

@@ -198,7 +198,7 @@ function Combobox(props) {
     if (listboxRef.current && event.relatedTarget && // NOTE(chase): Contains method expects a Node type, but relatedTarget is
     // EventTarget which is a super type of Node. Passing an EventTarget seems
     // to work fine, assuming the flow type is too strict.
-    // eslint-disable-next-line flowtype/no-weak-types
+    // flowlint-next-line unclear-type:off
     listboxRef.current.contains(event.relatedTarget)) {
       return;
     }
@@ -290,7 +290,7 @@ function Combobox(props) {
       popoverOverrides = _getOverrides12$$over === void 0 ? {} : _getOverrides12$$over,
       restPopoverProps = _objectWithoutProperties(_getOverrides12$, ["overrides"]);
 
-  return /*#__PURE__*/React.createElement(Root // eslint-disable-next-line flowtype/no-weak-types
+  return /*#__PURE__*/React.createElement(Root // flowlint-next-line unclear-type:off
   , _extends({
     ref: rootRef
   }, rootProps), /*#__PURE__*/React.createElement(OverriddenPopover // React-focus-lock used in Popover used to skip non-tabbable elements (`tabIndex=-1`) elements for focus, we had ListBox with tabIndex to disable focus on
@@ -305,7 +305,7 @@ function Combobox(props) {
     content: /*#__PURE__*/React.createElement(ListBox // TabIndex attribute exists to exclude option clicks from triggering onBlur event actions.
     , _extends({
       tabIndex: "-1",
-      id: listboxId // eslint-disable-next-line flowtype/no-weak-types
+      id: listboxId // flowlint-next-line unclear-type:off
       ,
       ref: listboxRef,
       role: "listbox",
@@ -325,7 +325,7 @@ function Combobox(props) {
           key: index,
           onClick: function onClick() {
             return handleOptionClick(index);
-          } // eslint-disable-next-line flowtype/no-weak-types
+          } // flowlint-next-line unclear-type:off
           ,
           ref: isSelected ? selectedOptionRef : null,
           role: "option",

package/esm/data-table/column-custom.js

@@ -14,6 +14,7 @@ import Column from './column.js';
 import { COLUMNS } from './constants.js';
 
 function CustomColumn(options) {
+  //$FlowFixMe
   return Column(_objectSpread({
     kind: COLUMNS.CUSTOM
   }, options));

package/esm/data-table/column-datetime.js

@@ -233,7 +233,7 @@ function DatetimeFilter(props) {
   var _React$useState7 = React.useState([initialState.categoricalOperator]),
       _React$useState8 = _slicedToArray(_React$useState7, 2),
       categoricalOperator = _React$useState8[0],
-      setCategoricalOperator = _React$useState8[1]; // eslint-disable-next-line flowtype/no-weak-types
+      setCategoricalOperator = _React$useState8[1]; // flowlint-next-line unclear-type:off
 
 
   var _React$useState9 = React.useState(initialState.rangeDates.length ? initialState.rangeDates : [new Date(datesSorted[0]), new Date(datesSorted[datesSorted.length - 1])]),
@@ -275,7 +275,7 @@ function DatetimeFilter(props) {
     },
     onApply: function onApply() {
       if (isRange) {
-        // eslint-disable-next-line flowtype/no-weak-types
+        // flowlint-next-line unclear-type:off
         var op = rangeOperator[0].id;
         var description = '';
 
@@ -307,7 +307,7 @@ function DatetimeFilter(props) {
       }
 
       if (isCategorical) {
-        // eslint-disable-next-line flowtype/no-weak-types
+        // flowlint-next-line unclear-type:off
         var _op = categoricalOperator[0].id;
         var selection = [];
         var operatorLocaleLabelKey = '';
@@ -400,7 +400,7 @@ function DatetimeFilter(props) {
     value: rangeOperator,
     onChange: function onChange(params) {
       return setRangeOperator(params.value);
-    } // eslint-disable-next-line flowtype/no-weak-types
+    } // flowlint-next-line unclear-type:off
     ,
     mountNode: mountNode.current,
     options: RANGE_OPERATIONS.map(function (op) {
@@ -415,7 +415,7 @@ function DatetimeFilter(props) {
     className: css({
       paddingTop: theme.sizing.scale600
     })
-  }, (rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATETIME || rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATE) && /*#__PURE__*/React.createElement(Datepicker // eslint-disable-next-line flowtype/no-weak-types
+  }, (rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATETIME || rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATE) && /*#__PURE__*/React.createElement(Datepicker // flowlint-next-line unclear-type:off
   , {
     mountNode: mountNode.current,
     value: rangeDates,
@@ -487,7 +487,7 @@ function DatetimeFilter(props) {
         label: locale.datatable[op.localeLabelKey],
         id: op.id
       };
-    }) // eslint-disable-next-line flowtype/no-weak-types
+    }) // flowlint-next-line unclear-type:off
     ,
     mountNode: mountNode.current,
     size: "compact",