@ng-matero/ng-select 0.4.1 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,16 +6,14 @@ import { takeUntil, auditTime, startWith, tap, debounceTime, filter, map } from
6
6
  import { NG_VALUE_ACCESSOR } from '@angular/forms';
7
7
 
8
8
  class NgDropdownPanelUtils {
9
- constructor() {
10
- this._dimensions = {
11
- itemHeight: 0,
12
- panelHeight: 0,
13
- itemsPerViewport: 0,
14
- };
15
- }
16
9
  get dimensions() {
17
10
  return this._dimensions;
18
11
  }
12
+ _dimensions = {
13
+ itemHeight: 0,
14
+ panelHeight: 0,
15
+ itemsPerViewport: 0,
16
+ };
19
17
  calculateItems(scrollPos, itemsLength, buffer) {
20
18
  const d = this._dimensions;
21
19
  const scrollHeight = d.itemHeight * itemsLength;
@@ -64,8 +62,8 @@ class NgDropdownPanelUtils {
64
62
  }
65
63
  return null;
66
64
  }
67
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanelUtils, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
68
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanelUtils, providedIn: 'root' }); }
65
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanelUtils, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
66
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanelUtils, providedIn: 'root' });
69
67
  }
70
68
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanelUtils, decorators: [{
71
69
  type: Injectable,
@@ -112,31 +110,42 @@ var KeyCode;
112
110
  const CSS_POSITIONS = ['top', 'right', 'bottom', 'left'];
113
111
  const SCROLL_SCHEDULER = typeof requestAnimationFrame !== 'undefined' ? animationFrameScheduler : asapScheduler;
114
112
  class NgDropdownPanel {
115
- constructor() {
116
- this.listboxId = '';
117
- this.items = [];
118
- this.position = 'auto';
119
- this.bufferAmount = 4;
120
- this.virtualScroll = false;
121
- this.filterValue = null;
122
- this.update = new EventEmitter();
123
- this.scroll = new EventEmitter();
124
- this.scrollToEnd = new EventEmitter();
125
- this.outsideClick = new EventEmitter();
126
- this._document = inject(DOCUMENT, { optional: true });
127
- this._renderer = inject(Renderer2);
128
- this._zone = inject(NgZone);
129
- this._elementRef = inject(ElementRef);
130
- this._panelUtils = inject(NgDropdownPanelUtils);
131
- this._destroy$ = new Subject();
132
- this._dropdown = this._elementRef.nativeElement;
133
- this._scrollToEndFired = false;
134
- this._updateScrollHeight = false;
135
- this._lastScrollPosition = 0;
136
- }
113
+ listboxId = '';
114
+ items = [];
115
+ markedItem;
116
+ position = 'auto';
117
+ appendTo;
118
+ bufferAmount = 4;
119
+ virtualScroll = false;
120
+ headerTemplate;
121
+ footerTemplate;
122
+ filterValue = null;
123
+ update = new EventEmitter();
124
+ scroll = new EventEmitter();
125
+ scrollToEnd = new EventEmitter();
126
+ outsideClick = new EventEmitter();
127
+ scrollHostElRef;
128
+ scrollContentElRef;
129
+ scrollSpacerElRef;
130
+ _document = inject(DOCUMENT, { optional: true });
131
+ _renderer = inject(Renderer2);
132
+ _zone = inject(NgZone);
133
+ _elementRef = inject(ElementRef);
134
+ _panelUtils = inject(NgDropdownPanelUtils);
135
+ _destroy$ = new Subject();
136
+ _dropdown = this._elementRef.nativeElement;
137
+ _select;
138
+ _parent;
139
+ _scrollHost;
140
+ _scrollContent;
141
+ _scrollSpacer;
142
+ _scrollToEndFired = false;
143
+ _updateScrollHeight = false;
144
+ _lastScrollPosition = 0;
137
145
  get currentPosition() {
138
146
  return this._currentPosition;
139
147
  }
148
+ _currentPosition = 'auto';
140
149
  get itemsLength() {
141
150
  return this._itemsLength;
142
151
  }
@@ -146,6 +155,7 @@ class NgDropdownPanel {
146
155
  this._onItemsLengthChanged();
147
156
  }
148
157
  }
158
+ _itemsLength;
149
159
  get _startOffset() {
150
160
  if (this.markedItem) {
151
161
  const { itemHeight, panelHeight } = this._panelUtils.dimensions;
@@ -436,8 +446,8 @@ class NgDropdownPanel {
436
446
  });
437
447
  });
438
448
  }
439
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
440
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgDropdownPanel, isStandalone: true, selector: "ng-dropdown-panel", inputs: { listboxId: "listboxId", 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: "scrollHostElRef", first: true, predicate: ["scrollHost"], descendants: true, read: ElementRef, static: true }, { propertyName: "scrollContentElRef", first: true, predicate: ["scrollContent"], descendants: true, read: ElementRef, static: true }, { propertyName: "scrollSpacerElRef", first: true, predicate: ["scrollSpacer"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
449
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
450
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgDropdownPanel, isStandalone: true, selector: "ng-dropdown-panel", inputs: { listboxId: "listboxId", 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: "scrollHostElRef", first: true, predicate: ["scrollHost"], descendants: true, read: ElementRef, static: true }, { propertyName: "scrollContentElRef", first: true, predicate: ["scrollContent"], descendants: true, read: ElementRef, static: true }, { propertyName: "scrollSpacerElRef", first: true, predicate: ["scrollSpacer"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
441
451
  @if (headerTemplate) {
442
452
  <div class="ng-dropdown-header">
443
453
  <ng-container
@@ -466,7 +476,7 @@ class NgDropdownPanel {
466
476
  />
467
477
  </div>
468
478
  }
469
- `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
479
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
470
480
  }
471
481
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgDropdownPanel, decorators: [{
472
482
  type: Component,
@@ -547,12 +557,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
547
557
  }] } });
548
558
 
549
559
  class NgOption {
550
- constructor() {
551
- this.disabled = false;
552
- this.elementRef = inject(ElementRef);
553
- this.stateChange$ = new Subject();
554
- this._previousLabel = '';
555
- }
560
+ value;
561
+ disabled = false;
562
+ elementRef = inject(ElementRef);
563
+ stateChange$ = new Subject();
564
+ _previousLabel = '';
556
565
  get label() {
557
566
  return (this.elementRef.nativeElement.textContent || '').trim();
558
567
  }
@@ -577,10 +586,10 @@ class NgOption {
577
586
  ngOnDestroy() {
578
587
  this.stateChange$.complete();
579
588
  }
580
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
581
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.12", type: NgOption, isStandalone: true, selector: "ng-option", inputs: { value: "value", disabled: ["disabled", "disabled", booleanAttribute] }, usesOnChanges: true, ngImport: i0, template: `
589
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOption, deps: [], target: i0.ɵɵFactoryTarget.Component });
590
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.12", type: NgOption, isStandalone: true, selector: "ng-option", inputs: { value: "value", disabled: ["disabled", "disabled", booleanAttribute] }, usesOnChanges: true, ngImport: i0, template: `
582
591
  <ng-content />
583
- `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
592
+ `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
584
593
  }
585
594
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOption, decorators: [{
586
595
  type: Component,
@@ -599,13 +608,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
599
608
  }] } });
600
609
 
601
610
  class NgOptionHighlight {
602
- constructor() {
603
- this.term = '';
604
- this.elementRef = inject(ElementRef);
605
- this.renderer = inject(Renderer2);
606
- this.element = this.elementRef.nativeElement;
607
- this.label = '';
608
- }
611
+ term = '';
612
+ elementRef = inject(ElementRef);
613
+ renderer = inject(Renderer2);
614
+ element = this.elementRef.nativeElement;
615
+ label = '';
609
616
  get _canHighlight() {
610
617
  return this.term && this.label;
611
618
  }
@@ -636,8 +643,8 @@ class NgOptionHighlight {
636
643
  _setInnerHtml(html) {
637
644
  this.renderer.setProperty(this.elementRef.nativeElement, 'innerHTML', html);
638
645
  }
639
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptionHighlight, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
640
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgOptionHighlight, isStandalone: true, selector: "[ngOptionHighlight]", inputs: { term: ["ngOptionHighlight", "term"] }, usesOnChanges: true, ngImport: i0 }); }
646
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptionHighlight, deps: [], target: i0.ɵɵFactoryTarget.Directive });
647
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgOptionHighlight, isStandalone: true, selector: "[ngOptionHighlight]", inputs: { term: ["ngOptionHighlight", "term"] }, usesOnChanges: true, ngImport: i0 });
641
648
  }
642
649
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptionHighlight, decorators: [{
643
650
  type: Directive,
@@ -1497,22 +1504,25 @@ function stripSpecialChars(text) {
1497
1504
  }
1498
1505
 
1499
1506
  class ItemsList {
1507
+ _ngSelect;
1508
+ _selectionModel;
1509
+ _groups;
1500
1510
  constructor(_ngSelect, _selectionModel) {
1501
1511
  this._ngSelect = _ngSelect;
1502
1512
  this._selectionModel = _selectionModel;
1503
- this._items = [];
1504
- this._filteredItems = [];
1505
- this._markedIndex = -1;
1506
1513
  }
1507
1514
  get items() {
1508
1515
  return this._items;
1509
1516
  }
1517
+ _items = [];
1510
1518
  get filteredItems() {
1511
1519
  return this._filteredItems;
1512
1520
  }
1521
+ _filteredItems = [];
1513
1522
  get markedIndex() {
1514
1523
  return this._markedIndex;
1515
1524
  }
1525
+ _markedIndex = -1;
1516
1526
  get selectedItems() {
1517
1527
  return this._selectionModel.value;
1518
1528
  }
@@ -1864,19 +1874,23 @@ class ItemsList {
1864
1874
  }
1865
1875
 
1866
1876
  class NgSelectConfig {
1867
- constructor() {
1868
- this.fixedPlaceholder = true;
1869
- this.notFoundText = 'No items found';
1870
- this.typeToSearchText = 'Type to search';
1871
- this.addTagText = 'Add item';
1872
- this.loadingText = 'Loading...';
1873
- this.clearAllText = 'Clear all';
1874
- this.virtualScroll = false;
1875
- this.openOnEnter = true;
1876
- this.appearance = 'underline';
1877
- }
1878
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1879
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectConfig, providedIn: 'root' }); }
1877
+ placeholder;
1878
+ fixedPlaceholder = true;
1879
+ notFoundText = 'No items found';
1880
+ typeToSearchText = 'Type to search';
1881
+ addTagText = 'Add item';
1882
+ loadingText = 'Loading...';
1883
+ clearAllText = 'Clear all';
1884
+ virtualScroll = false;
1885
+ openOnEnter = true;
1886
+ appendTo;
1887
+ bindValue;
1888
+ bindLabel;
1889
+ clearSearchOnAdd;
1890
+ deselectOnClick;
1891
+ appearance = 'underline';
1892
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1893
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectConfig, providedIn: 'root' });
1880
1894
  }
