@eui/ecl 21.0.0-alpha.27 → 21.0.0-alpha.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/docs/changelog.html +66 -0
- package/docs/js/search/search_index.js +2 -2
- package/docs/properties.html +1 -1
- package/fesm2022/eui-ecl-components-ecl-accordion.mjs +10 -10
- package/fesm2022/eui-ecl-components-ecl-app.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-banner.mjs +34 -34
- package/fesm2022/eui-ecl-components-ecl-blockquote.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-breadcrumb.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-button.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-card.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-carousel.mjs +10 -10
- package/fesm2022/eui-ecl-components-ecl-category-filter.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-checkbox.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-content-block.mjs +58 -58
- package/fesm2022/eui-ecl-components-ecl-content-item.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-date-block.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-date-picker.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-expandable.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-fact-figures.mjs +22 -22
- package/fesm2022/eui-ecl-components-ecl-featured.mjs +25 -25
- package/fesm2022/eui-ecl-components-ecl-feedback-message.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-file-upload.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-file.mjs +34 -34
- package/fesm2022/eui-ecl-components-ecl-form-group.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-form-label.mjs +10 -10
- package/fesm2022/eui-ecl-components-ecl-gallery.mjs +22 -22
- package/fesm2022/eui-ecl-components-ecl-help-block.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-icon.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-inpage-navigation.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-label.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-link.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-list-illustration.mjs +19 -19
- package/fesm2022/eui-ecl-components-ecl-list.mjs +31 -31
- package/fesm2022/eui-ecl-components-ecl-loading-indicator.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-media-container.mjs +19 -19
- package/fesm2022/eui-ecl-components-ecl-mega-menu.mjs +49 -49
- package/fesm2022/eui-ecl-components-ecl-menu.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-modal.mjs +25 -25
- package/fesm2022/eui-ecl-components-ecl-multiselect.mjs +25 -25
- package/fesm2022/eui-ecl-components-ecl-navigation-list.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-news-ticker.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-notification.mjs +10 -10
- package/fesm2022/eui-ecl-components-ecl-page-header.mjs +37 -37
- package/fesm2022/eui-ecl-components-ecl-pagination.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-popover.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-radio.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-range.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-rating-field.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-search-form.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-select.mjs +10 -10
- package/fesm2022/eui-ecl-components-ecl-separator.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-site-footer.mjs +61 -61
- package/fesm2022/eui-ecl-components-ecl-site-header.mjs +64 -64
- package/fesm2022/eui-ecl-components-ecl-social-media-follow.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-social-media-share.mjs +13 -13
- package/fesm2022/eui-ecl-components-ecl-splash-page.mjs +31 -31
- package/fesm2022/eui-ecl-components-ecl-sticky-container.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-table.mjs +34 -34
- package/fesm2022/eui-ecl-components-ecl-tabs.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-tag.mjs +16 -16
- package/fesm2022/eui-ecl-components-ecl-text-area.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-text-input.mjs +7 -7
- package/fesm2022/eui-ecl-components-ecl-timeline.mjs +19 -19
- package/fesm2022/eui-ecl-core.mjs +25 -25
- package/fesm2022/eui-ecl-shared.mjs +3 -3
- package/fesm2022/eui-ecl.mjs +4 -4
- package/package.json +14 -15
|
@@ -24,10 +24,10 @@ class EclMegaMenuContainerDirective extends ECLBaseDirective {
|
|
|
24
24
|
super(...arguments);
|
|
25
25
|
this.hasClass = true;
|
|
26
26
|
}
|
|
27
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
28
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
27
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuContainerDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
28
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuContainerDirective, isStandalone: true, selector: "div[eclMegaMenuContainer]", host: { properties: { "class.ecl": "this.hasClass" } }, usesInheritance: true, ngImport: i0 }); }
|
|
29
29
|
}
|
|
30
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuContainerDirective, decorators: [{
|
|
31
31
|
type: Directive,
|
|
32
32
|
args: [{
|
|
33
33
|
// eslint-disable-next-line @angular-eslint/component-selector
|
|
@@ -46,10 +46,10 @@ class EclMegaMenuFeaturedListDirective extends ECLBaseDirective {
|
|
|
46
46
|
super(...arguments);
|
|
47
47
|
this.cmpClass = true;
|
|
48
48
|
}
|
|
49
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
50
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
49
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedListDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
50
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuFeaturedListDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedList]", host: { properties: { "class.ecl-mega-menu__featured-list": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
|
|
51
51
|
}
|
|
52
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
52
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedListDirective, decorators: [{
|
|
53
53
|
type: Directive,
|
|
54
54
|
args: [{
|
|
55
55
|
selector: '[eclMegaMenuFeaturedList]',
|
|
@@ -71,10 +71,10 @@ class EclMegaMenuFeaturedListItemDirective extends ECLBaseDirective {
|
|
|
71
71
|
getEclMegaMenuFeaturedItemHeight() {
|
|
72
72
|
return this.el.nativeElement.scrollHeight;
|
|
73
73
|
}
|
|
74
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
75
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
74
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedListItemDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
75
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuFeaturedListItemDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedListItem]", host: { properties: { "class.ecl-mega-menu__featured-list__item": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
|
|
76
76
|
}
|
|
77
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
77
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedListItemDirective, decorators: [{
|
|
78
78
|
type: Directive,
|
|
79
79
|
args: [{
|
|
80
80
|
selector: '[eclMegaMenuFeaturedListItem]',
|
|
@@ -91,10 +91,10 @@ class EclMegaMenuFeaturedPictureDirective extends ECLBaseDirective {
|
|
|
91
91
|
get cssClasses() {
|
|
92
92
|
return [super.getCssClasses('ecl-picture ecl-mega-menu__featured-picture')].join(' ').trim();
|
|
93
93
|
}
|
|
94
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
95
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
94
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedPictureDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
95
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuFeaturedPictureDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedPicture]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
|
|
96
96
|
}
|
|
97
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
97
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedPictureDirective, decorators: [{
|
|
98
98
|
type: Directive,
|
|
99
99
|
args: [{
|
|
100
100
|
selector: '[eclMegaMenuFeaturedPicture]',
|
|
@@ -111,10 +111,10 @@ class EclMegaMenuFeaturedImageDirective extends ECLBaseDirective {
|
|
|
111
111
|
super(...arguments);
|
|
112
112
|
this.cmpClass = true;
|
|
113
113
|
}
|
|
114
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
115
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
114
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedImageDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
115
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuFeaturedImageDirective, isStandalone: true, selector: "[eclMegaMenuFeaturedImage]", host: { properties: { "class.ecl-mega-menu__featured-image": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
|
|
116
116
|
}
|
|
117
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
117
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedImageDirective, decorators: [{
|
|
118
118
|
type: Directive,
|
|
119
119
|
args: [{
|
|
120
120
|
selector: '[eclMegaMenuFeaturedImage]',
|
|
@@ -150,10 +150,10 @@ class EclMegaMenuDataService {
|
|
|
150
150
|
eclSubItemEscapeEvent(value) {
|
|
151
151
|
this.eclSubItemEscape.next(value);
|
|
152
152
|
}
|
|
153
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
154
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
153
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuDataService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
154
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuDataService, providedIn: 'root' }); }
|
|
155
155
|
}
|
|
156
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuDataService, decorators: [{
|
|
157
157
|
type: Injectable,
|
|
158
158
|
args: [{ providedIn: 'root' }]
|
|
159
159
|
}], ctorParameters: () => [] });
|
|
@@ -172,10 +172,10 @@ class EclMegaMenuService {
|
|
|
172
172
|
});
|
|
173
173
|
}
|
|
174
174
|
}
|
|
175
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
176
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
175
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
176
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuService, providedIn: 'root' }); }
|
|
177
177
|
}
|
|
178
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
178
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuService, decorators: [{
|
|
179
179
|
type: Injectable,
|
|
180
180
|
args: [{ providedIn: 'root' }]
|
|
181
181
|
}], ctorParameters: () => [] });
|
|
@@ -199,10 +199,10 @@ class EclMegaMenuFeaturedComponent extends ECLBaseDirective {
|
|
|
199
199
|
this.listItems.forEach(it => result += it.getEclMegaMenuFeaturedItemHeight());
|
|
200
200
|
return result;
|
|
201
201
|
}
|
|
202
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
203
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.
|
|
202
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
203
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.5", type: EclMegaMenuFeaturedComponent, isStandalone: true, selector: "div[eclMegaMenuFeatured]", inputs: { title: "title", titleId: "titleId" }, host: { properties: { "class.ecl-mega-menu__featured": "this.cmpClass", "style.height.px": "this.eclMegaMenuFeaturedStyleHeight" } }, queries: [{ propertyName: "listItems", predicate: i0.forwardRef(() => EclMegaMenuFeaturedListItemDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-mega-menu__featured-scrollable\">\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>" }); }
|
|
204
204
|
}
|
|
205
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
205
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuFeaturedComponent, decorators: [{
|
|
206
206
|
type: Component,
|
|
207
207
|
args: [{ selector: 'div[eclMegaMenuFeatured]', template: "<div class=\"ecl-mega-menu__featured-scrollable\">\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>" }]
|
|
208
208
|
}], propDecorators: { cmpClass: [{
|
|
@@ -361,10 +361,10 @@ class EclMegaMenuSubitemComponent extends ECLBaseDirective {
|
|
|
361
361
|
this.isMobileBreakpoint = result.matches;
|
|
362
362
|
});
|
|
363
363
|
}
|
|
364
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
365
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.
|
|
364
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuSubitemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
365
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.5", type: EclMegaMenuSubitemComponent, isStandalone: true, selector: "li[eclMegaMenuSubitem]", inputs: { buttonId: "buttonId", label: "label", isExternal: ["isExternal", "isExternal", booleanAttribute], externalIconTitle: "externalIconTitle", routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href", target: "target", isSeeAll: ["isSeeAll", "isSeeAll", booleanAttribute], linkExtraAttributes: "linkExtraAttributes" }, outputs: { megaMenuSubItemClicked: "megaMenuSubItemClicked", megaMenuSubItemKeydown: "megaMenuSubItemKeydown" }, host: { properties: { "attr.aria-expanded": "this.isExpanded", "class": "this.cssClasses", "style.display": "this.display" } }, queries: [{ propertyName: "submenu", first: true, predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true }, { propertyName: "eclMegaMenuFeatured", first: true, predicate: i0.forwardRef(() => EclMegaMenuFeaturedComponent), descendants: true }], viewQueries: [{ propertyName: "megaMenuLevel2", first: true, predicate: ["megaMenuLevel2"], descendants: true }, { propertyName: "subMenuItemLink", first: true, predicate: EclLinkDirective, descendants: true }, { propertyName: "subMenuItemBtn", first: true, predicate: ["subMenuItemBtn"], descendants: 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\" 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", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "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: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "directive", type: i3.EclLinkLabelDirective, selector: "[eclLinkLabel]" }] }); }
|
|
366
366
|
}
|
|
367
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
367
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuSubitemComponent, decorators: [{
|
|
368
368
|
type: Component,
|
|
369
369
|
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\" 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>" }]
|
|
370
370
|
}], ctorParameters: () => [], propDecorators: { isExpanded: [{
|
|
@@ -429,10 +429,10 @@ class EclMegaMenuListDirective extends ECLBaseDirective {
|
|
|
429
429
|
super(...arguments);
|
|
430
430
|
this.cmpClass = true;
|
|
431
431
|
}
|
|
432
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
433
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
432
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuListDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
433
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuListDirective, isStandalone: true, selector: "ul[eclMegaMenuList]", host: { properties: { "class.ecl-mega-menu__list": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
|
|
434
434
|
}
|
|
435
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
435
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuListDirective, decorators: [{
|
|
436
436
|
type: Directive,
|
|
437
437
|
args: [{
|
|
438
438
|
selector: 'ul[eclMegaMenuList]',
|
|
@@ -449,10 +449,10 @@ class EclMegaMenuSpacerDirective extends ECLBaseDirective {
|
|
|
449
449
|
super(...arguments);
|
|
450
450
|
this.cmpClass = true;
|
|
451
451
|
}
|
|
452
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
453
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
452
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuSpacerDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
453
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuSpacerDirective, isStandalone: true, selector: "ul[eclMegaMenuSpacer]", host: { properties: { "class.ecl-mega-menu__spacer": "this.cmpClass" } }, usesInheritance: true, ngImport: i0 }); }
|
|
454
454
|
}
|
|
455
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
455
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuSpacerDirective, decorators: [{
|
|
456
456
|
type: Directive,
|
|
457
457
|
args: [{
|
|
458
458
|
selector: 'ul[eclMegaMenuSpacer]',
|
|
@@ -574,10 +574,10 @@ class EclMegaMenuSublistDirective extends ECLBaseDirective {
|
|
|
574
574
|
setTimeout(() => this.resetStyles());
|
|
575
575
|
});
|
|
576
576
|
}
|
|
577
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
578
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
577
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuSublistDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
578
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuSublistDirective, isStandalone: true, selector: "ul[eclMegaMenuSublist]", host: { properties: { "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) }], usesInheritance: true, ngImport: i0 }); }
|
|
579
579
|
}
|
|
580
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
580
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuSublistDirective, decorators: [{
|
|
581
581
|
type: Directive,
|
|
582
582
|
args: [{
|
|
583
583
|
selector: 'ul[eclMegaMenuSublist]',
|
|
@@ -646,10 +646,10 @@ class EclMegaMenuInfoComponent extends ECLBaseDirective {
|
|
|
646
646
|
const bottomY = this.el.nativeElement.getBoundingClientRect().bottom;
|
|
647
647
|
this.eclMegaMenuDataService.updateEclMegaMenuInfoSize(bottomY);
|
|
648
648
|
}
|
|
649
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
650
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
649
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
650
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0-next.5", type: EclMegaMenuInfoComponent, isStandalone: true, selector: "div[eclMegaMenuInfo]", inputs: { title: "title" }, host: { properties: { "class": "this.cssClasses", "style.height.px": "this.eclMegaMenuInfoStyleHeight", "style.opacity": "this.eclMegaMenuInfoStyleOpacity" } }, queries: [{ propertyName: "linkItem", first: true, predicate: i0.forwardRef(() => EclLinkDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-mega-menu__info-title\">{{ 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>" }); }
|
|
651
651
|
}
|
|
652
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
652
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuInfoComponent, decorators: [{
|
|
653
653
|
type: Component,
|
|
654
654
|
args: [{ selector: 'div[eclMegaMenuInfo]', template: "<span class=\"ecl-mega-menu__info-title\">{{ 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>" }]
|
|
655
655
|
}], propDecorators: { cssClasses: [{
|
|
@@ -931,10 +931,10 @@ class EclMegaMenuItemComponent extends ECLBaseDirective {
|
|
|
931
931
|
this.resetWrapperStyle();
|
|
932
932
|
});
|
|
933
933
|
}
|
|
934
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
935
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.
|
|
934
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
935
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.5", type: EclMegaMenuItemComponent, isStandalone: true, selector: "li[eclMegaMenuItem]", inputs: { label: "label", routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href", target: "target", linkExtraAttributes: "linkExtraAttributes" }, outputs: { megaMenuItemClicked: "megaMenuItemClicked", megaMenuItemKeydown: "megaMenuItemKeydown" }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class": "this.cssClasses", "attr.aria-expanded": "this.isExpanded", "attr.aria-haspopup": "this.hasPopup" } }, queries: [{ propertyName: "eclMegaMenuInfo", first: true, predicate: i0.forwardRef(() => EclMegaMenuInfoComponent), descendants: true }, { propertyName: "eclMegaMenuSublist", first: true, predicate: i0.forwardRef(() => EclMegaMenuSublistDirective), descendants: true }, { propertyName: "eclMegaMenuContainer", first: true, predicate: i0.forwardRef(() => EclMegaMenuContainerDirective), descendants: true }], viewQueries: [{ propertyName: "eclMegaMenuMega", first: true, predicate: ["eclMegaMenuMega"], descendants: true }, { propertyName: "mainPanel", first: true, predicate: ["mainPanel"], descendants: true }, { propertyName: "menuLink", first: true, predicate: EclLinkDirective, descendants: true }, { propertyName: "menuBtn", first: true, predicate: ["menuBtn"], descendants: 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\" [style.height.px]=\"megaMenuMegaStyleHeight\" [style.opacity]=\"megaMenuMegaStyleOpacity\">\n <ng-content select=\"[eclMegaMenuSublist]\"></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", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "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: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "directive", type: i3.EclLinkLabelDirective, selector: "[eclLinkLabel]" }] }); }
|
|
936
936
|
}
|
|
937
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
937
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuItemComponent, decorators: [{
|
|
938
938
|
type: Component,
|
|
939
939
|
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\" [style.height.px]=\"megaMenuMegaStyleHeight\" [style.opacity]=\"megaMenuMegaStyleOpacity\">\n <ng-content select=\"[eclMegaMenuSublist]\"></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}" }]
|
|
940
940
|
}], ctorParameters: () => [], propDecorators: { cssClasses: [{
|
|
@@ -1307,10 +1307,10 @@ class EclMegaMenuComponent extends ECLBaseDirective {
|
|
|
1307
1307
|
enableScroll() {
|
|
1308
1308
|
this.renderer.removeClass(document.body, 'ecl-mega-menu-prevent-scroll');
|
|
1309
1309
|
}
|
|
1310
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1311
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.
|
|
1310
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1311
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.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 }], 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\" aria-expanded=\"isMobileExpanded\" (click)=\"onMegaMenuMobileOpen()\">\n <ecl-icon icon=\"hamburger\" size=\"m\"></ecl-icon>\n <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n @if (isOpenMobile) {\n <span class=\"ecl-button__label\">{{ 'ecl.common.CLOSE' | translate }}</span>\n } @else {\n <span class=\"ecl-button__label\">{{ 'ecl.menu.MENU' | translate }}</span>\n }\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=\"ghost\" 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: "ngmodule", type: TranslateModule }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "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: i4.TranslatePipe, name: "translate" }] }); }
|
|
1312
1312
|
}
|
|
1313
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1313
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuComponent, decorators: [{
|
|
1314
1314
|
type: Component,
|
|
1315
1315
|
args: [{ selector: 'nav[eclMegaMenu]', imports: [TranslateModule, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON], hostDirectives: [
|
|
1316
1316
|
{
|
|
@@ -1362,8 +1362,8 @@ const COMPONENTS = [
|
|
|
1362
1362
|
* @deprecated Use {@link EUI_ECL_MEGA_MENU} instead.
|
|
1363
1363
|
*/
|
|
1364
1364
|
class EclMegaMenuModule {
|
|
1365
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1366
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
1365
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1366
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuModule, imports: [EclMegaMenuComponent,
|
|
1367
1367
|
EclMegaMenuItemComponent,
|
|
1368
1368
|
EclMegaMenuSubitemComponent,
|
|
1369
1369
|
EclMegaMenuInfoComponent,
|
|
@@ -1388,11 +1388,11 @@ class EclMegaMenuModule {
|
|
|
1388
1388
|
EclMegaMenuSublistDirective,
|
|
1389
1389
|
EclMegaMenuContainerDirective,
|
|
1390
1390
|
EclMegaMenuSpacerDirective] }); }
|
|
1391
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1391
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuModule, imports: [EclMegaMenuComponent,
|
|
1392
1392
|
EclMegaMenuItemComponent,
|
|
1393
1393
|
EclMegaMenuSubitemComponent] }); }
|
|
1394
1394
|
}
|
|
1395
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1395
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMegaMenuModule, decorators: [{
|
|
1396
1396
|
type: NgModule,
|
|
1397
1397
|
args: [{
|
|
1398
1398
|
imports: [...COMPONENTS],
|
|
@@ -156,10 +156,10 @@ class EclMenuMegaItemComponent extends ECLBaseDirective {
|
|
|
156
156
|
});
|
|
157
157
|
}
|
|
158
158
|
}
|
|
159
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
160
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.
|
|
159
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuMegaItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
160
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.5", type: EclMenuMegaItemComponent, isStandalone: true, selector: "ecl-menu-mega-item", inputs: { id: "id", label: "label", routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href", target: "target", isCurrent: ["isCurrent", "isCurrent", booleanAttribute], isSeeAll: ["isSeeAll", "isSeeAll", booleanAttribute], linkExtraAttributes: "linkExtraAttributes" }, 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) }, { propertyName: "links", predicate: i0.forwardRef(() => EclLinkDirective) }], viewQueries: [{ propertyName: "megaMenuLink", first: true, predicate: ["megaMenuLink"], descendants: 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", "routerLink"] }] }); }
|
|
161
161
|
}
|
|
162
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
162
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuMegaItemComponent, decorators: [{
|
|
163
163
|
type: Component,
|
|
164
164
|
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"] }]
|
|
165
165
|
}], propDecorators: { id: [{
|
|
@@ -347,10 +347,10 @@ class EclMenuMegaComponent extends ECLBaseDirective {
|
|
|
347
347
|
getMegaMenuItemsArray() {
|
|
348
348
|
return this.eclMenuMegaItems.toArray();
|
|
349
349
|
}
|
|
350
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
351
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
350
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuMegaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
351
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0-next.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" }); }
|
|
352
352
|
}
|
|
353
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
353
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuMegaComponent, decorators: [{
|
|
354
354
|
type: Component,
|
|
355
355
|
args: [{ selector: 'ecl-menu-mega', template: "<ul class=\"ecl-menu__sublist\">\n <ng-content></ng-content>\n</ul>\n" }]
|
|
356
356
|
}], ctorParameters: () => [], propDecorators: { isRtlDisplay: [{
|
|
@@ -737,10 +737,10 @@ class EclMenuItemComponent extends ECLBaseDirective {
|
|
|
737
737
|
this.isMobileBreakpoint = result.matches;
|
|
738
738
|
});
|
|
739
739
|
}
|
|
740
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
741
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.
|
|
740
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
741
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.5", type: EclMenuItemComponent, isStandalone: true, selector: "ecl-menu-item", inputs: { id: "id", label: "label", toggleAriaLabel: "toggleAriaLabel", routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href", target: "target", isCurrent: "isCurrent", linkExtraAttributes: "linkExtraAttributes" }, outputs: { menuItemSelect: "menuItemSelect", menuItemCaret: "menuItemCaret", menuItemHover: "menuItemHover", menuItemHoverOut: "menuItemHoverOut", menuMegaItemSelect: "menuMegaItemSelect", menuItemFocus: "menuItemFocus", menuItemKeydown: "menuItemKeydown", menuMegaLastItemTab: "menuMegaLastItemTab" }, host: { listeners: { "mouseenter": "onItemMouseEnter($event)", "mouseleave": "onItemMouseLeave($event)" }, properties: { "attr.role": "this.role", "class": "this.cssClasses", "class.ecl-menu__item--has-children": "this.hasEclChildrenDataAttribute", "attr.aria-haspopup": "this.hasEclChildrenDataAttribute", "attr.aria-expanded": "this.isAriaExpanded" } }, queries: [{ propertyName: "submenu", first: true, predicate: i0.forwardRef(() => EclMenuMegaComponent), descendants: true }], viewQueries: [{ propertyName: "menuLink", first: true, predicate: ["menuLink"], descendants: true }, { propertyName: "menuButton", first: true, predicate: EclButtonComponent, descendants: 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 isIconOnly\n variant=\"ghost\"\n class=\"ecl-menu__button-caret\"\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=\"xs\" transform=\"rotate-180\" class=\"ecl-button__icon\"></ecl-icon>\n </button>\n } @else {\n <button\n eclButton\n isIconOnly\n variant=\"ghost\"\n class=\"ecl-menu__button-caret\"\n type=\"button\"\n [attr.aria-label]=\"toggleAriaLabel || 'Access item children'\"\n [attr.aria-expanded]=\"isAriaExpanded\"\n (keydown)=\"onButtonKeydown($event)\">\n <ecl-icon icon=\"corner-arrow\" size=\"xs\" 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", "routerLink"] }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "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: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
742
742
|
}
|
|
743
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
743
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuItemComponent, decorators: [{
|
|
744
744
|
type: Component,
|
|
745
745
|
args: [{ selector: 'ecl-menu-item', imports: [NgTemplateOutlet, RouterLink, RouterLinkWithHref, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON, ...EUI_ECL_LINK], encapsulation: ViewEncapsulation.None, 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 isIconOnly\n variant=\"ghost\"\n class=\"ecl-menu__button-caret\"\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=\"xs\" transform=\"rotate-180\" class=\"ecl-button__icon\"></ecl-icon>\n </button>\n } @else {\n <button\n eclButton\n isIconOnly\n variant=\"ghost\"\n class=\"ecl-menu__button-caret\"\n type=\"button\"\n [attr.aria-label]=\"toggleAriaLabel || 'Access item children'\"\n [attr.aria-expanded]=\"isAriaExpanded\"\n (keydown)=\"onButtonKeydown($event)\">\n <ecl-icon icon=\"corner-arrow\" size=\"xs\" 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" }]
|
|
746
746
|
}], ctorParameters: () => [], propDecorators: { id: [{
|
|
@@ -1450,10 +1450,10 @@ class EclMenuComponent extends ECLBaseDirective {
|
|
|
1450
1450
|
}
|
|
1451
1451
|
});
|
|
1452
1452
|
}
|
|
1453
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1454
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.
|
|
1453
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1454
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-next.5", type: EclMenuComponent, isStandalone: true, selector: "ecl-menu", inputs: { maxLines: ["maxLines", "maxLines", numberAttribute] }, outputs: { menuItemSelect: "menuItemSelect", openHamburgerMenu: "openHamburgerMenu" }, host: { listeners: { "keydown": "keyEvent($event)" }, properties: { "class": "this.cssClasses", "attr.data-expanded": "this.expandedAttr", "attr.role": "this.role", "class.ecl-menu--forced-mobile": "this.isTablet", "class.ecl-menu--forced-close": "this.isMenuHidden" } }, queries: [{ propertyName: "eclRootMenuItems", predicate: EclMenuItemComponent }], viewQueries: [{ propertyName: "innerSection", first: true, predicate: ["innerSection"], descendants: true }, { propertyName: "itemsList", first: true, predicate: ["itemsList"], descendants: true }, { propertyName: "btnPrevious", first: true, predicate: ["btnPrevious"], descendants: true }, { propertyName: "btnNext", first: true, predicate: ["btnNext"], descendants: true }, { propertyName: "openCloseButton", first: true, predicate: ["openCloseButton"], descendants: 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\" 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=\"ghost\"\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=\"ghost\" 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=\"ghost\"\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=\"ghost\"\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: "ngmodule", type: TranslateModule }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "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: i3$1.TranslatePipe, name: "translate" }] }); }
|
|
1455
1455
|
}
|
|
1456
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1456
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuComponent, decorators: [{
|
|
1457
1457
|
type: Component,
|
|
1458
1458
|
args: [{ selector: 'ecl-menu', imports: [TranslateModule, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON], 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\" 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=\"ghost\"\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=\"ghost\" 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=\"ghost\"\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=\"ghost\"\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"] }]
|
|
1459
1459
|
}], ctorParameters: () => [], propDecorators: { maxLines: [{
|
|
@@ -1508,11 +1508,11 @@ const COMPONENTS = [EclMenuComponent, EclMenuItemComponent, EclMenuMegaComponent
|
|
|
1508
1508
|
* @deprecated Use {@link EUI_ECL_MENU} instead.
|
|
1509
1509
|
*/
|
|
1510
1510
|
class EclMenuModule {
|
|
1511
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1512
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0-next.
|
|
1513
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1511
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1512
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuModule, imports: [EclMenuComponent, EclMenuItemComponent, EclMenuMegaComponent, EclMenuMegaItemComponent], exports: [EclMenuComponent, EclMenuItemComponent, EclMenuMegaComponent, EclMenuMegaItemComponent] }); }
|
|
1513
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuModule, imports: [EclMenuComponent, EclMenuItemComponent] }); }
|
|
1514
1514
|
}
|
|
1515
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.
|
|
1515
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-next.5", ngImport: i0, type: EclMenuModule, decorators: [{
|
|
1516
1516
|
type: NgModule,
|
|
1517
1517
|
args: [{
|
|
1518
1518
|
imports: [...COMPONENTS],
|