React Virtual Masonry
Modern Masonry Layout with ease, powered by @tanstack/virtual.
npm install react-virtual-masonry
Overview
import { Masonry } from 'react-virtual-masonry';
<Masonry
data={[200, 600, 200, 400, 100, 100, 50, 200]}
renderItem={({ item, index }) => (
<div
style={{
height: item,
background: '#F47067',
color: 'white',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
}}
>
{index}
</div>
)}
/>;