logo

svelte simple datatables

A toolkit for creating datatable components with Svelte

npm version last commit

# Presentation This package provides an API to handle data and related events : rows, filters, pagination, search, sort... - **Headless** by design
- **Typescript** support
- **SSR** compatibility Also provides some sample components, which you can grab and customize in your own project.
:globe_with_meridians: **[Live examples](https://vincjo.fr/datatables/examples)**
# Install ````apache npm i -D @vincjo/datatables ```` # Sample code ````svelte {#each $rows as row} {/each}
First name Last name
{row.first_name} {row.last_name}
```` ### :globe_with_meridians: [See full documentation](https://vincjo.fr/datatables)
# DataHandler methods ````ts getRows(): Readable setRows( data: any[] ): void ```` ````ts sort( orderBy: Function | string ): void sortAsc( orderBy: Function | string ): void sortDesc( orderBy: Function | string ): void getSorted(): Writable<{ identifier?: string; direction?: 'asc' | 'desc'; }> applySorting( params: null | {orderBy: Function | string; direction?: 'asc' | 'desc'} ): void ```` ````ts filter( value: string, filterBy: Function | string ): void clearFilters(): void ```` ````ts search( value: string, scope?: string[] ): void clearSearch(): void ```` ````ts getRowsPerPage(): Writable ```` ````ts getRowCount(): Readable<{ total: number; start: number; end: number; }> ```` ````ts getPages( param: { ellipsis: boolean } ): Readable getPageCount(): Readable getPageNumber(): Readable setPage( value: number | ‘previous’ | ‘next’ ): void ```` ````ts getTriggerChange(): Writable ````