@acorex/components 17.0.3 → 17.0.5

package/fesm2022/acorex-components-menu.mjs

@@ -1,8 +1,9 @@
+import * as i0 from '@angular/core';
+import { input, Injectable, inject, signal, output, afterNextRender, Component, ViewChild, ContentChildren, HostBinding, HostListener, ViewEncapsulation, NgModule } from '@angular/core';
 import { MXInteractiveComponent, MXBaseComponent } from '@acorex/components/common';
 import * as i1 from '@acorex/components/popover';
 import { AXPopoverComponent, AXPopoverModule } from '@acorex/components/popover';
-import * as i0 from '@angular/core';
-import { EventEmitter, inject, Component, ViewChild, Input, Output, ContentChildren, HostBinding, HostListener, ViewEncapsulation, NgModule } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
 import { AXDecoratorModule } from '@acorex/components/decorators';
 import { AXLoadingModule } from '@acorex/components/loading';
 import { AXTranslationModule } from '@acorex/core/translation';
@@ -10,51 +11,46 @@ import { OverlayModule } from '@angular/cdk/overlay';
 import { CommonModule } from '@angular/common';
 
 class AXRootMenu {
+    constructor() {
+        this.orientation = input('horizontal');
+        this.openOn = input('toggle');
+    }
 }
 
