Mirror: React hooks for accessible, common web interactions. UI super powers without the UI.
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Add hasPriority exception to click/touch events in useDialogDismiss

+11 -12
+11 -12
src/useDialogDismiss.ts
··· 32 32 return; 33 33 } 34 34 35 - event.preventDefault(); 36 - onDismiss(); 35 + // The current dialog can be dismissed by pressing outside of it if it either has 36 + // focus or it has priority 37 + const active = document.activeElement; 38 + if (hasPriority || (active && contains(ref.current, active))) { 39 + event.preventDefault(); 40 + onDismiss(); 41 + } 37 42 } 38 43 39 - if (hasPriority) { 40 - document.addEventListener('mousedown', onClick); 41 - document.addEventListener('touchstart', onClick); 42 - } 43 - 44 + document.addEventListener('mousedown', onClick); 45 + document.addEventListener('touchstart', onClick); 44 46 document.addEventListener('keydown', onKey); 45 47 46 48 return () => { 47 - if (hasPriority) { 48 - document.removeEventListener('mousedown', onClick); 49 - document.removeEventListener('touchstart', onClick); 50 - } 51 - 49 + document.removeEventListener('mousedown', onClick); 50 + document.removeEventListener('touchstart', onClick); 52 51 document.removeEventListener('keydown', onKey); 53 52 }; 54 53 }, [ref, hasPriority, onDismiss]);