@stackline/angular-multiselect-dropdown 2.0.4 → 2.0.5

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 +0,0 @@
1
- {"version":3,"sourceRoot":"","sources":["src/app/angular2-multiselect-dropdown/multiselect.component.scss"],"names":[],"mappings":"AAGA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACQ;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA,YAjCC;EAkCD;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;AACA;AAAA;AAAA;AAAA;;AAKJ;EACI;EACA;;AAIZ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGR;EACI;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAGR;EACI;;AAEJ;EACI;EACA;;AAEJ;EACI;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;AACA;EACI;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;EACA;EACA;EACA;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;AAAA;EAGE,cA/KW;EAgLX;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA,OAlMW;EAmMX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA,kBAhNW;EAiNX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EAEE;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE,YAjQW;;;AAmQb;EACE;;;AAEF;EACI;;;AAEJ;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;AAAA;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;AAAA;AAAA;EAGI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;AAAA;EAEI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA","file":"multiselect.component.css"}
@@ -1,6 +0,0 @@
1
- export { AngularMultiSelect } from './multiselect.component';
2
- export { ClickOutsideDirective } from './clickOutside';
3
- export { ListFilterPipe } from './list-filter';
4
- export { Item } from './menu-item';
5
- export { TemplateRenderer } from './menu-item';
6
- export { AngularMultiSelectModule } from './multiselect.component';
@@ -1,60 +0,0 @@
1
- import {Directive, ElementRef, Output, EventEmitter, HostListener, Input} from '@angular/core';
2
-
3
- @Directive({
4
- selector: '[clickOutside]'
5
- })
6
- export class ClickOutsideDirective {
7
- constructor(private _elementRef: ElementRef) {
8
- }
9
-
10
- @Output()
11
- public clickOutside = new EventEmitter<MouseEvent>();
12
-
13
- @HostListener('document:click', ['$event', '$event.target'])
14
- @HostListener('document:touchstart', ['$event', '$event.target'])
15
- public onClick(event: MouseEvent, targetElement: HTMLElement): void {
16
- if (!targetElement) {
17
- return;
18
- }
19
-
20
- const clickedInside = this._elementRef.nativeElement.contains(targetElement);
21
- if (!clickedInside) {
22
- this.clickOutside.emit(event);
23
- }
24
- }
25
- }
26
-
27
- @Directive({
28
- selector: '[scroll]'
29
- })
30
- export class ScrollDirective {
31
- constructor(private _elementRef: ElementRef) {
32
- }
33
-
34
- @Output()
35
- public scroll = new EventEmitter<MouseEvent>();
36
-
37
- @HostListener('scroll', ['$event'])
38
- public onClick(event: MouseEvent, targetElement: HTMLElement): void {
39
- this.scroll.emit(event);
40
- }
41
- }
42
- @Directive({
43
- selector: '[styleProp]'
44
- })
45
- export class styleDirective {
46
-
47
- constructor(private el: ElementRef) {
48
-
49
- }
50
-
51
- @Input('styleProp') styleVal: number;
52
-
53
- ngOnInit() {
54
-
55
- this.el.nativeElement.style.top = this.styleVal;
56
- }
57
- ngOnChanges(): void {
58
- this.el.nativeElement.style.top = this.styleVal;
59
- }
60
- }
@@ -1,6 +0,0 @@
1
- export { AngularMultiSelect } from './multiselect.component';
2
- export { ClickOutsideDirective } from './clickOutside';
3
- export { ListFilterPipe } from './list-filter';
4
- export { Item } from './menu-item';
5
- export { TemplateRenderer } from './menu-item';
6
- export { AngularMultiSelectModule } from './multiselect.component';
@@ -1,29 +0,0 @@
1
- import { Pipe, PipeTransform } from '@angular/core';
2
-
3
- import { ListItem } from './multiselect.model';
4
-
5
- @Pipe({
6
- name: 'listFilter',
7
- pure: false
8
- })
9
- export class ListFilterPipe implements PipeTransform {
10
- transform(items: ListItem[], filter: any): ListItem[] {
11
- if (!items || !filter) {
12
- return items;
13
- }
14
- return items.filter((item: any) => this.applyFilter(item, filter));
15
- }
16
- applyFilter(item: any, filter: any): boolean {
17
- let found = false;
18
- for (var prop in item) {
19
- if (filter) {
20
- if (item[prop].toString().toLowerCase().indexOf(filter.toLowerCase()) >= 0) {
21
- found = true;
22
- }
23
- }
24
- else
25
- found = true;
26
- }
27
- return found;
28
- }
29
- }
@@ -1,55 +0,0 @@
1
- import { Component, OnInit, OnDestroy, NgModule, TemplateRef, AfterContentInit, ContentChild, EmbeddedViewRef, OnChanges, ViewContainerRef, ViewEncapsulation, Input, Output, EventEmitter, ElementRef, AfterViewInit, Pipe, PipeTransform } from '@angular/core';
2
- import { SafeResourceUrl, DomSanitizer } from '@angular/platform-browser';
3
- import { CommonModule } from '@angular/common';
4
-
5
- @Component({
6
- selector: 'c-item',
7
- template: ``
8
- })
9
-
10
- export class Item {
11
-
12
- @ContentChild(TemplateRef) template: TemplateRef<any>
13
- constructor() {
14
- }
15
-
16
- }
17
-
18
- @Component({
19
- selector: 'c-badge',
20
- template: ``
21
- })
22
-
23
- export class Badge {
24
-
25
- @ContentChild(TemplateRef) template: TemplateRef<any>
26
- constructor() {
27
- }
28
-
29
- }
30
-
31
- @Component({
32
- selector: 'c-templateRenderer',
33
- template: ``
34
- })
35
-
36
- export class TemplateRenderer implements OnInit, OnDestroy {
37
-
38
- @Input() data: any
39
- @Input() item: any
40
- view: EmbeddedViewRef<any>;
41
-
42
- constructor(public viewContainer: ViewContainerRef) {
43
- }
44
- ngOnInit() {
45
- this.view = this.viewContainer.createEmbeddedView(this.data.template, {
46
- '\$implicit': this.data,
47
- 'item':this.item
48
- });
49
- }
50
-
51
- ngOnDestroy() {
52
- this.view.destroy();
53
- }
54
-
55
- }
@@ -1,88 +0,0 @@
1
- <div class="stackline-dropdown" [ngClass]="{'theme-material': settings.theme == 'material', 'theme-classic': settings.theme != 'material'}" (clickOutside)="closeDropdown()">
2
- <div class="selected-list">
3
- <div class="c-btn" (click)="toggleDropdown($event)" [ngClass]="{'disabled': settings.disabled}">
4
- <span *ngIf="selectedItems?.length == 0">{{settings.text}}</span>
5
- <span *ngIf="settings.singleSelection">
6
- <span *ngFor="let item of selectedItems;trackBy: trackByFn;">
7
- {{item[settings.labelKey]}}
8
- </span>
9
- </span>
10
- <div class="c-list" *ngIf="selectedItems?.length > 0 && !settings.singleSelection">
11
- <div class="c-token" *ngFor="let item of selectedItems;trackBy: trackByFn;let k = index" [hidden]="k > settings.badgeShowLimit-1">
12
- <span *ngIf="!badgeTempl" class="c-label">{{item[settings.labelKey]}}</span>
13
- <span *ngIf="badgeTempl" class="c-label">
14
- <c-templateRenderer [data]="badgeTempl" [item]="item"></c-templateRenderer>
15
- </span>
16
- <span class="fa fa-remove" (click)="onItemClick(item,k,$event)"></span>
17
- </div>
18
- </div>
19
- <span class="countplaceholder" *ngIf="selectedItems?.length > settings.badgeShowLimit">+{{selectedItems?.length - settings.badgeShowLimit }}</span>
20
- <span class="fa" [ngClass]="{'fa-angle-down': !isActive,'fa-angle-up':isActive}"></span>
21
- </div>
22
- </div>
23
- <div class="dropdown-list" [hidden]="!isActive">
24
- <div class="arrow-up arrow-2"></div>
25
- <div class="arrow-up"></div>
26
- <div class="list-area">
27
- <div class="pure-checkbox select-all" *ngIf="settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection" (click)="toggleSelectAll()">
28
- <input *ngIf="settings.showCheckbox" type="checkbox" [checked]="isSelectAll" [disabled]="settings.limitSelection == selectedItems?.length"/>
29
- <label>
30
- <span [hidden]="isSelectAll">{{settings.selectAllText}}</span>
31
- <span [hidden]="!isSelectAll">{{settings.unSelectAllText}}</span>
32
- </label>
33
- </div>
34
- <div class="list-filter" *ngIf="settings.enableSearchFilter && !settings.lazyLoading">
35
- <span class="fa fa-search"></span>
36
- <input #searchInput type="text" [placeholder]="settings.searchPlaceholderText" [(ngModel)]="filter">
37
- </div>
38
- <div class="list-filter" *ngIf="settings.enableSearchFilter && settings.lazyLoading">
39
- <span class="fa fa-search"></span>
40
- <input #searchInput type="text" [placeholder]="settings.searchPlaceholderText" (keyup)="filterInfiniteList($event)">
41
- </div>
42
- <ul *ngIf="!settings.groupBy" [style.maxHeight] = "settings.maxHeight+'px'" class="lazyContainer" >
43
- <span *ngIf="itemTempl">
44
- <li *ngFor="let item of data | listFilter:filter; let i = index;" (click)="onItemClick(item,i,$event)" class="pure-checkbox">
45
- <input *ngIf="settings.showCheckbox" type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>
46
- <label></label>
47
- <c-templateRenderer [data]="itemTempl" [item]="item"></c-templateRenderer>
48
- </li>
49
- </span>
50
- <span *ngIf="!itemTempl && !settings.lazyLoading" >
51
- <li *ngFor="let item of data | listFilter:filter; let i = index;" (click)="onItemClick(item,i,$event)" class="pure-checkbox">
52
- <input *ngIf="settings.showCheckbox" type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>
53
- <label>{{item[settings.labelKey]}}</label>
54
- </li>
55
- </span>
56
- <span *ngIf="!itemTempl && settings.lazyLoading" >
57
- <div [ngStyle]="{'height':totalHeight+'px'}" style="position: relative;">
58
-
59
-
60
- <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]">
61
- <input *ngIf="settings.showCheckbox" type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>
62
- <label>{{item[settings.labelKey]}}</label>
63
- </li>
64
- </div>
65
- </span>
66
- </ul>
67
- <div *ngIf="settings.groupBy" [style.maxHeight] = "settings.maxHeight+'px'" style="overflow: auto;">
68
- <ul *ngFor="let obj of groupedData ; let i = index;" class="list-grp">
69
- <h4 *ngIf="(obj.value | listFilter:filter ).length > 0">{{obj.key}}</h4>
70
- <span *ngIf="itemTempl" >
71
- <li *ngFor="let item of obj.value | listFilter:filter; let i = index;" (click)="onItemClick(item,i,$event)" class="pure-checkbox">
72
- <input *ngIf="settings.showCheckbox" type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>
73
- <label></label>
74
- <c-templateRenderer [data]="itemTempl" [item]="item"></c-templateRenderer>
75
- </li>
76
- </span>
77
- <span *ngIf="!itemTempl" >
78
- <li *ngFor="let item of obj.value | listFilter:filter; let i = index;" (click)="onItemClick(item,i,$event)" class="pure-checkbox">
79
- <input *ngIf="settings.showCheckbox" type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>
80
- <label>{{item[settings.labelKey]}}</label>
81
- </li>
82
- </span>
83
- </ul>
84
- </div>
85
- <h5 class="list-message" *ngIf="data?.length == 0">{{settings.noDataLabel}}</h5>
86
- </div>
87
- </div>
88
- </div>