@tensor_1/react 2.11.0 → 2.13.0

package/dist/diff-model.js

@@ -0,0 +1,50 @@
+function isJsonObject(value) {
+  return value !== null && typeof value === "object" && !Array.isArray(value);
+}
+function jsonEqual(a, b) {
+  if (a === b) return true;
+  if (Array.isArray(a) && Array.isArray(b)) {
+    return a.length === b.length && a.every((value, index) => jsonEqual(value, b[index]));
+  }
+  if (isJsonObject(a) && isJsonObject(b)) {
+    const aKeys = Object.keys(a).sort();
+    const bKeys = Object.keys(b).sort();
+    return aKeys.length === bKeys.length && aKeys.every((key, index) => key === bKeys[index] && jsonEqual(a[key], b[key]));
+  }
+  return false;
+}
+function classify(base, current, incoming) {
+  if (base === void 0) return "added";
+  if (incoming === void 0) return "removed";
+  const currentChanged = !jsonEqual(base, current);
+  const incomingChanged = !jsonEqual(base, incoming);
+  if (currentChanged && incomingChanged && !jsonEqual(current, incoming)) return "conflicted";
+  return "changed";
+}
+function buildThreeWayDiff(base, current, incoming, path = "$") {
+  if (jsonEqual(current, incoming)) return [];
+  if (isJsonObject(base) || isJsonObject(current) || isJsonObject(incoming)) {
+    const objects = [base, current, incoming].filter(isJsonObject);
+    const keys = [...new Set(objects.flatMap((value) => Object.keys(value)))].sort();
+    return keys.flatMap((key) => buildThreeWayDiff(
+      isJsonObject(base) ? base[key] : void 0,
+      isJsonObject(current) ? current[key] : void 0,
+      isJsonObject(incoming) ? incoming[key] : void 0,
+      `${path}.${key}`
+    ));
+  }
+  return [{ path, kind: classify(base, current, incoming), base, current, incoming }];
+}
+function summarizeDiff(entries, resolutions = {}) {
+  const summary = { added: 0, removed: 0, changed: 0, conflicted: 0, resolved: 0, pending: 0 };
+  entries.forEach((entry) => {
+    summary[entry.kind] += 1;
+    if ((resolutions[entry.path] ?? "pending") === "pending") summary.pending += 1;
+    else summary.resolved += 1;
+  });
+  return summary;
+}
+export {
+  buildThreeWayDiff,
+  summarizeDiff
+};

package/dist/hooks/useTable.js

