@hexclave/dashboard-ui-components 1.0.49 → 1.0.52

package/dist/dashboard-ui-components.global.js

@@ -9780,14 +9780,17 @@ attempted value: ${formattedValue}
       if (error instanceof Error) concatStacktraces(error, currentError);
     });
   }
-  async function wait(ms) {
+  async function wait(ms, options) {
     if (!Number.isFinite(ms) || ms < 0) throw new HexclaveAssertionError(`wait() requires a non-negative integer number of milliseconds to wait. (found: ${ms}ms)`);
     if (ms >= 2 ** 31) throw new HexclaveAssertionError("The maximum timeout for wait() is 2147483647ms (2**31 - 1). (found: ${ms}ms)");
     return await traceSpan({
       description: "wait(...)",
       attributes: { "stack.wait.ms": ms }
     }, async (span) => {
-      return await new Promise((resolve) => setTimeout(resolve, ms));
+      return await new Promise((resolve) => {
+        const timeout = setTimeout(resolve, ms);
+        if (options?.unref === true && typeof timeout === "object") timeout.unref();
+      });
     });
   }
   function runAsynchronouslyWithAlert(...args) {
@@ -23005,6 +23008,7 @@ ${colorConfig.map(([key, itemConfig]) => {
   }
 
   // src/components/data-grid/data-grid.tsx
+  var DEFAULT_INFINITE_MAX_HEIGHT = "calc(100dvh - 16rem)";
   function getEventTargetElement(target) {
     if (target instanceof Element) return target;
     if (target instanceof Node) return target.parentElement;
@@ -23705,7 +23709,8 @@ ${colorConfig.map(([key, itemConfig]) => {
     );
     const allSelected = rowIds.length > 0 && rowIds.every((id) => state.selection.selectedIds.has(id));
     const someSelected = !allSelected && rowIds.some((id) => state.selection.selectedIds.has(id));
-    const infiniteScrollRootRef = paginationMode === "infinite" && (fillHeight || maxHeight != null) ? scrollContainerRef : void 0;
+    const effectiveMaxHeight = maxHeight ?? (paginationMode === "infinite" && !fillHeight ? DEFAULT_INFINITE_MAX_HEIGHT : void 0);
+    const infiniteScrollRootRef = paginationMode === "infinite" && (fillHeight || effectiveMaxHeight != null) ? scrollContainerRef : void 0;
     const headers = (0, import_react35.useMemo)(
       () => table.getHeaderGroups()[0]?.headers.filter((h) => visibleColumns.some((c4) => c4.id === h.column.id)) ?? [],
       [table, visibleColumns]
@@ -23715,7 +23720,7 @@ ${colorConfig.map(([key, itemConfig]) => {
       for (const h of headers) m5.set(h.column.id, h);
       return m5;
     }, [headers]);
-    const isBounded = fillHeight || maxHeight != null;
+    const isBounded = fillHeight || effectiveMaxHeight != null;
     return /* @__PURE__ */ jsxs(Fragment24, { children: [
       /* @__PURE__ */ jsx(
         DataGridExportDialog,
@@ -23738,7 +23743,7 @@ ${colorConfig.map(([key, itemConfig]) => {
             isBounded && "overflow-hidden",
             className
           ),
-          style: maxHeight != null ? { ...cssVars, maxHeight } : cssVars,
+          style: effectiveMaxHeight != null ? { ...cssVars, maxHeight: effectiveMaxHeight } : cssVars,
           role: "grid",
           "aria-rowcount": totalRowCount ?? rows.length,
           "aria-colcount": visibleColumns.length,
@@ -23748,7 +23753,7 @@ ${colorConfig.map(([key, itemConfig]) => {
               {
                 ref: stickyChromeRef,
                 className: "sticky z-30 w-full min-w-0 shrink-0 overflow-visible rounded-t-[calc(var(--radius)*2)] bg-white/90 dark:bg-background backdrop-blur-xl",
-                style: { top: stickyTop ?? (maxHeight != null ? 0 : "var(--data-grid-sticky-top, 0px)") },
+                style: { top: stickyTop ?? (effectiveMaxHeight != null ? 0 : "var(--data-grid-sticky-top, 0px)") },
                 children: [
                   toolbar !== false && /* @__PURE__ */ jsx("div", { className: "relative bg-transparent", children: toolbar ? toolbar(toolbarCtx) : /* @__PURE__ */ jsx(
                     DataGridToolbar,
@@ -23989,10 +23994,15 @@ ${colorConfig.map(([key, itemConfig]) => {
     const [hasMore, setHasMore] = (0, import_react36.useState)(true);
     const [error, setError] = (0, import_react36.useState)(null);
     const cursorRef = (0, import_react36.useRef)(void 0);
-    const abortRef = (0, import_react36.useRef)(null);
+    const inFlightFetchRef = (0, import_react36.useRef)(null);
+    const pendingLoadMoreRef = (0, import_react36.useRef)(false);
+    const hasMoreRef = (0, import_react36.useRef)(true);
+    const paginationModeRef = (0, import_react36.useRef)(paginationMode);
+    paginationModeRef.current = paginationMode;
     const pageIndexRef = (0, import_react36.useRef)(0);
     const hasDataRef = (0, import_react36.useRef)(false);
     const hasMountedServerPaginationRef = (0, import_react36.useRef)(false);
+    const lastCompletedNonAppendFetchKeyRef = (0, import_react36.useRef)(null);
     const latestArgsRef = (0, import_react36.useRef)({
       dataSource,
       getRowId,
@@ -24005,6 +24015,9 @@ ${colorConfig.map(([key, itemConfig]) => {
     const quickSearchKey = quickSearch;
     const fetchPage = (0, import_react36.useCallback)(
       async (append) => {
+        if (append && inFlightFetchRef.current != null) {
+          return;
+        }
         const {
           dataSource: currentDataSource,
           getRowId: currentGetRowId,
@@ -24012,9 +24025,15 @@ ${colorConfig.map(([key, itemConfig]) => {
           quickSearch: currentQuickSearch,
           pagination: currentPagination
         } = latestArgsRef.current;
-        abortRef.current?.abort();
+        inFlightFetchRef.current?.abort();
         const controller = new AbortController();
-        abortRef.current = controller;
+        inFlightFetchRef.current = controller;
+        const fetchKey = {
+          dataSource: currentDataSource,
+          sortingKey: JSON.stringify(currentSorting),
+          quickSearchKey: currentQuickSearch,
+          pageSize: currentPagination.pageSize
+        };
         if (append) {
           setIsLoadingMore(true);
         } else {
@@ -24023,16 +24042,18 @@ ${colorConfig.map(([key, itemConfig]) => {
           } else {
             setIsLoading(true);
           }
-          cursorRef.current = void 0;
-          pageIndexRef.current = 0;
         }
         setError(null);
+        let cursor = append ? cursorRef.current : void 0;
+        let pageIndex = append ? pageIndexRef.current : 0;
+        let failed = false;
+        let committedResult = false;
         try {
           const params = {
             sorting: currentSorting,
             quickSearch: currentQuickSearch,
-            pagination: append ? { pageIndex: pageIndexRef.current, pageSize: currentPagination.pageSize } : currentPagination,
-            cursor: cursorRef.current
+            pagination: append ? { pageIndex, pageSize: currentPagination.pageSize } : currentPagination,
+            cursor
           };
           const gen = currentDataSource(params);
           for await (const result of gen) {
@@ -24041,9 +24062,11 @@ ${colorConfig.map(([key, itemConfig]) => {
               setTotalRowCount(result.totalRowCount);
             }
             if (result.nextCursor !== void 0) {
-              cursorRef.current = result.nextCursor;
+              cursor = result.nextCursor;
             }
-            setHasMore(result.hasMore !== false);
+            cursorRef.current = cursor;
+            hasMoreRef.current = result.hasMore !== false;
+            setHasMore(hasMoreRef.current);
             if (append) {
               setRows((prev) => {
                 const existingIds = new Set(prev.map(currentGetRowId));
@@ -24053,29 +24076,50 @@ ${colorConfig.map(([key, itemConfig]) => {
                 return [...prev, ...newRows];
               });
             } else {
+              lastCompletedNonAppendFetchKeyRef.current = null;
               setRows(result.rows);
             }
             hasDataRef.current = true;
-            pageIndexRef.current++;
+            committedResult = true;
+            pageIndex++;
+            pageIndexRef.current = pageIndex;
+          }
+          if (!append && committedResult && !controller.signal.aborted) {
+            lastCompletedNonAppendFetchKeyRef.current = fetchKey;
           }
         } catch (err) {
           if (controller.signal.aborted) return;
           console.error("[DataGrid] Data source error:", err);
+          failed = true;
           setError(err instanceof Error ? err : new Error(String(err)));
         } finally {
-          if (!controller.signal.aborted) {
+          if (inFlightFetchRef.current === controller) {
+            inFlightFetchRef.current = null;
             setIsLoading(false);
             setIsRefetching(false);
             setIsLoadingMore(false);
+            const shouldChainLoadMore = pendingLoadMoreRef.current && !failed && !controller.signal.aborted && hasMoreRef.current && paginationModeRef.current === "infinite";
+            pendingLoadMoreRef.current = false;
+            if (shouldChainLoadMore) {
+              runAsynchronously(fetchPage(true));
+            }
           }
         }
       },
       []
     );
     (0, import_react36.useEffect)(() => {
-      fetchPage(false).catch(() => {
-      });
-      return () => abortRef.current?.abort();
+      if (paginationMode !== "infinite") {
+        pendingLoadMoreRef.current = false;
+      }
+    }, [paginationMode]);
+    (0, import_react36.useEffect)(() => {
+      const lastCompletedKey = lastCompletedNonAppendFetchKeyRef.current;
+      const isSameCompletedFetch = hasDataRef.current && lastCompletedKey?.dataSource === dataSource && lastCompletedKey.sortingKey === sortingKey && lastCompletedKey.quickSearchKey === quickSearchKey && lastCompletedKey.pageSize === pagination.pageSize;
+      if (!isSameCompletedFetch) {
+        runAsynchronously(fetchPage(false));
+      }
+      return () => inFlightFetchRef.current?.abort();
     }, [fetchPage, dataSource, sortingKey, quickSearchKey, pagination.pageSize]);
     (0, import_react36.useEffect)(() => {
       if (paginationMode !== "server") {
@@ -24086,18 +24130,20 @@ ${colorConfig.map(([key, itemConfig]) => {
         hasMountedServerPaginationRef.current = true;
         return;
       }
-      fetchPage(false).catch(() => {
-      });
+      runAsynchronously(fetchPage(false));
     }, [fetchPage, paginationMode, pagination.pageIndex]);
     const loadMore = (0, import_react36.useCallback)(() => {
-      if (!isLoadingMore && hasMore && paginationMode === "infinite") {
-        fetchPage(true).catch(() => {
-        });
+      if (paginationMode !== "infinite" || !hasMore) {
+        return;
+      }
+      if (inFlightFetchRef.current != null) {
+        pendingLoadMoreRef.current = true;
+        return;
       }
-    }, [isLoadingMore, hasMore, paginationMode, fetchPage]);
+      runAsynchronously(fetchPage(true));
+    }, [hasMore, paginationMode, fetchPage]);
     const reload = (0, import_react36.useCallback)(() => {
-      fetchPage(false).catch(() => {
-      });
+      runAsynchronously(fetchPage(false));
     }, [fetchPage]);
     return {
       rows,