@etsoo/react 1.8.39 → 1.8.41

package/lib/cjs/components/ScrollerGrid.js

@@ -218,11 +218,6 @@ const ScrollerGrid = (props) => {
         }
     };
     react_1.default.useImperativeHandle(mRef, () => instance, [rows]);
-    react_1.default.useEffect(() => {
-        return () => {
-            refs.current.isMounted = false;
-        };
-    }, []);
     // Force update to work with the new width and rowHeight
     react_1.default.useEffect(() => {
         ref.current?.resetAfterIndices({
@@ -235,14 +230,21 @@ const ScrollerGrid = (props) => {
     const rowLength = rows.length;
     // Row count
     const rowCount = refs.current.hasNextPage ? rowLength + 1 : rowLength;
-    // Auto load data when current page is 0
-    if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
-        const initItems = onInitLoad == null ? undefined : onInitLoad(ref.current);
-        if (initItems)
-            reset(initItems[1], initItems[0]);
-        else
-            loadDataLocal();
-    }
+    react_1.default.useEffect(() => {
+        // Auto load data when current page is 0
+        if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
+            const initItems = onInitLoad == null ? undefined : onInitLoad(ref.current);
+            if (initItems)
+                reset(initItems[1], initItems[0]);
+            else
+                loadDataLocal();
+        }
+    }, [onInitLoad, loadDataLocal]);
+    react_1.default.useEffect(() => {
+        return () => {
+            refs.current.isMounted = false;
+        };
+    }, []);
     // Layout
     return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [headerRenderer && headerRenderer(refs.current), (0, jsx_runtime_1.jsx)(react_window_1.VariableSizeGrid, { itemKey: ({ columnIndex, rowIndex, data }) => {
                     if (data == null)

package/lib/cjs/components/ScrollerList.js

@@ -168,13 +168,6 @@ const ScrollerList = (props) => {
             }
         };
     }, []);
-    // When layout ready
-    react_1.default.useEffect(() => {
-        // Return clear function
-        return () => {
-            stateRefs.current.isMounted = false;
-        };
-    }, []);
     // Row count
     const rowCount = rows.length;
     // Local items renderer callback
@@ -190,15 +183,24 @@ const ScrollerList = (props) => {
     };
     // Item count
     const itemCount = stateRefs.current.hasNextPage ? rowCount + 1 : rowCount;
-    // Auto load data when current page is 0
-    if (stateRefs.current.queryPaging?.currentPage === 0 &&
-        stateRefs.current.autoLoad) {
-        const initItems = onInitLoad == null ? undefined : onInitLoad(listRef.current);
-        if (initItems)
-            reset(initItems[1], initItems[0]);
-        else
-            loadDataLocal();
-    }
+    react_1.default.useEffect(() => {
+        // Auto load data when current page is 0
+        if (stateRefs.current.queryPaging?.currentPage === 0 &&
+            stateRefs.current.autoLoad) {
+            const initItems = onInitLoad == null ? undefined : onInitLoad(listRef.current);
+            if (initItems)
+                reset(initItems[1], initItems[0]);
+            else
+                loadDataLocal();
+        }
+    }, [onInitLoad, loadDataLocal]);
+    // When layout ready
+    react_1.default.useEffect(() => {
+        // Return clear function
+        return () => {
+            stateRefs.current.isMounted = false;
+        };
+    }, []);
     // Layout
     return typeof itemSize === "function" ? ((0, jsx_runtime_1.jsx)(react_window_1.VariableSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => shared_1.DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal })) : ((0, jsx_runtime_1.jsx)(react_window_1.FixedSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => shared_1.DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal }));
 };

package/lib/mjs/components/ScrollerGrid.js

@@ -212,11 +212,6 @@ export const ScrollerGrid = (props) => {
         }
     };
     React.useImperativeHandle(mRef, () => instance, [rows]);
