@dmsi/wedgekit-react 0.0.643 → 0.0.644

package/dist/components/DataGrid/TableBody/TableBodyRow.cjs

@@ -597,11 +597,24 @@ function formatDate(date) {
 
 // src/utils/mergeObjectArrays.ts
 function mergeObjectArrays(arr1, arr2) {
-  const maxLength = Math.max(arr1.length, arr2.length);
-  return Array.from(
-    { length: maxLength },
-    (_, i) => __spreadValues(__spreadValues({}, arr1[i] || {}), arr2[i] || {})
-  );
+  const arr2Map = /* @__PURE__ */ new Map();
+  for (const item of arr2) {
+    const id = item.id;
+    if (id !== void 0) {
+      arr2Map.set(id, item);
+    }
+  }
+  return arr1.map((item1) => {
+    const id = item1.id;
+    if (id !== void 0 && arr2Map.has(id)) {
+      const item2 = arr2Map.get(id);
+      const meta1 = item1.meta;
+      const meta2 = item2.meta;
+      const mergedMeta = meta1 && meta2 && typeof meta1 === "object" && typeof meta2 === "object" ? __spreadValues(__spreadValues({}, meta1), meta2) : meta2 != null ? meta2 : meta1;
+      return __spreadProps(__spreadValues(__spreadValues({}, item1), item2), { meta: mergedMeta });
+    }
+    return item1;
+  });
 }
 
 // src/utils/index.ts
@@ -637,52 +650,58 @@ var getLocalStorageKeyWithPrefix = (key) => `${LocalStoragePrefix}__${key}`;
 function useTableLayout(initialColumns, key, autosync = true) {
   const [columns, setColumns] = (0, import_react5.useState)(initialColumns);
   const [isReady, setIsReady] = (0, import_react5.useState)(false);
-  const renderCountRef = (0, import_react5.useRef)(0);
+  const isReadyRef = (0, import_react5.useRef)(false);
+  const keyRef = (0, import_react5.useRef)(key);
+  (0, import_react5.useEffect)(() => {
+    isReadyRef.current = isReady;
+    keyRef.current = key;
+  }, [isReady, key]);
   const handleSaveLayout = (0, import_react5.useCallback)(
     (setter, _internal) => {
-      if (!isReady && !_internal || !key) return;
+      if (!isReadyRef.current && !_internal || !keyRef.current) return;
       setColumns((prevColumns) => {
         const newColumns = typeof setter === "function" ? setter(prevColumns) : setter;
-        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal)
+        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal) {
           return prevColumns;
+        }
         localStorage.setItem(
-          getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+          getLocalStorageKeyWithPrefix(`${keyRef.current}-tableLayout`),
           JSON.stringify(newColumns)
         );
         return newColumns;
       });
     },
-    [isReady, key]
+    []
   );
   (0, import_react5.useEffect)(() => {
     if (!autosync) return;
-    if (!key) return setIsReady(true);
-    if (renderCountRef.current > 1) {
-      throw new Error(
-        `useTableLayout should only be called once per component render cycle.
-        ${renderCountRef.current} Renders detected.
-        Check dependency stability`
-      );
+    if (!key) {
+      setIsReady(true);
+      return;
     }
-    renderCountRef.current += 1;
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)
     );
     if (savedLayout) {
-      handleSaveLayout(
+      setColumns(
         mergeObjectArrays(
           initialColumns,
           JSON.parse(savedLayout)
-        ),
-        true
+        )
+      );
+    } else {
+      localStorage.setItem(
+        getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+        JSON.stringify(initialColumns)
       );
+      setColumns((prev) => {
+        if (JSON.stringify(initialColumns) === JSON.stringify(prev))
+          return prev;
+        return initialColumns;
+      });
     }
-    if (!savedLayout) handleSaveLayout(initialColumns, true);
     setIsReady(true);
-    return () => {
-      renderCountRef.current = 0;
-    };
-  }, [handleSaveLayout, initialColumns, key, autosync]);
+  }, [initialColumns, key, autosync]);
   const getSavedLayout = (0, import_react5.useCallback)(() => {
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)

package/dist/components/DataGrid/TableBody/TableBodyRow.js

@@ -1,21 +1,21 @@
 import {
   TableBodyRow
-} from "../../../chunk-SJ3SULQB.js";
-import "../../../chunk-XX5GVIPZ.js";
+} from "../../../chunk-J2QD64F2.js";
+import "../../../chunk-XVWCVBVF.js";
 import "../../../chunk-M7INAUAJ.js";
