ai-animate

Text

ThinkingText

AI thinking and processing indicator with animated dot progression cycling through phrases.

Installation

npm install @ai-animate/core

Usage

import { ThinkingText } from '@ai-animate/core'


<ThinkingText phrases={['Thinking', 'Processing', 'Almost there']} />

Props

phrasesstring[]['Thinking', 'Processing', 'Almost there', 'One moment']Array of phrases to cycle through
dotCountnumber3Number of dots to animate in sequence
dotSpeednumber400Time between dot appearances in milliseconds
phraseHoldMsnumber2000Time each phrase displays in milliseconds
fontSizestringclamp(1rem, 2vw, 1.25rem)Font size
colorstring#ffffff99Text color
fontWeightnumber500Font weight
classNamestringundefinedAdditional CSS class