react-luminus-components 1.0.6 → 1.1.1

package/dist/layout.es.js

@@ -1,167 +1,96 @@
-import { j as n, e as o, L as M } from "./HomeDashboard.module-CuVVnp4t.mjs";
-import N, { useMemo as x, useContext as g, useState as A, useEffect as F } from "react";
-import { M as G, S as H } from "./SimpleTooltip-C8wTRZNZ.mjs";
-import { T as U, t as X, s as C, E as z, a as K, b as O, c as W, d as q } from "./hasClass-D3KZs5y_.mjs";
-function h(...s) {
-  return s.filter((e) => e != null).reduce((e, t) => {
-    if (typeof t != "function")
-      throw new Error("Invalid Argument Type, must only provide functions, undefined, or null.");
-    return e === null ? t : function(...c) {
-      e.apply(this, c), t.apply(this, c);
-    };
-  }, null);
-}
-const J = {
-  height: ["marginTop", "marginBottom"],
-  width: ["marginLeft", "marginRight"]
-};
-function Q(s, e) {
-  const t = `offset${s[0].toUpperCase()}${s.slice(1)}`, a = e[t], c = J[s];
-  return a + // @ts-ignore
-  parseInt(C(e, c[0]), 10) + // @ts-ignore
-  parseInt(C(e, c[1]), 10);
-}
-const V = {
-  [z]: "collapse",
-  [K]: "collapsing",
-  [O]: "collapsing",
-  [W]: "collapse show"
-}, Y = /* @__PURE__ */ N.forwardRef(({
-  onEnter: s,
-  onEntering: e,
-  onEntered: t,
-  onExit: a,
-  onExiting: c,
-  className: p,
-  children: d,
-  dimension: m = "height",
-  in: u = !1,
-  timeout: _ = 300,
-  mountOnEnter: y = !1,
-  unmountOnExit: E = !1,
-  appear: $ = !1,
-  getDimensionValue: v = Q,
-  ...b
-}, T) => {
-  const i = typeof m == "function" ? m() : m, k = x(() => h((r) => {
-    r.style[i] = "0";
-  }, s), [i, s]), S = x(() => h((r) => {
-    const f = `scroll${i[0].toUpperCase()}${i.slice(1)}`;
-    r.style[i] = `${r[f]}px`;
-  }, e), [i, e]), R = x(() => h((r) => {
-    r.style[i] = null;
-  }, t), [i, t]), L = x(() => h((r) => {
-    r.style[i] = `${v(i, r)}px`, q(r);
-  }, a), [a, v, i]), D = x(() => h((r) => {
-    r.style[i] = null;
-  }, c), [i, c]);
-  return /* @__PURE__ */ n.jsx(U, {
-    ref: T,
-    addEndListener: X,
-    ...b,
-    "aria-expanded": b.role ? u : null,
-    onEnter: k,
-    onEntering: S,
-    onEntered: R,
-    onExit: L,
-    onExiting: D,
-    childRef: d.ref,
-    in: u,
-    timeout: _,
-    mountOnEnter: y,
-    unmountOnExit: E,
-    appear: $,
-    children: (r, f) => /* @__PURE__ */ N.cloneElement(d, {
-      ...f,
-      className: o(p, d.props.className, V[r], i === "width" && "collapse-horizontal")
-    })
-  });
-}), Z = Y, P = "_side-menu-item_8j1cd_1", ee = "_nav-button_8j1cd_4", ne = "_child_8j1cd_11", se = "_text_8j1cd_14", te = "_icon_8j1cd_17", oe = "_collapse-icon_8j1cd_23", ae = "_collapsed_8j1cd_33", le = "_expanded_8j1cd_40", l = {
-  "side-menu-item": "_side-menu-item_8j1cd_1",
-  sideMenuItem: P,
-  "nav-button": "_nav-button_8j1cd_4",
-  navButton: ee,
-  child: ne,
-  text: se,
-  icon: te,
-  "collapse-icon": "_collapse-icon_8j1cd_23",
-  collapseIcon: oe,
-  collapsed: ae,
-  expanded: le
-}, w = ({ item: s, menuExpanded: e, children: t }) => s.tooltip && !e ? /* @__PURE__ */ n.jsx(H, { text: s.tooltip, placement: "right", children: t }) : t, B = ({ item: s, menuExpanded: e, collapsed: t, onCollapse: a }) => {
-  var p;
-  const { LinkComponent: c } = g(M);
-  return s.children ? /* @__PURE__ */ n.jsx("li", { className: o("luminus-side-menu-item", l.sideMenuItem, {
-    [l.expanded]: e
-  }), children: /* @__PURE__ */ n.jsx(w, { item: s, menuExpanded: e, children: /* @__PURE__ */ n.jsxs("div", { children: [
-    /* @__PURE__ */ n.jsxs("button", { type: "button", className: o("nav-link", l.navButton), onClick: () => a(), children: [
-      /* @__PURE__ */ n.jsx("div", { className: o("icon", l.icon), children: s.icon }),
-      e && /* @__PURE__ */ n.jsx("div", { className: o("text", l.text, "text-nowrap"), children: s.title }),
-      e && /* @__PURE__ */ n.jsx("div", { className: o("collapse-icon", l.collapseIcon, {
-        [l.collapsed]: t
-      }), children: /* @__PURE__ */ n.jsx(G, {}) })
+import { L as b, j as e, d as t, i as B } from "./Collapse.module-cs5hXOag.mjs";
+import { useContext as C, useState as N, useEffect as M } from "react";
+import { S as f } from "./SimpleTooltip-CmA9EcfY.mjs";
+const k = "_side-menu-item_9ejxx_1", w = "_nav-button_9ejxx_5", I = "_child_9ejxx_13", S = "_text_9ejxx_16", g = "_icon_9ejxx_19", T = "_collapse-icon_9ejxx_25", $ = "_collapsed_9ejxx_35", y = "_expanded_9ejxx_42", L = "_children-container_9ejxx_48", H = "_visible_9ejxx_57", o = {
+  "side-menu-item": "_side-menu-item_9ejxx_1",
+  sideMenuItem: k,
+  "nav-button": "_nav-button_9ejxx_5",
+  navButton: w,
+  child: I,
+  text: S,
+  icon: g,
+  "collapse-icon": "_collapse-icon_9ejxx_25",
+  collapseIcon: T,
+  collapsed: $,
+  expanded: y,
+  "children-container": "_children-container_9ejxx_48",
+  childrenContainer: L,
+  visible: H
+}, q = ({ item: n, menuExpanded: s, children: i }) => n.tooltip && !s ? /* @__PURE__ */ e.jsx(f, { text: n.tooltip, placement: "right", children: i }) : i, m = ({ item: n, menuExpanded: s, collapsed: i, onCollapse: a, currentPath: h }) => {
+  var l, j;
+  const { LinkComponent: d } = C(b), [_, r] = N(!1), [u] = h.split("?"), c = n.linkTo === u || ((l = n.children) == null ? void 0 : l.some((x) => x.linkTo === u));
+  return /* @__PURE__ */ e.jsx("li", { className: t("luminus-side-menu-item", o.sideMenuItem, {
+    [o.expanded]: s
+  }, { active: _ || c }, { open: i && n.children }), onMouseEnter: () => r(!0), onMouseLeave: () => r(!1), children: /* @__PURE__ */ e.jsx(q, { item: n, menuExpanded: s, children: n.children ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsxs("button", { type: "button", className: t("nav-link", o.navButton), onClick: () => a(), children: [
+      /* @__PURE__ */ e.jsx("div", { className: t("icon", o.icon), children: n.icon }),
+      s && /* @__PURE__ */ e.jsx("div", { className: t("text", o.text, "text-nowrap"), children: n.title }),
+      s && /* @__PURE__ */ e.jsx("div", { className: t("collapse-icon", o.collapseIcon, {
+        [o.collapsed]: i
+      }), children: /* @__PURE__ */ e.jsx(B, {}) })
     ] }),
-    /* @__PURE__ */ n.jsx(Z, { in: t, children: /* @__PURE__ */ n.jsx("div", { children: (p = s.children) == null ? void 0 : p.map((d) => /* @__PURE__ */ n.jsx(c, { to: d.linkTo ?? "/", className: o("nav-link", l.navButton, l.child), children: /* @__PURE__ */ n.jsx("div", { className: o("text", l.text, "text-nowrap"), children: d.title }) }, d.linkTo)) }) })
-  ] }) }) }) : /* @__PURE__ */ n.jsx("li", { className: o("luminus-side-menu-item", l.sideMenuItem, {
-    [l.expanded]: e
-  }), children: /* @__PURE__ */ n.jsx(w, { item: s, menuExpanded: e, children: /* @__PURE__ */ n.jsxs(c, { to: s.linkTo ?? "/", className: o("nav-link", l.navButton), children: [
-    /* @__PURE__ */ n.jsx("div", { className: o("icon", l.icon), children: s.icon }),
-    e && /* @__PURE__ */ n.jsx("div", { className: o("text", l.text, "text-nowrap"), children: s.title })
+    /* @__PURE__ */ e.jsx("div", { className: t("children-container shadow rounded", o.childrenContainer, {
+      [o.visible]: i
+    }), children: (j = n.children) == null ? void 0 : j.map((x) => /* @__PURE__ */ e.jsx(d, { to: x.linkTo ?? "/", className: t("nav-link child rounded", o.navButton, o.child), children: /* @__PURE__ */ e.jsx("div", { className: t("text", o.text, "text-nowrap"), children: x.title }) }, x.linkTo)) })
+  ] }) : /* @__PURE__ */ e.jsxs(d, { to: n.linkTo ?? "/", className: t("nav-link", o.navButton), children: [
+    /* @__PURE__ */ e.jsx("div", { className: t("icon", o.icon), children: n.icon }),
+    s && /* @__PURE__ */ e.jsx("div", { className: t("text", o.text, "text-nowrap"), children: n.title })
   ] }) }) });
-}, ce = "_side-menu_s0700_1", ie = "_sidebar-header_s0700_14", re = "_side-menu-content_s0700_19", de = "_expand_s0700_23", j = {
-  "side-menu": "_side-menu_s0700_1",
-  sideMenu: ce,
-  "sidebar-header": "_sidebar-header_s0700_14",
-  sidebarHeader: ie,
-  "side-menu-content": "_side-menu-content_s0700_19",
-  sideMenuContent: re,
-  expand: de
-}, Ce = ({ headerItem: s, mainItems: e, secondaryItems: t, expanded: a, setExpanded: c }) => {
-  const [p, d] = A(-1), m = (u) => {
-    d(u === p ? -1 : u);
+}, R = "_side-menu_1hjei_1", A = "_sidebar-header_1hjei_13", F = "_side-menu-content_1hjei_18", E = "_expand_1hjei_22", K = "_divider_1hjei_26", p = {
+  "side-menu": "_side-menu_1hjei_1",
+  sideMenu: R,
+  "sidebar-header": "_sidebar-header_1hjei_13",
+  sidebarHeader: A,
+  "side-menu-content": "_side-menu-content_1hjei_18",
+  sideMenuContent: F,
+  expand: E,
+  divider: K
+}, Z = ({ headerItem: n, mainItems: s, secondaryItems: i, expanded: a, setExpanded: h, currentPath: d }) => {
+  const [_, r] = N(-1), u = (c) => {
+    r(c === _ ? -1 : c);
   };
-  return F(() => {
-    a || d(-1);
-  }, [a]), /* @__PURE__ */ n.jsxs("section", { className: o("luminus-side-menu", j.sideMenu, "shadow", {
-    [j.expand]: a
-  }, { expand: a }), onMouseEnter: () => c(!0), onMouseLeave: () => c(!1), children: [
-    /* @__PURE__ */ n.jsx("div", { className: o("sidebar-header", j.sidebarHeader), children: s }),
-    /* @__PURE__ */ n.jsxs("ul", { className: j.sideMenuContent, children: [
-      e.map((u, _) => /* @__PURE__ */ n.jsx(B, { item: u, menuExpanded: a, collapsed: _ === p, onCollapse: () => m(_) }, u.title)),
-      /* @__PURE__ */ n.jsx("hr", {}),
-      t.map((u, _) => /* @__PURE__ */ n.jsx(B, { item: u, menuExpanded: a, collapsed: _ === p, onCollapse: () => m(_) }, u.title))
+  return M(() => {
+    a || r(-1);
+  }, [a]), /* @__PURE__ */ e.jsxs("section", { className: t("luminus-side-menu", p.sideMenu, {
+    [p.expand]: a
+  }, { expand: a }), onMouseEnter: () => h(!0), onMouseLeave: () => h(!1), children: [
+    /* @__PURE__ */ e.jsx("div", { className: t("sidebar-header", p.sidebarHeader), children: n }),
+    /* @__PURE__ */ e.jsxs("ul", { className: p.sideMenuContent, children: [
+      s.map((c, l) => /* @__PURE__ */ e.jsx(m, { item: c, menuExpanded: a, collapsed: l === _, onCollapse: () => u(l), currentPath: d }, c.title)),
+      /* @__PURE__ */ e.jsx("hr", { className: t("divider", p.divider) }),
+      i.map((c, l) => /* @__PURE__ */ e.jsx(m, { item: c, menuExpanded: a, collapsed: l === _, onCollapse: () => u(l), currentPath: d }, c.title))
     ] })
   ] });
-}, ue = "_top-bar_4di1c_1", pe = "_top-bar-brand_4di1c_13", I = {
-  "top-bar": "_top-bar_4di1c_1",
-  topBar: ue,
-  "top-bar-brand": "_top-bar-brand_4di1c_13",
-  topBarBrand: pe
-}, we = ({ appName: s, leftOffset: e, children: t }) => {
-  const { LinkComponent: a } = g(M);
-  return /* @__PURE__ */ n.jsxs("nav", { className: o("shadow luminus-top-bar", I.topBar), style: {
-    width: e ? `calc(100% - ${e}px)` : void 0,
-    left: e ? `${e}px` : void 0
+}, z = "_top-bar_1t8hq_1", D = "_top-bar-brand_1t8hq_13", v = {
+  "top-bar": "_top-bar_1t8hq_1",
+  topBar: z,
+  "top-bar-brand": "_top-bar-brand_1t8hq_13",
+  topBarBrand: D
+}, O = ({ appName: n, leftOffset: s, children: i }) => {
+  const { LinkComponent: a } = C(b);
+  return /* @__PURE__ */ e.jsxs("nav", { className: t("luminus-top-bar", v.topBar), style: {
+    width: s ? `calc(100% - ${s}px)` : void 0,
+    left: s ? `${s}px` : void 0
   }, children: [
-    /* @__PURE__ */ n.jsx(a, { to: "/", className: o("luminus-top-bar-brand", I.topBarBrand), children: s }),
-    /* @__PURE__ */ n.jsx("div", { className: "w-100 d-flex justify-content-end align-items-center gap-2", children: t })
+    /* @__PURE__ */ e.jsx(a, { to: "/", className: t("luminus-top-bar-brand", v.topBarBrand), children: n }),
+    /* @__PURE__ */ e.jsx("div", { className: "w-100 d-flex justify-content-end align-items-center gap-2", children: i })
   ] });
-}, _e = "_side-content-bar_17kwd_1", me = {
+}, G = "_side-content-bar_17kwd_1", J = {
   "side-content-bar": "_side-content-bar_17kwd_1",
-  sideContentBar: _e
-}, xe = ({ width: s, children: e }) => /* @__PURE__ */ n.jsx("section", { className: o("shadow luminus-side-content-bar", me.sideContentBar), style: {
-  width: `${s}px`
-}, children: e }), Be = ({ children: s, sideContent: e }) => /* @__PURE__ */ n.jsxs("div", { className: "container-fluid p-3", children: [
-  /* @__PURE__ */ n.jsx("div", { style: { paddingRight: e ? "250px" : void 0 }, children: s }),
-  e && /* @__PURE__ */ n.jsx(xe, { width: 250, children: e })
-] }), he = "_full-screen-container_1c9bu_1", je = {
+  sideContentBar: G
+}, Q = ({ width: n, children: s }) => /* @__PURE__ */ e.jsx("section", { className: t("luminus-side-content-bar", J.sideContentBar), style: {
+  width: `${n}px`
+}, children: s }), P = ({ children: n, sideContent: s }) => /* @__PURE__ */ e.jsxs("div", { className: "container-fluid p-3", children: [
+  /* @__PURE__ */ e.jsx("div", { style: { paddingRight: s ? "250px" : void 0 }, children: n }),
+  s && /* @__PURE__ */ e.jsx(Q, { width: 250, children: s })
+] }), U = "_full-screen-container_1c9bu_1", V = {
   "full-screen-container": "_full-screen-container_1c9bu_1",
-  fullScreenContainer: he
-}, Ie = ({ children: s }) => /* @__PURE__ */ n.jsx("div", { className: o("container-fluid p-3 overflow-hidden luminus-full-screen-container", je.fullScreenContainer), children: s });
+  fullScreenContainer: U
+}, ee = ({ children: n }) => /* @__PURE__ */ e.jsx("div", { className: t("container-fluid p-3 overflow-hidden luminus-full-screen-container", V.fullScreenContainer), children: n });
 export {
-  Ie as FullScreenContainer,
-  Be as MainContainer,
-  xe as SideContentBar,
-  Ce as SideMenu,
-  we as TopBar
+  ee as FullScreenContainer,
+  P as MainContainer,
+  Q as SideContentBar,
+  Z as SideMenu,
+  O as TopBar
 };