@tanstack/svelte-table/dist/createTable.svelte.d.ts

Headless UI for building powerful tables & datagrids for Svelte.

import type { RowData, Table, TableFeatures, TableOptions } from '@tanstack/table-core';
/**
 * A Svelte-aware TanStack Table instance.
 *
 * Table APIs and `table.atoms.<slice>.get()` reads participate in Svelte
 * dependency tracking when used in templates, `$derived`, or `$effect`.
 */
export type SvelteTable<TFeatures extends TableFeatures, TData extends RowData> = Table<TFeatures, TData>;
/**
 * Creates a Svelte 5 table instance backed by rune-aware TanStack Store atoms.
 *
 * Read a specific state slice with `table.atoms.<slice>.get()` and read the
 * complete state with `table.store.get()`. Those reads participate in Svelte
 * dependency tracking when they run in a template, `$derived`, or `$effect`.
 * The adapter syncs options in `$effect.pre`, so reactive option getters and
 * external `$state` values are applied before DOM updates read table APIs such
 * as `getRowModel()`.
 *
 * @example
 * ```svelte
 * <script lang="ts">
 *   const table = createTable({
 *     features,
 *     columns,
 *     get data() {
 *       return data
 *     },
 *   })
 *
 *   const pagination = $derived(table.atoms.pagination.get())
 *   const stateJson = $derived(JSON.stringify(table.store.get(), null, 2))
 * </script>
 *
 * <span>Page {pagination.pageIndex + 1}</span>
 * <pre>{stateJson}</pre>
 * ```
 */
export declare function createTable<TFeatures extends TableFeatures, TData extends RowData>(tableOptions: TableOptions<TFeatures, TData>): SvelteTable<TFeatures, TData>;