1881
1895
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectConfig, decorators: [{
1882
1896
  type: Injectable,
@@ -1884,18 +1898,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1884
1898
  }] });
1885
1899
 
1886
1900
  class NgItemLabel {
1887
- constructor() {
1888
- this.ngItemLabel = '';
1889
- this.escape = true;
1890
- this.element = inject(ElementRef);
1891
- }
1901
+ ngItemLabel = '';
1902
+ escape = true;
1903
+ element = inject(ElementRef);
1892
1904
  ngOnChanges() {
1893
1905
  this.element.nativeElement.innerHTML = this.escape
1894
1906
  ? escapeHTML(this.ngItemLabel)
1895
1907
  : this.ngItemLabel;
1896
1908
  }
1897
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgItemLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1898
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgItemLabel, isStandalone: true, selector: "[ngItemLabel]", inputs: { ngItemLabel: "ngItemLabel", escape: "escape" }, usesOnChanges: true, ngImport: i0 }); }
1909
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgItemLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1910
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgItemLabel, isStandalone: true, selector: "[ngItemLabel]", inputs: { ngItemLabel: "ngItemLabel", escape: "escape" }, usesOnChanges: true, ngImport: i0 });
1899
1911
  }
1900
1912
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgItemLabel, decorators: [{
1901
1913
  type: Directive,
@@ -1908,11 +1920,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1908
1920
  type: Input
1909
1921
  }] } });
1910
1922
  class NgOptionTemplate {
1911
- constructor() {
1912
- this.template = inject(TemplateRef);
1913
- }
1914
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptionTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1915
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgOptionTemplate, isStandalone: true, selector: "[ng-option-tmp]", ngImport: i0 }); }
1923
+ template = inject(TemplateRef);
1924
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptionTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1925
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgOptionTemplate, isStandalone: true, selector: "[ng-option-tmp]", ngImport: i0 });
1916
1926
  }
1917
1927
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptionTemplate, decorators: [{
1918
1928
  type: Directive,
@@ -1921,11 +1931,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1921
1931
  }]
1922
1932
  }] });
1923
1933
  class NgOptgroupTemplate {
1924
- constructor() {
1925
- this.template = inject(TemplateRef);
1926
- }
1927
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptgroupTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1928
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgOptgroupTemplate, isStandalone: true, selector: "[ng-optgroup-tmp]", ngImport: i0 }); }
1934
+ template = inject(TemplateRef);
1935
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptgroupTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1936
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgOptgroupTemplate, isStandalone: true, selector: "[ng-optgroup-tmp]", ngImport: i0 });
1929
1937
  }
1930
1938
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgOptgroupTemplate, decorators: [{
1931
1939
  type: Directive,
@@ -1934,11 +1942,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1934
1942
  }]
1935
1943
  }] });
1936
1944
  class NgLabelTemplate {
1937
- constructor() {
1938
- this.template = inject(TemplateRef);
1939
- }
1940
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLabelTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1941
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgLabelTemplate, isStandalone: true, selector: "[ng-label-tmp]", ngImport: i0 }); }
1945
+ template = inject(TemplateRef);
1946
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLabelTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1947
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgLabelTemplate, isStandalone: true, selector: "[ng-label-tmp]", ngImport: i0 });
1942
1948
  }
1943
1949
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLabelTemplate, decorators: [{
1944
1950
  type: Directive,
@@ -1947,11 +1953,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1947
1953
  }]
1948
1954
  }] });
1949
1955
  class NgMultiLabelTemplate {
1950
- constructor() {
1951
- this.template = inject(TemplateRef);
1952
- }
1953
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgMultiLabelTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1954
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgMultiLabelTemplate, isStandalone: true, selector: "[ng-multi-label-tmp]", ngImport: i0 }); }
1956
+ template = inject(TemplateRef);
1957
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgMultiLabelTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1958
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgMultiLabelTemplate, isStandalone: true, selector: "[ng-multi-label-tmp]", ngImport: i0 });
1955
1959
  }
1956
1960
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgMultiLabelTemplate, decorators: [{
1957
1961
  type: Directive,
@@ -1960,11 +1964,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1960
1964
  }]
1961
1965
  }] });
1962
1966
  class NgHeaderTemplate {
1963
- constructor() {
1964
- this.template = inject(TemplateRef);
1965
- }
1966
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgHeaderTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1967
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgHeaderTemplate, isStandalone: true, selector: "[ng-header-tmp]", ngImport: i0 }); }
1967
+ template = inject(TemplateRef);
1968
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgHeaderTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1969
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgHeaderTemplate, isStandalone: true, selector: "[ng-header-tmp]", ngImport: i0 });
1968
1970
  }
1969
1971
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgHeaderTemplate, decorators: [{
1970
1972
  type: Directive,
@@ -1973,11 +1975,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1973
1975
  }]
1974
1976
  }] });
1975
1977
  class NgFooterTemplate {
1976
- constructor() {
1977
- this.template = inject(TemplateRef);
1978
- }
1979
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgFooterTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1980
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgFooterTemplate, isStandalone: true, selector: "[ng-footer-tmp]", ngImport: i0 }); }
1978
+ template = inject(TemplateRef);
1979
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgFooterTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1980
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgFooterTemplate, isStandalone: true, selector: "[ng-footer-tmp]", ngImport: i0 });
1981
1981
  }
1982
1982
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgFooterTemplate, decorators: [{
1983
1983
  type: Directive,
@@ -1986,11 +1986,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1986
1986
  }]
1987
1987
  }] });
1988
1988
  class NgNotFoundTemplate {
1989
- constructor() {
1990
- this.template = inject(TemplateRef);
1991
- }
1992
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgNotFoundTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1993
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgNotFoundTemplate, isStandalone: true, selector: "[ng-notfound-tmp]", ngImport: i0 }); }
1989
+ template = inject(TemplateRef);
1990
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgNotFoundTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1991
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgNotFoundTemplate, isStandalone: true, selector: "[ng-notfound-tmp]", ngImport: i0 });
1994
1992
  }
1995
1993
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgNotFoundTemplate, decorators: [{
1996
1994
  type: Directive,
@@ -1999,11 +1997,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1999
1997
  }]
2000
1998
  }] });
2001
1999
  class NgPlaceholderTemplate {
2002
- constructor() {
2003
- this.template = inject(TemplateRef);
2004
- }
2005
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgPlaceholderTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2006
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgPlaceholderTemplate, isStandalone: true, selector: "[ng-placeholder-tmp]", ngImport: i0 }); }
2000
+ template = inject(TemplateRef);
2001
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgPlaceholderTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2002
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgPlaceholderTemplate, isStandalone: true, selector: "[ng-placeholder-tmp]", ngImport: i0 });
2007
2003
  }
2008
2004
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgPlaceholderTemplate, decorators: [{
2009
2005
  type: Directive,
@@ -2012,11 +2008,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
2012
2008
  }]
2013
2009
  }] });
2014
2010
  class NgTypeToSearchTemplate {
2015
- constructor() {
2016
- this.template = inject(TemplateRef);
2017
- }
2018
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgTypeToSearchTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2019
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgTypeToSearchTemplate, isStandalone: true, selector: "[ng-typetosearch-tmp]", ngImport: i0 }); }
2011
+ template = inject(TemplateRef);
2012
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgTypeToSearchTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2013
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgTypeToSearchTemplate, isStandalone: true, selector: "[ng-typetosearch-tmp]", ngImport: i0 });
2020
2014
  }
2021
2015
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgTypeToSearchTemplate, decorators: [{
2022
2016
  type: Directive,
@@ -2025,11 +2019,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
2025
2019
  }]
2026
2020
  }] });
2027
2021
  class NgLoadingTextTemplate {
2028
- constructor() {
2029
- this.template = inject(TemplateRef);
2030
- }
2031
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLoadingTextTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2032
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgLoadingTextTemplate, isStandalone: true, selector: "[ng-loadingtext-tmp]", ngImport: i0 }); }
2022
+ template = inject(TemplateRef);
2023
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLoadingTextTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2024
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgLoadingTextTemplate, isStandalone: true, selector: "[ng-loadingtext-tmp]", ngImport: i0 });
2033
2025
  }
2034
2026
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLoadingTextTemplate, decorators: [{
2035
2027
  type: Directive,
@@ -2038,11 +2030,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
2038
2030
  }]
2039
2031
  }] });
2040
2032
  class NgTagTemplate {
2041
- constructor() {
2042
- this.template = inject(TemplateRef);
2043
- }
2044
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgTagTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2045
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgTagTemplate, isStandalone: true, selector: "[ng-tag-tmp]", ngImport: i0 }); }
2033
+ template = inject(TemplateRef);
2034
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgTagTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2035
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgTagTemplate, isStandalone: true, selector: "[ng-tag-tmp]", ngImport: i0 });
2046
2036
  }
