"use client"; import { motion, useReducedMotion } from "motion/react"; export type SignalCardItem = { label: string; value: string; detail?: string; /** Tailwind classes for the value chip. */ tone?: string; }; const defaultCards: SignalCardItem[] = [ { label: "p95 latency", value: "184 ms", detail: "Checkout API, last 24 hours", tone: "bg-lime-200 text-lime-950" }, { label: "Error rate", value: "0.12%", detail: "Down from 0.31% last week", tone: "bg-sky-200 text-sky-950" }, { label: "Deploys today", value: "7", detail: "2 rolled back automatically", tone: "bg-amber-200 text-amber-950" }, ]; type FloatingSignalCardsProps = { cards?: SignalCardItem[]; label?: string; /** Forces reduced motion in addition to the OS preference. */ reducedMotion?: boolean; className?: string; }; export function FloatingSignalCards({ cards = defaultCards, label = "Service health", reducedMotion = false, className = "", }: FloatingSignalCardsProps) { const shouldReduceMotion = Boolean(useReducedMotion()) || reducedMotion; return (

); }