baseui 0.0.0-next-2992a67 → 0.0.0-next-ecc760f

package/map-marker/types.d.ts

@@ -1,25 +1,29 @@
 import type * as React from 'react';
 import type { FLOATING_MARKER_ANCHOR_POSITIONS, NEEDLE_SIZES, PINHEAD_SIZES_SHAPES, FLOATING_MARKER_SIZES, PINHEAD_TYPES, FLOATING_MARKER_ANCHOR_TYPES, BADGE_ENHANCER_SIZES, LABEL_ENHANCER_POSITIONS, KIND, LOCATION_PUCK_SIZES, LOCATION_PUCK_TYPES, FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS } from './constants';
 import type { Override } from '../helpers/overrides';
-export declare type AnchorPositions = typeof FLOATING_MARKER_ANCHOR_POSITIONS[keyof typeof FLOATING_MARKER_ANCHOR_POSITIONS];
-export declare type NeedleSize = typeof NEEDLE_SIZES[keyof typeof NEEDLE_SIZES];
-export declare type PinHead = typeof PINHEAD_TYPES[keyof typeof PINHEAD_TYPES];
-export declare type PinHeadSize = typeof PINHEAD_SIZES_SHAPES[keyof typeof PINHEAD_SIZES_SHAPES];
-export declare type FloatingMarkerSize = typeof FLOATING_MARKER_SIZES[keyof typeof FLOATING_MARKER_SIZES];
-export declare type FloatingMarkerAnchorType = typeof FLOATING_MARKER_ANCHOR_TYPES[keyof typeof FLOATING_MARKER_ANCHOR_TYPES];
-export declare type BadgeEnhancerSize = typeof BADGE_ENHANCER_SIZES[keyof typeof BADGE_ENHANCER_SIZES];
-export declare type LabelEnhancerPosition = typeof LABEL_ENHANCER_POSITIONS[keyof typeof LABEL_ENHANCER_POSITIONS];
-export declare type Kind = typeof KIND[keyof typeof KIND];
-export declare type LocationPuckSize = typeof LOCATION_PUCK_SIZES[keyof typeof LOCATION_PUCK_SIZES];
-export declare type LocationPuckType = typeof LOCATION_PUCK_TYPES[keyof typeof LOCATION_PUCK_TYPES];
-export declare type FloatingRouteMarkerAnchorPositions = typeof FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS[keyof typeof FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS];
-export declare type FixedMarkerOverrides = {
+export type AnchorPositions = (typeof FLOATING_MARKER_ANCHOR_POSITIONS)[keyof typeof FLOATING_MARKER_ANCHOR_POSITIONS];
+export type NeedleSize = (typeof NEEDLE_SIZES)[keyof typeof NEEDLE_SIZES];
+export type PinHead = (typeof PINHEAD_TYPES)[keyof typeof PINHEAD_TYPES];
+export type PinHeadSize = (typeof PINHEAD_SIZES_SHAPES)[keyof typeof PINHEAD_SIZES_SHAPES];
+export type FloatingMarkerSize = (typeof FLOATING_MARKER_SIZES)[keyof typeof FLOATING_MARKER_SIZES];
+export type FloatingMarkerAnchorType = (typeof FLOATING_MARKER_ANCHOR_TYPES)[keyof typeof FLOATING_MARKER_ANCHOR_TYPES];
+export type BadgeEnhancerSize = (typeof BADGE_ENHANCER_SIZES)[keyof typeof BADGE_ENHANCER_SIZES];
+export type LabelEnhancerPosition = (typeof LABEL_ENHANCER_POSITIONS)[keyof typeof LABEL_ENHANCER_POSITIONS];
+export type Kind = (typeof KIND)[keyof typeof KIND];
+export type LocationPuckSize = (typeof LOCATION_PUCK_SIZES)[keyof typeof LOCATION_PUCK_SIZES];
+export type LocationPuckType = (typeof LOCATION_PUCK_TYPES)[keyof typeof LOCATION_PUCK_TYPES];
+export type FloatingRouteMarkerAnchorPositions = (typeof FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS)[keyof typeof FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS];
+export type FixedMarkerOverrides = {
     Root?: Override;
     InnerAnchor?: Override;
     OuterAnchor?: Override;
     PinHead?: Override;
-    PinHeadContent?: Override;
+    LabelSlot?: Override;
+    Label?: Override;
+    SecondaryLabel?: Override;
+    EnhancerSlot?: Override;
     PinHeadContainer?: Override;
+    AnchorContainer?: Override;
     Needle?: Override;
     DragShadow?: Override;
     DragShadowContainer?: Override;
@@ -28,41 +32,41 @@ export declare type FixedMarkerOverrides = {
     LabelEnhancer?: Override;
     LabelEnhancerContainer?: Override;
 };
-export declare type NeedleProps = {
+export type NeedleProps = {
     size: NeedleSize;
     background?: string;
     overrides: FixedMarkerOverrides;
 };
-export declare type ItemProps = {
+export type ItemProps = {
     children?: React.ReactNode;
     color?: string;
     size?: number;
 };
-export declare type LabelEnhancer = {
+export type LabelEnhancer = {
     labelEnhancerContent?: string;
     labelEnhancerPosition?: LabelEnhancerPosition;
 };
-export declare type LabelEhancerComponent = {
+export type LabelEhancerComponent = {
     needleHeight: number;
     size: PinHeadSize;
     overrides?: FixedMarkerOverrides;
 } & LabelEnhancer;
-export declare type BadgeEnhancer = {
+export type BadgeEnhancer = {
     badgeEnhancerSize?: BadgeEnhancerSize | null;
     badgeEnhancerContent?: React.ComponentType<{
         size: number;
     }>;
 };
-export declare type BadgeEnhancerComponent = {
+export type BadgeEnhancerComponent = {
     pinHeadSize: PinHeadSize;
     markerType: PinHead;
     overrides: FixedMarkerOverrides;
 } & BadgeEnhancer;
-export declare type BadgePosition = {
+export type BadgePosition = {
     x: number;
     y: number;
 };
-export declare type FixedMarkerProps = {
+export type FixedMarkerProps = {
     size?: PinHeadSize;
     needle?: NeedleSize;
     label?: React.ReactNode;
@@ -76,12 +80,15 @@ export declare type FixedMarkerProps = {
     dragging?: boolean;
     overrides?: FixedMarkerOverrides;
 } & BadgeEnhancer & LabelEnhancer;
-export declare type FloatingMarkerOverrides = {
+export type FloatingMarkerOverrides = {
     Root?: Override;
     InnerAnchor?: Override;
     OuterAnchor?: Override;
     PinHead?: Override;
-    PinHeadContent?: Override;
+    LabelSlot?: Override;
+    Label?: Override;
+    SecondaryLabel?: Override;
+    EnhancerSlot?: Override;
     PinHeadContainer?: Override;
     AnchorContainer?: Override;
     Needle?: Override;
@@ -92,8 +99,9 @@ export declare type FloatingMarkerOverrides = {
     LabelEnhancer?: Override;
     LabelEnhancerContainer?: Override;
 };
-export declare type FloatingMarkerProps = {
+export type FloatingMarkerProps = {
     label?: React.ReactNode;
+    secondaryLabel?: React.ReactNode;
     anchor?: AnchorPositions;
     endEnhancer?: React.ComponentType<{
         size: number;
@@ -105,9 +113,10 @@ export declare type FloatingMarkerProps = {
     size?: FloatingMarkerSize;
     overrides?: FloatingMarkerOverrides;
 };
-export declare type PinHeadProps = {
+export type PinHeadProps = {
     size?: PinHeadSize;
     label?: React.ReactNode;
+    secondaryLabel?: React.ReactNode;
     endEnhancer?: React.ComponentType<{
         size: number;
     }>;
@@ -121,19 +130,19 @@ export declare type PinHeadProps = {
     needle?: NeedleSize;
     overrides?: FloatingMarkerOverrides | FixedMarkerOverrides;
 } & BadgeEnhancer & LabelEnhancer;
-export declare type DragShadowProps = {
+export type DragShadowProps = {
     background: string;
     dragging: boolean;
     height: number;
     overrides: FixedMarkerOverrides;
 };
-export declare type LocationPuckOverrides = {
+export type LocationPuckOverrides = {
     Root?: Override;
     LocationPuckApproximation?: Override;
     ConsumerLocationPuckCore?: Override;
     EarnerLocationPuckCore?: Override;
 };
-export declare type LocationPuckProps = {
+export type LocationPuckProps = {
     size?: LocationPuckSize;
     heading?: number;
     confidenceRadius?: number;
@@ -141,19 +150,19 @@ export declare type LocationPuckProps = {
     type?: LocationPuckType;
     overrides?: LocationPuckOverrides;
 };
-export declare type ConsumerLocationPuckProps = {
+export type ConsumerLocationPuckProps = {
     heading: number;
     confidenceRadius?: number;
     showHeading?: boolean;
     overrides: LocationPuckOverrides;
 };
-export declare type EarnerLocationPuckProps = {
+export type EarnerLocationPuckProps = {
     heading: number;
     confidenceRadius?: number;
     size: LocationPuckSize;
     overrides?: LocationPuckOverrides;
 };
-export declare type FloatingRouteMarkerOverrides = {
+export type FloatingRouteMarkerOverrides = {
     Root?: Override;
     PointerContainer?: Override;
     Pointer?: Override;
@@ -161,7 +170,7 @@ export declare type FloatingRouteMarkerOverrides = {
     SecondaryLabel?: Override;
     IconContainer?: Override;
 };
-export declare type FloatingRouteMarkerProps = {
+export type FloatingRouteMarkerProps = {
     label?: React.ReactNode;
     secondaryLabel?: React.ReactNode;
     startEnhancer?: React.ComponentType<{

package/map-marker/types.js.flow

@@ -53,8 +53,12 @@ export type FixedMarkerOverridesT = {
   InnerAnchor?: OverrideT,
   OuterAnchor?: OverrideT,
   PinHead?: OverrideT,
-  PinHeadContent?: OverrideT,
+  LabelSlot?: OverrideT,
+  Label?: OverrideT,
+  SecondaryLabel?: OverrideT,
+  EnhancerSlot?: OverrideT,
   PinHeadContainer?: OverrideT,
+  AnchorContainer?: OverrideT,
   Needle?: OverrideT,
   DragShadow?: OverrideT,
   DragShadowContainer?: OverrideT,
@@ -122,7 +126,10 @@ export type FloatingMarkerOverridesT = {
   InnerAnchor?: OverrideT,
   OuterAnchor?: OverrideT,
   PinHead?: OverrideT,
-  PinHeadContent?: OverrideT,
+  LabelSlot?: OverrideT,
+  Label?: OverrideT,
+  SecondaryLabel?: OverrideT,
+  EnhancerSlot?: OverrideT,
   PinHeadContainer?: OverrideT,
   AnchorContainer?: OverrideT,
   Needle?: OverrideT,

package/menu/index.d.ts

@@ -10,18 +10,18 @@ export { StyledEmptyState, StyledList, StyledListItem, StyledListItemProfile, St
 export * from './types';
 export type { MenuLocale } from './locale';
 /** @deprecated use Item instead. To be removed in future versions.*/
-export declare type ItemT = Item;
+export type ItemT = Item;
 /** @deprecated use ArrayItems instead. To be removed in future versions.*/
-export declare type ArrayItemsT = ArrayItems;
+export type ArrayItemsT = ArrayItems;
 /** @deprecated use GroupedItems instead. To be removed in future versions.*/
-export declare type GroupedItemsT = GroupedItems;
+export type GroupedItemsT = GroupedItems;
 /** @deprecated use Items instead. To be removed in future versions.*/
-export declare type ItemsT = Items;
+export type ItemsT = Items;
 /** @deprecated To be removed in future versions.*/
-export declare type BaseMenuPropsT = MenuProps;
+export type BaseMenuPropsT = MenuProps;
 /** @deprecated To be removed in future versions.*/
-export declare type OnItemSelect = StatefulContainerProps['onItemSelect'];
+export type OnItemSelect = StatefulContainerProps['onItemSelect'];
 /** @deprecated use StateReducerFn instead. To be removed in future versions.*/
-export declare type StateReducer = StateReducerFn;
+export type StateReducer = StateReducerFn;
 /** @deprecated use GetRequiredItemPropsFn instead. To be removed in future versions.*/
-export declare type GetRequiredItemProps = GetRequiredItemPropsFn;
+export type GetRequiredItemProps = GetRequiredItemPropsFn;

package/menu/locale.d.ts

@@ -1,4 +1,4 @@
-export declare type MenuLocale = {
+export type MenuLocale = {
     noResultsMsg: string;
     parentMenuItemAriaLabel: string;
 };

package/menu/maybe-child-menu.d.ts

@@ -1,10 +1,11 @@
 import * as React from 'react';
 import type { Override } from '../helpers/overrides';
 import type { Item } from './types';
-declare type Props = {
+type Props = {
     getChildMenu: ((item: Item) => React.ReactNode) | undefined | null;
     isOpen: boolean;
     item: Item;
+    ref?: React.RefObject<any>;
     resetParentMenu: () => void;
     renderAll?: boolean;
     onClick?: (event: React.MouseEvent) => unknown;
@@ -12,5 +13,5 @@ declare type Props = {
         ChildMenuPopover?: Override;
     };
 };
-declare const MaybeChildMenu: React.FC<Props>;
+declare const MaybeChildMenu: React.FC<React.PropsWithChildren<Props>>;
 export default MaybeChildMenu;

package/menu/menu.js

@@ -117,10 +117,14 @@ function Menu(props) {
         itemIndex = _ref2[1];
 
     if (optgroup !== '__ungrouped') {
-      els.push( /*#__PURE__*/React.createElement(OptgroupHeader, _extends({
+      els.push(
+      /*#__PURE__*/
+      // @ts-ignore
+      React.createElement(OptgroupHeader, _extends({
         key: optgroup
       }, optgroupHeaderProps), optgroup));
     } // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    // @ts-ignore
 
 
     var groupItems = groupedItems[optgroup].map(function (item, index) {
@@ -162,7 +166,8 @@ function Menu(props) {
     return [els.concat(groupItems), itemIndex];
   }, [[], -1]),
       _optgroups$reduce2 = _slicedToArray(_optgroups$reduce, 1),
-      elements = _optgroups$reduce2[0];
+      elements = _optgroups$reduce2[0]; // @ts-ignore
+
 
   var isEmpty = optgroups.every(function (optgroup) {
     return !groupedItems[optgroup].length;
@@ -181,7 +186,8 @@ function Menu(props) {
       }, handleFocus),
       onBlur: (0, _focusVisible.forkBlur)({
         onBlur: unfocusMenu
-      }, handleBlur),
+      }, handleBlur) // @ts-ignore
+      ,
       onKeyDown: function onKeyDown(event) {
         if (props.isFocused) {
           handleKeyDown(event);

package/menu/nested-menus.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import type { NestedMenuRef, NestedMenuContextProps } from './types';
-export declare type NestedMenuState = {
+export type NestedMenuState = {
     nestedMenuHoverIndex: number;
     menus: NestedMenuRef[];
 };
-export declare type NestedMenuProps = {
+export type NestedMenuProps = {
     children: React.ReactNode;
 };
 export declare const NestedMenuContext: React.Context<NestedMenuContextProps>;

package/menu/nested-menus.js

@@ -100,6 +100,7 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
     _defineProperty(_assertThisInitialized(_this), "mouseLeaveTimeoueId", null);
 
     _defineProperty(_assertThisInitialized(_this), "handleMenuMouseLeave", function (event) {
+      // @ts-ignore
       _this.mouseLeaveTimeoueId = setTimeout(function () {
         _this.setState({
           nestedMenuHoverIndex: -1
@@ -109,10 +110,14 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "handleMenuMouseEnter", function (event) {
       if (typeof document !== 'undefined') {
+        // @ts-ignore
         clearTimeout(_this.mouseLeaveTimeoueId);
 
         var index = _this.state.menus.findIndex(function (m) {
-          return m.current && event.currentTarget instanceof Node && m.current.contains(event.currentTarget);
+          return (// @ts-ignore
+            m.current && event.currentTarget instanceof Node && // @ts-ignore
+            m.current.contains(event.currentTarget)
+          );
         });
 
         _this.setState({
@@ -148,7 +153,9 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
           for (_iterator.s(); !(_step = _iterator.n()).done;) {
             var r = _step.value;
 
+            // @ts-ignore
             if (r.current && isSame(r.current, ref.current)) {
+              // @ts-ignore
               var element = r.current;
               element.removeEventListener('mouseenter', _this.handleMenuMouseEnter);
               element.removeEventListener('mouseleave', _this.handleMenuMouseLeave);
@@ -170,6 +177,7 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "findMenuIndexByRef", function (ref) {
+      // @ts-ignore
       return _this.state.menus.findIndex(function (r) {
         return isSame(r.current, ref.current);
       });

package/menu/option-list.js

@@ -82,7 +82,8 @@ function OptionList(props, ref) {
   var _getOverrides3 = (0, _overrides.getOverrides)(overrides.ListItemAnchor, _styledComponents.StyledListItemAnchor),
       _getOverrides4 = _slicedToArray(_getOverrides3, 2),
       ListItemAnchor = _getOverrides4[0],
-      listItemAnchorProps = _getOverrides4[1];
+      listItemAnchorProps = _getOverrides4[1]; // @ts-ignore
+
 
   var getItem = function getItem(item) {
     if (item.href && renderHrefAsAnchor) {
@@ -116,7 +117,8 @@ function OptionList(props, ref) {
       isHighlighted: $isHighlighted
     }, item))));
   });
-}
+} // @ts-ignore
+
 
 function areEqualShallow(a, b) {
   if (!a || !b) return false;
@@ -128,11 +130,13 @@ function areEqualShallow(a, b) {
   }
 
   return true;
-}
+} // @ts-ignore
+
 
 function compare(prevProps, nextProps) {
   return prevProps.$isHighlighted === nextProps.$isHighlighted && prevProps.$isFocused === nextProps.$isFocused && areEqualShallow(prevProps.item, nextProps.item) && areEqualShallow(prevProps.overrides, nextProps.overrides) && prevProps.size === nextProps.size && prevProps.getItemLabel === nextProps.getItemLabel && prevProps.getChildMenu === nextProps.getChildMenu && prevProps.resetMenu === nextProps.resetMenu;
-}
+} // @ts-ignore
+
 
 var forwarded = /*#__PURE__*/React.forwardRef(OptionList);
 forwarded.displayName = 'OptionList';

package/menu/option-profile.js

@@ -98,8 +98,7 @@ function OptionProfile(props, ref) {
       subtitle = _getProfileItemLabels.subtitle,
       body = _getProfileItemLabels.body;
 
-  return /*#__PURE__*/React.createElement(_maybeChildMenu.default // @ts-expect-error todo(flow->ts)
-  , {
+  return /*#__PURE__*/React.createElement(_maybeChildMenu.default, {
     ref: ref,
     getChildMenu: getChildMenu,
     isOpen: !!$isHighlighted,
@@ -117,7 +116,8 @@ function OptionProfile(props, ref) {
   /*#__PURE__*/
   // Or just render the entire component user specified
   React.createElement(ItemImg, profileImgProps))), /*#__PURE__*/React.createElement(ProfileLabelsContainer, profileLabelsContainerProps, title && /*#__PURE__*/React.createElement(ProfileTitle, profileTitleProps, title), subtitle && /*#__PURE__*/React.createElement(ProfileSubtitle, profileSubtitleProps, subtitle), body && /*#__PURE__*/React.createElement(ProfileBody, profileBodyProps, body))));
-}
+} // @ts-ignore
+
 
 var forwarded = /*#__PURE__*/React.forwardRef(OptionProfile);
 forwarded.displayName = 'OptionProfile';

package/menu/stateful-container.js

@@ -72,6 +72,7 @@ var DEFAULT_PROPS = {
   getRequiredItemProps: function getRequiredItemProps() {
     return {};
   },
+  // @ts-ignore
   children: function children() {
     return null;
   },
@@ -142,6 +143,7 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
 
         default:
           if (_this.props.typeAhead) {
+            // @ts-ignore
             clearTimeout(_this.typeAheadTimeOut);
 
             _this.handleAlphaDown(event);
@@ -191,7 +193,8 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
       });
 
       if (_this.refList[nextIndex]) {
-        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, rootRef.current, nextIndex === 0, nextIndex === list.length - 1);
+        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, // @ts-ignore
+        rootRef.current, nextIndex === 0, nextIndex === list.length - 1);
       }
     });
 
@@ -247,7 +250,8 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
       }
 
       if (_this.refList[nextIndex]) {
-        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, rootRef.current, nextIndex === 0, nextIndex === _this.getItems().length - 1);
+        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, // @ts-ignore
+        rootRef.current, nextIndex === 0, nextIndex === _this.getItems().length - 1);
       }
     });
 
@@ -364,6 +368,7 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
 
       var optgroups = Object.keys(this.props.items);
       return optgroups.reduce(function (output, optgroup) {
+        // @ts-ignore
         return output.concat(_this2.props.items[optgroup]);
       }, []);
     }
@@ -476,6 +481,7 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
         highlightedIndex: this.state.highlightedIndex,
         isFocused: this.state.isFocused,
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        // @ts-ignore
         handleKeyDown: this.props.keyboardControlNode.current ? function (event) {} : this.onKeyDown,
         focusMenu: this.focusMenu,
         unfocusMenu: this.unfocusMenu
@@ -490,7 +496,6 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
 _defineProperty(MenuStatefulContainerInner, "defaultProps", DEFAULT_PROPS);
 
 var MenuStatefulContainer = function MenuStatefulContainer(props) {
-  //$FlowExpectedError[cannot-spread-inexact]
   return /*#__PURE__*/React.createElement(MenuStatefulContainerInner, _extends({
     uidSeed: (0, _reactUid.useUIDSeed)()
   }, props));

package/menu/styled-components.d.ts

@@ -1,5 +1,5 @@
 import { OPTION_LIST_SIZE } from './constants';
-declare type StyledProps = {
+type StyledProps = {
     $disabled?: boolean;
     $isFocused?: boolean;
     $isFocusVisible?: boolean;

package/menu/styled-components.js

@@ -56,7 +56,7 @@ var StyledList = (0, _styles.styled)('ul', function (_ref) {
 });
 exports.StyledList = StyledList;
 StyledList.displayName = "StyledList";
-StyledList.displayName = 'StyledList';
+StyledList.displayName = 'StyledList'; // @ts-ignore
 
 function getFontColor(props) {
   if (props.$disabled) {
@@ -72,7 +72,8 @@ function getFontColor(props) {
   }
 
   return props.$theme.colors.menuFontDefault;
-}
+} // @ts-ignore
+
 
 function getBackgroundColor(props) {
   if (props.$disabled) {
@@ -155,7 +156,8 @@ var StyledListItemElement = (0, _styles.styled)('li', function (props) {
 });
 exports.StyledListItemElement = StyledListItemElement;
 StyledListItemElement.displayName = "StyledListItemElement";
-StyledListItemElement.displayName = 'StyledListItemElement';
+StyledListItemElement.displayName = 'StyledListItemElement'; // @ts-ignore
+
 var StyledListItem = (0, _styles.withWrapper)(StyledListItemElement, function (Styled) {
   return (// eslint-disable-next-line @typescript-eslint/no-unused-vars
     function StyledListItem(_ref2) {