@ng-select/ng-select 5.0.12 → 5.1.0

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.
@@ -28,6 +28,8 @@
28
28
  return extendStatics(d, b);
29
29
  };
30
30
  function __extends(d, b) {
31
+ if (typeof b !== "function" && b !== null)
32
+ throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
31
33
  extendStatics(d, b);
32
34
  function __() { this.constructor = d; }
33
35
  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -213,11 +215,13 @@
213
215
  }
214
216
  return ar;
215
217
  }
218
+ /** @deprecated */
216
219
  function __spread() {
217
220
  for (var ar = [], i = 0; i < arguments.length; i++)
218
221
  ar = ar.concat(__read(arguments[i]));
219
222
  return ar;
220
223
  }
224
+ /** @deprecated */
221
225
  function __spreadArrays() {
222
226
  for (var s = 0, i = 0, il = arguments.length; i < il; i++)
223
227
  s += arguments[i].length;
@@ -226,7 +230,11 @@
226
230
  r[k] = a[j];
227
231
  return r;
228
232
  }
229
- ;
233
+ function __spreadArray(to, from) {
234
+ for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
235
+ to[j] = from[i];
236
+ return to;
237
+ }
230
238
  function __await(v) {
231
239
  return this instanceof __await ? (this.v = v, this) : new __await(v);
232
240
  }
@@ -2109,7 +2117,7 @@
2109
2117
  */
2110
2118
  ItemsList.prototype._getNextItemIndex = function (steps) {
2111
2119
  if (steps > 0) {
2112
- return (this._markedIndex === this._filteredItems.length - 1) ? 0 : (this._markedIndex + 1);
2120
+ return (this._markedIndex >= this._filteredItems.length - 1) ? 0 : (this._markedIndex + 1);
2113
2121
  }
2114
2122
  return (this._markedIndex <= 0) ? (this._filteredItems.length - 1) : (this._markedIndex - 1);
2115
2123
  };
@@ -2247,7 +2255,10 @@
2247
2255
  */function (/**
2248
2256
  * @param {?} x
2249
2257
  * @return {?}
2250
- */ x) { return (Object.assign(Object.assign({}, x), { index: i++ })); }))));
2258
+ */ x) {
2259
+ x.index = i++;
2260
+ return x;
2261
+ }))));
2251
2262
  return "continue";
2252
2263
  }
2253
2264
  /** @type {?} */
@@ -3365,6 +3376,8 @@
3365
3376
  /** @type {?} */
3366
3377
  NgSelectConfig.prototype.bindValue;
3367
3378
  /** @type {?} */
3379
+ NgSelectConfig.prototype.bindLabel;
3380
+ /** @type {?} */
3368
3381
  NgSelectConfig.prototype.appearance;
3369
3382
  }
3370
3383
 
