@react-fabric/data 1.0.0-beta.41 → 1.0.0-beta.42

package/dist/cjs/table/Table.js

@@ -159,7 +159,7 @@ var Table = function Table(_ref) {
           })]
         })]
       }), loading && /*#__PURE__*/jsxRuntime.jsx(core.Loading, {}), data.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
-        className: "area-content flex flex-col flex-nowrap",
+        className: "area-content flex flex-col flex-nowrap min-h-full",
         style: {
           height: totalSize()
         },

package/dist/cjs/table/useVirtualTable.js

@@ -31,13 +31,13 @@ var useVirtualTable = function useVirtualTable(data, options) {
         if (state.allChecked !== 0) {
           state.checked = [];
         } else if (options.keyProperty) {
-          state.checked = data.map(function (item) {
+          state.checked = state.data.map(function (item) {
             return item[options.keyProperty];
           });
         }
         (_options$onCheckChang2 = options.onCheckChanged) === null || _options$onCheckChang2 === void 0 || _options$onCheckChang2.call(options, state.checked);
       }
-      var checkList = data.filter(function (hit) {
+      var checkList = state.data.filter(function (hit) {
         return state.checked.includes(hit[options.keyProperty]);
       });
       if (action.type === "groupExpand") {
@@ -52,9 +52,10 @@ var useVirtualTable = function useVirtualTable(data, options) {
           }).flat(2).filter(Boolean);
         }
       }
-      if (action.type === "grouped") {
+      if (action.type === "reset") {
+        state.data = action.data;
         if (action.key) {
-          state.grouped = utilities.groupBy(data, action.key);
+          state.grouped = utilities.groupBy(state.data, action.key);
           state.groups = Object.keys(state.grouped).sort(utilities.compareValues("asc")).map(function (group) {
             return {
               __GROUP__: true,
@@ -68,14 +69,15 @@ var useVirtualTable = function useVirtualTable(data, options) {
             return [group].concat(_toConsumableArray(state.grouped[group.key]));
           }).flat();
         } else {
-          state.items = data;
+          state.items = state.data;
         }
       }
       return _objectSpread(_objectSpread({}, state), {}, {
-        allChecked: checkList.length === data.length ? 1 : state.checked.length ? 2 : 0
+        allChecked: checkList.length === state.data.length ? 1 : state.checked.length ? 2 : 0
       });
     }, {
-      items: data,
+      data: data,
+      items: [],
       grouped: {},
       groups: [],
       checked: [],
@@ -123,10 +125,11 @@ var useVirtualTable = function useVirtualTable(data, options) {
   }, [state.items]);
   react.useEffect(function () {
     dispatch({
-      type: "grouped",
-      key: options.groupProperty
+      type: "reset",
+      key: options.groupProperty,
+      data: data
     });
-  }, [options.groupProperty]);
+  }, [data, options.groupProperty]);
   react.useEffect(function () {
     var _options$checked;
     dispatch({

package/dist/esm/table/Table.js

@@ -159,7 +159,7 @@ var Table = function Table(_ref) {
           })]
         })]
       }), loading && /*#__PURE__*/jsx(Loading, {}), data.length > 0 && /*#__PURE__*/jsxs("div", {
-        className: "area-content flex flex-col flex-nowrap",
+        className: "area-content flex flex-col flex-nowrap min-h-full",
         style: {
           height: totalSize()
         },

package/dist/esm/table/useVirtualTable.js

@@ -31,13 +31,13 @@ var useVirtualTable = function useVirtualTable(data, options) {
         if (state.allChecked !== 0) {
           state.checked = [];
         } else if (options.keyProperty) {
-          state.checked = data.map(function (item) {
+          state.checked = state.data.map(function (item) {
             return item[options.keyProperty];
           });
         }
         (_options$onCheckChang2 = options.onCheckChanged) === null || _options$onCheckChang2 === void 0 || _options$onCheckChang2.call(options, state.checked);
       }
-      var checkList = data.filter(function (hit) {
+      var checkList = state.data.filter(function (hit) {
         return state.checked.includes(hit[options.keyProperty]);
       });
       if (action.type === "groupExpand") {
@@ -52,9 +52,10 @@ var useVirtualTable = function useVirtualTable(data, options) {
           }).flat(2).filter(Boolean);
         }
       }
-      if (action.type === "grouped") {
+      if (action.type === "reset") {
+        state.data = action.data;
         if (action.key) {
-          state.grouped = groupBy(data, action.key);
+          state.grouped = groupBy(state.data, action.key);
           state.groups = Object.keys(state.grouped).sort(compareValues("asc")).map(function (group) {
             return {
               __GROUP__: true,
@@ -68,14 +69,15 @@ var useVirtualTable = function useVirtualTable(data, options) {
             return [group].concat(_toConsumableArray(state.grouped[group.key]));
           }).flat();
         } else {
-          state.items = data;
+          state.items = state.data;
         }
       }
       return _objectSpread(_objectSpread({}, state), {}, {
-        allChecked: checkList.length === data.length ? 1 : state.checked.length ? 2 : 0
+        allChecked: checkList.length === state.data.length ? 1 : state.checked.length ? 2 : 0
       });
     }, {
-      items: data,
+      data: data,
+      items: [],
       grouped: {},
       groups: [],
       checked: [],
@@ -123,10 +125,11 @@ var useVirtualTable = function useVirtualTable(data, options) {
   }, [state.items]);
   useEffect(function () {
     dispatch({
-      type: "grouped",
-      key: options.groupProperty
+      type: "reset",
+      key: options.groupProperty,
+      data: data
     });
-  }, [options.groupProperty]);
+  }, [data, options.groupProperty]);
   useEffect(function () {
     var _options$checked;
     dispatch({

package/dist/types/table/useVirtualTable.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 interface DataState<T = KeyValue> {
+    data: T[];
     items: T[];
     grouped: KeyValue<T[]>;
     groups: AnyObject[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-fabric/data",
-  "version": "1.0.0-beta.41",
+  "version": "1.0.0-beta.42",
   "description": "RUF: Data package",
   "author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
   "license": "MIT",
@@ -35,10 +35,10 @@
     "watch": "npm-run-all -p watch:rollup watch:dts"
   },
   "dependencies": {
-    "@react-fabric/core": "^1.0.0-beta.41",
-    "@react-fabric/date": "^1.0.0-beta.41",
-    "@react-fabric/form": "^1.0.0-beta.41",
-    "@react-fabric/utilities": "^1.0.0-beta.41",
+    "@react-fabric/core": "^1.0.0-beta.42",
+    "@react-fabric/date": "^1.0.0-beta.42",
+    "@react-fabric/form": "^1.0.0-beta.42",
+    "@react-fabric/utilities": "^1.0.0-beta.42",
     "@tanstack/react-virtual": "^3.8.6",
     "classnames": "^2.5.1",
     "color": "^4.2.3",
@@ -54,5 +54,5 @@
     "node": ">=18.12.0",
     "npm": ">=8.19.0"
   },
-  "gitHead": "bc737416d3c6a217a6b8c47291c3975a22722d80"
+  "gitHead": "61c9612bb2c7bc9a807f46922881432748c9e7a3"
 }

package/src/table/Table.tsx

@@ -198,7 +198,7 @@ export const Table = <T extends KeyValue = KeyValue>({
         {loading && <Loading />}
         {data.length > 0 && (
           <div
-            className="area-content flex flex-col flex-nowrap"
+            className="area-content flex flex-col flex-nowrap min-h-full"
             style={{ height: totalSize() }}
             ref={refBody}
           >

package/src/table/useVirtualTable.ts

@@ -37,6 +37,7 @@ import {
 } from "react";
 
 interface DataState<T = KeyValue> {
+  data: T[];
   items: T[];
   grouped: KeyValue<T[]>;
   groups: AnyObject[];
@@ -48,7 +49,7 @@ interface DataState<T = KeyValue> {
 type DataAction =
   | { type: "updateState"; checked: AnyObject[] }
   | { type: "groupExpand"; key: AnyObject }
-  | { type: "grouped"; key: AnyObject }
+  | { type: "reset"; key: AnyObject; data: AnyObject[] }
   | { type: "expand"; key: AnyObject }
   | { type: "check"; key: AnyObject }
   | { type: "checkall" };
@@ -85,11 +86,11 @@ export const useVirtualTable = <T extends KeyValue = KeyValue>(
         if (state.allChecked !== 0) {
           state.checked = [];
         } else if (options.keyProperty) {
-          state.checked = data.map((item) => item[options.keyProperty]);
+          state.checked = state.data.map((item) => item[options.keyProperty]);
         }
         options.onCheckChanged?.(state.checked);
       }
-      const checkList = data.filter((hit) =>
+      const checkList = state.data.filter((hit) =>
         state.checked.includes(hit[options.keyProperty]),
       );
       if (action.type === "groupExpand") {
@@ -106,9 +107,10 @@ export const useVirtualTable = <T extends KeyValue = KeyValue>(
             .filter(Boolean) as any;
         }
       }
-      if (action.type === "grouped") {
+      if (action.type === "reset") {
+        state.data = action.data;
         if (action.key) {
-          state.grouped = groupBy<T>(data, action.key);
+          state.grouped = groupBy<T>(state.data, action.key);
           state.groups = Object.keys(state.grouped)
             .sort(compareValues("asc"))
             .map((group) => ({
@@ -122,17 +124,22 @@ export const useVirtualTable = <T extends KeyValue = KeyValue>(
             .map((group) => [group, ...state.grouped[group.key]])
             .flat() as any;
         } else {
-          state.items = data;
+          state.items = state.data;
         }
       }
       return {
         ...state,
         allChecked:
-          checkList.length === data.length ? 1 : state.checked.length ? 2 : 0,
+          checkList.length === state.data.length
+            ? 1
+            : state.checked.length
+              ? 2
+              : 0,
       } as DataState<T>;
     },
     {
-      items: data,
+      data,
+      items: [],
       grouped: {},
       groups: [],
       checked: [],
@@ -188,8 +195,8 @@ export const useVirtualTable = <T extends KeyValue = KeyValue>(
   );
 
   useEffect(() => {
-    dispatch({ type: "grouped", key: options.groupProperty });
-  }, [options.groupProperty]);
+    dispatch({ type: "reset", key: options.groupProperty, data });
+  }, [data, options.groupProperty]);
 
   useEffect(() => {
     dispatch({ type: "updateState", checked: options.checked ?? [] });