@eui/components 18.0.0-rc.31 → 18.0.0-rc.33
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/EuiAlertComponent.html +1 -1
- package/docs/components/EuiChipComponent.html +25 -1
- package/docs/components/EuiPaginatorComponent.html +1 -1
- package/docs/dependencies.html +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/esm2022/eui-alert/eui-alert.component.mjs +3 -3
- package/esm2022/eui-button/eui-button.component.mjs +2 -2
- package/esm2022/eui-chip/eui-chip.component.mjs +9 -6
- package/esm2022/eui-chip-list/eui-chip-list.component.mjs +1 -1
- package/esm2022/eui-paginator/eui-paginator.component.mjs +3 -3
- package/esm2022/eui-tree/eui-tree.component.mjs +1 -1
- package/eui-chip/eui-chip.component.d.ts +3 -1
- package/eui-chip/eui-chip.component.d.ts.map +1 -1
- package/fesm2022/eui-components-eui-alert.mjs +2 -2
- package/fesm2022/eui-components-eui-alert.mjs.map +1 -1
- package/fesm2022/eui-components-eui-button.mjs +2 -2
- package/fesm2022/eui-components-eui-chip-list.mjs +1 -1
- package/fesm2022/eui-components-eui-chip-list.mjs.map +1 -1
- package/fesm2022/eui-components-eui-chip.mjs +8 -5
- package/fesm2022/eui-components-eui-chip.mjs.map +1 -1
- package/fesm2022/eui-components-eui-paginator.mjs +2 -2
- package/fesm2022/eui-components-eui-paginator.mjs.map +1 -1
- package/fesm2022/eui-components-eui-tree.mjs +1 -1
- package/fesm2022/eui-components-eui-tree.mjs.map +1 -1
- package/package.json +4 -5
|
@@ -45,7 +45,7 @@ export class EuiAlertComponent {
|
|
|
45
45
|
this.closeAlert.emit(false);
|
|
46
46
|
}
|
|
47
47
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiAlertComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
48
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: EuiAlertComponent, selector: "div[euiAlert], eui-alert", inputs: { ariaDescribedBy: "ariaDescribedBy", e2eAttr: "e2eAttr", isMuted: ["isMuted", "isMuted", booleanAttribute], isCloseable: ["isCloseable", "isCloseable", booleanAttribute], isFocusable: ["isFocusable", "isFocusable", booleanAttribute], isVisible: ["isVisible", "isVisible", booleanAttribute] }, outputs: { closeAlert: "closeAlert" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.aria-describedby": "this.ariaDescribedBy", "attr.tabindex": "this.tabindex", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "alertTitle", first: true, predicate: i0.forwardRef(() => EuiAlertTitleComponent), descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant"] }], ngImport: i0, template: "\n@if (alertTitle) {\n
|
|
48
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: EuiAlertComponent, selector: "div[euiAlert], eui-alert", inputs: { ariaDescribedBy: "ariaDescribedBy", e2eAttr: "e2eAttr", isMuted: ["isMuted", "isMuted", booleanAttribute], isCloseable: ["isCloseable", "isCloseable", booleanAttribute], isFocusable: ["isFocusable", "isFocusable", booleanAttribute], isVisible: ["isVisible", "isVisible", booleanAttribute] }, outputs: { closeAlert: "closeAlert" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.aria-describedby": "this.ariaDescribedBy", "attr.tabindex": "this.tabindex", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "alertTitle", first: true, predicate: i0.forwardRef(() => EuiAlertTitleComponent), descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant"] }], ngImport: i0, template: "<div class=\"eui-alert-wrapper\">\n @if (alertTitle) {\n <div class=\"eui-alert-container\">\n <div class=\"eui-alert-title-wrapper\">\n @if (!isMuted) {\n <ng-content *ngTemplateOutlet=\"icon\"/>\n }\n <ng-content select=\"eui-alert-title\"/>\n </div>\n <ng-content *ngTemplateOutlet=\"body\"/>\n </div>\n\n } @else {\n @if (!isMuted) {\n <ng-content *ngTemplateOutlet=\"icon\"/>\n }\n <ng-content *ngTemplateOutlet=\"body\"/>\n }\n\n <ng-template #icon>\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\" class=\"eui-alert-icon\"/>\n </ng-template>\n\n <ng-template #body>\n <div class=\"eui-alert-content\">\n <ng-content/>\n </div>\n </ng-template>\n\n @if (isCloseable) {\n <eui-icon-button class=\"eui-alert-close\"\n icon=\"close:outline\"\n euiRounded\n (buttonClick)=\"onCloseClick()\"\n fillColor=\"neutral-light\"/>\n }\n</div>\n", styles: [".eui-alert{--_border-color: var(--eui-alert-border-color, var(--eui-c-info));--_color: var(--eui-alert-color, var(--eui-c-info));--_bg-color: var(--eui-alert-bg-color, var(--eui-c-info-bg));--_close-hover-color: var(--eui-alert-close-hover-color, var(--eui-c-info-lightest))}.eui-alert-wrapper{display:inline-block;padding:var(--eui-s-m);background-color:var(--_bg-color);position:relative;padding-right:var(--eui-s-4xl);width:100%}.eui-alert-container{display:flex;flex-direction:column;row-gap:var(--eui-s-s)}.eui-alert-title-wrapper{display:flex;align-items:center}.eui-alert-icon{float:left;margin-right:var(--eui-s-xs)}.eui-alert-title{color:var(--_color);font:var(--eui-f-m-bold-compact)}.eui-alert-content{display:block}.eui-alert-content p:first-child{margin-top:0}.eui-alert-close{position:absolute;top:var(--eui-s-xs);right:var(--eui-s-xs)}.eui-alert-close .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-alert--info{--_color: var(--eui-c-info);--_bg-color: var(--eui-c-info-bg);--_close-hover-color: var(--eui-c-info-lightest)}.eui-alert--success{--_color: var(--eui-c-success-dark);--_bg-color: var(--eui-c-success-bg);--_close-hover-color: var(--eui-c-success-lightest)}.eui-alert--danger{--_color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-bg);--_close-hover-color: var(--eui-c-danger-lightest)}.eui-alert--warning{--_color: var(--eui-c-warning-dark);--_bg-color: var(--eui-c-warning-bg);--_close-hover-color: var(--eui-c-warning-lightest)}.eui-alert--hidden{display:none}.eui-alert--focusable:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-alert--focusable:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-alert--focusable [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}\n"], dependencies: [{ kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.EuiIconStateComponent, selector: "eui-icon-state", inputs: ["size", "ariaLabel"] }, { kind: "component", type: i4.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
49
49
|
}
|
|
50
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiAlertComponent, decorators: [{
|
|
51
51
|
type: Component,
|
|
@@ -60,7 +60,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
|
|
|
60
60
|
'euiVariant',
|
|
61
61
|
],
|
|
62
62
|
},
|
|
63
|
-
], template: "\n@if (alertTitle) {\n
|
|
63
|
+
], template: "<div class=\"eui-alert-wrapper\">\n @if (alertTitle) {\n <div class=\"eui-alert-container\">\n <div class=\"eui-alert-title-wrapper\">\n @if (!isMuted) {\n <ng-content *ngTemplateOutlet=\"icon\"/>\n }\n <ng-content select=\"eui-alert-title\"/>\n </div>\n <ng-content *ngTemplateOutlet=\"body\"/>\n </div>\n\n } @else {\n @if (!isMuted) {\n <ng-content *ngTemplateOutlet=\"icon\"/>\n }\n <ng-content *ngTemplateOutlet=\"body\"/>\n }\n\n <ng-template #icon>\n <eui-icon-state [euiVariant]=\"baseStatesDirective.euiVariant\" class=\"eui-alert-icon\"/>\n </ng-template>\n\n <ng-template #body>\n <div class=\"eui-alert-content\">\n <ng-content/>\n </div>\n </ng-template>\n\n @if (isCloseable) {\n <eui-icon-button class=\"eui-alert-close\"\n icon=\"close:outline\"\n euiRounded\n (buttonClick)=\"onCloseClick()\"\n fillColor=\"neutral-light\"/>\n }\n</div>\n", styles: [".eui-alert{--_border-color: var(--eui-alert-border-color, var(--eui-c-info));--_color: var(--eui-alert-color, var(--eui-c-info));--_bg-color: var(--eui-alert-bg-color, var(--eui-c-info-bg));--_close-hover-color: var(--eui-alert-close-hover-color, var(--eui-c-info-lightest))}.eui-alert-wrapper{display:inline-block;padding:var(--eui-s-m);background-color:var(--_bg-color);position:relative;padding-right:var(--eui-s-4xl);width:100%}.eui-alert-container{display:flex;flex-direction:column;row-gap:var(--eui-s-s)}.eui-alert-title-wrapper{display:flex;align-items:center}.eui-alert-icon{float:left;margin-right:var(--eui-s-xs)}.eui-alert-title{color:var(--_color);font:var(--eui-f-m-bold-compact)}.eui-alert-content{display:block}.eui-alert-content p:first-child{margin-top:0}.eui-alert-close{position:absolute;top:var(--eui-s-xs);right:var(--eui-s-xs)}.eui-alert-close .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-alert--info{--_color: var(--eui-c-info);--_bg-color: var(--eui-c-info-bg);--_close-hover-color: var(--eui-c-info-lightest)}.eui-alert--success{--_color: var(--eui-c-success-dark);--_bg-color: var(--eui-c-success-bg);--_close-hover-color: var(--eui-c-success-lightest)}.eui-alert--danger{--_color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-bg);--_close-hover-color: var(--eui-c-danger-lightest)}.eui-alert--warning{--_color: var(--eui-c-warning-dark);--_bg-color: var(--eui-c-warning-bg);--_close-hover-color: var(--eui-c-warning-lightest)}.eui-alert--hidden{display:none}.eui-alert--focusable:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-alert--focusable:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-alert--focusable [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}\n"] }]
|
|
64
64
|
}], ctorParameters: () => [{ type: i1.BaseStatesDirective }], propDecorators: { cssClasses: [{
|
|
65
65
|
type: HostBinding,
|
|
66
66
|
args: ['class']
|
|
@@ -98,4 +98,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
|
|
|
98
98
|
type: ContentChild,
|
|
99
99
|
args: [forwardRef(() => EuiAlertTitleComponent), { static: false }]
|
|
100
100
|
}] } });
|
|
101
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
101
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXVpLWFsZXJ0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2V1aS1hbGVydC9ldWktYWxlcnQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vZXVpLWFsZXJ0L2V1aS1hbGVydC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0gsU0FBUyxFQUNULFdBQVcsRUFDWCxZQUFZLEVBQ1osS0FBSyxFQUNMLHVCQUF1QixFQUN2QixNQUFNLEVBRU4sWUFBWSxFQUNaLFVBQVUsRUFFVixnQkFBZ0IsRUFDaEIsaUJBQWlCLEdBQ3BCLE1BQU0sZUFBZSxDQUFDO0FBRXZCLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQzdELE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLHdDQUF3QyxDQUFDOzs7Ozs7QUFxQmhGLE1BQU0sT0FBTyxpQkFBaUI7SUFDMUIsSUFDVyxVQUFVO1FBQ2pCLE9BQU87WUFDSCxJQUFJLENBQUMsbUJBQW1CLENBQUMsYUFBYSxDQUFDLFdBQVcsQ0FBQztZQUNuRCxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDLENBQUMsRUFBRTtZQUN0QyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDLENBQUMsRUFBRTtZQUM5QyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDLENBQUMsRUFBRTtZQUM5QyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLG1CQUFtQixDQUFDLENBQUMsQ0FBQyxFQUFFO1NBQzdDO2FBQ0ksSUFBSSxDQUFDLEdBQUcsQ0FBQzthQUNULElBQUksRUFBRSxDQUFDO0lBQ2hCLENBQUM7SUFHRCxJQUVJLGVBQWU7UUFDZixPQUFPLGdCQUFnQixJQUFJLENBQUMsUUFBUSxFQUFFLENBQUM7SUFDM0MsQ0FBQztJQUNELElBQ0ksUUFBUTtRQUNSLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7SUFDekMsQ0FBQztJQW9CRCxZQUFtQixtQkFBd0M7UUFBeEMsd0JBQW1CLEdBQW5CLG1CQUFtQixDQUFxQjtRQTdCakMsU0FBSSxHQUFHLE9BQU8sQ0FBQztRQWF6QyxZQUFPLEdBQUcsV0FBVyxDQUFDO1FBRWtCLFlBQU8sR0FBRyxLQUFLLENBQUM7UUFDaEIsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFDcEIsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFDcEIsY0FBUyxHQUFHLElBQUksQ0FBQztRQUUvQyxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztJQVNXLENBQUM7SUFFL0QsUUFBUTtRQUNKLElBQUksQ0FBQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsVUFBVSxFQUFFLENBQUM7WUFDdkMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUM7UUFDNUMsQ0FBQztRQUNELElBQUksQ0FBQyxRQUFRLEdBQUcsTUFBTSxDQUFDLFVBQVUsRUFBRSxDQUFDO0lBQ3hDLENBQUM7SUFFRCxZQUFZO1FBQ1IsSUFBSSxDQUFDLFNBQVMsR0FBRyxLQUFLLENBQUM7UUFDdkIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDaEMsQ0FBQzs4R0F2RFEsaUJBQWlCO2tHQUFqQixpQkFBaUIsMElBNkJOLGdCQUFnQiwrQ0FDaEIsZ0JBQWdCLCtDQUNoQixnQkFBZ0IseUNBQ2hCLGdCQUFnQixvVUFJTCxzQkFBc0Isd1BDekV6RCxzbENBcUNBOzsyRkRBYSxpQkFBaUI7a0JBbkI3QixTQUFTOytCQUVJLDBCQUEwQixtQkFFbkIsdUJBQXVCLENBQUMsTUFBTSxpQkFDaEMsaUJBQWlCLENBQUMsSUFBSSxrQkFDckI7d0JBQ1o7NEJBQ0ksU0FBUyxFQUFFLG1CQUFtQjs0QkFDOUIsTUFBTSxFQUFFO2dDQUNKLFlBQVk7Z0NBQ1osU0FBUztnQ0FDVCxZQUFZO2dDQUNaLFdBQVc7Z0NBQ1gsWUFBWTs2QkFDZjt5QkFDSjtxQkFDSjt3RkFJVSxVQUFVO3NCQURwQixXQUFXO3VCQUFDLE9BQU87Z0JBYU0sSUFBSTtzQkFBN0IsV0FBVzt1QkFBQyxXQUFXO2dCQUdwQixlQUFlO3NCQUZsQixXQUFXO3VCQUFDLHVCQUF1Qjs7c0JBQ25DLEtBQUs7Z0JBS0YsUUFBUTtzQkFEWCxXQUFXO3VCQUFDLGVBQWU7Z0JBTzVCLE9BQU87c0JBRk4sV0FBVzt1QkFBQyxlQUFlOztzQkFDM0IsS0FBSztnQkFHa0MsT0FBTztzQkFBOUMsS0FBSzt1QkFBQyxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRTtnQkFDRSxXQUFXO3NCQUFsRCxLQUFLO3VCQUFDLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixFQUFFO2dCQUNFLFdBQVc7c0JBQWxELEtBQUs7dUJBQUMsRUFBRSxTQUFTLEVBQUUsZ0JBQWdCLEVBQUU7Z0JBQ0UsU0FBUztzQkFBaEQsS0FBSzt1QkFBQyxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRTtnQkFFNUIsVUFBVTtzQkFBbkIsTUFBTTtnQkFFb0UsVUFBVTtzQkFBcEYsWUFBWTt1QkFBQyxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsc0JBQXNCLENBQUMsRUFBRSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENvbXBvbmVudCxcbiAgICBIb3N0QmluZGluZyxcbiAgICBFdmVudEVtaXR0ZXIsXG4gICAgSW5wdXQsXG4gICAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gICAgT3V0cHV0LFxuICAgIE9uSW5pdCxcbiAgICBDb250ZW50Q2hpbGQsXG4gICAgZm9yd2FyZFJlZixcbiAgICBRdWVyeUxpc3QsXG4gICAgYm9vbGVhbkF0dHJpYnV0ZSxcbiAgICBWaWV3RW5jYXBzdWxhdGlvbixcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IEJhc2VTdGF0ZXNEaXJlY3RpdmUgfSBmcm9tICdAZXVpL2NvbXBvbmVudHMvc2hhcmVkJztcbmltcG9ydCB7IEV1aUFsZXJ0VGl0bGVDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvZXVpLWFsZXJ0LXRpdGxlLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICAgIHRlbXBsYXRlVXJsOiAnLi9ldWktYWxlcnQuY29tcG9uZW50Lmh0bWwnLFxuICAgIHNlbGVjdG9yOiAnZGl2W2V1aUFsZXJ0XSwgZXVpLWFsZXJ0JyxcbiAgICBzdHlsZVVybDogJy4vc3R5bGVzL19pbmRleC5zY3NzJyxcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICAgIGhvc3REaXJlY3RpdmVzOiBbXG4gICAgICAgIHtcbiAgICAgICAgICAgIGRpcmVjdGl2ZTogQmFzZVN0YXRlc0RpcmVjdGl2ZSxcbiAgICAgICAgICAgIGlucHV0czogW1xuICAgICAgICAgICAgICAgICdldWlTdWNjZXNzJyxcbiAgICAgICAgICAgICAgICAnZXVpSW5mbycsXG4gICAgICAgICAgICAgICAgJ2V1aVdhcm5pbmcnLFxuICAgICAgICAgICAgICAgICdldWlEYW5nZXInLFxuICAgICAgICAgICAgICAgICdldWlWYXJpYW50JyxcbiAgICAgICAgICAgIF0sXG4gICAgICAgIH0sXG4gICAgXSxcbn0pXG5leHBvcnQgY2xhc3MgRXVpQWxlcnRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICAgIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICAgIHB1YmxpYyBnZXQgY3NzQ2xhc3NlcygpOiBzdHJpbmcge1xuICAgICAgICByZXR1cm4gW1xuICAgICAgICAgICAgdGhpcy5iYXNlU3RhdGVzRGlyZWN0aXZlLmdldENzc0NsYXNzZXMoJ2V1aS1hbGVydCcpLFxuICAgICAgICAgICAgdGhpcy5pc011dGVkID8gJ2V1aS1hbGVydC0tbXV0ZWQnIDogJycsXG4gICAgICAgICAgICB0aGlzLmlzRm9jdXNhYmxlID8gJ2V1aS1hbGVydC0tZm9jdXNhYmxlJyA6ICcnLFxuICAgICAgICAgICAgdGhpcy5pc0Nsb3NlYWJsZSA/ICdldWktYWxlcnQtLWNsb3NlYWJsZScgOiAnJyxcbiAgICAgICAgICAgICF0aGlzLmlzVmlzaWJsZSA/ICdldWktYWxlcnQtLWhpZGRlbicgOiAnJyxcbiAgICAgICAgXVxuICAgICAgICAgICAgLmpvaW4oJyAnKVxuICAgICAgICAgICAgLnRyaW0oKTtcbiAgICB9XG5cbiAgICBASG9zdEJpbmRpbmcoJ2F0dHIucm9sZScpIHJvbGUgPSAnYWxlcnQnO1xuICAgIEBIb3N0QmluZGluZygnYXR0ci5hcmlhLWRlc2NyaWJlZGJ5JylcbiAgICBASW5wdXQoKVxuICAgIGdldCBhcmlhRGVzY3JpYmVkQnkoKTogc3RyaW5nIHtcbiAgICAgICAgcmV0dXJuIGBhbGVydENvbnRlbnQtJHt0aGlzLnVuaXF1ZUlkfWA7XG4gICAgfVxuICAgIEBIb3N0QmluZGluZygnYXR0ci50YWJpbmRleCcpXG4gICAgZ2V0IHRhYmluZGV4KCk6IHN0cmluZyB7XG4gICAgICAgIHJldHVybiB0aGlzLmlzRm9jdXNhYmxlID8gJzAnIDogJy0xJztcbiAgICB9XG5cbiAgICBASG9zdEJpbmRpbmcoJ2F0dHIuZGF0YS1lMmUnKVxuICAgIEBJbnB1dCgpXG4gICAgZTJlQXR0ciA9ICdldWktYWxlcnQnO1xuXG4gICAgQElucHV0KHsgdHJhbnNmb3JtOiBib29sZWFuQXR0cmlidXRlIH0pIGlzTXV0ZWQgPSBmYWxzZTtcbiAgICBASW5wdXQoeyB0cmFuc2Zvcm06IGJvb2xlYW5BdHRyaWJ1dGUgfSkgaXNDbG9zZWFibGUgPSBmYWxzZTtcbiAgICBASW5wdXQoeyB0cmFuc2Zvcm06IGJvb2xlYW5BdHRyaWJ1dGUgfSkgaXNGb2N1c2FibGUgPSBmYWxzZTtcbiAgICBASW5wdXQoeyB0cmFuc2Zvcm06IGJvb2xlYW5BdHRyaWJ1dGUgfSkgaXNWaXNpYmxlID0gdHJ1ZTtcblxuICAgIEBPdXRwdXQoKSBjbG9zZUFsZXJ0ID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gICAgQENvbnRlbnRDaGlsZChmb3J3YXJkUmVmKCgpID0+IEV1aUFsZXJ0VGl0bGVDb21wb25lbnQpLCB7IHN0YXRpYzogZmFsc2UgfSkgYWxlcnRUaXRsZTogUXVlcnlMaXN0PEV1aUFsZXJ0VGl0bGVDb21wb25lbnQ+O1xuXG4gICAgYWxlcnRJY29uVHlwZTogc3RyaW5nO1xuICAgIGFsZXJ0SWNvbkZpbGxDb2xvcjogc3RyaW5nO1xuXG4gICAgcHJpdmF0ZSB1bmlxdWVJZDogc3RyaW5nO1xuXG4gICAgY29uc3RydWN0b3IocHVibGljIGJhc2VTdGF0ZXNEaXJlY3RpdmU6IEJhc2VTdGF0ZXNEaXJlY3RpdmUpIHt9XG5cbiAgICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICAgICAgaWYgKCF0aGlzLmJhc2VTdGF0ZXNEaXJlY3RpdmUuZXVpVmFyaWFudCkge1xuICAgICAgICAgICAgdGhpcy5iYXNlU3RhdGVzRGlyZWN0aXZlLmV1aUluZm8gPSB0cnVlO1xuICAgICAgICB9XG4gICAgICAgIHRoaXMudW5pcXVlSWQgPSBjcnlwdG8ucmFuZG9tVVVJRCgpO1xuICAgIH1cblxuICAgIG9uQ2xvc2VDbGljaygpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5pc1Zpc2libGUgPSBmYWxzZTtcbiAgICAgICAgdGhpcy5jbG9zZUFsZXJ0LmVtaXQoZmFsc2UpO1xuICAgIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJldWktYWxlcnQtd3JhcHBlclwiPlxuICAgIEBpZiAoYWxlcnRUaXRsZSkge1xuICAgICAgICA8ZGl2IGNsYXNzPVwiZXVpLWFsZXJ0LWNvbnRhaW5lclwiPlxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImV1aS1hbGVydC10aXRsZS13cmFwcGVyXCI+XG4gICAgICAgICAgICAgICAgQGlmICghaXNNdXRlZCkge1xuICAgICAgICAgICAgICAgICAgICA8bmctY29udGVudCAqbmdUZW1wbGF0ZU91dGxldD1cImljb25cIi8+XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImV1aS1hbGVydC10aXRsZVwiLz5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgPG5nLWNvbnRlbnQgKm5nVGVtcGxhdGVPdXRsZXQ9XCJib2R5XCIvPlxuICAgICAgICA8L2Rpdj5cblxuICAgIH0gQGVsc2Uge1xuICAgICAgICBAaWYgKCFpc011dGVkKSB7XG4gICAgICAgICAgICA8bmctY29udGVudCAqbmdUZW1wbGF0ZU91dGxldD1cImljb25cIi8+XG4gICAgICAgIH1cbiAgICAgICAgPG5nLWNvbnRlbnQgKm5nVGVtcGxhdGVPdXRsZXQ9XCJib2R5XCIvPlxuICAgIH1cblxuICAgIDxuZy10ZW1wbGF0ZSAjaWNvbj5cbiAgICAgICAgPGV1aS1pY29uLXN0YXRlIFtldWlWYXJpYW50XT1cImJhc2VTdGF0ZXNEaXJlY3RpdmUuZXVpVmFyaWFudFwiIGNsYXNzPVwiZXVpLWFsZXJ0LWljb25cIi8+XG4gICAgPC9uZy10ZW1wbGF0ZT5cblxuICAgIDxuZy10ZW1wbGF0ZSAjYm9keT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImV1aS1hbGVydC1jb250ZW50XCI+XG4gICAgICAgICAgICA8bmctY29udGVudC8+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvbmctdGVtcGxhdGU+XG5cbiAgICBAaWYgKGlzQ2xvc2VhYmxlKSB7XG4gICAgICAgIDxldWktaWNvbi1idXR0b24gY2xhc3M9XCJldWktYWxlcnQtY2xvc2VcIlxuICAgICAgICAgICAgaWNvbj1cImNsb3NlOm91dGxpbmVcIlxuICAgICAgICAgICAgZXVpUm91bmRlZFxuICAgICAgICAgICAgKGJ1dHRvbkNsaWNrKT1cIm9uQ2xvc2VDbGljaygpXCJcbiAgICAgICAgICAgIGZpbGxDb2xvcj1cIm5ldXRyYWwtbGlnaHRcIi8+XG4gICAgfVxuPC9kaXY+XG4iXX0=
|
|
@@ -56,7 +56,7 @@ export class EuiButtonComponent {
|
|
|
56
56
|
this.buttonClick.emit(this);
|
|
57
57
|
}
|
|
58
58
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiButtonComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
59
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: { e2eAttr: "e2eAttr", id: "id", euiBasicButton: ["euiBasicButton", "euiBasicButton", booleanAttribute], euiButtonCall: ["euiButtonCall", "euiButtonCall", booleanAttribute], euiBlockButton: ["euiBlockButton", "euiBlockButton", booleanAttribute], euiIconButton: ["euiIconButton", "euiIconButton", booleanAttribute], euiLineWrap: ["euiLineWrap", "euiLineWrap", booleanAttribute], isChecked: "isChecked", euiDisabled: "euiDisabled" }, outputs: { buttonClick: "buttonClick" }, host: { listeners: { "click": "onClick()" }, properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr", "attr.id": "this.id" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiBranding", "euiBranding", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeVariant", "euiSizeVariant", "euiOutline", "euiOutline", "euiRounded", "euiRounded", "euiResponsive", "euiResponsive"] }], ngImport: i0, template: "<span class=\"eui-button__container\">\n <ng-content></ng-content>\n</span>\n", styles: [".eui-button{--_color: var(--eui-button-color, var(--eui-c-neutral));--_bg-color: var(--eui-button-bg-color, var(--eui-c-neutral-bg-light));--_on-bg-color: var(--eui-button-on-bg-color, var(--eui-c-neutral));--_border-color: var(--eui-button-border-color, var(--eui-c-neutral-lighter));--_hover-color: var(--eui-button-hover-color, var(--eui-c-neutral-bg));--_on-hover-color: var(--eui-button-on-hover-color, var(--eui-c-neutral-bg-contrast));--_basic-bg-color: var(--eui-button-basic-bg-color, transparent);--_basic-hover-color: var(--eui-button-basic-hover-color, var(--eui-c-neutral-bg-light));--_on-basic-hover-color: var(--eui-button-on-basic-hover-color, var(--eui-c-neutral-bg-light-contrast));--_outline-color: var(--eui-button-outline-color, var(--eui-c-neutral));--_outline-hover-color: var(--eui-button-outline-hover-color, var(--eui-c-neutral-bg));--_on-outline-hover-color: var(--eui-button-on-outline-hover-color, var(--eui-c-neutral-bg-contrast))}.eui-button{align-items:center;background-image:none;border:var(--eui-bw-none);border-radius:var(--eui-br-m);box-shadow:var(--eui-sh-ecl-2);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-s-3xl) + var(--eui-s-2xs));min-width:calc(var(--eui-s-3xl) + var(--eui-s-2xs));outline:none;padding:calc(var(--eui-s-xs) - 1px) var(--eui-s-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:var(--eui-f-m)}.eui-button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-1px!important;transition:none}.eui-button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative;gap:var(--eui-s-xs)}.eui-button--icon-only{padding:inherit var(--eui-s-2xs)}.eui-button--size-s{font:var(--eui-f-m);min-height:var(--eui-s-l);min-width:var(--eui-s-l);padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-s)}.eui-button--size-s.eui-button--icon-only{padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-2xs)}.eui-button--size-s .eui-icon-svg{height:var(--eui-is-s);width:var(--eui-is-s)}.eui-button--size-m{font:var(--eui-f-m)}.eui-button--size-m .eui-icon-svg{height:var(--eui-is-m);width:var(--eui-is-m)}.eui-button--primary{--_color: var(--eui-c-primary);--_bg-color: var(--eui-c-primary);--_on-bg-color: var(--eui-c-primary-contrast);--_border-color: var(--eui-c-primary-dark);--_hover-color: var(--eui-c-primary-darker);--_on-hover-color: var(--eui-c-primary-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-primary-bg);--_on-basic-hover-color: var(--eui-c-primary-bg-contrast);--_outline-color: var(--eui-c-primary);--_outline-hover-color: var(--eui-c-primary-bg);--_on-outline-hover-color: var(--eui-c-primary-bg-contrast)}.eui-button--branding{--_color: var(--eui-c-branding);--_bg-color: var(--eui-c-branding);--_on-bg-color: var(--eui-c-branding-contrast);--_border-color: var(--eui-c-branding);--_hover-color: var(--eui-c-branding-light);--_on-hover-color: var(--eui-c-branding-light-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-branding-light);--_on-basic-hover-color: var(--eui-c-branding-light-contrast);--_outline-color: var(--eui-c-branding);--_outline-hover-color: var(--eui-c-branding-light);--_on-outline-hover-color: var(--eui-c-branding-light-contrast)}.eui-button--info{--_color: var(--eui-c-info);--_bg-color: var(--eui-c-info);--_on-bg-color: var(--eui-c-info-contrast);--_border-color: var(--eui-c-info-dark);--_hover-color: var(--eui-c-info-darker);--_on-hover-color: var(--eui-c-info-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-info-bg);--_on-basic-hover-color: var(--eui-c-info-bg-contrast);--_outline-color: var(--eui-c-info);--_outline-hover-color: var(--eui-c-info-bg);--_on-outline-hover-color: var(--eui-c-info-bg-contrast)}.eui-button--success{--_color: var(--eui-c-success-dark);--_bg-color: var(--eui-c-success-dark);--_on-bg-color: var(--eui-c-success-contrast);--_border-color: var(--eui-c-success-dark);--_hover-color: var(--eui-c-success-darker);--_on-hover-color: var(--eui-c-success-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-success-bg);--_on-basic-hover-color: var(--eui-c-success-bg-contrast);--_outline-color: var(--eui-c-success-dark);--_outline-hover-color: var(--eui-c-success-bg);--_on-outline-hover-color: var(--eui-c-success-bg-contrast)}.eui-button--warning{--_color: var(--eui-c-warning);--_bg-color: var(--eui-c-warning);--_on-bg-color: var(--eui-c-warning-contrast);--_border-color: var(--eui-c-warning-dark);--_hover-color: var(--eui-c-warning-dark);--_on-hover-color: var(--eui-c-warning-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-warning-bg);--_on-basic-hover-color: var(--eui-c-warning-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-warning-bg);--_on-outline-hover-color: var(--eui-c-warning-bg-contrast)}.eui-button--danger{--_color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-dark);--_on-bg-color: var(--eui-c-danger-contrast);--_border-color: var(--eui-c-danger-dark);--_hover-color: var(--eui-c-danger-darker);--_on-hover-color: var(--eui-c-danger-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-danger-bg);--_on-basic-hover-color: var(--eui-c-danger-bg-contrast);--_outline-color: var(--eui-c-danger-dark);--_outline-hover-color: var(--eui-c-danger-bg);--_on-outline-hover-color: var(--eui-c-danger-bg-contrast)}.eui-button--accent{--_color: var(--eui-c-accent-dark);--_bg-color: var(--eui-c-accent-light);--_on-bg-color: var(--eui-c-accent-light-contrast);--_border-color: var(--eui-c-accent-darker);--_hover-color: var(--eui-c-accent-dark);--_on-hover-color: var(--eui-c-accent-dark-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-accent-bg);--_on-basic-hover-color: var(--eui-c-accent-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-accent-bg);--_on-outline-hover-color: var(--eui-c-accent-bg-contrast)}.eui-button{background-color:var(--_bg-color);color:var(--_on-bg-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button:hover{background-color:var(--_hover-color);color:var(--_on-hover-color)}.eui-button:hover .eui-label,.eui-button .eui-label{color:var(--_on-bg-color)}.eui-button--basic{border:var(--eui-bw-none);box-shadow:none;background-color:var(--_basic-bg-color);color:var(--_color)}.eui-button--basic .eui-label{color:var(--_color)}.eui-button--outline{background-color:var(--eui-c-white);color:var(--_outline-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button--outline .eui-label{color:var(--_outline-color)}.eui-button--basic:hover{background-color:var(--_basic-hover-color);color:var(--_on-basic-hover-color)}.eui-button--basic:hover .eui-label{color:var(--_on-basic-hover-color)}.eui-button--outline:hover{background-color:var(--_outline-hover-color);color:var(--_on-outline-hover-color)}.eui-button--outline:hover .eui-label{color:var(--_on-outline-hover-color)}.eui-button--rounded{border-radius:var(--eui-br-max)}.eui-button--rounded:focus:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button--rounded:focus-visible:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button--responsive{display:grid!important;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--block{width:100%}.eui-button--line-wrap{padding:var(--eui-s-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-c-bg);border-color:transparent;border-radius:0 0 var(--eui-s-xs) var(--eui-s-xs);min-height:var(--eui-s-m);padding:0 var(--eui-s-xl);box-shadow:var(--eui-sh-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-sh-3)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button-fixed{bottom:var(--eui-s-3xl);position:fixed;right:var(--eui-s-xl);z-index:calc(var(--eui-zi-btn-floating) + 1)}.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-floating{align-items:center;border-radius:var(--eui-br-max);display:inline-flex;overflow:hidden;padding:var(--eui-s-xs);position:relative;transform:translateY(35%);vertical-align:middle;height:var(--eui-s-4xl);width:var(--eui-s-4xl);z-index:1;box-shadow:var(--eui-sh-6);background-color:var(--_bg-color);color:var(--_on-bg-color)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-sh-3)}.eui-button-floating:before{border-radius:var(--eui-br-none)}.eui-button__expand-trigger{border-top:1px solid var(--eui-c-neutral-lightest);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-s-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-sh-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-s-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
59
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: { e2eAttr: "e2eAttr", id: "id", euiBasicButton: ["euiBasicButton", "euiBasicButton", booleanAttribute], euiButtonCall: ["euiButtonCall", "euiButtonCall", booleanAttribute], euiBlockButton: ["euiBlockButton", "euiBlockButton", booleanAttribute], euiIconButton: ["euiIconButton", "euiIconButton", booleanAttribute], euiLineWrap: ["euiLineWrap", "euiLineWrap", booleanAttribute], isChecked: "isChecked", euiDisabled: "euiDisabled" }, outputs: { buttonClick: "buttonClick" }, host: { listeners: { "click": "onClick()" }, properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr", "attr.id": "this.id" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiBranding", "euiBranding", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeVariant", "euiSizeVariant", "euiOutline", "euiOutline", "euiRounded", "euiRounded", "euiResponsive", "euiResponsive"] }], ngImport: i0, template: "<span class=\"eui-button__container\">\n <ng-content></ng-content>\n</span>\n", styles: [".eui-button{--_color: var(--eui-button-color, var(--eui-c-neutral));--_bg-color: var(--eui-button-bg-color, var(--eui-c-neutral-bg-light));--_on-bg-color: var(--eui-button-on-bg-color, var(--eui-c-neutral));--_border-color: var(--eui-button-border-color, var(--eui-c-neutral-lighter));--_hover-color: var(--eui-button-hover-color, var(--eui-c-neutral-bg));--_on-hover-color: var(--eui-button-on-hover-color, var(--eui-c-neutral-bg-contrast));--_basic-bg-color: var(--eui-button-basic-bg-color, transparent);--_basic-hover-color: var(--eui-button-basic-hover-color, var(--eui-c-neutral-bg-light));--_on-basic-hover-color: var(--eui-button-on-basic-hover-color, var(--eui-c-neutral-bg-light-contrast));--_outline-color: var(--eui-button-outline-color, var(--eui-c-neutral));--_outline-hover-color: var(--eui-button-outline-hover-color, var(--eui-c-neutral-bg));--_on-outline-hover-color: var(--eui-button-on-outline-hover-color, var(--eui-c-neutral-bg-contrast))}.eui-button{align-items:center;background-image:none;border:var(--eui-bw-none);border-radius:var(--eui-br-m);box-shadow:var(--eui-sh-ecl-2);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-s-3xl) + var(--eui-s-2xs));min-width:calc(var(--eui-s-3xl) + var(--eui-s-2xs));outline:none;padding:calc(var(--eui-s-xs) - 1px) var(--eui-s-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:var(--eui-f-m)}.eui-button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-1px!important;transition:none}.eui-button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative;gap:var(--eui-s-xs)}.eui-button--icon-only{padding:inherit var(--eui-s-2xs)}.eui-button--size-s{font:var(--eui-f-s);min-height:var(--eui-s-l);min-width:var(--eui-s-l);padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-s)}.eui-button--size-s.eui-button--icon-only{padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-2xs)}.eui-button--size-s .eui-icon-svg{height:var(--eui-is-s);width:var(--eui-is-s)}.eui-button--size-m{font:var(--eui-f-m)}.eui-button--size-m .eui-icon-svg{height:var(--eui-is-m);width:var(--eui-is-m)}.eui-button--primary{--_color: var(--eui-c-primary);--_bg-color: var(--eui-c-primary);--_on-bg-color: var(--eui-c-primary-contrast);--_border-color: var(--eui-c-primary-dark);--_hover-color: var(--eui-c-primary-darker);--_on-hover-color: var(--eui-c-primary-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-primary-bg);--_on-basic-hover-color: var(--eui-c-primary-bg-contrast);--_outline-color: var(--eui-c-primary);--_outline-hover-color: var(--eui-c-primary-bg);--_on-outline-hover-color: var(--eui-c-primary-bg-contrast)}.eui-button--branding{--_color: var(--eui-c-branding);--_bg-color: var(--eui-c-branding);--_on-bg-color: var(--eui-c-branding-contrast);--_border-color: var(--eui-c-branding);--_hover-color: var(--eui-c-branding-light);--_on-hover-color: var(--eui-c-branding-light-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-branding-light);--_on-basic-hover-color: var(--eui-c-branding-light-contrast);--_outline-color: var(--eui-c-branding);--_outline-hover-color: var(--eui-c-branding-light);--_on-outline-hover-color: var(--eui-c-branding-light-contrast)}.eui-button--info{--_color: var(--eui-c-info);--_bg-color: var(--eui-c-info);--_on-bg-color: var(--eui-c-info-contrast);--_border-color: var(--eui-c-info-dark);--_hover-color: var(--eui-c-info-darker);--_on-hover-color: var(--eui-c-info-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-info-bg);--_on-basic-hover-color: var(--eui-c-info-bg-contrast);--_outline-color: var(--eui-c-info);--_outline-hover-color: var(--eui-c-info-bg);--_on-outline-hover-color: var(--eui-c-info-bg-contrast)}.eui-button--success{--_color: var(--eui-c-success-dark);--_bg-color: var(--eui-c-success-dark);--_on-bg-color: var(--eui-c-success-contrast);--_border-color: var(--eui-c-success-dark);--_hover-color: var(--eui-c-success-darker);--_on-hover-color: var(--eui-c-success-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-success-bg);--_on-basic-hover-color: var(--eui-c-success-bg-contrast);--_outline-color: var(--eui-c-success-dark);--_outline-hover-color: var(--eui-c-success-bg);--_on-outline-hover-color: var(--eui-c-success-bg-contrast)}.eui-button--warning{--_color: var(--eui-c-warning);--_bg-color: var(--eui-c-warning);--_on-bg-color: var(--eui-c-warning-contrast);--_border-color: var(--eui-c-warning-dark);--_hover-color: var(--eui-c-warning-dark);--_on-hover-color: var(--eui-c-warning-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-warning-bg);--_on-basic-hover-color: var(--eui-c-warning-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-warning-bg);--_on-outline-hover-color: var(--eui-c-warning-bg-contrast)}.eui-button--danger{--_color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-dark);--_on-bg-color: var(--eui-c-danger-contrast);--_border-color: var(--eui-c-danger-dark);--_hover-color: var(--eui-c-danger-darker);--_on-hover-color: var(--eui-c-danger-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-danger-bg);--_on-basic-hover-color: var(--eui-c-danger-bg-contrast);--_outline-color: var(--eui-c-danger-dark);--_outline-hover-color: var(--eui-c-danger-bg);--_on-outline-hover-color: var(--eui-c-danger-bg-contrast)}.eui-button--accent{--_color: var(--eui-c-accent-dark);--_bg-color: var(--eui-c-accent-light);--_on-bg-color: var(--eui-c-accent-light-contrast);--_border-color: var(--eui-c-accent-darker);--_hover-color: var(--eui-c-accent-dark);--_on-hover-color: var(--eui-c-accent-dark-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-accent-bg);--_on-basic-hover-color: var(--eui-c-accent-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-accent-bg);--_on-outline-hover-color: var(--eui-c-accent-bg-contrast)}.eui-button{background-color:var(--_bg-color);color:var(--_on-bg-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button:hover{background-color:var(--_hover-color);color:var(--_on-hover-color)}.eui-button:hover .eui-label,.eui-button .eui-label{color:var(--_on-bg-color)}.eui-button--basic{border:var(--eui-bw-none);box-shadow:none;background-color:var(--_basic-bg-color);color:var(--_color)}.eui-button--basic .eui-label{color:var(--_color)}.eui-button--outline{background-color:var(--eui-c-white);color:var(--_outline-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button--outline .eui-label{color:var(--_outline-color)}.eui-button--basic:hover{background-color:var(--_basic-hover-color);color:var(--_on-basic-hover-color)}.eui-button--basic:hover .eui-label{color:var(--_on-basic-hover-color)}.eui-button--outline:hover{background-color:var(--_outline-hover-color);color:var(--_on-outline-hover-color)}.eui-button--outline:hover .eui-label{color:var(--_on-outline-hover-color)}.eui-button--rounded{border-radius:var(--eui-br-max)}.eui-button--rounded:focus:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button--rounded:focus-visible:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button--responsive{display:grid!important;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--block{width:100%}.eui-button--line-wrap{padding:var(--eui-s-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-c-bg);border-color:transparent;border-radius:0 0 var(--eui-s-xs) var(--eui-s-xs);min-height:var(--eui-s-m);padding:0 var(--eui-s-xl);box-shadow:var(--eui-sh-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-sh-3)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button-fixed{bottom:var(--eui-s-3xl);position:fixed;right:var(--eui-s-xl);z-index:calc(var(--eui-zi-btn-floating) + 1)}.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-floating{align-items:center;border-radius:var(--eui-br-max);display:inline-flex;overflow:hidden;padding:var(--eui-s-xs);position:relative;transform:translateY(35%);vertical-align:middle;height:var(--eui-s-4xl);width:var(--eui-s-4xl);z-index:1;box-shadow:var(--eui-sh-6);background-color:var(--_bg-color);color:var(--_on-bg-color)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-sh-3)}.eui-button-floating:before{border-radius:var(--eui-br-none)}.eui-button__expand-trigger{border-top:1px solid var(--eui-c-neutral-lightest);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-s-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-sh-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-s-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
60
60
|
}
|
|
61
61
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiButtonComponent, decorators: [{
|
|
62
62
|
type: Component,
|
|
@@ -81,7 +81,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
|
|
|
81
81
|
'euiResponsive',
|
|
82
82
|
],
|
|
83
83
|
},
|
|
84
|
-
], template: "<span class=\"eui-button__container\">\n <ng-content></ng-content>\n</span>\n", styles: [".eui-button{--_color: var(--eui-button-color, var(--eui-c-neutral));--_bg-color: var(--eui-button-bg-color, var(--eui-c-neutral-bg-light));--_on-bg-color: var(--eui-button-on-bg-color, var(--eui-c-neutral));--_border-color: var(--eui-button-border-color, var(--eui-c-neutral-lighter));--_hover-color: var(--eui-button-hover-color, var(--eui-c-neutral-bg));--_on-hover-color: var(--eui-button-on-hover-color, var(--eui-c-neutral-bg-contrast));--_basic-bg-color: var(--eui-button-basic-bg-color, transparent);--_basic-hover-color: var(--eui-button-basic-hover-color, var(--eui-c-neutral-bg-light));--_on-basic-hover-color: var(--eui-button-on-basic-hover-color, var(--eui-c-neutral-bg-light-contrast));--_outline-color: var(--eui-button-outline-color, var(--eui-c-neutral));--_outline-hover-color: var(--eui-button-outline-hover-color, var(--eui-c-neutral-bg));--_on-outline-hover-color: var(--eui-button-on-outline-hover-color, var(--eui-c-neutral-bg-contrast))}.eui-button{align-items:center;background-image:none;border:var(--eui-bw-none);border-radius:var(--eui-br-m);box-shadow:var(--eui-sh-ecl-2);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-s-3xl) + var(--eui-s-2xs));min-width:calc(var(--eui-s-3xl) + var(--eui-s-2xs));outline:none;padding:calc(var(--eui-s-xs) - 1px) var(--eui-s-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:var(--eui-f-m)}.eui-button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-1px!important;transition:none}.eui-button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative;gap:var(--eui-s-xs)}.eui-button--icon-only{padding:inherit var(--eui-s-2xs)}.eui-button--size-s{font:var(--eui-f-m);min-height:var(--eui-s-l);min-width:var(--eui-s-l);padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-s)}.eui-button--size-s.eui-button--icon-only{padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-2xs)}.eui-button--size-s .eui-icon-svg{height:var(--eui-is-s);width:var(--eui-is-s)}.eui-button--size-m{font:var(--eui-f-m)}.eui-button--size-m .eui-icon-svg{height:var(--eui-is-m);width:var(--eui-is-m)}.eui-button--primary{--_color: var(--eui-c-primary);--_bg-color: var(--eui-c-primary);--_on-bg-color: var(--eui-c-primary-contrast);--_border-color: var(--eui-c-primary-dark);--_hover-color: var(--eui-c-primary-darker);--_on-hover-color: var(--eui-c-primary-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-primary-bg);--_on-basic-hover-color: var(--eui-c-primary-bg-contrast);--_outline-color: var(--eui-c-primary);--_outline-hover-color: var(--eui-c-primary-bg);--_on-outline-hover-color: var(--eui-c-primary-bg-contrast)}.eui-button--branding{--_color: var(--eui-c-branding);--_bg-color: var(--eui-c-branding);--_on-bg-color: var(--eui-c-branding-contrast);--_border-color: var(--eui-c-branding);--_hover-color: var(--eui-c-branding-light);--_on-hover-color: var(--eui-c-branding-light-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-branding-light);--_on-basic-hover-color: var(--eui-c-branding-light-contrast);--_outline-color: var(--eui-c-branding);--_outline-hover-color: var(--eui-c-branding-light);--_on-outline-hover-color: var(--eui-c-branding-light-contrast)}.eui-button--info{--_color: var(--eui-c-info);--_bg-color: var(--eui-c-info);--_on-bg-color: var(--eui-c-info-contrast);--_border-color: var(--eui-c-info-dark);--_hover-color: var(--eui-c-info-darker);--_on-hover-color: var(--eui-c-info-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-info-bg);--_on-basic-hover-color: var(--eui-c-info-bg-contrast);--_outline-color: var(--eui-c-info);--_outline-hover-color: var(--eui-c-info-bg);--_on-outline-hover-color: var(--eui-c-info-bg-contrast)}.eui-button--success{--_color: var(--eui-c-success-dark);--_bg-color: var(--eui-c-success-dark);--_on-bg-color: var(--eui-c-success-contrast);--_border-color: var(--eui-c-success-dark);--_hover-color: var(--eui-c-success-darker);--_on-hover-color: var(--eui-c-success-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-success-bg);--_on-basic-hover-color: var(--eui-c-success-bg-contrast);--_outline-color: var(--eui-c-success-dark);--_outline-hover-color: var(--eui-c-success-bg);--_on-outline-hover-color: var(--eui-c-success-bg-contrast)}.eui-button--warning{--_color: var(--eui-c-warning);--_bg-color: var(--eui-c-warning);--_on-bg-color: var(--eui-c-warning-contrast);--_border-color: var(--eui-c-warning-dark);--_hover-color: var(--eui-c-warning-dark);--_on-hover-color: var(--eui-c-warning-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-warning-bg);--_on-basic-hover-color: var(--eui-c-warning-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-warning-bg);--_on-outline-hover-color: var(--eui-c-warning-bg-contrast)}.eui-button--danger{--_color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-dark);--_on-bg-color: var(--eui-c-danger-contrast);--_border-color: var(--eui-c-danger-dark);--_hover-color: var(--eui-c-danger-darker);--_on-hover-color: var(--eui-c-danger-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-danger-bg);--_on-basic-hover-color: var(--eui-c-danger-bg-contrast);--_outline-color: var(--eui-c-danger-dark);--_outline-hover-color: var(--eui-c-danger-bg);--_on-outline-hover-color: var(--eui-c-danger-bg-contrast)}.eui-button--accent{--_color: var(--eui-c-accent-dark);--_bg-color: var(--eui-c-accent-light);--_on-bg-color: var(--eui-c-accent-light-contrast);--_border-color: var(--eui-c-accent-darker);--_hover-color: var(--eui-c-accent-dark);--_on-hover-color: var(--eui-c-accent-dark-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-accent-bg);--_on-basic-hover-color: var(--eui-c-accent-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-accent-bg);--_on-outline-hover-color: var(--eui-c-accent-bg-contrast)}.eui-button{background-color:var(--_bg-color);color:var(--_on-bg-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button:hover{background-color:var(--_hover-color);color:var(--_on-hover-color)}.eui-button:hover .eui-label,.eui-button .eui-label{color:var(--_on-bg-color)}.eui-button--basic{border:var(--eui-bw-none);box-shadow:none;background-color:var(--_basic-bg-color);color:var(--_color)}.eui-button--basic .eui-label{color:var(--_color)}.eui-button--outline{background-color:var(--eui-c-white);color:var(--_outline-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button--outline .eui-label{color:var(--_outline-color)}.eui-button--basic:hover{background-color:var(--_basic-hover-color);color:var(--_on-basic-hover-color)}.eui-button--basic:hover .eui-label{color:var(--_on-basic-hover-color)}.eui-button--outline:hover{background-color:var(--_outline-hover-color);color:var(--_on-outline-hover-color)}.eui-button--outline:hover .eui-label{color:var(--_on-outline-hover-color)}.eui-button--rounded{border-radius:var(--eui-br-max)}.eui-button--rounded:focus:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button--rounded:focus-visible:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button--responsive{display:grid!important;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--block{width:100%}.eui-button--line-wrap{padding:var(--eui-s-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-c-bg);border-color:transparent;border-radius:0 0 var(--eui-s-xs) var(--eui-s-xs);min-height:var(--eui-s-m);padding:0 var(--eui-s-xl);box-shadow:var(--eui-sh-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-sh-3)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button-fixed{bottom:var(--eui-s-3xl);position:fixed;right:var(--eui-s-xl);z-index:calc(var(--eui-zi-btn-floating) + 1)}.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-floating{align-items:center;border-radius:var(--eui-br-max);display:inline-flex;overflow:hidden;padding:var(--eui-s-xs);position:relative;transform:translateY(35%);vertical-align:middle;height:var(--eui-s-4xl);width:var(--eui-s-4xl);z-index:1;box-shadow:var(--eui-sh-6);background-color:var(--_bg-color);color:var(--_on-bg-color)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-sh-3)}.eui-button-floating:before{border-radius:var(--eui-br-none)}.eui-button__expand-trigger{border-top:1px solid var(--eui-c-neutral-lightest);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-s-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-sh-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-s-s)}\n"] }]
|
|
84
|
+
], template: "<span class=\"eui-button__container\">\n <ng-content></ng-content>\n</span>\n", styles: [".eui-button{--_color: var(--eui-button-color, var(--eui-c-neutral));--_bg-color: var(--eui-button-bg-color, var(--eui-c-neutral-bg-light));--_on-bg-color: var(--eui-button-on-bg-color, var(--eui-c-neutral));--_border-color: var(--eui-button-border-color, var(--eui-c-neutral-lighter));--_hover-color: var(--eui-button-hover-color, var(--eui-c-neutral-bg));--_on-hover-color: var(--eui-button-on-hover-color, var(--eui-c-neutral-bg-contrast));--_basic-bg-color: var(--eui-button-basic-bg-color, transparent);--_basic-hover-color: var(--eui-button-basic-hover-color, var(--eui-c-neutral-bg-light));--_on-basic-hover-color: var(--eui-button-on-basic-hover-color, var(--eui-c-neutral-bg-light-contrast));--_outline-color: var(--eui-button-outline-color, var(--eui-c-neutral));--_outline-hover-color: var(--eui-button-outline-hover-color, var(--eui-c-neutral-bg));--_on-outline-hover-color: var(--eui-button-on-outline-hover-color, var(--eui-c-neutral-bg-contrast))}.eui-button{align-items:center;background-image:none;border:var(--eui-bw-none);border-radius:var(--eui-br-m);box-shadow:var(--eui-sh-ecl-2);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-s-3xl) + var(--eui-s-2xs));min-width:calc(var(--eui-s-3xl) + var(--eui-s-2xs));outline:none;padding:calc(var(--eui-s-xs) - 1px) var(--eui-s-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:var(--eui-f-m)}.eui-button:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-1px!important;transition:none}.eui-button:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-1px!important;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative;gap:var(--eui-s-xs)}.eui-button--icon-only{padding:inherit var(--eui-s-2xs)}.eui-button--size-s{font:var(--eui-f-s);min-height:var(--eui-s-l);min-width:var(--eui-s-l);padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-s)}.eui-button--size-s.eui-button--icon-only{padding:calc(var(--eui-s-xs) - 3px) var(--eui-s-2xs)}.eui-button--size-s .eui-icon-svg{height:var(--eui-is-s);width:var(--eui-is-s)}.eui-button--size-m{font:var(--eui-f-m)}.eui-button--size-m .eui-icon-svg{height:var(--eui-is-m);width:var(--eui-is-m)}.eui-button--primary{--_color: var(--eui-c-primary);--_bg-color: var(--eui-c-primary);--_on-bg-color: var(--eui-c-primary-contrast);--_border-color: var(--eui-c-primary-dark);--_hover-color: var(--eui-c-primary-darker);--_on-hover-color: var(--eui-c-primary-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-primary-bg);--_on-basic-hover-color: var(--eui-c-primary-bg-contrast);--_outline-color: var(--eui-c-primary);--_outline-hover-color: var(--eui-c-primary-bg);--_on-outline-hover-color: var(--eui-c-primary-bg-contrast)}.eui-button--branding{--_color: var(--eui-c-branding);--_bg-color: var(--eui-c-branding);--_on-bg-color: var(--eui-c-branding-contrast);--_border-color: var(--eui-c-branding);--_hover-color: var(--eui-c-branding-light);--_on-hover-color: var(--eui-c-branding-light-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-branding-light);--_on-basic-hover-color: var(--eui-c-branding-light-contrast);--_outline-color: var(--eui-c-branding);--_outline-hover-color: var(--eui-c-branding-light);--_on-outline-hover-color: var(--eui-c-branding-light-contrast)}.eui-button--info{--_color: var(--eui-c-info);--_bg-color: var(--eui-c-info);--_on-bg-color: var(--eui-c-info-contrast);--_border-color: var(--eui-c-info-dark);--_hover-color: var(--eui-c-info-darker);--_on-hover-color: var(--eui-c-info-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-info-bg);--_on-basic-hover-color: var(--eui-c-info-bg-contrast);--_outline-color: var(--eui-c-info);--_outline-hover-color: var(--eui-c-info-bg);--_on-outline-hover-color: var(--eui-c-info-bg-contrast)}.eui-button--success{--_color: var(--eui-c-success-dark);--_bg-color: var(--eui-c-success-dark);--_on-bg-color: var(--eui-c-success-contrast);--_border-color: var(--eui-c-success-dark);--_hover-color: var(--eui-c-success-darker);--_on-hover-color: var(--eui-c-success-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-success-bg);--_on-basic-hover-color: var(--eui-c-success-bg-contrast);--_outline-color: var(--eui-c-success-dark);--_outline-hover-color: var(--eui-c-success-bg);--_on-outline-hover-color: var(--eui-c-success-bg-contrast)}.eui-button--warning{--_color: var(--eui-c-warning);--_bg-color: var(--eui-c-warning);--_on-bg-color: var(--eui-c-warning-contrast);--_border-color: var(--eui-c-warning-dark);--_hover-color: var(--eui-c-warning-dark);--_on-hover-color: var(--eui-c-warning-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-warning-bg);--_on-basic-hover-color: var(--eui-c-warning-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-warning-bg);--_on-outline-hover-color: var(--eui-c-warning-bg-contrast)}.eui-button--danger{--_color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-dark);--_on-bg-color: var(--eui-c-danger-contrast);--_border-color: var(--eui-c-danger-dark);--_hover-color: var(--eui-c-danger-darker);--_on-hover-color: var(--eui-c-danger-darker-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-danger-bg);--_on-basic-hover-color: var(--eui-c-danger-bg-contrast);--_outline-color: var(--eui-c-danger-dark);--_outline-hover-color: var(--eui-c-danger-bg);--_on-outline-hover-color: var(--eui-c-danger-bg-contrast)}.eui-button--accent{--_color: var(--eui-c-accent-dark);--_bg-color: var(--eui-c-accent-light);--_on-bg-color: var(--eui-c-accent-light-contrast);--_border-color: var(--eui-c-accent-darker);--_hover-color: var(--eui-c-accent-dark);--_on-hover-color: var(--eui-c-accent-dark-contrast);--_basic-bg-color: transparent;--_basic-hover-color: var(--eui-c-accent-bg);--_on-basic-hover-color: var(--eui-c-accent-bg-contrast);--_outline-color: var(--eui-c-neutral);--_outline-hover-color: var(--eui-c-accent-bg);--_on-outline-hover-color: var(--eui-c-accent-bg-contrast)}.eui-button{background-color:var(--_bg-color);color:var(--_on-bg-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button:hover{background-color:var(--_hover-color);color:var(--_on-hover-color)}.eui-button:hover .eui-label,.eui-button .eui-label{color:var(--_on-bg-color)}.eui-button--basic{border:var(--eui-bw-none);box-shadow:none;background-color:var(--_basic-bg-color);color:var(--_color)}.eui-button--basic .eui-label{color:var(--_color)}.eui-button--outline{background-color:var(--eui-c-white);color:var(--_outline-color);border:var(--eui-bw-xs) solid var(--_border-color)}.eui-button--outline .eui-label{color:var(--_outline-color)}.eui-button--basic:hover{background-color:var(--_basic-hover-color);color:var(--_on-basic-hover-color)}.eui-button--basic:hover .eui-label{color:var(--_on-basic-hover-color)}.eui-button--outline:hover{background-color:var(--_outline-hover-color);color:var(--_on-outline-hover-color)}.eui-button--outline:hover .eui-label{color:var(--_on-outline-hover-color)}.eui-button--rounded{border-radius:var(--eui-br-max)}.eui-button--rounded:focus:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button--rounded:focus-visible:not([readonly]){border-radius:var(--eui-br-max);outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button--responsive{display:grid!important;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--block{width:100%}.eui-button--line-wrap{padding:var(--eui-s-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-c-bg);border-color:transparent;border-radius:0 0 var(--eui-s-xs) var(--eui-s-xs);min-height:var(--eui-s-m);padding:0 var(--eui-s-xl);box-shadow:var(--eui-sh-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-sh-3)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button-fixed{bottom:var(--eui-s-3xl);position:fixed;right:var(--eui-s-xl);z-index:calc(var(--eui-zi-btn-floating) + 1)}.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-button-floating{align-items:center;border-radius:var(--eui-br-max);display:inline-flex;overflow:hidden;padding:var(--eui-s-xs);position:relative;transform:translateY(35%);vertical-align:middle;height:var(--eui-s-4xl);width:var(--eui-s-4xl);z-index:1;box-shadow:var(--eui-sh-6);background-color:var(--_bg-color);color:var(--_on-bg-color)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-sh-3)}.eui-button-floating:before{border-radius:var(--eui-br-none)}.eui-button__expand-trigger{border-top:1px solid var(--eui-c-neutral-lightest);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-s-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-sh-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-s-s)}\n"] }]
|
|
85
85
|
}], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i1.BaseStatesDirective }], propDecorators: { cssClasses: [{
|
|
86
86
|
type: HostBinding,
|
|
87
87
|
args: ['class']
|
|
@@ -10,9 +10,8 @@ export class EuiChipComponent {
|
|
|
10
10
|
return [
|
|
11
11
|
this.baseStatesDirective.getCssClasses('eui-chip'),
|
|
12
12
|
this.isChipRemovable ? 'eui-chip--removable' : '',
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
.trim();
|
|
13
|
+
this.isFilled ? 'eui-chip--filled' : '',
|
|
14
|
+
].join(' ').trim();
|
|
16
15
|
}
|
|
17
16
|
constructor(_elementRef, baseStatesDirective) {
|
|
18
17
|
this._elementRef = _elementRef;
|
|
@@ -34,6 +33,7 @@ export class EuiChipComponent {
|
|
|
34
33
|
};
|
|
35
34
|
this.isChipRemovable = false;
|
|
36
35
|
this.isSquared = false;
|
|
36
|
+
this.isFilled = false;
|
|
37
37
|
this.remove = new EventEmitter();
|
|
38
38
|
}
|
|
39
39
|
ngAfterContentInit() {
|
|
@@ -53,7 +53,7 @@ export class EuiChipComponent {
|
|
|
53
53
|
}
|
|
54
54
|
}
|
|
55
55
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiChipComponent, deps: [{ token: i0.ElementRef }, { token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
56
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiChipComponent, selector: "eui-chip, span[euiChip], li[euiChip]", inputs: { ariaLabel: "ariaLabel", e2eAttr: "e2eAttr", euiInternalId: "euiInternalId", tooltipMessage: "tooltipMessage", id: "id", data: "data", isChipRemovable: ["isChipRemovable", "isChipRemovable", booleanAttribute], isSquared: ["isSquared", "isSquared", booleanAttribute] }, outputs: { remove: "remove" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "euiIcons", predicate: i0.forwardRef(() => EuiIconSvgComponent) }], viewQueries: [{ propertyName: "chipLabel", first: true, predicate: ["chipLabel"], descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiOutline", "euiOutline", "euiDisabled", "euiDisabled"] }], ngImport: i0, template: "<div class=\"eui-chip-wrapper\">\n <div class=\"eui-chip__content-container\" #chipLabel>\n <ng-content></ng-content>\n </div>\n <eui-icon-button\n *ngIf=\"isChipRemovable\"\n class=\"eui-chip__close\"\n ariaLabel=\"Remove chip\"\n icon=\"close:outline\"\n
|
|
56
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiChipComponent, selector: "eui-chip, span[euiChip], li[euiChip]", inputs: { ariaLabel: "ariaLabel", e2eAttr: "e2eAttr", euiInternalId: "euiInternalId", tooltipMessage: "tooltipMessage", id: "id", data: "data", isChipRemovable: ["isChipRemovable", "isChipRemovable", booleanAttribute], isSquared: ["isSquared", "isSquared", booleanAttribute], isFilled: ["isFilled", "isFilled", booleanAttribute] }, outputs: { remove: "remove" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "euiIcons", predicate: i0.forwardRef(() => EuiIconSvgComponent) }], viewQueries: [{ propertyName: "chipLabel", first: true, predicate: ["chipLabel"], descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiOutline", "euiOutline", "euiDisabled", "euiDisabled"] }], ngImport: i0, template: "<div class=\"eui-chip-wrapper\">\n <div class=\"eui-chip__content-container\" #chipLabel>\n <ng-content></ng-content>\n </div>\n <eui-icon-button\n *ngIf=\"isChipRemovable\"\n class=\"eui-chip__close\"\n ariaLabel=\"Remove chip\"\n icon=\"close:outline\"\n euiRounded\n hasNoPadding\n (keydown.enter)=\"onRemove($event)\"\n (keydown.backspace)=\"onRemove($event)\"\n (buttonClick)=\"onRemove($event)\">\n </eui-icon-button>\n</div>\n", styles: [".eui-chip{--_color: var(--eui-chip-color, var(--eui-c-neutral));--_bg-color: var(--eui-chip-bg-color, var(--eui-c-neutral-bg));--_border-outline-color: var(--eui-chip-border-outline-color, var(--eui-c-neutral));--_close-hover-color: var(--eui-chip-close-hover-color, var(--eui-c-neutral-lightest))}.eui-chip{align-items:center;border-radius:var(--eui-br-max);display:inline-flex;position:relative;font:var(--eui-f);min-height:calc(var(--eui-s-m) / 16 * 30);padding:0 var(--eui-s-s)}.eui-chip .eui-chip-wrapper,.eui-chip .eui-chip__content-container{display:flex;align-items:center;gap:var(--eui-s-xs)}.eui-chip--outline{outline:var(--eui-bw-xs) solid var(--_border-outline-color);outline-offset:-1px}.eui-chip-group{align-items:center;display:inline-flex;flex-wrap:nowrap;position:relative}.eui-chip-group .eui-chip:first-child{border-bottom-right-radius:0;border-top-right-radius:0;margin-right:0}.eui-chip-group .eui-chip:last-child{border-bottom-left-radius:0;border-top-left-radius:0;margin-left:0}.eui-chip-group .eui-chip .eui-chip__content-container eui-icon-svg{margin-left:0;margin-right:0}.eui-chip--primary{--_bg-color: var(--eui-c-primary-lightest);--_color: var(--eui-c-primary-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-primary);--_close-hover-color: var(--eui-c-primary-lighter)}.eui-chip--secondary{--_bg-color: var(--eui-c-neutral-bg);--_color: var(--eui-c-neutral-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-neutral);--_close-hover-color: var(--eui-c-neutral-lightest)}.eui-chip--info{--_bg-color: var(--eui-c-info-lightest);--_color: var(--eui-c-info-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-info);--_close-hover-color: var(--eui-c-info-lighter)}.eui-chip--success{--_bg-color: var(--eui-c-success-lightest);--_color: var(--eui-c-success-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-success-dark);--_close-hover-color: var(--eui-c-success-lighter)}.eui-chip--warning{--_bg-color: var(--eui-c-warning-lightest);--_color: var(--eui-c-warning-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-warning);--_close-hover-color: var(--eui-c-warning-lighter)}.eui-chip--danger{--_bg-color: var(--eui-c-danger-lightest);--_color: var(--eui-c-danger-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-danger-dark);--_close-hover-color: var(--eui-c-danger-lighter)}.eui-chip--accent{--_bg-color: var(--eui-c-accent-lightest);--_color: var(--eui-c-neutral);--_border-color: transparent;--_border-outline-color: var(--eui-c-accent);--_close-hover-color: var(--eui-c-accent-lighter)}.eui-chip--filled.eui-chip--primary{--_bg-color: var(--eui-c-primary);--_color: var(--eui-c-primary-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-primary-light)}.eui-chip--filled.eui-chip--secondary{--_bg-color: var(--eui-c-neutral-lightest);--_color: var(--eui-c-neutral-lightest-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-neutral-bg)}.eui-chip--filled.eui-chip--info{--_bg-color: var(--eui-c-info);--_color: var(--eui-c-info-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-info-light)}.eui-chip--filled.eui-chip--success{--_bg-color: var(--eui-c-success-dark);--_color: var(--eui-c-success-dark-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-success)}.eui-chip--filled.eui-chip--warning{--_bg-color: var(--eui-c-warning);--_color: var(--eui-c-warning-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-warning-light)}.eui-chip--filled.eui-chip--danger{--_bg-color: var(--eui-c-danger-dark);--_color: var(--eui-c-danger-dark-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-danger)}.eui-chip--filled.eui-chip--accent{--_bg-color: var(--eui-c-accent-light);--_color: var(--eui-c-accent-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-accent-lighter)}.eui-chip{background-color:var(--_bg-color);color:var(--_color)}.eui-chip .eui-icon-svg:not(.eui-chip__close) svg{fill:var(--_color);color:var(--_color)}.eui-chip .eui-chip__close:not(.eui-chip--outline) .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-chip--outline{background-color:var(--eui-c-white)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
57
57
|
}
|
|
58
58
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiChipComponent, decorators: [{
|
|
59
59
|
type: Component,
|
|
@@ -73,7 +73,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
|
|
|
73
73
|
'euiDisabled',
|
|
74
74
|
],
|
|
75
75
|
},
|
|
76
|
-
], template: "<div class=\"eui-chip-wrapper\">\n <div class=\"eui-chip__content-container\" #chipLabel>\n <ng-content></ng-content>\n </div>\n <eui-icon-button\n *ngIf=\"isChipRemovable\"\n class=\"eui-chip__close\"\n ariaLabel=\"Remove chip\"\n icon=\"close:outline\"\n
|
|
76
|
+
], template: "<div class=\"eui-chip-wrapper\">\n <div class=\"eui-chip__content-container\" #chipLabel>\n <ng-content></ng-content>\n </div>\n <eui-icon-button\n *ngIf=\"isChipRemovable\"\n class=\"eui-chip__close\"\n ariaLabel=\"Remove chip\"\n icon=\"close:outline\"\n euiRounded\n hasNoPadding\n (keydown.enter)=\"onRemove($event)\"\n (keydown.backspace)=\"onRemove($event)\"\n (buttonClick)=\"onRemove($event)\">\n </eui-icon-button>\n</div>\n", styles: [".eui-chip{--_color: var(--eui-chip-color, var(--eui-c-neutral));--_bg-color: var(--eui-chip-bg-color, var(--eui-c-neutral-bg));--_border-outline-color: var(--eui-chip-border-outline-color, var(--eui-c-neutral));--_close-hover-color: var(--eui-chip-close-hover-color, var(--eui-c-neutral-lightest))}.eui-chip{align-items:center;border-radius:var(--eui-br-max);display:inline-flex;position:relative;font:var(--eui-f);min-height:calc(var(--eui-s-m) / 16 * 30);padding:0 var(--eui-s-s)}.eui-chip .eui-chip-wrapper,.eui-chip .eui-chip__content-container{display:flex;align-items:center;gap:var(--eui-s-xs)}.eui-chip--outline{outline:var(--eui-bw-xs) solid var(--_border-outline-color);outline-offset:-1px}.eui-chip-group{align-items:center;display:inline-flex;flex-wrap:nowrap;position:relative}.eui-chip-group .eui-chip:first-child{border-bottom-right-radius:0;border-top-right-radius:0;margin-right:0}.eui-chip-group .eui-chip:last-child{border-bottom-left-radius:0;border-top-left-radius:0;margin-left:0}.eui-chip-group .eui-chip .eui-chip__content-container eui-icon-svg{margin-left:0;margin-right:0}.eui-chip--primary{--_bg-color: var(--eui-c-primary-lightest);--_color: var(--eui-c-primary-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-primary);--_close-hover-color: var(--eui-c-primary-lighter)}.eui-chip--secondary{--_bg-color: var(--eui-c-neutral-bg);--_color: var(--eui-c-neutral-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-neutral);--_close-hover-color: var(--eui-c-neutral-lightest)}.eui-chip--info{--_bg-color: var(--eui-c-info-lightest);--_color: var(--eui-c-info-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-info);--_close-hover-color: var(--eui-c-info-lighter)}.eui-chip--success{--_bg-color: var(--eui-c-success-lightest);--_color: var(--eui-c-success-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-success-dark);--_close-hover-color: var(--eui-c-success-lighter)}.eui-chip--warning{--_bg-color: var(--eui-c-warning-lightest);--_color: var(--eui-c-warning-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-warning);--_close-hover-color: var(--eui-c-warning-lighter)}.eui-chip--danger{--_bg-color: var(--eui-c-danger-lightest);--_color: var(--eui-c-danger-darker);--_border-color: transparent;--_border-outline-color: var(--eui-c-danger-dark);--_close-hover-color: var(--eui-c-danger-lighter)}.eui-chip--accent{--_bg-color: var(--eui-c-accent-lightest);--_color: var(--eui-c-neutral);--_border-color: transparent;--_border-outline-color: var(--eui-c-accent);--_close-hover-color: var(--eui-c-accent-lighter)}.eui-chip--filled.eui-chip--primary{--_bg-color: var(--eui-c-primary);--_color: var(--eui-c-primary-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-primary-light)}.eui-chip--filled.eui-chip--secondary{--_bg-color: var(--eui-c-neutral-lightest);--_color: var(--eui-c-neutral-lightest-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-neutral-bg)}.eui-chip--filled.eui-chip--info{--_bg-color: var(--eui-c-info);--_color: var(--eui-c-info-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-info-light)}.eui-chip--filled.eui-chip--success{--_bg-color: var(--eui-c-success-dark);--_color: var(--eui-c-success-dark-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-success)}.eui-chip--filled.eui-chip--warning{--_bg-color: var(--eui-c-warning);--_color: var(--eui-c-warning-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-warning-light)}.eui-chip--filled.eui-chip--danger{--_bg-color: var(--eui-c-danger-dark);--_color: var(--eui-c-danger-dark-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-danger)}.eui-chip--filled.eui-chip--accent{--_bg-color: var(--eui-c-accent-light);--_color: var(--eui-c-accent-contrast);--_border-color: transparent;--_close-hover-color: var(--eui-c-accent-lighter)}.eui-chip{background-color:var(--_bg-color);color:var(--_color)}.eui-chip .eui-icon-svg:not(.eui-chip__close) svg{fill:var(--_color);color:var(--_color)}.eui-chip .eui-chip__close:not(.eui-chip--outline) .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-chip--outline{background-color:var(--eui-c-white)}\n"] }]
|
|
77
77
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.BaseStatesDirective }], propDecorators: { cssClasses: [{
|
|
78
78
|
type: HostBinding,
|
|
79
79
|
args: ['class']
|
|
@@ -104,6 +104,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
|
|
|
104
104
|
}], isSquared: [{
|
|
105
105
|
type: Input,
|
|
106
106
|
args: [{ transform: booleanAttribute }]
|
|
107
|
+
}], isFilled: [{
|
|
108
|
+
type: Input,
|
|
109
|
+
args: [{ transform: booleanAttribute }]
|
|
107
110
|
}], remove: [{
|
|
108
111
|
type: Output
|
|
109
112
|
}], euiIcons: [{
|
|
@@ -113,4 +116,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
|
|
|
113
116
|
type: ViewChild,
|
|
114
117
|
args: ['chipLabel']
|
|
115
118
|
}] } });
|
|
116
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
119
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXVpLWNoaXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vZXVpLWNoaXAvZXVpLWNoaXAuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vZXVpLWNoaXAvZXVpLWNoaXAuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILFNBQVMsRUFDVCxXQUFXLEVBQ1gsS0FBSyxFQUNMLHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsVUFBVSxFQUNWLGVBQWUsRUFHZixNQUFNLEVBQ04sWUFBWSxFQUNaLFNBQVMsRUFFVCxnQkFBZ0IsR0FDbkIsTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDN0QsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sMEJBQTBCLENBQUM7Ozs7O0FBNkIvRCxNQUFNLE9BQU8sZ0JBQWdCO0lBQ3pCLElBQ0ksVUFBVTtRQUNWLE9BQU87WUFDSCxJQUFJLENBQUMsbUJBQW1CLENBQUMsYUFBYSxDQUFDLFVBQVUsQ0FBQztZQUNsRCxJQUFJLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsRUFBRTtZQUNqRCxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxrQkFBa0IsQ0FBQSxDQUFDLENBQUMsRUFBRTtTQUN6QyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUN2QixDQUFDO0lBaUNELFlBQ1ksV0FBdUIsRUFDeEIsbUJBQXdDO1FBRHZDLGdCQUFXLEdBQVgsV0FBVyxDQUFZO1FBQ3hCLHdCQUFtQixHQUFuQixtQkFBbUIsQ0FBcUI7UUFqQ3pCLFNBQUksR0FBRyxRQUFRLENBQUM7UUFDRCxjQUFTLEdBQUcsY0FBYyxDQUFDO1FBSXBFLFlBQU8sR0FBRyxVQUFVLENBQUM7UUFFWixrQkFBYSxHQUFXLElBQUksQ0FBQztRQUd0QyxnQ0FBZ0M7UUFDaEMsbUhBQW1IO1FBQ25ILDhEQUE4RDtRQUNyRCxTQUFJLEdBQVE7WUFDakIsRUFBRSxFQUFFLE1BQU0sQ0FBQyxVQUFVLEVBQUU7WUFDdkIsT0FBTyxFQUFFO2dCQUNMLEtBQUssRUFBRSxtQkFBbUI7Z0JBQzFCLGdCQUFnQixFQUFFLElBQUk7Z0JBQ3RCLFFBQVEsRUFBRSxPQUFPO2FBQ3BCO1NBQ0osQ0FBQztRQUVzQyxvQkFBZSxHQUFHLEtBQUssQ0FBQztRQUN4QixjQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ2xCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFL0MsV0FBTSxHQUFHLElBQUksWUFBWSxFQUFvRixDQUFDO0lBU3hILENBQUM7SUFFRCxrQkFBa0I7UUFDZCxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxFQUFFLElBQUksSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDO1lBQzNCLElBQUksQ0FBQyxJQUFJLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLEVBQUUsRUFBRSxFQUFFLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDO1FBQzFELENBQUM7UUFFRCxJQUFJLElBQUksQ0FBQyxXQUFXLENBQUMsYUFBYSxDQUFDLGFBQWEsRUFBRSxTQUFTLENBQUMsUUFBUSxDQUFDLCtCQUErQixDQUFDLEVBQUUsQ0FBQztZQUNwRyxJQUFJLENBQUMsSUFBSSxHQUFHLFVBQVUsQ0FBQTtRQUMxQixDQUFDO0lBQ0wsQ0FBQztJQUVNLFFBQVEsQ0FBQyxLQUFhO1FBQ3pCLElBQUksS0FBSyxZQUFZLGFBQWEsSUFBSyxLQUF1QixDQUFDLElBQUksS0FBSyxXQUFXLEVBQUUsQ0FBQztZQUNsRixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxFQUFFLElBQUksRUFBRSxJQUFJLENBQUMsSUFBSSxFQUFFLEtBQUssRUFBRSxDQUFDLENBQUM7UUFDakQsQ0FBQzthQUFNLENBQUM7WUFDSixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDaEMsQ0FBQztJQUNMLENBQUM7OEdBL0RRLGdCQUFnQjtrR0FBaEIsZ0JBQWdCLDRQQWdDTCxnQkFBZ0IseUNBQ2hCLGdCQUFnQixzQ0FDaEIsZ0JBQWdCLCtQQUlGLG1CQUFtQiw2ZENyRnpELHFnQkFnQkE7OzJGRCtCYSxnQkFBZ0I7a0JBekI1QixTQUFTOytCQUVJLHNDQUFzQyxtQkFFL0IsdUJBQXVCLENBQUMsTUFBTSxpQkFDaEMsaUJBQWlCLENBQUMsSUFBSSxrQkFDckI7d0JBQ1o7NEJBQ0ksU0FBUyxFQUFFLG1CQUFtQjs0QkFDOUIsTUFBTSxFQUFFO2dDQUNKLFlBQVk7Z0NBQ1osY0FBYztnQ0FDZCxZQUFZO2dDQUNaLFNBQVM7Z0NBQ1QsWUFBWTtnQ0FDWixXQUFXO2dDQUNYLFdBQVc7Z0NBQ1gsWUFBWTtnQ0FFWixZQUFZO2dDQUNaLGFBQWE7NkJBQ2hCO3lCQUNKO3FCQUNKO2lIQUlHLFVBQVU7c0JBRGIsV0FBVzt1QkFBQyxPQUFPO2dCQVNNLElBQUk7c0JBQTdCLFdBQVc7dUJBQUMsV0FBVztnQkFDaUIsU0FBUztzQkFBakQsS0FBSzs7c0JBQUksV0FBVzt1QkFBQyxpQkFBaUI7Z0JBSXZDLE9BQU87c0JBRk4sV0FBVzt1QkFBQyxlQUFlOztzQkFDM0IsS0FBSztnQkFHRyxhQUFhO3NCQUFyQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csRUFBRTtzQkFBVixLQUFLO2dCQUlHLElBQUk7c0JBQVosS0FBSztnQkFTa0MsZUFBZTtzQkFBdEQsS0FBSzt1QkFBQyxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRTtnQkFDRSxTQUFTO3NCQUFoRCxLQUFLO3VCQUFDLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixFQUFFO2dCQUNFLFFBQVE7c0JBQS9DLEtBQUs7dUJBQUMsRUFBRSxTQUFTLEVBQUUsZ0JBQWdCLEVBQUU7Z0JBRTVCLE1BQU07c0JBQWYsTUFBTTtnQkFFaUQsUUFBUTtzQkFBL0QsZUFBZTt1QkFBQyxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsbUJBQW1CLENBQUM7Z0JBQzlCLFNBQVM7c0JBQWhDLFNBQVM7dUJBQUMsV0FBVyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gICAgQ29tcG9uZW50LFxuICAgIEhvc3RCaW5kaW5nLFxuICAgIElucHV0LFxuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIFZpZXdFbmNhcHN1bGF0aW9uLFxuICAgIGZvcndhcmRSZWYsXG4gICAgQ29udGVudENoaWxkcmVuLFxuICAgIFF1ZXJ5TGlzdCxcbiAgICBBZnRlckNvbnRlbnRJbml0LFxuICAgIE91dHB1dCxcbiAgICBFdmVudEVtaXR0ZXIsXG4gICAgVmlld0NoaWxkLFxuICAgIEVsZW1lbnRSZWYsXG4gICAgYm9vbGVhbkF0dHJpYnV0ZSxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IEJhc2VTdGF0ZXNEaXJlY3RpdmUgfSBmcm9tICdAZXVpL2NvbXBvbmVudHMvc2hhcmVkJztcbmltcG9ydCB7IEV1aUljb25TdmdDb21wb25lbnQgfSBmcm9tICdAZXVpL2NvbXBvbmVudHMvZXVpLWljb24nO1xuXG5pbXBvcnQgeyBFdWlDaGlwIH0gZnJvbSAnLi9tb2RlbHMvZXVpLWNoaXAubW9kZWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgICB0ZW1wbGF0ZVVybDogJy4vZXVpLWNoaXAuY29tcG9uZW50Lmh0bWwnLFxuICAgIHNlbGVjdG9yOiAnZXVpLWNoaXAsIHNwYW5bZXVpQ2hpcF0sIGxpW2V1aUNoaXBdJyxcbiAgICBzdHlsZVVybHM6IFsnLi9zdHlsZXMvX2luZGV4LnNjc3MnXSxcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICAgIGhvc3REaXJlY3RpdmVzOiBbXG4gICAgICAgIHtcbiAgICAgICAgICAgIGRpcmVjdGl2ZTogQmFzZVN0YXRlc0RpcmVjdGl2ZSxcbiAgICAgICAgICAgIGlucHV0czogW1xuICAgICAgICAgICAgICAgICdldWlQcmltYXJ5JyxcbiAgICAgICAgICAgICAgICAnZXVpU2Vjb25kYXJ5JyxcbiAgICAgICAgICAgICAgICAnZXVpU3VjY2VzcycsXG4gICAgICAgICAgICAgICAgJ2V1aUluZm8nLFxuICAgICAgICAgICAgICAgICdldWlXYXJuaW5nJyxcbiAgICAgICAgICAgICAgICAnZXVpRGFuZ2VyJyxcbiAgICAgICAgICAgICAgICAnZXVpQWNjZW50JyxcbiAgICAgICAgICAgICAgICAnZXVpVmFyaWFudCcsXG5cbiAgICAgICAgICAgICAgICAnZXVpT3V0bGluZScsXG4gICAgICAgICAgICAgICAgJ2V1aURpc2FibGVkJyxcbiAgICAgICAgICAgIF0sXG4gICAgICAgIH0sXG4gICAgXSxcbn0pXG5leHBvcnQgY2xhc3MgRXVpQ2hpcENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyQ29udGVudEluaXQge1xuICAgIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICAgIGdldCBjc3NDbGFzc2VzKCk6IHN0cmluZyB7XG4gICAgICAgIHJldHVybiBbXG4gICAgICAgICAgICB0aGlzLmJhc2VTdGF0ZXNEaXJlY3RpdmUuZ2V0Q3NzQ2xhc3NlcygnZXVpLWNoaXAnKSxcbiAgICAgICAgICAgIHRoaXMuaXNDaGlwUmVtb3ZhYmxlID8gJ2V1aS1jaGlwLS1yZW1vdmFibGUnIDogJycsXG4gICAgICAgICAgICB0aGlzLmlzRmlsbGVkID8gJ2V1aS1jaGlwLS1maWxsZWQnOiAnJyxcbiAgICAgICAgXS5qb2luKCcgJykudHJpbSgpO1xuICAgIH1cblxuICAgIEBIb3N0QmluZGluZygnYXR0ci5yb2xlJykgcm9sZSA9ICdzdGF0dXMnO1xuICAgIEBJbnB1dCgpIEBIb3N0QmluZGluZygnYXR0ci5hcmlhLWxhYmVsJykgYXJpYUxhYmVsID0gJ0NoaXAgY29udGVudCc7XG5cbiAgICBASG9zdEJpbmRpbmcoJ2F0dHIuZGF0YS1lMmUnKVxuICAgIEBJbnB1dCgpXG4gICAgZTJlQXR0ciA9ICdldWktY2hpcCc7XG5cbiAgICBASW5wdXQoKSBldWlJbnRlcm5hbElkOiBzdHJpbmcgPSBudWxsO1xuICAgIEBJbnB1dCgpIHRvb2x0aXBNZXNzYWdlOiBzdHJpbmc7XG4gICAgQElucHV0KCkgaWQ6IHN0cmluZyB8IG51bWJlcjtcbiAgICAvLyBUT0RPOiB0eXBlIHNob3VsZCBiZSBzcGVjaWZpY1xuICAgIC8vIFRPRE86IGZpbmQgdGhlIGNvcnJlY3QgdHlwZSBvciB0dXJuIGludG8gYSBnZW5lcmljLCBodHRwczovL3d3dy50eXBlc2NyaXB0bGFuZy5vcmcvZG9jcy9oYW5kYm9vay8yL2dlbmVyaWNzLmh0bWxcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWV4cGxpY2l0LWFueVxuICAgIEBJbnB1dCgpIGRhdGE6IGFueSA9IHtcbiAgICAgICAgaWQ6IGNyeXB0by5yYW5kb21VVUlEKCksXG4gICAgICAgIHRvb2x0aXA6IHtcbiAgICAgICAgICAgIGNvbG9yOiAnZXVpVG9vbHRpcFByaW1hcnknLFxuICAgICAgICAgICAgY29udGVudEFsaWdubWVudDogbnVsbCxcbiAgICAgICAgICAgIHBvc2l0aW9uOiAnYWJvdmUnLFxuICAgICAgICB9LFxuICAgIH07XG5cbiAgICBASW5wdXQoeyB0cmFuc2Zvcm06IGJvb2xlYW5BdHRyaWJ1dGUgfSkgaXNDaGlwUmVtb3ZhYmxlID0gZmFsc2U7XG4gICAgQElucHV0KHsgdHJhbnNmb3JtOiBib29sZWFuQXR0cmlidXRlIH0pIGlzU3F1YXJlZCA9IGZhbHNlO1xuICAgIEBJbnB1dCh7IHRyYW5zZm9ybTogYm9vbGVhbkF0dHJpYnV0ZSB9KSBpc0ZpbGxlZCA9IGZhbHNlO1xuXG4gICAgQE91dHB1dCgpIHJlbW92ZSA9IG5ldyBFdmVudEVtaXR0ZXI8RXVpQ2hpcENvbXBvbmVudCB8IEV1aUNoaXAgfCB7IGNoaXA6IEV1aUNoaXBDb21wb25lbnQgfCBFdWlDaGlwOyBldmVudD86IEV2ZW50IH0+KCk7XG5cbiAgICBAQ29udGVudENoaWxkcmVuKGZvcndhcmRSZWYoKCkgPT4gRXVpSWNvblN2Z0NvbXBvbmVudCkpIGV1aUljb25zOiBRdWVyeUxpc3Q8RXVpSWNvblN2Z0NvbXBvbmVudD47XG4gICAgQFZpZXdDaGlsZCgnY2hpcExhYmVsJykgY2hpcExhYmVsOiBFbGVtZW50UmVmPEhUTUxJbnB1dEVsZW1lbnQ+O1xuXG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgIHByaXZhdGUgX2VsZW1lbnRSZWY6IEVsZW1lbnRSZWYsXG4gICAgICAgIHB1YmxpYyBiYXNlU3RhdGVzRGlyZWN0aXZlOiBCYXNlU3RhdGVzRGlyZWN0aXZlLFxuICAgICkge1xuICAgIH1cblxuICAgIG5nQWZ0ZXJDb250ZW50SW5pdCgpOiB2b2lkIHtcbiAgICAgICAgaWYgKCF0aGlzLmRhdGEuaWQgJiYgdGhpcy5pZCkge1xuICAgICAgICAgICAgdGhpcy5kYXRhID0gT2JqZWN0LmFzc2lnbih0aGlzLmRhdGEsIHsgaWQ6IHRoaXMuaWQgfSk7XG4gICAgICAgIH1cblxuICAgICAgICBpZiAodGhpcy5fZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LnBhcmVudEVsZW1lbnQ/LmNsYXNzTGlzdC5jb250YWlucygnZXVpLWNoaXAtbGlzdF9fY2hpcC1jb250YWluZXInKSkge1xuICAgICAgICAgICAgdGhpcy5yb2xlID0gJ2xpc3RpdGVtJ1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgcHVibGljIG9uUmVtb3ZlKGV2ZW50PzogRXZlbnQpOiB2b2lkIHtcbiAgICAgICAgaWYgKGV2ZW50IGluc3RhbmNlb2YgS2V5Ym9hcmRFdmVudCAmJiAoZXZlbnQgYXMgS2V5Ym9hcmRFdmVudCkuY29kZSA9PT0gJ0JhY2tzcGFjZScpIHtcbiAgICAgICAgICAgIHRoaXMucmVtb3ZlLmVtaXQoeyBjaGlwOiB0aGlzLmRhdGEsIGV2ZW50IH0pO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgdGhpcy5yZW1vdmUuZW1pdCh0aGlzLmRhdGEpO1xuICAgICAgICB9XG4gICAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImV1aS1jaGlwLXdyYXBwZXJcIj5cbiAgICA8ZGl2IGNsYXNzPVwiZXVpLWNoaXBfX2NvbnRlbnQtY29udGFpbmVyXCIgI2NoaXBMYWJlbD5cbiAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuICAgIDxldWktaWNvbi1idXR0b25cbiAgICAgICAgKm5nSWY9XCJpc0NoaXBSZW1vdmFibGVcIlxuICAgICAgICBjbGFzcz1cImV1aS1jaGlwX19jbG9zZVwiXG4gICAgICAgIGFyaWFMYWJlbD1cIlJlbW92ZSBjaGlwXCJcbiAgICAgICAgaWNvbj1cImNsb3NlOm91dGxpbmVcIlxuICAgICAgICBldWlSb3VuZGVkXG4gICAgICAgIGhhc05vUGFkZGluZ1xuICAgICAgICAoa2V5ZG93bi5lbnRlcik9XCJvblJlbW92ZSgkZXZlbnQpXCJcbiAgICAgICAgKGtleWRvd24uYmFja3NwYWNlKT1cIm9uUmVtb3ZlKCRldmVudClcIlxuICAgICAgICAoYnV0dG9uQ2xpY2spPVwib25SZW1vdmUoJGV2ZW50KVwiPlxuICAgIDwvZXVpLWljb24tYnV0dG9uPlxuPC9kaXY+XG4iXX0=
|
|
@@ -230,7 +230,7 @@ export class EuiChipListComponent {
|
|
|
230
230
|
return tab;
|
|
231
231
|
}
|
|
232
232
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiChipListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.EuiChipListDragService }, { token: i2.DomSanitizer }, { token: i3.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
233
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiChipListComponent, selector: "eui-chip-list, div[euiChipList], ul[euiChipList]", inputs: { chips: "chips", toggleLinkMoreLabel: "toggleLinkMoreLabel", toggleLinkLessLabel: "toggleLinkLessLabel", chipsSortOrder: "chipsSortOrder", dragAndDropSourceName: "dragAndDropSourceName", dragAndDropConnectedTo: "dragAndDropConnectedTo", ariaLabel: "ariaLabel", dropListOrientation: "dropListOrientation", isSquared: ["isSquared", "isSquared", booleanAttribute], isChipsRemovable: ["isChipsRemovable", "isChipsRemovable", booleanAttribute], isMaxVisibleChipsOpened: ["isMaxVisibleChipsOpened", "isMaxVisibleChipsOpened", booleanAttribute], isChipsSorted: ["isChipsSorted", "isChipsSorted", booleanAttribute], isChipsDragAndDrop: ["isChipsDragAndDrop", "isChipsDragAndDrop", booleanAttribute], isGrid: ["isGrid", "isGrid", booleanAttribute], maxVisibleChipsCount: ["maxVisibleChipsCount", "maxVisibleChipsCount", numberAttribute], chipsLabelTruncateCount: ["chipsLabelTruncateCount", "chipsLabelTruncateCount", numberAttribute] }, outputs: { chipsInit: "chipsInit", chipRemove: "chipRemove", chipDragStart: "chipDragStart", chipDragRelease: "chipDragRelease", chipDrop: "chipDrop", chiplistFocus: "chiplistFocus" }, host: { properties: { "attr.aria-label": "this.ariaLabel", "class": "this.cssClasses" } }, queries: [{ propertyName: "euiChipsContent", predicate: i0.forwardRef(() => EuiChipComponent) }], viewQueries: [{ propertyName: "chipListDropList", first: true, predicate: ["chipListDropList"], descendants: true, read: CdkDropList }, { propertyName: "chipListDragAndDropItems", first: true, predicate: ["chipListDragAndDropItems"], descendants: true, read: CdkDropList }, { propertyName: "euiChipItems", predicate: ["euiChipItem"], descendants: true, read: ElementRef }], usesOnChanges: true, hostDirectives: [{ directive: i3.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiOutline", "euiOutline", "euiDisabled", "euiDisabled"] }], ngImport: i0, template: "<div *ngIf=\"!isGrid\" class=\"eui-chip-list-container\">\n <div class=\"eui-chip-list-wrapper\">\n <div\n role=\"list\"\n #chipList\n #chipListDropList\n #chipListDragAndDropItems\n cdkDropList\n [cdkDropListOrientation]=\"dropListOrientation\"\n [cdkDropListDisabled]=\"!isChipsDragAndDrop\"\n [cdkDropListData]=\"{ chips }\"\n [cdkDropListConnectedTo]=\"droppableArea\"\n (cdkDropListDropped)=\"drop($event)\"\n (focus)=\"onFocus()\"\n class=\"eui-chip-list__list\">\n <div\n class=\"eui-chip-list__chip-container\"\n *ngFor=\"let chip of chips; let i = index; trackBy: trackByFn\"\n cdkDrag\n [cdkDragData]=\"chip\"\n (cdkDragStarted)=\"onDragStarted($event)\"\n (cdkDragReleased)=\"onDragReleased($event)\">\n <eui-chip\n #euiChipItem\n *ngIf=\"\n (maxVisibleChipsCount && isMaxVisibleChipsOpened) ||\n (maxVisibleChipsCount && maxVisibleChipsCount > i) ||\n !maxVisibleChipsCount\n \"\n [data]=\"chip.data ? chip.data : chip\"\n [attr.role]=\"'listitem'\"\n ariaLabel=\"{{ getChipLabel(chip) }}\"\n [euiInternalId]=\"chip.euiInternalId\"\n [isChipRemovable]=\"chip.isChipRemovable || (isChipsRemovable && chip.isRemovable) !== false\"\n [euiOutline]=\"chip.euiOutline || this.baseStatesDirective?.euiOutline || chip.isOutline\"\n [euiVariant]=\"chip.typeClass || this.baseStatesDirective?.euiVariant || chip.baseStatesDirective?.euiVariant\"\n [euiDisabled]=\"chip.euiDisabled || this.baseStatesDirective?.euiDisabled || chip.isDisabled\"\n [euiTooltip]=\"chip.tooltipMessage\"\n [position]=\"chip.tooltip?.position\"\n [contentAlignment]=\"chip.tooltip?.contentAlignment\"\n (remove)=\"onRemove($event)\">\n <eui-icon-svg *ngIf=\"chip.iconSvgName\" [icon]=\"chip.iconSvgName\"></eui-icon-svg>\n <span *ngIf=\"chip.iconClass\" class=\"{{ chip.iconClass }}\"></span>\n <span class=\"eui-chip-list__chip-content\" *ngIf=\"!chipsLabelTruncateCount\" [innerHTML]=\"getChipContent(chip)\"></span>\n <span *ngIf=\"chipsLabelTruncateCount\" title=\"{{ getChipLabel(chip) }}\">{{\n getChipLabel(chip) | euiTruncate: chipsLabelTruncateCount\n }}</span>\n </eui-chip>\n </div>\n <ng-container *ngTemplateOutlet=\"euiChipListAppendContent\"></ng-container>\n </div>\n </div>\n <ng-container *ngTemplateOutlet=\"additionalContent\"></ng-container>\n</div>\n\n<div *ngIf=\"isGrid\" class=\"eui-chip-list-container\">\n <div class=\"eui-chip-list-wrapper\">\n <div class=\"eui-chip-list__group\" cdkDropListGroup>\n <div\n role=\"list\"\n #chipList\n #chipListDropList\n #chipListDragAndDropItems\n cdkDropList\n *ngFor=\"let chip of chips; let i = index\"\n [cdkDropListDisabled]=\"!isChipsDragAndDrop\"\n [cdkDropListData]=\"{ chip: chip, index: i }\"\n (focus)=\"onFocus()\"\n (cdkDropListDropped)=\"onDropGrid($event)\"\n class=\"eui-chip-list__custom\">\n <div\n class=\"eui-chip-list__chip-container\"\n cdkDrag\n [cdkDragData]=\"{ chip: chip, index: i }\"\n (cdkDragStarted)=\"onDragStarted($event)\"\n (cdkDragReleased)=\"onDragReleased($event)\"\n (cdkDragEntered)=\"onDragEnter($event)\">\n <eui-chip\n #euiChipItem\n *ngIf=\"\n (maxVisibleChipsCount && isMaxVisibleChipsOpened) ||\n (maxVisibleChipsCount && maxVisibleChipsCount > i) ||\n !maxVisibleChipsCount\n \"\n [data]=\"chip.data ? chip.data : chip\"\n [id]=\"chip.id\"\n [attr.role]=\"'listitem'\"\n ariaLabel=\"{{ getChipLabel(chip) }}\"\n [euiInternalId]=\"chip.euiInternalId\"\n [isChipRemovable]=\"chip.isChipRemovable || (isChipsRemovable && chip.isRemovable) !== false\"\n [euiOutline]=\"chip.euiOutline || this.baseStatesDirective?.euiOutline || chip.isOutline\"\n [euiVariant]=\"chip.typeClass || this.baseStatesDirective?.euiVariant || chip.baseStatesDirective?.euiVariant\"\n [euiDisabled]=\"chip.euiDisabled || this.baseStatesDirective?.euiDisabled || chip.isDisabled\"\n [euiTooltip]=\"chip.tooltipMessage\"\n [position]=\"chip.tooltip?.position\"\n [contentAlignment]=\"chip.tooltip?.contentAlignment\"\n (remove)=\"onRemove($event)\">\n <eui-icon-svg *ngIf=\"chip.iconSvgName\" [icon]=\"chip.iconSvgName\"></eui-icon-svg>\n <span *ngIf=\"!chipsLabelTruncateCount\" [innerHTML]=\"getChipContent(chip)\"></span>\n <span *ngIf=\"chipsLabelTruncateCount\" title=\"{{ getChipLabel(chip) }}\">{{\n getChipLabel(chip) | euiTruncate: chipsLabelTruncateCount\n }}</span>\n </eui-chip>\n </div>\n </div>\n <ng-container *ngTemplateOutlet=\"euiChipListAppendContent\"></ng-container>\n </div>\n </div>\n <ng-container *ngTemplateOutlet=\"additionalContent\"></ng-container>\n</div>\n\n<ng-template #euiChipListAppendContent>\n <ng-content select=\"euiChipListAppendContent\"></ng-content>\n</ng-template>\n\n<ng-template #additionalContent>\n <ng-container *ngIf=\"maxVisibleChipsCount && chips && chips.length > maxVisibleChipsCount\">\n <div class=\"eui-chip-list__expand-button-wrapper\">\n <button\n euiButton\n euiBasicButton\n euiButtonSecondary\n euiSizeS\n type=\"button\"\n class=\"eui-chip-list__expand-button\"\n (click)=\"toggleTags()\"\n *ngIf=\"isMaxVisibleChipsOpened\">\n <eui-icon-svg icon=\"chevron-back:sharp\" aria-label=\"Collapse icon\"></eui-icon-svg>\n <span euiLabel *ngIf=\"toggleLinkLessLabel\">{{ toggleLinkLessLabel | translate }}</span>\n </button>\n <button\n euiButton\n euiBasicButton\n euiButtonSecondary\n euiSizeS\n type=\"button\"\n aria-haspopup=\"true\"\n class=\"eui-chip-list__expand-button\"\n (click)=\"toggleTags()\"\n *ngIf=\"!isMaxVisibleChipsOpened\">\n <span euiLabel *ngIf=\"toggleLinkMoreLabel\">{{ toggleLinkMoreLabel | translate }}</span>\n <eui-icon-svg icon=\"chevron-forward:sharp\" aria-label=\"Expand icon\"></eui-icon-svg>\n </button>\n </div>\n </ng-container>\n</ng-template>\n", styles: [".eui-chip-list{align-items:center;display:flex;margin:0;padding:0}.eui-chip-list .eui-chip-list-container{align-items:center;display:flex;width:100%}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper{align-items:center;display:flex;width:100%;flex-wrap:wrap}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__list{flex-wrap:wrap}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container{align-items:center;display:inline-flex}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container .eui-chip{margin-bottom:var(--eui-s-2xs);margin-right:var(--eui-s-2xs)}.eui-chip-list[ischipsdraganddrop] .eui-chip-list-container{width:100%}.eui-chip-list__group{display:flex;flex-wrap:wrap}.eui-chip-list__chip-container.cdk-drag:not(.cdk-drag-disabled){cursor:move!important}.eui-chip-list__custom{min-width:auto!important;width:auto!important}.eui-chip-list__chip-content{display:flex;align-items:center;gap:var(--eui-s-xs)}@media screen and (max-width: 767px){.eui-chip-list .eui-chip-list-container{flex-wrap:wrap}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-chip-list .eui-chip-list-container{flex-wrap:wrap}}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.EuiChipComponent, selector: "eui-chip, span[euiChip], li[euiChip]", inputs: ["ariaLabel", "e2eAttr", "euiInternalId", "tooltipMessage", "id", "data", "isChipRemovable", "isSquared"], outputs: ["remove"] }, { kind: "component", type: i6.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i7.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: i8.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "euiSublabel"] }, { kind: "directive", type: i9.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i9.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i9.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i10.EuiTooltipDirective, selector: "[euiTooltip]", inputs: ["e2eAttr", "showDelay", "hideDelay", "contentAlignment", "position", "isDisabled", "euiTooltip", "euiTooltipPrimary", "euiTooltipSecondary", "euiTooltipInfo", "euiTooltipSuccess", "euiTooltipWarning", "euiTooltipDanger", "euiTooltipAccent"], exportAs: ["euiTooltip"] }, { kind: "pipe", type: i11.TranslatePipe, name: "translate" }, { kind: "pipe", type: i12.EuiTruncatePipe, name: "euiTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
233
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiChipListComponent, selector: "eui-chip-list, div[euiChipList], ul[euiChipList]", inputs: { chips: "chips", toggleLinkMoreLabel: "toggleLinkMoreLabel", toggleLinkLessLabel: "toggleLinkLessLabel", chipsSortOrder: "chipsSortOrder", dragAndDropSourceName: "dragAndDropSourceName", dragAndDropConnectedTo: "dragAndDropConnectedTo", ariaLabel: "ariaLabel", dropListOrientation: "dropListOrientation", isSquared: ["isSquared", "isSquared", booleanAttribute], isChipsRemovable: ["isChipsRemovable", "isChipsRemovable", booleanAttribute], isMaxVisibleChipsOpened: ["isMaxVisibleChipsOpened", "isMaxVisibleChipsOpened", booleanAttribute], isChipsSorted: ["isChipsSorted", "isChipsSorted", booleanAttribute], isChipsDragAndDrop: ["isChipsDragAndDrop", "isChipsDragAndDrop", booleanAttribute], isGrid: ["isGrid", "isGrid", booleanAttribute], maxVisibleChipsCount: ["maxVisibleChipsCount", "maxVisibleChipsCount", numberAttribute], chipsLabelTruncateCount: ["chipsLabelTruncateCount", "chipsLabelTruncateCount", numberAttribute] }, outputs: { chipsInit: "chipsInit", chipRemove: "chipRemove", chipDragStart: "chipDragStart", chipDragRelease: "chipDragRelease", chipDrop: "chipDrop", chiplistFocus: "chiplistFocus" }, host: { properties: { "attr.aria-label": "this.ariaLabel", "class": "this.cssClasses" } }, queries: [{ propertyName: "euiChipsContent", predicate: i0.forwardRef(() => EuiChipComponent) }], viewQueries: [{ propertyName: "chipListDropList", first: true, predicate: ["chipListDropList"], descendants: true, read: CdkDropList }, { propertyName: "chipListDragAndDropItems", first: true, predicate: ["chipListDragAndDropItems"], descendants: true, read: CdkDropList }, { propertyName: "euiChipItems", predicate: ["euiChipItem"], descendants: true, read: ElementRef }], usesOnChanges: true, hostDirectives: [{ directive: i3.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent", "euiVariant", "euiVariant", "euiOutline", "euiOutline", "euiDisabled", "euiDisabled"] }], ngImport: i0, template: "<div *ngIf=\"!isGrid\" class=\"eui-chip-list-container\">\n <div class=\"eui-chip-list-wrapper\">\n <div\n role=\"list\"\n #chipList\n #chipListDropList\n #chipListDragAndDropItems\n cdkDropList\n [cdkDropListOrientation]=\"dropListOrientation\"\n [cdkDropListDisabled]=\"!isChipsDragAndDrop\"\n [cdkDropListData]=\"{ chips }\"\n [cdkDropListConnectedTo]=\"droppableArea\"\n (cdkDropListDropped)=\"drop($event)\"\n (focus)=\"onFocus()\"\n class=\"eui-chip-list__list\">\n <div\n class=\"eui-chip-list__chip-container\"\n *ngFor=\"let chip of chips; let i = index; trackBy: trackByFn\"\n cdkDrag\n [cdkDragData]=\"chip\"\n (cdkDragStarted)=\"onDragStarted($event)\"\n (cdkDragReleased)=\"onDragReleased($event)\">\n <eui-chip\n #euiChipItem\n *ngIf=\"\n (maxVisibleChipsCount && isMaxVisibleChipsOpened) ||\n (maxVisibleChipsCount && maxVisibleChipsCount > i) ||\n !maxVisibleChipsCount\n \"\n [data]=\"chip.data ? chip.data : chip\"\n [attr.role]=\"'listitem'\"\n ariaLabel=\"{{ getChipLabel(chip) }}\"\n [euiInternalId]=\"chip.euiInternalId\"\n [isChipRemovable]=\"chip.isChipRemovable || (isChipsRemovable && chip.isRemovable) !== false\"\n [euiOutline]=\"chip.euiOutline || this.baseStatesDirective?.euiOutline || chip.isOutline\"\n [euiVariant]=\"chip.typeClass || this.baseStatesDirective?.euiVariant || chip.baseStatesDirective?.euiVariant\"\n [euiDisabled]=\"chip.euiDisabled || this.baseStatesDirective?.euiDisabled || chip.isDisabled\"\n [euiTooltip]=\"chip.tooltipMessage\"\n [position]=\"chip.tooltip?.position\"\n [contentAlignment]=\"chip.tooltip?.contentAlignment\"\n (remove)=\"onRemove($event)\">\n <eui-icon-svg *ngIf=\"chip.iconSvgName\" [icon]=\"chip.iconSvgName\"></eui-icon-svg>\n <span *ngIf=\"chip.iconClass\" class=\"{{ chip.iconClass }}\"></span>\n <span class=\"eui-chip-list__chip-content\" *ngIf=\"!chipsLabelTruncateCount\" [innerHTML]=\"getChipContent(chip)\"></span>\n <span *ngIf=\"chipsLabelTruncateCount\" title=\"{{ getChipLabel(chip) }}\">{{\n getChipLabel(chip) | euiTruncate: chipsLabelTruncateCount\n }}</span>\n </eui-chip>\n </div>\n <ng-container *ngTemplateOutlet=\"euiChipListAppendContent\"></ng-container>\n </div>\n </div>\n <ng-container *ngTemplateOutlet=\"additionalContent\"></ng-container>\n</div>\n\n<div *ngIf=\"isGrid\" class=\"eui-chip-list-container\">\n <div class=\"eui-chip-list-wrapper\">\n <div class=\"eui-chip-list__group\" cdkDropListGroup>\n <div\n role=\"list\"\n #chipList\n #chipListDropList\n #chipListDragAndDropItems\n cdkDropList\n *ngFor=\"let chip of chips; let i = index\"\n [cdkDropListDisabled]=\"!isChipsDragAndDrop\"\n [cdkDropListData]=\"{ chip: chip, index: i }\"\n (focus)=\"onFocus()\"\n (cdkDropListDropped)=\"onDropGrid($event)\"\n class=\"eui-chip-list__custom\">\n <div\n class=\"eui-chip-list__chip-container\"\n cdkDrag\n [cdkDragData]=\"{ chip: chip, index: i }\"\n (cdkDragStarted)=\"onDragStarted($event)\"\n (cdkDragReleased)=\"onDragReleased($event)\"\n (cdkDragEntered)=\"onDragEnter($event)\">\n <eui-chip\n #euiChipItem\n *ngIf=\"\n (maxVisibleChipsCount && isMaxVisibleChipsOpened) ||\n (maxVisibleChipsCount && maxVisibleChipsCount > i) ||\n !maxVisibleChipsCount\n \"\n [data]=\"chip.data ? chip.data : chip\"\n [id]=\"chip.id\"\n [attr.role]=\"'listitem'\"\n ariaLabel=\"{{ getChipLabel(chip) }}\"\n [euiInternalId]=\"chip.euiInternalId\"\n [isChipRemovable]=\"chip.isChipRemovable || (isChipsRemovable && chip.isRemovable) !== false\"\n [euiOutline]=\"chip.euiOutline || this.baseStatesDirective?.euiOutline || chip.isOutline\"\n [euiVariant]=\"chip.typeClass || this.baseStatesDirective?.euiVariant || chip.baseStatesDirective?.euiVariant\"\n [euiDisabled]=\"chip.euiDisabled || this.baseStatesDirective?.euiDisabled || chip.isDisabled\"\n [euiTooltip]=\"chip.tooltipMessage\"\n [position]=\"chip.tooltip?.position\"\n [contentAlignment]=\"chip.tooltip?.contentAlignment\"\n (remove)=\"onRemove($event)\">\n <eui-icon-svg *ngIf=\"chip.iconSvgName\" [icon]=\"chip.iconSvgName\"></eui-icon-svg>\n <span *ngIf=\"!chipsLabelTruncateCount\" [innerHTML]=\"getChipContent(chip)\"></span>\n <span *ngIf=\"chipsLabelTruncateCount\" title=\"{{ getChipLabel(chip) }}\">{{\n getChipLabel(chip) | euiTruncate: chipsLabelTruncateCount\n }}</span>\n </eui-chip>\n </div>\n </div>\n <ng-container *ngTemplateOutlet=\"euiChipListAppendContent\"></ng-container>\n </div>\n </div>\n <ng-container *ngTemplateOutlet=\"additionalContent\"></ng-container>\n</div>\n\n<ng-template #euiChipListAppendContent>\n <ng-content select=\"euiChipListAppendContent\"></ng-content>\n</ng-template>\n\n<ng-template #additionalContent>\n <ng-container *ngIf=\"maxVisibleChipsCount && chips && chips.length > maxVisibleChipsCount\">\n <div class=\"eui-chip-list__expand-button-wrapper\">\n <button\n euiButton\n euiBasicButton\n euiButtonSecondary\n euiSizeS\n type=\"button\"\n class=\"eui-chip-list__expand-button\"\n (click)=\"toggleTags()\"\n *ngIf=\"isMaxVisibleChipsOpened\">\n <eui-icon-svg icon=\"chevron-back:sharp\" aria-label=\"Collapse icon\"></eui-icon-svg>\n <span euiLabel *ngIf=\"toggleLinkLessLabel\">{{ toggleLinkLessLabel | translate }}</span>\n </button>\n <button\n euiButton\n euiBasicButton\n euiButtonSecondary\n euiSizeS\n type=\"button\"\n aria-haspopup=\"true\"\n class=\"eui-chip-list__expand-button\"\n (click)=\"toggleTags()\"\n *ngIf=\"!isMaxVisibleChipsOpened\">\n <span euiLabel *ngIf=\"toggleLinkMoreLabel\">{{ toggleLinkMoreLabel | translate }}</span>\n <eui-icon-svg icon=\"chevron-forward:sharp\" aria-label=\"Expand icon\"></eui-icon-svg>\n </button>\n </div>\n </ng-container>\n</ng-template>\n", styles: [".eui-chip-list{align-items:center;display:flex;margin:0;padding:0}.eui-chip-list .eui-chip-list-container{align-items:center;display:flex;width:100%}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper{align-items:center;display:flex;width:100%;flex-wrap:wrap}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__list{flex-wrap:wrap}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container{align-items:center;display:inline-flex}.eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container .eui-chip{margin-bottom:var(--eui-s-2xs);margin-right:var(--eui-s-2xs)}.eui-chip-list[ischipsdraganddrop] .eui-chip-list-container{width:100%}.eui-chip-list__group{display:flex;flex-wrap:wrap}.eui-chip-list__chip-container.cdk-drag:not(.cdk-drag-disabled){cursor:move!important}.eui-chip-list__custom{min-width:auto!important;width:auto!important}.eui-chip-list__chip-content{display:flex;align-items:center;gap:var(--eui-s-xs)}@media screen and (max-width: 767px){.eui-chip-list .eui-chip-list-container{flex-wrap:wrap}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-chip-list .eui-chip-list-container{flex-wrap:wrap}}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.EuiChipComponent, selector: "eui-chip, span[euiChip], li[euiChip]", inputs: ["ariaLabel", "e2eAttr", "euiInternalId", "tooltipMessage", "id", "data", "isChipRemovable", "isSquared", "isFilled"], outputs: ["remove"] }, { kind: "component", type: i6.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i7.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: i8.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "euiSublabel"] }, { kind: "directive", type: i9.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i9.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i9.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i10.EuiTooltipDirective, selector: "[euiTooltip]", inputs: ["e2eAttr", "showDelay", "hideDelay", "contentAlignment", "position", "isDisabled", "euiTooltip", "euiTooltipPrimary", "euiTooltipSecondary", "euiTooltipInfo", "euiTooltipSuccess", "euiTooltipWarning", "euiTooltipDanger", "euiTooltipAccent"], exportAs: ["euiTooltip"] }, { kind: "pipe", type: i11.TranslatePipe, name: "translate" }, { kind: "pipe", type: i12.EuiTruncatePipe, name: "euiTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
234
234
|
}
|
|
235
235
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiChipListComponent, decorators: [{
|
|
236
236
|
type: Component,
|