@inf-monkeys-tech/monkeys-design 1.0.53 → 1.0.54

package/dist/index.mjs

@@ -17828,7 +17828,7 @@ var InputGroupInput = React4.forwardRef(({ className, ...props }, ref) => /* @__
     ref,
     "data-slot": "input-group-control",
     className: cn(
-      "flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent",
+      "flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 dark:bg-transparent",
       className
     ),
     ...props
@@ -17841,7 +17841,7 @@ var InputGroupTextarea = React4.forwardRef(({ className, ...props }, ref) => /*
     ref,
     "data-slot": "input-group-control",
     className: cn(
-      "flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent",
+      "flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 dark:bg-transparent",
       className
     ),
     ...props
@@ -23253,7 +23253,11 @@ function WorkbenchCollection({
   const itemsRef = useRef(null);
   const loadMoreRef = useRef(null);
   const lastSelectedIndexRef = useRef(null);
-  const loadMoreLockedRef = useRef(false);
+  const loadMoreRequestPendingRef = useRef(false);
+  const loadMoreIntersectionActiveRef = useRef(false);
+  const loadMoreIntersectionConsumedRef = useRef(false);
+  const loadMoreScrollValidationPendingRef = useRef(false);
+  const observedLoadMoreTargetRef = useRef(null);
   const layoutReadyRef = useRef(false);
   const [containerWidth, setContainerWidth] = useState(0);
   const [itemsNode, setItemsNode] = useState(null);
@@ -23411,38 +23415,91 @@ function WorkbenchCollection({
   const canLoadMore = typeof callbacks?.onLoadMore === "function";
   const effectiveError = state?.error ?? virtualizationError;
   useEffect(() => {
-    if (!loadingMore || !hasMore) loadMoreLockedRef.current = false;
-  }, [hasMore, loadingMore, normalizedItems.length, keysSignature]);
+    if (!canLoadMore || !hasMore) {
+      loadMoreIntersectionActiveRef.current = false;
+      loadMoreIntersectionConsumedRef.current = false;
+      loadMoreScrollValidationPendingRef.current = false;
+    }
+  }, [canLoadMore, hasMore]);
   const requestLoadMore = useCallback(() => {
-    if (!canLoadMore || !hasMore || loadingMore || loadMoreLockedRef.current) return;
-    loadMoreLockedRef.current = true;
+    if (!canLoadMore || !hasMore || loadingMore || loadMoreRequestPendingRef.current) return;
+    loadMoreRequestPendingRef.current = true;
+    const releaseRequest = () => {
+      loadMoreRequestPendingRef.current = false;
+    };
     try {
       const result = callbacksRef.current?.onLoadMore?.();
       if (result && typeof result.then === "function") {
-        void result.catch(() => {
-          loadMoreLockedRef.current = false;
-        });
+        void result.then(releaseRequest, releaseRequest);
+      } else {
+        releaseRequest();
       }
     } catch (error) {
-      loadMoreLockedRef.current = false;
+      releaseRequest();
       throw error;
     }
   }, [canLoadMore, hasMore, loadingMore]);
   useEffect(() => {
     const sentinel = loadMoreRef.current;
-    if (!sentinel || !canLoadMore || !hasMore || loadingMore) return void 0;
+    if (observedLoadMoreTargetRef.current !== sentinel) {
+      observedLoadMoreTargetRef.current = sentinel;
+      loadMoreIntersectionActiveRef.current = false;
+      loadMoreIntersectionConsumedRef.current = false;
+      loadMoreScrollValidationPendingRef.current = false;
+    }
+    if (!sentinel || !canLoadMore || !hasMore) return void 0;
     if (typeof IntersectionObserver !== "function") return void 0;
     const owner = resolveScrollOwner();
+    let observerHasDelivered = false;
     const observer = new IntersectionObserver((entries) => {
-      if (!entries.some((entry) => entry.isIntersecting)) return;
+      const isIntersecting = entries.some((entry) => entry.isIntersecting);
+      if (loadMoreScrollValidationPendingRef.current) {
+        observerHasDelivered = true;
+        loadMoreScrollValidationPendingRef.current = false;
+        loadMoreIntersectionActiveRef.current = isIntersecting;
+        if (!isIntersecting) {
+          loadMoreIntersectionConsumedRef.current = false;
+          return;
+        }
+        if (loadMoreIntersectionConsumedRef.current) return;
+        loadMoreIntersectionConsumedRef.current = true;
+        requestLoadMore();
+        return;
+      }
+      if (!observerHasDelivered) {
+        observerHasDelivered = true;
+        loadMoreIntersectionActiveRef.current = isIntersecting;
+        if (!isIntersecting) loadMoreIntersectionConsumedRef.current = false;
+        return;
+      }
+      if (!isIntersecting) {
+        loadMoreIntersectionActiveRef.current = false;
+        loadMoreIntersectionConsumedRef.current = false;
+        return;
+      }
+      if (loadMoreIntersectionActiveRef.current) return;
+      loadMoreIntersectionActiveRef.current = true;
+      loadMoreIntersectionConsumedRef.current = true;
       requestLoadMore();
     }, {
       root: owner === rootRef.current ? owner : owner || null,
       rootMargin: config.loading?.rootMargin ?? "240px",
       threshold: normalizeThreshold(config.loading?.threshold)
     });
+    const scrollTarget = owner ?? (typeof window === "undefined" ? null : window);
+    const validateActiveIntersection = () => {
+      if (!loadMoreIntersectionActiveRef.current || loadMoreIntersectionConsumedRef.current || loadMoreScrollValidationPendingRef.current) return;
+      loadMoreScrollValidationPendingRef.current = true;
+      observer.unobserve(sentinel);
+      observer.takeRecords();
+      observer.observe(sentinel);
+    };
     observer.observe(sentinel);
-    return () => observer.disconnect();
+    scrollTarget?.addEventListener("scroll", validateActiveIntersection, { passive: true });
+    return () => {
+      observer.disconnect();
+      scrollTarget?.removeEventListener("scroll", validateActiveIntersection);
+    };
   }, [canLoadMore, config.loading?.rootMargin, config.loading?.threshold, hasMore, keysSignature, loadingMore, normalizedItems.length, requestLoadMore, resolveScrollOwner]);
   useEffect(() => {
     if (!config.loading?.autoFill || !canLoadMore || !hasMore || loadingMore) return;
@@ -23450,7 +23507,10 @@ function WorkbenchCollection({
     if (!sentinel) return;
     const owner = resolveScrollOwner() ?? (config.layout.scrollOwner === "parent" ? rootRef.current?.parentElement ?? null : null) ?? rootRef.current;
     if (!owner || owner.clientHeight <= 0) return;
-    if (owner.scrollHeight <= owner.clientHeight + 1) requestLoadMore();
+    if (owner.scrollHeight <= owner.clientHeight + 1) {
+      loadMoreIntersectionConsumedRef.current = true;
+      requestLoadMore();
+    }
   }, [
     canLoadMore,
     config.layout.scrollOwner,