@sis-cc/dotstatsuite-visions 6.6.4 → 7.1.0
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/AuthDialog/index.js +3 -2
- package/es/CollapsibleTree/Collapse.js +97 -0
- package/es/CollapsibleTree/CollapsibleTree.js +171 -0
- package/es/CollapsibleTree/index.js +44 -0
- package/es/DataEdit/Input.js +1 -1
- package/es/DataHeader/DataHeader.js +31 -7
- package/es/InfoIcon/InfoIcon.js +37 -0
- package/es/TableHtml5/TableHtml5.js +20 -3
- package/es/TableHtml5/cell.js +8 -2
- package/es/TableHtml5/flags.js +2 -0
- package/es/TableHtml5/index.js +1 -0
- package/es/TableHtml5/section.js +15 -2
- package/es/TableHtml5/sectionHeader.js +13 -6
- package/es/TableHtml5/sideIcon.js +26 -0
- package/es/TableHtml5/subHeader.js +11 -1
- package/es/index.js +1 -1
- package/es/theme.js +13 -0
- package/lib/AuthDialog/index.js +6 -5
- package/lib/CollapsibleTree/Collapse.js +126 -0
- package/lib/CollapsibleTree/CollapsibleTree.js +216 -0
- package/lib/{Table → CollapsibleTree}/index.js +2 -2
- package/lib/DataEdit/Input.js +1 -1
- package/lib/DataHeader/DataHeader.js +34 -7
- package/lib/InfoIcon/InfoIcon.js +56 -0
- package/lib/TableHtml5/TableHtml5.js +20 -3
- package/lib/TableHtml5/cell.js +11 -2
- package/lib/TableHtml5/flags.js +2 -0
- package/lib/TableHtml5/section.js +17 -1
- package/lib/TableHtml5/sectionHeader.js +16 -6
- package/lib/TableHtml5/sideIcon.js +46 -0
- package/lib/TableHtml5/subHeader.js +14 -1
- package/lib/index.js +10 -10
- package/lib/theme.js +13 -0
- package/package.json +6 -7
- package/es/Table/Table.js +0 -170
- package/es/Table/header.js +0 -91
- package/es/Table/index.js +0 -56
- package/es/Table/itemCell.js +0 -54
- package/es/Table/row-header.js +0 -84
- package/es/Table/section-header.js +0 -115
- package/es/Table/section-rows.js +0 -101
- package/es/Table/styles.js +0 -52
- package/es/Table/tableCell.js +0 -29
- package/es/Table/tooltip.js +0 -85
- package/es/Table/useStyles.js +0 -34
- package/es/Table/valueCell.js +0 -63
- package/lib/Table/Table.js +0 -203
- package/lib/Table/header.js +0 -116
- package/lib/Table/itemCell.js +0 -74
- package/lib/Table/row-header.js +0 -113
- package/lib/Table/section-header.js +0 -145
- package/lib/Table/section-rows.js +0 -134
- package/lib/Table/styles.js +0 -69
- package/lib/Table/tableCell.js +0 -50
- package/lib/Table/tooltip.js +0 -104
- package/lib/Table/useStyles.js +0 -41
- package/lib/Table/valueCell.js +0 -86
package/es/Table/itemCell.js
DELETED
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
import * as R from 'ramda';
|
|
4
|
-
import ItemTooltip from './tooltip';
|
|
5
|
-
|
|
6
|
-
var ItemCell = function ItemCell(_ref) {
|
|
7
|
-
var label = _ref.label,
|
|
8
|
-
parents = _ref.parents,
|
|
9
|
-
flags = _ref.flags,
|
|
10
|
-
justifyContent = _ref.justifyContent,
|
|
11
|
-
alignItems = _ref.alignItems,
|
|
12
|
-
fontWeight = _ref.fontWeight,
|
|
13
|
-
fontStyle = _ref.fontStyle,
|
|
14
|
-
_ref$sticky = _ref.sticky,
|
|
15
|
-
sticky = _ref$sticky === undefined ? false : _ref$sticky;
|
|
16
|
-
|
|
17
|
-
var style = {
|
|
18
|
-
display: 'flex',
|
|
19
|
-
flexDirection: 'row',
|
|
20
|
-
justifyContent: R.defaultTo('space-between', justifyContent),
|
|
21
|
-
alignItems: R.defaultTo('center', alignItems),
|
|
22
|
-
textAlign: R.equals('center', justifyContent) ? 'center' : 'inherit',
|
|
23
|
-
fontWeight: R.defaultTo('inherit', fontWeight),
|
|
24
|
-
fontStyle: R.defaultTo('inherit', fontStyle),
|
|
25
|
-
paddingTop: R.anyPass([R.isNil, R.isEmpty])(flags) ? 4 : 0,
|
|
26
|
-
paddingBottom: 4,
|
|
27
|
-
paddingLeft: R.pipe(R.when(R.isNil, R.always([])), R.length, R.multiply(12))(parents),
|
|
28
|
-
height: '100%'
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
return React.createElement(
|
|
32
|
-
'div',
|
|
33
|
-
{ style: style },
|
|
34
|
-
React.createElement(
|
|
35
|
-
'div',
|
|
36
|
-
{ style: sticky ? { display: 'inline-block', position: 'sticky', left: 8, right: 8 } : {} },
|
|
37
|
-
label,
|
|
38
|
-
React.createElement(ItemTooltip, { flags: flags })
|
|
39
|
-
)
|
|
40
|
-
);
|
|
41
|
-
};
|
|
42
|
-
|
|
43
|
-
ItemCell.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
44
|
-
label: PropTypes.string,
|
|
45
|
-
flags: PropTypes.array,
|
|
46
|
-
parents: PropTypes.array,
|
|
47
|
-
justifyContent: PropTypes.string,
|
|
48
|
-
fontWeight: PropTypes.string,
|
|
49
|
-
fontStyle: PropTypes.string,
|
|
50
|
-
alignItems: PropTypes.string,
|
|
51
|
-
sticky: PropTypes.bool
|
|
52
|
-
} : {};
|
|
53
|
-
|
|
54
|
-
export default React.memo(ItemCell);
|
package/es/Table/row-header.js
DELETED
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
|
2
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import PropTypes from 'prop-types';
|
|
5
|
-
import cx from 'classnames';
|
|
6
|
-
import * as R from 'ramda';
|
|
7
|
-
import { makeStyles } from '@material-ui/core/styles';
|
|
8
|
-
import sizeMe from 'react-sizeme';
|
|
9
|
-
import { Cell } from './styles';
|
|
10
|
-
import ItemCell from './itemCell';
|
|
11
|
-
import { getLight } from '../utils';
|
|
12
|
-
|
|
13
|
-
var useStyles = makeStyles(function (theme) {
|
|
14
|
-
return {
|
|
15
|
-
root: {
|
|
16
|
-
color: theme.palette.grey['A700'],
|
|
17
|
-
backgroundColor: getLight(theme) || theme.palette.secondary.light
|
|
18
|
-
},
|
|
19
|
-
sep: {
|
|
20
|
-
backgroundColor: theme.palette.grey[200]
|
|
21
|
-
},
|
|
22
|
-
highlight: theme.mixins.table.cellHighlight
|
|
23
|
-
};
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
var XVector = sizeMe({ noPlaceholder: true, monitorHeight: true, monitorWidth: false })(Cell);
|
|
27
|
-
|
|
28
|
-
var RowHeader = function RowHeader(_ref) {
|
|
29
|
-
var data = _ref.data,
|
|
30
|
-
headerData = _ref.headerData,
|
|
31
|
-
onYVectorSize = _ref.onYVectorSize,
|
|
32
|
-
getYOffset = _ref.getYOffset,
|
|
33
|
-
yOffset = _ref.yOffset,
|
|
34
|
-
activeCellIds = _ref.activeCellIds;
|
|
35
|
-
|
|
36
|
-
var classes = useStyles();
|
|
37
|
-
if (R.isEmpty(data)) return null;
|
|
38
|
-
|
|
39
|
-
return React.createElement(
|
|
40
|
-
React.Fragment,
|
|
41
|
-
null,
|
|
42
|
-
R.addIndex(R.map)(function (rowColumn, i) {
|
|
43
|
-
return React.createElement(
|
|
44
|
-
XVector,
|
|
45
|
-
{
|
|
46
|
-
key: 'row-column-' + i,
|
|
47
|
-
yOffset: getYOffset(yOffset),
|
|
48
|
-
onSize: onYVectorSize(yOffset),
|
|
49
|
-
className: classes.root
|
|
50
|
-
},
|
|
51
|
-
React.createElement(ItemCell, _extends({
|
|
52
|
-
justifyContent: 'flex-start',
|
|
53
|
-
fontWeight: 'bold',
|
|
54
|
-
fontStyle: 'italic'
|
|
55
|
-
}, R.propOr({}, 'dimension', rowColumn)))
|
|
56
|
-
);
|
|
57
|
-
}, data),
|
|
58
|
-
React.createElement(Cell, { yOffset: getYOffset(yOffset), className: classes.sep }),
|
|
59
|
-
R.addIndex(R.map)(function (header, j) {
|
|
60
|
-
var _cx;
|
|
61
|
-
|
|
62
|
-
return React.createElement(
|
|
63
|
-
Cell,
|
|
64
|
-
{
|
|
65
|
-
key: 'row-header-' + j,
|
|
66
|
-
yOffset: getYOffset(yOffset),
|
|
67
|
-
className: cx(classes.sep, (_cx = {}, _cx[classes.highlight] = R.prop('col-' + j)(activeCellIds), _cx))
|
|
68
|
-
},
|
|
69
|
-
React.createElement(ItemCell, _extends({ justifyContent: 'center', alignItems: 'end' }, header))
|
|
70
|
-
);
|
|
71
|
-
}, headerData)
|
|
72
|
-
);
|
|
73
|
-
};
|
|
74
|
-
|
|
75
|
-
RowHeader.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
76
|
-
data: PropTypes.array.isRequired,
|
|
77
|
-
headerData: PropTypes.array.isRequired,
|
|
78
|
-
yOffset: PropTypes.number.isRequired,
|
|
79
|
-
onYVectorSize: PropTypes.func.isRequired,
|
|
80
|
-
getYOffset: PropTypes.func.isRequired,
|
|
81
|
-
activeCellIds: PropTypes.object
|
|
82
|
-
} : {};
|
|
83
|
-
|
|
84
|
-
export default RowHeader;
|
|
@@ -1,115 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
import cx from 'classnames';
|
|
4
|
-
import * as R from 'ramda';
|
|
5
|
-
import Lens from '@material-ui/icons/Lens';
|
|
6
|
-
import { withStyles } from '@material-ui/core';
|
|
7
|
-
import { makeStyles } from '@material-ui/core/styles';
|
|
8
|
-
import { Cell } from './styles';
|
|
9
|
-
import ItemTooltip from './tooltip';
|
|
10
|
-
import { getDark } from '../utils';
|
|
11
|
-
|
|
12
|
-
var Dot = withStyles(function (theme) {
|
|
13
|
-
return {
|
|
14
|
-
root: {
|
|
15
|
-
fontSize: theme.typography.pxToRem(8),
|
|
16
|
-
margin: theme.spacing(0, 0.5)
|
|
17
|
-
}
|
|
18
|
-
};
|
|
19
|
-
})(Lens);
|
|
20
|
-
|
|
21
|
-
var useStyles = makeStyles(function (theme) {
|
|
22
|
-
return {
|
|
23
|
-
zCell: {
|
|
24
|
-
backgroundColor: getDark(theme) || theme.palette.secondary.dark,
|
|
25
|
-
color: theme.palette.grey['A700'],
|
|
26
|
-
textAlign: 'left',
|
|
27
|
-
display: 'flex',
|
|
28
|
-
justifyContent: 'space-between',
|
|
29
|
-
alignItems: 'center'
|
|
30
|
-
},
|
|
31
|
-
zAtom: {
|
|
32
|
-
paddingTop: 4,
|
|
33
|
-
paddingBottom: 4,
|
|
34
|
-
zIndex: 1
|
|
35
|
-
},
|
|
36
|
-
zQuant: {
|
|
37
|
-
zIndex: 1,
|
|
38
|
-
whiteSpace: 'nowrap'
|
|
39
|
-
},
|
|
40
|
-
zQuantDimension: {
|
|
41
|
-
fontWeight: 'bold',
|
|
42
|
-
fontStyle: 'italic',
|
|
43
|
-
margin: theme.spacing(0, 0.5, 0, 0)
|
|
44
|
-
},
|
|
45
|
-
zQuantDimensionRtl: {
|
|
46
|
-
margin: theme.spacing(0, 0, 0, 0.5)
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
});
|
|
50
|
-
|
|
51
|
-
var SectionHeader = function SectionHeader(_ref) {
|
|
52
|
-
var section = _ref.section,
|
|
53
|
-
columnCount = _ref.columnCount,
|
|
54
|
-
yOffset = _ref.yOffset,
|
|
55
|
-
isRtl = _ref.isRtl;
|
|
56
|
-
|
|
57
|
-
var classes = useStyles();
|
|
58
|
-
if (R.isEmpty(R.propOr([], 'data', section))) return null;
|
|
59
|
-
var data = R.propOr([], 'data', section);
|
|
60
|
-
var hasFlag = R.find(R.pipe(R.path(['value', 'flags']), R.isEmpty, R.not))(data);
|
|
61
|
-
return React.createElement(
|
|
62
|
-
Cell,
|
|
63
|
-
{ spanCount: columnCount, yOffset: yOffset, className: classes.zCell },
|
|
64
|
-
React.createElement(
|
|
65
|
-
'div',
|
|
66
|
-
{ className: classes.zAtom, style: hasFlag ? { paddingTop: 0 } : undefined },
|
|
67
|
-
R.pipe(R.addIndex(R.map)(function (entry, index) {
|
|
68
|
-
var _cx;
|
|
69
|
-
|
|
70
|
-
return React.createElement(
|
|
71
|
-
React.Fragment,
|
|
72
|
-
{ key: index },
|
|
73
|
-
R.not(R.equals(index, 0)) && React.createElement(
|
|
74
|
-
'span',
|
|
75
|
-
{ className: classes.zQuant },
|
|
76
|
-
React.createElement(Dot, null)
|
|
77
|
-
),
|
|
78
|
-
React.createElement(
|
|
79
|
-
'span',
|
|
80
|
-
{
|
|
81
|
-
className: cx(classes.zQuant, classes.zQuantDimension, (_cx = {}, _cx[classes.zQuantDimensionRtl] = isRtl, _cx))
|
|
82
|
-
},
|
|
83
|
-
R.pathOr('', ['dimension', 'label'], entry),
|
|
84
|
-
':'
|
|
85
|
-
),
|
|
86
|
-
React.createElement(
|
|
87
|
-
'span',
|
|
88
|
-
{ className: classes.zQuant },
|
|
89
|
-
R.pathOr('', ['value', 'label'], entry)
|
|
90
|
-
),
|
|
91
|
-
R.not(R.isEmpty(R.pathOr([], ['value', 'flags'], entry))) && React.createElement(
|
|
92
|
-
React.Fragment,
|
|
93
|
-
null,
|
|
94
|
-
'\xA0'
|
|
95
|
-
),
|
|
96
|
-
React.createElement(ItemTooltip, { flags: R.pathOr([], ['value', 'flags'], entry) })
|
|
97
|
-
);
|
|
98
|
-
}))(data)
|
|
99
|
-
),
|
|
100
|
-
React.createElement(
|
|
101
|
-
'div',
|
|
102
|
-
{ className: classes.zAtom, style: hasFlag ? { paddingTop: 0 } : undefined },
|
|
103
|
-
React.createElement(ItemTooltip, { flags: R.propOr([], 'flags', section) })
|
|
104
|
-
)
|
|
105
|
-
);
|
|
106
|
-
};
|
|
107
|
-
|
|
108
|
-
SectionHeader.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
109
|
-
section: PropTypes.object.isRequired,
|
|
110
|
-
yOffset: PropTypes.number.isRequired,
|
|
111
|
-
columnCount: PropTypes.number.isRequired,
|
|
112
|
-
isRtl: PropTypes.bool
|
|
113
|
-
} : {};
|
|
114
|
-
|
|
115
|
-
export default React.memo(SectionHeader);
|
package/es/Table/section-rows.js
DELETED
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
|
2
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import PropTypes from 'prop-types';
|
|
5
|
-
import cx from 'classnames';
|
|
6
|
-
import * as R from 'ramda';
|
|
7
|
-
import { Cell } from './styles';
|
|
8
|
-
import ItemCell from './itemCell';
|
|
9
|
-
import ValueCell from './valueCell';
|
|
10
|
-
import ItemTooltip from './tooltip';
|
|
11
|
-
import useStyles from './useStyles';
|
|
12
|
-
|
|
13
|
-
var SectionRows = function SectionRows(_ref) {
|
|
14
|
-
var data = _ref.data,
|
|
15
|
-
sectionData = _ref.sectionData,
|
|
16
|
-
yColumnCount = _ref.yColumnCount,
|
|
17
|
-
cells = _ref.cells,
|
|
18
|
-
headerData = _ref.headerData,
|
|
19
|
-
cellHandler = _ref.cellHandler,
|
|
20
|
-
activeCellIds = _ref.activeCellIds,
|
|
21
|
-
activeCellHandler = _ref.activeCellHandler,
|
|
22
|
-
cellValueAccessor = _ref.cellValueAccessor;
|
|
23
|
-
|
|
24
|
-
var classes = useStyles();
|
|
25
|
-
|
|
26
|
-
if (R.lte(yColumnCount, 0)) return null;
|
|
27
|
-
return R.addIndex(R.map)(function (row, i) {
|
|
28
|
-
var _cx2;
|
|
29
|
-
|
|
30
|
-
var key = i + '-' + sectionData.key + '-' + row.key;
|
|
31
|
-
return React.createElement(
|
|
32
|
-
'span',
|
|
33
|
-
{ style: { display: 'contents' }, key: key },
|
|
34
|
-
R.addIndex(R.map)(function (entry, columnIndex) {
|
|
35
|
-
var _cx;
|
|
36
|
-
|
|
37
|
-
return React.createElement(
|
|
38
|
-
Cell,
|
|
39
|
-
{
|
|
40
|
-
key: columnIndex,
|
|
41
|
-
parents: R.pathOr([], ['value', 'parents'], entry),
|
|
42
|
-
className: cx(classes.xCell, classes.xCellDimension, (_cx = {}, _cx[classes.highlight] = R.prop(key)(activeCellIds), _cx))
|
|
43
|
-
},
|
|
44
|
-
React.createElement(ItemCell, _extends({ justifyContent: 'flex-start' }, R.propOr({}, 'value', entry)))
|
|
45
|
-
);
|
|
46
|
-
}, R.propOr([], 'data', row)),
|
|
47
|
-
React.createElement(
|
|
48
|
-
Cell,
|
|
49
|
-
{
|
|
50
|
-
className: cx(classes.sCell, (_cx2 = {}, _cx2[classes.highlight] = R.prop(key)(activeCellIds), _cx2))
|
|
51
|
-
},
|
|
52
|
-
React.createElement(ItemTooltip, { flags: R.propOr([], 'flags', row) })
|
|
53
|
-
),
|
|
54
|
-
R.addIndex(R.map)(function (column, columnIndex) {
|
|
55
|
-
var _cx3;
|
|
56
|
-
|
|
57
|
-
var keyCol = 'col-' + columnIndex;
|
|
58
|
-
var intersectionCellId = key + '/' + keyCol;
|
|
59
|
-
var isActive = R.pipe(R.propOr({}, 'intersectionCellId'), R.equals(intersectionCellId))(activeCellIds);
|
|
60
|
-
return React.createElement(
|
|
61
|
-
Cell,
|
|
62
|
-
{
|
|
63
|
-
key: keyCol,
|
|
64
|
-
className: cx(classes.xCell, classes.xCellValue, (_cx3 = {}, _cx3[classes.xCellActive] = isActive, _cx3[classes.highlight] = R.any(R.identity)([R.prop(key)(activeCellIds), R.prop(keyCol)(activeCellIds)]), _cx3)),
|
|
65
|
-
onClick: R.is(Function, activeCellHandler) ? function () {
|
|
66
|
-
var _activeCellHandler;
|
|
67
|
-
|
|
68
|
-
return activeCellHandler((_activeCellHandler = {}, _activeCellHandler[key] = R.not(isActive), _activeCellHandler[keyCol] = R.not(isActive), _activeCellHandler.intersectionCellId = isActive ? null : intersectionCellId, _activeCellHandler));
|
|
69
|
-
} : null
|
|
70
|
-
},
|
|
71
|
-
React.createElement(ValueCell, _extends({}, R.pipe(R.pathOr({ value: '..' }, [column.key, sectionData.key, row.key, 0]), cellValueAccessor)(cells), {
|
|
72
|
-
cellHandler: cellHandler
|
|
73
|
-
}))
|
|
74
|
-
);
|
|
75
|
-
}, headerData)
|
|
76
|
-
);
|
|
77
|
-
}, data);
|
|
78
|
-
};
|
|
79
|
-
|
|
80
|
-
SectionRows.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
81
|
-
cells: PropTypes.object.isRequired,
|
|
82
|
-
cellHandler: PropTypes.func,
|
|
83
|
-
cellValueAccessor: PropTypes.func,
|
|
84
|
-
data: PropTypes.array.isRequired,
|
|
85
|
-
headerData: PropTypes.array.isRequired,
|
|
86
|
-
sectionData: PropTypes.object.isRequired,
|
|
87
|
-
yColumnCount: PropTypes.number.isRequired,
|
|
88
|
-
activeCellIds: PropTypes.object,
|
|
89
|
-
activeCellHandler: PropTypes.func
|
|
90
|
-
} : {};
|
|
91
|
-
|
|
92
|
-
SectionRows.defaultProps = {
|
|
93
|
-
cells: {},
|
|
94
|
-
cellValueAccessor: R.identity,
|
|
95
|
-
data: [],
|
|
96
|
-
headerData: [],
|
|
97
|
-
sectionData: [],
|
|
98
|
-
yColumnCount: 1
|
|
99
|
-
};
|
|
100
|
-
|
|
101
|
-
export default React.memo(SectionRows);
|
package/es/Table/styles.js
DELETED
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
import PropTypes from 'prop-types';
|
|
2
|
-
import glamorous from 'glamorous';
|
|
3
|
-
import * as R from 'ramda';
|
|
4
|
-
|
|
5
|
-
export var cell = {
|
|
6
|
-
outline: '1px solid #A4A1A1',
|
|
7
|
-
fontSize: 12,
|
|
8
|
-
fontWeight: 400,
|
|
9
|
-
lineHeight: 1.43,
|
|
10
|
-
padding: '0px 8px',
|
|
11
|
-
zIndex: 1
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
export var Cell = glamorous.div(cell, function (_ref) {
|
|
15
|
-
var spanCount = _ref.spanCount,
|
|
16
|
-
yOffset = _ref.yOffset;
|
|
17
|
-
return {
|
|
18
|
-
'@supports (display: grid)': {
|
|
19
|
-
gridColumn: 'span ' + R.defaultTo(1, spanCount)
|
|
20
|
-
},
|
|
21
|
-
'@supports (position: sticky)': {
|
|
22
|
-
position: R.isNil(yOffset) ? null : 'sticky',
|
|
23
|
-
top: yOffset
|
|
24
|
-
}
|
|
25
|
-
};
|
|
26
|
-
});
|
|
27
|
-
|
|
28
|
-
Cell.propTypes = {
|
|
29
|
-
className: PropTypes.string,
|
|
30
|
-
spanCount: PropTypes.number,
|
|
31
|
-
yOffset: PropTypes.number,
|
|
32
|
-
children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node])
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
export var Table = glamorous.div({
|
|
36
|
-
display: '-ms-grid',
|
|
37
|
-
'@supports (display: grid)': {
|
|
38
|
-
display: 'grid'
|
|
39
|
-
},
|
|
40
|
-
gridAutoRows: 'auto',
|
|
41
|
-
msGridAutoFlow: 'row'
|
|
42
|
-
}, function (_ref2) {
|
|
43
|
-
var columnCount = _ref2.columnCount,
|
|
44
|
-
xColumnCount = _ref2.xColumnCount;
|
|
45
|
-
|
|
46
|
-
var gridTemplateColumns = R.pipe(R.times(R.always('auto')), R.update(R.dec(xColumnCount), '30px'), R.join(' '))(columnCount);
|
|
47
|
-
|
|
48
|
-
return {
|
|
49
|
-
gridTemplateColumns: gridTemplateColumns,
|
|
50
|
-
msGridColumns: gridTemplateColumns
|
|
51
|
-
};
|
|
52
|
-
});
|
package/es/Table/tableCell.js
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
|
2
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import PropTypes from 'prop-types';
|
|
5
|
-
import cx from 'classnames';
|
|
6
|
-
import ValueCell from './valueCell';
|
|
7
|
-
import useStyles from './useStyles';
|
|
8
|
-
|
|
9
|
-
var TableCell = function TableCell(_ref) {
|
|
10
|
-
var _ref$cell = _ref.cell,
|
|
11
|
-
cell = _ref$cell === undefined ? {} : _ref$cell,
|
|
12
|
-
cellHandler = _ref.cellHandler;
|
|
13
|
-
|
|
14
|
-
var classes = useStyles();
|
|
15
|
-
|
|
16
|
-
return React.createElement(
|
|
17
|
-
'div',
|
|
18
|
-
{ className: cx(classes.cell, classes.xCell, classes.xCellValue) },
|
|
19
|
-
React.createElement(ValueCell, _extends({}, cell, { cellHandler: cellHandler }))
|
|
20
|
-
);
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
TableCell.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
24
|
-
cell: PropTypes.object,
|
|
25
|
-
cellHandler: PropTypes.func,
|
|
26
|
-
isRtl: PropTypes.bool
|
|
27
|
-
} : {};
|
|
28
|
-
|
|
29
|
-
export default TableCell;
|
package/es/Table/tooltip.js
DELETED
|
@@ -1,85 +0,0 @@
|
|
|
1
|
-
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
|
2
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import PropTypes from 'prop-types';
|
|
5
|
-
import { makeStyles } from '@material-ui/core/styles';
|
|
6
|
-
import * as R from 'ramda';
|
|
7
|
-
import { Tooltip, Asterisk } from '../';
|
|
8
|
-
|
|
9
|
-
var useStyles = makeStyles(function (theme) {
|
|
10
|
-
return {
|
|
11
|
-
content: {
|
|
12
|
-
borderRadius: 3,
|
|
13
|
-
boxSizing: 'border-box',
|
|
14
|
-
color: 'white',
|
|
15
|
-
listStyleType: 'none',
|
|
16
|
-
maxWidth: 270,
|
|
17
|
-
padding: 0,
|
|
18
|
-
margin: 0,
|
|
19
|
-
fontSize: 12,
|
|
20
|
-
fontWeight: 400,
|
|
21
|
-
lineHeight: 1.43
|
|
22
|
-
},
|
|
23
|
-
flags: _extends({
|
|
24
|
-
verticalAlign: 'super',
|
|
25
|
-
borderBottom: '1px dotted',
|
|
26
|
-
borderColor: 'inherit',
|
|
27
|
-
margin: theme.spacing(0, 0.5),
|
|
28
|
-
whiteSpace: 'nowrap',
|
|
29
|
-
fontWeight: 'bold',
|
|
30
|
-
fontStyle: 'normal'
|
|
31
|
-
}, R.pathOr({}, ['mixins', 'table', 'flag'], theme)),
|
|
32
|
-
svg: {
|
|
33
|
-
verticalAlign: 'middle'
|
|
34
|
-
}
|
|
35
|
-
};
|
|
36
|
-
});
|
|
37
|
-
|
|
38
|
-
var ItemTooltip = function ItemTooltip(_ref) {
|
|
39
|
-
var flags = _ref.flags;
|
|
40
|
-
|
|
41
|
-
var classes = useStyles();
|
|
42
|
-
if (R.anyPass([R.isNil, R.isEmpty])(flags)) return null;
|
|
43
|
-
var hasUncoded = R.any(R.complement(R.has('code')), flags);
|
|
44
|
-
var codedIcons = R.pipe(R.reduce(function (acc, flag) {
|
|
45
|
-
return R.when(R.always(R.has('code', flag)), R.append(flag.code))(acc);
|
|
46
|
-
}, []), R.join(','))(flags);
|
|
47
|
-
|
|
48
|
-
var content = React.createElement(
|
|
49
|
-
'ul',
|
|
50
|
-
{ className: classes.content },
|
|
51
|
-
R.addIndex(R.map)(function (_ref2, index) {
|
|
52
|
-
var label = _ref2.label;
|
|
53
|
-
return React.createElement(
|
|
54
|
-
'li',
|
|
55
|
-
{ key: index },
|
|
56
|
-
label
|
|
57
|
-
);
|
|
58
|
-
}, flags)
|
|
59
|
-
);
|
|
60
|
-
|
|
61
|
-
return React.createElement(
|
|
62
|
-
Tooltip,
|
|
63
|
-
{ title: content, placement: 'top', enterNextDelay: 100 },
|
|
64
|
-
React.createElement(
|
|
65
|
-
'span',
|
|
66
|
-
{ className: classes.flags },
|
|
67
|
-
R.not(R.isEmpty(codedIcons)) && codedIcons,
|
|
68
|
-
R.and(R.not(R.isEmpty(codedIcons)), hasUncoded) && React.createElement(
|
|
69
|
-
React.Fragment,
|
|
70
|
-
null,
|
|
71
|
-
','
|
|
72
|
-
),
|
|
73
|
-
hasUncoded && React.createElement(Asterisk, { className: classes.svg, style: { fontSize: 11 } })
|
|
74
|
-
)
|
|
75
|
-
);
|
|
76
|
-
};
|
|
77
|
-
|
|
78
|
-
ItemTooltip.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
79
|
-
flags: PropTypes.arrayOf(PropTypes.shape({
|
|
80
|
-
code: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
|
|
81
|
-
label: PropTypes.string
|
|
82
|
-
}))
|
|
83
|
-
} : {};
|
|
84
|
-
|
|
85
|
-
export default React.memo(ItemTooltip);
|
package/es/Table/useStyles.js
DELETED
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { makeStyles } from '@material-ui/core/styles';
|
|
2
|
-
import { getLight } from '../utils';
|
|
3
|
-
import { cell } from './styles';
|
|
4
|
-
|
|
5
|
-
export default makeStyles(function (theme) {
|
|
6
|
-
return {
|
|
7
|
-
cell: cell,
|
|
8
|
-
xCell: {
|
|
9
|
-
color: theme.palette.grey['A700'],
|
|
10
|
-
zIndex: 0,
|
|
11
|
-
backgroundColor: theme.palette.common.white
|
|
12
|
-
},
|
|
13
|
-
xCellDimension: {
|
|
14
|
-
backgroundColor: getLight(theme) || theme.palette.secondary.light,
|
|
15
|
-
display: 'flex'
|
|
16
|
-
},
|
|
17
|
-
xCellValue: {
|
|
18
|
-
'&:hover': {
|
|
19
|
-
boxShadow: 'inset 0 0 0 3px ' + theme.palette.primary.main
|
|
20
|
-
}
|
|
21
|
-
},
|
|
22
|
-
xCellActive: {
|
|
23
|
-
boxShadow: 'inset 0 0 0 3px ' + theme.palette.primary.main
|
|
24
|
-
},
|
|
25
|
-
sCell: {
|
|
26
|
-
backgroundColor: theme.palette.grey[200],
|
|
27
|
-
display: 'flex',
|
|
28
|
-
justifyContent: 'center',
|
|
29
|
-
alignItems: 'end',
|
|
30
|
-
zIndex: 0
|
|
31
|
-
},
|
|
32
|
-
highlight: theme.mixins.table.cellHighlight
|
|
33
|
-
};
|
|
34
|
-
});
|
package/es/Table/valueCell.js
DELETED
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
|
2
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import PropTypes from 'prop-types';
|
|
5
|
-
import Link from '@material-ui/core/Link';
|
|
6
|
-
import * as R from 'ramda';
|
|
7
|
-
import ItemTooltip from './tooltip';
|
|
8
|
-
|
|
9
|
-
var ValueCell = function ValueCell(_ref) {
|
|
10
|
-
var value = _ref.value,
|
|
11
|
-
flags = _ref.flags,
|
|
12
|
-
_ref$indexedDimValIds = _ref.indexedDimValIds,
|
|
13
|
-
indexedDimValIds = _ref$indexedDimValIds === undefined ? {} : _ref$indexedDimValIds,
|
|
14
|
-
cellHandler = _ref.cellHandler;
|
|
15
|
-
|
|
16
|
-
var style = {
|
|
17
|
-
textAlign: 'right',
|
|
18
|
-
whiteSpace: R.isEmpty(flags) ? undefined : 'nowrap',
|
|
19
|
-
paddingTop: 4,
|
|
20
|
-
paddingBottom: 4
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
var _value = R.pipe(R.split('\n'), R.intersperse(React.createElement('br', null)))(value);
|
|
24
|
-
|
|
25
|
-
var uiValue = R.is(Function, cellHandler) && !R.isEmpty(indexedDimValIds) ? React.createElement(
|
|
26
|
-
Link,
|
|
27
|
-
{
|
|
28
|
-
component: 'button',
|
|
29
|
-
variant: 'body2',
|
|
30
|
-
color: 'inherit',
|
|
31
|
-
underline: 'always',
|
|
32
|
-
style: { fontSize: 12 },
|
|
33
|
-
onClick: function onClick() {
|
|
34
|
-
return cellHandler({ indexedDimValIds: indexedDimValIds });
|
|
35
|
-
}
|
|
36
|
-
},
|
|
37
|
-
_value
|
|
38
|
-
) : _value;
|
|
39
|
-
|
|
40
|
-
if (R.anyPass([R.isNil, R.isEmpty])(flags)) return React.createElement(
|
|
41
|
-
'div',
|
|
42
|
-
{ style: style },
|
|
43
|
-
' ',
|
|
44
|
-
uiValue
|
|
45
|
-
);
|
|
46
|
-
|
|
47
|
-
return React.createElement(
|
|
48
|
-
'div',
|
|
49
|
-
{ style: _extends({}, style, { paddingTop: 0 }) },
|
|
50
|
-
React.createElement(ItemTooltip, { flags: flags }),
|
|
51
|
-
uiValue
|
|
52
|
-
);
|
|
53
|
-
};
|
|
54
|
-
|
|
55
|
-
ValueCell.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
56
|
-
value: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
57
|
-
flags: PropTypes.array,
|
|
58
|
-
indexedDimValIds: PropTypes.object,
|
|
59
|
-
cellHandler: PropTypes.func,
|
|
60
|
-
isRtl: PropTypes.bool
|
|
61
|
-
} : {};
|
|
62
|
-
|
|
63
|
-
export default React.memo(ValueCell);
|