@anglr/select 12.0.0 → 13.0.0-beta.20250127113535

package/{es2020 → es2022}/src/plugins/liveSearch/basic/basicLiveSearch.component.js

@@ -1,6 +1,6 @@
 import { Component, ChangeDetectionStrategy, ChangeDetectorRef, Inject, Optional, ElementRef, ViewChild, EventEmitter } from '@angular/core';
 import { STRING_LOCALIZATION } from '@anglr/common';
-import { extend } from '@jscrpt/common';
+import { extend } from '@jscrpt/common/extend';
 import { NG_SELECT_PLUGIN_INSTANCES } from '../../../components/select/types';
 import { LIVE_SEARCH_OPTIONS } from '../types';
 import { POPUP } from '../../popup/types';
@@ -26,6 +26,22 @@ const defaultOptions = {
  * Component used for obtaining basic live search html element
  */
 export class BasicLiveSearchComponent {
+    //######################### public properties - implementation of BasicLiveSearch #########################
+    /**
+     * Options for NgSelect plugin
+     */
+    get options() {
+        return this._options;
+    }
+    set options(options) {
+        this._options = extend(true, this._options, options);
+    }
+    /**
+     * HTML element that represents live search
+     */
+    get liveSearchElement() {
+        return this.liveSearchElementChild.nativeElement;
+    }
     //######################### constructor #########################
     constructor(ngSelectPlugins, pluginBus, pluginElement, _changeDetector, _stringLocalization, options) {
         this.ngSelectPlugins = ngSelectPlugins;
@@ -49,22 +65,6 @@ export class BasicLiveSearchComponent {
         this.texts = {};
         this._options = extend(true, {}, defaultOptions, options);
     }
-    //######################### public properties - implementation of BasicLiveSearch #########################
-    /**
-     * Options for NgSelect plugin
-     */
-    get options() {
-        return this._options;
-    }
-    set options(options) {
-        this._options = extend(true, this._options, options);
-    }
-    /**
-     * HTML element that represents live search
-     */
-    get liveSearchElement() {
-        return this.liveSearchElementChild.nativeElement;
-    }
     //######################### public methods - implementation of OnDestroy #########################
     /**
      * Called when component is destroyed
@@ -131,18 +131,18 @@ export class BasicLiveSearchComponent {
      * Initialize texts
      */
     _initTexts() {
-        Object.keys(this.options.texts).forEach((key) => {
+        Object.keys(this.options.texts).forEach(key => {
             this.texts[key] = this._stringLocalization.get(this.options.texts[key]);
         });
         this._changeDetector.detectChanges();
     }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: BasicLiveSearchComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i1.PluginBus, optional: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: STRING_LOCALIZATION }, { token: LIVE_SEARCH_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.0", type: BasicLiveSearchComponent, isStandalone: false, selector: "ng-basic-live-search", viewQueries: [{ propertyName: "liveSearchElementChild", first: true, predicate: ["liveSearchElement"], descendants: true }, { propertyName: "inputElementChild", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement [ngClass]=\"options?.cssClasses?.input\" type=\"text\" (input)=\"handleInput($any($event.target).value)\" [value]=\"searchValue\" placeholder=\"{{texts?.inputPlaceholder}}\">\r\n    </div>\r\n</div>", styles: [".wrapper-div\r\n{\r\n    padding: 4px;\r\n    border-bottom: 1px solid #666;\r\n    margin-bottom: 2px;\r\n}\r\n\r\n.form-control\r\n{\r\n    width: 100%;\r\n}"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-BasicLiveSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BasicLiveSearchComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i1.PluginBus, optional: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: STRING_LOCALIZATION }, { token: LIVE_SEARCH_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-BasicLiveSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: BasicLiveSearchComponent, selector: "ng-basic-live-search", viewQueries: [{ propertyName: "liveSearchElementChild", first: true, predicate: ["liveSearchElement"], descendants: true }, { propertyName: "inputElementChild", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement [ngClass]=\"options?.cssClasses?.input\" type=\"text\" (input)=\"handleInput($any($event.target).value)\" [value]=\"searchValue\" placeholder=\"{{texts?.inputPlaceholder}}\">\r\n    </div>\r\n</div>", styles: [".wrapper-div\r\n{\r\n    padding: 4px;\r\n    border-bottom: 1px solid #666;\r\n    margin-bottom: 2px;\r\n}\r\n\r\n.form-control\r\n{\r\n    width: 100%;\r\n}"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BasicLiveSearchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: BasicLiveSearchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ng-basic-live-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement [ngClass]=\"options?.cssClasses?.input\" type=\"text\" (input)=\"handleInput($any($event.target).value)\" [value]=\"searchValue\" placeholder=\"{{texts?.inputPlaceholder}}\">\r\n    </div>\r\n</div>", styles: [".wrapper-div\r\n{\r\n    padding: 4px;\r\n    border-bottom: 1px solid #666;\r\n    margin-bottom: 2px;\r\n}\r\n\r\n.form-control\r\n{\r\n    width: 100%;\r\n}"] }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+            args: [{ selector: 'ng-basic-live-search', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement [ngClass]=\"options?.cssClasses?.input\" type=\"text\" (input)=\"handleInput($any($event.target).value)\" [value]=\"searchValue\" placeholder=\"{{texts?.inputPlaceholder}}\">\r\n    </div>\r\n</div>", styles: [".wrapper-div\r\n{\r\n    padding: 4px;\r\n    border-bottom: 1px solid #666;\r\n    margin-bottom: 2px;\r\n}\r\n\r\n.form-control\r\n{\r\n    width: 100%;\r\n}"] }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [NG_SELECT_PLUGIN_INSTANCES]
                 }, {
@@ -157,7 +157,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                     args: [LIVE_SEARCH_OPTIONS]
                 }, {
                     type: Optional
-                }] }]; }, propDecorators: { liveSearchElementChild: [{
+                }] }], propDecorators: { liveSearchElementChild: [{
                 type: ViewChild,
                 args: ['liveSearchElement']
             }], inputElementChild: [{

package/es2022/src/plugins/liveSearch/basic/basicLiveSearch.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"basicLiveSearch.component.js","sourceRoot":"","sources":["../../../../../src/plugins/liveSearch/basic/basicLiveSearch.component.ts","../../../../../src/plugins/liveSearch/basic/basicLiveSearch.component.html"],"names":[],"mappings":"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","sourcesContent":["import {Component, ChangeDetectionStrategy, ChangeDetectorRef, Inject, Optional, ElementRef, ViewChild, EventEmitter, OnDestroy} from '@angular/core';\nimport {STRING_LOCALIZATION, StringLocalization} from '@anglr/common';\nimport {extend} from '@jscrpt/common/extend';\nimport {Subscription} from 'rxjs';\n\nimport {BasicLiveSearchOptions, BasicLiveSearch} from './basicLiveSearch.interface';\nimport {NgSelectPlugin} from '../../../misc';\nimport {NgSelectPluginInstances} from '../../../components/select';\nimport {NG_SELECT_PLUGIN_INSTANCES} from '../../../components/select/types';\nimport {LiveSearchTexts} from '../liveSearch.interface';\nimport {LIVE_SEARCH_OPTIONS} from '../types';\nimport {Popup} from '../../popup';\nimport {POPUP} from '../../popup/types';\nimport {PluginBus} from '../../../misc/pluginBus/pluginBus';\n\n/**\n * Default options for live search\n * @internal\n */\nconst defaultOptions: BasicLiveSearchOptions =\n{\n    cssClasses:\n    {\n        wrapperDiv: 'wrapper-div',\n        input: 'form-control'\n    },\n    texts:\n    {\n        inputPlaceholder: 'Filter options'\n    },\n    keepSearchValue: false\n};\n\n/**\n * Component used for obtaining basic live search html element\n */\n@Component(\n{\n    selector: 'ng-basic-live-search',\n    templateUrl: 'basicLiveSearch.component.html',\n    styleUrl: 'basicLiveSearch.component.css',\n    standalone: false,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class BasicLiveSearchComponent implements BasicLiveSearch, NgSelectPlugin<BasicLiveSearchOptions>, OnDestroy\n{\n    //######################### protected fields #########################\n\n    /**\n     * Popup used in NgSelect\n     */\n    protected _popup: Popup;\n\n    /**\n     * Subscription for changes in texts\n     */\n    protected _textsChangedSubscription: Subscription;\n\n    /**\n     * Subscription for changes of popup visibility\n     */\n    protected _visibilityChangeSubscription: Subscription;\n\n    /**\n     * Subscription for live search focus request\n     */\n    protected _liveSearchFocusSubscription: Subscription;\n\n    /**\n     * Options for NgSelect plugin\n     */\n    protected _options: BasicLiveSearchOptions;\n\n    //######################### public properties - implementation of BasicLiveSearch #########################\n\n    /**\n     * Options for NgSelect plugin\n     */\n    public get options(): BasicLiveSearchOptions\n    {\n        return this._options;\n    }\n    public set options(options: BasicLiveSearchOptions)\n    {\n        this._options = extend(true, this._options, options);\n    }\n\n    /**\n     * HTML element that represents live search\n     */\n    public get liveSearchElement(): HTMLElement\n    {\n        return this.liveSearchElementChild.nativeElement;\n    }\n\n    /**\n     * Current value of live search\n     */\n    public searchValue: string = null;\n\n    /**\n     * Occurs when current value of live search changes\n     */\n    public searchValueChange: EventEmitter<void> = new EventEmitter<void>();\n\n    //######################### public properties - template bindings #########################\n\n    /**\n     * Object containing available texts\n     * @internal\n     */\n    public texts: LiveSearchTexts = {};\n\n    //######################### public properties - children #########################\n\n    /**\n     * View child that represents live search element\n     * @internal\n     */\n    @ViewChild('liveSearchElement')\n    public liveSearchElementChild: ElementRef<HTMLElement>;\n\n    /**\n     * View child that represents input element\n     * @internal\n     */\n    @ViewChild('inputElement')\n    public inputElementChild: ElementRef<HTMLInputElement>;\n\n    //######################### constructor #########################\n    constructor(@Inject(NG_SELECT_PLUGIN_INSTANCES) @Optional() public ngSelectPlugins: NgSelectPluginInstances,\n                @Optional() public pluginBus: PluginBus,\n                public pluginElement: ElementRef,\n                protected _changeDetector: ChangeDetectorRef,\n                @Inject(STRING_LOCALIZATION) protected _stringLocalization: StringLocalization,\n                @Inject(LIVE_SEARCH_OPTIONS) @Optional() options?: BasicLiveSearchOptions)\n    {\n        this._options = extend(true, {}, defaultOptions, options);\n    }\n\n    //######################### public methods - implementation of OnDestroy #########################\n\n    /**\n     * Called when component is destroyed\n     */\n    public ngOnDestroy()\n    {\n        this._visibilityChangeSubscription?.unsubscribe();\n        this._visibilityChangeSubscription = null;\n\n        this._textsChangedSubscription?.unsubscribe();\n        this._textsChangedSubscription = null;\n\n        this._liveSearchFocusSubscription?.unsubscribe();\n        this._liveSearchFocusSubscription = null;\n    }\n\n    //######################### public methods - implementation of BasicLiveSearch #########################\n\n    /**\n     * Initialize plugin, to be ready to use, initialize communication with other plugins\n     */\n    public initialize()\n    {\n        this._textsChangedSubscription = this._stringLocalization.textsChange.subscribe(() => this._initTexts());\n\n        const popup = this.ngSelectPlugins[POPUP] as Popup;\n\n        if(this._popup && this._popup != popup)\n        {\n            this._visibilityChangeSubscription.unsubscribe();\n            this._visibilityChangeSubscription = null;\n\n            this._popup = null;\n        }\n\n        if(!this._popup)\n        {\n            this._popup = popup;\n\n            this._visibilityChangeSubscription = this._popup.visibilityChange.subscribe(() =>\n            {\n                if(!this.options.keepSearchValue)\n                {\n                    this.handleInput('');\n\n                    this._changeDetector.detectChanges();\n                }\n            });\n        }\n\n        if(!this._liveSearchFocusSubscription)\n        {\n            this._liveSearchFocusSubscription = this.pluginBus.liveSearchFocus.subscribe(() =>\n            {\n                this.inputElementChild?.nativeElement.focus();\n            });\n        }\n\n        this._initTexts();\n    }\n\n    /**\n     * Initialize plugin options, all operations required to be done with plugin options are handled here\n     */\n    public initOptions()\n    {\n    }\n\n    /**\n     * Explicitly runs invalidation of content (change detection)\n     */\n    public invalidateVisuals(): void\n    {\n        this._changeDetector.detectChanges();\n    }\n\n    //######################### public methods - template bindings #########################\n\n    /**\n     * Handle input value\n     * @param value - Value of input\n     * @internal\n     */\n    public handleInput(value: string)\n    {\n        this.searchValue = value;\n        this.searchValueChange.emit();\n    }\n\n    //######################### protected methods #########################\n\n    /**\n     * Initialize texts\n     */\n    protected _initTexts()\n    {\n        Object.keys(this.options.texts).forEach(key =>\n        {\n            this.texts[key as keyof LiveSearchTexts] = this._stringLocalization.get(this.options.texts[key as keyof LiveSearchTexts]);\n        });\n\n        this._changeDetector.detectChanges();\n    }\n}\n","<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement [ngClass]=\"options?.cssClasses?.input\" type=\"text\" (input)=\"handleInput($any($event.target).value)\" [value]=\"searchValue\" placeholder=\"{{texts?.inputPlaceholder}}\">\r\n    </div>\r\n</div>"]}

package/{es2020 → es2022}/src/plugins/liveSearch/edit/editLiveSearch.component.js

@@ -1,6 +1,7 @@
 import { Component, ChangeDetectionStrategy, ChangeDetectorRef, Inject, Optional, ElementRef, ViewChild, EventEmitter } from '@angular/core';
 import { STRING_LOCALIZATION } from '@anglr/common';
-import { extend, isPresent } from '@jscrpt/common';
+import { isPresent } from '@jscrpt/common';
+import { extend } from '@jscrpt/common/extend';
 import { NG_SELECT_PLUGIN_INSTANCES } from '../../../components/select/types';
 import { LIVE_SEARCH_OPTIONS } from '../types';
 import { VALUE_HANDLER } from '../../valueHandler/types';
@@ -29,6 +30,29 @@ const defaultOptions = {
  * Component used for obtaining edit live search html element
  */
 export class EditLiveSearchComponent {
+    //######################### protected properties #########################
+    /**
+     * Gets currently available options
+     */
+    get availableOptions() {
+        return this.pluginBus.selectOptions.optionsGatherer.availableOptions;
+    }
+    //######################### public properties - implementation of EditLiveSearch #########################
+    /**
+     * Options for NgSelect plugin
+     */
+    get options() {
+        return this._options;
+    }
+    set options(options) {
+        this._options = extend(true, this._options, options);
+    }
+    /**
+     * HTML element that represents live search
+     */
+    get liveSearchElement() {
+        return this.liveSearchElementChild.nativeElement;
+    }
     //######################### constructor #########################
     constructor(ngSelectPlugins, pluginBus, pluginElement, _changeDetector, _stringLocalization, options) {
         this.ngSelectPlugins = ngSelectPlugins;
@@ -57,29 +81,6 @@ export class EditLiveSearchComponent {
         this.texts = {};
         this._options = extend(true, {}, defaultOptions, options);
     }
-    //######################### protected properties #########################
-    /**
-     * Gets currently available options
-     */
-    get availableOptions() {
-        return this.pluginBus.selectOptions.optionsGatherer.availableOptions;
-    }
-    //######################### public properties - implementation of EditLiveSearch #########################
-    /**
-     * Options for NgSelect plugin
-     */
-    get options() {
-        return this._options;
-    }
-    set options(options) {
-        this._options = extend(true, this._options, options);
-    }
-    /**
-     * HTML element that represents live search
-     */
-    get liveSearchElement() {
-        return this.liveSearchElementChild.nativeElement;
-    }
     //######################### public methods - implementation of OnDestroy #########################
     /**
      * Called when component is destroyed
@@ -284,13 +285,13 @@ export class EditLiveSearchComponent {
             selectedOptions[selectedOptions.length - 1].active = true;
         }
     }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: EditLiveSearchComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i1.PluginBus, optional: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: STRING_LOCALIZATION }, { token: LIVE_SEARCH_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.0", type: EditLiveSearchComponent, isStandalone: false, selector: "ng-edit-live-search", viewQueries: [{ propertyName: "liveSearchElementChild", first: true, predicate: ["liveSearchElement"], descendants: true }, { propertyName: "inputElementChild", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement\r\n               [ngClass]=\"options?.cssClasses?.input\"\r\n               type=\"text\"\r\n               [value]=\"searchValueDisplayed\"\r\n               (input)=\"handleInput($any($event.target).value, true)\"\r\n               (focus)=\"handleFocus($any($event.target))\"\r\n               (click)=\"handleFocus($any($event.target), true)\"\r\n               placeholder=\"{{texts?.inputPlaceholder}}\"\r\n               [disabled]=\"pluginBus?.selectOptions.readonly\">\r\n    </div>\r\n</div>", styles: [".edit-wrapper-div\r\n{\r\n    width: 100%;\r\n}\r\n\r\n.edit-control\r\n{\r\n    padding: 4px;\r\n    height: 26px;\r\n    width: 100%;\r\n    border: none;\r\n    outline: none;\r\n}"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-EditLiveSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EditLiveSearchComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i1.PluginBus, optional: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: STRING_LOCALIZATION }, { token: LIVE_SEARCH_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-EditLiveSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: EditLiveSearchComponent, selector: "ng-edit-live-search", viewQueries: [{ propertyName: "liveSearchElementChild", first: true, predicate: ["liveSearchElement"], descendants: true }, { propertyName: "inputElementChild", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement\r\n               [ngClass]=\"options?.cssClasses?.input\"\r\n               type=\"text\"\r\n               [value]=\"searchValueDisplayed\"\r\n               (input)=\"handleInput($any($event.target).value, true)\"\r\n               (focus)=\"handleFocus($any($event.target))\"\r\n               (click)=\"handleFocus($any($event.target), true)\"\r\n               placeholder=\"{{texts?.inputPlaceholder}}\"\r\n               [disabled]=\"pluginBus?.selectOptions.readonly\">\r\n    </div>\r\n</div>", styles: [".edit-wrapper-div\r\n{\r\n    width: 100%;\r\n}\r\n\r\n.edit-control\r\n{\r\n    padding: 4px;\r\n    height: 26px;\r\n    width: 100%;\r\n    border: none;\r\n    outline: none;\r\n}"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EditLiveSearchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: EditLiveSearchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ng-edit-live-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement\r\n               [ngClass]=\"options?.cssClasses?.input\"\r\n               type=\"text\"\r\n               [value]=\"searchValueDisplayed\"\r\n               (input)=\"handleInput($any($event.target).value, true)\"\r\n               (focus)=\"handleFocus($any($event.target))\"\r\n               (click)=\"handleFocus($any($event.target), true)\"\r\n               placeholder=\"{{texts?.inputPlaceholder}}\"\r\n               [disabled]=\"pluginBus?.selectOptions.readonly\">\r\n    </div>\r\n</div>", styles: [".edit-wrapper-div\r\n{\r\n    width: 100%;\r\n}\r\n\r\n.edit-control\r\n{\r\n    padding: 4px;\r\n    height: 26px;\r\n    width: 100%;\r\n    border: none;\r\n    outline: none;\r\n}"] }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+            args: [{ selector: 'ng-edit-live-search', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement\r\n               [ngClass]=\"options?.cssClasses?.input\"\r\n               type=\"text\"\r\n               [value]=\"searchValueDisplayed\"\r\n               (input)=\"handleInput($any($event.target).value, true)\"\r\n               (focus)=\"handleFocus($any($event.target))\"\r\n               (click)=\"handleFocus($any($event.target), true)\"\r\n               placeholder=\"{{texts?.inputPlaceholder}}\"\r\n               [disabled]=\"pluginBus?.selectOptions.readonly\">\r\n    </div>\r\n</div>", styles: [".edit-wrapper-div\r\n{\r\n    width: 100%;\r\n}\r\n\r\n.edit-control\r\n{\r\n    padding: 4px;\r\n    height: 26px;\r\n    width: 100%;\r\n    border: none;\r\n    outline: none;\r\n}"] }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [NG_SELECT_PLUGIN_INSTANCES]
                 }, {
@@ -305,7 +306,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                     args: [LIVE_SEARCH_OPTIONS]
                 }, {
                     type: Optional
-                }] }]; }, propDecorators: { liveSearchElementChild: [{
+                }] }], propDecorators: { liveSearchElementChild: [{
                 type: ViewChild,
                 args: ['liveSearchElement']
             }], inputElementChild: [{

package/es2022/src/plugins/liveSearch/edit/editLiveSearch.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editLiveSearch.component.js","sourceRoot":"","sources":["../../../../../src/plugins/liveSearch/edit/editLiveSearch.component.ts","../../../../../src/plugins/liveSearch/edit/editLiveSearch.component.html"],"names":[],"mappings":"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","sourcesContent":["import {Component, ChangeDetectionStrategy, ChangeDetectorRef, Inject, Optional, ElementRef, ViewChild, EventEmitter, OnDestroy} from '@angular/core';\nimport {STRING_LOCALIZATION, StringLocalization} from '@anglr/common';\nimport {isPresent} from '@jscrpt/common';\nimport {extend} from '@jscrpt/common/extend';\nimport {Subscription} from 'rxjs';\n\nimport {EditLiveSearchOptions, EditLiveSearch} from './editLiveSearch.interface';\nimport {NgSelectPlugin, OptionsGatherer} from '../../../misc';\nimport {NgSelectPluginInstances} from '../../../components/select';\nimport {NG_SELECT_PLUGIN_INSTANCES} from '../../../components/select/types';\nimport {LIVE_SEARCH_OPTIONS} from '../types';\nimport {ValueHandler} from '../../valueHandler';\nimport {VALUE_HANDLER} from '../../valueHandler/types';\nimport {Popup} from '../../popup';\nimport {POPUP} from '../../popup/types';\nimport {ɵNgSelectOption} from '../../../components/option';\nimport {PluginBus} from '../../../misc/pluginBus/pluginBus';\nimport {LiveSearchTexts} from '../liveSearch.interface';\n\n/**\n * Default options for live search\n * @internal\n */\nconst defaultOptions: EditLiveSearchOptions =\n{\n    cssClasses:\n    {\n        wrapperDiv: 'edit-wrapper-div',\n        input: 'edit-control'\n    },\n    texts:\n    {\n        inputPlaceholder: 'Select item'\n\n    },\n    keepSearchValue: false,\n    nonExistingCancel: false,\n    emptyCancel: false\n};\n\n/**\n * Component used for obtaining edit live search html element\n */\n@Component(\n{\n    selector: 'ng-edit-live-search',\n    templateUrl: 'editLiveSearch.component.html',\n    styleUrl: 'editLiveSearch.component.css',\n    standalone: false,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class EditLiveSearchComponent implements EditLiveSearch, NgSelectPlugin<EditLiveSearchOptions>, OnDestroy\n{\n    //######################### protected fields #########################\n\n    /**\n     * Popup plugin used within `NgSelect`\n     */\n    protected _popup: Popup;\n\n    /**\n     * Value handler plugin used within `NgSelect`\n     */\n    protected _valueHandler: ValueHandler;\n\n    /**\n     * Instance of previous options gatherer, that is used for obtaining available options\n     */\n    protected _optionsGatherer: OptionsGatherer;\n\n    /**\n     * Subscription for changes of options in options gatherer\n     */\n    protected _optionsChangeSubscription: Subscription;\n\n    /**\n     * Subscription for changes in texts\n     */\n    protected _textsChangedSubscription: Subscription;\n\n    /**\n     * Subscription for changes of selected value\n     */\n    protected _valueChangedSubscription: Subscription;\n\n    /**\n     * Subscription for live search focus request\n     */\n    protected _liveSearchFocusSubscription: Subscription;\n\n    /**\n     * Subscription for update displayed value request\n     */\n    protected _updateDisplayedValueSubscription: Subscription;\n\n    /**\n     * Options for NgSelect plugin\n     */\n    protected _options: EditLiveSearchOptions;\n\n    //######################### protected properties #########################\n\n    /**\n     * Gets currently available options\n     */\n    protected get availableOptions(): ɵNgSelectOption[]\n    {\n        return this.pluginBus.selectOptions.optionsGatherer.availableOptions;\n    }\n\n    //######################### public properties - implementation of EditLiveSearch #########################\n\n    /**\n     * Options for NgSelect plugin\n     */\n    public get options(): EditLiveSearchOptions\n    {\n        return this._options;\n    }\n    public set options(options: EditLiveSearchOptions)\n    {\n        this._options = extend(true, this._options, options);\n    }\n\n    /**\n     * HTML element that represents live search\n     */\n    public get liveSearchElement(): HTMLElement\n    {\n        return this.liveSearchElementChild.nativeElement;\n    }\n\n    /**\n     * Current value of live search\n     */\n    public searchValue: string = null;\n\n    /**\n     * Occurs when current value of live search changes\n     */\n    public searchValueChange: EventEmitter<void> = new EventEmitter<void>();\n\n    //######################### public properties - template bindings #########################\n\n    /**\n     * Current value that is displayed\n     * @internal\n     */\n    public searchValueDisplayed: string = null;\n\n    /**\n     * Object containing available texts\n     * @internal\n     */\n    public texts: LiveSearchTexts = {};\n\n    //######################### public properties - children #########################\n\n    /**\n     * View child that represents live search element\n     * @internal\n     */\n    @ViewChild('liveSearchElement')\n    public liveSearchElementChild: ElementRef<HTMLElement>;\n\n    /**\n     * View child that represents input element\n     * @internal\n     */\n    @ViewChild('inputElement')\n    public inputElementChild: ElementRef<HTMLInputElement>;\n\n    //######################### constructor #########################\n    constructor(@Inject(NG_SELECT_PLUGIN_INSTANCES) @Optional() public ngSelectPlugins: NgSelectPluginInstances,\n                @Optional() public pluginBus: PluginBus,\n                public pluginElement: ElementRef,\n                protected _changeDetector: ChangeDetectorRef,\n                @Inject(STRING_LOCALIZATION) protected _stringLocalization: StringLocalization,\n                @Inject(LIVE_SEARCH_OPTIONS) @Optional() options?: EditLiveSearchOptions)\n    {\n        this._options = extend(true, {}, defaultOptions, options);\n    }\n\n    //######################### public methods - implementation of OnDestroy #########################\n\n    /**\n     * Called when component is destroyed\n     */\n    public ngOnDestroy()\n    {\n        this._optionsChangeSubscription?.unsubscribe();\n        this._optionsChangeSubscription = null;\n\n        this._textsChangedSubscription?.unsubscribe();\n        this._textsChangedSubscription = null;\n\n        this._valueChangedSubscription?.unsubscribe();\n        this._valueChangedSubscription = null;\n\n        this._liveSearchFocusSubscription?.unsubscribe();\n        this._liveSearchFocusSubscription = null;\n\n        this._updateDisplayedValueSubscription?.unsubscribe();\n        this._updateDisplayedValueSubscription = null;\n    }\n\n    //######################### public methods - implementation of EditLiveSearch #########################\n\n    /**\n     * Initialize plugin, to be ready to use, initialize communication with other plugins\n     */\n    public initialize()\n    {\n        this._textsChangedSubscription = this._stringLocalization.textsChange.subscribe(() => this._initTexts());\n\n        if(this._optionsGatherer && this._optionsGatherer != this.pluginBus.selectOptions.optionsGatherer)\n        {\n            this._optionsChangeSubscription.unsubscribe();\n            this._optionsChangeSubscription = null;\n\n            this._optionsGatherer = null;\n        }\n\n        if(!this._optionsGatherer)\n        {\n            this._optionsGatherer = this.pluginBus.selectOptions.optionsGatherer;\n\n            this._optionsChangeSubscription = this._optionsGatherer.availableOptionsChange.subscribe(() =>\n            {\n                //do not change active if active is visible\n                if(!this.pluginBus.selectOptions.optionsGatherer.availableOptions.find((option: ɵNgSelectOption) => option.active))\n                {\n                    //only when input is filled at least with one char\n                    if(this.searchValue)\n                    {\n                        const option: ɵNgSelectOption = this.pluginBus.selectOptions.optionsGatherer.availableOptions.find(itm => this.pluginBus.selectOptions.liveSearchFilter(this.searchValue, this.pluginBus.selectOptions.normalizer)(itm));\n    \n                        if(option)\n                        {\n                            this.pluginBus.selectOptions.optionsGatherer.options.forEach((option: ɵNgSelectOption) => option.active = false);\n                            option.active = true;\n                            this._popup.invalidateVisuals();\n                        }\n                    }\n                    //select first\n                    else\n                    {\n                        this._activateSelectedOrFirst();\n                    }\n                }\n            });\n        }\n\n        const popup = this.ngSelectPlugins[POPUP] as Popup;\n\n        if(this._popup && this._popup != popup)\n        {\n            this._popup = null;\n        }\n\n        if(!this._popup)\n        {\n            this._popup = popup;\n        }\n\n        if(!this._liveSearchFocusSubscription)\n        {\n            this._liveSearchFocusSubscription = this.pluginBus.liveSearchFocus.subscribe(() =>\n            {\n                this.inputElementChild?.nativeElement.focus();\n            });\n        }\n\n        if(!this._updateDisplayedValueSubscription)\n        {\n            this._updateDisplayedValueSubscription = this.pluginBus.updateDisplayedValue.subscribe(() =>\n            {\n                this.handleBlur();\n            });\n        }\n\n        const valueHandler = this.ngSelectPlugins[VALUE_HANDLER] as ValueHandler;\n\n        if(this._valueHandler && this._valueHandler != valueHandler)\n        {\n            this._valueChangedSubscription.unsubscribe();\n            this._valueChangedSubscription = null;\n\n            this._valueHandler = null;\n        }\n\n        if(!this._valueHandler)\n        {\n            this._valueHandler = valueHandler;\n\n            this._valueChangedSubscription = this._valueHandler.valueChange.subscribe(() =>\n            {\n                const selected = this._valueHandler.selectedOptions;\n\n                if(!selected)\n                {\n                    this.searchValueDisplayed = '';\n                    this.handleInput('');\n                    this._changeDetector.detectChanges();\n\n                    return;\n                }\n\n                //reset filtering of available options\n                this.handleInput(null);\n\n                if(Array.isArray(selected))\n                {\n                    this.searchValueDisplayed = '';\n                    this.inputElementChild?.nativeElement.focus();\n                    this._changeDetector.detectChanges();\n                }\n                else\n                {\n                    //set selected into live search\n                    this.searchValueDisplayed = selected.text;\n                    this._changeDetector.detectChanges();\n\n                    //select current text\n                    this.inputElementChild?.nativeElement.select();\n                }\n            });\n        }\n\n        this._initTexts();\n    }\n\n    /**\n     * Initialize plugin options, all operations required to be done with plugin options are handled here\n     */\n    public initOptions()\n    {\n    }\n\n    /**\n     * Explicitly runs invalidation of content (change detection)\n     */\n    public invalidateVisuals(): void\n    {\n        this._changeDetector.detectChanges();\n    }\n\n    //######################### public methods - template bindings #########################\n\n    /**\n     * Handle input value\n     * @param value - Value of input\n     * @param inputChange - Indication that change was by input event of input\n     * @internal\n     */\n    public handleInput(value: string, inputChange: boolean = false)\n    {\n        this.searchValue = value;\n        this.searchValueChange.emit();\n\n        if(inputChange)\n        {\n            this.pluginBus.showHidePopup.emit(true);\n            this.searchValueDisplayed = value;\n\n            //single value select\n            if(!this.pluginBus.selectOptions.multiple)\n            {\n                //cancel value\n                if(this._options.nonExistingCancel)\n                {\n                    this._valueHandler.setValue(null);\n                }\n                //empty string cancels value\n                else if(this._options.emptyCancel && isPresent(value) && !value.length)\n                {\n                    this._valueHandler.setValue(null);\n                }\n                //otherwise keep last value\n            }\n        }\n    }\n\n    /**\n     * Handles focus event\n     * @param element - Element that got focus\n     * @param show - Indication whether show popup\n     * @internal\n     */\n    public handleFocus(element: HTMLInputElement, show: boolean = false)\n    {\n        element.select();\n\n        this._activateSelectedOrFirst();\n\n        if(show)\n        {\n            this.pluginBus.showHidePopup.emit(true);\n        }\n\n        this.pluginBus.focus.emit();\n    }\n\n    /**\n     * Handles blur of live search\n     */\n    public handleBlur()\n    {\n        //not multiple and selected value\n        if(!this.pluginBus.selectOptions.multiple)\n        {\n            //use selected text\n            if(this._valueHandler.selectedOptions && !Array.isArray(this._valueHandler.selectedOptions))\n            {\n                this.searchValueDisplayed = this._valueHandler.selectedOptions.text;\n            }\n            //reset text\n            else\n            {\n                this.searchValueDisplayed = '';\n            }\n        }\n        //reset text\n        else\n        {\n            this.searchValueDisplayed = '';\n        }\n\n        //reset available options\n        this.searchValue = null;\n        this.searchValueChange.emit();\n        this._changeDetector.detectChanges();\n    }\n\n    //######################### protected methods #########################\n\n    /**\n     * Initialize texts\n     */\n    protected _initTexts()\n    {\n        Object.keys(this.options.texts).forEach(key =>\n        {\n            this.texts[key as keyof LiveSearchTexts] = this._stringLocalization.get(this.options.texts[key as keyof LiveSearchTexts]);\n        });\n\n        this._changeDetector.detectChanges();\n    }\n\n    /**\n     * Activates first available option or selected option\n     */\n    protected _activateSelectedOrFirst()\n    {\n        const activeOption = this.availableOptions.find(itm => itm.active);\n        const selectedOptions = this.availableOptions.filter(itm => itm.selected);\n\n        //nothing active, nothing selected\n        if(!activeOption && !selectedOptions.length)\n        {\n            const first = this.availableOptions[0];\n\n            if(first)\n            {\n                first.active = true;\n            }\n        }\n        //nothing active\n        else if(!activeOption)\n        {\n            //last selected as sactive\n            selectedOptions[selectedOptions.length - 1].active = true;\n        }\n    }\n}\n","<div style=\"display: none;\">\r\n    <div #liveSearchElement [ngClass]=\"options?.cssClasses?.wrapperDiv\">\r\n        <input #inputElement\r\n               [ngClass]=\"options?.cssClasses?.input\"\r\n               type=\"text\"\r\n               [value]=\"searchValueDisplayed\"\r\n               (input)=\"handleInput($any($event.target).value, true)\"\r\n               (focus)=\"handleFocus($any($event.target))\"\r\n               (click)=\"handleFocus($any($event.target), true)\"\r\n               placeholder=\"{{texts?.inputPlaceholder}}\"\r\n               [disabled]=\"pluginBus?.selectOptions.readonly\">\r\n    </div>\r\n</div>"]}

package/{es2020 → es2022}/src/plugins/liveSearch/no/noLiveSearch.component.js

@@ -6,6 +6,12 @@ import * as i0 from "@angular/core";
  * Component used for no live search
  */
 export class NoLiveSearchComponent {
+    /**
+     * HTML element that represents live search
+     */
+    get liveSearchElement() {
+        return this._document.createElement('span');
+    }
     //######################### constructor #########################
     constructor(ngSelectPlugins, pluginElement, _document) {
         this.ngSelectPlugins = ngSelectPlugins;
@@ -20,12 +26,6 @@ export class NoLiveSearchComponent {
          */
         this.searchValueChange = new EventEmitter();
     }
-    /**
-     * HTML element that represents live search
-     */
-    get liveSearchElement() {
-        return this._document.createElement('span');
-    }
     //######################### public methods - implementation of NoLiveSearch #########################
     /**
      * Initialize plugin, to be ready to use, initialize communication with other plugins
@@ -42,17 +42,18 @@ export class NoLiveSearchComponent {
      */
     invalidateVisuals() {
     }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: NoLiveSearchComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i0.ElementRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.0", type: NoLiveSearchComponent, isStandalone: false, selector: "ng-no-live-search", ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-NoLiveSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NoLiveSearchComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i0.ElementRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
-NoLiveSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: NoLiveSearchComponent, selector: "ng-no-live-search", ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NoLiveSearchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: NoLiveSearchComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ng-no-live-search',
                     template: '',
+                    standalone: false,
                     changeDetection: ChangeDetectionStrategy.OnPush
                 }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [NG_SELECT_PLUGIN_INSTANCES]
                 }, {
@@ -60,5 +61,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                 }] }, { type: i0.ElementRef }, { type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
-                }] }]; } });
+                }] }] });
 //# sourceMappingURL=noLiveSearch.component.js.map

