@sphereon/ui-components.ssi-react 0.1.3-unstable.131 → 0.1.3-unstable.133

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 (4) hide show
  1. package/dist/components/views/SSITableView/index.d.ts +1 -1
  2. package/dist/components/views/SSITableView/index.js +2 -2
  3. package/dist/styles/components/components/Pagination/index.js +39 -34
  4. package/package.json +3 -3
package/dist/components/views/SSITableView/index.d.ts CHANGED
@@ -13,7 +13,7 @@ type Props<T> = {
13
13
  enableResultCount?: boolean;
14
14
  columnResizeMode?: ColumnResizeMode;
15
15
  actions?: Array<Button>;
16
- paginationControlsProps?: PaginationControlsProps;
16
+ pagination?: PaginationControlsProps;
17
17
  };
18
18
  declare const SSITableView: <T extends {}>(props: Props<T>) => ReactElement;
19
19
  export default SSITableView;
package/dist/components/views/SSITableView/index.js CHANGED
@@ -55,7 +55,7 @@ const toRowSelectionObject = (rows) => {
55
55
  return rowSelectionObject;
56
56
  };
57
57
  const SSITableView = (props) => {
58
- const { columns, data, enableRowSelection = false, enableFiltering = false, enableMostRecent = false, enableResultCount = false, columnResizeMode = 'onChange', actions = [], onRowClick, onDelete, paginationControlsProps, } = props;
58
+ const { columns, data, enableRowSelection = false, enableFiltering = false, enableMostRecent = false, enableResultCount = false, columnResizeMode = 'onChange', actions = [], onRowClick, onDelete, pagination, } = props;
59
59
  const [rowSelection, setRowSelection] = React.useState([]);
60
60
  const [focusedRowId, setFocusedRowId] = React.useState();
61
61
  const columnHelper = createColumnHelper();
@@ -134,6 +134,6 @@ const SSITableView = (props) => {
134
134
  ...(cell.column.columnDef.minSize && { minWidth: cell.column.columnDef.minSize }),
135
135
  ...(cell.column.columnDef.maxSize && { maxWidth: cell.column.columnDef.maxSize }),
136
136
  ...(cell.column.columnDef.size !== 0 && { width: cell.column.columnDef.size }),
137
- }, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id))) })] })] }), paginationControlsProps && _jsx(PaginationControls, { ...paginationControlsProps })] }));
137
+ }, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id))) })] })] }), pagination && _jsx(PaginationControls, { ...pagination })] }));
138
138
  };
139
139
  export default SSITableView;
package/dist/styles/components/components/Pagination/index.js CHANGED
@@ -1,24 +1,26 @@
1
1
  import { styled } from '@mui/material/styles';
2
2
  import { Pagination, paginationItemClasses } from '@mui/material';
3
+ import { backgroundColors, borderColors, elementColors, fontColors } from '@sphereon/ui-components.core';
3
4
  export const PaginationContainerStyled = styled('div') `
4
5
  display: flex;
5
6
  justify-content: center;
6
7
  align-items: center;
7
8
  gap: 32px;
9
+ margin-top: 16px;
8
10
  `;
9
11
  export const GoToInputStyled = styled('input') `
10
12
  height: 28px;
11
13
  width: 44px;
12
- background-color: #fbfbfb;
14
+ background-color: ${backgroundColors.primaryLight};
13
15
  outline: none;
14
- color: #303030;
16
+ color: ${fontColors.dark};
15
17
  font-weight: 500;
16
18
  font-size: 14px;
17
19
  border-radius: 6px;
18
- border: 1px #c4c5ca solid;
20
+ border: 1px ${borderColors.lightGrey} solid;
19
21
  text-align: center;
20
22
  &:focus {
21
- border: 1px #7276f7 solid;
23
+ border: 1px ${elementColors.purple} solid;
22
24
  }
23
25
  `;
