@odx/angular 1.0.4 → 2.1.1

package/fesm2015/odx-angular-components-rail-navigation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"odx-angular-components-rail-navigation.mjs","sources":["../../../../libs/angular/components/rail-navigation/src/lib/components/rail-navigation-item.component.ts","../../../../libs/angular/components/rail-navigation/src/lib/components/rail-navigation-item.component.html","../../../../libs/angular/components/rail-navigation/src/lib/rail-navigation.component.ts","../../../../libs/angular/components/rail-navigation/src/lib/rail-navigation.component.html","../../../../libs/angular/components/rail-navigation/src/lib/rail-navigation.module.ts","../../../../libs/angular/components/rail-navigation/src/odx-angular-components-rail-navigation.ts"],"sourcesContent":["import { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ChangeDetectionStrategy, Component, inject, Input, ViewEncapsulation } from '@angular/core';\nimport { RouterLinkActive } from '@angular/router';\nimport { WithDisabledState, WithTabIndex } from '@odx/angular';\nimport { IconComponent } from '@odx/angular/components/icon';\nimport { CSSComponent } from '@odx/angular/internal';\nimport { injectElement, Transform } from '@odx/angular/utils';\n\n@CSSComponent('rail-navigation-item')\n@Component({\n  standalone: true,\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'a[odxRailNavigationItem][iconName], button[odxRailNavigationItem][iconName]',\n  templateUrl: './rail-navigation-item.component.html',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [IconComponent],\n  hostDirectives: [WithDisabledState, WithTabIndex],\n  host: {\n    '[class.is-selected]': 'isSelected || routerLinkActive?.isActive',\n  },\n})\nexport class RailNavigationItemComponent {\n  public static ngAcceptInputType_isSelected: BooleanInput;\n\n  protected readonly routerLinkActive = inject(RouterLinkActive, { optional: true });\n\n  public readonly element = injectElement();\n\n  @Transform(coerceBooleanProperty)\n  @Input()\n  public isSelected = false;\n\n  @Input()\n  public iconName!: string;\n}\n","<odx-icon [name]=\"iconName\" iconSet=\"core\" size=\"large\"></odx-icon>\n<span class=\"odx-rail-navigation-item__container\">\n  <ng-content></ng-content>\n</span>\n","import { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';\nimport { CSSComponent } from '@odx/angular/internal';\nimport { injectElement, Transform } from '@odx/angular/utils';\nimport { RailNavigationItemComponent } from './components/rail-navigation-item.component';\n\n@CSSComponent('rail-navigation')\n@Component({\n  standalone: true,\n  selector: 'odx-rail-navigation',\n  templateUrl: 'rail-navigation.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  imports: [RailNavigationItemComponent],\n  host: {\n    '[class.is-open]': 'isOpen',\n  },\n})\nexport class RailNavigationComponent {\n  public static ngAcceptInputType_isOpen: BooleanInput;\n\n  public readonly element = injectElement();\n\n  @Transform(coerceBooleanProperty)\n  @Input()\n  public isOpen = true;\n\n  @Output()\n  public isOpenChange = new EventEmitter<boolean>();\n\n  public toggle(): void {\n    this.isOpen = !this.isOpen;\n    this.isOpenChange.emit(this.isOpen);\n  }\n\n  public open(): void {\n    this.isOpen = true;\n    this.isOpenChange.emit(this.isOpen);\n  }\n\n  public close(): void {\n    this.isOpen = false;\n    this.isOpenChange.emit(this.isOpen);\n  }\n}\n","<nav class=\"odx-rail-navigation__content\">\n  <ng-content selector=\"a[odxRailNavigationItem], button[odxRailNavigationItem]\"></ng-content>\n</nav>\n<button odxRailNavigationItem class=\"odx-rail-navigation__expand\" iconName=\"chevron-right\" (click)=\"toggle()\"></button>\n","import { NgModule } from '@angular/core';\nimport { CoreModule } from '@odx/angular';\nimport { RailNavigationItemComponent } from './components/rail-navigation-item.component';\nimport { RailNavigationComponent } from './rail-navigation.component';\n\nconst modules = [RailNavigationComponent, RailNavigationItemComponent];\n@NgModule({\n  imports: modules,\n  exports: [...modules, CoreModule],\n})\nexport class RailNavigationModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"odx-angular-components-rail-navigation.mjs","sources":["../../../../libs/angular/components/rail-navigation/src/lib/components/rail-navigation-item/rail-navigation-item.component.ts","../../../../libs/angular/components/rail-navigation/src/lib/components/rail-navigation-item/rail-navigation-item.component.html","../../../../libs/angular/components/rail-navigation/src/lib/models/rail-navigation-variant.ts","../../../../libs/angular/components/rail-navigation/src/lib/rail-navigation.component.ts","../../../../libs/angular/components/rail-navigation/src/lib/rail-navigation.component.html","../../../../libs/angular/components/rail-navigation/src/lib/rail-navigation.module.ts","../../../../libs/angular/components/rail-navigation/src/odx-angular-components-rail-navigation.ts"],"sourcesContent":["import { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation, inject } from '@angular/core';\nimport { RouterLinkActive } from '@angular/router';\nimport { WithDisabledState, WithTabIndex } from '@odx/angular';\nimport { IconComponent } from '@odx/angular/components/icon';\nimport { CSSComponent } from '@odx/angular/internal';\nimport { Transform, injectElement } from '@odx/angular/utils';\n\n@CSSComponent('rail-navigation-item')\n@Component({\n  standalone: true,\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'a[odxRailNavigationItem][iconName], button[odxRailNavigationItem][iconName]',\n  templateUrl: './rail-navigation-item.component.html',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [IconComponent],\n  hostDirectives: [WithDisabledState, WithTabIndex],\n  host: {\n    '[class.is-selected]': 'isSelected || routerLinkActive?.isActive',\n  },\n})\nexport class RailNavigationItemComponent {\n  public static ngAcceptInputType_isSelected: BooleanInput;\n\n  protected readonly routerLinkActive = inject(RouterLinkActive, { optional: true });\n\n  public readonly element = injectElement();\n\n  @Transform(coerceBooleanProperty)\n  @Input()\n  public isSelected = false;\n\n  @Input()\n  public iconName!: string;\n}\n","<odx-icon [name]=\"iconName\" iconSet=\"core\" size=\"large\"></odx-icon>\n<span class=\"odx-rail-navigation-item__container\">\n  <ng-content></ng-content>\n</span>\n","export type RailNavigationVariant = (typeof RailNavigationVariant)[keyof typeof RailNavigationVariant];\n\nexport const RailNavigationVariant = {\n  DEFAULT: 'default',\n  BAR: 'bar',\n} as const;\n","import { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';\nimport { CSSComponent, CSSModifier } from '@odx/angular/internal';\nimport { Transform, injectElement } from '@odx/angular/utils';\nimport { RailNavigationItemComponent } from './components/rail-navigation-item/rail-navigation-item.component';\nimport { RailNavigationVariant } from './models';\n\n@CSSComponent('rail-navigation')\n@Component({\n  standalone: true,\n  selector: 'odx-rail-navigation',\n  templateUrl: 'rail-navigation.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  imports: [RailNavigationItemComponent],\n  host: {\n    '[class.is-open]': 'isOpen',\n  },\n})\nexport class RailNavigationComponent {\n  public static ngAcceptInputType_isOpen: BooleanInput;\n\n  public readonly element = injectElement();\n\n  @Transform(coerceBooleanProperty)\n  @Input()\n  public isOpen = true;\n\n  @CSSModifier()\n  @Input()\n  public variant: RailNavigationVariant = RailNavigationVariant.DEFAULT;\n\n  @Output()\n  public isOpenChange = new EventEmitter<boolean>();\n\n  public toggle(forceState?: boolean): void {\n    if (this.variant === RailNavigationVariant.BAR) return;\n    this.isOpen = forceState ?? !this.isOpen;\n    this.isOpenChange.emit(this.isOpen);\n  }\n\n  public open(): void {\n    this.toggle(true);\n  }\n\n  public close(): void {\n    this.toggle(false);\n  }\n}\n","<nav class=\"odx-rail-navigation__content\">\n  <ng-content selector=\"a[odxRailNavigationItem], button[odxRailNavigationItem]\"></ng-content>\n</nav>\n<button odxRailNavigationItem class=\"odx-rail-navigation__expand\" iconName=\"chevron-right\" (click)=\"toggle()\"></button>\n","import { NgModule } from '@angular/core';\nimport { CoreModule } from '@odx/angular';\nimport { RailNavigationItemComponent } from './components/rail-navigation-item/rail-navigation-item.component';\nimport { RailNavigationComponent } from './rail-navigation.component';\n\nconst modules = [RailNavigationComponent, RailNavigationItemComponent];\n@NgModule({\n  imports: modules,\n  exports: [CoreModule, ...modules],\n})\nexport class RailNavigationModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/odx-angular-components-select.mjs

@@ -1,38 +1,34 @@
 import { __decorate, __metadata } from 'tslib';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, ChangeDetectorRef, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, HostListener, Directive, Pipe, EventEmitter, forwardRef, ContentChildren, ViewChild, Output, ContentChild, NgModule } from '@angular/core';
