@sis-cc/dotstatsuite-visions 6.6.2 → 6.6.3
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.
- package/es/TableHtml5/TableHtml5.js +2 -2
- package/es/TableHtml5/header.js +21 -8
- package/es/TableHtml5/section.js +11 -2
- package/es/TableHtml5/subHeader.js +11 -2
- package/lib/TableHtml5/TableHtml5.js +2 -2
- package/lib/TableHtml5/header.js +21 -7
- package/lib/TableHtml5/section.js +11 -2
- package/lib/TableHtml5/subHeader.js +11 -2
- package/package.json +1 -1
|
@@ -110,7 +110,6 @@ var TableHtml5 = function TableHtml5(_ref) {
|
|
|
110
110
|
var xLayoutDataLength = R.length(xLayoutData);
|
|
111
111
|
var valuesHeaderData = getEnhancedValuesHeaderData(headerData);
|
|
112
112
|
var nbColumnsByRows = R.map(R.length)(valuesHeaderData);
|
|
113
|
-
|
|
114
113
|
return React.createElement(
|
|
115
114
|
Table,
|
|
116
115
|
{ className: classes.table, 'aria-label': 'table', size: 'small', style: { padding: '0px 0px' } },
|
|
@@ -120,7 +119,8 @@ var TableHtml5 = function TableHtml5(_ref) {
|
|
|
120
119
|
React.createElement(Header, {
|
|
121
120
|
headerData: headerData,
|
|
122
121
|
valuesHeaderData: valuesHeaderData,
|
|
123
|
-
xLayoutDataLength: xLayoutDataLength
|
|
122
|
+
xLayoutDataLength: xLayoutDataLength,
|
|
123
|
+
subHeadCellsWidth: subHeadCellsWidth
|
|
124
124
|
}),
|
|
125
125
|
React.createElement(SubHeader, {
|
|
126
126
|
headerData: headerData,
|
package/es/TableHtml5/header.js
CHANGED
|
@@ -3,10 +3,11 @@ import * as R from 'ramda';
|
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import cx from 'classnames';
|
|
5
5
|
import Typography from '@material-ui/core/Typography';
|
|
6
|
-
import { makeStyles } from '@material-ui/core/styles';
|
|
6
|
+
import { makeStyles, useTheme } from '@material-ui/core/styles';
|
|
7
7
|
import TableCell from '@material-ui/core/TableCell';
|
|
8
8
|
import TableRow from '@material-ui/core/TableRow';
|
|
9
9
|
import Flags from './flags';
|
|
10
|
+
import { getIsRtl } from '../utils';
|
|
10
11
|
|
|
11
12
|
var useStyles = makeStyles(function (theme) {
|
|
12
13
|
return {
|
|
@@ -40,9 +41,7 @@ var useStyles = makeStyles(function (theme) {
|
|
|
40
41
|
paddingTop: 0
|
|
41
42
|
},
|
|
42
43
|
stickyLabel: {
|
|
43
|
-
position: 'sticky'
|
|
44
|
-
left: theme.spacing(1),
|
|
45
|
-
right: theme.spacing(1)
|
|
44
|
+
position: 'sticky'
|
|
46
45
|
}
|
|
47
46
|
};
|
|
48
47
|
});
|
|
@@ -53,9 +52,15 @@ var mapIndexed = R.addIndex(R.map);
|
|
|
53
52
|
var Header = function Header(_ref) {
|
|
54
53
|
var headerData = _ref.headerData,
|
|
55
54
|
valuesHeaderData = _ref.valuesHeaderData,
|
|
56
|
-
xLayoutDataLength = _ref.xLayoutDataLength
|
|
55
|
+
xLayoutDataLength = _ref.xLayoutDataLength,
|
|
56
|
+
subHeadCellsWidth = _ref.subHeadCellsWidth;
|
|
57
57
|
|
|
58
58
|
var classes = useStyles();
|
|
59
|
+
var theme = useTheme();
|
|
60
|
+
var isRtl = getIsRtl(theme);
|
|
61
|
+
|
|
62
|
+
var stickyLabelPosition = R.sum(subHeadCellsWidth) + 30 + theme.spacing(1);
|
|
63
|
+
|
|
59
64
|
if (R.compose(R.anyPass([R.isNil, R.isEmpty]), R.path([0, 'data']))(headerData)) return null;
|
|
60
65
|
return timesIndexed(function (index) {
|
|
61
66
|
var _cx;
|
|
@@ -75,7 +80,7 @@ var Header = function Header(_ref) {
|
|
|
75
80
|
colSpan: R.inc(xLayoutDataLength),
|
|
76
81
|
id: id,
|
|
77
82
|
tabIndex: 0,
|
|
78
|
-
style: { position: 'sticky', left: 0, zIndex: 1 }
|
|
83
|
+
style: { position: 'sticky', left: 0, right: 0, zIndex: 1 }
|
|
79
84
|
},
|
|
80
85
|
React.createElement(
|
|
81
86
|
'div',
|
|
@@ -108,7 +113,14 @@ var Header = function Header(_ref) {
|
|
|
108
113
|
{ className: classes.cellContentCenter },
|
|
109
114
|
React.createElement(
|
|
110
115
|
Typography,
|
|
111
|
-
{
|
|
116
|
+
{
|
|
117
|
+
className: classes.stickyLabel,
|
|
118
|
+
style: {
|
|
119
|
+
left: isRtl ? theme.spacing(1) : stickyLabelPosition,
|
|
120
|
+
right: isRtl ? stickyLabelPosition : theme.spacing(1)
|
|
121
|
+
},
|
|
122
|
+
variant: 'body1'
|
|
123
|
+
},
|
|
112
124
|
R.prop('label', headerItem),
|
|
113
125
|
React.createElement(Flags, { flags: flags, isHeader: true })
|
|
114
126
|
)
|
|
@@ -122,7 +134,8 @@ var Header = function Header(_ref) {
|
|
|
122
134
|
Header.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
123
135
|
headerData: PropTypes.array,
|
|
124
136
|
valuesHeaderData: PropTypes.array,
|
|
125
|
-
xLayoutDataLength: PropTypes.number
|
|
137
|
+
xLayoutDataLength: PropTypes.number,
|
|
138
|
+
subHeadCellsWidth: PropTypes.array
|
|
126
139
|
} : {};
|
|
127
140
|
|
|
128
141
|
export default Header;
|
package/es/TableHtml5/section.js
CHANGED
|
@@ -113,7 +113,12 @@ var Section = function Section(_ref) {
|
|
|
113
113
|
id: id,
|
|
114
114
|
headers: 'subHeader_' + index + ' ' + currentSection,
|
|
115
115
|
component: 'th',
|
|
116
|
-
style: {
|
|
116
|
+
style: {
|
|
117
|
+
position: 'sticky',
|
|
118
|
+
left: subHeadCellsWidth[index],
|
|
119
|
+
right: subHeadCellsWidth[index],
|
|
120
|
+
zIndex: 1
|
|
121
|
+
}
|
|
117
122
|
},
|
|
118
123
|
React.createElement(
|
|
119
124
|
'div',
|
|
@@ -136,7 +141,11 @@ var Section = function Section(_ref) {
|
|
|
136
141
|
TableCell,
|
|
137
142
|
{
|
|
138
143
|
className: cx(classes.fillerCell, (_cx2 = {}, _cx2[classes.highlight] = R.prop(rowId)(activeCellIds), _cx2)),
|
|
139
|
-
style: {
|
|
144
|
+
style: {
|
|
145
|
+
position: 'sticky',
|
|
146
|
+
left: R.last(subHeadCellsWidth),
|
|
147
|
+
right: R.last(subHeadCellsWidth)
|
|
148
|
+
}
|
|
140
149
|
},
|
|
141
150
|
React.createElement(
|
|
142
151
|
'div',
|
|
@@ -62,7 +62,12 @@ var SubHeader = React.forwardRef(function (_ref, refs) {
|
|
|
62
62
|
className: classes.columnsTitle,
|
|
63
63
|
key: index,
|
|
64
64
|
id: 'subHeader_' + index,
|
|
65
|
-
style: {
|
|
65
|
+
style: {
|
|
66
|
+
position: 'sticky',
|
|
67
|
+
left: subHeadCellsWidth[index],
|
|
68
|
+
right: subHeadCellsWidth[index],
|
|
69
|
+
zIndex: 1
|
|
70
|
+
},
|
|
66
71
|
ref: function ref(element) {
|
|
67
72
|
return refs.current[index] = element;
|
|
68
73
|
}
|
|
@@ -81,7 +86,11 @@ var SubHeader = React.forwardRef(function (_ref, refs) {
|
|
|
81
86
|
}, xLayoutData),
|
|
82
87
|
React.createElement(TableCell, {
|
|
83
88
|
className: classes.fillerCell,
|
|
84
|
-
style: {
|
|
89
|
+
style: {
|
|
90
|
+
position: 'sticky',
|
|
91
|
+
left: R.last(subHeadCellsWidth),
|
|
92
|
+
right: R.last(subHeadCellsWidth)
|
|
93
|
+
}
|
|
85
94
|
}),
|
|
86
95
|
mapIndexed(function (item, index) {
|
|
87
96
|
var _cx;
|
|
@@ -143,7 +143,6 @@ var TableHtml5 = function TableHtml5(_ref) {
|
|
|
143
143
|
var xLayoutDataLength = R.length(xLayoutData);
|
|
144
144
|
var valuesHeaderData = getEnhancedValuesHeaderData(headerData);
|
|
145
145
|
var nbColumnsByRows = R.map(R.length)(valuesHeaderData);
|
|
146
|
-
|
|
147
146
|
return _react2.default.createElement(
|
|
148
147
|
_Table2.default,
|
|
149
148
|
{ className: classes.table, 'aria-label': 'table', size: 'small', style: { padding: '0px 0px' } },
|
|
@@ -153,7 +152,8 @@ var TableHtml5 = function TableHtml5(_ref) {
|
|
|
153
152
|
_react2.default.createElement(_header2.default, {
|
|
154
153
|
headerData: headerData,
|
|
155
154
|
valuesHeaderData: valuesHeaderData,
|
|
156
|
-
xLayoutDataLength: xLayoutDataLength
|
|
155
|
+
xLayoutDataLength: xLayoutDataLength,
|
|
156
|
+
subHeadCellsWidth: subHeadCellsWidth
|
|
157
157
|
}),
|
|
158
158
|
_react2.default.createElement(_subHeader2.default, {
|
|
159
159
|
headerData: headerData,
|
package/lib/TableHtml5/header.js
CHANGED
|
@@ -36,6 +36,8 @@ var _flags = require('./flags');
|
|
|
36
36
|
|
|
37
37
|
var _flags2 = _interopRequireDefault(_flags);
|
|
38
38
|
|
|
39
|
+
var _utils = require('../utils');
|
|
40
|
+
|
|
39
41
|
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
|
|
40
42
|
|
|
41
43
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -72,9 +74,7 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
|
|
|
72
74
|
paddingTop: 0
|
|
73
75
|
},
|
|
74
76
|
stickyLabel: {
|
|
75
|
-
position: 'sticky'
|
|
76
|
-
left: theme.spacing(1),
|
|
77
|
-
right: theme.spacing(1)
|
|
77
|
+
position: 'sticky'
|
|
78
78
|
}
|
|
79
79
|
};
|
|
80
80
|
});
|
|
@@ -85,9 +85,15 @@ var mapIndexed = R.addIndex(R.map);
|
|
|
85
85
|
var Header = function Header(_ref) {
|
|
86
86
|
var headerData = _ref.headerData,
|
|
87
87
|
valuesHeaderData = _ref.valuesHeaderData,
|
|
88
|
-
xLayoutDataLength = _ref.xLayoutDataLength
|
|
88
|
+
xLayoutDataLength = _ref.xLayoutDataLength,
|
|
89
|
+
subHeadCellsWidth = _ref.subHeadCellsWidth;
|
|
89
90
|
|
|
90
91
|
var classes = useStyles();
|
|
92
|
+
var theme = (0, _styles.useTheme)();
|
|
93
|
+
var isRtl = (0, _utils.getIsRtl)(theme);
|
|
94
|
+
|
|
95
|
+
var stickyLabelPosition = R.sum(subHeadCellsWidth) + 30 + theme.spacing(1);
|
|
96
|
+
|
|
91
97
|
if (R.compose(R.anyPass([R.isNil, R.isEmpty]), R.path([0, 'data']))(headerData)) return null;
|
|
92
98
|
return timesIndexed(function (index) {
|
|
93
99
|
var _cx;
|
|
@@ -107,7 +113,7 @@ var Header = function Header(_ref) {
|
|
|
107
113
|
colSpan: R.inc(xLayoutDataLength),
|
|
108
114
|
id: id,
|
|
109
115
|
tabIndex: 0,
|
|
110
|
-
style: { position: 'sticky', left: 0, zIndex: 1 }
|
|
116
|
+
style: { position: 'sticky', left: 0, right: 0, zIndex: 1 }
|
|
111
117
|
},
|
|
112
118
|
_react2.default.createElement(
|
|
113
119
|
'div',
|
|
@@ -140,7 +146,14 @@ var Header = function Header(_ref) {
|
|
|
140
146
|
{ className: classes.cellContentCenter },
|
|
141
147
|
_react2.default.createElement(
|
|
142
148
|
_Typography2.default,
|
|
143
|
-
{
|
|
149
|
+
{
|
|
150
|
+
className: classes.stickyLabel,
|
|
151
|
+
style: {
|
|
152
|
+
left: isRtl ? theme.spacing(1) : stickyLabelPosition,
|
|
153
|
+
right: isRtl ? stickyLabelPosition : theme.spacing(1)
|
|
154
|
+
},
|
|
155
|
+
variant: 'body1'
|
|
156
|
+
},
|
|
144
157
|
R.prop('label', headerItem),
|
|
145
158
|
_react2.default.createElement(_flags2.default, { flags: flags, isHeader: true })
|
|
146
159
|
)
|
|
@@ -154,7 +167,8 @@ var Header = function Header(_ref) {
|
|
|
154
167
|
Header.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
155
168
|
headerData: _propTypes2.default.array,
|
|
156
169
|
valuesHeaderData: _propTypes2.default.array,
|
|
157
|
-
xLayoutDataLength: _propTypes2.default.number
|
|
170
|
+
xLayoutDataLength: _propTypes2.default.number,
|
|
171
|
+
subHeadCellsWidth: _propTypes2.default.array
|
|
158
172
|
} : {};
|
|
159
173
|
|
|
160
174
|
exports.default = Header;
|
|
@@ -155,7 +155,12 @@ var Section = function Section(_ref) {
|
|
|
155
155
|
id: id,
|
|
156
156
|
headers: 'subHeader_' + index + ' ' + currentSection,
|
|
157
157
|
component: 'th',
|
|
158
|
-
style: {
|
|
158
|
+
style: {
|
|
159
|
+
position: 'sticky',
|
|
160
|
+
left: subHeadCellsWidth[index],
|
|
161
|
+
right: subHeadCellsWidth[index],
|
|
162
|
+
zIndex: 1
|
|
163
|
+
}
|
|
159
164
|
},
|
|
160
165
|
_react2.default.createElement(
|
|
161
166
|
'div',
|
|
@@ -178,7 +183,11 @@ var Section = function Section(_ref) {
|
|
|
178
183
|
_TableCell2.default,
|
|
179
184
|
{
|
|
180
185
|
className: (0, _classnames2.default)(classes.fillerCell, (_cx2 = {}, _cx2[classes.highlight] = R.prop(rowId)(activeCellIds), _cx2)),
|
|
181
|
-
style: {
|
|
186
|
+
style: {
|
|
187
|
+
position: 'sticky',
|
|
188
|
+
left: R.last(subHeadCellsWidth),
|
|
189
|
+
right: R.last(subHeadCellsWidth)
|
|
190
|
+
}
|
|
182
191
|
},
|
|
183
192
|
_react2.default.createElement(
|
|
184
193
|
'div',
|
|
@@ -95,7 +95,12 @@ var SubHeader = _react2.default.forwardRef(function (_ref, refs) {
|
|
|
95
95
|
className: classes.columnsTitle,
|
|
96
96
|
key: index,
|
|
97
97
|
id: 'subHeader_' + index,
|
|
98
|
-
style: {
|
|
98
|
+
style: {
|
|
99
|
+
position: 'sticky',
|
|
100
|
+
left: subHeadCellsWidth[index],
|
|
101
|
+
right: subHeadCellsWidth[index],
|
|
102
|
+
zIndex: 1
|
|
103
|
+
},
|
|
99
104
|
ref: function ref(element) {
|
|
100
105
|
return refs.current[index] = element;
|
|
101
106
|
}
|
|
@@ -114,7 +119,11 @@ var SubHeader = _react2.default.forwardRef(function (_ref, refs) {
|
|
|
114
119
|
}, xLayoutData),
|
|
115
120
|
_react2.default.createElement(_TableCell2.default, {
|
|
116
121
|
className: classes.fillerCell,
|
|
117
|
-
style: {
|
|
122
|
+
style: {
|
|
123
|
+
position: 'sticky',
|
|
124
|
+
left: R.last(subHeadCellsWidth),
|
|
125
|
+
right: R.last(subHeadCellsWidth)
|
|
126
|
+
}
|
|
118
127
|
}),
|
|
119
128
|
mapIndexed(function (item, index) {
|
|
120
129
|
var _cx;
|