{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "hero-with-media-motion",
  "type": "registry:block",
  "title": "Hero — with media (motion)",
  "description": "The media hero, with its parts appearing one after another when the page loads.",
  "categories": [
    "motion"
  ],
  "registryDependencies": [
    "https://facadeui.dev/r/hero-with-media.json",
    "https://facadeui.dev/r/motion-primitives.json"
  ],
  "files": [
    {
      "path": "src/sections/hero-with-media-motion.tsx",
      "type": "registry:component",
      "target": "components/sections/hero-with-media-motion.tsx",
      "content": "\"use client\"\n\n/**\n * HeroWithMediaMotion — the media hero with a staggered entrance.\n *\n * A genuine wrapper: it renders the static `HeroWithMedia` and only swaps the stack\n * slots. Nothing visual and no accessibility decision is duplicated, so the two\n * variants cannot drift apart.\n *\n * The stagger plays on mount rather than on scroll — a hero is above the fold by\n * definition, and waiting for an intersection that already happened would just\n * leave it invisible for a frame.\n *\n * Dependencies: react, @/components/motion/slots,\n * @/components/sections/hero-with-media.\n */\n\nimport { StaggerBlock, StaggerStack } from \"@/components/motion/slots\"\nimport {\n  HeroWithMedia,\n  type HeroWithMediaProps,\n} from \"@/components/sections/hero-with-media\"\n\nexport type HeroWithMediaMotionProps = Omit<HeroWithMediaProps, \"stackAs\" | \"blockAs\">\n\nexport function HeroWithMediaMotion(props: HeroWithMediaMotionProps) {\n  return <HeroWithMedia {...props} stackAs={StaggerStack} blockAs={StaggerBlock} />\n}\n"
    }
  ],
  "docs": "Render FacadeMotionProvider once near the root of your app. Icons passed to a -motion section need a client boundary. Docs: https://facadeui.dev/components/hero-with-media-motion"
}