@angular/cdk 14.0.0-next.0 → 14.0.0-next.11

package/fesm2020/a11y.mjs

@@ -1,12 +1,12 @@
 import { DOCUMENT } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Injectable, Inject, QueryList, Directive, Input, InjectionToken, Optional, EventEmitter, Output, NgModule } from '@angular/core';
+import * as i1 from '@angular/cdk/platform';
+import { _getFocusedElementPierceShadowDom, normalizePassiveListenerOptions, _getEventTarget, _getShadowRoot } from '@angular/cdk/platform';
 import { Subject, Subscription, BehaviorSubject, of } from 'rxjs';
 import { hasModifierKey, A, Z, ZERO, NINE, END, HOME, LEFT_ARROW, RIGHT_ARROW, UP_ARROW, DOWN_ARROW, TAB, ALT, CONTROL, MAC_META, META, SHIFT } from '@angular/cdk/keycodes';
 import { tap, debounceTime, filter, map, take, skip, distinctUntilChanged, takeUntil } from 'rxjs/operators';
 import { coerceBooleanProperty, coerceElement } from '@angular/cdk/coercion';
-import * as i1 from '@angular/cdk/platform';
-import { _getFocusedElementPierceShadowDom, normalizePassiveListenerOptions, _getEventTarget, _getShadowRoot, PlatformModule } from '@angular/cdk/platform';
 import * as i1$1 from '@angular/cdk/observers';
 import { ObserversModule } from '@angular/cdk/observers';
 
