{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "alarm-clock-plus-icon",
  "dependencies": ["motion"],
  "devDependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "icons/alarm-clock-plus-icon.tsx",
      "content": "import { forwardRef, useImperativeHandle, useRef } from \"react\";\nimport type {\n  AnimatedIconHandle,\n  AnimatedIconProps,\n  IconEasing,\n} from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\ntype CustomStyleProps = {\n  stiffness?: number;\n  damping?: number;\n  durationY?: number;\n  durationX?: number;\n  ease?: IconEasing;\n};\n\nconst AlarmClockPlusIcon = forwardRef<\n  AnimatedIconHandle,\n  AnimatedIconProps & CustomStyleProps\n>(\n  (\n    {\n      size = 24,\n      color = \"currentColor\",\n      strokeWidth = 2,\n      className = \"\",\n      stiffness = 200,\n      damping = 25,\n      durationY = 0.2,\n      durationX = 0.3,\n      ease = \"linear\",\n      ...props\n    },\n    ref,\n  ) => {\n    const [scope, animate] = useAnimate();\n    const animationControls = useRef<Array<ReturnType<typeof animate>>>([]);\n\n    const start = async () => {\n      animationControls.current.forEach((control) => control.stop());\n      animationControls.current = [];\n\n      animationControls.current.push(\n        animate(\n          \".clock\",\n          {\n            y: -1.5,\n            x: [-1, 1, -1, 1, -1, 0],\n          },\n          {\n            y: {\n              duration: durationY,\n              type: \"spring\",\n              stiffness: stiffness,\n              damping: damping,\n            },\n            x: { duration: durationX, repeat: Infinity, ease: ease },\n          },\n        ),\n      );\n\n      animationControls.current.push(\n        animate(\n          \".bells\",\n          {\n            y: -2.5,\n            x: [-2, 2, -2, 2, -2, 0],\n          },\n          {\n            y: {\n              duration: durationY,\n              type: \"spring\",\n              stiffness: stiffness,\n              damping: damping,\n            },\n            x: { duration: durationX, repeat: Infinity, ease: ease },\n          },\n        ),\n      );\n\n      await animate(\n        \".plus\",\n        { scale: [1, 1.2, 1] },\n        { duration: durationY, ease: \"easeOut\" },\n      );\n    };\n\n    const stop = () => {\n      animationControls.current.forEach((control) => control.stop());\n      animationControls.current = [];\n\n      animate(\".clock\", { y: 0, x: 0 }, { duration: durationY * 2 });\n      animate(\".bells\", { y: 0, x: 0 }, { duration: durationY * 2 });\n    };\n\n    useImperativeHandle(ref, () => {\n      return {\n        startAnimation: start,\n        stopAnimation: stop,\n      };\n    });\n\n    // 🖱 hover logic (only when NOT controlled)\n    const handleHoverStart = () => {\n      start();\n    };\n\n    const handleHoverEnd = () => {\n      stop();\n    };\n\n    return (\n      <motion.svg\n        ref={scope}\n        onHoverStart={handleHoverStart}\n        onHoverEnd={handleHoverEnd}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={size}\n        height={size}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={`cursor-pointer ${className}`}\n        style={{ overflow: \"visible\" }}\n        aria-hidden=\"true\"\n        {...props}\n      >\n        <motion.circle className=\"clock\" cx=\"12\" cy=\"13\" r=\"8\" />\n        <motion.path\n          className=\"bells\"\n          style={{ transformOrigin: \"3.5px 4.5px\" }}\n          d=\"M5 3 2 6\"\n        />\n        <motion.path\n          className=\"bells\"\n          style={{ transformOrigin: \"20.5px 4.5px\" }}\n          d=\"m22 6-3-3\"\n        />\n        <motion.path className=\"clock\" d=\"M6.38 18.7 4 21\" />\n        <motion.path className=\"clock\" d=\"M17.64 18.67 20 21\" />\n        <motion.g className=\"plus\" style={{ transformOrigin: \"12px 13px\" }}>\n          <path d=\"M12 10v6\" />\n          <path d=\"M9 13h6\" />\n        </motion.g>\n      </motion.svg>\n    );\n  },\n);\n\nAlarmClockPlusIcon.displayName = \"AlarmClockPlusIcon\";\n\nexport default AlarmClockPlusIcon;\n",
      "type": "registry:ui"
    },
    {
      "path": "icons/types.ts",
      "content": "import type { SVGProps } from \"react\";\n\n/** Standard stroke width for 24×24 outline icons */\nexport const DEFAULT_STROKE_WIDTH = 2;\n\n/** Scale stroke to match DEFAULT_STROKE_WIDTH on non-24 viewBoxes */\nexport function scaledStrokeWidth(\n  strokeWidth: number,\n  viewBoxSize: number,\n): number {\n  return strokeWidth * (viewBoxSize / 24);\n}\n\nexport type IconEasing =\n  | \"linear\"\n  | \"easeIn\"\n  | \"easeOut\"\n  | \"easeInOut\"\n  | \"circIn\"\n  | \"circOut\"\n  | \"circInOut\"\n  | \"backIn\"\n  | \"backOut\"\n  | \"backInOut\"\n  | \"anticipate\";\n\nexport interface AnimatedIconProps extends Omit<\n  SVGProps<SVGSVGElement>,\n  | \"ref\"\n  | \"onAnimationStart\"\n  | \"onAnimationEnd\"\n  | \"onAnimationIteration\"\n  | \"onDrag\"\n  | \"onDragEnd\"\n  | \"onDragEnter\"\n  | \"onDragExit\"\n  | \"onDragLeave\"\n  | \"onDragOver\"\n  | \"onDragStart\"\n  | \"onDrop\"\n  | \"values\"\n> {\n  /** Icon size in pixels or CSS string */\n  size?: number | string;\n  /** Icon color (defaults to currentColor) */\n  color?: string;\n  /** SVG stroke width */\n  strokeWidth?: number;\n  /** Additional CSS classes */\n  className?: string;\n}\n\nexport interface AnimatedIconHandle {\n  startAnimation: () => void;\n  stopAnimation: () => void;\n}\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}