+import { InjectionToken, inject, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Directive, HostListener, Pipe, forwardRef, ContentChildren, ContentChild, NgModule } from '@angular/core';
 import * as i2 from '@odx/angular';
-import { DisabledController, detectControllerChanges, CoreModule, ODX_STRINGIFY, ODX_STRING_SEARCH_HANDLER, ODX_IDENTITY_MATCHER, ReadonlyController } from '@odx/angular';
+import { DisabledController, detectControllerChanges, CoreModule, ODX_IDENTITY_MATCHER } from '@odx/angular';
 import { DynamicViewDirective } from '@odx/angular/cdk/dynamic-view';
+import { OptionControl } from '@odx/angular/cdk/option-control';
 import { CheckboxComponent } from '@odx/angular/components/checkbox';
 import { CSSComponent, CSSModifier } from '@odx/angular/internal';
-import { untilDestroyed, injectElement, Transform, Pure, deferFn, isFunction } from '@odx/angular/utils';
+import { Transform, deferFn } from '@odx/angular/utils';
 import * as i1 from '@angular/common';
-import { fromEvent, map, distinctUntilChanged } from 'rxjs';
+import { BaseSearchFieldDirective, BaseSearchFilterPipe, AutocompleteControl } from '@odx/angular/cdk/autocomplete-control';
 import { ActiveDescendantKeyManager } from '@angular/cdk/a11y';
-import { CustomFormControl } from '@odx/angular/cdk/custom-form-control';
 import { DropdownDirective } from '@odx/angular/components/dropdown';
 import { IconComponent } from '@odx/angular/components/icon';
 import { LoadingSpinnerModule } from '@odx/angular/components/loading-spinner';
 import { fromQueryList } from '@odx/angular/rxjs';
 
