@eui/components 17.2.1-snapshot-1708395642178 → 17.2.1
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/EuiDateRangeSelectorComponent.html +25 -326
- package/docs/components/EuiNotificationItemComponent.html +21 -1
- package/docs/components/EuiTabsComponent.html +1 -1
- package/docs/components/EuiTreeListComponent.html +41 -1
- package/docs/components/EuiTreeListToolbarComponent.html +1 -1
- package/docs/dependencies.html +2 -2
- package/docs/js/search/search_index.js +2 -2
- package/esm2022/eui-date-range-selector/eui-date-range-selector.component.mjs +18 -44
- package/esm2022/eui-tabs/eui-tabs.component.mjs +3 -3
- package/esm2022/eui-tree-list/eui-tree-list.component.mjs +9 -3
- package/esm2022/eui-tree-list/toolbar/toolbar.component.mjs +3 -3
- package/esm2022/layout/eui-notifications/eui-notification-item.component.mjs +6 -3
- package/eui-date-range-selector/eui-date-range-selector.component.d.ts +10 -16
- package/eui-date-range-selector/eui-date-range-selector.component.d.ts.map +1 -1
- package/eui-tree-list/eui-tree-list.component.d.ts +2 -0
- package/eui-tree-list/eui-tree-list.component.d.ts.map +1 -1
- package/fesm2022/eui-components-eui-date-range-selector.mjs +17 -43
- package/fesm2022/eui-components-eui-date-range-selector.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tabs.mjs +2 -2
- package/fesm2022/eui-components-eui-tabs.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tree-list.mjs +10 -4
- package/fesm2022/eui-components-eui-tree-list.mjs.map +1 -1
- package/fesm2022/eui-components-layout.mjs +5 -2
- package/fesm2022/eui-components-layout.mjs.map +1 -1
- package/layout/eui-notifications/eui-notification-item.component.d.ts +1 -0
- package/layout/eui-notifications/eui-notification-item.component.d.ts.map +1 -1
- package/package.json +31 -31
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component, ViewEncapsulation, Optional, Self, Output, Input, NgModule } from '@angular/core';
|
|
2
|
+
import { EventEmitter, booleanAttribute, Component, ViewEncapsulation, Optional, Self, Output, Input, NgModule } from '@angular/core';
|
|
3
3
|
import * as i5 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i4 from '@angular/forms';
|
|
@@ -11,7 +11,6 @@ import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
|
11
11
|
import * as i3 from '@angular/material/core';
|
|
12
12
|
import { DateAdapter, MAT_DATE_LOCALE, MAT_DATE_FORMATS } from '@angular/material/core';
|
|
13
13
|
import { MatMomentDateModule, MomentDateAdapter } from '@angular/material-moment-adapter';
|
|
14
|
-
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
15
14
|
import { Subject } from 'rxjs';
|
|
16
15
|
import { takeUntil } from 'rxjs/operators';
|
|
17
16
|
import * as i2 from '@eui/core';
|
|
@@ -26,36 +25,6 @@ import moment from 'moment';
|
|
|
26
25
|
|
|
27
26
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
28
27
|
class EuiDateRangeSelectorComponent {
|
|
29
|
-
get islongDateFormat() {
|
|
30
|
-
return this._islongDateFormat;
|
|
31
|
-
}
|
|
32
|
-
set islongDateFormat(value) {
|
|
33
|
-
this._islongDateFormat = coerceBooleanProperty(value);
|
|
34
|
-
}
|
|
35
|
-
get isClearable() {
|
|
36
|
-
return this._isClearable && !this._isReadOnly;
|
|
37
|
-
}
|
|
38
|
-
set isClearable(value) {
|
|
39
|
-
this._isClearable = coerceBooleanProperty(value);
|
|
40
|
-
}
|
|
41
|
-
get isReadOnly() {
|
|
42
|
-
return this._isReadOnly;
|
|
43
|
-
}
|
|
44
|
-
set isReadOnly(value) {
|
|
45
|
-
this._isReadOnly = coerceBooleanProperty(value);
|
|
46
|
-
}
|
|
47
|
-
get isDisabled() {
|
|
48
|
-
return this._isDisabled;
|
|
49
|
-
}
|
|
50
|
-
set isDisabled(value) {
|
|
51
|
-
this._isDisabled = coerceBooleanProperty(value);
|
|
52
|
-
}
|
|
53
|
-
get isResponsive() {
|
|
54
|
-
return this._isResponsive;
|
|
55
|
-
}
|
|
56
|
-
set isResponsive(value) {
|
|
57
|
-
this._isResponsive = coerceBooleanProperty(value);
|
|
58
|
-
}
|
|
59
28
|
constructor(translateService, localeService, adapter, control) {
|
|
60
29
|
this.translateService = translateService;
|
|
61
30
|
this.localeService = localeService;
|
|
@@ -70,11 +39,11 @@ class EuiDateRangeSelectorComponent {
|
|
|
70
39
|
this.e2eAttr = 'eui-date-range-selector';
|
|
71
40
|
this.togglerIconSvg = 'eui-calendar-outline';
|
|
72
41
|
this.startView = 'month';
|
|
73
|
-
this.
|
|
74
|
-
this.
|
|
75
|
-
this.
|
|
76
|
-
this.
|
|
77
|
-
this.
|
|
42
|
+
this.islongDateFormat = false;
|
|
43
|
+
this.isClearable = false;
|
|
44
|
+
this.isReadOnly = false;
|
|
45
|
+
this.isDisabled = false;
|
|
46
|
+
this.isResponsive = false;
|
|
78
47
|
this.destroy$ = new Subject();
|
|
79
48
|
// eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars
|
|
80
49
|
this.propagateChange = (_) => { };
|
|
@@ -215,7 +184,7 @@ class EuiDateRangeSelectorComponent {
|
|
|
215
184
|
this.propagateTouched = fn;
|
|
216
185
|
}
|
|
217
186
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiDateRangeSelectorComponent, deps: [{ token: i1.TranslateService }, { token: i2.LocaleService, optional: true }, { token: i3.DateAdapter }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
218
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
187
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.0.8", type: EuiDateRangeSelectorComponent, selector: "eui-date-range-selector", inputs: { styleClass: "styleClass", e2eAttr: "e2eAttr", minDate: "minDate", maxDate: "maxDate", togglerIcon: "togglerIcon", togglerIconSvg: "togglerIconSvg", togglerLabel: "togglerLabel", firstInputPlaceholder: "firstInputPlaceholder", secondInputPlaceholder: "secondInputPlaceholder", firstInputAriaLabel: "firstInputAriaLabel", secondInputAriaLabel: "secondInputAriaLabel", startDateDefaultValue: "startDateDefaultValue", endDateDefaultValue: "endDateDefaultValue", comparisonStart: "comparisonStart", comparisonEnd: "comparisonEnd", startView: "startView", islongDateFormat: ["islongDateFormat", "islongDateFormat", booleanAttribute], isClearable: ["isClearable", "isClearable", booleanAttribute], isReadOnly: ["isReadOnly", "isReadOnly", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isResponsive: ["isResponsive", "isResponsive", booleanAttribute] }, outputs: { firstSelectedDate: "firstSelectedDate", secondSelectedDate: "secondSelectedDate" }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"eui-date-range-selector {{ styleClass }}\"\n attr.data-e2e=\"{{ e2eAttr }}\"\n [class.eui-date-range-selector--responsive]=\"isResponsive\">\n <mat-date-range-input\n [class.mat-date-range-input--read-only]=\"isReadOnly\"\n [class.mat-date-range-input--disabled]=\"isDisabled\"\n [class.mat-date-range-input--invalid]=\"isInvalid && isTouched\"\n [rangePicker]=\"picker\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n [comparisonStart]=\"comparisonStart\"\n [comparisonEnd]=\"comparisonEnd\">\n <input\n class=\"eui-date-range-selector__start-date\"\n euiInputText\n [readonly]=\"isReadOnly\"\n matStartDate\n placeholder=\"{{ firstInputPlaceholder }}\"\n attr.aria-label=\"{{ firstInputAriaLabel }}\"\n [formControl]=\"startRangeFormControl\"\n (dateInput)=\"onFirstDateChange($event)\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onFirstDateClear()\" />\n <input\n class=\"eui-date-range-selector__end-date\"\n euiInputText\n [readonly]=\"isReadOnly\"\n matEndDate\n placeholder=\"{{ secondInputPlaceholder }}\"\n attr.aria-label=\"{{ secondInputAriaLabel }}\"\n [formControl]=\"endRangeFormControl\"\n (dateInput)=\"onSecondDateChange($event)\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onSecondDateClear()\" />\n </mat-date-range-input>\n <mat-date-range-picker #picker [startView]=\"startView\"> </mat-date-range-picker>\n <button\n *ngIf=\"!isReadOnly\"\n class=\"eui-date-range-selector__toggler eui-date-range-selector__toggler-{{ !togglerLabel ? 'icon' : 'label' }}\"\n (click)=\"picker.open()\"\n euiButton\n euiSecondary\n euiIconButton\n type=\"button\"\n [euiDisabled]=\"isDisabled\"\n aria-haspopup=\"dialog\">\n <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n </ng-container>\n <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n </button>\n</div>\n", styles: ["eui-date-range-selector{display:flex;width:100%}.eui-date-range-selector{display:inline-flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector--responsive{display:flex;width:100%}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container{align-items:center;display:flex;height:100%}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper{height:100%;width:calc(6.9 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper .eui-input-text{min-height:calc(var(--eui-base-spacing-2xl) + 2px)}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper{width:calc(8.5 * var(--eui-base-spacing-m))!important}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper .mat-date-range-input-inner{position:relative}.eui-date-range-selector--long-date-format .mat-date-range-input-wrapper{width:calc(12.5 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:1}.eui-date-range-selector__toggler{border-bottom-left-radius:0;border-top-left-radius:0;border-left:none}.eui-date-range-selector__toggler-label{width:auto}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;box-sizing:border-box;background:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-50);border-radius:var(--eui-base-border-radius);border-bottom-right-radius:0;border-top-right-radius:0;text-align:center}.eui-date-range-selector .mat-date-range-input--read-only{background-color:transparent;border-color:transparent!important;box-shadow:none;height:inherit;padding:var(--eui-base-spacing-2xs) 0;pointer-events:none}.eui-date-range-selector .mat-date-range-input--read-only .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:0}.eui-date-range-selector .mat-date-range-input--disabled{background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity);background-color:var(--eui-base-color-grey-5);border:1px solid var(--eui-base-color-grey-25)}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__start-date{border-right:none!important}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__end-date{border-left:none!important}.eui-date-range-selector .mat-date-range-input--invalid{border:1px solid var(--eui-base-color-danger-100)}.eui-date-range-selector input.mat-date-range-input-inner{align-items:center;font: 400 1rem/1.25rem arial,sans-serif;appearance:none;background-color:inherit;border:hidden;color:var(--eui-base-color-grey-100);display:flex;padding:var(--eui-base-spacing-s);text-align:left;width:100%}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i6.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i6.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i6.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i6.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i7.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i8.EuiIconComponent, selector: "div[euiIcon], span[euiIcon], i[euiIcon], eui-icon", inputs: ["aria-label", "iconClass", "isLoading"] }, { kind: "component", type: i8.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i9.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["class", "isInvalid"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
219
188
|
}
|
|
220
189
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiDateRangeSelectorComponent, decorators: [{
|
|
221
190
|
type: Component,
|
|
@@ -263,15 +232,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
|
|
|
263
232
|
}], startView: [{
|
|
264
233
|
type: Input
|
|
265
234
|
}], islongDateFormat: [{
|
|
266
|
-
type: Input
|
|
235
|
+
type: Input,
|
|
236
|
+
args: [{ transform: booleanAttribute }]
|
|
267
237
|
}], isClearable: [{
|
|
268
|
-
type: Input
|
|
238
|
+
type: Input,
|
|
239
|
+
args: [{ transform: booleanAttribute }]
|
|
269
240
|
}], isReadOnly: [{
|
|
270
|
-
type: Input
|
|
241
|
+
type: Input,
|
|
242
|
+
args: [{ transform: booleanAttribute }]
|
|
271
243
|
}], isDisabled: [{
|
|
272
|
-
type: Input
|
|
244
|
+
type: Input,
|
|
245
|
+
args: [{ transform: booleanAttribute }]
|
|
273
246
|
}], isResponsive: [{
|
|
274
|
-
type: Input
|
|
247
|
+
type: Input,
|
|
248
|
+
args: [{ transform: booleanAttribute }]
|
|
275
249
|
}] } });
|
|
276
250
|
|
|
277
251
|
class EuiDateRangeSelectorModule {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-components-eui-date-range-selector.mjs","sources":["../../eui-date-range-selector/eui-date-range-selector.component.ts","../../eui-date-range-selector/eui-date-range-selector.component.html","../../eui-date-range-selector/eui-date-range-selector.module.ts","../../eui-date-range-selector/eui-date-range-selector.validators.ts","../../eui-date-range-selector/eui-components-eui-date-range-selector.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {\n AfterContentInit,\n Component,\n DoCheck,\n EventEmitter,\n Input,\n OnChanges,\n OnDestroy,\n OnInit,\n Optional,\n Output,\n Self,\n SimpleChanges,\n ViewEncapsulation,\n} from '@angular/core';\nimport { ControlValueAccessor, FormControl, NgControl } from '@angular/forms';\nimport { MatDatepickerInputEvent } from '@angular/material/datepicker';\nimport { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\nimport { DateAdapter } from '@angular/material/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { LocaleService } from '@eui/core';\nimport { EuiDateRangeSelectorDates } from './models/eui-date-range-selector-dates.model';\n@Component({\n selector: 'eui-date-range-selector',\n templateUrl: './eui-date-range-selector.component.html',\n styleUrls: ['./styles/_index.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiDateRangeSelectorComponent implements OnInit, AfterContentInit, OnDestroy, OnChanges, ControlValueAccessor, DoCheck {\n selectedDates: EuiDateRangeSelectorDates = { startRange:null, endRange: null };\n public isInvalid: boolean;\n public isTouched: boolean;\n public startRangeFormControl = new FormControl();\n public endRangeFormControl = new FormControl();\n\n @Output() firstSelectedDate = new EventEmitter<any>();\n @Output() secondSelectedDate = new EventEmitter<any>();\n\n @Input() styleClass = '';\n @Input() e2eAttr = 'eui-date-range-selector';\n @Input() minDate: any;\n @Input() maxDate: any;\n @Input() togglerIcon: string;\n @Input() togglerIconSvg = 'eui-calendar-outline';\n @Input() togglerLabel: string;\n @Input() firstInputPlaceholder: string;\n @Input() secondInputPlaceholder: string;\n @Input() firstInputAriaLabel: string;\n @Input() secondInputAriaLabel: string;\n @Input() startDateDefaultValue: any;\n @Input() endDateDefaultValue: any;\n @Input() comparisonStart: any;\n @Input() comparisonEnd: any;\n @Input() startView: 'month' | 'year' | 'multi-year' = 'month';\n @Input()\n get islongDateFormat(): boolean {\n return this._islongDateFormat;\n }\n set islongDateFormat(value: BooleanInput) {\n this._islongDateFormat = coerceBooleanProperty(value);\n }\n private _islongDateFormat = false;\n @Input()\n get isClearable(): boolean {\n return this._isClearable && !this._isReadOnly;\n }\n set isClearable(value: BooleanInput) {\n this._isClearable = coerceBooleanProperty(value);\n }\n private _isClearable = false;\n @Input()\n get isReadOnly(): boolean {\n return this._isReadOnly;\n }\n set isReadOnly(value: BooleanInput) {\n this._isReadOnly = coerceBooleanProperty(value);\n }\n private _isReadOnly = false;\n @Input()\n get isDisabled(): boolean {\n return this._isDisabled;\n }\n set isDisabled(value: BooleanInput) {\n this._isDisabled = coerceBooleanProperty(value);\n }\n private _isDisabled = false;\n @Input()\n get isResponsive(): boolean {\n return this._isResponsive;\n }\n set isResponsive(value: BooleanInput) {\n this._isResponsive = coerceBooleanProperty(value);\n }\n private _isResponsive = false;\n\n private destroy$: Subject<boolean> = new Subject<boolean>();\n\n constructor(\n protected translateService: TranslateService,\n @Optional() protected localeService: LocaleService,\n protected adapter: DateAdapter<any>,\n @Self() @Optional() protected control: NgControl,\n ) {\n if (this.control) {\n this.control.valueAccessor = this;\n }\n }\n\n ngOnInit(): void {\n this.localeService\n .getState()\n .pipe(takeUntil(this.destroy$))\n .subscribe((state) => {\n this.adapter.setLocale(state.id);\n });\n\n this.startRangeFormControl = new FormControl({ value: this.startDateDefaultValue, disabled: this.isDisabled });\n this.endRangeFormControl = new FormControl({ value: this.endDateDefaultValue, disabled: this.isDisabled });\n\n if (!this.firstInputPlaceholder) {\n this.translateService\n .stream('eui.daterangeselector.FIRSTPICKERSLABEL')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.firstInputPlaceholder = result;\n });\n }\n // by setting the firstInputAriaLabel to dd/mm/yyyy(or the desired format) the format can be announced to the screen reader users before the users start typing\n if (!this.firstInputAriaLabel) {\n this.translateService\n .stream('eui.daterangeselector.FIRSTPICKERSPLACEHOLDER')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.firstInputAriaLabel = result;\n });\n }\n if (!this.secondInputPlaceholder) {\n this.translateService\n .stream('eui.daterangeselector.SECONDPICKERSLABEL')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.secondInputPlaceholder = result;\n });\n }\n // by setting the secondInputAriaLabel to dd/mm/yyyy(or the desired format) the format can be announced to the screen reader users before the users start typing\n if (!this.secondInputAriaLabel) {\n this.translateService\n .stream('eui.daterangeselector.SECONDPICKERSPLACEHOLDER')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.secondInputAriaLabel = result;\n });\n }\n }\n\n ngDoCheck(): void {\n if (this.control) {\n // marks the input controls as touched/invalid if the form control is touched/invalid\n this.control?.touched ? this.startRangeFormControl?.markAsTouched() : this.startRangeFormControl.markAsUntouched();\n this.control?.touched ? this.endRangeFormControl.markAsTouched() : this.endRangeFormControl?.markAsUntouched();\n this.control?.touched ? (this.isTouched = true) : (this.isTouched = false);\n this.control?.invalid ? this.startRangeFormControl.setErrors(this.control.errors) : this.startRangeFormControl.setErrors(null);\n this.control?.invalid ? this.endRangeFormControl.setErrors(this.control.errors) : this.endRangeFormControl.setErrors(null);\n this.control?.invalid ? (this.isInvalid = true) : (this.isInvalid = false);\n }\n }\n\n ngAfterContentInit(): void {\n if (this.islongDateFormat) {\n this.styleClass += 'eui-date-range-selector--long-date-format';\n }\n if (this.isClearable) {\n this.styleClass += 'eui-date-range-selector--clearable';\n }\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes && changes['startDateDefaultValue']) {\n this.startRangeFormControl.setValue(this.startDateDefaultValue);\n }\n if (changes && changes['endDateDefaultValue']) {\n this.endRangeFormControl.setValue(this.endDateDefaultValue);\n }\n\n if (changes && changes['isDisabled']) {\n this.setDisabledState(this.isDisabled);\n }\n }\n\n ngOnDestroy(): void {\n this.destroy$.next(true);\n this.destroy$.unsubscribe();\n }\n\n public onFirstDateChange(e: MatDatepickerInputEvent<any>): void {\n this.selectedDates.startRange = e.value;\n this.firstSelectedDate.emit(e.value);\n this.propagateChange(this.selectedDates);\n this.propagateTouched();\n }\n\n public onSecondDateChange(e: MatDatepickerInputEvent<any>): void {\n this.selectedDates.endRange = e.value;\n this.secondSelectedDate.emit(e.value);\n this.propagateChange(this.selectedDates);\n this.propagateTouched();\n }\n\n onFirstDateClear(): void {\n this.selectedDates.startRange = null;\n this.firstSelectedDate.emit(null);\n this.propagateChange(this.selectedDates);\n }\n onSecondDateClear(): void {\n this.selectedDates.endRange = null;\n this.secondSelectedDate.emit(null);\n this.propagateChange(this.selectedDates);\n }\n\n writeValue(values: EuiDateRangeSelectorDates): void {\n if (values && values.startRange === undefined) {\n throw new Error('startRange of EuiDateRangeSelectorDates model must be defined');\n }\n if (values && values.endRange === undefined) {\n throw new Error('endRange of EuiDateRangeSelectorDates model must be defined');\n }\n\n this.startDateDefaultValue = values?.startRange;\n this.endDateDefaultValue = values?.endRange;\n this.startRangeFormControl.setValue(values?.startRange);\n this.endRangeFormControl.setValue(values?.endRange);\n this.selectedDates = values || { startRange:null, endRange: null };\n }\n\n public setDisabledState?(isDisabled: boolean): void {\n this.isDisabled = isDisabled;\n if (this.isDisabled) {\n this.startRangeFormControl.disable();\n this.endRangeFormControl.disable();\n } else {\n this.startRangeFormControl.enable();\n this.endRangeFormControl.enable();\n }\n }\n\n registerOnChange(fn: any): void {\n this.propagateChange = fn;\n }\n\n registerOnTouched(fn: any): void {\n this.propagateTouched = fn;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars\n private propagateChange = (_: any): void => {};\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n private propagateTouched = (): void => {};\n}\n","<div\n class=\"eui-date-range-selector {{ styleClass }}\"\n attr.data-e2e=\"{{ e2eAttr }}\"\n [class.eui-date-range-selector--responsive]=\"isResponsive\">\n <mat-date-range-input\n [class.mat-date-range-input--read-only]=\"isReadOnly\"\n [class.mat-date-range-input--disabled]=\"isDisabled\"\n [class.mat-date-range-input--invalid]=\"isInvalid && isTouched\"\n [rangePicker]=\"picker\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n [comparisonStart]=\"comparisonStart\"\n [comparisonEnd]=\"comparisonEnd\">\n <input\n class=\"eui-date-range-selector__start-date\"\n euiInputText\n [readonly]=\"isReadOnly\"\n matStartDate\n placeholder=\"{{ firstInputPlaceholder }}\"\n attr.aria-label=\"{{ firstInputAriaLabel }}\"\n [formControl]=\"startRangeFormControl\"\n (dateInput)=\"onFirstDateChange($event)\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onFirstDateClear()\" />\n <input\n class=\"eui-date-range-selector__end-date\"\n euiInputText\n [readonly]=\"isReadOnly\"\n matEndDate\n placeholder=\"{{ secondInputPlaceholder }}\"\n attr.aria-label=\"{{ secondInputAriaLabel }}\"\n [formControl]=\"endRangeFormControl\"\n (dateInput)=\"onSecondDateChange($event)\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onSecondDateClear()\" />\n </mat-date-range-input>\n <mat-date-range-picker #picker [startView]=\"startView\"> </mat-date-range-picker>\n <button\n *ngIf=\"!isReadOnly\"\n class=\"eui-date-range-selector__toggler eui-date-range-selector__toggler-{{ !togglerLabel ? 'icon' : 'label' }}\"\n (click)=\"picker.open()\"\n euiButton\n euiSecondary\n euiIconButton\n type=\"button\"\n [euiDisabled]=\"isDisabled\"\n aria-haspopup=\"dialog\">\n <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n </ng-container>\n <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n </button>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { TranslateModule } from '@ngx-translate/core';\nimport { MatDatepickerModule } from '@angular/material/datepicker';\nimport { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';\nimport { MatMomentDateModule, MomentDateAdapter } from '@angular/material-moment-adapter';\n\nimport { EuiDateRangeSelectorComponent } from './eui-date-range-selector.component';\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiInputTextModule } from '@eui/components/eui-input-text';\nimport { DEFAULT_FORMATS } from '@eui/components/eui-datepicker';\n\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n ReactiveFormsModule,\n TranslateModule,\n MatDatepickerModule,\n MatMomentDateModule,\n EuiButtonModule,\n EuiIconModule,\n EuiInputTextModule,\n ],\n exports: [EuiDateRangeSelectorComponent],\n declarations: [EuiDateRangeSelectorComponent],\n providers: [\n { provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },\n { provide: MAT_DATE_FORMATS, useValue: DEFAULT_FORMATS },\n ],\n})\nexport class EuiDateRangeSelectorModule {}\n","import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';\nimport { DateAdapter } from '@angular/material/core';\nimport moment from 'moment';\n\n/**\n * @description\n * Validator that checks that the start date isn't after the end date.\n *\n * @usageNotes\n * If the user types a value in the input field that is not aligned with the provided format the component propagates a null value that\n * can be used to validate the input field.\n *\n * @returns An error map with the\n * `euiDateRangeInvalid` if the validation check fails, otherwise `null`.\n */\n\nexport const euiStartEndDateValidator =\n // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (adapter: DateAdapter<any>): ValidatorFn =>\n (control: AbstractControl): ValidationErrors | null => {\n const start = moment(adapter.getValidDateOrNull(adapter.deserialize(control.value.startRange)));\n const end = moment(control.value?.endRange);\n return !start || !end || adapter.compareDate(start, end) <= 0 ? null : { euiDateRangeInvalid: { end, actual: start } };\n };\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"eui-components-eui-date-range-selector.mjs","sources":["../../eui-date-range-selector/eui-date-range-selector.component.ts","../../eui-date-range-selector/eui-date-range-selector.component.html","../../eui-date-range-selector/eui-date-range-selector.module.ts","../../eui-date-range-selector/eui-date-range-selector.validators.ts","../../eui-date-range-selector/eui-components-eui-date-range-selector.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {\n AfterContentInit,\n Component,\n DoCheck,\n EventEmitter,\n Input,\n OnChanges,\n OnDestroy,\n OnInit,\n Optional,\n Output,\n Self,\n SimpleChanges,\n ViewEncapsulation,\n booleanAttribute,\n} from '@angular/core';\nimport { ControlValueAccessor, FormControl, NgControl } from '@angular/forms';\nimport { MatDatepickerInputEvent } from '@angular/material/datepicker';\nimport { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\nimport { DateAdapter } from '@angular/material/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { LocaleService } from '@eui/core';\nimport { EuiDateRangeSelectorDates } from './models/eui-date-range-selector-dates.model';\n@Component({\n selector: 'eui-date-range-selector',\n templateUrl: './eui-date-range-selector.component.html',\n styleUrls: ['./styles/_index.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class EuiDateRangeSelectorComponent implements OnInit, AfterContentInit, OnDestroy, OnChanges, ControlValueAccessor, DoCheck {\n selectedDates: EuiDateRangeSelectorDates = { startRange:null, endRange: null };\n public isInvalid: boolean;\n public isTouched: boolean;\n public startRangeFormControl = new FormControl();\n public endRangeFormControl = new FormControl();\n\n @Output() firstSelectedDate = new EventEmitter<any>();\n @Output() secondSelectedDate = new EventEmitter<any>();\n\n @Input() styleClass = '';\n @Input() e2eAttr = 'eui-date-range-selector';\n @Input() minDate: any;\n @Input() maxDate: any;\n @Input() togglerIcon: string;\n @Input() togglerIconSvg = 'eui-calendar-outline';\n @Input() togglerLabel: string;\n @Input() firstInputPlaceholder: string;\n @Input() secondInputPlaceholder: string;\n @Input() firstInputAriaLabel: string;\n @Input() secondInputAriaLabel: string;\n @Input() startDateDefaultValue: any;\n @Input() endDateDefaultValue: any;\n @Input() comparisonStart: any;\n @Input() comparisonEnd: any;\n @Input() startView: 'month' | 'year' | 'multi-year' = 'month';\n @Input({ transform: booleanAttribute })islongDateFormat = false;\n @Input({ transform: booleanAttribute })isClearable = false;\n @Input({ transform: booleanAttribute })isReadOnly = false;\n @Input({ transform: booleanAttribute })isDisabled = false;\n @Input({ transform: booleanAttribute })isResponsive = false;\n\n private destroy$: Subject<boolean> = new Subject<boolean>();\n\n constructor(\n protected translateService: TranslateService,\n @Optional() protected localeService: LocaleService,\n protected adapter: DateAdapter<any>,\n @Self() @Optional() protected control: NgControl,\n ) {\n if (this.control) {\n this.control.valueAccessor = this;\n }\n }\n\n ngOnInit(): void {\n this.localeService\n .getState()\n .pipe(takeUntil(this.destroy$))\n .subscribe((state) => {\n this.adapter.setLocale(state.id);\n });\n\n this.startRangeFormControl = new FormControl({ value: this.startDateDefaultValue, disabled: this.isDisabled });\n this.endRangeFormControl = new FormControl({ value: this.endDateDefaultValue, disabled: this.isDisabled });\n\n if (!this.firstInputPlaceholder) {\n this.translateService\n .stream('eui.daterangeselector.FIRSTPICKERSLABEL')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.firstInputPlaceholder = result;\n });\n }\n // by setting the firstInputAriaLabel to dd/mm/yyyy(or the desired format) the format can be announced to the screen reader users before the users start typing\n if (!this.firstInputAriaLabel) {\n this.translateService\n .stream('eui.daterangeselector.FIRSTPICKERSPLACEHOLDER')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.firstInputAriaLabel = result;\n });\n }\n if (!this.secondInputPlaceholder) {\n this.translateService\n .stream('eui.daterangeselector.SECONDPICKERSLABEL')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.secondInputPlaceholder = result;\n });\n }\n // by setting the secondInputAriaLabel to dd/mm/yyyy(or the desired format) the format can be announced to the screen reader users before the users start typing\n if (!this.secondInputAriaLabel) {\n this.translateService\n .stream('eui.daterangeselector.SECONDPICKERSPLACEHOLDER')\n .pipe(takeUntil(this.destroy$))\n .subscribe((result: string) => {\n this.secondInputAriaLabel = result;\n });\n }\n }\n\n ngDoCheck(): void {\n if (this.control) {\n // marks the input controls as touched/invalid if the form control is touched/invalid\n this.control?.touched ? this.startRangeFormControl?.markAsTouched() : this.startRangeFormControl.markAsUntouched();\n this.control?.touched ? this.endRangeFormControl.markAsTouched() : this.endRangeFormControl?.markAsUntouched();\n this.control?.touched ? (this.isTouched = true) : (this.isTouched = false);\n this.control?.invalid ? this.startRangeFormControl.setErrors(this.control.errors) : this.startRangeFormControl.setErrors(null);\n this.control?.invalid ? this.endRangeFormControl.setErrors(this.control.errors) : this.endRangeFormControl.setErrors(null);\n this.control?.invalid ? (this.isInvalid = true) : (this.isInvalid = false);\n }\n }\n\n ngAfterContentInit(): void {\n if (this.islongDateFormat) {\n this.styleClass += 'eui-date-range-selector--long-date-format';\n }\n if (this.isClearable) {\n this.styleClass += 'eui-date-range-selector--clearable';\n }\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes && changes['startDateDefaultValue']) {\n this.startRangeFormControl.setValue(this.startDateDefaultValue);\n }\n if (changes && changes['endDateDefaultValue']) {\n this.endRangeFormControl.setValue(this.endDateDefaultValue);\n }\n\n if (changes && changes['isDisabled']) {\n this.setDisabledState(this.isDisabled);\n }\n }\n\n ngOnDestroy(): void {\n this.destroy$.next(true);\n this.destroy$.unsubscribe();\n }\n\n public onFirstDateChange(e: MatDatepickerInputEvent<any>): void {\n this.selectedDates.startRange = e.value;\n this.firstSelectedDate.emit(e.value);\n this.propagateChange(this.selectedDates);\n this.propagateTouched();\n }\n\n public onSecondDateChange(e: MatDatepickerInputEvent<any>): void {\n this.selectedDates.endRange = e.value;\n this.secondSelectedDate.emit(e.value);\n this.propagateChange(this.selectedDates);\n this.propagateTouched();\n }\n\n onFirstDateClear(): void {\n this.selectedDates.startRange = null;\n this.firstSelectedDate.emit(null);\n this.propagateChange(this.selectedDates);\n }\n onSecondDateClear(): void {\n this.selectedDates.endRange = null;\n this.secondSelectedDate.emit(null);\n this.propagateChange(this.selectedDates);\n }\n\n writeValue(values: EuiDateRangeSelectorDates): void {\n if (values && values.startRange === undefined) {\n throw new Error('startRange of EuiDateRangeSelectorDates model must be defined');\n }\n if (values && values.endRange === undefined) {\n throw new Error('endRange of EuiDateRangeSelectorDates model must be defined');\n }\n\n this.startDateDefaultValue = values?.startRange;\n this.endDateDefaultValue = values?.endRange;\n this.startRangeFormControl.setValue(values?.startRange);\n this.endRangeFormControl.setValue(values?.endRange);\n this.selectedDates = values || { startRange:null, endRange: null };\n }\n\n public setDisabledState?(isDisabled: boolean): void {\n this.isDisabled = isDisabled;\n if (this.isDisabled) {\n this.startRangeFormControl.disable();\n this.endRangeFormControl.disable();\n } else {\n this.startRangeFormControl.enable();\n this.endRangeFormControl.enable();\n }\n }\n\n registerOnChange(fn: any): void {\n this.propagateChange = fn;\n }\n\n registerOnTouched(fn: any): void {\n this.propagateTouched = fn;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars\n private propagateChange = (_: any): void => {};\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n private propagateTouched = (): void => {};\n}\n","<div\n class=\"eui-date-range-selector {{ styleClass }}\"\n attr.data-e2e=\"{{ e2eAttr }}\"\n [class.eui-date-range-selector--responsive]=\"isResponsive\">\n <mat-date-range-input\n [class.mat-date-range-input--read-only]=\"isReadOnly\"\n [class.mat-date-range-input--disabled]=\"isDisabled\"\n [class.mat-date-range-input--invalid]=\"isInvalid && isTouched\"\n [rangePicker]=\"picker\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n [comparisonStart]=\"comparisonStart\"\n [comparisonEnd]=\"comparisonEnd\">\n <input\n class=\"eui-date-range-selector__start-date\"\n euiInputText\n [readonly]=\"isReadOnly\"\n matStartDate\n placeholder=\"{{ firstInputPlaceholder }}\"\n attr.aria-label=\"{{ firstInputAriaLabel }}\"\n [formControl]=\"startRangeFormControl\"\n (dateInput)=\"onFirstDateChange($event)\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onFirstDateClear()\" />\n <input\n class=\"eui-date-range-selector__end-date\"\n euiInputText\n [readonly]=\"isReadOnly\"\n matEndDate\n placeholder=\"{{ secondInputPlaceholder }}\"\n attr.aria-label=\"{{ secondInputAriaLabel }}\"\n [formControl]=\"endRangeFormControl\"\n (dateInput)=\"onSecondDateChange($event)\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onSecondDateClear()\" />\n </mat-date-range-input>\n <mat-date-range-picker #picker [startView]=\"startView\"> </mat-date-range-picker>\n <button\n *ngIf=\"!isReadOnly\"\n class=\"eui-date-range-selector__toggler eui-date-range-selector__toggler-{{ !togglerLabel ? 'icon' : 'label' }}\"\n (click)=\"picker.open()\"\n euiButton\n euiSecondary\n euiIconButton\n type=\"button\"\n [euiDisabled]=\"isDisabled\"\n aria-haspopup=\"dialog\">\n <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n </ng-container>\n <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n </button>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { TranslateModule } from '@ngx-translate/core';\nimport { MatDatepickerModule } from '@angular/material/datepicker';\nimport { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';\nimport { MatMomentDateModule, MomentDateAdapter } from '@angular/material-moment-adapter';\n\nimport { EuiDateRangeSelectorComponent } from './eui-date-range-selector.component';\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiInputTextModule } from '@eui/components/eui-input-text';\nimport { DEFAULT_FORMATS } from '@eui/components/eui-datepicker';\n\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n ReactiveFormsModule,\n TranslateModule,\n MatDatepickerModule,\n MatMomentDateModule,\n EuiButtonModule,\n EuiIconModule,\n EuiInputTextModule,\n ],\n exports: [EuiDateRangeSelectorComponent],\n declarations: [EuiDateRangeSelectorComponent],\n providers: [\n { provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },\n { provide: MAT_DATE_FORMATS, useValue: DEFAULT_FORMATS },\n ],\n})\nexport class EuiDateRangeSelectorModule {}\n","import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';\nimport { DateAdapter } from '@angular/material/core';\nimport moment from 'moment';\n\n/**\n * @description\n * Validator that checks that the start date isn't after the end date.\n *\n * @usageNotes\n * If the user types a value in the input field that is not aligned with the provided format the component propagates a null value that\n * can be used to validate the input field.\n *\n * @returns An error map with the\n * `euiDateRangeInvalid` if the validation check fails, otherwise `null`.\n */\n\nexport const euiStartEndDateValidator =\n // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (adapter: DateAdapter<any>): ValidatorFn =>\n (control: AbstractControl): ValidationErrors | null => {\n const start = moment(adapter.getValidDateOrNull(adapter.deserialize(control.value.startRange)));\n const end = moment(control.value?.endRange);\n return !start || !end || adapter.compareDate(start, end) <= 0 ? null : { euiDateRangeInvalid: { end, actual: start } };\n };\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;MAiCa,6BAA6B,CAAA;AAkCtC,IAAA,WAAA,CACc,gBAAkC,EACtB,aAA4B,EACxC,OAAyB,EACL,OAAkB,EAAA;QAHtC,IAAgB,CAAA,gBAAA,GAAhB,gBAAgB,CAAkB;QACtB,IAAa,CAAA,aAAA,GAAb,aAAa,CAAe;QACxC,IAAO,CAAA,OAAA,GAAP,OAAO,CAAkB;QACL,IAAO,CAAA,OAAA,GAAP,OAAO,CAAW;QArCpD,IAAa,CAAA,aAAA,GAA8B,EAAE,UAAU,EAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AAGxE,QAAA,IAAA,CAAA,qBAAqB,GAAG,IAAI,WAAW,EAAE,CAAC;AAC1C,QAAA,IAAA,CAAA,mBAAmB,GAAG,IAAI,WAAW,EAAE,CAAC;AAErC,QAAA,IAAA,CAAA,iBAAiB,GAAG,IAAI,YAAY,EAAO,CAAC;AAC5C,QAAA,IAAA,CAAA,kBAAkB,GAAG,IAAI,YAAY,EAAO,CAAC;QAE9C,IAAU,CAAA,UAAA,GAAG,EAAE,CAAC;QAChB,IAAO,CAAA,OAAA,GAAG,yBAAyB,CAAC;QAIpC,IAAc,CAAA,cAAA,GAAG,sBAAsB,CAAC;QAUxC,IAAS,CAAA,SAAA,GAAoC,OAAO,CAAC;QACvB,IAAgB,CAAA,gBAAA,GAAG,KAAK,CAAC;QACzB,IAAW,CAAA,WAAA,GAAG,KAAK,CAAC;QACpB,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC;QACnB,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC;QACnB,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;AAEpD,QAAA,IAAA,CAAA,QAAQ,GAAqB,IAAI,OAAO,EAAW,CAAC;;AA+JpD,QAAA,IAAA,CAAA,eAAe,GAAG,CAAC,CAAM,KAAU,GAAG,CAAC;;AAGvC,QAAA,IAAA,CAAA,gBAAgB,GAAG,MAAW,GAAG,CAAC;QA1JtC,IAAI,IAAI,CAAC,OAAO,EAAE;AACd,YAAA,IAAI,CAAC,OAAO,CAAC,aAAa,GAAG,IAAI,CAAC;AACrC,SAAA;KACJ;IAED,QAAQ,GAAA;AACJ,QAAA,IAAI,CAAC,aAAa;AACb,aAAA,QAAQ,EAAE;AACV,aAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AAC9B,aAAA,SAAS,CAAC,CAAC,KAAK,KAAI;YACjB,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;AACrC,SAAC,CAAC,CAAC;QAEP,IAAI,CAAC,qBAAqB,GAAG,IAAI,WAAW,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,qBAAqB,EAAE,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;QAC/G,IAAI,CAAC,mBAAmB,GAAG,IAAI,WAAW,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,mBAAmB,EAAE,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;AAE3G,QAAA,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE;AAC7B,YAAA,IAAI,CAAC,gBAAgB;iBAChB,MAAM,CAAC,yCAAyC,CAAC;AACjD,iBAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AAC9B,iBAAA,SAAS,CAAC,CAAC,MAAc,KAAI;AAC1B,gBAAA,IAAI,CAAC,qBAAqB,GAAG,MAAM,CAAC;AACxC,aAAC,CAAC,CAAC;AACV,SAAA;;AAED,QAAA,IAAI,CAAC,IAAI,CAAC,mBAAmB,EAAE;AAC3B,YAAA,IAAI,CAAC,gBAAgB;iBAChB,MAAM,CAAC,+CAA+C,CAAC;AACvD,iBAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AAC9B,iBAAA,SAAS,CAAC,CAAC,MAAc,KAAI;AAC1B,gBAAA,IAAI,CAAC,mBAAmB,GAAG,MAAM,CAAC;AACtC,aAAC,CAAC,CAAC;AACV,SAAA;AACD,QAAA,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE;AAC9B,YAAA,IAAI,CAAC,gBAAgB;iBAChB,MAAM,CAAC,0CAA0C,CAAC;AAClD,iBAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AAC9B,iBAAA,SAAS,CAAC,CAAC,MAAc,KAAI;AAC1B,gBAAA,IAAI,CAAC,sBAAsB,GAAG,MAAM,CAAC;AACzC,aAAC,CAAC,CAAC;AACV,SAAA;;AAED,QAAA,IAAI,CAAC,IAAI,CAAC,oBAAoB,EAAE;AAC5B,YAAA,IAAI,CAAC,gBAAgB;iBAChB,MAAM,CAAC,gDAAgD,CAAC;AACxD,iBAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AAC9B,iBAAA,SAAS,CAAC,CAAC,MAAc,KAAI;AAC1B,gBAAA,IAAI,CAAC,oBAAoB,GAAG,MAAM,CAAC;AACvC,aAAC,CAAC,CAAC;AACV,SAAA;KACJ;IAED,SAAS,GAAA;QACL,IAAI,IAAI,CAAC,OAAO,EAAE;;YAEd,IAAI,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC,qBAAqB,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,qBAAqB,CAAC,eAAe,EAAE,CAAC;YACnH,IAAI,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,GAAG,IAAI,CAAC,mBAAmB,EAAE,eAAe,EAAE,CAAC;YAC/G,IAAI,CAAC,OAAO,EAAE,OAAO,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC;AAC3E,YAAA,IAAI,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;AAC/H,YAAA,IAAI,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC,mBAAmB,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,mBAAmB,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;YAC3H,IAAI,CAAC,OAAO,EAAE,OAAO,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC;AAC9E,SAAA;KACJ;IAED,kBAAkB,GAAA;QACd,IAAI,IAAI,CAAC,gBAAgB,EAAE;AACvB,YAAA,IAAI,CAAC,UAAU,IAAI,2CAA2C,CAAC;AAClE,SAAA;QACD,IAAI,IAAI,CAAC,WAAW,EAAE;AAClB,YAAA,IAAI,CAAC,UAAU,IAAI,oCAAoC,CAAC;AAC3D,SAAA;KACJ;AAED,IAAA,WAAW,CAAC,OAAsB,EAAA;AAC9B,QAAA,IAAI,OAAO,IAAI,OAAO,CAAC,uBAAuB,CAAC,EAAE;YAC7C,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;AACnE,SAAA;AACD,QAAA,IAAI,OAAO,IAAI,OAAO,CAAC,qBAAqB,CAAC,EAAE;YAC3C,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;AAC/D,SAAA;AAED,QAAA,IAAI,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,EAAE;AAClC,YAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;AAC1C,SAAA;KACJ;IAED,WAAW,GAAA;AACP,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AACzB,QAAA,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;KAC/B;AAEM,IAAA,iBAAiB,CAAC,CAA+B,EAAA;QACpD,IAAI,CAAC,aAAa,CAAC,UAAU,GAAG,CAAC,CAAC,KAAK,CAAC;QACxC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;AACrC,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QACzC,IAAI,CAAC,gBAAgB,EAAE,CAAC;KAC3B;AAEM,IAAA,kBAAkB,CAAC,CAA+B,EAAA;QACrD,IAAI,CAAC,aAAa,CAAC,QAAQ,GAAG,CAAC,CAAC,KAAK,CAAC;QACtC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;AACtC,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QACzC,IAAI,CAAC,gBAAgB,EAAE,CAAC;KAC3B;IAED,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,aAAa,CAAC,UAAU,GAAG,IAAI,CAAC;AACrC,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAClC,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KAC5C;IACD,iBAAiB,GAAA;AACb,QAAA,IAAI,CAAC,aAAa,CAAC,QAAQ,GAAG,IAAI,CAAC;AACnC,QAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AACnC,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KAC5C;AAED,IAAA,UAAU,CAAC,MAAiC,EAAA;AACxC,QAAA,IAAI,MAAM,IAAI,MAAM,CAAC,UAAU,KAAK,SAAS,EAAE;AAC3C,YAAA,MAAM,IAAI,KAAK,CAAC,+DAA+D,CAAC,CAAC;AACpF,SAAA;AACD,QAAA,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,KAAK,SAAS,EAAE;AACzC,YAAA,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC,CAAC;AAClF,SAAA;AAED,QAAA,IAAI,CAAC,qBAAqB,GAAG,MAAM,EAAE,UAAU,CAAC;AAChD,QAAA,IAAI,CAAC,mBAAmB,GAAG,MAAM,EAAE,QAAQ,CAAC;QAC5C,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QACxD,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AACpD,QAAA,IAAI,CAAC,aAAa,GAAG,MAAM,IAAI,EAAE,UAAU,EAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;KACtE;AAEM,IAAA,gBAAgB,CAAE,UAAmB,EAAA;AACxC,QAAA,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,IAAI,IAAI,CAAC,UAAU,EAAE;AACjB,YAAA,IAAI,CAAC,qBAAqB,CAAC,OAAO,EAAE,CAAC;AACrC,YAAA,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,CAAC;AACtC,SAAA;AAAM,aAAA;AACH,YAAA,IAAI,CAAC,qBAAqB,CAAC,MAAM,EAAE,CAAC;AACpC,YAAA,IAAI,CAAC,mBAAmB,CAAC,MAAM,EAAE,CAAC;AACrC,SAAA;KACJ;AAED,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACpB,QAAA,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;KAC7B;AAED,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACrB,QAAA,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;KAC9B;iIA5LQ,6BAA6B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;qHAA7B,6BAA6B,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,aAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,qBAAA,EAAA,uBAAA,EAAA,sBAAA,EAAA,wBAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,qBAAA,EAAA,uBAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,eAAA,EAAA,SAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,CAAA,kBAAA,EAAA,kBAAA,EA0BlB,gBAAgB,CAAA,EAAA,WAAA,EAAA,CAAA,aAAA,EAAA,aAAA,EAChB,gBAAgB,CAAA,EAAA,UAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAChB,gBAAgB,CAAA,EAAA,UAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAChB,gBAAgB,CAAA,EAAA,YAAA,EAAA,CAAA,cAAA,EAAA,cAAA,EAChB,gBAAgB,CAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC/DxC,03EAsDA,EAAA,MAAA,EAAA,CAAA,4+FAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,8MAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,KAAA,EAAA,UAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,QAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,iCAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,eAAA,EAAA,aAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,mDAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,WAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,+CAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,WAAA,EAAA,KAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,YAAA,EAAA,YAAA,EAAA,WAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,qBAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,WAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FDrBa,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBANzC,SAAS;+BACI,yBAAyB,EAAA,aAAA,EAGpB,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,03EAAA,EAAA,MAAA,EAAA,CAAA,4+FAAA,CAAA,EAAA,CAAA;;0BAsChC,QAAQ;;0BAER,IAAI;;0BAAI,QAAQ;yCA/BX,iBAAiB,EAAA,CAAA;sBAA1B,MAAM;gBACG,kBAAkB,EAAA,CAAA;sBAA3B,MAAM;gBAEE,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBACG,cAAc,EAAA,CAAA;sBAAtB,KAAK;gBACG,YAAY,EAAA,CAAA;sBAApB,KAAK;gBACG,qBAAqB,EAAA,CAAA;sBAA7B,KAAK;gBACG,sBAAsB,EAAA,CAAA;sBAA9B,KAAK;gBACG,mBAAmB,EAAA,CAAA;sBAA3B,KAAK;gBACG,oBAAoB,EAAA,CAAA;sBAA5B,KAAK;gBACG,qBAAqB,EAAA,CAAA;sBAA7B,KAAK;gBACG,mBAAmB,EAAA,CAAA;sBAA3B,KAAK;gBACG,eAAe,EAAA,CAAA;sBAAvB,KAAK;gBACG,aAAa,EAAA,CAAA;sBAArB,KAAK;gBACG,SAAS,EAAA,CAAA;sBAAjB,KAAK;gBACiC,gBAAgB,EAAA,CAAA;sBAAtD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBACC,WAAW,EAAA,CAAA;sBAAjD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBACC,UAAU,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBACC,UAAU,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBACC,YAAY,EAAA,CAAA;sBAAlD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;;;ME9B7B,0BAA0B,CAAA;iIAA1B,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;kIAA1B,0BAA0B,EAAA,YAAA,EAAA,CANpB,6BAA6B,CAAA,EAAA,OAAA,EAAA,CAXxC,YAAY;YACZ,WAAW;YACX,mBAAmB;YACnB,eAAe;YACf,mBAAmB;YACnB,mBAAmB;YACnB,eAAe;YACf,aAAa;AACb,YAAA,kBAAkB,aAEZ,6BAA6B,CAAA,EAAA,CAAA,CAAA,EAAA;AAO9B,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,0BAA0B,EALxB,SAAA,EAAA;AACP,YAAA,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,iBAAiB,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,EAAE;AAC9E,YAAA,EAAE,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,eAAe,EAAE;AAC3D,SAAA,EAAA,OAAA,EAAA,CAfG,YAAY;YACZ,WAAW;YACX,mBAAmB;YACnB,eAAe;YACf,mBAAmB;YACnB,mBAAmB;YACnB,eAAe;YACf,aAAa;YACb,kBAAkB,CAAA,EAAA,CAAA,CAAA,EAAA;;2FASb,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAnBtC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE;wBACL,YAAY;wBACZ,WAAW;wBACX,mBAAmB;wBACnB,eAAe;wBACf,mBAAmB;wBACnB,mBAAmB;wBACnB,eAAe;wBACf,aAAa;wBACb,kBAAkB;AACrB,qBAAA;oBACD,OAAO,EAAE,CAAC,6BAA6B,CAAC;oBACxC,YAAY,EAAE,CAAC,6BAA6B,CAAC;AAC7C,oBAAA,SAAS,EAAE;AACP,wBAAA,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,iBAAiB,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,EAAE;AAC9E,wBAAA,EAAE,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,eAAe,EAAE;AAC3D,qBAAA;AACJ,iBAAA,CAAA;;;AC5BD;;;;;;;;;;AAUG;MAEU,wBAAwB;AACjC;AACA;AACA,CAAC,OAAyB,KAC1B,CAAC,OAAwB,KAA6B;IAClD,MAAM,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,kBAAkB,CAAC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IAChG,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;AAC5C,IAAA,OAAO,CAAC,KAAK,IAAI,CAAC,GAAG,IAAI,OAAO,CAAC,WAAW,CAAC,KAAK,EAAE,GAAG,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,EAAE,mBAAmB,EAAE,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;AAC3H;;ACxBJ;;AAEG;;;;"}
|
|
@@ -515,11 +515,11 @@ class EuiTabsComponent {
|
|
|
515
515
|
this.cd.detectChanges();
|
|
516
516
|
}
|
|
517
517
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiTabsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.Router }, { token: i2.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
518
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EuiTabsComponent, selector: "eui-tabs", inputs: { styleClass: "styleClass", tabs: "tabs", activeTabIndex: "activeTabIndex", e2eAttr: "e2eAttr", pathMatch: "pathMatch", isMainNavigation: "isMainNavigation", isHandleChangeTab: "isHandleChangeTab", isSubTabs: "isSubTabs", isVerticalTabs: "isVerticalTabs" }, outputs: { tabClose: "tabClose", tabSelect: "tabSelect" }, host: { listeners: { "window:resize": "onResize($event)" } }, queries: [{ propertyName: "_tabs", predicate: i0.forwardRef(() => EuiTabComponent) }], viewQueries: [{ propertyName: "euiTabsItems", first: true, predicate: ["euiTabsItems"], descendants: true }, { propertyName: "euiTabsItemsWrapper", first: true, predicate: ["euiTabsItemsWrapper"], descendants: true }, { propertyName: "host", first: true, predicate: ["host"], descendants: true }, { propertyName: "euiTabLabelItems", predicate: ["euiTabLabelItem"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<div\n #host\n class=\"eui-tabs {{ styleClass }}\"\n [class.eui-tabs--main-navigation]=\"isMainNavigation\"\n [class.eui-tabs--vertical]=\"isVerticalTabs\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div class=\"eui-u-flex\" [class.eui-tabs__wrapper--horizontal]=\"!isVerticalTabs\" [class.eui-tabs__wrapper--vertical]=\"isVerticalTabs\">\n <div\n #euiTabsItems\n class=\"eui-tabs__items\"\n [class.eui-tabs__items--horizontal]=\"!isVerticalTabs\"\n [class.eui-tabs__items--scrolling]=\"scrolling\"\n (cdkObserveContent)=\"onContentChanges()\">\n <div #euiTabsItemsWrapper class=\"eui-tabs__items-wrapper\" [attr.data-offset]=\"currentOffset\" role=\"tablist\">\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <ng-container *ngIf=\"tab.isVisible\">\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item\"\n [class.eui-tab-item--closable]=\"tab.isClosable\"\n [class.eui-tab-item--active]=\"activeTabIndex === i\"\n [class.eui-tab-item--disabled]=\"tab.isDisabled\"\n [class.eui-tab-item--secondary]=\"tab.euiSecondary\"\n [class.eui-tab-item--primary]=\"tab.euiPrimary\"\n [class.eui-tab-item--info]=\"tab.euiInfo\"\n [class.eui-tab-item--success]=\"tab.euiSuccess\"\n [class.eui-tab-item--warning]=\"tab.euiWarning\"\n [class.eui-tab-item--danger]=\"tab.euiDanger\"\n [class.eui-tab-item--accent]=\"tab.euiAccent\"\n [class.eui-tab-item--background-filled]=\"tab.hasBackgroundFilled\"\n [attr.aria-disabled]=\"tab.isDisabled\"\n (click)=\"changeTab(i)\"\n [euiTooltip]=\"tab.tooltip\"\n (keyup)=\"onKeyUp($event, i)\">\n <div class=\"eui-tab-item__label\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel.templatePortal\"></ng-template>\n </div>\n <button\n *ngIf=\"tab.isClosable\"\n (click)=\"closeTab(i, $event)\"\n euiButton\n euiIconButton\n euiBasicButton\n euiRounded\n euiSizeXS\n type=\"button\"\n [euiDisabled]=\"navigationRightButtonDisabled\"\n aria-label=\"Close tab button\"\n class=\"eui-u-ml-s\">\n <eui-icon-svg\n icon=\"eui-ecl-close\"\n size=\"l\"\n fillColor=\"grey-75\"\n class=\"eui-tab__close-icon\"\n aria-label=\"Close icon\">\n </eui-icon-svg>\n </button>\n </div>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"eui-tabs__navigation\">\n <div class=\"eui-tabs__navigation__left-item\">\n <button\n (click)=\"goToLeft()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationLeftButtonDisabled\"\n aria-label=\"Scroll left\">\n <eui-icon-svg icon=\"eui-chevron-back\"></eui-icon-svg>\n </button>\n </div>\n <div class=\"eui-tabs__navigation__right-item\">\n <button\n (click)=\"goToRight()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationRightButtonDisabled\"\n aria-label=\"Scroll right\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n </div>\n\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\" *ngIf=\"i === activeTabIndex && tab.templateContent\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n </ng-container>\n</div>\n", styles: [".eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-base-color-grey-5);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-base-color-grey-5);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:var(--eui-base-spacing-3xl);padding-right:var(--eui-base-spacing-m)}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-base-spacing-s)}.eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:none;border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-base-color-white);color:var(--eui-base-color-grey-90);cursor:pointer;display:flex;padding:var(--eui-base-spacing-m) var(--eui-base-spacing-m) var(--eui-base-spacing-s) var(--eui-base-spacing-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-tabs .eui-tab-item__label{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-tabs .eui-tab-item:focus{border-bottom:3px solid var(--eui-base-color-accent-100);background:var(--eui-base-color-grey-10)}.eui-tabs .eui-tab-item:focus:active:not([readonly]),.eui-tabs .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-10);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--active{background-color:var(--eui-base-color-primary-5);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--hidden{display:none}.eui-tabs .eui-tab-item .eui-tab__close-icon{cursor:pointer;color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);opacity:.7}.eui-tabs .eui-tab-item .eui-tab__close-icon:hover>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100);opacity:1}.eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-base-color-grey-50);cursor:not-allowed;pointer-events:none}.eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-base-color-grey-75)}.eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-base-color-grey-15)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s) 0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-tabs.eui-tabs--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item{border-bottom-color:transparent;border-left:3px solid transparent;box-shadow:0 0 1px #000000a6,inset 0 1px 0 var(--eui-base-color-white)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-base-color-primary-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-5);border-left:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-grey-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus{border-left:3px solid transparent}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s);position:relative}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs--main-navigation .eui-tabs__items,.eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-tabs--main-navigation .eui-tab-item--active,.eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-base-color-primary-5)}.eui-tabs .eui-tab-item:hover,.eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary{color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--secondary{color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-base-color-grey-80)}.eui-tabs .eui-tab-item--info{color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--success{color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--warning{color:var(--eui-base-color-warning-140)}.eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-base-color-warning-100)}.eui-tabs .eui-tab-item--danger{color:var(--eui-base-color-danger-110)}.eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-base-color-danger-100)}.eui-tabs .eui-tab-item--accent{color:var(--eui-base-color-grey-100)}.eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-base-color-accent-110)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled{background:none}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary{background-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary{background-color:var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info{background-color:var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success{background-color:var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning{background-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger{background-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent{background-color:var(--eui-base-color-accent-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i5.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i6.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "directive", type: i7.EuiTooltipDirective, selector: "[euiTooltip]", inputs: ["e2eAttr", "showDelay", "hideDelay", "contentAlignment", "position", "isDisabled", "euiTooltip", "euiTooltipPrimary", "euiTooltipSecondary", "euiTooltipInfo", "euiTooltipSuccess", "euiTooltipWarning", "euiTooltipDanger", "euiTooltipAccent"], exportAs: ["euiTooltip"] }, { kind: "directive", type: i8.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
518
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EuiTabsComponent, selector: "eui-tabs", inputs: { styleClass: "styleClass", tabs: "tabs", activeTabIndex: "activeTabIndex", e2eAttr: "e2eAttr", pathMatch: "pathMatch", isMainNavigation: "isMainNavigation", isHandleChangeTab: "isHandleChangeTab", isSubTabs: "isSubTabs", isVerticalTabs: "isVerticalTabs" }, outputs: { tabClose: "tabClose", tabSelect: "tabSelect" }, host: { listeners: { "window:resize": "onResize($event)" } }, queries: [{ propertyName: "_tabs", predicate: i0.forwardRef(() => EuiTabComponent) }], viewQueries: [{ propertyName: "euiTabsItems", first: true, predicate: ["euiTabsItems"], descendants: true }, { propertyName: "euiTabsItemsWrapper", first: true, predicate: ["euiTabsItemsWrapper"], descendants: true }, { propertyName: "host", first: true, predicate: ["host"], descendants: true }, { propertyName: "euiTabLabelItems", predicate: ["euiTabLabelItem"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<div\n #host\n class=\"eui-tabs {{ styleClass }}\"\n [class.eui-tabs--main-navigation]=\"isMainNavigation\"\n [class.eui-tabs--vertical]=\"isVerticalTabs\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div class=\"eui-u-flex\" [class.eui-tabs__wrapper--horizontal]=\"!isVerticalTabs\" [class.eui-tabs__wrapper--vertical]=\"isVerticalTabs\">\n <div\n #euiTabsItems\n class=\"eui-tabs__items\"\n [class.eui-tabs__items--horizontal]=\"!isVerticalTabs\"\n [class.eui-tabs__items--scrolling]=\"scrolling\"\n (cdkObserveContent)=\"onContentChanges()\">\n <div #euiTabsItemsWrapper class=\"eui-tabs__items-wrapper\" [attr.data-offset]=\"currentOffset\" role=\"tablist\">\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <ng-container *ngIf=\"tab.isVisible\">\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item\"\n [class.eui-tab-item--closable]=\"tab.isClosable\"\n [class.eui-tab-item--active]=\"activeTabIndex === i\"\n [class.eui-tab-item--disabled]=\"tab.isDisabled\"\n [class.eui-tab-item--secondary]=\"tab.euiSecondary\"\n [class.eui-tab-item--primary]=\"tab.euiPrimary\"\n [class.eui-tab-item--info]=\"tab.euiInfo\"\n [class.eui-tab-item--success]=\"tab.euiSuccess\"\n [class.eui-tab-item--warning]=\"tab.euiWarning\"\n [class.eui-tab-item--danger]=\"tab.euiDanger\"\n [class.eui-tab-item--accent]=\"tab.euiAccent\"\n [class.eui-tab-item--background-filled]=\"tab.hasBackgroundFilled\"\n [attr.aria-disabled]=\"tab.isDisabled\"\n (click)=\"changeTab(i)\"\n [euiTooltip]=\"tab.tooltip\"\n (keyup)=\"onKeyUp($event, i)\">\n <div class=\"eui-tab-item__label\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel.templatePortal\"></ng-template>\n </div>\n <button\n *ngIf=\"tab.isClosable\"\n (click)=\"closeTab(i, $event)\"\n euiButton\n euiIconButton\n euiBasicButton\n euiRounded\n euiSizeXS\n type=\"button\"\n aria-label=\"Close tab button\"\n class=\"eui-u-ml-s\">\n <eui-icon-svg\n icon=\"eui-ecl-close\"\n size=\"l\"\n fillColor=\"grey-75\"\n class=\"eui-tab__close-icon\"\n aria-label=\"Close icon\">\n </eui-icon-svg>\n </button>\n </div>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"eui-tabs__navigation\">\n <div class=\"eui-tabs__navigation__left-item\">\n <button\n (click)=\"goToLeft()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationLeftButtonDisabled\"\n aria-label=\"Scroll left\">\n <eui-icon-svg icon=\"eui-chevron-back\"></eui-icon-svg>\n </button>\n </div>\n <div class=\"eui-tabs__navigation__right-item\">\n <button\n (click)=\"goToRight()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationRightButtonDisabled\"\n aria-label=\"Scroll right\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n </div>\n\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\" *ngIf=\"i === activeTabIndex && tab.templateContent\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n </ng-container>\n</div>\n", styles: [".eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-base-color-grey-5);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-base-color-grey-5);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:var(--eui-base-spacing-3xl);padding-right:var(--eui-base-spacing-m)}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-base-spacing-s)}.eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:none;border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-base-color-white);color:var(--eui-base-color-grey-90);cursor:pointer;display:flex;padding:var(--eui-base-spacing-m) var(--eui-base-spacing-m) var(--eui-base-spacing-s) var(--eui-base-spacing-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-tabs .eui-tab-item__label{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-tabs .eui-tab-item:focus{border-bottom:3px solid var(--eui-base-color-accent-100);background:var(--eui-base-color-grey-10)}.eui-tabs .eui-tab-item:focus:active:not([readonly]),.eui-tabs .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-10);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--active{background-color:var(--eui-base-color-primary-5);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--hidden{display:none}.eui-tabs .eui-tab-item .eui-tab__close-icon{cursor:pointer;color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);opacity:.7}.eui-tabs .eui-tab-item .eui-tab__close-icon:hover>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100);opacity:1}.eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-base-color-grey-50);cursor:not-allowed;pointer-events:none}.eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-base-color-grey-75)}.eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-base-color-grey-15)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s) 0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-tabs.eui-tabs--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item{border-bottom-color:transparent;border-left:3px solid transparent;box-shadow:0 0 1px #000000a6,inset 0 1px 0 var(--eui-base-color-white)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-base-color-primary-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-5);border-left:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-grey-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus{border-left:3px solid transparent}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s);position:relative}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs--main-navigation .eui-tabs__items,.eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-tabs--main-navigation .eui-tab-item--active,.eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-base-color-primary-5)}.eui-tabs .eui-tab-item:hover,.eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary{color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--secondary{color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-base-color-grey-80)}.eui-tabs .eui-tab-item--info{color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--success{color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--warning{color:var(--eui-base-color-warning-140)}.eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-base-color-warning-100)}.eui-tabs .eui-tab-item--danger{color:var(--eui-base-color-danger-110)}.eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-base-color-danger-100)}.eui-tabs .eui-tab-item--accent{color:var(--eui-base-color-grey-100)}.eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-base-color-accent-110)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled{background:none}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary{background-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary{background-color:var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info{background-color:var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success{background-color:var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning{background-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger{background-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent{background-color:var(--eui-base-color-accent-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i5.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i6.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "directive", type: i7.EuiTooltipDirective, selector: "[euiTooltip]", inputs: ["e2eAttr", "showDelay", "hideDelay", "contentAlignment", "position", "isDisabled", "euiTooltip", "euiTooltipPrimary", "euiTooltipSecondary", "euiTooltipInfo", "euiTooltipSuccess", "euiTooltipWarning", "euiTooltipDanger", "euiTooltipAccent"], exportAs: ["euiTooltip"] }, { kind: "directive", type: i8.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
519
519
|
}
|
|
520
520
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiTabsComponent, decorators: [{
|
|
521
521
|
type: Component,
|
|
522
|
-
args: [{ selector: 'eui-tabs', encapsulation: ViewEncapsulation.None, template: "<div\n #host\n class=\"eui-tabs {{ styleClass }}\"\n [class.eui-tabs--main-navigation]=\"isMainNavigation\"\n [class.eui-tabs--vertical]=\"isVerticalTabs\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div class=\"eui-u-flex\" [class.eui-tabs__wrapper--horizontal]=\"!isVerticalTabs\" [class.eui-tabs__wrapper--vertical]=\"isVerticalTabs\">\n <div\n #euiTabsItems\n class=\"eui-tabs__items\"\n [class.eui-tabs__items--horizontal]=\"!isVerticalTabs\"\n [class.eui-tabs__items--scrolling]=\"scrolling\"\n (cdkObserveContent)=\"onContentChanges()\">\n <div #euiTabsItemsWrapper class=\"eui-tabs__items-wrapper\" [attr.data-offset]=\"currentOffset\" role=\"tablist\">\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <ng-container *ngIf=\"tab.isVisible\">\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item\"\n [class.eui-tab-item--closable]=\"tab.isClosable\"\n [class.eui-tab-item--active]=\"activeTabIndex === i\"\n [class.eui-tab-item--disabled]=\"tab.isDisabled\"\n [class.eui-tab-item--secondary]=\"tab.euiSecondary\"\n [class.eui-tab-item--primary]=\"tab.euiPrimary\"\n [class.eui-tab-item--info]=\"tab.euiInfo\"\n [class.eui-tab-item--success]=\"tab.euiSuccess\"\n [class.eui-tab-item--warning]=\"tab.euiWarning\"\n [class.eui-tab-item--danger]=\"tab.euiDanger\"\n [class.eui-tab-item--accent]=\"tab.euiAccent\"\n [class.eui-tab-item--background-filled]=\"tab.hasBackgroundFilled\"\n [attr.aria-disabled]=\"tab.isDisabled\"\n (click)=\"changeTab(i)\"\n [euiTooltip]=\"tab.tooltip\"\n (keyup)=\"onKeyUp($event, i)\">\n <div class=\"eui-tab-item__label\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel.templatePortal\"></ng-template>\n </div>\n <button\n *ngIf=\"tab.isClosable\"\n (click)=\"closeTab(i, $event)\"\n euiButton\n euiIconButton\n euiBasicButton\n euiRounded\n euiSizeXS\n type=\"button\"\n [euiDisabled]=\"navigationRightButtonDisabled\"\n aria-label=\"Close tab button\"\n class=\"eui-u-ml-s\">\n <eui-icon-svg\n icon=\"eui-ecl-close\"\n size=\"l\"\n fillColor=\"grey-75\"\n class=\"eui-tab__close-icon\"\n aria-label=\"Close icon\">\n </eui-icon-svg>\n </button>\n </div>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"eui-tabs__navigation\">\n <div class=\"eui-tabs__navigation__left-item\">\n <button\n (click)=\"goToLeft()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationLeftButtonDisabled\"\n aria-label=\"Scroll left\">\n <eui-icon-svg icon=\"eui-chevron-back\"></eui-icon-svg>\n </button>\n </div>\n <div class=\"eui-tabs__navigation__right-item\">\n <button\n (click)=\"goToRight()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationRightButtonDisabled\"\n aria-label=\"Scroll right\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n </div>\n\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\" *ngIf=\"i === activeTabIndex && tab.templateContent\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n </ng-container>\n</div>\n", styles: [".eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-base-color-grey-5);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-base-color-grey-5);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:var(--eui-base-spacing-3xl);padding-right:var(--eui-base-spacing-m)}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-base-spacing-s)}.eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:none;border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-base-color-white);color:var(--eui-base-color-grey-90);cursor:pointer;display:flex;padding:var(--eui-base-spacing-m) var(--eui-base-spacing-m) var(--eui-base-spacing-s) var(--eui-base-spacing-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-tabs .eui-tab-item__label{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-tabs .eui-tab-item:focus{border-bottom:3px solid var(--eui-base-color-accent-100);background:var(--eui-base-color-grey-10)}.eui-tabs .eui-tab-item:focus:active:not([readonly]),.eui-tabs .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-10);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--active{background-color:var(--eui-base-color-primary-5);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--hidden{display:none}.eui-tabs .eui-tab-item .eui-tab__close-icon{cursor:pointer;color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);opacity:.7}.eui-tabs .eui-tab-item .eui-tab__close-icon:hover>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100);opacity:1}.eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-base-color-grey-50);cursor:not-allowed;pointer-events:none}.eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-base-color-grey-75)}.eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-base-color-grey-15)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s) 0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-tabs.eui-tabs--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item{border-bottom-color:transparent;border-left:3px solid transparent;box-shadow:0 0 1px #000000a6,inset 0 1px 0 var(--eui-base-color-white)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-base-color-primary-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-5);border-left:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-grey-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus{border-left:3px solid transparent}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s);position:relative}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs--main-navigation .eui-tabs__items,.eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-tabs--main-navigation .eui-tab-item--active,.eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-base-color-primary-5)}.eui-tabs .eui-tab-item:hover,.eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary{color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--secondary{color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-base-color-grey-80)}.eui-tabs .eui-tab-item--info{color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--success{color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--warning{color:var(--eui-base-color-warning-140)}.eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-base-color-warning-100)}.eui-tabs .eui-tab-item--danger{color:var(--eui-base-color-danger-110)}.eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-base-color-danger-100)}.eui-tabs .eui-tab-item--accent{color:var(--eui-base-color-grey-100)}.eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-base-color-accent-110)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled{background:none}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary{background-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary{background-color:var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info{background-color:var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success{background-color:var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning{background-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger{background-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent{background-color:var(--eui-base-color-accent-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}\n"] }]
|
|
522
|
+
args: [{ selector: 'eui-tabs', encapsulation: ViewEncapsulation.None, template: "<div\n #host\n class=\"eui-tabs {{ styleClass }}\"\n [class.eui-tabs--main-navigation]=\"isMainNavigation\"\n [class.eui-tabs--vertical]=\"isVerticalTabs\"\n attr.data-e2e=\"{{ e2eAttr }}\">\n <div class=\"eui-u-flex\" [class.eui-tabs__wrapper--horizontal]=\"!isVerticalTabs\" [class.eui-tabs__wrapper--vertical]=\"isVerticalTabs\">\n <div\n #euiTabsItems\n class=\"eui-tabs__items\"\n [class.eui-tabs__items--horizontal]=\"!isVerticalTabs\"\n [class.eui-tabs__items--scrolling]=\"scrolling\"\n (cdkObserveContent)=\"onContentChanges()\">\n <div #euiTabsItemsWrapper class=\"eui-tabs__items-wrapper\" [attr.data-offset]=\"currentOffset\" role=\"tablist\">\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <ng-container *ngIf=\"tab.isVisible\">\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item\"\n [class.eui-tab-item--closable]=\"tab.isClosable\"\n [class.eui-tab-item--active]=\"activeTabIndex === i\"\n [class.eui-tab-item--disabled]=\"tab.isDisabled\"\n [class.eui-tab-item--secondary]=\"tab.euiSecondary\"\n [class.eui-tab-item--primary]=\"tab.euiPrimary\"\n [class.eui-tab-item--info]=\"tab.euiInfo\"\n [class.eui-tab-item--success]=\"tab.euiSuccess\"\n [class.eui-tab-item--warning]=\"tab.euiWarning\"\n [class.eui-tab-item--danger]=\"tab.euiDanger\"\n [class.eui-tab-item--accent]=\"tab.euiAccent\"\n [class.eui-tab-item--background-filled]=\"tab.hasBackgroundFilled\"\n [attr.aria-disabled]=\"tab.isDisabled\"\n (click)=\"changeTab(i)\"\n [euiTooltip]=\"tab.tooltip\"\n (keyup)=\"onKeyUp($event, i)\">\n <div class=\"eui-tab-item__label\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel.templatePortal\"></ng-template>\n </div>\n <button\n *ngIf=\"tab.isClosable\"\n (click)=\"closeTab(i, $event)\"\n euiButton\n euiIconButton\n euiBasicButton\n euiRounded\n euiSizeXS\n type=\"button\"\n aria-label=\"Close tab button\"\n class=\"eui-u-ml-s\">\n <eui-icon-svg\n icon=\"eui-ecl-close\"\n size=\"l\"\n fillColor=\"grey-75\"\n class=\"eui-tab__close-icon\"\n aria-label=\"Close icon\">\n </eui-icon-svg>\n </button>\n </div>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"eui-tabs__navigation\">\n <div class=\"eui-tabs__navigation__left-item\">\n <button\n (click)=\"goToLeft()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationLeftButtonDisabled\"\n aria-label=\"Scroll left\">\n <eui-icon-svg icon=\"eui-chevron-back\"></eui-icon-svg>\n </button>\n </div>\n <div class=\"eui-tabs__navigation__right-item\">\n <button\n (click)=\"goToRight()\"\n euiButton\n euiIconButton\n euiBasicButton\n type=\"button\"\n [euiDisabled]=\"navigationRightButtonDisabled\"\n aria-label=\"Scroll right\">\n <eui-icon-svg icon=\"eui-chevron-forward\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n </div>\n\n <ng-container *ngFor=\"let tab of tabs; let i = index\">\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\" *ngIf=\"i === activeTabIndex && tab.templateContent\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n </ng-container>\n</div>\n", styles: [".eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-base-color-grey-5);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-base-color-grey-5);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:var(--eui-base-spacing-3xl);padding-right:var(--eui-base-spacing-m)}.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-base-spacing-s)}.eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:none;border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-base-color-white);color:var(--eui-base-color-grey-90);cursor:pointer;display:flex;padding:var(--eui-base-spacing-m) var(--eui-base-spacing-m) var(--eui-base-spacing-s) var(--eui-base-spacing-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-tabs .eui-tab-item__label{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-tabs .eui-tab-item:focus{border-bottom:3px solid var(--eui-base-color-accent-100);background:var(--eui-base-color-grey-10)}.eui-tabs .eui-tab-item:focus:active:not([readonly]),.eui-tabs .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-10);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--active{background-color:var(--eui-base-color-primary-5);border-bottom:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--hidden{display:none}.eui-tabs .eui-tab-item .eui-tab__close-icon{cursor:pointer;color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);opacity:.7}.eui-tabs .eui-tab-item .eui-tab__close-icon:hover>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100);opacity:1}.eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-base-color-grey-50);cursor:not-allowed;pointer-events:none}.eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-base-color-grey-75)}.eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-base-color-grey-15)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s) 0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-tabs.eui-tabs--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item{border-bottom-color:transparent;border-left:3px solid transparent;box-shadow:0 0 1px #000000a6,inset 0 1px 0 var(--eui-base-color-white)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-base-color-primary-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-base-color-grey-5);border-left:3px solid var(--eui-base-color-primary-100);color:var(--eui-base-color-grey-100)}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus{border-left:3px solid transparent}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:active:not([readonly]),.eui-tabs.eui-tabs--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-base-spacing-s);position:relative}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-tabs--main-navigation .eui-tabs__items,.eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-tabs--main-navigation .eui-tab-item--active,.eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-base-color-primary-5)}.eui-tabs .eui-tab-item:hover,.eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary{color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item--secondary{color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-base-color-grey-80)}.eui-tabs .eui-tab-item--info{color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-base-color-info-100)}.eui-tabs .eui-tab-item--success{color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-base-color-success-100)}.eui-tabs .eui-tab-item--warning{color:var(--eui-base-color-warning-140)}.eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-base-color-warning-100)}.eui-tabs .eui-tab-item--danger{color:var(--eui-base-color-danger-110)}.eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-base-color-danger-100)}.eui-tabs .eui-tab-item--accent{color:var(--eui-base-color-grey-100)}.eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-base-color-accent-110)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled{background:none}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary{background-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--primary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary{background-color:var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-90)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--secondary.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info{background-color:var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--info.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success{background-color:var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--success.eui-tab-item--active{border-bottom-color:var(--eui-base-color-accent-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning{background-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--warning.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger{background-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--danger.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent{background-color:var(--eui-base-color-accent-100);color:var(--eui-base-color-black)}.eui-tabs .eui-tab-item.eui-tab-item--background-filled.eui-tab-item--accent.eui-tab-item--active{border-bottom-color:var(--eui-base-color-primary-100)}\n"] }]
|
|
523
523
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.Router }, { type: i2.AnimationBuilder }], propDecorators: { styleClass: [{
|
|
524
524
|
type: Input
|
|
525
525
|
}], tabs: [{
|