Listy

Pass items, a rowKey that names a stable field like id, and an itemRender that returns the content of each row.

Return any layout from itemRender, like an avatar, a name over a team and a role tag, and the list adds the padding and separators.

Return a link from itemRender and set classNames.item to p-0 so the whole row, padding included, is the click target.

Set virtual and a height to mount only the rows on screen, so a list of 5,000 scrolls as smoothly as a short one.

Pass group a key to collect rows under headers without sorting them first, and a title that receives each group's rows for a count.

Set sticky and a height on a grouped list to pin each header to the top until the next group pushes it out.

Call scrollTo on the list's ref with an index or a row key, and set align to bring that row to the top or the bottom.

Sort rows with dnd-kit: the dragged row lifts, the others slide aside to show where it lands, and Space with the arrow keys sorts from the keyboard.

Read the scroll position in onScroll to load the next page near the bottom, with a button for anyone who does not scroll.

An inbox with unread dots, attachment icons and category tags, and star and archive buttons that appear on hover or focus.

A team activity feed grouped by day under sticky headers, where each event says who did what and tags what it touched.

A file list with checkboxes and bulk actions, where classNames and styles as functions highlight the list while any row is selected.