Socket
Socket
Sign inDemoInstall

angular2-multiselect-dropdown

Package Overview
Dependencies
Maintainers
1
Versions
91
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

angular2-multiselect-dropdown - npm Package Compare versions

Comparing version 1.2.5 to 1.2.6

11

angular2-multiselect-dropdown.umd.js
/**
* angular2-multiselect-dropdown - undefined
* @version v1.2.5
* @version v1.2.6
* @author undefined

@@ -150,3 +150,3 @@ * @link undefined

};
AngularMultiSelect.prototype.onItemClick = function (item, index) {
AngularMultiSelect.prototype.onItemClick = function (item, index, evt) {
if (this.settings.disabled) {

@@ -251,2 +251,5 @@ return false;

AngularMultiSelect.prototype.toggleDropdown = function (evt) {
if (this.settings.disabled) {
return false;
}
this.isActive = !this.isActive;

@@ -461,3 +464,3 @@ evt.preventDefault();

// module
exports.push([module.i, ".cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list button {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type=\"checkbox\"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type=\"checkbox\"]:focus + label:before,\n.pure-checkbox input[type=\"checkbox\"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type=\"checkbox\"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type=\"checkbox\"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:before {\n box-sizing: content-box;\n content: '';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n box-sizing: content-box;\n content: '';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:focus + label:before\n.pure-checkbox input[type=\"checkbox\"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n content: '';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type=\"radio\"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n", ""]);
exports.push([module.i, ".cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px;\n z-index: 100000000; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list .c-btn {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px;\n cursor: pointer; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type=\"checkbox\"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type=\"checkbox\"]:focus + label:before,\n.pure-checkbox input[type=\"checkbox\"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type=\"checkbox\"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type=\"checkbox\"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:before {\n box-sizing: content-box;\n content: '';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n box-sizing: content-box;\n content: '';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:focus + label:before\n.pure-checkbox input[type=\"checkbox\"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n content: '';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type=\"radio\"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n", ""]);

@@ -553,3 +556,3 @@ // exports

module.exports = "<div class=\"cuppa-dropdown\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"selected-list\">\r\n <button class=\"c-btn\" (click)=\"toggleDropdown($event)\" [disabled]=\"settings.disabled\" [ngClass]=\"{'disabled': settings.disabled}\">\r\n <span *ngIf=\"selectedItems?.length == 0\">{{settings.text}}</span>\r\n <span *ngIf=\"settings.singleSelection\">\r\n <span *ngFor=\"let item of selectedItems;trackBy: trackByFn;\">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class=\"c-list\" *ngIf=\"selectedItems?.length > 0 && !settings.singleSelection\">\r\n <div class=\"c-token\" *ngFor=\"let item of selectedItems;trackBy: trackByFn;let k = index\" [hidden]=\"k > settings.badgeShowLimit-1\">\r\n <span class=\"c-label\">{{item.itemName}}</span>\r\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item)\" disabled=\"true\"></span>\r\n </div>\r\n </div> \r\n <span *ngIf=\"selectedItems?.length > settings.badgeShowLimit\">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class=\"fa\" [ngClass]=\"{'fa-angle-down': !isActive,'fa-angle-up':isActive}\"></span>\r\n </button> \r\n </div>\r\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\r\n <div class=\"arrow-up\"></div>\r\n <div class=\"list-area\">\r\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\r\n <input type=\"checkbox\" [checked]=\"isSelectAll\" [disabled]=\"settings.limitSelection == selectedItems?.length\"/>\r\n <label>\r\n <span [hidden]=\"isSelectAll\">{{settings.selectAllText}}</span>\r\n <span [hidden]=\"!isSelectAll\">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter\">\r\n <span class=\"fa fa-search\"></span>\r\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\r\n </div> \r\n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\r\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i)\" class=\"pure-checkbox\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>"
module.exports = "<div class=\"cuppa-dropdown\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"selected-list\">\r\n <div class=\"c-btn\" (click)=\"toggleDropdown($event)\" [ngClass]=\"{'disabled': settings.disabled}\">\r\n <span *ngIf=\"selectedItems?.length == 0\">{{settings.text}}</span>\r\n <span *ngIf=\"settings.singleSelection\">\r\n <span *ngFor=\"let item of selectedItems;trackBy: trackByFn;\">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class=\"c-list\" *ngIf=\"selectedItems?.length > 0 && !settings.singleSelection\">\r\n <div class=\"c-token\" *ngFor=\"let item of selectedItems;trackBy: trackByFn;let k = index\" [hidden]=\"k > settings.badgeShowLimit-1\">\r\n <span class=\"c-label\">{{item.itemName}}</span>\r\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item,k,$event)\" disabled=\"true\"></span>\r\n </div>\r\n </div> \r\n <span *ngIf=\"selectedItems?.length > settings.badgeShowLimit\">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class=\"fa\" [ngClass]=\"{'fa-angle-down': !isActive,'fa-angle-up':isActive}\"></span>\r\n </div> \r\n </div>\r\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\r\n <div class=\"arrow-up\"></div>\r\n <div class=\"list-area\">\r\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\r\n <input type=\"checkbox\" [checked]=\"isSelectAll\" [disabled]=\"settings.limitSelection == selectedItems?.length\"/>\r\n <label>\r\n <span [hidden]=\"isSelectAll\">{{settings.selectAllText}}</span>\r\n <span [hidden]=\"!isSelectAll\">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter\">\r\n <span class=\"fa fa-search\"></span>\r\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\r\n </div> \r\n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\r\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>"

@@ -556,0 +559,0 @@ /***/ }),

4

