moex-vibe/apps/frontend/src/shared/ui/TableSkeleton.tsx

26 lines
635 B
TypeScript

import { SkeletonBlock } from '@/shared/ui/SkeletonBlock';
const tdStyle = {
borderBottom: '1px solid #eeeeee',
padding: '10px 8px',
verticalAlign: 'top',
} satisfies React.CSSProperties;
type Column = { width: string };
export function TableSkeleton({ rows = 5, columns }: { rows?: number; columns: Column[] }) {
return (
<tbody>
{Array.from({ length: rows }).map((_, i) => (
<tr key={i}>
{columns.map((col, j) => (
<td key={j} style={tdStyle}>
<SkeletonBlock height={12} width={col.width} />
</td>
))}
</tr>
))}
</tbody>
);
}