package/es2022/src/plugins/liveSearch/no/noLiveSearch.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"noLiveSearch.component.js","sourceRoot":"","sources":["../../../../../src/plugins/liveSearch/no/noLiveSearch.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,uBAAuB,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AAC7G,OAAO,EAAC,QAAQ,EAAC,MAAM,iBAAiB,CAAC;AAKzC,OAAO,EAAC,0BAA0B,EAAC,MAAM,kCAAkC,CAAC;;AAG5E;;GAEG;AAQH,MAAM,OAAO,qBAAqB;IAqB9B;;OAEG;IACH,IAAW,iBAAiB;QAExB,OAAO,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAChD,CAAC;IAYD,iEAAiE;IACjE,YAAmE,eAAwC,EACxF,aAAyB,EACN,SAAmB;QAFU,oBAAe,GAAf,eAAe,CAAyB;QACxF,kBAAa,GAAb,aAAa,CAAY;QACN,cAAS,GAAT,SAAS,CAAU;QAbzD;;WAEG;QACI,gBAAW,GAAW,IAAI,CAAC;QAElC;;WAEG;QACI,sBAAiB,GAAuB,IAAI,YAAY,EAAQ,CAAC;IAOxE,CAAC;IAED,qGAAqG;IAErG;;OAEG;IACI,UAAU;IAEjB,CAAC;IAED;;OAEG;IACI,WAAW;IAElB,CAAC;IAED;;OAEG;IACI,iBAAiB;IAExB,CAAC;8GAnEQ,qBAAqB,kBAwCV,0BAA0B,uDAE1B,QAAQ;kGA1CnB,qBAAqB,8EAJpB,EAAE;;2FAIH,qBAAqB;kBAPjC,SAAS;mBACV;oBACI,QAAQ,EAAE,mBAAmB;oBAC7B,QAAQ,EAAE,EAAE;oBACZ,UAAU,EAAE,KAAK;oBACjB,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAClD;;0BAyCgB,MAAM;2BAAC,0BAA0B;;0BAAG,QAAQ;;0BAE5C,MAAM;2BAAC,QAAQ","sourcesContent":["import {Component, ChangeDetectionStrategy, Inject, Optional, ElementRef, EventEmitter} from '@angular/core';\nimport {DOCUMENT} from '@angular/common';\n\nimport {NoLiveSearchOptions, NoLiveSearch} from './noLiveSearch.interface';\nimport {NgSelectPlugin} from '../../../misc';\nimport {NgSelectPluginInstances} from '../../../components/select';\nimport {NG_SELECT_PLUGIN_INSTANCES} from '../../../components/select/types';\nimport {PluginBus} from '../../../misc/pluginBus/pluginBus';\n\n/**\n * Component used for no live search\n */\n@Component(\n{\n    selector: 'ng-no-live-search',\n    template: '',\n    standalone: false,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class NoLiveSearchComponent implements NoLiveSearch, NgSelectPlugin<NoLiveSearchOptions>\n{\n    //######################### protected fields #########################\n\n    /**\n     * Options for NgSelect plugin\n     */\n    protected _options: NoLiveSearchOptions;\n\n    //######################### public properties - implementation of NoLiveSearch #########################\n\n    /**\n     * Options for NgSelect plugin\n     */\n    public options: NoLiveSearchOptions;\n\n    /**\n     * Plugin bus used for inter plugin shared events\n     */\n    public pluginBus: PluginBus;\n\n    /**\n     * HTML element that represents live search\n     */\n    public get liveSearchElement(): HTMLElement\n    {\n        return this._document.createElement('span');\n    }\n\n    /**\n     * Current value of live search\n     */\n    public searchValue: string = null;\n\n    /**\n     * Occurs when current value of live search changes\n     */\n    public searchValueChange: EventEmitter<void> = new EventEmitter<void>();\n\n    //######################### constructor #########################\n    constructor(@Inject(NG_SELECT_PLUGIN_INSTANCES) @Optional() public ngSelectPlugins: NgSelectPluginInstances,\n                public pluginElement: ElementRef,\n                @Inject(DOCUMENT) private _document: Document)\n    {\n    }\n\n    //######################### public methods - implementation of NoLiveSearch #########################\n\n    /**\n     * Initialize plugin, to be ready to use, initialize communication with other plugins\n     */\n    public initialize()\n    {\n    }\n\n    /**\n     * Initialize plugin options, all operations required to be done with plugin options are handled here\n     */\n    public initOptions()\n    {\n    }\n\n    /**\n     * Explicitly runs invalidation of content (change detection)\n     */\n    public invalidateVisuals(): void\n    {\n    }\n}"]}

package/es2022/src/plugins/normalState/basic/basicNormalState.component.js

@@ -0,0 +1,58 @@
+import { Component, ChangeDetectionStrategy, ChangeDetectorRef, Inject, Optional, ElementRef } from '@angular/core';
+import { STRING_LOCALIZATION } from '@anglr/common';
+import { extend } from '@jscrpt/common/extend';
+import { NG_SELECT_PLUGIN_INSTANCES } from '../../../components/select/types';
+import { NORMAL_STATE_OPTIONS } from '../types';
+import { PluginBus } from '../../../misc/pluginBus/pluginBus';
+import { NormalStateAbstractComponent } from '../normalStateAbstract.component';
+import * as i0 from "@angular/core";
+import * as i1 from "../../../misc/pluginBus/pluginBus";
+import * as i2 from "@angular/common";
+import * as i3 from "../../../pipes/ngSelectValue.pipe";
+/**
+ * Default options for normal state
+ * @internal
+ */
+const defaultOptions = {
+    cssClasses: {
+        normalStateElement: 'btn btn-select',
+        selectedCarret: 'selected-caret fa fa-caret-down',
+        selectedValue: 'selected-value'
+    },
+    texts: {
+        nothingSelected: 'Nothing selected'
+    },
+    optionDisplayText: option => option.text
+};
+/**
+ * Component used for rendering basic simple normal state of select
+ */
+export class BasicNormalStateComponent extends NormalStateAbstractComponent {
+    //######################### constructor #########################
+    constructor(ngSelectPlugins, pluginBus, pluginElement, changeDetector, stringLocalization, options) {
+        super(ngSelectPlugins, pluginBus, pluginElement, changeDetector, stringLocalization);
+        this._options = extend(true, {}, defaultOptions, options);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: BasicNormalStateComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i1.PluginBus, optional: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: STRING_LOCALIZATION }, { token: NORMAL_STATE_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.0", type: BasicNormalStateComponent, isStandalone: false, selector: "div.normal-state", usesInheritance: true, ngImport: i0, template: "<ng-template #defaultLook>{{valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected: options?.optionDisplayText}}</ng-template>\r\n\r\n<button [ngClass]=\"options?.cssClasses?.normalStateElement\" (click)=\"pluginBus?.togglePopup.emit(); pluginBus?.liveSearchFocus.emit()\" (focus)=\"pluginBus?.focus?.emit()\" [disabled]=\"!!pluginBus?.selectOptions?.readonly\" type=\"button\" [title]=\"valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected\">\r\n    <span [ngClass]=\"options?.cssClasses?.selectedValue\"><ng-container *ngTemplateOutlet=\"pluginBus?.selectOptions?.templateGatherer?.normalStateTemplate || defaultLook; context: {$implicit: this}\"></ng-container></span>\r\n    <span [ngClass]=\"options?.cssClasses?.selectedCarret\"></span>\r\n</button>", styles: ["button.btn-select\r\n{\r\n    display: flex;\r\n    width: 100%;\r\n    padding: 5px 0px 4px 6px;\r\n    background-color: #ffffff;\r\n    background-image: none;\r\n    border: 1px solid #cccccc;\r\n    border-radius: 4px;\r\n    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;\r\n    height: 28px;\r\n    overflow: hidden;\r\n}\r\n\r\nbutton.btn-select:hover\r\n{\r\n    background-color: #F2F2F2;\r\n}\r\n\r\nbutton.btn-select:active\r\n{\r\n    box-shadow: 0 0 5px -1px #888888 inset;\r\n}\r\n\r\nbutton.btn-select .selected-value\r\n{\r\n    flex: 1;\r\n    text-align: left;\r\n    min-width: 0;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n}\r\n\r\nbutton.btn-select .selected-caret\r\n{\r\n    flex: 0 0 20px;\r\n    align-self: center;\r\n}"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i3.NgSelectValuePipe, name: "ngSelectValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: BasicNormalStateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'div.normal-state', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #defaultLook>{{valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected: options?.optionDisplayText}}</ng-template>\r\n\r\n<button [ngClass]=\"options?.cssClasses?.normalStateElement\" (click)=\"pluginBus?.togglePopup.emit(); pluginBus?.liveSearchFocus.emit()\" (focus)=\"pluginBus?.focus?.emit()\" [disabled]=\"!!pluginBus?.selectOptions?.readonly\" type=\"button\" [title]=\"valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected\">\r\n    <span [ngClass]=\"options?.cssClasses?.selectedValue\"><ng-container *ngTemplateOutlet=\"pluginBus?.selectOptions?.templateGatherer?.normalStateTemplate || defaultLook; context: {$implicit: this}\"></ng-container></span>\r\n    <span [ngClass]=\"options?.cssClasses?.selectedCarret\"></span>\r\n</button>", styles: ["button.btn-select\r\n{\r\n    display: flex;\r\n    width: 100%;\r\n    padding: 5px 0px 4px 6px;\r\n    background-color: #ffffff;\r\n    background-image: none;\r\n    border: 1px solid #cccccc;\r\n    border-radius: 4px;\r\n    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;\r\n    height: 28px;\r\n    overflow: hidden;\r\n}\r\n\r\nbutton.btn-select:hover\r\n{\r\n    background-color: #F2F2F2;\r\n}\r\n\r\nbutton.btn-select:active\r\n{\r\n    box-shadow: 0 0 5px -1px #888888 inset;\r\n}\r\n\r\nbutton.btn-select .selected-value\r\n{\r\n    flex: 1;\r\n    text-align: left;\r\n    min-width: 0;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n}\r\n\r\nbutton.btn-select .selected-caret\r\n{\r\n    flex: 0 0 20px;\r\n    align-self: center;\r\n}"] }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [NG_SELECT_PLUGIN_INSTANCES]
+                }, {
+                    type: Optional
+                }] }, { type: i1.PluginBus, decorators: [{
+                    type: Optional
+                }] }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [STRING_LOCALIZATION]
+                }] }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [NORMAL_STATE_OPTIONS]
+                }, {
+                    type: Optional
+                }] }] });
+//# sourceMappingURL=basicNormalState.component.js.map

