fix: fix error with hidden content for data table

src/DataTable/README.md

@@ -1689,4 +1689,4 @@ After selecting the maximum possible number of rows, you can display an error me
     </DataTable>
   );
 }
-```
+```

src/DataTable/TableCell.tsx

@@ -10,13 +10,25 @@ interface TableCellProps {
   column: {
     /** Class(es) to be applied to the cells in the given column */
     cellClassName?: string;
+    /** Uniq ID of the column  */
+    id?: string;
   };
 }
 function TableCell({ getCellProps, render, column }: TableCellProps) {
   const { className, ...rest } = getCellProps();
+
+  const isActionColumn = column.id === 'action';
+  const cellClasses = classNames(className, column.cellClassName);
+
   return (
-    <td {...rest} className={classNames('pgn__data-table-cell-wrap', className, column.cellClassName)}>
-      {render('Cell')}
+    <td {...rest} className={cellClasses}>
+      {!isActionColumn ? (
+        <div className="pgn__data-table-cell-wrap">
+          {render('Cell')}
+        </div>
+      ) : (
+        render('Cell')
+      )}
     </td>
   );
 }

src/DataTable/tests/TableRow.test.jsx

@@ -85,6 +85,6 @@ describe('<TableRow />', () => {
     const { container } = render(<TableRowWrapper value={{}} row={{ ...props, isExpanded: true }} />);
     const rows = screen.getAllByRole('row');
     expect(rows.length).toEqual(1);
-    expect(container.querySelector('div')).not.toBeInTheDocument();
+    expect(container.querySelector('div')).toBeInTheDocument();
   });
 });