@acorex/components 21.0.0-next.3 → 21.0.0-next.31

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

@@ -1,10 +1,9 @@
 import { AXClickEvent, MXInteractiveComponent, AXRippleDirective, AXComponent, NXComponent, AXCommonModule } from '@acorex/cdk/common';
 import { AXLoadingComponent, AXLoadingModule } from '@acorex/components/loading';
 import { AXTranslatorPipe, AXTranslationModule } from '@acorex/core/translation';
-import { trigger, state, transition, style, AUTO_STYLE, animate } from '@angular/animations';
 import { NgTemplateOutlet, AsyncPipe, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, ElementRef, model, output, input, signal, afterNextRender, ViewEncapsulation, ChangeDetectionStrategy, Component, viewChildren, HostBinding, Directive, NgModule } from '@angular/core';
+import { model, output, inject, ElementRef, input, signal, afterNextRender, ViewEncapsulation, ChangeDetectionStrategy, Component, viewChildren, HostBinding, Directive, NgModule } from '@angular/core';
 import { RouterLink, RouterLinkActive, Router } from '@angular/router';
 import { AXDecoratorGenericComponent, AXDecoratorIconComponent, AXDecoratorModule } from '@acorex/components/decorators';
 import { AXOutlineContainerDirective } from '@acorex/cdk/outline';
