@eui/components 18.0.0-next.75 → 18.0.0-next.76

package/fesm2022/eui-components-eui-alert.mjs

@@ -6,13 +6,13 @@ var EuiAlertTitleComponent = class _EuiAlertTitleComponent {
     this.class = "eui-alert-title";
   }
   static {
-    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i0, type: _EuiAlertTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i0, type: _EuiAlertTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-rc.1", type: _EuiAlertTitleComponent, selector: "eui-alert-title", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>", isInline: true, styles: [":host.eui-alert-title{color:var(--_color);font:var(--eui-f-m-bold)}\n"] });
+    this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-rc.3", type: _EuiAlertTitleComponent, selector: "eui-alert-title", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>", isInline: true, styles: [":host.eui-alert-title{color:var(--_color);font:var(--eui-f-m-bold)}\n"] });
   }
 };
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i0, type: EuiAlertTitleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i0, type: EuiAlertTitleComponent, decorators: [{
   type: Component,
   args: [{ selector: "eui-alert-title", template: "<ng-content></ng-content>", styles: [":host.eui-alert-title{color:var(--_color);font:var(--eui-f-m-bold)}\n"] }]
 }], propDecorators: { class: [{
@@ -65,10 +65,10 @@ var EuiAlertComponent = class _EuiAlertComponent {
     this.closeAlert.emit();
   }
   static {
-    this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i02, type: _EuiAlertComponent, deps: [{ token: i1.BaseStatesDirective }], target: i02.ɵɵFactoryTarget.Component });
+    this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i02, type: _EuiAlertComponent, deps: [{ token: i1.BaseStatesDirective }], target: i02.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-rc.1", type: _EuiAlertComponent, selector: "div[euiAlert], eui-alert", inputs: { ariaDescribedBy: "ariaDescribedBy", e2eAttr: "e2eAttr", isMuted: ["isMuted", "isMuted", booleanAttribute], isCloseable: ["isCloseable", "isCloseable", booleanAttribute], isFocusable: ["isFocusable", "isFocusable", 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: i02.forwardRef(() => EuiAlertTitleComponent), descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant"] }], ngImport: i02, template: `@if (!isMuted) {
+    this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-rc.3", type: _EuiAlertComponent, selector: "div[euiAlert], eui-alert", inputs: { ariaDescribedBy: "ariaDescribedBy", e2eAttr: "e2eAttr", isMuted: ["isMuted", "isMuted", booleanAttribute], isCloseable: ["isCloseable", "isCloseable", booleanAttribute], isFocusable: ["isFocusable", "isFocusable", 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: i02.forwardRef(() => EuiAlertTitleComponent), descendants: true }], hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant"] }], ngImport: i02, template: `@if (!isMuted) {
     <div class="eui-alert__type-container">
         @if (baseStatesDirective.euiSuccess) {
         <eui-icon-svg class="eui-alert__icon-type" icon="eui-ecl-check-filled" fillColor="success"></eui-icon-svg>
@@ -132,7 +132,7 @@ var EuiAlertComponent = class _EuiAlertComponent {
 `, styles: [':host.eui-alert{--_border-color: var(--eui-alert-border-color, var(--eui-c-info));--_color: var(--eui-alert-color, var(--eui-c-info));--_bg-color: var(--eui-alert-bg-color, var(--eui-c-info-bg-light))}:host.eui-alert{display:flex;background-color:var(--_bg-color);background-position:var(--eui-s-s);background-repeat:no-repeat;position:relative;border-left:var(--eui-s-2xs) solid var(--_border-color);border-radius:var(--eui-br-m);flex-basis:auto;flex-shrink:1;overflow:auto;padding:var(--eui-s-m);width:100%}:host.eui-alert::-webkit-scrollbar{display:inherit;height:10px;width:10px;background-color:var(--eui-c-neutral-bg-light)}:host.eui-alert::-webkit-scrollbar-thumb{background-color:var(--eui-c-neutral-lightest);border-radius:5rem}:host.eui-alert::-webkit-scrollbar-thumb:hover{background-color:var(--eui-c-neutral-lighter)}:host.eui-alert::-webkit-scrollbar-track{background-color:var(--eui-c-neutral-bg-light);border-radius:0}.eui-alert__type-container{align-items:center;display:flex;margin-right:var(--eui-s-s);height:var(--eui-s-l)}.eui-alert__content{display:flex;flex-direction:column;width:100%}.eui-alert__content-header{align-items:center;display:flex;flex:1 1 100%;justify-content:space-between;width:100%}.eui-alert__content-header--with-title{min-height:var(--eui-s-l)}.eui-alert__content--with-title{margin-top:var(--eui-s-xs)}.eui-alert__close{align-self:flex-start;display:flex;margin-left:auto}.eui-alert__close:hover{text-decoration:underline}.eui-alert__close-button{margin-left:var(--eui-s-s)}:host.eui-alert--info{--_border-color: var(--eui-c-info);--_bg-color: var(--eui-c-info-bg-light)}:host.eui-alert--success{--_border-color: var(--eui-c-success);--_bg-color: var(--eui-c-success-bg-light)}:host.eui-alert--danger{--_border-color: var(--eui-c-danger);--_bg-color: var(--eui-c-danger-bg-light)}:host.eui-alert--warning{--_border-color: var(--eui-c-warning);--_bg-color: var(--eui-c-warning-bg-light)}:host.eui-alert--hidden{display:none}:host.eui-alert--focusable:focus:not([readonly]){outline:2px solid var(--eui-c-focus)!important;outline-offset:-2px!important;transition:none}:host.eui-alert--focusable:focus-visible:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}:host.eui-alert--focusable [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-c-focus-visible)!important;outline-offset:-2px!important;transition:none}:host.eui-alert--closeable .eui-alert__type-container{margin-top:var(--eui-s-xs)}@media screen and (max-width: 995px){.eui-alert__close-label{display:none}}\n'], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.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: i4.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label,               label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "euiSublabel"] }, { kind: "component", type: i5.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }], changeDetection: i02.ChangeDetectionStrategy.OnPush });
   }
 };
-i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i02, type: EuiAlertComponent, decorators: [{
+i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i02, type: EuiAlertComponent, decorators: [{
   type: Component2,
   args: [{ selector: "div[euiAlert], eui-alert", changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
     {
@@ -262,10 +262,10 @@ var COMPONENTS = [
 ];
 var EuiAlertModule = class _EuiAlertModule {
   static {
-    this.ɵfac = i03.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i03, type: _EuiAlertModule, deps: [], target: i03.ɵɵFactoryTarget.NgModule });
+    this.ɵfac = i03.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i03, type: _EuiAlertModule, deps: [], target: i03.ɵɵFactoryTarget.NgModule });
   }
   static {
-    this.ɵmod = i03.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-rc.1", ngImport: i03, type: _EuiAlertModule, declarations: [EuiAlertComponent, EuiAlertTitleComponent], imports: [
+    this.ɵmod = i03.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-rc.3", ngImport: i03, type: _EuiAlertModule, declarations: [EuiAlertComponent, EuiAlertTitleComponent], imports: [
       // Angular and 3rd party
       CommonModule,
       TranslateModule,
@@ -277,7 +277,7 @@ var EuiAlertModule = class _EuiAlertModule {
     ], exports: [EuiAlertComponent, EuiAlertTitleComponent] });
   }
   static {
-    this.ɵinj = i03.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i03, type: _EuiAlertModule, imports: [
+    this.ɵinj = i03.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i03, type: _EuiAlertModule, imports: [
       // Angular and 3rd party
       CommonModule,
       TranslateModule,
@@ -285,7 +285,7 @@ var EuiAlertModule = class _EuiAlertModule {
     ] });
   }
 };
-i03.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i03, type: EuiAlertModule, decorators: [{
+i03.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i03, type: EuiAlertModule, decorators: [{
   type: NgModule,
   args: [{
     imports: [

package/fesm2022/eui-components-eui-autocomplete.mjs

@@ -46,13 +46,13 @@ var EuiAutocompleteOptionComponent = class _EuiAutocompleteOptionComponent {
     this.isGroupItem = false;
   }
   static {
-    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i0, type: _EuiAutocompleteOptionComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component });
+    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i0, type: _EuiAutocompleteOptionComponent, deps: [{ token: i1.BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-rc.1", type: _EuiAutocompleteOptionComponent, selector: "eui-autocomplete-option", inputs: { isActive: ["isActive", "isActive", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isGroupItem: ["isGroupItem", "isGroupItem", booleanAttribute] }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiVariant", "euiVariant"] }], ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-rc.3", type: _EuiAutocompleteOptionComponent, selector: "eui-autocomplete-option", inputs: { isActive: ["isActive", "isActive", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isGroupItem: ["isGroupItem", "isGroupItem", booleanAttribute] }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiVariant", "euiVariant"] }], ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
   }
 };
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i0, type: EuiAutocompleteOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i0, type: EuiAutocompleteOptionComponent, decorators: [{
   type: Component,
   args: [{ selector: "eui-autocomplete-option", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, hostDirectives: [
     {
@@ -90,13 +90,13 @@ var EuiAutocompleteOptionGroupComponent = class _EuiAutocompleteOptionGroupCompo
     return ["eui-autocomplete-option-group"].join(" ").trim();
   }
   static {
-    this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i02, type: _EuiAutocompleteOptionGroupComponent, deps: [], target: i02.ɵɵFactoryTarget.Component });
+    this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i02, type: _EuiAutocompleteOptionGroupComponent, deps: [], target: i02.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-rc.1", type: _EuiAutocompleteOptionGroupComponent, selector: "eui-autocomplete-option-group", inputs: { label: "label" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, ngImport: i02, template: "<ng-content></ng-content>\n", changeDetection: i02.ChangeDetectionStrategy.OnPush, encapsulation: i02.ViewEncapsulation.None });
+    this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-rc.3", type: _EuiAutocompleteOptionGroupComponent, selector: "eui-autocomplete-option-group", inputs: { label: "label" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, ngImport: i02, template: "<ng-content></ng-content>\n", changeDetection: i02.ChangeDetectionStrategy.OnPush, encapsulation: i02.ViewEncapsulation.None });
   }
 };
-i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i02, type: EuiAutocompleteOptionGroupComponent, decorators: [{
+i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i02, type: EuiAutocompleteOptionGroupComponent, decorators: [{
   type: Component2,
   args: [{ selector: "eui-autocomplete-option-group", changeDetection: ChangeDetectionStrategy3.OnPush, encapsulation: ViewEncapsulation3.None, template: "<ng-content></ng-content>\n" }]
 }], propDecorators: { role: [{
@@ -232,6 +232,7 @@ var EuiAutocompleteComponent = class _EuiAutocompleteComponent {
     }
   }
   ngOnInit() {
+    fromEvent(this.elementRef.nativeElement, "focus");
     this.euiAppShellService.state$.pipe(takeUntil(this.destroy$)).subscribe((state2) => {
       this.itemSize = state2.appBaseFontSize === "16px" ? 40 : 35;
     });
@@ -726,10 +727,10 @@ var EuiAutocompleteComponent = class _EuiAutocompleteComponent {
     this.cd.markForCheck();
   }
   static {
-    this.ɵfac = i03.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i03, type: _EuiAutocompleteComponent, deps: [{ token: i12.Overlay }, { token: i03.ChangeDetectorRef }, { token: i03.ViewContainerRef }, { token: i03.ElementRef }, { token: i2.LiveAnnouncer }, { token: i3.ScrollDispatcher }, { token: i4.EuiAppShellService }, { token: i5.BaseStatesDirective }, { token: i6.NgControl, optional: true, self: true }], target: i03.ɵɵFactoryTarget.Component });
+    this.ɵfac = i03.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i03, type: _EuiAutocompleteComponent, deps: [{ token: i12.Overlay }, { token: i03.ChangeDetectorRef }, { token: i03.ViewContainerRef }, { token: i03.ElementRef }, { token: i2.LiveAnnouncer }, { token: i3.ScrollDispatcher }, { token: i4.EuiAppShellService }, { token: i5.BaseStatesDirective }, { token: i6.NgControl, optional: true, self: true }], target: i03.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i03.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-rc.1", type: _EuiAutocompleteComponent, selector: "eui-autocomplete, input[euiAutocomplete]", inputs: { 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", booleanAttribute2], isReadonly: ["isReadonly", "isReadonly", booleanAttribute2], isLoading: ["isLoading", "isLoading", booleanAttribute2], hasChips: ["hasChips", "hasChips", booleanAttribute2], isAsync: ["isAsync", "isAsync", booleanAttribute2], isChipsSorted: ["isChipsSorted", "isChipsSorted", booleanAttribute2], isItemsSorted: ["isItemsSorted", "isItemsSorted", booleanAttribute2], isChipsRemovable: ["isChipsRemovable", "isChipsRemovable", booleanAttribute2], isDuplicateValueAllowed: ["isDuplicateValueAllowed", "isDuplicateValueAllowed", booleanAttribute2], isAddOnBlur: ["isAddOnBlur", "isAddOnBlur", booleanAttribute2], isForceSelection: ["isForceSelection", "isForceSelection", booleanAttribute2], maxVisibleChipsCount: ["maxVisibleChipsCount", "maxVisibleChipsCount", numberAttribute], chipsLabelTruncateCount: ["chipsLabelTruncateCount", "chipsLabelTruncateCount", numberAttribute], isMaxVisibleChipsOpened: ["isMaxVisibleChipsOpened", "isMaxVisibleChipsOpened", booleanAttribute2], isChipsDragAndDrop: ["isChipsDragAndDrop", "isChipsDragAndDrop", booleanAttribute2] }, 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: i5.BaseStatesDirective, inputs: ["euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent"] }], ngImport: i03, template: `<div class="eui-autocomplete__wrapper">
+    this.ɵcmp = i03.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-rc.3", type: _EuiAutocompleteComponent, 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", booleanAttribute2], isReadonly: ["isReadonly", "isReadonly", booleanAttribute2], isLoading: ["isLoading", "isLoading", booleanAttribute2], hasChips: ["hasChips", "hasChips", booleanAttribute2], isAsync: ["isAsync", "isAsync", booleanAttribute2], isChipsSorted: ["isChipsSorted", "isChipsSorted", booleanAttribute2], isItemsSorted: ["isItemsSorted", "isItemsSorted", booleanAttribute2], isChipsRemovable: ["isChipsRemovable", "isChipsRemovable", booleanAttribute2], isDuplicateValueAllowed: ["isDuplicateValueAllowed", "isDuplicateValueAllowed", booleanAttribute2], isAddOnBlur: ["isAddOnBlur", "isAddOnBlur", booleanAttribute2], isForceSelection: ["isForceSelection", "isForceSelection", booleanAttribute2], maxVisibleChipsCount: ["maxVisibleChipsCount", "maxVisibleChipsCount", numberAttribute], chipsLabelTruncateCount: ["chipsLabelTruncateCount", "chipsLabelTruncateCount", numberAttribute], isMaxVisibleChipsOpened: ["isMaxVisibleChipsOpened", "isMaxVisibleChipsOpened", booleanAttribute2], isChipsDragAndDrop: ["isChipsDragAndDrop", "isChipsDragAndDrop", booleanAttribute2] }, 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: i5.BaseStatesDirective, inputs: ["euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiAccent", "euiAccent"] }], ngImport: i03, template: `<div class="eui-autocomplete__wrapper">
     @if (chipsPosition === 'bottom') {
         <ng-container *ngTemplateOutlet="control"></ng-container>
     }
@@ -764,6 +765,7 @@ var EuiAutocompleteComponent = class _EuiAutocompleteComponent {
 <ng-template #control>
     <div *ngIf="!hasChips || (hasChips && !isReadonly)" class="eui-autocomplete__input-container" #inputContainerRef>
         <input
+            [id]="inputId"
             #input
             euiInputText
             [euiClearable]="!isReadonly && !isDisabled"
@@ -869,7 +871,7 @@ var EuiAutocompleteComponent = class _EuiAutocompleteComponent {
 </ng-template>`, styles: [".eui-autocomplete,.eui-autocomplete__wrapper{width:100%}.eui-autocomplete__wrapper .eui-autocomplete__input-container{display:flex;width:100%}.eui-autocomplete__panel-container .eui-autocomplete__panel{box-shadow:var(--eui-sh-8);width:100%}.eui-autocomplete__panel-container.eui-autocomplete__panel-container--no-option .eui-autocomplete__panel{box-shadow:none}.eui-autocomplete.eui-autocomplete--chips-position-bottom .eui-autocomplete__input-container{margin-bottom:var(--eui-s-2xs)}.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-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list,.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-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-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-autocomplete.eui-autocomplete--chips-position-inside .eui-autocomplete__wrapper .eui-chip-list euichiplistappendcontent{flex-grow:1}button~.eui-autocomplete .eui-autocomplete__input,.eui-input-group-addon-item~.eui-autocomplete .eui-autocomplete__input{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.eui-autocomplete:has(+button) .eui-autocomplete__input{border-top-right-radius:0;border-bottom-right-radius:0}.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-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-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon,.eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-icon-svg,.eui-autocomplete-option-group .eui-autocomplete-option-group__label .eui-flag-icon{margin-right:var(--eui-s-2xs)}.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-autocomplete-option:hover{background-color:var(--eui-c-neutral-bg-light)}.eui-autocomplete-option--group-item{padding-left:var(--eui-s-l)}.eui-autocomplete-option .eui-icon,.eui-autocomplete-option .eui-icon-svg,.eui-autocomplete-option .eui-flag-icon{margin-right:var(--eui-s-xs)}.eui-autocomplete-option--primary{border-left-color:var(--eui-c-primary)}.eui-autocomplete-option--secondary{border-left-color:var(--eui-c-neutral-lighter)}.eui-autocomplete-option--info{border-left-color:var(--eui-c-info)}.eui-autocomplete-option--success{border-left-color:var(--eui-c-success)}.eui-autocomplete-option--warning{border-left-color:var(--eui-c-warning)}.eui-autocomplete-option--danger{border-left-color:var(--eui-c-danger)}.eui-autocomplete-option--accent{border-left-color:var(--eui-c-accent)}.eui-autocomplete-option--active{background-color:var(--eui-c-active);outline:2px solid var(--eui-c-focus-visible);outline-offset:-2px}.eui-autocomplete-option--disabled{cursor:default;opacity:.4}.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: i03.ChangeDetectionStrategy.OnPush, encapsulation: i03.ViewEncapsulation.None });
   }
 };
