Virtual Scroll
Virtual Scroll example demonstrating Fragment UI components and patterns.
Example
Item 1
Description for item 1
Item 2
Description for item 2
Item 3
Description for item 3
Item 4
Description for item 4
Item 5
Description for item 5
Item 6
Description for item 6
Item 7
Description for item 7
Item 8
Description for item 8
Item 9
Description for item 9
Item 10
Description for item 10
Item 11
Description for item 11
Item 12
Description for item 12
Item 13
Description for item 13
Item 14
Description for item 14
Code
import { VirtualList } from "@fragment_ui/ui";
const items = Array.from({ length: 10000 }, (_, i) => ({
id: i + 1,
name: `Item ${i + 1}`,
}));
<VirtualList
items={items}
itemHeight={50}
renderItem={(item) => (
<div>{item.name}</div>
)}
/>