ChatLoadingDots

사용

import { ChatLoadingDots } from "@fluxloop-ai/pds-ui/components/chat-loading-dots";

<ChatLoadingDots />

단일 점(8px)이 scale 0.85↔1 + opacity 0.5↔1 로 호흡한다. 내부적으로 .pds-animate-dot-pulse 유틸을 사용하고 prefers-reduced-motion 시 자동으로 축약된다.

두 가지 컨텍스트에서 동일한 컴포넌트로 사용한다:

• block placeholder — 응답 시작 전 빈 어시스턴트 말풍선의 자리표시
• inline trailing — 스트리밍 중 텍스트 뒤에 따라붙어 추가 토큰 대기 표시

아래 데모는 질문 → 응답 대기 → 타이핑 → 완료 의 한 사이클을 반복 재생한다.

Props