@natec/mef-dev-ui-kit 20.0.0-beta.1 → 20.0.1

package/src/lib/v2/autocomplete/autocomplete.trigger.ts

@@ -1,759 +0,0 @@
-import { addAriaReferencedId, removeAriaReferencedId } from '@angular/cdk/a11y';
-import { Directionality } from '@angular/cdk/bidi';
-import { DOWN_ARROW, ENTER, ESCAPE, TAB, UP_ARROW, hasModifierKey } from '@angular/cdk/keycodes';
-import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
-import {
-    ConnectedPosition,
-    createFlexibleConnectedPositionStrategy,
-    createOverlayRef,
-    createRepositionScrollStrategy,
-    FlexibleConnectedPositionStrategy,
-    OverlayConfig,
-    OverlayRef,
-    PositionStrategy,
-    ScrollStrategy,
-} from '@angular/cdk/overlay';
-import { _getEventTarget, _getFocusedElementPierceShadowDom } from '@angular/cdk/platform';
-import { TemplatePortal } from '@angular/cdk/portal';
-import { ViewportRuler } from '@angular/cdk/scrolling';
-import {
-    AfterViewInit,
-    ChangeDetectorRef,
-    Directive,
-    ElementRef,
-    EnvironmentInjector,
-    InjectionToken,
-    Injector,
-    Input,
-    NgZone,
-    OnChanges,
-    OnDestroy,
-    Renderer2,
-    SimpleChanges,
-    ViewContainerRef,
-    afterNextRender,
-    booleanAttribute,
-    forwardRef,
-    inject,
-} from '@angular/core';
-import { coerceArray } from '@angular/cdk/coercion';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { Observable, Subject, Subscription, defer, merge, of as observableOf } from 'rxjs';
-import { delay, filter, map, startWith, switchMap, take, tap } from 'rxjs/operators';
-import { MD_AUTOCOMPLETE_DEFAULT_OPTIONS, MDAutocomplete, MdAutocompleteDefaultOptions } from './autocomplete';
-import { _countGroupLabelsBeforeOption, _getOptionScrollPosition, MDOption, MDOptionSelectionChange } from 'ui-kit-lib';
-import { MDAutocompleteOrigin } from './autocomplete-origin';
-
-export const MD_AUTOCOMPLETE_VALUE_ACCESSOR: any = {
-    provide: NG_VALUE_ACCESSOR,
-    useExisting: forwardRef(() => MDAutocompleteTrigger),
-    multi: true,
-};
-
-export function getMDAutocompleteMissingPanelError(): Error {
-    return Error(
-        'Attempting to open an undefined instance of `md-autocomplete`. ' +
-            'Make sure that the id passed to the `mdAutocomplete` is correct and that ' +
-            "you're attempting to open it after the ngAfterContentInit hook."
-    );
-}
-
-export const MD_AUTOCOMPLETE_SCROLL_STRATEGY = new InjectionToken<() => ScrollStrategy>(
-    'md-autocomplete-scroll-strategy',
-    {
-        providedIn: 'root',
-        factory: () => {
-            const injector = inject(Injector);
-            return () => createRepositionScrollStrategy(injector);
-        },
-    }
-);
-
-@Directive({
-    selector: `input[mdAutocomplete], textarea[mdAutocomplete]`,
-    host: {
-        class: 'md-mdc-autocomplete-trigger',
-        '[attr.autocomplete]': 'autocompleteAttribute',
-        '[attr.role]': 'autocompleteDisabled ? null : "combobox"',
-        '[attr.aria-autocomplete]': 'autocompleteDisabled ? null : "list"',
-        '[attr.aria-activedescendant]': '(panelOpen && activeOption) ? activeOption.id : null',
-        '[attr.aria-expanded]': 'autocompleteDisabled ? null : panelOpen.toString()',
-        '[attr.aria-controls]': '(autocompleteDisabled || !panelOpen) ? null : autocomplete?.id',
-        '[attr.aria-haspopup]': 'autocompleteDisabled ? null : "listbox"',
-        '(focusin)': '_handleFocus()',
-        '(blur)': '_onTouched()',
-        '(input)': '_handleInput($event)',
-        '(keydown)': '_handleKeydown($event)',
-        '(click)': '_handleClick()',
-    },
-    exportAs: 'mdAutocompleteTrigger',
-    providers: [MD_AUTOCOMPLETE_VALUE_ACCESSOR],
-})
-export class MDAutocompleteTrigger implements ControlValueAccessor, AfterViewInit, OnChanges, OnDestroy {
-    private _environmentInjector = inject(EnvironmentInjector);
-    private _element = inject<ElementRef<HTMLInputElement>>(ElementRef);
-    private _injector = inject(Injector);
-    private _viewContainerRef = inject(ViewContainerRef);
-    private _zone = inject(NgZone);
-    private _changeDetectorRef = inject(ChangeDetectorRef);
-    private _dir = inject(Directionality, { optional: true });
-    private _viewportRuler = inject(ViewportRuler);
-    private _scrollStrategy = inject(MD_AUTOCOMPLETE_SCROLL_STRATEGY);
-    private _renderer = inject(Renderer2);
-    private _animationsDisabled = false;
-    private _defaults = inject<MdAutocompleteDefaultOptions | null>(MD_AUTOCOMPLETE_DEFAULT_OPTIONS, {
-        optional: true,
-    });
-
-    private _overlayRef: OverlayRef | null;
-    private _portal: TemplatePortal;
-    private _componentDestroyed = false;
-    private _initialized = new Subject<void>();
-    private _keydownSubscription: Subscription | null;
-    private _outsideClickSubscription: Subscription | null;
-    private _cleanupWindowBlur: (() => void) | undefined;
-
-    private _previousValue: string | number | null;
-
-    private _valueOnAttach: string | number | null;
-
-    private _valueOnLastKeydown: string | null;
-
-    private _positionStrategy: FlexibleConnectedPositionStrategy;
-
-    private _manuallyFloatingLabel = false;
-
-    private _closingActionsSubscription: Subscription;
-
-    private _viewportSubscription = Subscription.EMPTY;
-
-    private _breakpointObserver = inject(BreakpointObserver);
-    private _handsetLandscapeSubscription = Subscription.EMPTY;
-
-    private _canOpenOnNextFocus = true;
-
-    private _valueBeforeAutoSelection: string | undefined;
-
-    private _pendingAutoselectedOption: MDOption | null;
-
-    private readonly _closeKeyEventStream = new Subject<void>();
-
-    readonly _overlayPanelClass = coerceArray(this._defaults?.overlayPanelClass || []);
-
-    private _windowBlurHandler = () => {
-        this._canOpenOnNextFocus = this.panelOpen || !this._hasFocus();
-    };
-
-    _onChange: (value: any) => void = () => {};
-
-    _onTouched = () => {};
-
-    @Input('mdAutocomplete') autocomplete: MDAutocomplete;
-
-    @Input('mdAutocompletePosition') position: 'auto' | 'above' | 'below' = 'auto';
-
-    @Input('mdAutocompleteConnectedTo') connectedTo: MDAutocompleteOrigin;
-
-    @Input('autocomplete') autocompleteAttribute: string = 'off';
-
-    @Input({ alias: 'mdAutocompleteDisabled', transform: booleanAttribute })
-    autocompleteDisabled: boolean;
-
-    constructor(...args: unknown[]);
-    constructor() {}
-
-    private _aboveClass = 'md-mdc-autocomplete-panel-above';
-
-    ngAfterViewInit() {
-        this._initialized.next();
-        this._initialized.complete();
-        this._cleanupWindowBlur = this._renderer.listen('window', 'blur', this._windowBlurHandler);
-    }
-
-    ngOnChanges(changes: SimpleChanges) {
-        if (changes['position'] && this._positionStrategy) {
-            this._setStrategyPositions(this._positionStrategy);
-
-            if (this.panelOpen) {
-                this._overlayRef!.updatePosition();
-            }
-        }
-    }
-
-    ngOnDestroy() {
-        this._cleanupWindowBlur?.();
-        this._handsetLandscapeSubscription.unsubscribe();
-        this._viewportSubscription.unsubscribe();
-        this._componentDestroyed = true;
-        this._destroyPanel();
-        this._closeKeyEventStream.complete();
-        this._clearFromModal();
-    }
-
-    get panelOpen(): boolean {
-        return this._overlayAttached && this.autocomplete.showPanel;
-    }
-    private _overlayAttached: boolean = false;
-
-    openPanel(): void {
-        this._openPanelInternal();
-    }
-
-    closePanel(): void {
-        if (!this._overlayAttached) {
-            return;
-        }
-
-        if (this.panelOpen) {
-            this._zone.run(() => {
-                this.autocomplete.closed.emit();
-            });
-        }
-
-        if (this.autocomplete._latestOpeningTrigger === this) {
-            this.autocomplete._isOpen = false;
-            this.autocomplete._latestOpeningTrigger = null;
-        }
-
-        this._overlayAttached = false;
-        this._pendingAutoselectedOption = null;
-
-        if (this._overlayRef && this._overlayRef.hasAttached()) {
-            this._overlayRef.detach();
-            this._closingActionsSubscription.unsubscribe();
-        }
-
-        this._updatePanelState();
-
-        if (!this._componentDestroyed) {
-            this._changeDetectorRef.detectChanges();
-        }
-
-        if (this._trackedModal) {
-            removeAriaReferencedId(this._trackedModal, 'aria-owns', this.autocomplete.id);
-        }
-    }
-
-    updatePosition(): void {
-        if (this._overlayAttached) {
-            this._overlayRef!.updatePosition();
-        }
-    }
-
-    get panelClosingActions(): Observable<MDOptionSelectionChange | null> {
-        return merge(
-            this.optionSelections,
-            this.autocomplete._keyManager.tabOut.pipe(filter(() => this._overlayAttached)),
-            this._closeKeyEventStream,
-            this._getOutsideClickStream(),
-            this._overlayRef ? this._overlayRef.detachments().pipe(filter(() => this._overlayAttached)) : observableOf()
-        ).pipe(map((event) => (event instanceof MDOptionSelectionChange ? event : null)));
-    }
-
-    readonly optionSelections: Observable<MDOptionSelectionChange> = defer(() => {
-        const options = this.autocomplete ? this.autocomplete.options : null;
-
-        if (options) {
-            return options.changes.pipe(
-                startWith(options),
-                switchMap(() => merge(...options.map((option) => option.onSelectionChange)))
-            );
-        }
-
-        return this._initialized.pipe(switchMap(() => this.optionSelections));
-    }) as Observable<MDOptionSelectionChange>;
-
-    get activeOption(): MDOption | null {
-        if (this.autocomplete && this.autocomplete._keyManager) {
-            return this.autocomplete._keyManager.activeItem;
-        }
-
-        return null;
-    }
-
-    private _getOutsideClickStream(): Observable<any> {
-        return new Observable((observer) => {
-            const listener = (event: MouseEvent | TouchEvent) => {
-                const clickTarget = _getEventTarget<HTMLElement>(event)!;
-                const customOrigin = this.connectedTo ? this.connectedTo.elementRef.nativeElement : null;
-
-                if (
-                    this._overlayAttached &&
-                    clickTarget !== this._element.nativeElement &&
-                    !this._hasFocus() &&
-                    (!customOrigin || !customOrigin.contains(clickTarget)) &&
-                    !!this._overlayRef &&
-                    !this._overlayRef.overlayElement.contains(clickTarget)
-                ) {
-                    observer.next(event);
-                }
-            };
-
-            const cleanups = [
-                this._renderer.listen('document', 'click', listener),
-                this._renderer.listen('document', 'auxclick', listener),
-                this._renderer.listen('document', 'touchend', listener),
-            ];
-
-            return () => {
-                cleanups.forEach((current) => current());
-            };
-        });
-    }
-
-    writeValue(value: any): void {
-        Promise.resolve(null).then(() => this._assignOptionValue(value));
-    }
-
-    registerOnChange(fn: (value: any) => {}): void {
-        this._onChange = fn;
-    }
-
-    registerOnTouched(fn: () => {}) {
-        this._onTouched = fn;
-    }
-
-    setDisabledState(isDisabled: boolean) {
-        this._element.nativeElement.disabled = isDisabled;
-    }
-
-    _handleKeydown(e: Event): void {
-        const event = e as KeyboardEvent;
-        const keyCode = event.keyCode;
-        const hasModifier = hasModifierKey(event);
-
-        if (keyCode === ESCAPE && !hasModifier) {
-            event.preventDefault();
-        }
-
-        this._valueOnLastKeydown = this._element.nativeElement.value;
-
-        if (this.activeOption && keyCode === ENTER && this.panelOpen && !hasModifier) {
-            this.activeOption._selectViaInteraction();
-            this._resetActiveItem();
-            event.preventDefault();
-        } else if (this.autocomplete) {
-            const prevActiveItem = this.autocomplete._keyManager.activeItem;
-            const isArrowKey = keyCode === UP_ARROW || keyCode === DOWN_ARROW;
-
-            if (keyCode === TAB || (isArrowKey && !hasModifier && this.panelOpen)) {
-                this.autocomplete._keyManager.onKeydown(event);
-            } else if (isArrowKey && this._canOpen()) {
-                this._openPanelInternal(this._valueOnLastKeydown);
-            }
-
-            if (isArrowKey || this.autocomplete._keyManager.activeItem !== prevActiveItem) {
-                this._scrollToOption(this.autocomplete._keyManager.activeItemIndex || 0);
-
-                if (this.autocomplete.autoSelectActiveOption && this.activeOption) {
-                    if (!this._pendingAutoselectedOption) {
-                        this._valueBeforeAutoSelection = this._valueOnLastKeydown;
-                    }
-
-                    this._pendingAutoselectedOption = this.activeOption;
-                    this._assignOptionValue(this.activeOption.value);
-                }
-            }
-        }
-    }
-
-    _handleInput(event: Event): void {
-        let target = event.target as HTMLInputElement;
-        let value: number | string | null = target.value;
-
-        if (target.type === 'number') {
-            value = value == '' ? null : parseFloat(value);
-        }
-
-        if (this._previousValue !== value) {
-            this._previousValue = value;
-            this._pendingAutoselectedOption = null;
-
-            if (!this.autocomplete || !this.autocomplete.requireSelection) {
-                this._onChange(value);
-            }
-
-            if (!value) {
-                this._clearPreviousSelectedOption(null, false);
-            } else if (this.panelOpen && !this.autocomplete.requireSelection) {
-                const selectedOption = this.autocomplete.options?.find((option) => option.selected);
-
-                if (selectedOption) {
-                    const display = this._getDisplayValue(selectedOption.value);
-
-                    if (value !== display) {
-                        selectedOption.deselect(false);
-                    }
-                }
-            }
-
-            if (this._canOpen() && this._hasFocus()) {
-                const valueOnAttach = this._valueOnLastKeydown ?? this._element.nativeElement.value;
-                this._valueOnLastKeydown = null;
-                this._openPanelInternal(valueOnAttach);
-            }
-        }
-    }
-
-    _handleFocus(): void {
-        if (!this._canOpenOnNextFocus) {
-            this._canOpenOnNextFocus = true;
-        } else if (this._canOpen()) {
-            this._previousValue = this._element.nativeElement.value;
-            this._attachOverlay(this._previousValue);
-        }
-    }
-
-    _handleClick(): void {
-        if (this._canOpen() && !this.panelOpen) {
-            this._openPanelInternal();
-        }
-    }
-
-    private _hasFocus(): boolean {
-        return _getFocusedElementPierceShadowDom() === this._element.nativeElement;
-    }
-
-    private _subscribeToClosingActions(): Subscription {
-        const initialRender = new Observable<void>((subscriber) => {
-            afterNextRender(
-                () => {
-                    subscriber.next();
-                },
-                { injector: this._environmentInjector }
-            );
-        });
-        const optionChanges =
-            this.autocomplete.options?.changes.pipe(
-                tap(() => this._positionStrategy.reapplyLastPosition()),
-                delay(0)
-            ) ?? observableOf();
-
-        return merge(initialRender, optionChanges)
-            .pipe(
-                switchMap(() =>
-                    this._zone.run(() => {
-                        const wasOpen = this.panelOpen;
-                        this._resetActiveItem();
-                        this._updatePanelState();
-                        this._changeDetectorRef.detectChanges();
-
-                        if (this.panelOpen) {
-                            this._overlayRef!.updatePosition();
-                        }
-
-                        if (wasOpen !== this.panelOpen) {
-                            if (this.panelOpen) {
-                                this._emitOpened();
-                            } else {
-                                this.autocomplete.closed.emit();
-                            }
-                        }
-
-                        return this.panelClosingActions;
-                    })
-                ),
-                take(1)
-            )
-            .subscribe((event) => this._setValueAndClose(event));
-    }
-
-    private _emitOpened() {
-        this.autocomplete.opened.emit();
-    }
-
-    private _destroyPanel(): void {
-        if (this._overlayRef) {
-            this.closePanel();
-            this._overlayRef.dispose();
-            this._overlayRef = null;
-        }
-    }
-
-    private _getDisplayValue<T>(value: T): T | string {
-        const autocomplete = this.autocomplete;
-        return autocomplete && autocomplete.displayWith ? autocomplete.displayWith(value) : value;
-    }
-
-    private _assignOptionValue(value: any): void {
-        const toDisplay = this._getDisplayValue(value);
-
-        if (value == null) {
-            this._clearPreviousSelectedOption(null, false);
-        }
-
-        this._updateNativeInputValue(toDisplay != null ? toDisplay : '');
-    }
-
-    private _updateNativeInputValue(value: string): void {
-        this._element.nativeElement.value = value;
-
-        this._previousValue = value;
-    }
-
-    private _setValueAndClose(event: MDOptionSelectionChange | null): void {
-        const panel = this.autocomplete;
-        const toSelect = event ? event.source : this._pendingAutoselectedOption;
-
-        if (toSelect) {
-            this._clearPreviousSelectedOption(toSelect);
-            this._assignOptionValue(toSelect.value);
-            this._onChange(toSelect.value);
-            panel._emitSelectEvent(toSelect);
-            this._element.nativeElement.focus();
-        } else if (panel.requireSelection && this._element.nativeElement.value !== this._valueOnAttach) {
-            this._clearPreviousSelectedOption(null);
-            this._assignOptionValue(null);
-            this._onChange(null);
-        }
-
-        this.closePanel();
-    }
-
-    private _clearPreviousSelectedOption(skip: MDOption | null, emitEvent?: boolean) {
-        this.autocomplete?.options?.forEach((option) => {
-            if (option !== skip && option.selected) {
-                option.deselect(emitEvent);
-            }
-        });
-    }
-
-    private _openPanelInternal(valueOnAttach = this._element.nativeElement.value) {
-        this._attachOverlay(valueOnAttach);
-        if (this._trackedModal) {
-            const panelId = this.autocomplete.id;
-            addAriaReferencedId(this._trackedModal, 'aria-owns', panelId);
-        }
-    }
-
-    private _attachOverlay(valueOnAttach: string): void {
-        if (!this.autocomplete && (typeof ngDevMode === 'undefined' || ngDevMode)) {
-            throw getMDAutocompleteMissingPanelError();
-        }
-
-        let overlayRef = this._overlayRef;
-
-        if (!overlayRef) {
-            this._portal = new TemplatePortal(this.autocomplete.template, this._viewContainerRef);
-            overlayRef = createOverlayRef(this._injector, this._getOverlayConfig());
-            this._overlayRef = overlayRef;
-            this._viewportSubscription = this._viewportRuler.change().subscribe(() => {
-                if (this.panelOpen && overlayRef) {
-                    overlayRef.updateSize({ width: this._getPanelWidth() });
-                }
-            });
-            this._handsetLandscapeSubscription = this._breakpointObserver
-                .observe(Breakpoints.HandsetLandscape)
-                .subscribe((result) => {
-                    const isHandsetLandscape = result.matches;
-                    if (isHandsetLandscape) {
-                        this._positionStrategy
-                            .withFlexibleDimensions(true)
-                            .withGrowAfterOpen(true)
-                            .withViewportMargin(8);
-                    } else {
-                        this._positionStrategy
-                            .withFlexibleDimensions(false)
-                            .withGrowAfterOpen(false)
-                            .withViewportMargin(0);
-                    }
-                });
-        } else {
-            this._positionStrategy.setOrigin(this._getConnectedElement());
-            overlayRef.updateSize({ width: this._getPanelWidth() });
-        }
-
-        if (overlayRef && !overlayRef.hasAttached()) {
-            overlayRef.attach(this._portal);
-            this._valueOnAttach = valueOnAttach;
-            this._valueOnLastKeydown = null;
-            this._closingActionsSubscription = this._subscribeToClosingActions();
-        }
-
-        const wasOpen = this.panelOpen;
-
-        this.autocomplete._isOpen = this._overlayAttached = true;
-        this.autocomplete._latestOpeningTrigger = this;
-        this._updatePanelState();
-        this._applyModalPanelOwnership();
-
-        if (this.panelOpen && wasOpen !== this.panelOpen) {
-            this._emitOpened();
-        }
-    }
-
-    private _handlePanelKeydown = (event: KeyboardEvent) => {
-        if (
-            (event.keyCode === ESCAPE && !hasModifierKey(event)) ||
-            (event.keyCode === UP_ARROW && hasModifierKey(event, 'altKey'))
-        ) {
-            if (this._pendingAutoselectedOption) {
-                this._updateNativeInputValue(this._valueBeforeAutoSelection ?? '');
-                this._pendingAutoselectedOption = null;
-            }
-            this._closeKeyEventStream.next();
-            this._resetActiveItem();
-            event.stopPropagation();
-            event.preventDefault();
-        }
-    };
-
-    private _updatePanelState() {
-        this.autocomplete._setVisibility();
-
-        if (this.panelOpen) {
-            const overlayRef = this._overlayRef!;
-
-            if (!this._keydownSubscription) {
-                this._keydownSubscription = overlayRef.keydownEvents().subscribe(this._handlePanelKeydown);
-            }
-
-            if (!this._outsideClickSubscription) {
-                this._outsideClickSubscription = overlayRef.outsidePointerEvents().subscribe();
-            }
-        } else {
-            this._keydownSubscription?.unsubscribe();
-            this._outsideClickSubscription?.unsubscribe();
-            this._keydownSubscription = this._outsideClickSubscription = null;
-        }
-    }
-
-    private _getOverlayConfig(): OverlayConfig {
-        return new OverlayConfig({
-            positionStrategy: this._getOverlayPosition(),
-            scrollStrategy: this._scrollStrategy(),
-            width: this._getPanelWidth(),
-            direction: this._dir ?? undefined,
-            hasBackdrop: this._defaults?.hasBackdrop,
-            backdropClass: this._defaults?.backdropClass || 'cdk-overlay-transparent-backdrop',
-            panelClass: this._overlayPanelClass,
-            disableAnimations: this._animationsDisabled,
-        });
-    }
-
-    private _getOverlayPosition(): PositionStrategy {
-        const strategy = createFlexibleConnectedPositionStrategy(this._injector, this._getConnectedElement())
-            .withFlexibleDimensions(false)
-            .withPush(false);
-
-        this._setStrategyPositions(strategy);
-        this._positionStrategy = strategy;
-        return strategy;
-    }
-
-    private _setStrategyPositions(positionStrategy: FlexibleConnectedPositionStrategy) {
-        const belowPositions: ConnectedPosition[] = [
-            { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top' },
-            { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top' },
-        ];
-
-        const panelClass = this._aboveClass;
-        const abovePositions: ConnectedPosition[] = [
-            { originX: 'start', originY: 'top', overlayX: 'start', overlayY: 'bottom', panelClass },
-            { originX: 'end', originY: 'top', overlayX: 'end', overlayY: 'bottom', panelClass },
-        ];
-
-        let positions: ConnectedPosition[];
-
-        if (this.position === 'above') {
-            positions = abovePositions;
-        } else if (this.position === 'below') {
-            positions = belowPositions;
-        } else {
-            positions = [...belowPositions, ...abovePositions];
-        }
-
-        positionStrategy.withPositions(positions);
-    }
-
-    private _getConnectedElement(): ElementRef<HTMLElement> {
-        if (this.connectedTo) {
-            return this.connectedTo.elementRef;
-        }
-
-        return this._element;
-    }
-
-    private _getPanelWidth(): number | string {
-        return this.autocomplete.panelWidth || this._getHostWidth();
-    }
-
-    private _getHostWidth(): number {
-        return this._getConnectedElement().nativeElement.getBoundingClientRect().width;
-    }
-
-    private _resetActiveItem(): void {
-        const autocomplete = this.autocomplete;
-
-        if (autocomplete.autoActiveFirstOption) {
-            let firstEnabledOptionIndex = -1;
-
-            for (let index = 0; index < autocomplete.options.length; index++) {
-                const option = autocomplete.options.get(index)!;
-                if (!option.disabled) {
-                    firstEnabledOptionIndex = index;
-                    break;
-                }
-            }
-            autocomplete._keyManager.setActiveItem(firstEnabledOptionIndex);
-        } else {
-            autocomplete._keyManager.setActiveItem(-1);
-        }
-    }
-
-    private _canOpen(): boolean {
-        const element = this._element.nativeElement;
-        return !element.readOnly && !element.disabled && !this.autocompleteDisabled;
-    }
-
-    private _scrollToOption(index: number): void {
-        const autocomplete = this.autocomplete;
-        const labelCount = _countGroupLabelsBeforeOption(index, autocomplete.options, autocomplete.optionGroups);
-
-        if (index === 0 && labelCount === 1) {
-            autocomplete._setScrollTop(0);
-        } else if (autocomplete.panel) {
-            const option = autocomplete.options.toArray()[index];
-
-            if (option) {
-                const element = option._getHostElement();
-                const newScrollPosition = _getOptionScrollPosition(
-                    element.offsetTop,
-                    element.offsetHeight,
-                    autocomplete._getScrollTop(),
-                    autocomplete.panel.nativeElement.offsetHeight
-                );
-
-                autocomplete._setScrollTop(newScrollPosition);
-            }
-        }
-    }
-
-    private _trackedModal: Element | null = null;
-
-    private _applyModalPanelOwnership() {
-        const modal = this._element.nativeElement.closest('body > .cdk-overlay-container [aria-modal="true"]');
-
-        if (!modal) {
-            return;
-        }
-
-        const panelId = this.autocomplete.id;
-
-        if (this._trackedModal) {
-            removeAriaReferencedId(this._trackedModal, 'aria-owns', panelId);
-        }
-
-        addAriaReferencedId(modal, 'aria-owns', panelId);
-        this._trackedModal = modal;
-    }
-
-    private _clearFromModal() {
-        if (this._trackedModal) {
-            const panelId = this.autocomplete.id;
-
-            removeAriaReferencedId(this._trackedModal, 'aria-owns', panelId);
-            this._trackedModal = null;
-        }
-    }
-}