-import "../../../chunk-ARWHCWG7.js";
-import "../../../chunk-MQB6BSRX.js";
+import "../../../chunk-XT4BQXSX.js";
+import "../../../chunk-OXOMO76M.js";
 import "../../../chunk-YCDDBSVU.js";
 import "../../../chunk-3X3Y4TMS.js";
 import "../../../chunk-BQNPOGD5.js";
 import "../../../chunk-Y5GD2FJA.js";
 import "../../../chunk-MBZ55T2D.js";
 import "../../../chunk-2IKT6IHB.js";
-import "../../../chunk-FIOXWZWU.js";
-import "../../../chunk-LGX34HML.js";
+import "../../../chunk-ECYXZZWC.js";
+import "../../../chunk-Q4AANHJY.js";
 import "../../../chunk-5IFPG6TS.js";
+import "../../../chunk-OZEKRO4L.js";
 import "../../../chunk-AJ5M6MVX.js";
-import "../../../chunk-UB3GEENN.js";
 import "../../../chunk-AT4AWD6B.js";
 import "../../../chunk-EWGHVZL5.js";
 import "../../../chunk-UF5XGCSF.js";
@@ -24,7 +24,7 @@ import "../../../chunk-L3BXRDLP.js";
 import "../../../chunk-34VEVX5H.js";
 import "../../../chunk-LB7UT6F3.js";
 import "../../../chunk-AS57Y2D3.js";
-import "../../../chunk-V7GPM6Z3.js";
+import "../../../chunk-Z3Q7PLVD.js";
 import "../../../chunk-4RJKB7LC.js";
 import "../../../chunk-UUKHQUSF.js";
 import "../../../chunk-WVVEOCEH.js";
@@ -35,19 +35,19 @@ import "../../../chunk-UAMI54FE.js";
 import "../../../chunk-SJZNVG4N.js";
 import "../../../chunk-75USUR3I.js";
 import "../../../chunk-BWPNXY7T.js";
-import "../../../chunk-RQMOWYB7.js";
-import "../../../chunk-5JHKFK73.js";
-import "../../../chunk-IATOG76G.js";
-import "../../../chunk-PS7MBNUT.js";
+import "../../../chunk-VAARSN7U.js";
+import "../../../chunk-V2GSI3ZX.js";
+import "../../../chunk-NUFBAJ6L.js";
+import "../../../chunk-YXZRGZ2I.js";
 import "../../../chunk-FHXCCVOG.js";
 import "../../../chunk-7T5RGDCN.js";
 import "../../../chunk-HXGJVYGQ.js";
 import "../../../chunk-WVUIIBRR.js";
 import "../../../chunk-M7WHWZ2J.js";
-import "../../../chunk-3R3AY5MT.js";
-import "../../../chunk-YR4ZO2XL.js";
+import "../../../chunk-LN3HVXH5.js";
+import "../../../chunk-K22B4L3G.js";
 import "../../../chunk-VXWSAIB5.js";
-import "../../../chunk-QJZ3XHNH.js";
+import "../../../chunk-HCHKYUNQ.js";
 import "../../../chunk-5UH6QUFB.js";
 import "../../../chunk-XJF4S3RB.js";
 import "../../../chunk-ZCJWOHFN.js";

