primereact 9.5.0 → 9.6.1

package/listbox/listbox.esm.js

@@ -1,11 +1,12 @@
 import * as React from 'react';
-import { FilterService, localeOption } from 'primereact/api';
+import { PrimeReactContext, FilterService, localeOption } from 'primereact/api';
 import { useMountEffect } from 'primereact/hooks';
 import { Tooltip } from 'primereact/tooltip';
-import { ObjectUtils, IconUtils, classNames, DomHandler } from 'primereact/utils';
+import { mergeProps, IconUtils, ObjectUtils, classNames, DomHandler } from 'primereact/utils';
 import { VirtualScroller } from 'primereact/virtualscroller';
-import { InputText } from 'primereact/inputtext';
+import { ComponentBase } from 'primereact/componentbase';
 import { SearchIcon } from 'primereact/icons/search';
+import { InputText } from 'primereact/inputtext';
 import { Ripple } from 'primereact/ripple';
 
 function _extends() {
@@ -135,7 +136,7 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest();
 }
 
-var ListBoxBase = {
+var ListBoxBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'ListBox',
     className: null,
@@ -174,15 +175,11 @@ var ListBoxBase = {
     value: null,
     virtualScrollerOptions: null,
     children: undefined
-  },
-  getProps: function getProps(props) {
-    return ObjectUtils.getMergedProps(props, ListBoxBase.defaultProps);
-  },
-  getOtherProps: function getOtherProps(props) {
-    return ObjectUtils.getDiffProps(props, ListBoxBase.defaultProps);
   }
-};
+});
 
