What problem does it solve? Choosing the wrong table variant or misconfiguring columns, expansion, or selection leads to broken layouts and rework. This Skill maps your data shape to the correct table variant and documents every configuration area so tables render correctly the first time. ## Core Features & Use Cases - Variant selection by data shape: SimpleDataTable for short flat arrays, PaginatedDataTable for paged lists, VirtualizedDataTable for long scrollable lists, and ExpandableDataTable for tree data with nested rows. - Configuration guidance: Covers column configs, CSS grid-based column widths, alignment, pinning, grouped headers, row selection with injected checkbox columns, clickable rows, inline expanded detail panels, and loading/error/empty states. - Use Case: When building a chart-of-accounts screen with nested account rows, use ExpandableDataTable with getSubRows and a stable getRowId, plus a stylesheet defining grid-template-columns keyed on the componentName classes. ## Quick Start Ask the AI to build a paginated customer table with row selection and pinned columns using the Table blocks, following the variant and columnConfig conventions in this Skill.
