Skip to main content

Step 1: Define a Column Group

Add a columnGroups section to your sheet configuration YAML. Each group has a unique ID and configuration properties:
columnGroups:
  requirements:
    groupName: Requirements
    groupStyle: blue
    headerStyle: lightblue
    collapseTo: title

Step 2: Understand Group Properties

PropertyRequiredDescription
groupNameYesDisplay name shown in the group header row
groupStyleNoColor style applied to grouped column backgrounds. Uses a predefined style name or a custom style. Defaults to white.
headerStyleNoColor style applied to all sub-column headers within the group. Can be overridden per column with header.style. Defaults to white.
collapseToNoBinding path of the column to show when the group is collapsed. If omitted, the group cannot be collapsed.

Step 3: Assign Columns to the Group

Add a columnGroup property to each column that should belong to the group:
columnGroups:
  requirements:
    groupName: Requirements
    groupStyle: blue
    headerStyle: lightblue
    collapseTo: title

columns:
  title:
    title: Title
    width: 200
    columnGroup: requirements
  description:
    title: Description
    width: 300
    columnGroup: requirements
  severity:
    title: Severity
    width: 100
    columnGroup: requirements
All three columns will appear under a shared “Requirements” group header in the sheet. diagram

Step 4: Configure Multiple Groups

Define multiple groups with different color schemes to visually separate entity domains:
columnGroups:
  requirements:
    groupName: Requirements
    groupStyle: blue
    headerStyle: lightblue
  risks:
    groupName: Risk Analysis
    groupStyle: red
    headerStyle: darkorange
    collapseTo: hazard
  controls:
    groupName: Risk Controls
    groupStyle: green
    headerStyle: lightgreen
    collapseTo: riskControls.riskControl

columns:
  title:
    title: User Need
    columnGroup: requirements
  systemRequirements.systemRequirement:
    title: System Req
    columnGroup: requirements
  hazard:
    title: Hazard
    columnGroup: risks
  riskControls.riskControl:
    title: Risk Control
    columnGroup: controls

Step 5: Enable Collapse Behavior

When collapseTo is set, a collapse toggle button appears in the group header. Clicking it hides all columns in the group except the specified one:
columnGroups:
  risks:
    groupName: Risk Analysis
    groupStyle: red
    headerStyle: darkorange
    collapseTo: hazard
When collapsed, only the hazard column is visible. Click the toggle again to expand all columns back.
The collapseTo value is specified by column binding path. If the target column is hidden (visible: false), the last visible column in the group is used instead.
Apply semantic colors: red/darkorange for risks, blue/lightblue for requirements, green/lightgreen for controls, purple/lightpurple for references. This helps users quickly identify column context in wide sheets.

Predefined Style Names

You can use any of these built-in style names for groupStyle and headerStyle: none, grey, darkgrey, red, darkred, orange, darkorange, green, darkgreen, lightgreen, blue, darkblue, lightblue, teal, darkteal, purple, darkpurple, lightpurple For custom colors, define styles in the styles section and reference them by name. See Apply Column Styles.

Verify

After saving the sheet configuration, reload the powersheet document. You should now see:
  • A group header row appears above the column headers
  • Columns assigned to the same group share a merged group header cell
  • Columns without a columnGroup show a blank group header
  • Groups with collapseTo display a collapse toggle button

See Also

column-column-group-header-styles KB article, column-groups.spec.ts, powersheet.yaml, whole_rtm.template.yaml
KB ArticlesSupport TicketsSource Code
  • prod-powersheet-src/com.nextedy.powersheet.client/ltc-repo/packages/common/types/api/document.ts
  • prod-powersheet-src/com.nextedy.powersheet.client/ltc-repo/cypress/e2e/Sheet/column-groups.spec.ts
  • prod-powersheet-src/com.nextedy.powersheet.client/cypress/fixtures/configurations/whole_rtm.template.yaml
  • powersheet.yaml
  • prod-powersheet-src/com.nextedy.powersheet.client/ltc-repo/packages/sheet/commands/group-row.ts