-const SELECT_CONTROL = new InjectionToken('@odx/angular/components/select::SelectControl');
+const SELECT_CONTROL = new InjectionToken('@odx/angular/components/select::SelectComponent');
 
-let OptionComponent = class OptionComponent {
+let SelectOptionComponent = class SelectOptionComponent extends OptionControl {
     get disabled() {
         var _a;
         return !!((_a = this.disabledController) === null || _a === void 0 ? void 0 : _a.disabled);
     }
     constructor() {
+        super();
         this.disabledController = DisabledController.inject();
-        this.takeUntilDestroyed = untilDestroyed();
-        this.cdr = inject(ChangeDetectorRef);
         this.selectControl = inject(SELECT_CONTROL);
-        this.isActive = false;
-        this.element = injectElement();
         this.isSelected = false;
-        this.value = null;
         this.notFoundMessage = false;
         if (!this.selectControl.multiple) {
             detectControllerChanges(this.selectControl)
@@ -45,10 +41,6 @@ let OptionComponent = class OptionComponent {
     ngOnInit() {
         this.isSelected = this.selectControl.isOptionSelected(this);
     }
-    getLabel() {
-        var _a;
-        return (_a = this.element.nativeElement.textContent) !== null && _a !== void 0 ? _a : '';
-    }
     setActiveStyles() {
         if (this.disabled)
             return;
@@ -60,70 +52,48 @@ let OptionComponent = class OptionComponent {
             this.selectControl.selectOption(this);
         }
     }
-    setInactiveStyles() {
-        this.isActive = false;
-    }
     switchCheckbox() {
         if (this.selectControl.multiple) {
             this.isSelected = !this.isSelected;
             this.cdr.markForCheck();
         }
     }
-    select(event) {
-        event.stopPropagation();
-        event.preventDefault();
+    selectOption() {
         this.selectControl.selectOption(this);
     }
 };
-OptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-OptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OptionComponent, isStandalone: true, selector: "odx-option", inputs: { value: "value", notFoundMessage: "notFoundMessage" }, host: { attributes: { "role": "option" }, listeners: { "click": "select($event)" }, properties: { "attr.aria-selected": "isSelected", "attr.aria-disabled": "disabled || null", "class.is-disabled": "disabled", "class.is-selected": "isSelected", "class.is-active": "isActive" } }, providers: [DisabledController.connect()], ngImport: i0, template: "<odx-checkbox [checked]=\"isSelected\" *ngIf=\"selectControl.multiple && !notFoundMessage; else single\">\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</odx-checkbox>\n\n<ng-template #single>\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CheckboxComponent, selector: "odx-checkbox", inputs: ["indeterminate"], outputs: ["indeterminateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+SelectOptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SelectOptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectOptionComponent, isStandalone: true, selector: "odx-select-option, odx-option", inputs: { notFoundMessage: "notFoundMessage" }, host: { properties: { "attr.aria-disabled": "disabled || null", "class.is-disabled": "disabled" } }, providers: [DisabledController.connect()], usesInheritance: true, ngImport: i0, template: "<odx-checkbox [checked]=\"isSelected\" *ngIf=\"selectControl.multiple && !notFoundMessage; else single\">\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</odx-checkbox>\n\n<ng-template #single>\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CheckboxComponent, selector: "odx-checkbox", inputs: ["indeterminate"], outputs: ["indeterminateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     Transform(coerceBooleanProperty),
     __metadata("design:type", Object)
-], OptionComponent.prototype, "notFoundMessage", void 0);
-OptionComponent = __decorate([
-    CSSComponent('option'),
+], SelectOptionComponent.prototype, "notFoundMessage", void 0);
+SelectOptionComponent = __decorate([
+    CSSComponent('select-option'),
     __metadata("design:paramtypes", [])
-], OptionComponent);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OptionComponent, decorators: [{
+], SelectOptionComponent);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectOptionComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'odx-option', imports: [CoreModule, DynamicViewDirective, CheckboxComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [DisabledController.connect()], host: {
-                        '[attr.aria-selected]': 'isSelected',
+            args: [{ standalone: true, selector: 'odx-select-option, odx-option', imports: [CoreModule, DynamicViewDirective, CheckboxComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [DisabledController.connect()], host: {
                         '[attr.aria-disabled]': 'disabled || null',
                         '[class.is-disabled]': 'disabled',
-                        '[class.is-selected]': 'isSelected',
-                        '[class.is-active]': 'isActive',
-                        role: 'option',
                     }, template: "<odx-checkbox [checked]=\"isSelected\" *ngIf=\"selectControl.multiple && !notFoundMessage; else single\">\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</odx-checkbox>\n\n<ng-template #single>\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { value: [{
-                type: Input
-            }], notFoundMessage: [{
+        }], ctorParameters: function () { return []; }, propDecorators: { notFoundMessage: [{
                 type: Input
-            }], select: [{
-                type: HostListener,
-                args: ['click', ['$event']]
             }] } });
 
-let SelectSearchFieldDirective = class SelectSearchFieldDirective {
+let SelectSearchFieldDirective = class SelectSearchFieldDirective extends BaseSearchFieldDirective {
     constructor() {
-        this.takeUntilDestroyed = untilDestroyed();
-        this.element = injectElement();
+        super(...arguments);
         // eslint-disable-next-line @angular-eslint/no-input-rename
         this.notFoundContent = null;
-        this.valueChange$ = fromEvent(this.element.nativeElement, 'input').pipe(map(() => this.getValue()), distinctUntilChanged(), this.takeUntilDestroyed());
-    }
-    reset() {
-        this.element.nativeElement.value = '';
-    }
-    focus() {
-        this.element.nativeElement.focus();
     }
-    getValue() {
-        return this.element.nativeElement.value;
+    handleDelete() {
+        this.reset();
     }
 };
-SelectSearchFieldDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectSearchFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-SelectSearchFieldDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: SelectSearchFieldDirective, isStandalone: true, selector: "input[odxSelectSearchField]", inputs: { notFoundContent: ["odxSelectSearchField", "notFoundContent"] }, host: { listeners: { "keydown.delete": "reset()" }, properties: { "class.odx-form-field-control": "true" } }, ngImport: i0 });
+SelectSearchFieldDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectSearchFieldDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+SelectSearchFieldDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: SelectSearchFieldDirective, isStandalone: true, selector: "input[odxSelectSearchField]", inputs: { notFoundContent: ["odxSelectSearchField", "notFoundContent"] }, host: { listeners: { "keydown.delete": "handleDelete()" } }, usesInheritance: true, ngImport: i0 });
 SelectSearchFieldDirective = __decorate([
     CSSComponent('select__search')
 ], SelectSearchFieldDirective);
@@ -132,56 +102,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             args: [{
                     standalone: true,
                     selector: 'input[odxSelectSearchField]',
-                    host: {
-                        '[class.odx-form-field-control]': 'true',
-                    },
                 }]
         }], propDecorators: { notFoundContent: [{
                 type: Input,
                 args: ['odxSelectSearchField']
-            }], reset: [{
+            }], handleDelete: [{
                 type: HostListener,
                 args: ['keydown.delete']
             }] } });
 
