@sanity/ui 3.0.9 → 3.0.11-canary.0

package/dist/_chunks-cjs/_visual-editing.js

@@ -197,7 +197,7 @@ function useArrayProp(val, defaultVal) {
   return hash !== cachedHash && setCache([_getArrayProp(val, defaultVal), hash]), cachedVal;
 }
 function useClickOutsideEvent(listener, t0, boundaryElement) {
-  const $ = reactCompilerRuntime.c(9), elementsArg = t0 === void 0 ? _temp$9 : t0;
+  const $ = reactCompilerRuntime.c(9), elementsArg = t0 === void 0 ? _temp$a : t0;
   let t1;
   $[0] !== boundaryElement || $[1] !== elementsArg || $[2] !== listener ? (t1 = (evt) => {
     if (!listener)
@@ -227,7 +227,7 @@ function useClickOutsideEvent(listener, t0, boundaryElement) {
   let t3;
   $[7] !== hasListener ? (t3 = [hasListener], $[7] = hasListener, $[8] = t3) : t3 = $[8], react.useEffect(t2, t3), react.useDebugValue(listener ? "MouseDown On" : "MouseDown Off");
 }
-function _temp$9() {
+function _temp$a() {
   return EMPTY_ARRAY;
 }
 function useCustomValidity(ref, customValidity) {
@@ -318,7 +318,11 @@ function getGlobalScope() {
 const globalScope = getGlobalScope();
 function createGlobalScopedContext(key2, defaultValue) {
   const symbol = Symbol.for(key2);
-  return typeof document > "u" ? react.createContext(defaultValue) : (globalScope[symbol] = globalScope[symbol] || react.createContext(defaultValue), globalScope[symbol]);
+  if (typeof document > "u") {
+    const context = react.createContext(defaultValue);
+    return context.displayName = key2, context;
+  }
+  return globalScope[symbol] = globalScope[symbol] || react.createContext(defaultValue), globalScope[symbol];
 }
 const ThemeContext = createGlobalScopedContext("@sanity/ui/context/theme", null);
 function ThemeProvider(props) {
@@ -442,15 +446,15 @@ function useMediaIndex() {
   return react.useSyncExternalStore(store.subscribe, store.getSnapshot, getServerSnapshot);
 }
 function usePrefersDark(t0) {
-  return useMatchMedia("(prefers-color-scheme: dark)", t0 === void 0 ? _temp$8 : t0);
+  return useMatchMedia("(prefers-color-scheme: dark)", t0 === void 0 ? _temp$9 : t0);
 }
-function _temp$8() {
+function _temp$9() {
   return !1;
 }
 function usePrefersReducedMotion(t0) {
-  return useMatchMedia("(prefers-reduced-motion: reduce)", t0 === void 0 ? _temp$7 : t0);
+  return useMatchMedia("(prefers-reduced-motion: reduce)", t0 === void 0 ? _temp$8 : t0);
 }
-function _temp$7() {
+function _temp$8() {
   return !1;
 }
 function responsiveBorderStyle() {
@@ -1395,7 +1399,7 @@ const StyledAvatar = /* @__PURE__ */ styledComponents.styled.div.withConfig({
   }, $[20] = onImageLoadError, $[21] = t7) : t7 = $[21];
   const handleImageError = t7;
   let t8;
-  $[22] !== size2 ? (t8 = size2.map(_temp$6), $[22] = size2, $[23] = t8) : t8 = $[23];
+  $[22] !== size2 ? (t8 = size2.map(_temp$7), $[22] = size2, $[23] = t8) : t8 = $[23];
   const initialsSize = t8, t9 = typeof as == "string" ? as : void 0;
   let t10;
   $[24] !== color ? (t10 = /* @__PURE__ */ jsxRuntime.jsx(Arrow$1, { children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "11", height: "7", viewBox: "0 0 11 7", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6.67948 1.50115L11 7L0 7L4.32052 1.50115C4.92109 0.736796 6.07891 0.736795 6.67948 1.50115Z", fill: color }) }) }), $[24] = color, $[25] = t10) : t10 = $[25];
@@ -1416,7 +1420,7 @@ const StyledAvatar = /* @__PURE__ */ styledComponents.styled.div.withConfig({
   ] }), $[39] = arrowPosition, $[40] = as, $[41] = color, $[42] = ref, $[43] = restProps, $[44] = size2, $[45] = status, $[46] = t10, $[47] = t11, $[48] = t12, $[49] = t9, $[50] = title, $[51] = t13) : t13 = $[51], t13;
 });
 Avatar.displayName = "ForwardRef(Avatar)";
-function _temp$6(s) {
+function _temp$7(s) {
   return s === 1 ? 1 : s === 2 ? 3 : s === 3 ? 5 : 0;
 }
 function _responsiveAvatarCounterSizeStyle(props) {
@@ -1464,7 +1468,7 @@ const StyledAvatarCounter = /* @__PURE__ */ styledComponents.styled.div.withConf
     size: t0
   } = props, size2 = useArrayProp(t0 === void 0 ? 1 : t0);
   let t1;
-  $[0] !== size2 ? (t1 = size2.map(_temp$5), $[0] = size2, $[1] = t1) : t1 = $[1];
+  $[0] !== size2 ? (t1 = size2.map(_temp$6), $[0] = size2, $[1] = t1) : t1 = $[1];
   const fontSize2 = t1;
   let t2;
   $[2] !== count || $[3] !== fontSize2 ? (t2 = /* @__PURE__ */ jsxRuntime.jsx(Label, { as: "span", size: fontSize2, weight: "medium", children: count }), $[2] = count, $[3] = fontSize2, $[4] = t2) : t2 = $[4];
@@ -1472,7 +1476,7 @@ const StyledAvatarCounter = /* @__PURE__ */ styledComponents.styled.div.withConf
   return $[5] !== ref || $[6] !== size2 || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsxRuntime.jsx(StyledAvatarCounter, { $size: size2, "data-ui": "AvatarCounter", ref, children: t2 }), $[5] = ref, $[6] = size2, $[7] = t2, $[8] = t3) : t3 = $[8], t3;
 });
 AvatarCounter.displayName = "ForwardRef(AvatarCounter)";
-function _temp$5(s) {
+function _temp$6(s) {
   return s === 1 ? 1 : s === 2 ? 3 : s === 3 ? 5 : 0;
 }
 const BASE_STYLES = styledComponents.css`
@@ -2709,13 +2713,13 @@ const StyledInline = /* @__PURE__ */ styledComponents.styled(Box).withConfig({
     ...restProps
   } = props, $[0] = props, $[1] = as, $[2] = childrenProp, $[3] = restProps, $[4] = space) : (as = $[1], childrenProp = $[2], restProps = $[3], space = $[4]);
   let t0;
-  $[5] !== childrenProp ? (t0 = react.Children.map(childrenProp, _temp$4), $[5] = childrenProp, $[6] = t0) : t0 = $[6];
+  $[5] !== childrenProp ? (t0 = react.Children.map(childrenProp, _temp$5), $[5] = childrenProp, $[6] = t0) : t0 = $[6];
   const children = t0, t1 = useArrayProp(space), t2 = ref;
   let t3;
   return $[7] !== as || $[8] !== children || $[9] !== restProps || $[10] !== t1 || $[11] !== t2 ? (t3 = /* @__PURE__ */ jsxRuntime.jsx(StyledInline, { "data-ui": "Inline", ...restProps, $space: t1, forwardedAs: as, ref: t2, children }), $[7] = as, $[8] = children, $[9] = restProps, $[10] = t1, $[11] = t2, $[12] = t3) : t3 = $[12], t3;
 });
 Inline.displayName = "ForwardRef(Inline)";
-function _temp$4(child) {
+function _temp$5(child) {
   return child && /* @__PURE__ */ jsxRuntime.jsx("div", { children: child });
 }
 function kbdStyle() {
@@ -3036,7 +3040,7 @@ function LayerProvider(props) {
         [childLevel]: prevLen + 1
       };
       return setSize(Object.keys(nextState).length), nextState;
-    }) : setSize(_temp$3), () => {
+    }) : setSize(_temp$4), () => {
       childLevel !== void 0 ? setChildLayers((state_0) => {
         const nextState_0 = {
           ...state_0
@@ -3064,7 +3068,7 @@ function LayerProvider(props) {
 function _temp2$2(v_0) {
   return v_0 - 1;
 }
-function _temp$3(v) {
+function _temp$4(v) {
   return v + 1;
 }
 LayerProvider.displayName = "LayerProvider";
@@ -3169,8 +3173,8 @@ function PortalProvider(props) {
     boundaryElement,
     children,
     element,
-    __unstable_elements: elementsProp
-  } = props, elements = useUnique(elementsProp), fallbackElement = react.useSyncExternalStore(emptySubscribe, _temp$2, _temp2$1), t0 = boundaryElement || null, t1 = element || fallbackElement;
+    __unstable_elements: elements
+  } = props, fallbackElement = react.useSyncExternalStore(emptySubscribe, _temp$3, _temp2$1), t0 = boundaryElement || null, t1 = element || fallbackElement;
   let t2;
   $[0] !== elements || $[1] !== t0 || $[2] !== t1 ? (t2 = {
     version: 0,
@@ -3185,23 +3189,12 @@ function PortalProvider(props) {
 function _temp2$1() {
   return null;
 }
-function _temp$2() {
+function _temp$3() {
   return document.body;
 }
 PortalProvider.displayName = "PortalProvider";
 const emptySubscribe = () => () => {
-};
-function useUnique(value) {
-  const valueRef = react.useRef(value);
-  return _isEqual(valueRef.current, value) || (valueRef.current = value), valueRef.current;
-}
-function _isEqual(objA, objB) {
-  if (!objA || !objB)
-    return objA === objB;
-  const keysA = Object.keys(objA), keysB = Object.keys(objB);
-  return keysA.length !== keysB.length ? !1 : keysA.every((key2) => objA[key2] === objB[key2]);
-}
-const StyledSrOnly = styledComponents.styled.div.withConfig({
+}, StyledSrOnly = styledComponents.styled.div.withConfig({
   displayName: "StyledSrOnly",
   componentId: "sc-mubr0c-0"
 })`display:block;width:0;height:0;position:absolute;overflow:hidden;overflow:clip;`, SrOnly = react.forwardRef(function(props, ref) {
@@ -4274,7 +4267,7 @@ const CLEAR_BUTTON_BOX_STYLE = {
   const border2 = t0 === void 0 ? !0 : t0, disabled = t1 === void 0 ? !1 : t1, fontSizeProp = t2 === void 0 ? 2 : t2, paddingProp = t3 === void 0 ? 3 : t3, radiusProp = t4 === void 0 ? 2 : t4, spaceProp = t5 === void 0 ? 3 : t5, type = t6 === void 0 ? "text" : t6, ref = react.useRef(null), rootTheme = useRootTheme(), fontSize2 = useArrayProp(fontSizeProp), padding = useArrayProp(paddingProp), radius = useArrayProp(radiusProp), space = useArrayProp(spaceProp), $hasClearButton = !!clearButton, $hasIcon = !!IconComponent, $hasIconRight = !!IconRightComponent, $hasSuffix = !!suffix, $hasPrefix = !!prefix;
   let t7;
   $[19] === Symbol.for("react.memo_cache_sentinel") ? (t7 = () => ref.current, $[19] = t7) : t7 = $[19], react.useImperativeHandle(forwardedRef, t7), useCustomValidity(ref, customValidity);
-  const handleClearMouseDown = _temp$1;
+  const handleClearMouseDown = _temp$2;
   let t8;
   $[20] !== onClear ? (t8 = (event_0) => {
     event_0.preventDefault(), event_0.stopPropagation(), onClear && onClear(), ref.current?.focus();
@@ -4327,7 +4320,7 @@ const CLEAR_BUTTON_BOX_STYLE = {
   ] }), $[79] = prefixNode, $[80] = rootTheme.tone, $[81] = suffixNode, $[82] = t20, $[83] = t21) : t21 = $[83], t21;
 });
 TextInput.displayName = "ForwardRef(TextInput)";
-function _temp$1(event) {
+function _temp$2(event) {
   event.preventDefault(), event.stopPropagation();
 }
 function _temp2(v) {
@@ -4665,16 +4658,24 @@ function _sortElements(rootElement, elements) {
   elements.sort(_sort);
 }
 function useMenuController(props) {
-  const {
+  const $ = reactCompilerRuntime.c(21), {
     onKeyDown,
     originElement,
     shouldFocus,
     rootElementRef
-  } = props, elementsRef = react.useRef([]), [activeIndex, _setActiveIndex] = react.useState(-1), activeIndexRef = react.useRef(activeIndex), activeElement = react.useMemo(() => elementsRef.current[activeIndex] || null, [activeIndex]), mounted = !!rootElementRef.current, setActiveIndex = react.useCallback((nextActiveIndex) => {
-    _setActiveIndex(nextActiveIndex), activeIndexRef.current = nextActiveIndex;
-  }, []), mount = react.useCallback((element, selected) => {
-    if (!element) return () => {
-    };
+  } = props;
+  let t0;
+  $[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = [], $[0] = t0) : t0 = $[0];
+  const elementsRef = react.useRef(t0), [activeIndex, _setActiveIndex] = react.useState(-1), activeIndexRef = react.useRef(activeIndex), [activeElement, setActiveElement] = react.useState(null);
+  let t1;
+  $[1] === Symbol.for("react.memo_cache_sentinel") ? (t1 = (nextActiveIndex) => {
+    _setActiveIndex(nextActiveIndex), activeIndexRef.current = nextActiveIndex, setActiveElement(elementsRef.current[nextActiveIndex] || null);
+  }, $[1] = t1) : t1 = $[1];
+  const setActiveIndex = t1;
+  let t2;
+  $[2] !== rootElementRef ? (t2 = (element, selected) => {
+    if (!element)
+      return _temp$1;
     if (elementsRef.current.indexOf(element) === -1 && (elementsRef.current.push(element), _sortElements(rootElementRef.current, elementsRef.current)), selected) {
       const selectedIndex = elementsRef.current.indexOf(element);
       setActiveIndex(selectedIndex);
@@ -4683,7 +4684,10 @@ function useMenuController(props) {
       const idx = elementsRef.current.indexOf(element);
       idx > -1 && elementsRef.current.splice(idx, 1);
     };
-  }, [rootElementRef, setActiveIndex]), handleKeyDown = react.useCallback((event) => {
+  }, $[2] = rootElementRef, $[3] = t2) : t2 = $[3];
+  const mount = t2;
+  let t3;
+  $[4] !== onKeyDown || $[5] !== originElement ? (t3 = (event) => {
     if (event.key === "Tab") {
       originElement && originElement.focus();
       return;
@@ -4691,7 +4695,8 @@ function useMenuController(props) {
     if (event.key === "Home") {
       event.preventDefault(), event.stopPropagation();
       const el = _getFocusableElements(elementsRef.current)[0];
-      if (!el) return;
+      if (!el)
+        return;
       const currentIndex = elementsRef.current.indexOf(el);
       setActiveIndex(currentIndex);
       return;
@@ -4699,7 +4704,8 @@ function useMenuController(props) {
     if (event.key === "End") {
       event.preventDefault(), event.stopPropagation();
       const focusableElements_0 = _getFocusableElements(elementsRef.current), el_0 = focusableElements_0[focusableElements_0.length - 1];
-      if (!el_0) return;
+      if (!el_0)
+        return;
       const currentIndex_0 = elementsRef.current.indexOf(el_0);
       setActiveIndex(currentIndex_0);
       return;
@@ -4707,7 +4713,8 @@ function useMenuController(props) {
     if (event.key === "ArrowUp") {
       event.preventDefault(), event.stopPropagation();
       const focusableElements_1 = _getFocusableElements(elementsRef.current), focusableLen = focusableElements_1.length;
-      if (focusableLen === 0) return;
+      if (focusableLen === 0)
+        return;
       const focusedElement = elementsRef.current[activeIndexRef.current];
       let focusedIndex = focusableElements_1.indexOf(focusedElement);
       focusedIndex = (focusedIndex - 1 + focusableLen) % focusableLen;
@@ -4718,7 +4725,8 @@ function useMenuController(props) {
     if (event.key === "ArrowDown") {
       event.preventDefault(), event.stopPropagation();
       const focusableElements_2 = _getFocusableElements(elementsRef.current), focusableLen_0 = focusableElements_2.length;
-      if (focusableLen_0 === 0) return;
+      if (focusableLen_0 === 0)
+        return;
       const focusedElement_0 = elementsRef.current[activeIndexRef.current];
       let focusedIndex_0 = focusableElements_2.indexOf(focusedElement_0);
       focusedIndex_0 = (focusedIndex_0 + 1) % focusableLen_0;
@@ -4727,14 +4735,23 @@ function useMenuController(props) {
       return;
     }
     onKeyDown && onKeyDown(event);
-  }, [onKeyDown, originElement, setActiveIndex]), handleItemMouseEnter = react.useCallback((event_0) => {
+  }, $[4] = onKeyDown, $[5] = originElement, $[6] = t3) : t3 = $[6];
+  const handleKeyDown = t3;
+  let t4;
+  $[7] === Symbol.for("react.memo_cache_sentinel") ? (t4 = (event_0) => {
     const element_0 = event_0.currentTarget, currentIndex_3 = elementsRef.current.indexOf(element_0);
     setActiveIndex(currentIndex_3);
-  }, [setActiveIndex]), handleItemMouseLeave = react.useCallback(() => {
+  }, $[7] = t4) : t4 = $[7];
+  const handleItemMouseEnter = t4;
+  let t5;
+  $[8] !== rootElementRef ? (t5 = () => {
     setActiveIndex(-2), rootElementRef.current?.focus();
-  }, [rootElementRef, setActiveIndex]);
-  return react.useEffect(() => {
-    if (!mounted) return;
+  }, $[8] = rootElementRef, $[9] = t5) : t5 = $[9];
+  const handleItemMouseLeave = t5;
+  let t6, t7;
+  $[10] !== activeIndex || $[11] !== rootElementRef || $[12] !== shouldFocus ? (t6 = () => {
+    if (!rootElementRef.current)
+      return;
     const rafId = requestAnimationFrame(() => {
       if (activeIndex === -1) {
         if (shouldFocus === "first") {
@@ -4756,20 +4773,24 @@ function useMenuController(props) {
       (elementsRef.current[activeIndex] || null)?.focus();
     });
     return () => cancelAnimationFrame(rafId);
-  }, [activeIndex, mounted, setActiveIndex, shouldFocus]), {
+  }, t7 = [activeIndex, rootElementRef, setActiveIndex, shouldFocus], $[10] = activeIndex, $[11] = rootElementRef, $[12] = shouldFocus, $[13] = t6, $[14] = t7) : (t6 = $[13], t7 = $[14]), react.useEffect(t6, t7);
+  let t8;
+  return $[15] !== activeElement || $[16] !== activeIndex || $[17] !== handleItemMouseLeave || $[18] !== handleKeyDown || $[19] !== mount ? (t8 = {
     activeElement,
     activeIndex,
     handleItemMouseEnter,
     handleItemMouseLeave,
     handleKeyDown,
     mount
-  };
+  }, $[15] = activeElement, $[16] = activeIndex, $[17] = handleItemMouseLeave, $[18] = handleKeyDown, $[19] = mount, $[20] = t8) : t8 = $[20], t8;
+}
+function _temp$1() {
 }
 const StyledMenu = styledComponents.styled(Box).withConfig({
   displayName: "StyledMenu",
   componentId: "sc-xt0tnv-0"
 })`outline:none;overflow:auto;`, Menu = react.forwardRef(function(props, forwardedRef) {
-  const $ = reactCompilerRuntime.c(50);
+  const $ = reactCompilerRuntime.c(49);
   let _shouldFocus, children, onClickOutside, onEscape, onItemClick, onItemSelect, onKeyDown, originElement, registerElement, restProps, t0, t1;
   if ($[0] !== props) {
     const {
@@ -4828,27 +4849,24 @@ const StyledMenu = styledComponents.styled(Box).withConfig({
     isTopLayer && event.key === "Escape" && (event.stopPropagation(), onEscape && onEscape());
   }, $[25] = isTopLayer, $[26] = onEscape, $[27] = t8) : t8 = $[27], useGlobalKeyDown(t8);
   let t9;
-  $[28] !== activeElement || $[29] !== activeIndex || $[30] !== handleItemMouseEnter || $[31] !== handleItemMouseLeave || $[32] !== mount || $[33] !== onClickOutside || $[34] !== onEscape || $[35] !== onItemClick || $[36] !== registerElement ? (t9 = {
-    version: 0,
+  $[28] !== activeElement || $[29] !== handleItemMouseEnter || $[30] !== handleItemMouseLeave || $[31] !== mount || $[32] !== onClickOutside || $[33] !== onEscape || $[34] !== onItemClick || $[35] !== registerElement ? (t9 = {
+    version: 2,
     activeElement,
-    activeIndex,
     mount,
     onClickOutside,
     onEscape,
     onItemClick,
     onItemMouseEnter: handleItemMouseEnter,
     onItemMouseLeave: handleItemMouseLeave,
-    registerElement,
-    onMouseEnter: handleItemMouseEnter,
-    onMouseLeave: handleItemMouseLeave
-  }, $[28] = activeElement, $[29] = activeIndex, $[30] = handleItemMouseEnter, $[31] = handleItemMouseLeave, $[32] = mount, $[33] = onClickOutside, $[34] = onEscape, $[35] = onItemClick, $[36] = registerElement, $[37] = t9) : t9 = $[37];
+    registerElement
+  }, $[28] = activeElement, $[29] = handleItemMouseEnter, $[30] = handleItemMouseLeave, $[31] = mount, $[32] = onClickOutside, $[33] = onEscape, $[34] = onItemClick, $[35] = registerElement, $[36] = t9) : t9 = $[36];
   const value = t9;
   let t10;
-  $[38] !== children || $[39] !== space ? (t10 = /* @__PURE__ */ jsxRuntime.jsx(Stack, { space, children }), $[38] = children, $[39] = space, $[40] = t10) : t10 = $[40];
+  $[37] !== children || $[38] !== space ? (t10 = /* @__PURE__ */ jsxRuntime.jsx(Stack, { space, children }), $[37] = children, $[38] = space, $[39] = t10) : t10 = $[39];
   let t11;
-  $[41] !== handleKeyDown || $[42] !== handleRefChange || $[43] !== padding || $[44] !== restProps || $[45] !== t10 ? (t11 = /* @__PURE__ */ jsxRuntime.jsx(StyledMenu, { "data-ui": "Menu", ...restProps, onKeyDown: handleKeyDown, padding, ref: handleRefChange, role: "menu", tabIndex: -1, children: t10 }), $[41] = handleKeyDown, $[42] = handleRefChange, $[43] = padding, $[44] = restProps, $[45] = t10, $[46] = t11) : t11 = $[46];
+  $[40] !== handleKeyDown || $[41] !== handleRefChange || $[42] !== padding || $[43] !== restProps || $[44] !== t10 ? (t11 = /* @__PURE__ */ jsxRuntime.jsx(StyledMenu, { "data-ui": "Menu", ...restProps, onKeyDown: handleKeyDown, padding, ref: handleRefChange, role: "menu", tabIndex: -1, children: t10 }), $[40] = handleKeyDown, $[41] = handleRefChange, $[42] = padding, $[43] = restProps, $[44] = t10, $[45] = t11) : t11 = $[45];
   let t12;
-  return $[47] !== t11 || $[48] !== value ? (t12 = /* @__PURE__ */ jsxRuntime.jsx(MenuContext.Provider, { value, children: t11 }), $[47] = t11, $[48] = value, $[49] = t12) : t12 = $[49], t12;
+  return $[46] !== t11 || $[47] !== value ? (t12 = /* @__PURE__ */ jsxRuntime.jsx(MenuContext.Provider, { value, children: t11 }), $[46] = t11, $[47] = value, $[48] = t12) : t12 = $[48], t12;
 });
 Menu.displayName = "ForwardRef(Menu)";
 const MenuDivider = styledComponents.styled.hr.withConfig({
@@ -4965,7 +4983,7 @@ function useMenu() {
   const value = react.useContext(MenuContext);
   if (!value)
     throw new Error("useMenu(): missing context value");
-  if (!isRecord(value) || value.version !== 0)
+  if (!isRecord(value) || value.version !== 2)
     throw new Error("useMenu(): the context value is not compatible");
   return value;
 }
@@ -4997,7 +5015,7 @@ function MenuGroup(props) {
     onItemClick,
     onItemMouseEnter: _onItemMouseEnter,
     registerElement
-  } = menu, onItemMouseEnter = _onItemMouseEnter ?? menu.onMouseEnter, [rootElement, setRootElement] = react.useState(null), [open, setOpen] = react.useState(!1), [shouldFocus, setShouldFocus] = react.useState(null), active = !!activeElement && activeElement === rootElement, [withinMenu, setWithinMenu] = react.useState(!1);
+  } = menu, onItemMouseEnter = _onItemMouseEnter ?? menu.onItemMouseEnter, [rootElement, setRootElement] = react.useState(null), [open, setOpen] = react.useState(!1), [shouldFocus, setShouldFocus] = react.useState(null), active = !!activeElement && activeElement === rootElement, [withinMenu, setWithinMenu] = react.useState(!1);
   let t6;
   $[14] !== onItemMouseEnter ? (t6 = (event) => {
     setWithinMenu(!1), onItemMouseEnter(event), setOpen(!0);
@@ -5110,7 +5128,7 @@ const MenuItem = react.forwardRef(function(props, forwardedRef) {
     onItemClick,
     onItemMouseEnter: _onItemMouseEnter,
     onItemMouseLeave: _onItemMouseLeave
-  } = menu, onItemMouseEnter = _onItemMouseEnter ?? menu.onMouseEnter, onItemMouseLeave = _onItemMouseLeave ?? menu.onMouseLeave, [rootElement, setRootElement] = react.useState(null), active = !!activeElement && activeElement === rootElement, ref = react.useRef(null);
+  } = menu, onItemMouseEnter = _onItemMouseEnter ?? menu.onItemMouseEnter, onItemMouseLeave = _onItemMouseLeave ?? menu.onItemMouseLeave, [rootElement, setRootElement] = react.useState(null), active = !!activeElement && activeElement === rootElement, ref = react.useRef(null);
   let t6;
   $[23] === Symbol.for("react.memo_cache_sentinel") ? (t6 = () => ref.current, $[23] = t6) : t6 = $[23], react.useImperativeHandle(forwardedRef, t6);
   let t7, t8;