@eui/components 19.0.2-snapshot-1734646355358 → 19.0.2-snapshot-1734778610938
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/docs/components/EuiAppBreadcrumbComponent.html +4 -4
- package/docs/components/EuiAppComponent.html +4 -4
- package/docs/components/EuiAppFooterComponent.html +4 -4
- package/docs/components/EuiAppHeaderComponent.html +4 -4
- package/docs/components/EuiAppToolbarComponent.html +4 -4
- package/docs/components/EuiAppTopMessageComponent.html +4 -4
- package/docs/components/EuiAvatarBadgeComponent.html +8 -4
- package/docs/components/EuiAvatarComponent.html +0 -69
- package/docs/components/EuiAvatarIconComponent.html +8 -4
- package/docs/components/EuiAvatarImageComponent.html +4 -0
- package/docs/components/EuiAvatarListComponent.html +6 -6
- package/docs/components/EuiAvatarTextComponent.html +8 -4
- package/docs/components/EuiBadgeComponent.html +0 -151
- package/docs/components/EuiBlockContentComponent.html +3 -3
- package/docs/components/EuiBlockDocumentComponent.html +1 -1
- package/docs/components/EuiButtonGroupComponent.html +1 -1
- package/docs/components/EuiChipGroupComponent.html +5 -5
- package/docs/components/EuiDashboardButtonComponent.html +2 -2
- package/docs/components/EuiDisableContentComponent.html +1 -1
- package/docs/components/EuiIconToggleComponent.html +1 -1
- package/docs/components/EuiNavbarComponent.html +1 -1
- package/docs/components/EuiSelectComponent.html +1 -1
- package/docs/components/EuiSplitButtonComponent.html +1 -1
- package/docs/dependencies.html +2 -2
- package/docs/js/menu-wc.js +21 -21
- package/docs/js/menu-wc_es5.js +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/eui-avatar/avatar-badge/avatar-badge.component.d.ts.map +1 -1
- package/eui-avatar/avatar-icon/avatar-icon.component.d.ts.map +1 -1
- package/eui-avatar/avatar-image/avatar-image.component.d.ts.map +1 -1
- package/eui-avatar/{eui-avatar-list.component.d.ts → avatar-list/avatar-list.component.d.ts} +1 -1
- package/eui-avatar/avatar-list/avatar-list.component.d.ts.map +1 -0
- package/eui-avatar/avatar-text/avatar-text.component.d.ts.map +1 -1
- package/eui-avatar/eui-avatar.component.d.ts +1 -2
- package/eui-avatar/eui-avatar.component.d.ts.map +1 -1
- package/eui-avatar/eui-avatar.module.d.ts +1 -1
- package/eui-avatar/index.d.ts +1 -1
- package/eui-avatar/index.d.ts.map +1 -1
- package/eui-badge/eui-badge.component.d.ts +6 -7
- package/eui-badge/eui-badge.component.d.ts.map +1 -1
- package/eui-block-content/eui-block-content.component.d.ts.map +1 -1
- package/eui-block-document/eui-block-document.component.d.ts.map +1 -1
- package/eui-button-group/eui-button-group.component.d.ts.map +1 -1
- package/eui-icon-toggle/eui-icon-toggle.component.d.ts.map +1 -1
- package/eui-select/eui-select.component.d.ts.map +1 -1
- package/fesm2022/eui-components-eui-alert.mjs +2 -2
- package/fesm2022/eui-components-eui-alert.mjs.map +1 -1
- package/fesm2022/eui-components-eui-avatar.mjs +26 -28
- package/fesm2022/eui-components-eui-avatar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-badge.mjs +16 -16
- package/fesm2022/eui-components-eui-badge.mjs.map +1 -1
- package/fesm2022/eui-components-eui-block-content.mjs +2 -2
- package/fesm2022/eui-components-eui-block-content.mjs.map +1 -1
- package/fesm2022/eui-components-eui-block-document.mjs.map +1 -1
- package/fesm2022/eui-components-eui-breadcrumb.mjs +2 -2
- package/fesm2022/eui-components-eui-breadcrumb.mjs.map +1 -1
- package/fesm2022/eui-components-eui-button-group.mjs.map +1 -1
- package/fesm2022/eui-components-eui-button.mjs +2 -2
- package/fesm2022/eui-components-eui-chip-group.mjs +2 -2
- package/fesm2022/eui-components-eui-chip-group.mjs.map +1 -1
- package/fesm2022/eui-components-eui-chip.mjs +2 -2
- package/fesm2022/eui-components-eui-chip.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dashboard-button.mjs +3 -4
- package/fesm2022/eui-components-eui-dashboard-button.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dialog.mjs +4 -4
- package/fesm2022/eui-components-eui-dialog.mjs.map +1 -1
- package/fesm2022/eui-components-eui-disable-content.mjs.map +1 -1
- package/fesm2022/eui-components-eui-discussion-thread.mjs +2 -2
- package/fesm2022/eui-components-eui-discussion-thread.mjs.map +1 -1
- package/fesm2022/eui-components-eui-feedback-message.mjs +2 -2
- package/fesm2022/eui-components-eui-feedback-message.mjs.map +1 -1
- package/fesm2022/eui-components-eui-fieldset.mjs +2 -2
- package/fesm2022/eui-components-eui-fieldset.mjs.map +1 -1
- package/fesm2022/eui-components-eui-icon-toggle.mjs +2 -2
- package/fesm2022/eui-components-eui-icon-toggle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-label.mjs +2 -2
- package/fesm2022/eui-components-eui-menu.mjs +4 -4
- package/fesm2022/eui-components-eui-menu.mjs.map +1 -1
- package/fesm2022/eui-components-eui-navbar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-paginator.mjs +2 -2
- package/fesm2022/eui-components-eui-paginator.mjs.map +1 -1
- package/fesm2022/eui-components-eui-progress-circle.mjs +2 -2
- package/fesm2022/eui-components-eui-progress-circle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-select.mjs.map +1 -1
- package/fesm2022/eui-components-eui-split-button.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tabs.mjs +4 -4
- package/fesm2022/eui-components-eui-tabs.mjs.map +1 -1
- package/fesm2022/eui-components-layout.mjs +4 -4
- package/fesm2022/eui-components-layout.mjs.map +1 -1
- package/layout/eui-app/eui-app-toolbar/toolbar.component.d.ts.map +1 -1
- package/layout/eui-app/eui-app-top-message/top-message.component.d.ts.map +1 -1
- package/layout/eui-app/eui-app.component.d.ts.map +1 -1
- package/package.json +7 -7
- package/eui-avatar/eui-avatar-list.component.d.ts.map +0 -1
|
@@ -48,7 +48,7 @@ class EuiFieldsetComponent {
|
|
|
48
48
|
}
|
|
49
49
|
}
|
|
50
50
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiFieldsetComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
51
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiFieldsetComponent, isStandalone: false, selector: "eui-fieldset", inputs: { e2eAttr: "e2eAttr", id: "id", label: "label", iconClass: "iconClass", iconSvgName: "iconSvgName", iconSvgFillColor: "iconSvgFillColor", hasDefaultIcon: ["hasDefaultIcon", "hasDefaultIcon", booleanAttribute], isExpandable: ["isExpandable", "isExpandable", booleanAttribute], isExpanded: ["isExpanded", "isExpanded", booleanAttribute], isLarge: ["isLarge", "isLarge", booleanAttribute], isFirst: ["isFirst", "isFirst", booleanAttribute] }, outputs: { expand: "expand" }, host: { properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "templates", predicate: EuiTemplateDirective }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiHighlighted", "euiHighlighted"] }], ngImport: i0, template: "<div class=\"eui-fieldset__container\">\n <button *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n @if (iconSvgName) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\"/>\n </div>\n }\n @if (hasDefaultIcon) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\"/>\n </div>\n }\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n <eui-icon-button-expander *ngIf=\"isExpandable\"\n [isExpanded]=\"isExpanded\"\n isDirectionForward\n fillColor=\"neutral\">\n </eui-icon-button-expander>\n </div>\n </button>\n <div id=\"fieldset-content\" *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n @if (lazyContent) {\n <ng-template [ngTemplateOutlet]=\"lazyContent\"></ng-template>\n } @else {\n <ng-content></ng-content>\n }\n </div>\n</div>\n", styles: [".eui-19 :host.eui-fieldset{--_color: var(--eui-fieldset-
|
|
51
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiFieldsetComponent, isStandalone: false, selector: "eui-fieldset", inputs: { e2eAttr: "e2eAttr", id: "id", label: "label", iconClass: "iconClass", iconSvgName: "iconSvgName", iconSvgFillColor: "iconSvgFillColor", hasDefaultIcon: ["hasDefaultIcon", "hasDefaultIcon", booleanAttribute], isExpandable: ["isExpandable", "isExpandable", booleanAttribute], isExpanded: ["isExpanded", "isExpanded", booleanAttribute], isLarge: ["isLarge", "isLarge", booleanAttribute], isFirst: ["isFirst", "isFirst", booleanAttribute] }, outputs: { expand: "expand" }, host: { properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "templates", predicate: EuiTemplateDirective }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiHighlighted", "euiHighlighted"] }], ngImport: i0, template: "<div class=\"eui-fieldset__container\">\n <button *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n @if (iconSvgName) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\"/>\n </div>\n }\n @if (hasDefaultIcon) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\"/>\n </div>\n }\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n <eui-icon-button-expander *ngIf=\"isExpandable\"\n [isExpanded]=\"isExpanded\"\n isDirectionForward\n fillColor=\"neutral\">\n </eui-icon-button-expander>\n </div>\n </button>\n <div id=\"fieldset-content\" *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n @if (lazyContent) {\n <ng-template [ngTemplateOutlet]=\"lazyContent\"></ng-template>\n } @else {\n <ng-content></ng-content>\n }\n </div>\n</div>\n", styles: [".eui-19 :host.eui-fieldset{--_color: var(--eui-c-neutral)}.eui-19 :host.eui-fieldset--primary{--_color: var(--eui-c-primary-dark)}.eui-19 :host.eui-fieldset--secondary{--_color: var(--eui-c-neutral)}.eui-19 :host.eui-fieldset--info{--_color: var(--eui-c-info-dark)}.eui-19 :host.eui-fieldset--success{--_color: var(--eui-c-success-dark)}.eui-19 :host.eui-fieldset--warning{--_color: var(--eui-c-warning-dark)}.eui-19 :host.eui-fieldset--danger{--_color: var(--eui-c-danger-dark)}.eui-19 :host.eui-fieldset{display:block;position:relative;width:100%}.eui-19 :host.eui-fieldset .eui-fieldset__header{align-items:center;background-color:initial;border:var(--eui-bw-none);border-bottom:1px solid var(--eui-c-neutral-lightest);color:var(--_color);display:flex;gap:var(--eui-s-m);margin-bottom:var(--eui-s-m);min-height:var(--eui-s-4xl);outline:none;padding:0;width:100%}.eui-19 :host.eui-fieldset .eui-fieldset__header-icon{align-items:center;display:inline-flex;font-size:var(--eui-is-m);margin-right:var(--eui-s-xs)}.eui-19 :host.eui-fieldset .eui-fieldset__header-label{align-items:center;display:inline-flex;font:var(--eui-f-bold);text-align:left}.eui-19 :host.eui-fieldset .eui-fieldset__header-label.eui-fieldset__header-label--large{font:var(--eui-f-l)}.eui-19 :host.eui-fieldset .eui-fieldset__header-right-content{align-items:center;display:flex;gap:var(--eui-s-s);margin-left:auto}.eui-19 :host.eui-fieldset--first{margin-top:var(--eui-s-s)}.eui-19 :host.eui-fieldset--size-l>.eui-fieldset__header>.eui-fieldset__header-label{text-transform:none;font:var(--eui-f-l)}.eui-19 :host.eui-fieldset--hightlighted{background-color:var(--eui-c-bg);z-index:var(--eui-zi-highlighted)}.eui-19 :host.eui-fieldset--expandable .eui-fieldset__header{cursor:pointer;padding-bottom:var(--eui-s-xs)}.eui-19 :host.eui-fieldset:not(:host.eui-fieldset--has-icon-color) .eui-icon-svg svg{fill:var(--_color);color:var(--_color)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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.EuiIconButtonExpanderComponent, selector: "eui-icon-button-expander", inputs: ["fillColor", "size", "ariaLabel", "isExpanded", "isDirectionForward", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i5.EuiIconStateComponent, selector: "eui-icon-state", inputs: ["size", "ariaLabel"] }] }); }
|
|
52
52
|
}
|
|
53
53
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiFieldsetComponent, decorators: [{
|
|
54
54
|
type: Component,
|
|
@@ -67,7 +67,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
67
67
|
'euiHighlighted',
|
|
68
68
|
],
|
|
69
69
|
},
|
|
70
|
-
], template: "<div class=\"eui-fieldset__container\">\n <button *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n @if (iconSvgName) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\"/>\n </div>\n }\n @if (hasDefaultIcon) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\"/>\n </div>\n }\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n <eui-icon-button-expander *ngIf=\"isExpandable\"\n [isExpanded]=\"isExpanded\"\n isDirectionForward\n fillColor=\"neutral\">\n </eui-icon-button-expander>\n </div>\n </button>\n <div id=\"fieldset-content\" *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n @if (lazyContent) {\n <ng-template [ngTemplateOutlet]=\"lazyContent\"></ng-template>\n } @else {\n <ng-content></ng-content>\n }\n </div>\n</div>\n", styles: [".eui-19 :host.eui-fieldset{--_color: var(--eui-fieldset-
|
|
70
|
+
], template: "<div class=\"eui-fieldset__container\">\n <button *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n @if (iconSvgName) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\"/>\n </div>\n }\n @if (hasDefaultIcon) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\"/>\n </div>\n }\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n <eui-icon-button-expander *ngIf=\"isExpandable\"\n [isExpanded]=\"isExpanded\"\n isDirectionForward\n fillColor=\"neutral\">\n </eui-icon-button-expander>\n </div>\n </button>\n <div id=\"fieldset-content\" *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n @if (lazyContent) {\n <ng-template [ngTemplateOutlet]=\"lazyContent\"></ng-template>\n } @else {\n <ng-content></ng-content>\n }\n </div>\n</div>\n", styles: [".eui-19 :host.eui-fieldset{--_color: var(--eui-c-neutral)}.eui-19 :host.eui-fieldset--primary{--_color: var(--eui-c-primary-dark)}.eui-19 :host.eui-fieldset--secondary{--_color: var(--eui-c-neutral)}.eui-19 :host.eui-fieldset--info{--_color: var(--eui-c-info-dark)}.eui-19 :host.eui-fieldset--success{--_color: var(--eui-c-success-dark)}.eui-19 :host.eui-fieldset--warning{--_color: var(--eui-c-warning-dark)}.eui-19 :host.eui-fieldset--danger{--_color: var(--eui-c-danger-dark)}.eui-19 :host.eui-fieldset{display:block;position:relative;width:100%}.eui-19 :host.eui-fieldset .eui-fieldset__header{align-items:center;background-color:initial;border:var(--eui-bw-none);border-bottom:1px solid var(--eui-c-neutral-lightest);color:var(--_color);display:flex;gap:var(--eui-s-m);margin-bottom:var(--eui-s-m);min-height:var(--eui-s-4xl);outline:none;padding:0;width:100%}.eui-19 :host.eui-fieldset .eui-fieldset__header-icon{align-items:center;display:inline-flex;font-size:var(--eui-is-m);margin-right:var(--eui-s-xs)}.eui-19 :host.eui-fieldset .eui-fieldset__header-label{align-items:center;display:inline-flex;font:var(--eui-f-bold);text-align:left}.eui-19 :host.eui-fieldset .eui-fieldset__header-label.eui-fieldset__header-label--large{font:var(--eui-f-l)}.eui-19 :host.eui-fieldset .eui-fieldset__header-right-content{align-items:center;display:flex;gap:var(--eui-s-s);margin-left:auto}.eui-19 :host.eui-fieldset--first{margin-top:var(--eui-s-s)}.eui-19 :host.eui-fieldset--size-l>.eui-fieldset__header>.eui-fieldset__header-label{text-transform:none;font:var(--eui-f-l)}.eui-19 :host.eui-fieldset--hightlighted{background-color:var(--eui-c-bg);z-index:var(--eui-zi-highlighted)}.eui-19 :host.eui-fieldset--expandable .eui-fieldset__header{cursor:pointer;padding-bottom:var(--eui-s-xs)}.eui-19 :host.eui-fieldset:not(:host.eui-fieldset--has-icon-color) .eui-icon-svg svg{fill:var(--_color);color:var(--_color)}\n"] }]
|
|
71
71
|
}], ctorParameters: () => [{ type: i1.BaseStatesDirective }], propDecorators: { cssClasses: [{
|
|
72
72
|
type: HostBinding,
|
|
73
73
|
args: ['class']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-components-eui-fieldset.mjs","sources":["../../eui-fieldset/eui-fieldset.component.ts","../../eui-fieldset/eui-fieldset.component.html","../../eui-fieldset/eui-fieldset.module.ts","../../eui-fieldset/eui-components-eui-fieldset.ts"],"sourcesContent":["import {\n AfterContentInit,\n Component,\n ContentChildren,\n Directive,\n EventEmitter,\n HostBinding,\n Input,\n Output,\n QueryList,\n TemplateRef,\n booleanAttribute,\n} from '@angular/core';\nimport { EuiTemplateDirective } from '@eui/components/directives';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\n\n@Component({\n selector: 'eui-fieldset',\n templateUrl: './eui-fieldset.component.html',\n styleUrls: ['./styles/_index.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 'euiHighlighted',\n ],\n },\n ],\n})\nexport class EuiFieldsetComponent implements AfterContentInit {\n @HostBinding('class')\n public get cssClasses(): string {\n return [\n this.baseStatesDirective.getCssClasses('eui-fieldset'),\n this.isFirst ? 'eui-fieldset--first' : '',\n this.isExpandable ? 'eui-fieldset--expandable' : '',\n this.iconSvgFillColor ? 'eui-fieldset--has-icon-color': '',\n ].join(' ').trim();\n }\n\n @HostBinding('attr.data-e2e') @Input() e2eAttr = 'eui-fieldset';\n\n @Input() id: string;\n @Input() label: string;\n @Input() iconClass: string;\n @Input() iconSvgName: string;\n @Input() iconSvgFillColor: string;\n\n @Input({ transform: booleanAttribute }) hasDefaultIcon = false;\n @Input({ transform: booleanAttribute }) isExpandable = false;\n @Input({ transform: booleanAttribute }) isExpanded = true;\n @Input({ transform: booleanAttribute }) isLarge = false;\n @Input({ transform: booleanAttribute }) isFirst = false;\n\n @Output() expand: EventEmitter<string> = new EventEmitter();\n\n public expandMenuLabel = 'Expand ';\n public collapseMenuLabel = 'Collapse ';\n public iconSvgType = 'eui-info';\n\n protected lazyContent: TemplateRef<HTMLElement>;\n @ContentChildren(EuiTemplateDirective) templates: QueryList<EuiTemplateDirective>;\n\n constructor(public baseStatesDirective: BaseStatesDirective) {}\n\n ngAfterContentInit(): void {\n const lazyTemplate = this.templates.filter(t => t.name === 'eui-fieldset-content')[0];\n if (lazyTemplate) {\n this.lazyContent = lazyTemplate.template;\n }\n }\n\n onToggle(): void {\n if (this.isExpandable) {\n this.isExpanded = !this.isExpanded;\n this.expand.emit(this.id);\n }\n }\n}\n\n/* eslint-disable */\n@Directive({selector: 'euiFieldsetLabelRightContent', standalone: false,})\nexport class EuiFieldsetLabelRightContentTagDirective {\n}\n@Directive({selector: 'euiFieldsetLabelExtraContent', standalone: false,})\nexport class EuiFieldsetLabelExtraContentTagDirective {\n}\n/* eslint-enable */\n","<div class=\"eui-fieldset__container\">\n <button *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n @if (iconSvgName) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\"/>\n </div>\n }\n @if (hasDefaultIcon) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\"/>\n </div>\n }\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n <eui-icon-button-expander *ngIf=\"isExpandable\"\n [isExpanded]=\"isExpanded\"\n isDirectionForward\n fillColor=\"neutral\">\n </eui-icon-button-expander>\n </div>\n </button>\n <div id=\"fieldset-content\" *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n @if (lazyContent) {\n <ng-template [ngTemplateOutlet]=\"lazyContent\"></ng-template>\n } @else {\n <ng-content></ng-content>\n }\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiIconButtonExpanderModule } from '@eui/components/eui-icon-button-expander';\nimport { BaseStatesDirective } from '@eui/components/shared';\n\nimport {\n EuiFieldsetComponent,\n EuiFieldsetLabelExtraContentTagDirective,\n EuiFieldsetLabelRightContentTagDirective,\n} from './eui-fieldset.component';\nimport { EuiIconStateModule } from '@eui/components/eui-icon-state';\n@NgModule({\n imports: [CommonModule, EuiButtonModule, EuiIconModule, EuiIconButtonExpanderModule, EuiIconStateModule, BaseStatesDirective],\n exports: [EuiFieldsetComponent, EuiFieldsetLabelRightContentTagDirective, EuiFieldsetLabelExtraContentTagDirective],\n declarations: [EuiFieldsetComponent, EuiFieldsetLabelRightContentTagDirective, EuiFieldsetLabelExtraContentTagDirective],\n})\nexport class EuiFieldsetModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"eui-components-eui-fieldset.mjs","sources":["../../eui-fieldset/eui-fieldset.component.ts","../../eui-fieldset/eui-fieldset.component.html","../../eui-fieldset/eui-fieldset.module.ts","../../eui-fieldset/eui-components-eui-fieldset.ts"],"sourcesContent":["import {\n AfterContentInit,\n Component,\n ContentChildren,\n Directive,\n EventEmitter,\n HostBinding,\n Input,\n Output,\n QueryList,\n TemplateRef,\n booleanAttribute,\n} from '@angular/core';\nimport { EuiTemplateDirective } from '@eui/components/directives';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\n\n@Component({\n selector: 'eui-fieldset',\n templateUrl: './eui-fieldset.component.html',\n styleUrls: ['./styles/_index.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 'euiHighlighted',\n ],\n },\n ],\n})\nexport class EuiFieldsetComponent implements AfterContentInit {\n @HostBinding('class')\n public get cssClasses(): string {\n return [\n this.baseStatesDirective.getCssClasses('eui-fieldset'),\n this.isFirst ? 'eui-fieldset--first' : '',\n this.isExpandable ? 'eui-fieldset--expandable' : '',\n this.iconSvgFillColor ? 'eui-fieldset--has-icon-color': '',\n ].join(' ').trim();\n }\n\n @HostBinding('attr.data-e2e') @Input() e2eAttr = 'eui-fieldset';\n\n @Input() id: string;\n @Input() label: string;\n @Input() iconClass: string;\n @Input() iconSvgName: string;\n @Input() iconSvgFillColor: string;\n\n @Input({ transform: booleanAttribute }) hasDefaultIcon = false;\n @Input({ transform: booleanAttribute }) isExpandable = false;\n @Input({ transform: booleanAttribute }) isExpanded = true;\n @Input({ transform: booleanAttribute }) isLarge = false;\n @Input({ transform: booleanAttribute }) isFirst = false;\n\n @Output() expand: EventEmitter<string> = new EventEmitter();\n\n public expandMenuLabel = 'Expand ';\n public collapseMenuLabel = 'Collapse ';\n public iconSvgType = 'eui-info';\n\n protected lazyContent: TemplateRef<HTMLElement>;\n @ContentChildren(EuiTemplateDirective) templates: QueryList<EuiTemplateDirective>;\n\n constructor(public baseStatesDirective: BaseStatesDirective) {}\n\n ngAfterContentInit(): void {\n const lazyTemplate = this.templates.filter(t => t.name === 'eui-fieldset-content')[0];\n if (lazyTemplate) {\n this.lazyContent = lazyTemplate.template;\n }\n }\n\n onToggle(): void {\n if (this.isExpandable) {\n this.isExpanded = !this.isExpanded;\n this.expand.emit(this.id);\n }\n }\n}\n\n/* eslint-disable */\n@Directive({selector: 'euiFieldsetLabelRightContent', standalone: false,})\nexport class EuiFieldsetLabelRightContentTagDirective {\n}\n@Directive({selector: 'euiFieldsetLabelExtraContent', standalone: false,})\nexport class EuiFieldsetLabelExtraContentTagDirective {\n}\n/* eslint-enable */\n","<div class=\"eui-fieldset__container\">\n <button *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n @if (iconSvgName) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\"/>\n </div>\n }\n @if (hasDefaultIcon) {\n <div class=\"eui-fieldset__header-icon\">\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\"/>\n </div>\n }\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n <eui-icon-button-expander *ngIf=\"isExpandable\"\n [isExpanded]=\"isExpanded\"\n isDirectionForward\n fillColor=\"neutral\">\n </eui-icon-button-expander>\n </div>\n </button>\n <div id=\"fieldset-content\" *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n @if (lazyContent) {\n <ng-template [ngTemplateOutlet]=\"lazyContent\"></ng-template>\n } @else {\n <ng-content></ng-content>\n }\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiIconButtonExpanderModule } from '@eui/components/eui-icon-button-expander';\nimport { BaseStatesDirective } from '@eui/components/shared';\n\nimport {\n EuiFieldsetComponent,\n EuiFieldsetLabelExtraContentTagDirective,\n EuiFieldsetLabelRightContentTagDirective,\n} from './eui-fieldset.component';\nimport { EuiIconStateModule } from '@eui/components/eui-icon-state';\n@NgModule({\n imports: [CommonModule, EuiButtonModule, EuiIconModule, EuiIconButtonExpanderModule, EuiIconStateModule, BaseStatesDirective],\n exports: [EuiFieldsetComponent, EuiFieldsetLabelRightContentTagDirective, EuiFieldsetLabelExtraContentTagDirective],\n declarations: [EuiFieldsetComponent, EuiFieldsetLabelRightContentTagDirective, EuiFieldsetLabelExtraContentTagDirective],\n})\nexport class EuiFieldsetModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;MAuCa,oBAAoB,CAAA;AAC7B,IAAA,IACW,UAAU,GAAA;QACjB,OAAO;AACH,YAAA,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,cAAc,CAAC;YACtD,IAAI,CAAC,OAAO,GAAG,qBAAqB,GAAG,EAAE;YACzC,IAAI,CAAC,YAAY,GAAG,0BAA0B,GAAG,EAAE;YACnD,IAAI,CAAC,gBAAgB,GAAG,8BAA8B,GAAE,EAAE;AAC7D,SAAA,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;;AA0BtB,IAAA,WAAA,CAAmB,mBAAwC,EAAA;QAAxC,IAAmB,CAAA,mBAAA,GAAnB,mBAAmB;QAvBC,IAAO,CAAA,OAAA,GAAG,cAAc;QAQvB,IAAc,CAAA,cAAA,GAAG,KAAK;QACtB,IAAY,CAAA,YAAA,GAAG,KAAK;QACpB,IAAU,CAAA,UAAA,GAAG,IAAI;QACjB,IAAO,CAAA,OAAA,GAAG,KAAK;QACf,IAAO,CAAA,OAAA,GAAG,KAAK;AAE7C,QAAA,IAAA,CAAA,MAAM,GAAyB,IAAI,YAAY,EAAE;QAEpD,IAAe,CAAA,eAAA,GAAG,SAAS;QAC3B,IAAiB,CAAA,iBAAA,GAAG,WAAW;QAC/B,IAAW,CAAA,WAAA,GAAG,UAAU;;IAO/B,kBAAkB,GAAA;QACd,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,sBAAsB,CAAC,CAAC,CAAC,CAAC;QACrF,IAAI,YAAY,EAAE;AACd,YAAA,IAAI,CAAC,WAAW,GAAG,YAAY,CAAC,QAAQ;;;IAIhD,QAAQ,GAAA;AACJ,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;AACnB,YAAA,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU;YAClC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;;;8GA9CxB,oBAAoB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,mBAAA,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,cAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,EAAA,IAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,cAAA,EAAA,CAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAgB,CAChB,EAAA,YAAA,EAAA,CAAA,cAAA,EAAA,cAAA,EAAA,gBAAgB,CAChB,EAAA,UAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAAA,gBAAgB,CAChB,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAAA,gBAAgB,CAChB,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAAA,gBAAgB,CASnB,EAAA,EAAA,OAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,cAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,WAAA,EAAA,SAAA,EAAA,oBAAoB,8VCvEzC,w9CAiCA,EAAA,MAAA,EAAA,CAAA,03DAAA,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,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,+CAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,WAAA,EAAA,KAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,YAAA,EAAA,YAAA,EAAA,YAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,UAAA,EAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,8BAAA,EAAA,QAAA,EAAA,0BAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,MAAA,EAAA,WAAA,EAAA,YAAA,EAAA,oBAAA,EAAA,aAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,qBAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,WAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FDMa,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAtBhC,SAAS;+BACI,cAAc,EAAA,UAAA,EAGZ,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;gCACZ,gBAAgB;AACnB,6BAAA;AACJ,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,w9CAAA,EAAA,MAAA,EAAA,CAAA,03DAAA,CAAA,EAAA;wFAIU,UAAU,EAAA,CAAA;sBADpB,WAAW;uBAAC,OAAO;gBAUmB,OAAO,EAAA,CAAA;sBAA7C,WAAW;uBAAC,eAAe;;sBAAG;gBAEtB,EAAE,EAAA,CAAA;sBAAV;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,gBAAgB,EAAA,CAAA;sBAAxB;gBAEuC,cAAc,EAAA,CAAA;sBAArD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBACE,YAAY,EAAA,CAAA;sBAAnD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBACE,UAAU,EAAA,CAAA;sBAAjD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBACE,OAAO,EAAA,CAAA;sBAA9C,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBACE,OAAO,EAAA,CAAA;sBAA9C,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAE5B,MAAM,EAAA,CAAA;sBAAf;gBAOsC,SAAS,EAAA,CAAA;sBAA/C,eAAe;uBAAC,oBAAoB;;AAmBzC;MAEa,wCAAwC,CAAA;8GAAxC,wCAAwC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAxC,wCAAwC,EAAA,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,8BAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAxC,wCAAwC,EAAA,UAAA,EAAA,CAAA;kBADpD,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA,EAAC,QAAQ,EAAE,8BAA8B,EAAE,UAAU,EAAE,KAAK,GAAE;;MAI5D,wCAAwC,CAAA;8GAAxC,wCAAwC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAxC,wCAAwC,EAAA,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,8BAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAxC,wCAAwC,EAAA,UAAA,EAAA,CAAA;kBADpD,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA,EAAC,QAAQ,EAAE,8BAA8B,EAAE,UAAU,EAAE,KAAK,GAAE;;;ME3E5D,iBAAiB,CAAA;8GAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;+GAAjB,iBAAiB,EAAA,YAAA,EAAA,CAFX,oBAAoB,EAAE,wCAAwC,EAAE,wCAAwC,CAAA,EAAA,OAAA,EAAA,CAF7G,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,mBAAmB,aAClH,oBAAoB,EAAE,wCAAwC,EAAE,wCAAwC,CAAA,EAAA,CAAA,CAAA;+GAGzG,iBAAiB,EAAA,OAAA,EAAA,CAJhB,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,2BAA2B,EAAE,kBAAkB,CAAA,EAAA,CAAA,CAAA;;2FAI9F,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAL7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,mBAAmB,CAAC;AAC7H,oBAAA,OAAO,EAAE,CAAC,oBAAoB,EAAE,wCAAwC,EAAE,wCAAwC,CAAC;AACnH,oBAAA,YAAY,EAAE,CAAC,oBAAoB,EAAE,wCAAwC,EAAE,wCAAwC,CAAC;AAC3H,iBAAA;;;AClBD;;AAEG;;;;"}
|
|
@@ -68,11 +68,11 @@ class EuiIconToggleComponent {
|
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
70
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiIconToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
71
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.3", type: EuiIconToggleComponent, isStandalone: false, selector: "eui-icon-toggle", inputs: { keyboardAccessKey: "keyboardAccessKey", isChecked: ["isChecked", "isChecked", booleanAttribute], isReadOnly: ["isReadOnly", "isReadOnly", booleanAttribute], e2eAttr: "e2eAttr", id: "id", tabindex: "tabindex", ariaLabel: "ariaLabel", iconSvgSize: "iconSvgSize", iconSvgNameOn: "iconSvgNameOn", iconSvgNameOff: "iconSvgNameOff", iconSvgFillColorOn: "iconSvgFillColorOn", iconSvgFillColorOff: "iconSvgFillColorOff" }, outputs: { toggle: "toggle" }, host: { listeners: { "click": "onClick()", "keydown": "onKeydown($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.accesskey": "this.keyboardAccessKey", "attr.aria-checked": "this.isChecked", "attr.readonly": "this.isReadOnly", "attr.data-e2e": "this.e2eAttr", "attr.id": "this.id", "attr.tabindex": "this.tabindex", "attr.aria-label": "this.ariaLabel" } }, usesOnChanges: true, ngImport: i0, template: "<eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\" [size]=\"iconSvgSize\"></eui-icon-svg>\n", styles: [".eui-19 :host.eui-icon-toggle{display:inline-block;position:relative;cursor:pointer}.eui-19 :host.eui-icon-toggle:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-icon-toggle--default-on{color:var(--eui-c-accent)}.eui-19 .eui-icon-toggle--default-off{color:var(--eui-c-neutral-bg-light)}.eui-19 .eui-icon-toggle--checked{color:var(--eui-c-accent)}.eui-19 .eui-icon-toggle--readonly{cursor:auto}\n"], dependencies: [{ kind: "component", type: i1.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
71
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.3", type: EuiIconToggleComponent, isStandalone: false, selector: "eui-icon-toggle", inputs: { keyboardAccessKey: "keyboardAccessKey", isChecked: ["isChecked", "isChecked", booleanAttribute], isReadOnly: ["isReadOnly", "isReadOnly", booleanAttribute], e2eAttr: "e2eAttr", id: "id", tabindex: "tabindex", ariaLabel: "ariaLabel", iconSvgSize: "iconSvgSize", iconSvgNameOn: "iconSvgNameOn", iconSvgNameOff: "iconSvgNameOff", iconSvgFillColorOn: "iconSvgFillColorOn", iconSvgFillColorOff: "iconSvgFillColorOff" }, outputs: { toggle: "toggle" }, host: { listeners: { "click": "onClick()", "keydown": "onKeydown($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.accesskey": "this.keyboardAccessKey", "attr.aria-checked": "this.isChecked", "attr.readonly": "this.isReadOnly", "attr.data-e2e": "this.e2eAttr", "attr.id": "this.id", "attr.tabindex": "this.tabindex", "attr.aria-label": "this.ariaLabel" } }, usesOnChanges: true, ngImport: i0, template: "<eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\" [size]=\"iconSvgSize\"></eui-icon-svg>\n", styles: [".eui-19 :host.eui-icon-toggle{display:inline-block;position:relative;cursor:pointer}.eui-19 :host.eui-icon-toggle:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-icon-toggle--default-on{color:var(--eui-c-accent)}.eui-19 :host.eui-icon-toggle--default-off{color:var(--eui-c-neutral-bg-light)}.eui-19 :host.eui-icon-toggle--checked{color:var(--eui-c-accent)}.eui-19 :host.eui-icon-toggle--readonly{cursor:auto}\n"], dependencies: [{ kind: "component", type: i1.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
72
72
|
}
|
|
73
73
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiIconToggleComponent, decorators: [{
|
|
74
74
|
type: Component,
|
|
75
|
-
args: [{ selector: 'eui-icon-toggle', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\" [size]=\"iconSvgSize\"></eui-icon-svg>\n", styles: [".eui-19 :host.eui-icon-toggle{display:inline-block;position:relative;cursor:pointer}.eui-19 :host.eui-icon-toggle:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-icon-toggle--default-on{color:var(--eui-c-accent)}.eui-19 .eui-icon-toggle--default-off{color:var(--eui-c-neutral-bg-light)}.eui-19 .eui-icon-toggle--checked{color:var(--eui-c-accent)}.eui-19 .eui-icon-toggle--readonly{cursor:auto}\n"] }]
|
|
75
|
+
args: [{ selector: 'eui-icon-toggle', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\" [size]=\"iconSvgSize\"></eui-icon-svg>\n", styles: [".eui-19 :host.eui-icon-toggle{display:inline-block;position:relative;cursor:pointer}.eui-19 :host.eui-icon-toggle:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-icon-toggle--default-on{color:var(--eui-c-accent)}.eui-19 :host.eui-icon-toggle--default-off{color:var(--eui-c-neutral-bg-light)}.eui-19 :host.eui-icon-toggle--checked{color:var(--eui-c-accent)}.eui-19 :host.eui-icon-toggle--readonly{cursor:auto}\n"] }]
|
|
76
76
|
}], propDecorators: { cssClasses: [{
|
|
77
77
|
type: HostBinding,
|
|
78
78
|
args: ['class']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-components-eui-icon-toggle.mjs","sources":["../../eui-icon-toggle/eui-icon-toggle.component.ts","../../eui-icon-toggle/eui-icon-toggle.component.html","../../eui-icon-toggle/eui-icon-toggle.module.ts","../../eui-icon-toggle/eui-components-eui-icon-toggle.ts"],"sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n HostListener,\n Input,\n OnChanges,\n Output,\n SimpleChanges,\n booleanAttribute,\n} from '@angular/core';\n\nimport { uniqueId } from '@eui/core';\n\n@Component({\n selector: 'eui-icon-toggle',\n templateUrl: './eui-icon-toggle.component.html',\n styleUrls: ['./
|
|
1
|
+
{"version":3,"file":"eui-components-eui-icon-toggle.mjs","sources":["../../eui-icon-toggle/eui-icon-toggle.component.ts","../../eui-icon-toggle/eui-icon-toggle.component.html","../../eui-icon-toggle/eui-icon-toggle.module.ts","../../eui-icon-toggle/eui-components-eui-icon-toggle.ts"],"sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n HostListener,\n Input,\n OnChanges,\n Output,\n SimpleChanges,\n booleanAttribute,\n} from '@angular/core';\n\nimport { uniqueId } from '@eui/core';\n\n@Component({\n selector: 'eui-icon-toggle',\n templateUrl: './eui-icon-toggle.component.html',\n styleUrls: ['./eui-icon-toggle.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false,\n})\nexport class EuiIconToggleComponent implements AfterContentInit, OnChanges {\n @HostBinding('class')\n public get cssClasses(): string {\n return ['eui-icon-toggle',\n this.isChecked ? 'eui-icon-toggle--default-on' : 'eui-icon-toggle--default-off',\n this.isReadOnly ? 'eui-icon-toggle--readonly': '',\n ].join(' ').trim();\n }\n @HostBinding('attr.role') role = 'switch';\n @HostBinding('attr.accesskey') @Input() keyboardAccessKey = 'i';\n\n @HostBinding('attr.aria-checked')\n @Input({ transform: booleanAttribute }) isChecked = false;\n\n @HostBinding('attr.readonly')\n @Input({ transform: booleanAttribute }) isReadOnly: boolean;\n\n @HostBinding('attr.data-e2e')\n @Input() e2eAttr = 'eui-icon-toggle';\n\n @HostBinding('attr.id')\n @Input() id = `eui-icon-toggle-${uniqueId()}`;\n\n @HostBinding('attr.tabindex')\n @Input() tabindex = '0';\n\n @HostBinding('attr.aria-label')\n @Input() ariaLabel = 'Toggle icon';\n\n @Input() iconSvgSize = 'm';\n @Input() iconSvgNameOn: string;\n @Input() iconSvgNameOff: string;\n @Input() iconSvgFillColorOn = 'accent';\n @Input() iconSvgFillColorOff = 'neutral';\n\n // eslint-disable-next-line\n @Output() toggle: EventEmitter<boolean> = new EventEmitter();\n\n protected iconSvgName: string;\n protected iconSvgFillColor: string;\n protected iconSvgSet: string;\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes?.isReadOnly && changes?.isReadOnly.currentValue === true) {\n this.tabindex = '-1';\n }\n }\n\n ngAfterContentInit(): void {\n this._setIconClass();\n if (!this.ariaLabel || this.ariaLabel === '') {\n this.ariaLabel = this.iconSvgName ? this.iconSvgName : '';\n }\n }\n\n @HostListener('click')\n protected onClick(): void {\n this._toggle();\n }\n\n @HostListener('keydown', ['$event'])\n protected onKeydown(event: KeyboardEvent): void {\n switch (event.code) {\n case 'Enter':\n case 'Space':\n event.preventDefault();\n event.stopPropagation();\n this._toggle();\n break;\n }\n }\n\n private _toggle(): void {\n if (!this.isReadOnly) {\n this.isChecked = !this.isChecked;\n this._setIconClass();\n this.toggle.emit(this.isChecked);\n }\n }\n\n private _setIconClass(): void {\n if (this.isChecked) {\n this.iconSvgName = this.iconSvgNameOn;\n this.iconSvgFillColor = this.iconSvgFillColorOn;\n } else {\n this.iconSvgName = this.iconSvgNameOff;\n this.iconSvgFillColor = this.iconSvgFillColorOff;\n }\n }\n}\n","<eui-icon-svg [icon]=\"iconSvgName\" [fillColor]=\"iconSvgFillColor\" [size]=\"iconSvgSize\"></eui-icon-svg>\n","import { EuiIconToggleComponent } from './eui-icon-toggle.component';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { EuiIconModule } from '@eui/components/eui-icon';\n\n@NgModule({\n imports: [CommonModule, EuiIconModule],\n exports: [EuiIconToggleComponent],\n declarations: [EuiIconToggleComponent],\n})\nexport class EuiIconToggleModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAuBa,sBAAsB,CAAA;AAPnC,IAAA,WAAA,GAAA;QAe8B,IAAI,CAAA,IAAA,GAAG,QAAQ;QACA,IAAiB,CAAA,iBAAA,GAAG,GAAG;QAGxB,IAAS,CAAA,SAAA,GAAG,KAAK;QAMhD,IAAO,CAAA,OAAA,GAAG,iBAAiB;AAG3B,QAAA,IAAA,CAAA,EAAE,GAAG,CAAA,gBAAA,EAAmB,QAAQ,EAAE,EAAE;QAGpC,IAAQ,CAAA,QAAA,GAAG,GAAG;QAGd,IAAS,CAAA,SAAA,GAAG,aAAa;QAEzB,IAAW,CAAA,WAAA,GAAG,GAAG;QAGjB,IAAkB,CAAA,kBAAA,GAAG,QAAQ;QAC7B,IAAmB,CAAA,mBAAA,GAAG,SAAS;;AAG9B,QAAA,IAAA,CAAA,MAAM,GAA0B,IAAI,YAAY,EAAE;AAqD/D;AAxFG,IAAA,IACW,UAAU,GAAA;AACjB,QAAA,OAAO,CAAC,iBAAiB;YACrB,IAAI,CAAC,SAAS,GAAG,6BAA6B,GAAG,8BAA8B;YAC/E,IAAI,CAAC,UAAU,GAAG,2BAA2B,GAAE,EAAE;AACpD,SAAA,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;;AAoCtB,IAAA,WAAW,CAAC,OAAsB,EAAA;AAC/B,QAAA,IAAI,OAAO,EAAE,UAAU,IAAI,OAAO,EAAE,UAAU,CAAC,YAAY,KAAK,IAAI,EAAE;AACjE,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;;;IAI5B,kBAAkB,GAAA;QACd,IAAI,CAAC,aAAa,EAAE;QACpB,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,KAAK,EAAE,EAAE;AAC1C,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,EAAE;;;IAKvD,OAAO,GAAA;QACb,IAAI,CAAC,OAAO,EAAE;;AAIR,IAAA,SAAS,CAAC,KAAoB,EAAA;AACpC,QAAA,QAAQ,KAAK,CAAC,IAAI;AACd,YAAA,KAAK,OAAO;AACZ,YAAA,KAAK,OAAO;gBACR,KAAK,CAAC,cAAc,EAAE;gBACtB,KAAK,CAAC,eAAe,EAAE;gBACvB,IAAI,CAAC,OAAO,EAAE;gBACd;;;IAIJ,OAAO,GAAA;AACX,QAAA,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS;YAChC,IAAI,CAAC,aAAa,EAAE;YACpB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;;;IAIhC,aAAa,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAChB,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,aAAa;AACrC,YAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,kBAAkB;;aAC5C;AACH,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,cAAc;AACtC,YAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,mBAAmB;;;8GAtF/C,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAYX,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAAA,gBAAgB,CAGhB,EAAA,UAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAAA,gBAAgB,2tBCtCxC,gHACA,EAAA,MAAA,EAAA,CAAA,igBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,+CAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,WAAA,EAAA,KAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,YAAA,EAAA,YAAA,EAAA,YAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,UAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FDsBa,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAPlC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,EAGV,eAAA,EAAA,uBAAuB,CAAC,MAAM,cACnC,KAAK,EAAA,QAAA,EAAA,gHAAA,EAAA,MAAA,EAAA,CAAA,igBAAA,CAAA,EAAA;8BAIN,UAAU,EAAA,CAAA;sBADpB,WAAW;uBAAC,OAAO;gBAOM,IAAI,EAAA,CAAA;sBAA7B,WAAW;uBAAC,WAAW;gBACiB,iBAAiB,EAAA,CAAA;sBAAzD,WAAW;uBAAC,gBAAgB;;sBAAI;gBAGO,SAAS,EAAA,CAAA;sBADhD,WAAW;uBAAC,mBAAmB;;sBAC/B,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAGE,UAAU,EAAA,CAAA;sBADjD,WAAW;uBAAC,eAAe;;sBAC3B,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAG7B,OAAO,EAAA,CAAA;sBADf,WAAW;uBAAC,eAAe;;sBAC3B;gBAGQ,EAAE,EAAA,CAAA;sBADV,WAAW;uBAAC,SAAS;;sBACrB;gBAGQ,QAAQ,EAAA,CAAA;sBADhB,WAAW;uBAAC,eAAe;;sBAC3B;gBAGQ,SAAS,EAAA,CAAA;sBADjB,WAAW;uBAAC,iBAAiB;;sBAC7B;gBAEQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,aAAa,EAAA,CAAA;sBAArB;gBACQ,cAAc,EAAA,CAAA;sBAAtB;gBACQ,kBAAkB,EAAA,CAAA;sBAA1B;gBACQ,mBAAmB,EAAA,CAAA;sBAA3B;gBAGS,MAAM,EAAA,CAAA;sBAAf;gBAoBS,OAAO,EAAA,CAAA;sBADhB,YAAY;uBAAC,OAAO;gBAMX,SAAS,EAAA,CAAA;sBADlB,YAAY;uBAAC,SAAS,EAAE,CAAC,QAAQ,CAAC;;;MExE1B,mBAAmB,CAAA;8GAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAnB,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,mBAAmB,iBAFb,sBAAsB,CAAA,EAAA,OAAA,EAAA,CAF3B,YAAY,EAAE,aAAa,aAC3B,sBAAsB,CAAA,EAAA,CAAA,CAAA;+GAGvB,mBAAmB,EAAA,OAAA,EAAA,CAJlB,YAAY,EAAE,aAAa,CAAA,EAAA,CAAA,CAAA;;2FAI5B,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAL/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,aAAa,CAAC;oBACtC,OAAO,EAAE,CAAC,sBAAsB,CAAC;oBACjC,YAAY,EAAE,CAAC,sBAAsB,CAAC;AACzC,iBAAA;;;ACVD;;AAEG;;;;"}
|
|
@@ -22,7 +22,7 @@ class EuiLabelComponent {
|
|
|
22
22
|
this.euiSublabel = false;
|
|
23
23
|
}
|
|
24
24
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiLabelComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.3", type: EuiLabelComponent, isStandalone: false, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label,\n label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: { euiRequired: ["euiRequired", "euiRequired", booleanAttribute], euiReadonly: ["euiReadonly", "euiReadonly", booleanAttribute], euiSublabel: ["euiSublabel", "euiSublabel", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeL", "euiSizeL", "euiDisabled", "euiDisabled"] }], ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 :host.eui-label{display:inline-block;font-family:var(--eui-f-family)}.eui-19 :host.eui-label .eui-label__sublabel{color:var(--eui-c-neutral-light);display:block;font-family:var(--eui-f-family);margin-bottom:var(--eui-s-2xs);margin-top:var(--eui-s-2xs)}.eui-19 :host.eui-label--
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.3", type: EuiLabelComponent, isStandalone: false, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label,\n label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: { euiRequired: ["euiRequired", "euiRequired", booleanAttribute], euiReadonly: ["euiReadonly", "euiReadonly", booleanAttribute], euiSublabel: ["euiSublabel", "euiSublabel", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeL", "euiSizeL", "euiDisabled", "euiDisabled"] }], ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 :host.eui-label{display:inline-block;font-family:var(--eui-f-family)}.eui-19 :host.eui-label .eui-label__sublabel{color:var(--eui-c-neutral-light);display:block;font-family:var(--eui-f-family);margin-bottom:var(--eui-s-2xs);margin-top:var(--eui-s-2xs)}.eui-19 :host.eui-label--primary{color:var(--eui-c-primary)}.eui-19 :host.eui-label--secondary{color:var(--eui-c-neutral)}.eui-19 :host.eui-label--info{color:var(--eui-c-info)}.eui-19 :host.eui-label--success{color:var(--eui-c-success-dark)}.eui-19 :host.eui-label--warning{color:var(--eui-c-warning)}.eui-19 :host.eui-label--danger{color:var(--eui-c-danger-dark)}.eui-19 :host.eui-label--size-s{font:var(--eui-f-s)}.eui-19 :host.eui-label--size-m{font:var(--eui-f-m)}.eui-19 :host.eui-label--size-l{font:var(--eui-f-l)}.eui-19 :host.eui-label--required:after{color:var(--eui-c-danger-dark);content:\"*\";line-height:1;padding-left:var(--eui-s-2xs);font:var(--eui-f-l-compact-bold)}.eui-19 :host.eui-label--disabled{color:var(--eui-c-disabled)}.eui-19 :host.eui-label--readonly{color:var(--eui-c-neutral-light)}.eui-19 :host.eui-label--selected{font:var(--eui-f-m-bold)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
26
26
|
}
|
|
27
27
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiLabelComponent, decorators: [{
|
|
28
28
|
type: Component,
|
|
@@ -43,7 +43,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
43
43
|
'euiDisabled',
|
|
44
44
|
],
|
|
45
45
|
},
|
|
46
|
-
], styles: [".eui-19 :host.eui-label{display:inline-block;font-family:var(--eui-f-family)}.eui-19 :host.eui-label .eui-label__sublabel{color:var(--eui-c-neutral-light);display:block;font-family:var(--eui-f-family);margin-bottom:var(--eui-s-2xs);margin-top:var(--eui-s-2xs)}.eui-19 :host.eui-label--
|
|
46
|
+
], styles: [".eui-19 :host.eui-label{display:inline-block;font-family:var(--eui-f-family)}.eui-19 :host.eui-label .eui-label__sublabel{color:var(--eui-c-neutral-light);display:block;font-family:var(--eui-f-family);margin-bottom:var(--eui-s-2xs);margin-top:var(--eui-s-2xs)}.eui-19 :host.eui-label--primary{color:var(--eui-c-primary)}.eui-19 :host.eui-label--secondary{color:var(--eui-c-neutral)}.eui-19 :host.eui-label--info{color:var(--eui-c-info)}.eui-19 :host.eui-label--success{color:var(--eui-c-success-dark)}.eui-19 :host.eui-label--warning{color:var(--eui-c-warning)}.eui-19 :host.eui-label--danger{color:var(--eui-c-danger-dark)}.eui-19 :host.eui-label--size-s{font:var(--eui-f-s)}.eui-19 :host.eui-label--size-m{font:var(--eui-f-m)}.eui-19 :host.eui-label--size-l{font:var(--eui-f-l)}.eui-19 :host.eui-label--required:after{color:var(--eui-c-danger-dark);content:\"*\";line-height:1;padding-left:var(--eui-s-2xs);font:var(--eui-f-l-compact-bold)}.eui-19 :host.eui-label--disabled{color:var(--eui-c-disabled)}.eui-19 :host.eui-label--readonly{color:var(--eui-c-neutral-light)}.eui-19 :host.eui-label--selected{font:var(--eui-f-m-bold)}\n"] }]
|
|
47
47
|
}], ctorParameters: () => [{ type: i1.BaseStatesDirective }], propDecorators: { cssClasses: [{
|
|
48
48
|
type: HostBinding,
|
|
49
49
|
args: ['class']
|
|
@@ -149,11 +149,11 @@ class EuiMenuItemComponent {
|
|
|
149
149
|
].join(' ').trim();
|
|
150
150
|
}
|
|
151
151
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", 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.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);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)}.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)}\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 }); }
|
|
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);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)}.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
154
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", 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);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)}.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)}\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-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)}.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']
|
|
@@ -704,11 +704,11 @@ class EuiMenuComponent {
|
|
|
704
704
|
return this.filterInput?.nativeElement?.value.length > 0;
|
|
705
705
|
}
|
|
706
706
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", 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.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);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)}.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)}\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 }); }
|
|
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);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)}.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
709
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", 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);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)}.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)}\n"] }]
|
|
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-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)}.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]
|