@xwadex/fesd-next 0.3.25 → 0.3.26

package/dist/components/accordions/accordions.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback, useMemo, memo, useEffect } from "react";
+import { useCallback, useMemo, memo, useEffect, startTransition } from "react";
 import { AccordionsContext } from "./accordionsContext";
 import { useCollapse } from "../../hooks/index.js";
 const AccordionsBase = (props) => {
@@ -19,22 +19,22 @@ const AccordionsBase = (props) => {
         onExpand,
         onClose
     });
-    const isExpand = isActive ? active : open;
+    const isOpen = isActive ? active : open;
     const setExpand = useCallback((state) => {
-        const nextState = typeof state === "boolean" ? state : !isExpand;
-        if (nextState === isExpand)
+        const nextOpen = typeof state === "boolean" ? state : !isOpen;
+        if (nextOpen === isOpen)
             return;
         if (!isActive)
-            setOpen(nextState);
-        setOpen(nextState);
-    }, [isExpand, isActive, setOpen]);
+            return setOpen(nextOpen);
+        startTransition(() => setOpen(nextOpen));
+    }, [isOpen, isActive, setOpen]);
     useEffect(() => {
         if ((isActive && active) || defaultActive)
             setOpen(true);
     }, []);
     useEffect(() => {
-        setOpen(isExpand);
-    }, [isExpand,]);
+        setOpen(isOpen);
+    }, [isOpen]);
     const contextValue = useMemo(() => ({
         contentRef,
         setExpand

package/dist/hooks/useCollapse.js

@@ -1,16 +1,16 @@
 "use client";
-import { useCallback, useState, useRef, useEffect } from "react";
+import { useCallback, useState, useRef, useEffect, startTransition } from "react";
 import { getDomTransTime, sleep } from "../utils/index.js";
 export function useCollapse({ defaultOpen = false, transDuration = 0.3, transTiming = "cubic-bezier(.24,0,0,.99)", transMode = "normal", transDelay = 0, onInit, onChange, onExpand, onClose, }) {
     const contentRef = useRef(null);
-    const nextStateRef = useRef(null);
     const isMountedRef = useRef(false);
     const isAnimatingRef = useRef(false);
+    const nextOpenRef = useRef(null);
     const [open, setOpen] = useState(defaultOpen);
     const setOpenState = useCallback((state) => {
         if (!isAnimatingRef.current)
             return setOpen(state);
-        nextStateRef.current = state;
+        nextOpenRef.current = state;
     }, [open]);
     const setExpandTransition = useCallback((events) => {
         const target = contentRef.current;
@@ -41,10 +41,10 @@ export function useCollapse({ defaultOpen = false, transDuration = 0.3, transTim
         setExpandTransition(state ? "open" : "close");
         state ? onExpand?.(state) : onClose?.(state);
         isAnimatingRef.current = false;
-        const nextState = nextStateRef.current;
+        const nextState = nextOpenRef.current;
         if (nextState == null || nextState == state)
             return;
-        nextStateRef.current = null;
+        nextOpenRef.current = null;
         setOpen(nextState);
     }, [setExpandTransition, onChange, onExpand, onClose]);
     useEffect(() => {
@@ -56,7 +56,7 @@ export function useCollapse({ defaultOpen = false, transDuration = 0.3, transTim
         target.style.transitionDelay = transDelay + "s";
         target.style.transitionTimingFunction = transTiming;
         if (defaultOpen)
-            setExpandTransition("start");
+            startTransition(() => setExpandTransition("start"));
     }, []);
     useEffect(() => {
         if (!isMountedRef.current) {
@@ -64,11 +64,11 @@ export function useCollapse({ defaultOpen = false, transDuration = 0.3, transTim
             onInit?.(true);
             return;
         }
-        expandAnimate(open);
+        startTransition(() => expandAnimate(open));
     }, [open]);
     return {
         setOpen: setOpenState,
         contentRef,
-        open,
+        open
     };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xwadex/fesd-next",
-  "version": "0.3.25",
+  "version": "0.3.26",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",