Designing a flexible yet usable DataTable API

WHAT THIS TESTS Whether you can design a component API that is easy for the eighty-percent case yet extensible for the long tail, and whether you reason about discoverability, type safety, and composition.

A GOOD ANSWER COVERS Start with progressive disclosure: trivial usage should need almost nothing, with sensible defaults. Expose individual props for discrete, common options like striped, dense, or sortable, because they are discoverable through autocomplete and types. For structural flexibility, prefer composition over configuration: compound components such as Table, Column, and Cell, or render props and slots, let consumers control rendering without a god-object. Reserve a config object for genuinely grouped, related settings like pagination or virtualization. Distinguish data configuration from presentation. Keep callbacks predictable and avoid order-dependent props.

COMMON WRONG ANSWERS Dumping everything into one opaque options object, which kills autocomplete, complicates typing, and breaks tree-shaking. Conversely, flattening fifty boolean props with no grouping, which overwhelms users. Hardcoding rendering so consumers cannot customize cells. Ignoring controlled versus uncontrolled state.

LIKELY FOLLOW-UPS How do you handle controlled versus uncontrolled sorting and selection? How do render props compare to slots for custom cells? How do you keep the API stable across versions? How does virtualization affect the API surface?

ONE CONCRETE EXAMPLE Expose columns as a typed array and a renderCell render prop for custom content, keep striped and dense as simple boolean props, and group pagination settings under a pagination object. A consumer renders a basic table with just data and columns, then opts into a custom status cell via renderCell without learning a hundred-key config schema.