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 { AnimationEvent } from '@angular/animations';
|
---|
9 | import { FocusMonitor, FocusOrigin, FocusTrapFactory } from '@angular/cdk/a11y';
|
---|
10 | import { Directionality } from '@angular/cdk/bidi';
|
---|
11 | import { BooleanInput } from '@angular/cdk/coercion';
|
---|
12 | import { Platform } from '@angular/cdk/platform';
|
---|
13 | import { CdkScrollable, ScrollDispatcher, ViewportRuler } from '@angular/cdk/scrolling';
|
---|
14 | import { AfterContentChecked, AfterContentInit, ChangeDetectorRef, DoCheck, ElementRef, EventEmitter, InjectionToken, NgZone, OnDestroy, QueryList } from '@angular/core';
|
---|
15 | import { Observable, Subject } from 'rxjs';
|
---|
16 | /**
|
---|
17 | * Throws an exception when two MatDrawer are matching the same position.
|
---|
18 | * @docs-private
|
---|
19 | */
|
---|
20 | export declare function throwMatDuplicatedDrawerError(position: string): void;
|
---|
21 | /** Result of the toggle promise that indicates the state of the drawer. */
|
---|
22 | export declare type MatDrawerToggleResult = 'open' | 'close';
|
---|
23 | /** Drawer and SideNav display modes. */
|
---|
24 | export declare type MatDrawerMode = 'over' | 'push' | 'side';
|
---|
25 | /** Configures whether drawers should use auto sizing by default. */
|
---|
26 | export declare const MAT_DRAWER_DEFAULT_AUTOSIZE: InjectionToken<boolean>;
|
---|
27 | /**
|
---|
28 | * Used to provide a drawer container to a drawer while avoiding circular references.
|
---|
29 | * @docs-private
|
---|
30 | */
|
---|
31 | export declare const MAT_DRAWER_CONTAINER: InjectionToken<unknown>;
|
---|
32 | /** @docs-private */
|
---|
33 | export declare function MAT_DRAWER_DEFAULT_AUTOSIZE_FACTORY(): boolean;
|
---|
34 | export declare class MatDrawerContent extends CdkScrollable implements AfterContentInit {
|
---|
35 | private _changeDetectorRef;
|
---|
36 | _container: MatDrawerContainer;
|
---|
37 | constructor(_changeDetectorRef: ChangeDetectorRef, _container: MatDrawerContainer, elementRef: ElementRef<HTMLElement>, scrollDispatcher: ScrollDispatcher, ngZone: NgZone);
|
---|
38 | ngAfterContentInit(): void;
|
---|
39 | }
|
---|
40 | /**
|
---|
41 | * This component corresponds to a drawer that can be opened on the drawer container.
|
---|
42 | */
|
---|
43 | export declare class MatDrawer implements AfterContentInit, AfterContentChecked, OnDestroy {
|
---|
44 | private _elementRef;
|
---|
45 | private _focusTrapFactory;
|
---|
46 | private _focusMonitor;
|
---|
47 | private _platform;
|
---|
48 | private _ngZone;
|
---|
49 | private _doc;
|
---|
50 | _container?: MatDrawerContainer | undefined;
|
---|
51 | private _focusTrap;
|
---|
52 | private _elementFocusedBeforeDrawerWasOpened;
|
---|
53 | /** Whether the drawer is initialized. Used for disabling the initial animation. */
|
---|
54 | private _enableAnimations;
|
---|
55 | /** The side that the drawer is attached to. */
|
---|
56 | get position(): 'start' | 'end';
|
---|
57 | set position(value: 'start' | 'end');
|
---|
58 | private _position;
|
---|
59 | /** Mode of the drawer; one of 'over', 'push' or 'side'. */
|
---|
60 | get mode(): MatDrawerMode;
|
---|
61 | set mode(value: MatDrawerMode);
|
---|
62 | private _mode;
|
---|
63 | /** Whether the drawer can be closed with the escape key or by clicking on the backdrop. */
|
---|
64 | get disableClose(): boolean;
|
---|
65 | set disableClose(value: boolean);
|
---|
66 | private _disableClose;
|
---|
67 | /**
|
---|
68 | * Whether the drawer should focus the first focusable element automatically when opened.
|
---|
69 | * Defaults to false in when `mode` is set to `side`, otherwise defaults to `true`. If explicitly
|
---|
70 | * enabled, focus will be moved into the sidenav in `side` mode as well.
|
---|
71 | */
|
---|
72 | get autoFocus(): boolean;
|
---|
73 | set autoFocus(value: boolean);
|
---|
74 | private _autoFocus;
|
---|
75 | /**
|
---|
76 | * Whether the drawer is opened. We overload this because we trigger an event when it
|
---|
77 | * starts or end.
|
---|
78 | */
|
---|
79 | get opened(): boolean;
|
---|
80 | set opened(value: boolean);
|
---|
81 | private _opened;
|
---|
82 | /** How the sidenav was opened (keypress, mouse click etc.) */
|
---|
83 | private _openedVia;
|
---|
84 | /** Emits whenever the drawer has started animating. */
|
---|
85 | readonly _animationStarted: Subject<AnimationEvent>;
|
---|
86 | /** Emits whenever the drawer is done animating. */
|
---|
87 | readonly _animationEnd: Subject<AnimationEvent>;
|
---|
88 | /** Current state of the sidenav animation. */
|
---|
89 | _animationState: 'open-instant' | 'open' | 'void';
|
---|
90 | /** Event emitted when the drawer open state is changed. */
|
---|
91 | readonly openedChange: EventEmitter<boolean>;
|
---|
92 | /** Event emitted when the drawer has been opened. */
|
---|
93 | readonly _openedStream: Observable<void>;
|
---|
94 | /** Event emitted when the drawer has started opening. */
|
---|
95 | readonly openedStart: Observable<void>;
|
---|
96 | /** Event emitted when the drawer has been closed. */
|
---|
97 | readonly _closedStream: Observable<void>;
|
---|
98 | /** Event emitted when the drawer has started closing. */
|
---|
99 | readonly closedStart: Observable<void>;
|
---|
100 | /** Emits when the component is destroyed. */
|
---|
101 | private readonly _destroyed;
|
---|
102 | /** Event emitted when the drawer's position changes. */
|
---|
103 | readonly onPositionChanged: EventEmitter<void>;
|
---|
104 | /**
|
---|
105 | * An observable that emits when the drawer mode changes. This is used by the drawer container to
|
---|
106 | * to know when to when the mode changes so it can adapt the margins on the content.
|
---|
107 | */
|
---|
108 | readonly _modeChanged: Subject<void>;
|
---|
109 | constructor(_elementRef: ElementRef<HTMLElement>, _focusTrapFactory: FocusTrapFactory, _focusMonitor: FocusMonitor, _platform: Platform, _ngZone: NgZone, _doc: any, _container?: MatDrawerContainer | undefined);
|
---|
110 | /**
|
---|
111 | * Moves focus into the drawer. Note that this works even if
|
---|
112 | * the focus trap is disabled in `side` mode.
|
---|
113 | */
|
---|
114 | private _takeFocus;
|
---|
115 | /**
|
---|
116 | * Restores focus to the element that was originally focused when the drawer opened.
|
---|
117 | * If no element was focused at that time, the focus will be restored to the drawer.
|
---|
118 | */
|
---|
119 | private _restoreFocus;
|
---|
120 | /** Whether focus is currently within the drawer. */
|
---|
121 | private _isFocusWithinDrawer;
|
---|
122 | ngAfterContentInit(): void;
|
---|
123 | ngAfterContentChecked(): void;
|
---|
124 | ngOnDestroy(): void;
|
---|
125 | /**
|
---|
126 | * Open the drawer.
|
---|
127 | * @param openedVia Whether the drawer was opened by a key press, mouse click or programmatically.
|
---|
128 | * Used for focus management after the sidenav is closed.
|
---|
129 | */
|
---|
130 | open(openedVia?: FocusOrigin): Promise<MatDrawerToggleResult>;
|
---|
131 | /** Close the drawer. */
|
---|
132 | close(): Promise<MatDrawerToggleResult>;
|
---|
133 | /** Closes the drawer with context that the backdrop was clicked. */
|
---|
134 | _closeViaBackdropClick(): Promise<MatDrawerToggleResult>;
|
---|
135 | /**
|
---|
136 | * Toggle this drawer.
|
---|
137 | * @param isOpen Whether the drawer should be open.
|
---|
138 | * @param openedVia Whether the drawer was opened by a key press, mouse click or programmatically.
|
---|
139 | * Used for focus management after the sidenav is closed.
|
---|
140 | */
|
---|
141 | toggle(isOpen?: boolean, openedVia?: FocusOrigin): Promise<MatDrawerToggleResult>;
|
---|
142 | /**
|
---|
143 | * Toggles the opened state of the drawer.
|
---|
144 | * @param isOpen Whether the drawer should open or close.
|
---|
145 | * @param restoreFocus Whether focus should be restored on close.
|
---|
146 | * @param openedVia Focus origin that can be optionally set when opening a drawer. The
|
---|
147 | * origin will be used later when focus is restored on drawer close.
|
---|
148 | */
|
---|
149 | private _setOpen;
|
---|
150 | _getWidth(): number;
|
---|
151 | /** Updates the enabled state of the focus trap. */
|
---|
152 | private _updateFocusTrapState;
|
---|
153 | _animationStartListener(event: AnimationEvent): void;
|
---|
154 | _animationDoneListener(event: AnimationEvent): void;
|
---|
155 | static ngAcceptInputType_disableClose: BooleanInput;
|
---|
156 | static ngAcceptInputType_autoFocus: BooleanInput;
|
---|
157 | static ngAcceptInputType_opened: BooleanInput;
|
---|
158 | }
|
---|
159 | /**
|
---|
160 | * `<mat-drawer-container>` component.
|
---|
161 | *
|
---|
162 | * This is the parent component to one or two `<mat-drawer>`s that validates the state internally
|
---|
163 | * and coordinates the backdrop and content styling.
|
---|
164 | */
|
---|
165 | export declare class MatDrawerContainer implements AfterContentInit, DoCheck, OnDestroy {
|
---|
166 | private _dir;
|
---|
167 | private _element;
|
---|
168 | private _ngZone;
|
---|
169 | private _changeDetectorRef;
|
---|
170 | private _animationMode?;
|
---|
171 | /** All drawers in the container. Includes drawers from inside nested containers. */
|
---|
172 | _allDrawers: QueryList<MatDrawer>;
|
---|
173 | /** Drawers that belong to this container. */
|
---|
174 | _drawers: QueryList<MatDrawer>;
|
---|
175 | _content: MatDrawerContent;
|
---|
176 | _userContent: MatDrawerContent;
|
---|
177 | /** The drawer child with the `start` position. */
|
---|
178 | get start(): MatDrawer | null;
|
---|
179 | /** The drawer child with the `end` position. */
|
---|
180 | get end(): MatDrawer | null;
|
---|
181 | /**
|
---|
182 | * Whether to automatically resize the container whenever
|
---|
183 | * the size of any of its drawers changes.
|
---|
184 | *
|
---|
185 | * **Use at your own risk!** Enabling this option can cause layout thrashing by measuring
|
---|
186 | * the drawers on every change detection cycle. Can be configured globally via the
|
---|
187 | * `MAT_DRAWER_DEFAULT_AUTOSIZE` token.
|
---|
188 | */
|
---|
189 | get autosize(): boolean;
|
---|
190 | set autosize(value: boolean);
|
---|
191 | private _autosize;
|
---|
192 | /**
|
---|
193 | * Whether the drawer container should have a backdrop while one of the sidenavs is open.
|
---|
194 | * If explicitly set to `true`, the backdrop will be enabled for drawers in the `side`
|
---|
195 | * mode as well.
|
---|
196 | */
|
---|
197 | get hasBackdrop(): any;
|
---|
198 | set hasBackdrop(value: any);
|
---|
199 | _backdropOverride: boolean | null;
|
---|
200 | /** Event emitted when the drawer backdrop is clicked. */
|
---|
201 | readonly backdropClick: EventEmitter<void>;
|
---|
202 | /** The drawer at the start/end position, independent of direction. */
|
---|
203 | private _start;
|
---|
204 | private _end;
|
---|
205 | /**
|
---|
206 | * The drawer at the left/right. When direction changes, these will change as well.
|
---|
207 | * They're used as aliases for the above to set the left/right style properly.
|
---|
208 | * In LTR, _left == _start and _right == _end.
|
---|
209 | * In RTL, _left == _end and _right == _start.
|
---|
210 | */
|
---|
211 | private _left;
|
---|
212 | private _right;
|
---|
213 | /** Emits when the component is destroyed. */
|
---|
214 | private readonly _destroyed;
|
---|
215 | /** Emits on every ngDoCheck. Used for debouncing reflows. */
|
---|
216 | private readonly _doCheckSubject;
|
---|
217 | /**
|
---|
218 | * Margins to be applied to the content. These are used to push / shrink the drawer content when a
|
---|
219 | * drawer is open. We use margin rather than transform even for push mode because transform breaks
|
---|
220 | * fixed position elements inside of the transformed element.
|
---|
221 | */
|
---|
222 | _contentMargins: {
|
---|
223 | left: number | null;
|
---|
224 | right: number | null;
|
---|
225 | };
|
---|
226 | readonly _contentMarginChanges: Subject<{
|
---|
227 | left: number | null;
|
---|
228 | right: number | null;
|
---|
229 | }>;
|
---|
230 | /** Reference to the CdkScrollable instance that wraps the scrollable content. */
|
---|
231 | get scrollable(): CdkScrollable;
|
---|
232 | constructor(_dir: Directionality, _element: ElementRef<HTMLElement>, _ngZone: NgZone, _changeDetectorRef: ChangeDetectorRef, viewportRuler: ViewportRuler, defaultAutosize?: boolean, _animationMode?: string | undefined);
|
---|
233 | ngAfterContentInit(): void;
|
---|
234 | ngOnDestroy(): void;
|
---|
235 | /** Calls `open` of both start and end drawers */
|
---|
236 | open(): void;
|
---|
237 | /** Calls `close` of both start and end drawers */
|
---|
238 | close(): void;
|
---|
239 | /**
|
---|
240 | * Recalculates and updates the inline styles for the content. Note that this should be used
|
---|
241 | * sparingly, because it causes a reflow.
|
---|
242 | */
|
---|
243 | updateContentMargins(): void;
|
---|
244 | ngDoCheck(): void;
|
---|
245 | /**
|
---|
246 | * Subscribes to drawer events in order to set a class on the main container element when the
|
---|
247 | * drawer is open and the backdrop is visible. This ensures any overflow on the container element
|
---|
248 | * is properly hidden.
|
---|
249 | */
|
---|
250 | private _watchDrawerToggle;
|
---|
251 | /**
|
---|
252 | * Subscribes to drawer onPositionChanged event in order to
|
---|
253 | * re-validate drawers when the position changes.
|
---|
254 | */
|
---|
255 | private _watchDrawerPosition;
|
---|
256 | /** Subscribes to changes in drawer mode so we can run change detection. */
|
---|
257 | private _watchDrawerMode;
|
---|
258 | /** Toggles the 'mat-drawer-opened' class on the main 'mat-drawer-container' element. */
|
---|
259 | private _setContainerClass;
|
---|
260 | /** Validate the state of the drawer children components. */
|
---|
261 | private _validateDrawers;
|
---|
262 | /** Whether the container is being pushed to the side by one of the drawers. */
|
---|
263 | private _isPushed;
|
---|
264 | _onBackdropClicked(): void;
|
---|
265 | _closeModalDrawersViaBackdrop(): void;
|
---|
266 | _isShowingBackdrop(): boolean;
|
---|
267 | private _canHaveBackdrop;
|
---|
268 | private _isDrawerOpen;
|
---|
269 | static ngAcceptInputType_autosize: BooleanInput;
|
---|
270 | static ngAcceptInputType_hasBackdrop: BooleanInput;
|
---|
271 | }
|
---|