+function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var ListBoxHeader = /*#__PURE__*/React.memo(function (props) {
   var filterOptions = {
     filter: function filter(e) {
@@ -202,24 +199,29 @@ var ListBoxHeader = /*#__PURE__*/React.memo(function (props) {
   };
   var createHeader = function createHeader() {
     var iconClassName = 'p-listbox-filter-icon';
-    var icon = props.filterIcon || /*#__PURE__*/React.createElement(SearchIcon, {
-      className: iconClassName
-    });
-    var filterIcon = IconUtils.getJSXIcon(icon, {
+    var filterIconProps = mergeProps({
       className: iconClassName
-    }, {
+    }, props.ptm('filterIcon'));
+    var icon = props.filterIcon || /*#__PURE__*/React.createElement(SearchIcon, filterIconProps);
+    var filterIcon = IconUtils.getJSXIcon(icon, _objectSpread$1({}, filterIconProps), {
       props: props
     });
-    var content = /*#__PURE__*/React.createElement("div", {
-      className: "p-listbox-filter-container"
-    }, /*#__PURE__*/React.createElement(InputText, _extends({
+    var headerProps = mergeProps({
+      className: 'p-listbox-header'
+    }, props.ptm('header'));
+    var filterContainerProps = mergeProps({
+      className: 'p-listbox-filter-container'
+    }, props.ptm('filterContainer'));
+    var content = /*#__PURE__*/React.createElement("div", filterContainerProps, /*#__PURE__*/React.createElement(InputText, _extends({
       type: "text",
       value: props.filter,
       onChange: onFilter,
       className: "p-listbox-filter",
       disabled: props.disabled,
       placeholder: props.filterPlaceholder
-    }, props.filterInputProps)), filterIcon);
+    }, props.filterInputProps, {
+      pt: props.ptm('filterInput')
+    })), filterIcon);
     if (props.filterTemplate) {
       var defaultContentOptions = {
         className: 'p-listbox-filter-container',
@@ -231,9 +233,7 @@ var ListBoxHeader = /*#__PURE__*/React.memo(function (props) {
       };
       content = ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
     }
-    return /*#__PURE__*/React.createElement("div", {
-      className: "p-listbox-header"
-    }, content);
+    return /*#__PURE__*/React.createElement("div", headerProps, content);
   };
   var content = createHeader();
   return /*#__PURE__*/React.createElement(React.Fragment, null, content);
@@ -241,6 +241,14 @@ var ListBoxHeader = /*#__PURE__*/React.memo(function (props) {
 ListBoxHeader.displayName = 'ListBoxHeader';
 
 var ListBoxItem = /*#__PURE__*/React.memo(function (props) {
+  var getPTOptions = function getPTOptions(key) {
+    return props.ptm(key, {
+      context: {
+        selected: props.selected,
+        disabled: props.disabled
+      }
+    });
+  };
   var onClick = function onClick(event) {
     if (props.onClick) {
       props.onClick({
@@ -295,19 +303,20 @@ var ListBoxItem = /*#__PURE__*/React.memo(function (props) {
     'p-disabled': props.disabled
   }, props.option.className);
   var content = props.template ? ObjectUtils.getJSXElement(props.template, props.option) : props.label;
-  return /*#__PURE__*/React.createElement("li", {
+  var itemProps = mergeProps({
     className: className,
     style: props.style,
     onClick: onClick,
     onTouchEnd: onTouchEnd,
     onKeyDown: onKeyDown,
-    tabIndex: "-1",
-    "aria-label": props.label,
+    tabIndex: '-1',
+    'aria-label': props.label,
     key: props.label,
-    role: "option",
-    "aria-selected": props.selected,
-    "aria-disabled": props.disabled
-  }, content, /*#__PURE__*/React.createElement(Ripple, null));
+    role: 'option',
+    'aria-selected': props.selected,
+    'aria-disabled': props.disabled
+  }, getPTOptions('item'));
+  return /*#__PURE__*/React.createElement("li", itemProps, content, /*#__PURE__*/React.createElement(Ripple, null));
 });
 ListBoxItem.displayName = 'ListBoxItem';
 
@@ -317,7 +326,8 @@ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (inProps, ref) {
-  var props = ListBoxBase.getProps(inProps);
+  var context = React.useContext(PrimeReactContext);
+  var props = ListBoxBase.getProps(inProps, context);
   var _React$useState = React.useState(''),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     filterValueState = _React$useState2[0],
@@ -327,6 +337,13 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
   var optionTouched = React.useRef(false);
   var filteredValue = (props.onFilterValueChange ? props.filterValue : filterValueState) || '';
   var hasFilter = filteredValue && filteredValue.trim().length > 0;
+  var _ListBoxBase$setMetaD = ListBoxBase.setMetaData({
+      props: props,
+      state: {
+        filterValue: filteredValue
+      }
+    }),
+    ptm = _ListBoxBase$setMetaD.ptm;
   var onOptionSelect = function onOptionSelect(event) {
     var option = event.option;
     if (props.disabled || isOptionDisabled(option)) {
@@ -570,7 +587,8 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
       filterTemplate: props.filterTemplate,
       disabled: props.disabled,
       filterPlaceholder: props.filterPlaceholder,
-      filterInputProps: props.filterInputProps
+      filterInputProps: props.filterInputProps,
+      ptm: ptm
     }) : null;
   };
   var createGroupChildren = function createGroupChildren(optionGroup, style) {
@@ -590,7 +608,8 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
         onClick: onOptionSelect,
         onTouchEnd: onOptionTouchEnd,
         tabIndex: tabIndex,
-        disabled: disabled
+        disabled: disabled,
+        ptm: ptm
       });
     });
   };
@@ -603,13 +622,14 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
       var groupContent = props.optionGroupTemplate ? ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : getOptionGroupLabel(option);
       var groupChildrenContent = createGroupChildren(option, style);
       var key = index + '_' + getOptionGroupRenderKey(option);
+      var itemGroupProps = mergeProps({
+        className: 'p-listbox-item-group',
+        style: style,
+        role: 'group'
+      }, ptm('itemGroup'));
       return /*#__PURE__*/React.createElement(React.Fragment, {
         key: key
-      }, /*#__PURE__*/React.createElement("li", {
-        className: "p-listbox-item-group",
-        style: style,
-        role: "group"
-      }, groupContent), groupChildrenContent);
+      }, /*#__PURE__*/React.createElement("li", itemGroupProps, groupContent), groupChildrenContent);
     } else {
       var optionLabel = getOptionLabel(option);
       var optionKey = index + '_' + getOptionRenderKey(option);
@@ -625,7 +645,8 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
         onClick: onOptionSelect,
         onTouchEnd: onOptionTouchEnd,
         tabIndex: tabIndex,
-        disabled: disabled
+        disabled: disabled,
+        ptm: ptm
       });
     }
   };
@@ -638,10 +659,11 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
     return createEmptyMessage(props.emptyMessage);
   };
   var createEmptyMessage = function createEmptyMessage(emptyMessage, isFilter) {
+    var emptyMessageProps = mergeProps({
+      className: 'p-listbox-empty-message'
+    }, ptm('emptyMessage'));
     var message = ObjectUtils.getJSXElement(emptyMessage, props) || localeOption(isFilter ? 'emptyFilterMessage' : 'emptyMessage');
-    return /*#__PURE__*/React.createElement("li", {
-      className: "p-listbox-empty-message"
-    }, message);
+    return /*#__PURE__*/React.createElement("li", emptyMessageProps, message);
   };
   var createList = function createList() {
     if (props.virtualScrollerOptions) {
@@ -657,25 +679,29 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
         },
         contentTemplate: function contentTemplate(options) {
           var className = classNames('p-listbox-list', options.className);
-          return /*#__PURE__*/React.createElement("ul", _extends({
+          var listProps = mergeProps(_objectSpread({
             ref: options.contentRef,
             style: options.style,
             className: className,
-            role: "listbox",
-            "aria-multiselectable": props.multiple
-          }, ariaProps), options.children);
+            role: 'listbox',
+            'aria-multiselectable': props.multiple
+          }, ariaProps), ptm('list'));
+          return /*#__PURE__*/React.createElement("ul", listProps, options.children);
         }
       });
       return /*#__PURE__*/React.createElement(VirtualScroller, _extends({
         ref: virtualScrollerRef
-      }, virtualScrollerProps));
+      }, virtualScrollerProps, {
+        pt: ptm('virtualScroller')
+      }));
     } else {
       var items = createItems();
-      return /*#__PURE__*/React.createElement("ul", _extends({
-        className: "p-listbox-list",
-        role: "listbox",
-        "aria-multiselectable": props.multiple
-      }, ariaProps), items);
+      var listProps = mergeProps(_objectSpread({
+        className: 'p-listbox-list',
+        role: 'listbox',
+        'aria-multiselectable': props.multiple
+      }, ariaProps), ptm('list'));
+      return /*#__PURE__*/React.createElement("ul", listProps, items);
     }
   };
   var visibleOptions = getVisibleOptions();
