@trackunit/react-drawer 2.16.2 → 2.17.6

package/index.cjs.js

@@ -470,7 +470,9 @@ const Drawer = ({ isOpen, variant, trapFocus, position, floatingUi, children, "d
             ...getDrawerMotionStyle({ mode: drawerState.mode, position }),
         }, children: jsxRuntime.jsx("div", { className: cvaDrawerContent({ position }), children: children }) }));
     const content = (jsxRuntime.jsxs("div", { className: cvaDrawerViewport({ portaled: shouldUsePortal, className: containerClassName }), "data-testid": "drawer-viewport", children: [isModal ? jsxRuntime.jsx(Overlay, { open: isOpen ? drawerState.mode === "open" : false }) : null, showFocusManager ? (jsxRuntime.jsx(react$1.FloatingFocusManager, { context: floatingUi.context, initialFocus: -1, returnFocus: true, children: panel })) : (panel)] }));
-    return shouldUsePortal ? jsxRuntime.jsx(reactComponents.Portal, { children: content }) : content;
+    // An explicit root stops FloatingPortal from nesting inside a parent portal (e.g. a Sheet with
+    // `pointer-events: none`), so the drawer always escapes to the body.
+    return shouldUsePortal ? jsxRuntime.jsx(react$1.FloatingPortal, { root: document.body, children: content }) : content;
 };
 Drawer.displayName = "Drawer";
 

package/index.esm.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { registerTranslations, useNamespaceTranslation } from '@trackunit/i18n-library-translation';
-import { useMergeRefs, FloatingFocusManager, useFloating, useDismiss, useInteractions } from '@floating-ui/react';
-import { useViewportBreakpoints, Portal, IconButton, Icon, MoreMenu } from '@trackunit/react-components';
+import { useMergeRefs, FloatingFocusManager, FloatingPortal, useFloating, useDismiss, useInteractions } from '@floating-ui/react';
+import { useViewportBreakpoints, IconButton, Icon, MoreMenu } from '@trackunit/react-components';
 import { useRef, useState, useReducer, useEffect, useCallback, useLayoutEffect, useMemo } from 'react';
 import { cva } from '@trackunit/css-class-variance-utilities';
 import { twMerge } from 'tailwind-merge';
@@ -468,7 +468,9 @@ const Drawer = ({ isOpen, variant, trapFocus, position, floatingUi, children, "d
             ...getDrawerMotionStyle({ mode: drawerState.mode, position }),
         }, children: jsx("div", { className: cvaDrawerContent({ position }), children: children }) }));
     const content = (jsxs("div", { className: cvaDrawerViewport({ portaled: shouldUsePortal, className: containerClassName }), "data-testid": "drawer-viewport", children: [isModal ? jsx(Overlay, { open: isOpen ? drawerState.mode === "open" : false }) : null, showFocusManager ? (jsx(FloatingFocusManager, { context: floatingUi.context, initialFocus: -1, returnFocus: true, children: panel })) : (panel)] }));
-    return shouldUsePortal ? jsx(Portal, { children: content }) : content;
+    // An explicit root stops FloatingPortal from nesting inside a parent portal (e.g. a Sheet with
+    // `pointer-events: none`), so the drawer always escapes to the body.
+    return shouldUsePortal ? jsx(FloatingPortal, { root: document.body, children: content }) : content;
 };
 Drawer.displayName = "Drawer";
 

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@trackunit/react-drawer",
-  "version": "2.16.2",
+  "version": "2.17.6",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
     "node": ">=24.x"
   },
   "dependencies": {
-    "@trackunit/react-components": "5.0.1",
-    "@trackunit/css-class-variance-utilities": "2.6.10",
-    "@trackunit/i18n-library-translation": "2.13.2",
+    "@trackunit/react-components": "6.0.5",
+    "@trackunit/css-class-variance-utilities": "2.6.15",
+    "@trackunit/i18n-library-translation": "2.14.5",
     "@floating-ui/react": "^0.26.25",
     "tailwind-merge": "^3.7.0"
   },