Parameters

useTableGroupedRows() takes one config object. Wrap it in a getter or a ref so the sections follow the current rows and the current collapsed set: useTableGroupedRows(() => ({ ... })).

Name	Type	Default	Description
data	readonly T[]	—	Required. The flat data to group.
groupBy	(item: T) => string	—	Required. Derive the group key for a row. Rows with the same key share a section.
collapsedGroups	ReadonlySet<string>	—	Required. Set of currently-collapsed group keys.
onToggleGroup	(groupKey: string) => void	—	Required. Called with a group key when its header is toggled.
renderGroupHeader	(groupKey: string, count: number, collapsed: boolean) => VNodeChild	—	Custom renderer for a group header's content, right of the chevron. Defaults to groupKey (count).
getRowKey	(item: T) => string	—	Stable key for a real row. Falls back to a positional key when omitted.
groupOrder	readonly string[]	—	Explicit group ordering. Groups not listed keep first-seen order after these.

Returns

Name	Type	Description
data	ComputedRef<T[]>	The rows plus one section header per group, in display order. A collapsed group keeps its header and drops its rows.
plugin	TablePlugin<T>	Makes a section header span the row, skips it for selection and row numbers, and toggles it on click.
idKey	(item: T) => string	Row identity for both kinds of row: a section header answers with its group key, a data row with getRowKey or its position.

isTableGroupHeader

isTableGroupHeader(item) narrows an item of data to a section header and gives you groupKey and count without a cast. It is the same check the plugin uses.

Section header fields

Name	Type	Description
groupKey	string	The key the section was grouped by.
count	number	How many rows the group holds, whether or not it is open.
id	string	Stable id of the section header, built from the group key.