@angular/material 16.2.1 → 17.0.0-next.0

package/fesm2022/autocomplete/testing.mjs

@@ -2,11 +2,26 @@ import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
 import { MatOptionHarness, MatOptgroupHarness } from '@angular/material/core/testing';
 
-class _MatAutocompleteHarnessBase extends ComponentHarness {
+class MatAutocompleteHarness extends ComponentHarness {
     constructor() {
         super(...arguments);
         this._documentRootLocator = this.documentRootLocatorFactory();
     }
+    /** The selector for the host element of a `MatAutocomplete` instance. */
+    static { this.hostSelector = '.mat-mdc-autocomplete-trigger'; }
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for an autocomplete with specific
+     * attributes.
+     * @param options Options for filtering which autocomplete instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(this, options)
+            .addOption('value', options.value, (harness, value) => HarnessPredicate.stringMatches(harness.getValue(), value))
+            .addOption('disabled', options.disabled, async (harness, disabled) => {
+            return (await harness.isDisabled()) === disabled;
+        });
+    }
     /** Gets the value of the autocomplete input. */
     async getValue() {
         return (await this.host()).getProperty('value');
@@ -41,7 +56,7 @@ class _MatAutocompleteHarnessBase extends ComponentHarness {
         if (!(await this.isOpen())) {
             throw new Error('Unable to retrieve options for autocomplete. Autocomplete panel is closed.');
         }
-        return this._documentRootLocator.locatorForAll(this._optionClass.with({
+        return this._documentRootLocator.locatorForAll(MatOptionHarness.with({
             ...(filters || {}),
             ancestor: await this._getPanelSelector(),
         }))();
@@ -51,7 +66,7 @@ class _MatAutocompleteHarnessBase extends ComponentHarness {
         if (!(await this.isOpen())) {
             throw new Error('Unable to retrieve option groups for autocomplete. Autocomplete panel is closed.');
         }
-        return this._documentRootLocator.locatorForAll(this._optionGroupClass.with({
+        return this._documentRootLocator.locatorForAll(MatOptgroupHarness.with({
             ...(filters || {}),
             ancestor: await this._getPanelSelector(),
         }))();
@@ -68,7 +83,7 @@ class _MatAutocompleteHarnessBase extends ComponentHarness {
     /** Whether the autocomplete is open. */
     async isOpen() {
         const panel = await this._getPanel();
-        return !!panel && (await panel.hasClass(`${this._prefix}-autocomplete-visible`));
+        return !!panel && (await panel.hasClass(`mat-mdc-autocomplete-visible`));
     }
     /** Gets the panel associated with this autocomplete trigger. */
     async _getPanel() {
@@ -77,38 +92,10 @@ class _MatAutocompleteHarnessBase extends ComponentHarness {
         return this._documentRootLocator.locatorForOptional(await this._getPanelSelector())();
     }
     /** Gets the selector that can be used to find the autocomplete trigger's panel. */
-    async _getPanelSelector() {
-        return `#${await (await this.host()).getAttribute('aria-owns')}`;
-    }
-}
-/** Harness for interacting with an MDC-based mat-autocomplete in tests. */
-class MatAutocompleteHarness extends _MatAutocompleteHarnessBase {
-    constructor() {
-        super(...arguments);
-        this._prefix = 'mat-mdc';
-        this._optionClass = MatOptionHarness;
-        this._optionGroupClass = MatOptgroupHarness;
-    }
-    /** The selector for the host element of a `MatAutocomplete` instance. */
-    static { this.hostSelector = '.mat-mdc-autocomplete-trigger'; }
-    /**
-     * Gets a `HarnessPredicate` that can be used to search for an autocomplete with specific
-     * attributes.
-     * @param options Options for filtering which autocomplete instances are considered a match.
-     * @return a `HarnessPredicate` configured with the given options.
-     */
-    static with(options = {}) {
-        return new HarnessPredicate(this, options)
-            .addOption('value', options.value, (harness, value) => HarnessPredicate.stringMatches(harness.getValue(), value))
-            .addOption('disabled', options.disabled, async (harness, disabled) => {
-            return (await harness.isDisabled()) === disabled;
-        });
-    }
-    /** Gets the selector that can be used to find the autocomplete trigger's panel. */
     async _getPanelSelector() {
         return `#${await (await this.host()).getAttribute('aria-controls')}`;
     }
 }
 
-export { MatAutocompleteHarness, _MatAutocompleteHarnessBase };
+export { MatAutocompleteHarness };
 //# sourceMappingURL=testing.mjs.map

package/fesm2022/autocomplete/testing.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"testing.mjs","sources":["../../../../../../../src/material/autocomplete/testing/autocomplete-harness.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {coerceBooleanProperty} from '@angular/cdk/coercion';\nimport {\n  BaseHarnessFilters,\n  ComponentHarness,\n  ComponentHarnessConstructor,\n  HarnessPredicate,\n  TestElement,\n} from '@angular/cdk/testing';\nimport {\n  MatOptgroupHarness,\n  MatOptionHarness,\n  OptgroupHarnessFilters,\n  OptionHarnessFilters,\n} from '@angular/material/core/testing';\nimport {AutocompleteHarnessFilters} from './autocomplete-harness-filters';\n\nexport abstract class _MatAutocompleteHarnessBase<\n  OptionType extends ComponentHarnessConstructor<Option> & {\n    with: (options?: OptionFilters) => HarnessPredicate<Option>;\n  },\n  Option extends ComponentHarness & {click(): Promise<void>},\n  OptionFilters extends BaseHarnessFilters,\n  OptionGroupType extends ComponentHarnessConstructor<OptionGroup> & {\n    with: (options?: OptionGroupFilters) => HarnessPredicate<OptionGroup>;\n  },\n  OptionGroup extends ComponentHarness,\n  OptionGroupFilters extends BaseHarnessFilters,\n> extends ComponentHarness {\n  private _documentRootLocator = this.documentRootLocatorFactory();\n  protected abstract _prefix: string;\n  protected abstract _optionClass: OptionType;\n  protected abstract _optionGroupClass: OptionGroupType;\n\n  /** Gets the value of the autocomplete input. */\n  async getValue(): Promise<string> {\n    return (await this.host()).getProperty<string>('value');\n  }\n\n  /** Whether the autocomplete input is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const disabled = (await this.host()).getAttribute('disabled');\n    return coerceBooleanProperty(await disabled);\n  }\n\n  /** Focuses the autocomplete input. */\n  async focus(): Promise<void> {\n    return (await this.host()).focus();\n  }\n\n  /** Blurs the autocomplete input. */\n  async blur(): Promise<void> {\n    return (await this.host()).blur();\n  }\n\n  /** Whether the autocomplete input is focused. */\n  async isFocused(): Promise<boolean> {\n    return (await this.host()).isFocused();\n  }\n\n  /** Enters text into the autocomplete. */\n  async enterText(value: string): Promise<void> {\n    return (await this.host()).sendKeys(value);\n  }\n\n  /** Clears the input value. */\n  async clear(): Promise<void> {\n    return (await this.host()).clear();\n  }\n\n  /** Gets the options inside the autocomplete panel. */\n  async getOptions(filters?: Omit<OptionFilters, 'ancestor'>): Promise<Option[]> {\n    if (!(await this.isOpen())) {\n      throw new Error('Unable to retrieve options for autocomplete. Autocomplete panel is closed.');\n    }\n\n    return this._documentRootLocator.locatorForAll(\n      this._optionClass.with({\n        ...(filters || {}),\n        ancestor: await this._getPanelSelector(),\n      } as OptionFilters),\n    )();\n  }\n\n  /** Gets the option groups inside the autocomplete panel. */\n  async getOptionGroups(filters?: Omit<OptionGroupFilters, 'ancestor'>): Promise<OptionGroup[]> {\n    if (!(await this.isOpen())) {\n      throw new Error(\n        'Unable to retrieve option groups for autocomplete. Autocomplete panel is closed.',\n      );\n    }\n\n    return this._documentRootLocator.locatorForAll(\n      this._optionGroupClass.with({\n        ...(filters || {}),\n        ancestor: await this._getPanelSelector(),\n      } as OptionGroupFilters),\n    )();\n  }\n\n  /** Selects the first option matching the given filters. */\n  async selectOption(filters: OptionFilters): Promise<void> {\n    await this.focus(); // Focus the input to make sure the autocomplete panel is shown.\n    const options = await this.getOptions(filters);\n    if (!options.length) {\n      throw Error(`Could not find a mat-option matching ${JSON.stringify(filters)}`);\n    }\n    await options[0].click();\n  }\n\n  /** Whether the autocomplete is open. */\n  async isOpen(): Promise<boolean> {\n    const panel = await this._getPanel();\n    return !!panel && (await panel.hasClass(`${this._prefix}-autocomplete-visible`));\n  }\n\n  /** Gets the panel associated with this autocomplete trigger. */\n  private async _getPanel(): Promise<TestElement | null> {\n    // Technically this is static, but it needs to be in a\n    // function, because the autocomplete's panel ID can changed.\n    return this._documentRootLocator.locatorForOptional(await this._getPanelSelector())();\n  }\n\n  /** Gets the selector that can be used to find the autocomplete trigger's panel. */\n  protected async _getPanelSelector(): Promise<string> {\n    return `#${await (await this.host()).getAttribute('aria-owns')}`;\n  }\n}\n\n/** Harness for interacting with an MDC-based mat-autocomplete in tests. */\nexport class MatAutocompleteHarness extends _MatAutocompleteHarnessBase<\n  typeof MatOptionHarness,\n  MatOptionHarness,\n  OptionHarnessFilters,\n  typeof MatOptgroupHarness,\n  MatOptgroupHarness,\n  OptgroupHarnessFilters\n> {\n  protected _prefix = 'mat-mdc';\n  protected _optionClass = MatOptionHarness;\n  protected _optionGroupClass = MatOptgroupHarness;\n\n  /** The selector for the host element of a `MatAutocomplete` instance. */\n  static hostSelector = '.mat-mdc-autocomplete-trigger';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for an autocomplete with specific\n   * attributes.\n   * @param options Options for filtering which autocomplete instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with<T extends MatAutocompleteHarness>(\n    this: ComponentHarnessConstructor<T>,\n    options: AutocompleteHarnessFilters = {},\n  ): HarnessPredicate<T> {\n    return new HarnessPredicate(this, options)\n      .addOption('value', options.value, (harness, value) =>\n        HarnessPredicate.stringMatches(harness.getValue(), value),\n      )\n      .addOption('disabled', options.disabled, async (harness, disabled) => {\n        return (await harness.isDisabled()) === disabled;\n      });\n  }\n\n  /** Gets the selector that can be used to find the autocomplete trigger's panel. */\n  protected override async _getPanelSelector(): Promise<string> {\n    return `#${await (await this.host()).getAttribute('aria-controls')}`;\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"testing.mjs","sources":["../../../../../../../src/material/autocomplete/testing/autocomplete-harness.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {coerceBooleanProperty} from '@angular/cdk/coercion';\nimport {\n  ComponentHarness,\n  ComponentHarnessConstructor,\n  HarnessPredicate,\n  TestElement,\n} from '@angular/cdk/testing';\nimport {\n  MatOptgroupHarness,\n  MatOptionHarness,\n  OptgroupHarnessFilters,\n  OptionHarnessFilters,\n} from '@angular/material/core/testing';\nimport {AutocompleteHarnessFilters} from './autocomplete-harness-filters';\n\nexport class MatAutocompleteHarness extends ComponentHarness {\n  private _documentRootLocator = this.documentRootLocatorFactory();\n\n  /** The selector for the host element of a `MatAutocomplete` instance. */\n  static hostSelector = '.mat-mdc-autocomplete-trigger';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for an autocomplete with specific\n   * attributes.\n   * @param options Options for filtering which autocomplete instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with<T extends MatAutocompleteHarness>(\n    this: ComponentHarnessConstructor<T>,\n    options: AutocompleteHarnessFilters = {},\n  ): HarnessPredicate<T> {\n    return new HarnessPredicate(this, options)\n      .addOption('value', options.value, (harness, value) =>\n        HarnessPredicate.stringMatches(harness.getValue(), value),\n      )\n      .addOption('disabled', options.disabled, async (harness, disabled) => {\n        return (await harness.isDisabled()) === disabled;\n      });\n  }\n\n  /** Gets the value of the autocomplete input. */\n  async getValue(): Promise<string> {\n    return (await this.host()).getProperty<string>('value');\n  }\n\n  /** Whether the autocomplete input is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const disabled = (await this.host()).getAttribute('disabled');\n    return coerceBooleanProperty(await disabled);\n  }\n\n  /** Focuses the autocomplete input. */\n  async focus(): Promise<void> {\n    return (await this.host()).focus();\n  }\n\n  /** Blurs the autocomplete input. */\n  async blur(): Promise<void> {\n    return (await this.host()).blur();\n  }\n\n  /** Whether the autocomplete input is focused. */\n  async isFocused(): Promise<boolean> {\n    return (await this.host()).isFocused();\n  }\n\n  /** Enters text into the autocomplete. */\n  async enterText(value: string): Promise<void> {\n    return (await this.host()).sendKeys(value);\n  }\n\n  /** Clears the input value. */\n  async clear(): Promise<void> {\n    return (await this.host()).clear();\n  }\n\n  /** Gets the options inside the autocomplete panel. */\n  async getOptions(filters?: Omit<OptionHarnessFilters, 'ancestor'>): Promise<MatOptionHarness[]> {\n    if (!(await this.isOpen())) {\n      throw new Error('Unable to retrieve options for autocomplete. Autocomplete panel is closed.');\n    }\n\n    return this._documentRootLocator.locatorForAll(\n      MatOptionHarness.with({\n        ...(filters || {}),\n        ancestor: await this._getPanelSelector(),\n      } as OptionHarnessFilters),\n    )();\n  }\n\n  /** Gets the option groups inside the autocomplete panel. */\n  async getOptionGroups(\n    filters?: Omit<OptgroupHarnessFilters, 'ancestor'>,\n  ): Promise<MatOptgroupHarness[]> {\n    if (!(await this.isOpen())) {\n      throw new Error(\n        'Unable to retrieve option groups for autocomplete. Autocomplete panel is closed.',\n      );\n    }\n\n    return this._documentRootLocator.locatorForAll(\n      MatOptgroupHarness.with({\n        ...(filters || {}),\n        ancestor: await this._getPanelSelector(),\n      } as OptgroupHarnessFilters),\n    )();\n  }\n\n  /** Selects the first option matching the given filters. */\n  async selectOption(filters: OptionHarnessFilters): Promise<void> {\n    await this.focus(); // Focus the input to make sure the autocomplete panel is shown.\n    const options = await this.getOptions(filters);\n    if (!options.length) {\n      throw Error(`Could not find a mat-option matching ${JSON.stringify(filters)}`);\n    }\n    await options[0].click();\n  }\n\n  /** Whether the autocomplete is open. */\n  async isOpen(): Promise<boolean> {\n    const panel = await this._getPanel();\n    return !!panel && (await panel.hasClass(`mat-mdc-autocomplete-visible`));\n  }\n\n  /** Gets the panel associated with this autocomplete trigger. */\n  private async _getPanel(): Promise<TestElement | null> {\n    // Technically this is static, but it needs to be in a\n    // function, because the autocomplete's panel ID can changed.\n    return this._documentRootLocator.locatorForOptional(await this._getPanelSelector())();\n  }\n\n  /** Gets the selector that can be used to find the autocomplete trigger's panel. */\n  protected async _getPanelSelector(): Promise<string> {\n    return `#${await (await this.host()).getAttribute('aria-controls')}`;\n  }\n}\n"],"names":[],"mappings":"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"}

package/fesm2022/autocomplete.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, EventEmitter, TemplateRef, Directive, Inject, ViewChild, Input, Output, Component, ViewEncapsulation, ChangeDetectionStrategy, ContentChildren, forwardRef, Optional, Host, NgModule } from '@angular/core';
-import { mixinDisableRipple, MAT_OPTION_PARENT_COMPONENT, MAT_OPTGROUP, MatOption, MatOptionSelectionChange, _countGroupLabelsBeforeOption, _getOptionScrollPosition, MatOptionModule, MatCommonModule } from '@angular/material/core';
+import { InjectionToken, EventEmitter, TemplateRef, Component, ViewEncapsulation, ChangeDetectionStrategy, Inject, ViewChild, ContentChildren, Input, Output, Directive, forwardRef, Optional, Host, NgModule } from '@angular/core';
+import { mixinDisableRipple, MAT_OPTION_PARENT_COMPONENT, MatOption, MAT_OPTGROUP, MatOptionSelectionChange, _countGroupLabelsBeforeOption, _getOptionScrollPosition, MatOptionModule, MatCommonModule } from '@angular/material/core';
 import * as i2 from '@angular/common';
 import { DOCUMENT, CommonModule } from '@angular/common';
 import * as i3 from '@angular/cdk/scrolling';
@@ -72,8 +72,8 @@ function MAT_AUTOCOMPLETE_DEFAULT_OPTIONS_FACTORY() {
         requireSelection: false,
     };
 }
-/** Base class with all of the `MatAutocomplete` functionality. */
-class _MatAutocompleteBase extends _MatAutocompleteMixinBase {
+/** Autocomplete component. */
+class MatAutocomplete extends _MatAutocompleteMixinBase {
     /** Whether the autocomplete panel is open. */
     get isOpen() {
         return this._isOpen && this.showPanel;
@@ -102,7 +102,7 @@ class _MatAutocompleteBase extends _MatAutocompleteMixinBase {
     }
     /**
      * Whether the user is required to make a selection when they're interacting with the
-     * autocomplete. If the user moves away from the autcomplete without selecting an option from
+     * autocomplete. If the user moves away from the autocomplete without selecting an option from
      * the list, the value will be reset. If the user opens the panel and closes it without
      * interacting or selecting a value, the initial value will be kept.
      */
@@ -130,12 +130,34 @@ class _MatAutocompleteBase extends _MatAutocompleteMixinBase {
         this._setThemeClasses(this._classList);
         this._elementRef.nativeElement.className = '';
     }
+    /** Whether checkmark indicator for single-selection options is hidden. */
+    get hideSingleSelectionIndicator() {
+        return this._hideSingleSelectionIndicator;
+    }
+    set hideSingleSelectionIndicator(value) {
+        this._hideSingleSelectionIndicator = coerceBooleanProperty(value);
+        this._syncParentProperties();
+    }
+    /** Syncs the parent state with the individual options. */
+    _syncParentProperties() {
+        if (this.options) {
+            for (const option of this.options) {
+                option._changeDetectorRef.markForCheck();
+            }
+        }
+    }
     constructor(_changeDetectorRef, _elementRef, _defaults, platform) {
         super();
         this._changeDetectorRef = _changeDetectorRef;
         this._elementRef = _elementRef;
         this._defaults = _defaults;
         this._activeOptionChanges = Subscription.EMPTY;
+        /** Class to apply to the panel when it's visible. */
+        this._visibleClass = 'mat-mdc-autocomplete-visible';
+        /** Class to apply to the panel when it's hidden. */
+        this._hiddenClass = 'mat-mdc-autocomplete-hidden';
+        /** Emits when the panel animation is done. Null if the panel doesn't animate. */
+        this._animationDone = new EventEmitter();
         /** Whether the autocomplete panel should be visible, depending on option length. */
         this.showPanel = false;
         this._isOpen = false;
@@ -150,6 +172,7 @@ class _MatAutocompleteBase extends _MatAutocompleteMixinBase {
         /** Emits whenever an option is activated. */
         this.optionActivated = new EventEmitter();
         this._classList = {};
+        this._hideSingleSelectionIndicator = this._defaults.hideSingleSelectionIndicator ?? false;
         /** Unique ID to be used by autocomplete trigger's "aria-owns" property. */
         this.id = `mat-autocomplete-${_uniqueAutocompleteIdCounter++}`;
         // TODO(crisbeto): the problem that the `inertGroups` option resolves is only present on
@@ -176,6 +199,7 @@ class _MatAutocompleteBase extends _MatAutocompleteMixinBase {
     ngOnDestroy() {
         this._keyManager?.destroy();
         this._activeOptionChanges.unsubscribe();
+        this._animationDone.complete();
     }
     /**
      * Sets the panel scrollTop. This allows us to manually scroll to display options
@@ -220,14 +244,32 @@ class _MatAutocompleteBase extends _MatAutocompleteMixinBase {
         classList['mat-warn'] = this._color === 'warn';
         classList['mat-accent'] = this._color === 'accent';
     }
-    _skipPredicate(option) {
-        return option.disabled;
+    // `skipPredicate` determines if key manager should avoid putting a given option in the tab
+    // order. Allow disabled list items to receive focus via keyboard to align with WAI ARIA
+    // recommendation.
+    //
+    // Normally WAI ARIA's instructions are to exclude disabled items from the tab order, but it
+    // makes a few exceptions for compound widgets.
+    //
+    // From [Developing a Keyboard Interface](
+    // https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/):
+    //   "For the following composite widget elements, keep them focusable when disabled: Options in a
+    //   Listbox..."
+    //
+    // The user can focus disabled options using the keyboard, but the user cannot click disabled
+    // options.
+    _skipPredicate() {
+        return false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: _MatAutocompleteBase, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS }, { token: i1.Platform }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.1", type: _MatAutocompleteBase, inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], displayWith: "displayWith", autoActiveFirstOption: "autoActiveFirstOption", autoSelectActiveOption: "autoSelectActiveOption", requireSelection: "requireSelection", panelWidth: "panelWidth", classList: ["class", "classList"] }, outputs: { optionSelected: "optionSelected", opened: "opened", closed: "closed", optionActivated: "optionActivated" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, static: true }, { propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocomplete, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS }, { token: i1.Platform }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: MatAutocomplete, selector: "mat-autocomplete", inputs: { disableRipple: "disableRipple", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], displayWith: "displayWith", autoActiveFirstOption: "autoActiveFirstOption", autoSelectActiveOption: "autoSelectActiveOption", requireSelection: "requireSelection", panelWidth: "panelWidth", classList: ["class", "classList"], hideSingleSelectionIndicator: "hideSingleSelectionIndicator" }, outputs: { optionSelected: "optionSelected", opened: "opened", closed: "closed", optionActivated: "optionActivated" }, host: { attributes: { "ngSkipHydration": "" }, 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"], usesInheritance: true, 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    [ngClass]=\"_classList\"\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{box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);width:100%;max-height:256px;visibility:hidden;transform-origin:center top;overflow:auto;padding:8px 0;border-radius:4px;box-sizing:border-box;position:static;background-color:var(--mat-autocomplete-background-color)}.cdk-high-contrast-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}mat-autocomplete{display:none}"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [panelAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: _MatAutocompleteBase, decorators: [{
-            type: Directive
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocomplete, decorators: [{
+            type: Component,
+            args: [{ selector: 'mat-autocomplete', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'matAutocomplete', inputs: ['disableRipple'], host: {
+                        'class': 'mat-mdc-autocomplete',
+                        'ngSkipHydration': '',
+                    }, providers: [{ provide: MAT_OPTION_PARENT_COMPONENT, useExisting: MatAutocomplete }], animations: [panelAnimation], 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    [ngClass]=\"_classList\"\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{box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);width:100%;max-height:256px;visibility:hidden;transform-origin:center top;overflow:auto;padding:8px 0;border-radius:4px;box-sizing:border-box;position:static;background-color:var(--mat-autocomplete-background-color)}.cdk-high-contrast-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}mat-autocomplete{display:none}"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_AUTOCOMPLETE_DEFAULT_OPTIONS]
@@ -237,6 +279,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
             }], panel: [{
                 type: ViewChild,
                 args: ['panel']
+            }], options: [{
+                type: ContentChildren,
+                args: [MatOption, { descendants: true }]
+            }], optionGroups: [{
+                type: ContentChildren,
+                args: [MAT_OPTGROUP, { descendants: true }]
             }], ariaLabel: [{
                 type: Input,
                 args: ['aria-label']
@@ -264,91 +312,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
             }], classList: [{
                 type: Input,
                 args: ['class']
-            }] } });
-class MatAutocomplete extends _MatAutocompleteBase {
-    constructor() {
-        super(...arguments);
-        this._visibleClass = 'mat-mdc-autocomplete-visible';
-        this._hiddenClass = 'mat-mdc-autocomplete-hidden';
-        this._animationDone = new EventEmitter();
-        this._hideSingleSelectionIndicator = this._defaults.hideSingleSelectionIndicator ?? false;
-    }
-    /** Whether checkmark indicator for single-selection options is hidden. */
-    get hideSingleSelectionIndicator() {
-        return this._hideSingleSelectionIndicator;
-    }
-    set hideSingleSelectionIndicator(value) {
-        this._hideSingleSelectionIndicator = coerceBooleanProperty(value);
-        this._syncParentProperties();
-    }
-    /** Syncs the parent state with the individual options. */
-    _syncParentProperties() {
-        if (this.options) {
-            for (const option of this.options) {
-                option._changeDetectorRef.markForCheck();
-            }
-        }
-    }
-    ngOnDestroy() {
-        super.ngOnDestroy();
-        this._animationDone.complete();
-    }
-    // `skipPredicate` determines if key manager should avoid putting a given option in the tab
-    // order. Allow disabled list items to receive focus via keyboard to align with WAI ARIA
-    // recommendation.
-    //
-    // Normally WAI ARIA's instructions are to exclude disabled items from the tab order, but it
-    // makes a few exceptions for compound widgets.
-    //
-    // From [Developing a Keyboard Interface](
-    // https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/):
-    //   "For the following composite widget elements, keep them focusable when disabled: Options in a
-    //   Listbox..."
-    //
-    // The user can focus disabled options using the keyboard, but the user cannot click disabled
-    // options.
-    _skipPredicate(_option) {
-        return false;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocomplete, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: MatAutocomplete, selector: "mat-autocomplete", inputs: { disableRipple: "disableRipple", hideSingleSelectionIndicator: "hideSingleSelectionIndicator" }, host: { attributes: { "ngSkipHydration": "" }, classAttribute: "mat-mdc-autocomplete" }, providers: [{ provide: MAT_OPTION_PARENT_COMPONENT, useExisting: MatAutocomplete }], queries: [{ propertyName: "optionGroups", predicate: MAT_OPTGROUP, descendants: true }, { propertyName: "options", predicate: MatOption, descendants: true }], exportAs: ["matAutocomplete"], usesInheritance: true, 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    [ngClass]=\"_classList\"\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{box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);width:100%;max-height:256px;visibility:hidden;transform-origin:center top;overflow:auto;padding:8px 0;border-radius:4px;box-sizing:border-box;position:static;background-color:var(--mat-autocomplete-background-color)}.cdk-high-contrast-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}mat-autocomplete{display:none}"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [panelAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocomplete, decorators: [{
-            type: Component,
-            args: [{ selector: 'mat-autocomplete', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'matAutocomplete', inputs: ['disableRipple'], host: {
-                        'class': 'mat-mdc-autocomplete',
-                        'ngSkipHydration': '',
-                    }, providers: [{ provide: MAT_OPTION_PARENT_COMPONENT, useExisting: MatAutocomplete }], animations: [panelAnimation], 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    [ngClass]=\"_classList\"\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{box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);width:100%;max-height:256px;visibility:hidden;transform-origin:center top;overflow:auto;padding:8px 0;border-radius:4px;box-sizing:border-box;position:static;background-color:var(--mat-autocomplete-background-color)}.cdk-high-contrast-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}mat-autocomplete{display:none}"] }]
-        }], propDecorators: { optionGroups: [{
-                type: ContentChildren,
-                args: [MAT_OPTGROUP, { descendants: true }]
-            }], options: [{
-                type: ContentChildren,
-                args: [MatOption, { descendants: true }]
             }], hideSingleSelectionIndicator: [{
                 type: Input
             }] } });
 
-/** Base class containing all of the functionality for `MatAutocompleteOrigin`. */
-class _MatAutocompleteOriginBase {
+/**
+ * Directive applied to an element to make it usable
+ * as a connection point for an autocomplete panel.
+ */
+class MatAutocompleteOrigin {
     constructor(
     /** Reference to the element on which the directive is applied. */
     elementRef) {
         this.elementRef = elementRef;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: _MatAutocompleteOriginBase, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.1", type: _MatAutocompleteOriginBase, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: _MatAutocompleteOriginBase, decorators: [{
-            type: Directive
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
-/**
- * Directive applied to an element to make it usable
- * as a connection point for an autocomplete panel.
- */
-class MatAutocompleteOrigin extends _MatAutocompleteOriginBase {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteOrigin, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.1", type: MatAutocompleteOrigin, selector: "[matAutocompleteOrigin]", exportAs: ["matAutocompleteOrigin"], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteOrigin, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.1", type: MatAutocompleteOrigin, selector: "[matAutocompleteOrigin]", exportAs: ["matAutocompleteOrigin"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteOrigin, decorators: [{
             type: Directive,
@@ -356,7 +335,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
                     selector: '[matAutocompleteOrigin]',
                     exportAs: 'matAutocompleteOrigin',
                 }]
-        }] });
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
 
 /**
  * Provider that allows the autocomplete to register as a ControlValueAccessor.
@@ -389,7 +368,7 @@ const MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER = {
     useFactory: MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY,
 };
 /** Base class with all of the `MatAutocompleteTrigger` functionality. */
-class _MatAutocompleteTriggerBase {
+class MatAutocompleteTrigger {
     /**
      * Whether the autocomplete is disabled. When disabled, the element will
      * act as a regular input and the user won't be able to open the panel.
@@ -453,6 +432,8 @@ class _MatAutocompleteTriggerBase {
          * @docs-private
          */
         this.autocompleteAttribute = 'off';
+        /** Class to apply to the panel when it's above the input. */
+        this._aboveClass = 'mat-mdc-autocomplete-panel-above';
         this._overlayAttached = false;
         /** Stream of changes to the selection state of the autocomplete options. */
         this.optionSelections = defer(() => {
@@ -1088,11 +1069,33 @@ class _MatAutocompleteTriggerBase {
             this._trackedModal = null;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: _MatAutocompleteTriggerBase, deps: [{ token: i0.ElementRef }, { token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: MAT_AUTOCOMPLETE_SCROLL_STRATEGY }, { token: i2$1.Directionality, optional: true }, { token: MAT_FORM_FIELD, host: true, optional: true }, { token: DOCUMENT, optional: true }, { token: i3.ViewportRuler }, { token: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.1", type: _MatAutocompleteTriggerBase, inputs: { autocomplete: ["matAutocomplete", "autocomplete"], position: ["matAutocompletePosition", "position"], connectedTo: ["matAutocompleteConnectedTo", "connectedTo"], autocompleteAttribute: ["autocomplete", "autocompleteAttribute"], autocompleteDisabled: ["matAutocompleteDisabled", "autocompleteDisabled"] }, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteTrigger, deps: [{ token: i0.ElementRef }, { token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: MAT_AUTOCOMPLETE_SCROLL_STRATEGY }, { token: i2$1.Directionality, optional: true }, { token: MAT_FORM_FIELD, host: true, optional: true }, { token: DOCUMENT, optional: true }, { token: i3.ViewportRuler }, { token: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.1", type: MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: { autocomplete: ["matAutocomplete", "autocomplete"], position: ["matAutocompletePosition", "position"], connectedTo: ["matAutocompleteConnectedTo", "connectedTo"], autocompleteAttribute: ["autocomplete", "autocompleteAttribute"], autocompleteDisabled: ["matAutocompleteDisabled", "autocompleteDisabled"] }, 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 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: _MatAutocompleteTriggerBase, decorators: [{
-            type: Directive
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `input[matAutocomplete], textarea[matAutocomplete]`,
+                    host: {
+                        'class': 'mat-mdc-autocomplete-trigger',
+                        '[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"',
+                        // Note: we use `focusin`, as opposed to `focus`, in order to open the panel
+                        // a little earlier. This avoids issues where IE delays the focusing of the input.
+                        '(focusin)': '_handleFocus()',
+                        '(blur)': '_onTouched()',
+                        '(input)': '_handleInput($event)',
+                        '(keydown)': '_handleKeydown($event)',
+                        '(click)': '_handleClick()',
+                    },
+                    exportAs: 'matAutocompleteTrigger',
+                    providers: [MAT_AUTOCOMPLETE_VALUE_ACCESSOR],
+                }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_AUTOCOMPLETE_SCROLL_STRATEGY]
@@ -1131,39 +1134,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
                 type: Input,
                 args: ['matAutocompleteDisabled']
             }] } });
-class MatAutocompleteTrigger extends _MatAutocompleteTriggerBase {
-    constructor() {
-        super(...arguments);
-        this._aboveClass = 'mat-mdc-autocomplete-panel-above';
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteTrigger, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.1", type: MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", 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"], usesInheritance: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteTrigger, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: `input[matAutocomplete], textarea[matAutocomplete]`,
-                    host: {
-                        'class': 'mat-mdc-autocomplete-trigger',
-                        '[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"',
-                        // Note: we use `focusin`, as opposed to `focus`, in order to open the panel
-                        // a little earlier. This avoids issues where IE delays the focusing of the input.
-                        '(focusin)': '_handleFocus()',
-                        '(blur)': '_onTouched()',
-                        '(input)': '_handleInput($event)',
-                        '(keydown)': '_handleKeydown($event)',
-                        '(click)': '_handleClick()',
-                    },
-                    exportAs: 'matAutocompleteTrigger',
-                    providers: [MAT_AUTOCOMPLETE_VALUE_ACCESSOR],
-                }]
-        }] });
 
 class MatAutocompleteModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: MatAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -1198,5 +1168,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { MAT_AUTOCOMPLETE_DEFAULT_OPTIONS, MAT_AUTOCOMPLETE_DEFAULT_OPTIONS_FACTORY, MAT_AUTOCOMPLETE_SCROLL_STRATEGY, MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY, MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER, MAT_AUTOCOMPLETE_VALUE_ACCESSOR, MatAutocomplete, MatAutocompleteModule, MatAutocompleteOrigin, MatAutocompleteSelectedEvent, MatAutocompleteTrigger, _MatAutocompleteBase, _MatAutocompleteOriginBase, _MatAutocompleteTriggerBase, getMatAutocompleteMissingPanelError };
+export { MAT_AUTOCOMPLETE_DEFAULT_OPTIONS, MAT_AUTOCOMPLETE_DEFAULT_OPTIONS_FACTORY, MAT_AUTOCOMPLETE_SCROLL_STRATEGY, MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY, MAT_AUTOCOMPLETE_SCROLL_STRATEGY_FACTORY_PROVIDER, MAT_AUTOCOMPLETE_VALUE_ACCESSOR, MatAutocomplete, MatAutocompleteModule, MatAutocompleteOrigin, MatAutocompleteSelectedEvent, MatAutocompleteTrigger, getMatAutocompleteMissingPanelError };
 //# sourceMappingURL=autocomplete.mjs.map