@orbe-agro/client-core 5.3.261 → 5.3.264

package/dist/@ecme/components/template/StackedSideNav/StackedSideNav.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackedSideNav.js","sources":["../../../../../lib/@ecme/components/template/StackedSideNav/StackedSideNav.tsx"],"sourcesContent":["import { useState } from 'react'\nimport {\n    SPLITTED_SIDE_NAV_MINI_WIDTH,\n    STACKED_SIDE_NAV_SECONDARY_WIDTH,\n    DIR_LTR,\n    DIR_RTL,\n} from '@/constants/theme.constant'\nimport StackedSideNavMini, { SelectedMenuItem } from './StackedSideNavMini'\nimport StackedSideNavSecondary from './StackedSideNavSecondary'\nimport useResponsive from '@/utils/hooks/useResponsive'\nimport { useThemeStore } from '@/store/themeStore'\nimport { useRouteKeyStore } from '@/store/routeKeyStore'\nimport { useSessionUser } from '@/store/authStore'\nimport navigationConfig from '@/configs/navigation.config'\nimport appConfig from '@/configs/app.config'\nimport isEmpty from 'lodash/isEmpty'\nimport useTranslation from '@/utils/hooks/useTranslation'\nimport type { TraslationFn } from '@/@types/common'\n\nconst stackedSideNavDefaultStyle = {\n    width: SPLITTED_SIDE_NAV_MINI_WIDTH,\n}\n\nconst StackedSideNav = ({\n    translationSetup = appConfig.activeNavTranslation,\n}: {\n    translationSetup?: boolean\n}) => {\n    const { t } = useTranslation(!translationSetup)\n\n    const [selectedMenu, setSelectedMenu] = useState<SelectedMenuItem>({})\n    const [activeKeys, setActiveKeys] = useState<string[]>([])\n\n    const mode = useThemeStore((state) => state.mode)\n    const direction = useThemeStore((state) => state.direction)\n\n    const currentRouteKey = useRouteKeyStore((state) => state.currentRouteKey)\n\n    const userAuthority = useSessionUser((state) => state.user.authority)\n\n    const { larger } = useResponsive()\n\n    const navColor = (navType: string, mode: string) => {\n        return `${navType}-${mode}`\n    }\n\n    const handleChange = (selected: SelectedMenuItem) => {\n        setSelectedMenu(selected)\n    }\n\n    const handleCollpase = () => {\n        setSelectedMenu({})\n        setActiveKeys([])\n    }\n\n    const handleSetActiveKey = (key: string[]) => {\n        setActiveKeys(key)\n    }\n\n    const stackedSideNavSecondaryDirStyle = () => {\n        let style = {}\n        const marginValue = `${-STACKED_SIDE_NAV_SECONDARY_WIDTH}px`\n        if (direction === DIR_LTR) {\n            style = { marginLeft: marginValue }\n        }\n\n        if (direction === DIR_RTL) {\n            style = { marginRight: marginValue }\n        }\n\n        return style\n    }\n\n    return (\n        <>\n            {larger.md && (\n                <div className={`stacked-side-nav`}>\n                    <StackedSideNavMini\n                        className={`stacked-side-nav-mini ${navColor(\n                            'stacked-side-nav-mini',\n                            mode,\n                        )}`}\n                        style={stackedSideNavDefaultStyle}\n                        routeKey={currentRouteKey}\n                        activeKeys={activeKeys}\n                        mode={mode}\n                        direction={direction}\n                        navigationTree={navigationConfig}\n                        userAuthority={userAuthority || []}\n                        selectedMenu={selectedMenu}\n                        t={t as TraslationFn}\n                        onChange={handleChange}\n                        onSetActiveKey={handleSetActiveKey}\n                    />\n                    <div\n                        className={`stacked-side-nav-secondary ${navColor(\n                            'stacked-side-nav-secondary',\n                            mode,\n                        )}`}\n                        style={{\n                            width: STACKED_SIDE_NAV_SECONDARY_WIDTH,\n                            ...(isEmpty(selectedMenu)\n                                ? stackedSideNavSecondaryDirStyle()\n                                : {}),\n                        }}\n                    >\n                        {!isEmpty(selectedMenu) && (\n                            <StackedSideNavSecondary\n                                title={t(\n                                    selectedMenu.translateKey as string,\n                                    selectedMenu.title as string,\n                                )}\n                                menu={selectedMenu.menu}\n                                routeKey={currentRouteKey}\n                                direction={direction}\n                                translationSetup={translationSetup}\n                                userAuthority={userAuthority || []}\n                                onCollapse={handleCollpase}\n                            />\n                        )}\n                    </div>\n                </div>\n            )}\n        </>\n    )\n}\n\nexport default StackedSideNav\n"],"names":["stackedSideNavDefaultStyle","SPLITTED_SIDE_NAV_MINI_WIDTH","StackedSideNav","translationSetup","appConfig","t","useTranslation","selectedMenu","setSelectedMenu","useState","activeKeys","setActiveKeys","mode","useThemeStore","state","direction","currentRouteKey","useRouteKeyStore","userAuthority","useSessionUser","larger","useResponsive","navColor","navType","handleChange","selected","handleCollpase","handleSetActiveKey","key","stackedSideNavSecondaryDirStyle","style","marginValue","STACKED_SIDE_NAV_SECONDARY_WIDTH","DIR_LTR","DIR_RTL","jsxs","jsx","StackedSideNavMini","navigationConfig","isEmpty","StackedSideNavSecondary"],"mappings":";;;;;;;;;;;;;AAmBA,MAAMA,IAA6B;AAAA,EAC/B,OAAOC;AACX,GAEMC,IAAiB,CAAC;AAAA,EACpB,kBAAAC,IAAmBC,EAAU;AACjC,MAEM;AACF,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,CAACH,CAAgB,GAExC,CAACI,GAAcC,CAAe,IAAIC,EAA2B,CAAA,CAAE,GAC/D,CAACC,GAAYC,CAAa,IAAIF,EAAmB,CAAA,CAAE,GAEnDG,IAAOC,EAAc,CAACC,MAAUA,EAAM,IAAI,GAC1CC,IAAYF,EAAc,CAACC,MAAUA,EAAM,SAAS,GAEpDE,IAAkBC,EAAiB,CAACH,MAAUA,EAAM,eAAe,GAEnEI,IAAgBC,EAAe,CAACL,MAAUA,EAAM,KAAK,SAAS,GAE9D,EAAE,QAAAM,EAAO,IAAIC,EAAc,GAE3BC,IAAW,CAACC,GAAiBX,MACxB,GAAGW,CAAO,IAAIX,CAAI,IAGvBY,IAAe,CAACC,MAA+B;AACjD,IAAAjB,EAAgBiB,CAAQ;AAAA,EAC5B,GAEMC,IAAiB,MAAM;AACzB,IAAAlB,EAAgB,CAAA,CAAE,GAClBG,EAAc,CAAA,CAAE;AAAA,EACpB,GAEMgB,IAAqB,CAACC,MAAkB;AAC1C,IAAAjB,EAAciB,CAAG;AAAA,EACrB,GAEMC,IAAkC,MAAM;AAC1C,QAAIC,IAAQ,CAAC;AACP,UAAAC,IAAc,GAAG,CAACC,CAAgC;AACxD,WAAIjB,MAAckB,MACNH,IAAA,EAAE,YAAYC,EAAY,IAGlChB,MAAcmB,MACNJ,IAAA,EAAE,aAAaC,EAAY,IAGhCD;AAAA,EACX;AAEA,gCAES,UAAOV,EAAA,MACH,gBAAAe,EAAA,OAAA,EAAI,WAAW,oBACZ,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,WAAW,yBAAyBf;AAAA,UAChC;AAAA,UACAV;AAAA,QAAA,CACH;AAAA,QACD,OAAOZ;AAAA,QACP,UAAUgB;AAAA,QACV,YAAAN;AAAA,QACA,MAAAE;AAAA,QACA,WAAAG;AAAA,QACA,gBAAgBuB;AAAA,QAChB,eAAepB,KAAiB,CAAC;AAAA,QACjC,cAAAX;AAAA,QACA,GAAAF;AAAA,QACA,UAAUmB;AAAA,QACV,gBAAgBG;AAAA,MAAA;AAAA,IACpB;AAAA,IACA,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,8BAA8Bd;AAAA,UACrC;AAAA,UACAV;AAAA,QAAA,CACH;AAAA,QACD,OAAO;AAAA,UACH,OAAOoB;AAAA,UACP,GAAIO,EAAQhC,CAAY,IAClBsB,MACA,CAAA;AAAA,QACV;AAAA,QAEC,UAAA,CAACU,EAAQhC,CAAY,KAClB,gBAAA6B;AAAA,UAACI;AAAA,UAAA;AAAA,YACG,OAAOnC;AAAA,cACHE,EAAa;AAAA,cACbA,EAAa;AAAA,YACjB;AAAA,YACA,MAAMA,EAAa;AAAA,YACnB,UAAUS;AAAA,YACV,WAAAD;AAAA,YACA,kBAAAZ;AAAA,YACA,eAAee,KAAiB,CAAC;AAAA,YACjC,YAAYQ;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB;AAAA,IAAA;AAAA,EAER,EAAA,CACJ,EAER,CAAA;AAER;"}
+{"version":3,"file":"StackedSideNav.js","sources":["../../../../../lib/@ecme/components/template/StackedSideNav/StackedSideNav.tsx"],"sourcesContent":["import { useState } from 'react'\nimport {\n    SPLITTED_SIDE_NAV_MINI_WIDTH,\n    STACKED_SIDE_NAV_SECONDARY_WIDTH,\n    DIR_LTR,\n    DIR_RTL,\n} from '@/constants/theme.constant'\nimport StackedSideNavMini, { SelectedMenuItem } from './StackedSideNavMini'\nimport StackedSideNavSecondary from './StackedSideNavSecondary'\nimport useResponsive from '@/utils/hooks/useResponsive'\nimport { useThemeStore } from '@/store/themeStore'\nimport { useRouteKeyStore } from '@/store/routeKeyStore'\nimport { useSessionUser } from '@/store/authStore'\nimport navigationConfig from '@/configs/navigation.config'\nimport appConfig from '@/configs/app.config'\nimport isEmpty from 'lodash/isEmpty'\nimport useTranslation from '@/utils/hooks/useTranslation'\nimport type { TraslationFn } from '@/@types/common'\n\nconst stackedSideNavDefaultStyle = {\n    width: SPLITTED_SIDE_NAV_MINI_WIDTH,\n}\n\nconst StackedSideNav = ({\n    translationSetup = appConfig.activeNavTranslation,\n}: {\n    translationSetup?: boolean\n}) => {\n    const { t } = useTranslation(!translationSetup)\n\n    const [selectedMenu, setSelectedMenu] = useState<SelectedMenuItem>({})\n    const [activeKeys, setActiveKeys] = useState<string[]>([])\n\n    const mode = useThemeStore((state) => state.mode)\n    const direction = useThemeStore((state) => state.direction)\n\n    const currentRouteKey = useRouteKeyStore((state) => state.currentRouteKey)\n\n    const userAuthority = useSessionUser((state) => state.user.authority)\n\n    const { larger } = useResponsive()\n\n    const navColor = (navType: string, mode: string) => {\n        return `${navType}-${mode}`\n    }\n\n    const handleChange = (selected: SelectedMenuItem) => {\n        setSelectedMenu(selected)\n    }\n\n    const handleCollpase = () => {\n        setSelectedMenu({})\n        setActiveKeys([])\n    }\n\n    const handleSetActiveKey = (key: string[]) => {\n        setActiveKeys(key)\n    }\n\n    const stackedSideNavSecondaryDirStyle = () => {\n        let style = {}\n        const marginValue = `${-STACKED_SIDE_NAV_SECONDARY_WIDTH}px`\n        if (direction === DIR_LTR) {\n            style = { marginLeft: marginValue }\n        }\n\n        if (direction === DIR_RTL) {\n            style = { marginRight: marginValue }\n        }\n\n        return style\n    }\n\n    return (\n        <>\n            {larger.md && (\n                <div className={`stacked-side-nav`}>\n                    <StackedSideNavMini\n                        className={`stacked-side-nav-mini ${navColor(\n                            'stacked-side-nav-mini',\n                            mode,\n                        )}`}\n                        style={stackedSideNavDefaultStyle}\n                        routeKey={currentRouteKey}\n                        activeKeys={activeKeys}\n                        mode={mode}\n                        direction={direction}\n                        navigationTree={navigationConfig}\n                        userAuthority={userAuthority || []}\n                        selectedMenu={selectedMenu}\n                        t={t as TraslationFn}\n                        onChange={handleChange}\n                        onSetActiveKey={handleSetActiveKey}\n                    />\n                    <div\n                        className={`stacked-side-nav-secondary ${navColor(\n                            'stacked-side-nav-secondary',\n                            mode,\n                        )}`}\n                        style={{\n                            width: STACKED_SIDE_NAV_SECONDARY_WIDTH,\n                            ...(isEmpty(selectedMenu)\n                                ? stackedSideNavSecondaryDirStyle()\n                                : {}),\n                        }}\n                    >\n                        {!isEmpty(selectedMenu) && (\n                            <StackedSideNavSecondary\n                                title={t(\n                                    selectedMenu.translateKey as string,\n                                    selectedMenu.title as string,\n                                )}\n                                menu={selectedMenu.menu}\n                                routeKey={currentRouteKey}\n                                direction={direction}\n                                translationSetup={translationSetup}\n                                userAuthority={userAuthority || []}\n                                onCollapse={handleCollpase}\n                            />\n                        )}\n                    </div>\n                </div>\n            )}\n        </>\n    )\n}\n\nexport default StackedSideNav\n"],"names":["mode"],"mappings":";;;;;;;;;;;;;AAmBA,MAAM,6BAA6B;AAAA,EAC/B,OAAO;AACX;AAEA,MAAM,iBAAiB,CAAC;AAAA,EACpB,mBAAmB,UAAU;AACjC,MAEM;AACF,QAAM,EAAE,EAAA,IAAM,eAAe,CAAC,gBAAgB;AAE9C,QAAM,CAAC,cAAc,eAAe,IAAI,SAA2B,CAAA,CAAE;AACrE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAmB,CAAA,CAAE;AAEzD,QAAM,OAAO,cAAc,CAAC,UAAU,MAAM,IAAI;AAChD,QAAM,YAAY,cAAc,CAAC,UAAU,MAAM,SAAS;AAE1D,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,QAAM,gBAAgB,eAAe,CAAC,UAAU,MAAM,KAAK,SAAS;AAE9D,QAAA,EAAE,OAAO,IAAI,cAAc;AAE3B,QAAA,WAAW,CAAC,SAAiBA,UAAiB;AACzC,WAAA,GAAG,OAAO,IAAIA,KAAI;AAAA,EAC7B;AAEM,QAAA,eAAe,CAAC,aAA+B;AACjD,oBAAgB,QAAQ;AAAA,EAC5B;AAEA,QAAM,iBAAiB,MAAM;AACzB,oBAAgB,CAAA,CAAE;AAClB,kBAAc,CAAA,CAAE;AAAA,EACpB;AAEM,QAAA,qBAAqB,CAAC,QAAkB;AAC1C,kBAAc,GAAG;AAAA,EACrB;AAEA,QAAM,kCAAkC,MAAM;AAC1C,QAAI,QAAQ,CAAC;AACP,UAAA,cAAc,GAAG,CAAC,gCAAgC;AACxD,QAAI,cAAc,SAAS;AACf,cAAA,EAAE,YAAY,YAAY;AAAA,IAAA;AAGtC,QAAI,cAAc,SAAS;AACf,cAAA,EAAE,aAAa,YAAY;AAAA,IAAA;AAGhC,WAAA;AAAA,EACX;AAEA,yCAES,UAAO,OAAA,MACH,qBAAA,OAAA,EAAI,WAAW,oBACZ,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,yBAAyB;AAAA,UAChC;AAAA,UACA;AAAA,QAAA,CACH;AAAA,QACD,OAAO;AAAA,QACP,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAChB,eAAe,iBAAiB,CAAC;AAAA,QACjC;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,gBAAgB;AAAA,MAAA;AAAA,IACpB;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,8BAA8B;AAAA,UACrC;AAAA,UACA;AAAA,QAAA,CACH;AAAA,QACD,OAAO;AAAA,UACH,OAAO;AAAA,UACP,GAAI,QAAQ,YAAY,IAClB,oCACA,CAAA;AAAA,QACV;AAAA,QAEC,UAAA,CAAC,QAAQ,YAAY,KAClB;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,OAAO;AAAA,cACH,aAAa;AAAA,cACb,aAAa;AAAA,YACjB;AAAA,YACA,MAAM,aAAa;AAAA,YACnB,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA,eAAe,iBAAiB,CAAC;AAAA,YACjC,YAAY;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB;AAAA,IAAA;AAAA,EAER,EAAA,CACJ,EAER,CAAA;AAER;"}

