primereact/picklist/picklist.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.picklist=function(e,t,n,r,l,i,a){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var s=c(t),u=o(n);function p(){return p=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},p.apply(this,arguments)}function f(e){if(Array.isArray(e))return e}function m(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,l,i,a,o=[],c=!0,s=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=i.call(n)).done)&&(o.push(r.value),o.length!==t);c=!0);}catch(e){s=!0,l=e}finally{try{if(!c&&null!=n.return&&(a=n.return(),Object(a)!==a))return}finally{if(s)throw l}}return o}}function d(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function g(e,t){if(e){if("string"==typeof e)return d(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?d(e,t):void 0}}function v(){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 b(e,t){return f(e)||m(e,t)||g(e,t)||v()}var h={defaultProps:{__TYPE:"PickList",id:null,source:null,target:null,sourceHeader:null,targetHeader:null,style:null,className:null,sourceStyle:null,targetStyle:null,sourceSelection:null,targetSelection:null,showSourceControls:!0,showTargetControls:!0,metaKeySelection:!0,filter:!1,filterBy:null,filterMatchMode:"contains",filterLocale:void 0,sourceFilterValue:null,targetFilterValue:null,showSourceFilter:!0,showTargetFilter:!0,sourceFilterPlaceholder:null,targetFilterPlaceholder:null,sourceFilterTemplate:null,targetFilterTemplate:null,tabIndex:0,dataKey:null,breakpoint:"960px",itemTemplate:null,sourceItemTemplate:null,targetItemTemplate:null,onChange:null,onMoveToSource:null,onMoveAllToSource:null,onMoveToTarget:null,onMoveAllToTarget:null,onSourceSelectionChange:null,onTargetSelectionChange:null,onSourceFilterChange:null,onTargetFilterChange:null,children:void 0},getProps:function(e){return l.ObjectUtils.getMergedProps(e,h.defaultProps)},getOtherProps:function(e){return l.ObjectUtils.getDiffProps(e,h.defaultProps)}};function y(e){if(Array.isArray(e))return d(e)}function S(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function E(){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 T(e){return y(e)||S(e)||g(e)||E()}var k=s.memo((function(e){var t=!e.selection||!e.selection.length,n=l.classNames("p-picklist-buttons",e.className);return s.createElement("div",{className:n},s.createElement(i.Button,{disabled:t,type:"button",icon:"pi pi-angle-up",onClick:function(t){var n=e.selection;if(n&&n.length){for(var r=T(e.list),i=0;i<n.length;i++){var a=l.ObjectUtils.findIndexInList(n[i],r,e.dataKey);if(0===a)break;var o=r[a-1];r[a-1]=r[a],r[a]=o}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"up"})}}}),s.createElement(i.Button,{disabled:t,type:"button",icon:"pi pi-angle-double-up",onClick:function(t){var n=e.selection;if(n&&n.length){for(var r=T(e.list),i=0;i<n.length;i++){var a=l.ObjectUtils.findIndexInList(n[i],r,e.dataKey);if(0===a)break;var o=r.splice(a,1)[0];r.unshift(o)}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"top"})}}}),s.createElement(i.Button,{disabled:t,type:"button",icon:"pi pi-angle-down",onClick:function(t){var n=e.selection;if(n&&n.length){for(var r=T(e.list),i=n.length-1;i>=0;i--){var a=l.ObjectUtils.findIndexInList(n[i],r,e.dataKey);if(a===r.length-1)break;var o=r[a+1];r[a+1]=r[a],r[a]=o}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"down"})}}}),s.createElement(i.Button,{disabled:t,type:"button",icon:"pi pi-angle-double-down",onClick:function(t){var n=e.selection;if(n&&n.length){for(var r=T(e.list),i=n.length-1;i>=0;i--){var a=l.ObjectUtils.findIndexInList(n[i],r,e.dataKey);if(a===r.length-1)break;var o=r.splice(a,1)[0];r.push(o)}e.onReorder&&e.onReorder({originalEvent:t,value:r,direction:"bottom"})}}}))}));k.displayName="PickListControls";var C=s.memo((function(e){var t=e.template?e.template(e.value):e.value,n=l.classNames("p-picklist-item",{"p-highlight":e.selected},e.className);return s.createElement("li",{className:n,onClick:function(t){e.onClick&&e.onClick({originalEvent:t,value:e.value})},onKeyDown:function(t){e.onKeyDown&&e.onKeyDown({originalEvent:t,value:e.value})},tabIndex:e.tabIndex,role:"option","aria-selected":e.selected},t,s.createElement(a.Ripple,null))}));C.displayName="PickListItem";var I=s.memo(s.forwardRef((function(e,t){var n=s.useRef(null),r=function(t){var n=t.originalEvent,r=t.value,i=T(e.selection),a=l.ObjectUtils.findIndexInList(r,i,e.dataKey),o=-1!==a;if(e.metaKeySelection){var c=n.metaKey||n.ctrlKey;o&&c?i.splice(a,1):(c||(i.length=0),i.push(r))}else o?i.splice(a,1):i.push(r);e.onSelectionChange&&e.onSelectionChange({event:n,value:i})},i=function(e){var t=e.originalEvent,n=t.currentTarget;switch(t.which){case 40:var l=a(n);l&&l.focus(),t.preventDefault();break;case 38:var i=o(n);i&&i.focus(),t.preventDefault();break;case 13:r(e),t.preventDefault()}},a=function e(t){var n=t.nextElementSibling;return n?l.DomHandler.hasClass(n,"p-picklist-item")?n:e(n):null},o=function e(t){var n=t.previousElementSibling;return n?l.DomHandler.hasClass(n,"p-picklist-item")?n:e(n):null},c=function(t){return-1!==l.ObjectUtils.findIndexInList(t,e.selection,e.dataKey)},u=function(t){e.onFilter&&e.onFilter({originalEvent:t,value:t.target.value,type:e.type})},p=function(e){13===e.which&&e.preventDefault()};s.useImperativeHandle(t,(function(){return{listElementRef:n}}));var f=l.classNames("p-picklist-list-wrapper",e.className),m=e.header?s.createElement("div",{className:"p-picklist-header"},l.ObjectUtils.getJSXElement(e.header,e)):null,d=function(){if(e.showFilter){var t=s.createElement("div",{className:"p-picklist-filter"},s.createElement("input",{type:"text",value:e.filterValue,onChange:u,onKeyDown:p,placeholder:e.placeholder,className:"p-picklist-filter-input p-inputtext p-component"}),s.createElement("span",{className:"p-picklist-filter-icon pi pi-search"}));if(e.filterTemplate)t=l.ObjectUtils.getJSXElement(e.filterTemplate,{className:"p-picklist-filter",inputProps:{className:"p-picklist-filter-input p-inputtext p-component",onChange:u,onKeyDown:p},iconClassName:"p-picklist-filter-icon pi pi-search",element:t,props:e});return s.createElement("div",{className:"p-picklist-filter-container"},t)}return null}(),g=function(){var t=e.list?e.list.map((function(t){var n=JSON.stringify(t),l=c(t);return s.createElement(C,{key:n,value:t,template:e.itemTemplate,selected:l,onClick:r,onKeyDown:i,tabIndex:e.tabIndex})})):null,n=l.classNames("p-picklist-list",e.listClassName);return s.createElement("ul",{className:n,style:e.style,role:"listbox","aria-multiselectable":!0},t)}();return s.createElement("div",{ref:n,className:f},m,d,g)})));I.displayName="PickListSubList";var N=s.memo((function(e){var t=l.ObjectUtils.isEmpty(e.sourceSelection)||l.ObjectUtils.isEmpty(e.visibleSourceList),n=l.ObjectUtils.isEmpty(e.targetSelection)||l.ObjectUtils.isEmpty(e.visibleTargetList),r=l.ObjectUtils.isEmpty(e.visibleSourceList),a=l.ObjectUtils.isEmpty(e.visibleTargetList),o=l.classNames("p-picklist-buttons p-picklist-transfer-buttons",e.className);return s.createElement("div",{className:o},s.createElement(i.Button,{disabled:t,type:"button",icon:"pi pi-angle-right",onClick:function(t){var n=e.sourceSelection;if(l.ObjectUtils.isNotEmpty(n)){for(var r=T(e.target),i=T(e.source),a=0;a<n.length;a++){var o=n[a];-1===l.ObjectUtils.findIndexInList(o,r,e.dataKey)&&r.push(i.splice(l.ObjectUtils.findIndexInList(o,i,e.dataKey),1)[0])}e.onTransfer&&e.onTransfer({originalEvent:t,source:i,target:r,direction:"toTarget"})}}}),s.createElement(i.Button,{disabled:r,type:"button",icon:"pi pi-angle-double-right",onClick:function(t){if(e.source){var n=[].concat(T(e.target),T(e.visibleSourceList)),r=e.source.filter((function(t){return!e.visibleSourceList.some((function(e){return e===t}))}));e.onTransfer&&e.onTransfer({originalEvent:t,source:r,target:n,direction:"allToTarget"})}}}),s.createElement(i.Button,{disabled:n,type:"button",icon:"pi pi-angle-left",onClick:function(t){var n=e.targetSelection;if(l.ObjectUtils.isNotEmpty(n)){for(var r=T(e.target),i=T(e.source),a=0;a<n.length;a++){var o=n[a];-1===l.ObjectUtils.findIndexInList(o,i,e.dataKey)&&i.push(r.splice(l.ObjectUtils.findIndexInList(o,r,e.dataKey),1)[0])}e.onTransfer&&e.onTransfer({originalEvent:t,source:i,target:r,direction:"toSource"})}}}),s.createElement(i.Button,{disabled:a,type:"button",icon:"pi pi-angle-double-left",onClick:function(t){if(e.source){var n=[].concat(T(e.source),T(e.visibleTargetList)),r=e.target.filter((function(t){return!e.visibleTargetList.some((function(e){return e===t}))}));e.onTransfer&&e.onTransfer({originalEvent:t,source:n,target:r,direction:"allToSource"})}}}))}));N.displayName="PickListTransferControls";var O=s.memo(s.forwardRef((function(e,t){var i=h.getProps(e),a=b(s.useState([]),2),o=a[0],c=a[1],f=b(s.useState([]),2),m=f[0],d=f[1],g=b(s.useState(""),2),v=g[0],y=g[1],S=b(s.useState(""),2),E=S[0],T=S[1],C=b(s.useState(null),2),O=C[0],w=C[1],j=s.useRef(null),L=s.useRef(null),K=s.useRef(null),U=s.useRef(null),F=s.useRef(null),x=s.useRef(null),P=i.sourceSelection?i.sourceSelection:o,R=i.targetSelection?i.targetSelection:m,M=i.onSourceFilterChange?i.sourceFilterValue:v,D=i.onTargetFilterChange?i.targetFilterValue:E,A=l.ObjectUtils.isNotEmpty(i.filterBy),H=A&&i.showSourceFilter,B=A&&i.showTargetFilter,V=function(e,t){if(e){var n=l.DomHandler.findSingle(e,".p-picklist-list");switch(t){case"up":J(n,-1);break;case"top":n.scrollTop=0;break;case"down":J(n,1);break;case"bottom":setTimeout((function(){return n.scrollTop=n.scrollHeight}),100)}}},_=function(e,t,n){i.onChange&&i.onChange({originalEvent:e.originalEvent,source:t,target:n})},J=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,n=e.getElementsByClassName("p-highlight");l.ObjectUtils.isNotEmpty(n)&&l.DomHandler.scrollInView(e,-1===t?n[0]:n[n.length-1])},X=function(e,t,n){"sourceSelection"===t?c(e.value):d(e.value),n&&n(e),l.ObjectUtils.isNotEmpty(P)&&"targetSelection"===t?c([]):l.ObjectUtils.isNotEmpty(R)&&"sourceSelection"===t&&d([])},q=function(e){var t=e.originalEvent,n=e.value,r=b("source"===e.type?[y,i.onSourceFilterChange]:[T,i.onTargetFilterChange],2),l=r[0],a=r[1];a?a({originalEvent:t,value:n}):l(n)},z=function(e,t){var n=b("source"===t?[M,Y]:[D,$],2),r=n[0],i=n[1];return A&&l.ObjectUtils.isNotEmpty(r)?i(r):e},Y=function(){var e=(arguments.length>0&&void 0!==arguments[0]?arguments[0]:"").trim().toLocaleLowerCase(i.filterLocale);return G(i.source,e)},$=function(){var e=(arguments.length>0&&void 0!==arguments[0]?arguments[0]:"").trim().toLocaleLowerCase(i.filterLocale);return G(i.target,e)},G=function(e,t){var r=A?i.filterBy.split(","):[];return n.FilterService.filter(e,r,t,i.filterMatchMode,i.filterLocale)},Q=function(){if(!x.current){x.current=l.DomHandler.createInlineStyle(u.default.nonce);var e="\n@media screen and (max-width: ".concat(i.breakpoint,") {\n    .p-picklist[").concat(O,"] {\n        flex-direction: column;\n    }\n\n    .p-picklist[").concat(O,"] .p-picklist-buttons {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-picklist[").concat(O,"] .p-picklist-buttons .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-picklist[").concat(O,"] .p-picklist-buttons .p-button:last-child {\n        margin-right: 0;\n    }\n\n    .p-picklist[").concat(O,'] .pi-angle-right:before {\n        content: "\\e930"\n    }\n\n    .p-picklist[').concat(O,'] .pi-angle-double-right:before {\n        content: "\\e92c"\n    }\n\n    .p-picklist[').concat(O,'] .pi-angle-left:before {\n        content: "\\e933"\n    }\n\n    .p-picklist[').concat(O,'] .pi-angle-double-left:before {\n        content: "\\e92f"\n    }\n}\n');x.current.innerHTML=e}};s.useImperativeHandle(t,(function(){return{props:i,getElement:function(){return j.current}}})),r.useMountEffect((function(){!O&&w(l.UniqueComponentId())})),r.useUpdateEffect((function(){return O&&(j.current.setAttribute(O,""),Q()),function(){x.current=l.DomHandler.removeInlineStyle(x.current)}}),[O,i.breakpoint]),r.useUpdateEffect((function(){U.current&&(V(U.current,F.current),U.current=null,F.current=null)}));var W=h.getOtherProps(i),Z=l.classNames("p-picklist p-component",i.className),ee=i.sourceItemTemplate?i.sourceItemTemplate:i.itemTemplate,te=i.targetItemTemplate?i.targetItemTemplate:i.itemTemplate,ne=z(i.source,"source"),re=z(i.target,"target");return s.createElement("div",p({id:i.id,ref:j,className:Z,style:i.style},W),i.showSourceControls&&s.createElement(k,{list:i.source,selection:P,onReorder:function(e){_(e,e.value,i.target),U.current=L.current.listElementRef.current,F.current=e.direction},className:"p-picklist-source-controls",dataKey:i.dataKey}),s.createElement(I,{ref:L,type:"source",list:ne,selection:P,onSelectionChange:function(e){return X(e,"sourceSelection",i.onSourceSelectionChange)},itemTemplate:ee,header:i.sourceHeader,style:i.sourceStyle,className:"p-picklist-source-wrapper",listClassName:"p-picklist-source",metaKeySelection:i.metaKeySelection,tabIndex:i.tabIndex,dataKey:i.dataKey,filterValue:M,onFilter:q,showFilter:H,placeholder:i.sourceFilterPlaceholder,template:i.sourceFilterTemplate}),s.createElement(N,{onTransfer:function(e){var t=e.originalEvent,n=e.source,r=e.target,l=[];switch(e.direction){case"toTarget":l=P,i.onMoveToTarget&&i.onMoveToTarget({originalEvent:t,value:l});break;case"allToTarget":l=i.source,i.onMoveAllToTarget&&i.onMoveAllToTarget({originalEvent:t,value:l});break;case"toSource":l=R,i.onMoveToSource&&i.onMoveToSource({originalEvent:t,value:l});break;case"allToSource":l=i.target,i.onMoveAllToSource&&i.onMoveAllToSource({originalEvent:t,value:l})}X({originalEvent:t,value:l},"sourceSelection",i.onSourceSelectionChange),X({originalEvent:t,value:l},"targetSelection",i.onTargetSelectionChange),_(e,n,r)},source:i.source,visibleSourceList:ne,target:i.target,visibleTargetList:re,sourceSelection:P,targetSelection:R,dataKey:i.dataKey}),s.createElement(I,{ref:K,type:"target",list:re,selection:R,onSelectionChange:function(e){return X(e,"targetSelection",i.onTargetSelectionChange)},itemTemplate:te,header:i.targetHeader,style:i.targetStyle,className:"p-picklist-target-wrapper",listClassName:"p-picklist-target",metaKeySelection:i.metaKeySelection,tabIndex:i.tabIndex,dataKey:i.dataKey,filterValue:D,onFilter:q,showFilter:B,placeholder:i.targetFilterPlaceholder,template:i.targetFilterTemplate}),i.showTargetControls&&s.createElement(k,{list:i.target,selection:R,onReorder:function(e){_(e,i.source,e.value),U.current=K.current.listElementRef.current,F.current=e.direction},className:"p-picklist-target-controls",dataKey:i.dataKey}))})));return O.displayName="PickList",e.PickList=O,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.hooks,primereact.utils,primereact.button,primereact.ripple);