feat(theme): Add theme-tabs-container stable className (#11426)

packages/docusaurus-theme-classic/src/theme/Tabs/index.tsx

@@ -7,6 +7,7 @@
 
 import React, {cloneElement, type ReactElement, type ReactNode} from 'react';
 import clsx from 'clsx';
+import {ThemeClassNames} from '@docusaurus/theme-common';
 import {
   useScrollPositionBlocker,
   useTabs,
@@ -143,7 +144,14 @@ function TabContent({
 function TabsComponent(props: Props): ReactNode {
   const tabs = useTabs(props);
   return (
-    <div className={clsx('tabs-container', styles.tabList)}>
+    <div
+      className={clsx(
+        ThemeClassNames.tabs.container,
+        // former name kept for backward compatibility
+        // see https://github.com/facebook/docusaurus/pull/4086
+        'tabs-container',
+        styles.tabList,
+      )}>
       <TabList {...tabs} {...props} />
       <TabContent {...tabs} {...props} />
     </div>

packages/docusaurus-theme-common/src/utils/ThemeClassNames.ts

@@ -55,6 +55,10 @@ export const ThemeClassNames = {
     container: 'theme-announcement-bar',
   },
 
+  tabs: {
+    container: 'theme-tabs-container',
+  },
+
   layout: {
     navbar: {
       container: 'theme-layout-navbar',