slick-table 1.1.62 → 1.1.64

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 (9) hide show
  1. package/dist/index.cjs.js +56 -56
  2. package/dist/index.es.js +1088 -1103
  3. package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/Table/Table.style.d.ts.map +1 -1
  4. package/dist/types/shared/lib/slickgrid/ui/columns/columnCheckboxSelector/columnCheckboxSelector.d.ts.map +1 -1
  5. package/dist/types/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.d.ts.map +1 -1
  6. package/package.json +1 -1
  7. package/src/shared/lib/slickgrid/ui/SlickgridTable/ui/Table/Table.style.ts +121 -101
  8. package/src/shared/lib/slickgrid/ui/columns/columnCheckboxSelector/columnCheckboxSelector.ts +1 -0
  9. package/src/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.ts +1 -39
package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/Table/Table.style.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Table.style.d.ts","sourceRoot":"","sources":["../../../../../../../../../src/shared/lib/slickgrid/ui/SlickgridTable/ui/Table/Table.style.ts"],"names":[],"mappings":";;;;;AAoIA,wBAA6B"}
1
+ {"version":3,"file":"Table.style.d.ts","sourceRoot":"","sources":["../../../../../../../../../src/shared/lib/slickgrid/ui/SlickgridTable/ui/Table/Table.style.ts"],"names":[],"mappings":";;;;;AAwJA,wBAA6B"}
package/dist/types/shared/lib/slickgrid/ui/columns/columnCheckboxSelector/columnCheckboxSelector.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"columnCheckboxSelector.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/columns/columnCheckboxSelector/columnCheckboxSelector.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAE7C,eAAO,MAAM,sBAAsB,EAAE,OAGpC,CAAC"}
1
+ {"version":3,"file":"columnCheckboxSelector.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/columns/columnCheckboxSelector/columnCheckboxSelector.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAE7C,eAAO,MAAM,sBAAsB,EAAE,OAIpC,CAAC"}
package/dist/types/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"WithTableStyles.style.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.ts"],"names":[],"mappings":";;;;;AA0CA,wBAA2B"}
1
+ {"version":3,"file":"WithTableStyles.style.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.ts"],"names":[],"mappings":";;;;;AAIA,wBAA2B"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "slick-table",
3
- "version": "1.1.62",
3
+ "version": "1.1.64",
4
4
  "description": "Enhanced version of SlickGrid library",
5
5
  "private": false,
6
6
  "type": "module",
