@hexdspace/react 0.1.19 → 0.1.21

package/dist/css/component.css

@@ -143,64 +143,6 @@
         }
     }
 
-    @keyframes dialog-overlay-in {
-        from {
-            opacity: 0;
-        }
-        to {
-            opacity: 1;
-        }
-    }
-
-    @keyframes dialog-overlay-out {
-        from {
-            opacity: 1;
-        }
-        to {
-            opacity: 0;
-        }
-    }
-
-    @keyframes dialog-fade-in {
-        from {
-            opacity: 0;
-        }
-        to {
-            opacity: 1;
-        }
-    }
-
-    @keyframes dialog-fade-out {
-        from {
-            opacity: 1;
-        }
-        to {
-            opacity: 0;
-        }
-    }
-
-    @keyframes dialog-surface-in {
-        from {
-            opacity: 0;
-            transform: translateY(1.25rem);
-        }
-        to {
-            opacity: 1;
-            transform: translateY(0);
-        }
-    }
-
-    @keyframes dialog-surface-out {
-        from {
-            opacity: 1;
-            transform: translateY(0);
-        }
-        to {
-            opacity: 0;
-            transform: translateY(1.25rem);
-        }
-    }
-
     :root .prose code {
         background: rgba(0, 0, 0, 0.08);
         padding: 3px 3px 0;

package/dist/index.js

@@ -1586,7 +1586,7 @@ var dialogSurfaceVariants = cva2("dialog-surface relative overflow-hidden", {
   }
 });
 function DialogContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx7("div", { className: cn("DialogContent p-6", className), ...props });