@@ -61,25 +61,45 @@ function getAriaReferenceIds(el, attr) {
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-/** ID used for the body container where all messages are appended. */
+/**
+ * ID used for the body container where all messages are appended.
+ * @deprecated No longer being used. To be removed.
+ * @breaking-change 14.0.0
+ */
 const MESSAGES_CONTAINER_ID = 'cdk-describedby-message-container';
-/** ID prefix used for each created message element. */
+/**
+ * ID prefix used for each created message element.
+ * @deprecated To be turned into a private variable.
+ * @breaking-change 14.0.0
+ */
 const CDK_DESCRIBEDBY_ID_PREFIX = 'cdk-describedby-message';
-/** Attribute given to each host element that is described by a message element. */
+/**
+ * Attribute given to each host element that is described by a message element.
+ * @deprecated To be turned into a private variable.
+ * @breaking-change 14.0.0
+ */
 const CDK_DESCRIBEDBY_HOST_ATTRIBUTE = 'cdk-describedby-host';
 /** Global incremental identifier for each registered message element. */
 let nextId = 0;
-/** Global map of all registered message elements that have been placed into the document. */
-const messageRegistry = new Map();
-/** Container for all registered messages. */
-let messagesContainer = null;
 /**
  * Utility that creates visually hidden elements with a message content. Useful for elements that
  * want to use aria-describedby to further describe themselves without adding additional visual
  * content.
  */
 class AriaDescriber {
-    constructor(_document) {
+    constructor(_document, 
+    /**
+     * @deprecated To be turned into a required parameter.
+     * @breaking-change 14.0.0
+     */
+    _platform) {
+        this._platform = _platform;
+        /** Map of all registered message elements that have been placed into the document. */
+        this._messageRegistry = new Map();
+        /** Container for all registered messages. */
+        this._messagesContainer = null;
+        /** Unique ID for the service. */
+        this._id = `${nextId++}`;
         this._document = _document;
     }
     describe(hostElement, message, role) {
@@ -90,9 +110,9 @@ class AriaDescriber {
         if (typeof message !== 'string') {
             // We need to ensure that the element has an ID.
             setMessageId(message);
-            messageRegistry.set(key, { messageElement: message, referenceCount: 0 });
+            this._messageRegistry.set(key, { messageElement: message, referenceCount: 0 });
         }
-        else if (!messageRegistry.has(key)) {
+        else if (!this._messageRegistry.has(key)) {
             this._createMessageElement(message, role);
         }
         if (!this._isElementDescribedByMessage(hostElement, key)) {
@@ -110,26 +130,26 @@ class AriaDescriber {
         // If the message is a string, it means that it's one that we created for the
         // consumer so we can remove it safely, otherwise we should leave it in place.
         if (typeof message === 'string') {
-            const registeredMessage = messageRegistry.get(key);
+            const registeredMessage = this._messageRegistry.get(key);
             if (registeredMessage && registeredMessage.referenceCount === 0) {
                 this._deleteMessageElement(key);
             }
         }
-        if (messagesContainer && messagesContainer.childNodes.length === 0) {
-            this._deleteMessagesContainer();
+        if (this._messagesContainer?.childNodes.length === 0) {
+            this._messagesContainer.remove();
+            this._messagesContainer = null;
         }
     }
     /** Unregisters all created message elements and removes the message container. */
     ngOnDestroy() {
-        const describedElements = this._document.querySelectorAll(`[${CDK_DESCRIBEDBY_HOST_ATTRIBUTE}]`);
+        const describedElements = this._document.querySelectorAll(`[${CDK_DESCRIBEDBY_HOST_ATTRIBUTE}="${this._id}"]`);
         for (let i = 0; i < describedElements.length; i++) {
             this._removeCdkDescribedByReferenceIds(describedElements[i]);
             describedElements[i].removeAttribute(CDK_DESCRIBEDBY_HOST_ATTRIBUTE);
         }
-        if (messagesContainer) {
-            this._deleteMessagesContainer();
-        }
-        messageRegistry.clear();
+        this._messagesContainer?.remove();
+        this._messagesContainer = null;
+        this._messageRegistry.clear();
     }
     /**
      * Creates a new element in the visually hidden message container element with the message
@@ -143,43 +163,44 @@ class AriaDescriber {
             messageElement.setAttribute('role', role);
         }
         this._createMessagesContainer();
-        messagesContainer.appendChild(messageElement);
-        messageRegistry.set(getKey(message, role), { messageElement, referenceCount: 0 });
+        this._messagesContainer.appendChild(messageElement);
+        this._messageRegistry.set(getKey(message, role), { messageElement, referenceCount: 0 });
     }
     /** Deletes the message element from the global messages container. */
     _deleteMessageElement(key) {
-        const registeredMessage = messageRegistry.get(key);
-        registeredMessage?.messageElement?.remove();
-        messageRegistry.delete(key);
+        this._messageRegistry.get(key)?.messageElement?.remove();
+        this._messageRegistry.delete(key);
     }
     /** Creates the global container for all aria-describedby messages. */
     _createMessagesContainer() {
-        if (!messagesContainer) {
-            const preExistingContainer = this._document.getElementById(MESSAGES_CONTAINER_ID);
+        if (this._messagesContainer) {
+            return;
+        }
+        const containerClassName = 'cdk-describedby-message-container';
+        const serverContainers = this._document.querySelectorAll(`.${containerClassName}[platform="server"]`);
+        for (let i = 0; i < serverContainers.length; i++) {
             // When going from the server to the client, we may end up in a situation where there's
             // already a container on the page, but we don't have a reference to it. Clear the
             // old container so we don't get duplicates. Doing this, instead of emptying the previous
             // container, should be slightly faster.
-            preExistingContainer?.remove();
-            messagesContainer = this._document.createElement('div');
-            messagesContainer.id = MESSAGES_CONTAINER_ID;
-            // We add `visibility: hidden` in order to prevent text in this container from
-            // being searchable by the browser's Ctrl + F functionality.
-            // Screen-readers will still read the description for elements with aria-describedby even
-            // when the description element is not visible.
-            messagesContainer.style.visibility = 'hidden';
-            // Even though we use `visibility: hidden`, we still apply `cdk-visually-hidden` so that
-            // the description element doesn't impact page layout.
-            messagesContainer.classList.add('cdk-visually-hidden');
-            this._document.body.appendChild(messagesContainer);
-        }
-    }
-    /** Deletes the global messages container. */
-    _deleteMessagesContainer() {
-        if (messagesContainer) {
-            messagesContainer.remove();
-            messagesContainer = null;
-        }
+            serverContainers[i].remove();
+        }
+        const messagesContainer = this._document.createElement('div');
+        // We add `visibility: hidden` in order to prevent text in this container from
+        // being searchable by the browser's Ctrl + F functionality.
+        // Screen-readers will still read the description for elements with aria-describedby even
+        // when the description element is not visible.
+        messagesContainer.style.visibility = 'hidden';
+        // Even though we use `visibility: hidden`, we still apply `cdk-visually-hidden` so that
+        // the description element doesn't impact page layout.
+        messagesContainer.classList.add(containerClassName);
+        messagesContainer.classList.add('cdk-visually-hidden');
+        // @breaking-change 14.0.0 Remove null check for `_platform`.
+        if (this._platform && !this._platform.isBrowser) {
+            messagesContainer.setAttribute('platform', 'server');
+        }
+        this._document.body.appendChild(messagesContainer);
+        this._messagesContainer = messagesContainer;
     }
     /** Removes all cdk-describedby messages that are hosted through the element. */
     _removeCdkDescribedByReferenceIds(element) {
@@ -192,11 +213,11 @@ class AriaDescriber {
      * message's reference count.
      */
     _addMessageReference(element, key) {
-        const registeredMessage = messageRegistry.get(key);
+        const registeredMessage = this._messageRegistry.get(key);
         // Add the aria-describedby reference and set the
         // describedby_host attribute to mark the element.
         addAriaReferencedId(element, 'aria-describedby', registeredMessage.messageElement.id);
-        element.setAttribute(CDK_DESCRIBEDBY_HOST_ATTRIBUTE, '');
+        element.setAttribute(CDK_DESCRIBEDBY_HOST_ATTRIBUTE, this._id);
         registeredMessage.referenceCount++;
     }
     /**
@@ -204,7 +225,7 @@ class AriaDescriber {
      * and decrements the registered message's reference count.
      */
     _removeMessageReference(element, key) {
-        const registeredMessage = messageRegistry.get(key);
+        const registeredMessage = this._messageRegistry.get(key);
         registeredMessage.referenceCount--;
         removeAriaReferencedId(element, 'aria-describedby', registeredMessage.messageElement.id);
         element.removeAttribute(CDK_DESCRIBEDBY_HOST_ATTRIBUTE);
@@ -212,7 +233,7 @@ class AriaDescriber {
     /** Returns true if the element has been described by the provided message ID. */
     _isElementDescribedByMessage(element, key) {
         const referenceIds = getAriaReferenceIds(element, 'aria-describedby');
-        const registeredMessage = messageRegistry.get(key);
+        const registeredMessage = this._messageRegistry.get(key);
         const messageId = registeredMessage && registeredMessage.messageElement.id;
         return !!messageId && referenceIds.indexOf(messageId) != -1;
     }
@@ -238,15 +259,15 @@ class AriaDescriber {
         return element.nodeType === this._document.ELEMENT_NODE;
     }
 }
-AriaDescriber.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: AriaDescriber, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
-AriaDescriber.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: AriaDescriber, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: AriaDescriber, decorators: [{
+AriaDescriber.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: AriaDescriber, deps: [{ token: DOCUMENT }, { token: i1.Platform }], target: i0.ɵɵFactoryTarget.Injectable });
+AriaDescriber.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: AriaDescriber, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: AriaDescriber, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
-                }] }]; } });
+                }] }, { type: i1.Platform }]; } });
 /** Gets a key that can be used to look messages up in the registry. */
 function getKey(message, role) {
     return typeof message === 'string' ? `${role || ''}/${message}` : message;
@@ -756,9 +777,9 @@ class InteractivityChecker {
             (config?.ignoreVisibility || this.isVisible(element)));
     }
 }