@@ -20,13 +19,13 @@ class AXSideMenuItemClickEvent extends AXClickEvent {
 }
 class AXSideMenuItemComponent extends MXInteractiveComponent {
     constructor() {
-        super();
-        this.elem = inject(ElementRef);
+        super(...arguments);
         this.text = model('', ...(ngDevMode ? [{ debugName: "text" }] : []));
         this.active = model(false, ...(ngDevMode ? [{ debugName: "active" }] : []));
         this.isLoading = model(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
         this.isCollapsed = model(true, ...(ngDevMode ? [{ debugName: "isCollapsed" }] : []));
         this.onClick = output();
+        this.elem = inject(ElementRef);
         this.toggleOnClick = input(true, ...(ngDevMode ? [{ debugName: "toggleOnClick" }] : []));
         this.href = input(...(ngDevMode ? [undefined, { debugName: "href" }] : []));
         this.routerLink = input(...(ngDevMode ? [undefined, { debugName: "routerLink" }] : []));
@@ -34,10 +33,18 @@ class AXSideMenuItemComponent extends MXInteractiveComponent {
         this.routerLinkActiveOptions = input({ exact: false }, ...(ngDevMode ? [{ debugName: "routerLinkActiveOptions" }] : []));
         this.target = input('_self', ...(ngDevMode ? [{ debugName: "target" }] : []));
         this.hasChild = signal(false, ...(ngDevMode ? [{ debugName: "hasChild" }] : []));
-        afterNextRender(() => {
-            this.hasChild.set(this.elem.nativeElement.getElementsByTagName('ax-side-menu-item').length > 0);
+        this.#init = afterNextRender(() => {
+            this.checkForChildren();
         });
     }
+    #init;
+    checkForChildren() {
+        const childrenContainer = this.elem.nativeElement.querySelector('.ax-side-children-content');
+        if (childrenContainer) {
+            const directChildren = childrenContainer.querySelectorAll(':scope > ax-side-menu-item');
+            this.hasChild.set(directChildren.length > 0);
+        }
+    }
     _handleClickEvent(e) {
         if (this.disabled || this.isLoading())
             return;
@@ -62,26 +69,12 @@ class AXSideMenuItemComponent extends MXInteractiveComponent {
     close() {
         this.isCollapsed.set(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXSideMenuItemComponent, isStandalone: true, selector: "ax-side-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 }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isCollapsed: { classPropertyName: "isCollapsed", publicName: "isCollapsed", isSignal: true, isRequired: false, transformFunction: null }, toggleOnClick: { classPropertyName: "toggleOnClick", publicName: "toggleOnClick", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, routerLinkActive: { classPropertyName: "routerLinkActive", publicName: "routerLinkActive", isSignal: true, isRequired: false, transformFunction: null }, routerLinkActiveOptions: { classPropertyName: "routerLinkActiveOptions", publicName: "routerLinkActiveOptions", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { text: "textChange", active: "activeChange", isLoading: "isLoadingChange", isCollapsed: "isCollapsedChange", onClick: "onClick" }, host: { attributes: { "ngSkipHydration": "true" } }, providers: [{ provide: AXComponent, useExisting: AXSideMenuItemComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-title\"></ng-content>\n@if (routerLink()) {\n  <a\n    [axRipple]\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [routerLink]=\"routerLink()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n    [routerLinkActive]=\"routerLinkActive()\"\n    [routerLinkActiveOptions]=\"routerLinkActiveOptions()\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else if (href()) {\n  <a\n    [axRipple]\n    [href]=\"href()\"\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else {\n  <div\n    [axRipple]\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </div>\n}\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed()\">\n  @if (isLoading()) {\n    <p>{{ '@acorex:common.status.loading' | translate | async }}</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>\n<ng-template #menuItemContent>\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 select=\"ax-text\"></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() && toggleOnClick()) {\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</ng-template>\n", dependencies: [{ kind: "directive", type: AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], animations: [
-            trigger('collapse', [
-                state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),
-                state('true', style({ height: '0', visibility: 'hidden' })),
-                transition('false => true', animate(150 + 'ms ease-in')),
-                transition('true => false', animate(150 + 'ms ease-out')),
-            ]),
-        ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: AXSideMenuItemComponent, isStandalone: true, selector: "ax-side-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 }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isCollapsed: { classPropertyName: "isCollapsed", publicName: "isCollapsed", isSignal: true, isRequired: false, transformFunction: null }, toggleOnClick: { classPropertyName: "toggleOnClick", publicName: "toggleOnClick", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, routerLinkActive: { classPropertyName: "routerLinkActive", publicName: "routerLinkActive", isSignal: true, isRequired: false, transformFunction: null }, routerLinkActiveOptions: { classPropertyName: "routerLinkActiveOptions", publicName: "routerLinkActiveOptions", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { text: "textChange", active: "activeChange", isLoading: "isLoadingChange", isCollapsed: "isCollapsedChange", onClick: "onClick" }, host: { attributes: { "ngSkipHydration": "true" } }, providers: [{ provide: AXComponent, useExisting: AXSideMenuItemComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-title\"></ng-content>\n@if (routerLink()) {\n  <a\n    [axRipple]\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [routerLink]=\"routerLink()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n    [routerLinkActive]=\"routerLinkActive()\"\n    [routerLinkActiveOptions]=\"routerLinkActiveOptions()\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else if (href()) {\n  <a\n    [axRipple]\n    [href]=\"href()\"\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else {\n  <div\n    [axRipple]\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </div>\n}\n\n<div class=\"ax-side-children\" [class.ax-collapsed]=\"isCollapsed()\">\n  @if (isLoading()) {\n    <p>{{ '@acorex:common.status.loading' | translate | async }}</p>\n  } @else {\n    <div class=\"ax-side-children-content\">\n      <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n    </div>\n  }\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>\n<ng-template #menuItemContent>\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 select=\"ax-text\"></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() && toggleOnClick()) {\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</ng-template>\n", dependencies: [{ kind: "directive", type: AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-side-menu-item', inputs: ['disabled'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, animations: [
-                        trigger('collapse', [
-                            state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),
-                            state('true', style({ height: '0', visibility: 'hidden' })),
-                            transition('false => true', animate(150 + 'ms ease-in')),
-                            transition('true => false', animate(150 + 'ms ease-out')),
-                        ]),
-                    ], host: { ngSkipHydration: 'true' }, imports: [
+            args: [{ selector: 'ax-side-menu-item', inputs: ['disabled'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { ngSkipHydration: 'true' }, imports: [
                         AXRippleDirective,
                         RouterLink,
                         RouterLinkActive,
@@ -89,8 +82,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
                         AXLoadingComponent,
                         AsyncPipe,
                         AXTranslatorPipe,
-                    ], providers: [{ provide: AXComponent, useExisting: AXSideMenuItemComponent }], template: "<ng-content select=\"ax-title\"></ng-content>\n@if (routerLink()) {\n  <a\n    [axRipple]\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [routerLink]=\"routerLink()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n    [routerLinkActive]=\"routerLinkActive()\"\n    [routerLinkActiveOptions]=\"routerLinkActiveOptions()\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else if (href()) {\n  <a\n    [axRipple]\n    [href]=\"href()\"\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else {\n  <div\n    [axRipple]\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </div>\n}\n\n<div class=\"ax-side-children\" [@collapse]=\"isCollapsed()\">\n  @if (isLoading()) {\n    <p>{{ '@acorex:common.status.loading' | translate | async }}</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>\n<ng-template #menuItemContent>\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 select=\"ax-text\"></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() && toggleOnClick()) {\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</ng-template>\n" }]
-        }], ctorParameters: () => [] });
+                    ], providers: [{ provide: AXComponent, useExisting: AXSideMenuItemComponent }], template: "<ng-content select=\"ax-title\"></ng-content>\n@if (routerLink()) {\n  <a\n    [axRipple]\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [routerLink]=\"routerLink()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n    [routerLinkActive]=\"routerLinkActive()\"\n    [routerLinkActiveOptions]=\"routerLinkActiveOptions()\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else if (href()) {\n  <a\n    [axRipple]\n    [href]=\"href()\"\n    [target]=\"target()\"\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </a>\n} @else {\n  <div\n    [axRipple]\n    class=\"ax-side-item\"\n    [class.ax-state-active]=\"active()\"\n    (click)=\"_handleClickEvent($event)\"\n    [class.ax-state-disabled]=\"disabled\"\n  >\n    <ng-container [ngTemplateOutlet]=\"menuItemContent\"></ng-container>\n  </div>\n}\n\n<div class=\"ax-side-children\" [class.ax-collapsed]=\"isCollapsed()\">\n  @if (isLoading()) {\n    <p>{{ '@acorex:common.status.loading' | translate | async }}</p>\n  } @else {\n    <div class=\"ax-side-children-content\">\n      <ng-content select=\"ax-side-menu-item, ng-container\"></ng-content>\n    </div>\n  }\n</div>\n\n<ng-content select=\"ax-divider\"></ng-content>\n<ng-template #menuItemContent>\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 select=\"ax-text\"></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() && toggleOnClick()) {\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</ng-template>\n" }]
+        }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }, { type: i0.Output, args: ["textChange"] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }, { type: i0.Output, args: ["activeChange"] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }, { type: i0.Output, args: ["isLoadingChange"] }], isCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCollapsed", required: false }] }, { type: i0.Output, args: ["isCollapsedChange"] }], onClick: [{ type: i0.Output, args: ["onClick"] }], toggleOnClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggleOnClick", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], routerLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerLink", required: false }] }], routerLinkActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerLinkActive", required: false }] }], routerLinkActiveOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerLinkActiveOptions", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }] } });
 
 /**
  * @category
@@ -108,10 +101,10 @@ class AXSideMenuComponent extends NXComponent {
     get __hostClass() {
         return [`ax-look-${this.look()}`, `ax-location-${this.location()}`];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXSideMenuComponent, isStandalone: true, selector: "ax-side-menu", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXSideMenuComponent }], viewQueries: [{ propertyName: "children", predicate: AXSideMenuItemComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-side-menu-item,ax-title,ng-container,ng-content\"></ng-content>\n\n@for (node of items(); track node) {\n  <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"> </ng-container>\n}\n<ng-template #Recursion let-item>\n  @if (item.title) {\n    <ax-title>{{ item.title }}</ax-title>\n  }\n  @if (item.routerLink) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [target]=\"item.target\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [routerLink]=\"item.routerLink\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n      [routerLinkActive]=\"item.routerLinkActive\"\n      [routerLinkActiveOptions]=\"item.routerLinkActiveOptions\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else if (item.href) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [href]=\"item.href\"\n      [target]=\"item.target\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  }\n\n  <ng-template #sideMenuItemContent>\n    <ax-prefix>\n      @if (item.icon) {\n        <ax-icon [icon]=\"item.icon\"> </ax-icon>\n      }\n    </ax-prefix>\n    @if (item.data) {\n      <ax-text>{{ item.data }}</ax-text>\n    }\n    @if (item.suffixText) {\n      <ax-suffix>\n        <ax-text>{{ item.suffixText }}</ax-text>\n      </ax-suffix>\n    }\n    @for (child of item.items; track child) {\n      <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n    }\n  </ng-template>\n</ng-template>\n", styles: ["ax-side-menu{--ax-comp-side-menu-indicator-size: 2px}ax-side-menu{width:100%;display:flex;color:inherit;-webkit-user-select:none;user-select:none;flex-direction:column;gap:var(--ax-comp-side-menu-gap, .5rem);font-size:var(--ax-comp-side-menu-font-size, .875rem);line-height:var(--ax-comp-side-menu-line-height, 1.25rem)}ax-side-menu>ax-title{margin-block:.5rem;display:block;padding-inline-start:.75rem;padding-inline-end:.75rem;padding-top:.25rem;padding-bottom:.25rem;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;opacity:.5}ax-side-menu ax-side-menu-item ax-title{margin-block:.5rem;margin-top:.5rem;display:block;padding-inline-start:.75rem;padding-inline-end:.75rem;padding-top:.25rem;padding-bottom:.25rem;line-height:1rem;font-weight:500;text-transform:uppercase;opacity:var(--ax-comp-side-menu-title-opacity, .5);font-size:var(--ax-comp-side-menu-title-font-size, .75rem)}ax-side-menu ax-side-menu-item ax-divider{width:100%;display:block;height:var(--ax-comp-side-menu-divider-height, 1px);margin-top:var(--ax-comp-side-menu-divider-margin-y, .25rem);margin-bottom:var(--ax-comp-side-menu-divider-margin-y, .25rem);background-color:rgba(var(--ax-comp-side-menu-divider-bg-color, var(--ax-sys-color-border-lightest-surface)))}ax-side-menu ax-side-menu-item .ax-side-item{padding-inline:var(--ax-comp-side-menu-item-padding-x, 1rem);padding-block:var(--ax-comp-side-menu-item-padding-y, .5rem);font-size:inherit;position:relative;display:flex;cursor:pointer;align-items:center;justify-content:space-between;gap:.75rem;font-weight:500}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled{cursor:not-allowed;opacity:var(--ax-comp-side-menu-item-disabled-opacity, .5)}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled .ax-ripple{opacity:0}ax-side-menu ax-side-menu-item .ax-side-item:hover:not(ax-side-menu ax-side-menu-item .ax-side-item:hover.ax-state-disabled,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled) ax-loading ax-loading-spinner span,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active:not(ax-side-menu ax-side-menu-item .ax-side-item:hover.ax-state-disabled,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled) ax-loading ax-loading-spinner span{border-color:rgba(var(--ax-comp-side-menu-text-color, var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-start-side,ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side{display:flex;align-items:center}ax-side-menu ax-side-menu-item .ax-side-item .ax-start-side{gap:.5rem}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side{gap:.5rem}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon{display:block}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand{transform:rotate(90deg)}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side ax-loading ax-loading-spinner span{border-color:rgba(var(--ax-comp-side-menu-text-color, var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-ripple{background-color:rgba(var(--ax-comp-side-menu-ripple-color, var(--ax-sys-color-on-surface)),.3)!important}ax-side-menu ax-side-menu-item .ax-side-children{overflow:hidden;padding-inline-start:1.25rem;display:flex;flex-direction:column;gap:var(--ax-comp-side-menu-children-gap, .5rem)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child{padding-top:var(--ax-comp-side-menu-children-gap, .5rem)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child ax-title{margin-top:1em}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item .ax-side-item{font-weight:400}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item{border-radius:var(--ax-comp-side-menu-pills-border-radius, var(--ax-sys-border-radius))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-hover-text-color, var(--ax-sys-color-on-surface)));background-color:rgba(var(--ax-comp-side-menu-hover-bg-color, var(--ax-sys-color-surface)))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-active-text-color, var(--ax-sys-color-on-primary-surface)));background-color:rgba(var(--ax-comp-side-menu-active-bg-color, var(--ax-sys-color-primary-surface)))}ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color{gap:0}ax-side-menu.ax-look-with-line .ax-ripple,ax-side-menu.ax-look-with-line-color .ax-ripple{display:none}ax-side-menu.ax-look-with-line.ax-location-start .ax-side-children:before,ax-side-menu.ax-look-with-line.ax-location-start .ax-side-item:before,ax-side-menu.ax-look-with-line-color.ax-location-start .ax-side-children:before,ax-side-menu.ax-look-with-line-color.ax-location-start .ax-side-item:before{inset-inline-start:0;width:calc(var(--ax-comp-side-menu-indicator-size) / 2)}ax-side-menu.ax-look-with-line.ax-location-end .ax-side-children:before,ax-side-menu.ax-look-with-line.ax-location-end .ax-side-item:before,ax-side-menu.ax-look-with-line-color.ax-location-end .ax-side-children:before,ax-side-menu.ax-look-with-line-color.ax-location-end .ax-side-item:before{inset-inline-end:0;width:calc(var(--ax-comp-side-menu-indicator-size) / 2)}ax-side-menu.ax-look-with-line ax-side-menu-item,ax-side-menu.ax-look-with-line .ax-side-children,ax-side-menu.ax-look-with-line .ax-side-item,ax-side-menu.ax-look-with-line-color ax-side-menu-item,ax-side-menu.ax-look-with-line-color .ax-side-children,ax-side-menu.ax-look-with-line-color .ax-side-item{position:relative}ax-side-menu.ax-look-with-line ax-side-menu-item:before,ax-side-menu.ax-look-with-line .ax-side-children:before,ax-side-menu.ax-look-with-line .ax-side-item:before,ax-side-menu.ax-look-with-line-color ax-side-menu-item:before,ax-side-menu.ax-look-with-line-color .ax-side-children:before,ax-side-menu.ax-look-with-line-color .ax-side-item:before{content:\"\";height:100%;position:absolute;background-color:rgba(var(--ax-comp-side-menu-indicator-color, var(--ax-sys-color-border-lightest-surface)));transition-timing-function:var(--ax-sys-transition-timing-function);transition-duration:var(--ax-sys-transition-duration);transition-property:width}ax-side-menu.ax-look-with-line .ax-side-item:hover:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled),ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface)))}ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled),ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface)))}ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled):before,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled):before{content:\"\";height:100%;position:absolute;width:var(--ax-comp-side-menu-indicator-size);background-color:rgba(var(--ax-comp-side-menu-indicator-active-color, var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface))))}ax-side-menu.ax-look-with-line .ax-side-children ax-side-menu-item:first-child,ax-side-menu.ax-look-with-line-color .ax-side-children ax-side-menu-item:first-child{padding-top:0}ax-side-menu.ax-look-with-line .ax-side-children,ax-side-menu.ax-look-with-line-color .ax-side-children{gap:0}ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface)),.05)}ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-active-bg-color, var(--ax-sys-color-primary-surface)),.1)}ax-side-menu.ax-look-default{gap:.25rem}ax-side-menu.ax-look-default ax-icon{opacity:.6}ax-side-menu.ax-look-default .ax-side-item{padding-inline:1rem;padding-block:.5rem;border-radius:var(--ax-sys-border-radius)}ax-side-menu.ax-look-default .ax-side-item:hover:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-surface)),.5)}ax-side-menu.ax-look-default .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-active.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-active-bg-color, var(--ax-sys-color-primary-surface)),.1)}ax-side-menu.ax-look-default .ax-side-children{gap:.25rem;position:relative;padding-inline-start:2.25rem}ax-side-menu.ax-look-default .ax-side-children:before{width:1px;content:\"\";height:100%;position:absolute;margin-inline-start:-.75rem;background-color:rgba(var(--ax-comp-side-menu-indicator-color, var(--ax-sys-color-border-light-surface)))}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item .ax-side-item{padding-block:.25rem;padding-inline:.5rem}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item:first-child{padding-top:0}html[dir=rtl] ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon:before{-moz-transform:scale(-1,1);-webkit-transform:scale(-1,1);-o-transform:scale(-1,1);-ms-transform:scale(-1,1);transform:scaleX(-1)}html[dir=rtl] ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand{transform:rotate(-90deg)!important}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXSideMenuItemComponent, selector: "ax-side-menu-item", inputs: ["disabled", "text", "active", "isLoading", "isCollapsed", "toggleOnClick", "href", "routerLink", "routerLinkActive", "routerLinkActiveOptions", "target"], outputs: ["textChange", "activeChange", "isLoadingChange", "isCollapsedChange", "onClick"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: AXSideMenuComponent, isStandalone: true, selector: "ax-side-menu", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXSideMenuComponent }], viewQueries: [{ propertyName: "children", predicate: AXSideMenuItemComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-side-menu-item,ax-title,ng-container,ng-content\"></ng-content>\n\n@for (node of items(); track node) {\n  <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"> </ng-container>\n}\n<ng-template #Recursion let-item>\n  @if (item.title) {\n    <ax-title>{{ item.title }}</ax-title>\n  }\n  @if (item.routerLink) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [target]=\"item.target\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [routerLink]=\"item.routerLink\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n      [routerLinkActive]=\"item.routerLinkActive\"\n      [routerLinkActiveOptions]=\"item.routerLinkActiveOptions\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else if (item.href) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [href]=\"item.href\"\n      [target]=\"item.target\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  }\n\n  <ng-template #sideMenuItemContent>\n    <ax-prefix>\n      @if (item.icon) {\n        <ax-icon [icon]=\"item.icon\"> </ax-icon>\n      }\n    </ax-prefix>\n    @if (item.data) {\n      <ax-text>{{ item.data }}</ax-text>\n    }\n    @if (item.suffixText) {\n      <ax-suffix>\n        <ax-text>{{ item.suffixText }}</ax-text>\n      </ax-suffix>\n    }\n    @for (child of item.items; track child) {\n      <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n    }\n  </ng-template>\n</ng-template>\n", styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight:initial;--tw-content:\"\";--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer base{:root{--ax-comp-side-menu-indicator-size:2px}}@layer components{ax-side-menu{gap:calc(var(--spacing,.25rem)*2);width:100%;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25/.875)));color:inherit;-webkit-user-select:none;user-select:none;flex-direction:column;display:flex}ax-side-menu>ax-title{margin-block:calc(var(--spacing,.25rem)*2);padding-inline:calc(var(--spacing,.25rem)*3);padding-block:calc(var(--spacing,.25rem)*1);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)));--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-transform:uppercase;opacity:.5;display:block}ax-side-menu ax-side-menu-item ax-title{margin-block:calc(var(--spacing,.25rem)*2);margin-top:calc(var(--spacing,.25rem)*2);padding-inline:calc(var(--spacing,.25rem)*3);padding-bottom:calc(var(--spacing,.25rem)*1);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)));--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-transform:uppercase;opacity:.5;display:block}ax-side-menu ax-side-menu-item ax-divider{margin-block:calc(var(--spacing,.25rem)*1);background-color:var(--color-border-lightest,rgba(var(--ax-sys-color-border-lightest-surface)));width:100%;height:1px;display:block}ax-side-menu ax-side-menu-item .ax-side-item{cursor:pointer;justify-content:space-between;align-items:center;gap:calc(var(--spacing,.25rem)*3);padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*2);font-size:inherit;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);display:flex;position:relative}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled .ax-ripple{opacity:0}:is(ax-side-menu ax-side-menu-item .ax-side-item:hover,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active):not(:is(ax-side-menu ax-side-menu-item .ax-side-item:hover,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active).ax-state-disabled) ax-loading ax-loading-spinner span{border-color:var(--color-on-primary,rgba(var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-start-side,ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side{align-items:center;gap:calc(var(--spacing,.25rem)*2);display:flex}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon{transition-property:rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));display:block}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand{rotate:90deg}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand:where(:dir(rtl),[dir=rtl],[dir=rtl] *){rotate:-90deg}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side ax-loading ax-loading-spinner span{border-color:var(--color-on-primary,rgba(var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-ripple{background-color:color-mix(in srgb,rgba(var(--ax-sys-color-on-surface))30%,transparent)!important}@supports (color:color-mix(in lab,red,red)){ax-side-menu ax-side-menu-item .ax-side-item .ax-ripple{background-color:color-mix(in oklab,var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))30%,transparent)!important}}ax-side-menu ax-side-menu-item .ax-side-children{opacity:1;transition-property:grid-template-rows,opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));grid-template-rows:1fr;padding-inline-start:calc(var(--spacing,.25rem)*5);display:grid}ax-side-menu ax-side-menu-item .ax-side-children.ax-collapsed{opacity:0;grid-template-rows:0fr}ax-side-menu ax-side-menu-item .ax-side-children .ax-side-children-content{overflow:hidden}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child{padding-top:var(--ax-comp-side-menu-children-gap,.5rem);padding-top:calc(var(--spacing,.25rem)*2)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child ax-title{margin-top:calc(var(--spacing,.25rem)*4)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item .ax-side-item{--tw-font-weight:var(--font-weight-normal,400);font-weight:var(--font-weight-normal,400)}ax-side-menu ax-side-menu-item .ax-side-children-content{gap:calc(var(--spacing,.25rem)*2);flex-direction:column;display:flex}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item{border-radius:var(--radius-default,var(--ax-sys-border-radius))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover.ax-state-d isabled){background-color:var(--color-surface,rgba(var(--ax-sys-color-surface)));color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled){background-color:var(--color-primary,rgba(var(--ax-sys-color-primary-surface)));color:var(--color-on-primary,rgba(var(--ax-sys-color-on-primary-surface)))}ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color{gap:calc(var(--spacing,.25rem)*0)}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-ripple{display:none}:is(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-start .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-start .ax-side-item):before{width:calc(var(--ax-comp-side-menu-indicator-size)/2);inset-inline-start:calc(var(--spacing,.25rem)*0)}:is(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-end .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-end .ax-side-item):before{width:calc(var(--ax-comp-side-menu-indicator-size)/2);inset-inline-end:calc(var(--spacing,.25rem)*0)}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) ax-side-menu-item,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item{position:relative}:is(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) ax-side-menu-item,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item):before{background-color:var(--color-border-lightest,rgba(var(--ax-sys-color-border-lightest-surface)));height:100%;transition-property:width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));--tw-content:\"\";content:var(--tw-content);position:absolute}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item:hover:not(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-disabled),:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active:not(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active.ax-state-disabled){color:var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active:not(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active.ax-state-disabled):before{height:100%;width:var(--ax-comp-side-menu-indicator-size);background-color:rgba(var(--ax-comp-side-menu-indicator-active-color,var(--ax-comp-side-menu-bg-color,var(--ax-sys-color-primary-surface))));--tw-content:\"\";content:var(--tw-content);position:absolute}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children ax-side-menu-item:first-child{padding-top:calc(var(--spacing,.25rem)*0)}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children{gap:calc(var(--spacing,.25rem)*0)}ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface))5%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){background-color:color-mix(in oklab,var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))5%,transparent)}}ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface))10%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in oklab,var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))10%,transparent)}}ax-side-menu.ax-look-default{gap:calc(var(--spacing,.25rem)*1)}ax-side-menu.ax-look-default ax-icon{opacity:.6}ax-side-menu.ax-look-default .ax-side-item{border-radius:var(--radius-default,var(--ax-sys-border-radius));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*2)}ax-side-menu.ax-look-default .ax-side-item:hover:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-surface))50%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-default .ax-side-item:hover:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-disabled){background-color:color-mix(in oklab,var(--color-surface,rgba(var(--ax-sys-color-surface)))50%,transparent)}}ax-side-menu.ax-look-default .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-surface))10%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-default .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in oklab,var(--color-surface,rgba(var(--ax-sys-color-surface)))10%,transparent)}}ax-side-menu.ax-look-default .ax-side-children{gap:calc(var(--spacing,.25rem)*1);padding-inline-start:calc(var(--spacing,.25rem)*9);position:relative}ax-side-menu.ax-look-default .ax-side-children:before{background-color:var(--color-border-light,rgba(var(--ax-sys-color-border-light-surface)));--tw-content:\"\";content:var(--tw-content);width:1px;height:100%;margin-inline-start:calc(var(--spacing,.25rem)*6);position:absolute}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item .ax-side-item{padding-inline:calc(var(--spacing,.25rem)*2);padding-block:calc(var(--spacing,.25rem)*1)}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item:first-child{padding-top:calc(var(--spacing,.25rem)*0)}[dir=rtl] ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon:before{--tw-scale-x: -100% ;scale:var(--tw-scale-x)var(--tw-scale-y)}}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-content{syntax:\"*\";inherits:false;initial-value:\"\"}@property --tw-scale-x{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-y{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-z{syntax:\"*\";inherits:false;initial-value:1}\n/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXSideMenuItemComponent, selector: "ax-side-menu-item", inputs: ["disabled", "text", "active", "isLoading", "isCollapsed", "toggleOnClick", "href", "routerLink", "routerLinkActive", "routerLinkActiveOptions", "target"], outputs: ["textChange", "activeChange", "isLoadingChange", "isCollapsedChange", "onClick"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-side-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         NgTemplateOutlet,
@@ -120,8 +113,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
                         RouterLink,
                         RouterLinkActive,
                         AXDecoratorIconComponent,
-                    ], providers: [{ provide: AXComponent, useExisting: AXSideMenuComponent }], template: "<ng-content select=\"ax-side-menu-item,ax-title,ng-container,ng-content\"></ng-content>\n\n@for (node of items(); track node) {\n  <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"> </ng-container>\n}\n<ng-template #Recursion let-item>\n  @if (item.title) {\n    <ax-title>{{ item.title }}</ax-title>\n  }\n  @if (item.routerLink) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [target]=\"item.target\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [routerLink]=\"item.routerLink\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n      [routerLinkActive]=\"item.routerLinkActive\"\n      [routerLinkActiveOptions]=\"item.routerLinkActiveOptions\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else if (item.href) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [href]=\"item.href\"\n      [target]=\"item.target\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  }\n\n  <ng-template #sideMenuItemContent>\n    <ax-prefix>\n      @if (item.icon) {\n        <ax-icon [icon]=\"item.icon\"> </ax-icon>\n      }\n    </ax-prefix>\n    @if (item.data) {\n      <ax-text>{{ item.data }}</ax-text>\n    }\n    @if (item.suffixText) {\n      <ax-suffix>\n        <ax-text>{{ item.suffixText }}</ax-text>\n      </ax-suffix>\n    }\n    @for (child of item.items; track child) {\n      <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n    }\n  </ng-template>\n</ng-template>\n", styles: ["ax-side-menu{--ax-comp-side-menu-indicator-size: 2px}ax-side-menu{width:100%;display:flex;color:inherit;-webkit-user-select:none;user-select:none;flex-direction:column;gap:var(--ax-comp-side-menu-gap, .5rem);font-size:var(--ax-comp-side-menu-font-size, .875rem);line-height:var(--ax-comp-side-menu-line-height, 1.25rem)}ax-side-menu>ax-title{margin-block:.5rem;display:block;padding-inline-start:.75rem;padding-inline-end:.75rem;padding-top:.25rem;padding-bottom:.25rem;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;opacity:.5}ax-side-menu ax-side-menu-item ax-title{margin-block:.5rem;margin-top:.5rem;display:block;padding-inline-start:.75rem;padding-inline-end:.75rem;padding-top:.25rem;padding-bottom:.25rem;line-height:1rem;font-weight:500;text-transform:uppercase;opacity:var(--ax-comp-side-menu-title-opacity, .5);font-size:var(--ax-comp-side-menu-title-font-size, .75rem)}ax-side-menu ax-side-menu-item ax-divider{width:100%;display:block;height:var(--ax-comp-side-menu-divider-height, 1px);margin-top:var(--ax-comp-side-menu-divider-margin-y, .25rem);margin-bottom:var(--ax-comp-side-menu-divider-margin-y, .25rem);background-color:rgba(var(--ax-comp-side-menu-divider-bg-color, var(--ax-sys-color-border-lightest-surface)))}ax-side-menu ax-side-menu-item .ax-side-item{padding-inline:var(--ax-comp-side-menu-item-padding-x, 1rem);padding-block:var(--ax-comp-side-menu-item-padding-y, .5rem);font-size:inherit;position:relative;display:flex;cursor:pointer;align-items:center;justify-content:space-between;gap:.75rem;font-weight:500}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled{cursor:not-allowed;opacity:var(--ax-comp-side-menu-item-disabled-opacity, .5)}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled .ax-ripple{opacity:0}ax-side-menu ax-side-menu-item .ax-side-item:hover:not(ax-side-menu ax-side-menu-item .ax-side-item:hover.ax-state-disabled,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled) ax-loading ax-loading-spinner span,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active:not(ax-side-menu ax-side-menu-item .ax-side-item:hover.ax-state-disabled,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled) ax-loading ax-loading-spinner span{border-color:rgba(var(--ax-comp-side-menu-text-color, var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-start-side,ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side{display:flex;align-items:center}ax-side-menu ax-side-menu-item .ax-side-item .ax-start-side{gap:.5rem}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side{gap:.5rem}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon{display:block}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand{transform:rotate(90deg)}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side ax-loading ax-loading-spinner span{border-color:rgba(var(--ax-comp-side-menu-text-color, var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-ripple{background-color:rgba(var(--ax-comp-side-menu-ripple-color, var(--ax-sys-color-on-surface)),.3)!important}ax-side-menu ax-side-menu-item .ax-side-children{overflow:hidden;padding-inline-start:1.25rem;display:flex;flex-direction:column;gap:var(--ax-comp-side-menu-children-gap, .5rem)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child{padding-top:var(--ax-comp-side-menu-children-gap, .5rem)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child ax-title{margin-top:1em}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item .ax-side-item{font-weight:400}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item{border-radius:var(--ax-comp-side-menu-pills-border-radius, var(--ax-sys-border-radius))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-hover-text-color, var(--ax-sys-color-on-surface)));background-color:rgba(var(--ax-comp-side-menu-hover-bg-color, var(--ax-sys-color-surface)))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-active-text-color, var(--ax-sys-color-on-primary-surface)));background-color:rgba(var(--ax-comp-side-menu-active-bg-color, var(--ax-sys-color-primary-surface)))}ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color{gap:0}ax-side-menu.ax-look-with-line .ax-ripple,ax-side-menu.ax-look-with-line-color .ax-ripple{display:none}ax-side-menu.ax-look-with-line.ax-location-start .ax-side-children:before,ax-side-menu.ax-look-with-line.ax-location-start .ax-side-item:before,ax-side-menu.ax-look-with-line-color.ax-location-start .ax-side-children:before,ax-side-menu.ax-look-with-line-color.ax-location-start .ax-side-item:before{inset-inline-start:0;width:calc(var(--ax-comp-side-menu-indicator-size) / 2)}ax-side-menu.ax-look-with-line.ax-location-end .ax-side-children:before,ax-side-menu.ax-look-with-line.ax-location-end .ax-side-item:before,ax-side-menu.ax-look-with-line-color.ax-location-end .ax-side-children:before,ax-side-menu.ax-look-with-line-color.ax-location-end .ax-side-item:before{inset-inline-end:0;width:calc(var(--ax-comp-side-menu-indicator-size) / 2)}ax-side-menu.ax-look-with-line ax-side-menu-item,ax-side-menu.ax-look-with-line .ax-side-children,ax-side-menu.ax-look-with-line .ax-side-item,ax-side-menu.ax-look-with-line-color ax-side-menu-item,ax-side-menu.ax-look-with-line-color .ax-side-children,ax-side-menu.ax-look-with-line-color .ax-side-item{position:relative}ax-side-menu.ax-look-with-line ax-side-menu-item:before,ax-side-menu.ax-look-with-line .ax-side-children:before,ax-side-menu.ax-look-with-line .ax-side-item:before,ax-side-menu.ax-look-with-line-color ax-side-menu-item:before,ax-side-menu.ax-look-with-line-color .ax-side-children:before,ax-side-menu.ax-look-with-line-color .ax-side-item:before{content:\"\";height:100%;position:absolute;background-color:rgba(var(--ax-comp-side-menu-indicator-color, var(--ax-sys-color-border-lightest-surface)));transition-timing-function:var(--ax-sys-transition-timing-function);transition-duration:var(--ax-sys-transition-duration);transition-property:width}ax-side-menu.ax-look-with-line .ax-side-item:hover:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled),ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface)))}ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled),ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface)))}ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled):before,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line .ax-side-item.ax-state-active.ax-state-disabled,ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled):before{content:\"\";height:100%;position:absolute;width:var(--ax-comp-side-menu-indicator-size);background-color:rgba(var(--ax-comp-side-menu-indicator-active-color, var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface))))}ax-side-menu.ax-look-with-line .ax-side-children ax-side-menu-item:first-child,ax-side-menu.ax-look-with-line-color .ax-side-children ax-side-menu-item:first-child{padding-top:0}ax-side-menu.ax-look-with-line .ax-side-children,ax-side-menu.ax-look-with-line-color .ax-side-children{gap:0}ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-primary-surface)),.05)}ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-active-bg-color, var(--ax-sys-color-primary-surface)),.1)}ax-side-menu.ax-look-default{gap:.25rem}ax-side-menu.ax-look-default ax-icon{opacity:.6}ax-side-menu.ax-look-default .ax-side-item{padding-inline:1rem;padding-block:.5rem;border-radius:var(--ax-sys-border-radius)}ax-side-menu.ax-look-default .ax-side-item:hover:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-bg-color, var(--ax-sys-color-surface)),.5)}ax-side-menu.ax-look-default .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-active.ax-state-disabled){background-color:rgba(var(--ax-comp-side-menu-active-bg-color, var(--ax-sys-color-primary-surface)),.1)}ax-side-menu.ax-look-default .ax-side-children{gap:.25rem;position:relative;padding-inline-start:2.25rem}ax-side-menu.ax-look-default .ax-side-children:before{width:1px;content:\"\";height:100%;position:absolute;margin-inline-start:-.75rem;background-color:rgba(var(--ax-comp-side-menu-indicator-color, var(--ax-sys-color-border-light-surface)))}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item .ax-side-item{padding-block:.25rem;padding-inline:.5rem}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item:first-child{padding-top:0}html[dir=rtl] ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon:before{-moz-transform:scale(-1,1);-webkit-transform:scale(-1,1);-o-transform:scale(-1,1);-ms-transform:scale(-1,1);transform:scaleX(-1)}html[dir=rtl] ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand{transform:rotate(-90deg)!important}\n"] }]
-        }], propDecorators: { __hostClass: [{
+                    ], providers: [{ provide: AXComponent, useExisting: AXSideMenuComponent }], template: "<ng-content select=\"ax-side-menu-item,ax-title,ng-container,ng-content\"></ng-content>\n\n@for (node of items(); track node) {\n  <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"> </ng-container>\n}\n<ng-template #Recursion let-item>\n  @if (item.title) {\n    <ax-title>{{ item.title }}</ax-title>\n  }\n  @if (item.routerLink) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [target]=\"item.target\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [routerLink]=\"item.routerLink\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n      [routerLinkActive]=\"item.routerLinkActive\"\n      [routerLinkActiveOptions]=\"item.routerLinkActiveOptions\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else if (item.href) {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [href]=\"item.href\"\n      [target]=\"item.target\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  } @else {\n    <ax-side-menu-item\n      [text]=\"item.text\"\n      [active]=\"item.active\"\n      [disabled]=\"item.disabled\"\n      [isLoading]=\"item.isLoading\"\n      [isCollapsed]=\"item.isCollapsed\"\n      [toggleOnClick]=\"item.toggleOnClick\"\n    >\n      <ng-container [ngTemplateOutlet]=\"sideMenuItemContent\"></ng-container>\n    </ax-side-menu-item>\n  }\n\n  <ng-template #sideMenuItemContent>\n    <ax-prefix>\n      @if (item.icon) {\n        <ax-icon [icon]=\"item.icon\"> </ax-icon>\n      }\n    </ax-prefix>\n    @if (item.data) {\n      <ax-text>{{ item.data }}</ax-text>\n    }\n    @if (item.suffixText) {\n      <ax-suffix>\n        <ax-text>{{ item.suffixText }}</ax-text>\n      </ax-suffix>\n    }\n    @for (child of item.items; track child) {\n      <ng-container [ngTemplateOutlet]=\"Recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n    }\n  </ng-template>\n</ng-template>\n", styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight:initial;--tw-content:\"\";--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer base{:root{--ax-comp-side-menu-indicator-size:2px}}@layer components{ax-side-menu{gap:calc(var(--spacing,.25rem)*2);width:100%;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25/.875)));color:inherit;-webkit-user-select:none;user-select:none;flex-direction:column;display:flex}ax-side-menu>ax-title{margin-block:calc(var(--spacing,.25rem)*2);padding-inline:calc(var(--spacing,.25rem)*3);padding-block:calc(var(--spacing,.25rem)*1);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)));--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-transform:uppercase;opacity:.5;display:block}ax-side-menu ax-side-menu-item ax-title{margin-block:calc(var(--spacing,.25rem)*2);margin-top:calc(var(--spacing,.25rem)*2);padding-inline:calc(var(--spacing,.25rem)*3);padding-bottom:calc(var(--spacing,.25rem)*1);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)));--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-transform:uppercase;opacity:.5;display:block}ax-side-menu ax-side-menu-item ax-divider{margin-block:calc(var(--spacing,.25rem)*1);background-color:var(--color-border-lightest,rgba(var(--ax-sys-color-border-lightest-surface)));width:100%;height:1px;display:block}ax-side-menu ax-side-menu-item .ax-side-item{cursor:pointer;justify-content:space-between;align-items:center;gap:calc(var(--spacing,.25rem)*3);padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*2);font-size:inherit;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);display:flex;position:relative}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-side-menu ax-side-menu-item .ax-side-item.ax-state-disabled .ax-ripple{opacity:0}:is(ax-side-menu ax-side-menu-item .ax-side-item:hover,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active):not(:is(ax-side-menu ax-side-menu-item .ax-side-item:hover,ax-side-menu ax-side-menu-item .ax-side-item.ax-state-active).ax-state-disabled) ax-loading ax-loading-spinner span{border-color:var(--color-on-primary,rgba(var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-start-side,ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side{align-items:center;gap:calc(var(--spacing,.25rem)*2);display:flex}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon{transition-property:rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));display:block}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand{rotate:90deg}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon.arrow-icon-expand:where(:dir(rtl),[dir=rtl],[dir=rtl] *){rotate:-90deg}ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side ax-loading ax-loading-spinner span{border-color:var(--color-on-primary,rgba(var(--ax-sys-color-on-primary-surface)))}ax-side-menu ax-side-menu-item .ax-side-item .ax-ripple{background-color:color-mix(in srgb,rgba(var(--ax-sys-color-on-surface))30%,transparent)!important}@supports (color:color-mix(in lab,red,red)){ax-side-menu ax-side-menu-item .ax-side-item .ax-ripple{background-color:color-mix(in oklab,var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))30%,transparent)!important}}ax-side-menu ax-side-menu-item .ax-side-children{opacity:1;transition-property:grid-template-rows,opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));grid-template-rows:1fr;padding-inline-start:calc(var(--spacing,.25rem)*5);display:grid}ax-side-menu ax-side-menu-item .ax-side-children.ax-collapsed{opacity:0;grid-template-rows:0fr}ax-side-menu ax-side-menu-item .ax-side-children .ax-side-children-content{overflow:hidden}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child{padding-top:var(--ax-comp-side-menu-children-gap,.5rem);padding-top:calc(var(--spacing,.25rem)*2)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item:first-child ax-title{margin-top:calc(var(--spacing,.25rem)*4)}ax-side-menu ax-side-menu-item .ax-side-children ax-side-menu-item .ax-side-item{--tw-font-weight:var(--font-weight-normal,400);font-weight:var(--font-weight-normal,400)}ax-side-menu ax-side-menu-item .ax-side-children-content{gap:calc(var(--spacing,.25rem)*2);flex-direction:column;display:flex}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item{border-radius:var(--radius-default,var(--ax-sys-border-radius))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item:hover.ax-state-d isabled){background-color:var(--color-surface,rgba(var(--ax-sys-color-surface)));color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))}ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-pills ax-side-menu-item .ax-side-item.ax-state-active.ax-state-disabled){background-color:var(--color-primary,rgba(var(--ax-sys-color-primary-surface)));color:var(--color-on-primary,rgba(var(--ax-sys-color-on-primary-surface)))}ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color{gap:calc(var(--spacing,.25rem)*0)}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-ripple{display:none}:is(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-start .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-start .ax-side-item):before{width:calc(var(--ax-comp-side-menu-indicator-size)/2);inset-inline-start:calc(var(--spacing,.25rem)*0)}:is(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-end .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color).ax-location-end .ax-side-item):before{width:calc(var(--ax-comp-side-menu-indicator-size)/2);inset-inline-end:calc(var(--spacing,.25rem)*0)}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) ax-side-menu-item,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item{position:relative}:is(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) ax-side-menu-item,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children,:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item):before{background-color:var(--color-border-lightest,rgba(var(--ax-sys-color-border-lightest-surface)));height:100%;transition-property:width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));--tw-content:\"\";content:var(--tw-content);position:absolute}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item:hover:not(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-disabled),:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active:not(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active.ax-state-disabled){color:var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active:not(:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-item.ax-state-active.ax-state-disabled):before{height:100%;width:var(--ax-comp-side-menu-indicator-size);background-color:rgba(var(--ax-comp-side-menu-indicator-active-color,var(--ax-comp-side-menu-bg-color,var(--ax-sys-color-primary-surface))));--tw-content:\"\";content:var(--tw-content);position:absolute}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children ax-side-menu-item:first-child{padding-top:calc(var(--spacing,.25rem)*0)}:is(ax-side-menu.ax-look-with-line,ax-side-menu.ax-look-with-line-color) .ax-side-children{gap:calc(var(--spacing,.25rem)*0)}ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface))5%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-with-line-color .ax-side-item:hover:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-disabled){background-color:color-mix(in oklab,var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))5%,transparent)}}ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface))10%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-with-line-color .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in oklab,var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))10%,transparent)}}ax-side-menu.ax-look-default{gap:calc(var(--spacing,.25rem)*1)}ax-side-menu.ax-look-default ax-icon{opacity:.6}ax-side-menu.ax-look-default .ax-side-item{border-radius:var(--radius-default,var(--ax-sys-border-radius));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*2)}ax-side-menu.ax-look-default .ax-side-item:hover:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-surface))50%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-default .ax-side-item:hover:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-disabled){background-color:color-mix(in oklab,var(--color-surface,rgba(var(--ax-sys-color-surface)))50%,transparent)}}ax-side-menu.ax-look-default .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in srgb,rgba(var(--ax-sys-color-surface))10%,transparent)}@supports (color:color-mix(in lab,red,red)){ax-side-menu.ax-look-default .ax-side-item.ax-state-active:not(ax-side-menu.ax-look-default .ax-side-item.ax-state-active.ax-state-disabled){background-color:color-mix(in oklab,var(--color-surface,rgba(var(--ax-sys-color-surface)))10%,transparent)}}ax-side-menu.ax-look-default .ax-side-children{gap:calc(var(--spacing,.25rem)*1);padding-inline-start:calc(var(--spacing,.25rem)*9);position:relative}ax-side-menu.ax-look-default .ax-side-children:before{background-color:var(--color-border-light,rgba(var(--ax-sys-color-border-light-surface)));--tw-content:\"\";content:var(--tw-content);width:1px;height:100%;margin-inline-start:calc(var(--spacing,.25rem)*6);position:absolute}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item .ax-side-item{padding-inline:calc(var(--spacing,.25rem)*2);padding-block:calc(var(--spacing,.25rem)*1)}ax-side-menu.ax-look-default .ax-side-children ax-side-menu-item:first-child{padding-top:calc(var(--spacing,.25rem)*0)}[dir=rtl] ax-side-menu ax-side-menu-item .ax-side-item .ax-end-side .arrow-icon:before{--tw-scale-x: -100% ;scale:var(--tw-scale-x)var(--tw-scale-y)}}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-content{syntax:\"*\";inherits:false;initial-value:\"\"}@property --tw-scale-x{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-y{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-z{syntax:\"*\";inherits:false;initial-value:1}\n/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n"] }]
+        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }, { type: i0.Output, args: ["itemsChange"] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }], location: [{ type: i0.Input, args: [{ isSignal: true, alias: "location", required: false }] }], children: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AXSideMenuItemComponent), { isSignal: true }] }], __hostClass: [{
                 type: HostBinding,
                 args: ['class']
             }] } });
@@ -232,10 +225,10 @@ class AXOutlineSideMenuDirective {
         });
         return rootItems;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXOutlineSideMenuDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.3", type: AXOutlineSideMenuDirective, isStandalone: true, selector: "[axOutlineSideMenu]", providers: [AXUnsubscriber], exportAs: ["axOutlineSideMenu"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXOutlineSideMenuDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: AXOutlineSideMenuDirective, isStandalone: true, selector: "[axOutlineSideMenu]", providers: [AXUnsubscriber], exportAs: ["axOutlineSideMenu"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXOutlineSideMenuDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXOutlineSideMenuDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[axOutlineSideMenu]',
@@ -256,8 +249,8 @@ const MODULES = [
     AXDecoratorModule,
 ];
 class AXSideMenuModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuModule, imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuModule, imports: [CommonModule,
             AXCommonModule,
             AXRippleDirective,
             AXLoadingModule,
@@ -265,13 +258,13 @@ class AXSideMenuModule {
             RouterLink,
             RouterLinkActive,
             AXDecoratorModule, AXSideMenuComponent, AXSideMenuItemComponent, AXOutlineSideMenuDirective], exports: [AXSideMenuComponent, AXSideMenuItemComponent, AXOutlineSideMenuDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuModule, imports: [CommonModule,
             AXCommonModule,
             AXLoadingModule,
             AXTranslationModule,
             AXDecoratorModule, AXSideMenuComponent, AXSideMenuItemComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSideMenuModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AXSideMenuModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...MODULES, ...COMPONENT],