@seed-design/react-drawer 1.0.5 → 1.0.7

package/lib/{Drawer-12s-9vODHlci.js → Drawer-12s-1gup1cyj.js}

@@ -1033,10 +1033,10 @@ const DrawerContent = /*#__PURE__*/ forwardRef((props, ref)=>{
             }
         },
         onFocusOutside: (e)=>{
-            if (!modal) {
-                e.preventDefault();
-                return;
-            }
+            props.onFocusOutside?.(e);
+            // Always prevent focusOutside to avoid conflicts when focus moves between modals
+            // (e.g., when Dialog closes and restores focus while BottomSheet is opening)
+            e.preventDefault();
         },
         onPointerMove: (event)=>{
             lastKnownPointerEventRef.current = event;
@@ -1073,7 +1073,8 @@ const DrawerContent = /*#__PURE__*/ forwardRef((props, ref)=>{
             }
         },
         onInteractOutside: (e)=>{
-            if (dismissible && closeOnInteractOutside) {
+            // Only close if event is not prevented (e.g., by onFocusOutside or onPointerDownOutside)
+            if (dismissible && closeOnInteractOutside && !e.defaultPrevented) {
                 closeDrawer();
             }
             props.onInteractOutside?.(e);

package/lib/{Drawer-12s-CTzxFYGf.cjs → Drawer-12s-L4KZ1h_g.cjs}

@@ -1056,10 +1056,10 @@ const DrawerContent = /*#__PURE__*/ React.forwardRef((props, ref)=>{
             }
         },
         onFocusOutside: (e)=>{
-            if (!modal) {
-                e.preventDefault();
-                return;
-            }
+            props.onFocusOutside?.(e);
+            // Always prevent focusOutside to avoid conflicts when focus moves between modals
+            // (e.g., when Dialog closes and restores focus while BottomSheet is opening)
+            e.preventDefault();
         },
         onPointerMove: (event)=>{
             lastKnownPointerEventRef.current = event;
@@ -1096,7 +1096,8 @@ const DrawerContent = /*#__PURE__*/ React.forwardRef((props, ref)=>{
             }
         },
         onInteractOutside: (e)=>{
-            if (dismissible && closeOnInteractOutside) {
+            // Only close if event is not prevented (e.g., by onFocusOutside or onPointerDownOutside)
+            if (dismissible && closeOnInteractOutside && !e.defaultPrevented) {
                 closeDrawer();
             }
             props.onInteractOutside?.(e);

package/lib/index.cjs

@@ -1,4 +1,4 @@
-var Drawer12s = require('./Drawer-12s-CTzxFYGf.cjs');
+var Drawer12s = require('./Drawer-12s-L4KZ1h_g.cjs');
 
 var Drawer_namespace = {
   __proto__: null,

package/lib/index.js

@@ -1,5 +1,5 @@
-import { D as DrawerBackdrop, a as DrawerCloseButton, b as DrawerContent, c as DrawerDescription, d as DrawerHandle, e as DrawerPositioner, f as DrawerRoot, g as DrawerTitle, h as DrawerTrigger } from './Drawer-12s-9vODHlci.js';
-export { u as useDrawer, i as useDrawerContext } from './Drawer-12s-9vODHlci.js';
+import { D as DrawerBackdrop, a as DrawerCloseButton, b as DrawerContent, c as DrawerDescription, d as DrawerHandle, e as DrawerPositioner, f as DrawerRoot, g as DrawerTitle, h as DrawerTrigger } from './Drawer-12s-1gup1cyj.js';
+export { u as useDrawer, i as useDrawerContext } from './Drawer-12s-1gup1cyj.js';
 
 var Drawer_namespace = {
   __proto__: null,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seed-design/react-drawer",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/daangn/seed-design.git",

package/src/Drawer.tsx

@@ -64,15 +64,8 @@ export interface DrawerBackdropProps
     React.HTMLAttributes<HTMLDivElement> {}
 
 export const DrawerBackdrop = forwardRef<HTMLDivElement, DrawerBackdropProps>((props, ref) => {
-  const {
-    overlayRef,
-    onRelease,
-    modal,
-    snapPoints,
-    isOpen,
-    shouldFade,
-    shouldOverlayAnimate,
-  } = useDrawerContext();
+  const { overlayRef, onRelease, modal, snapPoints, isOpen, shouldFade, shouldOverlayAnimate } =
+    useDrawerContext();
   const composedRef = useComposedRefs(ref, overlayRef);
   const hasSnapPoints = snapPoints && snapPoints.length > 0;
   const onMouseUp = useCallbackRef((event: React.PointerEvent<HTMLDivElement>) => onRelease(event));
@@ -216,10 +209,10 @@ export const DrawerContent = forwardRef<HTMLDivElement, DrawerContentProps>((pro
         }
       }}
       onFocusOutside={(e) => {
-        if (!modal) {
-          e.preventDefault();
-          return;
-        }
+        props.onFocusOutside?.(e);
+        // Always prevent focusOutside to avoid conflicts when focus moves between modals
+        // (e.g., when Dialog closes and restores focus while BottomSheet is opening)
+        e.preventDefault();
       }}
       onPointerMove={(event) => {
         lastKnownPointerEventRef.current = event;
@@ -258,7 +251,8 @@ export const DrawerContent = forwardRef<HTMLDivElement, DrawerContentProps>((pro
         }
       }}
       onInteractOutside={(e) => {
-        if (dismissible && closeOnInteractOutside) {
+        // Only close if event is not prevented (e.g., by onFocusOutside or onPointerDownOutside)
+        if (dismissible && closeOnInteractOutside && !e.defaultPrevented) {
           closeDrawer();
         }
         props.onInteractOutside?.(e);

package/src/useDrawer.ts

@@ -116,7 +116,6 @@ export interface UseDrawerProps {
    * @default true
    */
   closeOnEscape?: boolean;
-
 }
 
 export function useDrawer(props: UseDrawerProps) {
@@ -543,7 +542,6 @@ export function useDrawer(props: UseDrawerProps) {
     };
   }, [isOpen]);
 
-
   useEffect(() => {
     function onVisualViewportChange() {
       if (!drawerRef.current || !repositionInputs) return;