-class SelectSearchFilterPipe {
+class SelectSearchFilterPipe extends BaseSearchFilterPipe {
     constructor() {
-        this.searchController = inject(SELECT_CONTROL, { optional: true });
-        this.stringify = inject(ODX_STRINGIFY);
-        this.stringSearchHandler = inject(ODX_STRING_SEARCH_HANDLER);
+        super(...arguments);
+        this.hostController = inject(SELECT_CONTROL, { optional: true });
     }
     get searchField() {
         var _a;
-        return (_a = this.searchController) === null || _a === void 0 ? void 0 : _a.searchField;
+        return (_a = this.hostController) === null || _a === void 0 ? void 0 : _a.searchField;
     }
-    transform(items, searchHandler) {
-        if (this.searchField) {
-            return this.filter(items, this.searchField.getValue(), searchHandler);
-        }
-        return items;
+    queryHandler(query) {
+        return query === null || query === void 0 ? void 0 : query.trim();
     }
-    filter(items, query, searchHandler) {
+    get searchBy() {
         var _a, _b;
-        if (!items) {
-            return null;
-        }
-        query = query.trim();
-        if (query === '') {
-            return items;
-        }
-        const search = searchHandler !== null && searchHandler !== void 0 ? searchHandler : this.stringSearchHandler;
-        const stringify = (_b = (_a = this.searchController) === null || _a === void 0 ? void 0 : _a.stringify) !== null && _b !== void 0 ? _b : this.stringify;
-        return items.filter((item) => search(stringify(item), query));
+        return (_b = (_a = this.hostController) === null || _a === void 0 ? void 0 : _a.stringify) !== null && _b !== void 0 ? _b : this.stringify;
     }
 }
-SelectSearchFilterPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectSearchFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+SelectSearchFilterPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectSearchFilterPipe, deps: null, target: i0.ɵɵFactoryTarget.Pipe });
 SelectSearchFilterPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SelectSearchFilterPipe, isStandalone: true, name: "odxSelectSearchFilter", pure: false });
-__decorate([
-    Pure,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, String, Function]),
-    __metadata("design:returntype", Object)
-], SelectSearchFilterPipe.prototype, "filter", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectSearchFilterPipe, decorators: [{
             type: Pipe,
             args: [{
@@ -189,49 +137,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                     name: 'odxSelectSearchFilter',
                     standalone: true,
                 }]
-        }], propDecorators: { filter: [] } });
+        }] });
 
 var SelectComponent_1;
