{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "scroll-animation-inset-y-demo",
  "title": "Scroll Trigger X-inset Animations Demo",
  "description": "Demo showing how to implement scroll triggred animations.",
  "registryDependencies": [
    "https://systaliko-ui.vercel.app/r/scroll-animations"
  ],
  "files": [
    {
      "path": "registry/demo/scroll-animations/scroll-animation-inset-y/index.tsx",
      "content": "import {\n  ScrollAnimation,\n  ScrollInsetY,\n  ScrollTranslateY,\n} from '@/components/systaliko-ui/scroll-animations/scroll-animation';\n\nexport function ScrollAnimationInsetYDemo() {\n  return (\n    <ScrollAnimation>\n      <ScrollTranslateY className=\"h-dvh  py-8 px-6 flex justify-center items-center\">\n        <ScrollInsetY\n          className=\"overflow-hidden w-4/5 mx-auto  rounded-md flex justify-center items-center\"\n          insetRange={[80, 0]}\n        >\n          <video\n            className=\"relative z-10  max-h-full max-w-full \"\n            src=\"https://videos.pexels.com/video-files/8086711/8086711-uhd_2560_1440_25fps.mp4\"\n            autoPlay\n            muted\n            loop\n            playsInline\n          />\n        </ScrollInsetY>\n      </ScrollTranslateY>\n    </ScrollAnimation>\n  );\n}\n",
      "type": "registry:block",
      "target": "components/systaliko-ui/demo/scroll-animation-inset-y.tsx"
    }
  ],
  "type": "registry:block"
}