import { Computed, JSXElement, Signal } from '@serenity-is/domwise'; /** * Base class for special rows that do not represent regular data items. * Group headers and group totals derive from this to allow the grid and * data view to distinguish them from plain data rows via the marker property. */ export declare class NonDataRow { /** * Marker flag used at runtime to identify non-data rows. * Checked by the grid and `DataView` to skip data-specific handling. */ __nonDataRow: boolean; } /** * CSS class applied to a cell that received a mousedown immediately before * an editor is activated. Editors can check for this class to decide whether * to select text or preserve the click target. */ export declare const preClickClassName = "slick-edit-preclick"; /** * Discrete directions that the active cell can be moved programmatically. * Values map to arrow keys and special keys: `home`/`end` for row boundaries, * `next`/`prev` for tab-like sequential navigation, and `up`/`down`/`left`/`right` * for arrow-key navigation. */ export type CellNavigationDirection = "up" | "down" | "left" | "right" | "next" | "prev" | "home" | "end"; /** * Contract for keyboard / programmatic navigation of the active cell. * Implemented by the grid so that editors, plugins and external code can move * focus without coupling to internal navigation logic. */ export interface CellNavigation { /** * Moves the active cell to the last row of the data set. */ navigateBottom(): void; /** * Moves the active cell one row down. * @returns `true` if the active cell changed, `false` if already at the bottom or blocked. */ navigateDown(): boolean; /** * Moves the active cell one column to the left. * @returns `true` if the active cell changed. */ navigateLeft(): boolean; /** * Moves the active cell to the next focusable cell (row-major order, wrapping rows). * @returns `true` if the active cell changed. */ navigateNext(): boolean; /** * Scrolls one page down and moves the active cell accordingly. */ navigatePageDown(): void; /** * Scrolls one page up and moves the active cell accordingly. */ navigatePageUp(): void; /** * Moves the active cell to the previous focusable cell (reverse row-major order). * @returns `true` if the active cell changed. */ navigatePrev(): boolean; /** * Moves the active cell one column to the right. * @returns `true` if the active cell changed. */ navigateRight(): boolean; /** * Moves the active cell to the last cell of the current row. * @returns `true` if the active cell changed. */ navigateRowEnd(): boolean; /** * Moves the active cell to the first cell of the current row. * @returns `true` if the active cell changed. */ navigateRowStart(): boolean; /** * Moves the active cell to the first row of the data set. */ navigateTop(): void; /** * Moves the active cell to the specified row, keeping the current column if possible. * @param row - Zero-based row index to navigate to. * @returns `true` if the active cell changed. */ navigateToRow(row: number): boolean; /** * Moves the active cell one row up. * @returns `true` if the active cell changed. */ navigateUp(): boolean; /** * Navigate the active cell in the specified direction. * @param dir - Navigation direction. * @returns Whether navigation resulted in a change of the active cell. */ navigate(dir: CellNavigationDirection): boolean; } /** * Represents a rectangular range of cells in the grid. * Coordinates are inclusive and automatically normalized so that `from*` is always * the top-left corner and `to*` is the bottom-right corner. */ export declare class CellRange { /** * Top-most row index of the range (inclusive). */ fromRow: number; /** * Left-most cell/column index of the range (inclusive). */ fromCell: number; /** * Bottom-most row index of the range (inclusive). */ toRow: number; /** * Right-most cell/column index of the range (inclusive). */ toCell: number; /** * Creates a new cell range. When `toRow` / `toCell` are omitted the range * represents a single cell at `fromRow` / `fromCell`. * @param fromRow - Starting row index. * @param fromCell - Starting cell/column index. * @param toRow - Ending row index; defaults to `fromRow`. * @param toCell - Ending cell index; defaults to `fromCell`. */ constructor(fromRow: number, fromCell: number, toRow?: number, toCell?: number); /** * Returns `true` when the range spans exactly one row. * @returns Whether the range covers a single row. */ isSingleRow(): boolean; /** * Returns `true` when the range covers exactly one cell. * @returns Whether the range is a single cell. */ isSingleCell(): boolean; /** * Tests whether the range contains the given cell. * @param row - Row index to test. * @param cell - Cell/column index to test. * @returns `true` if the cell lies inside the range (inclusive bounds). */ contains(row: number, cell: number): boolean; /** * Returns a human-readable representation, e.g. `"(2:3)"` for a single cell * or `"(0:0 - 4:5)"` for a multi-cell range. * @returns Readable string for debugging/logging. */ toString(): string; } /** * Core event object passed to every grid event handler. Mirrors W3C/jQuery event * semantics with propagation and default-prevent controls. * @template TArgs - Payload specific to the event. * @template TEvent - Native DOM event wrapped by this object. */ export interface IEventData { /** Payload supplied by the event emitter (e.g. `{row, cell, grid}`). */ args: TArgs; /** Whether {@link IEventData.preventDefault} has been called. */ defaultPrevented: boolean; /** * Prevents the default action associated with the event. */ preventDefault(): void; /** * Stops the event from bubbling further, but remaining handlers on the same * emitter still run. Also calls `stopPropagation` on the native event when present. */ stopPropagation(): void; /** * Prevents remaining handlers from being executed. Also stops DOM propagation. */ stopImmediatePropagation(): void; /** Returns `true` if {@link IEventData.preventDefault} has been called or the native event is default-prevented. */ isDefaultPrevented(): boolean; /** Returns `true` if {@link IEventData.stopImmediatePropagation} has been called. */ isImmediatePropagationStopped(): boolean; /** Returns `true` if {@link IEventData.stopPropagation} has been called. */ isPropagationStopped(): boolean; /** Returns the last non-`undefined` return value from the handlers that have run. */ getReturnValue(): any; /** Returns all return values collected from handlers. */ getReturnValues(): any[]; /** The wrapped native DOM event, if any. */ nativeEvent: TEvent | null | undefined; } /** Shorthand keys that are hoisted from `args` onto `EventData` for ergonomic access (`e.grid`, `e.row`, …). */ export type MergeArgKeys = "grid" | "column" | "node" | "row" | "cell" | "item"; /** * Union type representing the actual event object handlers receive. It merges * {@link IEventData} with the native event and hoisted arg keys so callers can * access `e.row`, `e.cell`, `e.grid`, etc. directly. */ export type EventData = IEventData & TEvent & { [key in keyof TArgs & (MergeArgKeys)]: TArgs[key]; }; /** * Handler signature for SleekGrid events. * @template TArgs - Event payload type. * @template TEvent - Wrapped native event type. * @param e - Event object with propagation controls and merged fields. * @param args - Optional duplicate of `e.args` for convenience. */ export type EventCallback = (e: EventData, args?: TArgs) => void; /** * Wraps a native DOM event and a payload object, exposing propagation controls. * Property access for common DOM fields (e.g. `clientX`, `key`, `target`) and arg keys * (`grid`, `row`, `cell`) is dynamically proxied via getters installed by * `initializeEventDataProps()`. * @template TArgs - Event payload type. * @template TEvent - Wrapped native event type. */ export declare class EventDataWrapper implements IEventData { private _args; private _isPropagationStopped; private _isImmediatePropagationStopped; private _isDefaultPrevented; private _nativeEvent; private _returnValue; private _returnValues; constructor(event?: TEvent | null, args?: TArgs); get defaultPrevented(): boolean; preventDefault(): void; isDefaultPrevented(): boolean; /** * Stops event from propagating up the DOM tree and marks it as propagation-stopped. */ stopPropagation(): void; /** * Returns whether {@link EventDataWrapper.stopPropagation} was called on this event object. * @returns `true` if propagation was stopped. */ isPropagationStopped(): boolean; /** * Prevents remaining handlers from being executed and stops DOM propagation. */ stopImmediatePropagation(): void; /** * Returns whether {@link EventDataWrapper.stopImmediatePropagation} was called on this event object. * @returns `true` if immediate propagation was stopped. */ isImmediatePropagationStopped(): boolean; get args(): TArgs; addReturnValue(value: any): void; getReturnValues(): any[]; getReturnValue(): any; get nativeEvent(): TEvent | null | undefined; } /** * Lightweight publish–subscribe implementation used for all SleekGrid events. * @template TArgs - Payload type. * @template TEvent - Wrapped native event type. */ export declare class EventEmitter { private _handlers; /** * Registers an event handler to be invoked when the event is fired. * Handlers receive `(eventData, args)` and run in insertion order. * @param fn - Handler to register. */ subscribe(fn: EventCallback): void; /** * Removes a previously registered handler. * @param fn - Handler to remove; must be the exact function reference passed to {@link EventEmitter.subscribe}. */ unsubscribe(fn: EventCallback): void; /** * Fires the event, invoking all subscribers in order until propagation is stopped. * @param args - Payload passed to handlers as `e.args`. * @param e - Optional native DOM event to wrap. * @param scope - `this` value for handlers; defaults to the emitter itself. * @returns The {@link EventData} object created for this notification (carries return values and propagation flags). */ notify(args?: TArgs, e?: TEvent, scope?: object): EventData; /** * Removes all registered handlers. */ clear(): void; } /** * Aggregates subscriptions across multiple emitters and allows bulk unsubscribe. * Useful for plugins/components that subscribe to many grid events and need * a single `unsubscribeAll()` on destroy. */ export declare class EventSubscriber { private _handlers; /** * Subscribes `handler` to `event` and tracks the pair for later bulk cleanup. * @param event - Emitter to subscribe to. * @param handler - Handler to register. * @returns `this` for chaining. */ subscribe(event: EventEmitter, handler: EventCallback): this; /** * Unsubscribes a previously tracked handler. * @param event - Emitter the handler was subscribed to. * @param handler - Handler to remove. * @returns `this` for chaining. */ unsubscribe(event: EventEmitter, handler: EventCallback): this; /** * Unsubscribes all tracked handlers. * @returns `this` for chaining. */ unsubscribeAll(): EventSubscriber; } /** * Legacy key-code constants. * @deprecated Prefer `KeyboardEvent.key`/`KeyboardEvent.code` checks over numeric codes. */ export declare const keyCode: { BACKSPACE: number; DELETE: number; DOWN: number; END: number; ENTER: number; ESCAPE: number; HOME: number; INSERT: number; LEFT: number; PAGEDOWN: number; PAGEUP: number; RIGHT: number; TAB: number; UP: number; }; /** * Pixel bounds for positioning an editor or other overlay relative to the grid viewport. */ export interface Position { /** Bottom offset in pixels. */ bottom?: number; /** Height in pixels. */ height?: number; /** Left offset in pixels. */ left?: number; /** Right offset in pixels. */ right?: number; /** Top offset in pixels. */ top?: number; /** Whether the positioned element is currently visible. */ visible?: boolean; /** Width in pixels. */ width?: number; } /** * Result of validating an editor value before commit. */ export interface ValidationResult { /** Whether the value is valid. */ valid: boolean; /** Human-readable error message when `valid` is `false`. */ msg?: string; } /** * Row/cell coordinate pair that identifies a single cell. */ export interface RowCell { /** Zero-based row index. */ row: number; /** Zero-based cell/column index. */ cell: number; } /** * Minimal grid/host surface required by cell editors to navigate and resolve editors. */ export interface EditorHost { /** Returns the currently active cell, or `null` when no cell is active. */ getActiveCell(): RowCell; /** Moves focus to the next focusable cell. @returns `true` if focus moved. */ navigateNext(): boolean; /** Moves focus to the previous focusable cell. @returns `true` if focus moved. */ navigatePrev(): boolean; /** Emits when a composite-editor field value changes; editors forward changes through this. */ onCompositeEditorChange: EventEmitter; /** Resolves the editor factory for a given column/row. */ getEditorFactory(): EditorFactory; } /** * Options supplied to a composite editor that edits multiple fields at once. */ export interface CompositeEditorOptions { /** Current form values keyed by column id or field name. */ formValues: any; } /** * Options passed to every editor instance on construction. */ export interface EditorOptions { /** Host grid instance the editor operates within. */ grid: EditorHost; /** Bounds of the entire grid container in viewport coordinates. */ gridPosition?: Position; /** Bounds of the target cell where the editor should be positioned. */ position?: Position; /** Whether left/right arrow keys should navigate between cells while editing. */ editorCellNavOnLRKeys?: boolean; /** Column definition for the cell being edited. */ column?: Column; /** Metadata overrides for the column/row being edited. */ columnMetaData?: ColumnMetadata; /** Options from a parent composite editor, if any. */ compositeEditorOptions?: CompositeEditorOptions; /** DOM container the editor should render into. */ container?: HTMLElement; /** Data item (row) being edited. */ item?: any; /** Event that triggered the edit, if available. */ event?: EventData; /** Callback to commit pending editor changes. */ commitChanges?: () => void; /** Callback to cancel pending editor changes. */ cancelChanges?: () => void; } /** * Factory that resolves an editor class for a given column/row. */ export interface EditorFactory { /** * Returns the editor class for the given column and optional row. * @param column - Column to resolve an editor for. * @param row - Optional row index for row-specific resolution. * @returns Editor constructor. */ getEditor(column: Column, row?: number): EditorClass; } /** * Command produced by an editor commit; supports undo/redo when the grid's * `editCommandHandler` queues it. */ export interface EditCommand { /** Row index that was edited. */ row: number; /** Cell/column index that was edited. */ cell: number; /** Editor instance that produced the change. */ editor: Editor; /** New serialized value from the editor. */ serializedValue: any; /** Previous serialized value before the edit. */ prevSerializedValue: any; /** Applies the edit. */ execute: () => void; /** Reverts the edit. */ undo: () => void; } /** * Constructor type for cell editors. */ export interface EditorClass { /** Instantiates the editor for the given options. */ new (options: EditorOptions): Editor; /** * When `true`, the editor is not cleared on first key press; the existing * value is preserved and the key is forwarded to the editor. */ suppressClearOnEdit?: boolean; } /** * Contract that all cell editors must implement. */ export interface Editor { /** Tears down DOM and listeners created by the editor. */ destroy(): void; /** * Writes the edited value back to the data item. * @param item - Row item to mutate. * @param value - Serialized value from {@link Editor.serializeValue}. */ applyValue(item: any, value: any): void; /** Focuses the editor's input element. */ focus(): void; /** * Checks whether the current editor value differs from the original. * @param args - Flags influencing the check (e.g. whether a commit is in progress). * @returns `true` if the value has changed. */ isValueChanged(args: { commitEdit?: boolean; }): boolean; /** Key codes the editor captures even when the grid also handles them. */ keyCaptureList?: number[]; /** * Loads an existing cell value into the editor. * @param value - The value to load. */ loadValue(value: any): void; /** Serializes the current editor value for commit. */ serializeValue(): any; /** * Repositions the editor overlay. * @param pos - New pixel bounds. */ position?(pos: Position): void; /** Hook invoked when the cell received a pre-click; editors may skip selection. */ preClick?(): void; /** Hides the editor without destroying it. */ hide?(): void; /** Shows a previously hidden editor. */ show?(): void; /** Validates the current value. @returns Validation result. */ validate?(): ValidationResult; } /** * Active edit controller implemented by the grid; managed by {@link EditorLock}. */ export interface EditController { /** * Commits the current edit if any. * @returns `true` if committed or no edit was active, `false` if validation failed. */ commitCurrentEdit(): boolean; /** * Cancels the current edit if any. * @returns `true` if cancelled or no edit was active. */ cancelCurrentEdit(): boolean; } /** * Locking helper that ensures only a single {@link EditController} is active at a time. * Prevents concurrent edits and validation races; the grid queries this before * navigating, sorting, or scrolling while an edit is open. */ export declare class EditorLock { private activeEditController; /** * Checks whether an edit controller currently holds the edit lock. * @param editController - Controller to test; when omitted, returns `true` if *any* controller is active. * @returns Whether the given (or any) controller is active. */ isActive(editController?: EditController): boolean; /** * Acquires the edit lock for the given controller. * Throws if another controller already holds the lock or if the controller * does not implement the required methods. * @param editController - Controller acquiring the lock. */ activate(editController: EditController): void; /** * Releases the edit lock held by the given controller. * Throws if the controller is not the currently active one. * @param editController - Controller releasing the lock. */ deactivate(editController: EditController): void; /** * Attempts to commit the current edit via the active controller. * @returns `true` if committed (or no edit was active), `false` if validation failed. */ commitCurrentEdit(): boolean; /** * Attempts to cancel the current edit via the active controller. * @returns `true` if cancelled (or no edit was active). */ cancelCurrentEdit(): boolean; } /** * Global singleton editor lock instance used by the grid by default. * Import this when you need a shared lock outside the grid. */ export declare const GlobalEditorLock: EditorLock; /** Base payload for all grid events; carries the originating grid reference. */ export interface ArgsGrid { /** Grid instance that emitted the event. */ grid: ISleekGrid; } /** Payload for events associated with a specific column. */ export interface ArgsColumn extends ArgsGrid { /** Column related to the event. */ column: Column; } /** Payload for drag lifecycle events (drag init/start/drag/end). */ export interface ArgsDrag extends ArgsGrid { /** Drag mode/category (e.g. `"cell"`, `"column"`). */ mode: string; /** Row index where the drag originated. */ row: number; /** Cell/column index where the drag originated. */ cell: number; /** Data item at `row`. */ item: any; /** Visual helper element following the pointer during the drag. */ helper: HTMLElement; } /** Payload for events that reference both a column and its DOM node. */ export interface ArgsColumnNode extends ArgsColumn { /** Header/footer cell node for the column. */ node: HTMLElement; } /** Single entry within a multi-column sort description. */ export type ArgsSortCol = { /** Column being sorted. */ sortCol: Column; /** Sort direction; `true` for ascending. */ sortAsc: boolean; }; /** Payload for `onSort` events. */ export interface ArgsSort extends ArgsGrid { /** Whether multiple columns are being sorted. */ multiColumnSort: boolean; /** Primary sort direction (for single-column sort). */ sortAsc: boolean; /** Primary sort column (for single-column sort). */ sortCol: Column; /** All active sort columns for multi-sort. */ sortCols: ArgsSortCol[]; } /** Payload for `onSelectedRowsChanged`. */ export interface ArgsSelectedRowsChange extends ArgsGrid { /** Currently selected row indices after the change. */ rows: number[]; /** Rows that became selected in this change. */ changedSelectedRows: number[]; /** Rows that became unselected in this change. */ changedUnselectedRows: number[]; /** Selected rows before the change. */ previousSelectedRows: number[]; /** Caller token provided by the code that triggered the selection change. */ caller: any; } /** Payload for `onScroll`. */ export interface ArgsScroll extends ArgsGrid { /** Horizontal scroll offset in pixels. */ scrollLeft: number; /** Vertical scroll offset in pixels. */ scrollTop: number; } /** Payload for `onCellCssStylesChanged` / cell-style setter events. */ export interface ArgsCssStyle extends ArgsGrid { /** Style key/bucket name. */ key: string; /** Hash of `row -> columnId -> cssClass` describing the new styles. */ hash: CellStylesHash; } /** Payload for events scoped to a specific cell. */ export interface ArgsCell extends ArgsGrid { /** Row index of the event cell. */ row: number; /** Cell/column index of the event cell. */ cell: number; } /** Payload for cell-change events where the row item is known. */ export interface ArgsCellChange extends ArgsCell { /** Data item at `row`. */ item: any; } /** Payload for cell-edit lifecycle events. */ export interface ArgsCellEdit extends ArgsCellChange { /** Column definition for `cell`. */ column: Column; } /** Payload for `onAddNewRow`. */ export interface ArgsAddNewRow extends ArgsColumn { /** Provisional new data item being added. */ item: any; } /** Payload for `onBeforeCellEditorDestroy`. */ export interface ArgsEditorDestroy extends ArgsGrid { /** Editor instance about to be destroyed. */ editor: Editor; } /** Payload for `onValidationError`. */ export interface ArgsValidationError extends ArgsCell { /** Editor that failed validation. */ editor: Editor; /** Column being validated. */ column: Column; /** DOM node of the failing cell. */ cellNode: HTMLElement; /** Validation result containing `valid` flag and message. */ validationResults: ValidationResult; } export type CellEvent = EventData; export type CellKeyboardEvent = EventData; export type CellMouseEvent = EventData; export type HeaderColumnEvent = EventData; export type HeaderMouseEvent = EventData; export type HeaderRenderEvent = EventData; export type FooterColumnEvent = HeaderColumnEvent; export type FooterMouseEvent = HeaderMouseEvent; export type FooterRenderEvent = HeaderRenderEvent; export type GridEvent = EventData; export type GridDragEvent = EventData; export type GridMouseEvent = EventData; export type GridSortEvent = EventData; /** * Contract for grid plugins (e.g. selection models, overlays). */ export interface GridPlugin { /** * Called by the grid when the plugin is registered. * @param grid - Host grid instance the plugin attaches to. */ init(grid: ISleekGrid): void; /** Optional unique name used by {@link GridPluginHost.getPluginByName} for lookup. */ pluginName?: string; /** Optional teardown hook; called when the grid or plugin is unregistered. */ destroy?: () => void; } /** * Legacy alias for {@link GridPlugin}. * @deprecated Use {@link GridPlugin} instead. */ export interface IPlugin extends GridPlugin { } /** * Host surface implemented by the grid for managing {@link GridPlugin} lifetimes. */ export interface GridPluginHost { /** * Retrieves a plugin by its {@link GridPlugin.pluginName}. * @param name - Plugin name to look up. * @returns The plugin instance, or `null`/`undefined` when not found. */ getPluginByName(name: string): GridPlugin; /** * Registers a plugin and calls its {@link GridPlugin.init}. * @param plugin - Plugin to register. */ registerPlugin(plugin: GridPlugin): void; /** * Unregisters a plugin, calling {@link GridPlugin.destroy} if defined. * @param plugin - Plugin to remove. */ unregisterPlugin(plugin: GridPlugin): void; } /** * Reactive signals surface for the grid's chrome and pinning state. * Backed by `@serenity-is/domwise` signals and used internally by the grid * and layout engine to drive visibility and pinning. */ export interface GridSignals { /** Whether the column header row is visible. */ readonly showColumnHeader: Signal; /** Inverse of {@link GridSignals.showColumnHeader}; `true` when the header is hidden. */ readonly hideColumnHeader: Computed; /** Whether the top panel row is visible. */ readonly showTopPanel: Signal; /** Inverse of {@link GridSignals.showTopPanel}. */ readonly hideTopPanel: Computed; /** Whether the header row (filter row) is visible. */ readonly showHeaderRow: Signal; /** Inverse of {@link GridSignals.showHeaderRow}. */ readonly hideHeaderRow: Computed; /** Whether the footer row is visible. */ readonly showFooterRow: Signal; /** Inverse of {@link GridSignals.showFooterRow}. */ readonly hideFooterRow: Computed; /** Number of columns pinned to the start (left in LTR, right in RTL) side. */ readonly pinnedStartCols: Signal; /** Number of columns pinned to the end (right in LTR, left in RTL) side. */ readonly pinnedEndCols: Signal; /** Number of rows frozen at the top of the viewport. */ readonly frozenTopRows: Signal; /** Number of rows frozen at the bottom of the viewport. */ readonly frozenBottomRows: Signal; } /** * Computed layout metrics for the grid viewport. Calculated during `computeViewportInfo()` * and used to size canvases, set scroll extents and decide virtualization bounds. */ export interface ViewportInfo { /** Height of the scrollable viewport in pixels. */ height: number; /** Width of the scrollable viewport in pixels. */ width: number; /** Whether a vertical scrollbar is currently present. */ hasVScroll: boolean; /** Whether a horizontal scrollbar is currently present. */ hasHScroll: boolean; /** Height of the column header row in pixels. */ headerHeight: number; /** Height of the grouping panel in pixels. */ groupingPanelHeight: number; /** Total virtual height of all rows (`rowHeight * rowCount`), before capping. */ virtualHeight: number; /** Actual scrollable height applied to the canvas (capped for very large data sets). */ realScrollHeight: number; /** Height of the top panel in pixels. */ topPanelHeight: number; /** Height of the header-row (filter row) in pixels. */ headerRowHeight: number; /** Height of the footer row in pixels. */ footerRowHeight: number; /** Number of rows estimated to fit in the current viewport (`ceil(height/rowHeight)+1`). */ numVisibleRows: number; } /** Logical horizontal band key. `start`/`end` are pinned side bands. */ export type BandKey = "start" | "main" | "end"; /** Logical vertical pane key within each band. */ export type PaneKey = "top" | "body" | "bottom"; /** * DOM and layout state for a single horizontal band (`start`/`main`/`end`). */ export interface GridBandRefs { /** Band identifier. */ key: BandKey; /** Header column container for this band, if rendered. */ headerCols?: HTMLElement; /** Header-row (filter row) column container, if rendered. */ headerRowCols?: HTMLElement; /** Canvas elements per vertical pane. */ canvas: { /** Top-frozen pane canvas, if enabled. */ top?: HTMLElement; /** Main body viewport canvas. */ body: HTMLElement; /** Bottom-frozen pane canvas, if enabled. */ bottom?: HTMLElement; }; /** Footer row column container, if rendered. */ footerRowCols?: HTMLElement; /** Column index offset for cells inside this band (e.g. pinned count). */ readonly cellOffset: number; /** Measured canvas width for this band in pixels. */ canvasWidth: number; } /** * Aggregated refs for all bands and derived pinning/frozen indices. */ export type GridLayoutRefs = { /** Band refs for the pinned-start side. */ readonly start: GridBandRefs; /** Band refs for the main (center, scrollable) band. */ readonly main: GridBandRefs; /** Band refs for the pinned-end side. */ readonly end: GridBandRefs; /** Top panel container element, if rendered. */ topPanel?: HTMLElement; /** Number of columns pinned to the start (derived, bounded by `config`). */ readonly pinnedStartCols: number; /** Last pinned-start column index or `-Infinity` when none. */ readonly pinnedStartLast: number; /** Number of columns pinned to the end. */ readonly pinnedEndCols: number; /** First pinned-end column index or `Infinity` when none. */ readonly pinnedEndFirst: number; /** Number of top-frozen rows. */ readonly frozenTopRows: number; /** Last top-frozen row index or `-Infinity` when none. */ readonly frozenTopLast: number; /** Number of bottom-frozen rows. */ readonly frozenBottomRows: number; /** First bottom-frozen row index or `Infinity` when none. */ readonly frozenBottomFirst: number; /** Writable config inputs; setters trigger {@link createGridSignalsAndRefs} recalculation. */ config: { /** Desired start-pinned column count. */ pinnedStartCols?: number; /** Desired end-pinned column count. */ pinnedEndCols?: number; /** Maximum total pinned columns, or `null` to allow all. */ pinnedLimit?: number | null; /** Total column count driving index calculations. */ colCount?: number; /** Desired top-frozen row count. */ frozenTopRows?: number; /** Desired bottom-frozen row count. */ frozenBottomRows?: number; /** Maximum total frozen rows, or `null` to allow all. */ frozenLimit?: number | null; /** Total data row count driving frozen calculations. */ dataLength?: number; }; }; /** * Factory for the reactive signals and derived layout refs that drive pinning and frozen rows. * Generates computed visibility signals, bounded pinning/frozen counters and live getters/setters on `refs.config`. * @returns Object containing `signals` and `refs` wired for mutual recalculation. */ export declare function createGridSignalsAndRefs(): { signals: GridSignals; refs: GridLayoutRefs; }; /** * Minimal host surface exposed to {@link LayoutEngine} implementations. * Narrower than {@link ISleekGrid}; only what layouts need is exposed. */ export interface LayoutHost extends Pick, GridPluginHost { /** * Returns the shared reactive signals controlling visibility/pinning. * @returns Grid signals object. */ getSignals(): GridSignals; /** * Returns computed viewport metrics (dimensions, scroll flags, heights). * @returns Current {@link ViewportInfo}. */ getViewportInfo(): ViewportInfo; /** * Removes a DOM node via the grid's configured sanitizer/custom remover. * @param node - Element to remove. */ removeNode(node: HTMLElement): void; /** Mutable refs tracking per-band DOM nodes and pinning/frozen state. */ readonly refs: GridLayoutRefs; } /** * Pluggable layout strategy responsible for creating DOM panes and responding * to grid option changes. The grid instantiates one engine (typically * {@link BasicLayout} or {@link FrozenLayout}). */ export interface LayoutEngine { /** Human-readable layout name (e.g. `"BasicLayout"`). */ layoutName: string; /** * Initializes the layout, creating DOM inside `host.getContainerNode()`. * @param host - Layout host providing grid state, signals and refs. */ init(host: LayoutHost): void; /** Tears down DOM and listeners created by {@link LayoutEngine.init}. */ destroy(): void; /** * Adjusts the frozen-row refs from the current grid options without a * full re-layout. Called when `frozenRows` / `frozenBottom` change. */ adjustFrozenRowsOption?(): void; /** * Called after `grid.setOptions(args)` merges new options. * @param args - Options delta passed to `setOptions`. */ afterSetOptions(args: GridOptions): void; /** * Optionally reorders the visible columns before they are laid out. * May be called before {@link LayoutEngine.init} during early option setup. * @param viewCols - Current visible columns in display order. * @param refs - Mutable layout refs whose config may be updated. * @returns Reordered columns, or `null` when no reorder is needed. */ reorderViewColumns?(viewCols: Column[], refs: GridLayoutRefs): Column[]; /** Whether the engine supports pinned (frozen) columns. */ supportPinnedCols?: boolean; /** Whether the engine supports end-pinned columns. */ supportPinnedEnd?: boolean; /** Whether the engine supports top-frozen rows. */ supportFrozenRows?: boolean; /** Whether the engine supports bottom-frozen rows. */ supportFrozenBottom?: boolean; } /** * Represents a group of rows produced by a `DataView` grouping. * @template TEntity - Row item type being grouped. */ export declare class Group extends NonDataRow { /** Marker flag identifying this row as a group header. */ readonly __group = true; /** * Grouping level, starting with `0` for top-level groups. */ level: number; /** * Number of leaf rows in the group (excluding group headers/totals). */ count: number; /** * Grouping value that all rows in this group share (e.g. the field value). */ value: any; /** * Whether the group is currently collapsed (children hidden). */ collapsed: boolean; /** * Associated totals row for the group, if aggregation is enabled. */ totals: GroupTotals; /** * Leaf rows that are part of the group. */ rows: TEntity[]; /** * Child groups when multiple grouping levels are active. */ groups: Group[]; /** * Unique key used to identify the group; pass to `DataView.collapseGroup()` / `expandGroup()`. */ groupingKey: string; /** Formatter that renders the group value as text. */ formatValue: (ctx: FormatterContext>) => FormatterResult; /** * Compares two groups by `value`, `count` and `collapsed` state. * @param group - Group instance to compare to. * @returns `true` if the groups are equal by the above fields. */ equals(group: Group): boolean; } /** * Minimal totals information attached to a {@link Group}. Aggregators populate * `sum`/`avg`/`min`/`max` and arbitrary data on this object. * @template TEntity - Row item type. */ export interface IGroupTotals { /** Whether the row is a non-data row (inherited from {@link NonDataRow}). */ __nonDataRow?: boolean; /** Marker identifying the row as a group-totals row. */ __groupTotals?: boolean; /** Parent group this totals row belongs to. */ group?: Group; /** Whether totals have been fully calculated; `false` for lazy totals. */ initialized?: boolean; /** Per-field sum values. */ sum?: Record; /** Per-field average values. */ avg?: Record; /** Per-field minimum values. */ min?: Record; /** Per-field maximum values. */ max?: Record; } /** * Totales row for a {@link Group}. Created for each group and passed to aggregators * so they can store computed data that is later accessed by group-totals formatters. * @template TEntity - Row item type. */ export declare class GroupTotals extends NonDataRow implements IGroupTotals { /** Marker identifying this row as a group-totals row. */ readonly __groupTotals = true; /** * Parent group this totals row belongs to. */ group: Group; /** * Whether the totals have been fully initialized/calculated. * Set to `false` for lazy-calculated totals. */ initialized: boolean; /** * Per-field sum values computed by aggregators. */ sum?: Record; /** * Per-field average values computed by aggregators. */ avg?: Record; /** * Per-field minimum values computed by aggregators. */ min?: Record; /** * Per-field maximum values computed by aggregators. */ max?: Record; } /** * Configuration options for the SleekGrid component. * * @template TItem - The type of items in the grid. */ export interface GridOptions { /** * CSS class applied to newly added rows for custom styling. Default is `"new-row"`. */ addNewRowCssClass?: string; /** * Defaults to `false`. If `true`, a horizontal scrollbar is always visible regardless of content width. */ alwaysAllowHorizontalScroll?: boolean; /** * Defaults to `false`. If `true`, a vertical scrollbar is always visible, useful for fixed-height grids or menus. */ alwaysShowVerticalScroll?: boolean; /** * Defaults to `100`. Delay in milliseconds before asynchronous loading of editors. */ asyncEditorLoadDelay?: number; /** * Defaults to `false`. If `true`, editors are loaded asynchronously, reducing initial rendering load. */ asyncEditorLoading?: boolean; /** * Defaults to `40`. Delay in milliseconds before cleaning up post-rendered elements. */ asyncPostCleanupDelay?: number; /** * Defaults to `-1` which means immediate execution. Delay in milliseconds before starting asynchronous post-rendering. */ asyncPostRenderDelay?: number; /** * Defaults to `true`. If `true`, automatically opens the cell editor when a cell gains focus. */ autoEdit?: boolean; /** * Defaults to `false`. If `true`, automatically adjusts the grid's height to fit the entire content without scrolling. */ autoHeight?: boolean; /** * CSS class applied to cells with a flashing effect. Default is `"flashing"`. */ cellFlashingCssClass?: string; /** * Function to handle clearing a DOM node, used for custom cleanup logic. Default is `null`. */ emptyNode?: (node: Element) => void; /** * Array of column definitions for the grid. */ columns?: Column[]; /** * @deprecated Use showGroupingPanel option instead. */ createPreHeaderPanel?: boolean; /** * Function to extract column values from data items, used for custom copy buffer operations. Default is `null`. */ dataItemColumnValueExtractor?: (item: TItem, column: Column) => void; /** * Defaults to `80`. Default width of columns in pixels. */ defaultColumnWidth?: number; /** * Default formatting options for columns. Default is `defaultColumnFormat`. */ defaultFormat?: ColumnFormat; /** * Default formatter function for cells. */ defaultFormatter?: CompatFormatter; /** * Defaults to `false`. If `true`, cells can be edited inline. */ editable?: boolean; /** * Function to handle edit commands, useful for implementing custom undo support. Default is `null`. */ editCommandHandler?: (item: TItem, column: Column, command: EditCommand) => void; /** * Defaults to `false`. If `true`, enables navigation between cells using left and right arrow keys within the editor. */ editorCellNavOnLRKeys?: boolean; /** * Factory function for creating custom editors. Default is `null`. */ editorFactory?: EditorFactory; /** * Global editor lock instance, used for managing concurrent editor access. Default is `GlobalEditorLock`. */ editorLock?: EditorLock; /** * Defaults to `false`. If `true`, enables the ability to add new rows to the grid. */ enableAddRow?: boolean; /** * Defaults to `false`. If `true`, enables asynchronous post-rendering. */ enableAsyncPostRender?: boolean; /** * Defaults to `false`. If `true`, enables cleanup after asynchronous post-rendering. */ enableAsyncPostRenderCleanup?: boolean; /** * Defaults to `true`. If `true`, enables cell navigation with arrow keys. */ enableCellNavigation?: boolean; /** * Defaults to `false`. If `true`, allows selection of cell ranges. */ enableCellRangeSelection?: boolean; /** * Defaults to `true`. If `true`, enables column reordering. */ enableColumnReorder?: boolean; /** * Allow returning raw HTML strings from formatters and use `innerHTML` to render them. Defaults to `false` for tighter security. * It is recommended to leave this as `false` for better security and to avoid XSS vulnerabilities. In that case, formatters should return plain text or DOM elements. */ enableHtmlRendering?: boolean; /** * Defaults to `false`. If `true`, enables row reordering. */ enableRowReordering?: boolean; /** * Defaults to `true`. If `true`, enables navigation between cells using the Tab key. */ enableTabKeyNavigation?: boolean; /** * Defaults to `false`. If `true`, enables text selection within cells. */ enableTextSelectionOnCells?: boolean; /** * Defaults to `false`. If `true`, requires explicit initialization of the grid. */ explicitInitialization?: boolean; /** * Defaults to null which means the footer row height is calculated based on CSS rules. */ footerRowHeight?: number; /** * Defaults to `false`. If `true`, forces columns to fit the grid width. */ forceFitColumns?: boolean; /** * Defaults to `false`. If `true`, synchronizes scrolling between the grid and its container. */ forceSyncScrolling?: boolean; /** * Defaults to `250`. Interval in milliseconds for synchronizing scrolling when `forceSyncScrolling` is enabled. */ forceSyncScrollInterval?: number; /** * Factory function for creating custom formatters. Default is `null`. */ formatterFactory?: FormatterFactory; /** * Defaults to `false`. If `true`, requests frozen rows at the bottom edge of the grid. * Layouts without bottom-frozen row support leave `frozenRows` unfrozen. */ frozenBottom?: boolean | 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. */ frozenColumns?: number; /** * Defaults to `undefined`. If specified, freezes the given number of rows at the top, or at the * bottom when `frozenBottom` is `true` and the layout supports bottom-frozen rows. Otherwise, * those rows are left unfrozen when `frozenBottom` is `true`. */ frozenRows?: number; /** * Defaults to `false`. If `true`, makes rows take the full width of the grid. */ fullWidthRows?: boolean; /** * Defaults to `false`. If `true`, shows the grouping panel for grouping columns. */ groupingPanel?: boolean; /** * Defaults to null, e.g. calculated based on CSS. Height of the grouping panel in pixels. */ groupingPanelHeight?: number; /** * Function to format group totals for display in the grouping panel. */ groupTotalsFormat?: (ctx: FormatterContext>) => FormatterResult; /** * Function to format group totals for display in the grouping panel. * @deprecated Use `groupTotalsFormat` with `FormatterContext` signature instead. */ groupTotalsFormatter?: (totals?: IGroupTotals, column?: Column, grid?: ISleekGrid) => string; /** * Defaults to null, e.g. calculated based on CSS. Height of the header row in pixels. */ headerRowHeight?: number; /** * jQuery object for compatibility or custom integration purposes. Default is `undefined` unless jQuery is available in the global object (e.g. window). */ jQuery?: { ready: any; fn: any; }; /** * Defaults to `false`. If `true`, leaves space for new rows in the DOM visible buffer. */ leaveSpaceForNewRows?: boolean; /** * Layout engine for custom grid layouts. Default is `BasicLayout`. Use FrozenLayout to enable frozen columns / rows. */ layoutEngine?: LayoutEngine | (() => LayoutEngine); /** * Defaults to `3`. Minimum number of rows to keep in the buffer. */ minBuffer?: number; /** * Defaults to `false`. If `true`, allows sorting by multiple columns simultaneously. */ multiColumnSort?: boolean; /** * Defaults to `true`. If `true`, enables multiple cell selection. */ multiSelect?: boolean; /** * @deprecated Use groupingPanelHeight option instead. */ preHeaderPanelHeight?: number; /** * Defaults to `false`. If `true`, renders all cells (row columns) in the viewport, at the cost of higher memory usage and reduced performance. */ renderAllCells?: 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. */ renderAllRows?: boolean; /** * Function to handle removing a DOM node, used for custom cleanup logic. Default is `null` or jQuery.remove if available. */ removeNode?: (node: Element) => void; /** * Defaults to `30`. Height of rows in pixels. */ rowHeight?: number; /** * Default is based on document element's (``) `dir` property.. If `true`, enables right-to-left text direction. */ rtl?: boolean; /** * Optional function for sanitizing HTML strings to avoid XSS attacks. * Default is `DOMPurify.sanitize` if available globally, otherwise falls back to `basicDOMSanitizer`. */ sanitizer?: (dirtyHtml: string) => string; /** * CSS class applied to selected cells. Default is `"selected"`. */ selectedCellCssClass?: string; /** * Defaults to `true`. If `true`, shows cell selection indicators. */ showCellSelection?: boolean; /** * Defaults to `true`. If `true`, displays the column header. */ showColumnHeader?: boolean; /** * Defaults to `false`. If `true`, displays the footer row. */ showFooterRow?: boolean; /** * Defaults to `false`. If `true`, displays the grouping panel. */ showGroupingPanel?: boolean; /** * Defaults to `false`. If `true`, displays the header row. */ showHeaderRow?: boolean; /** * @deprecated Use showGroupingPanel option instead. */ showPreHeaderPanel?: boolean; /** * Defaults to `false`. If `true`, displays the post-header panel for additional controls or information. */ showTopPanel?: boolean; /** * Defaults to `false`. If `true`, suppresses the activation of cells when they contain an editor and are clicked. */ suppressActiveCellChangeOnEdit?: boolean; /** * Nonce value for CSP (Content Security Policy) when `useCssVars` is `false`. Applied to the dynamically * created `