angular2-multiselect-dropdown.umd.min.js
/**
* angular2-multiselect-dropdown - undefined
* @version v1.2.5
* @version v1.2.6
* @author undefined

@@ -8,3 +8,3 @@ * @link undefined

*/
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):"function"==typeof define&&define.amd?define(["@angular/core","@angular/common","@angular/forms"],t):"object"==typeof exports?exports.ticktock=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):e.ticktock=t(e.ng.core,e.ng.common,e.ng.forms)}(this,function(e,t,n){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=11)}([function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=n(10),r=n(9),c=n(4),a=n(2),d=n(3);t.DROPDOWN_CONTROL_VALUE_ACCESSOR={provide:s.NG_VALUE_ACCESSOR,useExisting:l.forwardRef(function(){return u}),multi:!0};var p=function(){},u=function(){function e(){this.onSelect=new l.EventEmitter,this.onDeSelect=new l.EventEmitter,this.onSelectAll=new l.EventEmitter,this.onDeSelectAll=new l.EventEmitter,this.isActive=!1,this.isSelectAll=!1,this.filter=new c.ListItem,this.defaultSettings={singleSelection:!1,text:"Select",enableCheckAll:!0,selectAllText:"Select All",unSelectAllText:"UnSelect All",enableSearchFilter:!1,maxHeight:300,badgeShowLimit:999999999999,classes:"",disabled:!1,searchPlaceholderText:"Search"},this.onTouchedCallback=p,this.onChangeCallback=p}return e.prototype.ngOnInit=function(){this.settings=Object.assign(this.defaultSettings,this.settings)},e.prototype.ngDoCheck=function(){this.selectedItems&&(0==this.selectedItems.length||0==this.data.length||this.selectedItems.length<this.data.length)&&(this.isSelectAll=!1)},e.prototype.onItemClick=function(e,t){if(this.settings.disabled)return!1;var n=this.isSelected(e),i=this.selectedItems.length<this.settings.limitSelection;n?(this.removeSelected(e),this.onDeSelect.emit(e)):this.settings.limitSelection?i&&(this.addSelected(e),this.onSelect.emit(e)):(this.addSelected(e),this.onSelect.emit(e)),(this.isSelectAll||this.data.length>this.selectedItems.length)&&(this.isSelectAll=!1),this.data.length==this.selectedItems.length&&(this.isSelectAll=!0)},e.prototype.writeValue=function(e){if(void 0!==e&&null!==e)if(this.settings.singleSelection)try{if(e.length>1)throw this.selectedItems=[e[0]],new c.MyException(404,{msg:"Single Selection Mode, Selected Items cannot have more than one item."});this.selectedItems=e}catch(e){console.error(e.body.msg)}else this.settings.limitSelection?this.selectedItems=e.splice(0,this.settings.limitSelection):this.selectedItems=e,this.selectedItems.length===this.data.length&&this.data.length>0&&(this.isSelectAll=!0);else this.selectedItems=[]},e.prototype.registerOnChange=function(e){this.onChangeCallback=e},e.prototype.registerOnTouched=function(e){this.onTouchedCallback=e},e.prototype.trackByFn=function(e,t){return t.id},e.prototype.isSelected=function(e){var t=!1;return this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&(t=!0)}),t},e.prototype.addSelected=function(e){this.settings.singleSelection?(this.selectedItems=[],this.selectedItems.push(e)):this.selectedItems.push(e),this.onChangeCallback(this.selectedItems)},e.prototype.removeSelected=function(e){var t=this;this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&t.selectedItems.splice(t.selectedItems.indexOf(n),1)}),this.onChangeCallback(this.selectedItems)},e.prototype.toggleDropdown=function(e){this.isActive=!this.isActive,e.preventDefault()},e.prototype.closeDropdown=function(){this.isActive=!1},e.prototype.toggleSelectAll=function(){this.isSelectAll?(this.selectedItems=[],this.isSelectAll=!1,this.onChangeCallback(this.selectedItems),this.onDeSelectAll.emit(this.selectedItems)):(this.selectedItems=[],this.selectedItems=this.data.slice(),this.isSelectAll=!0,this.onChangeCallback(this.selectedItems),this.onSelectAll.emit(this.selectedItems))},i([l.Input(),o("design:type",Array)],e.prototype,"data",void 0),i([l.Input(),o("design:type",Object)],e.prototype,"settings",void 0),i([l.Output("onSelect"),o("design:type",l.EventEmitter)],e.prototype,"onSelect",void 0),i([l.Output("onDeSelect"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelect",void 0),i([l.Output("onSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onSelectAll",void 0),i([l.Output("onDeSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelectAll",void 0),e=i([l.Component({selector:"angular2-multiselect",template:n(7),host:{"[class]":"defaultSettings.classes"},styles:[n(8)],providers:[t.DROPDOWN_CONTROL_VALUE_ACCESSOR]}),o("design:paramtypes",[])],e)}();t.AngularMultiSelect=u;var f=function(){function e(){}return e=i([l.NgModule({imports:[r.CommonModule,s.FormsModule],declarations:[u,a.ClickOutsideDirective,d.ListFilterPipe],exports:[u,a.ClickOutsideDirective,d.ListFilterPipe]})],e)}();t.AngularMultiSelectModule=f},function(t,n){t.exports=e},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=function(){function e(e){this._elementRef=e,this.clickOutside=new l.EventEmitter}return e.prototype.onClick=function(e,t){if(t){this._elementRef.nativeElement.contains(t)||this.clickOutside.emit(e)}},i([l.Output(),o("design:type",Object)],e.prototype,"clickOutside",void 0),i([l.HostListener("document:click",["$event","$event.target"]),o("design:type",Function),o("design:paramtypes",[MouseEvent,HTMLElement]),o("design:returntype",void 0)],e.prototype,"onClick",null),e=i([l.Directive({selector:"[clickOutside]"}),o("design:paramtypes",[l.ElementRef])],e)}();t.ClickOutsideDirective=s},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s};Object.defineProperty(t,"__esModule",{value:!0});var o=n(1),l=function(){function e(){}return e.prototype.transform=function(e,t){var n=this;return e&&t?e.filter(function(e){return n.applyFilter(e,t)}):e},e.prototype.applyFilter=function(e,t){return!(t.itemName&&e.itemName&&-1===e.itemName.toLowerCase().indexOf(t.itemName.toLowerCase()))},e=i([o.Pipe({name:"listFilter",pure:!1})],e)}();t.ListFilterPipe=l},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(){}return e}();t.ListItem=i;var o=function(){function e(e,t){this.status=e,this.body=t}return e}();t.MyException=o},function(e,t,n){t=e.exports=n(6)(void 0),t.push([e.i,'.cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list button {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type="checkbox"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type="checkbox"]:focus + label:before,\n.pure-checkbox input[type="checkbox"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type="checkbox"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type="checkbox"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type="checkbox"] + label:before {\n box-sizing: content-box;\n content: \'\';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n box-sizing: content-box;\n content: \'\';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="checkbox"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"]:disabled:focus + label:before\n.pure-checkbox input[type="checkbox"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type="checkbox"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n content: \'\';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="radio"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type="radio"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type="radio"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n',""])},function(e,t){function n(e,t){var n=e[1]||"",o=e[3];if(!o)return n;if(t&&"function"==typeof btoa){var l=i(o);return[n].concat(o.sources.map(function(e){return"/*# sourceURL="+o.sourceRoot+e+" */"})).concat([l]).join("\n")}return[n].join("\n")}function i(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var i=n(t,e);return t[2]?"@media "+t[2]+"{"+i+"}":i}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var i={},o=0;o<this.length;o++){var l=this[o][0];"number"==typeof l&&(i[l]=!0)}for(o=0;o<e.length;o++){var s=e[o];"number"==typeof s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),t.push(s))}},t}},function(e,t){e.exports='<div class="cuppa-dropdown" (clickOutside)="closeDropdown()">\r\n <div class="selected-list">\r\n <button class="c-btn" (click)="toggleDropdown($event)" [disabled]="settings.disabled" [ngClass]="{\'disabled\': settings.disabled}">\r\n <span *ngIf="selectedItems?.length == 0">{{settings.text}}</span>\r\n <span *ngIf="settings.singleSelection">\r\n <span *ngFor="let item of selectedItems;trackBy: trackByFn;">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class="c-list" *ngIf="selectedItems?.length > 0 && !settings.singleSelection">\r\n <div class="c-token" *ngFor="let item of selectedItems;trackBy: trackByFn;let k = index" [hidden]="k > settings.badgeShowLimit-1">\r\n <span class="c-label">{{item.itemName}}</span>\r\n <span class="fa fa-remove" (click)="onItemClick(item)" disabled="true"></span>\r\n </div>\r\n </div> \r\n <span *ngIf="selectedItems?.length > settings.badgeShowLimit">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class="fa" [ngClass]="{\'fa-angle-down\': !isActive,\'fa-angle-up\':isActive}"></span>\r\n </button> \r\n </div>\r\n <div class="dropdown-list" [hidden]="!isActive">\r\n <div class="arrow-up"></div>\r\n <div class="list-area">\r\n <div class="pure-checkbox select-all" *ngIf="settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection" (click)="toggleSelectAll()">\r\n <input type="checkbox" [checked]="isSelectAll" [disabled]="settings.limitSelection == selectedItems?.length"/>\r\n <label>\r\n <span [hidden]="isSelectAll">{{settings.selectAllText}}</span>\r\n <span [hidden]="!isSelectAll">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class="list-filter" *ngIf="settings.enableSearchFilter">\r\n <span class="fa fa-search"></span>\r\n <input type="text" [placeholder]="settings.searchPlaceholderText" [(ngModel)]="filter.itemName">\r\n </div> \r\n <ul [style.maxHeight] = "settings.maxHeight+\'px\'">\r\n <li *ngFor="let item of data | listFilter:filter; let i = index;" (click)="onItemClick(item,i)" class="pure-checkbox">\r\n <input type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class="list-message" *ngIf="data?.length == 0">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>'},function(e,t,n){var i=n(5);e.exports="string"==typeof i?i:i.toString()},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(0);t.AngularMultiSelect=i.AngularMultiSelect;var o=n(2);t.ClickOutsideDirective=o.ClickOutsideDirective;var l=n(3);t.ListFilterPipe=l.ListFilterPipe;var s=n(0);t.AngularMultiSelectModule=s.AngularMultiSelectModule}])});
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):"function"==typeof define&&define.amd?define(["@angular/core","@angular/common","@angular/forms"],t):"object"==typeof exports?exports.ticktock=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):e.ticktock=t(e.ng.core,e.ng.common,e.ng.forms)}(this,function(e,t,n){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=11)}([function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=n(10),r=n(9),c=n(4),a=n(2),d=n(3);t.DROPDOWN_CONTROL_VALUE_ACCESSOR={provide:s.NG_VALUE_ACCESSOR,useExisting:l.forwardRef(function(){return u}),multi:!0};var p=function(){},u=function(){function e(){this.onSelect=new l.EventEmitter,this.onDeSelect=new l.EventEmitter,this.onSelectAll=new l.EventEmitter,this.onDeSelectAll=new l.EventEmitter,this.isActive=!1,this.isSelectAll=!1,this.filter=new c.ListItem,this.defaultSettings={singleSelection:!1,text:"Select",enableCheckAll:!0,selectAllText:"Select All",unSelectAllText:"UnSelect All",enableSearchFilter:!1,maxHeight:300,badgeShowLimit:999999999999,classes:"",disabled:!1,searchPlaceholderText:"Search"},this.onTouchedCallback=p,this.onChangeCallback=p}return e.prototype.ngOnInit=function(){this.settings=Object.assign(this.defaultSettings,this.settings)},e.prototype.ngDoCheck=function(){this.selectedItems&&(0==this.selectedItems.length||0==this.data.length||this.selectedItems.length<this.data.length)&&(this.isSelectAll=!1)},e.prototype.onItemClick=function(e,t,n){if(this.settings.disabled)return!1;var i=this.isSelected(e),o=this.selectedItems.length<this.settings.limitSelection;i?(this.removeSelected(e),this.onDeSelect.emit(e)):this.settings.limitSelection?o&&(this.addSelected(e),this.onSelect.emit(e)):(this.addSelected(e),this.onSelect.emit(e)),(this.isSelectAll||this.data.length>this.selectedItems.length)&&(this.isSelectAll=!1),this.data.length==this.selectedItems.length&&(this.isSelectAll=!0)},e.prototype.writeValue=function(e){if(void 0!==e&&null!==e)if(this.settings.singleSelection)try{if(e.length>1)throw this.selectedItems=[e[0]],new c.MyException(404,{msg:"Single Selection Mode, Selected Items cannot have more than one item."});this.selectedItems=e}catch(e){console.error(e.body.msg)}else this.settings.limitSelection?this.selectedItems=e.splice(0,this.settings.limitSelection):this.selectedItems=e,this.selectedItems.length===this.data.length&&this.data.length>0&&(this.isSelectAll=!0);else this.selectedItems=[]},e.prototype.registerOnChange=function(e){this.onChangeCallback=e},e.prototype.registerOnTouched=function(e){this.onTouchedCallback=e},e.prototype.trackByFn=function(e,t){return t.id},e.prototype.isSelected=function(e){var t=!1;return this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&(t=!0)}),t},e.prototype.addSelected=function(e){this.settings.singleSelection?(this.selectedItems=[],this.selectedItems.push(e)):this.selectedItems.push(e),this.onChangeCallback(this.selectedItems)},e.prototype.removeSelected=function(e){var t=this;this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&t.selectedItems.splice(t.selectedItems.indexOf(n),1)}),this.onChangeCallback(this.selectedItems)},e.prototype.toggleDropdown=function(e){if(this.settings.disabled)return!1;this.isActive=!this.isActive,e.preventDefault()},e.prototype.closeDropdown=function(){this.isActive=!1},e.prototype.toggleSelectAll=function(){this.isSelectAll?(this.selectedItems=[],this.isSelectAll=!1,this.onChangeCallback(this.selectedItems),this.onDeSelectAll.emit(this.selectedItems)):(this.selectedItems=[],this.selectedItems=this.data.slice(),this.isSelectAll=!0,this.onChangeCallback(this.selectedItems),this.onSelectAll.emit(this.selectedItems))},i([l.Input(),o("design:type",Array)],e.prototype,"data",void 0),i([l.Input(),o("design:type",Object)],e.prototype,"settings",void 0),i([l.Output("onSelect"),o("design:type",l.EventEmitter)],e.prototype,"onSelect",void 0),i([l.Output("onDeSelect"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelect",void 0),i([l.Output("onSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onSelectAll",void 0),i([l.Output("onDeSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelectAll",void 0),e=i([l.Component({selector:"angular2-multiselect",template:n(7),host:{"[class]":"defaultSettings.classes"},styles:[n(8)],providers:[t.DROPDOWN_CONTROL_VALUE_ACCESSOR]}),o("design:paramtypes",[])],e)}();t.AngularMultiSelect=u;var f=function(){function e(){}return e=i([l.NgModule({imports:[r.CommonModule,s.FormsModule],declarations:[u,a.ClickOutsideDirective,d.ListFilterPipe],exports:[u,a.ClickOutsideDirective,d.ListFilterPipe]})],e)}();t.AngularMultiSelectModule=f},function(t,n){t.exports=e},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=function(){function e(e){this._elementRef=e,this.clickOutside=new l.EventEmitter}return e.prototype.onClick=function(e,t){if(t){this._elementRef.nativeElement.contains(t)||this.clickOutside.emit(e)}},i([l.Output(),o("design:type",Object)],e.prototype,"clickOutside",void 0),i([l.HostListener("document:click",["$event","$event.target"]),o("design:type",Function),o("design:paramtypes",[MouseEvent,HTMLElement]),o("design:returntype",void 0)],e.prototype,"onClick",null),e=i([l.Directive({selector:"[clickOutside]"}),o("design:paramtypes",[l.ElementRef])],e)}();t.ClickOutsideDirective=s},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s};Object.defineProperty(t,"__esModule",{value:!0});var o=n(1),l=function(){function e(){}return e.prototype.transform=function(e,t){var n=this;return e&&t?e.filter(function(e){return n.applyFilter(e,t)}):e},e.prototype.applyFilter=function(e,t){return!(t.itemName&&e.itemName&&-1===e.itemName.toLowerCase().indexOf(t.itemName.toLowerCase()))},e=i([o.Pipe({name:"listFilter",pure:!1})],e)}();t.ListFilterPipe=l},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(){}return e}();t.ListItem=i;var o=function(){function e(e,t){this.status=e,this.body=t}return e}();t.MyException=o},function(e,t,n){t=e.exports=n(6)(void 0),t.push([e.i,'.cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px;\n z-index: 100000000; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list .c-btn {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px;\n cursor: pointer; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type="checkbox"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type="checkbox"]:focus + label:before,\n.pure-checkbox input[type="checkbox"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type="checkbox"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type="checkbox"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type="checkbox"] + label:before {\n box-sizing: content-box;\n content: \'\';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n box-sizing: content-box;\n content: \'\';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="checkbox"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"]:disabled:focus + label:before\n.pure-checkbox input[type="checkbox"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type="checkbox"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n content: \'\';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="radio"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type="radio"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type="radio"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n',""])},function(e,t){function n(e,t){var n=e[1]||"",o=e[3];if(!o)return n;if(t&&"function"==typeof btoa){var l=i(o);return[n].concat(o.sources.map(function(e){return"/*# sourceURL="+o.sourceRoot+e+" */"})).concat([l]).join("\n")}return[n].join("\n")}function i(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var i=n(t,e);return t[2]?"@media "+t[2]+"{"+i+"}":i}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var i={},o=0;o<this.length;o++){var l=this[o][0];"number"==typeof l&&(i[l]=!0)}for(o=0;o<e.length;o++){var s=e[o];"number"==typeof s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),t.push(s))}},t}},function(e,t){e.exports='<div class="cuppa-dropdown" (clickOutside)="closeDropdown()">\r\n <div class="selected-list">\r\n <div class="c-btn" (click)="toggleDropdown($event)" [ngClass]="{\'disabled\': settings.disabled}">\r\n <span *ngIf="selectedItems?.length == 0">{{settings.text}}</span>\r\n <span *ngIf="settings.singleSelection">\r\n <span *ngFor="let item of selectedItems;trackBy: trackByFn;">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class="c-list" *ngIf="selectedItems?.length > 0 && !settings.singleSelection">\r\n <div class="c-token" *ngFor="let item of selectedItems;trackBy: trackByFn;let k = index" [hidden]="k > settings.badgeShowLimit-1">\r\n <span class="c-label">{{item.itemName}}</span>\r\n <span class="fa fa-remove" (click)="onItemClick(item,k,$event)" disabled="true"></span>\r\n </div>\r\n </div> \r\n <span *ngIf="selectedItems?.length > settings.badgeShowLimit">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class="fa" [ngClass]="{\'fa-angle-down\': !isActive,\'fa-angle-up\':isActive}"></span>\r\n </div> \r\n </div>\r\n <div class="dropdown-list" [hidden]="!isActive">\r\n <div class="arrow-up"></div>\r\n <div class="list-area">\r\n <div class="pure-checkbox select-all" *ngIf="settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection" (click)="toggleSelectAll()">\r\n <input type="checkbox" [checked]="isSelectAll" [disabled]="settings.limitSelection == selectedItems?.length"/>\r\n <label>\r\n <span [hidden]="isSelectAll">{{settings.selectAllText}}</span>\r\n <span [hidden]="!isSelectAll">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class="list-filter" *ngIf="settings.enableSearchFilter">\r\n <span class="fa fa-search"></span>\r\n <input type="text" [placeholder]="settings.searchPlaceholderText" [(ngModel)]="filter.itemName">\r\n </div> \r\n <ul [style.maxHeight] = "settings.maxHeight+\'px\'">\r\n <li *ngFor="let item of data | listFilter:filter; let i = index;" (click)="onItemClick(item,i,$event)" class="pure-checkbox">\r\n <input type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class="list-message" *ngIf="data?.length == 0">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>'},function(e,t,n){var i=n(5);e.exports="string"==typeof i?i:i.toString()},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(0);t.AngularMultiSelect=i.AngularMultiSelect;var o=n(2);t.ClickOutsideDirective=o.ClickOutsideDirective;var l=n(3);t.ListFilterPipe=l.ListFilterPipe;var s=n(0);t.AngularMultiSelectModule=s.AngularMultiSelectModule}])});
//# sourceMappingURL=angular2-multiselect-dropdown.umd.min.js.map

