/** * @license * Copyright Datorama. All Rights Reserved. * * Use of this source code is governed by an Apache License 2.0 license that can be * found in the LICENSE file at https://github.com/datorama/client-core/blob/master/LICENSE */ import { AfterContentInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, OnInit, QueryList, TemplateRef } from '@angular/core'; import { ControlValueAccessor, FormControl } from '@angular/forms'; import { BaseCustomControl } from '../custom-control/base-custom-control'; import { SelectType } from './select.types'; import { DatoOptionComponent } from '../options/option.component'; import { DatoSelectActiveDirective } from './select-active.directive'; import { DatoSelectSearchStrategy } from './search.strategy'; import { DatoOverlay } from '../angular/overlay'; import { DatoTranslateService } from '../services/translate.service'; import { DatoAccordionComponent } from '../accordion/public_api'; import { DatoGroupComponent } from '../options/group.component'; import { PopperOptions } from '../services/popper'; export declare class DatoSelectComponent extends BaseCustomControl implements OnInit, OnDestroy, ControlValueAccessor, AfterContentInit { private cdr; private translate; private host; private datoOverlay; _naked: any; size: any; width: string; private datoTriggerSingle; /** The dropdown container element which is the portal **/ dropdown: TemplateRef; /** The overlay origin which is one of dato-triggers **/ origin: ElementRef; /** QueryList of datoOptions children */ options: QueryList; /** QueryList of datoAccordionGroups children */ accordion: QueryList; /** QueryList of datoGroups children */ groups: QueryList; /** Allowing custom template by passing *datoActive directive which gets the active as context */ active: DatoSelectActiveDirective; /** The key that stores the option id */ idKey: string; /** The lookup key for the label */ labelKey: string; /** A placeholder for the trigger */ placeholder: string; /** A placeholder for the search */ searchPlaceholder: string; /** Custom text when we don't have results */ set noItemsLabel(value: string); /** If defined, indicates by which key the data should be normalized */ groupBy: string; /** Add/removes search input */ isCombo: boolean; /** Whether it's a group */ isGroup: boolean; /** * Decide whether to filter the results internally based on search query. * Useful for async filtering, where we search through more complex data. */ internalSearch: boolean; /** Debounce time to emit search queries */ debounceTime: number; /** Whether to show loading indicator */ isLoading: boolean; /** Whether to allow select all checkbox */ allowSelectAll: boolean; /** Whether to allow select all chip. empty means it's disabled */ selectAllChipTxt: string; /** The type of the select */ type: SelectType; /** Client search strategy */ searchStrategy: DatoSelectSearchStrategy; /** The default position of the dropdown */ placement: PopperOptions['placement']; infiniteScrollLoading: boolean; /** Limit the number of results shown */ limitTo: number; set limitSelected(limitSelectedTo: number); /** Allow sorting of selected options in multi mode */ isSortable: boolean; /** Element to append the options overlay to */ appendTo: HTMLElement | string; /** The options to display in the dropdown */ set dataSet(data: any[]); /** Search groups as well as options */ searchGroupLabels: boolean; /** Add custom class to the select dropDown */ datoSelectClass: string; loadingTemplate: TemplateRef; /** show empty result text */ showEmptyResultsText: boolean; /** * keep focus in input after selecting option */ keepFocus: boolean; /** Emit search value when internal search is false */ search: EventEmitter; /** Emit when [withActions] is true and the user clicks save */ save: EventEmitter; fetch: EventEmitter; blur: EventEmitter; limitSelectedTo: number; /** * Getters and Setters */ get containsGroups(): boolean; get data(): any[]; get open(): boolean; set open(value: boolean); get hasResults(): boolean; set hasResults(value: boolean); get hasValue(): number; get isSingle(): boolean; get isMulti(): boolean; get _showEmptyResults(): boolean; get _count(): string; /** Whether all the options are checked */ get _isAllChecked(): boolean; get showSelectAllChip(): boolean; /** Whether some the options are checked */ get _isIndeterminatelyChecked(): boolean; /** FormControl which listens for search value changes */ searchControl: FormControl; /** Expose the search term so it can be used with the highlight directive */ searchTerm: string; /** * Private Properties */ _noItemsLabel: string; /** Store the initial data */ _data: any[]; /** Indicates whether we already initialized the data, * This is optimization for non async calls. * */ _dataIsDirty: boolean; /** Triggers the focus on the input */ _focus: boolean; /** Store the active options */ _model: any[]; /** Enable/disable the select-trigger */ _disabled: any; /** Wheter the dropdown is open */ _open: boolean; /** Whether we have search results */ _hasResults: boolean; /** Indication if we need to set the initial control value as actives */ _initialOpen: boolean; /** Whether generate cancel/save footer */ _withActions: boolean; _withInfiniteScroll: boolean; /** Notify the multi trigger when click outside to remove the focus */ _clickOutside: boolean; /** Dropdown size class */ _dropdownClass: string[]; /** true until ngOnInit */ private initialRun; /** Search control subscription */ private searchSubscription; /** Clicks options subscription */ private clicksSubscription; private keyManager; private infiniteSubscription; private scrollEventSubscription; constructor(cdr: ChangeDetectorRef, translate: DatoTranslateService, host: ElementRef, datoOverlay: DatoOverlay, _naked: any, size: any, width: string); ngOnInit(): void; markTouched(): void; /** * Close the dropdown */ close(): void; /** * Toggle the dropdown visibility */ toggle(): void; setDisabledState(isDisabled: boolean): void; writeValue(activeOptions: any | any[]): void; /** * Open the overlay */ openDropdown(event?: any): void; ngAfterContentInit(): void; checkAll(check: boolean): void; reorderOptions(newOrder: any[]): void; removeOption(option: any): void; preventBodyScroll(event: KeyboardEvent): void; /** * Create the overlay to display the select options */ private createOverlay; /** * Popper doesn't support perfect-scroll-bar, so we need to do it manually */ private handlePerfectScrollBar; private getVisibleOptions; /** * Mark the initial control value as active */ private markAsActive; /** * Show all options */ private showAll; /** * Search for options and returns if we have result */ private searchOptions; /** * Search for matching groups and children. */ private searchInGroups; /** * Search the options to show or hide each and return if result has been found. * Consider we have a group that match we show all of its options. */ private searchInOptions; /** * Get the key of the option group. It can be the group Id if exists, or the label. */ private getGroupKey; private isEmpty; /** * Subscribe to search changes and filter the list */ private listenToSearch; /** * Subscribe to option click and change the state accordingly */ private subscribeToOptionClick; onDocumentKeydown(event: KeyboardEvent): void; keyup(event: KeyboardEvent): void; private resetAll; private handleSingleClick; private handleMultiClick; private activateInfiniteScroll; ngOnDestroy(): void; /** * Whether the group component is Accordion */ private isAccordionGroup; /** * Retrieve an array of the group components */ private getGroupComponentsArray; private updateDisabledState; private asyncUpdateDropdownPosition; triggerChangeDetectionInDatoSingle(): void; }