Columns / Header style
Header styling works just like cell styling but targets the header row. Each leaf column accepts a headerStyle/getHeaderStyle pair for inline styles and a headerClass/getHeaderClass/headerClassRules group for CSS classes. Column group headers (definitions with children) expose the same properties — headerStyle, getHeaderStyle, headerClass, getHeaderClass and headerClassRules — evaluated with a HeaderGroupRenderParams instead.
Header style
headerStyle applies a static CSS style object to a column's leaf header cell. It is always present — use getHeaderStyle when the styles depend on the render context.
Get header style
getHeaderStyle is a function invoked for every header cell render. It receives
HeaderRenderParams (column and index) and returns a style object, letting you branch on the column definition itself.Header class
headerClass attaches one or more static CSS classes to a column's leaf header cell. It is a string — use getHeaderClass for a class computed from the render context.
Get header class
getHeaderClass function returns a CSS class for each header cell. Classes are applied dynamically on every render, reacting to the column definition.
Header class rules
headerClassRules maps rule names to predicates. Every header whose predicate returns true gets the rule name applied as a CSS class. Rules re-evaluate in a single batch — toggle the numeric highlight rule and all visible headers update at once.
Rules re-evaluate and apply in a single batch across all visible headers.
Pinned column headers
Pinned columns render their headers in their own sticky pane, which shares the grid's vertical scroll. The same headerStyle/headerClass properties apply inside that pane — here a pinned-left ID column gets a headerStyle and the pinned-right Status column gets a headerClass.
Group header style
Column group headers (definitions with children) accept the full header styling API: headerStyle, getHeaderStyle, headerClass, getHeaderClass, and headerClassRules. They evaluate with
HeaderGroupRenderParams (group, depth, columnCount), so groups can be styled per nesting level or span width.