devextreme
Version:
HTML5 JavaScript Component Suite for Responsive Web Development
1,379 lines (1,315 loc) • 123 kB
TypeScript
/**
* DevExtreme (ui/data_grid.d.ts)
* Version: 21.2.4
* Build date: Mon Dec 06 2021
*
* Copyright (c) 2012 - 2021 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
import DataSource, { DataSourceLike, Options as DataSourceOptions } from '../data/data_source';
import {
UserDefinedElement,
DxElement,
UserDefinedElementsArray,
} from '../core/element';
import {
DxPromise,
} from '../core/utils/deferred';
import {
template,
} from '../core/templates/template';
import {
DeepPartial,
Skip,
} from '../core/index';
import {
DxEvent,
Cancelable,
EventInfo,
NativeEventInfo,
InitializedEventInfo,
ChangedOptionInfo,
} from '../events/index';
import {
DataGridCell as ExcelCell,
} from '../excel_exporter';
import {
ExcelFont,
} from '../exporter/excel/excel.doc_comments';
import dxDraggable from './draggable';
import {
dxFilterBuilderOptions,
FilterLookupDataSource,
} from './filter_builder';
import {
dxFormOptions,
dxFormSimpleItem,
} from './form';
import {
Properties as PopupProperties,
} from './popup';
import dxScrollable from './scroll_view/ui.scrollable';
import dxSortable from './sortable';
import {
dxToolbarOptions, dxToolbarItem,
} from './toolbar';
import {
AsyncRule,
CompareRule,
CustomRule,
EmailRule,
NumericRule,
PatternRule,
RangeRule,
RequiredRule,
StringLengthRule,
} from './validation_rules';
import Widget, {
WidgetOptions,
} from './widget/ui.widget';
import {
Format,
} from '../localization';
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface AdaptiveDetailRowPreparingInfo {
readonly formOptions: any;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface DataErrorOccurredInfo {
readonly error?: Error;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface DataChangeInfo<TRowData = any, TKey = any> {
readonly changes: Array<DataChange<TRowData, TKey>>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface NewRowInfo<TRowData = any> {
data: TRowData;
promise?: PromiseLike<void>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface KeyDownInfo {
handled: boolean;
}
type GroupKey = any[];
export type GroupData<TRowData> = {
key: any;
items: Array<TRowData> | Array<GroupData<TRowData>> | null;
/**
* @deprecated Attention! This property is for internal purposes only.
*/
collapsedItems?: Array<TRowData> | Array<GroupData<TRowData>>;
/**
* @deprecated Attention! This property is for internal purposes only.
*/
aggregates?: Array<any>;
/**
* @deprecated Attention! This property is for internal purposes only.
*/
summary?: Array<any>;
/**
* @deprecated Attention! This property is for internal purposes only.
*/
isContinuation?: boolean;
/**
* @deprecated Attention! This property is for internal purposes only.
*/
isContinuationOnNextPage?: boolean;
};
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowKeyInfo<TKey = any> {
readonly key: TKey;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowInsertedInfo<TRowData = any, TKey = any> {
readonly data: TRowData;
readonly key: TKey;
readonly error: Error;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowInsertingInfo<TRowData = any> {
data: TRowData;
cancel: boolean | PromiseLike<void>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowRemovedInfo<TRowData = any, TKey = any> {
readonly data: TRowData;
readonly key: TKey;
readonly error: Error;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowRemovingInfo<TRowData = any, TKey = any> {
readonly data: TRowData;
readonly key: TKey;
cancel: boolean | PromiseLike<void>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowUpdatedInfo<TRowData = any, TKey = any> {
readonly data: TRowData;
readonly key: TKey;
readonly error: Error;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowUpdatingInfo<TRowData = any, TKey = any> {
readonly oldData: TRowData;
newData: DeepPartial<TRowData>;
readonly key: TKey;
cancel: boolean | PromiseLike<void>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowValidatingInfo<TRowData = any, TKey = any> {
readonly brokenRules: Array<RequiredRule | NumericRule | RangeRule | StringLengthRule | CustomRule | CompareRule | PatternRule | EmailRule | AsyncRule>;
isValid: boolean;
readonly key: TKey;
readonly newData: DeepPartial<TRowData>;
readonly oldData: TRowData;
errorText: string;
promise?: PromiseLike<void>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface SavingInfo<TRowData = any, TKey = any> {
changes: Array<DataChange<TRowData, TKey>>;
promise?: PromiseLike<void>;
cancel: boolean;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface SelectionChangedInfo<TRowData = any, TKey = any> {
readonly currentSelectedRowKeys: Array<TKey>;
readonly currentDeselectedRowKeys: Array<TKey>;
readonly selectedRowKeys: Array<TKey>;
readonly selectedRowsData: Array<TRowData>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface ToolbarPreparingInfo {
toolbarOptions: dxToolbarOptions;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowDraggingEventInfo<T extends GridBase<TRowData, TKey>, TRowData = any, TKey = any> {
readonly component: T;
readonly event: DxEvent<PointerEvent | MouseEvent | TouchEvent>;
readonly itemData?: TRowData;
readonly itemElement: DxElement;
readonly fromIndex: number;
readonly toIndex: number;
readonly fromComponent: dxSortable | dxDraggable;
readonly toComponent: dxSortable | dxDraggable;
readonly fromData?: any;
readonly toData?: any;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface DragStartEventInfo<T extends GridBase<TRowData, TKey>, TRowData = any, TKey = any> {
readonly component: T;
readonly event: DxEvent<PointerEvent | MouseEvent | TouchEvent>;
itemData?: TRowData;
readonly itemElement: DxElement;
readonly fromIndex: number;
readonly fromData?: any;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface DragDropInfo {
readonly dropInsideItem: boolean;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface DragReorderInfo {
readonly dropInsideItem: boolean;
promise?: PromiseLike<void>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowDraggingTemplateDataModel<TRowData = any> {
readonly itemData: TRowData;
readonly itemElement: DxElement;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface FilterPanelCustomizeTextArg<T> {
readonly component: T;
readonly filterValue: any;
readonly text: string;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface FilterPanel<T extends GridBase<TRowData, TKey>, TRowData = any, TKey = any> {
/**
* Customizes the filter expression's text representation.
*/
customizeText?: ((e: FilterPanelCustomizeTextArg<T>) => string);
/**
* Specifies whether the filter expression is applied.
*/
filterEnabled?: boolean;
/**
* Specifies texts for the filter panel's elements.
*/
texts?: FilterPanelTexts;
/**
* Specifies whether the filter panel is visible.
*/
visible?: boolean;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface RowDragging<T extends GridBase<TRowData, TKey>, TRowData = any, TKey = any> {
/**
* Allows users to drop a row inside another row.
*/
allowDropInsideItem?: boolean;
/**
* Allows row reordering using drag and drop gestures.
*/
allowReordering?: boolean;
/**
* Enables automatic scrolling while dragging a row beyond the viewport.
*/
autoScroll?: boolean;
/**
* Specifies a DOM element that limits the dragging area.
*/
boundary?: string | UserDefinedElement;
/**
* Specifies a custom container in which the draggable row should be rendered.
*/
container?: string | UserDefinedElement;
/**
* Specifies the cursor offset from the dragged row.
*/
cursorOffset?: string | {
/**
* Specifies the horizontal cursor offset from the dragged row in pixels.
*/
x?: number;
/**
* Specifies the vertical cursor offset from the dragged row in pixels.
*/
y?: number;
};
/**
* A container for custom data.
*/
data?: any;
/**
* Specifies the directions in which a row can be dragged.
*/
dragDirection?: 'both' | 'horizontal' | 'vertical';
/**
* Specifies custom markup to be shown instead of the item being dragged.
*/
dragTemplate?: template | ((dragInfo: RowDraggingTemplateData<TRowData>, containerElement: DxElement) => string | UserDefinedElement);
/**
* Specifies how to highlight the row's drop position.
*/
dropFeedbackMode?: 'push' | 'indicate';
/**
* Specifies a CSS selector for draggable rows.
*/
filter?: string;
/**
* Allows you to group several UI components so that users can drag and drop rows between them.
*/
group?: string;
/**
* Specifies a CSS selector (ID or class) for the element(s) that should act as the drag handle(s).
*/
handle?: string;
/**
* A function that is called when a new row is added.
*/
onAdd?: ((e: RowDraggingEventInfo<T, TRowData, TKey> & DragDropInfo) => void);
/**
* A function that is called when the dragged row's position is changed.
*/
onDragChange?: ((e: Cancelable & RowDraggingEventInfo<T, TRowData, TKey> & DragDropInfo) => void);
/**
* A function that is called when the drag gesture is finished.
*/
onDragEnd?: ((e: Cancelable & RowDraggingEventInfo<T, TRowData, TKey> & DragDropInfo) => void);
/**
* A function that is called every time a draggable row is moved.
*/
onDragMove?: ((e: Cancelable & RowDraggingEventInfo<T, TRowData, TKey> & DragDropInfo) => void);
/**
* A function that is called when the drag gesture is initialized.
*/
onDragStart?: ((e: Cancelable & DragStartEventInfo<T, TRowData, TKey>) => void);
/**
* A function that is called when a draggable row is removed.
*/
onRemove?: ((e: RowDraggingEventInfo<T, TRowData, TKey>) => void);
/**
* A function that is called when the draggable rows are reordered.
*/
onReorder?: ((e: RowDraggingEventInfo<dxDataGrid<TRowData, TKey>, TRowData, TKey> & DragReorderInfo) => void);
/**
* Specifies the distance in pixels from the edge of viewport at which scrolling should start. Applies only if autoScroll is true.
*/
scrollSensitivity?: number;
/**
* Specifies the scrolling speed when dragging a row beyond the viewport. Applies only if autoScroll is true.
*/
scrollSpeed?: number;
/**
* Shows or hides row dragging icons.
*/
showDragIcons?: boolean;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface GridBaseOptions<TComponent extends GridBase<TRowData, TKey>, TRowData = any, TKey = any> extends WidgetOptions<TComponent> {
/**
* Specifies whether a user can reorder columns.
*/
allowColumnReordering?: boolean;
/**
* Specifies whether a user can resize columns.
*/
allowColumnResizing?: boolean;
/**
* Automatically scrolls to the focused row when the focusedRowKey is changed.
*/
autoNavigateToFocusedRow?: boolean;
/**
* Specifies whether data should be cached.
*/
cacheEnabled?: boolean;
/**
* Enables a hint that appears when a user hovers the mouse pointer over a cell with truncated content.
*/
cellHintEnabled?: boolean;
/**
* Specifies whether columns should adjust their widths to the content.
*/
columnAutoWidth?: boolean;
/**
* Configures the column chooser.
*/
columnChooser?: ColumnChooser;
/**
* Configures column fixing.
*/
columnFixing?: ColumnFixing;
/**
* Specifies whether the UI component should hide columns to adapt to the screen or container size. Ignored if allowColumnResizing is true and columnResizingMode is 'widget'.
*/
columnHidingEnabled?: boolean;
/**
* Specifies the minimum width of columns.
*/
columnMinWidth?: number;
/**
* Specifies how the UI component resizes columns. Applies only if allowColumnResizing is true.
*/
columnResizingMode?: 'nextColumn' | 'widget';
/**
* Specifies the width for all data columns. Has a lower priority than the column.width property.
*/
columnWidth?: number | 'auto';
/**
* Overridden.
*/
columns?: Array<ColumnBase<TRowData> | string>;
/**
* Binds the UI component to data.
*/
dataSource?: DataSourceLike<TRowData, TKey>;
/**
* Specifies the format in which date-time values should be sent to the server.
*/
dateSerializationFormat?: string;
/**
* Overriden.
*/
editing?: EditingBase<TRowData, TKey>;
/**
* Indicates whether to show the error row.
*/
errorRowEnabled?: boolean;
/**
* Configures the integrated filter builder.
*/
filterBuilder?: dxFilterBuilderOptions;
/**
* Configures the popup in which the integrated filter builder is shown.
*/
filterBuilderPopup?: PopupProperties;
/**
* Configures the filter panel.
*/
filterPanel?: FilterPanel<TComponent, TRowData, TKey>;
/**
* Configures the filter row.
*/
filterRow?: FilterRow;
/**
* Specifies whether to synchronize the filter row, header filter, and filter builder. The synchronized filter expression is stored in the filterValue property.
*/
filterSyncEnabled?: boolean | 'auto';
/**
* Specifies a filter expression.
*/
filterValue?: string | Array<any> | Function;
/**
* The index of the column that contains the focused data cell. This index is taken from the columns array.
*/
focusedColumnIndex?: number;
/**
* Specifies whether the focused row feature is enabled.
*/
focusedRowEnabled?: boolean;
/**
* Specifies or indicates the focused data row's index.
*/
focusedRowIndex?: number;
/**
* Specifies initially or currently focused grid row's key.
*/
focusedRowKey?: TKey;
/**
* Configures the header filter feature.
*/
headerFilter?: HeaderFilter;
/**
* Specifies whether to highlight rows and cells with edited data. repaintChangesOnly should be true.
*/
highlightChanges?: boolean;
/**
* Configures keyboard navigation.
*/
keyboardNavigation?: KeyboardNavigation;
/**
* Configures the load panel.
*/
loadPanel?: LoadPanel;
/**
* Specifies a text string shown when the widget does not display any data.
*/
noDataText?: string;
/**
* A function that is executed before an adaptive detail row is rendered.
*/
onAdaptiveDetailRowPreparing?: ((e: EventInfo<TComponent> & AdaptiveDetailRowPreparingInfo) => void);
/**
* A function that is executed when an error occurs in the data source.
*/
onDataErrorOccurred?: ((e: EventInfo<TComponent> & DataErrorOccurredInfo) => void);
/**
* A function that is executed after row changes are discarded.
*/
onEditCanceled?: ((e: EventInfo<TComponent> & DataChangeInfo<TRowData, TKey>) => void);
/**
* A function that is executed when the edit operation is canceled, but row changes are not yet discarded.
*/
onEditCanceling?: ((e: Cancelable & EventInfo<TComponent> & DataChangeInfo<TRowData, TKey>) => void);
/**
* A function that is executed before a new row is added to the UI component.
*/
onInitNewRow?: ((e: EventInfo<TComponent> & NewRowInfo<TRowData>) => void);
/**
* A function that is executed when the UI component is in focus and a key has been pressed down.
*/
onKeyDown?: ((e: NativeEventInfo<TComponent, KeyboardEvent> & KeyDownInfo) => void);
/**
* A function that is executed after a row is collapsed.
*/
onRowCollapsed?: ((e: EventInfo<TComponent> & RowKeyInfo<TKey>) => void);
/**
* A function that is executed before a row is collapsed.
*/
onRowCollapsing?: ((e: Cancelable & EventInfo<TComponent> & RowKeyInfo<TKey>) => void);
/**
* A function that is executed after a row is expanded.
*/
onRowExpanded?: ((e: EventInfo<TComponent> & RowKeyInfo<TKey>) => void);
/**
* A function that is executed before a row is expanded.
*/
onRowExpanding?: ((e: Cancelable & EventInfo<TComponent> & RowKeyInfo<TKey>) => void);
/**
* A function that is executed after a new row has been inserted into the data source.
*/
onRowInserted?: ((e: EventInfo<TComponent> & RowInsertedInfo<TRowData, TKey>) => void);
/**
* A function that is executed before a new row is inserted into the data source.
*/
onRowInserting?: ((e: EventInfo<TComponent> & RowInsertingInfo<TRowData>) => void);
/**
* A function that is executed after a row has been removed from the data source.
*/
onRowRemoved?: ((e: EventInfo<TComponent> & RowRemovedInfo<TRowData, TKey>) => void);
/**
* A function that is executed before a row is removed from the data source.
*/
onRowRemoving?: ((e: EventInfo<TComponent> & RowRemovingInfo<TRowData, TKey>) => void);
/**
* A function that is executed after a row has been updated in the data source.
*/
onRowUpdated?: ((e: EventInfo<TComponent> & RowUpdatedInfo<TRowData, TKey>) => void);
/**
* A function that is executed before a row is updated in the data source.
*/
onRowUpdating?: ((e: EventInfo<TComponent> & RowUpdatingInfo<TRowData, TKey>) => void);
/**
* A function that is executed after cells in a row are validated against validation rules.
*/
onRowValidating?: ((e: EventInfo<TComponent> & RowValidatingInfo<TRowData, TKey>) => void);
/**
* A function that is executed after row changes are saved.
*/
onSaved?: ((e: EventInfo<TComponent> & DataChangeInfo<TRowData, TKey>) => void);
/**
* A function that is executed before pending row changes are saved.
*/
onSaving?: ((e: EventInfo<TComponent> & SavingInfo<TRowData, TKey>) => void);
/**
* A function that is executed after selecting a row or clearing its selection.
*/
onSelectionChanged?: ((e: EventInfo<TComponent> & SelectionChangedInfo<TRowData, TKey>) => void);
/**
* A function that is executed before the toolbar is created.
* @deprecated The onToolbarPreparing property is deprecated. Use the toolbar property instead.
*/
onToolbarPreparing?: ((e: EventInfo<TComponent> & ToolbarPreparingInfo) => void);
/**
* Configures the pager.
*/
pager?: Pager;
/**
* Configures paging.
*/
paging?: PagingBase;
/**
* Specifies whether to render the filter row, command columns, and columns with showEditorAlways set to true after other elements.
*/
renderAsync?: boolean;
/**
* Specifies whether to repaint only those cells whose data changed.
*/
repaintChangesOnly?: boolean;
/**
* Specifies whether rows should be shaded differently.
*/
rowAlternationEnabled?: boolean;
/**
* Configures row reordering using drag and drop gestures.
*/
rowDragging?: RowDragging<TComponent, TRowData, TKey>;
/**
*
*/
scrolling?: ScrollingBase;
/**
* Configures the search panel.
*/
searchPanel?: SearchPanel;
/**
* Allows you to select rows or determine which rows are selected.
*/
selectedRowKeys?: Array<TKey>;
/**
*
*/
selection?: SelectionBase;
/**
* Specifies whether the outer borders of the UI component are visible.
*/
showBorders?: boolean;
/**
* Specifies whether column headers are visible.
*/
showColumnHeaders?: boolean;
/**
* Specifies whether vertical lines that separate one column from another are visible.
*/
showColumnLines?: boolean;
/**
* Specifies whether horizontal lines that separate one row from another are visible.
*/
showRowLines?: boolean;
/**
* Configures runtime sorting.
*/
sorting?: Sorting;
/**
* Configures state storing.
*/
stateStoring?: StateStoring;
/**
* Specifies whether to enable two-way data binding.
*/
twoWayBindingEnabled?: boolean;
/**
* Specifies whether text that does not fit into a column should be wrapped.
*/
wordWrapEnabled?: boolean;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface ColumnChooser {
/**
* Specifies whether searching is enabled in the column chooser.
*/
allowSearch?: boolean;
/**
* Specifies text displayed by the column chooser when it is empty.
*/
emptyPanelText?: string;
/**
* Specifies whether a user can open the column chooser.
*/
enabled?: boolean;
/**
* Specifies the height of the column chooser.
*/
height?: number;
/**
* Specifies how a user manages columns using the column chooser.
*/
mode?: 'dragAndDrop' | 'select';
/**
* Specifies a delay in milliseconds between when a user finishes typing in the column chooser's search panel, and when the search is executed.
*/
searchTimeout?: number;
/**
* Specifies the title of the column chooser.
*/
title?: string;
/**
* Specifies the width of the column chooser.
*/
width?: number;
/**
* Specifies the sort order of column headers.
*/
sortOrder?: 'asc' | 'desc';
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface ColumnFixing {
/**
* Enables column fixing.
*/
enabled?: boolean;
/**
* Contains properties that specify texts for column fixing commands in the context menu of a column header.
*/
texts?: ColumnFixingTexts;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface ColumnFixingTexts {
/**
* Specifies text for the context menu item that fixes a column.
*/
fix?: string;
/**
* Specifies text for the context menu subitem that fixes a column to the left edge of the UI component.
*/
leftPosition?: string;
/**
* Specifies text for the context menu subitem that fixes a column to the right edge of the UI component.
*/
rightPosition?: string;
/**
* Specifies text for the context menu item that unfixes a column.
*/
unfix?: string;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface FilterPanelTexts {
/**
* The text of the 'Clear' link.
*/
clearFilter?: string;
/**
* The text of the 'Create Filter' link.
*/
createFilter?: string;
/**
* The hint of the checkbox that applies the filter.
*/
filterEnabledHint?: string;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface FilterRow {
/**
* Specifies when to apply a filter.
*/
applyFilter?: 'auto' | 'onClick';
/**
* Specifies text for a hint that appears when a user pauses on a button that applies the filter.
*/
applyFilterText?: string;
/**
* Specifies a placeholder for the editor that specifies the end of a range when a user selects the 'between' filter operation.
*/
betweenEndText?: string;
/**
* Specifies a placeholder for the editor that specifies the start of a range when a user selects the 'between' filter operation.
*/
betweenStartText?: string;
/**
* Specifies descriptions for filter operations on the filter list.
*/
operationDescriptions?: FilterRowOperationDescriptions;
/**
* Specifies text for the reset operation on the filter list.
*/
resetOperationText?: string;
/**
* Specifies text for the item that clears the applied filter. Used only when a cell of the filter row contains a select box.
*/
showAllText?: string;
/**
* Specifies whether icons that open the filter lists are visible.
*/
showOperationChooser?: boolean;
/**
* Specifies whether the filter row is visible.
*/
visible?: boolean;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface FilterRowOperationDescriptions {
/**
* A description for the 'between' operation.
*/
between?: string;
/**
* A description for the 'contains' operation.
*/
contains?: string;
/**
* A description for the 'endswith' operation.
*/
endsWith?: string;
/**
* A description for the '=' operation.
*/
equal?: string;
/**
* A description for the '>' operation.
*/
greaterThan?: string;
/**
* A description for the '>=' operation.
*/
greaterThanOrEqual?: string;
/**
* A description for the '<' operation.
*/
lessThan?: string;
/**
* A description for the '<=' operation.
*/
lessThanOrEqual?: string;
/**
* A description for the 'notcontains' operation.
*/
notContains?: string;
/**
* A description for the '<>' operation.
*/
notEqual?: string;
/**
* A description for the 'startswith' operation.
*/
startsWith?: string;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface HeaderFilter {
/**
* Specifies whether searching is enabled in the header filter.
*/
allowSearch?: boolean;
/**
* Specifies the height of the popup menu that contains values for filtering.
*/
height?: number;
/**
* Specifies a delay in milliseconds between when a user finishes typing in the header filter's search panel, and when the search is executed.
*/
searchTimeout?: number;
/**
* Contains properties that specify text for various elements of the popup menu.
*/
texts?: HeaderFilterTexts;
/**
* Specifies whether header filter icons are visible.
*/
visible?: boolean;
/**
* Specifies the width of the popup menu that contains values for filtering.
*/
width?: number;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface HeaderFilterTexts {
/**
* Specifies text for the button that closes the popup menu without applying a filter.
*/
cancel?: string;
/**
* Specifies a name for the item that represents empty values in the popup menu.
*/
emptyValue?: string;
/**
* Specifies text for the button that applies the specified filter.
*/
ok?: string;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface KeyboardNavigation {
/**
* Specifies whether users can enter a new cell value on a key press. Applies if editing.mode is 'cell' or 'batch'.
*/
editOnKeyPress?: boolean;
/**
* Enables keyboard navigation.
*/
enabled?: boolean;
/**
* Specifies whether the Enter key switches the cell or row to the edit state or moves focus in the enterKeyDirection. Applies for all edit modes, except 'popup'.
*/
enterKeyAction?: 'startEdit' | 'moveFocus';
/**
* Specifies the direction in which to move focus when a user presses Enter. Applies if editing.mode is 'cell' or 'batch'.
*/
enterKeyDirection?: 'none' | 'column' | 'row';
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface LoadPanel {
/**
* Enables displaying the load panel automatically.
*/
enabled?: boolean | 'auto';
/**
* Specifies the height of the load panel in pixels.
*/
height?: number;
/**
* Specifies a URL pointing to an image to be used as a loading indicator.
*/
indicatorSrc?: string;
/**
* Specifies whether to shade the UI component when the load panel is shown.
*/
shading?: boolean;
/**
* Specifies the shading color. Applies only if shading is true.
*/
shadingColor?: string;
/**
* Specifies whether to show the loading indicator.
*/
showIndicator?: boolean;
/**
* Specifies whether to show the pane of the load panel.
*/
showPane?: boolean;
/**
* Specifies text displayed on the load panel.
*/
text?: string;
/**
* Specifies the width of the load panel in pixels.
*/
width?: number;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface Pager {
/**
* Specifies the available page sizes in the page size selector.
*/
allowedPageSizes?: Array<(number | 'all')> | 'auto';
/**
* Specifies the pager's display mode.
*/
displayMode?: 'adaptive' | 'compact' | 'full';
/**
* Specifies the page information text.
*/
infoText?: string;
/**
* Specifies whether to show the page information.
*/
showInfo?: boolean;
/**
* Specifies whether to show navigation buttons.
*/
showNavigationButtons?: boolean;
/**
* Specifies whether to show the page size selector.
*/
showPageSizeSelector?: boolean;
/**
* Specifies whether the pager is visible.
*/
visible?: boolean | 'auto';
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface SearchPanel {
/**
* Notifies the UI component whether search is case-sensitive to ensure that search results are highlighted correctly. Applies only if highlightSearchText is true.
*/
highlightCaseSensitive?: boolean;
/**
* Specifies whether found substrings should be highlighted.
*/
highlightSearchText?: boolean;
/**
* Specifies a placeholder for the search panel.
*/
placeholder?: string;
/**
* Specifies whether the UI component should search against all columns or only visible ones.
*/
searchVisibleColumnsOnly?: boolean;
/**
* Sets a search string for the search panel.
*/
text?: string;
/**
* Specifies whether the search panel is visible or not.
*/
visible?: boolean;
/**
* Specifies the width of the search panel in pixels.
*/
width?: number;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface Sorting {
/**
* Specifies text for the context menu item that sets an ascending sort order in a column.
*/
ascendingText?: string;
/**
* Specifies text for the context menu item that clears sorting settings for a column.
*/
clearText?: string;
/**
* Specifies text for the context menu item that sets a descending sort order in a column.
*/
descendingText?: string;
/**
* Specifies the sorting mode.
*/
mode?: 'multiple' | 'none' | 'single';
/**
* Specifies whether to display sort indexes in column headers. Applies only when sorting.mode is 'multiple' and data is sorted by two or more columns.
*/
showSortIndexes?: boolean;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface StateStoring {
/**
* Specifies a function that is executed on state loading. Applies only if the type is 'custom'.
*/
customLoad?: (() => PromiseLike<any>);
/**
* Specifies a function that is executed on state change. Applies only if the type is 'custom'.
*/
customSave?: ((gridState: any) => any);
/**
* Enables state storing.
*/
enabled?: boolean;
/**
* Specifies the delay in milliseconds between when a user makes a change and when this change is saved.
*/
savingTimeout?: number;
/**
* Specifies the key for storing the UI component state.
*/
storageKey?: string;
/**
* Specifies the type of storage where the state is saved.
*/
type?: 'custom' | 'localStorage' | 'sessionStorage';
}
/**
* @deprecated
*/
export type GridBaseEditing<TRowData = any, TKey = any> = EditingBase<TRowData, TKey>;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface EditingBase<TRowData = any, TKey = any> {
/**
* Specifies if confirmation is required when a user deletes a row.
*/
confirmDelete?: boolean;
/**
* An array of pending row changes.
*/
changes?: Array<DataChange<TRowData, TKey>>;
/**
* The name of a column being edited. Applies only if editing.mode is 'cell' or 'batch'.
*/
editColumnName?: string;
/**
* The key(s) of a row being edited.
*/
editRowKey?: TKey;
/**
* Configures the form. Used only if editing.mode is 'form' or 'popup'.
*/
form?: dxFormOptions;
/**
* Specifies how a user edits data.
*/
mode?: 'batch' | 'cell' | 'row' | 'form' | 'popup';
/**
* Configures the popup. Used only if editing.mode is 'popup'.
*/
popup?: PopupProperties;
/**
* Specifies operations that are performed after saving changes.
*/
refreshMode?: 'full' | 'reshape' | 'repaint';
/**
* Specifies whether to select text in a cell when a user starts editing.
*/
selectTextOnEditStart?: boolean;
/**
* Specifies whether a single or double click should switch a cell to the editing state. Applies if editing.mode is 'cell' or 'batch'.
*/
startEditAction?: 'click' | 'dblClick';
/**
* Contains properties that specify texts for editing-related UI elements.
*/
texts?: EditingTextsBase;
/**
* Specifies whether the edit column uses icons instead of links.
*/
useIcons?: boolean;
}
/**
*
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface DataChange<TRowData = any, TKey = any> {
/**
* The key of the row being updated or removed.
*/
key: TKey;
/**
* Data change type.
*/
type: 'insert' | 'update' | 'remove';
/**
* An object with updated row fields.
*/
data: DeepPartial<TRowData>;
/**
* A key that identifies a record after which a new record should be inserted. Applies only if the type is 'insert'.
*/
insertAfterKey?: TKey;
/**
* A key that identifies the record before which a new record should be inserted. Applies only if the type is 'insert'.
*/
insertBeforeKey?: TKey;
}
/**
* @deprecated
*/
export type GridBaseEditingTexts = EditingTextsBase;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface EditingTextsBase {
/**
* Specifies text for a hint that appears when a user pauses on the global 'Add' button. Applies only if editing.allowAdding is true.
*/
addRow?: string;
/**
* Specifies text for a hint that appears when a user pauses on the 'Discard' button. Applies only if editing.mode is 'batch'.
*/
cancelAllChanges?: string;
/**
* Specifies text for a button that cancels changes in a row. Applies only if editing.allowUpdating is true and editing.mode is 'row'.
*/
cancelRowChanges?: string;
/**
* Specifies a message that prompts a user to confirm deletion.
*/
confirmDeleteMessage?: string;
/**
* Specifies a title for the window that asks a user to confirm deletion.
*/
confirmDeleteTitle?: string;
/**
* Specifies text for buttons that delete rows. Applies only if allowDeleting is true.
*/
deleteRow?: string;
/**
* Specifies text for buttons that switch rows into the editing state. Applies only if allowUpdating is true.
*/
editRow?: string;
/**
* Specifies text for a hint that appears when a user pauses on the global 'Save' button. Applies only if editing.mode is 'batch'.
*/
saveAllChanges?: string;
/**
* Specifies text for a button that saves changes made in a row. Applies only if allowUpdating is true.
*/
saveRowChanges?: string;
/**
* Specifies text for buttons that recover deleted rows. Applies only if allowDeleting is true and editing.mode is 'batch'.
*/
undeleteRow?: string;
/**
* Specifies text for a hint appearing when a user pauses on the button that cancels changes in a cell. Applies only if editing.mode is 'cell' and data validation is enabled.
*/
validationCancelChanges?: string;
}
/**
* @deprecated
*/
export type GridBasePaging = PagingBase;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface PagingBase {
/**
* Enables paging.
*/
enabled?: boolean;
/**
* Specifies the page to be displayed using a zero-based index.
*/
pageIndex?: number;
/**
* Specifies the page size.
*/
pageSize?: number;
}
/**
* @deprecated
*/
export type GridBaseScrolling = ScrollingBase;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface ScrollingBase {
/**
* Specifies the rendering mode for columns. Applies when columns are left outside the viewport. Requires the columnWidth, columnAutoWidth, or width (for all columns) property specified.
*/
columnRenderingMode?: 'standard' | 'virtual';
/**
* Specifies whether the UI component should load adjacent pages. Applies only if scrolling.mode is 'virtual' or 'infinite'.
*/
preloadEnabled?: boolean;
/**
* Specifies the rendering mode for loaded rows.
*/
rowRenderingMode?: 'standard' | 'virtual';
/**
* Specifies whether a user can scroll the content with a swipe gesture. Applies only if useNative is false.
*/
scrollByContent?: boolean;
/**
* Specifies whether a user can scroll the content with the scrollbar. Applies only if useNative is false.
*/
scrollByThumb?: boolean;
/**
* Specifies when to show scrollbars. Applies only if useNative is false.
*/
showScrollbar?: 'always' | 'never' | 'onHover' | 'onScroll';
/**
* Specifies whether the widget should use native or simulated scrolling.
*/
useNative?: boolean | 'auto';
/**
* Specifies whether to render rows after a user stops scrolling or at the same time as the user scrolls the widget.
*/
renderAsync?: boolean;
}
/**
* @deprecated
*/
export type GridBaseSelection = SelectionBase;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please describe your scenario in the following GitHub Issue, and we will suggest a public alternative: {@link https://github.com/DevExpress/DevExtreme/issues/17885|Internal Types}.
*/
export interface SelectionBase {
/**
* Allows users to simultaneously select all or current page rows (depending on the selectAllMode).
*/
allowSelectAll?: boolean;
/**
* Specifies the selection mode.
*/
mode?: 'multiple' | 'none' | 'single';
}
/**
* The base cla