@radix-ui/react-menu 0.1.7-rc.35 → 0.1.7-rc.38

package/dist/index.module.js

@@ -1,22 +1,23 @@
 import $epM9y$babelruntimehelpersesmextends from "@babel/runtime/helpers/esm/extends";
 import {useState as $epM9y$useState, useRef as $epM9y$useRef, useEffect as $epM9y$useEffect, createElement as $epM9y$createElement, useCallback as $epM9y$useCallback, forwardRef as $epM9y$forwardRef, Fragment as $epM9y$Fragment} from "react";
-import {RemoveScroll as $epM9y$RemoveScroll} from "react-remove-scroll";
-import {hideOthers as $epM9y$hideOthers} from "aria-hidden";
 import {composeEventHandlers as $epM9y$composeEventHandlers} from "@radix-ui/primitive";
 import {createCollection as $epM9y$createCollection} from "@radix-ui/react-collection";
 import {useComposedRefs as $epM9y$useComposedRefs, composeRefs as $epM9y$composeRefs} from "@radix-ui/react-compose-refs";
 import {createContextScope as $epM9y$createContextScope} from "@radix-ui/react-context";
+import {useDirection as $epM9y$useDirection} from "@radix-ui/react-direction";
 import {DismissableLayer as $epM9y$DismissableLayer} from "@radix-ui/react-dismissable-layer";
+import {useFocusGuards as $epM9y$useFocusGuards} from "@radix-ui/react-focus-guards";
 import {FocusScope as $epM9y$FocusScope} from "@radix-ui/react-focus-scope";
+import {useId as $epM9y$useId} from "@radix-ui/react-id";
+import {createPopperScope as $epM9y$createPopperScope, Root as $epM9y$Root, Anchor as $epM9y$Anchor, Content as $epM9y$Content, Arrow as $epM9y$Arrow} from "@radix-ui/react-popper";
+import {UnstablePortal as $epM9y$UnstablePortal} from "@radix-ui/react-portal";
 import {Presence as $epM9y$Presence} from "@radix-ui/react-presence";
 import {Primitive as $epM9y$Primitive, dispatchDiscreteCustomEvent as $epM9y$dispatchDiscreteCustomEvent} from "@radix-ui/react-primitive";
-import {createPopperScope as $epM9y$createPopperScope, Root as $epM9y$Root, Anchor as $epM9y$Anchor, Content as $epM9y$Content, Arrow as $epM9y$Arrow} from "@radix-ui/react-popper";
-import {Portal as $epM9y$Portal} from "@radix-ui/react-portal";
 import {createRovingFocusGroupScope as $epM9y$createRovingFocusGroupScope, Root as $epM9y$Root1, Item as $epM9y$Item} from "@radix-ui/react-roving-focus";
-import {useDirection as $epM9y$useDirection} from "@radix-ui/react-direction";
+import {Slot as $epM9y$Slot} from "@radix-ui/react-slot";
 import {useCallbackRef as $epM9y$useCallbackRef} from "@radix-ui/react-use-callback-ref";
-import {useFocusGuards as $epM9y$useFocusGuards} from "@radix-ui/react-focus-guards";
-import {useId as $epM9y$useId} from "@radix-ui/react-id";
+import {hideOthers as $epM9y$hideOthers} from "aria-hidden";
+import {RemoveScroll as $epM9y$RemoveScroll} from "react-remove-scroll";
 
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
@@ -26,6 +27,7 @@ var $6cc32821e9371a1c$exports = {};
 $parcel$export($6cc32821e9371a1c$exports, "createMenuScope", () => $6cc32821e9371a1c$export$4027731b685e72eb);
 $parcel$export($6cc32821e9371a1c$exports, "Menu", () => $6cc32821e9371a1c$export$d9b273488cd8ce6f);
 $parcel$export($6cc32821e9371a1c$exports, "MenuAnchor", () => $6cc32821e9371a1c$export$9fa5ebd18bee4d43);