@@ -4299,6 +4312,7 @@
4299
4312
  if (item) {
4300
4313
  if (_this.isOpen) {
4301
4314
  _this.itemsList.markItem(item);
4315
+ _this._scrollToMarked();
4302
4316
  _this._cd.markForCheck();
4303
4317
  }
4304
4318
  else {
@@ -4604,6 +4618,7 @@
4604
4618
  this.openOnEnter = isDefined(this.openOnEnter) ? this.openOnEnter : config.openOnEnter;
4605
4619
  this.appendTo = this.appendTo || config.appendTo;
4606
4620
  this.bindValue = this.bindValue || config.bindValue;
4621
+ this.bindLabel = this.bindLabel || config.bindLabel;
4607
4622
  this.appearance = this.appearance || config.appearance;
4608
4623
  };
4609
4624
  return NgSelectComponent;
@@ -4611,7 +4626,7 @@
4611
4626
  NgSelectComponent.decorators = [
4612
4627
  { type: i0.Component, args: [{
4613
4628
  selector: 'ng-select',
4614
- template: "<div\n (mousedown)=\"handleMousedown($event)\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n class=\"ng-select-container\">\n\n <div class=\"ng-value-container\">\n <div class=\"ng-placeholder\">{{placeholder}}</div>\n\n <ng-container *ngIf=\"!multiLabelTemplate && selectedItems.length > 0\">\n <div [class.ng-value-disabled]=\"item.disabled\" class=\"ng-value\" *ngFor=\"let item of selectedItems; trackBy: trackByOption\">\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\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\">\n </ng-template>\n </div>\n </ng-container>\n\n <ng-template *ngIf=\"multiLabelTemplate && selectedValues.length > 0\"\n [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: selectedValues, clear: clearItem }\">\n </ng-template>\n\n <div class=\"ng-input\"\n role=\"combobox\" \n [attr.aria-expanded]=\"isOpen\" \n [attr.aria-owns]=\"isOpen ? dropdownId : null\" \n aria-haspopup=\"listbox\">\n\n <input #searchInput\n [attr.id]=\"labelForId\"\n [attr.tabindex]=\"tabIndex\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [disabled]=\"disabled\"\n [value]=\"searchTerm ? searchTerm : ''\"\n (input)=\"filter(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"$event.stopPropagation()\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList?.markedItem?.htmlId : null\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"isOpen ? dropdownId : null\">\n </div>\n </div>\n\n <ng-container *ngIf=\"loading\">\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-spinner-loader\"></div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\">\n </ng-template>\n </ng-container>\n\n <span *ngIf=\"showClear()\" class=\"ng-clear-wrapper\" title=\"{{clearAllText}}\">\n <span class=\"ng-clear\" aria-hidden=\"true\">\u00D7</span>\n </span>\n\n <span class=\"ng-arrow-wrapper\">\n <span class=\"ng-arrow\"></span>\n </span>\n</div>\n\n<ng-dropdown-panel *ngIf=\"isOpen\"\n class=\"ng-dropdown-panel\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"dropdownPosition\"\n [headerTemplate]=\"headerTemplate\"\n [footerTemplate]=\"footerTemplate\"\n [filterValue]=\"searchTerm\"\n [items]=\"itemsList.filteredItems\"\n [markedItem]=\"itemsList.markedItem\"\n (update)=\"viewPortItems = $event\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit($event)\"\n (outsideClick)=\"close()\"\n [class.ng-select-multiple]=\"multiple\"\n [ngClass]=\"appendTo ? classes : null\"\n [id]=\"dropdownId\"\n role=\"listbox\"\n aria-label=\"Options list\">\n\n <ng-container>\n <div class=\"ng-option\" [attr.role]=\"item.children ? 'group' : 'option'\" (click)=\"toggleItem(item)\" (mouseover)=\"onItemHover(item)\"\n *ngFor=\"let item of viewPortItems; trackBy: trackByOption\"\n [class.ng-option-disabled]=\"item.disabled\"\n [class.ng-option-selected]=\"item.selected\"\n [class.ng-optgroup]=\"item.children\"\n [class.ng-option]=\"!item.children\"\n [class.ng-option-child]=\"!!item.parent\"\n [class.ng-option-marked]=\"item === itemsList.markedItem\"\n [attr.aria-selected]=\"item.selected\"\n [attr.id]=\"item?.htmlId\">\n\n <ng-template #defaultOptionTemplate>\n <span class=\"ng-option-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"item.children ? (optgroupTemplate || defaultOptionTemplate) : (optionTemplate || defaultOptionTemplate)\"\n [ngTemplateOutletContext]=\"{ item: item.value, item$:item, index: item.index, searchTerm: searchTerm }\">\n </ng-template>\n </div>\n\n <div class=\"ng-option\" [class.ng-option-marked]=\"!itemsList.markedItem\" (mouseover)=\"itemsList.unmarkItem()\" role=\"option\" (click)=\"selectTag()\" *ngIf=\"showAddTag\">\n <ng-template #defaultTagTemplate>\n <span><span class=\"ng-tag-label\">{{addTagText}}</span>\"{{searchTerm}}\"</span>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showNoItemsFound()\">\n <ng-template #defaultNotFoundTemplate>\n <div class=\"ng-option ng-option-disabled\">{{notFoundText}}</div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"notFoundTemplate || defaultNotFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"showTypeToSearch()\">\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{typeToSearchText}}</div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\">\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"loading && itemsList.filteredItems.length === 0\">\n <ng-template #defaultLoadingTextTemplate>\n <div class=\"ng-option ng-option-disabled\">{{loadingText}}</div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"loadingTextTemplate || defaultLoadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-container>\n\n</ng-dropdown-panel>\n",
4629
+ template: "<div\n (mousedown)=\"handleMousedown($event)\"\n [class.ng-appearance-outline]=\"appearance === 'outline'\"\n [class.ng-has-value]=\"hasValue\"\n class=\"ng-select-container\">\n\n <div class=\"ng-value-container\">\n <div class=\"ng-placeholder\">{{placeholder}}</div>\n\n <ng-container *ngIf=\"(!multiLabelTemplate || !multiple ) && selectedItems.length > 0\">\n <div [class.ng-value-disabled]=\"item.disabled\" class=\"ng-value\" *ngFor=\"let item of selectedItems; trackBy: trackByOption\">\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\n <ng-template\n [ngTemplateOutlet]=\"labelTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item.value, clear: clearItem, label: item.label }\">\n </ng-template>\n </div>\n </ng-container>\n\n <ng-template *ngIf=\"multiple && multiLabelTemplate && selectedValues.length > 0\"\n [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: selectedValues, clear: clearItem }\">\n </ng-template>\n\n <div class=\"ng-input\"\n role=\"combobox\" \n [attr.aria-expanded]=\"isOpen\" \n [attr.aria-owns]=\"isOpen ? dropdownId : null\" \n aria-haspopup=\"listbox\">\n\n <input #searchInput\n [attr.id]=\"labelForId\"\n [attr.tabindex]=\"tabIndex\"\n [readOnly]=\"!searchable || itemsList.maxItemsSelected\"\n [disabled]=\"disabled\"\n [value]=\"searchTerm ? searchTerm : ''\"\n (input)=\"filter(searchInput.value)\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd(searchInput.value)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"$event.stopPropagation()\"\n [attr.aria-activedescendant]=\"isOpen ? itemsList?.markedItem?.htmlId : null\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"isOpen ? dropdownId : null\">\n </div>\n </div>\n\n <ng-container *ngIf=\"loading\">\n <ng-template #defaultLoadingSpinnerTemplate>\n <div class=\"ng-spinner-loader\"></div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"loadingSpinnerTemplate || defaultLoadingSpinnerTemplate\">\n </ng-template>\n </ng-container>\n\n <span *ngIf=\"showClear()\" class=\"ng-clear-wrapper\" title=\"{{clearAllText}}\">\n <span class=\"ng-clear\" aria-hidden=\"true\">\u00D7</span>\n </span>\n\n <span class=\"ng-arrow-wrapper\">\n <span class=\"ng-arrow\"></span>\n </span>\n</div>\n\n<ng-dropdown-panel *ngIf=\"isOpen\"\n class=\"ng-dropdown-panel\"\n [virtualScroll]=\"virtualScroll\"\n [bufferAmount]=\"bufferAmount\"\n [appendTo]=\"appendTo\"\n [position]=\"dropdownPosition\"\n [headerTemplate]=\"headerTemplate\"\n [footerTemplate]=\"footerTemplate\"\n [filterValue]=\"searchTerm\"\n [items]=\"itemsList.filteredItems\"\n [markedItem]=\"itemsList.markedItem\"\n (update)=\"viewPortItems = $event\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit($event)\"\n (outsideClick)=\"close()\"\n [class.ng-select-multiple]=\"multiple\"\n [ngClass]=\"appendTo ? classes : null\"\n [id]=\"dropdownId\"\n role=\"listbox\"\n aria-label=\"Options list\">\n\n <ng-container>\n <div class=\"ng-option\" [attr.role]=\"item.children ? 'group' : 'option'\" (click)=\"toggleItem(item)\" (mouseover)=\"onItemHover(item)\"\n *ngFor=\"let item of viewPortItems; trackBy: trackByOption\"\n [class.ng-option-disabled]=\"item.disabled\"\n [class.ng-option-selected]=\"item.selected\"\n [class.ng-optgroup]=\"item.children\"\n [class.ng-option]=\"!item.children\"\n [class.ng-option-child]=\"!!item.parent\"\n [class.ng-option-marked]=\"item === itemsList.markedItem\"\n [attr.aria-selected]=\"item.selected\"\n [attr.id]=\"item?.htmlId\">\n\n <ng-template #defaultOptionTemplate>\n <span class=\"ng-option-label\" [ngItemLabel]=\"item.label\" [escape]=\"escapeHTML\"></span>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"item.children ? (optgroupTemplate || defaultOptionTemplate) : (optionTemplate || defaultOptionTemplate)\"\n [ngTemplateOutletContext]=\"{ item: item.value, item$:item, index: item.index, searchTerm: searchTerm }\">\n </ng-template>\n </div>\n\n <div class=\"ng-option\" [class.ng-option-marked]=\"!itemsList.markedItem\" (mouseover)=\"itemsList.unmarkItem()\" role=\"option\" (click)=\"selectTag()\" *ngIf=\"showAddTag\">\n <ng-template #defaultTagTemplate>\n <span><span class=\"ng-tag-label\">{{addTagText}}</span>\"{{searchTerm}}\"</span>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"tagTemplate || defaultTagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showNoItemsFound()\">\n <ng-template #defaultNotFoundTemplate>\n <div class=\"ng-option ng-option-disabled\">{{notFoundText}}</div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"notFoundTemplate || defaultNotFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"showTypeToSearch()\">\n <ng-template #defaultTypeToSearchTemplate>\n <div class=\"ng-option ng-option-disabled\">{{typeToSearchText}}</div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"typeToSearchTemplate || defaultTypeToSearchTemplate\">\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"loading && itemsList.filteredItems.length === 0\">\n <ng-template #defaultLoadingTextTemplate>\n <div class=\"ng-option ng-option-disabled\">{{loadingText}}</div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"loadingTextTemplate || defaultLoadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-container>\n\n</ng-dropdown-panel>\n",
4615
4630
  providers: [{
4616
4631
  provide: forms.NG_VALUE_ACCESSOR,
4617
4632
  useExisting: i0.forwardRef(( /**