Data Table
An interactive layer over a slotted light-DOM <table> that adds column sorting, text search/filter, and client-side pagination.
Preview
Attributes
| Attribute | Type | Default | Description |
|---|---|---|---|
searchable | boolean | — | Show the search box and filter rows by visible text |
page-size | number | — | Rows per page; unset or 0 disables pagination |
striped | boolean | — | Apply zebra-stripe styling to visible body rows |
Installation
pura is copy-paste and dependency-free. Load the whole library, or just this component.
<link rel="stylesheet" href="/pura/tokens.css">
<script type="module" src="/pura/lib/data-table.js"></script>import "./pura/lib/data-table.js";