- Reconcile TIER_CONFIG/TIER_COLORS into single TIER_CONFIG with both `color` (pill style) and `border` (bordered badge style) fields - Remove TemplatePalette alias indirection (TIER_LABELS_SHARED → direct import) - Extract inline spinner SVGs to shared Spinner component (3 copies → 1) - Migrate status dot colors from 6 remaining files to shared tokens: SearchDialog, StatusDot, Legend, ContextMenu, Toolbar + add statusDotClass() - Add COMM_TYPE_LABELS to design-tokens, used by CommunicationOverlay sr-only - Update reduced-motion tests: components that delegate to design-tokens pass the guard check via import detection; add design-tokens.ts own test - 507/507 tests pass, build clean Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
20 lines
434 B
TypeScript
20 lines
434 B
TypeScript
"use client";
|
|
|
|
import { STATUS_CONFIG, statusDotClass } from "@/lib/design-tokens";
|
|
|
|
export function StatusDot({
|
|
status,
|
|
size = "sm",
|
|
}: {
|
|
status: string;
|
|
size?: "sm" | "md";
|
|
}) {
|
|
const sizeClass = size === "md" ? "w-2.5 h-2.5" : "w-2 h-2";
|
|
const glowClass = STATUS_CONFIG[status]?.glow ?? "";
|
|
return (
|
|
<div
|
|
className={`${sizeClass} rounded-full shrink-0 ${statusDotClass(status)} ${glowClass}`}
|
|
/>
|
|
);
|
|
}
|