@@ -10,19 +10,18 @@ import {
10
10
useStyles$ ,
11
11
useTask$ ,
12
12
} from '@builder.io/qwik' ;
13
+
13
14
import {
14
15
activateFocusTrap ,
15
16
closeModal ,
16
17
deactivateFocusTrap ,
17
- keepModalInPlaceWhileScrollbarReappears as keepModalInPlaceWhenScrollbarReappears ,
18
- lockScroll ,
19
18
overrideNativeDialogEscapeBehaviorWith ,
20
19
showModal ,
21
20
trapFocus ,
22
21
wasModalBackdropClicked ,
23
22
} from './modal-behavior' ;
24
23
25
- import { disableBodyScroll , type BodyScrollOptions } from 'body-scroll-lock' ;
24
+ import { disableBodyScroll } from 'body-scroll-lock' ;
26
25
27
26
import styles from './modal.css?inline' ;
28
27
@@ -38,10 +37,6 @@ export const Modal = component$((props: ModalProps) => {
38
37
useStyles$ ( styles ) ;
39
38
const modalRefSig = useSignal < HTMLDialogElement > ( ) ;
40
39
41
- const scrollOptions : BodyScrollOptions = {
42
- reserveScrollBarGap : true ,
43
- } ;
44
-
45
40
const { 'bind:show' : showSig } = props ;
46
41
47
42
useTask$ ( async function toggleModal ( { track, cleanup } ) {
@@ -60,7 +55,7 @@ export const Modal = component$((props: ModalProps) => {
60
55
61
56
if ( isOpen ) {
62
57
showModal ( modal ) ;
63
- disableBodyScroll ( modal , scrollOptions ) ;
58
+ disableBodyScroll ( modal , { reserveScrollBarGap : true } ) ;
64
59
props . onShow$ ?.( ) ;
65
60
activateFocusTrap ( focusTrap ) ;
66
61
} else {
@@ -70,7 +65,6 @@ export const Modal = component$((props: ModalProps) => {
70
65
71
66
cleanup ( ( ) => {
72
67
deactivateFocusTrap ( focusTrap ) ;
73
- keepModalInPlaceWhenScrollbarReappears ( scrollbar , modalRefSig . value ) ;
74
68
} ) ;
75
69
} ) ;
76
70
0 commit comments