@ck-ui/component-library 2.0.2 → 2.0.4

package/dist/components/Sidebar/components/MenuRenderer/CollapsedMenu.js

@@ -1,84 +1,171 @@
-import { jsx as r, jsxs as c, Fragment as N } from "react/jsx-runtime";
-import { useCallback as h } from "react";
-import { C as m, p as n } from "../../../../index-DKHB_5Ee.js";
-import { IconRenderer as t } from "../IconRenderer/index.js";
-import { addBreakOpportunities as u } from "../../Sidebar.utils.js";
-import { s as v } from "../../../../styles.module-V3iL6ubH.js";
-function $({ menuItems: f, isActive: l, isTreeActive: d, onNavigate: a, onMenuItemClick: s }) {
-  const b = h((e, i) => {
-    const o = e.dashboardServices && e.dashboardServices.length > 0, p = d(e);
-    return o ? /* @__PURE__ */ r(
-      m,
+import { jsx as r, Fragment as b, jsxs as v } from "react/jsx-runtime";
+import { useState as h, useRef as D } from "react";
+import { C as R, s as a } from "../../../../index-BAG5O9tQ.js";
+import { IconRenderer as g } from "../IconRenderer/index.js";
+import { TruncatedLabel as y } from "../../_helpers/TruncatedLabel.js";
+import { useOverlayScrollbar as $ } from "../../hooks/useOverlayScrollbar.js";
+import { S as N } from "../../../../down-arrow-Con-s3fU.js";
+import { s as j } from "../../../../styles.module-CRMuLY4A.js";
+function G({
+  menuItems: f,
+  isActive: d,
+  isTreeActive: t,
+  onNavigate: o,
+  onMenuItemClick: s
+}) {
+  return /* @__PURE__ */ r(b, { children: f.map((n) => {
+    const l = n.dashboardServices && n.dashboardServices.length > 0, p = t(n);
+    return /* @__PURE__ */ r(
+      R,
       {
-        active: p,
-        icon: /* @__PURE__ */ r("span", { className: v["menu-icon"], children: /* @__PURE__ */ r(t, { icon: e.icon }) }),
-        popupClassName: i <= 1 ? n["single-child-popover"] : "",
-        children: /* @__PURE__ */ c("div", { className: n["popover-menu"], children: [
-          /* @__PURE__ */ r("div", { className: n["popover-title"], children: e.name }),
-          /* @__PURE__ */ r("div", { className: n["popover-children"], children: e.dashboardServices.map((C) => w(C)) })
-        ] })
-      },
-      e.name
-    ) : /* @__PURE__ */ r(
-      m,
-      {
-        active: l(e),
-        icon: /* @__PURE__ */ r("span", { className: v["menu-icon"], children: /* @__PURE__ */ r(t, { icon: e.icon }) }),
-        onClick: () => {
-          e.url && a(e.url), s?.(e);
+        tooltipLabel: n.name,
+        active: p || d(n),
+        icon: /* @__PURE__ */ r("span", { className: j["menu-icon"], children: /* @__PURE__ */ r(g, { icon: n.icon }) }),
+        onClick: l ? void 0 : () => {
+          n.url && o(n.url), s?.(n);
         },
-        children: /* @__PURE__ */ r("div", { className: n["popover-title-single"], children: e.name })
+        renderDropdown: l ? (u) => /* @__PURE__ */ r(
+          k,
+          {
+            items: n.dashboardServices,
+            isActive: d,
+            isTreeActive: t,
+            onNavigate: o,
+            onMenuItemClick: s,
+            onClose: u
+          }
+        ) : void 0
       },
-      e.name
+      n.name
     );
-  }, [l, d, a, s]), w = h((e) => e.dashboardServices && e.dashboardServices.length > 0 ? /* @__PURE__ */ c("div", { className: n["popover-child-with-sub"], children: [
-    /* @__PURE__ */ r(
-      m,
+  }) });
+}
+function k({
+  items: f,
+  isActive: d,
+  isTreeActive: t,
+  onNavigate: o,
+  onMenuItemClick: s,
+  onClose: n
+}) {
+  const [l, p] = h(null), u = D(null);
+  $(u);
+  const S = l ? f.find((e) => e.name === l && e.dashboardServices?.length) : null;
+  return /* @__PURE__ */ v(b, { children: [
+    /* @__PURE__ */ r("div", { ref: u, className: a["dropdown-content-area"], children: f.map((e) => {
+      const c = e.dashboardServices && e.dashboardServices.length > 0, w = c ? t(e) : d(e), m = l === e.name;
+      return /* @__PURE__ */ v(
+        "div",
+        {
+          className: `${a["dropdown-child-item"]} ${w || m ? a.active : ""}`,
+          onClick: () => {
+            c ? p(
+              (i) => i === e.name ? null : e.name
+            ) : (e.url && o(e.url), s?.(e), n());
+          },
+          onKeyDown: (i) => {
+            (i.key === "Enter" || i.key === " ") && (i.preventDefault(), c ? p(
+              (O) => O === e.name ? null : e.name
+            ) : (e.url && o(e.url), s?.(e), n()));
+          },
+          role: "menuitem",
+          tabIndex: 0,
+          children: [
+            /* @__PURE__ */ r(
+              y,
+              {
+                name: e.name,
+                className: a["dropdown-child-label"]
+              }
+            ),
+            c && /* @__PURE__ */ r(
+              "span",
+              {
+                className: `${a["dropdown-child-arrow"]} ${m ? a.open : ""}`,
+                children: /* @__PURE__ */ r(N, {})
+              }
+            )
+          ]
+        },
+        e.name
+      );
+    }) }),
+    S && /* @__PURE__ */ r(
+      x,
       {
-        active: d(e),
-        icon: null,
-        label: e.name,
-        popupClassName: n["nested-popover"],
-        children: /* @__PURE__ */ c("div", { className: n["popover-menu"], children: [
-          /* @__PURE__ */ r("div", { className: n["popover-title"], children: e.name }),
-          /* @__PURE__ */ r("div", { className: n["popover-children"], children: e.dashboardServices.map((o) => /* @__PURE__ */ r(
-            "div",
-            {
-              className: `${n["popover-child-item"]} ${l(o) ? n.active : ""}`,
-              onClick: () => {
-                o.url && a(o.url), s?.(o);
-              },
-              onKeyDown: (p) => {
-                (p.key === "Enter" || p.key === " ") && (p.preventDefault(), o.url && a(o.url), s?.(o));
-              },
-              role: "menuitem",
-              tabIndex: 0,
-              children: u(o.name)
-            },
-            o.name
-          )) })
-        ] })
+        items: S.dashboardServices,
+        isActive: d,
+        isTreeActive: t,
+        onNavigate: o,
+        onMenuItemClick: s,
+        onClose: n
       }
-    ),
-    /* @__PURE__ */ r("span", { className: n["popover-child-arrow"], children: /* @__PURE__ */ r("svg", { width: "6", height: "10", viewBox: "0 0 6 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ r("path", { d: "M1 1L5 5L1 9", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) })
-  ] }, e.name) : /* @__PURE__ */ r(
-    "div",
-    {
-      className: `${n["popover-child-item"]} ${l(e) ? n.active : ""}`,
-      onClick: () => {
-        e.url && a(e.url), s?.(e);
-      },
-      onKeyDown: (o) => {
-        (o.key === "Enter" || o.key === " ") && (o.preventDefault(), e.url && a(e.url), s?.(e));
-      },
-      role: "menuitem",
-      tabIndex: 0,
-      children: u(e.name)
-    },
-    e.name
-  ), [l, d, a, s]);
-  return /* @__PURE__ */ r(N, { children: f.map((e, i) => b(e, i)) });
+    )
+  ] });
+}
+function x({
+  items: f,
+  isActive: d,
+  isTreeActive: t,
+  onNavigate: o,
+  onMenuItemClick: s,
+  onClose: n
+}) {
+  const l = D(null), [p, u] = h(null);
+  $(l);
+  const S = p ? f.find((e) => e.name === p && e.dashboardServices?.length) : null;
+  return /* @__PURE__ */ v("div", { className: a["sub-dropdown-container"], children: [
+    /* @__PURE__ */ r("div", { className: a["dropdown-outer"], children: /* @__PURE__ */ r("div", { ref: l, className: a["sub-dropdown-content"], children: f.map((e) => {
+      const c = e.dashboardServices && e.dashboardServices.length > 0, w = p === e.name;
+      return /* @__PURE__ */ v(
+        "div",
+        {
+          className: `${a["sub-dropdown-child-item"]} ${d(e) || t(e) || w ? a.active : ""}`,
+          onClick: () => {
+            c ? u(
+              (m) => m === e.name ? null : e.name
+            ) : (e.url && o(e.url), s?.(e), n());
+          },
+          onKeyDown: (m) => {
+            (m.key === "Enter" || m.key === " ") && (m.preventDefault(), c ? u(
+              (i) => i === e.name ? null : e.name
+            ) : (e.url && o(e.url), s?.(e), n()));
+          },
+          role: "menuitem",
+          tabIndex: 0,
+          children: [
+            /* @__PURE__ */ r(
+              y,
+              {
+                name: e.name,
+                className: a["dropdown-child-label"]
+              }
+            ),
+            c && /* @__PURE__ */ r(
+              "span",
+              {
+                className: `${a["dropdown-child-arrow"]} ${w ? a.open : ""}`,
+                children: /* @__PURE__ */ r(N, {})
+              }
+            )
+          ]
+        },
+        e.name
+      );
+    }) }) }),
+    S && /* @__PURE__ */ r(
+      x,
+      {
+        items: S.dashboardServices,
+        isActive: d,
+        isTreeActive: t,
+        onNavigate: o,
+        onMenuItemClick: s,
+        onClose: n
+      }
+    )
+  ] });
 }
 export {
-  $ as CollapsedMenu
+  G as CollapsedMenu
 };

package/dist/components/Sidebar/components/MenuRenderer/ExpandedMenu.d.ts

@@ -6,7 +6,11 @@ interface ExpandedMenuProps {
     isTreeActive: (item: MenuItem) => boolean;
     onNavigate: (path: string) => void;
     onMenuItemClick?: (item: MenuItem) => void;
+    showChildIcons?: boolean;
+    maxOpenParents?: number;
+    maxOpenChildren?: number;
+    textOverflow?: "ellipsis" | "wrap";
 }
-export declare function ExpandedMenu({ menuItems, currentPath, isActive, isTreeActive, onNavigate, onMenuItemClick }: ExpandedMenuProps): import("react/jsx-runtime").JSX.Element;
+export declare function ExpandedMenu({ menuItems, currentPath, isActive, isTreeActive, onNavigate, onMenuItemClick, showChildIcons, maxOpenParents, maxOpenChildren, textOverflow, }: ExpandedMenuProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=ExpandedMenu.d.ts.map

package/dist/components/Sidebar/components/MenuRenderer/ExpandedMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandedMenu.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Sidebar/components/MenuRenderer/ExpandedMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAK/D,UAAU,iBAAiB;IACzB,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IAC1C,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;CAC5C;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,eAAe,EAAE,EAAE,iBAAiB,2CAkD9H"}
+{"version":3,"file":"ExpandedMenu.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Sidebar/components/MenuRenderer/ExpandedMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAK/D,UAAU,iBAAiB;IACzB,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,OAAO,CAAC;IAC1C,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC3C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;CACpC;AAED,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,eAAe,EACf,cAAqB,EACrB,cAAc,EACd,eAAe,EACf,YAAyB,GAC1B,EAAE,iBAAiB,2CAmFnB"}

package/dist/components/Sidebar/components/MenuRenderer/ExpandedMenu.js

@@ -1,42 +1,81 @@
-import { jsx as n, Fragment as x } from "react/jsx-runtime";
-import { useMemo as v, useCallback as L } from "react";
-import { MenuItemWrapper as W } from "../MenuItemWrapper/index.js";
-import { SubMenuWrapper as y } from "../SubMenuWrapper/index.js";
-import { useMenuState as C } from "../../hooks/useMenuState.js";
-function m({ menuItems: e, currentPath: u, isActive: a, isTreeActive: s, onNavigate: d, onMenuItemClick: p }) {
-  const { openByLevel: c, toggleMenu: t } = C({ menuItems: e, currentPath: u }), h = v(
-    () => e.filter((r) => r.dashboardServices && r.dashboardServices.length > 0),
-    [e]
-  ), l = L((r, o = 0) => {
-    const g = r.dashboardServices && r.dashboardServices.length > 0, f = `${o}-${r.name}`, S = !!c[f], b = s(r), i = o === 0 && h.length === 1;
-    return g ? /* @__PURE__ */ n(
-      y,
-      {
-        item: r,
-        isOpen: S,
-        active: b,
-        collapsed: !1,
-        level: o,
-        isSingleTopLevel: i,
-        onToggle: () => t(f, o, r),
-        children: r.dashboardServices.map((M) => l(M, o + 1))
-      },
-      r.name
-    ) : /* @__PURE__ */ n(
-      W,
-      {
-        item: r,
-        active: a(r),
-        collapsed: !1,
-        level: o,
-        onNavigate: d,
-        onMenuItemClick: p
-      },
-      r.name
-    );
-  }, [c, a, s, t, d, p, h]);
-  return /* @__PURE__ */ n(x, { children: e.map((r) => l(r, 0)) });
+import { jsx as a, Fragment as E } from "react/jsx-runtime";
+import { useMemo as $, useCallback as j } from "react";
+import { MenuItemWrapper as k } from "../MenuItemWrapper/index.js";
+import { SubMenuWrapper as m } from "../SubMenuWrapper/index.js";
+import { useMenuState as B } from "../../hooks/useMenuState.js";
+function G({
+  menuItems: n,
+  currentPath: M,
+  isActive: s,
+  isTreeActive: c,
+  onNavigate: d,
+  onMenuItemClick: p,
+  showChildIcons: h = !0,
+  maxOpenParents: T,
+  maxOpenChildren: L,
+  textOverflow: e = "ellipsis"
+}) {
+  const { openByLevel: t, toggleMenu: l } = B({
+    menuItems: n,
+    currentPath: M,
+    maxOpenParents: T,
+    maxOpenChildren: L
+  }), u = $(
+    () => n.filter(
+      (r) => r.dashboardServices && r.dashboardServices.length > 0
+    ),
+    [n]
+  ), g = j(
+    (r, o = 0) => {
+      const W = r.dashboardServices && r.dashboardServices.length > 0, i = `${o}-${r.name}`, f = !!t[i], x = c(r), S = o === 0 && u.length === 1, b = o === 0 ? !0 : h;
+      return W ? /* @__PURE__ */ a(
+        m,
+        {
+          item: r,
+          isOpen: f,
+          active: x,
+          collapsed: !1,
+          level: o,
+          isSingleTopLevel: S,
+          showIcon: b,
+          onToggle: () => {
+            S && f || l(i, o, r);
+          },
+          textOverflow: e,
+          children: r.dashboardServices.map(
+            (y) => g(y, o + 1)
+          )
+        },
+        r.name
+      ) : /* @__PURE__ */ a(
+        k,
+        {
+          item: r,
+          active: s(r),
+          collapsed: !1,
+          icon: b,
+          level: o,
+          onNavigate: d,
+          onMenuItemClick: p,
+          textOverflow: e
+        },
+        r.name
+      );
+    },
+    [
+      t,
+      s,
+      c,
+      l,
+      d,
+      p,
+      u,
+      h,
+      e
+    ]
+  );
+  return /* @__PURE__ */ a(E, { children: n.map((r) => g(r, 0)) });
 }
 export {
-  m as ExpandedMenu
+  G as ExpandedMenu
 };

package/dist/components/Sidebar/components/MenuRenderer/index.d.ts

@@ -6,7 +6,11 @@ interface MenuRendererProps {
     multicloudExploreList?: unknown[];
     onNavigate: (path: string) => void;
     onMenuItemClick?: (item: MenuItem) => void;
+    showChildIcons?: boolean;
+    maxOpenParents?: number;
+    maxOpenChildren?: number;
+    textOverflow?: "ellipsis" | "wrap";
 }
-export declare function MenuRenderer({ menuItems, currentPath, collapsed, multicloudExploreList, onNavigate, onMenuItemClick }: MenuRendererProps): import("react/jsx-runtime").JSX.Element;
+export declare function MenuRenderer({ menuItems, currentPath, collapsed, multicloudExploreList, onNavigate, onMenuItemClick, showChildIcons, maxOpenParents, maxOpenChildren, textOverflow, }: MenuRendererProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Sidebar/components/MenuRenderer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Sidebar/components/MenuRenderer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAQ/D,UAAU,iBAAiB;IACzB,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,qBAAqB,CAAC,EAAE,OAAO,EAAE,CAAC;IAClC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;CAC5C;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,qBAAqB,EAAE,UAAU,EAAE,eAAe,EAAE,EAAE,iBAAiB,2CAwCxI"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Sidebar/components/MenuRenderer/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAQ/D,UAAU,iBAAiB;IACzB,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,qBAAqB,CAAC,EAAE,OAAO,EAAE,CAAC;IAClC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC3C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;CACpC;AAED,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,WAAW,EACX,SAAS,EACT,qBAAqB,EACrB,UAAU,EACV,eAAe,EACf,cAAqB,EACrB,cAAc,EACd,eAAe,EACf,YAAyB,GAC1B,EAAE,iBAAiB,2CAoHnB"}

package/dist/components/Sidebar/components/MenuRenderer/index.js

@@ -1,29 +1,140 @@
-import { jsx as e, jsxs as _, Fragment as h } from "react/jsx-runtime";
-import { useActiveDetection as v } from "../../hooks/useActiveDetection.js";
-import { SectionLabel as y } from "../SectionLabel/index.js";
-import { MULTICLOUD_VIEW_KEY as S, CHAT_BOT_KEY as A } from "../../Sidebar.constants.js";
-import { CollapsedMenu as f } from "./CollapsedMenu.js";
-import { ExpandedMenu as a } from "./ExpandedMenu.js";
-import '../../../../assets/index-C6j9Ze5V.css';const p = {
-  "menu-renderer": "_menu-renderer_w3wyj_1"
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import { useMemo as b } from "react";
+import { useActiveDetection as z } from "../../hooks/useActiveDetection.js";
+import { SectionLabel as A } from "../SectionLabel/index.js";
+import { MULTICLOUD_VIEW_KEY as T, CHAT_BOT_KEY as D } from "../../Sidebar.constants.js";
+import { CollapsedMenu as h } from "./CollapsedMenu.js";
+import { ExpandedMenu as u } from "./ExpandedMenu.js";
+import '../../../../assets/index-BqELPvtv.css';const K = "_hidden_11z94_5", n = {
+  "menu-renderer": "_menu-renderer_11z94_1",
+  hidden: K
 };
-function K({ menuItems: r, currentPath: l, collapsed: t, multicloudExploreList: u, onNavigate: i, onMenuItemClick: n }) {
-  const { isActive: m, isTreeActive: s } = v({ currentPath: l, allItems: r });
-  if (u && u.length > 0 && r.length > 0) {
-    const o = r.filter((d) => d.key === S), b = r.filter((d) => d.key !== S);
-    return /* @__PURE__ */ e("nav", { className: p["menu-renderer"], role: "menu", "aria-label": "Sidebar navigation", children: t ? /* @__PURE__ */ _(h, { children: [
-      /* @__PURE__ */ e(f, { menuItems: o, isActive: m, isTreeActive: s, onNavigate: i, onMenuItemClick: n }),
-      /* @__PURE__ */ e(y, { label: "Services", collapsed: t }),
-      /* @__PURE__ */ e(f, { menuItems: b, isActive: m, isTreeActive: s, onNavigate: i, onMenuItemClick: n })
-    ] }) : /* @__PURE__ */ _(h, { children: [
-      /* @__PURE__ */ e(a, { menuItems: o, currentPath: l, isActive: m, isTreeActive: s, onNavigate: i, onMenuItemClick: n }),
-      /* @__PURE__ */ e(y, { label: "Services", collapsed: t }),
-      /* @__PURE__ */ e(a, { menuItems: b, currentPath: l, isActive: m, isTreeActive: s, onNavigate: i, onMenuItemClick: n })
-    ] }) });
-  }
-  const c = t ? r : r.filter((o) => o.key !== A);
-  return /* @__PURE__ */ e("nav", { className: p["menu-renderer"], role: "menu", "aria-label": "Sidebar navigation", children: t ? /* @__PURE__ */ e(f, { menuItems: c, isActive: m, isTreeActive: s, onNavigate: i, onMenuItemClick: n }) : /* @__PURE__ */ e(a, { menuItems: c, currentPath: l, isActive: m, isTreeActive: s, onNavigate: i, onMenuItemClick: n }) });
+function R({
+  menuItems: r,
+  currentPath: m,
+  collapsed: c,
+  multicloudExploreList: p,
+  onNavigate: i,
+  onMenuItemClick: d,
+  showChildIcons: t = !0,
+  maxOpenParents: f,
+  maxOpenChildren: v,
+  textOverflow: _ = "ellipsis"
+}) {
+  const { isActive: s, isTreeActive: l } = z({
+    currentPath: m,
+    allItems: r
+  }), E = p && p.length > 0 && r.length > 0, S = b(
+    () => r.filter((o) => o.key === T),
+    [r]
+  ), y = b(
+    () => r.filter((o) => o.key !== T),
+    [r]
+  ), j = b(
+    () => r.filter((o) => o.key !== D),
+    [r]
+  );
+  return E ? /* @__PURE__ */ a(
+    "nav",
+    {
+      className: n["menu-renderer"],
+      role: "menu",
+      "aria-label": "Sidebar navigation",
+      children: [
+        /* @__PURE__ */ a("div", { className: c ? void 0 : n.hidden, children: [
+          /* @__PURE__ */ e(
+            h,
+            {
+              menuItems: S,
+              isActive: s,
+              isTreeActive: l,
+              onNavigate: i,
+              onMenuItemClick: d
+            }
+          ),
+          /* @__PURE__ */ e(A, { label: "Services", collapsed: !0 }),
+          /* @__PURE__ */ e(
+            h,
+            {
+              menuItems: y,
+              isActive: s,
+              isTreeActive: l,
+              onNavigate: i,
+              onMenuItemClick: d
+            }
+          )
+        ] }),
+        /* @__PURE__ */ a("div", { className: c ? n.hidden : void 0, children: [
+          /* @__PURE__ */ e(
+            u,
+            {
+              menuItems: S,
+              currentPath: m,
+              isActive: s,
+              isTreeActive: l,
+              onNavigate: i,
+              onMenuItemClick: d,
+              showChildIcons: t,
+              maxOpenParents: f,
+              maxOpenChildren: v,
+              textOverflow: _
+            }
+          ),
+          /* @__PURE__ */ e(A, { label: "Services", collapsed: !1 }),
+          /* @__PURE__ */ e(
+            u,
+            {
+              menuItems: y,
+              currentPath: m,
+              isActive: s,
+              isTreeActive: l,
+              onNavigate: i,
+              onMenuItemClick: d,
+              showChildIcons: t,
+              maxOpenParents: f,
+              maxOpenChildren: v,
+              textOverflow: _
+            }
+          )
+        ] })
+      ]
+    }
+  ) : /* @__PURE__ */ a(
+    "nav",
+    {
+      className: n["menu-renderer"],
+      role: "menu",
+      "aria-label": "Sidebar navigation",
+      children: [
+        /* @__PURE__ */ e("div", { className: c ? void 0 : n.hidden, children: /* @__PURE__ */ e(
+          h,
+          {
+            menuItems: r,
+            isActive: s,
+            isTreeActive: l,
+            onNavigate: i,
+            onMenuItemClick: d
+          }
+        ) }),
+        /* @__PURE__ */ e("div", { className: c ? n.hidden : void 0, children: /* @__PURE__ */ e(
+          u,
+          {
+            menuItems: j,
+            currentPath: m,
+            isActive: s,
+            isTreeActive: l,
+            onNavigate: i,
+            onMenuItemClick: d,
+            showChildIcons: t,
+            maxOpenParents: f,
+            maxOpenChildren: v,
+            textOverflow: _
+          }
+        ) })
+      ]
+    }
+  );
 }
 export {
-  K as MenuRenderer
+  R as MenuRenderer
 };

package/dist/components/Sidebar/components/ModuleSwitchButton/index.d.ts

@@ -6,6 +6,6 @@ interface ModuleSwitchButtonProps {
     userType?: string;
     onModuleSwitch: (moduleName: string) => void;
 }
-export declare function ModuleSwitchButton({ modules, collapsed, currentModuleId, userType, onModuleSwitch }: ModuleSwitchButtonProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function ModuleSwitchButton({ modules, collapsed, currentModuleId, userType, onModuleSwitch, }: ModuleSwitchButtonProps): import("react/jsx-runtime").JSX.Element | null;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Sidebar/components/ModuleSwitchButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Sidebar/components/ModuleSwitchButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAK9C,UAAU,uBAAuB;IAC/B,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,kBAAkB,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,uBAAuB,kDA6B5H"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../lib/components/Sidebar/components/ModuleSwitchButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAM9C,UAAU,uBAAuB;IAC/B,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,SAAS,EACT,eAAe,EACf,QAAQ,EACR,cAAc,GACf,EAAE,uBAAuB,kDAwCzB"}