@stackline/angular-multiselect-dropdown 12.0.0 → 14.0.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.
Files changed (40) hide show
  1. package/README.md +12 -12
  2. package/esm2020/lib/clickOutside.mjs +78 -0
  3. package/esm2020/lib/list-filter.mjs +33 -0
  4. package/esm2020/lib/menu-item.mjs +62 -0
  5. package/esm2020/lib/multiselect.component.mjs +391 -0
  6. package/esm2020/lib/multiselect.interface.mjs +2 -0
  7. package/esm2020/lib/multiselect.model.mjs +9 -0
  8. package/esm2020/public-api.mjs +6 -0
  9. package/esm2020/stackline-angular-multiselect-dropdown.mjs +5 -0
  10. package/fesm2015/stackline-angular-multiselect-dropdown.mjs +570 -0
  11. package/fesm2015/stackline-angular-multiselect-dropdown.mjs.map +1 -0
  12. package/fesm2020/stackline-angular-multiselect-dropdown.mjs +570 -0
  13. package/fesm2020/stackline-angular-multiselect-dropdown.mjs.map +1 -0
  14. package/index.d.ts +5 -0
  15. package/lib/clickOutside.d.ts +27 -0
  16. package/lib/list-filter.d.ts +9 -0
  17. package/lib/menu-item.d.ts +25 -0
  18. package/lib/multiselect.component.d.ts +80 -0
  19. package/lib/multiselect.interface.d.ts +22 -0
  20. package/lib/multiselect.model.d.ts +10 -0
  21. package/package.json +37 -105
  22. package/public-api.d.ts +6 -0
  23. package/angular2-multiselect-dropdown.ts +0 -1
  24. package/gulpfile.js +0 -68
  25. package/inline-resources.js +0 -119
  26. package/multiselect.component.css +0 -733
  27. package/src/app/angular2-multiselect-dropdown/angular2-multiselect-dropdown.ts +0 -6
  28. package/src/app/angular2-multiselect-dropdown/clickOutside.ts +0 -60
  29. package/src/app/angular2-multiselect-dropdown/index.ts +0 -6
  30. package/src/app/angular2-multiselect-dropdown/list-filter.ts +0 -29
  31. package/src/app/angular2-multiselect-dropdown/menu-item.ts +0 -55
  32. package/src/app/angular2-multiselect-dropdown/multiselect.component.html +0 -88
  33. package/src/app/angular2-multiselect-dropdown/multiselect.component.scss +0 -710
  34. package/src/app/angular2-multiselect-dropdown/multiselect.component.ts +0 -405
  35. package/src/app/angular2-multiselect-dropdown/multiselect.interface.ts +0 -22
  36. package/src/app/angular2-multiselect-dropdown/multiselect.model.ts +0 -13
  37. package/tsconfig-aot.json +0 -32
  38. package/tsconfig.json +0 -36
  39. package/webpack-test.config.ts +0 -70
  40. package/webpack-umd.config.ts +0 -98
