primereact 8.7.2 → 9.0.0-beta.1

package/dataview/dataview.cjs.js

@@ -31,7 +31,34 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var PrimeReact__default = /*#__PURE__*/_interopDefaultLegacy(PrimeReact);
 
+function _typeof(obj) {
+  "@babel/helpers - typeof";
+
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
+}
+
+function _toPrimitive(input, hint) {
+  if (_typeof(input) !== "object" || input === null) return input;
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (_typeof(res) !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
+}
+
+function _toPropertyKey(arg) {
+  var key = _toPrimitive(arg, "string");
+  return _typeof(key) === "symbol" ? key : String(key);
+}
+
 function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
   if (key in obj) {
     Object.defineProperty(obj, key, {
       value: value,
@@ -42,17 +69,14 @@ function _defineProperty(obj, key, value) {
   } else {
     obj[key] = value;
   }
-
   return obj;
 }
 
 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;
 }
 
@@ -86,33 +110,33 @@ function _arrayWithHoles(arr) {
 }
 
 function _iterableToArrayLimit(arr, i) {
-  var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-
-  if (_i == null) return;
-  var _arr = [];
-  var _n = true;
-  var _d = false;
-
-  var _s, _e;
-
-  try {
-    for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
-      _arr.push(_s.value);
-
-      if (i && _arr.length === i) break;
-    }
-  } catch (err) {
-    _d = true;
-    _e = err;
-  } finally {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
     try {
-      if (!_n && _i["return"] != null) _i["return"]();
+      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) {
+        ;
+      }
+    } catch (err) {
+      _d = !0, _e = err;
     } finally {
-      if (_d) throw _e;
+      try {
+        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
     }
+    return _arr;
   }
-
-  return _arr;
 }
 
 function _nonIterableRest() {
@@ -127,14 +151,12 @@ function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
-
       for (var key in source) {
         if (Object.prototype.hasOwnProperty.call(source, key)) {
           target[key] = source[key];
         }
       }
     }
-
     return target;
   };
   return _extends.apply(this, arguments);
@@ -148,7 +170,6 @@ var DataViewLayoutOptions = /*#__PURE__*/React__namespace.memo(function (props)
     });
     event.preventDefault();
   };
-
   var otherProps = utils.ObjectUtils.findDiffKeys(props, DataViewLayoutOptions.defaultProps);
   var className = utils.classNames('p-dataview-layout-options p-selectbutton p-buttonset', props.className);
   var buttonListClass = utils.classNames('p-button p-button-icon-only', {
@@ -184,29 +205,23 @@ var DataViewItem = /*#__PURE__*/React__namespace.memo(function (props) {
 });
 var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
   var _classNames;
-
   var _React$useState = React__namespace.useState(props.first),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      firstState = _React$useState2[0],
-      setFirstState = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    firstState = _React$useState2[0],
+    setFirstState = _React$useState2[1];
   var _React$useState3 = React__namespace.useState(props.rows),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      rowsState = _React$useState4[0],
-      setRowsState = _React$useState4[1];
-
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    rowsState = _React$useState4[0],
+    setRowsState = _React$useState4[1];
   var elementRef = React__namespace.useRef(null);
   var first = props.onPage ? props.first : firstState;
   var rows = props.onPage ? props.rows : rowsState;
-
   var getItemRenderKey = function getItemRenderKey(value) {
     return props.dataKey ? utils.ObjectUtils.resolveFieldData(value, props.dataKey) : null;
   };
-
   var getTotalRecords = function getTotalRecords() {
     return props.totalRecords ? props.totalRecords : props.value ? props.value.length : 0;
   };
-
   var createPaginator = function createPaginator(position) {
     var className = utils.classNames('p-paginator-' + position, props.paginatorClassName);
     var totalRecords = getTotalRecords();
@@ -226,7 +241,6 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
       dropdownAppendTo: props.paginatorDropdownAppendTo
     });
   };
-
   var onPageChange = function onPageChange(event) {
     if (props.onPage) {
       props.onPage(event);
@@ -235,11 +249,9 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
       setRowsState(event.rows);
     }
   };
-
   var sort = function sort() {
     if (props.value) {
       var value = _toConsumableArray(props.value);
-
       value.sort(function (data1, data2) {
         var value1 = utils.ObjectUtils.resolveFieldData(data1, props.sortField);
         var value2 = utils.ObjectUtils.resolveFieldData(data2, props.sortField);
@@ -247,10 +259,8 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
       });
       return value;
     }
-
     return null;
   };
