import { IHandlers } from "../../ts-common/types"; import { IEventSystem } from "../../ts-common/events"; import { ICoords, IGrid, IHeader } from "../../ts-grid"; import { IToolbar } from "../../ts-toolbar"; import { ContextMenu, Menu } from "../../ts-menu"; import { EditLine } from "./EditLine"; import { Exporter } from "./Exporter"; import { IFormula, DataPage, DataStore, Store as MuonStore } from "../../muon"; import { DataCollection } from "../../ts-data"; import { IKeyManager } from "../../ts-common/newKeyManager"; import { ISelectedCell } from "./Selection"; import { Store } from "./Store"; import { MathSerialization, mathFunction } from "../../muon/dist/types/types"; import { VNode } from "../../ts-common/dom"; /** Primitive value that a spreadsheet cell can hold. */ export type cellValue = number | string | boolean; /** Supported file formats for data loading and export. */ export type FileFormat = "json" | "csv" | "xlsx"; /** Cell data type classification. */ export type CellTypes = "string" | "number"; /** Cell format mask string (e.g. `"#,##0.00"`, `"$#,##0.00"`). */ export type CellFormats = string; export type Id = string | number; /** * Localization settings for number, currency, date, and time formatting. * * @example * ```ts * const localization: ILocalization = { * decimal: ",", * thousands: " ", * currency: "€", * dateFormat: "%d/%m/%Y", * timeFormat: 24 * }; * ``` */ export interface ILocalization { /** Decimal separator character. */ decimal?: "." | ","; /** Thousands grouping separator. */ thousands?: "." | "," | " " | ""; /** Currency symbol displayed in currency-formatted cells. */ currency?: string; /** Date format pattern (e.g. `"%d/%m/%Y"`). */ dateFormat?: string; /** Time display format: 12-hour or 24-hour clock. */ timeFormat?: 12 | 24; } /** Predefined format alias identifiers. */ export type formatAliases = "common" | "number" | "currency" | "percent" | "text" | "date" | "time"; /** * Custom number format definition. * * @example * ```ts * const format: IFormats = { * id: "custom_price", * mask: "$#,##0.00", * name: "Price", * example: "$1,234.56" * }; * ``` */ export interface IFormats { /** Unique format identifier — either a built-in alias or a custom string. */ id: formatAliases | string; /** The number format mask pattern. */ mask: string; /** Human-readable format name displayed in the toolbar format picker. */ name?: string; /** Example string shown in the format picker dropdown. */ example?: string; /** Time format override for this specific format. */ timeFormat?: number; /** @internal Cached computed value. */ $value?: cellValue | Date; } /** * Identifiers for toolbar block groups. * Pass an array of these to {@link ISpreadsheetConfig.toolbarBlocks} to * control which toolbar sections are visible. */ export type ToolbarBlocks = "default" | "undo" | "colors" | "columns" | "rows" | "cell" | "lock" | "align" | "decoration" | "clear" | "help" | "format" | "actions" | "file"; /** * Constructor configuration for the Spreadsheet widget. * * @example * ```ts * const spreadsheet = new dhx.Spreadsheet("container", { * rowsCount: 100, * colsCount: 26, * editLine: true, * menu: true, * readonly: false, * multiSheets: true, * toolbarBlocks: ["undo", "colors", "align", "decoration", "format"], * localization: { * decimal: ",", * currency: "€" * } * }); * ``` */ export interface ISpreadsheetConfig { /** Path to the XLSX import module for loading `.xlsx` files. */ importModulePath?: string; /** Path to the XLSX export module for saving `.xlsx` files. */ exportModulePath?: string; /** Number of rows in the grid. */ rowsCount?: number; /** Number of columns in the grid. */ colsCount?: number; /** Whether to display the formula/edit line above the grid. */ editLine?: boolean; /** Whether to enable the context menu on right-click. */ menu?: boolean; /** Whether the spreadsheet is in read-only mode (no editing allowed). */ readonly?: boolean; /** Whether to enable multiple sheet tabs. */ multiSheets?: boolean; /** Number, currency, date, and time formatting locale configuration. */ localization?: ILocalization; /** Toolbar block groups to display. Pass `["default"]` to show all blocks. */ toolbarBlocks?: ToolbarBlocks[]; /** Custom number format definitions available in the format picker. */ formats?: IFormats[]; /** @internal Whether to enable automatic format detection. */ autoFormat?: boolean; /** @internal Custom hotkey handlers. */ hotkeys?: IHandlers; /** * Number of frozen columns from the left edge. * @deprecated Set inside your data instead. * @example * ```ts * data = { * sheets: [{ * name: "Sheet 1", * freeze: { col: "A", row: 1 } * }] * }; * ``` */ leftSplit?: number; /** * Number of frozen rows from the top edge. * @deprecated Set inside your data instead. * @example * ```ts * data = { * sheets: [{ * name: "Sheet 1", * freeze: { col: "A", row: 1 } * }] * }; * ``` */ topSplit?: number; /** * Date display format pattern. * @deprecated Use {@link ISpreadsheetConfig.localization | localization.dateFormat} instead. */ dateFormat?: string; /** * Time display format (12 or 24 hour). * @deprecated Use {@link ISpreadsheetConfig.localization | localization.timeFormat} instead. */ timeFormat?: number; } /** * A map of CSS property names to their string values, * used for cell styling. * * @example * ```ts * const style: IStylesList = { * "font-weight": "bold", * "background": "#ffeb3b", * "color": "#333" * }; * ``` */ export interface IStylesList { [key: string]: string; } /** * Hyperlink definition for a cell. */ export interface ILink { /** Display text for the link. If omitted, `href` is shown. */ text?: string; /** URL the hyperlink points to. */ href: string; } /** * Cell editor configuration for data validation dropdowns. */ interface CellEditor { /** Editor type. Currently only `"select"` is supported. */ type: "select"; /** Dropdown options — a single comma-separated string or an array of strings. */ options?: string | string[]; } /** * Declarative cell information used in {@link ISpreadsheet.parse} data arrays. * * @example * ```ts * const cellInfo: ICellInfo = { * cell: "A1", * value: "Revenue", * css: "bold", * format: "currency", * editor: { type: "select", options: ["Yes", "No"] } * }; * ``` */ export interface ICellInfo { /** Cell reference in A1 notation (e.g. `"A1"`, `"B2"`). */ cell: string; /** Cell value: text, number, or Date. */ value?: string | number | Date; /** XLSX formula metadata imported from Excel. */ formula?: IXlsxFormulaMetadata; /** CSS class name(s) referencing keys in the styles map. */ css?: string; /** Number format mask or alias. */ format?: string; /** Dropdown editor configuration for data validation. */ editor?: CellEditor; /** Hyperlink attached to the cell. */ link?: ILink; /** Whether the cell is locked (protected from editing). */ locked?: boolean; } /** * Internal cell metadata used by the rendering engine. */ export interface ICellMeta { /** Whether the cell is locked (protected from editing). */ locked?: boolean; /** Whether the cell is currently being edited. */ edited?: boolean; /** Whether the cell is currently selected. */ selected?: boolean; /** CSS class name(s). */ css?: string; /** Raw editor value (the string shown in the edit line). */ editorValue?: string; /** Dropdown editor configuration. */ editor?: CellEditor; /** Pending value to be applied after edit commit. */ nextValue?: cellValue; /** Resolved format object for this cell. */ format?: IFormats; /** Data type classification of the cell value. */ type?: CellTypes; /** The cell's current value. */ value?: string | number | boolean; /** XLSX formula metadata imported from Excel. */ formula?: IXlsxFormulaMetadata; /** Hyperlink attached to the cell. */ link?: ILink; /** Identifier of the merged span this cell belongs to. */ spanId?: string; /** Whether this cell is the top-left origin of a merged span. */ isSpanStart?: boolean; [key: string]: any; } export interface IXlsxFormulaMetadata { type: "normal" | "shared"; role?: "master" | "follower"; si?: string; ref?: string; value?: string; } /** * Muon cell tuple: `[row, column, metadata]`. * Used internally for serialization between the math engine and the grid. */ export type IMuonCell = [number, number, ICellMeta]; /** * Cell reference by column letter and row number string. * Returned by {@link ISpreadsheet.getCellIndex}. */ export interface ICell { /** Row number as a string (e.g. `"1"`, `"42"`). */ row: string; /** Column letter (e.g. `"A"`, `"BC"`). */ col: string; } /** * A range of cells defined by start and end cell references. */ export interface IRange { /** Top-left cell of the range. */ start: ICell; /** Bottom-right cell of the range. */ end: ICell; } /** * Cell reference by 0-indexed numeric coordinates. */ export interface ICellIndex { /** 0-indexed row number. */ row: number; /** 0-indexed column number. */ col: number; } /** * A range of cells defined by 0-indexed numeric coordinates. */ export interface IRangeIndex { /** Top-left cell of the range. */ start: ICellIndex; /** Bottom-right cell of the range. */ end: ICellIndex; } /** * A merged cell span definition. */ export interface ISpan { /** Unique span identifier. */ id: string; /** Top-left cell of the span (0-indexed). */ cell: { row: number; column: number; }; /** Number of rows the span covers. */ rowspan: number; /** Number of columns the span covers. */ colspan: number; } /** * Merged cell range as returned by the parser (from/to notation). */ export interface ISpanFromParse { /** Top-left corner of the merge (0-indexed). */ from: { row: number; column: number; }; /** Bottom-right corner of the merge (0-indexed). */ to: { row: number; column: number; }; } /** Map of span identifiers to their span definitions. */ export type IMerged = Map; /** * Available filter condition types. */ export declare enum FilterConditions { /** Cell is empty. */ e = "e", /** Cell is not empty. */ ne = "ne", /** Text contains the given substring. */ tc = "tc", /** Text does not contain the given substring. */ tdc = "tdc", /** Text starts with the given string. */ ts = "ts", /** Text ends with the given string. */ te = "te", /** Text matches the given string exactly. */ tex = "tex", /** Date equals the given date. */ d = "d", /** Date is before the given date. */ db = "db", /** Date is after the given date. */ da = "da", /** Value is greater than the given number. */ gt = "gt", /** Value is greater than or equal to the given number. */ geq = "geq", /** Value is less than the given number. */ lt = "lt", /** Value is less than or equal to the given number. */ leq = "leq", /** Value equals the given number. */ eq = "eq", /** Value does not equal the given number. */ neq = "neq", /** Value is between two given numbers (inclusive). */ ib = "ib", /** Value is not between two given numbers. */ inb = "inb" } /** * A single filter rule for column filtering. */ export interface IFilterRules { /** Condition-based filter with a comparison factor and optional value. */ condition?: { factor: FilterConditions; value?: cellValue | Date; }; /** Array of values to exclude from the filtered results. */ exclude?: (cellValue | Date)[]; } /** * Filter configuration applied to a sheet column. */ export interface IFilter { /** Cell reference identifying the filtered range (e.g. `"A1"`). */ cell: string; /** Array of filter rules. Empty array clears the filter. */ rules: IFilterRules[]; } /** * Sheet descriptor containing its identifier and display name. */ export interface ISheet { /** Display name shown on the sheet tab. */ name: string; /** Unique sheet identifier. */ id: Id; } /** * Row grid descriptor. */ export interface IRow { /** Row identifier. */ id: Id; } /** * Column grid descriptor. */ export interface ICol { /** Column identifier. */ id: Id; /** @internal Edit state. */ $edit?: boolean | Record; /** @internal Header configuration. */ header?: IHeader[]; } /** * Column metadata used in serialized sheet data. */ export type TColMeta = { /** Column width in pixels. */ width: number; /** Set of row indices that have text wrapping enabled in this column. */ wrappedRows: Set; }; /** * Complete data for a single sheet, used in {@link IDataWithStyles.sheets}. * * @example * ```ts * const sheetData: ISheetData = { * name: "Sales", * id: "sheet_1", * data: [ * { cell: "A1", value: "Product", css: "bold" }, * { cell: "B1", value: "Revenue", css: "bold" }, * { cell: "A2", value: "Laptop" }, * { cell: "B2", value: 12500, format: "currency" } * ], * cols: [{ width: 200 }, { width: 120 }], * freeze: { col: 0, row: 1 } * }; * ``` */ export interface ISheetData { /** Array of cell data entries for this sheet. */ data: ICellInfo[]; /** Display name for the sheet tab. */ name?: string; /** Unique sheet identifier. */ id?: string; /** Column configuration array (width, visibility). */ cols?: { width?: number; hidden?: boolean; }[]; /** Row configuration array (height, visibility). */ rows?: { height?: number; hidden?: boolean; }[]; /** Merged cell ranges. */ merged?: { from: { row: number; column: number; }; to: { row: number; column: number; }; }[]; /** Freeze pane configuration (0-indexed). */ freeze?: { row?: number; col?: number; }; } /** * Serialized spreadsheet data with embedded style definitions. * Returned by {@link ISpreadsheet.serialize} and accepted by {@link ISpreadsheet.parse}. * * @example * ```ts * const data: IDataWithStyles = { * styles: { * bold: { "font-weight": "bold" }, * highlight: { background: "#ffeb3b" } * }, * sheets: [ * { * name: "Sheet 1", * id: "s1", * data: [{ cell: "A1", value: "Hello", css: "bold" }] * } * ] * }; * ``` */ export interface IDataWithStyles { /** Cell data array (used when there is a single sheet). */ data?: ICellInfo[]; /** CSS style definitions map. Keys are class names, values are CSS property maps. */ styles: { [key: string]: IStylesList; }; /** Custom number format definitions. */ formats?: IFormats[]; /** Per-sheet data (used with `multiSheets: true`). */ sheets?: ISheetData[]; } /** * Data structure representing the contents of the clipboard buffer. */ export interface ICopyData { /** Array of cell values in the copied range. */ values: string[]; /** Number of rows in the copied range. */ rowsCount: number; /** Number of columns in the copied range. */ colsCount: number; /** Format masks for each cell in the copied range. */ formats: (string | undefined)[]; /** Cell metadata for the copied range. */ meta?: ICellMeta[]; /** Style definitions referenced by the copied cells. */ styles?: {}; /** Merged spans within the copied range. */ spans?: ISpan[]; } /** * Internal clipboard buffer state. */ export interface IBufferStruct { /** Copied cell value(s). */ value: string | string[] | number | number[]; /** Style(s) of the copied cell(s). */ styles: IStylesList | IStylesList[]; /** Cell reference of the copy origin. */ cell: string; /** Formula data for the copied cell(s). */ math: IFormula[]; /** Cell metadata array. */ meta: ICellMeta[]; /** Selected cell range as a string. */ cells: string; /** Format masks for each copied cell. */ formats: string[]; /** Whether content has been inserted into the buffer. */ inserted: boolean; /** The operation type: `"cut"`, `"copy"`, or empty. */ operation: "cut" | "copy" | ""; /** HTML representation of the copied content (for cross-app paste). */ html: string; /** Merged spans within the copied range. */ spans: ISpan[]; } /** * Clipboard buffer manager interface. */ export interface IBufferManager { /** Stores a copy or cut operation into the buffer. */ store: (operation: IBufferStruct["operation"], col?: number, row?: number) => void; /** Pastes the buffer contents at the current selection. */ paste: () => void; /** Returns the current buffer state. */ getStruct: () => IBufferStruct; } /** * Context page reference used internally for cross-sheet formula resolution. * @internal */ export interface IContextPage { /** The DataPage instance. */ page: DataPage; /** Cell reference in A1 notation. */ cell: string; /** Display name of the sheet. */ pageName: string; } /** * Internal metadata for a single sheet page. * Tracks UI state (scroll position, selection) and structural config * (column widths, row heights, freezes, merges). * @internal */ export interface IPageMeta { /** Column configuration array. */ cols?: { width: number; hidden?: boolean; }[]; /** Row configuration array. */ rows?: { height: number; hidden?: boolean; }[]; /** Whether this page was dynamically inserted. */ inserted?: boolean; /** Current scroll position. */ scroll?: ICoords; /** Sheet identifier. */ id?: Id; /** Currently selected cell references. */ selectedCells?: string[]; /** Currently focused cell. */ focusedCell?: ISelectedCell; /** Number of frozen columns from the left. */ leftSplit?: number; /** Active filter configuration. */ filter?: IFilter; /** Map of merged cell spans. */ merged: IMerged; /** Column letter up to which columns are frozen. */ freezedCol?: string; /** Row number up to which rows are frozen. */ freezedRow?: number; /** Boolean array indicating which rows are hidden by the active filter. */ filteredRows?: boolean[]; /** Cross-sheet context page reference. */ contextPage?: IContextPage; /** Sheet display name. */ name?: string; /** Cursor position within the edit line. */ editLinePos?: number; } /** * Serialized page collection keyed by page identifier. * @internal */ export interface IPagesSerialization { [key: string]: { data: MathSerialization[]; meta: IPageMeta; }; } /** * Configuration object for the EditLine constructor. * @internal */ export interface IEditLineConfig { /** Service event system for internal spreadsheet events. */ serviceEvents: IEventSystem; /** Public event system for spreadsheet events. */ events: IEventSystem; /** Muon math engine store. */ math: MuonStore; /** Spreadsheet data store. */ store: Store; /** Currently active DataPage. */ activePage: DataPage; /** Grid widget instance. */ grid: IGrid; /** Localization configuration. */ localization?: ILocalization; } /** * Configuration object passed to a custom cell editor by the grid renderer. */ export interface IEditorConfig { /** Tuple of [input handler, cell reference] for the oninput event. */ oninput: [(cell: string, e: InputEvent) => void, string]; /** Current cell value as a string. */ value: string; /** Lifecycle hooks provided by the grid renderer. */ _hooks: { didInsert: (...args: unknown[]) => void; [key: string]: (...args: unknown[]) => void; }; /** Any additional HTML attribute-like properties passed by the renderer. */ [key: string]: unknown; } /** * Interface for custom cell editors. */ export interface IEditor { /** Renders the editor UI for the given cell configuration. */ toHTML(conf: IEditorConfig): VNode; /** Sets the editor value, optionally for a specific cell. */ setValue(val: cellValue, cell?: string): void; /** Ends editing. Pass `true` to discard changes. */ endEdit(withoutSave?: boolean): void; /** Hides the editor popup (if applicable). */ hidePopup?(): void; } /** * Identifiers for all spreadsheet actions. * Used in {@link ISpreadsheet.events} handlers for `beforeAction` / `afterAction` * to identify which operation is being performed. */ export declare enum Actions { /** Apply CSS style to cell(s). */ setCellStyle = "setCellStyle", /** Set cell value. */ setCellValue = "setCellValue", /** Set number format on cell(s). */ setCellFormat = "setCellFormat", /** Remove CSS styles from cell(s). */ removeCellStyles = "removeCellStyles", /** Lock or unlock cell(s). */ lockCell = "lockCell", /** Delete row(s). */ deleteRow = "deleteRow", /** Insert row(s). */ addRow = "addRow", /** Delete column(s). */ deleteColumn = "deleteColumn", /** Insert column(s). */ addColumn = "addColumn", /** Batch action containing multiple sub-actions. */ groupAction = "groupAction", /** Batch row action. */ groupRowAction = "groupRowAction", /** Batch column action. */ groupColAction = "groupColAction", /** Add a new sheet. */ addSheet = "addSheet", /** Delete a sheet. */ deleteSheet = "deleteSheet", /** Rename a sheet. */ renameSheet = "renameSheet", /** Clear all data in a sheet. */ clearSheet = "clearSheet", /** Clear selected cells. */ clear = "clear", /** Resize column width. */ resizeCol = "resizeCol", /** Resize row height. */ resizeRow = "resizeRow", /** Set data validation on cell(s). */ setValidation = "setValidation", /** Sort cells. */ sortCells = "sortCells", /** Insert a hyperlink into a cell. */ insertLink = "insertLink", /** Auto-fit column width to content. */ fitColumn = "fitColumn", /** Apply or change column filter. */ filter = "filter", /** Merge cells. */ merge = "merge", /** Unmerge cells. */ unmerge = "unmerge", /** Toggle freeze panes. */ toggleFreeze = "toggleFreeze", /** Toggle row/column visibility. */ toggleVisibility = "toggleVisibility" } /** * Action interface for undo/redo operations. * @internal */ export interface IAction { /** Execute the action. */ do(): void; /** Reverse the action. */ undo(): void; /** Action configuration data. */ config: IActionConfig; } /** * Configuration passed to action execution. * Shape varies by action type — use the `action` field to narrow. */ export interface IExecuteConfig { /** Target row index (0-indexed). */ row?: number; /** Target column index (0-indexed). */ col?: number; /** Action-specific target data (cell or range reference). */ target?: string | string[]; /** New value to apply. */ val?: unknown; /** Previous value (before the action). */ prev?: cellValue | IStylesList | ILink; /** The action identifier. */ action?: Actions; /** Parent group action identifier (when part of a batch). */ groupAction?: Actions; /** Cell reference in A1 notation (e.g. `"A1"`, `"B2:D5"`). */ cell?: string; /** DataStore reference. */ dataStore?: DataStore; /** Sheets data collection. */ sheets?: DataCollection; /** DataPage reference for the target sheet. */ page?: DataPage; /** Target sheet identifier. */ pageId?: Id; /** Target sheet display name. */ pageName?: string; [key: string]: any; } /** * Extended action configuration with runtime dependencies. * @internal */ export interface IActionConfig extends IExecuteConfig { /** Spreadsheet instance reference. */ spreadsheet?: ISpreadsheet; /** Grid instance reference. */ grid?: IGrid; /** Edit line instance reference. */ editLine?: EditLine; /** Service event system. */ serviceEvents: IEventSystem; /** Currently active DataPage. */ activePage: DataPage; /** Store instance. */ store: Store; } /** * Actions manager interface for executing, undoing, and redoing actions. */ export interface IActionsManager { /** * Executes a batch of actions. * @param commandsPack - Array of action configurations to execute sequentially. */ execute(commandsPack: IExecuteConfig[]): void; /** * Executes a single action. * @param command - The action identifier. * @param config - Optional action configuration. */ execute(command: Actions, config?: IExecuteConfig): void; /** Undoes the last action. */ undo(): void; /** Redoes the last undone action. */ redo(): void; } /** * Interface for managing spreadsheet sheets. * Accessible via {@link ISpreadsheet.sheets}. * * @example * ```ts * // Add a new sheet * const newId = spreadsheet.sheets.add("Q4 Report"); * * // Switch to it * spreadsheet.sheets.setActive(newId); * * // List all sheets * const allSheets = spreadsheet.sheets.getAll(); * console.log(allSheets); // [{ id: "s1", name: "Sheet 1" }, { id: "s2", name: "Q4 Report" }] * ``` */ export interface ISheetManager { /** * Parses an array of sheet objects and initializes the internal sheet collection. * @param sheets - Array of sheet descriptors to initialize. */ parseSheets: (sheets: ISheet[]) => void; /** * Adds a new empty sheet. * @param name - Display name for the new sheet tab. Auto-generated if omitted. * @returns The unique identifier of the newly created sheet. */ add: (name?: string) => Id; /** * Removes a sheet by its identifier. * If the removed sheet was active, the spreadsheet switches to another sheet. * @param id - Identifier of the sheet to remove. */ remove: (id: Id) => void; /** * Returns all sheet descriptors. * @returns Array of all sheets with their `id` and `name`. */ getAll: () => ISheet[]; /** * Returns the currently active (visible) sheet. * @returns The active sheet descriptor. */ getActive: () => ISheet; /** * Switches the active sheet. * @param id - Identifier of the sheet to activate. */ setActive: (id: Id) => void; /** * Clears all content from a sheet without removing it. * If no `id` is given, clears the currently active sheet. * @param id - Identifier of the sheet to clear. Defaults to the active sheet. */ clear: (id?: Id) => void; /** * Returns a single sheet descriptor by its identifier. * @param id - Identifier of the sheet to retrieve. * @returns The matching sheet descriptor. */ get: (id: Id) => ISheet; } /** * Interface for managing cell selection and focus. * Accessible via {@link ISpreadsheet.selection}. * * @example * ```ts * // Select a range * spreadsheet.selection.setSelectedCell("A1:C5"); * * // Focus a specific cell * spreadsheet.selection.setFocusedCell("D4"); * * // Get the current selection * const selected = spreadsheet.selection.getSelectedCell(); // "A1:C5" * ``` */ export interface ISelection { /** * Sets the selected cell or range. * @param cell - Cell reference or range in A1 notation (e.g. `"A1"`, `"A1:C5"`). * @param scroll - Whether to scroll the grid to make the cell visible. Default: `true`. */ setSelectedCell(cell: string, scroll?: boolean): void; /** * Returns the currently selected cell or range reference. * @returns Cell reference string in A1 notation. */ getSelectedCell(): string; /** * Sets the focused (active) cell. The focused cell is the one receiving keyboard input. * @param cell - Cell reference in A1 notation (e.g. `"D4"`). * @param scroll - Whether to scroll the grid to make the cell visible. Default: `true`. */ setFocusedCell(cell: string, scroll?: boolean): void; /** * Returns the currently focused cell reference. * @returns Cell reference string in A1 notation. */ getFocusedCell(): string; /** * Removes a cell from the current selection. * @param cell - Cell reference to deselect. */ removeSelectedCell(cell: string): void; } /** * Main Spreadsheet widget instance interface. * Provides methods for data manipulation, formatting, selection, and sheet management. * * @example * ```ts * const spreadsheet = new dhx.Spreadsheet("container", { * rowsCount: 50, * colsCount: 20, * multiSheets: true * }); * * spreadsheet.parse(data); * spreadsheet.setValue("A1", "Hello"); * spreadsheet.setStyle("B2", { "font-weight": "bold", background: "#eee" }); * ``` */ export interface ISpreadsheet { /** Cell selection and focus manager. */ selection: ISelection; /** Event system for subscribing to spreadsheet events. */ events: IEventSystem; /** Current widget configuration. */ config: ISpreadsheetConfig; /** Toolbar widget instance. */ toolbar: IToolbar; /** Sheet manager for adding, removing, and switching sheets. */ sheets: ISheetManager; /** Top-level menu widget instance. */ menu: Menu; /** Right-click context menu instance. */ contextMenu: ContextMenu; /** The DOM element the spreadsheet is mounted to. */ container: HTMLElement; /** XLSX/CSV export utility. */ export: Exporter; /** Keyboard shortcut manager. */ keyManager: IKeyManager; /** Display name of the currently active sheet. */ activeSheetName: string; /** * Adds a custom mathematical formula to the internal library. * @param name - The identifier of the formula. * @param handler - A callback function that processes the input arguments * (strings, numbers, booleans, or arrays of these) and returns a single value. */ addFormula: (name: string, handler: mathFunction) => void; /** * Returns the formula string for the specified cell(s). * @param cell - Cell reference or range (e.g. `"A1"`, `"A1:B2"`). * @returns Formula string for a single cell, or array of formulas for a range. */ getFormula: (cell: string) => string | string[]; /** * Returns the computed value of the specified cell(s). * @param cell - Cell reference or range. * @returns Value for a single cell, or array of values for a range. */ getValue: (cell: string) => cellValue | cellValue[]; /** * Sets the value of the specified cell(s). * @param cell - Cell reference or range. * @param value - Value to set. Use a string prefixed with `=` for formulas. */ setValue: (cell: string, value: cellValue | cellValue[]) => void; /** * Returns the style(s) applied to the specified cell(s). * @param cell - Cell reference or range. * @returns Style object for a single cell, or array of style objects for a range. */ getStyle: (cell: string) => IStylesList | IStylesList[]; /** * Applies style(s) to the specified cell(s). * @param cell - Cell reference or range. * @param styles - Style to apply — a class name string, array of class names, or inline style object(s). */ setStyle: (cell: string, styles: string | string[] | IStylesList | IStylesList[]) => void; /** * Returns the number format(s) applied to the specified cell(s). * @param cell - Cell reference or range. * @returns Format string for a single cell, or array of format strings for a range. */ getFormat: (cell: string) => string | string[]; /** * Sets the number format for the specified cell(s). * @param cell - Cell reference or range. * @param format - Format mask or alias (e.g. `"currency"`, `"#,##0.00"`). */ setFormat: (cell: string, format: string | string[]) => void; /** * Locks the specified cell(s), preventing editing. * @param cell - Cell reference or range. */ lock: (cell: string) => void; /** * Unlocks the specified cell(s), allowing editing. * @param cell - Cell reference or range. */ unlock: (cell: string) => void; /** * Checks whether the specified cell is locked. * @param cell - Cell reference. * @returns `true` if the cell is locked. */ isLocked: (cell: string) => boolean; /** * Deletes the column at the specified cell reference. * @param cell - Cell reference identifying the column (e.g. `"B1"`). */ deleteColumn: (cell: string) => void; /** * Deletes the row at the specified cell reference. * @param cell - Cell reference identifying the row (e.g. `"A3"`). */ deleteRow: (cell: string) => void; /** * Inserts a new column before the specified cell's column. * @param cell - Cell reference identifying the insertion point. */ addColumn: (cell: string) => void; /** * Inserts a new row before the specified cell's row. * @param cell - Cell reference identifying the insertion point. */ addRow: (cell: string) => void; /** * Loads spreadsheet data from a URL. * @param url - URL to load data from. * @param type - File format hint. Default: `"json"`. * @returns Promise that resolves when loading is complete. */ load: (url: string, type?: FileFormat) => Promise; /** * Parses and renders the given data object. * @param data - Data to parse (cell array, {@link IDataWithStyles}, or JSON). */ parse: (data: IDataWithStyles | ICellInfo[]) => void; /** * Serializes the current spreadsheet state. * @returns Cell array (single-sheet) or {@link IDataWithStyles} object (multi-sheet). */ serialize: () => ICellInfo[] | IDataWithStyles; /** * Iterates over each cell in the spreadsheet (or within a range), * invoking the callback with the cell reference and its value. * @param cb - Callback receiving `(cellName, cellValue)`. * @param range - Optional range to restrict iteration (e.g. `"A1:D10"`). */ eachCell: (cb: (cellName: string, cellValue: cellValue) => void, range?: string) => void; /** * Sets data validation (dropdown options) for the specified cell(s). * @param cell - Cell reference or range. * @param options - Dropdown option(s). */ setValidation: (cell: string, options: string | string[]) => void; /** * Sorts cells by the column at the given cell reference. * @param cell - Cell reference identifying the sort column. * @param dir - Sort direction: `1` = ascending, `-1` = descending. Default: `1`. */ sortCells: (cell: string, dir?: 1 | -1) => void; /** Undoes the last action. */ undo(): void; /** Redoes the last undone action. */ redo(): void; /** * Starts editing a cell. * @param cell - Cell reference to edit. Defaults to the currently focused cell. * @param initialValue - Initial value to place in the editor. */ startEdit(cell?: string, initialValue?: string): void; /** * Ends the current cell edit. * @param withoutSave - Pass `true` to discard changes. */ endEdit(withoutSave?: boolean): void; /** * Sets or clears a column filter. * @param cell - Cell reference identifying the filter range. Omit to clear all filters. * @param filter - Array of filter rules. Omit to clear the filter for the given cell. */ setFilter: (cell?: string, filter?: IFilterRules[]) => void; /** * Returns the filter configuration for the given sheet. * @param id - Sheet identifier. * @returns The active filter object. */ getFilter: (id: Id) => IFilter; /** * Searches for text across the spreadsheet. * @param text - Search query string. * @param openSearch - Whether to open the search UI. Default: `false`. * @param sheetId - Restrict search to a specific sheet. * @returns Array of matching cell references. */ search: (text: string, openSearch?: boolean, sheetId?: Id) => string[]; /** Hides the search bar UI. */ hideSearch: () => void; /** * Inserts a hyperlink into a cell. * @param cell - Cell reference. * @param link - Link configuration with `href` and optional `text`. */ insertLink: (cell: string, link: ILink) => void; /** * Auto-fits the column width to match the widest cell content. * @param cell - Cell reference identifying the column. */ fitColumn: (cell: string) => void; /** * Merges or unmerges cells in the given range. * @param cell - Cell range (e.g. `"A1:C3"`). * @param remove - Pass `true` to unmerge instead of merge. */ mergeCells: (cell: string, remove?: boolean) => void; /** * Freezes columns up to (and including) the specified cell's column. * @param cell - Cell reference identifying the freeze boundary. */ freezeCols: (cell?: string) => void; /** * Unfreezes frozen columns. * @param cell - Cell reference. If omitted, unfreezes all columns. */ unfreezeCols: (cell?: string) => void; /** * Freezes rows up to (and including) the specified cell's row. * @param cell - Cell reference identifying the freeze boundary. */ freezeRows: (cell?: string) => void; /** * Unfreezes frozen rows. * @param cell - Cell reference. If omitted, unfreezes all rows. */ unfreezeRows: (cell?: string) => void; /** * Hides the column(s) at the specified cell reference. * @param cell - Cell reference or range identifying the columns to hide. */ hideCols: (cell?: string) => void; /** * Shows previously hidden column(s). * @param cell - Cell reference or range identifying the columns to show. */ showCols: (cell?: string) => void; /** * Hides the row(s) at the specified cell reference. * @param cell - Cell reference or range identifying the rows to hide. */ hideRows: (cell?: string) => void; /** * Shows previously hidden row(s). * @param cell - Cell reference or range identifying the rows to show. */ showRows: (cell?: string) => void; /** * Returns the row and column letters for a cell range. * @param cell1 - Start cell reference. * @param cell2 - End cell reference. * @returns Object with `row` and `col` string identifiers. */ getCellIndex: (cell1: string, cell2: string) => ICell; /** Clears all data and resets the spreadsheet to its initial state. */ clear: () => void; /** Forces a full repaint of the grid. */ paint(): void; /** Destroys the widget instance and removes it from the DOM. */ destructor(): void; /** * Clears all content from a sheet. * @param id - Sheet identifier. Defaults to the active sheet. * @deprecated Use {@link ISheetManager.clear | spreadsheet.sheets.clear(id)} instead. */ clearSheet: (id?: string) => void; /** * Removes a sheet. * @param id - Sheet identifier. * @deprecated Use {@link ISheetManager.remove | spreadsheet.sheets.remove(id)} instead. */ removeSheet: (id: string) => void; /** * Adds a new sheet. * @param name - Sheet display name. * @returns The new sheet's identifier. * @deprecated Use {@link ISheetManager.add | spreadsheet.sheets.add(name)} instead. */ addSheet: (name?: string) => string; /** * Returns all sheet descriptors. * @returns Array of all sheets. * @deprecated Use {@link ISheetManager.getAll | spreadsheet.sheets.getAll()} instead. */ getSheets: () => ISheet[]; /** * Returns the active sheet descriptor. * @returns The active sheet. * @deprecated Use {@link ISheetManager.getActive | spreadsheet.sheets.getActive()} instead. */ getActiveSheet: () => ISheet; /** * Switches the active sheet. * @param id - Sheet identifier. * @deprecated Use {@link ISheetManager.setActive | spreadsheet.sheets.setActive(id)} instead. */ setActiveSheet: (id: Id) => void; } /** * Internal service events used for communication between Spreadsheet subsystems. * @internal */ export declare enum SpreadsheetServiceEvents { updateGridState = "updateGridState", updateGridSizes = "updateGridSizes", redraw = "redraw", recalculate = "recalculate", setGridWidgetFocus = "setGridWidgetFocus", applyFilter = "applyFilter", setSelectedCell = "setSelectedCell", removeSearchCell = "removeSearchCell", setSearchedArray = "setSearchedArray", setSearchedCell = "setSearchedCell", changeSheet = "changeSheet", callAction = "callAction", startEdit = "startEdit", fitColumn = "fitColumn", endEdit = "endEdit", resetFocus = "resetFocus", setCellMath = "setCellMath", editLineFocus = "editLineFocus", applyStyles = "applyStyles", composingEnd = "composingEnd" } /** * Public spreadsheet events. * * Subscribe via `spreadsheet.events.on(SpreadsheetEvents.eventName, handler)`. * * @example * ```ts * spreadsheet.events.on(SpreadsheetEvents.beforeAction, (action, config) => { * if (action === Actions.setCellValue) { * console.log("Cell value changing:", config.cell, config.val); * } * }); * ``` */ export declare enum SpreadsheetEvents { /** * Fires before any user action executes. * Return `false` to cancel the action. * * Callback: `(action: string, config: IExecuteConfig) => void | boolean` */ beforeAction = "beforeAction", /** * Fires after any user action completes successfully. * * Callback: `(action: string, config: IExecuteConfig) => void` */ afterAction = "afterAction", /** * Fires before a cell is added to the selection. * Return `false` to cancel. * * Callback: `(cell: string) => void | boolean` */ beforeSelectionSet = "beforeSelectionSet", /** * Fires after a cell is added to the selection. * * Callback: `(cell: string) => void` */ afterSelectionSet = "afterSelectionSet", /** * Fires before a cell is removed from the selection. * Return `false` to cancel. * * Callback: `(cell: string) => void | boolean` */ beforeSelectionRemove = "beforeSelectionRemove", /** * Fires after a cell is removed from the selection. * * Callback: `(cell: string) => void` */ afterSelectionRemove = "afterSelectionRemove", /** * Fires before the focused cell changes. * Return `false` to cancel. * * Callback: `(cell: string) => void | boolean` */ beforeFocusSet = "beforeFocusSet", /** * Fires after the focused cell changes. * * Callback: `(cell: string) => void` */ afterFocusSet = "afterFocusSet", /** * Fires before cell editing begins. * Return `false` to cancel. * * Callback: `(cell: string, value: string) => void | boolean` */ beforeEditStart = "beforeEditStart", /** * Fires after cell editing begins. * * Callback: `(cell: string, value: string) => void` */ afterEditStart = "afterEditStart", /** * Fires before cell editing ends. * Return `false` to cancel and keep the editor open. * * Callback: `(cell: string, value: string) => void | boolean` */ beforeEditEnd = "beforeEditEnd", /** * Fires after cell editing ends and the value is committed. * * Callback: `(cell: string, value: string) => void` */ afterEditEnd = "afterEditEnd", /** * Fires before the active sheet changes. * Return `false` to cancel. * * Callback: `(sheet: ISheet) => void | boolean` */ beforeSheetChange = "beforeSheetChange", /** * Fires after the active sheet changes. * * Callback: `(sheet: ISheet) => void` */ afterSheetChange = "afterSheetChange", /** * Fires during auto-fill (drag-fill) operations. * * Callback: `(focusedCell: string, selectedCell: string) => void` */ groupFill = "groupFill", /** * Fires after `parse()` or `load()` completes and data is rendered. * * Callback: `() => void` */ afterDataLoaded = "afterDataLoaded", /** * Fires before `clear()` resets the spreadsheet. * * Callback: `() => void` * @internal */ beforeClear = "beforeClear", /** * Fires after `clear()` completes. * * Callback: `() => void` * @internal */ afterClear = "afterClear", /** * Fires on input in the formula/edit line. * * Callback: `(value: string) => void` * @internal */ editLineInput = "editLineInput", /** * Fires when the formula/edit line receives focus. * * Callback: `(value: string, e: Event) => void` * @internal */ editLineFocus = "editLineFocus", /** * Fires when the formula/edit line loses focus. * * Callback: `(value: string, e: Event) => void` * @internal */ editLineBlur = "editLineBlur", /** * Fires on input within a cell during editing. * * Callback: `(cell: string, value: string) => void` * @internal */ cellInput = "cellInput", /** * Fires after the grid redraws. * * Callback: `() => void` * @internal */ gridRedraw = "gridRedraw", /** * Fires after a popup (dropdown, format picker, etc.) hides. * * Callback: `() => void` * @internal */ afterPopupHide = "afterPopupHide", /** * @deprecated Use `beforeAction` with action `"setCellValue"` instead. * * Callback: `(cell: string, value: string) => void | boolean` */ beforeValueChange = "beforeValueChange", /** * @deprecated Use `afterAction` with action `"setCellValue"` instead. * * Callback: `(cell: string, value: string) => void` */ afterValueChange = "afterValueChange", /** * @deprecated Use `beforeAction` with action `"setCellStyle"` instead. * * Callback: `(cell: string, style: string | string[] | IStylesList | IStylesList[]) => void | boolean` */ beforeStyleChange = "beforeStyleChange", /** * @deprecated Use `afterAction` with action `"setCellStyle"` instead. * * Callback: `(cell: string, style: string | string[] | IStylesList | IStylesList[]) => void` */ afterStyleChange = "afterStyleChange", /** * @deprecated Use `beforeAction` with action `"setCellFormat"` instead. * * Callback: `(cell: string, format: string) => void | boolean` */ beforeFormatChange = "beforeFormatChange", /** * @deprecated Use `afterAction` with action `"setCellFormat"` instead. * * Callback: `(cell: string, format: string) => void` */ afterFormatChange = "afterFormatChange", /** * @deprecated Use `beforeAction` with action `"addRow"` instead. * * Callback: `(cell: string) => void | boolean` */ beforeRowAdd = "beforeRowAdd", /** * @deprecated Use `afterAction` with action `"addRow"` instead. * * Callback: `(cell: string) => void` */ afterRowAdd = "afterRowAdd", /** * @deprecated Use `beforeAction` with action `"deleteRow"` instead. * * Callback: `(cell: string) => void | boolean` */ beforeRowDelete = "beforeRowDelete", /** * @deprecated Use `afterAction` with action `"deleteRow"` instead. * * Callback: `(cell: string) => void` */ afterRowDelete = "afterRowDelete", /** * @deprecated Use `beforeAction` with action `"addColumn"` instead. * * Callback: `(cell: string) => void | boolean` */ beforeColumnAdd = "beforeColumnAdd", /** * @deprecated Use `afterAction` with action `"addColumn"` instead. * * Callback: `(cell: string) => void` */ afterColumnAdd = "afterColumnAdd", /** * @deprecated Use `beforeAction` with action `"deleteColumn"` instead. * * Callback: `(cell: string) => void | boolean` */ beforeColumnDelete = "beforeColumnDelete", /** * @deprecated Use `afterAction` with action `"deleteColumn"` instead. * * Callback: `(cell: string) => void` */ afterColumnDelete = "afterColumnDelete", /** * @deprecated Use `beforeAction` with action `"addSheet"` instead. * * Callback: `(name: string) => void | boolean` */ beforeSheetAdd = "beforeSheetAdd", /** * @deprecated Use `afterAction` with action `"addSheet"` instead. * * Callback: `(sheet: ISheet) => void` */ afterSheetAdd = "afterSheetAdd", /** * @deprecated Use `beforeAction` with action `"deleteSheet"` instead. * * Callback: `(sheet: ISheet) => void | boolean` */ beforeSheetRemove = "beforeSheetRemove", /** * @deprecated Use `afterAction` with action `"deleteSheet"` instead. * * Callback: `(sheet: ISheet) => void` */ afterSheetRemove = "afterSheetRemove", /** * @deprecated Use `beforeAction` with action `"renameSheet"` instead. * * Callback: `(sheet: ISheet, value: string) => void | boolean` */ beforeSheetRename = "beforeSheetRename", /** * @deprecated Use `afterAction` with action `"renameSheet"` instead. * * Callback: `(sheet: ISheet) => void` */ afterSheetRename = "afterSheetRename", /** * @deprecated Use `beforeAction` with action `"clearSheet"` instead. * * Callback: `(sheet: ISheet) => void | boolean` */ beforeSheetClear = "beforeSheetClear", /** * @deprecated Use `afterAction` with action `"clearSheet"` instead. * * Callback: `() => void` */ afterSheetClear = "afterSheetClear" } /** * Type-safe event handler signatures for all spreadsheet events. * Used by the {@link IEventSystem} to enforce correct callback signatures. */ export interface IEventHandlersMap { [key: string]: (...args: any[]) => unknown; [SpreadsheetEvents.beforeAction]: (action: string, config: IExecuteConfig) => void | boolean; [SpreadsheetEvents.afterAction]: (action: string, config: IExecuteConfig) => void; [SpreadsheetEvents.beforeSelectionSet]: (cell: string) => void | boolean; [SpreadsheetEvents.afterSelectionSet]: (cell: string) => void; [SpreadsheetEvents.beforeSelectionRemove]: (cell: string) => void | boolean; [SpreadsheetEvents.afterSelectionRemove]: (cell: string) => void; [SpreadsheetEvents.beforeFocusSet]: (cell: string) => void | boolean; [SpreadsheetEvents.afterFocusSet]: (cell: string) => void; [SpreadsheetEvents.beforeEditStart]: (cell: string, value: string) => void | boolean; [SpreadsheetEvents.afterEditStart]: (cell: string, value: string) => void; [SpreadsheetEvents.beforeEditEnd]: (cell: string, value: string) => void | boolean; [SpreadsheetEvents.afterEditEnd]: (cell: string, value: string) => void; [SpreadsheetEvents.beforeSheetChange]: (sheet: ISheet) => void | boolean; [SpreadsheetEvents.afterSheetChange]: (sheet: ISheet) => void; [SpreadsheetEvents.groupFill]: (focusedCell: string, selectedCell: string) => void; [SpreadsheetEvents.editLineInput]: (value: string) => void; [SpreadsheetEvents.editLineFocus]: (value: string, e: FocusEvent) => void; [SpreadsheetEvents.editLineBlur]: (value: string, e: FocusEvent) => void; [SpreadsheetEvents.cellInput]: (cell: string, value: string) => void; [SpreadsheetEvents.gridRedraw]: () => void; [SpreadsheetEvents.afterPopupHide]: () => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeValueChange]: (cell: string, value: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterValueChange]: (cell: string, value: string) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeStyleChange]: (cell: string, style: string | string[] | IStylesList | IStylesList[]) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterStyleChange]: (cell: string, style: string | string[] | IStylesList | IStylesList[]) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeFormatChange]: (cell: string, format: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterFormatChange]: (cell: string, format: string) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeRowAdd]: (cell: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterRowAdd]: (cell: string) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeRowDelete]: (cell: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterRowDelete]: (cell: string) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeColumnAdd]: (cell: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterColumnAdd]: (cell: string) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeColumnDelete]: (cell: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterColumnDelete]: (cell: string) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeSheetAdd]: (name: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterSheetAdd]: (sheet: ISheet) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeSheetRemove]: (sheet: ISheet) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterSheetRemove]: (sheet: ISheet) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeSheetRename]: (sheet: ISheet, value: string) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterSheetRename]: (sheet: ISheet) => void; /** @deprecated Use `beforeAction` handler instead. */ [SpreadsheetEvents.beforeSheetClear]: (sheet: ISheet) => void | boolean; /** @deprecated Use `afterAction` handler instead. */ [SpreadsheetEvents.afterSheetClear]: () => void; } export {};