@patternfly/react-table 6.3.0-prerelease.11 → 6.3.0-prerelease.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-table",
-  "version": "6.3.0-prerelease.11",
+  "version": "6.3.0-prerelease.13",
   "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,10 +40,10 @@
     "subpaths": "node ../../scripts/exportSubpaths.mjs --config subpaths.config.json"
   },
   "dependencies": {
-    "@patternfly/react-core": "^6.3.0-prerelease.11",
-    "@patternfly/react-icons": "^6.3.0-prerelease.1",
-    "@patternfly/react-styles": "^6.3.0-prerelease.1",
-    "@patternfly/react-tokens": "^6.3.0-prerelease.1",
+    "@patternfly/react-core": "^6.3.0-prerelease.13",
+    "@patternfly/react-icons": "^6.3.0-prerelease.2",
+    "@patternfly/react-styles": "^6.3.0-prerelease.2",
+    "@patternfly/react-tokens": "^6.3.0-prerelease.2",
     "lodash": "^4.17.21",
     "tslib": "^2.8.1"
   },
@@ -51,5 +51,5 @@
     "react": "^17 || ^18 || ^19",
     "react-dom": "^17 || ^18 || ^19"
   },
-  "gitHead": "23d5f17d1a0b2f51ca88bb337b4e77f391094edb"
+  "gitHead": "5c6511cf7ea76569ab3ad0e7696bb660a3d0b58f"
 }

package/src/components/Table/Tr.tsx

@@ -14,10 +14,12 @@ export interface TrProps extends Omit<React.HTMLProps<HTMLTableRowElement>, 'onR
   innerRef?: React.Ref<any>;
   /** Flag indicating the Tr is hidden */
   isHidden?: boolean;
-  /** Only applicable to Tr within the Tbody: Makes the row expandable and determines if it's expanded or not.
+  /** Only applicable to Tr within the Tbody and determines if the expandable row content is expanded or not.
    * To prevent column widths from responding automatically when expandable rows are toggled, the width prop must also be passed into either the th or td component
    */
   isExpanded?: boolean;
+  /** Flag to indicate that a row is expandable. Only applicable to a tr that is intended to collapse or expand. */
+  isExpandable?: boolean;
   /** Only applicable to Tr within the Tbody: Whether the row is editable */
   isEditable?: boolean;
   /** Flag which adds hover styles for the clickable table row */
