UNPKG

@humanspeak/svelte-headless-table

Version:

A powerful, headless table library for Svelte that provides complete control over table UI while handling complex data operations like sorting, filtering, pagination, grouping, and row expansion. Build custom, accessible data tables with zero styling opin

40 lines (39 loc) 1.86 kB
import type { RenderConfig } from '@humanspeak/svelte-render'; import { type Readable, type Writable } from 'svelte/store'; import type { BodyRow } from '../bodyRows.js'; import type { PluginInitTableState } from '../createViewModel.js'; import type { NewTablePropSet, TablePlugin } from '../types/TablePlugin.js'; export interface ColumnFiltersConfig { serverSide?: boolean; } export interface ColumnFiltersState<Item> { filterValues: Writable<Record<string, unknown>>; preFilteredRows: Readable<BodyRow<Item>[]>; } export interface ColumnFiltersColumnOptions<Item, FilterValue = any> { fn: ColumnFilterFn<FilterValue>; initialFilterValue?: FilterValue; render?: (props: ColumnRenderConfigPropArgs<Item, FilterValue>) => RenderConfig; } interface ColumnRenderConfigPropArgs<Item, FilterValue = any, Value = any> extends PluginInitTableState<Item> { id: string; filterValue: Writable<FilterValue>; values: Readable<Value[]>; preFilteredRows: Readable<BodyRow<Item>[]>; preFilteredValues: Readable<Value[]>; } export type ColumnFilterFn<FilterValue = any, Value = any> = (props: ColumnFilterFnProps<FilterValue, Value>) => boolean; export type ColumnFilterFnProps<FilterValue = any, Value = any> = { filterValue: FilterValue; value: Value; }; export type ColumnFiltersPropSet = NewTablePropSet<{ 'thead.tr.th': { render?: RenderConfig; } | undefined; }>; export declare const addColumnFilters: <Item>({ serverSide }?: ColumnFiltersConfig) => TablePlugin<Item, ColumnFiltersState<Item>, ColumnFiltersColumnOptions<Item>, ColumnFiltersPropSet>; export declare const matchFilter: ColumnFilterFn<unknown, unknown>; export declare const textPrefixFilter: ColumnFilterFn<string, string>; export declare const numberRangeFilter: ColumnFilterFn<[number | null, number | null], number>; export {};