-    React.useEffect(() => {
-        return () => {
-            refs.current.isMounted = false;
-        };
-    }, []);
     // Force update to work with the new width and rowHeight
     React.useEffect(() => {
         ref.current?.resetAfterIndices({
@@ -229,14 +224,21 @@ export const ScrollerGrid = (props) => {
     const rowLength = rows.length;
     // Row count
     const rowCount = refs.current.hasNextPage ? rowLength + 1 : rowLength;
-    // Auto load data when current page is 0
-    if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
-        const initItems = onInitLoad == null ? undefined : onInitLoad(ref.current);
-        if (initItems)
-            reset(initItems[1], initItems[0]);
-        else
-            loadDataLocal();
-    }
+    React.useEffect(() => {
+        // Auto load data when current page is 0
+        if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
+            const initItems = onInitLoad == null ? undefined : onInitLoad(ref.current);
+            if (initItems)
+                reset(initItems[1], initItems[0]);
+            else
+                loadDataLocal();
+        }
+    }, [onInitLoad, loadDataLocal]);
+    React.useEffect(() => {
+        return () => {
+            refs.current.isMounted = false;
+        };
+    }, []);
     // Layout
     return (_jsxs(React.Fragment, { children: [headerRenderer && headerRenderer(refs.current), _jsx(VariableSizeGrid, { itemKey: ({ columnIndex, rowIndex, data }) => {
                     if (data == null)

package/lib/mjs/components/ScrollerList.js

@@ -162,13 +162,6 @@ export const ScrollerList = (props) => {
             }
         };
     }, []);
-    // When layout ready
-    React.useEffect(() => {
-        // Return clear function
-        return () => {
-            stateRefs.current.isMounted = false;
-        };
-    }, []);
     // Row count
     const rowCount = rows.length;
     // Local items renderer callback
@@ -184,15 +177,24 @@ export const ScrollerList = (props) => {
     };
     // Item count
     const itemCount = stateRefs.current.hasNextPage ? rowCount + 1 : rowCount;
-    // Auto load data when current page is 0
-    if (stateRefs.current.queryPaging?.currentPage === 0 &&
-        stateRefs.current.autoLoad) {
-        const initItems = onInitLoad == null ? undefined : onInitLoad(listRef.current);
-        if (initItems)
-            reset(initItems[1], initItems[0]);
-        else
-            loadDataLocal();
-    }
+    React.useEffect(() => {
+        // Auto load data when current page is 0
+        if (stateRefs.current.queryPaging?.currentPage === 0 &&
+            stateRefs.current.autoLoad) {
+            const initItems = onInitLoad == null ? undefined : onInitLoad(listRef.current);
+            if (initItems)
+                reset(initItems[1], initItems[0]);
+            else
+                loadDataLocal();
+        }
+    }, [onInitLoad, loadDataLocal]);
+    // When layout ready
+    React.useEffect(() => {
+        // Return clear function
+        return () => {
+            stateRefs.current.isMounted = false;
+        };
+    }, []);
     // Layout
     return typeof itemSize === "function" ? (_jsx(VariableSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal })) : (_jsx(FixedSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal }));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/react",
-  "version": "1.8.39",
+  "version": "1.8.41",
   "description": "TypeScript ReactJs UI Independent Framework",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",
@@ -35,17 +35,17 @@
   },
   "homepage": "https://github.com/ETSOO/AppReact#readme",
   "dependencies": {
-    "@dnd-kit/core": "^6.3.0",
+    "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@emotion/css": "^11.13.5",
-    "@emotion/react": "^11.13.5",
-    "@emotion/styled": "^11.13.5",
-    "@etsoo/appscript": "^1.6.22",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
+    "@etsoo/appscript": "^1.6.32",
     "@etsoo/notificationbase": "^1.1.60",
-    "@etsoo/shared": "^1.2.68",
+    "@etsoo/shared": "^1.2.70",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-router-dom": "^7.5.0",
+    "react-router-dom": "^7.5.3",
     "react-window": "^1.8.11"
   },
   "overrides": {
@@ -54,19 +54,19 @@
     "@emotion/react": "$@emotion/react"
   },
   "devDependencies": {
-    "@babel/cli": "^7.27.0",
-    "@babel/core": "^7.26.10",
-    "@babel/plugin-transform-runtime": "^7.26.10",
-    "@babel/preset-env": "^7.26.9",
-    "@babel/runtime-corejs3": "^7.27.0",
+    "@babel/cli": "^7.27.1",
+    "@babel/core": "^7.27.1",
+    "@babel/plugin-transform-runtime": "^7.27.1",
+    "@babel/preset-env": "^7.27.1",
+    "@babel/runtime-corejs3": "^7.27.1",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@types/react": "^18.3.20",
-    "@types/react-dom": "^18.3.6",
+    "@types/react-dom": "^18.3.7",
     "@types/react-window": "^1.8.8",
-    "@vitejs/plugin-react": "^4.3.4",
+    "@vitejs/plugin-react": "^4.4.1",
     "jsdom": "^26.1.0",
     "typescript": "^5.8.3",
-    "vitest": "^3.1.1"
+    "vitest": "^3.1.2"
   }
 }

package/src/components/ScrollerGrid.tsx

@@ -419,12 +419,6 @@ export const ScrollerGrid = <T extends object>(props: ScrollerGridProps<T>) => {
 
   React.useImperativeHandle(mRef, () => instance, [rows]);
 
-  React.useEffect(() => {
-    return () => {
-      refs.current.isMounted = false;
-    };
-  }, []);
-
   // Force update to work with the new width and rowHeight
   React.useEffect(() => {
     ref.current?.resetAfterIndices({
@@ -440,12 +434,21 @@ export const ScrollerGrid = <T extends object>(props: ScrollerGridProps<T>) => {
   // Row count
   const rowCount = refs.current.hasNextPage ? rowLength + 1 : rowLength;
 
-  // Auto load data when current page is 0
-  if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
-    const initItems = onInitLoad == null ? undefined : onInitLoad(ref.current);
-    if (initItems) reset(initItems[1], initItems[0]);
-    else loadDataLocal();
-  }
+  React.useEffect(() => {
+    // Auto load data when current page is 0
+    if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
+      const initItems =
+        onInitLoad == null ? undefined : onInitLoad(ref.current);
+      if (initItems) reset(initItems[1], initItems[0]);
+      else loadDataLocal();
+    }
+  }, [onInitLoad, loadDataLocal]);
+
+  React.useEffect(() => {
+    return () => {
+      refs.current.isMounted = false;
+    };
+  }, []);
 
   // Layout
   return (

package/src/components/ScrollerList.tsx

@@ -297,14 +297,6 @@ export const ScrollerList = <T extends object>(props: ScrollerListProps<T>) => {
     []
   );
 
-  // When layout ready
-  React.useEffect(() => {
-    // Return clear function
-    return () => {
-      stateRefs.current.isMounted = false;
-    };
-  }, []);
-
   // Row count
   const rowCount = rows.length;
 
@@ -324,16 +316,26 @@ export const ScrollerList = <T extends object>(props: ScrollerListProps<T>) => {
   // Item count
   const itemCount = stateRefs.current.hasNextPage ? rowCount + 1 : rowCount;
 
-  // Auto load data when current page is 0
-  if (
-    stateRefs.current.queryPaging?.currentPage === 0 &&
-    stateRefs.current.autoLoad
-  ) {
-    const initItems =
-      onInitLoad == null ? undefined : onInitLoad(listRef.current);
-    if (initItems) reset(initItems[1], initItems[0]);
-    else loadDataLocal();
-  }
+  React.useEffect(() => {
+    // Auto load data when current page is 0
+    if (
+      stateRefs.current.queryPaging?.currentPage === 0 &&
+      stateRefs.current.autoLoad
+    ) {
+      const initItems =
+        onInitLoad == null ? undefined : onInitLoad(listRef.current);
+      if (initItems) reset(initItems[1], initItems[0]);
+      else loadDataLocal();
+    }
+  }, [onInitLoad, loadDataLocal]);
+
+  // When layout ready
+  React.useEffect(() => {
+    // Return clear function
+    return () => {
+      stateRefs.current.isMounted = false;
+    };
+  }, []);
 
   // Layout
   return typeof itemSize === "function" ? (