-i03.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i03, type: EuiAutocompleteComponent, decorators: [{
+i03.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i03, type: EuiAutocompleteComponent, decorators: [{
   type: Component3,
   args: [{ selector: "eui-autocomplete, input[euiAutocomplete]", changeDetection: ChangeDetectionStrategy5.OnPush, encapsulation: ViewEncapsulation5.None, animations: [panelAnimation], hostDirectives: [
     {
@@ -918,6 +920,7 @@ i03.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", n
 <ng-template #control>
     <div *ngIf="!hasChips || (hasChips && !isReadonly)" class="eui-autocomplete__input-container" #inputContainerRef>
         <input
+            [id]="inputId"
             #input
             euiInputText
             [euiClearable]="!isReadonly && !isDisabled"
@@ -1028,6 +1031,8 @@ i03.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", n
 }] }], propDecorators: { cssClasses: [{
   type: HostBinding3,
   args: ["class"]
+}], inputId: [{
+  type: Input3
 }], autocompleteData: [{
   type: Input3
 }], visibleOptions: [{
@@ -1158,10 +1163,10 @@ import { EuiIconModule } from "@eui/components/eui-icon";
 import * as i04 from "@angular/core";
 var EuiAutocompleteModule = class _EuiAutocompleteModule {
   static {
-    this.ɵfac = i04.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i04, type: _EuiAutocompleteModule, deps: [], target: i04.ɵɵFactoryTarget.NgModule });
+    this.ɵfac = i04.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i04, type: _EuiAutocompleteModule, deps: [], target: i04.ɵɵFactoryTarget.NgModule });
   }
   static {
-    this.ɵmod = i04.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-rc.1", ngImport: i04, type: _EuiAutocompleteModule, declarations: [
+    this.ɵmod = i04.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-rc.3", ngImport: i04, type: _EuiAutocompleteModule, declarations: [
       EuiAutocompleteComponent,
       EuiAutocompleteOptionComponent,
       EuiAutocompleteOptionGroupComponent
@@ -1178,7 +1183,7 @@ var EuiAutocompleteModule = class _EuiAutocompleteModule {
     ], exports: [EuiAutocompleteComponent] });
   }
   static {
-    this.ɵinj = i04.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i04, type: _EuiAutocompleteModule, imports: [
+    this.ɵinj = i04.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i04, type: _EuiAutocompleteModule, imports: [
       CommonModule,
       ReactiveFormsModule,
       OverlayModule,
@@ -1191,7 +1196,7 @@ var EuiAutocompleteModule = class _EuiAutocompleteModule {
     ] });
   }
 };
-i04.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.1", ngImport: i04, type: EuiAutocompleteModule, decorators: [{
+i04.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-rc.3", ngImport: i04, type: EuiAutocompleteModule, decorators: [{
   type: NgModule,
   args: [{
     imports: [