primereact 8.7.3 → 9.0.0-rc.1

package/accordion/accordion.cjs.js

@@ -86,9 +86,7 @@ function _defineProperty(obj, key, value) {
 
 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];
-  }
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
   return arr2;
 }
 
@@ -135,9 +133,7 @@ function _iterableToArrayLimit(arr, i) {
       if (_x = (_i = _i.call(arr)).next, 0 === i) {
         if (Object(_i) !== _i) return;
         _n = !1;
-      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {
-        ;
-      }
+      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
     } catch (err) {
       _d = !0, _e = err;
     } finally {
@@ -159,13 +155,60 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
+var AccordionBase = {
+  defaultProps: {
+    __TYPE: 'Accordion',
+    id: null,
+    activeIndex: null,
+    className: null,
+    style: null,
+    multiple: false,
+    expandIcon: 'pi pi-chevron-right',
+    collapseIcon: 'pi pi-chevron-down',
+    transitionOptions: null,
+    onTabOpen: null,
+    onTabClose: null,
+    onTabChange: null,
+    children: undefined
+  },
+  getProps: function getProps(props) {
+    return utils.ObjectUtils.getMergedProps(props, AccordionBase.defaultProps);
+  },
+  getOtherProps: function getOtherProps(props) {
+    return utils.ObjectUtils.getDiffProps(props, AccordionBase.defaultProps);
+  }
+};
+var AccordionTabBase = {
+  defaultProps: {
+    __TYPE: 'AccordionTab',
+    className: null,
+    contentClassName: null,
+    contentStyle: null,
+    disabled: false,
+    header: null,
+    headerClassName: null,
+    headerStyle: null,
+    headerTemplate: null,
+    style: null,
+    tabIndex: 0,
+    children: undefined
+  },
+  getCProp: function getCProp(tab, name) {
+    return utils.ObjectUtils.getComponentProp(tab, name, AccordionTabBase.defaultProps);
+  },
+  getCProps: function getCProps(tab) {
+    return utils.ObjectUtils.getComponentProps(tab, AccordionTabBase.defaultProps);
+  },
+  getCOtherProps: function getCOtherProps(tab) {
+    return utils.ObjectUtils.getComponentDiffProps(tab, AccordionTabBase.defaultProps);
+  }
+};
+
 function ownKeys(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(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var AccordionTab = function AccordionTab() {};
-var shouldUseTab = function shouldUseTab(tab) {
-  return tab && tab.props.__TYPE === 'AccordionTab';
-};
-var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
+var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
+  var props = AccordionBase.getProps(inProps);
   var _React$useState = React__namespace.useState(props.id),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     idState = _React$useState2[0],
@@ -176,8 +219,11 @@ var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     setActiveIndexState = _React$useState4[1];
   var elementRef = React__namespace.useRef(null);
   var activeIndex = props.onTabChange ? props.activeIndex : activeIndexState;
+  var getTabProp = function getTabProp(tab, name) {
+    return AccordionTabBase.getCProp(tab, name);
+  };
   var onTabHeaderClick = function onTabHeaderClick(event, tab, index) {
-    if (!tab.props.disabled) {
+    if (!getTabProp(tab, 'disabled')) {
       var selected = isSelected(index);
       var newActiveIndex = null;
       if (props.multiple) {
@@ -226,17 +272,17 @@ var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     return null;
   }
   var createTabHeader = function createTabHeader(tab, selected, index) {
-    var style = _objectSpread(_objectSpread({}, tab.props.style || {}), tab.props.headerStyle || {});
+    var style = _objectSpread(_objectSpread({}, getTabProp(tab, 'style') || {}), getTabProp(tab, 'headerStyle') || {});
     var className = utils.classNames('p-accordion-header', {
       'p-highlight': selected,
-      'p-disabled': tab.props.disabled
-    }, tab.props.headerClassName, tab.props.className);
+      'p-disabled': getTabProp(tab, 'disabled')
+    }, getTabProp(tab, 'headerClassName'), getTabProp(tab, 'className'));
     var headerId = idState + '_header_' + index;
     var ariaControls = idState + '_content_' + index;
-    var tabIndex = tab.props.disabled ? -1 : tab.props.tabIndex;
-    var header = tab.props.headerTemplate ? utils.ObjectUtils.getJSXElement(tab.props.headerTemplate, tab.props) : /*#__PURE__*/React__namespace.createElement("span", {
+    var tabIndex = getTabProp(tab, 'disabled') ? -1 : getTabProp(tab, 'tabIndex');
+    var header = getTabProp(tab, 'headerTemplate') ? utils.ObjectUtils.getJSXElement(getTabProp(tab, 'headerTemplate'), AccordionTabBase.getCProps(tab)) : /*#__PURE__*/React__namespace.createElement("span", {
       className: "p-accordion-header-text"
-    }, tab.props.header);
+    }, getTabProp(tab, 'header'));
     var icon = utils.IconUtils.getJSXIcon(selected ? props.collapseIcon : props.expandIcon, {
       className: 'p-accordion-toggle-icon'
     }, {
@@ -262,8 +308,8 @@ var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     }, icon, header));
   };
   var createTabContent = function createTabContent(tab, selected, index) {
-    var style = _objectSpread(_objectSpread({}, tab.props.style || {}), tab.props.contentStyle || {});
-    var className = utils.classNames('p-toggleable-content', tab.props.contentClassName, tab.props.className);
+    var style = _objectSpread(_objectSpread({}, getTabProp(tab, 'style') || {}), getTabProp(tab, 'contentStyle') || {});
+    var className = utils.classNames('p-toggleable-content', getTabProp(tab, 'contentClassName'), getTabProp(tab, 'className'));
     var contentId = idState + '_content_' + index;
     var ariaLabelledby = idState + '_header_' + index;
     var contentRef = /*#__PURE__*/React__namespace.createRef();
@@ -286,13 +332,13 @@ var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
       "aria-labelledby": ariaLabelledby
     }, /*#__PURE__*/React__namespace.createElement("div", {
       className: "p-accordion-content"
-    }, tab.props.children)));
+    }, getTabProp(tab, 'children'))));
   };
   var createTab = function createTab(tab, index) {
-    if (shouldUseTab(tab)) {
+    if (utils.ObjectUtils.isValidChild(tab, 'AccordionTab')) {
       var key = idState + '_' + index;
       var selected = isSelected(index);
-      var _otherProps = utils.ObjectUtils.findDiffKeys(tab.props, AccordionTab.defaultProps);
+      var _otherProps = AccordionTabBase.getCOtherProps(tab);
       var tabHeader = createTabHeader(tab, selected, index);
       var tabContent = createTabContent(tab, selected, index);
       var tabClassName = utils.classNames('p-accordion-tab', {
@@ -308,7 +354,7 @@ var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
   var createTabs = function createTabs() {
     return React__namespace.Children.map(props.children, createTab);
   };
-  var otherProps = utils.ObjectUtils.findDiffKeys(props, Accordion.defaultProps);
+  var otherProps = AccordionBase.getOtherProps(props);
   var className = utils.classNames('p-accordion p-component', props.className);
   var tabs = createTabs();
   return /*#__PURE__*/React__namespace.createElement("div", _extends({
@@ -319,34 +365,7 @@ var Accordion = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
   }, otherProps), tabs);
 });
 AccordionTab.displayName = 'AccordionTab';
-AccordionTab.defaultProps = {
-  __TYPE: 'AccordionTab',
-  className: null,
-  contentClassName: null,
-  contentStyle: null,
-  disabled: false,
-  header: null,
-  headerClassName: null,
-  headerStyle: null,
-  headerTemplate: null,
-  style: null,
-  tabIndex: 0
-};
 Accordion.displayName = 'Accordion';
-Accordion.defaultProps = {
-  __TYPE: 'Accordion',
-  id: null,
-  activeIndex: null,
-  className: null,
-  style: null,
-  multiple: false,
-  expandIcon: 'pi pi-chevron-right',
-  collapseIcon: 'pi pi-chevron-down',
-  transitionOptions: null,
-  onTabOpen: null,
-  onTabClose: null,
-  onTabChange: null
-};
 
 exports.Accordion = Accordion;
 exports.AccordionTab = AccordionTab;

package/accordion/accordion.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("primereact/api"),t=require("primereact/csstransition"),n=require("primereact/hooks"),o=require("primereact/utils");function a(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var l=a(e);function i(){return i=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},i.apply(this,arguments)}function c(e){return c="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},c(e)}function s(e,r){if("object"!==c(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var n=t.call(e,r||"default");if("object"!==c(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}function u(e){var r=s(e,"string");return"symbol"===c(r)?r:String(r)}function p(e,r,t){return(r=u(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function f(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=new Array(r);t<r;t++)n[t]=e[t];return n}function d(e){if(Array.isArray(e))return f(e)}function b(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function m(e,r){if(e){if("string"==typeof e)return f(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?f(e,r):void 0}}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 v(e){if(Array.isArray(e))return e}function h(e,r){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var n,o,a,l,i=[],c=!0,s=!1;try{if(a=(t=t.call(e)).next,0===r){if(Object(t)!==t)return;c=!1}else for(;!(c=(n=a.call(t)).done)&&(i.push(n.value),i.length!==r);c=!0);}catch(e){s=!0,o=e}finally{try{if(!c&&null!=t.return&&(l=t.return(),Object(l)!==l))return}finally{if(s)throw o}}return i}}function g(){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 O(e,r){return v(e)||h(e,r)||m(e,r)||g()}function j(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function S(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?j(Object(t),!0).forEach((function(r){p(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):j(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var N=function(){},E=function(e){return e&&"AccordionTab"===e.props.__TYPE},P=l.forwardRef((function(e,a){var c=O(l.useState(e.id),2),s=c[0],u=c[1],p=O(l.useState(e.activeIndex),2),f=p[0],v=p[1],h=l.useRef(null),g=e.onTabChange?e.activeIndex:f,j=function(r,t,n){if(!t.props.disabled){var o=T(n),a=null;if(e.multiple){var l=g||[];a=o?l.filter((function(e){return e!==n})):[].concat(d(c=l)||b(c)||m(c)||y(),[n])}else a=o?null:n;var i=o?e.onTabClose:e.onTabOpen;i&&i({originalEvent:r,index:n}),e.onTabChange?e.onTabChange({originalEvent:r,index:a}):v(a)}var c;r.preventDefault()},T=function(r){return e.multiple?g&&g.some((function(e){return e===r})):g===r};if(l.useImperativeHandle(a,(function(){return{props:e,getElement:function(){return h.current}}})),n.useMountEffect((function(){s||u(o.UniqueComponentId())})),!s)return null;var w=function(t,n,a){var i=S(S({},t.props.style||{}),t.props.headerStyle||{}),c=o.classNames("p-accordion-header",{"p-highlight":n,"p-disabled":t.props.disabled},t.props.headerClassName,t.props.className),u=s+"_header_"+a,p=s+"_content_"+a,f=t.props.disabled?-1:t.props.tabIndex,d=t.props.headerTemplate?o.ObjectUtils.getJSXElement(t.props.headerTemplate,t.props):l.createElement("span",{className:"p-accordion-header-text"},t.props.header),b=o.IconUtils.getJSXIcon(n?e.collapseIcon:e.expandIcon,{className:"p-accordion-toggle-icon"},{props:e,selected:n}),m=r.ariaLabel(n?"collapseLabel":"expandLabel");return l.createElement("div",{className:c,style:i},l.createElement("a",{href:"#"+p,id:u,className:"p-accordion-header-link","aria-controls":p,role:"tab","aria-expanded":n,onClick:function(e){return j(e,t,a)},tabIndex:f,"aria-label":m},b,d))},x=function(r,n,a){var i=S(S({},r.props.style||{}),r.props.contentStyle||{}),c=o.classNames("p-toggleable-content",r.props.contentClassName,r.props.className),u=s+"_content_"+a,p=s+"_header_"+a,f=l.createRef();return l.createElement(t.CSSTransition,{nodeRef:f,classNames:"p-toggleable-content",timeout:{enter:1e3,exit:450},in:n,unmountOnExit:!0,options:e.transitionOptions},l.createElement("div",{ref:f,id:u,className:c,style:i,role:"region","aria-labelledby":p},l.createElement("div",{className:"p-accordion-content"},r.props.children)))},I=function(e,r){if(E(e)){var t=s+"_"+r,n=T(r),a=o.ObjectUtils.findDiffKeys(e.props,N.defaultProps),c=w(e,n,r),u=x(e,n,r),p=o.classNames("p-accordion-tab",{"p-accordion-tab-active":n});return l.createElement("div",i({key:t,className:p},a),c,u)}return null},_=o.ObjectUtils.findDiffKeys(e,P.defaultProps),A=o.classNames("p-accordion p-component",e.className),C=l.Children.map(e.children,I);return l.createElement("div",i({id:s,ref:h,className:A,style:e.style},_),C)}));N.displayName="AccordionTab",N.defaultProps={__TYPE:"AccordionTab",className:null,contentClassName:null,contentStyle:null,disabled:!1,header:null,headerClassName:null,headerStyle:null,headerTemplate:null,style:null,tabIndex:0},P.displayName="Accordion",P.defaultProps={__TYPE:"Accordion",id:null,activeIndex:null,className:null,style:null,multiple:!1,expandIcon:"pi pi-chevron-right",collapseIcon:"pi pi-chevron-down",transitionOptions:null,onTabOpen:null,onTabClose:null,onTabChange:null},exports.Accordion=P,exports.AccordionTab=N;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),r=require("primereact/csstransition"),n=require("primereact/hooks"),o=require("primereact/utils");function a(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var l=a(e);function i(){return i=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},i.apply(this,arguments)}function c(e){return c="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},c(e)}function u(e,t){if("object"!==c(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==c(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function s(e){var t=u(e,"string");return"symbol"===c(t)?t:String(t)}function p(e,t,r){return(t=s(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function f(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 d(e){if(Array.isArray(e))return f(e)}function b(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function m(e,t){if(e){if("string"==typeof e)return f(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)?f(e,t):void 0}}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 g(e){if(Array.isArray(e))return e}function v(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,a,l,i=[],c=!0,u=!1;try{if(a=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;c=!1}else for(;!(c=(n=a.call(r)).done)&&(i.push(n.value),i.length!==t);c=!0);}catch(e){u=!0,o=e}finally{try{if(!c&&null!=r.return&&(l=r.return(),Object(l)!==l))return}finally{if(u)throw o}}return i}}function h(){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 O(e,t){return g(e)||v(e,t)||m(e,t)||h()}var P={defaultProps:{__TYPE:"Accordion",id:null,activeIndex:null,className:null,style:null,multiple:!1,expandIcon:"pi pi-chevron-right",collapseIcon:"pi pi-chevron-down",transitionOptions:null,onTabOpen:null,onTabClose:null,onTabChange:null,children:void 0},getProps:function(e){return o.ObjectUtils.getMergedProps(e,P.defaultProps)},getOtherProps:function(e){return o.ObjectUtils.getDiffProps(e,P.defaultProps)}},j={defaultProps:{__TYPE:"AccordionTab",className:null,contentClassName:null,contentStyle:null,disabled:!1,header:null,headerClassName:null,headerStyle:null,headerTemplate:null,style:null,tabIndex:0,children:void 0},getCProp:function(e,t){return o.ObjectUtils.getComponentProp(e,t,j.defaultProps)},getCProps:function(e){return o.ObjectUtils.getComponentProps(e,j.defaultProps)},getCOtherProps:function(e){return o.ObjectUtils.getComponentDiffProps(e,j.defaultProps)}};function S(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 C(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?S(Object(r),!0).forEach((function(t){p(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):S(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var N=function(){},E=l.forwardRef((function(e,a){var c=P.getProps(e),u=O(l.useState(c.id),2),s=u[0],p=u[1],f=O(l.useState(c.activeIndex),2),g=f[0],v=f[1],h=l.useRef(null),S=c.onTabChange?c.activeIndex:g,N=function(e,t){return j.getCProp(e,t)},E=function(e,t,r){if(!N(t,"disabled")){var n=T(r),o=null;if(c.multiple){var a=S||[];o=n?a.filter((function(e){return e!==r})):[].concat(d(i=a)||b(i)||m(i)||y(),[r])}else o=n?null:r;var l=n?c.onTabClose:c.onTabOpen;l&&l({originalEvent:e,index:r}),c.onTabChange?c.onTabChange({originalEvent:e,index:o}):v(o)}var i;e.preventDefault()},T=function(e){return c.multiple?S&&S.some((function(t){return t===e})):S===e};if(l.useImperativeHandle(a,(function(){return{props:c,getElement:function(){return h.current}}})),n.useMountEffect((function(){s||p(o.UniqueComponentId())})),!s)return null;var w=function(e,r,n){var a=C(C({},N(e,"style")||{}),N(e,"headerStyle")||{}),i=o.classNames("p-accordion-header",{"p-highlight":r,"p-disabled":N(e,"disabled")},N(e,"headerClassName"),N(e,"className")),u=s+"_header_"+n,p=s+"_content_"+n,f=N(e,"disabled")?-1:N(e,"tabIndex"),d=N(e,"headerTemplate")?o.ObjectUtils.getJSXElement(N(e,"headerTemplate"),j.getCProps(e)):l.createElement("span",{className:"p-accordion-header-text"},N(e,"header")),b=o.IconUtils.getJSXIcon(r?c.collapseIcon:c.expandIcon,{className:"p-accordion-toggle-icon"},{props:c,selected:r}),m=t.ariaLabel(r?"collapseLabel":"expandLabel");return l.createElement("div",{className:i,style:a},l.createElement("a",{href:"#"+p,id:u,className:"p-accordion-header-link","aria-controls":p,role:"tab","aria-expanded":r,onClick:function(t){return E(t,e,n)},tabIndex:f,"aria-label":m},b,d))},x=function(e,t,n){var a=C(C({},N(e,"style")||{}),N(e,"contentStyle")||{}),i=o.classNames("p-toggleable-content",N(e,"contentClassName"),N(e,"className")),u=s+"_content_"+n,p=s+"_header_"+n,f=l.createRef();return l.createElement(r.CSSTransition,{nodeRef:f,classNames:"p-toggleable-content",timeout:{enter:1e3,exit:450},in:t,unmountOnExit:!0,options:c.transitionOptions},l.createElement("div",{ref:f,id:u,className:i,style:a,role:"region","aria-labelledby":p},l.createElement("div",{className:"p-accordion-content"},N(e,"children"))))},I=function(e,t){if(o.ObjectUtils.isValidChild(e,"AccordionTab")){var r=s+"_"+t,n=T(t),a=j.getCOtherProps(e),c=w(e,n,t),u=x(e,n,t),p=o.classNames("p-accordion-tab",{"p-accordion-tab-active":n});return l.createElement("div",i({key:r,className:p},a),c,u)}return null},_=P.getOtherProps(c),A=o.classNames("p-accordion p-component",c.className),U=l.Children.map(c.children,I);return l.createElement("div",i({id:s,ref:h,className:A,style:c.style},_),U)}));N.displayName="AccordionTab",E.displayName="Accordion",exports.Accordion=E,exports.AccordionTab=N;

package/accordion/accordion.d.ts

@@ -1,45 +1,188 @@
+/**
+ *
+ * Accordion groups a collection of contents in tabs.
+ *
+ * [Live Demo](https://www.primefaces.org/primereact/accordion/)
+ *
+ * Helper Components:
+ *
+ * - {@link AccordionTab}
+ *
+ * @module accordion
+ *
+ */
 import * as React from 'react';
 import { CSSTransitionProps } from '../csstransition';
 import { IconType } from '../utils';
 
-type AccordionTabHeaderTemplateType = React.ReactNode | ((props: AccordionTabProps) => React.ReactNode);
-
+/**
+ * Defines valid properties in AccordionTab component.
+ * @group Properties
+ */
 interface AccordionTabProps {
-    children?: React.ReactNode;
-    className?: string;
-    contentClassName?: string;
-    contentStyle?: React.CSSProperties;
-    disabled?: boolean;
-    header?: React.ReactNode;
-    headerClassName?: string;
-    headerStyle?: React.CSSProperties;
-    headerTemplate?: AccordionTabHeaderTemplateType;
-    style?: React.CSSProperties;
-    tabIndex?: number;
+    /**
+     * Style class of the tab header and content.
+     */
+    className?: string | undefined;
+    /**
+     * Style class of the tab content.
+     */
+    contentClassName?: string | undefined;
+    /**
+     * Inline style of the tab content.
+     */
+    contentStyle?: React.CSSProperties | undefined;
+    /**
+     * Whether the tab is disabled.
+     * @defaultValue false
+     */
+    disabled?: boolean | undefined;
+    /**
+     * Used to define the header of the tab.
+     */
+    header?: React.ReactNode | undefined;
+    /**
+     * Style class of the tab header.
+     */
+    headerClassName?: string | undefined;
+    /**
+     * Inline style of the tab header.
+     */
+    headerStyle?: React.CSSProperties | undefined;
+    /**
+     * Custom header template of the tab.
+     */
+    headerTemplate?: React.ReactNode | ((props: AccordionTabProps) => React.ReactNode);
+    /**
+     * Inline style of the tab header and content.
+     */
+    style?: React.CSSProperties | undefined;
+    /**
+     * Index of the element in tabbing order.
+     * @defaultValue 0
+     */
+    tabIndex?: number | undefined;
+    /**
+     * Used to get the child elements of the component.
+     * @readonly
+     */
+    children?: React.ReactNode | undefined;
 }
 
+/**
+ * AccordionTab is a helper component for Accordion.
+ * @group Component
+ */
 export declare class AccordionTab extends React.Component<AccordionTabProps, any> {}
 
-type AccordionActiveIndexType = number | number[] | undefined | null;
-
-interface AccordionEventParams {
+/**
+ * Custom tab open event.
+ * @see {@link AccordionProps.onTabOpen}
+ * @event
+ */
+export interface AccordionTabOpenEvent {
+    /**
+     * Browser mouse event.
+     */
     originalEvent: React.MouseEvent<HTMLElement>;
+    /**
+     * Opened tab index.
+     */
     index: number;
 }
 
+/**
+ * Custom tab close event.
+ * @see {@link AccordionProps.onTabClose}
+ * @extends {AccordionTabOpenEvent}
+ * @event
+ */
+export interface AccordionTabCloseEvent extends AccordionTabOpenEvent {}
+
+/**
+ * Custom tab change event.
+ * @see {@link AccordionProps.onTabChange}
+ * @event
+ */
+export interface AccordionTabChangeEvent {
+    /**
+     * Browser mouse event.
+     */
+    originalEvent: React.MouseEvent<HTMLElement>;
+    /**
+     * Opened tab index.
+     */
+    index: number | number[];
+}
+
+/**
+ * Defines valid properties in Accordion component. In addition to these, all properties of HTMLDivElement can be used in this component.
+ * @group Properties
+ */
 export interface AccordionProps extends Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, 'ref'> {
-    activeIndex?: AccordionActiveIndexType;
-    multiple?: boolean;
-    expandIcon?: IconType<AccordionProps>;
-    collapseIcon?: IconType<AccordionProps>;
-    transitionOptions?: CSSTransitionProps;
-    onTabOpen?(e: AccordionEventParams): void;
-    onTabClose?(e: AccordionEventParams): void;
-    onTabChange?(e: AccordionEventParams): void;
-    children?: React.ReactNode;
+    /**
+     * Active index or indexes of the element. Use an array of numbers for multiple indexes.
+     * The {@link multiple} prop must be set to true in order to specify multiple indexes.
+     */
+    activeIndex?: number | number[] | null | undefined;
+    /**
+     * When enabled, multiple tabs can be activated at the same time.
+     * @defaultValue false
+     */
+    multiple?: boolean | undefined;
+    /**
+     * Icon of a collapsed tab.
+     * @defaultValue pi pi-chevron-right
+     */
+    expandIcon?: IconType<AccordionProps> | undefined;
+    /**
+     * Icon of an expanded tab.
+     * @defaultValue pi pi-chevron-down
+     */
+    collapseIcon?: IconType<AccordionProps> | undefined;
+    /**
+     * The properties of CSSTransition can be customized, except for "nodeRef" and "in" properties.
+     * @type {CSSTransitionProps}
+     */
+    transitionOptions?: CSSTransitionProps | undefined;
+    /**
+     * Callback to invoke when a tab gets expanded.
+     * @param {AccordionTabOpenEvent} event - Custom tab open event.
+     */
+    onTabOpen?(event: AccordionTabOpenEvent): void;
+    /**
+     * Callback to invoke when an active tab is collapsed by clicking on the header.
+     * @param {AccordionTabCloseEvent} event - Custom tab close event.
+     */
+    onTabClose?(event: AccordionTabCloseEvent): void;
+    /**
+     * Callback to invoke when state of the accordion changes.
+     * @param {AccordionTabChangeEvent} event - Custom tab close event.
+     */
+    onTabChange?(event: AccordionTabChangeEvent): void;
+    /**
+     * Used to get the child elements of the component.
+     * @readonly
+     */
+    children?: React.ReactNode | undefined;
 }
 
+/**
+ * **PrimeReact - Accordion**
+ *
+ * _Accordion groups a collection of contents in tabs._
+ *
+ * [Live Demo](https://www.primefaces.org/primereact/accordion/)
+ * --- ---
+ * ![PrimeReact](https://primefaces.org/cdn/primereact/images/logo-100.png)
+ *
+ * @group Component
+ */
 // tslint:disable-next-line:max-classes-per-file
 export declare class Accordion extends React.Component<AccordionProps, any> {
+    /**
+     * Used to get container element.
+     * @return {HTMLDivElement} Container element
+     */
     public getElement(): HTMLDivElement;
 }

package/accordion/accordion.esm.js

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { ariaLabel } from 'primereact/api';
 import { CSSTransition } from 'primereact/csstransition';
 import { useMountEffect } from 'primereact/hooks';
-import { UniqueComponentId, ObjectUtils, classNames, IconUtils } from 'primereact/utils';
+import { ObjectUtils, UniqueComponentId, classNames, IconUtils } from 'primereact/utils';
 
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
@@ -62,9 +62,7 @@ function _defineProperty(obj, key, value) {
 
 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];
-  }
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
   return arr2;
 }
 
@@ -111,9 +109,7 @@ function _iterableToArrayLimit(arr, i) {
       if (_x = (_i = _i.call(arr)).next, 0 === i) {
         if (Object(_i) !== _i) return;
         _n = !1;
-      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {
-        ;
-      }
+      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
     } catch (err) {
       _d = !0, _e = err;
     } finally {
@@ -135,13 +131,60 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
+var AccordionBase = {
+  defaultProps: {
+    __TYPE: 'Accordion',
+    id: null,
+    activeIndex: null,
+    className: null,
+    style: null,
+    multiple: false,
+    expandIcon: 'pi pi-chevron-right',
+    collapseIcon: 'pi pi-chevron-down',
+    transitionOptions: null,
+    onTabOpen: null,
+    onTabClose: null,
+    onTabChange: null,
+    children: undefined
+  },
+  getProps: function getProps(props) {
+    return ObjectUtils.getMergedProps(props, AccordionBase.defaultProps);
+  },
+  getOtherProps: function getOtherProps(props) {
+    return ObjectUtils.getDiffProps(props, AccordionBase.defaultProps);
+  }
+};
+var AccordionTabBase = {
+  defaultProps: {
+    __TYPE: 'AccordionTab',
+    className: null,
+    contentClassName: null,
+    contentStyle: null,
+    disabled: false,
+    header: null,
+    headerClassName: null,
+    headerStyle: null,
+    headerTemplate: null,
+    style: null,
+    tabIndex: 0,
+    children: undefined
+  },
+  getCProp: function getCProp(tab, name) {
+    return ObjectUtils.getComponentProp(tab, name, AccordionTabBase.defaultProps);
+  },
+  getCProps: function getCProps(tab) {
+    return ObjectUtils.getComponentProps(tab, AccordionTabBase.defaultProps);
+  },
+  getCOtherProps: function getCOtherProps(tab) {
+    return ObjectUtils.getComponentDiffProps(tab, AccordionTabBase.defaultProps);
+  }
+};
+
 function ownKeys(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(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var AccordionTab = function AccordionTab() {};
-var shouldUseTab = function shouldUseTab(tab) {
-  return tab && tab.props.__TYPE === 'AccordionTab';
-};
-var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
+var Accordion = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
+  var props = AccordionBase.getProps(inProps);
   var _React$useState = React.useState(props.id),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     idState = _React$useState2[0],
@@ -152,8 +195,11 @@ var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
     setActiveIndexState = _React$useState4[1];
   var elementRef = React.useRef(null);
   var activeIndex = props.onTabChange ? props.activeIndex : activeIndexState;
+  var getTabProp = function getTabProp(tab, name) {
+    return AccordionTabBase.getCProp(tab, name);
+  };
   var onTabHeaderClick = function onTabHeaderClick(event, tab, index) {
-    if (!tab.props.disabled) {
+    if (!getTabProp(tab, 'disabled')) {
       var selected = isSelected(index);
       var newActiveIndex = null;
       if (props.multiple) {
@@ -202,17 +248,17 @@ var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
     return null;
   }
   var createTabHeader = function createTabHeader(tab, selected, index) {
-    var style = _objectSpread(_objectSpread({}, tab.props.style || {}), tab.props.headerStyle || {});
+    var style = _objectSpread(_objectSpread({}, getTabProp(tab, 'style') || {}), getTabProp(tab, 'headerStyle') || {});
     var className = classNames('p-accordion-header', {
       'p-highlight': selected,
-      'p-disabled': tab.props.disabled
-    }, tab.props.headerClassName, tab.props.className);
+      'p-disabled': getTabProp(tab, 'disabled')
+    }, getTabProp(tab, 'headerClassName'), getTabProp(tab, 'className'));
     var headerId = idState + '_header_' + index;
     var ariaControls = idState + '_content_' + index;
-    var tabIndex = tab.props.disabled ? -1 : tab.props.tabIndex;
-    var header = tab.props.headerTemplate ? ObjectUtils.getJSXElement(tab.props.headerTemplate, tab.props) : /*#__PURE__*/React.createElement("span", {
+    var tabIndex = getTabProp(tab, 'disabled') ? -1 : getTabProp(tab, 'tabIndex');
+    var header = getTabProp(tab, 'headerTemplate') ? ObjectUtils.getJSXElement(getTabProp(tab, 'headerTemplate'), AccordionTabBase.getCProps(tab)) : /*#__PURE__*/React.createElement("span", {
       className: "p-accordion-header-text"
-    }, tab.props.header);
+    }, getTabProp(tab, 'header'));
     var icon = IconUtils.getJSXIcon(selected ? props.collapseIcon : props.expandIcon, {
       className: 'p-accordion-toggle-icon'
     }, {
@@ -238,8 +284,8 @@ var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }, icon, header));
   };
   var createTabContent = function createTabContent(tab, selected, index) {
-    var style = _objectSpread(_objectSpread({}, tab.props.style || {}), tab.props.contentStyle || {});
-    var className = classNames('p-toggleable-content', tab.props.contentClassName, tab.props.className);
+    var style = _objectSpread(_objectSpread({}, getTabProp(tab, 'style') || {}), getTabProp(tab, 'contentStyle') || {});
+    var className = classNames('p-toggleable-content', getTabProp(tab, 'contentClassName'), getTabProp(tab, 'className'));
     var contentId = idState + '_content_' + index;
     var ariaLabelledby = idState + '_header_' + index;
     var contentRef = /*#__PURE__*/React.createRef();
@@ -262,13 +308,13 @@ var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
       "aria-labelledby": ariaLabelledby
     }, /*#__PURE__*/React.createElement("div", {
       className: "p-accordion-content"
-    }, tab.props.children)));
+    }, getTabProp(tab, 'children'))));
   };
   var createTab = function createTab(tab, index) {
-    if (shouldUseTab(tab)) {
+    if (ObjectUtils.isValidChild(tab, 'AccordionTab')) {
       var key = idState + '_' + index;
       var selected = isSelected(index);
-      var _otherProps = ObjectUtils.findDiffKeys(tab.props, AccordionTab.defaultProps);
+      var _otherProps = AccordionTabBase.getCOtherProps(tab);
       var tabHeader = createTabHeader(tab, selected, index);
       var tabContent = createTabContent(tab, selected, index);
       var tabClassName = classNames('p-accordion-tab', {
@@ -284,7 +330,7 @@ var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var createTabs = function createTabs() {
     return React.Children.map(props.children, createTab);
   };
-  var otherProps = ObjectUtils.findDiffKeys(props, Accordion.defaultProps);
+  var otherProps = AccordionBase.getOtherProps(props);
   var className = classNames('p-accordion p-component', props.className);
   var tabs = createTabs();
   return /*#__PURE__*/React.createElement("div", _extends({
@@ -295,33 +341,6 @@ var Accordion = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, otherProps), tabs);
 });
 AccordionTab.displayName = 'AccordionTab';
-AccordionTab.defaultProps = {
-  __TYPE: 'AccordionTab',
-  className: null,
-  contentClassName: null,
-  contentStyle: null,
-  disabled: false,
-  header: null,
-  headerClassName: null,
-  headerStyle: null,
-  headerTemplate: null,
-  style: null,
-  tabIndex: 0
-};
 Accordion.displayName = 'Accordion';
-Accordion.defaultProps = {
-  __TYPE: 'Accordion',
-  id: null,
-  activeIndex: null,
-  className: null,
-  style: null,
-  multiple: false,
-  expandIcon: 'pi pi-chevron-right',
-  collapseIcon: 'pi pi-chevron-down',
-  transitionOptions: null,
-  onTabOpen: null,
-  onTabClose: null,
-  onTabChange: null
-};
 
 export { Accordion, AccordionTab };