grassroot
Install

DocsAPI referenceHeadlessdata-table

data-table headless API

The core connector and vanilla mount are always visible. Use the framework choice to inspect native composition, props, outputs, context and hooks for the selected adapter.

Machine APIPlatform contract

@grassroot/ui-headless-core/data-table

Core connector and vanilla API

36 exports
View source packages/ui-headless/core/src/data-table/index.ts

connectDataTable

function
DeclarationView source
connectDataTablets
declare function connectDataTable(service: DataTableService, scope: PartScope, options: DataTableConnectOptions): DataTableApi;
Name
Kind
Type
Requirement
service
parameter
DataTableService
required
scope
parameter
PartScope
required
options
parameter
DataTableConnectOptions
required
return
return value
DataTableApi
n/a
Name
service
Kind
parameter
Type
DataTableService
Requirement
required
Name
scope
Kind
parameter
Type
PartScope
Requirement
required
Name
options
Kind
parameter
Type
DataTableConnectOptions
Requirement
required
Name
return
Kind
return value
Type
DataTableApi
Requirement
n/a

createDataTableSortState

function

Duplicate of frozen `createDataTableSortState`.

DeclarationView source
createDataTableSortStatets
declare function createDataTableSortState(defaultSort?: string | null): DataTableSortState;
Name
Kind
Type
Requirement
defaultSort
parameter
string | null
optional
return
return value
DataTableSortState
n/a
Name
defaultSort
Kind
parameter
Type
string | null
Requirement
optional
Name
return
Kind
return value
Type
DataTableSortState
Requirement
n/a

dataTableAnatomy

value
DeclarationView source
dataTableAnatomyts
export declare const dataTableAnatomy: {
  readonly scope: "data-table";
  readonly parts: readonly ["root", "caption", "header", "header-row", "header-cell", "sort-button", "body", "row", "cell"];
};
Name
Kind
Type
Requirement
parts
property
readonly ["root", "caption", "header", "header-row", "header-cell", "sort-button", "body", "row", "cell"]
required
scope
property
"data-table"
required
Name
parts
Kind
property
Type
readonly ["root", "caption", "header", "header-row", "header-cell", "sort-button", "body", "row", "cell"]
Requirement
required
Name
scope
Kind
property
Type
"data-table"
Requirement
required

DataTableApi

interface
DeclarationView source
DataTableApits
interface DataTableApi {
  rootProps(): PartProps;
  captionProps(): PartProps;
  headerProps(): PartProps;
  headerRowProps(): PartProps;
  headerCellProps(columnKey: string): PartProps;
  sortButtonProps(columnKey: string): PartProps;
  bodyProps(): PartProps;
  rowProps(rowId: string, visualIndex?: number): PartProps;
  cellProps(rowId: string, columnKey: string): PartProps;
  selectAll(selectableIds?: SelectionValue): void;
  clear(): void;
  readonly sortKey: string | null;
  readonly dir: "asc" | "desc";
  readonly selectedIds: SelectionValue;
  readonly selectionMode: SelectionMode;
  ariaSort(columnKey: string): "ascending" | "descending" | "none";
}
Name
Kind
Type
Requirement
ariaSort
method
(columnKey: string) => "ascending" | "descending" | "none"
required
bodyProps
method
() => PartProps
required
captionProps
method
() => PartProps
required
cellProps
method
(rowId: string, columnKey: string) => PartProps
required
clear
method
() => void
required
dir
property
"asc" | "desc"
required
headerCellProps
method
(columnKey: string) => PartProps
required
headerProps
method
() => PartProps
required
headerRowProps
method
() => PartProps
required
rootProps
method
() => PartProps
required
rowProps
method
(rowId: string, visualIndex?: number) => PartProps
required
selectAll
method
(selectableIds?: SelectionValue) => void
required
selectedIds
property
SelectionValue
required
selectionMode
property
SelectionMode
required
Name
ariaSort
Kind
method
Type
(columnKey: string) => "ascending" | "descending" | "none"
Requirement
required
Name
bodyProps
Kind
method
Type
() => PartProps
Requirement
required
Name
captionProps
Kind
method
Type
() => PartProps
Requirement
required
Name
cellProps
Kind
method
Type
(rowId: string, columnKey: string) => PartProps
Requirement
required
Name
clear
Kind
method
Type
() => void
Requirement
required
Name
dir
Kind
property
Type
"asc" | "desc"
Requirement
required
Name
headerCellProps
Kind
method
Type
(columnKey: string) => PartProps
Requirement
required
Name
headerProps
Kind
method
Type
() => PartProps
Requirement
required
Name
headerRowProps
Kind
method
Type
() => PartProps
Requirement
required
Name
rootProps
Kind
method
Type
() => PartProps
Requirement
required
Name
rowProps
Kind
method
Type
(rowId: string, visualIndex?: number) => PartProps
Requirement
required
Name
selectAll
Kind
method
Type
(selectableIds?: SelectionValue) => void
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required
Name
selectionMode
Kind
property
Type
SelectionMode
Requirement
required
Name
sortButtonProps
Kind
method
Type
(columnKey: string) => PartProps
Requirement
required
Name
sortKey
Kind
property
Type
string | null
Requirement
required

DataTableCommand

type
DeclarationView source
DataTableCommandts
type DataTableCommand = SelectionCommand;

DataTableConnectOptions

interface
DeclarationView source
DataTableConnectOptionsts
interface DataTableConnectOptions {
  readonly columnKeys: readonly string[];
  readonly sortableKeys?: readonly string[];
  readonly caption?: string;
  readonly zebra?: boolean;
  readonly onSelectedIdsChange?: (detail: SelectionChangeDetail) => void;
  readonly selectableIds?: SelectionValue;
}
Name
Kind
Type
Requirement
caption
property
string
optional
columnKeys
property
readonly string[]
required
onSelectedIdsChange
property
(detail: SelectionChangeDetail) => void
optional
selectableIds
property
SelectionValue
optional
sortableKeys
property
readonly string[]
optional
zebra
property
boolean
optional
Name
caption
Kind
property
Type
string
Requirement
optional
Name
columnKeys
Kind
property
Type
readonly string[]
Requirement
required
Name
onSelectedIdsChange
Kind
property
Type
(detail: SelectionChangeDetail) => void
Requirement
optional
Name
selectableIds
Kind
property
Type
SelectionValue
Requirement
optional
Name
sortableKeys
Kind
property
Type
readonly string[]
Requirement
optional
Name
zebra
Kind
property
Type
boolean
Requirement
optional

DataTableContext

type
DeclarationView source
DataTableContextts
type DataTableContext = {
  readonly sortKey: string | null;
  readonly dir: DataTableSortDir;
  readonly selection: SelectionMachineState;
};
Name
Kind
Type
Requirement
dir
property
DataTableSortDir
required
selection
property
SelectionMachineState
required
sortKey
property
string | null
required
Name
dir
Kind
property
Type
DataTableSortDir
Requirement
required
Name
selection
Kind
property
Type
SelectionMachineState
Requirement
required
Name
sortKey
Kind
property
Type
string | null
Requirement
required

DataTableEvent

type
DeclarationView source
DataTableEventts
type DataTableEvent = SelectionEvent | {
  readonly type: "TOGGLE_SORT";
  readonly key: string;
  readonly sortable: boolean;
};

DataTableInput

type
DeclarationView source
DataTableInputts
type DataTableInput = {
  readonly defaultSort?: string | null;
  readonly selectionMode?: SelectionMode;
  readonly selectedIds?: SelectionValue;
  readonly defaultSelectedIds?: SelectionValue;
  readonly orderedIds?: readonly string[];
  readonly disabledIds?: readonly string[];
};
Name
Kind
Type
Requirement
defaultSelectedIds
property
SelectionValue
optional
defaultSort
property
string | null
optional
disabledIds
property
readonly string[]
optional
orderedIds
property
readonly string[]
optional
selectedIds
property
SelectionValue
optional
selectionMode
property
SelectionMode
optional
Name
defaultSelectedIds
Kind
property
Type
SelectionValue
Requirement
optional
Name
defaultSort
Kind
property
Type
string | null
Requirement
optional
Name
disabledIds
Kind
property
Type
readonly string[]
Requirement
optional
Name
orderedIds
Kind
property
Type
readonly string[]
Requirement
optional
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
optional
Name
selectionMode
Kind
property
Type
SelectionMode
Requirement
optional

dataTableMachine

value
DeclarationView source
dataTableMachinets
export declare const dataTableMachine: DataTableMachine;

DataTableMount

