Function: SdvTable()

SdvTable<Row>(props): ReactElement

Defined in: packages/sdvtables/src/react/index.tsx:162

Same markup as renderHTML (test-enforced). Two forms: { spec, rows } builds an engine (only when interactive; a static table needs none) that lives as long as the component; { table } renders an engine you own, statically (its current page: filtered, sorted, sliced) or with controls. The table block is the string renderer's output; React owns only the toolbar inputs and the pager, so typing in a filter never re-creates the input. The inputs are controlled by the engine state, so a filter set from outside (another component, a linked selection) shows in its box. A control or focusable cell element that a re-render replaces gets focus back, as in hydrate. The Google-Fonts link is NOT rendered: put fontsLinkFor(spec) in the page head.

Two cases remount the owned engine ({ spec, rows } form only; an engine passed as table is yours and is kept): toggling interactive remounts it, losing the user's sort, filters, page and selection, since a static render builds no engine. And the engine is keyed by the spec's JSON, which drops functions, so a deliberately changed formatter or comparator under an otherwise equal spec does NOT take effect: change the element's React key to rebuild the engine from the new spec.

Type Parameters

Row

Row

Parameters

props

SdvTableProps<Row>

Returns

ReactElement