2047
2037
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgTagTemplate, decorators: [{
2048
2038
  type: Directive,
@@ -2051,11 +2041,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
2051
2041
  }]
2052
2042
  }] });
2053
2043
  class NgLoadingSpinnerTemplate {
2054
- constructor() {
2055
- this.template = inject(TemplateRef);
2056
- }
2057
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLoadingSpinnerTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2058
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgLoadingSpinnerTemplate, isStandalone: true, selector: "[ng-loadingspinner-tmp]", ngImport: i0 }); }
2044
+ template = inject(TemplateRef);
2045
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLoadingSpinnerTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2046
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgLoadingSpinnerTemplate, isStandalone: true, selector: "[ng-loadingspinner-tmp]", ngImport: i0 });
2059
2047
  }
2060
2048
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgLoadingSpinnerTemplate, decorators: [{
2061
2049
  type: Directive,
@@ -2064,11 +2052,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
2064
2052
  }]
2065
2053
  }] });
2066
2054
  class NgClearButtonTemplate {
2067
- constructor() {
2068
- this.template = inject(TemplateRef);
2069
- }
2070
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgClearButtonTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2071
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgClearButtonTemplate, isStandalone: true, selector: "[ng-clearbutton-tmp]", ngImport: i0 }); }
2055
+ template = inject(TemplateRef);
2056
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgClearButtonTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2057
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: NgClearButtonTemplate, isStandalone: true, selector: "[ng-clearbutton-tmp]", ngImport: i0 });
2072
2058
  }