package/dist/components/DataGrid/TableBody/index.cjs

@@ -595,11 +595,24 @@ function formatDate(date) {
 
 // src/utils/mergeObjectArrays.ts
 function mergeObjectArrays(arr1, arr2) {
-  const maxLength = Math.max(arr1.length, arr2.length);
-  return Array.from(
-    { length: maxLength },
-    (_, i) => __spreadValues(__spreadValues({}, arr1[i] || {}), arr2[i] || {})
-  );
+  const arr2Map = /* @__PURE__ */ new Map();
+  for (const item of arr2) {
+    const id = item.id;
+    if (id !== void 0) {
+      arr2Map.set(id, item);
+    }
+  }
+  return arr1.map((item1) => {
+    const id = item1.id;
+    if (id !== void 0 && arr2Map.has(id)) {
+      const item2 = arr2Map.get(id);
+      const meta1 = item1.meta;
+      const meta2 = item2.meta;
+      const mergedMeta = meta1 && meta2 && typeof meta1 === "object" && typeof meta2 === "object" ? __spreadValues(__spreadValues({}, meta1), meta2) : meta2 != null ? meta2 : meta1;
+      return __spreadProps(__spreadValues(__spreadValues({}, item1), item2), { meta: mergedMeta });
+    }
+    return item1;
+  });
 }
 
 // src/utils/index.ts
@@ -635,52 +648,58 @@ var getLocalStorageKeyWithPrefix = (key) => `${LocalStoragePrefix}__${key}`;
 function useTableLayout(initialColumns, key, autosync = true) {
   const [columns, setColumns] = (0, import_react5.useState)(initialColumns);
   const [isReady, setIsReady] = (0, import_react5.useState)(false);
-  const renderCountRef = (0, import_react5.useRef)(0);
+  const isReadyRef = (0, import_react5.useRef)(false);
+  const keyRef = (0, import_react5.useRef)(key);
+  (0, import_react5.useEffect)(() => {
+    isReadyRef.current = isReady;
+    keyRef.current = key;
+  }, [isReady, key]);
   const handleSaveLayout = (0, import_react5.useCallback)(
     (setter, _internal) => {
-      if (!isReady && !_internal || !key) return;
+      if (!isReadyRef.current && !_internal || !keyRef.current) return;
       setColumns((prevColumns) => {
         const newColumns = typeof setter === "function" ? setter(prevColumns) : setter;
-        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal)
+        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal) {
           return prevColumns;
+        }
         localStorage.setItem(
-          getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+          getLocalStorageKeyWithPrefix(`${keyRef.current}-tableLayout`),
           JSON.stringify(newColumns)
         );
         return newColumns;
       });
     },
-    [isReady, key]
+    []
   );
   (0, import_react5.useEffect)(() => {
     if (!autosync) return;
-    if (!key) return setIsReady(true);
-    if (renderCountRef.current > 1) {
-      throw new Error(
-        `useTableLayout should only be called once per component render cycle.
-        ${renderCountRef.current} Renders detected.
-        Check dependency stability`
-      );
+    if (!key) {
+      setIsReady(true);
+      return;
     }
-    renderCountRef.current += 1;
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)
     );
     if (savedLayout) {
-      handleSaveLayout(
+      setColumns(
         mergeObjectArrays(
           initialColumns,
           JSON.parse(savedLayout)
-        ),
-        true
+        )
+      );
+    } else {
+      localStorage.setItem(
+        getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+        JSON.stringify(initialColumns)
       );
+      setColumns((prev) => {
+        if (JSON.stringify(initialColumns) === JSON.stringify(prev))
+          return prev;
+        return initialColumns;
+      });
     }
-    if (!savedLayout) handleSaveLayout(initialColumns, true);
     setIsReady(true);
-    return () => {
-      renderCountRef.current = 0;
-    };
-  }, [handleSaveLayout, initialColumns, key, autosync]);
+  }, [initialColumns, key, autosync]);
   const getSavedLayout = (0, import_react5.useCallback)(() => {
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)

package/dist/components/DataGrid/TableBody/index.js

@@ -1,21 +1,21 @@
 import {
   TableBody
-} from "../../../chunk-SJ3SULQB.js";
-import "../../../chunk-XX5GVIPZ.js";
+} from "../../../chunk-J2QD64F2.js";
+import "../../../chunk-XVWCVBVF.js";
 import "../../../chunk-M7INAUAJ.js";