@@ -46,6 +48,7 @@ const TrBase: React.FunctionComponent<TrProps> = ({
   children,
   className,
   isExpanded,
+  isExpandable,
   isEditable,
   isHidden = false,
   isClickable = false,
@@ -75,7 +78,7 @@ const TrBase: React.FunctionComponent<TrProps> = ({
     };
   }
 
-  const rowIsHidden = isHidden || (isExpanded !== undefined && !isExpanded);
+  const rowIsHidden = isHidden || (isExpanded !== undefined && !isExpanded && isExpandable);
 
   const { registerSelectableRow } = useContext(TableContext);
 
@@ -96,7 +99,7 @@ const TrBase: React.FunctionComponent<TrProps> = ({
         className={css(
           styles.tableTr,
           className,
-          isExpanded !== undefined && styles.tableExpandableRow,
+          isExpandable !== undefined && styles.tableExpandableRow,
           isExpanded && styles.modifiers.expanded,
           isEditable && inlineStyles.modifiers.inlineEditable,
           isClickable && styles.modifiers.clickable,

package/src/components/Table/__tests__/__snapshots__/RowWrapper.test.tsx.snap

@@ -20,7 +20,7 @@ exports[`RowWrapper renders expanded correctly 1`] = `
   <table>
     <tbody>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row pf-m-expanded"
+        class="pf-v6-c-table__tr pf-m-expanded"
         data-ouia-component-id="OUIA-Generated-TableRow-2"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"

package/src/components/Table/examples/TableExpandable.tsx

@@ -116,7 +116,7 @@ export const TableExpandable: React.FunctionComponent = () => {
         id="toggle-compact"
         name="toggle-compact"
       />
-      <Table aria-label="Expandable table" variant={isExampleCompact ? 'compact' : undefined}>
+      <Table isExpandable aria-label="Expandable table" variant={isExampleCompact ? 'compact' : undefined}>
         <Thead>
           <Tr>
             <Th screenReaderText="Row expansion" />
@@ -152,7 +152,7 @@ export const TableExpandable: React.FunctionComponent = () => {
           }
           return (
             <Tbody key={repo.name} isExpanded={isRepoExpanded(repo)}>
-              <Tr>
+              <Tr isExpanded={isRepoExpanded(repo)}>
                 <Td
                   expand={
                     repo.details
@@ -172,7 +172,7 @@ export const TableExpandable: React.FunctionComponent = () => {
                 <Td dataLabel={columnNames.lastCommit}>{repo.lastCommit}</Td>
               </Tr>
               {repo.details ? (
-                <Tr isExpanded={isRepoExpanded(repo)}>
+                <Tr isExpandable isExpanded={isRepoExpanded(repo)}>
                   {!childIsFullWidth ? <Td /> : null}
                   {repo.details.detail1 ? (
                     <Td dataLabel="Repo detail 1" noPadding={childHasNoPadding} colSpan={detail1Colspan}>

package/src/components/Table/examples/TableNestedTableExpandable.tsx

@@ -128,7 +128,7 @@ export const TableExpandable: React.FunctionComponent = () => {
   ];
 
   return (
-    <Table aria-label="Simple table">
+    <Table isExpandable aria-label="Simple table">
       <Thead>
         <Tr>
           <Th screenReaderText="Row expansion" />
@@ -141,7 +141,7 @@ export const TableExpandable: React.FunctionComponent = () => {
       </Thead>
       {repositories.map((repo, rowIndex) => (
         <Tbody key={repo.name} isExpanded={isRepoExpanded(repo)}>
-          <Tr>
+          <Tr isExpanded={isRepoExpanded(repo)}>
             <Td
               expand={
                 repo.nestedComponent
@@ -163,7 +163,7 @@ export const TableExpandable: React.FunctionComponent = () => {
             </Td>
           </Tr>
           {repo.nestedComponent ? (
-            <Tr isExpanded={isRepoExpanded(repo)}>
+            <Tr isExpandable isExpanded={isRepoExpanded(repo)}>
               <Td
                 noPadding={repo.noPadding}
                 dataLabel={`${columnNames.name} expended`}

package/src/demos/examples/TableExpandCollapseAll.tsx

@@ -156,7 +156,7 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
           aria-label="Collapsible table data"
         >
           <Card component="div">
-            <Table aria-label="Collapsible table">
+            <Table isExpandable aria-label="Collapsible table">
               <Thead>
                 <Tr>
                   <Th
@@ -175,7 +175,7 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
 
               {serverData.map((server, serverIndex) => (
                 <Tbody key={server.name} isExpanded={isServerExpanded(server)}>
-                  <Tr>
+                  <Tr isExpanded={isServerExpanded(server)}>
                     <Td
                       expand={
                         server.details
@@ -195,7 +195,7 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
                     <Td>{server?.workspaces}</Td>
                     <Td>{server?.status?.title}</Td>
                   </Tr>
-                  <Tr isExpanded={isServerExpanded(server)}>
+                  <Tr isExpandable isExpanded={isServerExpanded(server)}>
                     <Td></Td>
                     <Td colSpan={expandableColumns.length}>
                       <ExpandableRowContent>{server?.details}</ExpandableRowContent>

package/src/deprecated/components/Table/__tests__/__snapshots__/Table.test.tsx.snap

@@ -1602,11 +1602,10 @@ exports[`Table Collapsible nested table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-182"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td pf-v6-c-table__toggle"
@@ -1698,11 +1697,10 @@ exports[`Table Collapsible nested table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-183"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -1855,11 +1853,10 @@ exports[`Table Collapsible nested table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-185"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -2363,7 +2360,7 @@ exports[`Table Collapsible table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row pf-m-expanded"
+        class="pf-v6-c-table__tr pf-m-expanded"
         data-ouia-component-id="OUIA-Generated-TableRow-167"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
@@ -2580,11 +2577,10 @@ exports[`Table Collapsible table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-170"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -2979,7 +2975,7 @@ exports[`Table Compound Expandable table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row pf-m-expanded"
+        class="pf-v6-c-table__tr pf-m-expanded"
         data-ouia-component-id="OUIA-Generated-TableRow-177"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
@@ -3045,11 +3041,10 @@ exports[`Table Compound Expandable table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-179"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td pf-v6-c-table__compound-expansion-toggle"
@@ -3188,11 +3183,10 @@ exports[`Table Control text table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-212"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <th
           class="pf-v6-c-table__td"
@@ -3240,11 +3234,10 @@ exports[`Table Control text table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-213"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <th
           class="pf-v6-c-table__td"
@@ -3348,11 +3341,10 @@ exports[`Table Control text table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-215"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <th
           class="pf-v6-c-table__td"
@@ -3750,11 +3742,10 @@ exports[`Table Header width table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-222"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <th
           class="pf-v6-c-table__td"
@@ -3802,11 +3793,10 @@ exports[`Table Header width table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-223"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <th
           class="pf-v6-c-table__td"
@@ -3910,11 +3900,10 @@ exports[`Table Header width table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-225"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <th
           class="pf-v6-c-table__td"
@@ -4370,11 +4359,10 @@ exports[`Table Selectable table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-192"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -4427,11 +4415,10 @@ exports[`Table Selectable table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-193"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -4553,11 +4540,10 @@ exports[`Table Selectable table 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-195"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -5062,11 +5048,10 @@ exports[`Table Selectable table with Radio 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-202"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -5119,11 +5104,10 @@ exports[`Table Selectable table with Radio 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-203"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"
@@ -5245,11 +5229,10 @@ exports[`Table Selectable table with Radio 1`] = `
         </td>
       </tr>
       <tr
-        class="pf-v6-c-table__tr pf-v6-c-table__expandable-row"
+        class="pf-v6-c-table__tr"
         data-ouia-component-id="OUIA-Generated-TableRow-205"
         data-ouia-component-type="PF6/TableRow"
         data-ouia-safe="true"
-        hidden=""
       >
         <td
           class="pf-v6-c-table__td"