@radix-ui/react-navigation-menu 1.2.18 → 1.2.19-rc.1784074599772

package/dist/index.mjs

@@ -1,4 +1,6 @@
 "use client";
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 
 // src/navigation-menu.tsx
 import * as React from "react";
@@ -27,8 +29,8 @@ var [createNavigationMenuContext, createNavigationMenuScope] = createContextScop
 );
 var [NavigationMenuProviderImpl, useNavigationMenuContext] = createNavigationMenuContext(NAVIGATION_MENU_NAME);
 var [ViewportContentProvider, useViewportContentContext] = createNavigationMenuContext(NAVIGATION_MENU_NAME);
-var NavigationMenu = React.forwardRef(
-  (props, forwardedRef) => {
+var NavigationMenu = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function NavigationMenu2(props, forwardedRef) {
     const {
       __scopeNavigationMenu,
       value: valueProp,
@@ -49,7 +51,7 @@ var NavigationMenu = React.forwardRef(
     const [isOpenDelayed, setIsOpenDelayed] = React.useState(true);
     const [value, setValue] = useControllableState({
       prop: valueProp,
-      onChange: (value2) => {
+      onChange: /* @__PURE__ */ __name((value2) => {
         const isOpen = value2 !== "";
         const hasSkipDelayDuration = skipDelayDuration > 0;
         if (isOpen) {
@@ -63,7 +65,7 @@ var NavigationMenu = React.forwardRef(
           );
         }
         onValueChange?.(value2);
-      },
+      }, "onChange"),
       defaultProp: defaultValue ?? "",
       caller: NAVIGATION_MENU_NAME
     });
@@ -135,12 +137,12 @@ var NavigationMenu = React.forwardRef(
         )
       }
     );
-  }
+  }, "NavigationMenu")
 );
-NavigationMenu.displayName = NAVIGATION_MENU_NAME;
 var SUB_NAME = "NavigationMenuSub";
-var NavigationMenuSub = React.forwardRef(
-  (props, forwardedRef) => {
+var NavigationMenuSub = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function NavigationMenuSub2(props, forwardedRef) {
     const {
       __scopeNavigationMenu,
       value: valueProp,
@@ -171,10 +173,9 @@ var NavigationMenuSub = React.forwardRef(
         children: /* @__PURE__ */ jsx(Primitive.div, { "data-orientation": orientation, ...subProps, ref: forwardedRef })
       }
     );
-  }
+  }, "NavigationMenuSub")
 );
-NavigationMenuSub.displayName = SUB_NAME;
-var NavigationMenuProvider = (props) => {
+var NavigationMenuProvider = /* @__PURE__ */ __name((props) => {
   const {
     scope,
     isRootMenu,
@@ -230,21 +231,22 @@ var NavigationMenuProvider = (props) => {
       children: /* @__PURE__ */ jsx(Collection.Provider, { scope, children: /* @__PURE__ */ jsx(ViewportContentProvider, { scope, items: viewportContent, children }) })
     }
   );
-};
+}, "NavigationMenuProvider");
 var LIST_NAME = "NavigationMenuList";
-var NavigationMenuList = React.forwardRef(
-  (props, forwardedRef) => {
+var NavigationMenuList = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function NavigationMenuList2(props, forwardedRef) {
     const { __scopeNavigationMenu, ...listProps } = props;
     const context = useNavigationMenuContext(LIST_NAME, __scopeNavigationMenu);
     const list = /* @__PURE__ */ jsx(Primitive.ul, { "data-orientation": context.orientation, ...listProps, ref: forwardedRef });
     return /* @__PURE__ */ jsx(Primitive.div, { style: { position: "relative" }, ref: context.onIndicatorTrackChange, children: /* @__PURE__ */ jsx(Collection.Slot, { scope: __scopeNavigationMenu, children: context.isRootMenu ? /* @__PURE__ */ jsx(FocusGroup, { asChild: true, children: list }) : list }) });
-  }
+  }, "NavigationMenuList")
 );
-NavigationMenuList.displayName = LIST_NAME;
 var ITEM_NAME = "NavigationMenuItem";
 var [NavigationMenuItemContextProvider, useNavigationMenuItemContext] = createNavigationMenuContext(ITEM_NAME);
-var NavigationMenuItem = React.forwardRef(
-  (props, forwardedRef) => {
+var NavigationMenuItem = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function NavigationMenuItem2(props, forwardedRef) {
     const { __scopeNavigationMenu, value: valueProp, ...itemProps } = props;
     const autoValue = useId();
     const value = valueProp || autoValue || "LEGACY_REACT_AUTO_VALUE";
@@ -283,11 +285,10 @@ var NavigationMenuItem = React.forwardRef(
         children: /* @__PURE__ */ jsx(Primitive.li, { ...itemProps, ref: forwardedRef })
       }
     );
-  }
+  }, "NavigationMenuItem")
 );