package/src/shared/lib/slickgrid/ui/SlickgridTable/ui/Table/Table.style.ts CHANGED
@@ -13,118 +13,138 @@ const Container = styled(Box)({
13
13
  maxWidth: "100%",
14
14
  userSelect: "none",
15
15
 
16
- "& .slick-header-column": {
17
- "&.filter-active .slick-header-button::after": {
18
- width: "7px",
19
- height: "7px",
20
- content: "''",
21
- backgroundColor: "#2196f3",
22
- position: "absolute",
23
- borderRadius: "50%",
24
- border: "2px solid #f8f8f8",
25
- top: "3px",
26
- right: "3px",
27
- },
28
- "&:not([data-id=_checkbox_selector]):not([data-id=isEdited])": {
29
- "& .slick-column-name": {
30
- textOverflow: "ellipsis",
31
- whiteSpace: "nowrap",
32
- overflow: "hidden",
33
- maxWidth: "calc(100% - 16px)",
34
- },
35
- },
36
- "&.slick-state-hover": {
37
- "&.filter-active .slick-header-button::after": {
38
- border: "2px solid #e8e8e8",
39
- },
40
- "& .slick-header-button": {
41
- "&::before": {
42
- backgroundColor: "#e8e8e8",
16
+ "&.slick-container": {
17
+ "& .slick-header": {
18
+ borderTopColor: "transparent",
19
+ "& .slick-header-column": {
20
+ "&:last-child": {
21
+ borderRightColor: "transparent",
22
+ },
23
+ "&.filter-active .slick-header-button::after": {
24
+ width: "7px",
25
+ height: "7px",
26
+ content: "''",
27
+ backgroundColor: "#2196f3",
28
+ position: "absolute",
29
+ borderRadius: "50%",
30
+ border: "2px solid #f8f8f8",
31
+ top: "3px",
32
+ right: "3px",
33
+ },
34
+ "&:not([data-id=_checkbox_selector]):not([data-id=isEdited])": {
35
+ "& .slick-column-name": {
36
+ textOverflow: "ellipsis",
37
+ whiteSpace: "nowrap",
38
+ overflow: "hidden",
39
+ maxWidth: "calc(100% - 16px)",
40
+ },
41
+ },
42
+ "&.slick-state-hover": {
43
+ "&.filter-active .slick-header-button::after": {
44
+ border: "2px solid #e8e8e8",
45
+ },
46
+ "& .slick-header-button": {
47
+ "&::before": {
48
+ backgroundColor: "#e8e8e8",
49
+ },
50
+ },
51
+ },
52
+ "& .slick-column-name": {
53
+ fontSize,
54
+ },
55
+ "& .slick-header-button": {
56
+ width: "19px",
57
+ height: "12px",
58
+ "&::before": {
59
+ position: "absolute",
60
+ content: "''",
61
+ width: "19px",
62
+ height: "12px",
63
+ top: "6px",
64
+ right: "5px",
65
+ backgroundImage:
66
+ "repeating-linear-gradient(0deg, #808080, #808080 2px, transparent 2px, transparent 4px)",
67
+ clipPath: "polygon(0% 0%, 100% 0%, 50% 110%)",
68
+ backgroundColor: "transparent",
69
+ },
70
+ },
71
+ "& .slick-resizable-handle": {
72
+ boxShadow: "none",
43
73
  },
44
74
  },
45
75
  },
46
- "& .slick-column-name": {
47
- fontSize,
48
- },
49
- "& .slick-header-button": {
50
- width: "19px",
51
- height: "12px",
52
- "&::before": {
53
- position: "absolute",
54
- content: "''",
55
- width: "19px",
56
- height: "12px",
57
- top: "6px",
58
- right: "5px",
59
- backgroundImage:
60
- "repeating-linear-gradient(0deg, #808080, #808080 2px, transparent 2px, transparent 4px)",
61
- clipPath: "polygon(0% 0%, 100% 0%, 50% 110%)",
62
- backgroundColor: "#f8f8f8",
63
- },
64
- },
65
- },
66
76
 
67
- "& .slick-viewport": {
68
- // Prevent displaying vertical scroll bar. Override this style when table exceeds available width
69
- overflowX: "hidden !important",
70
- backgroundColor: "transparent",
71
- "& .slick-cell": {
72
- display: "flex",
73
- fontSize,
74
- "&.text-center": {
75
- justifyContent: "center",
76
- textAlign: "center",
77
- },
78
- "&.text-right": {
79
- justifyContent: "end",
80
- textAlign: "right",
81
- },
82
- "&.bold": {
83
- fontWeight: "bold",
84
- },
85
- "&.wink": {
86
- animation: `${wink} infinite 0.5s linear`,
87
- "& input": {
88
- animation: `${wink} infinite 0.5s linear`,
89
- },
90
- },
91
- "& input.editor-text": {
92
- textAlign: "inherit",
93
- },
94
- "& #autocomplete": {
95
- boxShadow: "0 0 5px 1px gray",
77
+ "& .slick-viewport": {
78
+ // Prevent displaying vertical scroll bar. Override this style when table exceeds available width
79
+ overflowX: "hidden !important",
80
+ scrollbarWidth: "thin",
81
+ "& .slick-cell": {
82
+ borderTop: "none",
83
+ borderRightStyle: "solid",
84
+ borderLeft: "none",
85
+ borderWidth: "1px",
86
+ display: "flex",
96
87
  fontSize,
97
- margin: 0,
98
- maxHeight: "300px",
99
- minWidth: "100%",
100
- overflow: "auto",
101
- padding: 0,
102
- position: "absolute",
103
- top: cellHeight,
104
- "& div": {
105
- "&:hover": {
106
- cursor: "pointer",
88
+ "&:last-child": {
89
+ borderRight: "none",
90
+ },
91
+ "&.text-center": {
92
+ justifyContent: "center",
93
+ textAlign: "center",
94
+ },
95
+ "&.text-right": {
96
+ justifyContent: "end",
97
+ textAlign: "right",
98
+ },
99
+ "&.bold": {
100
+ fontWeight: "bold",
101
+ },
102
+ "&.wink": {
103
+ animation: `${wink} infinite 0.5s linear`,
104
+ "& input": {
105
+ animation: `${wink} infinite 0.5s linear`,
107
106
  },
108
- "& strong": {
109
- color: "#007bff",
107
+ },
108
+ "& input.editor-text": {
109
+ textAlign: "inherit",
110
+ },
111
+ "& #autocomplete": {
112
+ boxShadow: "0 0 5px 1px gray",
113
+ fontSize,
114
+ margin: 0,
115
+ maxHeight: "300px",
116
+ minWidth: "100%",
117
+ overflow: "auto",
118
+ padding: 0,
119
+ position: "absolute",
120
+ top: cellHeight,
121
+ "& div": {
122
+ fontSize,
123
+ "&:hover": {
124
+ cursor: "pointer",
125
+ },
126
+ "& strong": {
127
+ color: "#007bff",
128
+ },
110
129
  },
111
130
  },
112
131
  },
113
132
  },
114
- },
115
133
 
116
- "& .slick-footerrow": {
117
- borderTop: "1px solid silver",
118
- "& .slick-footerrow-column": {
119
- height: "100%",
120
- display: "flex",
121
- justifyContent: "flex-end",
122
- alignItems: "center",
123
- paddingRight: "5px",
124
- borderBottom: "none",
125
- fontWeight: "bold",
126
- "&:last-child": {
127
- borderRight: "none",
134
+ "& .slick-footerrow": {
135
+ borderTop: "1px solid silver",
136
+ "& .slick-footerrow-column": {
137
+ height: "100%",
138
+ display: "flex",
139
+ justifyContent: "flex-end",
140
+ alignItems: "center",
141
+ fontSize,
142
+ paddingRight: "5px",
143
+ borderBottom: "none",
144
+ fontWeight: "bold",
145
+ "&:last-child": {
146
+ borderRight: "none",
147
+ },
128
148
  },
129
149
  },
130
150
  },
package/src/shared/lib/slickgrid/ui/columns/columnCheckboxSelector/columnCheckboxSelector.ts CHANGED
@@ -2,6 +2,7 @@ import { CHECKBOX_SELECTOR } from "shared/model/consts";
2
2
  import { IColumn } from "shared/model/types";
3
3
 
4
4
  export const columnCheckboxSelector: IColumn = {
5
+ cssClass: "text-center",
5
6
  id: CHECKBOX_SELECTOR,
6
7
  field: CHECKBOX_SELECTOR,
7
8
  };
package/src/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.ts CHANGED
@@ -1,43 +1,5 @@
1
1
  import { Box, styled } from "@mui/material";
2
2
 
3
- const Wrapper = styled(Box)(({ theme }) => ({
4
- "& .slick-container": {
5
- color: theme.palette.text.primary,
6
- borderColor: theme.palette.background.paper,
7
-
8
- "& .slick-viewport": {
9
- backgroundColor: theme.palette.background.paper,
10
- "& .grid-canvas": {
11
- "& .ui-widget-content.slick-row": {
12
- "&.even": {
13
- backgroundColor: theme.palette.background.default,
14
- },
15
- "& .slick-cell": {
16
- "&.active": {
17
- borderColor: "#007bff",
18
- "& input": {
19
- color: theme.palette.text.primary,
20
- },
21
- },
22
- "&.selected": {
23
- color: theme.palette.text.primary,
24
- },
25
- "& select": {
26
- color: theme.palette.text.primary,
27
- backgroundColor: theme.palette.background.default,
28
- },
29
- "& #autocomplete": {
30
- backgroundColor: theme.palette.background.default,
31
- },
32
- },
33
- },
34
- },
35
- },
36
-
37
- "& .slick-footerrow": {
38
- backgroundColor: theme.palette.background.default,
39
- },
40
- },
41
- }));
3
+ const Wrapper = styled(Box)(() => ({}));
42
4
 
43
5
  export default { Wrapper };