baseui 10.10.0 → 10.11.0

package/map-marker/floating-marker.js.flow

@@ -6,15 +6,15 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import * as React from 'react';
-import {useStyletron} from '../styles/index.js';
+import { useStyletron } from '../styles/index.js';
 import PinHead from './pin-head.js';
-import {getOverrides} from '../helpers/overrides.js';
+import { getOverrides } from '../helpers/overrides.js';
 import {
   StyledFloatingMarkerRoot,
   StyledFloatingMarkerAnchorContainer,
   StyledFloatingMarkerPinHeadContainer,
 } from './styled-components.js';
-import type {FloatingMarkerPropsT} from './types.js';
+import type { FloatingMarkerPropsT } from './types.js';
 import {
   FLOATING_MARKER_ANCHOR_POSITIONS,
   PINHEAD_SIZES_SHAPES,
@@ -46,29 +46,20 @@ const FloatingMarker = ({
 }: FloatingMarkerPropsT) => {
   const [, theme] = useStyletron();
   const {
-    colors: {backgroundPrimary, backgroundInversePrimary, primaryA, primaryB},
+    colors: { backgroundPrimary, backgroundInversePrimary, primaryA, primaryB },
   } = theme;
 
   const anchorPinHeadSize = getAnchorPinHeadSize(anchorType);
 
-  const [Root, rootProps] = getOverrides(
-    overrides.Root,
-    StyledFloatingMarkerRoot,
-  );
-  const [
-    FloatingMarkerPinHeadContainer,
-    floatingMarkerPinHeadContainerProps,
-  ] = getOverrides(
+  const [Root, rootProps] = getOverrides(overrides.Root, StyledFloatingMarkerRoot);
+  const [FloatingMarkerPinHeadContainer, floatingMarkerPinHeadContainerProps] = getOverrides(
     overrides.PinHeadContainer,
-    StyledFloatingMarkerPinHeadContainer,
+    StyledFloatingMarkerPinHeadContainer
   );
 
-  const [
-    FloatingMarkerAnchorContainer,
-    floatingMarkerAnchorContainerProps,
-  ] = getOverrides(
+  const [FloatingMarkerAnchorContainer, floatingMarkerAnchorContainerProps] = getOverrides(
     overrides.AnchorContainer,
-    StyledFloatingMarkerAnchorContainer,
+    StyledFloatingMarkerAnchorContainer
   );
 
   return (

package/map-marker/index.js.flow

@@ -5,8 +5,8 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 // @flow
-export {default as FixedMarker} from './fixed-marker.js';
-export {default as FloatingMarker} from './floating-marker.js';
+export { default as FixedMarker } from './fixed-marker.js';
+export { default as FloatingMarker } from './floating-marker.js';
 
 export {
   FLOATING_MARKER_ANCHOR_POSITIONS,

package/map-marker/label-enhancer.js.flow

@@ -6,14 +6,14 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import * as React from 'react';
-import {getOverrides} from '../helpers/overrides.js';
+import { getOverrides } from '../helpers/overrides.js';
 import {
   RelativeContainer,
   StyledStrokedLabel,
   StyledStrokedLabelContainer,
 } from './styled-components.js';
-import {LABEL_ENHANCER_POSITIONS} from './constants.js';
-import type {LabelEhancerComponentT} from './types.js';
+import { LABEL_ENHANCER_POSITIONS } from './constants.js';
+import type { LabelEhancerComponentT } from './types.js';
 
 const LabelEnhancer = ({
   labelEnhancerContent,
@@ -22,10 +22,7 @@ const LabelEnhancer = ({
   size,
   overrides = {},
 }: LabelEhancerComponentT) => {
-  if (
-    !labelEnhancerPosition ||
-    labelEnhancerPosition === LABEL_ENHANCER_POSITIONS.none
-  ) {
+  if (!labelEnhancerPosition || labelEnhancerPosition === LABEL_ENHANCER_POSITIONS.none) {
     return null;
   }
   if (!labelEnhancerContent) {
@@ -34,12 +31,12 @@ const LabelEnhancer = ({
 
   const [StrokedLabelContainer, strokedLabelContainerProps] = getOverrides(
     overrides.LabelEnhancerContainer,
-    StyledStrokedLabelContainer,
+    StyledStrokedLabelContainer
   );
 
   const [StrokedLabel, strokedLabelProps] = getOverrides(
     overrides.LabelEnhancer,
-    StyledStrokedLabel,
+    StyledStrokedLabel
   );
   return (
     <StrokedLabelContainer

package/map-marker/needle.js.flow

@@ -6,20 +6,14 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import * as React from 'react';
-import {getOverrides} from '../helpers/overrides.js';
-import {NEEDLE_HEIGHTS} from './constants.js';
-import {StyledNeedle} from './styled-components.js';
-import type {NeedlePropsT} from './types.js';
+import { getOverrides } from '../helpers/overrides.js';
+import { NEEDLE_HEIGHTS } from './constants.js';
+import { StyledNeedle } from './styled-components.js';
+import type { NeedlePropsT } from './types.js';
 
-const Needle = ({size, background, overrides = {}}: NeedlePropsT) => {
+const Needle = ({ size, background, overrides = {} }: NeedlePropsT) => {
   const [Needle, needleProps] = getOverrides(overrides.Needle, StyledNeedle);
-  return (
-    <Needle
-      $background={background}
-      $height={NEEDLE_HEIGHTS[size]}
-      {...needleProps}
-    />
-  );
+  return <Needle $background={background} $height={NEEDLE_HEIGHTS[size]} {...needleProps} />;
 };
 
 export default Needle;

package/map-marker/pin-head.js.flow

@@ -6,7 +6,7 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import * as React from 'react';
-import {getOverrides} from '../helpers/overrides.js';
+import { getOverrides } from '../helpers/overrides.js';
 import {
   StyledInnerXXSmallAnchor,
   StyledOuterXXSmallAnchor,
@@ -25,7 +25,7 @@ import {
 } from './constants.js';
 import BadgeEnhancer from './badge-enhancer.js';
 import LabelEnhancer from './label-enhancer.js';
-import type {PinHeadPropsT} from './types.js';
+import type { PinHeadPropsT } from './types.js';
 
 const PinHead = ({
   size = PINHEAD_SIZES_SHAPES.medium,
@@ -44,36 +44,30 @@ const PinHead = ({
 
   overrides = {},
 }: PinHeadPropsT) => {
-  const activeElements = [label, StartEnhancer, EndEnhancer].filter(x => x);
+  const activeElements = [label, StartEnhancer, EndEnhancer].filter((x) => x);
   const gridTemplateColumns = activeElements.map(() => 'auto').join(' ');
   const forceCircle = activeElements.length === 1 && !label;
-  const {height, icon} = PINHEAD_DIMENSIONS[size];
+  const { height, icon } = PINHEAD_DIMENSIONS[size];
 
-  const [PinHead, pinHeadProps] = getOverrides(
-    overrides.PinHead,
-    StyledPinHead,
-  );
-  const [ContentItem, contentItemProps] = getOverrides(
-    overrides.PinHeadContent,
-    StyledContentItem,
-  );
+  const [PinHead, pinHeadProps] = getOverrides(overrides.PinHead, StyledPinHead);
+  const [ContentItem, contentItemProps] = getOverrides(overrides.PinHeadContent, StyledContentItem);
 
   const [InnerXXSmallAnchor, innerXXSmallAnchorProps] = getOverrides(
     overrides.InnerAnchor,
-    StyledInnerXXSmallAnchor,
+    StyledInnerXXSmallAnchor
   );
   const [OuterXXSmallAnchor, outerXXSmallAnchorProps] = getOverrides(
     overrides.OuterAnchor,
-    StyledOuterXXSmallAnchor,
+    StyledOuterXXSmallAnchor
   );
 
   const [InnerXSmallAnchor, innerXSmallAnchorProps] = getOverrides(
     overrides.InnerAnchor,
-    StyledInnerXSmallAnchor,
+    StyledInnerXSmallAnchor
   );
   const [OuterXSmallAnchor, outerXSmallAnchorProps] = getOverrides(
     overrides.OuterAnchor,
-    StyledOuterXSmallAnchor,
+    StyledOuterXSmallAnchor
   );
 
   const badge = (
@@ -87,8 +81,7 @@ const PinHead = ({
   );
   if (
     type === PINHEAD_TYPES.fixed &&
-    (size === PINHEAD_SIZES_SHAPES.xxSmallCircle ||
-      size === PINHEAD_SIZES_SHAPES.xxSmallSquare)
+    (size === PINHEAD_SIZES_SHAPES.xxSmallCircle || size === PINHEAD_SIZES_SHAPES.xxSmallSquare)
   ) {
     const round = size === PINHEAD_SIZES_SHAPES.xxSmallCircle;
     return (
@@ -110,8 +103,7 @@ const PinHead = ({
 
   if (
     type === PINHEAD_TYPES.fixed &&
-    (size === PINHEAD_SIZES_SHAPES.xSmallSquare ||
-      size === PINHEAD_SIZES_SHAPES.xSmallCircle)
+    (size === PINHEAD_SIZES_SHAPES.xSmallSquare || size === PINHEAD_SIZES_SHAPES.xSmallCircle)
   ) {
     const round = size === PINHEAD_SIZES_SHAPES.xSmallCircle;
     return (
@@ -153,32 +145,17 @@ const PinHead = ({
         {...pinHeadProps}
       >
         {StartEnhancer && (
-          <ContentItem
-            $height={height}
-            $color={color}
-            $size={size}
-            {...contentItemProps}
-          >
+          <ContentItem $height={height} $color={color} $size={size} {...contentItemProps}>
             <StartEnhancer size={icon} />
           </ContentItem>
         )}
         {label && (
-          <ContentItem
-            $height={height}
-            $color={color}
-            $size={size}
-            {...contentItemProps}
-          >
+          <ContentItem $height={height} $color={color} $size={size} {...contentItemProps}>
             {label}
           </ContentItem>
         )}
         {EndEnhancer && (
-          <ContentItem
-            $height={height}
-            $color={color}
-            $size={size}
-            {...contentItemProps}
-          >
+          <ContentItem $height={height} $color={color} $size={size} {...contentItemProps}>
             <EndEnhancer size={icon} />
           </ContentItem>
         )}

package/map-marker/styled-components.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
-import {styled} from '../styles/index.js';
+import { styled } from '../styles/index.js';
 import {
   BADGE_ENHANCER_STYLES,
   FLOATING_MARKER_ANCHOR_POSITIONS,
@@ -20,10 +20,7 @@ import type {
   PinHeadSizeT,
 } from './types.js';
 
-export const getAnchorTransform = (
-  anchor: AnchorPositionsT,
-  anchorSize: number,
-) =>
+export const getAnchorTransform = (anchor: AnchorPositionsT, anchorSize: number) =>
   ({
     [FLOATING_MARKER_ANCHOR_POSITIONS.none]: ``,
     [FLOATING_MARKER_ANCHOR_POSITIONS.topLeft]: `translate(${anchorSize}px, ${anchorSize}px)`,
@@ -36,7 +33,7 @@ export const StyledDragShadowContainer = styled<{
   $height: number,
   $width: number,
   $dragging: boolean,
-}>('div', ({$theme, $height, $width, $dragging}) => ({
+}>('div', ({ $theme, $height, $width, $dragging }) => ({
   width: `${$width}px`,
   height: `${$height}px`,
   opacity: $dragging ? 1 : 0,
@@ -49,7 +46,7 @@ export const StyledDragShadowContainer = styled<{
 export const StyledDragShadow = styled<{
   $background: string,
   $width: number,
-}>('div', ({$theme, $background, $width}) => ({
+}>('div', ({ $theme, $background, $width }) => ({
   backgroundColor: $background,
   borderRadius: '50%',
   width: `${$width}px`,
@@ -61,7 +58,7 @@ export const StyledDragShadow = styled<{
 export const StyledNeedle = styled<{
   $background?: string,
   $height: number,
-}>('div', ({$theme, $background, $height}) => ({
+}>('div', ({ $theme, $background, $height }) => ({
   backgroundColor: $background,
   width: '4px',
   height: `${$height}px`,
@@ -70,7 +67,7 @@ export const StyledNeedle = styled<{
 
 export const StyledFloatingMarkerRoot = styled<{
   $size: number,
-}>('div', ({$size}) => ({
+}>('div', ({ $size }) => ({
   position: 'relative',
   height: `${$size}px`,
   width: `${$size}px`,
@@ -79,7 +76,7 @@ export const StyledFloatingMarkerRoot = styled<{
 export const StyledFloatingMarkerPinHeadContainer = styled<{
   $anchor: AnchorPositionsT,
   $anchorSize: number,
-}>('div', ({$theme, $anchor, $anchorSize}) => ({
+}>('div', ({ $theme, $anchor, $anchorSize }) => ({
   position: 'absolute',
   transition: `${$theme.animation.timing300} ${$theme.animation.easeOutCurve} all`,
   transform: getAnchorTransform($anchor, $anchorSize),
@@ -98,11 +95,9 @@ export const StyledFixedMarkerRoot = styled<{}>('div', () => ({
 export const StyledFixedMarkerDragContainer = styled<{
   $translateAmount: number,
   $performTranslate: boolean,
-}>('div', ({$theme, $translateAmount, $performTranslate}) => {
+}>('div', ({ $theme, $translateAmount, $performTranslate }) => {
   return {
-    transform: `translateY(${
-      $performTranslate ? `${$translateAmount}px` : '0px'
-    })`,
+    transform: `translateY(${$performTranslate ? `${$translateAmount}px` : '0px'})`,
     transition: `${$theme.animation.timing300} ${$theme.animation.easeOutCurve} all`,
     display: 'flex',
     alignItems: 'center',
@@ -114,7 +109,7 @@ export const StyledOuterXXSmallAnchor = styled<{
   $round: boolean,
   $background: string,
   $size: number,
-}>('div', ({$theme, $round, $background, $size}) => ({
+}>('div', ({ $theme, $round, $background, $size }) => ({
   backgroundColor: $background,
   display: 'flex',
   alignItems: 'center',
@@ -129,7 +124,7 @@ export const StyledInnerXXSmallAnchor = styled<{
   $round: boolean,
   $color: string,
   $size: number,
-}>('div', ({$round, $color, $size}) => ({
+}>('div', ({ $round, $color, $size }) => ({
   backgroundColor: $color,
   height: `${$size}px`,
   width: `${$size}px`,
@@ -140,7 +135,7 @@ export const StyledOuterXSmallAnchor = styled<{
   $round: boolean,
   $background: string,
   $size: number,
-}>('div', ({$theme, $round, $background, $size}) => ({
+}>('div', ({ $theme, $round, $background, $size }) => ({
   backgroundColor: $background,
   display: 'flex',
   alignItems: 'center',
@@ -155,7 +150,7 @@ export const StyledInnerXSmallAnchor = styled<{
   $round: boolean,
   $color: string,
   $size: number,
-}>('div', ({$round, $color, $size}) => ({
+}>('div', ({ $round, $color, $size }) => ({
   backgroundColor: $color,
   height: `${$size}px`,
   width: `${$size}px`,
@@ -168,49 +163,39 @@ export const StyledPinHead = styled<{
   $gridTemplateColumns: string,
   $type: string,
   $forceCircle: boolean,
-}>(
-  'div',
-  ({
-    $theme,
-    $height,
-    $background,
-    $gridTemplateColumns,
-    $type,
-    $forceCircle,
-  }) => {
-    const sharedStyles = {
-      fixed: {
-        padding: '0px 12px',
-        borderRadius: `${$height}px`,
-      },
-      floating: {
-        padding: '0px 8px',
-      },
-    };
+}>('div', ({ $theme, $height, $background, $gridTemplateColumns, $type, $forceCircle }) => {
+  const sharedStyles = {
+    fixed: {
+      padding: '0px 12px',
+      borderRadius: `${$height}px`,
+    },
+    floating: {
+      padding: '0px 8px',
+    },
+  };
 
-    return {
-      backgroundColor: $background,
-      height: `${$height}px`,
-      display: 'grid',
-      gridTemplateColumns: $gridTemplateColumns,
-      gap: '8px',
-      boxShadow: $theme.lighting.shadow600,
-      whiteSpace: 'nowrap',
-      ...sharedStyles[$type],
-      ...($forceCircle && {
-        width: `${$height}px`,
-        display: 'flex',
-        justifyContent: 'center',
-        boxSizing: 'border-box',
-      }),
-    };
-  },
-);
+  return {
+    backgroundColor: $background,
+    height: `${$height}px`,
+    display: 'grid',
+    gridTemplateColumns: $gridTemplateColumns,
+    gap: '8px',
+    boxShadow: $theme.lighting.shadow600,
+    whiteSpace: 'nowrap',
+    ...sharedStyles[$type],
+    ...($forceCircle && {
+      width: `${$height}px`,
+      display: 'flex',
+      justifyContent: 'center',
+      boxSizing: 'border-box',
+    }),
+  };
+});
 
 export const StyledStrokedLabelContainer = styled<{
   $position: LabelEnhancerPositionT,
   $labelOffset: number,
-}>('div', ({$position, $theme, $labelOffset}) => {
+}>('div', ({ $position, $theme, $labelOffset }) => {
   const staticLabelOffset = 4;
   const positions = {
     top: {
@@ -256,7 +241,7 @@ export const StyledStrokedLabel = styled<{
   $stroked: boolean,
   $position: LabelEnhancerPositionT,
   $size: PinHeadSizeT,
-}>('div', ({$theme, $size}) => {
+}>('div', ({ $theme, $size }) => {
   const strokeWidth = 1.5;
   const strokeColor = $theme.colors.backgroundPrimary;
 
@@ -284,8 +269,8 @@ export const StyledStrokedLabel = styled<{
 export const StyledBadgeEnhancerRoot = styled<{
   $size: BadgeEnhancerSizeT,
   $position: BadgePositionT,
-}>('div', ({$theme, $size, $position}) => {
-  const {x, y} = $position;
+}>('div', ({ $theme, $size, $position }) => {
+  const { x, y } = $position;
   return {
     position: 'absolute',
     ...$theme.typography.LabelSmall,
@@ -310,7 +295,7 @@ export const StyledContentItem = styled<{
   $color: string,
   $height: number,
   $size: PinHeadSizeT,
-}>('div', ({$theme, $color, $height, $size}) => {
+}>('div', ({ $theme, $color, $height, $size }) => {
   return {
     ...$theme.typography[LABEL_SIZES[$size]],
     display: 'flex',

package/map-marker/types.js.flow

@@ -17,7 +17,7 @@ import {
   LABEL_ENHANCER_POSITIONS,
   KIND,
 } from './constants.js';
-import type {OverrideT} from '../helpers/overrides.js';
+import type { OverrideT } from '../helpers/overrides.js';
 
 export type AnchorPositionsT = $Values<typeof FLOATING_MARKER_ANCHOR_POSITIONS>;
 
@@ -30,9 +30,7 @@ export type PinHeadSizeT = $Values<typeof PINHEAD_SIZES_SHAPES>;
 export type FloatingMarkerSizeT = $Values<typeof FLOATING_MARKER_SIZES>;
 
 /* eslint-disable flowtype/generic-spacing*/
-export type FloatingMarkerAnchorTypeT = $Values<
-  typeof FLOATING_MARKER_ANCHOR_TYPES,
->;
+export type FloatingMarkerAnchorTypeT = $Values<typeof FLOATING_MARKER_ANCHOR_TYPES>;
 
 export type BadgeEnhancerSizeT = $Values<typeof BADGE_ENHANCER_SIZES>;
 
@@ -82,7 +80,7 @@ export type LabelEhancerComponentT = {
 
 export type BadgeEnhancerT = {|
   badgeEnhancerSize?: BadgeEnhancerSizeT | null,
-  badgeEnhancerContent?: React.AbstractComponent<{|size: number|}>,
+  badgeEnhancerContent?: React.AbstractComponent<{| size: number |}>,
 |};
 
 export type BadgeEnhancerComponentT = {
@@ -100,8 +98,8 @@ export type FixedMarkerPropsT = {|
   size?: PinHeadSizeT,
   needle?: NeedleSizeT,
   label?: string,
-  startEnhancer?: React.AbstractComponent<{|size: number|}>,
-  endEnhancer?: React.AbstractComponent<{|size: number|}>,
+  startEnhancer?: React.AbstractComponent<{| size: number |}>,
+  endEnhancer?: React.AbstractComponent<{| size: number |}>,
   kind?: KindT,
   dragging?: boolean,
   overrides?: FixedMarkerOverridesT,
@@ -129,8 +127,8 @@ export type FloatingMarkerOverridesT = {
 export type FloatingMarkerPropsT = {
   label?: string,
   anchor?: AnchorPositionsT,
-  endEnhancer?: React.AbstractComponent<{|size: number|}>,
-  startEnhancer?: React.AbstractComponent<{|size: number|}>,
+  endEnhancer?: React.AbstractComponent<{| size: number |}>,
+  startEnhancer?: React.AbstractComponent<{| size: number |}>,
   anchorType?: FloatingMarkerAnchorTypeT,
   size?: FloatingMarkerSizeT,
   overrides?: FloatingMarkerOverridesT,
@@ -139,8 +137,8 @@ export type FloatingMarkerPropsT = {
 export type PinHeadPropsT = {
   size?: PinHeadSizeT,
   label?: string,
-  endEnhancer?: React.AbstractComponent<{|size: number|}>,
-  startEnhancer?: React.AbstractComponent<{|size: number|}>,
+  endEnhancer?: React.AbstractComponent<{| size: number |}>,
+  startEnhancer?: React.AbstractComponent<{| size: number |}>,
   color: string,
   background: string,
   type?: PinHeadT,

package/menu/index.d.ts

@@ -107,7 +107,7 @@ export interface StatefulContainerProps {
   removeMenuFromNesting?: (ref: React.Ref<HTMLElement>) => void;
   getParentMenu?: (ref: React.Ref<HTMLElement>) => void;
   getChildMenu?: (ref: React.Ref<HTMLElement>) => void;
-  nestedMenuHoverIndex?: nubmer;
+  nestedMenuHoverIndex?: number;
   isNestedMenuVisible?: (ref: React.Ref<HTMLElement>) => boolean;
 }
 export interface StatefulContainerState {
@@ -172,6 +172,7 @@ export const OptionProfile: React.FC<OptionProfileProps>;
 export interface SharedStatelessProps {
   activedescendantId?: string;
   ariaLabel?: string;
+  'aria-label'?: string;
   getRequiredItemProps?: (item: any, index: number) => RenderItemProps;
   highlightedIndex?: number;
   items: ItemsT;

package/menu/index.js.flow

@@ -5,14 +5,14 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 // @flow
-export {default as StatefulMenu} from './stateful-menu.js';
-export {default as StatefulContainer} from './stateful-container.js';
-export {default as OptionList} from './option-list.js';
-export {default as OptionProfile} from './option-profile.js';
-export {default as Menu} from './menu.js';
-export {default as NestedMenus, NestedMenuContext} from './nested-menus.js';
+export { default as StatefulMenu } from './stateful-menu.js';
+export { default as StatefulContainer } from './stateful-container.js';
+export { default as OptionList } from './option-list.js';
+export { default as OptionProfile } from './option-profile.js';
+export { default as Menu } from './menu.js';
+export { default as NestedMenus, NestedMenuContext } from './nested-menus.js';
 // Constants
-export {KEY_STRINGS, STATE_CHANGE_TYPES} from './constants.js';
+export { KEY_STRINGS, STATE_CHANGE_TYPES } from './constants.js';
 // Styled elements
 export {
   StyledEmptyState,

package/menu/maybe-child-menu.js

@@ -80,8 +80,7 @@ function MaybeChildMenu(props) {
             }
           }
         }
-      }, // $FlowFixMe - getOverrides' return type for props is {}
-      popoverProps.overrides)
+      }, popoverProps.overrides)
     }), props.children);
   });
 }

package/menu/maybe-child-menu.js.flow

@@ -9,16 +9,17 @@ LICENSE file in the root directory of this source tree.
 
 import * as React from 'react';
 
-import {NestedMenuContext} from './nested-menus.js';
-import {Popover} from '../popover/index.js';
-import type {OverrideT} from '../helpers/overrides.js';
-import {getOverrides, mergeOverrides} from '../helpers/overrides.js';
+import { NestedMenuContext } from './nested-menus.js';
+import { Popover } from '../popover/index.js';
+import type { OverrideT } from '../helpers/overrides.js';
+import { getOverrides, mergeOverrides } from '../helpers/overrides.js';
+import type { ItemT } from './types.js';
 
 type PropsT = {
   children: React.Node,
-  getChildMenu: ?(item: *) => React.Node,
+  getChildMenu: ?(item: ItemT) => React.Node,
   isOpen: boolean,
-  item: *,
+  item: ItemT,
   resetParentMenu: () => void,
   renderAll?: boolean,
   onClick?: (event: MouseEvent) => mixed,
@@ -36,15 +37,12 @@ export default function MaybeChildMenu(props: PropsT) {
   if (!ChildMenu) {
     return props.children;
   }
-  const {overrides = {}} = props;
-  const [PopoverOverride, popoverProps] = getOverrides(
-    overrides.ChildMenuPopover,
-    Popover,
-  );
+  const { overrides = {} } = props;
+  const [PopoverOverride, popoverProps] = getOverrides(overrides.ChildMenuPopover, Popover);
 
   return (
     <NestedMenuContext.Consumer>
-      {ctx => {
+      {(ctx) => {
         return (
           <PopoverOverride
             focusLock={false}
@@ -75,8 +73,7 @@ export default function MaybeChildMenu(props: PropsT) {
                   },
                 },
               },
-              // $FlowFixMe - getOverrides' return type for props is {}
-              popoverProps.overrides,
+              popoverProps.overrides
             )}
           >
             {props.children}

package/menu/menu.js

@@ -46,7 +46,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function Menu(props) {
   var _props$overrides = props.overrides,
       overrides = _props$overrides === void 0 ? {} : _props$overrides,
-      _props$ariaLabel = props.ariaLabel,
+      _props$ariaLabel = props['aria-label'],
       ariaLabel = _props$ariaLabel === void 0 ? 'Menu' : _props$ariaLabel,
       _props$rootRef = props.rootRef,
       rootRef = _props$rootRef === void 0 ? /*#__PURE__*/React.createRef() : _props$rootRef,