-NavigationMenuItem.displayName = ITEM_NAME;
 var TRIGGER_NAME = "NavigationMenuTrigger";
-var NavigationMenuTrigger = React.forwardRef((props, forwardedRef) => {
+var NavigationMenuTrigger = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function NavigationMenuTrigger2(props, forwardedRef) {
   const { __scopeNavigationMenu, disabled, ...triggerProps } = props;
   const context = useNavigationMenuContext(TRIGGER_NAME, props.__scopeNavigationMenu);
   const itemContext = useNavigationMenuItemContext(TRIGGER_NAME, props.__scopeNavigationMenu);
@@ -366,12 +367,11 @@ var NavigationMenuTrigger = React.forwardRef((props, forwardedRef) => {
       context.viewport && /* @__PURE__ */ jsx("span", { "aria-owns": contentId })
     ] })
   ] });
-});
-NavigationMenuTrigger.displayName = TRIGGER_NAME;
-var LINK_NAME = "NavigationMenuLink";
+}, "NavigationMenuTrigger"));
 var LINK_SELECT = "navigationMenu.linkSelect";
-var NavigationMenuLink = React.forwardRef(
-  (props, forwardedRef) => {
+var NavigationMenuLink = /* @__PURE__ */ React.forwardRef(
+  // blank line to reduce diff noise
+  /* @__PURE__ */ __name(function NavigationMenuLink2(props, forwardedRef) {
     const { __scopeNavigationMenu, active, onSelect, ...linkProps } = props;
     return /* @__PURE__ */ jsx(FocusGroupItem, { asChild: true, children: /* @__PURE__ */ jsx(
       Primitive.a,
@@ -402,11 +402,10 @@ var NavigationMenuLink = React.forwardRef(
         )
       }
     ) });
-  }
+  }, "NavigationMenuLink")
 );
-NavigationMenuLink.displayName = LINK_NAME;
 var INDICATOR_NAME = "NavigationMenuIndicator";
-var NavigationMenuIndicator = React.forwardRef((props, forwardedRef) => {
+var NavigationMenuIndicator = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function NavigationMenuIndicator2(props, forwardedRef) {
   const { forceMount, ...indicatorProps } = props;
   const context = useNavigationMenuContext(INDICATOR_NAME, props.__scopeNavigationMenu);
   const isVisible = Boolean(context.value);
@@ -414,9 +413,8 @@ var NavigationMenuIndicator = React.forwardRef((props, forwardedRef) => {
     /* @__PURE__ */ jsx(Presence, { present: forceMount || isVisible, children: /* @__PURE__ */ jsx(NavigationMenuIndicatorImpl, { ...indicatorProps, ref: forwardedRef }) }),
     context.indicatorTrack
   ) : null;
-});
-NavigationMenuIndicator.displayName = INDICATOR_NAME;
-var NavigationMenuIndicatorImpl = React.forwardRef((props, forwardedRef) => {
+}, "NavigationMenuIndicator"));
+var NavigationMenuIndicatorImpl = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function NavigationMenuIndicatorImpl2(props, forwardedRef) {
   const { __scopeNavigationMenu, ...indicatorProps } = props;
   const context = useNavigationMenuContext(INDICATOR_NAME, __scopeNavigationMenu);
   const getItems = useCollection(__scopeNavigationMenu);
@@ -431,14 +429,14 @@ var NavigationMenuIndicatorImpl = React.forwardRef((props, forwardedRef) => {
     const triggerNode = items.find((item) => item.value === context.value)?.ref.current;
     if (triggerNode) setActiveTrigger(triggerNode);
   }, [getItems, context.value]);
-  const handlePositionChange = () => {
+  const handlePositionChange = /* @__PURE__ */ __name(() => {
     if (activeTrigger) {
       setPosition({
         size: isHorizontal ? activeTrigger.offsetWidth : activeTrigger.offsetHeight,
         offset: isHorizontal ? activeTrigger.offsetLeft : activeTrigger.offsetTop
       });
     }
-  };
+  }, "handlePositionChange");
   useResizeObserver(activeTrigger, handlePositionChange);
   useResizeObserver(context.indicatorTrack, handlePositionChange);
   return position ? /* @__PURE__ */ jsx(
@@ -466,9 +464,9 @@ var NavigationMenuIndicatorImpl = React.forwardRef((props, forwardedRef) => {
       }
     }
   ) : null;
-});
+}, "NavigationMenuIndicatorImpl"));
 var CONTENT_NAME = "NavigationMenuContent";