4

angular2-multiselect-dropdown/multiselect.component.d.ts

@@ -21,3 +21,3 @@ import { OnInit, EventEmitter } from '@angular/core';

ngDoCheck(): void;
onItemClick(item: ListItem, index: number): boolean;
onItemClick(item: ListItem, index: number, evt: Event): boolean;
private onTouchedCallback;

@@ -32,3 +32,3 @@ private onChangeCallback;

removeSelected(clickedItem: ListItem): void;
toggleDropdown(evt: any): void;
toggleDropdown(evt: any): boolean;
closeDropdown(): void;

@@ -35,0 +35,0 @@ toggleSelectAll(): void;

9

angular2-multiselect-dropdown/multiselect.component.js

@@ -49,3 +49,3 @@ import { Component, NgModule, forwardRef, Input, Output, EventEmitter } from '@angular/core';

};
AngularMultiSelect.prototype.onItemClick = function (item, index) {
AngularMultiSelect.prototype.onItemClick = function (item, index, evt) {
if (this.settings.disabled) {

@@ -150,2 +150,5 @@ return false;

AngularMultiSelect.prototype.toggleDropdown = function (evt) {
if (this.settings.disabled) {
return false;
}
this.isActive = !this.isActive;

@@ -175,5 +178,5 @@ evt.preventDefault();

selector: 'angular2-multiselect',
template: "\n <div class=\"cuppa-dropdown\" (clickOutside)=\"closeDropdown()\">\n <div class=\"selected-list\">\n <button class=\"c-btn\" (click)=\"toggleDropdown($event)\" [disabled]=\"settings.disabled\" [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.itemName}}\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 class=\"c-label\">{{item.itemName}}</span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item)\" disabled=\"true\"></span>\n </div>\n </div> \n <span *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 </button> \n </div>\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\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 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\">\n <span class=\"fa fa-search\"></span>\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\n </div> \n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i)\" class=\"pure-checkbox\">\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item.itemName}}</label>\n </li>\n </ul>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\n </div>\n </div>\n </div>\n ",
template: "\n <div class=\"cuppa-dropdown\" (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.itemName}}\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 class=\"c-label\">{{item.itemName}}</span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item,k,$event)\" disabled=\"true\"></span>\n </div>\n </div> \n <span *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\"></div>\n <div class=\"list-area\">\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\n <input 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\">\n <span class=\"fa fa-search\"></span>\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\n </div> \n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item.itemName}}</label>\n </li>\n </ul>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\n </div>\n </div>\n </div>\n ",
host: { '[class]': 'defaultSettings.classes' },
styles: ["\n .cuppa-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{float:left;padding:0px;margin:0px}.selected-list .c-list .c-token{list-style:none;padding:0px 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;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:25%}.selected-list button{width:100%;box-shadow:0px 1px 5px #959595;padding:10px}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0px;list-style:none;overflow:auto;margin:0px}.dropdown-list ul li{padding:10px 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 ul::-webkit-scrollbar{width:8px}.dropdown-list ul::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ul::-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}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0px;box-shadow:0px 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:0px 0px 0px 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;user-select:none;cursor:pointer;margin:0px;color:#000}.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 0.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 200ms ease-out}.pure-checkbox input[type=\"checkbox\"]:disabled+label:before{border-color:#cccccc}.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:#cccccc}.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:#ffffff;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 200ms ease-out}.pure-checkbox input[type=\"radio\"]:checked+label:before{animation:borderscale 300ms ease-in;background-color:white}.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{animation:borderscale 200ms ease-in;background:#0079FE}.pure-checkbox input[type=\"checkbox\"]:checked+label:after{transform:rotate(-45deg) scale(1)}@keyframes borderscale{50%{box-shadow:0 0 0 2px #0079FE}}.list-message{text-align:center}\n "],
styles: ["\n .cuppa-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{float:left;padding:0px;margin:0px}.selected-list .c-list .c-token{list-style:none;padding:0px 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;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;z-index:100000000}.selected-list .fa-angle-down,.selected-list .fa-angle-up{font-size:15pt;position:absolute;right:10px;top:25%}.selected-list .c-btn{width:100%;box-shadow:0px 1px 5px #959595;padding:10px;cursor:pointer}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0px;list-style:none;overflow:auto;margin:0px}.dropdown-list ul li{padding:10px 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 ul::-webkit-scrollbar{width:8px}.dropdown-list ul::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ul::-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}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0px;box-shadow:0px 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:0px 0px 0px 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;user-select:none;cursor:pointer;margin:0px;color:#000}.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 0.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 200ms ease-out}.pure-checkbox input[type=\"checkbox\"]:disabled+label:before{border-color:#cccccc}.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:#cccccc}.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:#ffffff;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 200ms ease-out}.pure-checkbox input[type=\"radio\"]:checked+label:before{animation:borderscale 300ms ease-in;background-color:white}.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{animation:borderscale 200ms ease-in;background:#0079FE}.pure-checkbox input[type=\"checkbox\"]:checked+label:after{transform:rotate(-45deg) scale(1)}@keyframes borderscale{50%{box-shadow:0 0 0 2px #0079FE}}.list-message{text-align:center}\n "],
providers: [DROPDOWN_CONTROL_VALUE_ACCESSOR]

@@ -180,0 +183,0 @@ },] },

2

angular2-multiselect-dropdown/multiselect.component.metadata.json

@@ -1,1 +0,1 @@

[{"__symbolic":"module","version":3,"metadata":{"DROPDOWN_CONTROL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"AngularMultiSelect"},"multi":true},"AngularMultiSelect":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"angular2-multiselect","template":"\n <div class=\"cuppa-dropdown\" (clickOutside)=\"closeDropdown()\">\n <div class=\"selected-list\">\n <button class=\"c-btn\" (click)=\"toggleDropdown($event)\" [disabled]=\"settings.disabled\" [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.itemName}}\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 class=\"c-label\">{{item.itemName}}</span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item)\" disabled=\"true\"></span>\n </div>\n </div> \n <span *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 </button> \n </div>\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\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 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\">\n <span class=\"fa fa-search\"></span>\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\n </div> \n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i)\" class=\"pure-checkbox\">\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item.itemName}}</label>\n </li>\n </ul>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\n </div>\n </div>\n </div>\n ","host":{"[class]":"defaultSettings.classes","$quoted$":["[class]"]},"styles":["\n .cuppa-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{float:left;padding:0px;margin:0px}.selected-list .c-list .c-token{list-style:none;padding:0px 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;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:25%}.selected-list button{width:100%;box-shadow:0px 1px 5px #959595;padding:10px}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0px;list-style:none;overflow:auto;margin:0px}.dropdown-list ul li{padding:10px 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 ul::-webkit-scrollbar{width:8px}.dropdown-list ul::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ul::-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}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0px;box-shadow:0px 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:0px 0px 0px 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;user-select:none;cursor:pointer;margin:0px;color:#000}.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 0.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 200ms ease-out}.pure-checkbox input[type=\"checkbox\"]:disabled+label:before{border-color:#cccccc}.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:#cccccc}.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:#ffffff;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 200ms ease-out}.pure-checkbox input[type=\"radio\"]:checked+label:before{animation:borderscale 300ms ease-in;background-color:white}.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{animation:borderscale 200ms ease-in;background:#0079FE}.pure-checkbox input[type=\"checkbox\"]:checked+label:after{transform:rotate(-45deg) scale(1)}@keyframes borderscale{50%{box-shadow:0 0 0 2px #0079FE}}.list-message{text-align:center}\n "],"providers":[{"__symbolic":"reference","name":"DROPDOWN_CONTROL_VALUE_ACCESSOR"}]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"settings":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelect"]}]}],"onDeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelect"]}]}],"onSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelectAll"]}]}],"onDeSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelectAll"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"onItemClick":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"addSelected":[{"__symbolic":"method"}],"removeSelected":[{"__symbolic":"method"}],"toggleDropdown":[{"__symbolic":"method"}],"closeDropdown":[{"__symbolic":"method"}],"toggleSelectAll":[{"__symbolic":"method"}]}},"AngularMultiSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule"}],"declarations":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}],"exports":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}]}]}]}}},{"__symbolic":"module","version":1,"metadata":{"DROPDOWN_CONTROL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"AngularMultiSelect"},"multi":true},"AngularMultiSelect":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"angular2-multiselect","template":"\n <div class=\"cuppa-dropdown\" (clickOutside)=\"closeDropdown()\">\n <div class=\"selected-list\">\n <button class=\"c-btn\" (click)=\"toggleDropdown($event)\" [disabled]=\"settings.disabled\" [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.itemName}}\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 class=\"c-label\">{{item.itemName}}</span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item)\" disabled=\"true\"></span>\n </div>\n </div> \n <span *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 </button> \n </div>\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\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 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\">\n <span class=\"fa fa-search\"></span>\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\n </div> \n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i)\" class=\"pure-checkbox\">\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item.itemName}}</label>\n </li>\n </ul>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\n </div>\n </div>\n </div>\n ","host":{"[class]":"defaultSettings.classes"},"styles":["\n .cuppa-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{float:left;padding:0px;margin:0px}.selected-list .c-list .c-token{list-style:none;padding:0px 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;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:25%}.selected-list button{width:100%;box-shadow:0px 1px 5px #959595;padding:10px}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0px;list-style:none;overflow:auto;margin:0px}.dropdown-list ul li{padding:10px 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 ul::-webkit-scrollbar{width:8px}.dropdown-list ul::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ul::-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}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0px;box-shadow:0px 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:0px 0px 0px 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;user-select:none;cursor:pointer;margin:0px;color:#000}.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 0.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 200ms ease-out}.pure-checkbox input[type=\"checkbox\"]:disabled+label:before{border-color:#cccccc}.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:#cccccc}.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:#ffffff;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 200ms ease-out}.pure-checkbox input[type=\"radio\"]:checked+label:before{animation:borderscale 300ms ease-in;background-color:white}.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{animation:borderscale 200ms ease-in;background:#0079FE}.pure-checkbox input[type=\"checkbox\"]:checked+label:after{transform:rotate(-45deg) scale(1)}@keyframes borderscale{50%{box-shadow:0 0 0 2px #0079FE}}.list-message{text-align:center}\n "],"providers":[{"__symbolic":"reference","name":"DROPDOWN_CONTROL_VALUE_ACCESSOR"}]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"settings":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelect"]}]}],"onDeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelect"]}]}],"onSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelectAll"]}]}],"onDeSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelectAll"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"onItemClick":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"addSelected":[{"__symbolic":"method"}],"removeSelected":[{"__symbolic":"method"}],"toggleDropdown":[{"__symbolic":"method"}],"closeDropdown":[{"__symbolic":"method"}],"toggleSelectAll":[{"__symbolic":"method"}]}},"AngularMultiSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule"}],"declarations":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}],"exports":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}]}]}]}}}]
[{"__symbolic":"module","version":3,"metadata":{"DROPDOWN_CONTROL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"AngularMultiSelect"},"multi":true},"AngularMultiSelect":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"angular2-multiselect","template":"\n <div class=\"cuppa-dropdown\" (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.itemName}}\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 class=\"c-label\">{{item.itemName}}</span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item,k,$event)\" disabled=\"true\"></span>\n </div>\n </div> \n <span *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\"></div>\n <div class=\"list-area\">\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\n <input 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\">\n <span class=\"fa fa-search\"></span>\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\n </div> \n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item.itemName}}</label>\n </li>\n </ul>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\n </div>\n </div>\n </div>\n ","host":{"[class]":"defaultSettings.classes","$quoted$":["[class]"]},"styles":["\n .cuppa-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{float:left;padding:0px;margin:0px}.selected-list .c-list .c-token{list-style:none;padding:0px 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;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;z-index:100000000}.selected-list .fa-angle-down,.selected-list .fa-angle-up{font-size:15pt;position:absolute;right:10px;top:25%}.selected-list .c-btn{width:100%;box-shadow:0px 1px 5px #959595;padding:10px;cursor:pointer}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0px;list-style:none;overflow:auto;margin:0px}.dropdown-list ul li{padding:10px 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 ul::-webkit-scrollbar{width:8px}.dropdown-list ul::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ul::-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}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0px;box-shadow:0px 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:0px 0px 0px 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;user-select:none;cursor:pointer;margin:0px;color:#000}.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 0.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 200ms ease-out}.pure-checkbox input[type=\"checkbox\"]:disabled+label:before{border-color:#cccccc}.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:#cccccc}.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:#ffffff;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 200ms ease-out}.pure-checkbox input[type=\"radio\"]:checked+label:before{animation:borderscale 300ms ease-in;background-color:white}.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{animation:borderscale 200ms ease-in;background:#0079FE}.pure-checkbox input[type=\"checkbox\"]:checked+label:after{transform:rotate(-45deg) scale(1)}@keyframes borderscale{50%{box-shadow:0 0 0 2px #0079FE}}.list-message{text-align:center}\n "],"providers":[{"__symbolic":"reference","name":"DROPDOWN_CONTROL_VALUE_ACCESSOR"}]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"settings":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelect"]}]}],"onDeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelect"]}]}],"onSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelectAll"]}]}],"onDeSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelectAll"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"onItemClick":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"addSelected":[{"__symbolic":"method"}],"removeSelected":[{"__symbolic":"method"}],"toggleDropdown":[{"__symbolic":"method"}],"closeDropdown":[{"__symbolic":"method"}],"toggleSelectAll":[{"__symbolic":"method"}]}},"AngularMultiSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule"}],"declarations":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}],"exports":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}]}]}]}}},{"__symbolic":"module","version":1,"metadata":{"DROPDOWN_CONTROL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"AngularMultiSelect"},"multi":true},"AngularMultiSelect":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"angular2-multiselect","template":"\n <div class=\"cuppa-dropdown\" (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.itemName}}\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 class=\"c-label\">{{item.itemName}}</span>\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item,k,$event)\" disabled=\"true\"></span>\n </div>\n </div> \n <span *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\"></div>\n <div class=\"list-area\">\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\n <input 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\">\n <span class=\"fa fa-search\"></span>\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\n </div> \n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\n <label>{{item.itemName}}</label>\n </li>\n </ul>\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\n </div>\n </div>\n </div>\n ","host":{"[class]":"defaultSettings.classes"},"styles":["\n .cuppa-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{float:left;padding:0px;margin:0px}.selected-list .c-list .c-token{list-style:none;padding:0px 5px;background:#0079FE;color:#fff;border-radius:2px;margin-right:4px;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;z-index:100000000}.selected-list .fa-angle-down,.selected-list .fa-angle-up{font-size:15pt;position:absolute;right:10px;top:25%}.selected-list .c-btn{width:100%;box-shadow:0px 1px 5px #959595;padding:10px;cursor:pointer}.dropdown-list{position:absolute;padding-top:14px;width:100%;z-index:9999}.dropdown-list ul{padding:0px;list-style:none;overflow:auto;margin:0px}.dropdown-list ul li{padding:10px 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 ul::-webkit-scrollbar{width:8px}.dropdown-list ul::-webkit-scrollbar-thumb{background:#cccccc;border-radius:5px}.dropdown-list ul::-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}.list-area{border:1px solid #ccc;border-radius:3px;background:#fff;margin:0px;box-shadow:0px 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:0px 0px 0px 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;user-select:none;cursor:pointer;margin:0px;color:#000}.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 0.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 200ms ease-out}.pure-checkbox input[type=\"checkbox\"]:disabled+label:before{border-color:#cccccc}.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:#cccccc}.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:#ffffff;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 200ms ease-out}.pure-checkbox input[type=\"radio\"]:checked+label:before{animation:borderscale 300ms ease-in;background-color:white}.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{animation:borderscale 200ms ease-in;background:#0079FE}.pure-checkbox input[type=\"checkbox\"]:checked+label:after{transform:rotate(-45deg) scale(1)}@keyframes borderscale{50%{box-shadow:0 0 0 2px #0079FE}}.list-message{text-align:center}\n "],"providers":[{"__symbolic":"reference","name":"DROPDOWN_CONTROL_VALUE_ACCESSOR"}]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"settings":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelect"]}]}],"onDeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelect"]}]}],"onSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onSelectAll"]}]}],"onDeSelectAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"},"arguments":["onDeSelectAll"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"onItemClick":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"addSelected":[{"__symbolic":"method"}],"removeSelected":[{"__symbolic":"method"}],"toggleDropdown":[{"__symbolic":"method"}],"closeDropdown":[{"__symbolic":"method"}],"toggleSelectAll":[{"__symbolic":"method"}]}},"AngularMultiSelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule"}],"declarations":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}],"exports":[{"__symbolic":"reference","name":"AngularMultiSelect"},{"__symbolic":"reference","module":"./clickOutside","name":"ClickOutsideDirective"},{"__symbolic":"reference","module":"./list-filter","name":"ListFilterPipe"}]}]}]}}}]

11

index.umd.js
/**
* angular2-multiselect-dropdown - undefined
* @version v1.2.5
* @version v1.2.6
* @author undefined

@@ -150,3 +150,3 @@ * @link undefined

};
AngularMultiSelect.prototype.onItemClick = function (item, index) {
AngularMultiSelect.prototype.onItemClick = function (item, index, evt) {
if (this.settings.disabled) {

@@ -251,2 +251,5 @@ return false;

AngularMultiSelect.prototype.toggleDropdown = function (evt) {
if (this.settings.disabled) {
return false;
}
this.isActive = !this.isActive;

@@ -461,3 +464,3 @@ evt.preventDefault();

// module
exports.push([module.i, ".cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list button {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type=\"checkbox\"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type=\"checkbox\"]:focus + label:before,\n.pure-checkbox input[type=\"checkbox\"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type=\"checkbox\"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type=\"checkbox\"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:before {\n box-sizing: content-box;\n content: '';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n box-sizing: content-box;\n content: '';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:focus + label:before\n.pure-checkbox input[type=\"checkbox\"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n content: '';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type=\"radio\"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n", ""]);
exports.push([module.i, ".cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px;\n z-index: 100000000; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list .c-btn {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px;\n cursor: pointer; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type=\"checkbox\"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type=\"checkbox\"]:focus + label:before,\n.pure-checkbox input[type=\"checkbox\"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type=\"checkbox\"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type=\"checkbox\"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:before {\n box-sizing: content-box;\n content: '';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n box-sizing: content-box;\n content: '';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:focus + label:before\n.pure-checkbox input[type=\"checkbox\"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type=\"checkbox\"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type=\"checkbox\"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n content: '';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type=\"radio\"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type=\"radio\"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type=\"checkbox\"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n", ""]);

@@ -553,3 +556,3 @@ // exports

module.exports = "<div class=\"cuppa-dropdown\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"selected-list\">\r\n <button class=\"c-btn\" (click)=\"toggleDropdown($event)\" [disabled]=\"settings.disabled\" [ngClass]=\"{'disabled': settings.disabled}\">\r\n <span *ngIf=\"selectedItems?.length == 0\">{{settings.text}}</span>\r\n <span *ngIf=\"settings.singleSelection\">\r\n <span *ngFor=\"let item of selectedItems;trackBy: trackByFn;\">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class=\"c-list\" *ngIf=\"selectedItems?.length > 0 && !settings.singleSelection\">\r\n <div class=\"c-token\" *ngFor=\"let item of selectedItems;trackBy: trackByFn;let k = index\" [hidden]=\"k > settings.badgeShowLimit-1\">\r\n <span class=\"c-label\">{{item.itemName}}</span>\r\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item)\" disabled=\"true\"></span>\r\n </div>\r\n </div> \r\n <span *ngIf=\"selectedItems?.length > settings.badgeShowLimit\">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class=\"fa\" [ngClass]=\"{'fa-angle-down': !isActive,'fa-angle-up':isActive}\"></span>\r\n </button> \r\n </div>\r\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\r\n <div class=\"arrow-up\"></div>\r\n <div class=\"list-area\">\r\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\r\n <input type=\"checkbox\" [checked]=\"isSelectAll\" [disabled]=\"settings.limitSelection == selectedItems?.length\"/>\r\n <label>\r\n <span [hidden]=\"isSelectAll\">{{settings.selectAllText}}</span>\r\n <span [hidden]=\"!isSelectAll\">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter\">\r\n <span class=\"fa fa-search\"></span>\r\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\r\n </div> \r\n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\r\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i)\" class=\"pure-checkbox\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>"
module.exports = "<div class=\"cuppa-dropdown\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"selected-list\">\r\n <div class=\"c-btn\" (click)=\"toggleDropdown($event)\" [ngClass]=\"{'disabled': settings.disabled}\">\r\n <span *ngIf=\"selectedItems?.length == 0\">{{settings.text}}</span>\r\n <span *ngIf=\"settings.singleSelection\">\r\n <span *ngFor=\"let item of selectedItems;trackBy: trackByFn;\">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class=\"c-list\" *ngIf=\"selectedItems?.length > 0 && !settings.singleSelection\">\r\n <div class=\"c-token\" *ngFor=\"let item of selectedItems;trackBy: trackByFn;let k = index\" [hidden]=\"k > settings.badgeShowLimit-1\">\r\n <span class=\"c-label\">{{item.itemName}}</span>\r\n <span class=\"fa fa-remove\" (click)=\"onItemClick(item,k,$event)\" disabled=\"true\"></span>\r\n </div>\r\n </div> \r\n <span *ngIf=\"selectedItems?.length > settings.badgeShowLimit\">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class=\"fa\" [ngClass]=\"{'fa-angle-down': !isActive,'fa-angle-up':isActive}\"></span>\r\n </div> \r\n </div>\r\n <div class=\"dropdown-list\" [hidden]=\"!isActive\">\r\n <div class=\"arrow-up\"></div>\r\n <div class=\"list-area\">\r\n <div class=\"pure-checkbox select-all\" *ngIf=\"settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection\" (click)=\"toggleSelectAll()\">\r\n <input type=\"checkbox\" [checked]=\"isSelectAll\" [disabled]=\"settings.limitSelection == selectedItems?.length\"/>\r\n <label>\r\n <span [hidden]=\"isSelectAll\">{{settings.selectAllText}}</span>\r\n <span [hidden]=\"!isSelectAll\">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class=\"list-filter\" *ngIf=\"settings.enableSearchFilter\">\r\n <span class=\"fa fa-search\"></span>\r\n <input type=\"text\" [placeholder]=\"settings.searchPlaceholderText\" [(ngModel)]=\"filter.itemName\">\r\n </div> \r\n <ul [style.maxHeight] = \"settings.maxHeight+'px'\">\r\n <li *ngFor=\"let item of data | listFilter:filter; let i = index;\" (click)=\"onItemClick(item,i,$event)\" class=\"pure-checkbox\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(item)\" [disabled]=\"settings.limitSelection == selectedItems?.length && !isSelected(item)\"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class=\"list-message\" *ngIf=\"data?.length == 0\">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>"

@@ -556,0 +559,0 @@ /***/ }),

4

index.umd.min.js
/**
* angular2-multiselect-dropdown - undefined
* @version v1.2.5
* @version v1.2.6
* @author undefined

@@ -8,3 +8,3 @@ * @link undefined

*/
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):"function"==typeof define&&define.amd?define(["@angular/core","@angular/common","@angular/forms"],t):"object"==typeof exports?exports.ticktock=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):e.ticktock=t(e.ng.core,e.ng.common,e.ng.forms)}(this,function(e,t,n){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=12)}([function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=n(10),r=n(9),c=n(4),a=n(2),d=n(3);t.DROPDOWN_CONTROL_VALUE_ACCESSOR={provide:s.NG_VALUE_ACCESSOR,useExisting:l.forwardRef(function(){return u}),multi:!0};var p=function(){},u=function(){function e(){this.onSelect=new l.EventEmitter,this.onDeSelect=new l.EventEmitter,this.onSelectAll=new l.EventEmitter,this.onDeSelectAll=new l.EventEmitter,this.isActive=!1,this.isSelectAll=!1,this.filter=new c.ListItem,this.defaultSettings={singleSelection:!1,text:"Select",enableCheckAll:!0,selectAllText:"Select All",unSelectAllText:"UnSelect All",enableSearchFilter:!1,maxHeight:300,badgeShowLimit:999999999999,classes:"",disabled:!1,searchPlaceholderText:"Search"},this.onTouchedCallback=p,this.onChangeCallback=p}return e.prototype.ngOnInit=function(){this.settings=Object.assign(this.defaultSettings,this.settings)},e.prototype.ngDoCheck=function(){this.selectedItems&&(0==this.selectedItems.length||0==this.data.length||this.selectedItems.length<this.data.length)&&(this.isSelectAll=!1)},e.prototype.onItemClick=function(e,t){if(this.settings.disabled)return!1;var n=this.isSelected(e),i=this.selectedItems.length<this.settings.limitSelection;n?(this.removeSelected(e),this.onDeSelect.emit(e)):this.settings.limitSelection?i&&(this.addSelected(e),this.onSelect.emit(e)):(this.addSelected(e),this.onSelect.emit(e)),(this.isSelectAll||this.data.length>this.selectedItems.length)&&(this.isSelectAll=!1),this.data.length==this.selectedItems.length&&(this.isSelectAll=!0)},e.prototype.writeValue=function(e){if(void 0!==e&&null!==e)if(this.settings.singleSelection)try{if(e.length>1)throw this.selectedItems=[e[0]],new c.MyException(404,{msg:"Single Selection Mode, Selected Items cannot have more than one item."});this.selectedItems=e}catch(e){console.error(e.body.msg)}else this.settings.limitSelection?this.selectedItems=e.splice(0,this.settings.limitSelection):this.selectedItems=e,this.selectedItems.length===this.data.length&&this.data.length>0&&(this.isSelectAll=!0);else this.selectedItems=[]},e.prototype.registerOnChange=function(e){this.onChangeCallback=e},e.prototype.registerOnTouched=function(e){this.onTouchedCallback=e},e.prototype.trackByFn=function(e,t){return t.id},e.prototype.isSelected=function(e){var t=!1;return this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&(t=!0)}),t},e.prototype.addSelected=function(e){this.settings.singleSelection?(this.selectedItems=[],this.selectedItems.push(e)):this.selectedItems.push(e),this.onChangeCallback(this.selectedItems)},e.prototype.removeSelected=function(e){var t=this;this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&t.selectedItems.splice(t.selectedItems.indexOf(n),1)}),this.onChangeCallback(this.selectedItems)},e.prototype.toggleDropdown=function(e){this.isActive=!this.isActive,e.preventDefault()},e.prototype.closeDropdown=function(){this.isActive=!1},e.prototype.toggleSelectAll=function(){this.isSelectAll?(this.selectedItems=[],this.isSelectAll=!1,this.onChangeCallback(this.selectedItems),this.onDeSelectAll.emit(this.selectedItems)):(this.selectedItems=[],this.selectedItems=this.data.slice(),this.isSelectAll=!0,this.onChangeCallback(this.selectedItems),this.onSelectAll.emit(this.selectedItems))},i([l.Input(),o("design:type",Array)],e.prototype,"data",void 0),i([l.Input(),o("design:type",Object)],e.prototype,"settings",void 0),i([l.Output("onSelect"),o("design:type",l.EventEmitter)],e.prototype,"onSelect",void 0),i([l.Output("onDeSelect"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelect",void 0),i([l.Output("onSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onSelectAll",void 0),i([l.Output("onDeSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelectAll",void 0),e=i([l.Component({selector:"angular2-multiselect",template:n(7),host:{"[class]":"defaultSettings.classes"},styles:[n(8)],providers:[t.DROPDOWN_CONTROL_VALUE_ACCESSOR]}),o("design:paramtypes",[])],e)}();t.AngularMultiSelect=u;var f=function(){function e(){}return e=i([l.NgModule({imports:[r.CommonModule,s.FormsModule],declarations:[u,a.ClickOutsideDirective,d.ListFilterPipe],exports:[u,a.ClickOutsideDirective,d.ListFilterPipe]})],e)}();t.AngularMultiSelectModule=f},function(t,n){t.exports=e},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=function(){function e(e){this._elementRef=e,this.clickOutside=new l.EventEmitter}return e.prototype.onClick=function(e,t){if(t){this._elementRef.nativeElement.contains(t)||this.clickOutside.emit(e)}},i([l.Output(),o("design:type",Object)],e.prototype,"clickOutside",void 0),i([l.HostListener("document:click",["$event","$event.target"]),o("design:type",Function),o("design:paramtypes",[MouseEvent,HTMLElement]),o("design:returntype",void 0)],e.prototype,"onClick",null),e=i([l.Directive({selector:"[clickOutside]"}),o("design:paramtypes",[l.ElementRef])],e)}();t.ClickOutsideDirective=s},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s};Object.defineProperty(t,"__esModule",{value:!0});var o=n(1),l=function(){function e(){}return e.prototype.transform=function(e,t){var n=this;return e&&t?e.filter(function(e){return n.applyFilter(e,t)}):e},e.prototype.applyFilter=function(e,t){return!(t.itemName&&e.itemName&&-1===e.itemName.toLowerCase().indexOf(t.itemName.toLowerCase()))},e=i([o.Pipe({name:"listFilter",pure:!1})],e)}();t.ListFilterPipe=l},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(){}return e}();t.ListItem=i;var o=function(){function e(e,t){this.status=e,this.body=t}return e}();t.MyException=o},function(e,t,n){t=e.exports=n(6)(void 0),t.push([e.i,'.cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list button {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type="checkbox"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type="checkbox"]:focus + label:before,\n.pure-checkbox input[type="checkbox"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type="checkbox"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type="checkbox"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type="checkbox"] + label:before {\n box-sizing: content-box;\n content: \'\';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n box-sizing: content-box;\n content: \'\';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="checkbox"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"]:disabled:focus + label:before\n.pure-checkbox input[type="checkbox"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type="checkbox"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n content: \'\';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="radio"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type="radio"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type="radio"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n',""])},function(e,t){function n(e,t){var n=e[1]||"",o=e[3];if(!o)return n;if(t&&"function"==typeof btoa){var l=i(o);return[n].concat(o.sources.map(function(e){return"/*# sourceURL="+o.sourceRoot+e+" */"})).concat([l]).join("\n")}return[n].join("\n")}function i(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var i=n(t,e);return t[2]?"@media "+t[2]+"{"+i+"}":i}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var i={},o=0;o<this.length;o++){var l=this[o][0];"number"==typeof l&&(i[l]=!0)}for(o=0;o<e.length;o++){var s=e[o];"number"==typeof s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),t.push(s))}},t}},function(e,t){e.exports='<div class="cuppa-dropdown" (clickOutside)="closeDropdown()">\r\n <div class="selected-list">\r\n <button class="c-btn" (click)="toggleDropdown($event)" [disabled]="settings.disabled" [ngClass]="{\'disabled\': settings.disabled}">\r\n <span *ngIf="selectedItems?.length == 0">{{settings.text}}</span>\r\n <span *ngIf="settings.singleSelection">\r\n <span *ngFor="let item of selectedItems;trackBy: trackByFn;">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class="c-list" *ngIf="selectedItems?.length > 0 && !settings.singleSelection">\r\n <div class="c-token" *ngFor="let item of selectedItems;trackBy: trackByFn;let k = index" [hidden]="k > settings.badgeShowLimit-1">\r\n <span class="c-label">{{item.itemName}}</span>\r\n <span class="fa fa-remove" (click)="onItemClick(item)" disabled="true"></span>\r\n </div>\r\n </div> \r\n <span *ngIf="selectedItems?.length > settings.badgeShowLimit">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class="fa" [ngClass]="{\'fa-angle-down\': !isActive,\'fa-angle-up\':isActive}"></span>\r\n </button> \r\n </div>\r\n <div class="dropdown-list" [hidden]="!isActive">\r\n <div class="arrow-up"></div>\r\n <div class="list-area">\r\n <div class="pure-checkbox select-all" *ngIf="settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection" (click)="toggleSelectAll()">\r\n <input type="checkbox" [checked]="isSelectAll" [disabled]="settings.limitSelection == selectedItems?.length"/>\r\n <label>\r\n <span [hidden]="isSelectAll">{{settings.selectAllText}}</span>\r\n <span [hidden]="!isSelectAll">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class="list-filter" *ngIf="settings.enableSearchFilter">\r\n <span class="fa fa-search"></span>\r\n <input type="text" [placeholder]="settings.searchPlaceholderText" [(ngModel)]="filter.itemName">\r\n </div> \r\n <ul [style.maxHeight] = "settings.maxHeight+\'px\'">\r\n <li *ngFor="let item of data | listFilter:filter; let i = index;" (click)="onItemClick(item,i)" class="pure-checkbox">\r\n <input type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class="list-message" *ngIf="data?.length == 0">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>'},function(e,t,n){var i=n(5);e.exports="string"==typeof i?i:i.toString()},function(e,n){e.exports=t},function(e,t){e.exports=n},,function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(0);t.AngularMultiSelect=i.AngularMultiSelect;var o=n(2);t.ClickOutsideDirective=o.ClickOutsideDirective;var l=n(3);t.ListFilterPipe=l.ListFilterPipe;var s=n(0);t.AngularMultiSelectModule=s.AngularMultiSelectModule}])});
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):"function"==typeof define&&define.amd?define(["@angular/core","@angular/common","@angular/forms"],t):"object"==typeof exports?exports.ticktock=t(require("@angular/core"),require("@angular/common"),require("@angular/forms")):e.ticktock=t(e.ng.core,e.ng.common,e.ng.forms)}(this,function(e,t,n){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=12)}([function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=n(10),r=n(9),c=n(4),a=n(2),d=n(3);t.DROPDOWN_CONTROL_VALUE_ACCESSOR={provide:s.NG_VALUE_ACCESSOR,useExisting:l.forwardRef(function(){return u}),multi:!0};var p=function(){},u=function(){function e(){this.onSelect=new l.EventEmitter,this.onDeSelect=new l.EventEmitter,this.onSelectAll=new l.EventEmitter,this.onDeSelectAll=new l.EventEmitter,this.isActive=!1,this.isSelectAll=!1,this.filter=new c.ListItem,this.defaultSettings={singleSelection:!1,text:"Select",enableCheckAll:!0,selectAllText:"Select All",unSelectAllText:"UnSelect All",enableSearchFilter:!1,maxHeight:300,badgeShowLimit:999999999999,classes:"",disabled:!1,searchPlaceholderText:"Search"},this.onTouchedCallback=p,this.onChangeCallback=p}return e.prototype.ngOnInit=function(){this.settings=Object.assign(this.defaultSettings,this.settings)},e.prototype.ngDoCheck=function(){this.selectedItems&&(0==this.selectedItems.length||0==this.data.length||this.selectedItems.length<this.data.length)&&(this.isSelectAll=!1)},e.prototype.onItemClick=function(e,t,n){if(this.settings.disabled)return!1;var i=this.isSelected(e),o=this.selectedItems.length<this.settings.limitSelection;i?(this.removeSelected(e),this.onDeSelect.emit(e)):this.settings.limitSelection?o&&(this.addSelected(e),this.onSelect.emit(e)):(this.addSelected(e),this.onSelect.emit(e)),(this.isSelectAll||this.data.length>this.selectedItems.length)&&(this.isSelectAll=!1),this.data.length==this.selectedItems.length&&(this.isSelectAll=!0)},e.prototype.writeValue=function(e){if(void 0!==e&&null!==e)if(this.settings.singleSelection)try{if(e.length>1)throw this.selectedItems=[e[0]],new c.MyException(404,{msg:"Single Selection Mode, Selected Items cannot have more than one item."});this.selectedItems=e}catch(e){console.error(e.body.msg)}else this.settings.limitSelection?this.selectedItems=e.splice(0,this.settings.limitSelection):this.selectedItems=e,this.selectedItems.length===this.data.length&&this.data.length>0&&(this.isSelectAll=!0);else this.selectedItems=[]},e.prototype.registerOnChange=function(e){this.onChangeCallback=e},e.prototype.registerOnTouched=function(e){this.onTouchedCallback=e},e.prototype.trackByFn=function(e,t){return t.id},e.prototype.isSelected=function(e){var t=!1;return this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&(t=!0)}),t},e.prototype.addSelected=function(e){this.settings.singleSelection?(this.selectedItems=[],this.selectedItems.push(e)):this.selectedItems.push(e),this.onChangeCallback(this.selectedItems)},e.prototype.removeSelected=function(e){var t=this;this.selectedItems&&this.selectedItems.forEach(function(n){e.id===n.id&&t.selectedItems.splice(t.selectedItems.indexOf(n),1)}),this.onChangeCallback(this.selectedItems)},e.prototype.toggleDropdown=function(e){if(this.settings.disabled)return!1;this.isActive=!this.isActive,e.preventDefault()},e.prototype.closeDropdown=function(){this.isActive=!1},e.prototype.toggleSelectAll=function(){this.isSelectAll?(this.selectedItems=[],this.isSelectAll=!1,this.onChangeCallback(this.selectedItems),this.onDeSelectAll.emit(this.selectedItems)):(this.selectedItems=[],this.selectedItems=this.data.slice(),this.isSelectAll=!0,this.onChangeCallback(this.selectedItems),this.onSelectAll.emit(this.selectedItems))},i([l.Input(),o("design:type",Array)],e.prototype,"data",void 0),i([l.Input(),o("design:type",Object)],e.prototype,"settings",void 0),i([l.Output("onSelect"),o("design:type",l.EventEmitter)],e.prototype,"onSelect",void 0),i([l.Output("onDeSelect"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelect",void 0),i([l.Output("onSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onSelectAll",void 0),i([l.Output("onDeSelectAll"),o("design:type",l.EventEmitter)],e.prototype,"onDeSelectAll",void 0),e=i([l.Component({selector:"angular2-multiselect",template:n(7),host:{"[class]":"defaultSettings.classes"},styles:[n(8)],providers:[t.DROPDOWN_CONTROL_VALUE_ACCESSOR]}),o("design:paramtypes",[])],e)}();t.AngularMultiSelect=u;var f=function(){function e(){}return e=i([l.NgModule({imports:[r.CommonModule,s.FormsModule],declarations:[u,a.ClickOutsideDirective,d.ListFilterPipe],exports:[u,a.ClickOutsideDirective,d.ListFilterPipe]})],e)}();t.AngularMultiSelectModule=f},function(t,n){t.exports=e},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s},o=this&&this.__metadata||function(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(1),s=function(){function e(e){this._elementRef=e,this.clickOutside=new l.EventEmitter}return e.prototype.onClick=function(e,t){if(t){this._elementRef.nativeElement.contains(t)||this.clickOutside.emit(e)}},i([l.Output(),o("design:type",Object)],e.prototype,"clickOutside",void 0),i([l.HostListener("document:click",["$event","$event.target"]),o("design:type",Function),o("design:paramtypes",[MouseEvent,HTMLElement]),o("design:returntype",void 0)],e.prototype,"onClick",null),e=i([l.Directive({selector:"[clickOutside]"}),o("design:paramtypes",[l.ElementRef])],e)}();t.ClickOutsideDirective=s},function(e,t,n){"use strict";var i=this&&this.__decorate||function(e,t,n,i){var o,l=arguments.length,s=l<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(s=(l<3?o(s):l>3?o(t,n,s):o(t,n))||s);return l>3&&s&&Object.defineProperty(t,n,s),s};Object.defineProperty(t,"__esModule",{value:!0});var o=n(1),l=function(){function e(){}return e.prototype.transform=function(e,t){var n=this;return e&&t?e.filter(function(e){return n.applyFilter(e,t)}):e},e.prototype.applyFilter=function(e,t){return!(t.itemName&&e.itemName&&-1===e.itemName.toLowerCase().indexOf(t.itemName.toLowerCase()))},e=i([o.Pipe({name:"listFilter",pure:!1})],e)}();t.ListFilterPipe=l},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(){}return e}();t.ListItem=i;var o=function(){function e(e,t){this.status=e,this.body=t}return e}();t.MyException=o},function(e,t,n){t=e.exports=n(6)(void 0),t.push([e.i,'.cuppa-dropdown {\n position: relative; }\n\n.c-btn {\n display: inline-block;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 14px;\n color: #333; }\n\n.c-btn.disabled {\n background: #ccc; }\n\n.c-btn:focus {\n outline: none; }\n\n.selected-list .c-list {\n float: left;\n padding: 0px;\n margin: 0px; }\n .selected-list .c-list .c-token {\n list-style: none;\n padding: 0px 5px;\n background: #0079FE;\n color: #fff;\n border-radius: 2px;\n margin-right: 4px;\n float: left; }\n .selected-list .c-list .c-token .c-label {\n display: block;\n float: left;\n /*width: 50px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;*/ }\n .selected-list .c-list .c-token .fa-remove {\n margin-left: 1px;\n font-size: 12px;\n z-index: 100000000; }\n\n.selected-list .fa-angle-down, .selected-list .fa-angle-up {\n font-size: 15pt;\n position: absolute;\n right: 10px;\n top: 25%; }\n\n.selected-list .c-btn {\n width: 100%;\n box-shadow: 0px 1px 5px #959595;\n padding: 10px;\n cursor: pointer; }\n\n.dropdown-list {\n position: absolute;\n padding-top: 14px;\n width: 100%;\n z-index: 9999; }\n .dropdown-list ul {\n padding: 0px;\n list-style: none;\n overflow: auto;\n margin: 0px; }\n .dropdown-list ul li {\n padding: 10px 10px;\n cursor: pointer;\n text-align: left; }\n .dropdown-list ul li:first-child {\n padding-top: 10px; }\n .dropdown-list ul li:last-child {\n padding-bottom: 10px; }\n .dropdown-list ul li:hover {\n background: #f5f5f5; }\n .dropdown-list ul::-webkit-scrollbar {\n width: 8px; }\n .dropdown-list ul::-webkit-scrollbar-thumb {\n background: #cccccc;\n border-radius: 5px; }\n .dropdown-list ul::-webkit-scrollbar-track {\n background: #f2f2f2; }\n\n.arrow-up {\n width: 0;\n height: 0;\n border-left: 13px solid transparent;\n border-right: 13px solid transparent;\n border-bottom: 15px solid #fff;\n margin-left: 15px;\n position: absolute;\n top: 0; }\n\n.list-area {\n border: 1px solid #ccc;\n border-radius: 3px;\n background: #fff;\n margin: 0px;\n box-shadow: 0px 1px 5px #959595; }\n\n.select-all {\n padding: 10px;\n border-bottom: 1px solid #ccc;\n text-align: left; }\n\n.list-filter {\n border-bottom: 1px solid #ccc;\n position: relative; }\n .list-filter input {\n border: 0px;\n width: 100%;\n height: 35px;\n padding: 0px 0px 0px 35px; }\n .list-filter input:focus {\n outline: none; }\n .list-filter .fa {\n position: absolute;\n top: 10px;\n left: 13px;\n color: #888; }\n\n.pure-checkbox input[type="checkbox"] {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px; }\n\n.pure-checkbox input[type="checkbox"]:focus + label:before,\n.pure-checkbox input[type="checkbox"]:hover + label:before {\n border-color: #0079FE;\n background-color: #f2f2f2; }\n\n.pure-checkbox input[type="checkbox"]:active + label:before {\n transition-duration: 0s; }\n\n.pure-checkbox input[type="checkbox"] + label {\n position: relative;\n padding-left: 2em;\n vertical-align: middle;\n user-select: none;\n cursor: pointer;\n margin: 0px;\n color: #000; }\n\n.pure-checkbox input[type="checkbox"] + label:before {\n box-sizing: content-box;\n content: \'\';\n color: #0079FE;\n position: absolute;\n top: 50%;\n left: 0;\n width: 14px;\n height: 14px;\n margin-top: -9px;\n border: 2px solid #0079FE;\n text-align: center;\n transition: all 0.4s ease; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n box-sizing: content-box;\n content: \'\';\n background-color: #0079FE;\n position: absolute;\n top: 50%;\n left: 4px;\n width: 10px;\n height: 10px;\n margin-top: -5px;\n transform: scale(0);\n transform-origin: 50%;\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="checkbox"]:disabled + label:before {\n border-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"]:disabled:focus + label:before\n.pure-checkbox input[type="checkbox"]:disabled:hover + label:before {\n background-color: inherit; }\n\n.pure-checkbox input[type="checkbox"]:disabled:checked + label:before {\n background-color: #cccccc; }\n\n.pure-checkbox input[type="checkbox"] + label:after {\n background-color: transparent;\n top: 50%;\n left: 4px;\n width: 8px;\n height: 3px;\n margin-top: -4px;\n border-style: solid;\n border-color: #ffffff;\n border-width: 0 0 3px 3px;\n border-image: none;\n transform: rotate(-45deg) scale(0); }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n content: \'\';\n transform: rotate(-45deg) scale(1);\n transition: transform 200ms ease-out; }\n\n.pure-checkbox input[type="radio"]:checked + label:before {\n animation: borderscale 300ms ease-in;\n background-color: white; }\n\n.pure-checkbox input[type="radio"]:checked + label:after {\n transform: scale(1); }\n\n.pure-checkbox input[type="radio"] + label:before {\n border-radius: 50%; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:before {\n animation: borderscale 200ms ease-in;\n background: #0079FE; }\n\n.pure-checkbox input[type="checkbox"]:checked + label:after {\n transform: rotate(-45deg) scale(1); }\n\n@keyframes borderscale {\n 50% {\n box-shadow: 0 0 0 2px #0079FE; } }\n\n.list-message {\n text-align: center; }\n',""])},function(e,t){function n(e,t){var n=e[1]||"",o=e[3];if(!o)return n;if(t&&"function"==typeof btoa){var l=i(o);return[n].concat(o.sources.map(function(e){return"/*# sourceURL="+o.sourceRoot+e+" */"})).concat([l]).join("\n")}return[n].join("\n")}function i(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var i=n(t,e);return t[2]?"@media "+t[2]+"{"+i+"}":i}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var i={},o=0;o<this.length;o++){var l=this[o][0];"number"==typeof l&&(i[l]=!0)}for(o=0;o<e.length;o++){var s=e[o];"number"==typeof s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),t.push(s))}},t}},function(e,t){e.exports='<div class="cuppa-dropdown" (clickOutside)="closeDropdown()">\r\n <div class="selected-list">\r\n <div class="c-btn" (click)="toggleDropdown($event)" [ngClass]="{\'disabled\': settings.disabled}">\r\n <span *ngIf="selectedItems?.length == 0">{{settings.text}}</span>\r\n <span *ngIf="settings.singleSelection">\r\n <span *ngFor="let item of selectedItems;trackBy: trackByFn;">\r\n {{item.itemName}}\r\n </span>\r\n </span>\r\n <div class="c-list" *ngIf="selectedItems?.length > 0 && !settings.singleSelection">\r\n <div class="c-token" *ngFor="let item of selectedItems;trackBy: trackByFn;let k = index" [hidden]="k > settings.badgeShowLimit-1">\r\n <span class="c-label">{{item.itemName}}</span>\r\n <span class="fa fa-remove" (click)="onItemClick(item,k,$event)" disabled="true"></span>\r\n </div>\r\n </div> \r\n <span *ngIf="selectedItems?.length > settings.badgeShowLimit">+{{selectedItems?.length - settings.badgeShowLimit }}</span>\r\n <span class="fa" [ngClass]="{\'fa-angle-down\': !isActive,\'fa-angle-up\':isActive}"></span>\r\n </div> \r\n </div>\r\n <div class="dropdown-list" [hidden]="!isActive">\r\n <div class="arrow-up"></div>\r\n <div class="list-area">\r\n <div class="pure-checkbox select-all" *ngIf="settings.enableCheckAll && !settings.singleSelection && !settings.limitSelection" (click)="toggleSelectAll()">\r\n <input type="checkbox" [checked]="isSelectAll" [disabled]="settings.limitSelection == selectedItems?.length"/>\r\n <label>\r\n <span [hidden]="isSelectAll">{{settings.selectAllText}}</span>\r\n <span [hidden]="!isSelectAll">{{settings.unSelectAllText}}</span>\r\n </label>\r\n </div> \r\n <div class="list-filter" *ngIf="settings.enableSearchFilter">\r\n <span class="fa fa-search"></span>\r\n <input type="text" [placeholder]="settings.searchPlaceholderText" [(ngModel)]="filter.itemName">\r\n </div> \r\n <ul [style.maxHeight] = "settings.maxHeight+\'px\'">\r\n <li *ngFor="let item of data | listFilter:filter; let i = index;" (click)="onItemClick(item,i,$event)" class="pure-checkbox">\r\n <input type="checkbox" [checked]="isSelected(item)" [disabled]="settings.limitSelection == selectedItems?.length && !isSelected(item)"/>\r\n <label>{{item.itemName}}</label>\r\n </li>\r\n </ul>\r\n <h5 class="list-message" *ngIf="data?.length == 0">No Data Available</h5>\r\n </div>\r\n </div>\r\n</div>'},function(e,t,n){var i=n(5);e.exports="string"==typeof i?i:i.toString()},function(e,n){e.exports=t},function(e,t){e.exports=n},,function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(0);t.AngularMultiSelect=i.AngularMultiSelect;var o=n(2);t.ClickOutsideDirective=o.ClickOutsideDirective;var l=n(3);t.ListFilterPipe=l.ListFilterPipe;var s=n(0);t.AngularMultiSelectModule=s.AngularMultiSelectModule}])});
//# sourceMappingURL=index.umd.min.js.map

4

package.json
{
"name": "angular2-multiselect-dropdown",
"version": "1.2.5",
"version": "1.2.6",
"license": "MIT",

@@ -45,3 +45,3 @@ "angular-cli": {},

"@angular/compiler-cli": "^4.0.0",
"@angular/cli": "^1.2.0",
"@angular/cli": "^1.3.2",
"@angular/core": "^4.0.0",

@@ -48,0 +48,0 @@ "@angular/forms": "^4.0.0",

angular2-multiselect-dropdown.umd.js.map

Sorry, the diff of this file is not supported yet

angular2-multiselect-dropdown.umd.min.js.map

Sorry, the diff of this file is not supported yet

angular2-multiselect-dropdown/multiselect.component.js.map

Sorry, the diff of this file is not supported yet

index.umd.js.map

Sorry, the diff of this file is not supported yet

index.umd.min.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc