{"repo":"askides/react-plock","free":true,"listed":false,"github":"https://github.com/askides/react-plock","clone":"git clone https://github.com/askides/react-plock.git","description":"The 1kB Masonry Grid for React.","language":"TypeScript","stars":598,"topics":["react","masonry","masonry-layout","nextjs"],"license":"MIT","category":"saas-starters-boilerplates","readme_excerpt":"React Plock is a tree-shakeable ultra small npm package ( less than 1kB gzipped ) that allows you to create amazing masonry layouts with an amazing developer experience. With React Plock, you can easily create responsive and customizable layouts that adapt to different screen sizes and devices. Features - Masonry Layout : Create beautiful masonry layouts with ease. - Balanced Layout : Create a more visually harmonious masonry grid by considering the height of each item. - Responsive : Automatically adapts to different screen sizes and devices. - Customizable : Customize the layout to match your needs. - TypeScript Ready : Get the strength of type-safe languages. - Amazing DX : Easy to use and well-documented. Examples - Using Next.js 14 (Server Components) See Working Demo - Using ViteJS See Working Demo Installation Usage Using Plock with the new v3 APIs it's a piece of cake. Here's an example of how can you create a masonry grid. You can even see a demo of this example by clicking here. Balanced Layout React Plock offers a balanced layout option that creates a more visually harmonious masonry grid by considering the height of each item. When enabled with useBalancedLayout: true , the layout algorithm distributes items across columns while attempting to minimize height differences between columns. This is particularly useful for content with varying heights, such as images or cards, where a traditional masonry layout might create uneven columns. Unlike the default layout whi","default_branch":null,"files":null,"tree":[],"storefront":"/r/askides","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/askides/react-plock/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}