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

108 lines (107 loc) 4.44 kB
import type { Column } from './columns.js'; import { type HeaderCell } from './headerCells.js'; import { TableComponent } from './tableComponent.js'; import type { Matrix } from './types/Matrix.js'; import type { AnyPlugins } from './types/TablePlugin.js'; /** * HTML attributes for a header row element. * * @template Item - The type of data items in the table. * @template Plugins - The plugins used by the table. */ export type HeaderRowAttributes<Item, Plugins extends AnyPlugins = AnyPlugins> = { role: 'row'; }; /** * Initialization options for creating a HeaderRow. * * @template Item - The type of data items in the table. * @template Plugins - The plugins used by the table. */ export interface HeaderRowInit<Item, Plugins extends AnyPlugins = AnyPlugins> { id: string; cells: HeaderCell<Item, Plugins>[]; } /** * Represents a row in the table header. * Contains header cells for column labels and group headers. * * @template Item - The type of data items in the table. * @template Plugins - The plugins used by the table. */ export declare class HeaderRow<Item, Plugins extends AnyPlugins = AnyPlugins> extends TableComponent<Item, Plugins, 'thead.tr'> { /** The header cells in this row. */ cells: HeaderCell<Item, Plugins>[]; /** * Creates a new HeaderRow. * * @param init - Initialization options. */ constructor({ id, cells }: HeaderRowInit<Item, Plugins>); /** * Gets the HTML attributes for this header row. * * @returns A readable store of row attributes. */ attrs(): import("svelte/store").Readable<{ role: "row"; }>; /** * Creates a copy of this header row. * * @returns A cloned HeaderRow. */ clone(): HeaderRow<Item, Plugins>; } /** * Converts an array of columns into header rows for rendering. * Handles nested column groups by creating multiple header rows. * * @template Item - The type of data items in the table. * @template Plugins - The plugins used by the table. * @param columns - The column definitions. * @param flatColumnIds - Optional array of column IDs for ordering. * @returns An array of HeaderRow objects. */ export declare const getHeaderRows: <Item, Plugins extends AnyPlugins = AnyPlugins>(columns: Column<Item, Plugins>[], flatColumnIds?: string[]) => HeaderRow<Item, Plugins>[]; /** * Creates a matrix of header cells from column definitions. * Each row in the matrix represents a header row, with cells positioned * according to their column spans. * * @template Item - The type of data items in the table. * @template Plugins - The plugins used by the table. * @param columns - The column definitions. * @returns A matrix of HeaderCell objects. */ export declare const getHeaderRowMatrix: <Item, Plugins extends AnyPlugins = AnyPlugins>(columns: Column<Item, Plugins>[]) => Matrix<HeaderCell<Item, Plugins>>; /** * Reorders a column matrix according to the specified column ID order. * * @template Item - The type of data items in the table. * @template Plugins - The plugins used by the table. * @param columnMatrix - The original column matrix. * @param flatColumnIds - The desired order of column IDs. * @returns A reordered column matrix. */ export declare const getOrderedColumnMatrix: <Item, Plugins extends AnyPlugins = AnyPlugins>(columnMatrix: Matrix<HeaderCell<Item, Plugins>>, flatColumnIds: string[]) => Matrix<HeaderCell<Item, Plugins>>; /** * Converts a row matrix into an array of HeaderRow objects. * * @template Item - The type of data items in the table. * @template Plugins - The plugins used by the table. * @param rowMatrix - The matrix of header cells organized by rows. * @returns An array of HeaderRow objects. */ export declare const headerRowsForRowMatrix: <Item, Plugins extends AnyPlugins = AnyPlugins>(rowMatrix: Matrix<HeaderCell<Item, Plugins>>) => HeaderRow<Item, Plugins>[]; /** * Multi-colspan cells will appear as multiple adjacent cells on the same row. * Join these adjacent multi-colspan cells and update the colspan property. * * Non-adjacent multi-colspan cells (due to column ordering) must be cloned * from the original . * * @param cells An array of cells. * @returns An array of cells with no duplicate consecutive cells. */ export declare const getMergedRow: <Item, Plugins extends AnyPlugins = AnyPlugins>(cells: HeaderCell<Item, Plugins>[]) => HeaderCell<Item, Plugins>[];