@angular/material 13.2.0-next.0 → 13.2.0-next.1

package/fesm2020/tabs/testing.mjs

@@ -159,6 +159,32 @@ class MatTabLinkHarness extends ComponentHarness {
 /** The selector for the host element of a `MatTabLink` instance. */
 MatTabLinkHarness.hostSelector = '.mat-tab-link';
 
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * 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
+ */
+/** Harness for interacting with a standard mat-tab-nav-panel in tests. */
+class MatTabNavPanelHarness extends ContentContainerComponentHarness {
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a `MatTabNavPanel` that meets
+     * certain criteria.
+     * @param options Options for filtering which tab nav panel instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(MatTabNavPanelHarness, options);
+    }
+    /** Gets the tab panel text content. */
+    async getTextContent() {
+        return (await this.host()).text();
+    }
+}
+/** The selector for the host element of a `MatTabNavPanel` instance. */
+MatTabNavPanelHarness.hostSelector = '.mat-tab-nav-panel';
+
 /**
  * @license
  * Copyright Google LLC All Rights Reserved.
@@ -207,6 +233,17 @@ class MatTabNavBarHarness extends ComponentHarness {
         }
         await tabs[0].click();
     }
+    /** Gets the panel associated with the nav bar. */
+    async getPanel() {
+        const link = await this.getActiveLink();
+        const host = await link.host();
+        const panelId = await host.getAttribute('aria-controls');
+        if (!panelId) {
+            throw Error('No panel is controlled by the nav bar.');
+        }
+        const filter = { selector: `#${panelId}` };
+        return await this.documentRootLocatorFactory().locatorFor(MatTabNavPanelHarness.with(filter))();
+    }
 }
 /** The selector for the host element of a `MatTabNavBar` instance. */
 MatTabNavBarHarness.hostSelector = '.mat-tab-nav-bar';

