primeng/bundles/primeng-orderlist.umd.min.js

[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primeng) [![Discord](https://img.shields.io/discord/557940238991753

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("primeng/button"),require("primeng/api"),require("primeng/dom"),require("primeng/utils"),require("primeng/ripple")):"function"==typeof define&&define.amd?define("primeng/orderlist",["exports","@angular/core","@angular/common","primeng/button","primeng/api","primeng/dom","primeng/utils","primeng/ripple"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).primeng=e.primeng||{},e.primeng.orderlist={}),e.ng.core,e.ng.common,e.primeng.button,e.primeng.api,e.primeng.dom,e.primeng.utils,e.primeng.ripple)}(this,(function(e,t,i,n,r,o,l,s){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */Object.create;function a(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,r,o=i.call(e),l=[];try{for(;(void 0===t||t-- >0)&&!(n=o.next()).done;)l.push(n.value)}catch(e){r={error:e}}finally{try{n&&!n.done&&(i=o.return)&&i.call(o)}finally{if(r)throw r.error}}return l}function p(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(a(arguments[t]));return e}Object.create;var d=function(){function e(e,i,n){this.el=e,this.cd=i,this.filterService=n,this.metaKeySelection=!0,this.controlsPosition="left",this.filterMatchMode="contains",this.selectionChange=new t.EventEmitter,this.trackBy=function(e,t){return t},this.onReorder=new t.EventEmitter,this.onSelectionChange=new t.EventEmitter,this.onFilterEvent=new t.EventEmitter}return Object.defineProperty(e.prototype,"selection",{get:function(){return this._selection},set:function(e){this._selection=e},enumerable:!1,configurable:!0}),e.prototype.ngAfterContentInit=function(){var e=this;this.templates.forEach((function(t){switch(t.getType()){case"item":default:e.itemTemplate=t.template}}))},e.prototype.ngAfterViewChecked=function(){if(this.movedUp||this.movedDown){var e=o.DomHandler.find(this.listViewChild.nativeElement,"li.p-highlight"),t=void 0;e.length>0&&(t=this.movedUp?e[0]:e[e.length-1],o.DomHandler.scrollInView(this.listViewChild.nativeElement,t)),this.movedUp=!1,this.movedDown=!1}},Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(e){this._value=e,this.filterValue&&this.filter()},enumerable:!1,configurable:!0}),e.prototype.onItemClick=function(e,t,i){this.itemTouched=!1;var n=l.ObjectUtils.findIndexInList(t,this.selection),r=-1!=n;if(!this.itemTouched&&this.metaKeySelection){var o=e.metaKey||e.ctrlKey||e.shiftKey;r&&o?this._selection=this._selection.filter((function(e,t){return t!==n})):(this._selection=o&&this._selection?p(this._selection):[],l.ObjectUtils.insertIntoOrderedArray(t,i,this._selection,this.value))}else r?this._selection=this._selection.filter((function(e,t){return t!==n})):(this._selection=this._selection?p(this._selection):[],l.ObjectUtils.insertIntoOrderedArray(t,i,this._selection,this.value));this.selectionChange.emit(this._selection),this.onSelectionChange.emit({originalEvent:e,value:this._selection})},e.prototype.onFilterKeyup=function(e){this.filterValue=e.target.value.trim().toLocaleLowerCase(this.filterLocale),this.filter(),this.onFilterEvent.emit({originalEvent:e,value:this.visibleOptions})},e.prototype.filter=function(){var e=this.filterBy.split(",");this.visibleOptions=this.filterService.filter(this.value,e,this.filterValue,this.filterMatchMode,this.filterLocale)},e.prototype.isItemVisible=function(e){if(!this.filterValue||!this.filterValue.trim().length)return!0;for(var t=0;t<this.visibleOptions.length;t++)if(e==this.visibleOptions[t])return!0},e.prototype.onItemTouchEnd=function(e){this.itemTouched=!0},e.prototype.isSelected=function(e){return-1!=l.ObjectUtils.findIndexInList(e,this.selection)},e.prototype.moveUp=function(e){if(this.selection){for(var t=0;t<this.selection.length;t++){var i=this.selection[t],n=l.ObjectUtils.findIndexInList(i,this.value);if(0==n)break;var r=this.value[n],o=this.value[n-1];this.value[n-1]=r,this.value[n]=o}this.movedUp=!0,this.onReorder.emit(e)}},e.prototype.moveTop=function(e){if(this.selection){for(var t=this.selection.length-1;t>=0;t--){var i=this.selection[t],n=l.ObjectUtils.findIndexInList(i,this.value);if(0==n)break;var r=this.value.splice(n,1)[0];this.value.unshift(r)}this.onReorder.emit(e),this.listViewChild.nativeElement.scrollTop=0}},e.prototype.moveDown=function(e){if(this.selection){for(var t=this.selection.length-1;t>=0;t--){var i=this.selection[t],n=l.ObjectUtils.findIndexInList(i,this.value);if(n==this.value.length-1)break;var r=this.value[n],o=this.value[n+1];this.value[n+1]=r,this.value[n]=o}this.movedDown=!0,this.onReorder.emit(e)}},e.prototype.moveBottom=function(e){if(this.selection){for(var t=0;t<this.selection.length;t++){var i=this.selection[t],n=l.ObjectUtils.findIndexInList(i,this.value);if(n==this.value.length-1)break;var r=this.value.splice(n,1)[0];this.value.push(r)}this.onReorder.emit(e),this.listViewChild.nativeElement.scrollTop=this.listViewChild.nativeElement.scrollHeight}},e.prototype.onDragStart=function(e,t){e.dataTransfer.setData("text","b"),e.target.blur(),this.dragging=!0,this.draggedItemIndex=t},e.prototype.onDragOver=function(e,t){this.dragging&&this.draggedItemIndex!==t&&this.draggedItemIndex+1!==t&&(this.dragOverItemIndex=t,e.preventDefault())},e.prototype.onDragLeave=function(e){this.dragOverItemIndex=null},e.prototype.onDrop=function(e,t){var i=this.draggedItemIndex>t?t:0===t?0:t-1;l.ObjectUtils.reorderArray(this.value,this.draggedItemIndex,i),this.dragOverItemIndex=null,this.onReorder.emit(e),e.preventDefault()},e.prototype.onDragEnd=function(e){this.dragging=!1},e.prototype.onListMouseMove=function(e){if(this.dragging){var t=this.listViewChild.nativeElement.getBoundingClientRect().top+document.body.scrollTop,i=t+this.listViewChild.nativeElement.clientHeight-e.pageY,n=e.pageY-t;i<25&&i>0?this.listViewChild.nativeElement.scrollTop+=15:n<25&&n>0&&(this.listViewChild.nativeElement.scrollTop-=15)}},e.prototype.onItemKeydown=function(e,t,i){var n=e.currentTarget;switch(e.which){case 40:var r=this.findNextItem(n);r&&r.focus(),e.preventDefault();break;case 38:var o=this.findPrevItem(n);o&&o.focus(),e.preventDefault();break;case 13:this.onItemClick(e,t,i),e.preventDefault()}},e.prototype.findNextItem=function(e){var t=e.nextElementSibling;return t?!o.DomHandler.hasClass(t,"p-orderlist-item")||o.DomHandler.isHidden(t)?this.findNextItem(t):t:null},e.prototype.findPrevItem=function(e){var t=e.previousElementSibling;return t?!o.DomHandler.hasClass(t,"p-orderlist-item")||o.DomHandler.isHidden(t)?this.findPrevItem(t):t:null},e}();d.decorators=[{type:t.Component,args:[{selector:"p-orderList",template:'\n        <div [ngClass]="{\'p-orderlist p-component\': true, \'p-orderlist-controls-left\': controlsPosition === \'left\',\n                    \'p-orderlist-controls-right\': controlsPosition === \'right\'}" [ngStyle]="style" [class]="styleClass">\n            <div class="p-orderlist-controls">\n                <button type="button" pButton pRipple icon="pi pi-angle-up" (click)="moveUp($event)"></button>\n                <button type="button" pButton pRipple icon="pi pi-angle-double-up" (click)="moveTop($event)"></button>\n                <button type="button" pButton pRipple icon="pi pi-angle-down" (click)="moveDown($event)"></button>\n                <button type="button" pButton pRipple icon="pi pi-angle-double-down" (click)="moveBottom($event)"></button>\n            </div>\n            <div class="p-orderlist-list-container">\n                <div class="p-orderlist-header" *ngIf="header">\n                    <div class="p-orderlist-title">{{header}}</div>\n                </div>\n                <div class="p-orderlist-filter-container" *ngIf="filterBy">\n                    <div class="p-orderlist-filter">\n                        <input type="text" role="textbox" (keyup)="onFilterKeyup($event)" class="p-orderlist-filter-input p-inputtext p-component" [attr.placeholder]="filterPlaceholder" [attr.aria-label]="ariaFilterLabel">\n                        <span class="p-orderlist-filter-icon pi pi-search"></span>\n                    </div>\n                </div>\n                <ul #listelement class="p-orderlist-list" [ngStyle]="listStyle" (dragover)="onListMouseMove($event)">\n                    <ng-template ngFor [ngForTrackBy]="trackBy" let-item [ngForOf]="value" let-i="index" let-l="last">\n                        <li class="p-orderlist-droppoint" *ngIf="dragdrop && isItemVisible(item)" (dragover)="onDragOver($event, i)" (drop)="onDrop($event, i)" (dragleave)="onDragLeave($event)"\n                            [ngClass]="{\'p-orderlist-droppoint-highlight\': (i === dragOverItemIndex)}"></li>\n                        <li class="p-orderlist-item" tabindex="0" [ngClass]="{\'p-highlight\':isSelected(item)}" pRipple\n                            (click)="onItemClick($event,item,i)" (touchend)="onItemTouchEnd($event)" (keydown)="onItemKeydown($event,item,i)"\n                            [style.display]="isItemVisible(item) ? \'block\' : \'none\'" role="option" [attr.aria-selected]="isSelected(item)"\n                            [attr.draggable]="dragdrop" (dragstart)="onDragStart($event, i)" (dragend)="onDragEnd($event)">\n                            <ng-container *ngTemplateOutlet="itemTemplate; context: {$implicit: item, index: i}"></ng-container>\n                        </li>\n                        <li class="p-orderlist-droppoint" *ngIf="dragdrop && l" (dragover)="onDragOver($event, i + 1)" (drop)="onDrop($event, i + 1)" (dragleave)="onDragLeave($event)"\n                            [ngClass]="{\'p-orderlist-droppoint-highlight\': (i + 1 === dragOverItemIndex)}"></li>\n                    </ng-template>\n                </ul>\n            </div>\n        </div>\n    ',changeDetection:t.ChangeDetectionStrategy.OnPush,encapsulation:t.ViewEncapsulation.None,styles:[".p-orderlist{display:flex}.p-orderlist-controls{display:flex;flex-direction:column;justify-content:center}.p-orderlist-list-container{flex:1 1 auto}.p-orderlist-list{list-style-type:none;margin:0;max-height:24rem;min-height:12rem;overflow:auto;padding:0}.p-orderlist-item{cursor:pointer;overflow:hidden;position:relative}.p-orderlist-item[draggable=true]{cursor:move}.p-orderlist.p-state-disabled .p-button,.p-orderlist.p-state-disabled .p-orderlist-item{cursor:default}.p-orderlist.p-state-disabled .p-orderlist-list{overflow:hidden}.p-orderlist-filter{position:relative}.p-orderlist-filter-icon{margin-top:-.5rem;position:absolute;top:50%}.p-orderlist-filter-input{width:100%}.p-orderlist-controls-right .p-orderlist-controls{order:2}.p-orderlist-controls-right .p-orderlist-list-container{order:1}.p-orderlist-droppoint{height:6px}"]}]}],d.ctorParameters=function(){return[{type:t.ElementRef},{type:t.ChangeDetectorRef},{type:r.FilterService}]},d.propDecorators={header:[{type:t.Input}],style:[{type:t.Input}],styleClass:[{type:t.Input}],listStyle:[{type:t.Input}],responsive:[{type:t.Input}],filterBy:[{type:t.Input}],filterPlaceholder:[{type:t.Input}],filterLocale:[{type:t.Input}],metaKeySelection:[{type:t.Input}],dragdrop:[{type:t.Input}],controlsPosition:[{type:t.Input}],ariaFilterLabel:[{type:t.Input}],filterMatchMode:[{type:t.Input}],selectionChange:[{type:t.Output}],trackBy:[{type:t.Input}],onReorder:[{type:t.Output}],onSelectionChange:[{type:t.Output}],onFilterEvent:[{type:t.Output}],listViewChild:[{type:t.ViewChild,args:["listelement"]}],templates:[{type:t.ContentChildren,args:[r.PrimeTemplate]}],selection:[{type:t.Input}],value:[{type:t.Input}]};var c=function(){};c.decorators=[{type:t.NgModule,args:[{imports:[i.CommonModule,n.ButtonModule,r.SharedModule,s.RippleModule],exports:[d,r.SharedModule],declarations:[d]}]}],e.OrderList=d,e.OrderListModule=c,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=primeng-orderlist.umd.min.js.map