@progress/kendo-angular-dropdowns

import { ElementRef, TemplateRef, EventEmitter, ViewContainerRef, OnDestroy, OnChanges, SimpleChange, ChangeDetectorRef } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; import { SearchBarComponent } from './searchbar.component'; import { ItemTemplateDirective } from './templates/item-template.directive'; import { HeaderTemplateDirective } from './templates/header-template.directive'; import { FooterTemplateDirective } from './templates/footer-template.directive'; import { PopupSettings } from './popup-settings'; import { NoDataTemplateDirective } from './templates/no-data-template.directive'; import { SelectionService } from './selection.service'; import { NavigationService, NavigationEvent } from './navigation.service'; import { Observable } from 'rxjs/Observable'; import 'rxjs/add/operator/filter'; import 'rxjs/add/operator/catch'; import 'rxjs/add/operator/do'; import 'rxjs/add/operator/merge'; import 'rxjs/add/operator/map'; import 'rxjs/add/operator/let'; import 'rxjs/add/operator/partition'; import 'rxjs/add/operator/throttleTime'; import 'rxjs/add/operator/distinctUntilChanged'; import { PreventableEvent } from './common/preventable-event'; import { PopupService } from '@progress/kendo-angular-popup'; /** * @hidden */ export declare const COMBOBOX_VALUE_ACCESSOR: any; /** * Represents the Kendo UI ComboBox component for Angular. * * @example * ```ts * _@Component({ * selector: 'my-app', * template: ` * <kendo-combobox [data]="listItems"> * </kendo-combobox> * ` * }) * class AppComponent { * public listItems: Array<string> = ["Item 1", "Item 2", "Item 3", "Item 4"]; * } * ``` */ export declare class ComboBoxComponent implements ControlValueAccessor, OnDestroy, OnChanges { private popupService; private selectionService; private navigationService; private cdr; readonly width: any; readonly height: any; text: any; popupOpen: boolean; readonly activeDescendant: string; readonly appendTo: ViewContainerRef; dataItem: any; selected: any[]; /** * Specifies whether the ComboBox allows user-defined values that are not present in the dataset. * The default value is `false`. * * For more information, refer to the article on [custom values]({% slug custom_values_combobox_kendouiforangular %}). */ allowCustom: boolean; /** * Sets the data of the ComboBox. * * > The data has to be provided in an array-like list. */ data: any; /** * Sets the value of the ComboBox. It can either be of the primitive (string, numbers) or of the complex (objects) type. To define the type, use the `valuePrimitive` option. * * > All selected values which are not present in the dataset are considered custom values. When the `Enter` key is pressed or the component loses focus, custom values get dismissed unless `allowCustom` is set to `true`. */ value: any; /** * Sets the data item field that represents the item text. If the data contains only primitive values, do not define it. */ textField: string; /** * Sets the data item field that represents the item value. If the data contains only primitive values, do not define it. */ valueField: string; /** * Specifies the type of the selected value. If set to `true`, the selected value has to be of the primitive type. * * For more details, refer to the section on the [`valuePrimitive`]({% slug valuebinding_combobox_kendouiforangular %}#toc-primitive-values-from-object-fields) property. */ valuePrimitive: boolean; /** * A user-defined callback which returns normalized custom values. Typically used when the data items are different from type `string`. * @param { Any } value - The custom value defined by the user. * @returns { Any } * * @example * ```ts * _@Component({ * selector: 'my-app', * template: ` * <kendo-combobox * [allowCustom]="true" * [data]="listItems" * [textField]="'text'" * [valueField]="'value'" * [valueNormalizer]="valueNormalizer" * (valueChange)="onValueChange($event)" * > * </kendo-combobox> * ` * }) * * class AppComponent { * public listItems: Array<{ text: string, value: number }> = [ * { text: "Small", value: 1 }, * { text: "Medium", value: 2 }, * { text: "Large", value: 3 } * ]; * * public onValueChange(value) { * console.log("valueChange : ", value); * } * * public valueNormalizer = (text: Observable<string>) => text.map((text: string) => { * return { ProductID: null, ProductName: text }; * }); * * } * ``` */ valueNormalizer: (text: Observable<string>) => Observable<any>; /** * The hint displayed when the component is empty. * */ placeholder: string; /** * Configures the popup of the ComboBox. * * The available options are: * - `animate: Boolean`—Controls the popup animation. By default, the open and close animations are enabled. * - `width: Number | String`—Sets the width of the popup container. By default, the width of the host element is used If set to `auto`, the component automatically adjusts the width of the popup, so no item labels are wrapped. * - `height: Number`—Sets the height of the popup container. By default, the height is 200px. * - `popupClass: String`—Specifies a list of CSS classes that are used to style the popup. */ popupSettings: PopupSettings; /** * @hidden */ iconClass: string; /** * Sets and gets the loading state of the ComboBox. */ loading: boolean; /** * @hidden * * Enables the auto-completion of the text based on the first data item. */ suggest: boolean; /** * If set to `true`, renders a button on hovering over the component. Clicking this button resets the value of the component to `undefined` and triggers the `change` event. */ clearButton: boolean; /** * Sets the disabled state of the component. */ disabled: boolean; /** * Specifies the [`tabIndex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the component. */ tabIndex: number; /** * Enables the filtering functionality. If set to `true`, the component emits the `filterChange` event. */ filterable: boolean; /** * Fires each time the value is changed. * * For more details, refer to the example on [events]({% slug overview_combobox_kendouiforangular %}#toc-events). */ valueChange: EventEmitter<any>; /** * Fires each time an item selection is changed. * * For more details, refer to the example on [events]({% slug overview_combobox_kendouiforangular %}#toc-events). */ selectionChange: EventEmitter<any>; /** * Fires each time the user types in the input. * You can filter the source based on the passed filtration value. * * For more details, refer to the example on [events]({% slug overview_combobox_kendouiforangular %}#toc-events). */ filterChange: EventEmitter<any>; /** * Fires each time the popup is about to open. * This event is preventable. If you cancel it, the popup will remain closed. */ open: EventEmitter<PreventableEvent>; /** * Fires each time the popup is about to close. * This event is preventable. If you cancel it, the popup will remain open. */ close: EventEmitter<PreventableEvent>; /** * Fires each time the user focuses the ComboBox. */ onFocus: EventEmitter<any>; /** * Fires each time the ComboBox gets blurred. */ onBlur: EventEmitter<any>; template: ItemTemplateDirective; headerTemplate: HeaderTemplateDirective; footerTemplate: FooterTemplateDirective; noDataTemplate: NoDataTemplateDirective; container: ViewContainerRef; popupTemplate: TemplateRef<any>; searchbar: SearchBarComponent; readonly widgetClasses: boolean; /** * @hidden */ wrapperClasses(): any; readonly clearable: boolean; readonly widgetHeight: string; readonly dir: any; isFocused: boolean; listBoxId: string; optionPrefix: string; popupWidth: string; popupMinWidth: string; protected onChangeCallback: Function; protected onTouchedCallback: Function; private valueSubscription; private selectionSubscription; private observableSubscriptions; private _state; private _filtering; private _text; private _data; private _open; private _value; private _previousValue; private wrapper; private suggestedText; private backspacePressed; private _popupSettings; private popupRef; private popupMouseDownHandler; private customValueSubject; private valueSubject; private selectionSubject; private direction; constructor(rtl: boolean, popupService: PopupService, selectionService: SelectionService, navigationService: NavigationService, cdr: ChangeDetectorRef, wrapper: ElementRef); ngOnInit(): void; private createSelectionStream(); private createValueStream(); private subscribeEvents(); private unsubscribeEvents(); private handleItemChange(index); private handleItemSelect(index); ngOnDestroy(): void; ngOnChanges(changes: { [propertyName: string]: SimpleChange; }): void; /** * Focuses the ComboBox. */ focus(): void; /** * Blurs the ComboBox. */ blur(): void; /** * Toggles the visibility of the popup. If you use the `toggle` method to open or close the popup, * the `open` and `close` events will not be fired. * * @param open - The state of the popup. */ toggle(open: boolean): void; /** * Returns the current open state of the popup. */ readonly isOpen: boolean; /** * Resets the value of the ComboBox. */ reset(): void; /** * @hidden */ clearValue(event: any): void; /** * @hidden */ writeValue(value: any): void; /** * @hidden */ registerOnChange(fn: any): void; /** * @hidden */ registerOnTouched(fn: any): void; /** * @hidden */ setDisabledState(isDisabled: boolean): void; /** * @hidden */ popupOpened(): void; /** * @hidden */ readonly buttonClasses: Object; /** * @hidden */ onResize(): void; protected verifySettings(newValue: any): void; protected resolveState(value: any): any; protected setState(value: any): void; protected search(text: any): void; /** * @hidden */ getSuggestion(): string; protected navigate(index: number): void; /** * @hidden */ handleNavigate(event: any): void; protected handleEnter(event: NavigationEvent): void; /** * @hidden */ handleBlur(): void; /** * @hidden */ searchBarChange(text: string): void; /** * @hidden */ handleFocus(): void; protected change(candidate: any, isCustom?: boolean): void; protected emitChange(): void; /** * @hidden */ iconClick(): void; readonly listContainerClasses: Object; private _toggle(open); }