package/fesm2020/tabs/testing.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"testing.mjs","sources":["../../../../../../../src/material/tabs/testing/tab-harness.ts","../../../../../../../src/material/tabs/testing/tab-group-harness.ts","../../../../../../../src/material/tabs/testing/tab-link-harness.ts","../../../../../../../src/material/tabs/testing/tab-nav-bar-harness.ts","../../../../../../../src/material/tabs/testing/public-api.ts","../../../../../../../src/material/tabs/testing/index.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 {\n  ContentContainerComponentHarness,\n  HarnessLoader,\n  HarnessPredicate,\n} from '@angular/cdk/testing';\nimport {TabHarnessFilters} from './tab-harness-filters';\n\n/** Harness for interacting with a standard Angular Material tab-label in tests. */\nexport class MatTabHarness extends ContentContainerComponentHarness<string> {\n  /** The selector for the host element of a `MatTab` instance. */\n  static hostSelector = '.mat-tab-label';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabHarnessFilters = {}): HarnessPredicate<MatTabHarness> {\n    return new HarnessPredicate(MatTabHarness, options).addOption(\n      'label',\n      options.label,\n      (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label),\n    );\n  }\n\n  /** Gets the label of the tab. */\n  async getLabel(): Promise<string> {\n    return (await this.host()).text();\n  }\n\n  /** Gets the aria-label of the tab. */\n  async getAriaLabel(): Promise<string | null> {\n    return (await this.host()).getAttribute('aria-label');\n  }\n\n  /** Gets the value of the \"aria-labelledby\" attribute. */\n  async getAriaLabelledby(): Promise<string | null> {\n    return (await this.host()).getAttribute('aria-labelledby');\n  }\n\n  /** Whether the tab is selected. */\n  async isSelected(): Promise<boolean> {\n    const hostEl = await this.host();\n    return (await hostEl.getAttribute('aria-selected')) === 'true';\n  }\n\n  /** Whether the tab is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const hostEl = await this.host();\n    return (await hostEl.getAttribute('aria-disabled')) === 'true';\n  }\n\n  /** Selects the given tab by clicking on the label. Tab cannot be selected if disabled. */\n  async select(): Promise<void> {\n    await (await this.host()).click();\n  }\n\n  /** Gets the text content of the tab. */\n  async getTextContent(): Promise<string> {\n    const contentId = await this._getContentId();\n    const contentEl = await this.documentRootLocatorFactory().locatorFor(`#${contentId}`)();\n    return contentEl.text();\n  }\n\n  protected override async getRootHarnessLoader(): Promise<HarnessLoader> {\n    const contentId = await this._getContentId();\n    return this.documentRootLocatorFactory().harnessLoaderFor(`#${contentId}`);\n  }\n\n  /** Gets the element id for the content of the current tab. */\n  private async _getContentId(): Promise<string> {\n    const hostEl = await this.host();\n    // Tabs never have an empty \"aria-controls\" attribute.\n    return (await hostEl.getAttribute('aria-controls'))!;\n  }\n}\n","/**\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 {ComponentHarness, HarnessPredicate, parallel} from '@angular/cdk/testing';\nimport {TabGroupHarnessFilters, TabHarnessFilters} from './tab-harness-filters';\nimport {MatTabHarness} from './tab-harness';\n\n/** Harness for interacting with a standard mat-tab-group in tests. */\nexport class MatTabGroupHarness extends ComponentHarness {\n  /** The selector for the host element of a `MatTabGroup` instance. */\n  static hostSelector = '.mat-tab-group';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabGroupHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab group instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabGroupHarnessFilters = {}): HarnessPredicate<MatTabGroupHarness> {\n    return new HarnessPredicate(MatTabGroupHarness, options).addOption(\n      'selectedTabLabel',\n      options.selectedTabLabel,\n      async (harness, label) => {\n        const selectedTab = await harness.getSelectedTab();\n        return HarnessPredicate.stringMatches(await selectedTab.getLabel(), label);\n      },\n    );\n  }\n\n  /**\n   * Gets the list of tabs in the tab group.\n   * @param filter Optionally filters which tabs are included.\n   */\n  async getTabs(filter: TabHarnessFilters = {}): Promise<MatTabHarness[]> {\n    return this.locatorForAll(MatTabHarness.with(filter))();\n  }\n\n  /** Gets the selected tab of the tab group. */\n  async getSelectedTab(): Promise<MatTabHarness> {\n    const tabs = await this.getTabs();\n    const isSelected = await parallel(() => tabs.map(t => t.isSelected()));\n    for (let i = 0; i < tabs.length; i++) {\n      if (isSelected[i]) {\n        return tabs[i];\n      }\n    }\n    throw new Error('No selected tab could be found.');\n  }\n\n  /**\n   * Selects a tab in this tab group.\n   * @param filter An optional filter to apply to the child tabs. The first tab matching the filter\n   *     will be selected.\n   */\n  async selectTab(filter: TabHarnessFilters = {}): Promise<void> {\n    const tabs = await this.getTabs(filter);\n    if (!tabs.length) {\n      throw Error(`Cannot find mat-tab matching filter ${JSON.stringify(filter)}`);\n    }\n    await tabs[0].select();\n  }\n}\n","/**\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 {ComponentHarness, HarnessPredicate} from '@angular/cdk/testing';\nimport {TabLinkHarnessFilters} from './tab-harness-filters';\n\n/** Harness for interacting with a standard Angular Material tab link in tests. */\nexport class MatTabLinkHarness extends ComponentHarness {\n  /** The selector for the host element of a `MatTabLink` instance. */\n  static hostSelector = '.mat-tab-link';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabLinkHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab link instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabLinkHarnessFilters = {}): HarnessPredicate<MatTabLinkHarness> {\n    return new HarnessPredicate(MatTabLinkHarness, options).addOption(\n      'label',\n      options.label,\n      (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label),\n    );\n  }\n\n  /** Gets the label of the link. */\n  async getLabel(): Promise<string> {\n    return (await this.host()).text();\n  }\n\n  /** Whether the link is active. */\n  async isActive(): Promise<boolean> {\n    const host = await this.host();\n    return host.hasClass('mat-tab-label-active');\n  }\n\n  /** Whether the link is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const host = await this.host();\n    return host.hasClass('mat-tab-disabled');\n  }\n\n  /** Clicks on the link. */\n  async click(): Promise<void> {\n    await (await this.host()).click();\n  }\n}\n","/**\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 {ComponentHarness, HarnessPredicate, parallel} from '@angular/cdk/testing';\nimport {TabNavBarHarnessFilters, TabLinkHarnessFilters} from './tab-harness-filters';\nimport {MatTabLinkHarness} from './tab-link-harness';\n\n/** Harness for interacting with a standard mat-tab-nav-bar in tests. */\nexport class MatTabNavBarHarness extends ComponentHarness {\n  /** The selector for the host element of a `MatTabNavBar` instance. */\n  static hostSelector = '.mat-tab-nav-bar';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabNavBar` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab nav bar instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabNavBarHarnessFilters = {}): HarnessPredicate<MatTabNavBarHarness> {\n    return new HarnessPredicate(MatTabNavBarHarness, options);\n  }\n\n  /**\n   * Gets the list of links in the nav bar.\n   * @param filter Optionally filters which links are included.\n   */\n  async getLinks(filter: TabLinkHarnessFilters = {}): Promise<MatTabLinkHarness[]> {\n    return this.locatorForAll(MatTabLinkHarness.with(filter))();\n  }\n\n  /** Gets the active link in the nav bar. */\n  async getActiveLink(): Promise<MatTabLinkHarness> {\n    const links = await this.getLinks();\n    const isActive = await parallel(() => links.map(t => t.isActive()));\n    for (let i = 0; i < links.length; i++) {\n      if (isActive[i]) {\n        return links[i];\n      }\n    }\n    throw new Error('No active link could be found.');\n  }\n\n  /**\n   * Clicks a link inside the nav bar.\n   * @param filter An optional filter to apply to the child link. The first link matching the filter\n   *     will be clicked.\n   */\n  async clickLink(filter: TabLinkHarnessFilters = {}): Promise<void> {\n    const tabs = await this.getLinks(filter);\n    if (!tabs.length) {\n      throw Error(`Cannot find mat-tab-link matching filter ${JSON.stringify(filter)}`);\n    }\n    await tabs[0].click();\n  }\n}\n","/**\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\nexport * from './tab-group-harness';\nexport * from './tab-harness';\nexport * from './tab-harness-filters';\nexport * from './tab-nav-bar-harness';\nexport * from './tab-link-harness';\n","/**\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\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"testing.mjs","sources":["../../../../../../../src/material/tabs/testing/tab-harness.ts","../../../../../../../src/material/tabs/testing/tab-group-harness.ts","../../../../../../../src/material/tabs/testing/tab-link-harness.ts","../../../../../../../src/material/tabs/testing/tab-nav-panel-harness.ts","../../../../../../../src/material/tabs/testing/tab-nav-bar-harness.ts","../../../../../../../src/material/tabs/testing/public-api.ts","../../../../../../../src/material/tabs/testing/index.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 {\n  ContentContainerComponentHarness,\n  HarnessLoader,\n  HarnessPredicate,\n} from '@angular/cdk/testing';\nimport {TabHarnessFilters} from './tab-harness-filters';\n\n/** Harness for interacting with a standard Angular Material tab-label in tests. */\nexport class MatTabHarness extends ContentContainerComponentHarness<string> {\n  /** The selector for the host element of a `MatTab` instance. */\n  static hostSelector = '.mat-tab-label';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabHarnessFilters = {}): HarnessPredicate<MatTabHarness> {\n    return new HarnessPredicate(MatTabHarness, options).addOption(\n      'label',\n      options.label,\n      (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label),\n    );\n  }\n\n  /** Gets the label of the tab. */\n  async getLabel(): Promise<string> {\n    return (await this.host()).text();\n  }\n\n  /** Gets the aria-label of the tab. */\n  async getAriaLabel(): Promise<string | null> {\n    return (await this.host()).getAttribute('aria-label');\n  }\n\n  /** Gets the value of the \"aria-labelledby\" attribute. */\n  async getAriaLabelledby(): Promise<string | null> {\n    return (await this.host()).getAttribute('aria-labelledby');\n  }\n\n  /** Whether the tab is selected. */\n  async isSelected(): Promise<boolean> {\n    const hostEl = await this.host();\n    return (await hostEl.getAttribute('aria-selected')) === 'true';\n  }\n\n  /** Whether the tab is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const hostEl = await this.host();\n    return (await hostEl.getAttribute('aria-disabled')) === 'true';\n  }\n\n  /** Selects the given tab by clicking on the label. Tab cannot be selected if disabled. */\n  async select(): Promise<void> {\n    await (await this.host()).click();\n  }\n\n  /** Gets the text content of the tab. */\n  async getTextContent(): Promise<string> {\n    const contentId = await this._getContentId();\n    const contentEl = await this.documentRootLocatorFactory().locatorFor(`#${contentId}`)();\n    return contentEl.text();\n  }\n\n  protected override async getRootHarnessLoader(): Promise<HarnessLoader> {\n    const contentId = await this._getContentId();\n    return this.documentRootLocatorFactory().harnessLoaderFor(`#${contentId}`);\n  }\n\n  /** Gets the element id for the content of the current tab. */\n  private async _getContentId(): Promise<string> {\n    const hostEl = await this.host();\n    // Tabs never have an empty \"aria-controls\" attribute.\n    return (await hostEl.getAttribute('aria-controls'))!;\n  }\n}\n","/**\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 {ComponentHarness, HarnessPredicate, parallel} from '@angular/cdk/testing';\nimport {TabGroupHarnessFilters, TabHarnessFilters} from './tab-harness-filters';\nimport {MatTabHarness} from './tab-harness';\n\n/** Harness for interacting with a standard mat-tab-group in tests. */\nexport class MatTabGroupHarness extends ComponentHarness {\n  /** The selector for the host element of a `MatTabGroup` instance. */\n  static hostSelector = '.mat-tab-group';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabGroupHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab group instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabGroupHarnessFilters = {}): HarnessPredicate<MatTabGroupHarness> {\n    return new HarnessPredicate(MatTabGroupHarness, options).addOption(\n      'selectedTabLabel',\n      options.selectedTabLabel,\n      async (harness, label) => {\n        const selectedTab = await harness.getSelectedTab();\n        return HarnessPredicate.stringMatches(await selectedTab.getLabel(), label);\n      },\n    );\n  }\n\n  /**\n   * Gets the list of tabs in the tab group.\n   * @param filter Optionally filters which tabs are included.\n   */\n  async getTabs(filter: TabHarnessFilters = {}): Promise<MatTabHarness[]> {\n    return this.locatorForAll(MatTabHarness.with(filter))();\n  }\n\n  /** Gets the selected tab of the tab group. */\n  async getSelectedTab(): Promise<MatTabHarness> {\n    const tabs = await this.getTabs();\n    const isSelected = await parallel(() => tabs.map(t => t.isSelected()));\n    for (let i = 0; i < tabs.length; i++) {\n      if (isSelected[i]) {\n        return tabs[i];\n      }\n    }\n    throw new Error('No selected tab could be found.');\n  }\n\n  /**\n   * Selects a tab in this tab group.\n   * @param filter An optional filter to apply to the child tabs. The first tab matching the filter\n   *     will be selected.\n   */\n  async selectTab(filter: TabHarnessFilters = {}): Promise<void> {\n    const tabs = await this.getTabs(filter);\n    if (!tabs.length) {\n      throw Error(`Cannot find mat-tab matching filter ${JSON.stringify(filter)}`);\n    }\n    await tabs[0].select();\n  }\n}\n","/**\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 {ComponentHarness, HarnessPredicate} from '@angular/cdk/testing';\nimport {TabLinkHarnessFilters} from './tab-harness-filters';\n\n/** Harness for interacting with a standard Angular Material tab link in tests. */\nexport class MatTabLinkHarness extends ComponentHarness {\n  /** The selector for the host element of a `MatTabLink` instance. */\n  static hostSelector = '.mat-tab-link';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabLinkHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab link instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabLinkHarnessFilters = {}): HarnessPredicate<MatTabLinkHarness> {\n    return new HarnessPredicate(MatTabLinkHarness, options).addOption(\n      'label',\n      options.label,\n      (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label),\n    );\n  }\n\n  /** Gets the label of the link. */\n  async getLabel(): Promise<string> {\n    return (await this.host()).text();\n  }\n\n  /** Whether the link is active. */\n  async isActive(): Promise<boolean> {\n    const host = await this.host();\n    return host.hasClass('mat-tab-label-active');\n  }\n\n  /** Whether the link is disabled. */\n  async isDisabled(): Promise<boolean> {\n    const host = await this.host();\n    return host.hasClass('mat-tab-disabled');\n  }\n\n  /** Clicks on the link. */\n  async click(): Promise<void> {\n    await (await this.host()).click();\n  }\n}\n","/**\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 {ContentContainerComponentHarness, HarnessPredicate} from '@angular/cdk/testing';\nimport {TabNavPanelHarnessFilters} from './tab-harness-filters';\n\n/** Harness for interacting with a standard mat-tab-nav-panel in tests. */\nexport class MatTabNavPanelHarness extends ContentContainerComponentHarness {\n  /** The selector for the host element of a `MatTabNavPanel` instance. */\n  static hostSelector = '.mat-tab-nav-panel';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabNavPanel` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab nav panel instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabNavPanelHarnessFilters = {}): HarnessPredicate<MatTabNavPanelHarness> {\n    return new HarnessPredicate(MatTabNavPanelHarness, options);\n  }\n\n  /** Gets the tab panel text content. */\n  async getTextContent(): Promise<string> {\n    return (await this.host()).text();\n  }\n}\n","/**\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 {ComponentHarness, HarnessPredicate, parallel} from '@angular/cdk/testing';\nimport {\n  TabNavBarHarnessFilters,\n  TabNavPanelHarnessFilters,\n  TabLinkHarnessFilters,\n} from './tab-harness-filters';\nimport {MatTabLinkHarness} from './tab-link-harness';\nimport {MatTabNavPanelHarness} from './tab-nav-panel-harness';\n\n/** Harness for interacting with a standard mat-tab-nav-bar in tests. */\nexport class MatTabNavBarHarness extends ComponentHarness {\n  /** The selector for the host element of a `MatTabNavBar` instance. */\n  static hostSelector = '.mat-tab-nav-bar';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatTabNavBar` that meets\n   * certain criteria.\n   * @param options Options for filtering which tab nav bar instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: TabNavBarHarnessFilters = {}): HarnessPredicate<MatTabNavBarHarness> {\n    return new HarnessPredicate(MatTabNavBarHarness, options);\n  }\n\n  /**\n   * Gets the list of links in the nav bar.\n   * @param filter Optionally filters which links are included.\n   */\n  async getLinks(filter: TabLinkHarnessFilters = {}): Promise<MatTabLinkHarness[]> {\n    return this.locatorForAll(MatTabLinkHarness.with(filter))();\n  }\n\n  /** Gets the active link in the nav bar. */\n  async getActiveLink(): Promise<MatTabLinkHarness> {\n    const links = await this.getLinks();\n    const isActive = await parallel(() => links.map(t => t.isActive()));\n    for (let i = 0; i < links.length; i++) {\n      if (isActive[i]) {\n        return links[i];\n      }\n    }\n    throw new Error('No active link could be found.');\n  }\n\n  /**\n   * Clicks a link inside the nav bar.\n   * @param filter An optional filter to apply to the child link. The first link matching the filter\n   *     will be clicked.\n   */\n  async clickLink(filter: TabLinkHarnessFilters = {}): Promise<void> {\n    const tabs = await this.getLinks(filter);\n    if (!tabs.length) {\n      throw Error(`Cannot find mat-tab-link matching filter ${JSON.stringify(filter)}`);\n    }\n    await tabs[0].click();\n  }\n\n  /** Gets the panel associated with the nav bar. */\n  async getPanel(): Promise<MatTabNavPanelHarness> {\n    const link = await this.getActiveLink();\n    const host = await link.host();\n    const panelId = await host.getAttribute('aria-controls');\n    if (!panelId) {\n      throw Error('No panel is controlled by the nav bar.');\n    }\n\n    const filter: TabNavPanelHarnessFilters = {selector: `#${panelId}`};\n    return await this.documentRootLocatorFactory().locatorFor(MatTabNavPanelHarness.with(filter))();\n  }\n}\n","/**\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\nexport * from './tab-group-harness';\nexport * from './tab-harness';\nexport * from './tab-harness-filters';\nexport * from './tab-nav-bar-harness';\nexport * from './tab-link-harness';\n","/**\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\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/tabs.mjs

@@ -1537,6 +1537,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
  * 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
  */
+// Increasing integer for generating unique ids for tab nav components.
+let nextUniqueId = 0;
 /**
  * Base class with all of the `MatTabNav` functionality.
  * @docs-private
@@ -1588,6 +1590,9 @@ class _MatTabNavBase extends MatPaginatedTabHeader {
             if (items[i].active) {
                 this.selectedIndex = i;
                 this._changeDetectorRef.markForCheck();
+                if (this.tabPanel) {
+                    this.tabPanel._activeTabId = items[i].id;
+                }
                 return;
             }
         }
@@ -1595,9 +1600,12 @@ class _MatTabNavBase extends MatPaginatedTabHeader {
         this.selectedIndex = -1;
         this._inkBar.hide();
     }
+    _getRole() {
+        return this.tabPanel ? 'tablist' : this._elementRef.nativeElement.getAttribute('role');
+    }
 }
 _MatTabNavBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: _MatTabNavBase, deps: [{ token: i0.ElementRef }, { token: i1.Directionality, optional: true }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1$1.ViewportRuler }, { token: i3.Platform }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-_MatTabNavBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: _MatTabNavBase, inputs: { backgroundColor: "backgroundColor", disableRipple: "disableRipple", color: "color" }, usesInheritance: true, ngImport: i0 });
+_MatTabNavBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: _MatTabNavBase, inputs: { backgroundColor: "backgroundColor", disableRipple: "disableRipple", color: "color", tabPanel: "tabPanel" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: _MatTabNavBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.Directionality, decorators: [{
@@ -1613,6 +1621,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                 type: Input
             }], color: [{
                 type: Input
+            }], tabPanel: [{
+                type: Input
             }] } });
 /**
  * Navigation component matching the styles of the tab group header.
@@ -1624,10 +1634,11 @@ class MatTabNav extends _MatTabNavBase {
     }
 }
 MatTabNav.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatTabNav, deps: [{ token: i0.ElementRef }, { token: i1.Directionality, optional: true }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1$1.ViewportRuler }, { token: i3.Platform }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MatTabNav.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatTabNav, selector: "[mat-tab-nav-bar]", inputs: { color: "color" }, host: { properties: { "class.mat-tab-header-pagination-controls-enabled": "_showPaginationControls", "class.mat-tab-header-rtl": "_getLayoutDirection() == 'rtl'", "class.mat-primary": "color !== \"warn\" && color !== \"accent\"", "class.mat-accent": "color === \"accent\"", "class.mat-warn": "color === \"warn\"" }, classAttribute: "mat-tab-nav-bar mat-tab-header" }, queries: [{ propertyName: "_items", predicate: i0.forwardRef(function () { return MatTabLink; }), descendants: true }], viewQueries: [{ propertyName: "_inkBar", first: true, predicate: MatInkBar, descendants: true, static: true }, { propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, static: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, static: true }, { propertyName: "_tabListInner", first: true, predicate: ["tabListInner"], descendants: true, static: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }], exportAs: ["matTabNavBar", "matTabNav"], usesInheritance: true, ngImport: i0, template: "<div class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\"\n     #previousPaginator\n     aria-hidden=\"true\"\n     mat-ripple [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n     [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n     (click)=\"_handlePaginatorClick('before')\"\n     (mousedown)=\"_handlePaginatorPress('before', $event)\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-tab-header-pagination-chevron\"></div>\n</div>\n\n<div class=\"mat-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n  <div\n    class=\"mat-tab-list\"\n    [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n    #tabList\n    (cdkObserveContent)=\"_onContentChanges()\">\n    <div class=\"mat-tab-links\" #tabListInner>\n      <ng-content></ng-content>\n    </div>\n    <mat-ink-bar></mat-ink-bar>\n  </div>\n</div>\n\n<div class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\"\n     #nextPaginator\n     aria-hidden=\"true\"\n     mat-ripple [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n     [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n     (mousedown)=\"_handlePaginatorPress('after', $event)\"\n     (click)=\"_handlePaginatorClick('after')\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-tab-header-pagination-chevron\"></div>\n</div>\n", styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-rtl .mat-tab-header-pagination-before,.mat-tab-header-pagination-after{padding-right:4px}.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-tab-links{display:flex}[mat-align-tabs=center]>.mat-tab-link-container .mat-tab-links{justify-content:center}[mat-align-tabs=end]>.mat-tab-link-container .mat-tab-links{justify-content:flex-end}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}.cdk-high-contrast-active .mat-ink-bar{outline:solid 2px;height:0}.mat-tab-link-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mat-tab-link{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;vertical-align:top;text-decoration:none;position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent}.mat-tab-link:focus{outline:none}.mat-tab-link:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-link:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-link.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-link.mat-tab-disabled{opacity:.5}.mat-tab-link .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-link{opacity:1}[mat-stretch-tabs] .mat-tab-link{flex-basis:0;flex-grow:1}.mat-tab-link.mat-tab-disabled{pointer-events:none}@media(max-width: 599px){.mat-tab-link{min-width:72px}}\n"], directives: [{ type: i4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: i5.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { type: MatInkBar, selector: "mat-ink-bar" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+MatTabNav.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatTabNav, selector: "[mat-tab-nav-bar]", inputs: { color: "color" }, host: { properties: { "attr.role": "_getRole()", "class.mat-tab-header-pagination-controls-enabled": "_showPaginationControls", "class.mat-tab-header-rtl": "_getLayoutDirection() == 'rtl'", "class.mat-primary": "color !== \"warn\" && color !== \"accent\"", "class.mat-accent": "color === \"accent\"", "class.mat-warn": "color === \"warn\"" }, classAttribute: "mat-tab-nav-bar mat-tab-header" }, queries: [{ propertyName: "_items", predicate: i0.forwardRef(function () { return MatTabLink; }), descendants: true }], viewQueries: [{ propertyName: "_inkBar", first: true, predicate: MatInkBar, descendants: true, static: true }, { propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, static: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, static: true }, { propertyName: "_tabListInner", first: true, predicate: ["tabListInner"], descendants: true, static: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }], exportAs: ["matTabNavBar", "matTabNav"], usesInheritance: true, ngImport: i0, template: "<div class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\"\n     #previousPaginator\n     aria-hidden=\"true\"\n     mat-ripple [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n     [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n     (click)=\"_handlePaginatorClick('before')\"\n     (mousedown)=\"_handlePaginatorPress('before', $event)\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-tab-header-pagination-chevron\"></div>\n</div>\n\n<div class=\"mat-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n  <div\n    class=\"mat-tab-list\"\n    [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n    #tabList\n    (cdkObserveContent)=\"_onContentChanges()\">\n    <div class=\"mat-tab-links\" #tabListInner>\n      <ng-content></ng-content>\n    </div>\n    <mat-ink-bar></mat-ink-bar>\n  </div>\n</div>\n\n<div class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\"\n     #nextPaginator\n     aria-hidden=\"true\"\n     mat-ripple [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n     [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n     (mousedown)=\"_handlePaginatorPress('after', $event)\"\n     (click)=\"_handlePaginatorClick('after')\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-tab-header-pagination-chevron\"></div>\n</div>\n", styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-rtl .mat-tab-header-pagination-before,.mat-tab-header-pagination-after{padding-right:4px}.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-tab-links{display:flex}[mat-align-tabs=center]>.mat-tab-link-container .mat-tab-links{justify-content:center}[mat-align-tabs=end]>.mat-tab-link-container .mat-tab-links{justify-content:flex-end}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}.cdk-high-contrast-active .mat-ink-bar{outline:solid 2px;height:0}.mat-tab-link-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mat-tab-link{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;vertical-align:top;text-decoration:none;position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent}.mat-tab-link:focus{outline:none}.mat-tab-link:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-link:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-link.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-link.mat-tab-disabled{opacity:.5}.mat-tab-link .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-link{opacity:1}[mat-stretch-tabs] .mat-tab-link{flex-basis:0;flex-grow:1}.mat-tab-link.mat-tab-disabled{pointer-events:none}@media(max-width: 599px){.mat-tab-link{min-width:72px}}\n"], directives: [{ type: i4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: i5.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { type: MatInkBar, selector: "mat-ink-bar" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatTabNav, decorators: [{
             type: Component,
             args: [{ selector: '[mat-tab-nav-bar]', exportAs: 'matTabNavBar, matTabNav', inputs: ['color'], host: {
+                        '[attr.role]': '_getRole()',
                         'class': 'mat-tab-nav-bar mat-tab-header',
                         '[class.mat-tab-header-pagination-controls-enabled]': '_showPaginationControls',
                         '[class.mat-tab-header-rtl]': "_getLayoutDirection() == 'rtl'",
@@ -1677,6 +1688,8 @@ class _MatTabLinkBase extends _MatTabLinkMixinBase {
         this._focusMonitor = _focusMonitor;
         /** Whether the tab link is active or not. */
         this._isActive = false;
+        /** Unique id for the tab. */
+        this.id = `mat-tab-link-${nextUniqueId++}`;
         this.rippleConfig = globalRippleOptions || {};
         this.tabIndex = parseInt(tabIndex) || 0;
         if (animationMode === 'NoopAnimations') {
@@ -1719,9 +1732,41 @@ class _MatTabLinkBase extends _MatTabLinkMixinBase {
         // have to update the focused index whenever the link receives focus.
         this._tabNavBar.focusIndex = this._tabNavBar._items.toArray().indexOf(this);
     }
+    _handleKeydown(event) {
+        if (this._tabNavBar.tabPanel && event.keyCode === SPACE) {
+            this.elementRef.nativeElement.click();
+        }
+    }
+    _getAriaControls() {
+        return this._tabNavBar.tabPanel
+            ? this._tabNavBar.tabPanel?.id
+            : this.elementRef.nativeElement.getAttribute('aria-controls');
+    }
+    _getAriaSelected() {
+        if (this._tabNavBar.tabPanel) {
+            return this.active ? 'true' : 'false';
+        }
+        else {
+            return this.elementRef.nativeElement.getAttribute('aria-selected');
+        }
+    }
+    _getAriaCurrent() {
+        return this.active && !this._tabNavBar.tabPanel ? 'page' : null;
+    }
+    _getRole() {
+        return this._tabNavBar.tabPanel ? 'tab' : this.elementRef.nativeElement.getAttribute('role');
+    }
+    _getTabIndex() {
+        if (this._tabNavBar.tabPanel) {
+            return this._isActive ? 0 : -1;
+        }
+        else {
+            return this.tabIndex;
+        }
+    }
 }
 _MatTabLinkBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: _MatTabLinkBase, deps: [{ token: _MatTabNavBase }, { token: i0.ElementRef }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }, { token: 'tabindex', attribute: true }, { token: i7.FocusMonitor }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-_MatTabLinkBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: _MatTabLinkBase, inputs: { active: "active" }, usesInheritance: true, ngImport: i0 });
