capsule-ai-cli/dist/ui/components/LoadingAnimation.js

The AI Model Orchestrator - Intelligent multi-model workflows with device-locked licensing

import React, { useState, useEffect } from 'react';
import { Box, Text } from 'ink';
import chalk from 'chalk';
const providerColors = {
    openai: chalk.green,
    anthropic: chalk.rgb(217, 115, 13),
    google: chalk.blue,
    xai: chalk.magenta,
    deepseek: chalk.cyan,
    moonshot: chalk.yellow,
    default: chalk.white
};
const providerMessages = {
    openai: 'Thinking',
    anthropic: 'Ruminating',
    google: 'Processing',
    xai: 'Computing',
    deepseek: 'Analyzing',
    moonshot: 'Calculating',
    default: 'Processing'
};
const starFrames = [
    '✦',
    '✧',
    '✦',
    '◆',
    '◇',
    '◆',
    '✦',
    '✧',
];
export const LoadingAnimation = ({ provider, isLoading, startTime, tokenCount }) => {
    const [elapsedSeconds, setElapsedSeconds] = useState(0);
    const [frameIndex, setFrameIndex] = useState(0);
    useEffect(() => {
        if (!isLoading) {
            setFrameIndex(0);
            return;
        }
        const animationInterval = setInterval(() => {
            setFrameIndex((prev) => (prev + 1) % starFrames.length);
        }, 120);
        return () => clearInterval(animationInterval);
    }, [isLoading]);
    useEffect(() => {
        if (!isLoading || !startTime)
            return;
        const elapsed = Math.floor((Date.now() - startTime.getTime()) / 1000);
        setElapsedSeconds(elapsed);
        const interval = setInterval(() => {
            const elapsed = Math.floor((Date.now() - startTime.getTime()) / 1000);
            setElapsedSeconds(elapsed);
        }, 1000);
        return () => clearInterval(interval);
    }, [isLoading, startTime]);
    const color = providerColors[provider] || providerColors.default;
    const message = providerMessages[provider] || providerMessages.default;
    const tokenDisplay = tokenCount ? ` · ↓ ${(tokenCount / 1000).toFixed(1)}k tokens` : '';
    return (React.createElement(Box, { marginBottom: 1, height: 1 }, isLoading ? (React.createElement(Text, null,
        React.createElement(Text, { color: "green", bold: true }, starFrames[frameIndex]),
        ' ',
        color(`${message}… (${elapsedSeconds}s${tokenDisplay} · esc to interrupt)`))) : (React.createElement(Text, null, " "))));
};
//# sourceMappingURL=LoadingAnimation.js.map