ColumnProps

If false, disables editing for the column's cells in edit mode. Defaults to true, allowing editing.

If false, disables filtering for the column, hiding filter bar or menu. Defaults to true, enabling filtering.

If true, enables searching for the column in the grid's search bar.

If false, disables sorting for the column, preventing header click sorting. Defaults to true, enabling sorting.

Applies a CSS class to individual grid cells either globally or conditionally. Accepts a static class name or a callback function that returns a class name based on cell context. The callback receives a CellClassProps object with the following properties:

• cellType – Identifies the structural role of the cell: Header, Content, or Aggregate. Useful for styling header, data, or summary cells.
• column – The column configuration object associated with the cell.
• data – The full data object for the row containing the cell, enabling conditional styling based on field values.
• rowIndex – The zero-based index of the row.

Defines the cell content's overflow mode. The available modes are

• Clip - Truncates the cell content when it overflows its area.
• Ellipsis - Displays ellipsis when the cell content overflows its area.
• EllipsisWithTooltip - Applies an ellipsis to overflowing cell content and displays a tooltip on hover for enhanced readability.

Default value for the column when adding new records. Ensures consistent initial values for new entries.

If false, encodes HTML in header and content cells, preventing raw HTML rendering. When true, allows raw HTML but requires caution for security.

If true, displays boolean values as checkboxes instead of text.

Custom edit cell configuration for advanced editing, such as custom input types or validation logic. Enhances editing flexibility.

Template for the column's edit UI, as a string, function, or HTML element ID. Customizes the editor during editing.

Defines the field name that maps the column to a specific data source property for data binding operations. Enables sorting and filtering functionality based on the specified field name within the dataset. Strongly recommended to avoid JavaScript reserved words and special characters in the field name for optimal compatibility.

Defines the filter options to customize filtering for the particular column.

Template for the column's filter UI, as a string, function, or HTML element ID. Customizes the filter interface.

Defines the format for cell values (e.g., C2 for currency or custom NumberFormatOptions/DateFormatOptions). Applied before rendering without altering the original data.

Callback function that returns command item buttons for each row in the grid. Receives the current row's data and column configuration to determine which commands to display.

Specifies whether the header checkbox is displayed in the checkbox column. By default, it is enabled when the column type is set to Checkbox in the column definition. The header checkbox allows users to select or deselect all rows at once. To disable the select‑all or deselect‑all functionality, set headerCheckbox to false in the checkbox column definition.

Renders custom content in the header cell using a template string, function, or HTML element ID. Supports advanced header customization like icons or buttons.

Sets the text displayed in the column header. Defaults to the field name if not set. Provides a user-friendly label for the column.

Aligns text specifically in the header cell (e.g., Left, Right, Center). Overrides textAlign for header-specific styling.

Fires when a header cell begins to render or refresh in the grid. Allows transformation of header text for display purposes only. Does not affect the underlying data source.

If true, marks the column as a primary key for unique record identification. Critical for editing, adding and deleting operations.

Fires when a sorting operation begins on a each grid column. Allows overriding the default sorting behavior with custom logic by comparing reference and comparer values. Advanced custom sorting can be implemented using complete row data and the current sort direction context.

• referenceValue - The value from the reference row to compare. Typically the current row being sorted.
• comparerValue - The value from the comparer row to compare against. Used to determine sort order.
• referenceRowData - Optional. Complete data object of the reference row. Useful for advanced sorting logic.
• comparerRowData - Optional. Complete data object of the comparer row. Useful for advanced sorting logic.
• sortDirection - Optional. Current sort direction: 'Ascending', 'Descending', or ''. Helps determine sort logic flow.

Renders custom content in data cells using a template string, function, or HTML element ID. Enables complex or dynamic cell layouts.

Configures the aria-label behavior for cells rendered using column templates. Improves accessibility by providing screen readers with meaningful labels when templates are used in grid columns.

Aligns text in header and content cells (e.g., Left, Right, Center). Enhances visual consistency across the column.

Defines the column’s data type (e.g., string, number, date, or checkbox). The type determines how the grid handles sorting, filtering, formatting, and row selection behavior. By default, the column type is automatically assigned based on the value of the first cell in each column. If the first cell is empty, the column type must be defined manually. Template columns, command columns, and checkbox columns do not require a type definition.

Validation rules for editing (e.g., required, minLength). Ensures valid input during create or update operations.

Fires when a data cell begins to render or refresh in the grid. Allows transformation of cell values for display purposes only. Does not affect the underlying data source.

If false, hides the column. Defaults to true for visibility. Useful for conditional display based on user roles or state.

Defines the column width in pixels (e.g., 100) or percentage (e.g., '20%'). Controls the column's size in the grid layout.