v7.0.0-alpha.17

examples/grouping-client-side/src/App.js

@@ -49,9 +49,9 @@ function Table({ columns, data }) {
     useExpanded // useGroupBy would be pretty useless without useExpanded ;)
   )
 
-  // We don't want to render all 2000 rows for this example, so cap
+  // We don't want to render all of the rows for this example, so cap
   // it at 20 for this use case
-  const firstPageRows = rows.slice()
+  const firstPageRows = rows.slice(0, 100)
 
   return (
     <>
@@ -68,7 +68,7 @@ function Table({ columns, data }) {
                   {column.canGroupBy ? (
                     // If the column can be grouped, let's add a toggle
                     <span {...column.getGroupByToggleProps()}>
-                      {column.grouped ? '🛑' : '👊'}
+                      {column.grouped ? '🛑 ' : '👊 '}
                     </span>
                   ) : null}
                   {column.render('Header')}
@@ -109,7 +109,7 @@ function Table({ columns, data }) {
                               onClick={() => row.toggleExpanded()}
                             >
                               {row.isExpanded ? '👇' : '👉'}
-                            </span>
+                            </span>{' '}
                             {cell.render('Cell')} ({row.subRows.length})
                           </>
                         ) : cell.aggregated ? (
@@ -129,7 +129,7 @@ function Table({ columns, data }) {
         </tbody>
       </table>
       <br />
-      <div>Showing the first 20 results of {rows.length} rows</div>
+      <div>Showing the first 100 results of {rows.length} rows</div>
     </>
   )
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-table",
-  "version": "7.0.0-alpha.16",
+  "version": "7.0.0-alpha.17",
   "description": "A fast, lightweight, opinionated table and datagrid built on React",
   "license": "MIT",
   "homepage": "https://github.com/tannerlinsley/react-table#readme",
@@ -31,6 +31,7 @@
   },
   "files": [
     "CHANGELOG.md",
+    "src/**/*.js",
     "dist",
     "LICENCE",
     "package.json",

src/utils.js

@@ -39,7 +39,7 @@ export function decorateColumn(column, defaultColumn, parent, depth, index) {
 
   column = {
     Header: () => null,
-    Cell: ({ value }) => (typeof value !== 'undefined' ? value : ''),
+    Cell: ({ value = '' }) => value,
     show: true,
     ...column,
     id,