# DataTable

Render shared table styling for structured row-and-column data. Because sometimes you just need a really good looking spreadsheet.

## Notes

- Pass exactly one of labelledBy or ariaLabel so the table has an accessible name. Screen readers need love too.
- Pair with SortIndicator when headers need sort affordance.
- Don't put a whole app inside a table cell. It's not 1999.



## Example

```astro
<DataTable ariaLabel="Release matrix">
  <tr slot="head">
    <th scope="col">Surface</th>
    <th scope="col">Status</th>
  </tr>
  <tr>
    <td data-label="Surface">Docs app</td>
    <td data-label="Status">Ready</td>
  </tr>
</DataTable>
```