@react-to-styled/table/dist/cjs/table.production.min.js

Table component with React and styled-components

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-to-styled/essentials"),t=require("@react-to-styled/loader"),a=require("react"),l=require("styled-components");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=r(a),o=r(l);const d=(e,t,a=1)=>{let l=e;const r=[];for(;l<=t;)r.push(l),l+=a;return r},s=({onPagination:e,currentPage:t=1,totalRecords:l,pageLimit:r,isFetching:o})=>{const[s,f]=a.useState(1),[p,b]=a.useState([1]);return a.useEffect((()=>{f(Math.ceil(l/r)),b((()=>{if(s>9){const e=Math.max(2,t-2),a=Math.min(s-1,t+2);let l=d(e,a);const r=e>2&&t>5,n=s-a>1&&s-t>4,o=7-(l.length+1);switch(!0){case r&&!n:l=["LEFT",1,"...",...d(e-o,e-1),...l,s];break;case!r&&n:{const e=d(a+1,a+o);l=[1,...l,...e,"...",s,"RIGHT"];break}default:l=["LEFT",1,"...",...l,"...",s,"RIGHT"]}return[...l]}return d(1,s)})())}),[l,s,t,r]),n.default.createElement(n.default.Fragment,null,p.length>1&&!o&&n.default.createElement(i,{"data-element":"pagination",className:"rts-table__paginator"},n.default.createElement(c,null,p.length&&p.map(((a,l)=>"LEFT"===a?n.default.createElement(u,{key:l,className:"rts-table__paginator--item"},n.default.createElement(m,{onClick:a=>(a.preventDefault(),void e(t-4-1)),className:"rts-table__paginator--link"},"<<")):"..."===a?n.default.createElement("span",{key:l},"..."):"RIGHT"===a?n.default.createElement(u,{key:l,className:"rts-table__paginator--item"},n.default.createElement(m,{onClick:a=>(a.preventDefault(),void e(t+4+1)),className:"rts-table__paginator--link"},">>")):n.default.createElement(u,{key:l,className:"rts-table__paginator--item"},n.default.createElement(m,{active:t===a,disabled:t===a,onClick:t=>(t=>a=>{a.preventDefault(),e(t)})(a)(t),className:"rts-table__paginator--link"},a)))))))},i=o.default.nav`
  text-align: center;
  border-bottom: 1px solid ${e.Colors.borderColor};
`,c=o.default.ul`
  display: inline-block;
`,u=o.default.li`
  display: inline-block;
  vertical-align: middle;
`,m=o.default.a`
  font-size: 1rem;
  color: ${e.Colors.textColor};
  cursor: pointer;
  display: flex;
  padding: 0 5px;
  border: 1px solid transparent;
  ${e=>e.disabled&&"pointer-events: none;"};
  ${t=>t.active&&`\n      color: ${e.Colors.paginatorActiveBorder};\n      cursor: default;\n      border: 1px solid ${e.Colors.paginatorActiveBorder};\n      border-radius: 5px;\n    `};
`,f=({columns:e,rowData:t,rowIndex:l,...r})=>{const[o,d]=a.useState(!1),[s,i]=a.useState({}),c=e=>{i({...e}),d(!!e)},u=n.default.createElement("tr",{...r},Object.values(e).map((({Cell:a},r)=>a?n.default.createElement(x,{isFirst:0===r,isLast:--Object.keys(e).length===r,key:r},n.default.createElement(a,{onRowExpand:c,data:t,index:l})):null)));return n.default.createElement(n.default.Fragment,null,u,o&&n.default.createElement("tr",null,Object.values(e).map((({ExpandedCell:a},r)=>a?n.default.createElement(h,{colSpan:Object.values(e).length,key:r},n.default.createElement(a,{data:{...s,...t},index:l})):null))))},p=o.default.div`
  display: flex;
  flex-direction: column;
  border: 1px solid ${e.Colors.borderColor};
  background-color: ${e.Colors.background};
  border-bottom: 0;
  font-family: ${e.Fonts.OpenSans}, serif;

  > table {
    width: 100%;
    border-collapse: collapse;
  }
`,b=o.default.table`
  table-layout: fixed;
  border-spacing: 0;
`,g=o.default.div`
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
  max-width: 100%;
`,E=o.default(g)`
  color: ${e.Colors.textColor};
  font-weight: normal;
  text-transform: uppercase;
  vertical-align: middle;
`,x=o.default.td`
  ${({width:t,isFirst:a,isLast:l})=>`\n      border-bottom: 1px solid ${e.Colors.borderColor};\n      padding: 1rem 0;\n      ${"number"==typeof t?`width: ${t}px;`:`width: ${t||""};`}\n      ${a?"padding-left: 1.4rem;":"padding-left: 0.7rem;"}\n      ${l?"padding-right: 1.4rem;":"padding-right: 0.7rem;"}\n    `}
`,h=o.default.td`
  padding: 0;
`,_=o.default(x)`
  display: flex;
  justify-content: center;
  width: 100%;
  text-align: center;
  margin: auto;
`,y=o.default.thead`
  background-color: ${e.Colors.grayBackground};
`;exports.Column=x,exports.LoadingColumn=_,exports.Paginator=s,exports.Table=({data:e,columns:a,paginationProps:l,isLoading:r,...o})=>n.default.createElement(p,{"data-element":"tableWrapper",className:"rts-table__container"},n.default.createElement(b,{"data-element":"table",...o},n.default.createElement(y,{className:"rts-table__header"},n.default.createElement("tr",null,a&&Object.values(a).map((({header:e,width:t},l)=>e&&!r?n.default.createElement(x,{width:t,isFirst:0===l,isLast:Object.keys(a).length-1===l,key:l,className:"rts-table__column"},n.default.createElement(E,null,e)):0===l&&r?n.default.createElement(x,{width:"100%",isFirst:!0,isLast:!0,key:l,className:"rts-table__column"},n.default.createElement(E,null," ")):null)))),n.default.createElement("tbody",null,r?n.default.createElement("tr",null,n.default.createElement(_,{className:"rts-table__column--loading"},n.default.createElement(t.Loader,null))):null==e?void 0:e.map(((e,t)=>n.default.createElement(f,{key:t,columns:a,rowIndex:t,rowData:e,className:"rts-table__row"}))))),l&&n.default.createElement(s,{...l,isFetching:r})),exports.TruncatedText=g;
//# sourceMappingURL=table.production.min.js.map