@serenity-is/sleekgrid / GridOptions

Interface: GridOptions<TItem>

Configuration options for the SleekGrid component.

Type Parameters

• TItem = any

The type of items in the grid.

Properties

addNewRowCssClass?

optional addNewRowCssClass: string

CSS class applied to newly added rows for custom styling. Default is "new-row".

Defined in

grid/gridoptions.ts:14

alwaysAllowHorizontalScroll?

optional alwaysAllowHorizontalScroll: boolean

Defaults to false. If true, a horizontal scrollbar is always visible regardless of content width.

Defined in

grid/gridoptions.ts:19

alwaysShowVerticalScroll?

optional alwaysShowVerticalScroll: boolean

Defaults to false. If true, a vertical scrollbar is always visible, useful for fixed-height grids or menus.

Defined in

grid/gridoptions.ts:24

asyncEditorLoadDelay?

optional asyncEditorLoadDelay: number

Defaults to 100. Delay in milliseconds before asynchronous loading of editors.

Defined in

grid/gridoptions.ts:29

asyncEditorLoading?

optional asyncEditorLoading: boolean

Defaults to false. If true, editors are loaded asynchronously, reducing initial rendering load.

Defined in

grid/gridoptions.ts:34

asyncPostCleanupDelay?

optional asyncPostCleanupDelay: number

Defaults to 40. Delay in milliseconds before cleaning up post-rendered elements.

Defined in

grid/gridoptions.ts:39

asyncPostRenderDelay?

optional asyncPostRenderDelay: number

Defaults to -1 which means immediate execution. Delay in milliseconds before starting asynchronous post-rendering.

Defined in

grid/gridoptions.ts:44

autoEdit?

optional autoEdit: boolean

Defaults to true. If true, automatically opens the cell editor when a cell gains focus.

Defined in

grid/gridoptions.ts:49

autoHeight?

optional autoHeight: boolean

Defaults to false. If true, automatically adjusts the grid's height to fit the entire content without scrolling.

Defined in

grid/gridoptions.ts:54

cellFlashingCssClass?

optional cellFlashingCssClass: string

CSS class applied to cells with a flashing effect. Default is "flashing".

Defined in

grid/gridoptions.ts:59

columns?

optional columns: Column<TItem>[]

Array of column definitions for the grid.

Defined in

grid/gridoptions.ts:69

createPreHeaderPanel?

optional createPreHeaderPanel: boolean

Defaults to false. If true, creates an extra pre-header panel for column grouping.

Defined in

grid/gridoptions.ts:74

dataItemColumnValueExtractor()?

optional dataItemColumnValueExtractor: (item, column) => void

Function to extract column values from data items, used for custom copy buffer operations. Default is null.

Parameters

item

TItem

column

Column<TItem>

Returns

void

Defined in

grid/gridoptions.ts:79

defaultColumnWidth?

optional defaultColumnWidth: number

Defaults to 80. Default width of columns in pixels.

Defined in

grid/gridoptions.ts:84

defaultFormat?

optional defaultFormat: ColumnFormat<TItem>

Default formatting options for columns. Default is defaultColumnFormat.

Defined in

grid/gridoptions.ts:89

defaultFormatter?

optional defaultFormatter: CompatFormatter<TItem>

Default formatter function for cells.

Defined in

grid/gridoptions.ts:94

editable?

optional editable: boolean

Defaults to false. If true, cells can be edited inline.

Defined in

grid/gridoptions.ts:99

editCommandHandler()?

optional editCommandHandler: (item, column, command) => void

Function to handle edit commands, useful for implementing custom undo support. Default is null.

Parameters

item

TItem

column

Column<TItem>

command

EditCommand

Returns

void

Defined in

grid/gridoptions.ts:104

editorCellNavOnLRKeys?

optional editorCellNavOnLRKeys: boolean

Defaults to false. If true, enables navigation between cells using left and right arrow keys within the editor.

Defined in

grid/gridoptions.ts:109

editorFactory?

optional editorFactory: EditorFactory

Factory function for creating custom editors. Default is null.

Defined in

grid/gridoptions.ts:114

editorLock?

optional editorLock: EditorLock

Global editor lock instance, used for managing concurrent editor access. Default is GlobalEditorLock.

Defined in

grid/gridoptions.ts:119

emptyNode()?

optional emptyNode: (node) => void

Function to handle clearing a DOM node, used for custom cleanup logic. Default is null.

Parameters

node

Element

Returns

void

Defined in

grid/gridoptions.ts:64

enableAddRow?

optional enableAddRow: boolean

Defaults to false. If true, enables the ability to add new rows to the grid.

Defined in

grid/gridoptions.ts:124

enableAsyncPostRender?

optional enableAsyncPostRender: boolean

Defaults to false. If true, enables asynchronous post-rendering.

Defined in

grid/gridoptions.ts:129

enableAsyncPostRenderCleanup?

optional enableAsyncPostRenderCleanup: boolean

Defaults to false. If true, enables cleanup after asynchronous post-rendering.

Defined in

grid/gridoptions.ts:134

enableCellNavigation?

optional enableCellNavigation: boolean

Defaults to true. If true, enables cell navigation with arrow keys.

Defined in

grid/gridoptions.ts:139

enableCellRangeSelection?

optional enableCellRangeSelection: boolean

Defaults to false. If true, allows selection of cell ranges.

Defined in

grid/gridoptions.ts:144

enableColumnReorder?

optional enableColumnReorder: boolean

Defaults to true. If true, enables column reordering.

Defined in

grid/gridoptions.ts:149

enableRowReordering?

optional enableRowReordering: boolean

Defaults to false. If true, enables row reordering.

Defined in

grid/gridoptions.ts:154

enableTabKeyNavigation?