@@ -0,0 +1,570 @@
1
+ import * as i0 from '@angular/core';
2
+ import { EventEmitter, Directive, Output, HostListener, Input, Pipe, TemplateRef, Component, ContentChild, forwardRef, ViewChild, NgModule } from '@angular/core';
3
+ import * as i2 from '@angular/forms';
4
+ import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormsModule } from '@angular/forms';
5
+ import * as i1 from '@angular/common';
6
+ import { CommonModule } from '@angular/common';
7
+
8
+ class ListItem {
9
+ }
10
+ class MyException {
11
+ constructor(status, body) {
12
+ this.status = status;
13
+ this.body = body;
14
+ }
15
+ }
16
+
17
+ class ClickOutsideDirective {
18
+ constructor(_elementRef) {
19
+ this._elementRef = _elementRef;
20
+ this.clickOutside = new EventEmitter();
21
+ }
22
+ onClick(event, targetElement) {
23
+ if (!targetElement) {
24
+ return;
25
+ }
26
+ const clickedInside = this._elementRef.nativeElement.contains(targetElement);
27
+ if (!clickedInside) {
28
+ this.clickOutside.emit(event);
29
+ }
30
+ }
31
+ }
32
+ ClickOutsideDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ClickOutsideDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
33
+ ClickOutsideDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: ClickOutsideDirective, selector: "[clickOutside]", outputs: { clickOutside: "clickOutside" }, host: { listeners: { "document:click": "onClick($event,$event.target)", "document:touchstart": "onClick($event,$event.target)" } }, ngImport: i0 });
34
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ClickOutsideDirective, decorators: [{
35
+ type: Directive,
36
+ args: [{
37
+ selector: '[clickOutside]'
38
+ }]
39
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { clickOutside: [{
40
+ type: Output
41
+ }], onClick: [{
42
+ type: HostListener,
43
+ args: ['document:click', ['$event', '$event.target']]
44
+ }, {
45
+ type: HostListener,
46
+ args: ['document:touchstart', ['$event', '$event.target']]
47
+ }] } });
48
+ class ScrollDirective {
49
+ constructor(_elementRef) {
50
+ this._elementRef = _elementRef;
51
+ this.scroll = new EventEmitter();
52
+ }
53
+ onClick(event, targetElement) {
54
+ this.scroll.emit(event);
55
+ }
56
+ }
57
+ ScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScrollDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
58
+ ScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: ScrollDirective, selector: "[scroll]", outputs: { scroll: "scroll" }, host: { listeners: { "scroll": "onClick($event)" } }, ngImport: i0 });
59
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScrollDirective, decorators: [{
60
+ type: Directive,
61
+ args: [{
62
+ selector: '[scroll]'
63
+ }]
64
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { scroll: [{
65
+ type: Output
66
+ }], onClick: [{
67
+ type: HostListener,
68
+ args: ['scroll', ['$event']]
69
+ }] } });
70
+ class styleDirective {
71
+ constructor(el) {
72
+ this.el = el;
73
+ }
74
+ ngOnInit() {
75
+ this.el.nativeElement.style.top = this.styleVal;
76
+ }
77
+ ngOnChanges() {
78
+ this.el.nativeElement.style.top = this.styleVal;
79
+ }
80
+ }
81
+ styleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: styleDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
82
+ styleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: styleDirective, selector: "[styleProp]", inputs: { styleVal: ["styleProp", "styleVal"] }, usesOnChanges: true, ngImport: i0 });
83
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: styleDirective, decorators: [{
84
+ type: Directive,
85
+ args: [{
86
+ selector: '[styleProp]'
87
+ }]
88
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { styleVal: [{
89
+ type: Input,
90
+ args: ['styleProp']
91
+ }] } });
92
+
93
+ class ListFilterPipe {
94
+ transform(items, filter) {
95
+ if (!items || !filter) {
96
+ return items;
97
+ }
98
+ return items.filter((item) => this.applyFilter(item, filter));
99
+ }
100
+ applyFilter(item, filter) {
101
+ let found = false;
102
+ for (var prop in item) {
103
+ if (filter) {
104
+ if (item[prop].toString().toLowerCase().indexOf(filter.toLowerCase()) >= 0) {
105
+ found = true;
106
+ }
107
+ }
108
+ else
109
+ found = true;
110
+ }
111
+ return found;
112
+ }
113
+ }
114
+ ListFilterPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ListFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
115
+ ListFilterPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: ListFilterPipe, name: "listFilter", pure: false });
116
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ListFilterPipe, decorators: [{
117
+ type: Pipe,
118
+ args: [{
119
+ name: 'listFilter',
120
+ pure: false
121
+ }]
122
+ }] });
123
+
124
+ class Item {
125
+ constructor() {
126
+ }
127
+ }
128
+ Item.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Item, deps: [], target: i0.ɵɵFactoryTarget.Component });
129
+ Item.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: Item, selector: "c-item", queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: ``, isInline: true });
130
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Item, decorators: [{
131
+ type: Component,
132
+ args: [{
133
+ selector: 'c-item',
134
+ template: ``
135
+ }]
136
+ }], ctorParameters: function () { return []; }, propDecorators: { template: [{
137
+ type: ContentChild,
138
+ args: [TemplateRef, { static: false }]
139
+ }] } });
140
+ class Badge {
141
+ constructor() {
142
+ }
143
+ }
144
+ Badge.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Badge, deps: [], target: i0.ɵɵFactoryTarget.Component });
145
+ Badge.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: Badge, selector: "c-badge", queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: ``, isInline: true });
146
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: Badge, decorators: [{
147
+ type: Component,
148
+ args: [{
149
+ selector: 'c-badge',
150
+ template: ``
151
+ }]
152
+ }], ctorParameters: function () { return []; }, propDecorators: { template: [{
153
+ type: ContentChild,
154
+ args: [TemplateRef, { static: false }]
155
+ }] } });
156
+ class TemplateRenderer {
157
+ constructor(viewContainer) {
158
+ this.viewContainer = viewContainer;
159
+ }
160
+ ngOnInit() {
161
+ this.view = this.viewContainer.createEmbeddedView(this.data.template, {
162
+ '\$implicit': this.data,
163
+ 'item': this.item
164
+ });
165
+ }
166
+ ngOnDestroy() {
167
+ this.view.destroy();
168
+ }
169
+ }
170
+ TemplateRenderer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TemplateRenderer, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
171
+ TemplateRenderer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TemplateRenderer, selector: "c-templateRenderer", inputs: { data: "data", item: "item" }, ngImport: i0, template: ``, isInline: true });
172
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TemplateRenderer, decorators: [{
173
+ type: Component,
174
+ args: [{
175
+ selector: 'c-templateRenderer',
176
+ template: ``
177
+ }]
178
+ }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { data: [{
179
+ type: Input
180
+ }], item: [{
181
+ type: Input
182
+ }] } });
183
+
184
+ const DROPDOWN_CONTROL_VALUE_ACCESSOR = {
185
+ provide: NG_VALUE_ACCESSOR,
186
+ useExisting: forwardRef(() => AngularMultiSelect),
187
+ multi: true
188
+ };
189
+ const DROPDOWN_CONTROL_VALIDATION = {
190
+ provide: NG_VALIDATORS,
191
+ useExisting: forwardRef(() => AngularMultiSelect),
192
+ multi: true,
193
+ };
194
+ const noop = () => {
195
+ };
196
+ class AngularMultiSelect {
197
+ constructor(_elementRef) {
198
+ this._elementRef = _elementRef;
199
+ this.onSelect = new EventEmitter();
200
+ this.onDeSelect = new EventEmitter();
201
+ this.onSelectAll = new EventEmitter();
202
+ this.onDeSelectAll = new EventEmitter();
203
+ this.onOpen = new EventEmitter();
204
+ this.onClose = new EventEmitter();
205
+ this.isActive = false;
206
+ this.isSelectAll = false;
207
+ this.chunkIndex = [];
208
+ this.cachedItems = [];
209
+ this.itemHeight = 41.6;
210
+ this.defaultSettings = {
211
+ singleSelection: false,
212
+ text: 'Select',
213
+ enableCheckAll: true,
214
+ selectAllText: 'Select All',
215
+ unSelectAllText: 'UnSelect All',
216
+ enableSearchFilter: false,
217
+ maxHeight: 300,
218
+ badgeShowLimit: 999999999999,
219
+ classes: '',
220
+ disabled: false,
221
+ searchPlaceholderText: 'Search',
222
+ showCheckbox: true,
223
+ noDataLabel: 'No Data Available',
224
+ searchAutofocus: true,
225
+ lazyLoading: false,
226
+ labelKey: 'itemName',
227
+ theme: 'classic',
228
+ skin: 'classic'
229
+ };
230
+ this.onTouchedCallback = noop;
231
+ this.onChangeCallback = noop;
232
+ }
233
+ getThemeName() {
234
+ let rawTheme = 'classic';
235
+ if (this.settings) {
236
+ rawTheme = this.settings.skin || this.settings.theme || 'classic';
237
+ }
238
+ let theme = String(rawTheme).toLowerCase().replace(/[^a-z0-9_-]+/g, '-');
239
+ theme = theme.replace(/^-+|-+$/g, '');
240
+ return theme || 'classic';
241
+ }
242
+ getDropdownClasses() {
243
+ let theme = this.getThemeName();
244
+ let className = 'theme-' + theme;
245
+ if (theme !== 'classic' && theme !== 'material' && theme !== 'dark' && theme !== 'custom') {
246
+ className += ' theme-custom';
247
+ }
248
+ if (this.isActive) {
249
+ className += ' is-open';
250
+ }
251
+ if (this.settings && this.settings.disabled) {
252
+ className += ' is-disabled';
253
+ }
254
+ return className;
255
+ }
256
+ ngOnInit() {
257
+ this.settings = Object.assign(this.defaultSettings, this.settings);
258
+ if (this.settings.groupBy) {
259
+ this.groupedData = this.transformData(this.data, this.settings.groupBy);
260
+ }
261
+ this.totalRows = (this.data && this.data.length);
262
+ this.cachedItems = this.data;
263
+ this.screenItemsLen = Math.ceil(this.settings.maxHeight / this.itemHeight);
264
+ this.cachedItemsLen = this.screenItemsLen * 3;
265
+ this.totalHeight = this.itemHeight * this.totalRows;
266
+ this.maxBuffer = this.screenItemsLen * this.itemHeight;
267
+ this.lastScrolled = 0;
268
+ this.renderChunk(0, this.cachedItemsLen / 2);
269
+ }
270
+ ngOnChanges(changes) {
271
+ if (changes.data && !changes.data.isFirstChange()) {
272
+ if (this.settings.groupBy) {
273
+ this.groupedData = this.transformData(this.data, this.settings.groupBy);
274
+ if (this.data.length == 0) {
275
+ this.selectedItems = [];
276
+ }
277
+ }
278
+ }
279
+ if (changes.settings && !changes.settings.isFirstChange()) {
280
+ this.settings = Object.assign(this.defaultSettings, this.settings);
281
+ }
282
+ }
283
+ ngDoCheck() {
284
+ if (this.selectedItems) {
285
+ if (this.selectedItems.length == 0 || this.data.length == 0 || this.selectedItems.length < this.data.length) {
286
+ this.isSelectAll = false;
287
+ }
288
+ }
289
+ }
290
+ ngAfterViewInit() {
291
+ if (this.settings.lazyLoading) {
292
+ this._elementRef.nativeElement.getElementsByClassName("lazyContainer")[0].addEventListener('scroll', this.onScroll.bind(this));
293
+ }
294
+ }
295
+ onItemClick(item, index, evt) {
296
+ if (this.settings.disabled) {
297
+ return false;
298
+ }
299
+ let found = this.isSelected(item);
300
+ let limit = this.selectedItems.length < this.settings.limitSelection ? true : false;
301
+ if (!found) {
302
+ if (this.settings.limitSelection) {
303
+ if (limit) {
304
+ this.addSelected(item);
305
+ this.onSelect.emit(item);
306
+ }
307
+ }
308
+ else {
309
+ this.addSelected(item);
310
+ this.onSelect.emit(item);
311
+ }
312
+ }
313
+ else {
314
+ this.removeSelected(item);
315
+ this.onDeSelect.emit(item);
316
+ }
317
+ if (this.isSelectAll || this.data.length > this.selectedItems.length) {
318
+ this.isSelectAll = false;
319
+ }
320
+ if (this.data.length == this.selectedItems.length) {
321
+ this.isSelectAll = true;
322
+ }
323
+ }
324
+ validate(c) {
325
+ return null;
326
+ }
327
+ writeValue(value) {
328
+ if (value !== undefined && value !== null) {
329
+ if (this.settings.singleSelection) {
330
+ try {
331
+ if (value.length > 1) {
332
+ this.selectedItems = [value[0]];
333
+ throw new MyException(404, { "msg": "Single Selection Mode, Selected Items cannot have more than one item." });
334
+ }
335
+ else {
336
+ this.selectedItems = value;
337
+ }
338
+ }
339
+ catch (e) {
340
+ console.error(e.body.msg);
341
+ }
342
+ }
343
+ else {
344
+ if (this.settings.limitSelection) {
345
+ this.selectedItems = value.splice(0, this.settings.limitSelection);
346
+ }
347
+ else {
348
+ this.selectedItems = value;
349
+ }
350
+ if (this.selectedItems.length === this.data.length && this.data.length > 0) {
351
+ this.isSelectAll = true;
352
+ }
353
+ }
354
+ }
355
+ else {
356
+ this.selectedItems = [];
357
+ }
358
+ }
359
+ //From ControlValueAccessor interface
360
+ registerOnChange(fn) {
361
+ this.onChangeCallback = fn;
362
+ }
363
+ //From ControlValueAccessor interface
364
+ registerOnTouched(fn) {
365
+ this.onTouchedCallback = fn;
366
+ }
367
+ trackByFn(index, item) {
368
+ return item.id;
369
+ }
370
+ isSelected(clickedItem) {
371
+ let found = false;
372
+ this.selectedItems && this.selectedItems.forEach(item => {
373
+ if (clickedItem.id === item.id) {
374
+ found = true;
375
+ }
376
+ });
377
+ return found;
378
+ }
379
+ addSelected(item) {
380
+ if (this.settings.singleSelection) {
381
+ this.selectedItems = [];
382
+ this.selectedItems.push(item);
383
+ this.closeDropdown();
384
+ }
385
+ else
386
+ this.selectedItems.push(item);
387
+ this.onChangeCallback(this.selectedItems);
388
+ this.onTouchedCallback(this.selectedItems);
389
+ }
390
+ removeSelected(clickedItem) {
391
+ this.selectedItems && this.selectedItems.forEach(item => {
392
+ if (clickedItem.id === item.id) {
393
+ this.selectedItems.splice(this.selectedItems.indexOf(item), 1);
394
+ }
395
+ });
396
+ this.onChangeCallback(this.selectedItems);
397
+ this.onTouchedCallback(this.selectedItems);
398
+ }
399
+ toggleDropdown(evt) {
400
+ if (this.settings.disabled) {
401
+ return false;
402
+ }
403
+ this.isActive = !this.isActive;
404
+ if (this.isActive) {
405
+ if (this.settings.searchAutofocus && this.settings.enableSearchFilter) {
406
+ setTimeout(() => {
407
+ this.searchInput.nativeElement.focus();
408
+ }, 0);
409
+ }
410
+ this.onOpen.emit(true);
411
+ }
412
+ else {
413
+ this.onClose.emit(false);
414
+ }
415
+ evt.preventDefault();
416
+ }
417
+ closeDropdown() {
418
+ if (this.searchInput) {
419
+ this.searchInput.nativeElement.value = "";
420
+ this.data = [];
421
+ this.data = this.cachedItems;
422
+ this.totalHeight = this.itemHeight * this.data.length;
423
+ this.totalRows = this.data.length;
424
+ this.updateView(this.scrollTop);
425
+ }
426
+ this.filter = "";
427
+ this.isActive = false;
428
+ this.onClose.emit(false);
429
+ }
430
+ toggleSelectAll() {
431
+ if (!this.isSelectAll) {
432
+ this.selectedItems = [];
433
+ this.selectedItems = this.data.slice();
434
+ this.isSelectAll = true;
435
+ this.onChangeCallback(this.selectedItems);
436
+ this.onTouchedCallback(this.selectedItems);
437
+ this.onSelectAll.emit(this.selectedItems);
438
+ }
439
+ else {
440
+ this.selectedItems = [];
441
+ this.isSelectAll = false;
442
+ this.onChangeCallback(this.selectedItems);
443
+ this.onTouchedCallback(this.selectedItems);
444
+ this.onDeSelectAll.emit(this.selectedItems);
445
+ }
446
+ }
447
+ transformData(arr, field) {
448
+ const groupedObj = arr.reduce((prev, cur) => {
449
+ if (!prev[cur[field]]) {
450
+ prev[cur[field]] = [cur];
451
+ }
452
+ else {
453
+ prev[cur[field]].push(cur);
454
+ }
455
+ return prev;
456
+ }, {});
457
+ const tempArr = [];
458
+ Object.keys(groupedObj).map(function (x) {
459
+ tempArr.push({ key: x, value: groupedObj[x] });
460
+ });
461
+ return tempArr;
462
+ }
463
+ renderChunk(fromPos, howMany) {
464
+ this.chunkArray = [];
465
+ this.chunkIndex = [];
466
+ var finalItem = fromPos + howMany;
467
+ if (finalItem > this.totalRows)
468
+ finalItem = this.totalRows;
469
+ for (var i = fromPos; i < finalItem; i++) {
470
+ this.chunkIndex.push((i * this.itemHeight) + 'px');
471
+ this.chunkArray.push(this.data[i]);
472
+ }
473
+ }
474
+ onScroll(e) {
475
+ this.scrollTop = e.target.scrollTop;
476
+ this.updateView(this.scrollTop);
477
+ }
478
+ updateView(scrollTop) {
479
+ var scrollPos = scrollTop ? scrollTop : 0;
480
+ var first = (scrollPos / this.itemHeight) - this.screenItemsLen;
481
+ var firstTemp = "" + first;
482
+ first = parseInt(firstTemp) < 0 ? 0 : parseInt(firstTemp);
483
+ this.renderChunk(first, this.cachedItemsLen);
484
+ this.lastRepaintY = scrollPos;
485
+ }
486
+ filterInfiniteList(evt) {
487
+ var filteredElems = [];
488
+ this.data = this.cachedItems.slice();
489
+ if (evt.target.value.toString() != '') {
490
+ this.data.filter(function (el) {
491
+ for (var prop in el) {
492
+ if (el[prop].toString().toLowerCase().indexOf(evt.target.value.toString().toLowerCase()) >= 0) {
493
+ filteredElems.push(el);
494
+ break;
495
+ }
496
+ }
497
+ });
498
+ //this.cachedItems = this.data;
499
+ this.totalHeight = this.itemHeight * filteredElems.length;
500
+ this.totalRows = filteredElems.length;
501
+ this.data = [];
502
+ this.data = filteredElems;
503
+ this.updateView(this.scrollTop);
504
+ }
505
+ else if (evt.target.value.toString() == '' && this.cachedItems.length > 0) {
506
+ this.data = [];
507
+ this.data = this.cachedItems;
508
+ this.totalHeight = this.itemHeight * this.data.length;
509
+ this.totalRows = this.data.length;
510
+ this.updateView(this.scrollTop);
511
+ }
512
+ }
513
+ }
514
+ AngularMultiSelect.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AngularMultiSelect, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
515
+ AngularMultiSelect.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AngularMultiSelect, selector: "angular-multiselect, angular2-multiselect", inputs: { data: "data", settings: "settings" }, outputs: { onSelect: "onSelect", onDeSelect: "onDeSelect", onSelectAll: "onSelectAll", onDeSelectAll: "onDeSelectAll", onOpen: "onOpen", onClose: "onClose" }, host: { properties: { "class": "defaultSettings.classes" } }, providers: [DROPDOWN_CONTROL_VALUE_ACCESSOR, DROPDOWN_CONTROL_VALIDATION], queries: [{ propertyName: "itemTempl", first: true, predicate: Item, descendants: true }, { propertyName: "badgeTempl", first: true, predicate: Badge, descendants: true }], viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"stackline-dropdown\" [ngClass]=\"getDropdownClasses()\" (clickOutside)=\"closeDropdown()\">\n <div class=\"selected-list\">\n <div class=\"c-btn\" (click)=\"toggleDropdown($event)\" [ngClass]=\"{'disabled': settings.disabled}\">\n <span *ngIf=\"selectedItems?.length == 0\">{{settings.text}}</span>\n <span *ngIf=\"settings.singleSelection\">\n <span *ngFor=\"let item of selectedItems;trackBy: trackByFn;\">\n {{item[settings.labelKey]}}\n </span>\n </span>\n <div class=\"c-list\" *ngIf=\"selectedItems?.length > 0 && !settings.singleSelection\">\n <div class=\"c-token\" *ngFor=\"let item of selectedItems;trackBy: trackByFn;let k = index\" [hidden]=\"k > settings.badgeShowLimit-1\">\n <span *ngIf=\"!badgeTempl\" class=\"c-label\">{{item[settings.labelKey]}}</span>\n <span *ngIf=\"badgeTempl\" class=\"c-label\">\n <c-templateRenderer [data]=\"badgeTempl\" [item]=\"item\"></c-templateRenderer>\n </span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item,k,$event)\"></span>\n </div>\n </div> \n <span class=\"countplaceholder\" *ngIf=\"selectedItems?.length > settings.badgeShowLimit\">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\n <span class=\"fa\" [ngClass]=\"{'fa-angle-down': !isActive,'fa-angle-up':isActive}\"></span>\n </div> \n </div>\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\n <div class=\"arrow-up arrow-2\"></div>\n <div class=\"arrow-up\"></div>\n <div class=\"list-area\">\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelectAll\" [disabled]=\"settings.limitSelection == selectedItems?.length\"/>\n <label>\n <span [hidden]=\"isSelectAll\">{{settings.selectAllText}}</span>\n <span [hidden]=\"!isSelectAll\">{{settings.unSelectAllText}}</span>\n </label>\n </div> \n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter && !settings.lazyLoading\">\n <span class=\"fa fa-search\"></span>\n <input #searchInput type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter\">\n </div> \n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter && settings.lazyLoading\">\n <span class=\"fa fa-search\"></span>\n <input #searchInput type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" (keyup)=\"filterInfiniteList($event)\">\n </div>\n <ul *ngIf=\"!settings.groupBy\" [style.maxHeight] = \"settings.maxHeight+'px'\" class=\"lazyContainer\" >\n <span *ngIf=\"itemTempl\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label></label>\n <c-templateRenderer [data]=\"itemTempl\" [item]=\"item\"></c-templateRenderer>\n </li>\n </span>\n <span *ngIf=\"!itemTempl && !settings.lazyLoading\" >\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item[settings.labelKey]}}</label>\n </li>\n </span>\n <span *ngIf=\"!itemTempl && settings.lazyLoading\" >\n <div [ngStyle]=\"{'height':totalHeight+'px'}\" style=\"position: relative;\">\n\n \n <li *ngFor=\"let item of chunkArray | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" style=\"position: absolute;width: 100%;\" class=\"pure-checkbox\" [styleProp]=\"chunkIndex[i]\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item[settings.labelKey]}}</label>\n </li>\n </div>\n </span>\n </ul>\n <div *ngIf=\"settings.groupBy\" [style.maxHeight] = \"settings.maxHeight+'px'\" style=\"overflow: auto;\">\n <ul *ngFor=\"let obj of groupedData ; let i = index;\" class=\"list-grp\">\n <h4 *ngIf=\"(obj.value | listFilter:filter ).length > 0\">{{obj.key}}</h4>\n <span *ngIf=\"itemTempl\" >\n <li *ngFor=\"let item of obj.value | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label></label>\n <c-templateRenderer [data]=\"itemTempl\" [item]=\"item\"></c-templateRenderer>\n </li>\n </span>\n <span *ngIf=\"!itemTempl\" >\n <li *ngFor=\"let item of obj.value | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item[settings.labelKey]}}</label>\n </li>\n </span>\n </ul>\n </div>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">{{settings.noDataLabel}}</h5>\n </div>\n </div>\n</div>\n", isInline: true, styles: [".stackline-dropdown{position:relative}.c-btn{display:inline-block;background:#fff;border:1px solid #ccc;border-radius:3px;font-size:14px;color:#333}.c-btn.disabled{background:#ccc}.c-btn:focus{outline:none}.selected-list .c-list{display:flex;flex:1 1 auto;align-items:center;flex-wrap:wrap;min-width:0;float:none;padding:0;margin:0;width:auto}.selected-list .c-list .c-token{list-style:none;padding:0 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;margin-top:2px;float:left}.selected-list .c-list .c-token .c-label{display:block;float:left}.selected-list .c-list .c-token .fa-remove{margin-left:1px;font-size:12px}.selected-list .fa-angle-down,.selected-list .fa-angle-up{font-size:15pt;position:absolute;right:10px;top:50%;transform:translateY(-50%)}.selected-list .countplaceholder{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;align-self:center;margin:0 0 0 6px;line-height:1}.selected-list .c-btn{box-sizing:border-box;width:100%;box-shadow:0 1px 5px #959595;padding:10px 36px 10px 10px;cursor:pointer;display:flex;align-items:center;flex-wrap:nowrap;position:relative}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0;list-style:none;overflow:auto;margin:0}.dropdown-list ul li{padding:10px;cursor:pointer;text-align:left}.dropdown-list ul li:first-child{padding-top:10px}.dropdown-list ul li:last-child{padding-bottom:10px}.dropdown-list ul li:hover{background:#f5f5f5}.dropdown-list ::-webkit-scrollbar{width:8px}.dropdown-list ::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ::-webkit-scrollbar-track{background:#f2f2f2}.arrow-up{width:0;height:0;border-left:13px solid transparent;border-right:13px solid transparent;border-bottom:15px solid #fff;margin-left:15px;position:absolute;top:0}.arrow-2{border-bottom:15px solid #ccc;top:-1px}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0;box-shadow:0 1px 5px #959595}.select-all{padding:10px;border-bottom:1px solid #ccc;text-align:left}.list-filter{border-bottom:1px solid #ccc;position:relative}.list-filter input{border:0px;width:100%;height:35px;padding:0 0 0 35px}.list-filter input:focus{outline:none}.list-filter .fa{position:absolute;top:10px;left:13px;color:#888}.pure-checkbox input[type=checkbox]{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.pure-checkbox input[type=checkbox]:focus+label:before,.pure-checkbox input[type=checkbox]:hover+label:before{border-color:#0079fe;background-color:#f2f2f2}.pure-checkbox input[type=checkbox]:active+label:before{transition-duration:0s}.pure-checkbox input[type=checkbox]+label{position:relative;padding-left:2em;vertical-align:middle;-webkit-user-select:none;user-select:none;cursor:pointer;margin:0;color:#000;font-weight:300}.pure-checkbox input[type=checkbox]+label:before{box-sizing:content-box;content:\"\";color:#0079fe;position:absolute;top:50%;left:0;width:14px;height:14px;margin-top:-9px;border:2px solid #0079FE;text-align:center;transition:all .4s ease}.pure-checkbox input[type=checkbox]+label:after{box-sizing:content-box;content:\"\";background-color:#0079fe;position:absolute;top:50%;left:4px;width:10px;height:10px;margin-top:-5px;transform:scale(0);transform-origin:50%;transition:transform .2s ease-out}.pure-checkbox input[type=checkbox]:disabled+label:before{border-color:#ccc}.pure-checkbox input[type=checkbox]:disabled:focus+label:before .pure-checkbox input[type=checkbox]:disabled:hover+label:before{background-color:inherit}.pure-checkbox input[type=checkbox]:disabled:checked+label:before{background-color:#ccc}.pure-checkbox input[type=checkbox]+label:after{background-color:transparent;top:50%;left:4px;width:8px;height:3px;margin-top:-4px;border-style:solid;border-color:#fff;border-width:0 0 3px 3px;border-image:none;transform:rotate(-45deg) scale(0)}.pure-checkbox input[type=checkbox]:checked+label:after{content:\"\";transform:rotate(-45deg) scale(1);transition:transform .2s ease-out}.pure-checkbox input[type=radio]:checked+label:before{background-color:#fff}.pure-checkbox input[type=radio]:checked+label:after{transform:scale(1)}.pure-checkbox input[type=radio]+label:before{border-radius:50%}.pure-checkbox input[type=checkbox]:checked+label:before{background:#0079FE}.pure-checkbox input[type=checkbox]:checked+label:after{transform:rotate(-45deg) scale(1)}.list-message{text-align:center}.list-grp{padding:0 15px!important}.list-grp h4{text-transform:capitalize;margin:15px 0 0;font-size:14px;font-weight:700}.list-grp>li{padding-left:15px!important}.stackline-dropdown.theme-material,.stackline-dropdown.theme-dark,.stackline-dropdown.theme-custom{--ms-primary: #3f51b5;--ms-primary-soft: rgba(63, 81, 181, .12);--ms-surface: #ffffff;--ms-surface-soft: #f5f7fb;--ms-surface-muted: #e8eaf6;--ms-outline: #c5cae9;--ms-outline-strong: #7986cb;--ms-on-surface: #212121;--ms-on-surface-muted: #5f6368;--ms-chip-bg: #e8eaf6;--ms-chip-text: #303f9f;--ms-chip-remove: #303f9f;--ms-divider: rgba(125, 119, 134, .16);--ms-section-bg: rgba(247, 242, 250, .76);--ms-selected-text: var(--ms-primary);--ms-shadow: 0 1px 2px rgba(33, 33, 33, .16), 0 12px 32px rgba(63, 81, 181, .12);--ms-shadow-soft: 0 1px 2px rgba(33, 33, 33, .12), 0 4px 12px rgba(33, 33, 33, .08);display:block;width:100%;color:var(--ms-on-surface);font:inherit}.stackline-dropdown.theme-dark{--ms-primary: #8ab4f8;--ms-primary-soft: rgba(138, 180, 248, .18);--ms-surface: #151a23;--ms-surface-soft: #202736;--ms-surface-muted: #111722;--ms-outline: #384456;--ms-outline-strong: #8ab4f8;--ms-on-surface: #edf2f7;--ms-on-surface-muted: #aab6c5;--ms-chip-bg: #263247;--ms-chip-text: #d7e6ff;--ms-chip-remove: #d7e6ff;--ms-divider: rgba(170, 182, 197, .18);--ms-section-bg: #101620;--ms-selected-text: #d7e6ff;--ms-shadow: 0 20px 50px rgba(0, 0, 0, .42);--ms-shadow-soft: 0 1px 2px rgba(0, 0, 0, .45), 0 10px 24px rgba(0, 0, 0, .28)}.stackline-dropdown.theme-custom{--ms-primary: var(--stackline-ms-primary, #0f766e);--ms-primary-soft: var(--stackline-ms-primary-soft, rgba(15, 118, 110, .14));--ms-surface: var(--stackline-ms-surface, #ffffff);--ms-surface-soft: var(--stackline-ms-surface-soft, #ecfdf5);--ms-surface-muted: var(--stackline-ms-surface-muted, #d1fae5);--ms-outline: var(--stackline-ms-outline, #99f6e4);--ms-outline-strong: var(--stackline-ms-outline-strong, #0f766e);--ms-on-surface: var(--stackline-ms-on-surface, #102a2a);--ms-on-surface-muted: var(--stackline-ms-on-surface-muted, #47615f);--ms-chip-bg: var(--stackline-ms-chip-bg, #ccfbf1);--ms-chip-text: var(--stackline-ms-chip-text, #115e59);--ms-chip-remove: var(--stackline-ms-chip-remove, #115e59);--ms-divider: var(--stackline-ms-divider, rgba(15, 118, 110, .16));--ms-section-bg: var(--stackline-ms-section-bg, #f0fdfa);--ms-selected-text: var(--stackline-ms-selected-text, var(--ms-primary));--ms-shadow: var(--stackline-ms-shadow, 0 18px 42px rgba(15, 118, 110, .15));--ms-shadow-soft: var(--stackline-ms-shadow-soft, 0 1px 2px rgba(15, 118, 110, .16), 0 8px 18px rgba(15, 118, 110, .09))}.stackline-dropdown.theme-material .selected-list,.stackline-dropdown.theme-dark .selected-list,.stackline-dropdown.theme-custom .selected-list{width:100%}.stackline-dropdown.theme-material .selected-list .c-btn,.stackline-dropdown.theme-dark .selected-list .c-btn,.stackline-dropdown.theme-custom .selected-list .c-btn{position:relative;display:flex;align-items:center;flex-wrap:nowrap;gap:8px;width:100%;min-height:56px;padding:11px 54px 11px 16px;border-radius:18px;border:1px solid var(--ms-outline);background:var(--ms-surface);box-shadow:var(--ms-shadow-soft);color:var(--ms-on-surface);cursor:pointer;font-size:inherit;line-height:1.45;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease,transform .16s ease}.stackline-dropdown.theme-material .selected-list .c-btn:hover,.stackline-dropdown.theme-dark .selected-list .c-btn:hover,.stackline-dropdown.theme-custom .selected-list .c-btn:hover{border-color:var(--ms-outline-strong)}.stackline-dropdown.theme-material .selected-list .c-btn.disabled,.stackline-dropdown.theme-dark .selected-list .c-btn.disabled,.stackline-dropdown.theme-custom .selected-list .c-btn.disabled{background:var(--ms-surface);cursor:not-allowed;opacity:.72}.stackline-dropdown.theme-material .selected-list .c-list,.stackline-dropdown.theme-dark .selected-list .c-list,.stackline-dropdown.theme-custom .selected-list .c-list{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:8px;width:auto;min-width:0;margin:0;padding:0;float:none}.stackline-dropdown.theme-material .selected-list .c-list .c-token,.stackline-dropdown.theme-dark .selected-list .c-list .c-token,.stackline-dropdown.theme-custom .selected-list .c-list .c-token{position:relative;display:inline-block;vertical-align:middle;min-height:32px;max-width:100%;padding:6px 30px 6px 12px;background:var(--ms-chip-bg);color:var(--ms-chip-text);border-radius:999px;box-shadow:inset 0 0 0 1px #6750a414;line-height:1.35;white-space:normal;overflow-wrap:anywhere;margin:0;float:none}.stackline-dropdown.theme-material .selected-list .c-list .c-token .c-label,.stackline-dropdown.theme-dark .selected-list .c-list .c-token .c-label,.stackline-dropdown.theme-custom .selected-list .c-list .c-token .c-label{display:inline-flex;align-items:center;float:none;min-width:0;max-width:100%;line-height:1.3;font-weight:500;white-space:normal;overflow-wrap:anywhere}.stackline-dropdown.theme-material .selected-list .c-list .c-token .fa-remove,.stackline-dropdown.theme-dark .selected-list .c-list .c-token .fa-remove,.stackline-dropdown.theme-custom .selected-list .c-list .c-token .fa-remove{position:absolute;right:10px;top:50%;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:0;transform:translateY(-50%);color:var(--ms-chip-remove);cursor:pointer}.stackline-dropdown.theme-material .selected-list .countplaceholder,.stackline-dropdown.theme-dark .selected-list .countplaceholder,.stackline-dropdown.theme-custom .selected-list .countplaceholder{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;align-self:center;margin:0;line-height:1;color:var(--ms-on-surface-muted);font-size:.8rem;font-weight:600}.stackline-dropdown.theme-material .selected-list .fa-angle-down,.stackline-dropdown.theme-dark .selected-list .fa-angle-down,.stackline-dropdown.theme-custom .selected-list .fa-angle-down,.stackline-dropdown.theme-material .selected-list .fa-angle-up,.stackline-dropdown.theme-dark .selected-list .fa-angle-up,.stackline-dropdown.theme-custom .selected-list .fa-angle-up{position:absolute;top:50%;right:16px;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;transform:translateY(-50%);color:var(--ms-on-surface-muted);font-size:15pt;pointer-events:none}.stackline-dropdown.theme-material .dropdown-list,.stackline-dropdown.theme-dark .dropdown-list,.stackline-dropdown.theme-custom .dropdown-list{position:absolute;width:100%;padding-top:8px;z-index:99999}.stackline-dropdown.theme-material .arrow-up,.stackline-dropdown.theme-dark .arrow-up,.stackline-dropdown.theme-custom .arrow-up,.stackline-dropdown.theme-material .arrow-down,.stackline-dropdown.theme-dark .arrow-down,.stackline-dropdown.theme-custom .arrow-down,.stackline-dropdown.theme-material .arrow-2,.stackline-dropdown.theme-dark .arrow-2,.stackline-dropdown.theme-custom .arrow-2{display:none}.stackline-dropdown.theme-material .list-area,.stackline-dropdown.theme-dark .list-area,.stackline-dropdown.theme-custom .list-area{overflow:hidden;border-radius:22px;background:var(--ms-surface);border:1px solid var(--ms-outline);box-shadow:var(--ms-shadow);margin:0}.stackline-dropdown.theme-material .select-all,.stackline-dropdown.theme-dark .select-all,.stackline-dropdown.theme-custom .select-all{padding:10px 14px;border-bottom:1px solid var(--ms-divider);background:var(--ms-section-bg);text-align:left}.stackline-dropdown.theme-material .list-filter,.stackline-dropdown.theme-dark .list-filter,.stackline-dropdown.theme-custom .list-filter{position:relative;display:flex;align-items:center;min-height:52px;padding-left:48px;padding-right:44px;border-bottom:1px solid var(--ms-divider);background:var(--ms-surface)}.stackline-dropdown.theme-material .list-filter input,.stackline-dropdown.theme-dark .list-filter input,.stackline-dropdown.theme-custom .list-filter input{width:100%;height:100%;border:0;background:transparent;color:var(--ms-on-surface);font:inherit;padding:0}.stackline-dropdown.theme-material .list-filter input::placeholder,.stackline-dropdown.theme-dark .list-filter input::placeholder,.stackline-dropdown.theme-custom .list-filter input::placeholder{color:var(--ms-on-surface-muted)}.stackline-dropdown.theme-material .list-filter input:focus,.stackline-dropdown.theme-dark .list-filter input:focus,.stackline-dropdown.theme-custom .list-filter input:focus{outline:none}.stackline-dropdown.theme-material .list-filter .fa,.stackline-dropdown.theme-dark .list-filter .fa,.stackline-dropdown.theme-custom .list-filter .fa{position:absolute;top:50%;left:16px;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;transform:translateY(-50%);color:var(--ms-on-surface-muted)}.stackline-dropdown.theme-material .dropdown-list ul,.stackline-dropdown.theme-dark .dropdown-list ul,.stackline-dropdown.theme-custom .dropdown-list ul{list-style:none;margin:0;padding:8px;overflow:auto}.stackline-dropdown.theme-material .dropdown-list ul li,.stackline-dropdown.theme-dark .dropdown-list ul li,.stackline-dropdown.theme-custom .dropdown-list ul li{align-items:center;min-height:0;margin:4px;padding:12px 14px;border-radius:14px;cursor:pointer;text-align:left;line-height:1.35;transition:background-color .16s ease,color .16s ease}.stackline-dropdown.theme-material .dropdown-list ul li:first-child,.stackline-dropdown.theme-dark .dropdown-list ul li:first-child,.stackline-dropdown.theme-custom .dropdown-list ul li:first-child{padding-top:12px}.stackline-dropdown.theme-material .dropdown-list ul li:last-child,.stackline-dropdown.theme-dark .dropdown-list ul li:last-child,.stackline-dropdown.theme-custom .dropdown-list ul li:last-child{padding-bottom:12px}.stackline-dropdown.theme-material .dropdown-list ul li:hover,.stackline-dropdown.theme-dark .dropdown-list ul li:hover,.stackline-dropdown.theme-custom .dropdown-list ul li:hover{background:var(--ms-surface-soft)}.stackline-dropdown.theme-material .pure-checkbox,.stackline-dropdown.theme-dark .pure-checkbox,.stackline-dropdown.theme-custom .pure-checkbox{position:relative}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]+label,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]+label,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]+label{position:relative;display:block;width:100%;margin:0;padding-left:32px;color:inherit;cursor:pointer;font-weight:500;-webkit-user-select:none;user-select:none}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]+label:before{box-sizing:content-box;content:\"\";position:absolute;top:50%;left:0;width:16px;height:16px;margin-top:-10px;border:2px solid var(--ms-outline-strong);border-radius:5px;background:var(--ms-surface);transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]+label:after,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]+label:after,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]+label:after{box-sizing:content-box;content:\"\";position:absolute;top:50%;left:5px;width:8px;height:3px;margin-top:-4px;border-style:solid;border-color:#fff;border-width:0 0 3px 3px;border-image:none;background:transparent;transform:rotate(-45deg) scale(0);transform-origin:50%;transition:transform .16s ease}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:focus+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:focus+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:focus+label:before,.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:hover+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:hover+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:hover+label:before{border-color:var(--ms-primary);background:var(--ms-surface-soft)}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:checked+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:checked+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:checked+label:before{border-color:var(--ms-primary);background:var(--ms-primary)}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:checked+label:after,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:checked+label:after,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:checked+label:after{transform:rotate(-45deg) scale(1)}.stackline-dropdown.theme-material .list-message,.stackline-dropdown.theme-dark .list-message,.stackline-dropdown.theme-custom .list-message{margin:0;padding:20px 14px;color:var(--ms-on-surface-muted);text-align:center}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgStyle; }), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.DefaultValueAccessor; }), selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgControlStatus; }), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgModel; }), selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i0.forwardRef(function () { return ClickOutsideDirective; }), selector: "[clickOutside]", outputs: ["clickOutside"] }, { kind: "directive", type: i0.forwardRef(function () { return styleDirective; }), selector: "[styleProp]", inputs: ["styleProp"] }, { kind: "component", type: i0.forwardRef(function () { return TemplateRenderer; }), selector: "c-templateRenderer", inputs: ["data", "item"] }, { kind: "pipe", type: i0.forwardRef(function () { return ListFilterPipe; }), name: "listFilter" }] });
516
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AngularMultiSelect, decorators: [{
517
+ type: Component,
518
+ args: [{ selector: 'angular-multiselect, angular2-multiselect', template: "<div class=\"stackline-dropdown\" [ngClass]=\"getDropdownClasses()\" (clickOutside)=\"closeDropdown()\">\n <div class=\"selected-list\">\n <div class=\"c-btn\" (click)=\"toggleDropdown($event)\" [ngClass]=\"{'disabled': settings.disabled}\">\n <span *ngIf=\"selectedItems?.length == 0\">{{settings.text}}</span>\n <span *ngIf=\"settings.singleSelection\">\n <span *ngFor=\"let item of selectedItems;trackBy: trackByFn;\">\n {{item[settings.labelKey]}}\n </span>\n </span>\n <div class=\"c-list\" *ngIf=\"selectedItems?.length > 0 && !settings.singleSelection\">\n <div class=\"c-token\" *ngFor=\"let item of selectedItems;trackBy: trackByFn;let k = index\" [hidden]=\"k > settings.badgeShowLimit-1\">\n <span *ngIf=\"!badgeTempl\" class=\"c-label\">{{item[settings.labelKey]}}</span>\n <span *ngIf=\"badgeTempl\" class=\"c-label\">\n <c-templateRenderer [data]=\"badgeTempl\" [item]=\"item\"></c-templateRenderer>\n </span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item,k,$event)\"></span>\n </div>\n </div> \n <span class=\"countplaceholder\" *ngIf=\"selectedItems?.length > settings.badgeShowLimit\">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\n <span class=\"fa\" [ngClass]=\"{'fa-angle-down': !isActive,'fa-angle-up':isActive}\"></span>\n </div> \n </div>\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\n <div class=\"arrow-up arrow-2\"></div>\n <div class=\"arrow-up\"></div>\n <div class=\"list-area\">\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelectAll\" [disabled]=\"settings.limitSelection == selectedItems?.length\"/>\n <label>\n <span [hidden]=\"isSelectAll\">{{settings.selectAllText}}</span>\n <span [hidden]=\"!isSelectAll\">{{settings.unSelectAllText}}</span>\n </label>\n </div> \n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter && !settings.lazyLoading\">\n <span class=\"fa fa-search\"></span>\n <input #searchInput type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter\">\n </div> \n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter && settings.lazyLoading\">\n <span class=\"fa fa-search\"></span>\n <input #searchInput type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" (keyup)=\"filterInfiniteList($event)\">\n </div>\n <ul *ngIf=\"!settings.groupBy\" [style.maxHeight] = \"settings.maxHeight+'px'\" class=\"lazyContainer\" >\n <span *ngIf=\"itemTempl\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label></label>\n <c-templateRenderer [data]=\"itemTempl\" [item]=\"item\"></c-templateRenderer>\n </li>\n </span>\n <span *ngIf=\"!itemTempl && !settings.lazyLoading\" >\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item[settings.labelKey]}}</label>\n </li>\n </span>\n <span *ngIf=\"!itemTempl && settings.lazyLoading\" >\n <div [ngStyle]=\"{'height':totalHeight+'px'}\" style=\"position: relative;\">\n\n \n <li *ngFor=\"let item of chunkArray | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" style=\"position: absolute;width: 100%;\" class=\"pure-checkbox\" [styleProp]=\"chunkIndex[i]\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item[settings.labelKey]}}</label>\n </li>\n </div>\n </span>\n </ul>\n <div *ngIf=\"settings.groupBy\" [style.maxHeight] = \"settings.maxHeight+'px'\" style=\"overflow: auto;\">\n <ul *ngFor=\"let obj of groupedData ; let i = index;\" class=\"list-grp\">\n <h4 *ngIf=\"(obj.value | listFilter:filter ).length > 0\">{{obj.key}}</h4>\n <span *ngIf=\"itemTempl\" >\n <li *ngFor=\"let item of obj.value | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label></label>\n <c-templateRenderer [data]=\"itemTempl\" [item]=\"item\"></c-templateRenderer>\n </li>\n </span>\n <span *ngIf=\"!itemTempl\" >\n <li *ngFor=\"let item of obj.value | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input *ngIf=\"settings.showCheckbox\" type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item[settings.labelKey]}}</label>\n </li>\n </span>\n </ul>\n </div>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">{{settings.noDataLabel}}</h5>\n </div>\n </div>\n</div>\n", host: { '[class]': 'defaultSettings.classes' }, providers: [DROPDOWN_CONTROL_VALUE_ACCESSOR, DROPDOWN_CONTROL_VALIDATION], styles: [".stackline-dropdown{position:relative}.c-btn{display:inline-block;background:#fff;border:1px solid #ccc;border-radius:3px;font-size:14px;color:#333}.c-btn.disabled{background:#ccc}.c-btn:focus{outline:none}.selected-list .c-list{display:flex;flex:1 1 auto;align-items:center;flex-wrap:wrap;min-width:0;float:none;padding:0;margin:0;width:auto}.selected-list .c-list .c-token{list-style:none;padding:0 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;margin-top:2px;float:left}.selected-list .c-list .c-token .c-label{display:block;float:left}.selected-list .c-list .c-token .fa-remove{margin-left:1px;font-size:12px}.selected-list .fa-angle-down,.selected-list .fa-angle-up{font-size:15pt;position:absolute;right:10px;top:50%;transform:translateY(-50%)}.selected-list .countplaceholder{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;align-self:center;margin:0 0 0 6px;line-height:1}.selected-list .c-btn{box-sizing:border-box;width:100%;box-shadow:0 1px 5px #959595;padding:10px 36px 10px 10px;cursor:pointer;display:flex;align-items:center;flex-wrap:nowrap;position:relative}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0;list-style:none;overflow:auto;margin:0}.dropdown-list ul li{padding:10px;cursor:pointer;text-align:left}.dropdown-list ul li:first-child{padding-top:10px}.dropdown-list ul li:last-child{padding-bottom:10px}.dropdown-list ul li:hover{background:#f5f5f5}.dropdown-list ::-webkit-scrollbar{width:8px}.dropdown-list ::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ::-webkit-scrollbar-track{background:#f2f2f2}.arrow-up{width:0;height:0;border-left:13px solid transparent;border-right:13px solid transparent;border-bottom:15px solid #fff;margin-left:15px;position:absolute;top:0}.arrow-2{border-bottom:15px solid #ccc;top:-1px}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0;box-shadow:0 1px 5px #959595}.select-all{padding:10px;border-bottom:1px solid #ccc;text-align:left}.list-filter{border-bottom:1px solid #ccc;position:relative}.list-filter input{border:0px;width:100%;height:35px;padding:0 0 0 35px}.list-filter input:focus{outline:none}.list-filter .fa{position:absolute;top:10px;left:13px;color:#888}.pure-checkbox input[type=checkbox]{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.pure-checkbox input[type=checkbox]:focus+label:before,.pure-checkbox input[type=checkbox]:hover+label:before{border-color:#0079fe;background-color:#f2f2f2}.pure-checkbox input[type=checkbox]:active+label:before{transition-duration:0s}.pure-checkbox input[type=checkbox]+label{position:relative;padding-left:2em;vertical-align:middle;-webkit-user-select:none;user-select:none;cursor:pointer;margin:0;color:#000;font-weight:300}.pure-checkbox input[type=checkbox]+label:before{box-sizing:content-box;content:\"\";color:#0079fe;position:absolute;top:50%;left:0;width:14px;height:14px;margin-top:-9px;border:2px solid #0079FE;text-align:center;transition:all .4s ease}.pure-checkbox input[type=checkbox]+label:after{box-sizing:content-box;content:\"\";background-color:#0079fe;position:absolute;top:50%;left:4px;width:10px;height:10px;margin-top:-5px;transform:scale(0);transform-origin:50%;transition:transform .2s ease-out}.pure-checkbox input[type=checkbox]:disabled+label:before{border-color:#ccc}.pure-checkbox input[type=checkbox]:disabled:focus+label:before .pure-checkbox input[type=checkbox]:disabled:hover+label:before{background-color:inherit}.pure-checkbox input[type=checkbox]:disabled:checked+label:before{background-color:#ccc}.pure-checkbox input[type=checkbox]+label:after{background-color:transparent;top:50%;left:4px;width:8px;height:3px;margin-top:-4px;border-style:solid;border-color:#fff;border-width:0 0 3px 3px;border-image:none;transform:rotate(-45deg) scale(0)}.pure-checkbox input[type=checkbox]:checked+label:after{content:\"\";transform:rotate(-45deg) scale(1);transition:transform .2s ease-out}.pure-checkbox input[type=radio]:checked+label:before{background-color:#fff}.pure-checkbox input[type=radio]:checked+label:after{transform:scale(1)}.pure-checkbox input[type=radio]+label:before{border-radius:50%}.pure-checkbox input[type=checkbox]:checked+label:before{background:#0079FE}.pure-checkbox input[type=checkbox]:checked+label:after{transform:rotate(-45deg) scale(1)}.list-message{text-align:center}.list-grp{padding:0 15px!important}.list-grp h4{text-transform:capitalize;margin:15px 0 0;font-size:14px;font-weight:700}.list-grp>li{padding-left:15px!important}.stackline-dropdown.theme-material,.stackline-dropdown.theme-dark,.stackline-dropdown.theme-custom{--ms-primary: #3f51b5;--ms-primary-soft: rgba(63, 81, 181, .12);--ms-surface: #ffffff;--ms-surface-soft: #f5f7fb;--ms-surface-muted: #e8eaf6;--ms-outline: #c5cae9;--ms-outline-strong: #7986cb;--ms-on-surface: #212121;--ms-on-surface-muted: #5f6368;--ms-chip-bg: #e8eaf6;--ms-chip-text: #303f9f;--ms-chip-remove: #303f9f;--ms-divider: rgba(125, 119, 134, .16);--ms-section-bg: rgba(247, 242, 250, .76);--ms-selected-text: var(--ms-primary);--ms-shadow: 0 1px 2px rgba(33, 33, 33, .16), 0 12px 32px rgba(63, 81, 181, .12);--ms-shadow-soft: 0 1px 2px rgba(33, 33, 33, .12), 0 4px 12px rgba(33, 33, 33, .08);display:block;width:100%;color:var(--ms-on-surface);font:inherit}.stackline-dropdown.theme-dark{--ms-primary: #8ab4f8;--ms-primary-soft: rgba(138, 180, 248, .18);--ms-surface: #151a23;--ms-surface-soft: #202736;--ms-surface-muted: #111722;--ms-outline: #384456;--ms-outline-strong: #8ab4f8;--ms-on-surface: #edf2f7;--ms-on-surface-muted: #aab6c5;--ms-chip-bg: #263247;--ms-chip-text: #d7e6ff;--ms-chip-remove: #d7e6ff;--ms-divider: rgba(170, 182, 197, .18);--ms-section-bg: #101620;--ms-selected-text: #d7e6ff;--ms-shadow: 0 20px 50px rgba(0, 0, 0, .42);--ms-shadow-soft: 0 1px 2px rgba(0, 0, 0, .45), 0 10px 24px rgba(0, 0, 0, .28)}.stackline-dropdown.theme-custom{--ms-primary: var(--stackline-ms-primary, #0f766e);--ms-primary-soft: var(--stackline-ms-primary-soft, rgba(15, 118, 110, .14));--ms-surface: var(--stackline-ms-surface, #ffffff);--ms-surface-soft: var(--stackline-ms-surface-soft, #ecfdf5);--ms-surface-muted: var(--stackline-ms-surface-muted, #d1fae5);--ms-outline: var(--stackline-ms-outline, #99f6e4);--ms-outline-strong: var(--stackline-ms-outline-strong, #0f766e);--ms-on-surface: var(--stackline-ms-on-surface, #102a2a);--ms-on-surface-muted: var(--stackline-ms-on-surface-muted, #47615f);--ms-chip-bg: var(--stackline-ms-chip-bg, #ccfbf1);--ms-chip-text: var(--stackline-ms-chip-text, #115e59);--ms-chip-remove: var(--stackline-ms-chip-remove, #115e59);--ms-divider: var(--stackline-ms-divider, rgba(15, 118, 110, .16));--ms-section-bg: var(--stackline-ms-section-bg, #f0fdfa);--ms-selected-text: var(--stackline-ms-selected-text, var(--ms-primary));--ms-shadow: var(--stackline-ms-shadow, 0 18px 42px rgba(15, 118, 110, .15));--ms-shadow-soft: var(--stackline-ms-shadow-soft, 0 1px 2px rgba(15, 118, 110, .16), 0 8px 18px rgba(15, 118, 110, .09))}.stackline-dropdown.theme-material .selected-list,.stackline-dropdown.theme-dark .selected-list,.stackline-dropdown.theme-custom .selected-list{width:100%}.stackline-dropdown.theme-material .selected-list .c-btn,.stackline-dropdown.theme-dark .selected-list .c-btn,.stackline-dropdown.theme-custom .selected-list .c-btn{position:relative;display:flex;align-items:center;flex-wrap:nowrap;gap:8px;width:100%;min-height:56px;padding:11px 54px 11px 16px;border-radius:18px;border:1px solid var(--ms-outline);background:var(--ms-surface);box-shadow:var(--ms-shadow-soft);color:var(--ms-on-surface);cursor:pointer;font-size:inherit;line-height:1.45;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease,transform .16s ease}.stackline-dropdown.theme-material .selected-list .c-btn:hover,.stackline-dropdown.theme-dark .selected-list .c-btn:hover,.stackline-dropdown.theme-custom .selected-list .c-btn:hover{border-color:var(--ms-outline-strong)}.stackline-dropdown.theme-material .selected-list .c-btn.disabled,.stackline-dropdown.theme-dark .selected-list .c-btn.disabled,.stackline-dropdown.theme-custom .selected-list .c-btn.disabled{background:var(--ms-surface);cursor:not-allowed;opacity:.72}.stackline-dropdown.theme-material .selected-list .c-list,.stackline-dropdown.theme-dark .selected-list .c-list,.stackline-dropdown.theme-custom .selected-list .c-list{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:8px;width:auto;min-width:0;margin:0;padding:0;float:none}.stackline-dropdown.theme-material .selected-list .c-list .c-token,.stackline-dropdown.theme-dark .selected-list .c-list .c-token,.stackline-dropdown.theme-custom .selected-list .c-list .c-token{position:relative;display:inline-block;vertical-align:middle;min-height:32px;max-width:100%;padding:6px 30px 6px 12px;background:var(--ms-chip-bg);color:var(--ms-chip-text);border-radius:999px;box-shadow:inset 0 0 0 1px #6750a414;line-height:1.35;white-space:normal;overflow-wrap:anywhere;margin:0;float:none}.stackline-dropdown.theme-material .selected-list .c-list .c-token .c-label,.stackline-dropdown.theme-dark .selected-list .c-list .c-token .c-label,.stackline-dropdown.theme-custom .selected-list .c-list .c-token .c-label{display:inline-flex;align-items:center;float:none;min-width:0;max-width:100%;line-height:1.3;font-weight:500;white-space:normal;overflow-wrap:anywhere}.stackline-dropdown.theme-material .selected-list .c-list .c-token .fa-remove,.stackline-dropdown.theme-dark .selected-list .c-list .c-token .fa-remove,.stackline-dropdown.theme-custom .selected-list .c-list .c-token .fa-remove{position:absolute;right:10px;top:50%;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:0;transform:translateY(-50%);color:var(--ms-chip-remove);cursor:pointer}.stackline-dropdown.theme-material .selected-list .countplaceholder,.stackline-dropdown.theme-dark .selected-list .countplaceholder,.stackline-dropdown.theme-custom .selected-list .countplaceholder{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;align-self:center;margin:0;line-height:1;color:var(--ms-on-surface-muted);font-size:.8rem;font-weight:600}.stackline-dropdown.theme-material .selected-list .fa-angle-down,.stackline-dropdown.theme-dark .selected-list .fa-angle-down,.stackline-dropdown.theme-custom .selected-list .fa-angle-down,.stackline-dropdown.theme-material .selected-list .fa-angle-up,.stackline-dropdown.theme-dark .selected-list .fa-angle-up,.stackline-dropdown.theme-custom .selected-list .fa-angle-up{position:absolute;top:50%;right:16px;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;transform:translateY(-50%);color:var(--ms-on-surface-muted);font-size:15pt;pointer-events:none}.stackline-dropdown.theme-material .dropdown-list,.stackline-dropdown.theme-dark .dropdown-list,.stackline-dropdown.theme-custom .dropdown-list{position:absolute;width:100%;padding-top:8px;z-index:99999}.stackline-dropdown.theme-material .arrow-up,.stackline-dropdown.theme-dark .arrow-up,.stackline-dropdown.theme-custom .arrow-up,.stackline-dropdown.theme-material .arrow-down,.stackline-dropdown.theme-dark .arrow-down,.stackline-dropdown.theme-custom .arrow-down,.stackline-dropdown.theme-material .arrow-2,.stackline-dropdown.theme-dark .arrow-2,.stackline-dropdown.theme-custom .arrow-2{display:none}.stackline-dropdown.theme-material .list-area,.stackline-dropdown.theme-dark .list-area,.stackline-dropdown.theme-custom .list-area{overflow:hidden;border-radius:22px;background:var(--ms-surface);border:1px solid var(--ms-outline);box-shadow:var(--ms-shadow);margin:0}.stackline-dropdown.theme-material .select-all,.stackline-dropdown.theme-dark .select-all,.stackline-dropdown.theme-custom .select-all{padding:10px 14px;border-bottom:1px solid var(--ms-divider);background:var(--ms-section-bg);text-align:left}.stackline-dropdown.theme-material .list-filter,.stackline-dropdown.theme-dark .list-filter,.stackline-dropdown.theme-custom .list-filter{position:relative;display:flex;align-items:center;min-height:52px;padding-left:48px;padding-right:44px;border-bottom:1px solid var(--ms-divider);background:var(--ms-surface)}.stackline-dropdown.theme-material .list-filter input,.stackline-dropdown.theme-dark .list-filter input,.stackline-dropdown.theme-custom .list-filter input{width:100%;height:100%;border:0;background:transparent;color:var(--ms-on-surface);font:inherit;padding:0}.stackline-dropdown.theme-material .list-filter input::placeholder,.stackline-dropdown.theme-dark .list-filter input::placeholder,.stackline-dropdown.theme-custom .list-filter input::placeholder{color:var(--ms-on-surface-muted)}.stackline-dropdown.theme-material .list-filter input:focus,.stackline-dropdown.theme-dark .list-filter input:focus,.stackline-dropdown.theme-custom .list-filter input:focus{outline:none}.stackline-dropdown.theme-material .list-filter .fa,.stackline-dropdown.theme-dark .list-filter .fa,.stackline-dropdown.theme-custom .list-filter .fa{position:absolute;top:50%;left:16px;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;transform:translateY(-50%);color:var(--ms-on-surface-muted)}.stackline-dropdown.theme-material .dropdown-list ul,.stackline-dropdown.theme-dark .dropdown-list ul,.stackline-dropdown.theme-custom .dropdown-list ul{list-style:none;margin:0;padding:8px;overflow:auto}.stackline-dropdown.theme-material .dropdown-list ul li,.stackline-dropdown.theme-dark .dropdown-list ul li,.stackline-dropdown.theme-custom .dropdown-list ul li{align-items:center;min-height:0;margin:4px;padding:12px 14px;border-radius:14px;cursor:pointer;text-align:left;line-height:1.35;transition:background-color .16s ease,color .16s ease}.stackline-dropdown.theme-material .dropdown-list ul li:first-child,.stackline-dropdown.theme-dark .dropdown-list ul li:first-child,.stackline-dropdown.theme-custom .dropdown-list ul li:first-child{padding-top:12px}.stackline-dropdown.theme-material .dropdown-list ul li:last-child,.stackline-dropdown.theme-dark .dropdown-list ul li:last-child,.stackline-dropdown.theme-custom .dropdown-list ul li:last-child{padding-bottom:12px}.stackline-dropdown.theme-material .dropdown-list ul li:hover,.stackline-dropdown.theme-dark .dropdown-list ul li:hover,.stackline-dropdown.theme-custom .dropdown-list ul li:hover{background:var(--ms-surface-soft)}.stackline-dropdown.theme-material .pure-checkbox,.stackline-dropdown.theme-dark .pure-checkbox,.stackline-dropdown.theme-custom .pure-checkbox{position:relative}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]+label,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]+label,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]+label{position:relative;display:block;width:100%;margin:0;padding-left:32px;color:inherit;cursor:pointer;font-weight:500;-webkit-user-select:none;user-select:none}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]+label:before{box-sizing:content-box;content:\"\";position:absolute;top:50%;left:0;width:16px;height:16px;margin-top:-10px;border:2px solid var(--ms-outline-strong);border-radius:5px;background:var(--ms-surface);transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]+label:after,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]+label:after,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]+label:after{box-sizing:content-box;content:\"\";position:absolute;top:50%;left:5px;width:8px;height:3px;margin-top:-4px;border-style:solid;border-color:#fff;border-width:0 0 3px 3px;border-image:none;background:transparent;transform:rotate(-45deg) scale(0);transform-origin:50%;transition:transform .16s ease}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:focus+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:focus+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:focus+label:before,.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:hover+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:hover+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:hover+label:before{border-color:var(--ms-primary);background:var(--ms-surface-soft)}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:checked+label:before,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:checked+label:before,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:checked+label:before{border-color:var(--ms-primary);background:var(--ms-primary)}.stackline-dropdown.theme-material .pure-checkbox input[type=checkbox]:checked+label:after,.stackline-dropdown.theme-dark .pure-checkbox input[type=checkbox]:checked+label:after,.stackline-dropdown.theme-custom .pure-checkbox input[type=checkbox]:checked+label:after{transform:rotate(-45deg) scale(1)}.stackline-dropdown.theme-material .list-message,.stackline-dropdown.theme-dark .list-message,.stackline-dropdown.theme-custom .list-message{margin:0;padding:20px 14px;color:var(--ms-on-surface-muted);text-align:center}\n"] }]
519
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { data: [{
520
+ type: Input
521
+ }], settings: [{
522
+ type: Input
523
+ }], onSelect: [{
524
+ type: Output,
525
+ args: ['onSelect']
526
+ }], onDeSelect: [{
527
+ type: Output,
528
+ args: ['onDeSelect']
529
+ }], onSelectAll: [{
530
+ type: Output,
531
+ args: ['onSelectAll']
532
+ }], onDeSelectAll: [{
533
+ type: Output,
534
+ args: ['onDeSelectAll']
535
+ }], onOpen: [{
536
+ type: Output,
537
+ args: ['onOpen']
538
+ }], onClose: [{
539
+ type: Output,
540
+ args: ['onClose']
541
+ }], itemTempl: [{
542
+ type: ContentChild,
543
+ args: [Item, { static: false }]
544
+ }], badgeTempl: [{
545
+ type: ContentChild,
546
+ args: [Badge, { static: false }]
547
+ }], searchInput: [{
548
+ type: ViewChild,
549
+ args: ['searchInput', { static: false }]
550
+ }] } });
551
+ class AngularMultiSelectModule {
552
+ }
553
+ AngularMultiSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AngularMultiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
554
+ AngularMultiSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: AngularMultiSelectModule, declarations: [AngularMultiSelect, ClickOutsideDirective, ScrollDirective, styleDirective, ListFilterPipe, Item, TemplateRenderer, Badge], imports: [CommonModule, FormsModule], exports: [AngularMultiSelect, ClickOutsideDirective, ScrollDirective, styleDirective, ListFilterPipe, Item, TemplateRenderer, Badge] });
555
+ AngularMultiSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AngularMultiSelectModule, imports: [CommonModule, FormsModule] });
556
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AngularMultiSelectModule, decorators: [{
557
+ type: NgModule,
558
+ args: [{
559
+ imports: [CommonModule, FormsModule],
560
+ declarations: [AngularMultiSelect, ClickOutsideDirective, ScrollDirective, styleDirective, ListFilterPipe, Item, TemplateRenderer, Badge],
561
+ exports: [AngularMultiSelect, ClickOutsideDirective, ScrollDirective, styleDirective, ListFilterPipe, Item, TemplateRenderer, Badge]
562
+ }]
563
+ }] });
564
+
565
+ /**
566
+ * Generated bundle index. Do not edit.
567
+ */
568
+
569
+ export { AngularMultiSelect, AngularMultiSelectModule, Badge, ClickOutsideDirective, Item, ListFilterPipe, ListItem, MyException, ScrollDirective, TemplateRenderer, styleDirective };
570
+ //# sourceMappingURL=stackline-angular-multiselect-dropdown.mjs.map