devextreme-react 23.2.6 → 24.1.2-beta

package/cjs/data-grid.d.ts

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.6
- * Build date: Wed May 01 2024
+ * Version: 24.1.2-beta
+ * Build date: Mon May 13 2024
  *
  * Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -11,11 +11,11 @@
  * https://github.com/DevExpress/devextreme-react
  */
 
-/// <reference types="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 { Component as BaseComponent, IHtmlOptions } from "./core/component";
-import NestedOption from "./core/nested-option";
+import { IHtmlOptions, IElementDescriptor } 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, ColumnButtonClickEvent, dxDataGridColumnButton, dxDataGridToolbarItem } from "devextreme/ui/data_grid";
 import type { DataChange, ColumnHeaderFilterSearchConfig, ColumnChooserSearchConfig, ColumnChooserSelectionConfig, HeaderFilterSearchConfig, GridBase } from "devextreme/common/grids";
 import type { ContentReadyEvent as FilterBuilderContentReadyEvent, DisposingEvent as FilterBuilderDisposingEvent, EditorPreparedEvent as FilterBuilderEditorPreparedEvent, EditorPreparingEvent as FilterBuilderEditorPreparingEvent, InitializedEvent as FilterBuilderInitializedEvent, dxFilterBuilderField, dxFilterBuilderCustomOperation, OptionChangedEvent, ValueChangedEvent } from "devextreme/ui/filter_builder";
@@ -37,10 +37,10 @@ import type dxSortable from "devextreme/ui/sortable";
 import type dxDraggable from "devextreme/ui/draggable";
 import type * as LocalizationTypes from "devextreme/localization";
 import type * as CommonTypes from "devextreme/common";
