@eui/ecl 21.4.3 → 21.4.4-snapshot-1789466748090
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 +59 -0
- package/docs/js/search/search_index.js +2 -2
- package/docs/json/documentation.json +2 -2
- package/docs/properties.html +1 -1
- package/fesm2022/eui-ecl-components-ecl-menu.mjs +0 -3
- package/fesm2022/eui-ecl-components-ecl-menu.mjs.map +1 -1
- package/package.json +2 -2
- package/types/eui-ecl-components-ecl-menu.d.ts.map +1 -1
|
@@ -52598,7 +52598,7 @@
|
|
|
52598
52598
|
},
|
|
52599
52599
|
{
|
|
52600
52600
|
"name": "EclMenuMegaItemComponent",
|
|
52601
|
-
"id": "component-EclMenuMegaItemComponent-
|
|
52601
|
+
"id": "component-EclMenuMegaItemComponent-4b21ad72a8d4de78affe5a44dae77a58a1ecc8e4b80be105b87b207825709329010faf0989fa72d4f3fb9cf7e0410dcfe8ac7066ac79b069ab7ccbd2c956be9c",
|
|
52602
52602
|
"file": "packages/ecl/components/ecl-menu/ecl-menu-mega/ecl-menu-mega-item.component.ts",
|
|
52603
52603
|
"encapsulation": [],
|
|
52604
52604
|
"entryComponents": [],
|
|
@@ -53134,7 +53134,7 @@
|
|
|
53134
53134
|
"description": "<p>This component represents a sub-menu item, that is on the second level of the ecl-menu.\nAdds some custom styling and functionality.</p>\n",
|
|
53135
53135
|
"rawdescription": "\n\nThis component represents a sub-menu item, that is on the second level of the ecl-menu.\nAdds some custom styling and functionality.\n",
|
|
53136
53136
|
"type": "component",
|
|
53137
|
-
"sourceCode": "import {\n AfterViewInit,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n HostBinding,\n HostListener,\n Input,\n Output,\n QueryList,\n Renderer2,\n ViewChild,\n booleanAttribute,\n forwardRef,\n inject,\n} from '@angular/core';\nimport { Params, QueryParamsHandling, RouterLink } from '@angular/router';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { KeyCode } from '@eui/ecl/core';\nimport { EclLinkDirective } from '@eui/ecl/components/ecl-link';\nimport { EclIconComponent } from '@eui/ecl/components/ecl-icon';\nimport { EclMenuItem } from '../models/ecl-menu-item.model';\nimport { EclMenuItemKeydownEvent, EclMenuItemSelectEvent } from '../events/ecl-menu-item.event';\n\n/**\n * This component represents a sub-menu item, that is on the second level of the ecl-menu.\n * Adds some custom styling and functionality.\n */\n@Component({\n selector: 'ecl-menu-mega-item',\n templateUrl: './ecl-menu-mega-item.component.html',\n imports: [NgTemplateOutlet, RouterLink],\n styles: [\n `\n :host {\n display: list-item;\n }\n `,\n ],\n})\nexport class EclMenuMegaItemComponent extends ECLBaseDirective implements EclMenuItem, AfterViewInit {\n\n @Input() id: string;\n @Input() label: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Input() routerLink: string | any[] = null;\n @Input() queryParams: Params | null = null;\n @Input() queryParamsHandling: QueryParamsHandling = null;\n @Input() href = '';\n @Input() target = '';\n @HostBinding('class.ecl-menu__subitem') cmpClass = true;\n /**\n * The default role of the DOM element is 'listitem', should not be changed.\n */\n @HostBinding('attr.role') role = 'listitem';\n @Input({ transform: booleanAttribute }) @HostBinding('class.ecl-menu__subitem--current') isCurrent = false;\n /**\n * An additional item, that represents a link.\n */\n @Input({ transform: booleanAttribute }) @HostBinding('class.ecl-menu__see-all') isSeeAll = false;\n @Input() linkExtraAttributes: { [key: string]: string };\n\n /**\n * If menu item includes any icon, added by the user (for example for 'external' link).\n */\n @ContentChildren(forwardRef(() => EclIconComponent)) iconComponents: QueryList<EclIconComponent>;\n /**\n * If menu item includes any links, added by the user.\n */\n @ContentChildren(forwardRef(() => EclLinkDirective)) links: QueryList<EclLinkDirective>;\n /**\n * The actual link of the menu item.\n */\n @ViewChild('megaMenuLink') megaMenuLink: ElementRef\n\n @Output() menuItemSelect = new EventEmitter<EclMenuItemSelectEvent>();\n @Output() menuItemKeydown = new EventEmitter<EclMenuItemKeydownEvent>();\n\n hasChildren = false;\n isExpanded = true;\n\n children: Array<EclMenuItem> = [];\n private renderer = inject(Renderer2);\n\n ngAfterViewInit(): void {\n this.manageContentChildren();\n this.setExtraAttributesForLink(this.megaMenuLink?.nativeElement, this.linkExtraAttributes);\n }\n\n /**\n *\n * @param evt This event is emited, when the menu item is clicked.\n */\n onItemClick(evt: Event): void {\n this.menuItemSelect.next(new EclMenuItemSelectEvent(this, evt as MouseEvent));\n\n if (!this.href) {\n evt.preventDefault();\n }\n }\n\n @HostListener('click', ['$event'])\n onHostClick(evt: MouseEvent): void {\n evt.stopPropagation();\n }\n\n /**\n * When the item is the current active item, the 'aria-current' attribute is set to 'page'.\n */\n get ariaCurrent(): string | null {\n return this.isCurrent ? 'page' : null;\n }\n\n /**\n * Focus should be set on the underlying <a> element.\n */\n onFocus(): void {\n this.megaMenuLink.nativeElement.focus();\n }\n\n onKeydown(evt: Event): void {\n
|
|
53137
|
+
"sourceCode": "import {\n AfterViewInit,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n HostBinding,\n HostListener,\n Input,\n Output,\n QueryList,\n Renderer2,\n ViewChild,\n booleanAttribute,\n forwardRef,\n inject,\n} from '@angular/core';\nimport { Params, QueryParamsHandling, RouterLink } from '@angular/router';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { KeyCode } from '@eui/ecl/core';\nimport { EclLinkDirective } from '@eui/ecl/components/ecl-link';\nimport { EclIconComponent } from '@eui/ecl/components/ecl-icon';\nimport { EclMenuItem } from '../models/ecl-menu-item.model';\nimport { EclMenuItemKeydownEvent, EclMenuItemSelectEvent } from '../events/ecl-menu-item.event';\n\n/**\n * This component represents a sub-menu item, that is on the second level of the ecl-menu.\n * Adds some custom styling and functionality.\n */\n@Component({\n selector: 'ecl-menu-mega-item',\n templateUrl: './ecl-menu-mega-item.component.html',\n imports: [NgTemplateOutlet, RouterLink],\n styles: [\n `\n :host {\n display: list-item;\n }\n `,\n ],\n})\nexport class EclMenuMegaItemComponent extends ECLBaseDirective implements EclMenuItem, AfterViewInit {\n\n @Input() id: string;\n @Input() label: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Input() routerLink: string | any[] = null;\n @Input() queryParams: Params | null = null;\n @Input() queryParamsHandling: QueryParamsHandling = null;\n @Input() href = '';\n @Input() target = '';\n @HostBinding('class.ecl-menu__subitem') cmpClass = true;\n /**\n * The default role of the DOM element is 'listitem', should not be changed.\n */\n @HostBinding('attr.role') role = 'listitem';\n @Input({ transform: booleanAttribute }) @HostBinding('class.ecl-menu__subitem--current') isCurrent = false;\n /**\n * An additional item, that represents a link.\n */\n @Input({ transform: booleanAttribute }) @HostBinding('class.ecl-menu__see-all') isSeeAll = false;\n @Input() linkExtraAttributes: { [key: string]: string };\n\n /**\n * If menu item includes any icon, added by the user (for example for 'external' link).\n */\n @ContentChildren(forwardRef(() => EclIconComponent)) iconComponents: QueryList<EclIconComponent>;\n /**\n * If menu item includes any links, added by the user.\n */\n @ContentChildren(forwardRef(() => EclLinkDirective)) links: QueryList<EclLinkDirective>;\n /**\n * The actual link of the menu item.\n */\n @ViewChild('megaMenuLink') megaMenuLink: ElementRef\n\n @Output() menuItemSelect = new EventEmitter<EclMenuItemSelectEvent>();\n @Output() menuItemKeydown = new EventEmitter<EclMenuItemKeydownEvent>();\n\n hasChildren = false;\n isExpanded = true;\n\n children: Array<EclMenuItem> = [];\n private renderer = inject(Renderer2);\n\n ngAfterViewInit(): void {\n this.manageContentChildren();\n this.setExtraAttributesForLink(this.megaMenuLink?.nativeElement, this.linkExtraAttributes);\n }\n\n /**\n *\n * @param evt This event is emited, when the menu item is clicked.\n */\n onItemClick(evt: Event): void {\n this.menuItemSelect.next(new EclMenuItemSelectEvent(this, evt as MouseEvent));\n\n if (!this.href) {\n evt.preventDefault();\n }\n }\n\n @HostListener('click', ['$event'])\n onHostClick(evt: MouseEvent): void {\n evt.stopPropagation();\n }\n\n /**\n * When the item is the current active item, the 'aria-current' attribute is set to 'page'.\n */\n get ariaCurrent(): string | null {\n return this.isCurrent ? 'page' : null;\n }\n\n /**\n * Focus should be set on the underlying <a> element.\n */\n onFocus(): void {\n this.megaMenuLink.nativeElement.focus();\n }\n\n onKeydown(evt: Event): void {\n this.menuItemKeydown.next(new EclMenuItemKeydownEvent(this, evt as KeyboardEvent));\n }\n\n /**\n * Adds specific classes to content children (icons or links).\n */\n private manageContentChildren(): void {\n if (this.iconComponents) {\n setTimeout(() => {\n this.iconComponents.forEach((icn) => {\n icn.baseDirective.class = 'ecl-menu__sublink-icon';\n });\n });\n }\n\n if (this.links) {\n setTimeout(() => {\n this.links.forEach((icn) => {\n icn.class = icn.class ? icn.class + ' ecl-menu__sublink' : 'ecl-menu__sublink';\n });\n });\n }\n }\n\n private setExtraAttributesForLink(link: HTMLElement, linkExtraAttributes: { [key: string]: string }): void {\n if (linkExtraAttributes) {\n Object.keys(linkExtraAttributes).forEach((key) =>{\n if (key !== 'href' && key !== 'routerLink') {\n this.renderer.setAttribute(link, key, linkExtraAttributes[key]);\n }\n });\n }\n }\n}\n",
|
|
53138
53138
|
"assetsDirs": [],
|
|
53139
53139
|
"styleUrlsData": "",
|
|
53140
53140
|
"stylesData": "\n :host {\n display: list-item;\n }\n \n",
|
package/docs/properties.html
CHANGED
|
@@ -123,9 +123,6 @@ class EclMenuMegaItemComponent extends ECLBaseDirective {
|
|
|
123
123
|
this.megaMenuLink.nativeElement.focus();
|
|
124
124
|
}
|
|
125
125
|
onKeydown(evt) {
|
|
126
|
-
if (evt.key === KeyCode.ENTER) {
|
|
127
|
-
this.onItemClick(evt);
|
|
128
|
-
}
|
|
129
126
|
this.menuItemKeydown.next(new EclMenuItemKeydownEvent(this, evt));
|
|
130
127
|
}
|
|
131
128
|
/**
|