@@ -688,18 +714,22 @@ var ListBox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (i
   var listClassName = classNames('p-listbox-list-wrapper', props.listClassName);
   var list = createList();
   var header = createHeader();
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", _extends({
+  var wrapperProps = mergeProps({
+    className: listClassName,
+    style: props.listStyle
+  }, ptm('wrapper'));
+  var rootProps = mergeProps({
     ref: elementRef,
     id: props.id,
     className: className,
     style: props.style
-  }, otherProps), header, /*#__PURE__*/React.createElement("div", {
-    className: listClassName,
-    style: props.listStyle
-  }, list)), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({
+  }, ListBoxBase.getOtherProps(props), ptm('root'));
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", rootProps, header, /*#__PURE__*/React.createElement("div", wrapperProps, list)), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({
     target: elementRef,
     content: props.tooltip
-  }, props.tooltipOptions)));
+  }, props.tooltipOptions, {
+    pt: ptm('tooltip')
+  })));
 }));
 ListBox.displayName = 'ListBox';
 

package/listbox/listbox.esm.min.js

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

package/listbox/listbox.js

@@ -1,5 +1,5 @@
 this.primereact = this.primereact || {};
-this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils, virtualscroller, inputtext, search, ripple) {
+this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils, virtualscroller, componentbase, search, inputtext, ripple) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -149,7 +149,7 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
     return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest();
   }
 
