@@ -36,35 +36,43 @@ export default function useWinClick(
36
36
// Click to hide is special action since click popup element should not hide
37
37
React . useEffect ( ( ) => {
38
38
if ( clickToHide && popupEle && ( ! mask || maskClosable ) ) {
39
- let clickInside = false ;
39
+ const genClickEvents = ( ) => {
40
+ let clickInside = false ;
40
41
41
- // User may mouseDown inside and drag out of popup and mouse up
42
- // Record here to prevent close
43
- const onWindowMouseDown = ( { target } : MouseEvent ) => {
44
- clickInside = inPopupOrChild ( target ) ;
45
- } ;
42
+ // User may mouseDown inside and drag out of popup and mouse up
43
+ // Record here to prevent close
44
+ const onWindowMouseDown = ( { target } : MouseEvent ) => {
45
+ clickInside = inPopupOrChild ( target ) ;
46
+ } ;
46
47
47
- const onWindowClick = ( { target } : MouseEvent ) => {
48
- if (
49
- ! lockRef . current &&
50
- openRef . current &&
51
- ! clickInside &&
52
- ! inPopupOrChild ( target )
53
- ) {
54
- triggerOpen ( false ) ;
55
- }
48
+ const onWindowClick = ( { target } : MouseEvent ) => {
49
+ if (
50
+ ! lockRef . current &&
51
+ openRef . current &&
52
+ ! clickInside &&
53
+ ! inPopupOrChild ( target )
54
+ ) {
55
+ triggerOpen ( false ) ;
56
+ }
57
+ } ;
58
+
59
+ return [ onWindowMouseDown , onWindowClick ] ;
56
60
} ;
57
61
62
+ // Events
63
+ const [ onWinMouseDown , onWinClick ] = genClickEvents ( ) ;
64
+ const [ onShadowMouseDown , onShadowClick ] = genClickEvents ( ) ;
65
+
58
66
const win = getWin ( popupEle ) ;
59
67
60
- win . addEventListener ( 'mousedown' , onWindowMouseDown ) ;
61
- win . addEventListener ( 'click' , onWindowClick ) ;
68
+ win . addEventListener ( 'mousedown' , onWinMouseDown ) ;
69
+ win . addEventListener ( 'click' , onWinClick ) ;
62
70
63
71
// shadow root
64
72
const targetShadowRoot = getShadowRoot ( targetEle ) ;
65
73
if ( targetShadowRoot ) {
66
- targetShadowRoot . addEventListener ( 'mousedown' , onWindowMouseDown ) ;
67
- targetShadowRoot . addEventListener ( 'click' , onWindowClick ) ;
74
+ targetShadowRoot . addEventListener ( 'mousedown' , onShadowMouseDown ) ;
75
+ targetShadowRoot . addEventListener ( 'click' , onShadowClick ) ;
68
76
}
69
77
70
78
// Warning if target and popup not in same root
@@ -79,12 +87,12 @@ export default function useWinClick(
79
87
}
80
88
81
89
return ( ) => {
82
- win . removeEventListener ( 'mousedown' , onWindowMouseDown ) ;
83
- win . removeEventListener ( 'click' , onWindowClick ) ;
90
+ win . removeEventListener ( 'mousedown' , onWinMouseDown ) ;
91
+ win . removeEventListener ( 'click' , onWinClick ) ;
84
92
85
93
if ( targetShadowRoot ) {
86
- targetShadowRoot . removeEventListener ( 'mousedown' , onWindowMouseDown ) ;
87
- targetShadowRoot . removeEventListener ( 'click' , onWindowClick ) ;
94
+ targetShadowRoot . removeEventListener ( 'mousedown' , onShadowMouseDown ) ;
95
+ targetShadowRoot . removeEventListener ( 'click' , onShadowClick ) ;
88
96
}
89
97
} ;
90
98
}
0 commit comments