@trackunit/react-table 2.1.26 → 2.1.31

package/index.cjs.js

@@ -510,14 +510,14 @@ const ColumnFilter = ({ columns, setColumnOrder, defaultColumnOrder = [], column
 };
 const ColumnFiltersDragAndDrop = ({ columns, setColumnOrder, onUserEvent, isSortDisabled, visibleColumnsCount, }) => {
     const [localColumns, setLocalColumns] = react.useState(columns);
-    const latestColumnsRef = react.useRef(columns);
-    latestColumnsRef.current = columns;
-    const columnIdsSignature = react.useMemo(() => {
-        return columns.map(column => column.id).join(",");
-    }, [columns]);
-    react.useEffect(() => {
-        setLocalColumns(latestColumnsRef.current);
-    }, [columnIdsSignature]);
+    const columnIdsSignature = columns.map(column => column.id).join(",");
+    // Re-sync only when the set of column ids changes, so in-progress drag
+    // reordering isn't clobbered on every `columns` identity change.
+    const [prevSignature, setPrevSignature] = react.useState(columnIdsSignature);
+    if (columnIdsSignature !== prevSignature) {
+        setPrevSignature(columnIdsSignature);
+        setLocalColumns(columns);
+    }
     const onColumDrop = react.useCallback(() => {
         const newColumnOrder = localColumns.map(column => column.id);
         setColumnOrder(newColumnOrder);
@@ -1285,7 +1285,7 @@ const Table = ({ rowHeight = 50, loading = false, hideFooter = false, style, ...
                                                 } },
                                                 isCellDropTarget(cell.column.id) && renderDropIndicator(cell.column.id),
                                                 jsxRuntime.jsx("div", { className: "grid h-full items-center p-0", children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) })));
-                                        }) }, `${row.id}-${index}`));
+                                        }) }, row.id));
                                 }
                             }) })) : (jsxRuntime.jsx("tbody", { className: cvaTBody({
                                 emptyState: !loading && (props.noDataMessage === undefined || props.noDataMessage === ""),

package/index.esm.js

@@ -509,14 +509,14 @@ const ColumnFilter = ({ columns, setColumnOrder, defaultColumnOrder = [], column
 };
 const ColumnFiltersDragAndDrop = ({ columns, setColumnOrder, onUserEvent, isSortDisabled, visibleColumnsCount, }) => {
     const [localColumns, setLocalColumns] = useState(columns);
-    const latestColumnsRef = useRef(columns);
-    latestColumnsRef.current = columns;
-    const columnIdsSignature = useMemo(() => {
-        return columns.map(column => column.id).join(",");
-    }, [columns]);
-    useEffect(() => {
-        setLocalColumns(latestColumnsRef.current);
-    }, [columnIdsSignature]);
+    const columnIdsSignature = columns.map(column => column.id).join(",");
+    // Re-sync only when the set of column ids changes, so in-progress drag
+    // reordering isn't clobbered on every `columns` identity change.
+    const [prevSignature, setPrevSignature] = useState(columnIdsSignature);
+    if (columnIdsSignature !== prevSignature) {
+        setPrevSignature(columnIdsSignature);
+        setLocalColumns(columns);
+    }
     const onColumDrop = useCallback(() => {
         const newColumnOrder = localColumns.map(column => column.id);
         setColumnOrder(newColumnOrder);
@@ -1284,7 +1284,7 @@ const Table = ({ rowHeight = 50, loading = false, hideFooter = false, style, ...
                                                 } },
                                                 isCellDropTarget(cell.column.id) && renderDropIndicator(cell.column.id),
                                                 jsx("div", { className: "grid h-full items-center p-0", children: flexRender(cell.column.columnDef.cell, cell.getContext()) })));
-                                        }) }, `${row.id}-${index}`));
+                                        }) }, row.id));
                                 }
                             }) })) : (jsx("tbody", { className: cvaTBody({
                                 emptyState: !loading && (props.noDataMessage === undefined || props.noDataMessage === ""),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-table",
-  "version": "2.1.26",
+  "version": "2.1.31",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -11,14 +11,14 @@
     "react-dnd": "16.0.1",
     "react-dnd-html5-backend": "16.0.1",
     "tailwind-merge": "^2.0.0",
-    "@trackunit/react-components": "2.1.24",
-    "@trackunit/shared-utils": "1.15.30",
-    "@trackunit/css-class-variance-utilities": "1.13.30",
-    "@trackunit/ui-icons": "1.13.31",
-    "@trackunit/react-table-base-components": "2.1.26",
-    "@trackunit/react-form-components": "2.1.25",
-    "@trackunit/i18n-library-translation": "2.0.26",
-    "@trackunit/iris-app-runtime-core-api": "1.16.33"
+    "@trackunit/react-components": "2.1.29",
+    "@trackunit/shared-utils": "1.15.33",
+    "@trackunit/css-class-variance-utilities": "1.13.33",
+    "@trackunit/ui-icons": "1.13.35",
+    "@trackunit/react-table-base-components": "2.1.31",
+    "@trackunit/react-form-components": "2.1.30",
+    "@trackunit/i18n-library-translation": "2.0.30",
+    "@trackunit/iris-app-runtime-core-api": "1.16.37"
   },
   "peerDependencies": {
     "@tanstack/react-router": "^1.114.29",