-  var ListBoxBase = {
+  var ListBoxBase = componentbase.ComponentBase.extend({
     defaultProps: {
       __TYPE: 'ListBox',
       className: null,
@@ -188,15 +188,11 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
       value: null,
       virtualScrollerOptions: null,
       children: undefined
-    },
-    getProps: function getProps(props) {
-      return utils.ObjectUtils.getMergedProps(props, ListBoxBase.defaultProps);
-    },
-    getOtherProps: function getOtherProps(props) {
-      return utils.ObjectUtils.getDiffProps(props, ListBoxBase.defaultProps);
     }
-  };
+  });
 
+  function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+  function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var ListBoxHeader = /*#__PURE__*/React__namespace.memo(function (props) {
     var filterOptions = {
       filter: function filter(e) {
@@ -216,24 +212,29 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
     };
     var createHeader = function createHeader() {
       var iconClassName = 'p-listbox-filter-icon';
-      var icon = props.filterIcon || /*#__PURE__*/React__namespace.createElement(search.SearchIcon, {
-        className: iconClassName
-      });
-      var filterIcon = utils.IconUtils.getJSXIcon(icon, {
+      var filterIconProps = utils.mergeProps({
         className: iconClassName
-      }, {
+      }, props.ptm('filterIcon'));
+      var icon = props.filterIcon || /*#__PURE__*/React__namespace.createElement(search.SearchIcon, filterIconProps);
+      var filterIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$1({}, filterIconProps), {
         props: props
       });
-      var content = /*#__PURE__*/React__namespace.createElement("div", {
-        className: "p-listbox-filter-container"
-      }, /*#__PURE__*/React__namespace.createElement(inputtext.InputText, _extends({
+      var headerProps = utils.mergeProps({
+        className: 'p-listbox-header'
+      }, props.ptm('header'));
+      var filterContainerProps = utils.mergeProps({
+        className: 'p-listbox-filter-container'
+      }, props.ptm('filterContainer'));
+      var content = /*#__PURE__*/React__namespace.createElement("div", filterContainerProps, /*#__PURE__*/React__namespace.createElement(inputtext.InputText, _extends({
         type: "text",
         value: props.filter,
         onChange: onFilter,
         className: "p-listbox-filter",
         disabled: props.disabled,
         placeholder: props.filterPlaceholder
-      }, props.filterInputProps)), filterIcon);
+      }, props.filterInputProps, {
+        pt: props.ptm('filterInput')
+      })), filterIcon);
       if (props.filterTemplate) {
         var defaultContentOptions = {
           className: 'p-listbox-filter-container',
@@ -245,9 +246,7 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
         };
         content = utils.ObjectUtils.getJSXElement(props.filterTemplate, defaultContentOptions);
       }
-      return /*#__PURE__*/React__namespace.createElement("div", {
-        className: "p-listbox-header"
-      }, content);
+      return /*#__PURE__*/React__namespace.createElement("div", headerProps, content);
     };
     var content = createHeader();
     return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, content);
@@ -255,6 +254,14 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
   ListBoxHeader.displayName = 'ListBoxHeader';
 
   var ListBoxItem = /*#__PURE__*/React__namespace.memo(function (props) {
+    var getPTOptions = function getPTOptions(key) {
+      return props.ptm(key, {
+        context: {
+          selected: props.selected,
+          disabled: props.disabled
+        }
+      });
+    };
     var onClick = function onClick(event) {
       if (props.onClick) {
         props.onClick({
@@ -309,19 +316,20 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
       'p-disabled': props.disabled
     }, props.option.className);
     var content = props.template ? utils.ObjectUtils.getJSXElement(props.template, props.option) : props.label;
-    return /*#__PURE__*/React__namespace.createElement("li", {
+    var itemProps = utils.mergeProps({
       className: className,
       style: props.style,
       onClick: onClick,
       onTouchEnd: onTouchEnd,
       onKeyDown: onKeyDown,
-      tabIndex: "-1",
-      "aria-label": props.label,
+      tabIndex: '-1',
+      'aria-label': props.label,
       key: props.label,
-      role: "option",
-      "aria-selected": props.selected,
-      "aria-disabled": props.disabled
-    }, content, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
+      role: 'option',
+      'aria-selected': props.selected,
+      'aria-disabled': props.disabled
+    }, getPTOptions('item'));
+    return /*#__PURE__*/React__namespace.createElement("li", itemProps, content, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
   });
   ListBoxItem.displayName = 'ListBoxItem';
 
@@ -331,7 +339,8 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
   function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
   function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
   var ListBox = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
-    var props = ListBoxBase.getProps(inProps);
+    var context = React__namespace.useContext(api.PrimeReactContext);
+    var props = ListBoxBase.getProps(inProps, context);
     var _React$useState = React__namespace.useState(''),
       _React$useState2 = _slicedToArray(_React$useState, 2),
       filterValueState = _React$useState2[0],
@@ -341,6 +350,13 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
     var optionTouched = React__namespace.useRef(false);
     var filteredValue = (props.onFilterValueChange ? props.filterValue : filterValueState) || '';
     var hasFilter = filteredValue && filteredValue.trim().length > 0;
+    var _ListBoxBase$setMetaD = ListBoxBase.setMetaData({
+        props: props,
+        state: {
+          filterValue: filteredValue
+        }
+      }),
+      ptm = _ListBoxBase$setMetaD.ptm;
     var onOptionSelect = function onOptionSelect(event) {
       var option = event.option;
       if (props.disabled || isOptionDisabled(option)) {
@@ -584,7 +600,8 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
         filterTemplate: props.filterTemplate,
         disabled: props.disabled,
         filterPlaceholder: props.filterPlaceholder,
-        filterInputProps: props.filterInputProps
+        filterInputProps: props.filterInputProps,
+        ptm: ptm
       }) : null;
     };
     var createGroupChildren = function createGroupChildren(optionGroup, style) {
@@ -604,7 +621,8 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
           onClick: onOptionSelect,
           onTouchEnd: onOptionTouchEnd,
           tabIndex: tabIndex,
-          disabled: disabled
+          disabled: disabled,
+          ptm: ptm
         });
       });
     };
@@ -617,13 +635,14 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
         var groupContent = props.optionGroupTemplate ? utils.ObjectUtils.getJSXElement(props.optionGroupTemplate, option, index) : getOptionGroupLabel(option);
         var groupChildrenContent = createGroupChildren(option, style);
         var key = index + '_' + getOptionGroupRenderKey(option);
+        var itemGroupProps = utils.mergeProps({
+          className: 'p-listbox-item-group',
+          style: style,
+          role: 'group'
+        }, ptm('itemGroup'));
         return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
           key: key
-        }, /*#__PURE__*/React__namespace.createElement("li", {
-          className: "p-listbox-item-group",
-          style: style,
-          role: "group"
-        }, groupContent), groupChildrenContent);
+        }, /*#__PURE__*/React__namespace.createElement("li", itemGroupProps, groupContent), groupChildrenContent);
       } else {
         var optionLabel = getOptionLabel(option);
         var optionKey = index + '_' + getOptionRenderKey(option);
@@ -639,7 +658,8 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
           onClick: onOptionSelect,
           onTouchEnd: onOptionTouchEnd,
           tabIndex: tabIndex,
-          disabled: disabled
+          disabled: disabled,
+          ptm: ptm
         });
       }
     };