-declare type ReplaceFieldTypes<TSource, TReplacement> = {
+type ReplaceFieldTypes<TSource, TReplacement> = {
     [P in keyof TSource]: P extends keyof TReplacement ? TReplacement[P] : TSource[P];
 };
-declare type IDataGridOptionsNarrowedEvents<TRowData = any, TKey = any> = {
+type IDataGridOptionsNarrowedEvents<TRowData = any, TKey = any> = {
     onAdaptiveDetailRowPreparing?: ((e: AdaptiveDetailRowPreparingEvent<TRowData, TKey>) => void);
     onCellClick?: ((e: CellClickEvent<TRowData, TKey>) => void);
     onCellDblClick?: ((e: CellDblClickEvent<TRowData, TKey>) => void);
@@ -78,14 +78,12 @@ declare type IDataGridOptionsNarrowedEvents<TRowData = any, TKey = any> = {
     onSaving?: ((e: SavingEvent<TRowData, TKey>) => void);
     onToolbarPreparing?: ((e: ToolbarPreparingEvent<TRowData, TKey>) => void);
 };
-declare type IDataGridOptions<TRowData = any, TKey = any> = React.PropsWithChildren<ReplaceFieldTypes<Properties<TRowData, TKey>, IDataGridOptionsNarrowedEvents<TRowData, TKey>> & IHtmlOptions & {
+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>;
-    dataRowKeyFn?: (data: any) => string;
     rowRender?: (...params: any) => React.ReactNode;
     rowComponent?: React.ComponentType<any>;
-    rowKeyFn?: (data: any) => string;
     defaultColumns?: Array<dxDataGridColumn | string>;
     defaultEditing?: Record<string, any>;
     defaultFilterPanel?: Record<string, any>;
@@ -111,169 +109,51 @@ declare type IDataGridOptions<TRowData = any, TKey = any> = React.PropsWithChild
     onSelectedRowKeysChange?: (value: Array<any>) => void;
     onSelectionFilterChange?: (value: Array<any> | (() => any) | string) => void;
 }>;
-declare class DataGrid<TRowData = any, TKey = any> extends BaseComponent<React.PropsWithChildren<IDataGridOptions<TRowData, TKey>>> {
-    get instance(): dxDataGrid<TRowData, TKey>;
-    protected _WidgetClass: typeof dxDataGrid;
-    protected useRequestAnimationFrameFlag: boolean;
-    protected subscribableOptions: string[];
-    protected independentEvents: string[];
-    protected _defaults: {
-        defaultColumns: string;
-        defaultEditing: string;
-        defaultFilterPanel: string;
-        defaultFilterValue: string;
-        defaultFocusedColumnIndex: string;
-        defaultFocusedRowIndex: string;
-        defaultFocusedRowKey: string;
-        defaultGroupPanel: string;
-        defaultPaging: string;
-        defaultSearchPanel: string;
-        defaultSelectedRowKeys: string;
-        defaultSelectionFilter: string;
-    };
-    protected _expectedChildren: {
-        column: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        columnChooser: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        columnFixing: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        dataGridHeaderFilter: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        dataGridSelection: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        editing: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        export: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        filterBuilder: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        filterBuilderPopup: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        filterPanel: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        filterRow: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        grouping: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        groupPanel: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        headerFilter: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        keyboardNavigation: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        loadPanel: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        masterDetail: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        pager: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        paging: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        remoteOperations: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        rowDragging: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        scrolling: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        searchPanel: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        selection: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        sortByGroupSummaryInfo: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        sorting: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        stateStoring: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        summary: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        toolbar: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-    protected _templateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IAnimationProps = React.PropsWithChildren<{
+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;
+    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) => 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 class Animation extends NestedOption<IAnimationProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        hide: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        show: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IAsyncRuleProps = React.PropsWithChildren<{
+declare const _componentAnimation: React.MemoExoticComponent<(props: IAnimationProps) => React.FunctionComponentElement<IAnimationProps>>;
+declare const Animation: typeof _componentAnimation & IElementDescriptor;
+type IAsyncRuleProps = React.PropsWithChildren<{
     ignoreEmptyValue?: boolean;
     message?: string;
     reevaluate?: boolean;
@@ -287,28 +167,21 @@ declare type IAsyncRuleProps = React.PropsWithChildren<{
         value: string | number;
     }) => any);
 }>;
-declare class AsyncRule extends NestedOption<IAsyncRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IAtProps = React.PropsWithChildren<{
+declare const _componentAsyncRule: React.MemoExoticComponent<(props: IAsyncRuleProps) => React.FunctionComponentElement<IAsyncRuleProps>>;
+declare const AsyncRule: typeof _componentAsyncRule & IElementDescriptor;
+type IAtProps = React.PropsWithChildren<{
     x?: "center" | "left" | "right";
     y?: "bottom" | "center" | "top";
 }>;
-declare class At extends NestedOption<IAtProps> {
-    static OptionName: string;
-}
-declare type IBoundaryOffsetProps = React.PropsWithChildren<{
+declare const _componentAt: React.MemoExoticComponent<(props: IAtProps) => React.FunctionComponentElement<IAtProps>>;
+declare const At: typeof _componentAt & IElementDescriptor;
+type IBoundaryOffsetProps = React.PropsWithChildren<{
     x?: number;
     y?: number;
 }>;
-declare class BoundaryOffset extends NestedOption<IBoundaryOffsetProps> {
-    static OptionName: string;
-}
-declare type IButtonProps = React.PropsWithChildren<{
+declare const _componentBoundaryOffset: React.MemoExoticComponent<(props: IBoundaryOffsetProps) => React.FunctionComponentElement<IBoundaryOffsetProps>>;
+declare const BoundaryOffset: typeof _componentBoundaryOffset & IElementDescriptor;
+type IButtonProps = React.PropsWithChildren<{
     cssClass?: string;
     disabled?: boolean | ((options: {
         column: dxDataGridColumn;
@@ -337,46 +210,33 @@ declare type IButtonProps = React.PropsWithChildren<{
     }) => boolean);
     render?: (...params: any) => React.ReactNode;
     component?: React.ComponentType<any>;
-    keyFn?: (data: any) => string;
-}>;
-declare class Button extends NestedOption<IButtonProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IChangeProps = React.PropsWithChildren<{
+}>;
+declare const _componentButton: React.MemoExoticComponent<(props: IButtonProps) => React.FunctionComponentElement<IButtonProps>>;
+declare const Button: typeof _componentButton & IElementDescriptor;
+type IChangeProps = React.PropsWithChildren<{
     data?: any;
     insertAfterKey?: any;
     insertBeforeKey?: any;
     key?: any;
     type?: "insert" | "update" | "remove";
 }>;
-declare class Change extends NestedOption<IChangeProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-}
-declare type IColCountByScreenProps = React.PropsWithChildren<{
+declare const _componentChange: React.MemoExoticComponent<(props: IChangeProps) => React.FunctionComponentElement<IChangeProps>>;
+declare const Change: typeof _componentChange & IElementDescriptor;
+type IColCountByScreenProps = React.PropsWithChildren<{
     lg?: number;
     md?: number;
     sm?: number;
     xs?: number;
 }>;
-declare class ColCountByScreen extends NestedOption<IColCountByScreenProps> {
-    static OptionName: string;
-}
-declare type ICollisionProps = React.PropsWithChildren<{
+declare const _componentColCountByScreen: React.MemoExoticComponent<(props: IColCountByScreenProps) => React.FunctionComponentElement<IColCountByScreenProps>>;
+declare const ColCountByScreen: typeof _componentColCountByScreen & IElementDescriptor;
+type ICollisionProps = React.PropsWithChildren<{
     x?: "fit" | "flip" | "flipfit" | "none";
     y?: "fit" | "flip" | "flipfit" | "none";
 }>;
-declare class Collision extends NestedOption<ICollisionProps> {
-    static OptionName: string;
-}
-declare type IColumnProps = React.PropsWithChildren<{
+declare const _componentCollision: React.MemoExoticComponent<(props: ICollisionProps) => React.FunctionComponentElement<ICollisionProps>>;
+declare const Collision: typeof _componentCollision & IElementDescriptor;
+type IColumnProps = React.PropsWithChildren<{
     alignment?: "center" | "left" | "right";
     allowEditing?: boolean;
     allowExporting?: boolean;
@@ -527,108 +387,16 @@ declare type IColumnProps = React.PropsWithChildren<{
     onVisibleIndexChange?: (value: number) => void;
     cellRender?: (...params: any) => React.ReactNode;
     cellComponent?: React.ComponentType<any>;
-    cellKeyFn?: (data: any) => string;
     editCellRender?: (...params: any) => React.ReactNode;
     editCellComponent?: React.ComponentType<any>;
-    editCellKeyFn?: (data: any) => string;
     groupCellRender?: (...params: any) => React.ReactNode;
     groupCellComponent?: React.ComponentType<any>;
-    groupCellKeyFn?: (data: any) => string;
     headerCellRender?: (...params: any) => React.ReactNode;
     headerCellComponent?: React.ComponentType<any>;
-    headerCellKeyFn?: (data: any) => string;
-}>;
-declare class Column extends NestedOption<IColumnProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static DefaultsProps: {
-        defaultFilterValue: string;
-        defaultFilterValues: string;
-        defaultGroupIndex: string;
-        defaultSelectedFilterOperation: string;
-        defaultSortIndex: string;
-        defaultSortOrder: string;
-        defaultVisible: string;
-        defaultVisibleIndex: string;
-    };
-    static ExpectedChildren: {
-        AsyncRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        button: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        columnHeaderFilter: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        columnLookup: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        CompareRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        CustomRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        EmailRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        format: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        formItem: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        headerFilter: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        lookup: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        NumericRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        PatternRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        RangeRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        RequiredRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        StringLengthRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        validationRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IColumnChooserProps = React.PropsWithChildren<{
+}>;
+declare const _componentColumn: React.MemoExoticComponent<(props: IColumnProps) => React.FunctionComponentElement<IColumnProps>>;
+declare const Column: typeof _componentColumn & IElementDescriptor;
+type IColumnChooserProps = React.PropsWithChildren<{
     allowSearch?: boolean;
     container?: any | string;
     emptyPanelText?: string;
@@ -643,48 +411,23 @@ declare type IColumnChooserProps = React.PropsWithChildren<{
     title?: string;
     width?: number | string;
 }>;
-declare class ColumnChooser extends NestedOption<IColumnChooserProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        columnChooserSearch: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        columnChooserSelection: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        position: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        search: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        selection: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IColumnChooserSearchProps = React.PropsWithChildren<{
+declare const _componentColumnChooser: React.MemoExoticComponent<(props: IColumnChooserProps) => React.FunctionComponentElement<IColumnChooserProps>>;
+declare const ColumnChooser: typeof _componentColumnChooser & IElementDescriptor;
+type IColumnChooserSearchProps = React.PropsWithChildren<{
     editorOptions?: any;
     enabled?: boolean;
     timeout?: number;
 }>;
-declare class ColumnChooserSearch extends NestedOption<IColumnChooserSearchProps> {
-    static OptionName: string;
-}
-declare type IColumnChooserSelectionProps = React.PropsWithChildren<{
+declare const _componentColumnChooserSearch: React.MemoExoticComponent<(props: IColumnChooserSearchProps) => React.FunctionComponentElement<IColumnChooserSearchProps>>;
+declare const ColumnChooserSearch: typeof _componentColumnChooserSearch & IElementDescriptor;
+type IColumnChooserSelectionProps = React.PropsWithChildren<{
     allowSelectAll?: boolean;
     recursive?: boolean;
     selectByClick?: boolean;
 }>;
-declare class ColumnChooserSelection extends NestedOption<IColumnChooserSelectionProps> {
-    static OptionName: string;
-}
-declare type IColumnFixingProps = React.PropsWithChildren<{
+declare const _componentColumnChooserSelection: React.MemoExoticComponent<(props: IColumnChooserSelectionProps) => React.FunctionComponentElement<IColumnChooserSelectionProps>>;
+declare const ColumnChooserSelection: typeof _componentColumnChooserSelection & IElementDescriptor;
+type IColumnFixingProps = React.PropsWithChildren<{
     enabled?: boolean;
     texts?: Record<string, any> | {
         fix?: string;
@@ -693,29 +436,17 @@ declare type IColumnFixingProps = React.PropsWithChildren<{
         unfix?: string;
     };
 }>;
-declare class ColumnFixing extends NestedOption<IColumnFixingProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        columnFixingTexts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        texts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IColumnFixingTextsProps = React.PropsWithChildren<{
+declare const _componentColumnFixing: React.MemoExoticComponent<(props: IColumnFixingProps) => React.FunctionComponentElement<IColumnFixingProps>>;
+declare const ColumnFixing: typeof _componentColumnFixing & IElementDescriptor;
+type IColumnFixingTextsProps = React.PropsWithChildren<{
     fix?: string;
     leftPosition?: string;
     rightPosition?: string;
     unfix?: string;
 }>;
-declare class ColumnFixingTexts extends NestedOption<IColumnFixingTextsProps> {
-    static OptionName: string;
-}
-declare type IColumnHeaderFilterProps = React.PropsWithChildren<{
+declare const _componentColumnFixingTexts: React.MemoExoticComponent<(props: IColumnFixingTextsProps) => React.FunctionComponentElement<IColumnFixingTextsProps>>;
+declare const ColumnFixingTexts: typeof _componentColumnFixingTexts & IElementDescriptor;
+type IColumnHeaderFilterProps = React.PropsWithChildren<{
     allowSearch?: boolean;
     allowSelectAll?: boolean;
     dataSource?: Array<any> | DataSourceOptions | ((options: {
@@ -728,30 +459,18 @@ declare type IColumnHeaderFilterProps = React.PropsWithChildren<{
     searchMode?: "contains" | "startswith" | "equals";
     width?: number | string;
 }>;
-declare class ColumnHeaderFilter extends NestedOption<IColumnHeaderFilterProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        columnHeaderFilterSearch: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        search: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IColumnHeaderFilterSearchProps = React.PropsWithChildren<{
+declare const _componentColumnHeaderFilter: React.MemoExoticComponent<(props: IColumnHeaderFilterProps) => React.FunctionComponentElement<IColumnHeaderFilterProps>>;
+declare const ColumnHeaderFilter: typeof _componentColumnHeaderFilter & IElementDescriptor;
+type IColumnHeaderFilterSearchProps = React.PropsWithChildren<{
     editorOptions?: any;
     enabled?: boolean;
     mode?: "contains" | "startswith" | "equals";
     searchExpr?: Array<(() => any) | string> | (() => any) | string;
     timeout?: number;
 }>;
-declare class ColumnHeaderFilterSearch extends NestedOption<IColumnHeaderFilterSearchProps> {
-    static OptionName: string;
-}
-declare type IColumnLookupProps = React.PropsWithChildren<{
+declare const _componentColumnHeaderFilterSearch: React.MemoExoticComponent<(props: IColumnHeaderFilterSearchProps) => React.FunctionComponentElement<IColumnHeaderFilterSearchProps>>;
+declare const ColumnHeaderFilterSearch: typeof _componentColumnHeaderFilterSearch & IElementDescriptor;
+type IColumnLookupProps = React.PropsWithChildren<{
     allowClearing?: boolean;
     calculateCellValue?: ((rowData: any) => any);
     dataSource?: Array<any> | DataSourceOptions | ((options: {
@@ -761,31 +480,24 @@ declare type IColumnLookupProps = React.PropsWithChildren<{
     displayExpr?: ((data: any) => string) | string;
     valueExpr?: string;
 }>;
-declare class ColumnLookup extends NestedOption<IColumnLookupProps> {
-    static OptionName: string;
-}
-declare type ICompareRuleProps = React.PropsWithChildren<{
+declare const _componentColumnLookup: React.MemoExoticComponent<(props: IColumnLookupProps) => React.FunctionComponentElement<IColumnLookupProps>>;
+declare const ColumnLookup: typeof _componentColumnLookup & IElementDescriptor;
+type ICompareRuleProps = React.PropsWithChildren<{
     comparisonTarget?: (() => any);
     comparisonType?: "!=" | "!==" | "<" | "<=" | "==" | "===" | ">" | ">=";
     ignoreEmptyValue?: boolean;
     message?: string;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
 }>;
-declare class CompareRule extends NestedOption<ICompareRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type ICursorOffsetProps = React.PropsWithChildren<{
+declare const _componentCompareRule: React.MemoExoticComponent<(props: ICompareRuleProps) => React.FunctionComponentElement<ICompareRuleProps>>;
+declare const CompareRule: typeof _componentCompareRule & IElementDescriptor;
+type ICursorOffsetProps = React.PropsWithChildren<{
     x?: number;
     y?: number;
 }>;
-declare class CursorOffset extends NestedOption<ICursorOffsetProps> {
-    static OptionName: string;
-}
-declare type ICustomOperationProps = React.PropsWithChildren<{
+declare const _componentCursorOffset: React.MemoExoticComponent<(props: ICursorOffsetProps) => React.FunctionComponentElement<ICursorOffsetProps>>;
+declare const CursorOffset: typeof _componentCursorOffset & IElementDescriptor;
+type ICustomOperationProps = React.PropsWithChildren<{
     calculateFilterExpression?: ((filterValue: any, field: dxFilterBuilderField) => string | (() => any) | Array<any>);
     caption?: string;
     customizeText?: ((fieldInfo: {
@@ -804,19 +516,10 @@ declare type ICustomOperationProps = React.PropsWithChildren<{
     name?: string;
     editorRender?: (...params: any) => React.ReactNode;
     editorComponent?: React.ComponentType<any>;
-    editorKeyFn?: (data: any) => string;
-}>;
-declare class CustomOperation extends NestedOption<ICustomOperationProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type ICustomRuleProps = React.PropsWithChildren<{
+}>;
+declare const _componentCustomOperation: React.MemoExoticComponent<(props: ICustomOperationProps) => React.FunctionComponentElement<ICustomOperationProps>>;
+declare const CustomOperation: typeof _componentCustomOperation & IElementDescriptor;
+type ICustomRuleProps = React.PropsWithChildren<{
     ignoreEmptyValue?: boolean;
     message?: string;
     reevaluate?: boolean;
@@ -830,14 +533,9 @@ declare type ICustomRuleProps = React.PropsWithChildren<{
         value: string | number;
     }) => boolean);
 }>;
-declare class CustomRule extends NestedOption<ICustomRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IDataGridHeaderFilterProps = React.PropsWithChildren<{
+declare const _componentCustomRule: React.MemoExoticComponent<(props: ICustomRuleProps) => React.FunctionComponentElement<ICustomRuleProps>>;
+declare const CustomRule: typeof _componentCustomRule & IElementDescriptor;
+type IDataGridHeaderFilterProps = React.PropsWithChildren<{
     allowSearch?: boolean;
     allowSelectAll?: boolean;
     height?: number | string;
@@ -851,55 +549,33 @@ declare type IDataGridHeaderFilterProps = React.PropsWithChildren<{
     visible?: boolean;
     width?: number | string;
 }>;
-declare class DataGridHeaderFilter extends NestedOption<IDataGridHeaderFilterProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        dataGridHeaderFilterSearch: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        dataGridHeaderFilterTexts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        search: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        texts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IDataGridHeaderFilterSearchProps = React.PropsWithChildren<{
+declare const _componentDataGridHeaderFilter: React.MemoExoticComponent<(props: IDataGridHeaderFilterProps) => React.FunctionComponentElement<IDataGridHeaderFilterProps>>;
+declare const DataGridHeaderFilter: typeof _componentDataGridHeaderFilter & IElementDescriptor;
+type IDataGridHeaderFilterSearchProps = React.PropsWithChildren<{
     editorOptions?: any;
     enabled?: boolean;
     mode?: "contains" | "startswith" | "equals";
     timeout?: number;
 }>;
-declare class DataGridHeaderFilterSearch extends NestedOption<IDataGridHeaderFilterSearchProps> {
-    static OptionName: string;
-}
-declare type IDataGridHeaderFilterTextsProps = React.PropsWithChildren<{
+declare const _componentDataGridHeaderFilterSearch: React.MemoExoticComponent<(props: IDataGridHeaderFilterSearchProps) => React.FunctionComponentElement<IDataGridHeaderFilterSearchProps>>;
+declare const DataGridHeaderFilterSearch: typeof _componentDataGridHeaderFilterSearch & IElementDescriptor;
+type IDataGridHeaderFilterTextsProps = React.PropsWithChildren<{
     cancel?: string;
     emptyValue?: string;
     ok?: string;
 }>;
-declare class DataGridHeaderFilterTexts extends NestedOption<IDataGridHeaderFilterTextsProps> {
-    static OptionName: string;
-}
-declare type IDataGridSelectionProps = React.PropsWithChildren<{
+declare const _componentDataGridHeaderFilterTexts: React.MemoExoticComponent<(props: IDataGridHeaderFilterTextsProps) => React.FunctionComponentElement<IDataGridHeaderFilterTextsProps>>;
+declare const DataGridHeaderFilterTexts: typeof _componentDataGridHeaderFilterTexts & IElementDescriptor;
+type IDataGridSelectionProps = React.PropsWithChildren<{
     allowSelectAll?: boolean;
     deferred?: boolean;
     mode?: "single" | "multiple" | "none";
     selectAllMode?: "allPages" | "page";
     showCheckBoxesMode?: "always" | "none" | "onClick" | "onLongTap";
 }>;
-declare class DataGridSelection extends NestedOption<IDataGridSelectionProps> {
-    static OptionName: string;
-}
-declare type IEditingProps = React.PropsWithChildren<{
+declare const _componentDataGridSelection: React.MemoExoticComponent<(props: IDataGridSelectionProps) => React.FunctionComponentElement<IDataGridSelectionProps>>;
+declare const DataGridSelection: typeof _componentDataGridSelection & IElementDescriptor;
+type IEditingProps = React.PropsWithChildren<{
     allowAdding?: boolean;
     allowDeleting?: boolean | ((options: {
         component: dxDataGrid;
@@ -941,37 +617,9 @@ declare type IEditingProps = React.PropsWithChildren<{
     defaultEditRowKey?: any;
     onEditRowKeyChange?: (value: any) => void;
 }>;
-declare class Editing extends NestedOption<IEditingProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultChanges: string;
-        defaultEditColumnName: string;
-        defaultEditRowKey: string;
-    };
-    static ExpectedChildren: {
-        change: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        editingTexts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        form: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        popup: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        texts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IEditingTextsProps = React.PropsWithChildren<{
+declare const _componentEditing: React.MemoExoticComponent<(props: IEditingProps) => React.FunctionComponentElement<IEditingProps>>;
+declare const Editing: typeof _componentEditing & IElementDescriptor;
+type IEditingTextsProps = React.PropsWithChildren<{
     addRow?: string;
     cancelAllChanges?: string;
     cancelRowChanges?: string;
@@ -984,22 +632,16 @@ declare type IEditingTextsProps = React.PropsWithChildren<{
     undeleteRow?: string;
     validationCancelChanges?: string;
 }>;
-declare class EditingTexts extends NestedOption<IEditingTextsProps> {
-    static OptionName: string;
-}
-declare type IEmailRuleProps = React.PropsWithChildren<{
+declare const _componentEditingTexts: React.MemoExoticComponent<(props: IEditingTextsProps) => React.FunctionComponentElement<IEditingTextsProps>>;
+declare const EditingTexts: typeof _componentEditingTexts & IElementDescriptor;
+type IEmailRuleProps = React.PropsWithChildren<{
     ignoreEmptyValue?: boolean;
     message?: string;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
 }>;
-declare class EmailRule extends NestedOption<IEmailRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IExportProps = React.PropsWithChildren<{
+declare const _componentEmailRule: React.MemoExoticComponent<(props: IEmailRuleProps) => React.FunctionComponentElement<IEmailRuleProps>>;
+declare const EmailRule: typeof _componentEmailRule & IElementDescriptor;
+type IExportProps = React.PropsWithChildren<{
     allowExportSelectedData?: boolean;
     enabled?: boolean;
     formats?: Array<"pdf" | "xlsx" | string>;
@@ -1009,28 +651,16 @@ declare type IExportProps = React.PropsWithChildren<{
         exportTo?: string;
     };
 }>;
-declare class Export extends NestedOption<IExportProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        exportTexts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        texts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IExportTextsProps = React.PropsWithChildren<{
+declare const _componentExport: React.MemoExoticComponent<(props: IExportProps) => React.FunctionComponentElement<IExportProps>>;
+declare const Export: typeof _componentExport & IElementDescriptor;
+type IExportTextsProps = React.PropsWithChildren<{
     exportAll?: string;
     exportSelectedRows?: string;
     exportTo?: string;
 }>;
-declare class ExportTexts extends NestedOption<IExportTextsProps> {
-    static OptionName: string;
-}
-declare type IFieldProps = React.PropsWithChildren<{
+declare const _componentExportTexts: React.MemoExoticComponent<(props: IExportTextsProps) => React.FunctionComponentElement<IExportTextsProps>>;
+declare const ExportTexts: typeof _componentExportTexts & IElementDescriptor;
+type IFieldProps = React.PropsWithChildren<{
     calculateFilterExpression?: ((filterValue: any, selectedFilterOperation: string) => string | (() => any) | Array<any>);
     caption?: string;
     customizeText?: ((fieldInfo: {
@@ -1059,42 +689,18 @@ declare type IFieldProps = React.PropsWithChildren<{
     trueText?: string;
     editorRender?: (...params: any) => React.ReactNode;
     editorComponent?: React.ComponentType<any>;
-    editorKeyFn?: (data: any) => string;
-}>;
-declare class Field extends NestedOption<IFieldProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static ExpectedChildren: {
-        fieldLookup: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        format: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        lookup: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IFieldLookupProps = React.PropsWithChildren<{
+}>;
+declare const _componentField: React.MemoExoticComponent<(props: IFieldProps) => React.FunctionComponentElement<IFieldProps>>;
+declare const Field: typeof _componentField & IElementDescriptor;
+type IFieldLookupProps = React.PropsWithChildren<{
     allowClearing?: boolean;
     dataSource?: Array<any> | DataSourceOptions | Store;
     displayExpr?: ((data: any) => string) | string;
     valueExpr?: ((data: any) => string | number | boolean) | string;
 }>;
-declare class FieldLookup extends NestedOption<IFieldLookupProps> {
-    static OptionName: string;
-}
-declare type IFilterBuilderProps = React.PropsWithChildren<{
+declare const _componentFieldLookup: React.MemoExoticComponent<(props: IFieldLookupProps) => React.FunctionComponentElement<IFieldLookupProps>>;
+declare const FieldLookup: typeof _componentFieldLookup & IElementDescriptor;
+type IFilterBuilderProps = React.PropsWithChildren<{
     accessKey?: string;
     activeStateEnabled?: boolean;
     allowHierarchicalFields?: boolean;
@@ -1145,31 +751,9 @@ declare type IFilterBuilderProps = React.PropsWithChildren<{
     defaultValue?: Array<any> | (() => any) | string;
     onValueChange?: (value: Array<any> | (() => any) | string) => void;
 }>;
-declare class FilterBuilder extends NestedOption<IFilterBuilderProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultValue: string;
-    };
-    static ExpectedChildren: {
-        customOperation: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        field: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        filterOperationDescriptions: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        groupOperationDescriptions: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IFilterBuilderPopupProps = React.PropsWithChildren<{
+declare const _componentFilterBuilder: React.MemoExoticComponent<(props: IFilterBuilderProps) => React.FunctionComponentElement<IFilterBuilderProps>>;
+declare const FilterBuilder: typeof _componentFilterBuilder & IElementDescriptor;
+type IFilterBuilderPopupProps = React.PropsWithChildren<{
     accessKey?: string;
     animation?: Record<string, any> | {
         hide?: AnimationConfig;
@@ -1179,13 +763,11 @@ declare type IFilterBuilderPopupProps = React.PropsWithChildren<{
     closeOnOutsideClick?: boolean | ((event: event) => boolean);
     container?: any | string;
     contentTemplate?: ((contentElement: any) => string | any) | template;
-    copyRootClassesToWrapper?: boolean;
     deferRendering?: boolean;
     disabled?: boolean;
     dragAndResizeArea?: any | string;
     dragEnabled?: boolean;
     dragOutsideBoundary?: boolean;
-    elementAttr?: any;
     enableBodyScroll?: boolean;
     focusStateEnabled?: boolean;
     fullScreen?: boolean;
@@ -1282,27 +864,12 @@ declare type IFilterBuilderPopupProps = React.PropsWithChildren<{
     onWidthChange?: (value: (() => number | string) | number | string) => void;
     contentRender?: (...params: any) => React.ReactNode;
     contentComponent?: React.ComponentType<any>;
-    contentKeyFn?: (data: any) => string;
     titleRender?: (...params: any) => React.ReactNode;
     titleComponent?: React.ComponentType<any>;
-    titleKeyFn?: (data: any) => string;
-}>;
-declare class FilterBuilderPopup extends NestedOption<IFilterBuilderPopupProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultHeight: string;
-        defaultPosition: string;
-        defaultVisible: string;
-        defaultWidth: string;
-    };
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IFilterOperationDescriptionsProps = React.PropsWithChildren<{
+}>;
+declare const _componentFilterBuilderPopup: React.MemoExoticComponent<(props: IFilterBuilderPopupProps) => React.FunctionComponentElement<IFilterBuilderPopupProps>>;
+declare const FilterBuilderPopup: typeof _componentFilterBuilderPopup & IElementDescriptor;
+type IFilterOperationDescriptionsProps = React.PropsWithChildren<{
     between?: string;
     contains?: string;
     endsWith?: string;
@@ -1317,10 +884,9 @@ declare type IFilterOperationDescriptionsProps = React.PropsWithChildren<{
     notEqual?: string;
     startsWith?: string;
 }>;
-declare class FilterOperationDescriptions extends NestedOption<IFilterOperationDescriptionsProps> {
-    static OptionName: string;
-}
-declare type IFilterPanelProps = React.PropsWithChildren<{
+declare const _componentFilterOperationDescriptions: React.MemoExoticComponent<(props: IFilterOperationDescriptionsProps) => React.FunctionComponentElement<IFilterOperationDescriptionsProps>>;
+declare const FilterOperationDescriptions: typeof _componentFilterOperationDescriptions & IElementDescriptor;
+type IFilterPanelProps = React.PropsWithChildren<{
     customizeText?: ((e: {
         component: GridBase;
         filterValue: Record<string, any>;
@@ -1336,31 +902,16 @@ declare type IFilterPanelProps = React.PropsWithChildren<{
     defaultFilterEnabled?: boolean;
     onFilterEnabledChange?: (value: boolean) => void;
 }>;
-declare class FilterPanel extends NestedOption<IFilterPanelProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultFilterEnabled: string;
-    };
-    static ExpectedChildren: {
-        filterPanelTexts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        texts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IFilterPanelTextsProps = React.PropsWithChildren<{
+declare const _componentFilterPanel: React.MemoExoticComponent<(props: IFilterPanelProps) => React.FunctionComponentElement<IFilterPanelProps>>;
+declare const FilterPanel: typeof _componentFilterPanel & IElementDescriptor;
+type IFilterPanelTextsProps = React.PropsWithChildren<{
     clearFilter?: string;
     createFilter?: string;
     filterEnabledHint?: string;
 }>;
-declare class FilterPanelTexts extends NestedOption<IFilterPanelTextsProps> {
-    static OptionName: string;
-}
-declare type IFilterRowProps = React.PropsWithChildren<{
+declare const _componentFilterPanelTexts: React.MemoExoticComponent<(props: IFilterPanelTextsProps) => React.FunctionComponentElement<IFilterPanelTextsProps>>;
+declare const FilterPanelTexts: typeof _componentFilterPanelTexts & IElementDescriptor;
+type IFilterRowProps = React.PropsWithChildren<{
     applyFilter?: "auto" | "onClick";
     applyFilterText?: string;
     betweenEndText?: string;
@@ -1383,16 +934,9 @@ declare type IFilterRowProps = React.PropsWithChildren<{
     showOperationChooser?: boolean;
     visible?: boolean;
 }>;
-declare class FilterRow extends NestedOption<IFilterRowProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        operationDescriptions: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IFormProps = React.PropsWithChildren<{
+declare const _componentFilterRow: React.MemoExoticComponent<(props: IFilterRowProps) => React.FunctionComponentElement<IFilterRowProps>>;
+declare const FilterRow: typeof _componentFilterRow & IElementDescriptor;
+type IFormProps = React.PropsWithChildren<{
     accessKey?: string;
     activeStateEnabled?: boolean;
     alignItemLabels?: boolean;
@@ -1442,19 +986,9 @@ declare type IFormProps = React.PropsWithChildren<{
     defaultFormData?: any;
     onFormDataChange?: (value: any) => void;
 }>;
-declare class Form extends NestedOption<IFormProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultFormData: string;
-    };
-    static ExpectedChildren: {
-        colCountByScreen: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IFormatProps = React.PropsWithChildren<{
+declare const _componentForm: React.MemoExoticComponent<(props: IFormProps) => React.FunctionComponentElement<IFormProps>>;
+declare const Form: typeof _componentForm & IElementDescriptor;
+type IFormatProps = React.PropsWithChildren<{
     currency?: string;
     formatter?: ((value: number | Date) => string);
     parser?: ((value: string) => number | Date);
@@ -1462,10 +996,9 @@ declare type IFormatProps = React.PropsWithChildren<{
     type?: "billions" | "currency" | "day" | "decimal" | "exponential" | "fixedPoint" | "largeNumber" | "longDate" | "longTime" | "millions" | "millisecond" | "month" | "monthAndDay" | "monthAndYear" | "percent" | "quarter" | "quarterAndYear" | "shortDate" | "shortTime" | "thousands" | "trillions" | "year" | "dayOfWeek" | "hour" | "longDateLongTime" | "minute" | "second" | "shortDateShortTime";
     useCurrencyAccountingStyle?: boolean;
 }>;
-declare class Format extends NestedOption<IFormatProps> {
-    static OptionName: string;
-}
-declare type IFormItemProps = React.PropsWithChildren<{
+declare const _componentFormat: React.MemoExoticComponent<(props: IFormatProps) => React.FunctionComponentElement<IFormatProps>>;
+declare const Format: typeof _componentFormat & IElementDescriptor;
+type IFormItemProps = React.PropsWithChildren<{
     colSpan?: number;
     cssClass?: string;
     dataField?: string;
@@ -1502,80 +1035,19 @@ declare type IFormItemProps = React.PropsWithChildren<{
     visibleIndex?: number;
     render?: (...params: any) => React.ReactNode;
     component?: React.ComponentType<any>;
-    keyFn?: (data: any) => string;
-}>;
-declare class FormItem extends NestedOption<IFormItemProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        AsyncRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        CompareRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        CustomRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        EmailRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        label: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        NumericRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        PatternRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        RangeRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        RequiredRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        StringLengthRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        validationRule: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IFromProps = React.PropsWithChildren<{
+}>;
+declare const _componentFormItem: React.MemoExoticComponent<(props: IFormItemProps) => React.FunctionComponentElement<IFormItemProps>>;
+declare const FormItem: typeof _componentFormItem & IElementDescriptor;
+type IFromProps = React.PropsWithChildren<{
     left?: number;
     opacity?: number;
     position?: PositionConfig;
     scale?: number;
     top?: number;
 }>;
-declare class From extends NestedOption<IFromProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        position: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IGroupingProps = React.PropsWithChildren<{
+declare const _componentFrom: React.MemoExoticComponent<(props: IFromProps) => React.FunctionComponentElement<IFromProps>>;
+declare const From: typeof _componentFrom & IElementDescriptor;
+type IGroupingProps = React.PropsWithChildren<{
     allowCollapsing?: boolean;
     autoExpandAll?: boolean;
     contextMenuEnabled?: boolean;
@@ -1588,30 +1060,18 @@ declare type IGroupingProps = React.PropsWithChildren<{
         ungroupAll?: string;
     };
 }>;
-declare class Grouping extends NestedOption<IGroupingProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        groupingTexts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        texts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IGroupingTextsProps = React.PropsWithChildren<{
+declare const _componentGrouping: React.MemoExoticComponent<(props: IGroupingProps) => React.FunctionComponentElement<IGroupingProps>>;
+declare const Grouping: typeof _componentGrouping & IElementDescriptor;
+type IGroupingTextsProps = React.PropsWithChildren<{
     groupByThisColumn?: string;
     groupContinuedMessage?: string;
     groupContinuesMessage?: string;
     ungroup?: string;
     ungroupAll?: string;
 }>;
-declare class GroupingTexts extends NestedOption<IGroupingTextsProps> {
-    static OptionName: string;
-}
-declare type IGroupItemProps = React.PropsWithChildren<{
+declare const _componentGroupingTexts: React.MemoExoticComponent<(props: IGroupingTextsProps) => React.FunctionComponentElement<IGroupingTextsProps>>;
+declare const GroupingTexts: typeof _componentGroupingTexts & IElementDescriptor;
+type IGroupItemProps = React.PropsWithChildren<{
     alignByColumn?: boolean;
     column?: string;
     customizeText?: ((itemInfo: {
@@ -1626,39 +1086,26 @@ declare type IGroupItemProps = React.PropsWithChildren<{
     summaryType?: "avg" | "count" | "custom" | "max" | "min" | "sum";
     valueFormat?: LocalizationTypes.Format;
 }>;
-declare class GroupItem extends NestedOption<IGroupItemProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static ExpectedChildren: {
-        valueFormat: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IGroupOperationDescriptionsProps = React.PropsWithChildren<{
+declare const _componentGroupItem: React.MemoExoticComponent<(props: IGroupItemProps) => React.FunctionComponentElement<IGroupItemProps>>;
+declare const GroupItem: typeof _componentGroupItem & IElementDescriptor;
+type IGroupOperationDescriptionsProps = React.PropsWithChildren<{
     and?: string;
     notAnd?: string;
     notOr?: string;
     or?: string;
 }>;
-declare class GroupOperationDescriptions extends NestedOption<IGroupOperationDescriptionsProps> {
-    static OptionName: string;
-}
-declare type IGroupPanelProps = React.PropsWithChildren<{
+declare const _componentGroupOperationDescriptions: React.MemoExoticComponent<(props: IGroupOperationDescriptionsProps) => React.FunctionComponentElement<IGroupOperationDescriptionsProps>>;
+declare const GroupOperationDescriptions: typeof _componentGroupOperationDescriptions & IElementDescriptor;
+type IGroupPanelProps = React.PropsWithChildren<{
     allowColumnDragging?: boolean;
     emptyPanelText?: string;
     visible?: boolean | "auto";
     defaultVisible?: boolean | "auto";
     onVisibleChange?: (value: boolean | "auto") => void;
 }>;
-declare class GroupPanel extends NestedOption<IGroupPanelProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultVisible: string;
-    };
-}
-declare type IHeaderFilterProps = React.PropsWithChildren<{
+declare const _componentGroupPanel: React.MemoExoticComponent<(props: IGroupPanelProps) => React.FunctionComponentElement<IGroupPanelProps>>;
+declare const GroupPanel: typeof _componentGroupPanel & IElementDescriptor;
+type IHeaderFilterProps = React.PropsWithChildren<{
     allowSearch?: boolean;
     allowSelectAll?: boolean;
     dataSource?: Array<any> | DataSourceOptions | ((options: {
@@ -1678,10 +1125,9 @@ declare type IHeaderFilterProps = React.PropsWithChildren<{
     };
     visible?: boolean;
 }>;
-declare class HeaderFilter extends NestedOption<IHeaderFilterProps> {
-    static OptionName: string;
-}
-declare type IHideProps = React.PropsWithChildren<{
+declare const _componentHeaderFilter: React.MemoExoticComponent<(props: IHeaderFilterProps) => React.FunctionComponentElement<IHeaderFilterProps>>;
+declare const HeaderFilter: typeof _componentHeaderFilter & IElementDescriptor;
+type IHideProps = React.PropsWithChildren<{
     complete?: (($element: any, config: AnimationConfig) => void);
     delay?: number;
     direction?: "bottom" | "left" | "right" | "top";
@@ -1693,20 +1139,9 @@ declare type IHideProps = React.PropsWithChildren<{
     to?: AnimationState;
     type?: "css" | "fade" | "fadeIn" | "fadeOut" | "pop" | "slide" | "slideIn" | "slideOut";
 }>;
-declare class Hide extends NestedOption<IHideProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        from: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        to: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IItemProps = React.PropsWithChildren<{
+declare const _componentHide: React.MemoExoticComponent<(props: IHideProps) => React.FunctionComponentElement<IHideProps>>;
+declare const Hide: typeof _componentHide & IElementDescriptor;
+type IItemProps = React.PropsWithChildren<{
     cssClass?: string;
     disabled?: boolean;
     html?: string;
@@ -1722,31 +1157,20 @@ declare type IItemProps = React.PropsWithChildren<{
     widget?: "dxAutocomplete" | "dxButton" | "dxButtonGroup" | "dxCheckBox" | "dxDateBox" | "dxDropDownButton" | "dxMenu" | "dxSelectBox" | "dxSwitch" | "dxTabs" | "dxTextBox";
     menuItemRender?: (...params: any) => React.ReactNode;
     menuItemComponent?: React.ComponentType<any>;
-    menuItemKeyFn?: (data: any) => string;
     render?: (...params: any) => React.ReactNode;
     component?: React.ComponentType<any>;
-    keyFn?: (data: any) => string;
-}>;
-declare class Item extends NestedOption<IItemProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IKeyboardNavigationProps = React.PropsWithChildren<{
+}>;
+declare const _componentItem: React.MemoExoticComponent<(props: IItemProps) => React.FunctionComponentElement<IItemProps>>;
+declare const Item: typeof _componentItem & IElementDescriptor;
+type IKeyboardNavigationProps = React.PropsWithChildren<{
     editOnKeyPress?: boolean;
     enabled?: boolean;
     enterKeyAction?: "startEdit" | "moveFocus";
     enterKeyDirection?: "none" | "column" | "row";
 }>;
-declare class KeyboardNavigation extends NestedOption<IKeyboardNavigationProps> {
-    static OptionName: string;
-}
-declare type ILabelProps = React.PropsWithChildren<{
+declare const _componentKeyboardNavigation: React.MemoExoticComponent<(props: IKeyboardNavigationProps) => React.FunctionComponentElement<IKeyboardNavigationProps>>;
+declare const KeyboardNavigation: typeof _componentKeyboardNavigation & IElementDescriptor;
+type ILabelProps = React.PropsWithChildren<{
     alignment?: "center" | "left" | "right";
     location?: "left" | "right" | "top";
     showColon?: boolean;
@@ -1762,18 +1186,10 @@ declare type ILabelProps = React.PropsWithChildren<{
     visible?: boolean;
     render?: (...params: any) => React.ReactNode;
     component?: React.ComponentType<any>;
-    keyFn?: (data: any) => string;
-}>;
-declare class Label extends NestedOption<ILabelProps> {
-    static OptionName: string;
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type ILoadPanelProps = React.PropsWithChildren<{
+}>;
+declare const _componentLabel: React.MemoExoticComponent<(props: ILabelProps) => React.FunctionComponentElement<ILabelProps>>;
+declare const Label: typeof _componentLabel & IElementDescriptor;
+type ILoadPanelProps = React.PropsWithChildren<{
     enabled?: boolean | "auto";
     height?: number | string;
     indicatorSrc?: string;
@@ -1784,10 +1200,9 @@ declare type ILoadPanelProps = React.PropsWithChildren<{
     text?: string;
     width?: number | string;
 }>;
-declare class LoadPanel extends NestedOption<ILoadPanelProps> {
-    static OptionName: string;
-}
-declare type ILookupProps = React.PropsWithChildren<{
+declare const _componentLoadPanel: React.MemoExoticComponent<(props: ILoadPanelProps) => React.FunctionComponentElement<ILoadPanelProps>>;
+declare const LoadPanel: typeof _componentLoadPanel & IElementDescriptor;
+type ILookupProps = React.PropsWithChildren<{
     allowClearing?: boolean;
     calculateCellValue?: ((rowData: any) => any);
     dataSource?: Array<any> | DataSourceOptions | ((options: {
@@ -1797,10 +1212,9 @@ declare type ILookupProps = React.PropsWithChildren<{
     displayExpr?: ((data: any) => string) | string;
     valueExpr?: string | ((data: any) => string | number | boolean);
 }>;
-declare class Lookup extends NestedOption<ILookupProps> {
-    static OptionName: string;
-}
-declare type IMasterDetailProps = React.PropsWithChildren<{
+declare const _componentLookup: React.MemoExoticComponent<(props: ILookupProps) => React.FunctionComponentElement<ILookupProps>>;
+declare const Lookup: typeof _componentLookup & IElementDescriptor;
+type IMasterDetailProps = React.PropsWithChildren<{
     autoExpandAll?: boolean;
     enabled?: boolean;
     template?: ((detailElement: any, detailInfo: {
@@ -1810,44 +1224,29 @@ declare type IMasterDetailProps = React.PropsWithChildren<{
     }) => any) | template;
     render?: (...params: any) => React.ReactNode;
     component?: React.ComponentType<any>;
-    keyFn?: (data: any) => string;
-}>;
-declare class MasterDetail extends NestedOption<IMasterDetailProps> {
-    static OptionName: string;
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IMyProps = React.PropsWithChildren<{
+}>;
+declare const _componentMasterDetail: React.MemoExoticComponent<(props: IMasterDetailProps) => React.FunctionComponentElement<IMasterDetailProps>>;
+declare const MasterDetail: typeof _componentMasterDetail & IElementDescriptor;
+type IMyProps = React.PropsWithChildren<{
     x?: "center" | "left" | "right";
     y?: "bottom" | "center" | "top";
 }>;
-declare class My extends NestedOption<IMyProps> {
-    static OptionName: string;
-}
-declare type INumericRuleProps = React.PropsWithChildren<{
+declare const _componentMy: React.MemoExoticComponent<(props: IMyProps) => React.FunctionComponentElement<IMyProps>>;
+declare const My: typeof _componentMy & IElementDescriptor;
+type INumericRuleProps = React.PropsWithChildren<{
     ignoreEmptyValue?: boolean;
     message?: string;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
 }>;
-declare class NumericRule extends NestedOption<INumericRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IOffsetProps = React.PropsWithChildren<{
+declare const _componentNumericRule: React.MemoExoticComponent<(props: INumericRuleProps) => React.FunctionComponentElement<INumericRuleProps>>;
+declare const NumericRule: typeof _componentNumericRule & IElementDescriptor;
+type IOffsetProps = React.PropsWithChildren<{
     x?: number;
     y?: number;
 }>;
-declare class Offset extends NestedOption<IOffsetProps> {
-    static OptionName: string;
-}
-declare type IOperationDescriptionsProps = React.PropsWithChildren<{
+declare const _componentOffset: React.MemoExoticComponent<(props: IOffsetProps) => React.FunctionComponentElement<IOffsetProps>>;
+declare const Offset: typeof _componentOffset & IElementDescriptor;
+type IOperationDescriptionsProps = React.PropsWithChildren<{
     between?: string;
     contains?: string;
     endsWith?: string;
@@ -1860,10 +1259,9 @@ declare type IOperationDescriptionsProps = React.PropsWithChildren<{
     notEqual?: string;
     startsWith?: string;
 }>;
-declare class OperationDescriptions extends NestedOption<IOperationDescriptionsProps> {
-    static OptionName: string;
-}
-declare type IPagerProps = React.PropsWithChildren<{
+declare const _componentOperationDescriptions: React.MemoExoticComponent<(props: IOperationDescriptionsProps) => React.FunctionComponentElement<IOperationDescriptionsProps>>;
+declare const OperationDescriptions: typeof _componentOperationDescriptions & IElementDescriptor;
+type IPagerProps = React.PropsWithChildren<{
     allowedPageSizes?: Array<number | "all" | "auto"> | "auto";
     displayMode?: "adaptive" | "compact" | "full";
     infoText?: string;
@@ -1873,10 +1271,9 @@ declare type IPagerProps = React.PropsWithChildren<{
     showPageSizeSelector?: boolean;
     visible?: boolean | "auto";
 }>;
-declare class Pager extends NestedOption<IPagerProps> {
-    static OptionName: string;
-}
-declare type IPagingProps = React.PropsWithChildren<{
+declare const _componentPager: React.MemoExoticComponent<(props: IPagerProps) => React.FunctionComponentElement<IPagerProps>>;
+declare const Pager: typeof _componentPager & IElementDescriptor;
+type IPagingProps = React.PropsWithChildren<{
     enabled?: boolean;
     pageIndex?: number;
     pageSize?: number;
@@ -1885,27 +1282,17 @@ declare type IPagingProps = React.PropsWithChildren<{
     defaultPageSize?: number;
     onPageSizeChange?: (value: number) => void;
 }>;
-declare class Paging extends NestedOption<IPagingProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultPageIndex: string;
-        defaultPageSize: string;
-    };
-}
-declare type IPatternRuleProps = React.PropsWithChildren<{
+declare const _componentPaging: React.MemoExoticComponent<(props: IPagingProps) => React.FunctionComponentElement<IPagingProps>>;
+declare const Paging: typeof _componentPaging & IElementDescriptor;
+type IPatternRuleProps = React.PropsWithChildren<{
     ignoreEmptyValue?: boolean;
     message?: string;
     pattern?: RegExp | string;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
 }>;
-declare class PatternRule extends NestedOption<IPatternRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IPopupProps = React.PropsWithChildren<{
+declare const _componentPatternRule: React.MemoExoticComponent<(props: IPatternRuleProps) => React.FunctionComponentElement<IPatternRuleProps>>;
+declare const PatternRule: typeof _componentPatternRule & IElementDescriptor;
+type IPopupProps = React.PropsWithChildren<{
     accessKey?: string;
     animation?: Record<string, any> | {
         hide?: AnimationConfig;
@@ -1915,13 +1302,11 @@ declare type IPopupProps = React.PropsWithChildren<{
     closeOnOutsideClick?: boolean | ((event: event) => boolean);
     container?: any | string;
     contentTemplate?: ((contentElement: any) => string | any) | template;
-    copyRootClassesToWrapper?: boolean;
     deferRendering?: boolean;
     disabled?: boolean;
     dragAndResizeArea?: any | string;
     dragEnabled?: boolean;
     dragOutsideBoundary?: boolean;
-    elementAttr?: any;
     enableBodyScroll?: boolean;
     focusStateEnabled?: boolean;
     fullScreen?: boolean;
@@ -2018,41 +1403,12 @@ declare type IPopupProps = React.PropsWithChildren<{
     onWidthChange?: (value: (() => number | string) | number | string) => void;
     contentRender?: (...params: any) => React.ReactNode;
     contentComponent?: React.ComponentType<any>;
-    contentKeyFn?: (data: any) => string;
     titleRender?: (...params: any) => React.ReactNode;
     titleComponent?: React.ComponentType<any>;
-    titleKeyFn?: (data: any) => string;
-}>;
-declare class Popup extends NestedOption<IPopupProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultHeight: string;
-        defaultPosition: string;
-        defaultVisible: string;
-        defaultWidth: string;
-    };
-    static ExpectedChildren: {
-        animation: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        position: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        toolbarItem: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IPositionProps = React.PropsWithChildren<{
+}>;
+declare const _componentPopup: React.MemoExoticComponent<(props: IPopupProps) => React.FunctionComponentElement<IPopupProps>>;
+declare const Popup: typeof _componentPopup & IElementDescriptor;
+type IPositionProps = React.PropsWithChildren<{
     at?: Record<string, any> | "bottom" | "center" | "left" | "left bottom" | "left top" | "right" | "right bottom" | "right top" | "top" | {
         x?: "center" | "left" | "right";
         y?: "bottom" | "center" | "top";
@@ -2076,10 +1432,9 @@ declare type IPositionProps = React.PropsWithChildren<{
         y?: number;
     };
 }>;
-declare class Position extends NestedOption<IPositionProps> {
-    static OptionName: string;
-}
-declare type IRangeRuleProps = React.PropsWithChildren<{
+declare const _componentPosition: React.MemoExoticComponent<(props: IPositionProps) => React.FunctionComponentElement<IPositionProps>>;
+declare const Position: typeof _componentPosition & IElementDescriptor;
+type IRangeRuleProps = React.PropsWithChildren<{
     ignoreEmptyValue?: boolean;
     max?: Date | number | string;
     message?: string;
@@ -2087,14 +1442,9 @@ declare type IRangeRuleProps = React.PropsWithChildren<{
     reevaluate?: boolean;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
 }>;
-declare class RangeRule extends NestedOption<IRangeRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IRemoteOperationsProps = React.PropsWithChildren<{
+declare const _componentRangeRule: React.MemoExoticComponent<(props: IRangeRuleProps) => React.FunctionComponentElement<IRangeRuleProps>>;
+declare const RangeRule: typeof _componentRangeRule & IElementDescriptor;
+type IRemoteOperationsProps = React.PropsWithChildren<{
     filtering?: boolean;
     grouping?: boolean;
     groupPaging?: boolean;
@@ -2102,22 +1452,16 @@ declare type IRemoteOperationsProps = React.PropsWithChildren<{
     sorting?: boolean;
     summary?: boolean;
 }>;
-declare class RemoteOperations extends NestedOption<IRemoteOperationsProps> {
-    static OptionName: string;
-}
-declare type IRequiredRuleProps = React.PropsWithChildren<{
+declare const _componentRemoteOperations: React.MemoExoticComponent<(props: IRemoteOperationsProps) => React.FunctionComponentElement<IRemoteOperationsProps>>;
+declare const RemoteOperations: typeof _componentRemoteOperations & IElementDescriptor;
+type IRequiredRuleProps = React.PropsWithChildren<{
     message?: string;
     trim?: boolean;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
 }>;
-declare class RequiredRule extends NestedOption<IRequiredRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IRowDraggingProps = React.PropsWithChildren<{
+declare const _componentRequiredRule: React.MemoExoticComponent<(props: IRequiredRuleProps) => React.FunctionComponentElement<IRequiredRuleProps>>;
+declare const RequiredRule: typeof _componentRequiredRule & IElementDescriptor;
+type IRowDraggingProps = React.PropsWithChildren<{
     allowDropInsideItem?: boolean;
     allowReordering?: boolean;
     autoScroll?: boolean;
@@ -2232,24 +1576,10 @@ declare type IRowDraggingProps = React.PropsWithChildren<{
     showDragIcons?: boolean;
     dragRender?: (...params: any) => React.ReactNode;
     dragComponent?: React.ComponentType<any>;
-    dragKeyFn?: (data: any) => string;
-}>;
-declare class RowDragging extends NestedOption<IRowDraggingProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        cursorOffset: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type IScrollingProps = React.PropsWithChildren<{
+}>;
+declare const _componentRowDragging: React.MemoExoticComponent<(props: IRowDraggingProps) => React.FunctionComponentElement<IRowDraggingProps>>;
+declare const RowDragging: typeof _componentRowDragging & IElementDescriptor;
+type IScrollingProps = React.PropsWithChildren<{
     columnRenderingMode?: "standard" | "virtual";
     mode?: "infinite" | "standard" | "virtual";
     preloadEnabled?: boolean;
@@ -2260,20 +1590,18 @@ declare type IScrollingProps = React.PropsWithChildren<{
     showScrollbar?: "always" | "never" | "onHover" | "onScroll";
     useNative?: boolean | "auto";
 }>;
-declare class Scrolling extends NestedOption<IScrollingProps> {
-    static OptionName: string;
-}
-declare type ISearchProps = React.PropsWithChildren<{
+declare const _componentScrolling: React.MemoExoticComponent<(props: IScrollingProps) => React.FunctionComponentElement<IScrollingProps>>;
+declare const Scrolling: typeof _componentScrolling & IElementDescriptor;
+type ISearchProps = React.PropsWithChildren<{
     editorOptions?: any;
     enabled?: boolean;
     mode?: "contains" | "startswith" | "equals";
     searchExpr?: Array<(() => any) | string> | (() => any) | string;
     timeout?: number;
 }>;
-declare class Search extends NestedOption<ISearchProps> {
-    static OptionName: string;
-}
-declare type ISearchPanelProps = React.PropsWithChildren<{
+declare const _componentSearch: React.MemoExoticComponent<(props: ISearchProps) => React.FunctionComponentElement<ISearchProps>>;
+declare const Search: typeof _componentSearch & IElementDescriptor;
+type ISearchPanelProps = React.PropsWithChildren<{
     highlightCaseSensitive?: boolean;
     highlightSearchText?: boolean;
     placeholder?: string;
@@ -2284,13 +1612,9 @@ declare type ISearchPanelProps = React.PropsWithChildren<{
     defaultText?: string;
     onTextChange?: (value: string) => void;
 }>;
-declare class SearchPanel extends NestedOption<ISearchPanelProps> {
-    static OptionName: string;
-    static DefaultsProps: {
-        defaultText: string;
-    };
-}
-declare type ISelectionProps = React.PropsWithChildren<{
+declare const _componentSearchPanel: React.MemoExoticComponent<(props: ISearchPanelProps) => React.FunctionComponentElement<ISearchPanelProps>>;
+declare const SearchPanel: typeof _componentSearchPanel & IElementDescriptor;
+type ISelectionProps = React.PropsWithChildren<{
     allowSelectAll?: boolean;
     deferred?: boolean;
     mode?: "single" | "multiple" | "none";
@@ -2299,10 +1623,9 @@ declare type ISelectionProps = React.PropsWithChildren<{
     recursive?: boolean;
     selectByClick?: boolean;
 }>;
-declare class Selection extends NestedOption<ISelectionProps> {
-    static OptionName: string;
-}
-declare type IShowProps = React.PropsWithChildren<{
+declare const _componentSelection: React.MemoExoticComponent<(props: ISelectionProps) => React.FunctionComponentElement<ISelectionProps>>;
+declare const Selection: typeof _componentSelection & IElementDescriptor;
+type IShowProps = React.PropsWithChildren<{
     complete?: (($element: any, config: AnimationConfig) => void);
     delay?: number;
     direction?: "bottom" | "left" | "right" | "top";
@@ -2314,29 +1637,25 @@ declare type IShowProps = React.PropsWithChildren<{
     to?: AnimationState;
     type?: "css" | "fade" | "fadeIn" | "fadeOut" | "pop" | "slide" | "slideIn" | "slideOut";
 }>;
-declare class Show extends NestedOption<IShowProps> {
-    static OptionName: string;
-}
-declare type ISortByGroupSummaryInfoProps = React.PropsWithChildren<{
+declare const _componentShow: React.MemoExoticComponent<(props: IShowProps) => React.FunctionComponentElement<IShowProps>>;
+declare const Show: typeof _componentShow & IElementDescriptor;
+type ISortByGroupSummaryInfoProps = React.PropsWithChildren<{
     groupColumn?: string;
     sortOrder?: "asc" | "desc";
     summaryItem?: number | string;
 }>;
-declare class SortByGroupSummaryInfo extends NestedOption<ISortByGroupSummaryInfoProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-}
-declare type ISortingProps = React.PropsWithChildren<{
+declare const _componentSortByGroupSummaryInfo: React.MemoExoticComponent<(props: ISortByGroupSummaryInfoProps) => React.FunctionComponentElement<ISortByGroupSummaryInfoProps>>;
+declare const SortByGroupSummaryInfo: typeof _componentSortByGroupSummaryInfo & IElementDescriptor;
+type ISortingProps = React.PropsWithChildren<{
     ascendingText?: string;
     clearText?: string;
     descendingText?: string;
     mode?: "single" | "multiple" | "none";
     showSortIndexes?: boolean;
 }>;
-declare class Sorting extends NestedOption<ISortingProps> {
-    static OptionName: string;
-}
-declare type IStateStoringProps = React.PropsWithChildren<{
+declare const _componentSorting: React.MemoExoticComponent<(props: ISortingProps) => React.FunctionComponentElement<ISortingProps>>;
+declare const Sorting: typeof _componentSorting & IElementDescriptor;
+type IStateStoringProps = React.PropsWithChildren<{
     customLoad?: (() => any);
     customSave?: ((gridState: any) => void);
     enabled?: boolean;
@@ -2344,10 +1663,9 @@ declare type IStateStoringProps = React.PropsWithChildren<{
     storageKey?: string;
     type?: "custom" | "localStorage" | "sessionStorage";
 }>;
-declare class StateStoring extends NestedOption<IStateStoringProps> {
-    static OptionName: string;
-}
-declare type IStringLengthRuleProps = React.PropsWithChildren<{
+declare const _componentStateStoring: React.MemoExoticComponent<(props: IStateStoringProps) => React.FunctionComponentElement<IStateStoringProps>>;
+declare const StateStoring: typeof _componentStateStoring & IElementDescriptor;
+type IStringLengthRuleProps = React.PropsWithChildren<{
     ignoreEmptyValue?: boolean;
     max?: number;
     message?: string;
@@ -2355,14 +1673,9 @@ declare type IStringLengthRuleProps = React.PropsWithChildren<{
     trim?: boolean;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
 }>;
-declare class StringLengthRule extends NestedOption<IStringLengthRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type ISummaryProps = React.PropsWithChildren<{
+declare const _componentStringLengthRule: React.MemoExoticComponent<(props: IStringLengthRuleProps) => React.FunctionComponentElement<IStringLengthRuleProps>>;
+declare const StringLengthRule: typeof _componentStringLengthRule & IElementDescriptor;
+type ISummaryProps = React.PropsWithChildren<{
     calculateCustomSummary?: ((options: {
         component: dxDataGrid;
         groupIndex: number;
@@ -2415,28 +1728,9 @@ declare type ISummaryProps = React.PropsWithChildren<{
         valueFormat?: LocalizationTypes.Format;
     }[];
 }>;
-declare class Summary extends NestedOption<ISummaryProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        groupItem: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        summaryTexts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        texts: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-        totalItem: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type ISummaryTextsProps = React.PropsWithChildren<{
+declare const _componentSummary: React.MemoExoticComponent<(props: ISummaryProps) => React.FunctionComponentElement<ISummaryProps>>;
+declare const Summary: typeof _componentSummary & IElementDescriptor;
+type ISummaryTextsProps = React.PropsWithChildren<{
     avg?: string;
     avgOtherColumn?: string;
     count?: string;
@@ -2447,10 +1741,9 @@ declare type ISummaryTextsProps = React.PropsWithChildren<{
     sum?: string;
     sumOtherColumn?: string;
 }>;
-declare class SummaryTexts extends NestedOption<ISummaryTextsProps> {
-    static OptionName: string;
-}
-declare type ITextsProps = React.PropsWithChildren<{
+declare const _componentSummaryTexts: React.MemoExoticComponent<(props: ISummaryTextsProps) => React.FunctionComponentElement<ISummaryTextsProps>>;
+declare const SummaryTexts: typeof _componentSummaryTexts & IElementDescriptor;
+type ITextsProps = React.PropsWithChildren<{
     addRow?: string;
     cancelAllChanges?: string;
     cancelRowChanges?: string;
@@ -2490,34 +1783,25 @@ declare type ITextsProps = React.PropsWithChildren<{
     emptyValue?: string;
     ok?: string;
 }>;
-declare class Texts extends NestedOption<ITextsProps> {
-    static OptionName: string;
-}
-declare type IToProps = React.PropsWithChildren<{
+declare const _componentTexts: React.MemoExoticComponent<(props: ITextsProps) => React.FunctionComponentElement<ITextsProps>>;
+declare const Texts: typeof _componentTexts & IElementDescriptor;
+type IToProps = React.PropsWithChildren<{
     left?: number;
     opacity?: number;
     position?: PositionConfig;
     scale?: number;
     top?: number;
 }>;
-declare class To extends NestedOption<IToProps> {
-    static OptionName: string;
-}
-declare type IToolbarProps = React.PropsWithChildren<{
+declare const _componentTo: React.MemoExoticComponent<(props: IToProps) => React.FunctionComponentElement<IToProps>>;
+declare const To: typeof _componentTo & IElementDescriptor;
+type IToolbarProps = React.PropsWithChildren<{
     disabled?: boolean;
     items?: Array<dxDataGridToolbarItem | "addRowButton" | "applyFilterButton" | "columnChooserButton" | "exportButton" | "groupPanel" | "revertButton" | "saveButton" | "searchPanel">;
     visible?: boolean;
 }>;
-declare class Toolbar extends NestedOption<IToolbarProps> {
-    static OptionName: string;
-    static ExpectedChildren: {
-        item: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IToolbarItemProps = React.PropsWithChildren<{
+declare const _componentToolbar: React.MemoExoticComponent<(props: IToolbarProps) => React.FunctionComponentElement<IToolbarProps>>;
+declare const Toolbar: typeof _componentToolbar & IElementDescriptor;
+type IToolbarItemProps = React.PropsWithChildren<{
     cssClass?: string;
     disabled?: boolean;
     html?: string;
@@ -2533,22 +1817,12 @@ declare type IToolbarItemProps = React.PropsWithChildren<{
     widget?: "dxAutocomplete" | "dxButton" | "dxButtonGroup" | "dxCheckBox" | "dxDateBox" | "dxDropDownButton" | "dxMenu" | "dxSelectBox" | "dxSwitch" | "dxTabs" | "dxTextBox";
     menuItemRender?: (...params: any) => React.ReactNode;
     menuItemComponent?: React.ComponentType<any>;
-    menuItemKeyFn?: (data: any) => string;
     render?: (...params: any) => React.ReactNode;
     component?: React.ComponentType<any>;
-    keyFn?: (data: any) => string;
-}>;
-declare class ToolbarItem extends NestedOption<IToolbarItemProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static TemplateProps: {
-        tmplOption: string;
-        render: string;
-        component: string;
-        keyFn: string;
-    }[];
-}
-declare type ITotalItemProps = React.PropsWithChildren<{
+}>;
+declare const _componentToolbarItem: React.MemoExoticComponent<(props: IToolbarItemProps) => React.FunctionComponentElement<IToolbarItemProps>>;
+declare const ToolbarItem: typeof _componentToolbarItem & IElementDescriptor;
+type ITotalItemProps = React.PropsWithChildren<{
     alignment?: "center" | "left" | "right";
     column?: string;
     cssClass?: string;
@@ -2563,17 +1837,9 @@ declare type ITotalItemProps = React.PropsWithChildren<{
     summaryType?: "avg" | "count" | "custom" | "max" | "min" | "sum";
     valueFormat?: LocalizationTypes.Format;
 }>;
-declare class TotalItem extends NestedOption<ITotalItemProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static ExpectedChildren: {
-        valueFormat: {
-            optionName: string;
-            isCollectionItem: boolean;
-        };
-    };
-}
-declare type IValidationRuleProps = React.PropsWithChildren<{
+declare const _componentTotalItem: React.MemoExoticComponent<(props: ITotalItemProps) => React.FunctionComponentElement<ITotalItemProps>>;
+declare const TotalItem: typeof _componentTotalItem & IElementDescriptor;
+type IValidationRuleProps = React.PropsWithChildren<{
     message?: string;
     trim?: boolean;
     type?: "required" | "numeric" | "range" | "stringLength" | "custom" | "compare" | "pattern" | "email" | "async";
@@ -2593,14 +1859,9 @@ declare type IValidationRuleProps = React.PropsWithChildren<{
     comparisonType?: "!=" | "!==" | "<" | "<=" | "==" | "===" | ">" | ">=";
     pattern?: RegExp | string;
 }>;
-declare class ValidationRule extends NestedOption<IValidationRuleProps> {
-    static OptionName: string;
-    static IsCollectionItem: boolean;
-    static PredefinedProps: {
-        type: string;
-    };
-}
-declare type IValueFormatProps = React.PropsWithChildren<{
+declare const _componentValidationRule: React.MemoExoticComponent<(props: IValidationRuleProps) => React.FunctionComponentElement<IValidationRuleProps>>;
+declare const ValidationRule: typeof _componentValidationRule & IElementDescriptor;
+type IValueFormatProps = React.PropsWithChildren<{
     currency?: string;
     formatter?: ((value: number | Date) => string);
     parser?: ((value: string) => number | Date);
@@ -2608,10 +1869,9 @@ declare type IValueFormatProps = React.PropsWithChildren<{
     type?: "billions" | "currency" | "day" | "decimal" | "exponential" | "fixedPoint" | "largeNumber" | "longDate" | "longTime" | "millions" | "millisecond" | "month" | "monthAndDay" | "monthAndYear" | "percent" | "quarter" | "quarterAndYear" | "shortDate" | "shortTime" | "thousands" | "trillions" | "year" | "dayOfWeek" | "hour" | "longDateLongTime" | "minute" | "second" | "shortDateShortTime";
     useCurrencyAccountingStyle?: boolean;
 }>;
-declare class ValueFormat extends NestedOption<IValueFormatProps> {
-    static OptionName: string;
-}
+declare const _componentValueFormat: React.MemoExoticComponent<(props: IValueFormatProps) => React.FunctionComponentElement<IValueFormatProps>>;
+declare const ValueFormat: typeof _componentValueFormat & IElementDescriptor;
 export default DataGrid;
-export { DataGrid, IDataGridOptions, Animation, IAnimationProps, AsyncRule, IAsyncRuleProps, At, IAtProps, BoundaryOffset, IBoundaryOffsetProps, Button, IButtonProps, Change, IChangeProps, ColCountByScreen, IColCountByScreenProps, Collision, ICollisionProps, Column, IColumnProps, ColumnChooser, IColumnChooserProps, ColumnChooserSearch, IColumnChooserSearchProps, ColumnChooserSelection, IColumnChooserSelectionProps, ColumnFixing, IColumnFixingProps, ColumnFixingTexts, IColumnFixingTextsProps, ColumnHeaderFilter, IColumnHeaderFilterProps, ColumnHeaderFilterSearch, IColumnHeaderFilterSearchProps, ColumnLookup, IColumnLookupProps, CompareRule, ICompareRuleProps, CursorOffset, ICursorOffsetProps, CustomOperation, ICustomOperationProps, CustomRule, ICustomRuleProps, DataGridHeaderFilter, IDataGridHeaderFilterProps, DataGridHeaderFilterSearch, IDataGridHeaderFilterSearchProps, DataGridHeaderFilterTexts, IDataGridHeaderFilterTextsProps, DataGridSelection, IDataGridSelectionProps, Editing, IEditingProps, EditingTexts, IEditingTextsProps, EmailRule, IEmailRuleProps, Export, IExportProps, ExportTexts, IExportTextsProps, Field, IFieldProps, FieldLookup, IFieldLookupProps, FilterBuilder, IFilterBuilderProps, FilterBuilderPopup, IFilterBuilderPopupProps, FilterOperationDescriptions, IFilterOperationDescriptionsProps, FilterPanel, IFilterPanelProps, FilterPanelTexts, IFilterPanelTextsProps, FilterRow, IFilterRowProps, Form, IFormProps, Format, IFormatProps, FormItem, IFormItemProps, From, IFromProps, Grouping, IGroupingProps, GroupingTexts, IGroupingTextsProps, GroupItem, IGroupItemProps, GroupOperationDescriptions, IGroupOperationDescriptionsProps, GroupPanel, IGroupPanelProps, HeaderFilter, IHeaderFilterProps, Hide, IHideProps, Item, IItemProps, KeyboardNavigation, IKeyboardNavigationProps, Label, ILabelProps, LoadPanel, ILoadPanelProps, Lookup, ILookupProps, MasterDetail, IMasterDetailProps, My, IMyProps, NumericRule, INumericRuleProps, Offset, IOffsetProps, OperationDescriptions, IOperationDescriptionsProps, Pager, IPagerProps, Paging, IPagingProps, PatternRule, IPatternRuleProps, Popup, IPopupProps, Position, IPositionProps, RangeRule, IRangeRuleProps, RemoteOperations, IRemoteOperationsProps, RequiredRule, IRequiredRuleProps, RowDragging, IRowDraggingProps, Scrolling, IScrollingProps, Search, ISearchProps, SearchPanel, ISearchPanelProps, Selection, ISelectionProps, Show, IShowProps, SortByGroupSummaryInfo, ISortByGroupSummaryInfoProps, Sorting, ISortingProps, StateStoring, IStateStoringProps, StringLengthRule, IStringLengthRuleProps, Summary, ISummaryProps, SummaryTexts, ISummaryTextsProps, Texts, ITextsProps, To, IToProps, Toolbar, IToolbarProps, ToolbarItem, IToolbarItemProps, TotalItem, ITotalItemProps, ValidationRule, IValidationRuleProps, ValueFormat, IValueFormatProps };
+export { DataGrid, IDataGridOptions, DataGridRef, Animation, IAnimationProps, AsyncRule, IAsyncRuleProps, At, IAtProps, BoundaryOffset, IBoundaryOffsetProps, Button, IButtonProps, Change, IChangeProps, ColCountByScreen, IColCountByScreenProps, Collision, ICollisionProps, Column, IColumnProps, ColumnChooser, IColumnChooserProps, ColumnChooserSearch, IColumnChooserSearchProps, ColumnChooserSelection, IColumnChooserSelectionProps, ColumnFixing, IColumnFixingProps, ColumnFixingTexts, IColumnFixingTextsProps, ColumnHeaderFilter, IColumnHeaderFilterProps, ColumnHeaderFilterSearch, IColumnHeaderFilterSearchProps, ColumnLookup, IColumnLookupProps, CompareRule, ICompareRuleProps, CursorOffset, ICursorOffsetProps, CustomOperation, ICustomOperationProps, CustomRule, ICustomRuleProps, DataGridHeaderFilter, IDataGridHeaderFilterProps, DataGridHeaderFilterSearch, IDataGridHeaderFilterSearchProps, DataGridHeaderFilterTexts, IDataGridHeaderFilterTextsProps, DataGridSelection, IDataGridSelectionProps, Editing, IEditingProps, EditingTexts, IEditingTextsProps, EmailRule, IEmailRuleProps, Export, IExportProps, ExportTexts, IExportTextsProps, Field, IFieldProps, FieldLookup, IFieldLookupProps, FilterBuilder, IFilterBuilderProps, FilterBuilderPopup, IFilterBuilderPopupProps, FilterOperationDescriptions, IFilterOperationDescriptionsProps, FilterPanel, IFilterPanelProps, FilterPanelTexts, IFilterPanelTextsProps, FilterRow, IFilterRowProps, Form, IFormProps, Format, IFormatProps, FormItem, IFormItemProps, From, IFromProps, Grouping, IGroupingProps, GroupingTexts, IGroupingTextsProps, GroupItem, IGroupItemProps, GroupOperationDescriptions, IGroupOperationDescriptionsProps, GroupPanel, IGroupPanelProps, HeaderFilter, IHeaderFilterProps, Hide, IHideProps, Item, IItemProps, KeyboardNavigation, IKeyboardNavigationProps, Label, ILabelProps, LoadPanel, ILoadPanelProps, Lookup, ILookupProps, MasterDetail, IMasterDetailProps, My, IMyProps, NumericRule, INumericRuleProps, Offset, IOffsetProps, OperationDescriptions, IOperationDescriptionsProps, Pager, IPagerProps, Paging, IPagingProps, PatternRule, IPatternRuleProps, Popup, IPopupProps, Position, IPositionProps, RangeRule, IRangeRuleProps, RemoteOperations, IRemoteOperationsProps, RequiredRule, IRequiredRuleProps, RowDragging, IRowDraggingProps, Scrolling, IScrollingProps, Search, ISearchProps, SearchPanel, ISearchPanelProps, Selection, ISelectionProps, Show, IShowProps, SortByGroupSummaryInfo, ISortByGroupSummaryInfoProps, Sorting, ISortingProps, StateStoring, IStateStoringProps, StringLengthRule, IStringLengthRuleProps, Summary, ISummaryProps, SummaryTexts, ISummaryTextsProps, Texts, ITextsProps, To, IToProps, Toolbar, IToolbarProps, ToolbarItem, IToolbarItemProps, TotalItem, ITotalItemProps, ValidationRule, IValidationRuleProps, ValueFormat, IValueFormatProps };
 import type * as DataGridTypes from 'devextreme/ui/data_grid_types';
 export { DataGridTypes };