primereact/orderlist/orderlist.min.js

PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

this.primereact=this.primereact||{},this.primereact.orderlist=function(e,t,r,n,l,i,o){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var c=u(t),s=a(r);function d(){return d=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},d.apply(this,arguments)}function p(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function f(e){if(Array.isArray(e))return p(e)}function m(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function v(e,t){if(e){if("string"==typeof e)return p(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?p(e,t):void 0}}function g(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function h(e){return f(e)||m(e)||v(e)||g()}function y(e){if(Array.isArray(e))return e}function b(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,l,i,o,a=[],u=!0,c=!1;try{if(i=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;u=!1}else for(;!(u=(n=i.call(r)).done)&&(a.push(n.value),a.length!==t);u=!0);}catch(e){c=!0,l=e}finally{try{if(!u&&null!=r.return&&(o=r.return(),Object(o)!==o))return}finally{if(c)throw l}}return a}}function E(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function I(e,t){return y(e)||b(e,t)||v(e,t)||E()}var O={defaultProps:{__TYPE:"OrderList",id:null,value:null,header:null,style:null,className:null,listStyle:null,dragdrop:!1,tabIndex:0,dataKey:null,breakpoint:"960px",onChange:null,itemTemplate:null,filter:!1,filterBy:null,filterMatchMode:"contains",filterLocale:void 0,filterPlaceholder:null,filterTemplate:null,onFilter:null,children:void 0},getProps:function(e){return l.ObjectUtils.getMergedProps(e,O.defaultProps)},getOtherProps:function(e){return l.ObjectUtils.getDiffProps(e,O.defaultProps)}},D=c.memo((function(e){return c.createElement("div",{className:"p-orderlist-controls"},c.createElement(i.Button,{type:"button",icon:"pi pi-angle-up",onClick:function(t){if(e.selection){for(var r=h(e.value),n=0;n<e.selection.length;n++){var i=l.ObjectUtils.findIndexInList(e.selection[n],r,e.dataKey);if(0===i)break;var o=r[i-1];r[i-1]=r[i],r[i]=o}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"up"})}}}),c.createElement(i.Button,{type:"button",icon:"pi pi-angle-double-up",onClick:function(t){if(e.selection){for(var r=h(e.value),n=0;n<e.selection.length;n++){var i=l.ObjectUtils.findIndexInList(e.selection[n],r,e.dataKey);if(0===i)break;var o=r.splice(i,1)[0];r.unshift(o)}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"top"})}}}),c.createElement(i.Button,{type:"button",icon:"pi pi-angle-down",onClick:function(t){if(e.selection){for(var r=h(e.value),n=e.selection.length-1;n>=0;n--){var i=l.ObjectUtils.findIndexInList(e.selection[n],r,e.dataKey);if(i===r.length-1)break;var o=r[i+1];r[i+1]=r[i],r[i]=o}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"down"})}}}),c.createElement(i.Button,{type:"button",icon:"pi pi-angle-double-down",onClick:function(t){if(e.selection){for(var r=h(e.value),n=e.selection.length-1;n>=0;n--){var i=l.ObjectUtils.findIndexInList(e.selection[n],r,e.dataKey);if(i===r.length-1)break;var o=r.splice(i,1)[0];r.push(o)}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"bottom"})}}}))}));D.displayName="OrderListControls";var C=c.memo((function(e){var t,r=c.useRef(null),n=c.useRef(null),i=c.useRef(null),a=c.useRef(null),u={filter:function(t){return e.onFilterInputChange(t)},reset:function(){return e.resetFilter()}},s=function(t){return-1!==l.ObjectUtils.findIndexInList(t,e.selection,e.dataKey)},d=function(e,t){n.current!==t&&n.current+1!==t&&(i.current=t,l.DomHandler.addClass(e.target,"p-orderlist-droppoint-highlight"),e.preventDefault())},p=function(e){i.current=null,l.DomHandler.removeClass(e.target,"p-orderlist-droppoint-highlight")},f=function(t){var r=n.current>i.current?i.current:0===i.current?0:i.current-1,o=h(e.value);l.ObjectUtils.reorderArray(o,n.current,r),i.current=null,l.DomHandler.removeClass(t.target,"p-orderlist-droppoint-highlight"),e.onChange&&e.onChange({originalEvent:t,value:o})},m=function(e){r.current=!1},v=function(e){if(r.current){var t=a.current.getBoundingClientRect().top+l.DomHandler.getWindowScrollTop(),n=t+a.current.clientHeight-e.pageY,i=e.pageY-t;n<25&&n>0?a.current.scrollTop+=15:i<25&&i>0&&(a.current.scrollTop-=15)}},g=function(e){13===e.which&&e.preventDefault()},y=function(e,t){return c.createElement("li",{key:t,className:"p-orderlist-droppoint",onDragOver:function(t){return d(t,e+1)},onDragLeave:p,onDrop:f})},b=e.header?c.createElement("div",{className:"p-orderlist-header"},e.header):null,E=function(){if(e.filter){var t=c.createElement("div",{className:"p-orderlist-filter"},c.createElement("input",{type:"text",value:e.filterValue,onChange:e.onFilter,onKeyDown:g,placeholder:e.placeholder,className:"p-orderlist-filter-input p-inputtext p-component"}),c.createElement("span",{className:"p-orderlist-filter-icon pi pi-search"}));if(e.filterTemplate)t=l.ObjectUtils.getJSXElement(e.filterTemplate,{className:"p-orderlist-filter",inputProps:{inputClassName:"p-orderlist-filter-input p-inputtext p-component",onChange:e.onFilter,onKeyDown:g},filterOptions:u,iconClassName:"p-orderlist-filter-icon pi pi-search",element:t,props:e});return c.createElement("div",{className:"p-orderlist-filter-container"},t)}return null}(),I=(t=e.value?e.value.map((function(t,i){var a=e.itemTemplate?e.itemTemplate(t):t,u=l.classNames("p-orderlist-item",{"p-highlight":s(t)},e.className),d=JSON.stringify(t);if(e.dragdrop){var p=[];return 0===i&&p.push(y(t,i)),p.push(c.createElement("li",{key:d,className:u,onClick:function(r){return e.onItemClick({originalEvent:r,value:t,index:i})},onKeyDown:function(r){return e.onItemKeyDown({originalEvent:r,value:t,index:i})},role:"option","aria-selected":s(t),draggable:"true",onDragStart:function(t){return l=t,o=i,r.current=!0,n.current=o,void(e.dragdropScope&&l.dataTransfer.setData("text","orderlist"));var l,o},onDragEnd:m,tabIndex:e.tabIndex},a,c.createElement(o.Ripple,null))),p.push(y(i,d+"_droppoint")),p}return c.createElement("li",{key:d,className:u,role:"option","aria-selected":s(t),onClick:function(r){return e.onItemClick({originalEvent:r,value:t,index:i})},onKeyDown:function(r){return e.onItemKeyDown({originalEvent:r,value:t,index:i})},tabIndex:e.tabIndex},a)})):null,c.createElement("ul",{ref:a,className:"p-orderlist-list",style:e.listStyle,onDragOver:v,role:"listbox","aria-multiselectable":!0},t));return c.createElement("div",{className:"p-orderlist-list-container"},b,E,I)}));C.displayName="OrderListSubList";var w=c.memo(c.forwardRef((function(e,t){var i=O.getProps(e),o=I(c.useState([]),2),a=o[0],u=o[1],p=I(c.useState(""),2),f=p[0],m=p[1],v=I(c.useState(null),2),g=v[0],y=v[1],b=l.ObjectUtils.isNotEmpty(f),E=c.useRef(null),w=c.useRef(null),x=c.useRef(null),j=function(e){var t,r=e.originalEvent.metaKey||e.originalEvent.ctrlKey,n=l.ObjectUtils.findIndexInList(e.value,a,i.dataKey);t=-1!==n?r?a.filter((function(e,t){return t!==n})):[e.value]:r?[].concat(h(a),[e.value]):[e.value],u(t)},S=function e(t){var r=t.nextElementSibling;return r?l.DomHandler.hasClass(r,"p-orderlist-item")?r:e(r):null},k=function e(t){var r=t.previousElementSibling;return r?l.DomHandler.hasClass(r,"p-orderlist-item")?r:e(r):null},N=function(){var e=l.DomHandler.findSingle(E.current,".p-orderlist-list"),t=l.DomHandler.find(e,".p-orderlist-item.p-highlight");if(t&&t.length)switch(x.current){case"up":l.DomHandler.scrollInView(e,t[0]);break;case"top":e.scrollTop=0;break;case"down":l.DomHandler.scrollInView(e,t[t.length-1]);break;case"bottom":setTimeout((function(){return e.scrollTop=e.scrollHeight}),100)}},T=function(){if(!w.current){w.current=l.DomHandler.createInlineStyle(s.default.nonce);var e="\n@media screen and (max-width: ".concat(i.breakpoint,") {\n    .p-orderlist[").concat(g,"] {\n        flex-direction: column;\n    }\n\n    .p-orderlist[").concat(g,"] .p-orderlist-controls {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-orderlist[").concat(g,"] .p-orderlist-controls .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-orderlist[").concat(g,"] .p-orderlist-controls .p-button:last-child {\n        margin-right: 0;\n    }\n}\n");w.current.innerHTML=e}};c.useImperativeHandle(t,(function(){return{props:i,getElement:function(){return E.current}}})),n.useMountEffect((function(){!g&&y(l.UniqueComponentId())})),n.useUpdateEffect((function(){return g&&(E.current.setAttribute(g,""),T()),function(){w.current=l.DomHandler.removeInlineStyle(w.current)}}),[g,i.breakpoint]),n.useUpdateEffect((function(){x.current&&(N(),x.current=null)}));var K=O.getOtherProps(i),R=l.classNames("p-orderlist p-component",i.className),L=function(){if(b){var e=f.trim().toLocaleLowerCase(i.filterLocale),t=i.filterBy?i.filterBy.split(","):[];return r.FilterService.filter(i.value,t,e,i.filterMatchMode,i.filterLocale)}return i.value}();return c.createElement("div",d({ref:E,id:i.id,className:R,style:i.style},K),c.createElement(D,{value:L,selection:a,onReorder:function(e){i.onChange&&i.onChange({event:e.originalEvent,value:e.value}),x.current=e.direction},dataKey:i.dataKey}),c.createElement(C,{value:L,selection:a,onItemClick:j,onItemKeyDown:function(e){var t=e.originalEvent,r=t.currentTarget;switch(t.which){case 40:var n=S(r);n&&n.focus(),t.preventDefault();break;case 38:var l=k(r);l&&l.focus(),t.preventDefault();break;case 13:j(e),t.preventDefault()}},onFilterInputChange:function(e){var t=e.target.value;m(t),i.onFilter&&i.onFilter({originalEvent:e,filter:t})},itemTemplate:i.itemTemplate,filter:i.filter,onFilter:function(e){var t=e.target.value;m(t),i.onFilter&&i.onFilter({originalEvent:e,value:t})},resetFilter:function(){m(""),i.onFilter&&i.onFilter({filter:""})},filterTemplate:i.filterTemplate,header:i.header,listStyle:i.listStyle,dataKey:i.dataKey,dragdrop:i.dragdrop,onChange:i.onChange,tabIndex:i.tabIndex}))})));return w.displayName="OrderList",e.OrderList=w,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.hooks,primereact.utils,primereact.button,primereact.ripple);