@orbe-agro/client-core 5.6.122 → 5.6.124

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/dist/@ecme/assets/styles/app.css +15 -0
  2. package/dist/@ecme/assets/styles/tailwind/index.css +15 -0
  3. package/dist/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.js +31 -6
  4. package/dist/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.js.map +1 -1
  5. package/dist/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.stories.js +234 -0
  6. package/dist/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.stories.js.map +1 -0
  7. package/dist/@ecme/components/template/VerticalMenuContent/VerticalSingleMenuItem.js +18 -40
  8. package/dist/@ecme/components/template/VerticalMenuContent/VerticalSingleMenuItem.js.map +1 -1
  9. package/dist/@ecme/components/ui/Button/Button.stories.js +17 -0
  10. package/dist/@ecme/components/ui/Button/Button.stories.js.map +1 -0
  11. package/dist/@types/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.d.ts +3 -3
  12. package/dist/@types/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.d.ts.map +1 -1
  13. package/dist/@types/@ecme/components/template/VerticalMenuContent/VerticalSingleMenuItem.d.ts +3 -3
  14. package/dist/@types/@ecme/components/template/VerticalMenuContent/VerticalSingleMenuItem.d.ts.map +1 -1
  15. package/dist/@types/@ecme/components/ui/Button/Button.stories.d.ts +9 -0
  16. package/dist/@types/@ecme/components/ui/Button/Button.stories.d.ts.map +1 -0
  17. package/dist/@types/base/@types/models/ativos/centralAtivosUser.d.ts +42 -0
  18. package/dist/@types/base/@types/models/ativos/centralAtivosUser.d.ts.map +1 -0
  19. package/dist/@types/base/@types/models/ativos/tipo.d.ts +1 -0
  20. package/dist/@types/base/@types/models/ativos/tipo.d.ts.map +1 -1
  21. package/dist/@types/base/configs/endpoints.config/ativos/ativos.d.ts +26 -0
  22. package/dist/@types/base/configs/endpoints.config/ativos/ativos.d.ts.map +1 -1
  23. package/dist/@types/base/configs/endpoints.config/ativos/config/centralAtivosUser.d.ts +24 -0
  24. package/dist/@types/base/configs/endpoints.config/ativos/config/centralAtivosUser.d.ts.map +1 -0
  25. package/dist/@types/base/configs/endpoints.config/ativos/config/tipo.d.ts +4 -0
  26. package/dist/@types/base/configs/endpoints.config/ativos/config/tipo.d.ts.map +1 -1
  27. package/dist/@types/base/configs/endpoints.config/endpoints.navigation.d.ts +26 -0
  28. package/dist/@types/base/configs/endpoints.config/endpoints.navigation.d.ts.map +1 -1
  29. package/dist/@types/base/configs/navigation.config/submenu/ativos/ativos.submenu.d.ts.map +1 -1
  30. package/dist/@types/base/configs/navigation.config/submenu/ativos/config/centralAtivosUser.submenu.d.ts +4 -0
  31. package/dist/@types/base/configs/navigation.config/submenu/ativos/config/centralAtivosUser.submenu.d.ts.map +1 -0
  32. package/dist/@types/base/services/modules/ativos/centralAtivosUser/CentralAtivosUserService.d.ts +8 -0
  33. package/dist/@types/base/services/modules/ativos/centralAtivosUser/CentralAtivosUserService.d.ts.map +1 -0
  34. package/dist/@types/base/services/modules/ativos/tipo/TipoService.d.ts +4 -0
  35. package/dist/@types/base/services/modules/ativos/tipo/TipoService.d.ts.map +1 -1
  36. package/dist/base/@types/models/ativos/centralAtivosUser.js +2 -0
  37. package/dist/base/@types/models/ativos/centralAtivosUser.js.map +1 -0
  38. package/dist/base/assets/styles/init.css +15 -0
  39. package/dist/base/configs/endpoints.config/ativos/ativos.js +2 -0
  40. package/dist/base/configs/endpoints.config/ativos/ativos.js.map +1 -1
  41. package/dist/base/configs/endpoints.config/ativos/config/centralAtivosUser.js +12 -0
  42. package/dist/base/configs/endpoints.config/ativos/config/centralAtivosUser.js.map +1 -0
  43. package/dist/base/configs/endpoints.config/ativos/config/tipo.js +2 -1
  44. package/dist/base/configs/endpoints.config/ativos/config/tipo.js.map +1 -1
  45. package/dist/base/configs/navigation.config/submenu/ativos/ativos.submenu.js +2 -0
  46. package/dist/base/configs/navigation.config/submenu/ativos/ativos.submenu.js.map +1 -1
  47. package/dist/base/configs/navigation.config/submenu/ativos/config/centralAtivosUser.submenu.js +16 -0
  48. package/dist/base/configs/navigation.config/submenu/ativos/config/centralAtivosUser.submenu.js.map +1 -0
  49. package/dist/base/index.js +2 -1
  50. package/dist/base/services/index.js +2 -1
  51. package/dist/base/services/modules/ativos/centralAtivosUser/CentralAtivosUserService.js +44 -0
  52. package/dist/base/services/modules/ativos/centralAtivosUser/CentralAtivosUserService.js.map +1 -0
  53. package/dist/base/services/modules/ativos/index.js +2 -1
  54. package/dist/base/services/modules/ativos/tipo/TipoService.js +8 -0
  55. package/dist/base/services/modules/ativos/tipo/TipoService.js.map +1 -1
  56. package/dist/base/services/modules/index.js +2 -1
  57. package/lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.stories.tsx +244 -0
  58. package/lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.tsx +203 -172
  59. package/lib/@ecme/components/template/VerticalMenuContent/VerticalSingleMenuItem.tsx +135 -157
  60. package/lib/@ecme/components/ui/Button/Button.stories.tsx +22 -0
  61. package/lib/base/@types/models/ativos/centralAtivosUser.ts +42 -0
  62. package/lib/base/@types/models/ativos/tipo.ts +1 -0
  63. package/lib/base/configs/endpoints.config/ativos/ativos.ts +2 -0
  64. package/lib/base/configs/endpoints.config/ativos/config/centralAtivosUser.ts +11 -0
  65. package/lib/base/configs/endpoints.config/ativos/config/tipo.ts +1 -0
  66. package/lib/base/configs/navigation.config/submenu/ativos/ativos.submenu.ts +2 -0
  67. package/lib/base/configs/navigation.config/submenu/ativos/config/centralAtivosUser.submenu.ts +16 -0
  68. package/lib/base/services/modules/ativos/centralAtivosUser/CentralAtivosUserService.ts +44 -0
  69. package/lib/base/services/modules/ativos/tipo/TipoService.ts +8 -0
  70. package/package.json +9 -1