package/es2022/src/plugins/normalState/basic/basicNormalState.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"basicNormalState.component.js","sourceRoot":"","sources":["../../../../../src/plugins/normalState/basic/basicNormalState.component.ts","../../../../../src/plugins/normalState/basic/basicNormalState.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAY,MAAM,eAAe,CAAC;AAC7H,OAAO,EAAqB,mBAAmB,EAAC,MAAM,eAAe,CAAC;AACtE,OAAO,EAAC,MAAM,EAAC,MAAM,uBAAuB,CAAC;AAK7C,OAAO,EAAC,0BAA0B,EAAC,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAC,oBAAoB,EAAC,MAAM,UAAU,CAAC;AAC9C,OAAO,EAAC,SAAS,EAAC,MAAM,mCAAmC,CAAC;AAC5D,OAAO,EAAC,4BAA4B,EAAC,MAAM,kCAAkC,CAAC;;;;;AAE9E;;;GAGG;AACH,MAAM,cAAc,GACpB;IACI,UAAU,EACV;QACI,kBAAkB,EAAE,gBAAgB;QACpC,cAAc,EAAE,iCAAiC;QACjD,aAAa,EAAE,gBAAgB;KAClC;IACD,KAAK,EACL;QACI,eAAe,EAAE,kBAAkB;KACtC;IACD,iBAAiB,EAAE,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI;CAC3C,CAAC;AAEF;;GAEG;AASH,MAAM,OAAO,yBAAwC,SAAQ,4BAAiG;IAE1J,iEAAiE;IACjE,YAA4D,eAAwC,EAC5E,SAAoB,EAChC,aAAyB,EACzB,cAAiC,EACJ,kBAAsC,EACzB,OAAiC;QAEnF,KAAK,CAAC,eAAe,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,kBAAkB,CAAC,CAAC;QAErF,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,IAAI,EAAE,EAAE,EAAE,cAAc,EAAE,OAAO,CAAC,CAAC;IAC9D,CAAC;8GAbQ,yBAAyB,kBAGd,0BAA0B,iIAI1B,mBAAmB,aACnB,oBAAoB;kGAR/B,yBAAyB,oGC1CtC,qxBAKS;;2FDqCI,yBAAyB;kBARrC,SAAS;+BAEI,kBAAkB,cAGhB,KAAK,mBACA,uBAAuB,CAAC,MAAM;;0BAKlC,MAAM;2BAAC,0BAA0B;;0BAAG,QAAQ;;0BAC5C,QAAQ;;0BAGR,MAAM;2BAAC,mBAAmB;;0BAC1B,MAAM;2BAAC,oBAAoB;;0BAAG,QAAQ","sourcesContent":["import {Component, ChangeDetectionStrategy, ChangeDetectorRef, Inject, Optional, ElementRef, OnDestroy} from '@angular/core';\nimport {StringLocalization, STRING_LOCALIZATION} from '@anglr/common';\nimport {extend} from '@jscrpt/common/extend';\n\nimport {BasicNormalStateOptions, BasicNormalState, CssClassesBasicNormalState} from './basicNormalState.interface';\nimport {NgSelectPlugin} from '../../../misc';\nimport {NgSelectPluginInstances} from '../../../components/select';\nimport {NG_SELECT_PLUGIN_INSTANCES} from '../../../components/select/types';\nimport {NORMAL_STATE_OPTIONS} from '../types';\nimport {PluginBus} from '../../../misc/pluginBus/pluginBus';\nimport {NormalStateAbstractComponent} from '../normalStateAbstract.component';\n\n/**\n * Default options for normal state\n * @internal\n */\nconst defaultOptions: BasicNormalStateOptions =\n{\n    cssClasses:\n    {\n        normalStateElement: 'btn btn-select',\n        selectedCarret: 'selected-caret fa fa-caret-down',\n        selectedValue: 'selected-value'\n    },\n    texts:\n    {\n        nothingSelected: 'Nothing selected'\n    },\n    optionDisplayText: option => option.text\n};\n\n/**\n * Component used for rendering basic simple normal state of select\n */\n@Component(\n{\n    selector: 'div.normal-state',\n    templateUrl: 'basicNormalState.component.html',\n    styleUrl: 'basicNormalState.component.css',\n    standalone: false,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class BasicNormalStateComponent<TValue = any> extends NormalStateAbstractComponent<CssClassesBasicNormalState, BasicNormalStateOptions<TValue>, TValue> implements BasicNormalState, NgSelectPlugin<BasicNormalStateOptions>, OnDestroy\n{\n    //######################### constructor #########################\n    constructor(@Inject(NG_SELECT_PLUGIN_INSTANCES) @Optional() ngSelectPlugins: NgSelectPluginInstances,\n                @Optional() pluginBus: PluginBus,\n                pluginElement: ElementRef,\n                changeDetector: ChangeDetectorRef,\n                @Inject(STRING_LOCALIZATION) stringLocalization: StringLocalization,\n                @Inject(NORMAL_STATE_OPTIONS) @Optional() options?: BasicNormalStateOptions)\n    {\n        super(ngSelectPlugins, pluginBus, pluginElement, changeDetector, stringLocalization);\n\n        this._options = extend(true, {}, defaultOptions, options);\n    }\n}\n","<ng-template #defaultLook>{{valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected: options?.optionDisplayText}}</ng-template>\r\n\r\n<button [ngClass]=\"options?.cssClasses?.normalStateElement\" (click)=\"pluginBus?.togglePopup.emit(); pluginBus?.liveSearchFocus.emit()\" (focus)=\"pluginBus?.focus?.emit()\" [disabled]=\"!!pluginBus?.selectOptions?.readonly\" type=\"button\" [title]=\"valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected\">\r\n    <span [ngClass]=\"options?.cssClasses?.selectedValue\"><ng-container *ngTemplateOutlet=\"pluginBus?.selectOptions?.templateGatherer?.normalStateTemplate || defaultLook; context: {$implicit: this}\"></ng-container></span>\r\n    <span [ngClass]=\"options?.cssClasses?.selectedCarret\"></span>\r\n</button>"]}

