TanStack Virtual headless virtualization for React. Use when rendering large lists (100+ items), implementing virtual scroll, building infinite scroll feeds, virtualizing grids or tables, using window-level scrolling, or implementing masonry/lane layouts with @tanstack/react-virtual. Triggers on: useVirtualizer, useWindowVirtualizer, virtual list, virtual scroll, list virtualization.
Quickly install tanstack-virtual AI skill to your development environment via command line
Source: fellipeutaka/leon.
scrollMargin = distance from page top to list top. Subtract it from item.start in the transform.
| overscan | 1 | Extra items rendered outside visible area | | gap | 0 | Spacing between items (px) — use instead of CSS margin | | paddingStart | 0 | Padding before first item (px) | | paddingEnd | 0 | Padding after last item (px) | | horizontal | false | Horizontal orientation | | lanes | 1 | Columns (vertical) or rows (horizontal) for masonry |
| getItemKey | index | Stable item keys — always set when items have IDs | | enabled | true | Set false to disable observers and reset state | | isRtl | false | RTL horizontal scroll |
Stable fields and commands for AI/search citations.
npx skills add https://github.com/fellipeutaka/leon --skill tanstack-virtualTanStack Virtual headless virtualization for React. Use when rendering large lists (100+ items), implementing virtual scroll, building infinite scroll feeds, virtualizing grids or tables, using window-level scrolling, or implementing masonry/lane layouts with @tanstack/react-virtual. Triggers on: useVirtualizer, useWindowVirtualizer, virtual list, virtual scroll, list virtualization. Source: fellipeutaka/leon.
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/fellipeutaka/leon --skill tanstack-virtual Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw
https://github.com/fellipeutaka/leon