{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "ambulance",
  "type": "registry:ui",
  "registryDependencies": [],
  "dependencies": ["motion"],
  "devDependencies": [],
  "files": [
    {
      "path": "ambulance.tsx",
      "content": "\"use client\";\n\nimport type { Variants } from \"motion/react\";\nimport { motion, useAnimation } from \"motion/react\";\nimport type { HTMLAttributes } from \"react\";\nimport { forwardRef, useCallback, useImperativeHandle, useRef } from \"react\";\n\nexport interface AmbulanceIconHandle {\n  startAnimation: () => void;\n  stopAnimation: () => void;\n}\n\ninterface AmbulanceIconProps extends HTMLAttributes<HTMLDivElement> {\n  size?: number;\n}\n\nconst BODY_VARIANTS: Variants = {\n  normal: { x: 0, y: 0 },\n  animate: {\n    y: [0, -1, 0, -0.5, 0],\n    transition: {\n      duration: 0.4,\n      ease: \"easeInOut\",\n      repeat: Number.POSITIVE_INFINITY,\n      repeatType: \"loop\",\n    },\n  },\n};\n\nconst WHEEL_VARIANTS: Variants = {\n  normal: { rotate: 0 },\n  animate: {\n    rotate: 360,\n    transition: {\n      duration: 0.5,\n      ease: \"linear\",\n      repeat: Number.POSITIVE_INFINITY,\n    },\n  },\n};\n\nconst SPEED_LINE_VARIANTS: Variants = {\n  normal: {\n    opacity: 0,\n    x: 0,\n    scaleX: 0,\n  },\n  animate: (custom: number) => ({\n    opacity: [0, 0.7, 0.5, 0],\n    x: [0, -4, -10, -16],\n    scaleX: [0.2, 1, 0.8, 0.3],\n    transition: {\n      duration: 0.5,\n      ease: \"easeOut\",\n      repeat: Number.POSITIVE_INFINITY,\n      delay: custom * 0.08,\n      times: [0, 0.2, 0.6, 1],\n    },\n  }),\n};\n\nconst CROSS_VARIANTS: Variants = {\n  normal: { opacity: 1 },\n  animate: {\n    opacity: [1, 0.3, 1],\n    transition: {\n      duration: 0.6,\n      ease: \"easeInOut\",\n      repeat: Number.POSITIVE_INFINITY,\n    },\n  },\n};\n\nconst AmbulanceIcon = forwardRef<AmbulanceIconHandle, AmbulanceIconProps>(\n  ({ onMouseEnter, onMouseLeave, className, size = 28, ...props }, ref) => {\n    const controls = useAnimation();\n    const isControlledRef = useRef(false);\n\n    useImperativeHandle(ref, () => {\n      isControlledRef.current = true;\n\n      return {\n        startAnimation: () => controls.start(\"animate\"),\n        stopAnimation: () => controls.start(\"normal\"),\n      };\n    });\n\n    const handleMouseEnter = useCallback(\n      (e: React.MouseEvent<HTMLDivElement>) => {\n        if (!isControlledRef.current) {\n          controls.start(\"animate\");\n        }\n        onMouseEnter?.(e);\n      },\n      [controls, onMouseEnter]\n    );\n\n    const handleMouseLeave = useCallback(\n      (e: React.MouseEvent<HTMLDivElement>) => {\n        if (!isControlledRef.current) {\n          controls.start(\"normal\");\n        }\n        onMouseLeave?.(e);\n      },\n      [controls, onMouseLeave]\n    );\n\n    return (\n      <div\n        className={className}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        {...props}\n      >\n        <svg\n          className=\"overflow-visible\"\n          fill=\"none\"\n          height={size}\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"2\"\n          viewBox=\"0 0 24 24\"\n          width={size}\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          {[\n            { y: 8, width: 5, x: 0 },\n            { y: 11, width: 7, x: -1 },\n            { y: 14, width: 4, x: 0 },\n          ].map((line, i) => (\n            <motion.line\n              animate={controls}\n              custom={i}\n              initial=\"normal\"\n              key={`speed-${i}`}\n              strokeLinecap=\"round\"\n              strokeWidth=\"2\"\n              variants={SPEED_LINE_VARIANTS}\n              x1={line.x}\n              x2={line.x + line.width}\n              y1={line.y}\n              y2={line.y}\n            />\n          ))}\n\n          <motion.g\n            animate={controls}\n            initial=\"normal\"\n            variants={BODY_VARIANTS}\n          >\n            <path d=\"M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2\" />\n            <path d=\"M19 18h2a1 1 0 0 0 1-1v-3.28a1 1 0 0 0-.684-.948l-1.923-.641a1 1 0 0 1-.578-.502l-1.539-3.076A1 1 0 0 0 16.382 8H14\" />\n            <path d=\"M9 18h6\" />\n\n            <motion.g\n              animate={controls}\n              initial=\"normal\"\n              variants={CROSS_VARIANTS}\n            >\n              <path d=\"M10 10H6\" />\n              <path d=\"M8 8v4\" />\n            </motion.g>\n          </motion.g>\n\n          <motion.g\n            animate={controls}\n            initial=\"normal\"\n            variants={BODY_VARIANTS}\n          >\n            <motion.circle\n              animate={controls}\n              cx=\"7\"\n              cy=\"18\"\n              initial=\"normal\"\n              r=\"2\"\n              style={{ transformOrigin: \"7px 18px\" }}\n              variants={WHEEL_VARIANTS}\n            />\n          </motion.g>\n\n          <motion.g\n            animate={controls}\n            initial=\"normal\"\n            variants={BODY_VARIANTS}\n          >\n            <motion.circle\n              animate={controls}\n              cx=\"17\"\n              cy=\"18\"\n              initial=\"normal\"\n              r=\"2\"\n              style={{ transformOrigin: \"17px 18px\" }}\n              variants={WHEEL_VARIANTS}\n            />\n          </motion.g>\n        </svg>\n      </div>\n    );\n  }\n);\n\nAmbulanceIcon.displayName = \"AmbulanceIcon\";\n\nexport { AmbulanceIcon };\n",
      "type": "registry:ui"
    }
  ]
}