package/es2022/src/plugins/normalState/edit/editNormalState.component.js

@@ -0,0 +1,88 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, Inject, Optional } from '@angular/core';
+import { STRING_LOCALIZATION } from '@anglr/common';
+import { extend } from '@jscrpt/common/extend';
+import { NG_SELECT_PLUGIN_INSTANCES } from '../../../components/select/types';
+import { PluginBus } from '../../../misc/pluginBus/pluginBus';
+import { NormalStateAbstractComponent } from '../normalStateAbstract.component';
+import { NORMAL_STATE_OPTIONS } from '../types';
+import * as i0 from "@angular/core";
+import * as i1 from "../../../misc/pluginBus/pluginBus";
+import * as i2 from "@angular/common";
+import * as i3 from "../../../pipes/ngSelectValue.pipe";
+import * as i4 from "../../../pipes/ngSelectHasValue.pipe";
+//TODO - think of templating how to do it for edit select
+//TODO - add way to collapse multi selected values
+/**
+ * Default options for normal state
+ * @internal
+ */
+const defaultOptions = {
+    cssClasses: {
+        normalStateElement: 'btn btn-select',
+        selectedCarretWrapper: 'selected-caret',
+        selectedCarret: 'fa fa-caret-down',
+        selectedValue: 'selected-value',
+        selectedMultiValueContainer: 'selected-multi-value',
+        selectedMultiValueCancel: 'selected-multi-value-cancel',
+        cancelSelectedElement: 'fa cancel-selected'
+    },
+    texts: {
+        nothingSelected: 'Nothing selected'
+    },
+    cancelButton: false,
+    showOptionsButton: true,
+    optionDisplayText: option => option.text
+};
+/**
+ * Component used for rendering edit normal state of select
+ */
+export class EditNormalStateComponent extends NormalStateAbstractComponent {
+    //######################### public properties - template bindings #########################
+    /**
+     * Gets currently selected options
+     */
+    get selectedOptions() {
+        return this.valueHandler?.selectedOptions;
+    }
+    //######################### constructor #########################
+    constructor(ngSelectPlugins, pluginBus, pluginElement, changeDetector, stringLocalization, options) {
+        super(ngSelectPlugins, pluginBus, pluginElement, changeDetector, stringLocalization);
+        this._options = extend(true, {}, defaultOptions, options);
+    }
+    //######################### public methods - template bindings #########################
+    /**
+     * Cancel selected options
+     */
+    cancelSelected() {
+        if (Array.isArray(this.selectedOptions)) {
+            const options = [...this.selectedOptions];
+            options.forEach(opt => this.pluginBus.optionCancel.emit(opt));
+        }
+        else {
+            this.pluginBus.optionCancel.emit(this.selectedOptions);
+        }
+        this.pluginBus.updateDisplayedValue.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: EditNormalStateComponent, deps: [{ token: NG_SELECT_PLUGIN_INSTANCES, optional: true }, { token: i1.PluginBus, optional: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: STRING_LOCALIZATION }, { token: NORMAL_STATE_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.0", type: EditNormalStateComponent, isStandalone: false, selector: "div.edit-normal-state", usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"options?.cssClasses?.normalStateElement\" [title]=\"valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected\">\r\n    <ng-template [ngIf]=\"pluginBus.selectOptions.multiple\">\r\n        <div *ngFor=\"let option of selectedOptions\" [ngClass]=\"options?.cssClasses?.selectedMultiValueContainer\">\r\n            <span>{{option | ngSelectValue: texts?.nothingSelected: options?.optionDisplayText}}</span>\r\n            <span [ngClass]=\"options?.cssClasses?.selectedMultiValueCancel\"\r\n                  (click)=\"pluginBus.optionCancel.emit(option)\">x</span>\r\n        </div>\r\n    </ng-template>\r\n\r\n    <ng-content></ng-content>\r\n\r\n    <div *ngIf=\"options?.cancelButton && (valueHandler?.selectedOptions | ngSelectHasValue)\"\r\n         (click)=\"cancelSelected()\"\r\n         [ngClass]=\"options?.cssClasses?.cancelSelectedElement\"></div>\r\n\r\n    <div [ngClass]=\"options?.cssClasses?.selectedCarretWrapper\" (click)=\"pluginBus?.togglePopup.emit(); pluginBus?.liveSearchFocus?.emit()\" *ngIf=\"options?.showOptionsButton\">\r\n        <span [ngClass]=\"options?.cssClasses?.selectedCarret\"></span>\r\n    </div>\r\n</div>", styles: ["div.btn-select\r\n{\r\n    display: flex;\r\n    flex-direction: row;\r\n    width: 100%;\r\n    padding: 0;\r\n    background-color: #ffffff;\r\n    background-image: none;\r\n    border: 1px solid #cccccc;\r\n    border-radius: 4px;\r\n    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;\r\n    height: 28px;\r\n    overflow: hidden;\r\n    cursor: default;\r\n}\r\n\r\ndiv.btn-select:hover .selected-caret\r\n{\r\n    background-color: #F2F2F2;\r\n}\r\n\r\ndiv.btn-select .selected-value\r\n{\r\n    flex: 1;\r\n    text-align: left;\r\n    min-width: 0;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n}\r\n\r\ndiv.btn-select .selected-caret\r\n{\r\n    flex: 0 0 20px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    flex-direction: row;\r\n    cursor: pointer;\r\n}\r\n\r\n.selected-multi-value\r\n{\r\n    align-self: center;\r\n    padding: 1px 4px;\r\n    border-radius: 4px;\r\n    margin-left: 3px;\r\n    margin-right: 3px;\r\n    background: #BBB;\r\n}\r\n\r\n.selected-multi-value-cancel\r\n{\r\n    margin-left: 4px;\r\n}\r\n\r\n.selected-multi-value-cancel:hover\r\n{\r\n    opacity: 0.7;\r\n    cursor: pointer;\r\n}\r\n\r\n.cancel-selected\r\n{\r\n    cursor: pointer;\r\n    align-self: center;\r\n    padding: 2px;\r\n}\r\n\r\n.cancel-selected:hover\r\n{\r\n    opacity: 0.7;\r\n}\r\n\r\n.cancel-selected:before \r\n{\r\n    content: \"\\f00d\"; \r\n} "], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.NgSelectValuePipe, name: "ngSelectValue" }, { kind: "pipe", type: i4.NgSelectHasValuePipe, name: "ngSelectHasValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: EditNormalStateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'div.edit-normal-state', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"options?.cssClasses?.normalStateElement\" [title]=\"valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected\">\r\n    <ng-template [ngIf]=\"pluginBus.selectOptions.multiple\">\r\n        <div *ngFor=\"let option of selectedOptions\" [ngClass]=\"options?.cssClasses?.selectedMultiValueContainer\">\r\n            <span>{{option | ngSelectValue: texts?.nothingSelected: options?.optionDisplayText}}</span>\r\n            <span [ngClass]=\"options?.cssClasses?.selectedMultiValueCancel\"\r\n                  (click)=\"pluginBus.optionCancel.emit(option)\">x</span>\r\n        </div>\r\n    </ng-template>\r\n\r\n    <ng-content></ng-content>\r\n\r\n    <div *ngIf=\"options?.cancelButton && (valueHandler?.selectedOptions | ngSelectHasValue)\"\r\n         (click)=\"cancelSelected()\"\r\n         [ngClass]=\"options?.cssClasses?.cancelSelectedElement\"></div>\r\n\r\n    <div [ngClass]=\"options?.cssClasses?.selectedCarretWrapper\" (click)=\"pluginBus?.togglePopup.emit(); pluginBus?.liveSearchFocus?.emit()\" *ngIf=\"options?.showOptionsButton\">\r\n        <span [ngClass]=\"options?.cssClasses?.selectedCarret\"></span>\r\n    </div>\r\n</div>", styles: ["div.btn-select\r\n{\r\n    display: flex;\r\n    flex-direction: row;\r\n    width: 100%;\r\n    padding: 0;\r\n    background-color: #ffffff;\r\n    background-image: none;\r\n    border: 1px solid #cccccc;\r\n    border-radius: 4px;\r\n    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;\r\n    height: 28px;\r\n    overflow: hidden;\r\n    cursor: default;\r\n}\r\n\r\ndiv.btn-select:hover .selected-caret\r\n{\r\n    background-color: #F2F2F2;\r\n}\r\n\r\ndiv.btn-select .selected-value\r\n{\r\n    flex: 1;\r\n    text-align: left;\r\n    min-width: 0;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n}\r\n\r\ndiv.btn-select .selected-caret\r\n{\r\n    flex: 0 0 20px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    flex-direction: row;\r\n    cursor: pointer;\r\n}\r\n\r\n.selected-multi-value\r\n{\r\n    align-self: center;\r\n    padding: 1px 4px;\r\n    border-radius: 4px;\r\n    margin-left: 3px;\r\n    margin-right: 3px;\r\n    background: #BBB;\r\n}\r\n\r\n.selected-multi-value-cancel\r\n{\r\n    margin-left: 4px;\r\n}\r\n\r\n.selected-multi-value-cancel:hover\r\n{\r\n    opacity: 0.7;\r\n    cursor: pointer;\r\n}\r\n\r\n.cancel-selected\r\n{\r\n    cursor: pointer;\r\n    align-self: center;\r\n    padding: 2px;\r\n}\r\n\r\n.cancel-selected:hover\r\n{\r\n    opacity: 0.7;\r\n}\r\n\r\n.cancel-selected:before \r\n{\r\n    content: \"\\f00d\"; \r\n} "] }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [NG_SELECT_PLUGIN_INSTANCES]
+                }, {
+                    type: Optional
+                }] }, { type: i1.PluginBus, decorators: [{
+                    type: Optional
+                }] }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [STRING_LOCALIZATION]
+                }] }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [NORMAL_STATE_OPTIONS]
+                }, {
+                    type: Optional
+                }] }] });
+//# sourceMappingURL=editNormalState.component.js.map