-
   var createLoader = function createLoader() {
     if (props.loading) {
       var iconClassName = utils.classNames('p-dataview-loading-icon pi-spin', props.loadingIcon);
@@ -260,58 +270,45 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
         className: iconClassName
       }));
     }
-
     return null;
   };
-
   var createTopPaginator = function createTopPaginator() {
     if (props.paginator && (props.paginatorPosition !== 'bottom' || props.paginatorPosition === 'both')) {
       return createPaginator('top');
     }
-
     return null;
   };
-
   var createBottomPaginator = function createBottomPaginator() {
     if (props.paginator && (props.paginatorPosition !== 'top' || props.paginatorPosition === 'both')) {
       return createPaginator('bottom');
     }
-
     return null;
   };
-
   var createEmptyMessage = function createEmptyMessage() {
     if (!props.loading) {
       var _content = props.emptyMessage || PrimeReact.localeOption('emptyMessage');
-
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: "p-col-12 col-12 p-dataview-emptymessage"
       }, _content);
     }
-
     return null;
   };
-
   var createHeader = function createHeader() {
     if (props.header) {
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: "p-dataview-header"
       }, props.header);
     }
-
     return null;
   };
-
   var createFooter = function createFooter() {
     if (props.footer) {
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: "p-dataview-footer"
       }, props.footer);
     }
-
     return null;
   };
-
   var createItems = function createItems(value) {
     if (utils.ObjectUtils.isNotEmpty(value)) {
       if (props.paginator) {
@@ -319,7 +316,6 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
         var totalRecords = getTotalRecords();
         var last = Math.min(rows + currentFirst, totalRecords);
         var items = [];
-
         for (var i = currentFirst; i < last; i++) {
           var val = value[i];
           val && items.push( /*#__PURE__*/React__namespace.createElement(DataViewItem, {
@@ -329,10 +325,8 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
             item: val
           }));
         }
-
         return items;
       }
-
       return value.map(function (item, index) {
         return /*#__PURE__*/React__namespace.createElement(DataViewItem, {
           key: getItemRenderKey(item) || index,
@@ -342,10 +336,8 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
         });
       });
     }
-
     return createEmptyMessage();
   };
-
   var createContent = function createContent(value) {
     var items = createItems(value);
     var gridClassName = utils.classNames('p-grid grid', {
@@ -357,17 +349,13 @@ var DataView = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
       className: gridClassName
     }, items));
   };
-
   var processData = function processData() {
     var data = props.value;
-
     if (utils.ObjectUtils.isNotEmpty(data) && props.sortField) {
       data = sort();
     }
-
     return data;
   };
