@shival99/z-ui 2.0.4 → 2.0.5

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.
@@ -437,13 +437,19 @@ class ZMenuV2Component {
437
437
  zClass = input('', ...(ngDevMode ? [{ debugName: "zClass" }] : []));
438
438
  zCollapsedWidth = input(60, ...(ngDevMode ? [{ debugName: "zCollapsedWidth" }] : []));
439
439
  zExpandedWidth = input(248, ...(ngDevMode ? [{ debugName: "zExpandedWidth" }] : []));
440
+ zExpandMode = input('multiple', ...(ngDevMode ? [{ debugName: "zExpandMode" }] : []));
440
441
  selectedParent = signal(null, ...(ngDevMode ? [{ debugName: "selectedParent" }] : []));
441
442
  selectedMenuItem = signal(null, ...(ngDevMode ? [{ debugName: "selectedMenuItem" }] : []));
442
443
  mobileMenuOpen = signal(false, ...(ngDevMode ? [{ debugName: "mobileMenuOpen" }] : []));
443
444
  sidebarCollapsed = signal(false, ...(ngDevMode ? [{ debugName: "sidebarCollapsed" }] : []));
444
445
  _expandedIds = signal(new Set(), ...(ngDevMode ? [{ debugName: "_expandedIds" }] : []));
445
446
  _collapsedIds = signal(new Set(), ...(ngDevMode ? [{ debugName: "_collapsedIds" }] : []));
447
+ _renderedOpeningIds = signal(new Set(), ...(ngDevMode ? [{ debugName: "_renderedOpeningIds" }] : []));
448
+ _renderedClosingIds = signal(new Set(), ...(ngDevMode ? [{ debugName: "_renderedClosingIds" }] : []));
446
449
  _activeCacheKey = signal('', ...(ngDevMode ? [{ debugName: "_activeCacheKey" }] : []));
450
+ _hasSyncedInitialPath = signal(false, ...(ngDevMode ? [{ debugName: "_hasSyncedInitialPath" }] : []));
451
+ _openingRenderTimers = new Map();
452
+ _closingRenderTimers = new Map();
447
453
  zClasses = computed(() => zMergeClasses('z-menu-v2-shell bg-sidebar text-sidebar-foreground border-sidebar-border', this.zClass()), ...(ngDevMode ? [{ debugName: "zClasses" }] : []));
448
454
  _isMobile$ = this._breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.Small]).pipe(map(result => result.matches), takeUntilDestroyed(this._destroyRef));
449
455
  isMobile = toSignal(this._isMobile$, { initialValue: false });
@@ -459,7 +465,7 @@ class ZMenuV2Component {
459
465
  const browser = zDetectBrowser();
460
466
  return browser.name === 'Chrome' ? 'dark' : 'blur';
461
467
  }, ...(ngDevMode ? [{ debugName: "overlayType" }] : []));
462
- menuProcessed = computed(() => this._processMenus(this.zMenus(), this._expandedIds(), this._collapsedIds()), ...(ngDevMode ? [{ debugName: "menuProcessed" }] : []));
468
+ menuProcessed = computed(() => this._processMenus(this.zMenus(), this._expandedIds(), this._collapsedIds(), this._renderedOpeningIds(), this._renderedClosingIds()), ...(ngDevMode ? [{ debugName: "menuProcessed" }] : []));
463
469
  menuParents = computed(() => this.menuProcessed().tree.filter((item) => !item.parent || item.parent.length === 0), ...(ngDevMode ? [{ debugName: "menuParents" }] : []));
