plazbot
Version:
Official Plazbot SDK for creating AI agents for WhatsApp, portals, and developers.
36 lines (35 loc) • 1.53 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState, useEffect, useRef } from 'react';
import { MarkdownRenderer } from '../utils/MarkdownRenderer';
export function StreamingText({ content, speed = 15, onComplete, style }) {
const [displayed, setDisplayed] = useState('');
const indexRef = useRef(0);
const completedRef = useRef(false);
useEffect(() => {
indexRef.current = 0;
completedRef.current = false;
setDisplayed('');
const interval = setInterval(() => {
if (indexRef.current >= content.length) {
clearInterval(interval);
if (!completedRef.current) {
completedRef.current = true;
onComplete?.();
}
return;
}
indexRef.current++;
setDisplayed(content.slice(0, indexRef.current));
}, speed);
return () => clearInterval(interval);
}, [content, speed, onComplete]);
return (_jsxs("div", { style: style, children: [_jsx(MarkdownRenderer, { content: displayed }), indexRef.current < content.length && (_jsx("span", { style: {
display: 'inline-block',
width: '2px',
height: '1em',
backgroundColor: 'currentColor',
marginLeft: '1px',
animation: 'plazbot-pulse 0.8s infinite',
verticalAlign: 'text-bottom',
} }))] }));
}