@eui/components 17.0.0-next.16 → 17.0.0-next.17
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/EuiDashboardButtonComponent.html +151 -696
- package/docs/components/EuiFieldsetComponent.html +132 -956
- package/docs/dependencies.html +2 -2
- package/docs/directives/BaseStatesDirective.html +1076 -107
- package/docs/js/menu-wc.js +6 -6
- package/docs/js/menu-wc_es5.js +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/docs/modules/EuiDashboardButtonModule.html +10 -0
- package/esm2022/eui-avatar/eui-avatar.component.mjs +2 -2
- package/esm2022/eui-badge/eui-badge.component.mjs +2 -2
- package/esm2022/eui-card/eui-card.component.mjs +2 -2
- package/esm2022/eui-dashboard-button/eui-dashboard-button.component.mjs +52 -14
- package/esm2022/eui-feedback-message/eui-feedback-message.component.mjs +2 -2
- package/esm2022/eui-fieldset/eui-fieldset.component.mjs +108 -67
- package/esm2022/eui-growl/eui-growl.component.mjs +2 -2
- package/esm2022/eui-label/eui-label.component.mjs +2 -2
- package/esm2022/eui-list/eui-list-item/eui-list-item.component.mjs +2 -2
- package/esm2022/eui-list/eui-list.component.mjs +2 -2
- package/esm2022/eui-tabs/eui-tab/eui-tab.component.mjs +2 -2
- package/esm2022/eui-tabs/eui-tabs.component.mjs +2 -2
- package/esm2022/eui-timebar/eui-timebar.component.mjs +2 -2
- package/esm2022/eui-timeline/eui-timeline-item.component.mjs +2 -2
- package/esm2022/eui-timeline/eui-timeline.component.mjs +2 -2
- package/esm2022/eui-tree-list/eui-tree-list.component.mjs +2 -2
- package/esm2022/shared/base/base-states.directive.mjs +140 -71
- package/eui-dashboard-button/eui-dashboard-button.component.d.ts +15 -7
- package/eui-dashboard-button/eui-dashboard-button.component.d.ts.map +1 -1
- package/eui-fieldset/eui-fieldset.component.d.ts +20 -25
- package/eui-fieldset/eui-fieldset.component.d.ts.map +1 -1
- package/fesm2022/eui-components-eui-avatar.mjs +2 -2
- package/fesm2022/eui-components-eui-avatar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-badge.mjs +2 -2
- package/fesm2022/eui-components-eui-badge.mjs.map +1 -1
- package/fesm2022/eui-components-eui-card.mjs +2 -2
- package/fesm2022/eui-components-eui-card.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dashboard-button.mjs +51 -13
- package/fesm2022/eui-components-eui-dashboard-button.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 +108 -67
- package/fesm2022/eui-components-eui-fieldset.mjs.map +1 -1
- package/fesm2022/eui-components-eui-growl.mjs +2 -2
- package/fesm2022/eui-components-eui-growl.mjs.map +1 -1
- package/fesm2022/eui-components-eui-label.mjs +2 -2
- package/fesm2022/eui-components-eui-list.mjs +4 -4
- package/fesm2022/eui-components-eui-list.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tabs.mjs +4 -4
- package/fesm2022/eui-components-eui-timebar.mjs +2 -2
- package/fesm2022/eui-components-eui-timebar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-timeline.mjs +4 -4
- package/fesm2022/eui-components-eui-timeline.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tree-list.mjs +2 -2
- package/fesm2022/eui-components-eui-tree-list.mjs.map +1 -1
- package/fesm2022/eui-components-shared-base.mjs +138 -70
- package/fesm2022/eui-components-shared-base.mjs.map +1 -1
- package/package.json +13 -13
- package/shared/base/base-states.directive.d.ts +51 -17
- package/shared/base/base-states.directive.d.ts.map +1 -1
|
@@ -1,65 +1,37 @@
|
|
|
1
|
+
import { __decorate } from 'tslib';
|
|
1
2
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component, ViewEncapsulation, HostBinding, Input, ContentChild, forwardRef,
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
3
|
+
import { EventEmitter, Component, ViewEncapsulation, HostBinding, Input, Output, ContentChild, forwardRef, Directive, NgModule } from '@angular/core';
|
|
4
|
+
import * as i1 from '@eui/components/shared';
|
|
5
|
+
import { BaseStatesDirective } from '@eui/components/shared';
|
|
6
|
+
import { coerceBoolean } from '@eui/base';
|
|
7
|
+
import * as i2 from '@angular/common';
|
|
6
8
|
import { CommonModule } from '@angular/common';
|
|
7
|
-
import * as
|
|
9
|
+
import * as i3 from '@eui/components/eui-button';
|
|
8
10
|
import { EuiButtonModule } from '@eui/components/eui-button';
|
|
9
|
-
import * as
|
|
11
|
+
import * as i4 from '@eui/components/eui-icon';
|
|
10
12
|
import { EuiIconModule } from '@eui/components/eui-icon';
|
|
11
13
|
|
|
12
|
-
class EuiFieldsetComponent
|
|
14
|
+
class EuiFieldsetComponent {
|
|
13
15
|
get cssClasses() {
|
|
14
|
-
return
|
|
15
|
-
super.getCssClasses('eui-fieldset'),
|
|
16
|
-
this.isFirst ? 'eui-fieldset--first' : '',
|
|
17
|
-
this.isExpandable ? 'eui-fieldset--expandable' : '',
|
|
18
|
-
]
|
|
19
|
-
.join(' ')
|
|
20
|
-
.trim();
|
|
21
|
-
}
|
|
22
|
-
get isFirst() {
|
|
23
|
-
return this._isFirst;
|
|
24
|
-
}
|
|
25
|
-
set isFirst(value) {
|
|
26
|
-
this._isFirst = coerceBooleanProperty(value);
|
|
27
|
-
}
|
|
28
|
-
get hasDefaultIcon() {
|
|
29
|
-
return this._hasDefaultIcon;
|
|
30
|
-
}
|
|
31
|
-
set hasDefaultIcon(value) {
|
|
32
|
-
this._hasDefaultIcon = coerceBooleanProperty(value);
|
|
33
|
-
}
|
|
34
|
-
get isExpandable() {
|
|
35
|
-
return this._isExpandable;
|
|
36
|
-
}
|
|
37
|
-
set isExpandable(value) {
|
|
38
|
-
this._isExpandable = coerceBooleanProperty(value);
|
|
39
|
-
}
|
|
40
|
-
get isExpanded() {
|
|
41
|
-
return this._isExpanded;
|
|
42
|
-
}
|
|
43
|
-
set isExpanded(value) {
|
|
44
|
-
this._isExpanded = coerceBooleanProperty(value);
|
|
45
|
-
}
|
|
46
|
-
get isLarge() {
|
|
47
|
-
return this._isLarge;
|
|
48
|
-
}
|
|
49
|
-
set isLarge(value) {
|
|
50
|
-
this._isLarge = coerceBooleanProperty(value);
|
|
16
|
+
return this.getCssClasses();
|
|
51
17
|
}
|
|
52
|
-
constructor() {
|
|
53
|
-
|
|
18
|
+
constructor(baseStatesDirective) {
|
|
19
|
+
this.baseStatesDirective = baseStatesDirective;
|
|
54
20
|
this.e2eAttr = 'eui-fieldset';
|
|
21
|
+
this.hasDefaultIcon = false;
|
|
22
|
+
this.isExpandable = false;
|
|
23
|
+
this.isExpanded = false;
|
|
24
|
+
this.isLarge = false;
|
|
25
|
+
this.isFirst = false;
|
|
26
|
+
// TODO v17 doesn't work bound in showcase... not recognized as an input
|
|
27
|
+
this.euiHighlighted = false;
|
|
28
|
+
this.expand = new EventEmitter();
|
|
55
29
|
this.expandMenuLabel = 'Expand ';
|
|
56
30
|
this.collapseMenuLabel = 'Collapse ';
|
|
57
|
-
this.
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
this.
|
|
61
|
-
this._isExpanded = true;
|
|
62
|
-
this._isLarge = false;
|
|
31
|
+
this.iconSvgType = 'eui-info';
|
|
32
|
+
}
|
|
33
|
+
ngOnChanges() {
|
|
34
|
+
this.setIcon();
|
|
63
35
|
}
|
|
64
36
|
onToggle() {
|
|
65
37
|
if (this.isExpandable) {
|
|
@@ -67,15 +39,82 @@ class EuiFieldsetComponent extends BaseDirective {
|
|
|
67
39
|
this.expand.emit(this.id);
|
|
68
40
|
}
|
|
69
41
|
}
|
|
70
|
-
|
|
71
|
-
|
|
42
|
+
getCssClasses() {
|
|
43
|
+
return [
|
|
44
|
+
this.baseStatesDirective.getCssClasses('eui-fieldset'),
|
|
45
|
+
this.isFirst ? 'eui-fieldset--first' : '',
|
|
46
|
+
this.isExpandable ? 'eui-fieldset--expandable' : '',
|
|
47
|
+
// TODO v17 doesn't work bound in showcase... not recognized as an input
|
|
48
|
+
this.euiHighlighted ? 'eui-fieldset--highlighted' : '',
|
|
49
|
+
].join(' ').trim();
|
|
50
|
+
}
|
|
51
|
+
setIcon() {
|
|
52
|
+
this.iconSvgType = 'eui-ecl-information';
|
|
53
|
+
if (this.baseStatesDirective.euiWarning) {
|
|
54
|
+
this.iconSvgType = 'eui-ecl-warning';
|
|
55
|
+
}
|
|
56
|
+
if (this.baseStatesDirective.euiDanger) {
|
|
57
|
+
this.iconSvgType = 'eui-ecl-error';
|
|
58
|
+
}
|
|
59
|
+
if (this.baseStatesDirective.euiSuccess) {
|
|
60
|
+
this.iconSvgType = 'eui-ecl-check-filled';
|
|
61
|
+
}
|
|
62
|
+
if (this.baseStatesDirective.euiSecondary) {
|
|
63
|
+
this.iconSvgType = 'eui-question';
|
|
64
|
+
}
|
|
65
|
+
// TODO v17 need to have some coherence with icon status (alert / growl / fieldset here / others...)
|
|
66
|
+
// default status icon defs : here for growl / alert are different
|
|
67
|
+
// <eui-icon-svg *ngIf="msg.severity === 'info'" icon="eui-ecl-information"></eui-icon-svg>
|
|
68
|
+
// <eui-icon-svg *ngIf="msg.severity === 'warning'" icon="eui-ecl-warning"></eui-icon-svg>
|
|
69
|
+
// <eui-icon-svg *ngIf="msg.severity === 'danger'" icon="eui-ecl-error"></eui-icon-svg>
|
|
70
|
+
// <eui-icon-svg *ngIf="msg.severity === 'success'" icon="eui-ecl-check-filled"></eui-icon-svg>
|
|
71
|
+
}
|
|
72
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiFieldsetComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
73
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiFieldsetComponent, selector: "eui-fieldset", inputs: { e2eAttr: "e2eAttr", id: "id", label: "label", iconClass: "iconClass", iconSvgName: "iconSvgName", iconSvgFillColor: "iconSvgFillColor", hasDefaultIcon: "hasDefaultIcon", isExpandable: "isExpandable", isExpanded: "isExpanded", isLarge: "isLarge", isFirst: "isFirst", euiHighlighted: "euiHighlighted" }, outputs: { expand: "expand" }, host: { properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "customLabelRightContent", first: true, predicate: i0.forwardRef(() => EuiFieldsetLabelRightContentTagDirective), descendants: true }, { propertyName: "customLabelExtraContent", first: true, predicate: i0.forwardRef(() => EuiFieldsetLabelExtraContentTagDirective), descendants: true }], usesOnChanges: true, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["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 <div *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n <div *ngIf=\"iconClass\" class=\"eui-fieldset__header-icon eui-icon {{ iconClass }}\"></div>\n <div *ngIf=\"iconSvgName\" class=\"eui-fieldset__header-icon\">\n <eui-icon-svg icon=\"{{ iconSvgName }}\" fillColor=\"{{ iconSvgFillColor }}\"></eui-icon-svg>\n </div>\n <div *ngIf=\"!iconClass && hasDefaultIcon\" class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgType\"></eui-icon-svg>\n </div>\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-template [ngIf]=\"customLabelRightContent\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n </ng-template>\n <button\n *ngIf=\"isExpandable\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n euiSecondary\n type=\"button\"\n class=\"eui-fieldset__header-expand-toggle\"\n [class.eui-fieldset__header-expand-toggle--expanded]=\"isExpanded\"\n [attr.aria-label]=\"!isExpanded ? expandMenuLabel + label : collapseMenuLabel + label\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n <div *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".eui-fieldset{display:block;position:relative;width:100%}.eui-fieldset--first{margin-top:var(--eui-base-spacing-s)}.eui-fieldset__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin-bottom:var(--eui-base-spacing-m);min-height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));text-transform:uppercase}.eui-fieldset__header-icon{align-items:center;display:inline-flex;font-size:var(--eui-base-icon-size-m);margin-right:var(--eui-base-spacing-s)}.eui-fieldset__header-label{align-items:center;display:inline-flex;font:normal normal 400 .875rem/1rem var(--eui-base-font-family);font-weight:700}.eui-fieldset__header-label.eui-fieldset__header-label--large{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-fieldset__header-right-content{align-items:center;display:flex;margin-left:auto}.eui-fieldset__header-expand-toggle{margin-left:var(--eui-base-spacing-s)!important;margin-right:calc(-1 * var(--eui-base-spacing-xs))!important;transition:all .3s linear!important}.eui-fieldset__header-expand-toggle:active:not([readonly]),.eui-fieldset__header-expand-toggle:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-fieldset__header-expand-toggle [tabindex=\"0\"]:active:not([readonly]),.eui-fieldset__header-expand-toggle [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-fieldset__header-expand-toggle.eui-fieldset__header-expand-toggle--expanded{transform:rotate(90deg)}.eui-fieldset--highlighted .eui-fieldset__container{background-color:var(--eui-base-color-grey-2);padding:var(--eui-base-spacing-s);z-index:var(--eui-base-z-index-highlighted)}.eui-fieldset--size-l>.eui-fieldset__header>.eui-fieldset__header-label{color:var(--eui-base-color-grey-100);text-transform:none;font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.eui-fieldset--highlighted{z-index:var(--eui-base-z-index-highlighted)}.eui-fieldset--expandable .eui-fieldset__header{cursor:pointer;padding-bottom:var(--eui-base-spacing-xs)}.eui-fieldset--primary{color:var(--eui-base-color-primary-100)}.eui-fieldset--primary .eui-icon-svg svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-fieldset--info{color:var(--eui-base-color-info-100)}.eui-fieldset--info .eui-icon-svg svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-fieldset--success{color:var(--eui-base-color-success-100)}.eui-fieldset--success .eui-icon-svg svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-fieldset--warning{color:var(--eui-base-color-warning-130)}.eui-fieldset--warning .eui-icon-svg svg{color:var(--eui-base-color-warning-130);fill:var(--eui-base-color-warning-130)}.eui-fieldset--danger{color:var(--eui-base-color-danger-100)}.eui-fieldset--danger .eui-icon-svg svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i4.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
72
74
|
}
|
|
75
|
+
__decorate([
|
|
76
|
+
coerceBoolean
|
|
77
|
+
], EuiFieldsetComponent.prototype, "hasDefaultIcon", void 0);
|
|
78
|
+
__decorate([
|
|
79
|
+
coerceBoolean
|
|
80
|
+
], EuiFieldsetComponent.prototype, "isExpandable", void 0);
|
|
81
|
+
__decorate([
|
|
82
|
+
coerceBoolean
|
|
83
|
+
], EuiFieldsetComponent.prototype, "isExpanded", void 0);
|
|
84
|
+
__decorate([
|
|
85
|
+
coerceBoolean
|
|
86
|
+
], EuiFieldsetComponent.prototype, "isLarge", void 0);
|
|
87
|
+
__decorate([
|
|
88
|
+
coerceBoolean
|
|
89
|
+
], EuiFieldsetComponent.prototype, "isFirst", void 0);
|
|
90
|
+
__decorate([
|
|
91
|
+
coerceBoolean
|
|
92
|
+
], EuiFieldsetComponent.prototype, "euiHighlighted", void 0);
|
|
73
93
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiFieldsetComponent, decorators: [{
|
|
74
94
|
type: Component,
|
|
75
|
-
args: [{ selector: 'eui-fieldset', encapsulation: ViewEncapsulation.None,
|
|
76
|
-
|
|
95
|
+
args: [{ selector: 'eui-fieldset', encapsulation: ViewEncapsulation.None, hostDirectives: [
|
|
96
|
+
{
|
|
97
|
+
directive: BaseStatesDirective,
|
|
98
|
+
inputs: [
|
|
99
|
+
'euiSecondary',
|
|
100
|
+
'euiSuccess',
|
|
101
|
+
'euiInfo',
|
|
102
|
+
'euiWarning',
|
|
103
|
+
'euiDanger',
|
|
104
|
+
'euiAccent',
|
|
105
|
+
'euiVariant',
|
|
106
|
+
'euiHighlighted', // TODO v17 doesn't work bound in showcase... not recognized as an input
|
|
107
|
+
],
|
|
108
|
+
},
|
|
109
|
+
], template: "<div class=\"eui-fieldset__container\">\n <div *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n <div *ngIf=\"iconClass\" class=\"eui-fieldset__header-icon eui-icon {{ iconClass }}\"></div>\n <div *ngIf=\"iconSvgName\" class=\"eui-fieldset__header-icon\">\n <eui-icon-svg icon=\"{{ iconSvgName }}\" fillColor=\"{{ iconSvgFillColor }}\"></eui-icon-svg>\n </div>\n <div *ngIf=\"!iconClass && hasDefaultIcon\" class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgType\"></eui-icon-svg>\n </div>\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-template [ngIf]=\"customLabelRightContent\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n </ng-template>\n <button\n *ngIf=\"isExpandable\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n euiSecondary\n type=\"button\"\n class=\"eui-fieldset__header-expand-toggle\"\n [class.eui-fieldset__header-expand-toggle--expanded]=\"isExpanded\"\n [attr.aria-label]=\"!isExpanded ? expandMenuLabel + label : collapseMenuLabel + label\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n <div *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".eui-fieldset{display:block;position:relative;width:100%}.eui-fieldset--first{margin-top:var(--eui-base-spacing-s)}.eui-fieldset__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin-bottom:var(--eui-base-spacing-m);min-height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));text-transform:uppercase}.eui-fieldset__header-icon{align-items:center;display:inline-flex;font-size:var(--eui-base-icon-size-m);margin-right:var(--eui-base-spacing-s)}.eui-fieldset__header-label{align-items:center;display:inline-flex;font:normal normal 400 .875rem/1rem var(--eui-base-font-family);font-weight:700}.eui-fieldset__header-label.eui-fieldset__header-label--large{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-fieldset__header-right-content{align-items:center;display:flex;margin-left:auto}.eui-fieldset__header-expand-toggle{margin-left:var(--eui-base-spacing-s)!important;margin-right:calc(-1 * var(--eui-base-spacing-xs))!important;transition:all .3s linear!important}.eui-fieldset__header-expand-toggle:active:not([readonly]),.eui-fieldset__header-expand-toggle:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-fieldset__header-expand-toggle [tabindex=\"0\"]:active:not([readonly]),.eui-fieldset__header-expand-toggle [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-fieldset__header-expand-toggle.eui-fieldset__header-expand-toggle--expanded{transform:rotate(90deg)}.eui-fieldset--highlighted .eui-fieldset__container{background-color:var(--eui-base-color-grey-2);padding:var(--eui-base-spacing-s);z-index:var(--eui-base-z-index-highlighted)}.eui-fieldset--size-l>.eui-fieldset__header>.eui-fieldset__header-label{color:var(--eui-base-color-grey-100);text-transform:none;font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.eui-fieldset--highlighted{z-index:var(--eui-base-z-index-highlighted)}.eui-fieldset--expandable .eui-fieldset__header{cursor:pointer;padding-bottom:var(--eui-base-spacing-xs)}.eui-fieldset--primary{color:var(--eui-base-color-primary-100)}.eui-fieldset--primary .eui-icon-svg svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-fieldset--info{color:var(--eui-base-color-info-100)}.eui-fieldset--info .eui-icon-svg svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-fieldset--success{color:var(--eui-base-color-success-100)}.eui-fieldset--success .eui-icon-svg svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-fieldset--warning{color:var(--eui-base-color-warning-130)}.eui-fieldset--warning .eui-icon-svg svg{color:var(--eui-base-color-warning-130);fill:var(--eui-base-color-warning-130)}.eui-fieldset--danger{color:var(--eui-base-color-danger-100)}.eui-fieldset--danger .eui-icon-svg svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}\n"] }]
|
|
110
|
+
}], ctorParameters: () => [{ type: i1.BaseStatesDirective }], propDecorators: { cssClasses: [{
|
|
77
111
|
type: HostBinding,
|
|
78
112
|
args: ['class']
|
|
113
|
+
}], e2eAttr: [{
|
|
114
|
+
type: HostBinding,
|
|
115
|
+
args: ['attr.data-e2e']
|
|
116
|
+
}, {
|
|
117
|
+
type: Input
|
|
79
118
|
}], id: [{
|
|
80
119
|
type: Input
|
|
81
120
|
}], label: [{
|
|
@@ -84,18 +123,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ng
|
|
|
84
123
|
type: Input
|
|
85
124
|
}], iconSvgName: [{
|
|
86
125
|
type: Input
|
|
87
|
-
}],
|
|
126
|
+
}], iconSvgFillColor: [{
|
|
88
127
|
type: Input
|
|
89
|
-
}], e2eAttr: [{
|
|
90
|
-
type: Input
|
|
91
|
-
}], customLabelRightContent: [{
|
|
92
|
-
type: ContentChild,
|
|
93
|
-
args: [forwardRef(() => EuiFieldsetLabelRightContentTagDirective)]
|
|
94
|
-
}], customLabelExtraContent: [{
|
|
95
|
-
type: ContentChild,
|
|
96
|
-
args: [forwardRef(() => EuiFieldsetLabelExtraContentTagDirective)]
|
|
97
|
-
}], expand: [{
|
|
98
|
-
type: Output
|
|
99
128
|
}], hasDefaultIcon: [{
|
|
100
129
|
type: Input
|
|
101
130
|
}], isExpandable: [{
|
|
@@ -104,6 +133,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ng
|
|
|
104
133
|
type: Input
|
|
105
134
|
}], isLarge: [{
|
|
106
135
|
type: Input
|
|
136
|
+
}], isFirst: [{
|
|
137
|
+
type: Input
|
|
138
|
+
}], euiHighlighted: [{
|
|
139
|
+
type: Input
|
|
140
|
+
}], expand: [{
|
|
141
|
+
type: Output
|
|
142
|
+
}], customLabelRightContent: [{
|
|
143
|
+
type: ContentChild,
|
|
144
|
+
args: [forwardRef(() => EuiFieldsetLabelRightContentTagDirective)]
|
|
145
|
+
}], customLabelExtraContent: [{
|
|
146
|
+
type: ContentChild,
|
|
147
|
+
args: [forwardRef(() => EuiFieldsetLabelExtraContentTagDirective)]
|
|
107
148
|
}] } });
|
|
108
149
|
/* eslint-disable */
|
|
109
150
|
class EuiFieldsetLabelRightContentTagDirective {
|
|
@@ -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 Component,\n ContentChild,\n Directive,\n EventEmitter,\n forwardRef,\n HostBinding,\n Input,\n Output,\n QueryList,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { BaseDirective } from '@eui/components/shared';\nimport { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\n\n@Component({\n selector: 'eui-fieldset',\n templateUrl: './eui-fieldset.component.html',\n styleUrls: ['./styles/_index.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiFieldsetComponent extends BaseDirective {\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('eui-fieldset'),\n this.isFirst ? 'eui-fieldset--first' : '',\n this.isExpandable ? 'eui-fieldset--expandable' : '',\n ]\n .join(' ')\n .trim();\n }\n\n @Input() id: string;\n @Input() label: string;\n @Input() iconClass: string;\n @Input() iconSvgName: string;\n @Input()\n public get isFirst(): boolean {\n return this._isFirst;\n }\n public set isFirst(value: BooleanInput) {\n this._isFirst = coerceBooleanProperty(value);\n }\n\n @Input() e2eAttr = 'eui-fieldset';\n\n public stateClass: string;\n public headerStateClass: string;\n public typeClass: string;\n\n public expandMenuLabel = 'Expand ';\n public collapseMenuLabel = 'Collapse ';\n\n @ContentChild(forwardRef(() => EuiFieldsetLabelRightContentTagDirective))\n customLabelRightContent: QueryList<EuiFieldsetLabelRightContentTagDirective>;\n @ContentChild(forwardRef(() => EuiFieldsetLabelExtraContentTagDirective))\n customLabelExtraContent: QueryList<EuiFieldsetLabelExtraContentTagDirective>;\n @Output() expand: EventEmitter<string> = new EventEmitter();\n private _isFirst = false;\n @Input()\n public get hasDefaultIcon(): boolean {\n return this._hasDefaultIcon;\n }\n public set hasDefaultIcon(value: boolean | string) {\n this._hasDefaultIcon = coerceBooleanProperty(value);\n }\n private _hasDefaultIcon = false;\n\n @Input()\n get isExpandable(): boolean {\n return this._isExpandable;\n }\n set isExpandable(value: BooleanInput) {\n this._isExpandable = coerceBooleanProperty(value);\n }\n private _isExpandable = false;\n\n @Input()\n get isExpanded(): boolean {\n return this._isExpanded;\n }\n set isExpanded(value: BooleanInput) {\n this._isExpanded = coerceBooleanProperty(value);\n }\n private _isExpanded = true;\n\n @Input()\n get isLarge(): boolean {\n return this._isLarge;\n }\n set isLarge(value: BooleanInput) {\n this._isLarge = coerceBooleanProperty(value);\n }\n private _isLarge = false;\n\n constructor() {\n super();\n }\n\n public 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'})\nexport class EuiFieldsetLabelRightContentTagDirective {\n}\n@Directive({selector: 'euiFieldsetLabelExtraContent'})\nexport class EuiFieldsetLabelExtraContentTagDirective {\n}\n/* eslint-enable */\n","<div class=\"eui-fieldset__container\">\n <div *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n <div *ngIf=\"iconClass\" class=\"eui-fieldset__header-icon eui-icon {{ iconClass }}\"></div>\n <!-- V15 OK-->\n <div *ngIf=\"iconSvgName\" class=\"eui-fieldset__header-icon\">\n <eui-icon-svg icon=\"{{ iconSvgName }}\" fillColor=\"{{ typeClass }}\"></eui-icon-svg>\n </div>\n <div\n *ngIf=\"!iconClass && hasDefaultIcon && (euiInfo || euiSuccess || euiWarning || euiDanger)\"\n class=\"eui-fieldset__header-icon\">\n <eui-icon-svg *ngIf=\"euiInfo\" icon=\"eui-info\" fillColor=\"info-100\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"euiSuccess\" icon=\"eui-ecl-check-filled\" fillColor=\"success-100\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"euiWarning\" icon=\"eui-ecl-warning\" fillColor=\"warning-140\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"euiDanger\" icon=\"eui-ecl-error\" fillColor=\"danger-100\"></eui-icon-svg>\n </div>\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-template [ngIf]=\"customLabelRightContent\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n </ng-template>\n <button\n *ngIf=\"isExpandable\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n euiSecondary\n type=\"button\"\n class=\"eui-fieldset__header-expand-toggle\"\n [class.eui-fieldset__header-expand-toggle--expanded]=\"isExpanded\"\n [attr.aria-label]=\"!isExpanded ? expandMenuLabel + label : collapseMenuLabel + label\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n <div *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n <ng-content></ng-content>\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 {\n EuiFieldsetComponent,\n EuiFieldsetLabelExtraContentTagDirective,\n EuiFieldsetLabelRightContentTagDirective,\n} from './eui-fieldset.component';\n\n@NgModule({\n imports: [CommonModule, EuiButtonModule, EuiIconModule],\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 Component,\n ContentChild,\n Directive,\n EventEmitter,\n forwardRef,\n HostBinding,\n Input,\n OnChanges,\n Output,\n QueryList,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBoolean } from '@eui/base';\n\n@Component({\n selector: 'eui-fieldset',\n templateUrl: './eui-fieldset.component.html',\n styleUrls: ['./styles/_index.scss'],\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [\n {\n directive: BaseStatesDirective,\n inputs: [\n 'euiSecondary',\n 'euiSuccess',\n 'euiInfo',\n 'euiWarning',\n 'euiDanger',\n 'euiAccent',\n 'euiVariant',\n 'euiHighlighted', // TODO v17 doesn't work bound in showcase... not recognized as an input\n ],\n },\n ],\n})\nexport class EuiFieldsetComponent implements OnChanges {\n @HostBinding('class')\n public get cssClasses(): string {\n return this.getCssClasses();\n }\n\n @HostBinding('attr.data-e2e')\n @Input()\n 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()\n @coerceBoolean\n hasDefaultIcon: BooleanInput = false;\n\n @Input()\n @coerceBoolean\n isExpandable: BooleanInput = false;\n\n @Input()\n @coerceBoolean\n isExpanded: BooleanInput = false;\n\n @Input()\n @coerceBoolean\n isLarge: BooleanInput = false;\n\n @Input()\n @coerceBoolean\n isFirst: BooleanInput = false;\n\n // TODO v17 doesn't work bound in showcase... not recognized as an input\n @Input()\n @coerceBoolean\n euiHighlighted: BooleanInput = 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 @ContentChild(forwardRef(() => EuiFieldsetLabelRightContentTagDirective))\n customLabelRightContent: QueryList<EuiFieldsetLabelRightContentTagDirective>;\n @ContentChild(forwardRef(() => EuiFieldsetLabelExtraContentTagDirective))\n customLabelExtraContent: QueryList<EuiFieldsetLabelExtraContentTagDirective>;\n\n constructor(public baseStatesDirective: BaseStatesDirective) {}\n\n ngOnChanges(): void {\n this.setIcon();\n }\n\n onToggle(): void {\n if (this.isExpandable) {\n this.isExpanded = !this.isExpanded;\n this.expand.emit(this.id);\n }\n }\n\n private getCssClasses(): string {\n return [\n this.baseStatesDirective.getCssClasses('eui-fieldset'),\n this.isFirst ? 'eui-fieldset--first' : '',\n this.isExpandable ? 'eui-fieldset--expandable' : '',\n // TODO v17 doesn't work bound in showcase... not recognized as an input\n this.euiHighlighted ? 'eui-fieldset--highlighted': '',\n ].join(' ').trim();\n }\n\n private setIcon(): void {\n this.iconSvgType = 'eui-ecl-information';\n if (this.baseStatesDirective.euiWarning) {\n this.iconSvgType = 'eui-ecl-warning';\n }\n if (this.baseStatesDirective.euiDanger) {\n this.iconSvgType = 'eui-ecl-error';\n }\n if (this.baseStatesDirective.euiSuccess) {\n this.iconSvgType = 'eui-ecl-check-filled';\n }\n if (this.baseStatesDirective.euiSecondary) {\n this.iconSvgType = 'eui-question';\n }\n\n // TODO v17 need to have some coherence with icon status (alert / growl / fieldset here / others...)\n // default status icon defs : here for growl / alert are different\n // <eui-icon-svg *ngIf=\"msg.severity === 'info'\" icon=\"eui-ecl-information\"></eui-icon-svg>\n // <eui-icon-svg *ngIf=\"msg.severity === 'warning'\" icon=\"eui-ecl-warning\"></eui-icon-svg>\n // <eui-icon-svg *ngIf=\"msg.severity === 'danger'\" icon=\"eui-ecl-error\"></eui-icon-svg>\n // <eui-icon-svg *ngIf=\"msg.severity === 'success'\" icon=\"eui-ecl-check-filled\"></eui-icon-svg>\n }\n}\n\n/* eslint-disable */\n@Directive({selector: 'euiFieldsetLabelRightContent'})\nexport class EuiFieldsetLabelRightContentTagDirective {\n}\n@Directive({selector: 'euiFieldsetLabelExtraContent'})\nexport class EuiFieldsetLabelExtraContentTagDirective {\n}\n/* eslint-enable */\n","<div class=\"eui-fieldset__container\">\n <div *ngIf=\"label\" class=\"eui-fieldset__header\" (click)=\"onToggle()\">\n <div class=\"eui-fieldset__header-label\" [class.eui-fieldset__header-label--large]=\"isLarge\">\n <div *ngIf=\"iconClass\" class=\"eui-fieldset__header-icon eui-icon {{ iconClass }}\"></div>\n <div *ngIf=\"iconSvgName\" class=\"eui-fieldset__header-icon\">\n <eui-icon-svg icon=\"{{ iconSvgName }}\" fillColor=\"{{ iconSvgFillColor }}\"></eui-icon-svg>\n </div>\n <div *ngIf=\"!iconClass && hasDefaultIcon\" class=\"eui-fieldset__header-icon\">\n <eui-icon-svg [icon]=\"iconSvgType\"></eui-icon-svg>\n </div>\n <span euiLabel>{{ label }}</span>\n <ng-content select=\"euiFieldsetLabelExtraContent\"></ng-content>\n </div>\n <div class=\"eui-fieldset__header-right-content\">\n <ng-template [ngIf]=\"customLabelRightContent\">\n <ng-content select=\"euiFieldsetLabelRightContent\"></ng-content>\n </ng-template>\n <button\n *ngIf=\"isExpandable\"\n euiButton\n euiRounded\n euiIconButton\n euiSizeS\n euiBasicButton\n euiSecondary\n type=\"button\"\n class=\"eui-fieldset__header-expand-toggle\"\n [class.eui-fieldset__header-expand-toggle--expanded]=\"isExpanded\"\n [attr.aria-label]=\"!isExpanded ? expandMenuLabel + label : collapseMenuLabel + label\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n <div *ngIf=\"isExpanded\" class=\"eui-fieldset__content\">\n <ng-content></ng-content>\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 {\n EuiFieldsetComponent,\n EuiFieldsetLabelExtraContentTagDirective,\n EuiFieldsetLabelRightContentTagDirective,\n} from './eui-fieldset.component';\n\n@NgModule({\n imports: [CommonModule, EuiButtonModule, EuiIconModule],\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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"}
|
|
@@ -91,11 +91,11 @@ class EuiGrowlComponent {
|
|
|
91
91
|
return this.value?.length ? this.value.findIndex((value) => value === msg) : -1;
|
|
92
92
|
}
|
|
93
93
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiGrowlComponent, deps: [{ token: i0.ElementRef }, { token: i0.IterableDiffers }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
94
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiGrowlComponent, selector: "eui-growl", inputs: { sticky: "sticky", life: "life", value: "value", style: "style", styleClass: "styleClass", position: "position", e2eAttr: "e2eAttr", closeAllSticky: "closeAllSticky" }, outputs: { growlClick: "growlClick" }, viewQueries: [{ propertyName: "containerViewChild", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div\n #container\n role=\"region\"\n aria-live=\"polite\"\n class=\"eui-growl {{ styleClass }} eui-growl--{{ position }}\"\n (click)=\"onClick()\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div\n #msgel\n *ngFor=\"let msg of value\"\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast\"\n [ngClass]=\"{\n 'eui-growl-item-container--info': msg.severity === 'info',\n 'eui-growl-item-container--warning': msg.severity === 'warning',\n 'eui-growl-item-container--danger': msg.severity === 'danger',\n 'eui-growl-item-container--success': msg.severity === 'success',\n 'eui-growl--sticky': sticky\n }\"\n [class.eui-u-anim--slideInUp]=\"position === 'bottom-left' || position === 'bottom-center' || position === 'bottom-right'\"\n [class.eui-u-anim--slideInDown]=\"position === 'top-left' || position === 'top-center' || position === 'top-right'\">\n <div class=\"eui-growl-item\">\n <eui-icon-svg *ngIf=\"msg.severity === 'info'\" icon=\"eui-ecl-information\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'warning'\" icon=\"eui-ecl-warning\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'danger'\" icon=\"eui-ecl-error\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'success'\" icon=\"eui-ecl-check-filled\"></eui-icon-svg>\n\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ msg.summary }}</span>\n <p class=\"eui-growl-item-message-detail\" [innerHTML]=\"msg.detail\"></p>\n </div>\n <div class=\"eui-growl-item-close\" (click)=\"remove(msg)\">\n <eui-icon-svg icon=\"eui-close\"></eui-icon-svg>\n </div>\n </div>\n </div>\n <div\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast eui-growl-item-container--info\"\n *ngIf=\"closeAllSticky && isGrowlMoreThanTwo()\">\n <div class=\"eui-growl-item\">\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ 'eui.growl.dismiss-all' | translate }}</span>\n </div>\n <div class=\"eui-growl-item-close eui-icon eui-icon-close-m\" (click)=\"removeAll()\"></div>\n </div>\n </div>\n</div>\n", styles: [".eui-growl{--eui-bottom-left-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-left-vertical-offset: var(--eui-base-spacing-l);--eui-bottom-right-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-right-vertical-offset: var(--eui-base-spacing-l);position:fixed;width:20rem;z-index:var(--eui-base-z-index-growl-message)}.eui-growl--bottom-left{bottom:var(--eui-bottom-left-vertical-offset);left:var(--eui-bottom-left-horizontal-offset)}.eui-growl--bottom-center{bottom:var(--eui-base-spacing-l);right:50%;transform:translate(50%)}.eui-growl--bottom-right{bottom:var(--eui-bottom-right-vertical-offset);right:var(--eui-bottom-right-horizontal-offset)}.eui-growl--top-left{left:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl--top-center{right:50%;top:var(--eui-base-spacing-l);transform:translate(50%)}.eui-growl--top-right{right:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl a{color:var(--eui-base-color-white)!important;text-decoration:underline}.eui-growl-item-container{color:var(--eui-base-color-white);filter:alpha(opacity=95);margin:0 0 10px;opacity:.95;position:relative}.eui-growl-item-container.eui-growl-item-container--info{background-color:var(--eui-base-color-info-100);border-bottom:4px solid var(--eui-base-color-info-130)}.eui-growl-item-container.eui-growl-item-container--warning{background-color:var(--eui-base-color-warning-100);border-bottom:4px solid var(--eui-base-color-warning-130)}.eui-growl-item-container.eui-growl-item-container--success{background-color:var(--eui-base-color-success-100);border-bottom:4px solid var(--eui-base-color-success-130)}.eui-growl-item-container.eui-growl-item-container--danger{background-color:var(--eui-base-color-danger-100);border-bottom:4px solid var(--eui-base-color-danger-130)}.eui-growl-item-image{display:flex;text-shadow:1px 1px 1px rgba(0,0,0,.25)}.eui-growl-item{display:flex;padding:var(--eui-base-spacing-s);position:relative;width:20rem}.eui-growl-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:var(--eui-base-spacing-xl);width:var(--eui-base-spacing-xl)}.eui-growl-item-close{cursor:pointer;font-size:var(--eui-base-font-size);margin-left:auto;padding:var(--eui-base-spacing-2xs)}.eui-growl-item-close .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs))}.eui-growl-item-message{display:block;margin-left:var(--eui-base-spacing-s);overflow-y:auto;max-height:80vh}.eui-growl-item-message::-webkit-scrollbar{display:inherit;height:4px;width:4px;background-color:var(--eui-base-color-grey-5)}.eui-growl-item-message::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-growl-item-message::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-35)}.eui-growl-item-message::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-growl-item-message-title{display:block;padding:var(--eui-base-spacing-2xs) 0 var(--eui-base-spacing-xs) 0;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-growl-item-message-detail{display:block;margin:0;padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
94
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiGrowlComponent, selector: "eui-growl", inputs: { sticky: "sticky", life: "life", value: "value", style: "style", styleClass: "styleClass", position: "position", e2eAttr: "e2eAttr", closeAllSticky: "closeAllSticky" }, outputs: { growlClick: "growlClick" }, viewQueries: [{ propertyName: "containerViewChild", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div\n #container\n role=\"region\"\n aria-live=\"polite\"\n class=\"eui-growl {{ styleClass }} eui-growl--{{ position }}\"\n (click)=\"onClick()\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div\n #msgel\n *ngFor=\"let msg of value\"\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast\"\n [ngClass]=\"{\n 'eui-growl-item-container--info': msg.severity === 'info',\n 'eui-growl-item-container--warning': msg.severity === 'warning',\n 'eui-growl-item-container--danger': msg.severity === 'danger',\n 'eui-growl-item-container--success': msg.severity === 'success',\n 'eui-growl--sticky': sticky\n }\"\n [class.eui-u-anim--slideInUp]=\"position === 'bottom-left' || position === 'bottom-center' || position === 'bottom-right'\"\n [class.eui-u-anim--slideInDown]=\"position === 'top-left' || position === 'top-center' || position === 'top-right'\">\n <div class=\"eui-growl-item\">\n <eui-icon-svg *ngIf=\"msg.severity === 'info'\" icon=\"eui-ecl-information\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'warning'\" icon=\"eui-ecl-warning\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'danger'\" icon=\"eui-ecl-error\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'success'\" icon=\"eui-ecl-check-filled\"></eui-icon-svg>\n\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ msg.summary }}</span>\n <p class=\"eui-growl-item-message-detail\" [innerHTML]=\"msg.detail\"></p>\n </div>\n <div class=\"eui-growl-item-close\" (click)=\"remove(msg)\">\n <eui-icon-svg icon=\"eui-close\"></eui-icon-svg>\n </div>\n </div>\n </div>\n <div\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast eui-growl-item-container--info\"\n *ngIf=\"closeAllSticky && isGrowlMoreThanTwo()\">\n <div class=\"eui-growl-item\">\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ 'eui.growl.dismiss-all' | translate }}</span>\n </div>\n <div class=\"eui-growl-item-close eui-icon eui-icon-close-m\" (click)=\"removeAll()\"></div>\n </div>\n </div>\n</div>\n", styles: [".eui-growl{--eui-bottom-left-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-left-vertical-offset: var(--eui-base-spacing-l);--eui-bottom-right-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-right-vertical-offset: var(--eui-base-spacing-l);position:fixed;width:20rem;z-index:var(--eui-base-z-index-growl-message)}.eui-growl--bottom-left{bottom:var(--eui-bottom-left-vertical-offset);left:var(--eui-bottom-left-horizontal-offset)}.eui-growl--bottom-center{bottom:var(--eui-base-spacing-l);right:50%;transform:translate(50%)}.eui-growl--bottom-right{bottom:var(--eui-bottom-right-vertical-offset);right:var(--eui-bottom-right-horizontal-offset)}.eui-growl--top-left{left:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl--top-center{right:50%;top:var(--eui-base-spacing-l);transform:translate(50%)}.eui-growl--top-right{right:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl a{color:var(--eui-base-color-white)!important;text-decoration:underline}.eui-growl-item-container{color:var(--eui-base-color-white);filter:alpha(opacity=95);margin:0 0 10px;opacity:.95;position:relative}.eui-growl-item-container.eui-growl-item-container--info{background-color:var(--eui-base-color-info-100);border-bottom:4px solid var(--eui-base-color-info-130)}.eui-growl-item-container.eui-growl-item-container--warning{background-color:var(--eui-base-color-warning-100);border-bottom:4px solid var(--eui-base-color-warning-130)}.eui-growl-item-container.eui-growl-item-container--success{background-color:var(--eui-base-color-success-100);border-bottom:4px solid var(--eui-base-color-success-130)}.eui-growl-item-container.eui-growl-item-container--danger{background-color:var(--eui-base-color-danger-100);border-bottom:4px solid var(--eui-base-color-danger-130)}.eui-growl-item-image{display:flex;text-shadow:1px 1px 1px rgba(0,0,0,.25)}.eui-growl-item{display:flex;padding:var(--eui-base-spacing-s);position:relative;width:20rem}.eui-growl-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:var(--eui-base-spacing-xl);width:var(--eui-base-spacing-xl)}.eui-growl-item-close{cursor:pointer;font-size:var(--eui-base-font-size);margin-left:auto;padding:var(--eui-base-spacing-2xs)}.eui-growl-item-close .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs))}.eui-growl-item-message{display:block;margin-left:var(--eui-base-spacing-s);overflow-y:auto;max-height:80vh}.eui-growl-item-message::-webkit-scrollbar{display:inherit;height:4px;width:4px;background-color:var(--eui-base-color-grey-5)}.eui-growl-item-message::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-growl-item-message::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-35)}.eui-growl-item-message::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-growl-item-message code{color:var(--eui-base-color-grey-5);font-size:var(--eui-base-font-size-xs);word-wrap:break-word}.eui-growl-item-message-title{display:block;padding:var(--eui-base-spacing-2xs) 0 var(--eui-base-spacing-xs) 0;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-growl-item-message-detail{display:block;margin:0;padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
95
95
|
}
|
|
96
96
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiGrowlComponent, decorators: [{
|
|
97
97
|
type: Component,
|
|
98
|
-
args: [{ selector: 'eui-growl', encapsulation: ViewEncapsulation.None, template: "<div\n #container\n role=\"region\"\n aria-live=\"polite\"\n class=\"eui-growl {{ styleClass }} eui-growl--{{ position }}\"\n (click)=\"onClick()\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div\n #msgel\n *ngFor=\"let msg of value\"\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast\"\n [ngClass]=\"{\n 'eui-growl-item-container--info': msg.severity === 'info',\n 'eui-growl-item-container--warning': msg.severity === 'warning',\n 'eui-growl-item-container--danger': msg.severity === 'danger',\n 'eui-growl-item-container--success': msg.severity === 'success',\n 'eui-growl--sticky': sticky\n }\"\n [class.eui-u-anim--slideInUp]=\"position === 'bottom-left' || position === 'bottom-center' || position === 'bottom-right'\"\n [class.eui-u-anim--slideInDown]=\"position === 'top-left' || position === 'top-center' || position === 'top-right'\">\n <div class=\"eui-growl-item\">\n <eui-icon-svg *ngIf=\"msg.severity === 'info'\" icon=\"eui-ecl-information\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'warning'\" icon=\"eui-ecl-warning\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'danger'\" icon=\"eui-ecl-error\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'success'\" icon=\"eui-ecl-check-filled\"></eui-icon-svg>\n\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ msg.summary }}</span>\n <p class=\"eui-growl-item-message-detail\" [innerHTML]=\"msg.detail\"></p>\n </div>\n <div class=\"eui-growl-item-close\" (click)=\"remove(msg)\">\n <eui-icon-svg icon=\"eui-close\"></eui-icon-svg>\n </div>\n </div>\n </div>\n <div\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast eui-growl-item-container--info\"\n *ngIf=\"closeAllSticky && isGrowlMoreThanTwo()\">\n <div class=\"eui-growl-item\">\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ 'eui.growl.dismiss-all' | translate }}</span>\n </div>\n <div class=\"eui-growl-item-close eui-icon eui-icon-close-m\" (click)=\"removeAll()\"></div>\n </div>\n </div>\n</div>\n", styles: [".eui-growl{--eui-bottom-left-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-left-vertical-offset: var(--eui-base-spacing-l);--eui-bottom-right-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-right-vertical-offset: var(--eui-base-spacing-l);position:fixed;width:20rem;z-index:var(--eui-base-z-index-growl-message)}.eui-growl--bottom-left{bottom:var(--eui-bottom-left-vertical-offset);left:var(--eui-bottom-left-horizontal-offset)}.eui-growl--bottom-center{bottom:var(--eui-base-spacing-l);right:50%;transform:translate(50%)}.eui-growl--bottom-right{bottom:var(--eui-bottom-right-vertical-offset);right:var(--eui-bottom-right-horizontal-offset)}.eui-growl--top-left{left:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl--top-center{right:50%;top:var(--eui-base-spacing-l);transform:translate(50%)}.eui-growl--top-right{right:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl a{color:var(--eui-base-color-white)!important;text-decoration:underline}.eui-growl-item-container{color:var(--eui-base-color-white);filter:alpha(opacity=95);margin:0 0 10px;opacity:.95;position:relative}.eui-growl-item-container.eui-growl-item-container--info{background-color:var(--eui-base-color-info-100);border-bottom:4px solid var(--eui-base-color-info-130)}.eui-growl-item-container.eui-growl-item-container--warning{background-color:var(--eui-base-color-warning-100);border-bottom:4px solid var(--eui-base-color-warning-130)}.eui-growl-item-container.eui-growl-item-container--success{background-color:var(--eui-base-color-success-100);border-bottom:4px solid var(--eui-base-color-success-130)}.eui-growl-item-container.eui-growl-item-container--danger{background-color:var(--eui-base-color-danger-100);border-bottom:4px solid var(--eui-base-color-danger-130)}.eui-growl-item-image{display:flex;text-shadow:1px 1px 1px rgba(0,0,0,.25)}.eui-growl-item{display:flex;padding:var(--eui-base-spacing-s);position:relative;width:20rem}.eui-growl-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:var(--eui-base-spacing-xl);width:var(--eui-base-spacing-xl)}.eui-growl-item-close{cursor:pointer;font-size:var(--eui-base-font-size);margin-left:auto;padding:var(--eui-base-spacing-2xs)}.eui-growl-item-close .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs))}.eui-growl-item-message{display:block;margin-left:var(--eui-base-spacing-s);overflow-y:auto;max-height:80vh}.eui-growl-item-message::-webkit-scrollbar{display:inherit;height:4px;width:4px;background-color:var(--eui-base-color-grey-5)}.eui-growl-item-message::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-growl-item-message::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-35)}.eui-growl-item-message::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-growl-item-message-title{display:block;padding:var(--eui-base-spacing-2xs) 0 var(--eui-base-spacing-xs) 0;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-growl-item-message-detail{display:block;margin:0;padding:0}\n"] }]
|
|
98
|
+
args: [{ selector: 'eui-growl', encapsulation: ViewEncapsulation.None, template: "<div\n #container\n role=\"region\"\n aria-live=\"polite\"\n class=\"eui-growl {{ styleClass }} eui-growl--{{ position }}\"\n (click)=\"onClick()\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div\n #msgel\n *ngFor=\"let msg of value\"\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast\"\n [ngClass]=\"{\n 'eui-growl-item-container--info': msg.severity === 'info',\n 'eui-growl-item-container--warning': msg.severity === 'warning',\n 'eui-growl-item-container--danger': msg.severity === 'danger',\n 'eui-growl-item-container--success': msg.severity === 'success',\n 'eui-growl--sticky': sticky\n }\"\n [class.eui-u-anim--slideInUp]=\"position === 'bottom-left' || position === 'bottom-center' || position === 'bottom-right'\"\n [class.eui-u-anim--slideInDown]=\"position === 'top-left' || position === 'top-center' || position === 'top-right'\">\n <div class=\"eui-growl-item\">\n <eui-icon-svg *ngIf=\"msg.severity === 'info'\" icon=\"eui-ecl-information\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'warning'\" icon=\"eui-ecl-warning\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'danger'\" icon=\"eui-ecl-error\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'success'\" icon=\"eui-ecl-check-filled\"></eui-icon-svg>\n\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ msg.summary }}</span>\n <p class=\"eui-growl-item-message-detail\" [innerHTML]=\"msg.detail\"></p>\n </div>\n <div class=\"eui-growl-item-close\" (click)=\"remove(msg)\">\n <eui-icon-svg icon=\"eui-close\"></eui-icon-svg>\n </div>\n </div>\n </div>\n <div\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast eui-growl-item-container--info\"\n *ngIf=\"closeAllSticky && isGrowlMoreThanTwo()\">\n <div class=\"eui-growl-item\">\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ 'eui.growl.dismiss-all' | translate }}</span>\n </div>\n <div class=\"eui-growl-item-close eui-icon eui-icon-close-m\" (click)=\"removeAll()\"></div>\n </div>\n </div>\n</div>\n", styles: [".eui-growl{--eui-bottom-left-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-left-vertical-offset: var(--eui-base-spacing-l);--eui-bottom-right-horizontal-offset: var(--eui-base-spacing-l);--eui-bottom-right-vertical-offset: var(--eui-base-spacing-l);position:fixed;width:20rem;z-index:var(--eui-base-z-index-growl-message)}.eui-growl--bottom-left{bottom:var(--eui-bottom-left-vertical-offset);left:var(--eui-bottom-left-horizontal-offset)}.eui-growl--bottom-center{bottom:var(--eui-base-spacing-l);right:50%;transform:translate(50%)}.eui-growl--bottom-right{bottom:var(--eui-bottom-right-vertical-offset);right:var(--eui-bottom-right-horizontal-offset)}.eui-growl--top-left{left:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl--top-center{right:50%;top:var(--eui-base-spacing-l);transform:translate(50%)}.eui-growl--top-right{right:var(--eui-base-spacing-l);top:var(--eui-base-spacing-l)}.eui-growl a{color:var(--eui-base-color-white)!important;text-decoration:underline}.eui-growl-item-container{color:var(--eui-base-color-white);filter:alpha(opacity=95);margin:0 0 10px;opacity:.95;position:relative}.eui-growl-item-container.eui-growl-item-container--info{background-color:var(--eui-base-color-info-100);border-bottom:4px solid var(--eui-base-color-info-130)}.eui-growl-item-container.eui-growl-item-container--warning{background-color:var(--eui-base-color-warning-100);border-bottom:4px solid var(--eui-base-color-warning-130)}.eui-growl-item-container.eui-growl-item-container--success{background-color:var(--eui-base-color-success-100);border-bottom:4px solid var(--eui-base-color-success-130)}.eui-growl-item-container.eui-growl-item-container--danger{background-color:var(--eui-base-color-danger-100);border-bottom:4px solid var(--eui-base-color-danger-130)}.eui-growl-item-image{display:flex;text-shadow:1px 1px 1px rgba(0,0,0,.25)}.eui-growl-item{display:flex;padding:var(--eui-base-spacing-s);position:relative;width:20rem}.eui-growl-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:var(--eui-base-spacing-xl);width:var(--eui-base-spacing-xl)}.eui-growl-item-close{cursor:pointer;font-size:var(--eui-base-font-size);margin-left:auto;padding:var(--eui-base-spacing-2xs)}.eui-growl-item-close .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white);height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs))}.eui-growl-item-message{display:block;margin-left:var(--eui-base-spacing-s);overflow-y:auto;max-height:80vh}.eui-growl-item-message::-webkit-scrollbar{display:inherit;height:4px;width:4px;background-color:var(--eui-base-color-grey-5)}.eui-growl-item-message::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-growl-item-message::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-35)}.eui-growl-item-message::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-growl-item-message code{color:var(--eui-base-color-grey-5);font-size:var(--eui-base-font-size-xs);word-wrap:break-word}.eui-growl-item-message-title{display:block;padding:var(--eui-base-spacing-2xs) 0 var(--eui-base-spacing-xs) 0;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-growl-item-message-detail{display:block;margin:0;padding:0}\n"] }]
|
|
99
99
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.IterableDiffers }], propDecorators: { sticky: [{
|
|
100
100
|
type: Input
|
|
101
101
|
}], life: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-components-eui-growl.mjs","sources":["../../eui-growl/eui-growl.component.ts","../../eui-growl/eui-growl.component.html","../../eui-growl/eui-growl.module.ts","../../eui-growl/eui-components-eui-growl.ts"],"sourcesContent":["import { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\nimport {\n Component,\n DoCheck,\n ElementRef,\n EventEmitter,\n Input,\n IterableDiffer,\n IterableDiffers,\n OnDestroy,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { EuiGrowlMessage } from '@eui/core';\n@Component({\n selector: 'eui-growl',\n templateUrl: './eui-growl.component.html',\n styleUrls: ['./styles/_index.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiGrowlComponent implements DoCheck, OnDestroy {\n @Input()\n get sticky(): boolean {\n return this._sticky;\n }\n set sticky(value: BooleanInput) {\n this._sticky = coerceBooleanProperty(value);\n }\n @Input() life = 3000;\n @Input() value: EuiGrowlMessage[] = [];\n // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Input() style: any;\n @Input() styleClass: string;\n @Input() position: string;\n @Input() e2eAttr = 'eui-growl';\n @Output() growlClick: EventEmitter<void> = new EventEmitter<void>();\n @Input() closeAllSticky = false;\n\n @ViewChild('container') containerViewChild: ElementRef<HTMLDivElement>;\n\n private differ: IterableDiffer<EuiGrowlMessage>;\n private _sticky = false;\n\n constructor(\n public el: ElementRef,\n differs: IterableDiffers,\n ) {\n this.differ = differs.find([]).create(undefined);\n }\n\n ngDoCheck(): void {\n const changes = this.differ.diff(this.value);\n\n if (changes) {\n // clear timeout in queue to avoid memory leak\n changes.forEachRemovedItem(({ item }) => clearTimeout(item?.timeout));\n // for newly added items create timeout if they are not sticky\n changes.forEachAddedItem(({ item }) => this.createRemovalTimeout(item));\n }\n }\n\n /**\n * @param msg The text message to appear in the container\n */\n remove(msg: EuiGrowlMessage): void;\n /**\n * @deprecated This is DEPRECATED please use it like remove(msg: UxMessage);\n * @param msg\n * @param msgel @deprecated\n */\n // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n remove(msg: EuiGrowlMessage, msgel?: any): void {\n if (msgel) {\n console.warn(\n 'This is DEPRECATED please use it like remove(msg: UxMessage);\\n' + 'This will be a breaking change in the eUI release.',\n );\n }\n this.value.splice(this.findMessageIndex(msg), 1);\n }\n\n /**\n * Removes all growl messages from the stack\n */\n removeAll(): void {\n if (this.value?.length) {\n this.value.splice(0, this.value.length);\n }\n }\n\n ngOnDestroy(): void {\n if (!this.sticky) {\n // make sure to clear any leftover async Timeout for messages\n this.value.forEach((v) => clearTimeout(v?.timeout));\n }\n }\n\n onClick(): void {\n this.growlClick.emit();\n }\n\n /**\n * check whether sticky growls are greater than two\n */\n isGrowlMoreThanTwo(): boolean {\n return this.value.filter((m) => m.sticky).length > 2;\n }\n\n /**\n * Removes all growl messages from the stack\n *\n * @param msg UxMessage\n */\n private createRemovalTimeout(value: EuiGrowlMessage): void {\n // if message it's NOT sticky and there's not any async running timeout\n if (!value.sticky && !value.timeout) {\n // set Timeout callback for each message based on the given life value\n value.timeout = setTimeout(() => this.remove(value), value.life || this.life);\n }\n }\n\n /**\n * Finds UxMessage index of the array otherwise returns -1\n *\n * @param msg UxMessage\n */\n private findMessageIndex(msg: EuiGrowlMessage): number {\n return this.value?.length ? this.value.findIndex((value) => value === msg) : -1;\n }\n}\n","<div\n #container\n role=\"region\"\n aria-live=\"polite\"\n class=\"eui-growl {{ styleClass }} eui-growl--{{ position }}\"\n (click)=\"onClick()\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div\n #msgel\n *ngFor=\"let msg of value\"\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast\"\n [ngClass]=\"{\n 'eui-growl-item-container--info': msg.severity === 'info',\n 'eui-growl-item-container--warning': msg.severity === 'warning',\n 'eui-growl-item-container--danger': msg.severity === 'danger',\n 'eui-growl-item-container--success': msg.severity === 'success',\n 'eui-growl--sticky': sticky\n }\"\n [class.eui-u-anim--slideInUp]=\"position === 'bottom-left' || position === 'bottom-center' || position === 'bottom-right'\"\n [class.eui-u-anim--slideInDown]=\"position === 'top-left' || position === 'top-center' || position === 'top-right'\">\n <div class=\"eui-growl-item\">\n <eui-icon-svg *ngIf=\"msg.severity === 'info'\" icon=\"eui-ecl-information\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'warning'\" icon=\"eui-ecl-warning\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'danger'\" icon=\"eui-ecl-error\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'success'\" icon=\"eui-ecl-check-filled\"></eui-icon-svg>\n\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ msg.summary }}</span>\n <p class=\"eui-growl-item-message-detail\" [innerHTML]=\"msg.detail\"></p>\n </div>\n <div class=\"eui-growl-item-close\" (click)=\"remove(msg)\">\n <eui-icon-svg icon=\"eui-close\"></eui-icon-svg>\n </div>\n </div>\n </div>\n <div\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast eui-growl-item-container--info\"\n *ngIf=\"closeAllSticky && isGrowlMoreThanTwo()\">\n <div class=\"eui-growl-item\">\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ 'eui.growl.dismiss-all' | translate }}</span>\n </div>\n <div class=\"eui-growl-item-close eui-icon eui-icon-close-m\" (click)=\"removeAll()\"></div>\n </div>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { EuiGrowlComponent } from './eui-growl.component';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { TranslateModule } from '@ngx-translate/core';\n\n@NgModule({\n imports: [CommonModule, EuiIconModule, TranslateModule],\n exports: [EuiGrowlComponent],\n declarations: [EuiGrowlComponent],\n})\nexport class EuiGrowlModule {}\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-growl.mjs","sources":["../../eui-growl/eui-growl.component.ts","../../eui-growl/eui-growl.component.html","../../eui-growl/eui-growl.module.ts","../../eui-growl/eui-components-eui-growl.ts"],"sourcesContent":["import { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\nimport {\n Component,\n DoCheck,\n ElementRef,\n EventEmitter,\n Input,\n IterableDiffer,\n IterableDiffers,\n OnDestroy,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { EuiGrowlMessage } from '@eui/core';\n@Component({\n selector: 'eui-growl',\n templateUrl: './eui-growl.component.html',\n styleUrls: ['./styles/_index.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiGrowlComponent implements DoCheck, OnDestroy {\n @Input()\n get sticky(): boolean {\n return this._sticky;\n }\n set sticky(value: BooleanInput) {\n this._sticky = coerceBooleanProperty(value);\n }\n @Input() life = 3000;\n @Input() value: EuiGrowlMessage[] = [];\n // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Input() style: any;\n @Input() styleClass: string;\n @Input() position: string;\n @Input() e2eAttr = 'eui-growl';\n @Output() growlClick: EventEmitter<void> = new EventEmitter<void>();\n @Input() closeAllSticky = false;\n\n @ViewChild('container') containerViewChild: ElementRef<HTMLDivElement>;\n\n private differ: IterableDiffer<EuiGrowlMessage>;\n private _sticky = false;\n\n constructor(\n public el: ElementRef,\n differs: IterableDiffers,\n ) {\n this.differ = differs.find([]).create(undefined);\n }\n\n ngDoCheck(): void {\n const changes = this.differ.diff(this.value);\n\n if (changes) {\n // clear timeout in queue to avoid memory leak\n changes.forEachRemovedItem(({ item }) => clearTimeout(item?.timeout));\n // for newly added items create timeout if they are not sticky\n changes.forEachAddedItem(({ item }) => this.createRemovalTimeout(item));\n }\n }\n\n /**\n * @param msg The text message to appear in the container\n */\n remove(msg: EuiGrowlMessage): void;\n /**\n * @deprecated This is DEPRECATED please use it like remove(msg: UxMessage);\n * @param msg\n * @param msgel @deprecated\n */\n // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n remove(msg: EuiGrowlMessage, msgel?: any): void {\n if (msgel) {\n console.warn(\n 'This is DEPRECATED please use it like remove(msg: UxMessage);\\n' + 'This will be a breaking change in the eUI release.',\n );\n }\n this.value.splice(this.findMessageIndex(msg), 1);\n }\n\n /**\n * Removes all growl messages from the stack\n */\n removeAll(): void {\n if (this.value?.length) {\n this.value.splice(0, this.value.length);\n }\n }\n\n ngOnDestroy(): void {\n if (!this.sticky) {\n // make sure to clear any leftover async Timeout for messages\n this.value.forEach((v) => clearTimeout(v?.timeout));\n }\n }\n\n onClick(): void {\n this.growlClick.emit();\n }\n\n /**\n * check whether sticky growls are greater than two\n */\n isGrowlMoreThanTwo(): boolean {\n return this.value.filter((m) => m.sticky).length > 2;\n }\n\n /**\n * Removes all growl messages from the stack\n *\n * @param msg UxMessage\n */\n private createRemovalTimeout(value: EuiGrowlMessage): void {\n // if message it's NOT sticky and there's not any async running timeout\n if (!value.sticky && !value.timeout) {\n // set Timeout callback for each message based on the given life value\n value.timeout = setTimeout(() => this.remove(value), value.life || this.life);\n }\n }\n\n /**\n * Finds UxMessage index of the array otherwise returns -1\n *\n * @param msg UxMessage\n */\n private findMessageIndex(msg: EuiGrowlMessage): number {\n return this.value?.length ? this.value.findIndex((value) => value === msg) : -1;\n }\n}\n","<div\n #container\n role=\"region\"\n aria-live=\"polite\"\n class=\"eui-growl {{ styleClass }} eui-growl--{{ position }}\"\n (click)=\"onClick()\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div\n #msgel\n *ngFor=\"let msg of value\"\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast\"\n [ngClass]=\"{\n 'eui-growl-item-container--info': msg.severity === 'info',\n 'eui-growl-item-container--warning': msg.severity === 'warning',\n 'eui-growl-item-container--danger': msg.severity === 'danger',\n 'eui-growl-item-container--success': msg.severity === 'success',\n 'eui-growl--sticky': sticky\n }\"\n [class.eui-u-anim--slideInUp]=\"position === 'bottom-left' || position === 'bottom-center' || position === 'bottom-right'\"\n [class.eui-u-anim--slideInDown]=\"position === 'top-left' || position === 'top-center' || position === 'top-right'\">\n <div class=\"eui-growl-item\">\n <eui-icon-svg *ngIf=\"msg.severity === 'info'\" icon=\"eui-ecl-information\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'warning'\" icon=\"eui-ecl-warning\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'danger'\" icon=\"eui-ecl-error\"></eui-icon-svg>\n <eui-icon-svg *ngIf=\"msg.severity === 'success'\" icon=\"eui-ecl-check-filled\"></eui-icon-svg>\n\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ msg.summary }}</span>\n <p class=\"eui-growl-item-message-detail\" [innerHTML]=\"msg.detail\"></p>\n </div>\n <div class=\"eui-growl-item-close\" (click)=\"remove(msg)\">\n <eui-icon-svg icon=\"eui-close\"></eui-icon-svg>\n </div>\n </div>\n </div>\n <div\n class=\"eui-growl-item-container eui-u-anim eui-u-anim--fast eui-growl-item-container--info\"\n *ngIf=\"closeAllSticky && isGrowlMoreThanTwo()\">\n <div class=\"eui-growl-item\">\n <div class=\"eui-growl-item-message\">\n <span class=\"eui-growl-item-message-title\">{{ 'eui.growl.dismiss-all' | translate }}</span>\n </div>\n <div class=\"eui-growl-item-close eui-icon eui-icon-close-m\" (click)=\"removeAll()\"></div>\n </div>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { EuiGrowlComponent } from './eui-growl.component';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { TranslateModule } from '@ngx-translate/core';\n\n@NgModule({\n imports: [CommonModule, EuiIconModule, TranslateModule],\n exports: [EuiGrowlComponent],\n declarations: [EuiGrowlComponent],\n})\nexport class EuiGrowlModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -41,12 +41,12 @@ class EuiLabelComponent extends BaseDirective {
|
|
|
41
41
|
.trim();
|
|
42
42
|
}
|
|
43
43
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
44
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiLabelComponent, 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", euiReadonly: "euiReadonly", euiSublabel: "euiSublabel" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".eui-label{display:inline-block;font-family:var(--eui-base-font-family)}.eui-label__sublabel{color:var(--eui-base-color-grey-75);display:block;font-family:var(--eui-base-font-family);margin-bottom:var(--eui-base-spacing-xs);margin-top:var(--eui-base-spacing-xs)}.eui-label--
|
|
44
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiLabelComponent, 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", euiReadonly: "euiReadonly", euiSublabel: "euiSublabel" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".eui-label{display:inline-block;font-family:var(--eui-base-font-family)}.eui-label__sublabel{color:var(--eui-base-color-grey-75);display:block;font-family:var(--eui-base-font-family);margin-bottom:var(--eui-base-spacing-xs);margin-top:var(--eui-base-spacing-xs)}.eui-label--required:after{color:var(--eui-base-color-danger-100);content:\"*\";line-height:1;padding-left:var(--eui-base-spacing-2xs);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-label--disabled{color:var(--eui-base-color-grey-50)}.eui-label--readonly{color:var(--eui-base-color-grey-65)}.eui-label--selected{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-label--size-s{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-label--size-m{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-label--primary{color:var(--eui-base-color-primary-100)}.eui-label--secondary{color:var(--eui-base-color-grey-75)}.eui-label--info{color:var(--eui-base-color-info-100)}.eui-label--success{color:var(--eui-base-color-success-100)}.eui-label--warning{color:var(--eui-base-color-warning-130)}.eui-label--danger{color:var(--eui-base-color-danger-100)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
45
45
|
}
|
|
46
46
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiLabelComponent, decorators: [{
|
|
47
47
|
type: Component,
|
|
48
48
|
args: [{ selector: `label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label,
|
|
49
|
-
label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel`, template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".eui-label{display:inline-block;font-family:var(--eui-base-font-family)}.eui-label__sublabel{color:var(--eui-base-color-grey-75);display:block;font-family:var(--eui-base-font-family);margin-bottom:var(--eui-base-spacing-xs);margin-top:var(--eui-base-spacing-xs)}.eui-label--
|
|
49
|
+
label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel`, template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".eui-label{display:inline-block;font-family:var(--eui-base-font-family)}.eui-label__sublabel{color:var(--eui-base-color-grey-75);display:block;font-family:var(--eui-base-font-family);margin-bottom:var(--eui-base-spacing-xs);margin-top:var(--eui-base-spacing-xs)}.eui-label--required:after{color:var(--eui-base-color-danger-100);content:\"*\";line-height:1;padding-left:var(--eui-base-spacing-2xs);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-label--disabled{color:var(--eui-base-color-grey-50)}.eui-label--readonly{color:var(--eui-base-color-grey-65)}.eui-label--selected{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-label--size-s{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-label--size-m{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-label--primary{color:var(--eui-base-color-primary-100)}.eui-label--secondary{color:var(--eui-base-color-grey-75)}.eui-label--info{color:var(--eui-base-color-info-100)}.eui-label--success{color:var(--eui-base-color-success-100)}.eui-label--warning{color:var(--eui-base-color-warning-130)}.eui-label--danger{color:var(--eui-base-color-danger-100)}\n"] }]
|
|
50
50
|
}], ctorParameters: () => [], propDecorators: { cssClasses: [{
|
|
51
51
|
type: HostBinding,
|
|
52
52
|
args: ['class']
|