# Svelte Headless Table
[](https://www.npmjs.com/package/@humanspeak/svelte-headless-table)
[](https://github.com/humanspeak/svelte-headless-table/actions/workflows/npm-publish.yml)
[](https://coveralls.io/github/humanspeak/svelte-headless-table?branch=main)
[](https://github.com/humanspeak/svelte-headless-table/blob/main/LICENSE)
[](https://www.npmjs.com/package/@humanspeak/svelte-headless-table)
[](https://github.com/humanspeak/svelte-headless-table/actions/workflows/codeql.yml)
[](https://packagephobia.com/result?p=@humanspeak/svelte-headless-table)
[](https://trunk.io)
[](http://www.typescriptlang.org/)
[](https://www.npmjs.com/package/@humanspeak/svelte-headless-table)
[](https://github.com/humanspeak/svelte-headless-table/graphs/commit-activity)
## Unopinionated and extensible data tables for Svelte
> Build and design powerful datagrid experiences while retaining 100% control over styles and markup.
Visit the [documentation](https://table.svelte.page/) for code examples and API reference, and get started with the [quick start guide](https://table.svelte.page/docs/getting-started/quick-start)!
## Why Svelte Headless Table?
Svelte Headless Table is designed to work **seamlessly** with Svelte. If you love Svelte, you will love Svelte Headless Table.
- **Full TypeScript support**
- Compatible with **SvelteKit** and SSR
- Manage state with Svelte stores
- Headless and fully customizable
- Intuitive column-first declarative model
- Highly performant
- Feature-rich
## All the features you could ever need
Svelte Headless Table comes with an extensive suite of plugins.
Easily extend Svelte Headless Table with complex **sorting**, **filtering**, **grouping**, **pagination**, and much more.
### Plugin roadmap
- [x] [addSortBy](https://table.svelte.page/docs/plugins/add-sort-by)
- [x] [addColumnFilters](https://table.svelte.page/docs/plugins/add-column-filters)
- [x] [addTableFilter](https://table.svelte.page/docs/plugins/add-table-filter)
- [x] [addColumnOrder](https://table.svelte.page/docs/plugins/add-column-order)
- [x] [addHiddenColumns](https://table.svelte.page/docs/plugins/add-hidden-columns)
- [x] [addPagination](https://table.svelte.page/docs/plugins/add-pagination)
- [x] [addSubRows](https://table.svelte.page/docs/plugins/add-sub-rows)
- [x] [addGroupBy](https://table.svelte.page/docs/plugins/add-group-by)
- [x] [addExpandedRows](https://table.svelte.page/docs/plugins/add-expanded-rows)
- [x] [addSelectedRows](https://table.svelte.page/docs/plugins/add-selected-rows)
- [x] [addResizedColumns](https://table.svelte.page/docs/plugins/add-resized-columns)
- [x] [addGridLayout](https://table.svelte.page/docs/plugins/add-grid-layout)
- [x] [addVirtualScroll](https://table.svelte.page/docs/plugins/add-virtual-scroll)
## Examples
```svelte
{#each $headerRows as headerRow (headerRow.id)}
{#each headerRow.cells as cell (cell.id)}
|
|
{/each}
{/each}
{#each $rows as row (row.id)}
{#each row.cells as cell (cell.id)}
|
|
{/each}
{/each}
```
For more complex examples with advanced features, visit the [documentation site](https://table.svelte.page/docs/plugins/overview).