@eui/components 18.0.0-next.33 → 18.0.0-next.35
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/EuiButtonComponent.html +1 -25
- package/docs/components/EuiButtonV2Component.html +1 -1
- package/docs/components/EuiIconSvgComponent.html +24 -70
- package/docs/dependencies.html +1 -1
- 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/EuiButtonModule.html +0 -3
- package/esm2022/eui-alert/eui-alert.component.mjs +2 -2
- package/esm2022/eui-avatar/eui-avatar.component.mjs +4 -4
- package/esm2022/eui-badge/eui-badge.component.mjs +2 -2
- package/esm2022/eui-button/eui-button.component.mjs +7 -14
- package/esm2022/eui-button-v2/eui-button-v2.component.mjs +4 -4
- package/esm2022/eui-card/components/eui-card-footer/eui-card-footer-menu-content.component.mjs +1 -1
- package/esm2022/eui-card/components/eui-card-header/eui-card-header.component.mjs +1 -1
- package/esm2022/eui-chip/eui-chip.component.mjs +2 -2
- package/esm2022/eui-chip-list/eui-chip-list.component.mjs +1 -1
- package/esm2022/eui-dashboard-card/eui-dashboard-card.component.mjs +1 -1
- package/esm2022/eui-date-range-selector/eui-date-range-selector.component.mjs +1 -1
- package/esm2022/eui-datepicker/eui-datepicker.component.mjs +1 -1
- package/esm2022/eui-dialog/container/eui-dialog-container.component.mjs +1 -1
- package/esm2022/eui-discussion-thread/eui-discussion-thread-item.component.mjs +1 -1
- package/esm2022/eui-dropdown/dropdown-item/eui-dropdown-item.component.mjs +1 -1
- package/esm2022/eui-fieldset/eui-fieldset.component.mjs +1 -1
- package/esm2022/eui-file-upload/eui-file-upload.component.mjs +1 -1
- package/esm2022/eui-file-upload/file-preview/file-preview.component.mjs +1 -1
- package/esm2022/eui-growl/eui-growl.component.mjs +1 -1
- package/esm2022/eui-icon/eui-icon-svg-button/eui-icon-svg-button.component.mjs +1 -1
- package/esm2022/eui-icon/eui-icon-svg.component.mjs +32 -51
- package/esm2022/eui-icon-toggle/eui-icon-toggle.component.mjs +1 -1
- package/esm2022/eui-language-selector/language-selector.component.mjs +1 -1
- package/esm2022/eui-language-selector/modal-selector/modal-selector.component.mjs +1 -1
- package/esm2022/eui-list/eui-list-item/eui-list-item.component.mjs +1 -1
- package/esm2022/eui-menu/eui-menu-item.component.mjs +1 -1
- package/esm2022/eui-menu/eui-menu.component.mjs +1 -1
- package/esm2022/eui-overlay/components/eui-overlay-header/eui-overlay-header-title/eui-overlay-header-title.component.mjs +1 -1
- package/esm2022/eui-page/components/eui-page-column/eui-page-column.component.mjs +1 -1
- package/esm2022/eui-page/components/eui-page-header/eui-page-header.component.mjs +1 -1
- package/esm2022/eui-paginator/eui-paginator.component.mjs +1 -1
- package/esm2022/eui-popover/eui-popover.component.mjs +1 -1
- package/esm2022/eui-progress-bar/eui-progress-bar.component.mjs +1 -1
- package/esm2022/eui-slide-toggle/eui-slide-toggle.component.mjs +1 -1
- package/esm2022/eui-table/filter/eui-table-filter.component.mjs +1 -1
- package/esm2022/eui-table/sortable-col/eui-table-sortable-col.component.mjs +1 -1
- package/esm2022/eui-tabs/eui-tabs.component.mjs +1 -1
- package/esm2022/eui-timebar/eui-timebar.component.mjs +1 -1
- package/esm2022/eui-timepicker/eui-timepicker.component.mjs +1 -1
- package/esm2022/eui-tree/eui-tree.component.mjs +1 -1
- package/esm2022/eui-tree-list/eui-tree-list-item.component.mjs +1 -1
- package/esm2022/eui-tree-list/toolbar/toolbar.component.mjs +1 -1
- package/esm2022/eui-wizard/eui-wizard.component.mjs +1 -1
- package/esm2022/externals/eui-editor/eui-editor.component.mjs +1 -1
- package/esm2022/layout/eui-app/eui-app-sidebar/sidebar-header-user-profile/sidebar-header-user-profile.component.mjs +1 -1
- package/esm2022/layout/eui-breadcrumb/collapsed-breadcrumb/collapsed-breadcrumb.component.mjs +1 -1
- package/esm2022/layout/eui-breadcrumb/item/breadcrumb-item.component.mjs +1 -1
- package/esm2022/layout/eui-notifications/eui-notification-item.component.mjs +1 -1
- package/esm2022/layout/eui-notifications/eui-notifications.component.mjs +1 -1
- package/esm2022/layout/eui-notifications-v2/eui-notification-item.component.mjs +1 -1
- package/esm2022/layout/eui-notifications-v2/eui-notifications.component.mjs +1 -1
- package/esm2022/layout/eui-search/search.component.mjs +1 -1
- package/esm2022/layout/eui-toolbar/toolbar-menu/toolbar-menu.component.mjs +1 -1
- package/esm2022/layout/eui-user-profile/user-profile-card/user-profile-card.component.mjs +1 -1
- package/esm2022/layout/eui-user-profile/user-profile.component.mjs +1 -1
- package/esm2022/shared/base/base-states.directive.mjs +23 -23
- package/eui-avatar/eui-avatar.component.d.ts.map +1 -1
- package/eui-button/eui-button.component.d.ts +3 -6
- package/eui-button/eui-button.component.d.ts.map +1 -1
- package/eui-button-v2/eui-button-v2.component.d.ts.map +1 -1
- package/eui-icon/eui-icon-svg.component.d.ts +7 -8
- package/eui-icon/eui-icon-svg.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 +3 -3
- package/fesm2022/eui-components-eui-avatar.mjs.map +2 -2
- package/fesm2022/eui-components-eui-badge.mjs +2 -2
- package/fesm2022/eui-components-eui-badge.mjs.map +1 -1
- package/fesm2022/eui-components-eui-button-v2.mjs +3 -3
- package/fesm2022/eui-components-eui-button-v2.mjs.map +2 -2
- package/fesm2022/eui-components-eui-button.mjs +6 -13
- package/fesm2022/eui-components-eui-button.mjs.map +2 -2
- package/fesm2022/eui-components-eui-card.mjs +2 -2
- package/fesm2022/eui-components-eui-card.mjs.map +1 -1
- package/fesm2022/eui-components-eui-chip-list.mjs +1 -1
- package/fesm2022/eui-components-eui-chip-list.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-card.mjs +1 -1
- package/fesm2022/eui-components-eui-dashboard-card.mjs.map +1 -1
- package/fesm2022/eui-components-eui-date-range-selector.mjs +1 -1
- package/fesm2022/eui-components-eui-date-range-selector.mjs.map +1 -1
- package/fesm2022/eui-components-eui-datepicker.mjs +1 -1
- package/fesm2022/eui-components-eui-datepicker.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dialog.mjs +1 -1
- package/fesm2022/eui-components-eui-dialog.mjs.map +1 -1
- package/fesm2022/eui-components-eui-discussion-thread.mjs +1 -1
- package/fesm2022/eui-components-eui-discussion-thread.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dropdown.mjs +1 -1
- package/fesm2022/eui-components-eui-dropdown.mjs.map +1 -1
- package/fesm2022/eui-components-eui-fieldset.mjs +1 -1
- package/fesm2022/eui-components-eui-fieldset.mjs.map +1 -1
- package/fesm2022/eui-components-eui-file-upload.mjs +2 -2
- package/fesm2022/eui-components-eui-file-upload.mjs.map +1 -1
- package/fesm2022/eui-components-eui-growl.mjs +1 -1
- package/fesm2022/eui-components-eui-growl.mjs.map +1 -1
- package/fesm2022/eui-components-eui-icon-toggle.mjs +1 -1
- package/fesm2022/eui-components-eui-icon-toggle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-icon.mjs +47 -57
- package/fesm2022/eui-components-eui-icon.mjs.map +2 -2
- package/fesm2022/eui-components-eui-language-selector.mjs +2 -2
- package/fesm2022/eui-components-eui-language-selector.mjs.map +1 -1
- package/fesm2022/eui-components-eui-list.mjs +1 -1
- package/fesm2022/eui-components-eui-list.mjs.map +1 -1
- package/fesm2022/eui-components-eui-menu.mjs +2 -2
- package/fesm2022/eui-components-eui-menu.mjs.map +1 -1
- package/fesm2022/eui-components-eui-overlay.mjs +1 -1
- package/fesm2022/eui-components-eui-overlay.mjs.map +1 -1
- package/fesm2022/eui-components-eui-page.mjs +2 -2
- package/fesm2022/eui-components-eui-page.mjs.map +1 -1
- package/fesm2022/eui-components-eui-paginator.mjs +1 -1
- package/fesm2022/eui-components-eui-paginator.mjs.map +1 -1
- package/fesm2022/eui-components-eui-popover.mjs +1 -1
- package/fesm2022/eui-components-eui-popover.mjs.map +1 -1
- package/fesm2022/eui-components-eui-progress-bar.mjs +1 -1
- package/fesm2022/eui-components-eui-progress-bar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-slide-toggle.mjs +1 -1
- package/fesm2022/eui-components-eui-slide-toggle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-table.mjs +2 -2
- package/fesm2022/eui-components-eui-table.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tabs.mjs +1 -1
- package/fesm2022/eui-components-eui-tabs.mjs.map +1 -1
- package/fesm2022/eui-components-eui-timebar.mjs +1 -1
- package/fesm2022/eui-components-eui-timebar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-timepicker.mjs +1 -1
- package/fesm2022/eui-components-eui-timepicker.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-eui-tree.mjs +1 -1
- package/fesm2022/eui-components-eui-tree.mjs.map +1 -1
- package/fesm2022/eui-components-eui-wizard.mjs +1 -1
- package/fesm2022/eui-components-eui-wizard.mjs.map +1 -1
- package/fesm2022/eui-components-externals-eui-editor.mjs +1 -1
- package/fesm2022/eui-components-externals-eui-editor.mjs.map +1 -1
- package/fesm2022/eui-components-layout.mjs +11 -11
- package/fesm2022/eui-components-layout.mjs.map +1 -1
- package/fesm2022/eui-components-shared.mjs +22 -22
- package/fesm2022/eui-components-shared.mjs.map +2 -2
- package/package.json +3 -3
- package/shared/base/base-states.directive.d.ts.map +1 -1
@@ -1,8 +1,7 @@
|
|
1
1
|
// eui-icon-svg.component.mjs
|
2
|
-
import { ChangeDetectionStrategy, Component, Input, HostBinding, ViewEncapsulation, Inject, Optional, booleanAttribute
|
2
|
+
import { ChangeDetectionStrategy, Component, Input, HostBinding, ViewEncapsulation, Inject, Optional, booleanAttribute } from "@angular/core";
|
3
3
|
import { EUI_CONFIG_TOKEN } from "@eui/core";
|
4
4
|
import { BaseStatesDirective } from "@eui/components/shared";
|
5
|
-
import { EuiButtonV2Component } from "@eui/components/eui-button-v2";
|
6
5
|
import * as i0 from "@angular/core";
|
7
6
|
import * as i1 from "@eui/components/shared";
|
8
7
|
import * as i2 from "@angular/common";
|
@@ -11,9 +10,7 @@ var EuiIconSvgComponent = class _EuiIconSvgComponent {
|
|
11
10
|
return [
|
12
11
|
// Always refer to the baseStatesDirective
|
13
12
|
this.baseStatesDirective.getCssClasses("eui-icon-svg"),
|
14
|
-
`eui-icon-svg--${this.transform}
|
15
|
-
`eui-icon-svg--size-${this.size}`,
|
16
|
-
`eui-icon-svg--size-${this.baseStatesDirective.euiSizeVariant}`,
|
13
|
+
this.transform ? `eui-icon-svg--${this.transform}` : "",
|
17
14
|
// own cmp state => reflected with the scss states
|
18
15
|
this.euiStart ? "eui-icon-svg--start" : "",
|
19
16
|
this.euiEnd ? "eui-icon-svg--end" : "",
|
@@ -26,13 +23,12 @@ var EuiIconSvgComponent = class _EuiIconSvgComponent {
|
|
26
23
|
set ariaLabel(value) {
|
27
24
|
this._ariaLabel = value;
|
28
25
|
}
|
29
|
-
constructor(config,
|
26
|
+
constructor(config, baseStatesDirective) {
|
30
27
|
this.config = config;
|
31
28
|
this.baseStatesDirective = baseStatesDirective;
|
32
29
|
this.ariaRole = "img";
|
33
|
-
this.size = "m";
|
34
|
-
this.fillColor = "grey-100";
|
35
30
|
this.set = "eui";
|
31
|
+
this.size = "m";
|
36
32
|
this.style = "";
|
37
33
|
this.transform = "";
|
38
34
|
this._ariaLabel = "eUI Icon";
|
@@ -43,9 +39,6 @@ var EuiIconSvgComponent = class _EuiIconSvgComponent {
|
|
43
39
|
this.isInputIcon = false;
|
44
40
|
this.euiStart = false;
|
45
41
|
this.euiEnd = false;
|
46
|
-
if (buttonParentComponent) {
|
47
|
-
this.parentComponent = buttonParentComponent;
|
48
|
-
}
|
49
42
|
}
|
50
43
|
ngOnInit() {
|
51
44
|
const assetsBaseUrl = this.config?.appConfig?.global?.eui?.assetsBaseUrl;
|
@@ -69,35 +62,28 @@ var EuiIconSvgComponent = class _EuiIconSvgComponent {
|
|
69
62
|
this._setIconAndSet();
|
70
63
|
}
|
71
64
|
}
|
65
|
+
if (c && c.size) {
|
66
|
+
if (c.size.currentValue !== c.size.previousValue) {
|
67
|
+
this._setStyle();
|
68
|
+
}
|
69
|
+
}
|
70
|
+
if (c && c.fillColor) {
|
71
|
+
if (c.fillColor.currentValue !== c.fillColor.previousValue) {
|
72
|
+
this._setStyle();
|
73
|
+
}
|
74
|
+
}
|
72
75
|
if (c && c.size && this.baseStatesDirective.euiSizeVariant) {
|
73
76
|
this.size = this.baseStatesDirective.euiSizeVariant;
|
77
|
+
this._setStyle();
|
74
78
|
}
|
75
79
|
if (c && this.baseStatesDirective.euiSizeVariant) {
|
76
80
|
this.size = this.baseStatesDirective.euiSizeVariant;
|
77
|
-
|
78
|
-
if (c && c.fillColor && this.baseStatesDirective.euiVariant) {
|
79
|
-
this.fillColor = `${this.baseStatesDirective.euiVariant}-100`;
|
80
|
-
}
|
81
|
-
if (c && this.baseStatesDirective.euiVariant) {
|
82
|
-
this.fillColor = `${this.baseStatesDirective.euiVariant}-100`;
|
83
|
-
}
|
84
|
-
if (c && this.parentComponent && this.parentComponent.baseStatesDirective.euiVariant) {
|
85
|
-
this.fillColor = `${this.parentComponent.baseStatesDirective.euiVariant}-contrast`;
|
81
|
+
this._setStyle();
|
86
82
|
}
|
87
83
|
}
|
88
84
|
ngAfterContentInit() {
|
89
85
|
this._setIconAndSet();
|
90
|
-
|
91
|
-
getCssClasses() {
|
92
|
-
return [
|
93
|
-
this.isLoading ? "eui-icon-svg--loading" : "",
|
94
|
-
// this.transform ? `eui-icon-svg--${this.transform}` : '', // Needed for extra spacings adjustments
|
95
|
-
`eui-sprite-${this.icon}`,
|
96
|
-
`eui-icon-svg--color-${this.fillColor}`,
|
97
|
-
`eui-icon-svg--color-${this.baseStatesDirective.euiVariant}`,
|
98
|
-
`eui-icon-svg--size-${this.size}`,
|
99
|
-
`eui-icon-svg--size-${this.baseStatesDirective.euiSizeVariant}`
|
100
|
-
].join(" ").trim();
|
86
|
+
this._setStyle();
|
101
87
|
}
|
102
88
|
_setIconAndSet() {
|
103
89
|
if (this.icon && this.icon.indexOf(":") > -1) {
|
@@ -115,11 +101,20 @@ var EuiIconSvgComponent = class _EuiIconSvgComponent {
|
|
115
101
|
}
|
116
102
|
}
|
117
103
|
}
|
104
|
+
_setStyle() {
|
105
|
+
let fill = "";
|
106
|
+
if (this.fillColor) {
|
107
|
+
fill = `fill: var(--eui-base-color-${this.fillColor}) !important; color: var(--eui-base-color-${this.fillColor}) !important;`;
|
108
|
+
}
|
109
|
+
const height = `height: var(--eui-base-icon-size-${this.size});`;
|
110
|
+
const width = `width: var(--eui-base-icon-size-${this.size});`;
|
111
|
+
this.iconStyle = `${fill} ${height} ${width}`;
|
112
|
+
}
|
118
113
|
static {
|
119
|
-
this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: _EuiIconSvgComponent, deps: [{ token: EUI_CONFIG_TOKEN, optional: true }, { token:
|
114
|
+
this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: _EuiIconSvgComponent, deps: [{ token: EUI_CONFIG_TOKEN, optional: true }, { token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component });
|
120
115
|
}
|
121
116
|
static {
|
122
|
-
this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.4", type: _EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: { icon: "icon",
|
117
|
+
this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.4", type: _EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: { icon: "icon", fillColor: "fillColor", set: "set", size: "size", ariaLabelledby: "ariaLabelledby", role: "role", style: "style", iconUrl: "iconUrl", transform: "transform", ariaLabel: ["aria-label", "ariaLabel"], ariaHidden: ["ariaHidden", "ariaHidden", booleanAttribute], focusable: ["focusable", "focusable", booleanAttribute], isLoading: ["isLoading", "isLoading", booleanAttribute], isInputIcon: ["isInputIcon", "isInputIcon", booleanAttribute], euiStart: ["euiStart", "euiStart", booleanAttribute], euiEnd: ["euiEnd", "euiEnd", booleanAttribute] }, host: { properties: { "attr.role": "this.ariaRole", "class": "this.cssClasses", "attr.aria-label": "this.ariaLabel" } }, usesOnChanges: true, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiSizeXS", "euiSizeXS", "euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeL", "euiSizeL", "euiSizeXL", "euiSizeXL", "euiSizeVariant", "euiSizeVariant"] }], ngImport: i0, template: `<ng-container *ngIf="icon && !iconUrl && !isLoading">
|
123
118
|
<ng-container *ngTemplateOutlet="default"></ng-container>
|
124
119
|
</ng-container>
|
125
120
|
<ng-container *ngIf="iconUrl">
|
@@ -131,25 +126,26 @@ var EuiIconSvgComponent = class _EuiIconSvgComponent {
|
|
131
126
|
|
132
127
|
<ng-template #default>
|
133
128
|
<svg
|
134
|
-
|
129
|
+
class="eui-sprite-{{icon}}"
|
130
|
+
[class.eui-icon-svg--loading]="isLoading"
|
135
131
|
[attr.aria-hidden]="ariaHidden"
|
136
132
|
[attr.aria-labelledby]="ariaLabelledby || null"
|
137
133
|
[attr.role]="role || 'img'"
|
138
|
-
[attr.focusable]="focusable"
|
134
|
+
[attr.focusable]="focusable"
|
135
|
+
attr.style="{{iconStyle}}">
|
139
136
|
<use [attr.href]="assetsBaseUrl + '/icons/sprites/' + set + '.svg#' + iconName"></use>
|
140
137
|
</svg>
|
141
138
|
<ng-container *ngTemplateOutlet="content"></ng-container>
|
142
139
|
</ng-template>
|
143
140
|
|
144
141
|
<ng-template #custom>
|
145
|
-
<svg
|
146
|
-
|
147
|
-
[attr.style]="style ? style : null"
|
142
|
+
<svg class="eui-icon-svg"
|
143
|
+
attr.style="{{iconStyle}} {{style}}"
|
148
144
|
[attr.aria-hidden]="ariaHidden"
|
149
145
|
[attr.aria-labelledby]="ariaLabelledby || null"
|
150
146
|
[attr.role]="role || 'img'"
|
151
147
|
[attr.focusable]="focusable">
|
152
|
-
<image [attr.href]="iconUrl" [class]="'eui-icon-svg
|
148
|
+
<image [attr.href]="iconUrl" [class]="'eui-icon-svg'" attr.style="{{iconStyle}} {{style}}"></image>
|
153
149
|
</svg>
|
154
150
|
</ng-template>
|
155
151
|
|
@@ -161,7 +157,7 @@ var EuiIconSvgComponent = class _EuiIconSvgComponent {
|
|
161
157
|
<ng-template #content>
|
162
158
|
<ng-content></ng-content>
|
163
159
|
</ng-template>
|
164
|
-
`, styles: ['.eui-icon-svg{display:inline-flex;position:relative}.eui-icon-svg svg{pointer-events:none}.eui-icon-svg .eui-sprite-eui-ecl-blog,.eui-icon-svg .eui-sprite-eui-ecl-email{color:#0e47cb;fill:#0e47cb}.eui-icon-svg .eui-sprite-eui-ecl-facebook{color:#4267b2;fill:#4267b2}.eui-icon-svg .eui-sprite-eui-ecl-flickr{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-foursquare{color:#ff577a;fill:#ff577a}.eui-icon-svg .eui-sprite-eui-ecl-gmail,.eui-icon-svg .eui-sprite-eui-ecl-instagram{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-linkedin{color:#0a66c2;fill:#0a66c2}.eui-icon-svg .eui-sprite-eui-ecl-mastodon{color:#2b90d9;fill:#2b90d9}.eui-icon-svg .eui-sprite-eui-ecl-messenger{color:#00b2ff;fill:#00b2ff}.eui-icon-svg .eui-sprite-eui-ecl-pinterest{color:#e60023;fill:#e60023}.eui-icon-svg .eui-sprite-eui-ecl-qzone{color:#fc0;fill:#fc0}.eui-icon-svg .eui-sprite-eui-ecl-reddit{color:#ff5700;fill:#ff5700}.eui-icon-svg .eui-sprite-eui-ecl-rss{color:#f26522;fill:#f26522}.eui-icon-svg .eui-sprite-eui-ecl-skype{color:#00aff0;fill:#00aff0}.eui-icon-svg .eui-sprite-eui-ecl-sms{color:#004494;fill:#004494}.eui-icon-svg .eui-sprite-eui-ecl-spotify{color:#1db954;fill:#1db954}.eui-icon-svg .eui-sprite-eui-ecl-telegram{color:#24a1de;fill:#24a1de}.eui-icon-svg .eui-sprite-eui-ecl-twitter{color:#1da1f2;fill:#1da1f2}.eui-icon-svg .eui-sprite-eui-ecl-typepad{color:#aab652;fill:#aab652}.eui-icon-svg .eui-sprite-eui-ecl-weibo{color:#e6162d;fill:#e6162d}.eui-icon-svg .eui-sprite-eui-ecl-whatasapp{color:#25d366;fill:#25d366}.eui-icon-svg .eui-sprite-eui-ecl-yahoomail{color:#6619df;fill:#6619df}.eui-icon-svg .eui-sprite-eui-ecl-yammer{color:#0078d4;fill:#0078d4}.eui-icon-svg .eui-sprite-eui-ecl-youtube{color:red;fill:red}.eui-icon-svg--start{margin-right:var(--eui-base-spacing-s)}.eui-icon-svg--end{margin-left:var(--eui-base-spacing-s)}.eui-icon-svg--input-icon{position:absolute}.eui-icon-svg--input-icon.eui-icon-svg--start{left:var(--eui-base-spacing-m)}.eui-icon-svg--input-icon.eui-icon-svg--end{right:var(--eui-base-spacing-m)}.eui-icon-svg--loading{align-items:center;display:inline-flex;color:transparent;fill:transparent}.eui-icon-svg--loading:after,.eui-icon-svg--loading:before{content:"";position:absolute;min-height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);height:100%;width:100%}.eui-icon-svg--loading:before{border:var(--eui-base-spacing-2xs) solid rgba(0,0,0,.25);border-radius:100%}.eui-icon-svg--loading:after{animation:eui-icon-loading-kf .8s linear;animation-iteration-count:infinite;border-color:rgba(255,255,255,.5) transparent transparent;border-radius:100%;border-style:solid;border-width:var(--eui-base-spacing-2xs);box-shadow:0 0 0 1px transparent}.eui-icon-svg--loading--sm:before,.eui-icon-svg--loading--sm:after{height:var(--eui-base-spacing-m);width:var(--eui-base-spacing-m)}.eui-icon-svg.eui-icon-svg--spin>svg{animation:eui-icon-svg-spin 1.5s infinite linear}.eui-icon-svg.eui-icon-svg--rotate-45{transform:rotate(45deg)}.eui-icon-svg.eui-icon-svg--rotate-90{transform:rotate(90deg)}.eui-icon-svg.eui-icon-svg--rotate-135{transform:rotate(135deg)}.eui-icon-svg.eui-icon-svg--rotate-180{transform:rotate(180deg)}.eui-icon-svg.eui-icon-svg--rotate-225{transform:rotate(225deg)}.eui-icon-svg.eui-icon-svg--rotate-270{transform:rotate(270deg)}.eui-icon-svg.eui-icon-svg--rotate-315{transform:rotate(315deg)}.eui-icon-svg.eui-icon-svg--flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";transform:scaleX(-1)}.eui-icon-svg.eui-icon-svg--flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scaleY(-1)}.eui-icon-svg.eui-icon-svg--flip-both{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scale(-1)}.eui-icon-svg.eui-icon-svg--stack{position:absolute;transform:translate(-50%);margin-left:50%}@keyframes eui-icon-loading-kf{to{transform:rotate(360deg)}}@keyframes eui-icon-svg-spin{0%{transform:rotate(0)}to{transform:rotate(359deg)}}
|
160
|
+
`, styles: ['.eui-icon-svg{display:inline-flex;position:relative}.eui-icon-svg svg{pointer-events:none}.eui-icon-svg .eui-sprite-eui-ecl-blog,.eui-icon-svg .eui-sprite-eui-ecl-email{color:#0e47cb;fill:#0e47cb}.eui-icon-svg .eui-sprite-eui-ecl-facebook{color:#4267b2;fill:#4267b2}.eui-icon-svg .eui-sprite-eui-ecl-flickr{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-foursquare{color:#ff577a;fill:#ff577a}.eui-icon-svg .eui-sprite-eui-ecl-gmail,.eui-icon-svg .eui-sprite-eui-ecl-instagram{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-linkedin{color:#0a66c2;fill:#0a66c2}.eui-icon-svg .eui-sprite-eui-ecl-mastodon{color:#2b90d9;fill:#2b90d9}.eui-icon-svg .eui-sprite-eui-ecl-messenger{color:#00b2ff;fill:#00b2ff}.eui-icon-svg .eui-sprite-eui-ecl-pinterest{color:#e60023;fill:#e60023}.eui-icon-svg .eui-sprite-eui-ecl-qzone{color:#fc0;fill:#fc0}.eui-icon-svg .eui-sprite-eui-ecl-reddit{color:#ff5700;fill:#ff5700}.eui-icon-svg .eui-sprite-eui-ecl-rss{color:#f26522;fill:#f26522}.eui-icon-svg .eui-sprite-eui-ecl-skype{color:#00aff0;fill:#00aff0}.eui-icon-svg .eui-sprite-eui-ecl-sms{color:#004494;fill:#004494}.eui-icon-svg .eui-sprite-eui-ecl-spotify{color:#1db954;fill:#1db954}.eui-icon-svg .eui-sprite-eui-ecl-telegram{color:#24a1de;fill:#24a1de}.eui-icon-svg .eui-sprite-eui-ecl-twitter{color:#1da1f2;fill:#1da1f2}.eui-icon-svg .eui-sprite-eui-ecl-typepad{color:#aab652;fill:#aab652}.eui-icon-svg .eui-sprite-eui-ecl-weibo{color:#e6162d;fill:#e6162d}.eui-icon-svg .eui-sprite-eui-ecl-whatasapp{color:#25d366;fill:#25d366}.eui-icon-svg .eui-sprite-eui-ecl-yahoomail{color:#6619df;fill:#6619df}.eui-icon-svg .eui-sprite-eui-ecl-yammer{color:#0078d4;fill:#0078d4}.eui-icon-svg .eui-sprite-eui-ecl-youtube{color:red;fill:red}.eui-icon-svg--start{margin-right:var(--eui-base-spacing-s)}.eui-icon-svg--end{margin-left:var(--eui-base-spacing-s)}.eui-icon-svg--input-icon{position:absolute}.eui-icon-svg--input-icon.eui-icon-svg--start{left:var(--eui-base-spacing-m)}.eui-icon-svg--input-icon.eui-icon-svg--end{right:var(--eui-base-spacing-m)}.eui-icon-svg--loading{align-items:center;display:inline-flex;color:transparent;fill:transparent}.eui-icon-svg--loading:after,.eui-icon-svg--loading:before{content:"";position:absolute;min-height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);height:100%;width:100%}.eui-icon-svg--loading:before{border:var(--eui-base-spacing-2xs) solid rgba(0,0,0,.25);border-radius:100%}.eui-icon-svg--loading:after{animation:eui-icon-loading-kf .8s linear;animation-iteration-count:infinite;border-color:rgba(255,255,255,.5) transparent transparent;border-radius:100%;border-style:solid;border-width:var(--eui-base-spacing-2xs);box-shadow:0 0 0 1px transparent}.eui-icon-svg--loading--sm:before,.eui-icon-svg--loading--sm:after{height:var(--eui-base-spacing-m);width:var(--eui-base-spacing-m)}.eui-icon-svg.eui-icon-svg--spin>svg{animation:eui-icon-svg-spin 1.5s infinite linear}.eui-icon-svg.eui-icon-svg--rotate-45{transform:rotate(45deg)}.eui-icon-svg.eui-icon-svg--rotate-90{transform:rotate(90deg)}.eui-icon-svg.eui-icon-svg--rotate-135{transform:rotate(135deg)}.eui-icon-svg.eui-icon-svg--rotate-180{transform:rotate(180deg)}.eui-icon-svg.eui-icon-svg--rotate-225{transform:rotate(225deg)}.eui-icon-svg.eui-icon-svg--rotate-270{transform:rotate(270deg)}.eui-icon-svg.eui-icon-svg--rotate-315{transform:rotate(315deg)}.eui-icon-svg.eui-icon-svg--flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";transform:scaleX(-1)}.eui-icon-svg.eui-icon-svg--flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scaleY(-1)}.eui-icon-svg.eui-icon-svg--flip-both{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scale(-1)}.eui-icon-svg.eui-icon-svg--stack{position:absolute;transform:translate(-50%);margin-left:50%}@keyframes eui-icon-loading-kf{to{transform:rotate(360deg)}}@keyframes eui-icon-svg-spin{0%{transform:rotate(0)}to{transform:rotate(359deg)}}.eui--primary .eui-icon-svg svg{color:var(--eui-c-primary-contrast)!important;fill:var(--eui-c-primary-contrast)!important}.eui--secondary .eui-icon-svg svg{color:var(--eui-c-secondary-bg-contrast)!important;fill:var(--eui-c-secondary-bg-contrast)!important}.eui--info .eui-icon-svg svg{color:var(--eui-c-info-contrast)!important;fill:var(--eui-c-info-contrast)!important}.eui--success .eui-icon-svg svg{color:var(--eui-c-success-contrast)!important;fill:var(--eui-c-success-contrast)!important}.eui--warning .eui-icon-svg svg{color:var(--eui-c-warning-contrast)!important;fill:var(--eui-c-warning-contrast)!important}.eui--danger .eui-icon-svg svg{color:var(--eui-c-danger-contrast)!important;fill:var(--eui-c-danger-contrast)!important}.eui--accent .eui-icon-svg svg{color:var(--eui-c-accent-contrast)!important;fill:var(--eui-c-accent-contrast)!important}.eui--basic.eui--primary .eui-icon-svg svg,.eui--outline.eui--primary .eui-icon-svg svg{color:var(--eui-c-primary)!important;fill:var(--eui-c-primary)!important}.eui--basic.eui--primary:hover .eui-icon-svg svg,.eui--outline.eui--primary:hover .eui-icon-svg svg{color:var(--eui-c-primary-contrast)!important;fill:var(--eui-c-primary-contrast)!important}.eui--basic.eui--secondary .eui-icon-svg svg,.eui--outline.eui--secondary .eui-icon-svg svg{color:var(--eui-c-secondary)!important;fill:var(--eui-c-secondary)!important}.eui--basic.eui--secondary:hover .eui-icon-svg svg,.eui--outline.eui--secondary:hover .eui-icon-svg svg{color:var(--eui-c-secondary-bg-contrast)!important;fill:var(--eui-c-secondary-bg-contrast)!important}.eui--basic.eui--info .eui-icon-svg svg,.eui--outline.eui--info .eui-icon-svg svg{color:var(--eui-c-info)!important;fill:var(--eui-c-info)!important}.eui--basic.eui--info:hover .eui-icon-svg svg,.eui--outline.eui--info:hover .eui-icon-svg svg{color:var(--eui-c-info-contrast)!important;fill:var(--eui-c-info-contrast)!important}.eui--basic.eui--success .eui-icon-svg svg,.eui--outline.eui--success .eui-icon-svg svg{color:var(--eui-c-success)!important;fill:var(--eui-c-success)!important}.eui--basic.eui--success:hover .eui-icon-svg svg,.eui--outline.eui--success:hover .eui-icon-svg svg{color:var(--eui-c-success-contrast)!important;fill:var(--eui-c-success-contrast)!important}.eui--basic.eui--warning .eui-icon-svg svg,.eui--outline.eui--warning .eui-icon-svg svg{color:var(--eui-c-warning)!important;fill:var(--eui-c-warning)!important}.eui--basic.eui--warning:hover .eui-icon-svg svg,.eui--outline.eui--warning:hover .eui-icon-svg svg{color:var(--eui-c-warning-contrast)!important;fill:var(--eui-c-warning-contrast)!important}.eui--basic.eui--danger .eui-icon-svg svg,.eui--outline.eui--danger .eui-icon-svg svg{color:var(--eui-c-danger)!important;fill:var(--eui-c-danger)!important}.eui--basic.eui--danger:hover .eui-icon-svg svg,.eui--outline.eui--danger:hover .eui-icon-svg svg{color:var(--eui-c-danger-contrast)!important;fill:var(--eui-c-danger-contrast)!important}.eui--basic.eui--accent .eui-icon-svg svg,.eui--outline.eui--accent .eui-icon-svg svg{color:var(--eui-c-accent)!important;fill:var(--eui-c-accent)!important}.eui--basic.eui--accent:hover .eui-icon-svg svg,.eui--outline.eui--accent:hover .eui-icon-svg svg{color:var(--eui-c-accent-contrast)!important;fill:var(--eui-c-accent-contrast)!important}\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: _EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
165
161
|
}
|
166
162
|
};
|
167
163
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: EuiIconSvgComponent, decorators: [{
|
@@ -198,25 +194,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4",
|
|
198
194
|
|
199
195
|
<ng-template #default>
|
200
196
|
<svg
|
201
|
-
|
197
|
+
class="eui-sprite-{{icon}}"
|
198
|
+
[class.eui-icon-svg--loading]="isLoading"
|
202
199
|
[attr.aria-hidden]="ariaHidden"
|
203
200
|
[attr.aria-labelledby]="ariaLabelledby || null"
|
204
201
|
[attr.role]="role || 'img'"
|
205
|
-
[attr.focusable]="focusable"
|
202
|
+
[attr.focusable]="focusable"
|
203
|
+
attr.style="{{iconStyle}}">
|
206
204
|
<use [attr.href]="assetsBaseUrl + '/icons/sprites/' + set + '.svg#' + iconName"></use>
|
207
205
|
</svg>
|
208
206
|
<ng-container *ngTemplateOutlet="content"></ng-container>
|
209
207
|
</ng-template>
|
210
208
|
|
211
209
|
<ng-template #custom>
|
212
|
-
<svg
|
213
|
-
|
214
|
-
[attr.style]="style ? style : null"
|
210
|
+
<svg class="eui-icon-svg"
|
211
|
+
attr.style="{{iconStyle}} {{style}}"
|
215
212
|
[attr.aria-hidden]="ariaHidden"
|
216
213
|
[attr.aria-labelledby]="ariaLabelledby || null"
|
217
214
|
[attr.role]="role || 'img'"
|
218
215
|
[attr.focusable]="focusable">
|
219
|
-
<image [attr.href]="iconUrl" [class]="'eui-icon-svg
|
216
|
+
<image [attr.href]="iconUrl" [class]="'eui-icon-svg'" attr.style="{{iconStyle}} {{style}}"></image>
|
220
217
|
</svg>
|
221
218
|
</ng-template>
|
222
219
|
|
@@ -228,30 +225,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4",
|
|
228
225
|
<ng-template #content>
|
229
226
|
<ng-content></ng-content>
|
230
227
|
</ng-template>
|
231
|
-
`, styles: ['.eui-icon-svg{display:inline-flex;position:relative}.eui-icon-svg svg{pointer-events:none}.eui-icon-svg .eui-sprite-eui-ecl-blog,.eui-icon-svg .eui-sprite-eui-ecl-email{color:#0e47cb;fill:#0e47cb}.eui-icon-svg .eui-sprite-eui-ecl-facebook{color:#4267b2;fill:#4267b2}.eui-icon-svg .eui-sprite-eui-ecl-flickr{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-foursquare{color:#ff577a;fill:#ff577a}.eui-icon-svg .eui-sprite-eui-ecl-gmail,.eui-icon-svg .eui-sprite-eui-ecl-instagram{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-linkedin{color:#0a66c2;fill:#0a66c2}.eui-icon-svg .eui-sprite-eui-ecl-mastodon{color:#2b90d9;fill:#2b90d9}.eui-icon-svg .eui-sprite-eui-ecl-messenger{color:#00b2ff;fill:#00b2ff}.eui-icon-svg .eui-sprite-eui-ecl-pinterest{color:#e60023;fill:#e60023}.eui-icon-svg .eui-sprite-eui-ecl-qzone{color:#fc0;fill:#fc0}.eui-icon-svg .eui-sprite-eui-ecl-reddit{color:#ff5700;fill:#ff5700}.eui-icon-svg .eui-sprite-eui-ecl-rss{color:#f26522;fill:#f26522}.eui-icon-svg .eui-sprite-eui-ecl-skype{color:#00aff0;fill:#00aff0}.eui-icon-svg .eui-sprite-eui-ecl-sms{color:#004494;fill:#004494}.eui-icon-svg .eui-sprite-eui-ecl-spotify{color:#1db954;fill:#1db954}.eui-icon-svg .eui-sprite-eui-ecl-telegram{color:#24a1de;fill:#24a1de}.eui-icon-svg .eui-sprite-eui-ecl-twitter{color:#1da1f2;fill:#1da1f2}.eui-icon-svg .eui-sprite-eui-ecl-typepad{color:#aab652;fill:#aab652}.eui-icon-svg .eui-sprite-eui-ecl-weibo{color:#e6162d;fill:#e6162d}.eui-icon-svg .eui-sprite-eui-ecl-whatasapp{color:#25d366;fill:#25d366}.eui-icon-svg .eui-sprite-eui-ecl-yahoomail{color:#6619df;fill:#6619df}.eui-icon-svg .eui-sprite-eui-ecl-yammer{color:#0078d4;fill:#0078d4}.eui-icon-svg .eui-sprite-eui-ecl-youtube{color:red;fill:red}.eui-icon-svg--start{margin-right:var(--eui-base-spacing-s)}.eui-icon-svg--end{margin-left:var(--eui-base-spacing-s)}.eui-icon-svg--input-icon{position:absolute}.eui-icon-svg--input-icon.eui-icon-svg--start{left:var(--eui-base-spacing-m)}.eui-icon-svg--input-icon.eui-icon-svg--end{right:var(--eui-base-spacing-m)}.eui-icon-svg--loading{align-items:center;display:inline-flex;color:transparent;fill:transparent}.eui-icon-svg--loading:after,.eui-icon-svg--loading:before{content:"";position:absolute;min-height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);height:100%;width:100%}.eui-icon-svg--loading:before{border:var(--eui-base-spacing-2xs) solid rgba(0,0,0,.25);border-radius:100%}.eui-icon-svg--loading:after{animation:eui-icon-loading-kf .8s linear;animation-iteration-count:infinite;border-color:rgba(255,255,255,.5) transparent transparent;border-radius:100%;border-style:solid;border-width:var(--eui-base-spacing-2xs);box-shadow:0 0 0 1px transparent}.eui-icon-svg--loading--sm:before,.eui-icon-svg--loading--sm:after{height:var(--eui-base-spacing-m);width:var(--eui-base-spacing-m)}.eui-icon-svg.eui-icon-svg--spin>svg{animation:eui-icon-svg-spin 1.5s infinite linear}.eui-icon-svg.eui-icon-svg--rotate-45{transform:rotate(45deg)}.eui-icon-svg.eui-icon-svg--rotate-90{transform:rotate(90deg)}.eui-icon-svg.eui-icon-svg--rotate-135{transform:rotate(135deg)}.eui-icon-svg.eui-icon-svg--rotate-180{transform:rotate(180deg)}.eui-icon-svg.eui-icon-svg--rotate-225{transform:rotate(225deg)}.eui-icon-svg.eui-icon-svg--rotate-270{transform:rotate(270deg)}.eui-icon-svg.eui-icon-svg--rotate-315{transform:rotate(315deg)}.eui-icon-svg.eui-icon-svg--flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";transform:scaleX(-1)}.eui-icon-svg.eui-icon-svg--flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scaleY(-1)}.eui-icon-svg.eui-icon-svg--flip-both{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scale(-1)}.eui-icon-svg.eui-icon-svg--stack{position:absolute;transform:translate(-50%);margin-left:50%}@keyframes eui-icon-loading-kf{to{transform:rotate(360deg)}}@keyframes eui-icon-svg-spin{0%{transform:rotate(0)}to{transform:rotate(359deg)}}\n'] }]
|
228
|
+
`, styles: ['.eui-icon-svg{display:inline-flex;position:relative}.eui-icon-svg svg{pointer-events:none}.eui-icon-svg .eui-sprite-eui-ecl-blog,.eui-icon-svg .eui-sprite-eui-ecl-email{color:#0e47cb;fill:#0e47cb}.eui-icon-svg .eui-sprite-eui-ecl-facebook{color:#4267b2;fill:#4267b2}.eui-icon-svg .eui-sprite-eui-ecl-flickr{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-foursquare{color:#ff577a;fill:#ff577a}.eui-icon-svg .eui-sprite-eui-ecl-gmail,.eui-icon-svg .eui-sprite-eui-ecl-instagram{color:#000;fill:#000}.eui-icon-svg .eui-sprite-eui-ecl-linkedin{color:#0a66c2;fill:#0a66c2}.eui-icon-svg .eui-sprite-eui-ecl-mastodon{color:#2b90d9;fill:#2b90d9}.eui-icon-svg .eui-sprite-eui-ecl-messenger{color:#00b2ff;fill:#00b2ff}.eui-icon-svg .eui-sprite-eui-ecl-pinterest{color:#e60023;fill:#e60023}.eui-icon-svg .eui-sprite-eui-ecl-qzone{color:#fc0;fill:#fc0}.eui-icon-svg .eui-sprite-eui-ecl-reddit{color:#ff5700;fill:#ff5700}.eui-icon-svg .eui-sprite-eui-ecl-rss{color:#f26522;fill:#f26522}.eui-icon-svg .eui-sprite-eui-ecl-skype{color:#00aff0;fill:#00aff0}.eui-icon-svg .eui-sprite-eui-ecl-sms{color:#004494;fill:#004494}.eui-icon-svg .eui-sprite-eui-ecl-spotify{color:#1db954;fill:#1db954}.eui-icon-svg .eui-sprite-eui-ecl-telegram{color:#24a1de;fill:#24a1de}.eui-icon-svg .eui-sprite-eui-ecl-twitter{color:#1da1f2;fill:#1da1f2}.eui-icon-svg .eui-sprite-eui-ecl-typepad{color:#aab652;fill:#aab652}.eui-icon-svg .eui-sprite-eui-ecl-weibo{color:#e6162d;fill:#e6162d}.eui-icon-svg .eui-sprite-eui-ecl-whatasapp{color:#25d366;fill:#25d366}.eui-icon-svg .eui-sprite-eui-ecl-yahoomail{color:#6619df;fill:#6619df}.eui-icon-svg .eui-sprite-eui-ecl-yammer{color:#0078d4;fill:#0078d4}.eui-icon-svg .eui-sprite-eui-ecl-youtube{color:red;fill:red}.eui-icon-svg--start{margin-right:var(--eui-base-spacing-s)}.eui-icon-svg--end{margin-left:var(--eui-base-spacing-s)}.eui-icon-svg--input-icon{position:absolute}.eui-icon-svg--input-icon.eui-icon-svg--start{left:var(--eui-base-spacing-m)}.eui-icon-svg--input-icon.eui-icon-svg--end{right:var(--eui-base-spacing-m)}.eui-icon-svg--loading{align-items:center;display:inline-flex;color:transparent;fill:transparent}.eui-icon-svg--loading:after,.eui-icon-svg--loading:before{content:"";position:absolute;min-height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);height:100%;width:100%}.eui-icon-svg--loading:before{border:var(--eui-base-spacing-2xs) solid rgba(0,0,0,.25);border-radius:100%}.eui-icon-svg--loading:after{animation:eui-icon-loading-kf .8s linear;animation-iteration-count:infinite;border-color:rgba(255,255,255,.5) transparent transparent;border-radius:100%;border-style:solid;border-width:var(--eui-base-spacing-2xs);box-shadow:0 0 0 1px transparent}.eui-icon-svg--loading--sm:before,.eui-icon-svg--loading--sm:after{height:var(--eui-base-spacing-m);width:var(--eui-base-spacing-m)}.eui-icon-svg.eui-icon-svg--spin>svg{animation:eui-icon-svg-spin 1.5s infinite linear}.eui-icon-svg.eui-icon-svg--rotate-45{transform:rotate(45deg)}.eui-icon-svg.eui-icon-svg--rotate-90{transform:rotate(90deg)}.eui-icon-svg.eui-icon-svg--rotate-135{transform:rotate(135deg)}.eui-icon-svg.eui-icon-svg--rotate-180{transform:rotate(180deg)}.eui-icon-svg.eui-icon-svg--rotate-225{transform:rotate(225deg)}.eui-icon-svg.eui-icon-svg--rotate-270{transform:rotate(270deg)}.eui-icon-svg.eui-icon-svg--rotate-315{transform:rotate(315deg)}.eui-icon-svg.eui-icon-svg--flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";transform:scaleX(-1)}.eui-icon-svg.eui-icon-svg--flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scaleY(-1)}.eui-icon-svg.eui-icon-svg--flip-both{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scale(-1)}.eui-icon-svg.eui-icon-svg--stack{position:absolute;transform:translate(-50%);margin-left:50%}@keyframes eui-icon-loading-kf{to{transform:rotate(360deg)}}@keyframes eui-icon-svg-spin{0%{transform:rotate(0)}to{transform:rotate(359deg)}}.eui--primary .eui-icon-svg svg{color:var(--eui-c-primary-contrast)!important;fill:var(--eui-c-primary-contrast)!important}.eui--secondary .eui-icon-svg svg{color:var(--eui-c-secondary-bg-contrast)!important;fill:var(--eui-c-secondary-bg-contrast)!important}.eui--info .eui-icon-svg svg{color:var(--eui-c-info-contrast)!important;fill:var(--eui-c-info-contrast)!important}.eui--success .eui-icon-svg svg{color:var(--eui-c-success-contrast)!important;fill:var(--eui-c-success-contrast)!important}.eui--warning .eui-icon-svg svg{color:var(--eui-c-warning-contrast)!important;fill:var(--eui-c-warning-contrast)!important}.eui--danger .eui-icon-svg svg{color:var(--eui-c-danger-contrast)!important;fill:var(--eui-c-danger-contrast)!important}.eui--accent .eui-icon-svg svg{color:var(--eui-c-accent-contrast)!important;fill:var(--eui-c-accent-contrast)!important}.eui--basic.eui--primary .eui-icon-svg svg,.eui--outline.eui--primary .eui-icon-svg svg{color:var(--eui-c-primary)!important;fill:var(--eui-c-primary)!important}.eui--basic.eui--primary:hover .eui-icon-svg svg,.eui--outline.eui--primary:hover .eui-icon-svg svg{color:var(--eui-c-primary-contrast)!important;fill:var(--eui-c-primary-contrast)!important}.eui--basic.eui--secondary .eui-icon-svg svg,.eui--outline.eui--secondary .eui-icon-svg svg{color:var(--eui-c-secondary)!important;fill:var(--eui-c-secondary)!important}.eui--basic.eui--secondary:hover .eui-icon-svg svg,.eui--outline.eui--secondary:hover .eui-icon-svg svg{color:var(--eui-c-secondary-bg-contrast)!important;fill:var(--eui-c-secondary-bg-contrast)!important}.eui--basic.eui--info .eui-icon-svg svg,.eui--outline.eui--info .eui-icon-svg svg{color:var(--eui-c-info)!important;fill:var(--eui-c-info)!important}.eui--basic.eui--info:hover .eui-icon-svg svg,.eui--outline.eui--info:hover .eui-icon-svg svg{color:var(--eui-c-info-contrast)!important;fill:var(--eui-c-info-contrast)!important}.eui--basic.eui--success .eui-icon-svg svg,.eui--outline.eui--success .eui-icon-svg svg{color:var(--eui-c-success)!important;fill:var(--eui-c-success)!important}.eui--basic.eui--success:hover .eui-icon-svg svg,.eui--outline.eui--success:hover .eui-icon-svg svg{color:var(--eui-c-success-contrast)!important;fill:var(--eui-c-success-contrast)!important}.eui--basic.eui--warning .eui-icon-svg svg,.eui--outline.eui--warning .eui-icon-svg svg{color:var(--eui-c-warning)!important;fill:var(--eui-c-warning)!important}.eui--basic.eui--warning:hover .eui-icon-svg svg,.eui--outline.eui--warning:hover .eui-icon-svg svg{color:var(--eui-c-warning-contrast)!important;fill:var(--eui-c-warning-contrast)!important}.eui--basic.eui--danger .eui-icon-svg svg,.eui--outline.eui--danger .eui-icon-svg svg{color:var(--eui-c-danger)!important;fill:var(--eui-c-danger)!important}.eui--basic.eui--danger:hover .eui-icon-svg svg,.eui--outline.eui--danger:hover .eui-icon-svg svg{color:var(--eui-c-danger-contrast)!important;fill:var(--eui-c-danger-contrast)!important}.eui--basic.eui--accent .eui-icon-svg svg,.eui--outline.eui--accent .eui-icon-svg svg{color:var(--eui-c-accent)!important;fill:var(--eui-c-accent)!important}.eui--basic.eui--accent:hover .eui-icon-svg svg,.eui--outline.eui--accent:hover .eui-icon-svg svg{color:var(--eui-c-accent-contrast)!important;fill:var(--eui-c-accent-contrast)!important}\n'] }]
|
232
229
|
}], ctorParameters: () => [{ type: void 0, decorators: [{
|
233
230
|
type: Optional
|
234
231
|
}, {
|
235
232
|
type: Inject,
|
236
233
|
args: [EUI_CONFIG_TOKEN]
|
237
|
-
}] }, { type: void 0, decorators: [{
|
238
|
-
type: Host
|
239
|
-
}, {
|
240
|
-
type: Optional
|
241
|
-
}, {
|
242
|
-
type: Inject,
|
243
|
-
args: [forwardRef(() => EuiButtonV2Component)]
|
244
234
|
}] }, { type: i1.BaseStatesDirective }], propDecorators: { ariaRole: [{
|
245
235
|
type: HostBinding,
|
246
236
|
args: ["attr.role"]
|
247
237
|
}], icon: [{
|
248
238
|
type: Input
|
249
|
-
}], size: [{
|
250
|
-
type: Input
|
251
239
|
}], fillColor: [{
|
252
240
|
type: Input
|
253
241
|
}], set: [{
|
254
242
|
type: Input
|
243
|
+
}], size: [{
|
244
|
+
type: Input
|
255
245
|
}], ariaLabelledby: [{
|
256
246
|
type: Input
|
257
247
|
}], role: [{
|
@@ -316,7 +306,7 @@ var EuiIconSvgButtonComponent = class _EuiIconSvgButtonComponent {
|
|
316
306
|
this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: _EuiIconSvgButtonComponent, deps: [], target: i02.ɵɵFactoryTarget.Component });
|
317
307
|
}
|
318
308
|
static {
|
319
|
-
this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.4", type: _EuiIconSvgButtonComponent, selector: "eui-icon-svg-button", inputs: { icon: "icon", fillColor: "fillColor", size: "size", ariaLabel: "ariaLabel", hasFocusBorder: ["hasFocusBorder", "hasFocusBorder", booleanAttribute2], hasNoPadding: ["hasNoPadding", "hasNoPadding", booleanAttribute2] }, outputs: { buttonClick: "buttonClick" }, host: { properties: { "class": "this.cssClasses", "attr.tabindex": "this.tabindex" } }, ngImport: i02, template: '<button class="eui-icon-svg-button__button"\n type="button"\n (keydown.enter)="onClick($event)"\n (keydown.backspace)="onClick($event)"\n (click)="onClick($event)"\n [attr.aria-label]="ariaLabel">\n <eui-icon-svg [icon]="icon" [fillColor]="fillColor" [size]="size" class="eui-icon-svg-button__button-icon">\n <ng-content select="eui-badge"></ng-content>\n </eui-icon-svg>\n</button>\n', styles: ['.eui-icon-svg-button{display:inline-flex}.eui-icon-svg-button__button{background-color:transparent;border:none;cursor:pointer;padding:var(--eui-base-spacing-2xs);align-items:center;display:flex;justify-content:center;position:relative}.eui-icon-svg-button__button-icon{opacity:.8}.eui-icon-svg-button__button:hover .eui-icon-svg-button__button-icon,.eui-icon-svg-button__button:focus .eui-icon-svg-button__button-icon{opacity:1}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none!important}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button-icon{opacity:1}.eui-icon-svg-button--has-no-padding .eui-icon-svg-button__button{padding:0}\n'], dependencies: [{ kind: "component", type: EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "
|
309
|
+
this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.4", type: _EuiIconSvgButtonComponent, selector: "eui-icon-svg-button", inputs: { icon: "icon", fillColor: "fillColor", size: "size", ariaLabel: "ariaLabel", hasFocusBorder: ["hasFocusBorder", "hasFocusBorder", booleanAttribute2], hasNoPadding: ["hasNoPadding", "hasNoPadding", booleanAttribute2] }, outputs: { buttonClick: "buttonClick" }, host: { properties: { "class": "this.cssClasses", "attr.tabindex": "this.tabindex" } }, ngImport: i02, template: '<button class="eui-icon-svg-button__button"\n type="button"\n (keydown.enter)="onClick($event)"\n (keydown.backspace)="onClick($event)"\n (click)="onClick($event)"\n [attr.aria-label]="ariaLabel">\n <eui-icon-svg [icon]="icon" [fillColor]="fillColor" [size]="size" class="eui-icon-svg-button__button-icon">\n <ng-content select="eui-badge"></ng-content>\n </eui-icon-svg>\n</button>\n', styles: ['.eui-icon-svg-button{display:inline-flex}.eui-icon-svg-button__button{background-color:transparent;border:none;cursor:pointer;padding:var(--eui-base-spacing-2xs);align-items:center;display:flex;justify-content:center;position:relative}.eui-icon-svg-button__button-icon{opacity:.8}.eui-icon-svg-button__button:hover .eui-icon-svg-button__button-icon,.eui-icon-svg-button__button:focus .eui-icon-svg-button__button-icon{opacity:1}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none!important}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-icon-svg-button--has-focus .eui-icon-svg-button__button-icon{opacity:1}.eui-icon-svg-button--has-no-padding .eui-icon-svg-button__button{padding:0}\n'], dependencies: [{ kind: "component", type: EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }], encapsulation: i02.ViewEncapsulation.None });
|
320
310
|
}
|
321
311
|
};
|
322
312
|
i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: EuiIconSvgButtonComponent, decorators: [{
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["../../eui-icon/eui-icon-svg.component.ts", "../../eui-icon/eui-icon-svg.component.html", "../../eui-icon/eui-icon-svg-button/eui-icon-svg-button.component.ts", "../../eui-icon/eui-icon-svg-button/eui-icon-svg-button.component.html", "../../eui-icon/eui-icon-color.component.ts", "../../eui-icon/eui-icon.module.ts"],
|
4
|
-
"sourcesContent": ["import {\n ChangeDetectionStrategy,\n Component,\n Input,\n HostBinding,\n OnInit,\n ViewEncapsulation,\n OnChanges,\n SimpleChanges,\n AfterContentInit,\n Inject,\n Optional,\n booleanAttribute,\n Host,\n forwardRef,\n} from '@angular/core';\nimport { EUI_CONFIG_TOKEN } from '@eui/core';\nimport { EuiConfig } from '@eui/base';\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { EuiButtonV2Component } from '@eui/components/eui-button-v2';\n\n@Component({\n selector: 'eui-icon-svg, span[euiIconSvg], i[euiIconSvg]',\n templateUrl: './eui-icon-svg.component.html',\n styleUrls: ['./styles/_index.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [\n {\n directive: BaseStatesDirective,\n inputs: [\n 'euiPrimary',\n 'euiSecondary',\n 'euiSuccess',\n 'euiInfo',\n 'euiWarning',\n 'euiDanger',\n 'euiAccent',\n 'euiVariant',\n\n 'euiSizeXS',\n 'euiSizeS',\n 'euiSizeM',\n 'euiSizeL',\n 'euiSizeXL',\n 'euiSizeVariant',\n ],\n },\n ],\n})\nexport class EuiIconSvgComponent implements AfterContentInit, OnChanges, OnInit {\n @HostBinding('attr.role') ariaRole = 'img';\n\n @Input() icon: string; // could be the form of \"icon:set\" to pass them both in a single input\n /** @deprecated will be removed in eUI19 replaced by default coerce variants */\n @Input() size: '2xs' | 'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl' | string = 'm';\n /** @deprecated will be removed in eUI19 replaced by default coerce variants */\n @Input() fillColor = 'grey-100';\n @Input() set = 'eui';\n /** @deprecated will be removed in eUI18 as it is ignored by screen readers */\n @Input() ariaLabelledby: string;\n /** @deprecated will be removed in eUI18 as the host role attribute is announced */\n @Input() role: string;\n @Input() style = '';\n @Input() iconUrl: string;\n @Input() transform = '';\n\n @HostBinding('class')\n public get cssClasses(): string {\n return [\n // Always refer to the baseStatesDirective\n this.baseStatesDirective.getCssClasses('eui-icon-svg'),\n `eui-icon-svg--${this.transform}`,\n `eui-icon-svg--size-${this.size}`,\n `eui-icon-svg--size-${this.baseStatesDirective.euiSizeVariant}`,\n\n // own cmp state => reflected with the scss states\n this.euiStart ? 'eui-icon-svg--start' : '',\n this.euiEnd ? 'eui-icon-svg--end' : '',\n this.isInputIcon ? 'eui-icon-svg--input-icon': '',\n ]\n .join(' ')\n .trim();\n }\n\n @HostBinding('attr.aria-label')\n @Input('aria-label')\n public get ariaLabel(): string {\n return this._ariaLabel;\n }\n public set ariaLabel(value: string | null) {\n this._ariaLabel = value;\n }\n protected _ariaLabel = 'eUI Icon';\n\n public iconName: string;\n public assetsBaseUrl = 'assets';\n\n @Input({ transform: booleanAttribute }) ariaHidden = true;\n @Input({ transform: booleanAttribute }) focusable = false;\n @Input({ transform: booleanAttribute }) isLoading = false;\n @Input({ transform: booleanAttribute }) isInputIcon = false;\n\n @Input({ transform: booleanAttribute }) euiStart = false;\n @Input({ transform: booleanAttribute }) euiEnd = false;\n\n private parentComponent;\n\n constructor(\n @Optional() @Inject(EUI_CONFIG_TOKEN) private config: EuiConfig,\n @Host() @Optional() @Inject(forwardRef(() => EuiButtonV2Component)) buttonParentComponent,\n public baseStatesDirective: BaseStatesDirective,\n ) {\n if (buttonParentComponent) {\n this.parentComponent = buttonParentComponent;\n }\n }\n\n ngOnInit(): void {\n const assetsBaseUrl = this.config?.appConfig?.global?.eui?.assetsBaseUrl;\n if (assetsBaseUrl) {\n this.assetsBaseUrl = this.config.appConfig.global.eui.assetsBaseUrl;\n }\n if (this.isLoading) {\n this.set = 'eui';\n this.icon = 'eui-radio-button-off';\n this.fillColor = 'transparent';\n }\n // if (this.parentComponent) {\n // console.log(this.parentComponent);\n // }\n }\n\n ngOnChanges(c: SimpleChanges): void {\n if (c && c.set) {\n if (c.set.currentValue !== c.set.previousValue) {\n this._setIconAndSet();\n }\n }\n\n if (c && c.icon) {\n if (c.icon.currentValue !== c.icon.previousValue) {\n this._setIconAndSet();\n }\n }\n\n if (c && c.size && this.baseStatesDirective.euiSizeVariant) {\n this.size = this.baseStatesDirective.euiSizeVariant;\n }\n\n if (c && this.baseStatesDirective.euiSizeVariant) {\n this.size = this.baseStatesDirective.euiSizeVariant;\n }\n\n if (c && c.fillColor && this.baseStatesDirective.euiVariant) {\n this.fillColor = `${this.baseStatesDirective.euiVariant}-100`;\n }\n\n if (c && this.baseStatesDirective.euiVariant) {\n this.fillColor = `${this.baseStatesDirective.euiVariant}-100`;\n }\n if (c && this.parentComponent && this.parentComponent.baseStatesDirective.euiVariant) {\n this.fillColor = `${this.parentComponent.baseStatesDirective.euiVariant}-contrast`;\n }\n }\n\n ngAfterContentInit(): void {\n this._setIconAndSet();\n }\n\n getCssClasses(): string {\n return [\n this.isLoading ? 'eui-icon-svg--loading' : '',\n // this.transform ? `eui-icon-svg--${this.transform}` : '', // Needed for extra spacings adjustments\n `eui-sprite-${this.icon}`,\n `eui-icon-svg--color-${this.fillColor}`,\n `eui-icon-svg--color-${this.baseStatesDirective.euiVariant}`,\n `eui-icon-svg--size-${this.size}`,\n `eui-icon-svg--size-${this.baseStatesDirective.euiSizeVariant}`,\n ]\n .join(' ')\n .trim();\n }\n\n private _setIconAndSet(): void {\n if (this.icon && this.icon.indexOf(':') > -1) {\n const iconSet = this.icon.split(':');\n this.icon = iconSet[0];\n this.set = iconSet[1];\n }\n\n if (!this.set || this.set === '') {\n this.set = 'eui';\n } else {\n if (this.set === 'sharp' || this.set === 'outline') {\n this.iconName = `${this.icon}-${this.set}`;\n } else {\n this.iconName = this.icon;\n }\n }\n }\n}\n", "<ng-container *ngIf=\"icon && !iconUrl && !isLoading\">\n <ng-container *ngTemplateOutlet=\"default\"></ng-container>\n</ng-container>\n<ng-container *ngIf=\"iconUrl\">\n <ng-container *ngTemplateOutlet=\"custom\"></ng-container>\n</ng-container>\n<ng-container *ngIf=\"isLoading\">\n <ng-container *ngTemplateOutlet=\"loading\"></ng-container>\n</ng-container>\n\n<ng-template #default>\n <svg\n [ngClass]=\"getCssClasses()\"\n [attr.aria-hidden]=\"ariaHidden\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.role]=\"role || 'img'\"\n [attr.focusable]=\"focusable\">\n <use [attr.href]=\"assetsBaseUrl + '/icons/sprites/' + set + '.svg#' + iconName\"></use>\n </svg>\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #custom>\n <svg\n [class]=\"'eui-icon-svg eui-icon-svg--size-' + size\"\n [attr.style]=\"style ? style : null\"\n [attr.aria-hidden]=\"ariaHidden\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.role]=\"role || 'img'\"\n [attr.focusable]=\"focusable\">\n <image [attr.href]=\"iconUrl\" [class]=\"'eui-icon-svg eui-icon-svg--size-' + size\" [attr.style]=\"style ? style : null\"></image>\n </svg>\n</ng-template>\n\n<ng-template #loading>\n <eui-icon-svg icon=\"eui-home\" [size]=\"size\" fillColor=\"transparent\" class=\"eui-icon-svg--loading\"></eui-icon-svg>\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n", "import { Component, HostBinding, Input, Output, EventEmitter, ViewEncapsulation, booleanAttribute } from '@angular/core';\n\n@Component({\n selector: 'eui-icon-svg-button',\n templateUrl: './eui-icon-svg-button.component.html',\n styleUrls: [ './eui-icon-svg-button.component.scss' ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiIconSvgButtonComponent {\n @HostBinding('class')\n get cssClasses(): string {\n return [\n 'eui-icon-svg-button',\n this.hasFocusBorder ? 'eui-icon-svg-button--has-focus': '',\n this.hasNoPadding ? 'eui-icon-svg-button--has-no-padding': '',\n ]\n .join(' ')\n .trim();\n }\n @HostBinding('attr.tabindex') tabindex = -1;\n\n @Input() icon: string;\n @Input() fillColor: string;\n @Input() size: '2xs' | 'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl' = 'm';\n @Input() ariaLabel: string;\n\n @Input({ transform: booleanAttribute }) hasFocusBorder = false;\n @Input({ transform: booleanAttribute }) hasNoPadding = false;\n\n @Output() buttonClick = new EventEmitter<Event>();\n\n onClick(event: Event): void {\n this.buttonClick.emit(event);\n }\n}\n", "<button class=\"eui-icon-svg-button__button\"\n type=\"button\"\n (keydown.enter)=\"onClick($event)\"\n (keydown.backspace)=\"onClick($event)\"\n (click)=\"onClick($event)\"\n [attr.aria-label]=\"ariaLabel\">\n <eui-icon-svg [icon]=\"icon\" [fillColor]=\"fillColor\" [size]=\"size\" class=\"eui-icon-svg-button__button-icon\">\n <ng-content select=\"eui-badge\"></ng-content>\n </eui-icon-svg>\n</button>\n", "import { Component, HostBinding, Input } from '@angular/core';\n\n@Component({\n selector: 'eui-icon-colored, span[euiIconColored], [euiIconColored]',\n template: `\n <span [class]=\"iconClass\">\n <span *ngFor=\"let pathNumber of paths\" class=\"path{{ pathNumber }}\"></span>\n </span>\n `,\n})\nexport class EuiIconColorComponent {\n public paths = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20];\n\n @HostBinding('class')\n public get cssClasses(): string {\n return this.getCssClasses();\n }\n\n @Input() iconClass;\n\n getCssClasses(): string {\n return ['eui-icon eui-icon-color', this.iconClass ? this.iconClass : ''].join(' ').trim();\n }\n}\n", "import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { EuiIconSvgComponent } from './eui-icon-svg.component';\nimport { EuiIconColorComponent } from './eui-icon-color.component';\nimport { EuiIconSvgButtonComponent } from './eui-icon-svg-button/eui-icon-svg-button.component';\n@NgModule({\n imports: [CommonModule],\n exports: [EuiIconSvgComponent, EuiIconColorComponent, EuiIconSvgButtonComponent],\n declarations: [EuiIconSvgComponent, EuiIconColorComponent, EuiIconSvgButtonComponent],\n})\nexport class EuiIconModule {}\n"],
|
5
|
-
"mappings": ";AAAA,SACI,yBACA,WACA,OACA,aAEA,mBAIA,QACA,UACA,
|
4
|
+
"sourcesContent": ["import {\n ChangeDetectionStrategy,\n Component,\n Input,\n HostBinding,\n OnInit,\n ViewEncapsulation,\n OnChanges,\n SimpleChanges,\n AfterContentInit,\n Inject,\n Optional,\n booleanAttribute,\n} from '@angular/core';\nimport { EUI_CONFIG_TOKEN } from '@eui/core';\nimport { EuiConfig } from '@eui/base';\nimport { BaseStatesDirective } from '@eui/components/shared';\n\n@Component({\n selector: 'eui-icon-svg, span[euiIconSvg], i[euiIconSvg]',\n templateUrl: './eui-icon-svg.component.html',\n styleUrls: ['./styles/_index.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [\n {\n directive: BaseStatesDirective,\n inputs: [\n 'euiPrimary',\n 'euiSecondary',\n 'euiSuccess',\n 'euiInfo',\n 'euiWarning',\n 'euiDanger',\n 'euiAccent',\n 'euiVariant',\n\n 'euiSizeXS',\n 'euiSizeS',\n 'euiSizeM',\n 'euiSizeL',\n 'euiSizeXL',\n 'euiSizeVariant',\n ],\n },\n ],\n})\nexport class EuiIconSvgComponent implements AfterContentInit, OnChanges, OnInit {\n @HostBinding('attr.role') ariaRole = 'img';\n\n @Input() icon: string; // could be the form of \"icon:set\" to pass them both in a single input\n @Input() fillColor;\n @Input() set = 'eui';\n @Input() size: '2xs' | 'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl' | string = 'm';\n /** @deprecated will be removed in eUI18 as it is ignored by screen readers */\n @Input() ariaLabelledby: string;\n /** @deprecated will be removed in eUI18 as the host role attribute is announced */\n @Input() role: string;\n @Input() style = '';\n @Input() iconUrl: string;\n @Input() transform = '';\n\n @HostBinding('class')\n public get cssClasses(): string {\n return [\n // Always refer to the baseStatesDirective\n this.baseStatesDirective.getCssClasses('eui-icon-svg'),\n this.transform ? `eui-icon-svg--${this.transform}` : '',\n\n // own cmp state => reflected with the scss states\n this.euiStart ? 'eui-icon-svg--start' : '',\n this.euiEnd ? 'eui-icon-svg--end' : '',\n this.isInputIcon ? 'eui-icon-svg--input-icon': '',\n ]\n .join(' ')\n .trim();\n }\n\n @HostBinding('attr.aria-label')\n @Input('aria-label')\n public get ariaLabel(): string {\n return this._ariaLabel;\n }\n public set ariaLabel(value: string | null) {\n this._ariaLabel = value;\n }\n protected _ariaLabel = 'eUI Icon';\n\n public iconName: string;\n public assetsBaseUrl = 'assets';\n public iconStyle;\n\n @Input({ transform: booleanAttribute }) ariaHidden = true;\n @Input({ transform: booleanAttribute }) focusable = false;\n @Input({ transform: booleanAttribute }) isLoading = false;\n @Input({ transform: booleanAttribute }) isInputIcon = false;\n\n @Input({ transform: booleanAttribute }) euiStart = false;\n @Input({ transform: booleanAttribute }) euiEnd = false;\n\n private parentComponent;\n\n constructor(\n @Optional() @Inject(EUI_CONFIG_TOKEN) private config: EuiConfig,\n public baseStatesDirective: BaseStatesDirective,\n ) {\n }\n\n ngOnInit(): void {\n const assetsBaseUrl = this.config?.appConfig?.global?.eui?.assetsBaseUrl;\n if (assetsBaseUrl) {\n this.assetsBaseUrl = this.config.appConfig.global.eui.assetsBaseUrl;\n }\n if (this.isLoading) {\n this.set = 'eui';\n this.icon = 'eui-radio-button-off';\n this.fillColor = 'transparent';\n }\n }\n\n ngOnChanges(c: SimpleChanges): void {\n if (c && c.set) {\n if (c.set.currentValue !== c.set.previousValue) {\n this._setIconAndSet();\n }\n }\n\n if (c && c.icon) {\n if (c.icon.currentValue !== c.icon.previousValue) {\n this._setIconAndSet();\n }\n }\n\n if (c && c.size) {\n if (c.size.currentValue !== c.size.previousValue) {\n this._setStyle();\n }\n }\n if (c && c.fillColor) {\n if (c.fillColor.currentValue !== c.fillColor.previousValue) {\n this._setStyle();\n }\n }\n\n if (c && c.size && this.baseStatesDirective.euiSizeVariant) {\n this.size = this.baseStatesDirective.euiSizeVariant;\n this._setStyle();\n }\n\n if (c && this.baseStatesDirective.euiSizeVariant) {\n this.size = this.baseStatesDirective.euiSizeVariant;\n this._setStyle();\n }\n }\n\n ngAfterContentInit(): void {\n this._setIconAndSet();\n this._setStyle();\n }\n\n private _setIconAndSet(): void {\n if (this.icon && this.icon.indexOf(':') > -1) {\n const iconSet = this.icon.split(':');\n this.icon = iconSet[0];\n this.set = iconSet[1];\n }\n\n if (!this.set || this.set === '') {\n this.set = 'eui';\n } else {\n if (this.set === 'sharp' || this.set === 'outline') {\n this.iconName = `${this.icon}-${this.set}`;\n } else {\n this.iconName = this.icon;\n }\n }\n }\n\n private _setStyle(): void {\n let fill = '';\n if (this.fillColor) {\n fill = `fill: var(--eui-base-color-${this.fillColor}) !important; color: var(--eui-base-color-${this.fillColor}) !important;`;\n }\n const height = `height: var(--eui-base-icon-size-${this.size});`;\n const width = `width: var(--eui-base-icon-size-${this.size});`;\n this.iconStyle = `${fill} ${height} ${width}`;\n }\n}\n", "<ng-container *ngIf=\"icon && !iconUrl && !isLoading\">\n <ng-container *ngTemplateOutlet=\"default\"></ng-container>\n</ng-container>\n<ng-container *ngIf=\"iconUrl\">\n <ng-container *ngTemplateOutlet=\"custom\"></ng-container>\n</ng-container>\n<ng-container *ngIf=\"isLoading\">\n <ng-container *ngTemplateOutlet=\"loading\"></ng-container>\n</ng-container>\n\n<ng-template #default>\n <svg\n class=\"eui-sprite-{{icon}}\"\n [class.eui-icon-svg--loading]=\"isLoading\"\n [attr.aria-hidden]=\"ariaHidden\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.role]=\"role || 'img'\"\n [attr.focusable]=\"focusable\"\n attr.style=\"{{iconStyle}}\">\n <use [attr.href]=\"assetsBaseUrl + '/icons/sprites/' + set + '.svg#' + iconName\"></use>\n </svg>\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #custom>\n <svg class=\"eui-icon-svg\"\n attr.style=\"{{iconStyle}} {{style}}\"\n [attr.aria-hidden]=\"ariaHidden\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.role]=\"role || 'img'\"\n [attr.focusable]=\"focusable\">\n <image [attr.href]=\"iconUrl\" [class]=\"'eui-icon-svg'\" attr.style=\"{{iconStyle}} {{style}}\"></image>\n </svg>\n</ng-template>\n\n<ng-template #loading>\n <eui-icon-svg icon=\"eui-home\" [size]=\"size\" fillColor=\"transparent\" class=\"eui-icon-svg--loading\"></eui-icon-svg>\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n", "import { Component, HostBinding, Input, Output, EventEmitter, ViewEncapsulation, booleanAttribute } from '@angular/core';\n\n@Component({\n selector: 'eui-icon-svg-button',\n templateUrl: './eui-icon-svg-button.component.html',\n styleUrls: [ './eui-icon-svg-button.component.scss' ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiIconSvgButtonComponent {\n @HostBinding('class')\n get cssClasses(): string {\n return [\n 'eui-icon-svg-button',\n this.hasFocusBorder ? 'eui-icon-svg-button--has-focus': '',\n this.hasNoPadding ? 'eui-icon-svg-button--has-no-padding': '',\n ]\n .join(' ')\n .trim();\n }\n @HostBinding('attr.tabindex') tabindex = -1;\n\n @Input() icon: string;\n @Input() fillColor: string;\n @Input() size: '2xs' | 'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl' = 'm';\n @Input() ariaLabel: string;\n\n @Input({ transform: booleanAttribute }) hasFocusBorder = false;\n @Input({ transform: booleanAttribute }) hasNoPadding = false;\n\n @Output() buttonClick = new EventEmitter<Event>();\n\n onClick(event: Event): void {\n this.buttonClick.emit(event);\n }\n}\n", "<button class=\"eui-icon-svg-button__button\"\n type=\"button\"\n (keydown.enter)=\"onClick($event)\"\n (keydown.backspace)=\"onClick($event)\"\n (click)=\"onClick($event)\"\n [attr.aria-label]=\"ariaLabel\">\n <eui-icon-svg [icon]=\"icon\" [fillColor]=\"fillColor\" [size]=\"size\" class=\"eui-icon-svg-button__button-icon\">\n <ng-content select=\"eui-badge\"></ng-content>\n </eui-icon-svg>\n</button>\n", "import { Component, HostBinding, Input } from '@angular/core';\n\n@Component({\n selector: 'eui-icon-colored, span[euiIconColored], [euiIconColored]',\n template: `\n <span [class]=\"iconClass\">\n <span *ngFor=\"let pathNumber of paths\" class=\"path{{ pathNumber }}\"></span>\n </span>\n `,\n})\nexport class EuiIconColorComponent {\n public paths = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20];\n\n @HostBinding('class')\n public get cssClasses(): string {\n return this.getCssClasses();\n }\n\n @Input() iconClass;\n\n getCssClasses(): string {\n return ['eui-icon eui-icon-color', this.iconClass ? this.iconClass : ''].join(' ').trim();\n }\n}\n", "import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { EuiIconSvgComponent } from './eui-icon-svg.component';\nimport { EuiIconColorComponent } from './eui-icon-color.component';\nimport { EuiIconSvgButtonComponent } from './eui-icon-svg-button/eui-icon-svg-button.component';\n@NgModule({\n imports: [CommonModule],\n exports: [EuiIconSvgComponent, EuiIconColorComponent, EuiIconSvgButtonComponent],\n declarations: [EuiIconSvgComponent, EuiIconColorComponent, EuiIconSvgButtonComponent],\n})\nexport class EuiIconModule {}\n"],
|
5
|
+
"mappings": "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",
|
6
6
|
"names": ["Component", "HostBinding", "Input", "ViewEncapsulation", "booleanAttribute", "i0", "Component", "HostBinding", "Input", "i0"]
|
7
7
|
}
|
@@ -50,7 +50,7 @@ var EuiModalSelectorComponent = class _EuiModalSelectorComponent {
|
|
50
50
|
this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: _EuiModalSelectorComponent, deps: [{ token: i1.EuiDialogService }, { token: DIALOG_COMPONENT_CONFIG }], target: i0.ɵɵFactoryTarget.Component });
|
51
51
|
}
|
52
52
|
static {
|
53
|
-
this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.4", type: _EuiModalSelectorComponent, selector: "eui-modal-selector", ngImport: i0, template: '<h4 *ngIf="additionaLanguageRows?.length > 0">EU official languages</h4>\n<div id="eu_languages" *ngFor="let row of languageRows" class="row">\n <div *ngFor="let language of row" class="col-md-6 mb-2">\n <button\n type="button"\n e2eAttr="eui-language-selector-item_{{ language.code }}"\n euiButton\n euiBlockButton\n [euiSecondary]="language.code !== config.selectedLanguage.code"\n [euiPrimary]="language.code === config.selectedLanguage.code"\n (click)="selectLanguage(language)">\n {{ language.label }} ({{ language.code }})\n </button>\n </div>\n</div>\n<ng-container *ngIf="additionaLanguageRows?.length > 0">\n <br />\n <h4>Non-EU Languages</h4>\n <div id="extra_languages" *ngFor="let row of additionaLanguageRows" class="row">\n <div *ngFor="let language of row" class="col-md-6 mb-2">\n <button\n type="button"\n e2eAttr="eui-language-selector-item_{{ language.code }}"\n euiButton\n euiBlockButton\n [euiSecondary]="language.code !== config.selectedLanguage.code"\n [euiPrimary]="language.code === config.selectedLanguage.code"\n (click)="selectLanguage(language)">\n {{ language.label }} ({{ language.code }})\n </button>\n </div>\n </div>\n</ng-container>\n', dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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", "
|
53
|
+
this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.4", type: _EuiModalSelectorComponent, selector: "eui-modal-selector", ngImport: i0, template: '<h4 *ngIf="additionaLanguageRows?.length > 0">EU official languages</h4>\n<div id="eu_languages" *ngFor="let row of languageRows" class="row">\n <div *ngFor="let language of row" class="col-md-6 mb-2">\n <button\n type="button"\n e2eAttr="eui-language-selector-item_{{ language.code }}"\n euiButton\n euiBlockButton\n [euiSecondary]="language.code !== config.selectedLanguage.code"\n [euiPrimary]="language.code === config.selectedLanguage.code"\n (click)="selectLanguage(language)">\n {{ language.label }} ({{ language.code }})\n </button>\n </div>\n</div>\n<ng-container *ngIf="additionaLanguageRows?.length > 0">\n <br />\n <h4>Non-EU Languages</h4>\n <div id="extra_languages" *ngFor="let row of additionaLanguageRows" class="row">\n <div *ngFor="let language of row" class="col-md-6 mb-2">\n <button\n type="button"\n e2eAttr="eui-language-selector-item_{{ language.code }}"\n euiButton\n euiBlockButton\n [euiSecondary]="language.code !== config.selectedLanguage.code"\n [euiPrimary]="language.code === config.selectedLanguage.code"\n (click)="selectLanguage(language)">\n {{ language.label }} ({{ language.code }})\n </button>\n </div>\n </div>\n</ng-container>\n', dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
54
54
|
}
|
55
55
|
};
|
56
56
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: EuiModalSelectorComponent, decorators: [{
|
@@ -159,7 +159,7 @@ var EuiLanguageSelectorComponent = class _EuiLanguageSelectorComponent {
|
|
159
159
|
this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: _EuiLanguageSelectorComponent, deps: [{ token: i02.ChangeDetectorRef }, { token: i12.EuiDialogService }, { token: i22.EuiAppShellService }, { token: i32.TranslateService }], target: i02.ɵɵFactoryTarget.Component });
|
160
160
|
}
|
161
161
|
static {
|
162
|
-
this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.4", type: _EuiLanguageSelectorComponent, selector: "eui-language-selector", inputs: { hasLanguageSelection: ["hasLanguageSelection", "hasLanguageSelection", booleanAttribute], isToolbarSelector: ["isToolbarSelector", "isToolbarSelector", booleanAttribute], euiPrimary: ["euiPrimary", "euiPrimary", booleanAttribute] }, outputs: { languageSelectorClick: "languageSelectorClick" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i02, template: '<ng-container *ngIf="!hasLanguageSelection">\n <button class="eui-language-selector-button" (click)="onClick()">\n <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n <span class="eui-language-selector-button__language-code">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n</ng-container>\n\n<ng-container *ngIf="isShowDropDown && hasLanguageSelection">\n <eui-dropdown>\n <button class="eui-language-selector-button">\n <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n <span class="eui-language-selector-button__language-code">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n <eui-dropdown-content>\n <div class="eui-language-selector-menu">\n <div\n *ngFor="let language of languages"\n euiDropdownItem\n attr.data-e2e="eui-language-selector-item_{{ language.code }}"\n class="eui-language-selector-menu-language-item"\n (click)="onLanguageChanged(language)">\n {{ language.label }} ({{ language.code }})\n </div>\n </div>\n </eui-dropdown-content>\n </eui-dropdown>\n</ng-container>\n\n<ng-container *ngIf="isShowModal && hasLanguageSelection">\n <button class="eui-language-selector-button" (click)="open()">\n <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n <span class="eui-language-selector-button__language-code">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n</ng-container>\n', styles: ['.eui-language-selector{align-items:center;cursor:pointer;display:inline-flex;position:relative;margin-left:var(--eui-base-spacing-m);margin-top:var(--eui-base-spacing-xs)}.eui-language-selector .eui-icon-svg>svg{color:var(--eui-c-primary);fill:var(--eui-c-primary)}.eui-language-selector-button{justify-content:center;position:relative;align-items:center;display:flex;width:100%;padding:0;border:none;background:transparent;cursor:pointer}.eui-language-selector-button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button__language-code{align-items:center;bottom:50%;display:flex;color:var(--eui-c-white);position:absolute;text-transform:uppercase;top:35%;font:normal normal 400 .875rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-language-selector-menu-language-item{padding:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-c-secondary-bg-light);text-align:center;cursor:pointer}.eui-language-selector-menu-language-item:hover{background:var(--eui-c-secondary-bg-light)}.mat-menu-panel{min-width:8rem!important}.niko-test{margin:0}.eui-language-selector--empty{display:none}.eui-language-selector--primary .eui-language-selector-button__language-code{color:var(--eui-c-white)}.eui-language-selector--toolbar-selector{margin-right:var(--eui-base-spacing-m);margin-left:0;margin-bottom:var(--eui-base-spacing-2xs)}.eui-language-selector--toolbar-selector .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-language-selector--toolbar-selector .eui-language-selector-button__language-code{color:var(--eui-c-black)}\n'], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.EuiDropdownComponent, selector: "eui-dropdown", inputs: ["e2eAttr", "tabIndex", "width", "position", "isBlock", "isDropDownRightAligned", "hasClosedOnClickInside", "isLabelUpdatedFromSelectedItem", "isExpandOnHover", "hasTabNavigation", "isRightClickEnabled", "euiDisabled"] }, { kind: "component", type: i5.EuiDropdownItemComponent, selector: "eui-dropdown-item, [euiDropdownItem]", inputs: ["subDropdown", "isActive"] }, { kind: "directive", type: i5.EuiDropdownContentDirective, selector: "eui-dropdown-content" }, { kind: "component", type: i6.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "
|
162
|
+
this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.4", type: _EuiLanguageSelectorComponent, selector: "eui-language-selector", inputs: { hasLanguageSelection: ["hasLanguageSelection", "hasLanguageSelection", booleanAttribute], isToolbarSelector: ["isToolbarSelector", "isToolbarSelector", booleanAttribute], euiPrimary: ["euiPrimary", "euiPrimary", booleanAttribute] }, outputs: { languageSelectorClick: "languageSelectorClick" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i02, template: '<ng-container *ngIf="!hasLanguageSelection">\n <button class="eui-language-selector-button" (click)="onClick()">\n <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n <span class="eui-language-selector-button__language-code">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n</ng-container>\n\n<ng-container *ngIf="isShowDropDown && hasLanguageSelection">\n <eui-dropdown>\n <button class="eui-language-selector-button">\n <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n <span class="eui-language-selector-button__language-code">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n <eui-dropdown-content>\n <div class="eui-language-selector-menu">\n <div\n *ngFor="let language of languages"\n euiDropdownItem\n attr.data-e2e="eui-language-selector-item_{{ language.code }}"\n class="eui-language-selector-menu-language-item"\n (click)="onLanguageChanged(language)">\n {{ language.label }} ({{ language.code }})\n </div>\n </div>\n </eui-dropdown-content>\n </eui-dropdown>\n</ng-container>\n\n<ng-container *ngIf="isShowModal && hasLanguageSelection">\n <button class="eui-language-selector-button" (click)="open()">\n <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n <span class="eui-language-selector-button__language-code">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n</ng-container>\n', styles: ['.eui-language-selector{align-items:center;cursor:pointer;display:inline-flex;position:relative;margin-left:var(--eui-base-spacing-m);margin-top:var(--eui-base-spacing-xs)}.eui-language-selector .eui-icon-svg>svg{color:var(--eui-c-primary);fill:var(--eui-c-primary)}.eui-language-selector-button{justify-content:center;position:relative;align-items:center;display:flex;width:100%;padding:0;border:none;background:transparent;cursor:pointer}.eui-language-selector-button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button__language-code{align-items:center;bottom:50%;display:flex;color:var(--eui-c-white);position:absolute;text-transform:uppercase;top:35%;font:normal normal 400 .875rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-language-selector-menu-language-item{padding:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-c-secondary-bg-light);text-align:center;cursor:pointer}.eui-language-selector-menu-language-item:hover{background:var(--eui-c-secondary-bg-light)}.mat-menu-panel{min-width:8rem!important}.niko-test{margin:0}.eui-language-selector--empty{display:none}.eui-language-selector--primary .eui-language-selector-button__language-code{color:var(--eui-c-white)}.eui-language-selector--toolbar-selector{margin-right:var(--eui-base-spacing-m);margin-left:0;margin-bottom:var(--eui-base-spacing-2xs)}.eui-language-selector--toolbar-selector .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-language-selector--toolbar-selector .eui-language-selector-button__language-code{color:var(--eui-c-black)}\n'], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.EuiDropdownComponent, selector: "eui-dropdown", inputs: ["e2eAttr", "tabIndex", "width", "position", "isBlock", "isDropDownRightAligned", "hasClosedOnClickInside", "isLabelUpdatedFromSelectedItem", "isExpandOnHover", "hasTabNavigation", "isRightClickEnabled", "euiDisabled"] }, { kind: "component", type: i5.EuiDropdownItemComponent, selector: "eui-dropdown-item, [euiDropdownItem]", inputs: ["subDropdown", "isActive"] }, { kind: "directive", type: i5.EuiDropdownContentDirective, selector: "eui-dropdown-content" }, { kind: "component", type: i6.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], encapsulation: i02.ViewEncapsulation.None });
|
163
163
|
}
|
164
164
|
};
|
165
165
|
i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: EuiLanguageSelectorComponent, decorators: [{
|
@@ -2,6 +2,6 @@
|
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["../../eui-language-selector/modal-selector/modal-selector.component.ts", "../../eui-language-selector/modal-selector/modal-selector.component.html", "../../eui-language-selector/language-selector.component.ts", "../../eui-language-selector/language-selector.component.html", "../../eui-language-selector/language-selector.module.ts"],
|
4
4
|
"sourcesContent": ["import { Component, ViewEncapsulation, ChangeDetectionStrategy, OnInit, Inject } from '@angular/core';\nimport { EuiEuLanguages, EuiLanguage } from '@eui/base';\n\nimport { DIALOG_COMPONENT_CONFIG } from '@eui/components/eui-dialog';\nimport { EuiDialogService } from '@eui/components/eui-dialog';\n\n@Component({\n selector: 'eui-modal-selector',\n templateUrl: './modal-selector.component.html',\n changeDetection: ChangeDetectionStrategy.Default,\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiModalSelectorComponent implements OnInit {\n public languageRows: EuiLanguage[][] = [];\n public additionaLanguageRows: EuiLanguage[][] = [];\n\n private selectedLanguage: EuiLanguage;\n\n constructor(\n private euiDialogService: EuiDialogService,\n @Inject(DIALOG_COMPONENT_CONFIG)\n public config: {\n languages: EuiLanguage[];\n selectedLanguage: EuiLanguage;\n languageChanged: (language: EuiLanguage) => void;\n },\n ) {}\n\n ngOnInit(): void {\n this.languageRows = this.prepareLanguageRows(EuiEuLanguages.filterEULanguages(this.config.languages));\n this.additionaLanguageRows = this.prepareLanguageRows(EuiEuLanguages.filterNonEULanguages(this.config.languages));\n }\n\n selectLanguage(languageCode: EuiLanguage): void {\n if (this.selectedLanguage?.code !== languageCode.code) {\n for (const language of this.config.languages) {\n if (language.code === languageCode.code) {\n this.selectedLanguage = language;\n break;\n }\n }\n }\n\n this.config.languageChanged(languageCode);\n this.euiDialogService.closeDialog();\n }\n\n private prepareLanguageRows(languages: EuiLanguage[]): EuiLanguage[][] {\n const rows: EuiLanguage[][] = [];\n let row: EuiLanguage[] = [];\n\n for (let i = 0; i < languages.length; i++) {\n if (i % 4 === 0) {\n if (row.length > 0) {\n rows.push(row);\n row = [];\n }\n }\n row.push(languages[i]);\n }\n\n if (row.length > 0) {\n rows.push(row);\n }\n\n return rows;\n }\n}\n", "<h4 *ngIf=\"additionaLanguageRows?.length > 0\">EU official languages</h4>\n<div id=\"eu_languages\" *ngFor=\"let row of languageRows\" class=\"row\">\n <div *ngFor=\"let language of row\" class=\"col-md-6 mb-2\">\n <button\n type=\"button\"\n e2eAttr=\"eui-language-selector-item_{{ language.code }}\"\n euiButton\n euiBlockButton\n [euiSecondary]=\"language.code !== config.selectedLanguage.code\"\n [euiPrimary]=\"language.code === config.selectedLanguage.code\"\n (click)=\"selectLanguage(language)\">\n {{ language.label }} ({{ language.code }})\n </button>\n </div>\n</div>\n<ng-container *ngIf=\"additionaLanguageRows?.length > 0\">\n <br />\n <h4>Non-EU Languages</h4>\n <div id=\"extra_languages\" *ngFor=\"let row of additionaLanguageRows\" class=\"row\">\n <div *ngFor=\"let language of row\" class=\"col-md-6 mb-2\">\n <button\n type=\"button\"\n e2eAttr=\"eui-language-selector-item_{{ language.code }}\"\n euiButton\n euiBlockButton\n [euiSecondary]=\"language.code !== config.selectedLanguage.code\"\n [euiPrimary]=\"language.code === config.selectedLanguage.code\"\n (click)=\"selectLanguage(language)\">\n {{ language.label }} ({{ language.code }})\n </button>\n </div>\n </div>\n</ng-container>\n", "import {\n Component,\n ViewEncapsulation,\n HostBinding,\n OnDestroy,\n OnInit,\n ChangeDetectorRef,\n Input,\n Output,\n EventEmitter,\n booleanAttribute,\n} from '@angular/core';\nimport { distinctUntilKeyChanged, map, takeUntil } from 'rxjs/operators';\nimport { Subject } from 'rxjs';\nimport { TranslateService } from '@ngx-translate/core';\n\nimport { EuiEuLanguages, EuiLanguage } from '@eui/base';\nimport { EuiAppShellService } from '@eui/core';\nimport { EuiDialogConfig, EuiDialogService } from '@eui/components/eui-dialog';\n\nimport { EuiModalSelectorComponent } from './modal-selector/modal-selector.component';\n\n@Component({\n selector: 'eui-language-selector',\n templateUrl: './language-selector.component.html',\n styleUrls: ['./_styles/_index.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiLanguageSelectorComponent implements OnInit, OnDestroy {\n @HostBinding('class')\n get cssClasses(): string {\n return [\n 'eui-language-selector',\n this.languages?.length <= 1 ? 'eui-language-selector--empty' : '',\n this.isToolbarSelector ? 'eui-language-selector--toolbar-selector' : '',\n ].join(' ').trim();\n }\n\n languages: EuiLanguage[];\n selectedLanguage: EuiLanguage;\n\n @Input({ transform: booleanAttribute }) hasLanguageSelection = true;\n @Input({ transform: booleanAttribute }) isToolbarSelector = false;\n @Input({ transform: booleanAttribute }) euiPrimary = false;\n\n @Output() languageSelectorClick = new EventEmitter<null>();\n\n private destroy$: Subject<boolean> = new Subject<boolean>();\n\n constructor(\n private cd: ChangeDetectorRef,\n private euiDialogService: EuiDialogService,\n public appShellService: EuiAppShellService,\n private translateService: TranslateService,\n ) {\n }\n\n /**\n * returns true if there are at least one and max four languages.\n */\n get isShowDropDown(): boolean {\n return this.languages?.length > 1 && this.languages?.length < 4;\n }\n\n /**\n * returns true if there are at least five languages.\n */\n get isShowModal(): boolean {\n return this.languages?.length >= 4;\n }\n\n ngOnInit(): void {\n // update languages array based on AppShell State 'language' changes\n this.appShellService.state$\n .pipe(\n takeUntil(this.destroy$),\n distinctUntilKeyChanged('languages'),\n map((state) => state.languages),\n )\n .subscribe((languages) => {\n this.languages = languages ? EuiEuLanguages.getOrderedLanguages(languages) : EuiEuLanguages.getLanguages();\n this.cd.detectChanges();\n });\n\n // update activeLanguage array based on AppShell State 'language' changes\n this.appShellService.state$\n .pipe(\n takeUntil(this.destroy$),\n distinctUntilKeyChanged('activeLanguage'),\n map((state) => state.activeLanguage),\n )\n .subscribe((activeLanguage) => {\n this.selectedLanguage = this.getLanguage(activeLanguage);\n this.cd.detectChanges();\n });\n }\n\n ngOnDestroy(): void {\n this.destroy$.next(true);\n this.destroy$.unsubscribe();\n }\n\n onLanguageChanged(language: EuiLanguage): void {\n // Update the AppShellService state\n this.appShellService.setState({\n ...this.appShellService.state,\n activeLanguage: language.code,\n });\n }\n\n /**\n * Opens the modal that renders the UxLanguage array with modal actions bindings to this Component\n */\n open(titleLabel: string = this.translateService.instant('eui.languageSelector.modalTitle')): void {\n this.euiDialogService.openDialog(\n new EuiDialogConfig({\n title: titleLabel,\n hasFooter: false,\n hasClosedOnClickOutside: true,\n bodyComponent: {\n component: EuiModalSelectorComponent,\n config: {\n languages: this.languages,\n selectedLanguage: this.selectedLanguage,\n languageChanged: (language: EuiLanguage) => this.onLanguageChanged(language),\n },\n },\n }),\n );\n }\n\n onClick(): void {\n this.languageSelectorClick.emit();\n }\n\n /**\n * returns the UxLanguage Object from a given language code\n *\n * @param languageCode two char language code\n * @protected\n */\n protected getLanguage(languageCode: string): EuiLanguage {\n return this.languages.find((lang) => lang.code === languageCode);\n }\n}\n", "<ng-container *ngIf=\"!hasLanguageSelection\">\n <button class=\"eui-language-selector-button\" (click)=\"onClick()\">\n <eui-icon-svg icon=\"eui-ecl-language\" size=\"l\" fillColor=\"white\"></eui-icon-svg>\n <span class=\"eui-language-selector-button__language-code\">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n</ng-container>\n\n<ng-container *ngIf=\"isShowDropDown && hasLanguageSelection\">\n <eui-dropdown>\n <button class=\"eui-language-selector-button\">\n <eui-icon-svg icon=\"eui-ecl-language\" size=\"l\" fillColor=\"white\"></eui-icon-svg>\n <span class=\"eui-language-selector-button__language-code\">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n <eui-dropdown-content>\n <div class=\"eui-language-selector-menu\">\n <div\n *ngFor=\"let language of languages\"\n euiDropdownItem\n attr.data-e2e=\"eui-language-selector-item_{{ language.code }}\"\n class=\"eui-language-selector-menu-language-item\"\n (click)=\"onLanguageChanged(language)\">\n {{ language.label }} ({{ language.code }})\n </div>\n </div>\n </eui-dropdown-content>\n </eui-dropdown>\n</ng-container>\n\n<ng-container *ngIf=\"isShowModal && hasLanguageSelection\">\n <button class=\"eui-language-selector-button\" (click)=\"open()\">\n <eui-icon-svg icon=\"eui-ecl-language\" size=\"l\" fillColor=\"white\"></eui-icon-svg>\n <span class=\"eui-language-selector-button__language-code\">\n {{ (appShellService.state$ | async).activeLanguage }}\n </span>\n </button>\n</ng-container>\n", "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiDropdownModule } from '@eui/components/eui-dropdown';\nimport { EuiDialogModule } from '@eui/components/eui-dialog';\nimport { EuiIconModule } from '@eui/components/eui-icon';\n\nimport { EuiLanguageSelectorComponent } from './language-selector.component';\nimport { EuiModalSelectorComponent } from './modal-selector/modal-selector.component';\n\n@NgModule({\n imports: [CommonModule, EuiDropdownModule, EuiButtonModule, EuiDialogModule, EuiIconModule],\n exports: [EuiLanguageSelectorComponent],\n declarations: [EuiLanguageSelectorComponent, EuiModalSelectorComponent],\n})\nexport class EuiLanguageSelectorModule {}\n"],
|
5
|
-
"mappings": ";AAAA,SAAS,WAAW,mBAAmB,yBAAiC,cAAc;AACtF,SAAS,sBAAmC;AAE5C,SAAS,+BAA+B;;;;;AASlC,IAAO,4BAAP,MAAO,2BAAyB;EAMlC,YACY,kBAED,QAIN;AANO,SAAA,mBAAA;AAED,SAAA,SAAA;AARJ,SAAA,eAAgC,CAAA;AAChC,SAAA,wBAAyC,CAAA;EAY7C;EAEH,WAAQ;AACJ,SAAK,eAAe,KAAK,oBAAoB,eAAe,kBAAkB,KAAK,OAAO,SAAS,CAAC;AACpG,SAAK,wBAAwB,KAAK,oBAAoB,eAAe,qBAAqB,KAAK,OAAO,SAAS,CAAC;EACpH;EAEA,eAAe,cAAyB;AACpC,QAAI,KAAK,kBAAkB,SAAS,aAAa,MAAM;AACnD,iBAAW,YAAY,KAAK,OAAO,WAAW;AAC1C,YAAI,SAAS,SAAS,aAAa,MAAM;AACrC,eAAK,mBAAmB;AACxB;QACJ;MACJ;IACJ;AAEA,SAAK,OAAO,gBAAgB,YAAY;AACxC,SAAK,iBAAiB,YAAW;EACrC;EAEQ,oBAAoB,WAAwB;AAChD,UAAM,OAAwB,CAAA;AAC9B,QAAI,MAAqB,CAAA;AAEzB,aAAS,IAAI,GAAG,IAAI,UAAU,QAAQ,KAAK;AACvC,UAAI,IAAI,MAAM,GAAG;AACb,YAAI,IAAI,SAAS,GAAG;AAChB,eAAK,KAAK,GAAG;AACb,gBAAM,CAAA;QACV;MACJ;AACA,UAAI,KAAK,UAAU,CAAC,CAAC;IACzB;AAEA,QAAI,IAAI,SAAS,GAAG;AAChB,WAAK,KAAK,GAAG;IACjB;AAEA,WAAO;EACX;;4GAtDS,4BAAyB,MAAA,CAAA,EAAA,OAAA,oBAAA,GAAA,EAAA,OAQtB,wBAAuB,CAAA,GAAA,QAAA,mBAAA,UAAA,CAAA;EAAA;;gGAR1B,4BAAyB,UAAA,sBAAA,UAAA,IAAA,UCZtC,06CAiCA,cAAA,CAAA,EAAA,MAAA,aAAA,MAAA,YAAA,UAAA,oBAAA,QAAA,CAAA,WAAA,gBAAA,eAAA,EAAA,GAAA,EAAA,MAAA,aAAA,MAAA,SAAA,UAAA,UAAA,QAAA,CAAA,QAAA,YAAA,UAAA,EAAA,GAAA,EAAA,MAAA,aAAA,MAAA,uBAAA,UAAA,mCAAA,QAAA,CAAA,WAAA,MAAA,kBAAA,iBAAA,kBAAA,
|
5
|
+
"mappings": "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",
|
6
6
|
"names": ["Component", "ViewEncapsulation", "EuiEuLanguages", "i0"]
|
7
7
|
}
|
@@ -115,7 +115,7 @@ var EuiListItemComponent = class _EuiListItemComponent {
|
|
115
115
|
</div>
|
116
116
|
<ng-content></ng-content>
|
117
117
|
</div>
|
118
|
-
`, styles: ['.eui-list{display:block;height:auto;position:relative;margin:0;padding:0}.eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none!important}.eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item{background:none;border:none;box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-list .eui-list-item--active{background-color:var(--eui-c-active)}.eui-list .eui-list-item .eui-list-item__container{display:inline-flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon,.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg .eui-icon-svg{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right{align-items:center;display:flex;margin-left:auto}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right .eui-list-item__content-toggle{align-items:center;display:inline-flex;font-size:var(--eui-base-font-size-m);margin-left:var(--eui-base-spacing-s);transition:all .3s linear}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-base-spacing-m)}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-base-spacing-s)}.eui-list button.eui-list-item{padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs)}navigation-list nav{height:auto}.eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity)}.eui-list-item--primary{color:var(--eui-c-primary)}.eui-list-item--secondary{color:var(--eui-c-secondary-light)}.eui-list-item--info{color:var(--eui-c-info)}.eui-list-item--success{color:var(--eui-c-success)}.eui-list-item--warning{color:var(--eui-c-warning)}.eui-list-item--danger{color:var(--eui-c-danger)}.eui-list-item--accent{color:var(--eui-c-accent-dark)}\n'], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "
|
118
|
+
`, styles: ['.eui-list{display:block;height:auto;position:relative;margin:0;padding:0}.eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none!important}.eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item{background:none;border:none;box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none!important}.eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-list .eui-list-item--active{background-color:var(--eui-c-active)}.eui-list .eui-list-item .eui-list-item__container{display:inline-flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon,.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg .eui-icon-svg{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right{align-items:center;display:flex;margin-left:auto}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right .eui-list-item__content-toggle{align-items:center;display:inline-flex;font-size:var(--eui-base-font-size-m);margin-left:var(--eui-base-spacing-s);transition:all .3s linear}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-base-spacing-m)}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-base-spacing-s)}.eui-list button.eui-list-item{padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs)}navigation-list nav{height:auto}.eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity)}.eui-list-item--primary{color:var(--eui-c-primary)}.eui-list-item--secondary{color:var(--eui-c-secondary-light)}.eui-list-item--info{color:var(--eui-c-info)}.eui-list-item--success{color:var(--eui-c-success)}.eui-list-item--warning{color:var(--eui-c-warning)}.eui-list-item--danger{color:var(--eui-c-danger)}.eui-list-item--accent{color:var(--eui-c-accent-dark)}\n'], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i5.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }], changeDetection: i02.ChangeDetectionStrategy.Default, encapsulation: i02.ViewEncapsulation.None });
|
119
119
|
}
|
120
120
|
};
|
121
121
|
i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: EuiListItemComponent, decorators: [{
|