{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "facebook",
  "type": "registry:ui",
  "addGlobalCss": false,
  "registryDependencies": [],
  "dependencies": [
    "motion"
  ],
  "devDependencies": [],
  "files": [
    {
      "path": "facebook-icon.tsx",
      "content": "\"use client\";\n\nimport { cn } from \"@/lib/utils\";\nimport type { Variants } from \"motion/react\";\nimport {\n LazyMotion,\n domMin,\n m,\n useAnimation,\n useReducedMotion,\n} from \"motion/react\";\nimport {\n forwardRef,\n useCallback,\n useImperativeHandle,\n useRef,\n type HTMLAttributes,\n} from \"react\";\nexport interface FacebookIconHandle {\n startAnimation: () => void;\n stopAnimation: () => void;\n}\n\ninterface FacebookIconProps extends Omit<\n HTMLAttributes<HTMLDivElement>,\n | \"color\"\n | \"onDrag\"\n | \"onDragStart\"\n | \"onDragEnd\"\n | \"onAnimationStart\"\n | \"onAnimationEnd\"\n | \"onAnimationIteration\"\n> {\n size?: number;\n duration?: number;\n isAnimated?: boolean;\n color?: string;\n}\n\nconst FacebookIcon = forwardRef<FacebookIconHandle, FacebookIconProps>(\n (\n  {\n   onMouseEnter,\n   onMouseLeave,\n   className,\n   size = 24,\n   duration = 1,\n   isAnimated = true,\n   color,\n   ...props\n  },\n  ref,\n ) => {\n  const controls = useAnimation();\n  const reduced = useReducedMotion();\n  const isControlled = useRef(false);\n\n  useImperativeHandle(ref, () => {\n   isControlled.current = true;\n   return {\n    startAnimation: () =>\n     reduced ? controls.start(\"normal\") : controls.start(\"animate\"),\n    stopAnimation: () => controls.start(\"normal\"),\n   };\n  });\n\n  const handleEnter = useCallback(\n   (e?: React.MouseEvent<HTMLDivElement>) => {\n    if (!isAnimated || reduced) return;\n    if (!isControlled.current) controls.start(\"animate\");\n    else onMouseEnter?.(e as any);\n   },\n   [controls, reduced, isAnimated, onMouseEnter],\n  );\n\n  const handleLeave = useCallback(\n   (e?: React.MouseEvent<HTMLDivElement>) => {\n    if (!isControlled.current) controls.start(\"normal\");\n    else onMouseLeave?.(e as any);\n   },\n   [controls, onMouseLeave],\n  );\n\n  const containerVariants: Variants = {\n   normal: {\n    scale: 1,\n    y: 0,\n   },\n   animate: {\n    scale: [1, 1.035, 1],\n    y: [0, -1, 0],\n    transition: {\n     duration: 0.8 * duration,\n     ease: \"easeInOut\",\n    },\n   },\n  };\n\n  const logoVariants: Variants = {\n   normal: {\n    pathLength: 1,\n    opacity: 1,\n   },\n   animate: {\n    pathLength: [0, 1],\n    opacity: [0.4, 1],\n    transition: {\n     duration: 0.9 * duration,\n     ease: \"easeInOut\",\n     delay: 0.1,\n    },\n   },\n  };\n\n  return (\n   <LazyMotion features={domMin} strict>\n    <m.div\n     className={cn(\"inline-flex items-center justify-center\", className)}\n     onMouseEnter={handleEnter}\n     onMouseLeave={handleLeave}\n     {...props}\n     style={{ color, ...props.style }}\n    >\n     <m.svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinejoin=\"round\"\n      initial=\"normal\"\n      animate={controls}\n      variants={containerVariants}\n     >\n      <m.path\n       fillRule=\"evenodd\"\n       clipRule=\"evenodd\"\n       d=\"M6.18182 10.3333C5.20406 10.3333 5 10.5252 5 11.4444V13.1111C5 14.0304 5.20406 14.2222 6.18182 14.2222H8.54545V20.8889C8.54545 21.8081 8.74951 22 9.72727 22H12.0909C13.0687 22 13.2727 21.8081 13.2727 20.8889V14.2222H15.9267C16.6683 14.2222 16.8594 14.0867 17.0631 13.4164L17.5696 11.7497C17.9185 10.6014 17.7035 10.3333 16.4332 10.3333H13.2727V7.55556C13.2727 6.94191 13.8018 6.44444 14.4545 6.44444H17.8182C18.7959 6.44444 19 6.25259 19 5.33333V3.11111C19 2.19185 18.7959 2 17.8182 2H14.4545C11.191 2 8.54545 4.48731 8.54545 7.55556V10.3333H6.18182Z\"\n       variants={logoVariants}\n       style={{\n        transformBox: \"fill-box\",\n        transformOrigin: \"center\",\n       }}\n      />\n     </m.svg>\n    </m.div>\n   </LazyMotion>\n  );\n },\n);\n\nFacebookIcon.displayName = \"FacebookIcon\";\nexport { FacebookIcon };\n",
      "type": "registry:ui"
    }
  ]
}