"use client"; import { useState, useRef } from "react"; interface EyeButtonProps { text?: string; onClick?: () => void; backgroundColor?: string; textColor?: string; borderColor?: string; eyeCount?: number; eyeSize?: string; pupilSize?: string; eyeSensitivity?: number; shadowOffset?: string; activeTranslate?: string; className?: string; } export const EyeButton: React.FC = ({ text = "WHO'S THIS?", onClick, backgroundColor = "#facc15", textColor = "#000000", borderColor = "#000000", eyeCount = 2, eyeSize = "1.5rem", pupilSize = "0.5rem", eyeSensitivity = 6, shadowOffset = "4px", activeTranslate = "1px", className = "", }) => { const [mouse, setMouse] = useState({ x: 0, y: 0 }); const ref = useRef(null); const handleMove = (e: React.MouseEvent) => { if (!ref.current) return; const { left, top, width, height } = ref.current.getBoundingClientRect(); // Normalize coordinates -1 to 1 const x = ((e.clientX - left) / width - 0.5) * 2; const y = ((e.clientY - top) / height - 0.5) * 2; setMouse({ x, y }); }; return (

); };

Watchful Eyes Button