@secondstaxorg/sscomp 1.8.39 → 1.8.41

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/index.es.js +2 -1
  2. package/dist/index.es.js.map +1 -1
  3. package/dist/index.js +28 -23
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.js +2 -1
  6. package/dist/index.min.js.map +1 -1
  7. package/package.json +1 -1
  8. package/types/components/TablePrimary/type.d.ts +5 -2
package/dist/index.js CHANGED
@@ -25446,6 +25446,7 @@ const Table = styled.table`
25446
25446
  }
25447
25447
  thead th{
25448
25448
  padding: 11px 16px;
25449
+ cursor: pointer;
25449
25450
  }
25450
25451
  thead th, thead div{
25451
25452
  color: ${theme.colors.white};
@@ -25508,41 +25509,45 @@ const _jsxFileName$b = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\compon
25508
25509
  */
25509
25510
  const TablePrimary = (props) => {
25510
25511
  const {thead,children,tbody,clickedRow,showPagination,itemsPerPage} = props;
25511
- const [cellItems,setCellItems] = React$1.useState([]);
25512
- const [tbodyItems,setTbodyItems] = React$1.useState(thead);
25513
-
25514
- React$1.useEffect(()=>{
25515
- if (tbody) {
25516
- setCellItems(Object.keys(tbody[0]));
25512
+ const [tbodyItems,setTbodyItems] = React$1.useState([]);
25513
+ const [tbodyOri,setTbodyOri] = React$1.useState(tbody);
25514
+
25515
+ function sortByColumn(column){
25516
+ if (tbody){
25517
+ const sortedItems = [...tbody];
25518
+ sortedItems.sort((a,b) => a[column].localeCompare(b[column]));
25519
+ setTbodyOri(sortedItems);
25517
25520
  }
25518
- },[tbody]);
25521
+ }
25519
25522
 
25520
25523
  return (
25521
25524
  React$1.createElement(React$1.Fragment, null
25522
- , React$1.createElement(TableContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 22}}
25523
- , React$1.createElement(Table, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 23}}
25524
- , React$1.createElement('thead', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 24}}
25525
- , React$1.createElement('tr', { className: "rounded-row", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 25}}
25525
+ , React$1.createElement(TableContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 24}}
25526
+ , React$1.createElement(Table, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 25}}
25527
+ , React$1.createElement('thead', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 26}}
25528
+ , React$1.createElement('tr', { className: "rounded-row", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 27}}
25526
25529
  , thead.map((item,index) => (
25527
- React$1.createElement('th', { key: index, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 27}}, item)
25530
+ React$1.createElement('th', { key: index, onClick: ()=>{
25531
+ sortByColumn(item.dataKey);
25532
+ }, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 29}}, item.label)
25528
25533
  ))
25529
25534
  )
25530
25535
  )
25531
- , React$1.createElement('tbody', { className: "rounded-row", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 31}}
25536
+ , React$1.createElement('tbody', { className: "rounded-row", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 35}}
25532
25537
  , children
25533
25538
  , tbodyItems && tbodyItems.map((item,index) => (
25534
25539
  React$1.createElement('tr', { key: index, className: clickedRow && 'clickable', onClick: ()=>{
25535
25540
  if (clickedRow) {
25536
25541
  clickedRow(item);
25537
- }}, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 34}}
25538
- , cellItems.length > 0 && cellItems.map((cellItem,index) => (
25539
- React$1.createElement('td', { key: index, className: (index == cellItems.length - 1 && clickedRow) ? 'with-arrow' : '', __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 39}}
25540
- , React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 40}}
25541
- , item[cellItem]
25542
+ }}, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 38}}
25543
+ , thead.map((cellItem,index) => (
25544
+ React$1.createElement('td', { key: index, className: (index == thead.length - 1 && clickedRow) ? 'with-arrow' : '', __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 43}}
25545
+ , React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 44}}
25546
+ , item[cellItem.dataKey]
25542
25547
  )
25543
- , (index == cellItems.length - 1 && clickedRow) &&
25544
- React$1.createElement('svg', { width: "16", height: "16", viewBox: "0 0 16 16" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 44}}
25545
- , React$1.createElement('path', { d: "M10.3592 7.52685L6.58584 3.76019C6.52387 3.6977 6.45013 3.64811 6.36889 3.61426C6.28765 3.58041 6.20052 3.56299 6.11251 3.56299C6.0245 3.56299 5.93736 3.58041 5.85612 3.61426C5.77488 3.64811 5.70115 3.6977 5.63917 3.76019C5.51501 3.8851 5.44531 4.05406 5.44531 4.23019C5.44531 4.40631 5.51501 4.57528 5.63917 4.70019L8.93917 8.03352L5.63917 11.3335C5.51501 11.4584 5.44531 11.6274 5.44531 11.8035C5.44531 11.9796 5.51501 12.1486 5.63917 12.2735C5.70092 12.3365 5.77455 12.3866 5.8558 12.421C5.93705 12.4553 6.0243 12.4732 6.11251 12.4735C6.20071 12.4732 6.28797 12.4553 6.36922 12.421C6.45047 12.3866 6.5241 12.3365 6.58584 12.2735L10.3592 8.50685C10.4268 8.44443 10.4808 8.36866 10.5178 8.28432C10.5547 8.19999 10.5738 8.10892 10.5738 8.01685C10.5738 7.92479 10.5547 7.83372 10.5178 7.74938C10.4808 7.66505 10.4268 7.58928 10.3592 7.52685Z" , fill: "#A4BBDD", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 45}})
25548
+ , (index == thead.length - 1 && clickedRow) &&
25549
+ React$1.createElement('svg', { width: "16", height: "16", viewBox: "0 0 16 16" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 48}}
25550
+ , React$1.createElement('path', { d: "M10.3592 7.52685L6.58584 3.76019C6.52387 3.6977 6.45013 3.64811 6.36889 3.61426C6.28765 3.58041 6.20052 3.56299 6.11251 3.56299C6.0245 3.56299 5.93736 3.58041 5.85612 3.61426C5.77488 3.64811 5.70115 3.6977 5.63917 3.76019C5.51501 3.8851 5.44531 4.05406 5.44531 4.23019C5.44531 4.40631 5.51501 4.57528 5.63917 4.70019L8.93917 8.03352L5.63917 11.3335C5.51501 11.4584 5.44531 11.6274 5.44531 11.8035C5.44531 11.9796 5.51501 12.1486 5.63917 12.2735C5.70092 12.3365 5.77455 12.3866 5.8558 12.421C5.93705 12.4553 6.0243 12.4732 6.11251 12.4735C6.20071 12.4732 6.28797 12.4553 6.36922 12.421C6.45047 12.3866 6.5241 12.3365 6.58584 12.2735L10.3592 8.50685C10.4268 8.44443 10.4808 8.36866 10.5178 8.28432C10.5547 8.19999 10.5738 8.10892 10.5738 8.01685C10.5738 7.92479 10.5547 7.83372 10.5178 7.74938C10.4808 7.66505 10.4268 7.58928 10.3592 7.52685Z" , fill: "#A4BBDD", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 49}})
25546
25551
  )
25547
25552
 
25548
25553
  )
@@ -25552,8 +25557,8 @@ const TablePrimary = (props) => {
25552
25557
  )
25553
25558
  )
25554
25559
  )
25555
- , showPagination && tbody && itemsPerPage && itemsPerPage > 0 &&
25556
- React$1.createElement(Pagination, { itemsPerPage: itemsPerPage, items: tbody, paginatedItems: (arr)=>{setTbodyItems(arr);}, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 56}})
25560
+ , showPagination && itemsPerPage && itemsPerPage > 0 && tbodyOri &&
25561
+ React$1.createElement(Pagination, { itemsPerPage: itemsPerPage, items: tbodyOri, paginatedItems: (arr)=>{setTbodyItems(arr);}, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 60}})
25557
25562
 
25558
25563
  )
25559
25564
  )