@@ -19,18 +19,22 @@ function useTable(data, options = {}) {
   const [query, setQuery] = useState(() => options.initialQuery ?? "");
   const [selected, setSelected] = useState(() => /* @__PURE__ */ new Set());
   const [pinned, setPinned] = useState(() => new Set(options.initialPinned ?? []));
-  const rows = useMemo(() => {
-    const filtered = applyFilters(data, filters);
-    const searched = searchRows(filtered, query, searchFields);
-    const sorted = multiSort(searched, sort);
-    return mergePinned(data, sorted, pinned, idField);
-  }, [data, filters, query, searchFields, sort, pinned, idField]);
+  const visibleRows = useMemo(() => {
+    const filtered = filters.length ? applyFilters(data, filters) : data;
+    const searched = query.trim() ? searchRows(filtered, query, searchFields) : filtered;
+    return sort.length ? multiSort(searched, sort) : searched;
+  }, [data, filters, query, searchFields, sort]);
+  const rows = useMemo(
+    () => pinned.size ? mergePinned(data, visibleRows, pinned, idField) : visibleRows.slice(),
+    [data, visibleRows, pinned, idField]
+  );
   const pageIds = useMemo(() => rows.map((r) => String(r[idField])), [rows, idField]);
   const selectAll = selectAllState(selected, pageIds);
   const doToggleSort = useCallback((field, additive = false) => {
     setSort((keys) => toggleSort(keys, field, additive));
   }, []);
   const toggleRow = useCallback((id) => setSelected((s) => toggleId(s, id)), []);
+  const isSelected = useCallback((id) => selected.has(id), [selected]);
   const toggleAllRows = useCallback(() => setSelected((s) => togglePage(s, pageIds)), [pageIds]);
   const clearSelection = useCallback(() => setSelected(/* @__PURE__ */ new Set()), []);
   const togglePin = useCallback((id) => setPinned((s) => toggleId(s, id)), []);
@@ -54,7 +58,7 @@ function useTable(data, options = {}) {
     setSort,
     setFilters,
     setQuery,
-    isSelected: (id) => selected.has(id),
+    isSelected,
     toggleRow,
     toggleAllRows,
     clearSelection,

package/dist/hooks/useVirtualRows.d.ts

@@ -0,0 +1,27 @@
+import { RefObject } from 'react';
+
+interface UseVirtualRowsOptions {
+    /** Fixed rendered row height in pixels. */
+    rowHeight: number;
+    /** Rows rendered beyond each viewport edge. Default: 6. */
+    overscan?: number;
+    /** Render all rows at or below this count. Default: 100. */
+    threshold?: number;
+}
+interface UseVirtualRowsResult<T> {
+    /** Attach to the scrolling TableWrap. */
+    containerRef: RefObject<HTMLDivElement>;
+    rows: readonly T[];
+    startIndex: number;
+    padTop: number;
+    padBottom: number;
+    totalHeight: number;
+    virtualized: boolean;
+}
+/**
+ * Owns scroll/resize observation and exposes the small visible row window.
+ * Consumers render padTop/padBottom spacer rows inside their existing tbody.
+ */
+declare function useVirtualRows<T>(rows: readonly T[], { rowHeight, overscan, threshold }: UseVirtualRowsOptions): UseVirtualRowsResult<T>;
+
+export { type UseVirtualRowsOptions, type UseVirtualRowsResult, useVirtualRows };

package/dist/hooks/useVirtualRows.js

@@ -0,0 +1,50 @@
+"use client";
+import { useLayoutEffect, useMemo, useRef, useState } from "react";
+import { shouldVirtualize, virtualWindow } from "../table-engine.js";
+function useVirtualRows(rows, { rowHeight, overscan = 6, threshold = 100 }) {
+  const containerRef = useRef(null);
+  const [viewport, setViewport] = useState({ scrollTop: 0, height: 0 });
+  useLayoutEffect(() => {
+    const element = containerRef.current;
+    if (!element) return;
+    let frame = 0;
+    const commitMeasurement = () => {
+      const next = { scrollTop: element.scrollTop, height: element.clientHeight };
+      setViewport((current) => current.scrollTop === next.scrollTop && current.height === next.height ? current : next);
+    };
+    const measure = () => {
+      if (frame) return;
+      frame = requestAnimationFrame(() => {
+        frame = 0;
+        commitMeasurement();
+      });
+    };
+    commitMeasurement();
+    element.addEventListener("scroll", measure, { passive: true });
+    const observer = new ResizeObserver(measure);
+    observer.observe(element);
+    return () => {
+      element.removeEventListener("scroll", measure);
+      observer.disconnect();
+      if (frame) cancelAnimationFrame(frame);
+    };
+  }, []);
+  const enabled = viewport.height > 0 && shouldVirtualize(rows.length, threshold);
+  const window = useMemo(
+    () => enabled ? virtualWindow(viewport.scrollTop, viewport.height, rowHeight, rows.length, overscan) : { start: 0, end: rows.length, padTop: 0, padBottom: 0, total: rows.length * rowHeight },
+    [enabled, overscan, rowHeight, rows.length, viewport.height, viewport.scrollTop]
+  );
+  const visibleRows = useMemo(() => rows.slice(window.start, window.end), [rows, window.start, window.end]);
+  return {
+    containerRef,
+    rows: visibleRows,
+    startIndex: window.start,
+    padTop: window.padTop,
+    padBottom: window.padBottom,
+    totalHeight: window.total,
+    virtualized: enabled
+  };
+}
+export {
+  useVirtualRows
+};