package/es2022/src/plugins/normalState/edit/editNormalState.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editNormalState.component.js","sourceRoot":"","sources":["../../../../../src/plugins/normalState/edit/editNormalState.component.ts","../../../../../src/plugins/normalState/edit/editNormalState.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAC,uBAAuB,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,EAAa,QAAQ,EAAC,MAAM,eAAe,CAAC;AAC7H,OAAO,EAAqB,mBAAmB,EAAC,MAAM,eAAe,CAAC;AACtE,OAAO,EAAC,MAAM,EAAC,MAAM,uBAAuB,CAAC;AAG7C,OAAO,EAAC,0BAA0B,EAAC,MAAM,kCAAkC,CAAC;AAE5E,OAAO,EAAC,SAAS,EAAC,MAAM,mCAAmC,CAAC;AAC5D,OAAO,EAAC,4BAA4B,EAAC,MAAM,kCAAkC,CAAC;AAC9E,OAAO,EAAC,oBAAoB,EAAC,MAAM,UAAU,CAAC;;;;;;AAI9C,yDAAyD;AACzD,kDAAkD;AAElD;;;GAGG;AACH,MAAM,cAAc,GACpB;IACI,UAAU,EACV;QACI,kBAAkB,EAAE,gBAAgB;QACpC,qBAAqB,EAAE,gBAAgB;QACvC,cAAc,EAAE,kBAAkB;QAClC,aAAa,EAAE,gBAAgB;QAC/B,2BAA2B,EAAE,sBAAsB;QACnD,wBAAwB,EAAE,6BAA6B;QACvD,qBAAqB,EAAE,oBAAoB;KAC9C;IACD,KAAK,EACL;QACI,eAAe,EAAE,kBAAkB;KACtC;IACD,YAAY,EAAE,KAAK;IACnB,iBAAiB,EAAE,IAAI;IACvB,iBAAiB,EAAE,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI;CAC3C,CAAC;AAEF;;GAEG;AASH,MAAM,OAAO,wBAAuC,SAAQ,4BAA+F;IAEvJ,2FAA2F;IAE3F;;OAEG;IACH,IAAW,eAAe;QAEtB,OAAO,IAAI,CAAC,YAAY,EAAE,eAAmC,CAAC;IAClE,CAAC;IAED,iEAAiE;IACjE,YAA4D,eAAwC,EAC5E,SAAoB,EAChC,aAAyB,EACzB,cAAiC,EACJ,kBAAsC,EACzB,OAAgC;QAElF,KAAK,CAAC,eAAe,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,kBAAkB,CAAC,CAAC;QAErF,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,IAAI,EAAE,EAAE,EAAE,cAAc,EAAE,OAAO,CAAC,CAAC;IAC9D,CAAC;IAED,wFAAwF;IAExF;;OAEG;IACI,cAAc;QAEjB,IAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,EACtC,CAAC;YACG,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC;YAE1C,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;QAClE,CAAC;aAED,CAAC;YACG,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QAC3D,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;IAC/C,CAAC;8GA5CQ,wBAAwB,kBAab,0BAA0B,iIAI1B,mBAAmB,aACnB,oBAAoB;kGAlB/B,wBAAwB,yGCpDrC,2pCAkBM;;2FDkCO,wBAAwB;kBARpC,SAAS;+BAEI,uBAAuB,cAGrB,KAAK,mBACA,uBAAuB,CAAC,MAAM;;0BAelC,MAAM;2BAAC,0BAA0B;;0BAAG,QAAQ;;0BAC5C,QAAQ;;0BAGR,MAAM;2BAAC,mBAAmB;;0BAC1B,MAAM;2BAAC,oBAAoB;;0BAAG,QAAQ","sourcesContent":["import {ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, Inject, OnDestroy, Optional} from '@angular/core';\nimport {StringLocalization, STRING_LOCALIZATION} from '@anglr/common';\nimport {extend} from '@jscrpt/common/extend';\n\nimport {NgSelectPluginInstances} from '../../../components/select';\nimport {NG_SELECT_PLUGIN_INSTANCES} from '../../../components/select/types';\nimport {NgSelectPlugin} from '../../../misc';\nimport {PluginBus} from '../../../misc/pluginBus/pluginBus';\nimport {NormalStateAbstractComponent} from '../normalStateAbstract.component';\nimport {NORMAL_STATE_OPTIONS} from '../types';\nimport {CssClassesEditNormalState, EditNormalState, EditNormalStateOptions} from './editNormalState.interface';\nimport {NgSelectOption} from '../../../components/option';\n\n//TODO - think of templating how to do it for edit select\n//TODO - add way to collapse multi selected values\n\n/**\n * Default options for normal state\n * @internal\n */\nconst defaultOptions: EditNormalStateOptions =\n{\n    cssClasses:\n    {\n        normalStateElement: 'btn btn-select',\n        selectedCarretWrapper: 'selected-caret',\n        selectedCarret: 'fa fa-caret-down',\n        selectedValue: 'selected-value',\n        selectedMultiValueContainer: 'selected-multi-value',\n        selectedMultiValueCancel: 'selected-multi-value-cancel',\n        cancelSelectedElement: 'fa cancel-selected'\n    },\n    texts:\n    {\n        nothingSelected: 'Nothing selected'\n    },\n    cancelButton: false,\n    showOptionsButton: true,\n    optionDisplayText: option => option.text\n};\n\n/**\n * Component used for rendering edit normal state of select\n */\n@Component(\n{\n    selector: 'div.edit-normal-state',\n    templateUrl: 'editNormalState.component.html',\n    styleUrl: 'editNormalState.component.css',\n    standalone: false,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class EditNormalStateComponent<TValue = any> extends NormalStateAbstractComponent<CssClassesEditNormalState, EditNormalStateOptions<TValue>, TValue> implements EditNormalState, NgSelectPlugin<EditNormalStateOptions>, OnDestroy\n{\n    //######################### public properties - template bindings #########################\n\n    /**\n     * Gets currently selected options\n     */\n    public get selectedOptions(): NgSelectOption[]\n    {\n        return this.valueHandler?.selectedOptions as NgSelectOption[];\n    }\n\n    //######################### constructor #########################\n    constructor(@Inject(NG_SELECT_PLUGIN_INSTANCES) @Optional() ngSelectPlugins: NgSelectPluginInstances,\n                @Optional() pluginBus: PluginBus,\n                pluginElement: ElementRef,\n                changeDetector: ChangeDetectorRef,\n                @Inject(STRING_LOCALIZATION) stringLocalization: StringLocalization,\n                @Inject(NORMAL_STATE_OPTIONS) @Optional() options?: EditNormalStateOptions)\n    {\n        super(ngSelectPlugins, pluginBus, pluginElement, changeDetector, stringLocalization);\n\n        this._options = extend(true, {}, defaultOptions, options);\n    }\n\n    //######################### public methods - template bindings #########################\n\n    /**\n     * Cancel selected options\n     */\n    public cancelSelected(): void\n    {\n        if(Array.isArray(this.selectedOptions))\n        {\n            const options = [...this.selectedOptions];\n\n            options.forEach(opt => this.pluginBus.optionCancel.emit(opt));\n        }\n        else\n        {\n            this.pluginBus.optionCancel.emit(this.selectedOptions);\n        }\n\n        this.pluginBus.updateDisplayedValue.emit();\n    }\n}\n","<div [ngClass]=\"options?.cssClasses?.normalStateElement\" [title]=\"valueHandler?.selectedOptions | ngSelectValue: texts?.nothingSelected\">\r\n    <ng-template [ngIf]=\"pluginBus.selectOptions.multiple\">\r\n        <div *ngFor=\"let option of selectedOptions\" [ngClass]=\"options?.cssClasses?.selectedMultiValueContainer\">\r\n            <span>{{option | ngSelectValue: texts?.nothingSelected: options?.optionDisplayText}}</span>\r\n            <span [ngClass]=\"options?.cssClasses?.selectedMultiValueCancel\"\r\n                  (click)=\"pluginBus.optionCancel.emit(option)\">x</span>\r\n        </div>\r\n    </ng-template>\r\n\r\n    <ng-content></ng-content>\r\n\r\n    <div *ngIf=\"options?.cancelButton && (valueHandler?.selectedOptions | ngSelectHasValue)\"\r\n         (click)=\"cancelSelected()\"\r\n         [ngClass]=\"options?.cssClasses?.cancelSelectedElement\"></div>\r\n\r\n    <div [ngClass]=\"options?.cssClasses?.selectedCarretWrapper\" (click)=\"pluginBus?.togglePopup.emit(); pluginBus?.liveSearchFocus?.emit()\" *ngIf=\"options?.showOptionsButton\">\r\n        <span [ngClass]=\"options?.cssClasses?.selectedCarret\"></span>\r\n    </div>\r\n</div>"]}

