primereact
Version:
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
2 lines (1 loc) • 10.6 kB
JavaScript
import*as t from"react";import e,{PrimeReactContext as r,localeOption as n}from"primereact/api";import{ComponentBase as o,useHandleStyle as a}from"primereact/componentbase";import{BarsIcon as i}from"primereact/icons/bars";import{SpinnerIcon as l}from"primereact/icons/spinner";import{ThLargeIcon as u}from"primereact/icons/thlarge";import{Paginator as s}from"primereact/paginator";import{Ripple as p}from"primereact/ripple";import{classNames as c,IconUtils as m,ObjectUtils as f}from"primereact/utils";import{useMergeProps as g}from"primereact/hooks";function d(){return d=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(t[n]=r[n])}return t},d.apply(this,arguments)}function y(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=new Array(e);r<e;r++)n[r]=t[r];return n}function v(t){if(Array.isArray(t))return y(t)}function b(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}function h(t,e){if(t){if("string"==typeof t)return y(t,e);var r=Object.prototype.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?y(t,e):void 0}}function w(){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 P(t){if(Array.isArray(t))return t}function O(t,e){var r=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=r){var n,o,a,i,l=[],u=!0,s=!1;try{if(a=(r=r.call(t)).next,0===e){if(Object(r)!==r)return;u=!1}else for(;!(u=(n=a.call(r)).done)&&(l.push(n.value),l.length!==e);u=!0);}catch(t){s=!0,o=t}finally{try{if(!u&&null!=r.return&&(i=r.return(),Object(i)!==i))return}finally{if(s)throw o}}return l}}function S(){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 E(t,e){return P(t)||O(t,e)||h(t,e)||S()}function j(t){return j="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},j(t)}function N(t,e){if("object"!==j(t)||null===t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var n=r.call(t,e||"default");if("object"!==j(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}function I(t){var e=N(t,"string");return"symbol"===j(e)?e:String(e)}function T(t,e,r){return(e=I(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}var A=o.extend({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:null,gutter:!1,itemTemplate:null,listTemplate:null,onPage:null,children:void 0},css:{classes:{loadingIcon:"p-dataview-loading-icon",loadingOverlay:"p-dataview-loading-overlay p-component-overlay",emptyMessage:"p-dataview-emptymessage",header:"p-dataview-header",footer:"p-dataview-footer",content:"p-dataview-content",grid:function(t){return c("p-grid grid",{"p-nogutter grid-nogutter":!t.props.gutter})},root:function(t){var e=t.props;return c("p-dataview p-component",T(T({},"p-dataview-".concat(e.layout),!!e.layout),"p-dataview-loading",e.loading))}},styles:"\n@layer primereact {\n .p-dataview-loading {\n position: relative;\n min-height: 4rem;\n }\n\n .p-dataview .p-dataview-loading-overlay {\n position: absolute;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\n"}}),D=o.extend({defaultProps:{__TYPE:"DataViewLayoutOptions",id:null,style:null,className:null,layout:null,listIcon:null,gridIcon:null,onChange:null,children:void 0},css:{classes:{root:"p-dataview p-component p-dataview-layout-options p-selectbutton p-button-group",listButton:function(t){return c("p-button p-button-icon-only",{"p-highlight":"list"===t.props.layout})},gridButton:function(t){return c("p-button p-button-icon-only",{"p-highlight":"grid"===t.props.layout})}}}});function C(t,e){var r="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!r){if(Array.isArray(t)||(r=k(t))||e&&t&&"number"==typeof t.length){r&&(t=r);var n=0,o=function(){};return{s:o,n:function(){return n>=t.length?{done:!0}:{done:!1,value:t[n++]}},e:function(t){throw t},f:o}}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 a,i=!0,l=!1;return{s:function(){r=r.call(t)},n:function(){var t=r.next();return i=t.done,t},e:function(t){l=!0,a=t},f:function(){try{i||null==r.return||r.return()}finally{if(l)throw a}}}}function k(t,e){if(t){if("string"==typeof t)return L(t,e);var r=Object.prototype.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?L(t,e):void 0}}function L(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=new Array(e);r<e;r++)n[r]=t[r];return n}function M(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.push.apply(r,n)}return r}function x(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?M(Object(r),!0).forEach((function(e){T(t,e,r[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):M(Object(r)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))}))}return t}var R=t.memo((function(e){var n=g(),o=t.useContext(r),a=D.getProps(e,o),l=D.setMetaData({props:a}),s=l.ptm,f=l.cx,d=function(t,e){a.onChange({originalEvent:t,value:e}),t.preventDefault()},y=n(s("list")),v=n(s("grid")),b=m.getJSXIcon(a.listIcon||t.createElement(i,y),x({},y),{props:a}),h=m.getJSXIcon(a.gridIcon||t.createElement(u,v),x({},v),{props:a}),w=n({id:a.id,style:a.style,className:c(a.className,f("root"))},D.getOtherProps(a),s("root")),P=n({type:"button",className:f("listButton"),onClick:function(t){return d(t,"list")}},s("listButton")),O=n({type:"button",className:f("gridButton"),onClick:function(t){return d(t,"grid")}},s("gridButton"));return t.createElement("div",w,t.createElement("button",P,b,t.createElement(p,null)),t.createElement("button",O,h,t.createElement(p,null)))})),z=t.memo((function(t){return t.template(t.item,t.layout)})),B=t.memo(t.forwardRef((function(o,i){var u=g(),p=t.useContext(r),y=A.getProps(o,p),P=E(t.useState(y.first),2),O=P[0],S=P[1],j=E(t.useState(y.rows),2),N=j[0],I=j[1],T={props:y,state:{first:O,rows:N}},D=A.setMetaData(T),k=D.ptm,L=D.cx;a(A.css.styles,D.isUnstyled,{name:"dataview"});var M=t.useRef(null),R=y.onPage?y.first:O,B=y.onPage?y.rows:N,F=function(t){return y.dataKey?f.resolveFieldData(t,y.dataKey):null},_=function(){return y.totalRecords?y.totalRecords:y.value?y.value.length:0},V=function(e){var r=c("p-paginator-"+e,y.paginatorClassName),n=_();return t.createElement(s,{first:R,rows:B,pageLinkSize:y.pageLinkSize,className:r,onPageChange:J,template:y.paginatorTemplate,totalRecords:n,rowsPerPageOptions:y.rowsPerPageOptions,currentPageReportTemplate:y.currentPageReportTemplate,leftContent:y.paginatorLeft,rightContent:y.paginatorRight,alwaysShow:y.alwaysShowPaginator,dropdownAppendTo:y.paginatorDropdownAppendTo,ptm:k("paginator"),unstyled:y.unstyled,__parentMetadata:{parent:T}})},J=function(t){y.onPage?y.onPage(t):(S(t.first),I(t.rows))},X=function(t){if(y.paginator){var e=y.lazy?0:R,r=_(),n=Math.min(B+e,r);return t.slice(e,n)||[]}return t},K=function(){if(y.value){var t,r=new Map,n=f.localeComparator(p&&p.locale||e.locale),o=v(l=y.value)||b(l)||h(l)||w(),a=C(o);try{for(a.s();!(t=a.n()).done;){var i=t.value;r.set(i,f.resolveFieldData(i,y.sortField))}}catch(t){a.e(t)}finally{a.f()}return o.sort((function(t,o){var a=r.get(t),i=r.get(o);return f.sort(a,i,y.sortOrder,n,p&&p.nullSortOrder||e.nullSortOrder)})),o}var l;return null},U=function(){if(!y.loading){var e=y.emptyMessage||n("emptyMessage"),r=u({className:L("emptyMessage")},k("emptyMessage"));return t.createElement("div",r,e)}return null},Y=function(e){return f.isNotEmpty(e)?X(e).map((function(e,r){return t.createElement(z,{key:F(e)||r,template:y.itemTemplate,layout:y.layout,item:e})})):U()};t.useImperativeHandle(i,(function(){return{props:y,getElement:function(){return M.current}}}));var $=function(){var t=y.value;return f.isNotEmpty(t)&&y.sortField&&(t=K()),t}(),H=function(){if(y.loading){var e=u({className:L("loadingIcon")},k("loadingIcon")),r=y.loadingIcon||t.createElement(l,d({},e,{spin:!0})),n=m.getJSXIcon(r,x({},e),{props:y}),o=u({className:L("loadingOverlay")},k("loadingOverlay"));return t.createElement("div",o,n)}return null}(),q=!y.paginator||"bottom"===y.paginatorPosition&&"both"!==y.paginatorPosition?null:V("top"),G=!y.paginator||"top"===y.paginatorPosition&&"both"!==y.paginatorPosition?null:V("bottom"),Q=function(){if(y.header){var e=u({className:L("header")},k("header"));return t.createElement("div",e,y.header)}return null}(),W=function(){if(y.footer){var e=u({className:L("footer")},k("footer"));return t.createElement("div",e,y.footer)}return null}(),Z=function(e){var r=u({className:L("content")},k("content")),n=null;if(y.listTemplate){var o=X(e);n=f.getJSXElement(y.listTemplate,o,y.layout)}else{var a=Y(e),i=u({className:L("grid")},k("grid"));n=t.createElement("div",i,a)}return t.createElement("div",r,n)}($),tt=u({id:y.id,ref:M,style:y.style,className:c(y.className,L("root"))},A.getOtherProps(y),k("root"));return t.createElement("div",tt,H,Q,q,Z,G,W)})));R.displayName="DataViewLayoutOptions",z.displayName="DataViewItem",B.displayName="DataView";export{B as DataView,z as DataViewItem,R as DataViewLayoutOptions};