+$parcel$export($6cc32821e9371a1c$exports, "MenuPortal", () => $6cc32821e9371a1c$export$793392f970497feb);
 $parcel$export($6cc32821e9371a1c$exports, "MenuContent", () => $6cc32821e9371a1c$export$479f0f2f71193efe);
 $parcel$export($6cc32821e9371a1c$exports, "MenuGroup", () => $6cc32821e9371a1c$export$22a631d1f72787bb);
 $parcel$export($6cc32821e9371a1c$exports, "MenuLabel", () => $6cc32821e9371a1c$export$dd37bec0e8a99143);
@@ -41,6 +43,7 @@ $parcel$export($6cc32821e9371a1c$exports, "MenuSubTrigger", () => $6cc32821e9371
 $parcel$export($6cc32821e9371a1c$exports, "MenuSubContent", () => $6cc32821e9371a1c$export$e7142ab31822bde6);
 $parcel$export($6cc32821e9371a1c$exports, "Root", () => $6cc32821e9371a1c$export$be92b6f5f03c0fe9);
 $parcel$export($6cc32821e9371a1c$exports, "Anchor", () => $6cc32821e9371a1c$export$b688253958b8dfe7);
+$parcel$export($6cc32821e9371a1c$exports, "Portal", () => $6cc32821e9371a1c$export$602eac185826482c);
 $parcel$export($6cc32821e9371a1c$exports, "Content", () => $6cc32821e9371a1c$export$7c6e2c02157bb7d2);
 $parcel$export($6cc32821e9371a1c$exports, "Group", () => $6cc32821e9371a1c$export$eb2fcfdbd7ba97d4);
 $parcel$export($6cc32821e9371a1c$exports, "Label", () => $6cc32821e9371a1c$export$b04be29aa201d4f5);
@@ -73,6 +76,7 @@ $parcel$export($6cc32821e9371a1c$exports, "SubContent", () => $6cc32821e9371a1c$
 
 
 
+
 
 
 const $6cc32821e9371a1c$var$SELECTION_KEYS = [
@@ -196,12 +200,35 @@ const $6cc32821e9371a1c$export$9fa5ebd18bee4d43 = /*#__PURE__*/ $epM9y$forwardRe
 /*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$9fa5ebd18bee4d43, {
     displayName: $6cc32821e9371a1c$var$ANCHOR_NAME
 });
+/* -------------------------------------------------------------------------------------------------
+ * MenuPortal
+ * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$PORTAL_NAME = 'MenuPortal';
+const [$6cc32821e9371a1c$var$PortalProvider, $6cc32821e9371a1c$var$usePortalContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$PORTAL_NAME, {
+    forceMount: undefined
+});
+const $6cc32821e9371a1c$export$793392f970497feb = (props)=>{
+    const { __scopeMenu: __scopeMenu , forceMount: forceMount , children: children , container: container  } = props;
+    const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$PORTAL_NAME, __scopeMenu);
+    return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$PortalProvider, {
+        scope: __scopeMenu,
+        forceMount: forceMount
+    }, /*#__PURE__*/ $epM9y$createElement($epM9y$Presence, {
+        present: forceMount || context.open
+    }, /*#__PURE__*/ $epM9y$createElement($epM9y$UnstablePortal, {
+        asChild: true,
+        container: container
+    }, children)));
+};
+/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$793392f970497feb, {
+    displayName: $6cc32821e9371a1c$var$PORTAL_NAME
+});
 /* -------------------------------------------------------------------------------------------------
  * MenuContent
  * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$CONTENT_NAME = 'MenuContent';
 const [$6cc32821e9371a1c$var$MenuContentProvider, $6cc32821e9371a1c$var$useMenuContentContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$CONTENT_NAME);
 const $6cc32821e9371a1c$export$479f0f2f71193efe = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
-    const { forceMount: forceMount , ...contentProps } = props;
+    const portalContext = $6cc32821e9371a1c$var$usePortalContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
+    const { forceMount: forceMount = portalContext.forceMount , ...contentProps } = props;
     const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
     const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
     return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$Collection.Provider, {
@@ -250,7 +277,7 @@ const $6cc32821e9371a1c$var$MenuRootContentNonModal = /*#__PURE__*/ $epM9y$forwa
     }));
 });
 /* ---------------------------------------------------------------------------------------------- */ const $6cc32821e9371a1c$var$MenuContentImpl = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
