エージェントの思考
応答が機能している間、チャットコンポーザーの上に座っているエージェントの思考状態。四変種 - 対角波、軌道頭、対面星、および無限の彗星を持つドットグリッド - それぞれが没入ラベルと脱出タイマーでそのインジケータをペアリングします。
インストール
この loader コンポーネントを CLI または手動で追加できます。
ダークモード対応:この コンポーネント はBoardUIのセマンティックトークンに合わせて自動で切り替わります。 テーマスイッチの設定.
CLIがコンポーネントのソースと内部の依存ファイルをプロジェクトにコピーし、必要なnpmパッケージをインストールします。
npx boardui@latest add agent-thinking共有UIパッケージや独自のインポートエイリアスを使う場合は、 インストールパスの設定 をCLIの実行前に設定してください。コピー&ペーストの例は、標準のインポートを使います。
ドット波
斜めの波面に交差する3×3ドットグリッド - 明るいバンドは左上、フェードトレイルで右下にグライドし、ビート後に再入力します。 デフォルトのバリアント。
<AgentThinking variant="wave" />ドットスピン
明るい頭を横切って同じグリッドで、コメットテールを横切る - スピンナーグリフなしで安定した回転として読みます。
<AgentThinking variant="spin" />スターズ
5つの4点のスパークルズは、ストガーの上に入る。 デフォルトは微妙なトーンにするため、ドットグリッドよりも静かに読みます。
<AgentThinking variant="stars" />インフィニティ
コメットトレイルは、ファイントラックの上に図を貼り付ける - 開始または終了なしの連続運動、長時間のエージェントの作業のために。
<AgentThinking variant="infinity" />ラベル、トーン、タイマー
すべての variant は同じオプションを共有します。 label ステータスコピーをセットします。 showTimer elapsed秒を切り替えます。 shimmer 旅行のハイライトをトグルし、 tone per-variant のデフォルト色を上書きします。すべての動きは静的な状態に下がります prefers-reduced-motion.
{/* Status copy and elapsed timer */}<AgentThinking variant="spin" label="Searching the docs" /><AgentThinking variant="wave" showTimer={false} />
{/* Tone defaults per variant (stars is subtle); override with `tone` */}<AgentThinking variant="infinity" tone="accent" />
{/* Static label instead of the traveling shimmer */}<AgentThinking variant="wave" shimmer={false} />