From 8ec08133af05c0755fbac764b3275af0f8ae0c1c Mon Sep 17 00:00:00 2001
From: Andrew Jakubowicz <ajakubowicz@google.com>
Date: Wed, 27 Sep 2023 13:26:36 -0700
Subject: [PATCH] fix(tabs)!: use `md-tab` attribute to brand individual tab
 children

PiperOrigin-RevId: 568943375
---
 tabs/internal/tab.ts  |  8 ++++++++
 tabs/internal/tabs.ts | 11 ++++-------
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/tabs/internal/tab.ts b/tabs/internal/tab.ts
index b7731dd3c..9e0698512 100644
--- a/tabs/internal/tab.ts
+++ b/tabs/internal/tab.ts
@@ -35,6 +35,14 @@ export class Tab extends LitElement {
     setupHostAria(Tab);
   }
 
+  /**
+   * The attribute `md-tab` indicates that the element is a tab for the parent
+   * element, `<md-tabs>`. Make sure if you're implementing your own `md-tab`
+   * component that you have an `md-tab` attribute set.
+   */
+  @property({type: Boolean, reflect: true, attribute: 'md-tab'})
+  readonly isTab = true;
+
   /**
    * Whether or not the tab is selected.
    **/
diff --git a/tabs/internal/tabs.ts b/tabs/internal/tabs.ts
index 8fa166689..e63549bbb 100644
--- a/tabs/internal/tabs.ts
+++ b/tabs/internal/tabs.ts
@@ -45,9 +45,8 @@ export class Tabs extends LitElement {
   /**
    * The tabs of this tab bar.
    */
-  get tabs() {
-    return this.maybeTabs.filter(isTab);
-  }
+  @queryAssignedElements({flatten: true, selector: '[md-tab]'})
+  readonly tabs!: Tab[];
 
   /**
    * The currently selected tab, `null` only when there are no tab children.
@@ -106,8 +105,6 @@ export class Tabs extends LitElement {
   @property({type: Boolean, attribute: 'auto-activate'}) autoActivate = false;
 
   @query('slot') private readonly slotElement!: HTMLSlotElement|null;
-  @queryAssignedElements({flatten: true})
-  private readonly maybeTabs!: HTMLElement[];
 
   private get focusedTab() {
     return this.tabs.find(tab => tab.matches(':focus-within'));
@@ -307,5 +304,5 @@ export class Tabs extends LitElement {
 }
 
 function isTab(element: unknown): element is Tab {
-  return element instanceof Tab;
-}
+  return element instanceof HTMLElement && element.hasAttribute('md-tab');
+}
\ No newline at end of file