chore: style resize button

Author: mcoker

packages/module/patternfly-docs/content/extensions/data-view/examples/Table/DataViewTableResizableColumnsExample.tsx

@@ -124,9 +124,31 @@ export const ResizableColumnsExample: FunctionComponent = () => {
         screenReaderText
       }
     },
-    'Pull requests',
-    { cell: 'Workspaces', props: { info: { tooltip: 'More information' } } },
-    { cell: 'Last commit', props: { sort: { sortBy: {}, columnIndex: 4 } } }
+    {
+      cell: 'Pull requests',
+      resizableProps: {
+        isResizable: true,
+        onResize,
+        screenReaderText
+      },
+      props: { info: { tooltip: 'More information' } }
+    },
+    {
+      cell: 'This is a really long title',
+      resizableProps: {
+        isResizable: true,
+        onResize,
+        screenReaderText
+      },
+      props: { info: { tooltip: 'More information' } }
+    },
+    { cell: 'Last commit',
+      resizableProps: {
+        isResizable: true,
+        onResize,
+        screenReaderText
+      },
+      props: { sort: { sortBy: {}, columnIndex: 4 } } }
   ];
 
   return <DataViewTable isResizable aria-label="Repositories table" ouiaId={ouiaId} columns={columns} rows={rows} />;

packages/module/src/DataViewTable/__snapshots__/DataViewTable.test.tsx.snap

@@ -21,44 +21,64 @@ exports[`DataViewTable component should render a basic table correctly 1`] = `
         data-ouia-safe="true"
       >
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-0"
           scope="col"
           tabindex="-1"
         >
-          Repositories
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Repositories
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-1"
           scope="col"
           tabindex="-1"
         >
-          Branches
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Branches
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-2"
           scope="col"
           tabindex="-1"
         >
-          Pull requests
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Pull requests
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-3"
           scope="col"
           tabindex="-1"
         >
-          Workspaces
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Workspaces
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-4"
           scope="col"
           tabindex="-1"
         >
-          Last commit
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Last commit
+          </span>
         </th>
       </tr>
     </thead>
@@ -344,44 +364,64 @@ exports[`DataViewTable component should render a tree table correctly 1`] = `
         data-ouia-safe="true"
       >
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-0"
           scope="col"
           tabindex="-1"
         >
-          Repositories
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Repositories
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-1"
           scope="col"
           tabindex="-1"
         >
-          Branches
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Branches
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-2"
           scope="col"
           tabindex="-1"
         >
-          Pull requests
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Pull requests
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-3"
           scope="col"
           tabindex="-1"
         >
-          Workspaces
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Workspaces
+          </span>
         </th>
         <th
-          class="pf-v6-c-table__th"
+          class="pf-v6-c-table__th pf-m-truncate"
           data-ouia-component-id="TableExample-th-4"
           scope="col"
           tabindex="-1"
         >
-          Last commit
+          <span
+            class="pf-v6-c-table__text"
+          >
+            Last commit
+          </span>
         </th>
       </tr>
     </thead>