Data Table

Sortable, filterable, paginated data table with search and export capabilities for managing case records.

Usage Notes

When to use: Use a data table when users need to browse, search, sort, and compare multiple records such as cases, applications, or transactions. Best for data sets that exceed 10 items and benefit from column-based sorting and filtering.
Accessibility considerations: The table uses semantic HTML with <caption>, <thead>, and <tbody>. Sortable columns are keyboard-accessible (Enter/Space to toggle) with aria-sort attributes. Sort changes are announced via an ARIA live region. Pagination state is communicated through visible page info text. The search field filters in real-time with results announced to screen readers.
NYSDS components used: nys-textinput (search, date range), nys-select (status filter), nys-badge (status cells), nys-pagination (page navigation), nys-button (export), nys-alert (feedback)
Customization points: Column definitions, page size, filter criteria, cell renderers, and caption text are all configurable through the DataTableManager API. Custom renderCell functions support rich cell content like badges and formatted values.