{
	"$schema": "https://ui.shadcn.com/schema/registry-item.json",
	"dependencies": ["gsap"],
	"description": "Animates text sliding in from the left with a fade on scroll into view.",
	"files": [
		{
			"content": "\"use client\";\n\nimport gsap from \"gsap\";\nimport { ScrollTrigger } from \"gsap/ScrollTrigger\";\nimport { useLayoutEffect, useRef } from \"react\";\nimport { cn } from \"@/lib/utils\";\n\ninterface SlideInTextProps {\n  children: React.ReactNode;\n  className?: string;\n  left?: string;\n  y?: string;\n  opacity?: number;\n  ease?: string;\n  scrub?: boolean | number;\n  start?: string;\n  end?: string;\n}\n\nexport function SlideInText({\n  children,\n  className,\n  left = \"-200px\",\n  y,\n  opacity = 0,\n  ease = \"power3.out\",\n  scrub = true,\n  start = \"0px bottom\",\n  end = \"bottom+=400px bottom\",\n}: SlideInTextProps) {\n  const ref = useRef<HTMLParagraphElement>(null);\n\n  useLayoutEffect(() => {\n    gsap.registerPlugin(ScrollTrigger);\n\n    const ctx = gsap.context(() => {\n      gsap.from(ref.current, {\n        ease,\n        left,\n        ...(y !== undefined && { y }),\n        opacity,\n        scrollTrigger: {\n          end,\n          scrub,\n          start,\n          trigger: ref.current,\n        },\n      });\n    });\n\n    return () => ctx.revert();\n  }, [left, y, opacity, ease, scrub, start, end]);\n\n  return (\n    <p ref={ref} className={cn(\"relative\", className)}>\n      {children}\n    </p>\n  );\n}\n",
			"path": "registry/new-york/slide-in-text/slide-in-text.tsx",
			"type": "registry:component"
		}
	],
	"name": "slide-in-text",
	"title": "Slide In Text",
	"type": "registry:component"
}