@@ -652,10 +672,11 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
       return createEmptyMessage(props.emptyMessage);
     };
     var createEmptyMessage = function createEmptyMessage(emptyMessage, isFilter) {
+      var emptyMessageProps = utils.mergeProps({
+        className: 'p-listbox-empty-message'
+      }, ptm('emptyMessage'));
       var message = utils.ObjectUtils.getJSXElement(emptyMessage, props) || api.localeOption(isFilter ? 'emptyFilterMessage' : 'emptyMessage');
-      return /*#__PURE__*/React__namespace.createElement("li", {
-        className: "p-listbox-empty-message"
-      }, message);
+      return /*#__PURE__*/React__namespace.createElement("li", emptyMessageProps, message);
     };
     var createList = function createList() {
       if (props.virtualScrollerOptions) {
@@ -671,25 +692,29 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
           },
           contentTemplate: function contentTemplate(options) {
             var className = utils.classNames('p-listbox-list', options.className);
-            return /*#__PURE__*/React__namespace.createElement("ul", _extends({
+            var listProps = utils.mergeProps(_objectSpread({
               ref: options.contentRef,
               style: options.style,
               className: className,
-              role: "listbox",
-              "aria-multiselectable": props.multiple
-            }, ariaProps), options.children);
+              role: 'listbox',
+              'aria-multiselectable': props.multiple
+            }, ariaProps), ptm('list'));
+            return /*#__PURE__*/React__namespace.createElement("ul", listProps, options.children);
           }
         });
         return /*#__PURE__*/React__namespace.createElement(virtualscroller.VirtualScroller, _extends({
           ref: virtualScrollerRef
-        }, virtualScrollerProps));
+        }, virtualScrollerProps, {
+          pt: ptm('virtualScroller')
+        }));
       } else {
         var items = createItems();
-        return /*#__PURE__*/React__namespace.createElement("ul", _extends({
-          className: "p-listbox-list",
-          role: "listbox",
-          "aria-multiselectable": props.multiple
-        }, ariaProps), items);
+        var listProps = utils.mergeProps(_objectSpread({
+          className: 'p-listbox-list',
+          role: 'listbox',
+          'aria-multiselectable': props.multiple
+        }, ariaProps), ptm('list'));
+        return /*#__PURE__*/React__namespace.createElement("ul", listProps, items);
       }
     };
     var visibleOptions = getVisibleOptions();
