@angular/material 19.1.0-next.2 → 19.1.0-next.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/autocomplete/index.d.ts +5 -5
  2. package/button/index.d.ts +2 -0
  3. package/core/index.d.ts +1 -0
  4. package/core/theming/_theming.scss +1 -1
  5. package/datepicker/index.d.ts +1 -0
  6. package/expansion/index.d.ts +2 -0
  7. package/fesm2022/autocomplete.mjs +54 -50
  8. package/fesm2022/autocomplete.mjs.map +1 -1
  9. package/fesm2022/badge.mjs +10 -10
  10. package/fesm2022/bottom-sheet.mjs +10 -10
  11. package/fesm2022/button-toggle.mjs +10 -10
  12. package/fesm2022/button.mjs +39 -37
  13. package/fesm2022/button.mjs.map +1 -1
  14. package/fesm2022/card.mjs +46 -46
  15. package/fesm2022/checkbox.mjs +14 -14
  16. package/fesm2022/chips.mjs +40 -40
  17. package/fesm2022/core.mjs +73 -75
  18. package/fesm2022/core.mjs.map +1 -1
  19. package/fesm2022/datepicker.mjs +104 -111
  20. package/fesm2022/datepicker.mjs.map +1 -1
  21. package/fesm2022/dialog.mjs +25 -25
  22. package/fesm2022/divider.mjs +7 -7
  23. package/fesm2022/expansion.mjs +30 -28
  24. package/fesm2022/expansion.mjs.map +1 -1
  25. package/fesm2022/form-field.mjs +39 -37
  26. package/fesm2022/form-field.mjs.map +1 -1
  27. package/fesm2022/grid-list.mjs +22 -22
  28. package/fesm2022/icon/testing.mjs +7 -7
  29. package/fesm2022/icon.mjs +10 -10
  30. package/fesm2022/input.mjs +26 -32
  31. package/fesm2022/input.mjs.map +1 -1
  32. package/fesm2022/list.mjs +58 -55
  33. package/fesm2022/list.mjs.map +1 -1
  34. package/fesm2022/menu.mjs +188 -146
  35. package/fesm2022/menu.mjs.map +1 -1
  36. package/fesm2022/paginator.mjs +10 -10
  37. package/fesm2022/progress-bar.mjs +12 -10
  38. package/fesm2022/progress-bar.mjs.map +1 -1
  39. package/fesm2022/progress-spinner.mjs +7 -7
  40. package/fesm2022/radio.mjs +15 -14
  41. package/fesm2022/radio.mjs.map +1 -1
  42. package/fesm2022/select.mjs +10 -10
  43. package/fesm2022/sidenav.mjs +28 -27
  44. package/fesm2022/sidenav.mjs.map +1 -1
  45. package/fesm2022/slide-toggle.mjs +14 -14
  46. package/fesm2022/slider.mjs +38 -39
  47. package/fesm2022/slider.mjs.map +1 -1
  48. package/fesm2022/snack-bar.mjs +22 -22
  49. package/fesm2022/sort.mjs +13 -13
  50. package/fesm2022/stepper.mjs +31 -31
  51. package/fesm2022/table.mjs +59 -70
  52. package/fesm2022/table.mjs.map +1 -1
  53. package/fesm2022/tabs.mjs +58 -66
  54. package/fesm2022/tabs.mjs.map +1 -1
  55. package/fesm2022/timepicker.mjs +18 -16
  56. package/fesm2022/timepicker.mjs.map +1 -1
  57. package/fesm2022/toolbar.mjs +10 -10
  58. package/fesm2022/tooltip.mjs +54 -76
  59. package/fesm2022/tooltip.mjs.map +1 -1
  60. package/fesm2022/tree.mjs +25 -25
  61. package/form-field/index.d.ts +1 -0
  62. package/input/index.d.ts +8 -5
  63. package/list/index.d.ts +2 -0
  64. package/menu/index.d.ts +14 -19
  65. package/package.json +2 -2
  66. package/progress-bar/index.d.ts +2 -0
  67. package/radio/index.d.ts +2 -0
  68. package/schematics/ng-add/index.js +1 -1
  69. package/schematics/ng-add/index.mjs +1 -1
  70. package/sidenav/index.d.ts +1 -0
  71. package/slider/index.d.ts +4 -1
  72. package/tabs/index.d.ts +4 -2
  73. package/timepicker/index.d.ts +1 -0
  74. package/tooltip/index.d.ts +4 -5
