@patternfly/react-table 6.0.0-alpha.88 → 6.0.0-alpha.89

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-table",
-  "version": "6.0.0-alpha.88",
+  "version": "6.0.0-alpha.89",
   "description": "This library provides a set of React table components for use with the PatternFly 4",
   "main": "dist/js/index.js",
   "module": "dist/esm/index.js",
@@ -40,7 +40,7 @@
     "subpaths": "node ../../scripts/exportSubpaths.js --config subpaths.config.json"
   },
   "dependencies": {
-    "@patternfly/react-core": "^6.0.0-alpha.87",
+    "@patternfly/react-core": "^6.0.0-alpha.88",
     "@patternfly/react-icons": "^6.0.0-alpha.31",
     "@patternfly/react-styles": "^6.0.0-alpha.30",
     "@patternfly/react-tokens": "^6.0.0-alpha.30",
@@ -51,5 +51,5 @@
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
-  "gitHead": "8e897861592c3ee8b186f6aef3958741073312e7"
+  "gitHead": "18e869e654d317afd33701db8252d408690fbd62"
 }

package/src/demos/DashboardWrapper.tsx

@@ -2,6 +2,7 @@ import React, { useState } from 'react';
 import {
   Breadcrumb,
   BreadcrumbItem,
+  Content,
   Nav,
   NavItem,
   NavList,
@@ -9,9 +10,7 @@ import {
   PageSection,
   PageSidebar,
   PageSidebarBody,
-  SkipToContent,
-  Text,
-  TextContent
+  SkipToContent
 } from '@patternfly/react-core';
 import { DashboardHeader } from './DashboardHeader';
 
@@ -109,10 +108,10 @@ export const DashboardBreadcrumb = (
 
 const PageTemplateTitle = (
   <PageSection>
-    <TextContent>
-      <Text component="h1">Main title</Text>
-      <Text component="p">This is a full page demo.</Text>
-    </TextContent>
+    <Content>
+      <h1>Main title</h1>
+      <p>This is a full page demo.</p>
+    </Content>
   </PageSection>
 );
 

package/src/demos/Table.md

@@ -21,7 +21,6 @@ Breadcrumb,
 BreadcrumbItem,
 Page,
 PageSectionVariants,
-TextContent,
 Text,
 Divider,
 Avatar,

package/src/demos/examples/TableColumnManagement.tsx

@@ -3,6 +3,7 @@ import React from 'react';
 import {
   Button,
   Card,
+  Content,
   DataList,
   DataListCheck,
   DataListItem,
@@ -20,10 +21,7 @@ import {
   OverflowMenuItem,
   PageSection,
   Pagination,
-  PaginationVariant,
-  Text,
-  TextContent,
-  TextVariants
+  PaginationVariant
 } from '@patternfly/react-core';
 import { Table, TableText, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-table';
 import FilterIcon from '@patternfly/react-icons/dist/esm/icons/filter-icon';
@@ -213,12 +211,12 @@ export const TableColumnManagement: React.FunctionComponent = () => {
       isOpen={isModalOpen}
       variant="small"
       description={
-        <TextContent>
-          <Text component={TextVariants.p}>Selected categories will be displayed in the table.</Text>
+        <Content>
+          <p>Selected categories will be displayed in the table.</p>
           <Button isInline onClick={selectAllColumns} variant="link">
             Select all
           </Button>
-        </TextContent>
+        </Content>
       }
       onClose={handleModalToggle}
       actions={[

package/src/demos/examples/TableColumnManagementWithDraggable.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import {
   Button,
+  Content,
   DataList,
   DataListCheck,
   DataListControl,
@@ -16,9 +17,6 @@ import {
   OverflowMenu,
   OverflowMenuGroup,
   OverflowMenuItem,
-  Text,
-  TextContent,
-  TextVariants,
   MenuToggle
 } from '@patternfly/react-core';
 import { Table as TableDeprecated, TableHeader, TableBody } from '@patternfly/react-table/deprecated';
@@ -427,12 +425,12 @@ export const TableColumnManagementWithDraggable: React.FunctionComponent = () =>
       isOpen={isModalOpen}
       variant="small"
       description={
-        <TextContent>
-          <Text component={TextVariants.p}>Selected categories will be displayed in the table.</Text>
+        <Content>
+          <p>Selected categories will be displayed in the table.</p>
           <Button isInline onClick={selectAllColumns} variant="link">
             Select all
           </Button>
-        </TextContent>
+        </Content>
       }
       onClose={handleModalToggle}
       actions={[

package/src/demos/examples/TableExpandCollapseAll.tsx

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-import { Card, Label, PageSection, TextVariants, Text, TextContent } from '@patternfly/react-core';
+import { Card, Content, Label, PageSection } from '@patternfly/react-core';
 import { Table, Thead, Tbody, Tr, Th, Td, ExpandableRowContent } from '@patternfly/react-table';
 import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 
@@ -22,17 +22,17 @@ const serverData: Server[] = [
     workspaces: 7,
     status: { title: <Label color="green">Running</Label> },
     details: (
-      <TextContent>
-        <Text component={TextVariants.p}>
-          Location<Text component={TextVariants.small}>Boston</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          Last Modified<Text component={TextVariants.small}>2 hours ago</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          URL<Text component={TextVariants.small}>http://www.redhat.com/en/office-locations/US-node1</Text>
-        </Text>
-      </TextContent>
+      <Content>
+        <p>
+          Location<small>Boston</small>
+        </p>
+        <p>
+          Last Modified<small>2 hours ago</small>
+        </p>
+        <p>
+          URL<small>http://www.redhat.com/en/office-locations/US-node1</small>
+        </p>
+      </Content>
     )
   },
   {
@@ -42,17 +42,17 @@ const serverData: Server[] = [
     workspaces: 17,
     status: { title: <Label color="red">Down</Label> },
     details: (
-      <TextContent>
-        <Text component={TextVariants.p}>
-          Location<Text component={TextVariants.small}>Atlanta</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          Last Modified<Text component={TextVariants.small}>5 hours ago</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          URL<Text component={TextVariants.small}>http://www.redhat.com/en/office-locations/US-node2</Text>
-        </Text>
-      </TextContent>
+      <Content>
+        <p>
+          Location<small>Atlanta</small>
+        </p>
+        <p>
+          Last Modified<small>5 hours ago</small>
+        </p>
+        <p>
+          URL<small>http://www.redhat.com/en/office-locations/US-node2</small>
+        </p>
+      </Content>
     )
   },
   {
@@ -62,17 +62,17 @@ const serverData: Server[] = [
     workspaces: 3,
     status: { title: <Label color="green">Running</Label> },
     details: (
-      <TextContent>
-        <Text component={TextVariants.p}>
-          Location<Text component={TextVariants.small}>San Francisco</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          Last Modified<Text component={TextVariants.small}>20 minutes ago</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          URL<Text component={TextVariants.small}>http://www.redhat.com/en/office-locations/US-node3</Text>
-        </Text>
-      </TextContent>
+      <Content>
+        <p>
+          Location<small>San Francisco</small>
+        </p>
+        <p>
+          Last Modified<small>20 minutes ago</small>
+        </p>
+        <p>
+          URL<small>http://www.redhat.com/en/office-locations/US-node3</small>
+        </p>
+      </Content>
     )
   },
   {
@@ -82,17 +82,17 @@ const serverData: Server[] = [
     workspaces: 15,
     status: { title: <Label color="blue">Needs Maintenance</Label> },
     details: (
-      <TextContent>
-        <Text component={TextVariants.p}>
-          Location<Text component={TextVariants.small}>Raleigh</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          Last Modified<Text component={TextVariants.small}>10 minutes ago</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          URL<Text component={TextVariants.small}>http://www.redhat.com/en/office-locations/US-node4</Text>
-        </Text>
-      </TextContent>
+      <Content>
+        <p>
+          Location<small>Raleigh</small>
+        </p>
+        <p>
+          Last Modified<small>10 minutes ago</small>
+        </p>
+        <p>
+          URL<small>http://www.redhat.com/en/office-locations/US-node4</small>
+        </p>
+      </Content>
     )
   },
   {
@@ -102,17 +102,17 @@ const serverData: Server[] = [
     workspaces: 17,
     status: { title: <Label color="orange">Stopped</Label> },
     details: (
-      <TextContent>
-        <Text component={TextVariants.p}>
-          Location<Text component={TextVariants.small}>Atlanta</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          Last Modified<Text component={TextVariants.small}>15 minutes ago</Text>
-        </Text>
-        <Text component={TextVariants.p}>
-          URL<Text component={TextVariants.small}>http://www.redhat.com/en/office-locations/US-node5</Text>
-        </Text>
-      </TextContent>
+      <Content>
+        <p>
+          Location<small>Atlanta</small>
+        </p>
+        <p>
+          Last Modified<small>15 minutes ago</small>
+        </p>
+        <p>
+          URL<small>http://www.redhat.com/en/office-locations/US-node5</small>
+        </p>
+      </Content>
     )
   }
 ];

package/src/demos/examples/TableSortableResponsive.tsx

@@ -3,6 +3,7 @@ import React from 'react';
 import {
   Button,
   Card,
+  Content,
   Dropdown,
   DropdownList,
   Flex,
@@ -14,8 +15,6 @@ import {
   SelectOption,
   SelectList,
   SelectGroup,
-  Text,
-  TextContent,
   Toolbar,
   ToolbarContent,
   ToolbarGroup,
@@ -232,13 +231,13 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
     <React.Fragment>
       <DashboardWrapper>
         <PageSection isWidthLimited variant={PageSectionVariants.light}>
-          <TextContent>
-            <Text component="h1">Table demos</Text>
-            <Text component="p">
+          <Content>
+            <h1>Table demos</h1>
+            <p>
               Below is an example of a responsive sortable table. When the screen size shrinks the table into a compact
               form, the toolbar will display a dropdown menu containing sorting options.
-            </Text>
-          </TextContent>
+            </p>
+          </Content>
         </PageSection>
         <PageSection
           padding={{