{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "use-reduced-motion",
  "title": "useReducedMotion",
  "description": "A client-safe React hook for reading prefers-reduced-motion and reacting to preference changes.",
  "files": [
    {
      "path": "registry/base/hooks/use-reduced-motion.ts",
      "content": "\"use client\";\n\nimport { useSyncExternalStore } from \"react\";\n\nconst REDUCED_MOTION_QUERY = \"(prefers-reduced-motion: reduce)\";\n\nfunction subscribe(onStoreChange: () => void): () => void {\n  const mediaQuery = window.matchMedia(REDUCED_MOTION_QUERY);\n\n  mediaQuery.addEventListener(\"change\", onStoreChange);\n\n  return () => {\n    mediaQuery.removeEventListener(\"change\", onStoreChange);\n  };\n}\n\nfunction getSnapshot(): boolean {\n  return window.matchMedia(REDUCED_MOTION_QUERY).matches;\n}\n\nfunction getServerSnapshot(): boolean {\n  return false;\n}\n\nexport function useReducedMotion(): boolean {\n  return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n}\n",
      "type": "registry:hook",
      "target": "@hooks/use-reduced-motion.ts"
    }
  ],
  "meta": {
    "tags": [
      "prefers-reduced-motion",
      "media-query",
      "user-preference"
    ],
    "effects": [
      "reduced-motion"
    ]
  },
  "categories": [
    "accessibility"
  ],
  "type": "registry:hook"
}