Comic Text

"use client";

import { useEffect, useState } from "react";

import { ComicText } from "@/lab/magicui/ui/comic-text";

export default function ComicTextDemo() {
  // The original pops in once; remount it every few seconds so the card keeps moving.
  const [run, setRun] = useState(0);
  useEffect(() => {
    const id = setInterval(() => setRun((r) => r + 1), 3200);
    return () => clearInterval(id);
  }, []);
  return (
    <div className="relative flex h-full w-full items-center justify-center text-center">
      <ComicText key={run} fontSize={5}>
        BOOM!
      </ComicText>
    </div>
  );
}