import type { AutoSize, GridAutosizeColsModeValue, CellPosition, CellViewportRange, Column, ColumnMetadata, ColumnSort, CssStyleHash, CSSStyleDeclarationWritable, CustomDataView, DOMEvent, DragPosition, DragRowMove, Editor, EditorConstructor, EditController, Formatter, FormatterResultWithHtml, FormatterResultWithText, GridOption as BaseGridOption, InteractionBase, ItemMetadata, RowInfo, MenuCommandItemCallbackArgs, MultiColumnSort, OnActivateChangedOptionsEventArgs, OnActiveCellChangedEventArgs, OnAddNewRowEventArgs, OnAfterSetColumnsEventArgs, OnAutosizeColumnsEventArgs, OnColumnsEventArgs, OnBeforeCellEditorDestroyEventArgs, OnBeforeColumnsResizeEventArgs, OnBeforeEditCellEventArgs, OnBeforeHeaderCellDestroyEventArgs, OnBeforeHeaderRowCellDestroyEventArgs, OnBeforeFooterRowCellDestroyEventArgs, OnBeforeSetColumnsEventArgs, OnCellChangeEventArgs, OnCellCssStylesChangedEventArgs, OnClickEventArgs, OnColumnsDragEventArgs, OnColumnsReorderedEventArgs, OnColumnsResizedEventArgs, OnColumnsResizeDblClickEventArgs, OnCompositeEditorChangeEventArgs, OnDblClickEventArgs, OnFooterContextMenuEventArgs, OnFooterRowCellRenderedEventArgs, OnHeaderCellRenderedEventArgs, OnFooterClickEventArgs, OnHeaderClickEventArgs, OnHeaderContextMenuEventArgs, OnHeaderKeyDownEventArgs, OnHeaderMouseEventArgs, OnHeaderRowCellRenderedEventArgs, OnKeyDownEventArgs, OnPreHeaderContextMenuEventArgs, OnPreHeaderClickEventArgs, OnRenderedEventArgs, OnSelectedRowsChangedEventArgs, OnSetOptionsEventArgs, OnScrollEventArgs, OnValidationErrorEventArgs, OnDragReplaceCellsEventArgs, PagingInfo, SelectionModel, SingleColumnSort, SlickPlugin, ColumnDockingBand, ColumnDockingLayout, ColumnPinningReferences, DockedColumn, DockedRow, DockingSide, PinnedColumns, RowReference, RowDockingLayout, ElementPosition } from './models/index.js'; import { type BasePubSub, BindingEventService as BindingEventService_, DockingController as DockingController_, RowPositionIndexer as RowPositionIndexer_, type SlickEditorLock, SlickEvent as SlickEvent_, SlickEventData as SlickEventData_, SlickRange as SlickRange_ } from './slick.core.js'; /** * @license * (c) 2009-present Michael Leibman * michael{dot}leibman{at}gmail{dot}com * http://github.com/mleibman/slickgrid * * Distributed under MIT license. * All rights reserved. * * SlickGrid v6.0.0 * * NOTES: * Cell/row DOM manipulations are done directly bypassing JS DOM manipulation methods. * This increases the speed dramatically, * but can only be done safely because there are no event handlers * or data associated with any cell/row DOM nodes. Cell editors must make sure they implement .destroy() * and do proper cleanup. */ interface RowCaching { rowNode: HTMLElement[] | null; cellRegions?: { center: HTMLElement; left: HTMLElement; right: HTMLElement; }; /** Signature of the row-docking state the row was last synchronized against. */ dockingSyncSignature?: string; /** Whether the row hosts a rowspan (from rendered cells or metadata). */ rowSpanHost?: boolean; /** Whether the row hosts or is covered by a rowspan; such rows are `top`-positioned. */ rowSpanIntersect?: boolean; cellColSpans: Array; cellNodesByColumnIdx: HTMLElement[]; cellRenderQueue: any[]; cellSpanFragments: Record; cellSpanSegments: Record>; } export declare class SlickGrid = Column, O extends BaseGridOption = BaseGridOption> { protected readonly container: HTMLElement | string; protected data: CustomDataView | TData[]; protected columns: C[]; protected readonly externalPubSub?: BasePubSub | undefined; slickGridVersion: string; /** Optional grid state client id retained for plugin compatibility. */ cid: string; onActiveCellChanged: SlickEvent_; onActiveCellPositionChanged: SlickEvent_<{ grid: SlickGrid; }>; onActivateChangedOptions: SlickEvent_; onAddNewRow: SlickEvent_; onAfterSetColumns: SlickEvent_; onAutosizeColumns: SlickEvent_; onBeforeCellEditorDestroy: SlickEvent_; onBeforeColumnsResize: SlickEvent_; onBeforeDestroy: SlickEvent_<{ grid: SlickGrid; }>; onBeforeEditCell: SlickEvent_; onBeforeFooterRowCellDestroy: SlickEvent_; onBeforeHeaderCellDestroy: SlickEvent_; onBeforeHeaderRowCellDestroy: SlickEvent_; onBeforeRemoveCachedRow: SlickEvent_<{ row: number; grid: SlickGrid; }>; onBeforeSetColumns: SlickEvent_; onBeforeSort: SlickEvent_; onBeforeUpdateColumns: SlickEvent_; onAfterUpdateColumns: SlickEvent_; onCellChange: SlickEvent_; onCellCssStylesChanged: SlickEvent_; onClick: SlickEvent_; onColumnsReordered: SlickEvent_; onColumnsDrag: SlickEvent_; onColumnsResized: SlickEvent_; onColumnsResizeDblClick: SlickEvent_; onCompositeEditorChange: SlickEvent_; onContextMenu: SlickEvent_; onDblClick: SlickEvent_; onDrag: SlickEvent_; onDragInit: SlickEvent_; onDragStart: SlickEvent_; onDragEnd: SlickEvent_; onFooterClick: SlickEvent_; onFooterContextMenu: SlickEvent_; onFooterRowCellRendered: SlickEvent_; onHeaderCellRendered: SlickEvent_; onHeaderClick: SlickEvent_; onHeaderContextMenu: SlickEvent_; onHeaderMouseEnter: SlickEvent_; onHeaderMouseLeave: SlickEvent_; onHeaderMouseOver: SlickEvent_; onHeaderMouseOut: SlickEvent_; onHeaderKeyDown: SlickEvent_; onHeaderRowCellRendered: SlickEvent_; onHeaderRowMouseEnter: SlickEvent_; onHeaderRowMouseLeave: SlickEvent_; onHeaderRowMouseOver: SlickEvent_; onHeaderRowMouseOut: SlickEvent_; onKeyDown: SlickEvent_; onMouseEnter: SlickEvent_; onMouseLeave: SlickEvent_; onPreHeaderClick: SlickEvent_; onPreHeaderContextMenu: SlickEvent_; onRendered: SlickEvent_; onScroll: SlickEvent_; onSelectedRowsChanged: SlickEvent_; onSetOptions: SlickEvent_; onSort: SlickEvent_; onValidationError: SlickEvent_; onViewportChanged: SlickEvent_<{ grid: SlickGrid; }>; onDragReplaceCells: SlickEvent_; protected scrollbarDimensions?: { height: number; width: number; }; protected maxSupportedCssHeight: number; protected canvas: HTMLCanvasElement | null; protected canvas_context: CanvasRenderingContext2D | null; protected _isResizingColumn: boolean; protected _columnResizeAutoScrollTimer?: ReturnType; protected _options: O; protected logMessageCount: number; protected logMessageMaxCount: number; protected _defaults: BaseGridOption; protected _columnDefaults: Partial; protected _columnAutosizeDefaults: AutoSize; protected _columnResizeTimer?: any; protected _executionBlockTimer?: any; protected _flashCellTimer?: any; protected _highlightRowTimer?: any; protected th: number; protected h: number; protected ph: number; protected n: number; protected cj: number; protected page: number; protected offset: number; protected vScrollDir: number; protected _bindingEventService: BindingEventService_; protected initialized: boolean; protected _container: HTMLElement; protected uid: string; protected dragReplaceEl: any; protected _focusSink: HTMLDivElement; protected _focusSink2: HTMLDivElement; protected _headerScroller: HTMLDivElement[]; protected _headers: HTMLDivElement[]; protected _headerRows: HTMLDivElement[]; protected _headerRowScroller: HTMLDivElement[]; protected _headerRowSpacerL: HTMLDivElement; protected _footerRow: HTMLDivElement[]; protected _footerRowScroller: HTMLDivElement[]; protected _footerRowSpacerL: HTMLDivElement; protected _preHeaderPanel: HTMLDivElement; protected _preHeaderPanelScroller: HTMLDivElement; protected _preHeaderPanelSpacer: HTMLDivElement; protected _preHeaderPanelR: HTMLDivElement; protected _topHeaderPanel: HTMLDivElement; protected _topHeaderPanelScroller: HTMLDivElement; protected _topHeaderPanelSpacer: HTMLDivElement; protected _topPanelScrollers: HTMLDivElement[]; protected _topPanels: HTMLDivElement[]; protected _viewport: HTMLDivElement[]; protected _canvas: HTMLDivElement[]; protected _style?: HTMLStyleElement; protected stylesheet?: { cssRules: Array<{ selectorText: string; }>; } | null; protected columnCssRulesL?: Array<{ selectorText: string; }>; protected columnCssRulesR?: Array<{ selectorText: string; }>; protected viewportH: number; protected viewportW: number; protected canvasWidth: number; protected canvasWidthL: number; protected canvasWidthR: number; protected headersWidth: number; protected headersWidthL: number; protected headersWidthR: number; protected viewportHasHScroll: boolean; protected viewportHasVScroll: boolean; protected headerColumnWidthDiff: number; protected headerColumnHeightDiff: number; protected cellWidthDiff: number; protected cellHeightDiff: number; protected absoluteColumnMinWidth: number; protected rowPositionIndexer?: RowPositionIndexer_; protected rowHeightsDirty: boolean; /** flag to indicate if an invalid pinning alert has been shown already or not */ protected _invalidPinningAlerted: boolean; protected paneTopH: number; protected viewportTopH: number; protected topPanelH: number; protected headerRowH: number; protected footerRowH: number; protected tabbingDirection: number; protected _activeCanvasNode: HTMLDivElement; protected _activeViewportNode: HTMLDivElement; protected activePosX: number; protected activePosY: number; protected activeRow: number; protected activeCell: number; protected activeCellNode: HTMLDivElement | null; protected currentEditor: Editor | null; protected serializedEditorValue: any; protected editController?: EditController; protected _prevDataLength: number; protected _prevInvalidatedRowsCount: number; protected _rowSpanIsCached: boolean; protected _colsWithRowSpanCache: { [colIdx: number]: Set; }; protected rowsCache: Record; protected renderedRows: number; protected numVisibleRows: number; protected prevScrollTop: number; protected scrollHeight: number; protected scrollTop: number; protected lastRenderedScrollTop: number; protected lastRenderedScrollLeft: number; protected prevScrollLeft: number; protected scrollLeft: number; protected selectionBottomRow: number; protected selectionRightCell: number; protected selectionModel?: SelectionModel; protected selectedRangesChangedHandler: (e: SlickEventData_, ranges: SlickRange_[]) => void; protected selectedRows: number[]; protected selectedRanges: SlickRange_[]; protected plugins: SlickPlugin[]; protected cellCssClasses: CssStyleHash; protected cellCssClassesByCell: CssStyleHash; protected columnsById: Record; protected visibleColumnsById: Record; protected dockingController: DockingController_; protected dockingLayout: ColumnDockingLayout; protected dockingByColumn: Map; protected rowDockingLayout: RowDockingLayout; protected dockingByRow: Map; protected dockingRowIndexByReference: Map; /** Set when row references were invalidated; the next render re-resolves the row docking layout. */ protected rowDockingStale: boolean; protected dockingChromeByColumn: Map; protected sortColumns: ColumnSort[]; protected columnPosLeft: number[]; protected columnPosRight: number[]; protected pagingActive: boolean; protected pagingIsLastPage: boolean; protected scrollThrottle: { enqueue: () => void; dequeue: () => void; }; /** Defers expensive horizontal virtual-cell renders so compositor offsets can paint first. */ protected singleViewportRenderTimer?: number; protected animationFrameTimeouts: Set; /** Coalesces sticky-column resolution to one layout pass per animation frame. */ protected stickyColumnLayoutFrame?: number; protected h_editorLoader?: any; protected h_postrender?: any; protected h_postrenderCleanup?: any; protected postProcessedRows: any; protected postProcessToRow: number; protected postProcessFromRow: number; protected postProcessedCleanupQueue: Array<{ actionType: string; groupId: number; node: HTMLElement | HTMLElement[]; columnIdx?: number; rowIdx?: number; }>; protected postProcessgroupId: number; protected counter_rows_rendered: number; protected counter_rows_removed: number; protected _headerRoot: HTMLDivElement; protected _contentRoot: HTMLDivElement; protected _headerScrollerL: HTMLDivElement; protected _headerL: HTMLDivElement; protected _headerRowScrollerL: HTMLDivElement; protected _footerRowScrollerL: HTMLDivElement; protected _headerRowL: HTMLDivElement; protected _footerRowL: HTMLDivElement; protected _topPanelScrollerL: HTMLDivElement; protected _topPanelL: HTMLDivElement; protected _viewportNode: HTMLDivElement; protected _canvasNode: HTMLDivElement; protected _dockingOverlay?: HTMLDivElement; protected _dockingHorizontalScroller?: HTMLDivElement; protected _dockingHorizontalSpacer?: HTMLDivElement; /** Whether the proxy track is currently taking layout height beside the viewport. */ protected dockingHorizontalScrollbarReserved: boolean; /** Guards the viewport resize that a change in that reservation triggers. */ protected resizingForDockingScrollbar: boolean; /** Persistent semantic left/center/right wrappers for the single header roots. */ protected dockingHeaderRegions?: Record; protected dockingHeaderRowRegions?: Record; protected dockingFooterRowRegions?: Record; protected _viewportScrollContainerX: HTMLDivElement; protected _viewportScrollContainerY: HTMLDivElement; protected _headerScrollContainer: HTMLDivElement; protected _headerRowScrollContainer: HTMLDivElement; protected _footerRowScrollContainer: HTMLDivElement; protected cssShow: { position: string; visibility: string; display: string; }; protected _hiddenParents: HTMLElement[]; protected oldProps: Array>; protected columnResizeDragging: boolean; /** Whether resizeCanvas currently owns an inline auto-height value on the grid container. */ protected autoHeightContainerSizeApplied: boolean; /** Cached result for the per-cell docking-region branch in the renderer. */ protected dockingRowRegionsActive: boolean; protected slickDraggableInstance: InteractionBase | null; protected slickMouseWheelInstances: Array; protected dockingOverlayMouseWheelBound: boolean; protected slickResizableInstances: Array; protected _columnReorderDrag?: InteractionBase; protected _pubSubService?: BasePubSub; /** Original pin states for columns changed by the unified pinning option, keyed by stable column id. */ protected pinningColumnsState: Map; /** * Creates a new instance of the grid. * @class SlickGrid * @constructor * @param {Node} container - Container node to create the grid in. * @param {Array|Object} data - An array of objects for databinding or an external DataView. * @param {Array} columns - An array of column definitions. * @param {Object} [options] - Grid Options * @param {Object} [externalPubSub] - optional External PubSub Service to use by SlickEvent **/ constructor(container: HTMLElement | string, data: CustomDataView | TData[], columns: C[], options: Partial, externalPubSub?: BasePubSub | undefined); /** Initializes the grid. */ init(): void; /** * Processes the provided grid options (mixing in default settings as needed), * validates required modules (for example, ensuring the column reorder drag module is loaded if column reordering is enabled), * and creates all necessary DOM elements for the grid (including header containers, viewports, canvases, panels, etc.). * It also caches CSS if the container or its ancestors are hidden and calls finish. * * @param {Partial} options - Partial grid options to be applied during initialization. */ protected initialize(options: Partial): void; /** * Completes grid initialisation by calculating viewport dimensions, measuring cell padding and border differences, * disabling text selection (except on editable inputs), setting docking options and viewport visibility, * updating column caches, creating column headers and footers, setting up column sorting, * creating CSS rules, binding ancestor scroll events, and binding various event handlers * (e.g. for scrolling, mouse, keyboard, drag-and-drop). * It also starts up any asynchronous post–render processing if enabled. */ protected finishInitialization(): void; /** Create the cell drag interaction using the active selection model's modifier-key policy. */ protected createDraggable(): void; /** * Finds all container ancestors/parents (including the grid container itself) that are hidden (i.e. have display:none) * and temporarily applies visible CSS properties (absolute positioning, hidden visibility, block display) * so that dimensions can be measured correctly. * It stores the original CSS properties in an internal array for later restoration. * * Related to issue: https://github.com/6pac/SlickGrid/issues/568 */ cacheCssForHiddenInit(): void; /** * Registers an external plugin to the grid’s internal plugin list. * Once added, it immediately initialises the plugin by calling its init() * method with the grid instance. * @param {T} plugin - The plugin instance to be registered. */ registerPlugin(plugin: T): void; /** * Unregister (destroy) an external Plugin. * Searches for the specified plugin in the grid’s plugin list. * When found, it calls the plugin’s destroy() method and removes the plugin from the list, * thereby unregistering it from the grid. * @param {T} plugin - The plugin instance to be registered. */ unregisterPlugin(plugin: SlickPlugin): void; /** * Destroy (dispose) of SlickGrid * * Unbinds all event handlers, cancels any active cell edits, triggers the onBeforeDestroy event, * unregisters and destroys plugins, destroys column reorder and other interaction instances, * unbinds ancestor scroll events, removes CSS rules, unbinds events from all key DOM elements * (canvas, viewports, header, footer, etc.), empties the grid container, removes the grid’s uid class, * and clears all timers. Optionally, if shouldDestroyAllElements is true, * calls destroyAllElements to nullify all DOM references. * * @param {boolean} shouldDestroyAllElements - do we want to destroy (nullify) all DOM elements as well? This help in avoiding mem leaks */ destroy(shouldDestroyAllElements?: boolean): void; /** * Drops every DOM reference the instance still holds so a retained grid object cannot keep the * detached tree alive. Fields are selected by content (an element, a non-empty array of elements, * or a plain record of elements), so new element fields are covered without a name list. */ protected destroyElementReferences(): void; /** * Call destroy method, when exists, on all the instance(s) it found * * Given either a single instance or an array of instances (e.g. draggable, mousewheel, resizable), * pops each one and calls its destroy method if available, then resets the input to an empty array * (or null for a single instance). Returns the reset value. * * @params instances - can be a single instance or a an array of instances */ protected destroyAllInstances(inputInstances: null | InteractionBase | Array): InteractionBase[] | null; /** Returns an object containing all of the Grid options set on the grid. See a list of Grid Options here. */ getOptions(): O; /** * Extends grid options with a given hash. If an there is an active edit, the grid will attempt to commit the changes and only continue if the attempt succeeds. * @param {Object} options - an object with configuration options. * @param {Boolean} [suppressRender] - do we want to supress the grid re-rendering? (defaults to false) * @param {Boolean} [suppressColumnSet] - do we want to supress the columns set, via "setColumns()" method? (defaults to false) * @param {Boolean} [suppressSetOverflow] - do we want to suppress the call to `setOverflow` */ setOptions(newOptions: Partial, suppressRender?: boolean, suppressColumnSet?: boolean, suppressSetOverflow?: boolean): void; /** * If option.mixinDefaults is true then external code maintains a reference to the options object. In this case there is no need * to call setOptions() - changes can be made directly to the object. However setOptions() also performs some recalibration of the * grid in reaction to changed options. activateChangedOptions call the same recalibration routines as setOptions() would have. * @param {Boolean} [suppressRender] - do we want to supress the grid re-rendering? (defaults to false) * @param {Boolean} [suppressColumnSet] - do we want to supress the columns set, via "setColumns()" method? (defaults to false) * @param {Boolean} [suppressSetOverflow] - do we want to suppress the call to `setOverflow` */ activateChangedOptions(suppressRender?: boolean, suppressColumnSet?: boolean, suppressSetOverflow?: boolean): void; /** * Attempts to commit any active cell edit via the editor lock; if successful, calls makeActiveCellNormal to exit edit mode. * * @returns {void} - Does not return a value. */ protected prepareForOptionsChange(): void; /** * Depending on new options, sets column header visibility, validates options, applies docking options, * forces viewport height recalculation if needed, updates viewport overflow, re-renders the grid (unless suppressed), * sets the scroller elements, and reinitialises mouse wheel scrolling as needed. * * @param {boolean} [suppressRender] - If `true`, prevents the grid from re-rendering. * @param {boolean} [suppressColumnSet] - If `true`, prevents the columns from being reset. * @param {boolean} [suppressSetOverflow] - If `true`, prevents updating the viewport overflow setting. */ protected internal_setOptions(suppressRender?: boolean, suppressColumnSet?: boolean, suppressSetOverflow?: boolean): void; /** * Builds the footer-row DOM (scrollers, spacers and footer-row containers) in the * single viewport — the construction path shared by init and by a runtime * `setOptions({ createFooterRow: true })` enable. On an already-initialized grid it * also binds the footer events (during init they are bound in `finishInitialization`). * Runtime disable hides the footer rather than destroying it (symmetric with * `showFooterRow`). */ protected materializeFooterRow(): void; /** * * Ensures consistency in option setting, by thastIF autoHeight IS enabled, leaveSpaceForNewRows is set to FALSE. * And, if forceFitColumns is True, then autosizeColsMode is set to LegacyForceFit. */ validateAndEnforceOptions(): void; /** * Unregisters a current selection model and registers a new one. See the definition of SelectionModel for more information. * @param {Object} selectionModel A SelectionModel. */ setSelectionModel(model: SelectionModel): void; /** Returns the current SelectionModel. See here for more information about SelectionModels. */ getSelectionModel(): T | undefined; /** * Updates an existing column definition and a corresponding header DOM element with the new title and tooltip. * @param {Number|String} columnId Column id. * @param {string | HTMLElement | DocumentFragment} [title] New column name. * @param {String} [toolTip] New column tooltip. */ updateColumnHeader(columnId: number | string, title?: string | HTMLElement | DocumentFragment, toolTip?: string): HTMLElement | void; /** * Get the Header DOM element * @param {C} columnDef - column definition */ getHeader(columnDef?: C): HTMLDivElement | HTMLDivElement[]; /** * Get a specific Header Column DOM element by its column Id or index * @param {Number|String} columnIdOrIdx - column Id or index */ getHeaderColumn(columnIdOrIdx: number | string): HTMLDivElement; /** Get the Header Row DOM element */ getHeaderRow(): HTMLDivElement | HTMLDivElement[]; /** Get the Footer DOM element */ getFooterRow(): HTMLDivElement | HTMLDivElement[]; /** * Get Header Row Column DOM element by its column Id or index * @param {Number|String} columnIdOrIdx - column Id or index */ getHeaderRowColumn(columnIdOrIdx: number | string): HTMLDivElement; /** * Get the Footer Row Column DOM element by its column Id or index * @param {Number|String} columnIdOrIdx - column Id or index */ getFooterRowColumn(columnIdOrIdx: number | string): HTMLDivElement; /** * If footer rows are enabled, clears existing footer cells then iterates over all columns. * For each visible column, it creates a footer cell element (adding docking classes if needed), * stores the column definition in the element’s storage, and triggers the onFooterRowCellRendered event. */ protected createColumnFooter(): void; /** * For each header container, binds a click event that— * if the clicked header is sortable and no column resizing is in progress— * --> toggles the sort direction (or adds/removes the column in a multi–column sort), * --> triggers onBeforeSort * --> and if not cancelled, updates the sort columns and triggers onSort. */ protected setupColumnSort(): void; /** * Clears any existing header cells and header row cells, recalculates header widths, * then iterates over each visible column to create header cell elements * (and header row cells if enabled) with appropriate content, CSS classes, event bindings, * and sort indicator elements. Also triggers before–destroy and rendered events as needed. */ protected createColumnHeaders(): void; /** * Enables or disables automatic header height handling. */ protected handleAutoHeaderHeightChange(): void; /** * Measures natural header heights and applies one common height to all header panes. */ protected recalculateHeaderHeight(): void; /** * Destroys any existing column reorder drag instance and sets up native HTML5 drag & drop on the * header container, or on each docking band's header region. Configures callbacks (onDragStart, onDragEnd) * that snapshot the current column order, update the column order, set columns, trigger onColumnsReordered, * and reapply column resizing. */ protected setupColumnReorder(): void; /** * Returns a concatenated array containing the children (header column elements) from both the left and right header containers. * @returns {HTMLElement[]} - An array of header column elements. */ protected getHeaderChildren(): HTMLElement[]; /** * When a resizable handle is double–clicked, extracts the column identifier from the parent element’s id * (by removing the grid uid) and triggers the onColumnsResizeDblClick event with that identifier. * @param {MouseEvent & { target: HTMLDivElement }} evt - The double-click event on the resizable handle. */ protected handleResizeableDoubleClick(evt: MouseEvent & { target: HTMLDivElement; }): void; /** * Ensures the Resizable module is available and then iterates over header children to remove * any existing resizable handles. Determines which columns are resizable (tracking the first * and last resizable columns) and for each eligible column, creates a resizable handle, * binds a double–click event, and creates a Resizable instance with callbacks for onResizeStart, * onResize, and onResizeEnd. These callbacks manage column width adjustments (including force–fit * and docked column considerations), update header and canvas widths, trigger related events, * and re–render the grid as needed. * @returns {void} */ protected setupColumnResize(): void; /** * Proportionally resize a specific column by its name, index or Id * * Resizes based on its content, but determines the column definition from the provided identifier or index. * Then, obtains a grid canvas and calls getColAutosizeWidth to compute and update the column’s width. */ autosizeColumn(columnOrIndexOrId: number | string, isInit?: boolean): void; /** * Returns true if the column should be treated as locked (i.e. not resized) based on autosize settings. * The decision is based on whether header text is not ignored, sizeToRemaining is false, * content size equals header width, and the current width is less than a pixel threshold (default 100px). * * @param {AutoSize} [autoSize={}] - The autosize configuration for the column. * @returns {boolean} - Returns `true` if the column should be treated as locked, otherwise `false`. */ protected treatAsLocked(autoSize?: AutoSize): boolean; /** Proportionately resizes all columns to fill available horizontal space. * This does not take the cell contents into consideration. * * It does this by temporarily caching CSS for hidden containers, calling the internal autosizing logic * (internalAutosizeColumns) with the autosize mode and initialisation flag, * then restores the original CSS. */ autosizeColumns(autosizeMode?: GridAutosizeColsModeValue, isInit?: boolean): void; /** * Implements the main autosizing algorithm. Depending on the autosize mode, * it may call legacyAutosizeColumns (for legacy force–fit modes), or proceed * to compute column widths based on available viewport width. It iterates over columns * to accumulate total widths, locked widths, and then adjusts widths proportionally. * Finally, it calls reRenderColumns to update the grid. * * @param {string} [autosizeMode] - The autosize mode. If undefined, defaults to `autosizeColsMode` from options. * @param {boolean} [isInit] - If `true`, applies initial settings for autosizing. */ protected internalAutosizeColumns(autosizeMode?: GridAutosizeColsModeValue, isInit?: boolean): void; /** * Calculates the ideal autosize width for a given column. First, it sets the default width from the column definition. * If the autosize mode is not Locked or Guide, then for ContentIntelligent mode it determines the column’s data type * (handling booleans, numbers, strings, dates, moments) and adjusts autosize settings accordingly. * It then calls getColContentSize to compute the width needed by the content, applies an additional * percentage multiplier and padding, clamps to min/max widths, and if in ContentExpandOnly mode ensures * the width is at least the default width. The computed width is stored in autoSize.widthPx. * * @param {C} columnDef - The column definition containing autosize settings and constraints. * @param {number} colIndex - The index of the column within the grid. * @param {HTMLElement} gridCanvas - The grid's canvas element where temporary elements will be created. * @param {boolean} isInit - If `true`, applies initial settings for row selection mode. * @param {number} colArrayIndex - The index of the column in the column array (used for multi-column adjustments). */ protected getColAutosizeWidth(columnDef: C, colIndex: number, gridCanvas: HTMLElement, isInit: boolean, colArrayIndex: number): void; /** * Determines the width needed to render a column’s content. It first measures the header width (if not ignored) * and uses it as a baseline. If an explicit colValueArray is provided, it measures that; otherwise, it creates * a RowInfo object to select a range of rows based on the rowSelectionMode. Depending on the valueFilterMode * (e.g. DeDuplicate, GetGreatestAndSub, GetLongestTextAndSub, GetLongestText), it adjusts the values to measure. * It then calls getColWidth (using either canvas text measurement or DOM measurement) and returns the maximum * of the header width and computed content width (adjusted by a ratio, if applicable). * * @param {C} columnDef - The column definition containing formatting and auto-sizing options. * @param {number} colIndex - The index of the column within the grid. * @param {HTMLElement} gridCanvas - The grid's canvas element where temporary elements will be created. * @param {boolean} isInit - If `true`, applies initial row selection mode settings. * @param {number} colArrayIndex - The index of the column in the column array (used for multi-column adjustments). * @returns {number} - The computed optimal column width in pixels. */ protected getColContentSize(columnDef: C, colIndex: number, gridCanvas: HTMLElement, isInit: boolean, colArrayIndex: number): number; /** * Creates a temporary row and cell element (with absolute positioning, hidden visibility, and nowrap) and iterates * over the selected rows (as defined in a RowInfo object or provided value array) to render the cell content using * the column formatter. If in text-only mode and canvas measurement is enabled, uses canvas.measureText; * otherwise, uses DOM offsetWidth after applying the formatter result to the cell. * Returns the maximum measured width. * * @param {C} columnDef - The column definition containing formatting and auto-sizing options. * @param {HTMLElement} gridCanvas - The grid's canvas element where the temporary row will be added. * @param {RowInfo} rowInfo - Object containing row start/end indices and values for width evaluation. * @returns {number} - The computed optimal column width in pixels. */ protected getColWidth(columnDef: C, gridCanvas: HTMLElement, rowInfo: RowInfo): number; /** * Determines the width of a column header by first attempting to find the header element using an ID composed of the * grid’s uid and the column’s id. If found, clones the element, makes it absolutely positioned and hidden, * inserts it into the DOM, measures its offsetWidth, and then removes it. If the header element does not exist yet, * creates a temporary header element with the column’s name and measures its width before removing it. * Returns the computed header width. * * @param {C} columnDef - The column definition containing the header information. * @returns {number} - The computed width of the column header in pixels. */ protected getColHeaderWidth(columnDef: C): number; /** * Iterates over all columns to collect current widths (skipping hidden ones), calculates total width * and available shrink leeway, then enters a “shrink” loop if the total width exceeds the available * viewport width and a “grow” loop if below. Finally, it applies the computed widths to the columns * and calls reRenderColumns (with a flag if any width changed) to update the grid. */ protected legacyAutosizeColumns(): void; /** * Apply Columns Widths in the UI and optionally invalidate & re-render the columns when specified * @param {Boolean} shouldReRender - should we invalidate and re-render the grid? */ reRenderColumns(reRender?: boolean): void; /** * Returns an array of column definitions filtered to exclude any that are marked as hidden. * * @returns */ getVisibleColumns(): C[]; /** Returns the index of a visible column by its id. */ getVisibleColumnIndex(id: number | string): number; /** Returns the column object by its id. */ getColumnById(id: number | string): C | null; /** Updates column properties by id and optionally refreshes the grid columns. */ updateColumnById(columnId: number | string, props: Partial, forceColumnUpdate?: boolean): void; /** * Returns the index of a column with a given id. Since columns can be reordered by the user, this can be used to get the column definition independent of the order: * @param {String | Number} id A column id. */ getColumnIndex(id: number | string): number; /** * Iterates over the header elements (from both left and right headers) and updates each header’s width based on the * corresponding visible column’s width minus a computed adjustment (headerColumnWidthDiff). * Finally, it updates the internal column caches. * * @returns */ protected applyColumnHeaderWidths(): void; /** * Iterates over all columns (skipping hidden ones) and, for each, retrieves the associated CSS rules * (using getColumnCssRules). It then sets the left and right CSS properties so that the columns align * correctly within the grid canvas. It also updates the cumulative offset for center-band columns. */ protected applyColumnWidths(): void; /** * A convenience method that creates a sort configuration for one column (with the given sort direction) * and calls setSortColumns with it. Accepts a columnId string and an ascending boolean. * Applies a sort glyph in either ascending or descending form to the header of the column. * Note that this does not actually sort the column. It only adds the sort glyph to the header. * * @param {String | Number} columnId * @param {Boolean} ascending */ setSortColumn(columnId: number | string, ascending: boolean): void; /** * Get column by index - iterates over header containers and returns the header column * element corresponding to the given index. * * @param {Number} id - column index * @returns */ getColumnByIndex(idx: number): HTMLElement | undefined; /** * Accepts an array of objects in the form [ { columnId: [string], sortAsc: [boolean] }, ... ] to * define the grid's sort order. When called, this will apply a sort glyph in either ascending * or descending form to the header of each column specified in the array. * Note that this does not actually sort the column. It only adds the sort glyph to the header. * * @param {ColumnSort[]} cols - column sort */ setSortColumns(cols: ColumnSort[]): void; /** Returns the current array of column definitions. */ getColumns(): C[]; /** Get sorted columns representing the current sorting state of the grid **/ getSortColumns(): ColumnSort[]; /** * Iterates over all columns to compute and store their left and right boundaries * (based on cumulative widths). Rebuilds the corresponding docking and visibility caches. */ protected updateColumnCaches(): void; /** * Iterates over each column to (a) save its original width as widthRequest, * (b) apply default properties (using mixinDefaults if set) to both the column * and its autoSize property, (c) update the columnsById mapping, and (d) adjust * the width if it is less than minWidth or greater than maxWidth. */ protected updateColumnProps(): void; /** * Sets grid columns. Column headers will be recreated and all rendered rows will be removed. To rerender the grid (if necessary), call render(). * @param {Column[]} newColumns An array of column definitions. * @param {boolean} [waitNextCycle=false] - should we wait for a microtask cycle before updating column headers */ setColumns(newColumns: C[], waitNextCycle?: boolean): boolean; /** Update columns for when a hidden property has changed but the column list itself has not changed. */ updateColumns(): void; /** * Triggers onBeforeUpdateColumns and calls updateColumnProps to update column properties, * caches, header/footer elements, CSS rules, canvas dimensions, and selections without changing the column array. */ protected updateColumnsInternal(): void; /** Get Editor lock */ getEditorLock(): SlickEditorLock; /** Get Editor Controller */ getEditController(): EditController | undefined; /** * Sets a new source for databinding and removes all rendered rows. Note that this doesn't render the new rows - you can follow it with a call to render() to do that. * @param {CustomDataView|Array<*>} newData New databinding source using a regular JavaScript array.. or a custom object exposing getItem(index) and getLength() functions. * @param {Number} [scrollToTop] If true, the grid will reset the vertical scroll position to the top of the grid. */ setData(newData: CustomDataView | TData[], scrollToTop?: boolean): void; /** Returns the size of the databinding source. */ getDataLength(): number; /** * Returns the number of data items plus an extra row if enableAddRow is true and paging conditions allow. * * @returns */ protected getDataLengthIncludingAddNew(): number; /** * Returns the databinding item at a given position. * @param {Number} index Item row index. */ getDataItem(i: number): TData; /** * Returns the value of a single field for a given row index. * * When the databinding source is a `CustomDataView` that implements the optional * `getCellValue(index, field)` accessor, that method is used directly. This allows * column-oriented (or otherwise non row-materializing) data sources to return a * single cell value without first having to build a full row object via `getItem()`, * which can be expensive when called repeatedly (e.g. during column content auto-sizing). * * Falls back to `getDataItem(i)[field]` for plain arrays or data sources that don't * implement `getCellValue`. * * @param {Number} i Item row index. * @param {String} field Column field name. */ getCellValue(i: number, field: string): TData[keyof TData]; /** Are we using a DataView? */ hasDataView(): boolean; /** * Returns item metadata by a row index when it exists * @param {Number} row * @returns {ItemMetadata | null} */ getItemMetadaWhenExists(row: number): ItemMetadata | null; /** * Determines the proper formatter for a given cell by checking row metadata for column overrides, * then falling back to the column’s formatter, a formatter from the formatterFactory, or the default formatter. * * @param {number} row - The row index of the cell. * @param {C} column - The column definition containing formatting options. * @returns {Formatter} - The resolved formatter function for the specified cell. */ protected getFormatter(row: number, column: C): Formatter; /** * Retrieves the editor (or editor constructor) for the specified cell by first checking for an override * in row metadata and then falling back to the column’s editor or an editor from the editorFactory. * * @param {number} row - The row index of the cell. * @param {number} cell - The column index of the cell. * @returns {Editor | EditorConstructor | null | undefined} - The editor instance or constructor if available, otherwise `null` or `undefined`. */ protected getEditor(row: number, cell: number): Editor | EditorConstructor | null | undefined; /** * Returns the value for the specified column from a given data item. If a dataItemColumnValueExtractor * is provided in options, it is used; otherwise, the property named by the column’s field is returned. * * @param {TData} item - The data item containing the requested value. * @param {C} columnDef - The column definition containing the field key. * @returns {*} - The extracted value from the data item based on the column definition. */ protected getDataItemValueForColumn(item: TData, columnDef: C): TData | TData[keyof TData]; /** Resets active cell by making cell normal and other internal reset. */ resetActiveCell(): void; /** Clear active cell by making cell normal & removing "active" CSS class. */ unsetActiveCell(): void; /** @alias `setFocus` */ focus(): void; /** Restores focus to the appropriate hidden grid focus sink. */ protected setFocus(): void; /** * Clears any previously active cell (removing “active” CSS classes), sets the new active cell, * calculates its position, and updates active row and cell indices. * If conditions are met (grid is editable and `opt_editMode` is `true`), * it initiates editing on the cell (with an asynchronous delay if configured). * Finally, it triggers `onActiveCellChanged` unless suppressed. * * @param {HTMLDivElement | null} newCell - The new active cell element, or `null` to deactivate the current cell. * @param {boolean | null} [opt_editMode] - If `true`, enables edit mode for the active cell. * If `null` or `undefined`, it follows `autoEditNewRow` and `autoEdit` settings. * @param {boolean | null} [preClickModeOn] - If `true`, indicates that the cell was activated by a pre-click action. * @param {boolean} [suppressActiveCellChangedEvent] - If `true`, prevents triggering `onActiveCellChanged` event. * @param {Event | SlickEvent_} [e] - The event that triggered the cell activation (if applicable). */ protected setActiveCellInternal(newCell: HTMLDivElement | null, opt_editMode?: boolean | null, preClickModeOn?: boolean | null, suppressActiveCellChangedEvent?: boolean, e?: Event | SlickEvent_): void; /** Check if cell is editable and check if grid is also editable */ protected isCellEditable(row: number, cell: number): boolean; /** * Checks whether data for the row is loaded, whether the cell is in an “Add New” row * (and the column disallows insert triggering), and whether an editor exists and the cell is not hidden. * Returns true if the cell is editable. * * @param {number} row - The row index of the cell. * @param {number} cell - The cell index (column index) within the row. * @returns {boolean} - Returns `true` if the cell is editable, otherwise `false`. */ protected isCellPotentiallyEditable(row: number, cell: number): boolean; /** * Make the cell normal again (for example after destroying cell editor), * we can also optionally refocus on the current active cell (again possibly after closing cell editor) * * If an editor is active, triggers onBeforeCellEditorDestroy and calls the editor’s destroy method. * It then removes “editable” and “invalid” CSS classes from the active cell, re–applies the formatter * to restore the cell’s original content, invalidates any post–processing results, * and deactivates the editor lock. Optionally, it can also re–focus the grid. * * @param {Boolean} [refocusActiveCell] */ protected makeActiveCellNormal(refocusActiveCell?: boolean): void; /** * A public method that starts editing on the active cell by calling * makeActiveCellEditable with the provided editor, pre–click flag, and event. */ editActiveCell(editor?: Editor | EditorConstructor, preClickModeOn?: boolean | null, e?: Event): void; /** * Makes the currently active cell editable by initializing an editor instance. * * @param {EditorConstructor} [editor] - An optional custom editor constructor to use for editing. * @param {boolean | null} [preClickModeOn] - Indicates if pre-click mode is enabled. * @param {Event | SlickEvent_} [e] - The event that triggered editing. * * @throws {Error} If called when the grid is not editable. */ protected makeActiveCellEditable(editor?: Editor | EditorConstructor, preClickModeOn?: boolean | null, e?: Event | SlickEvent_): void; /** * Commits the current edit and sets focus back to the grid. * If the commit fails due to validation, the focus remains in the editor. */ protected commitEditAndSetFocus(navigateCellDown?: boolean): void; /** * Cancels the current edit and restores focus to the grid. */ protected cancelEditAndSetFocus(): void; /** * Commits the current edit, validating and applying changes if necessary. * If validation fails, an error is triggered and focus remains in the editor. * * @returns {boolean} Whether the edit was successfully committed. */ protected commitCurrentEdit(): boolean; /** * Cancels the current edit and restores the cell to normal mode. * * @returns {boolean} Always returns true. */ protected cancelCurrentEdit(): boolean; /** Returns an array of row indices corresponding to the currently selected rows. */ getSelectedRows(): number[]; /** * Accepts an array of row indices and applies the current selectedCellCssClass to the cells in the row, respecting whether cells have been flagged as selectable. * @param {Array} rowsArray - an array of row numbers. * @param {String} [caller] - an optional string to identify who called the method */ setSelectedRows(rows: number[], caller?: string): void; /** * Handles the mouseout event for a cell. * Triggers the `onMouseLeave` event. * * @param {MouseEvent & { target: HTMLElement }} e - The mouse event. */ protected handleCellMouseOut(e: MouseEvent & { target: HTMLElement; }): void; /** * Handles mouse hover over a header cell. * Adds CSS classes to indicate a hover state. * * @param {Event | SlickEventData_} e - The mouse event. */ protected handleHeaderMouseHoverOn(e: Event | SlickEventData_): void; /** * Handles mouse hover off a header cell. * Removes CSS classes indicating a hover state. * * @param {Event | SlickEventData_} e - The mouse event. */ protected handleHeaderMouseHoverOff(e: Event | SlickEventData_): void; /** Returns whether the drag handle should be displayed for the supplied column. */ protected getDragHandleVisibility(): boolean | 'hover'; /** * Called when the grid’s selection model reports a change. It builds a new selection * (and CSS hash for selected cells) from the provided ranges, applies the new cell CSS styles, * and if the selection has changed from the previous state, triggers the onSelectedRowsChanged * event with details about added and removed selections. * * @param {SlickEventData_} e - The Slick event data for selection changes. * @param {SlickRange_[]} ranges - The list of selected row and cell ranges. */ protected handleSelectedRangesChanged(e: SlickEventData_, ranges: SlickRange_[]): void; /** * Processes a mouse wheel event by adjusting the vertical scroll (scrollTop) based on deltaY (scaled by rowHeight) * and horizontal scroll (scrollLeft) based on deltaX. It then calls the internal scroll handler with the “mousewheel” * type and, if any scrolling occurred, stops propagation. When a docking scroller is active it also prevents the * browser's default scrolling so the shared viewport and docked regions remain synchronized. * * @param {MouseEvent} e - The mouse event. * @param {number} _delta - Unused delta value. * @param {number} deltaX - The horizontal scroll delta. * @param {number} deltaY - The vertical scroll delta. */ protected handleMouseWheel(e: MouseEvent, _delta: number, deltaX: number, deltaY: number): void; /** * Called when a drag is initiated. It retrieves the cell from the event; if the cell does not exist or is not selectable, * it returns false. Otherwise, it triggers the onDragInit event and returns the event’s return value if * propagation is stopped, else returns false to cancel the drag. * * @param {DragEvent} e - The drag event. * @param {DragPosition} dd - The drag position data. * @returns {boolean} - Whether the drag is valid or should be cancelled. */ protected handleDragInit(e: DragEvent, dd: DragPosition): boolean; /** * Similar to handleDragInit, this method retrieves the cell from the event * and triggers the `onDragStart` event. If the event propagation is stopped, * it returns the specified value; otherwise, it returns false. * * @param {DragEvent} e - The drag event that initiated the action. * @param {DragPosition} dd - The current drag position. * @returns {boolean} - The result of the event trigger or false if propagation was not stopped. */ protected handleDragStart(e: DragEvent, dd: DragPosition): boolean; /** Publishes the grid drag event for an in-progress drag operation. */ protected handleDrag(e: DragEvent, dd: DragPosition): void; /** Publishes the grid drag-end event after a drag operation completes. */ protected handleDragEnd(e: DragEvent, dd: DragPosition): void; /** * Handles a click event on the grid. It logs the event (for debugging), ensures focus is restored if necessary, * triggers the onClick event, and if the clicked cell is selectable and not already active, scrolls it into view * and activates it. * * @param {DOMEvent | SlickEventData_} evt - The click event, either a native DOM event or a Slick event. */ protected handleClick(evt: DOMEvent | SlickEventData_): void; /** * Retrieves the cell DOM element from the event target. * If the cell exists and is not currently being edited, triggers the onContextMenu event. */ protected handleContextMenu(e: Event & { target: HTMLElement; }): void; /** * Retrieves the cell from the event and triggers the onDblClick event. * If the event is not prevented and the grid is editable, * it initiates cell editing by calling gotoCell with edit mode enabled. */ protected handleDblClick(e: MouseEvent): void; /** * When the mouse enters a header column element, retrieves the column definition from the element’s * stored data and triggers the onHeaderMouseEnter event with the column and grid reference. */ protected handleHeaderMouseEnter(e: MouseEvent & { target: HTMLElement; }): void; /** * Similar to handleHeaderMouseEnter, but triggers the onHeaderMouseLeave event * when the mouse leaves a header column element. */ protected handleHeaderMouseLeave(e: MouseEvent & { target: HTMLElement; }): void; /** * Retrieves the column from the header row cell element and triggers the onHeaderRowMouseEnter event. */ protected handleHeaderRowMouseEnter(e: MouseEvent & { target: HTMLElement; }): void; /** * Retrieves the column from the header row cell element and triggers the onHeaderRowMouseLeave event. */ protected handleHeaderRowMouseLeave(e: MouseEvent & { target: HTMLElement; }): void; /** * Retrieves the header column element and its associated column definition, * then triggers the onHeaderContextMenu event with the column data. */ protected handleHeaderContextMenu(e: MouseEvent & { target: HTMLElement; }): void; /** * If not in the middle of a column resize, retrieves the header column element and its column definition, then triggers the onHeaderClick event. */ protected handleHeaderClick(e: MouseEvent & { target: HTMLElement; }): void; /** * Triggers the onPreHeaderContextMenu event with the event target (typically the pre–header panel). */ protected handlePreHeaderContextMenu(e: MouseEvent & { target: HTMLElement; }): void; /** * If not resizing columns, triggers the onPreHeaderClick event with the event target. */ protected handlePreHeaderClick(e: MouseEvent & { target: HTMLElement; }): void; /** * Retrieves the footer cell element and its column definition, then triggers the onFooterContextMenu event. */ protected handleFooterContextMenu(e: MouseEvent & { target: HTMLElement; }): void; /** * Retrieves the footer cell element and its column definition, then triggers the onFooterClick event. */ protected handleFooterClick(e: MouseEvent & { target: HTMLElement; }): void; /** * Triggers the onMouseEnter event when the mouse pointer enters a cell element. */ protected handleCellMouseOver(e: MouseEvent & { target: HTMLElement; }): void; /** * Handles the change in the position of the active cell. * Triggers the `onActiveCellPositionChanged` event and adjusts the editor visibility and positioning. */ protected handleActiveCellPositionChange(): void; /** * limits the frequency at which the provided action is executed. * call enqueue to execute the action - it will execute either immediately or, if it was executed less than minPeriod_ms in the past, as soon as minPeriod_ms has expired. * call dequeue to cancel any pending action. */ protected actionThrottle(action: () => void, minPeriod_ms: number): { enqueue: () => void; dequeue: () => void; }; /** * Returns a hash containing row and cell indexes from a standard W3C event. * @param {*} event A standard W3C event. */ getCellFromEvent(evt: Event | SlickEventData_): { row: number; cell: number; } | null; /** * Apply HTML code by 4 different ways depending on what is provided as input and what options are enabled. * 1. value is an HTMLElement or DocumentFragment, then first empty the target and simply append the HTML to the target element. * 2. value is a number, a boolean or a plain string without `<` or `&`, then use `target.textContent = value;` without sanitizing or parsing HTML. * 3. value is any other string and `enableHtmlRendering` is enabled, then use `target.innerHTML = sanitizedValue;` * 4. value is any other string and `enableHtmlRendering` is disabled, then use `target.textContent = sanitizedValue;` * @param {HTMLElement} target - target element to apply to * @param {string | HTMLElement | DocumentFragment} val - input value can be either a string or an HTMLElement * @param {{ emptyTarget?: boolean; skipEmptyReassignment?: boolean; }} [options] - * `emptyTarget`, defaults to true, will empty the target. * `skipEmptyReassignment`, defaults to true, when enabled it will not try to reapply an empty value when the target is already empty */ applyHtmlCode(target: HTMLElement, val?: boolean | string | HTMLElement | DocumentFragment | null | undefined, options?: { emptyTarget?: boolean; skipEmptyReassignment?: boolean; }): void; /** Get Grid Canvas Node DOM Element */ getCanvasNode(_columnIdOrIdx?: number | string, _rowIndex?: number): HTMLDivElement; /** Get the canvas DOM element */ getActiveCanvasNode(e?: Event | SlickEventData_): HTMLDivElement; /** Get the canvas DOM element */ getCanvases(): HTMLDivElement[]; /** Get the Viewport DOM node element */ getViewportNode(_columnIdOrIdx?: number | string, _rowIndex?: number): HTMLElement | undefined; /** Get all the Viewport node elements */ getViewports(): HTMLDivElement[]; /** * Calls setActiveViewportNode (using the provided event) to set the active viewport, * then returns the active viewport DOM element. * * @param e * @returns */ getActiveViewportNode(e: Event | SlickEventData_): HTMLDivElement; /** * Sets an active viewport node * * @param {number | string} [columnIdOrIdx] - The column identifier or index. * @param {number} [rowIndex] - The row index. * @returns {HTMLElement} The corresponding viewport element. */ setActiveViewportNode(e: Event | SlickEventData_): HTMLDivElement; /** Get the headers width in pixel * * Iterates over all columns to accumulate the widths for the left and right docking sections, * adds scrollbar width if needed, and adjusts for docked columns. * Returns the computed overall header width in pixels. */ getHeadersWidth(): number; /** Get the grid canvas width * * Computes the available width (considering vertical scrollbar if present), * then iterates over the columns (left, center, and right docking bands) to sum their widths. * If full–width rows are enabled, extra width is added. Returns the total calculated width. */ getCanvasWidth(): number; /** * Recalculates the canvas width by calling getCanvasWidth and then adjusts widths of header containers, * canvases, panels, and viewports. If widths have changed (or forced), it applies the new column widths * by calling applyColumnWidths. * * @param {boolean} [forceColumnWidthsUpdate] - Whether to force an update of column widths. */ protected updateCanvasWidth(forceColumnWidthsUpdate?: boolean): void; /** @alias `getPreHeaderPanelLeft` */ getPreHeaderPanel(): HTMLDivElement; /** Get the Pre-Header Panel Left DOM node element */ getPreHeaderPanelLeft(): HTMLDivElement; /** Get the Pre-Header Panel Right DOM node element */ getPreHeaderPanelRight(): HTMLDivElement; /** Get the Top-Header Panel DOM node element */ getTopHeaderPanel(): HTMLDivElement; /** * Sets the CSS overflowX and overflowY styles for the shared viewport and, when needed, * the docking horizontal scroller based on the grid’s docking configuration and options such * as alwaysAllowHorizontalScroll and alwaysShowVerticalScroll. * If a viewportClass is specified in options, the class is added to the viewport. */ protected setOverflow(): void; /** * Creates a