24
26
  export const GoToInputContainer = styled('div') `
@@ -29,38 +31,41 @@ export const GoToInputContainer = styled('div') `
29
31
  font-size: 14px;
30
32
  `;
31
33
  export const PaginationStyled = styled(Pagination) `
32
- & .${paginationItemClasses.root} {
33
- color: #303030;
34
- background-color: #FBFBFB;
35
- border: 1px #C4C5CA solid;
36
- border-radius: 6px;
37
- font-size: 14px;
38
- min-width: 32px;
39
- min-height: 32px;
40
- width: 32px;
41
- height: 32px;
42
- &:hover {
43
- background-color: #FBFBFB;
44
- },
45
- }
46
-
47
- & .${paginationItemClasses.selected} {
48
- border: 1px #7276F7 solid;
49
- color: #7276F7;
34
+ & .${paginationItemClasses.root} {
35
+ color: ${fontColors.dark};
36
+ background-color: ${backgroundColors.primaryLight};
37
+ border: 1px ${borderColors.lightGrey} solid;
38
+ border-radius: 6px;
39
+ font-size: 14px;
40
+ min-width: 32px;
41
+ min-height: 32px;
42
+ width: 32px;
43
+ height: 32px;
44
+ &:hover {
45
+ background-color: ${backgroundColors.primaryLight};
50
46
  },
47
+ }
51
48
 
52
- & .${paginationItemClasses.previousNext} {
53
- color: #C4C5CA;
54
- },
49
+ & .${paginationItemClasses.selected} {
50
+ background-color: transparent !important;
51
+ border: 1px ${elementColors.purple} solid;
52
+ color: ${elementColors.purple};
53
+ },
55
54
 
56
- & .${paginationItemClasses.disabled} {
57
- color: #C4C5CA;
58
- background-color: #8D9099;
59
- },
55
+ & .${paginationItemClasses.previousNext} {
56
+ color: ${borderColors.lightGrey};
57
+ },
58
+
59
+ & .${paginationItemClasses.disabled} {
60
+ color: ${borderColors.lightGrey};
61
+ background-color: ${backgroundColors.lightGrey};
62
+ },
60
63
 
61
- & .${paginationItemClasses.ellipsis} {
62
- user-select: none;
63
- display: flex;
64
- align-items: end;
65
- }
64
+ & .${paginationItemClasses.ellipsis} {
65
+ font-size: 20px;
66
+ user-select: none;
67
+ display: flex;
68
+ align-items: center;
69
+ justify-content: center;
70
+ }
66
71
  `;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@sphereon/ui-components.ssi-react",
3
3
  "private": false,
4
- "version": "0.1.3-unstable.131+799ab6f",
4
+ "version": "0.1.3-unstable.133+8fe5e89",
5
5
  "description": "SSI UI components for React",
6
6
  "repository": "git@github.com:Sphereon-Opensource/UI-Components.git",
7
7
  "author": "Sphereon <dev@sphereon.com>",
@@ -31,7 +31,7 @@
31
31
  "@mui/icons-material": "^5.15.9",
32
32
  "@mui/material": "^5.15.9",
33
33
  "@mui/styled-engine-sc": "6.0.0-alpha.16",
34
- "@sphereon/ui-components.core": "0.1.3-unstable.131+799ab6f",
34
+ "@sphereon/ui-components.core": "0.1.3-unstable.133+8fe5e89",
35
35
  "@tanstack/react-table": "^8.9.3",
36
36
  "react-loader-spinner": "^5.4.5",
37
37
  "react-toastify": "^9.1.3",
@@ -45,5 +45,5 @@
45
45
  "peerDependencies": {
46
46
  "react": ">= 16.8.0"
47
47
  },
48
- "gitHead": "799ab6f513e53d1ddff33319a0e43e82489d83a3"
48
+ "gitHead": "8fe5e897fd589d3c8c417d754c37e11397847604"
49
49
  }