@dhtmlx/grid 9.3.10 → 9.3.12

package/codebase/types/ts-combobox/sources/types.d.ts

@@ -29,6 +29,7 @@ export interface IComboboxConfig {
             [className: string]: (event: Event, id: Id) => void | boolean;
         };
     };
+    ariaLabel?: string;
     /** @deprecated See a documentation: https://docs.dhtmlx.com/ */
     cellHeight?: number;
     /** @deprecated See a documentation: https://docs.dhtmlx.com/ */

package/codebase/types/ts-grid/sources/Grid.d.ts

@@ -8,6 +8,7 @@ import { PrefixSums } from "./helpers/PrefixSums";
 import { ISelection } from "./modules/Selection";
 import { EditorType, GridEvents, IAdjustBy, ICellRect, ICol, ICoords, IEventHandlersMap, IGrid, IGridConfig, IRow, IScrollState, ISpan, GridSystemEvents, ISystemEventHandlersMap, IColumnsWidth, SortFunction, IAdjustColumns, IDirection, IFooter, IHeader, INormalizeColumnsParams, ISummaryList, ISortingStates } from "./types";
 import { IContentList, IHeaderFilter } from "./ui/content";
+import { IActiveCell } from "./modules/ActiveCell";
 import { IProContentList } from "./ui/proContent";
 export declare class Grid extends View implements IGrid {
     version: string;
@@ -19,11 +20,13 @@ export declare class Grid extends View implements IGrid {
     content: IContentList | IProContentList;
     selection: ISelection;
     keyManager: IKeyManager;
+    $activeCell: IActiveCell;
     protected _touch: ITouchParam;
     protected _destructed: boolean;
     protected _scroll: IScrollState;
     protected _events: IEventSystem<GridSystemEvents, ISystemEventHandlersMap>;
     protected _htmlEvents: any;
+    protected _tooltipFocusHandler: (e: Event) => void;
     protected _sortingStates: ISortingStates;
     protected _activeFilters: object;
     protected _dropManager: any;
@@ -36,6 +39,7 @@ export declare class Grid extends View implements IGrid {
     protected _colWidths: PrefixSums;
     protected _rowHeightsRebuild: boolean;
     private _observedEl;
+    private _liveRegion;
     private _filterData;
     private _hiddenFilters;
     private _commonSummary;
@@ -68,6 +72,17 @@ export declare class Grid extends View implements IGrid {
     editEnd(withoutSave?: boolean): void;
     getHeaderFilter(colId: Id): IHeaderFilter;
     getSummary(colId?: Id): ISummaryList;
+    /**
+     * Sends a message to the grid's polite live region, so a screen reader
+     * announces a status change that happened without moving focus.
+     */
+    announce(message: string): void;
+    /**
+     * The live region is kept as a sibling of the widget root, outside the
+     * `role="grid"` element: a `role="status"` node is not an allowed child of
+     * a grid, and the node must survive redraws, so it is not part of the vdom.
+     */
+    protected _getLiveRegion(): HTMLElement | null;
     /** @deprecated See a documentation: https://docs.dhtmlx.com/suite/migration/ */
     getSortingState(): {
         dir?: TSortDir;

package/codebase/types/ts-grid/sources/ProGrid.d.ts

@@ -27,6 +27,7 @@ export declare class ProGrid implements IProGrid {
     history: IHistory;
     constructor(container: HTMLElement | string | null, config?: IProGridConfig);
     paint(): void;
+    announce(message: string): void;
     destructor(): void;
     expand(rowId: Id): void;
     collapse(rowId: Id): void;

package/codebase/types/ts-grid/sources/helpers/cells.d.ts

@@ -1,9 +1,16 @@
-import { ICell, ICol, IGrid, IRow, ISpan } from "./../types";
+import { ICell, ICellSource, ICellSourceHolder, ICol, IGrid, IRow, ISpan } from "./../types";
 import { Id } from "../../../ts-common/types";
 export declare function getWidth(columns: ICol[], colspan: number, index: number): number;
+export declare function getSourceCellIndex(currentIdx: number, minIdx: number, count: number): number;
 export declare function getSpanHeight(rows: IRow[], span: ISpan): number;
 export declare function getReducedColspan(columns: ICol[], colId: Id, colspan: number): number;
 export declare function getReducedRowspan(initialRows: IRow[], currRows: IRow[], rowIndex: number, span: ISpan): number;
+/**
+ * Returns the module that owns the active cell position.
+ * @param holder - the grid, or the renderer config built from it
+ * @returns the module answering `getCell`, `setCell` and `restoreFocus`
+ */
+export declare function getCellSource(holder: ICellSourceHolder): ICellSource;
 export declare function normalizeCell(cell: ICell, grid: IGrid): ICell;
 export declare function clearCells(grid: any, cells: ICell[]): void;
 export declare function formatValue(value: string, cell: ICell): any;

package/codebase/types/ts-grid/sources/helpers/locale.d.ts

@@ -0,0 +1,10 @@
+export interface ILocaleParams {
+    [key: string]: string | number;
+}
+/**
+ * Returns a localized string by its key, substituting `{name}` placeholders.
+ *
+ * The locale object is read on every call, so `dhx.i18n.setLocale("grid", ...)`
+ * is picked up without rebuilding anything.
+ */
+export declare function getLocaleString(key: string, params?: ILocaleParams): string;

package/codebase/types/ts-grid/sources/helpers/zoneFocus.d.ts

@@ -219,6 +219,16 @@ export declare function getColIdFromTarget(target: HTMLElement): string | null;
  * @param zone - the zone whose cells should be reset
  */
 export declare function restoreZoneTabindex(grid: any, zone: FocusZone): void;
+/**
+ * Hands focus to the sentinel on one side of the widget so that the browser's own Tab handling
+ * continues from the edge of the widget instead of from the boundary cell.
+ * The sentinels are the first and the last child of the widget root and are already the widget's
+ * entry points, so their own focus listeners are suppressed for this one focus.
+ * @param grid - the grid instance
+ * @param direction - "forward" for Tab, "backward" for Shift+Tab
+ * @returns true if the sentinel was found and focused
+ */
+export declare function exitThroughSentinel(grid: any, direction: "forward" | "backward"): boolean;
 /**
  * Initializes the start focus sentinel for the grid.
  * Attaches a focus listener on the .dhx_grid-focus-sentinel element that redirects

package/codebase/types/ts-grid/sources/locales/en.d.ts

@@ -3,5 +3,31 @@ declare const locale: {
     groupText: string;
     dropAreaTitle: string;
     dropAreaPlaceholder: string;
+    aria_sortedAscending: string;
+    aria_sortedDescending: string;
+    aria_filterApplied: string;
+    aria_filterCleared: string;
+    aria_rowsLoaded: string;
+    aria_valueOutOfRange: string;
+    aria_valueBelowMin: string;
+    aria_valueAboveMax: string;
+    aria_valueClamped: string;
+    aria_filter: string;
+    aria_filterByDate: string;
+    aria_sortBy: string;
+    aria_expandGroup: string;
+    aria_collapseGroup: string;
+    aria_expandRow: string;
+    aria_collapseRow: string;
+    aria_editContent: string;
+    aria_subRow: string;
+    aria_enterGrid: string;
+    aria_exitGrid: string;
+    aria_dragPanel: string;
+    aria_panelHeader: string;
+    aria_panelFooter: string;
+    aria_panelContent: string;
+    aria_draggableRows: string;
+    aria_rowId: string;
 };
 export default locale;

package/codebase/types/ts-grid/sources/modules/ActiveCell.d.ts

@@ -0,0 +1,26 @@
+import { Id } from "../../../ts-common/types";
+import { ICell, ICellSource, ICol, IGrid, IProGrid, IRow } from "../types";
+export interface IActiveCell extends ICellSource {
+    destructor(): void;
+}
+/**
+ * Keeps the position the keyboard moves over the data when no selection module is initialized.
+ */
+export declare class ActiveCell implements IActiveCell {
+    private _grid;
+    private _gridId;
+    private _cell;
+    constructor(grid: IGrid | IProGrid, gridId?: Id);
+    /**
+     * Moves the active cell. The `ctrlUp` and `shiftUp` modifiers of the selection module are
+     * accepted by the shared signature and ignored here: there is no selection to extend.
+     * @param row - the row, or the row id, to move to
+     * @param col - the column, or the column id, to move to; the first visible column by default
+     */
+    setCell(row?: IRow | Id, col?: ICol | Id): void;
+    getCell(): ICell | void;
+    restoreFocus(): void;
+    destructor(): void;
+    private _init;
+    private _setBrowserFocus;
+}

package/codebase/types/ts-grid/sources/modules/BlockSelection.d.ts

@@ -119,6 +119,5 @@ export declare class BlockSelection implements IBlockSelection {
     private _removeHandlers;
     private _getPageCoords;
     private _cellHandler;
-    private _getSourceCellIndex;
     private _paint;
 }

package/codebase/types/ts-grid/sources/modules/Selection.d.ts

@@ -1,24 +1,20 @@
 import { VNode } from "../../../ts-common/dom";
 import { IEventSystem } from "../../../ts-common/events";
-import { ICell, IGrid, IRow, ICol, ISelectionType, IProGrid } from "../types";
+import { ICell, IGrid, IRow, ICol, ISelectionType, IProGrid, ICellSource } from "../types";
 import { Id } from "../../../ts-common/types";
 export interface ISelectionConfig {
     disabled?: boolean;
     type?: ISelectionType;
     multiSelection?: boolean;
 }
-export interface ISelection {
+export interface ISelection extends ICellSource {
     config?: ISelectionConfig;
-    setCell(rowId?: IRow | Id, colId?: ICol | Id, ctrlUp?: boolean, shiftUp?: boolean): void;
-    getCell(): ICell | void;
     getCells(): ICell[];
     removeCell(rowId?: Id, colId?: Id): void;
     disable(): void;
     enable(): void;
     isSelectedCell(row: IRow | Id, column?: ICol | Id): boolean;
     toHTML(): VNode | VNode[];
-    /** @internal Restore browser focus */
-    restoreFocus(): void;
 }
 export declare enum GridSelectionEvents {
     beforeUnSelect = "beforeUnSelect",

package/codebase/types/ts-grid/sources/types.d.ts

@@ -11,6 +11,7 @@ import { IGroupOrder, TDisplayMode } from "../../ts-data/sources/datacollection/
 import { IGroupItem } from "./ui/components/groupPanel";
 import { ITreeGrid, ITreeGridConfig } from "../../ts-treegrid";
 import { ISelection } from "./modules/Selection";
+import { IActiveCell } from "./modules/ActiveCell";
 import { IProCell, IViewConstructor } from "../../ts-layout";
 import { IRange, IRangeConfig } from "./modules/Range";
 import { PrefixSums } from "./helpers/PrefixSums";
@@ -20,6 +21,22 @@ import { IHistory, IHistoryConfig } from "./modules/History";
 import { IComboFilterConfig, IContentList, IHeaderFilter, IInputFilterConfig } from "./ui/content";
 import { ExportType, ICsvExportConfig, IXlsxExportConfig } from "./modules/Exporter";
 import { IDateFilterConfig, IProContentList, IProHeaderFilter } from "./ui/proContent";
+/**
+ * @internal The active-cell contract shared by the selection module and the service active-cell
+ * module, so that the key handlers read one position whichever module owns it.
+ */
+export interface ICellSource {
+    getCell(): ICell | void;
+    setCell(row?: IRow | Id, col?: ICol | Id, ctrlUp?: boolean, shiftUp?: boolean): void;
+    restoreFocus(): void;
+}
+/**
+ * @internal Anything that holds the active cell: the grid itself, or a renderer config.
+ */
+export interface ICellSourceHolder {
+    selection: ICellSource;
+    $activeCell?: IActiveCell;
+}
 export interface IGrid {
     data: IDataCollection;
     name: "grid" | string;
@@ -29,7 +46,10 @@ export interface IGrid {
     content: IContentList | IProContentList;
     keyManager: IKeyManager;
     export: any;
+    /** @internal Service module: present only when no selection module is initialized. */
+    $activeCell?: IActiveCell;
     paint(): void;
+    announce(message: string): void;
     destructor(): void;
     setColumns(col: ICol[]): void;
     addRowCss(rowId: Id, css: string): void;
@@ -167,6 +187,7 @@ export interface IGridConfig extends IDragConfig {
     $data?: any[];
     $grouped?: IGroupItem[];
     $subRowCells?: Map<Id, ISubRowCell>;
+    $cellState?: ICellState;
 }
 export type IProGridConfig = IExtendedGridConfig & ITreeGridConfig;
 export interface IExtendedGridConfig extends IGridConfig {
@@ -207,8 +228,10 @@ export interface IRendererConfig extends Required<IProGridConfig> {
     footerHeight?: number;
     events?: IEventSystem<GridEvents, IEventHandlersMap>;
     selection: any;
+    $activeCell?: IActiveCell;
     dropManager: any;
     blockSelection: any;
+    range?: IRange;
     sort: ISortingStates;
     filterLocation?: string;
     content?: IContentList;
@@ -219,6 +242,7 @@ export interface IRendererConfig extends Required<IProGridConfig> {
     };
     $renderFrom?: RenderFrom;
     $isDragging?: boolean;
+    $rowIndexShift?: number;
     _events?: IEventSystem<GridSystemEvents>;
 }
 export declare enum GridEvents {
@@ -364,7 +388,8 @@ export declare enum GridSystemEvents {
     headerCellTouchMove = "headerCellTouchMove",
     headerCellTouchEnd = "headerCellTouchEnd",
     groupPanelItemTouchMove = "groupPanelItemTouchMove",
-    groupPanelItemItemTouchEnd = "groupPanelItemItemTouchEnd"
+    groupPanelItemItemTouchEnd = "groupPanelItemItemTouchEnd",
+    announce = "announce"
 }
 export interface ISystemEventHandlersMap {
     [key: string]: (...args: any[]) => any;
@@ -374,6 +399,7 @@ export interface ISystemEventHandlersMap {
     [GridSystemEvents.headerCellTouchEnd]: (cell: IHeader, col: ICol, event: TouchEvent) => void;
     [GridSystemEvents.groupPanelItemTouchMove]: (id: string, event: TouchEvent) => void;
     [GridSystemEvents.groupPanelItemItemTouchEnd]: (id: string, event: TouchEvent) => void;
+    [GridSystemEvents.announce]: (message: string) => void;
 }
 export interface ICol {
     id: Id;
@@ -425,6 +451,7 @@ export interface ICol {
     $width?: number;
     $fixedWidth?: boolean;
     $customOptions?: any;
+    $rowHeader?: boolean;
 }
 export interface IRow {
     id?: Id;
@@ -671,4 +698,28 @@ export interface IExportGridCell {
     v: string | number;
     s: number;
 }
+/**
+ * @internal
+ * Cell state supplied by a host product that manages selection and editing itself.
+ * When it is set, it is the source of truth for the roving tabindex, `aria-selected`,
+ * `aria-readonly` and `aria-multiselectable`, and the grid's own selection module is not
+ * consulted. When it is not set, the grid behaves exactly as before.
+ *
+ * A range is a set of row ids by a set of column ids, so that a cell can be tested with two
+ * hash lookups: `getCells` runs per visible cell and again per frozen zone, and the column
+ * index of a cell is not recoverable there because the fixed-column zones replace
+ * `filteredColumns` and reset `$positions.xStart`.
+ */
+export interface ICellState {
+    active?: {
+        row: Id;
+        col: Id;
+    };
+    ranges?: Array<{
+        rows: Set<Id>;
+        cols: Set<Id>;
+    }>;
+    editable?: boolean;
+    multiselectable?: boolean;
+}
 export {};

package/codebase/types/ts-grid/sources/ui/cells.d.ts

@@ -1,5 +1,6 @@
 import { GridEvents, GridSystemEvents, ICoords, IGridConfig, IRendererConfig, ISpan, Split } from "../types";
 import { IDataCollection } from "../../../ts-data";
+import { Id } from "../../../ts-common/types";
 type mouseEvents = GridEvents.cellClick | GridEvents.cellMouseOver | GridEvents.cellMouseDown | GridEvents.cellDblClick | GridEvents.cellRightClick;
 type touchEvents = GridSystemEvents.cellTouchEnd | GridSystemEvents.cellTouchMove;
 declare function handleMouse(rowStart: number, colStart: number, conf: IRendererConfig, type: mouseEvents & touchEvents, e: any): void;
@@ -13,6 +14,31 @@ export declare function getHandlers(row: number, column: number, conf: IRenderer
     ontouchmove: (number | GridSystemEvents | IRendererConfig | typeof handleMouse)[];
     ontouchend: (number | GridSystemEvents | IRendererConfig | typeof handleMouse)[];
 };
+export interface ISpanExtent {
+    column: Id;
+    colspan: number;
+    rowspan: number;
+}
+/** @internal the per-render-pass answer of {@link resolveCellState} */
+export interface IResolvedCellState {
+    /** the row and the column of the only cell that carries `tabindex="0"` */
+    tabRow: Id;
+    tabCol: Id;
+    readonly: "true" | "false";
+    /** whether `aria-selected` belongs on a cell at all — it does not in row selection mode */
+    exposeSelected: boolean;
+    isSelected: (rowId: Id, colId: Id) => boolean;
+}
+/**
+ * Resolves everything the cell renderers need to know about selection, focus and editability,
+ * once per render pass. This is the hottest path in the product — `getCells` runs per visible
+ * cell and again for every frozen zone — so the per-cell work left afterwards is two identity
+ * comparisons for the tabindex and one call for `aria-selected`.
+ *
+ * The state comes from `$cellState` when a host product supplies it, and from the grid's own
+ * selection module otherwise.
+ */
+export declare function resolveCellState(conf: IRendererConfig): IResolvedCellState;
 export declare function getCells(conf: IRendererConfig): any[];
 export declare function getSpans(config: IRendererConfig, mode?: Split): any[];
 export declare function getShifts(conf: IRendererConfig): ICoords;
@@ -20,8 +46,8 @@ export declare function normalizeSpan(span: ISpan, config: IGridConfig, data: ID
     $renderFrom: any[];
     $rowsVisibility: number[];
     $colsVisibility: number[];
-    row: import("../../../ts-common/types").Id;
-    column: import("../../../ts-common/types").Id;
+    row: Id;
+    column: Id;
     rowspan?: number;
     colspan?: number;
     text?: string | ((args: import("../types").ISummaryList) => string);

package/codebase/types/ts-grid/sources/ui/common.d.ts

@@ -5,4 +5,11 @@ export declare function calcScrollBarWidth(config: IGridConfig | IRendererConfig
     height: number;
 }): IScrollBarWidth;
 export declare function getCurrFixedCols(config: IGridConfig, split: Split.left | Split.right): import("../types").ICol[];
+/**
+ * Number of header rows. `aria-rowindex` is a position within the whole grid,
+ * so header rows occupy the first indices and body rows are offset by this.
+ */
+export declare function getHeaderRowCount(config: IGridConfig | IRendererConfig): number;
+/** Number of footer rows; they are the last rows of the grid for `aria-rowcount`. */
+export declare function getFooterRowCount(config: IGridConfig | IRendererConfig): number;
 export declare function getNormalizeDateObject(item: string | Date, dateFormat: string): Date | null;

package/codebase/types/ts-grid/sources/ui/editors/InputEditor.d.ts

@@ -15,6 +15,9 @@ export declare class InputEditor implements IEditor {
     endEdit(withoutSave?: boolean): void;
     toHTML(value?: string | number): any;
     protected _initHandlers(): void;
+    private _setValidity;
+    private _isValueInvalid;
+    private _getRangeMessage;
     private _isValidWord;
     private _isCorrectRange;
     private _applyValuePattern;

package/codebase/types/ts-message/sources/locales/en.d.ts

@@ -1,5 +1,8 @@
 declare const locale: {
     apply: string;
     reject: string;
+    aria_confirm: string;
+    aria_reject: string;
+    aria_apply: string;
 };
 export default locale;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dhtmlx/grid",
-  "version": "9.3.10",
+  "version": "9.3.12",
   "description": "DHTMLX Grid - JavaScript data grid library. GPL v2 edition for GPL-compatible open-source projects; commercial licenses are available for proprietary and production use.",
   "keywords": ["dhtmlx","grid","datagrid","table","treegrid","data-table","javascript","typescript"],
   "homepage":"https://docs.dhtmlx.com/suite/grid/",

package/whatsnew.txt

@@ -1,3 +1,53 @@
+# Version 9.3.12 (September 23, 2026)
+
+### Updates
+
+- Keyboard access to the cell surface:
+    - The grid is entered with a single <kbd>Tab</kbd> press, the arrow keys move between cells, and <kbd>Tab</kbd> leaves the grid, as the WAI-ARIA Grid pattern specifies (**WCAG 2.1.1**, **WCAG 2.4.3**).
+    - Cells can now be reached with the keyboard in a grid configured without a selection module.
+
+- Structure reported to assistive technology:
+    - The row number column is announced as a row header, and the sort state is reported only for columns that can be sorted (**WCAG 1.3.1**, **WCAG 4.1.2**).
+    - A merged cell reports how many rows and columns it spans.
+
+### Fixes
+
+- Fixed <kbd>Tab</kbd> not leaving a grid that has frozen (`leftSplit` / `rightSplit`) columns
+- Fixed the focused cell being scrolled one column short of the viewport edge during horizontal keyboard navigation
+- Fixed the focused cell being scrolled behind the footer instead of above it
+- Fixed the doubled focus indicator on a cell that is both focused and selected
+- Fixed cells rendered with `htmlEnable` being announced as buttons in columns without interactive content
+- Corrected the ARIA structure of the grid so that rows and columns are reported reliably, and the focus helpers are no longer exposed as controls
+- Fixed a script error that occurred after closing an inline editor in a grid with column summaries
+
+# Version 9.3.11 (September 14, 2026)
+
+### Updates
+
+- Modal focus trapping and management:
+    - Implemented focus trapping for all modal windows, message dialogs, and popups compliant with **WCAG 2.4.3**.
+    - Opening a modal dialog moves keyboard focus to the first actionable element and keeps it within the dialog boundaries until the dialog closes.
+    - Closing a dialog restores focus to the previously active cell or trigger element.
+
+- Assistive technology support for block selection:
+    - The Grid exposes the block selection state to screen readers (**WCAG 1.3.1**, **WCAG 4.1.2**).
+    - Selected cell boundaries and multi-cell ranges reflect their `aria-selected` status in the accessibility tree, providing real-time feedback during keyboard and pointer selection.
+
+- Localization for ARIA labels:
+    - Moved all hardcoded English accessible names and labels into the locale system.
+    - Screen reader announcements, button descriptions, and status labels that developers can translate via the standard localization configuration.
+
+- Target size improvements for interactive controls:
+    - Enlarged hit areas for small interactive elements, including column resize handles and removal/action icons.
+    - Reduced accidental or missed clicks on touch-screen devices, accommodating users with motor precision needs.
+
+### Fixes
+
+- Fixed a console error that occurred when starting block selection in numeric columns or number-formatted cell ranges
+- Fixed broken `aria-labelledby` relationships in sub-rows, eliminating orphaned ID references
+- Corrected invalid ARIA attributes and roles, and fixed the `aria-rowindex` and `aria-rowcount` calculations so that they reflect the overall grid structure, including header rows
+- Fixed an issue where inline cell editors lost or failed to expose their accessible names on the first paint and on subsequent data updates
+
 # Version 9.3.10 (August 19, 2026)
 
 ### Fixes