Typing Indicator

import { TypingIndicator } from "@/components/ui/typing-indicator";

export default function Example() {
  return <TypingIndicator />;
}

import { forwardRef } from "react";
import { cn } from "@/lib/utils";

const TypingIndicator = forwardRef(({ className, label, ...props }, ref) => (
  <div ref={ref} className={cn("flex items-center gap-2", className)} {...props}>
    <div className="flex gap-1">
      {[0, 1, 2].map((i) => (
        <span key={i} className="h-2 w-2 animate-bounce rounded-full bg-muted-foreground/60" style={{ animationDelay: `${i * 150}ms` }} />
      ))}
    </div>
    {label && <span className="text-xs text-muted-foreground">{label}</span>}
  </div>
));
TypingIndicator.displayName = "TypingIndicator";

export { TypingIndicator };