@ng-select/ng-select
Version:
Angular ng-select - All in One UI Select, Multiselect and Autocomplete
3,161 lines • 139 kB
JavaScript
import * as i0 from '@angular/core';
import { Directive, Input, Injectable, EventEmitter, booleanAttribute, ElementRef, Component, ChangeDetectionStrategy, ViewEncapsulation, Optional, Inject, Output, ViewChild, InjectionToken, numberAttribute, forwardRef, TemplateRef, Attribute, HostBinding, ContentChild, ContentChildren, HostListener, NgModule } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { takeUntil, auditTime, startWith, tap, debounceTime, filter, map } from 'rxjs/operators';
import { animationFrameScheduler, asapScheduler, Subject, fromEvent, merge } from 'rxjs';
import * as i3 from '@angular/common';
import { DOCUMENT, CommonModule } from '@angular/common';
const unescapedHTMLExp = /[&<>"']/g;
const hasUnescapedHTMLExp = RegExp(unescapedHTMLExp.source);
const htmlEscapes = {
'&': '&',
'<': '<',
'>': '>',
'"': '"',
'\'': '''
};
function escapeHTML(value) {
return (value && hasUnescapedHTMLExp.test(value)) ?
value.replace(unescapedHTMLExp, chr => htmlEscapes[chr]) :
value;
}
function isDefined(value) {
return value !== undefined && value !== null;
}
function isObject(value) {
return typeof value === 'object' && isDefined(value);
}
function isPromise(value) {
return value instanceof Promise;
}
function isFunction(value) {
return value instanceof Function;
}
class NgItemLabelDirective {
constructor(element) {
this.element = element;
this.escape = true;
}
ngOnChanges(changes) {
this.element.nativeElement.innerHTML = this.escape ?
escapeHTML(this.ngItemLabel) :
this.ngItemLabel;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgItemLabelDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgItemLabelDirective, selector: "[ngItemLabel]", inputs: { ngItemLabel: "ngItemLabel", escape: "escape" }, usesOnChanges: true, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgItemLabelDirective, decorators: [{
type: Directive,
args: [{ selector: '[ngItemLabel]' }]
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { ngItemLabel: [{
type: Input
}], escape: [{
type: Input
}] } });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgOptionTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgOptionTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgOptionTemplateDirective, selector: "[ng-option-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgOptionTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-option-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgOptgroupTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgOptgroupTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgOptgroupTemplateDirective, selector: "[ng-optgroup-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgOptgroupTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-optgroup-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgLabelTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgLabelTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgLabelTemplateDirective, selector: "[ng-label-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgLabelTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-label-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgMultiLabelTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgMultiLabelTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgMultiLabelTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-multi-label-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgHeaderTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgHeaderTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgHeaderTemplateDirective, selector: "[ng-header-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgHeaderTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-header-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgFooterTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgFooterTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgFooterTemplateDirective, selector: "[ng-footer-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgFooterTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-footer-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgNotFoundTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgNotFoundTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgNotFoundTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-notfound-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgTypeToSearchTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgTypeToSearchTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgTypeToSearchTemplateDirective, selector: "[ng-typetosearch-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgTypeToSearchTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-typetosearch-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgLoadingTextTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgLoadingTextTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgLoadingTextTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-loadingtext-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgTagTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgTagTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgTagTemplateDirective, selector: "[ng-tag-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgTagTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-tag-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
// eslint-disable-next-line @angular-eslint/directive-selector
class NgLoadingSpinnerTemplateDirective {
constructor(template) {
this.template = template;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgLoadingSpinnerTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgLoadingSpinnerTemplateDirective, decorators: [{
type: Directive,
args: [{ selector: '[ng-loadingspinner-tmp]' }]
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
function newId() {
// First character is an 'a', it's good practice to tag id to begin with a letter
return 'axxxxxxxxxxx'.replace(/[x]/g, () => {
// eslint-disable-next-line no-bitwise
const val = Math.random() * 16 | 0;
return val.toString(16);
});
}
const diacritics = {
'\u24B6': 'A',
'\uFF21': 'A',
'\u00C0': 'A',
'\u00C1': 'A',
'\u00C2': 'A',
'\u1EA6': 'A',
'\u1EA4': 'A',
'\u1EAA': 'A',
'\u1EA8': 'A',
'\u00C3': 'A',
'\u0100': 'A',
'\u0102': 'A',
'\u1EB0': 'A',
'\u1EAE': 'A',
'\u1EB4': 'A',
'\u1EB2': 'A',
'\u0226': 'A',
'\u01E0': 'A',
'\u00C4': 'A',
'\u01DE': 'A',
'\u1EA2': 'A',
'\u00C5': 'A',
'\u01FA': 'A',
'\u01CD': 'A',
'\u0200': 'A',
'\u0202': 'A',
'\u1EA0': 'A',
'\u1EAC': 'A',
'\u1EB6': 'A',
'\u1E00': 'A',
'\u0104': 'A',
'\u023A': 'A',
'\u2C6F': 'A',
'\uA732': 'AA',
'\u00C6': 'AE',
'\u01FC': 'AE',
'\u01E2': 'AE',
'\uA734': 'AO',
'\uA736': 'AU',
'\uA738': 'AV',
'\uA73A': 'AV',
'\uA73C': 'AY',
'\u24B7': 'B',
'\uFF22': 'B',
'\u1E02': 'B',
'\u1E04': 'B',
'\u1E06': 'B',
'\u0243': 'B',
'\u0182': 'B',
'\u0181': 'B',
'\u24B8': 'C',
'\uFF23': 'C',
'\u0106': 'C',
'\u0108': 'C',
'\u010A': 'C',
'\u010C': 'C',
'\u00C7': 'C',
'\u1E08': 'C',
'\u0187': 'C',
'\u023B': 'C',
'\uA73E': 'C',
'\u24B9': 'D',
'\uFF24': 'D',
'\u1E0A': 'D',
'\u010E': 'D',
'\u1E0C': 'D',
'\u1E10': 'D',
'\u1E12': 'D',
'\u1E0E': 'D',
'\u0110': 'D',
'\u018B': 'D',
'\u018A': 'D',
'\u0189': 'D',
'\uA779': 'D',
'\u01F1': 'DZ',
'\u01C4': 'DZ',
'\u01F2': 'Dz',
'\u01C5': 'Dz',
'\u24BA': 'E',
'\uFF25': 'E',
'\u00C8': 'E',
'\u00C9': 'E',
'\u00CA': 'E',
'\u1EC0': 'E',
'\u1EBE': 'E',
'\u1EC4': 'E',
'\u1EC2': 'E',
'\u1EBC': 'E',
'\u0112': 'E',
'\u1E14': 'E',
'\u1E16': 'E',
'\u0114': 'E',
'\u0116': 'E',
'\u00CB': 'E',
'\u1EBA': 'E',
'\u011A': 'E',
'\u0204': 'E',
'\u0206': 'E',
'\u1EB8': 'E',
'\u1EC6': 'E',
'\u0228': 'E',
'\u1E1C': 'E',
'\u0118': 'E',
'\u1E18': 'E',
'\u1E1A': 'E',
'\u0190': 'E',
'\u018E': 'E',
'\u24BB': 'F',
'\uFF26': 'F',
'\u1E1E': 'F',
'\u0191': 'F',
'\uA77B': 'F',
'\u24BC': 'G',
'\uFF27': 'G',
'\u01F4': 'G',
'\u011C': 'G',
'\u1E20': 'G',
'\u011E': 'G',
'\u0120': 'G',
'\u01E6': 'G',
'\u0122': 'G',
'\u01E4': 'G',
'\u0193': 'G',
'\uA7A0': 'G',
'\uA77D': 'G',
'\uA77E': 'G',
'\u24BD': 'H',
'\uFF28': 'H',
'\u0124': 'H',
'\u1E22': 'H',
'\u1E26': 'H',
'\u021E': 'H',
'\u1E24': 'H',
'\u1E28': 'H',
'\u1E2A': 'H',
'\u0126': 'H',
'\u2C67': 'H',
'\u2C75': 'H',
'\uA78D': 'H',
'\u24BE': 'I',
'\uFF29': 'I',
'\u00CC': 'I',
'\u00CD': 'I',
'\u00CE': 'I',
'\u0128': 'I',
'\u012A': 'I',
'\u012C': 'I',
'\u0130': 'I',
'\u00CF': 'I',
'\u1E2E': 'I',
'\u1EC8': 'I',
'\u01CF': 'I',
'\u0208': 'I',
'\u020A': 'I',
'\u1ECA': 'I',
'\u012E': 'I',
'\u1E2C': 'I',
'\u0197': 'I',
'\u24BF': 'J',
'\uFF2A': 'J',
'\u0134': 'J',
'\u0248': 'J',
'\u24C0': 'K',
'\uFF2B': 'K',
'\u1E30': 'K',
'\u01E8': 'K',
'\u1E32': 'K',
'\u0136': 'K',
'\u1E34': 'K',
'\u0198': 'K',
'\u2C69': 'K',
'\uA740': 'K',
'\uA742': 'K',
'\uA744': 'K',
'\uA7A2': 'K',
'\u24C1': 'L',
'\uFF2C': 'L',
'\u013F': 'L',
'\u0139': 'L',
'\u013D': 'L',
'\u1E36': 'L',
'\u1E38': 'L',
'\u013B': 'L',
'\u1E3C': 'L',
'\u1E3A': 'L',
'\u0141': 'L',
'\u023D': 'L',
'\u2C62': 'L',
'\u2C60': 'L',
'\uA748': 'L',
'\uA746': 'L',
'\uA780': 'L',
'\u01C7': 'LJ',
'\u01C8': 'Lj',
'\u24C2': 'M',
'\uFF2D': 'M',
'\u1E3E': 'M',
'\u1E40': 'M',
'\u1E42': 'M',
'\u2C6E': 'M',
'\u019C': 'M',
'\u24C3': 'N',
'\uFF2E': 'N',
'\u01F8': 'N',
'\u0143': 'N',
'\u00D1': 'N',
'\u1E44': 'N',
'\u0147': 'N',
'\u1E46': 'N',
'\u0145': 'N',
'\u1E4A': 'N',
'\u1E48': 'N',
'\u0220': 'N',
'\u019D': 'N',
'\uA790': 'N',
'\uA7A4': 'N',
'\u01CA': 'NJ',
'\u01CB': 'Nj',
'\u24C4': 'O',
'\uFF2F': 'O',
'\u00D2': 'O',
'\u00D3': 'O',
'\u00D4': 'O',
'\u1ED2': 'O',
'\u1ED0': 'O',
'\u1ED6': 'O',
'\u1ED4': 'O',
'\u00D5': 'O',
'\u1E4C': 'O',
'\u022C': 'O',
'\u1E4E': 'O',
'\u014C': 'O',
'\u1E50': 'O',
'\u1E52': 'O',
'\u014E': 'O',
'\u022E': 'O',
'\u0230': 'O',
'\u00D6': 'O',
'\u022A': 'O',
'\u1ECE': 'O',
'\u0150': 'O',
'\u01D1': 'O',
'\u020C': 'O',
'\u020E': 'O',
'\u01A0': 'O',
'\u1EDC': 'O',
'\u1EDA': 'O',
'\u1EE0': 'O',
'\u1EDE': 'O',
'\u1EE2': 'O',
'\u1ECC': 'O',
'\u1ED8': 'O',
'\u01EA': 'O',
'\u01EC': 'O',
'\u00D8': 'O',
'\u01FE': 'O',
'\u0186': 'O',
'\u019F': 'O',
'\uA74A': 'O',
'\uA74C': 'O',
'\u01A2': 'OI',
'\uA74E': 'OO',
'\u0222': 'OU',
'\u24C5': 'P',
'\uFF30': 'P',
'\u1E54': 'P',
'\u1E56': 'P',
'\u01A4': 'P',
'\u2C63': 'P',
'\uA750': 'P',
'\uA752': 'P',
'\uA754': 'P',
'\u24C6': 'Q',
'\uFF31': 'Q',
'\uA756': 'Q',
'\uA758': 'Q',
'\u024A': 'Q',
'\u24C7': 'R',
'\uFF32': 'R',
'\u0154': 'R',
'\u1E58': 'R',
'\u0158': 'R',
'\u0210': 'R',
'\u0212': 'R',
'\u1E5A': 'R',
'\u1E5C': 'R',
'\u0156': 'R',
'\u1E5E': 'R',
'\u024C': 'R',
'\u2C64': 'R',
'\uA75A': 'R',
'\uA7A6': 'R',
'\uA782': 'R',
'\u24C8': 'S',
'\uFF33': 'S',
'\u1E9E': 'S',
'\u015A': 'S',
'\u1E64': 'S',
'\u015C': 'S',
'\u1E60': 'S',
'\u0160': 'S',
'\u1E66': 'S',
'\u1E62': 'S',
'\u1E68': 'S',
'\u0218': 'S',
'\u015E': 'S',
'\u2C7E': 'S',
'\uA7A8': 'S',
'\uA784': 'S',
'\u24C9': 'T',
'\uFF34': 'T',
'\u1E6A': 'T',
'\u0164': 'T',
'\u1E6C': 'T',
'\u021A': 'T',
'\u0162': 'T',
'\u1E70': 'T',
'\u1E6E': 'T',
'\u0166': 'T',
'\u01AC': 'T',
'\u01AE': 'T',
'\u023E': 'T',
'\uA786': 'T',
'\uA728': 'TZ',
'\u24CA': 'U',
'\uFF35': 'U',
'\u00D9': 'U',
'\u00DA': 'U',
'\u00DB': 'U',
'\u0168': 'U',
'\u1E78': 'U',
'\u016A': 'U',
'\u1E7A': 'U',
'\u016C': 'U',
'\u00DC': 'U',
'\u01DB': 'U',
'\u01D7': 'U',
'\u01D5': 'U',
'\u01D9': 'U',
'\u1EE6': 'U',
'\u016E': 'U',
'\u0170': 'U',
'\u01D3': 'U',
'\u0214': 'U',
'\u0216': 'U',
'\u01AF': 'U',
'\u1EEA': 'U',
'\u1EE8': 'U',
'\u1EEE': 'U',
'\u1EEC': 'U',
'\u1EF0': 'U',
'\u1EE4': 'U',
'\u1E72': 'U',
'\u0172': 'U',
'\u1E76': 'U',
'\u1E74': 'U',
'\u0244': 'U',
'\u24CB': 'V',
'\uFF36': 'V',
'\u1E7C': 'V',
'\u1E7E': 'V',
'\u01B2': 'V',
'\uA75E': 'V',
'\u0245': 'V',
'\uA760': 'VY',
'\u24CC': 'W',
'\uFF37': 'W',
'\u1E80': 'W',
'\u1E82': 'W',
'\u0174': 'W',
'\u1E86': 'W',
'\u1E84': 'W',
'\u1E88': 'W',
'\u2C72': 'W',
'\u24CD': 'X',
'\uFF38': 'X',
'\u1E8A': 'X',
'\u1E8C': 'X',
'\u24CE': 'Y',
'\uFF39': 'Y',
'\u1EF2': 'Y',
'\u00DD': 'Y',
'\u0176': 'Y',
'\u1EF8': 'Y',
'\u0232': 'Y',
'\u1E8E': 'Y',
'\u0178': 'Y',
'\u1EF6': 'Y',
'\u1EF4': 'Y',
'\u01B3': 'Y',
'\u024E': 'Y',
'\u1EFE': 'Y',
'\u24CF': 'Z',
'\uFF3A': 'Z',
'\u0179': 'Z',
'\u1E90': 'Z',
'\u017B': 'Z',
'\u017D': 'Z',
'\u1E92': 'Z',
'\u1E94': 'Z',
'\u01B5': 'Z',
'\u0224': 'Z',
'\u2C7F': 'Z',
'\u2C6B': 'Z',
'\uA762': 'Z',
'\u24D0': 'a',
'\uFF41': 'a',
'\u1E9A': 'a',
'\u00E0': 'a',
'\u00E1': 'a',
'\u00E2': 'a',
'\u1EA7': 'a',
'\u1EA5': 'a',
'\u1EAB': 'a',
'\u1EA9': 'a',
'\u00E3': 'a',
'\u0101': 'a',
'\u0103': 'a',
'\u1EB1': 'a',
'\u1EAF': 'a',
'\u1EB5': 'a',
'\u1EB3': 'a',
'\u0227': 'a',
'\u01E1': 'a',
'\u00E4': 'a',
'\u01DF': 'a',
'\u1EA3': 'a',
'\u00E5': 'a',
'\u01FB': 'a',
'\u01CE': 'a',
'\u0201': 'a',
'\u0203': 'a',
'\u1EA1': 'a',
'\u1EAD': 'a',
'\u1EB7': 'a',
'\u1E01': 'a',
'\u0105': 'a',
'\u2C65': 'a',
'\u0250': 'a',
'\uA733': 'aa',
'\u00E6': 'ae',
'\u01FD': 'ae',
'\u01E3': 'ae',
'\uA735': 'ao',
'\uA737': 'au',
'\uA739': 'av',
'\uA73B': 'av',
'\uA73D': 'ay',
'\u24D1': 'b',
'\uFF42': 'b',
'\u1E03': 'b',
'\u1E05': 'b',
'\u1E07': 'b',
'\u0180': 'b',
'\u0183': 'b',
'\u0253': 'b',
'\u24D2': 'c',
'\uFF43': 'c',
'\u0107': 'c',
'\u0109': 'c',
'\u010B': 'c',
'\u010D': 'c',
'\u00E7': 'c',
'\u1E09': 'c',
'\u0188': 'c',
'\u023C': 'c',
'\uA73F': 'c',
'\u2184': 'c',
'\u24D3': 'd',
'\uFF44': 'd',
'\u1E0B': 'd',
'\u010F': 'd',
'\u1E0D': 'd',
'\u1E11': 'd',
'\u1E13': 'd',
'\u1E0F': 'd',
'\u0111': 'd',
'\u018C': 'd',
'\u0256': 'd',
'\u0257': 'd',
'\uA77A': 'd',
'\u01F3': 'dz',
'\u01C6': 'dz',
'\u24D4': 'e',
'\uFF45': 'e',
'\u00E8': 'e',
'\u00E9': 'e',
'\u00EA': 'e',
'\u1EC1': 'e',
'\u1EBF': 'e',
'\u1EC5': 'e',
'\u1EC3': 'e',
'\u1EBD': 'e',
'\u0113': 'e',
'\u1E15': 'e',
'\u1E17': 'e',
'\u0115': 'e',
'\u0117': 'e',
'\u00EB': 'e',
'\u1EBB': 'e',
'\u011B': 'e',
'\u0205': 'e',
'\u0207': 'e',
'\u1EB9': 'e',
'\u1EC7': 'e',
'\u0229': 'e',
'\u1E1D': 'e',
'\u0119': 'e',
'\u1E19': 'e',
'\u1E1B': 'e',
'\u0247': 'e',
'\u025B': 'e',
'\u01DD': 'e',
'\u24D5': 'f',
'\uFF46': 'f',
'\u1E1F': 'f',
'\u0192': 'f',
'\uA77C': 'f',
'\u24D6': 'g',
'\uFF47': 'g',
'\u01F5': 'g',
'\u011D': 'g',
'\u1E21': 'g',
'\u011F': 'g',
'\u0121': 'g',
'\u01E7': 'g',
'\u0123': 'g',
'\u01E5': 'g',
'\u0260': 'g',
'\uA7A1': 'g',
'\u1D79': 'g',
'\uA77F': 'g',
'\u24D7': 'h',
'\uFF48': 'h',
'\u0125': 'h',
'\u1E23': 'h',
'\u1E27': 'h',
'\u021F': 'h',
'\u1E25': 'h',
'\u1E29': 'h',
'\u1E2B': 'h',
'\u1E96': 'h',
'\u0127': 'h',
'\u2C68': 'h',
'\u2C76': 'h',
'\u0265': 'h',
'\u0195': 'hv',
'\u24D8': 'i',
'\uFF49': 'i',
'\u00EC': 'i',
'\u00ED': 'i',
'\u00EE': 'i',
'\u0129': 'i',
'\u012B': 'i',
'\u012D': 'i',
'\u00EF': 'i',
'\u1E2F': 'i',
'\u1EC9': 'i',
'\u01D0': 'i',
'\u0209': 'i',
'\u020B': 'i',
'\u1ECB': 'i',
'\u012F': 'i',
'\u1E2D': 'i',
'\u0268': 'i',
'\u0131': 'i',
'\u24D9': 'j',
'\uFF4A': 'j',
'\u0135': 'j',
'\u01F0': 'j',
'\u0249': 'j',
'\u24DA': 'k',
'\uFF4B': 'k',
'\u1E31': 'k',
'\u01E9': 'k',
'\u1E33': 'k',
'\u0137': 'k',
'\u1E35': 'k',
'\u0199': 'k',
'\u2C6A': 'k',
'\uA741': 'k',
'\uA743': 'k',
'\uA745': 'k',
'\uA7A3': 'k',
'\u24DB': 'l',
'\uFF4C': 'l',
'\u0140': 'l',
'\u013A': 'l',
'\u013E': 'l',
'\u1E37': 'l',
'\u1E39': 'l',
'\u013C': 'l',
'\u1E3D': 'l',
'\u1E3B': 'l',
'\u017F': 'l',
'\u0142': 'l',
'\u019A': 'l',
'\u026B': 'l',
'\u2C61': 'l',
'\uA749': 'l',
'\uA781': 'l',
'\uA747': 'l',
'\u01C9': 'lj',
'\u24DC': 'm',
'\uFF4D': 'm',
'\u1E3F': 'm',
'\u1E41': 'm',
'\u1E43': 'm',
'\u0271': 'm',
'\u026F': 'm',
'\u24DD': 'n',
'\uFF4E': 'n',
'\u01F9': 'n',
'\u0144': 'n',
'\u00F1': 'n',
'\u1E45': 'n',
'\u0148': 'n',
'\u1E47': 'n',
'\u0146': 'n',
'\u1E4B': 'n',
'\u1E49': 'n',
'\u019E': 'n',
'\u0272': 'n',
'\u0149': 'n',
'\uA791': 'n',
'\uA7A5': 'n',
'\u01CC': 'nj',
'\u24DE': 'o',
'\uFF4F': 'o',
'\u00F2': 'o',
'\u00F3': 'o',
'\u00F4': 'o',
'\u1ED3': 'o',
'\u1ED1': 'o',
'\u1ED7': 'o',
'\u1ED5': 'o',
'\u00F5': 'o',
'\u1E4D': 'o',
'\u022D': 'o',
'\u1E4F': 'o',
'\u014D': 'o',
'\u1E51': 'o',
'\u1E53': 'o',
'\u014F': 'o',
'\u022F': 'o',
'\u0231': 'o',
'\u00F6': 'o',
'\u022B': 'o',
'\u1ECF': 'o',
'\u0151': 'o',
'\u01D2': 'o',
'\u020D': 'o',
'\u020F': 'o',
'\u01A1': 'o',
'\u1EDD': 'o',
'\u1EDB': 'o',
'\u1EE1': 'o',
'\u1EDF': 'o',
'\u1EE3': 'o',
'\u1ECD': 'o',
'\u1ED9': 'o',
'\u01EB': 'o',
'\u01ED': 'o',
'\u00F8': 'o',
'\u01FF': 'o',
'\u0254': 'o',
'\uA74B': 'o',
'\uA74D': 'o',
'\u0275': 'o',
'\u01A3': 'oi',
'\u0223': 'ou',
'\uA74F': 'oo',
'\u24DF': 'p',
'\uFF50': 'p',
'\u1E55': 'p',
'\u1E57': 'p',
'\u01A5': 'p',
'\u1D7D': 'p',
'\uA751': 'p',
'\uA753': 'p',
'\uA755': 'p',
'\u24E0': 'q',
'\uFF51': 'q',
'\u024B': 'q',
'\uA757': 'q',
'\uA759': 'q',
'\u24E1': 'r',
'\uFF52': 'r',
'\u0155': 'r',
'\u1E59': 'r',
'\u0159': 'r',
'\u0211': 'r',
'\u0213': 'r',
'\u1E5B': 'r',
'\u1E5D': 'r',
'\u0157': 'r',
'\u1E5F': 'r',
'\u024D': 'r',
'\u027D': 'r',
'\uA75B': 'r',
'\uA7A7': 'r',
'\uA783': 'r',
'\u24E2': 's',
'\uFF53': 's',
'\u00DF': 's',
'\u015B': 's',
'\u1E65': 's',
'\u015D': 's',
'\u1E61': 's',
'\u0161': 's',
'\u1E67': 's',
'\u1E63': 's',
'\u1E69': 's',
'\u0219': 's',
'\u015F': 's',
'\u023F': 's',
'\uA7A9': 's',
'\uA785': 's',
'\u1E9B': 's',
'\u24E3': 't',
'\uFF54': 't',
'\u1E6B': 't',
'\u1E97': 't',
'\u0165': 't',
'\u1E6D': 't',
'\u021B': 't',
'\u0163': 't',
'\u1E71': 't',
'\u1E6F': 't',
'\u0167': 't',
'\u01AD': 't',
'\u0288': 't',
'\u2C66': 't',
'\uA787': 't',
'\uA729': 'tz',
'\u24E4': 'u',
'\uFF55': 'u',
'\u00F9': 'u',
'\u00FA': 'u',
'\u00FB': 'u',
'\u0169': 'u',
'\u1E79': 'u',
'\u016B': 'u',
'\u1E7B': 'u',
'\u016D': 'u',
'\u00FC': 'u',
'\u01DC': 'u',
'\u01D8': 'u',
'\u01D6': 'u',
'\u01DA': 'u',
'\u1EE7': 'u',
'\u016F': 'u',
'\u0171': 'u',
'\u01D4': 'u',
'\u0215': 'u',
'\u0217': 'u',
'\u01B0': 'u',
'\u1EEB': 'u',
'\u1EE9': 'u',
'\u1EEF': 'u',
'\u1EED': 'u',
'\u1EF1': 'u',
'\u1EE5': 'u',
'\u1E73': 'u',
'\u0173': 'u',
'\u1E77': 'u',
'\u1E75': 'u',
'\u0289': 'u',
'\u24E5': 'v',
'\uFF56': 'v',
'\u1E7D': 'v',
'\u1E7F': 'v',
'\u028B': 'v',
'\uA75F': 'v',
'\u028C': 'v',
'\uA761': 'vy',
'\u24E6': 'w',
'\uFF57': 'w',
'\u1E81': 'w',
'\u1E83': 'w',
'\u0175': 'w',
'\u1E87': 'w',
'\u1E85': 'w',
'\u1E98': 'w',
'\u1E89': 'w',
'\u2C73': 'w',
'\u24E7': 'x',
'\uFF58': 'x',
'\u1E8B': 'x',
'\u1E8D': 'x',
'\u24E8': 'y',
'\uFF59': 'y',
'\u1EF3': 'y',
'\u00FD': 'y',
'\u0177': 'y',
'\u1EF9': 'y',
'\u0233': 'y',
'\u1E8F': 'y',
'\u00FF': 'y',
'\u1EF7': 'y',
'\u1E99': 'y',
'\u1EF5': 'y',
'\u01B4': 'y',
'\u024F': 'y',
'\u1EFF': 'y',
'\u24E9': 'z',
'\uFF5A': 'z',
'\u017A': 'z',
'\u1E91': 'z',
'\u017C': 'z',
'\u017E': 'z',
'\u1E93': 'z',
'\u1E95': 'z',
'\u01B6': 'z',
'\u0225': 'z',
'\u0240': 'z',
'\u2C6C': 'z',
'\uA763': 'z',
'\u0386': '\u0391',
'\u0388': '\u0395',
'\u0389': '\u0397',
'\u038A': '\u0399',
'\u03AA': '\u0399',
'\u038C': '\u039F',
'\u038E': '\u03A5',
'\u03AB': '\u03A5',
'\u038F': '\u03A9',
'\u03AC': '\u03B1',
'\u03AD': '\u03B5',
'\u03AE': '\u03B7',
'\u03AF': '\u03B9',
'\u03CA': '\u03B9',
'\u0390': '\u03B9',
'\u03CC': '\u03BF',
'\u03CD': '\u03C5',
'\u03CB': '\u03C5',
'\u03B0': '\u03C5',
'\u03C9': '\u03C9',
'\u03C2': '\u03C3'
};
function stripSpecialChars(text) {
const match = (a) => diacritics[a] || a;
return text.replace(/[^\u0000-\u007E]/g, match);
}
class ItemsList {
constructor(_ngSelect, _selectionModel) {
this._ngSelect = _ngSelect;
this._selectionModel = _selectionModel;
this._items = [];
this._filteredItems = [];
this._markedIndex = -1;
}
get items() {
return this._items;
}
get filteredItems() {
return this._filteredItems;
}
get markedIndex() {
return this._markedIndex;
}
get selectedItems() {
return this._selectionModel.value;
}
get markedItem() {
return this._filteredItems[this._markedIndex];
}
get noItemsToSelect() {
return this._ngSelect.hideSelected && this._items.length === this.selectedItems.length;
}
get maxItemsSelected() {
return this._ngSelect.multiple && this._ngSelect.maxSelectedItems <= this.selectedItems.length;
}
get lastSelectedItem() {
let i = this.selectedItems.length - 1;
for (; i >= 0; i--) {
const item = this.selectedItems[i];
if (!item.disabled) {
return item;
}
}
return null;
}
setItems(items) {
this._items = items.map((item, index) => this.mapItem(item, index));
if (this._ngSelect.groupBy) {
this._groups = this._groupBy(this._items, this._ngSelect.groupBy);
this._items = this._flatten(this._groups);
}
else {
this._groups = new Map();
this._groups.set(undefined, this._items);
}
this._filteredItems = [...this._items];
}
select(item) {
if (item.selected || this.maxItemsSelected) {
return;
}
const multiple = this._ngSelect.multiple;
if (!multiple) {
this.clearSelected();
}
this._selectionModel.select(item, multiple, this._ngSelect.selectableGroupAsModel);
if (this._ngSelect.hideSelected) {
this._hideSelected(item);
}
}
unselect(item) {
if (!item.selected) {
return;
}
this._selectionModel.unselect(item, this._ngSelect.multiple);
if (this._ngSelect.hideSelected && isDefined(item.index) && this._ngSelect.multiple) {
this._showSelected(item);
}
}
findItem(value) {
let findBy;
if (this._ngSelect.compareWith) {
findBy = item => this._ngSelect.compareWith(item.value, value);
}
else if (this._ngSelect.bindValue) {
findBy = item => !item.children && this.resolveNested(item.value, this._ngSelect.bindValue) === value;
}
else {
findBy = item => item.value === value ||
!item.children && item.label && item.label === this.resolveNested(value, this._ngSelect.bindLabel);
}
return this._items.find(item => findBy(item));
}
addItem(item) {
const option = this.mapItem(item, this._items.length);
this._items.push(option);
this._filteredItems.push(option);
return option;
}
clearSelected(keepDisabled = false) {
this._selectionModel.clear(keepDisabled);
this._items.forEach(item => {
item.selected = keepDisabled && item.selected && item.disabled;
item.marked = false;
});
if (this._ngSelect.hideSelected) {
this.resetFilteredItems();
}
}
findByLabel(term) {
term = stripSpecialChars(term).toLocaleLowerCase();
return this.filteredItems.find(item => {
const label = stripSpecialChars(item.label).toLocaleLowerCase();
return label.substr(0, term.length) === term;
});
}
filter(term) {
if (!term) {
this.resetFilteredItems();
return;
}
this._filteredItems = [];
term = this._ngSelect.searchFn ? term : stripSpecialChars(term).toLocaleLowerCase();
const match = this._ngSelect.searchFn || this._defaultSearchFn;
const hideSelected = this._ngSelect.hideSelected;
for (const key of Array.from(this._groups.keys())) {
const matchedItems = [];
for (const item of this._groups.get(key)) {
if (hideSelected && (item.parent && item.parent.selected || item.selected)) {
continue;
}
const searchItem = this._ngSelect.searchFn ? item.value : item;
if (match(term, searchItem)) {
matchedItems.push(item);
}
}
if (matchedItems.length > 0) {
const [last] = matchedItems.slice(-1);
if (last.parent) {
const head = this._items.find(x => x === last.parent);
this._filteredItems.push(head);
}
this._filteredItems.push(...matchedItems);
}
}
}
resetFilteredItems() {
if (this._filteredItems.length === this._items.length) {
return;
}
if (this._ngSelect.hideSelected && this.selectedItems.length > 0) {
this._filteredItems = this._items.filter(x => !x.selected);
}
else {
this._filteredItems = this._items;
}
}
unmarkItem() {
this._markedIndex = -1;
}
markNextItem() {
this._stepToItem(+1);
}
markPreviousItem() {
this._stepToItem(-1);
}
markItem(item) {
this._markedIndex = this._filteredItems.indexOf(item);
}
markSelectedOrDefault(markDefault) {
if (this._filteredItems.length === 0) {
return;
}
const lastMarkedIndex = this._getLastMarkedIndex();
if (lastMarkedIndex > -1) {
this._markedIndex = lastMarkedIndex;
}
else {
this._markedIndex = markDefault ? this.filteredItems.findIndex(x => !x.disabled) : -1;
}
}
resolveNested(option, key) {
if (!isObject(option)) {
return option;
}
if (key.indexOf('.') === -1) {
return option[key];
}
else {
const keys = key.split('.');
let value = option;
for (let i = 0, len = keys.length; i < len; ++i) {
if (value == null) {
return null;
}
value = value[keys[i]];
}
return value;
}
}
mapItem(item, index) {
const label = isDefined(item.$ngOptionLabel) ? item.$ngOptionLabel : this.resolveNested(item, this._ngSelect.bindLabel);
const value = isDefined(item.$ngOptionValue) ? item.$ngOptionValue : item;
return {
index,
label: isDefined(label) ? label.toString() : '',
value,
disabled: item.disabled,
htmlId: `${this._ngSelect.dropdownId}-${index}`,
};
}
mapSelectedItems() {
const multiple = this._ngSelect.multiple;
for (const selected of this.selectedItems) {
const value = this._ngSelect.bindValue ? this.resolveNested(selected.value, this._ngSelect.bindValue) : selected.value;
const item = isDefined(value) ? this.findItem(value) : null;
this._selectionModel.unselect(selected, multiple);
this._selectionModel.select(item || selected, multiple, this._ngSelect.selectableGroupAsModel);
}
if (this._ngSelect.hideSelected) {
this._filteredItems = this.filteredItems.filter(x => this.selectedItems.indexOf(x) === -1);
}
}
_showSelected(item) {
this._filteredItems.push(item);
if (item.parent) {
const parent = item.parent;
const parentExists = this._filteredItems.find(x => x === parent);
if (!parentExists) {
this._filteredItems.push(parent);
}
}
else if (item.children) {
for (const child of item.children) {
child.selected = false;
this._filteredItems.push(child);
}
}
this._filteredItems = [...this._filteredItems.sort((a, b) => (a.index - b.index))];
}
_hideSelected(item) {
this._filteredItems = this._filteredItems.filter(x => x !== item);
if (item.parent) {
const children = item.parent.children;
if (children.every(x => x.selected)) {
this._filteredItems = this._filteredItems.filter(x => x !== item.parent);
}
}
else if (item.children) {
this._filteredItems = this.filteredItems.filter(x => x.parent !== item);
}
}
_defaultSearchFn(search, opt) {
const label = stripSpecialChars(opt.label).toLocaleLowerCase();
return label.indexOf(search) > -1;
}
_getNextItemIndex(steps) {
if (steps > 0) {
return (this._markedIndex >= this._filteredItems.length - 1) ? 0 : (this._markedIndex + 1);
}
return (this._markedIndex <= 0) ? (this._filteredItems.length - 1) : (this._markedIndex - 1);
}
_stepToItem(steps) {
if (this._filteredItems.length === 0 || this._filteredItems.every(x => x.disabled)) {
return;
}
this._markedIndex = this._getNextItemIndex(steps);
if (this.markedItem.disabled) {
this._stepToItem(steps);
}
}
_getLastMarkedIndex() {
if (this._ngSelect.hideSelected) {
return -1;
}
if (this._markedIndex > -1 && this.markedItem === undefined) {
return -1;
}
const selectedIndex = this._filteredItems.indexOf(this.lastSelectedItem);
if (this.lastSelectedItem && selectedIndex < 0) {
return -1;
}
return Math.max(this.markedIndex, selectedIndex);
}
_groupBy(items, prop) {
const groups = new Map();
if (items.length === 0) {
return groups;
}
// Check if items are already grouped by given key.
if (Array.isArray(items[0].value[prop])) {
for (const item of items) {
const children = (item.value[prop] || []).map((x, index) => this.mapItem(x, index));
groups.set(item, children);
}
return groups;
}
const isFnKey = isFunction(this._ngSelect.groupBy);
const keyFn = (item) => {
const key = isFnKey ? prop(item.value) : item.value[prop];
return isDefined(key) ? key : undefined;
};
// Group items by key.
for (const item of items) {
const key = keyFn(item);
const group = groups.get(key);
if (group) {
group.push(item);
}
else {
groups.set(key, [item]);
}
}
return groups;
}
_flatten(groups) {
const isGroupByFn = isFunction(this._ngSelect.groupBy);
const items = [];
for (const key of Array.from(groups.keys())) {
let i = items.length;
if (key === undefined) {
const withoutGroup = groups.get(undefined) || [];
items.push(...withoutGroup.map(x => {
x.index = i++;
return x;
}));
continue;
}
const isObjectKey = isObject(key);
const parent = {
label: isObjectKey ? '' : String(key),
children: undefined,
parent: null,
index: i++,
disabled: !this._ngSelect.selectableGroup,
htmlId: newId(),
};
const groupKey = isGroupByFn ? this._ngSelect.bindLabel : this._ngSelect.groupBy;
const groupValue = this._ngSelect.groupValue || (() => {
if (isObjectKey) {
return key.value;
}
return { [groupKey]: key };
});
const children = groups.get(key).map(x => {
x.parent = parent;
x.children = undefined;
x.index = i++;
return x;
});
parent.children = children;
parent.value = groupValue(key, children.map(x => x.value));
items.push(parent);
items.push(...children);
}
return items;
}
}
var KeyCode;
(function (KeyCode) {
KeyCode[KeyCode["Tab"] = 9] = "Tab";
KeyCode[KeyCode["Enter"] = 13] = "Enter";
KeyCode[KeyCode["Esc"] = 27] = "Esc";
KeyCode[KeyCode["Space"] = 32] = "Space";
KeyCode[KeyCode["ArrowUp"] = 38] = "ArrowUp";
KeyCode[KeyCode["ArrowDown"] = 40] = "ArrowDown";
KeyCode[KeyCode["Backspace"] = 8] = "Backspace";
})(KeyCode || (KeyCode = {}));
class NgDropdownPanelService {
constructor() {
this._dimensions = {
itemHeight: 0,
panelHeight: 0,
itemsPerViewport: 0
};
}
get dimensions() {
return this._dimensions;
}
calculateItems(scrollPos, itemsLength, buffer) {
const d = this._dimensions;
const scrollHeight = d.itemHeight * itemsLength;
const scrollTop = Math.max(0, scrollPos);
const indexByScrollTop = scrollTop / scrollHeight * itemsLength;
let end = Math.min(itemsLength, Math.ceil(indexByScrollTop) + (d.itemsPerViewport + 1));
const maxStartEnd = end;
const maxStart = Math.max(0, maxStartEnd - d.itemsPerViewport);
let start = Math.min(maxStart, Math.floor(indexByScrollTop));
let topPadding = d.itemHeight * Math.ceil(start) - (d.itemHeight * Math.min(start, buffer));
topPadding = !isNaN(topPadding) ? topPadding : 0;
start = !isNaN(start) ? start : -1;
end = !isNaN(end) ? end : -1;
start -= buffer;
start = Math.max(0, start);
end += buffer;
end = Math.min(itemsLength, end);
return {
topPadding,
scrollHeight,
start,
end
};
}
setDimensions(itemHeight, panelHeight) {
const itemsPerViewport = Math.max(1, Math.floor(panelHeight / itemHeight));
this._dimensions = {
itemHeight,
panelHeight,
itemsPerViewport
};
}
getScrollTo(itemTop, itemHeight, lastScroll) {
const { panelHeight } = this.dimensions;
const itemBottom = itemTop + itemHeight;
const top = lastScroll;
const bottom = top + panelHeight;
if (panelHeight >= itemBottom && lastScroll === itemTop) {
return null;
}
if (itemBottom > bottom) {
return top + itemBottom - bottom;
}
else if (itemTop <= top) {
return itemTop;
}
return null;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgDropdownPanelService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgDropdownPanelService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgDropdownPanelService, decorators: [{
type: Injectable
}] });
const CSS_POSITIONS = ['top', 'right', 'bottom', 'left'];
const SCROLL_SCHEDULER = typeof requestAnimationFrame !== 'undefined' ? animationFrameScheduler : asapScheduler;
class NgDropdownPanelComponent {
constructor(_renderer, _zone, _panelService, _elementRef, _document) {
this._renderer = _renderer;
this._zone = _zone;
this._panelService = _panelService;
this._document = _document;
this.items = [];
this.position = 'auto';
this.virtualScroll = false;
this.filterValue = null;
this.update = new EventEmitter();
this.scroll = new EventEmitter();
this.scrollToEnd = new EventEmitter();
this.outsideClick = new EventEmitter();
this._destroy$ = new Subject();
this._scrollToEndFired = false;
this._updateScrollHeight = false;
this._lastScrollPosition = 0;
this._dropdown = _elementRef.nativeElement;
}
get currentPosition() {
return this._currentPosition;
}
get itemsLength() {
return this._itemsLength;
}
set itemsLength(value) {
if (value !== this._itemsLength) {
this._itemsLength = value;
this._onItemsLengthChanged();
}
}
get _startOffset() {
if (this.markedItem) {
const { itemHeight, panelHeight } = this._panelService.dimensions;
const offset = this.markedItem.index * itemHeight;
return panelHeight > offset ? 0 : offset;
}
return 0;
}
ngOnInit() {
this._select = this._dropdown.parentElement;
this._virtualPadding = this.paddingElementRef.nativeElement;
this._scrollablePanel = this.scrollElementRef.nativeElement;
this._contentPanel = this.contentElementRef.nativeElement;
this._handleScroll();
this._handleOutsideClick();
this._appendDropdown();
this._setupMousedownListener();
}
ngOnChanges(changes) {
if (changes.items) {
const change = changes.items;
this._onItemsChange(change.currentValue, change.firstChange);
}
}
ngOnDestroy() {
this._destroy$.next();
this._destroy$.complete();
this._destroy$.unsubscribe();
if (this.appendTo) {
this._renderer.removeChild(this._dropdown.parentNode, this._dropdown);
}
}
scrollTo(option, startFromOption = false) {
if (!option) {
return;
}
const index = this.items.indexOf(option);
if (index < 0 || index >= this.itemsLength) {
return;
}
let scrollTo;
if (this.virtualScroll) {
const itemHeight = this._panelService.dimensions.itemHeight;
scrollTo = this._panelService.getScrollTo(index * itemHeight, itemHeight, this._lastScrollPosition);
}
else {
const item = this._dropdown.querySelector(`#${option.htmlId}`);
const lastScroll = startFromOption ? item.offsetTop : this._lastScrollPosition;
scrollTo = this._panelService.getScrollTo(item.offsetTop, item.clientHeight, lastScroll);
}
if (isDefined(scrollTo)) {
this._scrollablePanel.scrollTop = scrollTo;
}
}
scrollToTag() {
const panel = this._scrollablePanel;
panel.scrollTop = panel.scrollHeight - panel.clientHeight;
}
adjustPosition() {
this._updateYPosition();
}
_handleDropdownPosition() {
this._currentPosition = this._calculateCurrentPosition(this._dropdown);
if (CSS_POSITIONS.includes(this._currentPosition)) {
this._updateDropdownClass(this._currentPosition);
}
else {
this._updateDropdownClass('bottom');
}
if (this.appendTo) {
this._updateYPosition();
}
this._dropdown.style.opacity = '1';
}
_updateDropdownClass(currentPosition) {
CSS_POSITIONS.forEach((position) => {
const REMOVE_CSS_CLASS = `ng-select-${position}`;
this._renderer.removeClass(this._dropdown, REMOVE_CSS_CLASS);
this._renderer.removeClass(this._select, REMOVE_CSS_CLASS);
});
const ADD_CSS_CLASS = `ng-select-${currentPosition}`;
this._renderer.addClass(this._dropdown, ADD_CSS_CLASS);
this._renderer.addClass(this._select, ADD_CSS_CLASS);
}
_handleScroll() {
this._zone.runOutsideAngular(() => {
fromEvent(this.scrollElementRef.nativeElement, 'scroll')
.pipe(takeUntil(this._destroy$), auditTime(0, SCROLL_SCHEDULER))
.subscribe((e) => {
const path = e.path || (e.composedPath && e.composedPath());
if (!path || path.length === 0 && !e.target) {
return;
}
const scrollTop = !path || path.length === 0 ? e.target.scrollTop : path[0].scrollTop;
this._onContentScrolled(scrollTop);
});
});
}
_handleOutsideClick() {
if (!this._document) {
return;
}
this._zone.runOutsideAngular(() => {
merge(fromEvent(this._document, 'touchstart', { capture: true }), fromEvent(this._document, 'click', { capture: true })).pipe(takeUntil(this._destroy$))
.subscribe($event => this._checkToClose($event));
});
}
_checkToClose($event) {
if (this._select.contains($event.target) || this._dropdown.contains($event.target)) {
return;
}
const path = $event.path || ($event.composedPath && $event.composedPath());
if ($event.target && $event.target.shadowRoot && path && path[0] && this._select.contains(path[0])) {
return;
}
this._zone.run(() => this.outsideClick.emit());
}
_onItemsChange(items, firstChange) {
this.items = items || [];
this._scrollToEndFired = false;
this.itemsLength = items.length;
if (this.virtualScroll) {
this._updateItemsRange(firstChange);
}
else {
this._setVirtualHeight();
this._updateItems(firstChange);
}
}
_updateItems(firstChange) {
this.update.emit(this.items);
if (firstChange === false) {
return;
}
this._zone.runOutsideAngular(() => {
Promise.resolve().then(() => {
const panelHeight = this._scrollablePanel.clientHeight;
this._panelService.setDimensions(0, panelHeight);
this._handleDropdownPosition();
this.scrollTo(this.markedItem, firstChange);
});
});
}
_updateItemsRange(firstChange) {
this._zone.runOutsideAngular(() => {
this._measureDimensions().then(() => {
if (firstChange) {
this._renderItemsRange(this._startOffset);
this._handleDropdownPosition();
}
else {
this._renderItemsRange();
}
});
});
}
_onContentScrolled(scrollTop) {
if (this.virtualScroll) {
this._renderItemsRange(scrollTop);
}
this._lastScrollPosition = scrollTop;
this._fireScrollToEnd(scrollTop);
}
_updateVirtualHeight(height) {
if (this._updateScrollHeight) {
this._virtualPadding.style.height = `${height}px`;
this._updateScrollHeight = false;
}
}
_setVirtualHeight() {
if (!this._virtualPadding) {
return;
}
this._virtualPadding.style.height = `0px`;
}
_onItemsLengthChanged() {
this._updateScrollHeight = true;
}
_renderItemsRange(scrollTop = null) {
if (scrollTop && this._lastScrollPosition === scrollTop) {
return;
}
scrollTop = scrollTop || this._scrollablePanel.scrollTop;
const range = this._panelService.calculateItems(scrollTop, this.itemsLength, this.bufferAmount);
this._updateVirtualHeight(range.scrollHeight);
this._contentPanel.style.transform = `translateY(${range.topPadding}px)`;
this._zone.run(() => {
this.update.emit(this.items.slice(range.start, range.end));
this.scroll.emit({ start: range.start, end: range.end });
});
if (isDefined(scrollTop) && this._lastScrollPosition === 0) {
this._scrollablePanel.scrollTop = scrollTop;
this._lastScrollPosition = scrollTop;
}
}
_measureDimensions() {
if (this._panelService.dimensions.itemHeight > 0 || this.itemsLength === 0) {
return Promise.resolve(this._panelService.dimensions);
}
const [first] = this.items;
this.update.emit([first]);
return Promise.resolve().then(() => {
const option = this._dropdown.querySelector(`#${first.htmlId}`);
const optionHeight = option.clientHeight;
this._virtualPadding.style.height = `${optionHeight * this.itemsLength}px`;
const panelHeight = this._scrollablePanel.clientHeight;
this._panelService.setDimensions(optionHeight, panelHeight);
return this._panelService.dimensions;
});
}
_fireScrollToEnd(scrollTop) {
if (this._scrollToEndFired || scrollTop === 0) {
return;
}
const padding = this.virtualScroll ?
this._virtualPadding :
this._contentPanel;
if (scrollTop + this._dropdown.clientHeight >= padding.clientHeight - 1) {
this._zone.run(() => this.scrollToEnd.emit());
this._scrollToEndFired = true;
}
}
_calculateCurrentPosition(dropdownEl) {
if (this.position !== 'auto') {
return this.position;
}
const selectRect = this._select.getBoundingClientRect();
const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
const offsetTop = selectRect.top + window.pageYOffset;
const height = selectRect.height;
const dropdownHeight = dropdownEl.getBoundingClientRect().height;
if (offsetTop + height + dropdownHeight > scrollTop + document.documentElement.clientHeight) {
return 'top';
}
else {
return 'bottom';
}
}
_appendDropdown() {
if (!this.appendTo) {
return;
}
this._parent = document.querySelector(this.appendTo);
if (!this._parent) {
throw new Error(`appendTo selector ${this.appendTo} did not found any parent element`);
}
this._updateXPosition();
this._parent.appendChild(this._dropdown);
}
_updateXPosition() {
const select = this._select.getBoundingClientRect();
const parent = this._parent.getBoundingClientRect();
const offsetLeft = select.left - parent.left;
this._dropdown.style.left = offsetLeft + 'px';
this._dropdown.style.width = select.width + 'px';
this._dropdown.style.minWidth = select.width + 'px';
}
_updateYPosition() {
const select = this._select.getBoundingClientRect();
const parent = this._parent.getBoundingClientRect();
const delta = select.height;
if (this._currentPosition === 'top') {
const offsetBottom = parent.bottom - select.bottom;
this._dropdown.style.bottom = offsetBottom + delta + 'px';
this._dropdown.style.top = 'auto';
}
else if (this._currentPosition === 'bottom') {
const offsetTop = select.top - parent.top;
this._dropdown.style.top = offsetTop + delta + 'px';
this._dropdown.style.bottom = 'auto';
}
}
_setupMousedownListener() {
this._zone.runOutsideAngular(() => {
fromEvent(this._dropdown, 'mousedown')
.pipe(takeUntil(this._destroy$))
.subscribe((event) => {
const target = event.target;
if (target.tagName === 'INPUT') {
return;
}
event.preventDefault();
});
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgDropdownPanelComponent, deps: [{ token: i0.Renderer2 }, { token: i0.NgZone }, { token: NgDropdownPanelService }, { token: i0.ElementRef }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: NgDropdownPanelComponent, selector: "ng-dropdown-panel", inputs: { items: "items", markedItem: "markedItem", position: "position", appendTo: "appendTo", bufferAmount: "bufferAmount", virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], headerTemplate: "headerTemplate", footerTemplate: "footerTemplate", filterValue: "filterValue" }, outputs: { update: "update", scroll: "scroll", scrollToEnd: "scrollToEnd", outsideClick: "outsideClick" }, viewQueries: [{ propertyName: "contentElementRef", first: true, predicate: ["content"], descendants: true, read: ElementRef, static: true }, { propertyName: "scrollElementRef", first: true, predicate: ["scroll"], descendants: true, read: ElementRef, static: true }, { propertyName: "paddingElementRef", first: true, predicate: ["padding"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
@if (headerTemplate) {
<div class="ng-dropdown-header">
<ng-container [ngTemplateOutlet]="headerTemplate" [ngTemplateOutletContext]="{ searchTerm: filterValue }"></ng-container>
</div>
}
<div #scroll role="listbox" class="ng-dropdown-panel-items scroll-host">
<div #padding [class.total-padding]="virtualScroll"></div>
<div #content [class.scrollable-content]="virtualScroll && items.length">
<ng-content></ng-content>
</div>
</div>
@if (footerTemplate) {
<div class="ng-dropdown-footer">
<ng-container [ngTemplateOutlet]="footerTemplate" [ngTemplateOutletContext]="{ searchTerm: filterValue }"></ng-container>
</div>
}
`, isInline: true, dependencies: [{ kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgDropdownPanelComponent, decorators: [{
type: Component,
args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
selector: 'ng-dropdown-panel',
template: `
@if (headerTemplate) {
<div class="ng-dropdown-header">
<ng-container [ngTemplateOutlet]="headerTemplate" [ngTemplateOutletContext]="{ searchTerm: filterValue }"></ng-container>
</div>
}
<div #scroll role="listbox" class="ng-dropdown-panel-items scroll-host">
<div #padding [class.total-padding]="virtualScroll"></div>
<div #content [class.scrollable-content]="virtualScroll && items.length">
<ng-content></ng-content>
</div>
</div>
@if (footerTemplate) {
<div class="ng-dropdown-footer">
<ng-container [ngTemplateOutlet]="footerTemplate" [ngTemplateOutletContext]="{ searchTerm: filterValue }"></ng-container>
</div>
}
`
}]
}], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.NgZone }, { type: NgDropdownPanelService }, { type: i0.ElementRef }, { type: undefined, decorators: [{
type: Optional
}, {
type: Inject,
args: [DOCUMENT]
}] }], propDecorators: { items: [{
type: Input
}], markedItem: [{
type: Input
}], position: [{
type: Input
}], appendTo: [{
type: Input
}], bufferAmount: [{
type: Input
}], virtualScroll: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], headerTemplate: [{
type: Input
}], footerTemplate: [{
type: Input
}], filterValue: [{
type: Input
}], update: [{
type: Output
}], scroll: [{
type: Output
}], scrollToEnd: [{
type: Output
}], outsideClick: [{
type: Output
}], contentElementRef: [{
type: ViewChild,
args: ['content', { read: ElementRef, static: true }]
}], scrollElementRef: [{
type: ViewChild,
args: ['scroll', { read: ElementRef, static: true }]
}], paddingElementRef: [{
type: ViewChild,
args: ['padding', { read: ElementRef, static: true }]
}] } });
class NgOptionComponent {
constructor(elementRef) {
this.elementRef = elementRef;
this.disabled = false;
this.stateChange$ = new Subject();
}
get label() {
return (this.elementRef.nativeElement.textContent || '').trim();
}
ngOnChanges(changes) {
if (changes.disabled) {
this.stateChange$.next({
value: this.value,
disabled: this.disabled
});
}
}
ngAfterViewChecked() {
if (this.label !== this._previousLabel) {
this._previousLabel = this.label;
this.stateChange$.next({
value: this.value,
disabled: this.disabled,
label: this.elementRef.nativeElement.innerHTML
});
}
}
ngOnDestroy() {
this.stateChange$.complete();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgOptionComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: NgOptionComponent, selector: "ng-option", inputs: { value: "value", disabled: ["disabled", "disabled", booleanAttribute] }, usesOnChanges: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgOptionComponent, decorators: [{
type: Component,
args: [{
selector: 'ng-option',
changeDetection: ChangeDetectionStrategy.OnPush,
template: `<ng-content></ng-content>`
}]
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { value: [{
type: Input
}], disabled: [{
type: Input,
args: [{ transform: booleanAttribute }]
}] } });
class NgSelectConfig {
constructor() {
this.notFoundText = 'No items found';
this.typeToSearchText = 'Type to search';
this.addTagText = 'Add item';
this.loadingText = 'Loading...';
this.clearAllText = 'Clear all';
this.disableVirtualScroll = true;
this.openOnEnter = true;
this.appearance = 'underline';
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectConfig, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectConfig, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}] });
class ConsoleService {
warn(message) {
console.warn(message);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ConsoleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ConsoleService, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ConsoleService, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}] });
const SELECTION_MODEL_FACTORY = new InjectionToken('ng-select-selection-model');
class NgSelectComponent {
get items() { return this._items; }
;
set items(value) {
this._itemsAreUsed = true;
this._items = value ?? [];
}
;
get compareWith() { return this._compareWith; }
set compareWith(fn) {
if (fn !== undefined && fn !== null && !isFunction(fn)) {
throw Error('`compareWith` must be a function.');
}
this._compareWith = fn;
}
get clearSearchOnAdd() {
if (isDefined(this._clearSearchOnAdd)) {
return this._clearSearchOnAdd;
}
else if (isDefined(this.config.clearSearchOnAdd)) {
return this.config.clearSearchOnAdd;
}
return this.closeOnSelect;
}
;
set clearSearchOnAdd(value) {
this._clearSearchOnAdd = value;
}
;
get deselectOnClick() {
if (isDefined(this._deselectOnClick)) {
return this._deselectOnClick;
}
else if (isDefined(this.config.deselectOnClick)) {
return this.config.deselectOnClick;
}
return this.multiple;
}
;
set deselectOnClick(value) {
this._deselectOnClick = value;
}
;
get disabled() { return this.readonly || this._disabled; }
;
get filtered() { return (!!this.searchTerm && this.searchable || this._isComposing); }
;
get single() { return !this.multiple; }
;
get _editableSearchTerm() {
return this.editableSearchTerm && !this.multiple;
}
constructor(classes, autoFocus, config, newSelectionModel, _elementRef, _cd, _console) {
this.classes = classes;
this.autoFocus = autoFocus;
this.config = config;
this._cd = _cd;
this._console = _console;
this.markFirst = true;
this.dropdownPosition = 'auto';
this.loading = false;
this.closeOnSelect = true;
this.hideSelected = false;
this.selectOnTab = false;
this.bufferAmount = 4;
this.selectableGroup = false;
this.selectableGroupAsModel = true;
this.searchFn = null;
this.trackByFn = null;
this.clearOnBackspace = true;
this.labelForId = null;
this.inputAttrs = {};
this.readonly = false;
this.searchWhileComposing = true;
this.minTermLength = 0;
this.editableSearchTerm = false;
this.keyDownFn = (_) => true;
this.multiple = false;
this.addTag = false;
this.searchable = true;
this.clearable = true;
this.isOpen = false;
// output events
this.blurEvent = new EventEmitter();
this.focusEvent = new EventEmitter();
this.changeEvent = new EventEmitter();
this.openEvent = new EventEmitter();
this.closeEvent = new EventEmitter();
this.searchEvent = new EventEmitter();
this.clearEvent = new EventEmitter();
this.addEvent = new EventEmitter();
this.removeEvent = new EventEmitter();
this.scroll = new EventEmitter();
this.scrollToEnd = new EventEmitter();
this.useDefaultClass = true;
this.viewPortItems = [];
this.searchTerm = null;
this.dropdownId = newId();
this.escapeHTML = true;
this._items = [];
this._defaultLabel = 'label';
this._pressedKeys = [];
this._isComposing = false;
this._destroy$ = new Subject();
this._keyPress$ = new Subject();
this._onChange = (_) => { };
this._onTouched = () => { };
this.clearItem = (item) => {
const option = this.selectedItems.find(x => x.value === item);
this.unselect(option);
};
this.trackByOption = (_, item) => {
if (this.trackByFn) {
return this.trackByFn(item.value);
}
return item;
};
this._mergeGlobalConfig(config);
this.itemsList = new ItemsList(this, newSelectionModel());
this.element = _elementRef.nativeElement;
}
get selectedItems() {
return this.itemsList.selectedItems;
}
get selectedValues() {
return this.selectedItems.map(x => x.value);
}
get hasValue() {
return this.selectedItems.length > 0;
}
get currentPanelPosition() {
if (this.dropdownPanel) {
return this.dropdownPanel.currentPosition;
}
return undefined;
}
ngOnInit() {
this._handleKeyPresses();
this._setInputAttributes();
}
ngOnChanges(changes) {
if (changes.multiple) {
this.itemsList.clearSelected();
}
if (changes.items) {
this._setItems(changes.items.currentValue || []);
}
if (changes.isOpen) {
this._manualOpen = isDefined(changes.isOpen.currentValue);
}
}
ngAfterViewInit() {
if (!this._itemsAreUsed) {
this.escapeHTML = false;
this._setItemsFromNgOptions();
}
if (isDefined(this.autoFocus)) {
this.focus();
}
}
ngOnDestroy() {
this._destroy$.next();
this._destroy$.complete();
}
handleKeyDown($event) {
const keyCode = KeyCode[$event.which];
if (keyCode) {
if (this.keyDownFn($event) === false) {
return;
}
this.handleKeyCode($event);
}
else if ($event.key && $event.key.length === 1) {
this._keyPress$.next($event.key.toLocaleLowerCase());
}
}
handleKeyCode($event) {
const target = $event.target;
if (this.clearButton && this.clearButton.nativeElement === target) {
this.handleKeyCodeClear($event);
}
else {
this.handleKeyCodeInput($event);
}
}
handleKeyCodeInput($event) {
switch ($event.which) {
case KeyCode.ArrowDown:
this._handleArrowDown($event);
break;
case KeyCode.ArrowUp:
this._handleArrowUp($event);
break;
case KeyCode.Space:
this._handleSpace($event);
break;
case KeyCode.Enter:
this._handleEnter($event);
break;
case KeyCode.Tab:
this._handleTab($event);
break;
case KeyCode.Esc:
this.close();
$event.preventDefault();
break;
case KeyCode.Backspace:
this._handleBackspace();
break;
}
}
handleKeyCodeClear($event) {
switch ($event.which) {
case KeyCode.Enter:
this.handleClearClick();
$event.preventDefault();
break;
}
}
handleMousedown($event) {
const target = $event.target;
if (target.tagName !== 'INPUT') {
$event.preventDefault();
}
if (target.classList.contains('ng-clear-wrapper')) {
this.handleClearClick();
return;
}
if (target.classList.contains('ng-arrow-wrapper')) {
this.handleArrowClick();
return;
}
if (target.classList.contains('ng-value-icon')) {
return;
}
if (!this.focused) {
this.focus();
}
if (this.searchable) {
this.open();
}
else {
this.toggle();
}
}
handleArrowClick() {
if (this.isOpen) {
this.close();
}
else {
this.open();
}
}
handleClearClick() {
if (this.hasValue) {
this.itemsList.clearSelected(true);
this._updateNgModel();
}
this._clearSearch();
this.focus();
this.clearEvent.emit();
this._onSelectionChanged();
}
clearModel() {
if (!this.clearable) {
return;
}
this.itemsList.clearSelected();
this._updateNgModel();
}
writeValue(value) {
this.itemsList.clearSelected();
this._handleWriteValue(value);
this._cd.markForCheck();
}
registerOnChange(fn) {
this._onChange = fn;
}
registerOnTouched(fn) {
this._onTouched = fn;
}
setDisabledState(state) {
this._disabled = state;
this._cd.markForCheck();
}
toggle() {
if (!this.isOpen) {
this.open();
}
else {
this.close();
}
}
open() {
if (this.disabled || this.isOpen || this._manualOpen) {
return;
}
if (!this._isTypeahead && !this.addTag && this.itemsList.noItemsToSelect) {
return;
}
this.isOpen = true;
this.itemsList.markSelectedOrDefault(this.markFirst);
this.openEvent.emit();
if (!this.searchTerm) {
this.focus();
}
this.detectChanges();
}
close() {
if (!this.isOpen || this._manualOpen) {
return;
}
this.isOpen = false;
this._isComposing = false;
if (!this._editableSearchTerm) {
this._clearSearch();
}
else {
this.itemsList.resetFilteredItems();
}
this.itemsList.unmarkItem();
this._onTouched();
this.closeEvent.emit();
this._cd.markForCheck();
}
toggleItem(item) {
if (!item || item.disabled || this.disabled) {
return;
}
if (this.deselectOnClick && item.selected) {
this.unselect(item);
}
else {
this.select(item);
}
if (this._editableSearchTerm) {
this._setSearchTermFromItems();
}
this._onSelectionChanged();
}
select(item) {
if (!item.selected) {
this.itemsList.select(item);
if (this.clearSearchOnAdd && !this._editableSearchTerm) {
this._clearSearch();
}
this._updateNgModel();
if (this.multiple) {
this.addEvent.emit(item.value);
}
}
if (this.closeOnSelect || this.itemsList.noItemsToSelect) {
this.close();
}
}
focus() {
this.searchInput.nativeElement.focus();
}
blur() {
this.searchInput.nativeElement.blur();
}
unselect(item) {
if (!item) {
return;
}
this.itemsList.unselect(item);
this.focus();
this._updateNgModel();
this.removeEvent.emit(item.value);
}
selectTag() {
let tag;
if (isFunction(this.addTag)) {
tag = this.addTag(this.searchTerm);
}
else {
tag = this._primitive ? this.searchTerm : { [this.bindLabel]: this.searchTerm };
}
const handleTag = (item) => this._isTypeahead || !this.isOpen ? this.itemsList.mapItem(item, null) : this.itemsList.addItem(item);
if (isPromise(tag)) {
tag.then(item => this.select(handleTag(item))).catch(() => { });
}
else if (tag) {
this.select(handleTag(tag));
}
}
showClear() {
return this.clearable && (this.hasValue || this.searchTerm) && !this.disabled;
}
focusOnClear() {
this.blur();
if (this.clearButton) {
this.clearButton.nativeElement.focus();
}
}
get showAddTag() {
if (!this._validTerm) {
return false;
}
const term = this.searchTerm.toLowerCase().trim();
return this.addTag &&
(!this.itemsList.filteredItems.some(x => x.label.toLowerCase() === term) &&
(!this.hideSelected && this.isOpen || !this.selectedItems.some(x => x.label.toLowerCase() === term))) &&
!this.loading;
}
showNoItemsFound() {
const empty = this.itemsList.filteredItems.length === 0;
return ((empty && !this._isTypeahead && !this.loading) ||
(empty && this._isTypeahead && this._validTerm && !this.loading)) &&
!this.showAddTag;
}
showTypeToSearch() {
const empty = this.itemsList.filteredItems.length === 0;
return empty && this._isTypeahead && !this._validTerm && !this.loading;
}
onCompositionStart() {
this._isComposing = true;
}
onCompositionEnd(term) {
this._isComposing = false;
if (this.searchWhileComposing) {
return;
}
this.filter(term);
}
filter(term) {
if (this._isComposing && !this.searchWhileComposing) {
return;
}
this.searchTerm = term;
if (this._isTypeahead && (this._validTerm || this.minTermLength === 0)) {
this.typeahead.next(term);
}
if (!this._isTypeahead) {
this.itemsList.filter(this.searchTerm);
if (this.isOpen) {
this.itemsList.markSelectedOrDefault(this.markFirst);
}
}
this.searchEvent.emit({ term, items: this.itemsList.filteredItems.map(x => x.value) });
this.open();
}
onInputFocus($event) {
if (this.focused) {
return;
}
if (this._editableSearchTerm) {
this._setSearchTermFromItems();
}
this.element.classList.add('ng-select-focused');
this.focusEvent.emit($event);
this.focused = true;
}
onInputBlur($event) {
this.element.classList.remove('ng-select-focused');
this.blurEvent.emit($event);
if (!this.isOpen && !this.disabled) {
this._onTouched();
}
if (this._editableSearchTerm) {
this._setSearchTermFromItems();
}
this.focused = false;
}
onItemHover(item) {
if (item.disabled) {
return;
}
this.itemsList.markItem(item);
}
detectChanges() {
if (!this._cd.destroyed) {
this._cd.detectChanges();
}
}
_setSearchTermFromItems() {
const selected = this.selectedItems && this.selectedItems[0];
this.searchTerm = (selected && selected.label) || null;
}
_setItems(items) {
const firstItem = items[0];
this.bindLabel = this.bindLabel || this._defaultLabel;
this._primitive = isDefined(firstItem) ? !isObject(firstItem) : this._primitive || this.bindLabel === this._defaultLabel;
this.itemsList.setItems(items);
if (items.length > 0 && this.hasValue) {
this.itemsList.mapSelectedItems();
}
if (this.isOpen && isDefined(this.searchTerm) && !this._isTypeahead) {
this.itemsList.filter(this.searchTerm);
}
if (this._isTypeahead || this.isOpen) {
this.itemsList.markSelectedOrDefault(this.markFirst);
}
}
_setItemsFromNgOptions() {
const mapNgOptions = (options) => {
this.items = options.map(option => ({
$ngOptionValue: option.value,
$ngOptionLabel: option.elementRef.nativeElement.innerHTML,
disabled: option.disabled
}));
this.itemsList.setItems(this.items);
if (this.hasValue) {
this.itemsList.mapSelectedItems();
}
this.detectChanges();
};
const handleOptionChange = () => {
const changedOrDestroyed = merge(this.ngOptions.changes, this._destroy$);
merge(...this.ngOptions.map(option => option.stateChange$))
.pipe(takeUntil(changedOrDestroyed))
.subscribe(option => {
const item = this.itemsList.findItem(option.value);
item.disabled = option.disabled;
item.label = option.label || item.label;
this._cd.detectChanges();
});
};
this.ngOptions.changes
.pipe(startWith(this.ngOptions), takeUntil(this._destroy$))
.subscribe(options => {
this.bindLabel = this._defaultLabel;
mapNgOptions(options);
handleOptionChange();
});
}
_isValidWriteValue(value) {
if (!isDefined(value) || (this.multiple && value === '') || Array.isArray(value) && value.length === 0) {
return false;
}
const validateBinding = (item) => {
if (!isDefined(this.compareWith) && isObject(item) && this.bindValue) {
this._console.warn(`Setting object(${JSON.stringify(item)}) as your model with bindValue is not allowed unless [compareWith] is used.`);
return false;
}
return true;
};
if (this.multiple) {
if (!Array.isArray(value)) {
this._console.warn('Multiple select ngModel should be array.');
return false;
}
return value.every(item => validateBinding(item));
}
else {
return validateBinding(value);
}
}
_handleWriteValue(ngModel) {
if (!this._isValidWriteValue(ngModel)) {
return;
}
const select = (val) => {
let item = this.itemsList.findItem(val);
if (item) {
this.itemsList.select(item);
}
else {
const isValObject = isObject(val);
const isPrimitive = !isValObject && !this.bindValue;
if ((isValObject || isPrimitive)) {
this.itemsList.select(this.itemsList.mapItem(val, null));
}
else if (this.bindValue) {
item = {
[this.bindLabel]: null,
[this.bindValue]: val
};
this.itemsList.select(this.itemsList.mapItem(item, null));
}
}
};
if (this.multiple) {
ngModel.forEach(item => select(item));
}
else {
select(ngModel);
}
}
_handleKeyPresses() {
if (this.searchable) {
return;
}
this._keyPress$
.pipe(takeUntil(this._destroy$), tap(letter => this._pressedKeys.push(letter)), debounceTime(200), filter(() => this._pressedKeys.length > 0), map(() => this._pressedKeys.join('')))
.subscribe(term => {
const item = this.itemsList.findByLabel(term);
if (item) {
if (this.isOpen) {
this.itemsList.markItem(item);
this._scrollToMarked();
this._cd.markForCheck();
}
else {
this.select(item);
}
}
this._pressedKeys = [];
});
}
_setInputAttributes() {
const input = this.searchInput.nativeElement;
const attributes = {
type: 'text',
autocorrect: 'off',
autocapitalize: 'off',
autocomplete: this.labelForId ? 'off' : this.dropdownId,
...this.inputAttrs
};
for (const key of Object.keys(attributes)) {
input.setAttribute(key, attributes[key]);
}
}
_updateNgModel() {
const model = [];
for (const item of this.selectedItems) {
if (this.bindValue) {
let value = null;
if (item.children) {
const groupKey = this.groupValue ? this.bindValue : this.groupBy;
value = item.value[groupKey || this.groupBy];
}
else {
value = this.itemsList.resolveNested(item.value, this.bindValue);
}
model.push(value);
}
else {
model.push(item.value);
}
}
const selected = this.selectedItems.map(x => x.value);
if (this.multiple) {
this._onChange(model);
this.changeEvent.emit(selected);
}
else {
this._onChange(isDefined(model[0]) ? model[0] : null);
this.changeEvent.emit(selected[0]);
}
this._cd.markForCheck();
}
_clearSearch() {
if (!this.searchTerm) {
return;
}
this._changeSearch(null);
this.itemsList.resetFilteredItems();
}
_changeSearch(searchTerm) {
this.searchTerm = searchTerm;
if (this._isTypeahead) {
this.typeahead.next(searchTerm);
}
}
_scrollToMarked() {
if (!this.isOpen || !this.dropdownPanel) {
return;
}
this.dropdownPanel.scrollTo(this.itemsList.markedItem);
}
_scrollToTag() {
if (!this.isOpen || !this.dropdownPanel) {
return;
}
this.dropdownPanel.scrollToTag();
}
_onSelectionChanged() {
if (this.isOpen && this.deselectOnClick && this.appendTo) {
// Make sure items are rendered.
this._cd.detectChanges();
this.dropdownPanel.adjustPosition();
}
}
_handleTab($event) {
if (this.isOpen === false) {
if (this.showClear() && !$event.shiftKey) {
this.focusOnClear();
$event.preventDefault();
}
else if (!this.addTag) {
return;
}
}
if (this.selectOnTab) {
if (this.itemsList.markedItem) {
this.toggleItem(this.itemsList.markedItem);
$event.preventDefault();
}
else if (this.showAddTag) {
this.selectTag();
$event.preventDefault();
}
else {
this.close();
}
}
else {
this.close();
}
}
_handleEnter($event) {
if (this.isOpen || this._manualOpen) {
if (this.itemsList.markedItem) {
this.toggleItem(this.itemsList.markedItem);
}
else if (this.showAddTag) {
this.selectTag();
}
}
else if (this.openOnEnter) {
this.open();
}
else {
return;
}
$event.preventDefault();
}
_handleSpace($event) {
if (this.isOpen || this._manualOpen) {
return;
}
this.open();
$event.preventDefault();
}
_handleArrowDown($event) {
if (this._nextItemIsTag(+1)) {
this.itemsList.unmarkItem();
this._scrollToTag();
}
else {
this.itemsList.markNextItem();
this._scrollToMarked();
}
this.open();
$event.preventDefault();
}
_handleArrowUp($event) {
if (!this.isOpen) {
return;
}
if (this._nextItemIsTag(-1)) {
this.itemsList.unmarkItem();
this._scrollToTag();
}
else {
this.itemsList.markPreviousItem();
this._scrollToMarked();
}
$event.preventDefault();
}
_nextItemIsTag(nextStep) {
const nextIndex = this.itemsList.markedIndex + nextStep;
return this.addTag && this.searchTerm
&& this.itemsList.markedItem
&& (nextIndex < 0 || nextIndex === this.itemsList.filteredItems.length);
}
_handleBackspace() {
if (this.searchTerm || !this.clearable || !this.clearOnBackspace || !this.hasValue) {
return;
}
if (this.multiple) {
this.unselect(this.itemsList.lastSelectedItem);
}
else {
this.clearModel();
}
}
get _isTypeahead() {
return this.typeahead && this.typeahead.observers.length > 0;
}
get _validTerm() {
const term = this.searchTerm && this.searchTerm.trim();
return term && term.length >= this.minTermLength;
}
_mergeGlobalConfig(config) {
this.placeholder = this.placeholder || config.placeholder;
this.notFoundText = this.notFoundText || config.notFoundText;
this.typeToSearchText = this.typeToSearchText || config.typeToSearchText;
this.addTagText = this.addTagText || config.addTagText;
this.loadingText = this.loadingText || config.loadingText;
this.clearAllText = this.clearAllText || config.clearAllText;
this.virtualScroll = isDefined(this.virtualScroll)
? this.virtualScroll
: isDefined(config.disableVirtualScroll) ? !config.disableVirtualScroll : false;
this.openOnEnter = isDefined(this.openOnEnter) ? this.openOnEnter : config.openOnEnter;
this.appendTo = this.appendTo || config.appendTo;
this.bindValue = this.bindValue || config.bindValue;
this.bindLabel = this.bindLabel || config.bindLabel;
this.appearance = this.appearance || config.appearance;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectComponent, deps: [{ token: 'class', attribute: true }, { token: 'autofocus', attribute: true }, { token: NgSelectConfig }, { token: SELECTION_MODEL_FACTORY }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: ConsoleService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: NgSelectComponent, selector: "ng-select", inputs: { bindLabel: "bindLabel", bindValue: "bindValue", markFirst: ["markFirst", "markFirst", booleanAttribute], placeholder: "placeholder", notFoundText: "notFoundText", typeToSearchText: "typeToSearchText", addTagText: "addTagText", loadingText: "loadingText", clearAllText: "clearAllText", appearance: "appearance", dropdownPosition: "dropdownPosition", appendTo: "appendTo", loading: ["loading", "loading", booleanAttribute], closeOnSelect: ["closeOnSelect", "closeOnSelect", booleanAttribute], hideSelected: ["hideSelected", "hideSelected", booleanAttribute], selectOnTab: ["selectOnTab", "selectOnTab", booleanAttribute], openOnEnter: ["openOnEnter", "openOnEnter", booleanAttribute], maxSelectedItems: ["maxSelectedItems", "maxSelectedItems", numberAttribute], groupBy: "groupBy", groupValue: "groupValue", bufferAmount: ["bufferAmount", "bufferAmount", numberAttribute], virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], selectableGroup: ["selectableGroup", "selectableGroup", booleanAttribute], selectableGroupAsModel: ["selectableGroupAsModel", "selectableGroupAsModel", booleanAttribute], searchFn: "searchFn", trackByFn: "trackByFn", clearOnBackspace: ["clearOnBackspace", "clearOnBackspace", booleanAttribute], labelForId: "labelForId", inputAttrs: "inputAttrs", tabIndex: ["tabIndex", "tabIndex", numberAttribute], readonly: ["readonly", "readonly", booleanAttribute], searchWhileComposing: ["searchWhileComposing", "searchWhileComposing", booleanAttribute], minTermLength: ["minTermLength", "minTermLength", numberAttribute], editableSearchTerm: ["editableSearchTerm", "editableSearchTerm", booleanAttribute], keyDownFn: "keyDownFn", typeahead: "typeahead", multiple: ["multiple", "multiple", booleanAttribute], addTag: "addTag", searchable: ["searchable", "searchable", booleanAttribute], clearable: ["clearable", "clearable", booleanAttribute], isOpen: ["isOpen", "isOpen", booleanAttribute], items: "items", compareWith: "compareWith", clearSearchOnAdd: "clearSearchOnAdd", deselectOnClick: "deselectOnClick" }, outputs: { blurEvent: "blur", focusEvent: "focus", changeEvent: "change", openEvent: "open", closeEvent: "close", searchEvent: "search", clearEvent: "clear", addEvent: "add", removeEvent: "remove", scroll: "scroll", scrollToEnd: "scrollToEnd" }, host: { listeners: { "keydown": "handleKeyDown($event)" }, properties: { "class.ng-select-typeahead": "this.typeahead", "class.ng-select-multiple": "this.multiple", "class.ng-select-taggable": "this.addTag", "class.ng-select-searchable": "this.searchable", "class.ng-select-clearable": "this.clearable", "class.ng-select-opened": "this.isOpen", "class.ng-select": "this.useDefaultClass", "class.ng-select-disabled": "this.disabled", "class.ng-select-filtered": "this.filtered", "class.ng-select-single": "this.single" } }, providers: [{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => NgSelectComponent),
multi: true
}, NgDropdownPanelService], queries: [{ propertyName: "optionTemplate", first: true, predicate: NgOptionTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "optgroupTemplate", first: true, predicate: NgOptgroupTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: NgLabelTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "multiLabelTemplate", first: true, predicate: NgMultiLabelTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "headerTemplate", first: true, predicate: NgHeaderTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "footerTemplate", first: true, predicate: NgFooterTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "notFoundTemplate", first: true, predicate: NgNotFoundTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "typeToSearchTemplate", first: true, predicate: NgTypeToSearchTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "loadingTextTemplate", first: true, predicate: NgLoadingTextTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "tagTemplate", first: true, predicate: NgTagTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "loadingSpinnerTemplate", first: true, predicate: NgLoadingSpinnerTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "ngOptions", predicate: NgOptionComponent, descendants: true }], viewQueries: [{ propertyName: "dropdownPanel", first: true, predicate: i0.forwardRef(() => NgDropdownPanelComponent), descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, static: true }, { propertyName: "clearButton", first: true, predicate: ["clearButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n (mousedown)=\"handleMousedown($event)\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n class=\"ng-select-container\">\n\n <div class=\"ng-value-container\">\n <div class=\"ng-placeholder\">{{ placeholder }}</div>\n\n @if ((!multiLabelTemplate || !multiple) && selectedItems.length > 0) {\n @for (item of selectedItems; track trackByOption($index, item)) {\n <div [class.ng-value-disabled]=\"item.disabled\" class=\"ng-value\">\n <ng-template #defaultLabelTemplate>\n <span class=\"ng-value-icon left\" (click)=\"unselect(item);\" aria-hidden=\"true\">\u00D7</span>\n <span class=\"ng-value-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\">\n </ng-template>\n </div>\n }\n }\n\n @if (multiple && multiLabelTemplate && selectedValues.length > 0) {\n <ng-template\n [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: selectedValues, clear: clearItem }\">\n </ng-template>\n }\n\n <div class=\"ng-input\"\n role=\"combobox\" \n [attr.aria-expanded]=\"isOpen\" \n [attr.aria-owns]=\"isOpen ? dropdownId : null\" \n aria-haspopup=\"listbox\">\n\n <input #searchInput\n [attr.id]=\"labelForId\"\n [attr.tabindex]=\"tabIndex\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [disabled]=\"disabled\"\n [value]=\"searchTerm ? searchTerm : ''\"\n (input)=\"filter(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"$event.stopPropagation()\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList?.markedItem?.htmlId : null\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"isOpen ? dropdownId : null\">\n </div>\n </div>\n\n @if (loading) {\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-spinner-loader\"></div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\">\n </ng-template>\n }\n\n @if (showClear()) {\n <span class=\"ng-clear-wrapper\" tabindex=\"0\" title=\"{{clearAllText}}\" #clearButton>\n <span class=\"ng-clear\" aria-hidden=\"true\">\u00D7</span>\n </span>\n }\n\n <span class=\"ng-arrow-wrapper\">\n <span class=\"ng-arrow\"></span>\n </span>\n</div>\n\n@if (isOpen) {\n <ng-dropdown-panel\n class=\"ng-dropdown-panel\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"dropdownPosition\"\n [headerTemplate]=\"headerTemplate\"\n [footerTemplate]=\"footerTemplate\"\n [filterValue]=\"searchTerm\"\n [items]=\"itemsList.filteredItems\"\n [markedItem]=\"itemsList.markedItem\"\n (update)=\"viewPortItems = $event\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit($event)\"\n (outsideClick)=\"close()\"\n [class.ng-select-multiple]=\"multiple\"\n [ngClass]=\"appendTo ? classes : null\"\n [id]=\"dropdownId\"\n role=\"listbox\"\n aria-label=\"Options list\">\n <ng-container>\n @for (item of viewPortItems; track trackByOption($index, item)) {\n <div class=\"ng-option\" [attr.role]=\"item.children ? 'group' : 'option'\" (click)=\"toggleItem(item)\"\n (mouseover)=\"onItemHover(item)\"\n [class.ng-option-disabled]=\"item.disabled\"\n [class.ng-option-selected]=\"item.selected\"\n [class.ng-optgroup]=\"item.children\"\n [class.ng-option]=\"!item.children\"\n [class.ng-option-child]=\"!!item.parent\"\n [class.ng-option-marked]=\"item === itemsList.markedItem\"\n [attr.aria-selected]=\"item.selected\"\n [attr.id]=\"item?.htmlId\">\n <ng-template #defaultOptionTemplate>\n <span class=\"ng-option-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"item.children ? (optgroupTemplate || defaultOptionTemplate) : (optionTemplate || defaultOptionTemplate)\"\n [ngTemplateOutletContext]=\"{ item: item.value, item$:item, index: item.index, searchTerm: searchTerm }\">\n </ng-template>\n </div>\n }\n @if (showAddTag) {\n <div class=\"ng-option\" [class.ng-option-marked]=\"!itemsList.markedItem\"\n (mouseover)=\"itemsList.unmarkItem()\" role=\"option\" (click)=\"selectTag()\">\n <ng-template #defaultTagTemplate>\n <span><span class=\"ng-tag-label\">{{ addTagText }}</span>\"{{ searchTerm }}\"</span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </div>\n }\n </ng-container>\n @if (showNoItemsFound()) {\n <ng-template #defaultNotFoundTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ notFoundText }}</div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"notFoundTemplate || defaultNotFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n }\n @if (showTypeToSearch()) {\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ typeToSearchText }}</div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\">\n </ng-template>\n }\n @if (loading && itemsList.filteredItems.length === 0) {\n <ng-template #defaultLoadingTextTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ loadingText }}</div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"loadingTextTemplate || defaultLoadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n }\n </ng-dropdown-panel>\n}\n", styles: ["@charset \"UTF-8\";.ng-select{position:relative;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ng-select div,.ng-select input,.ng-select span{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ng-select [hidden]{display:none}.ng-select.ng-select-searchable .ng-select-container .ng-value-container .ng-input{opacity:1}.ng-select.ng-select-opened .ng-select-container{z-index:1001}.ng-select.ng-select-disabled .ng-select-container .ng-value-container .ng-placeholder,.ng-select.ng-select-disabled .ng-select-container .ng-value-container .ng-value{-webkit-user-select:none;user-select:none;cursor:default}.ng-select.ng-select-disabled .ng-arrow-wrapper{cursor:default}.ng-select.ng-select-filtered .ng-placeholder{display:none}.ng-select .ng-select-container{cursor:default;display:flex;outline:none;overflow:hidden;position:relative;width:100%}.ng-select .ng-select-container .ng-value-container{display:flex;flex:1}.ng-select .ng-select-container .ng-value-container .ng-input{opacity:0}.ng-select .ng-select-container .ng-value-container .ng-input>input{box-sizing:content-box;background:none transparent;border:0 none;box-shadow:none;outline:none;padding:0;cursor:default;width:100%}.ng-select .ng-select-container .ng-value-container .ng-input>input::-ms-clear{display:none}.ng-select .ng-select-container .ng-value-container .ng-input>input[readonly]{-webkit-user-select:none;user-select:none;width:0;padding:0}.ng-select.ng-select-single.ng-select-filtered .ng-select-container .ng-value-container .ng-value{visibility:hidden}.ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:none}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{position:absolute;left:0;width:100%}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-icon{display:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{flex-wrap:wrap}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{position:absolute}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{white-space:nowrap}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-icon{display:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{cursor:pointer}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{flex:1;z-index:2}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{z-index:1}.ng-select .ng-clear-wrapper{cursor:pointer;position:relative;width:17px;-webkit-user-select:none;user-select:none}.ng-select .ng-clear-wrapper .ng-clear{display:inline-block;font-size:18px;line-height:1;pointer-events:none}.ng-select .ng-spinner-loader{border-radius:50%;width:17px;height:17px;margin-right:5px;font-size:10px;position:relative;text-indent:-9999em;border-top:2px solid rgba(66,66,66,.2);border-right:2px solid rgba(66,66,66,.2);border-bottom:2px solid rgba(66,66,66,.2);border-left:2px solid #424242;transform:translateZ(0);animation:load8 .8s infinite linear}.ng-select .ng-spinner-loader:after{border-radius:50%;width:17px;height:17px}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.ng-select .ng-arrow-wrapper{cursor:pointer;position:relative;text-align:center;-webkit-user-select:none;user-select:none}.ng-select .ng-arrow-wrapper .ng-arrow{pointer-events:none;display:inline-block;height:0;width:0;position:relative}.ng-dropdown-panel{box-sizing:border-box;position:absolute;opacity:0;width:100%;z-index:1050;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .ng-dropdown-panel-items{display:block;height:auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;max-height:240px;overflow-y:auto}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{box-sizing:border-box;cursor:pointer;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-option-label:empty:before{content:\"\\200b\"}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .highlighted{font-weight:700;text-decoration:underline}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.disabled{cursor:default}.ng-dropdown-panel .scroll-host{overflow:hidden;overflow-y:auto;position:relative;display:block;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .scrollable-content{top:0;left:0;width:100%;height:100%;position:absolute}.ng-dropdown-panel .total-padding{width:1px;opacity:0}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgDropdownPanelComponent, selector: "ng-dropdown-panel", inputs: ["items", "markedItem", "position", "appendTo", "bufferAmount", "virtualScroll", "headerTemplate", "footerTemplate", "filterValue"], outputs: ["update", "scroll", "scrollToEnd", "outsideClick"] }, { kind: "directive", type: NgItemLabelDirective, selector: "[ngItemLabel]", inputs: ["ngItemLabel", "escape"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectComponent, decorators: [{
type: Component,
args: [{ selector: 'ng-select', providers: [{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => NgSelectComponent),
multi: true
}, NgDropdownPanelService], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n (mousedown)=\"handleMousedown($event)\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n class=\"ng-select-container\">\n\n <div class=\"ng-value-container\">\n <div class=\"ng-placeholder\">{{ placeholder }}</div>\n\n @if ((!multiLabelTemplate || !multiple) && selectedItems.length > 0) {\n @for (item of selectedItems; track trackByOption($index, item)) {\n <div [class.ng-value-disabled]=\"item.disabled\" class=\"ng-value\">\n <ng-template #defaultLabelTemplate>\n <span class=\"ng-value-icon left\" (click)=\"unselect(item);\" aria-hidden=\"true\">\u00D7</span>\n <span class=\"ng-value-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\">\n </ng-template>\n </div>\n }\n }\n\n @if (multiple && multiLabelTemplate && selectedValues.length > 0) {\n <ng-template\n [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: selectedValues, clear: clearItem }\">\n </ng-template>\n }\n\n <div class=\"ng-input\"\n role=\"combobox\" \n [attr.aria-expanded]=\"isOpen\" \n [attr.aria-owns]=\"isOpen ? dropdownId : null\" \n aria-haspopup=\"listbox\">\n\n <input #searchInput\n [attr.id]=\"labelForId\"\n [attr.tabindex]=\"tabIndex\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [disabled]=\"disabled\"\n [value]=\"searchTerm ? searchTerm : ''\"\n (input)=\"filter(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"$event.stopPropagation()\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList?.markedItem?.htmlId : null\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"isOpen ? dropdownId : null\">\n </div>\n </div>\n\n @if (loading) {\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-spinner-loader\"></div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\">\n </ng-template>\n }\n\n @if (showClear()) {\n <span class=\"ng-clear-wrapper\" tabindex=\"0\" title=\"{{clearAllText}}\" #clearButton>\n <span class=\"ng-clear\" aria-hidden=\"true\">\u00D7</span>\n </span>\n }\n\n <span class=\"ng-arrow-wrapper\">\n <span class=\"ng-arrow\"></span>\n </span>\n</div>\n\n@if (isOpen) {\n <ng-dropdown-panel\n class=\"ng-dropdown-panel\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"dropdownPosition\"\n [headerTemplate]=\"headerTemplate\"\n [footerTemplate]=\"footerTemplate\"\n [filterValue]=\"searchTerm\"\n [items]=\"itemsList.filteredItems\"\n [markedItem]=\"itemsList.markedItem\"\n (update)=\"viewPortItems = $event\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit($event)\"\n (outsideClick)=\"close()\"\n [class.ng-select-multiple]=\"multiple\"\n [ngClass]=\"appendTo ? classes : null\"\n [id]=\"dropdownId\"\n role=\"listbox\"\n aria-label=\"Options list\">\n <ng-container>\n @for (item of viewPortItems; track trackByOption($index, item)) {\n <div class=\"ng-option\" [attr.role]=\"item.children ? 'group' : 'option'\" (click)=\"toggleItem(item)\"\n (mouseover)=\"onItemHover(item)\"\n [class.ng-option-disabled]=\"item.disabled\"\n [class.ng-option-selected]=\"item.selected\"\n [class.ng-optgroup]=\"item.children\"\n [class.ng-option]=\"!item.children\"\n [class.ng-option-child]=\"!!item.parent\"\n [class.ng-option-marked]=\"item === itemsList.markedItem\"\n [attr.aria-selected]=\"item.selected\"\n [attr.id]=\"item?.htmlId\">\n <ng-template #defaultOptionTemplate>\n <span class=\"ng-option-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"item.children ? (optgroupTemplate || defaultOptionTemplate) : (optionTemplate || defaultOptionTemplate)\"\n [ngTemplateOutletContext]=\"{ item: item.value, item$:item, index: item.index, searchTerm: searchTerm }\">\n </ng-template>\n </div>\n }\n @if (showAddTag) {\n <div class=\"ng-option\" [class.ng-option-marked]=\"!itemsList.markedItem\"\n (mouseover)=\"itemsList.unmarkItem()\" role=\"option\" (click)=\"selectTag()\">\n <ng-template #defaultTagTemplate>\n <span><span class=\"ng-tag-label\">{{ addTagText }}</span>\"{{ searchTerm }}\"</span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </div>\n }\n </ng-container>\n @if (showNoItemsFound()) {\n <ng-template #defaultNotFoundTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ notFoundText }}</div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"notFoundTemplate || defaultNotFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n }\n @if (showTypeToSearch()) {\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ typeToSearchText }}</div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\">\n </ng-template>\n }\n @if (loading && itemsList.filteredItems.length === 0) {\n <ng-template #defaultLoadingTextTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ loadingText }}</div>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"loadingTextTemplate || defaultLoadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n }\n </ng-dropdown-panel>\n}\n", styles: ["@charset \"UTF-8\";.ng-select{position:relative;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ng-select div,.ng-select input,.ng-select span{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ng-select [hidden]{display:none}.ng-select.ng-select-searchable .ng-select-container .ng-value-container .ng-input{opacity:1}.ng-select.ng-select-opened .ng-select-container{z-index:1001}.ng-select.ng-select-disabled .ng-select-container .ng-value-container .ng-placeholder,.ng-select.ng-select-disabled .ng-select-container .ng-value-container .ng-value{-webkit-user-select:none;user-select:none;cursor:default}.ng-select.ng-select-disabled .ng-arrow-wrapper{cursor:default}.ng-select.ng-select-filtered .ng-placeholder{display:none}.ng-select .ng-select-container{cursor:default;display:flex;outline:none;overflow:hidden;position:relative;width:100%}.ng-select .ng-select-container .ng-value-container{display:flex;flex:1}.ng-select .ng-select-container .ng-value-container .ng-input{opacity:0}.ng-select .ng-select-container .ng-value-container .ng-input>input{box-sizing:content-box;background:none transparent;border:0 none;box-shadow:none;outline:none;padding:0;cursor:default;width:100%}.ng-select .ng-select-container .ng-value-container .ng-input>input::-ms-clear{display:none}.ng-select .ng-select-container .ng-value-container .ng-input>input[readonly]{-webkit-user-select:none;user-select:none;width:0;padding:0}.ng-select.ng-select-single.ng-select-filtered .ng-select-container .ng-value-container .ng-value{visibility:hidden}.ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:none}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{position:absolute;left:0;width:100%}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-icon{display:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{flex-wrap:wrap}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{position:absolute}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{white-space:nowrap}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-icon{display:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{cursor:pointer}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{flex:1;z-index:2}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{z-index:1}.ng-select .ng-clear-wrapper{cursor:pointer;position:relative;width:17px;-webkit-user-select:none;user-select:none}.ng-select .ng-clear-wrapper .ng-clear{display:inline-block;font-size:18px;line-height:1;pointer-events:none}.ng-select .ng-spinner-loader{border-radius:50%;width:17px;height:17px;margin-right:5px;font-size:10px;position:relative;text-indent:-9999em;border-top:2px solid rgba(66,66,66,.2);border-right:2px solid rgba(66,66,66,.2);border-bottom:2px solid rgba(66,66,66,.2);border-left:2px solid #424242;transform:translateZ(0);animation:load8 .8s infinite linear}.ng-select .ng-spinner-loader:after{border-radius:50%;width:17px;height:17px}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.ng-select .ng-arrow-wrapper{cursor:pointer;position:relative;text-align:center;-webkit-user-select:none;user-select:none}.ng-select .ng-arrow-wrapper .ng-arrow{pointer-events:none;display:inline-block;height:0;width:0;position:relative}.ng-dropdown-panel{box-sizing:border-box;position:absolute;opacity:0;width:100%;z-index:1050;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .ng-dropdown-panel-items{display:block;height:auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;max-height:240px;overflow-y:auto}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{box-sizing:border-box;cursor:pointer;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-option-label:empty:before{content:\"\\200b\"}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .highlighted{font-weight:700;text-decoration:underline}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.disabled{cursor:default}.ng-dropdown-panel .scroll-host{overflow:hidden;overflow-y:auto;position:relative;display:block;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .scrollable-content{top:0;left:0;width:100%;height:100%;position:absolute}.ng-dropdown-panel .total-padding{width:1px;opacity:0}\n"] }]
}], ctorParameters: () => [{ type: undefined, decorators: [{
type: Attribute,
args: ['class']
}] }, { type: undefined, decorators: [{
type: Attribute,
args: ['autofocus']
}] }, { type: NgSelectConfig }, { type: undefined, decorators: [{
type: Inject,
args: [SELECTION_MODEL_FACTORY]
}] }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: ConsoleService }], propDecorators: { bindLabel: [{
type: Input
}], bindValue: [{
type: Input
}], markFirst: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], placeholder: [{
type: Input
}], notFoundText: [{
type: Input
}], typeToSearchText: [{
type: Input
}], addTagText: [{
type: Input
}], loadingText: [{
type: Input
}], clearAllText: [{
type: Input
}], appearance: [{
type: Input
}], dropdownPosition: [{
type: Input
}], appendTo: [{
type: Input
}], loading: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], closeOnSelect: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], hideSelected: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], selectOnTab: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], openOnEnter: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], maxSelectedItems: [{
type: Input,
args: [{ transform: numberAttribute }]
}], groupBy: [{
type: Input
}], groupValue: [{
type: Input
}], bufferAmount: [{
type: Input,
args: [{ transform: numberAttribute }]
}], virtualScroll: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], selectableGroup: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], selectableGroupAsModel: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], searchFn: [{
type: Input
}], trackByFn: [{
type: Input
}], clearOnBackspace: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], labelForId: [{
type: Input
}], inputAttrs: [{
type: Input
}], tabIndex: [{
type: Input,
args: [{ transform: numberAttribute }]
}], readonly: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], searchWhileComposing: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], minTermLength: [{
type: Input,
args: [{ transform: numberAttribute }]
}], editableSearchTerm: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], keyDownFn: [{
type: Input
}], typeahead: [{
type: Input
}, {
type: HostBinding,
args: ['class.ng-select-typeahead']
}], multiple: [{
type: Input,
args: [{ transform: booleanAttribute }]
}, {
type: HostBinding,
args: ['class.ng-select-multiple']
}], addTag: [{
type: Input
}, {
type: HostBinding,
args: ['class.ng-select-taggable']
}], searchable: [{
type: Input,
args: [{ transform: booleanAttribute }]
}, {
type: HostBinding,
args: ['class.ng-select-searchable']
}], clearable: [{
type: Input,
args: [{ transform: booleanAttribute }]
}, {
type: HostBinding,
args: ['class.ng-select-clearable']
}], isOpen: [{
type: Input,
args: [{ transform: booleanAttribute }]
}, {
type: HostBinding,
args: ['class.ng-select-opened']
}], items: [{
type: Input
}], compareWith: [{
type: Input
}], clearSearchOnAdd: [{
type: Input
}], deselectOnClick: [{
type: Input
}], blurEvent: [{
type: Output,
args: ['blur']
}], focusEvent: [{
type: Output,
args: ['focus']
}], changeEvent: [{
type: Output,
args: ['change']
}], openEvent: [{
type: Output,
args: ['open']
}], closeEvent: [{
type: Output,
args: ['close']
}], searchEvent: [{
type: Output,
args: ['search']
}], clearEvent: [{
type: Output,
args: ['clear']
}], addEvent: [{
type: Output,
args: ['add']
}], removeEvent: [{
type: Output,
args: ['remove']
}], scroll: [{
type: Output,
args: ['scroll']
}], scrollToEnd: [{
type: Output,
args: ['scrollToEnd']
}], optionTemplate: [{
type: ContentChild,
args: [NgOptionTemplateDirective, { read: TemplateRef }]
}], optgroupTemplate: [{
type: ContentChild,
args: [NgOptgroupTemplateDirective, { read: TemplateRef }]
}], labelTemplate: [{
type: ContentChild,
args: [NgLabelTemplateDirective, { read: TemplateRef }]
}], multiLabelTemplate: [{
type: ContentChild,
args: [NgMultiLabelTemplateDirective, { read: TemplateRef }]
}], headerTemplate: [{
type: ContentChild,
args: [NgHeaderTemplateDirective, { read: TemplateRef }]
}], footerTemplate: [{
type: ContentChild,
args: [NgFooterTemplateDirective, { read: TemplateRef }]
}], notFoundTemplate: [{
type: ContentChild,
args: [NgNotFoundTemplateDirective, { read: TemplateRef }]
}], typeToSearchTemplate: [{
type: ContentChild,
args: [NgTypeToSearchTemplateDirective, { read: TemplateRef }]
}], loadingTextTemplate: [{
type: ContentChild,
args: [NgLoadingTextTemplateDirective, { read: TemplateRef }]
}], tagTemplate: [{
type: ContentChild,
args: [NgTagTemplateDirective, { read: TemplateRef }]
}], loadingSpinnerTemplate: [{
type: ContentChild,
args: [NgLoadingSpinnerTemplateDirective, { read: TemplateRef }]
}], dropdownPanel: [{
type: ViewChild,
args: [forwardRef(() => NgDropdownPanelComponent)]
}], searchInput: [{
type: ViewChild,
args: ['searchInput', { static: true }]
}], clearButton: [{
type: ViewChild,
args: ['clearButton']
}], ngOptions: [{
type: ContentChildren,
args: [NgOptionComponent, { descendants: true }]
}], useDefaultClass: [{
type: HostBinding,
args: ['class.ng-select']
}], disabled: [{
type: HostBinding,
args: ['class.ng-select-disabled']
}], filtered: [{
type: HostBinding,
args: ['class.ng-select-filtered']
}], single: [{
type: HostBinding,
args: ['class.ng-select-single']
}], handleKeyDown: [{
type: HostListener,
args: ['keydown', ['$event']]
}] } });
function DefaultSelectionModelFactory() {
return new DefaultSelectionModel();
}
class DefaultSelectionModel {
constructor() {
this._selected = [];
}
get value() {
return this._selected;
}
select(item, multiple, groupAsModel) {
item.selected = true;
if (!item.children || (!multiple && groupAsModel)) {
this._selected.push(item);
}
if (multiple) {
if (item.parent) {
const childrenCount = item.parent.children.length;
const selectedCount = item.parent.children.filter(x => x.selected).length;
item.parent.selected = childrenCount === selectedCount;
}
else if (item.children) {
this._setChildrenSelectedState(item.children, true);
this._removeChildren(item);
if (groupAsModel && this._activeChildren(item)) {
this._selected = [...this._selected.filter(x => x.parent !== item), item];
}
else {
this._selected = [...this._selected, ...item.children.filter(x => !x.disabled)];
}
}
}
}
unselect(item, multiple) {
this._selected = this._selected.filter(x => x !== item);
item.selected = false;
if (multiple) {
if (item.parent && item.parent.selected) {
const children = item.parent.children;
this._removeParent(item.parent);
this._removeChildren(item.parent);
this._selected.push(...children.filter(x => x !== item && !x.disabled));
item.parent.selected = false;
}
else if (item.children) {
this._setChildrenSelectedState(item.children, false);
this._removeChildren(item);
}
}
}
clear(keepDisabled) {
this._selected = keepDisabled ? this._selected.filter(x => x.disabled) : [];
}
_setChildrenSelectedState(children, selected) {
for (const child of children) {
if (child.disabled) {
continue;
}
child.selected = selected;
}
}
_removeChildren(parent) {
this._selected = [
...this._selected.filter(x => x.parent !== parent),
...parent.children.filter(x => x.parent === parent && x.disabled && x.selected)
];
}
_removeParent(parent) {
this._selected = this._selected.filter(x => x !== parent);
}
_activeChildren(item) {
return item.children.every(x => !x.disabled || x.selected);
}
}
class NgSelectModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0", ngImport: i0, type: NgSelectModule, declarations: [NgDropdownPanelComponent,
NgOptionComponent,
NgSelectComponent,
NgOptgroupTemplateDirective,
NgOptionTemplateDirective,
NgLabelTemplateDirective,
NgMultiLabelTemplateDirective,
NgHeaderTemplateDirective,
NgFooterTemplateDirective,
NgNotFoundTemplateDirective,
NgTypeToSearchTemplateDirective,
NgLoadingTextTemplateDirective,
NgTagTemplateDirective,
NgLoadingSpinnerTemplateDirective,
NgItemLabelDirective], imports: [CommonModule], exports: [NgSelectComponent,
NgOptionComponent,
NgOptgroupTemplateDirective,
NgOptionTemplateDirective,
NgLabelTemplateDirective,
NgMultiLabelTemplateDirective,
NgHeaderTemplateDirective,
NgFooterTemplateDirective,
NgNotFoundTemplateDirective,
NgTypeToSearchTemplateDirective,
NgLoadingTextTemplateDirective,
NgTagTemplateDirective,
NgLoadingSpinnerTemplateDirective] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectModule, providers: [
{ provide: SELECTION_MODEL_FACTORY, useValue: DefaultSelectionModelFactory }
], imports: [CommonModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgSelectModule, decorators: [{
type: NgModule,
args: [{
declarations: [
NgDropdownPanelComponent,
NgOptionComponent,
NgSelectComponent,
NgOptgroupTemplateDirective,
NgOptionTemplateDirective,
NgLabelTemplateDirective,
NgMultiLabelTemplateDirective,
NgHeaderTemplateDirective,
NgFooterTemplateDirective,
NgNotFoundTemplateDirective,
NgTypeToSearchTemplateDirective,
NgLoadingTextTemplateDirective,
NgTagTemplateDirective,
NgLoadingSpinnerTemplateDirective,
NgItemLabelDirective
],
imports: [
CommonModule
],
exports: [
NgSelectComponent,
NgOptionComponent,
NgOptgroupTemplateDirective,
NgOptionTemplateDirective,
NgLabelTemplateDirective,
NgMultiLabelTemplateDirective,
NgHeaderTemplateDirective,
NgFooterTemplateDirective,
NgNotFoundTemplateDirective,
NgTypeToSearchTemplateDirective,
NgLoadingTextTemplateDirective,
NgTagTemplateDirective,
NgLoadingSpinnerTemplateDirective
],
providers: [
{ provide: SELECTION_MODEL_FACTORY, useValue: DefaultSelectionModelFactory }
]
}]
}] });
/*
* Public API Surface of ng-select
*/
/**
* Generated bundle index. Do not edit.
*/
export { ConsoleService, DefaultSelectionModel, DefaultSelectionModelFactory, NgDropdownPanelComponent, NgDropdownPanelService, NgFooterTemplateDirective, NgHeaderTemplateDirective, NgItemLabelDirective, NgLabelTemplateDirective, NgLoadingSpinnerTemplateDirective, NgLoadingTextTemplateDirective, NgMultiLabelTemplateDirective, NgNotFoundTemplateDirective, NgOptgroupTemplateDirective, NgOptionComponent, NgOptionTemplateDirective, NgSelectComponent, NgSelectConfig, NgSelectModule, NgTagTemplateDirective, NgTypeToSearchTemplateDirective, SELECTION_MODEL_FACTORY };
//# sourceMappingURL=ng-select-ng-select.mjs.map