{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "steps-motion",
  "type": "registry:block",
  "title": "Steps (motion)",
  "description": "The steps, appearing in order. Here the order of the animation matches the meaning.",
  "categories": [
    "motion"
  ],
  "registryDependencies": [
    "https://facadeui.dev/r/motion-primitives.json",
    "https://facadeui.dev/r/steps.json"
  ],
  "files": [
    {
      "path": "src/sections/steps-motion.tsx",
      "type": "registry:component",
      "target": "components/sections/steps-motion.tsx",
      "content": "\"use client\"\n\n/**\n * StepsMotion — the numbered sequence with a staggered entrance.\n *\n * Steps arrive in order, which is the one place a stagger carries meaning rather than decoration.\n *\n * A genuine wrapper: it renders the static `Steps` and only swaps the list\n * slots, so no markup, styling or accessibility behaviour is duplicated.\n *\n * The list slot renders an `ol` rather than a `ul`, because the sequence is the\n * content — which is also why the stagger belongs here at all. The item slot\n * still renders an `li`: an `ol` may only contain list items, and a `div` there\n * is invalid markup that axe reports as `list`.\n *\n * Dependencies: react, @/components/motion/slots, @/components/motion/stagger,\n * @/components/sections/steps.\n */\n\nimport type { ReactNode } from \"react\"\n\nimport { StaggerListItem } from \"@/components/motion/slots\"\nimport { Stagger } from \"@/components/motion/stagger\"\nimport { Steps, type StepsProps } from \"@/components/sections/steps\"\n\nfunction StaggerOl({\n  className,\n  children,\n}: {\n  className?: string\n  children?: ReactNode\n}) {\n  return (\n    <Stagger as=\"ol\" className={className}>\n      {children}\n    </Stagger>\n  )\n}\n\nexport type StepsMotionProps = Omit<StepsProps, \"listAs\" | \"itemAs\">\n\nexport function StepsMotion(props: StepsMotionProps) {\n  return <Steps {...props} listAs={StaggerOl} itemAs={StaggerListItem} />\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/steps-motion"
}
