gsap-react

GSAP integration with React including useGSAP hook, ref handling, cleanup patterns, and context management. Use when implementing GSAP animations in React components, handling component lifecycle, or building reusable animation hooks.

By bbeierle12 · 720 installs

npx skills add bbeierle12/skill-mcp-claude --skill gsap-react

Source repository · Upstream listing

GSAP React Integration React specific patterns for GSAP animations. Quick Start useGSAP Hook Basic Usage With Dependencies Returning Context Ref Patterns Single Element Ref Multiple Element Refs Dynamic Refs Context and Cleanup Automatic Cleanup Manual Context (Without useGSAP) Scoped Context Event Handlers contextSafe for Events useCallback Alternative Timeline Management Timeline Ref Pattern Controlled Timeline ScrollTrigger in React Basic ScrollTrigger ScrollTrigger Cleanup Custom Hooks useAnimation Hook useFadeIn Hook useHoverAnimation Hook Temporal Collapse Patterns Animated Countdown Digit Cosmic Pulse Effect Performance Tips Reference See gsap fundamentals for animation basics See gsap sequencing for timeline composition See gsap scrolltrigger for scroll based animations