dialog.d-B5HZULyo.d.ts 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358
  1. import { ScrollStrategy, Overlay, ComponentType } from '@angular/cdk/overlay';
  2. import * as i0 from '@angular/core';
  3. import { ViewContainerRef, Injector, OnDestroy, EventEmitter, ComponentRef, InjectionToken, TemplateRef } from '@angular/core';
  4. import { Direction } from '@angular/cdk/bidi';
  5. import { FocusOrigin } from '@angular/cdk/a11y';
  6. import { Observable, Subject } from 'rxjs';
  7. import { CdkDialogContainer, DialogRef, Dialog } from '@angular/cdk/dialog';
  8. import { ComponentPortal } from '@angular/cdk/portal';
  9. /** Options for where to set focus to automatically on dialog open */
  10. type AutoFocusTarget = 'dialog' | 'first-tabbable' | 'first-heading';
  11. /** Valid ARIA roles for a dialog element. */
  12. type DialogRole = 'dialog' | 'alertdialog';
  13. /** Possible overrides for a dialog's position. */
  14. interface DialogPosition {
  15. /** Override for the dialog's top position. */
  16. top?: string;
  17. /** Override for the dialog's bottom position. */
  18. bottom?: string;
  19. /** Override for the dialog's left position. */
  20. left?: string;
  21. /** Override for the dialog's right position. */
  22. right?: string;
  23. }
  24. /**
  25. * Configuration for opening a modal dialog with the MatDialog service.
  26. */
  27. declare class MatDialogConfig<D = any> {
  28. /**
  29. * Where the attached component should live in Angular's *logical* component tree.
  30. * This affects what is available for injection and the change detection order for the
  31. * component instantiated inside of the dialog. This does not affect where the dialog
  32. * content will be rendered.
  33. */
  34. viewContainerRef?: ViewContainerRef;
  35. /**
  36. * Injector used for the instantiation of the component to be attached. If provided,
  37. * takes precedence over the injector indirectly provided by `ViewContainerRef`.
  38. */
  39. injector?: Injector;
  40. /** ID for the dialog. If omitted, a unique one will be generated. */
  41. id?: string;
  42. /** The ARIA role of the dialog element. */
  43. role?: DialogRole;
  44. /** Custom class for the overlay pane. */
  45. panelClass?: string | string[];
  46. /** Whether the dialog has a backdrop. */
  47. hasBackdrop?: boolean;
  48. /** Custom class for the backdrop. */
  49. backdropClass?: string | string[];
  50. /** Whether the user can use escape or clicking on the backdrop to close the modal. */
  51. disableClose?: boolean;
  52. /** Width of the dialog. */
  53. width?: string;
  54. /** Height of the dialog. */
  55. height?: string;
  56. /** Min-width of the dialog. If a number is provided, assumes pixel units. */
  57. minWidth?: number | string;
  58. /** Min-height of the dialog. If a number is provided, assumes pixel units. */
  59. minHeight?: number | string;
  60. /** Max-width of the dialog. If a number is provided, assumes pixel units. */
  61. maxWidth?: number | string;
  62. /** Max-height of the dialog. If a number is provided, assumes pixel units. */
  63. maxHeight?: number | string;
  64. /** Position overrides. */
  65. position?: DialogPosition;
  66. /** Data being injected into the child component. */
  67. data?: D | null;
  68. /** Layout direction for the dialog's content. */
  69. direction?: Direction;
  70. /** ID of the element that describes the dialog. */
  71. ariaDescribedBy?: string | null;
  72. /** ID of the element that labels the dialog. */
  73. ariaLabelledBy?: string | null;
  74. /** Aria label to assign to the dialog element. */
  75. ariaLabel?: string | null;
  76. /**
  77. * Whether this is a modal dialog. Used to set the `aria-modal` attribute. Off by default,
  78. * because it can interfere with other overlay-based components (e.g. `mat-select`) and because
  79. * it is redundant since the dialog marks all outside content as `aria-hidden` anyway.
  80. */
  81. ariaModal?: boolean;
  82. /**
  83. * Where the dialog should focus on open.
  84. * @breaking-change 14.0.0 Remove boolean option from autoFocus. Use string or
  85. * AutoFocusTarget instead.
  86. */
  87. autoFocus?: AutoFocusTarget | string | boolean;
  88. /**
  89. * Whether the dialog should restore focus to the
  90. * previously-focused element, after it's closed.
  91. */
  92. restoreFocus?: boolean;
  93. /** Whether to wait for the opening animation to finish before trapping focus. */
  94. delayFocusTrap?: boolean;
  95. /** Scroll strategy to be used for the dialog. */
  96. scrollStrategy?: ScrollStrategy;
  97. /**
  98. * Whether the dialog should close when the user goes backwards/forwards in history.
  99. * Note that this usually doesn't include clicking on links (unless the user is using
  100. * the `HashLocationStrategy`).
  101. */
  102. closeOnNavigation?: boolean;
  103. /**
  104. * Alternate `ComponentFactoryResolver` to use when resolving the associated component.
  105. * @deprecated No longer used. Will be removed.
  106. * @breaking-change 20.0.0
  107. */
  108. componentFactoryResolver?: unknown;
  109. /**
  110. * Duration of the enter animation in ms.
  111. * Should be a number, string type is deprecated.
  112. * @breaking-change 17.0.0 Remove string signature.
  113. */
  114. enterAnimationDuration?: string | number;
  115. /**
  116. * Duration of the exit animation in ms.
  117. * Should be a number, string type is deprecated.
  118. * @breaking-change 17.0.0 Remove string signature.
  119. */
  120. exitAnimationDuration?: string | number;
  121. }
  122. /** Event that captures the state of dialog container animations. */
  123. interface LegacyDialogAnimationEvent {
  124. state: 'opened' | 'opening' | 'closing' | 'closed';
  125. totalTime: number;
  126. }
  127. declare class MatDialogContainer extends CdkDialogContainer<MatDialogConfig> implements OnDestroy {
  128. private _animationMode;
  129. /** Emits when an animation state changes. */
  130. _animationStateChanged: EventEmitter<LegacyDialogAnimationEvent>;
  131. /** Whether animations are enabled. */
  132. _animationsEnabled: boolean;
  133. /** Number of actions projected in the dialog. */
  134. protected _actionSectionCount: number;
  135. /** Host element of the dialog container component. */
  136. private _hostElement;
  137. /** Duration of the dialog open animation. */
  138. private _enterAnimationDuration;
  139. /** Duration of the dialog close animation. */
  140. private _exitAnimationDuration;
  141. /** Current timer for dialog animations. */
  142. private _animationTimer;
  143. protected _contentAttached(): void;
  144. /** Starts the dialog open animation if enabled. */
  145. private _startOpenAnimation;
  146. /**
  147. * Starts the exit animation of the dialog if enabled. This method is
  148. * called by the dialog ref.
  149. */
  150. _startExitAnimation(): void;
  151. /**
  152. * Updates the number action sections.
  153. * @param delta Increase/decrease in the number of sections.
  154. */
  155. _updateActionSectionCount(delta: number): void;
  156. /**
  157. * Completes the dialog open by clearing potential animation classes, trapping
  158. * focus and emitting an opened event.
  159. */
  160. private _finishDialogOpen;
  161. /**
  162. * Completes the dialog close by clearing potential animation classes, restoring
  163. * focus and emitting a closed event.
  164. */
  165. private _finishDialogClose;
  166. /** Clears all dialog animation classes. */
  167. private _clearAnimationClasses;
  168. private _waitForAnimationToComplete;
  169. /** Runs a callback in `requestAnimationFrame`, if available. */
  170. private _requestAnimationFrame;
  171. protected _captureInitialFocus(): void;
  172. /**
  173. * Callback for when the open dialog animation has finished. Intended to
  174. * be called by sub-classes that use different animation implementations.
  175. */
  176. protected _openAnimationDone(totalTime: number): void;
  177. ngOnDestroy(): void;
  178. attachComponentPortal<T>(portal: ComponentPortal<T>): ComponentRef<T>;
  179. static ɵfac: i0.ɵɵFactoryDeclaration<MatDialogContainer, never>;
  180. static ɵcmp: i0.ɵɵComponentDeclaration<MatDialogContainer, "mat-dialog-container", never, {}, {}, never, never, true, never>;
  181. }
  182. /** Possible states of the lifecycle of a dialog. */
  183. declare enum MatDialogState {
  184. OPEN = 0,
  185. CLOSING = 1,
  186. CLOSED = 2
  187. }
  188. /**
  189. * Reference to a dialog opened via the MatDialog service.
  190. */
  191. declare class MatDialogRef<T, R = any> {
  192. private _ref;
  193. _containerInstance: MatDialogContainer;
  194. /** The instance of component opened into the dialog. */
  195. componentInstance: T;
  196. /**
  197. * `ComponentRef` of the component opened into the dialog. Will be
  198. * null when the dialog is opened using a `TemplateRef`.
  199. */
  200. readonly componentRef: ComponentRef<T> | null;
  201. /** Whether the user is allowed to close the dialog. */
  202. disableClose: boolean | undefined;
  203. /** Unique ID for the dialog. */
  204. id: string;
  205. /** Subject for notifying the user that the dialog has finished opening. */
  206. private readonly _afterOpened;
  207. /** Subject for notifying the user that the dialog has started closing. */
  208. private readonly _beforeClosed;
  209. /** Result to be passed to afterClosed. */
  210. private _result;
  211. /** Handle to the timeout that's running as a fallback in case the exit animation doesn't fire. */
  212. private _closeFallbackTimeout;
  213. /** Current state of the dialog. */
  214. private _state;
  215. /** Interaction that caused the dialog to close. */
  216. private _closeInteractionType;
  217. constructor(_ref: DialogRef<R, T>, config: MatDialogConfig, _containerInstance: MatDialogContainer);
  218. /**
  219. * Close the dialog.
  220. * @param dialogResult Optional result to return to the dialog opener.
  221. */
  222. close(dialogResult?: R): void;
  223. /**
  224. * Gets an observable that is notified when the dialog is finished opening.
  225. */
  226. afterOpened(): Observable<void>;
  227. /**
  228. * Gets an observable that is notified when the dialog is finished closing.
  229. */
  230. afterClosed(): Observable<R | undefined>;
  231. /**
  232. * Gets an observable that is notified when the dialog has started closing.
  233. */
  234. beforeClosed(): Observable<R | undefined>;
  235. /**
  236. * Gets an observable that emits when the overlay's backdrop has been clicked.
  237. */
  238. backdropClick(): Observable<MouseEvent>;
  239. /**
  240. * Gets an observable that emits when keydown events are targeted on the overlay.
  241. */
  242. keydownEvents(): Observable<KeyboardEvent>;
  243. /**
  244. * Updates the dialog's position.
  245. * @param position New dialog position.
  246. */
  247. updatePosition(position?: DialogPosition): this;
  248. /**
  249. * Updates the dialog's width and height.
  250. * @param width New width of the dialog.
  251. * @param height New height of the dialog.
  252. */
  253. updateSize(width?: string, height?: string): this;
  254. /** Add a CSS class or an array of classes to the overlay pane. */
  255. addPanelClass(classes: string | string[]): this;
  256. /** Remove a CSS class or an array of classes from the overlay pane. */
  257. removePanelClass(classes: string | string[]): this;
  258. /** Gets the current state of the dialog's lifecycle. */
  259. getState(): MatDialogState;
  260. /**
  261. * Finishes the dialog close by updating the state of the dialog
  262. * and disposing the overlay.
  263. */
  264. private _finishDialogClose;
  265. }
  266. /**
  267. * Closes the dialog with the specified interaction type. This is currently not part of
  268. * `MatDialogRef` as that would conflict with custom dialog ref mocks provided in tests.
  269. * More details. See: https://github.com/angular/components/pull/9257#issuecomment-651342226.
  270. */
  271. declare function _closeDialogVia<R>(ref: MatDialogRef<R>, interactionType: FocusOrigin, result?: R): void;
  272. /** Injection token that can be used to access the data that was passed in to a dialog. */
  273. declare const MAT_DIALOG_DATA: InjectionToken<any>;
  274. /** Injection token that can be used to specify default dialog options. */
  275. declare const MAT_DIALOG_DEFAULT_OPTIONS: InjectionToken<MatDialogConfig<any>>;
  276. /** Injection token that determines the scroll handling while the dialog is open. */
  277. declare const MAT_DIALOG_SCROLL_STRATEGY: InjectionToken<() => ScrollStrategy>;
  278. /**
  279. * @docs-private
  280. * @deprecated No longer used. To be removed.
  281. * @breaking-change 19.0.0
  282. */
  283. declare function MAT_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay: Overlay): () => ScrollStrategy;
  284. /**
  285. * @docs-private
  286. * @deprecated No longer used. To be removed.
  287. * @breaking-change 19.0.0
  288. */
  289. declare const MAT_DIALOG_SCROLL_STRATEGY_PROVIDER: {
  290. provide: InjectionToken<() => ScrollStrategy>;
  291. deps: (typeof Overlay)[];
  292. useFactory: typeof MAT_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY;
  293. };
  294. /**
  295. * Service to open Material Design modal dialogs.
  296. */
  297. declare class MatDialog implements OnDestroy {
  298. private _overlay;
  299. private _defaultOptions;
  300. private _scrollStrategy;
  301. private _parentDialog;
  302. private _idGenerator;
  303. protected _dialog: Dialog;
  304. private readonly _openDialogsAtThisLevel;
  305. private readonly _afterAllClosedAtThisLevel;
  306. private readonly _afterOpenedAtThisLevel;
  307. protected dialogConfigClass: typeof MatDialogConfig;
  308. private readonly _dialogRefConstructor;
  309. private readonly _dialogContainerType;
  310. private readonly _dialogDataToken;
  311. /** Keeps track of the currently-open dialogs. */
  312. get openDialogs(): MatDialogRef<any>[];
  313. /** Stream that emits when a dialog has been opened. */
  314. get afterOpened(): Subject<MatDialogRef<any>>;
  315. private _getAfterAllClosed;
  316. /**
  317. * Stream that emits when all open dialog have finished closing.
  318. * Will emit on subscribe if there are no open dialogs to begin with.
  319. */
  320. readonly afterAllClosed: Observable<void>;
  321. constructor(...args: unknown[]);
  322. /**
  323. * Opens a modal dialog containing the given component.
  324. * @param component Type of the component to load into the dialog.
  325. * @param config Extra configuration options.
  326. * @returns Reference to the newly-opened dialog.
  327. */
  328. open<T, D = any, R = any>(component: ComponentType<T>, config?: MatDialogConfig<D>): MatDialogRef<T, R>;
  329. /**
  330. * Opens a modal dialog containing the given template.
  331. * @param template TemplateRef to instantiate as the dialog content.
  332. * @param config Extra configuration options.
  333. * @returns Reference to the newly-opened dialog.
  334. */
  335. open<T, D = any, R = any>(template: TemplateRef<T>, config?: MatDialogConfig<D>): MatDialogRef<T, R>;
  336. open<T, D = any, R = any>(template: ComponentType<T> | TemplateRef<T>, config?: MatDialogConfig<D>): MatDialogRef<T, R>;
  337. /**
  338. * Closes all of the currently-open dialogs.
  339. */
  340. closeAll(): void;
  341. /**
  342. * Finds an open dialog by its id.
  343. * @param id ID to use when looking up the dialog.
  344. */
  345. getDialogById(id: string): MatDialogRef<any> | undefined;
  346. ngOnDestroy(): void;
  347. private _closeDialogs;
  348. static ɵfac: i0.ɵɵFactoryDeclaration<MatDialog, never>;
  349. static ɵprov: i0.ɵɵInjectableDeclaration<MatDialog>;
  350. }
  351. export { MatDialogRef as M, _closeDialogVia as _, MatDialogContainer as a, MAT_DIALOG_DATA as b, MAT_DIALOG_DEFAULT_OPTIONS as c, MAT_DIALOG_SCROLL_STRATEGY as d, MAT_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY as e, MAT_DIALOG_SCROLL_STRATEGY_PROVIDER as f, MatDialog as g, MatDialogConfig as i, MatDialogState as j };
  352. export type { AutoFocusTarget as A, DialogRole as D, DialogPosition as h };