-InteractivityChecker.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: InteractivityChecker, deps: [{ token: i1.Platform }], target: i0.ɵɵFactoryTarget.Injectable });
-InteractivityChecker.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: InteractivityChecker, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: InteractivityChecker, decorators: [{
+InteractivityChecker.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: InteractivityChecker, deps: [{ token: i1.Platform }], target: i0.ɵɵFactoryTarget.Injectable });
+InteractivityChecker.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: InteractivityChecker, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: InteractivityChecker, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i1.Platform }]; } });
@@ -1157,9 +1178,9 @@ class FocusTrapFactory {
         return new FocusTrap(element, this._checker, this._ngZone, this._document, deferCaptureElements);
     }
 }
-FocusTrapFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusTrapFactory, deps: [{ token: InteractivityChecker }, { token: i0.NgZone }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
-FocusTrapFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusTrapFactory, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusTrapFactory, decorators: [{
+FocusTrapFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusTrapFactory, deps: [{ token: InteractivityChecker }, { token: i0.NgZone }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+FocusTrapFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusTrapFactory, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusTrapFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: InteractivityChecker }, { type: i0.NgZone }, { type: undefined, decorators: [{
@@ -1231,9 +1252,9 @@ class CdkTrapFocus {
         this.focusTrap.focusInitialElementWhenReady();
     }
 }
-CdkTrapFocus.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: CdkTrapFocus, deps: [{ token: i0.ElementRef }, { token: FocusTrapFactory }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
-CdkTrapFocus.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.0-rc.1", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: { enabled: ["cdkTrapFocus", "enabled"], autoCapture: ["cdkTrapFocusAutoCapture", "autoCapture"] }, exportAs: ["cdkTrapFocus"], usesOnChanges: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: CdkTrapFocus, decorators: [{
+CdkTrapFocus.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: CdkTrapFocus, deps: [{ token: i0.ElementRef }, { token: FocusTrapFactory }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
+CdkTrapFocus.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.13", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: { enabled: ["cdkTrapFocus", "enabled"], autoCapture: ["cdkTrapFocusAutoCapture", "autoCapture"] }, exportAs: ["cdkTrapFocus"], usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: CdkTrapFocus, decorators: [{
             type: Directive,
             args: [{
                     selector: '[cdkTrapFocus]',
@@ -1423,9 +1444,9 @@ class FocusTrapManager {
         }
     }
 }
-FocusTrapManager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusTrapManager, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FocusTrapManager.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusTrapManager, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusTrapManager, decorators: [{
+FocusTrapManager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusTrapManager, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FocusTrapManager.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusTrapManager, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusTrapManager, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1458,9 +1479,9 @@ class ConfigurableFocusTrapFactory {
         return new ConfigurableFocusTrap(element, this._checker, this._ngZone, this._document, this._focusTrapManager, this._inertStrategy, configObject);
     }
 }
-ConfigurableFocusTrapFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: ConfigurableFocusTrapFactory, deps: [{ token: InteractivityChecker }, { token: i0.NgZone }, { token: FocusTrapManager }, { token: DOCUMENT }, { token: FOCUS_TRAP_INERT_STRATEGY, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-ConfigurableFocusTrapFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: ConfigurableFocusTrapFactory, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: ConfigurableFocusTrapFactory, decorators: [{
+ConfigurableFocusTrapFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: ConfigurableFocusTrapFactory, deps: [{ token: InteractivityChecker }, { token: i0.NgZone }, { token: FocusTrapManager }, { token: DOCUMENT }, { token: FOCUS_TRAP_INERT_STRATEGY, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+ConfigurableFocusTrapFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: ConfigurableFocusTrapFactory, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: ConfigurableFocusTrapFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: InteractivityChecker }, { type: i0.NgZone }, { type: FocusTrapManager }, { type: undefined, decorators: [{
@@ -1656,9 +1677,9 @@ class InputModalityDetector {
         }
     }
 }
-InputModalityDetector.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: InputModalityDetector, deps: [{ token: i1.Platform }, { token: i0.NgZone }, { token: DOCUMENT }, { token: INPUT_MODALITY_DETECTOR_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-InputModalityDetector.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: InputModalityDetector, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: InputModalityDetector, decorators: [{
+InputModalityDetector.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: InputModalityDetector, deps: [{ token: i1.Platform }, { token: i0.NgZone }, { token: DOCUMENT }, { token: INPUT_MODALITY_DETECTOR_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+InputModalityDetector.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: InputModalityDetector, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: InputModalityDetector, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i1.Platform }, { type: i0.NgZone }, { type: Document, decorators: [{
@@ -1733,16 +1754,19 @@ class LiveAnnouncer {
         //   second time without clearing and then using a non-zero delay.
         // (using JAWS 17 at time of this writing).
         return this._ngZone.runOutsideAngular(() => {
-            return new Promise(resolve => {
-                clearTimeout(this._previousTimeout);
-                this._previousTimeout = setTimeout(() => {
-                    this._liveElement.textContent = message;
-                    resolve();
-                    if (typeof duration === 'number') {
-                        this._previousTimeout = setTimeout(() => this.clear(), duration);
-                    }
-                }, 100);
-            });
+            if (!this._currentPromise) {
+                this._currentPromise = new Promise(resolve => (this._currentResolve = resolve));
+            }
+            clearTimeout(this._previousTimeout);
+            this._previousTimeout = setTimeout(() => {
+                this._liveElement.textContent = message;
+                if (typeof duration === 'number') {
+                    this._previousTimeout = setTimeout(() => this.clear(), duration);
+                }
+                this._currentResolve();
+                this._currentPromise = this._currentResolve = undefined;
+            }, 100);
+            return this._currentPromise;
         });
     }
     /**
@@ -1759,6 +1783,8 @@ class LiveAnnouncer {
         clearTimeout(this._previousTimeout);
         this._liveElement?.remove();
         this._liveElement = null;
+        this._currentResolve?.();
+        this._currentPromise = this._currentResolve = undefined;
     }
     _createLiveElement() {
         const elementClass = 'cdk-live-announcer-element';
@@ -1776,9 +1802,9 @@ class LiveAnnouncer {
         return liveEl;
     }
 }
-LiveAnnouncer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: LiveAnnouncer, deps: [{ token: LIVE_ANNOUNCER_ELEMENT_TOKEN, optional: true }, { token: i0.NgZone }, { token: DOCUMENT }, { token: LIVE_ANNOUNCER_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-LiveAnnouncer.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: LiveAnnouncer, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: LiveAnnouncer, decorators: [{
+LiveAnnouncer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: LiveAnnouncer, deps: [{ token: LIVE_ANNOUNCER_ELEMENT_TOKEN, optional: true }, { token: i0.NgZone }, { token: DOCUMENT }, { token: LIVE_ANNOUNCER_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+LiveAnnouncer.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: LiveAnnouncer, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: LiveAnnouncer, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
@@ -1827,7 +1853,7 @@ class CdkAriaLive {
                     // The `MutationObserver` fires also for attribute
                     // changes which we don't want to announce.
                     if (elementText !== this._previousAnnouncedText) {
-                        this._liveAnnouncer.announce(elementText, this._politeness);
+                        this._liveAnnouncer.announce(elementText, this._politeness, this.duration);
                         this._previousAnnouncedText = elementText;
                     }
                 });
@@ -1840,9 +1866,9 @@ class CdkAriaLive {
         }
     }
 }
-CdkAriaLive.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: CdkAriaLive, deps: [{ token: i0.ElementRef }, { token: LiveAnnouncer }, { token: i1$1.ContentObserver }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
-CdkAriaLive.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.0-rc.1", type: CdkAriaLive, selector: "[cdkAriaLive]", inputs: { politeness: ["cdkAriaLive", "politeness"] }, exportAs: ["cdkAriaLive"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: CdkAriaLive, decorators: [{
+CdkAriaLive.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: CdkAriaLive, deps: [{ token: i0.ElementRef }, { token: LiveAnnouncer }, { token: i1$1.ContentObserver }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+CdkAriaLive.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.13", type: CdkAriaLive, selector: "[cdkAriaLive]", inputs: { politeness: ["cdkAriaLive", "politeness"], duration: ["cdkAriaLiveDuration", "duration"] }, exportAs: ["cdkAriaLive"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: CdkAriaLive, decorators: [{
             type: Directive,
             args: [{
                     selector: '[cdkAriaLive]',
@@ -1851,6 +1877,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ng
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: LiveAnnouncer }, { type: i1$1.ContentObserver }, { type: i0.NgZone }]; }, propDecorators: { politeness: [{
                 type: Input,
                 args: ['cdkAriaLive']
+            }], duration: [{
+                type: Input,
+                args: ['cdkAriaLiveDuration']
             }] } });
 
 /**
@@ -2109,10 +2138,12 @@ class FocusMonitor {
             return;
         }
         this._setClasses(element);
-        this._emitOrigin(elementInfo.subject, null);
+        this._emitOrigin(elementInfo, null);
     }
-    _emitOrigin(subject, origin) {
-        this._ngZone.run(() => subject.next(origin));
+    _emitOrigin(info, origin) {
+        if (info.subject.observers.length) {
+            this._ngZone.run(() => info.subject.next(origin));
+        }
     }
     _registerGlobalListeners(elementInfo) {
         if (!this._platform.isBrowser) {
@@ -2170,7 +2201,7 @@ class FocusMonitor {
     /** Updates all the state on an element once its focus origin has changed. */
     _originChanged(element, origin, elementInfo) {
         this._setClasses(element, origin);
-        this._emitOrigin(elementInfo.subject, origin);
+        this._emitOrigin(elementInfo, origin);
         this._lastFocusOrigin = origin;
     }
     /**
@@ -2188,9 +2219,9 @@ class FocusMonitor {
         return results;
     }
 }
-FocusMonitor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusMonitor, deps: [{ token: i0.NgZone }, { token: i1.Platform }, { token: InputModalityDetector }, { token: DOCUMENT, optional: true }, { token: FOCUS_MONITOR_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-FocusMonitor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusMonitor, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: FocusMonitor, decorators: [{
+FocusMonitor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusMonitor, deps: [{ token: i0.NgZone }, { token: i1.Platform }, { token: InputModalityDetector }, { token: DOCUMENT, optional: true }, { token: FOCUS_MONITOR_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+FocusMonitor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusMonitor, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: FocusMonitor, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1.Platform }, { type: InputModalityDetector }, { type: undefined, decorators: [{
@@ -2232,9 +2263,9 @@ class CdkMonitorFocus {
         }
     }
 }
-CdkMonitorFocus.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: CdkMonitorFocus, deps: [{ token: i0.ElementRef }, { token: FocusMonitor }], target: i0.ɵɵFactoryTarget.Directive });
-CdkMonitorFocus.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.0-rc.1", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: { cdkFocusChange: "cdkFocusChange" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: CdkMonitorFocus, decorators: [{
+CdkMonitorFocus.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: CdkMonitorFocus, deps: [{ token: i0.ElementRef }, { token: FocusMonitor }], target: i0.ɵɵFactoryTarget.Directive });
+CdkMonitorFocus.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.13", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: { cdkFocusChange: "cdkFocusChange" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: CdkMonitorFocus, decorators: [{
             type: Directive,
             args: [{
                     selector: '[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]',
@@ -2306,26 +2337,21 @@ class HighContrastModeDetector {
     _applyBodyHighContrastModeCssClasses() {
         if (!this._hasCheckedHighContrastMode && this._platform.isBrowser && this._document.body) {
             const bodyClasses = this._document.body.classList;
-            // IE11 doesn't support `classList` operations with multiple arguments
-            bodyClasses.remove(HIGH_CONTRAST_MODE_ACTIVE_CSS_CLASS);
-            bodyClasses.remove(BLACK_ON_WHITE_CSS_CLASS);
-            bodyClasses.remove(WHITE_ON_BLACK_CSS_CLASS);
+            bodyClasses.remove(HIGH_CONTRAST_MODE_ACTIVE_CSS_CLASS, BLACK_ON_WHITE_CSS_CLASS, WHITE_ON_BLACK_CSS_CLASS);
             this._hasCheckedHighContrastMode = true;
             const mode = this.getHighContrastMode();
             if (mode === 1 /* BLACK_ON_WHITE */) {
-                bodyClasses.add(HIGH_CONTRAST_MODE_ACTIVE_CSS_CLASS);
-                bodyClasses.add(BLACK_ON_WHITE_CSS_CLASS);
+                bodyClasses.add(HIGH_CONTRAST_MODE_ACTIVE_CSS_CLASS, BLACK_ON_WHITE_CSS_CLASS);
             }
             else if (mode === 2 /* WHITE_ON_BLACK */) {
-                bodyClasses.add(HIGH_CONTRAST_MODE_ACTIVE_CSS_CLASS);
-                bodyClasses.add(WHITE_ON_BLACK_CSS_CLASS);
+                bodyClasses.add(HIGH_CONTRAST_MODE_ACTIVE_CSS_CLASS, WHITE_ON_BLACK_CSS_CLASS);
             }
         }
     }
 }
-HighContrastModeDetector.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: HighContrastModeDetector, deps: [{ token: i1.Platform }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
-HighContrastModeDetector.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: HighContrastModeDetector, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: HighContrastModeDetector, decorators: [{
+HighContrastModeDetector.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: HighContrastModeDetector, deps: [{ token: i1.Platform }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+HighContrastModeDetector.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: HighContrastModeDetector, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: HighContrastModeDetector, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i1.Platform }, { type: undefined, decorators: [{
@@ -2345,13 +2371,13 @@ class A11yModule {
         highContrastModeDetector._applyBodyHighContrastModeCssClasses();
     }
 }
-A11yModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: A11yModule, deps: [{ token: HighContrastModeDetector }], target: i0.ɵɵFactoryTarget.NgModule });
-A11yModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: A11yModule, declarations: [CdkAriaLive, CdkTrapFocus, CdkMonitorFocus], imports: [PlatformModule, ObserversModule], exports: [CdkAriaLive, CdkTrapFocus, CdkMonitorFocus] });
-A11yModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: A11yModule, imports: [[PlatformModule, ObserversModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0-rc.1", ngImport: i0, type: A11yModule, decorators: [{
+A11yModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: A11yModule, deps: [{ token: HighContrastModeDetector }], target: i0.ɵɵFactoryTarget.NgModule });
+A11yModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: A11yModule, declarations: [CdkAriaLive, CdkTrapFocus, CdkMonitorFocus], imports: [ObserversModule], exports: [CdkAriaLive, CdkTrapFocus, CdkMonitorFocus] });
+A11yModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: A11yModule, imports: [[ObserversModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.13", ngImport: i0, type: A11yModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [PlatformModule, ObserversModule],
+                    imports: [ObserversModule],
                     declarations: [CdkAriaLive, CdkTrapFocus, CdkMonitorFocus],
                     exports: [CdkAriaLive, CdkTrapFocus, CdkMonitorFocus],
                 }]