uchill/front_material/components/dashboard/ui/StatsGrid.tsx

47 lines
1.0 KiB
TypeScript

/**
* Сетка карточек статистики. Переиспользуется для всех ролей.
*/
'use client';
import React from 'react';
import { StatCard } from '../StatCard';
export interface StatsGridItem {
title: string;
value: string | number;
icon?: React.ReactNode;
trend?: { value: number; isPositive: boolean };
subtitle?: string;
loading?: boolean;
}
export interface StatsGridProps {
items: StatsGridItem[];
}
export const StatsGrid: React.FC<StatsGridProps> = ({ items }) => {
return (
<div
className="dashboard-stats-grid"
style={{
display: 'grid',
gridTemplateColumns: 'repeat(4, minmax(0, 1fr))',
gap: 'var(--ios26-spacing)',
}}
>
{items.map((item, i) => (
<StatCard
key={i}
title={item.title}
value={item.value}
icon={item.icon}
trend={item.trend}
subtitle={item.subtitle}
loading={item.loading}
/>
))}
</div>
);
};