fix(bug): added tabContentId to resolve accessibility issue

Author: parthivrh

package.json

@@ -124,6 +124,7 @@
   "dependencies": {
     "@patternfly/react-component-groups": "^6.2.1",
     "clsx": "^2.1.1",
-    "react-jss": "^10.10.0"
+    "react-jss": "^10.10.0",
+    "serve": "^14.2.4"
   }
 }

packages/react-core/src/demos/Animations/examples/Animations.tsx

@@ -1555,22 +1555,22 @@ export const Animations: FunctionComponent = () => {
           <Content component={ContentVariants.h1}>Resources</Content>
           <Content className="pf-v6-u-mb-md">Everything you need to know about your application</Content>
           <Tabs activeKey={selectedTab} onSelect={(_e, key) => setSelectedTab(Number(key))} aria-label="Primary tabs">
-            <Tab eventKey={0} title={<TabTitleText>Overview</TabTitleText>} />
-            <Tab eventKey={1} title={<TabTitleText>Resources</TabTitleText>} />
-            <Tab eventKey={2} title={<TabTitleText>Database</TabTitleText>} />
+            <Tab eventKey={0} title={<TabTitleText>Overview</TabTitleText>} tabContentId="overview" />
+            <Tab eventKey={1} title={<TabTitleText>Resources</TabTitleText>} tabContentId="resources" />
+            <Tab eventKey={2} title={<TabTitleText>Database</TabTitleText>} tabContentId="database" />
           </Tabs>
         </PageSection>
         {selectedTab === 0 && (
           <Fragment>
-            <PageSection>
+            <PageSection id="overview">
               <MultiContentCard isExpandable={true} cards={cards} toggleText="Improve recommended pathways" />
             </PageSection>
             <PageSection aria-label="Detail status events">{detailStatusEvents}</PageSection>
           </Fragment>
         )}
 
         {selectedTab === 1 && (
-          <PageSection>
+          <PageSection id="resources">
             <TableExpandCollapseAll />
           </PageSection>
         )}