@primer/react 38.0.0-rc.195178541 → 38.0.0-rc.2

package/lib-esm/experimental/IssueLabel/IssueLabel.d.ts

@@ -1,17 +1,32 @@
 import type React from 'react';
-export type Hex = `#${string}`;
-type LabelColorVariant = 'pink' | 'plum' | 'purple' | 'indigo' | 'blue' | 'cyan' | 'teal' | 'pine' | 'green' | 'lime' | 'olive' | 'lemon' | 'yellow' | 'orange' | 'red' | 'coral' | 'gray' | 'brown' | 'auburn';
-export interface IssueLabelProps {
+type Hex = `#${string}`;
+type LabelColorVariant = 'auburn' | 'blue' | 'brown' | 'coral' | 'cyan' | 'gray' | 'green' | 'indigo' | 'lemon' | 'lime' | 'olive' | 'orange' | 'pine' | 'pink' | 'plum' | 'purple' | 'red' | 'teal' | 'yellow';
+type BaseProps = {
+    className?: string;
     fillColor?: Hex;
     variant?: LabelColorVariant;
-    href?: string;
-    as?: 'button' | 'a' | 'span';
-    text: React.ReactNode;
-    id?: number | string;
-    className?: string;
-    onClick?: React.MouseEventHandler<HTMLSpanElement | HTMLButtonElement | HTMLAnchorElement>;
-    onFocus?: React.FocusEventHandler<HTMLSpanElement | HTMLButtonElement | HTMLAnchorElement>;
-}
-export declare function IssueLabel({ className, fillColor, variant, href, onClick, onFocus, text, as, id, ...rest }: IssueLabelProps): React.JSX.Element;
-export {};
+};
+type ButtonProps = React.ComponentPropsWithoutRef<'button'> & BaseProps & {
+    as?: never;
+    onClick: React.MouseEventHandler<HTMLButtonElement>;
+};
+type LinkProps = React.ComponentPropsWithoutRef<'a'> & BaseProps & {
+    as?: never;
+    href: string;
+};
+type SpanProps = Omit<React.ComponentPropsWithoutRef<'span'>, 'onClick'> & BaseProps & {
+    as?: never;
+    onClick?: never;
+    href?: never;
+};
+type IssueLabelAsProps<As extends React.ElementType> = {
+    as: As;
+} & BaseProps & Omit<React.ComponentPropsWithoutRef<As>, keyof BaseProps>;
+type IssueLabelProps<As extends React.ElementType> = SpanProps | LinkProps | ButtonProps | IssueLabelAsProps<As>;
+declare function IssueLabel(props: SpanProps): React.ReactNode;
+declare function IssueLabel(props: LinkProps): React.ReactNode;
+declare function IssueLabel(props: ButtonProps): React.ReactNode;
+declare function IssueLabel<As extends React.ElementType>(props: IssueLabelAsProps<As>): React.ReactNode;
+export { IssueLabel };
+export type { IssueLabelProps, Hex };
 //# sourceMappingURL=IssueLabel.d.ts.map

package/lib-esm/experimental/IssueLabel/IssueLabel.js

@@ -1,184 +1,178 @@
 import { c } from 'react-compiler-runtime';
-import { getColorsFromHex } from './getColorFromHex.js';
-import { useTheme } from '../../ThemeProvider.js';
 import { clsx } from 'clsx';