package/dist/@ecme/components/template/StackedSideNav/StackedSideNavMini.js

@@ -1,116 +1,123 @@
-import { jsxs as I, jsx as t } from "react/jsx-runtime";
-import { useEffect as A } from "react";
-import S from "../Logo.js";
-import { Menu as l } from "../../ui/Menu/index.js";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useEffect } from "react";
+import Logo from "../Logo.js";
+import { Menu } from "../../ui/Menu/index.js";
 import "../../ui/ScrollBar/index.js";
-import b from "../../shared/AuthorityCheck.js";
-import { SIDE_NAV_CONTENT_GUTTER as _, HEADER_HEIGHT as C } from "../../../constants/theme.constant.js";
-import { NAV_ITEM_TYPE_ITEM as H } from "../../../constants/navigation.constant.js";
-import L from "../../../configs/app.config.js";
-import s from "../../../configs/navigation-icon.config.js";
-import j from "../../../utils/hooks/useMenuActive.js";
-import c from "lodash/isEmpty";
-import { Link as a } from "react-router-dom";
-import { getLogoFilename as R } from "../../../../base/utils/logo.js";
-import D from "../../ui/ScrollBar/ScrollBar.js";
-const Z = (u) => {
+import AuthorityCheck from "../../shared/AuthorityCheck.js";
+import { SIDE_NAV_CONTENT_GUTTER, HEADER_HEIGHT } from "../../../constants/theme.constant.js";
+import { NAV_ITEM_TYPE_ITEM } from "../../../constants/navigation.constant.js";
+import appConfig from "../../../configs/app.config.js";
+import navigationIcon from "../../../configs/navigation-icon.config.js";
+import useMenuActive from "../../../utils/hooks/useMenuActive.js";
+import isEmpty from "lodash/isEmpty";
+import { Link } from "react-router-dom";
+import { getLogoFilename } from "../../../../base/utils/logo.js";
+import ScrollBar from "../../ui/ScrollBar/ScrollBar.js";
+const StackedSideNavMini = (props) => {
   const {
-    onChange: r,
-    routeKey: y,
-    activeKeys: o,
-    onSetActiveKey: m,
-    direction: d,
-    navigationTree: n,
-    userAuthority: h,
-    mode: f,
-    selectedMenu: p,
-    t: k,
-    ...M
-  } = u, { includedRouteTree: i } = j(n, y), N = ({
-    key: e,
-    title: x,
-    menu: K,
-    translateKey: T
+    onChange,
+    routeKey,
+    activeKeys,
+    onSetActiveKey,
+    direction,
+    navigationTree,
+    userAuthority,
+    mode,
+    selectedMenu,
+    t,
+    ...rest
+  } = props;
+  const { includedRouteTree } = useMenuActive(navigationTree, routeKey);
+  const handleMenuItemSelect = ({
+    key,
+    title,
+    menu,
+    translateKey
   }) => {
-    r({ title: x, menu: K, translateKey: T }), m([e]);
-  }, E = ({ key: e }) => {
-    r({}), m([e]);
+    onChange({ title, menu, translateKey });
+    onSetActiveKey([key]);
   };
-  A(() => {
-    i.type !== H && !c(i) && r({
-      key: i.key,
-      title: i.title,
-      menu: i.subMenu,
-      translateKey: i.translateKey
-    });
-  }, [i.key]);
-  const g = o && o.length > 0 ? o : c(p) ? [] : [i.key];
-  return /* @__PURE__ */ I("div", { ...M, children: [
-    /* @__PURE__ */ t(
-      a,
+  const handleLinkMenuItemSelect = ({ key }) => {
+    onChange({});
+    onSetActiveKey([key]);
+  };
+  useEffect(() => {
+    if (includedRouteTree.type !== NAV_ITEM_TYPE_ITEM && !isEmpty(includedRouteTree)) {
+      onChange({
+        key: includedRouteTree.key,
+        title: includedRouteTree.title,
+        menu: includedRouteTree.subMenu,
+        translateKey: includedRouteTree.translateKey
+      });
+    }
+  }, [includedRouteTree.key]);
+  const defaultActiveKeys = activeKeys && activeKeys.length > 0 ? activeKeys : isEmpty(selectedMenu) ? [] : [includedRouteTree.key];
+  return /* @__PURE__ */ jsxs("div", { ...rest, children: [
+    /* @__PURE__ */ jsx(
+      Link,
       {
-        to: L.authenticatedEntryPath,
+        to: appConfig.authenticatedEntryPath,
         className: "stacked-mini-nav-header flex items-center justify-center",
-        style: { height: C },
-        children: /* @__PURE__ */ t(
-          S,
+        style: { height: HEADER_HEIGHT },
+        children: /* @__PURE__ */ jsx(
+          Logo,
           {
             imgClass: "max-h-8",
-            name: R(!0, f),
-            className: _
+            name: getLogoFilename(true, mode),
+            className: SIDE_NAV_CONTENT_GUTTER
           }
         )
       }
     ),
-    /* @__PURE__ */ t(D, { autoHide: !0, direction: d, children: /* @__PURE__ */ t(
-      l,
+    /* @__PURE__ */ jsx(ScrollBar, { autoHide: true, direction, children: /* @__PURE__ */ jsx(
+      Menu,
       {
         className: "px-4 pb-4",
-        defaultActiveKeys: g,
-        children: n.map((e) => /* @__PURE__ */ t(
-          b,
+        defaultActiveKeys,
+        children: navigationTree.map((nav) => /* @__PURE__ */ jsx(
+          AuthorityCheck,
           {
-            authority: e.authority,
-            userAuthority: h,
-            children: /* @__PURE__ */ t("div", { title: k(e.translateKey, e.title), children: e.subMenu && e.subMenu.length > 0 ? /* @__PURE__ */ t(
-              l.MenuItem,
+            authority: nav.authority,
+            userAuthority,
+            children: /* @__PURE__ */ jsx("div", { title: t(nav.translateKey, nav.title), children: nav.subMenu && nav.subMenu.length > 0 ? /* @__PURE__ */ jsx(
+              Menu.MenuItem,
               {
-                eventKey: e.key,
+                eventKey: nav.key,
                 className: "mb-2",
-                onSelect: () => N({
-                  key: e.key,
-                  title: e.title,
-                  menu: e.subMenu,
-                  translateKey: e.translateKey
+                onSelect: () => handleMenuItemSelect({
+                  key: nav.key,
+                  title: nav.title,
+                  menu: nav.subMenu,
+                  translateKey: nav.translateKey
                 }),
-                children: /* @__PURE__ */ t("div", { className: "text-2xl", children: s[e.icon] })
+                children: /* @__PURE__ */ jsx("div", { className: "text-2xl", children: navigationIcon[nav.icon] })
               }
-            ) : /* @__PURE__ */ t(
-              a,
+            ) : /* @__PURE__ */ jsx(
+              Link,
               {
-                to: e.path,
+                to: nav.path,
                 className: "flex h-full w-full items-center",
-                onClick: () => E({
-                  key: e.key
+                onClick: () => handleLinkMenuItemSelect({
+                  key: nav.key
                 }),
-                children: /* @__PURE__ */ t(
-                  l.MenuItem,
+                children: /* @__PURE__ */ jsx(
+                  Menu.MenuItem,
                   {
-                    eventKey: e.key,
+                    eventKey: nav.key,
                     className: "mb-2",
-                    children: /* @__PURE__ */ t("div", { className: "text-2xl", children: s[e.icon] })
+                    children: /* @__PURE__ */ jsx("div", { className: "text-2xl", children: navigationIcon[nav.icon] })
                   }
                 )
               }
             ) })
           },
-          e.key
+          nav.key
         ))
       }
     ) })
   ] });
 };
 export {
-  Z as default
+  StackedSideNavMini as default
 };
 //# sourceMappingURL=StackedSideNavMini.js.map

package/dist/@ecme/components/template/StackedSideNav/StackedSideNavMini.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackedSideNavMini.js","sources":["../../../../../lib/@ecme/components/template/StackedSideNav/StackedSideNavMini.tsx"],"sourcesContent":["import { useEffect } from 'react'\nimport Logo from '@/components/template/Logo'\nimport Menu from '@/components/ui/Menu'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport AuthorityCheck from '@/components/shared/AuthorityCheck'\nimport {\n    SIDE_NAV_CONTENT_GUTTER,\n    HEADER_HEIGHT,\n} from '@/constants/theme.constant'\nimport { NAV_ITEM_TYPE_ITEM } from '@/constants/navigation.constant'\nimport appConfig from '@/configs/app.config'\nimport navigationIcon from '@/configs/navigation-icon.config'\nimport useMenuActive from '@/utils/hooks/useMenuActive'\nimport isEmpty from 'lodash/isEmpty'\nimport { Link } from 'react-router-dom'\nimport type { NavigationTree } from '@/@types/navigation'\nimport type { Direction, Mode } from '@/@types/theme'\nimport type { CommonProps } from '@/@types/common'\nimport { getLogoFilename } from '@base/utils/logo'\n\nexport type SelectedMenuItem = {\n    key?: string\n    title?: string\n    menu?: NavigationTree[]\n    translateKey?: string\n}\n\ninterface StackedSideNavMiniProps extends CommonProps {\n    className?: string\n    onChange: (item: SelectedMenuItem) => void\n    routeKey: string\n    activeKeys: string[]\n    onSetActiveKey: (activeKey: string[]) => void\n    userAuthority: string[]\n    mode: Mode\n    direction: Direction\n    navigationTree: NavigationTree[]\n    selectedMenu: SelectedMenuItem\n    t: (\n        key: string,\n        fallback?: string | Record<string, string | number>,\n    ) => string\n}\n\nconst StackedSideNavMini = (props: StackedSideNavMiniProps) => {\n    const {\n        onChange,\n        routeKey,\n        activeKeys,\n        onSetActiveKey,\n        direction,\n        navigationTree,\n        userAuthority,\n        mode,\n        selectedMenu,\n        t,\n        ...rest\n    } = props\n\n    const { includedRouteTree } = useMenuActive(navigationTree, routeKey)\n\n    const handleMenuItemSelect = ({\n        key,\n        title,\n        menu,\n        translateKey,\n    }: SelectedMenuItem) => {\n        onChange({ title, menu, translateKey })\n        onSetActiveKey([key as string])\n    }\n\n    const handleLinkMenuItemSelect = ({ key }: SelectedMenuItem) => {\n        onChange({})\n        onSetActiveKey([key as string])\n    }\n\n    useEffect(() => {\n        if (\n            includedRouteTree.type !== NAV_ITEM_TYPE_ITEM &&\n            !isEmpty(includedRouteTree)\n        ) {\n            onChange({\n                key: includedRouteTree.key,\n                title: includedRouteTree.title,\n                menu: includedRouteTree.subMenu,\n                translateKey: includedRouteTree.translateKey,\n            })\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [includedRouteTree.key])\n\n    const defaultActiveKeys =\n        activeKeys && activeKeys.length > 0\n            ? activeKeys\n            : isEmpty(selectedMenu)\n              ? []\n              : [includedRouteTree.key]\n\n    return (\n        <div {...rest}>\n            <Link\n                to={appConfig.authenticatedEntryPath}\n                className=\"stacked-mini-nav-header flex items-center justify-center\"\n                style={{ height: HEADER_HEIGHT }}\n            >\n                <Logo\n                    imgClass=\"max-h-8\"\n                    name={getLogoFilename(true, mode)}\n                    className={SIDE_NAV_CONTENT_GUTTER}\n                />\n            </Link>\n            <ScrollBar autoHide direction={direction}>\n                <Menu\n                    className=\"px-4 pb-4\"\n                    defaultActiveKeys={defaultActiveKeys}\n                >\n                    {navigationTree.map((nav) => (\n                        <AuthorityCheck\n                            key={nav.key}\n                            authority={nav.authority}\n                            userAuthority={userAuthority}\n                        >\n                            <div title={t(nav.translateKey, nav.title)}>\n                                {nav.subMenu && nav.subMenu.length > 0 ? (\n                                    <Menu.MenuItem\n                                        eventKey={nav.key}\n                                        className=\"mb-2\"\n                                        onSelect={() =>\n                                            handleMenuItemSelect({\n                                                key: nav.key,\n                                                title: nav.title,\n                                                menu: nav.subMenu,\n                                                translateKey: nav.translateKey,\n                                            })\n                                        }\n                                    >\n                                        <div className=\"text-2xl\">\n                                            {navigationIcon[nav.icon]}\n                                        </div>\n                                    </Menu.MenuItem>\n                                ) : (\n                                    <Link\n                                        to={nav.path}\n                                        className=\"flex h-full w-full items-center\"\n                                        onClick={() =>\n                                            handleLinkMenuItemSelect({\n                                                key: nav.key,\n                                            })\n                                        }\n                                    >\n                                        <Menu.MenuItem\n                                            eventKey={nav.key}\n                                            className=\"mb-2\"\n                                        >\n                                            <div className=\"text-2xl\">\n                                                {navigationIcon[nav.icon]}\n                                            </div>\n                                        </Menu.MenuItem>\n                                    </Link>\n                                )}\n                            </div>\n                        </AuthorityCheck>\n                    ))}\n                </Menu>\n            </ScrollBar>\n        </div>\n    )\n}\n\nexport default StackedSideNavMini\n"],"names":["StackedSideNavMini","props","onChange","routeKey","activeKeys","onSetActiveKey","direction","navigationTree","userAuthority","mode","selectedMenu","t","rest","includedRouteTree","useMenuActive","handleMenuItemSelect","key","title","menu","translateKey","handleLinkMenuItemSelect","useEffect","NAV_ITEM_TYPE_ITEM","isEmpty","defaultActiveKeys","jsxs","jsx","Link","appConfig","HEADER_HEIGHT","Logo","getLogoFilename","SIDE_NAV_CONTENT_GUTTER","ScrollBar","Menu","nav","AuthorityCheck","navigationIcon"],"mappings":";;;;;;;;;;;;;;;AA4CM,MAAAA,IAAqB,CAACC,MAAmC;AACrD,QAAA;AAAA,IACF,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,MAAAC;AAAA,IACA,cAAAC;AAAA,IACA,GAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHX,GAEE,EAAE,mBAAAY,EAAsB,IAAAC,EAAcP,GAAgBJ,CAAQ,GAE9DY,IAAuB,CAAC;AAAA,IAC1B,KAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,cAAAC;AAAA,EAAA,MACoB;AACpB,IAAAjB,EAAS,EAAE,OAAAe,GAAO,MAAAC,GAAM,cAAAC,EAAA,CAAc,GACvBd,EAAA,CAACW,CAAa,CAAC;AAAA,EAClC,GAEMI,IAA2B,CAAC,EAAE,KAAAJ,QAA4B;AAC5D,IAAAd,EAAS,CAAA,CAAE,GACIG,EAAA,CAACW,CAAa,CAAC;AAAA,EAClC;AAEA,EAAAK,EAAU,MAAM;AACZ,IACIR,EAAkB,SAASS,KAC3B,CAACC,EAAQV,CAAiB,KAEjBX,EAAA;AAAA,MACL,KAAKW,EAAkB;AAAA,MACvB,OAAOA,EAAkB;AAAA,MACzB,MAAMA,EAAkB;AAAA,MACxB,cAAcA,EAAkB;AAAA,IAAA,CACnC;AAAA,EACL,GAED,CAACA,EAAkB,GAAG,CAAC;AAE1B,QAAMW,IACFpB,KAAcA,EAAW,SAAS,IAC5BA,IACAmB,EAAQb,CAAY,IAClB,CAAA,IACA,CAACG,EAAkB,GAAG;AAG9B,SAAA,gBAAAY,EAAC,OAAK,EAAA,GAAGb,GACL,UAAA;AAAA,IAAA,gBAAAc;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,IAAIC,EAAU;AAAA,QACd,WAAU;AAAA,QACV,OAAO,EAAE,QAAQC,EAAc;AAAA,QAE/B,UAAA,gBAAAH;AAAA,UAACI;AAAA,UAAA;AAAA,YACG,UAAS;AAAA,YACT,MAAMC,EAAgB,IAAMtB,CAAI;AAAA,YAChC,WAAWuB;AAAA,UAAA;AAAA,QAAA;AAAA,MACf;AAAA,IACJ;AAAA,IACC,gBAAAN,EAAAO,GAAA,EAAU,UAAQ,IAAC,WAAA3B,GAChB,UAAA,gBAAAoB;AAAA,MAACQ;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,mBAAAV;AAAA,QAEC,UAAAjB,EAAe,IAAI,CAAC4B,MACjB,gBAAAT;AAAA,UAACU;AAAA,UAAA;AAAA,YAEG,WAAWD,EAAI;AAAA,YACf,eAAA3B;AAAA,YAEA,UAAC,gBAAAkB,EAAA,OAAA,EAAI,OAAOf,EAAEwB,EAAI,cAAcA,EAAI,KAAK,GACpC,UAAIA,EAAA,WAAWA,EAAI,QAAQ,SAAS,IACjC,gBAAAT;AAAA,cAACQ,EAAK;AAAA,cAAL;AAAA,gBACG,UAAUC,EAAI;AAAA,gBACd,WAAU;AAAA,gBACV,UAAU,MACNpB,EAAqB;AAAA,kBACjB,KAAKoB,EAAI;AAAA,kBACT,OAAOA,EAAI;AAAA,kBACX,MAAMA,EAAI;AAAA,kBACV,cAAcA,EAAI;AAAA,gBAAA,CACrB;AAAA,gBAGL,4BAAC,OAAI,EAAA,WAAU,YACV,UAAeE,EAAAF,EAAI,IAAI,EAC5B,CAAA;AAAA,cAAA;AAAA,YAAA,IAGJ,gBAAAT;AAAA,cAACC;AAAA,cAAA;AAAA,gBACG,IAAIQ,EAAI;AAAA,gBACR,WAAU;AAAA,gBACV,SAAS,MACLf,EAAyB;AAAA,kBACrB,KAAKe,EAAI;AAAA,gBAAA,CACZ;AAAA,gBAGL,UAAA,gBAAAT;AAAA,kBAACQ,EAAK;AAAA,kBAAL;AAAA,oBACG,UAAUC,EAAI;AAAA,oBACd,WAAU;AAAA,oBAEV,4BAAC,OAAI,EAAA,WAAU,YACV,UAAeE,EAAAF,EAAI,IAAI,EAC5B,CAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACJ;AAAA,YAAA,EAGZ,CAAA;AAAA,UAAA;AAAA,UA1CKA,EAAI;AAAA,QA4ChB,CAAA;AAAA,MAAA;AAAA,IAAA,EAET,CAAA;AAAA,EAAA,GACJ;AAER;"}
+{"version":3,"file":"StackedSideNavMini.js","sources":["../../../../../lib/@ecme/components/template/StackedSideNav/StackedSideNavMini.tsx"],"sourcesContent":["import { useEffect } from 'react'\nimport Logo from '@/components/template/Logo'\nimport Menu from '@/components/ui/Menu'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport AuthorityCheck from '@/components/shared/AuthorityCheck'\nimport {\n    SIDE_NAV_CONTENT_GUTTER,\n    HEADER_HEIGHT,\n} from '@/constants/theme.constant'\nimport { NAV_ITEM_TYPE_ITEM } from '@/constants/navigation.constant'\nimport appConfig from '@/configs/app.config'\nimport navigationIcon from '@/configs/navigation-icon.config'\nimport useMenuActive from '@/utils/hooks/useMenuActive'\nimport isEmpty from 'lodash/isEmpty'\nimport { Link } from 'react-router-dom'\nimport type { NavigationTree } from '@/@types/navigation'\nimport type { Direction, Mode } from '@/@types/theme'\nimport type { CommonProps } from '@/@types/common'\nimport { getLogoFilename } from '@base/utils/logo'\n\nexport type SelectedMenuItem = {\n    key?: string\n    title?: string\n    menu?: NavigationTree[]\n    translateKey?: string\n}\n\ninterface StackedSideNavMiniProps extends CommonProps {\n    className?: string\n    onChange: (item: SelectedMenuItem) => void\n    routeKey: string\n    activeKeys: string[]\n    onSetActiveKey: (activeKey: string[]) => void\n    userAuthority: string[]\n    mode: Mode\n    direction: Direction\n    navigationTree: NavigationTree[]\n    selectedMenu: SelectedMenuItem\n    t: (\n        key: string,\n        fallback?: string | Record<string, string | number>,\n    ) => string\n}\n\nconst StackedSideNavMini = (props: StackedSideNavMiniProps) => {\n    const {\n        onChange,\n        routeKey,\n        activeKeys,\n        onSetActiveKey,\n        direction,\n        navigationTree,\n        userAuthority,\n        mode,\n        selectedMenu,\n        t,\n        ...rest\n    } = props\n\n    const { includedRouteTree } = useMenuActive(navigationTree, routeKey)\n\n    const handleMenuItemSelect = ({\n        key,\n        title,\n        menu,\n        translateKey,\n    }: SelectedMenuItem) => {\n        onChange({ title, menu, translateKey })\n        onSetActiveKey([key as string])\n    }\n\n    const handleLinkMenuItemSelect = ({ key }: SelectedMenuItem) => {\n        onChange({})\n        onSetActiveKey([key as string])\n    }\n\n    useEffect(() => {\n        if (\n            includedRouteTree.type !== NAV_ITEM_TYPE_ITEM &&\n            !isEmpty(includedRouteTree)\n        ) {\n            onChange({\n                key: includedRouteTree.key,\n                title: includedRouteTree.title,\n                menu: includedRouteTree.subMenu,\n                translateKey: includedRouteTree.translateKey,\n            })\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [includedRouteTree.key])\n\n    const defaultActiveKeys =\n        activeKeys && activeKeys.length > 0\n            ? activeKeys\n            : isEmpty(selectedMenu)\n              ? []\n              : [includedRouteTree.key]\n\n    return (\n        <div {...rest}>\n            <Link\n                to={appConfig.authenticatedEntryPath}\n                className=\"stacked-mini-nav-header flex items-center justify-center\"\n                style={{ height: HEADER_HEIGHT }}\n            >\n                <Logo\n                    imgClass=\"max-h-8\"\n                    name={getLogoFilename(true, mode)}\n                    className={SIDE_NAV_CONTENT_GUTTER}\n                />\n            </Link>\n            <ScrollBar autoHide direction={direction}>\n                <Menu\n                    className=\"px-4 pb-4\"\n                    defaultActiveKeys={defaultActiveKeys}\n                >\n                    {navigationTree.map((nav) => (\n                        <AuthorityCheck\n                            key={nav.key}\n                            authority={nav.authority}\n                            userAuthority={userAuthority}\n                        >\n                            <div title={t(nav.translateKey, nav.title)}>\n                                {nav.subMenu && nav.subMenu.length > 0 ? (\n                                    <Menu.MenuItem\n                                        eventKey={nav.key}\n                                        className=\"mb-2\"\n                                        onSelect={() =>\n                                            handleMenuItemSelect({\n                                                key: nav.key,\n                                                title: nav.title,\n                                                menu: nav.subMenu,\n                                                translateKey: nav.translateKey,\n                                            })\n                                        }\n                                    >\n                                        <div className=\"text-2xl\">\n                                            {navigationIcon[nav.icon]}\n                                        </div>\n                                    </Menu.MenuItem>\n                                ) : (\n                                    <Link\n                                        to={nav.path}\n                                        className=\"flex h-full w-full items-center\"\n                                        onClick={() =>\n                                            handleLinkMenuItemSelect({\n                                                key: nav.key,\n                                            })\n                                        }\n                                    >\n                                        <Menu.MenuItem\n                                            eventKey={nav.key}\n                                            className=\"mb-2\"\n                                        >\n                                            <div className=\"text-2xl\">\n                                                {navigationIcon[nav.icon]}\n                                            </div>\n                                        </Menu.MenuItem>\n                                    </Link>\n                                )}\n                            </div>\n                        </AuthorityCheck>\n                    ))}\n                </Menu>\n            </ScrollBar>\n        </div>\n    )\n}\n\nexport default StackedSideNavMini\n"],"names":[],"mappings":"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"}

package/dist/@ecme/components/template/StackedSideNav/StackedSideNavSecondary.js

@@ -1,60 +1,61 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import "../../ui/ScrollBar/index.js";
-import d from "../../../utils/classNames.js";
-import { DIR_LTR as f, DIR_RTL as h, HEADER_HEIGHT as N } from "../../../constants/theme.constant.js";
+import classNames from "../../../utils/classNames.js";
+import { DIR_LTR, DIR_RTL, HEADER_HEIGHT } from "../../../constants/theme.constant.js";
 import "../VerticalMenuContent/index.js";
-import { HiOutlineArrowSmLeft as S, HiOutlineArrowSmRight as y } from "react-icons/hi";
-import H from "../../ui/ScrollBar/ScrollBar.js";
-import R from "../VerticalMenuContent/VerticalMenuContent.js";
-const w = (o) => {
+import { HiOutlineArrowSmLeft, HiOutlineArrowSmRight } from "react-icons/hi";
+import ScrollBar from "../../ui/ScrollBar/ScrollBar.js";
+import VerticalMenuContent from "../VerticalMenuContent/VerticalMenuContent.js";
+const StackedSideNavSecondary = (props) => {
   const {
-    className: i,
-    title: l,
-    menu: n,
-    routeKey: s,
-    onCollapse: a,
-    direction: t,
-    translationSetup: m,
-    userAuthority: c,
-    ...u
-  } = o, p = () => {
-    a();
+    className,
+    title,
+    menu,
+    routeKey,
+    onCollapse,
+    direction,
+    translationSetup,
+    userAuthority,
+    ...rest
+  } = props;
+  const handleCollpase = () => {
+    onCollapse();
   };
-  return /* @__PURE__ */ r("div", { className: d("h-full", i), ...u, children: [
-    /* @__PURE__ */ r(
+  return /* @__PURE__ */ jsxs("div", { className: classNames("h-full", className), ...rest, children: [
+    /* @__PURE__ */ jsxs(
       "div",
       {
-        className: "flex items-center justify-between gap-4 pl-6 pr-4",
-        style: { height: N },
+        className: `flex items-center justify-between gap-4 pl-6 pr-4`,
+        style: { height: HEADER_HEIGHT },
         children: [
-          /* @__PURE__ */ e("h5", { className: "font-bold", children: l }),
-          /* @__PURE__ */ r(
+          /* @__PURE__ */ jsx("h5", { className: "font-bold", children: title }),
+          /* @__PURE__ */ jsxs(
             "button",
             {
               type: "button",
               className: "close-button",
-              onClick: p,
+              onClick: handleCollpase,
               children: [
-                t === f && /* @__PURE__ */ e(S, {}),
-                t === h && /* @__PURE__ */ e(y, {})
+                direction === DIR_LTR && /* @__PURE__ */ jsx(HiOutlineArrowSmLeft, {}),
+                direction === DIR_RTL && /* @__PURE__ */ jsx(HiOutlineArrowSmRight, {})
               ]
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ e(H, { autoHide: !0, direction: t, children: /* @__PURE__ */ e(
-      R,
+    /* @__PURE__ */ jsx(ScrollBar, { autoHide: true, direction, children: /* @__PURE__ */ jsx(
+      VerticalMenuContent,
       {
-        routeKey: s,
-        navigationTree: n,
-        translationSetup: m,
-        userAuthority: c
+        routeKey,
+        navigationTree: menu,
+        translationSetup,
+        userAuthority
       }
     ) })
   ] });
 };
 export {
-  w as default
+  StackedSideNavSecondary as default
 };
 //# sourceMappingURL=StackedSideNavSecondary.js.map

package/dist/@ecme/components/template/StackedSideNav/StackedSideNavSecondary.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackedSideNavSecondary.js","sources":["../../../../../lib/@ecme/components/template/StackedSideNav/StackedSideNavSecondary.tsx"],"sourcesContent":["import ScrollBar from '@/components/ui/ScrollBar'\nimport classNames from '@/utils/classNames'\nimport { HEADER_HEIGHT, DIR_LTR, DIR_RTL } from '@/constants/theme.constant'\nimport VerticalMenuContent from '@/components/template/VerticalMenuContent'\nimport { HiOutlineArrowSmLeft, HiOutlineArrowSmRight } from 'react-icons/hi'\nimport type { NavigationTree } from '@/@types/navigation'\nimport type { Direction } from '@/@types/theme'\n\ntype StackedSideNavSecondaryProps = {\n    className?: string\n    title: string\n    menu?: NavigationTree[]\n    routeKey: string\n    onCollapse: () => void\n    direction?: Direction\n    translationSetup?: boolean\n    userAuthority: string[]\n}\n\nconst StackedSideNavSecondary = (props: StackedSideNavSecondaryProps) => {\n    const {\n        className,\n        title,\n        menu,\n        routeKey,\n        onCollapse,\n        direction,\n        translationSetup,\n        userAuthority,\n        ...rest\n    } = props\n\n    const handleCollpase = () => {\n        onCollapse()\n    }\n\n    return (\n        <div className={classNames('h-full', className)} {...rest}>\n            <div\n                className={`flex items-center justify-between gap-4 pl-6 pr-4`}\n                style={{ height: HEADER_HEIGHT }}\n            >\n                <h5 className=\"font-bold\">{title}</h5>\n                <button\n                    type=\"button\"\n                    className=\"close-button\"\n                    onClick={handleCollpase}\n                >\n                    {direction === DIR_LTR && <HiOutlineArrowSmLeft />}\n                    {direction === DIR_RTL && <HiOutlineArrowSmRight />}\n                </button>\n            </div>\n            <ScrollBar autoHide direction={direction}>\n                <VerticalMenuContent\n                    routeKey={routeKey}\n                    navigationTree={menu}\n                    translationSetup={translationSetup}\n                    userAuthority={userAuthority}\n                />\n            </ScrollBar>\n        </div>\n    )\n}\n\nexport default StackedSideNavSecondary\n"],"names":["StackedSideNavSecondary","props","className","title","menu","routeKey","onCollapse","direction","translationSetup","userAuthority","rest","handleCollpase","jsxs","classNames","HEADER_HEIGHT","jsx","DIR_LTR","HiOutlineArrowSmLeft","DIR_RTL","HiOutlineArrowSmRight","ScrollBar","VerticalMenuContent"],"mappings":";;;;;;;;AAmBM,MAAAA,IAA0B,CAACC,MAAwC;AAC/D,QAAA;AAAA,IACF,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,WAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHT,GAEEU,IAAiB,MAAM;AACd,IAAAL,EAAA;AAAA,EACf;AAGI,SAAA,gBAAAM,EAAC,SAAI,WAAWC,EAAW,UAAUX,CAAS,GAAI,GAAGQ,GACjD,UAAA;AAAA,IAAA,gBAAAE;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW;AAAA,QACX,OAAO,EAAE,QAAQE,EAAc;AAAA,QAE/B,UAAA;AAAA,UAAC,gBAAAC,EAAA,MAAA,EAAG,WAAU,aAAa,UAAMZ,GAAA;AAAA,UACjC,gBAAAS;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAASD;AAAA,cAER,UAAA;AAAA,gBAAcJ,MAAAS,uBAAYC,GAAqB,CAAA,CAAA;AAAA,gBAC/CV,MAAcW,KAAW,gBAAAH,EAACI,GAAsB,CAAA,CAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACrD;AAAA,MAAA;AAAA,IACJ;AAAA,IACC,gBAAAJ,EAAAK,GAAA,EAAU,UAAQ,IAAC,WAAAb,GAChB,UAAA,gBAAAQ;AAAA,MAACM;AAAA,MAAA;AAAA,QACG,UAAAhB;AAAA,QACA,gBAAgBD;AAAA,QAChB,kBAAAI;AAAA,QACA,eAAAC;AAAA,MAAA;AAAA,IAAA,EAER,CAAA;AAAA,EAAA,GACJ;AAER;"}
+{"version":3,"file":"StackedSideNavSecondary.js","sources":["../../../../../lib/@ecme/components/template/StackedSideNav/StackedSideNavSecondary.tsx"],"sourcesContent":["import ScrollBar from '@/components/ui/ScrollBar'\nimport classNames from '@/utils/classNames'\nimport { HEADER_HEIGHT, DIR_LTR, DIR_RTL } from '@/constants/theme.constant'\nimport VerticalMenuContent from '@/components/template/VerticalMenuContent'\nimport { HiOutlineArrowSmLeft, HiOutlineArrowSmRight } from 'react-icons/hi'\nimport type { NavigationTree } from '@/@types/navigation'\nimport type { Direction } from '@/@types/theme'\n\ntype StackedSideNavSecondaryProps = {\n    className?: string\n    title: string\n    menu?: NavigationTree[]\n    routeKey: string\n    onCollapse: () => void\n    direction?: Direction\n    translationSetup?: boolean\n    userAuthority: string[]\n}\n\nconst StackedSideNavSecondary = (props: StackedSideNavSecondaryProps) => {\n    const {\n        className,\n        title,\n        menu,\n        routeKey,\n        onCollapse,\n        direction,\n        translationSetup,\n        userAuthority,\n        ...rest\n    } = props\n\n    const handleCollpase = () => {\n        onCollapse()\n    }\n\n    return (\n        <div className={classNames('h-full', className)} {...rest}>\n            <div\n                className={`flex items-center justify-between gap-4 pl-6 pr-4`}\n                style={{ height: HEADER_HEIGHT }}\n            >\n                <h5 className=\"font-bold\">{title}</h5>\n                <button\n                    type=\"button\"\n                    className=\"close-button\"\n                    onClick={handleCollpase}\n                >\n                    {direction === DIR_LTR && <HiOutlineArrowSmLeft />}\n                    {direction === DIR_RTL && <HiOutlineArrowSmRight />}\n                </button>\n            </div>\n            <ScrollBar autoHide direction={direction}>\n                <VerticalMenuContent\n                    routeKey={routeKey}\n                    navigationTree={menu}\n                    translationSetup={translationSetup}\n                    userAuthority={userAuthority}\n                />\n            </ScrollBar>\n        </div>\n    )\n}\n\nexport default StackedSideNavSecondary\n"],"names":[],"mappings":";;;;;;;;AAmBM,MAAA,0BAA0B,CAAC,UAAwC;AAC/D,QAAA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,iBAAiB,MAAM;AACd,eAAA;AAAA,EACf;AAGI,SAAA,qBAAC,SAAI,WAAW,WAAW,UAAU,SAAS,GAAI,GAAG,MACjD,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW;AAAA,QACX,OAAO,EAAE,QAAQ,cAAc;AAAA,QAE/B,UAAA;AAAA,UAAC,oBAAA,MAAA,EAAG,WAAU,aAAa,UAAM,OAAA;AAAA,UACjC;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS;AAAA,cAER,UAAA;AAAA,gBAAc,cAAA,+BAAY,sBAAqB,CAAA,CAAA;AAAA,gBAC/C,cAAc,WAAW,oBAAC,uBAAsB,CAAA,CAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACrD;AAAA,MAAA;AAAA,IACJ;AAAA,IACC,oBAAA,WAAA,EAAU,UAAQ,MAAC,WAChB,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG;AAAA,QACA,gBAAgB;AAAA,QAChB;AAAA,QACA;AAAA,MAAA;AAAA,IAAA,EAER,CAAA;AAAA,EAAA,GACJ;AAER;"}

package/dist/@ecme/components/template/StackedSideNav/index.js

@@ -1,5 +1,5 @@
-import e from "./StackedSideNav.js";
+import StackedSideNav from "./StackedSideNav.js";
 export {
-  e as default
+  StackedSideNav as default
 };
 //# sourceMappingURL=index.js.map

package/dist/@ecme/components/template/Theme.js

@@ -1,28 +1,31 @@
-import { jsx as t } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import "../ui/ConfigProvider/index.js";
-import { themeConfig as i } from "../../configs/theme.config.js";
-import o from "../../utils/hooks/useDarkMode.js";
-import s from "../../utils/hooks/useThemeSchema.js";
-import c from "../../utils/hooks/useLocale.js";
-import f from "../../utils/hooks/useDirection.js";
-import n from "../ui/ConfigProvider/ConfigProvider.js";
-const v = (r) => {
-  const [e] = o();
-  s(), o(), f();
-  const { locale: m } = c();
-  return /* @__PURE__ */ t(
-    n,
+import { themeConfig } from "../../configs/theme.config.js";
+import useDarkMode from "../../utils/hooks/useDarkMode.js";
+import useThemeSchema from "../../utils/hooks/useThemeSchema.js";
+import useLocale from "../../utils/hooks/useLocale.js";
+import useDirection from "../../utils/hooks/useDirection.js";
+import ConfigProvider from "../ui/ConfigProvider/ConfigProvider.js";
+const Theme = (props) => {
+  const [isDarkMode] = useDarkMode();
+  useThemeSchema();
+  useDarkMode();
+  useDirection();
+  const { locale } = useLocale();
+  const mode = isDarkMode ? "dark" : "light";
+  return /* @__PURE__ */ jsx(
+    ConfigProvider,
     {
       value: {
-        locale: m,
-        ...i,
-        mode: e ? "dark" : "light"
+        locale,
+        ...themeConfig,
+        mode
       },
-      children: r.children
+      children: props.children
     }
   );
 };
 export {
-  v as default
+  Theme as default
 };
 //# sourceMappingURL=Theme.js.map

package/dist/@ecme/components/template/Theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.js","sources":["../../../../lib/@ecme/components/template/Theme.tsx"],"sourcesContent":["import ConfigProvider from \"@/components/ui/ConfigProvider\";\nimport { themeConfig } from \"@/configs/theme.config\";\nimport useDarkMode from \"@/utils/hooks/useDarkMode\";\nimport useThemeSchema from \"@/utils/hooks/useThemeSchema\";\nimport useLocale from \"@/utils/hooks/useLocale\";\nimport useDirection from \"@/utils/hooks/useDirection\";\nimport type { CommonProps } from \"@/@types/common\";\n\nconst Theme = (props: CommonProps) => {\n  const [isDarkMode] = useDarkMode();\n  useThemeSchema();\n  useDarkMode();\n  useDirection();\n\n  const { locale } = useLocale();\n  const mode = isDarkMode ? \"dark\" : \"light\";\n  return (\n    <ConfigProvider\n      value={{\n        locale: locale,\n        ...themeConfig,\n        mode: mode,\n      }}\n    >\n      {props.children}\n    </ConfigProvider>\n  );\n};\n\nexport default Theme;\n"],"names":["Theme","props","isDarkMode","useDarkMode","useThemeSchema","useDirection","locale","useLocale","jsx","ConfigProvider","themeConfig"],"mappings":";;;;;;;;AAQM,MAAAA,IAAQ,CAACC,MAAuB;AAC9B,QAAA,CAACC,CAAU,IAAIC,EAAY;AAClB,EAAAC,EAAA,GACHD,EAAA,GACCE,EAAA;AAEP,QAAA,EAAE,QAAAC,EAAO,IAAIC,EAAU;AAG3B,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,QAAAH;AAAA,QACA,GAAGI;AAAA,QACH,MANOR,IAAa,SAAS;AAAA,MAO/B;AAAA,MAEC,UAAMD,EAAA;AAAA,IAAA;AAAA,EACT;AAEJ;"}
+{"version":3,"file":"Theme.js","sources":["../../../../lib/@ecme/components/template/Theme.tsx"],"sourcesContent":["import ConfigProvider from \"@/components/ui/ConfigProvider\";\nimport { themeConfig } from \"@/configs/theme.config\";\nimport useDarkMode from \"@/utils/hooks/useDarkMode\";\nimport useThemeSchema from \"@/utils/hooks/useThemeSchema\";\nimport useLocale from \"@/utils/hooks/useLocale\";\nimport useDirection from \"@/utils/hooks/useDirection\";\nimport type { CommonProps } from \"@/@types/common\";\n\nconst Theme = (props: CommonProps) => {\n  const [isDarkMode] = useDarkMode();\n  useThemeSchema();\n  useDarkMode();\n  useDirection();\n\n  const { locale } = useLocale();\n  const mode = isDarkMode ? \"dark\" : \"light\";\n  return (\n    <ConfigProvider\n      value={{\n        locale: locale,\n        ...themeConfig,\n        mode: mode,\n      }}\n    >\n      {props.children}\n    </ConfigProvider>\n  );\n};\n\nexport default Theme;\n"],"names":[],"mappings":";;;;;;;;AAQM,MAAA,QAAQ,CAAC,UAAuB;AAC9B,QAAA,CAAC,UAAU,IAAI,YAAY;AAClB,iBAAA;AACH,cAAA;AACC,eAAA;AAEP,QAAA,EAAE,OAAO,IAAI,UAAU;AACvB,QAAA,OAAO,aAAa,SAAS;AAEjC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL;AAAA,QACA,GAAG;AAAA,QACH;AAAA,MACF;AAAA,MAEC,UAAM,MAAA;AAAA,IAAA;AAAA,EACT;AAEJ;"}

package/dist/@ecme/components/template/ThemeConfigurator/CopyButton.js

@@ -1,37 +1,40 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import "../../ui/Notification/index.js";
 import "../../ui/Button/index.js";
 import "../../ui/toast/index.js";
-import { themeConfig as r } from "../../../configs/theme.config.js";
-import { useThemeStore as s } from "../../../store/themeStore.js";
-import { useTranslation as p } from "react-i18next";
-import a from "../../ui/toast/toast.js";
-import m from "../../ui/Notification/Notification.js";
-import l from "../../ui/Button/Button.js";
-const v = () => {
-  const o = s((t) => t), i = () => {
-    const t = {
-      ...r,
-      ...o,
+import { themeConfig } from "../../../configs/theme.config.js";
+import { useThemeStore } from "../../../store/themeStore.js";
+import { useTranslation } from "react-i18next";
+import toast from "../../ui/toast/toast.js";
+import Notification from "../../ui/Notification/Notification.js";
+import Button from "../../ui/Button/Button.js";
+const CopyButton = () => {
+  const theme = useThemeStore((state) => state);
+  const handleCopy = () => {
+    const config = {
+      ...themeConfig,
+      ...theme,
       layout: {
-        type: o.layout.type,
-        sideNavCollapse: o.layout.sideNavCollapse
+        type: theme.layout.type,
+        sideNavCollapse: theme.layout.sideNavCollapse
       },
-      panelExpand: !1
+      panelExpand: false
     };
     navigator.clipboard.writeText(`
             
-export const themeConfig: ThemeConfig = ${JSON.stringify(t, null, 2)}
-`), a.push(
-      /* @__PURE__ */ e(m, { title: "Copy Success", type: "success", children: "Please replace themeConfig in 'src/configs/theme.config.ts'" }),
+export const themeConfig: ThemeConfig = ${JSON.stringify(config, null, 2)}
+`);
+    toast.push(
+      /* @__PURE__ */ jsx(Notification, { title: "Copy Success", type: "success", children: `Please replace themeConfig in 'src/configs/theme.config.ts'` }),
       {
         placement: "top-center"
       }
     );
-  }, { t: n } = p();
-  return /* @__PURE__ */ e(l, { block: !0, variant: "solid", onClick: i, children: n("base.layout.themeConfig.buttons.copyConfig") });
+  };
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx(Button, { block: true, variant: "solid", onClick: handleCopy, children: t("base.layout.themeConfig.buttons.copyConfig") });
 };
 export {
-  v as default
+  CopyButton as default
 };
 //# sourceMappingURL=CopyButton.js.map

package/dist/@ecme/components/template/ThemeConfigurator/CopyButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyButton.js","sources":["../../../../../lib/@ecme/components/template/ThemeConfigurator/CopyButton.tsx"],"sourcesContent":["import Notification from '@/components/ui/Notification'\nimport Button from '@/components/ui/Button'\nimport toast from '@/components/ui/toast'\nimport { themeConfig } from '@/configs/theme.config'\nimport { useThemeStore } from '@/store/themeStore'\nimport { useTranslation } from 'react-i18next'\n\nconst CopyButton = () => {\n    const theme = useThemeStore((state) => state)\n\n    const handleCopy = () => {\n        const config = {\n            ...themeConfig,\n            ...theme,\n            layout: {\n                type: theme.layout.type,\n                sideNavCollapse: theme.layout.sideNavCollapse,\n            },\n            panelExpand: false,\n        }\n\n        navigator.clipboard.writeText(`\n            \nexport const themeConfig: ThemeConfig = ${JSON.stringify(config, null, 2)}\n`)\n\n        toast.push(\n            <Notification title=\"Copy Success\" type=\"success\">\n                {`Please replace themeConfig in 'src/configs/theme.config.ts'`}\n            </Notification>,\n            {\n                placement: 'top-center',\n            },\n        )\n    }\n\n    const { t } = useTranslation()\n\n    return (\n        <Button block variant=\"solid\" onClick={handleCopy}>\n            {t('base.layout.themeConfig.buttons.copyConfig')}\n        </Button>\n    )\n}\n\nexport default CopyButton\n"],"names":["CopyButton","theme","useThemeStore","state","handleCopy","config","themeConfig","toast","Notification","t","useTranslation","jsx","Button"],"mappings":";;;;;;;;;;AAOA,MAAMA,IAAa,MAAM;AACrB,QAAMC,IAAQC,EAAc,CAACC,MAAUA,CAAK,GAEtCC,IAAa,MAAM;AACrB,UAAMC,IAAS;AAAA,MACX,GAAGC;AAAA,MACH,GAAGL;AAAA,MACH,QAAQ;AAAA,QACJ,MAAMA,EAAM,OAAO;AAAA,QACnB,iBAAiBA,EAAM,OAAO;AAAA,MAClC;AAAA,MACA,aAAa;AAAA,IACjB;AAEA,cAAU,UAAU,UAAU;AAAA;AAAA,0CAEI,KAAK,UAAUI,GAAQ,MAAM,CAAC,CAAC;AAAA,CACxE,GAEaE,EAAA;AAAA,wBACDC,GAAa,EAAA,OAAM,gBAAe,MAAK,WACnC,UACL,+DAAA;AAAA,MACA;AAAA,QACI,WAAW;AAAA,MAAA;AAAA,IAEnB;AAAA,EACJ,GAEM,EAAE,GAAAC,EAAE,IAAIC,EAAe;AAGzB,SAAA,gBAAAC,EAACC,GAAO,EAAA,OAAK,IAAC,SAAQ,SAAQ,SAASR,GAClC,UAAEK,EAAA,4CAA4C,EACnD,CAAA;AAER;"}
+{"version":3,"file":"CopyButton.js","sources":["../../../../../lib/@ecme/components/template/ThemeConfigurator/CopyButton.tsx"],"sourcesContent":["import Notification from '@/components/ui/Notification'\nimport Button from '@/components/ui/Button'\nimport toast from '@/components/ui/toast'\nimport { themeConfig } from '@/configs/theme.config'\nimport { useThemeStore } from '@/store/themeStore'\nimport { useTranslation } from 'react-i18next'\n\nconst CopyButton = () => {\n    const theme = useThemeStore((state) => state)\n\n    const handleCopy = () => {\n        const config = {\n            ...themeConfig,\n            ...theme,\n            layout: {\n                type: theme.layout.type,\n                sideNavCollapse: theme.layout.sideNavCollapse,\n            },\n            panelExpand: false,\n        }\n\n        navigator.clipboard.writeText(`\n            \nexport const themeConfig: ThemeConfig = ${JSON.stringify(config, null, 2)}\n`)\n\n        toast.push(\n            <Notification title=\"Copy Success\" type=\"success\">\n                {`Please replace themeConfig in 'src/configs/theme.config.ts'`}\n            </Notification>,\n            {\n                placement: 'top-center',\n            },\n        )\n    }\n\n    const { t } = useTranslation()\n\n    return (\n        <Button block variant=\"solid\" onClick={handleCopy}>\n            {t('base.layout.themeConfig.buttons.copyConfig')}\n        </Button>\n    )\n}\n\nexport default CopyButton\n"],"names":[],"mappings":";;;;;;;;;;AAOA,MAAM,aAAa,MAAM;AACrB,QAAM,QAAQ,cAAc,CAAC,UAAU,KAAK;AAE5C,QAAM,aAAa,MAAM;AACrB,UAAM,SAAS;AAAA,MACX,GAAG;AAAA,MACH,GAAG;AAAA,MACH,QAAQ;AAAA,QACJ,MAAM,MAAM,OAAO;AAAA,QACnB,iBAAiB,MAAM,OAAO;AAAA,MAClC;AAAA,MACA,aAAa;AAAA,IACjB;AAEA,cAAU,UAAU,UAAU;AAAA;AAAA,0CAEI,KAAK,UAAU,QAAQ,MAAM,CAAC,CAAC;AAAA,CACxE;AAEa,UAAA;AAAA,0BACD,cAAa,EAAA,OAAM,gBAAe,MAAK,WACnC,UACL,+DAAA;AAAA,MACA;AAAA,QACI,WAAW;AAAA,MAAA;AAAA,IAEnB;AAAA,EACJ;AAEM,QAAA,EAAE,EAAE,IAAI,eAAe;AAGzB,SAAA,oBAAC,QAAO,EAAA,OAAK,MAAC,SAAQ,SAAQ,SAAS,YAClC,UAAE,EAAA,4CAA4C,EACnD,CAAA;AAER;"}

package/dist/@ecme/components/template/ThemeConfigurator/DirectionSwitcher.js

@@ -1,29 +1,32 @@
-import { jsx as t } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import "../../ui/Button/index.js";
-import { InputGroup as a } from "../../ui/InputGroup/index.js";
-import c from "../../../utils/hooks/useDirection.js";
-import { THEME_ENUM as e } from "../../../constants/theme.constant.js";
-import m from "../../ui/Button/Button.js";
-const s = [
-  { value: e.DIR_LTR, label: "LTR" },
-  { value: e.DIR_RTL, label: "RTL" }
-], L = ({
-  callBackClose: r
+import { InputGroup } from "../../ui/InputGroup/index.js";
+import useDirection from "../../../utils/hooks/useDirection.js";
+import { THEME_ENUM } from "../../../constants/theme.constant.js";
+import Button from "../../ui/Button/Button.js";
+const dirList = [
+  { value: THEME_ENUM.DIR_LTR, label: "LTR" },
+  { value: THEME_ENUM.DIR_RTL, label: "RTL" }
+];
+const DirectionSwitcher = ({
+  callBackClose
 }) => {
-  const [i, n] = c(), l = (o) => {
-    n(o), r?.();
+  const [direction, setDirection] = useDirection();
+  const onDirChange = (val) => {
+    setDirection(val);
+    callBackClose?.();
   };
-  return /* @__PURE__ */ t(a, { size: "sm", children: s.map((o) => /* @__PURE__ */ t(
-    m,
+  return /* @__PURE__ */ jsx(InputGroup, { size: "sm", children: dirList.map((dir) => /* @__PURE__ */ jsx(
+    Button,
     {
-      active: i === o.value,
-      onClick: () => l(o.value),
-      children: o.label
+      active: direction === dir.value,
+      onClick: () => onDirChange(dir.value),
+      children: dir.label
     },
-    o.value
+    dir.value
   )) });
 };
 export {
-  L as default
+  DirectionSwitcher as default
 };
 //# sourceMappingURL=DirectionSwitcher.js.map