@eui/components 19.0.2-snapshot-1735581456359 → 19.0.2-snapshot-1736418794978
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/directives/eui-maxlength.directive.d.ts.map +1 -1
- package/directives/eui-scroll-handler.directive.d.ts.map +1 -1
- package/directives/eui-smooth-scroll.directive.d.ts.map +1 -1
- package/directives/eui-tooltip/eui-tooltip.directive.d.ts.map +1 -1
- package/docs/dependencies.html +19 -19
- package/docs/js/search/search_index.js +2 -2
- package/eui-autocomplete/eui-autocomplete.component.d.ts.map +1 -1
- package/eui-chip-list/eui-chip-list.component.d.ts.map +1 -1
- package/eui-input-number/eui-input-number.component.d.ts.map +1 -1
- package/eui-progress-bar/eui-progress-bar.component.d.ts.map +1 -1
- package/eui-table/sortable-col/eui-table-sortable-col.component.d.ts.map +1 -1
- package/eui-table-v2/eui-table-v2.component.d.ts.map +1 -1
- package/eui-textarea/auto-resize.directive.d.ts.map +1 -1
- package/fesm2022/eui-components-directives.mjs +70 -70
- package/fesm2022/eui-components-eui-accordion.mjs +13 -13
- package/fesm2022/eui-components-eui-alert.mjs +10 -10
- package/fesm2022/eui-components-eui-autocomplete.mjs +14 -14
- package/fesm2022/eui-components-eui-autocomplete.mjs.map +1 -1
- package/fesm2022/eui-components-eui-avatar.mjs +23 -23
- package/fesm2022/eui-components-eui-avatar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-badge.mjs +8 -8
- package/fesm2022/eui-components-eui-badge.mjs.map +1 -1
- package/fesm2022/eui-components-eui-block-content.mjs +8 -8
- package/fesm2022/eui-components-eui-block-content.mjs.map +1 -1
- package/fesm2022/eui-components-eui-block-document.mjs +8 -8
- package/fesm2022/eui-components-eui-block-document.mjs.map +1 -1
- package/fesm2022/eui-components-eui-breadcrumb.mjs +13 -13
- package/fesm2022/eui-components-eui-button-group.mjs +7 -7
- package/fesm2022/eui-components-eui-button-v2.mjs +7 -7
- package/fesm2022/eui-components-eui-button.mjs +8 -8
- package/fesm2022/eui-components-eui-button.mjs.map +1 -1
- package/fesm2022/eui-components-eui-card.mjs +50 -50
- package/fesm2022/eui-components-eui-card.mjs.map +1 -1
- package/fesm2022/eui-components-eui-chip-group.mjs +7 -7
- package/fesm2022/eui-components-eui-chip-list.mjs +13 -13
- package/fesm2022/eui-components-eui-chip.mjs +8 -8
- package/fesm2022/eui-components-eui-chip.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dashboard-button.mjs +13 -13
- package/fesm2022/eui-components-eui-dashboard-card.mjs +13 -13
- package/fesm2022/eui-components-eui-date-range-selector.mjs +10 -10
- package/fesm2022/eui-components-eui-datepicker.mjs +19 -19
- package/fesm2022/eui-components-eui-dialog.mjs +21 -21
- package/fesm2022/eui-components-eui-dialog.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dimmer.mjs +7 -7
- package/fesm2022/eui-components-eui-disable-content.mjs +7 -7
- package/fesm2022/eui-components-eui-discussion-thread.mjs +10 -10
- package/fesm2022/eui-components-eui-dropdown.mjs +20 -20
- package/fesm2022/eui-components-eui-feedback-message.mjs +8 -8
- package/fesm2022/eui-components-eui-feedback-message.mjs.map +1 -1
- package/fesm2022/eui-components-eui-fieldset.mjs +14 -14
- package/fesm2022/eui-components-eui-fieldset.mjs.map +1 -1
- package/fesm2022/eui-components-eui-file-upload.mjs +21 -21
- package/fesm2022/eui-components-eui-file-upload.mjs.map +1 -1
- package/fesm2022/eui-components-eui-growl.mjs +8 -8
- package/fesm2022/eui-components-eui-growl.mjs.map +1 -1
- package/fesm2022/eui-components-eui-icon-button-expander.mjs +7 -7
- package/fesm2022/eui-components-eui-icon-button.mjs +7 -7
- package/fesm2022/eui-components-eui-icon-color.mjs +7 -7
- package/fesm2022/eui-components-eui-icon-input.mjs +7 -7
- package/fesm2022/eui-components-eui-icon-state.mjs +7 -7
- package/fesm2022/eui-components-eui-icon-toggle.mjs +7 -7
- package/fesm2022/eui-components-eui-icon.mjs +7 -7
- package/fesm2022/eui-components-eui-input-checkbox.mjs +8 -8
- package/fesm2022/eui-components-eui-input-checkbox.mjs.map +1 -1
- package/fesm2022/eui-components-eui-input-group.mjs +13 -13
- package/fesm2022/eui-components-eui-input-number.mjs +10 -10
- package/fesm2022/eui-components-eui-input-radio.mjs +7 -7
- package/fesm2022/eui-components-eui-input-text.mjs +7 -7
- package/fesm2022/eui-components-eui-label.mjs +8 -8
- package/fesm2022/eui-components-eui-label.mjs.map +1 -1
- package/fesm2022/eui-components-eui-language-selector.mjs +10 -10
- package/fesm2022/eui-components-eui-list.mjs +11 -11
- package/fesm2022/eui-components-eui-list.mjs.map +1 -1
- package/fesm2022/eui-components-eui-menu.mjs +12 -12
- package/fesm2022/eui-components-eui-menu.mjs.map +1 -1
- package/fesm2022/eui-components-eui-message-box.mjs +13 -13
- package/fesm2022/eui-components-eui-navbar.mjs +11 -11
- package/fesm2022/eui-components-eui-navbar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-overlay.mjs +20 -20
- package/fesm2022/eui-components-eui-overlay.mjs.map +1 -1
- package/fesm2022/eui-components-eui-page.mjs +59 -59
- package/fesm2022/eui-components-eui-page.mjs.map +1 -1
- package/fesm2022/eui-components-eui-paginator.mjs +7 -7
- package/fesm2022/eui-components-eui-popover.mjs +10 -10
- package/fesm2022/eui-components-eui-progress-bar.mjs +8 -8
- package/fesm2022/eui-components-eui-progress-bar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-progress-circle.mjs +8 -8
- package/fesm2022/eui-components-eui-progress-circle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-select.mjs +19 -19
- package/fesm2022/eui-components-eui-sidebar-menu.mjs +7 -7
- package/fesm2022/eui-components-eui-skeleton.mjs +7 -7
- package/fesm2022/eui-components-eui-slide-toggle.mjs +8 -8
- package/fesm2022/eui-components-eui-slide-toggle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-split-button.mjs +7 -7
- package/fesm2022/eui-components-eui-table-v2.mjs +34 -34
- package/fesm2022/eui-components-eui-table.mjs +35 -35
- package/fesm2022/eui-components-eui-table.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tabs.mjs +24 -24
- package/fesm2022/eui-components-eui-tabs.mjs.map +1 -1
- package/fesm2022/eui-components-eui-textarea.mjs +10 -10
- package/fesm2022/eui-components-eui-timebar.mjs +8 -8
- package/fesm2022/eui-components-eui-timebar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-timeline.mjs +11 -11
- package/fesm2022/eui-components-eui-timeline.mjs.map +1 -1
- package/fesm2022/eui-components-eui-timepicker.mjs +8 -8
- package/fesm2022/eui-components-eui-timepicker.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tree-list.mjs +26 -26
- package/fesm2022/eui-components-eui-tree-list.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tree.mjs +21 -21
- package/fesm2022/eui-components-eui-user-profile.mjs +16 -16
- package/fesm2022/eui-components-eui-wizard.mjs +15 -15
- package/fesm2022/eui-components-eui-wizard.mjs.map +1 -1
- package/fesm2022/eui-components-externals-charts.mjs +7 -7
- package/fesm2022/eui-components-externals-eui-editor.mjs +30 -30
- package/fesm2022/eui-components-externals-eui-editor.mjs.map +1 -1
- package/fesm2022/eui-components-externals-quill.mjs +10 -10
- package/fesm2022/eui-components-layout.mjs +184 -184
- package/fesm2022/eui-components-layout.mjs.map +1 -1
- package/fesm2022/eui-components-pipes.mjs +14 -14
- package/fesm2022/eui-components-shared.mjs +6 -6
- package/fesm2022/eui-components.mjs +4 -4
- package/package.json +11 -11
|
@@ -37,10 +37,10 @@ class EuiListItemComponent {
|
|
|
37
37
|
setInactiveStyles() {
|
|
38
38
|
this.isActive = false;
|
|
39
39
|
}
|
|
40
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
41
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.
|
|
40
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiListItemComponent, deps: [{ token: i1.BaseStatesDirective }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
41
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.5", type: EuiListItemComponent, isStandalone: false, selector: "[euiListItem], eui-list-item", inputs: { e2eAttr: "e2eAttr", isActive: ["isActive", "isActive", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.data-e2e": "this.e2eAttr", "attr.tabindex": "this.tabindex" } }, queries: [{ propertyName: "euiArrowKeyNavigableDirective", first: true, predicate: i0.forwardRef(() => EuiArrowKeyNavigableDirective), descendants: true }, { propertyName: "euiListComponent", predicate: i0.forwardRef(() => EuiListComponent), descendants: true }, { propertyName: "euiIconSvgComponent", predicate: i0.forwardRef(() => EuiIconSvgComponent), descendants: true }, { propertyName: "euiLabelComponent", predicate: i0.forwardRef(() => EuiLabelComponent), descendants: true }, { propertyName: "templates", predicate: i0.forwardRef(() => EuiTemplateDirective), descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant"] }], ngImport: i0, template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n", styles: [".eui-19 :host.eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list-item .eui-list-item__container{display:flex;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:flex;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon{align-items:center;display:flex;margin-right:var(--eui-s-xs)}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text{display:flex;flex-direction:column;font:var(--eui-f-m-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-s-m)}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list ::ng-deep .eui-list-item{padding-right:0}.eui-19 :host.eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-s-s)}.eui-19 :host.eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-19 :host.eui-list-item:active,.eui-19 :host.eui-list-item--active{background-color:var(--eui-c-active)}.eui-19 :host.eui-list-item--primary{color:var(--eui-c-primary)}.eui-19 :host.eui-list-item--primary .eui-icon-svg svg{fill:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-19 :host.eui-list-item--secondary{color:var(--eui-c-neutral-light)}.eui-19 :host.eui-list-item--secondary .eui-icon-svg svg{fill:var(--eui-c-neutral-light);color:var(--eui-c-neutral-light)}.eui-19 :host.eui-list-item--info{color:var(--eui-c-info)}.eui-19 :host.eui-list-item--info .eui-icon-svg svg{fill:var(--eui-c-info);color:var(--eui-c-info)}.eui-19 :host.eui-list-item--success{color:var(--eui-c-success-dark)}.eui-19 :host.eui-list-item--success .eui-icon-svg svg{fill:var(--eui-c-success-dark);color:var(--eui-c-success-dark)}.eui-19 :host.eui-list-item--warning{color:var(--eui-c-warning-dark)}.eui-19 :host.eui-list-item--warning .eui-icon-svg svg{fill:var(--eui-c-warning-dark);color:var(--eui-c-warning-dark)}.eui-19 :host.eui-list-item--danger{color:var(--eui-c-danger-dark)}.eui-19 :host.eui-list-item--danger .eui-icon-svg svg{fill:var(--eui-c-danger-dark);color:var(--eui-c-danger-dark)}.eui-19 :host.eui-list-item--accent{color:var(--eui-c-accent-dark)}.eui-19 :host.eui-list-item--accent .eui-icon-svg svg{fill:var(--eui-c-accent-dark);color:var(--eui-c-accent-dark)}.eui-19 :host.eui-list-item .eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-19 :host.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
42
42
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiListItemComponent, decorators: [{
|
|
44
44
|
type: Component,
|
|
45
45
|
args: [{ selector: '[euiListItem], eui-list-item', standalone: false, hostDirectives: [
|
|
46
46
|
{
|
|
@@ -56,7 +56,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
56
56
|
'euiVariant',
|
|
57
57
|
],
|
|
58
58
|
},
|
|
59
|
-
], template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n", styles: [".eui-19 :host.eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list-item .eui-list-item__container{display:flex;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:flex;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon{align-items:center;display:flex;margin-right:var(--eui-s-xs)}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text{display:flex;flex-direction:column;font:var(--eui-f-m-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-s-m)}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list ::ng-deep .eui-list-item{padding-right:0}.eui-19 :host.eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-s-s)}.eui-19 :host.eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-19 :host.eui-list-item:active,.eui-19 :host.eui-list-item--active{background-color:var(--eui-c-active)}.eui-19 :host.eui-list-item--primary{color:var(--eui-c-primary
|
|
59
|
+
], template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n", styles: [".eui-19 :host.eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list-item .eui-list-item__container{display:flex;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:flex;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon{align-items:center;display:flex;margin-right:var(--eui-s-xs)}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text{display:flex;flex-direction:column;font:var(--eui-f-m-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-s-m)}.eui-19 :host.eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list ::ng-deep .eui-list-item{padding-right:0}.eui-19 :host.eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-s-s)}.eui-19 :host.eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-19 :host.eui-list-item:active,.eui-19 :host.eui-list-item--active{background-color:var(--eui-c-active)}.eui-19 :host.eui-list-item--primary{color:var(--eui-c-primary)}.eui-19 :host.eui-list-item--primary .eui-icon-svg svg{fill:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-19 :host.eui-list-item--secondary{color:var(--eui-c-neutral-light)}.eui-19 :host.eui-list-item--secondary .eui-icon-svg svg{fill:var(--eui-c-neutral-light);color:var(--eui-c-neutral-light)}.eui-19 :host.eui-list-item--info{color:var(--eui-c-info)}.eui-19 :host.eui-list-item--info .eui-icon-svg svg{fill:var(--eui-c-info);color:var(--eui-c-info)}.eui-19 :host.eui-list-item--success{color:var(--eui-c-success-dark)}.eui-19 :host.eui-list-item--success .eui-icon-svg svg{fill:var(--eui-c-success-dark);color:var(--eui-c-success-dark)}.eui-19 :host.eui-list-item--warning{color:var(--eui-c-warning-dark)}.eui-19 :host.eui-list-item--warning .eui-icon-svg svg{fill:var(--eui-c-warning-dark);color:var(--eui-c-warning-dark)}.eui-19 :host.eui-list-item--danger{color:var(--eui-c-danger-dark)}.eui-19 :host.eui-list-item--danger .eui-icon-svg svg{fill:var(--eui-c-danger-dark);color:var(--eui-c-danger-dark)}.eui-19 :host.eui-list-item--accent{color:var(--eui-c-accent-dark)}.eui-19 :host.eui-list-item--accent .eui-icon-svg svg{fill:var(--eui-c-accent-dark);color:var(--eui-c-accent-dark)}.eui-19 :host.eui-list-item .eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-19 :host.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}\n"] }]
|
|
60
60
|
}], ctorParameters: () => [{ type: i1.BaseStatesDirective }, { type: i0.ElementRef }], propDecorators: { cssClasses: [{
|
|
61
61
|
type: HostBinding,
|
|
62
62
|
args: ['class']
|
|
@@ -141,10 +141,10 @@ class EuiListComponent {
|
|
|
141
141
|
// eslint-disable-next-line
|
|
142
142
|
!this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.isFocused ? this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.elementRef.nativeElement.focus() : this.focusKeyManager.activeItem.focus();
|
|
143
143
|
}
|
|
144
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
145
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.
|
|
144
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
145
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: EuiListComponent, isStandalone: false, selector: "[euiList], eui-list", host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.tabindex": "this.tabIndex" } }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => EuiListItemComponent), descendants: true }], ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 :host.eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-19 :host.eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list button.eui-list-item{padding:var(--eui-s-2xs) var(--eui-s-xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
146
146
|
}
|
|
147
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
147
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiListComponent, decorators: [{
|
|
148
148
|
type: Component,
|
|
149
149
|
args: [{ selector: '[euiList], eui-list', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, styles: [".eui-19 :host.eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-19 :host.eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-list button.eui-list-item{padding:var(--eui-s-2xs) var(--eui-s-xs)}\n"] }]
|
|
150
150
|
}], propDecorators: { cssClasses: [{
|
|
@@ -165,11 +165,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
165
165
|
}] } });
|
|
166
166
|
|
|
167
167
|
class EuiListModule {
|
|
168
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
169
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.
|
|
170
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.
|
|
168
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
169
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.5", ngImport: i0, type: EuiListModule, declarations: [EuiListComponent, EuiListItemComponent], imports: [CommonModule, EuiIconModule, EuiButtonModule, EuiLabelModule], exports: [EuiListComponent, EuiListItemComponent] }); }
|
|
170
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiListModule, imports: [CommonModule, EuiIconModule, EuiButtonModule, EuiLabelModule] }); }
|
|
171
171
|
}
|
|
172
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiListModule, decorators: [{
|
|
173
173
|
type: NgModule,
|
|
174
174
|
args: [{
|
|
175
175
|
imports: [CommonModule, EuiIconModule, EuiButtonModule, EuiLabelModule],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-components-eui-list.mjs","sources":["../../eui-list/eui-list-item/eui-list-item.component.ts","../../eui-list/eui-list-item/eui-list-item.component.html","../../eui-list/eui-list.component.ts","../../eui-list/eui-list.module.ts","../../eui-list/eui-components-eui-list.ts"],"sourcesContent":["import {\n Component,\n HostBinding,\n ContentChildren,\n forwardRef,\n QueryList,\n Input,\n ElementRef,\n booleanAttribute,\n ContentChild,\n} from '@angular/core';\nimport { Highlightable, FocusableOption } from '@angular/cdk/a11y';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { EuiListComponent } from '../eui-list.component';\nimport { EuiIconSvgComponent } from '@eui/components/eui-icon';\nimport { EuiLabelComponent } from '@eui/components/eui-label';\nimport { EuiTemplateDirective, EuiArrowKeyNavigableDirective } from '@eui/components/directives';\n\n@Component({\n templateUrl: './eui-list-item.component.html',\n selector: '[euiListItem], eui-list-item',\n styleUrls: ['../styles/list-item.scss'],\n standalone: false,\n hostDirectives: [\n {\n directive: BaseStatesDirective,\n inputs: [\n 'euiPrimary',\n 'euiSecondary',\n 'euiSuccess',\n 'euiInfo',\n 'euiWarning',\n 'euiDanger',\n 'euiAccent',\n 'euiVariant',\n ],\n },\n ],\n})\nexport class EuiListItemComponent implements FocusableOption, Highlightable {\n @HostBinding('class')\n get cssClasses(): string {\n return [\n this.baseStatesDirective.getCssClasses('eui-list-item'),\n this.isActive ? 'eui-list-item--active' : '',\n ].join(' ').trim();\n }\n\n @HostBinding('attr.role') role = 'listitem';\n @HostBinding('attr.data-e2e') @Input() e2eAttr = 'eui-list-item';\n @HostBinding('attr.tabindex') tabindex = '-1';\n\n @ContentChildren(forwardRef(() => EuiListComponent), { descendants: true }) euiListComponent: QueryList<EuiListComponent>;\n @ContentChildren(forwardRef(() => EuiIconSvgComponent), { descendants: true }) euiIconSvgComponent: QueryList<EuiIconSvgComponent>;\n @ContentChildren(forwardRef(() => EuiLabelComponent), { descendants: true }) euiLabelComponent: QueryList<EuiLabelComponent>;\n @ContentChildren(forwardRef(() => EuiTemplateDirective), { descendants: true }) templates: QueryList<EuiTemplateDirective>;\n @ContentChild(forwardRef(() => EuiArrowKeyNavigableDirective)) euiArrowKeyNavigableDirective: EuiArrowKeyNavigableDirective;\n\n @Input({ transform: booleanAttribute }) isActive = false;\n\n constructor(\n public baseStatesDirective: BaseStatesDirective,\n private elementRef: ElementRef,\n ) {\n }\n\n public focus(): void {\n this.elementRef.nativeElement.focus();\n }\n\n public click(): void {\n this.elementRef.nativeElement.click();\n }\n\n public setActiveStyles(): void {\n this.isActive = true;\n }\n\n public setInactiveStyles(): void {\n this.isActive = false;\n }\n}\n","<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n","import {\n Component,\n HostBinding,\n ChangeDetectionStrategy,\n AfterContentInit,\n ContentChildren,\n forwardRef,\n QueryList,\n HostListener,\n} from '@angular/core';\nimport { FocusKeyManager } from '@angular/cdk/a11y';\n\nimport { EuiListItemComponent } from './eui-list-item/eui-list-item.component';\n\n@Component({\n selector: '[euiList], eui-list',\n template: '<ng-content/>',\n styleUrls: ['./styles/list.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false,\n})\nexport class EuiListComponent implements AfterContentInit {\n @HostBinding('class')\n get cssClasses(): string {\n return 'eui-list';\n }\n\n @HostBinding('attr.role') role = 'list';\n @HostBinding('attr.tabindex') tabIndex: string;\n @ContentChildren(forwardRef(() => EuiListItemComponent), { descendants: true }) items: QueryList<EuiListItemComponent>;\n private focusKeyManager: FocusKeyManager<EuiListItemComponent>;\n\n @HostListener('keydown', ['$event'])\n onKeydown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'Enter': {\n if (this.focusKeyManager?.activeItem) {\n this.focusKeyManager.activeItem.click();\n }\n break;\n }\n case 'ArrowRight': {\n if(this.focusKeyManager.activeItem?.euiArrowKeyNavigableDirective){\n this.checkRichContentFocusState();\n }\n break;\n }\n case 'ArrowLeft': {\n if(this.focusKeyManager.activeItem?.euiArrowKeyNavigableDirective){\n this.checkRichContentFocusState();\n }\n break;\n }\n default: {\n this.focusKeyManager.onKeydown(event);\n break;\n }\n }\n }\n\n ngAfterContentInit(): void {\n // instantiates FocusKeyManager with the query list of items enabling wrapping\n this.focusKeyManager = new FocusKeyManager(this.items).withWrap();\n\n // checks whether an item contains a sub-menu and if so it sets it's ul element tabindex to -1\n this.items.forEach((item) => {\n if (item.euiListComponent.length > 0) {\n item.euiListComponent.forEach((list) => (list.tabIndex = '-1'));\n } else {\n this.tabIndex = '0';\n }\n });\n }\n\n checkRichContentFocusState(): void {\n // eslint-disable-next-line\n !this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.isFocused ? this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.elementRef.nativeElement.focus() : this.focusKeyManager.activeItem.focus();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { EuiListComponent } from './eui-list.component';\nimport { EuiListItemComponent } from './eui-list-item/eui-list-item.component';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiLabelModule } from '@eui/components/eui-label';\nimport { EuiButtonModule } from '@eui/components/eui-button';\n\n@NgModule({\n imports: [CommonModule, EuiIconModule, EuiButtonModule, EuiLabelModule],\n declarations: [EuiListComponent, EuiListItemComponent],\n exports: [EuiListComponent, EuiListItemComponent],\n})\nexport class EuiListModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;MAwCa,oBAAoB,CAAA;AAC7B,IAAA,IACI,UAAU,GAAA;QACV,OAAO;AACH,YAAA,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,eAAe,CAAC;YACvD,IAAI,CAAC,QAAQ,GAAG,uBAAuB,GAAG,EAAE;AAC/C,SAAA,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;;IAetB,WACW,CAAA,mBAAwC,EACvC,UAAsB,EAAA;QADvB,IAAmB,CAAA,mBAAA,GAAnB,mBAAmB;QAClB,IAAU,CAAA,UAAA,GAAV,UAAU;QAdI,IAAI,CAAA,IAAA,GAAG,UAAU;QACJ,IAAO,CAAA,OAAA,GAAG,eAAe;QAClC,IAAQ,CAAA,QAAA,GAAG,IAAI;QAQL,IAAQ,CAAA,QAAA,GAAG,KAAK;;IAQjD,KAAK,GAAA;AACR,QAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,EAAE;;IAGlC,KAAK,GAAA;AACR,QAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,EAAE;;IAGlC,eAAe,GAAA;AAClB,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;;IAGjB,iBAAiB,GAAA;AACpB,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;;8GAxChB,oBAAoB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,EAmBT,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,8BAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,UAAA,EAAA,UAAA,EAAA,gBAAgB,CAFL,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,WAAA,EAAA,eAAA,EAAA,cAAA,EAAA,eAAA,EAAA,eAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,+BAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,EAAA,CAAA,UAAA,CAAA,MAAA,6BAA6B,CAJ1B,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,SAAA,EAAA,EAAA,CAAA,UAAA,CAAA,MAAA,gBAAgB,CAChB,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,qBAAA,EAAA,SAAA,EAAA,EAAA,CAAA,UAAA,CAAA,MAAA,mBAAmB,CACnB,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,EAAA,CAAA,UAAA,CAAA,MAAA,iBAAiB,CACjB,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,WAAA,EAAA,SAAA,EAAA,EAAA,CAAA,UAAA,CAAA,MAAA,oBAAoB,8UCxD1D,iyBAiBA,EAAA,MAAA,EAAA,CAAA,soHAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FDuBa,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBArBhC,SAAS;+BAEI,8BAA8B,EAAA,UAAA,EAE5B,KAAK,EACD,cAAA,EAAA;AACZ,wBAAA;AACI,4BAAA,SAAS,EAAE,mBAAmB;AAC9B,4BAAA,MAAM,EAAE;gCACJ,YAAY;gCACZ,cAAc;gCACd,YAAY;gCACZ,SAAS;gCACT,YAAY;gCACZ,WAAW;gCACX,WAAW;gCACX,YAAY;AACf,6BAAA;AACJ,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,iyBAAA,EAAA,MAAA,EAAA,CAAA,soHAAA,CAAA,EAAA;iHAIG,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;gBAQM,IAAI,EAAA,CAAA;sBAA7B,WAAW;uBAAC,WAAW;gBACe,OAAO,EAAA,CAAA;sBAA7C,WAAW;uBAAC,eAAe;;sBAAG;gBACD,QAAQ,EAAA,CAAA;sBAArC,WAAW;uBAAC,eAAe;gBAEgD,gBAAgB,EAAA,CAAA;sBAA3F,eAAe;uBAAC,UAAU,CAAC,MAAM,gBAAgB,CAAC,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE;gBACK,mBAAmB,EAAA,CAAA;sBAAjG,eAAe;uBAAC,UAAU,CAAC,MAAM,mBAAmB,CAAC,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE;gBACA,iBAAiB,EAAA,CAAA;sBAA7F,eAAe;uBAAC,UAAU,CAAC,MAAM,iBAAiB,CAAC,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE;gBACK,SAAS,EAAA,CAAA;sBAAxF,eAAe;uBAAC,UAAU,CAAC,MAAM,oBAAoB,CAAC,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE;gBACf,6BAA6B,EAAA,CAAA;sBAA3F,YAAY;AAAC,gBAAA,IAAA,EAAA,CAAA,UAAU,CAAC,MAAM,6BAA6B,CAAC;gBAErB,QAAQ,EAAA,CAAA;sBAA/C,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;;;MEtC7B,gBAAgB,CAAA;AAP7B,IAAA,WAAA,GAAA;QAa8B,IAAI,CAAA,IAAA,GAAG,MAAM;AAmD1C;AAxDG,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,UAAU;;AASrB,IAAA,SAAS,CAAC,KAAoB,EAAA;AAC1B,QAAA,QAAQ,KAAK,CAAC,GAAG;YACb,KAAK,OAAO,EAAE;AACV,gBAAA,IAAI,IAAI,CAAC,eAAe,EAAE,UAAU,EAAE;AAClC,oBAAA,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,KAAK,EAAE;;gBAE3C;;YAEJ,KAAK,YAAY,EAAE;gBAChB,IAAG,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,6BAA6B,EAAC;oBAC7D,IAAI,CAAC,0BAA0B,EAAE;;gBAEtC;;YAEH,KAAK,WAAW,EAAE;gBACf,IAAG,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,6BAA6B,EAAC;oBAC7D,IAAI,CAAC,0BAA0B,EAAE;;gBAEtC;;YAEH,SAAS;AACL,gBAAA,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,KAAK,CAAC;gBACrC;;;;IAKZ,kBAAkB,GAAA;;AAEd,QAAA,IAAI,CAAC,eAAe,GAAG,IAAI,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;;QAGjE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;YACxB,IAAI,IAAI,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;AAClC,gBAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,IAAI,MAAM,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,CAAC;;iBAC5D;AACH,gBAAA,IAAI,CAAC,QAAQ,GAAG,GAAG;;AAE3B,SAAC,CAAC;;IAGN,0BAA0B,GAAA;;AAEtB,QAAA,CAAC,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,6BAA6B,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,6BAA6B,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,KAAK,EAAE;;8GAvD9M,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAhB,gBAAgB,EAAA,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,SAAA,EAAA,mBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,WAAA,EAAA,eAAA,EAAA,eAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,CAAA,UAAA,CAAA,MAQS,oBAAoB,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAb5C,eAAe,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,+pBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAKhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAP5B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,qBAAqB,YACrB,eAAe,EAAA,eAAA,EAER,uBAAuB,CAAC,MAAM,cACnC,KAAK,EAAA,MAAA,EAAA,CAAA,+pBAAA,CAAA,EAAA;8BAIb,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;gBAKM,IAAI,EAAA,CAAA;sBAA7B,WAAW;uBAAC,WAAW;gBACM,QAAQ,EAAA,CAAA;sBAArC,WAAW;uBAAC,eAAe;gBACoD,KAAK,EAAA,CAAA;sBAApF,eAAe;uBAAC,UAAU,CAAC,MAAM,oBAAoB,CAAC,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE;gBAI9E,SAAS,EAAA,CAAA;sBADR,YAAY;uBAAC,SAAS,EAAE,CAAC,QAAQ,CAAC;;;MClB1B,aAAa,CAAA;8GAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,EAHP,YAAA,EAAA,CAAA,gBAAgB,EAAE,oBAAoB,aAD3C,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,cAAc,CAE5D,EAAA,OAAA,EAAA,CAAA,gBAAgB,EAAE,oBAAoB,CAAA,EAAA,CAAA,CAAA;AAEvC,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,YAJZ,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,cAAc,CAAA,EAAA,CAAA,CAAA;;2FAI7D,aAAa,EAAA,UAAA,EAAA,CAAA;kBALzB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,OAAO,EAAE,CAAC,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,cAAc,CAAC;AACvE,oBAAA,YAAY,EAAE,CAAC,gBAAgB,EAAE,oBAAoB,CAAC;AACtD,oBAAA,OAAO,EAAE,CAAC,gBAAgB,EAAE,oBAAoB,CAAC;AACpD,iBAAA;;;ACbD;;AAEG;;;;"}
|
|
1
|
+
{"version":3,"file":"eui-components-eui-list.mjs","sources":["../../eui-list/eui-list-item/eui-list-item.component.ts","../../eui-list/eui-list-item/eui-list-item.component.html","../../eui-list/eui-list.component.ts","../../eui-list/eui-list.module.ts","../../eui-list/eui-components-eui-list.ts"],"sourcesContent":["import {\n Component,\n HostBinding,\n ContentChildren,\n forwardRef,\n QueryList,\n Input,\n ElementRef,\n booleanAttribute,\n ContentChild,\n} from '@angular/core';\nimport { Highlightable, FocusableOption } from '@angular/cdk/a11y';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { EuiListComponent } from '../eui-list.component';\nimport { EuiIconSvgComponent } from '@eui/components/eui-icon';\nimport { EuiLabelComponent } from '@eui/components/eui-label';\nimport { EuiTemplateDirective, EuiArrowKeyNavigableDirective } from '@eui/components/directives';\n\n@Component({\n templateUrl: './eui-list-item.component.html',\n selector: '[euiListItem], eui-list-item',\n styleUrls: ['../styles/list-item.scss'],\n standalone: false,\n hostDirectives: [\n {\n directive: BaseStatesDirective,\n inputs: [\n 'euiPrimary',\n 'euiSecondary',\n 'euiSuccess',\n 'euiInfo',\n 'euiWarning',\n 'euiDanger',\n 'euiAccent',\n 'euiVariant',\n ],\n },\n ],\n})\nexport class EuiListItemComponent implements FocusableOption, Highlightable {\n @HostBinding('class')\n get cssClasses(): string {\n return [\n this.baseStatesDirective.getCssClasses('eui-list-item'),\n this.isActive ? 'eui-list-item--active' : '',\n ].join(' ').trim();\n }\n\n @HostBinding('attr.role') role = 'listitem';\n @HostBinding('attr.data-e2e') @Input() e2eAttr = 'eui-list-item';\n @HostBinding('attr.tabindex') tabindex = '-1';\n\n @ContentChildren(forwardRef(() => EuiListComponent), { descendants: true }) euiListComponent: QueryList<EuiListComponent>;\n @ContentChildren(forwardRef(() => EuiIconSvgComponent), { descendants: true }) euiIconSvgComponent: QueryList<EuiIconSvgComponent>;\n @ContentChildren(forwardRef(() => EuiLabelComponent), { descendants: true }) euiLabelComponent: QueryList<EuiLabelComponent>;\n @ContentChildren(forwardRef(() => EuiTemplateDirective), { descendants: true }) templates: QueryList<EuiTemplateDirective>;\n @ContentChild(forwardRef(() => EuiArrowKeyNavigableDirective)) euiArrowKeyNavigableDirective: EuiArrowKeyNavigableDirective;\n\n @Input({ transform: booleanAttribute }) isActive = false;\n\n constructor(\n public baseStatesDirective: BaseStatesDirective,\n private elementRef: ElementRef,\n ) {\n }\n\n public focus(): void {\n this.elementRef.nativeElement.focus();\n }\n\n public click(): void {\n this.elementRef.nativeElement.click();\n }\n\n public setActiveStyles(): void {\n this.isActive = true;\n }\n\n public setInactiveStyles(): void {\n this.isActive = false;\n }\n}\n","<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n","import {\n Component,\n HostBinding,\n ChangeDetectionStrategy,\n AfterContentInit,\n ContentChildren,\n forwardRef,\n QueryList,\n HostListener,\n} from '@angular/core';\nimport { FocusKeyManager } from '@angular/cdk/a11y';\n\nimport { EuiListItemComponent } from './eui-list-item/eui-list-item.component';\n\n@Component({\n selector: '[euiList], eui-list',\n template: '<ng-content/>',\n styleUrls: ['./styles/list.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false,\n})\nexport class EuiListComponent implements AfterContentInit {\n @HostBinding('class')\n get cssClasses(): string {\n return 'eui-list';\n }\n\n @HostBinding('attr.role') role = 'list';\n @HostBinding('attr.tabindex') tabIndex: string;\n @ContentChildren(forwardRef(() => EuiListItemComponent), { descendants: true }) items: QueryList<EuiListItemComponent>;\n private focusKeyManager: FocusKeyManager<EuiListItemComponent>;\n\n @HostListener('keydown', ['$event'])\n onKeydown(event: KeyboardEvent): void {\n switch (event.key) {\n case 'Enter': {\n if (this.focusKeyManager?.activeItem) {\n this.focusKeyManager.activeItem.click();\n }\n break;\n }\n case 'ArrowRight': {\n if(this.focusKeyManager.activeItem?.euiArrowKeyNavigableDirective){\n this.checkRichContentFocusState();\n }\n break;\n }\n case 'ArrowLeft': {\n if(this.focusKeyManager.activeItem?.euiArrowKeyNavigableDirective){\n this.checkRichContentFocusState();\n }\n break;\n }\n default: {\n this.focusKeyManager.onKeydown(event);\n break;\n }\n }\n }\n\n ngAfterContentInit(): void {\n // instantiates FocusKeyManager with the query list of items enabling wrapping\n this.focusKeyManager = new FocusKeyManager(this.items).withWrap();\n\n // checks whether an item contains a sub-menu and if so it sets it's ul element tabindex to -1\n this.items.forEach((item) => {\n if (item.euiListComponent.length > 0) {\n item.euiListComponent.forEach((list) => (list.tabIndex = '-1'));\n } else {\n this.tabIndex = '0';\n }\n });\n }\n\n checkRichContentFocusState(): void {\n // eslint-disable-next-line\n !this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.isFocused ? this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.elementRef.nativeElement.focus() : this.focusKeyManager.activeItem.focus();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { EuiListComponent } from './eui-list.component';\nimport { EuiListItemComponent } from './eui-list-item/eui-list-item.component';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiLabelModule } from '@eui/components/eui-label';\nimport { EuiButtonModule } from '@eui/components/eui-button';\n\n@NgModule({\n imports: [CommonModule, EuiIconModule, EuiButtonModule, EuiLabelModule],\n declarations: [EuiListComponent, EuiListItemComponent],\n exports: [EuiListComponent, EuiListItemComponent],\n})\nexport class EuiListModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -148,12 +148,12 @@ class EuiMenuItemComponent {
|
|
|
148
148
|
!this.parent && this.hasBoldRootLevel ? 'eui-menu-item--bold' : '',
|
|
149
149
|
].join(' ').trim();
|
|
150
150
|
}
|
|
151
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
152
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiMenuItemComponent, isStandalone: false, selector: "eui-menu-item", inputs: { item: "item", parent: "parent", hasExpandIcon: "hasExpandIcon", hasIcon: ["hasIcon", "hasIcon", booleanAttribute], hasTooltip: ["hasTooltip", "hasTooltip", booleanAttribute], hasTooltipOnExpanded: ["hasTooltipOnExpanded", "hasTooltipOnExpanded", booleanAttribute], isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], hasCollapsedInitials: ["hasCollapsedInitials", "hasCollapsedInitials", booleanAttribute], hasBoldRootLevel: ["hasBoldRootLevel", "hasBoldRootLevel", booleanAttribute] }, outputs: { expandToggle: "expandToggle", itemClick: "itemClick" }, host: { listeners: { "click": "stopPropagation($event)" }, properties: { "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "class": "this.cssClasses", "attr.tabindex": "this.tabindex", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-disabled": "this.ariaDisabled" } }, usesOnChanges: true, ngImport: i0, template: "@if (item.visible && item.filtered) {\n @if (isLabelItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n class=\"eui-menu-item__content\"\n [attr.data-e2e]=\"item.e2eAttr\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [attr.aria-disabled]=\"item.disabled\"\n [euiTooltip]=\"menuItemTooltip\"\n tabindex=\"-1\"\n position=\"after\">\n\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link eui-menu-item__link-category\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label-category\">{{ item.label }}</span>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n </a>\n </li>\n }\n\n @if (isUrlItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n [routerLink]=\"item.url ? item.url : null\"\n [queryParams]=\"item.queryParams\"\n [routerLinkActive]=\"item.url ? 'eui-menu-item__link--active' : ''\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\"\n tabindex=\"-1\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n\n @if (isLinkItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n}\n\n<ng-template #linkContent>\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label\">{{ item.label }}</span>\n <eui-icon-svg\n *ngIf=\"item.urlExternal && item.urlExternalTarget === '_blank'\"\n class=\"eui-menu-item__label-external\"\n icon=\"eui-ecl-external\"\n size=\"2xs\"\n aria-label=\"external link icon\"\n euiEnd>\n </eui-icon-svg>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n</ng-template>\n\n<!-- PROJECTED CONTENT BLOCK -->\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n\n<!-- PROJECTED START BLOCK -->\n<ng-template #itemIconContent>\n @if (!isCollapsed) {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n @else if (!isLabelItem) {\n <!-- DEFAULT for non category items -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n } @else if (item.hasMarker) {\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n\n } @else {\n @if (hasCollapsedInitials) {\n <span class=\"eui-menu-item__link-initials eui-u-c-bg-{{item.iconTypeClass}}\">\n {{ item.initials }}\n </span>\n } @else {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n } @else {\n <!-- DEFAULT -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\"\n [aria-label]=\"item.iconLabel\">\n </eui-icon-svg>\n }\n } @else {\n <eui-icon-svg\n class=\"eui-menu-item__link-icon eui-u-ml-2xs\"\n icon=\"square:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n }\n }\n</ng-template>\n\n<!-- PROJECTED END BLOCK -->\n<ng-template #itemEndContent>\n @if (item.tagLabel) {\n @if (isCollapsed) {\n <eui-badge [euiVariant]=\"item.tagTypeClass\" class=\"eui-menu-item__link-dotted-badge\"></eui-badge>\n } @else {\n <eui-badge [euiVariant]=\"item.tagTypeClass\">\n {{ item.tagLabel }}\n </eui-badge>\n }\n }\n\n <button\n *ngIf=\"item.actionIcon\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n type=\"button\"\n tabindex=\"-1\"\n (keydown)=\"onActionIconKeyDown($event)\"\n (focusout)=\"onActionIconFocusOut()\"\n (focus)=\"focusActionIcon()\"\n class=\"eui-menu-item__link-action-icon\"\n [euiDisabled]=\"item.disabled\"\n [attr.aria-label]=\"item.actionIcon?.label\"\n (click)=\"onActionIconClick($event)\">\n <eui-icon-svg [icon]=\"item.actionIcon?.icon\" [fillColor]=\"item.actionIcon?.color\"></eui-icon-svg>\n </button>\n\n @if (hasExpandIcon) {\n <eui-icon-button *ngIf=\"item.children?.length > 0\"\n class=\"eui-menu-item__link-toggle\"\n [icon]=\"item.expanded ? 'chevron-up:sharp': 'chevron-down:sharp'\"\n (buttonClick)=\"onExpandToggle($event)\"\n [ariaLabel]=\"item.expanded ? collapseMenuLabel : expandMenuLabel\"\n euiRounded\n size=\"s\"\n [tabindex]=\"-1\"\n [euiDisabled]=\"item.disabled\"/>\n }\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary-dark);outline-offset:0px}.eui-19 .eui-menu-item .eui-menu-item__content{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link{align-items:center;color:var(--eui-c-text);cursor:pointer;display:flex;font:var(--eui-f-m);gap:var(--eui-s-xs);min-height:var(--eui-s-4xl);padding:0 var(--eui-s-xs) 0 var(--eui-s-m);margin-bottom:calc(-1 * var(--eui-s-2xs));border-top:1px solid var(--eui-c-neutral-bg);text-decoration:none;width:100%}.eui-19 .eui-menu-item__link-start-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link-start-block:empty{display:none}.eui-19 .eui-menu-item__link-content-block{display:flex;flex-direction:column;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label{color:var(--eui-c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label-category{cursor:default;color:var(--eui-c-primary-darker);font:var(--eui-f-bold);opacity:var(--eui-o-75);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-end-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-primary-bg);text-decoration:none}.eui-19 .eui-menu-item__link--disabled{opacity:var(--eui-o-50);pointer-events:none}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-primary-bg);font:var(--eui-f-m-bold)}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled) .eui-menu-item__link-label{color:var(--eui-c-primary-dark)}.eui-19 .eui-menu-item--expanded{display:flex;flex-direction:column}.eui-19 .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-3xl)}.eui-19 .eui-menu-item .eui-menu-sub .eui-menu-item__link{min-height:var(--eui-s-3xl);padding-left:var(--eui-s-xl);border-top:0}.eui-19 .eui-menu-item--bold>.eui-menu-item__content>.eui-menu-item__link{font:var(--eui-f-m-bold)}.eui-19.eui-t-ds2025 .eui-menu-item__link{margin-bottom:calc(-1 * var(--eui-s-3xs))}.eui-19.eui-t-ds2025 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-neutral-min);text-decoration:none}.eui-19.eui-t-ds2025 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-neutral-min)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i3.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i4.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i5.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "directive", type: i6.EuiTooltipDirective, selector: "[euiTooltip]", inputs: ["e2eAttr", "showDelay", "hideDelay", "contentAlignment", "position", "isDisabled", "euiTooltip", "euiTooltipPrimary", "euiTooltipSecondary", "euiTooltipInfo", "euiTooltipSuccess", "euiTooltipWarning", "euiTooltipDanger", "euiTooltipAccent"], exportAs: ["euiTooltip"] }, { kind: "component", type: i7.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["e2eAttr", "aria-label", "maxCharCount", "charReplacement", "euiIconBadge", "euiDottedBadge"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
151
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
152
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: EuiMenuItemComponent, isStandalone: false, selector: "eui-menu-item", inputs: { item: "item", parent: "parent", hasExpandIcon: "hasExpandIcon", hasIcon: ["hasIcon", "hasIcon", booleanAttribute], hasTooltip: ["hasTooltip", "hasTooltip", booleanAttribute], hasTooltipOnExpanded: ["hasTooltipOnExpanded", "hasTooltipOnExpanded", booleanAttribute], isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], hasCollapsedInitials: ["hasCollapsedInitials", "hasCollapsedInitials", booleanAttribute], hasBoldRootLevel: ["hasBoldRootLevel", "hasBoldRootLevel", booleanAttribute] }, outputs: { expandToggle: "expandToggle", itemClick: "itemClick" }, host: { listeners: { "click": "stopPropagation($event)" }, properties: { "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "class": "this.cssClasses", "attr.tabindex": "this.tabindex", "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-disabled": "this.ariaDisabled" } }, usesOnChanges: true, ngImport: i0, template: "@if (item.visible && item.filtered) {\n @if (isLabelItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n class=\"eui-menu-item__content\"\n [attr.data-e2e]=\"item.e2eAttr\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [attr.aria-disabled]=\"item.disabled\"\n [euiTooltip]=\"menuItemTooltip\"\n tabindex=\"-1\"\n position=\"after\">\n\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link eui-menu-item__link-category\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label-category\">{{ item.label }}</span>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n </a>\n </li>\n }\n\n @if (isUrlItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n [routerLink]=\"item.url ? item.url : null\"\n [queryParams]=\"item.queryParams\"\n [routerLinkActive]=\"item.url ? 'eui-menu-item__link--active' : ''\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\"\n tabindex=\"-1\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n\n @if (isLinkItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n}\n\n<ng-template #linkContent>\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label\">{{ item.label }}</span>\n <eui-icon-svg\n *ngIf=\"item.urlExternal && item.urlExternalTarget === '_blank'\"\n class=\"eui-menu-item__label-external\"\n icon=\"eui-ecl-external\"\n size=\"2xs\"\n aria-label=\"external link icon\"\n euiEnd>\n </eui-icon-svg>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n</ng-template>\n\n<!-- PROJECTED CONTENT BLOCK -->\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n\n<!-- PROJECTED START BLOCK -->\n<ng-template #itemIconContent>\n @if (!isCollapsed) {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n @else if (!isLabelItem) {\n <!-- DEFAULT for non category items -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n } @else if (item.hasMarker) {\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n\n } @else {\n @if (hasCollapsedInitials) {\n <span class=\"eui-menu-item__link-initials eui-u-c-bg-{{item.iconTypeClass}}\">\n {{ item.initials }}\n </span>\n } @else {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n } @else {\n <!-- DEFAULT -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\"\n [aria-label]=\"item.iconLabel\">\n </eui-icon-svg>\n }\n } @else {\n <eui-icon-svg\n class=\"eui-menu-item__link-icon eui-u-ml-2xs\"\n icon=\"square:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n }\n }\n</ng-template>\n\n<!-- PROJECTED END BLOCK -->\n<ng-template #itemEndContent>\n @if (item.tagLabel) {\n @if (isCollapsed) {\n <eui-badge [euiVariant]=\"item.tagTypeClass\" class=\"eui-menu-item__link-dotted-badge\"></eui-badge>\n } @else {\n <eui-badge [euiVariant]=\"item.tagTypeClass\">\n {{ item.tagLabel }}\n </eui-badge>\n }\n }\n\n <button\n *ngIf=\"item.actionIcon\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n type=\"button\"\n tabindex=\"-1\"\n (keydown)=\"onActionIconKeyDown($event)\"\n (focusout)=\"onActionIconFocusOut()\"\n (focus)=\"focusActionIcon()\"\n class=\"eui-menu-item__link-action-icon\"\n [euiDisabled]=\"item.disabled\"\n [attr.aria-label]=\"item.actionIcon?.label\"\n (click)=\"onActionIconClick($event)\">\n <eui-icon-svg [icon]=\"item.actionIcon?.icon\" [fillColor]=\"item.actionIcon?.color\"></eui-icon-svg>\n </button>\n\n @if (hasExpandIcon) {\n <eui-icon-button *ngIf=\"item.children?.length > 0\"\n class=\"eui-menu-item__link-toggle\"\n [icon]=\"item.expanded ? 'chevron-up:sharp': 'chevron-down:sharp'\"\n (buttonClick)=\"onExpandToggle($event)\"\n [ariaLabel]=\"item.expanded ? collapseMenuLabel : expandMenuLabel\"\n euiRounded\n size=\"s\"\n [tabindex]=\"-1\"\n [euiDisabled]=\"item.disabled\"/>\n }\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary);outline-offset:0px}.eui-19 .eui-menu-item .eui-menu-item__content{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link{align-items:center;color:var(--eui-c-text);cursor:pointer;display:flex;font:var(--eui-f-m);gap:var(--eui-s-xs);min-height:var(--eui-s-4xl);padding:0 var(--eui-s-xs) 0 var(--eui-s-m);margin-bottom:calc(-1 * var(--eui-s-2xs));border-top:1px solid var(--eui-c-neutral-bg);text-decoration:none;width:100%}.eui-19 .eui-menu-item__link-start-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link-start-block:empty{display:none}.eui-19 .eui-menu-item__link-content-block{display:flex;flex-direction:column;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label{color:var(--eui-c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label-category{cursor:default;color:var(--eui-c-neutral-darker);font:var(--eui-f-bold);opacity:var(--eui-o-75);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-end-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-primary-bg);text-decoration:none}.eui-19 .eui-menu-item__link--disabled{opacity:var(--eui-o-50);pointer-events:none}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-primary-bg);font:var(--eui-f-m-bold)}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled) .eui-menu-item__link-label{color:var(--eui-c-primary)}.eui-19 .eui-menu-item--expanded{display:flex;flex-direction:column}.eui-19 .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-3xl)}.eui-19 .eui-menu-item .eui-menu-sub .eui-menu-item__link{min-height:var(--eui-s-3xl);padding-left:var(--eui-s-xl);border-top:0}.eui-19 .eui-menu-item--bold>.eui-menu-item__content>.eui-menu-item__link{font:var(--eui-f-m-bold)}.eui-19.eui-t-ds2025 .eui-menu-item__link{margin-bottom:calc(-1 * var(--eui-s-3xs))}.eui-19.eui-t-ds2025 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-neutral-min);text-decoration:none}.eui-19.eui-t-ds2025 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-neutral-min)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i3.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i4.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i5.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "directive", type: i6.EuiTooltipDirective, selector: "[euiTooltip]", inputs: ["e2eAttr", "showDelay", "hideDelay", "contentAlignment", "position", "isDisabled", "euiTooltip", "euiTooltipPrimary", "euiTooltipSecondary", "euiTooltipInfo", "euiTooltipSuccess", "euiTooltipWarning", "euiTooltipDanger", "euiTooltipAccent"], exportAs: ["euiTooltip"] }, { kind: "component", type: i7.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["e2eAttr", "aria-label", "maxCharCount", "charReplacement", "euiIconBadge", "euiDottedBadge"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
153
153
|
}
|
|
154
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
154
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuItemComponent, decorators: [{
|
|
155
155
|
type: Component,
|
|
156
|
-
args: [{ selector: 'eui-menu-item', encapsulation: ViewEncapsulation.None, standalone: false, template: "@if (item.visible && item.filtered) {\n @if (isLabelItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n class=\"eui-menu-item__content\"\n [attr.data-e2e]=\"item.e2eAttr\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [attr.aria-disabled]=\"item.disabled\"\n [euiTooltip]=\"menuItemTooltip\"\n tabindex=\"-1\"\n position=\"after\">\n\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link eui-menu-item__link-category\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label-category\">{{ item.label }}</span>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n </a>\n </li>\n }\n\n @if (isUrlItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n [routerLink]=\"item.url ? item.url : null\"\n [queryParams]=\"item.queryParams\"\n [routerLinkActive]=\"item.url ? 'eui-menu-item__link--active' : ''\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\"\n tabindex=\"-1\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n\n @if (isLinkItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n}\n\n<ng-template #linkContent>\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label\">{{ item.label }}</span>\n <eui-icon-svg\n *ngIf=\"item.urlExternal && item.urlExternalTarget === '_blank'\"\n class=\"eui-menu-item__label-external\"\n icon=\"eui-ecl-external\"\n size=\"2xs\"\n aria-label=\"external link icon\"\n euiEnd>\n </eui-icon-svg>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n</ng-template>\n\n<!-- PROJECTED CONTENT BLOCK -->\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n\n<!-- PROJECTED START BLOCK -->\n<ng-template #itemIconContent>\n @if (!isCollapsed) {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n @else if (!isLabelItem) {\n <!-- DEFAULT for non category items -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n } @else if (item.hasMarker) {\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n\n } @else {\n @if (hasCollapsedInitials) {\n <span class=\"eui-menu-item__link-initials eui-u-c-bg-{{item.iconTypeClass}}\">\n {{ item.initials }}\n </span>\n } @else {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n } @else {\n <!-- DEFAULT -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\"\n [aria-label]=\"item.iconLabel\">\n </eui-icon-svg>\n }\n } @else {\n <eui-icon-svg\n class=\"eui-menu-item__link-icon eui-u-ml-2xs\"\n icon=\"square:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n }\n }\n</ng-template>\n\n<!-- PROJECTED END BLOCK -->\n<ng-template #itemEndContent>\n @if (item.tagLabel) {\n @if (isCollapsed) {\n <eui-badge [euiVariant]=\"item.tagTypeClass\" class=\"eui-menu-item__link-dotted-badge\"></eui-badge>\n } @else {\n <eui-badge [euiVariant]=\"item.tagTypeClass\">\n {{ item.tagLabel }}\n </eui-badge>\n }\n }\n\n <button\n *ngIf=\"item.actionIcon\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n type=\"button\"\n tabindex=\"-1\"\n (keydown)=\"onActionIconKeyDown($event)\"\n (focusout)=\"onActionIconFocusOut()\"\n (focus)=\"focusActionIcon()\"\n class=\"eui-menu-item__link-action-icon\"\n [euiDisabled]=\"item.disabled\"\n [attr.aria-label]=\"item.actionIcon?.label\"\n (click)=\"onActionIconClick($event)\">\n <eui-icon-svg [icon]=\"item.actionIcon?.icon\" [fillColor]=\"item.actionIcon?.color\"></eui-icon-svg>\n </button>\n\n @if (hasExpandIcon) {\n <eui-icon-button *ngIf=\"item.children?.length > 0\"\n class=\"eui-menu-item__link-toggle\"\n [icon]=\"item.expanded ? 'chevron-up:sharp': 'chevron-down:sharp'\"\n (buttonClick)=\"onExpandToggle($event)\"\n [ariaLabel]=\"item.expanded ? collapseMenuLabel : expandMenuLabel\"\n euiRounded\n size=\"s\"\n [tabindex]=\"-1\"\n [euiDisabled]=\"item.disabled\"/>\n }\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary-dark);outline-offset:0px}.eui-19 .eui-menu-item .eui-menu-item__content{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link{align-items:center;color:var(--eui-c-text);cursor:pointer;display:flex;font:var(--eui-f-m);gap:var(--eui-s-xs);min-height:var(--eui-s-4xl);padding:0 var(--eui-s-xs) 0 var(--eui-s-m);margin-bottom:calc(-1 * var(--eui-s-2xs));border-top:1px solid var(--eui-c-neutral-bg);text-decoration:none;width:100%}.eui-19 .eui-menu-item__link-start-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link-start-block:empty{display:none}.eui-19 .eui-menu-item__link-content-block{display:flex;flex-direction:column;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label{color:var(--eui-c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label-category{cursor:default;color:var(--eui-c-primary-darker);font:var(--eui-f-bold);opacity:var(--eui-o-75);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-end-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-primary-bg);text-decoration:none}.eui-19 .eui-menu-item__link--disabled{opacity:var(--eui-o-50);pointer-events:none}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-primary-bg);font:var(--eui-f-m-bold)}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled) .eui-menu-item__link-label{color:var(--eui-c-primary-dark)}.eui-19 .eui-menu-item--expanded{display:flex;flex-direction:column}.eui-19 .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-3xl)}.eui-19 .eui-menu-item .eui-menu-sub .eui-menu-item__link{min-height:var(--eui-s-3xl);padding-left:var(--eui-s-xl);border-top:0}.eui-19 .eui-menu-item--bold>.eui-menu-item__content>.eui-menu-item__link{font:var(--eui-f-m-bold)}.eui-19.eui-t-ds2025 .eui-menu-item__link{margin-bottom:calc(-1 * var(--eui-s-3xs))}.eui-19.eui-t-ds2025 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-neutral-min);text-decoration:none}.eui-19.eui-t-ds2025 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-neutral-min)}\n"] }]
|
|
156
|
+
args: [{ selector: 'eui-menu-item', encapsulation: ViewEncapsulation.None, standalone: false, template: "@if (item.visible && item.filtered) {\n @if (isLabelItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n class=\"eui-menu-item__content\"\n [attr.data-e2e]=\"item.e2eAttr\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [attr.aria-disabled]=\"item.disabled\"\n [euiTooltip]=\"menuItemTooltip\"\n tabindex=\"-1\"\n position=\"after\">\n\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link eui-menu-item__link-category\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label-category\">{{ item.label }}</span>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n </a>\n </li>\n }\n\n @if (isUrlItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n [routerLink]=\"item.url ? item.url : null\"\n [queryParams]=\"item.queryParams\"\n [routerLinkActive]=\"item.url ? 'eui-menu-item__link--active' : ''\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\"\n tabindex=\"-1\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n\n @if (isLinkItem) {\n <li\n role=\"none\"\n id=\"{{item.id}}\"\n [attr.data-e2e]=\"item.e2eAttr\"\n class=\"eui-menu-item__content\"\n [class.eui-menu-item--disabled]=\"item.disabled\"\n [class.eui-menu-item--expanded]=\"item.expanded || item.filtered\"\n [attr.aria-disabled]=\"item.disabled\">\n <a\n (click)=\"onClick($event)\"\n tabindex=\"-1\"\n class=\"eui-menu-item__link\"\n [class.eui-menu-item__link--disabled]=\"item.disabled\"\n [class.eui-menu-item__link--active]=\"item.active\"\n [class.eui-menu-item__link--has-sub]=\"item.children?.length > 0\"\n href=\"javascript:void(0)\"\n [euiTooltip]=\"menuItemTooltip\"\n position=\"after\">\n <ng-template *ngTemplateOutlet=\"linkContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </a>\n\n <ng-template *ngTemplateOutlet=\"content\"></ng-template>\n </li>\n }\n}\n\n<ng-template #linkContent>\n <div class=\"eui-menu-item__link-start-block\">\n <ng-template *ngTemplateOutlet=\"itemIconContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n\n <div class=\"eui-menu-item__link-content-block\">\n <div class=\"eui-menu-item__link-label-container\">\n <span class=\"eui-menu-item__link-label\">{{ item.label }}</span>\n <eui-icon-svg\n *ngIf=\"item.urlExternal && item.urlExternalTarget === '_blank'\"\n class=\"eui-menu-item__label-external\"\n icon=\"eui-ecl-external\"\n size=\"2xs\"\n aria-label=\"external link icon\"\n euiEnd>\n </eui-icon-svg>\n </div>\n </div>\n\n <div class=\"eui-menu-item__link-end-block\">\n <ng-template *ngTemplateOutlet=\"itemEndContent\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </div>\n</ng-template>\n\n<!-- PROJECTED CONTENT BLOCK -->\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n\n<!-- PROJECTED START BLOCK -->\n<ng-template #itemIconContent>\n @if (!isCollapsed) {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n @else if (!isLabelItem) {\n <!-- DEFAULT for non category items -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n } @else if (item.hasMarker) {\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n }\n\n } @else {\n @if (hasCollapsedInitials) {\n <span class=\"eui-menu-item__link-initials eui-u-c-bg-{{item.iconTypeClass}}\">\n {{ item.initials }}\n </span>\n } @else {\n @if (hasIcon) {\n @if (item.iconSvgName) {\n <!-- SVG -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"{{ item.iconSvgName }}\"\n fillColor=\"{{ item.iconTypeClass }}\">\n </eui-icon-svg>\n\n } @else if (item.hasMarker) {\n <!-- MARKER -->\n <eui-icon-svg\n class=\"eui-menu-item__link-marker\"\n fillColor=\"{{ item?.markerTypeClass }}\"\n icon=\"ellipse:sharp\"\n size=\"2xs\"\n [aria-label]=\"item.markerTypeClass + ' ' + 'marker'\">\n </eui-icon-svg>\n } @else {\n <!-- DEFAULT -->\n <eui-icon-svg\n class=\"eui-menu-item__link-icon\"\n icon=\"ellipse:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\"\n [aria-label]=\"item.iconLabel\">\n </eui-icon-svg>\n }\n } @else {\n <eui-icon-svg\n class=\"eui-menu-item__link-icon eui-u-ml-2xs\"\n icon=\"square:sharp\"\n fillColor=\"neutral-light\"\n size=\"2xs\">\n </eui-icon-svg>\n }\n }\n }\n</ng-template>\n\n<!-- PROJECTED END BLOCK -->\n<ng-template #itemEndContent>\n @if (item.tagLabel) {\n @if (isCollapsed) {\n <eui-badge [euiVariant]=\"item.tagTypeClass\" class=\"eui-menu-item__link-dotted-badge\"></eui-badge>\n } @else {\n <eui-badge [euiVariant]=\"item.tagTypeClass\">\n {{ item.tagLabel }}\n </eui-badge>\n }\n }\n\n <button\n *ngIf=\"item.actionIcon\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n type=\"button\"\n tabindex=\"-1\"\n (keydown)=\"onActionIconKeyDown($event)\"\n (focusout)=\"onActionIconFocusOut()\"\n (focus)=\"focusActionIcon()\"\n class=\"eui-menu-item__link-action-icon\"\n [euiDisabled]=\"item.disabled\"\n [attr.aria-label]=\"item.actionIcon?.label\"\n (click)=\"onActionIconClick($event)\">\n <eui-icon-svg [icon]=\"item.actionIcon?.icon\" [fillColor]=\"item.actionIcon?.color\"></eui-icon-svg>\n </button>\n\n @if (hasExpandIcon) {\n <eui-icon-button *ngIf=\"item.children?.length > 0\"\n class=\"eui-menu-item__link-toggle\"\n [icon]=\"item.expanded ? 'chevron-up:sharp': 'chevron-down:sharp'\"\n (buttonClick)=\"onExpandToggle($event)\"\n [ariaLabel]=\"item.expanded ? collapseMenuLabel : expandMenuLabel\"\n euiRounded\n size=\"s\"\n [tabindex]=\"-1\"\n [euiDisabled]=\"item.disabled\"/>\n }\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary);outline-offset:0px}.eui-19 .eui-menu-item .eui-menu-item__content{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link{align-items:center;color:var(--eui-c-text);cursor:pointer;display:flex;font:var(--eui-f-m);gap:var(--eui-s-xs);min-height:var(--eui-s-4xl);padding:0 var(--eui-s-xs) 0 var(--eui-s-m);margin-bottom:calc(-1 * var(--eui-s-2xs));border-top:1px solid var(--eui-c-neutral-bg);text-decoration:none;width:100%}.eui-19 .eui-menu-item__link-start-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link-start-block:empty{display:none}.eui-19 .eui-menu-item__link-content-block{display:flex;flex-direction:column;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label{color:var(--eui-c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label-category{cursor:default;color:var(--eui-c-neutral-darker);font:var(--eui-f-bold);opacity:var(--eui-o-75);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-end-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-primary-bg);text-decoration:none}.eui-19 .eui-menu-item__link--disabled{opacity:var(--eui-o-50);pointer-events:none}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-primary-bg);font:var(--eui-f-m-bold)}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled) .eui-menu-item__link-label{color:var(--eui-c-primary)}.eui-19 .eui-menu-item--expanded{display:flex;flex-direction:column}.eui-19 .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-3xl)}.eui-19 .eui-menu-item .eui-menu-sub .eui-menu-item__link{min-height:var(--eui-s-3xl);padding-left:var(--eui-s-xl);border-top:0}.eui-19 .eui-menu-item--bold>.eui-menu-item__content>.eui-menu-item__link{font:var(--eui-f-m-bold)}.eui-19.eui-t-ds2025 .eui-menu-item__link{margin-bottom:calc(-1 * var(--eui-s-3xs))}.eui-19.eui-t-ds2025 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-neutral-min);text-decoration:none}.eui-19.eui-t-ds2025 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-neutral-min)}\n"] }]
|
|
157
157
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { role: [{
|
|
158
158
|
type: HostBinding,
|
|
159
159
|
args: ['attr.role']
|
|
@@ -703,12 +703,12 @@ class EuiMenuComponent {
|
|
|
703
703
|
isFilterEnabled() {
|
|
704
704
|
return this.filterInput?.nativeElement?.value.length > 0;
|
|
705
705
|
}
|
|
706
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
707
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiMenuComponent, isStandalone: false, selector: "eui-menu", inputs: { items: "items", searchFilterLabel: "searchFilterLabel", externalLinkLabel: "externalLinkLabel", fragmentId: "fragmentId", filterValue: "filterValue", isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], hasCollapsedInitials: ["hasCollapsedInitials", "hasCollapsedInitials", booleanAttribute], hasFilter: ["hasFilter", "hasFilter", booleanAttribute], hasIcons: ["hasIcons", "hasIcons", booleanAttribute], hasTooltip: ["hasTooltip", "hasTooltip", booleanAttribute], hasTooltipOnExpanded: ["hasTooltipOnExpanded", "hasTooltipOnExpanded", booleanAttribute], expandAllItems: ["expandAllItems", "expandAllItems", booleanAttribute], isFlat: ["isFlat", "isFlat", booleanAttribute], hasScrollToItem: ["hasScrollToItem", "hasScrollToItem", booleanAttribute], hasBoldRootLevel: ["hasBoldRootLevel", "hasBoldRootLevel", booleanAttribute] }, outputs: { isClick: "isClick", itemClick: "itemClick", expandToggle: "expandToggle" }, host: { listeners: { "click": "stopPropagation($event)" }, properties: { "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true, read: ElementRef }, { propertyName: "menuItemsComponents", predicate: EuiMenuItemComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (hasFilter) {\n <div class=\"eui-menu-filter\" [class.eui-menu-filter--collapsed]=\"isCollapsed\" (click)=\"onMenuFilterClick($event)\">\n <eui-icon-input>\n <eui-icon-svg icon=\"eui-ecl-search\" fillColor=\"neutral-lighter\" aria-label=\"Search Icon\"></eui-icon-svg>\n <input\n #filterInput\n euiInputText\n [euiClearable]=\"true\"\n (input)=\"onFilter($event)\"\n [placeholder]=\"searchFilterLabel\"\n [attr.aria-label]=\"searchFilterLabel\"\n [value]=\"filterValue\" />\n </eui-icon-input>\n </div>\n}\n\n<ul euiList class=\"eui-menu\" role=\"menubar\" aria-orientation=\"vertical\" tabindex=\"0\" (keydown)=\"onKeydown($event)\">\n @if (items) {\n @for (item of items; track item.id; let index = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: item, index: index }\"></ng-template>\n }\n } @else {\n <span class=\"eui-menu--no-items\">No menu items defined</span>\n }\n</ul>\n\n<!-- describe the recursive template of the menu item -->\n<ng-template #menuItemTemplateRef let-item=\"menuItem\" let-parent=\"parent\" let-i=\"index\">\n <!-- render the menu item-->\n <eui-menu-item\n *ngIf=\"item.filtered\"\n [item]=\"item\"\n [parent]=\"parent\"\n [hasIcon]=\"hasIcons\"\n [hasTooltip]=\"hasTooltip\"\n [hasTooltipOnExpanded]=\"hasTooltipOnExpanded\"\n [isCollapsed]=\"isCollapsed\"\n [hasBoldRootLevel]=\"hasBoldRootLevel\"\n [hasCollapsedInitials]=\"hasCollapsedInitials\"\n (expandToggle)=\"onExpandToggle($event)\"\n (itemClick)=\"onClick($event)\"\n [hasExpandIcon]=\"hasExpandIcon\">\n <!-- if the menu item has children, render the children -->\n @if (shouldRenderChild(item)) {\n <ul euiList class=\"eui-menu eui-menu-sub\" role=\"menu\" [attr.aria-label]=\"item.label\" tabindex=\"-1\">\n @for (child of item.children; track child.id; let childIndex = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: child, index: childIndex, parent: item }\">\n </ng-template>\n }\n </ul>\n }\n </eui-menu-item>\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary-dark);outline-offset:0px}.eui-19 .eui-menu-item .eui-menu-item__content{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link{align-items:center;color:var(--eui-c-text);cursor:pointer;display:flex;font:var(--eui-f-m);gap:var(--eui-s-xs);min-height:var(--eui-s-4xl);padding:0 var(--eui-s-xs) 0 var(--eui-s-m);margin-bottom:calc(-1 * var(--eui-s-2xs));border-top:1px solid var(--eui-c-neutral-bg);text-decoration:none;width:100%}.eui-19 .eui-menu-item__link-start-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link-start-block:empty{display:none}.eui-19 .eui-menu-item__link-content-block{display:flex;flex-direction:column;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label{color:var(--eui-c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label-category{cursor:default;color:var(--eui-c-primary-darker);font:var(--eui-f-bold);opacity:var(--eui-o-75);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-end-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-primary-bg);text-decoration:none}.eui-19 .eui-menu-item__link--disabled{opacity:var(--eui-o-50);pointer-events:none}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-primary-bg);font:var(--eui-f-m-bold)}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled) .eui-menu-item__link-label{color:var(--eui-c-primary-dark)}.eui-19 .eui-menu-item--expanded{display:flex;flex-direction:column}.eui-19 .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-3xl)}.eui-19 .eui-menu-item .eui-menu-sub .eui-menu-item__link{min-height:var(--eui-s-3xl);padding-left:var(--eui-s-xl);border-top:0}.eui-19 .eui-menu-item--bold>.eui-menu-item__content>.eui-menu-item__link{font:var(--eui-f-m-bold)}.eui-19.eui-t-ds2025 .eui-menu-item__link{margin-bottom:calc(-1 * var(--eui-s-3xs))}.eui-19.eui-t-ds2025 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-neutral-min);text-decoration:none}.eui-19.eui-t-ds2025 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-neutral-min)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$1.EuiIconInputComponent, selector: "eui-icon-input", inputs: ["euiIconPositionStart", "euiIconPositionEnd"] }, { kind: "component", type: i3.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i5$1.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["isInvalid"] }, { kind: "component", type: EuiMenuItemComponent, selector: "eui-menu-item", inputs: ["item", "parent", "hasExpandIcon", "hasIcon", "hasTooltip", "hasTooltipOnExpanded", "isCollapsed", "hasCollapsedInitials", "hasBoldRootLevel"], outputs: ["expandToggle", "itemClick"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
706
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
707
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: EuiMenuComponent, isStandalone: false, selector: "eui-menu", inputs: { items: "items", searchFilterLabel: "searchFilterLabel", externalLinkLabel: "externalLinkLabel", fragmentId: "fragmentId", filterValue: "filterValue", isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], hasCollapsedInitials: ["hasCollapsedInitials", "hasCollapsedInitials", booleanAttribute], hasFilter: ["hasFilter", "hasFilter", booleanAttribute], hasIcons: ["hasIcons", "hasIcons", booleanAttribute], hasTooltip: ["hasTooltip", "hasTooltip", booleanAttribute], hasTooltipOnExpanded: ["hasTooltipOnExpanded", "hasTooltipOnExpanded", booleanAttribute], expandAllItems: ["expandAllItems", "expandAllItems", booleanAttribute], isFlat: ["isFlat", "isFlat", booleanAttribute], hasScrollToItem: ["hasScrollToItem", "hasScrollToItem", booleanAttribute], hasBoldRootLevel: ["hasBoldRootLevel", "hasBoldRootLevel", booleanAttribute] }, outputs: { isClick: "isClick", itemClick: "itemClick", expandToggle: "expandToggle" }, host: { listeners: { "click": "stopPropagation($event)" }, properties: { "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true, read: ElementRef }, { propertyName: "menuItemsComponents", predicate: EuiMenuItemComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (hasFilter) {\n <div class=\"eui-menu-filter\" [class.eui-menu-filter--collapsed]=\"isCollapsed\" (click)=\"onMenuFilterClick($event)\">\n <eui-icon-input>\n <eui-icon-svg icon=\"eui-ecl-search\" fillColor=\"neutral-lighter\" aria-label=\"Search Icon\"></eui-icon-svg>\n <input\n #filterInput\n euiInputText\n [euiClearable]=\"true\"\n (input)=\"onFilter($event)\"\n [placeholder]=\"searchFilterLabel\"\n [attr.aria-label]=\"searchFilterLabel\"\n [value]=\"filterValue\" />\n </eui-icon-input>\n </div>\n}\n\n<ul euiList class=\"eui-menu\" role=\"menubar\" aria-orientation=\"vertical\" tabindex=\"0\" (keydown)=\"onKeydown($event)\">\n @if (items) {\n @for (item of items; track item.id; let index = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: item, index: index }\"></ng-template>\n }\n } @else {\n <span class=\"eui-menu--no-items\">No menu items defined</span>\n }\n</ul>\n\n<!-- describe the recursive template of the menu item -->\n<ng-template #menuItemTemplateRef let-item=\"menuItem\" let-parent=\"parent\" let-i=\"index\">\n <!-- render the menu item-->\n <eui-menu-item\n *ngIf=\"item.filtered\"\n [item]=\"item\"\n [parent]=\"parent\"\n [hasIcon]=\"hasIcons\"\n [hasTooltip]=\"hasTooltip\"\n [hasTooltipOnExpanded]=\"hasTooltipOnExpanded\"\n [isCollapsed]=\"isCollapsed\"\n [hasBoldRootLevel]=\"hasBoldRootLevel\"\n [hasCollapsedInitials]=\"hasCollapsedInitials\"\n (expandToggle)=\"onExpandToggle($event)\"\n (itemClick)=\"onClick($event)\"\n [hasExpandIcon]=\"hasExpandIcon\">\n <!-- if the menu item has children, render the children -->\n @if (shouldRenderChild(item)) {\n <ul euiList class=\"eui-menu eui-menu-sub\" role=\"menu\" [attr.aria-label]=\"item.label\" tabindex=\"-1\">\n @for (child of item.children; track child.id; let childIndex = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: child, index: childIndex, parent: item }\">\n </ng-template>\n }\n </ul>\n }\n </eui-menu-item>\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary);outline-offset:0px}.eui-19 .eui-menu-item .eui-menu-item__content{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link{align-items:center;color:var(--eui-c-text);cursor:pointer;display:flex;font:var(--eui-f-m);gap:var(--eui-s-xs);min-height:var(--eui-s-4xl);padding:0 var(--eui-s-xs) 0 var(--eui-s-m);margin-bottom:calc(-1 * var(--eui-s-2xs));border-top:1px solid var(--eui-c-neutral-bg);text-decoration:none;width:100%}.eui-19 .eui-menu-item__link-start-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link-start-block:empty{display:none}.eui-19 .eui-menu-item__link-content-block{display:flex;flex-direction:column;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label{color:var(--eui-c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label-category{cursor:default;color:var(--eui-c-neutral-darker);font:var(--eui-f-bold);opacity:var(--eui-o-75);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-end-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-primary-bg);text-decoration:none}.eui-19 .eui-menu-item__link--disabled{opacity:var(--eui-o-50);pointer-events:none}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-primary-bg);font:var(--eui-f-m-bold)}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled) .eui-menu-item__link-label{color:var(--eui-c-primary)}.eui-19 .eui-menu-item--expanded{display:flex;flex-direction:column}.eui-19 .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-3xl)}.eui-19 .eui-menu-item .eui-menu-sub .eui-menu-item__link{min-height:var(--eui-s-3xl);padding-left:var(--eui-s-xl);border-top:0}.eui-19 .eui-menu-item--bold>.eui-menu-item__content>.eui-menu-item__link{font:var(--eui-f-m-bold)}.eui-19.eui-t-ds2025 .eui-menu-item__link{margin-bottom:calc(-1 * var(--eui-s-3xs))}.eui-19.eui-t-ds2025 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-neutral-min);text-decoration:none}.eui-19.eui-t-ds2025 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-neutral-min)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$1.EuiIconInputComponent, selector: "eui-icon-input", inputs: ["euiIconPositionStart", "euiIconPositionEnd"] }, { kind: "component", type: i3.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i5$1.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["isInvalid"] }, { kind: "component", type: EuiMenuItemComponent, selector: "eui-menu-item", inputs: ["item", "parent", "hasExpandIcon", "hasIcon", "hasTooltip", "hasTooltipOnExpanded", "isCollapsed", "hasCollapsedInitials", "hasBoldRootLevel"], outputs: ["expandToggle", "itemClick"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
708
708
|
}
|
|
709
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
709
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuComponent, decorators: [{
|
|
710
710
|
type: Component,
|
|
711
|
-
args: [{ selector: 'eui-menu', encapsulation: ViewEncapsulation.None, standalone: false, template: "@if (hasFilter) {\n <div class=\"eui-menu-filter\" [class.eui-menu-filter--collapsed]=\"isCollapsed\" (click)=\"onMenuFilterClick($event)\">\n <eui-icon-input>\n <eui-icon-svg icon=\"eui-ecl-search\" fillColor=\"neutral-lighter\" aria-label=\"Search Icon\"></eui-icon-svg>\n <input\n #filterInput\n euiInputText\n [euiClearable]=\"true\"\n (input)=\"onFilter($event)\"\n [placeholder]=\"searchFilterLabel\"\n [attr.aria-label]=\"searchFilterLabel\"\n [value]=\"filterValue\" />\n </eui-icon-input>\n </div>\n}\n\n<ul euiList class=\"eui-menu\" role=\"menubar\" aria-orientation=\"vertical\" tabindex=\"0\" (keydown)=\"onKeydown($event)\">\n @if (items) {\n @for (item of items; track item.id; let index = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: item, index: index }\"></ng-template>\n }\n } @else {\n <span class=\"eui-menu--no-items\">No menu items defined</span>\n }\n</ul>\n\n<!-- describe the recursive template of the menu item -->\n<ng-template #menuItemTemplateRef let-item=\"menuItem\" let-parent=\"parent\" let-i=\"index\">\n <!-- render the menu item-->\n <eui-menu-item\n *ngIf=\"item.filtered\"\n [item]=\"item\"\n [parent]=\"parent\"\n [hasIcon]=\"hasIcons\"\n [hasTooltip]=\"hasTooltip\"\n [hasTooltipOnExpanded]=\"hasTooltipOnExpanded\"\n [isCollapsed]=\"isCollapsed\"\n [hasBoldRootLevel]=\"hasBoldRootLevel\"\n [hasCollapsedInitials]=\"hasCollapsedInitials\"\n (expandToggle)=\"onExpandToggle($event)\"\n (itemClick)=\"onClick($event)\"\n [hasExpandIcon]=\"hasExpandIcon\">\n <!-- if the menu item has children, render the children -->\n @if (shouldRenderChild(item)) {\n <ul euiList class=\"eui-menu eui-menu-sub\" role=\"menu\" [attr.aria-label]=\"item.label\" tabindex=\"-1\">\n @for (child of item.children; track child.id; let childIndex = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: child, index: childIndex, parent: item }\">\n </ng-template>\n }\n </ul>\n }\n </eui-menu-item>\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary
|
|
711
|
+
args: [{ selector: 'eui-menu', encapsulation: ViewEncapsulation.None, standalone: false, template: "@if (hasFilter) {\n <div class=\"eui-menu-filter\" [class.eui-menu-filter--collapsed]=\"isCollapsed\" (click)=\"onMenuFilterClick($event)\">\n <eui-icon-input>\n <eui-icon-svg icon=\"eui-ecl-search\" fillColor=\"neutral-lighter\" aria-label=\"Search Icon\"></eui-icon-svg>\n <input\n #filterInput\n euiInputText\n [euiClearable]=\"true\"\n (input)=\"onFilter($event)\"\n [placeholder]=\"searchFilterLabel\"\n [attr.aria-label]=\"searchFilterLabel\"\n [value]=\"filterValue\" />\n </eui-icon-input>\n </div>\n}\n\n<ul euiList class=\"eui-menu\" role=\"menubar\" aria-orientation=\"vertical\" tabindex=\"0\" (keydown)=\"onKeydown($event)\">\n @if (items) {\n @for (item of items; track item.id; let index = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: item, index: index }\"></ng-template>\n }\n } @else {\n <span class=\"eui-menu--no-items\">No menu items defined</span>\n }\n</ul>\n\n<!-- describe the recursive template of the menu item -->\n<ng-template #menuItemTemplateRef let-item=\"menuItem\" let-parent=\"parent\" let-i=\"index\">\n <!-- render the menu item-->\n <eui-menu-item\n *ngIf=\"item.filtered\"\n [item]=\"item\"\n [parent]=\"parent\"\n [hasIcon]=\"hasIcons\"\n [hasTooltip]=\"hasTooltip\"\n [hasTooltipOnExpanded]=\"hasTooltipOnExpanded\"\n [isCollapsed]=\"isCollapsed\"\n [hasBoldRootLevel]=\"hasBoldRootLevel\"\n [hasCollapsedInitials]=\"hasCollapsedInitials\"\n (expandToggle)=\"onExpandToggle($event)\"\n (itemClick)=\"onClick($event)\"\n [hasExpandIcon]=\"hasExpandIcon\">\n <!-- if the menu item has children, render the children -->\n @if (shouldRenderChild(item)) {\n <ul euiList class=\"eui-menu eui-menu-sub\" role=\"menu\" [attr.aria-label]=\"item.label\" tabindex=\"-1\">\n @for (child of item.children; track child.id; let childIndex = $index) {\n <ng-template [ngTemplateOutlet]=\"menuItemTemplateRef\" [ngTemplateOutletContext]=\"{ menuItem: child, index: childIndex, parent: item }\">\n </ng-template>\n }\n </ul>\n }\n </eui-menu-item>\n</ng-template>\n", styles: [".eui-19 .eui-menu{display:flex;flex-direction:column;gap:0;list-style:none;margin-block-start:0;margin-block-end:0;margin:0;padding:0;width:100%}.eui-19 .eui-menu:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-menu--collapsed .eui-menu-filter{transition:none;visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item__link-start-block{gap:0}.eui-19 .eui-menu--collapsed .eui-menu-item__link-content-block,.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block{visibility:hidden}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-action-icon{display:none}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-dotted-badge{position:absolute;top:var(--eui-s-2xs);right:var(--eui-s-2xs);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-end-block .eui-menu-item__link-toggle{display:inherit;position:absolute;right:calc(-1 * var(--eui-s-xs));transform:scale(.75);visibility:visible}.eui-19 .eui-menu--collapsed .eui-menu-item__link-initials{display:flex;background-color:var(--eui-c-neutral-bg-light);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-radius:var(--eui-s-xs);font:var(--eui-f-s-bold);justify-content:center;margin-left:calc(-1 * var(--eui-s-2xs));min-width:var(--eui-s-2xl)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded:first-child{border-bottom:none;padding-bottom:0}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-m)}.eui-19 .eui-menu--collapsed .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-s)}.eui-19 .eui-menu--no-items{color:var(--eui-c-neutral-lighter);text-align:center}.eui-19 .eui-menu-filter{display:flex;padding:var(--eui-s-m);position:relative;width:100%}.eui-19 .eui-menu-filter--collapsed{padding:0;height:0}.eui-19 .eui-menu-filter--collapsed .eui-icon-svg{display:none}.eui-19 .eui-menu-item{display:flex;position:relative;width:100%;border:var(--eui-bw-xs) solid transparent}.eui-19 .eui-menu-item:focus-visible>.eui-menu-item__content{outline:1px solid var(--eui-c-primary);outline-offset:0px}.eui-19 .eui-menu-item .eui-menu-item__content{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link{align-items:center;color:var(--eui-c-text);cursor:pointer;display:flex;font:var(--eui-f-m);gap:var(--eui-s-xs);min-height:var(--eui-s-4xl);padding:0 var(--eui-s-xs) 0 var(--eui-s-m);margin-bottom:calc(-1 * var(--eui-s-2xs));border-top:1px solid var(--eui-c-neutral-bg);text-decoration:none;width:100%}.eui-19 .eui-menu-item__link-start-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link-start-block:empty{display:none}.eui-19 .eui-menu-item__link-content-block{display:flex;flex-direction:column;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container{align-items:center;display:flex;position:relative;width:100%}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label{color:var(--eui-c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-content-block .eui-menu-item__link-label-container .eui-menu-item__link-label-category{cursor:default;color:var(--eui-c-neutral-darker);font:var(--eui-f-bold);opacity:var(--eui-o-75);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-19 .eui-menu-item__link-end-block{align-items:center;display:flex;gap:var(--eui-s-xs)}.eui-19 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-primary-bg);text-decoration:none}.eui-19 .eui-menu-item__link--disabled{opacity:var(--eui-o-50);pointer-events:none}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-primary-bg);font:var(--eui-f-m-bold)}.eui-19 .eui-menu-item__link--active:not(.eui-menu-item--disabled) .eui-menu-item__link-label{color:var(--eui-c-primary)}.eui-19 .eui-menu-item--expanded{display:flex;flex-direction:column}.eui-19 .eui-menu-item--expanded .eui-menu-item--expanded .eui-menu-sub .eui-menu-item__link{padding-left:var(--eui-s-3xl)}.eui-19 .eui-menu-item .eui-menu-sub .eui-menu-item__link{min-height:var(--eui-s-3xl);padding-left:var(--eui-s-xl);border-top:0}.eui-19 .eui-menu-item--bold>.eui-menu-item__content>.eui-menu-item__link{font:var(--eui-f-m-bold)}.eui-19.eui-t-ds2025 .eui-menu-item__link{margin-bottom:calc(-1 * var(--eui-s-3xs))}.eui-19.eui-t-ds2025 .eui-menu-item__link:hover:not(.eui-menu-item--disabled):not(.eui-menu-item__link-category){background-color:var(--eui-c-neutral-min);text-decoration:none}.eui-19.eui-t-ds2025 .eui-menu-item__link--active:not(.eui-menu-item--disabled){background-color:var(--eui-c-neutral-min)}\n"] }]
|
|
712
712
|
}], ctorParameters: () => [{ type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i0.ChangeDetectorRef }], propDecorators: { menuItemsComponents: [{
|
|
713
713
|
type: ViewChildren,
|
|
714
714
|
args: [EuiMenuItemComponent]
|
|
@@ -770,8 +770,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
770
770
|
}] } });
|
|
771
771
|
|
|
772
772
|
class EuiMenuModule {
|
|
773
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
774
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.
|
|
773
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
774
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuModule, declarations: [EuiMenuComponent, EuiMenuItemComponent], imports: [CommonModule,
|
|
775
775
|
RouterModule,
|
|
776
776
|
EuiIconInputModule,
|
|
777
777
|
EuiIconModule,
|
|
@@ -781,7 +781,7 @@ class EuiMenuModule {
|
|
|
781
781
|
EuiInputTextModule,
|
|
782
782
|
EuiTooltipDirectiveModule,
|
|
783
783
|
EuiBadgeModule], exports: [EuiMenuComponent] }); }
|
|
784
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.
|
|
784
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuModule, imports: [CommonModule,
|
|
785
785
|
RouterModule,
|
|
786
786
|
EuiIconInputModule,
|
|
787
787
|
EuiIconModule,
|
|
@@ -792,7 +792,7 @@ class EuiMenuModule {
|
|
|
792
792
|
EuiTooltipDirectiveModule,
|
|
793
793
|
EuiBadgeModule] }); }
|
|
794
794
|
}
|
|
795
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
795
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: EuiMenuModule, decorators: [{
|
|
796
796
|
type: NgModule,
|
|
797
797
|
args: [{
|
|
798
798
|
imports: [
|