-
   React__namespace.useImperativeHandle(ref, function () {
     return {
       props: props,

package/dataview/dataview.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),a=require("primereact/paginator"),r=require("primereact/ripple"),n=require("primereact/utils");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}})),t.default=e,Object.freeze(t)}var i=l(e),u=o(t);function s(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}function p(e,t){(null==t||t>e.length)&&(t=e.length);for(var a=0,r=new Array(t);a<t;a++)r[a]=e[a];return r}function c(e){if(Array.isArray(e))return p(e)}function m(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function d(e,t){if(e){if("string"==typeof e)return p(e,t);var a=Object.prototype.toString.call(e).slice(8,-1);return"Object"===a&&e.constructor&&(a=e.constructor.name),"Map"===a||"Set"===a?Array.from(e):"Arguments"===a||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a)?p(e,t):void 0}}function f(){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 y(e,t){var a=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=a){var r,n,o=[],l=!0,i=!1;try{for(a=a.call(e);!(l=(r=a.next()).done)&&(o.push(r.value),!t||o.length!==t);l=!0);}catch(e){i=!0,n=e}finally{try{l||null==a.return||a.return()}finally{if(i)throw n}}return o}}function v(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function b(e,t){return g(e)||y(e,t)||d(e,t)||v()}function w(){return w=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},w.apply(this,arguments)}var P=i.memo((function(e){var t=function(t,a){e.onChange({originalEvent:t,value:a}),t.preventDefault()},a=n.ObjectUtils.findDiffKeys(e,P.defaultProps),o=n.classNames("p-dataview-layout-options p-selectbutton p-buttonset",e.className),l=n.classNames("p-button p-button-icon-only",{"p-highlight":"list"===e.layout}),u=n.classNames("p-button p-button-icon-only",{"p-highlight":"grid"===e.layout});return i.createElement("div",w({id:e.id,style:e.style,className:o},a),i.createElement("button",{type:"button",className:l,onClick:function(e){return t(e,"list")}},i.createElement("i",{className:"pi pi-bars"}),i.createElement(r.Ripple,null)),i.createElement("button",{type:"button",className:u,onClick:function(e){return t(e,"grid")}},i.createElement("i",{className:"pi pi-th-large"}),i.createElement(r.Ripple,null)))})),h=i.memo((function(e){return e.template(e.item,e.layout)})),N=i.memo(i.forwardRef((function(e,r){var o,l=b(i.useState(e.first),2),p=l[0],g=l[1],y=b(i.useState(e.rows),2),v=y[0],P=y[1],O=i.useRef(null),E=e.onPage?e.first:p,j=e.onPage?e.rows:v,D=function(t){return e.dataKey?n.ObjectUtils.resolveFieldData(t,e.dataKey):null},S=function(){return e.totalRecords?e.totalRecords:e.value?e.value.length:0},T=function(t){var r=n.classNames("p-paginator-"+t,e.paginatorClassName),o=S();return i.createElement(a.Paginator,{first:E,rows:j,pageLinkSize:e.pageLinkSize,className:r,onPageChange:L,template:e.paginatorTemplate,totalRecords:o,rowsPerPageOptions:e.rowsPerPageOptions,currentPageReportTemplate:e.currentPageReportTemplate,leftContent:e.paginatorLeft,rightContent:e.paginatorRight,alwaysShow:e.alwaysShowPaginator,dropdownAppendTo:e.paginatorDropdownAppendTo})},L=function(t){e.onPage?e.onPage(t):(g(t.first),P(t.rows))},R=function(){if(e.value){var t=c(a=e.value)||m(a)||d(a)||f();return t.sort((function(t,a){var r=n.ObjectUtils.resolveFieldData(t,e.sortField),o=n.ObjectUtils.resolveFieldData(a,e.sortField);return n.ObjectUtils.sort(r,o,e.sortOrder,u.default.locale,u.default.nullSortOrder)})),t}var a;return null},k=function(){if(!e.loading){var a=e.emptyMessage||t.localeOption("emptyMessage");return i.createElement("div",{className:"p-col-12 col-12 p-dataview-emptymessage"},a)}return null},A=function(t){if(n.ObjectUtils.isNotEmpty(t)){if(e.paginator){for(var a=e.lazy?0:E,r=S(),o=Math.min(j+a,r),l=[],u=a;u<o;u++){var s=t[u];s&&l.push(i.createElement(h,{key:D(t)||u,template:e.itemTemplate,layout:e.layout,item:s}))}return l}return t.map((function(t,a){return i.createElement(h,{key:D(t)||a,template:e.itemTemplate,layout:e.layout,item:t})}))}return k()};i.useImperativeHandle(r,(function(){return{props:e,getElement:function(){return O.current}}}));var C,I,U=function(){var t=e.value;return n.ObjectUtils.isNotEmpty(t)&&e.sortField&&(t=R()),t}(),F=n.ObjectUtils.findDiffKeys(e,N.defaultProps),V=n.classNames("p-dataview p-component",(s(o={},"p-dataview-".concat(e.layout),!!e.layout),s(o,"p-dataview-loading",e.loading),o),e.className),_=function(){if(e.loading){var t=n.classNames("p-dataview-loading-icon pi-spin",e.loadingIcon);return i.createElement("div",{className:"p-dataview-loading-overlay p-component-overlay"},i.createElement("i",{className:t}))}return null}(),M=!e.paginator||"bottom"===e.paginatorPosition&&"both"!==e.paginatorPosition?null:T("top"),x=!e.paginator||"top"===e.paginatorPosition&&"both"!==e.paginatorPosition?null:T("bottom"),z=e.header?i.createElement("div",{className:"p-dataview-header"},e.header):null,q=e.footer?i.createElement("div",{className:"p-dataview-footer"},e.footer):null,K=(C=A(U),I=n.classNames("p-grid grid",{"p-nogutter grid-nogutter":!e.gutter}),i.createElement("div",{className:"p-dataview-content"},i.createElement("div",{className:I},C)));return i.createElement("div",w({id:e.id,ref:O,style:e.style,className:V},F),_,z,M,K,x,q)})));P.displayName="DataViewLayoutOptions",P.defaultProps={__TYPE:"DataViewLayoutOptions",id:null,style:null,className:null,layout:null,onChange:null},h.displayName="DataViewItem",N.displayName="DataView",N.defaultProps={__TYPE:"DataView",id:null,header:null,footer:null,value:null,layout:"list",dataKey:null,rows:null,first:0,totalRecords:null,paginator:!1,paginatorPosition:"bottom",alwaysShowPaginator:!0,paginatorClassName:null,paginatorTemplate:"FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown",paginatorLeft:null,paginatorRight:null,paginatorDropdownAppendTo:null,pageLinkSize:5,rowsPerPageOptions:null,currentPageReportTemplate:"({currentPage} of {totalPages})",emptyMessage:null,sortField:null,sortOrder:null,style:null,className:null,lazy:!1,loading:!1,loadingIcon:"pi pi-spinner",gutter:!1,itemTemplate:null,onPage:null},exports.DataView=N,exports.DataViewItem=h,exports.DataViewLayoutOptions=P;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),r=require("primereact/paginator"),a=require("primereact/ripple"),n=require("primereact/utils");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var i=l(e),u=o(t);function s(e){return s="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},s(e)}function c(e,t){if("object"!==s(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var a=r.call(e,t||"default");if("object"!==s(a))return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function p(e){var t=c(e,"string");return"symbol"===s(t)?t:String(t)}function m(e,t,r){return(t=p(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,a=new Array(t);r<t;r++)a[r]=e[r];return a}function d(e){if(Array.isArray(e))return f(e)}function g(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function y(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 v(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function b(e){if(Array.isArray(e))return e}function w(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var a,n,o,l,i=[],u=!0,s=!1;try{if(o=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;u=!1}else for(;!(u=(a=o.call(r)).done)&&(i.push(a.value),i.length!==t);u=!0);}catch(e){s=!0,n=e}finally{try{if(!u&&null!=r.return&&(l=r.return(),Object(l)!==l))return}finally{if(s)throw n}}return i}}function P(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function h(e,t){return b(e)||w(e,t)||y(e,t)||P()}function N(){return N=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},N.apply(this,arguments)}var O=i.memo((function(e){var t=function(t,r){e.onChange({originalEvent:t,value:r}),t.preventDefault()},r=n.ObjectUtils.findDiffKeys(e,O.defaultProps),o=n.classNames("p-dataview-layout-options p-selectbutton p-buttonset",e.className),l=n.classNames("p-button p-button-icon-only",{"p-highlight":"list"===e.layout}),u=n.classNames("p-button p-button-icon-only",{"p-highlight":"grid"===e.layout});return i.createElement("div",N({id:e.id,style:e.style,className:o},r),i.createElement("button",{type:"button",className:l,onClick:function(e){return t(e,"list")}},i.createElement("i",{className:"pi pi-bars"}),i.createElement(a.Ripple,null)),i.createElement("button",{type:"button",className:u,onClick:function(e){return t(e,"grid")}},i.createElement("i",{className:"pi pi-th-large"}),i.createElement(a.Ripple,null)))})),E=i.memo((function(e){return e.template(e.item,e.layout)})),j=i.memo(i.forwardRef((function(e,a){var o,l=h(i.useState(e.first),2),s=l[0],c=l[1],p=h(i.useState(e.rows),2),f=p[0],b=p[1],w=i.useRef(null),P=e.onPage?e.first:s,O=e.onPage?e.rows:f,S=function(t){return e.dataKey?n.ObjectUtils.resolveFieldData(t,e.dataKey):null},D=function(){return e.totalRecords?e.totalRecords:e.value?e.value.length:0},T=function(t){var a=n.classNames("p-paginator-"+t,e.paginatorClassName),o=D();return i.createElement(r.Paginator,{first:P,rows:O,pageLinkSize:e.pageLinkSize,className:a,onPageChange:L,template:e.paginatorTemplate,totalRecords:o,rowsPerPageOptions:e.rowsPerPageOptions,currentPageReportTemplate:e.currentPageReportTemplate,leftContent:e.paginatorLeft,rightContent:e.paginatorRight,alwaysShow:e.alwaysShowPaginator,dropdownAppendTo:e.paginatorDropdownAppendTo})},L=function(t){e.onPage?e.onPage(t):(c(t.first),b(t.rows))},R=function(){if(e.value){var t=d(r=e.value)||g(r)||y(r)||v();return t.sort((function(t,r){var a=n.ObjectUtils.resolveFieldData(t,e.sortField),o=n.ObjectUtils.resolveFieldData(r,e.sortField);return n.ObjectUtils.sort(a,o,e.sortOrder,u.default.locale,u.default.nullSortOrder)})),t}var r;return null},k=function(){if(!e.loading){var r=e.emptyMessage||t.localeOption("emptyMessage");return i.createElement("div",{className:"p-col-12 col-12 p-dataview-emptymessage"},r)}return null},A=function(t){if(n.ObjectUtils.isNotEmpty(t)){if(e.paginator){for(var r=e.lazy?0:P,a=D(),o=Math.min(O+r,a),l=[],u=r;u<o;u++){var s=t[u];s&&l.push(i.createElement(E,{key:S(t)||u,template:e.itemTemplate,layout:e.layout,item:s}))}return l}return t.map((function(t,r){return i.createElement(E,{key:S(t)||r,template:e.itemTemplate,layout:e.layout,item:t})}))}return k()};i.useImperativeHandle(a,(function(){return{props:e,getElement:function(){return w.current}}}));var C,I,U=function(){var t=e.value;return n.ObjectUtils.isNotEmpty(t)&&e.sortField&&(t=R()),t}(),F=n.ObjectUtils.findDiffKeys(e,j.defaultProps),V=n.classNames("p-dataview p-component",(m(o={},"p-dataview-".concat(e.layout),!!e.layout),m(o,"p-dataview-loading",e.loading),o),e.className),_=function(){if(e.loading){var t=n.classNames("p-dataview-loading-icon pi-spin",e.loadingIcon);return i.createElement("div",{className:"p-dataview-loading-overlay p-component-overlay"},i.createElement("i",{className:t}))}return null}(),M=!e.paginator||"bottom"===e.paginatorPosition&&"both"!==e.paginatorPosition?null:T("top"),x=!e.paginator||"top"===e.paginatorPosition&&"both"!==e.paginatorPosition?null:T("bottom"),z=e.header?i.createElement("div",{className:"p-dataview-header"},e.header):null,q=e.footer?i.createElement("div",{className:"p-dataview-footer"},e.footer):null,K=(C=A(U),I=n.classNames("p-grid grid",{"p-nogutter grid-nogutter":!e.gutter}),i.createElement("div",{className:"p-dataview-content"},i.createElement("div",{className:I},C)));return i.createElement("div",N({id:e.id,ref:w,style:e.style,className:V},F),_,z,M,K,x,q)})));O.displayName="DataViewLayoutOptions",O.defaultProps={__TYPE:"DataViewLayoutOptions",id:null,style:null,className:null,layout:null,onChange:null},E.displayName="DataViewItem",j.displayName="DataView",j.defaultProps={__TYPE:"DataView",id:null,header:null,footer:null,value:null,layout:"list",dataKey:null,rows:null,first:0,totalRecords:null,paginator:!1,paginatorPosition:"bottom",alwaysShowPaginator:!0,paginatorClassName:null,paginatorTemplate:"FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown",paginatorLeft:null,paginatorRight:null,paginatorDropdownAppendTo:null,pageLinkSize:5,rowsPerPageOptions:null,currentPageReportTemplate:"({currentPage} of {totalPages})",emptyMessage:null,sortField:null,sortOrder:null,style:null,className:null,lazy:!1,loading:!1,loadingIcon:"pi pi-spinner",gutter:!1,itemTemplate:null,onPage:null},exports.DataView=j,exports.DataViewItem=E,exports.DataViewLayoutOptions=O;

package/dataview/dataview.d.ts

@@ -1,70 +1,249 @@
+/**
+ *
+ * DataView displays data in grid or list layout with pagination and sorting features.
+ *
+ * [Live Demo](https://www.primefaces.org/primereact/dataview/)
+ *
+ * @module dataview
+ *
+ */
 import * as React from 'react';
 import { PaginatorTemplate } from '../paginator';
 
-type DataViewLayoutType = 'list' | 'grid' | (string & Record<string, unknown>);
-
-type DataViewPaginatorPositionType = 'top' | 'bottom' | 'both';
-
-type DataViewSortOrderType = 1 | 0 | -1 | undefined | null;
-
-type DataViewAppendToType = 'self' | HTMLElement | undefined | null;
-
-interface DataViewPageParams {
+/**
+ * Custom page event.
+ * @see {@link DataViewProps.onPage}
+ * @event
+ */
+interface DataViewPageEvent {
+    /**
+     * Index of the first records on page.
+     */
     first: number;
+    /**
+     * Number of records to display per page.
+     */
     rows: number;
+    /**
+     * Value of the new page.
+     */
     page: number;
+    /**
+     * Total number of pages.
+     */
     pageCount: number;
 }
 
-interface DataViewLayoutOptionsChangeParams {
+/**
+ * Custom data view layout options event.
+ */
+interface DataViewLayoutOptionsChangeEvent {
+    /**
+     * Browser event.
+     */
     originalEvent: React.MouseEvent<HTMLButtonElement>;
-    value: DataViewLayoutType;
+    /**
+     * New value.
+     */
+    value: 'list' | 'grid' | (string & Record<string, unknown>);
 }
 
+/**
+ * Custom data view layout options props
+ * @group Misc
+ */
 export interface DataViewLayoutOptionsProps {
+    /**
+     * Unique identifier of the element.
+     */
     id?: string;
-    layout?: DataViewLayoutType;
+    /**
+     * Orientation of the panels, valid values are "list" and "grid".
+     */
+    layout?: 'list' | 'grid' | (string & Record<string, unknown>);
+    /**
+     * Inline style of the element.
+     */
     style?: React.CSSProperties;
+    /**
+     * Style class of the element.
+     */
     className?: string;
-    onChange(e: DataViewLayoutOptionsChangeParams): void;
-    children?: React.ReactNode;
+    /**
+     * Layout options change callback
+     * @param {DataViewLayoutOptionsChangeEvent} event - Custom event.
+     */
+    onChange(event: DataViewLayoutOptionsChangeEvent): void;
+    /**
+     * Used to get the child elements of the component.
+     * @readonly
+     */
+    children?: React.ReactNode | undefined;
 }
 
+/**
+ * Custom data view layout options
+ * @group Misc
+ * @extends {React.Component<DataViewLayoutOptionsProps, any>}
+ */
 export declare class DataViewLayoutOptions extends React.Component<DataViewLayoutOptionsProps, any> {}
 
+/**
+ * Defines valid properties in DataView component. In addition to these, all properties of HTMLDivElement can be used in this component.
+ * @group Properties
+ */
 export interface DataViewProps extends Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, 'ref'> {
-    header?: React.ReactNode;
-    footer?: React.ReactNode;
-    value?: any[];
-    layout?: DataViewLayoutType;
-    dataKey?: string;
-    rows?: number;
-    first?: number;
-    totalRecords?: number;
-    paginator?: boolean;
-    paginatorPosition?: DataViewPaginatorPositionType;
-    alwaysShowPaginator?: boolean;
-    paginatorClassName?: string;
-    paginatorTemplate?: PaginatorTemplate;
-    paginatorLeft?: React.ReactNode;
-    paginatorRight?: React.ReactNode;
-    pageLinkSize?: number;
-    paginatorDropdownAppendTo?: DataViewAppendToType;
-    rowsPerPageOptions?: number[];
-    currentPageReportTemplate?: string;
-    emptyMessage?: string;
-    sortField?: string;
-    sortOrder?: DataViewSortOrderType;
-    lazy?: boolean;
-    loading?: boolean;
-    loadingIcon?: string;
-    gutter?: boolean;
-    onPage?(e: DataViewPageParams): void;
-    itemTemplate?(item: any, layout: DataViewLayoutType): React.ReactNode;
-    children?: React.ReactNode;
+    /**
+     * Header content of the component.
+     */
+    header?: React.ReactNode | undefined;
+    /**
+     * Footer content of the component.
+     */
+    footer?: React.ReactNode | undefined;
+    /**
+     * An array of objects to display.
+     */
+    value?: any[] | undefined;
+    /**
+     * Layout of the items, valid values are "list" and "grid".
+     * @defaultValue list
+     */
+    layout?: 'list' | 'grid' | (string & Record<string, unknown>);
+    /**
+     * Name of the field that uniquely identifies a record in the data. Should be a unique business key to prevent re-rendering.
+     */
+    dataKey?: string | undefined;
+    /**
+     * Number of rows to display per page.
+     */
+    rows?: number | undefined;
+    /**
+     * Index of the first record to render.
+     * @defaultValue 0
+     */
+    first?: number | undefined;
+    /**
+     * Number of total records, defaults to length of value when not defined.
+     */
+    totalRecords?: number | undefined;
+    /**
+     * When specified as true, enables the pagination.
+     * @defaultValue false
+     */
+    paginator?: boolean | undefined;
+    /**
+     * Position of the paginator, options are "top","bottom" or "both".
+     * @defaultValue bottom
+     */
+    paginatorPosition?: 'top' | 'bottom' | 'both' | undefined;
+    /**
+     * Whether to show it even there is only one page.
+     * @defaultValue true
+     */
+    alwaysShowPaginator?: boolean | undefined;
+    /**
+     * Style class of the paginator element.
+     */
+    paginatorClassName?: string | undefined;
+    /**
+     * Template of the paginator. For details, refer to the template section of the paginator documentation for further options.
+     * @defaultValue FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown
+     */
+    paginatorTemplate?: PaginatorTemplate | undefined;
+    /**
+     * Content for the left side of the paginator.
+     */
+    paginatorLeft?: React.ReactNode | undefined;
+    /**
+     * Content for the right side of the paginator.
+     */
+    paginatorRight?: React.ReactNode | undefined;
+    /**
+     * Number of page links to display.
+     * @defaultValue 5
+     */
+    pageLinkSize?: number | undefined;
+    /**
+     * DOM element instance where the overlay panel should be mounted. Valid values are any DOM Element and 'self'. The self value is used to render a component where it is located.
+     * @defaultValue document.body
+     */
+    paginatorDropdownAppendTo?: 'self' | HTMLElement | undefined | null;
+    /**
+     * Array of integer values to display inside rows per page dropdown.
+     */
+    rowsPerPageOptions?: number[] | undefined;
+    /**
+     * Template of the current page report element.
+     * @defaultValue (&123;currentPage&125; of &123;totalPages&125;)
+     */
+    currentPageReportTemplate?: string | undefined;
+    /**
+     * Text to display when there is no data.
+     * @defaultValue No records found.
+     */
+    emptyMessage?: string | undefined;
+    /**
+     * Name of the field to sort data by default.
+     */
+    sortField?: string | undefined;
+    /**
+     * Order to sort the data by default.
+     */
+    sortOrder?: 1 | 0 | -1 | undefined | null;
+    /**
+     * Defines if data is loaded and interacted with in lazy manner.
+     * @defaultValue false
+     */
+    lazy?: boolean | undefined;
+    /**
+     * Display loading icon of the button.
+     */
+    loading?: boolean | undefined;
+    /**
+     * Name of the loading icon or JSX.Element for loading icon.
+     */
+    loadingIcon?: string | undefined;
+    /**
+     * Whether the grid structure in the container has gutter. Default value is false.
+     * @defaultValue false
+     */
+    gutter?: boolean | undefined;
+    /**
+     * Callback to invoke on pagination.
+     * @param {DataViewPageEvent} event - Custom page event.
+     */
+    onPage?(event: DataViewPageEvent): void;
+    /**
+     * Function that gets the option along with the layout mdoe and returns the content.
+     * @param {*} item - Current item.
+     * @param {'list' | 'grid' | (string & Record<string, unknown>)} layout - Current layout.
+     */
+    itemTemplate?(item: any, layout: 'list' | 'grid' | (string & Record<string, unknown>)): React.ReactNode;
+    /**
+     * Used to get the child elements of the component.
+     * @readonly
+     */
+    children?: React.ReactNode | undefined;
 }
 
+/**
+ * **PrimeReact - DataViewLayoutOptions**
+ *
+ * _DataView displays data in grid or list layout with pagination and sorting features._
+ *
+ * [Live Demo](https://www.primefaces.org/primereact/dataview/)
+ * --- ---
+ * ![PrimeReact](https://www.primefaces.org/primereact/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
 // tslint:disable-next-line:max-classes-per-file
 export declare class DataView extends React.Component<DataViewProps, any> {
+    /**
+     * Used to get container element.
+     * @return {HTMLDivElement} Container element
+     */
     public getElement(): HTMLDivElement;
 }