ListView
Список-таблица на div с заголовком колонок и пагинацией — для строк сложной разметки.
Живой код — редактируйте
function Example() { const [page, setPage] = useState(1); return ( <ListView minWidthClassName="min-w-[480px]" headerRowClassName="px-4 py-2" headerCells={[ { content: 'Проект', className: 'flex-1' }, { content: 'Заявки', className: 'w-24 text-right' } ]} pagination={{ page, totalPages: 3, total: 25, start: (page - 1) * 10 + 1, end: Math.min(page * 10, 25), onPageChange: setPage }} > {['kvality.io', 'example.ru', 'shop.ru'].map((name) => ( <ListViewRow key={name} className="px-4 py-3"> <span className="flex-1 text-14-regular">{name}</span> <span className="w-24 text-right text-14-medium"> {name.length * 7} </span> </ListViewRow> ))} </ListView> ); } render(<Example />);
Пропсы
Prop
Type