+class AXMenuService {
+    constructor() {
+        this.activeMenus$ = new BehaviorSubject([]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
 class AXMenuItemComponent extends MXInteractiveComponent {
     constructor() {
-        super(...arguments);
-        this.offsetY = 0;
-        this.offsetX = 0;
-        this.activeChange = new EventEmitter();
-        this._active = false;
-        this.onClick = new EventEmitter();
+        super();
+        this.menuService = inject(AXMenuService);
+        this.offsetY = signal(0);
+        this.offsetX = signal(0);
+        this.text = input();
+        this.active = input();
+        this.activeChange = output();
+        this.onClick = output();
         this.isRoot = false;
         this.rootMenu = inject(AXRootMenu);
-    }
-    /**
-     *  Providing a string value for its text state
-     */
-    get text() {
-        return this._text;
-    }
-    set text(v) {
-        this.setOption({
-            name: 'text',
-            value: v,
-        });
-    }
-    /**
-     *  Providing a string value for its text state
-     */
-    get active() {
-        return this._active;
-    }
-    set active(v) {
-        this.setOption({
-            name: 'active',
-            value: v,
-        });
-    }
-    ngAfterViewInit() {
-        // this.children.forEach(c=>)
-        this.children.forEach((c) => {
-            c.parent = this;
+        afterNextRender(() => {
+            this.children.forEach((c) => {
+                c.parent = this;
+            });
+            this.offsetY.set(this.isRoot ? 8 : 0);
+            this.offsetX.set(this.isRoot ? 0 : 4);
+            this.getPlacement();
         });
-        this.offsetY = this.isRoot ? 8 : 0;
-        this.offsetX = this.isRoot ? 0 : 4;
-        this.getPlacement();
     }
     close() {
         this.popover?.close();
@@ -71,6 +67,9 @@ class AXMenuItemComponent extends MXInteractiveComponent {
                 c.close();
             }
         });
+        if (this.children.length) {
+            this.menuService.activeMenus$.next(this.menuService.activeMenus$.getValue().concat(this));
+        }
     }
     _handleOnClosed() {
         this.children.forEach((c) => {
@@ -78,15 +77,15 @@ class AXMenuItemComponent extends MXInteractiveComponent {
         });
     }
     getIcon() {
-        switch (this.rootMenu.orientation) {
-            case 'vertical':
-                return 'ax-icon-arrow-right';
-            case 'horizontal':
-                return 'ax-icon-arrow-down';
+        if (this.rootMenu.orientation() == 'vertical') {
+            return 'ax-icon-arrow-right';
+        }
+        else {
+            return 'ax-icon-arrow-down';
         }
     }
     getPlacement() {
-        switch (this.rootMenu.orientation) {
+        switch (this.rootMenu.orientation()) {
             case 'horizontal':
                 if (this.isRoot) {
                     return 'bottom-start';
@@ -108,7 +107,7 @@ class AXMenuItemComponent extends MXInteractiveComponent {
         }
     }
     get __hostClass() {
-        return [`${this.disabled ? 'ax-state-disabled' : ''}`, `${this.active ? 'ax-state-active' : ''}`];
+        return [`${this.disabled ? 'ax-state-disabled' : ''}`, `${this.active() ? 'ax-state-active' : ''}`];
     }
     __hostClick(e) {
         if (!this.disabled) {
@@ -117,25 +116,21 @@ class AXMenuItemComponent extends MXInteractiveComponent {
                 htmlElement: this.getHostElement(),
                 nativeEvent: e,
             });
+            if (!this.children.length) {
+                this.menuService.activeMenus$.subscribe((c) => c.forEach((x) => x.close())).unsubscribe();
+                this.menuService.activeMenus$.next([]);
+            }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.2", type: AXMenuItemComponent, selector: "ax-menu-item", inputs: { disabled: "disabled", text: "text", active: "active" }, outputs: { activeChange: "activeChange", onClick: "onClick" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "click": "__hostClick($event)" }, properties: { "class": "this.__hostClass" } }, queries: [{ propertyName: "children", predicate: AXMenuItemComponent }], viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-menu-item-start-side\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <div class=\"ax-menu-item-text\">{{ text }}</div>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n@if(children.length){\n<i class=\"ax-icon ax-icon-solid {{ getIcon() }} ax-menu-item-child-icon\"></i>\n}\n<ax-popover #popover [closeOn]=\"'clickOut'\" [openOn]=\"rootMenu.openOn\" [target]=\"getHostElement()\" [offsetY]=\"offsetY\"\n  [offsetX]=\"offsetX\" [placement]=\"getPlacement()\" (onOpened)=\"_handleOnOpened()\" (onClosed)=\"_handleOnClosed()\">\n  <div class=\"ax-menu-item-children ax-parent-{{ this.rootMenu.orientation }}\">\n    <ng-content select=\"ax-menu-item\"></ng-content>\n  </div>\n</ax-popover>", dependencies: [{ kind: "component", type: i1.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.2", type: AXMenuItemComponent, selector: "ax-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeChange: "activeChange", onClick: "onClick" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "click": "__hostClick($event)" }, properties: { "class": "this.__hostClass" } }, queries: [{ propertyName: "children", predicate: AXMenuItemComponent }], viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-menu-item-start-side\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <div class=\"ax-menu-item-text\">{{ text() }}</div>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n@if(children.length){\n<i class=\"ax-icon ax-icon-solid {{ getIcon() }} ax-menu-item-child-icon\"></i>\n}\n<ax-popover #popover [closeOn]=\"'clickOut'\" [openOn]=\"rootMenu.openOn()\" [target]=\"getHostElement()\"\n  [offsetY]=\"offsetY()\" [offsetX]=\"offsetX()\" [placement]=\"getPlacement()\" (onOpened)=\"_handleOnOpened()\"\n  (onClosed)=\"_handleOnClosed()\">\n  <div class=\"ax-menu-item-children ax-parent-{{ this.rootMenu.orientation() }}\">\n    <ng-content select=\"ax-menu-item\"></ng-content>\n  </div>\n</ax-popover>", dependencies: [{ kind: "component", type: i1.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-menu-item', inputs: ['disabled'], host: { ngSkipHydration: 'true' }, template: "<div class=\"ax-menu-item-start-side\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <div class=\"ax-menu-item-text\">{{ text }}</div>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n@if(children.length){\n<i class=\"ax-icon ax-icon-solid {{ getIcon() }} ax-menu-item-child-icon\"></i>\n}\n<ax-popover #popover [closeOn]=\"'clickOut'\" [openOn]=\"rootMenu.openOn\" [target]=\"getHostElement()\" [offsetY]=\"offsetY\"\n  [offsetX]=\"offsetX\" [placement]=\"getPlacement()\" (onOpened)=\"_handleOnOpened()\" (onClosed)=\"_handleOnClosed()\">\n  <div class=\"ax-menu-item-children ax-parent-{{ this.rootMenu.orientation }}\">\n    <ng-content select=\"ax-menu-item\"></ng-content>\n  </div>\n</ax-popover>" }]
-        }], propDecorators: { popover: [{
+            args: [{ selector: 'ax-menu-item', inputs: ['disabled'], host: { ngSkipHydration: 'true' }, template: "<div class=\"ax-menu-item-start-side\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <div class=\"ax-menu-item-text\">{{ text() }}</div>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n@if(children.length){\n<i class=\"ax-icon ax-icon-solid {{ getIcon() }} ax-menu-item-child-icon\"></i>\n}\n<ax-popover #popover [closeOn]=\"'clickOut'\" [openOn]=\"rootMenu.openOn()\" [target]=\"getHostElement()\"\n  [offsetY]=\"offsetY()\" [offsetX]=\"offsetX()\" [placement]=\"getPlacement()\" (onOpened)=\"_handleOnOpened()\"\n  (onClosed)=\"_handleOnClosed()\">\n  <div class=\"ax-menu-item-children ax-parent-{{ this.rootMenu.orientation() }}\">\n    <ng-content select=\"ax-menu-item\"></ng-content>\n  </div>\n</ax-popover>" }]
+        }], ctorParameters: () => [], propDecorators: { popover: [{
                 type: ViewChild,
                 args: [AXPopoverComponent]
-            }], text: [{
-                type: Input
-            }], activeChange: [{
-                type: Output
-            }], active: [{
-                type: Input
-            }], onClick: [{
-                type: Output
             }], children: [{
                 type: ContentChildren,
                 args: [AXMenuItemComponent]
@@ -150,8 +145,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
 class AXMenuComponent extends MXBaseComponent {
     constructor() {
         super(...arguments);
-        this.orientation = 'horizontal';
-        this.openOn = 'click';
+        this.orientation = input('horizontal');
+        this.openOn = input('toggle');
     }
     ngAfterViewInit() {
         this.children.forEach((c) => {
@@ -160,15 +155,18 @@ class AXMenuComponent extends MXBaseComponent {
         });
     }
     get __hostClass() {
-        return `ax-orientation-${this.orientation}`;
+        return `ax-orientation-${this.orientation()}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: AXMenuComponent, selector: "ax-menu", inputs: { orientation: "orientation", openOn: "openOn" }, host: { properties: { "class": "this.__hostClass" } }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.2", type: AXMenuComponent, selector: "ax-menu", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, openOn: { classPropertyName: "openOn", publicName: "openOn", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.__hostClass" } }, providers: [
             {
                 provide: AXRootMenu,
                 useExisting: AXMenuComponent,
             },
-        ], queries: [{ propertyName: "children", predicate: AXMenuItemComponent }], usesInheritance: true, ngImport: i0, template: `<ng-content select="ax-menu-item,ng-container"></ng-content>`, isInline: true, styles: ["ax-menu{width:100%;font-size:.875rem;line-height:1.25rem;color:inherit}ax-menu.ax-orientation-horizontal{display:flex}ax-menu.ax-orientation-horizontal ax-menu-item:not(ax-menu.ax-orientation-horizontal ax-menu-item:last-child){margin-inline-end:1rem}ax-menu.ax-orientation-vertical{display:flex;flex-direction:column}ax-menu.ax-orientation-vertical ax-menu-item{justify-content:space-between}ax-menu.ax-orientation-vertical ax-menu-item:not(ax-menu.ax-orientation-vertical ax-menu-item:last-child){margin-bottom:1.75rem}ax-menu ax-menu-item:hover:not(ax-menu ax-menu-item:hover.ax-state-disabled){color:rgba(var(--ax-color-primary-500))}ax-menu-item{position:relative;display:flex;align-items:center;gap:.5rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;justify-content:space-between}ax-menu-item:not(ax-menu-item.ax-state-disabled){cursor:pointer}ax-menu-item .ax-menu-item-start-side{display:flex;align-items:center;gap:.5rem}ax-menu-item.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-menu-item.ax-state-selected{color:rgba(var(--ax-color-primary-500))}ax-menu-item .ax-menu-item-child-icon{width:fit-content;line-height:1}ax-menu-item ax-popover{position:absolute}.ax-menu-item-children{padding-top:.5rem;padding-bottom:.5rem}.ax-menu-item-children:not(.ax-menu-item-children:empty){display:flex;min-width:12rem;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item{padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled){background-color:rgba(var(--ax-color-on-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-suffix{opacity:1}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-suffix{opacity:.75}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item .ax-menu-item-text{flex:1 1 0%}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon:before{-moz-transform:scale(1,-1);-webkit-transform:scale(1,-1);-o-transform:scale(1,-1);-ms-transform:scale(1,-1);transform:scaleY(-1)}.ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+            {
+                provide: AXMenuService,
+            },
+        ], queries: [{ propertyName: "children", predicate: AXMenuItemComponent }], usesInheritance: true, ngImport: i0, template: `<ng-content select="ax-menu-item,ng-container"></ng-content>`, isInline: true, styles: ["ax-menu{width:100%;font-size:.875rem;line-height:1.25rem;color:inherit}ax-menu.ax-orientation-horizontal{display:flex}ax-menu.ax-orientation-horizontal ax-menu-item:not(ax-menu.ax-orientation-horizontal ax-menu-item:last-child){margin-inline-end:1rem}ax-menu.ax-orientation-vertical{display:flex;flex-direction:column}ax-menu.ax-orientation-vertical ax-menu-item{justify-content:space-between}ax-menu.ax-orientation-vertical ax-menu-item:not(ax-menu.ax-orientation-vertical ax-menu-item:last-child){margin-bottom:1rem}ax-menu ax-menu-item:hover:not(ax-menu ax-menu-item:hover.ax-state-disabled){color:rgba(var(--ax-color-primary-500))}ax-menu-item{position:relative;display:flex;align-items:center;gap:.5rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;justify-content:space-between}ax-menu-item:not(ax-menu-item.ax-state-disabled){cursor:pointer}ax-menu-item .ax-menu-item-start-side{display:flex;align-items:center;gap:.5rem}ax-menu-item.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-menu-item.ax-state-selected{color:rgba(var(--ax-color-primary-500))}ax-menu-item .ax-menu-item-child-icon{width:fit-content;line-height:1}ax-menu-item ax-popover{position:absolute}.ax-menu-item-children{padding-top:.5rem;padding-bottom:.5rem}.ax-menu-item-children:not(.ax-menu-item-children:empty){display:flex;min-width:12rem;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item{padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled){background-color:rgba(var(--ax-color-on-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-suffix{opacity:1}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-suffix{opacity:.75}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item .ax-menu-item-text{flex:1 1 0%}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon:before{-moz-transform:scale(1,-1);-webkit-transform:scale(1,-1);-o-transform:scale(1,-1);-ms-transform:scale(1,-1);transform:scaleY(-1)}.ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}\n"], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuComponent, decorators: [{
             type: Component,
@@ -177,12 +175,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
                             provide: AXRootMenu,
                             useExisting: AXMenuComponent,
                         },
-                    ], styles: ["ax-menu{width:100%;font-size:.875rem;line-height:1.25rem;color:inherit}ax-menu.ax-orientation-horizontal{display:flex}ax-menu.ax-orientation-horizontal ax-menu-item:not(ax-menu.ax-orientation-horizontal ax-menu-item:last-child){margin-inline-end:1rem}ax-menu.ax-orientation-vertical{display:flex;flex-direction:column}ax-menu.ax-orientation-vertical ax-menu-item{justify-content:space-between}ax-menu.ax-orientation-vertical ax-menu-item:not(ax-menu.ax-orientation-vertical ax-menu-item:last-child){margin-bottom:1.75rem}ax-menu ax-menu-item:hover:not(ax-menu ax-menu-item:hover.ax-state-disabled){color:rgba(var(--ax-color-primary-500))}ax-menu-item{position:relative;display:flex;align-items:center;gap:.5rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;justify-content:space-between}ax-menu-item:not(ax-menu-item.ax-state-disabled){cursor:pointer}ax-menu-item .ax-menu-item-start-side{display:flex;align-items:center;gap:.5rem}ax-menu-item.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-menu-item.ax-state-selected{color:rgba(var(--ax-color-primary-500))}ax-menu-item .ax-menu-item-child-icon{width:fit-content;line-height:1}ax-menu-item ax-popover{position:absolute}.ax-menu-item-children{padding-top:.5rem;padding-bottom:.5rem}.ax-menu-item-children:not(.ax-menu-item-children:empty){display:flex;min-width:12rem;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item{padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled){background-color:rgba(var(--ax-color-on-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-suffix{opacity:1}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-suffix{opacity:.75}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item .ax-menu-item-text{flex:1 1 0%}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon:before{-moz-transform:scale(1,-1);-webkit-transform:scale(1,-1);-o-transform:scale(1,-1);-ms-transform:scale(1,-1);transform:scaleY(-1)}.ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}\n"] }]
-        }], propDecorators: { orientation: [{
-                type: Input
-            }], openOn: [{
-                type: Input
-            }], children: [{
+                        {
+                            provide: AXMenuService,
+                        },
+                    ], styles: ["ax-menu{width:100%;font-size:.875rem;line-height:1.25rem;color:inherit}ax-menu.ax-orientation-horizontal{display:flex}ax-menu.ax-orientation-horizontal ax-menu-item:not(ax-menu.ax-orientation-horizontal ax-menu-item:last-child){margin-inline-end:1rem}ax-menu.ax-orientation-vertical{display:flex;flex-direction:column}ax-menu.ax-orientation-vertical ax-menu-item{justify-content:space-between}ax-menu.ax-orientation-vertical ax-menu-item:not(ax-menu.ax-orientation-vertical ax-menu-item:last-child){margin-bottom:1rem}ax-menu ax-menu-item:hover:not(ax-menu ax-menu-item:hover.ax-state-disabled){color:rgba(var(--ax-color-primary-500))}ax-menu-item{position:relative;display:flex;align-items:center;gap:.5rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;justify-content:space-between}ax-menu-item:not(ax-menu-item.ax-state-disabled){cursor:pointer}ax-menu-item .ax-menu-item-start-side{display:flex;align-items:center;gap:.5rem}ax-menu-item.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-menu-item.ax-state-selected{color:rgba(var(--ax-color-primary-500))}ax-menu-item .ax-menu-item-child-icon{width:fit-content;line-height:1}ax-menu-item ax-popover{position:absolute}.ax-menu-item-children{padding-top:.5rem;padding-bottom:.5rem}.ax-menu-item-children:not(.ax-menu-item-children:empty){display:flex;min-width:12rem;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item{padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled){background-color:rgba(var(--ax-color-on-surface))}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover:not(.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item:hover.ax-state-disabled) ax-suffix{opacity:1}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-prefix,.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item ax-suffix{opacity:.75}.ax-menu-item-children:not(.ax-menu-item-children:empty) ax-menu-item .ax-menu-item-text{flex:1 1 0%}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}html[dir=rtl] .ax-parent-horizontal .ax-menu-item-child-icon:before{-moz-transform:scale(1,-1);-webkit-transform:scale(1,-1);-o-transform:scale(1,-1);-ms-transform:scale(1,-1);transform:scaleY(-1)}.ax-parent-horizontal .ax-menu-item-child-icon{transform:rotate(-90deg)}\n"] }]
+        }], propDecorators: { children: [{
                 type: ContentChildren,
                 args: [AXMenuItemComponent]
             }], __hostClass: [{
@@ -191,20 +188,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
             }] } });
 
 const COMPONENT = [AXMenuItemComponent, AXMenuComponent];
-const MODULES = [
-    AXDecoratorModule,
-    AXLoadingModule,
-    AXTranslationModule,
-    OverlayModule,
-    AXPopoverModule,
-];
+const MODULES = [AXDecoratorModule, AXLoadingModule, AXTranslationModule, OverlayModule, AXPopoverModule];
 class AXMenuModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: AXMenuModule, declarations: [AXMenuItemComponent, AXMenuComponent], imports: [CommonModule, AXDecoratorModule,
-            AXLoadingModule,
-            AXTranslationModule,
-            OverlayModule,
-            AXPopoverModule], exports: [AXMenuItemComponent, AXMenuComponent] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: AXMenuModule, declarations: [AXMenuItemComponent, AXMenuComponent], imports: [CommonModule, AXDecoratorModule, AXLoadingModule, AXTranslationModule, OverlayModule, AXPopoverModule], exports: [AXMenuItemComponent, AXMenuComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuModule, imports: [CommonModule, MODULES] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXMenuModule, decorators: [{
@@ -221,5 +208,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AXMenuComponent, AXMenuItemComponent, AXMenuModule, AXRootMenu };
+export { AXMenuComponent, AXMenuItemComponent, AXMenuModule, AXMenuService, AXRootMenu };
 //# sourceMappingURL=acorex-components-menu.mjs.map

package/fesm2022/acorex-components-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-menu.mjs","sources":["../../../../libs/components/menu/src/lib/class/root-menu.class.ts","../../../../libs/components/menu/src/lib/menu-item/menu-item.component.ts","../../../../libs/components/menu/src/lib/menu-item/menu-item.component.html","../../../../libs/components/menu/src/lib/menu.component.ts","../../../../libs/components/menu/src/lib/menu.module.ts","../../../../libs/components/menu/src/acorex-components-menu.ts"],"sourcesContent":["import { AXOrientation } from '@acorex/components/common';\nimport { AXPopoverOpenTrigger } from '@acorex/components/popover';\n\nexport class AXRootMenu {\n  orientation: AXOrientation;\n  openOn: AXPopoverOpenTrigger;\n}\n","import { AXClickEvent, MXInteractiveComponent } from '@acorex/components/common';\nimport { AXPopoverComponent } from '@acorex/components/popover';\nimport {\n  AfterViewInit,\n  Component,\n  ContentChildren,\n  EventEmitter,\n  HostBinding,\n  HostListener,\n  Input,\n  Output,\n  QueryList,\n  ViewChild,\n  inject,\n} from '@angular/core';\nimport { AXRootMenu } from '../class/root-menu.class';\n\n@Component({\n  selector: 'ax-menu-item',\n  inputs: ['disabled'],\n  templateUrl: './menu-item.component.html',\n  host: { ngSkipHydration: 'true' },\n})\nexport class AXMenuItemComponent extends MXInteractiveComponent implements AfterViewInit {\n  offsetY = 0;\n  offsetX = 0;\n\n  @ViewChild(AXPopoverComponent)\n  private popover: AXPopoverComponent;\n\n  private _text: string;\n  /**\n   *  Providing a string value for its text state\n   */\n  @Input()\n  public get text(): string {\n    return this._text;\n  }\n  public set text(v: string) {\n    this.setOption({\n      name: 'text',\n      value: v,\n    });\n  }\n\n  @Output()\n  activeChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n  private _active = false;\n  /**\n   *  Providing a string value for its text state\n   */\n  @Input()\n  public get active(): boolean {\n    return this._active;\n  }\n  public set active(v: boolean) {\n    this.setOption({\n      name: 'active',\n      value: v,\n    });\n  }\n\n  @Output()\n  onClick: EventEmitter<AXClickEvent> = new EventEmitter<AXClickEvent>();\n\n  isRoot = false;\n  parent?: AXMenuItemComponent;\n\n  rootMenu = inject(AXRootMenu);\n\n  @ContentChildren(AXMenuItemComponent)\n  children: QueryList<AXMenuItemComponent>;\n\n  ngAfterViewInit() {\n    // this.children.forEach(c=>)\n    this.children.forEach((c) => {\n      c.parent = this;\n    });\n\n    this.offsetY = this.isRoot ? 8 : 0;\n    this.offsetX = this.isRoot ? 0 : 4;\n\n    this.getPlacement();\n  }\n\n  close() {\n    this.popover?.close();\n  }\n\n  // @HostListener('mouseleave', ['$event'])\n  // private onMouseHover(e: MouseEvent) {\n  //   this.children.forEach((c) => {\n  //     c.close();\n  //   });\n  // }\n\n  _handleOnOpened() {\n    this.parent.children.forEach((c) => {\n      if (c != this) {\n        c.close();\n      }\n    });\n  }\n\n  _handleOnClosed() {\n    this.children.forEach((c) => {\n      c.close();\n    });\n  }\n\n  getIcon() {\n    switch (this.rootMenu.orientation) {\n      case 'vertical':\n        return 'ax-icon-arrow-right';\n      case 'horizontal':\n        return 'ax-icon-arrow-down';\n    }\n  }\n\n  getPlacement() {\n    switch (this.rootMenu.orientation) {\n      case 'horizontal':\n        if (this.isRoot) {\n          return 'bottom-start';\n        } else {\n          return 'end-top';\n        }\n        break;\n      case 'vertical':\n        if (this.isRoot) {\n          return 'end-top';\n        } else {\n          return 'end-top';\n        }\n        break;\n      default:\n        return 'bottom-start';\n    }\n  }\n\n  @HostBinding('class')\n  get __hostClass(): string[] {\n    return [`${this.disabled ? 'ax-state-disabled' : ''}`, `${this.active ? 'ax-state-active' : ''}`];\n  }\n\n  @HostListener('click', ['$event'])\n  private __hostClick(e: MouseEvent) {\n    if (!this.disabled) {\n      this.onClick.emit({\n        component: this,\n        htmlElement: this.getHostElement(),\n        nativeEvent: e,\n      });\n    }\n  }\n}\n","<div class=\"ax-menu-item-start-side\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <div class=\"ax-menu-item-text\">{{ text }}</div>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n@if(children.length){\n<i class=\"ax-icon ax-icon-solid {{ getIcon() }} ax-menu-item-child-icon\"></i>\n}\n<ax-popover #popover [closeOn]=\"'clickOut'\" [openOn]=\"rootMenu.openOn\" [target]=\"getHostElement()\" [offsetY]=\"offsetY\"\n  [offsetX]=\"offsetX\" [placement]=\"getPlacement()\" (onOpened)=\"_handleOnOpened()\" (onClosed)=\"_handleOnClosed()\">\n  <div class=\"ax-menu-item-children ax-parent-{{ this.rootMenu.orientation }}\">\n    <ng-content select=\"ax-menu-item\"></ng-content>\n  </div>\n</ax-popover>","import { AXOrientation, MXBaseComponent } from '@acorex/components/common';\nimport { AXPopoverOpenTrigger } from '@acorex/components/popover';\nimport {\n  AfterViewInit,\n  Component,\n  ContentChildren,\n  HostBinding,\n  Input,\n  QueryList,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { AXRootMenu } from './class/root-menu.class';\nimport { AXMenuItemComponent } from './menu-item/menu-item.component';\n\n@Component({\n  selector: 'ax-menu',\n  template: `<ng-content select=\"ax-menu-item,ng-container\"></ng-content>`,\n  styleUrls: ['./menu.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  providers: [\n    {\n      provide: AXRootMenu,\n      useExisting: AXMenuComponent,\n    },\n  ],\n})\nexport class AXMenuComponent extends MXBaseComponent implements AfterViewInit {\n  @Input() orientation: AXOrientation = 'horizontal';\n  @Input() openOn: AXPopoverOpenTrigger = 'click';\n\n  @ContentChildren(AXMenuItemComponent)\n  children: QueryList<AXMenuItemComponent>;\n\n  ngAfterViewInit() {\n    this.children.forEach((c) => {\n      c.isRoot = true;\n      c.parent = this as unknown as AXMenuItemComponent;\n    });\n  }\n\n  @HostBinding('class')\n  get __hostClass(): string {\n    return `ax-orientation-${this.orientation}`;\n  }\n}\n","import { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXPopoverModule } from '@acorex/components/popover';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXMenuItemComponent } from './menu-item/menu-item.component';\nimport { AXMenuComponent } from './menu.component';\n\nconst COMPONENT = [AXMenuItemComponent, AXMenuComponent];\nconst MODULES = [\n  AXDecoratorModule,\n  AXLoadingModule,\n  AXTranslationModule,\n  OverlayModule,\n  AXPopoverModule,\n];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [CommonModule, ...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-menu.mjs","sources":["../../../../libs/components/menu/src/lib/class/root-menu.class.ts","../../../../libs/components/menu/src/lib/menu.service.ts","../../../../libs/components/menu/src/lib/menu-item/menu-item.component.ts","../../../../libs/components/menu/src/lib/menu-item/menu-item.component.html","../../../../libs/components/menu/src/lib/menu.component.ts","../../../../libs/components/menu/src/lib/menu.module.ts","../../../../libs/components/menu/src/acorex-components-menu.ts"],"sourcesContent":["import { AXOrientation } from '@acorex/components/common';\nimport { input } from '@angular/core';\nimport { AXMenuPopoverTrigger } from './popover.class';\n\nexport class AXRootMenu {\n  orientation = input<AXOrientation>('horizontal');\n  openOn = input<AXMenuPopoverTrigger>('toggle');\n}\n","import { Injectable } from '@angular/core';\nimport { BehaviorSubject } from 'rxjs';\nimport { AXMenuItemComponent } from './menu-item/menu-item.component';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class AXMenuService {\n  activeMenus$: BehaviorSubject<AXMenuItemComponent[]> = new BehaviorSubject<AXMenuItemComponent[]>([]);\n}\n","import { AXClickEvent, MXInteractiveComponent } from '@acorex/components/common';\nimport { AXPopoverComponent } from '@acorex/components/popover';\nimport {\n  Component,\n  ContentChildren,\n  HostBinding,\n  HostListener,\n  QueryList,\n  ViewChild,\n  afterNextRender,\n  inject,\n  input,\n  output,\n  signal,\n} from '@angular/core';\nimport { AXRootMenu } from '../class/root-menu.class';\nimport { AXMenuService } from '../menu.service';\n\n@Component({\n  selector: 'ax-menu-item',\n  inputs: ['disabled'],\n  templateUrl: './menu-item.component.html',\n  host: { ngSkipHydration: 'true' },\n})\nexport class AXMenuItemComponent extends MXInteractiveComponent {\n  @ViewChild(AXPopoverComponent)\n  private popover: AXPopoverComponent;\n\n  menuService = inject(AXMenuService);\n\n  offsetY = signal(0);\n  offsetX = signal(0);\n\n  text = input<string>();\n  active = input<boolean>();\n\n  activeChange = output<boolean>();\n  onClick = output<AXClickEvent>();\n\n  isRoot = false;\n  parent?: AXMenuItemComponent;\n\n  rootMenu = inject(AXRootMenu);\n\n  @ContentChildren(AXMenuItemComponent)\n  children: QueryList<AXMenuItemComponent>;\n\n  constructor() {\n    super();\n    afterNextRender(() => {\n      this.children.forEach((c) => {\n        c.parent = this;\n      });\n\n      this.offsetY.set(this.isRoot ? 8 : 0);\n      this.offsetX.set(this.isRoot ? 0 : 4);\n\n      this.getPlacement();\n    });\n  }\n\n  close() {\n    this.popover?.close();\n  }\n\n  // @HostListener('mouseleave', ['$event'])\n  // private onMouseHover(e: MouseEvent) {\n  //   this.children.forEach((c) => {\n  //     c.close();\n  //   });\n  // }\n\n  _handleOnOpened() {\n    this.parent.children.forEach((c) => {\n      if (c != this) {\n        c.close();\n      }\n    });\n    if (this.children.length) {\n      this.menuService.activeMenus$.next(this.menuService.activeMenus$.getValue().concat(this));\n    }\n  }\n\n  _handleOnClosed() {\n    this.children.forEach((c) => {\n      c.close();\n    });\n  }\n\n  getIcon() {\n    if (this.rootMenu.orientation() == 'vertical') {\n      return 'ax-icon-arrow-right';\n    } else {\n      return 'ax-icon-arrow-down';\n    }\n  }\n\n  getPlacement() {\n    switch (this.rootMenu.orientation()) {\n      case 'horizontal':\n        if (this.isRoot) {\n          return 'bottom-start';\n        } else {\n          return 'end-top';\n        }\n        break;\n      case 'vertical':\n        if (this.isRoot) {\n          return 'end-top';\n        } else {\n          return 'end-top';\n        }\n        break;\n      default:\n        return 'bottom-start';\n    }\n  }\n\n  @HostBinding('class')\n  get __hostClass(): string[] {\n    return [`${this.disabled ? 'ax-state-disabled' : ''}`, `${this.active() ? 'ax-state-active' : ''}`];\n  }\n\n  @HostListener('click', ['$event'])\n  private __hostClick(e: MouseEvent) {\n    if (!this.disabled) {\n      this.onClick.emit({\n        component: this,\n        htmlElement: this.getHostElement(),\n        nativeEvent: e,\n      });\n      if (!this.children.length) {\n        this.menuService.activeMenus$.subscribe((c) => c.forEach((x) => x.close())).unsubscribe();\n        this.menuService.activeMenus$.next([]);\n      }\n    }\n  }\n}\n","<div class=\"ax-menu-item-start-side\">\n  <ng-content select=\"ax-prefix\"></ng-content>\n  <div class=\"ax-menu-item-text\">{{ text() }}</div>\n</div>\n<ng-content select=\"ax-suffix\"></ng-content>\n@if(children.length){\n<i class=\"ax-icon ax-icon-solid {{ getIcon() }} ax-menu-item-child-icon\"></i>\n}\n<ax-popover #popover [closeOn]=\"'clickOut'\" [openOn]=\"rootMenu.openOn()\" [target]=\"getHostElement()\"\n  [offsetY]=\"offsetY()\" [offsetX]=\"offsetX()\" [placement]=\"getPlacement()\" (onOpened)=\"_handleOnOpened()\"\n  (onClosed)=\"_handleOnClosed()\">\n  <div class=\"ax-menu-item-children ax-parent-{{ this.rootMenu.orientation() }}\">\n    <ng-content select=\"ax-menu-item\"></ng-content>\n  </div>\n</ax-popover>","import { AXOrientation, MXBaseComponent } from '@acorex/components/common';\nimport { AfterViewInit, Component, ContentChildren, HostBinding, QueryList, ViewEncapsulation, input } from '@angular/core';\nimport { AXMenuPopoverTrigger } from './class/popover.class';\nimport { AXRootMenu } from './class/root-menu.class';\nimport { AXMenuItemComponent } from './menu-item/menu-item.component';\nimport { AXMenuService } from './menu.service';\n\n@Component({\n  selector: 'ax-menu',\n  template: `<ng-content select=\"ax-menu-item,ng-container\"></ng-content>`,\n  styleUrls: ['./menu.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  providers: [\n    {\n      provide: AXRootMenu,\n      useExisting: AXMenuComponent,\n    },\n    {\n      provide: AXMenuService,\n    },\n  ],\n})\nexport class AXMenuComponent extends MXBaseComponent implements AfterViewInit {\n  orientation = input<AXOrientation>('horizontal');\n  openOn = input<AXMenuPopoverTrigger>('toggle');\n\n  @ContentChildren(AXMenuItemComponent)\n  children: QueryList<AXMenuItemComponent>;\n\n  ngAfterViewInit() {\n    this.children.forEach((c) => {\n      c.isRoot = true;\n      c.parent = this as unknown as AXMenuItemComponent;\n    });\n  }\n\n  @HostBinding('class')\n  get __hostClass(): string {\n    return `ax-orientation-${this.orientation()}`;\n  }\n}\n","import { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXPopoverModule } from '@acorex/components/popover';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXMenuItemComponent } from './menu-item/menu-item.component';\nimport { AXMenuComponent } from './menu.component';\n\nconst COMPONENT = [AXMenuItemComponent, AXMenuComponent];\nconst MODULES = [AXDecoratorModule, AXLoadingModule, AXTranslationModule, OverlayModule, AXPopoverModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [CommonModule, ...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-side-menu.mjs

@@ -112,7 +112,7 @@ class AXSideMenuItemComponent extends classes(MXInteractiveComponent, MXColorCom
         this.hasChild = this.elem.nativeElement.getElementsByTagName('ax-side-menu-item').length > 0;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AXSideMenuItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.2", type: AXSideMenuItemComponent, selector: "ax-side-menu-item", inputs: { disabled: "disabled", color: "color", isLoading: "isLoading", text: "text", isCollapsed: "isCollapsed", active: "active" }, outputs: { textChange: "textChange", isCollapsedChange: "isCollapsedChange", activeChange: "activeChange", onClick: "onClick" }, host: { attributes: { "ngSkipHydration": "true" } }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-title\"></ng-content>\n<div [axRipple] class=\"ax-side-item\" [class.ax-state-disabled]=\"disabled\" [class.ax-state-active]=\"active\"\n  (click)=\"_handleClickEvent($event)\">\n  <div class=\"ax-start-side\">\n    <ng-content select=\"ax-prefix\"></ng-content>\n    <ng-content></ng-content>\n  </div>\n  <div class=\"ax-end-side\">\n    <ng-content select=\"ax-suffix\"></ng-content>\n    @if(hasChild && !isLoading){\n    <span class=\"ax-icon ax-icon-chevron-right arrow-icon\" [class.arrow-icon-expand]=\"!isCollapsed\"></span>\n    }\n    @if(isLoading){\n    <ax-loading></ax-loading>\n    }\n  </div>\n</div>\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed\">\n\n  @if(isLoading){\n  <p>\n    {{'loading' | translate | async }}\n  </p>\n  } @else {\n  <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n\n\n  }\n\n\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>", dependencies: [{ kind: "directive", type: i1.AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }, { kind: "component", type: i2.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.AXTranslatorPipe, name: "translate" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.2", type: AXSideMenuItemComponent, selector: "ax-side-menu-item", inputs: { disabled: "disabled", color: "color", isLoading: "isLoading", text: "text", isCollapsed: "isCollapsed", active: "active" }, outputs: { textChange: "textChange", isCollapsedChange: "isCollapsedChange", activeChange: "activeChange", onClick: "onClick" }, host: { attributes: { "ngSkipHydration": "true" } }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-title\"></ng-content>\n<div [axRipple] class=\"ax-side-item\" [class.ax-state-disabled]=\"disabled\" [class.ax-state-active]=\"active\"\n  (click)=\"_handleClickEvent($event)\">\n  <div class=\"ax-start-side\">\n    <ng-content select=\"ax-prefix\"></ng-content>\n    @if(text){\n    <span>{{text}}</span>\n    }\n    <ng-content></ng-content>\n  </div>\n  <div class=\"ax-end-side\">\n    <ng-content select=\"ax-suffix\"></ng-content>\n    @if(hasChild && !isLoading){\n    <span class=\"ax-icon ax-icon-chevron-right arrow-icon\" [class.arrow-icon-expand]=\"!isCollapsed\"></span>\n    }\n    @if(isLoading){\n    <ax-loading></ax-loading>\n    }\n  </div>\n</div>\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed\">\n  @if(isLoading){\n  <p>\n    {{'loading' | translate | async }}\n  </p>\n  } @else {\n  <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n  }\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>", dependencies: [{ kind: "directive", type: i1.AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }, { kind: "component", type: i2.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.AXTranslatorPipe, name: "translate" }], animations: [
             trigger('collapse', [
                 state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),
                 state('true', style({ height: '0', visibility: 'hidden' })),
@@ -130,7 +130,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
                             transition('false => true', animate(150 + 'ms ease-in')),
                             transition('true => false', animate(150 + 'ms ease-out')),
                         ]),
-                    ], host: { ngSkipHydration: 'true' }, template: "<ng-content select=\"ax-title\"></ng-content>\n<div [axRipple] class=\"ax-side-item\" [class.ax-state-disabled]=\"disabled\" [class.ax-state-active]=\"active\"\n  (click)=\"_handleClickEvent($event)\">\n  <div class=\"ax-start-side\">\n    <ng-content select=\"ax-prefix\"></ng-content>\n    <ng-content></ng-content>\n  </div>\n  <div class=\"ax-end-side\">\n    <ng-content select=\"ax-suffix\"></ng-content>\n    @if(hasChild && !isLoading){\n    <span class=\"ax-icon ax-icon-chevron-right arrow-icon\" [class.arrow-icon-expand]=\"!isCollapsed\"></span>\n    }\n    @if(isLoading){\n    <ax-loading></ax-loading>\n    }\n  </div>\n</div>\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed\">\n\n  @if(isLoading){\n  <p>\n    {{'loading' | translate | async }}\n  </p>\n  } @else {\n  <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n\n\n  }\n\n\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>" }]
+                    ], host: { ngSkipHydration: 'true' }, template: "<ng-content select=\"ax-title\"></ng-content>\n<div [axRipple] class=\"ax-side-item\" [class.ax-state-disabled]=\"disabled\" [class.ax-state-active]=\"active\"\n  (click)=\"_handleClickEvent($event)\">\n  <div class=\"ax-start-side\">\n    <ng-content select=\"ax-prefix\"></ng-content>\n    @if(text){\n    <span>{{text}}</span>\n    }\n    <ng-content></ng-content>\n  </div>\n  <div class=\"ax-end-side\">\n    <ng-content select=\"ax-suffix\"></ng-content>\n    @if(hasChild && !isLoading){\n    <span class=\"ax-icon ax-icon-chevron-right arrow-icon\" [class.arrow-icon-expand]=\"!isCollapsed\"></span>\n    }\n    @if(isLoading){\n    <ax-loading></ax-loading>\n    }\n  </div>\n</div>\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed\">\n  @if(isLoading){\n  <p>\n    {{'loading' | translate | async }}\n  </p>\n  } @else {\n  <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n  }\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { isLoading: [{
                 type: Input
             }], textChange: [{

package/fesm2022/acorex-components-side-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-side-menu.mjs","sources":["../../../../libs/components/side-menu/src/lib/side-menu-item/side-menu-item.compoent.ts","../../../../libs/components/side-menu/src/lib/side-menu-item/side-menu-item.compoent.html","../../../../libs/components/side-menu/src/lib/side-menu.component.ts","../../../../libs/components/side-menu/src/lib/side-menu.component.html","../../../../libs/components/side-menu/src/lib/side-menu.module.ts","../../../../libs/components/side-menu/src/acorex-components-side-menu.ts"],"sourcesContent":["import { AXClickEvent, MXColorComponent, MXInteractiveComponent } from '@acorex/components/common';\nimport { AUTO_STYLE, animate, state, style, transition, trigger } from '@angular/animations';\nimport {\n  AfterContentInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  EventEmitter,\n  Input,\n  Output,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { classes } from 'polytype';\n\nexport class AXSideMenuItemClickEvent extends AXClickEvent {\n  handled = false;\n}\n\n@Component({\n  selector: 'ax-side-menu-item',\n  inputs: ['disabled', 'color'],\n  templateUrl: './side-menu-item.compoent.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  animations: [\n    trigger('collapse', [\n      state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),\n      state('true', style({ height: '0', visibility: 'hidden' })),\n      transition('false => true', animate(150 + 'ms ease-in')),\n      transition('true => false', animate(150 + 'ms ease-out')),\n    ]),\n  ],\n  host: { ngSkipHydration: 'true' },\n})\nexport class AXSideMenuItemComponent extends classes(MXInteractiveComponent, MXColorComponent) implements AfterContentInit {\n  private _isLoading = false;\n  /**\n   *  Providing a boolean value for its collapse state\n   */\n  @Input()\n  public get isLoading(): boolean {\n    return this._isLoading;\n  }\n  public set isLoading(v: boolean) {\n    this.setOption({\n      name: 'isLoading',\n      value: v,\n      afterCallback: () => {\n        this.cdr.detectChanges();\n      },\n    });\n  }\n\n  @Output()\n  textChange: EventEmitter<any> = new EventEmitter<any>();\n\n  private _text: string;\n  /**\n   *  Providing a string value for its text state\n   */\n  @Input()\n  public get text(): string {\n    return this._text;\n  }\n  public set text(v: string) {\n    this.setOption({\n      name: 'text',\n      value: v,\n    });\n  }\n\n  @Output()\n  isCollapsedChange: EventEmitter<any> = new EventEmitter<any>();\n\n  private _isCollapsed = false;\n  /**\n   *  Providing a boolean value for its collapse state\n   */\n  @Input()\n  public get isCollapsed(): boolean {\n    return this._isCollapsed;\n  }\n  public set isCollapsed(v: boolean) {\n    this.setOption({\n      name: 'isCollapsed',\n      value: v,\n      afterCallback: () => {\n        this.cdr.detectChanges();\n      },\n    });\n  }\n\n  @Output()\n  activeChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n  private _active = false;\n  /**\n   *  Providing a string value for its text state\n   */\n  @Input()\n  public get active(): boolean {\n    return this._active;\n  }\n  public set active(v: boolean) {\n    this.setOption({\n      name: 'active',\n      value: v,\n    });\n  }\n\n  @Output()\n  onClick: EventEmitter<AXSideMenuItemClickEvent> = new EventEmitter<AXSideMenuItemClickEvent>();\n\n  protected hasChild = false;\n\n  constructor(private elem: ElementRef) {\n    super();\n  }\n\n  _handleClickEvent(e: MouseEvent) {\n    if (this.disabled || this.isLoading) return;\n    const event = {\n      component: this,\n      htmlElement: this.getHostElement(),\n      nativeEvent: e,\n      handled: false,\n    };\n    this.onClick.emit(event);\n    if (!event.handled) {\n      this.toggle();\n    }\n    e.stopPropagation();\n  }\n\n  toggle() {\n    this.isCollapsed = !this.isCollapsed;\n  }\n\n  open() {\n    this.isCollapsed = true;\n  }\n\n  close() {\n    this.isCollapsed = false;\n  }\n\n  ngAfterContentInit(): void {\n    this.hasChild = this.elem.nativeElement.getElementsByTagName('ax-side-menu-item').length > 0;\n  }\n}\n","<ng-content select=\"ax-title\"></ng-content>\n<div [axRipple] class=\"ax-side-item\" [class.ax-state-disabled]=\"disabled\" [class.ax-state-active]=\"active\"\n  (click)=\"_handleClickEvent($event)\">\n  <div class=\"ax-start-side\">\n    <ng-content select=\"ax-prefix\"></ng-content>\n    <ng-content></ng-content>\n  </div>\n  <div class=\"ax-end-side\">\n    <ng-content select=\"ax-suffix\"></ng-content>\n    @if(hasChild && !isLoading){\n    <span class=\"ax-icon ax-icon-chevron-right arrow-icon\" [class.arrow-icon-expand]=\"!isCollapsed\"></span>\n    }\n    @if(isLoading){\n    <ax-loading></ax-loading>\n    }\n  </div>\n</div>\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed\">\n\n  @if(isLoading){\n  <p>\n    {{'loading' | translate | async }}\n  </p>\n  } @else {\n  <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n\n\n  }\n\n\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>","import { MXBaseComponent } from '@acorex/components/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n} from '@angular/core';\n\n@Component({\n  selector: 'ax-side-menu',\n  templateUrl: './side-menu.component.html',\n  styleUrls: ['./side-menu.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXSideMenuComponent extends MXBaseComponent {}\n","<ng-content select=\"ax-side-menu-item,ax-title,ng-container,ng-content\"></ng-content>","import { AXCommonModule, AXRippleDirective } from '@acorex/components/common';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXSideMenuItemComponent } from './side-menu-item/side-menu-item.compoent';\nimport { AXSideMenuComponent } from './side-menu.component';\n\nconst COMPONENT = [AXSideMenuComponent, AXSideMenuItemComponent];\nconst MODULES = [CommonModule, AXCommonModule, AXRippleDirective, AXLoadingModule, AXTranslationModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXSideMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-side-menu.mjs","sources":["../../../../libs/components/side-menu/src/lib/side-menu-item/side-menu-item.compoent.ts","../../../../libs/components/side-menu/src/lib/side-menu-item/side-menu-item.compoent.html","../../../../libs/components/side-menu/src/lib/side-menu.component.ts","../../../../libs/components/side-menu/src/lib/side-menu.component.html","../../../../libs/components/side-menu/src/lib/side-menu.module.ts","../../../../libs/components/side-menu/src/acorex-components-side-menu.ts"],"sourcesContent":["import { AXClickEvent, MXColorComponent, MXInteractiveComponent } from '@acorex/components/common';\nimport { AUTO_STYLE, animate, state, style, transition, trigger } from '@angular/animations';\nimport {\n  AfterContentInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  EventEmitter,\n  Input,\n  Output,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { classes } from 'polytype';\n\nexport class AXSideMenuItemClickEvent extends AXClickEvent {\n  handled = false;\n}\n\n@Component({\n  selector: 'ax-side-menu-item',\n  inputs: ['disabled', 'color'],\n  templateUrl: './side-menu-item.compoent.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  animations: [\n    trigger('collapse', [\n      state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),\n      state('true', style({ height: '0', visibility: 'hidden' })),\n      transition('false => true', animate(150 + 'ms ease-in')),\n      transition('true => false', animate(150 + 'ms ease-out')),\n    ]),\n  ],\n  host: { ngSkipHydration: 'true' },\n})\nexport class AXSideMenuItemComponent extends classes(MXInteractiveComponent, MXColorComponent) implements AfterContentInit {\n  private _isLoading = false;\n  /**\n   *  Providing a boolean value for its collapse state\n   */\n  @Input()\n  public get isLoading(): boolean {\n    return this._isLoading;\n  }\n  public set isLoading(v: boolean) {\n    this.setOption({\n      name: 'isLoading',\n      value: v,\n      afterCallback: () => {\n        this.cdr.detectChanges();\n      },\n    });\n  }\n\n  @Output()\n  textChange: EventEmitter<any> = new EventEmitter<any>();\n\n  private _text: string;\n  /**\n   *  Providing a string value for its text state\n   */\n  @Input()\n  public get text(): string {\n    return this._text;\n  }\n  public set text(v: string) {\n    this.setOption({\n      name: 'text',\n      value: v,\n    });\n  }\n\n  @Output()\n  isCollapsedChange: EventEmitter<any> = new EventEmitter<any>();\n\n  private _isCollapsed = false;\n  /**\n   *  Providing a boolean value for its collapse state\n   */\n  @Input()\n  public get isCollapsed(): boolean {\n    return this._isCollapsed;\n  }\n  public set isCollapsed(v: boolean) {\n    this.setOption({\n      name: 'isCollapsed',\n      value: v,\n      afterCallback: () => {\n        this.cdr.detectChanges();\n      },\n    });\n  }\n\n  @Output()\n  activeChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n  private _active = false;\n  /**\n   *  Providing a string value for its text state\n   */\n  @Input()\n  public get active(): boolean {\n    return this._active;\n  }\n  public set active(v: boolean) {\n    this.setOption({\n      name: 'active',\n      value: v,\n    });\n  }\n\n  @Output()\n  onClick: EventEmitter<AXSideMenuItemClickEvent> = new EventEmitter<AXSideMenuItemClickEvent>();\n\n  protected hasChild = false;\n\n  constructor(private elem: ElementRef) {\n    super();\n  }\n\n  _handleClickEvent(e: MouseEvent) {\n    if (this.disabled || this.isLoading) return;\n    const event = {\n      component: this,\n      htmlElement: this.getHostElement(),\n      nativeEvent: e,\n      handled: false,\n    };\n    this.onClick.emit(event);\n    if (!event.handled) {\n      this.toggle();\n    }\n    e.stopPropagation();\n  }\n\n  toggle() {\n    this.isCollapsed = !this.isCollapsed;\n  }\n\n  open() {\n    this.isCollapsed = true;\n  }\n\n  close() {\n    this.isCollapsed = false;\n  }\n\n  ngAfterContentInit(): void {\n    this.hasChild = this.elem.nativeElement.getElementsByTagName('ax-side-menu-item').length > 0;\n  }\n}\n","<ng-content select=\"ax-title\"></ng-content>\n<div [axRipple] class=\"ax-side-item\" [class.ax-state-disabled]=\"disabled\" [class.ax-state-active]=\"active\"\n  (click)=\"_handleClickEvent($event)\">\n  <div class=\"ax-start-side\">\n    <ng-content select=\"ax-prefix\"></ng-content>\n    @if(text){\n    <span>{{text}}</span>\n    }\n    <ng-content></ng-content>\n  </div>\n  <div class=\"ax-end-side\">\n    <ng-content select=\"ax-suffix\"></ng-content>\n    @if(hasChild && !isLoading){\n    <span class=\"ax-icon ax-icon-chevron-right arrow-icon\" [class.arrow-icon-expand]=\"!isCollapsed\"></span>\n    }\n    @if(isLoading){\n    <ax-loading></ax-loading>\n    }\n  </div>\n</div>\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed\">\n  @if(isLoading){\n  <p>\n    {{'loading' | translate | async }}\n  </p>\n  } @else {\n  <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n  }\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>","import { MXBaseComponent } from '@acorex/components/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n} from '@angular/core';\n\n@Component({\n  selector: 'ax-side-menu',\n  templateUrl: './side-menu.component.html',\n  styleUrls: ['./side-menu.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class AXSideMenuComponent extends MXBaseComponent {}\n","<ng-content select=\"ax-side-menu-item,ax-title,ng-container,ng-content\"></ng-content>","import { AXCommonModule, AXRippleDirective } from '@acorex/components/common';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXSideMenuItemComponent } from './side-menu-item/side-menu-item.compoent';\nimport { AXSideMenuComponent } from './side-menu.component';\n\nconst COMPONENT = [AXSideMenuComponent, AXSideMenuItemComponent];\nconst MODULES = [CommonModule, AXCommonModule, AXRippleDirective, AXLoadingModule, AXTranslationModule];\n\n@NgModule({\n  declarations: [...COMPONENT],\n  imports: [...MODULES],\n  exports: [...COMPONENT],\n  providers: [],\n})\nexport class AXSideMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/menu/index.d.ts

@@ -1,4 +1,6 @@
+export * from './lib/class/popover.class';
 export * from './lib/class/root-menu.class';
 export * from './lib/menu-item/menu-item.component';
 export * from './lib/menu.component';
 export * from './lib/menu.module';
+export * from './lib/menu.service';

package/menu/lib/class/popover.class.d.ts

@@ -0,0 +1,2 @@
+import { AXPopoverOpenTrigger } from '@acorex/components/popover';
+export type AXMenuPopoverTrigger = Exclude<AXPopoverOpenTrigger, 'manual'>;

package/menu/lib/class/root-menu.class.d.ts

@@ -1,6 +1,6 @@
 import { AXOrientation } from '@acorex/components/common';
-import { AXPopoverOpenTrigger } from '@acorex/components/popover';
+import { AXMenuPopoverTrigger } from './popover.class';
 export declare class AXRootMenu {
-    orientation: AXOrientation;
-    openOn: AXPopoverOpenTrigger;
+    orientation: import("@angular/core").InputSignal<AXOrientation>;
+    openOn: import("@angular/core").InputSignal<AXMenuPopoverTrigger>;
 }

package/menu/lib/menu-item/menu-item.component.d.ts

@@ -1,30 +1,22 @@
 import { AXClickEvent, MXInteractiveComponent } from '@acorex/components/common';
-import { AfterViewInit, EventEmitter, QueryList } from '@angular/core';
+import { QueryList } from '@angular/core';
 import { AXRootMenu } from '../class/root-menu.class';
+import { AXMenuService } from '../menu.service';
 import * as i0 from "@angular/core";
-export declare class AXMenuItemComponent extends MXInteractiveComponent implements AfterViewInit {
-    offsetY: number;
-    offsetX: number;
+export declare class AXMenuItemComponent extends MXInteractiveComponent {
     private popover;
-    private _text;
-    /**
-     *  Providing a string value for its text state
-     */
-    get text(): string;
-    set text(v: string);
-    activeChange: EventEmitter<boolean>;
-    private _active;
-    /**
-     *  Providing a string value for its text state
-     */
-    get active(): boolean;
-    set active(v: boolean);
-    onClick: EventEmitter<AXClickEvent>;
+    menuService: AXMenuService;
+    offsetY: import("@angular/core").WritableSignal<number>;
+    offsetX: import("@angular/core").WritableSignal<number>;
+    text: import("@angular/core").InputSignal<string>;
+    active: import("@angular/core").InputSignal<boolean>;
+    activeChange: import("@angular/core").OutputEmitterRef<boolean>;
+    onClick: import("@angular/core").OutputEmitterRef<AXClickEvent>;
     isRoot: boolean;
     parent?: AXMenuItemComponent;
     rootMenu: AXRootMenu;
     children: QueryList<AXMenuItemComponent>;
-    ngAfterViewInit(): void;
+    constructor();
     close(): void;
     _handleOnOpened(): void;
     _handleOnClosed(): void;
@@ -33,5 +25,5 @@ export declare class AXMenuItemComponent extends MXInteractiveComponent implemen
     get __hostClass(): string[];
     private __hostClick;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXMenuItemComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXMenuItemComponent, "ax-menu-item", never, { "disabled": { "alias": "disabled"; "required": false; }; "text": { "alias": "text"; "required": false; }; "active": { "alias": "active"; "required": false; }; }, { "activeChange": "activeChange"; "onClick": "onClick"; }, ["children"], ["ax-prefix", "ax-suffix", "ax-menu-item"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AXMenuItemComponent, "ax-menu-item", never, { "disabled": { "alias": "disabled"; "required": false; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "activeChange": "activeChange"; "onClick": "onClick"; }, ["children"], ["ax-prefix", "ax-suffix", "ax-menu-item"], false, never>;
 }

package/menu/lib/menu.component.d.ts

@@ -1,14 +1,14 @@
 import { AXOrientation, MXBaseComponent } from '@acorex/components/common';
-import { AXPopoverOpenTrigger } from '@acorex/components/popover';
 import { AfterViewInit, QueryList } from '@angular/core';
+import { AXMenuPopoverTrigger } from './class/popover.class';
 import { AXMenuItemComponent } from './menu-item/menu-item.component';
 import * as i0 from "@angular/core";
 export declare class AXMenuComponent extends MXBaseComponent implements AfterViewInit {
-    orientation: AXOrientation;
-    openOn: AXPopoverOpenTrigger;
+    orientation: import("@angular/core").InputSignal<AXOrientation>;
+    openOn: import("@angular/core").InputSignal<AXMenuPopoverTrigger>;
     children: QueryList<AXMenuItemComponent>;
     ngAfterViewInit(): void;
     get __hostClass(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXMenuComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AXMenuComponent, "ax-menu", never, { "orientation": { "alias": "orientation"; "required": false; }; "openOn": { "alias": "openOn"; "required": false; }; }, {}, ["children"], ["ax-menu-item,ng-container"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AXMenuComponent, "ax-menu", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "openOn": { "alias": "openOn"; "required": false; "isSignal": true; }; }, {}, ["children"], ["ax-menu-item,ng-container"], false, never>;
 }

package/menu/lib/menu.service.d.ts

@@ -0,0 +1,8 @@
+import { BehaviorSubject } from 'rxjs';
+import { AXMenuItemComponent } from './menu-item/menu-item.component';
+import * as i0 from "@angular/core";
+export declare class AXMenuService {
+    activeMenus$: BehaviorSubject<AXMenuItemComponent[]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AXMenuService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<AXMenuService>;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acorex/components",
-  "version": "17.0.3",
+  "version": "17.0.5",
   "peerDependencies": {
     "@angular/common": "^17.3.2",
     "@angular/core": "^17.3.2",