-    const { __scopeMenu: __scopeMenu , loop: loop = false , trapFocus: trapFocus , onOpenAutoFocus: onOpenAutoFocus , onCloseAutoFocus: onCloseAutoFocus , disableOutsidePointerEvents: disableOutsidePointerEvents , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , disableOutsideScroll: disableOutsideScroll , portalled: portalled , ...contentProps } = props;
+    const { __scopeMenu: __scopeMenu , loop: loop = false , trapFocus: trapFocus , onOpenAutoFocus: onOpenAutoFocus , onCloseAutoFocus: onCloseAutoFocus , disableOutsidePointerEvents: disableOutsidePointerEvents , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , disableOutsideScroll: disableOutsideScroll , ...contentProps } = props;
     const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, __scopeMenu);
     const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, __scopeMenu);
     const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
@@ -265,9 +292,9 @@ const $6cc32821e9371a1c$var$MenuRootContentNonModal = /*#__PURE__*/ $epM9y$forwa
     const pointerGraceIntentRef = $epM9y$useRef(null);
     const pointerDirRef = $epM9y$useRef('right');
     const lastPointerXRef = $epM9y$useRef(0);
-    const PortalWrapper = portalled ? $epM9y$Portal : $epM9y$Fragment;
     const ScrollLockWrapper = disableOutsideScroll ? $epM9y$RemoveScroll : $epM9y$Fragment;
     const scrollLockWrapperProps = disableOutsideScroll ? {
+        as: $epM9y$Slot,
         allowPinchZoom: rootContext.allowPinchZoom
     } : undefined;
     const handleTypeaheadSearch = (key)=>{
@@ -306,7 +333,7 @@ const $6cc32821e9371a1c$var$MenuRootContentNonModal = /*#__PURE__*/ $epM9y$forwa
         const isMovingTowards = pointerDirRef.current === ((_pointerGraceIntentRe = pointerGraceIntentRef.current) === null || _pointerGraceIntentRe === void 0 ? void 0 : _pointerGraceIntentRe.side);
         return isMovingTowards && $6cc32821e9371a1c$var$isPointerInGraceArea(event, (_pointerGraceIntentRe2 = pointerGraceIntentRef.current) === null || _pointerGraceIntentRe2 === void 0 ? void 0 : _pointerGraceIntentRe2.area);
     }, []);
-    return /*#__PURE__*/ $epM9y$createElement(PortalWrapper, null, /*#__PURE__*/ $epM9y$createElement(ScrollLockWrapper, scrollLockWrapperProps, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuContentProvider, {
+    return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuContentProvider, {
         scope: __scopeMenu,
         searchRef: searchRef,
         onItemEnter: $epM9y$useCallback((event)=>{
@@ -331,7 +358,7 @@ const $6cc32821e9371a1c$var$MenuRootContentNonModal = /*#__PURE__*/ $epM9y$forwa
         onPointerGraceIntentChange: $epM9y$useCallback((intent)=>{
             pointerGraceIntentRef.current = intent;
         }, [])
-    }, /*#__PURE__*/ $epM9y$createElement($epM9y$FocusScope, {
+    }, /*#__PURE__*/ $epM9y$createElement(ScrollLockWrapper, scrollLockWrapperProps, /*#__PURE__*/ $epM9y$createElement($epM9y$FocusScope, {
         asChild: true,
         trapped: trapFocus,
         onMountAutoFocus: $epM9y$composeEventHandlers(onOpenAutoFocus, (event)=>{
@@ -412,7 +439,7 @@ const $6cc32821e9371a1c$var$MenuRootContentNonModal = /*#__PURE__*/ $epM9y$forwa
                 lastPointerXRef.current = event.clientX;
             }
         }))
-    }))))))));
+    })))))));
 });
 /*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$479f0f2f71193efe, {
     displayName: $6cc32821e9371a1c$var$CONTENT_NAME
@@ -839,7 +866,8 @@ const $6cc32821e9371a1c$export$5fbbb3ba7297405f = /*#__PURE__*/ $epM9y$forwardRe
  * MenuSubContent
  * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$SUB_CONTENT_NAME = 'MenuSubContent';
 const $6cc32821e9371a1c$export$e7142ab31822bde6 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
