---
title: "Column Options Reference"
framework: javascript
version: "36.1.0"
---

# Column Options Reference

Configuration for columns `ColDef<TData, TValue>` and column groups `ColGroupDef<TData>`.

### Columns

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `field` | `ColDefField` |  |  | The field of the row object to get the cell's data from. Deep references into a row object is supported via dot notation, i.e `'address.firstLine'`. See [Accessing Row Data Values](https://www.ag-grid.com/javascript-data-grid/value-getters/#field) for more information. |
| `colId` | `string` |  |  | The unique ID to give the column. This is optional. If missing, the ID will default to the field. If both field and colId are missing, a unique ID will be generated. This ID is used to identify the column in the API for sorting, filtering etc. |
| `type` | `string \| string[]` |  |  | A comma separated string or array of strings containing `ColumnType` keys which can be used as a template for a column. This helps to reduce duplication of properties when you have a lot of common column properties. See [Column Types](https://www.ag-grid.com/javascript-data-grid/column-definitions/#default-column-definitions) for more information. |
| `cellDataType` | `boolean \| string` |  | `true` | The data type of the cell values for this column. Can either infer the data type from the row data (`true` - the default behaviour), define a specific data type (`string`), or have no data type (`false`). If setting a specific data type (`string` value), this can either be one of the pre-defined data types `'text'`, `'number'`, `'boolean'`, `'date'`, `'dateString'` or `'object'`, or a custom data type that has been defined in the `dataTypeDefinitions` grid option. Data type inference only works for the Client-Side Row Model, and requires non-null data. It will also not work if the `valueGetter`, `valueParser` or `refData` properties are defined, or if this column is a sparkline. See [Cell Data Types](https://www.ag-grid.com/javascript-data-grid/cell-data-types/) for more information. |
| `valueGetter` | `string \| ValueGetterFunc` |  |  | Function or [expression](https://www.ag-grid.com/javascript-data-grid/cell-expressions/#column-definition-expressions). Gets the value from your data for display. See [Value Getters](https://www.ag-grid.com/javascript-data-grid/value-getters/) for more information. |
| `valueFormatter` | `string \| ValueFormatterFunc` |  |  | A function or expression to format a value, should return a string. See [Value Formatters](https://www.ag-grid.com/javascript-data-grid/value-formatters/) for more information. |
| `refData` | `RefData` |  |  | Provided a reference data map to be used to map column values to their respective value from the map. See [Using the 'refData' Property](https://www.ag-grid.com/javascript-data-grid/reference-data/#using-the-refdata-property) for more information. |
| `keyCreator` | `KeyCreatorFunc` |  |  | Function to return a string key for a value. This string is used for grouping, Set filtering, and searching within cell editor dropdowns. When filtering and searching the string is exposed to the user, so make sure to return a human-readable value. |
| `equals` | `EqualsFunc` |  |  | Custom comparator for values, used by renderer to know if values have changed. Cells whose values have not changed don't get refreshed. By default the grid uses `===` which should work for most use cases. See [Change Detection Comparing Values](https://www.ag-grid.com/javascript-data-grid/change-detection/#comparing-values) for more information. |
| `toolPanelClass` | `ToolPanelClass` |  |  | CSS class to use for the tool panel cell. Can be a string, array of strings, or function. Module: [`ColumnsToolPanelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `suppressColumnsToolPanel` | `boolean` |  | `false` | Set to `true` if you do not want this column or group to appear in the Columns Tool Panel. Module: [`ColumnsToolPanelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `columnGroupShow` | `ColumnGroupShowType` |  |  | Whether to only show the column when the group is open / closed. If not set the column is always displayed as part of the group. |
| `icons` | `Icons` |  |  | Icons to use inside the column instead of the grid's default icons. Leave undefined to use defaults. See [Custom Icons](https://www.ag-grid.com/javascript-data-grid/custom-icons/#set-the-icons-through-gridoptions-javascript) for more information. [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `suppressNavigable` | `boolean \| SuppressNavigableCallback` |  | `false` | Set to `true` if this column is not navigable (i.e. cannot be tabbed into), otherwise `false`. Can also be a callback function to have different rows navigable. |
| `suppressKeyboardEvent` | `SuppressKeyboardEventFunc` |  | `false` | Allows the user to suppress certain keyboard events in the grid cell. See [Suppress Keyboard Events](https://www.ag-grid.com/javascript-data-grid/keyboard-navigation/#suppresskeyboardevent) for more information. |
| `suppressPaste` | `boolean \| SuppressPasteCallback` |  |  | Pasting is on by default as long as cells are editable (non-editable cells cannot be modified, even with a paste operation). Set to `true` turn paste operations off. |
| `suppressFillHandle` | `boolean` |  |  | Set to true to prevent the fillHandle from being rendered in any cell that belongs to this column See [Suppressing the Fill Handle](https://www.ag-grid.com/javascript-data-grid/cell-selection-fill-handle/#suppressing-the-fill-handle) for more information. |
| `contextMenuItems` | `(DefaultMenuItem \| MenuItemDef)[] \| GetContextMenuItems` |  |  | Customise the list of menu items available in the context menu. See [Configuring the Context Menu](https://www.ag-grid.com/javascript-data-grid/context-menu/#configuring-the-context-menu) for more information. Module: [`ContextMenuModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `suppressNoteActions` | `boolean \| SuppressNoteActionsCallback` |  | `false` | Set to `true` to suppress built-in note actions for this column. Existing notes remain viewable on hover and through `getNote()`. Can also be a callback function to suppress notes for specific rows. Module: [`NotesModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `context` | `any` |  |  | Context property that can be used to associate arbitrary application data with this column definition. |

### Columns: Accessibility

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `cellAriaRole` | `string` |  | `'gridcell'` | Used for screen reader announcements - the role property of the cells that belong to this column. |

### Columns: Aggregation

(Enterprise only) See [Aggregation](https://www.ag-grid.com/javascript-data-grid/aggregation-columns/)

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `aggFunc` | [`string \| IAggFunc \| null`](https://www.ag-grid.com/javascript-data-grid/aggregation-custom-functions/) |  |  | Name of function to use for aggregation. In-built options are: `sum`, `min`, `max`, `count`, `avg`, `first`, `last`. Also accepts a custom aggregation name or an aggregation function. See [Enabling Aggregation](https://www.ag-grid.com/javascript-data-grid/aggregation-columns/#enabling-aggregation) for more information. Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`TreeDataModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`ServerSideRowModelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialAggFunc` | [`string \| IAggFunc`](https://www.ag-grid.com/javascript-data-grid/aggregation-custom-functions/) |  |  | Same as `aggFunc`, except only applied when creating a new column. Not applied when updating column definitions. Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`TreeDataModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`ServerSideRowModelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `valueIndex` | `number` |  |  | The position of this column in the order of value columns when aggregating in pivot mode. When aggregating by a single column, any number can be used. When aggregating by multiple columns, this determines the order (e.g. `0` for first, `1` for second). Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialValueIndex` | `number` |  |  | Same as `valueIndex`, except only applied when creating a new column. Not applied when updating column definitions. Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `enableValue` | `boolean` |  | `false` | Set to `true` if you want to be able to aggregate by this column via the GUI. This will not block the API or properties being used to achieve aggregation. See [Configuring via the UI](https://www.ag-grid.com/javascript-data-grid/aggregation-columns/#configuring-via-the-ui) for more information. Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`TreeDataModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`ServerSideRowModelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `allowedAggFuncs` | `string[]` |  |  | Aggregation functions allowed on this column e.g. `['sum', 'avg']`. If missing, all installed functions are allowed. This will only restrict what the GUI allows a user to select, it does not impact when you set a function via the API. See [Allowed Functions](https://www.ag-grid.com/javascript-data-grid/aggregation-columns/#allowed-functions) for more information. Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`TreeDataModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`ServerSideRowModelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `defaultAggFunc` | `string` |  | `'sum'` | The name of the aggregation function to use for this column when it is enabled via the GUI. Note that this does not immediately apply the aggregation function like `aggFunc` See [Default Function](https://www.ag-grid.com/javascript-data-grid/aggregation-columns/#default-function) for more information. Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`TreeDataModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`ServerSideRowModelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `showValuesAs` | `ShowValuesAsType \| ShowValuesAs \| null` |  |  | The active "Show Values As" mode for this column. Shows the column's aggregated value relative to another total, for example as a percentage of the grand total, column total, row total or parent total. This changes only the displayed value; the underlying value used by `getDataValue` and charts is unchanged. Use a built-in mode name, or the object form `{ type, params, precision }`. Set `null` for no active mode. See [Show Values As](https://www.ag-grid.com/javascript-data-grid/aggregation-show-values-as/) for more information. Module: [`ShowValuesAsModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialShowValuesAs` | `ShowValuesAsType \| ShowValuesAs` |  |  | Same as `showValuesAs`, except only applied when creating a new column. Module: [`ShowValuesAsModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `showValuesAsDef` | `ShowValuesAsDef \| null` |  |  | Per-column "Show Values As" configuration: `precision`, `suppressHeaderIndicator`, and user-provided `modes` (custom modes / overrides of the built-ins). Deep-merges from `defaultColDef`. The active mode is the `showValuesAs` selector. `null` disables the feature for the column (useful to opt a column out via `defaultColDef`). See [Configuration](https://www.ag-grid.com/javascript-data-grid/aggregation-show-values-as/#configuration) for more information. Module: [`ShowValuesAsModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `enableShowValuesAs` | `boolean` |  | `false` | Shows the "Show Values As" submenu in the column menu. On `defaultColDef`, `true` shows the submenu only for value columns and numeric columns. On an individual column, `true` always shows it; use this when the grid cannot infer that the column returns numbers, for example with a `valueGetter` or custom `aggFunc`. `false` hides the submenu. This controls menu visibility only. Modes set through `showValuesAs` or Column State still apply. Module: [`ShowValuesAsModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Calculated Columns

See [Calculated Columns](https://www.ag-grid.com/javascript-data-grid/calculated-columns/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `calculatedExpression` | `string` |  |  | Expression used to calculate this column's value from other columns in the same row. Use bracket references to read other columns by `colId`, e.g. `[revenue] - [cost]`. Calculated columns are read-only. Module: [`CalculatedColumnsModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Display

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `hide` | `boolean \| null` |  | `false` | Set to `true` for this column to be hidden. |
| `initialHide` | `boolean` |  |  | Same as `hide`, except only applied when creating a new column. Not applied when updating column definitions. [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `lockVisible` | `boolean` |  | `false` | Set to `true` to block making column visible / hidden via the UI (API will still work). |
| `lockPosition` | `boolean \| 'left' \| 'right'` |  |  | Lock a column to position to `'left'` or`'right'` to always have this column displayed in that position. `true` is treated as `'left'` |
| `suppressMovable` | `boolean` |  | `false` | Set to `true` if you do not want this column to be movable via dragging. |
| `useValueFormatterForExport` | `boolean` |  | `true` | By default, values are formatted using the column's `valueFormatter` when exporting data from the grid. This applies to CSV and Excel, as well as clipboard operations and the fill handle. Set to `false` to prevent values from being formatted for these operations. Regardless of this option, if custom handling is provided for the export operation, the value formatter will not be used. See [Using Value Formatters with Other Grid Features](https://www.ag-grid.com/javascript-data-grid/value-formatters/#formatting-for-export) for more information. |

### Columns: Editing

See [Cell Editing](https://www.ag-grid.com/javascript-data-grid/cell-editing/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `editable` | `boolean \| EditableCallback` |  | `false` | Set to `true` if this column is editable, otherwise `false`. Can also be a function to have different rows editable. When grouping, see `groupRowEditable` instead for group rows. |
| `groupRowEditable` | `boolean \| GroupRowEditableCallback` |  |  | Works like `editable`, but is evaluated only for group rows. When provided, group rows use this property instead of `editable`. Set to `true` to make group row cells editable, or use a callback to control editability per row. When `groupRowEditable` is defined and no explicit `groupRowValueSetter` is provided, the built-in `distributeGroupValue` (exported from `ag-grid-enterprise`) is used automatically. Columns with `groupRowEditable` or `groupRowValueSetter` do not require `field` or `valueSetter` - the group row value setter handles the edit entirely. Note: if `groupRowValueSetter` resolves to `false` or `null` (via `distribution: false`, a per-aggFunc record entry, or `groupRowValueSetter: false`), the cell is treated as not editable even when `groupRowEditable` is `true`. Module: [`RowGroupingEditModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `groupRowValueSetter` | `boolean \| GroupRowValueSetterFunc \| GroupRowValueSetterOptions` |  |  | Controls how a group row value edit is distributed to descendant rows. - **`true`**: Uses the built-in `distributeGroupValue` (exported from `ag-grid-enterprise`) with default settings. Also enabled implicitly when `groupRowEditable` is defined and `groupRowValueSetter` is not set. - **`false`**: Explicitly disables group row value distribution and makes the cell not editable, even if `groupRowEditable` is defined. - **Function**: A custom callback that receives a GroupRowValueSetterParams and pushes edits down to descendants. The column does not need `field` or `valueSetter` - the callback handles the edit entirely. - **Options object**: Uses the built-in distribution logic with a GroupRowValueSetterOptions configuration. When `distribution` resolves to `false` or `null` for the column's aggFunc, the cell is treated as not editable (overriding `groupRowEditable`). Fires for every `setDataValue` call when active, regardless of `groupRowEditable`. Module: [`RowGroupingEditModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `valueSetter` | `string \| ValueSetterFunc` |  |  | Function or [expression](https://www.ag-grid.com/javascript-data-grid/cell-expressions/#column-definition-expressions). Custom function to modify your data based off the new value for saving. Return `true` if the data changed. See [Saving Values](https://www.ag-grid.com/javascript-data-grid/value-setters/) for more information. |
| `valueParser` | `string \| ValueParserFunc` |  |  | Function or [expression](https://www.ag-grid.com/javascript-data-grid/cell-expressions/#column-definition-expressions). Parses the value for saving. See [Parsing Values](https://www.ag-grid.com/javascript-data-grid/value-parsers/) for more information. |
| `cellEditor` | `any` |  |  | Provide your own cell editor component for this column's cells. See [Cell Editors](https://www.ag-grid.com/javascript-data-grid/cell-editors/) for more information. |
| `cellEditorParams` | `any` |  |  | Params to be passed to the `cellEditor` component. |
| `cellEditorSelector` | `CellEditorSelectorFunc` |  |  | Callback to select which cell editor to be used for a given row within the same column. See [Many Editors One Column](https://www.ag-grid.com/javascript-data-grid/cell-editors/#dynamic-selection) for more information. |
| `cellEditorPopup` | `boolean` |  |  | Set to `true`, to have the cell editor appear in a popup. |
| `cellEditorPopupPosition` | `'over' \| 'under'` |  | `'over'` | Set the position for the popup cell editor. Possible values are - `over` Popup will be positioned over the cell - `under` Popup will be positioned below the cell leaving the cell value visible. |
| `singleClickEdit` | `boolean` |  | `false` | Set to `true` to have cells under this column enter edit mode after single click. |
| `useValueParserForImport` | `boolean` |  | `true` | By default, values are parsed using the column's `valueParser` when importing data to the grid. This applies to clipboard operations and the fill handle. Set to `false` to prevent values from being parsed for these operations. Regardless of this option, if custom handling is provided for the import operation, the value parser will not be used. See [Using Value Parsers with Other Grid Features](https://www.ag-grid.com/javascript-data-grid/value-parsers/#use-value-parser-for-import) for more information. |

### Columns: Events

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `onCellValueChanged` | `NewValueParams` |  |  | Callback for after the value of a cell has changed, either due to editing or the application calling `api.setValue()`. |
| `onCellClicked` | `CellClickedEvent` |  |  | Callback called when a cell is clicked. |
| `onCellDoubleClicked` | `CellDoubleClickedEvent` |  |  | Callback called when a cell is double clicked. |
| `onCellContextMenu` | `CellContextMenuEvent` |  |  | Callback called when a cell is right clicked. |

### Columns: Filter

See [Filtering](https://www.ag-grid.com/javascript-data-grid/filtering-overview/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `filter` | `any` |  |  | Filter component to use for this column. Set to `true` to use the default filter. Set to the name of a [Provided Filter](https://www.ag-grid.com/javascript-data-grid/filtering/#column-filter-types) or set to a `IFilterComp`. See [Column Filters](https://www.ag-grid.com/javascript-data-grid/filtering/) for more information. |
| `filterParams` | `any` |  |  | Params to be passed to the filter component specified in `filter`. See [Filter Parameters](https://www.ag-grid.com/javascript-data-grid/filtering/) for more information. |
| `filterValueGetter` | `string \| ValueGetterFunc` |  |  | Function or [expression](https://www.ag-grid.com/javascript-data-grid/cell-expressions/#column-definition-expressions). Gets the value for filtering purposes. |
| `getQuickFilterText` | `GetQuickFilterText` |  |  | A function to tell the grid what Quick Filter text to use for this column if you don't want to use the default (which is calling `toString` on the value). See [Overriding the Quick Filter Value](https://www.ag-grid.com/javascript-data-grid/filter-quick/#overriding-the-quick-filter-value) for more information. Module: [`QuickFilterModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `floatingFilter` | `boolean` |  | `false` | Whether to display a floating filter for this column. See [Floating Filter](https://www.ag-grid.com/javascript-data-grid/floating-filters/) for more information. |
| `floatingFilterComponent` | `any` |  |  | The custom component to be used for rendering the floating filter. If none is specified the default AG Grid is used. See [Floating Filter Component](https://www.ag-grid.com/javascript-data-grid/component-floating-filter/) for more information. |
| `floatingFilterComponentParams` | `any` |  |  | Params to be passed to `floatingFilterComponent`. See [Floating Filter Parameters](https://www.ag-grid.com/javascript-data-grid/component-floating-filter/#example-custom-floating-filter) for more information. |
| `suppressFiltersToolPanel` | `boolean` |  | `false` | Set to `true` if you do not want this column (filter) or group (filter group) to appear in the Filters Tool Panel. Module: [`ColumnsToolPanelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `dateComponent` | `any` |  |  | Custom date selection component to be used in Date Filters and Date Floating Filters for this column. See [Custom Selection Component](https://www.ag-grid.com/javascript-data-grid/filter-date/#custom-selection-component) for more information. |
| `dateComponentParams` | `any` |  |  | The parameters to be passed to the `dateComponent`. See [Custom Selection Component](https://www.ag-grid.com/javascript-data-grid/filter-date/#custom-selection-component) for more information. |

### Columns: Find

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `getFindText` | `GetFindTextFunc` |  |  | When using Find with custom cell renderers, this allows providing a custom value to search within. E.g. if the cell renderer is displaying text that is different from the cell formatted value. Returning `null` means Find will not search within the cell. See [Using Find with Cell Components](https://www.ag-grid.com/javascript-data-grid/find/#using-find-with-cell-components) for more information. Module: [`FindModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Formulas

See [Formulas](https://www.ag-grid.com/javascript-data-grid/formulas/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `allowFormula` | `boolean` |  | `false` | Allow formulas to be entered and evaluated in this column. Module: [`FormulaModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Header

See [Column Headers](https://www.ag-grid.com/javascript-data-grid/column-headers/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `headerName` | `string` |  |  | The name to render in the column header. If not specified and field is specified, the field name will be used as the header name. |
| `headerNameEditable` | `boolean` |  | `false` | Set to `true` to allow the user to edit this column's (or column group's) header name from the UI. The edited value is persisted as part of grid state. See [Editable Header Name](https://www.ag-grid.com/javascript-data-grid/column-headers/#editable-header-name) for more information. Module: [`ColumnHeaderEditModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `headerValueGetter` | `string \| HeaderValueGetterFunc` |  |  | Function or [expression](https://www.ag-grid.com/javascript-data-grid/cell-expressions/#column-definition-expressions). Gets the value for display in the header. |
| `headerTooltipValueGetter` | `HeaderTooltipValueGetterFunc` |  |  | Callback that should return the string to use for a tooltip. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `headerTooltip` | `string` |  |  | Tooltip for the column header, `headerTooltipValueGetter` takes precedence if set. When the column is grouped with `groupDisplayType: 'multipleColumns'`, the generated group column header inherits this value. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `headerStyle` | `HeaderStyle \| HeaderStyleFunc` |  |  | An object of CSS values / or function returning an object of CSS values for a particular header. |
| `headerClass` | `HeaderClass` |  |  | CSS class to use for the header cell. Can be a string, array of strings, or function. |
| `headerComponent` | `any` |  |  | The custom header group component to be used for rendering the component header. If none specified the default AG Grid is used. See [Header Component](https://www.ag-grid.com/javascript-data-grid/column-headers/) for more information. |
| `headerComponentParams` | `any` |  |  | The parameters to be passed to the `headerComponent`. |
| `wrapHeaderText` | `boolean` |  |  | If enabled then column header names that are too long for the column width will wrap onto the next line. Default `false` |
| `autoHeaderHeight` | `boolean` |  | `false` | If enabled then the column header row will automatically adjust height to accommodate the size of the header cell. This can be useful when using your own `headerComponent` or long header names in conjunction with `wrapHeaderText`. See [Auto Header Height](https://www.ag-grid.com/javascript-data-grid/column-headers/) for more information. |
| `menuTabs` | `ColumnMenuTab[]` |  |  | Set to an array containing zero, one or many of the following options: `'filterMenuTab' \| 'generalMenuTab' \| 'columnsMenuTab'`. This is used to figure out which menu tabs are present and in which order the tabs are shown. See [Legacy Tabbed Column Menu](https://www.ag-grid.com/javascript-data-grid/column-menu/#legacy-tabbed-column-menu) for more information. |
| `columnChooserParams` | `ColumnChooserParams` |  |  | Params used to change the behaviour and appearance of the Column Chooser/Columns Menu tab. See [Customising the Column Chooser](https://www.ag-grid.com/javascript-data-grid/column-menu/#customising-the-column-chooser) for more information. Module: [`ColumnMenuModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `mainMenuItems` | `(DefaultMenuItem \| MenuItemDef)[] \| GetMainMenuItems` |  |  | Customise the list of menu items available in the column menu. See [Customising the Menu Items](https://www.ag-grid.com/javascript-data-grid/column-menu/#customising-the-menu-items) for more information. Module: [`ColumnMenuModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `columnMenuItems` | `(DefaultColumnMenuItem \| MenuItemDef)[] \| GetColumnMenuItems` |  |  | Customise the menu items shown for this column across the column menu, the Columns Tool Panel right-click menu, and the Column Chooser. The `source` param indicates which surface the menu is for. Takes precedence over `mainMenuItems`. See [Customising the Menu Items](https://www.ag-grid.com/javascript-data-grid/column-menu/#customising-the-menu-items) for more information. Modules (any of): [`ColumnMenuModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`ColumnsToolPanelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `suppressHeaderMenuButton` | `boolean` |  | `false` | Set to `true` if no menu button should be shown for this column header. See [Customising the Column Menu](https://www.ag-grid.com/javascript-data-grid/column-menu/#customising-the-column-menu) for more information. |
| `suppressHeaderFilterButton` | `boolean` |  | `false` | Set to `true` to not display the filter button in the column header. Doesn't apply when `columnMenu = 'legacy'`. See [Customising the Column Menu](https://www.ag-grid.com/javascript-data-grid/column-menu/#customising-the-column-menu) for more information. |
| `suppressHeaderContextMenu` | `boolean` |  | `false` | Set to `true` to not display the column menu when the column header is right-clicked. Doesn't apply when `columnMenu = 'legacy'`. See [Customising the Column Menu](https://www.ag-grid.com/javascript-data-grid/column-menu/#customising-the-column-menu) for more information. |
| `suppressHeaderKeyboardEvent` | `SuppressHeaderKeyboardEventFunc` |  |  | Suppress the grid taking action for the relevant keyboard event when a header is focused. See [Suppress Keyboard Events](https://www.ag-grid.com/javascript-data-grid/keyboard-navigation/#suppressheaderkeyboardevent) for more information. |
| `suppressFloatingFilterButton` | `boolean` |  |  | If `true`, the button in the floating filter that opens the parent filter in a popup will not be displayed. Only applies if `floatingFilter = true`. See [Floating Filters](https://www.ag-grid.com/javascript-data-grid/floating-filters/) for more information. |

### Columns: Integrated Charts

(Enterprise only) See [Integrated Charts](https://www.ag-grid.com/javascript-data-grid/integrated-charts/)

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `chartDataType` | `'category' \| 'series' \| 'time' \| 'excluded'` |  |  | Defines the chart data type that should be used for a column. Module: [`IntegratedChartsModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Pinned

See [Column Pinning](https://www.ag-grid.com/javascript-data-grid/column-pinning/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `pinned` | `boolean \| 'left' \| 'right' \| null` |  |  | Pin a column to one side: `right` or `left`. A value of `true` is converted to `'left'`. |
| `initialPinned` | `boolean \| 'left' \| 'right'` |  |  | Same as `pinned`, except only applied when creating a new column. Not applied when updating column definitions. [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `lockPinned` | `boolean` |  | `false` | Set to true to block the user pinning the column, the column can only be pinned via definitions or API. |

### Columns: Pivoting

(Enterprise only) See [Pivoting](https://www.ag-grid.com/javascript-data-grid/pivoting/)

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `pivot` | `boolean \| null` |  |  | Set to true to pivot by this column. See [Enabling Pivoting](https://www.ag-grid.com/javascript-data-grid/aggregation-columns/#default-function) for more information. Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialPivot` | `boolean` |  |  | Same as `pivot`, except only applied when creating a new column. Not applied when updating column definitions. Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `pivotIndex` | `number \| null` |  |  | Set this in columns you want to pivot by. If only pivoting by one column, set this to any number (e.g. `0`). If pivoting by multiple columns, set this to where you want this column to be in the order of pivots (e.g. `0` for first, `1` for second, and so on). Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialPivotIndex` | `number` |  |  | Same as `pivotIndex`, except only applied when creating a new column. Not applied when updating column definitions. Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `enablePivot` | `boolean` |  | `false` | Set to `true` if you want to be able to pivot by this column via the GUI. This will not block the API or properties being used to achieve pivot. See [Configuring via the UI](https://www.ag-grid.com/javascript-data-grid/pivoting/#configuring-via-the-ui) for more information. Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `pivotComparator` | `PivotComparatorFunc` |  |  | Comparator to use when ordering the pivot result groups generated when this column is used to pivot on. The values will always be strings, as the pivot service uses strings as keys for the pivot groups. Defines the ascending order: `pivotSort: 'desc'` reverses it, and `pivotSort: null` bypasses it to keep the order the groups were generated in. Groups are ordered by header name when this is not supplied. See [Ordering Pivot Result Groups](https://www.ag-grid.com/javascript-data-grid/pivoting-column-groups/#ordering-groups) for more information. Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `pivotSort` | `SortDirection` |  | `'asc'` | Sort direction applied to this column's pivot result columns when this column is used to pivot on. Independent of `sort` - pivot sorting does not flow to or from the column's own sort. Defaults to `'asc'` for the pivot result columns the grid generates. When the pivot result columns are supplied by the application via `setPivotResultColumns`, it defaults to `null` so the supplied order is kept until a sort is applied. See [Sorting Pivot Columns](https://www.ag-grid.com/javascript-data-grid/pivoting-column-groups/#sorting-pivot-columns) for more information. Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialPivotSort` | `SortDirection` |  |  | Same as `pivotSort`, except only applied when the column is created. Not used for subsequent updates. Module: [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |

### Columns: Rendering and Styling

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `cellStyle` | `CellStyle \| CellStyleFunc` |  |  | An object of CSS values / or function returning an object of CSS values for a particular cell. See [Cell Style](https://www.ag-grid.com/javascript-data-grid/cell-styles/#cell-style) for more information. Module: [`CellStyleModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `cellClass` | `string \| string[] \| CellClassFunc` |  |  | Class to use for the cell. Can be string, array of strings, or function that returns a string or array of strings. See [Cell Class](https://www.ag-grid.com/javascript-data-grid/cell-styles/#cell-class) for more information. Module: [`CellStyleModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `cellClassRules` | `CellClassRules` |  |  | Rules which can be applied to include certain CSS classes. See [Cell Class Rules](https://www.ag-grid.com/javascript-data-grid/cell-styles/#cell-class-rules) for more information. Module: [`CellStyleModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `cellRenderer` | `any` |  |  | Provide your own cell Renderer component for this column's cells. See [Cell Renderer](https://www.ag-grid.com/javascript-data-grid/component-cell-renderer/) for more information. |
| `cellRendererParams` | `any` |  |  | Params to be passed to the `cellRenderer` component. See [Cell Renderer Params](https://www.ag-grid.com/javascript-data-grid/component-cell-renderer/#custom-props) for more information. |
| `cellRendererSelector` | `CellRendererSelectorFunc` |  |  | Callback to select which cell renderer to be used for a given row within the same column. See [Many Renderers One Column](https://www.ag-grid.com/javascript-data-grid/component-cell-renderer/#providing-custom-components-dynamically) for more information. |
| `loadingCellRenderer` | `any` |  |  | Provide your own cell loading Renderer component for this column's cells when using SSRM or when a cell renderer is deferred. See [SSRM Cell Loading](https://www.ag-grid.com/javascript-data-grid/component-loading-cell-renderer/#skeleton-loading) for more information. |
| `loadingCellRendererParams` | `any` |  |  | Params to be passed to the `loadingCellRenderer` component. See [SSRM Cell Loading](https://www.ag-grid.com/javascript-data-grid/component-loading-cell-renderer/#skeleton-loading) for more information. |
| `loadingCellRendererSelector` | `ILoadingCellRendererSelectorFunc` |  |  | Callback to select which loading renderer to be used. See [SSRM Cell Loading](https://www.ag-grid.com/javascript-data-grid/component-loading-cell-renderer/#skeleton-loading) for more information. |
| `autoHeight` | `boolean` |  | `false` | Set to `true` to have the grid calculate the height of a row based on contents of this column. See [Auto Row Height](https://www.ag-grid.com/javascript-data-grid/row-height/#auto-row-height) for more information. Module: [`RowAutoHeightModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `wrapText` | `boolean` |  | `false` | Set to `true` to have the text wrap inside the cell - typically used with `autoHeight`. See [Text Wrapping and Displaying Multi-Line Text](https://www.ag-grid.com/javascript-data-grid/row-height/#text-wrapping-and-displaying-multi-line-text) for more information. |
| `enableCellChangeFlash` | `boolean` |  | `false` | Set to `true` to flash a cell when it's refreshed. Module: [`HighlightChangesModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Row Dragging

See [Row Dragging](https://www.ag-grid.com/javascript-data-grid/row-dragging/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `rowDrag` | `boolean \| RowDragCallback` |  | `false` | `boolean` or `Function`. Set to `true` (or return `true` from function) to allow row dragging. Module: [`RowDragModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `rowDragText` | `RowDragTextFunc` |  |  | A callback that should return a string to be displayed by the `rowDragComp` while dragging a row. If this callback is not set, the `rowDragText` callback in the `gridOptions` will be used and if there is no callback in the `gridOptions` the current cell value will be used. Module: [`RowDragModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `dndSource` | `boolean \| DndSourceCallback` |  | `false` | `boolean` or `Function`. Set to `true` (or return `true` from function) to allow dragging for native drag and drop. Module: [`DragAndDropModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `dndSourceOnRowDrag` | `DndSourceOnRowDragFunc` |  |  | Function to allow custom drag functionality for native drag and drop. Module: [`DragAndDropModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Row Grouping

(Enterprise only) See [Row Grouping](https://www.ag-grid.com/javascript-data-grid/grouping/)

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `rowGroup` | `boolean \| null` |  | `false` | Set to `true` to row group by this column. Module: [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialRowGroup` | `boolean` |  |  | Same as `rowGroup`, except only applied when creating a new column. Not applied when updating column definitions. Module: [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `rowGroupIndex` | `number \| null` |  |  | Set this in columns you want to group by. If only grouping by one column, set this to any number (e.g. `0`). If grouping by multiple columns, set this to where you want this column to be in the group (e.g. `0` for first, `1` for second, and so on). Module: [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `initialRowGroupIndex` | `number` |  |  | Same as `rowGroupIndex`, except only applied when creating a new column. Not applied when updating column definitions. Module: [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `enableRowGroup` | `boolean` |  | `false` | Set to `true` if you want to be able to row group by this column via the GUI. This will not block the API or properties being used to achieve row grouping. Module: [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `showRowGroup` | `string \| boolean` |  |  | Set to true to have the grid place the values for the group into the cell, or put the name of a grouped column to just show that group. See [Custom Group Columns](https://www.ag-grid.com/javascript-data-grid/grouping-custom-group-columns/) for more information. Module: [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/). [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `groupHierarchy` | [`(GroupHierarchyParts \| string \| ColDef)[]`](https://www.ag-grid.com/javascript-data-grid/column-properties/) |  |  | Specify a grouping hierarchy for this column. This generates one or more virtual columns to group or pivot by when this column is grouped or pivoted. This can be used to group/pivot by values derived from a source column. The grid provides hierarchy types related to date components. Users can provide their own hierarchy types by specifying a `ColDef`, or referring to the name of a hierarchy type defined in `groupHierarchyConfig`. See [Grouping by Dates and Times](https://www.ag-grid.com/javascript-data-grid/grouping-data/#example-grouping-date-time) for more information. Modules (any of): [`RowGroupingModule`](https://www.ag-grid.com/javascript-data-grid/modules/), [`PivotModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Sort

See [Row Sorting](https://www.ag-grid.com/javascript-data-grid/row-sorting/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `sortable` | `boolean` |  | `true` | Set to `false` to disable sorting which is enabled by default. |
| `sort` | `SortDirection \| SortDef` |  |  | Set the default sort. |
| `initialSort` | `SortDirection \| SortDef` |  |  | Same as `sort`, except only applied when creating a new column. Not applied when updating column definitions. [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `sortIndex` | `number \| null` |  |  | If sorting more than one column by default, specifies order in which the sorting should be applied. |
| `initialSortIndex` | `number` |  |  | Same as `sortIndex`, except only applied when creating a new column. Not applied when updating column definitions. [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `sortingOrder` | `(SortDirection \| SortDef)[]` |  |  | An array defining the order in which sorting occurs (if sorting is enabled). Defaults: - `['asc', 'desc', null]` if no sort type is specified, - `[{ type: 'absolute', direction: 'asc', }, { type: 'absolute', direction: 'desc' }, null]` if 'sort' or 'initialSort' have type 'absolute' |
| `comparator` | `SortComparatorFn \| Partial<Record<SortType, SortComparatorFn>>` |  |  | Override the default sorting order by providing a custom sort comparator, or a map of comparators for different `SortType`s. - `valueA`, `valueB` are the values to compare. - `nodeA`, `nodeB` are the corresponding RowNodes. Useful if additional details are required by the sort. - `isDescending` - `true` if sort direction is `desc`. Not to be used for inverting the return value as the grid already applies `asc` or `desc` ordering. Returns: - `0` valueA is the same as valueB - `> 0` Sort valueA after valueB - `< 0` Sort valueA before valueB |
| `unSortIcon` | `boolean` |  | `false` | Set to `true` if you want the unsorted icon to be shown when no sort is applied to this column. |

### Columns: Spanning

See [Column](https://www.ag-grid.com/javascript-data-grid/column-spanning/) / [Row](https://www.ag-grid.com/javascript-data-grid/row-spanning/) Spanning

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `colSpan` | `ColSpanFunc` |  |  | By default, each cell will take up the width of one column. You can change this behaviour to allow cells to span multiple columns. |
| `spanRows` | `boolean \| SpanRowsFunc` |  |  | Set to `true` to automatically merge cells in this column with equal values. Provide a callback to specify custom merging logic. See [Row Spanning](https://www.ag-grid.com/javascript-data-grid/row-spanning/) for more information. Module: [`CellSpanModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Tooltips

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `tooltipField` | `ColDefField` |  |  | The field of the tooltip to apply to the cell. When the column is grouped, group rows in the generated group column inherit this value. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `tooltipValueGetter` | `TooltipValueGetterFunc` |  |  | Callback that should return the string to use for a tooltip, `tooltipField` takes precedence if set. If using a custom `tooltipComponent` you may return any custom value to be passed to your tooltip component. When the column is grouped, group rows in the generated group column inherit this callback. See [Tooltip Component](https://www.ag-grid.com/javascript-data-grid/tooltips/) for more information. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `tooltipComponent` | `any` |  |  | Provide your own tooltip component for the column. See [Tooltip Component](https://www.ag-grid.com/javascript-data-grid/tooltips/) for more information. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `tooltipComponentSelector` | `TooltipComponentSelectorFunc` |  |  | Callback to select which tooltip component to be used for a given row within the same column. See [Custom Tooltip Component](https://www.ag-grid.com/javascript-data-grid/tooltips/#custom-component) for more information. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `tooltipComponentParams` | `any` |  |  | The params used to configure `tooltipComponent`. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |

### Columns: Width

See [Column Sizing](https://www.ag-grid.com/javascript-data-grid/column-sizing/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `width` | `number` |  |  | Initial width in pixels for the cell. If no width or flex properties set, cell width will default to 200 pixels. |
| `initialWidth` | `number` |  |  | Same as `width`, except only applied when creating a new column. Not applied when updating column definitions. [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `minWidth` | `number` |  |  | Minimum width in pixels for the cell. |
| `maxWidth` | `number` |  |  | Maximum width in pixels for the cell. |
| `flex` | `number \| null` |  |  | Equivalent to `flex-grow` in CSS. When `flex` is set on one or more columns, any `width` value is ignored and instead the remaining free space in the grid is divided among flex columns in proportion to their flex value, so a column with `flex: 2` will be twice the size as one with `flex: 1`. See [Column Flex](https://www.ag-grid.com/javascript-data-grid/column-sizing/#column-flex) for more information. |
| `initialFlex` | `number` |  |  | Same as `flex`, except only applied when creating a new column. Not applied when updating column definitions. [Initial](https://www.ag-grid.com/javascript-data-grid/column-interface/#initial-column-options). |
| `resizable` | `boolean` |  | `true` | Set to `false` to disable resizing which is enabled by default. |
| `suppressSizeToFit` | `boolean` |  | `false` | Set to `true` if you want this column's width to be fixed during 'size to fit' operations. |
| `suppressAutoSize` | `boolean` |  | `false` | Set to `true` if you do not want this column to be auto-resizable during 'size to contents' operations. |

### Groups

For column groups, the property `children` is mandatory. When the grid sees `children` it knows it's a column group.

See [Column Groups](https://www.ag-grid.com/javascript-data-grid/column-groups/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `children` | [`(ColDef \| ColGroupDef)[]`](https://www.ag-grid.com/javascript-data-grid/column-properties/#reference-columnGroups) | Yes |  | A list containing a mix of columns and column groups. |
| `groupId` | `string` |  |  | The unique ID to give the column. This is optional. If missing, a unique ID will be generated. This ID is used to identify the column group in the API. |
| `marryChildren` | `boolean` |  | `false` | Set to `true` to keep columns in this group beside each other in the grid. Moving the columns outside of the group (and hence breaking the group) is not allowed. |
| `openByDefault` | `boolean` |  | `false` | Set to `true` if this group should be opened by default. |
| `columnGroupShow` | `ColumnGroupShowType` |  |  | Whether to only show the column when the group is open / closed. If not set the column is always displayed as part of the group. |
| `toolPanelClass` | `ToolPanelClass` |  |  | CSS class to use for the tool panel cell. Can be a string, array of strings, or function. Module: [`ColumnsToolPanelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `suppressColumnsToolPanel` | `boolean` |  | `false` | Set to `true` if you do not want this column or group to appear in the Columns Tool Panel. Module: [`ColumnsToolPanelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `suppressFiltersToolPanel` | `boolean` |  | `false` | Set to `true` if you do not want this column (filter) or group (filter group) to appear in the Filters Tool Panel. Module: [`ColumnsToolPanelModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `tooltipComponent` | `any` |  |  | Provide your own tooltip component for the column group. See [Tooltip Component](https://www.ag-grid.com/javascript-data-grid/tooltips/) for more information. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `tooltipComponentParams` | `any` |  |  | The params used to configure `tooltipComponent`. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `context` | `any` |  |  | Context property that can be used to associate arbitrary application data with this column definition. |

### Groups:  Header

See [Column Headers](https://www.ag-grid.com/javascript-data-grid/column-headers/) for more information.

| Property | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `headerName` | `string` |  |  | The name to render in the column header. If not specified and field is specified, the field name will be used as the header name. |
| `headerClass` | `HeaderClass` |  |  | CSS class to use for the header cell. Can be a string, array of strings, or function. |
| `headerTooltipValueGetter` | `HeaderTooltipValueGetterFunc` |  |  | Callback that should return the string to use for a tooltip. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `headerTooltip` | `string` |  |  | Tooltip for the column header, `headerTooltipValueGetter` takes precedence if set. When the column is grouped with `groupDisplayType: 'multipleColumns'`, the generated group column header inherits this value. Module: [`TooltipModule`](https://www.ag-grid.com/javascript-data-grid/modules/). |
| `autoHeaderHeight` | `boolean` |  | `false` | If enabled then the column header row will automatically adjust height to accommodate the size of the header cell. This can be useful when using your own `headerComponent` or long header names in conjunction with `wrapHeaderText`. See [Auto Header Height](https://www.ag-grid.com/javascript-data-grid/column-groups/) for more information. |
| `headerGroupComponent` | `any` |  |  | The custom header group component to be used for rendering the component header. If none specified the default AG Grid is used. See [Header Group Component](https://www.ag-grid.com/javascript-data-grid/column-headers/) for more information. |
| `headerGroupComponentParams` | `any` |  |  | The params used to configure the `headerGroupComponent`. |
| `suppressSpanHeaderHeight` | `boolean` |  | `false` | Set to `true` if you don't want the column header for this column to span the whole height of the header container. |
| `suppressStickyLabel` | `boolean` |  | `false` | If `true` the label of the Column Group will not scroll alongside the grid to always remain visible. |