-import "../../../chunk-ARWHCWG7.js";
-import "../../../chunk-MQB6BSRX.js";
+import "../../../chunk-XT4BQXSX.js";
+import "../../../chunk-OXOMO76M.js";
 import "../../../chunk-YCDDBSVU.js";
 import "../../../chunk-3X3Y4TMS.js";
 import "../../../chunk-BQNPOGD5.js";
 import "../../../chunk-Y5GD2FJA.js";
 import "../../../chunk-MBZ55T2D.js";
 import "../../../chunk-2IKT6IHB.js";
-import "../../../chunk-FIOXWZWU.js";
-import "../../../chunk-LGX34HML.js";
+import "../../../chunk-ECYXZZWC.js";
+import "../../../chunk-Q4AANHJY.js";
 import "../../../chunk-5IFPG6TS.js";
+import "../../../chunk-OZEKRO4L.js";
 import "../../../chunk-AJ5M6MVX.js";
-import "../../../chunk-UB3GEENN.js";
 import "../../../chunk-AT4AWD6B.js";
 import "../../../chunk-EWGHVZL5.js";
 import "../../../chunk-UF5XGCSF.js";
@@ -24,7 +24,7 @@ import "../../../chunk-L3BXRDLP.js";
 import "../../../chunk-34VEVX5H.js";
 import "../../../chunk-LB7UT6F3.js";
 import "../../../chunk-AS57Y2D3.js";
-import "../../../chunk-V7GPM6Z3.js";
+import "../../../chunk-Z3Q7PLVD.js";
 import "../../../chunk-4RJKB7LC.js";
 import "../../../chunk-UUKHQUSF.js";
 import "../../../chunk-WVVEOCEH.js";
@@ -35,19 +35,19 @@ import "../../../chunk-UAMI54FE.js";
 import "../../../chunk-SJZNVG4N.js";
 import "../../../chunk-75USUR3I.js";
 import "../../../chunk-BWPNXY7T.js";
-import "../../../chunk-RQMOWYB7.js";
-import "../../../chunk-5JHKFK73.js";
-import "../../../chunk-IATOG76G.js";
-import "../../../chunk-PS7MBNUT.js";
+import "../../../chunk-VAARSN7U.js";
+import "../../../chunk-V2GSI3ZX.js";
+import "../../../chunk-NUFBAJ6L.js";
+import "../../../chunk-YXZRGZ2I.js";
 import "../../../chunk-FHXCCVOG.js";
 import "../../../chunk-7T5RGDCN.js";
 import "../../../chunk-HXGJVYGQ.js";
 import "../../../chunk-WVUIIBRR.js";
 import "../../../chunk-M7WHWZ2J.js";
-import "../../../chunk-3R3AY5MT.js";
-import "../../../chunk-YR4ZO2XL.js";
+import "../../../chunk-LN3HVXH5.js";
+import "../../../chunk-K22B4L3G.js";
 import "../../../chunk-VXWSAIB5.js";
-import "../../../chunk-QJZ3XHNH.js";
+import "../../../chunk-HCHKYUNQ.js";
 import "../../../chunk-5UH6QUFB.js";
 import "../../../chunk-XJF4S3RB.js";
 import "../../../chunk-ZCJWOHFN.js";

package/dist/components/DataGrid/index.cjs

