Files
star-erp/resources/js/Components/shared/StatsCard.tsx
2025-12-30 15:03:19 +08:00

31 lines
657 B
TypeScript

/**
* 統計卡片元件
* 用於顯示各種統計資訊
*/
import { LucideIcon } from "lucide-react";
interface StatsCardProps {
label: string;
value: string | number;
icon?: LucideIcon;
valueClassName?: string;
}
export default function StatsCard({
label,
value,
icon: Icon,
valueClassName = "text-primary-main",
}: StatsCardProps) {
return (
<div className="bg-white rounded-lg shadow-sm border p-5">
<div className="flex items-center gap-2 text-grey-2 mb-1">
{Icon && <Icon className="h-4 w-4" />}
<span>{label}</span>
</div>
<div className={valueClassName}>{value}</div>
</div>
);
}