optional enableTabKeyNavigation: boolean

Defaults to true. If true, enables navigation between cells using the Tab key.

Defined in

grid/gridoptions.ts:159

enableTextSelectionOnCells?

optional enableTextSelectionOnCells: boolean

Defaults to false. If true, enables text selection within cells.

Defined in

grid/gridoptions.ts:164

explicitInitialization?

optional explicitInitialization: boolean

Defaults to false. If true, requires explicit initialization of the grid.

Defined in

grid/gridoptions.ts:169

footerRowHeight?

optional footerRowHeight: number

Defaults to 30. Height of the footer row in pixels.

Defined in

grid/gridoptions.ts:174

forceFitColumns?

optional forceFitColumns: boolean

Defaults to false. If true, forces columns to fit the grid width.

Defined in

grid/gridoptions.ts:179

forceSyncScrolling?

optional forceSyncScrolling: boolean

Defaults to false. If true, synchronizes scrolling between the grid and its container.

Defined in

grid/gridoptions.ts:184

forceSyncScrollInterval?

optional forceSyncScrollInterval: number

Defaults to 250. Interval in milliseconds for synchronizing scrolling when forceSyncScrolling is enabled.

Defined in

grid/gridoptions.ts:189

formatterFactory?

optional formatterFactory: FormatterFactory<any>

Factory function for creating custom formatters. Default is null.

Defined in

grid/gridoptions.ts:194

frozenBottom?

optional frozenBottom: boolean

Defaults to false. If true, places frozen rows at the bottom edge of the grid.

Defined in

grid/gridoptions.ts:199

frozenColumns?

optional frozenColumns: number

Defaults to undefined. If specified, freezes the given number of columns on the left edge of the grid. Prefer setting column.frozen = 'true' for individual columns as this is only for compatibility.

Defined in

grid/gridoptions.ts:205

frozenRows?

optional frozenRows: number

Defaults to undefined. If specified, freezes the given number of rows at the top or bottom edge of the grid based on frozenBottom.

Defined in

grid/gridoptions.ts:211

fullWidthRows?

optional fullWidthRows: boolean

Defaults to false. If true, makes rows take the full width of the grid.

Defined in

grid/gridoptions.ts:216

groupingPanel?

optional groupingPanel: boolean

Defaults to false. If true, shows the grouping panel for grouping columns.

Defined in

grid/gridoptions.ts:221

groupingPanelHeight?

optional groupingPanelHeight: number

Defaults to 30. Height of the grouping panel in pixels.

Defined in

grid/gridoptions.ts:226

groupTotalsFormatter()?

optional groupTotalsFormatter: (p1?, p2?, grid?) => string

Function to format group totals for display in the grouping panel.

Parameters

p1?

GroupTotals<TItem>

p2?

Column<TItem>

grid?

any

Returns

string

Defined in

grid/gridoptions.ts:231

headerRowHeight?

optional headerRowHeight: number

Defaults to 30. Height of the header row in pixels.

Defined in

grid/gridoptions.ts:236

jQuery?

optional jQuery: object

jQuery object for compatibility or custom integration purposes. Default is undefined unless jQuery is available in the global object (e.g. window).

fn

fn: any

ready

ready: any

Defined in

grid/gridoptions.ts:241

layoutEngine?

optional layoutEngine: LayoutEngine

Layout engine for custom grid layouts. Default is BasicLayout. Use FrozenLayout to enable frozen columns / rows.

Defined in

grid/gridoptions.ts:251

leaveSpaceForNewRows?

optional leaveSpaceForNewRows: boolean

Defaults to false. If true, leaves space for new rows in the DOM visible buffer.

Defined in

grid/gridoptions.ts:246

minBuffer?

optional minBuffer: number

Defaults to 3. Minimum number of rows to keep in the buffer.

Defined in

grid/gridoptions.ts:256

multiColumnSort?

optional multiColumnSort: boolean

Defaults to false. If true, allows sorting by multiple columns simultaneously.

Defined in

grid/gridoptions.ts:261

multiSelect?

optional multiSelect: boolean

Defaults to true. If true, enables multiple cell selection.

Defined in

grid/gridoptions.ts:266

preHeaderPanelHeight?

optional preHeaderPanelHeight: number

Sets grouping panel height. Default is undefined, e.g. it is set via CSS.

Defined in

grid/gridoptions.ts:271

removeNode()?

optional removeNode: (node) => void

Function to handle removing a DOM node, used for custom cleanup logic. Default is null or jQuery.remove if available.

Parameters

node

Element

Returns

void

Defined in

grid/gridoptions.ts:289

renderAllCells?

optional renderAllCells: boolean

Defaults to false. If true, renders all cells (row columns) in the viewport, at the cost of higher memory usage and reduced performance.

Defined in

grid/gridoptions.ts:276

renderAllRows?

optional renderAllRows: boolean

Defaults to false. If true, renders all rows in the viewport, at the cost of higher memory usage and reduced performance. When both renderAllCells and renderAllRows are true, all cells in the grid are rendered (e.g. virtualization is disabled), which can be very slow for large datasets, but may be desired to keep all rows and cells in the DOM for accessibility purposes, proper tabbing and screen reader support.

Defined in

grid/gridoptions.ts:284

rowHeight?

optional rowHeight: number

Defaults to 30. Height of rows in pixels.

Defined in

grid/gridoptions.ts:294

rtl?

optional rtl: boolean

Default is based on document element's (<html/>) dir property.. If true, enables right-to-left text direction.

Defined in

grid/gridoptions.ts:299

sanitizer()?

optional sanitizer: (dirtyHtml) => string

Optional function for sanitizing HTML strings to avoid XSS attacks. Default is DOMPurify.sanitize if available globally, otherwise falls back to basicRegexSanitizer.