index.d.ts 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431
  1. import * as i0 from '@angular/core';
  2. import { ViewContainerRef, Injector, StaticProvider, Type, OnDestroy, ElementRef, NgZone, ChangeDetectorRef, ComponentRef, EmbeddedViewRef, TemplateRef, InjectionToken } from '@angular/core';
  3. import { Observable, Subject } from 'rxjs';
  4. import { F as FocusOrigin } from '../focus-monitor.d-CvvJeQRc.js';
  5. import { F as FocusTrapFactory, A as A11yModule } from '../a11y-module.d-DBHGyKoh.js';
  6. import { B as BasePortalOutlet, h as CdkPortalOutlet, a as ComponentPortal, T as TemplatePortal, D as DomPortal, C as ComponentType, j as PortalModule } from '../portal-directives.d-BoG39gYN.js';
  7. export { e as ɵɵCdkPortal, i as ɵɵPortalHostDirective, f as ɵɵTemplatePortalDirective } from '../portal-directives.d-BoG39gYN.js';
  8. import { a as Direction } from '../bidi-module.d-D-fEBKdS.js';
  9. import { P as PositionStrategy, n as ScrollStrategy, b as OverlayRef, o as OverlayModule } from '../overlay-module.d-B3qEQtts.js';
  10. import * as _angular_cdk_portal from '@angular/cdk/portal';
  11. import { O as Overlay } from '../overlay.d-BdoMy0hX.js';
  12. import '../observers/index.js';
  13. import '../number-property.d-CJVxXUcb.js';
  14. import '../scrolling-module.d-ud2XrbF8.js';
  15. import '../data-source.d-Bblv7Zvh.js';
  16. import '@angular/common';
  17. import '../scrolling/index.js';
  18. import '../platform.d-B3vREl3q.js';
  19. import '../style-loader.d-BXZfQZTF.js';
  20. /** Options for where to set focus to automatically on dialog open */
  21. type AutoFocusTarget = 'dialog' | 'first-tabbable' | 'first-heading';
  22. /** Valid ARIA roles for a dialog. */
  23. type DialogRole = 'dialog' | 'alertdialog';
  24. /** Component that can be used as the container for the dialog. */
  25. type DialogContainer = BasePortalOutlet & {
  26. _focusTrapped?: Observable<void>;
  27. _closeInteractionType?: FocusOrigin;
  28. _recaptureFocus?: () => void;
  29. };
  30. /** Configuration for opening a modal dialog. */
  31. declare class DialogConfig<D = unknown, R = unknown, C extends DialogContainer = BasePortalOutlet> {
  32. /**
  33. * Where the attached component should live in Angular's *logical* component tree.
  34. * This affects what is available for injection and the change detection order for the
  35. * component instantiated inside of the dialog. This does not affect where the dialog
  36. * content will be rendered.
  37. */
  38. viewContainerRef?: ViewContainerRef;
  39. /**
  40. * Injector used for the instantiation of the component to be attached. If provided,
  41. * takes precedence over the injector indirectly provided by `ViewContainerRef`.
  42. */
  43. injector?: Injector;
  44. /** ID for the dialog. If omitted, a unique one will be generated. */
  45. id?: string;
  46. /** The ARIA role of the dialog element. */
  47. role?: DialogRole;
  48. /** Optional CSS class or classes applied to the overlay panel. */
  49. panelClass?: string | string[];
  50. /** Whether the dialog has a backdrop. */
  51. hasBackdrop?: boolean;
  52. /** Optional CSS class or classes applied to the overlay backdrop. */
  53. backdropClass?: string | string[];
  54. /** Whether the dialog closes with the escape key or pointer events outside the panel element. */
  55. disableClose?: boolean;
  56. /** Width of the dialog. */
  57. width?: string;
  58. /** Height of the dialog. */
  59. height?: string;
  60. /** Min-width of the dialog. If a number is provided, assumes pixel units. */
  61. minWidth?: number | string;
  62. /** Min-height of the dialog. If a number is provided, assumes pixel units. */
  63. minHeight?: number | string;
  64. /** Max-width of the dialog. If a number is provided, assumes pixel units. */
  65. maxWidth?: number | string;
  66. /** Max-height of the dialog. If a number is provided, assumes pixel units. */
  67. maxHeight?: number | string;
  68. /** Strategy to use when positioning the dialog. Defaults to centering it on the page. */
  69. positionStrategy?: PositionStrategy;
  70. /** Data being injected into the child component. */
  71. data?: D | null;
  72. /** Layout direction for the dialog's content. */
  73. direction?: Direction;
  74. /** ID of the element that describes the dialog. */
  75. ariaDescribedBy?: string | null;
  76. /** ID of the element that labels the dialog. */
  77. ariaLabelledBy?: string | null;
  78. /** Dialog label applied via `aria-label` */
  79. ariaLabel?: string | null;
  80. /**
  81. * Whether this is a modal dialog. Used to set the `aria-modal` attribute. Off by default,
  82. * because it can interfere with other overlay-based components (e.g. `mat-select`) and because
  83. * it is redundant since the dialog marks all outside content as `aria-hidden` anyway.
  84. */
  85. ariaModal?: boolean;
  86. /**
  87. * Where the dialog should focus on open.
  88. * @breaking-change 14.0.0 Remove boolean option from autoFocus. Use string or
  89. * AutoFocusTarget instead.
  90. */
  91. autoFocus?: AutoFocusTarget | string | boolean;
  92. /**
  93. * Whether the dialog should restore focus to the previously-focused element upon closing.
  94. * Has the following behavior based on the type that is passed in:
  95. * - `boolean` - when true, will return focus to the element that was focused before the dialog
  96. * was opened, otherwise won't restore focus at all.
  97. * - `string` - focus will be restored to the first element that matches the CSS selector.
  98. * - `HTMLElement` - focus will be restored to the specific element.
  99. */
  100. restoreFocus?: boolean | string | HTMLElement;
  101. /**
  102. * Scroll strategy to be used for the dialog. This determines how
  103. * the dialog responds to scrolling underneath the panel element.
  104. */
  105. scrollStrategy?: ScrollStrategy;
  106. /**
  107. * Whether the dialog should close when the user navigates backwards or forwards through browser
  108. * history. This does not apply to navigation via anchor element unless using URL-hash based
  109. * routing (`HashLocationStrategy` in the Angular router).
  110. */
  111. closeOnNavigation?: boolean;
  112. /**
  113. * Whether the dialog should close when the dialog service is destroyed. This is useful if
  114. * another service is wrapping the dialog and is managing the destruction instead.
  115. */
  116. closeOnDestroy?: boolean;
  117. /**
  118. * Whether the dialog should close when the underlying overlay is detached. This is useful if
  119. * another service is wrapping the dialog and is managing the destruction instead. E.g. an
  120. * external detachment can happen as a result of a scroll strategy triggering it or when the
  121. * browser location changes.
  122. */
  123. closeOnOverlayDetachments?: boolean;
  124. /**
  125. * Alternate `ComponentFactoryResolver` to use when resolving the associated component.
  126. * @deprecated No longer used. Will be removed.
  127. * @breaking-change 20.0.0
  128. */
  129. componentFactoryResolver?: unknown;
  130. /**
  131. * Providers that will be exposed to the contents of the dialog. Can also
  132. * be provided as a function in order to generate the providers lazily.
  133. */
  134. providers?: StaticProvider[] | ((dialogRef: R, config: DialogConfig<D, R, C>, container: C) => StaticProvider[]);
  135. /**
  136. * Component into which the dialog content will be rendered. Defaults to `CdkDialogContainer`.
  137. * A configuration object can be passed in to customize the providers that will be exposed
  138. * to the dialog container.
  139. */
  140. container?: Type<C> | {
  141. type: Type<C>;
  142. providers: (config: DialogConfig<D, R, C>) => StaticProvider[];
  143. };
  144. /**
  145. * Context that will be passed to template-based dialogs.
  146. * A function can be passed in to resolve the context lazily.
  147. */
  148. templateContext?: Record<string, any> | (() => Record<string, any>);
  149. }
  150. declare function throwDialogContentAlreadyAttachedError(): void;
  151. /**
  152. * Internal component that wraps user-provided dialog content.
  153. * @docs-private
  154. */
  155. declare class CdkDialogContainer<C extends DialogConfig = DialogConfig> extends BasePortalOutlet implements DialogContainer, OnDestroy {
  156. protected _elementRef: ElementRef<HTMLElement>;
  157. protected _focusTrapFactory: FocusTrapFactory;
  158. readonly _config: C;
  159. private _interactivityChecker;
  160. protected _ngZone: NgZone;
  161. private _overlayRef;
  162. private _focusMonitor;
  163. private _renderer;
  164. protected readonly _changeDetectorRef: ChangeDetectorRef;
  165. private _injector;
  166. private _platform;
  167. protected _document: Document;
  168. /** The portal outlet inside of this container into which the dialog content will be loaded. */
  169. _portalOutlet: CdkPortalOutlet;
  170. _focusTrapped: Observable<void>;
  171. /** The class that traps and manages focus within the dialog. */
  172. private _focusTrap;
  173. /** Element that was focused before the dialog was opened. Save this to restore upon close. */
  174. private _elementFocusedBeforeDialogWasOpened;
  175. /**
  176. * Type of interaction that led to the dialog being closed. This is used to determine
  177. * whether the focus style will be applied when returning focus to its original location
  178. * after the dialog is closed.
  179. */
  180. _closeInteractionType: FocusOrigin | null;
  181. /**
  182. * Queue of the IDs of the dialog's label element, based on their definition order. The first
  183. * ID will be used as the `aria-labelledby` value. We use a queue here to handle the case
  184. * where there are two or more titles in the DOM at a time and the first one is destroyed while
  185. * the rest are present.
  186. */
  187. _ariaLabelledByQueue: string[];
  188. private _isDestroyed;
  189. constructor(...args: unknown[]);
  190. _addAriaLabelledBy(id: string): void;
  191. _removeAriaLabelledBy(id: string): void;
  192. protected _contentAttached(): void;
  193. /**
  194. * Can be used by child classes to customize the initial focus
  195. * capturing behavior (e.g. if it's tied to an animation).
  196. */
  197. protected _captureInitialFocus(): void;
  198. ngOnDestroy(): void;
  199. /**
  200. * Attach a ComponentPortal as content to this dialog container.
  201. * @param portal Portal to be attached as the dialog content.
  202. */
  203. attachComponentPortal<T>(portal: ComponentPortal<T>): ComponentRef<T>;
  204. /**
  205. * Attach a TemplatePortal as content to this dialog container.
  206. * @param portal Portal to be attached as the dialog content.
  207. */
  208. attachTemplatePortal<T>(portal: TemplatePortal<T>): EmbeddedViewRef<T>;
  209. /**
  210. * Attaches a DOM portal to the dialog container.
  211. * @param portal Portal to be attached.
  212. * @deprecated To be turned into a method.
  213. * @breaking-change 10.0.0
  214. */
  215. attachDomPortal: (portal: DomPortal) => void;
  216. /** Captures focus if it isn't already inside the dialog. */
  217. _recaptureFocus(): void;
  218. /**
  219. * Focuses the provided element. If the element is not focusable, it will add a tabIndex
  220. * attribute to forcefully focus it. The attribute is removed after focus is moved.
  221. * @param element The element to focus.
  222. */
  223. private _forceFocus;
  224. /**
  225. * Focuses the first element that matches the given selector within the focus trap.
  226. * @param selector The CSS selector for the element to set focus to.
  227. */
  228. private _focusByCssSelector;
  229. /**
  230. * Moves the focus inside the focus trap. When autoFocus is not set to 'dialog', if focus
  231. * cannot be moved then focus will go to the dialog container.
  232. */
  233. protected _trapFocus(options?: FocusOptions): void;
  234. /** Restores focus to the element that was focused before the dialog opened. */
  235. private _restoreFocus;
  236. /** Focuses the dialog container. */
  237. private _focusDialogContainer;
  238. /** Returns whether focus is inside the dialog. */
  239. private _containsFocus;
  240. /** Sets up the focus trap. */
  241. private _initializeFocusTrap;
  242. /** Sets up the listener that handles clicks on the dialog backdrop. */
  243. private _handleBackdropClicks;
  244. static ɵfac: i0.ɵɵFactoryDeclaration<CdkDialogContainer<any>, never>;
  245. static ɵcmp: i0.ɵɵComponentDeclaration<CdkDialogContainer<any>, "cdk-dialog-container", never, {}, {}, never, never, true, never>;
  246. }
  247. /** Additional options that can be passed in when closing a dialog. */
  248. interface DialogCloseOptions {
  249. /** Focus original to use when restoring focus. */
  250. focusOrigin?: FocusOrigin;
  251. }
  252. /**
  253. * Reference to a dialog opened via the Dialog service.
  254. */
  255. declare class DialogRef<R = unknown, C = unknown> {
  256. readonly overlayRef: OverlayRef;
  257. readonly config: DialogConfig<any, DialogRef<R, C>, DialogContainer>;
  258. /**
  259. * Instance of component opened into the dialog. Will be
  260. * null when the dialog is opened using a `TemplateRef`.
  261. */
  262. readonly componentInstance: C | null;
  263. /**
  264. * `ComponentRef` of the component opened into the dialog. Will be
  265. * null when the dialog is opened using a `TemplateRef`.
  266. */
  267. readonly componentRef: ComponentRef<C> | null;
  268. /** Instance of the container that is rendering out the dialog content. */
  269. readonly containerInstance: DialogContainer;
  270. /** Whether the user is allowed to close the dialog. */
  271. disableClose: boolean | undefined;
  272. /** Emits when the dialog has been closed. */
  273. readonly closed: Observable<R | undefined>;
  274. /** Emits when the backdrop of the dialog is clicked. */
  275. readonly backdropClick: Observable<MouseEvent>;
  276. /** Emits when on keyboard events within the dialog. */
  277. readonly keydownEvents: Observable<KeyboardEvent>;
  278. /** Emits on pointer events that happen outside of the dialog. */
  279. readonly outsidePointerEvents: Observable<MouseEvent>;
  280. /** Unique ID for the dialog. */
  281. readonly id: string;
  282. /** Subscription to external detachments of the dialog. */
  283. private _detachSubscription;
  284. constructor(overlayRef: OverlayRef, config: DialogConfig<any, DialogRef<R, C>, DialogContainer>);
  285. /**
  286. * Close the dialog.
  287. * @param result Optional result to return to the dialog opener.
  288. * @param options Additional options to customize the closing behavior.
  289. */
  290. close(result?: R, options?: DialogCloseOptions): void;
  291. /** Updates the position of the dialog based on the current position strategy. */
  292. updatePosition(): this;
  293. /**
  294. * Updates the dialog's width and height.
  295. * @param width New width of the dialog.
  296. * @param height New height of the dialog.
  297. */
  298. updateSize(width?: string | number, height?: string | number): this;
  299. /** Add a CSS class or an array of classes to the overlay pane. */
  300. addPanelClass(classes: string | string[]): this;
  301. /** Remove a CSS class or an array of classes from the overlay pane. */
  302. removePanelClass(classes: string | string[]): this;
  303. }
  304. declare class Dialog implements OnDestroy {
  305. private _overlay;
  306. private _injector;
  307. private _defaultOptions;
  308. private _parentDialog;
  309. private _overlayContainer;
  310. private _idGenerator;
  311. private _openDialogsAtThisLevel;
  312. private readonly _afterAllClosedAtThisLevel;
  313. private readonly _afterOpenedAtThisLevel;
  314. private _ariaHiddenElements;
  315. private _scrollStrategy;
  316. /** Keeps track of the currently-open dialogs. */
  317. get openDialogs(): readonly DialogRef<any, any>[];
  318. /** Stream that emits when a dialog has been opened. */
  319. get afterOpened(): Subject<DialogRef<any, any>>;
  320. /**
  321. * Stream that emits when all open dialog have finished closing.
  322. * Will emit on subscribe if there are no open dialogs to begin with.
  323. */
  324. readonly afterAllClosed: Observable<void>;
  325. constructor(...args: unknown[]);
  326. /**
  327. * Opens a modal dialog containing the given component.
  328. * @param component Type of the component to load into the dialog.
  329. * @param config Extra configuration options.
  330. * @returns Reference to the newly-opened dialog.
  331. */
  332. open<R = unknown, D = unknown, C = unknown>(component: ComponentType<C>, config?: DialogConfig<D, DialogRef<R, C>>): DialogRef<R, C>;
  333. /**
  334. * Opens a modal dialog containing the given template.
  335. * @param template TemplateRef to instantiate as the dialog content.
  336. * @param config Extra configuration options.
  337. * @returns Reference to the newly-opened dialog.
  338. */
  339. open<R = unknown, D = unknown, C = unknown>(template: TemplateRef<C>, config?: DialogConfig<D, DialogRef<R, C>>): DialogRef<R, C>;
  340. open<R = unknown, D = unknown, C = unknown>(componentOrTemplateRef: ComponentType<C> | TemplateRef<C>, config?: DialogConfig<D, DialogRef<R, C>>): DialogRef<R, C>;
  341. /**
  342. * Closes all of the currently-open dialogs.
  343. */
  344. closeAll(): void;
  345. /**
  346. * Finds an open dialog by its id.
  347. * @param id ID to use when looking up the dialog.
  348. */
  349. getDialogById<R, C>(id: string): DialogRef<R, C> | undefined;
  350. ngOnDestroy(): void;
  351. /**
  352. * Creates an overlay config from a dialog config.
  353. * @param config The dialog configuration.
  354. * @returns The overlay configuration.
  355. */
  356. private _getOverlayConfig;
  357. /**
  358. * Attaches a dialog container to a dialog's already-created overlay.
  359. * @param overlay Reference to the dialog's underlying overlay.
  360. * @param config The dialog configuration.
  361. * @returns A promise resolving to a ComponentRef for the attached container.
  362. */
  363. private _attachContainer;
  364. /**
  365. * Attaches the user-provided component to the already-created dialog container.
  366. * @param componentOrTemplateRef The type of component being loaded into the dialog,
  367. * or a TemplateRef to instantiate as the content.
  368. * @param dialogRef Reference to the dialog being opened.
  369. * @param dialogContainer Component that is going to wrap the dialog content.
  370. * @param config Configuration used to open the dialog.
  371. */
  372. private _attachDialogContent;
  373. /**
  374. * Creates a custom injector to be used inside the dialog. This allows a component loaded inside
  375. * of a dialog to close itself and, optionally, to return a value.
  376. * @param config Config object that is used to construct the dialog.
  377. * @param dialogRef Reference to the dialog being opened.
  378. * @param dialogContainer Component that is going to wrap the dialog content.
  379. * @param fallbackInjector Injector to use as a fallback when a lookup fails in the custom
  380. * dialog injector, if the user didn't provide a custom one.
  381. * @returns The custom injector that can be used inside the dialog.
  382. */
  383. private _createInjector;
  384. /**
  385. * Removes a dialog from the array of open dialogs.
  386. * @param dialogRef Dialog to be removed.
  387. * @param emitEvent Whether to emit an event if this is the last dialog.
  388. */
  389. private _removeOpenDialog;
  390. /** Hides all of the content that isn't an overlay from assistive technology. */
  391. private _hideNonDialogContentFromAssistiveTechnology;
  392. private _getAfterAllClosed;
  393. static ɵfac: i0.ɵɵFactoryDeclaration<Dialog, never>;
  394. static ɵprov: i0.ɵɵInjectableDeclaration<Dialog>;
  395. }
  396. declare class DialogModule {
  397. static ɵfac: i0.ɵɵFactoryDeclaration<DialogModule, never>;
  398. static ɵmod: i0.ɵɵNgModuleDeclaration<DialogModule, never, [typeof OverlayModule, typeof PortalModule, typeof A11yModule, typeof CdkDialogContainer], [typeof PortalModule, typeof CdkDialogContainer]>;
  399. static ɵinj: i0.ɵɵInjectorDeclaration<DialogModule>;
  400. }
  401. /** Injection token for the Dialog's ScrollStrategy. */
  402. declare const DIALOG_SCROLL_STRATEGY: InjectionToken<() => ScrollStrategy>;
  403. /** Injection token for the Dialog's Data. */
  404. declare const DIALOG_DATA: InjectionToken<any>;
  405. /** Injection token that can be used to provide default options for the dialog module. */
  406. declare const DEFAULT_DIALOG_CONFIG: InjectionToken<DialogConfig<unknown, unknown, _angular_cdk_portal.BasePortalOutlet>>;
  407. /**
  408. * @docs-private
  409. * @deprecated No longer used. To be removed.
  410. * @breaking-change 19.0.0
  411. */
  412. declare function DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay: Overlay): () => ScrollStrategy;
  413. /**
  414. * @docs-private
  415. * @deprecated No longer used. To be removed.
  416. * @breaking-change 19.0.0
  417. */
  418. declare const DIALOG_SCROLL_STRATEGY_PROVIDER: {
  419. provide: InjectionToken<() => ScrollStrategy>;
  420. deps: (typeof Overlay)[];
  421. useFactory: typeof DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY;
  422. };
  423. export { CdkDialogContainer, DEFAULT_DIALOG_CONFIG, DIALOG_DATA, DIALOG_SCROLL_STRATEGY, DIALOG_SCROLL_STRATEGY_PROVIDER, DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY, Dialog, DialogConfig, DialogModule, DialogRef, throwDialogContentAlreadyAttachedError, CdkPortalOutlet as ɵɵCdkPortalOutlet };
  424. export type { AutoFocusTarget, DialogCloseOptions, DialogContainer, DialogRole };