carbon-react/esm/components/pager/pager.component.js

A library of reusable React components for easily building user interfaces.

import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r,useRef as o,useCallback as n,useEffect as i}from"react";import s from"../select/option/option.component.js";import"../select/option-row/option-row.component.js";import"../select/option-group-header/option-group-header.component.js";import{SimpleSelect as a}from"../select/simple-select/simple-select.component.js";import"../select/filterable-select/filterable-select.component.js";import"../select/multi-select/multi-select.component.js";import l from"./__internal__/pager-navigation.component.js";import c from"../../hooks/__internal__/useLocale/useLocale.js";import p from"../../__internal__/utils/helpers/guid/index.js";import{StyledPagerContainer as u,StyledPagerSizeOptions as m,StyledPagerSummary as g,StyledPagerSizeOptionsInner as d,StyledSelectContainer as h}from"./pager.style.js";import f from"../../__internal__/utils/helpers/events/events.js";import b from"../../__internal__/utils/helpers/tags/tags.js";function P(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function w(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){P(e,t,r[t])}))}return e}function O(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const j=P=>{var{currentPage:j=1,hideDisabledElements:S=!1,interactivePageNumber:v=!0,pageSizeSelectionOptions:y=[{id:"10",name:10},{id:"25",name:25},{id:"50",name:50},{id:"100",name:100}],pageSize:_=10,showPageSizeSelection:B=!1,totalRecords:z=0,onPagination:L,onNext:x,onFirst:N,onPrevious:k,onLast:A,showPageSizeLabelBefore:D=!0,showPageSizeLabelAfter:C=!0,showTotalRecords:E=!0,showFirstAndLastButtons:F=!0,showPreviousAndNextButtons:R=!0,showPageCount:T=!0,variant:K="default",smallScreenBreakpoint:I}=P,M=function(e,t){if(null==e)return{};var r,o,n=function(e,t){if(null==e)return{};var r,o,n={},i=Object.keys(e);for(o=0;o<i.length;o++)r=i[o],t.indexOf(r)>=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(o=0;o<i.length;o++)r=i[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(P,["currentPage","hideDisabledElements","interactivePageNumber","pageSizeSelectionOptions","pageSize","showPageSizeSelection","totalRecords","onPagination","onNext","onFirst","onPrevious","onLast","showPageSizeLabelBefore","showPageSizeLabelAfter","showTotalRecords","showFirstAndLastButtons","showPreviousAndNextButtons","showPageCount","variant","smallScreenBreakpoint"]);const $=c(),[q,G]=r(+j),[H,J]=r(+_),[Q,U]=r(+_),V=`Pager_size_selector_${o(p()).current}`,W=n((()=>+z<0||Number.isNaN(+z)?1:Math.ceil(+z/H)),[z,H]),[X,Y]=r(W());i((()=>{J(+_),U(+_)}),[_]),i((()=>{const e=W();Y(e),G(+j>e?e:+j)}),[H,X,j,z,W]);const Z=n((e=>{G(1),N&&N(e)}),[N]),ee=n((e=>{G(X),A&&A(e)}),[X,A]),te=n((e=>{G(q+1),x&&x(e)}),[x,q]),re=n((e=>{G(q-1),k&&k(e)}),[q,k]),oe=n((e=>{U(+e),J(+e),L(1,+e,"page-select")}),[L]),ne=n((e=>f.isEnterKey(e)&&oe(e.target.value)),[oe]);return e(u,O(w({variant:K,smallScreenBreakpoint:I,showPageSizeSelection:B,showTotalRecords:E},M,b("pager",M)),{children:[B&&t(m,{children:(()=>{const r=(e,r)=>e?t("label",{htmlFor:V,children:r}):t("div",{children:r});return e(d,{children:[D&&r(D,$.pager.show()),t(h,{children:t(a,O(w({value:String(Q),onChange:e=>U(+e.target.value),onBlur:()=>U(H),onKeyDown:ne,"data-element":"page-select",id:V},D||C?{}:{ariaLabel:$.pager.show()}),{children:y.map((e=>t(s,{text:e.id,value:String(e.name),onClick:oe},e.id)))}))}),C&&r(!D,$.pager.records(H,!1))]})})()}),t(l,{pageSize:H,currentPage:q,interactivePageNumber:v,hideDisabledElements:S,setCurrentPage:G,onNext:te,onPrevious:re,onFirst:Z,onLast:ee,onPagination:L,pageCount:X,showFirstAndLastButtons:F,showPreviousAndNextButtons:R,showPageCount:T,smallScreenBreakpoint:I}),E&&t(g,{smallScreenBreakpoint:I,children:$.pager.records(z)})]}))};export{j as Pager,j as default};