-var NavigationMenuContent = React.forwardRef((props, forwardedRef) => {
+var NavigationMenuContent = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function NavigationMenuContent2(props, forwardedRef) {
   const { forceMount, ...contentProps } = props;
   const context = useNavigationMenuContext(CONTENT_NAME, props.__scopeNavigationMenu);
   const itemContext = useNavigationMenuItemContext(CONTENT_NAME, props.__scopeNavigationMenu);
@@ -501,9 +499,8 @@ var NavigationMenuContent = React.forwardRef((props, forwardedRef) => {
       }
     }
   ) }) : /* @__PURE__ */ jsx(ViewportContentMounter, { forceMount, ...commonProps, ref: composedRefs });
-});
-NavigationMenuContent.displayName = CONTENT_NAME;
-var ViewportContentMounter = React.forwardRef((props, forwardedRef) => {
+}, "NavigationMenuContent"));
+var ViewportContentMounter = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function ViewportContentMounter2(props, forwardedRef) {
   const context = useNavigationMenuContext(CONTENT_NAME, props.__scopeNavigationMenu);
   const { onViewportContentChange, onViewportContentRemove } = context;
   useLayoutEffect(() => {
@@ -516,9 +513,9 @@ var ViewportContentMounter = React.forwardRef((props, forwardedRef) => {
     return () => onViewportContentRemove(props.value);
   }, [props.value, onViewportContentRemove]);
   return null;
-});
+}, "ViewportContentMounter"));
 var ROOT_CONTENT_DISMISS = "navigationMenu.rootContentDismiss";
-var NavigationMenuContentImpl = React.forwardRef((props, forwardedRef) => {
+var NavigationMenuContentImpl = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function NavigationMenuContentImpl2(props, forwardedRef) {
   const {
     __scopeNavigationMenu,
     value,
@@ -540,11 +537,11 @@ var NavigationMenuContentImpl = React.forwardRef((props, forwardedRef) => {
   React.useEffect(() => {
     const content = ref.current;
     if (context.isRootMenu && content) {
-      const handleClose = () => {
+      const handleClose = /* @__PURE__ */ __name(() => {
         onItemDismiss();
         onRootContentClose();
         if (content.contains(document.activeElement)) triggerRef.current?.focus();
-      };
+      }, "handleClose");
       content.addEventListener(ROOT_CONTENT_DISMISS, handleClose);
       return () => content.removeEventListener(ROOT_CONTENT_DISMISS, handleClose);
     }
@@ -617,16 +614,15 @@ var NavigationMenuContentImpl = React.forwardRef((props, forwardedRef) => {
       })
     }
   ) });
-});
+}, "NavigationMenuContentImpl"));
 var VIEWPORT_NAME = "NavigationMenuViewport";
