Playground

Ten knobs on the real component.

This is the actual component, not a recording. Turn a knob and two things change at once: the tree on the left, and the component source underneath it. Copy that source and it runs — the imports are there and the data is the canonical eight-node tree used throughout the docs.

Ten props have knobs — data, estimateSize, indent, height, overscan, minSearchChars, searchScope, renderCheckbox, renderItem, checkedItems — and the filter box above the tree drives searchQuery. There are no knobs for renderExpander, expandedItems, onExpand, className or style; the props reference has those.

There is no bundler in an iframe here. The knobs write into one state object, and that object renders both the tree and the snippet, so the page stays as cheap as the library it is arguing for.