import { useEffect, useRef } from 'react';

interface StreamingTextProps {
  content: string;
}

export const StreamingText = ({ content }: StreamingTextProps) => {
  const containerRef = useRef<HTMLDivElement>(null);

  useEffect(() => {
    if (containerRef.current) {
      // Direct DOM mutation bypasses VDOM diffing for smooth 50+ tok/s rendering
      containerRef.current.innerText = content;
    }
  }, [content]);

  return (
    <div
      ref={containerRef}
      style={{ whiteSpace: 'pre-wrap', fontFamily: 'sans-serif', lineHeight: '1.6' }}
    />
  );
};