@@ -221,7 +221,26 @@ export const ModalInternal = memo(
221
221
( ) => ( { ...zIndexStyle , ...resizeableStyle } ) ,
222
222
[ resizeableStyle , zIndexStyle ] ,
223
223
)
224
+ const isSelectingRef = useRef ( false )
225
+ const handleSelectStart = useCallback ( ( ) => {
226
+ isSelectingRef . current = true
227
+ } , [ ] )
228
+ const handleDetectSelectEnd = useCallback ( ( ) => {
229
+ nextFrame ( ( ) => {
230
+ if ( isSelectingRef . current ) {
231
+ isSelectingRef . current = false
232
+ }
233
+ } )
234
+ } , [ ] )
224
235
236
+ const handleClickOutsideToDismiss = useCallback (
237
+ ( e : SyntheticEvent ) => {
238
+ if ( isSelectingRef . current ) return
239
+ const fn = modal ? ( clickOutsideToDismiss && canClose ? dismiss : noticeModal ) : undefined
240
+ fn ?.( e )
241
+ } ,
242
+ [ canClose , clickOutsideToDismiss , dismiss , modal , noticeModal ] ,
243
+ )
225
244
useImperativeHandle ( ref , ( ) => modalElementRef . current ! )
226
245
if ( CustomModalComponent ) {
227
246
return (
@@ -276,9 +295,8 @@ export const ModalInternal = memo(
276
295
modalContainerClassName ,
277
296
! isResizeable && "center" ,
278
297
) }
279
- onClick = {
280
- modal ? ( clickOutsideToDismiss && canClose ? dismiss : noticeModal ) : undefined
281
- }
298
+ onPointerUp = { handleDetectSelectEnd }
299
+ onClick = { handleClickOutsideToDismiss }
282
300
>
283
301
{ DragBar }
284
302
@@ -299,6 +317,8 @@ export const ModalInternal = memo(
299
317
modalClassName ,
300
318
) }
301
319
onClick = { stopPropagation }
320
+ onSelect = { handleSelectStart }
321
+ onKeyUp = { handleDetectSelectEnd }
302
322
drag
303
323
dragControls = { dragController }
304
324
dragElastic = { 0 }
0 commit comments