+import { useTheme } from '../../ThemeProvider.js';
+import { getColorsFromHex } from './getColorFromHex.js';
 import classes from './IssueLabel.module.css.js';
 import { jsx } from 'react/jsx-runtime';
 
 function IssueLabel(t0) {
-  const $ = c(48);
-  let as;
+  const $ = c(42);
+  let children;
   let className;
   let fillColor;
-  let href;
-  let id;
-  let onClick;
-  let onFocus;
-  let rest;
+  let props;
+  let style;
   let t1;
-  let text;
   if ($[0] !== t0) {
     ({
+      children,
       className,
       fillColor,
+      style,
       variant: t1,
-      href,
-      onClick,
-      onFocus,
-      text,
-      as,
-      id,
-      ...rest
+      ...props
     } = t0);
     $[0] = t0;
-    $[1] = as;
+    $[1] = children;
     $[2] = className;
     $[3] = fillColor;
-    $[4] = href;
-    $[5] = id;
-    $[6] = onClick;
-    $[7] = onFocus;
-    $[8] = rest;
-    $[9] = t1;
-    $[10] = text;
+    $[4] = props;
+    $[5] = style;
+    $[6] = t1;
   } else {
-    as = $[1];
+    children = $[1];
     className = $[2];
     fillColor = $[3];
-    href = $[4];
-    id = $[5];
-    onClick = $[6];
-    onFocus = $[7];
-    rest = $[8];
-    t1 = $[9];
-    text = $[10];
+    props = $[4];
+    style = $[5];
+    t1 = $[6];
   }
   const variant = t1 === undefined ? "gray" : t1;
-  if (href && onClick) {
-    throw new Error("`href` and `onClick` cannot both be set. Choose either a link (`<a>`) or a button (`<button>`).");
-  }
   const {
     resolvedColorScheme
   } = useTheme();
   const mode = resolvedColorScheme !== null && resolvedColorScheme !== void 0 && resolvedColorScheme.startsWith("dark") ? "dark" : "light";
-  let T0;
   let t2;
   let t3;
   let t4;
-  let t5;
-  let t6;
-  let t7;
-  let t8;
-  let t9;
-  if ($[11] !== as || $[12] !== className || $[13] !== fillColor || $[14] !== href || $[15] !== id || $[16] !== mode || $[17] !== onClick || $[18] !== onFocus || $[19] !== resolvedColorScheme || $[20] !== rest || $[21] !== variant) {
+  if ($[7] !== className || $[8] !== fillColor || $[9] !== mode || $[10] !== resolvedColorScheme || $[11] !== style || $[12] !== variant) {
     const bgColors = {
       light: "#ffffff",
       dark: "#0d1117"
     };
-    let Component = "span";
-    if (as) {
-      Component = as;
+    if ($[16] !== className) {
+      t2 = clsx(className, classes.IssueLabel);
+      $[16] = className;
+      $[17] = t2;
     } else {
-      if (href) {
-        Component = "a";
-      } else {
-        if (onClick) {
-          Component = "button";
-        }
-      }
+      t2 = $[17];
     }
-    let t10;
-    if ($[31] !== href) {
-      t10 = href ? {
-        href
-      } : {};
-      $[31] = href;
-      $[32] = t10;
+    t3 = fillColor ? undefined : variant;
+    t4 = fillColor ? {
+      ...style,
+      ...getColorsFromHex(fillColor, resolvedColorScheme, bgColors[mode])
+    } : style;
+    $[7] = className;
+    $[8] = fillColor;
+    $[9] = mode;
+    $[10] = resolvedColorScheme;
+    $[11] = style;
+    $[12] = variant;
+    $[13] = t2;
+    $[14] = t3;
+    $[15] = t4;
+  } else {
+    t2 = $[13];
+    t3 = $[14];
+    t4 = $[15];
+  }
+  let t5;
+  if ($[18] !== t2 || $[19] !== t3 || $[20] !== t4) {
+    t5 = {
+      className: t2,
+      "data-variant": t3,
+      style: t4
+    };
+    $[18] = t2;
+    $[19] = t3;
+    $[20] = t4;
+    $[21] = t5;
+  } else {
+    t5 = $[21];
+  }
+  const sharedProps = t5;
+  if ("as" in props && props.as) {
+    let BaseComponent;
+    let rest;
+    if ($[22] !== props) {
+      ({
+        as: BaseComponent,
+        ...rest
+      } = props);
+      $[22] = props;
+      $[23] = BaseComponent;
+      $[24] = rest;
     } else {
-      t10 = $[32];
+      BaseComponent = $[23];
+      rest = $[24];
     }
-    const anchorProps = t10;
-    T0 = Component;
-    t2 = rest;
-    t3 = anchorProps;
-    t4 = onClick;
-    t5 = onFocus;
-    if ($[33] !== id) {
-      var _id;
-      t6 = (_id = id) === null || _id === void 0 ? void 0 : _id.toString();
-      $[33] = id;
-      $[34] = t6;
+    let t6;
+    if ($[25] !== BaseComponent || $[26] !== children || $[27] !== rest || $[28] !== sharedProps) {
+      t6 = /*#__PURE__*/jsx(BaseComponent, {
+        ...rest,
+        ...sharedProps,
+        children: children
+      });
+      $[25] = BaseComponent;
+      $[26] = children;
+      $[27] = rest;
+      $[28] = sharedProps;
+      $[29] = t6;
     } else {
-      t6 = $[34];
+      t6 = $[29];
     }
-    if ($[35] !== className) {
-      t7 = clsx(classes.IssueLabel, className);
-      $[35] = className;
-      $[36] = t7;
+    return t6;
+  }
+  if ("href" in props) {
+    let t6;
+    if ($[30] !== children || $[31] !== props || $[32] !== sharedProps) {
+      t6 = /*#__PURE__*/jsx("a", {
+        ...props,
+        ...sharedProps,
+        children: children
+      });
+      $[30] = children;
+      $[31] = props;
+      $[32] = sharedProps;
+      $[33] = t6;
     } else {
-      t7 = $[36];
+      t6 = $[33];
     }
-    t8 = fillColor ? undefined : variant;
-    t9 = fillColor ? getColorsFromHex(fillColor, resolvedColorScheme, bgColors[mode]) : undefined;
-    $[11] = as;
-    $[12] = className;
-    $[13] = fillColor;
-    $[14] = href;
-    $[15] = id;
-    $[16] = mode;
-    $[17] = onClick;
-    $[18] = onFocus;
-    $[19] = resolvedColorScheme;
-    $[20] = rest;
-    $[21] = variant;
-    $[22] = T0;
-    $[23] = t2;
-    $[24] = t3;
-    $[25] = t4;
-    $[26] = t5;
-    $[27] = t6;
-    $[28] = t7;
-    $[29] = t8;
-    $[30] = t9;
-  } else {
-    T0 = $[22];
-    t2 = $[23];
-    t3 = $[24];
-    t4 = $[25];
-    t5 = $[26];
-    t6 = $[27];
-    t7 = $[28];
-    t8 = $[29];
-    t9 = $[30];
+    return t6;
   }
-  let t10;
-  if ($[37] !== T0 || $[38] !== t2 || $[39] !== t3 || $[40] !== t4 || $[41] !== t5 || $[42] !== t6 || $[43] !== t7 || $[44] !== t8 || $[45] !== t9 || $[46] !== text) {
-    t10 = /*#__PURE__*/jsx(T0, {
-      ...t2,
-      ...t3,
-      onClick: t4,
-      onFocus: t5,
-      id: t6,
-      className: t7,
-      "data-variant": t8,
-      style: t9,
-      children: text
+  if ("onClick" in props) {
+    let t6;
+    if ($[34] !== children || $[35] !== props || $[36] !== sharedProps) {
+      t6 = /*#__PURE__*/jsx("button", {
+        type: "button",
+        ...props,
+        ...sharedProps,
+        children: children
+      });
+      $[34] = children;
+      $[35] = props;
+      $[36] = sharedProps;
+      $[37] = t6;
+    } else {
+      t6 = $[37];
+    }
+    return t6;
+  }
+  let t6;
+  if ($[38] !== children || $[39] !== props || $[40] !== sharedProps) {
+    t6 = /*#__PURE__*/jsx("span", {
+      ...props,
+      ...sharedProps,
+      children: children
     });
-    $[37] = T0;
-    $[38] = t2;
-    $[39] = t3;
-    $[40] = t4;
-    $[41] = t5;
-    $[42] = t6;
-    $[43] = t7;
-    $[44] = t8;
-    $[45] = t9;
-    $[46] = text;
-    $[47] = t10;
+    $[38] = children;
+    $[39] = props;
+    $[40] = sharedProps;
+    $[41] = t6;
   } else {
-    t10 = $[47];
+    t6 = $[41];
   }
-  return t10;
+  return t6;
 }
 
 export { IssueLabel };

package/lib-esm/experimental/IssueLabel/IssueLabel.module.css.js

@@ -1,4 +1,4 @@
-import './IssueLabel-5507fbf3.css';
+import './IssueLabel-6581d1bd.css';
 
 var classes = {"IssueLabel":"prc-IssueLabel-IssueLabel-WJ5y-"};
 

package/lib-esm/experimental/UnderlinePanels/UnderlinePanels.js

@@ -4,14 +4,13 @@ import { TabContainerElement } from '@github/tab-container-element';
 import { createComponent } from '../../utils/create-component.js';
 import { UnderlineWrapper, UnderlineItemList, UnderlineItem } from '../../internal/components/UnderlineTabbedInterface.js';
 import { invariant } from '../../utils/invariant.js';
-import { defaultSxProp } from '../../utils/defaultSxProp.js';
 import { useResizeObserver } from '../../hooks/useResizeObserver.js';
 import useIsomorphicLayoutEffect from '../../utils/useIsomorphicLayoutEffect.js';
 import classes from './UnderlinePanels.module.css.js';
 import { clsx } from 'clsx';
+import { BoxWithFallback } from '../../internal/components/BoxWithFallback.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useId } from '../../hooks/useId.js';
-import Box from '../../Box/Box.js';
 
 const TabContainerComponent = createComponent(TabContainerElement, 'tab-container');
 const UnderlinePanels = ({
@@ -19,7 +18,6 @@ const UnderlinePanels = ({
   'aria-labelledby': ariaLabelledBy,
   children,
   loadingCounters,
-  sx: sxProp = defaultSxProp,
   className,
   ...props
 }) => {
@@ -94,7 +92,6 @@ const UnderlinePanels = ({
       ref: wrapperRef,
       slot: "tablist-wrapper",
       "data-icons-visible": iconsVisible,
-      sx: sxProp,
       className: clsx(className, classes.StyledUnderlineWrapper),
       ...props,
       children: /*#__PURE__*/jsx(UnderlineItemList, {
@@ -109,15 +106,13 @@ const UnderlinePanels = ({
 };
 UnderlinePanels.displayName = "UnderlinePanels";
 const Tab = t0 => {
-  const $ = c(16);
+  const $ = c(14);
   let ariaSelected;
   let onSelect;
   let props;
-  let t1;
   if ($[0] !== t0) {
     ({
       "aria-selected": ariaSelected,
-      sx: t1,
       onSelect,
       ...props
     } = t0);
@@ -125,72 +120,67 @@ const Tab = t0 => {
     $[1] = ariaSelected;
     $[2] = onSelect;
     $[3] = props;
-    $[4] = t1;
   } else {
     ariaSelected = $[1];
     onSelect = $[2];
     props = $[3];
-    t1 = $[4];
   }
-  const sxProp = t1 === undefined ? defaultSxProp : t1;
-  let t2;
-  if ($[5] !== onSelect) {
-    t2 = event => {
+  let t1;
+  if ($[4] !== onSelect) {
+    t1 = event => {
       if (!event.defaultPrevented && typeof onSelect === "function") {
         onSelect(event);
       }
     };
-    $[5] = onSelect;
-    $[6] = t2;
+    $[4] = onSelect;
+    $[5] = t1;
   } else {
-    t2 = $[6];
+    t1 = $[5];
   }
-  const clickHandler = t2;
-  let t3;
-  if ($[7] !== onSelect) {
-    t3 = event_0 => {
+  const clickHandler = t1;
+  let t2;
+  if ($[6] !== onSelect) {
+    t2 = event_0 => {
       if ((event_0.key === " " || event_0.key === "Enter") && !event_0.defaultPrevented && typeof onSelect === "function") {
         onSelect(event_0);
       }
     };
-    $[7] = onSelect;
-    $[8] = t3;
+    $[6] = onSelect;
+    $[7] = t2;
   } else {
-    t3 = $[8];
+    t2 = $[7];
   }
-  const keyDownHandler = t3;
-  const t4 = ariaSelected ? 0 : -1;
-  let t5;
-  if ($[9] !== ariaSelected || $[10] !== clickHandler || $[11] !== keyDownHandler || $[12] !== props || $[13] !== sxProp || $[14] !== t4) {
-    t5 = /*#__PURE__*/jsx(UnderlineItem, {
+  const keyDownHandler = t2;
+  const t3 = ariaSelected ? 0 : -1;
+  let t4;
+  if ($[8] !== ariaSelected || $[9] !== clickHandler || $[10] !== keyDownHandler || $[11] !== props || $[12] !== t3) {
+    t4 = /*#__PURE__*/jsx(UnderlineItem, {
       as: "button",
       role: "tab",
-      tabIndex: t4,
+      tabIndex: t3,
       "aria-selected": ariaSelected,
-      sx: sxProp,
       type: "button",
       onClick: clickHandler,
       onKeyDown: keyDownHandler,
       ...props
     });
-    $[9] = ariaSelected;
-    $[10] = clickHandler;
-    $[11] = keyDownHandler;
-    $[12] = props;
-    $[13] = sxProp;
-    $[14] = t4;
-    $[15] = t5;
+    $[8] = ariaSelected;
+    $[9] = clickHandler;
+    $[10] = keyDownHandler;
+    $[11] = props;
+    $[12] = t3;
+    $[13] = t4;
   } else {
-    t5 = $[15];
+    t4 = $[13];
   }
-  return t5;
+  return t4;
 };
 Tab.displayName = 'UnderlinePanels.Tab';
 const Panel = props => {
   const $ = c(2);
   let t0;
   if ($[0] !== props) {
-    t0 = /*#__PURE__*/jsx(Box, {
+    t0 = /*#__PURE__*/jsx(BoxWithFallback, {
       as: "div",
       role: "tabpanel",
       ...props

package/lib-esm/experimental/index.d.ts

@@ -33,7 +33,12 @@ export { Announce, AriaStatus, AriaAlert } from '../live-region';
 export type { AnnounceProps, AriaStatusProps, AriaAlertProps } from '../live-region';
 export { UnderlinePanels } from './UnderlinePanels';
 export type { UnderlinePanelsProps, UnderlinePanelsTabProps, UnderlinePanelsPanelProps } from './UnderlinePanels';
-export { SkeletonBox, SkeletonText, SkeletonAvatar } from './Skeleton';
+export { SkeletonBox } from '../Skeleton';
+export type { SkeletonBoxProps } from '../Skeleton';
+export { SkeletonText } from '../SkeletonText';
+export type { SkeletonTextProps } from '../SkeletonText';
+export { SkeletonAvatar } from '../SkeletonAvatar';
+export type { SkeletonAvatarProps } from '../SkeletonAvatar';
 export { FeatureFlags, DefaultFeatureFlags, useFeatureFlag } from '../FeatureFlags';
 export type { FeatureFlagsProps } from '../FeatureFlags';
 export { FilteredActionList } from '../FilteredActionList';

package/lib-esm/experimental/index.js

@@ -17,12 +17,12 @@ export { AriaStatus } from '../live-region/AriaStatus.js';
 export { AriaAlert } from '../live-region/AriaAlert.js';
 export { default as UnderlinePanels } from './UnderlinePanels/UnderlinePanels.js';
 export { SkeletonBox } from '../Skeleton/SkeletonBox.js';
-export { SkeletonText } from './Skeleton/SkeletonText.js';
-export { SkeletonAvatar } from './Skeleton/SkeletonAvatar.js';
+export { SkeletonText } from '../SkeletonText/SkeletonText.js';
+export { SkeletonAvatar } from '../SkeletonAvatar/SkeletonAvatar.js';
 export { FeatureFlags } from '../FeatureFlags/FeatureFlags.js';
 export { DefaultFeatureFlags } from '../FeatureFlags/DefaultFeatureFlags.js';
 export { useFeatureFlag } from '../FeatureFlags/useFeatureFlag.js';
-export { FilteredActionList } from '../FilteredActionList/FilteredActionListEntry.js';
+export { FilteredActionList } from '../FilteredActionList/FilteredActionList.js';
 export { IssueLabel } from './IssueLabel/IssueLabel.js';
 export { PageHeader } from '../PageHeader/PageHeader.js';
 export { Hidden } from '../Hidden/Hidden.js';

package/lib-esm/hooks/useMenuKeyboardNavigation.js

@@ -25,9 +25,10 @@ const useMenuKeyboardNavigation = (open, onClose, containerRef, anchorRef, t0) =
  * and the focus should naturally move to the next item
  */
 const useCloseMenuOnTab = (open, onClose, containerRef, anchorRef) => {
-  const $ = c(10);
+  const $ = c(6);
   let t0;
-  if ($[0] !== (anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) || $[1] !== (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) || $[2] !== onClose || $[3] !== open) {
+  let t1;
+  if ($[0] !== anchorRef || $[1] !== containerRef || $[2] !== onClose || $[3] !== open) {
     t0 = () => {
       const container = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
       const anchor = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current;
@@ -43,24 +44,16 @@ const useCloseMenuOnTab = (open, onClose, containerRef, anchorRef) => {
         anchor === null || anchor === void 0 ? void 0 : anchor.removeEventListener("keydown", handler);
       };
     };
-    $[0] = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current;
-    $[1] = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
+    t1 = [open, onClose, containerRef, anchorRef];
+    $[0] = anchorRef;
+    $[1] = containerRef;
     $[2] = onClose;
     $[3] = open;
     $[4] = t0;
+    $[5] = t1;
   } else {
     t0 = $[4];
-  }
-  let t1;
-  if ($[5] !== anchorRef || $[6] !== containerRef || $[7] !== onClose || $[8] !== open) {
-    t1 = [open, onClose, containerRef, anchorRef];
-    $[5] = anchorRef;
-    $[6] = containerRef;
-    $[7] = onClose;
-    $[8] = open;
-    $[9] = t1;
-  } else {
-    t1 = $[9];
+    t1 = $[5];
   }
   React.useEffect(t0, t1);
 };
@@ -69,9 +62,10 @@ const useCloseMenuOnTab = (open, onClose, containerRef, anchorRef) => {
  * Close submenu when left arrow key is pressed
  */
 const useCloseSubmenuOnArrow = (open, isSubmenu, onClose, containerRef) => {
-  const $ = c(10);
+  const $ = c(6);
   let t0;
-  if ($[0] !== (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) || $[1] !== isSubmenu || $[2] !== onClose || $[3] !== open) {
+  let t1;
+  if ($[0] !== containerRef || $[1] !== isSubmenu || $[2] !== onClose || $[3] !== open) {
     t0 = () => {
       const container = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
       const handler = event => {
@@ -84,24 +78,16 @@ const useCloseSubmenuOnArrow = (open, isSubmenu, onClose, containerRef) => {
         container === null || container === void 0 ? void 0 : container.removeEventListener("keydown", handler);
       };
     };
-    $[0] = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
+    t1 = [open, onClose, containerRef, isSubmenu];
+    $[0] = containerRef;
     $[1] = isSubmenu;
     $[2] = onClose;
     $[3] = open;
     $[4] = t0;
+    $[5] = t1;
   } else {
     t0 = $[4];
-  }
-  let t1;
-  if ($[5] !== containerRef || $[6] !== isSubmenu || $[7] !== onClose || $[8] !== open) {
-    t1 = [open, onClose, containerRef, isSubmenu];
-    $[5] = containerRef;
-    $[6] = isSubmenu;
-    $[7] = onClose;
-    $[8] = open;
-    $[9] = t1;
-  } else {
-    t1 = $[9];
+    t1 = $[5];
   }
   React.useEffect(t0, t1);
 };
@@ -111,9 +97,10 @@ const useCloseSubmenuOnArrow = (open, isSubmenu, onClose, containerRef) => {
  * focus should move to a menu item
  */
 const useMoveFocusToMenuItem = (open, containerRef, anchorRef) => {
-  const $ = c(8);
+  const $ = c(5);
   let t0;
-  if ($[0] !== (anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) || $[1] !== (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) || $[2] !== open) {
+  let t1;
+  if ($[0] !== anchorRef || $[1] !== containerRef || $[2] !== open) {
     t0 = () => {
       const container = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
       const anchor = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current;
@@ -136,22 +123,15 @@ const useMoveFocusToMenuItem = (open, containerRef, anchorRef) => {
       anchor === null || anchor === void 0 ? void 0 : anchor.addEventListener("keydown", handler);
       return () => anchor === null || anchor === void 0 ? void 0 : anchor.addEventListener("keydown", handler);
     };
-    $[0] = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current;
-    $[1] = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
+    t1 = [open, containerRef, anchorRef];
+    $[0] = anchorRef;
+    $[1] = containerRef;
     $[2] = open;
     $[3] = t0;
+    $[4] = t1;
   } else {
     t0 = $[3];
-  }
-  let t1;
-  if ($[4] !== anchorRef || $[5] !== containerRef || $[6] !== open) {
-    t1 = [open, containerRef, anchorRef];
-    $[4] = anchorRef;
-    $[5] = containerRef;
-    $[6] = open;
-    $[7] = t1;
-  } else {
-    t1 = $[7];
+    t1 = $[4];
   }
   React.useEffect(t0, t1);
 };