-var NavigationMenuViewport = React.forwardRef((props, forwardedRef) => {
+var NavigationMenuViewport = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function NavigationMenuViewport2(props, forwardedRef) {
   const { forceMount, ...viewportProps } = props;
   const context = useNavigationMenuContext(VIEWPORT_NAME, props.__scopeNavigationMenu);
   const open = Boolean(context.value);
   return /* @__PURE__ */ jsx(Presence, { present: forceMount || open, children: /* @__PURE__ */ jsx(NavigationMenuViewportImpl, { ...viewportProps, ref: forwardedRef }) });
-});
-NavigationMenuViewport.displayName = VIEWPORT_NAME;
-var NavigationMenuViewportImpl = React.forwardRef((props, forwardedRef) => {
+}, "NavigationMenuViewport"));
+var NavigationMenuViewportImpl = /* @__PURE__ */ React.forwardRef(/* @__PURE__ */ __name(function NavigationMenuViewportImpl2(props, forwardedRef) {
   const { __scopeNavigationMenu, children, ...viewportImplProps } = props;
   const context = useNavigationMenuContext(VIEWPORT_NAME, __scopeNavigationMenu);
   const composedRefs = useComposedRefs(forwardedRef, context.onViewportChange);
@@ -640,9 +636,9 @@ var NavigationMenuViewportImpl = React.forwardRef((props, forwardedRef) => {
   const viewportHeight = size ? size?.height + "px" : void 0;
   const open = Boolean(context.value);
   const activeContentValue = open ? context.value : context.previousValue;
-  const handleSizeChange = () => {
+  const handleSizeChange = /* @__PURE__ */ __name(() => {
     if (content) setSize({ width: content.offsetWidth, height: content.offsetHeight });
-  };
+  }, "handleSizeChange");
   useResizeObserver(content, handleSizeChange);
   return /* @__PURE__ */ jsx(
     Primitive.div,
@@ -674,8 +670,8 @@ var NavigationMenuViewportImpl = React.forwardRef((props, forwardedRef) => {
       })
     }
   );
-});
-var NavigationMenuViewportItem = ({
+}, "NavigationMenuViewportImpl"));
+var NavigationMenuViewportItem = /* @__PURE__ */ __name(({
   contentRef,
   isActive,
   onActiveContentChange,
@@ -691,19 +687,19 @@ var NavigationMenuViewportItem = ({
   );
   const composedRefs = useComposedRefs(contentRef, handleContentChange);
   return /* @__PURE__ */ jsx(NavigationMenuContentImpl, { ...props, ref: composedRefs });
-};
+}, "NavigationMenuViewportItem");
 var FOCUS_GROUP_NAME = "FocusGroup";
-var FocusGroup = React.forwardRef(
-  (props, forwardedRef) => {
+var FocusGroup = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function FocusGroup2(props, forwardedRef) {
     const { __scopeNavigationMenu, ...groupProps } = props;
     const context = useNavigationMenuContext(FOCUS_GROUP_NAME, __scopeNavigationMenu);
     return /* @__PURE__ */ jsx(FocusGroupCollection.Provider, { scope: __scopeNavigationMenu, children: /* @__PURE__ */ jsx(FocusGroupCollection.Slot, { scope: __scopeNavigationMenu, children: /* @__PURE__ */ jsx(Primitive.div, { dir: context.dir, ...groupProps, ref: forwardedRef }) }) });
-  }
+  }, "FocusGroup")
 );
 var ARROW_KEYS = ["ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown"];
 var FOCUS_GROUP_ITEM_NAME = "FocusGroupItem";
-var FocusGroupItem = React.forwardRef(
-  (props, forwardedRef) => {
+var FocusGroupItem = /* @__PURE__ */ React.forwardRef(
+  /* @__PURE__ */ __name(function FocusGroupItem2(props, forwardedRef) {
     const { __scopeNavigationMenu, ...groupProps } = props;
     const getItems = useFocusGroupCollection(__scopeNavigationMenu);
     const context = useNavigationMenuContext(FOCUS_GROUP_ITEM_NAME, __scopeNavigationMenu);
@@ -729,20 +725,21 @@ var FocusGroupItem = React.forwardRef(
         })
       }
     ) });
-  }
+  }, "FocusGroupItem")
 );
 function getTabbableCandidates(container) {
   const nodes = [];
   const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
-    acceptNode: (node) => {
+    acceptNode: /* @__PURE__ */ __name((node) => {
       const isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
       if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP;
       return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
-    }
+    }, "acceptNode")
   });
   while (walker.nextNode()) nodes.push(walker.currentNode);
   return nodes;
 }
+__name(getTabbableCandidates, "getTabbableCandidates");
 function focusFirst(candidates) {
   const previouslyFocusedElement = document.activeElement;
   return candidates.some((candidate) => {
@@ -751,6 +748,7 @@ function focusFirst(candidates) {
     return document.activeElement !== previouslyFocusedElement;
   });
 }
+__name(focusFirst, "focusFirst");
 function removeFromTabOrder(candidates) {
   candidates.forEach((candidate) => {
     candidate.dataset.tabindex = candidate.getAttribute("tabindex") || "";
@@ -763,6 +761,7 @@ function removeFromTabOrder(candidates) {
     });
   };
 }
+__name(removeFromTabOrder, "removeFromTabOrder");
 function useResizeObserver(element, onResize) {
   const handleResize = useCallbackRef(onResize);
   useLayoutEffect(() => {
@@ -780,18 +779,23 @@ function useResizeObserver(element, onResize) {
     }
   }, [element, handleResize]);
 }
+__name(useResizeObserver, "useResizeObserver");
 function getOpenState(open) {
   return open ? "open" : "closed";
 }
+__name(getOpenState, "getOpenState");
 function makeTriggerId(baseId, value) {
   return `${baseId}-trigger-${value}`;
 }
+__name(makeTriggerId, "makeTriggerId");
 function makeContentId(baseId, value) {
   return `${baseId}-content-${value}`;
 }
+__name(makeContentId, "makeContentId");
 function whenMouse(handler) {
   return (event) => event.pointerType === "mouse" ? handler(event) : void 0;
 }
+__name(whenMouse, "whenMouse");
 var Root2 = NavigationMenu;
 var Sub = NavigationMenuSub;
 var List = NavigationMenuList;