@dgshahr/ui-kit 1.4.0 → 1.5.1

package/dist/Sidebar/index.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { jsxs as k, jsx as t } from "react/jsx-runtime";
+import { jsxs as g, jsx as s } from "react/jsx-runtime";
 import { c as r } from "../clsx-OuTLNxxd.js";
 import { createContext as M, useContext as D, useState as S, useCallback as R, useEffect as N, Fragment as E } from "react";
 import { d as P } from "../index-CzwAoGdL.js";
@@ -7,11 +7,11 @@ import { I as H } from "../IconSearch-aShj2vmu.js";
 import _ from "../Badge/index.mjs";
 import { I as V } from "../index-ChP5zdaB.js";
 import '../assets/styles.css';/* empty css                 */
-import { A as F, a as G } from "../AccordionItem-4UuHvtDx.js";
+import { A as W, a as F } from "../AccordionItem-4UuHvtDx.js";
 import z from "../Divider/index.mjs";
 import { I as B } from "../IconArrowLeft2-cxcPyDqS.js";
-import L from "../Button/index.mjs";
-const U = (i) => /* @__PURE__ */ k(
+import K from "../Button/index.mjs";
+const G = (i) => /* @__PURE__ */ g(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -21,7 +21,7 @@ const U = (i) => /* @__PURE__ */ k(
     viewBox: "0 0 24 24",
     ...i,
     children: [
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ s(
         "path",
         {
           fill: "currentColor",
@@ -30,7 +30,7 @@ const U = (i) => /* @__PURE__ */ k(
           clipRule: "evenodd"
         }
       ),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ s(
         "path",
         {
           fill: "currentColor",
@@ -41,41 +41,41 @@ const U = (i) => /* @__PURE__ */ k(
       )
     ]
   }
-), f = "dgsuikit:duration-300", C = "dgsuikit:relative dgsuikit:transition-all dgsuikit:hover:bg-gray-50 dgsuikit:rounded-lg dgsuikit:focus:ring-[3px] dgsuikit:focus:ring-offset-1 dgsuikit:ring-offset-white dgsuikit:ring-primary-300 dgsuikit:text-gray-600", v = "dgsuikit:opacity-40 dgsuikit:pointer-events-none", I = "dgsuikit:!bg-primary-50 dgsuikit:text-primary-600", A = `${I} dgsuikit:before:content-[""] dgsuikit:before:absolute dgsuikit:before:w-1 dgsuikit:before:h-[22px] dgsuikit:before:rounded-l-md dgsuikit:before:bg-primary-500 dgsuikit:before:top-1/2 dgsuikit:before:-translate-y-1/2 dgsuikit:before:-right-4`, T = M({
+), h = "dgsuikit:duration-300", v = "dgsuikit:relative dgsuikit:transition-all dgsuikit:hover:bg-gray-50 dgsuikit:rounded-lg dgsuikit:focus:ring-[3px] dgsuikit:focus:ring-offset-1 dgsuikit:ring-offset-white dgsuikit:ring-primary-300 dgsuikit:text-gray-600", w = "dgsuikit:opacity-40 dgsuikit:pointer-events-none", I = "dgsuikit:!bg-primary-50 dgsuikit:text-primary-600", A = `${I} dgsuikit:before:content-[""] dgsuikit:before:absolute dgsuikit:before:w-1 dgsuikit:before:h-[22px] dgsuikit:before:rounded-l-md dgsuikit:before:bg-primary-500 dgsuikit:before:top-1/2 dgsuikit:before:-translate-y-1/2 dgsuikit:before:-right-4`, T = M({
   isOpen: !1,
   setIsOpen: () => {
   }
-}), h = () => D(T), b = (i) => r(
+}), m = () => D(T), x = (i) => r(
   "dgsuikit:transition-opacity dgsuikit:whitespace-pre dgsuikit:overflow-hidden",
   i ? "dgsuikit:opacity-100" : "dgsuikit:opacity-0",
-  f
+  h
 );
-function O(i, s) {
-  return /* @__PURE__ */ k(
+function O(i, t) {
+  return /* @__PURE__ */ g(
     "div",
     {
       className: r(
         "dgsuikit:flex dgsuikit:items-center dgsuikit:[&_svg]:size-6 dgsuikit:[&_svg]:shrink-0 dgsuikit:min-h-12 dgsuikit:text-start",
-        s ? "dgsuikit:space-x-2" : "dgsuikit:justify-center"
+        t ? "dgsuikit:space-x-2" : "dgsuikit:justify-center"
       ),
       children: [
         i.icon,
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ s(
           "div",
           {
             className: r(
               "dgsuikit:font-p2-regular dgsuikit:line-clamp-1 dgsuikit:!transition-[width,opacity]",
-              s ? "dgsuikit:w-full" : "dgsuikit:w-0",
-              b
+              t ? "dgsuikit:w-full" : "dgsuikit:w-0",
+              x
             ),
             children: i.title
           }
         ),
-        i.badgeCount && /* @__PURE__ */ t(
+        i.badgeCount && /* @__PURE__ */ s(
           _,
           {
             className: r("dgsuikit:shrink-0", {
-              "dgsuikit:!absolute dgsuikit:top-0 dgsuikit:left-0": !s
+              "dgsuikit:!absolute dgsuikit:top-0 dgsuikit:left-0": !t
             }),
             value: i.badgeCount,
             valueType: "number",
@@ -87,145 +87,158 @@ function O(i, s) {
     }
   );
 }
-function j(i, s) {
-  return i.map((e) => {
-    if ("children" in e && e.children) {
-      const o = j(e.children, s);
-      if (o.length > 0)
-        return { ...e, children: o };
+function j(i, t) {
+  return i.map((d) => {
+    if ("children" in d && d.children) {
+      const n = j(d.children, t);
+      if (n.length > 0)
+        return { ...d, children: n };
     }
-    return e.title.includes(s) ? { ...e } : null;
-  }).filter((e) => !!e);
+    return d.title.includes(t) ? { ...d } : null;
+  }).filter((d) => !!d);
 }
-const W = (i) => {
-  const { value: s, onChange: e } = i, { isOpen: o, searchInput: a } = h();
-  return /* @__PURE__ */ t(
+const U = (i) => {
+  const { value: t, onChange: d } = i, { isOpen: n, searchInput: o } = m();
+  return /* @__PURE__ */ s(
     V,
     {
-      value: s,
-      onChange: e,
-      rightIcon: /* @__PURE__ */ t(H, {}),
+      value: t,
+      onChange: d,
+      rightIcon: /* @__PURE__ */ s(H, {}),
       placeholder: "جستجو",
-      ...typeof a == "boolean" ? {} : a,
+      ...typeof o == "boolean" ? {} : o,
       wrapperClassName: r(
         "dgsuikit:mb-8 dgsuikit:sticky dgsuikit:top-0 dgsuikit:bg-white dgsuikit:z-10 dgsuikit:px-4",
-        b(o),
-        typeof a == "object" && a.wrapperClassName,
-        f
+        x(n),
+        typeof o == "object" && o.wrapperClassName,
+        h
       )
     }
   );
-}, $ = () => {
-  const { isOpen: i, searchInput: s = !0, items: e } = h(), [o, a] = S(""), [c, m] = S(e ?? []), x = R(
-    P((n) => {
-      m(j(c, n));
+};
+function $(i) {
+  let t = null;
+  return i.some((d) => d.children?.some((n) => n.children?.some((o) => o.active) ? (t = n, !0) : !1)), t;
+}
+const q = () => {
+  const { isOpen: i, searchInput: t = !0, items: d } = m(), [n, o] = S(""), [k, b] = S(d ?? []), c = $(k), y = R(
+    P((a) => {
+      b(j(k, a));
     }, 800),
     []
   );
-  function y(n) {
-    const g = n.target.value;
-    a(g), x(g);
+  function C(a) {
+    const f = a.target.value;
+    o(f), y(f);
   }
-  function w() {
-    a(""), m(e ?? []);
+  function p() {
+    o(""), b(d ?? []);
   }
   return N(() => {
-    o && w();
-  }, [i]), /* @__PURE__ */ k("div", { className: "dgsuikit:overflow-y-auto dgsuikit:overflow-x-hidden dgsuikit:-mx-4 dgsuikit:h-3/4 dgsuikit:no-scrollbar", children: [
-    !!s && /* @__PURE__ */ t(
-      W,
+    n && p();
+  }, [i]), /* @__PURE__ */ g("div", { className: "dgsuikit:overflow-y-auto dgsuikit:overflow-x-hidden dgsuikit:-mx-4 dgsuikit:h-3/4 dgsuikit:no-scrollbar", children: [
+    !!t && /* @__PURE__ */ s(
+      U,
       {
-        value: o,
-        onChange: y
+        value: n,
+        onChange: C
       }
     ),
-    /* @__PURE__ */ t("div", { className: "dgsuikit:space-y-6 dgsuikit:px-4", children: c.map((n, g) => /* @__PURE__ */ k(E, { children: [
-      /* @__PURE__ */ t(
+    /* @__PURE__ */ s("div", { className: "dgsuikit:space-y-6 dgsuikit:px-4", children: k.map((a, f) => /* @__PURE__ */ g(E, { children: [
+      /* @__PURE__ */ s(
         "div",
         {
           className: r(
             "dgsuikit:font-p2-regular dgsuikit:text-gray-400",
-            b(i)
+            x(i)
           ),
-          children: n.title
+          children: a.title
         }
       ),
-      /* @__PURE__ */ t(F, { className: "dgsuikit:mt-4 dgsuikit:space-y-2", children: n.children?.map(
-        (d) => d.link ? /* @__PURE__ */ t(
-          "a",
-          {
-            href: d.link,
-            className: r(
-              "dgsuikit:pr-3",
-              d.disabled && v,
-              d.active && A,
-              i ? "dgsuikit:pl-9" : "dgsuikit:pl-3",
-              C
-            ),
-            children: O(d, i)
-          },
-          d.link
-        ) : /* @__PURE__ */ t(
-          G,
-          {
-            className: r("dgsuikit:!p-0", d.disabled && v),
-            title: O(d, i),
-            hideDivider: !0,
-            hideArrow: !i || d.disabled,
-            disable: !i || d.disabled,
-            titleClassName: r(
-              "dgsuikit:[&_>div:first-child]:flex-1 dgsuikit:[&_>div:first-child]:pl-1",
-              i ? "dgsuikit:px-3" : "dgsuikit:!justify-center",
-              d.children?.find((u) => u.active) && A,
-              C
-            ),
-            children: d.children?.map((u) => /* @__PURE__ */ k(
+      /* @__PURE__ */ s(
+        W,
+        {
+          defaultActiveKey: c ? c.link || c.title : void 0,
+          className: "dgsuikit:mt-4 dgsuikit:space-y-2",
+          children: a.children?.map(
+            (e) => e.link ? /* @__PURE__ */ s(
               "a",
               {
-                href: u.link,
+                href: e.link,
                 className: r(
-                  "dgsuikit:flex dgsuikit:justify-between dgsuikit:h-10 dgsuikit:pl-9 dgsuikit:pr-11 dgsuikit:py-2 dgsuikit:mt-1 dgsuikit:first:mt-0",
-                  u.disabled && v,
-                  u.active && I,
-                  C
+                  "dgsuikit:pr-3",
+                  e.disabled && w,
+                  e.active && A,
+                  i ? "dgsuikit:pl-9" : "dgsuikit:pl-3",
+                  v
                 ),
-                children: [
-                  /* @__PURE__ */ t("p", { children: u.title }),
-                  u.badgeCount && /* @__PURE__ */ t(
-                    _,
-                    {
-                      valueType: "number",
-                      value: u.badgeCount,
-                      color: "error",
-                      type: "twoTone",
-                      size: "small"
-                    }
-                  )
-                ]
+                children: O(e, i)
               },
-              u.link
-            ))
-          },
-          d.link ?? d.title
-        )
-      ) }),
-      g !== c.length - 1 && /* @__PURE__ */ t(z, { type: "horizontal" })
-    ] }, n.title)) })
+              e.link
+            ) : /* @__PURE__ */ s(
+              F,
+              {
+                accordionKey: e.link ?? e.title,
+                className: r("dgsuikit:!p-0", e.disabled && w),
+                title: O(e, i),
+                hideDivider: !0,
+                hideArrow: !i || e.disabled,
+                disable: !i || e.disabled,
+                titleClassName: r(
+                  "dgsuikit:[&_>div:first-child]:flex-1 dgsuikit:[&_>div:first-child]:pl-1",
+                  i ? "dgsuikit:px-3" : "dgsuikit:!justify-center",
+                  (c?.link && c?.link === e.link || c?.title === e.title) && A,
+                  v
+                ),
+                children: e.children?.map((u) => /* @__PURE__ */ g(
+                  "a",
+                  {
+                    href: u.link,
+                    className: r(
+                      "dgsuikit:flex dgsuikit:justify-between dgsuikit:h-10 dgsuikit:pl-9 dgsuikit:pr-11 dgsuikit:py-2 dgsuikit:mt-1 dgsuikit:first:mt-0",
+                      u.disabled && w,
+                      u.active && I,
+                      v
+                    ),
+                    children: [
+                      /* @__PURE__ */ s("p", { children: u.title }),
+                      u.badgeCount && /* @__PURE__ */ s(
+                        _,
+                        {
+                          valueType: "number",
+                          value: u.badgeCount,
+                          color: "error",
+                          type: "twoTone",
+                          size: "small"
+                        }
+                      )
+                    ]
+                  },
+                  u.link
+                ))
+              },
+              e.link ?? e.title
+            )
+          )
+        }
+      ),
+      f !== k.length - 1 && /* @__PURE__ */ s(z, { type: "horizontal" })
+    ] }, a.title)) })
   ] });
-}, q = () => {
-  const { isOpen: i, logo: s } = h();
-  return /* @__PURE__ */ t("div", { className: "dgsuikit:flex dgsuikit:justify-center dgsuikit:items-center dgsuikit:mb-8", children: /* @__PURE__ */ t(
+}, J = () => {
+  const { isOpen: i, logo: t } = m();
+  return /* @__PURE__ */ s("div", { className: "dgsuikit:flex dgsuikit:justify-center dgsuikit:items-center dgsuikit:mb-8", children: /* @__PURE__ */ s(
     "img",
     {
-      ...s,
-      alt: s?.alt ?? "Logo",
-      src: i ? s?.open : s?.close,
-      className: r("dgsuikit:h-12 dgsuikit:w-full", s?.className)
+      ...t,
+      alt: t?.alt ?? "Logo",
+      src: i ? t?.open : t?.close,
+      className: r("dgsuikit:h-12 dgsuikit:w-full", t?.className)
     }
   ) });
-}, J = () => {
-  const { userProfile: i, isOpen: s } = h();
-  return /* @__PURE__ */ k(
+}, Q = () => {
+  const { userProfile: i, isOpen: t } = m();
+  return /* @__PURE__ */ g(
     "a",
     {
       href: i?.link ?? "#",
@@ -236,46 +249,46 @@ const W = (i) => {
         }
       ),
       children: [
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ s(
           "img",
           {
             src: i?.image,
             alt: i?.name ?? "user_avatar",
             className: r(
               "dgsuikit:rounded-full dgsuikit:shrink-0",
-              s ? "dgsuikit:size-20" : "dgsuikit:size-12"
+              t ? "dgsuikit:size-20" : "dgsuikit:size-12"
             )
           }
         ),
-        /* @__PURE__ */ k(
+        /* @__PURE__ */ g(
           "div",
           {
-            className: r("dgsuikit:mt-2 dgsuikit:w-full dgsuikit:relative", b(s)),
+            className: r("dgsuikit:mt-2 dgsuikit:w-full dgsuikit:relative", x(t)),
             children: [
-              /* @__PURE__ */ t("p", { className: "dgsuikit:font-p3-medium dgsuikit:text-gray-700 dgsuikit:text-center", children: i?.name }),
-              /* @__PURE__ */ t("p", { className: "dgsuikit:font-p3-regular dgsuikit:text-gray-400 dgsuikit:text-center", children: i?.description }),
-              i?.link && /* @__PURE__ */ t(B, { className: "dgsuikit:absolute dgsuikit:top-1/2 dgsuikit:-translate-y-1/2 dgsuikit:left-0 dgsuikit:text-3xl dgsuikit:text-gray-500 dgsuikit:p-1 dgsuikit:rounded-lg dgsuikit:border dgsuikit:border-gray-200" })
+              /* @__PURE__ */ s("p", { className: "dgsuikit:font-p3-medium dgsuikit:text-gray-700 dgsuikit:text-center", children: i?.name }),
+              /* @__PURE__ */ s("p", { className: "dgsuikit:font-p3-regular dgsuikit:text-gray-400 dgsuikit:text-center", children: i?.description }),
+              i?.link && /* @__PURE__ */ s(B, { className: "dgsuikit:absolute dgsuikit:top-1/2 dgsuikit:-translate-y-1/2 dgsuikit:left-0 dgsuikit:text-3xl dgsuikit:text-gray-500 dgsuikit:p-1 dgsuikit:rounded-lg dgsuikit:border dgsuikit:border-gray-200" })
             ]
           }
         )
       ]
     }
   );
-}, K = () => {
-  const { isOpen: i, setIsOpen: s } = h();
-  return /* @__PURE__ */ t(
+}, X = () => {
+  const { isOpen: i, setIsOpen: t } = m();
+  return /* @__PURE__ */ s(
     "button",
     {
       type: "button",
       className: "dgsuikit:absolute dgsuikit:top-7 dgsuikit:left-0 dgsuikit:-translate-x-1/2 dgsuikit:p-1 dgsuikit:rounded-lg dgsuikit:border dgsuikit:border-gray-300 dgsuikit:bg-white",
-      onClick: () => s(!i),
-      children: /* @__PURE__ */ t(
+      onClick: () => t(!i),
+      children: /* @__PURE__ */ s(
         B,
         {
           className: r(
             "dgsuikit:transition-transform dgsuikit:text-primary-500",
             i && "dgsuikit:rotate-180",
-            f
+            h
           ),
           width: 16,
           height: 16
@@ -285,86 +298,86 @@ const W = (i) => {
   );
 }, ai = (i) => {
   const {
-    isOpen: s,
-    setIsOpen: e,
-    className: o,
-    logo: a,
-    items: c,
-    extraComponent: m,
-    userProfile: x,
+    isOpen: t,
+    setIsOpen: d,
+    className: n,
+    logo: o,
+    items: k,
+    extraComponent: b,
+    userProfile: c,
     logOutButtonProps: y,
-    onLogout: w,
-    showMask: n,
-    hideOnClose: g
-  } = i, d = i.openOnHover, u = n ? "div" : E, p = document.documentElement;
+    onLogout: C,
+    showMask: p,
+    hideOnClose: a
+  } = i, f = i.openOnHover, e = p ? "div" : E, u = document.documentElement;
   return N(() => {
-    if (g) return;
+    if (a) return;
     const l = "dgsuikit:pr-[80px]";
-    return p.classList.add(l), () => {
-      p.classList.remove(l);
+    return u.classList.add(l), () => {
+      u.classList.remove(l);
     };
-  }, [g]), N(() => {
-    if (!n) return;
+  }, [a]), N(() => {
+    if (!p) return;
     const l = "dgsuikit:overflow-hidden";
-    return s ? p.classList.add(l) : p.classList.remove(l), () => {
-      p.classList.remove(l);
+    return t ? u.classList.add(l) : u.classList.remove(l), () => {
+      u.classList.remove(l);
     };
-  }, [n, s]), /* @__PURE__ */ t(T.Provider, { value: i, children: /* @__PURE__ */ t(
-    u,
+  }, [p, t]), /* @__PURE__ */ s(T.Provider, { value: i, children: /* @__PURE__ */ s(
+    e,
     {
-      ...u === "div" ? {
+      ...e === "div" ? {
         className: r(
           "dgsuikit:fixed dgsuikit:top-0 dgsuikit:left-0 dgsuikit:z-40 dgsuikit:overflow-hidden dgsuikit:transition-[background-color] dgsuikit:ease-linear",
-          s ? "dgsuikit:size-full dgsuikit:bg-black/40" : "dgsuikit:size-0 dgsuikit:bg-transparent",
-          f
+          t ? "dgsuikit:size-full dgsuikit:bg-black/40" : "dgsuikit:size-0 dgsuikit:bg-transparent",
+          h
         ),
         onClick: (l) => {
-          l.target === l.currentTarget && e(!1);
+          l.target === l.currentTarget && d(!1);
         }
       } : {},
-      children: /* @__PURE__ */ k(
+      children: /* @__PURE__ */ g(
         "div",
         {
           className: r(
-            o,
+            n,
             "dgsuikit:flex dgsuikit:flex-col dgsuikit:fixed dgsuikit:top-0 dgsuikit:right-0 dgsuikit:bg-white dgsuikit:shadow-md dgsuikit:h-full dgsuikit:p-4 dgsuikit:pt-6 dgsuikit:transition-[width,max-width,opacity]",
             {
-              "dgsuikit:w-[280px] dgsuikit:max-w-full": s,
-              "dgsuikit:w-[80px] dgsuikit:max-w-[80px]": !s && !g,
-              "dgsuikit:w-0 dgsuikit:opacity-0": !s && g
+              "dgsuikit:w-[280px] dgsuikit:max-w-full": t,
+              "dgsuikit:w-[80px] dgsuikit:max-w-[80px]": !t && !a,
+              "dgsuikit:w-0 dgsuikit:opacity-0": !t && a
             },
-            f
+            h
           ),
           onMouseEnter: () => {
-            d && !s && e(!0);
+            f && !t && d(!0);
           },
           onMouseLeave: () => {
-            d && s && e(!1);
+            f && t && d(!1);
           },
           children: [
-            /* @__PURE__ */ t(K, {}),
-            !!(a?.open ?? a?.close) && /* @__PURE__ */ t(q, {}),
-            c && c.length > 0 && /* @__PURE__ */ t($, {}),
-            /* @__PURE__ */ k("div", { className: "dgsuikit:shrink-0 dgsuikit:flex-1", children: [
-              m,
-              /* @__PURE__ */ t(
+            /* @__PURE__ */ s(X, {}),
+            !!(o?.open ?? o?.close) && /* @__PURE__ */ s(J, {}),
+            k && k.length > 0 && /* @__PURE__ */ s(q, {}),
+            /* @__PURE__ */ g("div", { className: "dgsuikit:shrink-0 dgsuikit:flex-1", children: [
+              b,
+              /* @__PURE__ */ s(
                 z,
                 {
                   className: "dgsuikit:mt-6 dgsuikit:mb-4",
                   type: "horizontal"
                 }
               ),
-              !!x?.image && /* @__PURE__ */ t(J, {}),
-              /* @__PURE__ */ t(
-                L,
+              !!c?.image && /* @__PURE__ */ s(Q, {}),
+              /* @__PURE__ */ s(
+                K,
                 {
                   color: "error",
                   variant: "secondary",
-                  rightIcon: /* @__PURE__ */ t(U, {}),
+                  rightIcon: /* @__PURE__ */ s(G, {}),
                   isFullWidth: !0,
-                  onClick: w,
+                  onClick: C,
                   ...y,
-                  children: s ? "خروج" : ""
+                  children: t ? "خروج" : ""
                 }
               )
             ] })