ketekny-ui-kit 1.0.32 → 1.0.33

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ketekny-ui-kit",
   "type": "module",
-  "version": "1.0.32",
+  "version": "1.0.33",
   "description": "A Vue 3 UI component library with Tailwind CSS styling",
   "main": "index.js",
   "files": [

package/src/ui/kDatatable.vue

@@ -101,7 +101,7 @@ export default {
       selectedKeys: [],
       selectedKeySet: new Set(),
       lastSelectionAnchorKey: null,
-      currentPageRowsCache: [],
+      _pageSelectableKeys: [],
       keyedItems: [],
       currentItemsByKey: new Map(),
       baseKeyToKeys: new Map(),
@@ -123,17 +123,7 @@ export default {
       return Object.keys(this.$slots).filter((name) => !reserved.has(name));
     },
     pageSelectableKeys() {
-      const keys = [];
-      const seen = new Set();
-      this.currentPageRowsCache.forEach((rowItem) => {
-        const key = this.resolveIncomingItemKey(rowItem);
-        if (!key || seen.has(key)) return;
-        const sourceItem = this.currentItemsByKey.get(key);
-        if (!sourceItem || !this.isItemSelectable(sourceItem)) return;
-        seen.add(key);
-        keys.push(key);
-      });
-      return keys;
+      return this._pageSelectableKeys;
     },
     allSelectableSelected() {
       if (!this.pageSelectableKeys.length) return false;
@@ -146,6 +136,8 @@ export default {
   },
 
   created() {
+    this.currentPageRowsCache = []; // non-reactive — mutated during EasyDataTable render
+    this._pageRenderScheduled = false; // non-reactive flag
     this.rebuildItemCaches();
     this.applyExternalModelValue(this.modelValue);
   },
@@ -284,6 +276,14 @@ export default {
       }
       this.currentPageRowsCache[rowNumber - 1] = item;
 
+      if (!this._pageRenderScheduled) {
+        this._pageRenderScheduled = true;
+        this.$nextTick(() => {
+          this._pageRenderScheduled = false;
+          this._pageSelectableKeys = this._computePageSelectableKeys();
+        });
+      }
+
       const externalBodyRowClass =
         this.$attrs["body-row-class-name"] ?? this.$attrs.bodyRowClassName;
       if (typeof externalBodyRowClass === "function") {
@@ -294,6 +294,19 @@ export default {
       }
       return "";
     },
+    _computePageSelectableKeys() {
+      const keys = [];
+      const seen = new Set();
+      this.currentPageRowsCache.forEach((rowItem) => {
+        const key = this.resolveIncomingItemKey(rowItem);
+        if (!key || seen.has(key)) return;
+        const sourceItem = this.currentItemsByKey.get(key);
+        if (!sourceItem || !this.isItemSelectable(sourceItem)) return;
+        seen.add(key);
+        keys.push(key);
+      });
+      return keys;
+    },
     rebuildItemCaches() {
       const keyedItems = [];
       const currentItemsByKey = new Map();