@@ -265,11 +265,24 @@ function formatDate(date) {
 
 // src/utils/mergeObjectArrays.ts
 function mergeObjectArrays(arr1, arr2) {
-  const maxLength = Math.max(arr1.length, arr2.length);
-  return Array.from(
-    { length: maxLength },
-    (_, i) => __spreadValues(__spreadValues({}, arr1[i] || {}), arr2[i] || {})
-  );
+  const arr2Map = /* @__PURE__ */ new Map();
+  for (const item of arr2) {
+    const id = item.id;
+    if (id !== void 0) {
+      arr2Map.set(id, item);
+    }
+  }
+  return arr1.map((item1) => {
+    const id = item1.id;
+    if (id !== void 0 && arr2Map.has(id)) {
+      const item2 = arr2Map.get(id);
+      const meta1 = item1.meta;
+      const meta2 = item2.meta;
+      const mergedMeta = meta1 && meta2 && typeof meta1 === "object" && typeof meta2 === "object" ? __spreadValues(__spreadValues({}, meta1), meta2) : meta2 != null ? meta2 : meta1;
+      return __spreadProps(__spreadValues(__spreadValues({}, item1), item2), { meta: mergedMeta });
+    }
+    return item1;
+  });
 }
 
 // src/utils/index.ts
@@ -305,52 +318,58 @@ var getLocalStorageKeyWithPrefix = (key) => `${LocalStoragePrefix}__${key}`;
 function useTableLayout(initialColumns, key, autosync = true) {
   const [columns, setColumns] = (0, import_react4.useState)(initialColumns);
   const [isReady, setIsReady] = (0, import_react4.useState)(false);
-  const renderCountRef = (0, import_react4.useRef)(0);
+  const isReadyRef = (0, import_react4.useRef)(false);
+  const keyRef = (0, import_react4.useRef)(key);
+  (0, import_react4.useEffect)(() => {
+    isReadyRef.current = isReady;
+    keyRef.current = key;
+  }, [isReady, key]);
   const handleSaveLayout = (0, import_react4.useCallback)(
     (setter, _internal) => {
-      if (!isReady && !_internal || !key) return;
+      if (!isReadyRef.current && !_internal || !keyRef.current) return;
       setColumns((prevColumns) => {
         const newColumns = typeof setter === "function" ? setter(prevColumns) : setter;
-        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal)
+        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal) {
           return prevColumns;
+        }
         localStorage.setItem(
-          getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+          getLocalStorageKeyWithPrefix(`${keyRef.current}-tableLayout`),
           JSON.stringify(newColumns)
         );
         return newColumns;
       });
     },
-    [isReady, key]
+    []
   );
   (0, import_react4.useEffect)(() => {
     if (!autosync) return;
-    if (!key) return setIsReady(true);
-    if (renderCountRef.current > 1) {
-      throw new Error(
-        `useTableLayout should only be called once per component render cycle.
-        ${renderCountRef.current} Renders detected.
-        Check dependency stability`
-      );
+    if (!key) {
+      setIsReady(true);
+      return;
     }
-    renderCountRef.current += 1;
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)
     );
     if (savedLayout) {
-      handleSaveLayout(
+      setColumns(
         mergeObjectArrays(
           initialColumns,
           JSON.parse(savedLayout)
-        ),
-        true
+        )
+      );
+    } else {
+      localStorage.setItem(
+        getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+        JSON.stringify(initialColumns)
       );
+      setColumns((prev) => {
+        if (JSON.stringify(initialColumns) === JSON.stringify(prev))
+          return prev;
+        return initialColumns;
+      });
     }
-    if (!savedLayout) handleSaveLayout(initialColumns, true);
     setIsReady(true);
-    return () => {
-      renderCountRef.current = 0;
-    };
-  }, [handleSaveLayout, initialColumns, key, autosync]);
+  }, [initialColumns, key, autosync]);
   const getSavedLayout = (0, import_react4.useCallback)(() => {
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)

package/dist/components/DataGrid/index.js

@@ -2,22 +2,22 @@
 import {
   DataGrid,
   DataGrid_default
-} from "../../chunk-SJ3SULQB.js";
-import "../../chunk-XX5GVIPZ.js";
+} from "../../chunk-J2QD64F2.js";
+import "../../chunk-XVWCVBVF.js";
 import "../../chunk-M7INAUAJ.js";