package/{es2020 → es2022}/src/plugins/normalState/normalStateAbstract.component.js

@@ -1,5 +1,5 @@
 import { ChangeDetectorRef, ElementRef, Directive } from '@angular/core';
-import { extend } from '@jscrpt/common';
+import { extend } from '@jscrpt/common/extend';
 import { PluginBus } from '../../misc/pluginBus/pluginBus';
 import { VALUE_HANDLER } from '../valueHandler/types';
 import * as i0 from "@angular/core";
@@ -8,6 +8,16 @@ import * as i1 from "../../misc/pluginBus/pluginBus";
  * Base abstract class for normal state of select
  */
 export class NormalStateAbstractComponent {
+    //######################### public properties - implementation of NormalState #########################
+    /**
+     * Options for NgSelect plugin
+     */
+    get options() {
+        return this._options;
+    }
+    set options(options) {
+        this._options = extend(true, this._options, options);
+    }
     //######################### constructor #########################
     constructor(ngSelectPlugins, pluginBus, pluginElement, _changeDetector, _stringLocalization) {
         this.ngSelectPlugins = ngSelectPlugins;
@@ -26,16 +36,6 @@ export class NormalStateAbstractComponent {
          */
         this.texts = {};
     }
-    //######################### public properties - implementation of NormalState #########################
-    /**
-     * Options for NgSelect plugin
-     */
-    get options() {
-        return this._options;
-    }
-    set options(options) {
-        this._options = extend(true, this._options, options);
-    }
     //######################### public methods - implementation of OnDestroy #########################
     /**
      * Called when component is destroyed
@@ -83,10 +83,10 @@ export class NormalStateAbstractComponent {
         });
         this._changeDetector.detectChanges();
     }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: NormalStateAbstractComponent, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.0", type: NormalStateAbstractComponent, isStandalone: true, ngImport: i0 }); }
 }
-NormalStateAbstractComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NormalStateAbstractComponent, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-NormalStateAbstractComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: NormalStateAbstractComponent, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NormalStateAbstractComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: NormalStateAbstractComponent, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: undefined }, { type: i1.PluginBus }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined }]; } });
+        }], ctorParameters: () => [{ type: undefined }, { type: i1.PluginBus }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined }] });
 //# sourceMappingURL=normalStateAbstract.component.js.map