reapply layout effect fix for timeline cleanup

This commit is contained in:
2026-03-31 14:16:26 +02:00
parent 009d2b8d60
commit e481fa66cd

View File

@@ -3,7 +3,7 @@ import { useGSAP } from '@gsap/react'
import gsap from 'gsap' import gsap from 'gsap'
import { SplitText } from 'gsap/SplitText' import { SplitText } from 'gsap/SplitText'
import { ScrollTrigger, GSDevTools } from 'gsap/all' import { ScrollTrigger, GSDevTools } from 'gsap/all'
import { createContext, useCallback, useContext, useEffect, useRef, type ReactNode } from 'react' import { createContext, useCallback, useContext, useEffect, useLayoutEffect, useRef, type ReactNode } from 'react'
gsap.registerPlugin(useGSAP) gsap.registerPlugin(useGSAP)
gsap.registerPlugin(ScrollTrigger) gsap.registerPlugin(ScrollTrigger)
@@ -38,7 +38,7 @@ export const useTimeLine = (dep:any,all?:boolean) => {
} }
} }
},[dep]) },[dep])
useEffect(() => { useLayoutEffect(() => {
return () => { return () => {
gsapContext?.resetTimeline() gsapContext?.resetTimeline()
} }
@@ -72,10 +72,7 @@ export default function GsapProvider({ children }: { children: ReactNode }) {
}, []) }, [])
useGSAP(() => { useGSAP(() => {
if (!tl.current) { if (!tl.current) {
tl.current = gsap.timeline({ paused: true, id:'mainTimeline', onComplete: ()=>{ tl.current = gsap.timeline({ paused: true })
console.log('timeline revert')
gsap.getById('mainTimeline')?.revert()
} })
} }
return () => { console.log("gsap cleanup") } return () => { console.log("gsap cleanup") }
}) })