@eui/components 18.2.12 → 18.2.13-snapshot-1747380207562
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/EuiEditorComponent.html +1 -1
- package/docs/components/EuiNotificationsComponent.html +1 -82
- package/docs/components/EuiNotificationsV2Component.html +1 -1
- package/docs/dependencies.html +2 -2
- package/docs/js/menu-wc.js +9 -9
- package/docs/js/menu-wc_es5.js +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/esm2022/eui-list/eui-list-item/eui-list-item.component.mjs +2 -2
- package/esm2022/eui-list/eui-list.component.mjs +2 -2
- package/esm2022/eui-tabs/eui-tab/eui-tab.component.mjs +2 -2
- package/esm2022/eui-tabs/eui-tabs.component.mjs +2 -2
- package/esm2022/externals/eui-editor/eui-editor.component.mjs +4 -3
- package/esm2022/externals/eui-editor/eui-editor.module.mjs +7 -3
- package/esm2022/layout/eui-notifications/eui-notifications.component.mjs +15 -10
- package/esm2022/layout/eui-notifications-v2/eui-notifications.component.mjs +14 -3
- package/externals/eui-editor/eui-editor.module.d.ts +2 -1
- package/externals/eui-editor/eui-editor.module.d.ts.map +1 -1
- package/fesm2022/eui-components-eui-list.mjs +4 -4
- package/fesm2022/eui-components-eui-list.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tabs.mjs +4 -4
- package/fesm2022/eui-components-eui-tabs.mjs.map +1 -1
- package/fesm2022/eui-components-externals-eui-editor.mjs +9 -4
- package/fesm2022/eui-components-externals-eui-editor.mjs.map +1 -1
- package/fesm2022/eui-components-layout.mjs +26 -10
- package/fesm2022/eui-components-layout.mjs.map +1 -1
- package/layout/eui-notifications/eui-notifications.component.d.ts +2 -1
- package/layout/eui-notifications/eui-notifications.component.d.ts.map +1 -1
- package/layout/eui-notifications-v2/eui-notifications.component.d.ts +2 -0
- package/layout/eui-notifications-v2/eui-notifications.component.d.ts.map +1 -1
- package/package.json +10 -10
|
@@ -35,7 +35,7 @@ export class EuiListItemComponent {
|
|
|
35
35
|
this.isActive = false;
|
|
36
36
|
}
|
|
37
37
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiListItemComponent, deps: [{ token: i1.BaseStatesDirective }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
38
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.13", type: EuiListItemComponent, selector: "[euiListItem], eui-list-item", inputs: { e2eAttr: "e2eAttr", isActive: ["isActive", "isActive", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.data-e2e": "this.e2eAttr", "attr.tabindex": "this.tabindex" } }, queries: [{ propertyName: "euiArrowKeyNavigableDirective", first: true, predicate: i0.forwardRef(() => EuiArrowKeyNavigableDirective), descendants: true }, { propertyName: "euiListComponent", predicate: i0.forwardRef(() => EuiListComponent), descendants: true }, { propertyName: "euiIconSvgComponent", predicate: i0.forwardRef(() => EuiIconSvgComponent), descendants: true }, { propertyName: "euiLabelComponent", predicate: i0.forwardRef(() => EuiLabelComponent), descendants: true }, { propertyName: "templates", predicate: i0.forwardRef(() => EuiTemplateDirective), descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant"] }], ngImport: i0, template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-
|
|
38
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.13", type: EuiListItemComponent, selector: "[euiListItem], eui-list-item", inputs: { e2eAttr: "e2eAttr", isActive: ["isActive", "isActive", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.data-e2e": "this.e2eAttr", "attr.tabindex": "this.tabindex" } }, queries: [{ propertyName: "euiArrowKeyNavigableDirective", first: true, predicate: i0.forwardRef(() => EuiArrowKeyNavigableDirective), descendants: true }, { propertyName: "euiListComponent", predicate: i0.forwardRef(() => EuiListComponent), descendants: true }, { propertyName: "euiIconSvgComponent", predicate: i0.forwardRef(() => EuiIconSvgComponent), descendants: true }, { propertyName: "euiLabelComponent", predicate: i0.forwardRef(() => EuiLabelComponent), descendants: true }, { propertyName: "templates", predicate: i0.forwardRef(() => EuiTemplateDirective), descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant"] }], ngImport: i0, template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-list .eui-list-item .eui-list-item__container{display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:flex;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon{align-items:center;display:flex}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon .eui-icon-svg{margin-right:var(--eui-s-xs)}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text{display:flex;flex-direction:column;font:var(--eui-f-m-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-s-m)}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-s-s)}.eui-18 .eui-list button.eui-list-item{padding:var(--eui-s-2xs) var(--eui-s-xs)}.eui-18 navigation-list nav{height:auto}.eui-18 .eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-18 .eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-18 .eui-list-item--primary{color:var(--eui-c-primary)}.eui-18 .eui-list-item--primary .eui-icon-svg svg{fill:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-18 .eui-list-item--secondary{color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--secondary .eui-icon-svg svg{fill:var(--eui-c-neutral-light);color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--info{color:var(--eui-c-info)}.eui-18 .eui-list-item--info .eui-icon-svg svg{fill:var(--eui-c-info);color:var(--eui-c-info)}.eui-18 .eui-list-item--success{color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--success .eui-icon-svg svg{fill:var(--eui-c-success-dark);color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--warning{color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--warning .eui-icon-svg svg{fill:var(--eui-c-warning-dark);color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--danger{color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--danger .eui-icon-svg svg{fill:var(--eui-c-danger-dark);color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--accent{color:var(--eui-c-accent-dark)}.eui-18 .eui-list-item--accent .eui-icon-svg svg{fill:var(--eui-c-accent-dark);color:var(--eui-c-accent-dark)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
39
39
|
}
|
|
40
40
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiListItemComponent, decorators: [{
|
|
41
41
|
type: Component,
|
|
@@ -53,7 +53,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
53
53
|
'euiVariant',
|
|
54
54
|
],
|
|
55
55
|
},
|
|
56
|
-
], template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-
|
|
56
|
+
], template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n <div class=\"eui-list-item__content\">\n <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon\">\n <ng-content select=\"eui-icon-svg, span[euiIconSvg]\"></ng-content>\n </div>\n <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n </div>\n <ng-content></ng-content>\n </div>\n\n <div\n class=\"eui-list-item__sub-list\"\n *ngIf=\"(euiListComponent.length > 0) || (euiListComponent.length > 0)\">\n <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n </div>\n</div>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-list .eui-list-item .eui-list-item__container{display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:flex;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon{align-items:center;display:flex}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon .eui-icon-svg{margin-right:var(--eui-s-xs)}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text{display:flex;flex-direction:column;font:var(--eui-f-m-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-s-m)}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-s-s)}.eui-18 .eui-list button.eui-list-item{padding:var(--eui-s-2xs) var(--eui-s-xs)}.eui-18 navigation-list nav{height:auto}.eui-18 .eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-18 .eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-18 .eui-list-item--primary{color:var(--eui-c-primary)}.eui-18 .eui-list-item--primary .eui-icon-svg svg{fill:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-18 .eui-list-item--secondary{color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--secondary .eui-icon-svg svg{fill:var(--eui-c-neutral-light);color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--info{color:var(--eui-c-info)}.eui-18 .eui-list-item--info .eui-icon-svg svg{fill:var(--eui-c-info);color:var(--eui-c-info)}.eui-18 .eui-list-item--success{color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--success .eui-icon-svg svg{fill:var(--eui-c-success-dark);color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--warning{color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--warning .eui-icon-svg svg{fill:var(--eui-c-warning-dark);color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--danger{color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--danger .eui-icon-svg svg{fill:var(--eui-c-danger-dark);color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--accent{color:var(--eui-c-accent-dark)}.eui-18 .eui-list-item--accent .eui-icon-svg svg{fill:var(--eui-c-accent-dark);color:var(--eui-c-accent-dark)}\n"] }]
|
|
57
57
|
}], ctorParameters: () => [{ type: i1.BaseStatesDirective }, { type: i0.ElementRef }], propDecorators: { cssClasses: [{
|
|
58
58
|
type: HostBinding,
|
|
59
59
|
args: ['class']
|
|
@@ -52,11 +52,11 @@ export class EuiListComponent {
|
|
|
52
52
|
!this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.isFocused ? this.focusKeyManager.activeItem.euiArrowKeyNavigableDirective.elementRef.nativeElement.focus() : this.focusKeyManager.activeItem.focus();
|
|
53
53
|
}
|
|
54
54
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
55
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: EuiListComponent, selector: "[euiList], eui-list", host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.tabindex": "this.tabIndex" } }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => EuiListItemComponent), descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-
|
|
55
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: EuiListComponent, selector: "[euiList], eui-list", host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.tabindex": "this.tabIndex" } }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => EuiListItemComponent), descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-list .eui-list-item .eui-list-item__container{display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:flex;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon{align-items:center;display:flex}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon .eui-icon-svg{margin-right:var(--eui-s-xs)}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text{display:flex;flex-direction:column;font:var(--eui-f-m-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-s-m)}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-s-s)}.eui-18 .eui-list button.eui-list-item{padding:var(--eui-s-2xs) var(--eui-s-xs)}.eui-18 navigation-list nav{height:auto}.eui-18 .eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-18 .eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-18 .eui-list-item--primary{color:var(--eui-c-primary)}.eui-18 .eui-list-item--primary .eui-icon-svg svg{fill:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-18 .eui-list-item--secondary{color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--secondary .eui-icon-svg svg{fill:var(--eui-c-neutral-light);color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--info{color:var(--eui-c-info)}.eui-18 .eui-list-item--info .eui-icon-svg svg{fill:var(--eui-c-info);color:var(--eui-c-info)}.eui-18 .eui-list-item--success{color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--success .eui-icon-svg svg{fill:var(--eui-c-success-dark);color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--warning{color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--warning .eui-icon-svg svg{fill:var(--eui-c-warning-dark);color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--danger{color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--danger .eui-icon-svg svg{fill:var(--eui-c-danger-dark);color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--accent{color:var(--eui-c-accent-dark)}.eui-18 .eui-list-item--accent .eui-icon-svg svg{fill:var(--eui-c-accent-dark);color:var(--eui-c-accent-dark)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
56
56
|
}
|
|
57
57
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiListComponent, decorators: [{
|
|
58
58
|
type: Component,
|
|
59
|
-
args: [{ selector: '[euiList], eui-list', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-
|
|
59
|
+
args: [{ selector: '[euiList], eui-list', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-list{display:block;height:auto;position:relative;margin:0;padding:0;border:var(--eui-bw-s) solid transparent}.eui-18 .eui-list:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item{background:none;border:var(--eui-bw-none);box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-s-xs) var(--eui-s-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-list .eui-list-item:hover{background-color:var(--eui-c-hover)}.eui-18 .eui-list .eui-list-item :active,.eui-18 .eui-list .eui-list-item--active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-list .eui-list-item .eui-list-item__container{display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:flex;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon{align-items:center;display:flex}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-icon .eui-icon-svg{margin-right:var(--eui-s-xs)}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text{display:flex;flex-direction:column;font:var(--eui-f-m-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-s-m)}.eui-18 .eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-18 .eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-s-s)}.eui-18 .eui-list button.eui-list-item{padding:var(--eui-s-2xs) var(--eui-s-xs)}.eui-18 navigation-list nav{height:auto}.eui-18 .eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-18 .eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-18 .eui-list-item--primary{color:var(--eui-c-primary)}.eui-18 .eui-list-item--primary .eui-icon-svg svg{fill:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-18 .eui-list-item--secondary{color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--secondary .eui-icon-svg svg{fill:var(--eui-c-neutral-light);color:var(--eui-c-neutral-light)}.eui-18 .eui-list-item--info{color:var(--eui-c-info)}.eui-18 .eui-list-item--info .eui-icon-svg svg{fill:var(--eui-c-info);color:var(--eui-c-info)}.eui-18 .eui-list-item--success{color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--success .eui-icon-svg svg{fill:var(--eui-c-success-dark);color:var(--eui-c-success-dark)}.eui-18 .eui-list-item--warning{color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--warning .eui-icon-svg svg{fill:var(--eui-c-warning-dark);color:var(--eui-c-warning-dark)}.eui-18 .eui-list-item--danger{color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--danger .eui-icon-svg svg{fill:var(--eui-c-danger-dark);color:var(--eui-c-danger-dark)}.eui-18 .eui-list-item--accent{color:var(--eui-c-accent-dark)}.eui-18 .eui-list-item--accent .eui-icon-svg svg{fill:var(--eui-c-accent-dark);color:var(--eui-c-accent-dark)}\n"] }]
|
|
60
60
|
}], propDecorators: { cssClasses: [{
|
|
61
61
|
type: HostBinding,
|
|
62
62
|
args: ['class']
|
|
@@ -37,7 +37,7 @@ export class EuiTabComponent {
|
|
|
37
37
|
}
|
|
38
38
|
}
|
|
39
39
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiTabComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
40
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.13", type: EuiTabComponent, selector: "eui-tab", inputs: { url: "url", e2eAttr: "e2eAttr", tooltip: "tooltip", isClosable: ["isClosable", "isClosable", booleanAttribute], isVisible: ["isVisible", "isVisible", booleanAttribute], isActive: ["isActive", "isActive", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isHandleCloseOnClose: ["isHandleCloseOnClose", "isHandleCloseOnClose", booleanAttribute] }, queries: [{ propertyName: "templateLabel", first: true, predicate: EuiTabLabelComponent, descendants: true }, { propertyName: "templateContent", first: true, predicate: EuiTabContentComponent, descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiDisabled", "euiDisabled", "euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiInfo", "euiInfo", "euiSuccess", "euiSuccess", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-c-active)}.eui-18 .eui-tabs .eui-tab-item:hover,.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--closable{padding-right:var(--eui-s-xs)}.eui-18 .eui-tabs .eui-tab-item--closable .eui-tab-item__close-button{margin-left:var(--eui-s-2xs)}.eui-18 .eui-tabs .eui-tab-item--primary,.eui-18 .eui-tabs .eui-tab-item--primary .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--secondary,.eui-18 .eui-tabs .eui-tab-item--secondary .eui-tab-item__label-text{color:var(--eui-c-neutral)}.eui-18 .eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-item--info,.eui-18 .eui-tabs .eui-tab-item--info .eui-tab-item__label-text{color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--success,.eui-18 .eui-tabs .eui-tab-item--success .eui-tab-item__label-text{color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--warning,.eui-18 .eui-tabs .eui-tab-item--warning .eui-tab-item__label-text{color:var(--eui-c-warning)}.eui-18 .eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-c-warning-darker)}.eui-18 .eui-tabs .eui-tab-item--danger,.eui-18 .eui-tabs .eui-tab-item--danger .eui-tab-item__label-text{color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--accent,.eui-18 .eui-tabs .eui-tab-item--accent .eui-tab-item__label-text{color:var(--eui-c-accent-bg)}.eui-18 .eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-c-accent-darker)}\n"] }); }
|
|
40
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.13", type: EuiTabComponent, selector: "eui-tab", inputs: { url: "url", e2eAttr: "e2eAttr", tooltip: "tooltip", isClosable: ["isClosable", "isClosable", booleanAttribute], isVisible: ["isVisible", "isVisible", booleanAttribute], isActive: ["isActive", "isActive", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isHandleCloseOnClose: ["isHandleCloseOnClose", "isHandleCloseOnClose", booleanAttribute] }, queries: [{ propertyName: "templateLabel", first: true, predicate: EuiTabLabelComponent, descendants: true }, { propertyName: "templateContent", first: true, predicate: EuiTabContentComponent, descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiDisabled", "euiDisabled", "euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiInfo", "euiInfo", "euiSuccess", "euiSuccess", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-tabs .eui-tab-item:hover,.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--closable{padding-right:var(--eui-s-xs)}.eui-18 .eui-tabs .eui-tab-item--closable .eui-tab-item__close-button{margin-left:var(--eui-s-2xs)}.eui-18 .eui-tabs .eui-tab-item--primary,.eui-18 .eui-tabs .eui-tab-item--primary .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--secondary,.eui-18 .eui-tabs .eui-tab-item--secondary .eui-tab-item__label-text{color:var(--eui-c-neutral)}.eui-18 .eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-item--info,.eui-18 .eui-tabs .eui-tab-item--info .eui-tab-item__label-text{color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--success,.eui-18 .eui-tabs .eui-tab-item--success .eui-tab-item__label-text{color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--warning,.eui-18 .eui-tabs .eui-tab-item--warning .eui-tab-item__label-text{color:var(--eui-c-warning)}.eui-18 .eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-c-warning-darker)}.eui-18 .eui-tabs .eui-tab-item--danger,.eui-18 .eui-tabs .eui-tab-item--danger .eui-tab-item__label-text{color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--accent,.eui-18 .eui-tabs .eui-tab-item--accent .eui-tab-item__label-text{color:var(--eui-c-accent-bg)}.eui-18 .eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-c-accent-darker)}\n"] }); }
|
|
41
41
|
}
|
|
42
42
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiTabComponent, decorators: [{
|
|
43
43
|
type: Component,
|
|
@@ -56,7 +56,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
56
56
|
'euiVariant',
|
|
57
57
|
],
|
|
58
58
|
},
|
|
59
|
-
], template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-
|
|
59
|
+
], template: "<ng-content></ng-content>\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-tabs .eui-tab-item:hover,.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--closable{padding-right:var(--eui-s-xs)}.eui-18 .eui-tabs .eui-tab-item--closable .eui-tab-item__close-button{margin-left:var(--eui-s-2xs)}.eui-18 .eui-tabs .eui-tab-item--primary,.eui-18 .eui-tabs .eui-tab-item--primary .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--secondary,.eui-18 .eui-tabs .eui-tab-item--secondary .eui-tab-item__label-text{color:var(--eui-c-neutral)}.eui-18 .eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-item--info,.eui-18 .eui-tabs .eui-tab-item--info .eui-tab-item__label-text{color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--success,.eui-18 .eui-tabs .eui-tab-item--success .eui-tab-item__label-text{color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--warning,.eui-18 .eui-tabs .eui-tab-item--warning .eui-tab-item__label-text{color:var(--eui-c-warning)}.eui-18 .eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-c-warning-darker)}.eui-18 .eui-tabs .eui-tab-item--danger,.eui-18 .eui-tabs .eui-tab-item--danger .eui-tab-item__label-text{color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--accent,.eui-18 .eui-tabs .eui-tab-item--accent .eui-tab-item__label-text{color:var(--eui-c-accent-bg)}.eui-18 .eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-c-accent-darker)}\n"] }]
|
|
60
60
|
}], ctorParameters: () => [{ type: i1.BaseStatesDirective }], propDecorators: { url: [{
|
|
61
61
|
type: Input
|
|
62
62
|
}], e2eAttr: [{
|
|
@@ -307,11 +307,11 @@ export class EuiTabsComponent {
|
|
|
307
307
|
this.cd.detectChanges();
|
|
308
308
|
}
|
|
309
309
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiTabsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.Router }, { token: i2.AnimationBuilder }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
310
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: EuiTabsComponent, selector: "eui-tabs", inputs: { tabs: "tabs", activeTabIndex: "activeTabIndex", e2eAttr: "e2eAttr", pathMatch: "pathMatch", isMainNavigation: ["isMainNavigation", "isMainNavigation", booleanAttribute], isHandleChangeTab: ["isHandleChangeTab", "isHandleChangeTab", booleanAttribute], isSubTabs: ["isSubTabs", "isSubTabs", booleanAttribute], isVerticalTabs: ["isVerticalTabs", "isVerticalTabs", booleanAttribute] }, outputs: { tabClose: "tabClose", tabSelect: "tabSelect" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.elementClass", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "euiTabsRightContentTagDirective", first: true, predicate: i0.forwardRef(() => EuiTabsRightContentTagDirective), descendants: true }, { propertyName: "_tabs", predicate: i0.forwardRef(() => EuiTabComponent) }], viewQueries: [{ propertyName: "euiTabsItems", first: true, predicate: ["euiTabsItems"], descendants: true }, { propertyName: "euiTabsItemsWrapper", first: true, predicate: ["euiTabsItemsWrapper"], descendants: true }, { propertyName: "euiTabLabelItems", predicate: ["euiTabLabelItem"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<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 @for (tab of tabs; let i = $index; track tab) {\n @if (tab.isVisible) {\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item eui-tab-item--{{ tab.baseStatesDirective.euiVariant }}\"\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 [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 @if (tab.isClosable) {\n <eui-icon-button\n class=\"eui-tab-item__close-button\"\n icon=\"close:outline\"\n ariaLabel=\"close tab\"\n (buttonClick)=\"closeTab(i, $event)\"\n euiRounded>\n </eui-icon-button>\n }\n </div>\n }\n }\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=\"chevron-back:sharp\"></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=\"chevron-forward:sharp\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n @if (euiTabsRightContentTagDirective) {\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n }\n</div>\n\n@for (tab of tabs; let i = $index; track tab) {\n @if (i === activeTabIndex && tab.templateContent) {\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n }\n}\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-c-active)}.eui-18 .eui-tabs .eui-tab-item:hover,.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--closable{padding-right:var(--eui-s-xs)}.eui-18 .eui-tabs .eui-tab-item--closable .eui-tab-item__close-button{margin-left:var(--eui-s-2xs)}.eui-18 .eui-tabs .eui-tab-item--primary,.eui-18 .eui-tabs .eui-tab-item--primary .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--secondary,.eui-18 .eui-tabs .eui-tab-item--secondary .eui-tab-item__label-text{color:var(--eui-c-neutral)}.eui-18 .eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-item--info,.eui-18 .eui-tabs .eui-tab-item--info .eui-tab-item__label-text{color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--success,.eui-18 .eui-tabs .eui-tab-item--success .eui-tab-item__label-text{color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--warning,.eui-18 .eui-tabs .eui-tab-item--warning .eui-tab-item__label-text{color:var(--eui-c-warning)}.eui-18 .eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-c-warning-darker)}.eui-18 .eui-tabs .eui-tab-item--danger,.eui-18 .eui-tabs .eui-tab-item--danger .eui-tab-item__label-text{color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--accent,.eui-18 .eui-tabs .eui-tab-item--accent .eui-tab-item__label-text{color:var(--eui-c-accent-bg)}.eui-18 .eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-c-accent-darker)}\n"], dependencies: [{ kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i4.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i5.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i6.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], 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 }); }
|
|
310
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: EuiTabsComponent, selector: "eui-tabs", inputs: { tabs: "tabs", activeTabIndex: "activeTabIndex", e2eAttr: "e2eAttr", pathMatch: "pathMatch", isMainNavigation: ["isMainNavigation", "isMainNavigation", booleanAttribute], isHandleChangeTab: ["isHandleChangeTab", "isHandleChangeTab", booleanAttribute], isSubTabs: ["isSubTabs", "isSubTabs", booleanAttribute], isVerticalTabs: ["isVerticalTabs", "isVerticalTabs", booleanAttribute] }, outputs: { tabClose: "tabClose", tabSelect: "tabSelect" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.elementClass", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "euiTabsRightContentTagDirective", first: true, predicate: i0.forwardRef(() => EuiTabsRightContentTagDirective), descendants: true }, { propertyName: "_tabs", predicate: i0.forwardRef(() => EuiTabComponent) }], viewQueries: [{ propertyName: "euiTabsItems", first: true, predicate: ["euiTabsItems"], descendants: true }, { propertyName: "euiTabsItemsWrapper", first: true, predicate: ["euiTabsItemsWrapper"], descendants: true }, { propertyName: "euiTabLabelItems", predicate: ["euiTabLabelItem"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<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 @for (tab of tabs; let i = $index; track tab) {\n @if (tab.isVisible) {\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item eui-tab-item--{{ tab.baseStatesDirective.euiVariant }}\"\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 [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 @if (tab.isClosable) {\n <eui-icon-button\n class=\"eui-tab-item__close-button\"\n icon=\"close:outline\"\n ariaLabel=\"close tab\"\n (buttonClick)=\"closeTab(i, $event)\"\n euiRounded>\n </eui-icon-button>\n }\n </div>\n }\n }\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=\"chevron-back:sharp\"></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=\"chevron-forward:sharp\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n @if (euiTabsRightContentTagDirective) {\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n }\n</div>\n\n@for (tab of tabs; let i = $index; track tab) {\n @if (i === activeTabIndex && tab.templateContent) {\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n }\n}\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-tabs .eui-tab-item:hover,.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--closable{padding-right:var(--eui-s-xs)}.eui-18 .eui-tabs .eui-tab-item--closable .eui-tab-item__close-button{margin-left:var(--eui-s-2xs)}.eui-18 .eui-tabs .eui-tab-item--primary,.eui-18 .eui-tabs .eui-tab-item--primary .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--secondary,.eui-18 .eui-tabs .eui-tab-item--secondary .eui-tab-item__label-text{color:var(--eui-c-neutral)}.eui-18 .eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-item--info,.eui-18 .eui-tabs .eui-tab-item--info .eui-tab-item__label-text{color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--success,.eui-18 .eui-tabs .eui-tab-item--success .eui-tab-item__label-text{color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--warning,.eui-18 .eui-tabs .eui-tab-item--warning .eui-tab-item__label-text{color:var(--eui-c-warning)}.eui-18 .eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-c-warning-darker)}.eui-18 .eui-tabs .eui-tab-item--danger,.eui-18 .eui-tabs .eui-tab-item--danger .eui-tab-item__label-text{color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--accent,.eui-18 .eui-tabs .eui-tab-item--accent .eui-tab-item__label-text{color:var(--eui-c-accent-bg)}.eui-18 .eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-c-accent-darker)}\n"], dependencies: [{ kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i4.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i5.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i6.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], 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 }); }
|
|
311
311
|
}
|
|
312
312
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EuiTabsComponent, decorators: [{
|
|
313
313
|
type: Component,
|
|
314
|
-
args: [{ selector: 'eui-tabs', encapsulation: ViewEncapsulation.None, template: "<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 @for (tab of tabs; let i = $index; track tab) {\n @if (tab.isVisible) {\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item eui-tab-item--{{ tab.baseStatesDirective.euiVariant }}\"\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 [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 @if (tab.isClosable) {\n <eui-icon-button\n class=\"eui-tab-item__close-button\"\n icon=\"close:outline\"\n ariaLabel=\"close tab\"\n (buttonClick)=\"closeTab(i, $event)\"\n euiRounded>\n </eui-icon-button>\n }\n </div>\n }\n }\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=\"chevron-back:sharp\"></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=\"chevron-forward:sharp\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n @if (euiTabsRightContentTagDirective) {\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n }\n</div>\n\n@for (tab of tabs; let i = $index; track tab) {\n @if (i === activeTabIndex && tab.templateContent) {\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n }\n}\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-c-active)}.eui-18 .eui-tabs .eui-tab-item:hover,.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--closable{padding-right:var(--eui-s-xs)}.eui-18 .eui-tabs .eui-tab-item--closable .eui-tab-item__close-button{margin-left:var(--eui-s-2xs)}.eui-18 .eui-tabs .eui-tab-item--primary,.eui-18 .eui-tabs .eui-tab-item--primary .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--secondary,.eui-18 .eui-tabs .eui-tab-item--secondary .eui-tab-item__label-text{color:var(--eui-c-neutral)}.eui-18 .eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-item--info,.eui-18 .eui-tabs .eui-tab-item--info .eui-tab-item__label-text{color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--success,.eui-18 .eui-tabs .eui-tab-item--success .eui-tab-item__label-text{color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--warning,.eui-18 .eui-tabs .eui-tab-item--warning .eui-tab-item__label-text{color:var(--eui-c-warning)}.eui-18 .eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-c-warning-darker)}.eui-18 .eui-tabs .eui-tab-item--danger,.eui-18 .eui-tabs .eui-tab-item--danger .eui-tab-item__label-text{color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--accent,.eui-18 .eui-tabs .eui-tab-item--accent .eui-tab-item__label-text{color:var(--eui-c-accent-bg)}.eui-18 .eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-c-accent-darker)}\n"] }]
|
|
314
|
+
args: [{ selector: 'eui-tabs', encapsulation: ViewEncapsulation.None, template: "<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 @for (tab of tabs; let i = $index; track tab) {\n @if (tab.isVisible) {\n <div\n tabindex=\"0\"\n role=\"tab\"\n class=\"eui-tab-item eui-tab-item--{{ tab.baseStatesDirective.euiVariant }}\"\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 [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 @if (tab.isClosable) {\n <eui-icon-button\n class=\"eui-tab-item__close-button\"\n icon=\"close:outline\"\n ariaLabel=\"close tab\"\n (buttonClick)=\"closeTab(i, $event)\"\n euiRounded>\n </eui-icon-button>\n }\n </div>\n }\n }\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=\"chevron-back:sharp\"></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=\"chevron-forward:sharp\"></eui-icon-svg>\n </button>\n </div>\n </div>\n </div>\n\n @if (euiTabsRightContentTagDirective) {\n <div class=\"eui-tabs__right-content\">\n <ng-content select=\"euiTabsRightContent\"></ng-content>\n </div>\n }\n</div>\n\n@for (tab of tabs; let i = $index; track tab) {\n @if (i === activeTabIndex && tab.templateContent) {\n <div class=\"eui-tab-content-wrapper\" tabindex=\"0\">\n <ng-template [cdkPortalOutlet]=\"tab.templateContent.templatePortal\"></ng-template>\n </div>\n }\n}\n", styles: [".eui-18 .eui-tabs__items{display:flex!important;flex-direction:row;position:relative;width:100%}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical{flex:1 1 25%;flex-direction:column}.eui-18 .eui-tabs .eui-tabs__items-wrapper{display:flex;flex-shrink:0}.eui-18 .eui-tabs .eui-tabs__items{justify-content:space-between;overflow:hidden}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:3px 0 6px 1px #00000040;display:none;height:100%;left:0;position:absolute;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__left-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item{background-color:var(--eui-c-neutral-bg-light);box-shadow:-3px 0 6px 1px #00000040;display:none;height:100%;position:absolute;right:0;top:0}.eui-18 .eui-tabs .eui-tabs__items .eui-tabs__navigation .eui-tabs__navigation__right-item .eui-button.eui-button--icon-only{height:100%}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__items-wrapper{padding-left:3.75rem}.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__left-item,.eui-18 .eui-tabs .eui-tabs__items--scrolling .eui-tabs__navigation__right-item{display:block!important;padding:0 2px 2px}.eui-18 .eui-tabs__right-content{align-items:center;display:flex;margin-left:var(--eui-s-s)}.eui-18 .eui-tabs__right-content .eui-tabs__right-content-wrapper{display:flex;align-items:center}.eui-18 .eui-tabs .eui-tabs__wrapper--vertical .eui-tab-item__label{align-items:center;display:flex}.eui-18 .eui-tabs .eui-tab-item{align-items:center;background-color:inherit;border:var(--eui-bw-none);border-bottom:3px solid transparent;box-shadow:0 2px 1px #00000080,inset 0 1px 0 var(--eui-c-white);color:var(--eui-c-neutral);cursor:pointer;display:flex;padding:var(--eui-s-s) var(--eui-s-m) var(--eui-s-s) var(--eui-s-m);position:relative;text-align:center;transition:.5s cubic-bezier(.35,0,.25,1)}.eui-18 .eui-tabs .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs .eui-tab-item__label{font:var(--eui-f-m-bold)}.eui-18 .eui-tabs .eui-tab-item__label .eui-tab-item__sublabel{align-items:center;display:flex;font:var(--eui-f-s-compact)}.eui-18 .eui-tabs .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-hover);border-bottom:3px solid var(--eui-c-primary-lighter)}.eui-18 .eui-tabs .eui-tab-item--active{border-bottom:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--active .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--hidden{display:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled{color:var(--eui-c-neutral-lighter);cursor:not-allowed;pointer-events:none}.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--disabled:hover{border-bottom:3px solid transparent;color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper{border-top:1px solid var(--eui-c-neutral-lightest)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s) 0}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs.eui-tabs--vertical{display:flex;flex-direction:row}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items .eui-tabs__items-wrapper{display:flex;flex-direction:column;height:100%}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal){border-bottom:0;flex:1 1 25%;flex-direction:column;position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--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-c-white)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item--active,.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:active{border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tabs__wrapper--vertical .eui-tabs__items:not(.eui-tabs__items--horizontal) .eui-tab-item:hover:not(.eui-tab-item--active){background:var(--eui-c-neutral-bg-light);border-left:3px solid var(--eui-c-primary)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper{border-top:none;flex:1 1 75%;flex-direction:column}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{padding:var(--eui-s-s);position:relative}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-c-neutral-bg-light)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}@-moz-document url-prefix(){.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content{scrollbar-color:var(--eui-c-neutral-lighter) var(--eui-c-neutral-bg-light);scrollbar-width:auto}}.eui-18 .eui-tabs.eui-tabs--vertical .eui-tab-content-wrapper .eui-tab-content.eui-tab-content--no-padding{padding:0}.eui-18 .eui-tabs--main-navigation .eui-tabs__items,.eui-18 .eui-tabs--main-navigation .eui-tabs__items-wrapper{width:100%}.eui-18 .eui-tabs--main-navigation .eui-tab-item{flex-grow:1;justify-content:center}.eui-18 .eui-tabs--main-navigation .eui-tab-item--active,.eui-18 .eui-tabs--main-navigation .eui-tab-item :active{background-color:var(--eui-bc-primary-10)}.eui-18 .eui-tabs .eui-tab-item:hover,.eui-18 .eui-tabs .eui-tab-item.eui-tab-item--active{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--closable{padding-right:var(--eui-s-xs)}.eui-18 .eui-tabs .eui-tab-item--closable .eui-tab-item__close-button{margin-left:var(--eui-s-2xs)}.eui-18 .eui-tabs .eui-tab-item--primary,.eui-18 .eui-tabs .eui-tab-item--primary .eui-tab-item__label-text{color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--primary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--primary:hover{border-bottom-color:var(--eui-c-primary)}.eui-18 .eui-tabs .eui-tab-item--secondary,.eui-18 .eui-tabs .eui-tab-item--secondary .eui-tab-item__label-text{color:var(--eui-c-neutral)}.eui-18 .eui-tabs .eui-tab-item--secondary.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--secondary:hover{border-bottom-color:var(--eui-c-neutral-light)}.eui-18 .eui-tabs .eui-tab-item--info,.eui-18 .eui-tabs .eui-tab-item--info .eui-tab-item__label-text{color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--info.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--info:hover{border-bottom-color:var(--eui-c-info)}.eui-18 .eui-tabs .eui-tab-item--success,.eui-18 .eui-tabs .eui-tab-item--success .eui-tab-item__label-text{color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--success.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--success:hover{border-bottom-color:var(--eui-c-success-dark)}.eui-18 .eui-tabs .eui-tab-item--warning,.eui-18 .eui-tabs .eui-tab-item--warning .eui-tab-item__label-text{color:var(--eui-c-warning)}.eui-18 .eui-tabs .eui-tab-item--warning.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--warning:hover{border-bottom-color:var(--eui-c-warning-darker)}.eui-18 .eui-tabs .eui-tab-item--danger,.eui-18 .eui-tabs .eui-tab-item--danger .eui-tab-item__label-text{color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--danger.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--danger:hover{border-bottom-color:var(--eui-c-danger-dark)}.eui-18 .eui-tabs .eui-tab-item--accent,.eui-18 .eui-tabs .eui-tab-item--accent .eui-tab-item__label-text{color:var(--eui-c-accent-bg)}.eui-18 .eui-tabs .eui-tab-item--accent.eui-tab-item--active,.eui-18 .eui-tabs .eui-tab-item--accent:hover{border-bottom-color:var(--eui-c-accent-darker)}\n"] }]
|
|
315
315
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.Router }, { type: i2.AnimationBuilder }, { type: i0.ElementRef }], propDecorators: { elementClass: [{
|
|
316
316
|
type: HostBinding,
|
|
317
317
|
args: ['class']
|