primereact/listbox/listbox.esm.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

import*as e from"react";import{FilterService as t,localeOption as r}from"primereact/api";import{useMountEffect as n}from"primereact/hooks";import{Tooltip as l}from"primereact/tooltip";import{ObjectUtils as o,classNames as i,DomHandler as a}from"primereact/utils";import{VirtualScroller as u}from"primereact/virtualscroller";import{InputText as c}from"primereact/inputtext";import{Ripple as s}from"primereact/ripple";function p(){return p=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},p.apply(this,arguments)}function f(e){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},f(e)}function m(e,t){if("object"!==f(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==f(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function d(e){var t=m(e,"string");return"symbol"===f(t)?t:String(t)}function b(e,t,r){return(t=d(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function v(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 y(e){if(Array.isArray(e))return v(e)}function g(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function h(e,t){if(e){if("string"==typeof e)return v(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)?v(e,t):void 0}}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 S(e){return y(e)||g(e)||h(e)||E()}function O(e){if(Array.isArray(e))return e}function x(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,l,o,i,a=[],u=!0,c=!1;try{if(o=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;u=!1}else for(;!(u=(n=o.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&&(i=r.return(),Object(i)!==i))return}finally{if(c)throw l}}return a}}function P(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var w={defaultProps:{__TYPE:"ListBox",className:null,dataKey:null,disabled:null,emptyFilterMessage:null,emptyMessage:null,filter:!1,filterBy:null,filterInputProps:null,filterLocale:void 0,filterMatchMode:"contains",filterPlaceholder:null,filterTemplate:null,filterValue:null,id:null,itemTemplate:null,listClassName:null,listStyle:null,metaKeySelection:!1,multiple:!1,onChange:null,onFilterValueChange:null,optionDisabled:null,optionGroupChildren:null,optionGroupLabel:null,optionGroupTemplate:null,optionLabel:null,optionValue:null,options:null,style:null,tabIndex:0,tooltip:null,tooltipOptions:null,value:null,virtualScrollerOptions:null,children:void 0},getProps:function(e){return o.getMergedProps(e,w.defaultProps)},getOtherProps:function(e){return o.getDiffProps(e,w.defaultProps)}},C=e.memo((function(t){var r={filter:function(e){return n(e)},reset:function(){return t.resetFilter()}},n=function(e){t.onFilter&&t.onFilter({originalEvent:e,value:e.target.value})},l=function(){var l=e.createElement("div",{className:"p-listbox-filter-container"},e.createElement(c,p({type:"text",value:t.filter,onChange:n,className:"p-listbox-filter",disabled:t.disabled,placeholder:t.filterPlaceholder},t.filterInputProps)),e.createElement("span",{className:"p-listbox-filter-icon pi pi-search"}));t.filterTemplate&&(l=o.getJSXElement(t.filterTemplate,{className:"p-listbox-filter-container",element:l,filterOptions:r,filterInputChange:n,filterIconClassName:"p-dropdown-filter-icon pi pi-search",props:t}));return e.createElement("div",{className:"p-listbox-header"},l)}();return e.createElement(e.Fragment,null,l)}));C.displayName="ListBoxHeader";var T=e.memo((function(t){var r=function(e){t.onClick&&t.onClick({originalEvent:e,option:t.option}),e.preventDefault()},n=function e(t){var r=t.nextElementSibling;return r?a.hasClass(r,"p-disabled")||a.hasClass(r,"p-listbox-item-group")?e(r):r:null},l=function e(t){var r=t.previousElementSibling;return r?a.hasClass(r,"p-disabled")||a.hasClass(r,"p-listbox-item-group")?e(r):r:null},u=i("p-listbox-item",{"p-highlight":t.selected,"p-disabled":t.disabled},t.option.className),c=t.template?o.getJSXElement(t.template,t.option):t.label;return e.createElement("li",{className:u,style:t.style,onClick:r,onTouchEnd:function(e){t.onTouchEnd&&t.onTouchEnd({originalEvent:e,option:t.option})},onKeyDown:function(e){var t=e.currentTarget;switch(e.which){case 40:var o=n(t);o&&o.focus(),e.preventDefault();break;case 38:var i=l(t);i&&i.focus(),e.preventDefault();break;case 13:r(e),e.preventDefault()}},tabIndex:"-1","aria-label":t.label,key:t.label,role:"option","aria-selected":t.selected,"aria-disabled":t.disabled},c,e.createElement(s,null))}));function j(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function F(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?j(Object(r),!0).forEach((function(t){b(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):j(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function I(e,t){var r="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!r){if(Array.isArray(e)||(r=N(e))||t&&e&&"number"==typeof e.length){r&&(e=r);var n=0,l=function(){};return{s:l,n:function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}},e:function(e){throw e},f:l}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var o,i=!0,a=!1;return{s:function(){r=r.call(e)},n:function(){var e=r.next();return i=e.done,e},e:function(e){a=!0,o=e},f:function(){try{i||null==r.return||r.return()}finally{if(a)throw o}}}}function N(e,t){if(e){if("string"==typeof e)return D(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)?D(e,t):void 0}}function D(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}T.displayName="ListBoxItem";var L=e.memo(e.forwardRef((function(c,s){var f,m,d=w.getProps(c),b=e.useState(""),v=(m=2,O(f=b)||x(f,m)||h(f,m)||P()),y=v[0],g=v[1],E=e.useRef(null),j=e.useRef(null),N=e.useRef(!1),D=(d.onFilterValueChange?d.filterValue:y)||"",L=D&&D.trim().length>0,A=function(e){var t=e.option;d.disabled||$(t)||(d.multiple?k(e.originalEvent,t):K(e.originalEvent,t),N.current=!1)},M=function(){d.disabled||(N.current=!0)},K=function(e,t){var r=X(t),n=!1,l=null;!N.current&&d.metaKeySelection?r?(e.metaKey||e.ctrlKey)&&(l=null,n=!0):(l=H(t),n=!0):(l=r?null:H(t),n=!0);n&&B(e,l)},k=function(e,t){var r=X(t),n=!1,l=null;if(!N&&d.metaKeySelection){var o=e.metaKey||e.ctrlKey;r?(l=o?R(t):[H(t)],n=!0):(l=[].concat(S(l=o&&d.value||[]),[H(t)]),n=!0)}else l=r?R(t):[].concat(S(d.value||[]),[H(t)]),n=!0;n&&d.onChange({originalEvent:e,value:l,stopPropagation:function(){},preventDefault:function(){},target:{name:d.name,id:d.id,value:l}})},G=function(e){j.current&&j.current.scrollToIndex(0);var t=e.value;d.onFilterValueChange?d.onFilterValueChange({originalEvent:e.originalEvent,value:t}):g(t)},V=function(){g(""),d.onFilter&&d.onFilter({filter:""})},B=function(e,t){d.onChange&&d.onChange({originalEvent:e,value:t,stopPropagation:function(){},preventDefault:function(){},target:{name:d.name,id:d.id,value:t}})},R=function(e){return d.value.filter((function(t){return!o.equals(t,H(e),d.dataKey)}))},_=function(){if(null!=d.value&&re){if(!d.optionGroupLabel)return J(d.value,re);for(var e=0;e<re.length;e++){var t=J(d.value,Q(re[e]));if(-1!==t)return{group:e,option:t}}}return-1},q=function(){return d.optionValue?null:d.dataKey},J=function(e,t){var r=q();return t.findIndex((function(t){return o.equals(e,H(t),r)}))},X=function(e){var t=H(e),r=q();return d.multiple&&d.value?d.value.some((function(e){return o.equals(e,t,r)})):o.equals(d.value,t,r)},z=function(e){return d.optionLabel?o.resolveFieldData(e,d.optionLabel):e&&void 0!==e.label?e.label:e},H=function(e){return d.optionValue?o.resolveFieldData(e,d.optionValue):e&&void 0!==e.value?e.value:e},U=function(e){return d.dataKey?o.resolveFieldData(e,d.dataKey):z(e)},$=function(e){return d.optionDisabled?o.isFunction(d.optionDisabled)?d.optionDisabled(e):o.resolveFieldData(e,d.optionDisabled):!(!e||void 0===e.disabled)&&e.disabled},Y=function(e){return o.resolveFieldData(e,d.optionGroupLabel)},Q=function(e){return o.resolveFieldData(e,d.optionGroupChildren)},W=function(){if(j.current){var e=_();-1!==e&&setTimeout((function(){return j.current.scrollToIndex(e)}),0)}};e.useImperativeHandle(s,(function(){return{props:d,focus:function(){return a.focusFirstElement(E.current)},getElement:function(){return E.current},getVirtualScroller:function(){return j.current}}})),n((function(){W()}));var Z=function(t,r){return Q(t).map((function(t,n){var l=z(t),o=n+"_"+U(t),i=$(t),a=i?null:d.tabIndex||0;return e.createElement(T,{key:o,label:l,option:t,style:r,template:d.itemTemplate,selected:X(t),onClick:A,onTouchEnd:M,tabIndex:a,disabled:i})}))},ee=function(t,r){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},l={height:n.props?n.props.itemSize:void 0};if(d.optionGroupLabel){var i=d.optionGroupTemplate?o.getJSXElement(d.optionGroupTemplate,t,r):o.resolveFieldData(t,d.optionGroupLabel),a=Z(t,l),u=r+"_"+Y(t);return e.createElement(e.Fragment,{key:u},e.createElement("li",{className:"p-listbox-item-group",style:l,role:"group"},i),a)}var c=z(t),s=r+"_"+U(t),p=$(t),f=p?null:d.tabIndex||0;return e.createElement(T,{key:s,label:c,option:t,style:l,template:d.itemTemplate,selected:X(t),onClick:A,onTouchEnd:M,tabIndex:f,disabled:p})},te=function(t,n){var l=o.getJSXElement(t,d)||r(n?"emptyFilterMessage":"emptyMessage");return e.createElement("li",{className:"p-listbox-empty-message"},l)},re=function(){if(L){var e=D.trim().toLocaleLowerCase(d.filterLocale),r=d.filterBy?d.filterBy.split(","):[d.optionLabel||"label"];if(d.optionGroupLabel){var n,l=[],o=I(d.options);try{for(o.s();!(n=o.n()).done;){var i=n.value,a=t.filter(Q(i),r,e,d.filterMatchMode,d.filterLocale);a&&a.length&&l.push(F(F({},i),{items:a}))}}catch(e){o.e(e)}finally{o.f()}return l}return t.filter(d.options,r,e,d.filterMatchMode,d.filterLocale)}return d.options}(),ne=o.isNotEmpty(d.tooltip),le=w.getOtherProps(d),oe=o.reduceKeys(le,a.ARIA_PROPS),ie=i("p-listbox p-component",{"p-disabled":d.disabled},d.className),ae=i("p-listbox-list-wrapper",d.listClassName),ue=function(){if(d.virtualScrollerOptions){var t=F(F({},d.virtualScrollerOptions),{items:re,onLazyLoad:function(e){return d.virtualScrollerOptions.onLazyLoad(F(F({},e),{filter:re}))},itemTemplate:function(e,t){return e&&ee(e,t.index,t)},contentTemplate:function(t){var r=i("p-listbox-list",t.className);return e.createElement("ul",p({ref:t.contentRef,style:t.style,className:r,role:"listbox","aria-multiselectable":d.multiple},oe),t.children)}});return e.createElement(u,p({ref:j},t))}var r=o.isNotEmpty(re)?re.map(ee):L?te(d.emptyFilterMessage,!0):te(d.emptyMessage);return e.createElement("ul",p({className:"p-listbox-list",role:"listbox","aria-multiselectable":d.multiple},oe),r)}(),ce=d.filter?e.createElement(C,{filter:D,onFilter:G,resetFilter:V,filterTemplate:d.filterTemplate,disabled:d.disabled,filterPlaceholder:d.filterPlaceholder,filterInputProps:d.filterInputProps}):null;return e.createElement(e.Fragment,null,e.createElement("div",p({ref:E,id:d.id,className:ie,style:d.style},le),ce,e.createElement("div",{className:ae,style:d.listStyle},ue)),ne&&e.createElement(l,p({target:E,content:d.tooltip},d.tooltipOptions)))})));L.displayName="ListBox";export{L as ListBox};