slick-table 1.1.27 → 1.1.29

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 (13) hide show
  1. package/dist/index.cjs.js +81 -81
  2. package/dist/index.es.js +3616 -3606
  3. package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.d.ts.map +1 -1
  4. package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.style.d.ts +7 -0
  5. package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.style.d.ts.map +1 -0
  6. package/dist/types/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.d.ts.map +1 -1
  7. package/dist/types/shared/lib/slickgrid/ui/styles/index.d.ts +1 -0
  8. package/dist/types/shared/lib/slickgrid/ui/styles/index.d.ts.map +1 -1
  9. package/package.json +1 -1
  10. package/src/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.style.ts +120 -0
  11. package/src/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.tsx +8 -1
  12. package/src/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.ts +0 -106
  13. package/src/shared/lib/slickgrid/ui/styles/index.ts +1 -0
package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SlickgridTable.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAS3B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,KAAK,CA+CpC,CAAC"}
1
+ {"version":3,"file":"SlickgridTable.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAS3B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAIjC,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,KAAK,CAoDpC,CAAC"}
package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.style.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ declare const _default: {
2
+ Container: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<import('@mui/material').Theme> & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
3
+ ref?: ((instance: HTMLDivElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLDivElement> | null | undefined;
4
+ }, keyof import('@mui/system').BoxOwnProps<import('@mui/material').Theme>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
5
+ };
6
+ export default _default;
7
+ //# sourceMappingURL=SlickgridTable.style.d.ts.map
package/dist/types/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.style.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SlickgridTable.style.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.style.ts"],"names":[],"mappings":";;;;;AAuHA,wBAA6B"}
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":";;;;;AA4JA,wBAA2B"}
1
+ {"version":3,"file":"WithTableStyles.style.d.ts","sourceRoot":"","sources":["../../../../../../../../src/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.ts"],"names":[],"mappings":";;;;;AAkDA,wBAA2B"}
package/dist/types/shared/lib/slickgrid/ui/styles/index.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { WithTableStyles } from './WithTableStyles';
2
+ export { wink } from './keyframes';
2
3
  //# sourceMappingURL=index.d.ts.map
package/dist/types/shared/lib/slickgrid/ui/styles/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/shared/lib/slickgrid/ui/styles/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/shared/lib/slickgrid/ui/styles/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "slick-table",
3
- "version": "1.1.27",
3
+ "version": "1.1.29",
4
4
  "description": "Enhanced version of SlickGrid library",
5
5
  "private": false,
6
6
  "type": "module",
package/src/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.style.ts ADDED
@@ -0,0 +1,120 @@
1
+ import { Box, styled } from "@mui/material";
2
+
3
+ import { wink } from "../../styles";
4
+
5
+ const fontSize = "0.75rem";
6
+ const cellHeight = "24px";
7
+
8
+ const Container = styled(Box)({
9
+ "& .slick-header-column": {
10
+ "&.filter-active .slick-header-button::after": {
11
+ width: "7px",
12
+ height: "7px",
13
+ content: "''",
14
+ backgroundColor: "#2196f3",
15
+ position: "absolute",
16
+ borderRadius: "50%",
17
+ border: "2px solid #f8f8f8",
18
+ top: "3px",
19
+ right: "3px",
20
+ },
21
+ "&:not([data-id=_checkbox_selector]):not([data-id=isEdited])": {
22
+ "& .slick-column-name": {
23
+ textOverflow: "ellipsis",
24
+ whiteSpace: "nowrap",
25
+ overflow: "hidden",
26
+ maxWidth: "calc(100% - 16px)",
27
+ },
28
+ },
29
+ "&.slick-state-hover": {
30
+ "&.filter-active .slick-header-button::after": {
31
+ border: "2px solid #e8e8e8",
32
+ },
33
+ "& .slick-header-button": {
34
+ "&::before": {
35
+ backgroundColor: "#e8e8e8",
36
+ },
37
+ },
38
+ },
39
+ "& .slick-column-name": {
40
+ fontSize,
41
+ },
42
+ "& .slick-header-button": {
43
+ width: "19px",
44
+ height: "12px",
45
+ "&::before": {
46
+ position: "absolute",
47
+ content: "''",
48
+ width: "19px",
49
+ height: "12px",
50
+ top: "6px",
51
+ right: "5px",
52
+ backgroundImage:
53
+ "repeating-linear-gradient(0deg, #808080, #808080 2px, transparent 2px, transparent 4px)",
54
+ clipPath: "polygon(0% 0%, 100% 0%, 50% 110%)",
55
+ backgroundColor: "#f8f8f8",
56
+ },
57
+ },
58
+ },
59
+
60
+ "& .slick-viewport": {
61
+ "& .slick-cell": {
62
+ display: "flex",
63
+ fontSize,
64
+ "&.text-center": {
65
+ justifyContent: "center",
66
+ textAlign: "center",
67
+ },
68
+ "&.text-right": {
69
+ justifyContent: "end",
70
+ textAlign: "right",
71
+ },
72
+ "&.wink": {
73
+ animation: `${wink} infinite 0.5s linear`,
74
+ "& input": {
75
+ animation: `${wink} infinite 0.5s linear`,
76
+ },
77
+ },
78
+ "& input.editor-text": {
79
+ textAlign: "inherit",
80
+ },
81
+ "& #autocomplete": {
82
+ boxShadow: "0 0 5px 1px gray",
83
+ fontSize,
84
+ margin: 0,
85
+ maxHeight: "300px",
86
+ minWidth: "100%",
87
+ overflow: "auto",
88
+ padding: 0,
89
+ position: "absolute",
90
+ top: cellHeight,
91
+ "& div": {
92
+ "&:hover": {
93
+ cursor: "pointer",
94
+ },
95
+ "& strong": {
96
+ color: "#007bff",
97
+ },
98
+ },
99
+ },
100
+ },
101
+ },
102
+
103
+ "& .slick-footerrow": {
104
+ borderTop: "1px solid silver",
105
+ "& .slick-footerrow-column": {
106
+ height: "100%",
107
+ display: "flex",
108
+ justifyContent: "flex-end",
109
+ alignItems: "center",
110
+ paddingRight: "5px",
111
+ borderBottom: "none",
112
+ fontWeight: "bold",
113
+ "&:last-child": {
114
+ borderRight: "none",
115
+ },
116
+ },
117
+ },
118
+ });
119
+
120
+ export default { Container };
package/src/shared/lib/slickgrid/ui/SlickgridTable/ui/SlickgridTable.tsx CHANGED
@@ -9,6 +9,8 @@ import {
9
9
  import { onAddNewRow as addNewRow, useGrid } from "../lib";
10
10
  import { Props } from "../model";
11
11
 
12
+ import Styled from "./SlickgridTable.style";
13
+
12
14
  export const SlickgridTable: FC<Props> = ({
13
15
  SlickDataView,
14
16
  applyCellCssStyles,
@@ -55,5 +57,10 @@ export const SlickgridTable: FC<Props> = ({
55
57
  useUpdateTotal(table);
56
58
  useResizeCanvas(table);
57
59
 
58
- return <div id={table.id} className={"slick-container"}></div>;
60
+ return (
61
+ <Styled.Container
62
+ id={table.id}
63
+ className={"slick-container"}
64
+ ></Styled.Container>
65
+ );
59
66
  };
package/src/shared/lib/slickgrid/ui/styles/WithTableStyles/WithTableStyles.style.ts CHANGED
@@ -1,7 +1,5 @@
1
1
  import { Box, styled } from "@mui/material";
2
2
 
3
- import { wink } from "../keyframes";
4
-
5
3
  const Wrapper = styled(Box)(({ theme }) => ({
6
4
  "& .slick-container": {
7
5
  userSelect: "none",
@@ -11,55 +9,7 @@ const Wrapper = styled(Box)(({ theme }) => ({
11
9
  color: theme.palette.text.primary,
12
10
  borderColor: theme.palette.background.paper,
13
11
  fontFamily: "inherit",
14
- fontSize: "0.75rem",
15
12
 
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",
43
- },
44
- },
45
- },
46
- "& .slick-header-button": {
47
- width: "19px",
48
- height: "12px",
49
- "&::before": {
50
- position: "absolute",
51
- content: "''",
52
- width: "19px",
53
- height: "12px",
54
- top: "6px",
55
- right: "5px",
56
- backgroundImage:
57
- "repeating-linear-gradient(0deg, #808080, #808080 2px, transparent 2px, transparent 4px)",
58
- clipPath: "polygon(0% 0%, 100% 0%, 50% 110%)",
59
- backgroundColor: "#f8f8f8",
60
- },
61
- },
62
- },
63
13
  "& .slick-viewport": {
64
14
  backgroundColor: theme.palette.background.paper,
65
15
  "& .grid-canvas": {
@@ -67,68 +17,25 @@ const Wrapper = styled(Box)(({ theme }) => ({
67
17
  "&.even": {
68
18
  backgroundColor: theme.palette.background.default,
69
19
  },
70
- // "&.odd": {
71
- // backgroundColor: theme.palette.background.secondary,
72
- // },
73
- // "&:hover": {
74
- // backgroundColor: theme.palette.background.row_hover,
75
- // },
76
- // "&.active": {
77
- // backgroundColor: theme.palette.background.row_hover,
78
- // },
79
20
  "& .slick-cell": {
80
21
  "&.active": {
81
- // backgroundColor: theme.palette.background.row_hover,
82
22
  borderColor: "#007bff",
83
23
  "& input": {
84
- // backgroundColor: theme.palette.background.row_hover,
85
24
  color: theme.palette.text.primary,
86
25
  },
87
26
  },
88
27
  "&.selected": {
89
- // backgroundColor: theme.palette.background.cell_selected,
90
28
  color: theme.palette.text.primary,
91
29
  },
92
- "&.text-right": {
93
- textAlign: "right",
94
- },
95
30
  "&.bold": {
96
31
  fontWeight: "bold",
97
32
  },
98
- "&.wink": {
99
- animation: `${wink} infinite 0.5s linear`,
100
- "& input": {
101
- animation: `${wink} infinite 0.5s linear`,
102
- },
103
- },
104
- "& input.editor-text": {
105
- textAlign: "inherit",
106
- },
107
33
  "& select": {
108
34
  color: theme.palette.text.primary,
109
35
  backgroundColor: theme.palette.background.default,
110
36
  },
111
37
  "& #autocomplete": {
112
- margin: 0,
113
- padding: 0,
114
- maxHeight: "300px",
115
- width: "100%",
116
- overflow: "auto",
117
38
  backgroundColor: theme.palette.background.default,
118
- fontSize: "12px",
119
- boxShadow: "0 0 5px 1px gray",
120
- "& div": {
121
- "&:hover": {
122
- // backgroundColor: theme.palette.background.row_hover,
123
- cursor: "pointer",
124
- },
125
- "&.active": {
126
- // backgroundColor: theme.palette.background.row_hover,
127
- },
128
- "& strong": {
129
- color: "#007bff",
130
- },
131
- },
132
39
  },
133
40
  },
134
41
  },
@@ -137,19 +44,6 @@ const Wrapper = styled(Box)(({ theme }) => ({
137
44
 
138
45
  "& .slick-footerrow": {
139
46
  backgroundColor: theme.palette.background.default,
140
- borderTop: "1px solid silver",
141
- "& .slick-footerrow-column": {
142
- height: "100%",
143
- display: "flex",
144
- justifyContent: "flex-end",
145
- alignItems: "center",
146
- paddingRight: "5px",
147
- borderBottom: "none",
148
- fontWeight: "bold",
149
- "&:last-child": {
150
- borderRight: "none",
151
- },
152
- },
153
47
  },
154
48
  },
155
49
  }));
package/src/shared/lib/slickgrid/ui/styles/index.ts CHANGED
@@ -1 +1,2 @@
1
1
  export { WithTableStyles } from "./WithTableStyles";
2
+ export { wink } from "./keyframes";