@@ -702,18 +727,22 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
     var listClassName = utils.classNames('p-listbox-list-wrapper', props.listClassName);
     var list = createList();
     var header = createHeader();
-    return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
+    var wrapperProps = utils.mergeProps({
+      className: listClassName,
+      style: props.listStyle
+    }, ptm('wrapper'));
+    var rootProps = utils.mergeProps({
       ref: elementRef,
       id: props.id,
       className: className,
       style: props.style
-    }, otherProps), header, /*#__PURE__*/React__namespace.createElement("div", {
-      className: listClassName,
-      style: props.listStyle
-    }, list)), hasTooltip && /*#__PURE__*/React__namespace.createElement(tooltip.Tooltip, _extends({
+    }, ListBoxBase.getOtherProps(props), ptm('root'));
+    return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", rootProps, header, /*#__PURE__*/React__namespace.createElement("div", wrapperProps, list)), hasTooltip && /*#__PURE__*/React__namespace.createElement(tooltip.Tooltip, _extends({
       target: elementRef,
       content: props.tooltip
-    }, props.tooltipOptions)));
+    }, props.tooltipOptions, {
+      pt: ptm('tooltip')
+    })));
   }));
   ListBox.displayName = 'ListBox';
 
@@ -723,4 +752,4 @@ this.primereact.listbox = (function (exports, React, api, hooks, tooltip, utils,
 
   return exports;
 
-})({}, React, primereact.api, primereact.hooks, primereact.tooltip, primereact.utils, primereact.virtualscroller, primereact.inputtext, primereact.icons.search, primereact.ripple);
+})({}, React, primereact.api, primereact.hooks, primereact.tooltip, primereact.utils, primereact.virtualscroller, primereact.componentbase, primereact.icons.search, primereact.inputtext, primereact.ripple);