"use client"; import { useEffect, useMemo, useState } from "react"; import { motion } from "framer-motion"; import { MoveRight, PhoneCall } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Hero } from "@/components/ui/animated-hero" function Hero() { const [titleNumber, setTitleNumber] = useState(0); const titles = useMemo( () => ["amazing", "new", "wonderful", "beautiful", "smart"], [] ); useEffect(() => { const timeoutId = setTimeout(() => { if (titleNumber === titles.length - 1) { setTitleNumber(0); } else { setTitleNumber(titleNumber + 1); } }, 2000); return () => clearTimeout(timeoutId); }, [titleNumber, titles]); return (

This is something {titles.map((title, index) => ( index ? -150 : 150, opacity: 0, } } > {title} ))}

Managing a small business today is already tough. Avoid further complications by ditching outdated, tedious trade methods. Our goal is to streamline SMB trade, making it easier and faster than ever.

); } function HeroDemo() { return (

); } export { HeroDemo };

Free Animated Rotating Words Hero React Component