-    const { forceMount: forceMount , ...subContentProps } = props;
+    const portalContext = $6cc32821e9371a1c$var$usePortalContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
+    const { forceMount: forceMount = portalContext.forceMount , ...subContentProps } = props;
     const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
     const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
     const subContext = $6cc32821e9371a1c$var$useMenuSubContext($6cc32821e9371a1c$var$SUB_CONTENT_NAME, props.__scopeMenu);
@@ -858,7 +886,6 @@ const $6cc32821e9371a1c$export$e7142ab31822bde6 = /*#__PURE__*/ $epM9y$forwardRe
         ref: composedRefs,
         align: "start",
         side: rootContext.dir === 'rtl' ? 'left' : 'right',
-        portalled: true,
         disableOutsidePointerEvents: false,
         disableOutsideScroll: false,
         trapFocus: false,
@@ -973,6 +1000,7 @@ function $6cc32821e9371a1c$var$whenMouse(handler) {
 }
 const $6cc32821e9371a1c$export$be92b6f5f03c0fe9 = $6cc32821e9371a1c$export$d9b273488cd8ce6f;
 const $6cc32821e9371a1c$export$b688253958b8dfe7 = $6cc32821e9371a1c$export$9fa5ebd18bee4d43;
+const $6cc32821e9371a1c$export$602eac185826482c = $6cc32821e9371a1c$export$793392f970497feb;
 const $6cc32821e9371a1c$export$7c6e2c02157bb7d2 = $6cc32821e9371a1c$export$479f0f2f71193efe;
 const $6cc32821e9371a1c$export$eb2fcfdbd7ba97d4 = $6cc32821e9371a1c$export$22a631d1f72787bb;
 const $6cc32821e9371a1c$export$b04be29aa201d4f5 = $6cc32821e9371a1c$export$dd37bec0e8a99143;
@@ -990,5 +1018,5 @@ const $6cc32821e9371a1c$export$6d4de93b380beddf = $6cc32821e9371a1c$export$e7142
 
 
 
