{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "primitive-shake-wiggle",
  "type": "registry:ui",
  "title": "Shake / Wiggle",
  "description": "Use one brief horizontal shake for errors or inputs that need attention.",
  "dependencies": [
    "motion"
  ],
  "categories": [
    "primitive",
    "feedback"
  ],
  "docs": "https://motion-lexicon.pages.dev/en/primitives/shake-wiggle/",
  "files": [
    {
      "path": "src/registry/primitives/shake-wiggle.tsx",
      "type": "registry:ui",
      "target": "components/motion-lexicon/primitives/shake-wiggle.tsx",
      "content": "\"use client\";\n\nimport { motion, useReducedMotion } from \"motion/react\";\nimport type { ReactNode } from \"react\";\n\nexport type ShakeWigglePrimitiveProps = {\n  trigger: string | number;\n  children: ReactNode;\n  distance?: number;\n  cycles?: number;\n  duration?: number;\n  className?: string;\n};\n\nexport function ShakeWigglePrimitive({\n  trigger,\n  children,\n  distance = 10,\n  cycles = 3,\n  duration = 0.24,\n  className,\n}: ShakeWigglePrimitiveProps) {\n  const reduceMotion = useReducedMotion();\n  const count = Math.max(1, Math.round(cycles));\n  const frames = [0];\n  for (let index = 0; index < count; index += 1) frames.push(-distance, distance);\n  frames.push(0);\n\n  return (\n    <motion.div\n      className={className}\n      key={trigger}\n      animate={reduceMotion\n        ? { opacity: [1, 0.6, 1] }\n        : { transform: frames.map((value) => `translate3d(${value}px, 0, 0)`) }}\n      transition={{ duration: reduceMotion ? 0.14 : duration, ease: [0.36, 0.07, 0.19, 0.97] }}\n    >\n      {children}\n    </motion.div>\n  );\n}\n"
    }
  ]
}