@eui/components 19.0.2-snapshot-1734693575503 → 19.0.2-snapshot-1735563469920

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.
Files changed (90) hide show
  1. package/docs/components/EuiAppBreadcrumbComponent.html +4 -4
  2. package/docs/components/EuiAppComponent.html +4 -4
  3. package/docs/components/EuiAppFooterComponent.html +4 -4
  4. package/docs/components/EuiAppHeaderComponent.html +4 -4
  5. package/docs/components/EuiAppToolbarComponent.html +4 -4
  6. package/docs/components/EuiAppTopMessageComponent.html +4 -4
  7. package/docs/components/EuiProgressBarComponent.html +1 -1
  8. package/docs/dependencies.html +2 -2
  9. package/docs/js/menu-wc.js +3 -3
  10. package/docs/js/menu-wc_es5.js +1 -1
  11. package/docs/js/search/search_index.js +2 -2
  12. package/docs/modules/EuiProgressBarModule.html +3 -0
  13. package/eui-progress-bar/eui-progress-bar.module.d.ts +2 -1
  14. package/eui-progress-bar/eui-progress-bar.module.d.ts.map +1 -1
  15. package/fesm2022/eui-components-eui-alert.mjs +2 -2
  16. package/fesm2022/eui-components-eui-alert.mjs.map +1 -1
  17. package/fesm2022/eui-components-eui-autocomplete.mjs +2 -2
  18. package/fesm2022/eui-components-eui-autocomplete.mjs.map +1 -1
  19. package/fesm2022/eui-components-eui-avatar.mjs +6 -6
  20. package/fesm2022/eui-components-eui-avatar.mjs.map +1 -1
  21. package/fesm2022/eui-components-eui-badge.mjs +2 -2
  22. package/fesm2022/eui-components-eui-badge.mjs.map +1 -1
  23. package/fesm2022/eui-components-eui-block-content.mjs +2 -2
  24. package/fesm2022/eui-components-eui-block-content.mjs.map +1 -1
  25. package/fesm2022/eui-components-eui-block-document.mjs +2 -2
  26. package/fesm2022/eui-components-eui-block-document.mjs.map +1 -1
  27. package/fesm2022/eui-components-eui-breadcrumb.mjs +2 -2
  28. package/fesm2022/eui-components-eui-breadcrumb.mjs.map +1 -1
  29. package/fesm2022/eui-components-eui-button.mjs +2 -2
  30. package/fesm2022/eui-components-eui-button.mjs.map +1 -1
  31. package/fesm2022/eui-components-eui-card.mjs +2 -2
  32. package/fesm2022/eui-components-eui-card.mjs.map +1 -1
  33. package/fesm2022/eui-components-eui-chip.mjs +2 -2
  34. package/fesm2022/eui-components-eui-chip.mjs.map +1 -1
  35. package/fesm2022/eui-components-eui-dashboard-card.mjs +2 -2
  36. package/fesm2022/eui-components-eui-dashboard-card.mjs.map +1 -1
  37. package/fesm2022/eui-components-eui-dialog.mjs +4 -4
  38. package/fesm2022/eui-components-eui-dialog.mjs.map +1 -1
  39. package/fesm2022/eui-components-eui-discussion-thread.mjs +2 -2
  40. package/fesm2022/eui-components-eui-discussion-thread.mjs.map +1 -1
  41. package/fesm2022/eui-components-eui-dropdown.mjs +4 -4
  42. package/fesm2022/eui-components-eui-dropdown.mjs.map +1 -1
  43. package/fesm2022/eui-components-eui-feedback-message.mjs +2 -2
  44. package/fesm2022/eui-components-eui-feedback-message.mjs.map +1 -1
  45. package/fesm2022/eui-components-eui-fieldset.mjs +2 -2
  46. package/fesm2022/eui-components-eui-fieldset.mjs.map +1 -1
  47. package/fesm2022/eui-components-eui-file-upload.mjs +2 -2
  48. package/fesm2022/eui-components-eui-file-upload.mjs.map +1 -1
  49. package/fesm2022/eui-components-eui-growl.mjs +2 -2
  50. package/fesm2022/eui-components-eui-growl.mjs.map +1 -1
  51. package/fesm2022/eui-components-eui-input-checkbox.mjs +2 -2
  52. package/fesm2022/eui-components-eui-input-checkbox.mjs.map +1 -1
  53. package/fesm2022/eui-components-eui-label.mjs +2 -2
  54. package/fesm2022/eui-components-eui-label.mjs.map +1 -1
  55. package/fesm2022/eui-components-eui-list.mjs +2 -2
  56. package/fesm2022/eui-components-eui-list.mjs.map +1 -1
  57. package/fesm2022/eui-components-eui-menu.mjs +4 -4
  58. package/fesm2022/eui-components-eui-menu.mjs.map +1 -1
  59. package/fesm2022/eui-components-eui-navbar.mjs +2 -2
  60. package/fesm2022/eui-components-eui-navbar.mjs.map +1 -1
  61. package/fesm2022/eui-components-eui-overlay.mjs +2 -2
  62. package/fesm2022/eui-components-eui-overlay.mjs.map +1 -1
  63. package/fesm2022/eui-components-eui-page.mjs +2 -2
  64. package/fesm2022/eui-components-eui-page.mjs.map +1 -1
  65. package/fesm2022/eui-components-eui-progress-bar.mjs +7 -6
  66. package/fesm2022/eui-components-eui-progress-bar.mjs.map +1 -1
  67. package/fesm2022/eui-components-eui-progress-circle.mjs +2 -2
  68. package/fesm2022/eui-components-eui-progress-circle.mjs.map +1 -1
  69. package/fesm2022/eui-components-eui-slide-toggle.mjs +2 -2
  70. package/fesm2022/eui-components-eui-slide-toggle.mjs.map +1 -1
  71. package/fesm2022/eui-components-eui-table.mjs +2 -2
  72. package/fesm2022/eui-components-eui-table.mjs.map +1 -1
  73. package/fesm2022/eui-components-eui-tabs.mjs +4 -4
  74. package/fesm2022/eui-components-eui-tabs.mjs.map +1 -1
  75. package/fesm2022/eui-components-eui-timebar.mjs +2 -2
  76. package/fesm2022/eui-components-eui-timebar.mjs.map +1 -1
  77. package/fesm2022/eui-components-eui-timeline.mjs +2 -2
  78. package/fesm2022/eui-components-eui-timeline.mjs.map +1 -1
  79. package/fesm2022/eui-components-eui-timepicker.mjs +2 -2
  80. package/fesm2022/eui-components-eui-timepicker.mjs.map +1 -1
  81. package/fesm2022/eui-components-eui-tree-list.mjs +2 -2
  82. package/fesm2022/eui-components-eui-tree-list.mjs.map +1 -1
  83. package/fesm2022/eui-components-externals-eui-editor.mjs +2 -2
  84. package/fesm2022/eui-components-externals-eui-editor.mjs.map +1 -1
  85. package/fesm2022/eui-components-layout.mjs +14 -14
  86. package/fesm2022/eui-components-layout.mjs.map +1 -1
  87. package/layout/eui-app/eui-app-toolbar/toolbar.component.d.ts.map +1 -1
  88. package/layout/eui-app/eui-app-top-message/top-message.component.d.ts.map +1 -1
  89. package/layout/eui-app/eui-app.component.d.ts.map +1 -1
  90. package/package.json +15 -15
package/docs/modules/EuiProgressBarModule.html CHANGED
@@ -133,6 +133,9 @@
133
133
  <li class="list-group-item">
134
134
  <a href="../modules/EuiIconModule.html">EuiIconModule</a>
135
135
  </li>
136
+ <li class="list-group-item">
137
+ <a href="../modules/EuiIconStateModule.html">EuiIconStateModule</a>
138
+ </li>
136
139
  </ul>
137
140
  </div>
138
141
  <div class="col-sm-3">
package/eui-progress-bar/eui-progress-bar.module.d.ts CHANGED
@@ -2,9 +2,10 @@ import * as i0 from "@angular/core";
2
2
  import * as i1 from "./eui-progress-bar.component";
3
3
  import * as i2 from "@angular/common";
4
4
  import * as i3 from "@eui/components/eui-icon";
5
+ import * as i4 from "@eui/components/eui-icon-state";
5
6
  export declare class EuiProgressBarModule {
6
7
  static ɵfac: i0.ɵɵFactoryDeclaration<EuiProgressBarModule, never>;
7
- static ɵmod: i0.ɵɵNgModuleDeclaration<EuiProgressBarModule, [typeof i1.EuiProgressBarComponent], [typeof i2.CommonModule, typeof i3.EuiIconModule], [typeof i1.EuiProgressBarComponent]>;
8
+ static ɵmod: i0.ɵɵNgModuleDeclaration<EuiProgressBarModule, [typeof i1.EuiProgressBarComponent], [typeof i2.CommonModule, typeof i3.EuiIconModule, typeof i4.EuiIconStateModule], [typeof i1.EuiProgressBarComponent]>;
8
9
  static ɵinj: i0.ɵɵInjectorDeclaration<EuiProgressBarModule>;
9
10
  }
10
11
  //# sourceMappingURL=eui-progress-bar.module.d.ts.map
package/eui-progress-bar/eui-progress-bar.module.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"eui-progress-bar.module.d.ts","sourceRoot":"","sources":["../../eui-progress-bar/eui-progress-bar.module.ts"],"names":[],"mappings":";;;;AAMA,qBAKa,oBAAoB;yCAApB,oBAAoB;0CAApB,oBAAoB;0CAApB,oBAAoB;CAAG"}
1
+ {"version":3,"file":"eui-progress-bar.module.d.ts","sourceRoot":"","sources":["../../eui-progress-bar/eui-progress-bar.module.ts"],"names":[],"mappings":";;;;;AAOA,qBAKa,oBAAoB;yCAApB,oBAAoB;0CAApB,oBAAoB;0CAApB,oBAAoB;CAAG"}
package/fesm2022/eui-components-eui-alert.mjs CHANGED
@@ -71,7 +71,7 @@ class EuiAlertComponent {
71
71
  this.closeAlert.emit(false);
72
72
  }
