index.d.ts 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352
  1. import * as i0 from '@angular/core';
  2. import { InjectionToken, AfterContentInit, AfterViewInit, OnDestroy, EventEmitter, ElementRef, DoCheck, QueryList } from '@angular/core';
  3. import { M as MatCommonModule } from '../common-module.d-C8xzHJDr.js';
  4. import * as i5 from '@angular/cdk/scrolling';
  5. import { CdkScrollable } from '@angular/cdk/scrolling';
  6. import { FocusOrigin } from '@angular/cdk/a11y';
  7. import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
  8. import { Subject, Observable } from 'rxjs';
  9. import '@angular/cdk/bidi';
  10. /**
  11. * Throws an exception when two MatDrawer are matching the same position.
  12. * @docs-private
  13. */
  14. declare function throwMatDuplicatedDrawerError(position: string): void;
  15. /** Options for where to set focus to automatically on dialog open */
  16. type AutoFocusTarget = 'dialog' | 'first-tabbable' | 'first-heading';
  17. /** Result of the toggle promise that indicates the state of the drawer. */
  18. type MatDrawerToggleResult = 'open' | 'close';
  19. /** Drawer and SideNav display modes. */
  20. type MatDrawerMode = 'over' | 'push' | 'side';
  21. /** Configures whether drawers should use auto sizing by default. */
  22. declare const MAT_DRAWER_DEFAULT_AUTOSIZE: InjectionToken<boolean>;
  23. /**
  24. * @docs-private
  25. * @deprecated No longer used, will be removed.
  26. * @breaking-change 21.0.0
  27. */
  28. declare function MAT_DRAWER_DEFAULT_AUTOSIZE_FACTORY(): boolean;
  29. declare class MatDrawerContent extends CdkScrollable implements AfterContentInit {
  30. private _platform;
  31. private _changeDetectorRef;
  32. _container: MatDrawerContainer;
  33. constructor(...args: unknown[]);
  34. ngAfterContentInit(): void;
  35. /** Determines whether the content element should be hidden from the user. */
  36. protected _shouldBeHidden(): boolean;
  37. static ɵfac: i0.ɵɵFactoryDeclaration<MatDrawerContent, never>;
  38. static ɵcmp: i0.ɵɵComponentDeclaration<MatDrawerContent, "mat-drawer-content", never, {}, {}, never, ["*"], true, never>;
  39. }
  40. /**
  41. * This component corresponds to a drawer that can be opened on the drawer container.
  42. */
  43. declare class MatDrawer implements AfterViewInit, OnDestroy {
  44. private _elementRef;
  45. private _focusTrapFactory;
  46. private _focusMonitor;
  47. private _platform;
  48. private _ngZone;
  49. private _renderer;
  50. private readonly _interactivityChecker;
  51. private _doc;
  52. _container?: MatDrawerContainer | null | undefined;
  53. private _focusTrap;
  54. private _elementFocusedBeforeDrawerWasOpened;
  55. private _eventCleanups;
  56. /** Whether the view of the component has been attached. */
  57. private _isAttached;
  58. /** Anchor node used to restore the drawer to its initial position. */
  59. private _anchor;
  60. /** The side that the drawer is attached to. */
  61. get position(): 'start' | 'end';
  62. set position(value: 'start' | 'end');
  63. private _position;
  64. /** Mode of the drawer; one of 'over', 'push' or 'side'. */
  65. get mode(): MatDrawerMode;
  66. set mode(value: MatDrawerMode);
  67. private _mode;
  68. /** Whether the drawer can be closed with the escape key or by clicking on the backdrop. */
  69. get disableClose(): boolean;
  70. set disableClose(value: BooleanInput);
  71. private _disableClose;
  72. /**
  73. * Whether the drawer should focus the first focusable element automatically when opened.
  74. * Defaults to false in when `mode` is set to `side`, otherwise defaults to `true`. If explicitly
  75. * enabled, focus will be moved into the sidenav in `side` mode as well.
  76. * @breaking-change 14.0.0 Remove boolean option from autoFocus. Use string or AutoFocusTarget
  77. * instead.
  78. */
  79. get autoFocus(): AutoFocusTarget | string | boolean;
  80. set autoFocus(value: AutoFocusTarget | string | BooleanInput);
  81. private _autoFocus;
  82. /**
  83. * Whether the drawer is opened. We overload this because we trigger an event when it
  84. * starts or end.
  85. */
  86. get opened(): boolean;
  87. set opened(value: BooleanInput);
  88. private _opened;
  89. /** How the sidenav was opened (keypress, mouse click etc.) */
  90. private _openedVia;
  91. /** Emits whenever the drawer has started animating. */
  92. readonly _animationStarted: Subject<unknown>;
  93. /** Emits whenever the drawer is done animating. */
  94. readonly _animationEnd: Subject<unknown>;
  95. /** Event emitted when the drawer open state is changed. */
  96. readonly openedChange: EventEmitter<boolean>;
  97. /** Event emitted when the drawer has been opened. */
  98. readonly _openedStream: Observable<void>;
  99. /** Event emitted when the drawer has started opening. */
  100. readonly openedStart: Observable<void>;
  101. /** Event emitted when the drawer has been closed. */
  102. readonly _closedStream: Observable<void>;
  103. /** Event emitted when the drawer has started closing. */
  104. readonly closedStart: Observable<void>;
  105. /** Emits when the component is destroyed. */
  106. private readonly _destroyed;
  107. /** Event emitted when the drawer's position changes. */
  108. readonly onPositionChanged: EventEmitter<void>;
  109. /** Reference to the inner element that contains all the content. */
  110. _content: ElementRef<HTMLElement>;
  111. /**
  112. * An observable that emits when the drawer mode changes. This is used by the drawer container to
  113. * to know when to when the mode changes so it can adapt the margins on the content.
  114. */
  115. readonly _modeChanged: Subject<void>;
  116. private _injector;
  117. private _changeDetectorRef;
  118. constructor(...args: unknown[]);
  119. /**
  120. * Focuses the provided element. If the element is not focusable, it will add a tabIndex
  121. * attribute to forcefully focus it. The attribute is removed after focus is moved.
  122. * @param element The element to focus.
  123. */
  124. private _forceFocus;
  125. /**
  126. * Focuses the first element that matches the given selector within the focus trap.
  127. * @param selector The CSS selector for the element to set focus to.
  128. */
  129. private _focusByCssSelector;
  130. /**
  131. * Moves focus into the drawer. Note that this works even if
  132. * the focus trap is disabled in `side` mode.
  133. */
  134. private _takeFocus;
  135. /**
  136. * Restores focus to the element that was originally focused when the drawer opened.
  137. * If no element was focused at that time, the focus will be restored to the drawer.
  138. */
  139. private _restoreFocus;
  140. /** Whether focus is currently within the drawer. */
  141. private _isFocusWithinDrawer;
  142. ngAfterViewInit(): void;
  143. ngOnDestroy(): void;
  144. /**
  145. * Open the drawer.
  146. * @param openedVia Whether the drawer was opened by a key press, mouse click or programmatically.
  147. * Used for focus management after the sidenav is closed.
  148. */
  149. open(openedVia?: FocusOrigin): Promise<MatDrawerToggleResult>;
  150. /** Close the drawer. */
  151. close(): Promise<MatDrawerToggleResult>;
  152. /** Closes the drawer with context that the backdrop was clicked. */
  153. _closeViaBackdropClick(): Promise<MatDrawerToggleResult>;
  154. /**
  155. * Toggle this drawer.
  156. * @param isOpen Whether the drawer should be open.
  157. * @param openedVia Whether the drawer was opened by a key press, mouse click or programmatically.
  158. * Used for focus management after the sidenav is closed.
  159. */
  160. toggle(isOpen?: boolean, openedVia?: FocusOrigin): Promise<MatDrawerToggleResult>;
  161. /**
  162. * Toggles the opened state of the drawer.
  163. * @param isOpen Whether the drawer should open or close.
  164. * @param restoreFocus Whether focus should be restored on close.
  165. * @param focusOrigin Origin to use when restoring focus.
  166. */
  167. private _setOpen;
  168. /** Toggles whether the drawer is currently animating. */
  169. private _setIsAnimating;
  170. _getWidth(): number;
  171. /** Updates the enabled state of the focus trap. */
  172. private _updateFocusTrapState;
  173. /**
  174. * Updates the position of the drawer in the DOM. We need to move the element around ourselves
  175. * when it's in the `end` position so that it comes after the content and the visual order
  176. * matches the tab order. We also need to be able to move it back to `start` if the sidenav
  177. * started off as `end` and was changed to `start`.
  178. */
  179. private _updatePositionInParent;
  180. /** Event handler for animation events. */
  181. private _handleTransitionEvent;
  182. static ɵfac: i0.ɵɵFactoryDeclaration<MatDrawer, never>;
  183. static ɵcmp: i0.ɵɵComponentDeclaration<MatDrawer, "mat-drawer", ["matDrawer"], { "position": { "alias": "position"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "disableClose": { "alias": "disableClose"; "required": false; }; "autoFocus": { "alias": "autoFocus"; "required": false; }; "opened": { "alias": "opened"; "required": false; }; }, { "openedChange": "openedChange"; "_openedStream": "opened"; "openedStart": "openedStart"; "_closedStream": "closed"; "closedStart": "closedStart"; "onPositionChanged": "positionChanged"; }, never, ["*"], true, never>;
  184. }
  185. /**
  186. * `<mat-drawer-container>` component.
  187. *
  188. * This is the parent component to one or two `<mat-drawer>`s that validates the state internally
  189. * and coordinates the backdrop and content styling.
  190. */
  191. declare class MatDrawerContainer implements AfterContentInit, DoCheck, OnDestroy {
  192. private _dir;
  193. private _element;
  194. private _ngZone;
  195. private _changeDetectorRef;
  196. private _animationMode;
  197. _transitionsEnabled: boolean;
  198. /** All drawers in the container. Includes drawers from inside nested containers. */
  199. _allDrawers: QueryList<MatDrawer>;
  200. /** Drawers that belong to this container. */
  201. _drawers: QueryList<MatDrawer>;
  202. _content: MatDrawerContent;
  203. _userContent: MatDrawerContent;
  204. /** The drawer child with the `start` position. */
  205. get start(): MatDrawer | null;
  206. /** The drawer child with the `end` position. */
  207. get end(): MatDrawer | null;
  208. /**
  209. * Whether to automatically resize the container whenever
  210. * the size of any of its drawers changes.
  211. *
  212. * **Use at your own risk!** Enabling this option can cause layout thrashing by measuring
  213. * the drawers on every change detection cycle. Can be configured globally via the
  214. * `MAT_DRAWER_DEFAULT_AUTOSIZE` token.
  215. */
  216. get autosize(): boolean;
  217. set autosize(value: BooleanInput);
  218. private _autosize;
  219. /**
  220. * Whether the drawer container should have a backdrop while one of the sidenavs is open.
  221. * If explicitly set to `true`, the backdrop will be enabled for drawers in the `side`
  222. * mode as well.
  223. */
  224. get hasBackdrop(): boolean;
  225. set hasBackdrop(value: BooleanInput);
  226. _backdropOverride: boolean | null;
  227. /** Event emitted when the drawer backdrop is clicked. */
  228. readonly backdropClick: EventEmitter<void>;
  229. /** The drawer at the start/end position, independent of direction. */
  230. private _start;
  231. private _end;
  232. /**
  233. * The drawer at the left/right. When direction changes, these will change as well.
  234. * They're used as aliases for the above to set the left/right style properly.
  235. * In LTR, _left == _start and _right == _end.
  236. * In RTL, _left == _end and _right == _start.
  237. */
  238. private _left;
  239. private _right;
  240. /** Emits when the component is destroyed. */
  241. private readonly _destroyed;
  242. /** Emits on every ngDoCheck. Used for debouncing reflows. */
  243. private readonly _doCheckSubject;
  244. /**
  245. * Margins to be applied to the content. These are used to push / shrink the drawer content when a
  246. * drawer is open. We use margin rather than transform even for push mode because transform breaks
  247. * fixed position elements inside of the transformed element.
  248. */
  249. _contentMargins: {
  250. left: number | null;
  251. right: number | null;
  252. };
  253. readonly _contentMarginChanges: Subject<{
  254. left: number | null;
  255. right: number | null;
  256. }>;
  257. /** Reference to the CdkScrollable instance that wraps the scrollable content. */
  258. get scrollable(): CdkScrollable;
  259. private _injector;
  260. constructor(...args: unknown[]);
  261. ngAfterContentInit(): void;
  262. ngOnDestroy(): void;
  263. /** Calls `open` of both start and end drawers */
  264. open(): void;
  265. /** Calls `close` of both start and end drawers */
  266. close(): void;
  267. /**
  268. * Recalculates and updates the inline styles for the content. Note that this should be used
  269. * sparingly, because it causes a reflow.
  270. */
  271. updateContentMargins(): void;
  272. ngDoCheck(): void;
  273. /**
  274. * Subscribes to drawer events in order to set a class on the main container element when the
  275. * drawer is open and the backdrop is visible. This ensures any overflow on the container element
  276. * is properly hidden.
  277. */
  278. private _watchDrawerToggle;
  279. /**
  280. * Subscribes to drawer onPositionChanged event in order to
  281. * re-validate drawers when the position changes.
  282. */
  283. private _watchDrawerPosition;
  284. /** Subscribes to changes in drawer mode so we can run change detection. */
  285. private _watchDrawerMode;
  286. /** Toggles the 'mat-drawer-opened' class on the main 'mat-drawer-container' element. */
  287. private _setContainerClass;
  288. /** Validate the state of the drawer children components. */
  289. private _validateDrawers;
  290. /** Whether the container is being pushed to the side by one of the drawers. */
  291. private _isPushed;
  292. _onBackdropClicked(): void;
  293. _closeModalDrawersViaBackdrop(): void;
  294. _isShowingBackdrop(): boolean;
  295. private _isDrawerOpen;
  296. private _drawerHasBackdrop;
  297. static ɵfac: i0.ɵɵFactoryDeclaration<MatDrawerContainer, never>;
  298. static ɵcmp: i0.ɵɵComponentDeclaration<MatDrawerContainer, "mat-drawer-container", ["matDrawerContainer"], { "autosize": { "alias": "autosize"; "required": false; }; "hasBackdrop": { "alias": "hasBackdrop"; "required": false; }; }, { "backdropClick": "backdropClick"; }, ["_content", "_allDrawers"], ["mat-drawer", "mat-drawer-content", "*"], true, never>;
  299. }
  300. declare class MatSidenavContent extends MatDrawerContent {
  301. static ɵfac: i0.ɵɵFactoryDeclaration<MatSidenavContent, never>;
  302. static ɵcmp: i0.ɵɵComponentDeclaration<MatSidenavContent, "mat-sidenav-content", never, {}, {}, never, ["*"], true, never>;
  303. }
  304. declare class MatSidenav extends MatDrawer {
  305. /** Whether the sidenav is fixed in the viewport. */
  306. get fixedInViewport(): boolean;
  307. set fixedInViewport(value: BooleanInput);
  308. private _fixedInViewport;
  309. /**
  310. * The gap between the top of the sidenav and the top of the viewport when the sidenav is in fixed
  311. * mode.
  312. */
  313. get fixedTopGap(): number;
  314. set fixedTopGap(value: NumberInput);
  315. private _fixedTopGap;
  316. /**
  317. * The gap between the bottom of the sidenav and the bottom of the viewport when the sidenav is in
  318. * fixed mode.
  319. */
  320. get fixedBottomGap(): number;
  321. set fixedBottomGap(value: NumberInput);
  322. private _fixedBottomGap;
  323. static ɵfac: i0.ɵɵFactoryDeclaration<MatSidenav, never>;
  324. static ɵcmp: i0.ɵɵComponentDeclaration<MatSidenav, "mat-sidenav", ["matSidenav"], { "fixedInViewport": { "alias": "fixedInViewport"; "required": false; }; "fixedTopGap": { "alias": "fixedTopGap"; "required": false; }; "fixedBottomGap": { "alias": "fixedBottomGap"; "required": false; }; }, {}, never, ["*"], true, never>;
  325. }
  326. declare class MatSidenavContainer extends MatDrawerContainer {
  327. _allDrawers: QueryList<MatSidenav>;
  328. _content: MatSidenavContent;
  329. static ɵfac: i0.ɵɵFactoryDeclaration<MatSidenavContainer, never>;
  330. static ɵcmp: i0.ɵɵComponentDeclaration<MatSidenavContainer, "mat-sidenav-container", ["matSidenavContainer"], {}, {}, ["_content", "_allDrawers"], ["mat-sidenav", "mat-sidenav-content", "*"], true, never>;
  331. }
  332. declare class MatSidenavModule {
  333. static ɵfac: i0.ɵɵFactoryDeclaration<MatSidenavModule, never>;
  334. static ɵmod: i0.ɵɵNgModuleDeclaration<MatSidenavModule, never, [typeof MatCommonModule, typeof i5.CdkScrollableModule, typeof MatDrawer, typeof MatDrawerContainer, typeof MatDrawerContent, typeof MatSidenav, typeof MatSidenavContainer, typeof MatSidenavContent], [typeof i5.CdkScrollableModule, typeof MatCommonModule, typeof MatDrawer, typeof MatDrawerContainer, typeof MatDrawerContent, typeof MatSidenav, typeof MatSidenavContainer, typeof MatSidenavContent]>;
  335. static ɵinj: i0.ɵɵInjectorDeclaration<MatSidenavModule>;
  336. }
  337. /**
  338. * Animations used by the Material drawers.
  339. * @docs-private
  340. * @deprecated No longer used, will be removed.
  341. * @breaking-change 21.0.0
  342. */
  343. declare const matDrawerAnimations: {
  344. readonly transformDrawer: any;
  345. };
  346. export { MAT_DRAWER_DEFAULT_AUTOSIZE, MAT_DRAWER_DEFAULT_AUTOSIZE_FACTORY, MatDrawer, MatDrawerContainer, MatDrawerContent, MatSidenav, MatSidenavContainer, MatSidenavContent, MatSidenavModule, matDrawerAnimations, throwMatDuplicatedDrawerError };
  347. export type { MatDrawerMode, MatDrawerToggleResult };