+  return /* @__PURE__ */ jsx7("div", { className: cn("p-6", className), ...props });
 }
 function AutoHeight({
   children,
@@ -1640,8 +1640,7 @@ function AutoHeight({
       transition: { duration: durationSeconds, ease: "easeOut" },
       style: {
         maxHeight: "calc(100vh - 4rem)",
-        overflow: "auto",
-        willChange: "height"
+        overflow: "auto"
       },
       children: /* @__PURE__ */ jsx7("div", { ref, style: { boxSizing: "border-box" }, children })
     }
@@ -1695,12 +1694,10 @@ function Dialog({
   const isControlled = open2 !== void 0;
   const [uncontrolledOpen, setUncontrolledOpen] = React2.useState(defaultOpen ?? false);
   const isOpen = isControlled ? open2 : uncontrolledOpen;
-  const prevOpenRef = React2.useRef(false);
-  const [contentCycle, setContentCycle] = React2.useState(0);
   const [surfaceReady, setSurfaceReady] = React2.useState(false);
   const [overlayReady, setOverlayReady] = React2.useState(false);
   const Template = template;
-  const motionDuration = useMotionDuration("--motion-fast", 0.16);
+  const motionDuration = useMotionDuration("--motion-med", 0.16);
   const handleOpenChange = (nextOpen) => {
     if (!isControlled) setUncontrolledOpen(nextOpen);
     onOpenChange?.(nextOpen);
@@ -1721,16 +1718,6 @@ function Dialog({
     },
     [onResolve]
   );
-  React2.useEffect(() => {
-    const wasOpen = prevOpenRef.current;
-    prevOpenRef.current = Boolean(isOpen);
-    if (isOpen && !wasOpen) {
-      setContentCycle((value) => value + 1);
-      setSurfaceReady(false);
-      setOverlayReady(false);
-      return;
-    }
-  }, [isOpen]);
   const handleAutoHeightReady = React2.useCallback(() => {
     if (!isOpen) return;
     requestAnimationFrame(() => {
@@ -1738,7 +1725,7 @@ function Dialog({
       setOverlayReady(true);
     });
   }, [isOpen]);
-  const overlayClassName = cn("DialogOverlay", dialogOverlayClass);
+  const overlayClassName = cn(dialogOverlayClass);
   const surfaceClassName = cn(dialogSurfaceVariants({ chrome }));
   return /* @__PURE__ */ jsxs3(DialogPrimitive.Root, { open: open2, defaultOpen, onOpenChange: handleOpenChange, modal, children: [
     trigger ? /* @__PURE__ */ jsx7(DialogPrimitive.Trigger, { asChild: true, children: trigger }) : null,
@@ -1749,16 +1736,8 @@ function Dialog({
           className: overlayClassName,
           style: { zIndex: zIndex - 1 },
           variants: {
-            open: {
-              opacity: 1,
-              pointerEvents: "auto",
-              transition: { duration: motionDuration, ease: "easeOut" }
-            },
-            closed: {
-              opacity: 0,
-              pointerEvents: "none",
-              transition: { duration: motionDuration, ease: "easeOut" }
-            }
+            open: { opacity: 1, pointerEvents: "auto", transition: { duration: motionDuration, ease: "easeOut" } },
+            closed: { opacity: 0, pointerEvents: "none", transition: { duration: motionDuration, ease: "easeOut" } }
           },
           initial: "closed",
           animate: overlayReady ? "open" : "closed",
@@ -1780,23 +1759,15 @@ function Dialog({
           children: /* @__PURE__ */ jsx7(
             motion.div,
             {
-              className: cn("DialogContent", dialogPanelVariants(), className),
+              className: cn(dialogPanelVariants(), className),
               style: {
                 ...style,
                 zIndex,
                 "--dialog-width": `${maxWidthPx}px`
               },
               variants: {
-                open: {
-                  opacity: 1,
-                  pointerEvents: "auto",
-                  transition: { duration: motionDuration, ease: "easeOut" }
-                },
-                closed: {
-                  opacity: 0,
-                  pointerEvents: "none",
-                  transition: { duration: motionDuration, ease: "easeIn" }
-                }
+                open: { opacity: 1, pointerEvents: "auto", transition: { duration: motionDuration, ease: "easeOut" } },
+                closed: { opacity: 0, pointerEvents: "none", transition: { duration: motionDuration, ease: "easeIn" } }
               },
               initial: "open",
               animate: "open",
@@ -1805,18 +1776,9 @@ function Dialog({
                 motion.div,
                 {
                   className: surfaceClassName,
-                  style: { willChange: "transform" },
                   variants: {
-                    open: {
-                      opacity: 1,
-                      y: 0,
-                      transition: { duration: motionDuration, ease: "easeOut" }
-                    },
-                    closed: {
-                      opacity: 0,
-                      y: 20,
-                      transition: { duration: motionDuration, ease: "easeIn" }
-                    }
+                    open: { opacity: 1, y: 0, transition: { duration: motionDuration, ease: "easeOut" } },
+                    closed: { opacity: 0, y: 20, transition: { duration: motionDuration, ease: "easeIn" } }
                   },
                   initial: "closed",
                   animate: surfaceReady ? "open" : "closed",
@@ -1836,7 +1798,6 @@ function Dialog({
                       AutoHeight,
                       {
                         onReady: handleAutoHeightReady,
-                        resetKey: contentCycle,
                         durationSeconds: motionDuration,
                         children: /* @__PURE__ */ jsx7(
                           Template,
@@ -1882,6 +1843,7 @@ var CustomDialog = (props) => {
   const p = props.payload ?? { children: /* @__PURE__ */ jsx9("div", { children: "Empty custom dialog" }) };
   return /* @__PURE__ */ jsxs5(DialogContent, { children: [
     /* @__PURE__ */ jsx9(DialogPrimitive3.Title, { className: "sr-only", children: p.title ?? "Dialog" }),
+    /* @__PURE__ */ jsx9(DialogPrimitive3.Description, { "aria-describedby": void 0 }),
     p.children
   ] });
 };
@@ -2547,7 +2509,7 @@ import { Tooltip as TooltipPrimitive } from "radix-ui";
 import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
 var tooltipContentBase = cn(
   "panel shadow-none px-4 py-2.5 text-xs z-5000 select-none",
-  "origin-center will-change-[transform,opacity]",
+  "origin-center",
   "[--tooltip-x:0px] [--tooltip-y:4px]",
   "data-[side=bottom]:[--tooltip-y:-4px]",
   "data-[side=left]:[--tooltip-x:4px] data-[side=left]:[--tooltip-y:0px]",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hexdspace/react",
-  "version": "0.1.19",
+  "version": "0.1.21",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -38,7 +38,7 @@
     "@tanstack/react-query": "^5.90.11",
     "lucide-react": "^0.555.0",
     "radix-ui": "^1.4.3",
-    "react": "^20.2.3",
+    "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "react-router-dom": "^7.10.1",
     "react-toastify": "^11.0.5"