Headless / Specialized

Specialized

The purpose-built behaviours. Each one solves a single, involved interaction that does not generalise — a colour picker, a file drop zone, a tree.

Updated 3 days agoEdit on GitHubWeb & native

The pieces

ComponentUse it for
ColorPickerPicking a colour — HSV plane, hue and alpha sliders, format toggle.
FileUploadA drag-and-drop file region over a native file input.
TreeViewA nested, expandable, keyboard-navigable tree.

Why grouped together

These three share no interaction model — they are grouped because each is a self-contained, non-trivial widget that does not fit any other family. A colour picker is colour maths plus drag surfaces. A file upload is drag-and-drop plus a hidden input. A tree is recursive structure plus the WAI-ARIA tree pattern. Each is its own page-sized concern.

Headless, still

Specialized does not mean styled. ColorPicker ships only the minimum geometry its drag surfaces need; you supply the rest. FileUpload gives you a render prop with isDragging and openPicker and draws nothing itself. TreeView hands each node to your renderNode. The behaviour is involved; the styling is still yours.