devextreme-react
Version:
DevExtreme React UI and Visualization Components
1,058 lines (1,057 loc) • 124 kB
TypeScript
/*!
* devextreme-react
* Version: 25.2.3
* Build date: Fri Dec 12 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/card_view";
import * as React from "react";
import { Ref, ReactElement } from "react";
import dxCardView, { Properties } from "devextreme/ui/card_view";
import { IHtmlOptions, NestedComponentMeta } from "./core/component";
import type { CardClickEvent, CardDblClickEvent, CardInsertedEvent, CardInsertingEvent, CardPreparedEvent, CardRemovedEvent, CardRemovingEvent, CardUpdatedEvent, CardUpdatingEvent, ContextMenuPreparingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, FieldCaptionClickEvent, FieldCaptionDblClickEvent, FieldCaptionPreparedEvent, FieldValueClickEvent, FieldValueDblClickEvent, FieldValuePreparedEvent, InitNewCardEvent, SavedEvent, SavingEvent, CardTemplateData, CardHeaderItem as CardViewCardHeaderItem, CardHeaderPredefinedItem, FieldTemplateData, ColumnTemplateData, EditingTexts as CardViewEditingTexts, PredefinedToolbarItem, dxCardViewToolbarItem } from "devextreme/ui/card_view";
import type { AnimationConfig, CollisionResolution, PositionConfig, AnimationState, AnimationType, CollisionResolutionCombination } from "devextreme/common/core/animation";
import type { ValidationRuleType, HorizontalAlignment, VerticalAlignment, ButtonStyle, template, ButtonType, ToolbarItemLocation, ToolbarItemComponent, SearchMode, SingleMultipleOrNone, SelectAllMode, DataType, Format as CommonFormat, SortOrder, ComparisonOperator, DragHighlight, Mode, Direction, PositionAlignment, DisplayMode, ScrollbarMode, TabsIconPosition, TabsStyle, Position as CommonPosition } from "devextreme/common";
import type { dxButtonOptions, ClickEvent, ContentReadyEvent, DisposingEvent, InitializedEvent, OptionChangedEvent } from "devextreme/ui/button";
import type { FormItemType, FormPredefinedButtonItem, ContentReadyEvent as FormContentReadyEvent, DisposingEvent as FormDisposingEvent, InitializedEvent as FormInitializedEvent, OptionChangedEvent as FormOptionChangedEvent, dxFormSimpleItem, dxFormOptions, dxFormGroupItem, dxFormTabbedItem, dxFormEmptyItem, dxFormButtonItem, LabelLocation, FormLabelMode, EditorEnterKeyEvent, FieldDataChangedEvent, SmartPastedEvent, SmartPastingEvent, FormItemComponent } from "devextreme/ui/form";
import type { ContentReadyEvent as FilterBuilderContentReadyEvent, DisposingEvent as FilterBuilderDisposingEvent, InitializedEvent as FilterBuilderInitializedEvent, OptionChangedEvent as FilterBuilderOptionChangedEvent, dxFilterBuilderField, FieldInfo, FilterBuilderOperation, dxFilterBuilderCustomOperation, GroupOperation, EditorPreparedEvent, EditorPreparingEvent, ValueChangedEvent } from "devextreme/ui/filter_builder";
import type { ContentReadyEvent as LoadPanelContentReadyEvent, DisposingEvent as LoadPanelDisposingEvent, InitializedEvent as LoadPanelInitializedEvent, OptionChangedEvent as LoadPanelOptionChangedEvent, LoadPanelIndicatorProperties, HiddenEvent, HidingEvent, ShowingEvent, ShownEvent } from "devextreme/ui/load_panel";
import type { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, OptionChangedEvent as TabPanelOptionChangedEvent, dxTabPanelOptions, dxTabPanelItem, ItemClickEvent, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, SelectionChangedEvent, SelectionChangingEvent, TitleClickEvent, TitleHoldEvent, TitleRenderedEvent } from "devextreme/ui/tab_panel";
import type { LocateInMenuMode, ShowTextMode } from "devextreme/ui/toolbar";
import type { CollectionWidgetItem } from "devextreme/ui/collection/ui.collection_widget.base";
import type { HeaderFilterSearchConfig, HeaderFilterTexts, SelectionColumnDisplayMode, DataChangeType, FilterType, ColumnHeaderFilter as GridsColumnHeaderFilter, ColumnChooserMode, ColumnChooserSearchConfig, ColumnChooserSelectionConfig, HeaderFilterGroupInterval, ColumnHeaderFilterSearchConfig, DataChange, FilterPanel as GridsFilterPanel, FilterPanelTexts as GridsFilterPanelTexts, PagerPageSize } from "devextreme/common/grids";
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 { AIIntegration } from "devextreme/common/ai-integration";
import type { LoadingAnimationType } from "devextreme/ui/load_indicator";
import type { event } from "devextreme/events/events.types";
import type dxForm from "devextreme/ui/form";
import type DataSource from "devextreme/data/data_source";
import type * as CommonTypes from "devextreme/common";
type ReplaceFieldTypes<TSource, TReplacement> = {
[P in keyof TSource]: P extends keyof TReplacement ? TReplacement[P] : TSource[P];
};
type ICardViewOptionsNarrowedEvents<TCardData = any, TKey = any> = {
onCardClick?: ((e: CardClickEvent) => void);
onCardDblClick?: ((e: CardDblClickEvent) => void);
onCardInserted?: ((e: CardInsertedEvent<TCardData>) => void);
onCardInserting?: ((e: CardInsertingEvent<TCardData>) => void);
onCardPrepared?: ((e: CardPreparedEvent) => void);
onCardRemoved?: ((e: CardRemovedEvent<TCardData, TKey>) => void);
onCardRemoving?: ((e: CardRemovingEvent<TCardData, TKey>) => void);
onCardUpdated?: ((e: CardUpdatedEvent<TCardData, TKey>) => void);
onCardUpdating?: ((e: CardUpdatingEvent<TCardData, TKey>) => void);
onContextMenuPreparing?: ((e: ContextMenuPreparingEvent<TCardData>) => void);
onEditCanceled?: ((e: EditCanceledEvent) => void);
onEditCanceling?: ((e: EditCancelingEvent) => void);
onEditingStart?: ((e: EditingStartEvent<TCardData, TKey>) => void);
onFieldCaptionClick?: ((e: FieldCaptionClickEvent) => void);
onFieldCaptionDblClick?: ((e: FieldCaptionDblClickEvent) => void);
onFieldCaptionPrepared?: ((e: FieldCaptionPreparedEvent) => void);
onFieldValueClick?: ((e: FieldValueClickEvent) => void);
onFieldValueDblClick?: ((e: FieldValueDblClickEvent) => void);
onFieldValuePrepared?: ((e: FieldValuePreparedEvent) => void);
onInitNewCard?: ((e: InitNewCardEvent<TCardData>) => void);
onSaved?: ((e: SavedEvent) => void);
onSaving?: ((e: SavingEvent) => void);
};
type ICardViewOptions<TCardData = any, TKey = any> = React.PropsWithChildren<ReplaceFieldTypes<Properties<TCardData, TKey>, ICardViewOptionsNarrowedEvents<TCardData, TKey>> & IHtmlOptions & {
dataSource?: Properties<TCardData, TKey>["dataSource"];
cardContentRender?: (...params: any) => React.ReactNode;
cardContentComponent?: React.ComponentType<any>;
cardFooterRender?: (...params: any) => React.ReactNode;
cardFooterComponent?: React.ComponentType<any>;
cardRender?: (...params: any) => React.ReactNode;
cardComponent?: React.ComponentType<any>;
noDataRender?: (...params: any) => React.ReactNode;
noDataComponent?: React.ComponentType<any>;
defaultFilterValue?: Array<any> | (() => any) | string;
defaultSelectedCardKeys?: Array<any>;
onFilterValueChange?: (value: Array<any> | (() => any) | string) => void;
onSelectedCardKeysChange?: (value: Array<any>) => void;
}>;
interface CardViewRef<TCardData = any, TKey = any> {
instance: () => dxCardView<TCardData, TKey>;
}
declare const CardView: <TCardData = any, TKey = any>(props: ReplaceFieldTypes<Properties<TCardData, TKey>, ICardViewOptionsNarrowedEvents<TCardData, TKey>> & IHtmlOptions & {
dataSource?: import("devextreme/data/data_source").DataSourceLike<TCardData, TKey> | undefined;
cardContentRender?: ((...params: any) => React.ReactNode) | undefined;
cardContentComponent?: React.ComponentType<any> | undefined;
cardFooterRender?: ((...params: any) => React.ReactNode) | undefined;
cardFooterComponent?: React.ComponentType<any> | undefined;
cardRender?: ((...params: any) => React.ReactNode) | undefined;
cardComponent?: React.ComponentType<any> | undefined;
noDataRender?: ((...params: any) => React.ReactNode) | undefined;
noDataComponent?: React.ComponentType<any> | undefined;
defaultFilterValue?: string | any[] | (() => any) | undefined;
defaultSelectedCardKeys?: any[] | undefined;
onFilterValueChange?: ((value: Array<any> | (() => any) | string) => void) | undefined;
onSelectedCardKeysChange?: ((value: Array<any>) => void) | undefined;
} & {
children?: React.ReactNode;
} & {
ref?: React.Ref<CardViewRef<TCardData, TKey>> | undefined;
}) => ReactElement | null;
type IAIOptionsProps = React.PropsWithChildren<{
disabled?: boolean;
instruction?: string | undefined;
}>;
declare const AIOptions: ((props: IAIOptionsProps) => React.FunctionComponentElement<React.PropsWithChildren<{
disabled?: boolean | undefined;
instruction?: string | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
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 IButtonItemProps = React.PropsWithChildren<{
buttonOptions?: dxButtonOptions | undefined;
colSpan?: number | undefined;
cssClass?: string | undefined;
horizontalAlignment?: HorizontalAlignment;
itemType?: FormItemType;
name?: FormPredefinedButtonItem | string | undefined;
verticalAlignment?: VerticalAlignment;
visible?: boolean;
visibleIndex?: number | undefined;
}>;
declare const ButtonItem: ((props: IButtonItemProps) => React.FunctionComponentElement<React.PropsWithChildren<{
buttonOptions?: dxButtonOptions | undefined;
colSpan?: number | undefined;
cssClass?: string | undefined;
horizontalAlignment?: HorizontalAlignment | undefined;
itemType?: FormItemType | undefined;
name?: FormPredefinedButtonItem | string | undefined;
verticalAlignment?: VerticalAlignment | undefined;
visible?: boolean | undefined;
visibleIndex?: number | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IButtonOptionsProps = React.PropsWithChildren<{
accessKey?: string | undefined;
activeStateEnabled?: boolean;
disabled?: boolean;
elementAttr?: Record<string, any>;
focusStateEnabled?: boolean;
height?: number | string | undefined;
hint?: string | undefined;
hoverStateEnabled?: boolean;
icon?: string;
onClick?: ((e: ClickEvent) => void);
onContentReady?: ((e: ContentReadyEvent) => void);
onDisposing?: ((e: DisposingEvent) => void);
onInitialized?: ((e: InitializedEvent) => void);
onOptionChanged?: ((e: OptionChangedEvent) => void);
rtlEnabled?: boolean;
stylingMode?: ButtonStyle;
tabIndex?: number;
template?: ((buttonData: {
icon: string;
text: string;
}, contentElement: any) => string | any) | template;
text?: string;
type?: ButtonType | string;
useSubmitBehavior?: boolean;
validationGroup?: string | undefined;
visible?: boolean;
width?: number | string | undefined;
render?: (...params: any) => React.ReactNode;
component?: React.ComponentType<any>;
}>;
declare const ButtonOptions: ((props: IButtonOptionsProps) => React.FunctionComponentElement<React.PropsWithChildren<{
accessKey?: string | undefined;
activeStateEnabled?: boolean | undefined;
disabled?: boolean | undefined;
elementAttr?: Record<string, any> | undefined;
focusStateEnabled?: boolean | undefined;
height?: number | string | undefined;
hint?: string | undefined;
hoverStateEnabled?: boolean | undefined;
icon?: string | undefined;
onClick?: ((e: ClickEvent) => void) | undefined;
onContentReady?: ((e: ContentReadyEvent) => void) | undefined;
onDisposing?: ((e: DisposingEvent) => void) | undefined;
onInitialized?: ((e: InitializedEvent) => void) | undefined;
onOptionChanged?: ((e: OptionChangedEvent) => void) | undefined;
rtlEnabled?: boolean | undefined;
stylingMode?: ButtonStyle | undefined;
tabIndex?: number | undefined;
template?: template | ((buttonData: {
icon: string;
text: string;
}, contentElement: any) => string | any) | undefined;
text?: string | undefined;
type?: string | undefined;
useSubmitBehavior?: boolean | undefined;
validationGroup?: string | undefined;
visible?: boolean | undefined;
width?: number | string | undefined;
render?: ((...params: any) => React.ReactNode) | undefined;
component?: React.ComponentType<any> | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type ICardCoverProps = React.PropsWithChildren<{
altExpr?: ((data: any) => string) | string;
aspectRatio?: string;
imageExpr?: ((data: any) => string) | string;
maxHeight?: number;
template?: ((data: CardTemplateData, container: any) => string | any) | template;
render?: (...params: any) => React.ReactNode;
component?: React.ComponentType<any>;
}>;
declare const CardCover: ((props: ICardCoverProps) => React.FunctionComponentElement<React.PropsWithChildren<{
altExpr?: string | ((data: any) => string) | undefined;
aspectRatio?: string | undefined;
imageExpr?: string | ((data: any) => string) | undefined;
maxHeight?: number | undefined;
template?: template | ((data: CardTemplateData, container: any) => string | any) | undefined;
render?: ((...params: any) => React.ReactNode) | undefined;
component?: React.ComponentType<any> | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type ICardHeaderProps = React.PropsWithChildren<{
items?: Array<CardViewCardHeaderItem | CardHeaderPredefinedItem>;
template?: ((data: CardTemplateData) => string | any) | template;
visible?: boolean;
render?: (...params: any) => React.ReactNode;
component?: React.ComponentType<any>;
}>;
declare const CardHeader: ((props: ICardHeaderProps) => React.FunctionComponentElement<React.PropsWithChildren<{
items?: (CardViewCardHeaderItem | CardHeaderPredefinedItem)[] | undefined;
template?: template | ((data: CardTemplateData) => string | any) | undefined;
visible?: 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 ICardHeaderItemProps = React.PropsWithChildren<{
cssClass?: string | undefined;
disabled?: boolean;
html?: string;
locateInMenu?: LocateInMenuMode;
location?: ToolbarItemLocation;
menuItemTemplate?: (() => string | any) | template;
name?: CardHeaderPredefinedItem | string;
options?: any;
showText?: ShowTextMode;
template?: ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | template;
text?: string;
visible?: boolean;
widget?: ToolbarItemComponent;
menuItemRender?: (...params: any) => React.ReactNode;
menuItemComponent?: React.ComponentType<any>;
render?: (...params: any) => React.ReactNode;
component?: React.ComponentType<any>;
}>;
declare const CardHeaderItem: ((props: ICardHeaderItemProps) => React.FunctionComponentElement<React.PropsWithChildren<{
cssClass?: string | undefined;
disabled?: boolean | undefined;
html?: string | undefined;
locateInMenu?: LocateInMenuMode | undefined;
location?: ToolbarItemLocation | undefined;
menuItemTemplate?: template | (() => string | any) | undefined;
name?: string | undefined;
options?: any;
showText?: ShowTextMode | undefined;
template?: template | ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | undefined;
text?: string | undefined;
visible?: boolean | undefined;
widget?: ToolbarItemComponent | undefined;
menuItemRender?: ((...params: any) => React.ReactNode) | undefined;
menuItemComponent?: React.ComponentType<any> | undefined;
render?: ((...params: any) => React.ReactNode) | undefined;
component?: React.ComponentType<any> | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type ICardViewHeaderFilterProps = React.PropsWithChildren<{
allowSearch?: boolean;
allowSelectAll?: boolean;
height?: number | string;
search?: HeaderFilterSearchConfig;
searchTimeout?: number;
texts?: HeaderFilterTexts;
visible?: boolean;
width?: number | string;
}>;
declare const CardViewHeaderFilter: ((props: ICardViewHeaderFilterProps) => React.FunctionComponentElement<React.PropsWithChildren<{
allowSearch?: boolean | undefined;
allowSelectAll?: boolean | undefined;
height?: string | number | undefined;
search?: HeaderFilterSearchConfig | undefined;
searchTimeout?: number | undefined;
texts?: HeaderFilterTexts | undefined;
visible?: boolean | undefined;
width?: string | number | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type ICardViewHeaderFilterSearchProps = React.PropsWithChildren<{
editorOptions?: any;
enabled?: boolean;
mode?: SearchMode;
timeout?: number;
}>;
declare const CardViewHeaderFilterSearch: ((props: ICardViewHeaderFilterSearchProps) => 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 ICardViewHeaderFilterTextsProps = React.PropsWithChildren<{
cancel?: string;
emptyValue?: string;
ok?: string;
}>;
declare const CardViewHeaderFilterTexts: ((props: ICardViewHeaderFilterTextsProps) => 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 ICardViewSelectionProps = React.PropsWithChildren<{
allowSelectAll?: boolean;
mode?: SingleMultipleOrNone;
selectAllMode?: SelectAllMode;
showCheckBoxesMode?: SelectionColumnDisplayMode;
}>;
declare const CardViewSelection: ((props: ICardViewSelectionProps) => React.FunctionComponentElement<React.PropsWithChildren<{
allowSelectAll?: boolean | undefined;
mode?: SingleMultipleOrNone | undefined;
selectAllMode?: SelectAllMode | undefined;
showCheckBoxesMode?: SelectionColumnDisplayMode | 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;
allowFiltering?: boolean;
allowHeaderFiltering?: boolean;
allowHiding?: boolean;
allowReordering?: boolean;
allowSearch?: boolean;
allowSorting?: boolean;
calculateDisplayValue?: ((cardData: any) => any);
calculateFieldValue?: ((cardData: any) => any);
calculateFilterExpression?: ((filterValue: any, selectedFilterOperation: string | null, target: string) => string | Array<any> | (() => void));
calculateSortValue?: ((cardData: any) => any) | string;
caption?: string | undefined;
customizeText?: ((fieldInfo: {
groupInterval: string | number;
target: string;
value: any;
valueText: string;
}) => string);
dataField?: string | undefined;
dataType?: DataType | undefined;
editorOptions?: any;
falseText?: string;
fieldCaptionTemplate?: ((data: FieldTemplateData, container: any) => string | any) | template;
fieldTemplate?: ((data: FieldTemplateData, container: any) => string | any) | template;
fieldValueTemplate?: ((data: FieldTemplateData, container: any) => string | any) | template;
filterType?: FilterType;
filterValue?: any | undefined;
filterValues?: Array<any>;
format?: LocalizationFormat;
formItem?: dxFormSimpleItem;
headerFilter?: GridsColumnHeaderFilter | undefined;
headerItemCssClass?: string;
headerItemTemplate?: ((data: ColumnTemplateData, container: any) => string | any) | template;
name?: string | undefined;
setFieldValue?: ((newData: any, value: any, currentCardData: any) => any);
showInColumnChooser?: boolean;
sortIndex?: number | undefined;
sortingMethod?: ((value1: any, value2: any) => number) | undefined;
sortOrder?: SortOrder | undefined;
trueText?: string;
validationRules?: Array<CommonTypes.ValidationRule>;
visible?: boolean;
visibleIndex?: number | undefined;
defaultFilterValue?: any | undefined;
onFilterValueChange?: (value: any | undefined) => void;
defaultFilterValues?: Array<any>;
onFilterValuesChange?: (value: Array<any>) => 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;
fieldCaptionRender?: (...params: any) => React.ReactNode;
fieldCaptionComponent?: React.ComponentType<any>;
fieldRender?: (...params: any) => React.ReactNode;
fieldComponent?: React.ComponentType<any>;
fieldValueRender?: (...params: any) => React.ReactNode;
fieldValueComponent?: React.ComponentType<any>;
headerItemRender?: (...params: any) => React.ReactNode;
headerItemComponent?: React.ComponentType<any>;
}>;
declare const Column: ((props: IColumnProps) => React.FunctionComponentElement<React.PropsWithChildren<{
alignment?: HorizontalAlignment | undefined;
allowEditing?: boolean | undefined;
allowFiltering?: boolean | undefined;
allowHeaderFiltering?: boolean | undefined;
allowHiding?: boolean | undefined;
allowReordering?: boolean | undefined;
allowSearch?: boolean | undefined;
allowSorting?: boolean | undefined;
calculateDisplayValue?: ((cardData: any) => any) | undefined;
calculateFieldValue?: ((cardData: any) => any) | undefined;
calculateFilterExpression?: ((filterValue: any, selectedFilterOperation: string | null, target: string) => string | Array<any> | (() => void)) | undefined;
calculateSortValue?: string | ((cardData: any) => any) | undefined;
caption?: string | undefined;
customizeText?: ((fieldInfo: {
groupInterval: string | number;
target: string;
value: any;
valueText: string;
}) => string) | undefined;
dataField?: string | undefined;
dataType?: DataType | undefined;
editorOptions?: any;
falseText?: string | undefined;
fieldCaptionTemplate?: template | ((data: FieldTemplateData, container: any) => string | any) | undefined;
fieldTemplate?: template | ((data: FieldTemplateData, container: any) => string | any) | undefined;
fieldValueTemplate?: template | ((data: FieldTemplateData, container: any) => string | any) | undefined;
filterType?: FilterType | undefined;
filterValue?: any | undefined;
filterValues?: any[] | undefined;
format?: LocalizationFormat;
formItem?: dxFormSimpleItem | undefined;
headerFilter?: GridsColumnHeaderFilter | undefined;
headerItemCssClass?: string | undefined;
headerItemTemplate?: template | ((data: ColumnTemplateData, container: any) => string | any) | undefined;
name?: string | undefined;
setFieldValue?: ((newData: any, value: any, currentCardData: any) => any) | undefined;
showInColumnChooser?: boolean | undefined;
sortIndex?: number | undefined;
sortingMethod?: ((value1: any, value2: any) => number) | undefined;
sortOrder?: SortOrder | undefined;
trueText?: string | undefined;
validationRules?: CommonTypes.ValidationRule[] | undefined;
visible?: boolean | undefined;
visibleIndex?: number | undefined;
defaultFilterValue?: any | undefined;
onFilterValueChange?: ((value: any | undefined) => void) | undefined;
defaultFilterValues?: any[] | undefined;
onFilterValuesChange?: ((value: Array<any>) => 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;
fieldCaptionRender?: ((...params: any) => React.ReactNode) | undefined;
fieldCaptionComponent?: React.ComponentType<any> | undefined;
fieldRender?: ((...params: any) => React.ReactNode) | undefined;
fieldComponent?: React.ComponentType<any> | undefined;
fieldValueRender?: ((...params: any) => React.ReactNode) | undefined;
fieldValueComponent?: React.ComponentType<any> | undefined;
headerItemRender?: ((...params: any) => React.ReactNode) | undefined;
headerItemComponent?: 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 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 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 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 IDraggingProps = React.PropsWithChildren<{
dropFeedbackMode?: DragHighlight;
onDragChange?: ((e: any) => void);
onDragEnd?: ((e: any) => void);
onDragMove?: ((e: any) => void);
onDragStart?: ((e: any) => void);
onRemove?: ((e: any) => void);
onReorder?: ((e: any) => void);
scrollSensitivity?: number;
scrollSpeed?: number;
}>;
declare const Dragging: ((props: IDraggingProps) => React.FunctionComponentElement<React.PropsWithChildren<{
dropFeedbackMode?: DragHighlight | undefined;
onDragChange?: ((e: any) => void) | undefined;
onDragEnd?: ((e: any) => void) | undefined;
onDragMove?: ((e: any) => void) | undefined;
onDragStart?: ((e: any) => void) | undefined;
onRemove?: ((e: any) => void) | undefined;
onReorder?: ((e: any) => void) | undefined;
scrollSensitivity?: number | undefined;
scrollSpeed?: number | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IEditingProps = React.PropsWithChildren<{
allowAdding?: boolean;
allowDeleting?: boolean;
allowUpdating?: boolean;
changes?: Array<DataChange>;
confirmDelete?: boolean;
editCardKey?: any;
form?: dxFormOptions;
popup?: Record<string, any>;
texts?: CardViewEditingTexts;
}>;
declare const Editing: ((props: IEditingProps) => React.FunctionComponentElement<React.PropsWithChildren<{
allowAdding?: boolean | undefined;
allowDeleting?: boolean | undefined;
allowUpdating?: boolean | undefined;
changes?: DataChange<any, any>[] | undefined;
confirmDelete?: boolean | undefined;
editCardKey?: any;
form?: dxFormOptions | undefined;
popup?: Record<string, any> | undefined;
texts?: CardViewEditingTexts | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IEditingTextsProps = React.PropsWithChildren<{
addCard?: string;
confirmDeleteMessage?: string;
confirmDeleteTitle?: string;
deleteCard?: string;
editCard?: string;
saveCard?: string;
}>;
declare const EditingTexts: ((props: IEditingTextsProps) => React.FunctionComponentElement<React.PropsWithChildren<{
addCard?: string | undefined;
confirmDeleteMessage?: string | undefined;
confirmDeleteTitle?: string | undefined;
deleteCard?: string | undefined;
editCard?: string | undefined;
saveCard?: string | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IEmailRuleProps = React.PropsWithChildren<{
ignoreEmptyValue?: boolean;
message?: string;
type?: ValidationRuleType;
}>;
declare const EmailRule: ((props: IEmailRuleProps) => React.FunctionComponentElement<React.PropsWithChildren<{
ignoreEmptyValue?: boolean | undefined;
message?: string | undefined;
type?: ValidationRuleType | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IEmptyItemProps = React.PropsWithChildren<{
colSpan?: number | undefined;
cssClass?: string | undefined;
itemType?: FormItemType;
name?: string | undefined;
visible?: boolean;
visibleIndex?: number | undefined;
}>;
declare const EmptyItem: ((props: IEmptyItemProps) => React.FunctionComponentElement<React.PropsWithChildren<{
colSpan?: number | undefined;
cssClass?: string | undefined;
itemType?: FormItemType | undefined;
name?: string | undefined;
visible?: boolean | undefined;
visibleIndex?: number | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IFieldProps = React.PropsWithChildren<{
calculateFilterExpression?: ((filterValue: any, selectedFilterOperation: string) => string | (() => any) | Array<any>);
caption?: string | undefined;
customizeText?: ((fieldInfo: FieldInfo) => string);
dataField?: string | undefined;
dataType?: DataType;
editorOptions?: any;
editorTemplate?: ((conditionInfo: {
field: dxFilterBuilderField;
filterOperation: string;
setValue: (() => void);
value: string | number | Date;
}, container: any) => string | any) | template;
falseText?: string;
filterOperations?: Array<FilterBuilderOperation | string>;
format?: LocalizationFormat;
lookup?: Record<string, any> | {
allowClearing?: boolean;
dataSource?: Array<any> | DataSourceOptions | Store | undefined;
displayExpr?: ((data: any) => string) | string | undefined;
valueExpr?: ((data: any) => string | number | boolean) | string | undefined;
};
name?: string | undefined;
trueText?: string;
editorRender?: (...params: any) => React.ReactNode;
editorComponent?: React.ComponentType<any>;
}>;
declare const Field: ((props: IFieldProps) => React.FunctionComponentElement<React.PropsWithChildren<{
calculateFilterExpression?: ((filterValue: any, selectedFilterOperation: string) => string | (() => any) | Array<any>) | undefined;
caption?: string | undefined;
customizeText?: ((fieldInfo: FieldInfo) => string) | undefined;
dataField?: string | undefined;
dataType?: DataType | undefined;
editorOptions?: any;
editorTemplate?: template | ((conditionInfo: {
field: dxFilterBuilderField;
filterOperation: string;
setValue: (() => void);
value: string | number | Date;
}, container: any) => string | any) | undefined;
falseText?: string | undefined;
filterOperations?: string[] | undefined;
format?: LocalizationFormat;
lookup?: Record<string, any> | {
allowClearing?: boolean | undefined;
dataSource?: Array<any> | DataSourceOptions | Store | undefined;
displayExpr?: string | ((data: any) => string) | undefined;
valueExpr?: string | ((data: any) => string | number | boolean) | undefined;
} | undefined;
name?: string | undefined;
trueText?: 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 IFilterBuilderProps = React.PropsWithChildren<{
accessKey?: string | undefined;
activeStateEnabled?: boolean;
allowHierarchicalFields?: boolean;
customOperations?: Array<dxFilterBuilderCustomOperation>;
disabled?: boolean;
elementAttr?: Record<string, any>;
fields?: Array<dxFilterBuilderField>;
filterOperationDescriptions?: Record<string, any> | {
between?: string;
contains?: string;
endsWith?: string;
equal?: string;
greaterThan?: string;
greaterThanOrEqual?: string;
isBlank?: string;
isNotBlank?: string;
lessThan?: string;
lessThanOrEqual?: string;
notContains?: string;
notEqual?: string;
startsWith?: string;
};
focusStateEnabled?: boolean;
groupOperationDescriptions?: Record<string, any> | {
and?: string;
notAnd?: string;
notOr?: string;
or?: string;
};
groupOperations?: Array<GroupOperation>;
height?: number | string | undefined;
hint?: string | undefined;
hoverStateEnabled?: boolean;
maxGroupLevel?: number | undefined;
onContentReady?: ((e: FilterBuilderContentReadyEvent) => void);
onDisposing?: ((e: FilterBuilderDisposingEvent) => void);
onEditorPrepared?: ((e: EditorPreparedEvent) => void);
onEditorPreparing?: ((e: EditorPreparingEvent) => void);
onInitialized?: ((e: FilterBuilderInitializedEvent) => void);
onOptionChanged?: ((e: FilterBuilderOptionChangedEvent) => void);
onValueChanged?: ((e: ValueChangedEvent) => void);
rtlEnabled?: boolean;
tabIndex?: number;
value?: Array<any> | (() => any) | string;
visible?: boolean;
width?: number | string | undefined;
defaultValue?: Array<any> | (() => any) | string;
onValueChange?: (value: Array<any> | (() => any) | string) => void;
}>;
declare const FilterBuilder: ((props: IFilterBuilderProps) => React.FunctionComponentElement<React.PropsWithChildren<{
accessKey?: string | undefined;
activeStateEnabled?: boolean | undefined;
allowHierarchicalFields?: boolean | undefined;
customOperations?: dxFilterBuilderCustomOperation[] | undefined;
disabled?: boolean | undefined;
elementAttr?: Record<string, any> | undefined;
fields?: dxFilterBuilderField[] | undefined;
filterOperationDescriptions?: Record<string, any> | {
between?: string | undefined;
contains?: string | undefined;
endsWith?: string | undefined;
equal?: string | undefined;
greaterThan?: string | undefined;
greaterThanOrEqual?: string | undefined;
isBlank?: string | undefined;
isNotBlank?: string | undefined;
lessThan?: string | undefined;
lessThanOrEqual?: string | undefined;
notContains?: string | undefined;
notEqual?: string | undefined;
startsWith?: string | undefined;
} | undefined;
focusStateEnabled?: boolean | undefined;
groupOperationDescriptions?: Record<string, any> | {
and?: string | undefined;
notAnd?: string | undefined;
notOr?: string | undefined;
or?: string | undefined;
} | undefined;
groupOperations?: GroupOperation[] | undefined;
height?: number | string | undefined;
hint?: string | undefined;
hoverStateEnabled?: boolean | undefined;
maxGroupLevel?: number | undefined;
onContentReady?: ((e: FilterBuilderContentReadyEvent) => void) | undefined;
onDisposing?: ((e: FilterBuilderDisposingEvent) => void) | undefined;
onEditorPrepared?: ((e: EditorPreparedEvent) => void) | undefined;
onEditorPreparing?: ((e: EditorPreparingEvent) => void) | undefined;
onInitialized?: ((