@tanstack/vue-table 8.0.0-beta.2 → 8.0.0-beta.5

package/build/stats-html.html

@@ -2669,7 +2669,7 @@ var drawChart = (function (exports) {
   </script>
   <script>
     /*<!--*/
-    const data = {"version":2,"tree":{"name":"root","children":[{"name":"index.production.js","children":[{"name":"packages","children":[{"name":"table-core/build/esm/index.js","uid":"5790-149"},{"name":"vue-table/src","children":[{"uid":"5790-151","name":"merge-proxy.ts"},{"uid":"5790-153","name":"index.ts"}]}]}]}],"isRoot":true},"nodeParts":{"5790-149":{"renderedLength":137430,"gzipLength":23365,"brotliLength":0,"mainUid":"5790-148"},"5790-151":{"renderedLength":1622,"gzipLength":660,"brotliLength":0,"mainUid":"5790-150"},"5790-153":{"renderedLength":1774,"gzipLength":693,"brotliLength":0,"mainUid":"5790-152"}},"nodeMetas":{"5790-148":{"id":"/packages/table-core/build/esm/index.js","moduleParts":{"index.production.js":"5790-149"},"imported":[],"importedBy":[{"uid":"5790-152"}]},"5790-150":{"id":"/packages/vue-table/src/merge-proxy.ts","moduleParts":{"index.production.js":"5790-151"},"imported":[],"importedBy":[{"uid":"5790-152"}]},"5790-152":{"id":"/packages/vue-table/src/index.ts","moduleParts":{"index.production.js":"5790-153"},"imported":[{"uid":"5790-148"},{"uid":"5790-154"},{"uid":"5790-150"}],"importedBy":[],"isEntry":true},"5790-154":{"id":"vue","moduleParts":{},"imported":[],"importedBy":[{"uid":"5790-152"}],"isExternal":true}},"env":{"rollup":"2.70.2"},"options":{"gzip":true,"brotli":false,"sourcemap":false}};
+    const data = {"version":2,"tree":{"name":"root","children":[{"name":"index.production.js","children":[{"name":"packages","children":[{"name":"table-core/build/esm/index.js","uid":"8d24-149"},{"name":"vue-table/src","children":[{"uid":"8d24-151","name":"merge-proxy.ts"},{"uid":"8d24-153","name":"index.ts"}]}]}]}],"isRoot":true},"nodeParts":{"8d24-149":{"renderedLength":138784,"gzipLength":23663,"brotliLength":0,"mainUid":"8d24-148"},"8d24-151":{"renderedLength":1622,"gzipLength":660,"brotliLength":0,"mainUid":"8d24-150"},"8d24-153":{"renderedLength":1807,"gzipLength":709,"brotliLength":0,"mainUid":"8d24-152"}},"nodeMetas":{"8d24-148":{"id":"/packages/table-core/build/esm/index.js","moduleParts":{"index.production.js":"8d24-149"},"imported":[],"importedBy":[{"uid":"8d24-152"}]},"8d24-150":{"id":"/packages/vue-table/src/merge-proxy.ts","moduleParts":{"index.production.js":"8d24-151"},"imported":[],"importedBy":[{"uid":"8d24-152"}]},"8d24-152":{"id":"/packages/vue-table/src/index.ts","moduleParts":{"index.production.js":"8d24-153"},"imported":[{"uid":"8d24-148"},{"uid":"8d24-154"},{"uid":"8d24-150"}],"importedBy":[],"isEntry":true},"8d24-154":{"id":"vue","moduleParts":{},"imported":[],"importedBy":[{"uid":"8d24-152"}],"isExternal":true}},"env":{"rollup":"2.70.2"},"options":{"gzip":true,"brotli":false,"sourcemap":false}};
 
     const run = () => {
       const width = window.innerWidth;

package/build/stats-react.json

@@ -11,17 +11,17 @@
             "children": [
               {
                 "name": "table-core/build/esm/index.js",
-                "uid": "5790-156"
+                "uid": "8d24-156"
               },
               {
                 "name": "vue-table/src",
                 "children": [
                   {
-                    "uid": "5790-158",
+                    "uid": "8d24-158",
                     "name": "merge-proxy.ts"
                   },
                   {
-                    "uid": "5790-160",
+                    "uid": "8d24-160",
                     "name": "index.ts"
                   }
                 ]
@@ -34,76 +34,76 @@
     "isRoot": true
   },
   "nodeParts": {
-    "5790-156": {
-      "renderedLength": 137430,
-      "gzipLength": 23365,
+    "8d24-156": {
+      "renderedLength": 138784,
+      "gzipLength": 23663,
       "brotliLength": 0,
-      "mainUid": "5790-155"
+      "mainUid": "8d24-155"
     },
-    "5790-158": {
+    "8d24-158": {
       "renderedLength": 1622,
       "gzipLength": 660,
       "brotliLength": 0,
-      "mainUid": "5790-157"
+      "mainUid": "8d24-157"
     },
-    "5790-160": {
-      "renderedLength": 1774,
-      "gzipLength": 693,
+    "8d24-160": {
+      "renderedLength": 1807,
+      "gzipLength": 709,
       "brotliLength": 0,
-      "mainUid": "5790-159"
+      "mainUid": "8d24-159"
     }
   },
   "nodeMetas": {
-    "5790-155": {
+    "8d24-155": {
       "id": "/packages/table-core/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "5790-156"
+        "index.production.js": "8d24-156"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "5790-159"
+          "uid": "8d24-159"
         }
       ]
     },
-    "5790-157": {
+    "8d24-157": {
       "id": "/packages/vue-table/src/merge-proxy.ts",
       "moduleParts": {
-        "index.production.js": "5790-158"
+        "index.production.js": "8d24-158"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "5790-159"
+          "uid": "8d24-159"
         }
       ]
     },
-    "5790-159": {
+    "8d24-159": {
       "id": "/packages/vue-table/src/index.ts",
       "moduleParts": {
-        "index.production.js": "5790-160"
+        "index.production.js": "8d24-160"
       },
       "imported": [
         {
-          "uid": "5790-155"
+          "uid": "8d24-155"
         },
         {
-          "uid": "5790-161"
+          "uid": "8d24-161"
         },
         {
-          "uid": "5790-157"
+          "uid": "8d24-157"
         }
       ],
       "importedBy": [],
       "isEntry": true
     },
-    "5790-161": {
+    "8d24-161": {
       "id": "vue",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "5790-159"
+          "uid": "8d24-159"
         }
       ],
       "isExternal": true

package/build/umd/index.development.js

@@ -1108,7 +1108,6 @@
     },
     createColumn: (column, instance) => {
       return {
-        filterFn: column.filterFn,
         getAutoFilterFn: () => {
           const firstRow = instance.getCoreRowModel().flatRows[0];
           const value = firstRow == null ? void 0 : firstRow.getValue(column.id);
@@ -1139,7 +1138,7 @@
           var _ref;
 
           const userFilterFns = instance.options.filterFns;
-          return isFunction(column.filterFn) ? column.filterFn : column.filterFn === 'auto' ? column.getAutoFilterFn() : (_ref = userFilterFns == null ? void 0 : userFilterFns[column.filterFn]) != null ? _ref : filterFns[column.filterFn];
+          return isFunction(column.columnDef.filterFn) ? column.columnDef.filterFn : column.columnDef.filterFn === 'auto' ? column.getAutoFilterFn() : (_ref = userFilterFns == null ? void 0 : userFilterFns[column.columnDef.filterFn]) != null ? _ref : filterFns[column.columnDef.filterFn];
         },
         getCanFilter: () => {
           var _column$columnDef$ena, _instance$options$ena, _instance$options$ena2;
@@ -1428,6 +1427,11 @@
   const Grouping = {
     getDefaultColumnDef: () => {
       return {
+        aggregatedCell: props => {
+          var _props$getValue$toStr, _props$getValue;
+
+          return (_props$getValue$toStr = (_props$getValue = props.getValue()) == null ? void 0 : _props$getValue.toString == null ? void 0 : _props$getValue.toString()) != null ? _props$getValue$toStr : null;
+        },
         aggregationFn: 'auto'
       };
     },
@@ -1488,8 +1492,6 @@
           if (Object.prototype.toString.call(value) === '[object Date]') {
             return aggregationFns.extent;
           }
-
-          return aggregationFns.count;
         },
         getAggregationFn: () => {
           var _ref4;
@@ -1500,7 +1502,7 @@
             throw new Error();
           }
 
-          return isFunction(column.aggregationFn) ? column.aggregationFn : column.aggregationFn === 'auto' ? column.getAutoAggregationFn() : (_ref4 = userAggregationFns == null ? void 0 : userAggregationFns[column.aggregationFn]) != null ? _ref4 : aggregationFns[column.aggregationFn];
+          return isFunction(column.columnDef.aggregationFn) ? column.columnDef.aggregationFn : column.columnDef.aggregationFn === 'auto' ? column.getAutoAggregationFn() : (_ref4 = userAggregationFns == null ? void 0 : userAggregationFns[column.columnDef.aggregationFn]) != null ? _ref4 : aggregationFns[column.columnDef.aggregationFn];
         }
       };
     },
@@ -1533,6 +1535,12 @@
       };
     },
     createCell: (cell, column, row, instance) => {
+      const getRenderValue = () => {
+        var _cell$getValue;
+
+        return (_cell$getValue = cell.getValue()) != null ? _cell$getValue : instance.options.renderFallbackValue;
+      };
+
       return {
         getIsGrouped: () => column.getIsGrouped() && column.id === row.groupingColumnId,
         getIsPlaceholder: () => !cell.getIsGrouped() && column.getIsGrouped(),
@@ -1542,15 +1550,19 @@
           return !cell.getIsGrouped() && !cell.getIsPlaceholder() && ((_row$subRows = row.subRows) == null ? void 0 : _row$subRows.length) > 1;
         },
         renderAggregatedCell: () => {
-          var _column$columnDef$agg;
+          {
+            if (!column.columnDef.aggregatedCell) {
+              console.warn('A columnDef.aggregatedCell template is recommended for displaying aggregated values.');
+            }
+          }
 
-          const template = (_column$columnDef$agg = column.columnDef.aggregatedCell) != null ? _column$columnDef$agg : column.columnDef.cell;
+          const template = column.columnDef.aggregatedCell || column.columnDef.cell;
           return template ? instance._render(template, {
             instance,
             column,
             row,
             cell,
-            getValue: cell.getValue
+            getValue: getRenderValue
           }) : null;
         }
       };
@@ -2020,11 +2032,11 @@
           });
         },
         toggleAllPageRowsSelected: value => instance.setRowSelection(old => {
-          typeof value !== 'undefined' ? value : !instance.getIsAllPageRowsSelected();
+          const resolvedValue = typeof value !== 'undefined' ? value : !instance.getIsAllPageRowsSelected();
           const rowSelection = { ...old
           };
           instance.getRowModel().rows.forEach(row => {
-            mutateRowIsSelected(rowSelection, row.id, value, instance);
+            mutateRowIsSelected(rowSelection, row.id, resolvedValue, instance);
           });
           return rowSelection;
         }),
@@ -2179,7 +2191,7 @@
         },
         getIsSomePageRowsSelected: () => {
           const paginationFlatRows = instance.getPaginationRowModel().flatRows;
-          return instance.getIsAllPageRowsSelected() ? false : !!(paginationFlatRows != null && paginationFlatRows.length);
+          return instance.getIsAllPageRowsSelected() ? false : paginationFlatRows.some(d => d.getIsSelected() || d.getIsSomeSelected());
         },
         getToggleAllRowsSelectedHandler: () => {
           return e => {
@@ -2533,8 +2545,10 @@
           //   })
           //   return
           // }
+          // this needs to be outside of instance.setSorting to be in sync with rerender
+          const nextSortingOrder = column.getNextSortingOrder();
           instance.setSorting(old => {
-            var _ref2, _column$columnDef$sor, _instance$options$ena, _instance$options$ena2;
+            var _instance$options$ena, _instance$options$ena2;
 
             // Find any existing sorting for this column
             const existingSorting = old == null ? void 0 : old.find(d => d.id === column.id);
@@ -2559,30 +2573,29 @@
               } else {
                 sortAction = 'replace';
               }
-            }
+            } // Handle toggle states that will remove the sorting
 
-            const sortDescFirst = (_ref2 = (_column$columnDef$sor = column.columnDef.sortDescFirst) != null ? _column$columnDef$sor : instance.options.sortDescFirst) != null ? _ref2 : column.getAutoSortDir() === 'desc'; // Handle toggle states that will remove the sorting
 
             if (sortAction === 'toggle' && ( // Must be toggling
             (_instance$options$ena = instance.options.enableSortingRemoval) != null ? _instance$options$ena : true) && // If enableSortRemove, enable in general
             !hasDescDefined && ( // Must not be setting desc
-            multi ? (_instance$options$ena2 = instance.options.enableMultiRemove) != null ? _instance$options$ena2 : true : true) && ( // If multi, don't allow if enableMultiRemove
-            existingSorting != null && existingSorting.desc // Finally, detect if it should indeed be removed
-            ? !sortDescFirst : sortDescFirst)) {
+            multi ? (_instance$options$ena2 = instance.options.enableMultiRemove) != null ? _instance$options$ena2 : true : true) && // If multi, don't allow if enableMultiRemove
+            !nextSortingOrder // Finally, detect if it should indeed be removed
+            ) {
               sortAction = 'remove';
             }
 
             if (sortAction === 'replace') {
               newSorting = [{
                 id: column.id,
-                desc: hasDescDefined ? desc : !!sortDescFirst
+                desc: hasDescDefined ? desc : nextSortingOrder === 'desc'
               }];
             } else if (sortAction === 'add' && old != null && old.length) {
               var _instance$options$max;
 
               newSorting = [...old, {
                 id: column.id,
-                desc: hasDescDefined ? desc : !!sortDescFirst
+                desc: hasDescDefined ? desc : nextSortingOrder === 'desc'
               }]; // Take latest n columns
 
               newSorting.splice(0, newSorting.length - ((_instance$options$max = instance.options.maxMultiSortColCount) != null ? _instance$options$max : Number.MAX_SAFE_INTEGER));
@@ -2591,7 +2604,7 @@
               newSorting = old.map(d => {
                 if (d.id === column.id) {
                   return { ...d,
-                    desc: hasDescDefined ? desc : !(existingSorting != null && existingSorting.desc)
+                    desc: hasDescDefined ? desc : nextSortingOrder === 'desc'
                   };
                 }
 
@@ -2604,6 +2617,23 @@
             return newSorting;
           });
         },
+        getNextSortingOrder: () => {
+          var _ref2, _column$columnDef$sor;
+
+          const sortDescFirst = (_ref2 = (_column$columnDef$sor = column.columnDef.sortDescFirst) != null ? _column$columnDef$sor : instance.options.sortDescFirst) != null ? _ref2 : column.getAutoSortDir() === 'desc';
+          const firstSortDirection = sortDescFirst ? 'desc' : 'asc';
+          const isSorted = column.getIsSorted();
+
+          if (!isSorted) {
+            return firstSortDirection;
+          }
+
+          if (isSorted === firstSortDirection) {
+            return isSorted === 'desc' ? 'asc' : 'desc';
+          } else {
+            return false;
+          }
+        },
         getCanSort: () => {
           var _column$columnDef$ena, _instance$options$ena3;
 
@@ -2895,9 +2925,9 @@
           header: props => props.header.column.id,
           footer: props => props.header.column.id,
           cell: props => {
-            var _props$getValue$toStr, _props$getValue$toStr2, _props$getValue;
+            var _props$getValue$toStr, _props$getValue;
 
-            return (_props$getValue$toStr = (_props$getValue$toStr2 = (_props$getValue = props.getValue()).toString) == null ? void 0 : _props$getValue$toStr2.call(_props$getValue)) != null ? _props$getValue$toStr : null;
+            return (_props$getValue$toStr = (_props$getValue = props.getValue()) == null ? void 0 : _props$getValue.toString == null ? void 0 : _props$getValue.toString()) != null ? _props$getValue$toStr : null;
           },
           ...instance._features.reduce((obj, feature) => {
             return Object.assign(obj, feature.getDefaultColumnDef == null ? void 0 : feature.getDefaultColumnDef());
@@ -3051,6 +3081,12 @@
   }
 
   function createCell(instance, row, column, columnId) {
+    const getRenderValue = () => {
+      var _cell$getValue;
+
+      return (_cell$getValue = cell.getValue()) != null ? _cell$getValue : instance.options.renderFallbackValue;
+    };
+
     const cell = {
       id: row.id + "_" + column.id,
       row,
@@ -3062,7 +3098,7 @@
           column,
           row,
           cell: cell,
-          getValue: cell.getValue
+          getValue: getRenderValue
         }) : null;
       }
     };
@@ -3668,11 +3704,6 @@
               if (aggregateFn) {
                 row._groupingValuesCache[columnId] = aggregateFn(columnId, leafRows, groupedRows);
                 return row._groupingValuesCache[columnId];
-              } else if (column.aggregationFn) {
-                console.info({
-                  column
-                });
-                throw new Error("Table: Invalid column.aggregateType option for column listed above" );
               }
             }
           });
@@ -3796,20 +3827,34 @@
       const pageStart = pageSize * pageIndex;
       const pageEnd = pageStart + pageSize;
       rows = rows.slice(pageStart, pageEnd);
+      let paginatedRowModel;
 
       if (!instance.options.paginateExpandedRows) {
-        return expandRows({
+        paginatedRowModel = expandRows({
           rows,
           flatRows,
           rowsById
         });
+      } else {
+        paginatedRowModel = {
+          rows,
+          flatRows,
+          rowsById
+        };
       }
 
-      return {
-        rows,
-        flatRows,
-        rowsById
+      paginatedRowModel.flatRows = [];
+
+      const handleRow = row => {
+        paginatedRowModel.flatRows.push(row);
+
+        if (row.subRows.length) {
+          row.subRows.forEach(handleRow);
+        }
       };
+
+      paginatedRowModel.rows.forEach(handleRow);
+      return paginatedRowModel;
     }, {
       key: 'getPaginationRowModel',
       debug: () => {
@@ -3915,6 +3960,7 @@
       onStateChange: () => {},
       // noop
       render,
+      renderFallbackValue: null,
 
       mergeOptions(defaultOptions, options) {
         return mergeProxy(defaultOptions, options);