interface
DeclarationView source
DataTableMountts
interface DataTableMount {
  readonly service: DataTableService;
  readonly connector: DataTableApi;
  readonly root: HTMLElement;
  destroy(): void;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
destroy
method
() => void
required
root
property
HTMLElement
required
service
property
DataTableService
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
destroy
Kind
method
Type
() => void
Requirement
required
Name
root
Kind
property
Type
HTMLElement
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required

DataTablePart

type
DeclarationView source
DataTablePartts
type DataTablePart = (typeof dataTableAnatomy.parts)[number];

DataTableRowIdProjection

type
DeclarationView source
DataTableRowIdProjectionts
type DataTableRowIdProjection = {
  readonly orderedIds: readonly string[];
  readonly disabledIds: readonly string[];
  readonly selectionEnabled: boolean;
  readonly diagnostic?: DiagnosticObject;
};
Name
Kind
Type
Requirement
diagnostic
property
DiagnosticObject
optional
disabledIds
property
readonly string[]
required
orderedIds
property
readonly string[]
required
selectionEnabled
property
boolean
required
Name
diagnostic
Kind
property
Type
DiagnosticObject
Requirement
optional
Name
disabledIds
Kind
property
Type
readonly string[]
Requirement
required
Name
orderedIds
Kind
property
Type
readonly string[]
Requirement
required
Name
selectionEnabled
Kind
property
Type
boolean
Requirement
required

DataTableRowIdReason

type
DeclarationView source
DataTableRowIdReasonts
type DataTableRowIdReason = "missing" | "empty" | "duplicate" | "threw";

dataTableSelectors

value
DeclarationView source
dataTableSelectorsts
export declare const dataTableSelectors: {
  sortKey: (snapshot: DataTableSnapshot) => string | null;
  dir: (snapshot: DataTableSnapshot) => DataTableSortDir;
  selectedIds: (snapshot: DataTableSnapshot) => SelectionValue;
  anchorId: (snapshot: DataTableSnapshot) => string | null;
  bindingMode: (snapshot: DataTableSnapshot) => BindingMode;
  selection: (snapshot: DataTableSnapshot) => SelectionMachineState;
};
Name
Kind
Type
Requirement
anchorId
property
(snapshot: DataTableSnapshot) => string | null
required
bindingMode
property
(snapshot: DataTableSnapshot) => BindingMode
required
dir
property
(snapshot: DataTableSnapshot) => DataTableSortDir
required
selectedIds
property
(snapshot: DataTableSnapshot) => SelectionValue
required
selection
property
(snapshot: DataTableSnapshot) => SelectionMachineState
required
sortKey
property
(snapshot: DataTableSnapshot) => string | null
required
Name
anchorId
Kind
property
Type
(snapshot: DataTableSnapshot) => string | null
Requirement
required
Name
bindingMode
Kind
property
Type
(snapshot: DataTableSnapshot) => BindingMode
Requirement
required
Name
dir
Kind
property
Type
(snapshot: DataTableSnapshot) => DataTableSortDir
Requirement
required
Name
selectedIds
Kind
property
Type
(snapshot: DataTableSnapshot) => SelectionValue
Requirement
required
Name
selection
Kind
property
Type
(snapshot: DataTableSnapshot) => SelectionMachineState
Requirement
required
Name
sortKey
Kind
property
Type
(snapshot: DataTableSnapshot) => string | null
Requirement
required

DataTableService

type
DeclarationView source
DataTableServicets
type DataTableService = Service<DataTableInput, DataTableStateValue, DataTableContext, DataTableEvent, DataTableCommand>;

DataTableSnapshot

type
DeclarationView source
DataTableSnapshotts
type DataTableSnapshot = Snapshot<DataTableStateValue, DataTableContext>;

DataTableSortAction

type
DeclarationView source
DataTableSortActionts
type DataTableSortAction = {
  readonly type: "toggle";
  readonly key: string;
  readonly sortable: boolean;
};
Name
Kind
Type
Requirement
key
property
string
required
sortable
property
boolean
required
type
property
"toggle"
required
Name
key
Kind
property
Type
string
Requirement
required
Name
sortable
Kind
property
Type
boolean
Requirement
required
Name
type
Kind
property
Type
"toggle"
Requirement
required

DataTableSortDir

type
DeclarationView source
DataTableSortDirts
type DataTableSortDir = "asc" | "desc";

DataTableSortState

type
DeclarationView source
DataTableSortStatets
type DataTableSortState = {
  readonly sortKey: string | null;
  readonly dir: DataTableSortDir;
};
Name
Kind
Type
Requirement
dir
property
DataTableSortDir
required
sortKey
property
string | null
required
Name
dir
Kind
property
Type
DataTableSortDir
Requirement
required
Name
sortKey
Kind
property
Type
string | null
Requirement
required

DataTableStateValue

type
DeclarationView source
DataTableStateValuets
type DataTableStateValue = "active";

EMPTY_SELECTION_IDS

value
DeclarationView source
EMPTY_SELECTION_IDSts
export declare const EMPTY_SELECTION_IDS: SelectionValue;

mountDataTable

function
DeclarationView source
mountDataTablets
declare function mountDataTable(container: HTMLElement, options: MountDataTableOptions): DataTableMount;
Name
Kind
Type
Requirement
container
parameter
HTMLElement
required
options
parameter
MountDataTableOptions
required
return
return value
DataTableMount
n/a
Name
container
Kind
parameter
Type
HTMLElement
Requirement
required
Name
options
Kind
parameter
Type
MountDataTableOptions
Requirement
required
Name
return
Kind
return value
Type
DataTableMount
Requirement
n/a

MountDataTableOptions

interface
DeclarationView source
MountDataTableOptionsts
interface MountDataTableOptions extends DataTableInput, DataTableConnectOptions {
  readonly onSelectedIdsChange?: (detail: SelectionChangeDetail) => void;
  readonly renderHeader?: (cell: HTMLElement, columnKey: string) => void;
  readonly renderCell?: (cell: HTMLElement, columnKey: string, rowId: string) => void;
}
Name
Kind
Type
Requirement
onSelectedIdsChange
property
(detail: SelectionChangeDetail) => void
optional
renderCell
property
(cell: HTMLElement, columnKey: string, rowId: string) => void
optional
renderHeader
property
(cell: HTMLElement, columnKey: string) => void
optional
Name
onSelectedIdsChange
Kind
property
Type
(detail: SelectionChangeDetail) => void
Requirement
optional
Name
renderCell
Kind
property
Type
(cell: HTMLElement, columnKey: string, rowId: string) => void
Requirement
optional
Name
renderHeader
Kind
property
Type
(cell: HTMLElement, columnKey: string) => void
Requirement
optional

projectDataTableRowIds

function
DeclarationView source
projectDataTableRowIdsts
declare function projectDataTableRowIds<T>(rows: readonly T[], options: {
  readonly selectionMode?: SelectionMode;
  readonly getRowId?: (row: T, index: number) => string;
  readonly isRowDisabled?: (row: T, index: number) => boolean;
}): DataTableRowIdProjection;
Name
Kind
Type
Requirement
rows
parameter
readonly T[]
required
options
parameter
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
required
return
return value
DataTableRowIdProjection
n/a
Name
rows
Kind
parameter
Type
readonly T[]
Requirement
required
Name
options
Kind
parameter
Type
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
Requirement
required
Name
return
Kind
return value
Type
DataTableRowIdProjection
Requirement
n/a

reduceDataTableSort

function

Duplicate of frozen `reduceDataTableSort`.

DeclarationView source
reduceDataTableSortts
declare function reduceDataTableSort(state: DataTableSortState, action: DataTableSortAction): DataTableSortState;
Name
Kind
Type
Requirement
state
parameter
DataTableSortState
required
action
parameter
DataTableSortAction
required
return
return value
DataTableSortState
n/a
Name
state
Kind
parameter
Type
DataTableSortState
Requirement
required
Name
action
Kind
parameter
Type
DataTableSortAction
Requirement
required
Name
return
Kind
return value
Type
DataTableSortState
Requirement
n/a

runDataTableCommand

function
DeclarationView source
runDataTableCommandts
declare function runDataTableCommand(command: DataTableCommand, _scope: PartScope, options?: DataTableConnectOptions): void;
Name
Kind
Type
Requirement
command
parameter
DataTableCommand
required
_scope
parameter
PartScope
required
options
parameter
DataTableConnectOptions
optional
return
return value
void
n/a
Name
command
Kind
parameter
Type
DataTableCommand
Requirement
required
Name
_scope
Kind
parameter
Type
PartScope
Requirement
required
Name
options
Kind
parameter
Type
DataTableConnectOptions
Requirement
optional
Name
return
Kind
return value
Type
void
Requirement
n/a

sameSelectionIds

function
DeclarationView source
sameSelectionIdsts
declare function sameSelectionIds(left: SelectionValue, right: SelectionValue): boolean;
Name
Kind
Type
Requirement
left
parameter
SelectionValue
required
right
parameter
SelectionValue
required
return
return value
boolean
n/a
Name
left
Kind
parameter
Type
SelectionValue
Requirement
required
Name
right
Kind
parameter
Type
SelectionValue
Requirement
required
Name
return
Kind
return value
Type
boolean
Requirement
n/a

SelectionChangeDetail

type
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
  readonly selectedIds: SelectionValue;
  readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

SelectionChangeReason

type
DeclarationView source
SelectionChangeReasonts
type SelectionChangeReason = "pointer" | "keyboard" | "programmatic";

selectionInputFromDataTable

function
DeclarationView source
selectionInputFromDataTablets
declare function selectionInputFromDataTable(input: DataTableInput): SelectionInput;
Name
Kind
Type
Requirement
input
parameter
DataTableInput
required
return
return value
SelectionInput
n/a
Name
input
Kind
parameter
Type
DataTableInput
Requirement
required
Name
return
Kind
return value
Type
SelectionInput
Requirement
n/a

selectionMachine

value
DeclarationView source
selectionMachinets
export declare const selectionMachine: SelectionMachine;

SelectionMode

type
DeclarationView source
SelectionModets
type SelectionMode = "none" | "single" | "multiple";

selectionSelectors

value
DeclarationView source
selectionSelectorsts
export declare const selectionSelectors: {
  selectedIds: (snapshot: SelectionSnapshot) => SelectionValue;
  anchorId: (snapshot: SelectionSnapshot) => string | null;
  bindingMode: (snapshot: SelectionSnapshot) => BindingMode;
  isSelected: (snapshot: SelectionSnapshot, id: string) => boolean;
};
Name
Kind
Type
Requirement
anchorId
property
(snapshot: SelectionSnapshot) => string | null
required
bindingMode
property
(snapshot: SelectionSnapshot) => BindingMode
required
isSelected
property
(snapshot: SelectionSnapshot, id: string) => boolean
required
selectedIds
property
(snapshot: SelectionSnapshot) => SelectionValue
required
Name
anchorId
Kind
property
Type
(snapshot: SelectionSnapshot) => string | null
Requirement
required
Name
bindingMode
Kind
property
Type
(snapshot: SelectionSnapshot) => BindingMode
Requirement
required
Name
isSelected
Kind
property
Type
(snapshot: SelectionSnapshot, id: string) => boolean
Requirement
required
Name
selectedIds
Kind
property
Type
(snapshot: SelectionSnapshot) => SelectionValue
Requirement
required

SelectionValue

type
DeclarationView source
SelectionValuets
type SelectionValue = readonly string[];

sortDataTableRows

function

Duplicate of frozen `sortDataTableRows`.

DeclarationView source
sortDataTableRowsts
declare function sortDataTableRows<T>(data: readonly T[], column: {
  readonly key: keyof T & string;
  readonly num?: boolean;
  readonly sortable?: boolean;
  readonly compare?: (a: T, b: T) => number;
} | undefined, direction: DataTableSortDir): T[];
Name
Kind
Type
Requirement
data
parameter
readonly T[]
required
column
parameter
{ readonly key: keyof T & string; readonly num?: boolean; readonly sortable?: boolean; readonly compare?: (a: T, b: T) => number; } | undefined
required
direction
parameter
DataTableSortDir
required
return
return value
T[]
n/a
Name
data
Kind
parameter
Type
readonly T[]
Requirement
required
Name
column
Kind
parameter
Type
{ readonly key: keyof T & string; readonly num?: boolean; readonly sortable?: boolean; readonly compare?: (a: T, b: T) => number; } | undefined
Requirement
required
Name
direction
Kind
parameter
Type
DataTableSortDir
Requirement
required
Name
return
Kind
return value
Type
T[]
Requirement
n/a

Framework adapters

Each panel keeps its adapter's public vocabulary. React compound exports, Vue composables, standalone Angular declarations, Svelte components, and Solid hooks stay native to their framework.

React example follows below.

React imports

@grassroot/ui-headless-react/data-tablets
import { Body, Caption, Cell, DataTable, Header, HeaderCell, HeaderRow, Root } from "@grassroot/ui-headless-react/data-table"; // +2 more exports

Vue imports

@grassroot/ui-headless-vue/data-tablets
<script setup lang="ts">
import { DataTableBody, DataTableCaption, DataTableCell, DataTableHeader, DataTableHeaderCell, DataTableHeaderRow, DataTableRoot, DataTableRow } from "@grassroot/ui-headless-vue/data-table"; // +1 more exports
</script>

Angular imports

@grassroot/ui-headless-angular/data-tablets
import { Component } from "@angular/core";
import { GR_DATA_TABLE_DECLARATIONS } from "@grassroot/ui-headless-angular/data-table";
 
@Component({ standalone: true, imports: [GR_DATA_TABLE_DECLARATIONS], template: `<!-- compose the data-table parts here -->` })
export class Example {}

Svelte imports

@grassroot/ui-headless-svelte/data-tablets
<script lang="ts">
  import { DataTableBody, DataTableCaption, DataTableCell, DataTableHeader, DataTableHeaderCell, DataTableHeaderRow, DataTableRoot, DataTableRow } from "@grassroot/ui-headless-svelte/data-table"; // +1 more exports
</script>

Solid imports

@grassroot/ui-headless-solid/data-tablets
import { DataTableBody, DataTableCaption, DataTableCell, DataTableHeader, DataTableHeaderCell, DataTableHeaderRow, DataTableRoot, DataTableRow } from "@grassroot/ui-headless-solid/data-table"; // +1 more exports

@grassroot/ui-headless-react/data-table

React adapter

28 exports
View source packages/ui-headless/react/src/data-table/index.ts

Body

value
DeclarationView source
Bodyts
export declare const Body: import("react").ForwardRefExoticComponent<DataTableBodyProps & import("react").RefAttributes<HTMLTableSectionElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

Caption

value
DeclarationView source
Captionts
export declare const Caption: import("react").ForwardRefExoticComponent<DataTableCaptionProps & import("react").RefAttributes<HTMLTableCaptionElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

Cell

value
DeclarationView source
Cellts
export declare const Cell: import("react").ForwardRefExoticComponent<DataTableCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

DataTable

value
DeclarationView source
DataTablets
export declare const DataTable: {
  Root: import("react").ForwardRefExoticComponent<DataTableRootProps & import("react").RefAttributes<HTMLTableElement>>;
  Caption: import("react").ForwardRefExoticComponent<DataTableCaptionProps & import("react").RefAttributes<HTMLTableCaptionElement>>;
  Header: import("react").ForwardRefExoticComponent<DataTableHeaderProps & import("react").RefAttributes<HTMLTableSectionElement>>;
  HeaderRow: import("react").ForwardRefExoticComponent<DataTableHeaderRowProps & import("react").RefAttributes<HTMLTableRowElement>>;
  HeaderCell: import("react").ForwardRefExoticComponent<DataTableHeaderCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
  SortButton: import("react").ForwardRefExoticComponent<DataTableSortButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
  Body: import("react").ForwardRefExoticComponent<DataTableBodyProps & import("react").RefAttributes<HTMLTableSectionElement>>;
  Row: import("react").ForwardRefExoticComponent<DataTableRowProps & import("react").RefAttributes<HTMLTableRowElement>>;
  Cell: import("react").ForwardRefExoticComponent<DataTableCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
};
Name
Kind
Type
Requirement
Body
property
import("react").ForwardRefExoticComponent<DataTableBodyProps & import("react").RefAttributes<HTMLTableSectionElement>>
required
Caption
property
import("react").ForwardRefExoticComponent<DataTableCaptionProps & import("react").RefAttributes<HTMLTableCaptionElement>>
required
Cell
property
import("react").ForwardRefExoticComponent<DataTableCellProps & import("react").RefAttributes<HTMLTableCellElement>>
required
Header
property
import("react").ForwardRefExoticComponent<DataTableHeaderProps & import("react").RefAttributes<HTMLTableSectionElement>>
required
HeaderCell
property
import("react").ForwardRefExoticComponent<DataTableHeaderCellProps & import("react").RefAttributes<HTMLTableCellElement>>
required
HeaderRow
property
import("react").ForwardRefExoticComponent<DataTableHeaderRowProps & import("react").RefAttributes<HTMLTableRowElement>>
required
Root
property
import("react").ForwardRefExoticComponent<DataTableRootProps & import("react").RefAttributes<HTMLTableElement>>
required
Row
property
import("react").ForwardRefExoticComponent<DataTableRowProps & import("react").RefAttributes<HTMLTableRowElement>>
required
SortButton
property
import("react").ForwardRefExoticComponent<DataTableSortButtonProps & import("react").RefAttributes<HTMLButtonElement>>
required
Name
Body
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableBodyProps & import("react").RefAttributes<HTMLTableSectionElement>>
Requirement
required
Name
Caption
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableCaptionProps & import("react").RefAttributes<HTMLTableCaptionElement>>
Requirement
required
Name
Cell
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableCellProps & import("react").RefAttributes<HTMLTableCellElement>>
Requirement
required
Name
Header
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableHeaderProps & import("react").RefAttributes<HTMLTableSectionElement>>
Requirement
required
Name
HeaderCell
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableHeaderCellProps & import("react").RefAttributes<HTMLTableCellElement>>
Requirement
required
Name
HeaderRow
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableHeaderRowProps & import("react").RefAttributes<HTMLTableRowElement>>
Requirement
required
Name
Root
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableRootProps & import("react").RefAttributes<HTMLTableElement>>
Requirement
required
Name
Row
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableRowProps & import("react").RefAttributes<HTMLTableRowElement>>
Requirement
required
Name
SortButton
Kind
property
Type
import("react").ForwardRefExoticComponent<DataTableSortButtonProps & import("react").RefAttributes<HTMLButtonElement>>
Requirement
required

DataTableBodyProps

interface
DeclarationView source
DataTableBodyPropsts
interface DataTableBodyProps extends ComponentPropsWithoutRef<"tbody"> {
  readonly asChild?: boolean;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional

DataTableCaptionProps

interface
DeclarationView source
DataTableCaptionPropsts
interface DataTableCaptionProps extends ComponentPropsWithoutRef<"caption"> {
  readonly asChild?: boolean;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional

DataTableCellProps

interface
DeclarationView source
DataTableCellPropsts
interface DataTableCellProps extends ComponentPropsWithoutRef<"td"> {
  readonly asChild?: boolean;
  readonly rowId: string;
  readonly columnKey: string;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
columnKey
property
string
required
rowId
property
string
required
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
columnKey
Kind
property
Type
string
Requirement
required
Name
rowId
Kind
property
Type
string
Requirement
required

DataTableContext

value
DeclarationView source
DataTableContextts
export declare const DataTableContext: import("react").Context<DataTableContextValue | null>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

DataTableContextValue

interface
DeclarationView source
DataTableContextValuets
interface DataTableContextValue {
  readonly service: DataTableService;
  readonly connector: DataTableApi;
  readonly scope: PartScope;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required

DataTableHeaderCellProps

interface
DeclarationView source
DataTableHeaderCellPropsts
interface DataTableHeaderCellProps extends ComponentPropsWithoutRef<"th"> {
  readonly asChild?: boolean;
  readonly columnKey: string;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
columnKey
property
string
required
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
columnKey
Kind
property
Type
string
Requirement
required

DataTableHeaderProps

interface
DeclarationView source
DataTableHeaderPropsts
interface DataTableHeaderProps extends ComponentPropsWithoutRef<"thead"> {
  readonly asChild?: boolean;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional

DataTableHeaderRowProps

interface
DeclarationView source
DataTableHeaderRowPropsts
interface DataTableHeaderRowProps extends ComponentPropsWithoutRef<"tr"> {
  readonly asChild?: boolean;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional

DataTableRootProps

interface
DeclarationView source
DataTableRootPropsts
interface DataTableRootProps extends Omit<ComponentPropsWithoutRef<"table">, "onChange"> {
  readonly asChild?: boolean;
  readonly defaultSort?: DataTableInput["defaultSort"];
  readonly selectionMode?: DataTableInput["selectionMode"];
  readonly selectedIds?: DataTableInput["selectedIds"];
  readonly defaultSelectedIds?: DataTableInput["defaultSelectedIds"];
  readonly orderedIds?: DataTableInput["orderedIds"];
  readonly disabledIds?: DataTableInput["disabledIds"];
  readonly columnKeys: DataTableConnectOptions["columnKeys"];
  readonly sortableKeys?: DataTableConnectOptions["sortableKeys"];
  readonly caption?: DataTableConnectOptions["caption"];
  readonly zebra?: DataTableConnectOptions["zebra"];
  readonly selectableIds?: DataTableConnectOptions["selectableIds"];
  readonly onSelectedIdsChange?: (detail: SelectionChangeDetail) => void;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
caption
property
DataTableConnectOptions["caption"]
optional
children
property
ReactNode
optional
columnKeys
property
DataTableConnectOptions["columnKeys"]
required
defaultSelectedIds
property
DataTableInput["defaultSelectedIds"]
optional
defaultSort
property
DataTableInput["defaultSort"]
optional
disabledIds
property
DataTableInput["disabledIds"]
optional
onSelectedIdsChange
property
(detail: SelectionChangeDetail) => void
optional
orderedIds
property
DataTableInput["orderedIds"]
optional
selectableIds
property
DataTableConnectOptions["selectableIds"]
optional
selectedIds
property
DataTableInput["selectedIds"]
optional
selectionMode
property
DataTableInput["selectionMode"]
optional
sortableKeys
property
DataTableConnectOptions["sortableKeys"]
optional
zebra
property
DataTableConnectOptions["zebra"]
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
caption
Kind
property
Type
DataTableConnectOptions["caption"]
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
columnKeys
Kind
property
Type
DataTableConnectOptions["columnKeys"]
Requirement
required
Name
defaultSelectedIds
Kind
property
Type
DataTableInput["defaultSelectedIds"]
Requirement
optional
Name
defaultSort
Kind
property
Type
DataTableInput["defaultSort"]
Requirement
optional
Name
disabledIds
Kind
property
Type
DataTableInput["disabledIds"]
Requirement
optional
Name
onSelectedIdsChange
Kind
property
Type
(detail: SelectionChangeDetail) => void
Requirement
optional
Name
orderedIds
Kind
property
Type
DataTableInput["orderedIds"]
Requirement
optional
Name
selectableIds
Kind
property
Type
DataTableConnectOptions["selectableIds"]
Requirement
optional
Name
selectedIds
Kind
property
Type
DataTableInput["selectedIds"]
Requirement
optional
Name
selectionMode
Kind
property
Type
DataTableInput["selectionMode"]
Requirement
optional
Name
sortableKeys
Kind
property
Type
DataTableConnectOptions["sortableKeys"]
Requirement
optional
Name
zebra
Kind
property
Type
DataTableConnectOptions["zebra"]
Requirement
optional

DataTableRowProps

interface
DeclarationView source
DataTableRowPropsts
interface DataTableRowProps extends ComponentPropsWithoutRef<"tr"> {
  readonly asChild?: boolean;
  readonly rowId: string;
  readonly visualIndex?: number;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
rowId
property
string
required
visualIndex
property
number
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
rowId
Kind
property
Type
string
Requirement
required
Name
visualIndex
Kind
property
Type
number
Requirement
optional

DataTableSortButtonProps

interface
DeclarationView source
DataTableSortButtonPropsts
interface DataTableSortButtonProps extends Omit<ComponentPropsWithoutRef<"button">, "type"> {
  readonly asChild?: boolean;
  readonly columnKey: string;
  readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
columnKey
property
string
required
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
columnKey
Kind
property
Type
string
Requirement
required

Header

value
DeclarationView source
Headerts
export declare const Header: import("react").ForwardRefExoticComponent<DataTableHeaderProps & import("react").RefAttributes<HTMLTableSectionElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

HeaderCell

value
DeclarationView source
HeaderCellts
export declare const HeaderCell: import("react").ForwardRefExoticComponent<DataTableHeaderCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

HeaderRow

value
DeclarationView source
HeaderRowts
export declare const HeaderRow: import("react").ForwardRefExoticComponent<DataTableHeaderRowProps & import("react").RefAttributes<HTMLTableRowElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

projectDataTableRowIds

function
DeclarationView source
projectDataTableRowIdsts
declare function projectDataTableRowIds<T>(rows: readonly T[], options: {
  readonly selectionMode?: SelectionMode;
  readonly getRowId?: (row: T, index: number) => string;
  readonly isRowDisabled?: (row: T, index: number) => boolean;
}): DataTableRowIdProjection;
Name
Kind
Type
Requirement
rows
parameter
readonly T[]
required
options
parameter
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
required
return
return value
DataTableRowIdProjection
n/a
Name
rows
Kind
parameter
Type
readonly T[]
Requirement
required
Name
options
Kind
parameter
Type
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
Requirement
required
Name
return
Kind
return value
Type
DataTableRowIdProjection
Requirement
n/a

Root

value
DeclarationView source
Rootts
export declare const Root: import("react").ForwardRefExoticComponent<DataTableRootProps & import("react").RefAttributes<HTMLTableElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

Row

value
DeclarationView source
Rowts
export declare const Row: import("react").ForwardRefExoticComponent<DataTableRowProps & import("react").RefAttributes<HTMLTableRowElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

SelectionChangeDetail

type
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
  readonly selectedIds: SelectionValue;
  readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

SelectionMode

type
DeclarationView source
SelectionModets
type SelectionMode = "none" | "single" | "multiple";

SortButton

value
DeclarationView source
SortButtonts
export declare const SortButton: import("react").ForwardRefExoticComponent<DataTableSortButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

useDataTable

function
DeclarationView source
useDataTablets
declare function useDataTable(input: DataTableInput, options: UseDataTableOptions): UseDataTableResult;
Name
Kind
Type
Requirement
input
parameter
DataTableInput
required
options
parameter
UseDataTableOptions
required
return
return value
UseDataTableResult
n/a
Name
input
Kind
parameter
Type
DataTableInput
Requirement
required
Name
options
Kind
parameter
Type
UseDataTableOptions
Requirement
required
Name
return
Kind
return value
Type
UseDataTableResult
Requirement
n/a

useDataTableContext

function
DeclarationView source
useDataTableContextts
declare function useDataTableContext(partName: string): DataTableContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
DataTableContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
DataTableContextValue
Requirement
n/a

UseDataTableOptions

interface
DeclarationView source
UseDataTableOptionsts
interface UseDataTableOptions extends DataTableConnectOptions {}

UseDataTableResult

interface
DeclarationView source
UseDataTableResultts
interface UseDataTableResult {
  readonly service: DataTableService;
  readonly connector: DataTableApi;
  readonly scope: PartScope;
  readonly snapshot: DataTableSnapshot;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
snapshot
property
DataTableSnapshot
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
snapshot
Kind
property
Type
DataTableSnapshot
Requirement
required

@grassroot/ui-headless-vue/data-table

Vue adapter

18 exports
View source packages/ui-headless/vue/src/data-table/index.ts

DataTableBody

value
DeclarationView source
DataTableBodyts
export declare const DataTableBody: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableCaption

value
DeclarationView source
DataTableCaptionts
export declare const DataTableCaption: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableCell

value
DeclarationView source
DataTableCellts
export declare const DataTableCell: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  rowId: {
    type: StringConstructor;
    required: true;
  };
  columnKey: {
    type: StringConstructor;
    required: true;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  rowId: {
    type: StringConstructor;
    required: true;
  };
  columnKey: {
    type: StringConstructor;
    required: true;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableContextKey

value
DeclarationView source
DataTableContextKeyts
export declare const DataTableContextKey: InjectionKey<DataTableContextValue>;

DataTableContextValue

interface
DeclarationView source
DataTableContextValuets
interface DataTableContextValue {
  readonly service: DataTableService;
  readonly connector: DataTableApi;
  readonly scope: PartScope;
  readonly snapshot: ShallowRef<DataTableSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
snapshot
property
ShallowRef<DataTableSnapshot>
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
snapshot
Kind
property
Type
ShallowRef<DataTableSnapshot>
Requirement
required

DataTableHeader

value
DeclarationView source
DataTableHeaderts
export declare const DataTableHeader: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableHeaderCell

value
DeclarationView source
DataTableHeaderCellts
export declare const DataTableHeaderCell: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  columnKey: {
    type: StringConstructor;
    required: true;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  columnKey: {
    type: StringConstructor;
    required: true;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableHeaderRow

value
DeclarationView source
DataTableHeaderRowts
export declare const DataTableHeaderRow: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableRoot

value
DeclarationView source
DataTableRootts
export declare const DataTableRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  defaultSort: {
    type: PropType<DataTableInput["defaultSort"]>;
    default: undefined;
  };
  selectionMode: {
    type: PropType<DataTableInput["selectionMode"]>;
    default: undefined;
  };
  selectedIds: {
    type: PropType<DataTableInput["selectedIds"]>;
    default: undefined;
  };
  defaultSelectedIds: {
    type: PropType<DataTableInput["defaultSelectedIds"]>;
    default: undefined;
  };
  orderedIds: {
    type: PropType<DataTableInput["orderedIds"]>;
    default: undefined;
  };
  disabledIds: {
    type: PropType<DataTableInput["disabledIds"]>;
    default: undefined;
  };
  columnKeys: {
    type: PropType<DataTableConnectOptions["columnKeys"]>;
    required: true;
  };
  sortableKeys: {
    type: PropType<DataTableConnectOptions["sortableKeys"]>;
    default: undefined;
  };
  caption: {
    type: PropType<string | undefined>;
    default: undefined;
  };
  zebra: {
    type: PropType<boolean | undefined>;
    default: undefined;
  };
  selectableIds: {
    type: PropType<DataTableConnectOptions["selectableIds"]>;
    default: undefined;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
  selectedIdsChange: (_detail: SelectionChangeDetail) => true;
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  defaultSort: {
    type: PropType<DataTableInput["defaultSort"]>;
    default: undefined;
  };
  selectionMode: {
    type: PropType<DataTableInput["selectionMode"]>;
    default: undefined;
  };
  selectedIds: {
    type: PropType<DataTableInput["selectedIds"]>;
    default: undefined;
  };
  defaultSelectedIds: {
    type: PropType<DataTableInput["defaultSelectedIds"]>;
    default: undefined;
  };
  orderedIds: {
    type: PropType<DataTableInput["orderedIds"]>;
    default: undefined;
  };
  disabledIds: {
    type: PropType<DataTableInput["disabledIds"]>;
    default: undefined;
  };
  columnKeys: {
    type: PropType<DataTableConnectOptions["columnKeys"]>;
    required: true;
  };
  sortableKeys: {
    type: PropType<DataTableConnectOptions["sortableKeys"]>;
    default: undefined;
  };
  caption: {
    type: PropType<string | undefined>;
    default: undefined;
  };
  zebra: {
    type: PropType<boolean | undefined>;
    default: undefined;
  };
  selectableIds: {
    type: PropType<DataTableConnectOptions["selectableIds"]>;
    default: undefined;
  };
}>> & Readonly<{
  onSelectedIdsChange?: ((_detail: SelectionChangeDetail) => any) | undefined;
}>, {
  asChild: boolean;
  defaultSort: string | null | undefined;
  selectionMode: import("@grassroot/ui-machines/selection").SelectionMode | undefined;
  selectedIds: import("@grassroot/ui-machines/selection").SelectionValue | undefined;
  defaultSelectedIds: import("@grassroot/ui-machines/selection").SelectionValue | undefined;
  orderedIds: readonly string[] | undefined;
  disabledIds: readonly string[] | undefined;
  sortableKeys: readonly string[] | undefined;
  caption: string | undefined;
  zebra: boolean | undefined;
  selectableIds: import("@grassroot/ui-machines/selection").SelectionValue | undefined;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableRow

value
DeclarationView source
DataTableRowts
export declare const DataTableRow: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  rowId: {
    type: StringConstructor;
    required: true;
  };
  visualIndex: {
    type: NumberConstructor;
    default: undefined;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  rowId: {
    type: StringConstructor;
    required: true;
  };
  visualIndex: {
    type: NumberConstructor;
    default: undefined;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
  visualIndex: number;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

DataTableSortButton

value
DeclarationView source
DataTableSortButtonts
export declare const DataTableSortButton: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  columnKey: {
    type: StringConstructor;
    required: true;
  };
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
  [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
  asChild: {
    type: BooleanConstructor;
    default: boolean;
  };
  columnKey: {
    type: StringConstructor;
    required: true;
  };
}>> & Readonly<{}>, {
  asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

projectDataTableRowIds

function
DeclarationView source
projectDataTableRowIdsts
declare function projectDataTableRowIds<T>(rows: readonly T[], options: {
  readonly selectionMode?: SelectionMode;
  readonly getRowId?: (row: T, index: number) => string;
  readonly isRowDisabled?: (row: T, index: number) => boolean;
}): DataTableRowIdProjection;
Name
Kind
Type
Requirement
rows
parameter
readonly T[]
required
options
parameter
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
required
return
return value
DataTableRowIdProjection
n/a
Name
rows
Kind
parameter
Type
readonly T[]
Requirement
required
Name
options
Kind
parameter
Type
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
Requirement
required
Name
return
Kind
return value
Type
DataTableRowIdProjection
Requirement
n/a

SelectionChangeDetail

type
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
  readonly selectedIds: SelectionValue;
  readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

SelectionMode

type
DeclarationView source
SelectionModets
type SelectionMode = "none" | "single" | "multiple";

useDataTable

function
DeclarationView source
useDataTablets
declare function useDataTable(input: DataTableInput | (() => DataTableInput), options: UseDataTableOptions): UseDataTableResult;
Name
Kind
Type
Requirement
input
parameter
DataTableInput | (() => DataTableInput)
required
options
parameter
UseDataTableOptions
required
return
return value
UseDataTableResult
n/a
Name
input
Kind
parameter
Type
DataTableInput | (() => DataTableInput)
Requirement
required
Name
options
Kind
parameter
Type
UseDataTableOptions
Requirement
required
Name
return
Kind
return value
Type
UseDataTableResult
Requirement
n/a

useDataTableContext

function
DeclarationView source
useDataTableContextts
declare function useDataTableContext(partName: string): DataTableContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
DataTableContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
DataTableContextValue
Requirement
n/a

UseDataTableOptions

interface
DeclarationView source
UseDataTableOptionsts
interface UseDataTableOptions extends DataTableConnectOptions {}

UseDataTableResult

interface
DeclarationView source
UseDataTableResultts
interface UseDataTableResult {
  readonly service: DataTableService;
  readonly connector: DataTableApi;
  readonly scope: PartScope;
  readonly snapshot: ShallowRef<DataTableSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
snapshot
property
ShallowRef<DataTableSnapshot>
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
snapshot
Kind
property
Type
ShallowRef<DataTableSnapshot>
Requirement
required

@grassroot/ui-headless-angular/data-table

Angular adapter

21 exports
View source packages/ui-headless/angular/src/data-table/index.ts

applyProps

function

Applies a connector prop bag to a persistent Angular DOM element.

DeclarationView source
applyPropsts
export declare function applyProps(el: Element, props: PartProps, listeners: Map<string, EventListener>): void;
Name
Kind
Type
Requirement
el
parameter
Element
required
props
parameter
PartProps
required
listeners
parameter
Map<string, EventListener>
required
return
return value
void
n/a
Name
el
Kind
parameter
Type
Element
Requirement
required
Name
props
Kind
parameter
Type
PartProps
Requirement
required
Name
listeners
Kind
parameter
Type
Map<string, EventListener>
Requirement
required
Name
return
Kind
return value
Type
void
Requirement
n/a

createDataTableStore

function
DeclarationView source
createDataTableStorets
export declare function createDataTableStore(initialInput?: DataTableInput, options?: CreateDataTableStoreOptions): DataTableStore;
Name
Kind
Type
Requirement
initialInput
parameter
DataTableInput
optional
options
parameter
CreateDataTableStoreOptions
optional
return
return value
DataTableStore
n/a
Name
initialInput
Kind
parameter
Type
DataTableInput
Requirement
optional
Name
options
Kind
parameter
Type
CreateDataTableStoreOptions
Requirement
optional
Name
return
Kind
return value
Type
DataTableStore
Requirement
n/a

CreateDataTableStoreOptions

interface
DeclarationView source
CreateDataTableStoreOptionsts
export interface CreateDataTableStoreOptions extends UseDataTableOptions {
    readonly onCommit?: () => void;
}
Name
Kind
Type
Requirement
onCommit
property
() => void
optional
Name
onCommit
Kind
property
Type
() => void
Requirement
optional

createReentrantSafeTick

function

One re-entrancy policy for every Angular store's zoneless commit nudge.

DeclarationView source
createReentrantSafeTickts
export declare function createReentrantSafeTick(appRef: ApplicationRef): () => void;
Name
Kind
Type
Requirement
appRef
parameter
ApplicationRef
required
return
return value
() => void
n/a
Name
appRef
Kind
parameter
Type
ApplicationRef
Requirement
required
Name
return
Kind
return value
Type
() => void
Requirement
n/a

DATA_TABLE_STORE

value
DeclarationView source
DATA_TABLE_STOREts
export declare const DATA_TABLE_STORE: InjectionToken<DataTableStore>;

DataTableStore

interface
DeclarationView source
DataTableStorets
export interface DataTableStore {
    readonly service: DataTableService;
    readonly connector: DataTableApi;
    readonly scope: PartScope;
    readonly version: WritableSignal<number>;
    start(): void;
    stop(): void;
    sync(input: DataTableInput): void;
    bindSelectedIdsChange(handler: (detail: SelectionChangeDetail) => void): void;
    syncConnectOptions(next: DataTableConnectOptions): void;
}
Name
Kind
Type
Requirement
bindSelectedIdsChange
method
(handler: (detail: SelectionChangeDetail) => void) => void
required
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
start
method
() => void
required
stop
method
() => void
required
sync
method
(input: DataTableInput) => void
required
syncConnectOptions
method
(next: DataTableConnectOptions) => void
required
version
property
WritableSignal<number>
required
Name
bindSelectedIdsChange
Kind
method
Type
(handler: (detail: SelectionChangeDetail) => void) => void
Requirement
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
start
Kind
method
Type
() => void
Requirement
required
Name
stop
Kind
method
Type
() => void
Requirement
required
Name
sync
Kind
method
Type
(input: DataTableInput) => void
Requirement
required
Name
syncConnectOptions
Kind
method
Type
(next: DataTableConnectOptions) => void
Requirement
required
Name
version
Kind
property
Type
WritableSignal<number>
Requirement
required

GR_DATA_TABLE_DECLARATIONS

value
DeclarationView source
GR_DATA_TABLE_DECLARATIONSts
export declare const GR_DATA_TABLE_DECLARATIONS: readonly [typeof GrDataTableRoot, typeof GrDataTableCaption, typeof GrDataTableHeader, typeof GrDataTableHeaderRow, typeof GrDataTableHeaderCell, typeof GrDataTableSortButton, typeof GrDataTableBody, typeof GrDataTableRow, typeof GrDataTableCell];

GrDataTableBody

class
DeclarationView source
GrDataTableBodyts
export declare class GrDataTableBody implements OnDestroy {
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableBody, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableBody, "[grDataTableBody]", never, {}, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableBody, "[grDataTableBody]", never, {}, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableBody, never>
required
store
property
any
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableBody, "[grDataTableBody]", never, {}, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableBody, never>
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrDataTableCaption

class
DeclarationView source
GrDataTableCaptionts
export declare class GrDataTableCaption implements OnDestroy {
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableCaption, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableCaption, "[grDataTableCaption]", never, {}, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableCaption, "[grDataTableCaption]", never, {}, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableCaption, never>
required
store
property
any
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableCaption, "[grDataTableCaption]", never, {}, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableCaption, never>
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrDataTableCell

class
DeclarationView source
GrDataTableCellts
export declare class GrDataTableCell implements OnDestroy {
    readonly rowId: import("@angular/core").InputSignal<string>;
    readonly columnKey: import("@angular/core").InputSignal<string>;
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    private registered;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableCell, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableCell, "[grDataTableCell]", never, { "rowId": { "alias": "rowId"; "required": true; "isSignal": true; }; "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
columnKey
property
import("@angular/core").InputSignal<string>
required
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableCell, "[grDataTableCell]", never, { "rowId": { "alias": "rowId"; "required": true; "isSignal": true; }; "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableCell, never>
required
registered
property
any
required
rowId
property
import("@angular/core").InputSignal<string>
required
store
property
any
required
Name
columnKey
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableCell, "[grDataTableCell]", never, { "rowId": { "alias": "rowId"; "required": true; "isSignal": true; }; "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableCell, never>
Requirement
required
Name
registered
Kind
property
Type
any
Requirement
required
Name
rowId
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrDataTableHeader

class
DeclarationView source
GrDataTableHeaderts
export declare class GrDataTableHeader implements OnDestroy {
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableHeader, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableHeader, "[grDataTableHeader]", never, {}, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableHeader, "[grDataTableHeader]", never, {}, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableHeader, never>
required
store
property
any
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableHeader, "[grDataTableHeader]", never, {}, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableHeader, never>
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrDataTableHeaderCell

class
DeclarationView source
GrDataTableHeaderCellts
export declare class GrDataTableHeaderCell implements OnDestroy {
    readonly columnKey: import("@angular/core").InputSignal<string>;
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    private registered;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableHeaderCell, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableHeaderCell, "[grDataTableHeaderCell]", never, { "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
columnKey
property
import("@angular/core").InputSignal<string>
required
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableHeaderCell, "[grDataTableHeaderCell]", never, { "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableHeaderCell, never>
required
registered
property
any
required
store
property
any
required
Name
columnKey
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableHeaderCell, "[grDataTableHeaderCell]", never, { "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableHeaderCell, never>
Requirement
required
Name
registered
Kind
property
Type
any
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrDataTableHeaderRow

class
DeclarationView source
GrDataTableHeaderRowts
export declare class GrDataTableHeaderRow implements OnDestroy {
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableHeaderRow, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableHeaderRow, "[grDataTableHeaderRow]", never, {}, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableHeaderRow, "[grDataTableHeaderRow]", never, {}, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableHeaderRow, never>
required
store
property
any
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableHeaderRow, "[grDataTableHeaderRow]", never, {}, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableHeaderRow, never>
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrDataTableRoot

class
DeclarationView source
GrDataTableRootts
export declare class GrDataTableRoot implements OnInit, OnDestroy {
    readonly defaultSort: import("@angular/core").InputSignal<string | null | undefined>;
    readonly selectionMode: import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionMode | undefined>;
    readonly selectedIds: import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>;
    readonly defaultSelectedIds: import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>;
    readonly orderedIds: import("@angular/core").InputSignal<readonly string[] | undefined>;
    readonly disabledIds: import("@angular/core").InputSignal<readonly string[] | undefined>;
    readonly columnKeys: import("@angular/core").InputSignal<readonly string[]>;
    readonly sortableKeys: import("@angular/core").InputSignal<readonly string[] | undefined>;
    readonly caption: import("@angular/core").InputSignal<string | undefined>;
    readonly zebra: import("@angular/core").InputSignal<boolean | undefined>;
    readonly selectableIds: import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>;
    readonly selectedIdsChange: import("@angular/core").OutputEmitterRef<SelectionChangeDetail>;
    private readonly elementRef;
    private readonly listeners;
    private lastSynced;
    readonly store: DataTableStore;
    constructor();
    ngOnInit(): void;
    ngOnDestroy(): void;
    private readInput;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableRoot, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<GrDataTableRoot, "table[grDataTableRoot]", never, { "defaultSort": { "alias": "defaultSort"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "defaultSelectedIds": { "alias": "defaultSelectedIds"; "required": false; "isSignal": true; }; "orderedIds": { "alias": "orderedIds"; "required": false; "isSignal": true; }; "disabledIds": { "alias": "disabledIds"; "required": false; "isSignal": true; }; "columnKeys": { "alias": "columnKeys"; "required": true; "isSignal": true; }; "sortableKeys": { "alias": "sortableKeys"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "zebra": { "alias": "zebra"; "required": false; "isSignal": true; }; "selectableIds": { "alias": "selectableIds"; "required": false; "isSignal": true; }; }, { "selectedIdsChange": "selectedIdsChange"; }, never, ["*"], true, never>;
}
Name
Kind
Type
Requirement
caption
property
import("@angular/core").InputSignal<string | undefined>
required
columnKeys
property
import("@angular/core").InputSignal<readonly string[]>
required
defaultSelectedIds
property
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>
required
defaultSort
property
import("@angular/core").InputSignal<string | null | undefined>
required
disabledIds
property
import("@angular/core").InputSignal<readonly string[] | undefined>
required
elementRef
property
any
required
lastSynced
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ngOnInit
method
() => void
required
orderedIds
property
import("@angular/core").InputSignal<readonly string[] | undefined>
required
ɵcmp
property
i0.ɵɵComponentDeclaration<GrDataTableRoot, "table[grDataTableRoot]", never, { "defaultSort": { "alias": "defaultSort"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "defaultSelectedIds": { "alias": "defaultSelectedIds"; "required": false; "isSignal": true; }; "orderedIds": { "alias": "orderedIds"; "required": false; "isSignal": true; }; "disabledIds": { "alias": "disabledIds"; "required": false; "isSignal": true; }; "columnKeys": { "alias": "columnKeys"; "required": true; "isSignal": true; }; "sortableKeys": { "alias": "sortableKeys"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "zebra": { "alias": "zebra"; "required": false; "isSignal": true; }; "selectableIds": { "alias": "selectableIds"; "required": false; "isSignal": true; }; }, { "selectedIdsChange": "selectedIdsChange"; }, never, ["*"], true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableRoot, never>
required
readInput
property
any
required
Name
caption
Kind
property
Type
import("@angular/core").InputSignal<string | undefined>
Requirement
required
Name
columnKeys
Kind
property
Type
import("@angular/core").InputSignal<readonly string[]>
Requirement
required
Name
defaultSelectedIds
Kind
property
Type
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>
Requirement
required
Name
defaultSort
Kind
property
Type
import("@angular/core").InputSignal<string | null | undefined>
Requirement
required
Name
disabledIds
Kind
property
Type
import("@angular/core").InputSignal<readonly string[] | undefined>
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
lastSynced
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ngOnInit
Kind
method
Type
() => void
Requirement
required
Name
orderedIds
Kind
property
Type
import("@angular/core").InputSignal<readonly string[] | undefined>
Requirement
required
Name
ɵcmp
Kind
property
Type
i0.ɵɵComponentDeclaration<GrDataTableRoot, "table[grDataTableRoot]", never, { "defaultSort": { "alias": "defaultSort"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "defaultSelectedIds": { "alias": "defaultSelectedIds"; "required": false; "isSignal": true; }; "orderedIds": { "alias": "orderedIds"; "required": false; "isSignal": true; }; "disabledIds": { "alias": "disabledIds"; "required": false; "isSignal": true; }; "columnKeys": { "alias": "columnKeys"; "required": true; "isSignal": true; }; "sortableKeys": { "alias": "sortableKeys"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "zebra": { "alias": "zebra"; "required": false; "isSignal": true; }; "selectableIds": { "alias": "selectableIds"; "required": false; "isSignal": true; }; }, { "selectedIdsChange": "selectedIdsChange"; }, never, ["*"], true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableRoot, never>
Requirement
required
Name
readInput
Kind
property
Type
any
Requirement
required
Name
selectableIds
Kind
property
Type
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>
Requirement
required
Name
selectedIds
Kind
property
Type
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>
Requirement
required
Name
selectedIdsChange
Kind
property
Type
import("@angular/core").OutputEmitterRef<SelectionChangeDetail>
Requirement
required
Name
selectionMode
Kind
property
Type
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionMode | undefined>
Requirement
required
Name
sortableKeys
Kind
property
Type
import("@angular/core").InputSignal<readonly string[] | undefined>
Requirement
required
Name
store
Kind
property
Type
DataTableStore
Requirement
required
Name
zebra
Kind
property
Type
import("@angular/core").InputSignal<boolean | undefined>
Requirement
required

GrDataTableRow

class
DeclarationView source
GrDataTableRowts
export declare class GrDataTableRow implements OnDestroy {
    readonly rowId: import("@angular/core").InputSignal<string>;
    readonly visualIndex: import("@angular/core").InputSignal<number | undefined>;
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    private registered;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableRow, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableRow, "[grDataTableRow]", never, { "rowId": { "alias": "rowId"; "required": true; "isSignal": true; }; "visualIndex": { "alias": "visualIndex"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableRow, "[grDataTableRow]", never, { "rowId": { "alias": "rowId"; "required": true; "isSignal": true; }; "visualIndex": { "alias": "visualIndex"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableRow, never>
required
registered
property
any
required
rowId
property
import("@angular/core").InputSignal<string>
required
store
property
any
required
visualIndex
property
import("@angular/core").InputSignal<number | undefined>
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableRow, "[grDataTableRow]", never, { "rowId": { "alias": "rowId"; "required": true; "isSignal": true; }; "visualIndex": { "alias": "visualIndex"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableRow, never>
Requirement
required
Name
registered
Kind
property
Type
any
Requirement
required
Name
rowId
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required
Name
visualIndex
Kind
property
Type
import("@angular/core").InputSignal<number | undefined>
Requirement
required

GrDataTableSortButton

class
DeclarationView source
GrDataTableSortButtonts
export declare class GrDataTableSortButton implements OnDestroy {
    readonly columnKey: import("@angular/core").InputSignal<string>;
    private readonly store;
    private readonly elementRef;
    private readonly listeners;
    private readonly consumerProps;
    private registered;
    constructor();
    ngOnDestroy(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<GrDataTableSortButton, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<GrDataTableSortButton, "[grDataTableSortButton]", never, { "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
columnKey
property
import("@angular/core").InputSignal<string>
required
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrDataTableSortButton, "[grDataTableSortButton]", never, { "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrDataTableSortButton, never>
required
registered
property
any
required
store
property
any
required
Name
columnKey
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrDataTableSortButton, "[grDataTableSortButton]", never, { "columnKey": { "alias": "columnKey"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrDataTableSortButton, never>
Requirement
required
Name
registered
Kind
property
Type
any
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

projectDataTableRowIds

function
DeclarationView source
projectDataTableRowIdsts
declare function projectDataTableRowIds<T>(rows: readonly T[], options: {
  readonly selectionMode?: SelectionMode;
  readonly getRowId?: (row: T, index: number) => string;
  readonly isRowDisabled?: (row: T, index: number) => boolean;
}): DataTableRowIdProjection;
Name
Kind
Type
Requirement
rows
parameter
readonly T[]
required
options
parameter
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
required
return
return value
DataTableRowIdProjection
n/a
Name
rows
Kind
parameter
Type
readonly T[]
Requirement
required
Name
options
Kind
parameter
Type
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
Requirement
required
Name
return
Kind
return value
Type
DataTableRowIdProjection
Requirement
n/a

provideDataTableStore

function
DeclarationView source
provideDataTableStorets
export declare function provideDataTableStore(): Provider;
Name
Kind
Type
Requirement
return
return value
Provider
n/a
Name
return
Kind
return value
Type
Provider
Requirement
n/a

SelectionChangeDetail

type
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
  readonly selectedIds: SelectionValue;
  readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

SelectionMode

type
DeclarationView source
SelectionModets
type SelectionMode = "none" | "single" | "multiple";

UseDataTableOptions

interface
DeclarationView source
UseDataTableOptionsts
export interface UseDataTableOptions extends DataTableConnectOptions {
}

@grassroot/ui-headless-svelte/data-table

Svelte adapter

19 exports
View source packages/ui-headless/svelte/src/data-table/index.ts

createDataTable

function
DeclarationView source
createDataTablets
export declare function createDataTable(inputGetter: () => DataTableInput, options: UseDataTableOptions): UseDataTableResult;
Name
Kind
Type
Requirement
inputGetter
parameter
() => DataTableInput
required
options
parameter
UseDataTableOptions
required
return
return value
UseDataTableResult
n/a
Name
inputGetter
Kind
parameter
Type
() => DataTableInput
Requirement
required
Name
options
Kind
parameter
Type
UseDataTableOptions
Requirement
required
Name
return
Kind
return value
Type
UseDataTableResult
Requirement
n/a

DataTableBody

value
DeclarationView source
DataTableBodyts
export declare const DataTableBody: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableCaption

value
DeclarationView source
DataTableCaptionts
export declare const DataTableCaption: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableCell

value
DeclarationView source
DataTableCellts
export declare const DataTableCell: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableContextValue

interface
DeclarationView source
DataTableContextValuets
export interface DataTableContextValue {
    readonly service: DataTableService;
    readonly connector: DataTableApi;
    readonly scope: PartScope;
    readonly version: () => number;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
version
property
() => number
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
version
Kind
property
Type
() => number
Requirement
required

DataTableHeader

value
DeclarationView source
DataTableHeaderts
export declare const DataTableHeader: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableHeaderCell

value
DeclarationView source
DataTableHeaderCellts
export declare const DataTableHeaderCell: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableHeaderRow

value
DeclarationView source
DataTableHeaderRowts
export declare const DataTableHeaderRow: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableRoot

value
DeclarationView source
DataTableRootts
export declare const DataTableRoot: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableRow

value
DeclarationView source
DataTableRowts
export declare const DataTableRow: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

DataTableSortButton

value
DeclarationView source
DataTableSortButtonts
export declare const DataTableSortButton: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

projectDataTableRowIds

function
DeclarationView source
projectDataTableRowIdsts
declare function projectDataTableRowIds<T>(rows: readonly T[], options: {
  readonly selectionMode?: SelectionMode;
  readonly getRowId?: (row: T, index: number) => string;
  readonly isRowDisabled?: (row: T, index: number) => boolean;
}): DataTableRowIdProjection;
Name
Kind
Type
Requirement
rows
parameter
readonly T[]
required
options
parameter
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
required
return
return value
DataTableRowIdProjection
n/a
Name
rows
Kind
parameter
Type
readonly T[]
Requirement
required
Name
options
Kind
parameter
Type
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
Requirement
required
Name
return
Kind
return value
Type
DataTableRowIdProjection
Requirement
n/a

SelectionChangeDetail

type
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
  readonly selectedIds: SelectionValue;
  readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

SelectionMode

type
DeclarationView source
SelectionModets
type SelectionMode = "none" | "single" | "multiple";

splitProps

function

Split the core prop bag, then apply Svelte-specific style/event handling.

DeclarationView source
splitPropsts
export declare function splitProps(props: PartProps): SplitProps;
Name
Kind
Type
Requirement
props
parameter
PartProps
required
return
return value
SplitProps
n/a
Name
props
Kind
parameter
Type
PartProps
Requirement
required
Name
return
Kind
return value
Type
SplitProps
Requirement
n/a

useDataTableContext

function
DeclarationView source
useDataTableContextts
export declare function useDataTableContext(partName: string): DataTableContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
DataTableContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
DataTableContextValue
Requirement
n/a

UseDataTableOptions

interface
DeclarationView source
UseDataTableOptionsts
export interface UseDataTableOptions extends DataTableConnectOptions {
}

UseDataTableResult

interface
DeclarationView source
UseDataTableResultts
export interface UseDataTableResult {
    readonly service: DataTableService;
    readonly connector: DataTableApi;
    readonly scope: PartScope;
    readonly version: () => number;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
version
property
() => number
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
version
Kind
property
Type
() => number
Requirement
required

wireEvents

function
DeclarationView source
wireEventsts
export declare function wireEvents(node: Element, params: {
    events: Record<string, EventListener>;
    ref?: (node: Element | null) => void;
}): {
    update(next: typeof params): void;
    destroy(): void;
};
Name
Kind
Type
Requirement
node
parameter
Element
required
params
parameter
{ events: Record<string, EventListener>; ref?: (node: Element | null) => void; }
required
return
return value
{ update(next: typeof params): void; destroy(): void; }
n/a
Name
node
Kind
parameter
Type
Element
Requirement
required
Name
params
Kind
parameter
Type
{ events: Record<string, EventListener>; ref?: (node: Element | null) => void; }
Requirement
required
Name
return
Kind
return value
Type
{ update(next: typeof params): void; destroy(): void; }
Requirement
n/a

@grassroot/ui-headless-solid/data-table

Solid adapter

27 exports
View source packages/ui-headless/solid/src/data-table/index.ts

DataTableBody

function
DeclarationView source
DataTableBodyts
export declare function DataTableBody(props: DataTableBodyProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableBodyProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableBodyProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableBodyProps

interface
DeclarationView source
DataTableBodyPropsts
export interface DataTableBodyProps extends JSX.HTMLAttributes<HTMLTableSectionElement> {
    readonly as?: AsProp;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional

DataTableCaption

function
DeclarationView source
DataTableCaptionts
export declare function DataTableCaption(props: DataTableCaptionProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableCaptionProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableCaptionProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableCaptionProps

interface
DeclarationView source
DataTableCaptionPropsts
export interface DataTableCaptionProps extends JSX.HTMLAttributes<HTMLTableCaptionElement> {
    readonly as?: AsProp;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional

DataTableCell

function
DeclarationView source
DataTableCellts
export declare function DataTableCell(props: DataTableCellProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableCellProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableCellProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableCellProps

interface
DeclarationView source
DataTableCellPropsts
export interface DataTableCellProps extends JSX.TdHTMLAttributes<HTMLTableCellElement> {
    readonly as?: AsProp;
    readonly rowId: string;
    readonly columnKey: string;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
columnKey
property
string
required
rowId
property
string
required
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
columnKey
Kind
property
Type
string
Requirement
required
Name
rowId
Kind
property
Type
string
Requirement
required

DataTableContext

value
DeclarationView source
DataTableContextts
export declare const DataTableContext: import("solid-js").Context<DataTableContextValue | undefined>;

DataTableContextValue

interface
DeclarationView source
DataTableContextValuets
export interface DataTableContextValue {
    readonly service: DataTableService;
    readonly connector: DataTableApi;
    readonly scope: PartScope;
    readonly snapshot: Accessor<DataTableSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
snapshot
property
Accessor<DataTableSnapshot>
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
snapshot
Kind
property
Type
Accessor<DataTableSnapshot>
Requirement
required

DataTableHeader

function
DeclarationView source
DataTableHeaderts
export declare function DataTableHeader(props: DataTableHeaderProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableHeaderProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableHeaderProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableHeaderCell

function
DeclarationView source
DataTableHeaderCellts
export declare function DataTableHeaderCell(props: DataTableHeaderCellProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableHeaderCellProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableHeaderCellProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableHeaderCellProps

interface
DeclarationView source
DataTableHeaderCellPropsts
export interface DataTableHeaderCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {
    readonly as?: AsProp;
    readonly columnKey: string;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
columnKey
property
string
required
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
columnKey
Kind
property
Type
string
Requirement
required

DataTableHeaderProps

interface
DeclarationView source
DataTableHeaderPropsts
export interface DataTableHeaderProps extends JSX.HTMLAttributes<HTMLTableSectionElement> {
    readonly as?: AsProp;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional

DataTableHeaderRow

function
DeclarationView source
DataTableHeaderRowts
export declare function DataTableHeaderRow(props: DataTableHeaderRowProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableHeaderRowProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableHeaderRowProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableHeaderRowProps

interface
DeclarationView source
DataTableHeaderRowPropsts
export interface DataTableHeaderRowProps extends JSX.HTMLAttributes<HTMLTableRowElement> {
    readonly as?: AsProp;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional

DataTableRoot

function
DeclarationView source
DataTableRootts
export declare function DataTableRoot(props: DataTableRootProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableRootProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableRootProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableRootProps

interface
DeclarationView source
DataTableRootPropsts
export interface DataTableRootProps extends Omit<JSX.HTMLAttributes<HTMLTableElement>, "onChange"> {
    readonly as?: AsProp;
    readonly defaultSort?: DataTableInput["defaultSort"];
    readonly selectionMode?: DataTableInput["selectionMode"];
    readonly selectedIds?: DataTableInput["selectedIds"];
    readonly defaultSelectedIds?: DataTableInput["defaultSelectedIds"];
    readonly orderedIds?: DataTableInput["orderedIds"];
    readonly disabledIds?: DataTableInput["disabledIds"];
    readonly columnKeys: DataTableConnectOptions["columnKeys"];
    readonly sortableKeys?: DataTableConnectOptions["sortableKeys"];
    readonly caption?: DataTableConnectOptions["caption"];
    readonly zebra?: DataTableConnectOptions["zebra"];
    readonly selectableIds?: DataTableConnectOptions["selectableIds"];
    readonly onSelectedIdsChange?: (detail: SelectionChangeDetail) => void;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
caption
property
DataTableConnectOptions["caption"]
optional
columnKeys
property
DataTableConnectOptions["columnKeys"]
required
defaultSelectedIds
property
DataTableInput["defaultSelectedIds"]
optional
defaultSort
property
DataTableInput["defaultSort"]
optional
disabledIds
property
DataTableInput["disabledIds"]
optional
onSelectedIdsChange
property
(detail: SelectionChangeDetail) => void
optional
orderedIds
property
DataTableInput["orderedIds"]
optional
selectableIds
property
DataTableConnectOptions["selectableIds"]
optional
selectedIds
property
DataTableInput["selectedIds"]
optional
selectionMode
property
DataTableInput["selectionMode"]
optional
sortableKeys
property
DataTableConnectOptions["sortableKeys"]
optional
zebra
property
DataTableConnectOptions["zebra"]
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
caption
Kind
property
Type
DataTableConnectOptions["caption"]
Requirement
optional
Name
columnKeys
Kind
property
Type
DataTableConnectOptions["columnKeys"]
Requirement
required
Name
defaultSelectedIds
Kind
property
Type
DataTableInput["defaultSelectedIds"]
Requirement
optional
Name
defaultSort
Kind
property
Type
DataTableInput["defaultSort"]
Requirement
optional
Name
disabledIds
Kind
property
Type
DataTableInput["disabledIds"]
Requirement
optional
Name
onSelectedIdsChange
Kind
property
Type
(detail: SelectionChangeDetail) => void
Requirement
optional
Name
orderedIds
Kind
property
Type
DataTableInput["orderedIds"]
Requirement
optional
Name
selectableIds
Kind
property
Type
DataTableConnectOptions["selectableIds"]
Requirement
optional
Name
selectedIds
Kind
property
Type
DataTableInput["selectedIds"]
Requirement
optional
Name
selectionMode
Kind
property
Type
DataTableInput["selectionMode"]
Requirement
optional
Name
sortableKeys
Kind
property
Type
DataTableConnectOptions["sortableKeys"]
Requirement
optional
Name
zebra
Kind
property
Type
DataTableConnectOptions["zebra"]
Requirement
optional

DataTableRow

function
DeclarationView source
DataTableRowts
export declare function DataTableRow(props: DataTableRowProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableRowProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableRowProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableRowProps

interface
DeclarationView source
DataTableRowPropsts
export interface DataTableRowProps extends JSX.HTMLAttributes<HTMLTableRowElement> {
    readonly as?: AsProp;
    readonly rowId: string;
    readonly visualIndex?: number;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
rowId
property
string
required
visualIndex
property
number
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
rowId
Kind
property
Type
string
Requirement
required
Name
visualIndex
Kind
property
Type
number
Requirement
optional

DataTableSortButton

function
DeclarationView source
DataTableSortButtonts
export declare function DataTableSortButton(props: DataTableSortButtonProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
DataTableSortButtonProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
DataTableSortButtonProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

DataTableSortButtonProps

interface
DeclarationView source
DataTableSortButtonPropsts
export interface DataTableSortButtonProps extends Omit<JSX.ButtonHTMLAttributes<HTMLButtonElement>, "type"> {
    readonly as?: AsProp;
    readonly columnKey: string;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
columnKey
property
string
required
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
columnKey
Kind
property
Type
string
Requirement
required

projectDataTableRowIds

function
DeclarationView source
projectDataTableRowIdsts
declare function projectDataTableRowIds<T>(rows: readonly T[], options: {
  readonly selectionMode?: SelectionMode;
  readonly getRowId?: (row: T, index: number) => string;
  readonly isRowDisabled?: (row: T, index: number) => boolean;
}): DataTableRowIdProjection;
Name
Kind
Type
Requirement
rows
parameter
readonly T[]
required
options
parameter
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
required
return
return value
DataTableRowIdProjection
n/a
Name
rows
Kind
parameter
Type
readonly T[]
Requirement
required
Name
options
Kind
parameter
Type
{ readonly selectionMode?: SelectionMode; readonly getRowId?: (row: T, index: number) => string; readonly isRowDisabled?: (row: T, index: number) => boolean; }
Requirement
required
Name
return
Kind
return value
Type
DataTableRowIdProjection
Requirement
n/a

SelectionChangeDetail

type
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
  readonly selectedIds: SelectionValue;
  readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

SelectionMode

type
DeclarationView source
SelectionModets
type SelectionMode = "none" | "single" | "multiple";

useDataTable

function
DeclarationView source
useDataTablets
export declare function useDataTable(input: Accessor<DataTableInput>, options: UseDataTableOptions): UseDataTableResult;
Name
Kind
Type
Requirement
input
parameter
Accessor<DataTableInput>
required
options
parameter
UseDataTableOptions
required
return
return value
UseDataTableResult
n/a
Name
input
Kind
parameter
Type
Accessor<DataTableInput>
Requirement
required
Name
options
Kind
parameter
Type
UseDataTableOptions
Requirement
required
Name
return
Kind
return value
Type
UseDataTableResult
Requirement
n/a

useDataTableContext

function
DeclarationView source
useDataTableContextts
export declare function useDataTableContext(partName: string): DataTableContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
DataTableContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
DataTableContextValue
Requirement
n/a

UseDataTableOptions

interface
DeclarationView source
UseDataTableOptionsts
export interface UseDataTableOptions extends DataTableConnectOptions {
}

UseDataTableResult

interface
DeclarationView source
UseDataTableResultts
export interface UseDataTableResult {
    readonly service: DataTableService;
    readonly connector: DataTableApi;
    readonly scope: PartScope;
    readonly snapshot: Accessor<DataTableSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
DataTableApi
required
scope
property
PartScope
required
service
property
DataTableService
required
snapshot
property
Accessor<DataTableSnapshot>
required
Name
connector
Kind
property
Type
DataTableApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
DataTableService
Requirement
required
Name
snapshot
Kind
property
Type
Accessor<DataTableSnapshot>
Requirement
required