{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "primitive-easing",
  "type": "registry:ui",
  "title": "Easing",
  "description": "Compare common easing curves and custom cubic-bezier velocity profiles.",
  "dependencies": [
    "motion"
  ],
  "categories": [
    "primitive",
    "easing"
  ],
  "docs": "https://motion-lexicon.pages.dev/en/primitives/easing/",
  "files": [
    {
      "path": "src/registry/primitives/easing.tsx",
      "type": "registry:ui",
      "target": "components/motion-lexicon/primitives/easing.tsx",
      "content": "\"use client\";\n\nimport { motion, useReducedMotion, type Transition } from \"motion/react\";\nimport type { ReactNode } from \"react\";\n\nexport type EasingName = \"ease-out\" | \"ease-in\" | \"ease-in-out\" | \"linear\" | \"custom\" | \"asymmetric\" | \"soft\" | \"snap\" | \"calm\";\n\nexport type EasingPrimitiveProps = {\n  active: boolean;\n  children: ReactNode;\n  distance?: number;\n  duration?: number;\n  easing?: EasingName;\n  className?: string;\n};\n\nconst curves: Record<EasingName, Transition[\"ease\"]> = {\n  \"ease-out\": [0.16, 1, 0.3, 1],\n  \"ease-in\": [0.55, 0, 1, 0.45],\n  \"ease-in-out\": [0.65, 0, 0.35, 1],\n  linear: \"linear\",\n  custom: [0.25, 0.9, 0.3, 1],\n  asymmetric: [0.2, 0.8, 0.2, 1],\n  soft: [0.23, 1, 0.32, 1],\n  snap: [0.16, 1, 0.3, 1],\n  calm: [0.33, 1, 0.68, 1],\n};\n\nexport function EasingPrimitive({\n  active,\n  children,\n  distance = 120,\n  duration = 0.52,\n  easing = \"ease-out\",\n  className,\n}: EasingPrimitiveProps) {\n  const reduceMotion = useReducedMotion();\n\n  return (\n    <motion.div\n      className={className}\n      initial={false}\n      animate={{ transform: reduceMotion || !active ? \"translate3d(0, 0, 0)\" : `translate3d(${distance}px, 0, 0)` }}\n      transition={reduceMotion ? { duration: 0.12 } : { duration, ease: curves[easing] }}\n    >\n      {children}\n    </motion.div>\n  );\n}\n"
    }
  ]
}