+_MatTabLinkBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: _MatTabLinkBase, inputs: { active: "active", id: "id" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: _MatTabLinkBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: _MatTabNavBase }, { type: i0.ElementRef }, { type: undefined, decorators: [{
@@ -1739,6 +1784,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                     args: [ANIMATION_MODULE_TYPE]
                 }] }]; }, propDecorators: { active: [{
                 type: Input
+            }], id: [{
+                type: Input
             }] } });
 /**
  * Link inside of a `mat-tab-nav-bar`.
@@ -1755,7 +1802,7 @@ class MatTabLink extends _MatTabLinkBase {
     }
 }
 MatTabLink.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatTabLink, deps: [{ token: MatTabNav }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i3.Platform }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }, { token: 'tabindex', attribute: true }, { token: i7.FocusMonitor }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-MatTabLink.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: { disabled: "disabled", disableRipple: "disableRipple", tabIndex: "tabIndex" }, host: { listeners: { "focus": "_handleFocus()" }, properties: { "attr.aria-current": "active ? \"page\" : null", "attr.aria-disabled": "disabled", "attr.tabIndex": "tabIndex", "class.mat-tab-disabled": "disabled", "class.mat-tab-label-active": "active" }, classAttribute: "mat-tab-link mat-focus-indicator" }, exportAs: ["matTabLink"], usesInheritance: true, ngImport: i0 });
+MatTabLink.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: { disabled: "disabled", disableRipple: "disableRipple", tabIndex: "tabIndex" }, host: { listeners: { "focus": "_handleFocus()", "keydown": "_handleKeydown($event)" }, properties: { "attr.aria-controls": "_getAriaControls()", "attr.aria-current": "_getAriaCurrent()", "attr.aria-disabled": "disabled", "attr.aria-selected": "_getAriaSelected()", "attr.id": "id", "attr.tabIndex": "_getTabIndex()", "attr.role": "_getRole()", "class.mat-tab-disabled": "disabled", "class.mat-tab-label-active": "active" }, classAttribute: "mat-tab-link mat-focus-indicator" }, exportAs: ["matTabLink"], usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatTabLink, decorators: [{
             type: Directive,
             args: [{
@@ -1764,12 +1811,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                     inputs: ['disabled', 'disableRipple', 'tabIndex'],
                     host: {
                         'class': 'mat-tab-link mat-focus-indicator',
-                        '[attr.aria-current]': 'active ? "page" : null',
+                        '[attr.aria-controls]': '_getAriaControls()',
+                        '[attr.aria-current]': '_getAriaCurrent()',
                         '[attr.aria-disabled]': 'disabled',
-                        '[attr.tabIndex]': 'tabIndex',
+                        '[attr.aria-selected]': '_getAriaSelected()',
+                        '[attr.id]': 'id',
+                        '[attr.tabIndex]': '_getTabIndex()',
+                        '[attr.role]': '_getRole()',
                         '[class.mat-tab-disabled]': 'disabled',
                         '[class.mat-tab-label-active]': 'active',
                         '(focus)': '_handleFocus()',
+                        '(keydown)': '_handleKeydown($event)',
                     },
                 }]
         }], ctorParameters: function () { return [{ type: MatTabNav }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i3.Platform }, { type: undefined, decorators: [{
@@ -1786,6 +1838,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                     type: Inject,
                     args: [ANIMATION_MODULE_TYPE]
                 }] }]; } });
+/**
+ * Tab panel component associated with MatTabNav.
+ */
+class MatTabNavPanel {
+    constructor() {
+        /** Unique id for the tab panel. */
+        this.id = `mat-tab-nav-panel-${nextUniqueId++}`;
+    }
+}
+MatTabNavPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatTabNavPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+MatTabNavPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: { id: "id" }, host: { attributes: { "role": "tabpanel" }, properties: { "attr.aria-labelledby": "_activeTabId", "attr.id": "id" }, classAttribute: "mat-tab-nav-panel" }, exportAs: ["matTabNavPanel"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatTabNavPanel, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'mat-tab-nav-panel',
+                    exportAs: 'matTabNavPanel',
+                    template: '<ng-content></ng-content>',
+                    host: {
+                        '[attr.aria-labelledby]': '_activeTabId',
+                        '[attr.id]': 'id',
+                        'class': 'mat-tab-nav-panel',
+                        'role': 'tabpanel',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { id: [{
+                type: Input
+            }] } });
 
 /**
  * @license
@@ -1803,6 +1884,7 @@ MatTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         MatInkBar,
         MatTabLabelWrapper,
         MatTabNav,
+        MatTabNavPanel,
         MatTabLink,
         MatTabBody,
         MatTabBodyPortal,
@@ -1817,6 +1899,7 @@ MatTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         MatTabLabel,
         MatTab,
         MatTabNav,
+        MatTabNavPanel,
         MatTabLink,
         MatTabContent] });
 MatTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatTabsModule, imports: [[
@@ -1845,6 +1928,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                         MatTabLabel,
                         MatTab,
                         MatTabNav,
+                        MatTabNavPanel,
                         MatTabLink,
                         MatTabContent,
                     ],
@@ -1855,6 +1939,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                         MatInkBar,
                         MatTabLabelWrapper,
                         MatTabNav,
+                        MatTabNavPanel,
                         MatTabLink,
                         MatTabBody,
                         MatTabBodyPortal,
@@ -1892,5 +1977,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { MAT_TAB, MAT_TABS_CONFIG, MAT_TAB_GROUP, MatInkBar, MatTab, MatTabBody, MatTabBodyPortal, MatTabChangeEvent, MatTabContent, MatTabGroup, MatTabHeader, MatTabLabel, MatTabLabelWrapper, MatTabLink, MatTabNav, MatTabsModule, _MAT_INK_BAR_POSITIONER, _MatTabBodyBase, _MatTabGroupBase, _MatTabHeaderBase, _MatTabLinkBase, _MatTabNavBase, matTabsAnimations };
+export { MAT_TAB, MAT_TABS_CONFIG, MAT_TAB_GROUP, MatInkBar, MatTab, MatTabBody, MatTabBodyPortal, MatTabChangeEvent, MatTabContent, MatTabGroup, MatTabHeader, MatTabLabel, MatTabLabelWrapper, MatTabLink, MatTabNav, MatTabNavPanel, MatTabsModule, _MAT_INK_BAR_POSITIONER, _MatTabBodyBase, _MatTabGroupBase, _MatTabHeaderBase, _MatTabLinkBase, _MatTabNavBase, matTabsAnimations };
 //# sourceMappingURL=tabs.mjs.map