@eui/ecl 23.0.0-alpha.11 → 23.0.0-alpha.12

package/fesm2022/eui-ecl-components-ecl-mega-menu.mjs

@@ -23,10 +23,10 @@ class EclMegaMenuContainerDirective extends ECLBaseDirective {
         super(...arguments);
         this.hasClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuContainerDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclMegaMenuContainerDirective, isStandalone: true, selector: "div[eclMegaMenuContainer]", host: { properties: { "class.ecl": "this.hasClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuContainerDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclMegaMenuContainerDirective, isStandalone: true, selector: "div[eclMegaMenuContainer]", host: { properties: { "class.ecl": "this.hasClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuContainerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuContainerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'div[eclMegaMenuContainer]',
@@ -44,10 +44,10 @@ class EclMegaMenuFeaturedListDirective extends ECLBaseDirective {
         super(...arguments);
         this.cmpClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedListDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclMegaMenuFeaturedListDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedList]", host: { properties: { "class.ecl-mega-menu__featured-list": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedListDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclMegaMenuFeaturedListDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedList]", host: { properties: { "class.ecl-mega-menu__featured-list": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedListDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedListDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclMegaMenuFeaturedList]',
@@ -72,10 +72,10 @@ class EclMegaMenuFeaturedListItemDirective extends ECLBaseDirective {
         const computedStyle = window.getComputedStyle(this.el.nativeElement);
         return this.el.nativeElement.scrollHeight + parseFloat(computedStyle.marginBottom) + parseFloat(computedStyle.marginTop);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedListItemDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.0.5", type: EclMegaMenuFeaturedListItemDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedListItem]", inputs: { isImageOnly: ["isImageOnly", "isImageOnly", booleanAttribute], isCombo: ["isCombo", "isCombo", booleanAttribute] }, host: { properties: { "class.ecl-mega-menu__featured-list__item": "this.cmpClass", "class.ecl-mega-menu__featured-list__item--image-only": "this.isImageOnly", "class.ecl-mega-menu__featured-list__item--combo": "this.isCombo" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedListItemDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.1.2", type: EclMegaMenuFeaturedListItemDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedListItem]", inputs: { isImageOnly: ["isImageOnly", "isImageOnly", booleanAttribute], isCombo: ["isCombo", "isCombo", booleanAttribute] }, host: { properties: { "class.ecl-mega-menu__featured-list__item": "this.cmpClass", "class.ecl-mega-menu__featured-list__item--image-only": "this.isImageOnly", "class.ecl-mega-menu__featured-list__item--combo": "this.isCombo" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedListItemDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedListItemDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclMegaMenuFeaturedListItem]',
@@ -101,10 +101,10 @@ class EclMegaMenuFeaturedListItemDescriptionDirective extends ECLBaseDirective {
         super(...arguments);
         this.cmpClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedListItemDescriptionDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclMegaMenuFeaturedListItemDescriptionDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedListItemDescription]", host: { properties: { "class.ecl-mega-menu__featured-list__item-description": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedListItemDescriptionDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclMegaMenuFeaturedListItemDescriptionDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedListItemDescription]", host: { properties: { "class.ecl-mega-menu__featured-list__item-description": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedListItemDescriptionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedListItemDescriptionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclMegaMenuFeaturedListItemDescription]',
@@ -121,10 +121,10 @@ class EclMegaMenuFeaturedPictureDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-picture ecl-mega-menu__featured-picture')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedPictureDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclMegaMenuFeaturedPictureDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedPicture]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedPictureDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclMegaMenuFeaturedPictureDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedPicture]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedPictureDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedPictureDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclMegaMenuFeaturedPicture]',
@@ -141,10 +141,10 @@ class EclMegaMenuFeaturedImageDirective extends ECLBaseDirective {
         super(...arguments);
         this.cmpClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedImageDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclMegaMenuFeaturedImageDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedImage]", host: { properties: { "class.ecl-mega-menu__featured-image": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedImageDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclMegaMenuFeaturedImageDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedImage]", host: { properties: { "class.ecl-mega-menu__featured-image": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedImageDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedImageDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclMegaMenuFeaturedImage]',
@@ -181,10 +181,10 @@ class EclMegaMenuFeaturedComponent extends ECLBaseDirective {
         this.featuredItems()?.forEach(el => result += el.getEclMegaMenuFeaturedItemHeight());
         return result;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclMegaMenuFeaturedComponent, isStandalone: true, selector: "div[eclMegaMenuFeatured]", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, titleId: { classPropertyName: "titleId", publicName: "titleId", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ecl-mega-menu__featured": "this.cmpClass", "style.height.px": "this.eclMegaMenuFeaturedStyleHeight" } }, queries: [{ propertyName: "links", predicate: i0.forwardRef(() => EclLinkDirective), descendants: true, isSignal: true }, { propertyName: "featuredItems", predicate: i0.forwardRef(() => EclMegaMenuFeaturedListItemDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "megaMenuFeaturedScrollable", first: true, predicate: ["megaMenuFeaturedScrollable"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-mega-menu__featured-scrollable\" #megaMenuFeaturedScrollable>\n    <ng-content select=\"[eclMegaMenuFeaturedPicture]\"></ng-content>\n    @if(title) {\n    <span class=\"ecl-mega-menu__featured-title\" id=\"{{titleId()}}\">{{ title }}</span>\n    }\n    <ng-content select=\"[eclMegaMenuFeaturedList]\"></ng-content>\n</div>" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclMegaMenuFeaturedComponent, isStandalone: true, selector: "div[eclMegaMenuFeatured]", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, titleId: { classPropertyName: "titleId", publicName: "titleId", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ecl-mega-menu__featured": "this.cmpClass", "style.height.px": "this.eclMegaMenuFeaturedStyleHeight" } }, queries: [{ propertyName: "links", predicate: i0.forwardRef(() => EclLinkDirective), descendants: true, isSignal: true }, { propertyName: "featuredItems", predicate: i0.forwardRef(() => EclMegaMenuFeaturedListItemDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "megaMenuFeaturedScrollable", first: true, predicate: ["megaMenuFeaturedScrollable"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-mega-menu__featured-scrollable\" #megaMenuFeaturedScrollable>\n    <ng-content select=\"[eclMegaMenuFeaturedPicture]\"></ng-content>\n    @if(title) {\n    <span class=\"ecl-mega-menu__featured-title\" id=\"{{titleId()}}\">{{ title }}</span>\n    }\n    <ng-content select=\"[eclMegaMenuFeaturedList]\"></ng-content>\n</div>" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuFeaturedComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuFeaturedComponent, decorators: [{
             type: Component,
             args: [{ selector: 'div[eclMegaMenuFeatured]', template: "<div class=\"ecl-mega-menu__featured-scrollable\" #megaMenuFeaturedScrollable>\n    <ng-content select=\"[eclMegaMenuFeaturedPicture]\"></ng-content>\n    @if(title) {\n    <span class=\"ecl-mega-menu__featured-title\" id=\"{{titleId()}}\">{{ title }}</span>\n    }\n    <ng-content select=\"[eclMegaMenuFeaturedList]\"></ng-content>\n</div>" }]
         }], propDecorators: { megaMenuFeaturedScrollable: [{ type: i0.ViewChild, args: ['megaMenuFeaturedScrollable', { isSignal: true }] }], cmpClass: [{
@@ -223,10 +223,10 @@ class EclMegaMenuDataService {
     eclSubItemEscapeEvent(value) {
         this.eclSubItemEscape.next(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuDataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuDataService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuDataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuDataService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuDataService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuDataService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
@@ -245,10 +245,10 @@ class EclMegaMenuService {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
@@ -444,10 +444,10 @@ class EclMegaMenuSubitemComponent extends ECLBaseDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuSubitemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclMegaMenuSubitemComponent, isStandalone: true, selector: "li[eclMegaMenuSubitem]", inputs: { buttonId: { classPropertyName: "buttonId", publicName: "buttonId", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, isExternal: { classPropertyName: "isExternal", publicName: "isExternal", isSignal: true, isRequired: false, transformFunction: null }, externalIconTitle: { classPropertyName: "externalIconTitle", publicName: "externalIconTitle", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isSeeAll: { classPropertyName: "isSeeAll", publicName: "isSeeAll", isSignal: true, isRequired: false, transformFunction: null }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { megaMenuSubItemClicked: "megaMenuSubItemClicked", megaMenuSubItemKeydown: "megaMenuSubItemKeydown" }, host: { properties: { "class": "this.cssClasses", "style.display": "this.display" } }, queries: [{ propertyName: "submenu", first: true, predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuFeatured", first: true, predicate: i0.forwardRef(() => EclMegaMenuFeaturedComponent), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "megaMenuLevel2", first: true, predicate: ["megaMenuLevel2"], descendants: true, isSignal: true }, { propertyName: "subMenuItemLink", first: true, predicate: EclLinkDirective, descendants: true, isSignal: true }, { propertyName: "subMenuItemBtn", first: true, predicate: ["subMenuItemBtn"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (!isSeeAll()) {\n@if (hasChildren) {\n<button eclButton #subMenuItemBtn variant=\"primary\" class=\"ecl-mega-menu__sublink\" [attr.aria-expanded]=\"isExpanded\"\n    (click)=\"onButtonClick()\" (keydown)=\"onKeydown($event)\" id=\"{{buttonId()}}\">\n    <span eclButtonLabel>{{label}}</span>\n    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-90\" size=\"2xs\"></ecl-icon>\n</button>\n} @else if (href) {\n<a eclLink variant=\"standalone\" [href]=\"href\" [target]=\"target()\" class=\"ecl-mega-menu__sublink\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onLinkClick()\">\n    <span eclLinkLabel>{{label}}</span>\n    <ng-container *ngTemplateOutlet=\"eclIcon\"></ng-container>\n</a>\n} @else {\n<a eclLink variant=\"standalone\" [attr.tabindex]=\"tabindex || 0\" [routerLink]=\"routerLink()\"\n    [queryParams]=\"queryParams()\" [queryParamsHandling]=\"queryParamsHandling()\" class=\"ecl-mega-menu__sublink\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onLinkClick()\">\n    <span eclLinkLabel>{{label}}</span>\n    <ng-container *ngTemplateOutlet=\"eclIcon\"></ng-container>\n</a>\n}\n\n@if (hasChildren) {\n<div class=\"ecl-mega-menu__mega ecl-mega-menu__mega--level-2\" #megaMenuLevel2\n    [style.height.px]=\"level2StyleHeight\">\n    <ng-content select=\"[eclMegaMenuSublist]\"></ng-content>\n    <ng-content select=\"[eclMegaMenuFeatured]\"></ng-content>\n</div>\n}\n} @else {\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n\n<ng-template #eclIcon>\n    @if (isExternal()) {\n        <ecl-icon icon=\"external\" size=\"2xs\" ariaHidden=\"false\" role=\"img\">\n            <title>Links to an external domain</title>\n        </ecl-icon>\n        }\n    <!-- <ng-content select=\"ecl-icon\"></ng-content> -->\n</ng-template>", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: i3.EclLinkDirective, selector: "[eclLink]", inputs: ["extraAttributes", "isInverted", "isIconOnly", "isHighlight", "isNoVisited", "isBranded", "variant"] }, { kind: "directive", type: i3.EclLinkLabelDirective, selector: "[eclLinkLabel]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuSubitemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclMegaMenuSubitemComponent, isStandalone: true, selector: "li[eclMegaMenuSubitem]", inputs: { buttonId: { classPropertyName: "buttonId", publicName: "buttonId", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, isExternal: { classPropertyName: "isExternal", publicName: "isExternal", isSignal: true, isRequired: false, transformFunction: null }, externalIconTitle: { classPropertyName: "externalIconTitle", publicName: "externalIconTitle", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isSeeAll: { classPropertyName: "isSeeAll", publicName: "isSeeAll", isSignal: true, isRequired: false, transformFunction: null }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { megaMenuSubItemClicked: "megaMenuSubItemClicked", megaMenuSubItemKeydown: "megaMenuSubItemKeydown" }, host: { properties: { "class": "this.cssClasses", "style.display": "this.display" } }, queries: [{ propertyName: "submenu", first: true, predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuFeatured", first: true, predicate: i0.forwardRef(() => EclMegaMenuFeaturedComponent), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "megaMenuLevel2", first: true, predicate: ["megaMenuLevel2"], descendants: true, isSignal: true }, { propertyName: "subMenuItemLink", first: true, predicate: EclLinkDirective, descendants: true, isSignal: true }, { propertyName: "subMenuItemBtn", first: true, predicate: ["subMenuItemBtn"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (!isSeeAll()) {\n@if (hasChildren) {\n<button eclButton #subMenuItemBtn variant=\"primary\" class=\"ecl-mega-menu__sublink\" [attr.aria-expanded]=\"isExpanded\"\n    (click)=\"onButtonClick()\" (keydown)=\"onKeydown($event)\" id=\"{{buttonId()}}\">\n    <span eclButtonLabel>{{label}}</span>\n    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-90\" size=\"2xs\"></ecl-icon>\n</button>\n} @else if (href) {\n<a eclLink variant=\"standalone\" [href]=\"href\" [target]=\"target()\" class=\"ecl-mega-menu__sublink\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onLinkClick()\">\n    <span eclLinkLabel>{{label}}</span>\n    <ng-container *ngTemplateOutlet=\"eclIcon\"></ng-container>\n</a>\n} @else {\n<a eclLink variant=\"standalone\" [attr.tabindex]=\"tabindex || 0\" [routerLink]=\"routerLink()\"\n    [queryParams]=\"queryParams()\" [queryParamsHandling]=\"queryParamsHandling()\" class=\"ecl-mega-menu__sublink\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onLinkClick()\">\n    <span eclLinkLabel>{{label}}</span>\n    <ng-container *ngTemplateOutlet=\"eclIcon\"></ng-container>\n</a>\n}\n\n@if (hasChildren) {\n<div class=\"ecl-mega-menu__mega ecl-mega-menu__mega--level-2\" #megaMenuLevel2\n    [style.height.px]=\"level2StyleHeight\">\n    <ng-content select=\"[eclMegaMenuSublist]\"></ng-content>\n    <ng-content select=\"[eclMegaMenuFeatured]\"></ng-content>\n</div>\n}\n} @else {\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n\n<ng-template #eclIcon>\n    @if (isExternal()) {\n        <ecl-icon icon=\"external\" size=\"2xs\" ariaHidden=\"false\" role=\"img\">\n            <title>Links to an external domain</title>\n        </ecl-icon>\n        }\n    <!-- <ng-content select=\"ecl-icon\"></ng-content> -->\n</ng-template>", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: i3.EclLinkDirective, selector: "[eclLink]", inputs: ["extraAttributes", "isInverted", "isIconOnly", "isHighlight", "isNoVisited", "isBranded", "variant"] }, { kind: "directive", type: i3.EclLinkLabelDirective, selector: "[eclLinkLabel]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuSubitemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuSubitemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'li[eclMegaMenuSubitem]', imports: [NgTemplateOutlet, RouterLink, RouterLinkWithHref, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON, ...EUI_ECL_LINK], template: "@if (!isSeeAll()) {\n@if (hasChildren) {\n<button eclButton #subMenuItemBtn variant=\"primary\" class=\"ecl-mega-menu__sublink\" [attr.aria-expanded]=\"isExpanded\"\n    (click)=\"onButtonClick()\" (keydown)=\"onKeydown($event)\" id=\"{{buttonId()}}\">\n    <span eclButtonLabel>{{label}}</span>\n    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-90\" size=\"2xs\"></ecl-icon>\n</button>\n} @else if (href) {\n<a eclLink variant=\"standalone\" [href]=\"href\" [target]=\"target()\" class=\"ecl-mega-menu__sublink\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onLinkClick()\">\n    <span eclLinkLabel>{{label}}</span>\n    <ng-container *ngTemplateOutlet=\"eclIcon\"></ng-container>\n</a>\n} @else {\n<a eclLink variant=\"standalone\" [attr.tabindex]=\"tabindex || 0\" [routerLink]=\"routerLink()\"\n    [queryParams]=\"queryParams()\" [queryParamsHandling]=\"queryParamsHandling()\" class=\"ecl-mega-menu__sublink\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onLinkClick()\">\n    <span eclLinkLabel>{{label}}</span>\n    <ng-container *ngTemplateOutlet=\"eclIcon\"></ng-container>\n</a>\n}\n\n@if (hasChildren) {\n<div class=\"ecl-mega-menu__mega ecl-mega-menu__mega--level-2\" #megaMenuLevel2\n    [style.height.px]=\"level2StyleHeight\">\n    <ng-content select=\"[eclMegaMenuSublist]\"></ng-content>\n    <ng-content select=\"[eclMegaMenuFeatured]\"></ng-content>\n</div>\n}\n} @else {\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n\n<ng-template #eclIcon>\n    @if (isExternal()) {\n        <ecl-icon icon=\"external\" size=\"2xs\" ariaHidden=\"false\" role=\"img\">\n            <title>Links to an external domain</title>\n        </ecl-icon>\n        }\n    <!-- <ng-content select=\"ecl-icon\"></ng-content> -->\n</ng-template>" }]
         }], ctorParameters: () => [], propDecorators: { cssClasses: [{
@@ -474,10 +474,10 @@ class EclMegaMenuListDirective extends ECLBaseDirective {
         super(...arguments);
         this.cmpClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuListDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclMegaMenuListDirective, isStandalone: true, selector: "ul[eclMegaMenuList]", host: { properties: { "class.ecl-mega-menu__list": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuListDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclMegaMenuListDirective, isStandalone: true, selector: "ul[eclMegaMenuList]", host: { properties: { "class.ecl-mega-menu__list": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuListDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuListDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ul[eclMegaMenuList]',
@@ -494,10 +494,10 @@ class EclMegaMenuSpacerDirective extends ECLBaseDirective {
         super(...arguments);
         this.cmpClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuSpacerDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclMegaMenuSpacerDirective, isStandalone: true, selector: "li[eclMegaMenuSpacer]", host: { properties: { "class.ecl-mega-menu__spacer": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuSpacerDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclMegaMenuSpacerDirective, isStandalone: true, selector: "li[eclMegaMenuSpacer]", host: { properties: { "class.ecl-mega-menu__spacer": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuSpacerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuSpacerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'li[eclMegaMenuSpacer]',
@@ -619,10 +619,10 @@ class EclMegaMenuSublistDirective extends ECLBaseDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuSublistDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.0.5", type: EclMegaMenuSublistDirective, isStandalone: true, selector: "ul[eclMegaMenuSublist]", outputs: { megaMenuSubItemClicked: "megaMenuSubItemClicked" }, host: { properties: { "style.height.px": "styleHeight()", "class.ecl-mega-menu__sublist": "this.cmpClass", "class.ecl-mega-menu__sublist--scrollable": "this.isScrollable", "style.top.px": "this.styleTop" } }, queries: [{ propertyName: "submenuItems", predicate: i0.forwardRef(() => EclMegaMenuSubitemComponent), isSignal: true }, { propertyName: "spacer", first: true, predicate: i0.forwardRef(() => EclMegaMenuSpacerDirective), descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuSublistDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.1.2", type: EclMegaMenuSublistDirective, isStandalone: true, selector: "ul[eclMegaMenuSublist]", outputs: { megaMenuSubItemClicked: "megaMenuSubItemClicked" }, host: { properties: { "style.height.px": "styleHeight()", "class.ecl-mega-menu__sublist": "this.cmpClass", "class.ecl-mega-menu__sublist--scrollable": "this.isScrollable", "style.top.px": "this.styleTop" } }, queries: [{ propertyName: "submenuItems", predicate: i0.forwardRef(() => EclMegaMenuSubitemComponent), isSignal: true }, { propertyName: "spacer", first: true, predicate: i0.forwardRef(() => EclMegaMenuSpacerDirective), descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuSublistDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuSublistDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ul[eclMegaMenuSublist]',
@@ -725,10 +725,10 @@ class EclMegaMenuInfoComponent extends ECLBaseDirective {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: EclMegaMenuInfoComponent, isStandalone: true, selector: "div[eclMegaMenuInfo]", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, titleId: { classPropertyName: "titleId", publicName: "titleId", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.opacity": "eclMegaMenuInfoStyleOpacity()", "class": "this.cssClasses", "style.height.px": "this.eclMegaMenuInfoStyleHeight" } }, queries: [{ propertyName: "linkItem", first: true, predicate: i0.forwardRef(() => EclLinkDirective), descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-mega-menu__info-title\" [attr.id]=\"titleId() || null\">{{ title() }}</span>\n<div class=\"ecl-mega-menu__info-scrollable\">\n    <div class=\"ecl-mega-menu__info-content\"><ng-content></ng-content>\n    </div>\n</div>" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.2", type: EclMegaMenuInfoComponent, isStandalone: true, selector: "div[eclMegaMenuInfo]", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, titleId: { classPropertyName: "titleId", publicName: "titleId", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.opacity": "eclMegaMenuInfoStyleOpacity()", "class": "this.cssClasses", "style.height.px": "this.eclMegaMenuInfoStyleHeight" } }, queries: [{ propertyName: "linkItem", first: true, predicate: i0.forwardRef(() => EclLinkDirective), descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-mega-menu__info-title\" [attr.id]=\"titleId() || null\">{{ title() }}</span>\n<div class=\"ecl-mega-menu__info-scrollable\">\n    <div class=\"ecl-mega-menu__info-content\"><ng-content></ng-content>\n    </div>\n</div>" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuInfoComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuInfoComponent, decorators: [{
             type: Component,
             args: [{ selector: 'div[eclMegaMenuInfo]', host: {
                         '[style.opacity]': 'eclMegaMenuInfoStyleOpacity()',
@@ -1258,10 +1258,10 @@ class EclMegaMenuItemComponent extends ECLBaseDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclMegaMenuItemComponent, isStandalone: true, selector: "li[eclMegaMenuItem]", inputs: { isPromotional: { classPropertyName: "isPromotional", publicName: "isPromotional", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isOneLevelOnly: { classPropertyName: "isOneLevelOnly", publicName: "isOneLevelOnly", isSignal: true, isRequired: false, transformFunction: null }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { megaMenuItemClicked: "megaMenuItemClicked", megaMenuItemKeydown: "megaMenuItemKeydown" }, host: { properties: { "class": "this.cssClasses", "attr.aria-haspopup": "this.hasPopup" } }, queries: [{ propertyName: "eclMegaMenuInfo", first: true, predicate: i0.forwardRef(() => EclMegaMenuInfoComponent), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuSublist", first: true, predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuSublists", predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuFeatured", first: true, predicate: i0.forwardRef(() => EclMegaMenuFeaturedComponent), isSignal: true }, { propertyName: "eclMegaMenuContainer", first: true, predicate: i0.forwardRef(() => EclMegaMenuContainerDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "eclMegaMenuMega", first: true, predicate: ["eclMegaMenuMega"], descendants: true, isSignal: true }, { propertyName: "mainPanel", first: true, predicate: ["mainPanel"], descendants: true, isSignal: true }, { propertyName: "menuLink", first: true, predicate: EclLinkDirective, descendants: true, isSignal: true }, { propertyName: "menuBtn", first: true, predicate: ["menuBtn"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (hasChildren) {\n<button #menuBtn eclButton variant=\"primary\" class=\"ecl-mega-menu__link\" (click)=\"onMegaMenuItemClick()\"\n    (keydown)=\"onKeydown($event)\">\n    <span eclButtonLabel>{{label()}}</span>\n    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-90\" size=\"2xs\"></ecl-icon>\n    <ecl-icon icon=\"arrow-left\" transform=\"flip-horizontal\" size=\"s\"></ecl-icon>\n</button>\n} @else if (href) {\n<a eclLink #menuLink variant=\"standalone\" [href]=\"href\" [target]=\"target()\" class=\"ecl-mega-menu__link\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onMegaMenuItemClick()\">\n    <span eclLinkLabel>{{label()}}</span>\n</a>\n} @else {\n<a eclLink #menuLink variant=\"standalone\" [attr.tabindex]=\"tabindex || 0\" [routerLink]=\"routerLink()\"\n    [queryParams]=\"queryParams()\" [queryParamsHandling]=\"queryParamsHandling()\" class=\"ecl-mega-menu__link\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onMegaMenuItemClick()\">\n    <span eclLinkLabel>{{label()}}</span>\n</a>\n}\n\n@if (hasSublist) {\n<div class=\"ecl-mega-menu__wrapper\" [style.height.px]=\"wrapperStyleHeight\" [style.top.px]=\"wrapperStyleTop\">\n    <div class=\"ecl-container\">\n        <ng-content select=\"[eclMegaMenuInfo]\"></ng-content>\n        <div #eclMegaMenuMega class=\"ecl-mega-menu__mega\" [class.ecl-mega-menu__mega--no-info]=\"hasNoInfo\"\n            [class.ecl-mega-menu__mega--has-featured]=\"hasFeatured\" [style.height.px]=\"megaMenuMegaStyleHeight()\"\n            [style.opacity]=\"megaMenuMegaStyleOpacity()\">\n            <ng-content select=\"[eclMegaMenuSublist]\"></ng-content>\n            <ng-content select=\"[eclMegaMenuFeatured]\"></ng-content>\n        </div>\n    </div>\n</div>\n}\n\n@if (hasContainer) {\n<div #mainPanel class=\"ecl-mega-menu__mega ecl-mega-menu__mega-container\">\n    <div class=\"ecl-container\" [style.height.px]=\"containerStyleHeight\">\n        <div class=\"ecl-mega-menu__mega-container-scrollable\">\n            <ng-content select=\"[eclMegaMenuContainer]\"></ng-content>\n        </div>\n    </div>\n</div>\n}", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: i3.EclLinkDirective, selector: "[eclLink]", inputs: ["extraAttributes", "isInverted", "isIconOnly", "isHighlight", "isNoVisited", "isBranded", "variant"] }, { kind: "directive", type: i3.EclLinkLabelDirective, selector: "[eclLinkLabel]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclMegaMenuItemComponent, isStandalone: true, selector: "li[eclMegaMenuItem]", inputs: { isPromotional: { classPropertyName: "isPromotional", publicName: "isPromotional", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isOneLevelOnly: { classPropertyName: "isOneLevelOnly", publicName: "isOneLevelOnly", isSignal: true, isRequired: false, transformFunction: null }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { megaMenuItemClicked: "megaMenuItemClicked", megaMenuItemKeydown: "megaMenuItemKeydown" }, host: { properties: { "class": "this.cssClasses", "attr.aria-haspopup": "this.hasPopup" } }, queries: [{ propertyName: "eclMegaMenuInfo", first: true, predicate: i0.forwardRef(() => EclMegaMenuInfoComponent), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuSublist", first: true, predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuSublists", predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true, isSignal: true }, { propertyName: "eclMegaMenuFeatured", first: true, predicate: i0.forwardRef(() => EclMegaMenuFeaturedComponent), isSignal: true }, { propertyName: "eclMegaMenuContainer", first: true, predicate: i0.forwardRef(() => EclMegaMenuContainerDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "eclMegaMenuMega", first: true, predicate: ["eclMegaMenuMega"], descendants: true, isSignal: true }, { propertyName: "mainPanel", first: true, predicate: ["mainPanel"], descendants: true, isSignal: true }, { propertyName: "menuLink", first: true, predicate: EclLinkDirective, descendants: true, isSignal: true }, { propertyName: "menuBtn", first: true, predicate: ["menuBtn"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (hasChildren) {\n<button #menuBtn eclButton variant=\"primary\" class=\"ecl-mega-menu__link\" (click)=\"onMegaMenuItemClick()\"\n    (keydown)=\"onKeydown($event)\">\n    <span eclButtonLabel>{{label()}}</span>\n    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-90\" size=\"2xs\"></ecl-icon>\n    <ecl-icon icon=\"arrow-left\" transform=\"flip-horizontal\" size=\"s\"></ecl-icon>\n</button>\n} @else if (href) {\n<a eclLink #menuLink variant=\"standalone\" [href]=\"href\" [target]=\"target()\" class=\"ecl-mega-menu__link\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onMegaMenuItemClick()\">\n    <span eclLinkLabel>{{label()}}</span>\n</a>\n} @else {\n<a eclLink #menuLink variant=\"standalone\" [attr.tabindex]=\"tabindex || 0\" [routerLink]=\"routerLink()\"\n    [queryParams]=\"queryParams()\" [queryParamsHandling]=\"queryParamsHandling()\" class=\"ecl-mega-menu__link\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onMegaMenuItemClick()\">\n    <span eclLinkLabel>{{label()}}</span>\n</a>\n}\n\n@if (hasSublist) {\n<div class=\"ecl-mega-menu__wrapper\" [style.height.px]=\"wrapperStyleHeight\" [style.top.px]=\"wrapperStyleTop\">\n    <div class=\"ecl-container\">\n        <ng-content select=\"[eclMegaMenuInfo]\"></ng-content>\n        <div #eclMegaMenuMega class=\"ecl-mega-menu__mega\" [class.ecl-mega-menu__mega--no-info]=\"hasNoInfo\"\n            [class.ecl-mega-menu__mega--has-featured]=\"hasFeatured\" [style.height.px]=\"megaMenuMegaStyleHeight()\"\n            [style.opacity]=\"megaMenuMegaStyleOpacity()\">\n            <ng-content select=\"[eclMegaMenuSublist]\"></ng-content>\n            <ng-content select=\"[eclMegaMenuFeatured]\"></ng-content>\n        </div>\n    </div>\n</div>\n}\n\n@if (hasContainer) {\n<div #mainPanel class=\"ecl-mega-menu__mega ecl-mega-menu__mega-container\">\n    <div class=\"ecl-container\" [style.height.px]=\"containerStyleHeight\">\n        <div class=\"ecl-mega-menu__mega-container-scrollable\">\n            <ng-content select=\"[eclMegaMenuContainer]\"></ng-content>\n        </div>\n    </div>\n</div>\n}", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: i3.EclLinkDirective, selector: "[eclLink]", inputs: ["extraAttributes", "isInverted", "isIconOnly", "isHighlight", "isNoVisited", "isBranded", "variant"] }, { kind: "directive", type: i3.EclLinkLabelDirective, selector: "[eclLinkLabel]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'li[eclMegaMenuItem]', imports: [RouterLink, RouterLinkWithHref, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON, ...EUI_ECL_LINK], template: "@if (hasChildren) {\n<button #menuBtn eclButton variant=\"primary\" class=\"ecl-mega-menu__link\" (click)=\"onMegaMenuItemClick()\"\n    (keydown)=\"onKeydown($event)\">\n    <span eclButtonLabel>{{label()}}</span>\n    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-90\" size=\"2xs\"></ecl-icon>\n    <ecl-icon icon=\"arrow-left\" transform=\"flip-horizontal\" size=\"s\"></ecl-icon>\n</button>\n} @else if (href) {\n<a eclLink #menuLink variant=\"standalone\" [href]=\"href\" [target]=\"target()\" class=\"ecl-mega-menu__link\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onMegaMenuItemClick()\">\n    <span eclLinkLabel>{{label()}}</span>\n</a>\n} @else {\n<a eclLink #menuLink variant=\"standalone\" [attr.tabindex]=\"tabindex || 0\" [routerLink]=\"routerLink()\"\n    [queryParams]=\"queryParams()\" [queryParamsHandling]=\"queryParamsHandling()\" class=\"ecl-mega-menu__link\"\n    (keydown)=\"onKeydown($event)\" (click)=\"onMegaMenuItemClick()\">\n    <span eclLinkLabel>{{label()}}</span>\n</a>\n}\n\n@if (hasSublist) {\n<div class=\"ecl-mega-menu__wrapper\" [style.height.px]=\"wrapperStyleHeight\" [style.top.px]=\"wrapperStyleTop\">\n    <div class=\"ecl-container\">\n        <ng-content select=\"[eclMegaMenuInfo]\"></ng-content>\n        <div #eclMegaMenuMega class=\"ecl-mega-menu__mega\" [class.ecl-mega-menu__mega--no-info]=\"hasNoInfo\"\n            [class.ecl-mega-menu__mega--has-featured]=\"hasFeatured\" [style.height.px]=\"megaMenuMegaStyleHeight()\"\n            [style.opacity]=\"megaMenuMegaStyleOpacity()\">\n            <ng-content select=\"[eclMegaMenuSublist]\"></ng-content>\n            <ng-content select=\"[eclMegaMenuFeatured]\"></ng-content>\n        </div>\n    </div>\n</div>\n}\n\n@if (hasContainer) {\n<div #mainPanel class=\"ecl-mega-menu__mega ecl-mega-menu__mega-container\">\n    <div class=\"ecl-container\" [style.height.px]=\"containerStyleHeight\">\n        <div class=\"ecl-mega-menu__mega-container-scrollable\">\n            <ng-content select=\"[eclMegaMenuContainer]\"></ng-content>\n        </div>\n    </div>\n</div>\n}" }]
         }], ctorParameters: () => [], propDecorators: { cssClasses: [{
@@ -1660,10 +1660,10 @@ class EclMegaMenuComponent extends ECLBaseDirective {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: EclMegaMenuComponent, isStandalone: true, selector: "nav[eclMegaMenu]", outputs: { megaMenuItemSelect: "megaMenuItemSelect" }, host: { listeners: { "eclClickOutside": "onClickOutsideMegaMenu()" }, properties: { "class": "this.cssClasses", "attr.data-expanded": "this.expandedAttr", "attr.role": "this.role" } }, queries: [{ propertyName: "menuItems", predicate: i0.forwardRef(() => EclMegaMenuItemComponent), descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1$1.ECLBaseDirective }, { directive: i1$1.ECLClickOutsideDirective, outputs: ["eclClickOutside", "eclClickOutside"] }], ngImport: i0, template: "<div class=\"ecl-mega-menu__overlay\" [style.top.px]=\"overlayStyleTop\"></div>\n<div class=\"ecl-container ecl-mega-menu__container\">\n    <button class=\"ecl-button ecl-button--tertiary ecl-mega-menu__open ecl-button--icon-only\"\n        type=\"button\" [attr.aria-expanded]=\"isMobileExpanded\" (click)=\"onMegaMenuMobileOpen()\">\n        <ecl-icon icon=\"hamburger\" size=\"m\"></ecl-icon>\n        <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n        <span class=\"ecl-button__label\">{{ (isOpenMobile ? 'ecl.common.CLOSE' : 'ecl.menu.MENU') | translate }}</span>\n    </button>\n    <section class=\"ecl-mega-menu__inner\" [class.ecl-mega-menu__inner--expanded]=\"!isStartPanel && isExpanded\"\n        aria-label=\"ecl mega menu\" [style.top.px]=\"innerStyleTop\">\n        <header class=\"ecl-mega-menu__inner-header\">\n            <button eclButton variant=\"tertiary\" eclStyle=\"neutral\" class=\"ecl-mega-menu__back\" type=\"submit\" (click)=\"onMegaMenuBack()\">\n                <ecl-icon icon=\"corner-arrow\" transform=\"rotate-270\"></ecl-icon>\n                <span eclButtonLabel>Back</span>\n            </button>\n        </header>\n        <ng-content></ng-content>\n    </section>\n</div>", dependencies: [{ kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.2", type: EclMegaMenuComponent, isStandalone: true, selector: "nav[eclMegaMenu]", outputs: { megaMenuItemSelect: "megaMenuItemSelect" }, host: { listeners: { "eclClickOutside": "onClickOutsideMegaMenu()" }, properties: { "class": "this.cssClasses", "attr.data-expanded": "this.expandedAttr", "attr.role": "this.role" } }, queries: [{ propertyName: "menuItems", predicate: i0.forwardRef(() => EclMegaMenuItemComponent), descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1$1.ECLBaseDirective }, { directive: i1$1.ECLClickOutsideDirective, outputs: ["eclClickOutside", "eclClickOutside"] }], ngImport: i0, template: "<div class=\"ecl-mega-menu__overlay\" [style.top.px]=\"overlayStyleTop\"></div>\n<div class=\"ecl-container ecl-mega-menu__container\">\n    <button class=\"ecl-button ecl-button--tertiary ecl-mega-menu__open ecl-button--icon-only\"\n        type=\"button\" [attr.aria-expanded]=\"isMobileExpanded\" (click)=\"onMegaMenuMobileOpen()\">\n        <ecl-icon icon=\"hamburger\" size=\"m\"></ecl-icon>\n        <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n        <span class=\"ecl-button__label\">{{ (isOpenMobile ? 'ecl.common.CLOSE' : 'ecl.menu.MENU') | translate }}</span>\n    </button>\n    <section class=\"ecl-mega-menu__inner\" [class.ecl-mega-menu__inner--expanded]=\"!isStartPanel && isExpanded\"\n        aria-label=\"ecl mega menu\" [style.top.px]=\"innerStyleTop\">\n        <header class=\"ecl-mega-menu__inner-header\">\n            <button eclButton variant=\"tertiary\" eclStyle=\"neutral\" class=\"ecl-mega-menu__back\" type=\"submit\" (click)=\"onMegaMenuBack()\">\n                <ecl-icon icon=\"corner-arrow\" transform=\"rotate-270\"></ecl-icon>\n                <span eclButtonLabel>Back</span>\n            </button>\n        </header>\n        <ng-content></ng-content>\n    </section>\n</div>", dependencies: [{ kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMegaMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMegaMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'nav[eclMegaMenu]', imports: [TranslatePipe, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON], hostDirectives: [
                         {

package/fesm2022/eui-ecl-components-ecl-menu.mjs

@@ -176,10 +176,10 @@ class EclMenuMegaItemComponent extends ECLBaseDirective {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuMegaItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclMenuMegaItemComponent, isStandalone: true, selector: "ecl-menu-mega-item", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isCurrent: { classPropertyName: "isCurrent", publicName: "isCurrent", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, isSeeAll: { classPropertyName: "isSeeAll", publicName: "isSeeAll", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuItemSelect: "menuItemSelect", menuItemKeydown: "menuItemKeydown" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class.ecl-menu__subitem": "this.cmpClass", "attr.role": "this.role", "class.ecl-menu__subitem--current": "this.isCurrent", "class.ecl-menu__see-all": "this.isSeeAll" } }, queries: [{ propertyName: "iconComponents", predicate: i0.forwardRef(() => EclIconComponent), isSignal: true }, { propertyName: "links", predicate: i0.forwardRef(() => EclLinkDirective), isSignal: true }], viewQueries: [{ propertyName: "megaMenuLink", first: true, predicate: ["megaMenuLink"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (!isSeeAll) {\n    @if (href) {\n        <a  #megaMenuLink\n            [href]=\"href\"\n            [target]=\"target()\"\n            class=\"ecl-link ecl-link--standalone ecl-menu__sublink\"\n            [class.ecl-menu__sublink--current]=\"isCurrent\"\n            [attr.aria-current]=\"ariaCurrent\"\n            (click)=\"onItemClick($event)\"\n            (keydown)=\"onKeydown($event)\">\n            {{ label }}\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </a>\n    } @else {\n        <a  #megaMenuLink\n            tabindex=\"0\"\n            [routerLink]=\"routerLink()\"\n            [queryParams]=\"queryParams()\"\n            [queryParamsHandling]=\"queryParamsHandling()\"\n            class=\"ecl-link ecl-link--standalone ecl-menu__sublink\"\n            [class.ecl-menu__sublink--current]=\"isCurrent\"\n            [attr.aria-current]=\"ariaCurrent\"\n            (click)=\"onItemClick($event)\"\n            (keydown)=\"onKeydown($event)\">\n            {{ label }}\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </a>\n    }\n} @else {\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: [":host{display:list-item}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuMegaItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclMenuMegaItemComponent, isStandalone: true, selector: "ecl-menu-mega-item", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isCurrent: { classPropertyName: "isCurrent", publicName: "isCurrent", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, isSeeAll: { classPropertyName: "isSeeAll", publicName: "isSeeAll", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuItemSelect: "menuItemSelect", menuItemKeydown: "menuItemKeydown" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class.ecl-menu__subitem": "this.cmpClass", "attr.role": "this.role", "class.ecl-menu__subitem--current": "this.isCurrent", "class.ecl-menu__see-all": "this.isSeeAll" } }, queries: [{ propertyName: "iconComponents", predicate: i0.forwardRef(() => EclIconComponent), isSignal: true }, { propertyName: "links", predicate: i0.forwardRef(() => EclLinkDirective), isSignal: true }], viewQueries: [{ propertyName: "megaMenuLink", first: true, predicate: ["megaMenuLink"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (!isSeeAll) {\n    @if (href) {\n        <a  #megaMenuLink\n            [href]=\"href\"\n            [target]=\"target()\"\n            class=\"ecl-link ecl-link--standalone ecl-menu__sublink\"\n            [class.ecl-menu__sublink--current]=\"isCurrent\"\n            [attr.aria-current]=\"ariaCurrent\"\n            (click)=\"onItemClick($event)\"\n            (keydown)=\"onKeydown($event)\">\n            {{ label }}\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </a>\n    } @else {\n        <a  #megaMenuLink\n            tabindex=\"0\"\n            [routerLink]=\"routerLink()\"\n            [queryParams]=\"queryParams()\"\n            [queryParamsHandling]=\"queryParamsHandling()\"\n            class=\"ecl-link ecl-link--standalone ecl-menu__sublink\"\n            [class.ecl-menu__sublink--current]=\"isCurrent\"\n            [attr.aria-current]=\"ariaCurrent\"\n            (click)=\"onItemClick($event)\"\n            (keydown)=\"onKeydown($event)\">\n            {{ label }}\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </a>\n    }\n} @else {\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: [":host{display:list-item}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuMegaItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuMegaItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-menu-mega-item', imports: [NgTemplateOutlet, RouterLink], template: "@if (!isSeeAll) {\n    @if (href) {\n        <a  #megaMenuLink\n            [href]=\"href\"\n            [target]=\"target()\"\n            class=\"ecl-link ecl-link--standalone ecl-menu__sublink\"\n            [class.ecl-menu__sublink--current]=\"isCurrent\"\n            [attr.aria-current]=\"ariaCurrent\"\n            (click)=\"onItemClick($event)\"\n            (keydown)=\"onKeydown($event)\">\n            {{ label }}\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </a>\n    } @else {\n        <a  #megaMenuLink\n            tabindex=\"0\"\n            [routerLink]=\"routerLink()\"\n            [queryParams]=\"queryParams()\"\n            [queryParamsHandling]=\"queryParamsHandling()\"\n            class=\"ecl-link ecl-link--standalone ecl-menu__sublink\"\n            [class.ecl-menu__sublink--current]=\"isCurrent\"\n            [attr.aria-current]=\"ariaCurrent\"\n            (click)=\"onItemClick($event)\"\n            (keydown)=\"onKeydown($event)\">\n            {{ label }}\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </a>\n    }\n} @else {\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: [":host{display:list-item}\n"] }]
         }], propDecorators: { id: [{
@@ -348,10 +348,10 @@ class EclMenuMegaComponent extends ECLBaseDirective {
     getMegaMenuItemsArray() {
         return this.eclMenuMegaItems.toArray();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuMegaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EclMenuMegaComponent, isStandalone: true, selector: "ecl-menu-mega", outputs: { menuItemSelect: "menuItemSelect", menuMegaItemParentFocus: "menuMegaItemParentFocus", menuMegaLastItemTab: "menuMegaLastItemTab" }, host: { properties: { "class.ecl-menu__mega--rtl": "this.isRtlDisplay", "style.left.px": "this.offsetLeft", "style.right.px": "this.offsetRight", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclMenuMegaItems", predicate: EclMenuMegaItemComponent }], usesInheritance: true, ngImport: i0, template: "<ul class=\"ecl-menu__sublist\">\n    <ng-content></ng-content>\n</ul>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuMegaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EclMenuMegaComponent, isStandalone: true, selector: "ecl-menu-mega", outputs: { menuItemSelect: "menuItemSelect", menuMegaItemParentFocus: "menuMegaItemParentFocus", menuMegaLastItemTab: "menuMegaLastItemTab" }, host: { properties: { "class.ecl-menu__mega--rtl": "this.isRtlDisplay", "style.left.px": "this.offsetLeft", "style.right.px": "this.offsetRight", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclMenuMegaItems", predicate: EclMenuMegaItemComponent }], usesInheritance: true, ngImport: i0, template: "<ul class=\"ecl-menu__sublist\">\n    <ng-content></ng-content>\n</ul>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuMegaComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuMegaComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-menu-mega', template: "<ul class=\"ecl-menu__sublist\">\n    <ng-content></ng-content>\n</ul>\n" }]
         }], ctorParameters: () => [], propDecorators: { isRtlDisplay: [{
@@ -772,10 +772,10 @@ class EclMenuItemComponent extends ECLBaseDirective {
             this.isMobileBreakpoint = isMobile;
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclMenuItemComponent, isStandalone: true, selector: "ecl-menu-item", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, toggleAriaLabel: { classPropertyName: "toggleAriaLabel", publicName: "toggleAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isCurrent: { classPropertyName: "isCurrent", publicName: "isCurrent", isSignal: false, isRequired: false, transformFunction: null }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuItemSelect: "menuItemSelect", menuItemCaret: "menuItemCaret", menuItemHover: "menuItemHover", menuItemHoverOut: "menuItemHoverOut", menuMegaItemSelect: "menuMegaItemSelect", menuItemFocus: "menuItemFocus", menuItemKeydown: "menuItemKeydown", menuMegaLastItemTab: "menuMegaLastItemTab" }, host: { attributes: { "role": "listitem" }, listeners: { "mouseenter": "onItemMouseEnter($event)", "mouseleave": "onItemMouseLeave($event)" }, properties: { "class": "cssClasses", "class.ecl-menu__item--has-children": "hasEclChildrenDataAttribute", "attr.aria-haspopup": "hasEclChildrenDataAttribute", "attr.data-expanded": "isDataExpanded" } }, queries: [{ propertyName: "submenu", first: true, predicate: i0.forwardRef(() => EclMenuMegaComponent), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "menuLink", first: true, predicate: ["menuLink"], descendants: true, isSignal: true }, { propertyName: "menuButton", first: true, predicate: EclButtonComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (href) {\n    <a eclLink\n        #menuLink\n        variant=\"standalone\"\n        [href]=\"href\"\n        [target]=\"target()\"\n        class=\"ecl-menu__link\"\n        [class.ecl-menu__link--current]=\"isCurrent\"\n        [attr.aria-current]=\"ariaCurrent\"\n        (focus)=\"onItemFocus($event)\"\n        (click)=\"onItemClick($event)\"\n        (keydown)=\"onLinkKeydown($event)\">\n        {{ label }}\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </a>\n} @else {\n    <a eclLink\n        #menuLink\n        variant=\"standalone\"\n        [attr.tabindex]=\"tabindex || 0\"\n        [routerLink]=\"routerLink()\"\n        [queryParams]=\"queryParams()\"\n        [queryParamsHandling]=\"queryParamsHandling()\"\n        class=\"ecl-menu__link\"\n        [class.ecl-menu__link--current]=\"isCurrent\"\n        [attr.aria-current]=\"ariaCurrent\"\n        (focus)=\"onItemFocus($event)\"\n        (click)=\"onItemClick($event)\"\n        (keydown)=\"onLinkKeydown($event)\">\n        {{ label }}\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </a>\n}\n\n@if (hasChildren) {\n    @if (isMobileBreakpoint) {\n        <button\n            eclButton\n            variant=\"tertiary\"\n            class=\"ecl-menu__button-caret ecl-button--neutral\"\n            type=\"button\"\n            [attr.aria-label]=\"toggleAriaLabel() || 'Access item children'\"\n            (click)=\"onItemCaretClick($event)\"\n            (keydown)=\"onButtonKeydown($event)\">\n            <ecl-icon icon=\"corner-arrow\" size=\"m\" transform=\"rotate-180\" class=\"ecl-button__icon\"></ecl-icon>\n        </button>\n    } @else {\n        <button\n            eclButton\n            variant=\"tertiary\"\n            class=\"ecl-menu__button-caret ecl-button--neutral\"\n            type=\"button\"\n            [attr.aria-label]=\"toggleAriaLabel() || 'Access item children'\"\n            [attr.data-expanded]=\"isDataExpanded\"\n            (keydown)=\"onButtonKeydown($event)\">\n            <ecl-icon icon=\"corner-arrow\" size=\"m\" transform=\"rotate-180\" class=\"ecl-button__icon\"></ecl-icon>\n        </button>\n    }\n}\n\n<ng-content select=\"ecl-menu-mega\"></ng-content>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: i3.EclLinkDirective, selector: "[eclLink]", inputs: ["extraAttributes", "isInverted", "isIconOnly", "isHighlight", "isNoVisited", "isBranded", "variant"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclMenuItemComponent, isStandalone: true, selector: "ecl-menu-item", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, toggleAriaLabel: { classPropertyName: "toggleAriaLabel", publicName: "toggleAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, queryParams: { classPropertyName: "queryParams", publicName: "queryParams", isSignal: true, isRequired: false, transformFunction: null }, queryParamsHandling: { classPropertyName: "queryParamsHandling", publicName: "queryParamsHandling", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: false, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, isCurrent: { classPropertyName: "isCurrent", publicName: "isCurrent", isSignal: false, isRequired: false, transformFunction: null }, linkExtraAttributes: { classPropertyName: "linkExtraAttributes", publicName: "linkExtraAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuItemSelect: "menuItemSelect", menuItemCaret: "menuItemCaret", menuItemHover: "menuItemHover", menuItemHoverOut: "menuItemHoverOut", menuMegaItemSelect: "menuMegaItemSelect", menuItemFocus: "menuItemFocus", menuItemKeydown: "menuItemKeydown", menuMegaLastItemTab: "menuMegaLastItemTab" }, host: { attributes: { "role": "listitem" }, listeners: { "mouseenter": "onItemMouseEnter($event)", "mouseleave": "onItemMouseLeave($event)" }, properties: { "class": "cssClasses", "class.ecl-menu__item--has-children": "hasEclChildrenDataAttribute", "attr.aria-haspopup": "hasEclChildrenDataAttribute", "attr.data-expanded": "isDataExpanded" } }, queries: [{ propertyName: "submenu", first: true, predicate: i0.forwardRef(() => EclMenuMegaComponent), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "menuLink", first: true, predicate: ["menuLink"], descendants: true, isSignal: true }, { propertyName: "menuButton", first: true, predicate: EclButtonComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (href) {\n    <a eclLink\n        #menuLink\n        variant=\"standalone\"\n        [href]=\"href\"\n        [target]=\"target()\"\n        class=\"ecl-menu__link\"\n        [class.ecl-menu__link--current]=\"isCurrent\"\n        [attr.aria-current]=\"ariaCurrent\"\n        (focus)=\"onItemFocus($event)\"\n        (click)=\"onItemClick($event)\"\n        (keydown)=\"onLinkKeydown($event)\">\n        {{ label }}\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </a>\n} @else {\n    <a eclLink\n        #menuLink\n        variant=\"standalone\"\n        [attr.tabindex]=\"tabindex || 0\"\n        [routerLink]=\"routerLink()\"\n        [queryParams]=\"queryParams()\"\n        [queryParamsHandling]=\"queryParamsHandling()\"\n        class=\"ecl-menu__link\"\n        [class.ecl-menu__link--current]=\"isCurrent\"\n        [attr.aria-current]=\"ariaCurrent\"\n        (focus)=\"onItemFocus($event)\"\n        (click)=\"onItemClick($event)\"\n        (keydown)=\"onLinkKeydown($event)\">\n        {{ label }}\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </a>\n}\n\n@if (hasChildren) {\n    @if (isMobileBreakpoint) {\n        <button\n            eclButton\n            variant=\"tertiary\"\n            class=\"ecl-menu__button-caret ecl-button--neutral\"\n            type=\"button\"\n            [attr.aria-label]=\"toggleAriaLabel() || 'Access item children'\"\n            (click)=\"onItemCaretClick($event)\"\n            (keydown)=\"onButtonKeydown($event)\">\n            <ecl-icon icon=\"corner-arrow\" size=\"m\" transform=\"rotate-180\" class=\"ecl-button__icon\"></ecl-icon>\n        </button>\n    } @else {\n        <button\n            eclButton\n            variant=\"tertiary\"\n            class=\"ecl-menu__button-caret ecl-button--neutral\"\n            type=\"button\"\n            [attr.aria-label]=\"toggleAriaLabel() || 'Access item children'\"\n            [attr.data-expanded]=\"isDataExpanded\"\n            (keydown)=\"onButtonKeydown($event)\">\n            <ecl-icon icon=\"corner-arrow\" size=\"m\" transform=\"rotate-180\" class=\"ecl-button__icon\"></ecl-icon>\n        </button>\n    }\n}\n\n<ng-content select=\"ecl-menu-mega\"></ng-content>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: i3.EclLinkDirective, selector: "[eclLink]", inputs: ["extraAttributes", "isInverted", "isIconOnly", "isHighlight", "isNoVisited", "isBranded", "variant"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-menu-item', imports: [NgTemplateOutlet, RouterLink, RouterLinkWithHref, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON, ...EUI_ECL_LINK], encapsulation: ViewEncapsulation.None, host: {
                         role: 'listitem',
@@ -1523,10 +1523,10 @@ class EclMenuComponent extends ECLBaseDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclMenuComponent, isStandalone: true, selector: "ecl-menu", inputs: { maxLines: { classPropertyName: "maxLines", publicName: "maxLines", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuItemSelect: "menuItemSelect", openHamburgerMenu: "openHamburgerMenu", closeHamburgerMenu: "closeHamburgerMenu" }, host: { attributes: { "role": "navigation" }, listeners: { "document:click": "onDocumentClick($event)", "keydown.escape": "onEscapePress($event)" }, properties: { "class": "cssClasses", "class.ecl-menu--forced-mobile": "isTablet", "class.ecl-menu--forced-close": "isMenuHidden", "attr.data-expanded": "isHamburgerMenuOpened ? \"\" : null" } }, queries: [{ propertyName: "eclRootMenuItems", predicate: EclMenuItemComponent }], viewQueries: [{ propertyName: "innerSection", first: true, predicate: ["innerSection"], descendants: true, isSignal: true }, { propertyName: "itemsList", first: true, predicate: ["itemsList"], descendants: true, isSignal: true }, { propertyName: "btnPrevious", first: true, predicate: ["btnPrevious"], descendants: true, isSignal: true }, { propertyName: "btnNext", first: true, predicate: ["btnNext"], descendants: true, isSignal: true }, { propertyName: "openCloseButton", first: true, predicate: ["openCloseButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-menu__overlay\" [style.top.px]=\"overlayStyleTop\"></div>\n<div class=\"ecl-container ecl-menu__container\">\n    <button #openCloseButton eclButton isIconOnly variant=\"tertiary\" eclStyle=\"neutral\" type=\"button\" class=\"ecl-menu__open\"\n        (click)=\"onMenuOpenCloseClick($event)\" [attr.aria-expanded]=\"isHamburgerMenuOpened\">\n        <ecl-icon icon=\"hamburger\" size=\"m\"></ecl-icon>\n        <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n        @if (isHamburgerMenuOpened) {\n        <span eclButtonLabel>{{ 'ecl.common.CLOSE' | translate }}</span>\n        } @else {\n        <span eclButtonLabel>{{ 'ecl.menu.MENU' | translate }}</span>\n        }\n    </button>\n\n    <section\n        class=\"ecl-menu__inner\"\n        #innerSection\n        [class.ecl-menu__inner--expanded]=\"isMenuExpandedInMobile\"\n        [class.ecl-menu__inner--has-overflow]=\"hasOverflow\"\n        aria-label=\"Menu\" [style.top.px]=\"innerStyleTop\">\n        <header class=\"ecl-menu__inner-header\">\n            <button\n                eclButton\n                variant=\"tertiary\"\n                class=\"ecl-menu__close\"\n                containerStyleClass=\"ecl-menu__close-container\"\n                (click)=\"onMenuCloseClick($event)\">\n                <span eclButtonLabel>{{ 'ecl.common.CLOSE' | translate }}</span>\n                <ecl-icon icon=\"close\" size=\"s\"></ecl-icon>\n            </button>\n\n            <div class=\"ecl-menu__title\">{{ 'ecl.menu.MENU' | translate }}</div>\n\n            <button eclButton variant=\"tertiary\" class=\"ecl-menu__back\" (click)=\"onMenuBackClick($event)\">\n                <ecl-icon icon=\"corner-arrow\" size=\"s\" transform=\"rotate-270\"></ecl-icon>\n                <span eclButtonLabel>{{ 'ecl.common.BACK' | translate }}</span>\n            </button>\n        </header>\n        <button\n            eclButton\n            #btnPrevious\n            tabindex=\"-1\"\n            variant=\"tertiary\"\n            isIconOnly\n            class=\"ecl-menu__item ecl-menu__items-previous\"\n            [class.ecl-menu__item--current]=\"isPrevBtnCurrentClass\"\n            [style.display]=\"isShowPrevBtn() ? 'flex' : 'none'\"\n            (click)=\"onPrevBtnClick()\">\n            <ecl-icon icon=\"corner-arrow\" size=\"s\" transform=\"rotate-270\"></ecl-icon>\n            <span eclButtonLabel class=\"ecl-u-sr-only\">{{ 'ecl.common.PREVIOUS' | translate }}</span>\n        </button>\n        <button\n            eclButton\n            #btnNext\n            variant=\"tertiary\"\n            tabindex=\"-1\"\n            isIconOnly\n            class=\"ecl-menu__item ecl-menu__items-next\"\n            [class.ecl-menu__item--current]=\"!isPrevBtnCurrentClass\"\n            [style.display]=\"isShowNextBtn() ? 'flex' : 'none'\"\n            (click)=\"onNextBtnClick()\">\n            <ecl-icon icon=\"corner-arrow\" size=\"s\" transform=\"rotate-90\"></ecl-icon>\n            <span eclButtonLabel class=\"ecl-u-sr-only\">{{ 'ecl.common.NEXT' | translate }}</span>\n        </button>\n        <ul class=\"ecl-menu__list\" #itemsList [style.right]=\"menuListStyleRight\" [style.left]=\"menuListStyleLeft\">\n            <ng-content></ng-content>\n        </ul>\n    </section>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclMenuComponent, isStandalone: true, selector: "ecl-menu", inputs: { maxLines: { classPropertyName: "maxLines", publicName: "maxLines", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuItemSelect: "menuItemSelect", openHamburgerMenu: "openHamburgerMenu", closeHamburgerMenu: "closeHamburgerMenu" }, host: { attributes: { "role": "navigation" }, listeners: { "document:click": "onDocumentClick($event)", "keydown.escape": "onEscapePress($event)" }, properties: { "class": "cssClasses", "class.ecl-menu--forced-mobile": "isTablet", "class.ecl-menu--forced-close": "isMenuHidden", "attr.data-expanded": "isHamburgerMenuOpened ? \"\" : null" } }, queries: [{ propertyName: "eclRootMenuItems", predicate: EclMenuItemComponent }], viewQueries: [{ propertyName: "innerSection", first: true, predicate: ["innerSection"], descendants: true, isSignal: true }, { propertyName: "itemsList", first: true, predicate: ["itemsList"], descendants: true, isSignal: true }, { propertyName: "btnPrevious", first: true, predicate: ["btnPrevious"], descendants: true, isSignal: true }, { propertyName: "btnNext", first: true, predicate: ["btnNext"], descendants: true, isSignal: true }, { propertyName: "openCloseButton", first: true, predicate: ["openCloseButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-menu__overlay\" [style.top.px]=\"overlayStyleTop\"></div>\n<div class=\"ecl-container ecl-menu__container\">\n    <button #openCloseButton eclButton isIconOnly variant=\"tertiary\" eclStyle=\"neutral\" type=\"button\" class=\"ecl-menu__open\"\n        (click)=\"onMenuOpenCloseClick($event)\" [attr.aria-expanded]=\"isHamburgerMenuOpened\">\n        <ecl-icon icon=\"hamburger\" size=\"m\"></ecl-icon>\n        <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n        @if (isHamburgerMenuOpened) {\n        <span eclButtonLabel>{{ 'ecl.common.CLOSE' | translate }}</span>\n        } @else {\n        <span eclButtonLabel>{{ 'ecl.menu.MENU' | translate }}</span>\n        }\n    </button>\n\n    <section\n        class=\"ecl-menu__inner\"\n        #innerSection\n        [class.ecl-menu__inner--expanded]=\"isMenuExpandedInMobile\"\n        [class.ecl-menu__inner--has-overflow]=\"hasOverflow\"\n        aria-label=\"Menu\" [style.top.px]=\"innerStyleTop\">\n        <header class=\"ecl-menu__inner-header\">\n            <button\n                eclButton\n                variant=\"tertiary\"\n                class=\"ecl-menu__close\"\n                containerStyleClass=\"ecl-menu__close-container\"\n                (click)=\"onMenuCloseClick($event)\">\n                <span eclButtonLabel>{{ 'ecl.common.CLOSE' | translate }}</span>\n                <ecl-icon icon=\"close\" size=\"s\"></ecl-icon>\n            </button>\n\n            <div class=\"ecl-menu__title\">{{ 'ecl.menu.MENU' | translate }}</div>\n\n            <button eclButton variant=\"tertiary\" class=\"ecl-menu__back\" (click)=\"onMenuBackClick($event)\">\n                <ecl-icon icon=\"corner-arrow\" size=\"s\" transform=\"rotate-270\"></ecl-icon>\n                <span eclButtonLabel>{{ 'ecl.common.BACK' | translate }}</span>\n            </button>\n        </header>\n        <button\n            eclButton\n            #btnPrevious\n            tabindex=\"-1\"\n            variant=\"tertiary\"\n            isIconOnly\n            class=\"ecl-menu__item ecl-menu__items-previous\"\n            [class.ecl-menu__item--current]=\"isPrevBtnCurrentClass\"\n            [style.display]=\"isShowPrevBtn() ? 'flex' : 'none'\"\n            (click)=\"onPrevBtnClick()\">\n            <ecl-icon icon=\"corner-arrow\" size=\"s\" transform=\"rotate-270\"></ecl-icon>\n            <span eclButtonLabel class=\"ecl-u-sr-only\">{{ 'ecl.common.PREVIOUS' | translate }}</span>\n        </button>\n        <button\n            eclButton\n            #btnNext\n            variant=\"tertiary\"\n            tabindex=\"-1\"\n            isIconOnly\n            class=\"ecl-menu__item ecl-menu__items-next\"\n            [class.ecl-menu__item--current]=\"!isPrevBtnCurrentClass\"\n            [style.display]=\"isShowNextBtn() ? 'flex' : 'none'\"\n            (click)=\"onNextBtnClick()\">\n            <ecl-icon icon=\"corner-arrow\" size=\"s\" transform=\"rotate-90\"></ecl-icon>\n            <span eclButtonLabel class=\"ecl-u-sr-only\">{{ 'ecl.common.NEXT' | translate }}</span>\n        </button>\n        <ul class=\"ecl-menu__list\" #itemsList [style.right]=\"menuListStyleRight\" [style.left]=\"menuListStyleLeft\">\n            <ng-content></ng-content>\n        </ul>\n    </section>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-menu', imports: [TranslatePipe, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON], host: {
                         role: 'navigation',