/** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */ import { Platform } from '@angular/cdk/platform'; import { ElementRef, EventEmitter, InjectionToken, NgZone, OnDestroy, AfterViewInit } from '@angular/core'; import { Observable } from 'rxjs'; import { InputModalityDetector } from '../input-modality/input-modality-detector'; export declare type FocusOrigin = 'touch' | 'mouse' | 'keyboard' | 'program' | null; /** * Corresponds to the options that can be passed to the native `focus` event. * via https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus */ export interface FocusOptions { /** Whether the browser should scroll to the element when it is focused. */ preventScroll?: boolean; } /** Detection mode used for attributing the origin of a focus event. */ export declare const enum FocusMonitorDetectionMode { /** * Any mousedown, keydown, or touchstart event that happened in the previous * tick or the current tick will be used to assign a focus event's origin (to * either mouse, keyboard, or touch). This is the default option. */ IMMEDIATE = 0, /** * A focus event's origin is always attributed to the last corresponding * mousedown, keydown, or touchstart event, no matter how long ago it occurred. */ EVENTUAL = 1 } /** Injectable service-level options for FocusMonitor. */ export interface FocusMonitorOptions { detectionMode?: FocusMonitorDetectionMode; } /** InjectionToken for FocusMonitorOptions. */ export declare const FOCUS_MONITOR_DEFAULT_OPTIONS: InjectionToken; /** Monitors mouse and keyboard events to determine the cause of focus events. */ export declare class FocusMonitor implements OnDestroy { private _ngZone; private _platform; private readonly _inputModalityDetector; /** The focus origin that the next focus event is a result of. */ private _origin; /** The FocusOrigin of the last focus event tracked by the FocusMonitor. */ private _lastFocusOrigin; /** Whether the window has just been focused. */ private _windowFocused; /** The timeout id of the window focus timeout. */ private _windowFocusTimeoutId; /** The timeout id of the origin clearing timeout. */ private _originTimeoutId; /** * Whether the origin was determined via a touch interaction. Necessary as properly attributing * focus events to touch interactions requires special logic. */ private _originFromTouchInteraction; /** Map of elements being monitored to their info. */ private _elementInfo; /** The number of elements currently being monitored. */ private _monitoredElementCount; /** * Keeps track of the root nodes to which we've currently bound a focus/blur handler, * as well as the number of monitored elements that they contain. We have to treat focus/blur * handlers differently from the rest of the events, because the browser won't emit events * to the document when focus moves inside of a shadow root. */ private _rootNodeFocusListenerCount; /** * The specified detection mode, used for attributing the origin of a focus * event. */ private readonly _detectionMode; /** * Event listener for `focus` events on the window. * Needs to be an arrow function in order to preserve the context when it gets bound. */ private _windowFocusListener; /** Used to reference correct document/window */ protected _document?: Document; /** Subject for stopping our InputModalityDetector subscription. */ private readonly _stopInputModalityDetector; constructor(_ngZone: NgZone, _platform: Platform, _inputModalityDetector: InputModalityDetector, /** @breaking-change 11.0.0 make document required */ document: any | null, options: FocusMonitorOptions | null); /** * Event listener for `focus` and 'blur' events on the document. * Needs to be an arrow function in order to preserve the context when it gets bound. */ private _rootNodeFocusAndBlurListener; /** * Monitors focus on an element and applies appropriate CSS classes. * @param element The element to monitor * @param checkChildren Whether to count the element as focused when its children are focused. * @returns An observable that emits when the focus state of the element changes. * When the element is blurred, null will be emitted. */ monitor(element: HTMLElement, checkChildren?: boolean): Observable; /** * Monitors focus on an element and applies appropriate CSS classes. * @param element The element to monitor * @param checkChildren Whether to count the element as focused when its children are focused. * @returns An observable that emits when the focus state of the element changes. * When the element is blurred, null will be emitted. */ monitor(element: ElementRef, checkChildren?: boolean): Observable; /** * Stops monitoring an element and removes all focus classes. * @param element The element to stop monitoring. */ stopMonitoring(element: HTMLElement): void; /** * Stops monitoring an element and removes all focus classes. * @param element The element to stop monitoring. */ stopMonitoring(element: ElementRef): void; /** * Focuses the element via the specified focus origin. * @param element Element to focus. * @param origin Focus origin. * @param options Options that can be used to configure the focus behavior. */ focusVia(element: HTMLElement, origin: FocusOrigin, options?: FocusOptions): void; /** * Focuses the element via the specified focus origin. * @param element Element to focus. * @param origin Focus origin. * @param options Options that can be used to configure the focus behavior. */ focusVia(element: ElementRef, origin: FocusOrigin, options?: FocusOptions): void; ngOnDestroy(): void; /** Access injected document if available or fallback to global document reference */ private _getDocument; /** Use defaultView of injected document if available or fallback to global window reference */ private _getWindow; private _toggleClass; private _getFocusOrigin; /** * Returns whether the focus event should be attributed to touch. Recall that in IMMEDIATE mode, a * touch origin isn't immediately reset at the next tick (see _setOrigin). This means that when we * handle a focus event following a touch interaction, we need to determine whether (1) the focus * event was directly caused by the touch interaction or (2) the focus event was caused by a * subsequent programmatic focus call triggered by the touch interaction. * @param focusEventTarget The target of the focus event under examination. */ private _shouldBeAttributedToTouch; /** * Sets the focus classes on the element based on the given focus origin. * @param element The element to update the classes on. * @param origin The focus origin. */ private _setClasses; /** * Updates the focus origin. If we're using immediate detection mode, we schedule an async * function to clear the origin at the end of a timeout. The duration of the timeout depends on * the origin being set. * @param origin The origin to set. * @param isFromInteraction Whether we are setting the origin from an interaction event. */ private _setOrigin; /** * Handles focus events on a registered element. * @param event The focus event. * @param element The monitored element. */ private _onFocus; /** * Handles blur events on a registered element. * @param event The blur event. * @param element The monitored element. */ _onBlur(event: FocusEvent, element: HTMLElement): void; private _emitOrigin; private _registerGlobalListeners; private _removeGlobalListeners; /** Updates all the state on an element once its focus origin has changed. */ private _originChanged; /** * Collects the `MonitoredElementInfo` of a particular element and * all of its ancestors that have enabled `checkChildren`. * @param element Element from which to start the search. */ private _getClosestElementsInfo; } /** * Directive that determines how a particular element was focused (via keyboard, mouse, touch, or * programmatically) and adds corresponding classes to the element. * * There are two variants of this directive: * 1) cdkMonitorElementFocus: does not consider an element to be focused if one of its children is * focused. * 2) cdkMonitorSubtreeFocus: considers an element focused if it or any of its children are focused. */ export declare class CdkMonitorFocus implements AfterViewInit, OnDestroy { private _elementRef; private _focusMonitor; private _monitorSubscription; readonly cdkFocusChange: EventEmitter; constructor(_elementRef: ElementRef, _focusMonitor: FocusMonitor); ngAfterViewInit(): void; ngOnDestroy(): void; }