devextreme-react
Version:
DevExtreme React UI and Visualization Components
499 lines (497 loc) • 21.7 kB
TypeScript
/*!
* devextreme-react
* Version: 24.2.6
* Build date: Mon Mar 17 2025
*
* Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED
*
* This software may be modified and distributed under the terms
* of the MIT license. See the LICENSE file in the root of the project for details.
*
* https://github.com/DevExpress/devextreme-react
*/
import * as React from "react";
import { Ref, ReactElement } from "react";
import dxLookup, { Properties } from "devextreme/ui/lookup";
import { IHtmlOptions, NestedComponentMeta } from "./core/component";
import type { ClosedEvent, ContentReadyEvent, DisposingEvent, InitializedEvent, ItemClickEvent, OpenedEvent, PageLoadingEvent, PullRefreshEvent, ScrollEvent, ValueChangedEvent } from "devextreme/ui/lookup";
import type { ContentReadyEvent as PopoverContentReadyEvent, DisposingEvent as PopoverDisposingEvent, InitializedEvent as PopoverInitializedEvent, HiddenEvent, HidingEvent, OptionChangedEvent, ShowingEvent, ShownEvent, TitleRenderedEvent } from "devextreme/ui/popover";
import type { AnimationConfig, CollisionResolution, PositionConfig, AnimationState, AnimationType, CollisionResolutionCombination } from "devextreme/common/core/animation";
import type { HorizontalAlignment, VerticalAlignment, template, Position as CommonPosition, Direction, PositionAlignment, ToolbarItemLocation, ToolbarItemComponent } from "devextreme/common";
import type { event } from "devextreme/events/events.types";
import type { dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup";
import type { CollectionWidgetItem } from "devextreme/ui/collection/ui.collection_widget.base";
import type { LocateInMenuMode, ShowTextMode } from "devextreme/ui/toolbar";
type ReplaceFieldTypes<TSource, TReplacement> = {
[P in keyof TSource]: P extends keyof TReplacement ? TReplacement[P] : TSource[P];
};
type ILookupOptionsNarrowedEvents = {
onClosed?: ((e: ClosedEvent) => void);
onContentReady?: ((e: ContentReadyEvent) => void);
onDisposing?: ((e: DisposingEvent) => void);
onInitialized?: ((e: InitializedEvent) => void);
onItemClick?: ((e: ItemClickEvent) => void);
onOpened?: ((e: OpenedEvent) => void);
onPageLoading?: ((e: PageLoadingEvent) => void);
onPullRefresh?: ((e: PullRefreshEvent) => void);
onScroll?: ((e: ScrollEvent) => void);
onValueChanged?: ((e: ValueChangedEvent) => void);
};
type ILookupOptions = React.PropsWithChildren<ReplaceFieldTypes<Properties, ILookupOptionsNarrowedEvents> & IHtmlOptions & {
fieldRender?: (...params: any) => React.ReactNode;
fieldComponent?: React.ComponentType<any>;
groupRender?: (...params: any) => React.ReactNode;
groupComponent?: React.ComponentType<any>;
itemRender?: (...params: any) => React.ReactNode;
itemComponent?: React.ComponentType<any>;
defaultOpened?: boolean;
defaultValue?: any;
onOpenedChange?: (value: boolean) => void;
onValueChange?: (value: any) => void;
}>;
interface LookupRef {
instance: () => dxLookup;
}
declare const Lookup: (props: React.PropsWithChildren<ILookupOptions> & {
ref?: Ref<LookupRef>;
}) => ReactElement | null;
type IAnimationProps = React.PropsWithChildren<{
hide?: AnimationConfig;
show?: AnimationConfig;
}>;
declare const Animation: ((props: IAnimationProps) => React.FunctionComponentElement<React.PropsWithChildren<{
hide?: AnimationConfig | undefined;
show?: AnimationConfig | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type 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 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 IDropDownOptionsProps = React.PropsWithChildren<{
animation?: Record<string, any> | {
hide?: AnimationConfig;
show?: AnimationConfig;
};
bindingOptions?: Record<string, any>;
closeOnOutsideClick?: boolean | ((event: event) => boolean);
container?: any | string | undefined;
contentTemplate?: ((contentElement: any) => string | any) | template;
deferRendering?: boolean;
disabled?: boolean;
enableBodyScroll?: boolean;
height?: (() => number | string) | number | string;
hideEvent?: Record<string, any> | string | undefined | {
delay?: number | undefined;
name?: string | undefined;
};
hideOnOutsideClick?: boolean | ((event: event) => boolean);
hideOnParentScroll?: boolean;
hint?: string | undefined;
hoverStateEnabled?: boolean;
maxHeight?: (() => number | string) | number | string;
maxWidth?: (() => number | string) | number | string;
minHeight?: (() => number | string) | number | string;
minWidth?: (() => number | string) | number | string;
onContentReady?: ((e: PopoverContentReadyEvent) => void);
onDisposing?: ((e: PopoverDisposingEvent) => void);
onHidden?: ((e: HiddenEvent) => void);
onHiding?: ((e: HidingEvent) => void);
onInitialized?: ((e: PopoverInitializedEvent) => void);
onOptionChanged?: ((e: OptionChangedEvent) => void);
onShowing?: ((e: ShowingEvent) => void);
onShown?: ((e: ShownEvent) => void);
onTitleRendered?: ((e: TitleRenderedEvent) => void);
position?: CommonPosition | PositionConfig;
rtlEnabled?: boolean;
shading?: boolean;
shadingColor?: string;
showCloseButton?: boolean;
showEvent?: Record<string, any> | string | undefined | {
delay?: number | undefined;
name?: string | undefined;
};
showTitle?: boolean;
target?: any | string | undefined;
title?: string;
titleTemplate?: ((titleElement: any) => string | any) | template;
toolbarItems?: Array<dxPopupToolbarItem>;
visible?: boolean;
width?: (() => number | string) | number | string;
wrapperAttr?: any;
defaultHeight?: (() => number | string) | number | string;
onHeightChange?: (value: (() => number | string) | number | string) => void;
defaultPosition?: CommonPosition | PositionConfig;
onPositionChange?: (value: CommonPosition | PositionConfig) => void;
defaultVisible?: boolean;
onVisibleChange?: (value: boolean) => void;
defaultWidth?: (() => number | string) | number | string;
onWidthChange?: (value: (() => number | string) | number | string) => void;
contentRender?: (...params: any) => React.ReactNode;
contentComponent?: React.ComponentType<any>;
titleRender?: (...params: any) => React.ReactNode;
titleComponent?: React.ComponentType<any>;
}>;
declare const DropDownOptions: ((props: IDropDownOptionsProps) => React.FunctionComponentElement<React.PropsWithChildren<{
animation?: Record<string, any> | {
hide?: AnimationConfig | undefined;
show?: AnimationConfig | undefined;
} | undefined;
bindingOptions?: Record<string, any> | undefined;
closeOnOutsideClick?: boolean | ((event: event) => boolean) | undefined;
container?: any | string | undefined;
contentTemplate?: template | ((contentElement: any) => string | any) | undefined;
deferRendering?: boolean | undefined;
disabled?: boolean | undefined;
enableBodyScroll?: boolean | undefined;
height?: string | number | (() => number | string) | undefined;
hideEvent?: Record<string, any> | string | undefined | {
delay?: number | undefined;
name?: string | undefined;
};
hideOnOutsideClick?: boolean | ((event: event) => boolean) | undefined;
hideOnParentScroll?: boolean | undefined;
hint?: string | undefined;
hoverStateEnabled?: boolean | undefined;
maxHeight?: string | number | (() => number | string) | undefined;
maxWidth?: string | number | (() => number | string) | undefined;
minHeight?: string | number | (() => number | string) | undefined;
minWidth?: string | number | (() => number | string) | undefined;
onContentReady?: ((e: PopoverContentReadyEvent) => void) | undefined;
onDisposing?: ((e: PopoverDisposingEvent) => void) | undefined;
onHidden?: ((e: HiddenEvent) => void) | undefined;
onHiding?: ((e: HidingEvent) => void) | undefined;
onInitialized?: ((e: PopoverInitializedEvent) => void) | undefined;
onOptionChanged?: ((e: OptionChangedEvent) => void) | undefined;
onShowing?: ((e: ShowingEvent) => void) | undefined;
onShown?: ((e: ShownEvent) => void) | undefined;
onTitleRendered?: ((e: TitleRenderedEvent) => void) | undefined;
position?: CommonPosition | PositionConfig | undefined;
rtlEnabled?: boolean | undefined;
shading?: boolean | undefined;
shadingColor?: string | undefined;
showCloseButton?: boolean | undefined;
showEvent?: Record<string, any> | string | undefined | {
delay?: number | undefined;
name?: string | undefined;
};
showTitle?: boolean | undefined;
target?: any | string | undefined;
title?: string | undefined;
titleTemplate?: template | ((titleElement: any) => string | any) | undefined;
toolbarItems?: import("devextreme/ui/popup").ToolbarItem[] | undefined;
visible?: boolean | undefined;
width?: string | number | (() => number | string) | undefined;
wrapperAttr?: any;
defaultHeight?: string | number | (() => number | string) | undefined;
onHeightChange?: ((value: (() => number | string) | number | string) => void) | undefined;
defaultPosition?: CommonPosition | PositionConfig | undefined;
onPositionChange?: ((value: CommonPosition | PositionConfig) => void) | undefined;
defaultVisible?: boolean | undefined;
onVisibleChange?: ((value: boolean) => void) | undefined;
defaultWidth?: string | number | (() => number | string) | undefined;
onWidthChange?: ((value: (() => number | string) | number | string) => void) | undefined;
contentRender?: ((...params: any) => React.ReactNode) | undefined;
contentComponent?: React.ComponentType<any> | undefined;
titleRender?: ((...params: any) => React.ReactNode) | undefined;
titleComponent?: React.ComponentType<any> | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IFromProps = React.PropsWithChildren<{
left?: number;
opacity?: number;
position?: PositionConfig;
scale?: number;
top?: number;
}>;
declare const From: ((props: IFromProps) => React.FunctionComponentElement<React.PropsWithChildren<{
left?: number | undefined;
opacity?: number | undefined;
position?: PositionConfig | undefined;
scale?: number | undefined;
top?: number | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IHideProps = React.PropsWithChildren<{
complete?: (($element: any, config: AnimationConfig) => void);
delay?: number;
direction?: Direction | undefined;
duration?: number;
easing?: string;
from?: AnimationState;
staggerDelay?: number | undefined;
start?: (($element: any, config: AnimationConfig) => void);
to?: AnimationState;
type?: AnimationType;
}>;
declare const Hide: ((props: IHideProps) => React.FunctionComponentElement<React.PropsWithChildren<{
complete?: (($element: any, config: AnimationConfig) => void) | undefined;
delay?: number | undefined;
direction?: Direction | undefined;
duration?: number | undefined;
easing?: string | undefined;
from?: AnimationState | undefined;
staggerDelay?: number | undefined;
start?: (($element: any, config: AnimationConfig) => void) | undefined;
to?: AnimationState | undefined;
type?: AnimationType | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IHideEventProps = React.PropsWithChildren<{
delay?: number | undefined;
name?: string | undefined;
}>;
declare const HideEvent: ((props: IHideEventProps) => React.FunctionComponentElement<React.PropsWithChildren<{
delay?: number | undefined;
name?: string | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IItemProps = React.PropsWithChildren<{
disabled?: boolean;
html?: string;
template?: ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | template;
text?: string;
visible?: boolean;
render?: (...params: any) => React.ReactNode;
component?: React.ComponentType<any>;
}>;
declare const Item: ((props: IItemProps) => React.FunctionComponentElement<React.PropsWithChildren<{
disabled?: boolean | undefined;
html?: string | undefined;
template?: template | ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | undefined;
text?: string | 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 IMyProps = React.PropsWithChildren<{
x?: HorizontalAlignment;
y?: VerticalAlignment;
}>;
declare const My: ((props: IMyProps) => React.FunctionComponentElement<React.PropsWithChildren<{
x?: HorizontalAlignment | undefined;
y?: VerticalAlignment | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IOffsetProps = React.PropsWithChildren<{
x?: number;
y?: number;
}>;
declare const Offset: ((props: IOffsetProps) => React.FunctionComponentElement<React.PropsWithChildren<{
x?: number | undefined;
y?: number | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IPositionProps = React.PropsWithChildren<{
at?: Record<string, any> | PositionAlignment | {
x?: HorizontalAlignment;
y?: VerticalAlignment;
};
boundary?: any | string;
boundaryOffset?: Record<string, any> | string | {
x?: number;
y?: number;
};
collision?: CollisionResolutionCombination | Record<string, any> | {
x?: CollisionResolution;
y?: CollisionResolution;
};
my?: Record<string, any> | PositionAlignment | {
x?: HorizontalAlignment;
y?: VerticalAlignment;
};
of?: any | string;
offset?: Record<string, any> | string | {
x?: number;
y?: number;
};
}>;
declare const Position: ((props: IPositionProps) => React.FunctionComponentElement<React.PropsWithChildren<{
at?: Record<string, any> | PositionAlignment | {
x?: HorizontalAlignment | undefined;
y?: VerticalAlignment | undefined;
} | undefined;
boundary?: any | string;
boundaryOffset?: string | Record<string, any> | {
x?: number | undefined;
y?: number | undefined;
} | undefined;
collision?: Record<string, any> | CollisionResolutionCombination | {
x?: CollisionResolution | undefined;
y?: CollisionResolution | undefined;
} | undefined;
my?: Record<string, any> | PositionAlignment | {
x?: HorizontalAlignment | undefined;
y?: VerticalAlignment | undefined;
} | undefined;
of?: any | string;
offset?: string | Record<string, any> | {
x?: number | undefined;
y?: number | undefined;
} | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IShowProps = React.PropsWithChildren<{
complete?: (($element: any, config: AnimationConfig) => void);
delay?: number;
direction?: Direction | undefined;
duration?: number;
easing?: string;
from?: AnimationState;
staggerDelay?: number | undefined;
start?: (($element: any, config: AnimationConfig) => void);
to?: AnimationState;
type?: AnimationType;
}>;
declare const Show: ((props: IShowProps) => React.FunctionComponentElement<React.PropsWithChildren<{
complete?: (($element: any, config: AnimationConfig) => void) | undefined;
delay?: number | undefined;
direction?: Direction | undefined;
duration?: number | undefined;
easing?: string | undefined;
from?: AnimationState | undefined;
staggerDelay?: number | undefined;
start?: (($element: any, config: AnimationConfig) => void) | undefined;
to?: AnimationState | undefined;
type?: AnimationType | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IShowEventProps = React.PropsWithChildren<{
delay?: number | undefined;
name?: string | undefined;
}>;
declare const ShowEvent: ((props: IShowEventProps) => React.FunctionComponentElement<React.PropsWithChildren<{
delay?: number | undefined;
name?: string | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IToProps = React.PropsWithChildren<{
left?: number;
opacity?: number;
position?: PositionConfig;
scale?: number;
top?: number;
}>;
declare const To: ((props: IToProps) => React.FunctionComponentElement<React.PropsWithChildren<{
left?: number | undefined;
opacity?: number | undefined;
position?: PositionConfig | undefined;
scale?: number | undefined;
top?: number | undefined;
} & {
children?: React.ReactNode;
} & {
elementDescriptor: import("./core/configuration/react/element").IElementDescriptor;
}>>) & NestedComponentMeta;
type IToolbarItemProps = React.PropsWithChildren<{
cssClass?: string | undefined;
disabled?: boolean;
html?: string;
locateInMenu?: LocateInMenuMode;
location?: ToolbarItemLocation;
menuItemTemplate?: (() => string | any) | template;
options?: any;
showText?: ShowTextMode;
template?: ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | template;
text?: string;
toolbar?: ToolbarLocation;
visible?: boolean;
widget?: ToolbarItemComponent;
menuItemRender?: (...params: any) => React.ReactNode;
menuItemComponent?: React.ComponentType<any>;
render?: (...params: any) => React.ReactNode;
component?: React.ComponentType<any>;
}>;
declare const ToolbarItem: ((props: IToolbarItemProps) => React.FunctionComponentElement<React.PropsWithChildren<{
cssClass?: string | undefined;
disabled?: boolean | undefined;
html?: string | undefined;
locateInMenu?: LocateInMenuMode | undefined;
location?: ToolbarItemLocation | undefined;
menuItemTemplate?: template | (() => string | any) | undefined;
options?: any;
showText?: ShowTextMode | undefined;
template?: template | ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | undefined;
text?: string | undefined;
toolbar?: ToolbarLocation | 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;
export default Lookup;
export { Lookup, ILookupOptions, LookupRef, Animation, IAnimationProps, At, IAtProps, BoundaryOffset, IBoundaryOffsetProps, Collision, ICollisionProps, DropDownOptions, IDropDownOptionsProps, From, IFromProps, Hide, IHideProps, HideEvent, IHideEventProps, Item, IItemProps, My, IMyProps, Offset, IOffsetProps, Position, IPositionProps, Show, IShowProps, ShowEvent, IShowEventProps, To, IToProps, ToolbarItem, IToolbarItemProps };
import type * as LookupTypes from 'devextreme/ui/lookup_types';
export { LookupTypes };