-import "../../chunk-ARWHCWG7.js";
-import "../../chunk-MQB6BSRX.js";
+import "../../chunk-XT4BQXSX.js";
+import "../../chunk-OXOMO76M.js";
 import "../../chunk-YCDDBSVU.js";
 import "../../chunk-3X3Y4TMS.js";
 import "../../chunk-BQNPOGD5.js";
 import "../../chunk-Y5GD2FJA.js";
 import "../../chunk-MBZ55T2D.js";
 import "../../chunk-2IKT6IHB.js";
-import "../../chunk-FIOXWZWU.js";
-import "../../chunk-LGX34HML.js";
+import "../../chunk-ECYXZZWC.js";
+import "../../chunk-Q4AANHJY.js";
 import "../../chunk-5IFPG6TS.js";
+import "../../chunk-OZEKRO4L.js";
 import "../../chunk-AJ5M6MVX.js";
-import "../../chunk-UB3GEENN.js";
 import "../../chunk-AT4AWD6B.js";
 import "../../chunk-EWGHVZL5.js";
 import "../../chunk-UF5XGCSF.js";
@@ -26,7 +26,7 @@ import "../../chunk-L3BXRDLP.js";
 import "../../chunk-34VEVX5H.js";
 import "../../chunk-LB7UT6F3.js";
 import "../../chunk-AS57Y2D3.js";
-import "../../chunk-V7GPM6Z3.js";
+import "../../chunk-Z3Q7PLVD.js";
 import "../../chunk-4RJKB7LC.js";
 import "../../chunk-UUKHQUSF.js";
 import "../../chunk-WVVEOCEH.js";
@@ -37,19 +37,19 @@ import "../../chunk-UAMI54FE.js";
 import "../../chunk-SJZNVG4N.js";
 import "../../chunk-75USUR3I.js";
 import "../../chunk-BWPNXY7T.js";
-import "../../chunk-RQMOWYB7.js";
-import "../../chunk-5JHKFK73.js";
-import "../../chunk-IATOG76G.js";
-import "../../chunk-PS7MBNUT.js";
+import "../../chunk-VAARSN7U.js";
+import "../../chunk-V2GSI3ZX.js";
+import "../../chunk-NUFBAJ6L.js";
+import "../../chunk-YXZRGZ2I.js";
 import "../../chunk-FHXCCVOG.js";
 import "../../chunk-7T5RGDCN.js";
 import "../../chunk-HXGJVYGQ.js";
 import "../../chunk-WVUIIBRR.js";
 import "../../chunk-M7WHWZ2J.js";
-import "../../chunk-3R3AY5MT.js";
-import "../../chunk-YR4ZO2XL.js";
+import "../../chunk-LN3HVXH5.js";
+import "../../chunk-K22B4L3G.js";
 import "../../chunk-VXWSAIB5.js";
-import "../../chunk-QJZ3XHNH.js";
+import "../../chunk-HCHKYUNQ.js";
 import "../../chunk-5UH6QUFB.js";
 import "../../chunk-XJF4S3RB.js";
 import "../../chunk-ZCJWOHFN.js";

package/dist/components/DataGrid/utils.cjs

