devextreme-react/cjs/color-box.d.ts

DevExtreme React UI and Visualization Components

/*!
 * 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 dxColorBox, { Properties } from "devextreme/ui/color_box";
import { IHtmlOptions, NestedComponentMeta } from "./core/component";
import type { ChangeEvent, ClosedEvent, CopyEvent, CutEvent, DisposingEvent, EnterKeyEvent, FocusInEvent, FocusOutEvent, InitializedEvent, InputEvent, KeyDownEvent, KeyUpEvent, OpenedEvent, PasteEvent, ValueChangedEvent } from "devextreme/ui/color_box";
import type { DisposingEvent as ButtonDisposingEvent, InitializedEvent as ButtonInitializedEvent, dxButtonOptions, ClickEvent, ContentReadyEvent, OptionChangedEvent } from "devextreme/ui/button";
import type { AnimationConfig, CollisionResolution, PositionConfig, AnimationState, AnimationType, CollisionResolutionCombination } from "devextreme/common/core/animation";
import type { HorizontalAlignment, VerticalAlignment, TextEditorButtonLocation, template, PositionAlignment, Direction, ButtonStyle, ButtonType, ToolbarItemLocation, ToolbarItemComponent } from "devextreme/common";
import type { event } from "devextreme/events/events.types";
import type { EventInfo } from "devextreme/common/core/events";
import type { Component } from "devextreme/core/component";
import type { dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup";
import type { LocateInMenuMode, ShowTextMode } from "devextreme/ui/toolbar";
import type { CollectionWidgetItem } from "devextreme/ui/collection/ui.collection_widget.base";
import type dxOverlay from "devextreme/ui/overlay";
import type DOMComponent from "devextreme/core/dom_component";
import type dxPopup from "devextreme/ui/popup";
type ReplaceFieldTypes<TSource, TReplacement> = {
    [P in keyof TSource]: P extends keyof TReplacement ? TReplacement[P] : TSource[P];
};
type IColorBoxOptionsNarrowedEvents = {
    onChange?: ((e: ChangeEvent) => void);
    onClosed?: ((e: ClosedEvent) => void);
    onCopy?: ((e: CopyEvent) => void);
    onCut?: ((e: CutEvent) => void);
    onDisposing?: ((e: DisposingEvent) => void);
    onEnterKey?: ((e: EnterKeyEvent) => void);
    onFocusIn?: ((e: FocusInEvent) => void);
    onFocusOut?: ((e: FocusOutEvent) => void);
    onInitialized?: ((e: InitializedEvent) => void);
    onInput?: ((e: InputEvent) => void);
    onKeyDown?: ((e: KeyDownEvent) => void);
    onKeyUp?: ((e: KeyUpEvent) => void);
    onOpened?: ((e: OpenedEvent) => void);
    onPaste?: ((e: PasteEvent) => void);
    onValueChanged?: ((e: ValueChangedEvent) => void);
};
type IColorBoxOptions = React.PropsWithChildren<ReplaceFieldTypes<Properties, IColorBoxOptionsNarrowedEvents> & IHtmlOptions & {
    dropDownButtonRender?: (...params: any) => React.ReactNode;
    dropDownButtonComponent?: React.ComponentType<any>;
    fieldRender?: (...params: any) => React.ReactNode;
    fieldComponent?: React.ComponentType<any>;
    defaultOpened?: boolean;
    defaultValue?: string;
    onOpenedChange?: (value: boolean) => void;
    onValueChange?: (value: string) => void;
}>;
interface ColorBoxRef {
    instance: () => dxColorBox;
}
declare const ColorBox: (props: React.PropsWithChildren<IColorBoxOptions> & {
    ref?: Ref<ColorBoxRef>;
}) => 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 IButtonProps = React.PropsWithChildren<{
    location?: TextEditorButtonLocation;
    name?: string | undefined;
    options?: dxButtonOptions | undefined;
}>;
declare const Button: ((props: IButtonProps) => React.FunctionComponentElement<React.PropsWithChildren<{
    location?: TextEditorButtonLocation | undefined;
    name?: string | undefined;
    options?: dxButtonOptions | 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<{
    accessKey?: string | undefined;
    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;
    dragAndResizeArea?: any | string | undefined;
    dragEnabled?: boolean;
    dragOutsideBoundary?: boolean;
    enableBodyScroll?: boolean;
    focusStateEnabled?: boolean;
    fullScreen?: boolean;
    height?: (() => number | string) | number | string;
    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: EventInfo<any>) => void);
    onDisposing?: ((e: EventInfo<any>) => void);
    onHidden?: ((e: EventInfo<any>) => void);
    onHiding?: ((e: {
        cancel: boolean | any;
        component: dxOverlay<any>;
        element: any;
        model: any;
    }) => void);
    onInitialized?: ((e: {
        component: Component<any>;
        element: any;
    }) => void);
    onOptionChanged?: ((e: {
        component: DOMComponent;
        element: any;
        fullName: string;
        model: any;
        name: string;
        previousValue: any;
        value: any;
    }) => void);
    onResize?: ((e: {
        component: dxPopup;
        element: any;
        event: event;
        height: number;
        model: any;
        width: number;
    }) => void);
    onResizeEnd?: ((e: {
        component: dxPopup;
        element: any;
        event: event;
        height: number;
        model: any;
        width: number;
    }) => void);
    onResizeStart?: ((e: {
        component: dxPopup;
        element: any;
        event: event;
        height: number;
        model: any;
        width: number;
    }) => void);
    onShowing?: ((e: {
        cancel: boolean | any;
        component: dxOverlay<any>;
        element: any;
        model: any;
    }) => void);
    onShown?: ((e: EventInfo<any>) => void);
    onTitleRendered?: ((e: {
        component: dxPopup;
        element: any;
        model: any;
        titleElement: any;
    }) => void);
    position?: (() => void) | PositionAlignment | PositionConfig;
    resizeEnabled?: boolean;
    restorePosition?: boolean;
    rtlEnabled?: boolean;
    shading?: boolean;
    shadingColor?: string;
    showCloseButton?: boolean;
    showTitle?: boolean;
    tabIndex?: number;
    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?: (() => void) | PositionAlignment | PositionConfig;
    onPositionChange?: (value: (() => void) | PositionAlignment | 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<{
    accessKey?: string | undefined;
    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;
    dragAndResizeArea?: any | string | undefined;
    dragEnabled?: boolean | undefined;
    dragOutsideBoundary?: boolean | undefined;
    enableBodyScroll?: boolean | undefined;
    focusStateEnabled?: boolean | undefined;
    fullScreen?: boolean | undefined;
    height?: string | number | (() => number | 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: EventInfo<any>) => void) | undefined;
    onDisposing?: ((e: EventInfo<any>) => void) | undefined;
    onHidden?: ((e: EventInfo<any>) => void) | undefined;
    onHiding?: ((e: {
        cancel: boolean | any;
        component: dxOverlay<any>;
        element: any;
        model: any;
    }) => void) | undefined;
    onInitialized?: ((e: {
        component: Component<any>;
        element: any;
    }) => void) | undefined;
    onOptionChanged?: ((e: {
        component: DOMComponent;
        element: any;
        fullName: string;
        model: any;
        name: string;
        previousValue: any;
        value: any;
    }) => void) | undefined;
    onResize?: ((e: {
        component: dxPopup;
        element: any;
        event: event;
        height: number;
        model: any;
        width: number;
    }) => void) | undefined;
    onResizeEnd?: ((e: {
        component: dxPopup;
        element: any;
        event: event;
        height: number;
        model: any;
        width: number;
    }) => void) | undefined;
    onResizeStart?: ((e: {
        component: dxPopup;
        element: any;
        event: event;
        height: number;
        model: any;
        width: number;
    }) => void) | undefined;
    onShowing?: ((e: {
        cancel: boolean | any;
        component: dxOverlay<any>;
        element: any;
        model: any;
    }) => void) | undefined;
    onShown?: ((e: EventInfo<any>) => void) | undefined;
    onTitleRendered?: ((e: {
        component: dxPopup;
        element: any;
        model: any;
        titleElement: any;
    }) => void) | undefined;
    position?: PositionAlignment | PositionConfig | (() => void) | undefined;
    resizeEnabled?: boolean | undefined;
    restorePosition?: boolean | undefined;
    rtlEnabled?: boolean | undefined;
    shading?: boolean | undefined;
    shadingColor?: string | undefined;
    showCloseButton?: boolean | undefined;
    showTitle?: boolean | undefined;
    tabIndex?: number | 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?: PositionAlignment | PositionConfig | (() => void) | undefined;
    onPositionChange?: ((value: (() => void) | PositionAlignment | 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 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 IOptionsProps = React.PropsWithChildren<{
    accessKey?: string | undefined;
    activeStateEnabled?: boolean;
    bindingOptions?: Record<string, any>;
    disabled?: boolean;
    elementAttr?: Record<string, any>;
    focusStateEnabled?: boolean;
    height?: (() => number | string) | number | string | undefined;
    hint?: string | undefined;
    hoverStateEnabled?: boolean;
    icon?: string;
    onClick?: ((e: ClickEvent) => void);
    onContentReady?: ((e: ContentReadyEvent) => void);
    onDisposing?: ((e: ButtonDisposingEvent) => void);
    onInitialized?: ((e: ButtonInitializedEvent) => 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) | number | string | undefined;
    render?: (...params: any) => React.ReactNode;
    component?: React.ComponentType<any>;
}>;
declare const Options: ((props: IOptionsProps) => React.FunctionComponentElement<React.PropsWithChildren<{
    accessKey?: string | undefined;
    activeStateEnabled?: boolean | undefined;
    bindingOptions?: Record<string, any> | undefined;
    disabled?: boolean | undefined;
    elementAttr?: Record<string, any> | undefined;
    focusStateEnabled?: boolean | undefined;
    height?: (() => number | string) | number | string | undefined;
    hint?: string | undefined;
    hoverStateEnabled?: boolean | undefined;
    icon?: string | undefined;
    onClick?: ((e: ClickEvent) => void) | undefined;
    onContentReady?: ((e: ContentReadyEvent) => void) | undefined;
    onDisposing?: ((e: ButtonDisposingEvent) => void) | undefined;
    onInitialized?: ((e: ButtonInitializedEvent) => 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) | 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 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 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 ColorBox;
export { ColorBox, IColorBoxOptions, ColorBoxRef, Animation, IAnimationProps, At, IAtProps, BoundaryOffset, IBoundaryOffsetProps, Button, IButtonProps, Collision, ICollisionProps, DropDownOptions, IDropDownOptionsProps, From, IFromProps, Hide, IHideProps, My, IMyProps, Offset, IOffsetProps, Options, IOptionsProps, Position, IPositionProps, Show, IShowProps, To, IToProps, ToolbarItem, IToolbarItemProps };
import type * as ColorBoxTypes from 'devextreme/ui/color_box_types';
export { ColorBoxTypes };