dual-pick-list-ng/dual-pick-list-ng.metadata.json

Dual pick list Component for Angular 2+

{"__symbolic":"module","version":3,"metadata":{"DualPickListModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"BrowserModule"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule"}],"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵc"}],"exports":[{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"}]}]}],"members":{}},"TypeSelectDualPickListModel":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null,null]}]}},"HeaderTypeButtonDualPickListModel":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null]}]}},"ItemDualPickListModel":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor"}]}},"HeaderTypeSelectDualPickListModel":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null]}]}},"HeaderDualPickListModel":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null,null,null,null,null,null]}]}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-pick-list","template":"\n    <div>\n      <label>{{textLabel ? textLabel: 'Not Selected'}}</label>\n      <div class=\"form-group input-icon-right\" style=\"margin-bottom: 0px\">\n        <i class=\"glyphicon glyphicon-search\"></i>\n        <input type=\"text\"\n               class=\"form-control\"\n               [(ngModel)]=\"filter\"\n               placeholder=\"{{placeHolder ? placeHolder :'Search'}}\">\n      </div>\n\n      <div class=\"btn-group buttons\">\n\n        <button *ngIf=\"position==='right'\" type=\"button\" class=\"btn moveall btn-default\" title=\"Move all\" (click)=\"moveAll()\"><i class=\"{{iconsDirection}}\"></i> <i class=\"{{iconsDirection}}\"></i></button>\n        <button *ngIf=\"position==='right'\" type=\"button\" class=\"btn move btn-default\" style=\"margin-left: 0\" title=\"Move selected\" (click)=\"moveJustSelected()\"><i class=\"{{iconsDirection}}\"></i></button>\n\n        <button *ngIf=\"position==='left'\" type=\"button\" class=\"btn move btn-default\" style=\"margin-left: 0\" title=\"Move selected\" (click)=\"moveJustSelected()\"><i class=\"{{iconsDirection}}\"></i></button>\n        <button *ngIf=\"position==='left'\" type=\"button\" class=\"btn moveall btn-default\" title=\"Move all\" (click)=\"moveAll()\"><i class=\"{{iconsDirection}}\"></i> <i class=\"{{iconsDirection}}\"></i></button>\n\n      </div>\n\n      <div style=\"overflow: scroll; height: 192px\" >\n        <table class=\"table table-bordered\" >\n          <thead>\n          <tr>\n            <th *ngFor=\"let h of header\" class=\"text-left\" (click)=\"setFilterBy(h.key)\" [ngClass]=\"{'filter-by': filterBy === h.key}\">{{h.text}}</th>\n          </tr>\n          </thead>\n          <tbody class=\"text-left\">\n          <tr *ngFor=\"let itemList of items | searchfilterDualPickList : filterBy : filter\" (click)=\"itemList.isSelected = !itemList.isSelected\" [ngClass]=\"{'dl-selected':itemList.isSelected}\">\n            <td *ngFor=\"let l of header |  searchfilterDualPickList : 'hidden' : false \" class=\"text-left\">\n              <span *ngIf=\"!l.custom\">{{itemList[l.key]}}</span>\n              <select *ngIf=\"l.select\" class=\"form-control\" name=\"{{'selectLeft'+'-'+index}}\" id=\"selectLeft+'-'+index\" [(ngModel)]=\"itemList[l.key]\" style=\"height: inherit;\" (ngChange)=\"transact()\">\n                <option *ngFor=\"let item of l.select.list\" value=\"{{item.id}}\">{{item.text}}</option>\n              </select>\n              <input *ngIf=\"l.checkbox\" type=\"checkbox\" [(ngModel)]=\"itemList[l.key]\" (change)=\"transact()\">\n              <button *ngIf=\"l.button\" class=\"btn btn-default\" (click)=\"l.button.onClick(itemList)\">{{l.text}}</button>\n            </td>\n          </tr>\n          </tbody>\n        </table>\n      </div>\n\n    </div>\n  ","styles":["\n    .dl-selected{\n      background: #efefef !important;\n    }\n\n    .filter-by{\n      background: #eee !important;\n    }\n  "]}]}],"members":{"textLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"list":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"placeHolder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"headerConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"position":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onTransaction":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"moveAll":[{"__symbolic":"method"}],"moveJustSelected":[{"__symbolic":"method"}],"setFilterBy":[{"__symbolic":"method"}],"transact":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe"},"arguments":[{"name":"searchfilterDualPickList"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"transform":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-dual-pick-list","template":"\n      <div class=\"bootstrap-duallistbox-container\">\n          <div class=\"col-md-6\">\n              <app-pick-list [position]=\"'right'\" [textLabel]=\"textKeyLeftList\" [list]=\"itemsLeft\" [placeHolder]=\"placeHolder\" [headerConfig]=\"headerLeft\" (onTransaction)=\"getTransactionFromLeft($event)\"></app-pick-list>\n          </div>\n          <div class=\"box2 col-md-6\">\n              <app-pick-list [position]=\"'left'\" [textLabel]=\"textKeyRightList\" [list]=\"itemsRight\" [placeHolder]=\"placeHolder\" [headerConfig]=\"headerRight\" (onTransaction)=\"getTransactionFromRight($event)\"></app-pick-list>\n          </div>\n\n      </div>\n    ","styles":["\n\n    "]}]}],"members":{"textKeyLeftList":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"textKeyRightList":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"list":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"placeHolder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"headerConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onTransaction":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"getTransactionFromLeft":[{"__symbolic":"method"}],"getTransactionFromRight":[{"__symbolic":"method"}]}}},"origins":{"DualPickListModule":"./src/dual-pick-list.module","TypeSelectDualPickListModel":"./src/model/TypeSelectDualPickList.model","HeaderTypeButtonDualPickListModel":"./src/model/HeaderTypeButtonDualPickList.model","ItemDualPickListModel":"./src/model/ItemDualPickList.model","HeaderTypeSelectDualPickListModel":"./src/model/HeaderTypeSelectDualPickList.model","HeaderDualPickListModel":"./src/model/HeaderDualPickList.model","ɵa":"./src/pick-list.component","ɵb":"./src/pipe/dual-pick-list.pipe","ɵc":"./src/dual-pick-list.component"},"importAs":"dual-pick-list-ng"}