464
470
  parentWithActiveChild = computed(() => {
465
471
  const activeItem = this.selectedMenuItem();
@@ -474,6 +480,9 @@ class ZMenuV2Component {
474
480
  }, ...(ngDevMode ? [{ debugName: "parentWithActiveChild" }] : []));
475
481
  constructor() {
476
482
  effect(() => {
483
+ if (this._hasSyncedInitialPath()) {
484
+ return;
485
+ }
477
486
  const currentPath = this._currentPath();
478
487
  this.zMenus();
479
488
  const processedMenus = untracked(() => this.menuProcessed());
@@ -485,6 +494,7 @@ class ZMenuV2Component {
485
494
  if (matchingItem && matchingItem.id !== currentSelectedId) {
486
495
  this.setSelectedMenuItem(matchingItem.id);
487
496
  }
497
+ this._hasSyncedInitialPath.set(true);
488
498
  });
489
499
  effect(() => {
490
500
  if (!this.isMobile() && this.mobileMenuOpen()) {
@@ -507,6 +517,14 @@ class ZMenuV2Component {
507
517
  }
508
518
  ZCacheService.set(key, this.sidebarCollapsed());
509
519
  });
520
+ this._destroyRef.onDestroy(() => {
521
+ for (const timer of this._openingRenderTimers.values()) {
522
+ clearTimeout(timer);
523
+ }
524
+ for (const timer of this._closingRenderTimers.values()) {
525
+ clearTimeout(timer);
526
+ }
527
+ });
510
528
  setTimeout(() => this._emitControl());
511
529
  }
512
530
  openMobileMenu() {
@@ -541,7 +559,7 @@ class ZMenuV2Component {
541
559
  onMenuItemClick(item) {
542
560
  const hasChildren = !!item.children?.length;
543
561
  if (hasChildren) {
544
- this._toggleExpanded(item.id);
562
+ this._toggleExpanded(item);
545
563
  this.selectedParent.set(item);
546
564
  return;
547
565
  }
@@ -596,31 +614,98 @@ class ZMenuV2Component {
596
614
  this.closeMobileMenu();
597
615
  }
598
616
  }
599
- _toggleExpanded(id) {
600
- const currentlyExpanded = this.menuProcessed().flat.get(id)?.expanded ?? false;
617
+ _toggleExpanded(item) {
618
+ const currentlyExpanded = this.menuProcessed().flat.get(item.id)?.expanded ?? false;
601
619
  if (currentlyExpanded) {
602
620
  this._expandedIds.update(current => {
603
621
  const next = new Set(current);
604
- next.delete(id);
622
+ next.delete(item.id);
605
623
  return next;
606
624
  });
607
625
  this._collapsedIds.update(current => {
608
626
  const next = new Set(current);
609
- next.add(id);
627
+ next.add(item.id);
610
628
  return next;
611
629
  });
630
+ this._keepSubmenuRenderedDuringClose(item.id);
612
631
  return;
613
632
  }
633
+ this._stopClosingRender(item.id);
634
+ this._startOpeningRender(item.id);
635
+ const parentsToClose = this.zExpandMode() === 'accordion' && item.level === 0
636
+ ? this.menuParents().filter(parent => parent.id !== item.id)
637
+ : [];
638
+ for (const parent of parentsToClose) {
639
+ this._keepSubmenuRenderedDuringClose(parent.id);
640
+ }
614
641
  this._collapsedIds.update(current => {
615
642
  const next = new Set(current);
616
- next.delete(id);
643
+ next.delete(item.id);
644
+ for (const parent of parentsToClose) {
645
+ next.add(parent.id);
646
+ }
617
647
  return next;
618
648
  });
619
649
  this._expandedIds.update(current => {
650
+ const next = new Set(current);
651
+ for (const parent of parentsToClose) {
652
+ next.delete(parent.id);
653
+ }
654
+ next.add(item.id);
655
+ return next;
656
+ });
657
+ }
658
+ _startOpeningRender(id) {
659
+ const previousTimer = this._openingRenderTimers.get(id);
660
+ if (previousTimer) {
661
+ clearTimeout(previousTimer);
662
+ }
663
+ this._renderedOpeningIds.update(current => {
620
664
  const next = new Set(current);
621
665
  next.add(id);
622
666
  return next;
623
667
  });
668
+ const timer = setTimeout(() => {
669
+ this._renderedOpeningIds.update(current => {
670
+ const next = new Set(current);
671
+ next.delete(id);
672
+ return next;
673
+ });
674
+ this._openingRenderTimers.delete(id);
675
+ }, 20);
676
+ this._openingRenderTimers.set(id, timer);
677
+ }
678
+ _keepSubmenuRenderedDuringClose(id) {
679
+ const previousTimer = this._closingRenderTimers.get(id);
680
+ if (previousTimer) {
681
+ clearTimeout(previousTimer);
682
+ }
683
+ this._renderedClosingIds.update(current => {
684
+ const next = new Set(current);
685
+ next.add(id);
686
+ return next;
687
+ });
688
+ const timer = setTimeout(() => {
689
+ this._renderedClosingIds.update(current => {
690
+ const next = new Set(current);
691
+ next.delete(id);
692
+ return next;
693
+ });
694
+ this._closingRenderTimers.delete(id);
695
+ }, 240);
696
+ this._closingRenderTimers.set(id, timer);
697
+ }
698
+ _stopClosingRender(id) {
699
+ const timer = this._closingRenderTimers.get(id);
700
+ if (timer) {
701
+ clearTimeout(timer);
702
+ this._closingRenderTimers.delete(id);
703
+ }
704
+ this._renderedClosingIds.update(current => {
705
+ const next = new Set(current);
706
+ next.delete(id);
707
+ return next;
708
+ });
624
709
  }
625
710
  _expandParentsOfItem(item) {
626
711
  if (!item.parent?.length) {
@@ -641,17 +726,18 @@ class ZMenuV2Component {
641
726
  return next;
642
727
  });
643
728
  }
644
- _processMenus(menus, expandedIds, collapsedIds) {
729
+ _processMenus(menus, expandedIds, collapsedIds, renderedOpeningIds, renderedClosingIds) {
645
730
  const flat = new Map();
646
731
  const pathMap = new Map();
647
732
  const subPathMap = new Map();
648
733
  const parentMap = new Map();
649
734
  const processItem = (item, parentIds, level) => {
650
735
  const children = level < 2 ? item.children?.map(child => processItem(child, [...parentIds, item.id], level + 1)) : undefined;
736
+ const expanded = expandedIds.has(item.id) || (!!item.expanded && !collapsedIds.has(item.id));
651
737
  const processedItem = {
652
738
  active: item.active,
653
739
  children: children,
654
- expanded: expandedIds.has(item.id) || (!!item.expanded && !collapsedIds.has(item.id)),
740
+ expanded,
655
741
  icon: item.icon,
656
742
  iconSvg: item.iconSvg,
657
743
  id: item.id,
@@ -661,6 +747,8 @@ class ZMenuV2Component {
661
747
  path: item.path,
662
748
  permission: item.permission,
663
749
  projects: item.projects,
750
+ renderChildren: expanded || renderedClosingIds.has(item.id),
751
+ renderExpanded: expanded && !renderedOpeningIds.has(item.id),
664
752
  subPaths: item.subPaths,
665
753
  };
666
754
  flat.set(processedItem.id, processedItem);
@@ -723,7 +811,7 @@ class ZMenuV2Component {
723
811
  return ZCacheService.get(key, false) ?? false;
724
812
  }
725
813
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZMenuV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
726
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZMenuV2Component, isStandalone: true, selector: "z-menu-v2", inputs: { zLogo: { classPropertyName: "zLogo", publicName: "zLogo", isSignal: true, isRequired: false, transformFunction: null }, zLogoMobile: { classPropertyName: "zLogoMobile", publicName: "zLogoMobile", isSignal: true, isRequired: false, transformFunction: null }, zMenus: { classPropertyName: "zMenus", publicName: "zMenus", isSignal: true, isRequired: false, transformFunction: null }, zUser: { classPropertyName: "zUser", publicName: "zUser", isSignal: true, isRequired: false, transformFunction: null }, zUserActions: { classPropertyName: "zUserActions", publicName: "zUserActions", isSignal: true, isRequired: false, transformFunction: null }, zCurrentPath: { classPropertyName: "zCurrentPath", publicName: "zCurrentPath", isSignal: true, isRequired: false, transformFunction: null }, zKey: { classPropertyName: "zKey", publicName: "zKey", isSignal: true, isRequired: false, transformFunction: null }, zClass: { classPropertyName: "zClass", publicName: "zClass", isSignal: true, isRequired: false, transformFunction: null }, zCollapsedWidth: { classPropertyName: "zCollapsedWidth", publicName: "zCollapsedWidth", isSignal: true, isRequired: false, transformFunction: null }, zExpandedWidth: { classPropertyName: "zExpandedWidth", publicName: "zExpandedWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOnSelect: "zOnSelect", zOnMenuAction: "zOnMenuAction", zControl: "zControl" }, host: { properties: { "class.z-menu-v2-collapsed": "sidebarCollapsed()", "class.z-menu-v2-mobile-open": "mobileMenuOpen()", "class.z-menu-v2-mobile": "isMobile()" }, classAttribute: "z-menu-v2 block" }, providers: [TranslatePipe], ngImport: i0, template: "<aside\n class=\"hidden h-full min-h-0 flex-col overflow-hidden border-r shadow-sm md:flex\"\n [class]=\"zClasses()\"\n [style.--z-menu-v2-expanded-width.px]=\"zExpandedWidth()\"\n [style.--z-menu-v2-collapsed-width.px]=\"zCollapsedWidth()\">\n <div\n class=\"border-sidebar-border flex h-14 shrink-0 items-center gap-2 border-b px-3\"\n [class.justify-center]=\"sidebarCollapsed()\">\n @if (!sidebarCollapsed() && zLogo()) {\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto shrink-0 object-contain transition-opacity\" />\n }\n\n @if (!sidebarCollapsed()) {\n <div class=\"min-w-0 flex-1 overflow-hidden text-sm font-semibold text-ellipsis whitespace-nowrap\">\n {{ 'i18n_z_ui_menu_navigation' | translate }}\n </div>\n }\n\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"z-menu-v2-toggle h-9 w-9 shrink-0\"\n [class.z-menu-v2-toggle-collapsed]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"\n (sidebarCollapsed() ? 'i18n_z_ui_menu_expand_sidebar' : 'i18n_z_ui_menu_collapse_sidebar') | translate\n \"\n (click)=\"toggleSidebar()\">\n <z-icon [zType]=\"sidebarCollapsed() ? 'lucidePanelLeftOpen' : 'lucidePanelLeftClose'\" zSize=\"18\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar min-h-0 flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-2\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n @if (sidebarCollapsed() && parentHasChildren) {\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"parentPopoverTpl\"\n zPopoverWidth=\"auto\"\n zPosition=\"right-top\"\n [zOffset]=\"10\"\n class=\"z-menu-v2-icon-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n [attr.aria-label]=\"parent.name | translate\"\n (click)=\"onCollapsedParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"20\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"20\" />\n }\n </button>\n\n <ng-template #parentPopoverTpl let-close=\"close\">\n <div class=\"z-menu-v2-popover min-w-60 p-1\">\n <div class=\"text-muted-foreground flex items-center gap-2 px-2 py-2 text-xs font-medium\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"15\" />\n }\n <span class=\"overflow-hidden text-ellipsis whitespace-nowrap\">{{ parent.name | translate }}</span>\n </div>\n <ng-container\n *ngTemplateOutlet=\"collapsedChildrenTpl; context: { $implicit: parent.children, close: close }\" />\n </div>\n </ng-template>\n }\n @if (!(sidebarCollapsed() && parentHasChildren)) {\n <ng-container *ngTemplateOutlet=\"openParentTpl; context: { $implicit: parent }\" />\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"userFooterTpl\" />\n</aside>\n\n<ng-template #openParentTpl let-parent>\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentLeafActive\"\n [class.parent-active]=\"parentActive && !parentLeafActive\"\n [class.icon-only]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? (parent.name | translate) : null\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n }\n </button>\n\n @if (!sidebarCollapsed() && parentHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.expanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #collapsedChildrenTpl let-children let-close=\"close\">\n <div class=\"z-menu-v2-submenu z-menu-v2-popover-tree\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"childHasChildren ? onMenuItemClick(child) : onCollapsedLeafClick(child, close)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren) {\n <div class=\"z-menu-v2-submenu-panel collapsed-popover\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"subChildActive\"\n (click)=\"onCollapsedLeafClick(subChild, close)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #userFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-2\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n [zOffset]=\"10\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\"\n [class.justify-center]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? zUser()?.name || 'User Name' : null\">\n <span class=\"h-9 w-9 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n }\n </button>\n </div>\n</ng-template>\n\n<ng-template #mobileUserFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-3\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"top-right\"\n [zOffset]=\"8\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\">\n <span class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n </button>\n </div>\n</ng-template>\n\n<ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"overflow-hidden font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground mt-0.5 overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n\n @if (visibleUserActions().length > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n @for (action of visibleUserActions(); track action.id; let idx = $index) {\n @if (action.divide === 'before' && idx > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (action.divide === 'after' && idx < visibleUserActions().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #openChildrenTpl let-children>\n <div class=\"z-menu-v2-submenu\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-child\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-sub-child\"\n [class.active]=\"subChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<div\n class=\"z-menu-v2-mobile-bar border-border bg-background flex h-14 items-center justify-between border-b px-4 md:hidden\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"openMobileMenu()\">\n <z-icon zType=\"lucideMenu\" zSize=\"20\" />\n </button>\n</div>\n\n@if (mobileMenuOpen()) {\n <div\n class=\"z-menu-v2-backdrop fixed inset-0 z-9998 md:hidden\"\n [class.z-menu-v2-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-v2-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onMobileBackdropClick()\"></div>\n}\n\n<aside\n class=\"z-menu-v2-mobile-drawer bg-sidebar text-sidebar-foreground border-sidebar-border fixed top-0 left-0 z-9999 flex h-full w-72 max-w-[calc(100vw-1rem)] flex-col border-r md:hidden\"\n [class.open]=\"mobileMenuOpen()\">\n <div class=\"border-sidebar-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-3\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n </button>\n\n @if (parentHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.expanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"mobileUserFooterTpl\" />\n</aside>\n", styles: [".z-menu-v2{display:block;flex-shrink:0;height:100%}.z-menu-v2 [class*=cursor-pointer],.z-menu-v2 button{-webkit-user-select:none;user-select:none}.z-menu-v2-shell{width:var(--z-menu-v2-expanded-width, 248px);transition:width .2s cubic-bezier(.4,0,.2,1);will-change:width}.z-menu-v2-collapsed .z-menu-v2-shell{width:var(--z-menu-v2-collapsed-width, 60px)}.z-menu-v2-toggle{position:relative;z-index:1}.z-menu-v2-toggle.z-menu-v2-toggle-collapsed{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-nav{gap:.125rem}.z-menu-v2-item,.z-menu-v2-popover-item,.z-menu-v2-icon-item{min-width:0;border-radius:.375rem;outline:none;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.625rem;padding:.5rem .625rem;font-size:.8125rem;font-weight:450}.z-menu-v2-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-item.parent-active:not(.active){color:var(--sidebar-primary)}.z-menu-v2-item.active .z-menu-v2-dot,.z-menu-v2-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item.icon-only{justify-content:center;padding-inline:0;width:2.5rem;height:2.5rem;margin-inline:auto}.z-menu-v2-icon-item{display:flex;width:2.5rem;height:2.5rem;cursor:pointer;align-items:center;justify-content:center;margin-inline:auto}.z-menu-v2-icon-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-icon-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.5rem;padding:.45rem .5rem;font-size:.8125rem}.z-menu-v2-popover-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-popover-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item.parent-active:not(.active){background-color:color-mix(in oklab,var(--sidebar-primary) 12%,transparent);color:var(--sidebar-primary)}.z-menu-v2-popover-item.active .z-menu-v2-dot,.z-menu-v2-popover-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item-child{position:relative;padding-left:.75rem}.z-menu-v2-item-sub-child{position:relative;padding-left:.75rem;font-size:.78125rem}.z-menu-v2-submenu-panel{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;transition:grid-template-rows .24s cubic-bezier(.16,1,.3,1),opacity .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-submenu-panel.expanded{grid-template-rows:1fr;opacity:1}.z-menu-v2-submenu{position:relative;display:flex;min-width:0;min-height:0;flex-direction:column;gap:.125rem;margin:.125rem 0 .125rem .875rem;padding-left:.875rem}.z-menu-v2-submenu:before{content:\"\";position:absolute;top:0;bottom:.75rem;left:0;width:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item,.z-menu-v2-submenu .z-menu-v2-popover-item{position:relative}.z-menu-v2-submenu .z-menu-v2-item:before,.z-menu-v2-submenu .z-menu-v2-popover-item:before{content:\"\";position:absolute;top:50%;left:-.875rem;width:.875rem;height:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item.active:before,.z-menu-v2-submenu .z-menu-v2-item.parent-active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.parent-active:before{background-color:color-mix(in oklab,var(--sidebar-primary) 72%,var(--sidebar-border))}.z-menu-v2-submenu-nested{margin-left:.75rem}.z-menu-v2-popover-tree{margin-top:0;margin-bottom:0}.z-menu-v2-arrow{transition:transform .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-arrow.expanded{transform:rotate(90deg)}.z-menu-v2-dot{display:inline-flex;width:.375rem;height:.375rem;flex-shrink:0;border-radius:9999px;background-color:color-mix(in oklab,var(--sidebar-foreground) 58%,transparent)}.z-menu-v2-dot.small{width:.25rem;height:.25rem}.z-menu-v2-scrollbar{--scrollbar-padding: 0;max-width:100%}.z-menu-v2-scrollbar .ng-scroll-viewport,.z-menu-v2-scrollbar .ng-scroll-content{max-width:100%}.z-menu-v2-backdrop{animation:z-menu-v2-backdrop-enter .2s ease-out forwards}.z-menu-v2-backdrop-dark{background-color:#0009}.z-menu-v2-backdrop-blur{background-color:#0000000d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.z-menu-v2-mobile-drawer{transform:translate(-100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:4px 0 24px #0000001a;will-change:transform}.z-menu-v2-mobile-drawer.open{transform:translate(0)}@keyframes z-menu-v2-backdrop-enter{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange"], exportAs: ["zPopover"] }, { kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
814
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZMenuV2Component, isStandalone: true, selector: "z-menu-v2", inputs: { zLogo: { classPropertyName: "zLogo", publicName: "zLogo", isSignal: true, isRequired: false, transformFunction: null }, zLogoMobile: { classPropertyName: "zLogoMobile", publicName: "zLogoMobile", isSignal: true, isRequired: false, transformFunction: null }, zMenus: { classPropertyName: "zMenus", publicName: "zMenus", isSignal: true, isRequired: false, transformFunction: null }, zUser: { classPropertyName: "zUser", publicName: "zUser", isSignal: true, isRequired: false, transformFunction: null }, zUserActions: { classPropertyName: "zUserActions", publicName: "zUserActions", isSignal: true, isRequired: false, transformFunction: null }, zCurrentPath: { classPropertyName: "zCurrentPath", publicName: "zCurrentPath", isSignal: true, isRequired: false, transformFunction: null }, zKey: { classPropertyName: "zKey", publicName: "zKey", isSignal: true, isRequired: false, transformFunction: null }, zClass: { classPropertyName: "zClass", publicName: "zClass", isSignal: true, isRequired: false, transformFunction: null }, zCollapsedWidth: { classPropertyName: "zCollapsedWidth", publicName: "zCollapsedWidth", isSignal: true, isRequired: false, transformFunction: null }, zExpandedWidth: { classPropertyName: "zExpandedWidth", publicName: "zExpandedWidth", isSignal: true, isRequired: false, transformFunction: null }, zExpandMode: { classPropertyName: "zExpandMode", publicName: "zExpandMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOnSelect: "zOnSelect", zOnMenuAction: "zOnMenuAction", zControl: "zControl" }, host: { properties: { "class.z-menu-v2-collapsed": "sidebarCollapsed()", "class.z-menu-v2-mobile-open": "mobileMenuOpen()", "class.z-menu-v2-mobile": "isMobile()" }, classAttribute: "z-menu-v2 block" }, providers: [TranslatePipe], ngImport: i0, template: "<aside\n class=\"hidden h-full min-h-0 flex-col overflow-hidden border-r shadow-sm md:flex\"\n [class]=\"zClasses()\"\n [style.--z-menu-v2-expanded-width.px]=\"zExpandedWidth()\"\n [style.--z-menu-v2-collapsed-width.px]=\"zCollapsedWidth()\">\n <div\n class=\"border-sidebar-border flex h-14 shrink-0 items-center gap-2 border-b px-3\"\n [class.justify-center]=\"sidebarCollapsed()\">\n @if (!sidebarCollapsed() && zLogo()) {\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto shrink-0 object-contain transition-opacity\" />\n }\n\n @if (!sidebarCollapsed()) {\n <div class=\"min-w-0 flex-1 overflow-hidden text-sm font-semibold text-ellipsis whitespace-nowrap\">\n {{ 'i18n_z_ui_menu_navigation' | translate }}\n </div>\n }\n\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"z-menu-v2-toggle h-9 w-9 shrink-0\"\n [class.z-menu-v2-toggle-collapsed]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"\n (sidebarCollapsed() ? 'i18n_z_ui_menu_expand_sidebar' : 'i18n_z_ui_menu_collapse_sidebar') | translate\n \"\n (click)=\"toggleSidebar()\">\n <z-icon [zType]=\"sidebarCollapsed() ? 'lucidePanelLeftOpen' : 'lucidePanelLeftClose'\" zSize=\"18\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar min-h-0 flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-2\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n @if (sidebarCollapsed() && parentHasChildren) {\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"parentPopoverTpl\"\n zPopoverWidth=\"auto\"\n zPosition=\"right-top\"\n [zOffset]=\"10\"\n class=\"z-menu-v2-icon-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n [attr.aria-label]=\"parent.name | translate\"\n (click)=\"onCollapsedParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"20\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"20\" />\n }\n </button>\n\n <ng-template #parentPopoverTpl let-close=\"close\">\n <div class=\"z-menu-v2-popover min-w-60 pt-1 pl-1\">\n <div class=\"text-muted-foreground flex items-center gap-2 px-2 py-2 text-xs font-medium\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"15\" />\n }\n <span class=\"overflow-hidden text-ellipsis whitespace-nowrap\">{{ parent.name | translate }}</span>\n </div>\n <ng-scrollbar class=\"z-menu-v2-popover-scrollbar\" orientation=\"vertical\" visibility=\"visible\">\n <div class=\"z-menu-v2-popover-scroll-content pr-2 pb-1\">\n <ng-container\n *ngTemplateOutlet=\"collapsedChildrenTpl; context: { $implicit: parent.children, close: close }\" />\n </div>\n </ng-scrollbar>\n </div>\n </ng-template>\n }\n @if (!(sidebarCollapsed() && parentHasChildren)) {\n <ng-container *ngTemplateOutlet=\"openParentTpl; context: { $implicit: parent }\" />\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"userFooterTpl\" />\n</aside>\n\n<ng-template #openParentTpl let-parent>\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentLeafActive\"\n [class.parent-active]=\"parentActive && !parentLeafActive\"\n [class.icon-only]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? (parent.name | translate) : null\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n }\n </button>\n\n @if (!sidebarCollapsed() && parentHasChildren && parent.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.renderExpanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #collapsedChildrenTpl let-children let-close=\"close\">\n <div class=\"z-menu-v2-submenu z-menu-v2-popover-tree\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"childHasChildren ? onMenuItemClick(child) : onCollapsedLeafClick(child, close)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren && child.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel collapsed-popover\" [class.expanded]=\"child.renderExpanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"subChildActive\"\n (click)=\"onCollapsedLeafClick(subChild, close)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #userFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-2\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n [zOffset]=\"10\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\"\n [class.justify-center]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? zUser()?.name || 'User Name' : null\">\n <span class=\"h-9 w-9 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n }\n </button>\n </div>\n</ng-template>\n\n<ng-template #mobileUserFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-3\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"top-right\"\n [zOffset]=\"8\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\">\n <span class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n </button>\n </div>\n</ng-template>\n\n<ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"overflow-hidden font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground mt-0.5 overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n\n @if (visibleUserActions().length > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n @for (action of visibleUserActions(); track action.id; let idx = $index) {\n @if (action.divide === 'before' && idx > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (action.divide === 'after' && idx < visibleUserActions().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #openChildrenTpl let-children>\n <div class=\"z-menu-v2-submenu\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-child\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren && child.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"child.renderExpanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-sub-child\"\n [class.active]=\"subChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<div\n class=\"z-menu-v2-mobile-bar border-border bg-background flex h-14 items-center justify-between border-b px-4 md:hidden\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"openMobileMenu()\">\n <z-icon zType=\"lucideMenu\" zSize=\"20\" />\n </button>\n</div>\n\n@if (mobileMenuOpen()) {\n <div\n class=\"z-menu-v2-backdrop fixed inset-0 z-9998 md:hidden\"\n [class.z-menu-v2-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-v2-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onMobileBackdropClick()\"></div>\n}\n\n<aside\n class=\"z-menu-v2-mobile-drawer bg-sidebar text-sidebar-foreground border-sidebar-border fixed top-0 left-0 z-9999 flex h-full w-72 max-w-[calc(100vw-1rem)] flex-col border-r md:hidden\"\n [class.open]=\"mobileMenuOpen()\">\n <div class=\"border-sidebar-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-3\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n </button>\n\n @if (parentHasChildren && parent.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.renderExpanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"mobileUserFooterTpl\" />\n</aside>\n", styles: [".z-menu-v2{display:block;flex-shrink:0;height:100%}.z-menu-v2 [class*=cursor-pointer],.z-menu-v2 button{-webkit-user-select:none;user-select:none}.z-menu-v2-shell{width:var(--z-menu-v2-expanded-width, 248px);transition:width .2s cubic-bezier(.4,0,.2,1);will-change:width}.z-menu-v2-collapsed .z-menu-v2-shell{width:var(--z-menu-v2-collapsed-width, 60px)}.z-menu-v2-toggle{position:relative;z-index:1}.z-menu-v2-toggle.z-menu-v2-toggle-collapsed{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-nav{gap:.125rem}.z-menu-v2-item,.z-menu-v2-popover-item,.z-menu-v2-icon-item{min-width:0;border-radius:.375rem;outline:none;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.625rem;padding:.5rem .625rem;font-size:.8125rem;font-weight:450}.z-menu-v2-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-item.parent-active:not(.active){color:var(--sidebar-primary)}.z-menu-v2-item.active .z-menu-v2-dot,.z-menu-v2-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item.icon-only{justify-content:center;padding-inline:0;width:2.5rem;height:2.5rem;margin-inline:auto}.z-menu-v2-icon-item{display:flex;width:2.5rem;height:2.5rem;cursor:pointer;align-items:center;justify-content:center;margin-inline:auto}.z-menu-v2-icon-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-icon-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.5rem;padding:.45rem .5rem;font-size:.8125rem;font-weight:450}.z-menu-v2-popover-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-popover-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item.parent-active:not(.active){background-color:transparent;color:var(--sidebar-primary)}.z-menu-v2-popover-item.active .z-menu-v2-dot,.z-menu-v2-popover-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item-child{position:relative;padding-left:.75rem}.z-menu-v2-item-sub-child{position:relative;padding-left:.75rem;font-size:.78125rem}.z-menu-v2-submenu-panel{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;transition:grid-template-rows .24s cubic-bezier(.16,1,.3,1),opacity .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-submenu-panel.expanded{grid-template-rows:1fr;opacity:1}.z-menu-v2-submenu{position:relative;display:flex;min-width:0;min-height:0;flex-direction:column;gap:.125rem;margin:0 0 0 .875rem;padding-left:.875rem}.z-menu-v2-submenu:before{content:\"\";position:absolute;top:0;bottom:.75rem;left:0;width:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item,.z-menu-v2-submenu .z-menu-v2-popover-item{position:relative}.z-menu-v2-submenu .z-menu-v2-item:before,.z-menu-v2-submenu .z-menu-v2-popover-item:before{content:\"\";position:absolute;top:50%;left:-.875rem;width:.875rem;height:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item.active:before,.z-menu-v2-submenu .z-menu-v2-item.parent-active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.parent-active:before{background-color:color-mix(in oklab,var(--sidebar-primary) 72%,var(--sidebar-border))}.z-menu-v2-submenu-nested{margin-left:.75rem}.z-menu-v2-popover-tree{margin-top:0;margin-bottom:0}.z-menu-v2-popover-scrollbar{--scrollbar-padding: 0;--scrollbar-overscroll-behavior: contain;max-height:min(28rem,100vh - 8rem);min-height:0;overflow-x:hidden;overflow-y:auto}.z-menu-v2-popover-scroll-content{min-width:0}.z-menu-v2-arrow{transition:transform .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-arrow.expanded{transform:rotate(90deg)}.z-menu-v2-dot{display:inline-flex;width:.375rem;height:.375rem;flex-shrink:0;border-radius:9999px;background-color:color-mix(in oklab,var(--sidebar-foreground) 58%,transparent)}.z-menu-v2-dot.small{width:.25rem;height:.25rem}.z-menu-v2-scrollbar{--scrollbar-padding: 0;max-width:100%}.z-menu-v2-scrollbar .ng-scroll-viewport,.z-menu-v2-scrollbar .ng-scroll-content{max-width:100%}.z-menu-v2-backdrop{animation:z-menu-v2-backdrop-enter .2s ease-out forwards}.z-menu-v2-backdrop-dark{background-color:#0009}.z-menu-v2-backdrop-blur{background-color:#0000000d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.z-menu-v2-mobile-drawer{transform:translate(-100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:4px 0 24px #0000001a;will-change:transform}.z-menu-v2-mobile-drawer.open{transform:translate(0)}@keyframes z-menu-v2-backdrop-enter{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange"], exportAs: ["zPopover"] }, { kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
727
815
  }
728
816
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZMenuV2Component, decorators: [{
729
817
  type: Component,
@@ -732,8 +820,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
732
820
  '[class.z-menu-v2-collapsed]': 'sidebarCollapsed()',
733
821
  '[class.z-menu-v2-mobile-open]': 'mobileMenuOpen()',
734
822
  '[class.z-menu-v2-mobile]': 'isMobile()',
735
- }, template: "<aside\n class=\"hidden h-full min-h-0 flex-col overflow-hidden border-r shadow-sm md:flex\"\n [class]=\"zClasses()\"\n [style.--z-menu-v2-expanded-width.px]=\"zExpandedWidth()\"\n [style.--z-menu-v2-collapsed-width.px]=\"zCollapsedWidth()\">\n <div\n class=\"border-sidebar-border flex h-14 shrink-0 items-center gap-2 border-b px-3\"\n [class.justify-center]=\"sidebarCollapsed()\">\n @if (!sidebarCollapsed() && zLogo()) {\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto shrink-0 object-contain transition-opacity\" />\n }\n\n @if (!sidebarCollapsed()) {\n <div class=\"min-w-0 flex-1 overflow-hidden text-sm font-semibold text-ellipsis whitespace-nowrap\">\n {{ 'i18n_z_ui_menu_navigation' | translate }}\n </div>\n }\n\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"z-menu-v2-toggle h-9 w-9 shrink-0\"\n [class.z-menu-v2-toggle-collapsed]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"\n (sidebarCollapsed() ? 'i18n_z_ui_menu_expand_sidebar' : 'i18n_z_ui_menu_collapse_sidebar') | translate\n \"\n (click)=\"toggleSidebar()\">\n <z-icon [zType]=\"sidebarCollapsed() ? 'lucidePanelLeftOpen' : 'lucidePanelLeftClose'\" zSize=\"18\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar min-h-0 flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-2\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n @if (sidebarCollapsed() && parentHasChildren) {\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"parentPopoverTpl\"\n zPopoverWidth=\"auto\"\n zPosition=\"right-top\"\n [zOffset]=\"10\"\n class=\"z-menu-v2-icon-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n [attr.aria-label]=\"parent.name | translate\"\n (click)=\"onCollapsedParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"20\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"20\" />\n }\n </button>\n\n <ng-template #parentPopoverTpl let-close=\"close\">\n <div class=\"z-menu-v2-popover min-w-60 p-1\">\n <div class=\"text-muted-foreground flex items-center gap-2 px-2 py-2 text-xs font-medium\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"15\" />\n }\n <span class=\"overflow-hidden text-ellipsis whitespace-nowrap\">{{ parent.name | translate }}</span>\n </div>\n <ng-container\n *ngTemplateOutlet=\"collapsedChildrenTpl; context: { $implicit: parent.children, close: close }\" />\n </div>\n </ng-template>\n }\n @if (!(sidebarCollapsed() && parentHasChildren)) {\n <ng-container *ngTemplateOutlet=\"openParentTpl; context: { $implicit: parent }\" />\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"userFooterTpl\" />\n</aside>\n\n<ng-template #openParentTpl let-parent>\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentLeafActive\"\n [class.parent-active]=\"parentActive && !parentLeafActive\"\n [class.icon-only]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? (parent.name | translate) : null\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n }\n </button>\n\n @if (!sidebarCollapsed() && parentHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.expanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #collapsedChildrenTpl let-children let-close=\"close\">\n <div class=\"z-menu-v2-submenu z-menu-v2-popover-tree\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"childHasChildren ? onMenuItemClick(child) : onCollapsedLeafClick(child, close)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren) {\n <div class=\"z-menu-v2-submenu-panel collapsed-popover\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"subChildActive\"\n (click)=\"onCollapsedLeafClick(subChild, close)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #userFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-2\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n [zOffset]=\"10\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\"\n [class.justify-center]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? zUser()?.name || 'User Name' : null\">\n <span class=\"h-9 w-9 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n }\n </button>\n </div>\n</ng-template>\n\n<ng-template #mobileUserFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-3\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"top-right\"\n [zOffset]=\"8\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\">\n <span class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n </button>\n </div>\n</ng-template>\n\n<ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"overflow-hidden font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground mt-0.5 overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n\n @if (visibleUserActions().length > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n @for (action of visibleUserActions(); track action.id; let idx = $index) {\n @if (action.divide === 'before' && idx > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (action.divide === 'after' && idx < visibleUserActions().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #openChildrenTpl let-children>\n <div class=\"z-menu-v2-submenu\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-child\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-sub-child\"\n [class.active]=\"subChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<div\n class=\"z-menu-v2-mobile-bar border-border bg-background flex h-14 items-center justify-between border-b px-4 md:hidden\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"openMobileMenu()\">\n <z-icon zType=\"lucideMenu\" zSize=\"20\" />\n </button>\n</div>\n\n@if (mobileMenuOpen()) {\n <div\n class=\"z-menu-v2-backdrop fixed inset-0 z-9998 md:hidden\"\n [class.z-menu-v2-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-v2-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onMobileBackdropClick()\"></div>\n}\n\n<aside\n class=\"z-menu-v2-mobile-drawer bg-sidebar text-sidebar-foreground border-sidebar-border fixed top-0 left-0 z-9999 flex h-full w-72 max-w-[calc(100vw-1rem)] flex-col border-r md:hidden\"\n [class.open]=\"mobileMenuOpen()\">\n <div class=\"border-sidebar-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-3\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n </button>\n\n @if (parentHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.expanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"mobileUserFooterTpl\" />\n</aside>\n", styles: [".z-menu-v2{display:block;flex-shrink:0;height:100%}.z-menu-v2 [class*=cursor-pointer],.z-menu-v2 button{-webkit-user-select:none;user-select:none}.z-menu-v2-shell{width:var(--z-menu-v2-expanded-width, 248px);transition:width .2s cubic-bezier(.4,0,.2,1);will-change:width}.z-menu-v2-collapsed .z-menu-v2-shell{width:var(--z-menu-v2-collapsed-width, 60px)}.z-menu-v2-toggle{position:relative;z-index:1}.z-menu-v2-toggle.z-menu-v2-toggle-collapsed{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-nav{gap:.125rem}.z-menu-v2-item,.z-menu-v2-popover-item,.z-menu-v2-icon-item{min-width:0;border-radius:.375rem;outline:none;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.625rem;padding:.5rem .625rem;font-size:.8125rem;font-weight:450}.z-menu-v2-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-item.parent-active:not(.active){color:var(--sidebar-primary)}.z-menu-v2-item.active .z-menu-v2-dot,.z-menu-v2-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item.icon-only{justify-content:center;padding-inline:0;width:2.5rem;height:2.5rem;margin-inline:auto}.z-menu-v2-icon-item{display:flex;width:2.5rem;height:2.5rem;cursor:pointer;align-items:center;justify-content:center;margin-inline:auto}.z-menu-v2-icon-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-icon-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.5rem;padding:.45rem .5rem;font-size:.8125rem}.z-menu-v2-popover-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-popover-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item.parent-active:not(.active){background-color:color-mix(in oklab,var(--sidebar-primary) 12%,transparent);color:var(--sidebar-primary)}.z-menu-v2-popover-item.active .z-menu-v2-dot,.z-menu-v2-popover-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item-child{position:relative;padding-left:.75rem}.z-menu-v2-item-sub-child{position:relative;padding-left:.75rem;font-size:.78125rem}.z-menu-v2-submenu-panel{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;transition:grid-template-rows .24s cubic-bezier(.16,1,.3,1),opacity .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-submenu-panel.expanded{grid-template-rows:1fr;opacity:1}.z-menu-v2-submenu{position:relative;display:flex;min-width:0;min-height:0;flex-direction:column;gap:.125rem;margin:.125rem 0 .125rem .875rem;padding-left:.875rem}.z-menu-v2-submenu:before{content:\"\";position:absolute;top:0;bottom:.75rem;left:0;width:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item,.z-menu-v2-submenu .z-menu-v2-popover-item{position:relative}.z-menu-v2-submenu .z-menu-v2-item:before,.z-menu-v2-submenu .z-menu-v2-popover-item:before{content:\"\";position:absolute;top:50%;left:-.875rem;width:.875rem;height:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item.active:before,.z-menu-v2-submenu .z-menu-v2-item.parent-active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.parent-active:before{background-color:color-mix(in oklab,var(--sidebar-primary) 72%,var(--sidebar-border))}.z-menu-v2-submenu-nested{margin-left:.75rem}.z-menu-v2-popover-tree{margin-top:0;margin-bottom:0}.z-menu-v2-arrow{transition:transform .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-arrow.expanded{transform:rotate(90deg)}.z-menu-v2-dot{display:inline-flex;width:.375rem;height:.375rem;flex-shrink:0;border-radius:9999px;background-color:color-mix(in oklab,var(--sidebar-foreground) 58%,transparent)}.z-menu-v2-dot.small{width:.25rem;height:.25rem}.z-menu-v2-scrollbar{--scrollbar-padding: 0;max-width:100%}.z-menu-v2-scrollbar .ng-scroll-viewport,.z-menu-v2-scrollbar .ng-scroll-content{max-width:100%}.z-menu-v2-backdrop{animation:z-menu-v2-backdrop-enter .2s ease-out forwards}.z-menu-v2-backdrop-dark{background-color:#0009}.z-menu-v2-backdrop-blur{background-color:#0000000d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.z-menu-v2-mobile-drawer{transform:translate(-100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:4px 0 24px #0000001a;will-change:transform}.z-menu-v2-mobile-drawer.open{transform:translate(0)}@keyframes z-menu-v2-backdrop-enter{0%{opacity:0}to{opacity:1}}\n"] }]
736
- }], ctorParameters: () => [], propDecorators: { zOnSelect: [{ type: i0.Output, args: ["zOnSelect"] }], zOnMenuAction: [{ type: i0.Output, args: ["zOnMenuAction"] }], zControl: [{ type: i0.Output, args: ["zControl"] }], zLogo: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLogo", required: false }] }], zLogoMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLogoMobile", required: false }] }], zMenus: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMenus", required: false }] }], zUser: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUser", required: false }] }], zUserActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUserActions", required: false }] }], zCurrentPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCurrentPath", required: false }] }], zKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "zKey", required: false }] }], zClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClass", required: false }] }], zCollapsedWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCollapsedWidth", required: false }] }], zExpandedWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zExpandedWidth", required: false }] }] } });
823
+ }, template: "<aside\n class=\"hidden h-full min-h-0 flex-col overflow-hidden border-r shadow-sm md:flex\"\n [class]=\"zClasses()\"\n [style.--z-menu-v2-expanded-width.px]=\"zExpandedWidth()\"\n [style.--z-menu-v2-collapsed-width.px]=\"zCollapsedWidth()\">\n <div\n class=\"border-sidebar-border flex h-14 shrink-0 items-center gap-2 border-b px-3\"\n [class.justify-center]=\"sidebarCollapsed()\">\n @if (!sidebarCollapsed() && zLogo()) {\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto shrink-0 object-contain transition-opacity\" />\n }\n\n @if (!sidebarCollapsed()) {\n <div class=\"min-w-0 flex-1 overflow-hidden text-sm font-semibold text-ellipsis whitespace-nowrap\">\n {{ 'i18n_z_ui_menu_navigation' | translate }}\n </div>\n }\n\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"z-menu-v2-toggle h-9 w-9 shrink-0\"\n [class.z-menu-v2-toggle-collapsed]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"\n (sidebarCollapsed() ? 'i18n_z_ui_menu_expand_sidebar' : 'i18n_z_ui_menu_collapse_sidebar') | translate\n \"\n (click)=\"toggleSidebar()\">\n <z-icon [zType]=\"sidebarCollapsed() ? 'lucidePanelLeftOpen' : 'lucidePanelLeftClose'\" zSize=\"18\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar min-h-0 flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-2\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n @if (sidebarCollapsed() && parentHasChildren) {\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"parentPopoverTpl\"\n zPopoverWidth=\"auto\"\n zPosition=\"right-top\"\n [zOffset]=\"10\"\n class=\"z-menu-v2-icon-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n [attr.aria-label]=\"parent.name | translate\"\n (click)=\"onCollapsedParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"20\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"20\" />\n }\n </button>\n\n <ng-template #parentPopoverTpl let-close=\"close\">\n <div class=\"z-menu-v2-popover min-w-60 pt-1 pl-1\">\n <div class=\"text-muted-foreground flex items-center gap-2 px-2 py-2 text-xs font-medium\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"15\" />\n }\n <span class=\"overflow-hidden text-ellipsis whitespace-nowrap\">{{ parent.name | translate }}</span>\n </div>\n <ng-scrollbar class=\"z-menu-v2-popover-scrollbar\" orientation=\"vertical\" visibility=\"visible\">\n <div class=\"z-menu-v2-popover-scroll-content pr-2 pb-1\">\n <ng-container\n *ngTemplateOutlet=\"collapsedChildrenTpl; context: { $implicit: parent.children, close: close }\" />\n </div>\n </ng-scrollbar>\n </div>\n </ng-template>\n }\n @if (!(sidebarCollapsed() && parentHasChildren)) {\n <ng-container *ngTemplateOutlet=\"openParentTpl; context: { $implicit: parent }\" />\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"userFooterTpl\" />\n</aside>\n\n<ng-template #openParentTpl let-parent>\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentLeafActive\"\n [class.parent-active]=\"parentActive && !parentLeafActive\"\n [class.icon-only]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? (parent.name | translate) : null\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n }\n </button>\n\n @if (!sidebarCollapsed() && parentHasChildren && parent.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.renderExpanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #collapsedChildrenTpl let-children let-close=\"close\">\n <div class=\"z-menu-v2-submenu z-menu-v2-popover-tree\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"childHasChildren ? onMenuItemClick(child) : onCollapsedLeafClick(child, close)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren && child.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel collapsed-popover\" [class.expanded]=\"child.renderExpanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"subChildActive\"\n (click)=\"onCollapsedLeafClick(subChild, close)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #userFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-2\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n [zOffset]=\"10\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\"\n [class.justify-center]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? zUser()?.name || 'User Name' : null\">\n <span class=\"h-9 w-9 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n }\n </button>\n </div>\n</ng-template>\n\n<ng-template #mobileUserFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-3\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"top-right\"\n [zOffset]=\"8\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\">\n <span class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n </button>\n </div>\n</ng-template>\n\n<ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"overflow-hidden font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground mt-0.5 overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n\n @if (visibleUserActions().length > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n @for (action of visibleUserActions(); track action.id; let idx = $index) {\n @if (action.divide === 'before' && idx > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (action.divide === 'after' && idx < visibleUserActions().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #openChildrenTpl let-children>\n <div class=\"z-menu-v2-submenu\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-child\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren && child.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"child.renderExpanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-sub-child\"\n [class.active]=\"subChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<div\n class=\"z-menu-v2-mobile-bar border-border bg-background flex h-14 items-center justify-between border-b px-4 md:hidden\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"openMobileMenu()\">\n <z-icon zType=\"lucideMenu\" zSize=\"20\" />\n </button>\n</div>\n\n@if (mobileMenuOpen()) {\n <div\n class=\"z-menu-v2-backdrop fixed inset-0 z-9998 md:hidden\"\n [class.z-menu-v2-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-v2-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onMobileBackdropClick()\"></div>\n}\n\n<aside\n class=\"z-menu-v2-mobile-drawer bg-sidebar text-sidebar-foreground border-sidebar-border fixed top-0 left-0 z-9999 flex h-full w-72 max-w-[calc(100vw-1rem)] flex-col border-r md:hidden\"\n [class.open]=\"mobileMenuOpen()\">\n <div class=\"border-sidebar-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-3\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n </button>\n\n @if (parentHasChildren && parent.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.renderExpanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"mobileUserFooterTpl\" />\n</aside>\n", styles: [".z-menu-v2{display:block;flex-shrink:0;height:100%}.z-menu-v2 [class*=cursor-pointer],.z-menu-v2 button{-webkit-user-select:none;user-select:none}.z-menu-v2-shell{width:var(--z-menu-v2-expanded-width, 248px);transition:width .2s cubic-bezier(.4,0,.2,1);will-change:width}.z-menu-v2-collapsed .z-menu-v2-shell{width:var(--z-menu-v2-collapsed-width, 60px)}.z-menu-v2-toggle{position:relative;z-index:1}.z-menu-v2-toggle.z-menu-v2-toggle-collapsed{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-nav{gap:.125rem}.z-menu-v2-item,.z-menu-v2-popover-item,.z-menu-v2-icon-item{min-width:0;border-radius:.375rem;outline:none;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.625rem;padding:.5rem .625rem;font-size:.8125rem;font-weight:450}.z-menu-v2-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-item.parent-active:not(.active){color:var(--sidebar-primary)}.z-menu-v2-item.active .z-menu-v2-dot,.z-menu-v2-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item.icon-only{justify-content:center;padding-inline:0;width:2.5rem;height:2.5rem;margin-inline:auto}.z-menu-v2-icon-item{display:flex;width:2.5rem;height:2.5rem;cursor:pointer;align-items:center;justify-content:center;margin-inline:auto}.z-menu-v2-icon-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-icon-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.5rem;padding:.45rem .5rem;font-size:.8125rem;font-weight:450}.z-menu-v2-popover-item:hover{background-color:var(--sidebar-accent);color:var(--sidebar-accent-foreground)}.z-menu-v2-popover-item.active{background-color:var(--sidebar-primary);color:var(--sidebar-primary-foreground)}.z-menu-v2-popover-item.parent-active:not(.active){background-color:transparent;color:var(--sidebar-primary)}.z-menu-v2-popover-item.active .z-menu-v2-dot,.z-menu-v2-popover-item.parent-active .z-menu-v2-dot{background-color:currentColor}.z-menu-v2-item-child{position:relative;padding-left:.75rem}.z-menu-v2-item-sub-child{position:relative;padding-left:.75rem;font-size:.78125rem}.z-menu-v2-submenu-panel{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;transition:grid-template-rows .24s cubic-bezier(.16,1,.3,1),opacity .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-submenu-panel.expanded{grid-template-rows:1fr;opacity:1}.z-menu-v2-submenu{position:relative;display:flex;min-width:0;min-height:0;flex-direction:column;gap:.125rem;margin:0 0 0 .875rem;padding-left:.875rem}.z-menu-v2-submenu:before{content:\"\";position:absolute;top:0;bottom:.75rem;left:0;width:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item,.z-menu-v2-submenu .z-menu-v2-popover-item{position:relative}.z-menu-v2-submenu .z-menu-v2-item:before,.z-menu-v2-submenu .z-menu-v2-popover-item:before{content:\"\";position:absolute;top:50%;left:-.875rem;width:.875rem;height:1px;background-color:color-mix(in oklab,var(--sidebar-border) 84%,transparent)}.z-menu-v2-submenu .z-menu-v2-item.active:before,.z-menu-v2-submenu .z-menu-v2-item.parent-active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.active:before,.z-menu-v2-submenu .z-menu-v2-popover-item.parent-active:before{background-color:color-mix(in oklab,var(--sidebar-primary) 72%,var(--sidebar-border))}.z-menu-v2-submenu-nested{margin-left:.75rem}.z-menu-v2-popover-tree{margin-top:0;margin-bottom:0}.z-menu-v2-popover-scrollbar{--scrollbar-padding: 0;--scrollbar-overscroll-behavior: contain;max-height:min(28rem,100vh - 8rem);min-height:0;overflow-x:hidden;overflow-y:auto}.z-menu-v2-popover-scroll-content{min-width:0}.z-menu-v2-arrow{transition:transform .2s cubic-bezier(.4,0,.2,1)}.z-menu-v2-arrow.expanded{transform:rotate(90deg)}.z-menu-v2-dot{display:inline-flex;width:.375rem;height:.375rem;flex-shrink:0;border-radius:9999px;background-color:color-mix(in oklab,var(--sidebar-foreground) 58%,transparent)}.z-menu-v2-dot.small{width:.25rem;height:.25rem}.z-menu-v2-scrollbar{--scrollbar-padding: 0;max-width:100%}.z-menu-v2-scrollbar .ng-scroll-viewport,.z-menu-v2-scrollbar .ng-scroll-content{max-width:100%}.z-menu-v2-backdrop{animation:z-menu-v2-backdrop-enter .2s ease-out forwards}.z-menu-v2-backdrop-dark{background-color:#0009}.z-menu-v2-backdrop-blur{background-color:#0000000d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.z-menu-v2-mobile-drawer{transform:translate(-100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:4px 0 24px #0000001a;will-change:transform}.z-menu-v2-mobile-drawer.open{transform:translate(0)}@keyframes z-menu-v2-backdrop-enter{0%{opacity:0}to{opacity:1}}\n"] }]
824
+ }], ctorParameters: () => [], propDecorators: { zOnSelect: [{ type: i0.Output, args: ["zOnSelect"] }], zOnMenuAction: [{ type: i0.Output, args: ["zOnMenuAction"] }], zControl: [{ type: i0.Output, args: ["zControl"] }], zLogo: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLogo", required: false }] }], zLogoMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLogoMobile", required: false }] }], zMenus: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMenus", required: false }] }], zUser: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUser", required: false }] }], zUserActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "zUserActions", required: false }] }], zCurrentPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCurrentPath", required: false }] }], zKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "zKey", required: false }] }], zClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClass", required: false }] }], zCollapsedWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCollapsedWidth", required: false }] }], zExpandedWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zExpandedWidth", required: false }] }], zExpandMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "zExpandMode", required: false }] }] } });
737
825
 
