react-material-pagination-v4z/build/index.esm.js

React material(v.4) pagination. (Hooks)

import e from"react";import{makeStyles as a,Button as t}from"@material-ui/core";import{HtmlUtils as i}from"@delpi/common";var n=a((function(e){return{paginatorRootContainer:{display:"inline-flex",alignItems:"center",justifyContent:"center",gap:"8px"},paginatorContainer:{"& div.paging-hide":{opacity:.4,pointerEvents:"none","&.paging-hide-now":{opacity:0},"& .paging-more":{opacity:0}},"& .paging-more":{fontSize:"1rem",fontWeight:"bold"},"& div.paging-show":{visibility:"visible",pointerEvents:"all"}},pagerContainer:{"& .paging-forward-back":{cursor:"pointer",padding:8},"& div":{minWidth:"32px",height:"32px"},"& .paging-separator":{fontWeight:"bold",minWidth:"unset"},"& .paging-current":{borderRadius:"4px"}},pagingButton:{margin:"8px auto",color:e.palette.primary.main||"#3f50b5",userSelect:"none","& button":{minWidth:48,height:32,borderRadius:8,backgroundColor:"#fff",color:e.palette.primary.main||"#3f50b5",border:"1px solid ".concat(e.palette.primary.main||"#3f50b5"),"&.Mui-disabled":{opacity:.4,color:"".concat(e.palette.primary.main||"#3f50b5"," !important")},"&.paging-active":{backgroundColor:e.palette.primary.main||"#3f50b5",color:"#fff",border:"none"}}}}})),r=function(a){var r=a.className,o=a.totalCount,l=a.limit,s=void 0===l?10:l,c=a.currentPage,p=a.sectionNumber,d=void 0===p?5:p,g=a.type,m=void 0===g?"default":g,u=a.labelFirst,f=void 0===u?"|<<":u,v=a.labelLast,b=void 0===v?">>|":v,C=a.labelBack,E=void 0===C?"<":C,h=a.labelForward,y=void 0===h?">":h,F=a.showFirstLast,N=void 0===F||F,k=a.showForwardBack,w=void 0!==k&&k,R=a.hideFirstLastIfActive,j=void 0!==R&&R,x=a.setCurrentPage;if(!o||!s)return e.createElement(e.Fragment,null);var B=n(),W=Math.ceil(o/s);e.useEffect((function(){c<=0&&x(1),c>W&&x(W)}),[c]),d<3&&(d=3),d>W&&(d=W);var A,L,I=c>2,M=c+d<=W+1,P=c>W;if("default"!==m)return e.createElement((function(){return e.createElement("div",{className:i.joinClass(B.paginatorRootContainer,B.pagerContainer,B.pagingButton,r)},N&&e.createElement(H,{disabled:A}),e.createElement(J,{disabled:A}),e.createElement("div",{className:i.joinClass(B.paginatorRootContainer,"paging-current")},P?W:c),e.createElement("div",{className:i.joinClass(B.paginatorRootContainer,"paging-separator")},"/"),e.createElement("div",{className:i.joinClass(B.paginatorRootContainer,"paging-totals")},W),e.createElement(J,{isFirst:!1,disabled:L}),N&&e.createElement(H,{isFirst:!1,disabled:L}))}),null);A=(P=P||W<=d)||c<=1,L=P||c>=W;var S=[],z=c-1;z<=0&&(z=1);var q=z+d;q>W&&(z=(q=W+1)-d);for(var D=z;D<q;D++)S.push(D);return e.createElement("div",{className:i.joinClass(B.paginatorRootContainer,B.paginatorContainer,B.pagingButton,r)},w&&e.createElement(J,{disabled:A}),N&&e.createElement(G,null),function(e,a,t){if(t||2===arguments.length)for(var i,n=0,r=a.length;n<r;n++)!i&&n in a||(i||(i=Array.prototype.slice.call(a,0,n)),i[n]=a[n]);return e.concat(i||Array.prototype.slice.call(a))}([],S,!0).map((function(a,n){return e.createElement(t,{key:"n-".concat(a,"-").concat(n),className:i.joinClass("paging-numbered",c===a&&"paging-active"),onClick:function(){return x(a)}},a)})),N&&e.createElement(G,{isFirst:!1}),w&&e.createElement(J,{isFirst:!1,disabled:L}));function G(a){var t=a.isFirst,n=void 0===t||t,r=n?I:M;return e.createElement("div",{className:i.joinClass(B.paginatorRootContainer,"".concat(!P&&r?"paging-show":"paging-hide"),j&&"paging-hide-now")},!n&&e.createElement("span",{className:"paging-more"},"..."),e.createElement(H,{isFirst:n}),n&&e.createElement("span",{className:"paging-more"},"..."))}function H(a){var i=a.isFirst,n=void 0===i||i,r=a.disabled,o=void 0!==r&&r;return e.createElement(t,{className:"paging-first-last",disabled:o,onClick:function(){return x(n?1:W)}},n?f:b)}function J(a){var i=a.isFirst,n=void 0===i||i,r=a.disabled,o=void 0!==r&&r;return e.createElement(t,{className:"paging-forward-back",disabled:o,onClick:function(){if(!o)return x(c-(n?1:-1))}},n?E:y)}};export{r as Pagination,r as default};