2073
2059
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgClearButtonTemplate, decorators: [{
2074
2060
  type: Directive,
@@ -2081,12 +2067,10 @@ function DefaultSelectionModelFactory() {
2081
2067
  return new DefaultSelectionModel();
2082
2068
  }
2083
2069
  class DefaultSelectionModel {
2084
- constructor() {
2085
- this._selected = [];
2086
- }
2087
2070
  get value() {
2088
2071
  return this._selected;
2089
2072
  }
2073
+ _selected = [];
2090
2074
  select(item, multiple, groupAsModel) {
2091
2075
  item.selected = true;
2092
2076
  if (!item.children || (!multiple && groupAsModel)) {
@@ -2155,6 +2139,59 @@ class DefaultSelectionModel {
2155
2139
  const SELECTION_MODEL_FACTORY = new InjectionToken('ng-select-selection-model');
2156
2140
  let nextUniqueId = 0;
2157
2141
  class NgSelect {
2142
+ _cdr = inject(ChangeDetectorRef);
2143
+ _elementRef = inject(ElementRef);
2144
+ _config = inject(NgSelectConfig);
2145
+ newSelectionModel = inject(SELECTION_MODEL_FACTORY, { optional: true });
2146
+ autoFocus = inject(new HostAttributeToken('autofocus'), { optional: true });
2147
+ classes = inject(new HostAttributeToken('class'), { optional: true });
2148
+ _classList = {};
2149
+ _uid = `ng-select-${nextUniqueId++}`;
2150
+ bindLabel = this._config.bindLabel;
2151
+ bindValue = this._config.bindValue;
2152
+ placeholder = this._config.placeholder;
2153
+ fixedPlaceholder = this._config.fixedPlaceholder ?? false;
2154
+ appendTo = this._config.appendTo;
2155
+ panelPosition = 'auto';
2156
+ panelDisabled = false;
2157
+ readonly = false;
2158
+ multiple = false;
2159
+ searchable = true;
2160
+ clearable = true;
2161
+ clearOnBackspace = true;
2162
+ clearAllText = this._config.clearAllText;
2163
+ loading = false;
2164
+ loadingText = this._config.loadingText;
2165
+ closeOnSelect = true;
2166
+ hideSelected = false;
2167
+ selectOnTab = false;
2168
+ openOnEnter = this._config.openOnEnter;
2169
+ virtualScroll = this._config.virtualScroll;
2170
+ bufferAmount = 4;
2171
+ selectableGroup = false;
2172
+ selectableGroupAsModel = true;
2173
+ searchWhileComposing = true;
2174
+ editableSearchTerm = false;
2175
+ maxSelectedItems = Infinity;
2176
+ minTermLength = 0;
2177
+ markFirst = true;
2178
+ preventToggleOnRightClick = false;
2179
+ addTag = false;
2180
+ addTagText = this._config.addTagText;
2181
+ notFoundText = this._config.notFoundText;
2182
+ typeahead;
2183
+ typeToSearchText = this._config.typeToSearchText;
2184
+ groupBy;
2185
+ groupValue;
2186
+ searchFn = null;
2187
+ keyDownFn = (e) => true;
2188
+ trackByFn = null;
2189
+ appearance = this._config.appearance;
2190
+ tabIndex;
2191
+ ariaLabel;
2192
+ ariaLabelledby;
2193
+ ariaDescribedby;
2194
+ inputAttrs = {};
2158
2195
  set panelClass(value) {
2159
2196
  const newClassList = {};
2160
2197
  this.classes?.split(/\s+/).forEach(c => (newClassList[c] = true));
@@ -2176,6 +2213,7 @@ class NgSelect {
2176
2213
  set inputId(value) {
2177
2214
  this._inputId = value;
2178
2215
  }
2216
+ _inputId;
2179
2217
  get items() {
2180
2218
  return this._items;
2181
2219
  }
@@ -2183,9 +2221,11 @@ class NgSelect {
2183
2221
  this._itemsAreUsed = true;
2184
2222
  this._items = value ?? [];
2185
2223
  }
2224
+ _items = [];
2186
2225
  get disabled() {
2187
2226
  return this.readonly || this._disabled;
2188
2227
  }
2228
+ _disabled = false;
2189
2229
  get compareWith() {
2190
2230
  return this._compareWith;
2191
2231
  }
@@ -2195,18 +2235,65 @@ class NgSelect {
2195
2235
  }
2196
2236
  this._compareWith = fn;
2197
2237
  }
2238
+ _compareWith;
2198
2239
  get clearSearchOnAdd() {
2199
2240
  return this._clearSearchOnAdd ?? this.closeOnSelect;
2200
2241
  }
2201
2242
  set clearSearchOnAdd(value) {
2202
2243
  this._clearSearchOnAdd = value;
2203
2244
  }
2245
+ _clearSearchOnAdd = this._config.clearSearchOnAdd;
2204
2246
  get deselectOnClick() {
2205
2247
  return this._deselectOnClick ?? this.multiple;
2206
2248
  }
2207
2249
  set deselectOnClick(value) {
2208
2250
  this._deselectOnClick = value;
2209
2251
  }
2252
+ _deselectOnClick = this._config.deselectOnClick;
2253
+ // output events
2254
+ blurEvent = new EventEmitter();
2255
+ focusEvent = new EventEmitter();
2256
+ changeEvent = new EventEmitter();
2257
+ openEvent = new EventEmitter();
2258
+ closeEvent = new EventEmitter();
2259
+ searchEvent = new EventEmitter();
2260
+ clearEvent = new EventEmitter();
2261
+ addEvent = new EventEmitter();
2262
+ removeEvent = new EventEmitter();
2263
+ scroll = new EventEmitter();
2264
+ scrollToEnd = new EventEmitter();
2265
+ dropdownPanel;
2266
+ searchInput;
2267
+ clearButton;
2268
+ ngOptions;
2269
+ // custom templates
2270
+ optionTemplate;
2271
+ optgroupTemplate;
2272
+ labelTemplate;
2273
+ multiLabelTemplate;
2274
+ headerTemplate;
2275
+ footerTemplate;
2276
+ notFoundTemplate;
2277
+ placeholderTemplate;
2278
+ typeToSearchTemplate;
2279
+ loadingTextTemplate;
2280
+ tagTemplate;
2281
+ loadingSpinnerTemplate;
2282
+ clearButtonTemplate;
2283
+ itemsList = new ItemsList(this, this.newSelectionModel?.() ?? DefaultSelectionModelFactory());
2284
+ element = this._elementRef.nativeElement;
2285
+ viewPortItems = [];
2286
+ searchTerm = null;
2287
+ isOpen = false;
2288
+ focused = false;
2289
+ escapeHTML = true;
2290
+ _itemsAreUsed = false;
2291
+ _primitive;
2292
+ _pressedKeys = [];
2293
+ _isComposing = false;
2294
+ _defaultLabel = 'label';
2295
+ _destroy$ = new Subject();
2296
+ _keyPress$ = new Subject();
2210
2297
  get selectedItems() {
2211
2298
  return this.itemsList.selectedItems;
2212
2299
  }
@@ -2262,92 +2349,15 @@ class NgSelect {
2262
2349
  get listboxId() {
2263
2350
  return `${this._uid}-listbox`;
2264
2351
  }
2352
+ _onChange = (_) => { };
2353
+ _onTouched = () => { };
2354
+ trackByOption = (_, item) => {
2355
+ if (this.trackByFn) {
2356
+ return this.trackByFn(item.value);
2357
+ }
2358
+ return item;
2359
+ };
2265
2360
  constructor() {
2266
- this._cdr = inject(ChangeDetectorRef);
2267
- this._elementRef = inject(ElementRef);
2268
- this._config = inject(NgSelectConfig);
2269
- this.newSelectionModel = inject(SELECTION_MODEL_FACTORY, { optional: true });
2270
- this.autoFocus = inject(new HostAttributeToken('autofocus'), { optional: true });
2271
- this.classes = inject(new HostAttributeToken('class'), { optional: true });
2272
- this._classList = {};
2273
- this._uid = `ng-select-${nextUniqueId++}`;
2274
- this.bindLabel = this._config.bindLabel;
2275
- this.bindValue = this._config.bindValue;
2276
- this.placeholder = this._config.placeholder;
2277
- this.fixedPlaceholder = this._config.fixedPlaceholder ?? false;
2278
- this.appendTo = this._config.appendTo;
2279
- this.panelPosition = 'auto';
2280
- this.readonly = false;
2281
- this.multiple = false;
2282
- this.searchable = true;
2283
- this.clearable = true;
2284
- this.clearOnBackspace = true;
2285
- this.clearAllText = this._config.clearAllText;
2286
- this.loading = false;
2287
- this.loadingText = this._config.loadingText;
2288
- this.closeOnSelect = true;
2289
- this.hideSelected = false;
2290
- this.selectOnTab = false;
2291
- this.openOnEnter = this._config.openOnEnter;
2292
- this.virtualScroll = this._config.virtualScroll;
2293
- this.bufferAmount = 4;
2294
- this.selectableGroup = false;
2295
- this.selectableGroupAsModel = true;
2296
- this.searchWhileComposing = true;
2297
- this.editableSearchTerm = false;
2298
- this.maxSelectedItems = Infinity;
2299
- this.minTermLength = 0;
2300
- this.markFirst = true;
2301
- this.preventToggleOnRightClick = false;
2302
- this.addTag = false;
2303
- this.addTagText = this._config.addTagText;
2304
- this.notFoundText = this._config.notFoundText;
2305
- this.typeToSearchText = this._config.typeToSearchText;
2306
- this.searchFn = null;
2307
- this.keyDownFn = (_) => true;
2308
- this.trackByFn = null;
2309
- this.appearance = this._config.appearance;
2310
- this.inputAttrs = {};
2311
- // isOpen should allow undefined value, so avoid using booleanAttribute!
2312
- this.isOpen = false;
2313
- this._items = [];
2314
- this._disabled = false;
2315
- this._clearSearchOnAdd = this._config.clearSearchOnAdd;
2316
- this._deselectOnClick = this._config.deselectOnClick;
2317
- // output events
2318
- this.blurEvent = new EventEmitter();
2319
- this.focusEvent = new EventEmitter();
2320
- this.changeEvent = new EventEmitter();
2321
- this.openEvent = new EventEmitter();
2322
- this.closeEvent = new EventEmitter();
2323
- this.searchEvent = new EventEmitter();
2324
- this.clearEvent = new EventEmitter();
2325
- this.addEvent = new EventEmitter();
2326
- this.removeEvent = new EventEmitter();
2327
- this.scroll = new EventEmitter();
2328
- this.scrollToEnd = new EventEmitter();
2329
- this.itemsList = new ItemsList(this, this.newSelectionModel?.() ?? DefaultSelectionModelFactory());
2330
- this.element = this._elementRef.nativeElement;
2331
- this.viewPortItems = [];
2332
- this.searchTerm = null;
2333
- this.escapeHTML = true;
2334
- this._pressedKeys = [];
2335
- this._isComposing = false;
2336
- this._defaultLabel = 'label';
2337
- this._destroy$ = new Subject();
2338
- this._keyPress$ = new Subject();
2339
- this._onChange = (_) => { };
2340
- this._onTouched = () => { };
2341
- this.trackByOption = (_, item) => {
2342
- if (this.trackByFn) {
2343
- return this.trackByFn(item.value);
2344
- }
2345
- return item;
2346
- };
2347
- this.clearItem = (item) => {
2348
- const option = this.selectedItems.find(x => x.value === item);
2349
- this.unselect(option);
2350
- };
2351
2361
  this.classes?.split(/\s+/).forEach(c => (this._classList[c] = true));
2352
2362
  }
2353
2363
  ngOnInit() {
@@ -2361,9 +2371,6 @@ class NgSelect {
2361
2371
  if (changes['items']) {
2362
2372
  this._setItems(changes['items'].currentValue || []);
2363
2373
  }
2364
- if (changes['isOpen']) {
2365
- this._manualOpen = isDefined(changes['isOpen'].currentValue);
2366
- }
2367
2374
  if (changes['groupBy']) {
2368
2375
  if (!changes['items']) {
2369
2376
  this._setItems([...this.items]);
@@ -2401,6 +2408,10 @@ class NgSelect {
2401
2408
  this._disabled = isDisabled;
2402
2409
  this._cdr.markForCheck();
2403
2410
  }
2411
+ clearItem = (item) => {
2412
+ const option = this.selectedItems.find(x => x.value === item);
2413
+ this.unselect(option);
2414
+ };
2404
2415
  handleKeyDown(e) {
2405
2416
  const keyName = e.key;
2406
2417
  if (Object.values(KeyCode).includes(keyName)) {
@@ -2519,7 +2530,7 @@ class NgSelect {
2519
2530
  }
2520
2531
  }
2521
2532
  open() {
2522
- if (this.disabled || this.isOpen || this._manualOpen) {
2533
+ if (this.disabled || this.isOpen || this.panelDisabled) {
2523
2534
  return;
2524
2535
  }
2525
2536
  if (!this._isTypeahead && !this.addTag && this.itemsList.noItemsToSelect) {
@@ -2534,7 +2545,7 @@ class NgSelect {
2534
2545
  this.detectChanges();
2535
2546
  }
2536
2547
  close() {
2537
- if (!this.isOpen || this._manualOpen) {
2548
+ if (!this.isOpen || this.panelDisabled) {
2538
2549
  return;
2539
2550
  }
2540
2551
  this.isOpen = false;
@@ -2899,7 +2910,7 @@ class NgSelect {
2899
2910
  }
2900
2911
  }
2901
2912
  _handleEnter(e) {
2902
- if (this.isOpen || this._manualOpen) {
2913
+ if (this.isOpen || this.panelDisabled) {
2903
2914
  if (this.itemsList.markedItem) {
2904
2915
  this.toggleItem(this.itemsList.markedItem);
2905
2916
  }
@@ -2916,7 +2927,7 @@ class NgSelect {
2916
2927
  e.preventDefault();
2917
2928
  }
2918
2929
  _handleSpace(e) {
2919
- if (this.isOpen || this._manualOpen) {
2930
+ if (this.isOpen || this.panelDisabled) {
2920
2931
  return;
2921
2932
  }
2922
2933
  this.open();
@@ -2966,14 +2977,14 @@ class NgSelect {
2966
2977
  this.clearModel();
2967
2978
  }
2968
2979
  }
2969
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelect, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2970
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgSelect, isStandalone: true, selector: "ng-select", inputs: { bindLabel: "bindLabel", bindValue: "bindValue", placeholder: "placeholder", fixedPlaceholder: "fixedPlaceholder", appendTo: "appendTo", panelPosition: "panelPosition", readonly: ["readonly", "readonly", booleanAttribute], multiple: ["multiple", "multiple", booleanAttribute], searchable: ["searchable", "searchable", booleanAttribute], clearable: ["clearable", "clearable", booleanAttribute], clearOnBackspace: ["clearOnBackspace", "clearOnBackspace", booleanAttribute], clearAllText: "clearAllText", loading: ["loading", "loading", booleanAttribute], loadingText: "loadingText", closeOnSelect: ["closeOnSelect", "closeOnSelect", booleanAttribute], hideSelected: ["hideSelected", "hideSelected", booleanAttribute], selectOnTab: ["selectOnTab", "selectOnTab", booleanAttribute], openOnEnter: ["openOnEnter", "openOnEnter", booleanAttribute], virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], bufferAmount: ["bufferAmount", "bufferAmount", numberAttribute], selectableGroup: ["selectableGroup", "selectableGroup", booleanAttribute], selectableGroupAsModel: ["selectableGroupAsModel", "selectableGroupAsModel", booleanAttribute], searchWhileComposing: ["searchWhileComposing", "searchWhileComposing", booleanAttribute], editableSearchTerm: ["editableSearchTerm", "editableSearchTerm", booleanAttribute], maxSelectedItems: ["maxSelectedItems", "maxSelectedItems", numberAttribute], minTermLength: ["minTermLength", "minTermLength", numberAttribute], markFirst: ["markFirst", "markFirst", booleanAttribute], preventToggleOnRightClick: ["preventToggleOnRightClick", "preventToggleOnRightClick", booleanAttribute], addTag: "addTag", addTagText: "addTagText", notFoundText: "notFoundText", typeahead: "typeahead", typeToSearchText: "typeToSearchText", groupBy: "groupBy", groupValue: "groupValue", searchFn: "searchFn", keyDownFn: "keyDownFn", trackByFn: "trackByFn", appearance: "appearance", tabIndex: ["tabIndex", "tabIndex", numberAttribute], ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", ariaDescribedby: "ariaDescribedby", inputAttrs: "inputAttrs", isOpen: "isOpen", panelClass: "panelClass", inputId: "inputId", 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-single": "!multiple", "class.ng-select-multiple": "multiple", "class.ng-select-typeahead": "typeahead", "class.ng-select-taggable": "addTag", "class.ng-select-searchable": "searchable", "class.ng-select-clearable": "clearable", "class.ng-select-opened": "isOpen", "class.ng-select-filtered": "filtered", "class.ng-select-disabled": "disabled" }, classAttribute: "ng-select" }, providers: [
2980
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
2981
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgSelect, isStandalone: true, selector: "ng-select", inputs: { bindLabel: "bindLabel", bindValue: "bindValue", placeholder: "placeholder", fixedPlaceholder: "fixedPlaceholder", appendTo: "appendTo", panelPosition: "panelPosition", panelDisabled: ["panelDisabled", "panelDisabled", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], multiple: ["multiple", "multiple", booleanAttribute], searchable: ["searchable", "searchable", booleanAttribute], clearable: ["clearable", "clearable", booleanAttribute], clearOnBackspace: ["clearOnBackspace", "clearOnBackspace", booleanAttribute], clearAllText: "clearAllText", loading: ["loading", "loading", booleanAttribute], loadingText: "loadingText", closeOnSelect: ["closeOnSelect", "closeOnSelect", booleanAttribute], hideSelected: ["hideSelected", "hideSelected", booleanAttribute], selectOnTab: ["selectOnTab", "selectOnTab", booleanAttribute], openOnEnter: ["openOnEnter", "openOnEnter", booleanAttribute], virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], bufferAmount: ["bufferAmount", "bufferAmount", numberAttribute], selectableGroup: ["selectableGroup", "selectableGroup", booleanAttribute], selectableGroupAsModel: ["selectableGroupAsModel", "selectableGroupAsModel", booleanAttribute], searchWhileComposing: ["searchWhileComposing", "searchWhileComposing", booleanAttribute], editableSearchTerm: ["editableSearchTerm", "editableSearchTerm", booleanAttribute], maxSelectedItems: ["maxSelectedItems", "maxSelectedItems", numberAttribute], minTermLength: ["minTermLength", "minTermLength", numberAttribute], markFirst: ["markFirst", "markFirst", booleanAttribute], preventToggleOnRightClick: ["preventToggleOnRightClick", "preventToggleOnRightClick", booleanAttribute], addTag: "addTag", addTagText: "addTagText", notFoundText: "notFoundText", typeahead: "typeahead", typeToSearchText: "typeToSearchText", groupBy: "groupBy", groupValue: "groupValue", searchFn: "searchFn", keyDownFn: "keyDownFn", trackByFn: "trackByFn", appearance: "appearance", tabIndex: ["tabIndex", "tabIndex", numberAttribute], ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", ariaDescribedby: "ariaDescribedby", inputAttrs: "inputAttrs", panelClass: "panelClass", inputId: "inputId", items: "items", compareWith: "compareWith", clearSearchOnAdd: ["clearSearchOnAdd", "clearSearchOnAdd", booleanAttribute], deselectOnClick: ["deselectOnClick", "deselectOnClick", booleanAttribute] }, 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-single": "!multiple", "class.ng-select-multiple": "multiple", "class.ng-select-typeahead": "typeahead", "class.ng-select-taggable": "addTag", "class.ng-select-searchable": "searchable", "class.ng-select-clearable": "clearable", "class.ng-select-opened": "isOpen", "class.ng-select-filtered": "filtered", "class.ng-select-disabled": "disabled" }, classAttribute: "ng-select" }, providers: [
2971
2982
  {
2972
2983
  provide: NG_VALUE_ACCESSOR,
2973
2984
  useExisting: forwardRef(() => NgSelect),
2974
2985
  multi: true,
2975
2986
  },
2976
- ], queries: [{ propertyName: "optionTemplate", first: true, predicate: NgOptionTemplate, descendants: true, read: TemplateRef }, { propertyName: "optgroupTemplate", first: true, predicate: NgOptgroupTemplate, descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: NgLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "multiLabelTemplate", first: true, predicate: NgMultiLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "headerTemplate", first: true, predicate: NgHeaderTemplate, descendants: true, read: TemplateRef }, { propertyName: "footerTemplate", first: true, predicate: NgFooterTemplate, descendants: true, read: TemplateRef }, { propertyName: "notFoundTemplate", first: true, predicate: NgNotFoundTemplate, descendants: true, read: TemplateRef }, { propertyName: "placeholderTemplate", first: true, predicate: NgPlaceholderTemplate, descendants: true, read: TemplateRef }, { propertyName: "typeToSearchTemplate", first: true, predicate: NgTypeToSearchTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingTextTemplate", first: true, predicate: NgLoadingTextTemplate, descendants: true, read: TemplateRef }, { propertyName: "tagTemplate", first: true, predicate: NgTagTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingSpinnerTemplate", first: true, predicate: NgLoadingSpinnerTemplate, descendants: true, read: TemplateRef }, { propertyName: "clearButtonTemplate", first: true, predicate: NgClearButtonTemplate, descendants: true, read: TemplateRef }, { propertyName: "ngOptions", predicate: NgOption, descendants: true }], viewQueries: [{ propertyName: "dropdownPanel", first: true, predicate: i0.forwardRef(() => NgDropdownPanel), 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: "<!-- eslint-disable @angular-eslint/template/role-has-required-aria -->\n<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/mouse-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<div\n class=\"ng-select-container\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n (mousedown)=\"handleMousedown($event)\"\n>\n <div class=\"ng-value-container\">\n @if ((selectedItems.length === 0 && !searchTerm) || fixedPlaceholder) {\n <ng-template #defaultPlaceholderTemplate>\n <div class=\"ng-placeholder\">{{ placeholder }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate || defaultPlaceholderTemplate\" />\n }\n\n @if ((!multiLabelTemplate || !multiple) && selectedItems.length > 0) {\n @for (item of selectedItems; track trackByOption($index, item)) {\n <div class=\"ng-value\" [class.ng-value-disabled]=\"item.disabled\">\n <ng-template #defaultLabelTemplate>\n <span\n class=\"ng-value-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n <span class=\"ng-value-remove\" (click)=\"unselect(item)\" role=\"button\">\u00D7</span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\"\n />\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 />\n }\n\n <div class=\"ng-input\">\n <input\n #searchInput\n [disabled]=\"disabled\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [value]=\"searchTerm ?? ''\"\n (change)=\"$event.stopPropagation()\"\n (input)=\"filter(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n [tabIndex]=\"tabIndex\"\n [attr.id]=\"inputId\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? listboxId : null\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList.markedItem?.htmlId : null\"\n aria-haspopup=\"listbox\"\n aria-autocomplete=\"list\"\n role=\"combobox\"\n />\n </div>\n </div>\n\n @if (loading) {\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-select-spinner\"></div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\" />\n }\n\n @if (showClearButton) {\n @if (clearButtonTemplate) {\n <ng-container [ngTemplateOutlet]=\"clearButtonTemplate\" />\n } @else {\n <span #clearButton class=\"ng-clear-wrapper\" [title]=\"clearAllText\" aria-hidden=\"true\">\n <span class=\"ng-clear\">\u00D7</span>\n </span>\n }\n }\n\n <span class=\"ng-arrow-wrapper\" aria-hidden=\"true\">\n <span class=\"ng-arrow\"></span>\n </span>\n</div>\n\n@if (isOpen) {\n <ng-dropdown-panel\n class=\"ng-dropdown-panel\"\n [class.ng-select-multiple]=\"multiple\"\n [class]=\"appendTo ? _classList : null\"\n [listboxId]=\"listboxId\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"panelPosition\"\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()\"\n (outsideClick)=\"close()\"\n >\n @for (item of viewPortItems; track trackByOption($index, item)) {\n <div\n class=\"ng-option\"\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.id]=\"item?.htmlId\"\n [attr.role]=\"item.children ? 'group' : 'option'\"\n [attr.aria-selected]=\"item.selected\"\n [attr.aria-setsize]=\"itemsList.filteredItems.length\"\n [attr.aria-posinset]=\"item.index! + 1\"\n (click)=\"toggleItem(item)\"\n (mouseover)=\"onItemHover(item)\"\n >\n <ng-template #defaultOptionTemplate>\n <span\n class=\"ng-option-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"\n item.children\n ? optgroupTemplate || defaultOptionTemplate\n : optionTemplate || defaultOptionTemplate\n \"\n [ngTemplateOutletContext]=\"{\n item: item.value,\n item$: item,\n index: item.index,\n searchTerm: searchTerm,\n }\"\n />\n </div>\n }\n\n @if (showAddTag) {\n <div\n class=\"ng-option\"\n [class.ng-option-marked]=\"!itemsList.markedItem\"\n (click)=\"selectTag()\"\n (mouseover)=\"itemsList.unmarkItem()\"\n role=\"option\"\n >\n <ng-template #defaultTagTemplate>\n <span>\n <span class=\"ng-tag-label\">{{ addTagText }}</span>\n \"{{ searchTerm }}\"\n </span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\"\n />\n </div>\n }\n\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 />\n }\n @if (showTypeToSearch) {\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ typeToSearchText }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\" />\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 />\n }\n </ng-dropdown-panel>\n}\n\n<!-- Always present aria-live region -->\n<div class=\"ng-select-visually-hidden\" aria-atomic=\"true\" aria-live=\"polite\" role=\"status\">\n @if (isOpen && showNoItemsFound) {\n {{ notFoundText }}\n }\n</div>\n", styles: ["@charset \"UTF-8\";.ng-select{position:relative;display:block}.ng-select [hidden]{display:none}.ng-select.ng-select-searchable .ng-input{opacity:1}.ng-select.ng-select-opened .ng-select-container{z-index:1001}.ng-select.ng-select-disabled .ng-placeholder,.ng-select.ng-select-disabled .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,.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{box-sizing:border-box;position:relative;display:flex;width:100%;outline:none;overflow:hidden;cursor:default}.ng-select .ng-value-container{display:flex;flex:1}.ng-select .ng-input{box-sizing:border-box;opacity:0}.ng-select .ng-input>input{width:100%;padding:0;background:transparent;border:none;box-shadow:none;outline:none;cursor:default}.ng-select .ng-input>input::-ms-clear{display:none}.ng-select .ng-input>input[readonly]{-webkit-user-select:unset;user-select:unset;width:0;padding:0}.ng-select.ng-select-single.ng-select-filtered .ng-value{visibility:hidden}.ng-select.ng-select-single .ng-value-container,.ng-select.ng-select-single .ng-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-select.ng-select-single .ng-value-remove{display:none}.ng-select.ng-select-single .ng-input{position:absolute;left:0;width:100%}.ng-select.ng-select-multiple.ng-select-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-value-container{flex-wrap:wrap}.ng-select.ng-select-multiple .ng-placeholder{position:absolute;z-index:1}.ng-select.ng-select-multiple .ng-value{white-space:nowrap}.ng-select.ng-select-multiple .ng-value-remove{cursor:pointer}.ng-select.ng-select-multiple .ng-value-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-input{flex:1;z-index:2}.ng-select .ng-clear-wrapper{cursor:pointer;position:relative;width:17px;-webkit-user-select:none;user-select:none}.ng-select .ng-clear{display:inline-block;font-size:18px;line-height:1;pointer-events:none}.ng-select .ng-arrow-wrapper{position:relative;text-align:center;-webkit-user-select:none;user-select:none;cursor:pointer}.ng-select .ng-arrow{position:relative;display:inline-block;height:0;width:0;pointer-events:none}.ng-dropdown-panel{box-sizing:border-box;position:absolute;z-index:1050;width:100%;opacity:0;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .ng-dropdown-panel-items{display:block;height:auto;max-height:240px;overflow-y:auto}.ng-dropdown-panel .ng-optgroup,.ng-dropdown-panel .ng-option{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-option{display:block;cursor:pointer}.ng-dropdown-panel .ng-option.disabled{cursor:default}.ng-dropdown-panel .ng-option .highlighted{font-weight:700;text-decoration:underline}.ng-dropdown-panel .ng-option-label:empty:before{content:\"\\200b\"}.ng-select-virtual-scroll-host{position:relative;display:block;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.ng-select-virtual-scroll-content{position:absolute;top:0;left:0;width:100%;height:100%}.ng-select-virtual-scroll-spacer{width:1px;opacity:0}.ng-select-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip-path:rect(0 0 0 0);white-space:nowrap}.ng-select-spinner{position:relative;width:16px;height:16px;margin:0 4px;font-size:10px;text-indent:-9999em;border-radius:50%;border:2px solid rgba(66,66,66,.2);border-left-color:#424242;animation:load8 .8s infinite linear}@keyframes load8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgItemLabel, selector: "[ngItemLabel]", inputs: ["ngItemLabel", "escape"] }, { kind: "component", type: NgDropdownPanel, selector: "ng-dropdown-panel", inputs: ["listboxId", "items", "markedItem", "position", "appendTo", "bufferAmount", "virtualScroll", "headerTemplate", "footerTemplate", "filterValue"], outputs: ["update", "scroll", "scrollToEnd", "outsideClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2987
+ ], queries: [{ propertyName: "optionTemplate", first: true, predicate: NgOptionTemplate, descendants: true, read: TemplateRef }, { propertyName: "optgroupTemplate", first: true, predicate: NgOptgroupTemplate, descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: NgLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "multiLabelTemplate", first: true, predicate: NgMultiLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "headerTemplate", first: true, predicate: NgHeaderTemplate, descendants: true, read: TemplateRef }, { propertyName: "footerTemplate", first: true, predicate: NgFooterTemplate, descendants: true, read: TemplateRef }, { propertyName: "notFoundTemplate", first: true, predicate: NgNotFoundTemplate, descendants: true, read: TemplateRef }, { propertyName: "placeholderTemplate", first: true, predicate: NgPlaceholderTemplate, descendants: true, read: TemplateRef }, { propertyName: "typeToSearchTemplate", first: true, predicate: NgTypeToSearchTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingTextTemplate", first: true, predicate: NgLoadingTextTemplate, descendants: true, read: TemplateRef }, { propertyName: "tagTemplate", first: true, predicate: NgTagTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingSpinnerTemplate", first: true, predicate: NgLoadingSpinnerTemplate, descendants: true, read: TemplateRef }, { propertyName: "clearButtonTemplate", first: true, predicate: NgClearButtonTemplate, descendants: true, read: TemplateRef }, { propertyName: "ngOptions", predicate: NgOption, descendants: true }], viewQueries: [{ propertyName: "dropdownPanel", first: true, predicate: i0.forwardRef(() => NgDropdownPanel), 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: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/mouse-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<div\n class=\"ng-select-container\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n (mousedown)=\"handleMousedown($event)\"\n>\n <div class=\"ng-value-container\">\n @if ((selectedItems.length === 0 && !searchTerm) || fixedPlaceholder) {\n <ng-template #defaultPlaceholderTemplate>\n <div class=\"ng-placeholder\">{{ placeholder }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate || defaultPlaceholderTemplate\" />\n }\n\n @if ((!multiLabelTemplate || !multiple) && selectedItems.length > 0) {\n @for (item of selectedItems; track trackByOption($index, item)) {\n <div class=\"ng-value\" [class.ng-value-disabled]=\"item.disabled\">\n <ng-template #defaultLabelTemplate>\n <span\n class=\"ng-value-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n <span class=\"ng-value-remove\" (click)=\"unselect(item)\" role=\"button\">\u00D7</span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\"\n />\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 />\n }\n\n <div class=\"ng-input\">\n <input\n #searchInput\n [disabled]=\"disabled\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [value]=\"searchTerm ?? ''\"\n (change)=\"$event.stopPropagation()\"\n (input)=\"filter(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n [tabIndex]=\"tabIndex\"\n [attr.id]=\"inputId\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-haspopup]=\"panelDisabled ? 'false' : 'listbox'\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? listboxId : null\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList.markedItem?.htmlId : null\"\n aria-autocomplete=\"list\"\n role=\"combobox\"\n />\n </div>\n </div>\n\n @if (loading) {\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-select-spinner\"></div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\" />\n }\n\n @if (showClearButton) {\n @if (clearButtonTemplate) {\n <ng-container [ngTemplateOutlet]=\"clearButtonTemplate\" />\n } @else {\n <span #clearButton class=\"ng-clear-wrapper\" [title]=\"clearAllText\" aria-hidden=\"true\">\n <span class=\"ng-clear\">\u00D7</span>\n </span>\n }\n }\n\n @if (!panelDisabled) {\n <span class=\"ng-arrow-wrapper\" aria-hidden=\"true\">\n <span class=\"ng-arrow\"></span>\n </span>\n }\n</div>\n\n@if (isOpen) {\n <ng-dropdown-panel\n class=\"ng-dropdown-panel\"\n [class.ng-select-multiple]=\"multiple\"\n [class]=\"appendTo ? _classList : null\"\n [listboxId]=\"listboxId\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"panelPosition\"\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()\"\n (outsideClick)=\"close()\"\n >\n @for (item of viewPortItems; track trackByOption($index, item)) {\n <div\n class=\"ng-option\"\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.id]=\"item?.htmlId\"\n [attr.role]=\"item.children ? 'group' : 'option'\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.aria-selected]=\"item.selected\"\n [attr.aria-setsize]=\"itemsList.filteredItems.length\"\n [attr.aria-posinset]=\"(item.index || 0) + 1\"\n (click)=\"toggleItem(item)\"\n (mouseover)=\"onItemHover(item)\"\n >\n <ng-template #defaultOptionTemplate>\n <span\n class=\"ng-option-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"\n item.children\n ? optgroupTemplate || defaultOptionTemplate\n : optionTemplate || defaultOptionTemplate\n \"\n [ngTemplateOutletContext]=\"{\n item: item.value,\n item$: item,\n index: item.index,\n searchTerm: searchTerm,\n }\"\n />\n </div>\n }\n\n @if (showAddTag) {\n <div\n class=\"ng-option\"\n [class.ng-option-marked]=\"!itemsList.markedItem\"\n role=\"option\"\n [attr.aria-disabled]=\"false\"\n [attr.aria-selected]=\"false\"\n (click)=\"selectTag()\"\n (mouseover)=\"itemsList.unmarkItem()\"\n >\n <ng-template #defaultTagTemplate>\n <span>\n <span class=\"ng-tag-label\">{{ addTagText }}</span>\n \"{{ searchTerm }}\"\n </span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\"\n />\n </div>\n }\n\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 />\n }\n @if (showTypeToSearch) {\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ typeToSearchText }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\" />\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 />\n }\n </ng-dropdown-panel>\n}\n\n<!-- Always present aria-live region -->\n<div class=\"ng-select-visually-hidden\" aria-atomic=\"true\" aria-live=\"polite\" role=\"status\">\n @if (isOpen && showNoItemsFound) {\n {{ notFoundText }}\n }\n</div>\n", styles: ["@charset \"UTF-8\";.ng-select{position:relative;display:block}.ng-select.ng-select-searchable .ng-input{opacity:1}.ng-select.ng-select-opened .ng-select-container{z-index:1001}.ng-select.ng-select-disabled .ng-placeholder,.ng-select.ng-select-disabled .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,.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{box-sizing:border-box;position:relative;display:flex;width:100%;outline:none;overflow:hidden;cursor:default}.ng-select .ng-value-container{display:flex;flex:1}.ng-select .ng-input{box-sizing:border-box;opacity:0}.ng-select .ng-input>input{width:100%;padding:0;background:transparent;border:none;box-shadow:none;outline:none;cursor:default}.ng-select .ng-input>input::-ms-clear{display:none}.ng-select .ng-input>input[readonly]{-webkit-user-select:unset;user-select:unset;width:0;padding:0}.ng-select.ng-select-single.ng-select-filtered .ng-value{visibility:hidden}.ng-select.ng-select-single .ng-value-container,.ng-select.ng-select-single .ng-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-select.ng-select-single .ng-value-remove{display:none}.ng-select.ng-select-single .ng-input{position:absolute;left:0;width:100%}.ng-select.ng-select-multiple.ng-select-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-value-container{flex-wrap:wrap}.ng-select.ng-select-multiple .ng-placeholder{position:absolute;z-index:1}.ng-select.ng-select-multiple .ng-value{white-space:nowrap}.ng-select.ng-select-multiple .ng-value-remove{cursor:pointer}.ng-select.ng-select-multiple .ng-value-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-input{flex:1;z-index:2}.ng-select .ng-clear-wrapper{cursor:pointer;position:relative;width:17px;-webkit-user-select:none;user-select:none}.ng-select .ng-clear{display:inline-block;font-size:18px;line-height:1;pointer-events:none}.ng-select .ng-arrow-wrapper{position:relative;text-align:center;-webkit-user-select:none;user-select:none;cursor:pointer}.ng-select .ng-arrow{position:relative;display:inline-block;height:0;width:0;pointer-events:none}.ng-dropdown-panel{box-sizing:border-box;position:absolute;z-index:1050;width:100%;opacity:0;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .ng-dropdown-panel-items{display:block;height:auto;max-height:240px;overflow-y:auto}.ng-dropdown-panel .ng-optgroup,.ng-dropdown-panel .ng-option{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-option{display:block;cursor:pointer}.ng-dropdown-panel .ng-option.disabled{cursor:default}.ng-dropdown-panel .ng-option .highlighted{font-weight:700;text-decoration:underline}.ng-dropdown-panel .ng-option-label:empty:before{content:\"\\200b\"}.ng-select-virtual-scroll-host{position:relative;display:block;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.ng-select-virtual-scroll-content{position:absolute;top:0;left:0;width:100%;height:100%}.ng-select-virtual-scroll-spacer{width:1px;opacity:0}.ng-select-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip-path:rect(0 0 0 0);white-space:nowrap}.ng-select-spinner{position:relative;width:16px;height:16px;margin:0 4px;font-size:10px;text-indent:-9999em;border-radius:50%;border:2px solid rgba(66,66,66,.2);border-left-color:#424242;animation:load8 .8s infinite linear}@keyframes load8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgItemLabel, selector: "[ngItemLabel]", inputs: ["ngItemLabel", "escape"] }, { kind: "component", type: NgDropdownPanel, selector: "ng-dropdown-panel", inputs: ["listboxId", "items", "markedItem", "position", "appendTo", "bufferAmount", "virtualScroll", "headerTemplate", "footerTemplate", "filterValue"], outputs: ["update", "scroll", "scrollToEnd", "outsideClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
2977
2988
  }
2978
2989
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelect, decorators: [{
2979
2990
  type: Component,
@@ -2995,7 +3006,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
2995
3006
  useExisting: forwardRef(() => NgSelect),
2996
3007
  multi: true,
2997
3008
  },
2998
- ], template: "<!-- eslint-disable @angular-eslint/template/role-has-required-aria -->\n<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/mouse-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<div\n class=\"ng-select-container\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n (mousedown)=\"handleMousedown($event)\"\n>\n <div class=\"ng-value-container\">\n @if ((selectedItems.length === 0 && !searchTerm) || fixedPlaceholder) {\n <ng-template #defaultPlaceholderTemplate>\n <div class=\"ng-placeholder\">{{ placeholder }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate || defaultPlaceholderTemplate\" />\n }\n\n @if ((!multiLabelTemplate || !multiple) && selectedItems.length > 0) {\n @for (item of selectedItems; track trackByOption($index, item)) {\n <div class=\"ng-value\" [class.ng-value-disabled]=\"item.disabled\">\n <ng-template #defaultLabelTemplate>\n <span\n class=\"ng-value-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n <span class=\"ng-value-remove\" (click)=\"unselect(item)\" role=\"button\">\u00D7</span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\"\n />\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 />\n }\n\n <div class=\"ng-input\">\n <input\n #searchInput\n [disabled]=\"disabled\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [value]=\"searchTerm ?? ''\"\n (change)=\"$event.stopPropagation()\"\n (input)=\"filter(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n [tabIndex]=\"tabIndex\"\n [attr.id]=\"inputId\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? listboxId : null\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList.markedItem?.htmlId : null\"\n aria-haspopup=\"listbox\"\n aria-autocomplete=\"list\"\n role=\"combobox\"\n />\n </div>\n </div>\n\n @if (loading) {\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-select-spinner\"></div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\" />\n }\n\n @if (showClearButton) {\n @if (clearButtonTemplate) {\n <ng-container [ngTemplateOutlet]=\"clearButtonTemplate\" />\n } @else {\n <span #clearButton class=\"ng-clear-wrapper\" [title]=\"clearAllText\" aria-hidden=\"true\">\n <span class=\"ng-clear\">\u00D7</span>\n </span>\n }\n }\n\n <span class=\"ng-arrow-wrapper\" aria-hidden=\"true\">\n <span class=\"ng-arrow\"></span>\n </span>\n</div>\n\n@if (isOpen) {\n <ng-dropdown-panel\n class=\"ng-dropdown-panel\"\n [class.ng-select-multiple]=\"multiple\"\n [class]=\"appendTo ? _classList : null\"\n [listboxId]=\"listboxId\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"panelPosition\"\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()\"\n (outsideClick)=\"close()\"\n >\n @for (item of viewPortItems; track trackByOption($index, item)) {\n <div\n class=\"ng-option\"\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.id]=\"item?.htmlId\"\n [attr.role]=\"item.children ? 'group' : 'option'\"\n [attr.aria-selected]=\"item.selected\"\n [attr.aria-setsize]=\"itemsList.filteredItems.length\"\n [attr.aria-posinset]=\"item.index! + 1\"\n (click)=\"toggleItem(item)\"\n (mouseover)=\"onItemHover(item)\"\n >\n <ng-template #defaultOptionTemplate>\n <span\n class=\"ng-option-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"\n item.children\n ? optgroupTemplate || defaultOptionTemplate\n : optionTemplate || defaultOptionTemplate\n \"\n [ngTemplateOutletContext]=\"{\n item: item.value,\n item$: item,\n index: item.index,\n searchTerm: searchTerm,\n }\"\n />\n </div>\n }\n\n @if (showAddTag) {\n <div\n class=\"ng-option\"\n [class.ng-option-marked]=\"!itemsList.markedItem\"\n (click)=\"selectTag()\"\n (mouseover)=\"itemsList.unmarkItem()\"\n role=\"option\"\n >\n <ng-template #defaultTagTemplate>\n <span>\n <span class=\"ng-tag-label\">{{ addTagText }}</span>\n \"{{ searchTerm }}\"\n </span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\"\n />\n </div>\n }\n\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 />\n }\n @if (showTypeToSearch) {\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ typeToSearchText }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\" />\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 />\n }\n </ng-dropdown-panel>\n}\n\n<!-- Always present aria-live region -->\n<div class=\"ng-select-visually-hidden\" aria-atomic=\"true\" aria-live=\"polite\" role=\"status\">\n @if (isOpen && showNoItemsFound) {\n {{ notFoundText }}\n }\n</div>\n", styles: ["@charset \"UTF-8\";.ng-select{position:relative;display:block}.ng-select [hidden]{display:none}.ng-select.ng-select-searchable .ng-input{opacity:1}.ng-select.ng-select-opened .ng-select-container{z-index:1001}.ng-select.ng-select-disabled .ng-placeholder,.ng-select.ng-select-disabled .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,.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{box-sizing:border-box;position:relative;display:flex;width:100%;outline:none;overflow:hidden;cursor:default}.ng-select .ng-value-container{display:flex;flex:1}.ng-select .ng-input{box-sizing:border-box;opacity:0}.ng-select .ng-input>input{width:100%;padding:0;background:transparent;border:none;box-shadow:none;outline:none;cursor:default}.ng-select .ng-input>input::-ms-clear{display:none}.ng-select .ng-input>input[readonly]{-webkit-user-select:unset;user-select:unset;width:0;padding:0}.ng-select.ng-select-single.ng-select-filtered .ng-value{visibility:hidden}.ng-select.ng-select-single .ng-value-container,.ng-select.ng-select-single .ng-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-select.ng-select-single .ng-value-remove{display:none}.ng-select.ng-select-single .ng-input{position:absolute;left:0;width:100%}.ng-select.ng-select-multiple.ng-select-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-value-container{flex-wrap:wrap}.ng-select.ng-select-multiple .ng-placeholder{position:absolute;z-index:1}.ng-select.ng-select-multiple .ng-value{white-space:nowrap}.ng-select.ng-select-multiple .ng-value-remove{cursor:pointer}.ng-select.ng-select-multiple .ng-value-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-input{flex:1;z-index:2}.ng-select .ng-clear-wrapper{cursor:pointer;position:relative;width:17px;-webkit-user-select:none;user-select:none}.ng-select .ng-clear{display:inline-block;font-size:18px;line-height:1;pointer-events:none}.ng-select .ng-arrow-wrapper{position:relative;text-align:center;-webkit-user-select:none;user-select:none;cursor:pointer}.ng-select .ng-arrow{position:relative;display:inline-block;height:0;width:0;pointer-events:none}.ng-dropdown-panel{box-sizing:border-box;position:absolute;z-index:1050;width:100%;opacity:0;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .ng-dropdown-panel-items{display:block;height:auto;max-height:240px;overflow-y:auto}.ng-dropdown-panel .ng-optgroup,.ng-dropdown-panel .ng-option{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-option{display:block;cursor:pointer}.ng-dropdown-panel .ng-option.disabled{cursor:default}.ng-dropdown-panel .ng-option .highlighted{font-weight:700;text-decoration:underline}.ng-dropdown-panel .ng-option-label:empty:before{content:\"\\200b\"}.ng-select-virtual-scroll-host{position:relative;display:block;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.ng-select-virtual-scroll-content{position:absolute;top:0;left:0;width:100%;height:100%}.ng-select-virtual-scroll-spacer{width:1px;opacity:0}.ng-select-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip-path:rect(0 0 0 0);white-space:nowrap}.ng-select-spinner{position:relative;width:16px;height:16px;margin:0 4px;font-size:10px;text-indent:-9999em;border-radius:50%;border:2px solid rgba(66,66,66,.2);border-left-color:#424242;animation:load8 .8s infinite linear}@keyframes load8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
3009
+ ], template: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/mouse-events-have-key-events -->\n<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<div\n class=\"ng-select-container\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n (mousedown)=\"handleMousedown($event)\"\n>\n <div class=\"ng-value-container\">\n @if ((selectedItems.length === 0 && !searchTerm) || fixedPlaceholder) {\n <ng-template #defaultPlaceholderTemplate>\n <div class=\"ng-placeholder\">{{ placeholder }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate || defaultPlaceholderTemplate\" />\n }\n\n @if ((!multiLabelTemplate || !multiple) && selectedItems.length > 0) {\n @for (item of selectedItems; track trackByOption($index, item)) {\n <div class=\"ng-value\" [class.ng-value-disabled]=\"item.disabled\">\n <ng-template #defaultLabelTemplate>\n <span\n class=\"ng-value-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n <span class=\"ng-value-remove\" (click)=\"unselect(item)\" role=\"button\">\u00D7</span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\"\n />\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 />\n }\n\n <div class=\"ng-input\">\n <input\n #searchInput\n [disabled]=\"disabled\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [value]=\"searchTerm ?? ''\"\n (change)=\"$event.stopPropagation()\"\n (input)=\"filter(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n [tabIndex]=\"tabIndex\"\n [attr.id]=\"inputId\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-haspopup]=\"panelDisabled ? 'false' : 'listbox'\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? listboxId : null\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList.markedItem?.htmlId : null\"\n aria-autocomplete=\"list\"\n role=\"combobox\"\n />\n </div>\n </div>\n\n @if (loading) {\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-select-spinner\"></div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\" />\n }\n\n @if (showClearButton) {\n @if (clearButtonTemplate) {\n <ng-container [ngTemplateOutlet]=\"clearButtonTemplate\" />\n } @else {\n <span #clearButton class=\"ng-clear-wrapper\" [title]=\"clearAllText\" aria-hidden=\"true\">\n <span class=\"ng-clear\">\u00D7</span>\n </span>\n }\n }\n\n @if (!panelDisabled) {\n <span class=\"ng-arrow-wrapper\" aria-hidden=\"true\">\n <span class=\"ng-arrow\"></span>\n </span>\n }\n</div>\n\n@if (isOpen) {\n <ng-dropdown-panel\n class=\"ng-dropdown-panel\"\n [class.ng-select-multiple]=\"multiple\"\n [class]=\"appendTo ? _classList : null\"\n [listboxId]=\"listboxId\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"panelPosition\"\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()\"\n (outsideClick)=\"close()\"\n >\n @for (item of viewPortItems; track trackByOption($index, item)) {\n <div\n class=\"ng-option\"\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.id]=\"item?.htmlId\"\n [attr.role]=\"item.children ? 'group' : 'option'\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.aria-selected]=\"item.selected\"\n [attr.aria-setsize]=\"itemsList.filteredItems.length\"\n [attr.aria-posinset]=\"(item.index || 0) + 1\"\n (click)=\"toggleItem(item)\"\n (mouseover)=\"onItemHover(item)\"\n >\n <ng-template #defaultOptionTemplate>\n <span\n class=\"ng-option-label\"\n [ngItemLabel]=\"item.label || ''\"\n [escape]=\"escapeHTML\"\n ></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"\n item.children\n ? optgroupTemplate || defaultOptionTemplate\n : optionTemplate || defaultOptionTemplate\n \"\n [ngTemplateOutletContext]=\"{\n item: item.value,\n item$: item,\n index: item.index,\n searchTerm: searchTerm,\n }\"\n />\n </div>\n }\n\n @if (showAddTag) {\n <div\n class=\"ng-option\"\n [class.ng-option-marked]=\"!itemsList.markedItem\"\n role=\"option\"\n [attr.aria-disabled]=\"false\"\n [attr.aria-selected]=\"false\"\n (click)=\"selectTag()\"\n (mouseover)=\"itemsList.unmarkItem()\"\n >\n <ng-template #defaultTagTemplate>\n <span>\n <span class=\"ng-tag-label\">{{ addTagText }}</span>\n \"{{ searchTerm }}\"\n </span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\"\n />\n </div>\n }\n\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 />\n }\n @if (showTypeToSearch) {\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ typeToSearchText }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\" />\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 />\n }\n </ng-dropdown-panel>\n}\n\n<!-- Always present aria-live region -->\n<div class=\"ng-select-visually-hidden\" aria-atomic=\"true\" aria-live=\"polite\" role=\"status\">\n @if (isOpen && showNoItemsFound) {\n {{ notFoundText }}\n }\n</div>\n", styles: ["@charset \"UTF-8\";.ng-select{position:relative;display:block}.ng-select.ng-select-searchable .ng-input{opacity:1}.ng-select.ng-select-opened .ng-select-container{z-index:1001}.ng-select.ng-select-disabled .ng-placeholder,.ng-select.ng-select-disabled .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,.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{box-sizing:border-box;position:relative;display:flex;width:100%;outline:none;overflow:hidden;cursor:default}.ng-select .ng-value-container{display:flex;flex:1}.ng-select .ng-input{box-sizing:border-box;opacity:0}.ng-select .ng-input>input{width:100%;padding:0;background:transparent;border:none;box-shadow:none;outline:none;cursor:default}.ng-select .ng-input>input::-ms-clear{display:none}.ng-select .ng-input>input[readonly]{-webkit-user-select:unset;user-select:unset;width:0;padding:0}.ng-select.ng-select-single.ng-select-filtered .ng-value{visibility:hidden}.ng-select.ng-select-single .ng-value-container,.ng-select.ng-select-single .ng-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-select.ng-select-single .ng-value-remove{display:none}.ng-select.ng-select-single .ng-input{position:absolute;left:0;width:100%}.ng-select.ng-select-multiple.ng-select-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-value-container{flex-wrap:wrap}.ng-select.ng-select-multiple .ng-placeholder{position:absolute;z-index:1}.ng-select.ng-select-multiple .ng-value{white-space:nowrap}.ng-select.ng-select-multiple .ng-value-remove{cursor:pointer}.ng-select.ng-select-multiple .ng-value-disabled .ng-value-remove{display:none}.ng-select.ng-select-multiple .ng-input{flex:1;z-index:2}.ng-select .ng-clear-wrapper{cursor:pointer;position:relative;width:17px;-webkit-user-select:none;user-select:none}.ng-select .ng-clear{display:inline-block;font-size:18px;line-height:1;pointer-events:none}.ng-select .ng-arrow-wrapper{position:relative;text-align:center;-webkit-user-select:none;user-select:none;cursor:pointer}.ng-select .ng-arrow{position:relative;display:inline-block;height:0;width:0;pointer-events:none}.ng-dropdown-panel{box-sizing:border-box;position:absolute;z-index:1050;width:100%;opacity:0;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .ng-dropdown-panel-items{display:block;height:auto;max-height:240px;overflow-y:auto}.ng-dropdown-panel .ng-optgroup,.ng-dropdown-panel .ng-option{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-option{display:block;cursor:pointer}.ng-dropdown-panel .ng-option.disabled{cursor:default}.ng-dropdown-panel .ng-option .highlighted{font-weight:700;text-decoration:underline}.ng-dropdown-panel .ng-option-label:empty:before{content:\"\\200b\"}.ng-select-virtual-scroll-host{position:relative;display:block;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.ng-select-virtual-scroll-content{position:absolute;top:0;left:0;width:100%;height:100%}.ng-select-virtual-scroll-spacer{width:1px;opacity:0}.ng-select-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip-path:rect(0 0 0 0);white-space:nowrap}.ng-select-spinner{position:relative;width:16px;height:16px;margin:0 4px;font-size:10px;text-indent:-9999em;border-radius:50%;border:2px solid rgba(66,66,66,.2);border-left-color:#424242;animation:load8 .8s infinite linear}@keyframes load8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
2999
3010
  }], ctorParameters: () => [], propDecorators: { bindLabel: [{
3000
3011
  type: Input
3001
3012
  }], bindValue: [{
@@ -3008,6 +3019,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
3008
3019
  type: Input
3009
3020
  }], panelPosition: [{
3010
3021
  type: Input
3022
+ }], panelDisabled: [{
3023
+ type: Input,
3024
+ args: [{ transform: booleanAttribute }]
3011
3025
  }], readonly: [{
3012
3026
  type: Input,
3013
3027
  args: [{ transform: booleanAttribute }]
@@ -3105,8 +3119,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
3105
3119
  type: Input
3106
3120
  }], inputAttrs: [{
3107
3121
  type: Input
3108
- }], isOpen: [{
3109
- type: Input
3110
3122
  }], panelClass: [{
3111
3123
  type: Input
3112
3124
  }], inputId: [{
@@ -3116,9 +3128,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
3116
3128
  }], compareWith: [{
3117
3129
  type: Input
3118
3130
  }], clearSearchOnAdd: [{
3119
- type: Input
3131
+ type: Input,
3132
+ args: [{ transform: booleanAttribute }]
3120
3133
  }], deselectOnClick: [{
3121
- type: Input
3134
+ type: Input,
3135
+ args: [{ transform: booleanAttribute }]
3122
3136
  }], blurEvent: [{
3123
3137
  type: Output,
3124
3138
  args: ['blur']
@@ -3204,8 +3218,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
3204
3218
  }] } });
3205
3219
 
3206
3220
  class NgSelectModule {
3207
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
3208
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: NgSelectModule, imports: [NgDropdownPanel,
3221
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3222
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: NgSelectModule, imports: [NgDropdownPanel,
3209
3223
  NgOption,
3210
3224
  NgSelect,
3211
3225
  NgOptgroupTemplate,
@@ -3235,13 +3249,13 @@ class NgSelectModule {
3235
3249
  NgLoadingTextTemplate,
3236
3250
  NgTagTemplate,
3237
3251
  NgLoadingSpinnerTemplate,
3238
- NgClearButtonTemplate] }); }
3239
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectModule, providers: [
3252
+ NgClearButtonTemplate] });
3253
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectModule, providers: [
3240
3254
  {
3241
3255
  provide: SELECTION_MODEL_FACTORY,
3242
3256
  useValue: DefaultSelectionModelFactory,
3243
3257
  },
3244
- ] }); }
3258
+ ] });
3245
3259
  }
3246
3260
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgSelectModule, decorators: [{
3247
3261
  type: NgModule,