-let SelectComponent = SelectComponent_1 = class SelectComponent extends CustomFormControl {
-    get hasOptions() {
-        return !!this.options && this.options.length > 0;
-    }
-    get isOpen() {
-        var _a;
-        return !!((_a = this.dropdown) === null || _a === void 0 ? void 0 : _a.isOpen);
-    }
-    get selectedOptionContent() {
-        var _a;
-        return this.selectedOption ? (_a = this.selectedOptionTemplate) !== null && _a !== void 0 ? _a : this.selectedOptionText : null;
-    }
+let SelectComponent = SelectComponent_1 = class SelectComponent extends AutocompleteControl {
     constructor() {
-        super(null);
-        this.changeDetector = inject(ChangeDetectorRef);
+        super(...arguments);
         this.searchFieldEnabled = false;
-        this.smoothScrollEnabled = false;
         this.selectedOption = null;
         this.selectedOptionText = null;
-        this.element = injectElement();
         this.placeholder = '';
-        this.isLoading = false;
         this.multiple = false;
         this.selectedOptionTemplate = null;
         this.identityMatcher = inject(ODX_IDENTITY_MATCHER);
-        this.change = new EventEmitter();
-        detectControllerChanges(this).subscribe();
     }
-    ngAfterViewInit() {
+    get selectedOptionContent() {
         var _a;
+        return this.selectedOption ? (_a = this.selectedOptionTemplate) !== null && _a !== void 0 ? _a : this.selectedOptionText : null;
+    }
+    ngAfterViewInit() {
         if (!this.options)
             return;
-        this.keyManager = new ActiveDescendantKeyManager(this.options).withHomeAndEnd().skipPredicate((item) => item.disabled);
-        fromQueryList(this.options).subscribe(() => {
-            this.updateSelectedOption();
-            if (this.isOpen) {
-                deferFn(() => this.activateSelectedOption());
-            }
-        });
-        (_a = this.searchField) === null || _a === void 0 ? void 0 : _a.valueChange$.subscribe(() => this.triggerControllerChange());
+        this.initKeyManager(this.options);
+        this.handleQueryListOption(this.options);
+        this.handleSearchFieldChanges();
     }
     registerOnChange(fn) {
         super.registerOnChange((value) => {
@@ -240,16 +169,16 @@ let SelectComponent = SelectComponent_1 = class SelectComponent extends CustomFo
         });
     }
     selectOption(option) {
-        var _a, _b;
+        var _a;
         if (option && !option.disabled) {
-            this.change.emit();
+            this.optionSelected.emit();
             option.switchCheckbox();
             const value = this.multiple
                 ? (_a = this.options) === null || _a === void 0 ? void 0 : _a.toArray().filter(({ isSelected }) => isSelected).map(({ value }) => value)
                 : option.value;
             this.updateValue(value !== null && value !== void 0 ? value : null);
         }
-        !this.multiple && ((_b = this.dropdown) === null || _b === void 0 ? void 0 : _b.close());
+        !this.multiple && this.closeDropdown();
     }
     isOptionSelected(option) {
         if (option && !option.disabled) {
@@ -260,13 +189,24 @@ let SelectComponent = SelectComponent_1 = class SelectComponent extends CustomFo
         }
         return false;
     }
-    scrollOptionIntoView({ element }) {
-        const behavior = this.smoothScrollEnabled ? 'smooth' : undefined;
-        if (isFunction(element.nativeElement.scrollIntoView)) {
-            element.nativeElement.scrollIntoView({ block: 'center', behavior });
-        }
+    initKeyManager(options) {
+        this.keyManager = new ActiveDescendantKeyManager(options).withHomeAndEnd().skipPredicate((item) => item.disabled);
     }
-    openDropdown(event) {
+    handleQueryListOption(options) {
+        fromQueryList(options)
+            .pipe(this.takeUntilDestroyed())
+            .subscribe(() => {
+            this.updateSelectedOption();
+            if (this.isOpen) {
+                deferFn(() => this.activateSelectedOption());
+            }
+        });
+    }
+    handleSearchFieldChanges() {
+        var _a;
+        (_a = this.searchField) === null || _a === void 0 ? void 0 : _a.valueChange$.pipe(this.takeUntilDestroyed()).subscribe(() => this.triggerControllerChange());
+    }
+    handleControllerEvent(event) {
         var _a, _b, _c;
         if (this.isLoading || ((_a = this.readonlyController) === null || _a === void 0 ? void 0 : _a.readonly))
             return;
@@ -280,12 +220,6 @@ let SelectComponent = SelectComponent_1 = class SelectComponent extends CustomFo
         }
         (_c = this.keyManager) === null || _c === void 0 ? void 0 : _c.onKeydown(event);
     }
-    handleFocusOut(event) {
-        if (this.isOpen) {
-            event.stopImmediatePropagation();
-        }
-        this.onTouched();
-    }
     activateSelectedOption() {
         var _a, _b, _c, _d;
         let activeIndex = (_a = this.options) === null || _a === void 0 ? void 0 : _a.toArray().findIndex((option) => option.isSelected && !option.disabled);
@@ -313,12 +247,6 @@ let SelectComponent = SelectComponent_1 = class SelectComponent extends CustomFo
         var _a;
         (_a = this.searchField) === null || _a === void 0 ? void 0 : _a.reset();
     }
-    disableSmoothScroll() {
-        this.smoothScrollEnabled = false;
-    }
-    enableSmoothScroll() {
-        this.smoothScrollEnabled = true;
-    }
     updateSelectedOption() {
         var _a, _b, _c, _d, _e, _f;
         const options = (_a = this.options) === null || _a === void 0 ? void 0 : _a.toArray();
@@ -338,83 +266,60 @@ let SelectComponent = SelectComponent_1 = class SelectComponent extends CustomFo
         this.changeDetector.detectChanges();
     }
 };
-SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectComponent, isStandalone: true, selector: "odx-select", inputs: { placeholder: "placeholder", isLoading: "isLoading", multiple: "multiple", selectedOptionTemplate: "selectedOptionTemplate", stringify: "stringify", identityMatcher: "identityMatcher" }, outputs: { change: "change" }, host: { listeners: { "click": "openDropdown($event)", "keydown": "openDropdown($event)", "focusout": "handleFocusOut($event)" }, properties: { "attr.aria-disabled": "isDisabled || null", "class.is-open": "isOpen", "tabindex": "searchFieldEnabled || isDisabled ? -1 : 0", "attr.aria-multiselectable": "multiple" } }, providers: [
-        DisabledController.connect(),
-        ReadonlyController.connect(),
+SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectComponent, isStandalone: true, selector: "odx-select", inputs: { placeholder: "placeholder", multiple: "multiple", selectedOptionTemplate: "selectedOptionTemplate", identityMatcher: "identityMatcher" }, host: { listeners: { "click": "handleControllerEvent($event)", "keydown": "handleControllerEvent($event)" }, properties: { "tabindex": "searchFieldEnabled || isDisabled ? -1 : 0", "attr.aria-multiselectable": "multiple" } }, providers: [
         {
             provide: SELECT_CONTROL,
             useExisting: forwardRef(() => SelectComponent_1),
         },
-    ], queries: [{ propertyName: "searchField", first: true, predicate: SelectSearchFieldDirective, descendants: true }, { propertyName: "options", predicate: OptionComponent, descendants: true }], viewQueries: [{ propertyName: "dropdown", first: true, predicate: DropdownDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n  aria-haspopup=\"listbox\"\n  class=\"odx-select__trigger\"\n  [odxDropdown]=\"dropdownContent\"\n  [odxDropdownDisabled]=\"isDisabled || isReadonly\"\n  [odxDropdownOptions]=\"{ matchReferenceWidth: true, offset: 4, outerPadding: 10, position: 'bottom-start' }\"\n  [odxDropdownReferenceElement]=\"element.nativeElement\"\n  [odxDropdownShowLoader]=\"isLoading\"\n  (odxDropdownBeforeOpen)=\"onDropdownOpen()\"\n  (odxDropdownBeforeClose)=\"onDropdownClose()\"\n  (odxDropdownAfterClose)=\"onDropdownClosed()\"\n  (odxDropdownAfterOpen)=\"enableSmoothScroll()\"\n>\n  <ng-template [ngIf]=\"!searchFieldEnabled\" [ngIfElse]=\"searchFieldTemplate\">\n    <div class=\"odx-select__value\" *ngIf=\"selectedOptionContent; else placeholderTemplate\">\n      <ng-template [odxDynamicView]=\"selectedOptionContent\" [odxDynamicViewContext]=\"{ $implicit: value }\"></ng-template>\n    </div>\n  </ng-template>\n  <ng-template #placeholderTemplate>\n    <div class=\"odx-select__placeholder\">\n      {{ placeholder }}\n    </div>\n  </ng-template>\n  <ng-template #searchFieldTemplate>\n    <ng-content select=\"[odxSelectSearchField]\"></ng-content>\n  </ng-template>\n  <odx-icon class=\"odx-select__indicator\" name=\"chevron-down\" iconSet=\"core\"></odx-icon>\n</div>\n<ng-template #dropdownContent>\n  <div class=\"odx-select-dropdown\" role=\"listbox\">\n    <ng-template [ngIf]=\"hasOptions\" [ngIfElse]=\"noOptionsTemplate\">\n      <ng-content></ng-content>\n    </ng-template>\n    <ng-template #noOptionsTemplate>\n      <odx-option disabled notFoundMessage>\n        <ng-template [odxDynamicView]=\"searchField?.notFoundContent\"></ng-template>\n      </odx-option>\n    </ng-template>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DisabledController, selector: "[disabled]", inputs: ["disabled"] }, { kind: "directive", type: DropdownDirective, selector: "[odxDropdown]", inputs: ["odxDropdown", "odxDropdownDisabled", "odxDropdownShowLoader", "odxDropdownOptions", "odxDropdownReferenceElement", "odxDropdownTriggerElement", "odxDropdownHost", "odxDropdownOpenTrigger", "odxDropdownCloseTrigger"], outputs: ["odxDropdownBeforeOpen", "odxDropdownAfterOpen", "odxDropdownBeforeClose", "odxDropdownAfterClose"], exportAs: ["odxDropdown"] }, { kind: "component", type: IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet"] }, { kind: "directive", type: DynamicViewDirective, selector: "ng-template[odxDynamicView]", inputs: ["odxDynamicView", "odxDynamicViewInjector", "odxDynamicViewContext"] }, { kind: "component", type: OptionComponent, selector: "odx-option", inputs: ["value", "notFoundMessage"] }, { kind: "ngmodule", type: LoadingSpinnerModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-__decorate([
-    Transform(coerceBooleanProperty),
-    __metadata("design:type", Object)
-], SelectComponent.prototype, "isLoading", void 0);
+    ], queries: [{ propertyName: "searchField", first: true, predicate: SelectSearchFieldDirective, descendants: true }, { propertyName: "options", predicate: SelectOptionComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n  aria-haspopup=\"listbox\"\n  class=\"odx-select__trigger\"\n  [odxDropdown]=\"dropdownContent\"\n  [odxDropdownDisabled]=\"isDisabled || isReadonly\"\n  [odxDropdownOptions]=\"{ matchReferenceWidth: true, offset: 4, outerPadding: 10, position: 'bottom-start' }\"\n  [odxDropdownReferenceElement]=\"element.nativeElement\"\n  [odxDropdownShowLoader]=\"isLoading\"\n  (odxDropdownBeforeOpen)=\"onDropdownOpen()\"\n  (odxDropdownBeforeClose)=\"onDropdownClose()\"\n  (odxDropdownAfterClose)=\"onDropdownClosed()\"\n  (odxDropdownAfterOpen)=\"enableSmoothScroll()\"\n>\n  <ng-template [ngIf]=\"!searchFieldEnabled\" [ngIfElse]=\"searchFieldTemplate\">\n    <div class=\"odx-select__value\" *ngIf=\"selectedOptionContent; else placeholderTemplate\">\n      <ng-template [odxDynamicView]=\"selectedOptionContent\" [odxDynamicViewContext]=\"{ $implicit: value }\"></ng-template>\n    </div>\n  </ng-template>\n  <ng-template #placeholderTemplate>\n    <div class=\"odx-select__placeholder\">\n      {{ placeholder }}\n    </div>\n  </ng-template>\n  <ng-template #searchFieldTemplate>\n    <ng-content select=\"[odxSelectSearchField]\"></ng-content>\n  </ng-template>\n  <odx-icon class=\"odx-select__indicator\" name=\"chevron-down\" iconSet=\"core\"></odx-icon>\n</div>\n<ng-template #dropdownContent>\n  <div class=\"odx-dropdown__option-list\" role=\"listbox\">\n    <ng-template [ngIf]=\"hasOptions\" [ngIfElse]=\"noOptionsTemplate\">\n      <ng-content></ng-content>\n    </ng-template>\n    <ng-template #noOptionsTemplate>\n      <odx-select-option disabled notFoundMessage>\n        <ng-template [odxDynamicView]=\"searchField?.notFoundContent\"></ng-template>\n      </odx-select-option>\n    </ng-template>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DisabledController, selector: "[disabled]", inputs: ["disabled"] }, { kind: "directive", type: DropdownDirective, selector: "[odxDropdown]", inputs: ["odxDropdown", "odxDropdownDisabled", "odxDropdownShowLoader", "odxDropdownClickOutsideActive", "odxDropdownOptions", "odxDropdownReferenceElement", "odxDropdownTriggerElement", "odxDropdownHost", "odxDropdownOpenTrigger", "odxDropdownCloseTrigger"], outputs: ["odxDropdownBeforeOpen", "odxDropdownAfterOpen", "odxDropdownBeforeClose", "odxDropdownAfterClose"], exportAs: ["odxDropdown"] }, { kind: "component", type: IconComponent, selector: "odx-icon", inputs: ["inline", "size", "name", "iconSet"] }, { kind: "directive", type: DynamicViewDirective, selector: "ng-template[odxDynamicView]", inputs: ["odxDynamicView", "odxDynamicViewInjector", "odxDynamicViewContext"] }, { kind: "component", type: SelectOptionComponent, selector: "odx-select-option, odx-option", inputs: ["notFoundMessage"] }, { kind: "ngmodule", type: LoadingSpinnerModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     CSSModifier(),
     Transform(coerceBooleanProperty),
     __metadata("design:type", Object)
 ], SelectComponent.prototype, "multiple", void 0);
 SelectComponent = SelectComponent_1 = __decorate([
-    CSSComponent('select'),
-    __metadata("design:paramtypes", [])
+    CSSComponent('select')
 ], SelectComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'odx-select', imports: [CoreModule, DropdownDirective, IconComponent, DynamicViewDirective, OptionComponent, LoadingSpinnerModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
-                        DisabledController.connect(),
-                        ReadonlyController.connect(),
+            args: [{ standalone: true, selector: 'odx-select', imports: [CoreModule, DropdownDirective, IconComponent, DynamicViewDirective, SelectOptionComponent, LoadingSpinnerModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
                             provide: SELECT_CONTROL,
                             useExisting: forwardRef(() => SelectComponent),
                         },
                     ], host: {
-                        '[attr.aria-disabled]': 'isDisabled || null',
-                        '[class.is-open]': 'isOpen',
                         '[tabindex]': 'searchFieldEnabled || isDisabled ? -1 : 0',
                         '[attr.aria-multiselectable]': 'multiple',
-                    }, template: "<div\n  aria-haspopup=\"listbox\"\n  class=\"odx-select__trigger\"\n  [odxDropdown]=\"dropdownContent\"\n  [odxDropdownDisabled]=\"isDisabled || isReadonly\"\n  [odxDropdownOptions]=\"{ matchReferenceWidth: true, offset: 4, outerPadding: 10, position: 'bottom-start' }\"\n  [odxDropdownReferenceElement]=\"element.nativeElement\"\n  [odxDropdownShowLoader]=\"isLoading\"\n  (odxDropdownBeforeOpen)=\"onDropdownOpen()\"\n  (odxDropdownBeforeClose)=\"onDropdownClose()\"\n  (odxDropdownAfterClose)=\"onDropdownClosed()\"\n  (odxDropdownAfterOpen)=\"enableSmoothScroll()\"\n>\n  <ng-template [ngIf]=\"!searchFieldEnabled\" [ngIfElse]=\"searchFieldTemplate\">\n    <div class=\"odx-select__value\" *ngIf=\"selectedOptionContent; else placeholderTemplate\">\n      <ng-template [odxDynamicView]=\"selectedOptionContent\" [odxDynamicViewContext]=\"{ $implicit: value }\"></ng-template>\n    </div>\n  </ng-template>\n  <ng-template #placeholderTemplate>\n    <div class=\"odx-select__placeholder\">\n      {{ placeholder }}\n    </div>\n  </ng-template>\n  <ng-template #searchFieldTemplate>\n    <ng-content select=\"[odxSelectSearchField]\"></ng-content>\n  </ng-template>\n  <odx-icon class=\"odx-select__indicator\" name=\"chevron-down\" iconSet=\"core\"></odx-icon>\n</div>\n<ng-template #dropdownContent>\n  <div class=\"odx-select-dropdown\" role=\"listbox\">\n    <ng-template [ngIf]=\"hasOptions\" [ngIfElse]=\"noOptionsTemplate\">\n      <ng-content></ng-content>\n    </ng-template>\n    <ng-template #noOptionsTemplate>\n      <odx-option disabled notFoundMessage>\n        <ng-template [odxDynamicView]=\"searchField?.notFoundContent\"></ng-template>\n      </odx-option>\n    </ng-template>\n  </div>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { options: [{
+                    }, template: "<div\n  aria-haspopup=\"listbox\"\n  class=\"odx-select__trigger\"\n  [odxDropdown]=\"dropdownContent\"\n  [odxDropdownDisabled]=\"isDisabled || isReadonly\"\n  [odxDropdownOptions]=\"{ matchReferenceWidth: true, offset: 4, outerPadding: 10, position: 'bottom-start' }\"\n  [odxDropdownReferenceElement]=\"element.nativeElement\"\n  [odxDropdownShowLoader]=\"isLoading\"\n  (odxDropdownBeforeOpen)=\"onDropdownOpen()\"\n  (odxDropdownBeforeClose)=\"onDropdownClose()\"\n  (odxDropdownAfterClose)=\"onDropdownClosed()\"\n  (odxDropdownAfterOpen)=\"enableSmoothScroll()\"\n>\n  <ng-template [ngIf]=\"!searchFieldEnabled\" [ngIfElse]=\"searchFieldTemplate\">\n    <div class=\"odx-select__value\" *ngIf=\"selectedOptionContent; else placeholderTemplate\">\n      <ng-template [odxDynamicView]=\"selectedOptionContent\" [odxDynamicViewContext]=\"{ $implicit: value }\"></ng-template>\n    </div>\n  </ng-template>\n  <ng-template #placeholderTemplate>\n    <div class=\"odx-select__placeholder\">\n      {{ placeholder }}\n    </div>\n  </ng-template>\n  <ng-template #searchFieldTemplate>\n    <ng-content select=\"[odxSelectSearchField]\"></ng-content>\n  </ng-template>\n  <odx-icon class=\"odx-select__indicator\" name=\"chevron-down\" iconSet=\"core\"></odx-icon>\n</div>\n<ng-template #dropdownContent>\n  <div class=\"odx-dropdown__option-list\" role=\"listbox\">\n    <ng-template [ngIf]=\"hasOptions\" [ngIfElse]=\"noOptionsTemplate\">\n      <ng-content></ng-content>\n    </ng-template>\n    <ng-template #noOptionsTemplate>\n      <odx-select-option disabled notFoundMessage>\n        <ng-template [odxDynamicView]=\"searchField?.notFoundContent\"></ng-template>\n      </odx-select-option>\n    </ng-template>\n  </div>\n</ng-template>\n" }]
+        }], propDecorators: { options: [{
                 type: ContentChildren,
-                args: [OptionComponent, { descendants: true, emitDistinctChangesOnly: true }]
-            }], dropdown: [{
-                type: ViewChild,
-                args: [DropdownDirective]
+                args: [SelectOptionComponent, { descendants: true, emitDistinctChangesOnly: true }]
+            }], searchField: [{
+                type: ContentChild,
+                args: [SelectSearchFieldDirective]
             }], placeholder: [{
                 type: Input
-            }], isLoading: [{
-                type: Input
             }], multiple: [{
                 type: Input
             }], selectedOptionTemplate: [{
                 type: Input
-            }], stringify: [{
-                type: Input
             }], identityMatcher: [{
                 type: Input
-            }], change: [{
-                type: Output
-            }], searchField: [{
-                type: ContentChild,
-                args: [SelectSearchFieldDirective]
-            }], openDropdown: [{
+            }], handleControllerEvent: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }, {
                 type: HostListener,
                 args: ['keydown', ['$event']]
-            }], handleFocusOut: [{
-                type: HostListener,
-                args: ['focusout', ['$event']]
             }] } });
 
