@medalsocial/meda
Version:
Shared Meda UI shell and runtime package.
23 lines (22 loc) • 1.16 kB
JavaScript
'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from '../lib/utils.js';
const PHASE_LABEL = {
idle: 'Idle',
listening: 'Listening',
thinking: 'Thinking',
speaking: 'Speaking',
error: 'Error',
};
export function VoiceStatusPill({ phase, thinkingForMs, className }) {
const TONE_MAP = {
listening: 'bg-primary text-primary-foreground',
speaking: 'bg-success text-success-foreground',
error: 'bg-destructive text-destructive-foreground',
idle: 'bg-muted text-muted-foreground',
thinking: 'bg-muted text-muted-foreground',
};
const tone = TONE_MAP[phase];
const seconds = thinkingForMs ? (thinkingForMs / 1000).toFixed(1) : null;
return (_jsxs("span", { role: "status", "data-phase": phase, className: cn('inline-flex items-center gap-1.5 rounded-full px-3 py-1 text-xs font-medium', tone, className), children: [_jsx("span", { className: cn('size-1.5 rounded-full bg-current', phase === 'thinking' && 'animate-pulse') }), PHASE_LABEL[phase], phase === 'thinking' && seconds && _jsxs("span", { children: ["\u00B7 ", seconds, "s"] })] }));
}