1mpacto-react-ui 2.0.19 → 2.0.21

package/dist/components/Sidebar/ItemSidebar.mjs

@@ -1,56 +1,55 @@
-import { jsx as n, Fragment as N, jsxs as c } from "react/jsx-runtime";
-import { useState as l, isValidElement as b, createElement as q } from "react";
-import s from "./itemSidebar.module.scss.mjs";
+import { jsx as t, Fragment as $, jsxs as c } from "react/jsx-runtime";
+import { useState as M, isValidElement as a, createElement as j } from "react";
+import i from "./itemSidebar.module.scss.mjs";
 import { configItemSidebar as d } from "./ItemSidebar.config.mjs";
-const w = ({
-  as: x,
-  show: p,
-  open: t,
-  patch: A,
+const C = ({
+  as: p,
+  show: I,
+  open: s,
+  patch: y,
   iconSubs: r,
   variant: m = "payhere-brand-base-white",
-  setShow: g,
-  onClickItems: O,
-  propsLink: f,
-  ...i
+  setShow: l,
+  onClickItems: x,
+  propsLink: b,
+  ...e
 }) => {
-  var C, a, E, k, F, R, T, V;
-  let h = /* @__PURE__ */ n(N, {});
-  const H = x ?? "div", [M, $] = l(!1), I = A === i.slug, y = p.split("/"), e = y.includes(i.name), j = () => {
-    if (i.subs.length > 0)
-      if (e) {
-        const o = y.splice(0, y.indexOf(i.name));
-        o.length > 0 ? g(`${o.join("/")}/`) : g("");
+  let g = /* @__PURE__ */ t($, {});
+  const A = p ?? "div", [O, f] = M(!1), h = y === e.slug, N = I.split("/"), n = N.includes(e.name), H = () => {
+    if (e.subs.length > 0)
+      if (n) {
+        const o = N.splice(0, N.indexOf(e.name));
+        o.length > 0 ? l(`${o.join("/")}/`) : l("");
       } else
-        g(`${p}${i.name}/`);
-    else typeof O == "function" && O(i);
+        l(`${I}${e.name}/`);
+    else typeof x == "function" && x(e);
   };
-  return i.isShow ? ([1, 3, 5, 6, 7, 8].includes(i.parent) && (h = /* @__PURE__ */ c(N, { children: [
+  return e.isShow ? ([1, 3, 5, 6, 7, 8].includes(e.parent) && (g = /* @__PURE__ */ c($, { children: [
     /* @__PURE__ */ c(
-      H,
+      A,
       {
-        id: i.name,
-        className: `${s["item-sidebar-1"]}
-          ${(C = d.variant) == null ? void 0 : C[m]} ${(a = d.parent) == null ? void 0 : a[i.parent.toString()]} 
-          ${I || i.subs.length > 0 && e ? s.active : ""} ${typeof t == "boolean" && t ? s["item-sidebar-open"] : ""} ${typeof t == "boolean" && !t ? s["item-sidebar-close"] : ""}
+        id: e.name,
+        className: `${i["item-sidebar-1"]}
+          ${d.variant?.[m]} ${d.parent?.[e.parent.toString()]} 
+          ${h || e.subs.length > 0 && n ? i.active : ""} ${typeof s == "boolean" && s ? i["item-sidebar-open"] : ""} ${typeof s == "boolean" && !s ? i["item-sidebar-close"] : ""}
         `,
-        onClick: j,
-        onMouseOver: () => $(!0),
-        onMouseOut: () => $(!1),
-        ...f ? f(i.slug, i) : {},
+        onClick: H,
+        onMouseOver: () => f(!0),
+        onMouseOut: () => f(!1),
+        ...b ? b(e.slug, e) : {},
         children: [
           /* @__PURE__ */ c("div", { className: "iru-flex iru-items-center iru-gap-3 iru-relative", children: [
-            b(i.svgIcon) && /* @__PURE__ */ n("div", { className: s["item-icon"], children: I || i.subs.length > 0 && e ? i == null ? void 0 : i.svgIconActive : M ? (i == null ? void 0 : i.svgIconHover) || (i == null ? void 0 : i.svgIconActive) : i == null ? void 0 : i.svgIcon }),
-            /* @__PURE__ */ n("div", { className: s["item-label"], children: i.label })
+            a(e.svgIcon) && /* @__PURE__ */ t("div", { className: i["item-icon"], children: h || e.subs.length > 0 && n ? e?.svgIconActive : O ? e?.svgIconHover || e?.svgIconActive : e?.svgIcon }),
+            /* @__PURE__ */ t("div", { className: i["item-label"], children: e.label })
           ] }),
-          b(i.endIcon) && /* @__PURE__ */ n("div", { className: s["end-icon"], children: i == null ? void 0 : i.endIcon }),
-          i.subs.length > 0 && t && /* @__PURE__ */ c(
+          a(e.endIcon) && /* @__PURE__ */ t("div", { className: i["end-icon"], children: e?.endIcon }),
+          e.subs.length > 0 && s && /* @__PURE__ */ c(
             "div",
             {
-              className: `${s["item-icon-subs"]} ${e ? s["item-icon-subs-active"] : ""}`,
-              id: `item-sidebar-subs-${i.name}-icon`,
+              className: `${i["item-icon-subs"]} ${n ? i["item-icon-subs-active"] : ""}`,
+              id: `item-sidebar-subs-${e.name}-icon`,
               children: [
-                b(r) && r,
+                a(r) && r,
                 typeof r == "function" && r()
               ]
             }
@@ -58,30 +57,30 @@ const w = ({
         ]
       }
     ),
-    i.parent === 3 && !i.subs.length && /* @__PURE__ */ n("div", { className: (E = d.divider) == null ? void 0 : E[m] })
-  ] })), (i.parent === 2 || i.parent === 4) && (h = /* @__PURE__ */ c(N, { children: [
+    e.parent === 3 && !e.subs.length && /* @__PURE__ */ t("div", { className: d.divider?.[m] })
+  ] })), (e.parent === 2 || e.parent === 4) && (g = /* @__PURE__ */ c($, { children: [
     /* @__PURE__ */ c(
-      H,
+      A,
       {
-        id: i.name,
-        className: `${s["item-sidebar-2"]}
-          ${(k = d.variant) == null ? void 0 : k[m]} ${(F = d.parent) == null ? void 0 : F[i.parent.toString()]} 
-          ${I || i.subs.length > 0 && e ? s.active : ""} ${typeof t == "boolean" && t ? s["item-sidebar-open"] : ""} ${typeof t == "boolean" && !t ? s["item-sidebar-close"] : ""}
+        id: e.name,
+        className: `${i["item-sidebar-2"]}
+          ${d.variant?.[m]} ${d.parent?.[e.parent.toString()]} 
+          ${h || e.subs.length > 0 && n ? i.active : ""} ${typeof s == "boolean" && s ? i["item-sidebar-open"] : ""} ${typeof s == "boolean" && !s ? i["item-sidebar-close"] : ""}
         `,
-        onClick: j,
-        onMouseOver: () => $(!0),
-        onMouseOut: () => $(!1),
-        ...f ? f(i.slug, i) : {},
+        onClick: H,
+        onMouseOver: () => f(!0),
+        onMouseOut: () => f(!1),
+        ...b ? b(e.slug, e) : {},
         children: [
-          b(i.svgIcon) && /* @__PURE__ */ n("div", { className: s["item-icon"], children: I || i.subs.length > 0 && e ? i == null ? void 0 : i.svgIconActive : M ? (i == null ? void 0 : i.svgIconHover) || (i == null ? void 0 : i.svgIconActive) : i == null ? void 0 : i.svgIcon }),
-          /* @__PURE__ */ n("div", { className: s["item-label"], children: i.label }),
-          i.subs.length > 0 && t && /* @__PURE__ */ c(
+          a(e.svgIcon) && /* @__PURE__ */ t("div", { className: i["item-icon"], children: h || e.subs.length > 0 && n ? e?.svgIconActive : O ? e?.svgIconHover || e?.svgIconActive : e?.svgIcon }),
+          /* @__PURE__ */ t("div", { className: i["item-label"], children: e.label }),
+          e.subs.length > 0 && s && /* @__PURE__ */ c(
             "div",
             {
-              className: `${s["item-icon-subs"]} ${e ? s["item-icon-subs-active"] : ""}`,
-              id: `item-sidebar-subs-${i.name}-icon`,
+              className: `${i["item-icon-subs"]} ${n ? i["item-icon-subs-active"] : ""}`,
+              id: `item-sidebar-subs-${e.name}-icon`,
               children: [
-                b(r) && r,
+                a(r) && r,
                 typeof r == "function" && r()
               ]
             }
@@ -89,34 +88,34 @@ const w = ({
         ]
       }
     ),
-    i.parent === 4 && !i.subs.length && /* @__PURE__ */ n("div", { className: (R = d.divider) == null ? void 0 : R[m] })
-  ] })), i.subs.length > 0 ? /* @__PURE__ */ c("div", { className: `${t || e ? "" : "-mt-2"}`, children: [
-    h,
-    /* @__PURE__ */ n(
+    e.parent === 4 && !e.subs.length && /* @__PURE__ */ t("div", { className: d.divider?.[m] })
+  ] })), e.subs.length > 0 ? /* @__PURE__ */ c("div", { className: `${s || n ? "" : "-mt-2"}`, children: [
+    g,
+    /* @__PURE__ */ t(
       "div",
       {
-        id: `item-sidebar-subs-${i.name}-${t && e ? "open" : "close"}`,
-        className: `${s["item-subs-sidebar"]} 
-          ${(T = d.variant) == null ? void 0 : T[m]} ${!t || !e ? s.hidden : ""}`,
-        children: i.subs.map((o) => /* @__PURE__ */ q(
-          w,
+        id: `item-sidebar-subs-${e.name}-${s && n ? "open" : "close"}`,
+        className: `${i["item-subs-sidebar"]} 
+          ${d.variant?.[m]} ${!s || !n ? i.hidden : ""}`,
+        children: e.subs.map((o) => /* @__PURE__ */ j(
+          C,
           {
             ...o,
-            as: o.manualRoute ? "div" : o.subs.length > 0 ? x : i.linkComponent,
+            as: o.manualRoute ? "div" : o.subs.length > 0 ? p : e.linkComponent,
             key: o.name,
-            patch: A,
+            patch: y,
             iconSubs: r,
-            show: p,
-            open: t,
+            show: I,
+            open: s,
             variant: m,
-            setShow: g
+            setShow: l
           }
         ))
       }
     ),
-    [3, 4].includes(i.parent) && /* @__PURE__ */ n("div", { className: (V = d.divider) == null ? void 0 : V[m] })
-  ] }) : h) : /* @__PURE__ */ n(N, {});
+    [3, 4].includes(e.parent) && /* @__PURE__ */ t("div", { className: d.divider?.[m] })
+  ] }) : g) : /* @__PURE__ */ t($, {});
 };
 export {
-  w as default
+  C as default
 };

package/dist/components/Sidebar/Sidebar.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),e=require("react"),a=require("./Sidebar.module.scss.cjs"),A=require("./ItemSidebar.cjs"),W=require("../../config/tailwind/nativeScreen.cjs"),v=require("./Sidebar.config.cjs"),k=e.forwardRef((q,O)=>{var I;const{as:w,children:C,patch:d="/",iconCompany:r,iconSubs:$,iconCollapse:m,iconCollapseClose:g,modules:V,toleranceWidthIconCompany:L=25,onClickItems:M,variant:c="payhere-brand-base-white",footer:o,withInheritance:j,id:p="1ru-sidebar",styleSidebar:_,styleContent:z,...F}=q,T=e.useRef(null),[i,l]=e.useState(null),[s,f]=e.useState(null),[B,x]=e.useState(""),[E,h]=e.useState(),[N,P]=e.useState(0),b=()=>{var R;let n=0;const S=document.getElementById("icon-company-sidebar");(R=S==null?void 0:S.childNodes)==null||R.forEach(H=>{n+=H.getBoundingClientRect().width??0}),h(n+L+"px")},y=()=>{P(window.innerWidth)},u=()=>{l(!s),s?h("auto"):setTimeout(()=>{b()},100)};return e.useEffect(()=>{N>=(v.configSidebar.mobileSupport.includes(c)?W.default.lg:W.default.md)?(l(!0),setTimeout(()=>{b()},100)):(l(!1),h("auto"))},[N]),e.useEffect(()=>{typeof i=="boolean"&&f(i)},[i]),e.useImperativeHandle(O,()=>({openSidebar:i,setOpenSidebar:l,handlerClickCollapse:u}),[i,s]),e.useEffect(()=>(d&&d.split("/").length>1&&x(d+"/"),b(),y(),window.addEventListener("resize",y),()=>window.removeEventListener("resize",y)),[]),t.jsxs("div",{className:v.configSidebar.variants[c],...F,ref:T,children:[t.jsxs("div",{id:p,className:`${a.default.sidebar} ${typeof s=="boolean"&&s?a.default["sidebar-open"]:""} ${typeof s=="boolean"&&!s?a.default["sidebar-close"]:""}`,style:_||{},children:[e.isValidElement(m)&&t.jsxs("div",{className:a.default["button-collaps-sidebar"],id:`${p}-${i?"close-collapse":"open-collapse"}`,onClick:u,children:[i&&m,i?"":e.isValidElement(g)?g:m]}),t.jsx("div",{className:a.default["container-icon-company-sidebar"],children:t.jsxs("div",{id:"icon-company-sidebar",className:a.default["icon-company-sidebar"],style:{width:E&&v.configSidebar.withCuctomWidthIconCompany.includes(c)?E:"100%"},children:[e.isValidElement(r)&&r,typeof r=="function"&&r({openSidebar:s,setOpenSidebar:l})]})}),t.jsx("div",{className:a.default["menu-sidebar"],onMouseOver:()=>{i||f(!0)},onMouseOut:()=>{i||f(!1)},children:V.map(n=>e.createElement(A.default,{...n,as:n.manualRoute||n.subs.length>0?"div":w,linkComponent:w,key:n.name,show:B,open:s,patch:d,iconSubs:$,variant:c,setShow:x,onClickItems:M}))}),o&&t.jsxs("div",{className:s?"iru-opacity-[1]":"iru-opacity-0",children:[e.isValidElement(o)&&t.jsx("div",{children:o}),typeof o=="function"&&t.jsx("div",{children:o()})]})]}),i&&t.jsx("div",{id:`${p}-splace-screen`,className:a.default["splace-screen"],onClick:u}),t.jsxs("div",{className:a.default["content-sidebar"],style:z||{},children:[j&&((I=e.Children)==null?void 0:I.map(C,n=>t.jsx(t.Fragment,{children:e.isValidElement(n)&&t.jsx(t.Fragment,{children:e.cloneElement(n,{openSidebar:i,handlerClickCollapse:u})})}))),!j&&t.jsx(t.Fragment,{children:C})]})]})});k.displayName="Sidebar";exports.default=k;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),e=require("react"),a=require("./Sidebar.module.scss.cjs"),B=require("./ItemSidebar.cjs"),N=require("../../config/tailwind/nativeScreen.cjs"),S=require("./Sidebar.config.cjs"),I=e.forwardRef((R,W)=>{const{as:C,children:v,patch:d="/",iconCompany:c,iconSubs:k,iconCollapse:m,iconCollapseClose:w,modules:q,toleranceWidthIconCompany:O=25,onClickItems:$,variant:r="payhere-brand-base-white",footer:o,withInheritance:g,id:p="1ru-sidebar",styleSidebar:V,styleContent:L,...M}=R,_=e.useRef(null),[n,l]=e.useState(null),[i,f]=e.useState(null),[z,j]=e.useState(""),[x,h]=e.useState(),[E,F]=e.useState(0),b=()=>{let s=0;document.getElementById("icon-company-sidebar")?.childNodes?.forEach(T=>{s+=T.getBoundingClientRect().width??0}),h(s+O+"px")},y=()=>{F(window.innerWidth)},u=()=>{l(!i),i?h("auto"):setTimeout(()=>{b()},100)};return e.useEffect(()=>{E>=(S.configSidebar.mobileSupport.includes(r)?N.default.lg:N.default.md)?(l(!0),setTimeout(()=>{b()},100)):(l(!1),h("auto"))},[E]),e.useEffect(()=>{typeof n=="boolean"&&f(n)},[n]),e.useImperativeHandle(W,()=>({openSidebar:n,setOpenSidebar:l,handlerClickCollapse:u}),[n,i]),e.useEffect(()=>(d&&d.split("/").length>1&&j(d+"/"),b(),y(),window.addEventListener("resize",y),()=>window.removeEventListener("resize",y)),[]),t.jsxs("div",{className:S.configSidebar.variants[r],...M,ref:_,children:[t.jsxs("div",{id:p,className:`${a.default.sidebar} ${typeof i=="boolean"&&i?a.default["sidebar-open"]:""} ${typeof i=="boolean"&&!i?a.default["sidebar-close"]:""}`,style:V||{},children:[e.isValidElement(m)&&t.jsxs("div",{className:a.default["button-collaps-sidebar"],id:`${p}-${n?"close-collapse":"open-collapse"}`,onClick:u,children:[n&&m,n?"":e.isValidElement(w)?w:m]}),t.jsx("div",{className:a.default["container-icon-company-sidebar"],children:t.jsxs("div",{id:"icon-company-sidebar",className:a.default["icon-company-sidebar"],style:{width:x&&S.configSidebar.withCuctomWidthIconCompany.includes(r)?x:"100%"},children:[e.isValidElement(c)&&c,typeof c=="function"&&c({openSidebar:i,setOpenSidebar:l})]})}),t.jsx("div",{className:a.default["menu-sidebar"],onMouseOver:()=>{n||f(!0)},onMouseOut:()=>{n||f(!1)},children:q.map(s=>e.createElement(B.default,{...s,as:s.manualRoute||s.subs.length>0?"div":C,linkComponent:C,key:s.name,show:z,open:i,patch:d,iconSubs:k,variant:r,setShow:j,onClickItems:$}))}),o&&t.jsxs("div",{className:i?"iru-opacity-[1]":"iru-opacity-0",children:[e.isValidElement(o)&&t.jsx("div",{children:o}),typeof o=="function"&&t.jsx("div",{children:o()})]})]}),n&&t.jsx("div",{id:`${p}-splace-screen`,className:a.default["splace-screen"],onClick:u}),t.jsxs("div",{className:a.default["content-sidebar"],style:L||{},children:[g&&e.Children?.map(v,s=>t.jsx(t.Fragment,{children:e.isValidElement(s)&&t.jsx(t.Fragment,{children:e.cloneElement(s,{openSidebar:n,handlerClickCollapse:u})})})),!g&&t.jsx(t.Fragment,{children:v})]})]})});I.displayName="Sidebar";exports.default=I;

package/dist/components/Sidebar/Sidebar.mjs

@@ -1,75 +1,72 @@
-import { jsxs as a, jsx as s, Fragment as S } from "react/jsx-runtime";
-import e, { createElement as G } from "react";
+import { jsxs as a, jsx as s, Fragment as w } from "react/jsx-runtime";
+import e, { createElement as q } from "react";
 import o from "./Sidebar.module.scss.mjs";
-import J from "./ItemSidebar.mjs";
-import V from "../../config/tailwind/nativeScreen.mjs";
-import { configSidebar as v } from "./Sidebar.config.mjs";
-const K = e.forwardRef(
-  (x, L) => {
-    var $;
+import A from "./ItemSidebar.mjs";
+import k from "../../config/tailwind/nativeScreen.mjs";
+import { configSidebar as S } from "./Sidebar.config.mjs";
+const D = e.forwardRef(
+  ($, O) => {
     const {
-      as: E,
-      children: N,
-      patch: r = "/",
-      iconCompany: c,
-      iconSubs: z,
+      as: v,
+      children: E,
+      patch: c = "/",
+      iconCompany: r,
+      iconSubs: V,
       iconCollapse: u,
-      iconCollapseClose: g,
-      modules: j,
-      toleranceWidthIconCompany: B = 25,
-      onClickItems: M,
+      iconCollapseClose: N,
+      modules: x,
+      toleranceWidthIconCompany: L = 25,
+      onClickItems: z,
       variant: m = "payhere-brand-base-white",
       footer: l,
-      withInheritance: I,
+      withInheritance: g,
       id: h = "1ru-sidebar",
-      styleSidebar: T,
-      styleContent: F,
-      ...H
-    } = x, P = e.useRef(null), [i, d] = e.useState(null), [t, f] = e.useState(null), [q, R] = e.useState(""), [W, b] = e.useState(), [k, A] = e.useState(0), y = () => {
-      var O;
-      let n = 0;
-      const C = document.getElementById("icon-company-sidebar");
-      (O = C == null ? void 0 : C.childNodes) == null || O.forEach((D) => {
-        n += D.getBoundingClientRect().width ?? 0;
-      }), b(n + B + "px");
-    }, w = () => {
-      A(window.innerWidth);
+      styleSidebar: j,
+      styleContent: B,
+      ...M
+    } = $, T = e.useRef(null), [n, d] = e.useState(null), [i, f] = e.useState(null), [F, I] = e.useState(""), [R, b] = e.useState(), [W, H] = e.useState(0), y = () => {
+      let t = 0;
+      document.getElementById("icon-company-sidebar")?.childNodes?.forEach((P) => {
+        t += P.getBoundingClientRect().width ?? 0;
+      }), b(t + L + "px");
+    }, C = () => {
+      H(window.innerWidth);
     }, p = () => {
-      d(!t), t ? b("auto") : setTimeout(() => {
+      d(!i), i ? b("auto") : setTimeout(() => {
         y();
       }, 100);
     };
     return e.useEffect(() => {
-      k >= (v.mobileSupport.includes(m) ? V.lg : V.md) ? (d(!0), setTimeout(() => {
+      W >= (S.mobileSupport.includes(m) ? k.lg : k.md) ? (d(!0), setTimeout(() => {
         y();
       }, 100)) : (d(!1), b("auto"));
-    }, [k]), e.useEffect(() => {
-      typeof i == "boolean" && f(i);
-    }, [i]), e.useImperativeHandle(
-      L,
+    }, [W]), e.useEffect(() => {
+      typeof n == "boolean" && f(n);
+    }, [n]), e.useImperativeHandle(
+      O,
       () => ({
-        openSidebar: i,
+        openSidebar: n,
         setOpenSidebar: d,
         handlerClickCollapse: p
       }),
-      [i, t]
-    ), e.useEffect(() => (r && r.split("/").length > 1 && R(r + "/"), y(), w(), window.addEventListener("resize", w), () => window.removeEventListener("resize", w)), []), /* @__PURE__ */ a("div", { className: v.variants[m], ...H, ref: P, children: [
+      [n, i]
+    ), e.useEffect(() => (c && c.split("/").length > 1 && I(c + "/"), y(), C(), window.addEventListener("resize", C), () => window.removeEventListener("resize", C)), []), /* @__PURE__ */ a("div", { className: S.variants[m], ...M, ref: T, children: [
       /* @__PURE__ */ a(
         "div",
         {
           id: h,
-          className: `${o.sidebar} ${typeof t == "boolean" && t ? o["sidebar-open"] : ""} ${typeof t == "boolean" && !t ? o["sidebar-close"] : ""}`,
-          style: T || {},
+          className: `${o.sidebar} ${typeof i == "boolean" && i ? o["sidebar-open"] : ""} ${typeof i == "boolean" && !i ? o["sidebar-close"] : ""}`,
+          style: j || {},
           children: [
             e.isValidElement(u) && /* @__PURE__ */ a(
               "div",
               {
                 className: o["button-collaps-sidebar"],
-                id: `${h}-${i ? "close-collapse" : "open-collapse"}`,
+                id: `${h}-${n ? "close-collapse" : "open-collapse"}`,
                 onClick: p,
                 children: [
-                  i && u,
-                  i ? "" : e.isValidElement(g) ? g : u
+                  n && u,
+                  n ? "" : e.isValidElement(N) ? N : u
                 ]
               }
             ),
@@ -79,11 +76,11 @@ const K = e.forwardRef(
                 id: "icon-company-sidebar",
                 className: o["icon-company-sidebar"],
                 style: {
-                  width: W && v.withCuctomWidthIconCompany.includes(m) ? W : "100%"
+                  width: R && S.withCuctomWidthIconCompany.includes(m) ? R : "100%"
                 },
                 children: [
-                  e.isValidElement(c) && c,
-                  typeof c == "function" && c({ openSidebar: t, setOpenSidebar: d })
+                  e.isValidElement(r) && r,
+                  typeof r == "function" && r({ openSidebar: i, setOpenSidebar: d })
                 ]
               }
             ) }),
@@ -92,45 +89,45 @@ const K = e.forwardRef(
               {
                 className: o["menu-sidebar"],
                 onMouseOver: () => {
-                  i || f(!0);
+                  n || f(!0);
                 },
                 onMouseOut: () => {
-                  i || f(!1);
+                  n || f(!1);
                 },
-                children: j.map((n) => /* @__PURE__ */ G(
-                  J,
+                children: x.map((t) => /* @__PURE__ */ q(
+                  A,
                   {
-                    ...n,
-                    as: n.manualRoute || n.subs.length > 0 ? "div" : E,
-                    linkComponent: E,
-                    key: n.name,
-                    show: q,
-                    open: t,
-                    patch: r,
-                    iconSubs: z,
+                    ...t,
+                    as: t.manualRoute || t.subs.length > 0 ? "div" : v,
+                    linkComponent: v,
+                    key: t.name,
+                    show: F,
+                    open: i,
+                    patch: c,
+                    iconSubs: V,
                     variant: m,
-                    setShow: R,
-                    onClickItems: M
+                    setShow: I,
+                    onClickItems: z
                   }
                 ))
               }
             ),
-            l && /* @__PURE__ */ a("div", { className: t ? "iru-opacity-[1]" : "iru-opacity-0", children: [
+            l && /* @__PURE__ */ a("div", { className: i ? "iru-opacity-[1]" : "iru-opacity-0", children: [
               e.isValidElement(l) && /* @__PURE__ */ s("div", { children: l }),
               typeof l == "function" && /* @__PURE__ */ s("div", { children: l() })
             ] })
           ]
         }
       ),
-      i && /* @__PURE__ */ s("div", { id: `${h}-splace-screen`, className: o["splace-screen"], onClick: p }),
-      /* @__PURE__ */ a("div", { className: o["content-sidebar"], style: F || {}, children: [
-        I && (($ = e.Children) == null ? void 0 : $.map(N, (n) => /* @__PURE__ */ s(S, { children: e.isValidElement(n) && /* @__PURE__ */ s(S, { children: e.cloneElement(n, { openSidebar: i, handlerClickCollapse: p }) }) }))),
-        !I && /* @__PURE__ */ s(S, { children: N })
+      n && /* @__PURE__ */ s("div", { id: `${h}-splace-screen`, className: o["splace-screen"], onClick: p }),
+      /* @__PURE__ */ a("div", { className: o["content-sidebar"], style: B || {}, children: [
+        g && e.Children?.map(E, (t) => /* @__PURE__ */ s(w, { children: e.isValidElement(t) && /* @__PURE__ */ s(w, { children: e.cloneElement(t, { openSidebar: n, handlerClickCollapse: p }) }) })),
+        !g && /* @__PURE__ */ s(w, { children: E })
       ] })
     ] });
   }
 );
-K.displayName = "Sidebar";
+D.displayName = "Sidebar";
 export {
-  K as default
+  D as default
 };

package/dist/components/Step/Step.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),d=require("./Step.module.scss.cjs"),g=({widthLine:l,color:r})=>s.jsx("svg",{height:"5",xmlns:"http://www.w3.org/2000/svg",className:d.default["content-line-dashed"],width:l+10,style:{right:-(l/2+14)},children:s.jsx("g",{fill:"none",stroke:r,strokeWidth:"10",children:s.jsx("path",{strokeDasharray:"12,4",d:`M0 0 ${l+10} 0`})})}),u=({widthLine:l,color:r})=>s.jsx("hr",{className:d.default["content-line-active"],style:{width:l+22,right:-(l/2+20),borderColor:r}}),N=({activeStep:l,stepList:r,widthLine:n=250,classNameContainer:x,classNameContent:f,classNameDesc:$,onChange:a,afterActiveType:t="solid",beforeActiveType:h="dashed",colorActive:m="#0163c8 ",colorInactive:j="#D6D6D6"})=>s.jsx("div",{className:`${d.default.container} ${x??""}`,children:r.map((e,o)=>{const c=o+1;return s.jsxs("div",{className:`${d.default["content-section"]} ${f??""}`,onClick:()=>{typeof a=="function"&&a(e)},children:[s.jsxs("div",{className:d.default["content-step"],children:[c<r.length&&s.jsxs(s.Fragment,{children:[(e.step??c)>=l&&s.jsxs(s.Fragment,{children:[h==="solid"&&s.jsx(u,{color:j,widthLine:n}),h==="dashed"&&s.jsx(g,{color:j,widthLine:n})]}),(e.step??c)<l&&s.jsxs(s.Fragment,{children:[t==="solid"&&s.jsx(u,{color:m,widthLine:n}),t==="dashed"&&s.jsx(g,{color:m,widthLine:n})]})]}),o!==0&&s.jsx("div",{style:{width:n/2}}),s.jsx("div",{className:`${d.default["number-step"]} 
-                ${(e.step??c)<l?d.default.passed:""}
-                ${(e.step??c)===l?d.default.active:""}
-                ${e.className??""}`,children:l>e.step&&e.valueDone?s.jsx(s.Fragment,{children:e.valueDone}):s.jsx(s.Fragment,{children:e.value?e.value:c})}),o+1!==(r==null?void 0:r.length)&&s.jsx("div",{style:{width:n/2}})]}),e.desc&&s.jsx("div",{className:`${d.default["content-description"]} ${$??""} 
-                ${(e.step??c)<=l?d.default.active:""}`,style:{maxWidth:o+1===(r==null?void 0:r.length)||o===0?(n-30)*2:n-30,marginRight:o+1===(r==null?void 0:r.length)?-(n/2):0,marginLeft:o===0?-(n/2):0},children:e.desc})]},o)})});exports.default=N;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),l=require("./Step.module.scss.cjs"),g=({widthLine:t,color:n})=>s.jsx("svg",{height:"5",xmlns:"http://www.w3.org/2000/svg",className:l.default["content-line-dashed"],width:t+10,style:{right:-(t/2+14)},children:s.jsx("g",{fill:"none",stroke:n,strokeWidth:"10",children:s.jsx("path",{strokeDasharray:"12,4",d:`M0 0 ${t+10} 0`})})}),u=({widthLine:t,color:n})=>s.jsx("hr",{className:l.default["content-line-active"],style:{width:t+22,right:-(t/2+20),borderColor:n}}),$=({activeStep:t,stepList:n,widthLine:r=250,classNameContainer:x,classNameContent:f,classNameDesc:i,onChange:c,afterActiveType:a="solid",beforeActiveType:h="dashed",colorActive:m="#0163c8 ",colorInactive:j="#D6D6D6"})=>s.jsx("div",{className:`${l.default.container} ${x??""}`,children:n.map((e,d)=>{const o=d+1;return s.jsxs("div",{className:`${l.default["content-section"]} ${f??""}`,onClick:()=>{typeof c=="function"&&c(e)},children:[s.jsxs("div",{className:l.default["content-step"],children:[o<n.length&&s.jsxs(s.Fragment,{children:[(e.step??o)>=t&&s.jsxs(s.Fragment,{children:[h==="solid"&&s.jsx(u,{color:j,widthLine:r}),h==="dashed"&&s.jsx(g,{color:j,widthLine:r})]}),(e.step??o)<t&&s.jsxs(s.Fragment,{children:[a==="solid"&&s.jsx(u,{color:m,widthLine:r}),a==="dashed"&&s.jsx(g,{color:m,widthLine:r})]})]}),d!==0&&s.jsx("div",{style:{width:r/2}}),s.jsx("div",{className:`${l.default["number-step"]} 
+                ${(e.step??o)<t?l.default.passed:""}
+                ${(e.step??o)===t?l.default.active:""}
+                ${e.className??""}`,children:t>e.step&&e.valueDone?s.jsx(s.Fragment,{children:e.valueDone}):s.jsx(s.Fragment,{children:e.value?e.value:o})}),d+1!==n?.length&&s.jsx("div",{style:{width:r/2}})]}),e.desc&&s.jsx("div",{className:`${l.default["content-description"]} ${i??""} 
+                ${(e.step??o)<=t?l.default.active:""}`,style:{maxWidth:d+1===n?.length||d===0?(r-30)*2:r-30,marginRight:d+1===n?.length?-(r/2):0,marginLeft:d===0?-(r/2):0},children:e.desc})]},d)})});exports.default=$;

package/dist/components/Step/Step.mjs

@@ -1,85 +1,85 @@
-import { jsx as o, jsxs as a, Fragment as m } from "react/jsx-runtime";
-import s from "./Step.module.scss.mjs";
-const D = ({ widthLine: c, color: r }) => /* @__PURE__ */ o(
+import { jsx as s, jsxs as d, Fragment as h } from "react/jsx-runtime";
+import t from "./Step.module.scss.mjs";
+const i = ({ widthLine: o, color: c }) => /* @__PURE__ */ s(
   "svg",
   {
     height: "5",
     xmlns: "http://www.w3.org/2000/svg",
-    className: s["content-line-dashed"],
-    width: c + 10,
-    style: { right: -(c / 2 + 14) },
-    children: /* @__PURE__ */ o("g", { fill: "none", stroke: r, strokeWidth: "10", children: /* @__PURE__ */ o("path", { strokeDasharray: "12,4", d: `M0 0 ${c + 10} 0` }) })
+    className: t["content-line-dashed"],
+    width: o + 10,
+    style: { right: -(o / 2 + 14) },
+    children: /* @__PURE__ */ s("g", { fill: "none", stroke: c, strokeWidth: "10", children: /* @__PURE__ */ s("path", { strokeDasharray: "12,4", d: `M0 0 ${o + 10} 0` }) })
   }
-), f = ({ widthLine: c, color: r }) => /* @__PURE__ */ o(
+), N = ({ widthLine: o, color: c }) => /* @__PURE__ */ s(
   "hr",
   {
-    className: s["content-line-active"],
-    style: { width: c + 22, right: -(c / 2 + 20), borderColor: r }
+    className: t["content-line-active"],
+    style: { width: o + 22, right: -(o / 2 + 20), borderColor: c }
   }
-), C = ({
-  activeStep: c,
-  stepList: r,
-  widthLine: n = 250,
-  classNameContainer: y,
-  classNameContent: k,
-  classNameDesc: b,
-  onChange: e,
-  afterActiveType: g = "solid",
-  beforeActiveType: $ = "dashed",
-  colorActive: t = "#0163c8 ",
-  colorInactive: N = "#D6D6D6"
-}) => /* @__PURE__ */ o("div", { className: `${s.container} ${y ?? ""}`, children: r.map((l, d) => {
-  const h = d + 1;
-  return /* @__PURE__ */ a(
+), j = ({
+  activeStep: o,
+  stepList: c,
+  widthLine: l = 250,
+  classNameContainer: D,
+  classNameContent: f,
+  classNameDesc: y,
+  onChange: a,
+  afterActiveType: m = "solid",
+  beforeActiveType: g = "dashed",
+  colorActive: $ = "#0163c8 ",
+  colorInactive: p = "#D6D6D6"
+}) => /* @__PURE__ */ s("div", { className: `${t.container} ${D ?? ""}`, children: c.map((r, n) => {
+  const e = n + 1;
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: `${s["content-section"]} ${k ?? ""}`,
+      className: `${t["content-section"]} ${f ?? ""}`,
       onClick: () => {
-        typeof e == "function" && e(l);
+        typeof a == "function" && a(r);
       },
       children: [
-        /* @__PURE__ */ a("div", { className: s["content-step"], children: [
-          h < r.length && /* @__PURE__ */ a(m, { children: [
-            (l.step ?? h) >= c && /* @__PURE__ */ a(m, { children: [
-              $ === "solid" && /* @__PURE__ */ o(f, { color: N, widthLine: n }),
-              $ === "dashed" && /* @__PURE__ */ o(D, { color: N, widthLine: n })
+        /* @__PURE__ */ d("div", { className: t["content-step"], children: [
+          e < c.length && /* @__PURE__ */ d(h, { children: [
+            (r.step ?? e) >= o && /* @__PURE__ */ d(h, { children: [
+              g === "solid" && /* @__PURE__ */ s(N, { color: p, widthLine: l }),
+              g === "dashed" && /* @__PURE__ */ s(i, { color: p, widthLine: l })
             ] }),
-            (l.step ?? h) < c && /* @__PURE__ */ a(m, { children: [
-              g === "solid" && /* @__PURE__ */ o(f, { color: t, widthLine: n }),
-              g === "dashed" && /* @__PURE__ */ o(D, { color: t, widthLine: n })
+            (r.step ?? e) < o && /* @__PURE__ */ d(h, { children: [
+              m === "solid" && /* @__PURE__ */ s(N, { color: $, widthLine: l }),
+              m === "dashed" && /* @__PURE__ */ s(i, { color: $, widthLine: l })
             ] })
           ] }),
-          d !== 0 && /* @__PURE__ */ o("div", { style: { width: n / 2 } }),
-          /* @__PURE__ */ o(
+          n !== 0 && /* @__PURE__ */ s("div", { style: { width: l / 2 } }),
+          /* @__PURE__ */ s(
             "div",
             {
-              className: `${s["number-step"]} 
-                ${(l.step ?? h) < c ? s.passed : ""}
-                ${(l.step ?? h) === c ? s.active : ""}
-                ${l.className ?? ""}`,
-              children: c > l.step && l.valueDone ? /* @__PURE__ */ o(m, { children: l.valueDone }) : /* @__PURE__ */ o(m, { children: l.value ? l.value : h })
+              className: `${t["number-step"]} 
+                ${(r.step ?? e) < o ? t.passed : ""}
+                ${(r.step ?? e) === o ? t.active : ""}
+                ${r.className ?? ""}`,
+              children: o > r.step && r.valueDone ? /* @__PURE__ */ s(h, { children: r.valueDone }) : /* @__PURE__ */ s(h, { children: r.value ? r.value : e })
             }
           ),
-          d + 1 !== (r == null ? void 0 : r.length) && /* @__PURE__ */ o("div", { style: { width: n / 2 } })
+          n + 1 !== c?.length && /* @__PURE__ */ s("div", { style: { width: l / 2 } })
         ] }),
-        l.desc && /* @__PURE__ */ o(
+        r.desc && /* @__PURE__ */ s(
           "div",
           {
-            className: `${s["content-description"]} ${b ?? ""} 
-                ${(l.step ?? h) <= c ? s.active : ""}`,
+            className: `${t["content-description"]} ${y ?? ""} 
+                ${(r.step ?? e) <= o ? t.active : ""}`,
             style: {
-              maxWidth: d + 1 === (r == null ? void 0 : r.length) || d === 0 ? (n - 30) * 2 : n - 30,
-              marginRight: d + 1 === (r == null ? void 0 : r.length) ? -(n / 2) : 0,
-              marginLeft: d === 0 ? -(n / 2) : 0
+              maxWidth: n + 1 === c?.length || n === 0 ? (l - 30) * 2 : l - 30,
+              marginRight: n + 1 === c?.length ? -(l / 2) : 0,
+              marginLeft: n === 0 ? -(l / 2) : 0
             },
-            children: l.desc
+            children: r.desc
           }
         )
       ]
     },
-    d
+    n
   );
 }) });
 export {
-  C as default
+  j as default
 };