Fix addPlacholderRows with cell styles defined

techniq · Jun 21, 2019 · 2d2bb87 · 2d2bb87
1 parent 303b8ac
commit 2d2bb87
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 1 deletion.
diff --git a/src/index.js b/src/index.js
@@ -349,13 +349,18 @@ function MuiTable(props) {
                       })
                     );
 
+                    cellProps.style = {
+                      ...cellProps.style,
+                      visibility: 'hidden'
+                    };
+
                     return (
                       <TableCell
                         style={{ visibility: 'hidden' }}
                         key={`body-cell-placeholder-${rowIndex}-${column.name}`}
                         {...cellProps}
                       >
-                        ' '
+                        &nbsp;
                       </TableCell>
                     );
                   })}

diff --git a/stories/basic.js b/stories/basic.js
@@ -514,6 +514,31 @@ storiesOf('Pagination', module)
       />
     );
   })
+  .add('addPlaceholderRows with cell styles', () => {
+    const data = createPersonData(13);
+    return (
+      <PaginatedTable
+        data={data}
+        columns={[
+          {
+            name: 'fullName',
+            header: 'Name',
+            cell: d => `${d.firstName} ${d.lastName}`
+          },
+          { name: 'jobTitle', header: 'Job Title' },
+          { name: 'jobArea', header: 'Job Area' }
+        ]}
+        addPlaceholderRows
+        includeHeaders
+        cellProps={{
+          style: {
+            padding: 4
+          }
+        }}
+        containerProps={{ style: { backgroundColor: 'white' } }}
+      />
+    );
+  })
   .add('addPlaceholderRows and empty data', () => {
     return (
       <PaginatedTable