@@ -4493,6 +4493,9 @@ hr:is(.dark *){
4493
4493
  .-left-2{
4494
4494
  left: -0.5rem;
4495
4495
  }
4496
+ .-left-3{
4497
+ left: -0.75rem;
4498
+ }
4496
4499
  .-right-2{
4497
4500
  right: -0.5rem;
4498
4501
  }
@@ -4553,6 +4556,9 @@ hr:is(.dark *){
4553
4556
  .z-10{
4554
4557
  z-index: 10;
4555
4558
  }
4559
+ .z-20{
4560
+ z-index: 20;
4561
+ }
4556
4562
  .z-30{
4557
4563
  z-index: 30;
4558
4564
  }
@@ -5269,6 +5275,9 @@ hr:is(.dark *){
5269
5275
  .min-w-\[330px\]{
5270
5276
  min-width: 330px;
5271
5277
  }
5278
+ .min-w-\[calc\(100\%\+1\.5rem\)\]{
5279
+ min-width: calc(100% + 1.5rem);
5280
+ }
5272
5281
  .min-w-full{
5273
5282
  min-width: 100%;
5274
5283
  }
@@ -7087,6 +7096,9 @@ hr:is(.dark *){
7087
7096
  .active\:bg-gray-100:active{
7088
7097
  background-color: var(--gray-100);
7089
7098
  }
7099
+ .group\/item:hover .group-hover\/item\:block{
7100
+ display: block;
7101
+ }
7090
7102
  .group:hover .group-hover\:block{
7091
7103
  display: block;
7092
7104
  }
@@ -7131,6 +7143,9 @@ hr:is(.dark *){
7131
7143
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
7132
7144
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
7133
7145
  }
7146
+ .group\/item:focus-visible .group-focus-visible\/item\:block{
7147
+ display: block;
7148
+ }
7134
7149
  .group.active .group-\[\.active\]\:bg-white{
7135
7150
  --tw-bg-opacity: 1;
7136
7151
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
@@ -1165,6 +1165,9 @@ video {
1165
1165
  .-left-2 {
1166
1166
  left: -0.5rem;
1167
1167
  }
1168
+ .-left-3 {
1169
+ left: -0.75rem;
1170
+ }
1168
1171
  .-right-2 {
1169
1172
  right: -0.5rem;
1170
1173
  }
@@ -1225,6 +1228,9 @@ video {
1225
1228
  .z-10 {
1226
1229
  z-index: 10;
1227
1230
  }
1231
+ .z-20 {
1232
+ z-index: 20;
1233
+ }
1228
1234
  .z-30 {
1229
1235
  z-index: 30;
1230
1236
  }
@@ -1941,6 +1947,9 @@ video {
1941
1947
  .min-w-\[330px\] {
1942
1948
  min-width: 330px;
1943
1949
  }
1950
+ .min-w-\[calc\(100\%\+1\.5rem\)\] {
1951
+ min-width: calc(100% + 1.5rem);
1952
+ }
1944
1953
  .min-w-full {
1945
1954
  min-width: 100%;
1946
1955
  }
@@ -3761,6 +3770,9 @@ video {
3761
3770
  .active\:bg-gray-100:active {
3762
3771
  background-color: var(--gray-100);
3763
3772
  }
3773
+ .group\/item:hover .group-hover\/item\:block {
3774
+ display: block;
3775
+ }
3764
3776
  .group:hover .group-hover\:block {
3765
3777
  display: block;
3766
3778
  }
@@ -3805,6 +3817,9 @@ video {
3805
3817
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
3806
3818
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3807
3819
  }
3820
+ .group\/item:focus-visible .group-focus-visible\/item\:block {
3821
+ display: block;
3822
+ }
3808
3823
  .group.active .group-\[\.active\]\:bg-white {
3809
3824
  --tw-bg-opacity: 1;
3810
3825
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
@@ -44,6 +44,12 @@ const filterNavigationByAuthority = (navTree, userAuthority) => {
44
44
  return acc;
45
45
  }, []);
46
46
  };
47
+ const sortNavigationRecursively = (navTree) => {
48
+ return [...navTree].map((nav) => ({
49
+ ...nav,
50
+ subMenu: nav.subMenu ? sortNavigationRecursively(nav.subMenu) : nav.subMenu
51
+ })).sort((a, b) => a.title.localeCompare(b.title, "pt-BR"));
52
+ };
47
53
  const VerticalMenuContent = (props) => {
48
54
  const {
49
55
  collapsed,
@@ -57,10 +63,14 @@ const VerticalMenuContent = (props) => {
57
63
  } = props;
58
64
  const { t } = useTranslation(!translationSetup);
59
65
  const [defaulExpandKey, setDefaulExpandKey] = useState([]);
60
- const filteredNavigationTree = useMemo(
61
- () => filterNavigationByAuthority(navigationTree, userAuthority),
62
- [navigationTree, userAuthority]
63
- );
66
+ const filteredNavigationTree = useMemo(() => {
67
+ const filteredTree = filterNavigationByAuthority(
68
+ navigationTree,
69
+ userAuthority
70
+ );
71
+ return sortNavigationRecursively(filteredTree);
72
+ }, [navigationTree, userAuthority]);
73
+ console.log("Filtered Navigation Tree:", filteredNavigationTree);
64
74
  const { activedRoute } = useMenuActive(filteredNavigationTree, routeKey);
65
75
  useEffect(() => {
66
76
  if (activedRoute?.key) {
@@ -110,11 +120,26 @@ const VerticalMenuContent = (props) => {
110
120
  userAuthority,
111
121
  t,
112
122
  onLinkClick: onMenuItemClick,
113
- children: nav.subMenu && nav.subMenu.length > 0 && renderNavigation(nav.subMenu, nextCascade, true)
123
+ children: nav.subMenu && nav.subMenu.length > 0 && renderNavigation(
124
+ nav.subMenu,
125
+ nextCascade,
126
+ true
127
+ )
114
128
  },
115
129
  nav.key
116
130
  ),
117
- nav.type === NAV_ITEM_TYPE_TITLE && /* @__PURE__ */ jsx(MenuGroup, { label: t(nav.translateKey) || nav.title, children: nav.subMenu && nav.subMenu.length > 0 && renderNavigation(nav.subMenu, cascade, false) }, nav.key)
131
+ nav.type === NAV_ITEM_TYPE_TITLE && /* @__PURE__ */ jsx(
132
+ MenuGroup,
133
+ {
134
+ label: t(nav.translateKey) || nav.title,
135
+ children: nav.subMenu && nav.subMenu.length > 0 && renderNavigation(
136
+ nav.subMenu,
137
+ cascade,
138
+ false
139
+ )
140
+ },
141
+ nav.key
142
+ )
118
143
  ] }, nav.key)) });
119
144
  };
120
145
  return /* @__PURE__ */ jsx(
@@ -1 +1 @@
1
- {"version":3,"file":"VerticalMenuContent.js","sources":["../../../../../lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.tsx"],"sourcesContent":["import { useState, useEffect, useMemo, Fragment } from \"react\";\nimport Menu from \"@/components/ui/Menu\";\nimport VerticalSingleMenuItem from \"./VerticalSingleMenuItem\";\nimport VerticalCollapsedMenuItem from \"./VerticalCollapsedMenuItem\";\nimport { themeConfig } from \"@/configs/theme.config\";\nimport {\n NAV_ITEM_TYPE_TITLE,\n NAV_ITEM_TYPE_COLLAPSE,\n NAV_ITEM_TYPE_ITEM,\n} from \"@/constants/navigation.constant\";\nimport useMenuActive from \"@/utils/hooks/useMenuActive\";\nimport useTranslation from \"@/utils/hooks/useTranslation\";\nimport { Direction } from \"@/@types/theme\";\nimport type { NavigationTree } from \"@/@types/navigation\";\nimport type { TraslationFn } from \"@/@types/common\";\nimport { LinkRenderer } from \"@/components/layouts/Layouts\";\n\nexport interface VerticalMenuContentProps {\n collapsed?: boolean;\n routeKey: string;\n navigationTree?: NavigationTree[];\n onMenuItemClick?: () => void;\n direction?: Direction;\n translationSetup?: boolean;\n userAuthority: string[];\n linkRenderer?: LinkRenderer;\n}\n\nconst { MenuGroup } = Menu;\n\nconst findAncestorKeys = (\n navTree: NavigationTree[],\n targetKey: string\n): string[] | null => {\n for (const node of navTree) {\n if (node.key === targetKey) return [];\n if (node.subMenu && node.subMenu.length > 0) {\n const found = findAncestorKeys(node.subMenu, targetKey);\n if (found !== null) return [node.key, ...found];\n }\n }\n return null;\n};\n\nconst filterNavigationByAuthority = (\n navTree: NavigationTree[],\n userAuthority: string[]\n): NavigationTree[] => {\n return navTree.reduce((acc: NavigationTree[], nav) => {\n // Verifica se deve excluir o item quando o usuário possui alguma funcionalidade específica\n if (nav.excludeWhenHasPaths && nav.excludeWhenHasPaths.length > 0) {\n const shouldExclude = nav.excludeWhenHasPaths.some((path) =>\n userAuthority.includes(path)\n );\n if (shouldExclude) {\n return acc;\n }\n }\n\n if (nav.subMenu && nav.subMenu.length > 0) {\n const filteredSubMenu = filterNavigationByAuthority(\n nav.subMenu,\n userAuthority\n );\n if (filteredSubMenu.length > 0) {\n acc.push({ ...nav, subMenu: filteredSubMenu });\n }\n } else {\n if ((nav.path && userAuthority.includes(nav.path)) || !nav.path) {\n acc.push(nav);\n }\n }\n return acc;\n }, []);\n};\n\nconst VerticalMenuContent = (props: VerticalMenuContentProps) => {\n const {\n collapsed,\n routeKey,\n navigationTree = [],\n onMenuItemClick,\n direction = themeConfig.direction,\n translationSetup,\n userAuthority,\n linkRenderer,\n } = props;\n\n const { t } = useTranslation(!translationSetup);\n const [defaulExpandKey, setDefaulExpandKey] = useState<string[]>([]);\n const filteredNavigationTree = useMemo(\n () => filterNavigationByAuthority(navigationTree, userAuthority),\n [navigationTree, userAuthority]\n );\n\n const { activedRoute } = useMenuActive(filteredNavigationTree, routeKey);\n\n useEffect(() => {\n if (activedRoute?.key) {\n const ancestors = findAncestorKeys(\n filteredNavigationTree,\n activedRoute.key\n );\n setDefaulExpandKey(ancestors ?? []);\n }\n }, [activedRoute?.key, filteredNavigationTree]);\n\n const handleLinkClick = () => {\n onMenuItemClick?.();\n };\n\n const renderNavigation = (\n navTree: NavigationTree[],\n cascade: number = 0,\n indent?: boolean\n ) => {\n const nextCascade = cascade + 1;\n\n return (\n <>\n {navTree.map((nav) => (\n <Fragment key={nav.key}>\n {nav.type === NAV_ITEM_TYPE_ITEM && (\n <VerticalSingleMenuItem\n key={nav.key}\n currentKey={activedRoute?.key}\n parentKeys={defaulExpandKey}\n nav={nav}\n sideCollapsed={collapsed}\n direction={direction}\n indent={indent}\n renderAsIcon={cascade <= 0}\n showIcon={cascade <= 0}\n userAuthority={userAuthority}\n showTitle={\n nav.forceShowTitle ??\n (collapsed ? cascade >= 1 : cascade <= 1)\n }\n t={t as TraslationFn}\n onLinkClick={handleLinkClick}\n linkRenderer={linkRenderer}\n />\n )}\n {nav.type === NAV_ITEM_TYPE_COLLAPSE && (\n <VerticalCollapsedMenuItem\n key={nav.key}\n currentKey={activedRoute?.key}\n parentKeys={defaulExpandKey}\n nav={nav}\n sideCollapsed={collapsed}\n direction={direction}\n indent={nextCascade >= 2}\n dotIndent={nextCascade >= 2}\n renderAsIcon={nextCascade <= 1}\n userAuthority={userAuthority}\n t={t as TraslationFn}\n onLinkClick={onMenuItemClick}\n >\n {nav.subMenu &&\n nav.subMenu.length > 0 &&\n renderNavigation(nav.subMenu, nextCascade, true)}\n </VerticalCollapsedMenuItem>\n )}\n {nav.type === NAV_ITEM_TYPE_TITLE && (\n <MenuGroup key={nav.key} label={t(nav.translateKey) || nav.title}>\n {nav.subMenu &&\n nav.subMenu.length > 0 &&\n renderNavigation(nav.subMenu, cascade, false)}\n </MenuGroup>\n )}\n </Fragment>\n ))}\n </>\n );\n };\n\n return (\n <Menu\n className=\"px-4 pb-4\"\n sideCollapsed={collapsed}\n defaultActiveKeys={activedRoute?.key ? [activedRoute.key] : []}\n defaultExpandedKeys={defaulExpandKey}\n defaultCollapseActiveKeys={\n activedRoute?.parentKey ? [activedRoute.parentKey] : []\n }\n >\n {renderNavigation(filteredNavigationTree, 0)}\n </Menu>\n );\n};\n\nexport default VerticalMenuContent;"],"names":["Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"VerticalMenuContent.js","sources":["../../../../../lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.tsx"],"sourcesContent":["import { useState, useEffect, useMemo, Fragment } from 'react'\nimport Menu from '@/components/ui/Menu'\nimport VerticalSingleMenuItem from './VerticalSingleMenuItem'\nimport VerticalCollapsedMenuItem from './VerticalCollapsedMenuItem'\nimport { themeConfig } from '@/configs/theme.config'\nimport {\n NAV_ITEM_TYPE_TITLE,\n NAV_ITEM_TYPE_COLLAPSE,\n NAV_ITEM_TYPE_ITEM,\n} from '@/constants/navigation.constant'\nimport useMenuActive from '@/utils/hooks/useMenuActive'\nimport useTranslation from '@/utils/hooks/useTranslation'\nimport { Direction } from '@/@types/theme'\nimport type { NavigationTree } from '@/@types/navigation'\nimport type { TraslationFn } from '@/@types/common'\nimport { LinkRenderer } from '@/components/layouts/Layouts'\n\nexport interface VerticalMenuContentProps {\n collapsed?: boolean\n routeKey: string\n navigationTree?: NavigationTree[]\n onMenuItemClick?: () => void\n direction?: Direction\n translationSetup?: boolean\n userAuthority: string[]\n linkRenderer?: LinkRenderer\n}\n\nconst { MenuGroup } = Menu\n\nconst findAncestorKeys = (\n navTree: NavigationTree[],\n targetKey: string,\n): string[] | null => {\n for (const node of navTree) {\n if (node.key === targetKey) return []\n if (node.subMenu && node.subMenu.length > 0) {\n const found = findAncestorKeys(node.subMenu, targetKey)\n if (found !== null) return [node.key, ...found]\n }\n }\n return null\n}\n\nconst filterNavigationByAuthority = (\n navTree: NavigationTree[],\n userAuthority: string[],\n): NavigationTree[] => {\n return navTree.reduce((acc: NavigationTree[], nav) => {\n // Verifica se deve excluir o item quando o usuário possui alguma funcionalidade específica\n if (nav.excludeWhenHasPaths && nav.excludeWhenHasPaths.length > 0) {\n const shouldExclude = nav.excludeWhenHasPaths.some((path) =>\n userAuthority.includes(path),\n )\n if (shouldExclude) {\n return acc\n }\n }\n\n if (nav.subMenu && nav.subMenu.length > 0) {\n const filteredSubMenu = filterNavigationByAuthority(\n nav.subMenu,\n userAuthority,\n )\n if (filteredSubMenu.length > 0) {\n acc.push({ ...nav, subMenu: filteredSubMenu })\n }\n } else {\n if ((nav.path && userAuthority.includes(nav.path)) || !nav.path) {\n acc.push(nav)\n }\n }\n return acc\n }, [])\n}\n\nconst sortNavigationRecursively = (\n navTree: NavigationTree[],\n): NavigationTree[] => {\n return [...navTree]\n .map((nav) => ({\n ...nav,\n subMenu: nav.subMenu\n ? sortNavigationRecursively(nav.subMenu)\n : nav.subMenu,\n }))\n .sort((a, b) => a.title.localeCompare(b.title, 'pt-BR'))\n}\n\nconst VerticalMenuContent = (props: VerticalMenuContentProps) => {\n const {\n collapsed,\n routeKey,\n navigationTree = [],\n onMenuItemClick,\n direction = themeConfig.direction,\n translationSetup,\n userAuthority,\n linkRenderer,\n } = props\n\n const { t } = useTranslation(!translationSetup)\n const [defaulExpandKey, setDefaulExpandKey] = useState<string[]>([])\n\n const filteredNavigationTree = useMemo(() => {\n const filteredTree = filterNavigationByAuthority(\n navigationTree,\n userAuthority,\n )\n\n return sortNavigationRecursively(filteredTree)\n }, [navigationTree, userAuthority])\n\n console.log('Filtered Navigation Tree:', filteredNavigationTree)\n\n const { activedRoute } = useMenuActive(filteredNavigationTree, routeKey)\n\n useEffect(() => {\n if (activedRoute?.key) {\n const ancestors = findAncestorKeys(\n filteredNavigationTree,\n activedRoute.key,\n )\n setDefaulExpandKey(ancestors ?? [])\n }\n }, [activedRoute?.key, filteredNavigationTree])\n\n const handleLinkClick = () => {\n onMenuItemClick?.()\n }\n\n const renderNavigation = (\n navTree: NavigationTree[],\n cascade: number = 0,\n indent?: boolean,\n ) => {\n const nextCascade = cascade + 1\n\n return (\n <>\n {navTree.map((nav) => (\n <Fragment key={nav.key}>\n {nav.type === NAV_ITEM_TYPE_ITEM && (\n <VerticalSingleMenuItem\n key={nav.key}\n currentKey={activedRoute?.key}\n parentKeys={defaulExpandKey}\n nav={nav}\n sideCollapsed={collapsed}\n direction={direction}\n indent={indent}\n renderAsIcon={cascade <= 0}\n showIcon={cascade <= 0}\n userAuthority={userAuthority}\n showTitle={\n nav.forceShowTitle ??\n (collapsed ? cascade >= 1 : cascade <= 1)\n }\n t={t as TraslationFn}\n onLinkClick={handleLinkClick}\n linkRenderer={linkRenderer}\n />\n )}\n {nav.type === NAV_ITEM_TYPE_COLLAPSE && (\n <VerticalCollapsedMenuItem\n key={nav.key}\n currentKey={activedRoute?.key}\n parentKeys={defaulExpandKey}\n nav={nav}\n sideCollapsed={collapsed}\n direction={direction}\n indent={nextCascade >= 2}\n dotIndent={nextCascade >= 2}\n renderAsIcon={nextCascade <= 1}\n userAuthority={userAuthority}\n t={t as TraslationFn}\n onLinkClick={onMenuItemClick}\n >\n {nav.subMenu &&\n nav.subMenu.length > 0 &&\n renderNavigation(\n nav.subMenu,\n nextCascade,\n true,\n )}\n </VerticalCollapsedMenuItem>\n )}\n {nav.type === NAV_ITEM_TYPE_TITLE && (\n <MenuGroup\n key={nav.key}\n label={t(nav.translateKey) || nav.title}\n >\n {nav.subMenu &&\n nav.subMenu.length > 0 &&\n renderNavigation(\n nav.subMenu,\n cascade,\n false,\n )}\n </MenuGroup>\n )}\n </Fragment>\n ))}\n </>\n )\n }\n\n return (\n <Menu\n className=\"px-4 pb-4\"\n sideCollapsed={collapsed}\n defaultActiveKeys={activedRoute?.key ? [activedRoute.key] : []}\n defaultExpandedKeys={defaulExpandKey}\n defaultCollapseActiveKeys={\n activedRoute?.parentKey ? [activedRoute.parentKey] : []\n }\n >\n {renderNavigation(filteredNavigationTree, 0)}\n </Menu>\n )\n}\n\nexport default VerticalMenuContent\n"],"names":["Fragment"],"mappings":"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"}
@@ -0,0 +1,234 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { BrowserRouter } from "react-router-dom";
3
+ import VerticalMenuContent from "./VerticalMenuContent.js";
4
+ import { NAV_ITEM_TYPE_ITEM, NAV_ITEM_TYPE_COLLAPSE } from "../../../constants/navigation.constant.js";
5
+ const mockNavigationTree = [
6
+ {
7
+ key: "inicio",
8
+ path: "/inicio",
9
+ title: "Início",
10
+ translateKey: "nav.inicio",
11
+ icon: "",
12
+ type: NAV_ITEM_TYPE_ITEM,
13
+ authority: ["/inicio"],
14
+ subMenu: []
15
+ },
16
+ {
17
+ key: "cadastros",
18
+ path: "",
19
+ title: "Cadastros",
20
+ translateKey: "nav.cadastros",
21
+ icon: "",
22
+ type: NAV_ITEM_TYPE_COLLAPSE,
23
+ authority: ["/cadastros"],
24
+ subMenu: [
25
+ {
26
+ key: "clientes",
27
+ path: "/cadastros/clientes",
28
+ title: "Clientes",
29
+ translateKey: "nav.clientes",
30
+ icon: "",
31
+ type: NAV_ITEM_TYPE_ITEM,
32
+ authority: ["/cadastros/clientes"],
33
+ subMenu: []
34
+ },
35
+ {
36
+ key: "fornecedores",
37
+ path: "/cadastros/fornecedores",
38
+ title: "Fornecedores",
39
+ translateKey: "nav.fornecedores",
40
+ icon: "",
41
+ type: NAV_ITEM_TYPE_ITEM,
42
+ authority: ["/cadastros/fornecedores"],
43
+ subMenu: []
44
+ }
45
+ ]
46
+ },
47
+ {
48
+ key: "relatorios",
49
+ path: "/relatorios",
50
+ title: "Relatórios",
51
+ translateKey: "nav.relatorios",
52
+ icon: "ChartBarIcon",
53
+ type: NAV_ITEM_TYPE_ITEM,
54
+ authority: ["/relatorios"],
55
+ subMenu: []
56
+ },
57
+ {
58
+ key: "configuracoes",
59
+ path: "",
60
+ title: "Configurações",
61
+ translateKey: "nav.configuracoes",
62
+ icon: "",
63
+ type: NAV_ITEM_TYPE_COLLAPSE,
64
+ authority: ["/configuracoes"],
65
+ subMenu: [
66
+ {
67
+ key: "perfil",
68
+ path: "/configuracoes/perfil",
69
+ title: "Perfil",
70
+ translateKey: "nav.perfil",
71
+ icon: "",
72
+ type: NAV_ITEM_TYPE_ITEM,
73
+ authority: ["/configuracoes/perfil"],
74
+ subMenu: []
75
+ },
76
+ {
77
+ key: "integracoes",
78
+ path: "",
79
+ title: "Integrações",
80
+ translateKey: "nav.integracoes",
81
+ icon: "",
82
+ type: NAV_ITEM_TYPE_COLLAPSE,
83
+ authority: ["/configuracoes/integracoes"],
84
+ subMenu: [
85
+ {
86
+ key: "webhooks",
87
+ path: "/configuracoes/integracoes/webhooks",
88
+ title: "Webhooks",
89
+ translateKey: "nav.webhooks",
90
+ icon: "WebhookIcon",
91
+ type: NAV_ITEM_TYPE_ITEM,
92
+ authority: ["/configuracoes/integracoes/webhooks"],
93
+ subMenu: []
94
+ },
95
+ {
96
+ key: "lorem.ipsum",
97
+ path: "/configuracoes/integracoes/lorem-ipsum",
98
+ title: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
99
+ translateKey: "nav.loremIpsum",
100
+ icon: "LoremIpsumIcon",
101
+ type: NAV_ITEM_TYPE_ITEM,
102
+ authority: ["/configuracoes/integracoes/lorem-ipsum"],
103
+ subMenu: []
104
+ }
105
+ ]
106
+ }
107
+ ]
108
+ }
109
+ ];
110
+ const allUserAuthority = [
111
+ "/inicio",
112
+ "/cadastros/clientes",
113
+ "/cadastros/fornecedores",
114
+ "/relatorios",
115
+ "/configuracoes/perfil",
116
+ "/configuracoes/integracoes/webhooks",
117
+ "/configuracoes/integracoes/lorem-ipsum"
118
+ ];
119
+ const meta = {
120
+ title: "@ecme/Template/VerticalMenuContent",
121
+ component: VerticalMenuContent,
122
+ parameters: {
123
+ layout: "padded"
124
+ },
125
+ tags: ["autodocs"],
126
+ decorators: [
127
+ (Story) => /* @__PURE__ */ jsx(BrowserRouter, { children: /* @__PURE__ */ jsx(Story, {}) })
128
+ ],
129
+ argTypes: {
130
+ collapsed: {
131
+ control: "boolean"
132
+ },
133
+ direction: {
134
+ control: { type: "select" },
135
+ options: ["ltr", "rtl"]
136
+ },
137
+ routeKey: {
138
+ control: "text"
139
+ }
140
+ }
141
+ };
142
+ const Default = {
143
+ args: {
144
+ collapsed: false,
145
+ routeKey: "/inicio",
146
+ navigationTree: mockNavigationTree,
147
+ userAuthority: allUserAuthority,
148
+ direction: "ltr",
149
+ translationSetup: true
150
+ }
151
+ };
152
+ const Collapsed = {
153
+ args: {
154
+ collapsed: true,
155
+ routeKey: "/cadastros/clientes",
156
+ navigationTree: mockNavigationTree,
157
+ userAuthority: allUserAuthority,
158
+ direction: "ltr",
159
+ translationSetup: true
160
+ }
161
+ };
162
+ const WithExpandedMenu = {
163
+ args: {
164
+ collapsed: false,
165
+ routeKey: "/configuracoes/integracoes/webhooks",
166
+ navigationTree: mockNavigationTree,
167
+ userAuthority: allUserAuthority,
168
+ direction: "ltr",
169
+ translationSetup: true
170
+ }
171
+ };
172
+ const LimitedAuthority = {
173
+ args: {
174
+ collapsed: false,
175
+ routeKey: "/inicio",
176
+ navigationTree: mockNavigationTree,
177
+ userAuthority: ["/inicio", "/relatorios"],
178
+ direction: "ltr",
179
+ translationSetup: true
180
+ }
181
+ };
182
+ const RTLDirection = {
183
+ args: {
184
+ collapsed: false,
185
+ routeKey: "/inicio",
186
+ navigationTree: mockNavigationTree,
187
+ userAuthority: allUserAuthority,
188
+ direction: "rtl",
189
+ translationSetup: true
190
+ }
191
+ };
192
+ const MinimalNavigation = {
193
+ args: {
194
+ collapsed: false,
195
+ routeKey: "/inicio",
196
+ navigationTree: [
197
+ {
198
+ key: "inicio",
199
+ path: "/inicio",
200
+ title: "Início",
201
+ translateKey: "nav.inicio",
202
+ icon: "",
203
+ type: NAV_ITEM_TYPE_ITEM,
204
+ authority: ["/inicio"],
205
+ subMenu: []
206
+ }
207
+ ],
208
+ userAuthority: ["/inicio"],
209
+ direction: "ltr",
210
+ translationSetup: true
211
+ }
212
+ };
213
+ const WithMenuClick = {
214
+ args: {
215
+ collapsed: false,
216
+ routeKey: "/inicio",
217
+ navigationTree: mockNavigationTree,
218
+ userAuthority: allUserAuthority,
219
+ direction: "ltr",
220
+ translationSetup: true,
221
+ onMenuItemClick: () => alert("Menu item clicked!")
222
+ }
223
+ };
224
+ export {
225
+ Collapsed,
226
+ Default,
227
+ LimitedAuthority,
228
+ MinimalNavigation,
229
+ RTLDirection,
230
+ WithExpandedMenu,
231
+ WithMenuClick,
232
+ meta as default
233
+ };
234
+ //# sourceMappingURL=VerticalMenuContent.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"VerticalMenuContent.stories.js","sources":["../../../../../lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react'\nimport { BrowserRouter } from 'react-router-dom'\nimport VerticalMenuContent from './VerticalMenuContent'\nimport type { NavigationTree } from '@/@types/navigation'\nimport {\n NAV_ITEM_TYPE_COLLAPSE,\n NAV_ITEM_TYPE_ITEM,\n} from '@/constants/navigation.constant'\n\nconst mockNavigationTree: NavigationTree[] = [\n {\n key: 'inicio',\n path: '/inicio',\n title: 'Início',\n translateKey: 'nav.inicio',\n icon: '',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/inicio'],\n subMenu: [],\n },\n {\n key: 'cadastros',\n path: '',\n title: 'Cadastros',\n translateKey: 'nav.cadastros',\n icon: '',\n type: NAV_ITEM_TYPE_COLLAPSE,\n authority: ['/cadastros'],\n subMenu: [\n {\n key: 'clientes',\n path: '/cadastros/clientes',\n title: 'Clientes',\n translateKey: 'nav.clientes',\n icon: '',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/cadastros/clientes'],\n subMenu: [],\n },\n {\n key: 'fornecedores',\n path: '/cadastros/fornecedores',\n title: 'Fornecedores',\n translateKey: 'nav.fornecedores',\n icon: '',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/cadastros/fornecedores'],\n subMenu: [],\n },\n ],\n },\n {\n key: 'relatorios',\n path: '/relatorios',\n title: 'Relatórios',\n translateKey: 'nav.relatorios',\n icon: 'ChartBarIcon',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/relatorios'],\n subMenu: [],\n },\n {\n key: 'configuracoes',\n path: '',\n title: 'Configurações',\n translateKey: 'nav.configuracoes',\n icon: '',\n type: NAV_ITEM_TYPE_COLLAPSE,\n authority: ['/configuracoes'],\n subMenu: [\n {\n key: 'perfil',\n path: '/configuracoes/perfil',\n title: 'Perfil',\n translateKey: 'nav.perfil',\n icon: '',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/configuracoes/perfil'],\n subMenu: [],\n },\n {\n key: 'integracoes',\n path: '',\n title: 'Integrações',\n translateKey: 'nav.integracoes',\n icon: '',\n type: NAV_ITEM_TYPE_COLLAPSE,\n authority: ['/configuracoes/integracoes'],\n subMenu: [\n {\n key: 'webhooks',\n path: '/configuracoes/integracoes/webhooks',\n title: 'Webhooks',\n translateKey: 'nav.webhooks',\n icon: 'WebhookIcon',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/configuracoes/integracoes/webhooks'],\n subMenu: [],\n },\n {\n key: 'lorem.ipsum',\n path: '/configuracoes/integracoes/lorem-ipsum',\n title: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',\n translateKey: 'nav.loremIpsum',\n icon: 'LoremIpsumIcon',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/configuracoes/integracoes/lorem-ipsum'],\n subMenu: [],\n },\n ],\n },\n ],\n },\n]\n\nconst allUserAuthority = [\n '/inicio',\n '/cadastros/clientes',\n '/cadastros/fornecedores',\n '/relatorios',\n '/configuracoes/perfil',\n '/configuracoes/integracoes/webhooks',\n '/configuracoes/integracoes/lorem-ipsum',\n]\n\nconst meta = {\n title: '@ecme/Template/VerticalMenuContent',\n component: VerticalMenuContent,\n parameters: {\n layout: 'padded',\n },\n tags: ['autodocs'],\n decorators: [\n (Story) => (\n <BrowserRouter>\n <Story />\n </BrowserRouter>\n ),\n ],\n argTypes: {\n collapsed: {\n control: 'boolean',\n },\n direction: {\n control: { type: 'select' },\n options: ['ltr', 'rtl'],\n },\n routeKey: {\n control: 'text',\n },\n },\n} satisfies Meta<typeof VerticalMenuContent>\n\nexport default meta\ntype TStory = StoryObj<typeof meta>\n\nexport const Default: TStory = {\n args: {\n collapsed: false,\n routeKey: '/inicio',\n navigationTree: mockNavigationTree,\n userAuthority: allUserAuthority,\n direction: 'ltr',\n translationSetup: true,\n },\n}\n\nexport const Collapsed: TStory = {\n args: {\n collapsed: true,\n routeKey: '/cadastros/clientes',\n navigationTree: mockNavigationTree,\n userAuthority: allUserAuthority,\n direction: 'ltr',\n translationSetup: true,\n },\n}\n\nexport const WithExpandedMenu: TStory = {\n args: {\n collapsed: false,\n routeKey: '/configuracoes/integracoes/webhooks',\n navigationTree: mockNavigationTree,\n userAuthority: allUserAuthority,\n direction: 'ltr',\n translationSetup: true,\n },\n}\n\nexport const LimitedAuthority: TStory = {\n args: {\n collapsed: false,\n routeKey: '/inicio',\n navigationTree: mockNavigationTree,\n userAuthority: ['/inicio', '/relatorios'],\n direction: 'ltr',\n translationSetup: true,\n },\n}\n\nexport const RTLDirection: TStory = {\n args: {\n collapsed: false,\n routeKey: '/inicio',\n navigationTree: mockNavigationTree,\n userAuthority: allUserAuthority,\n direction: 'rtl',\n translationSetup: true,\n },\n}\n\nexport const MinimalNavigation: TStory = {\n args: {\n collapsed: false,\n routeKey: '/inicio',\n navigationTree: [\n {\n key: 'inicio',\n path: '/inicio',\n title: 'Início',\n translateKey: 'nav.inicio',\n icon: '',\n type: NAV_ITEM_TYPE_ITEM,\n authority: ['/inicio'],\n subMenu: [],\n },\n ],\n userAuthority: ['/inicio'],\n direction: 'ltr',\n translationSetup: true,\n },\n}\n\nexport const WithMenuClick: TStory = {\n args: {\n collapsed: false,\n routeKey: '/inicio',\n navigationTree: mockNavigationTree,\n userAuthority: allUserAuthority,\n direction: 'ltr',\n translationSetup: true,\n onMenuItemClick: () => alert('Menu item clicked!'),\n },\n}\n"],"names":[],"mappings":"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"}
@@ -1,45 +1,12 @@
1
- import { jsx, jsxs, Fragment } from "react/jsx-runtime";
1
+ import { jsxs, Fragment, jsx } from "react/jsx-runtime";
2
2
  import "../../ui/Tooltip/index.js";
3
3
  import { Menu } from "../../ui/Menu/index.js";
4
+ import "../../ui/ScrollBar/index.js";
4
5
  import VerticalMenuIcon from "./VerticalMenuIcon.js";
5
6
  import { Link } from "react-router-dom";
6
- import { Dropdown } from "../../ui/Dropdown/index.js";
7
+ import ScrollBar from "../../ui/ScrollBar/ScrollBar.js";
7
8
  import Tooltip from "../../ui/Tooltip/Tooltip.js";
8
9
  const { MenuItem } = Menu;
9
- const CollapsedItem = ({
10
- nav,
11
- children,
12
- direction,
13
- renderAsIcon,
14
- onLinkClick,
15
- userAuthority,
16
- t,
17
- currentKey,
18
- linkRenderer
19
- }) => {
20
- const linkContent = /* @__PURE__ */ jsx("span", { children: t(nav.translateKey, nav.title) });
21
- const renderLink = () => {
22
- if (linkRenderer) {
23
- return linkRenderer(nav, linkContent);
24
- }
25
- return /* @__PURE__ */ jsx(
26
- Link,
27
- {
28
- id: nav.path,
29
- className: "flex h-full w-full items-center outline-none",
30
- to: nav.path,
31
- target: nav.isExternalLink ? "_blank" : "",
32
- onClick: () => onLinkClick?.({
33
- key: nav.key,
34
- title: nav.title,
35
- path: nav.path
36
- }),
37
- children: linkContent
38
- }
39
- );
40
- };
41
- return /* @__PURE__ */ jsx(Dropdown.Item, { active: currentKey === nav.key, children: nav.path ? renderLink() : /* @__PURE__ */ jsx("span", { children: t(nav.translateKey, nav.title) }) });
42
- };
43
10
  const DefaultItem = (props) => {
44
11
  const {
45
12
  nav,
@@ -47,13 +14,24 @@ const DefaultItem = (props) => {
47
14
  showTitle,
48
15
  indent,
49
16
  showIcon = true,
50
- userAuthority,
51
17
  t,
52
18
  linkRenderer
53
19
  } = props;
54
- const linkContent = /* @__PURE__ */ jsxs(Fragment, { children: [
20
+ const translatedTitle = t(nav.translateKey, nav.title);
21
+ const renderItemContent = (titleClassName) => /* @__PURE__ */ jsxs(Fragment, { children: [
55
22
  showIcon && /* @__PURE__ */ jsx(VerticalMenuIcon, { icon: nav.icon }),
56
- showTitle && /* @__PURE__ */ jsx("span", { children: t(nav.translateKey, nav.title) })
23
+ showTitle && /* @__PURE__ */ jsx("span", { className: titleClassName, children: translatedTitle })
24
+ ] });
25
+ const linkContent = /* @__PURE__ */ jsxs("span", { className: "relative flex min-w-0 flex-1 items-center gap-2", children: [
26
+ /* @__PURE__ */ jsx("span", { className: "flex min-w-0 flex-1 items-center gap-2 overflow-hidden", children: renderItemContent("truncate") }),
27
+ showTitle && /* @__PURE__ */ jsx("div", { className: "w-100 absolute -left-3 top-1/2 z-20 hidden min-w-[calc(100%+1.5rem)] -translate-y-1/2 group-hover/item:block group-focus-visible/item:block", children: /* @__PURE__ */ jsx(
28
+ ScrollBar,
29
+ {
30
+ autoHide: true,
31
+ className: "max-h-16 rounded-lg bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-100",
32
+ children: /* @__PURE__ */ jsx("div", { className: "flex h-full w-max min-w-full items-center gap-2 whitespace-nowrap rounded-lg px-3 font-semibold", children: renderItemContent() })
33
+ }
34
+ ) })
57
35
  ] });
58
36
  const renderLink = () => {
59
37
  if (linkRenderer) {
@@ -63,7 +41,7 @@ const DefaultItem = (props) => {
63
41
  Link,
64
42
  {
65
43
  to: nav.path,
66
- className: "flex h-full w-full items-center gap-2",
44
+ className: "group/item relative flex w-full min-w-0 items-center gap-2",
67
45
  target: nav.isExternalLink ? "_blank" : "",
68
46
  onClick: () => onLinkClick?.({
69
47
  key: nav.key,
@@ -1 +1 @@
1
- {"version":3,"file":"VerticalSingleMenuItem.js","sources":["../../../../../lib/@ecme/components/template/VerticalMenuContent/VerticalSingleMenuItem.tsx"],"sourcesContent":["import Tooltip from \"@/components/ui/Tooltip\";\nimport Menu from \"@/components/ui/Menu\";\nimport AuthorityCheck from \"@/components/shared/AuthorityCheck\";\nimport VerticalMenuIcon from \"./VerticalMenuIcon\";\nimport { Link } from \"react-router-dom\";\nimport Dropdown from \"@/components/ui/Dropdown\";\nimport type { CommonProps } from \"@/@types/common\";\nimport type { Direction } from \"@/@types/theme\";\nimport type { NavigationTree } from \"@/@types/navigation\";\n\nconst { MenuItem } = Menu;\n\ntype LinkRenderer = (\n nav: NavigationTree,\n children: React.ReactNode\n) => React.ReactNode;\n\ninterface CollapsedItemProps extends CommonProps {\n nav: NavigationTree;\n direction?: Direction;\n linkRenderer?: LinkRenderer;\n onLinkClick?: (link: { key: string; title: string; path: string }) => void;\n t: (\n key: string,\n fallback?: string | Record<string, string | number>\n ) => string;\n renderAsIcon?: boolean;\n userAuthority: string[];\n currentKey?: string;\n parentKeys?: string[];\n}\n\ninterface DefaultItemProps {\n nav: NavigationTree;\n onLinkClick?: (link: { key: string; title: string; path: string }) => void;\n sideCollapsed?: boolean;\n t: (\n key: string,\n fallback?: string | Record<string, string | number>\n ) => string;\n indent?: boolean;\n userAuthority: string[];\n showIcon?: boolean;\n showTitle?: boolean;\n linkRenderer?: LinkRenderer;\n}\n\ninterface VerticalMenuItemProps extends CollapsedItemProps, DefaultItemProps {}\n\nconst CollapsedItem = ({\n nav,\n children,\n direction,\n renderAsIcon,\n onLinkClick,\n userAuthority,\n t,\n currentKey,\n linkRenderer,\n}: CollapsedItemProps) => {\n const linkContent = <span>{t(nav.translateKey, nav.title)}</span>;\n\n const renderLink = () => {\n if (linkRenderer) {\n return linkRenderer(nav, linkContent);\n }\n\n return (\n <Link\n id={nav.path}\n className=\"flex h-full w-full items-center outline-none\"\n to={nav.path}\n target={nav.isExternalLink ? \"_blank\" : \"\"}\n onClick={() =>\n onLinkClick?.({\n key: nav.key,\n title: nav.title,\n path: nav.path,\n })\n }\n >\n {linkContent}\n </Link>\n );\n };\n\n return (\n <Dropdown.Item active={currentKey === nav.key}>\n {nav.path ? renderLink() : <span>{t(nav.translateKey, nav.title)}</span>}\n </Dropdown.Item>\n );\n};\n\nconst DefaultItem = (props: DefaultItemProps) => {\n const {\n nav,\n onLinkClick,\n showTitle,\n indent,\n showIcon = true,\n userAuthority,\n t,\n linkRenderer,\n } = props;\n\n const linkContent = (\n <>\n {showIcon && <VerticalMenuIcon icon={nav.icon} />}\n {showTitle && <span>{t(nav.translateKey, nav.title)}</span>}\n </>\n );\n\n const renderLink = () => {\n if (linkRenderer) {\n return linkRenderer(nav, linkContent);\n }\n\n return (\n <Link\n to={nav.path}\n className=\"flex h-full w-full items-center gap-2\"\n target={nav.isExternalLink ? \"_blank\" : \"\"}\n onClick={() =>\n onLinkClick?.({\n key: nav.key,\n title: nav.title,\n path: nav.path,\n })\n }\n >\n {linkContent}\n </Link>\n );\n };\n\n return (\n <MenuItem key={nav.key} eventKey={nav.key} dotIndent={indent}>\n {renderLink()}\n </MenuItem>\n );\n};\nconst VerticalSingleMenuItem = (props: VerticalMenuItemProps) => {\n const { sideCollapsed, nav, t, userAuthority, onLinkClick, linkRenderer } =\n props;\n\n if (sideCollapsed) {\n return (\n <Tooltip\n title={t(nav.translateKey, nav.title)}\n placement={props.direction === \"rtl\" ? \"left\" : \"right\"}\n >\n <DefaultItem\n nav={nav}\n onLinkClick={onLinkClick}\n t={t}\n userAuthority={userAuthority}\n linkRenderer={linkRenderer}\n showIcon={true}\n showTitle={false}\n indent={props.indent}\n />\n </Tooltip>\n );\n }\n\n return (\n <DefaultItem\n nav={nav}\n onLinkClick={onLinkClick}\n t={t}\n userAuthority={userAuthority}\n linkRenderer={linkRenderer}\n showIcon={true}\n showTitle={true}\n indent={props.indent}\n />\n );\n};\nexport default VerticalSingleMenuItem;\n"],"names":[],"mappings":";;;;;;;AAUA,MAAM,EAAE,aAAa;AAuCrB,MAAM,gBAAgB,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA0B;AACxB,QAAM,kCAAe,QAAA,EAAM,UAAA,EAAE,IAAI,cAAc,IAAI,KAAK,EAAA,CAAE;AAE1D,QAAM,aAAa,MAAM;AACvB,QAAI,cAAc;AAChB,aAAO,aAAa,KAAK,WAAW;AAAA,IACtC;AAEA,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI,IAAI;AAAA,QACR,WAAU;AAAA,QACV,IAAI,IAAI;AAAA,QACR,QAAQ,IAAI,iBAAiB,WAAW;AAAA,QACxC,SAAS,MACP,cAAc;AAAA,UACZ,KAAK,IAAI;AAAA,UACT,OAAO,IAAI;AAAA,UACX,MAAM,IAAI;AAAA,QAAA,CACX;AAAA,QAGF,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AAEA,SACE,oBAAC,SAAS,MAAT,EAAc,QAAQ,eAAe,IAAI,KACvC,UAAA,IAAI,OAAO,eAAe,oBAAC,UAAM,UAAA,EAAE,IAAI,cAAc,IAAI,KAAK,GAAE,EAAA,CACnE;AAEJ;AAEA,MAAM,cAAc,CAAC,UAA4B;AAC/C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE;AAEJ,QAAM,cACJ,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA,YAAY,oBAAC,kBAAA,EAAiB,MAAM,IAAI,MAAM;AAAA,IAC9C,iCAAc,QAAA,EAAM,UAAA,EAAE,IAAI,cAAc,IAAI,KAAK,EAAA,CAAE;AAAA,EAAA,GACtD;AAGF,QAAM,aAAa,MAAM;AACvB,QAAI,cAAc;AAChB,aAAO,aAAa,KAAK,WAAW;AAAA,IACtC;AAEA,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI,IAAI;AAAA,QACR,WAAU;AAAA,QACV,QAAQ,IAAI,iBAAiB,WAAW;AAAA,QACxC,SAAS,MACP,cAAc;AAAA,UACZ,KAAK,IAAI;AAAA,UACT,OAAO,IAAI;AAAA,UACX,MAAM,IAAI;AAAA,QAAA,CACX;AAAA,QAGF,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AAEA,SACE,oBAAC,UAAA,EAAuB,UAAU,IAAI,KAAK,WAAW,QACnD,UAAA,WAAA,EAAW,GADC,IAAI,GAEnB;AAEJ;AACA,MAAM,yBAAyB,CAAC,UAAiC;AAC/D,QAAM,EAAE,eAAe,KAAK,GAAG,eAAe,aAAa,iBACzD;AAEF,MAAI,eAAe;AACjB,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO,EAAE,IAAI,cAAc,IAAI,KAAK;AAAA,QACpC,WAAW,MAAM,cAAc,QAAQ,SAAS;AAAA,QAEhD,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,UAAU;AAAA,YACV,WAAW;AAAA,YACX,QAAQ,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB;AAAA,IAAA;AAAA,EAGN;AAEA,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,WAAW;AAAA,MACX,QAAQ,MAAM;AAAA,IAAA;AAAA,EAAA;AAGpB;"}
1
+ {"version":3,"file":"VerticalSingleMenuItem.js","sources":["../../../../../lib/@ecme/components/template/VerticalMenuContent/VerticalSingleMenuItem.tsx"],"sourcesContent":["import Tooltip from '@/components/ui/Tooltip'\nimport Menu from '@/components/ui/Menu'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport VerticalMenuIcon from './VerticalMenuIcon'\nimport { Link } from 'react-router-dom'\nimport type { CommonProps } from '@/@types/common'\nimport type { Direction } from '@/@types/theme'\nimport type { NavigationTree } from '@/@types/navigation'\n\nconst { MenuItem } = Menu\n\ntype LinkRenderer = (\n nav: NavigationTree,\n children: React.ReactNode,\n) => React.ReactNode\n\ninterface CollapsedItemProps extends CommonProps {\n nav: NavigationTree\n direction?: Direction\n linkRenderer?: LinkRenderer\n onLinkClick?: (link: { key: string; title: string; path: string }) => void\n t: (\n key: string,\n fallback?: string | Record<string, string | number>,\n ) => string\n renderAsIcon?: boolean\n userAuthority: string[]\n currentKey?: string\n parentKeys?: string[]\n}\n\ninterface DefaultItemProps {\n nav: NavigationTree\n onLinkClick?: (link: { key: string; title: string; path: string }) => void\n sideCollapsed?: boolean\n t: (\n key: string,\n fallback?: string | Record<string, string | number>,\n ) => string\n indent?: boolean\n userAuthority: string[]\n showIcon?: boolean\n showTitle?: boolean\n linkRenderer?: LinkRenderer\n}\n\ninterface VerticalMenuItemProps extends CollapsedItemProps, DefaultItemProps {}\n\nconst DefaultItem = (props: DefaultItemProps) => {\n const {\n nav,\n onLinkClick,\n showTitle,\n indent,\n showIcon = true,\n t,\n linkRenderer,\n } = props\n\n const translatedTitle = t(nav.translateKey, nav.title)\n\n const renderItemContent = (titleClassName?: string) => (\n <>\n {showIcon && <VerticalMenuIcon icon={nav.icon} />}\n {showTitle && (\n <span className={titleClassName}>{translatedTitle}</span>\n )}\n </>\n )\n\n const linkContent = (\n <span className=\"relative flex min-w-0 flex-1 items-center gap-2\">\n <span className=\"flex min-w-0 flex-1 items-center gap-2 overflow-hidden\">\n {renderItemContent('truncate')}\n </span>\n {showTitle && (\n <div className=\"w-100 absolute -left-3 top-1/2 z-20 hidden min-w-[calc(100%+1.5rem)] -translate-y-1/2 group-hover/item:block group-focus-visible/item:block\">\n <ScrollBar\n autoHide\n className=\"max-h-16 rounded-lg bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-100\"\n >\n <div className=\"flex h-full w-max min-w-full items-center gap-2 whitespace-nowrap rounded-lg px-3 font-semibold\">\n {renderItemContent()}\n </div>\n </ScrollBar>\n </div>\n )}\n </span>\n )\n\n const renderLink = () => {\n if (linkRenderer) {\n return linkRenderer(nav, linkContent)\n }\n\n return (\n <Link\n to={nav.path}\n className=\"group/item relative flex w-full min-w-0 items-center gap-2\"\n target={nav.isExternalLink ? '_blank' : ''}\n onClick={() =>\n onLinkClick?.({\n key: nav.key,\n title: nav.title,\n path: nav.path,\n })\n }\n >\n {linkContent}\n </Link>\n )\n }\n\n return (\n <MenuItem key={nav.key} eventKey={nav.key} dotIndent={indent}>\n {renderLink()}\n </MenuItem>\n )\n}\nconst VerticalSingleMenuItem = (props: VerticalMenuItemProps) => {\n const { sideCollapsed, nav, t, userAuthority, onLinkClick, linkRenderer } =\n props\n\n if (sideCollapsed) {\n return (\n <Tooltip\n title={t(nav.translateKey, nav.title)}\n placement={props.direction === 'rtl' ? 'left' : 'right'}\n >\n <DefaultItem\n nav={nav}\n onLinkClick={onLinkClick}\n t={t}\n userAuthority={userAuthority}\n linkRenderer={linkRenderer}\n showIcon={true}\n showTitle={false}\n indent={props.indent}\n />\n </Tooltip>\n )\n }\n\n return (\n <DefaultItem\n nav={nav}\n onLinkClick={onLinkClick}\n t={t}\n userAuthority={userAuthority}\n linkRenderer={linkRenderer}\n showIcon={true}\n showTitle={true}\n indent={props.indent}\n />\n )\n}\nexport default VerticalSingleMenuItem\n"],"names":[],"mappings":";;;;;;;;AASA,MAAM,EAAE,aAAa;AAuCrB,MAAM,cAAc,CAAC,UAA4B;AAC7C,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,EAAA,IACA;AAEJ,QAAM,kBAAkB,EAAE,IAAI,cAAc,IAAI,KAAK;AAErD,QAAM,oBAAoB,CAAC,mBACvB,qBAAA,UAAA,EACK,UAAA;AAAA,IAAA,YAAY,oBAAC,kBAAA,EAAiB,MAAM,IAAI,MAAM;AAAA,IAC9C,aACG,oBAAC,QAAA,EAAK,WAAW,gBAAiB,UAAA,gBAAA,CAAgB;AAAA,EAAA,GAE1D;AAGJ,QAAM,cACF,qBAAC,QAAA,EAAK,WAAU,mDACZ,UAAA;AAAA,IAAA,oBAAC,QAAA,EAAK,WAAU,0DACX,UAAA,kBAAkB,UAAU,GACjC;AAAA,IACC,aACG,oBAAC,OAAA,EAAI,WAAU,+IACX,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,UAAQ;AAAA,QACR,WAAU;AAAA,QAEV,UAAA,oBAAC,OAAA,EAAI,WAAU,mGACV,8BAAkB,CACvB;AAAA,MAAA;AAAA,IAAA,EACJ,CACJ;AAAA,EAAA,GAER;AAGJ,QAAM,aAAa,MAAM;AACrB,QAAI,cAAc;AACd,aAAO,aAAa,KAAK,WAAW;AAAA,IACxC;AAEA,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,IAAI,IAAI;AAAA,QACR,WAAU;AAAA,QACV,QAAQ,IAAI,iBAAiB,WAAW;AAAA,QACxC,SAAS,MACL,cAAc;AAAA,UACV,KAAK,IAAI;AAAA,UACT,OAAO,IAAI;AAAA,UACX,MAAM,IAAI;AAAA,QAAA,CACb;AAAA,QAGJ,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGb;AAEA,SACI,oBAAC,UAAA,EAAuB,UAAU,IAAI,KAAK,WAAW,QACjD,UAAA,WAAA,EAAW,GADD,IAAI,GAEnB;AAER;AACA,MAAM,yBAAyB,CAAC,UAAiC;AAC7D,QAAM,EAAE,eAAe,KAAK,GAAG,eAAe,aAAa,iBACvD;AAEJ,MAAI,eAAe;AACf,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,OAAO,EAAE,IAAI,cAAc,IAAI,KAAK;AAAA,QACpC,WAAW,MAAM,cAAc,QAAQ,SAAS;AAAA,QAEhD,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,UAAU;AAAA,YACV,WAAW;AAAA,YACX,QAAQ,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MAClB;AAAA,IAAA;AAAA,EAGZ;AAEA,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,WAAW;AAAA,MACX,QAAQ,MAAM;AAAA,IAAA;AAAA,EAAA;AAG1B;"}
@@ -0,0 +1,17 @@
1
+ import "./index.js";
2
+ import Button from "./Button.js";
3
+ const meta = {
4
+ title: "@ecme/Components/Button",
5
+ component: Button
6
+ };
7
+ const Sandbox = {
8
+ args: {
9
+ children: "Click Me",
10
+ disabled: false
11
+ }
12
+ };
13
+ export {
14
+ Sandbox,
15
+ meta as default
16
+ };
17
+ //# sourceMappingURL=Button.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.stories.js","sources":["../../../../../lib/@ecme/components/ui/Button/Button.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react-vite'\nimport Button from '../Button'\n\n// Define os metadados utilizados pelo Storybook para expor o componente na lista de componentes\n// e garante que o objeto esteja de acordo com a tipagem esperada pelo Storybook.\nconst meta = {\n title: '@ecme/Components/Button',\n component: Button,\n} satisfies Meta<typeof Button>\n\n// Exporta para o Storybook identificar o novo story.\nexport default meta\n\n// Tipo do Story baseado no tipo do meta, garantindo que os argumentos estejam de acordo com as props do componente.\ntype TStory = StoryObj<typeof meta>\n\nexport const Sandbox: TStory = {\n args: {\n children: 'Click Me',\n disabled: false,\n },\n}\n"],"names":[],"mappings":";;AAKA,MAAM,OAAO;AAAA,EACT,OAAO;AAAA,EACP,WAAW;AACf;AAQO,MAAM,UAAkB;AAAA,EAC3B,MAAM;AAAA,IACF,UAAU;AAAA,IACV,UAAU;AAAA,EAAA;AAElB;"}
@@ -1,6 +1,6 @@
1
- import { Direction } from "@/@types/theme";
2
- import type { NavigationTree } from "@/@types/navigation";
3
- import { LinkRenderer } from "@/components/layouts/Layouts";
1
+ import { Direction } from '@/@types/theme';
2
+ import type { NavigationTree } from '@/@types/navigation';
3
+ import { LinkRenderer } from '@/components/layouts/Layouts';
4
4
  export interface VerticalMenuContentProps {
5
5
  collapsed?: boolean;
6
6
  routeKey: string;
@@ -1 +1 @@
1
- {"version":3,"file":"VerticalMenuContent.d.ts","sourceRoot":"","sources":["../../../../../../lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAE1D,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,MAAM,WAAW,wBAAwB;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,cAAc,EAAE,CAAC;IAClC,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAkDD,QAAA,MAAM,mBAAmB,GAAI,OAAO,wBAAwB,4CAiH3D,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1
+ {"version":3,"file":"VerticalMenuContent.d.ts","sourceRoot":"","sources":["../../../../../../lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAC1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEzD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAE3D,MAAM,WAAW,wBAAwB;IACrC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,cAAc,EAAE,CAAA;IACjC,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,aAAa,EAAE,MAAM,EAAE,CAAA;IACvB,YAAY,CAAC,EAAE,YAAY,CAAA;CAC9B;AA+DD,QAAA,MAAM,mBAAmB,GAAI,OAAO,wBAAwB,4CAmI3D,CAAA;AAED,eAAe,mBAAmB,CAAA"}