devextreme
Version:
HTML5 JavaScript Component Suite for Responsive Web Development
1,588 lines (1,577 loc) • 1.3 MB
TypeScript
/**
* DevExtreme (dx.all.d.ts)
* Version: 22.1.9
* Build date: Tue Apr 18 2023
*
* Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
declare global {
interface JQuery<TElement = HTMLElement> {}
interface JQueryEventObject {}
interface JQueryPromise<T> {}
}
declare module DevExpress {
/**
* Defines animation properties.
*/
export type AnimationConfig = {
/**
* A function called after animation is completed.
*/
complete?: (
$element: DevExpress.core.DxElement,
config: AnimationConfig
) => void;
/**
* A number specifying wait time before animation execution.
*/
delay?: number;
/**
* Specifies the animation direction for the 'slideIn' and 'slideOut' animation types.
*/
direction?: DevExpress.common.Direction;
/**
* A number specifying the time in milliseconds spent on animation.
*/
duration?: number;
/**
* A string specifying the easing function for animation.
*/
easing?: string;
/**
* Specifies an initial animation state. Use the to property to specify the final state.
*/
from?: DevExpress.animation.AnimationState;
/**
* A number specifying the time period to wait before the animation of the next stagger item starts.
*/
staggerDelay?: number;
/**
* A function called before animation is started.
*/
start?: (
$element: DevExpress.core.DxElement,
config: AnimationConfig
) => void;
/**
* Specifies a final animation state. Use the from property to specify an initial state.
*/
to?: DevExpress.animation.AnimationState;
/**
* A string value specifying the animation type.
*/
type?: DevExpress.animation.AnimationType;
};
/**
* A repository of animations.
*/
export const animationPresets: {
/**
* Applies the changes made in the animation repository.
*/
applyChanges(): void;
/**
* Removes all animations from the repository.
*/
clear(): void;
/**
* Deletes an animation with a specific name.
*/
clear(name: string): void;
/**
* Gets the configuration of an animation with a specific name.
*/
getPreset(name: string): AnimationConfig;
/**
* Registers predefined animations in the animation repository.
*/
registerDefaultPresets(): void;
/**
* Adds an animation with a specific name to the animation repository.
*/
registerPreset(
name: string,
config: { animation: AnimationConfig; device?: Device }
): void;
/**
* Deletes all custom animations.
*/
resetToDefaults(): void;
};
/**
* A base class for all components and UI components.
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export class Component<TProperties> {
constructor(options?: TProperties);
/**
* Prevents the UI component from refreshing until the endUpdate() method is called.
*/
beginUpdate(): void;
/**
* Refreshes the UI component after a call of the beginUpdate() method.
*/
endUpdate(): void;
/**
* Gets the UI component's instance. Use it to access other methods of the UI component.
*/
instance(): this;
/**
* Detaches all event handlers from a single event.
*/
off(eventName: string): this;
/**
* Detaches a particular event handler from a single event.
*/
off(eventName: string, eventHandler: Function): this;
/**
* Subscribes to an event.
*/
on(eventName: string, eventHandler: Function): this;
/**
* Subscribes to events.
*/
on(events: { [key: string]: Function }): this;
/**
* Gets all UI component properties.
*/
option(): TProperties;
/**
* Gets the value of a single property.
*/
option<TPropertyName extends string>(
optionName: TPropertyName
): TPropertyName extends keyof TProperties
? TProperties[TPropertyName]
: unknown;
/**
* Updates the value of a single property.
*/
option<TPropertyName extends string>(
optionName: TPropertyName,
optionValue: TPropertyName extends keyof TProperties
? TProperties[TPropertyName]
: unknown
): void;
/**
* Updates the values of several properties.
*/
option(options: Partial<TProperties>): void;
/**
* Resets a property to its default value.
*/
resetOption(optionName: string): void;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export interface ComponentOptions<
TDisposingEvent,
TInitializedEvent,
TOptionChangedEvent
> {
/**
* A function that is executed before the UI component is disposed of.
*/
onDisposing?: (e: TDisposingEvent) => void;
/**
* A function used in JavaScript frameworks to save the UI component instance.
*/
onInitialized?: (e: TInitializedEvent) => void;
/**
* A function that is executed after a UI component property is changed.
*/
onOptionChanged?: (e: TOptionChangedEvent) => void;
}
/**
* Gets the current global configuration.
*/
export function config(): globalConfig;
/**
* Configures your application before its launch.
*/
export function config(config: globalConfig): void;
/**
*
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export class DataHelperMixin {
/**
* Gets the DataSource instance.
*/
getDataSource(): DevExpress.data.DataSource;
}
/**
* The device object defines the device on which the application is running.
*/
export type Device = {
/**
* Indicates whether or not the device platform is Android.
*/
android?: boolean;
/**
* Specifies the type of the device on which the application is running.
*/
deviceType?: 'phone' | 'tablet' | 'desktop';
/**
* Indicates whether or not the device platform is generic, which means that the application will look and behave according to a generic 'light' or 'dark' theme.
*/
generic?: boolean;
/**
* Specifies a performance grade of the current device.
*/
grade?: 'A' | 'B' | 'C';
/**
* Indicates whether or not the device platform is iOS.
*/
ios?: boolean;
/**
* Indicates whether or not the device type is 'phone'.
*/
phone?: boolean;
/**
* Specifies the platform of the device on which the application is running.
*/
platform?: 'android' | 'ios' | 'generic';
/**
* Indicates whether or not the device type is 'tablet'.
*/
tablet?: boolean;
/**
* Specifies an array with the major and minor versions of the device platform.
*/
version?: Array<number>;
};
/**
*
*/
export const devices: DevicesObject;
/**
* An object that serves as a namespace for the methods and events specifying information on the current device.
*/
export class DevicesObject {
constructor(options?: { window?: Window });
/**
* Gets information on the current device.
*/
current(): Device;
/**
* Overrides actual device information to force the application to operate as if it was running on a specified device.
*/
current(deviceName: string | Device): void;
/**
* Detaches all event handlers from a single event.
*/
off(eventName: DevExpress.core.EventName): this;
/**
* Detaches a particular event handler from a single event.
*/
off(eventName: DevExpress.core.EventName, eventHandler: Function): this;
/**
* Subscribes to an event.
*/
on(eventName: DevExpress.core.EventName, eventHandler: Function): this;
/**
* Subscribes to events.
*/
on(events: { [key in DevExpress.core.EventName]?: Function }): this;
/**
* Returns the current device orientation.
*/
orientation(): 'portrait' | 'landscape' | undefined;
/**
* Returns real information about the current device regardless of the value passed to the DevExpress.devices.current(deviceName) method.
*/
real(): Device;
isSimulator(): boolean;
}
/**
* A base class for all components.
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export class DOMComponent<
TProperties = DevExpress.DOMComponent.Properties
> extends Component<TProperties> {
_templateManager: DevExpress.core.TemplateManager;
_cancelOptionChange?: string;
constructor(
element: DevExpress.core.UserDefinedElement,
options?: TProperties
);
/**
* Gets the instance of a UI component found using its DOM node.
*/
static getInstance(
element: DevExpress.core.UserDefinedElement
): DOMComponent<DevExpress.DOMComponent.Properties>;
/**
* Specifies the device-dependent default configuration properties for this component.
*/
static defaultOptions<TProperties = DevExpress.DOMComponent.Properties>(
rule: DevExpress.core.DefaultOptionsRule<TProperties>
): void;
/**
* Disposes of all the resources allocated to the widget instance.
*/
dispose(): void;
/**
* Gets the root UI component element.
*/
element(): DevExpress.core.DxElement;
$element(): DevExpress.core.UserDefinedElement;
_getTemplate(template: unknown): DevExpress.core.FunctionTemplate;
_invalidate(): void;
_refresh(): void;
_notifyOptionChanged(
fullName: string,
value: unknown,
previousValue: unknown
): void;
_createElement(element: HTMLElement): void;
}
module DOMComponent {
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
interface DOMComponentInstance extends DOMComponent<Properties> {}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
type OptionChangedEventInfo<TComponent> =
DevExpress.events.EventInfo<TComponent> &
DevExpress.events.ChangedOptionInfo;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
type Properties = DOMComponentOptions<DOMComponentInstance>;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export interface DOMComponentOptions<TComponent>
extends ComponentOptions<
DevExpress.events.EventInfo<TComponent>,
DevExpress.events.InitializedEventInfo<TComponent>,
DevExpress.DOMComponent.OptionChangedEventInfo<TComponent>
> {
/**
*
*/
bindingOptions?: { [key: string]: any };
/**
* Specifies the global attributes to be attached to the UI component's container element.
*/
elementAttr?: { [key: string]: any };
/**
* Specifies the UI component's height.
*/
height?: number | string | (() => number | string);
/**
* A function that is executed before the UI component is disposed of.
*/
onDisposing?: (e: DevExpress.events.EventInfo<TComponent>) => void;
/**
* A function that is executed after a UI component property is changed.
*/
onOptionChanged?: (
e: DevExpress.DOMComponent.OptionChangedEventInfo<TComponent>
) => void;
/**
* Switches the UI component to a right-to-left representation.
*/
rtlEnabled?: boolean;
/**
* Specifies the UI component's width.
*/
width?: number | string | (() => number | string);
}
/**
* A time zone object.
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export interface dxSchedulerTimeZone {
/**
* A time zone text string from the IANA database.
*/
id: string;
/**
* A GMT offset.
*/
offset: number;
/**
* A time zone in the following format: `(GMT ±[hh]:[mm]) [id]`.
*/
title: string;
}
/**
* The EndpointSelector is an object for managing OData endpoints in your application.
*/
export class EndpointSelector {
constructor(options: any);
/**
* Gets an endpoint with a specific key.
*/
urlFor(key: string): string;
}
/**
* Configures the load panel.
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export interface ExportLoadPanel {
/**
* Specifies whether the load panel is enabled.
*/
enabled?: boolean;
/**
* Specifies text displayed on the load panel.
*/
text?: string;
/**
* Specifies the width of the load panel in pixels.
*/
width?: number;
/**
* Specifies the height of the load panel in pixels.
*/
height?: number;
/**
* Specifies whether to show the loading indicator.
*/
showIndicator?: boolean;
/**
* Specifies a URL pointing to an image to be used as a loading indicator.
*/
indicatorSrc?: string;
/**
* Specifies whether to show the pane of the load panel.
*/
showPane?: boolean;
/**
* Specifies whether to shade the UI component when the load panel is shown.
*/
shading?: boolean;
/**
* Specifies the shading color. Applies only if shading is true.
*/
shadingColor?: string;
}
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
type ExternalFormat = never;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export interface FormatObject {
/**
* Specifies a 3-letter ISO 4217 code for currency. Applies only if the type is 'currency'.
*/
currency?: string;
/**
*
*/
useCurrencyAccountingStyle?: boolean;
/**
* A function that converts numeric or date-time values to a string.
*/
formatter?: (value: number | Date) => string;
/**
* Parses string values into numeric or date-time values. Should be used with formatter or one of the predefined formats.
*/
parser?: (value: string) => number | Date;
/**
* Specifies a precision for values of numeric or currency format types.
*/
precision?: number;
/**
* Specifies a predefined format. Does not apply if you have specified the formatter function.
*/
type?: DevExpress.common.Format | string;
}
/**
* An object that serves as a namespace for the methods that are used to animate UI elements.
*/
export const fx: {
/**
* Animates an element.
*/
animate(
element: Element,
config: AnimationConfig
): DevExpress.core.utils.DxPromise<void>;
/**
* Checks whether an element is being animated.
*/
isAnimating(element: Element): boolean;
/**
* Stops an element's animation.
*/
stop(element: Element, jumpToEnd: boolean): void;
};
/**
* Specifies settings that affect all DevExtreme UI components.
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export interface globalConfig {
/**
* A decimal separator. No longer applies.
* @deprecated
*/
decimalSeparator?: string;
/**
* The default currency. Accepts a 3-letter ISO 4217 code.
*/
defaultCurrency?: string;
/**
*
*/
defaultUseCurrencyAccountingStyle?: boolean;
/**
* Specifies how editors' text fields are styled in your application.
*/
editorStylingMode?: DevExpress.common.EditorStyle;
/**
* Configures a Floating Action Button (FAB) that emits a stack of related actions (speed dial).
*/
floatingActionButtonConfig?: {
/**
* Specifies the icon the FAB displays when the speed dial is opened.
*/
closeIcon?: string;
/**
* Specifies the direction in which to open the speed dial menu.
*/
direction?: DevExpress.core.FloatingActionButtonDirection;
/**
* Specifies the icon the FAB displays when the speed dial is closed.
*/
icon?: string;
/**
* Specifies the text label displayed inside the FAB.
*/
label?: string;
/**
* Limits the number of speed dial actions.
*/
maxSpeedDialActionCount?: number;
/**
* Positions the FAB on the screen.
*/
position?:
| DevExpress.common.PositionAlignment
| PositionConfig
| Function;
/**
* If true, the background should be shaded when the speed dial menu is open.
*/
shading?: boolean;
};
/**
* Specifies whether dates are parsed and serialized according to the ISO 8601 standard in all browsers.
*/
forceIsoDateParsing?: boolean;
/**
* Specifies whether to convert string values to lowercase in filter and search requests to OData services. Applies to the following operations: 'startswith', 'endswith', 'contains', and 'notcontains'.
*/
oDataFilterToLower?: boolean;
/**
* Specifies whether the UI components support a right-to-left representation. Available for individual UI components as well.
*/
rtlEnabled?: boolean;
/**
* The decimal separator that is used when submitting a value to the server.
*/
serverDecimalSeparator?: string;
/**
* A group separator. No longer applies.
* @deprecated
*/
thousandsSeparator?: string;
/**
*
*/
useLegacyStoreResult?: boolean;
/**
*
*/
useLegacyVisibleIndex?: boolean;
}
/**
* Hides the last displayed overlay UI component.
*/
export function hideTopOverlay(): boolean;
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export interface PdfExportGanttFont {
/**
*
*/
fontObject: object;
/**
*
*/
name: string;
/**
*
*/
style?: string;
/**
*
*/
weight?: string | number;
}
/**
* Configures the position of an overlay element.
*/
export interface PositionConfig {
/**
* Specifies the target element's side or corner where the overlay element should be positioned.
*/
at?:
| DevExpress.common.PositionAlignment
| {
/**
* Specifies a position in the horizontal direction (for left, right, or center alignment).
*/
x?: DevExpress.common.HorizontalAlignment;
/**
* Specifies a position in the vertical direction (for top, bottom, or center alignment).
*/
y?: DevExpress.common.VerticalAlignment;
};
/**
* A boundary element in which the overlay element must be positioned.
*/
boundary?: string | DevExpress.core.UserDefinedElement | Window;
/**
* Specifies the offset of boundaries from the boundary element.
*/
boundaryOffset?:
| string
| {
/**
* Specifies a horizontal offset.
*/
x?: number;
/**
* Specifies a vertical offset.
*/
y?: number;
};
/**
* Specifies how to resolve collisions - when the overlay element exceeds the boundary element.
*/
collision?:
| DevExpress.animation.CollisionResolutionCombination
| {
/**
* Specifies how to resolve horizontal collisions.
*/
x?: DevExpress.animation.CollisionResolution;
/**
* Specifies how to resolve vertical collisions.
*/
y?: DevExpress.animation.CollisionResolution;
};
/**
* Specifies the overlay element's side or corner to align with a target element.
*/
my?:
| DevExpress.common.PositionAlignment
| {
/**
* Specifies a position in the horizontal direction (for left, right, or center alignment).
*/
x?: DevExpress.common.HorizontalAlignment;
/**
* Specifies a position in the vertical direction (for top, bottom, or center alignment).
*/
y?: DevExpress.common.VerticalAlignment;
};
/**
* The target element relative to which the overlay element should be positioned.
*/
of?: string | DevExpress.core.UserDefinedElement | Window;
/**
* Specifies the overlay element's offset from a specified position.
*/
offset?:
| string
| {
/**
* Specifies a horizontal offset.
*/
x?: number;
/**
* Specifies a vertical offset.
*/
y?: number;
};
}
/**
* Registers a new component in the DevExpress.ui namespace.
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export function registerComponent<TComponent>(
name: string,
componentClass: DevExpress.core.ComponentFactory<TComponent>
): void;
/**
* Registers a new component in the specified namespace.
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export function registerComponent<TComponent>(
name: string,
namespace: {
[key: string]: DevExpress.core.ComponentFactory<DOMComponent>;
},
componentClass: DevExpress.core.ComponentFactory<TComponent>
): void;
/**
* Sets a supported template engine to use when using jQuery.
*/
export function setTemplateEngine(templateEngineName: string): void;
/**
* Sets custom functions that compile and render templates.
*/
export function setTemplateEngine(templateEngineOptions: {
compile?: Function;
render?: Function;
}): void;
/**
* The manager that performs several specified animations at a time.
*/
export class TransitionExecutor {
/**
* Registers the set of elements that should be animated as 'entering' using the specified animation configuration.
*/
enter(
elements: DevExpress.core.UserDefinedElementsArray,
animation: AnimationConfig | string
): void;
/**
* Registers a set of elements that should be animated as 'leaving' using the specified animation configuration.
*/
leave(
elements: DevExpress.core.UserDefinedElementsArray,
animation: AnimationConfig | string
): void;
/**
* Deletes all the animations registered in the Transition Executor by using the enter(elements, animation) and leave(elements, animation) methods.
*/
reset(): void;
/**
* Starts all the animations registered using the enter(elements, animation) and leave(elements, animation) methods beforehand.
*/
start(): DevExpress.core.utils.DxPromise<void>;
/**
* Stops all started animations.
*/
stop(): void;
}
/**
* An object that serves as a namespace for the methods required to perform validation.
*/
export class validationEngine {
/**
* Gets the default validation group.
*/
static getGroupConfig(): any;
/**
* Gets a validation group with a specific key.
*/
static getGroupConfig(group: string | any): any;
/**
* Registers all the Validator objects extending fields of the specified ViewModel.
*/
static registerModelForValidation(model: any): void;
/**
* Resets the values and validation result of the editors that belong to the default validation group.
*/
static resetGroup(): void;
/**
* Resets the values and validation result of the editors that belong to the specified validation group.
*/
static resetGroup(group: string | any): void;
/**
* Unregisters all the Validator objects extending fields of the specified ViewModel.
*/
static unregisterModelForValidation(model: any): void;
/**
* Validates editors from the default validation group.
*/
static validateGroup(): DevExpress.ui.dxValidationGroup.ValidationResult;
/**
* Validates editors from a specific validation group.
*/
static validateGroup(
group: string | any
): DevExpress.ui.dxValidationGroup.ValidationResult;
/**
* Validates a view model.
*/
static validateModel(model: any): any;
}
}
declare module DevExpress.animation {
/**
* @deprecated Use the AnimationConfig type instead
*/
export type animationConfig = AnimationConfig;
/**
* Describes an animation state.
*/
export type AnimationState =
| string
| number
| {
/**
* Element opacity.
*/
opacity: number;
}
| {
/**
* A value that controls element size.
*/
scale: number;
}
| {
/**
* Element position.
*/
position: PositionConfig;
}
| {
/**
* A shortcut that positions the element's left side relative to the parent element.
*/
left: number;
}
| {
/**
* A shortcut that positions the element's top side relative to the parent element.
*/
top: number;
};
/**
* @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
*/
export type AnimationType =
| 'css'
| 'fade'
| 'fadeIn'
| 'fadeOut'
| 'pop'
| 'slide'
| 'slideIn'
| 'slideOut';
export type CollisionResolution = 'fit' | 'flip' | 'flipfit' | 'none';
export type CollisionResolutionCombination =
| 'fit'
| 'fit flip'
| 'fit flipfit'
| 'fit none'
| 'flip'
| 'flip fit'
| 'flip none'
| 'flipfit'
| 'flipfit fit'
| 'flipfit none'
| 'none'
| 'none fit'
| 'none flip'
| 'none flipfit';
/**
* @deprecated Use the PositionConfig type instead
*/
export interface positionConfig extends PositionConfig {}
}
declare module DevExpress.common {
export type ApplyValueMode = 'instantly' | 'useButtons';
export type ButtonStyle = 'text' | 'outlined' | 'contained';
export type ButtonType = 'back' | 'danger' | 'default' | 'normal' | 'success';
export type DataStructure = 'plain' | 'tree';
export type DataType =
| 'string'
| 'number'
| 'date'
| 'boolean'
| 'object'
| 'datetime';
export type Direction = 'bottom' | 'left' | 'right' | 'top';
export type DragDirection = 'both' | 'horizontal' | 'vertical';
export type DragHighlight = 'push' | 'indicate';
export type EditorStyle = 'outlined' | 'underlined' | 'filled';
export type ExportFormat = 'GIF' | 'JPEG' | 'PDF' | 'PNG' | 'SVG';
export type FieldChooserLayout = 0 | 1 | 2;
export type FirstDayOfWeek = 0 | 1 | 2 | 3 | 4 | 5 | 6;
export type Format =
| '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';
export type HorizontalAlignment = 'center' | 'left' | 'right';
export type HorizontalEdge = 'left' | 'right';
export type LabelMode = 'static' | 'floating' | 'hidden';
export type MaskMode = 'always' | 'onFocus';
export type Mode = 'auto';
export type Orientation = 'horizontal' | 'vertical';
export type PageLoadMode = 'nextButton' | 'scrollBottom';
export type PageOrientation = 'portrait' | 'landscape';
export type Position = 'bottom' | 'left' | 'right' | 'top';
export type PositionAlignment =
| 'bottom'
| 'center'
| 'left'
| 'left bottom'
| 'left top'
| 'right'
| 'right bottom'
| 'right top'
| 'top';
export type ScrollbarMode = 'always' | 'never' | 'onHover' | 'onScroll';
export type ScrollDirection = 'both' | 'horizontal' | 'vertical';
export type ScrollMode = 'standard' | 'virtual';
export type SearchMode = 'contains' | 'startswith' | 'equals';
export type SelectAllMode = 'allPages' | 'page';
export type SimplifiedSearchMode = 'contains' | 'startswith';
export type SingleMultipleAllOrNone = 'single' | 'multiple' | 'all' | 'none';
export type SingleMultipleOrNone = 'single' | 'multiple' | 'none';
export type SingleOrMultiple = 'single' | 'multiple';
export type SingleOrNone = 'single' | 'none';
export type SlideOutMenuPosition = 'inverted' | 'normal';
export type SortOrder = 'asc' | 'desc';
export type StoreType = 'array' | 'local' | 'odata';
export type SubmenuShowMode = 'onClick' | 'onHover';
export type TextBoxPredefinedButton = 'clear';
export type TextEditorButtonLocation = 'after' | 'before';
export type ToolbarItemComponent =
| 'dxAutocomplete'
| 'dxButton'
| 'dxCheckBox'
| 'dxDateBox'
| 'dxMenu'
| 'dxSelectBox'
| 'dxTabs'
| 'dxTextBox'
| 'dxButtonGroup'
| 'dxDropDownButton';
export type ToolbarItemLocation = 'after' | 'before' | 'center';
export type TooltipShowMode = 'always' | 'onHover';
export type ValidationMessageMode = 'always' | 'auto';
export type ValidationStatus = 'valid' | 'invalid' | 'pending';
export type VerticalAlignment = 'bottom' | 'center' | 'top';
export type VerticalEdge = 'bottom' | 'top';
}
declare module DevExpress.common.charts {
export type AnimationEaseMode = 'easeOutCubic' | 'linear';
export type AnnotationType = 'text' | 'image' | 'custom';
export type ApplyChangesMode = 'instantly' | 'onDemand';
export type ApplyFilterMode = 'auto' | 'onClick';
export type ArgumentAxisHoverMode = 'allArgumentPoints' | 'none';
export type AxisScaleType = 'continuous' | 'discrete' | 'logarithmic';
export type ChartsAxisLabelOverlap = 'rotate' | 'stagger' | 'none' | 'hide';
export type ChartsDataType = 'datetime' | 'numeric' | 'string';
export type ChartsLabelOverlap = 'hide' | 'none' | 'stack';
export type ColumnChooserMode = 'dragAndDrop' | 'select';
export type DashStyle = 'dash' | 'dot' | 'longDash' | 'solid';
export type DataChangeType = 'insert' | 'update' | 'remove';
export type DataRenderMode = 'standard' | 'virtual';
export type DiscreteAxisDivisionMode = 'betweenLabels' | 'crossLabels';
export type EnterKeyAction = 'startEdit' | 'moveFocus';
export type EnterKeyDirection = 'none' | 'column' | 'row';
export type FilterOperation =
| '='
| '<>'
| '<'
| '<='
| '>'
| '>='
| 'contains'
| 'endswith'
| 'isblank'
| 'isnotblank'
| 'notcontains'
| 'startswith'
| 'between'
| 'anyof'
| 'noneof';
export type FilterType = 'exclude' | 'include';
export type GridsEditMode = 'batch' | 'cell' | 'row' | 'form' | 'popup';
export type GridsEditRefreshMode = 'full' | 'reshape' | 'repaint';
export type GroupExpandMode = 'buttonClick' | 'rowClick';
export type HatchDirection = 'left' | 'none' | 'right';
export type LabelOverlap = 'hide' | 'none';
export type LabelPosition = 'columns' | 'inside' | 'outside';
export type LegendHoverMode = 'excludePoints' | 'includePoints' | 'none';
export type LegendMarkerState = 'normal' | 'hovered' | 'selected';
export type NewRowPosition =
| 'first'
| 'last'
| 'pageBottom'
| 'pageTop'
| 'viewportBottom'
| 'viewportTop';
export type PagerDisplayMode = 'adaptive' | 'compact' | 'full';
export type PagerPageSize = 'all' | 'auto';
export type Palette =
| 'Bright'
| 'Harmony Light'
| 'Ocean'
| 'Pastel'
| 'Soft'
| 'Soft Pastel'
| 'Vintage'
| 'Violet'
| 'Carmine'
| 'Dark Moon'
| 'Dark Violet'
| 'Green Mist'
| 'Soft Blue'
| 'Material'
| 'Office';
export type PaletteColorSet = 'simpleSet' | 'indicatingSet' | 'gradientSet';
export type PaletteExtensionMode = 'alternate' | 'blend' | 'extrapolate';
export type PointInteractionMode =
| 'allArgumentPoints'
| 'allSeriesPoints'
| 'none'
| 'onlyPoint';
export type PointSymbol =
| 'circle'
| 'cross'
| 'polygon'
| 'square'
| 'triangle'
| 'triangleDown'
| 'triangleUp';
export type RelativePosition = 'inside' | 'outside';
export type ScaleBreakLineStyle = 'straight' | 'waved';
export type SelectedFilterOperation =
| '<'
| '<='
| '<>'
| '='
| '>'
| '>='
| 'between'
| 'contains'
| 'endswith'
| 'notcontains'
| 'startswith';
export type SelectionColumnDisplayMode =
| 'always'
| 'none'
| 'onClick'
| 'onLongTap';
export type SeriesHoverMode =
| 'allArgumentPoints'
| 'allSeriesPoints'
| 'excludePoints'
| 'includePoints'
| 'nearestPoint'
| 'none'
| 'onlyPoint';
export type SeriesSelectionMode =
| 'allArgumentPoints'
| 'allSeriesPoints'
| 'excludePoints'
| 'includePoints'
| 'none'
| 'onlyPoint';
export type StartEditAction = 'click' | 'dblClick';
export type StateStoreType = 'custom' | 'localStorage' | 'sessionStorage';
export type SummaryType = 'avg' | 'count' | 'custom' | 'max' | 'min' | 'sum';
export type TextOverflow = 'ellipsis' | 'hide' | 'none';
export type Theme =
| 'generic.dark'
| 'generic.light'
| 'generic.contrast'
| 'generic.carmine'
| 'generic.darkmoon'
| 'generic.darkviolet'
| 'generic.greenmist'
| 'generic.softblue'
| 'material.blue.light'
| 'material.lime.light'
| 'material.orange.light'
| 'material.purple.light'
| 'material.teal.light';
export type TimeInterval =
| 'day'
| 'hour'
| 'millisecond'
| 'minute'
| 'month'
| 'quarter'
| 'second'
| 'week'
| 'year';
export type ValueErrorBarDisplayMode = 'auto' | 'high' | 'low' | 'none';
export type ValueErrorBarType =
| 'fixed'
| 'percent'
| 'stdDeviation'
| 'stdError'
| 'variance';
export type VisualRangeUpdateMode = 'auto' | 'keep' | 'reset' | 'shift';
export type WordWrap = 'normal' | 'breakWord' | 'none';
export type ZoomPanAction = 'zoom' | 'pan';
}
declare module DevExpress.common.grids {
export interface ColumnChooser {
/**
* Specifies whether searching is enabled in the column chooser.
*/
allowSearch?: boolean;
/**
* Specifies text displayed by the column chooser when it is empty.
*/
emptyPanelText?: string;
/**
* Specifies whether a user can open the column chooser.
*/
enabled?: boolean;
/**
* Specifies the height of the column chooser.
*/
height?: number;
/**
* Specifies how a user manages columns using the column chooser.
*/
mode?: DevExpress.common.charts.ColumnChooserMode;
/**
* Specifies a delay in milliseconds between when a user finishes typing in the column chooser's search panel, and when the search is executed.
*/
searchTimeout?: number;
/**
* Specifies the title of the column chooser.
*/
title?: string;
/**
* Specifies the width of the column chooser.
*/
width?: number;
/**
* Specifies the sort order of column headers.
*/
sortOrder?: SortOrder;
}
export interface ColumnCustomizeTextArg {
value?: any;
valueText?: string;
target?: string;
groupInterval?: string | number;
}
export interface ColumnFixing {
/**
* Enables column fixing.
*/
enabled?: boolean;
/**
* Contains properties that specify texts for column fixing commands in the context menu of a column header.
*/
texts?: ColumnFixingTexts;
}
export interface ColumnFixingTexts {
/**
* Specifies text for the context menu item that fixes a column.
*/
fix?: string;
/**
* Specifies text for the context menu subitem that fixes a column to the left edge of the UI component.
*/
leftPosition?: string;
/**
* Specifies text for the context menu subitem that fixes a column to the right edge of the UI component.
*/
rightPosition?: string;
/**
* Specifies text for the context menu item that unfixes a column.
*/
unfix?: string;
}
export interface ColumnHeaderFilter {
/**
* Specifies whether searching is enabled in the header filter.
*/
allowSearch?: boolean;
/**
* Specifies the header filter's data source.
*/
dataSource?:
| DevExpress.ui.dxFilterBuilder.FilterLookupDataSource<any>
| ((options: {
component?: any;
dataSource?: DevExpress.data.DataSource.Options | null;
}) => void);
/**
* Specifies how the header filter combines values into groups. Does not apply if you specify a custom header filter data source.
*/
groupInterval?: DevExpress.ui.dxDataGrid.HeaderFilterGroupInterval | number;
/**
* Specifies the height of the popup menu containing filtering values.
*/
height?: number;
/**
* Specifies a comparison operation used to search header filter values.
*/
searchMode?: SearchMode;
/**
* Specifies the width of the popup menu containing filtering values.
*/
width?: number;
}
export interface ColumnLookup {
/**
* Specifies whether to display the Clear button in lookup column cells while they are being edited.
*/
allowClearing?: boolean;
/**
* Specifies the data source for the lookup column.
*/
dataSource?:
| DevExpress.ui.dxFilterBuilder.FilterLookupDataSource<any>
| ((options: {
data?: any;
key?: any;
}) => DevExpress.ui.dxFilterBuilder.FilterLookupDataSource<any>)
| null;
/**
* Specifies the data source field whose values must be displayed.
*/
displayExpr?: string | ((data: any) => string);
/**
* Specifies the data field whose values should be replaced with values from the displayExpr field.
*/
valueExpr?: string;
/**
*
*/
calculateCellValue?: (rowData: any) => any;
}
/**
*
*/
export interface DataChange<TRowData = any, TKey = any> {
/**
* The key of the row being updated or removed.
*/
key: TKey;
/**
* Data change type.
*/
type: DevExpress.common.charts.DataChangeType;
/**
* An object with updated row fields.
*/
data: DevExpress.core.DeepPartial<TRowData>;
/**
* A key that identifies a record after which a new record should be inserted. Applies only if the type is 'insert'.
*/
insertAfterKey?: TKey;
/**
* A key that identifies the record before which a new record should be inserted. Applies only if the type is 'insert'.
*/
insertBeforeKey?: TKey;
}
export interface FilterPanelTexts {
/**
* The text of the 'Clear' link.
*/
clearFilter?: string;
/**
* The text of the 'Create Filter' link.
*/
createFilter?: string;
/**
* The hint of the checkbox that applies the filter.
*/
filterEnabledHint?: string;
}
export interface FilterRow {
/**
* Specifies when to apply a filter.
*/
applyFilter?: DevExpress.common.charts.ApplyFilterMode;
/**
* Specifies text for a hint that appears when a user pauses on a button that applies the filter.
*/
applyFilterText?: string;
/**
* Specifies a placeholder for the editor that specifies the end of a range when a user selects the 'between' filter operation.
*/
betweenEndText?: string;
/**
* Specifies a placeholder for the editor that specifies the start of a range when a user selects the 'between' filter operation.
*/
betweenStartText?: string;
/**
* Specifies descriptions for filter operations on the filter list.
*/
operationDescriptions?: FilterRowOperationDescriptions;
/**
* Specifies text for the reset operation on the filter list.
*/
resetOperationText?: string;
/**
* Specifies text for the item that clears the applied filter. Used only when a cell of the filter row contains a select box.
*/
showAllText?: string;
/**
* Specifies whether icons that open the filter lists are visible.
*/
showOperationChooser?: boolean;
/**
* Specifies whether the filter row is visible.
*/
visible?: boolean;
}
export interface FilterRowOperationDescriptions {
/**
* A description for the 'between' operation.
*/
between?: string;
/**
* A description for the 'contains' operation.
*/
contains?: string;
/**
* A description for the 'endswith' operation.
*/
endsWith?: string;
/**
* A description for the '=' operation.
*/
equal?: string;
/**
* A description for the '>' operation.
*/
greaterThan?: string;
/**
* A description for the '>=' operation.
*/
greaterThanOrEqual?: string;
/**
* A description for the '<' operation.
*/
lessThan?: string;
/**
* A description for the '<=' operation.
*/
lessThanOrEqual?: string;
/**
* A description for the 'notcontains' operation.
*/
notContains?: string;
/**
* A description for the '<>' operation.
*/
notEqual?: string;
/**
* A description for the 'startswith' operation.
*/
startsWith?: string;
}
export interface HeaderFilter {
/**
* Specifies whether searching is enabled in the header filter.
*/
allowSearch?: boolean;
/**
* Specifies the height of the popup menu that contains values for filtering.
*/
height?: number;
/**
* Specifies a delay in milliseconds between when a user finishes typing in the header filter's search panel, and when the search is executed.
*/
searchTimeout?: number;
/**
* Contains properties that specify text for various elements of the popup menu.
*/
texts?: HeaderFilterTexts;
/**
* Specifies whether header filter icons are visible.
*/
visible?: boolean;
/**
* Specifies the width of the popup menu that contains values for filtering.
*/
width?: number;
}
export interface HeaderFilterTexts {
/**
* Specifies text for the button that closes the popup menu without applying a filter.
*/
cancel?: string;
/**
* Specifies a name for the item that represents empty values in the popup menu.
*/
emptyValue?: string;
/**
* Specifies text for the button that applies the specified filter.
*/
ok?: string;
}
export interface KeyboardNavigation {
/**
* Specifies whether users can enter a new cell value on a key press. Applies if editing.mode is 'cell' or 'batch'.
*/
editOnKeyPress?: boolean;
/**
* Enables keyboard navigation.
*/
enabled?: boolean;
/**
* Specifies whether the Enter key switches the cell or row to the edit state or moves focus in the enterKeyDirection. Applies for all edit modes, except 'popup'.
*/
enterKeyAction?: DevExpress.common.charts.EnterKeyAction;
/**
* Specifies the direction in which to move focus when a user presses Enter. Applies if editing.mode is 'cell' or 'batch'.
*/
enterKeyDirection?: DevExpress.common.charts.EnterKeyDirection;
}
export interface LoadPanel {
/**
* Enables displaying the load panel automatically.
*/
enabled?: boolean | Mode;
/**
* Specifies the height of the load panel in pixels.
*/
height?: number;
/**
* Specifies a URL pointing to an image to be used as a loading indicator.
*/
indicatorSrc?: string;
/**
* Specifies whether to shade the UI component when the load panel is shown.
*/
shading?: boolean;
/**
* Specifies the shading color. Applies only if shading is true.
*/
shadingColor?: string;
/**
* Specifies whether to show the loading indicator.
*/
showIndicator?: boolean;
/**
* Specifies whether to show the pane of the load panel.
*/
showPane?: boolean;
/**
* Specifies text displayed on the load panel.
*/
text?: string;
/**
* Specifies the width of the load panel in pixels.
*/
width?: number;
}
export interface Pager {
/**
* Specifies the available page sizes in the page size selector.
*/
allowedPageSizes?:
| Array<number | DevExpress.common.charts.PagerPageSize>
| Mode;
/**
* Specifies the pager's display mode.
*/
displayMode?: DevExpress.common.charts.PagerDisplayMode;
/**
* Specifies the page information text.
*/
infoText?: string;
/**
* Specifies whether to show the page information.
*/
showInfo?: boolean;
/**
* Specifies whether to show navigation buttons.
*/
showNavigationButtons?: boolean;
/**
* Specifies whether to show the page size selector.
*/
showPageSizeSelector?: boolean;
/**
* Specifies whether the pager is visible.
*/
visible?: boolean | Mode;
/**
*
*/
label?: string;
}
export interface SearchPanel {
/**
* Notifies the UI component whether search is case-sensitive to ensure that search results are highlighted correctly. Applies only if highlightSearchText is true.
*/
highlightCaseSensitive?: boolean;
/**
* Specifies whether found substrings should be highlighted.
*/
highlightSearchText?: boolean;
/**
* Specifies a placeholder for the search panel.
*/
placeholder?: string;
/**
* Specifies whether the UI component should search against all columns or only visible ones.
*/
searchVisibleColumnsOnly?: boolean;
/**
* Sets a search string for the search panel.
*/
text?: string;
/**
* Specifies whether the search panel is visible or not.
*/
visible?: boolean;
/**
* Specifies the width of the search panel in pixels.
*/
width?: number;
}
export interface Sorting {
/**
* Specifies text for the context menu item that sets an ascending sort order in a column.
*/
ascendingText?: string;
/**
* Specifies text for the context menu item that clears sorting settings for a column.
*/
clearText?: string;
/**
* Specifies text for the context menu item that sets a descending sort order in a column.
*/
descendin