@@ -248,6 +248,7 @@ export declare class MatAutocompleteSelectedEvent {
248
248
 
249
249
  /** Base class with all of the `MatAutocompleteTrigger` functionality. */
250
250
  export declare class MatAutocompleteTrigger implements ControlValueAccessor, AfterViewInit, OnChanges, OnDestroy {
251
+ private _injector;
251
252
  private _element;
252
253
  private _overlay;
253
254
  private _viewContainerRef;
@@ -257,13 +258,16 @@ export declare class MatAutocompleteTrigger implements ControlValueAccessor, Aft
257
258
  private _formField;
258
259
  private _document;
259
260
  private _viewportRuler;
261
+ private _scrollStrategy;
262
+ private _renderer;
260
263
  private _defaults;
261
264
  private _overlayRef;
262
265
  private _portal;
263
266
  private _componentDestroyed;
264
- private _scrollStrategy;
267
+ private _initialized;
265
268
  private _keydownSubscription;
266
269
  private _outsideClickSubscription;
270
+ private _cleanupWindowBlur;
267
271
  /** Old value of the native input. Used to work around issues with the `input` event on IE. */
268
272
  private _previousValue;
269
273
  /** Value of the input element when the panel was attached (even if there are no options). */
@@ -330,8 +334,6 @@ export declare class MatAutocompleteTrigger implements ControlValueAccessor, Aft
330
334
  * act as a regular input and the user won't be able to open the panel.
331
335
  */
332
336
  autocompleteDisabled: boolean;
333
- private _initialized;
334
- private _injector;
335
337
  constructor(...args: unknown[]);
336
338
  /** Class to apply to the panel when it's above the input. */
337
339
  private _aboveClass;
@@ -428,8 +430,6 @@ export declare class MatAutocompleteTrigger implements ControlValueAccessor, Aft
428
430
  private _resetActiveItem;
429
431
  /** Determines whether the panel can be opened. */
430
432
  private _canOpen;
431
- /** Use defaultView of injected document if available or fallback to global window reference */
432
- private _getWindow;
433
433
  /** Scrolls to a particular option in the list. */
434
434
  private _scrollToOption;
435
435
  /**
package/button/index.d.ts CHANGED
@@ -65,6 +65,8 @@ export declare class MatAnchor extends MatAnchorBase {
65
65
  * Anchor button base.
66
66
  */
67
67
  declare class MatAnchorBase extends MatButtonBase implements OnInit, OnDestroy {
68
+ private _renderer;
69
+ private _cleanupClick;
68
70
  tabIndex: number;
69
71
  ngOnInit(): void;
70
72
  ngOnDestroy(): void;
package/core/index.d.ts CHANGED
@@ -794,6 +794,7 @@ export declare class MatRippleLoader implements OnDestroy {
794
794
  private _platform;
795
795
  private _ngZone;
796
796
  private _injector;
797
+ private _eventCleanups;
797
798
  private _hosts;
798
799
  constructor();
799
800
  ngOnDestroy(): void;
@@ -15,7 +15,7 @@ $_generate-default-density: true !default;
15
15
 
16
16
  // Warning that will be printed if duplicated styles are generated by a theme.
17
17
  $_duplicate-warning: 'Read more about how style duplication can be avoided in a dedicated ' +
18
- 'guide. https://github.com/angular/components/blob/main/guides/duplicate-theming-styles.md';
18
+ 'guide. https://v18.material.angular.io/guide/duplicate-theming-styles';
19
19
 
20
20
  // Warning that will be printed if the legacy theming API is used.
21
21
  $private-legacy-theme-warning: 'Angular Material themes should be created from a map containing ' +
@@ -395,6 +395,7 @@ export declare class MatCalendarBody<D = any> implements OnChanges, OnDestroy, A
395
395
  private _ngZone;
396
396
  private _platform;
397
397
  private _intl;
398
+ private _eventCleanups;
398
399
  /**
399
400
  * Used to skip the next focus event when rendering the preview range.
400
401
  * We need a flag like this, because some browsers fire focus events asynchronously.
@@ -171,6 +171,8 @@ export declare class MatExpansionPanel extends CdkAccordionItem implements After
171
171
  private _document;
172
172
  private _ngZone;
173
173
  private _elementRef;
174
+ private _renderer;
175
+ private _cleanupTransitionEnd;
174
176
  /** Whether the toggle indicator should be hidden. */
175
177
  get hideToggle(): boolean;
176
178
  set hideToggle(value: boolean);
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { InjectionToken, inject, ChangeDetectorRef, ElementRef, EventEmitter, booleanAttribute, TemplateRef, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, ContentChildren, Input, Output, Directive, forwardRef, ViewContainerRef, NgZone, Injector, afterNextRender, NgModule } from '@angular/core';
2
+ import { InjectionToken, inject, ChangeDetectorRef, ElementRef, EventEmitter, booleanAttribute, TemplateRef, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, ContentChildren, Input, Output, Directive, forwardRef, Injector, ViewContainerRef, NgZone, Renderer2, afterNextRender, NgModule } from '@angular/core';
3
3
  import { MAT_OPTION_PARENT_COMPONENT, MatOption, MAT_OPTGROUP, MatOptionSelectionChange, _countGroupLabelsBeforeOption, _getOptionScrollPosition, MatOptionModule, MatCommonModule } from '@angular/material/core';
4
4
  export { MatOptgroup, MatOption } from '@angular/material/core';
5
5
  import { ViewportRuler, CdkScrollableModule } from '@angular/cdk/scrolling';
@@ -7,7 +7,7 @@ import { Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
7
7
  import { _IdGenerator, ActiveDescendantKeyManager, removeAriaReferencedId, addAriaReferencedId } from '@angular/cdk/a11y';
8
8
  import { Platform, _getEventTarget } from '@angular/cdk/platform';
9
9
  import { trigger, state, style, transition, group, animate } from '@angular/animations';
10
- import { Subscription, Subject, merge, of, defer, fromEvent, Observable } from 'rxjs';
10
+ import { Subscription, Subject, merge, of, defer, Observable } from 'rxjs';
11
11
  import { Directionality } from '@angular/cdk/bidi';
12
12
  import { hasModifierKey, ESCAPE, ENTER, UP_ARROW, DOWN_ARROW, TAB } from '@angular/cdk/keycodes';
13
13
  import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
@@ -242,10 +242,10 @@ class MatAutocomplete {
242
242
  _skipPredicate() {
243
243
  return false;
244
244
  }
245
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
246
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.1.0-next.2", type: MatAutocomplete, isStandalone: true, selector: "mat-autocomplete", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], displayWith: "displayWith", autoActiveFirstOption: ["autoActiveFirstOption", "autoActiveFirstOption", booleanAttribute], autoSelectActiveOption: ["autoSelectActiveOption", "autoSelectActiveOption", booleanAttribute], requireSelection: ["requireSelection", "requireSelection", booleanAttribute], panelWidth: "panelWidth", disableRipple: ["disableRipple", "disableRipple", booleanAttribute], classList: ["class", "classList"], hideSingleSelectionIndicator: ["hideSingleSelectionIndicator", "hideSingleSelectionIndicator", booleanAttribute] }, outputs: { optionSelected: "optionSelected", opened: "opened", closed: "closed", optionActivated: "optionActivated" }, host: { classAttribute: "mat-mdc-autocomplete" }, providers: [{ provide: MAT_OPTION_PARENT_COMPONENT, useExisting: MatAutocomplete }], queries: [{ propertyName: "options", predicate: MatOption, descendants: true }, { propertyName: "optionGroups", predicate: MAT_OPTGROUP, descendants: true }], viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, static: true }, { propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], exportAs: ["matAutocomplete"], ngImport: i0, template: "<ng-template let-formFieldId=\"id\">\n <div\n class=\"mat-mdc-autocomplete-panel mdc-menu-surface mdc-menu-surface--open\"\n role=\"listbox\"\n [id]=\"id\"\n [class]=\"_classList\"\n [class.mat-mdc-autocomplete-visible]=\"showPanel\"\n [class.mat-mdc-autocomplete-hidden]=\"!showPanel\"\n [class.mat-primary]=\"_color === 'primary'\"\n [class.mat-accent]=\"_color === 'accent'\"\n [class.mat-warn]=\"_color === 'warn'\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"_getPanelAriaLabelledby(formFieldId)\"\n [@panelAnimation]=\"isOpen ? 'visible' : 'hidden'\"\n (@panelAnimation.done)=\"_animationDone.next($event)\"\n #panel>\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: ["div.mat-mdc-autocomplete-panel{width:100%;max-height:256px;visibility:hidden;transform-origin:center top;overflow:auto;padding:8px 0;box-sizing:border-box;position:static;border-radius:var(--mat-autocomplete-container-shape, var(--mat-sys-corner-extra-small));box-shadow:var(--mat-autocomplete-container-elevation-shadow, 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12));background-color:var(--mat-autocomplete-background-color, var(--mat-sys-surface-container))}@media(forced-colors: active){div.mat-mdc-autocomplete-panel{outline:solid 1px}}.cdk-overlay-pane:not(.mat-mdc-autocomplete-panel-above) div.mat-mdc-autocomplete-panel{border-top-left-radius:0;border-top-right-radius:0}.mat-mdc-autocomplete-panel-above div.mat-mdc-autocomplete-panel{border-bottom-left-radius:0;border-bottom-right-radius:0;transform-origin:center bottom}div.mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{visibility:visible}div.mat-mdc-autocomplete-panel.mat-mdc-autocomplete-hidden{visibility:hidden;pointer-events:none}mat-autocomplete{display:none}"], animations: [panelAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
245
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
246
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.1.0-next.3", type: MatAutocomplete, isStandalone: true, selector: "mat-autocomplete", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], displayWith: "displayWith", autoActiveFirstOption: ["autoActiveFirstOption", "autoActiveFirstOption", booleanAttribute], autoSelectActiveOption: ["autoSelectActiveOption", "autoSelectActiveOption", booleanAttribute], requireSelection: ["requireSelection", "requireSelection", booleanAttribute], panelWidth: "panelWidth", disableRipple: ["disableRipple", "disableRipple", booleanAttribute], classList: ["class", "classList"], hideSingleSelectionIndicator: ["hideSingleSelectionIndicator", "hideSingleSelectionIndicator", booleanAttribute] }, outputs: { optionSelected: "optionSelected", opened: "opened", closed: "closed", optionActivated: "optionActivated" }, host: { classAttribute: "mat-mdc-autocomplete" }, providers: [{ provide: MAT_OPTION_PARENT_COMPONENT, useExisting: MatAutocomplete }], queries: [{ propertyName: "options", predicate: MatOption, descendants: true }, { propertyName: "optionGroups", predicate: MAT_OPTGROUP, descendants: true }], viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, static: true }, { propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], exportAs: ["matAutocomplete"], ngImport: i0, template: "<ng-template let-formFieldId=\"id\">\n <div\n class=\"mat-mdc-autocomplete-panel mdc-menu-surface mdc-menu-surface--open\"\n role=\"listbox\"\n [id]=\"id\"\n [class]=\"_classList\"\n [class.mat-mdc-autocomplete-visible]=\"showPanel\"\n [class.mat-mdc-autocomplete-hidden]=\"!showPanel\"\n [class.mat-primary]=\"_color === 'primary'\"\n [class.mat-accent]=\"_color === 'accent'\"\n [class.mat-warn]=\"_color === 'warn'\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"_getPanelAriaLabelledby(formFieldId)\"\n [@panelAnimation]=\"isOpen ? 'visible' : 'hidden'\"\n (@panelAnimation.done)=\"_animationDone.next($event)\"\n #panel>\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: ["div.mat-mdc-autocomplete-panel{width:100%;max-height:256px;visibility:hidden;transform-origin:center top;overflow:auto;padding:8px 0;box-sizing:border-box;position:static;border-radius:var(--mat-autocomplete-container-shape, var(--mat-sys-corner-extra-small));box-shadow:var(--mat-autocomplete-container-elevation-shadow, 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12));background-color:var(--mat-autocomplete-background-color, var(--mat-sys-surface-container))}@media(forced-colors: active){div.mat-mdc-autocomplete-panel{outline:solid 1px}}.cdk-overlay-pane:not(.mat-mdc-autocomplete-panel-above) div.mat-mdc-autocomplete-panel{border-top-left-radius:0;border-top-right-radius:0}.mat-mdc-autocomplete-panel-above div.mat-mdc-autocomplete-panel{border-bottom-left-radius:0;border-bottom-right-radius:0;transform-origin:center bottom}div.mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{visibility:visible}div.mat-mdc-autocomplete-panel.mat-mdc-autocomplete-hidden{visibility:hidden;pointer-events:none}mat-autocomplete{display:none}"], animations: [panelAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
247
247
  }
248
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocomplete, decorators: [{
248
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocomplete, decorators: [{
249
249
  type: Component,
250
250
  args: [{ selector: 'mat-autocomplete', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'matAutocomplete', host: {
251
251
  'class': 'mat-mdc-autocomplete',
@@ -307,10 +307,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.2",
307
307
  class MatAutocompleteOrigin {
308
308
  elementRef = inject(ElementRef);
309
309
  constructor() { }
310
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteOrigin, deps: [], target: i0.ɵɵFactoryTarget.Directive });
311
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.0-next.2", type: MatAutocompleteOrigin, isStandalone: true, selector: "[matAutocompleteOrigin]", exportAs: ["matAutocompleteOrigin"], ngImport: i0 });
310
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteOrigin, deps: [], target: i0.ɵɵFactoryTarget.Directive });
311
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.0-next.3", type: MatAutocompleteOrigin, isStandalone: true, selector: "[matAutocompleteOrigin]", exportAs: ["matAutocompleteOrigin"], ngImport: i0 });
312
312
  }
313
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteOrigin, decorators: [{
313
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteOrigin, decorators: [{
314
314
  type: Directive,
315
315
  args: [{
316
316
  selector: '[matAutocompleteOrigin]',
@@ -356,6 +356,7 @@ const MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER = {
356
356
  };
357
357
  /** Base class with all of the `MatAutocompleteTrigger` functionality. */
358
358
  class MatAutocompleteTrigger {
359
+ _injector = inject(Injector);
359
360
  _element = inject(ElementRef);
360
361
  _overlay = inject(Overlay);
361
362
  _viewContainerRef = inject(ViewContainerRef);
@@ -365,13 +366,16 @@ class MatAutocompleteTrigger {
365
366
  _formField = inject(MAT_FORM_FIELD, { optional: true, host: true });
366
367
  _document = inject(DOCUMENT);
367
368
  _viewportRuler = inject(ViewportRuler);
369
+ _scrollStrategy = inject(MAT_AUTOCOMPLETE_SCROLL_STRATEGY);
370
+ _renderer = inject(Renderer2);
368
371
  _defaults = inject(MAT_AUTOCOMPLETE_DEFAULT_OPTIONS, { optional: true });
369
372
  _overlayRef;
370
373
  _portal;
371
374
  _componentDestroyed = false;
372
- _scrollStrategy = inject(MAT_AUTOCOMPLETE_SCROLL_STRATEGY);
375
+ _initialized = new Subject();
373
376
  _keydownSubscription;
374
377
  _outsideClickSubscription;
378
+ _cleanupWindowBlur;
375
379
  /** Old value of the native input. Used to work around issues with the `input` event on IE. */
376
380
  _previousValue;
377
381
  /** Value of the input element when the panel was attached (even if there are no options). */
@@ -444,18 +448,13 @@ class MatAutocompleteTrigger {
444
448
  * act as a regular input and the user won't be able to open the panel.
445
449
  */
446
450
  autocompleteDisabled;
447
- _initialized = new Subject();
448
- _injector = inject(Injector);
449
451
  constructor() { }
450
452
  /** Class to apply to the panel when it's above the input. */
451
453
  _aboveClass = 'mat-mdc-autocomplete-panel-above';
452
454
  ngAfterViewInit() {
453
455
  this._initialized.next();
454
456
  this._initialized.complete();
455
- const window = this._getWindow();
456
- if (typeof window !== 'undefined') {
457
- this._zone.runOutsideAngular(() => window.addEventListener('blur', this._windowBlurHandler));
458
- }
457
+ this._cleanupWindowBlur = this._renderer.listen('window', 'blur', this._windowBlurHandler);
459
458
  }
460
459
  ngOnChanges(changes) {
461
460
  if (changes['position'] && this._positionStrategy) {
@@ -466,10 +465,7 @@ class MatAutocompleteTrigger {
466
465
  }
467
466
  }
468
467
  ngOnDestroy() {
469
- const window = this._getWindow();
470
- if (typeof window !== 'undefined') {
471
- window.removeEventListener('blur', this._windowBlurHandler);
472
- }
468
+ this._cleanupWindowBlur?.();
473
469
  this._handsetLandscapeSubscription.unsubscribe();
474
470
  this._viewportSubscription.unsubscribe();
475
471
  this._componentDestroyed = true;
@@ -567,26 +563,38 @@ class MatAutocompleteTrigger {
567
563
  }
568
564
  /** Stream of clicks outside of the autocomplete panel. */
569
565
  _getOutsideClickStream() {
570
- return merge(fromEvent(this._document, 'click'), fromEvent(this._document, 'auxclick'), fromEvent(this._document, 'touchend')).pipe(filter(event => {
571
- // If we're in the Shadow DOM, the event target will be the shadow root, so we have to
572
- // fall back to check the first element in the path of the click event.
573
- const clickTarget = _getEventTarget(event);
574
- const formField = this._formField
575
- ? this._formField.getConnectedOverlayOrigin().nativeElement
576
- : null;
577
- const customOrigin = this.connectedTo ? this.connectedTo.elementRef.nativeElement : null;
578
- return (this._overlayAttached &&
579
- clickTarget !== this._element.nativeElement &&
580
- // Normally focus moves inside `mousedown` so this condition will almost always be
581
- // true. Its main purpose is to handle the case where the input is focused from an
582
- // outside click which propagates up to the `body` listener within the same sequence
583
- // and causes the panel to close immediately (see #3106).
584
- this._document.activeElement !== this._element.nativeElement &&
585
- (!formField || !formField.contains(clickTarget)) &&
586
- (!customOrigin || !customOrigin.contains(clickTarget)) &&
587
- !!this._overlayRef &&
588
- !this._overlayRef.overlayElement.contains(clickTarget));
589
- }));
566
+ return new Observable(observer => {
567
+ const listener = (event) => {
568
+ // If we're in the Shadow DOM, the event target will be the shadow root, so we have to
569
+ // fall back to check the first element in the path of the click event.
570
+ const clickTarget = _getEventTarget(event);
571
+ const formField = this._formField
572
+ ? this._formField.getConnectedOverlayOrigin().nativeElement
573
+ : null;
574
+ const customOrigin = this.connectedTo ? this.connectedTo.elementRef.nativeElement : null;
575
+ if (this._overlayAttached &&
576
+ clickTarget !== this._element.nativeElement &&
577
+ // Normally focus moves inside `mousedown` so this condition will almost always be
578
+ // true. Its main purpose is to handle the case where the input is focused from an
579
+ // outside click which propagates up to the `body` listener within the same sequence
580
+ // and causes the panel to close immediately (see #3106).
581
+ this._document.activeElement !== this._element.nativeElement &&
582
+ (!formField || !formField.contains(clickTarget)) &&
583
+ (!customOrigin || !customOrigin.contains(clickTarget)) &&
584
+ !!this._overlayRef &&
585
+ !this._overlayRef.overlayElement.contains(clickTarget)) {
586
+ observer.next(event);
587
+ }
588
+ };
589
+ const cleanups = [
590
+ this._renderer.listen('document', 'click', listener),
591
+ this._renderer.listen('document', 'auxclick', listener),
592
+ this._renderer.listen('document', 'touchend', listener),
593
+ ];
594
+ return () => {
595
+ cleanups.forEach(current => current());
596
+ };
597
+ });
590
598
  }
591
599
  // Implemented as part of ControlValueAccessor.
592
600
  writeValue(value) {
@@ -1075,10 +1083,6 @@ class MatAutocompleteTrigger {
1075
1083
  const element = this._element.nativeElement;
1076
1084
  return !element.readOnly && !element.disabled && !this.autocompleteDisabled;
1077
1085
  }
1078
- /** Use defaultView of injected document if available or fallback to global window reference */
1079
- _getWindow() {
1080
- return this._document?.defaultView || window;
1081
- }
1082
1086
  /** Scrolls to a particular option in the list. */
1083
1087
  _scrollToOption(index) {
1084
1088
  // Given that we are not actually focusing active options, we must manually adjust scroll
@@ -1157,10 +1161,10 @@ class MatAutocompleteTrigger {
1157
1161
  this._trackedModal = null;
1158
1162
  }
1159
1163
  }
1160
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1161
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.1.0-next.2", type: MatAutocompleteTrigger, isStandalone: true, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: { autocomplete: ["matAutocomplete", "autocomplete"], position: ["matAutocompletePosition", "position"], connectedTo: ["matAutocompleteConnectedTo", "connectedTo"], autocompleteAttribute: ["autocomplete", "autocompleteAttribute"], autocompleteDisabled: ["matAutocompleteDisabled", "autocompleteDisabled", booleanAttribute] }, host: { listeners: { "focusin": "_handleFocus()", "blur": "_onTouched()", "input": "_handleInput($event)", "keydown": "_handleKeydown($event)", "click": "_handleClick()" }, properties: { "attr.autocomplete": "autocompleteAttribute", "attr.role": "autocompleteDisabled ? null : \"combobox\"", "attr.aria-autocomplete": "autocompleteDisabled ? null : \"list\"", "attr.aria-activedescendant": "(panelOpen && activeOption) ? activeOption.id : null", "attr.aria-expanded": "autocompleteDisabled ? null : panelOpen.toString()", "attr.aria-controls": "(autocompleteDisabled || !panelOpen) ? null : autocomplete?.id", "attr.aria-haspopup": "autocompleteDisabled ? null : \"listbox\"" }, classAttribute: "mat-mdc-autocomplete-trigger" }, providers: [MAT_AUTOCOMPLETE_VALUE_ACCESSOR], exportAs: ["matAutocompleteTrigger"], usesOnChanges: true, ngImport: i0 });
1164
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1165
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.1.0-next.3", type: MatAutocompleteTrigger, isStandalone: true, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: { autocomplete: ["matAutocomplete", "autocomplete"], position: ["matAutocompletePosition", "position"], connectedTo: ["matAutocompleteConnectedTo", "connectedTo"], autocompleteAttribute: ["autocomplete", "autocompleteAttribute"], autocompleteDisabled: ["matAutocompleteDisabled", "autocompleteDisabled", booleanAttribute] }, host: { listeners: { "focusin": "_handleFocus()", "blur": "_onTouched()", "input": "_handleInput($event)", "keydown": "_handleKeydown($event)", "click": "_handleClick()" }, properties: { "attr.autocomplete": "autocompleteAttribute", "attr.role": "autocompleteDisabled ? null : \"combobox\"", "attr.aria-autocomplete": "autocompleteDisabled ? null : \"list\"", "attr.aria-activedescendant": "(panelOpen && activeOption) ? activeOption.id : null", "attr.aria-expanded": "autocompleteDisabled ? null : panelOpen.toString()", "attr.aria-controls": "(autocompleteDisabled || !panelOpen) ? null : autocomplete?.id", "attr.aria-haspopup": "autocompleteDisabled ? null : \"listbox\"" }, classAttribute: "mat-mdc-autocomplete-trigger" }, providers: [MAT_AUTOCOMPLETE_VALUE_ACCESSOR], exportAs: ["matAutocompleteTrigger"], usesOnChanges: true, ngImport: i0 });
1162
1166
  }
1163
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteTrigger, decorators: [{
1167
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteTrigger, decorators: [{
1164
1168
  type: Directive,
1165
1169
  args: [{
1166
1170
  selector: `input[matAutocomplete], textarea[matAutocomplete]`,
@@ -1202,8 +1206,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.2",
1202
1206
  }] } });
1203
1207
 
1204
1208
  class MatAutocompleteModule {
1205
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1206
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteModule, imports: [OverlayModule,
1209
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1210
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteModule, imports: [OverlayModule,
1207
1211
  MatOptionModule,
1208
1212
  MatCommonModule,
1209
1213
  MatAutocomplete,
@@ -1214,13 +1218,13 @@ class MatAutocompleteModule {
1214
1218
  MatCommonModule,
1215
1219
  MatAutocompleteTrigger,
1216
1220
  MatAutocompleteOrigin] });
1217
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteModule, providers: [MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [OverlayModule,
1221
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteModule, providers: [MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [OverlayModule,
1218
1222
  MatOptionModule,
1219
1223
  MatCommonModule, CdkScrollableModule,
1220
1224
  MatOptionModule,
1221
1225
  MatCommonModule] });
1222
1226
  }
1223
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.2", ngImport: i0, type: MatAutocompleteModule, decorators: [{
1227
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0-next.3", ngImport: i0, type: MatAutocompleteModule, decorators: [{
1224
1228
  type: NgModule,
1225
1229
  args: [{
1226
1230
  imports: [