/** * DevExtreme (ui/drop_down_box.d.ts) * Version: 25.1.7 * Build date: Mon Nov 10 2025 * * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/ */ import { UserDefinedElement, DxElement, } from '../core/element'; import { template, } from '../common'; import DataSource, { DataSourceLike } from '../data/data_source'; import { EventInfo, NativeEventInfo, InitializedEventInfo, ChangedOptionInfo, } from '../events'; import dxDropDownEditor, { dxDropDownEditorOptions, DropDownButtonTemplateDataModel, } from './drop_down_editor/ui.drop_down_editor'; import { ValueChangedInfo, } from './editor/editor'; import { DataExpressionMixinOptions, } from './editor/ui.data_expression'; import { Properties as PopupProperties, } from './popup'; /** * The type of the change event handler's argument. */ export type ChangeEvent = NativeEventInfo; /** * The type of the closed event handler's argument. */ export type ClosedEvent = EventInfo; /** * The type of the copy event handler's argument. */ export type CopyEvent = NativeEventInfo; /** * The type of the cut event handler's argument. */ export type CutEvent = NativeEventInfo; /** * The type of the disposing event handler's argument. */ export type DisposingEvent = EventInfo; /** * The type of the enterKey event handler's argument. */ export type EnterKeyEvent = NativeEventInfo; /** * The type of the focusIn event handler's argument. */ export type FocusInEvent = NativeEventInfo; /** * The type of the focusOut event handler's argument. */ export type FocusOutEvent = NativeEventInfo; /** * The type of the initialized event handler's argument. */ export type InitializedEvent = InitializedEventInfo; /** * The type of the input event handler's argument. */ export type InputEvent = NativeEventInfo; /** * The type of the keyDown event handler's argument. */ export type KeyDownEvent = NativeEventInfo; export type KeyPressEvent = NativeEventInfo; /** * The type of the keyUp event handler's argument. */ export type KeyUpEvent = NativeEventInfo; /** * The type of the opened event handler's argument. */ export type OpenedEvent = EventInfo; /** * The type of the optionChanged event handler's argument. */ export type OptionChangedEvent = EventInfo & ChangedOptionInfo; /** * The type of the paste event handler's argument. */ export type PasteEvent = NativeEventInfo; /** * The type of the valueChanged event handler's argument. */ export type ValueChangedEvent = NativeEventInfo & ValueChangedInfo; export type ContentTemplateData = { component: dxDropDownBox; readonly value?: any; }; export type DropDownButtonTemplateData = DropDownButtonTemplateDataModel; /** * * @deprecated * @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 dxDropDownBoxOptions extends DataExpressionMixinOptions, dxDropDownEditorOptions { /** * Specifies whether the UI component allows a user to enter a custom value. */ acceptCustomValue?: boolean; /** * Specifies a custom template for the drop-down content. */ contentTemplate?: template | ((templateData: ContentTemplateData, contentElement: DxElement) => string | UserDefinedElement); /** * Binds the UI component to data. */ dataSource?: DataSourceLike | null; /** * Customizes text before it is displayed in the input field. */ displayValueFormatter?: ((value: string | Array) => string); /** * Specifies a custom template for the text field. Must contain the TextBox UI component. */ fieldTemplate?: template | ((value: any, fieldElement: DxElement) => string | UserDefinedElement); /** * An array of items used to synchronize the DropDownBox with an embedded UI component. */ items?: Array; /** * Specifies whether a user can open the drop-down list by clicking a text field. */ openOnFieldClick?: boolean; /** * Specifies the DOM events after which the UI component's value should be updated. */ valueChangeEvent?: string; /** * Configures the drop-down field which holds the content. */ dropDownOptions?: PopupProperties; } /** * The DropDownBox UI component consists of a text field, which displays the current value, and a drop-down field, which can contain any UI element. */ export default class dxDropDownBox extends dxDropDownEditor { getDataSource(): DataSource; } export type Properties = dxDropDownBoxOptions; /** * @deprecated use Properties instead * @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 Options = dxDropDownBoxOptions;