-export {$6cc32821e9371a1c$export$4027731b685e72eb as createMenuScope, $6cc32821e9371a1c$export$d9b273488cd8ce6f as Menu, $6cc32821e9371a1c$export$9fa5ebd18bee4d43 as MenuAnchor, $6cc32821e9371a1c$export$479f0f2f71193efe as MenuContent, $6cc32821e9371a1c$export$22a631d1f72787bb as MenuGroup, $6cc32821e9371a1c$export$dd37bec0e8a99143 as MenuLabel, $6cc32821e9371a1c$export$2ce376c2cc3355c8 as MenuItem, $6cc32821e9371a1c$export$f6f243521332502d as MenuCheckboxItem, $6cc32821e9371a1c$export$ea2200c9eee416b3 as MenuRadioGroup, $6cc32821e9371a1c$export$69bd225e9817f6d0 as MenuRadioItem, $6cc32821e9371a1c$export$a2593e23056970a3 as MenuItemIndicator, $6cc32821e9371a1c$export$1cec7dcdd713e220 as MenuSeparator, $6cc32821e9371a1c$export$bcdda4773debf5fa as MenuArrow, $6cc32821e9371a1c$export$71bdb9d1e2909932 as MenuSub, $6cc32821e9371a1c$export$5fbbb3ba7297405f as MenuSubTrigger, $6cc32821e9371a1c$export$e7142ab31822bde6 as MenuSubContent, $6cc32821e9371a1c$export$be92b6f5f03c0fe9 as Root, $6cc32821e9371a1c$export$b688253958b8dfe7 as Anchor, $6cc32821e9371a1c$export$7c6e2c02157bb7d2 as Content, $6cc32821e9371a1c$export$eb2fcfdbd7ba97d4 as Group, $6cc32821e9371a1c$export$b04be29aa201d4f5 as Label, $6cc32821e9371a1c$export$6d08773d2e66f8f2 as Item, $6cc32821e9371a1c$export$16ce288f89fa631c as CheckboxItem, $6cc32821e9371a1c$export$a98f0dcb43a68a25 as RadioGroup, $6cc32821e9371a1c$export$371ab307eab489c0 as RadioItem, $6cc32821e9371a1c$export$c3468e2714d175fa as ItemIndicator, $6cc32821e9371a1c$export$1ff3c3f08ae963c0 as Separator, $6cc32821e9371a1c$export$21b07c8f274aebd5 as Arrow, $6cc32821e9371a1c$export$d7a01e11500dfb6f as Sub, $6cc32821e9371a1c$export$2ea8a7a591ac5eac as SubTrigger, $6cc32821e9371a1c$export$6d4de93b380beddf as SubContent};
+export {$6cc32821e9371a1c$export$4027731b685e72eb as createMenuScope, $6cc32821e9371a1c$export$d9b273488cd8ce6f as Menu, $6cc32821e9371a1c$export$9fa5ebd18bee4d43 as MenuAnchor, $6cc32821e9371a1c$export$793392f970497feb as MenuPortal, $6cc32821e9371a1c$export$479f0f2f71193efe as MenuContent, $6cc32821e9371a1c$export$22a631d1f72787bb as MenuGroup, $6cc32821e9371a1c$export$dd37bec0e8a99143 as MenuLabel, $6cc32821e9371a1c$export$2ce376c2cc3355c8 as MenuItem, $6cc32821e9371a1c$export$f6f243521332502d as MenuCheckboxItem, $6cc32821e9371a1c$export$ea2200c9eee416b3 as MenuRadioGroup, $6cc32821e9371a1c$export$69bd225e9817f6d0 as MenuRadioItem, $6cc32821e9371a1c$export$a2593e23056970a3 as MenuItemIndicator, $6cc32821e9371a1c$export$1cec7dcdd713e220 as MenuSeparator, $6cc32821e9371a1c$export$bcdda4773debf5fa as MenuArrow, $6cc32821e9371a1c$export$71bdb9d1e2909932 as MenuSub, $6cc32821e9371a1c$export$5fbbb3ba7297405f as MenuSubTrigger, $6cc32821e9371a1c$export$e7142ab31822bde6 as MenuSubContent, $6cc32821e9371a1c$export$be92b6f5f03c0fe9 as Root, $6cc32821e9371a1c$export$b688253958b8dfe7 as Anchor, $6cc32821e9371a1c$export$602eac185826482c as Portal, $6cc32821e9371a1c$export$7c6e2c02157bb7d2 as Content, $6cc32821e9371a1c$export$eb2fcfdbd7ba97d4 as Group, $6cc32821e9371a1c$export$b04be29aa201d4f5 as Label, $6cc32821e9371a1c$export$6d08773d2e66f8f2 as Item, $6cc32821e9371a1c$export$16ce288f89fa631c as CheckboxItem, $6cc32821e9371a1c$export$a98f0dcb43a68a25 as RadioGroup, $6cc32821e9371a1c$export$371ab307eab489c0 as RadioItem, $6cc32821e9371a1c$export$c3468e2714d175fa as ItemIndicator, $6cc32821e9371a1c$export$1ff3c3f08ae963c0 as Separator, $6cc32821e9371a1c$export$21b07c8f274aebd5 as Arrow, $6cc32821e9371a1c$export$d7a01e11500dfb6f as Sub, $6cc32821e9371a1c$export$2ea8a7a591ac5eac as SubTrigger, $6cc32821e9371a1c$export$6d4de93b380beddf as SubContent};
 //# sourceMappingURL=index.module.js.map