From b9a3908fcf1abb3c1d11c888581e193768960b35 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Sat, 15 Jan 2022 22:46:00 +0100
Subject: [PATCH] feat(material/tabs): add API to update the pagination
 (#23288)

We try to update the pagination state of the tab group very sparingly, because it has performance implications. This means that we may miss some updates.

These changes expose a method so that consumers can trigger a recalculation on their own.

Fixes #23206.
---
 src/material/tabs/tab-group.ts          | 16 +++++++++++++++-
 tools/public_api_guard/material/tabs.md |  1 +
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/material/tabs/tab-group.ts b/src/material/tabs/tab-group.ts
index 318ae407779f..7952dabdaa51 100644
--- a/src/material/tabs/tab-group.ts
+++ b/src/material/tabs/tab-group.ts
@@ -71,7 +71,8 @@ const _MatTabGroupMixinBase = mixinColor(
 );
 
 interface MatTabGroupBaseHeader {
-  _alignInkBarToSelectedTab: () => void;
+  _alignInkBarToSelectedTab(): void;
+  updatePagination(): void;
   focusIndex: number;
 }
 
@@ -327,6 +328,19 @@ export abstract class _MatTabGroupBase
     }
   }
 
+  /**
+   * Recalculates the tab group's pagination dimensions.
+   *
+   * WARNING: Calling this method can be very costly in terms of performance. It should be called
+   * as infrequently as possible from outside of the Tabs component as it causes a reflow of the
+   * page.
+   */
+  updatePagination() {
+    if (this._tabHeader) {
+      this._tabHeader.updatePagination();
+    }
+  }
+
   /**
    * Sets focus to a particular tab.
    * @param index Index of the tab to be focused.
diff --git a/tools/public_api_guard/material/tabs.md b/tools/public_api_guard/material/tabs.md
index 66d6ea927d30..ebb3a947298a 100644
--- a/tools/public_api_guard/material/tabs.md
+++ b/tools/public_api_guard/material/tabs.md
@@ -260,6 +260,7 @@ export abstract class _MatTabGroupBase extends _MatTabGroupMixinBase implements
     // (undocumented)
     abstract _tabHeader: MatTabGroupBaseHeader;
     _tabs: QueryList<MatTab>;
+    updatePagination(): void;
     // (undocumented)
     static ɵdir: i0.ɵɵDirectiveDeclaration<_MatTabGroupBase, never, never, { "dynamicHeight": "dynamicHeight"; "selectedIndex": "selectedIndex"; "headerPosition": "headerPosition"; "animationDuration": "animationDuration"; "contentTabIndex": "contentTabIndex"; "disablePagination": "disablePagination"; "backgroundColor": "backgroundColor"; }, { "selectedIndexChange": "selectedIndexChange"; "focusChange": "focusChange"; "animationDone": "animationDone"; "selectedTabChange": "selectedTabChange"; }, never>;
     // (undocumented)