@@ -33,29 +33,40 @@ export function useMothershipResize() {
3333 document . body . style . cursor = 'ew-resize'
3434 document . body . style . userSelect = 'none'
3535
36- const handlePointerMove = ( moveEvent : PointerEvent ) => {
37- const newWidth = window . innerWidth - moveEvent . clientX
38- const maxWidth = window . innerWidth * MOTHERSHIP_WIDTH . MAX_PERCENTAGE
39- el . style . width = `${ Math . min ( Math . max ( newWidth , MOTHERSHIP_WIDTH . MIN ) , maxWidth ) } px`
40- }
36+ // AbortController removes all listeners at once on cleanup/cancel/unmount
37+ const ac = new AbortController ( )
38+ const { signal } = ac
4139
4240 const cleanup = ( ) => {
41+ ac . abort ( )
4342 el . style . transition = prevTransition
4443 document . body . style . cursor = ''
4544 document . body . style . userSelect = ''
46- handle . removeEventListener ( 'pointermove' , handlePointerMove )
47- handle . removeEventListener ( 'pointerup' , handlePointerUp )
4845 cleanupRef . current = null
4946 }
5047
51- const handlePointerUp = ( upEvent : PointerEvent ) => {
52- handle . releasePointerCapture ( upEvent . pointerId )
53- cleanup ( )
54- }
48+ handle . addEventListener (
49+ 'pointermove' ,
50+ ( moveEvent : PointerEvent ) => {
51+ const newWidth = window . innerWidth - moveEvent . clientX
52+ const maxWidth = window . innerWidth * MOTHERSHIP_WIDTH . MAX_PERCENTAGE
53+ el . style . width = `${ Math . min ( Math . max ( newWidth , MOTHERSHIP_WIDTH . MIN ) , maxWidth ) } px`
54+ } ,
55+ { signal }
56+ )
57+
58+ handle . addEventListener (
59+ 'pointerup' ,
60+ ( upEvent : PointerEvent ) => {
61+ handle . releasePointerCapture ( upEvent . pointerId )
62+ cleanup ( )
63+ } ,
64+ { signal }
65+ )
5566
56- cleanupRef . current = cleanup
57- handle . addEventListener ( 'pointermove' , handlePointerMove )
58- handle . addEventListener ( 'pointerup ' , handlePointerUp )
67+ // Browser fires pointercancel when it reclaims the gesture (scroll, palm rejection, etc.)
68+ // Without this, body cursor/userSelect and transition would be permanently stuck
69+ handle . addEventListener ( 'pointercancel ' , cleanup , { signal } )
5970 } , [ ] )
6071
6172 // Tear down any active drag if the component unmounts mid-drag
0 commit comments