1 | /**
|
---|
2 | * @license
|
---|
3 | * Copyright Google LLC All Rights Reserved.
|
---|
4 | *
|
---|
5 | * Use of this source code is governed by an MIT-style license that can be
|
---|
6 | * found in the LICENSE file at https://angular.io/license
|
---|
7 | */
|
---|
8 | import { Platform } from '@angular/cdk/platform';
|
---|
9 | import { ElementRef, EventEmitter, InjectionToken, NgZone, OnDestroy, AfterViewInit } from '@angular/core';
|
---|
10 | import { Observable } from 'rxjs';
|
---|
11 | import { InputModalityDetector } from '../input-modality/input-modality-detector';
|
---|
12 | import * as ɵngcc0 from '@angular/core';
|
---|
13 | export declare type FocusOrigin = 'touch' | 'mouse' | 'keyboard' | 'program' | null;
|
---|
14 | /**
|
---|
15 | * Corresponds to the options that can be passed to the native `focus` event.
|
---|
16 | * via https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus
|
---|
17 | */
|
---|
18 | export interface FocusOptions {
|
---|
19 | /** Whether the browser should scroll to the element when it is focused. */
|
---|
20 | preventScroll?: boolean;
|
---|
21 | }
|
---|
22 | /** Detection mode used for attributing the origin of a focus event. */
|
---|
23 | export declare const enum FocusMonitorDetectionMode {
|
---|
24 | /**
|
---|
25 | * Any mousedown, keydown, or touchstart event that happened in the previous
|
---|
26 | * tick or the current tick will be used to assign a focus event's origin (to
|
---|
27 | * either mouse, keyboard, or touch). This is the default option.
|
---|
28 | */
|
---|
29 | IMMEDIATE = 0,
|
---|
30 | /**
|
---|
31 | * A focus event's origin is always attributed to the last corresponding
|
---|
32 | * mousedown, keydown, or touchstart event, no matter how long ago it occurred.
|
---|
33 | */
|
---|
34 | EVENTUAL = 1
|
---|
35 | }
|
---|
36 | /** Injectable service-level options for FocusMonitor. */
|
---|
37 | export interface FocusMonitorOptions {
|
---|
38 | detectionMode?: FocusMonitorDetectionMode;
|
---|
39 | }
|
---|
40 | /** InjectionToken for FocusMonitorOptions. */
|
---|
41 | export declare const FOCUS_MONITOR_DEFAULT_OPTIONS: InjectionToken<FocusMonitorOptions>;
|
---|
42 | /** Monitors mouse and keyboard events to determine the cause of focus events. */
|
---|
43 | export declare class FocusMonitor implements OnDestroy {
|
---|
44 | private _ngZone;
|
---|
45 | private _platform;
|
---|
46 | private readonly _inputModalityDetector;
|
---|
47 | /** The focus origin that the next focus event is a result of. */
|
---|
48 | private _origin;
|
---|
49 | /** The FocusOrigin of the last focus event tracked by the FocusMonitor. */
|
---|
50 | private _lastFocusOrigin;
|
---|
51 | /** Whether the window has just been focused. */
|
---|
52 | private _windowFocused;
|
---|
53 | /** The timeout id of the window focus timeout. */
|
---|
54 | private _windowFocusTimeoutId;
|
---|
55 | /** The timeout id of the origin clearing timeout. */
|
---|
56 | private _originTimeoutId;
|
---|
57 | /**
|
---|
58 | * Whether the origin was determined via a touch interaction. Necessary as properly attributing
|
---|
59 | * focus events to touch interactions requires special logic.
|
---|
60 | */
|
---|
61 | private _originFromTouchInteraction;
|
---|
62 | /** Map of elements being monitored to their info. */
|
---|
63 | private _elementInfo;
|
---|
64 | /** The number of elements currently being monitored. */
|
---|
65 | private _monitoredElementCount;
|
---|
66 | /**
|
---|
67 | * Keeps track of the root nodes to which we've currently bound a focus/blur handler,
|
---|
68 | * as well as the number of monitored elements that they contain. We have to treat focus/blur
|
---|
69 | * handlers differently from the rest of the events, because the browser won't emit events
|
---|
70 | * to the document when focus moves inside of a shadow root.
|
---|
71 | */
|
---|
72 | private _rootNodeFocusListenerCount;
|
---|
73 | /**
|
---|
74 | * The specified detection mode, used for attributing the origin of a focus
|
---|
75 | * event.
|
---|
76 | */
|
---|
77 | private readonly _detectionMode;
|
---|
78 | /**
|
---|
79 | * Event listener for `focus` events on the window.
|
---|
80 | * Needs to be an arrow function in order to preserve the context when it gets bound.
|
---|
81 | */
|
---|
82 | private _windowFocusListener;
|
---|
83 | /** Used to reference correct document/window */
|
---|
84 | protected _document?: Document;
|
---|
85 | /** Subject for stopping our InputModalityDetector subscription. */
|
---|
86 | private readonly _stopInputModalityDetector;
|
---|
87 | constructor(_ngZone: NgZone, _platform: Platform, _inputModalityDetector: InputModalityDetector,
|
---|
88 | /** @breaking-change 11.0.0 make document required */
|
---|
89 | document: any | null, options: FocusMonitorOptions | null);
|
---|
90 | /**
|
---|
91 | * Event listener for `focus` and 'blur' events on the document.
|
---|
92 | * Needs to be an arrow function in order to preserve the context when it gets bound.
|
---|
93 | */
|
---|
94 | private _rootNodeFocusAndBlurListener;
|
---|
95 | /**
|
---|
96 | * Monitors focus on an element and applies appropriate CSS classes.
|
---|
97 | * @param element The element to monitor
|
---|
98 | * @param checkChildren Whether to count the element as focused when its children are focused.
|
---|
99 | * @returns An observable that emits when the focus state of the element changes.
|
---|
100 | * When the element is blurred, null will be emitted.
|
---|
101 | */
|
---|
102 | monitor(element: HTMLElement, checkChildren?: boolean): Observable<FocusOrigin>;
|
---|
103 | /**
|
---|
104 | * Monitors focus on an element and applies appropriate CSS classes.
|
---|
105 | * @param element The element to monitor
|
---|
106 | * @param checkChildren Whether to count the element as focused when its children are focused.
|
---|
107 | * @returns An observable that emits when the focus state of the element changes.
|
---|
108 | * When the element is blurred, null will be emitted.
|
---|
109 | */
|
---|
110 | monitor(element: ElementRef<HTMLElement>, checkChildren?: boolean): Observable<FocusOrigin>;
|
---|
111 | /**
|
---|
112 | * Stops monitoring an element and removes all focus classes.
|
---|
113 | * @param element The element to stop monitoring.
|
---|
114 | */
|
---|
115 | stopMonitoring(element: HTMLElement): void;
|
---|
116 | /**
|
---|
117 | * Stops monitoring an element and removes all focus classes.
|
---|
118 | * @param element The element to stop monitoring.
|
---|
119 | */
|
---|
120 | stopMonitoring(element: ElementRef<HTMLElement>): void;
|
---|
121 | /**
|
---|
122 | * Focuses the element via the specified focus origin.
|
---|
123 | * @param element Element to focus.
|
---|
124 | * @param origin Focus origin.
|
---|
125 | * @param options Options that can be used to configure the focus behavior.
|
---|
126 | */
|
---|
127 | focusVia(element: HTMLElement, origin: FocusOrigin, options?: FocusOptions): void;
|
---|
128 | /**
|
---|
129 | * Focuses the element via the specified focus origin.
|
---|
130 | * @param element Element to focus.
|
---|
131 | * @param origin Focus origin.
|
---|
132 | * @param options Options that can be used to configure the focus behavior.
|
---|
133 | */
|
---|
134 | focusVia(element: ElementRef<HTMLElement>, origin: FocusOrigin, options?: FocusOptions): void;
|
---|
135 | ngOnDestroy(): void;
|
---|
136 | /** Access injected document if available or fallback to global document reference */
|
---|
137 | private _getDocument;
|
---|
138 | /** Use defaultView of injected document if available or fallback to global window reference */
|
---|
139 | private _getWindow;
|
---|
140 | private _toggleClass;
|
---|
141 | private _getFocusOrigin;
|
---|
142 | /**
|
---|
143 | * Returns whether the focus event should be attributed to touch. Recall that in IMMEDIATE mode, a
|
---|
144 | * touch origin isn't immediately reset at the next tick (see _setOrigin). This means that when we
|
---|
145 | * handle a focus event following a touch interaction, we need to determine whether (1) the focus
|
---|
146 | * event was directly caused by the touch interaction or (2) the focus event was caused by a
|
---|
147 | * subsequent programmatic focus call triggered by the touch interaction.
|
---|
148 | * @param focusEventTarget The target of the focus event under examination.
|
---|
149 | */
|
---|
150 | private _shouldBeAttributedToTouch;
|
---|
151 | /**
|
---|
152 | * Sets the focus classes on the element based on the given focus origin.
|
---|
153 | * @param element The element to update the classes on.
|
---|
154 | * @param origin The focus origin.
|
---|
155 | */
|
---|
156 | private _setClasses;
|
---|
157 | /**
|
---|
158 | * Updates the focus origin. If we're using immediate detection mode, we schedule an async
|
---|
159 | * function to clear the origin at the end of a timeout. The duration of the timeout depends on
|
---|
160 | * the origin being set.
|
---|
161 | * @param origin The origin to set.
|
---|
162 | * @param isFromInteraction Whether we are setting the origin from an interaction event.
|
---|
163 | */
|
---|
164 | private _setOrigin;
|
---|
165 | /**
|
---|
166 | * Handles focus events on a registered element.
|
---|
167 | * @param event The focus event.
|
---|
168 | * @param element The monitored element.
|
---|
169 | */
|
---|
170 | private _onFocus;
|
---|
171 | /**
|
---|
172 | * Handles blur events on a registered element.
|
---|
173 | * @param event The blur event.
|
---|
174 | * @param element The monitored element.
|
---|
175 | */
|
---|
176 | _onBlur(event: FocusEvent, element: HTMLElement): void;
|
---|
177 | private _emitOrigin;
|
---|
178 | private _registerGlobalListeners;
|
---|
179 | private _removeGlobalListeners;
|
---|
180 | /** Updates all the state on an element once its focus origin has changed. */
|
---|
181 | private _originChanged;
|
---|
182 | /**
|
---|
183 | * Collects the `MonitoredElementInfo` of a particular element and
|
---|
184 | * all of its ancestors that have enabled `checkChildren`.
|
---|
185 | * @param element Element from which to start the search.
|
---|
186 | */
|
---|
187 | private _getClosestElementsInfo;
|
---|
188 | static ɵfac: ɵngcc0.ɵɵFactoryDeclaration<FocusMonitor, [null, null, null, { optional: true; }, { optional: true; }]>;
|
---|
189 | }
|
---|
190 | /**
|
---|
191 | * Directive that determines how a particular element was focused (via keyboard, mouse, touch, or
|
---|
192 | * programmatically) and adds corresponding classes to the element.
|
---|
193 | *
|
---|
194 | * There are two variants of this directive:
|
---|
195 | * 1) cdkMonitorElementFocus: does not consider an element to be focused if one of its children is
|
---|
196 | * focused.
|
---|
197 | * 2) cdkMonitorSubtreeFocus: considers an element focused if it or any of its children are focused.
|
---|
198 | */
|
---|
199 | export declare class CdkMonitorFocus implements AfterViewInit, OnDestroy {
|
---|
200 | private _elementRef;
|
---|
201 | private _focusMonitor;
|
---|
202 | private _monitorSubscription;
|
---|
203 | readonly cdkFocusChange: EventEmitter<FocusOrigin>;
|
---|
204 | constructor(_elementRef: ElementRef<HTMLElement>, _focusMonitor: FocusMonitor);
|
---|
205 | ngAfterViewInit(): void;
|
---|
206 | ngOnDestroy(): void;
|
---|
207 | static ɵfac: ɵngcc0.ɵɵFactoryDeclaration<CdkMonitorFocus, never>;
|
---|
208 | static ɵdir: ɵngcc0.ɵɵDirectiveDeclaration<CdkMonitorFocus, "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", never, {}, { "cdkFocusChange": "cdkFocusChange"; }, never>;
|
---|
209 | }
|
---|
210 |
|
---|
211 | //# sourceMappingURL=focus-monitor.d.ts.map |
---|