@ng-select/ng-select 20.4.0 → 20.4.2
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.
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, ElementRef, input, effect, Directive, TemplateRef, Injectable, Renderer2, NgZone, booleanAttribute, output, viewChild, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, signal, afterNextRender, InjectionToken, HostAttributeToken, numberAttribute, model, contentChild,
|
|
2
|
+
import { inject, ElementRef, input, effect, Directive, TemplateRef, Injectable, Renderer2, NgZone, booleanAttribute, output, viewChild, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, signal, afterNextRender, InjectionToken, HostAttributeToken, ChangeDetectorRef, numberAttribute, model, contentChild, contentChildren, forwardRef, Injector, HostListener, NgModule } from '@angular/core';
|
|
3
3
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
4
|
-
import { animationFrameScheduler, asapScheduler, Subject, fromEvent
|
|
5
|
-
import { takeUntil, auditTime, tap,
|
|
4
|
+
import { animationFrameScheduler, asapScheduler, Subject, fromEvent } from 'rxjs';
|
|
5
|
+
import { takeUntil, auditTime, tap, debounceTime, filter, map } from 'rxjs/operators';
|
|
6
6
|
import { DOCUMENT, NgTemplateOutlet } from '@angular/common';
|
|
7
|
-
import { toObservable } from '@angular/core/rxjs-interop';
|
|
8
7
|
|
|
9
8
|
const unescapedHTMLExp = /[&<>"']/g;
|
|
10
9
|
const hasUnescapedHTMLExp = RegExp(unescapedHTMLExp.source);
|
|
@@ -1959,21 +1958,13 @@ class NgOptionComponent {
|
|
|
1959
1958
|
}]));
|
|
1960
1959
|
this.elementRef = inject((ElementRef));
|
|
1961
1960
|
this.label = signal('', ...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
1962
|
-
this.stateChange = computed(() => ({
|
|
1963
|
-
value: this.value(),
|
|
1964
|
-
disabled: this.disabled(),
|
|
1965
|
-
label: this.label(),
|
|
1966
|
-
}), ...(ngDevMode ? [{ debugName: "stateChange" }] : []));
|
|
1967
|
-
this.stateChange$ = toObservable(this.stateChange);
|
|
1968
1961
|
afterNextRender(() => {
|
|
1969
|
-
|
|
1970
|
-
|
|
1962
|
+
const label = (this.elementRef.nativeElement.innerHTML || '').trim();
|
|
1963
|
+
if (label !== this.label()) {
|
|
1964
|
+
this.label.set(label);
|
|
1971
1965
|
}
|
|
1972
1966
|
});
|
|
1973
1967
|
}
|
|
1974
|
-
get _label() {
|
|
1975
|
-
return (this.elementRef.nativeElement.innerHTML || '').trim();
|
|
1976
|
-
}
|
|
1977
1968
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: NgOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1978
1969
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.6", type: NgOptionComponent, isStandalone: true, selector: "ng-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1979
1970
|
}
|
|
@@ -2078,6 +2069,8 @@ class NgSelectComponent {
|
|
|
2078
2069
|
constructor() {
|
|
2079
2070
|
this.classes = inject(new HostAttributeToken('class'), { optional: true });
|
|
2080
2071
|
this.config = inject(NgSelectConfig);
|
|
2072
|
+
this._cd = inject(ChangeDetectorRef);
|
|
2073
|
+
this._console = inject(ConsoleService);
|
|
2081
2074
|
// signals
|
|
2082
2075
|
this._disabled = signal(false, ...(ngDevMode ? [{ debugName: "_disabled" }] : []));
|
|
2083
2076
|
// inputs
|
|
@@ -2138,12 +2131,13 @@ class NgSelectComponent {
|
|
|
2138
2131
|
return fn;
|
|
2139
2132
|
},
|
|
2140
2133
|
}]));
|
|
2134
|
+
this.keyDownFn = input((_) => true, ...(ngDevMode ? [{ debugName: "keyDownFn" }] : []));
|
|
2141
2135
|
// models
|
|
2142
2136
|
this.bindLabel = model(undefined, ...(ngDevMode ? [{ debugName: "bindLabel" }] : []));
|
|
2143
2137
|
this.bindValue = model(undefined, ...(ngDevMode ? [{ debugName: "bindValue" }] : []));
|
|
2144
2138
|
this.appearance = model(undefined, ...(ngDevMode ? [{ debugName: "appearance" }] : []));
|
|
2145
2139
|
this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
|
|
2146
|
-
this.items =
|
|
2140
|
+
this.items = model([], ...(ngDevMode ? [{ debugName: "items" }] : []));
|
|
2147
2141
|
// output events
|
|
2148
2142
|
this.blurEvent = output({ alias: 'blur' });
|
|
2149
2143
|
this.focusEvent = output({ alias: 'focus' });
|
|
@@ -2190,27 +2184,31 @@ class NgSelectComponent {
|
|
|
2190
2184
|
this.tagTemplate = contentChild(NgTagTemplateDirective, ...(ngDevMode ? [{ debugName: "tagTemplate", read: TemplateRef }] : [{ read: TemplateRef }]));
|
|
2191
2185
|
this.loadingSpinnerTemplate = contentChild(NgLoadingSpinnerTemplateDirective, ...(ngDevMode ? [{ debugName: "loadingSpinnerTemplate", read: TemplateRef }] : [{ read: TemplateRef }]));
|
|
2192
2186
|
this.clearButtonTemplate = contentChild(NgClearButtonTemplateDirective, ...(ngDevMode ? [{ debugName: "clearButtonTemplate", read: TemplateRef }] : [{ read: TemplateRef }]));
|
|
2187
|
+
this.ngOptions = contentChildren(NgOptionComponent, ...(ngDevMode ? [{ debugName: "ngOptions", descendants: true }] : [{ descendants: true }]));
|
|
2193
2188
|
// view children queries
|
|
2194
2189
|
this.dropdownPanel = viewChild(forwardRef(() => NgDropdownPanelComponent), ...(ngDevMode ? [{ debugName: "dropdownPanel" }] : []));
|
|
2195
2190
|
this.searchInput = viewChild('searchInput', ...(ngDevMode ? [{ debugName: "searchInput" }] : []));
|
|
2196
2191
|
this.clearButton = viewChild('clearButton', ...(ngDevMode ? [{ debugName: "clearButton" }] : []));
|
|
2197
2192
|
// public variables
|
|
2198
|
-
this.ngOptions = contentChildren(NgOptionComponent, ...(ngDevMode ? [{ debugName: "ngOptions", descendants: true }] : [{ descendants: true }]));
|
|
2199
|
-
this.ngOptionsObservable = toObservable(this.ngOptions);
|
|
2200
|
-
this.viewPortItems = [];
|
|
2201
|
-
this.searchTerm = null;
|
|
2202
2193
|
this.dropdownId = newId();
|
|
2194
|
+
// variables
|
|
2203
2195
|
this.escapeHTML = true;
|
|
2196
|
+
this.viewPortItems = [];
|
|
2204
2197
|
this.tabFocusOnClear = signal(true, ...(ngDevMode ? [{ debugName: "tabFocusOnClear" }] : []));
|
|
2205
|
-
this.keyDownFn = input((_) => true, ...(ngDevMode ? [{ debugName: "keyDownFn" }] : []));
|
|
2206
2198
|
this.autoFocus = inject(new HostAttributeToken('autofocus'), { optional: true });
|
|
2207
|
-
|
|
2208
|
-
this._console = inject(ConsoleService);
|
|
2199
|
+
// private variables
|
|
2209
2200
|
this._defaultLabel = 'label';
|
|
2210
|
-
this._pressedKeys = [];
|
|
2211
|
-
this._isComposing = false;
|
|
2212
2201
|
this._destroy$ = new Subject();
|
|
2202
|
+
this._editableSearchTerm = computed(() => this.editableSearchTerm() && !this.multiple(), ...(ngDevMode ? [{ debugName: "_editableSearchTerm" }] : []));
|
|
2203
|
+
this._injector = inject(Injector);
|
|
2204
|
+
this._isComposing = false;
|
|
2213
2205
|
this._keyPress$ = new Subject();
|
|
2206
|
+
this._pressedKeys = [];
|
|
2207
|
+
this._searchTerm = signal(null, ...(ngDevMode ? [{ debugName: "_searchTerm" }] : []));
|
|
2208
|
+
this._validTerm = computed(() => {
|
|
2209
|
+
const term = this._searchTerm()?.trim();
|
|
2210
|
+
return term && term.length >= this.minTermLength();
|
|
2211
|
+
}, ...(ngDevMode ? [{ debugName: "_validTerm" }] : []));
|
|
2214
2212
|
this.clearItem = (item) => {
|
|
2215
2213
|
const option = this.selectedItems.find((x) => x.value === item);
|
|
2216
2214
|
this.unselect(option);
|
|
@@ -2233,6 +2231,12 @@ class NgSelectComponent {
|
|
|
2233
2231
|
get filtered() {
|
|
2234
2232
|
return (!!this.searchTerm && this.searchable()) || this._isComposing;
|
|
2235
2233
|
}
|
|
2234
|
+
get focused() {
|
|
2235
|
+
return this._focused;
|
|
2236
|
+
}
|
|
2237
|
+
get searchTerm() {
|
|
2238
|
+
return this._searchTerm();
|
|
2239
|
+
}
|
|
2236
2240
|
get selectedItems() {
|
|
2237
2241
|
return this.itemsList.selectedItems;
|
|
2238
2242
|
}
|
|
@@ -2249,7 +2253,7 @@ class NgSelectComponent {
|
|
|
2249
2253
|
return undefined;
|
|
2250
2254
|
}
|
|
2251
2255
|
get showAddTag() {
|
|
2252
|
-
if (!this._validTerm) {
|
|
2256
|
+
if (!this._validTerm()) {
|
|
2253
2257
|
return false;
|
|
2254
2258
|
}
|
|
2255
2259
|
const term = this.searchTerm.toLowerCase().trim();
|
|
@@ -2258,16 +2262,6 @@ class NgSelectComponent {
|
|
|
2258
2262
|
((!this.hideSelected() && this.isOpen()) || !this.selectedItems.some((x) => x.label.toLowerCase() === term)) &&
|
|
2259
2263
|
!this.loading());
|
|
2260
2264
|
}
|
|
2261
|
-
get _editableSearchTerm() {
|
|
2262
|
-
return this.editableSearchTerm() && !this.multiple();
|
|
2263
|
-
}
|
|
2264
|
-
get _isTypeahead() {
|
|
2265
|
-
return this.typeahead() && this.typeahead().observed;
|
|
2266
|
-
}
|
|
2267
|
-
get _validTerm() {
|
|
2268
|
-
const term = this.searchTerm?.trim();
|
|
2269
|
-
return term && term.length >= this.minTermLength();
|
|
2270
|
-
}
|
|
2271
2265
|
ngOnInit() {
|
|
2272
2266
|
this._handleKeyPresses();
|
|
2273
2267
|
this._setInputAttributes();
|
|
@@ -2383,7 +2377,7 @@ class NgSelectComponent {
|
|
|
2383
2377
|
if (target.classList.contains('ng-value-icon')) {
|
|
2384
2378
|
return;
|
|
2385
2379
|
}
|
|
2386
|
-
if (!this.
|
|
2380
|
+
if (!this._focused) {
|
|
2387
2381
|
this.focus();
|
|
2388
2382
|
}
|
|
2389
2383
|
if (this.searchable()) {
|
|
@@ -2421,7 +2415,7 @@ class NgSelectComponent {
|
|
|
2421
2415
|
writeValue(value) {
|
|
2422
2416
|
this.itemsList.clearSelected();
|
|
2423
2417
|
this._handleWriteValue(value);
|
|
2424
|
-
if (this._editableSearchTerm) {
|
|
2418
|
+
if (this._editableSearchTerm()) {
|
|
2425
2419
|
this._setSearchTermFromItems();
|
|
2426
2420
|
}
|
|
2427
2421
|
this._cd.markForCheck();
|
|
@@ -2448,7 +2442,7 @@ class NgSelectComponent {
|
|
|
2448
2442
|
if (this.disabled() || this.isOpen() || this._manualOpen) {
|
|
2449
2443
|
return;
|
|
2450
2444
|
}
|
|
2451
|
-
if (!this.
|
|
2445
|
+
if (!this.typeahead()?.observed && !this.addTag() && this.itemsList.noItemsToSelect) {
|
|
2452
2446
|
return;
|
|
2453
2447
|
}
|
|
2454
2448
|
this.isOpen.set(true);
|
|
@@ -2465,7 +2459,7 @@ class NgSelectComponent {
|
|
|
2465
2459
|
}
|
|
2466
2460
|
this.isOpen.set(false);
|
|
2467
2461
|
this._isComposing = false;
|
|
2468
|
-
if (!this._editableSearchTerm) {
|
|
2462
|
+
if (!this._editableSearchTerm()) {
|
|
2469
2463
|
this._clearSearch();
|
|
2470
2464
|
}
|
|
2471
2465
|
else {
|
|
@@ -2486,14 +2480,14 @@ class NgSelectComponent {
|
|
|
2486
2480
|
else {
|
|
2487
2481
|
this.select(item);
|
|
2488
2482
|
}
|
|
2489
|
-
if (this._editableSearchTerm) {
|
|
2483
|
+
if (this._editableSearchTerm()) {
|
|
2490
2484
|
this._setSearchTermFromItems();
|
|
2491
2485
|
}
|
|
2492
2486
|
}
|
|
2493
2487
|
select(item) {
|
|
2494
2488
|
if (!item.selected) {
|
|
2495
2489
|
this.itemsList.select(item);
|
|
2496
|
-
if (this.clearSearchOnAddValue() && !this._editableSearchTerm) {
|
|
2490
|
+
if (this.clearSearchOnAddValue() && !this._editableSearchTerm()) {
|
|
2497
2491
|
this._clearSearch();
|
|
2498
2492
|
}
|
|
2499
2493
|
this._updateNgModel();
|
|
@@ -2530,7 +2524,7 @@ class NgSelectComponent {
|
|
|
2530
2524
|
else {
|
|
2531
2525
|
tag = this._primitive ? this.searchTerm : { [this.bindLabel()]: this.searchTerm };
|
|
2532
2526
|
}
|
|
2533
|
-
const handleTag = (item) => (this.
|
|
2527
|
+
const handleTag = (item) => (this.typeahead()?.observed || !this.isOpen() ? this.itemsList.mapItem(item, null) : this.itemsList.addItem(item));
|
|
2534
2528
|
if (isPromise(tag)) {
|
|
2535
2529
|
tag.then((item) => this.select(handleTag(item))).catch(() => { });
|
|
2536
2530
|
}
|
|
@@ -2549,12 +2543,12 @@ class NgSelectComponent {
|
|
|
2549
2543
|
}
|
|
2550
2544
|
showNoItemsFound() {
|
|
2551
2545
|
const empty = this.itemsList.filteredItems.length === 0;
|
|
2552
|
-
return (((empty && !this.
|
|
2546
|
+
return (((empty && !this.typeahead()?.observed && !this.loading()) || (empty && this.typeahead()?.observed && this._validTerm() && !this.loading())) &&
|
|
2553
2547
|
!this.showAddTag);
|
|
2554
2548
|
}
|
|
2555
2549
|
showTypeToSearch() {
|
|
2556
2550
|
const empty = this.itemsList.filteredItems.length === 0;
|
|
2557
|
-
return empty && this.
|
|
2551
|
+
return empty && this.typeahead()?.observed && !this._validTerm() && !this.loading();
|
|
2558
2552
|
}
|
|
2559
2553
|
onCompositionStart() {
|
|
2560
2554
|
this._isComposing = true;
|
|
@@ -2570,12 +2564,12 @@ class NgSelectComponent {
|
|
|
2570
2564
|
if (this._isComposing && !this.searchWhileComposing()) {
|
|
2571
2565
|
return;
|
|
2572
2566
|
}
|
|
2573
|
-
this.
|
|
2574
|
-
if (this.
|
|
2567
|
+
this._searchTerm.set(term);
|
|
2568
|
+
if (this.typeahead()?.observed && (this._validTerm() || this.minTermLength() === 0)) {
|
|
2575
2569
|
this.typeahead().next(term);
|
|
2576
2570
|
}
|
|
2577
|
-
if (!this.
|
|
2578
|
-
this.itemsList.filter(
|
|
2571
|
+
if (!this.typeahead()?.observed) {
|
|
2572
|
+
this.itemsList.filter(term);
|
|
2579
2573
|
if (this.isOpen()) {
|
|
2580
2574
|
this.itemsList.markSelectedOrDefault(this.markFirst());
|
|
2581
2575
|
}
|
|
@@ -2584,15 +2578,15 @@ class NgSelectComponent {
|
|
|
2584
2578
|
this.open();
|
|
2585
2579
|
}
|
|
2586
2580
|
onInputFocus($event) {
|
|
2587
|
-
if (this.
|
|
2581
|
+
if (this._focused) {
|
|
2588
2582
|
return;
|
|
2589
2583
|
}
|
|
2590
|
-
if (this._editableSearchTerm) {
|
|
2584
|
+
if (this._editableSearchTerm()) {
|
|
2591
2585
|
this._setSearchTermFromItems();
|
|
2592
2586
|
}
|
|
2593
2587
|
this.element.classList.add('ng-select-focused');
|
|
2594
2588
|
this.focusEvent.emit($event);
|
|
2595
|
-
this.
|
|
2589
|
+
this._focused = true;
|
|
2596
2590
|
}
|
|
2597
2591
|
onInputBlur($event) {
|
|
2598
2592
|
this.element.classList.remove('ng-select-focused');
|
|
@@ -2600,10 +2594,10 @@ class NgSelectComponent {
|
|
|
2600
2594
|
if (!this.isOpen() && !this.disabled()) {
|
|
2601
2595
|
this._onTouched();
|
|
2602
2596
|
}
|
|
2603
|
-
if (this._editableSearchTerm) {
|
|
2597
|
+
if (this._editableSearchTerm()) {
|
|
2604
2598
|
this._setSearchTermFromItems();
|
|
2605
2599
|
}
|
|
2606
|
-
this.
|
|
2600
|
+
this._focused = false;
|
|
2607
2601
|
}
|
|
2608
2602
|
onItemHover(item) {
|
|
2609
2603
|
if (item.disabled) {
|
|
@@ -2618,7 +2612,7 @@ class NgSelectComponent {
|
|
|
2618
2612
|
}
|
|
2619
2613
|
_setSearchTermFromItems() {
|
|
2620
2614
|
const selected = this.selectedItems?.[0];
|
|
2621
|
-
this.
|
|
2615
|
+
this._searchTerm.set(selected?.label ?? null);
|
|
2622
2616
|
}
|
|
2623
2617
|
_setItems(items) {
|
|
2624
2618
|
const firstItem = items[0];
|
|
@@ -2628,41 +2622,34 @@ class NgSelectComponent {
|
|
|
2628
2622
|
if (items.length > 0 && this.hasValue) {
|
|
2629
2623
|
this.itemsList.mapSelectedItems();
|
|
2630
2624
|
}
|
|
2631
|
-
if (this.isOpen() && isDefined(this.searchTerm) && !this.
|
|
2625
|
+
if (this.isOpen() && isDefined(this.searchTerm) && !this.typeahead()?.observed) {
|
|
2632
2626
|
this.itemsList.filter(this.searchTerm);
|
|
2633
2627
|
}
|
|
2634
|
-
if (this.
|
|
2628
|
+
if (this.typeahead()?.observed || this.isOpen()) {
|
|
2635
2629
|
this.itemsList.markSelectedOrDefault(this.markFirst());
|
|
2636
2630
|
}
|
|
2637
2631
|
}
|
|
2638
2632
|
_setItemsFromNgOptions() {
|
|
2639
|
-
|
|
2633
|
+
effect(() => {
|
|
2634
|
+
const options = this.ngOptions();
|
|
2635
|
+
this.bindLabel.set(this._defaultLabel);
|
|
2640
2636
|
const items = options.map((option) => ({
|
|
2641
2637
|
$ngOptionValue: option.value(),
|
|
2642
2638
|
$ngOptionLabel: option.elementRef.nativeElement.innerHTML,
|
|
2643
2639
|
disabled: option.disabled(),
|
|
2644
2640
|
})) ?? [];
|
|
2641
|
+
this.items.set(items);
|
|
2645
2642
|
this.itemsList.setItems(items);
|
|
2646
2643
|
if (this.hasValue) {
|
|
2647
2644
|
this.itemsList.mapSelectedItems();
|
|
2648
2645
|
}
|
|
2649
|
-
};
|
|
2650
|
-
const handleOptionChange = (options) => {
|
|
2651
|
-
return merge(...options.map((option) => option.stateChange$)).pipe(tap((option) => {
|
|
2652
|
-
const item = this.itemsList.findItem(option.value);
|
|
2653
|
-
if (item) {
|
|
2654
|
-
item.disabled = option.disabled;
|
|
2655
|
-
item.label = option.label || item.label;
|
|
2656
|
-
}
|
|
2657
|
-
}));
|
|
2658
|
-
};
|
|
2659
|
-
this.ngOptionsObservable
|
|
2660
|
-
.pipe(startWith(this.ngOptions()), takeUntil(this._destroy$), tap((options) => {
|
|
2661
|
-
this.bindLabel.set(this._defaultLabel);
|
|
2662
|
-
mapNgOptions(options);
|
|
2663
2646
|
this._cd.detectChanges();
|
|
2664
|
-
|
|
2665
|
-
|
|
2647
|
+
for (const option of options) {
|
|
2648
|
+
const item = this.itemsList.findItem(option.value());
|
|
2649
|
+
item.disabled = option.disabled();
|
|
2650
|
+
item.label = option.label() || item.label;
|
|
2651
|
+
}
|
|
2652
|
+
}, { injector: this._injector });
|
|
2666
2653
|
}
|
|
2667
2654
|
_isValidWriteValue(value) {
|
|
2668
2655
|
if (!isDefined(value) || (this.multiple() && value === '') || (Array.isArray(value) && value.length === 0)) {
|
|
@@ -2792,8 +2779,8 @@ class NgSelectComponent {
|
|
|
2792
2779
|
this.itemsList.resetFilteredItems();
|
|
2793
2780
|
}
|
|
2794
2781
|
_changeSearch(searchTerm) {
|
|
2795
|
-
this.searchTerm
|
|
2796
|
-
if (this.
|
|
2782
|
+
this._searchTerm.set(searchTerm);
|
|
2783
|
+
if (this.typeahead()?.observed) {
|
|
2797
2784
|
this.typeahead().next(searchTerm);
|
|
2798
2785
|
}
|
|
2799
2786
|
}
|
|
@@ -2937,7 +2924,7 @@ class NgSelectComponent {
|
|
|
2937
2924
|
return isDefined(config.disableVirtualScroll) ? !config.disableVirtualScroll : false;
|
|
2938
2925
|
}
|
|
2939
2926
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: NgSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2940
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: NgSelectComponent, isStandalone: true, selector: "ng-select", inputs: { ariaLabelDropdown: { classPropertyName: "ariaLabelDropdown", publicName: "ariaLabelDropdown", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, markFirst: { classPropertyName: "markFirst", publicName: "markFirst", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, fixedPlaceholder: { classPropertyName: "fixedPlaceholder", publicName: "fixedPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, notFoundText: { classPropertyName: "notFoundText", publicName: "notFoundText", isSignal: true, isRequired: false, transformFunction: null }, typeToSearchText: { classPropertyName: "typeToSearchText", publicName: "typeToSearchText", isSignal: true, isRequired: false, transformFunction: null }, preventToggleOnRightClick: { classPropertyName: "preventToggleOnRightClick", publicName: "preventToggleOnRightClick", isSignal: true, isRequired: false, transformFunction: null }, addTagText: { classPropertyName: "addTagText", publicName: "addTagText", isSignal: true, isRequired: false, transformFunction: null }, loadingText: { classPropertyName: "loadingText", publicName: "loadingText", isSignal: true, isRequired: false, transformFunction: null }, clearAllText: { classPropertyName: "clearAllText", publicName: "clearAllText", isSignal: true, isRequired: false, transformFunction: null }, dropdownPosition: { classPropertyName: "dropdownPosition", publicName: "dropdownPosition", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, hideSelected: { classPropertyName: "hideSelected", publicName: "hideSelected", isSignal: true, isRequired: false, transformFunction: null }, selectOnTab: { classPropertyName: "selectOnTab", publicName: "selectOnTab", isSignal: true, isRequired: false, transformFunction: null }, openOnEnter: { classPropertyName: "openOnEnter", publicName: "openOnEnter", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, groupValue: { classPropertyName: "groupValue", publicName: "groupValue", isSignal: true, isRequired: false, transformFunction: null }, bufferAmount: { classPropertyName: "bufferAmount", publicName: "bufferAmount", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, selectableGroup: { classPropertyName: "selectableGroup", publicName: "selectableGroup", isSignal: true, isRequired: false, transformFunction: null }, tabFocusOnClearButton: { classPropertyName: "tabFocusOnClearButton", publicName: "tabFocusOnClearButton", isSignal: true, isRequired: false, transformFunction: null }, selectableGroupAsModel: { classPropertyName: "selectableGroupAsModel", publicName: "selectableGroupAsModel", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, trackByFn: { classPropertyName: "trackByFn", publicName: "trackByFn", isSignal: true, isRequired: false, transformFunction: null }, clearOnBackspace: { classPropertyName: "clearOnBackspace", publicName: "clearOnBackspace", isSignal: true, isRequired: false, transformFunction: null }, labelForId: { classPropertyName: "labelForId", publicName: "labelForId", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, searchWhileComposing: { classPropertyName: "searchWhileComposing", publicName: "searchWhileComposing", isSignal: true, isRequired: false, transformFunction: null }, minTermLength: { classPropertyName: "minTermLength", publicName: "minTermLength", isSignal: true, isRequired: false, transformFunction: null }, editableSearchTerm: { classPropertyName: "editableSearchTerm", publicName: "editableSearchTerm", isSignal: true, isRequired: false, transformFunction: null }, ngClass: { classPropertyName: "ngClass", publicName: "ngClass", isSignal: true, isRequired: false, transformFunction: null }, typeahead: { classPropertyName: "typeahead", publicName: "typeahead", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, addTag: { classPropertyName: "addTag", publicName: "addTag", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, deselectOnClick: { classPropertyName: "deselectOnClick", publicName: "deselectOnClick", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnAdd: { classPropertyName: "clearSearchOnAdd", publicName: "clearSearchOnAdd", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null },
|
|
2927
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: NgSelectComponent, isStandalone: true, selector: "ng-select", inputs: { ariaLabelDropdown: { classPropertyName: "ariaLabelDropdown", publicName: "ariaLabelDropdown", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, markFirst: { classPropertyName: "markFirst", publicName: "markFirst", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, fixedPlaceholder: { classPropertyName: "fixedPlaceholder", publicName: "fixedPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, notFoundText: { classPropertyName: "notFoundText", publicName: "notFoundText", isSignal: true, isRequired: false, transformFunction: null }, typeToSearchText: { classPropertyName: "typeToSearchText", publicName: "typeToSearchText", isSignal: true, isRequired: false, transformFunction: null }, preventToggleOnRightClick: { classPropertyName: "preventToggleOnRightClick", publicName: "preventToggleOnRightClick", isSignal: true, isRequired: false, transformFunction: null }, addTagText: { classPropertyName: "addTagText", publicName: "addTagText", isSignal: true, isRequired: false, transformFunction: null }, loadingText: { classPropertyName: "loadingText", publicName: "loadingText", isSignal: true, isRequired: false, transformFunction: null }, clearAllText: { classPropertyName: "clearAllText", publicName: "clearAllText", isSignal: true, isRequired: false, transformFunction: null }, dropdownPosition: { classPropertyName: "dropdownPosition", publicName: "dropdownPosition", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, hideSelected: { classPropertyName: "hideSelected", publicName: "hideSelected", isSignal: true, isRequired: false, transformFunction: null }, selectOnTab: { classPropertyName: "selectOnTab", publicName: "selectOnTab", isSignal: true, isRequired: false, transformFunction: null }, openOnEnter: { classPropertyName: "openOnEnter", publicName: "openOnEnter", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, groupValue: { classPropertyName: "groupValue", publicName: "groupValue", isSignal: true, isRequired: false, transformFunction: null }, bufferAmount: { classPropertyName: "bufferAmount", publicName: "bufferAmount", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, selectableGroup: { classPropertyName: "selectableGroup", publicName: "selectableGroup", isSignal: true, isRequired: false, transformFunction: null }, tabFocusOnClearButton: { classPropertyName: "tabFocusOnClearButton", publicName: "tabFocusOnClearButton", isSignal: true, isRequired: false, transformFunction: null }, selectableGroupAsModel: { classPropertyName: "selectableGroupAsModel", publicName: "selectableGroupAsModel", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, trackByFn: { classPropertyName: "trackByFn", publicName: "trackByFn", isSignal: true, isRequired: false, transformFunction: null }, clearOnBackspace: { classPropertyName: "clearOnBackspace", publicName: "clearOnBackspace", isSignal: true, isRequired: false, transformFunction: null }, labelForId: { classPropertyName: "labelForId", publicName: "labelForId", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, searchWhileComposing: { classPropertyName: "searchWhileComposing", publicName: "searchWhileComposing", isSignal: true, isRequired: false, transformFunction: null }, minTermLength: { classPropertyName: "minTermLength", publicName: "minTermLength", isSignal: true, isRequired: false, transformFunction: null }, editableSearchTerm: { classPropertyName: "editableSearchTerm", publicName: "editableSearchTerm", isSignal: true, isRequired: false, transformFunction: null }, ngClass: { classPropertyName: "ngClass", publicName: "ngClass", isSignal: true, isRequired: false, transformFunction: null }, typeahead: { classPropertyName: "typeahead", publicName: "typeahead", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, addTag: { classPropertyName: "addTag", publicName: "addTag", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, deselectOnClick: { classPropertyName: "deselectOnClick", publicName: "deselectOnClick", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnAdd: { classPropertyName: "clearSearchOnAdd", publicName: "clearSearchOnAdd", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, keyDownFn: { classPropertyName: "keyDownFn", publicName: "keyDownFn", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { bindLabel: "bindLabelChange", bindValue: "bindValueChange", appearance: "appearanceChange", isOpen: "isOpenChange", items: "itemsChange", 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": "true", "class.ng-select-single": "!multiple()", "class.ng-select-typeahead": "typeahead()", "class.ng-select-multiple": "multiple()", "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()" } }, providers: [
|
|
2941
2928
|
{
|
|
2942
2929
|
provide: NG_VALUE_ACCESSOR,
|
|
2943
2930
|
useExisting: forwardRef(() => NgSelectComponent),
|
|
@@ -2967,7 +2954,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
2967
2954
|
'[class.ng-select-filtered]': 'filtered',
|
|
2968
2955
|
'[class.ng-select-disabled]': 'disabled()',
|
|
2969
2956
|
}, template: "<div (mousedown)=\"handleMousedown($event)\" [class.ng-appearance-outline]=\"appearance() === 'outline'\"\n [class.ng-has-value]=\"hasValue\" class=\"ng-select-container\">\n <div class=\"ng-value-container\">\n @if ((selectedItems.length === 0 && !searchTerm) || (fixedPlaceholder() ?? config.fixedPlaceholder)) {\n <ng-template #defaultPlaceholderTemplate>\n <div class=\"ng-placeholder\">{{ placeholder() ?? config.placeholder }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate() || defaultPlaceholderTemplate\"> </ng-template>\n }\n\n @if ((!multiLabelTemplate() || !multiple()) && selectedItems.length > 0) {\n @for (item of selectedItems; track trackByOption($index, item)) {\n <div [class.ng-value-disabled]=\"item.disabled\" class=\"ng-value\">\n <ng-template #defaultLabelTemplate>\n <span class=\"ng-value-icon left\" (click)=\"unselect(item)\" aria-hidden=\"true\">\u00D7</span>\n <span class=\"ng-value-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"labelTemplate() || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\">\n </ng-template>\n </div>\n }\n }\n\n @if (multiple() && multiLabelTemplate() && selectedValues.length > 0) {\n <ng-template [ngTemplateOutlet]=\"multiLabelTemplate()\"\n [ngTemplateOutletContext]=\"{ items: selectedValues, clear: clearItem }\">\n </ng-template>\n }\n\n <div class=\"ng-input\">\n <input #searchInput (blur)=\"onInputBlur($event)\" (change)=\"$event.stopPropagation()\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\" (compositionstart)=\"onCompositionStart()\"\n (focus)=\"onInputFocus($event)\" (input)=\"filter(searchInput.value)\"\n [attr.aria-activedescendant]=\"isOpen() ? itemsList?.markedItem?.htmlId : null\"\n [attr.aria-controls]=\"isOpen() ? dropdownId : null\" [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-label]=\"ariaLabel()\" [attr.id]=\"labelForId()\" [attr.tabindex]=\"tabIndex()\"\n [disabled]=\"disabled()\" [readOnly]=\"!searchable() || itemsList.maxItemsSelected\"\n [value]=\"searchTerm ?? ''\" aria-autocomplete=\"list\" role=\"combobox\" />\n </div>\n </div>\n\n @if (loading()) {\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-spinner-loader\"></div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate() || defaultLoadingSpinnerTemplate\"></ng-template>\n }\n\n @if (showClear()) {\n @if (clearButtonTemplate()) {\n <ng-container [ngTemplateOutlet]=\"clearButtonTemplate()\"></ng-container>\n } @else {\n <span class=\"ng-clear-wrapper\" role=\"button\" tabindex=\"0\" [attr.tabindex]=\"tabFocusOnClear() ? 0 : -1\"\n title=\"{{ clearAllText() || config.clearAllText }}\" #clearButton (click)=\"handleClearClick($event)\">\n <span class=\"ng-clear\" aria-hidden=\"true\">\u00D7</span>\n </span>\n }\n }\n\n <span class=\"ng-arrow-wrapper\">\n <span class=\"ng-arrow\"></span>\n </span>\n</div>\n\n@if (isOpen()) {\n@let appendToValue = appendTo() || config.appendTo;\n<ng-dropdown-panel class=\"ng-dropdown-panel\" [virtualScroll]=\"virtualScroll() ?? !config.disableVirtualScroll ?? false\"\n [bufferAmount]=\"bufferAmount()\" [appendTo]=\"appendToValue\" [position]=\"dropdownPosition()\"\n [headerTemplate]=\"headerTemplate()\" [footerTemplate]=\"footerTemplate()\" [filterValue]=\"searchTerm\"\n [items]=\"itemsList.filteredItems\" [markedItem]=\"itemsList.markedItem\" (update)=\"viewPortItems = $event\"\n (scroll)=\"scroll.emit($event)\" (scrollToEnd)=\"scrollToEnd.emit($event)\" (outsideClick)=\"close()\"\n [class.ng-select-multiple]=\"multiple()\" [class]=\"appendToValue ? (ngClass() ? ngClass() : classes) : null\"\n [id]=\"dropdownId\" [ariaLabelDropdown]=\"ariaLabelDropdown()\">\n <ng-container>\n @for (item of viewPortItems; track trackByOption($index, item)) {\n <div class=\"ng-option\" [attr.role]=\"item.children ? 'group' : 'option'\" (click)=\"toggleItem(item)\"\n (mouseover)=\"onItemHover(item)\" [class.ng-option-disabled]=\"item.disabled\"\n [class.ng-option-selected]=\"item.selected\" [class.ng-optgroup]=\"item.children\"\n [class.ng-option]=\"!item.children\" [class.ng-option-child]=\"!!item.parent\"\n [class.ng-option-marked]=\"item === itemsList.markedItem\" [attr.aria-selected]=\"item.selected\"\n [attr.id]=\"item?.htmlId\" [attr.aria-setsize]=\"itemsList.filteredItems.length\"\n [attr.aria-posinset]=\"item.index + 1\">\n <ng-template #defaultOptionTemplate>\n <span class=\"ng-option-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"\n\t\t\t\t\t\t\titem.children ? optgroupTemplate() || defaultOptionTemplate : optionTemplate() || defaultOptionTemplate\n\t\t\t\t\t\t\" [ngTemplateOutletContext]=\"{ item: item.value, item$: item, index: item.index, searchTerm: searchTerm }\">\n </ng-template>\n </div>\n }\n @if (showAddTag) {\n <div class=\"ng-option\" [class.ng-option-marked]=\"!itemsList.markedItem\" (mouseover)=\"itemsList.unmarkItem()\"\n role=\"option\" (click)=\"selectTag()\">\n <ng-template #defaultTagTemplate>\n <span><span class=\"ng-tag-label\">{{ addTagText() || config.addTagText }}</span>\"{{ searchTerm }}\"</span>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"tagTemplate() || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </div>\n }\n </ng-container>\n @if (showNoItemsFound()) {\n <ng-template #defaultNotFoundTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ notFoundText() ?? config.notFoundText }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"notFoundTemplate() || defaultNotFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n }\n @if (showTypeToSearch()) {\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ typeToSearchText() || config.typeToSearchText }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate() || defaultTypeToSearchTemplate\"></ng-template>\n }\n @if (loading() && itemsList.filteredItems.length === 0) {\n <ng-template #defaultLoadingTextTemplate>\n <div class=\"ng-option ng-option-disabled\">{{ loadingText() || config.loadingText }}</div>\n </ng-template>\n <ng-template [ngTemplateOutlet]=\"loadingTextTemplate() || defaultLoadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n }\n</ng-dropdown-panel>\n}\n\n<!-- Always present aria-live region -->\n<div aria-atomic=\"true\" aria-live=\"polite\" class=\"ng-visually-hidden\" role=\"status\">\n @if (isOpen() && showNoItemsFound()) {\n {{ notFoundText() ?? config.notFoundText }}\n }\n</div>", styles: ["@charset \"UTF-8\";.ng-select{position:relative;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ng-select div,.ng-select input,.ng-select span{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ng-select [hidden]{display:none}.ng-select.ng-select-searchable .ng-select-container .ng-value-container .ng-input{opacity:1}.ng-select.ng-select-opened .ng-select-container{z-index:1001}.ng-select.ng-select-disabled .ng-select-container .ng-value-container .ng-placeholder,.ng-select.ng-select-disabled .ng-select-container .ng-value-container .ng-value{-webkit-user-select:none;user-select:none;cursor:default}.ng-select.ng-select-disabled .ng-arrow-wrapper{cursor:default}.ng-select.ng-select-filtered .ng-placeholder{display:none}.ng-select .ng-select-container{cursor:default;display:flex;outline:none;overflow:hidden;position:relative;width:100%}.ng-select .ng-select-container .ng-value-container{display:flex;flex:1}.ng-select .ng-select-container .ng-value-container .ng-input{opacity:0}.ng-select .ng-select-container .ng-value-container .ng-input>input{box-sizing:content-box;background:none transparent;border:0 none;box-shadow:none;outline:none;padding:0;cursor:default;width:100%}.ng-select .ng-select-container .ng-value-container .ng-input>input::-ms-clear{display:none}.ng-select .ng-select-container .ng-value-container .ng-input>input[readonly]{-webkit-user-select:unset;user-select:unset;width:0;padding:0}.ng-select.ng-select-single.ng-select-filtered .ng-select-container .ng-value-container .ng-value{visibility:hidden}.ng-select.ng-select-single .ng-select-container .ng-value-container,.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:none}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{position:absolute;left:0;width:100%}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-icon{display:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{flex-wrap:wrap}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{position:absolute}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{white-space:nowrap}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-icon{display:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{cursor:pointer}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{flex:1;z-index:2}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{z-index:1}.ng-select .ng-clear-wrapper{cursor:pointer;position:relative;width:17px;-webkit-user-select:none;user-select:none}.ng-select .ng-clear-wrapper .ng-clear{display:inline-block;font-size:18px;line-height:1;pointer-events:none}.ng-select .ng-spinner-loader{border-radius:50%;width:17px;height:17px;margin-right:5px;font-size:10px;position:relative;text-indent:-9999em;border-top:2px solid rgba(66,66,66,.2);border-right:2px solid rgba(66,66,66,.2);border-bottom:2px solid rgba(66,66,66,.2);border-left:2px solid #424242;transform:translateZ(0);animation:load8 .8s infinite linear}.ng-select .ng-spinner-loader:after{border-radius:50%;width:17px;height:17px}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.ng-select .ng-arrow-wrapper{cursor:pointer;position:relative;text-align:center;-webkit-user-select:none;user-select:none}.ng-select .ng-arrow-wrapper .ng-arrow{pointer-events:none;display:inline-block;height:0;width:0;position:relative}.ng-dropdown-panel{box-sizing:border-box;position:absolute;opacity:0;width:100%;z-index:1050;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .ng-dropdown-panel-items{display:block;height:auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;max-height:240px;overflow-y:auto}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{box-sizing:border-box;cursor:pointer;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-option-label:empty:before{content:\"\\200b\"}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .highlighted{font-weight:700;text-decoration:underline}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.disabled{cursor:default}.ng-dropdown-panel .scroll-host{overflow:hidden;overflow-y:auto;position:relative;display:block;-webkit-overflow-scrolling:touch}.ng-dropdown-panel .scrollable-content{top:0;left:0;width:100%;height:100%;position:absolute}.ng-dropdown-panel .total-padding{width:1px;opacity:0}.ng-visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0;white-space:nowrap}\n"] }]
|
|
2970
|
-
}], ctorParameters: () => [], propDecorators: { ariaLabelDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelDropdown", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], markFirst: [{ type: i0.Input, args: [{ isSignal: true, alias: "markFirst", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], fixedPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedPlaceholder", required: false }] }], notFoundText: [{ type: i0.Input, args: [{ isSignal: true, alias: "notFoundText", required: false }] }], typeToSearchText: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeToSearchText", required: false }] }], preventToggleOnRightClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventToggleOnRightClick", required: false }] }], addTagText: [{ type: i0.Input, args: [{ isSignal: true, alias: "addTagText", required: false }] }], loadingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingText", required: false }] }], clearAllText: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearAllText", required: false }] }], dropdownPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownPosition", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], hideSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideSelected", required: false }] }], selectOnTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectOnTab", required: false }] }], openOnEnter: [{ type: i0.Input, args: [{ isSignal: true, alias: "openOnEnter", required: false }] }], maxSelectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelectedItems", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], groupValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupValue", required: false }] }], bufferAmount: [{ type: i0.Input, args: [{ isSignal: true, alias: "bufferAmount", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], selectableGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectableGroup", required: false }] }], tabFocusOnClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabFocusOnClearButton", required: false }] }], selectableGroupAsModel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectableGroupAsModel", required: false }] }], searchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchFn", required: false }] }], trackByFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackByFn", required: false }] }], clearOnBackspace: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearOnBackspace", required: false }] }], labelForId: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelForId", required: false }] }], inputAttrs: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputAttrs", required: false }] }], tabIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabIndex", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], searchWhileComposing: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchWhileComposing", required: false }] }], minTermLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minTermLength", required: false }] }], editableSearchTerm: [{ type: i0.Input, args: [{ isSignal: true, alias: "editableSearchTerm", required: false }] }], ngClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngClass", required: false }] }], typeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeahead", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], addTag: [{ type: i0.Input, args: [{ isSignal: true, alias: "addTag", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], deselectOnClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "deselectOnClick", required: false }] }], clearSearchOnAdd: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearSearchOnAdd", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }, { type: i0.Output, args: ["bindLabelChange"] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }, { type: i0.Output, args: ["bindValueChange"] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }, { type: i0.Output, args: ["appearanceChange"] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], blurEvent: [{ type: i0.Output, args: ["blur"] }], focusEvent: [{ type: i0.Output, args: ["focus"] }], changeEvent: [{ type: i0.Output, args: ["change"] }], openEvent: [{ type: i0.Output, args: ["open"] }], closeEvent: [{ type: i0.Output, args: ["close"] }], searchEvent: [{ type: i0.Output, args: ["search"] }], clearEvent: [{ type: i0.Output, args: ["clear"] }], addEvent: [{ type: i0.Output, args: ["add"] }], removeEvent: [{ type: i0.Output, args: ["remove"] }], scroll: [{ type: i0.Output, args: ["scroll"] }], scrollToEnd: [{ type: i0.Output, args: ["scrollToEnd"] }], optionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgOptionTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], optgroupTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgOptgroupTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], labelTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgLabelTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], multiLabelTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgMultiLabelTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], headerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgHeaderTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgFooterTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], notFoundTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgNotFoundTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], placeholderTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgPlaceholderTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], typeToSearchTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgTypeToSearchTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], loadingTextTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgLoadingTextTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], tagTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgTagTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], loadingSpinnerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgLoadingSpinnerTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], clearButtonTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgClearButtonTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }],
|
|
2957
|
+
}], ctorParameters: () => [], propDecorators: { ariaLabelDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelDropdown", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], markFirst: [{ type: i0.Input, args: [{ isSignal: true, alias: "markFirst", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], fixedPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedPlaceholder", required: false }] }], notFoundText: [{ type: i0.Input, args: [{ isSignal: true, alias: "notFoundText", required: false }] }], typeToSearchText: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeToSearchText", required: false }] }], preventToggleOnRightClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventToggleOnRightClick", required: false }] }], addTagText: [{ type: i0.Input, args: [{ isSignal: true, alias: "addTagText", required: false }] }], loadingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingText", required: false }] }], clearAllText: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearAllText", required: false }] }], dropdownPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownPosition", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], hideSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideSelected", required: false }] }], selectOnTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectOnTab", required: false }] }], openOnEnter: [{ type: i0.Input, args: [{ isSignal: true, alias: "openOnEnter", required: false }] }], maxSelectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelectedItems", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], groupValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupValue", required: false }] }], bufferAmount: [{ type: i0.Input, args: [{ isSignal: true, alias: "bufferAmount", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], selectableGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectableGroup", required: false }] }], tabFocusOnClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabFocusOnClearButton", required: false }] }], selectableGroupAsModel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectableGroupAsModel", required: false }] }], searchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchFn", required: false }] }], trackByFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackByFn", required: false }] }], clearOnBackspace: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearOnBackspace", required: false }] }], labelForId: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelForId", required: false }] }], inputAttrs: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputAttrs", required: false }] }], tabIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabIndex", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], searchWhileComposing: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchWhileComposing", required: false }] }], minTermLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minTermLength", required: false }] }], editableSearchTerm: [{ type: i0.Input, args: [{ isSignal: true, alias: "editableSearchTerm", required: false }] }], ngClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngClass", required: false }] }], typeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeahead", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], addTag: [{ type: i0.Input, args: [{ isSignal: true, alias: "addTag", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], deselectOnClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "deselectOnClick", required: false }] }], clearSearchOnAdd: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearSearchOnAdd", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], keyDownFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "keyDownFn", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }, { type: i0.Output, args: ["bindLabelChange"] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }, { type: i0.Output, args: ["bindValueChange"] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }, { type: i0.Output, args: ["appearanceChange"] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }, { type: i0.Output, args: ["itemsChange"] }], blurEvent: [{ type: i0.Output, args: ["blur"] }], focusEvent: [{ type: i0.Output, args: ["focus"] }], changeEvent: [{ type: i0.Output, args: ["change"] }], openEvent: [{ type: i0.Output, args: ["open"] }], closeEvent: [{ type: i0.Output, args: ["close"] }], searchEvent: [{ type: i0.Output, args: ["search"] }], clearEvent: [{ type: i0.Output, args: ["clear"] }], addEvent: [{ type: i0.Output, args: ["add"] }], removeEvent: [{ type: i0.Output, args: ["remove"] }], scroll: [{ type: i0.Output, args: ["scroll"] }], scrollToEnd: [{ type: i0.Output, args: ["scrollToEnd"] }], optionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgOptionTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], optgroupTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgOptgroupTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], labelTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgLabelTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], multiLabelTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgMultiLabelTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], headerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgHeaderTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgFooterTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], notFoundTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgNotFoundTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], placeholderTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgPlaceholderTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], typeToSearchTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgTypeToSearchTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], loadingTextTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgLoadingTextTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], tagTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgTagTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], loadingSpinnerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgLoadingSpinnerTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], clearButtonTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgClearButtonTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], ngOptions: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => NgOptionComponent), { ...{ descendants: true }, isSignal: true }] }], dropdownPanel: [{ type: i0.ViewChild, args: [forwardRef(() => NgDropdownPanelComponent), { isSignal: true }] }], searchInput: [{ type: i0.ViewChild, args: ['searchInput', { isSignal: true }] }], clearButton: [{ type: i0.ViewChild, args: ['clearButton', { isSignal: true }] }], handleKeyDown: [{
|
|
2971
2958
|
type: HostListener,
|
|
2972
2959
|
args: ['keydown', ['$event']]
|
|
2973
2960
|
}] } });
|