@alaarab/ogrid-core 2.1.13 → 2.1.15

package/dist/esm/index.js

@@ -524,23 +524,39 @@ function processClientSideData(data, columns, filters, sortBy, sortDirection) {
         const trimmed = val.value.trim();
         if (trimmed) {
           const lower = trimmed.toLowerCase();
-          predicates.push((r) => String(getCellValue(r, col) ?? "").toLowerCase().includes(lower));
+          const textCache = /* @__PURE__ */ new Map();
+          for (let j = 0; j < data.length; j++) {
+            textCache.set(data[j], String(getCellValue(data[j], col) ?? "").toLowerCase());
+          }
+          predicates.push((r) => (textCache.get(r) ?? "").includes(lower));
         }
         break;
       }
       case "people": {
         const email = val.value.email.toLowerCase();
-        predicates.push((r) => String(getCellValue(r, col) ?? "").toLowerCase() === email);
+        const peopleCache = /* @__PURE__ */ new Map();
+        for (let j = 0; j < data.length; j++) {
+          peopleCache.set(data[j], String(getCellValue(data[j], col) ?? "").toLowerCase());
+        }
+        predicates.push((r) => (peopleCache.get(r) ?? "") === email);
         break;
       }
       case "date": {
         const dv = val.value;
         const fromTs = dv.from ? (/* @__PURE__ */ new Date(dv.from + "T00:00:00")).getTime() : NaN;
         const toTs = dv.to ? (/* @__PURE__ */ new Date(dv.to + "T23:59:59.999")).getTime() : NaN;
+        const dateCache = /* @__PURE__ */ new Map();
+        for (let j = 0; j < data.length; j++) {
+          const cellVal = getCellValue(data[j], col);
+          if (cellVal == null) {
+            dateCache.set(data[j], NaN);
+          } else {
+            const t = new Date(String(cellVal)).getTime();
+            dateCache.set(data[j], Number.isNaN(t) ? NaN : t);
+          }
+        }
         predicates.push((r) => {
-          const cellVal = getCellValue(r, col);
-          if (cellVal == null) return false;
-          const cellTs = new Date(String(cellVal)).getTime();
+          const cellTs = dateCache.get(r) ?? NaN;
           if (Number.isNaN(cellTs)) return false;
           if (!Number.isNaN(fromTs) && cellTs < fromTs) return false;
           if (!Number.isNaN(toTs) && cellTs > toTs) return false;
@@ -1058,23 +1074,94 @@ var CELL_PADDING = 16;
 var GRID_BORDER_RADIUS = 6;
 
 // src/utils/columnAutosize.ts
-var AUTOSIZE_EXTRA_PX = 28;
+var AUTOSIZE_EXTRA_PX = 16;
 var AUTOSIZE_MAX_PX = 520;
+function measureHeaderWidth(th) {
+  const cs = getComputedStyle(th);
+  const thPadding = (parseFloat(cs.paddingLeft) || 0) + (parseFloat(cs.paddingRight) || 0);
+  let resizeHandleWidth = 0;
+  for (let i = 0; i < th.children.length; i++) {
+    const child = th.children[i];
+    const cls = child.className || "";
+    if (cls.includes("resizeHandle") || cls.includes("resize-handle") || cls.includes("ogrid-resize-handle")) {
+      resizeHandleWidth = child.offsetWidth;
+      break;
+    }
+  }
+  const contentContainer = th.firstElementChild;
+  if (!contentContainer) return th.offsetWidth;
+  const modified = [];
+  const expandDescendants = (parent) => {
+    for (let i = 0; i < parent.children.length; i++) {
+      const child = parent.children[i];
+      const style = getComputedStyle(child);
+      if (style.overflow === "hidden" || style.flexShrink !== "0") {
+        modified.push({
+          el: child,
+          overflow: child.style.overflow,
+          flexShrink: child.style.flexShrink,
+          width: child.style.width,
+          minWidth: child.style.minWidth
+        });
+        child.style.overflow = "visible";
+        child.style.flexShrink = "0";
+        child.style.width = "max-content";
+        child.style.minWidth = "max-content";
+      }
+      expandDescendants(child);
+    }
+  };
+  const origPos = contentContainer.style.position;
+  const origWidth = contentContainer.style.width;
+  contentContainer.style.position = "absolute";
+  contentContainer.style.width = "max-content";
+  expandDescendants(contentContainer);
+  const expandedWidth = contentContainer.offsetWidth;
+  contentContainer.style.position = origPos;
+  contentContainer.style.width = origWidth;
+  for (const m of modified) {
+    m.el.style.overflow = m.overflow;
+    m.el.style.flexShrink = m.flexShrink;
+    m.el.style.width = m.width;
+    m.el.style.minWidth = m.minWidth;
+  }
+  return expandedWidth + resizeHandleWidth + thPadding;
+}
 function measureColumnContentWidth(columnId, minWidth, container) {
   const minW = minWidth ?? DEFAULT_MIN_COLUMN_WIDTH;
   const root = container ?? document;
   const cells = root.querySelectorAll(`[data-column-id="${columnId}"]`);
   if (cells.length === 0) return minW;
   let maxWidth = minW;
+  const contentEls = [];
+  const origPositions = [];
+  const origWidths = [];
   cells.forEach((cell) => {
     const el = cell;
-    const label = el.querySelector?.("[data-header-label]");
-    if (label) {
-      maxWidth = Math.max(maxWidth, label.scrollWidth + AUTOSIZE_EXTRA_PX);
+    const isHeader = !!el.querySelector?.("[data-header-label]");
+    if (isHeader) {
+      maxWidth = Math.max(maxWidth, measureHeaderWidth(el));
     } else {
-      maxWidth = Math.max(maxWidth, el.scrollWidth);
+      const content = el.firstElementChild ?? el;
+      contentEls.push(content);
     }
   });
+  if (contentEls.length > 0) {
+    for (let i = 0; i < contentEls.length; i++) {
+      const el = contentEls[i];
+      origPositions.push(el.style.position);
+      origWidths.push(el.style.width);
+      el.style.position = "absolute";
+      el.style.width = "max-content";
+    }
+    for (let i = 0; i < contentEls.length; i++) {
+      maxWidth = Math.max(maxWidth, contentEls[i].offsetWidth + AUTOSIZE_EXTRA_PX);
+    }
+    for (let i = 0; i < contentEls.length; i++) {
+      contentEls[i].style.position = origPositions[i];
+      contentEls[i].style.width = origWidths[i];
+    }
+  }
   return Math.min(AUTOSIZE_MAX_PX, Math.max(minW, Math.ceil(maxWidth)));
 }
 
@@ -1240,7 +1327,7 @@ function computeRowSelectionState(selectedIds, items, getRowId) {
   if (selectedIds.size === 0 || items.length === 0) {
     return { allSelected: false, someSelected: false };
   }
-  const allSelected = items.every((item) => selectedIds.has(getRowId(item)));
+  const allSelected = selectedIds.size >= items.length && items.every((item) => selectedIds.has(getRowId(item)));
   const someSelected = !allSelected && selectedIds.size > 0;
   return { allSelected, someSelected };
 }

package/dist/types/utils/columnAutosize.d.ts

@@ -1,15 +1,16 @@
 /**
  * Column autosize DOM measurement utilities shared across all frameworks.
  */
-/** Extra pixels added to header label width to account for filter icon + padding. */
-export declare const AUTOSIZE_EXTRA_PX = 28;
+/** Extra pixels added after body content measurement for padding. */
+export declare const AUTOSIZE_EXTRA_PX = 16;
 /** Maximum column width from autosize. */
 export declare const AUTOSIZE_MAX_PX = 520;
 /**
  * Measure the ideal width for a column by scanning all DOM cells with
- * `[data-column-id="<columnId>"]` and computing the maximum scrollWidth.
+ * `[data-column-id="<columnId>"]` and computing the maximum content width.
  *
- * Header cells with a `[data-header-label]` child get extra padding for icons.
+ * Header cells: temporarily unconstrained to measure true content width.
+ * Body cells: measured via `position: absolute; width: max-content`.
  *
  * @param columnId - Column to measure
  * @param minWidth - Minimum width (defaults to DEFAULT_MIN_COLUMN_WIDTH)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-core",
-  "version": "2.1.13",
+  "version": "2.1.15",
   "description": "OGrid core – framework-agnostic types, algorithms, and utilities for OGrid data grids.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",