UNPKG

devextreme-react

Version:

DevExtreme React UI and Visualization Components

1,123 lines (1,122 loc) • 147 kB
/*! * devextreme-react * Version: 24.2.6 * Build date: Mon Mar 17 2025 * * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED * * This software may be modified and distributed under the terms * of the MIT license. See the LICENSE file in the root of the project for details. * * https://github.com/DevExpress/devextreme-react */ export { ExplicitTypes } from "devextreme/ui/data_grid"; import * as React from "react"; import { Ref, ReactElement } from "react"; import dxDataGrid, { Properties } from "devextreme/ui/data_grid"; import { IHtmlOptions, NestedComponentMeta } from "./core/component"; import type { dxDataGridColumn, AdaptiveDetailRowPreparingEvent, CellClickEvent, CellDblClickEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, ExportingEvent, FocusedCellChangingEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, ToolbarPreparingEvent, dxDataGridRowObject, DataGridPredefinedColumnButton, ColumnButtonClickEvent, dxDataGridColumnButton, DataGridCommandColumnType, SelectionSensitivity, DataGridExportFormat, DataGridPredefinedToolbarItem, DataGridScrollMode, dxDataGridToolbarItem } from "devextreme/ui/data_grid"; import type { DataChange, DataChangeType, FilterOperation, FilterType, FixedPosition, HeaderFilterGroupInterval, ColumnHeaderFilterSearchConfig, SelectedFilterOperation, ColumnChooserMode, ColumnChooserSearchConfig, ColumnChooserSelectionConfig, HeaderFilterSearchConfig, SelectionColumnDisplayMode, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction, GridBase, ApplyFilterMode, GroupExpandMode, SummaryType, EnterKeyAction, EnterKeyDirection, PagerPageSize, DataRenderMode, StateStoreType } from "devextreme/common/grids"; import type { Mode, ValidationRuleType, HorizontalAlignment, VerticalAlignment, template, DataType, Format as CommonFormat, SearchMode, SortOrder, ComparisonOperator, SingleMultipleOrNone, SelectAllMode, PositionAlignment, Direction, ToolbarItemLocation, ToolbarItemComponent, DisplayMode, DragDirection, DragHighlight, ScrollbarMode } from "devextreme/common"; import type { ContentReadyEvent as FilterBuilderContentReadyEvent, DisposingEvent as FilterBuilderDisposingEvent, EditorPreparedEvent as FilterBuilderEditorPreparedEvent, EditorPreparingEvent as FilterBuilderEditorPreparingEvent, InitializedEvent as FilterBuilderInitializedEvent, dxFilterBuilderField, FieldInfo, FilterBuilderOperation, dxFilterBuilderCustomOperation, GroupOperation, OptionChangedEvent, ValueChangedEvent } from "devextreme/ui/filter_builder"; import type { ContentReadyEvent as FormContentReadyEvent, DisposingEvent as FormDisposingEvent, InitializedEvent as FormInitializedEvent, dxFormSimpleItem, dxFormOptions, OptionChangedEvent as FormOptionChangedEvent, dxFormGroupItem, dxFormTabbedItem, dxFormEmptyItem, dxFormButtonItem, LabelLocation, FormLabelMode, EditorEnterKeyEvent, FieldDataChangedEvent, FormItemComponent, FormItemType } from "devextreme/ui/form"; import type { AnimationConfig, CollisionResolution, PositionConfig, AnimationState, AnimationType, CollisionResolutionCombination } from "devextreme/common/core/animation"; import type { Format as LocalizationFormat } from "devextreme/common/core/localization"; import type { DataSourceOptions } from "devextreme/data/data_source"; import type { Store } from "devextreme/data/store"; import type { dxPopupOptions, dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup"; import type { event } from "devextreme/events/events.types"; import type { EventInfo } from "devextreme/common/core/events"; import type { Component } from "devextreme/core/component"; import type { LocateInMenuMode, ShowTextMode } from "devextreme/ui/toolbar"; import type { CollectionWidgetItem } from "devextreme/ui/collection/ui.collection_widget.base"; import type dxOverlay from "devextreme/ui/overlay"; import type DOMComponent from "devextreme/core/dom_component"; import type dxPopup from "devextreme/ui/popup"; import type dxForm from "devextreme/ui/form"; import type dxSortable from "devextreme/ui/sortable"; import type dxDraggable from "devextreme/ui/draggable"; import type * as CommonTypes from "devextreme/common"; type ReplaceFieldTypes<TSource, TReplacement> = { [P in keyof TSource]: P extends keyof TReplacement ? TReplacement[P] : TSource[P]; }; type IDataGridOptionsNarrowedEvents<TRowData = any, TKey = any> = { onAdaptiveDetailRowPreparing?: ((e: AdaptiveDetailRowPreparingEvent<TRowData, TKey>) => void); onCellClick?: ((e: CellClickEvent<TRowData, TKey>) => void); onCellDblClick?: ((e: CellDblClickEvent<TRowData, TKey>) => void); onCellPrepared?: ((e: CellPreparedEvent<TRowData, TKey>) => void); onContentReady?: ((e: ContentReadyEvent<TRowData, TKey>) => void); onContextMenuPreparing?: ((e: ContextMenuPreparingEvent<TRowData, TKey>) => void); onDataErrorOccurred?: ((e: DataErrorOccurredEvent<TRowData, TKey>) => void); onDisposing?: ((e: DisposingEvent<TRowData, TKey>) => void); onEditCanceled?: ((e: EditCanceledEvent<TRowData, TKey>) => void); onEditCanceling?: ((e: EditCancelingEvent<TRowData, TKey>) => void); onEditingStart?: ((e: EditingStartEvent<TRowData, TKey>) => void); onEditorPrepared?: ((e: EditorPreparedEvent<TRowData, TKey>) => void); onEditorPreparing?: ((e: EditorPreparingEvent<TRowData, TKey>) => void); onExporting?: ((e: ExportingEvent<TRowData, TKey>) => void); onFocusedCellChanging?: ((e: FocusedCellChangingEvent<TRowData, TKey>) => void); onFocusedRowChanging?: ((e: FocusedRowChangingEvent<TRowData, TKey>) => void); onInitialized?: ((e: InitializedEvent<TRowData, TKey>) => void); onInitNewRow?: ((e: InitNewRowEvent<TRowData, TKey>) => void); onKeyDown?: ((e: KeyDownEvent<TRowData, TKey>) => void); onRowClick?: ((e: RowClickEvent<TRowData, TKey>) => void); onRowCollapsed?: ((e: RowCollapsedEvent<TRowData, TKey>) => void); onRowCollapsing?: ((e: RowCollapsingEvent<TRowData, TKey>) => void); onRowDblClick?: ((e: RowDblClickEvent<TRowData, TKey>) => void); onRowExpanded?: ((e: RowExpandedEvent<TRowData, TKey>) => void); onRowExpanding?: ((e: RowExpandingEvent<TRowData, TKey>) => void); onRowInserted?: ((e: RowInsertedEvent<TRowData, TKey>) => void); onRowInserting?: ((e: RowInsertingEvent<TRowData, TKey>) => void); onRowPrepared?: ((e: RowPreparedEvent<TRowData, TKey>) => void); onRowRemoved?: ((e: RowRemovedEvent<TRowData, TKey>) => void); onRowRemoving?: ((e: RowRemovingEvent<TRowData, TKey>) => void); onRowUpdated?: ((e: RowUpdatedEvent<TRowData, TKey>) => void); onRowUpdating?: ((e: RowUpdatingEvent<TRowData, TKey>) => void); onRowValidating?: ((e: RowValidatingEvent<TRowData, TKey>) => void); onSaved?: ((e: SavedEvent<TRowData, TKey>) => void); onSaving?: ((e: SavingEvent<TRowData, TKey>) => void); onToolbarPreparing?: ((e: ToolbarPreparingEvent<TRowData, TKey>) => void); }; type IDataGridOptions<TRowData = any, TKey = any> = React.PropsWithChildren<ReplaceFieldTypes<Properties<TRowData, TKey>, IDataGridOptionsNarrowedEvents<TRowData, TKey>> & IHtmlOptions & { dataSource?: Properties<TRowData, TKey>["dataSource"]; dataRowRender?: (...params: any) => React.ReactNode; dataRowComponent?: React.ComponentType<any>; rowRender?: (...params: any) => React.ReactNode; rowComponent?: React.ComponentType<any>; defaultColumns?: Array<dxDataGridColumn | string>; defaultEditing?: Record<string, any>; defaultFilterPanel?: Record<string, any>; defaultFilterValue?: Array<any> | (() => any) | string; defaultFocusedColumnIndex?: number; defaultFocusedRowIndex?: number; defaultFocusedRowKey?: any | undefined; defaultGroupPanel?: Record<string, any>; defaultPaging?: Record<string, any>; defaultSearchPanel?: Record<string, any>; defaultSelectedRowKeys?: Array<any>; defaultSelectionFilter?: Array<any> | (() => any) | string; onColumnsChange?: (value: Array<dxDataGridColumn | string>) => void; onEditingChange?: (value: Record<string, any>) => void; onFilterPanelChange?: (value: Record<string, any>) => void; onFilterValueChange?: (value: Array<any> | (() => any) | string) => void; onFocusedColumnIndexChange?: (value: number) => void; onFocusedRowIndexChange?: (value: number) => void; onFocusedRowKeyChange?: (value: any | undefined) => void; onGroupPanelChange?: (value: Record<string, any>) => void; onPagingChange?: (value: Record<string, any>) => void; onSearchPanelChange?: (value: Record<string, any>) => void; onSelectedRowKeysChange?: (value: Array<any>) => void; onSelectionFilterChange?: (value: Array<any> | (() => any) | string) => void; }>; interface DataGridRef<TRowData = any, TKey = any> { instance: () => dxDataGrid<TRowData, TKey>; } declare const DataGrid: <TRowData = any, TKey = any>(props: ReplaceFieldTypes<Properties<TRowData, TKey>, IDataGridOptionsNarrowedEvents<TRowData, TKey>> & IHtmlOptions & { dataSource?: import("devextreme/data/data_source").DataSourceLike<TRowData, TKey> | null | undefined; dataRowRender?: ((...params: any) => React.ReactNode) | undefined; dataRowComponent?: React.ComponentType<any> | undefined; rowRender?: ((...params: any) => React.ReactNode) | undefined; rowComponent?: React.ComponentType<any> | undefined; defaultColumns?: (string | dxDataGridColumn<any, any>)[] | undefined; defaultEditing?: Record<string, any> | undefined; defaultFilterPanel?: Record<string, any> | undefined; defaultFilterValue?: string | any[] | (() => any) | undefined; defaultFocusedColumnIndex?: number | undefined; defaultFocusedRowIndex?: number | undefined; defaultFocusedRowKey?: any | undefined; defaultGroupPanel?: Record<string, any> | undefined; defaultPaging?: Record<string, any> | undefined; defaultSearchPanel?: Record<string, any> | undefined; defaultSelectedRowKeys?: any[] | undefined; defaultSelectionFilter?: string | any[] | (() => any) | undefined; onColumnsChange?: ((value: Array<dxDataGridColumn | string>) => void) | undefined; onEditingChange?: ((value: Record<string, any>) => void) | undefined; onFilterPanelChange?: ((value: Record<string, any>) => void) | undefined; onFilterValueChange?: ((value: Array<any> | (() => any) | string) => void) | undefined; onFocusedColumnIndexChange?: ((value: number) => void) | undefined; onFocusedRowIndexChange?: ((value: number) => void) | undefined; onFocusedRowKeyChange?: ((value: any | undefined) => void) | undefined; onGroupPanelChange?: ((value: Record<string, any>) => void) | undefined; onPagingChange?: ((value: Record<string, any>) => void) | undefined; onSearchPanelChange?: ((value: Record<string, any>) => void) | undefined; onSelectedRowKeysChange?: ((value: Array<any>) => void) | undefined; onSelectionFilterChange?: ((value: Array<any> | (() => any) | string) => void) | undefined; } & { children?: React.ReactNode; } & { ref?: React.Ref<DataGridRef<TRowData, TKey>> | undefined; }) => ReactElement | null; type IAnimationProps = React.PropsWithChildren<{ hide?: AnimationConfig; show?: AnimationConfig; }>; declare const Animation: ((props: IAnimationProps) => React.FunctionComponentElement<React.PropsWithChildren<{ hide?: AnimationConfig | undefined; show?: AnimationConfig | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IAsyncRuleProps = React.PropsWithChildren<{ ignoreEmptyValue?: boolean; message?: string; reevaluate?: boolean; type?: ValidationRuleType; validationCallback?: ((options: { column: Record<string, any>; data: Record<string, any>; formItem: Record<string, any>; rule: Record<string, any>; validator: Record<string, any>; value: string | number; }) => any); }>; declare const AsyncRule: ((props: IAsyncRuleProps) => React.FunctionComponentElement<React.PropsWithChildren<{ ignoreEmptyValue?: boolean | undefined; message?: string | undefined; reevaluate?: boolean | undefined; type?: ValidationRuleType | undefined; validationCallback?: ((options: { column: Record<string, any>; data: Record<string, any>; formItem: Record<string, any>; rule: Record<string, any>; validator: Record<string, any>; value: string | number; }) => any) | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IAtProps = React.PropsWithChildren<{ x?: HorizontalAlignment; y?: VerticalAlignment; }>; declare const At: ((props: IAtProps) => React.FunctionComponentElement<React.PropsWithChildren<{ x?: HorizontalAlignment | undefined; y?: VerticalAlignment | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IBoundaryOffsetProps = React.PropsWithChildren<{ x?: number; y?: number; }>; declare const BoundaryOffset: ((props: IBoundaryOffsetProps) => React.FunctionComponentElement<React.PropsWithChildren<{ x?: number | undefined; y?: number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IButtonProps = React.PropsWithChildren<{ cssClass?: string; disabled?: boolean | ((options: { column: dxDataGridColumn; component: dxDataGrid; row: dxDataGridRowObject; }) => boolean); hint?: string; icon?: string; name?: DataGridPredefinedColumnButton | string; onClick?: ((e: ColumnButtonClickEvent) => void); template?: ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; key: any; row: dxDataGridRowObject; rowIndex: number; rowType: string; }) => string | any) | template; text?: string; visible?: boolean | ((options: { column: dxDataGridColumn; component: dxDataGrid; row: dxDataGridRowObject; }) => boolean); render?: (...params: any) => React.ReactNode; component?: React.ComponentType<any>; }>; declare const Button: ((props: IButtonProps) => React.FunctionComponentElement<React.PropsWithChildren<{ cssClass?: string | undefined; disabled?: boolean | ((options: { column: dxDataGridColumn; component: dxDataGrid; row: dxDataGridRowObject; }) => boolean) | undefined; hint?: string | undefined; icon?: string | undefined; name?: string | undefined; onClick?: ((e: ColumnButtonClickEvent) => void) | undefined; template?: template | ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; key: any; row: dxDataGridRowObject; rowIndex: number; rowType: string; }) => string | any) | undefined; text?: string | undefined; visible?: boolean | ((options: { column: dxDataGridColumn; component: dxDataGrid; row: dxDataGridRowObject; }) => boolean) | undefined; render?: ((...params: any) => React.ReactNode) | undefined; component?: React.ComponentType<any> | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IChangeProps = React.PropsWithChildren<{ data?: any; insertAfterKey?: any; insertBeforeKey?: any; key?: any; type?: DataChangeType; }>; declare const Change: ((props: IChangeProps) => React.FunctionComponentElement<React.PropsWithChildren<{ data?: any; insertAfterKey?: any; insertBeforeKey?: any; key?: any; type?: DataChangeType | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColCountByScreenProps = React.PropsWithChildren<{ lg?: number | undefined; md?: number | undefined; sm?: number | undefined; xs?: number | undefined; }>; declare const ColCountByScreen: ((props: IColCountByScreenProps) => React.FunctionComponentElement<React.PropsWithChildren<{ lg?: number | undefined; md?: number | undefined; sm?: number | undefined; xs?: number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type ICollisionProps = React.PropsWithChildren<{ x?: CollisionResolution; y?: CollisionResolution; }>; declare const Collision: ((props: ICollisionProps) => React.FunctionComponentElement<React.PropsWithChildren<{ x?: CollisionResolution | undefined; y?: CollisionResolution | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnProps = React.PropsWithChildren<{ alignment?: HorizontalAlignment | undefined; allowEditing?: boolean; allowExporting?: boolean; allowFiltering?: boolean; allowFixing?: boolean; allowGrouping?: boolean; allowHeaderFiltering?: boolean; allowHiding?: boolean; allowReordering?: boolean; allowResizing?: boolean; allowSearch?: boolean; allowSorting?: boolean; autoExpandGroup?: boolean; buttons?: Array<DataGridPredefinedColumnButton | dxDataGridColumnButton>; calculateCellValue?: ((rowData: any) => any); calculateDisplayValue?: ((rowData: any) => any) | string; calculateFilterExpression?: ((filterValue: any, selectedFilterOperation: string | null, target: string) => string | (() => any) | Array<any>); calculateGroupValue?: ((rowData: any) => any) | string; calculateSortValue?: ((rowData: any) => any) | string; caption?: string | undefined; cellTemplate?: ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; displayValue: any; oldValue: any; row: dxDataGridRowObject; rowIndex: number; rowType: string; text: string; value: any; watch: (() => void); }) => any) | template; columns?: Array<dxDataGridColumn | string>; cssClass?: string | undefined; customizeText?: ((cellInfo: { groupInterval: string | number; target: string; value: any; valueText: string; }) => string); dataField?: string | undefined; dataType?: DataType | undefined; editCellTemplate?: ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; displayValue: any; row: dxDataGridRowObject; rowIndex: number; rowType: string; setValue(newValue: any, newText: any): any; text: string; value: any; watch: (() => void); }) => any) | template; editorOptions?: any; encodeHtml?: boolean; falseText?: string; filterOperations?: Array<FilterOperation | string>; filterType?: FilterType; filterValue?: any | undefined; filterValues?: Array<any>; fixed?: boolean; fixedPosition?: FixedPosition | undefined; format?: LocalizationFormat; formItem?: dxFormSimpleItem; groupCellTemplate?: ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; displayValue: any; groupContinuedMessage: string; groupContinuesMessage: string; row: dxDataGridRowObject; rowIndex: number; summaryItems: Array<any>; text: string; value: any; }) => any) | template; groupIndex?: number | undefined; headerCellTemplate?: ((columnHeader: any, headerInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; }) => any) | template; headerFilter?: Record<string, any> | { allowSearch?: boolean; allowSelectAll?: boolean; dataSource?: Array<any> | DataSourceOptions | ((options: { component: Record<string, any>; dataSource: DataSourceOptions | null; }) => void) | null | Store | undefined; groupInterval?: HeaderFilterGroupInterval | number | undefined; height?: number | string | undefined; search?: ColumnHeaderFilterSearchConfig; searchMode?: SearchMode; width?: number | string | undefined; }; hidingPriority?: number | undefined; isBand?: boolean | undefined; lookup?: Record<string, any> | { allowClearing?: boolean; calculateCellValue?: ((rowData: any) => any); dataSource?: Array<any> | DataSourceOptions | ((options: { data: Record<string, any>; key: any; }) => Array<any> | Store | DataSourceOptions) | null | Store | undefined; displayExpr?: ((data: any) => string) | string | undefined; valueExpr?: string | undefined; }; minWidth?: number | undefined; name?: string | undefined; ownerBand?: number | undefined; renderAsync?: boolean; selectedFilterOperation?: SelectedFilterOperation | undefined; setCellValue?: ((newData: any, value: any, currentRowData: any) => any); showEditorAlways?: boolean; showInColumnChooser?: boolean; showWhenGrouped?: boolean; sortIndex?: number | undefined; sortingMethod?: ((value1: any, value2: any) => number) | undefined; sortOrder?: SortOrder | undefined; trueText?: string; type?: DataGridCommandColumnType; validationRules?: Array<CommonTypes.ValidationRule>; visible?: boolean; visibleIndex?: number | undefined; width?: number | string | undefined; defaultFilterValue?: any | undefined; onFilterValueChange?: (value: any | undefined) => void; defaultFilterValues?: Array<any>; onFilterValuesChange?: (value: Array<any>) => void; defaultGroupIndex?: number | undefined; onGroupIndexChange?: (value: number | undefined) => void; defaultSelectedFilterOperation?: SelectedFilterOperation | undefined; onSelectedFilterOperationChange?: (value: SelectedFilterOperation | undefined) => void; defaultSortIndex?: number | undefined; onSortIndexChange?: (value: number | undefined) => void; defaultSortOrder?: SortOrder | undefined; onSortOrderChange?: (value: SortOrder | undefined) => void; defaultVisible?: boolean; onVisibleChange?: (value: boolean) => void; defaultVisibleIndex?: number | undefined; onVisibleIndexChange?: (value: number | undefined) => void; cellRender?: (...params: any) => React.ReactNode; cellComponent?: React.ComponentType<any>; editCellRender?: (...params: any) => React.ReactNode; editCellComponent?: React.ComponentType<any>; groupCellRender?: (...params: any) => React.ReactNode; groupCellComponent?: React.ComponentType<any>; headerCellRender?: (...params: any) => React.ReactNode; headerCellComponent?: React.ComponentType<any>; }>; declare const Column: ((props: IColumnProps) => React.FunctionComponentElement<React.PropsWithChildren<{ alignment?: HorizontalAlignment | undefined; allowEditing?: boolean | undefined; allowExporting?: boolean | undefined; allowFiltering?: boolean | undefined; allowFixing?: boolean | undefined; allowGrouping?: boolean | undefined; allowHeaderFiltering?: boolean | undefined; allowHiding?: boolean | undefined; allowReordering?: boolean | undefined; allowResizing?: boolean | undefined; allowSearch?: boolean | undefined; allowSorting?: boolean | undefined; autoExpandGroup?: boolean | undefined; buttons?: (DataGridPredefinedColumnButton | dxDataGridColumnButton<any, any>)[] | undefined; calculateCellValue?: ((rowData: any) => any) | undefined; calculateDisplayValue?: string | ((rowData: any) => any) | undefined; calculateFilterExpression?: ((filterValue: any, selectedFilterOperation: string | null, target: string) => string | (() => any) | Array<any>) | undefined; calculateGroupValue?: string | ((rowData: any) => any) | undefined; calculateSortValue?: string | ((rowData: any) => any) | undefined; caption?: string | undefined; cellTemplate?: template | ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; displayValue: any; oldValue: any; row: dxDataGridRowObject; rowIndex: number; rowType: string; text: string; value: any; watch: (() => void); }) => any) | undefined; columns?: (string | dxDataGridColumn<any, any>)[] | undefined; cssClass?: string | undefined; customizeText?: ((cellInfo: { groupInterval: string | number; target: string; value: any; valueText: string; }) => string) | undefined; dataField?: string | undefined; dataType?: DataType | undefined; editCellTemplate?: template | ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; displayValue: any; row: dxDataGridRowObject; rowIndex: number; rowType: string; setValue(newValue: any, newText: any): any; text: string; value: any; watch: (() => void); }) => any) | undefined; editorOptions?: any; encodeHtml?: boolean | undefined; falseText?: string | undefined; filterOperations?: string[] | undefined; filterType?: FilterType | undefined; filterValue?: any | undefined; filterValues?: any[] | undefined; fixed?: boolean | undefined; fixedPosition?: FixedPosition | undefined; format?: LocalizationFormat; formItem?: dxFormSimpleItem | undefined; groupCellTemplate?: template | ((cellElement: any, cellInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; data: Record<string, any>; displayValue: any; groupContinuedMessage: string; groupContinuesMessage: string; row: dxDataGridRowObject; rowIndex: number; summaryItems: Array<any>; text: string; value: any; }) => any) | undefined; groupIndex?: number | undefined; headerCellTemplate?: template | ((columnHeader: any, headerInfo: { column: dxDataGridColumn; columnIndex: number; component: dxDataGrid; }) => any) | undefined; headerFilter?: Record<string, any> | { allowSearch?: boolean | undefined; allowSelectAll?: boolean | undefined; dataSource?: any[] | DataSourceOptions<any, any, any, any> | Store<any, any> | ((options: { component: Record<string, any>; dataSource: DataSourceOptions | null; }) => void) | null | undefined; groupInterval?: HeaderFilterGroupInterval | number | undefined; height?: number | string | undefined; search?: ColumnHeaderFilterSearchConfig | undefined; searchMode?: SearchMode | undefined; width?: number | string | undefined; } | undefined; hidingPriority?: number | undefined; isBand?: boolean | undefined; lookup?: Record<string, any> | { allowClearing?: boolean | undefined; calculateCellValue?: ((rowData: any) => any) | undefined; dataSource?: any[] | DataSourceOptions<any, any, any, any> | Store<any, any> | ((options: { data: Record<string, any>; key: any; }) => Array<any> | Store | DataSourceOptions) | null | undefined; displayExpr?: string | ((data: any) => string) | undefined; valueExpr?: string | undefined; } | undefined; minWidth?: number | undefined; name?: string | undefined; ownerBand?: number | undefined; renderAsync?: boolean | undefined; selectedFilterOperation?: SelectedFilterOperation | undefined; setCellValue?: ((newData: any, value: any, currentRowData: any) => any) | undefined; showEditorAlways?: boolean | undefined; showInColumnChooser?: boolean | undefined; showWhenGrouped?: boolean | undefined; sortIndex?: number | undefined; sortingMethod?: ((value1: any, value2: any) => number) | undefined; sortOrder?: SortOrder | undefined; trueText?: string | undefined; type?: DataGridCommandColumnType | undefined; validationRules?: CommonTypes.ValidationRule[] | undefined; visible?: boolean | undefined; visibleIndex?: number | undefined; width?: number | string | undefined; defaultFilterValue?: any | undefined; onFilterValueChange?: ((value: any | undefined) => void) | undefined; defaultFilterValues?: any[] | undefined; onFilterValuesChange?: ((value: Array<any>) => void) | undefined; defaultGroupIndex?: number | undefined; onGroupIndexChange?: ((value: number | undefined) => void) | undefined; defaultSelectedFilterOperation?: SelectedFilterOperation | undefined; onSelectedFilterOperationChange?: ((value: SelectedFilterOperation | undefined) => void) | undefined; defaultSortIndex?: number | undefined; onSortIndexChange?: ((value: number | undefined) => void) | undefined; defaultSortOrder?: SortOrder | undefined; onSortOrderChange?: ((value: SortOrder | undefined) => void) | undefined; defaultVisible?: boolean | undefined; onVisibleChange?: ((value: boolean) => void) | undefined; defaultVisibleIndex?: number | undefined; onVisibleIndexChange?: ((value: number | undefined) => void) | undefined; cellRender?: ((...params: any) => React.ReactNode) | undefined; cellComponent?: React.ComponentType<any> | undefined; editCellRender?: ((...params: any) => React.ReactNode) | undefined; editCellComponent?: React.ComponentType<any> | undefined; groupCellRender?: ((...params: any) => React.ReactNode) | undefined; groupCellComponent?: React.ComponentType<any> | undefined; headerCellRender?: ((...params: any) => React.ReactNode) | undefined; headerCellComponent?: React.ComponentType<any> | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnChooserProps = React.PropsWithChildren<{ allowSearch?: boolean; container?: any | string | undefined; emptyPanelText?: string; enabled?: boolean; height?: number | string; mode?: ColumnChooserMode; position?: PositionConfig | undefined; search?: ColumnChooserSearchConfig; searchTimeout?: number; selection?: ColumnChooserSelectionConfig; sortOrder?: SortOrder | undefined; title?: string; width?: number | string; }>; declare const ColumnChooser: ((props: IColumnChooserProps) => React.FunctionComponentElement<React.PropsWithChildren<{ allowSearch?: boolean | undefined; container?: any | string | undefined; emptyPanelText?: string | undefined; enabled?: boolean | undefined; height?: string | number | undefined; mode?: ColumnChooserMode | undefined; position?: PositionConfig | undefined; search?: ColumnChooserSearchConfig | undefined; searchTimeout?: number | undefined; selection?: ColumnChooserSelectionConfig | undefined; sortOrder?: SortOrder | undefined; title?: string | undefined; width?: string | number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnChooserSearchProps = React.PropsWithChildren<{ editorOptions?: any; enabled?: boolean; timeout?: number; }>; declare const ColumnChooserSearch: ((props: IColumnChooserSearchProps) => React.FunctionComponentElement<React.PropsWithChildren<{ editorOptions?: any; enabled?: boolean | undefined; timeout?: number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnChooserSelectionProps = React.PropsWithChildren<{ allowSelectAll?: boolean; recursive?: boolean; selectByClick?: boolean; }>; declare const ColumnChooserSelection: ((props: IColumnChooserSelectionProps) => React.FunctionComponentElement<React.PropsWithChildren<{ allowSelectAll?: boolean | undefined; recursive?: boolean | undefined; selectByClick?: boolean | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnFixingProps = React.PropsWithChildren<{ enabled?: boolean; icons?: Record<string, any> | { fix?: string; leftPosition?: string; rightPosition?: string; stickyPosition?: string; unfix?: string; }; texts?: Record<string, any> | { fix?: string; leftPosition?: string; rightPosition?: string; stickyPosition?: string; unfix?: string; }; }>; declare const ColumnFixing: ((props: IColumnFixingProps) => React.FunctionComponentElement<React.PropsWithChildren<{ enabled?: boolean | undefined; icons?: Record<string, any> | { fix?: string | undefined; leftPosition?: string | undefined; rightPosition?: string | undefined; stickyPosition?: string | undefined; unfix?: string | undefined; } | undefined; texts?: Record<string, any> | { fix?: string | undefined; leftPosition?: string | undefined; rightPosition?: string | undefined; stickyPosition?: string | undefined; unfix?: string | undefined; } | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnFixingTextsProps = React.PropsWithChildren<{ fix?: string; leftPosition?: string; rightPosition?: string; stickyPosition?: string; unfix?: string; }>; declare const ColumnFixingTexts: ((props: IColumnFixingTextsProps) => React.FunctionComponentElement<React.PropsWithChildren<{ fix?: string | undefined; leftPosition?: string | undefined; rightPosition?: string | undefined; stickyPosition?: string | undefined; unfix?: string | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnHeaderFilterProps = React.PropsWithChildren<{ allowSearch?: boolean; allowSelectAll?: boolean; dataSource?: Array<any> | DataSourceOptions | ((options: { component: Record<string, any>; dataSource: DataSourceOptions | null; }) => void) | null | Store | undefined; groupInterval?: HeaderFilterGroupInterval | number | undefined; height?: number | string | undefined; search?: ColumnHeaderFilterSearchConfig; searchMode?: SearchMode; width?: number | string | undefined; }>; declare const ColumnHeaderFilter: ((props: IColumnHeaderFilterProps) => React.FunctionComponentElement<React.PropsWithChildren<{ allowSearch?: boolean | undefined; allowSelectAll?: boolean | undefined; dataSource?: any[] | DataSourceOptions<any, any, any, any> | Store<any, any> | ((options: { component: Record<string, any>; dataSource: DataSourceOptions | null; }) => void) | null | undefined; groupInterval?: HeaderFilterGroupInterval | number | undefined; height?: number | string | undefined; search?: ColumnHeaderFilterSearchConfig | undefined; searchMode?: SearchMode | undefined; width?: number | string | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnHeaderFilterSearchProps = React.PropsWithChildren<{ editorOptions?: any; enabled?: boolean; mode?: SearchMode; searchExpr?: Array<(() => any) | string> | (() => any) | string | undefined; timeout?: number; }>; declare const ColumnHeaderFilterSearch: ((props: IColumnHeaderFilterSearchProps) => React.FunctionComponentElement<React.PropsWithChildren<{ editorOptions?: any; enabled?: boolean | undefined; mode?: SearchMode | undefined; searchExpr?: Array<(() => any) | string> | (() => any) | string | undefined; timeout?: number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IColumnLookupProps = React.PropsWithChildren<{ allowClearing?: boolean; calculateCellValue?: ((rowData: any) => any); dataSource?: Array<any> | DataSourceOptions | ((options: { data: Record<string, any>; key: any; }) => Array<any> | Store | DataSourceOptions) | null | Store | undefined; displayExpr?: ((data: any) => string) | string | undefined; valueExpr?: string | undefined; }>; declare const ColumnLookup: ((props: IColumnLookupProps) => React.FunctionComponentElement<React.PropsWithChildren<{ allowClearing?: boolean | undefined; calculateCellValue?: ((rowData: any) => any) | undefined; dataSource?: any[] | DataSourceOptions<any, any, any, any> | Store<any, any> | ((options: { data: Record<string, any>; key: any; }) => Array<any> | Store | DataSourceOptions) | null | undefined; displayExpr?: string | ((data: any) => string) | undefined; valueExpr?: string | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type ICompareRuleProps = React.PropsWithChildren<{ comparisonTarget?: (() => any); comparisonType?: ComparisonOperator; ignoreEmptyValue?: boolean; message?: string; type?: ValidationRuleType; }>; declare const CompareRule: ((props: ICompareRuleProps) => React.FunctionComponentElement<React.PropsWithChildren<{ comparisonTarget?: (() => any) | undefined; comparisonType?: ComparisonOperator | undefined; ignoreEmptyValue?: boolean | undefined; message?: string | undefined; type?: ValidationRuleType | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type ICursorOffsetProps = React.PropsWithChildren<{ x?: number; y?: number; }>; declare const CursorOffset: ((props: ICursorOffsetProps) => React.FunctionComponentElement<React.PropsWithChildren<{ x?: number | undefined; y?: number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type ICustomOperationProps = React.PropsWithChildren<{ calculateFilterExpression?: ((filterValue: any, field: dxFilterBuilderField) => string | (() => any) | Array<any>); caption?: string | undefined; customizeText?: ((fieldInfo: FieldInfo) => string); dataTypes?: Array<DataType> | undefined; editorTemplate?: ((conditionInfo: { field: dxFilterBuilderField; setValue: (() => void); value: string | number | Date; }, container: any) => string | any) | template; hasValue?: boolean; icon?: string | undefined; name?: string | undefined; editorRender?: (...params: any) => React.ReactNode; editorComponent?: React.ComponentType<any>; }>; declare const CustomOperation: ((props: ICustomOperationProps) => React.FunctionComponentElement<React.PropsWithChildren<{ calculateFilterExpression?: ((filterValue: any, field: dxFilterBuilderField) => string | (() => any) | Array<any>) | undefined; caption?: string | undefined; customizeText?: ((fieldInfo: FieldInfo) => string) | undefined; dataTypes?: Array<DataType> | undefined; editorTemplate?: template | ((conditionInfo: { field: dxFilterBuilderField; setValue: (() => void); value: string | number | Date; }, container: any) => string | any) | undefined; hasValue?: boolean | undefined; icon?: string | undefined; name?: string | undefined; editorRender?: ((...params: any) => React.ReactNode) | undefined; editorComponent?: React.ComponentType<any> | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type ICustomRuleProps = React.PropsWithChildren<{ ignoreEmptyValue?: boolean; message?: string; reevaluate?: boolean; type?: ValidationRuleType; validationCallback?: ((options: { column: Record<string, any>; data: Record<string, any>; formItem: Record<string, any>; rule: Record<string, any>; validator: Record<string, any>; value: string | number; }) => boolean); }>; declare const CustomRule: ((props: ICustomRuleProps) => React.FunctionComponentElement<React.PropsWithChildren<{ ignoreEmptyValue?: boolean | undefined; message?: string | undefined; reevaluate?: boolean | undefined; type?: ValidationRuleType | undefined; validationCallback?: ((options: { column: Record<string, any>; data: Record<string, any>; formItem: Record<string, any>; rule: Record<string, any>; validator: Record<string, any>; value: string | number; }) => boolean) | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IDataGridHeaderFilterProps = React.PropsWithChildren<{ allowSearch?: boolean; allowSelectAll?: boolean; height?: number | string; search?: HeaderFilterSearchConfig; searchTimeout?: number; texts?: Record<string, any> | { cancel?: string; emptyValue?: string; ok?: string; }; visible?: boolean; width?: number | string; }>; declare const DataGridHeaderFilter: ((props: IDataGridHeaderFilterProps) => React.FunctionComponentElement<React.PropsWithChildren<{ allowSearch?: boolean | undefined; allowSelectAll?: boolean | undefined; height?: string | number | undefined; search?: HeaderFilterSearchConfig | undefined; searchTimeout?: number | undefined; texts?: Record<string, any> | { cancel?: string | undefined; emptyValue?: string | undefined; ok?: string | undefined; } | undefined; visible?: boolean | undefined; width?: string | number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IDataGridHeaderFilterSearchProps = React.PropsWithChildren<{ editorOptions?: any; enabled?: boolean; mode?: SearchMode; timeout?: number; }>; declare const DataGridHeaderFilterSearch: ((props: IDataGridHeaderFilterSearchProps) => React.FunctionComponentElement<React.PropsWithChildren<{ editorOptions?: any; enabled?: boolean | undefined; mode?: SearchMode | undefined; timeout?: number | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IDataGridHeaderFilterTextsProps = React.PropsWithChildren<{ cancel?: string; emptyValue?: string; ok?: string; }>; declare const DataGridHeaderFilterTexts: ((props: IDataGridHeaderFilterTextsProps) => React.FunctionComponentElement<React.PropsWithChildren<{ cancel?: string | undefined; emptyValue?: string | undefined; ok?: string | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IDataGridSelectionProps = React.PropsWithChildren<{ allowSelectAll?: boolean; deferred?: boolean; mode?: SingleMultipleOrNone; selectAllMode?: SelectAllMode; sensitivity?: SelectionSensitivity; showCheckBoxesMode?: SelectionColumnDisplayMode; }>; declare const DataGridSelection: ((props: IDataGridSelectionProps) => React.FunctionComponentElement<React.PropsWithChildren<{ allowSelectAll?: boolean | undefined; deferred?: boolean | undefined; mode?: SingleMultipleOrNone | undefined; selectAllMode?: SelectAllMode | undefined; sensitivity?: SelectionSensitivity | undefined; showCheckBoxesMode?: SelectionColumnDisplayMode | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IEditingProps = React.PropsWithChildren<{ allowAdding?: boolean; allowDeleting?: boolean | ((options: { component: dxDataGrid; row: dxDataGridRowObject; }) => boolean); allowUpdating?: boolean | ((options: { component: dxDataGrid; row: dxDataGridRowObject; }) => boolean); changes?: Array<DataChange>; confirmDelete?: boolean; editColumnName?: string; editRowKey?: any; form?: dxFormOptions; mode?: GridsEditMode; newRowPosition?: NewRowPosition; popup?: dxPopupOptions<any>; refreshMode?: GridsEditRefreshMode; selectTextOnEditStart?: boolean; startEditAction?: StartEditAction; texts?: any | { addRow?: string; cancelAllChanges?: string; cancelRowChanges?: string; confirmDeleteMessage?: string; confirmDeleteTitle?: string; deleteRow?: string; editRow?: string; saveAllChanges?: string; saveRowChanges?: string; undeleteRow?: string; validationCancelChanges?: string; }; useIcons?: boolean; defaultChanges?: Array<DataChange>; onChangesChange?: (value: Array<DataChange>) => void; defaultEditColumnName?: string; onEditColumnNameChange?: (value: string) => void; defaultEditRowKey?: any; onEditRowKeyChange?: (value: any) => void; }>; declare const Editing: ((props: IEditingProps) => React.FunctionComponentElement<React.PropsWithChildren<{ allowAdding?: boolean | undefined; allowDeleting?: boolean | ((options: { component: dxDataGrid; row: dxDataGridRowObject; }) => boolean) | undefined; allowUpdating?: boolean | ((options: { component: dxDataGrid; row: dxDataGridRowObject; }) => boolean) | undefined; changes?: DataChange<any, any>[] | undefined; confirmDelete?: boolean | undefined; editColumnName?: string | undefined; editRowKey?: any; form?: dxFormOptions | undefined; mode?: GridsEditMode | undefined; newRowPosition?: NewRowPosition | undefined; popup?: dxPopupOptions<any> | undefined; refreshMode?: GridsEditRefreshMode | undefined; selectTextOnEditStart?: boolean | undefined; startEditAction?: StartEditAction | undefined; texts?: any | { addRow?: string; cancelAllChanges?: string; cancelRowChanges?: string; confirmDeleteMessage?: string; confirmDeleteTitle?: string; deleteRow?: string; editRow?: string; saveAllChanges?: string; saveRowChanges?: string; undeleteRow?: string; validationCancelChanges?: string; }; useIcons?: boolean | undefined; defaultChanges?: DataChange<any, any>[] | undefined; onChangesChange?: ((value: Array<DataChange>) => void) | undefined; defaultEditColumnName?: string | undefined; onEditColumnNameChange?: ((value: string) => void) | undefined; defaultEditRowKey?: any; onEditRowKeyChange?: ((value: any) => void) | undefined; } & { children?: React.ReactNode; } & { elementDescriptor: import("./core/configuration/react/element").IElementDescriptor; }>>) & NestedComponentMeta; type IEditingTextsProps = React.PropsWithChildren<{ addRow?: string; cancelAllChanges?: string; cancelRowChanges?: string; confirmDeleteMessage?: string; confirmDeleteTitle?: string; deleteRow?: string; editRow?: string; saveAllChanges?: string; saveRowChanges?: string; undeleteRow?: string; validationCancelChanges?: string; }>; declare const EditingTexts: ((props: IEditingTextsProps) => React.FunctionComponentElement<React.PropsWithChildren<{ addRow?: string | undefined; cancelAllChanges?: string | undefined; cancelRowChanges?: str