@@ -595,11 +595,24 @@ function formatDate(date) {
 
 // src/utils/mergeObjectArrays.ts
 function mergeObjectArrays(arr1, arr2) {
-  const maxLength = Math.max(arr1.length, arr2.length);
-  return Array.from(
-    { length: maxLength },
-    (_, i) => __spreadValues(__spreadValues({}, arr1[i] || {}), arr2[i] || {})
-  );
+  const arr2Map = /* @__PURE__ */ new Map();
+  for (const item of arr2) {
+    const id = item.id;
+    if (id !== void 0) {
+      arr2Map.set(id, item);
+    }
+  }
+  return arr1.map((item1) => {
+    const id = item1.id;
+    if (id !== void 0 && arr2Map.has(id)) {
+      const item2 = arr2Map.get(id);
+      const meta1 = item1.meta;
+      const meta2 = item2.meta;
+      const mergedMeta = meta1 && meta2 && typeof meta1 === "object" && typeof meta2 === "object" ? __spreadValues(__spreadValues({}, meta1), meta2) : meta2 != null ? meta2 : meta1;
+      return __spreadProps(__spreadValues(__spreadValues({}, item1), item2), { meta: mergedMeta });
+    }
+    return item1;
+  });
 }
 
 // src/utils/index.ts
@@ -635,52 +648,58 @@ var getLocalStorageKeyWithPrefix = (key) => `${LocalStoragePrefix}__${key}`;
 function useTableLayout(initialColumns, key, autosync = true) {
   const [columns, setColumns] = (0, import_react5.useState)(initialColumns);
   const [isReady, setIsReady] = (0, import_react5.useState)(false);
-  const renderCountRef = (0, import_react5.useRef)(0);
+  const isReadyRef = (0, import_react5.useRef)(false);
+  const keyRef = (0, import_react5.useRef)(key);
+  (0, import_react5.useEffect)(() => {
+    isReadyRef.current = isReady;
+    keyRef.current = key;
+  }, [isReady, key]);
   const handleSaveLayout = (0, import_react5.useCallback)(
     (setter, _internal) => {
-      if (!isReady && !_internal || !key) return;
+      if (!isReadyRef.current && !_internal || !keyRef.current) return;
       setColumns((prevColumns) => {
         const newColumns = typeof setter === "function" ? setter(prevColumns) : setter;
-        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal)
+        if (JSON.stringify(newColumns) === JSON.stringify(prevColumns) && !_internal) {
           return prevColumns;
+        }
         localStorage.setItem(
-          getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+          getLocalStorageKeyWithPrefix(`${keyRef.current}-tableLayout`),
           JSON.stringify(newColumns)
         );
         return newColumns;
       });
     },
-    [isReady, key]
+    []
   );
   (0, import_react5.useEffect)(() => {
     if (!autosync) return;
-    if (!key) return setIsReady(true);
-    if (renderCountRef.current > 1) {
-      throw new Error(
-        `useTableLayout should only be called once per component render cycle.
-        ${renderCountRef.current} Renders detected.
-        Check dependency stability`
-      );
+    if (!key) {
+      setIsReady(true);
+      return;
     }
-    renderCountRef.current += 1;
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)
     );
     if (savedLayout) {
-      handleSaveLayout(
+      setColumns(
         mergeObjectArrays(
           initialColumns,
           JSON.parse(savedLayout)
-        ),
-        true
+        )
+      );
+    } else {
+      localStorage.setItem(
+        getLocalStorageKeyWithPrefix(`${key}-tableLayout`),
+        JSON.stringify(initialColumns)
       );
+      setColumns((prev) => {
+        if (JSON.stringify(initialColumns) === JSON.stringify(prev))
+          return prev;
+        return initialColumns;
+      });
     }
-    if (!savedLayout) handleSaveLayout(initialColumns, true);
     setIsReady(true);
-    return () => {
-      renderCountRef.current = 0;
-    };
-  }, [handleSaveLayout, initialColumns, key, autosync]);
+  }, [initialColumns, key, autosync]);
   const getSavedLayout = (0, import_react5.useCallback)(() => {
     const savedLayout = localStorage.getItem(
       getLocalStorageKeyWithPrefix(`${key}-tableLayout`)