738
826
  /**
739
827
  * Generated bundle index. Do not edit.
@@ -1 +1 @@
1
- {"version":3,"file":"shival99-z-ui-components-z-menu.mjs","sources":["../../../../libs/core-ui/components/z-menu/z-menu.component.ts","../../../../libs/core-ui/components/z-menu/z-menu.component.html","../../../../libs/core-ui/components/z-menu/z-menu-v2.component.ts","../../../../libs/core-ui/components/z-menu/z-menu-v2.component.html","../../../../libs/core-ui/components/z-menu/shival99-z-ui-components-z-menu.ts"],"sourcesContent":["import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';\nimport { isPlatformBrowser, NgTemplateOutlet } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n DestroyRef,\n effect,\n inject,\n input,\n output,\n PLATFORM_ID,\n signal,\n TemplateRef,\n untracked,\n ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { NavigationEnd, Router } from '@angular/router';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZCacheService } from '@shival99/z-ui/services';\nimport { zDetectBrowser } from '@shival99/z-ui/utils';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport { filter, map, startWith } from 'rxjs';\nimport { ZMenuControl, ZMenuItem, ZMenuOverlayType, ZMenuProcessed, ZMenuUser, ZMenuUserAction } from './z-menu.types';\n\n@Component({\n selector: 'z-menu',\n imports: [\n NgTemplateOutlet,\n ZButtonComponent,\n ZIconComponent,\n ZTooltipDirective,\n ZPopoverDirective,\n NgScrollbar,\n TranslatePipe,\n ],\n standalone: true,\n templateUrl: './z-menu.component.html',\n styleUrl: './z-menu.component.scss',\n providers: [TranslatePipe],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-menu block',\n '[class.z-menu-collapsed]': 'sidebarCollapsed()',\n '[class.z-menu-no-child]': 'selectedParentHasNoChild()',\n '[class.z-menu-mobile]': 'isMobile()',\n '[class.z-menu-mobile-open]': 'mobileMenuOpen()',\n },\n})\nexport class ZMenuComponent {\n private readonly _breakpointObserver = inject(BreakpointObserver);\n private readonly _destroyRef = inject(DestroyRef);\n private readonly _platformId = inject(PLATFORM_ID);\n private readonly _router = inject(Router);\n\n public readonly zOnSelect = output<ZMenuItem>();\n public readonly zOnMenuAction = output<ZMenuUserAction>();\n public readonly zControl = output<ZMenuControl>();\n\n public readonly zLogo = input<string>('assets/images/avatar.svg');\n public readonly zLogoMobile = input<string>('');\n public readonly zMenus = input<ZMenuItem[]>([]);\n public readonly zUser = input<ZMenuUser | null>(null);\n public readonly zUserActions = input<ZMenuUserAction[]>([]);\n public readonly zActionsTemplate = input<TemplateRef<{ close: () => void }> | null>(null);\n public readonly zCurrentPath = input<string>('');\n public readonly zKey = input<string>('z-menu');\n\n public readonly selectedParent = signal<ZMenuItem | null>(null);\n public readonly selectedMenuItem = signal<ZMenuItem | null>(null);\n public readonly mobileMenuOpen = signal(false);\n public readonly mobileTemplateDrawerOpen = signal(false);\n public readonly sidebarCollapsed = signal(this._getStateMenuCollapsed());\n private readonly _templateDrawerParentId = signal<string | null>(null);\n\n protected readonly closeSidebarFn = (): void => this.sidebarCollapsed.set(true);\n protected readonly closeMobileDrawerFn = (): void => {\n this.mobileTemplateDrawerOpen.set(false);\n this._templateDrawerParentId.set(null);\n };\n\n private readonly _isMobile$ = this._breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.Small]).pipe(\n map(result => result.matches),\n takeUntilDestroyed(this._destroyRef)\n );\n\n public readonly isMobile = toSignal(this._isMobile$, { initialValue: false });\n protected readonly mobileLogo = computed(() => this.zLogoMobile() || this.zLogo());\n\n private readonly _routerPath = toSignal(\n this._router.events.pipe(\n filter((e): e is NavigationEnd => e instanceof NavigationEnd),\n map(e => e.urlAfterRedirects),\n startWith(this._router.url)\n ),\n { initialValue: this._router.url }\n );\n\n private readonly _currentPath = computed(() => this.zCurrentPath() || this._routerPath());\n protected readonly overlayType = computed((): ZMenuOverlayType => {\n if (!isPlatformBrowser(this._platformId)) {\n return 'dark';\n }\n\n const browser = zDetectBrowser();\n return browser.name === 'Chrome' ? 'dark' : 'blur';\n });\n\n protected readonly menuProcessed = computed((): ZMenuProcessed => this._processMenus(this.zMenus()));\n\n protected readonly menuParents = computed(() =>\n this.menuProcessed().tree.filter((item: ZMenuItem) => !item.parent || item.parent.length === 0)\n );\n\n protected readonly menuChildren = computed(() => {\n const selected = this.selectedParent();\n if (!selected) {\n return [];\n }\n return selected.children ?? [];\n });\n\n protected readonly selectedParentHasNoChild = computed(() => {\n const parent = this.selectedParent();\n if (!parent) {\n return false;\n }\n const hasNoChildren = !parent.children || parent.children.length === 0;\n return !parent.menuTemplate && hasNoChildren;\n });\n\n protected readonly parentWithActiveChild = computed(() => {\n const activeItem = this.selectedMenuItem();\n if (!activeItem) {\n return null;\n }\n\n const parents = this.menuParents();\n\n for (const parent of parents) {\n const hasNoChildren = !parent.children || parent.children.length === 0;\n if ((parent.menuTemplate || hasNoChildren) && activeItem.id === parent.id) {\n return parent;\n }\n }\n\n if (activeItem.parent && activeItem.parent.length > 0) {\n const topLevelParentId = activeItem.parent[0];\n return parents.find(p => p.id === topLevelParentId) || null;\n }\n\n return null;\n });\n\n protected isParentOfActiveItem(item: ZMenuItem): boolean {\n const activeItem = this.selectedMenuItem();\n if (!activeItem) {\n return false;\n }\n\n if (activeItem.parent && activeItem.parent.length > 0) {\n return activeItem.parent.includes(item.id);\n }\n\n return false;\n }\n\n protected readonly avatarSrc = computed(() => this.zUser()?.avatar || this.zLogo());\n\n protected readonly customDrawerParent = computed(() => {\n const parentId = this._templateDrawerParentId();\n if (!parentId) {\n return null;\n }\n return this.menuParents().find((p: ZMenuItem) => p.id === parentId) ?? null;\n });\n\n private readonly _defaultSidebarChildWidth = 230;\n private readonly _defaultMobileDrawerWidth = 280;\n\n protected readonly sidebarChildWidth = computed(() => {\n const parent = this.selectedParent();\n if (parent?.menuTemplate && parent.menuTemplateWidth) {\n return parent.menuTemplateWidth;\n }\n return this._defaultSidebarChildWidth;\n });\n\n protected readonly mobileCustomDrawerWidth = computed(() => {\n const parent = this.customDrawerParent();\n if (parent?.menuTemplateWidth) {\n return parent.menuTemplateWidth;\n }\n return this._defaultMobileDrawerWidth;\n });\n\n constructor() {\n effect(() => {\n const parents = this.menuParents();\n if (parents.length > 0 && !untracked(() => this.selectedParent())) {\n this.selectedParent.set(parents[0]);\n }\n });\n\n effect(() => {\n const currentPath = this._currentPath();\n const processedMenus = this.menuProcessed();\n if (!currentPath || processedMenus.flat.size === 0) {\n return;\n }\n\n const matchingItem = this._findMenuItemByPath(currentPath, processedMenus);\n const currentSelectedId = untracked(() => this.selectedMenuItem()?.id);\n if (matchingItem && matchingItem.id !== currentSelectedId) {\n this.setSelectedMenuItem(matchingItem.id);\n }\n });\n\n effect(() => {\n if (!this.isMobile() && this.mobileMenuOpen()) {\n this.mobileMenuOpen.set(false);\n }\n });\n\n effect(() => {\n const collapsed = this.sidebarCollapsed();\n ZCacheService.set(this.zKey(), collapsed);\n });\n\n setTimeout(() => this._emitControl());\n }\n\n private _emitControl(): void {\n this.zControl.emit({\n openMobileMenu: () => this.openMobileMenu(),\n closeMobileMenu: () => this.closeMobileMenu(),\n toggleMobileMenu: () => this.toggleMobileMenu(),\n setSelectedMenuItem: (id: string) => this.setSelectedMenuItem(id),\n clearActiveItem: () => this.clearActiveItem(),\n toggleSidebar: () => this.toggleSidebar(),\n openMobileTemplateDrawer: (id: string) => this.openMobileTemplateDrawer(id),\n closeMobileTemplateDrawer: () => this.closeMobileTemplateDrawer(),\n sidebarCollapsed: this.sidebarCollapsed.asReadonly(),\n mobileMenuOpen: this.mobileMenuOpen.asReadonly(),\n mobileTemplateDrawerOpen: this.mobileTemplateDrawerOpen.asReadonly(),\n selectedMenuItem: this.selectedMenuItem.asReadonly(),\n selectedParent: this.selectedParent.asReadonly(),\n menuProcessed: this.menuProcessed,\n });\n }\n\n public openMobileMenu(): void {\n this.mobileMenuOpen.set(true);\n }\n\n public closeMobileMenu(): void {\n this.mobileMenuOpen.set(false);\n }\n\n public toggleMobileMenu(): void {\n this.mobileMenuOpen.set(!this.mobileMenuOpen());\n }\n\n public openMobileTemplateDrawer(parentId: string): void {\n this._templateDrawerParentId.set(parentId);\n this.mobileMenuOpen.set(false);\n requestAnimationFrame(() => {\n this.mobileTemplateDrawerOpen.set(true);\n });\n }\n\n public closeMobileTemplateDrawer(): void {\n this.mobileTemplateDrawerOpen.set(false);\n this.mobileMenuOpen.set(true);\n setTimeout(() => {\n this._templateDrawerParentId.set(null);\n }, 300);\n }\n\n public setSelectedMenuItem(menuId: string): void {\n const item = this._findMenuItemById(menuId);\n if (!item) {\n return;\n }\n\n this.selectedMenuItem.set(item);\n\n if (item.parent && item.parent.length > 0) {\n const topLevelParentId = item.parent[0];\n const topLevelParent = this._findMenuItemById(topLevelParentId);\n if (topLevelParent) {\n this.selectedParent.set(topLevelParent);\n topLevelParent.expanded = true;\n }\n\n for (const parentId of item.parent) {\n const parentItem = this._findMenuItemById(parentId);\n if (parentItem) {\n parentItem.expanded = true;\n }\n }\n return;\n }\n\n const parent = this._findParentOfMenuItem(menuId);\n if (parent) {\n this.selectedParent.set(parent);\n parent.expanded = true;\n }\n }\n\n public clearActiveItem(): void {\n this.selectedMenuItem.set(null);\n }\n\n protected selectParent(item: ZMenuItem): void {\n this.selectedParent.set(item);\n const hasNoChildren = !item.children || item.children.length === 0;\n\n if (item.menuTemplate || hasNoChildren) {\n this.selectedMenuItem.set(item);\n }\n\n const processedItem = this.menuProcessed().flat.get(item.id);\n if (processedItem) {\n this.zOnSelect.emit(processedItem);\n }\n }\n\n protected onDesktopParentClick(item: ZMenuItem): void {\n this.selectParent(item);\n const hasChildrenOrTemplate = item.menuTemplate || (item.children && item.children.length > 0);\n\n if (this.sidebarCollapsed() && hasChildrenOrTemplate) {\n this.toggleSidebar();\n }\n }\n\n protected onMenuItemClick(item: ZMenuItem): void {\n if (item.children && item.children.length > 0) {\n item.expanded = !item.expanded;\n return;\n }\n\n this.selectedMenuItem.set(item);\n this._expandParentsOfItem(item);\n\n const processedItem = this.menuProcessed().flat.get(item.id);\n if (processedItem) {\n this.zOnSelect.emit(processedItem);\n }\n\n if (this.isMobile()) {\n this.closeMobileMenu();\n this.mobileTemplateDrawerOpen.set(false);\n }\n }\n\n protected onMobileParentClick(item: ZMenuItem): void {\n if (item.menuTemplate) {\n this.selectParent(item);\n this.openMobileTemplateDrawer(item.id);\n return;\n }\n\n const hasNoChildren = !item.children || item.children.length === 0;\n if (hasNoChildren) {\n this.selectParent(item);\n this.closeMobileMenu();\n return;\n }\n\n if (this.selectedParent()?.id === item.id) {\n item.expanded = !item.expanded;\n this.selectedParent.set({ ...item });\n return;\n }\n\n this.selectParent(item);\n item.expanded = true;\n }\n\n protected toggleSidebar(): void {\n if (!this.selectedParent()?.children?.length) {\n return;\n }\n\n this.sidebarCollapsed.set(!this.sidebarCollapsed());\n }\n\n protected closeSidebar(): void {\n this.sidebarCollapsed.set(true);\n }\n\n protected onUserActionClick(action: ZMenuUserAction): void {\n if (action.disabled) {\n return;\n }\n this.zOnMenuAction.emit(action);\n }\n\n protected getVisibleUserActions(): ZMenuUserAction[] {\n return this.zUserActions().filter(action => !action.hidden);\n }\n\n protected shouldShowDividerBefore(action: ZMenuUserAction, index: number): boolean {\n return action.divide === 'before' && index > 0;\n }\n\n protected shouldShowDividerAfter(action: ZMenuUserAction, index: number): boolean {\n return action.divide === 'after' && index < this.getVisibleUserActions().length - 1;\n }\n\n protected onBackdropClick(): void {\n if (this.mobileTemplateDrawerOpen()) {\n this.mobileTemplateDrawerOpen.set(false);\n this._templateDrawerParentId.set(null);\n }\n this.closeMobileMenu();\n }\n\n private _findMenuItemById(id: string): ZMenuItem | null {\n return this.menuProcessed().flat.get(id) ?? null;\n }\n\n private _findParentOfMenuItem(id: string): ZMenuItem | null {\n const directParent = this.menuProcessed().parentMap.get(id);\n if (directParent) {\n return directParent;\n }\n\n const item = this.menuProcessed().flat.get(id);\n if (!item?.parent?.length) {\n return null;\n }\n\n const parentId = item.parent[item.parent.length - 1];\n return this.menuProcessed().flat.get(parentId) ?? null;\n }\n\n private _isChildOf(childId: string, parent: ZMenuItem): boolean {\n const child = this.menuProcessed().flat.get(childId);\n if (!child?.parent?.length) {\n return false;\n }\n\n return child.parent.includes(parent.id);\n }\n\n private _expandParentsOfItem(item: ZMenuItem): void {\n if (!item.parent || item.parent.length === 0) {\n return;\n }\n\n for (const parentId of item.parent) {\n const parentItem = this.menuProcessed().flat.get(parentId);\n if (parentItem) {\n parentItem.expanded = true;\n }\n }\n }\n\n private _processMenus(menus: ZMenuItem[]): ZMenuProcessed {\n const flat = new Map<string, ZMenuItem>();\n const pathMap = new Map<string, ZMenuItem>();\n const subPathMap = new Map<string, ZMenuItem>();\n const parentMap = new Map<string, ZMenuItem>();\n\n const processItem = (item: ZMenuItem, parentIds: string[], level: number): ZMenuItem => {\n item.parent = [...parentIds];\n item.level = level;\n flat.set(item.id, item);\n\n if (item.path) {\n const normalizedPath = item.path.replace(/\\/$/, '') || '/';\n pathMap.set(normalizedPath, item);\n }\n\n if (item.subPaths && item.subPaths.length > 0) {\n for (const subPath of item.subPaths) {\n const normalizedSubPath = subPath.replace(/\\/$/, '');\n subPathMap.set(normalizedSubPath, item);\n }\n }\n\n if (item.children && item.children.length > 0) {\n const newParentIds = [...parentIds, item.id];\n for (const child of item.children) {\n parentMap.set(child.id, item);\n }\n\n item.children = item.children.map(child => processItem(child, newParentIds, level + 1));\n }\n\n return item;\n };\n\n const tree = menus.map(item => processItem(item, [], 0));\n return { tree, flat, pathMap, subPathMap, parentMap };\n }\n\n private _findMenuItemByPath(path: string, processed: ZMenuProcessed): ZMenuItem | null {\n const normalizedPath = path.split('?')[0].replace(/\\/$/, '') || '/';\n const exactMatch = processed.pathMap.get(normalizedPath);\n if (exactMatch) {\n return exactMatch;\n }\n\n const subPathMatch = processed.subPathMap.get(normalizedPath);\n if (subPathMatch) {\n return subPathMatch;\n }\n\n for (const [subPath, item] of processed.subPathMap.entries()) {\n if (normalizedPath.startsWith(subPath + '/')) {\n return item;\n }\n }\n\n for (const [itemPath, item] of processed.pathMap.entries()) {\n if (itemPath && itemPath !== '/' && normalizedPath.startsWith(itemPath + '/')) {\n return item;\n }\n }\n\n return null;\n }\n\n private _getStateMenuCollapsed(): boolean {\n return ZCacheService.get<boolean>(this.zKey(), false) ?? false;\n }\n}\n","<!-- DESKTOP LAYOUT - Hidden on mobile -->\n<div class=\"z-menu-desktop relative z-200 hidden h-full py-1 pl-1 md:block\" [class.collapsed]=\"sidebarCollapsed()\">\n <main class=\"z-menu-main relative flex h-full\">\n <div class=\"z-sidebar-main h-full w-[3.125rem]\">\n <div\n class=\"z-shadow-menu bg-sidebar border-border/40 dark:border-sidebar-border relative flex h-full w-full flex-col items-center gap-1.5 rounded-[0.375rem] border\"></div>\n\n <div class=\"bg-sidebar text-sidebar-foreground absolute inset-px z-20 flex flex-col rounded-[0.375rem]\">\n @if (zLogo()) {\n <div class=\"border-sidebar-border flex h-[3.25rem] items-center justify-center border-b px-2\">\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n </div>\n }\n\n <!-- Expand Button - Only show when collapsed -->\n @if (sidebarCollapsed() && selectedParent()) {\n <div\n class=\"z-expand-btn hover:bg-sidebar-accent mx-auto mt-2 flex h-9 w-9 cursor-pointer items-center justify-center rounded-[0.375rem]\"\n (click)=\"toggleSidebar()\">\n <z-icon zType=\"lucideChevronsRight\" zSize=\"20\" class=\"opacity-70\" />\n </div>\n }\n\n <div class=\"flex flex-1 flex-col items-center gap-2 p-2\">\n @for (item of menuParents(); track item.id) {\n @let hasActiveChild = parentWithActiveChild()?.id === item.id;\n @let isCurrentlySelected = selectedParent()?.id === item.id;\n @let showActiveIndicator = hasActiveChild && !isCurrentlySelected;\n <div\n zTooltip\n [zContent]=\"item.name | translate\"\n zPosition=\"right\"\n [zArrow]=\"false\"\n [zAlwaysShow]=\"true\"\n class=\"relative flex h-9 w-9 cursor-pointer items-center justify-center rounded-[0.375rem] select-none\"\n [class.bg-sidebar-primary]=\"selectedParent()?.id === item.id\"\n [class.text-sidebar-primary-foreground]=\"selectedParent()?.id === item.id\"\n [class.hover:bg-sidebar-accent]=\"selectedParent()?.id !== item.id\"\n (click)=\"onDesktopParentClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"20\" />\n } @else {\n <z-icon [zSvg]=\"item.iconSvg || ''\" zSize=\"20\" />\n }\n @if (showActiveIndicator) {\n <div\n class=\"bg-sidebar-primary absolute top-1/2 -left-[0.3125rem] h-4 w-1 -translate-y-1/2 rounded-full\"></div>\n }\n </div>\n }\n </div>\n\n <div class=\"border-sidebar-border flex items-center justify-center border-t p-2\">\n <div\n z-popover\n [zOffset]=\"11\"\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n class=\"aspect-square h-9 w-9 shrink-0 cursor-pointer overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <!-- User Info Header - Always shown -->\n <div class=\"p-0 text-sm font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-medium\">{{ zUser()?.name || 'User Name' }}</span>\n <span class=\"text-muted-foreground mt-0.5 truncate text-xs\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n </div>\n\n @if (getVisibleUserActions().length > 0 || zActionsTemplate()) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Actions - Custom or from zUserActions -->\n @if (zActionsTemplate()) {\n <ng-container *ngTemplateOutlet=\"zActionsTemplate(); context: { close: close }\" />\n } @else if (getVisibleUserActions().length > 0) {\n @for (action of getVisibleUserActions(); track action.id; let idx = $index) {\n @if (shouldShowDividerBefore(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (shouldShowDividerAfter(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n }\n </div>\n </ng-template>\n\n @if (selectedParent(); as parent) {\n @let hasChildrenOrTemplate = parent.menuTemplate || (parent.children && parent.children.length > 0);\n @if (hasChildrenOrTemplate) {\n <div\n class=\"z-sidebar-child-wrapper\"\n [class.collapsed]=\"sidebarCollapsed()\"\n [style.--sidebar-child-width.px]=\"sidebarChildWidth()\">\n <div\n class=\"z-sidebar-child z-shadow-menu bg-card text-card-foreground border-border/40 dark:border-sidebar-border flex h-full shrink-0 flex-col items-start overflow-hidden rounded-[0.375rem] border\"\n [style.width.px]=\"sidebarChildWidth()\"\n [class.collapsed]=\"sidebarCollapsed()\">\n <div class=\"border-border flex h-[3.25rem] w-full shrink-0 items-center border-b px-3\">\n @if (selectedParent()?.icon) {\n <z-icon [zType]=\"selectedParent()!.icon\" zSize=\"20\" class=\"mr-2 shrink-0\" />\n }\n <div\n class=\"mr-4 min-w-0 flex-1 truncate text-base font-semibold\"\n zTooltip\n zPosition=\"top-left\"\n [zContent]=\"selectedParent()?.name || '' | translate\"\n [zArrow]=\"false\">\n {{ selectedParent()?.name | translate }}\n </div>\n\n <z-icon\n zType=\"lucidePanelRightOpen\"\n zSize=\"20\"\n class=\"shrink-0 cursor-pointer opacity-60 hover:opacity-100\"\n (click)=\"toggleSidebar()\" />\n </div>\n\n <!-- Show menuTemplate if available, otherwise show children -->\n @if (selectedParent()?.menuTemplate) {\n <ng-scrollbar class=\"z-menu-scrollbar min-h-0 w-full flex-1\" track=\"vertical\">\n <div class=\"flex w-full flex-col p-3 pr-2\">\n <ng-container\n *ngTemplateOutlet=\"\n selectedParent()!.menuTemplate!;\n context: { $implicit: selectedParent()!, close: closeSidebarFn }\n \" />\n </div>\n </ng-scrollbar>\n } @else {\n <ng-scrollbar class=\"z-menu-scrollbar min-h-0 w-full flex-1 overflow-hidden\" track=\"vertical\">\n <div class=\"flex w-full min-w-0 flex-col gap-1 overflow-hidden py-1 pr-2 pl-2\">\n <ng-container *ngTemplateOutlet=\"menuChildrenTpl; context: { $implicit: menuChildren() }\" />\n </div>\n </ng-scrollbar>\n }\n </div>\n </div>\n }\n }\n </main>\n</div>\n\n<!-- MOBILE LAYOUT - Visible only on mobile -->\n<div class=\"z-menu-mobile-wrapper hidden max-md:block\">\n <!-- Mobile Backdrop -->\n @if (mobileMenuOpen() || mobileTemplateDrawerOpen()) {\n <div\n class=\"z-menu-backdrop fixed inset-0 z-9998\"\n [class.z-menu-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onBackdropClick()\"></div>\n }\n\n <!-- Mobile Drawer -->\n <aside\n class=\"z-menu-drawer bg-background border-border fixed top-0 left-0 z-9999 flex h-full w-70 flex-col rounded-r-lg border-r\"\n [class.open]=\"mobileMenuOpen()\">\n <!-- Drawer Header -->\n <div class=\"border-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"bg-accent h-9 w-9 shrink-0\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <!-- Drawer Content - Accordion Menu -->\n <ng-scrollbar class=\"z-menu-scrollbar flex-1\" track=\"vertical\">\n <div class=\"p-3\">\n @for (parent of menuParents(); track parent.id) {\n <div class=\"mb-1\">\n <!-- Parent Item -->\n @let isParentActive =\n selectedMenuItem()?.id === parent.id && (!parent.children || parent.children.length === 0);\n @let hasActiveChild = parentWithActiveChild()?.id === parent.id && !isParentActive;\n @let isCurrentlyViewing = selectedParent()?.id === parent.id;\n <div\n class=\"relative flex cursor-pointer items-center gap-3 rounded-[0.375rem] p-2\"\n [class.bg-primary/20]=\"isParentActive\"\n [class.text-primary]=\"isParentActive || hasActiveChild\"\n [class.hover:bg-accent]=\"!isParentActive\"\n (click)=\"onMobileParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n } @else if (parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\">{{ parent.name | translate }}</span>\n @if ((parent.children && parent.children.length > 0) || parent.menuTemplate) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"16\"\n class=\"z-menu-arrow shrink-0 opacity-60 transition-transform\"\n [class.expanded]=\"parent.expanded && isCurrentlyViewing\" />\n }\n </div>\n\n <!-- Children (Accordion) - Only render if NO menuTemplate -->\n @if (parent.children && parent.children.length > 0 && !parent.menuTemplate) {\n <div class=\"z-menu-submenu\" [class.expanded]=\"parent.expanded && isCurrentlyViewing\">\n <div class=\"z-menu-submenu-inner\">\n <div class=\"z-menu-tree relative ml-4 flex flex-col gap-1 pt-1 pl-3\">\n <div class=\"absolute top-0 bottom-2 left-0 w-px bg-gray-300 dark:bg-gray-600\"></div>\n\n @for (child of parent.children; track child.id) {\n @let isChildActive =\n selectedMenuItem()?.id === child.id && (!child.children || child.children.length === 0);\n @let isChildParentOfActive = isParentOfActiveItem(child);\n @let hasChildren = child.children && child.children.length > 0;\n\n <div>\n <div\n class=\"relative flex cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isChildActive\"\n [class.text-primary-foreground]=\"isChildActive\"\n [class.text-primary]=\"isChildParentOfActive && !isChildActive\"\n [class.hover:bg-accent]=\"!isChildActive\"\n (click)=\"onMenuItemClick(child)\">\n <div class=\"absolute top-1/2 -left-3 h-px w-3 bg-gray-300 dark:bg-gray-600\"></div>\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n } @else if (child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n } @else {\n <div\n class=\"h-1.5 w-1.5 shrink-0 rounded-full\"\n [class.bg-primary-foreground]=\"isChildActive\"\n [class.bg-gray-400]=\"!isChildActive\"></div>\n }\n <span class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\">\n {{ child.name | translate }}\n </span>\n @if (hasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-arrow shrink-0 opacity-60 transition-transform\"\n [class.expanded]=\"child.expanded\" />\n }\n </div>\n\n <!-- Level 3 -->\n @if (hasChildren) {\n <div class=\"z-menu-submenu\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-submenu-inner\">\n <div class=\"relative ml-4 flex flex-col gap-1 pt-1 pl-3\">\n <div class=\"absolute top-0 bottom-2 left-0 w-px bg-gray-300 dark:bg-gray-600\"></div>\n\n @for (subChild of child.children; track subChild.id) {\n @let isSubChildActive = selectedMenuItem()?.id === subChild.id;\n\n <div class=\"relative w-full min-w-0\">\n <div class=\"absolute top-1/2 -left-3 h-px w-3 bg-gray-300 dark:bg-gray-600\"></div>\n\n <div\n class=\"flex cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isSubChildActive\"\n [class.text-primary-foreground]=\"isSubChildActive\"\n [class.hover:bg-accent]=\"!isSubChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n <div\n class=\"h-1 w-1 shrink-0 rounded-full\"\n [class.bg-primary-foreground]=\"isSubChildActive\"\n [class.bg-gray-400]=\"!isSubChildActive\"></div>\n <span class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\">\n {{ subChild.name | translate }}\n </span>\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n </ng-scrollbar>\n\n <!-- Drawer Footer - User Info -->\n <div class=\"border-border shrink-0 border-t p-3\">\n <div\n z-popover\n [zOffset]=\"8\"\n [zPopoverContent]=\"mobileActionsPopoverTpl\"\n zPosition=\"top-right\"\n zTrigger=\"click\"\n class=\"hover:bg-accent flex cursor-pointer items-center gap-3 rounded-[0.375rem] p-2\">\n <div class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </div>\n <div class=\"min-w-0 flex-1\">\n <div class=\"truncate text-sm font-medium\">{{ zUser()?.name || 'User Name' }}</div>\n <div class=\"text-muted-foreground truncate text-xs\">{{ zUser()?.email || 'user@example.com' }}</div>\n </div>\n <div class=\"text-muted-foreground flex shrink-0 flex-col\">\n <z-icon zType=\"lucideChevronUp\" zSize=\"14\" />\n <z-icon zType=\"lucideChevronDown\" zSize=\"14\" class=\"-mt-1\" />\n </div>\n </div>\n </div>\n </aside>\n\n <!-- Mobile Custom Template Drawer -->\n <aside\n class=\"z-menu-custom-drawer bg-background border-border fixed top-0 left-0 z-9999 flex h-full max-w-[calc(100vw-1rem)] flex-col rounded-r-lg border-r\"\n [style.width.px]=\"mobileCustomDrawerWidth()\"\n [class.open]=\"mobileTemplateDrawerOpen() && customDrawerParent()?.menuTemplate\">\n @if (customDrawerParent()?.menuTemplate) {\n <!-- Custom Drawer Header -->\n <div class=\"border-border flex h-14 shrink-0 items-center gap-3 border-b px-4\">\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"bg-accent h-9 w-9 shrink-0\"\n (click)=\"closeMobileTemplateDrawer()\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"20\" />\n </button>\n <span class=\"min-w-0 flex-1 truncate text-base font-semibold\">\n {{ customDrawerParent()?.name | translate }}\n </span>\n </div>\n\n <!-- Custom Template Content -->\n <ng-scrollbar class=\"z-menu-scrollbar flex-1\" track=\"vertical\">\n <div class=\"p-4\">\n <ng-container\n *ngTemplateOutlet=\"\n customDrawerParent()!.menuTemplate!;\n context: { $implicit: customDrawerParent()!, close: closeMobileDrawerFn }\n \" />\n </div>\n </ng-scrollbar>\n }\n </aside>\n\n <ng-template #mobileActionsPopoverTpl let-close=\"close\">\n <div class=\"min-w-48 p-1\">\n @if (zActionsTemplate()) {\n <ng-container *ngTemplateOutlet=\"zActionsTemplate(); context: { close: close }\" />\n } @else if (getVisibleUserActions().length > 0) {\n @for (action of getVisibleUserActions(); track action.id; let idx = $index) {\n @if (shouldShowDividerBefore(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (shouldShowDividerAfter(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n }\n </div>\n </ng-template>\n</div>\n\n<!-- Shared Template for Menu Children -->\n<ng-template #menuChildrenTpl let-children>\n @for (child of children; track child.id) {\n @let isChildActive = selectedMenuItem()?.id === child.id && (!child.children || child.children.length === 0);\n @let isChildParentOfActive = isParentOfActiveItem(child);\n @let hasChildren = child.children && child.children.length > 0;\n <div class=\"w-full min-w-0\">\n <div\n #divLevel1\n class=\"z-menu-item flex w-full cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isChildActive\"\n [class.text-primary-foreground]=\"isChildActive\"\n [class.text-primary]=\"isChildParentOfActive && !isChildActive\"\n [class.hover:bg-gray-200]=\"!isChildActive\"\n [class.dark:hover:bg-input/50]=\"!isChildActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"18\" class=\"shrink-0\" />\n } @else if (child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\"\n zTooltip\n [zContent]=\"child.name | translate\"\n [zArrow]=\"false\"\n [zOffset]=\"10\"\n zMaxWidth=\"200px\"\n zPosition=\"right\"\n [zTriggerElement]=\"divLevel1\">\n {{ child.name | translate }}\n </span>\n @if (hasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-arrow shrink-0 opacity-60 transition-transform\"\n [class.expanded]=\"child.expanded\" />\n }\n </div>\n\n @if (hasChildren) {\n <div class=\"z-menu-submenu\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-submenu-inner\">\n <div class=\"z-menu-tree relative ml-4 flex flex-col gap-1 pt-1 pl-3\">\n <div class=\"absolute top-0 bottom-2 left-0 w-px bg-gray-300 dark:bg-gray-600\"></div>\n\n @for (subChild of child.children; track subChild.id; let isLast = $last) {\n @let isSubChildActive = selectedMenuItem()?.id === subChild.id;\n <div class=\"relative w-full min-w-0\">\n <div class=\"absolute top-1/2 -left-3 h-px w-3 bg-gray-300 dark:bg-gray-600\"></div>\n\n <div\n #divLevel2\n class=\"z-menu-item flex w-full cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isSubChildActive\"\n [class.text-primary-foreground]=\"isSubChildActive\"\n [class.hover:bg-gray-200]=\"!isSubChildActive\"\n [class.dark:hover:bg-input/50]=\"!isSubChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"16\" class=\"shrink-0\" />\n } @else if (subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n } @else {\n <div\n class=\"h-1 w-1 shrink-0 rounded-full\"\n [class.bg-primary-foreground]=\"isSubChildActive\"\n [class.bg-gray-400]=\"!isSubChildActive\"></div>\n }\n <span\n class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\"\n zTooltip\n [zContent]=\"subChild.name | translate\"\n [zArrow]=\"false\"\n [zOffset]=\"10\"\n zMaxWidth=\"200px\"\n zPosition=\"right\"\n [zTriggerElement]=\"divLevel2\">\n {{ subChild.name | translate }}\n </span>\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n</ng-template>\n","import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';\nimport { isPlatformBrowser, NgTemplateOutlet } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n DestroyRef,\n effect,\n inject,\n input,\n output,\n PLATFORM_ID,\n signal,\n untracked,\n ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { NavigationEnd, Router } from '@angular/router';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { ZCacheService } from '@shival99/z-ui/services';\nimport { zDetectBrowser, zMergeClasses } from '@shival99/z-ui/utils';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport { filter, map, startWith } from 'rxjs';\nimport {\n ZMenuItem,\n ZMenuOverlayType,\n ZMenuProcessed,\n ZMenuUser,\n ZMenuUserAction,\n ZMenuV2Control,\n ZMenuV2Item,\n} from './z-menu.types';\n\n@Component({\n selector: 'z-menu-v2',\n imports: [NgTemplateOutlet, ZButtonComponent, ZIconComponent, ZPopoverDirective, NgScrollbar, TranslatePipe],\n standalone: true,\n templateUrl: './z-menu-v2.component.html',\n styleUrl: './z-menu-v2.component.scss',\n providers: [TranslatePipe],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-menu-v2 block',\n '[class.z-menu-v2-collapsed]': 'sidebarCollapsed()',\n '[class.z-menu-v2-mobile-open]': 'mobileMenuOpen()',\n '[class.z-menu-v2-mobile]': 'isMobile()',\n },\n})\nexport class ZMenuV2Component {\n private readonly _breakpointObserver = inject(BreakpointObserver);\n private readonly _destroyRef = inject(DestroyRef);\n private readonly _platformId = inject(PLATFORM_ID);\n private readonly _router = inject(Router);\n\n public readonly zOnSelect = output<ZMenuItem>();\n public readonly zOnMenuAction = output<ZMenuUserAction>();\n public readonly zControl = output<ZMenuV2Control>();\n\n public readonly zLogo = input<string>('assets/images/avatar.svg');\n public readonly zLogoMobile = input<string>('');\n public readonly zMenus = input<ZMenuV2Item[]>([]);\n public readonly zUser = input<ZMenuUser | null>(null);\n public readonly zUserActions = input<ZMenuUserAction[]>([]);\n public readonly zCurrentPath = input<string>('');\n public readonly zKey = input<string>('z-menu-v2');\n public readonly zClass = input('');\n public readonly zCollapsedWidth = input(60);\n public readonly zExpandedWidth = input(248);\n\n public readonly selectedParent = signal<ZMenuItem | null>(null);\n public readonly selectedMenuItem = signal<ZMenuItem | null>(null);\n public readonly mobileMenuOpen = signal(false);\n public readonly sidebarCollapsed = signal(false);\n\n private readonly _expandedIds = signal<Set<string>>(new Set());\n private readonly _collapsedIds = signal<Set<string>>(new Set());\n private readonly _activeCacheKey = signal('');\n protected readonly zClasses = computed(() =>\n zMergeClasses('z-menu-v2-shell bg-sidebar text-sidebar-foreground border-sidebar-border', this.zClass())\n );\n\n private readonly _isMobile$ = this._breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.Small]).pipe(\n map(result => result.matches),\n takeUntilDestroyed(this._destroyRef)\n );\n\n public readonly isMobile = toSignal(this._isMobile$, { initialValue: false });\n protected readonly mobileLogo = computed(() => this.zLogoMobile() || this.zLogo());\n protected readonly avatarSrc = computed(() => this.zUser()?.avatar || this.zLogo());\n protected readonly visibleUserActions = computed(() => this.zUserActions().filter(action => !action.hidden));\n\n private readonly _routerPath = toSignal(\n this._router.events.pipe(\n filter((e): e is NavigationEnd => e instanceof NavigationEnd),\n map(e => e.urlAfterRedirects),\n startWith(this._router.url)\n ),\n { initialValue: this._router.url }\n );\n\n private readonly _currentPath = computed(() => this.zCurrentPath() || this._routerPath());\n protected readonly overlayType = computed((): ZMenuOverlayType => {\n if (!isPlatformBrowser(this._platformId)) {\n return 'dark';\n }\n\n const browser = zDetectBrowser();\n return browser.name === 'Chrome' ? 'dark' : 'blur';\n });\n\n protected readonly menuProcessed = computed(\n (): ZMenuProcessed => this._processMenus(this.zMenus(), this._expandedIds(), this._collapsedIds())\n );\n\n protected readonly menuParents = computed(() =>\n this.menuProcessed().tree.filter((item: ZMenuItem) => !item.parent || item.parent.length === 0)\n );\n\n protected readonly parentWithActiveChild = computed(() => {\n const activeItem = this.selectedMenuItem();\n if (!activeItem) {\n return null;\n }\n\n if (!activeItem.parent?.length) {\n return activeItem;\n }\n\n const topLevelParentId = activeItem.parent[0];\n return this.menuParents().find(parent => parent.id === topLevelParentId) ?? null;\n });\n\n constructor() {\n effect(() => {\n const currentPath = this._currentPath();\n this.zMenus();\n const processedMenus = untracked(() => this.menuProcessed());\n if (!currentPath || processedMenus.flat.size === 0) {\n return;\n }\n\n const matchingItem = this._findMenuItemByPath(currentPath, processedMenus);\n const currentSelectedId = untracked(() => this.selectedMenuItem()?.id);\n if (matchingItem && matchingItem.id !== currentSelectedId) {\n this.setSelectedMenuItem(matchingItem.id);\n }\n });\n\n effect(() => {\n if (!this.isMobile() && this.mobileMenuOpen()) {\n this.mobileMenuOpen.set(false);\n }\n });\n\n effect(() => {\n const key = this.zKey();\n const activeKey = untracked(() => this._activeCacheKey());\n if (key === activeKey) {\n return;\n }\n\n this._activeCacheKey.set(key);\n this.sidebarCollapsed.set(this._getStateMenuCollapsed(key));\n });\n\n effect(() => {\n const key = this._activeCacheKey();\n if (!key) {\n return;\n }\n\n ZCacheService.set(key, this.sidebarCollapsed());\n });\n\n setTimeout(() => this._emitControl());\n }\n\n public openMobileMenu(): void {\n this.mobileMenuOpen.set(true);\n }\n\n public closeMobileMenu(): void {\n this.mobileMenuOpen.set(false);\n }\n\n public toggleMobileMenu(): void {\n this.mobileMenuOpen.set(!this.mobileMenuOpen());\n }\n\n public setSelectedMenuItem(menuId: string): void {\n const item = this.menuProcessed().flat.get(menuId);\n if (!item) {\n return;\n }\n\n this.selectedMenuItem.set(item);\n this._expandParentsOfItem(item);\n\n if (!item.parent?.length) {\n this.selectedParent.set(item);\n return;\n }\n\n const topLevelParent = this.menuProcessed().flat.get(item.parent[0]);\n this.selectedParent.set(topLevelParent ?? null);\n }\n\n public clearActiveItem(): void {\n this.selectedMenuItem.set(null);\n }\n\n protected toggleSidebar(): void {\n this.sidebarCollapsed.set(!this.sidebarCollapsed());\n }\n\n protected onMenuItemClick(item: ZMenuItem): void {\n const hasChildren = !!item.children?.length;\n if (hasChildren) {\n this._toggleExpanded(item.id);\n this.selectedParent.set(item);\n return;\n }\n\n this._selectLeafItem(item);\n }\n\n protected onCollapsedLeafClick(item: ZMenuItem, close: () => void): void {\n this._selectLeafItem(item);\n close();\n }\n\n protected onCollapsedParentClick(item: ZMenuItem): void {\n this.selectedParent.set(item);\n }\n\n protected onMobileBackdropClick(): void {\n this.closeMobileMenu();\n }\n\n protected onUserActionClick(action: ZMenuUserAction): void {\n if (action.disabled) {\n return;\n }\n\n this.zOnMenuAction.emit(action);\n }\n\n private _emitControl(): void {\n this.zControl.emit({\n openMobileMenu: () => this.openMobileMenu(),\n closeMobileMenu: () => this.closeMobileMenu(),\n toggleMobileMenu: () => this.toggleMobileMenu(),\n setSelectedMenuItem: (id: string) => this.setSelectedMenuItem(id),\n clearActiveItem: () => this.clearActiveItem(),\n toggleSidebar: () => this.toggleSidebar(),\n sidebarCollapsed: this.sidebarCollapsed.asReadonly(),\n mobileMenuOpen: this.mobileMenuOpen.asReadonly(),\n selectedMenuItem: this.selectedMenuItem.asReadonly(),\n selectedParent: this.selectedParent.asReadonly(),\n menuProcessed: this.menuProcessed,\n });\n }\n\n private _selectLeafItem(item: ZMenuItem): void {\n this.selectedMenuItem.set(item);\n this._expandParentsOfItem(item);\n\n if (!item.parent?.length) {\n this.selectedParent.set(item);\n }\n\n if (item.parent?.length) {\n const topLevelParent = this.menuProcessed().flat.get(item.parent[0]);\n this.selectedParent.set(topLevelParent ?? null);\n }\n\n const processedItem = this.menuProcessed().flat.get(item.id);\n if (processedItem) {\n this.zOnSelect.emit(processedItem);\n }\n\n if (this.isMobile()) {\n this.closeMobileMenu();\n }\n }\n\n private _toggleExpanded(id: string): void {\n const currentlyExpanded = this.menuProcessed().flat.get(id)?.expanded ?? false;\n if (currentlyExpanded) {\n this._expandedIds.update(current => {\n const next = new Set(current);\n next.delete(id);\n return next;\n });\n\n this._collapsedIds.update(current => {\n const next = new Set(current);\n next.add(id);\n return next;\n });\n return;\n }\n\n this._collapsedIds.update(current => {\n const next = new Set(current);\n next.delete(id);\n return next;\n });\n\n this._expandedIds.update(current => {\n const next = new Set(current);\n next.add(id);\n return next;\n });\n }\n\n private _expandParentsOfItem(item: ZMenuItem): void {\n if (!item.parent?.length) {\n return;\n }\n\n this._expandedIds.update(current => {\n const next = new Set(current);\n for (const parentId of item.parent ?? []) {\n next.add(parentId);\n }\n return next;\n });\n\n this._collapsedIds.update(current => {\n const next = new Set(current);\n for (const parentId of item.parent ?? []) {\n next.delete(parentId);\n }\n return next;\n });\n }\n\n private _processMenus(menus: ZMenuV2Item[], expandedIds: Set<string>, collapsedIds: Set<string>): ZMenuProcessed {\n const flat = new Map<string, ZMenuItem>();\n const pathMap = new Map<string, ZMenuItem>();\n const subPathMap = new Map<string, ZMenuItem>();\n const parentMap = new Map<string, ZMenuItem>();\n\n const processItem = (item: ZMenuV2Item, parentIds: string[], level: number): ZMenuItem => {\n const children =\n level < 2 ? item.children?.map(child => processItem(child, [...parentIds, item.id], level + 1)) : undefined;\n const processedItem: ZMenuItem = {\n active: item.active,\n children: children,\n expanded: expandedIds.has(item.id) || (!!item.expanded && !collapsedIds.has(item.id)),\n icon: item.icon,\n iconSvg: item.iconSvg,\n id: item.id,\n level,\n name: item.name,\n parent: [...parentIds],\n path: item.path,\n permission: item.permission,\n projects: item.projects,\n subPaths: item.subPaths,\n };\n\n flat.set(processedItem.id, processedItem);\n\n if (processedItem.path) {\n const normalizedPath = processedItem.path.replace(/\\/$/, '') || '/';\n pathMap.set(normalizedPath, processedItem);\n }\n\n if (processedItem.subPaths?.length) {\n for (const subPath of processedItem.subPaths) {\n const normalizedSubPath = subPath.replace(/\\/$/, '');\n subPathMap.set(normalizedSubPath, processedItem);\n }\n }\n\n if (children?.length) {\n for (const child of children) {\n parentMap.set(child.id, processedItem);\n }\n }\n\n return processedItem;\n };\n\n const tree = menus.map(item => processItem(item, [], 0));\n return { tree, flat, pathMap, subPathMap, parentMap };\n }\n\n private _findMenuItemByPath(path: string, processed: ZMenuProcessed): ZMenuItem | null {\n const normalizedPath = path.split('?')[0].replace(/\\/$/, '') || '/';\n const exactMatch = processed.pathMap.get(normalizedPath);\n if (exactMatch) {\n return exactMatch;\n }\n\n const subPathMatch = processed.subPathMap.get(normalizedPath);\n if (subPathMatch) {\n return subPathMatch;\n }\n\n const deepestSubPathMatch = this._findDeepestPrefixMatch(normalizedPath, processed.subPathMap);\n if (deepestSubPathMatch) {\n return deepestSubPathMatch;\n }\n\n const deepestPathMatch = this._findDeepestPrefixMatch(normalizedPath, processed.pathMap);\n if (deepestPathMatch) {\n return deepestPathMatch;\n }\n\n return null;\n }\n\n private _findDeepestPrefixMatch(normalizedPath: string, pathMap: Map<string, ZMenuItem>): ZMenuItem | null {\n let bestMatch: ZMenuItem | null = null;\n let bestPathLength = 0;\n\n for (const [itemPath, item] of pathMap.entries()) {\n if (!itemPath || itemPath === '/' || !normalizedPath.startsWith(itemPath + '/')) {\n continue;\n }\n\n if (itemPath.length <= bestPathLength) {\n continue;\n }\n\n bestMatch = item;\n bestPathLength = itemPath.length;\n }\n\n return bestMatch;\n }\n\n private _getStateMenuCollapsed(key: string): boolean {\n return ZCacheService.get<boolean>(key, false) ?? false;\n }\n}\n","<aside\n class=\"hidden h-full min-h-0 flex-col overflow-hidden border-r shadow-sm md:flex\"\n [class]=\"zClasses()\"\n [style.--z-menu-v2-expanded-width.px]=\"zExpandedWidth()\"\n [style.--z-menu-v2-collapsed-width.px]=\"zCollapsedWidth()\">\n <div\n class=\"border-sidebar-border flex h-14 shrink-0 items-center gap-2 border-b px-3\"\n [class.justify-center]=\"sidebarCollapsed()\">\n @if (!sidebarCollapsed() && zLogo()) {\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto shrink-0 object-contain transition-opacity\" />\n }\n\n @if (!sidebarCollapsed()) {\n <div class=\"min-w-0 flex-1 overflow-hidden text-sm font-semibold text-ellipsis whitespace-nowrap\">\n {{ 'i18n_z_ui_menu_navigation' | translate }}\n </div>\n }\n\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"z-menu-v2-toggle h-9 w-9 shrink-0\"\n [class.z-menu-v2-toggle-collapsed]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"\n (sidebarCollapsed() ? 'i18n_z_ui_menu_expand_sidebar' : 'i18n_z_ui_menu_collapse_sidebar') | translate\n \"\n (click)=\"toggleSidebar()\">\n <z-icon [zType]=\"sidebarCollapsed() ? 'lucidePanelLeftOpen' : 'lucidePanelLeftClose'\" zSize=\"18\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar min-h-0 flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-2\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n @if (sidebarCollapsed() && parentHasChildren) {\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"parentPopoverTpl\"\n zPopoverWidth=\"auto\"\n zPosition=\"right-top\"\n [zOffset]=\"10\"\n class=\"z-menu-v2-icon-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n [attr.aria-label]=\"parent.name | translate\"\n (click)=\"onCollapsedParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"20\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"20\" />\n }\n </button>\n\n <ng-template #parentPopoverTpl let-close=\"close\">\n <div class=\"z-menu-v2-popover min-w-60 p-1\">\n <div class=\"text-muted-foreground flex items-center gap-2 px-2 py-2 text-xs font-medium\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"15\" />\n }\n <span class=\"overflow-hidden text-ellipsis whitespace-nowrap\">{{ parent.name | translate }}</span>\n </div>\n <ng-container\n *ngTemplateOutlet=\"collapsedChildrenTpl; context: { $implicit: parent.children, close: close }\" />\n </div>\n </ng-template>\n }\n @if (!(sidebarCollapsed() && parentHasChildren)) {\n <ng-container *ngTemplateOutlet=\"openParentTpl; context: { $implicit: parent }\" />\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"userFooterTpl\" />\n</aside>\n\n<ng-template #openParentTpl let-parent>\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentLeafActive\"\n [class.parent-active]=\"parentActive && !parentLeafActive\"\n [class.icon-only]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? (parent.name | translate) : null\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n }\n </button>\n\n @if (!sidebarCollapsed() && parentHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.expanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #collapsedChildrenTpl let-children let-close=\"close\">\n <div class=\"z-menu-v2-submenu z-menu-v2-popover-tree\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"childHasChildren ? onMenuItemClick(child) : onCollapsedLeafClick(child, close)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren) {\n <div class=\"z-menu-v2-submenu-panel collapsed-popover\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"subChildActive\"\n (click)=\"onCollapsedLeafClick(subChild, close)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #userFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-2\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n [zOffset]=\"10\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\"\n [class.justify-center]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? zUser()?.name || 'User Name' : null\">\n <span class=\"h-9 w-9 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n }\n </button>\n </div>\n</ng-template>\n\n<ng-template #mobileUserFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-3\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"top-right\"\n [zOffset]=\"8\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\">\n <span class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n </button>\n </div>\n</ng-template>\n\n<ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"overflow-hidden font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground mt-0.5 overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n\n @if (visibleUserActions().length > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n @for (action of visibleUserActions(); track action.id; let idx = $index) {\n @if (action.divide === 'before' && idx > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (action.divide === 'after' && idx < visibleUserActions().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #openChildrenTpl let-children>\n <div class=\"z-menu-v2-submenu\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-child\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-sub-child\"\n [class.active]=\"subChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<div\n class=\"z-menu-v2-mobile-bar border-border bg-background flex h-14 items-center justify-between border-b px-4 md:hidden\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"openMobileMenu()\">\n <z-icon zType=\"lucideMenu\" zSize=\"20\" />\n </button>\n</div>\n\n@if (mobileMenuOpen()) {\n <div\n class=\"z-menu-v2-backdrop fixed inset-0 z-9998 md:hidden\"\n [class.z-menu-v2-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-v2-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onMobileBackdropClick()\"></div>\n}\n\n<aside\n class=\"z-menu-v2-mobile-drawer bg-sidebar text-sidebar-foreground border-sidebar-border fixed top-0 left-0 z-9999 flex h-full w-72 max-w-[calc(100vw-1rem)] flex-col border-r md:hidden\"\n [class.open]=\"mobileMenuOpen()\">\n <div class=\"border-sidebar-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-3\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n </button>\n\n @if (parentHasChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.expanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"mobileUserFooterTpl\" />\n</aside>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"shival99-z-ui-components-z-menu.mjs","sources":["../../../../libs/core-ui/components/z-menu/z-menu.component.ts","../../../../libs/core-ui/components/z-menu/z-menu.component.html","../../../../libs/core-ui/components/z-menu/z-menu-v2.component.ts","../../../../libs/core-ui/components/z-menu/z-menu-v2.component.html","../../../../libs/core-ui/components/z-menu/shival99-z-ui-components-z-menu.ts"],"sourcesContent":["import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';\nimport { isPlatformBrowser, NgTemplateOutlet } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n DestroyRef,\n effect,\n inject,\n input,\n output,\n PLATFORM_ID,\n signal,\n TemplateRef,\n untracked,\n ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { NavigationEnd, Router } from '@angular/router';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZCacheService } from '@shival99/z-ui/services';\nimport { zDetectBrowser } from '@shival99/z-ui/utils';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport { filter, map, startWith } from 'rxjs';\nimport { ZMenuControl, ZMenuItem, ZMenuOverlayType, ZMenuProcessed, ZMenuUser, ZMenuUserAction } from './z-menu.types';\n\n@Component({\n selector: 'z-menu',\n imports: [\n NgTemplateOutlet,\n ZButtonComponent,\n ZIconComponent,\n ZTooltipDirective,\n ZPopoverDirective,\n NgScrollbar,\n TranslatePipe,\n ],\n standalone: true,\n templateUrl: './z-menu.component.html',\n styleUrl: './z-menu.component.scss',\n providers: [TranslatePipe],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-menu block',\n '[class.z-menu-collapsed]': 'sidebarCollapsed()',\n '[class.z-menu-no-child]': 'selectedParentHasNoChild()',\n '[class.z-menu-mobile]': 'isMobile()',\n '[class.z-menu-mobile-open]': 'mobileMenuOpen()',\n },\n})\nexport class ZMenuComponent {\n private readonly _breakpointObserver = inject(BreakpointObserver);\n private readonly _destroyRef = inject(DestroyRef);\n private readonly _platformId = inject(PLATFORM_ID);\n private readonly _router = inject(Router);\n\n public readonly zOnSelect = output<ZMenuItem>();\n public readonly zOnMenuAction = output<ZMenuUserAction>();\n public readonly zControl = output<ZMenuControl>();\n\n public readonly zLogo = input<string>('assets/images/avatar.svg');\n public readonly zLogoMobile = input<string>('');\n public readonly zMenus = input<ZMenuItem[]>([]);\n public readonly zUser = input<ZMenuUser | null>(null);\n public readonly zUserActions = input<ZMenuUserAction[]>([]);\n public readonly zActionsTemplate = input<TemplateRef<{ close: () => void }> | null>(null);\n public readonly zCurrentPath = input<string>('');\n public readonly zKey = input<string>('z-menu');\n\n public readonly selectedParent = signal<ZMenuItem | null>(null);\n public readonly selectedMenuItem = signal<ZMenuItem | null>(null);\n public readonly mobileMenuOpen = signal(false);\n public readonly mobileTemplateDrawerOpen = signal(false);\n public readonly sidebarCollapsed = signal(this._getStateMenuCollapsed());\n private readonly _templateDrawerParentId = signal<string | null>(null);\n\n protected readonly closeSidebarFn = (): void => this.sidebarCollapsed.set(true);\n protected readonly closeMobileDrawerFn = (): void => {\n this.mobileTemplateDrawerOpen.set(false);\n this._templateDrawerParentId.set(null);\n };\n\n private readonly _isMobile$ = this._breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.Small]).pipe(\n map(result => result.matches),\n takeUntilDestroyed(this._destroyRef)\n );\n\n public readonly isMobile = toSignal(this._isMobile$, { initialValue: false });\n protected readonly mobileLogo = computed(() => this.zLogoMobile() || this.zLogo());\n\n private readonly _routerPath = toSignal(\n this._router.events.pipe(\n filter((e): e is NavigationEnd => e instanceof NavigationEnd),\n map(e => e.urlAfterRedirects),\n startWith(this._router.url)\n ),\n { initialValue: this._router.url }\n );\n\n private readonly _currentPath = computed(() => this.zCurrentPath() || this._routerPath());\n protected readonly overlayType = computed((): ZMenuOverlayType => {\n if (!isPlatformBrowser(this._platformId)) {\n return 'dark';\n }\n\n const browser = zDetectBrowser();\n return browser.name === 'Chrome' ? 'dark' : 'blur';\n });\n\n protected readonly menuProcessed = computed((): ZMenuProcessed => this._processMenus(this.zMenus()));\n\n protected readonly menuParents = computed(() =>\n this.menuProcessed().tree.filter((item: ZMenuItem) => !item.parent || item.parent.length === 0)\n );\n\n protected readonly menuChildren = computed(() => {\n const selected = this.selectedParent();\n if (!selected) {\n return [];\n }\n return selected.children ?? [];\n });\n\n protected readonly selectedParentHasNoChild = computed(() => {\n const parent = this.selectedParent();\n if (!parent) {\n return false;\n }\n const hasNoChildren = !parent.children || parent.children.length === 0;\n return !parent.menuTemplate && hasNoChildren;\n });\n\n protected readonly parentWithActiveChild = computed(() => {\n const activeItem = this.selectedMenuItem();\n if (!activeItem) {\n return null;\n }\n\n const parents = this.menuParents();\n\n for (const parent of parents) {\n const hasNoChildren = !parent.children || parent.children.length === 0;\n if ((parent.menuTemplate || hasNoChildren) && activeItem.id === parent.id) {\n return parent;\n }\n }\n\n if (activeItem.parent && activeItem.parent.length > 0) {\n const topLevelParentId = activeItem.parent[0];\n return parents.find(p => p.id === topLevelParentId) || null;\n }\n\n return null;\n });\n\n protected isParentOfActiveItem(item: ZMenuItem): boolean {\n const activeItem = this.selectedMenuItem();\n if (!activeItem) {\n return false;\n }\n\n if (activeItem.parent && activeItem.parent.length > 0) {\n return activeItem.parent.includes(item.id);\n }\n\n return false;\n }\n\n protected readonly avatarSrc = computed(() => this.zUser()?.avatar || this.zLogo());\n\n protected readonly customDrawerParent = computed(() => {\n const parentId = this._templateDrawerParentId();\n if (!parentId) {\n return null;\n }\n return this.menuParents().find((p: ZMenuItem) => p.id === parentId) ?? null;\n });\n\n private readonly _defaultSidebarChildWidth = 230;\n private readonly _defaultMobileDrawerWidth = 280;\n\n protected readonly sidebarChildWidth = computed(() => {\n const parent = this.selectedParent();\n if (parent?.menuTemplate && parent.menuTemplateWidth) {\n return parent.menuTemplateWidth;\n }\n return this._defaultSidebarChildWidth;\n });\n\n protected readonly mobileCustomDrawerWidth = computed(() => {\n const parent = this.customDrawerParent();\n if (parent?.menuTemplateWidth) {\n return parent.menuTemplateWidth;\n }\n return this._defaultMobileDrawerWidth;\n });\n\n constructor() {\n effect(() => {\n const parents = this.menuParents();\n if (parents.length > 0 && !untracked(() => this.selectedParent())) {\n this.selectedParent.set(parents[0]);\n }\n });\n\n effect(() => {\n const currentPath = this._currentPath();\n const processedMenus = this.menuProcessed();\n if (!currentPath || processedMenus.flat.size === 0) {\n return;\n }\n\n const matchingItem = this._findMenuItemByPath(currentPath, processedMenus);\n const currentSelectedId = untracked(() => this.selectedMenuItem()?.id);\n if (matchingItem && matchingItem.id !== currentSelectedId) {\n this.setSelectedMenuItem(matchingItem.id);\n }\n });\n\n effect(() => {\n if (!this.isMobile() && this.mobileMenuOpen()) {\n this.mobileMenuOpen.set(false);\n }\n });\n\n effect(() => {\n const collapsed = this.sidebarCollapsed();\n ZCacheService.set(this.zKey(), collapsed);\n });\n\n setTimeout(() => this._emitControl());\n }\n\n private _emitControl(): void {\n this.zControl.emit({\n openMobileMenu: () => this.openMobileMenu(),\n closeMobileMenu: () => this.closeMobileMenu(),\n toggleMobileMenu: () => this.toggleMobileMenu(),\n setSelectedMenuItem: (id: string) => this.setSelectedMenuItem(id),\n clearActiveItem: () => this.clearActiveItem(),\n toggleSidebar: () => this.toggleSidebar(),\n openMobileTemplateDrawer: (id: string) => this.openMobileTemplateDrawer(id),\n closeMobileTemplateDrawer: () => this.closeMobileTemplateDrawer(),\n sidebarCollapsed: this.sidebarCollapsed.asReadonly(),\n mobileMenuOpen: this.mobileMenuOpen.asReadonly(),\n mobileTemplateDrawerOpen: this.mobileTemplateDrawerOpen.asReadonly(),\n selectedMenuItem: this.selectedMenuItem.asReadonly(),\n selectedParent: this.selectedParent.asReadonly(),\n menuProcessed: this.menuProcessed,\n });\n }\n\n public openMobileMenu(): void {\n this.mobileMenuOpen.set(true);\n }\n\n public closeMobileMenu(): void {\n this.mobileMenuOpen.set(false);\n }\n\n public toggleMobileMenu(): void {\n this.mobileMenuOpen.set(!this.mobileMenuOpen());\n }\n\n public openMobileTemplateDrawer(parentId: string): void {\n this._templateDrawerParentId.set(parentId);\n this.mobileMenuOpen.set(false);\n requestAnimationFrame(() => {\n this.mobileTemplateDrawerOpen.set(true);\n });\n }\n\n public closeMobileTemplateDrawer(): void {\n this.mobileTemplateDrawerOpen.set(false);\n this.mobileMenuOpen.set(true);\n setTimeout(() => {\n this._templateDrawerParentId.set(null);\n }, 300);\n }\n\n public setSelectedMenuItem(menuId: string): void {\n const item = this._findMenuItemById(menuId);\n if (!item) {\n return;\n }\n\n this.selectedMenuItem.set(item);\n\n if (item.parent && item.parent.length > 0) {\n const topLevelParentId = item.parent[0];\n const topLevelParent = this._findMenuItemById(topLevelParentId);\n if (topLevelParent) {\n this.selectedParent.set(topLevelParent);\n topLevelParent.expanded = true;\n }\n\n for (const parentId of item.parent) {\n const parentItem = this._findMenuItemById(parentId);\n if (parentItem) {\n parentItem.expanded = true;\n }\n }\n return;\n }\n\n const parent = this._findParentOfMenuItem(menuId);\n if (parent) {\n this.selectedParent.set(parent);\n parent.expanded = true;\n }\n }\n\n public clearActiveItem(): void {\n this.selectedMenuItem.set(null);\n }\n\n protected selectParent(item: ZMenuItem): void {\n this.selectedParent.set(item);\n const hasNoChildren = !item.children || item.children.length === 0;\n\n if (item.menuTemplate || hasNoChildren) {\n this.selectedMenuItem.set(item);\n }\n\n const processedItem = this.menuProcessed().flat.get(item.id);\n if (processedItem) {\n this.zOnSelect.emit(processedItem);\n }\n }\n\n protected onDesktopParentClick(item: ZMenuItem): void {\n this.selectParent(item);\n const hasChildrenOrTemplate = item.menuTemplate || (item.children && item.children.length > 0);\n\n if (this.sidebarCollapsed() && hasChildrenOrTemplate) {\n this.toggleSidebar();\n }\n }\n\n protected onMenuItemClick(item: ZMenuItem): void {\n if (item.children && item.children.length > 0) {\n item.expanded = !item.expanded;\n return;\n }\n\n this.selectedMenuItem.set(item);\n this._expandParentsOfItem(item);\n\n const processedItem = this.menuProcessed().flat.get(item.id);\n if (processedItem) {\n this.zOnSelect.emit(processedItem);\n }\n\n if (this.isMobile()) {\n this.closeMobileMenu();\n this.mobileTemplateDrawerOpen.set(false);\n }\n }\n\n protected onMobileParentClick(item: ZMenuItem): void {\n if (item.menuTemplate) {\n this.selectParent(item);\n this.openMobileTemplateDrawer(item.id);\n return;\n }\n\n const hasNoChildren = !item.children || item.children.length === 0;\n if (hasNoChildren) {\n this.selectParent(item);\n this.closeMobileMenu();\n return;\n }\n\n if (this.selectedParent()?.id === item.id) {\n item.expanded = !item.expanded;\n this.selectedParent.set({ ...item });\n return;\n }\n\n this.selectParent(item);\n item.expanded = true;\n }\n\n protected toggleSidebar(): void {\n if (!this.selectedParent()?.children?.length) {\n return;\n }\n\n this.sidebarCollapsed.set(!this.sidebarCollapsed());\n }\n\n protected closeSidebar(): void {\n this.sidebarCollapsed.set(true);\n }\n\n protected onUserActionClick(action: ZMenuUserAction): void {\n if (action.disabled) {\n return;\n }\n this.zOnMenuAction.emit(action);\n }\n\n protected getVisibleUserActions(): ZMenuUserAction[] {\n return this.zUserActions().filter(action => !action.hidden);\n }\n\n protected shouldShowDividerBefore(action: ZMenuUserAction, index: number): boolean {\n return action.divide === 'before' && index > 0;\n }\n\n protected shouldShowDividerAfter(action: ZMenuUserAction, index: number): boolean {\n return action.divide === 'after' && index < this.getVisibleUserActions().length - 1;\n }\n\n protected onBackdropClick(): void {\n if (this.mobileTemplateDrawerOpen()) {\n this.mobileTemplateDrawerOpen.set(false);\n this._templateDrawerParentId.set(null);\n }\n this.closeMobileMenu();\n }\n\n private _findMenuItemById(id: string): ZMenuItem | null {\n return this.menuProcessed().flat.get(id) ?? null;\n }\n\n private _findParentOfMenuItem(id: string): ZMenuItem | null {\n const directParent = this.menuProcessed().parentMap.get(id);\n if (directParent) {\n return directParent;\n }\n\n const item = this.menuProcessed().flat.get(id);\n if (!item?.parent?.length) {\n return null;\n }\n\n const parentId = item.parent[item.parent.length - 1];\n return this.menuProcessed().flat.get(parentId) ?? null;\n }\n\n private _isChildOf(childId: string, parent: ZMenuItem): boolean {\n const child = this.menuProcessed().flat.get(childId);\n if (!child?.parent?.length) {\n return false;\n }\n\n return child.parent.includes(parent.id);\n }\n\n private _expandParentsOfItem(item: ZMenuItem): void {\n if (!item.parent || item.parent.length === 0) {\n return;\n }\n\n for (const parentId of item.parent) {\n const parentItem = this.menuProcessed().flat.get(parentId);\n if (parentItem) {\n parentItem.expanded = true;\n }\n }\n }\n\n private _processMenus(menus: ZMenuItem[]): ZMenuProcessed {\n const flat = new Map<string, ZMenuItem>();\n const pathMap = new Map<string, ZMenuItem>();\n const subPathMap = new Map<string, ZMenuItem>();\n const parentMap = new Map<string, ZMenuItem>();\n\n const processItem = (item: ZMenuItem, parentIds: string[], level: number): ZMenuItem => {\n item.parent = [...parentIds];\n item.level = level;\n flat.set(item.id, item);\n\n if (item.path) {\n const normalizedPath = item.path.replace(/\\/$/, '') || '/';\n pathMap.set(normalizedPath, item);\n }\n\n if (item.subPaths && item.subPaths.length > 0) {\n for (const subPath of item.subPaths) {\n const normalizedSubPath = subPath.replace(/\\/$/, '');\n subPathMap.set(normalizedSubPath, item);\n }\n }\n\n if (item.children && item.children.length > 0) {\n const newParentIds = [...parentIds, item.id];\n for (const child of item.children) {\n parentMap.set(child.id, item);\n }\n\n item.children = item.children.map(child => processItem(child, newParentIds, level + 1));\n }\n\n return item;\n };\n\n const tree = menus.map(item => processItem(item, [], 0));\n return { tree, flat, pathMap, subPathMap, parentMap };\n }\n\n private _findMenuItemByPath(path: string, processed: ZMenuProcessed): ZMenuItem | null {\n const normalizedPath = path.split('?')[0].replace(/\\/$/, '') || '/';\n const exactMatch = processed.pathMap.get(normalizedPath);\n if (exactMatch) {\n return exactMatch;\n }\n\n const subPathMatch = processed.subPathMap.get(normalizedPath);\n if (subPathMatch) {\n return subPathMatch;\n }\n\n for (const [subPath, item] of processed.subPathMap.entries()) {\n if (normalizedPath.startsWith(subPath + '/')) {\n return item;\n }\n }\n\n for (const [itemPath, item] of processed.pathMap.entries()) {\n if (itemPath && itemPath !== '/' && normalizedPath.startsWith(itemPath + '/')) {\n return item;\n }\n }\n\n return null;\n }\n\n private _getStateMenuCollapsed(): boolean {\n return ZCacheService.get<boolean>(this.zKey(), false) ?? false;\n }\n}\n","<!-- DESKTOP LAYOUT - Hidden on mobile -->\n<div class=\"z-menu-desktop relative z-200 hidden h-full py-1 pl-1 md:block\" [class.collapsed]=\"sidebarCollapsed()\">\n <main class=\"z-menu-main relative flex h-full\">\n <div class=\"z-sidebar-main h-full w-[3.125rem]\">\n <div\n class=\"z-shadow-menu bg-sidebar border-border/40 dark:border-sidebar-border relative flex h-full w-full flex-col items-center gap-1.5 rounded-[0.375rem] border\"></div>\n\n <div class=\"bg-sidebar text-sidebar-foreground absolute inset-px z-20 flex flex-col rounded-[0.375rem]\">\n @if (zLogo()) {\n <div class=\"border-sidebar-border flex h-[3.25rem] items-center justify-center border-b px-2\">\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n </div>\n }\n\n <!-- Expand Button - Only show when collapsed -->\n @if (sidebarCollapsed() && selectedParent()) {\n <div\n class=\"z-expand-btn hover:bg-sidebar-accent mx-auto mt-2 flex h-9 w-9 cursor-pointer items-center justify-center rounded-[0.375rem]\"\n (click)=\"toggleSidebar()\">\n <z-icon zType=\"lucideChevronsRight\" zSize=\"20\" class=\"opacity-70\" />\n </div>\n }\n\n <div class=\"flex flex-1 flex-col items-center gap-2 p-2\">\n @for (item of menuParents(); track item.id) {\n @let hasActiveChild = parentWithActiveChild()?.id === item.id;\n @let isCurrentlySelected = selectedParent()?.id === item.id;\n @let showActiveIndicator = hasActiveChild && !isCurrentlySelected;\n <div\n zTooltip\n [zContent]=\"item.name | translate\"\n zPosition=\"right\"\n [zArrow]=\"false\"\n [zAlwaysShow]=\"true\"\n class=\"relative flex h-9 w-9 cursor-pointer items-center justify-center rounded-[0.375rem] select-none\"\n [class.bg-sidebar-primary]=\"selectedParent()?.id === item.id\"\n [class.text-sidebar-primary-foreground]=\"selectedParent()?.id === item.id\"\n [class.hover:bg-sidebar-accent]=\"selectedParent()?.id !== item.id\"\n (click)=\"onDesktopParentClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"20\" />\n } @else {\n <z-icon [zSvg]=\"item.iconSvg || ''\" zSize=\"20\" />\n }\n @if (showActiveIndicator) {\n <div\n class=\"bg-sidebar-primary absolute top-1/2 -left-[0.3125rem] h-4 w-1 -translate-y-1/2 rounded-full\"></div>\n }\n </div>\n }\n </div>\n\n <div class=\"border-sidebar-border flex items-center justify-center border-t p-2\">\n <div\n z-popover\n [zOffset]=\"11\"\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n class=\"aspect-square h-9 w-9 shrink-0 cursor-pointer overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <!-- User Info Header - Always shown -->\n <div class=\"p-0 text-sm font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-medium\">{{ zUser()?.name || 'User Name' }}</span>\n <span class=\"text-muted-foreground mt-0.5 truncate text-xs\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n </div>\n\n @if (getVisibleUserActions().length > 0 || zActionsTemplate()) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Actions - Custom or from zUserActions -->\n @if (zActionsTemplate()) {\n <ng-container *ngTemplateOutlet=\"zActionsTemplate(); context: { close: close }\" />\n } @else if (getVisibleUserActions().length > 0) {\n @for (action of getVisibleUserActions(); track action.id; let idx = $index) {\n @if (shouldShowDividerBefore(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (shouldShowDividerAfter(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n }\n </div>\n </ng-template>\n\n @if (selectedParent(); as parent) {\n @let hasChildrenOrTemplate = parent.menuTemplate || (parent.children && parent.children.length > 0);\n @if (hasChildrenOrTemplate) {\n <div\n class=\"z-sidebar-child-wrapper\"\n [class.collapsed]=\"sidebarCollapsed()\"\n [style.--sidebar-child-width.px]=\"sidebarChildWidth()\">\n <div\n class=\"z-sidebar-child z-shadow-menu bg-card text-card-foreground border-border/40 dark:border-sidebar-border flex h-full shrink-0 flex-col items-start overflow-hidden rounded-[0.375rem] border\"\n [style.width.px]=\"sidebarChildWidth()\"\n [class.collapsed]=\"sidebarCollapsed()\">\n <div class=\"border-border flex h-[3.25rem] w-full shrink-0 items-center border-b px-3\">\n @if (selectedParent()?.icon) {\n <z-icon [zType]=\"selectedParent()!.icon\" zSize=\"20\" class=\"mr-2 shrink-0\" />\n }\n <div\n class=\"mr-4 min-w-0 flex-1 truncate text-base font-semibold\"\n zTooltip\n zPosition=\"top-left\"\n [zContent]=\"selectedParent()?.name || '' | translate\"\n [zArrow]=\"false\">\n {{ selectedParent()?.name | translate }}\n </div>\n\n <z-icon\n zType=\"lucidePanelRightOpen\"\n zSize=\"20\"\n class=\"shrink-0 cursor-pointer opacity-60 hover:opacity-100\"\n (click)=\"toggleSidebar()\" />\n </div>\n\n <!-- Show menuTemplate if available, otherwise show children -->\n @if (selectedParent()?.menuTemplate) {\n <ng-scrollbar class=\"z-menu-scrollbar min-h-0 w-full flex-1\" track=\"vertical\">\n <div class=\"flex w-full flex-col p-3 pr-2\">\n <ng-container\n *ngTemplateOutlet=\"\n selectedParent()!.menuTemplate!;\n context: { $implicit: selectedParent()!, close: closeSidebarFn }\n \" />\n </div>\n </ng-scrollbar>\n } @else {\n <ng-scrollbar class=\"z-menu-scrollbar min-h-0 w-full flex-1 overflow-hidden\" track=\"vertical\">\n <div class=\"flex w-full min-w-0 flex-col gap-1 overflow-hidden py-1 pr-2 pl-2\">\n <ng-container *ngTemplateOutlet=\"menuChildrenTpl; context: { $implicit: menuChildren() }\" />\n </div>\n </ng-scrollbar>\n }\n </div>\n </div>\n }\n }\n </main>\n</div>\n\n<!-- MOBILE LAYOUT - Visible only on mobile -->\n<div class=\"z-menu-mobile-wrapper hidden max-md:block\">\n <!-- Mobile Backdrop -->\n @if (mobileMenuOpen() || mobileTemplateDrawerOpen()) {\n <div\n class=\"z-menu-backdrop fixed inset-0 z-9998\"\n [class.z-menu-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onBackdropClick()\"></div>\n }\n\n <!-- Mobile Drawer -->\n <aside\n class=\"z-menu-drawer bg-background border-border fixed top-0 left-0 z-9999 flex h-full w-70 flex-col rounded-r-lg border-r\"\n [class.open]=\"mobileMenuOpen()\">\n <!-- Drawer Header -->\n <div class=\"border-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"bg-accent h-9 w-9 shrink-0\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <!-- Drawer Content - Accordion Menu -->\n <ng-scrollbar class=\"z-menu-scrollbar flex-1\" track=\"vertical\">\n <div class=\"p-3\">\n @for (parent of menuParents(); track parent.id) {\n <div class=\"mb-1\">\n <!-- Parent Item -->\n @let isParentActive =\n selectedMenuItem()?.id === parent.id && (!parent.children || parent.children.length === 0);\n @let hasActiveChild = parentWithActiveChild()?.id === parent.id && !isParentActive;\n @let isCurrentlyViewing = selectedParent()?.id === parent.id;\n <div\n class=\"relative flex cursor-pointer items-center gap-3 rounded-[0.375rem] p-2\"\n [class.bg-primary/20]=\"isParentActive\"\n [class.text-primary]=\"isParentActive || hasActiveChild\"\n [class.hover:bg-accent]=\"!isParentActive\"\n (click)=\"onMobileParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n } @else if (parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\">{{ parent.name | translate }}</span>\n @if ((parent.children && parent.children.length > 0) || parent.menuTemplate) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"16\"\n class=\"z-menu-arrow shrink-0 opacity-60 transition-transform\"\n [class.expanded]=\"parent.expanded && isCurrentlyViewing\" />\n }\n </div>\n\n <!-- Children (Accordion) - Only render if NO menuTemplate -->\n @if (parent.children && parent.children.length > 0 && !parent.menuTemplate) {\n <div class=\"z-menu-submenu\" [class.expanded]=\"parent.expanded && isCurrentlyViewing\">\n <div class=\"z-menu-submenu-inner\">\n <div class=\"z-menu-tree relative ml-4 flex flex-col gap-1 pt-1 pl-3\">\n <div class=\"absolute top-0 bottom-2 left-0 w-px bg-gray-300 dark:bg-gray-600\"></div>\n\n @for (child of parent.children; track child.id) {\n @let isChildActive =\n selectedMenuItem()?.id === child.id && (!child.children || child.children.length === 0);\n @let isChildParentOfActive = isParentOfActiveItem(child);\n @let hasChildren = child.children && child.children.length > 0;\n\n <div>\n <div\n class=\"relative flex cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isChildActive\"\n [class.text-primary-foreground]=\"isChildActive\"\n [class.text-primary]=\"isChildParentOfActive && !isChildActive\"\n [class.hover:bg-accent]=\"!isChildActive\"\n (click)=\"onMenuItemClick(child)\">\n <div class=\"absolute top-1/2 -left-3 h-px w-3 bg-gray-300 dark:bg-gray-600\"></div>\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n } @else if (child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n } @else {\n <div\n class=\"h-1.5 w-1.5 shrink-0 rounded-full\"\n [class.bg-primary-foreground]=\"isChildActive\"\n [class.bg-gray-400]=\"!isChildActive\"></div>\n }\n <span class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\">\n {{ child.name | translate }}\n </span>\n @if (hasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-arrow shrink-0 opacity-60 transition-transform\"\n [class.expanded]=\"child.expanded\" />\n }\n </div>\n\n <!-- Level 3 -->\n @if (hasChildren) {\n <div class=\"z-menu-submenu\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-submenu-inner\">\n <div class=\"relative ml-4 flex flex-col gap-1 pt-1 pl-3\">\n <div class=\"absolute top-0 bottom-2 left-0 w-px bg-gray-300 dark:bg-gray-600\"></div>\n\n @for (subChild of child.children; track subChild.id) {\n @let isSubChildActive = selectedMenuItem()?.id === subChild.id;\n\n <div class=\"relative w-full min-w-0\">\n <div class=\"absolute top-1/2 -left-3 h-px w-3 bg-gray-300 dark:bg-gray-600\"></div>\n\n <div\n class=\"flex cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isSubChildActive\"\n [class.text-primary-foreground]=\"isSubChildActive\"\n [class.hover:bg-accent]=\"!isSubChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n <div\n class=\"h-1 w-1 shrink-0 rounded-full\"\n [class.bg-primary-foreground]=\"isSubChildActive\"\n [class.bg-gray-400]=\"!isSubChildActive\"></div>\n <span class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\">\n {{ subChild.name | translate }}\n </span>\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n </ng-scrollbar>\n\n <!-- Drawer Footer - User Info -->\n <div class=\"border-border shrink-0 border-t p-3\">\n <div\n z-popover\n [zOffset]=\"8\"\n [zPopoverContent]=\"mobileActionsPopoverTpl\"\n zPosition=\"top-right\"\n zTrigger=\"click\"\n class=\"hover:bg-accent flex cursor-pointer items-center gap-3 rounded-[0.375rem] p-2\">\n <div class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </div>\n <div class=\"min-w-0 flex-1\">\n <div class=\"truncate text-sm font-medium\">{{ zUser()?.name || 'User Name' }}</div>\n <div class=\"text-muted-foreground truncate text-xs\">{{ zUser()?.email || 'user@example.com' }}</div>\n </div>\n <div class=\"text-muted-foreground flex shrink-0 flex-col\">\n <z-icon zType=\"lucideChevronUp\" zSize=\"14\" />\n <z-icon zType=\"lucideChevronDown\" zSize=\"14\" class=\"-mt-1\" />\n </div>\n </div>\n </div>\n </aside>\n\n <!-- Mobile Custom Template Drawer -->\n <aside\n class=\"z-menu-custom-drawer bg-background border-border fixed top-0 left-0 z-9999 flex h-full max-w-[calc(100vw-1rem)] flex-col rounded-r-lg border-r\"\n [style.width.px]=\"mobileCustomDrawerWidth()\"\n [class.open]=\"mobileTemplateDrawerOpen() && customDrawerParent()?.menuTemplate\">\n @if (customDrawerParent()?.menuTemplate) {\n <!-- Custom Drawer Header -->\n <div class=\"border-border flex h-14 shrink-0 items-center gap-3 border-b px-4\">\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"bg-accent h-9 w-9 shrink-0\"\n (click)=\"closeMobileTemplateDrawer()\">\n <z-icon zType=\"lucideChevronLeft\" zSize=\"20\" />\n </button>\n <span class=\"min-w-0 flex-1 truncate text-base font-semibold\">\n {{ customDrawerParent()?.name | translate }}\n </span>\n </div>\n\n <!-- Custom Template Content -->\n <ng-scrollbar class=\"z-menu-scrollbar flex-1\" track=\"vertical\">\n <div class=\"p-4\">\n <ng-container\n *ngTemplateOutlet=\"\n customDrawerParent()!.menuTemplate!;\n context: { $implicit: customDrawerParent()!, close: closeMobileDrawerFn }\n \" />\n </div>\n </ng-scrollbar>\n }\n </aside>\n\n <ng-template #mobileActionsPopoverTpl let-close=\"close\">\n <div class=\"min-w-48 p-1\">\n @if (zActionsTemplate()) {\n <ng-container *ngTemplateOutlet=\"zActionsTemplate(); context: { close: close }\" />\n } @else if (getVisibleUserActions().length > 0) {\n @for (action of getVisibleUserActions(); track action.id; let idx = $index) {\n @if (shouldShowDividerBefore(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (shouldShowDividerAfter(action, idx)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n }\n </div>\n </ng-template>\n</div>\n\n<!-- Shared Template for Menu Children -->\n<ng-template #menuChildrenTpl let-children>\n @for (child of children; track child.id) {\n @let isChildActive = selectedMenuItem()?.id === child.id && (!child.children || child.children.length === 0);\n @let isChildParentOfActive = isParentOfActiveItem(child);\n @let hasChildren = child.children && child.children.length > 0;\n <div class=\"w-full min-w-0\">\n <div\n #divLevel1\n class=\"z-menu-item flex w-full cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isChildActive\"\n [class.text-primary-foreground]=\"isChildActive\"\n [class.text-primary]=\"isChildParentOfActive && !isChildActive\"\n [class.hover:bg-gray-200]=\"!isChildActive\"\n [class.dark:hover:bg-input/50]=\"!isChildActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"18\" class=\"shrink-0\" />\n } @else if (child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span\n class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\"\n zTooltip\n [zContent]=\"child.name | translate\"\n [zArrow]=\"false\"\n [zOffset]=\"10\"\n zMaxWidth=\"200px\"\n zPosition=\"right\"\n [zTriggerElement]=\"divLevel1\">\n {{ child.name | translate }}\n </span>\n @if (hasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-arrow shrink-0 opacity-60 transition-transform\"\n [class.expanded]=\"child.expanded\" />\n }\n </div>\n\n @if (hasChildren) {\n <div class=\"z-menu-submenu\" [class.expanded]=\"child.expanded\">\n <div class=\"z-menu-submenu-inner\">\n <div class=\"z-menu-tree relative ml-4 flex flex-col gap-1 pt-1 pl-3\">\n <div class=\"absolute top-0 bottom-2 left-0 w-px bg-gray-300 dark:bg-gray-600\"></div>\n\n @for (subChild of child.children; track subChild.id; let isLast = $last) {\n @let isSubChildActive = selectedMenuItem()?.id === subChild.id;\n <div class=\"relative w-full min-w-0\">\n <div class=\"absolute top-1/2 -left-3 h-px w-3 bg-gray-300 dark:bg-gray-600\"></div>\n\n <div\n #divLevel2\n class=\"z-menu-item flex w-full cursor-pointer items-center gap-2 rounded-[0.375rem] p-2\"\n [class.bg-primary]=\"isSubChildActive\"\n [class.text-primary-foreground]=\"isSubChildActive\"\n [class.hover:bg-gray-200]=\"!isSubChildActive\"\n [class.dark:hover:bg-input/50]=\"!isSubChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"16\" class=\"shrink-0\" />\n } @else if (subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n } @else {\n <div\n class=\"h-1 w-1 shrink-0 rounded-full\"\n [class.bg-primary-foreground]=\"isSubChildActive\"\n [class.bg-gray-400]=\"!isSubChildActive\"></div>\n }\n <span\n class=\"min-w-0 flex-1 truncate text-[0.8125rem] font-[450]\"\n zTooltip\n [zContent]=\"subChild.name | translate\"\n [zArrow]=\"false\"\n [zOffset]=\"10\"\n zMaxWidth=\"200px\"\n zPosition=\"right\"\n [zTriggerElement]=\"divLevel2\">\n {{ subChild.name | translate }}\n </span>\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n</ng-template>\n","import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';\nimport { isPlatformBrowser, NgTemplateOutlet } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n DestroyRef,\n effect,\n inject,\n input,\n output,\n PLATFORM_ID,\n signal,\n untracked,\n ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { NavigationEnd, Router } from '@angular/router';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { ZCacheService } from '@shival99/z-ui/services';\nimport { zDetectBrowser, zMergeClasses } from '@shival99/z-ui/utils';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport { filter, map, startWith } from 'rxjs';\nimport {\n ZMenuItem,\n ZMenuOverlayType,\n ZMenuProcessed,\n ZMenuUser,\n ZMenuUserAction,\n ZMenuV2Control,\n ZMenuV2ExpandMode,\n ZMenuV2Item,\n} from './z-menu.types';\n\n@Component({\n selector: 'z-menu-v2',\n imports: [NgTemplateOutlet, ZButtonComponent, ZIconComponent, ZPopoverDirective, NgScrollbar, TranslatePipe],\n standalone: true,\n templateUrl: './z-menu-v2.component.html',\n styleUrl: './z-menu-v2.component.scss',\n providers: [TranslatePipe],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-menu-v2 block',\n '[class.z-menu-v2-collapsed]': 'sidebarCollapsed()',\n '[class.z-menu-v2-mobile-open]': 'mobileMenuOpen()',\n '[class.z-menu-v2-mobile]': 'isMobile()',\n },\n})\nexport class ZMenuV2Component {\n private readonly _breakpointObserver = inject(BreakpointObserver);\n private readonly _destroyRef = inject(DestroyRef);\n private readonly _platformId = inject(PLATFORM_ID);\n private readonly _router = inject(Router);\n\n public readonly zOnSelect = output<ZMenuItem>();\n public readonly zOnMenuAction = output<ZMenuUserAction>();\n public readonly zControl = output<ZMenuV2Control>();\n\n public readonly zLogo = input<string>('assets/images/avatar.svg');\n public readonly zLogoMobile = input<string>('');\n public readonly zMenus = input<ZMenuV2Item[]>([]);\n public readonly zUser = input<ZMenuUser | null>(null);\n public readonly zUserActions = input<ZMenuUserAction[]>([]);\n public readonly zCurrentPath = input<string>('');\n public readonly zKey = input<string>('z-menu-v2');\n public readonly zClass = input('');\n public readonly zCollapsedWidth = input(60);\n public readonly zExpandedWidth = input(248);\n public readonly zExpandMode = input<ZMenuV2ExpandMode>('multiple');\n\n public readonly selectedParent = signal<ZMenuItem | null>(null);\n public readonly selectedMenuItem = signal<ZMenuItem | null>(null);\n public readonly mobileMenuOpen = signal(false);\n public readonly sidebarCollapsed = signal(false);\n\n private readonly _expandedIds = signal<Set<string>>(new Set());\n private readonly _collapsedIds = signal<Set<string>>(new Set());\n private readonly _renderedOpeningIds = signal<Set<string>>(new Set());\n private readonly _renderedClosingIds = signal<Set<string>>(new Set());\n private readonly _activeCacheKey = signal('');\n private readonly _hasSyncedInitialPath = signal(false);\n private readonly _openingRenderTimers = new Map<string, ReturnType<typeof setTimeout>>();\n private readonly _closingRenderTimers = new Map<string, ReturnType<typeof setTimeout>>();\n protected readonly zClasses = computed(() =>\n zMergeClasses('z-menu-v2-shell bg-sidebar text-sidebar-foreground border-sidebar-border', this.zClass())\n );\n\n private readonly _isMobile$ = this._breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.Small]).pipe(\n map(result => result.matches),\n takeUntilDestroyed(this._destroyRef)\n );\n\n public readonly isMobile = toSignal(this._isMobile$, { initialValue: false });\n protected readonly mobileLogo = computed(() => this.zLogoMobile() || this.zLogo());\n protected readonly avatarSrc = computed(() => this.zUser()?.avatar || this.zLogo());\n protected readonly visibleUserActions = computed(() => this.zUserActions().filter(action => !action.hidden));\n\n private readonly _routerPath = toSignal(\n this._router.events.pipe(\n filter((e): e is NavigationEnd => e instanceof NavigationEnd),\n map(e => e.urlAfterRedirects),\n startWith(this._router.url)\n ),\n { initialValue: this._router.url }\n );\n\n private readonly _currentPath = computed(() => this.zCurrentPath() || this._routerPath());\n protected readonly overlayType = computed((): ZMenuOverlayType => {\n if (!isPlatformBrowser(this._platformId)) {\n return 'dark';\n }\n\n const browser = zDetectBrowser();\n return browser.name === 'Chrome' ? 'dark' : 'blur';\n });\n\n protected readonly menuProcessed = computed(\n (): ZMenuProcessed =>\n this._processMenus(\n this.zMenus(),\n this._expandedIds(),\n this._collapsedIds(),\n this._renderedOpeningIds(),\n this._renderedClosingIds()\n )\n );\n\n protected readonly menuParents = computed(() =>\n this.menuProcessed().tree.filter((item: ZMenuItem) => !item.parent || item.parent.length === 0)\n );\n\n protected readonly parentWithActiveChild = computed(() => {\n const activeItem = this.selectedMenuItem();\n if (!activeItem) {\n return null;\n }\n\n if (!activeItem.parent?.length) {\n return activeItem;\n }\n\n const topLevelParentId = activeItem.parent[0];\n return this.menuParents().find(parent => parent.id === topLevelParentId) ?? null;\n });\n\n constructor() {\n effect(() => {\n if (this._hasSyncedInitialPath()) {\n return;\n }\n\n const currentPath = this._currentPath();\n this.zMenus();\n const processedMenus = untracked(() => this.menuProcessed());\n if (!currentPath || processedMenus.flat.size === 0) {\n return;\n }\n\n const matchingItem = this._findMenuItemByPath(currentPath, processedMenus);\n const currentSelectedId = untracked(() => this.selectedMenuItem()?.id);\n if (matchingItem && matchingItem.id !== currentSelectedId) {\n this.setSelectedMenuItem(matchingItem.id);\n }\n this._hasSyncedInitialPath.set(true);\n });\n\n effect(() => {\n if (!this.isMobile() && this.mobileMenuOpen()) {\n this.mobileMenuOpen.set(false);\n }\n });\n\n effect(() => {\n const key = this.zKey();\n const activeKey = untracked(() => this._activeCacheKey());\n if (key === activeKey) {\n return;\n }\n\n this._activeCacheKey.set(key);\n this.sidebarCollapsed.set(this._getStateMenuCollapsed(key));\n });\n\n effect(() => {\n const key = this._activeCacheKey();\n if (!key) {\n return;\n }\n\n ZCacheService.set(key, this.sidebarCollapsed());\n });\n\n this._destroyRef.onDestroy(() => {\n for (const timer of this._openingRenderTimers.values()) {\n clearTimeout(timer);\n }\n for (const timer of this._closingRenderTimers.values()) {\n clearTimeout(timer);\n }\n });\n\n setTimeout(() => this._emitControl());\n }\n\n public openMobileMenu(): void {\n this.mobileMenuOpen.set(true);\n }\n\n public closeMobileMenu(): void {\n this.mobileMenuOpen.set(false);\n }\n\n public toggleMobileMenu(): void {\n this.mobileMenuOpen.set(!this.mobileMenuOpen());\n }\n\n public setSelectedMenuItem(menuId: string): void {\n const item = this.menuProcessed().flat.get(menuId);\n if (!item) {\n return;\n }\n\n this.selectedMenuItem.set(item);\n this._expandParentsOfItem(item);\n\n if (!item.parent?.length) {\n this.selectedParent.set(item);\n return;\n }\n\n const topLevelParent = this.menuProcessed().flat.get(item.parent[0]);\n this.selectedParent.set(topLevelParent ?? null);\n }\n\n public clearActiveItem(): void {\n this.selectedMenuItem.set(null);\n }\n\n protected toggleSidebar(): void {\n this.sidebarCollapsed.set(!this.sidebarCollapsed());\n }\n\n protected onMenuItemClick(item: ZMenuItem): void {\n const hasChildren = !!item.children?.length;\n if (hasChildren) {\n this._toggleExpanded(item);\n this.selectedParent.set(item);\n return;\n }\n\n this._selectLeafItem(item);\n }\n\n protected onCollapsedLeafClick(item: ZMenuItem, close: () => void): void {\n this._selectLeafItem(item);\n close();\n }\n\n protected onCollapsedParentClick(item: ZMenuItem): void {\n this.selectedParent.set(item);\n }\n\n protected onMobileBackdropClick(): void {\n this.closeMobileMenu();\n }\n\n protected onUserActionClick(action: ZMenuUserAction): void {\n if (action.disabled) {\n return;\n }\n\n this.zOnMenuAction.emit(action);\n }\n\n private _emitControl(): void {\n this.zControl.emit({\n openMobileMenu: () => this.openMobileMenu(),\n closeMobileMenu: () => this.closeMobileMenu(),\n toggleMobileMenu: () => this.toggleMobileMenu(),\n setSelectedMenuItem: (id: string) => this.setSelectedMenuItem(id),\n clearActiveItem: () => this.clearActiveItem(),\n toggleSidebar: () => this.toggleSidebar(),\n sidebarCollapsed: this.sidebarCollapsed.asReadonly(),\n mobileMenuOpen: this.mobileMenuOpen.asReadonly(),\n selectedMenuItem: this.selectedMenuItem.asReadonly(),\n selectedParent: this.selectedParent.asReadonly(),\n menuProcessed: this.menuProcessed,\n });\n }\n\n private _selectLeafItem(item: ZMenuItem): void {\n this.selectedMenuItem.set(item);\n this._expandParentsOfItem(item);\n\n if (!item.parent?.length) {\n this.selectedParent.set(item);\n }\n\n if (item.parent?.length) {\n const topLevelParent = this.menuProcessed().flat.get(item.parent[0]);\n this.selectedParent.set(topLevelParent ?? null);\n }\n\n const processedItem = this.menuProcessed().flat.get(item.id);\n if (processedItem) {\n this.zOnSelect.emit(processedItem);\n }\n\n if (this.isMobile()) {\n this.closeMobileMenu();\n }\n }\n\n private _toggleExpanded(item: ZMenuItem): void {\n const currentlyExpanded = this.menuProcessed().flat.get(item.id)?.expanded ?? false;\n if (currentlyExpanded) {\n this._expandedIds.update(current => {\n const next = new Set(current);\n next.delete(item.id);\n return next;\n });\n\n this._collapsedIds.update(current => {\n const next = new Set(current);\n next.add(item.id);\n return next;\n });\n this._keepSubmenuRenderedDuringClose(item.id);\n return;\n }\n\n this._stopClosingRender(item.id);\n this._startOpeningRender(item.id);\n\n const parentsToClose =\n this.zExpandMode() === 'accordion' && item.level === 0\n ? this.menuParents().filter(parent => parent.id !== item.id)\n : [];\n\n for (const parent of parentsToClose) {\n this._keepSubmenuRenderedDuringClose(parent.id);\n }\n\n this._collapsedIds.update(current => {\n const next = new Set(current);\n next.delete(item.id);\n for (const parent of parentsToClose) {\n next.add(parent.id);\n }\n return next;\n });\n\n this._expandedIds.update(current => {\n const next = new Set(current);\n for (const parent of parentsToClose) {\n next.delete(parent.id);\n }\n next.add(item.id);\n return next;\n });\n }\n\n private _startOpeningRender(id: string): void {\n const previousTimer = this._openingRenderTimers.get(id);\n if (previousTimer) {\n clearTimeout(previousTimer);\n }\n\n this._renderedOpeningIds.update(current => {\n const next = new Set(current);\n next.add(id);\n return next;\n });\n\n const timer = setTimeout(() => {\n this._renderedOpeningIds.update(current => {\n const next = new Set(current);\n next.delete(id);\n return next;\n });\n this._openingRenderTimers.delete(id);\n }, 20);\n this._openingRenderTimers.set(id, timer);\n }\n\n private _keepSubmenuRenderedDuringClose(id: string): void {\n const previousTimer = this._closingRenderTimers.get(id);\n if (previousTimer) {\n clearTimeout(previousTimer);\n }\n\n this._renderedClosingIds.update(current => {\n const next = new Set(current);\n next.add(id);\n return next;\n });\n\n const timer = setTimeout(() => {\n this._renderedClosingIds.update(current => {\n const next = new Set(current);\n next.delete(id);\n return next;\n });\n this._closingRenderTimers.delete(id);\n }, 240);\n this._closingRenderTimers.set(id, timer);\n }\n\n private _stopClosingRender(id: string): void {\n const timer = this._closingRenderTimers.get(id);\n if (timer) {\n clearTimeout(timer);\n this._closingRenderTimers.delete(id);\n }\n\n this._renderedClosingIds.update(current => {\n const next = new Set(current);\n next.delete(id);\n return next;\n });\n }\n\n private _expandParentsOfItem(item: ZMenuItem): void {\n if (!item.parent?.length) {\n return;\n }\n\n this._expandedIds.update(current => {\n const next = new Set(current);\n for (const parentId of item.parent ?? []) {\n next.add(parentId);\n }\n return next;\n });\n\n this._collapsedIds.update(current => {\n const next = new Set(current);\n for (const parentId of item.parent ?? []) {\n next.delete(parentId);\n }\n return next;\n });\n }\n\n private _processMenus(\n menus: ZMenuV2Item[],\n expandedIds: Set<string>,\n collapsedIds: Set<string>,\n renderedOpeningIds: Set<string>,\n renderedClosingIds: Set<string>\n ): ZMenuProcessed {\n const flat = new Map<string, ZMenuItem>();\n const pathMap = new Map<string, ZMenuItem>();\n const subPathMap = new Map<string, ZMenuItem>();\n const parentMap = new Map<string, ZMenuItem>();\n\n const processItem = (item: ZMenuV2Item, parentIds: string[], level: number): ZMenuItem => {\n const children =\n level < 2 ? item.children?.map(child => processItem(child, [...parentIds, item.id], level + 1)) : undefined;\n const expanded = expandedIds.has(item.id) || (!!item.expanded && !collapsedIds.has(item.id));\n const processedItem: ZMenuItem = {\n active: item.active,\n children: children,\n expanded,\n icon: item.icon,\n iconSvg: item.iconSvg,\n id: item.id,\n level,\n name: item.name,\n parent: [...parentIds],\n path: item.path,\n permission: item.permission,\n projects: item.projects,\n renderChildren: expanded || renderedClosingIds.has(item.id),\n renderExpanded: expanded && !renderedOpeningIds.has(item.id),\n subPaths: item.subPaths,\n };\n\n flat.set(processedItem.id, processedItem);\n\n if (processedItem.path) {\n const normalizedPath = processedItem.path.replace(/\\/$/, '') || '/';\n pathMap.set(normalizedPath, processedItem);\n }\n\n if (processedItem.subPaths?.length) {\n for (const subPath of processedItem.subPaths) {\n const normalizedSubPath = subPath.replace(/\\/$/, '');\n subPathMap.set(normalizedSubPath, processedItem);\n }\n }\n\n if (children?.length) {\n for (const child of children) {\n parentMap.set(child.id, processedItem);\n }\n }\n\n return processedItem;\n };\n\n const tree = menus.map(item => processItem(item, [], 0));\n return { tree, flat, pathMap, subPathMap, parentMap };\n }\n\n private _findMenuItemByPath(path: string, processed: ZMenuProcessed): ZMenuItem | null {\n const normalizedPath = path.split('?')[0].replace(/\\/$/, '') || '/';\n const exactMatch = processed.pathMap.get(normalizedPath);\n if (exactMatch) {\n return exactMatch;\n }\n\n const subPathMatch = processed.subPathMap.get(normalizedPath);\n if (subPathMatch) {\n return subPathMatch;\n }\n\n const deepestSubPathMatch = this._findDeepestPrefixMatch(normalizedPath, processed.subPathMap);\n if (deepestSubPathMatch) {\n return deepestSubPathMatch;\n }\n\n const deepestPathMatch = this._findDeepestPrefixMatch(normalizedPath, processed.pathMap);\n if (deepestPathMatch) {\n return deepestPathMatch;\n }\n\n return null;\n }\n\n private _findDeepestPrefixMatch(normalizedPath: string, pathMap: Map<string, ZMenuItem>): ZMenuItem | null {\n let bestMatch: ZMenuItem | null = null;\n let bestPathLength = 0;\n\n for (const [itemPath, item] of pathMap.entries()) {\n if (!itemPath || itemPath === '/' || !normalizedPath.startsWith(itemPath + '/')) {\n continue;\n }\n\n if (itemPath.length <= bestPathLength) {\n continue;\n }\n\n bestMatch = item;\n bestPathLength = itemPath.length;\n }\n\n return bestMatch;\n }\n\n private _getStateMenuCollapsed(key: string): boolean {\n return ZCacheService.get<boolean>(key, false) ?? false;\n }\n}\n","<aside\n class=\"hidden h-full min-h-0 flex-col overflow-hidden border-r shadow-sm md:flex\"\n [class]=\"zClasses()\"\n [style.--z-menu-v2-expanded-width.px]=\"zExpandedWidth()\"\n [style.--z-menu-v2-collapsed-width.px]=\"zCollapsedWidth()\">\n <div\n class=\"border-sidebar-border flex h-14 shrink-0 items-center gap-2 border-b px-3\"\n [class.justify-center]=\"sidebarCollapsed()\">\n @if (!sidebarCollapsed() && zLogo()) {\n <img [src]=\"zLogo()\" alt=\"Logo\" class=\"h-8 w-auto shrink-0 object-contain transition-opacity\" />\n }\n\n @if (!sidebarCollapsed()) {\n <div class=\"min-w-0 flex-1 overflow-hidden text-sm font-semibold text-ellipsis whitespace-nowrap\">\n {{ 'i18n_z_ui_menu_navigation' | translate }}\n </div>\n }\n\n <button\n z-button\n zType=\"ghost\"\n [zWave]=\"false\"\n class=\"z-menu-v2-toggle h-9 w-9 shrink-0\"\n [class.z-menu-v2-toggle-collapsed]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"\n (sidebarCollapsed() ? 'i18n_z_ui_menu_expand_sidebar' : 'i18n_z_ui_menu_collapse_sidebar') | translate\n \"\n (click)=\"toggleSidebar()\">\n <z-icon [zType]=\"sidebarCollapsed() ? 'lucidePanelLeftOpen' : 'lucidePanelLeftClose'\" zSize=\"18\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar min-h-0 flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-2\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n @if (sidebarCollapsed() && parentHasChildren) {\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"parentPopoverTpl\"\n zPopoverWidth=\"auto\"\n zPosition=\"right-top\"\n [zOffset]=\"10\"\n class=\"z-menu-v2-icon-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n [attr.aria-label]=\"parent.name | translate\"\n (click)=\"onCollapsedParentClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"20\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"20\" />\n }\n </button>\n\n <ng-template #parentPopoverTpl let-close=\"close\">\n <div class=\"z-menu-v2-popover min-w-60 pt-1 pl-1\">\n <div class=\"text-muted-foreground flex items-center gap-2 px-2 py-2 text-xs font-medium\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"15\" />\n }\n <span class=\"overflow-hidden text-ellipsis whitespace-nowrap\">{{ parent.name | translate }}</span>\n </div>\n <ng-scrollbar class=\"z-menu-v2-popover-scrollbar\" orientation=\"vertical\" visibility=\"visible\">\n <div class=\"z-menu-v2-popover-scroll-content pr-2 pb-1\">\n <ng-container\n *ngTemplateOutlet=\"collapsedChildrenTpl; context: { $implicit: parent.children, close: close }\" />\n </div>\n </ng-scrollbar>\n </div>\n </ng-template>\n }\n @if (!(sidebarCollapsed() && parentHasChildren)) {\n <ng-container *ngTemplateOutlet=\"openParentTpl; context: { $implicit: parent }\" />\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"userFooterTpl\" />\n</aside>\n\n<ng-template #openParentTpl let-parent>\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentLeafActive\"\n [class.parent-active]=\"parentActive && !parentLeafActive\"\n [class.icon-only]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? (parent.name | translate) : null\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n }\n </button>\n\n @if (!sidebarCollapsed() && parentHasChildren && parent.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.renderExpanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #collapsedChildrenTpl let-children let-close=\"close\">\n <div class=\"z-menu-v2-submenu z-menu-v2-popover-tree\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"childHasChildren ? onMenuItemClick(child) : onCollapsedLeafClick(child, close)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren && child.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel collapsed-popover\" [class.expanded]=\"child.renderExpanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-popover-item\"\n [class.active]=\"subChildActive\"\n (click)=\"onCollapsedLeafClick(subChild, close)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #userFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-2\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"right-bottom\"\n [zOffset]=\"10\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\"\n [class.justify-center]=\"sidebarCollapsed()\"\n [attr.aria-label]=\"sidebarCollapsed() ? zUser()?.name || 'User Name' : null\">\n <span class=\"h-9 w-9 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n @if (!sidebarCollapsed()) {\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n }\n </button>\n </div>\n</ng-template>\n\n<ng-template #mobileUserFooterTpl>\n <div class=\"border-sidebar-border shrink-0 border-t p-3\">\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"userPopoverTpl\"\n zPosition=\"top-right\"\n [zOffset]=\"8\"\n class=\"hover:bg-sidebar-accent flex w-full cursor-pointer items-center gap-3 rounded-md p-2 text-left\">\n <span class=\"h-10 w-10 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"h-full w-full object-cover\" />\n </span>\n <span class=\"min-w-0 flex-1\">\n <span class=\"block overflow-hidden text-sm font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground block overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </span>\n <z-icon zType=\"lucideChevronsUpDown\" zSize=\"15\" class=\"text-muted-foreground shrink-0\" />\n </button>\n </div>\n</ng-template>\n\n<ng-template #userPopoverTpl let-close=\"close\">\n <div class=\"min-w-56 p-1\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <div class=\"h-8 w-8 shrink-0 overflow-hidden rounded-full\">\n <img [src]=\"avatarSrc()\" alt=\"User Avatar\" class=\"aspect-square size-full object-cover\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"overflow-hidden font-medium text-ellipsis whitespace-nowrap\">\n {{ zUser()?.name || 'User Name' }}\n </span>\n <span class=\"text-muted-foreground mt-0.5 overflow-hidden text-xs text-ellipsis whitespace-nowrap\">\n {{ zUser()?.email || 'user@example.com' }}\n </span>\n </div>\n </div>\n\n @if (visibleUserActions().length > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n @for (action of visibleUserActions(); track action.id; let idx = $index) {\n @if (action.divide === 'before' && idx > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"action.disabled\"\n [class]=\"action.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onUserActionClick(action); close()\">\n @if (action.icon) {\n <z-icon [zType]=\"action.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n }\n <span>{{ action.label | translate }}</span>\n </button>\n\n @if (action.divide === 'after' && idx < visibleUserActions().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n\n<ng-template #openChildrenTpl let-children>\n <div class=\"z-menu-v2-submenu\">\n @for (child of children; track child.id) {\n @let childActive = selectedMenuItem()?.id === child.id;\n @let childParentActive = selectedMenuItem()?.parent?.includes(child.id);\n @let childHasChildren = child.children && child.children.length > 0;\n <div class=\"min-w-0\">\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-child\"\n [class.active]=\"childActive\"\n [class.parent-active]=\"childParentActive\"\n (click)=\"onMenuItemClick(child)\">\n @if (child.icon) {\n <z-icon [zType]=\"child.icon\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && child.iconSvg) {\n <z-icon [zSvg]=\"child.iconSvg\" zSize=\"16\" class=\"shrink-0\" />\n }\n @if (!child.icon && !child.iconSvg) {\n <span class=\"z-menu-v2-dot\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ child.name | translate }}\n </span>\n @if (childHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"14\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"child.expanded\" />\n }\n </button>\n\n @if (childHasChildren && child.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"child.renderExpanded\">\n <div class=\"z-menu-v2-submenu z-menu-v2-submenu-nested\">\n @for (subChild of child.children; track subChild.id) {\n @let subChildActive = selectedMenuItem()?.id === subChild.id;\n <button\n type=\"button\"\n class=\"z-menu-v2-item z-menu-v2-item-sub-child\"\n [class.active]=\"subChildActive\"\n (click)=\"onMenuItemClick(subChild)\">\n @if (subChild.icon) {\n <z-icon [zType]=\"subChild.icon\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && subChild.iconSvg) {\n <z-icon [zSvg]=\"subChild.iconSvg\" zSize=\"15\" class=\"shrink-0\" />\n }\n @if (!subChild.icon && !subChild.iconSvg) {\n <span class=\"z-menu-v2-dot small\"></span>\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ subChild.name | translate }}\n </span>\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n</ng-template>\n\n<div\n class=\"z-menu-v2-mobile-bar border-border bg-background flex h-14 items-center justify-between border-b px-4 md:hidden\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"openMobileMenu()\">\n <z-icon zType=\"lucideMenu\" zSize=\"20\" />\n </button>\n</div>\n\n@if (mobileMenuOpen()) {\n <div\n class=\"z-menu-v2-backdrop fixed inset-0 z-9998 md:hidden\"\n [class.z-menu-v2-backdrop-dark]=\"overlayType() === 'dark'\"\n [class.z-menu-v2-backdrop-blur]=\"overlayType() === 'blur'\"\n (click)=\"onMobileBackdropClick()\"></div>\n}\n\n<aside\n class=\"z-menu-v2-mobile-drawer bg-sidebar text-sidebar-foreground border-sidebar-border fixed top-0 left-0 z-9999 flex h-full w-72 max-w-[calc(100vw-1rem)] flex-col border-r md:hidden\"\n [class.open]=\"mobileMenuOpen()\">\n <div class=\"border-sidebar-border flex h-14 shrink-0 items-center justify-between border-b px-4\">\n @if (mobileLogo()) {\n <img [src]=\"mobileLogo()\" alt=\"Logo\" class=\"h-8 w-auto object-contain\" />\n }\n <button z-button zType=\"ghost\" [zWave]=\"false\" class=\"h-9 w-9\" (click)=\"closeMobileMenu()\">\n <z-icon zType=\"lucideX\" zSize=\"20\" />\n </button>\n </div>\n\n <ng-scrollbar class=\"z-menu-v2-scrollbar flex-1\" track=\"vertical\">\n <nav class=\"z-menu-v2-nav flex flex-col p-3\">\n @for (parent of menuParents(); track parent.id) {\n @let parentActive = parentWithActiveChild()?.id === parent.id;\n @let parentLeafActive = selectedMenuItem()?.id === parent.id;\n @let parentHasChildren = parent.children && parent.children.length > 0;\n <button\n type=\"button\"\n class=\"z-menu-v2-item\"\n [class.active]=\"parentActive || parentLeafActive\"\n (click)=\"onMenuItemClick(parent)\">\n @if (parent.icon) {\n <z-icon [zType]=\"parent.icon\" zSize=\"18\" class=\"shrink-0\" />\n }\n @if (!parent.icon && parent.iconSvg) {\n <z-icon [zSvg]=\"parent.iconSvg\" zSize=\"18\" class=\"shrink-0\" />\n }\n <span class=\"min-w-0 flex-1 overflow-hidden text-left text-ellipsis whitespace-nowrap\">\n {{ parent.name | translate }}\n </span>\n @if (parentHasChildren) {\n <z-icon\n zType=\"lucideChevronRight\"\n zSize=\"15\"\n class=\"z-menu-v2-arrow shrink-0 opacity-60\"\n [class.expanded]=\"parent.expanded\" />\n }\n </button>\n\n @if (parentHasChildren && parent.renderChildren) {\n <div class=\"z-menu-v2-submenu-panel\" [class.expanded]=\"parent.renderExpanded\">\n <ng-container *ngTemplateOutlet=\"openChildrenTpl; context: { $implicit: parent.children }\" />\n </div>\n }\n }\n </nav>\n </ng-scrollbar>\n\n <ng-container *ngTemplateOutlet=\"mobileUserFooterTpl\" />\n</aside>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shival99/z-ui",
3
- "version": "2.0.4",
3
+ "version": "2.0.5",
4
4
  "description": "Z-UI: Modern Angular UI Component Library - A comprehensive, high-performance design system built with Angular 20+, featuring 40+ customizable components with dark mode, accessibility, and enterprise-ready features.",
5
5
  "keywords": [
6
6
  "angular",
@@ -23,10 +23,13 @@ interface ZMenuItem {
23
23
  projects?: string[];
24
24
  menuTemplate?: TemplateRef<ZMenuItemTemplateContext>;
25
25
  menuTemplateWidth?: number;
26
+ renderChildren?: boolean;
27
+ renderExpanded?: boolean;
26
28
  }
27
- type ZMenuV2Item = Omit<ZMenuItem, 'children' | 'menuTemplate' | 'menuTemplateWidth'> & {
29
+ type ZMenuV2Item = Omit<ZMenuItem, 'children' | 'menuTemplate' | 'menuTemplateWidth' | 'renderChildren' | 'renderExpanded'> & {
28
30
  children?: ZMenuV2Item[];
29
31
  };
32
+ type ZMenuV2ExpandMode = 'accordion' | 'multiple';
30
33
  interface ZMenuProcessed {
31
34
  tree: ZMenuItem[];
32
35
  flat: Map<string, ZMenuItem>;
@@ -159,13 +162,19 @@ declare class ZMenuV2Component {
159
162
  readonly zClass: _angular_core.InputSignal<string>;
160
163
  readonly zCollapsedWidth: _angular_core.InputSignal<number>;
161
164
  readonly zExpandedWidth: _angular_core.InputSignal<number>;
165
+ readonly zExpandMode: _angular_core.InputSignal<ZMenuV2ExpandMode>;
162
166
  readonly selectedParent: _angular_core.WritableSignal<ZMenuItem | null>;
163
167
  readonly selectedMenuItem: _angular_core.WritableSignal<ZMenuItem | null>;
164
168
  readonly mobileMenuOpen: _angular_core.WritableSignal<boolean>;
165
169
  readonly sidebarCollapsed: _angular_core.WritableSignal<boolean>;
166
170
  private readonly _expandedIds;
167
171
  private readonly _collapsedIds;
172
+ private readonly _renderedOpeningIds;
173
+ private readonly _renderedClosingIds;
168
174
  private readonly _activeCacheKey;
175
+ private readonly _hasSyncedInitialPath;
176
+ private readonly _openingRenderTimers;
177
+ private readonly _closingRenderTimers;
169
178
  protected readonly zClasses: _angular_core.Signal<string>;
170
179
  private readonly _isMobile$;
171
180
  readonly isMobile: _angular_core.Signal<boolean>;
@@ -193,14 +202,17 @@ declare class ZMenuV2Component {
193
202
  private _emitControl;
194
203
  private _selectLeafItem;
195
204
  private _toggleExpanded;
205
+ private _startOpeningRender;
206
+ private _keepSubmenuRenderedDuringClose;
207
+ private _stopClosingRender;
196
208
  private _expandParentsOfItem;
197
209
  private _processMenus;
198
210
  private _findMenuItemByPath;
199
211
  private _findDeepestPrefixMatch;
200
212
  private _getStateMenuCollapsed;
201
213
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZMenuV2Component, never>;
202
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZMenuV2Component, "z-menu-v2", never, { "zLogo": { "alias": "zLogo"; "required": false; "isSignal": true; }; "zLogoMobile": { "alias": "zLogoMobile"; "required": false; "isSignal": true; }; "zMenus": { "alias": "zMenus"; "required": false; "isSignal": true; }; "zUser": { "alias": "zUser"; "required": false; "isSignal": true; }; "zUserActions": { "alias": "zUserActions"; "required": false; "isSignal": true; }; "zCurrentPath": { "alias": "zCurrentPath"; "required": false; "isSignal": true; }; "zKey": { "alias": "zKey"; "required": false; "isSignal": true; }; "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zCollapsedWidth": { "alias": "zCollapsedWidth"; "required": false; "isSignal": true; }; "zExpandedWidth": { "alias": "zExpandedWidth"; "required": false; "isSignal": true; }; }, { "zOnSelect": "zOnSelect"; "zOnMenuAction": "zOnMenuAction"; "zControl": "zControl"; }, never, never, true, never>;
214
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZMenuV2Component, "z-menu-v2", never, { "zLogo": { "alias": "zLogo"; "required": false; "isSignal": true; }; "zLogoMobile": { "alias": "zLogoMobile"; "required": false; "isSignal": true; }; "zMenus": { "alias": "zMenus"; "required": false; "isSignal": true; }; "zUser": { "alias": "zUser"; "required": false; "isSignal": true; }; "zUserActions": { "alias": "zUserActions"; "required": false; "isSignal": true; }; "zCurrentPath": { "alias": "zCurrentPath"; "required": false; "isSignal": true; }; "zKey": { "alias": "zKey"; "required": false; "isSignal": true; }; "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zCollapsedWidth": { "alias": "zCollapsedWidth"; "required": false; "isSignal": true; }; "zExpandedWidth": { "alias": "zExpandedWidth"; "required": false; "isSignal": true; }; "zExpandMode": { "alias": "zExpandMode"; "required": false; "isSignal": true; }; }, { "zOnSelect": "zOnSelect"; "zOnMenuAction": "zOnMenuAction"; "zControl": "zControl"; }, never, never, true, never>;
203
215
  }
204
216
 
205
217
  export { ZMenuComponent, ZMenuV2Component };
206
- export type { ZMenuControl, ZMenuItem, ZMenuItemTemplateContext, ZMenuProcessed, ZMenuUser, ZMenuUserAction, ZMenuV2Control, ZMenuV2Item };
218
+ export type { ZMenuControl, ZMenuItem, ZMenuItemTemplateContext, ZMenuProcessed, ZMenuUser, ZMenuUserAction, ZMenuV2Control, ZMenuV2ExpandMode, ZMenuV2Item };
@@ -81,7 +81,7 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
81
81
  readonly zHideDelay: _angular_core.InputSignal<number>;
82
82
  readonly zDisabled: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
83
83
  readonly zOffset: _angular_core.InputSignal<number>;
84
- readonly zPopoverWidth: _angular_core.InputSignal<number | "auto" | "trigger">;
84
+ readonly zPopoverWidth: _angular_core.InputSignal<number | "trigger" | "auto">;
85
85
  readonly zTriggerRef: _angular_core.InputSignal<HTMLElement | ElementRef<HTMLElement> | null>;
86
86
  readonly zManualClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
87
87
  readonly zScrollClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;