73
73
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiAlertComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
74
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiAlertComponent, isStandalone: false, selector: "div[euiAlert], eui-alert", inputs: { ariaDescribedBy: "ariaDescribedBy", e2eAttr: "e2eAttr", isMuted: ["isMuted", "isMuted", booleanAttribute], isBordered: ["isBordered", "isBordered", 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: ["euiPrimary", "euiPrimary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant"] }], ngImport: i0, template: "@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 ariaLabel=\"Close alert icon\"/>\n}\n", styles: [".eui-19 :host.eui-alert{--eui-alert-padding: var(--eui-s-m);--eui-alert-title-font: var(--eui-f-m-compact-bold);--eui-alert-border-radius: var(--eui-br-s);--eui-alert-color-default-bg: var(--eui-c-info-bg);--eui-alert-color-default-text: var(--eui-c-text);--eui-alert-color-default-title-text: var(--eui-c-info-dark);--eui-alert-color-default-border: var(--eui-c-info-dark);--eui-alert-color-default-close-text: var(--eui-c-text);--eui-alert-color-default-close-hover-bg: var(--eui-c-info-lightest);--eui-alert-color-info-bg: var(--eui-c-info-bg);--eui-alert-color-info-text: var(--eui-c-text);--eui-alert-color-info-title-text: var(--eui-c-info-dark);--eui-alert-color-info-border: var(--eui-c-info-dark);--eui-alert-color-info-close-text: var(--eui-c-text);--eui-alert-color-info-close-hover-bg: var(--eui-c-info-lightest);--eui-alert-color-success-bg: var(--eui-c-success-bg);--eui-alert-color-success-text: var(--eui-c-text);--eui-alert-color-success-title-text: var(--eui-c-success-darker);--eui-alert-color-success-border: var(--eui-c-success-darker);--eui-alert-color-success-close-text: var(--eui-c-text);--eui-alert-color-success-close-hover-bg: var(--eui-c-success-lightest);--eui-alert-color-warning-bg: var(--eui-c-warning-bg);--eui-alert-color-warning-text: var(--eui-c-text);--eui-alert-color-warning-title-text: var(--eui-c-warning-darker);--eui-alert-color-warning-border: var(--eui-c-warning-darker);--eui-alert-color-warning-close-text: var(--eui-c-text);--eui-alert-color-warning-close-hover-bg: var(--eui-c-warning-lightest);--eui-alert-color-danger-bg: var(--eui-c-danger-bg);--eui-alert-color-danger-text: var(--eui-c-text);--eui-alert-color-danger-title-text: var(--eui-c-danger-dark);--eui-alert-color-danger-border: var(--eui-c-danger-dark);--eui-alert-color-danger-close-text: var(--eui-c-text);--eui-alert-color-danger-close-hover-bg: var(--eui-c-danger-lightest);--eui-alert-color-bordered-bg: var(--eui-c-neutral-bg-lighter);--eui-alert-color-bordered-close-hover-bg: var(--eui-c-neutral-bg)}.eui-19 :host.eui-alert{--_padding: var(--eui-alert-padding);--_border-radius: var(--eui-alert-border-radius);--_title-font: var(--eui-alert-title-font);--_color: var(--eui-alert-color-default-text);--_title-color: var( --eui-alert-color-default-title-text);--_bg-color: var( --eui-alert-color-default-bg);--_close-hover-color: var(--eui-alert-color-default-close-hover-bg)}.eui-19 :host.eui-alert--info{--_color: var(--eui-alert-color-info-text);--_title-color: var( --eui-alert-color-info-title-text);--_bg-color: var( --eui-alert-color-info-bg);--_close-hover-color: var(--eui-alert-color-info-close-hover-bg)}.eui-19 :host.eui-alert--success{--_color: var(--eui-alert-color-success-text);--_title-color: var( --eui-alert-color-success-title-text);--_bg-color: var( --eui-alert-color-success-bg);--_close-hover-color: var(--eui-alert-color-success-close-hover-bg)}.eui-19 :host.eui-alert--danger{--_color: var(--eui-alert-color-danger-text);--_title-color: var( --eui-alert-color-danger-title-text);--_bg-color: var( --eui-alert-color-danger-bg);--_close-hover-color: var(--eui-alert-color-danger-close-hover-bg)}.eui-19 :host.eui-alert--warning{--_color: var(--eui-alert-color-warning-text);--_title-color: var( --eui-alert-color-warning-title-text);--_bg-color: var( --eui-alert-color-warning-bg);--_close-hover-color: var(--eui-alert-color-warning-close-hover-bg)}.eui-19 :host.eui-alert--bordered{--_border-color: var(--eui-alert-color-default-border);--_bg-color: var(--eui-alert-color-bordered-bg);--_close-hover-color: var(--eui-alert-color-bordered-close-hover-bg)}.eui-19 :host.eui-alert--bordered.eui-alert--info{--_border-color: var(--eui-alert-color-info-border)}.eui-19 :host.eui-alert--bordered.eui-alert--success{--_border-color: var(--eui-alert-color-success-border)}.eui-19 :host.eui-alert--bordered.eui-alert--danger{--_border-color: var(--eui-alert-color-danger-border)}.eui-19 :host.eui-alert--bordered.eui-alert--warning{--_border-color: var(--eui-alert-color-warning-border)}.eui-19 :host.eui-alert{display:flex;padding:var(--_padding);background-color:var(--_bg-color);position:relative;border-radius:var(--_border-radius);color:var(--_color)}.eui-19 :host.eui-alert .eui-alert-container{display:flex;flex-direction:column;row-gap:var(--eui-s-s)}.eui-19 :host.eui-alert .eui-alert-title-wrapper{display:flex;align-items:center}.eui-19 :host.eui-alert .eui-alert-icon{margin-right:var(--eui-s-xs)}.eui-19 :host.eui-alert ::ng-deep .eui-alert-title{color:var(--_title-color);font:var(--_title-font)}.eui-19 :host.eui-alert .eui-alert-content{display:block}.eui-19 :host.eui-alert .eui-alert-content p:first-child{margin-top:0}.eui-19 :host.eui-alert .eui-alert-content p:last-child{margin-bottom:0}.eui-19 :host.eui-alert .eui-alert-close{position:absolute;top:var(--eui-s-xs);right:var(--eui-s-xs)}.eui-19 :host.eui-alert .eui-alert-close ::ng-deep .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-19 :host.eui-alert--hidden{display:none}.eui-19 :host.eui-alert--focusable:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-alert--bordered{border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-left:var(--eui-bw-m) solid var(--_border-color)}.eui-19 :host.eui-alert--closeable{padding-right:var(--eui-s-4xl)}\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 }); }
74
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiAlertComponent, isStandalone: false, selector: "div[euiAlert], eui-alert", inputs: { ariaDescribedBy: "ariaDescribedBy", e2eAttr: "e2eAttr", isMuted: ["isMuted", "isMuted", booleanAttribute], isBordered: ["isBordered", "isBordered", 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: ["euiPrimary", "euiPrimary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant"] }], ngImport: i0, template: "@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 ariaLabel=\"Close alert icon\"/>\n}\n", styles: [".eui-19 :host.eui-alert{--_padding: var(--eui-s-m);--_border-radius: var(--eui-br-s);--_title-font: var(--eui-f-m-compact-bold);--_color: var(--eui-c-text);--_title-color: var(--eui-c-info-dark);--_bg-color: var(--eui-c-info-bg);--_close-hover-color: var(--eui-c-info-lightest)}.eui-19 :host.eui-alert--info{--_color: var(--eui-c-text);--_title-color: var(--eui-c-info-dark);--_bg-color: var(--eui-c-info-bg);--_close-hover-color: var(--eui-c-info-lightest)}.eui-19 :host.eui-alert--success{--_color: var(--eui-c-text);--_title-color: var(--eui-c-success-darker);--_bg-color: var(--eui-c-success-bg);--_close-hover-color: var(--eui-c-success-lightest)}.eui-19 :host.eui-alert--danger{--_color: var(--eui-c-text);--_title-color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-bg);--_close-hover-color: var(--eui-c-danger-lightest)}.eui-19 :host.eui-alert--warning{--_color: var(--eui-c-text);--_title-color: var(--eui-c-warning-darker);--_bg-color: var(--eui-c-warning-bg);--_close-hover-color: var(--eui-c-warning-lightest)}.eui-19 :host.eui-alert--bordered{--_border-color: var(--eui-c-info-dark);--_bg-color: var(--eui-c-neutral-min);--_close-hover-color: var(--eui-c-neutral-bg)}.eui-19 :host.eui-alert--bordered.eui-alert--info{--_border-color: var(--eui-c-info-dark)}.eui-19 :host.eui-alert--bordered.eui-alert--success{--_border-color: var(--eui-c-success-darker)}.eui-19 :host.eui-alert--bordered.eui-alert--danger{--_border-color: var(--eui-c-danger-dark)}.eui-19 :host.eui-alert--bordered.eui-alert--warning{--_border-color: var(--eui-c-warning-darker)}.eui-19 :host.eui-alert{display:flex;padding:var(--_padding);background-color:var(--_bg-color);position:relative;border-radius:var(--_border-radius);color:var(--_color)}.eui-19 :host.eui-alert .eui-alert-container{display:flex;flex-direction:column;row-gap:var(--eui-s-s)}.eui-19 :host.eui-alert .eui-alert-title-wrapper{display:flex;align-items:center}.eui-19 :host.eui-alert .eui-alert-icon{margin-right:var(--eui-s-xs)}.eui-19 :host.eui-alert ::ng-deep .eui-alert-title{color:var(--_title-color);font:var(--_title-font)}.eui-19 :host.eui-alert .eui-alert-content{display:block}.eui-19 :host.eui-alert .eui-alert-content p:first-child{margin-top:0}.eui-19 :host.eui-alert .eui-alert-content p:last-child{margin-bottom:0}.eui-19 :host.eui-alert .eui-alert-close{position:absolute;top:var(--eui-s-xs);right:var(--eui-s-xs)}.eui-19 :host.eui-alert .eui-alert-close ::ng-deep .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-19 :host.eui-alert--hidden{display:none}.eui-19 :host.eui-alert--focusable:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-alert--bordered{border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-left:var(--eui-bw-m) solid var(--_border-color)}.eui-19 :host.eui-alert--closeable{padding-right:var(--eui-s-4xl)}\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 }); }
75
75
  }
76
76
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiAlertComponent, decorators: [{
77
77
  type: Component,
@@ -87,7 +87,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
87
87
  'euiVariant',
88
88
  ],
89
89
  },
90
- ], template: "@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 ariaLabel=\"Close alert icon\"/>\n}\n", styles: [".eui-19 :host.eui-alert{--eui-alert-padding: var(--eui-s-m);--eui-alert-title-font: var(--eui-f-m-compact-bold);--eui-alert-border-radius: var(--eui-br-s);--eui-alert-color-default-bg: var(--eui-c-info-bg);--eui-alert-color-default-text: var(--eui-c-text);--eui-alert-color-default-title-text: var(--eui-c-info-dark);--eui-alert-color-default-border: var(--eui-c-info-dark);--eui-alert-color-default-close-text: var(--eui-c-text);--eui-alert-color-default-close-hover-bg: var(--eui-c-info-lightest);--eui-alert-color-info-bg: var(--eui-c-info-bg);--eui-alert-color-info-text: var(--eui-c-text);--eui-alert-color-info-title-text: var(--eui-c-info-dark);--eui-alert-color-info-border: var(--eui-c-info-dark);--eui-alert-color-info-close-text: var(--eui-c-text);--eui-alert-color-info-close-hover-bg: var(--eui-c-info-lightest);--eui-alert-color-success-bg: var(--eui-c-success-bg);--eui-alert-color-success-text: var(--eui-c-text);--eui-alert-color-success-title-text: var(--eui-c-success-darker);--eui-alert-color-success-border: var(--eui-c-success-darker);--eui-alert-color-success-close-text: var(--eui-c-text);--eui-alert-color-success-close-hover-bg: var(--eui-c-success-lightest);--eui-alert-color-warning-bg: var(--eui-c-warning-bg);--eui-alert-color-warning-text: var(--eui-c-text);--eui-alert-color-warning-title-text: var(--eui-c-warning-darker);--eui-alert-color-warning-border: var(--eui-c-warning-darker);--eui-alert-color-warning-close-text: var(--eui-c-text);--eui-alert-color-warning-close-hover-bg: var(--eui-c-warning-lightest);--eui-alert-color-danger-bg: var(--eui-c-danger-bg);--eui-alert-color-danger-text: var(--eui-c-text);--eui-alert-color-danger-title-text: var(--eui-c-danger-dark);--eui-alert-color-danger-border: var(--eui-c-danger-dark);--eui-alert-color-danger-close-text: var(--eui-c-text);--eui-alert-color-danger-close-hover-bg: var(--eui-c-danger-lightest);--eui-alert-color-bordered-bg: var(--eui-c-neutral-bg-lighter);--eui-alert-color-bordered-close-hover-bg: var(--eui-c-neutral-bg)}.eui-19 :host.eui-alert{--_padding: var(--eui-alert-padding);--_border-radius: var(--eui-alert-border-radius);--_title-font: var(--eui-alert-title-font);--_color: var(--eui-alert-color-default-text);--_title-color: var( --eui-alert-color-default-title-text);--_bg-color: var( --eui-alert-color-default-bg);--_close-hover-color: var(--eui-alert-color-default-close-hover-bg)}.eui-19 :host.eui-alert--info{--_color: var(--eui-alert-color-info-text);--_title-color: var( --eui-alert-color-info-title-text);--_bg-color: var( --eui-alert-color-info-bg);--_close-hover-color: var(--eui-alert-color-info-close-hover-bg)}.eui-19 :host.eui-alert--success{--_color: var(--eui-alert-color-success-text);--_title-color: var( --eui-alert-color-success-title-text);--_bg-color: var( --eui-alert-color-success-bg);--_close-hover-color: var(--eui-alert-color-success-close-hover-bg)}.eui-19 :host.eui-alert--danger{--_color: var(--eui-alert-color-danger-text);--_title-color: var( --eui-alert-color-danger-title-text);--_bg-color: var( --eui-alert-color-danger-bg);--_close-hover-color: var(--eui-alert-color-danger-close-hover-bg)}.eui-19 :host.eui-alert--warning{--_color: var(--eui-alert-color-warning-text);--_title-color: var( --eui-alert-color-warning-title-text);--_bg-color: var( --eui-alert-color-warning-bg);--_close-hover-color: var(--eui-alert-color-warning-close-hover-bg)}.eui-19 :host.eui-alert--bordered{--_border-color: var(--eui-alert-color-default-border);--_bg-color: var(--eui-alert-color-bordered-bg);--_close-hover-color: var(--eui-alert-color-bordered-close-hover-bg)}.eui-19 :host.eui-alert--bordered.eui-alert--info{--_border-color: var(--eui-alert-color-info-border)}.eui-19 :host.eui-alert--bordered.eui-alert--success{--_border-color: var(--eui-alert-color-success-border)}.eui-19 :host.eui-alert--bordered.eui-alert--danger{--_border-color: var(--eui-alert-color-danger-border)}.eui-19 :host.eui-alert--bordered.eui-alert--warning{--_border-color: var(--eui-alert-color-warning-border)}.eui-19 :host.eui-alert{display:flex;padding:var(--_padding);background-color:var(--_bg-color);position:relative;border-radius:var(--_border-radius);color:var(--_color)}.eui-19 :host.eui-alert .eui-alert-container{display:flex;flex-direction:column;row-gap:var(--eui-s-s)}.eui-19 :host.eui-alert .eui-alert-title-wrapper{display:flex;align-items:center}.eui-19 :host.eui-alert .eui-alert-icon{margin-right:var(--eui-s-xs)}.eui-19 :host.eui-alert ::ng-deep .eui-alert-title{color:var(--_title-color);font:var(--_title-font)}.eui-19 :host.eui-alert .eui-alert-content{display:block}.eui-19 :host.eui-alert .eui-alert-content p:first-child{margin-top:0}.eui-19 :host.eui-alert .eui-alert-content p:last-child{margin-bottom:0}.eui-19 :host.eui-alert .eui-alert-close{position:absolute;top:var(--eui-s-xs);right:var(--eui-s-xs)}.eui-19 :host.eui-alert .eui-alert-close ::ng-deep .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-19 :host.eui-alert--hidden{display:none}.eui-19 :host.eui-alert--focusable:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-alert--bordered{border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-left:var(--eui-bw-m) solid var(--_border-color)}.eui-19 :host.eui-alert--closeable{padding-right:var(--eui-s-4xl)}\n"] }]
90
+ ], template: "@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 ariaLabel=\"Close alert icon\"/>\n}\n", styles: [".eui-19 :host.eui-alert{--_padding: var(--eui-s-m);--_border-radius: var(--eui-br-s);--_title-font: var(--eui-f-m-compact-bold);--_color: var(--eui-c-text);--_title-color: var(--eui-c-info-dark);--_bg-color: var(--eui-c-info-bg);--_close-hover-color: var(--eui-c-info-lightest)}.eui-19 :host.eui-alert--info{--_color: var(--eui-c-text);--_title-color: var(--eui-c-info-dark);--_bg-color: var(--eui-c-info-bg);--_close-hover-color: var(--eui-c-info-lightest)}.eui-19 :host.eui-alert--success{--_color: var(--eui-c-text);--_title-color: var(--eui-c-success-darker);--_bg-color: var(--eui-c-success-bg);--_close-hover-color: var(--eui-c-success-lightest)}.eui-19 :host.eui-alert--danger{--_color: var(--eui-c-text);--_title-color: var(--eui-c-danger-dark);--_bg-color: var(--eui-c-danger-bg);--_close-hover-color: var(--eui-c-danger-lightest)}.eui-19 :host.eui-alert--warning{--_color: var(--eui-c-text);--_title-color: var(--eui-c-warning-darker);--_bg-color: var(--eui-c-warning-bg);--_close-hover-color: var(--eui-c-warning-lightest)}.eui-19 :host.eui-alert--bordered{--_border-color: var(--eui-c-info-dark);--_bg-color: var(--eui-c-neutral-min);--_close-hover-color: var(--eui-c-neutral-bg)}.eui-19 :host.eui-alert--bordered.eui-alert--info{--_border-color: var(--eui-c-info-dark)}.eui-19 :host.eui-alert--bordered.eui-alert--success{--_border-color: var(--eui-c-success-darker)}.eui-19 :host.eui-alert--bordered.eui-alert--danger{--_border-color: var(--eui-c-danger-dark)}.eui-19 :host.eui-alert--bordered.eui-alert--warning{--_border-color: var(--eui-c-warning-darker)}.eui-19 :host.eui-alert{display:flex;padding:var(--_padding);background-color:var(--_bg-color);position:relative;border-radius:var(--_border-radius);color:var(--_color)}.eui-19 :host.eui-alert .eui-alert-container{display:flex;flex-direction:column;row-gap:var(--eui-s-s)}.eui-19 :host.eui-alert .eui-alert-title-wrapper{display:flex;align-items:center}.eui-19 :host.eui-alert .eui-alert-icon{margin-right:var(--eui-s-xs)}.eui-19 :host.eui-alert ::ng-deep .eui-alert-title{color:var(--_title-color);font:var(--_title-font)}.eui-19 :host.eui-alert .eui-alert-content{display:block}.eui-19 :host.eui-alert .eui-alert-content p:first-child{margin-top:0}.eui-19 :host.eui-alert .eui-alert-content p:last-child{margin-bottom:0}.eui-19 :host.eui-alert .eui-alert-close{position:absolute;top:var(--eui-s-xs);right:var(--eui-s-xs)}.eui-19 :host.eui-alert .eui-alert-close ::ng-deep .eui-icon-button__button:hover{background-color:var(--_close-hover-color)}.eui-19 :host.eui-alert--hidden{display:none}.eui-19 :host.eui-alert--focusable:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 :host.eui-alert--bordered{border:var(--eui-bw-xs) solid var(--eui-c-neutral-lightest);border-left:var(--eui-bw-m) solid var(--_border-color)}.eui-19 :host.eui-alert--closeable{padding-right:var(--eui-s-4xl)}\n"] }]
91
91
  }], ctorParameters: () => [{ type: i1.BaseStatesDirective }], propDecorators: { cssClasses: [{
92
92
  type: HostBinding,
93
93
  args: ['class']
package/fesm2022/eui-components-eui-alert.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"eui-components-eui-alert.mjs","sources":["../../eui-alert/components/eui-alert-title.component.ts","../../eui-alert/eui-alert.component.ts","../../eui-alert/eui-alert.component.html","../../eui-alert/eui-alert.module.ts","../../eui-alert/eui-components-eui-alert.ts"],"sourcesContent":["import { Component, HostBinding } from '@angular/core';\n\n@Component({\n selector: 'eui-alert-title',\n template: '<ng-content></ng-content>',\n standalone: false,\n})\nexport class EuiAlertTitleComponent {\n // host binding class assignment for the content directive, avoiding extra DOM templates wrapper\n @HostBinding('class') class = 'eui-alert-title';\n}\n","import {\n Component,\n HostBinding,\n EventEmitter,\n Input,\n ChangeDetectionStrategy,\n Output,\n OnInit,\n ContentChild,\n forwardRef,\n QueryList,\n booleanAttribute,\n} from '@angular/core';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { EuiAlertTitleComponent } from './components/eui-alert-title.component';\n\n@Component({\n templateUrl: './eui-alert.component.html',\n selector: 'div[euiAlert], eui-alert',\n styleUrl: './styles/_index.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false,\n hostDirectives: [\n {\n directive: BaseStatesDirective,\n inputs: [\n 'euiPrimary',\n 'euiSuccess',\n 'euiInfo',\n 'euiWarning',\n 'euiDanger',\n 'euiVariant',\n ],\n },\n ],\n})\nexport class EuiAlertComponent implements OnInit {\n @HostBinding('class')\n public get cssClasses(): string {\n return [\n this.baseStatesDirective.getCssClasses('eui-alert'),\n this.isMuted ? 'eui-alert--muted' : '',\n this.isFocusable ? 'eui-alert--focusable' : '',\n this.isCloseable ? 'eui-alert--closeable' : '',\n this.isBordered ? 'eui-alert--bordered': '',\n !this.isVisible ? 'eui-alert--hidden' : '',\n ]\n .join(' ')\n .trim();\n }\n\n @HostBinding('attr.role') role = 'alert';\n @HostBinding('attr.aria-describedby')\n @Input()\n get ariaDescribedBy(): string {\n return `alertContent-${this.uniqueId}`;\n }\n @HostBinding('attr.tabindex')\n get tabindex(): string {\n return this.isFocusable ? '0' : '-1';\n }\n\n @HostBinding('attr.data-e2e')\n @Input()\n e2eAttr = 'eui-alert';\n\n @Input({ transform: booleanAttribute }) isMuted = false;\n @Input({ transform: booleanAttribute }) isBordered = false;\n @Input({ transform: booleanAttribute }) isCloseable = false;\n @Input({ transform: booleanAttribute }) isFocusable = false;\n @Input({ transform: booleanAttribute }) isVisible = true;\n\n @Output() closeAlert = new EventEmitter<boolean>();\n\n @ContentChild(forwardRef(() => EuiAlertTitleComponent), { static: false }) alertTitle: QueryList<EuiAlertTitleComponent>;\n\n alertIconType: string;\n alertIconFillColor: string;\n\n private uniqueId: string;\n\n constructor(public baseStatesDirective: BaseStatesDirective) {}\n\n ngOnInit(): void {\n this.uniqueId = crypto.randomUUID();\n }\n\n onCloseClick(): void {\n this.isVisible = false;\n this.closeAlert.emit(false);\n }\n}\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 ariaLabel=\"Close alert icon\"/>\n}\n","// Angular\nimport { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n// 3rd party\nimport { TranslateModule } from '@ngx-translate/core';\n\n// eUI internals\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiIconButtonModule } from '@eui/components/eui-icon-button';\nimport { EuiIconStateModule } from '@eui/components/eui-icon-state';\nimport { EuiLabelModule } from '@eui/components/eui-label';\nimport { EuiButtonModule } from '@eui/components/eui-button';\n\nconst EUI_MODULES = [\n EuiIconModule, EuiLabelModule, EuiButtonModule, EuiIconStateModule, EuiIconButtonModule,\n];\n\n// component internals\nimport { EuiAlertComponent } from './eui-alert.component';\nimport { EuiAlertTitleComponent } from './components/eui-alert-title.component';\n\nconst COMPONENTS = [\n EuiAlertComponent, EuiAlertTitleComponent,\n];\n\n// component main module\n@NgModule({\n imports: [\n // Angular and 3rd party\n CommonModule, TranslateModule,\n // eUI internals\n BaseStatesDirective,\n ...EUI_MODULES,\n ],\n declarations: [...COMPONENTS],\n exports: [...COMPONENTS],\n})\n// Always same naming convention for all : Eui[CMP_NAME]Module\nexport class EuiAlertModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"eui-components-eui-alert.mjs","sources":["../../eui-alert/components/eui-alert-title.component.ts","../../eui-alert/eui-alert.component.ts","../../eui-alert/eui-alert.component.html","../../eui-alert/eui-alert.module.ts","../../eui-alert/eui-components-eui-alert.ts"],"sourcesContent":["import { Component, HostBinding } from '@angular/core';\n\n@Component({\n selector: 'eui-alert-title',\n template: '<ng-content></ng-content>',\n standalone: false,\n})\nexport class EuiAlertTitleComponent {\n // host binding class assignment for the content directive, avoiding extra DOM templates wrapper\n @HostBinding('class') class = 'eui-alert-title';\n}\n","import {\n Component,\n HostBinding,\n EventEmitter,\n Input,\n ChangeDetectionStrategy,\n Output,\n OnInit,\n ContentChild,\n forwardRef,\n QueryList,\n booleanAttribute,\n} from '@angular/core';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { EuiAlertTitleComponent } from './components/eui-alert-title.component';\n\n@Component({\n templateUrl: './eui-alert.component.html',\n selector: 'div[euiAlert], eui-alert',\n styleUrl: './styles/_index.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false,\n hostDirectives: [\n {\n directive: BaseStatesDirective,\n inputs: [\n 'euiPrimary',\n 'euiSuccess',\n 'euiInfo',\n 'euiWarning',\n 'euiDanger',\n 'euiVariant',\n ],\n },\n ],\n})\nexport class EuiAlertComponent implements OnInit {\n @HostBinding('class')\n public get cssClasses(): string {\n return [\n this.baseStatesDirective.getCssClasses('eui-alert'),\n this.isMuted ? 'eui-alert--muted' : '',\n this.isFocusable ? 'eui-alert--focusable' : '',\n this.isCloseable ? 'eui-alert--closeable' : '',\n this.isBordered ? 'eui-alert--bordered': '',\n !this.isVisible ? 'eui-alert--hidden' : '',\n ]\n .join(' ')\n .trim();\n }\n\n @HostBinding('attr.role') role = 'alert';\n @HostBinding('attr.aria-describedby')\n @Input()\n get ariaDescribedBy(): string {\n return `alertContent-${this.uniqueId}`;\n }\n @HostBinding('attr.tabindex')\n get tabindex(): string {\n return this.isFocusable ? '0' : '-1';\n }\n\n @HostBinding('attr.data-e2e')\n @Input()\n e2eAttr = 'eui-alert';\n\n @Input({ transform: booleanAttribute }) isMuted = false;\n @Input({ transform: booleanAttribute }) isBordered = false;\n @Input({ transform: booleanAttribute }) isCloseable = false;\n @Input({ transform: booleanAttribute }) isFocusable = false;\n @Input({ transform: booleanAttribute }) isVisible = true;\n\n @Output() closeAlert = new EventEmitter<boolean>();\n\n @ContentChild(forwardRef(() => EuiAlertTitleComponent), { static: false }) alertTitle: QueryList<EuiAlertTitleComponent>;\n\n alertIconType: string;\n alertIconFillColor: string;\n\n private uniqueId: string;\n\n constructor(public baseStatesDirective: BaseStatesDirective) {}\n\n ngOnInit(): void {\n this.uniqueId = crypto.randomUUID();\n }\n\n onCloseClick(): void {\n this.isVisible = false;\n this.closeAlert.emit(false);\n }\n}\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 ariaLabel=\"Close alert icon\"/>\n}\n","// Angular\nimport { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n// 3rd party\nimport { TranslateModule } from '@ngx-translate/core';\n\n// eUI internals\nimport { BaseStatesDirective } from '@eui/components/shared';\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiIconButtonModule } from '@eui/components/eui-icon-button';\nimport { EuiIconStateModule } from '@eui/components/eui-icon-state';\nimport { EuiLabelModule } from '@eui/components/eui-label';\nimport { EuiButtonModule } from '@eui/components/eui-button';\n\nconst EUI_MODULES = [\n EuiIconModule, EuiLabelModule, EuiButtonModule, EuiIconStateModule, EuiIconButtonModule,\n];\n\n// component internals\nimport { EuiAlertComponent } from './eui-alert.component';\nimport { EuiAlertTitleComponent } from './components/eui-alert-title.component';\n\nconst COMPONENTS = [\n EuiAlertComponent, EuiAlertTitleComponent,\n];\n\n// component main module\n@NgModule({\n imports: [\n // Angular and 3rd party\n CommonModule, TranslateModule,\n // eUI internals\n BaseStatesDirective,\n ...EUI_MODULES,\n ],\n declarations: [...COMPONENTS],\n exports: [...COMPONENTS],\n})\n// Always same naming convention for all : Eui[CMP_NAME]Module\nexport class EuiAlertModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
package/fesm2022/eui-components-eui-autocomplete.mjs CHANGED
@@ -792,7 +792,7 @@ class EuiAutocompleteComponent {
792
792
  this.cd.markForCheck();
793
793
  }
794
794
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiAutocompleteComponent, deps: [{ token: i1$1.Overlay }, { token: i0.ChangeDetectorRef }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i2.LiveAnnouncer }, { token: i3.ScrollDispatcher }, { token: i4.EuiAppShellService }, { token: i1.BaseStatesDirective }, { token: i6.NgControl, optional: true, self: true }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component }); }
795
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiAutocompleteComponent, isStandalone: false, selector: "eui-autocomplete, input[euiAutocomplete]", inputs: { inputId: "inputId", autocompleteData: "autocompleteData", visibleOptions: "visibleOptions", matching: "matching", placeholder: "placeholder", autocompleteDataSelected: "autocompleteDataSelected", chipsSortOrder: "chipsSortOrder", itemsSortOrder: "itemsSortOrder", chipsPosition: "chipsPosition", groupBy: "groupBy", toggleLinkMoreLabel: "toggleLinkMoreLabel", toggleLinkLessLabel: "toggleLinkLessLabel", classList: "classList", panelWidth: "panelWidth", dragAndDropSourceName: "dragAndDropSourceName", dragAndDropConnectedTo: "dragAndDropConnectedTo", isFreeValueAllowed: ["isFreeValueAllowed", "isFreeValueAllowed", booleanAttribute], isReadonly: ["isReadonly", "isReadonly", booleanAttribute], isLoading: ["isLoading", "isLoading", booleanAttribute], hasChips: ["hasChips", "hasChips", booleanAttribute], isAsync: ["isAsync", "isAsync", booleanAttribute], isChipsSorted: ["isChipsSorted", "isChipsSorted", booleanAttribute], isItemsSorted: ["isItemsSorted", "isItemsSorted", booleanAttribute], isChipsRemovable: ["isChipsRemovable", "isChipsRemovable", booleanAttribute], isDuplicateValueAllowed: ["isDuplicateValueAllowed", "isDuplicateValueAllowed", booleanAttribute], isAddOnBlur: ["isAddOnBlur", "isAddOnBlur", booleanAttribute], isForceSelection: ["isForceSelection", "isForceSelection", booleanAttribute], maxVisibleChipsCount: ["maxVisibleChipsCount", "maxVisibleChipsCount", numberAttribute], chipsLabelTruncateCount: ["chipsLabelTruncateCount", "chipsLabelTruncateCount", numberAttribute], isMaxVisibleChipsOpened: ["isMaxVisibleChipsOpened", "isMaxVisibleChipsOpened", booleanAttribute], isChipsDragAndDrop: ["isChipsDragAndDrop", "isChipsDragAndDrop", booleanAttribute] }, outputs: { panelClose: "panelClose", panelOpen: "panelOpen", inputFocus: "inputFocus", inputBlur: "inputBlur", clear: "clear", selectionChange: "selectionChange", itemAdd: "itemAdd", itemRemove: "itemRemove", inputChange: "inputChange", chipDragStart: "chipDragStart", chipDragRelease: "chipDragRelease", chipDrop: "chipDrop" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "templates", predicate: EuiTemplateDirective }], viewQueries: [{ propertyName: "templatePortalContent", first: true, predicate: ["templatePortalContent"], descendants: true }, { propertyName: "inputContainerRef", first: true, predicate: ["inputContainerRef"], descendants: true }, { propertyName: "virtualScrolling", first: true, predicate: ["virtualScrolling"], descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true, read: ElementRef }], usesOnChanges: true, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent"] }], ngImport: i0, template: "<div class=\"eui-autocomplete__wrapper\">\n @if (chipsPosition === 'bottom') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n @if (hasChips) {\n <eui-chip-list\n [chips]=\"chips\"\n [isChipsRemovable]=\"isChipsRemovable && !isReadonly\"\n [maxVisibleChipsCount]=\"maxVisibleChipsCount\"\n [isMaxVisibleChipsOpened]=\"isMaxVisibleChipsOpened\"\n [chipsLabelTruncateCount]=\"chipsLabelTruncateCount\"\n [toggleLinkMoreLabel]=\"toggleLinkMoreLabel\"\n [toggleLinkLessLabel]=\"toggleLinkLessLabel\"\n [isChipsDragAndDrop]=\"isChipsDragAndDrop\"\n [dragAndDropSourceName]=\"dragAndDropSourceName\"\n [dragAndDropConnectedTo]=\"dragAndDropConnectedTo\"\n (chipDrop)=\"onChipDropped($event)\"\n (chipDragStart)=\"onChipDragStarted($event)\"\n (chipDragRelease)=\"onChipDragReleased($event)\"\n (chipRemove)=\"onChipRemove($event)\">\n <euiChipListAppendContent>\n <ng-template [ngIf]=\"chipsPosition === 'inside'\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </ng-template>\n </euiChipListAppendContent>\n </eui-chip-list>\n }\n @if (chipsPosition === 'top') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n</div>\n\n<ng-template #control>\n <div *ngIf=\"!hasChips || (hasChips && !isReadonly)\" class=\"eui-autocomplete__input-container {{ classList }}\" #inputContainerRef>\n <input\n [attr.id]=\"inputId\"\n #input\n euiInputText\n [euiClearable]=\"!isReadonly && !isDisabled\"\n [euiLoading]=\"isLoading\"\n [formControl]=\"autocompleteControl\"\n class=\"eui-autocomplete__input {{ classList }}\"\n placeholder=\"{{ placeholder }}\"\n [readonly]=\"isReadonly\"\n (clear)=\"onClear()\"\n (click)=\"openPanel()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n [attr.aria-controls]=\"isOpen ? 'eui-autocomplete__panel' : null\"\n [attr.aria-label]=\"autocompleteControl.value?.length > 0 ? autocompleteControl.value : 'Input field without value'\"\n [attr.aria-required]=\"hasAriaRequiredAttribute ? 'true' : null\"\n aria-autocomplete=\"both\"\n aria-haspopup=\"true\" />\n </div>\n</ng-template>\n\n<ng-template #templatePortalContent>\n <div\n id=\"eui-autocomplete__panel\"\n class=\"eui-autocomplete__panel eui-18\"\n [@panelAnimation]=\"isOpen ? 'visible' : 'hidden'\"\n role=\"listbox\"\n aria-live=\"polite\"\n aria-label=\"Autocomplete panel\">\n <cdk-virtual-scroll-viewport\n #virtualScrolling\n [itemSize]=\"itemSize\"\n tabindex=\"0\"\n minBufferPx=\"500\"\n maxBufferPx=\"750\"\n [style.min-height]=\"cdkVirtualScrollViewport + 'px'\">\n @if (groupBy) {\n @for (distinctOptionGroup of distinctOptionGroups; let i = $index; track distinctOptionGroup) {\n @if ((groupedOptions | async)[distinctOptionGroup].options.length > 0) {\n <eui-autocomplete-option-group [label]=\"distinctOptionGroup\">\n <div class=\"eui-autocomplete-option-group__label\">\n @if (autocompleteOptGroupTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptGroupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { label: distinctOptionGroup } }\">\n </ng-template>\n } @else {\n {{ distinctOptionGroup }}\n }\n </div>\n <div class=\"eui-autocomplete-option-group__options\">\n @for (autocompleteOption of (groupedOptions | async)[distinctOptionGroup].options; let j = $index; track autocompleteOption.id) {\n <eui-autocomplete-option\n isGroupItem\n [isActive]=\"selectedOptionIndex === (groupedOptions | async)[distinctOptionGroup].ancestorLength + j\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </div>\n </eui-autocomplete-option-group>\n }\n }\n } @else {\n <eui-autocomplete-option\n *cdkVirtualFor=\"let autocompleteOption of autocompleteOptions | async; let i = index; trackBy: optionsTrackByFn\"\n [isActive]=\"selectedOptionIndex === i\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </cdk-virtual-scroll-viewport>\n </div>\n</ng-template>\n", styles: [".eui-19 .eui-autocomplete,.eui-19 .eui-autocomplete__wrapper{width:100%}.eui-19 .eui-autocomplete__wrapper .eui-autocomplete__input-container{display:flex;width:100%}.eui-19 .eui-autocomplete__panel-container .eui-autocomplete__panel{box-shadow:var(--eui-sh-8);width:100%}.eui-19 .eui-autocomplete__panel-container.eui-autocomplete__panel-container--no-option .eui-autocomplete__panel{box-shadow:none}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-bottom .eui-autocomplete__input-container{margin-bottom:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper{background-color:var(--eui-c-white);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lighter);border-radius:var(--eui-br-m);padding:0 var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list,.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container{display:block}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container .eui-chip{margin-bottom:0;margin-top:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-input-text{border:var(--eui-bw-none);min-height:calc(var(--eui-s-2xl) + var(--eui-s-2xs) - 2px)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list euichiplistappendcontent{flex-grow:1}.eui-19 button~.eui-autocomplete .eui-autocomplete__input,.eui-19 .eui-input-group-addon-item~.eui-autocomplete .eui-autocomplete__input{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.eui-19 .eui-autocomplete:has(+button) .eui-autocomplete__input{border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete:has(+.eui-input-group-addon-item) .eui-autocomplete__input{border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label{align-items:center;background-color:var(--eui-c-neutral-bg-light);border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;font-weight:700;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon-svg,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-flag-icon{margin-right:var(--eui-s-2xs)}.eui-19 .eui-autocomplete-option{align-items:center;border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option:hover{background-color:var(--eui-c-neutral-bg-light)}.eui-19 .eui-autocomplete-option--group-item{padding-left:var(--eui-s-l)}.eui-19 .eui-autocomplete-option .eui-icon,.eui-19 .eui-autocomplete-option .eui-icon-svg,.eui-19 .eui-autocomplete-option .eui-flag-icon{margin-right:var(--eui-s-xs)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon{cursor:pointer;position:absolute;right:var(--eui-s-s);-webkit-user-select:none;user-select:none;visibility:visible}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg{fill:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg:hover{fill:var(--eui-c-danger)}.eui-19 .eui-autocomplete-option--primary{border-left-color:var(--eui-c-primary)}.eui-19 .eui-autocomplete-option--secondary{border-left-color:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete-option--info{border-left-color:var(--eui-c-info)}.eui-19 .eui-autocomplete-option--success{border-left-color:var(--eui-c-success-dark)}.eui-19 .eui-autocomplete-option--warning{border-left-color:var(--eui-c-warning)}.eui-19 .eui-autocomplete-option--danger{border-left-color:var(--eui-c-danger-dark)}.eui-19 .eui-autocomplete-option--accent{border-left-color:var(--eui-c-accent)}.eui-19 .eui-autocomplete-option--active{background-color:var(--eui-c-primary-lightest)}.eui-19 .eui-autocomplete-option--disabled{cursor:default;opacity:.4}.eui-19 .eui-autocomplete-option--disabled:hover{background:none}\n"], dependencies: [{ kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: i8.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["isInvalid"] }, { kind: "component", type: i9.EuiChipListComponent, selector: "eui-chip-list, div[euiChipList], ul[euiChipList]", inputs: ["chips", "toggleLinkMoreLabel", "toggleLinkLessLabel", "chipsSortOrder", "dragAndDropSourceName", "dragAndDropConnectedTo", "ariaLabel", "dropListOrientation", "isSquared", "isChipsRemovable", "isMaxVisibleChipsOpened", "isChipsSorted", "isChipsDragAndDrop", "isGrid", "maxVisibleChipsCount", "chipsLabelTruncateCount"], outputs: ["chipsInit", "chipRemove", "chipDragStart", "chipDragRelease", "chipDrop", "chiplistFocus"] }, { kind: "directive", type: i9.EuiChipListAppendContentDirective, selector: "euiChipListAppendContent" }, { kind: "component", type: i10.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: EuiAutocompleteOptionComponent, selector: "eui-autocomplete-option", inputs: ["isActive", "isDisabled", "isGroupItem"] }, { kind: "component", type: EuiAutocompleteOptionGroupComponent, selector: "eui-autocomplete-option-group", inputs: ["label"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }], animations: [panelAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
795
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: EuiAutocompleteComponent, isStandalone: false, selector: "eui-autocomplete, input[euiAutocomplete]", inputs: { inputId: "inputId", autocompleteData: "autocompleteData", visibleOptions: "visibleOptions", matching: "matching", placeholder: "placeholder", autocompleteDataSelected: "autocompleteDataSelected", chipsSortOrder: "chipsSortOrder", itemsSortOrder: "itemsSortOrder", chipsPosition: "chipsPosition", groupBy: "groupBy", toggleLinkMoreLabel: "toggleLinkMoreLabel", toggleLinkLessLabel: "toggleLinkLessLabel", classList: "classList", panelWidth: "panelWidth", dragAndDropSourceName: "dragAndDropSourceName", dragAndDropConnectedTo: "dragAndDropConnectedTo", isFreeValueAllowed: ["isFreeValueAllowed", "isFreeValueAllowed", booleanAttribute], isReadonly: ["isReadonly", "isReadonly", booleanAttribute], isLoading: ["isLoading", "isLoading", booleanAttribute], hasChips: ["hasChips", "hasChips", booleanAttribute], isAsync: ["isAsync", "isAsync", booleanAttribute], isChipsSorted: ["isChipsSorted", "isChipsSorted", booleanAttribute], isItemsSorted: ["isItemsSorted", "isItemsSorted", booleanAttribute], isChipsRemovable: ["isChipsRemovable", "isChipsRemovable", booleanAttribute], isDuplicateValueAllowed: ["isDuplicateValueAllowed", "isDuplicateValueAllowed", booleanAttribute], isAddOnBlur: ["isAddOnBlur", "isAddOnBlur", booleanAttribute], isForceSelection: ["isForceSelection", "isForceSelection", booleanAttribute], maxVisibleChipsCount: ["maxVisibleChipsCount", "maxVisibleChipsCount", numberAttribute], chipsLabelTruncateCount: ["chipsLabelTruncateCount", "chipsLabelTruncateCount", numberAttribute], isMaxVisibleChipsOpened: ["isMaxVisibleChipsOpened", "isMaxVisibleChipsOpened", booleanAttribute], isChipsDragAndDrop: ["isChipsDragAndDrop", "isChipsDragAndDrop", booleanAttribute] }, outputs: { panelClose: "panelClose", panelOpen: "panelOpen", inputFocus: "inputFocus", inputBlur: "inputBlur", clear: "clear", selectionChange: "selectionChange", itemAdd: "itemAdd", itemRemove: "itemRemove", inputChange: "inputChange", chipDragStart: "chipDragStart", chipDragRelease: "chipDragRelease", chipDrop: "chipDrop" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "templates", predicate: EuiTemplateDirective }], viewQueries: [{ propertyName: "templatePortalContent", first: true, predicate: ["templatePortalContent"], descendants: true }, { propertyName: "inputContainerRef", first: true, predicate: ["inputContainerRef"], descendants: true }, { propertyName: "virtualScrolling", first: true, predicate: ["virtualScrolling"], descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true, read: ElementRef }], usesOnChanges: true, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent"] }], ngImport: i0, template: "<div class=\"eui-autocomplete__wrapper\">\n @if (chipsPosition === 'bottom') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n @if (hasChips) {\n <eui-chip-list\n [chips]=\"chips\"\n [isChipsRemovable]=\"isChipsRemovable && !isReadonly\"\n [maxVisibleChipsCount]=\"maxVisibleChipsCount\"\n [isMaxVisibleChipsOpened]=\"isMaxVisibleChipsOpened\"\n [chipsLabelTruncateCount]=\"chipsLabelTruncateCount\"\n [toggleLinkMoreLabel]=\"toggleLinkMoreLabel\"\n [toggleLinkLessLabel]=\"toggleLinkLessLabel\"\n [isChipsDragAndDrop]=\"isChipsDragAndDrop\"\n [dragAndDropSourceName]=\"dragAndDropSourceName\"\n [dragAndDropConnectedTo]=\"dragAndDropConnectedTo\"\n (chipDrop)=\"onChipDropped($event)\"\n (chipDragStart)=\"onChipDragStarted($event)\"\n (chipDragRelease)=\"onChipDragReleased($event)\"\n (chipRemove)=\"onChipRemove($event)\">\n <euiChipListAppendContent>\n <ng-template [ngIf]=\"chipsPosition === 'inside'\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </ng-template>\n </euiChipListAppendContent>\n </eui-chip-list>\n }\n @if (chipsPosition === 'top') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n</div>\n\n<ng-template #control>\n <div *ngIf=\"!hasChips || (hasChips && !isReadonly)\" class=\"eui-autocomplete__input-container {{ classList }}\" #inputContainerRef>\n <input\n [attr.id]=\"inputId\"\n #input\n euiInputText\n [euiClearable]=\"!isReadonly && !isDisabled\"\n [euiLoading]=\"isLoading\"\n [formControl]=\"autocompleteControl\"\n class=\"eui-autocomplete__input {{ classList }}\"\n placeholder=\"{{ placeholder }}\"\n [readonly]=\"isReadonly\"\n (clear)=\"onClear()\"\n (click)=\"openPanel()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n [attr.aria-controls]=\"isOpen ? 'eui-autocomplete__panel' : null\"\n [attr.aria-label]=\"autocompleteControl.value?.length > 0 ? autocompleteControl.value : 'Input field without value'\"\n [attr.aria-required]=\"hasAriaRequiredAttribute ? 'true' : null\"\n aria-autocomplete=\"both\"\n aria-haspopup=\"true\" />\n </div>\n</ng-template>\n\n<ng-template #templatePortalContent>\n <div\n id=\"eui-autocomplete__panel\"\n class=\"eui-autocomplete__panel eui-18\"\n [@panelAnimation]=\"isOpen ? 'visible' : 'hidden'\"\n role=\"listbox\"\n aria-live=\"polite\"\n aria-label=\"Autocomplete panel\">\n <cdk-virtual-scroll-viewport\n #virtualScrolling\n [itemSize]=\"itemSize\"\n tabindex=\"0\"\n minBufferPx=\"500\"\n maxBufferPx=\"750\"\n [style.min-height]=\"cdkVirtualScrollViewport + 'px'\">\n @if (groupBy) {\n @for (distinctOptionGroup of distinctOptionGroups; let i = $index; track distinctOptionGroup) {\n @if ((groupedOptions | async)[distinctOptionGroup].options.length > 0) {\n <eui-autocomplete-option-group [label]=\"distinctOptionGroup\">\n <div class=\"eui-autocomplete-option-group__label\">\n @if (autocompleteOptGroupTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptGroupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { label: distinctOptionGroup } }\">\n </ng-template>\n } @else {\n {{ distinctOptionGroup }}\n }\n </div>\n <div class=\"eui-autocomplete-option-group__options\">\n @for (autocompleteOption of (groupedOptions | async)[distinctOptionGroup].options; let j = $index; track autocompleteOption.id) {\n <eui-autocomplete-option\n isGroupItem\n [isActive]=\"selectedOptionIndex === (groupedOptions | async)[distinctOptionGroup].ancestorLength + j\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </div>\n </eui-autocomplete-option-group>\n }\n }\n } @else {\n <eui-autocomplete-option\n *cdkVirtualFor=\"let autocompleteOption of autocompleteOptions | async; let i = index; trackBy: optionsTrackByFn\"\n [isActive]=\"selectedOptionIndex === i\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </cdk-virtual-scroll-viewport>\n </div>\n</ng-template>\n", styles: [".eui-19 .eui-autocomplete,.eui-19 .eui-autocomplete__wrapper{width:100%}.eui-19 .eui-autocomplete__wrapper .eui-autocomplete__input-container{display:flex;width:100%}.eui-19 .eui-autocomplete__panel-container .eui-autocomplete__panel{box-shadow:var(--eui-sh-8);width:100%}.eui-19 .eui-autocomplete__panel-container.eui-autocomplete__panel-container--no-option .eui-autocomplete__panel{box-shadow:none}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-bottom .eui-autocomplete__input-container{margin-bottom:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper{background-color:var(--eui-c-white);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lighter);border-radius:var(--eui-br-m);padding:0 var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list,.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container{display:block}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container .eui-chip{margin-bottom:0;margin-top:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-input-text{border:var(--eui-bw-none);min-height:calc(var(--eui-s-2xl) + var(--eui-s-2xs) - 2px)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list euichiplistappendcontent{flex-grow:1}.eui-19 button~.eui-autocomplete .eui-autocomplete__input,.eui-19 .eui-input-group-addon-item~.eui-autocomplete .eui-autocomplete__input{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.eui-19 .eui-autocomplete:has(+button) .eui-autocomplete__input{border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete:has(+.eui-input-group-addon-item) .eui-autocomplete__input{border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label{align-items:center;background-color:var(--eui-c-neutral-bg-light);border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;font-weight:700;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon-svg,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-flag-icon{margin-right:var(--eui-s-2xs)}.eui-19 .eui-autocomplete-option{align-items:center;border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option:hover{background-color:var(--eui-c-neutral-bg-light)}.eui-19 .eui-autocomplete-option--group-item{padding-left:var(--eui-s-l)}.eui-19 .eui-autocomplete-option .eui-icon,.eui-19 .eui-autocomplete-option .eui-icon-svg,.eui-19 .eui-autocomplete-option .eui-flag-icon{margin-right:var(--eui-s-xs)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon{cursor:pointer;position:absolute;right:var(--eui-s-s);-webkit-user-select:none;user-select:none;visibility:visible}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg{fill:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg:hover{fill:var(--eui-c-danger)}.eui-19 .eui-autocomplete-option--primary{border-left-color:var(--eui-c-primary-dark)}.eui-19 .eui-autocomplete-option--secondary{border-left-color:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete-option--info{border-left-color:var(--eui-c-info)}.eui-19 .eui-autocomplete-option--success{border-left-color:var(--eui-c-success-dark)}.eui-19 .eui-autocomplete-option--warning{border-left-color:var(--eui-c-warning)}.eui-19 .eui-autocomplete-option--danger{border-left-color:var(--eui-c-danger-dark)}.eui-19 .eui-autocomplete-option--accent{border-left-color:var(--eui-c-accent)}.eui-19 .eui-autocomplete-option--active{background-color:var(--eui-c-primary-lightest)}.eui-19 .eui-autocomplete-option--disabled{cursor:default;opacity:.4}.eui-19 .eui-autocomplete-option--disabled:hover{background:none}\n"], dependencies: [{ kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: i8.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["isInvalid"] }, { kind: "component", type: i9.EuiChipListComponent, selector: "eui-chip-list, div[euiChipList], ul[euiChipList]", inputs: ["chips", "toggleLinkMoreLabel", "toggleLinkLessLabel", "chipsSortOrder", "dragAndDropSourceName", "dragAndDropConnectedTo", "ariaLabel", "dropListOrientation", "isSquared", "isChipsRemovable", "isMaxVisibleChipsOpened", "isChipsSorted", "isChipsDragAndDrop", "isGrid", "maxVisibleChipsCount", "chipsLabelTruncateCount"], outputs: ["chipsInit", "chipRemove", "chipDragStart", "chipDragRelease", "chipDrop", "chiplistFocus"] }, { kind: "directive", type: i9.EuiChipListAppendContentDirective, selector: "euiChipListAppendContent" }, { kind: "component", type: i10.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: EuiAutocompleteOptionComponent, selector: "eui-autocomplete-option", inputs: ["isActive", "isDisabled", "isGroupItem"] }, { kind: "component", type: EuiAutocompleteOptionGroupComponent, selector: "eui-autocomplete-option-group", inputs: ["label"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }], animations: [panelAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
796
796
  }
797
797
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: EuiAutocompleteComponent, decorators: [{
798
798
  type: Component,
@@ -808,7 +808,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
808
808
  'euiAccent',
809
809
  ],
810
810
  },
811
- ], template: "<div class=\"eui-autocomplete__wrapper\">\n @if (chipsPosition === 'bottom') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n @if (hasChips) {\n <eui-chip-list\n [chips]=\"chips\"\n [isChipsRemovable]=\"isChipsRemovable && !isReadonly\"\n [maxVisibleChipsCount]=\"maxVisibleChipsCount\"\n [isMaxVisibleChipsOpened]=\"isMaxVisibleChipsOpened\"\n [chipsLabelTruncateCount]=\"chipsLabelTruncateCount\"\n [toggleLinkMoreLabel]=\"toggleLinkMoreLabel\"\n [toggleLinkLessLabel]=\"toggleLinkLessLabel\"\n [isChipsDragAndDrop]=\"isChipsDragAndDrop\"\n [dragAndDropSourceName]=\"dragAndDropSourceName\"\n [dragAndDropConnectedTo]=\"dragAndDropConnectedTo\"\n (chipDrop)=\"onChipDropped($event)\"\n (chipDragStart)=\"onChipDragStarted($event)\"\n (chipDragRelease)=\"onChipDragReleased($event)\"\n (chipRemove)=\"onChipRemove($event)\">\n <euiChipListAppendContent>\n <ng-template [ngIf]=\"chipsPosition === 'inside'\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </ng-template>\n </euiChipListAppendContent>\n </eui-chip-list>\n }\n @if (chipsPosition === 'top') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n</div>\n\n<ng-template #control>\n <div *ngIf=\"!hasChips || (hasChips && !isReadonly)\" class=\"eui-autocomplete__input-container {{ classList }}\" #inputContainerRef>\n <input\n [attr.id]=\"inputId\"\n #input\n euiInputText\n [euiClearable]=\"!isReadonly && !isDisabled\"\n [euiLoading]=\"isLoading\"\n [formControl]=\"autocompleteControl\"\n class=\"eui-autocomplete__input {{ classList }}\"\n placeholder=\"{{ placeholder }}\"\n [readonly]=\"isReadonly\"\n (clear)=\"onClear()\"\n (click)=\"openPanel()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n [attr.aria-controls]=\"isOpen ? 'eui-autocomplete__panel' : null\"\n [attr.aria-label]=\"autocompleteControl.value?.length > 0 ? autocompleteControl.value : 'Input field without value'\"\n [attr.aria-required]=\"hasAriaRequiredAttribute ? 'true' : null\"\n aria-autocomplete=\"both\"\n aria-haspopup=\"true\" />\n </div>\n</ng-template>\n\n<ng-template #templatePortalContent>\n <div\n id=\"eui-autocomplete__panel\"\n class=\"eui-autocomplete__panel eui-18\"\n [@panelAnimation]=\"isOpen ? 'visible' : 'hidden'\"\n role=\"listbox\"\n aria-live=\"polite\"\n aria-label=\"Autocomplete panel\">\n <cdk-virtual-scroll-viewport\n #virtualScrolling\n [itemSize]=\"itemSize\"\n tabindex=\"0\"\n minBufferPx=\"500\"\n maxBufferPx=\"750\"\n [style.min-height]=\"cdkVirtualScrollViewport + 'px'\">\n @if (groupBy) {\n @for (distinctOptionGroup of distinctOptionGroups; let i = $index; track distinctOptionGroup) {\n @if ((groupedOptions | async)[distinctOptionGroup].options.length > 0) {\n <eui-autocomplete-option-group [label]=\"distinctOptionGroup\">\n <div class=\"eui-autocomplete-option-group__label\">\n @if (autocompleteOptGroupTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptGroupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { label: distinctOptionGroup } }\">\n </ng-template>\n } @else {\n {{ distinctOptionGroup }}\n }\n </div>\n <div class=\"eui-autocomplete-option-group__options\">\n @for (autocompleteOption of (groupedOptions | async)[distinctOptionGroup].options; let j = $index; track autocompleteOption.id) {\n <eui-autocomplete-option\n isGroupItem\n [isActive]=\"selectedOptionIndex === (groupedOptions | async)[distinctOptionGroup].ancestorLength + j\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </div>\n </eui-autocomplete-option-group>\n }\n }\n } @else {\n <eui-autocomplete-option\n *cdkVirtualFor=\"let autocompleteOption of autocompleteOptions | async; let i = index; trackBy: optionsTrackByFn\"\n [isActive]=\"selectedOptionIndex === i\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </cdk-virtual-scroll-viewport>\n </div>\n</ng-template>\n", styles: [".eui-19 .eui-autocomplete,.eui-19 .eui-autocomplete__wrapper{width:100%}.eui-19 .eui-autocomplete__wrapper .eui-autocomplete__input-container{display:flex;width:100%}.eui-19 .eui-autocomplete__panel-container .eui-autocomplete__panel{box-shadow:var(--eui-sh-8);width:100%}.eui-19 .eui-autocomplete__panel-container.eui-autocomplete__panel-container--no-option .eui-autocomplete__panel{box-shadow:none}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-bottom .eui-autocomplete__input-container{margin-bottom:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper{background-color:var(--eui-c-white);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lighter);border-radius:var(--eui-br-m);padding:0 var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list,.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container{display:block}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container .eui-chip{margin-bottom:0;margin-top:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-input-text{border:var(--eui-bw-none);min-height:calc(var(--eui-s-2xl) + var(--eui-s-2xs) - 2px)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list euichiplistappendcontent{flex-grow:1}.eui-19 button~.eui-autocomplete .eui-autocomplete__input,.eui-19 .eui-input-group-addon-item~.eui-autocomplete .eui-autocomplete__input{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.eui-19 .eui-autocomplete:has(+button) .eui-autocomplete__input{border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete:has(+.eui-input-group-addon-item) .eui-autocomplete__input{border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label{align-items:center;background-color:var(--eui-c-neutral-bg-light);border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;font-weight:700;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon-svg,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-flag-icon{margin-right:var(--eui-s-2xs)}.eui-19 .eui-autocomplete-option{align-items:center;border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option:hover{background-color:var(--eui-c-neutral-bg-light)}.eui-19 .eui-autocomplete-option--group-item{padding-left:var(--eui-s-l)}.eui-19 .eui-autocomplete-option .eui-icon,.eui-19 .eui-autocomplete-option .eui-icon-svg,.eui-19 .eui-autocomplete-option .eui-flag-icon{margin-right:var(--eui-s-xs)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon{cursor:pointer;position:absolute;right:var(--eui-s-s);-webkit-user-select:none;user-select:none;visibility:visible}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg{fill:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg:hover{fill:var(--eui-c-danger)}.eui-19 .eui-autocomplete-option--primary{border-left-color:var(--eui-c-primary)}.eui-19 .eui-autocomplete-option--secondary{border-left-color:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete-option--info{border-left-color:var(--eui-c-info)}.eui-19 .eui-autocomplete-option--success{border-left-color:var(--eui-c-success-dark)}.eui-19 .eui-autocomplete-option--warning{border-left-color:var(--eui-c-warning)}.eui-19 .eui-autocomplete-option--danger{border-left-color:var(--eui-c-danger-dark)}.eui-19 .eui-autocomplete-option--accent{border-left-color:var(--eui-c-accent)}.eui-19 .eui-autocomplete-option--active{background-color:var(--eui-c-primary-lightest)}.eui-19 .eui-autocomplete-option--disabled{cursor:default;opacity:.4}.eui-19 .eui-autocomplete-option--disabled:hover{background:none}\n"] }]
811
+ ], template: "<div class=\"eui-autocomplete__wrapper\">\n @if (chipsPosition === 'bottom') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n @if (hasChips) {\n <eui-chip-list\n [chips]=\"chips\"\n [isChipsRemovable]=\"isChipsRemovable && !isReadonly\"\n [maxVisibleChipsCount]=\"maxVisibleChipsCount\"\n [isMaxVisibleChipsOpened]=\"isMaxVisibleChipsOpened\"\n [chipsLabelTruncateCount]=\"chipsLabelTruncateCount\"\n [toggleLinkMoreLabel]=\"toggleLinkMoreLabel\"\n [toggleLinkLessLabel]=\"toggleLinkLessLabel\"\n [isChipsDragAndDrop]=\"isChipsDragAndDrop\"\n [dragAndDropSourceName]=\"dragAndDropSourceName\"\n [dragAndDropConnectedTo]=\"dragAndDropConnectedTo\"\n (chipDrop)=\"onChipDropped($event)\"\n (chipDragStart)=\"onChipDragStarted($event)\"\n (chipDragRelease)=\"onChipDragReleased($event)\"\n (chipRemove)=\"onChipRemove($event)\">\n <euiChipListAppendContent>\n <ng-template [ngIf]=\"chipsPosition === 'inside'\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </ng-template>\n </euiChipListAppendContent>\n </eui-chip-list>\n }\n @if (chipsPosition === 'top') {\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n }\n</div>\n\n<ng-template #control>\n <div *ngIf=\"!hasChips || (hasChips && !isReadonly)\" class=\"eui-autocomplete__input-container {{ classList }}\" #inputContainerRef>\n <input\n [attr.id]=\"inputId\"\n #input\n euiInputText\n [euiClearable]=\"!isReadonly && !isDisabled\"\n [euiLoading]=\"isLoading\"\n [formControl]=\"autocompleteControl\"\n class=\"eui-autocomplete__input {{ classList }}\"\n placeholder=\"{{ placeholder }}\"\n [readonly]=\"isReadonly\"\n (clear)=\"onClear()\"\n (click)=\"openPanel()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n [attr.aria-controls]=\"isOpen ? 'eui-autocomplete__panel' : null\"\n [attr.aria-label]=\"autocompleteControl.value?.length > 0 ? autocompleteControl.value : 'Input field without value'\"\n [attr.aria-required]=\"hasAriaRequiredAttribute ? 'true' : null\"\n aria-autocomplete=\"both\"\n aria-haspopup=\"true\" />\n </div>\n</ng-template>\n\n<ng-template #templatePortalContent>\n <div\n id=\"eui-autocomplete__panel\"\n class=\"eui-autocomplete__panel eui-18\"\n [@panelAnimation]=\"isOpen ? 'visible' : 'hidden'\"\n role=\"listbox\"\n aria-live=\"polite\"\n aria-label=\"Autocomplete panel\">\n <cdk-virtual-scroll-viewport\n #virtualScrolling\n [itemSize]=\"itemSize\"\n tabindex=\"0\"\n minBufferPx=\"500\"\n maxBufferPx=\"750\"\n [style.min-height]=\"cdkVirtualScrollViewport + 'px'\">\n @if (groupBy) {\n @for (distinctOptionGroup of distinctOptionGroups; let i = $index; track distinctOptionGroup) {\n @if ((groupedOptions | async)[distinctOptionGroup].options.length > 0) {\n <eui-autocomplete-option-group [label]=\"distinctOptionGroup\">\n <div class=\"eui-autocomplete-option-group__label\">\n @if (autocompleteOptGroupTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptGroupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { label: distinctOptionGroup } }\">\n </ng-template>\n } @else {\n {{ distinctOptionGroup }}\n }\n </div>\n <div class=\"eui-autocomplete-option-group__options\">\n @for (autocompleteOption of (groupedOptions | async)[distinctOptionGroup].options; let j = $index; track autocompleteOption.id) {\n <eui-autocomplete-option\n isGroupItem\n [isActive]=\"selectedOptionIndex === (groupedOptions | async)[distinctOptionGroup].ancestorLength + j\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </div>\n </eui-autocomplete-option-group>\n }\n }\n } @else {\n <eui-autocomplete-option\n *cdkVirtualFor=\"let autocompleteOption of autocompleteOptions | async; let i = index; trackBy: optionsTrackByFn\"\n [isActive]=\"selectedOptionIndex === i\"\n [isDisabled]=\"autocompleteOption.isDisabled\"\n [attr.aria-disabled]=\"autocompleteOption.isDisabled\"\n [euiVariant]=\"autocompleteOption.typeClass\"\n (click)=\"onOptionSelected(autocompleteOption)\">\n @if (autocompleteOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"autocompleteOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: autocompleteOption }\">\n </ng-template>\n } @else {\n @if (autocompleteOption.iconClass) {\n <span class=\"{{ autocompleteOption.iconClass }}\"></span>\n } @else if (autocompleteOption.iconSvgName) {\n <eui-icon-svg icon=\"{{ autocompleteOption.iconSvgName }}\"></eui-icon-svg>\n }\n {{ autocompleteOption.label }}\n }\n </eui-autocomplete-option>\n }\n </cdk-virtual-scroll-viewport>\n </div>\n</ng-template>\n", styles: [".eui-19 .eui-autocomplete,.eui-19 .eui-autocomplete__wrapper{width:100%}.eui-19 .eui-autocomplete__wrapper .eui-autocomplete__input-container{display:flex;width:100%}.eui-19 .eui-autocomplete__panel-container .eui-autocomplete__panel{box-shadow:var(--eui-sh-8);width:100%}.eui-19 .eui-autocomplete__panel-container.eui-autocomplete__panel-container--no-option .eui-autocomplete__panel{box-shadow:none}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-bottom .eui-autocomplete__input-container{margin-bottom:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper{background-color:var(--eui-c-white);border:var(--eui-bw-xs) solid var(--eui-c-neutral-lighter);border-radius:var(--eui-br-m);padding:0 var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list,.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container{display:block}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-chip-list-container .eui-chip-list-wrapper .eui-chip-list__chip-container .eui-chip{margin-bottom:0;margin-top:var(--eui-s-2xs)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list .eui-input-text{border:var(--eui-bw-none);min-height:calc(var(--eui-s-2xl) + var(--eui-s-2xs) - 2px)}.eui-19 .eui-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list euichiplistappendcontent{flex-grow:1}.eui-19 button~.eui-autocomplete .eui-autocomplete__input,.eui-19 .eui-input-group-addon-item~.eui-autocomplete .eui-autocomplete__input{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.eui-19 .eui-autocomplete:has(+button) .eui-autocomplete__input{border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete:has(+.eui-input-group-addon-item) .eui-autocomplete__input{border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label{align-items:center;background-color:var(--eui-c-neutral-bg-light);border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;font-weight:700;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon-svg,.eui-19 .eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-flag-icon{margin-right:var(--eui-s-2xs)}.eui-19 .eui-autocomplete-option{align-items:center;border-bottom:1px solid var(--eui-c-neutral-bg-light);border-left:var(--eui-bw-m) solid transparent;cursor:pointer;display:flex;min-height:var(--eui-s-3xl);padding-left:var(--eui-s-s);padding-right:var(--eui-s-s)}.eui-19 .eui-autocomplete-option:hover{background-color:var(--eui-c-neutral-bg-light)}.eui-19 .eui-autocomplete-option--group-item{padding-left:var(--eui-s-l)}.eui-19 .eui-autocomplete-option .eui-icon,.eui-19 .eui-autocomplete-option .eui-icon-svg,.eui-19 .eui-autocomplete-option .eui-flag-icon{margin-right:var(--eui-s-xs)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon{cursor:pointer;position:absolute;right:var(--eui-s-s);-webkit-user-select:none;user-select:none;visibility:visible}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg{fill:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete__input-container .eui-icon-svg.eui-input-text--clearable-icon>svg:hover{fill:var(--eui-c-danger)}.eui-19 .eui-autocomplete-option--primary{border-left-color:var(--eui-c-primary-dark)}.eui-19 .eui-autocomplete-option--secondary{border-left-color:var(--eui-c-neutral-lighter)}.eui-19 .eui-autocomplete-option--info{border-left-color:var(--eui-c-info)}.eui-19 .eui-autocomplete-option--success{border-left-color:var(--eui-c-success-dark)}.eui-19 .eui-autocomplete-option--warning{border-left-color:var(--eui-c-warning)}.eui-19 .eui-autocomplete-option--danger{border-left-color:var(--eui-c-danger-dark)}.eui-19 .eui-autocomplete-option--accent{border-left-color:var(--eui-c-accent)}.eui-19 .eui-autocomplete-option--active{background-color:var(--eui-c-primary-lightest)}.eui-19 .eui-autocomplete-option--disabled{cursor:default;opacity:.4}.eui-19 .eui-autocomplete-option--disabled:hover{background:none}\n"] }]
812
812
  }], ctorParameters: () => [{ type: i1$1.Overlay }, { type: i0.ChangeDetectorRef }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i2.LiveAnnouncer }, { type: i3.ScrollDispatcher }, { type: i4.EuiAppShellService }, { type: i1.BaseStatesDirective }, { type: i6.NgControl, decorators: [{
813
813
  type: Self
814
814
  }, {