primereact 8.0.1 → 8.2.0

package/picklist/picklist.js

@@ -1,5 +1,5 @@
 this.primereact = this.primereact || {};
-this.primereact.picklist = (function (exports, React, hooks, utils, button, ripple) {
+this.primereact.picklist = (function (exports, React, api, hooks, utils, button, ripple) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -375,6 +375,23 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
       return utils.ObjectUtils.findIndexInList(item, props.selection, props.dataKey) !== -1;
     };
 
+    var onFilter = function onFilter(event) {
+      if (props.onFilter) {
+        props.onFilter({
+          originalEvent: event,
+          value: event.target.value,
+          type: props.type
+        });
+      }
+    };
+
+    var onFilterInputKeyDown = function onFilterInputKeyDown(event) {
+      //enter
+      if (event.which === 13) {
+        event.preventDefault();
+      }
+    };
+
     React__namespace.useImperativeHandle(ref, function () {
       return {
         listElementRef: listElementRef
@@ -411,6 +428,44 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
       return null;
     };
 
+    var createFilter = function createFilter() {
+      if (props.showFilter) {
+        var content = /*#__PURE__*/React__namespace.createElement("div", {
+          className: "p-picklist-filter"
+        }, /*#__PURE__*/React__namespace.createElement("input", {
+          type: "text",
+          value: props.filterValue,
+          onChange: onFilter,
+          onKeyDown: onFilterInputKeyDown,
+          placeholder: props.placeholder,
+          className: "p-picklist-filter-input p-inputtext p-component"
+        }), /*#__PURE__*/React__namespace.createElement("span", {
+          className: "p-picklist-filter-icon pi pi-search"
+        }));
+
+        if (props.filterTemplate) {
+          var defaultContentOptions = {
+            className: 'p-picklist-filter',
+            inputProps: {
+              className: 'p-picklist-filter-input p-inputtext p-component',
+              onChange: onFilter,
+              onKeyDown: onFilterInputKeyDown
+            },
+            iconClassName: 'p-picklist-filter-icon pi pi-search',
+            element: content,
+            props: props
+          };
+          content = utils.ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
+        }
+
+        return /*#__PURE__*/React__namespace.createElement("div", {
+          className: "p-picklist-filter-container"
+        }, content);
+      }
+
+      return null;
+    };
+
     var createList = function createList() {
       var items = createItems();
       var className = utils.classNames('p-picklist-list', props.listClassName);
@@ -424,19 +479,20 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
 
     var className = utils.classNames('p-picklist-list-wrapper', props.className);
     var header = createHeader();
+    var filter = createFilter();
     var list = createList();
     return /*#__PURE__*/React__namespace.createElement("div", {
       ref: listElementRef,
       className: className
-    }, header, list);
+    }, header, filter, list);
   }));
   PickListSubList.displayName = 'PickListSubList';
 
   var PickListTransferControls = /*#__PURE__*/React__namespace.memo(function (props) {
-    var moveRightDisabled = utils.ObjectUtils.isEmpty(props.sourceSelection);
-    var moveLeftDisabled = utils.ObjectUtils.isEmpty(props.targetSelection);
-    var moveAllRightDisabled = utils.ObjectUtils.isEmpty(props.source);
-    var moveAllLeftDisabled = utils.ObjectUtils.isEmpty(props.target);
+    var moveRightDisabled = utils.ObjectUtils.isEmpty(props.sourceSelection) || utils.ObjectUtils.isEmpty(props.visibleSourceList);
+    var moveLeftDisabled = utils.ObjectUtils.isEmpty(props.targetSelection) || utils.ObjectUtils.isEmpty(props.visibleTargetList);
+    var moveAllRightDisabled = utils.ObjectUtils.isEmpty(props.visibleSourceList);
+    var moveAllLeftDisabled = utils.ObjectUtils.isEmpty(props.visibleTargetList);
 
     var moveRight = function moveRight(event) {
       var selection = props.sourceSelection;
@@ -467,8 +523,12 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
 
     var moveAllRight = function moveAllRight(event) {
       if (props.source) {
-        var targetList = [].concat(_toConsumableArray(props.target), _toConsumableArray(props.source));
-        var sourceList = [];
+        var targetList = [].concat(_toConsumableArray(props.target), _toConsumableArray(props.visibleSourceList));
+        var sourceList = props.source.filter(function (s) {
+          return !props.visibleSourceList.some(function (vs) {
+            return vs === s;
+          });
+        });
 
         if (props.onTransfer) {
           props.onTransfer({
@@ -510,8 +570,12 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
 
     var moveAllLeft = function moveAllLeft(event) {
       if (props.source) {
-        var sourceList = [].concat(_toConsumableArray(props.source), _toConsumableArray(props.target));
-        var targetList = [];
+        var sourceList = [].concat(_toConsumableArray(props.source), _toConsumableArray(props.visibleTargetList));
+        var targetList = props.target.filter(function (t) {
+          return !props.visibleTargetList.some(function (vt) {
+            return vt === t;
+          });
+        });
 
         if (props.onTransfer) {
           props.onTransfer({
@@ -562,12 +626,27 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
         targetSelectionState = _React$useState4[0],
         setTargetSelectionState = _React$useState4[1];
 
+    var _React$useState5 = React__namespace.useState(''),
+        _React$useState6 = _slicedToArray(_React$useState5, 2),
+        sourceFilterValueState = _React$useState6[0],
+        setSourceFilterValueState = _React$useState6[1];
+
+    var _React$useState7 = React__namespace.useState(''),
+        _React$useState8 = _slicedToArray(_React$useState7, 2),
+        targetFilterValueState = _React$useState8[0],
+        setTargetFilterValueState = _React$useState8[1];
+
     var sourceListElementRef = React__namespace.useRef(null);
     var targetListElementRef = React__namespace.useRef(null);
     var reorderedListElementRef = React__namespace.useRef(null);
     var reorderDirection = React__namespace.useRef(null);
     var sourceSelection = props.onSourceSelectionChange ? props.sourceSelection : sourceSelectionState;
     var targetSelection = props.onTargetSelectionChange ? props.targetSelection : targetSelectionState;
+    var sourceFilteredValue = props.onSourceFilterChange ? props.sourceFilterValue : sourceFilterValueState;
+    var targetFilteredValue = props.onTargetFilterChange ? props.targetFilterValue : targetFilterValueState;
+    var hasFilterBy = utils.ObjectUtils.isNotEmpty(props.filterBy);
+    var showSourceFilter = hasFilterBy && props.showSourceFilter;
+    var showTargetFilter = hasFilterBy && props.showTargetFilter;
 
     var onSourceReorder = function onSourceReorder(event) {
       handleChange(event, event.value, props.target);
@@ -702,6 +781,52 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
       }
     };
 
+    var onFilter = function onFilter(event) {
+      var originalEvent = event.originalEvent,
+          value = event.value,
+          type = event.type;
+
+      var _ref = type === 'source' ? [setSourceFilterValueState, props.onSourceFilterChange] : [setTargetFilterValueState, props.onTargetFilterChange],
+          _ref2 = _slicedToArray(_ref, 2),
+          setFilterState = _ref2[0],
+          onFilterChange = _ref2[1];
+
+      if (onFilterChange) {
+        onFilterChange({
+          originalEvent: originalEvent,
+          value: value
+        });
+      } else {
+        setFilterState(value);
+      }
+    };
+
+    var getVisibleList = function getVisibleList(list, type) {
+      var _ref3 = type === 'source' ? [sourceFilteredValue, filterSource] : [targetFilteredValue, filterTarget],
+          _ref4 = _slicedToArray(_ref3, 2),
+          filteredValue = _ref4[0],
+          filterCallback = _ref4[1];
+
+      return hasFilterBy && utils.ObjectUtils.isNotEmpty(filteredValue) ? filterCallback(filteredValue) : list;
+    };
+
+    var filterSource = function filterSource() {
+      var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+      var filteredValue = value.trim().toLocaleLowerCase(props.filterLocale);
+      return filter(props.source, filteredValue);
+    };
+
+    var filterTarget = function filterTarget() {
+      var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+      var filteredValue = value.trim().toLocaleLowerCase(props.filterLocale);
+      return filter(props.target, filteredValue);
+    };
+
+    var filter = function filter(list, filterValue) {
+      var searchFields = hasFilterBy ? props.filterBy.split(',') : [];
+      return api.FilterService.filter(list, searchFields, filterValue, props.filterMatchMode, props.filterLocale);
+    };
+
     hooks.useUpdateEffect(function () {
       if (reorderedListElementRef.current) {
         handleScrollPosition(reorderedListElementRef.current, reorderDirection.current);
@@ -711,6 +836,10 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
     });
     var otherProps = utils.ObjectUtils.findDiffKeys(props, PickList.defaultProps);
     var className = utils.classNames('p-picklist p-component', props.className);
+    var sourceItemTemplate = props.sourceItemTemplate ? props.sourceItemTemplate : props.itemTemplate;
+    var targetItemTemplate = props.targetItemTemplate ? props.targetItemTemplate : props.itemTemplate;
+    var sourceList = getVisibleList(props.source, 'source');
+    var targetList = getVisibleList(props.target, 'target');
     return /*#__PURE__*/React__namespace.createElement("div", _extends({
       id: props.id,
       className: className,
@@ -723,41 +852,55 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
       dataKey: props.dataKey
     }), /*#__PURE__*/React__namespace.createElement(PickListSubList, {
       ref: sourceListElementRef,
-      list: props.source,
+      type: "source",
+      list: sourceList,
       selection: sourceSelection,
       onSelectionChange: function onSelectionChange(e) {
         return _onSelectionChange(e, 'sourceSelection', props.onSourceSelectionChange);
       },
-      itemTemplate: props.itemTemplate,
+      itemTemplate: sourceItemTemplate,
       header: props.sourceHeader,
       style: props.sourceStyle,
       className: "p-picklist-source-wrapper",
       listClassName: "p-picklist-source",
       metaKeySelection: props.metaKeySelection,
       tabIndex: props.tabIndex,
-      dataKey: props.dataKey
+      dataKey: props.dataKey,
+      filterValue: sourceFilteredValue,
+      onFilter: onFilter,
+      showFilter: showSourceFilter,
+      placeholder: props.sourceFilterPlaceholder,
+      template: props.sourceFilterTemplate
     }), /*#__PURE__*/React__namespace.createElement(PickListTransferControls, {
       onTransfer: onTransfer,
       source: props.source,
+      visibleSourceList: sourceList,
       target: props.target,
+      visibleTargetList: targetList,
       sourceSelection: sourceSelection,
       targetSelection: targetSelection,
       dataKey: props.dataKey
     }), /*#__PURE__*/React__namespace.createElement(PickListSubList, {
       ref: targetListElementRef,
-      list: props.target,
+      type: "target",
+      list: targetList,
       selection: targetSelection,
       onSelectionChange: function onSelectionChange(e) {
         return _onSelectionChange(e, 'targetSelection', props.onTargetSelectionChange);
       },
-      itemTemplate: props.itemTemplate,
+      itemTemplate: targetItemTemplate,
       header: props.targetHeader,
       style: props.targetStyle,
       className: "p-picklist-target-wrapper",
       listClassName: "p-picklist-target",
       metaKeySelection: props.metaKeySelection,
       tabIndex: props.tabIndex,
-      dataKey: props.dataKey
+      dataKey: props.dataKey,
+      filterValue: targetFilteredValue,
+      onFilter: onFilter,
+      showFilter: showTargetFilter,
+      placeholder: props.targetFilterPlaceholder,
+      template: props.targetFilterTemplate
     }), props.showTargetControls && /*#__PURE__*/React__namespace.createElement(PickListControls, {
       list: props.target,
       selection: targetSelection,
@@ -783,16 +926,31 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
     showSourceControls: true,
     showTargetControls: true,
     metaKeySelection: true,
+    filterBy: null,
+    filterMatchMode: 'contains',
+    filterLocale: undefined,
+    sourceFilterValue: null,
+    targetFilterValue: null,
+    showSourceFilter: true,
+    showTargetFilter: true,
+    sourceFilterPlaceholder: null,
+    targetFilterPlaceholder: null,
+    sourceFilterTemplate: null,
+    targetFilterTemplate: null,
     tabIndex: 0,
     dataKey: null,
     itemTemplate: null,
+    sourceItemTemplate: null,
+    targetItemTemplate: null,
     onChange: null,
     onMoveToSource: null,
     onMoveAllToSource: null,
     onMoveToTarget: null,
     onMoveAllToTarget: null,
     onSourceSelectionChange: null,
-    onTargetSelectionChange: null
+    onTargetSelectionChange: null,
+    onSourceFilterChange: null,
+    onTargetFilterChange: null
   };
 
   exports.PickList = PickList;
@@ -801,4 +959,4 @@ this.primereact.picklist = (function (exports, React, hooks, utils, button, ripp
 
   return exports;
 
-})({}, React, primereact.hooks, primereact.utils, primereact.button, primereact.ripple);
+})({}, React, primereact.api, primereact.hooks, primereact.utils, primereact.button, primereact.ripple);

package/picklist/picklist.min.css

@@ -1 +1 @@
-.p-picklist{display:flex}.p-picklist-buttons{display:flex;flex-direction:column;justify-content:center}.p-picklist-list-wrapper{flex:1 1 50%}.p-picklist-list{list-style-type:none;margin:0;padding:0;overflow:auto;min-height:12rem;max-height:24rem}.p-picklist-item{cursor:pointer;overflow:hidden;position:relative}
+.p-picklist{display:flex}.p-picklist-buttons{display:flex;flex-direction:column;justify-content:center}.p-picklist-list-wrapper{flex:1 1 50%}.p-picklist-list{list-style-type:none;margin:0;padding:0;overflow:auto;min-height:12rem;max-height:24rem}.p-picklist-item{cursor:pointer;overflow:hidden;position:relative}.p-picklist-filter{position:relative}.p-picklist-filter-icon{position:absolute;top:50%;margin-top:-.5rem}.p-picklist-filter-input{width:100%}

package/picklist/picklist.min.js

@@ -1 +1 @@
-this.primereact=this.primereact||{},this.primereact.picklist=function(e,t,n,r,a,l){"use strict";function o(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 i=o(t);function c(){return c=Object.assign||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},c.apply(this,arguments)}function s(e){if(Array.isArray(e))return e}function u(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,a,l=[],o=!0,i=!1;try{for(n=n.call(e);!(o=(r=n.next()).done)&&(l.push(r.value),!t||l.length!==t);o=!0);}catch(e){i=!0,a=e}finally{try{o||null==n.return||n.return()}finally{if(i)throw a}}return l}}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 p(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 f(){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 m(e,t){return s(e)||u(e,t)||p(e,t)||f()}function g(e){if(Array.isArray(e))return d(e)}function v(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function y(){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 b(e){return g(e)||v(e)||p(e)||y()}var h=i.memo((function(e){var t=!e.selection.length,n=r.classNames("p-picklist-buttons",e.className);return i.createElement("div",{className:n},i.createElement(a.Button,{disabled:t,type:"button",icon:"pi pi-angle-up",onClick:function(t){var n=e.selection;if(n&&n.length){for(var a=b(e.list),l=0;l<n.length;l++){var o=r.ObjectUtils.findIndexInList(n[l],a,e.dataKey);if(0===o)break;var i=a[o-1];a[o-1]=a[o],a[o]=i}e.onReorder&&e.onReorder({originalEvent:t,value:a,direction:"up"})}}}),i.createElement(a.Button,{disabled:t,type:"button",icon:"pi pi-angle-double-up",onClick:function(t){var n=e.selection;if(n&&n.length){for(var a=b(e.list),l=0;l<n.length;l++){var o=r.ObjectUtils.findIndexInList(n[l],a,e.dataKey);if(0===o)break;var i=a.splice(o,1)[0];a.unshift(i)}e.onReorder&&e.onReorder({originalEvent:t,value:a,direction:"top"})}}}),i.createElement(a.Button,{disabled:t,type:"button",icon:"pi pi-angle-down",onClick:function(t){var n=e.selection;if(n&&n.length){for(var a=b(e.list),l=n.length-1;l>=0;l--){var o=r.ObjectUtils.findIndexInList(n[l],a,e.dataKey);if(o===a.length-1)break;var i=a[o+1];a[o+1]=a[o],a[o]=i}e.onReorder&&e.onReorder({originalEvent:t,value:a,direction:"down"})}}}),i.createElement(a.Button,{disabled:t,type:"button",icon:"pi pi-angle-double-down",onClick:function(t){var n=e.selection;if(n&&n.length){for(var a=b(e.list),l=n.length-1;l>=0;l--){var o=r.ObjectUtils.findIndexInList(n[l],a,e.dataKey);if(o===a.length-1)break;var i=a.splice(o,1)[0];a.push(i)}e.onReorder&&e.onReorder({originalEvent:t,value:a,direction:"bottom"})}}}))}));h.displayName="PickListControls";var S=i.memo((function(e){var t=e.template?e.template(e.value):e.value,n=r.classNames("p-picklist-item",{"p-highlight":e.selected},e.className);return i.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,i.createElement(l.Ripple,null))}));S.displayName="PickListItem";var E=i.memo(i.forwardRef((function(e,t){var n=i.useRef(null),a=function(t){var n=t.originalEvent,a=t.value,l=b(e.selection),o=r.ObjectUtils.findIndexInList(a,l,e.dataKey),i=-1!==o;if(e.metaKeySelection){var c=n.metaKey||n.ctrlKey;i&&c?l.splice(o,1):(c||(l.length=0),l.push(a))}else i?l.splice(o,1):l.push(a);e.onSelectionChange&&e.onSelectionChange({event:n,value:l})},l=function(e){var t=e.originalEvent,n=t.currentTarget;switch(t.which){case 40:var r=o(n);r&&r.focus(),t.preventDefault();break;case 38:var l=c(n);l&&l.focus(),t.preventDefault();break;case 13:a(e),t.preventDefault()}},o=function e(t){var n=t.nextElementSibling;return n?r.DomHandler.hasClass(n,"p-picklist-item")?n:e(n):null},c=function e(t){var n=t.previousElementSibling;return n?r.DomHandler.hasClass(n,"p-picklist-item")?n:e(n):null},s=function(t){return-1!==r.ObjectUtils.findIndexInList(t,e.selection,e.dataKey)};i.useImperativeHandle(t,(function(){return{listElementRef:n}}));var u=r.classNames("p-picklist-list-wrapper",e.className),d=e.header?i.createElement("div",{className:"p-picklist-header"},r.ObjectUtils.getJSXElement(e.header,e)):null,p=function(){var t=e.list?e.list.map((function(t){var n=JSON.stringify(t),r=s(t);return i.createElement(S,{key:n,value:t,template:e.itemTemplate,selected:r,onClick:a,onKeyDown:l,tabIndex:e.tabIndex})})):null,n=r.classNames("p-picklist-list",e.listClassName);return i.createElement("ul",{className:n,style:e.style,role:"listbox","aria-multiselectable":!0},t)}();return i.createElement("div",{ref:n,className:u},d,p)})));E.displayName="PickListSubList";var T=i.memo((function(e){var t=r.ObjectUtils.isEmpty(e.sourceSelection),n=r.ObjectUtils.isEmpty(e.targetSelection),l=r.ObjectUtils.isEmpty(e.source),o=r.ObjectUtils.isEmpty(e.target),c=r.classNames("p-picklist-buttons p-picklist-transfer-buttons",e.className);return i.createElement("div",{className:c},i.createElement(a.Button,{disabled:t,type:"button",icon:"pi pi-angle-right",onClick:function(t){var n=e.sourceSelection;if(r.ObjectUtils.isNotEmpty(n)){for(var a=b(e.target),l=b(e.source),o=0;o<n.length;o++){var i=n[o];-1===r.ObjectUtils.findIndexInList(i,a,e.dataKey)&&a.push(l.splice(r.ObjectUtils.findIndexInList(i,l,e.dataKey),1)[0])}e.onTransfer&&e.onTransfer({originalEvent:t,source:l,target:a,direction:"toTarget"})}}}),i.createElement(a.Button,{disabled:l,type:"button",icon:"pi pi-angle-double-right",onClick:function(t){if(e.source){var n=[].concat(b(e.target),b(e.source));e.onTransfer&&e.onTransfer({originalEvent:t,source:[],target:n,direction:"allToTarget"})}}}),i.createElement(a.Button,{disabled:n,type:"button",icon:"pi pi-angle-left",onClick:function(t){var n=e.targetSelection;if(r.ObjectUtils.isNotEmpty(n)){for(var a=b(e.target),l=b(e.source),o=0;o<n.length;o++){var i=n[o];-1===r.ObjectUtils.findIndexInList(i,l,e.dataKey)&&l.push(a.splice(r.ObjectUtils.findIndexInList(i,a,e.dataKey),1)[0])}e.onTransfer&&e.onTransfer({originalEvent:t,source:l,target:a,direction:"toSource"})}}}),i.createElement(a.Button,{disabled:o,type:"button",icon:"pi pi-angle-double-left",onClick:function(t){if(e.source){var n=[].concat(b(e.source),b(e.target));e.onTransfer&&e.onTransfer({originalEvent:t,source:n,target:[],direction:"allToSource"})}}}))}));T.displayName="PickListTransferControls";var k=i.memo(i.forwardRef((function(e,t){var a=m(i.useState([]),2),l=a[0],o=a[1],s=m(i.useState([]),2),u=s[0],d=s[1],p=i.useRef(null),f=i.useRef(null),g=i.useRef(null),v=i.useRef(null),y=e.onSourceSelectionChange?e.sourceSelection:l,b=e.onTargetSelectionChange?e.targetSelection:u,S=function(e,t){if(e){var n=r.DomHandler.findSingle(e,".p-picklist-list");switch(t){case"up":N(n,-1);break;case"top":n.scrollTop=0;break;case"down":N(n,1);break;case"bottom":setTimeout((function(){return n.scrollTop=n.scrollHeight}),100)}}},C=function(t,n,r){e.onChange&&e.onChange({originalEvent:t.originalEvent,source:n,target:r})},N=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,n=e.getElementsByClassName("p-highlight");r.ObjectUtils.isNotEmpty(n)&&r.DomHandler.scrollInView(e,-1===t?n[0]:n[n.length-1])},I=function(e,t,n){n?n(e):"sourceSelection"===t?o(e.value):d(e.value),r.ObjectUtils.isNotEmpty(y)&&"targetSelection"===t?o([]):r.ObjectUtils.isNotEmpty(b)&&"sourceSelection"===t&&d([])};n.useUpdateEffect((function(){g.current&&(S(g.current,v.current),g.current=null,v.current=null)}));var K=r.ObjectUtils.findDiffKeys(e,k.defaultProps),O=r.classNames("p-picklist p-component",e.className);return i.createElement("div",c({id:e.id,className:O,style:e.style},K),e.showSourceControls&&i.createElement(h,{list:e.source,selection:y,onReorder:function(t){C(t,t.value,e.target),g.current=p.current.listElementRef.current,v.current=t.direction},className:"p-picklist-source-controls",dataKey:e.dataKey}),i.createElement(E,{ref:p,list:e.source,selection:y,onSelectionChange:function(t){return I(t,"sourceSelection",e.onSourceSelectionChange)},itemTemplate:e.itemTemplate,header:e.sourceHeader,style:e.sourceStyle,className:"p-picklist-source-wrapper",listClassName:"p-picklist-source",metaKeySelection:e.metaKeySelection,tabIndex:e.tabIndex,dataKey:e.dataKey}),i.createElement(T,{onTransfer:function(t){var n=t.originalEvent,r=t.source,a=t.target;switch(t.direction){case"toTarget":e.onMoveToTarget&&e.onMoveToTarget({originalEvent:n,value:y});break;case"allToTarget":e.onMoveAllToTarget&&e.onMoveAllToTarget({originalEvent:n,value:e.source});break;case"toSource":e.onMoveToSource&&e.onMoveToSource({originalEvent:n,value:b});break;case"allToSource":e.onMoveAllToSource&&e.onMoveAllToSource({originalEvent:n,value:e.target})}I({originalEvent:n,value:[]},"sourceSelection",e.onSourceSelectionChange),I({originalEvent:n,value:[]},"targetSelection",e.onTargetSelectionChange),C(t,r,a)},source:e.source,target:e.target,sourceSelection:y,targetSelection:b,dataKey:e.dataKey}),i.createElement(E,{ref:f,list:e.target,selection:b,onSelectionChange:function(t){return I(t,"targetSelection",e.onTargetSelectionChange)},itemTemplate:e.itemTemplate,header:e.targetHeader,style:e.targetStyle,className:"p-picklist-target-wrapper",listClassName:"p-picklist-target",metaKeySelection:e.metaKeySelection,tabIndex:e.tabIndex,dataKey:e.dataKey}),e.showTargetControls&&i.createElement(h,{list:e.target,selection:b,onReorder:function(t){C(t,e.source,t.value),g.current=f.current.listElementRef.current,v.current=t.direction},className:"p-picklist-target-controls",dataKey:e.dataKey}))})));return k.displayName="PickList",k.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,tabIndex:0,dataKey:null,itemTemplate:null,onChange:null,onMoveToSource:null,onMoveAllToSource:null,onMoveToTarget:null,onMoveAllToTarget:null,onSourceSelectionChange:null,onTargetSelectionChange:null},e.PickList=k,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.hooks,primereact.utils,primereact.button,primereact.ripple);
+this.primereact=this.primereact||{},this.primereact.picklist=function(e,t,n,r,l,i,a){"use strict";function o(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 c=o(t);function s(){return s=Object.assign||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},s.apply(this,arguments)}function u(e){if(Array.isArray(e))return e}function p(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,l,i=[],a=!0,o=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){o=!0,l=e}finally{try{a||null==n.return||n.return()}finally{if(o)throw l}}return i}}function f(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 m(e,t){if(e){if("string"==typeof e)return f(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)?f(e,t):void 0}}function d(){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 g(e,t){return u(e)||p(e,t)||m(e,t)||d()}function v(e){if(Array.isArray(e))return f(e)}function y(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function b(){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 v(e)||y(e)||m(e)||b()}var S=c.memo((function(e){var t=!e.selection.length,n=l.classNames("p-picklist-buttons",e.className);return c.createElement("div",{className:n},c.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=h(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"})}}}),c.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=h(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"})}}}),c.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=h(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"})}}}),c.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=h(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"})}}}))}));S.displayName="PickListControls";var T=c.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 c.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,c.createElement(a.Ripple,null))}));T.displayName="PickListItem";var E=c.memo(c.forwardRef((function(e,t){var n=c.useRef(null),r=function(t){var n=t.originalEvent,r=t.value,i=h(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},s=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()};c.useImperativeHandle(t,(function(){return{listElementRef:n}}));var f=l.classNames("p-picklist-list-wrapper",e.className),m=e.header?c.createElement("div",{className:"p-picklist-header"},l.ObjectUtils.getJSXElement(e.header,e)):null,d=function(){if(e.showFilter){var t=c.createElement("div",{className:"p-picklist-filter"},c.createElement("input",{type:"text",value:e.filterValue,onChange:u,onKeyDown:p,placeholder:e.placeholder,className:"p-picklist-filter-input p-inputtext p-component"}),c.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 c.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=s(t);return c.createElement(T,{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 c.createElement("ul",{className:n,style:e.style,role:"listbox","aria-multiselectable":!0},t)}();return c.createElement("div",{ref:n,className:f},m,d,g)})));E.displayName="PickListSubList";var k=c.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 c.createElement("div",{className:o},c.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=h(e.target),i=h(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"})}}}),c.createElement(i.Button,{disabled:r,type:"button",icon:"pi pi-angle-double-right",onClick:function(t){if(e.source){var n=[].concat(h(e.target),h(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"})}}}),c.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=h(e.target),i=h(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"})}}}),c.createElement(i.Button,{disabled:a,type:"button",icon:"pi pi-angle-double-left",onClick:function(t){if(e.source){var n=[].concat(h(e.source),h(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"})}}}))}));k.displayName="PickListTransferControls";var C=c.memo(c.forwardRef((function(e,t){var i=g(c.useState([]),2),a=i[0],o=i[1],u=g(c.useState([]),2),p=u[0],f=u[1],m=g(c.useState(""),2),d=m[0],v=m[1],y=g(c.useState(""),2),b=y[0],h=y[1],T=c.useRef(null),N=c.useRef(null),I=c.useRef(null),w=c.useRef(null),O=e.onSourceSelectionChange?e.sourceSelection:a,j=e.onTargetSelectionChange?e.targetSelection:p,K=e.onSourceFilterChange?e.sourceFilterValue:d,L=e.onTargetFilterChange?e.targetFilterValue:b,F=l.ObjectUtils.isNotEmpty(e.filterBy),U=F&&e.showSourceFilter,x=F&&e.showTargetFilter,R=function(e,t){if(e){var n=l.DomHandler.findSingle(e,".p-picklist-list");switch(t){case"up":P(n,-1);break;case"top":n.scrollTop=0;break;case"down":P(n,1);break;case"bottom":setTimeout((function(){return n.scrollTop=n.scrollHeight}),100)}}},M=function(t,n,r){e.onChange&&e.onChange({originalEvent:t.originalEvent,source:n,target:r})},P=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])},D=function(e,t,n){n?n(e):"sourceSelection"===t?o(e.value):f(e.value),l.ObjectUtils.isNotEmpty(O)&&"targetSelection"===t?o([]):l.ObjectUtils.isNotEmpty(j)&&"sourceSelection"===t&&f([])},A=function(t){var n=t.originalEvent,r=t.value,l=g("source"===t.type?[v,e.onSourceFilterChange]:[h,e.onTargetFilterChange],2),i=l[0],a=l[1];a?a({originalEvent:n,value:r}):i(r)},B=function(e,t){var n=g("source"===t?[K,H]:[L,V],2),r=n[0],i=n[1];return F&&l.ObjectUtils.isNotEmpty(r)?i(r):e},H=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",n=t.trim().toLocaleLowerCase(e.filterLocale);return _(e.source,n)},V=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",n=t.trim().toLocaleLowerCase(e.filterLocale);return _(e.target,n)},_=function(t,r){var l=F?e.filterBy.split(","):[];return n.FilterService.filter(t,l,r,e.filterMatchMode,e.filterLocale)};r.useUpdateEffect((function(){I.current&&(R(I.current,w.current),I.current=null,w.current=null)}));var J=l.ObjectUtils.findDiffKeys(e,C.defaultProps),X=l.classNames("p-picklist p-component",e.className),z=e.sourceItemTemplate?e.sourceItemTemplate:e.itemTemplate,Y=e.targetItemTemplate?e.targetItemTemplate:e.itemTemplate,$=B(e.source,"source"),q=B(e.target,"target");return c.createElement("div",s({id:e.id,className:X,style:e.style},J),e.showSourceControls&&c.createElement(S,{list:e.source,selection:O,onReorder:function(t){M(t,t.value,e.target),I.current=T.current.listElementRef.current,w.current=t.direction},className:"p-picklist-source-controls",dataKey:e.dataKey}),c.createElement(E,{ref:T,type:"source",list:$,selection:O,onSelectionChange:function(t){return D(t,"sourceSelection",e.onSourceSelectionChange)},itemTemplate:z,header:e.sourceHeader,style:e.sourceStyle,className:"p-picklist-source-wrapper",listClassName:"p-picklist-source",metaKeySelection:e.metaKeySelection,tabIndex:e.tabIndex,dataKey:e.dataKey,filterValue:K,onFilter:A,showFilter:U,placeholder:e.sourceFilterPlaceholder,template:e.sourceFilterTemplate}),c.createElement(k,{onTransfer:function(t){var n=t.originalEvent,r=t.source,l=t.target;switch(t.direction){case"toTarget":e.onMoveToTarget&&e.onMoveToTarget({originalEvent:n,value:O});break;case"allToTarget":e.onMoveAllToTarget&&e.onMoveAllToTarget({originalEvent:n,value:e.source});break;case"toSource":e.onMoveToSource&&e.onMoveToSource({originalEvent:n,value:j});break;case"allToSource":e.onMoveAllToSource&&e.onMoveAllToSource({originalEvent:n,value:e.target})}D({originalEvent:n,value:[]},"sourceSelection",e.onSourceSelectionChange),D({originalEvent:n,value:[]},"targetSelection",e.onTargetSelectionChange),M(t,r,l)},source:e.source,visibleSourceList:$,target:e.target,visibleTargetList:q,sourceSelection:O,targetSelection:j,dataKey:e.dataKey}),c.createElement(E,{ref:N,type:"target",list:q,selection:j,onSelectionChange:function(t){return D(t,"targetSelection",e.onTargetSelectionChange)},itemTemplate:Y,header:e.targetHeader,style:e.targetStyle,className:"p-picklist-target-wrapper",listClassName:"p-picklist-target",metaKeySelection:e.metaKeySelection,tabIndex:e.tabIndex,dataKey:e.dataKey,filterValue:L,onFilter:A,showFilter:x,placeholder:e.targetFilterPlaceholder,template:e.targetFilterTemplate}),e.showTargetControls&&c.createElement(S,{list:e.target,selection:j,onReorder:function(t){M(t,e.source,t.value),I.current=N.current.listElementRef.current,w.current=t.direction},className:"p-picklist-target-controls",dataKey:e.dataKey}))})));return C.displayName="PickList",C.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,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,itemTemplate:null,sourceItemTemplate:null,targetItemTemplate:null,onChange:null,onMoveToSource:null,onMoveAllToSource:null,onMoveToTarget:null,onMoveAllToTarget:null,onSourceSelectionChange:null,onTargetSelectionChange:null,onSourceFilterChange:null,onTargetFilterChange:null},e.PickList=C,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.hooks,primereact.utils,primereact.button,primereact.ripple);