@yuno-payments/dashboard-design-system 0.0.121 → 0.0.122

package/dist/components/organisms/sheet/sheet.js

@@ -1,14 +1,14 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import * as m from "react";
-import { createPortal as C } from "react-dom";
-import { cva as x } from "../../../node_modules/class-variance-authority/dist/index.js";
-import { normalizeDimension as h, cn as r } from "../../../lib/utils.js";
-import { useBodyScrollLock as H } from "../../../hooks/use-body-scroll-lock.js";
-import { useEscapeKey as W } from "../../../hooks/use-escape-key.js";
-import { Icon as D } from "../../atoms/icon/icon.js";
-import { Button as u } from "../../atoms/button/button.js";
-import { Typography as p } from "../../atoms/typography/typography.js";
-const F = x(
+import * as i from "react";
+import { createPortal as H } from "react-dom";
+import { cva as g } from "../../../node_modules/class-variance-authority/dist/index.js";
+import { normalizeDimension as p, cn as r } from "../../../lib/utils.js";
+import { useBodyScrollLock as M } from "../../../hooks/use-body-scroll-lock.js";
+import { useEscapeKey as R } from "../../../hooks/use-escape-key.js";
+import { Icon as W } from "../../atoms/icon/icon.js";
+import { Button as x } from "../../atoms/button/button.js";
+import { Typography as b } from "../../atoms/typography/typography.js";
+const D = g(
   "fixed z-[1000000] bg-background shadow-lg transition-transform duration-300 ease-in-out",
   {
     variants: {
@@ -38,7 +38,7 @@ const F = x(
       isOpen: !1
     }
   }
-), I = x(
+), F = g(
   "fixed inset-0 z-[1000000] bg-black/50 transition-opacity duration-300",
   {
     variants: {
@@ -51,119 +51,120 @@ const F = x(
       isOpen: !1
     }
   }
-), K = m.forwardRef(
+), K = i.forwardRef(
   ({
-    className: b,
-    side: t = "right",
-    title: i,
-    description: l,
-    open: s,
-    onClose: o,
+    className: y,
+    side: s = "right",
+    title: l,
+    description: o,
+    open: a,
+    onClose: n,
     buttons: c = [],
-    width: y,
-    height: g,
-    showHeader: j = !0,
-    showFooter: v = !0,
-    children: O,
-    headerClassName: N,
-    contentClassName: w,
-    footerClassName: S,
-    loading: k = !1,
-    ...z
-  }, V) => {
-    const [R, f] = m.useState(s);
-    if (H(s), W(s, o), m.useEffect(() => {
-      if (s)
+    width: j,
+    height: v,
+    showHeader: O = !0,
+    showFooter: N = !0,
+    children: w,
+    headerClassName: S,
+    contentClassName: k,
+    footerClassName: z,
+    loading: T = !1,
+    ...V
+  }, E) => {
+    const [I, f] = i.useState(!1), [u, h] = i.useState(!1);
+    if (M(a), R(a, n), i.useEffect(() => {
+      if (a) {
         f(!0);
-      else {
-        const a = setTimeout(() => {
-          f(!1);
-        }, 300);
-        return () => clearTimeout(a);
+        const t = setTimeout(() => h(!0), 10);
+        return () => clearTimeout(t);
+      } else {
+        h(!1);
+        const t = setTimeout(() => f(!1), 310);
+        return () => clearTimeout(t);
       }
-    }, [s]), !R) return null;
-    const n = h(y), d = h(g), E = {
-      ...n && (t === "left" || t === "right") ? { width: n, maxWidth: n } : {},
-      ...d && (t === "top" || t === "bottom") ? { height: d, maxHeight: d } : {}
-    }, T = /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    }, [a]), !I) return null;
+    const d = p(j), m = p(v), A = {
+      ...d && (s === "left" || s === "right") ? { width: d, maxWidth: d } : {},
+      ...m && (s === "top" || s === "bottom") ? { height: m, maxHeight: m } : {}
+    }, B = /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
       /* @__PURE__ */ e.jsx(
         "div",
         {
-          className: I({ isOpen: s }),
-          onClick: o,
+          className: F({ isOpen: u }),
+          onClick: n,
           "aria-hidden": "true"
         }
       ),
       /* @__PURE__ */ e.jsx(
         "div",
         {
-          ref: V,
-          className: r(F({ side: t, isOpen: s }), b),
-          style: E,
+          ref: E,
+          className: r(D({ side: s, isOpen: u }), y),
+          style: A,
           role: "dialog",
           "aria-modal": "true",
-          "aria-labelledby": i ? "sheet-title" : void 0,
-          "aria-describedby": l ? "sheet-description" : void 0,
-          ...z,
+          "aria-labelledby": l ? "sheet-title" : void 0,
+          "aria-describedby": o ? "sheet-description" : void 0,
+          ...V,
           children: /* @__PURE__ */ e.jsxs("div", { className: "flex h-full flex-col", children: [
-            j && /* @__PURE__ */ e.jsxs(
+            O && /* @__PURE__ */ e.jsxs(
               "div",
               {
                 className: r(
                   "flex items-center justify-between border-b border-border p-6",
-                  N
+                  S
                 ),
                 children: [
                   /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1", children: [
-                    i && /* @__PURE__ */ e.jsx(
-                      p,
+                    l && /* @__PURE__ */ e.jsx(
+                      b,
                       {
                         id: "sheet-title",
                         as: "h2",
                         variant: "h3",
                         className: "font-semibold",
-                        children: i
+                        children: l
                       }
                     ),
-                    l && /* @__PURE__ */ e.jsx(
-                      p,
+                    o && /* @__PURE__ */ e.jsx(
+                      b,
                       {
                         id: "sheet-description",
                         variant: "muted",
                         className: "text-sm",
-                        children: l
+                        children: o
                       }
                     )
                   ] }),
                   /* @__PURE__ */ e.jsx(
-                    u,
+                    x,
                     {
                       variant: "ghost",
                       size: "icon",
-                      onClick: o,
+                      onClick: n,
                       "aria-label": "Close",
                       className: "h-6 w-6",
-                      children: /* @__PURE__ */ e.jsx(D, { name: "X", size: "md" })
+                      children: /* @__PURE__ */ e.jsx(W, { name: "X", size: "md" })
                     }
                   )
                 ]
               }
             ),
-            /* @__PURE__ */ e.jsx("div", { className: r("flex-1 overflow-y-auto p-6", w), children: O }),
-            v && c.length > 0 && /* @__PURE__ */ e.jsx(
+            /* @__PURE__ */ e.jsx("div", { className: r("flex-1 overflow-y-auto p-6", k), children: w }),
+            N && c.length > 0 && /* @__PURE__ */ e.jsx(
               "div",
               {
                 className: r(
                   "flex items-center justify-end gap-3 border-t border-border p-6",
-                  S
+                  z
                 ),
-                children: c.map((a, B) => /* @__PURE__ */ e.jsx(
-                  u,
+                children: c.map((t, C) => /* @__PURE__ */ e.jsx(
+                  x,
                   {
-                    disabled: k || a.disabled,
-                    ...a
+                    disabled: T || t.disabled,
+                    ...t
                   },
-                  B
+                  C
                 ))
               }
             )
@@ -171,7 +172,7 @@ const F = x(
         }
       )
     ] });
-    return C(T, document.body);
+    return H(B, document.body);
   }
 );
 K.displayName = "Sheet";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuno-payments/dashboard-design-system",
-  "version": "0.0.121",
+  "version": "0.0.122",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",