Patterns
Data table
Searchable, sortable records with plain and rounded surface variants.
| Status | ||||
|---|---|---|---|---|
Alex Morgan | Northstar Studio | Hyderabad | Active | |
Jamie Chen | Fieldwork Design | Bengaluru | Pending | |
Taylor Reed | Common Ground | Chennai | Active |
1–3 of 5
Interactive local example · fictional data
The Code tab contains this preview’s complete source, including sample data and interaction state. Load the package stylesheet and Switzer font as described in the installation guide. Additional layout utilities require Tailwind CSS in your application.
API reference
| Prop | Type | Default |
|---|---|---|
| data / columns | T[] / Column<T>[] | required |
| rowKey | (row: T) => string | required |
| pageSize | number | 10 |
| variant | "plain" | "rounded" | "plain" |
| searchPlaceholder | string | — |
Primitives also accept their underlying HTML or Radix props. Full types are included with the package.
Behavior & accessibility
- Sorting exposes aria-sort. Search, sorting, and pagination run locally.
- Use stable unique row keys; remote pagination requires application-level integration.
Reference
Contacts, referrals, dashboard summaries