[6a3a178] | 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 | }
|
---|