@acorex/components 20.7.27 → 20.7.28

package/fesm2022/acorex-components-menu.mjs

@@ -6,7 +6,10 @@ import { AXUnsubscriber, AXHtmlUtil } from '@acorex/core/utils';
 import { AXZIndexService } from '@acorex/core/z-index';
 import { isPlatformBrowser, NgTemplateOutlet, AsyncPipe } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Injectable, signal, inject, Renderer2, computed, output, input, afterNextRender, HostBinding, HostListener, ChangeDetectionStrategy, ViewEncapsulation, Component, DOCUMENT, PLATFORM_ID, Injector, NgModule } from '@angular/core';
+import { Injectable, signal, inject, Renderer2, computed, output, input, afterNextRender, HostBinding, HostListener, ChangeDetectionStrategy, ViewEncapsulation, Component, DOCUMENT, PLATFORM_ID, Injector, DestroyRef, NgModule } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Router, NavigationStart } from '@angular/router';
+import { filter } from 'rxjs/operators';
 import { cloneDeep } from 'lodash-es';
 import { Subject } from 'rxjs';
 
@@ -427,6 +430,8 @@ class AXContextMenuComponent extends NXComponent {
         this.orientation = input('vertical', ...(ngDevMode ? [{ debugName: "orientation" }] : []));
         this.openOn = input('hover', ...(ngDevMode ? [{ debugName: "openOn" }] : []));
         this.closeOn = input('click', ...(ngDevMode ? [{ debugName: "closeOn" }] : []));
+        /** When true, closes the menu on router navigation (e.g. side-menu route changes). */
+        this.closeOnRouteChange = input(false, ...(ngDevMode ? [{ debugName: "closeOnRouteChange" }] : []));
         this.originalItems = input([], ...(ngDevMode ? [{ debugName: "originalItems", alias: 'items' }] : [{ alias: 'items' }]));
         this.target = input(...(ngDevMode ? [undefined, { debugName: "target" }] : []));
         this.onItemClick = output();
@@ -443,6 +448,8 @@ class AXContextMenuComponent extends NXComponent {
         this.injector = inject(Injector);
         this.zToken = null;
         this.lastOpenPoint = null;
+        this.router = inject(Router, { optional: true });
+        this.destroyRef = inject(DestroyRef);
         this.originalNextSibling = null;
         this.originalParent = null;
         this.items = signal([], ...(ngDevMode ? [{ debugName: "items" }] : []));
@@ -450,6 +457,7 @@ class AXContextMenuComponent extends NXComponent {
         afterNextRender(() => {
             this.bindContextEvent();
         });
+        this.setupCloseOnRouteChange();
         this.service.closeAllContextMenu$.subscribe(() => {
             this.service.closeAll$.next();
             this.close();
@@ -522,6 +530,19 @@ class AXContextMenuComponent extends NXComponent {
     }
     // Private Methods (Internal Logic)
     /** @ignore */
+    setupCloseOnRouteChange() {
+        if (!this.router || !isPlatformBrowser(this.platformID)) {
+            return;
+        }
+        this.router.events
+            .pipe(filter((event) => event instanceof NavigationStart), takeUntilDestroyed(this.destroyRef))
+            .subscribe(() => {
+            if (this.closeOnRouteChange()) {
+                this.close();
+            }
+        });
+    }
+    /** @ignore */
     getTargetElements() {
         if (isPlatformBrowser(this.platformID)) {
             const elements = typeof this.target() == 'string'
@@ -711,7 +732,7 @@ class AXContextMenuComponent extends NXComponent {
         return ['ax-menu-container', `ax-orientation-${this.orientation()}`, 'ax-action-list', 'ax-action-list-vertical'];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXContextMenuComponent, isStandalone: true, selector: "ax-context-menu", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, openOn: { classPropertyName: "openOn", publicName: "openOn", isSignal: true, isRequired: false, transformFunction: null }, closeOn: { classPropertyName: "closeOn", publicName: "closeOn", isSignal: true, isRequired: false, transformFunction: null }, originalItems: { classPropertyName: "originalItems", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onItemClick: "onItemClick", onOpening: "onOpening", onClose: "onClose" }, host: { listeners: { "window:scroll": "onWindowEvent($event)", "window:resize": "onWindowEvent($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXContextMenuComponent, isStandalone: true, selector: "ax-context-menu", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, openOn: { classPropertyName: "openOn", publicName: "openOn", isSignal: true, isRequired: false, transformFunction: null }, closeOn: { classPropertyName: "closeOn", publicName: "closeOn", isSignal: true, isRequired: false, transformFunction: null }, closeOnRouteChange: { classPropertyName: "closeOnRouteChange", publicName: "closeOnRouteChange", isSignal: true, isRequired: false, transformFunction: null }, originalItems: { classPropertyName: "originalItems", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onItemClick: "onItemClick", onOpening: "onOpening", onClose: "onClose" }, host: { listeners: { "window:scroll": "onWindowEvent($event)", "window:resize": "onWindowEvent($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
             AXMenuService,
             {
                 provide: AXRootMenu,