-const modules = [SelectComponent, SelectSearchFieldDirective, SelectSearchFilterPipe, OptionComponent];
+const modules = [SelectComponent, SelectSearchFieldDirective, SelectSearchFilterPipe, SelectOptionComponent];
 class SelectModule {
 }
 SelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SelectModule, imports: [SelectComponent, SelectSearchFieldDirective, SelectSearchFilterPipe, OptionComponent], exports: [CoreModule, SelectComponent, SelectSearchFieldDirective, SelectSearchFilterPipe, OptionComponent] });
-SelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectModule, imports: [SelectComponent, OptionComponent, CoreModule] });
+SelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SelectModule, imports: [SelectComponent, SelectSearchFieldDirective, SelectSearchFilterPipe, SelectOptionComponent], exports: [CoreModule, SelectComponent, SelectSearchFieldDirective, SelectSearchFilterPipe, SelectOptionComponent] });
+SelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectModule, imports: [SelectComponent, SelectOptionComponent, CoreModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectModule, decorators: [{
             type: NgModule,
             args: [{
@@ -427,5 +332,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { OptionComponent, SELECT_CONTROL, SelectComponent, SelectModule, SelectSearchFieldDirective, SelectSearchFilterPipe };
+export { SELECT_CONTROL, SelectComponent, SelectModule, SelectOptionComponent, SelectSearchFieldDirective, SelectSearchFilterPipe };
 //# sourceMappingURL=odx-angular-components-select.mjs.map