import { Overlay, OverlayRef, ScrollStrategy, ViewportRuler } from '@angular/cdk/overlay'; import { ChangeDetectorRef, ElementRef, InjectionToken, NgZone, OnDestroy, ViewContainerRef } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; import { TsDocumentService } from '@terminus/ngx-tools/browser'; import { TsFormFieldComponent } from '@terminus/ui/form-field'; import { TsOptionComponent, TsOptionSelectionChange } from '@terminus/ui/option'; import { Observable, Subscription } from 'rxjs'; import { TsAutocompletePanelComponent } from './autocomplete-panel.component'; /** * The following style constants are necessary to save here in order to properly calculate the scrollTop of the panel. * Because we are not actually focusing the active item, scroll must be handled manually. */ export declare const AUTOCOMPLETE_OPTION_HEIGHT = 48; export declare const AUTOCOMPLETE_PANEL_HEIGHT = 256; export declare const TS_AUTOCOMPLETE_SCROLL_STRATEGY: InjectionToken<() => ScrollStrategy>; /** * Define a scroll strategy factory * * @param overlay */ export declare const TS_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY: (overlay: Overlay) => () => ScrollStrategy; export declare const TS_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER: { provide: InjectionToken<() => ScrollStrategy>; deps: (typeof Overlay)[]; useFactory: (overlay: Overlay) => () => ScrollStrategy; }; /** * A directive that adds autocomplete trigger functionality to an input. Used in {@link TsSelectComponent}. * * @deprecated Please use `TsSelectionListTrigger` * * @example * */ export declare class TsAutocompleteTriggerDirective implements ControlValueAccessor, OnDestroy { elementRef: ElementRef; private overlay; private viewContainerRef; private ngZone; private changeDetectorRef; private documentService; private viewportRuler; private formField; /** * Whether the autocomplete can open the next time it is focused. Used to prevent a focused, closed autocomplete from being reopened if * the user switches to another browser tab and then comes back. */ private canOpenOnNextFocus; /** * The subscription for closing actions (some are bound to document) */ private closingActionsSubscription; /** * Stream of keyboard events that can close the panel */ private readonly closeKeyEventStream; private componentDestroyed; /** * Store a reference to the document object */ private readonly document; /** * Whether or not the label state is being overridden */ private manuallyFloatingLabel; /** * Stream of autocomplete option selections */ readonly optionSelections: Observable | Observable; /** * Store whether the overlay is currently attached */ private overlayAttached; /** * Store a reference to the overlay */ overlayRef: OverlayRef | null | undefined; /** * Old value of the native input * * NOTE: This is used to work around issues with the `input` event on IE */ private previousValue; /** * Store a reference to the portal */ private portal; /** * Strategy that is used to position the panel */ private positionStrategy; /** * The defined scroll strategy */ private readonly scrollStrategy; /** * Subscription to viewport size changes */ private viewportSubscription; /** * Define the default component ID */ readonly uid: string; /** * The currently active option, coerced to TsOptionComponent type */ get activeOption(): TsOptionComponent | null; /** * A stream of actions that should close the autocomplete panel, including when an option is selected, on blur, and when TAB is pressed. */ get panelClosingActions(): Observable; /** * Whether or not the autocomplete panel is open */ get panelOpen(): boolean; /** * The `autocomplete` attribute to be set on the input element. * * NOTE: Input has specific naming since it is accepting a standard HTML data attribute. */ autocompleteAttribute: string; /** * Whether the autocomplete is disabled. When disabled, the element will act as a regular input and the user won't be able to open the * panel. * * @param value */ set autocompleteDisabled(value: boolean); get autocompleteDisabled(): boolean; private _autocompleteDisabled; /** * The autocomplete panel to be attached to this trigger */ autocompletePanel: TsAutocompletePanelComponent; /** * Define if the autocomplete panel should reopen after a selection is made * * @param value */ set reopenAfterSelection(value: boolean); get reopenAfterSelection(): boolean; private _reopenAfterSelection; constructor(elementRef: ElementRef, overlay: Overlay, viewContainerRef: ViewContainerRef, ngZone: NgZone, changeDetectorRef: ChangeDetectorRef, documentService: TsDocumentService, viewportRuler: ViewportRuler, scrollStrategy: any, formField: TsFormFieldComponent); /** * Clean up subscriptions and destroy the panel */ ngOnDestroy(): void; /** * Close the autocomplete suggestion panel * * @param overrideReopenFlag - Whether the panel should reopen */ closePanel(overrideReopenFlag?: boolean): void; /** * Handle the focus event */ handleFocus(): void; /** * Handle input into the autocomplete trigger * * @param event - The keyboard event */ handleInput(event: KeyboardEvent): void; /** * Handle keydown events * * @param event - The keyboard event */ handleKeydown(event: KeyboardEvent): void; /** * View -> model callback called when value changes */ onChange: (value: any) => void; /** * View -> model callback called when autocomplete has been touched */ onTouched: () => void; /** * Open the autocomplete suggestion panel * Subscribe to click event stream and if two conditions described below met, * close the panel. */ openPanel(): void; /** * Register the onChange function * * NOTE: Implemented as part of ControlValueAccessor * * @param fn - The new onChange function */ registerOnChange(fn: (value: string) => {}): void; /** * Register the onTouched function * * NOTE: Implemented as part of ControlValueAccessor * * @param fn - The new onTouched function */ registerOnTouched(fn: () => {}): void; /** * Set the disabled state * * NOTE: Implemented as part of ControlValueAccessor * * @param isDisabled - Whether the element should be set to disabled */ setDisabledState(isDisabled: boolean): void; /** * Function used to write the value by the model * * NOTE: Implemented as part of ControlValueAccessor * * @param value - The value to write */ writeValue(value: string): void; /** * Attach the overlay */ private attachOverlay; /** * Determine whether the panel can be opened */ private canOpen; /** * Clear any previous selected option and emit a selection change event for this option * * @param skip */ private clearPreviousSelectedOption; /** * Destroy the autocomplete suggestion panel */ private destroyPanel; /** * In 'auto' mode, the label will animate down as soon as focus is lost. This causes the value to jump when selecting an option with the * mouse. This method manually floats the label until the panel can be closed. * * @param shouldAnimate - Whether the label should be animated when it is floated */ private floatLabel; /** * Return the connected element * * @returns The ElementRef */ private getConnectedElement; /** * Returns the width of the input element, so the panel width can match it */ private getHostWidth; /** * Create a config for an overlay * * @returns The overlay config */ private getOverlayConfig; /** * Get the overlay position strategy * * @returns The position strategy */ private getOverlayPosition; /** * Return the panel width * * @returns The width */ private getPanelWidth; /** * Resets the active item to -1 so arrow events will activate the correct options, or to 0 if the consumer opted into it */ private resetActiveItem; /** * If the label has been manually elevated, return it to its normal state */ private resetLabel; /** * Scroll to an option * * Given that we are not actually focusing active options, we must manually adjust scroll to reveal options below the fold. First, we find * the offset of the option from the top of the panel. If that offset is below the fold, the new scrollTop will be the offset - the panel * height + the option height, so the active option will be just visible at the bottom of the panel. If that offset is above the top of * the visible panel, the new scrollTop will become the offset. If that offset is visible within the panel already, the scrollTop is not * adjusted. */ private scrollToOption; /** * Set the value of the trigger * * @param value - The value to set */ private setTriggerValue; /** * This method closes the panel, and if a value is specified, also sets the associated control to that value. * It will also mark the control as dirty if this interaction stemmed from the user. * * @param event - The event containing the option */ private setValueAndClose; /** * This method listens to a stream of panel closing actions and resets the stream every time the option list changes * * @returns The subscription */ subscribeToClosingActions(): Subscription; /** * Event handler for when the window is blurred. * * Needs to be an arrow function in order to preserve the context. */ private windowBlurHandler; }