@instructure/ui-table 8.33.1 → 8.33.2
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/CHANGELOG.md +4 -0
- package/es/Table/Body/index.js +6 -12
- package/es/Table/Body/props.js +1 -0
- package/es/Table/Body/styles.js +0 -1
- package/es/Table/Body/theme.js +3 -3
- package/es/Table/Cell/index.js +5 -11
- package/es/Table/Cell/props.js +1 -0
- package/es/Table/Cell/styles.js +0 -1
- package/es/Table/Cell/theme.js +4 -4
- package/es/Table/ColHeader/index.js +11 -24
- package/es/Table/ColHeader/props.js +1 -0
- package/es/Table/ColHeader/styles.js +1 -2
- package/es/Table/ColHeader/theme.js +5 -5
- package/es/Table/Head/index.js +15 -38
- package/es/Table/Head/props.js +1 -0
- package/es/Table/Head/styles.js +0 -1
- package/es/Table/Head/theme.js +3 -3
- package/es/Table/Row/index.js +5 -14
- package/es/Table/Row/props.js +1 -0
- package/es/Table/Row/styles.js +1 -2
- package/es/Table/Row/theme.js +5 -5
- package/es/Table/RowHeader/index.js +4 -10
- package/es/Table/RowHeader/props.js +1 -0
- package/es/Table/RowHeader/styles.js +0 -1
- package/es/Table/RowHeader/theme.js +4 -4
- package/es/Table/index.js +11 -28
- package/es/Table/props.js +1 -0
- package/es/Table/styles.js +0 -1
- package/es/Table/theme.js +4 -4
- package/lib/Table/Body/index.js +5 -23
- package/lib/Table/Body/props.js +1 -5
- package/lib/Table/Body/styles.js +0 -2
- package/lib/Table/Body/theme.js +3 -4
- package/lib/Table/Cell/index.js +4 -20
- package/lib/Table/Cell/props.js +1 -3
- package/lib/Table/Cell/styles.js +0 -2
- package/lib/Table/Cell/theme.js +4 -5
- package/lib/Table/ColHeader/index.js +10 -36
- package/lib/Table/ColHeader/props.js +1 -3
- package/lib/Table/ColHeader/styles.js +1 -3
- package/lib/Table/ColHeader/theme.js +5 -6
- package/lib/Table/Head/index.js +14 -54
- package/lib/Table/Head/props.js +1 -5
- package/lib/Table/Head/styles.js +0 -2
- package/lib/Table/Head/theme.js +3 -4
- package/lib/Table/Row/index.js +4 -27
- package/lib/Table/Row/props.js +1 -7
- package/lib/Table/Row/styles.js +1 -3
- package/lib/Table/Row/theme.js +5 -6
- package/lib/Table/RowHeader/index.js +3 -19
- package/lib/Table/RowHeader/props.js +1 -3
- package/lib/Table/RowHeader/styles.js +0 -2
- package/lib/Table/RowHeader/theme.js +4 -5
- package/lib/Table/index.js +10 -45
- package/lib/Table/props.js +1 -7
- package/lib/Table/styles.js +0 -2
- package/lib/Table/theme.js +4 -5
- package/lib/index.js +0 -1
- package/package.json +16 -16
- package/tsconfig.build.tsbuildinfo +1 -1
package/lib/Table/index.js
CHANGED
@@ -1,48 +1,28 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
4
|
-
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
6
5
|
value: true
|
7
6
|
});
|
8
7
|
exports.default = exports.Table = void 0;
|
9
|
-
|
10
8
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
11
|
-
|
12
9
|
var _react = require("react");
|
13
|
-
|
14
10
|
var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
|
15
|
-
|
16
11
|
var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
|
17
|
-
|
18
12
|
var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
|
19
|
-
|
20
13
|
var _View = require("@instructure/ui-view/lib/View");
|
21
|
-
|
22
14
|
var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReaderContent");
|
23
|
-
|
24
15
|
var _emotion = require("@instructure/emotion");
|
25
|
-
|
26
16
|
var _styles = _interopRequireDefault(require("./styles"));
|
27
|
-
|
28
17
|
var _theme = _interopRequireDefault(require("./theme"));
|
29
|
-
|
30
18
|
var _Head = require("./Head");
|
31
|
-
|
32
19
|
var _Body = require("./Body");
|
33
|
-
|
34
20
|
var _Row = require("./Row");
|
35
|
-
|
36
21
|
var _ColHeader = require("./ColHeader");
|
37
|
-
|
38
22
|
var _RowHeader = require("./RowHeader");
|
39
|
-
|
40
23
|
var _Cell = require("./Cell");
|
41
|
-
|
42
24
|
var _props = require("./props");
|
43
|
-
|
44
25
|
var _dec, _class, _class2;
|
45
|
-
|
46
26
|
/**
|
47
27
|
---
|
48
28
|
category: components
|
@@ -53,59 +33,47 @@ let Table = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _d
|
|
53
33
|
constructor() {
|
54
34
|
super(...arguments);
|
55
35
|
this.ref = null;
|
56
|
-
|
57
36
|
this.handleRef = el => {
|
58
37
|
const elementRef = this.props.elementRef;
|
59
38
|
this.ref = el;
|
60
|
-
|
61
39
|
if (typeof elementRef === 'function') {
|
62
40
|
elementRef(el);
|
63
41
|
}
|
64
42
|
};
|
65
43
|
}
|
66
|
-
|
67
44
|
componentDidMount() {
|
68
45
|
var _this$props$makeStyle, _this$props;
|
69
|
-
|
70
46
|
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
71
47
|
}
|
72
|
-
|
73
48
|
componentDidUpdate() {
|
74
49
|
var _this$props$makeStyle2, _this$props2;
|
75
|
-
|
76
50
|
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
|
77
51
|
}
|
78
|
-
|
79
52
|
getHeaders() {
|
80
53
|
const children = this.props.children;
|
81
|
-
|
82
54
|
const _ref = _react.Children.toArray(children),
|
83
|
-
|
84
|
-
|
85
|
-
|
55
|
+
_ref2 = (0, _slicedToArray2.default)(_ref, 1),
|
56
|
+
head = _ref2[0];
|
86
57
|
if ((0, _matchComponentTypes.matchComponentTypes)(head, [_Head.Head])) {
|
87
58
|
const _Children$toArray = _react.Children.toArray(head.props.children),
|
88
|
-
|
89
|
-
|
90
|
-
|
59
|
+
_Children$toArray2 = (0, _slicedToArray2.default)(_Children$toArray, 1),
|
60
|
+
row = _Children$toArray2[0];
|
91
61
|
if ((0, _matchComponentTypes.matchComponentTypes)(row, [_Row.Row])) {
|
92
62
|
return _react.Children.map(row.props.children, colHeader => {
|
93
63
|
return (0, _matchComponentTypes.matchComponentTypes)(colHeader, [_ColHeader.ColHeader]) ? colHeader.props.children : void 0;
|
94
64
|
});
|
95
65
|
}
|
96
66
|
}
|
97
|
-
|
98
67
|
return void 0;
|
99
68
|
}
|
100
|
-
|
101
69
|
render() {
|
102
70
|
const _this$props3 = this.props,
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
71
|
+
margin = _this$props3.margin,
|
72
|
+
layout = _this$props3.layout,
|
73
|
+
caption = _this$props3.caption,
|
74
|
+
children = _this$props3.children,
|
75
|
+
hover = _this$props3.hover,
|
76
|
+
styles = _this$props3.styles;
|
109
77
|
const isStacked = layout === 'stacked';
|
110
78
|
const headers = isStacked ? this.getHeaders() : void 0;
|
111
79
|
return (0, _emotion.jsx)(_View.View, Object.assign({}, _View.View.omitViewProps((0, _omitProps.omitProps)(this.props, Table.allowedProps), Table), {
|
@@ -122,7 +90,6 @@ let Table = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _d
|
|
122
90
|
isStacked
|
123
91
|
});
|
124
92
|
}
|
125
|
-
|
126
93
|
if ((0, _matchComponentTypes.matchComponentTypes)(child, [_Body.Body])) {
|
127
94
|
return (0, _safeCloneElement.safeCloneElement)(child, {
|
128
95
|
key: child.props.name,
|
@@ -131,11 +98,9 @@ let Table = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _d
|
|
131
98
|
headers
|
132
99
|
});
|
133
100
|
}
|
134
|
-
|
135
101
|
return null;
|
136
102
|
}));
|
137
103
|
}
|
138
|
-
|
139
104
|
}, _class2.displayName = "Table", _class2.componentId = 'Table', _class2.allowedProps = _props.allowedProps, _class2.propTypes = _props.propTypes, _class2.defaultProps = {
|
140
105
|
children: null,
|
141
106
|
hover: false,
|
package/lib/Table/props.js
CHANGED
@@ -1,22 +1,15 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
4
|
-
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
6
5
|
value: true
|
7
6
|
});
|
8
7
|
exports.propTypes = exports.allowedProps = void 0;
|
9
|
-
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
11
|
-
|
12
9
|
var _Children = require("@instructure/ui-prop-types/lib/Children.js");
|
13
|
-
|
14
10
|
var _emotion = require("@instructure/emotion");
|
15
|
-
|
16
11
|
var _Head = require("./Head");
|
17
|
-
|
18
12
|
var _Body = require("./Body");
|
19
|
-
|
20
13
|
/*
|
21
14
|
* The MIT License (MIT)
|
22
15
|
*
|
@@ -40,6 +33,7 @@ var _Body = require("./Body");
|
|
40
33
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
41
34
|
* SOFTWARE.
|
42
35
|
*/
|
36
|
+
|
43
37
|
const propTypes = {
|
44
38
|
caption: _propTypes.default.node.isRequired,
|
45
39
|
children: _Children.Children.oneOf([_Head.Head, _Body.Body]),
|
package/lib/Table/styles.js
CHANGED
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.default = void 0;
|
7
|
-
|
8
7
|
/*
|
9
8
|
* The MIT License (MIT)
|
10
9
|
*
|
@@ -62,6 +61,5 @@ const generateStyle = (componentTheme, props) => {
|
|
62
61
|
}
|
63
62
|
};
|
64
63
|
};
|
65
|
-
|
66
64
|
var _default = generateStyle;
|
67
65
|
exports.default = _default;
|
package/lib/Table/theme.js
CHANGED
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.default = void 0;
|
7
|
-
|
8
7
|
/*
|
9
8
|
* The MIT License (MIT)
|
10
9
|
*
|
@@ -36,8 +35,8 @@ exports.default = void 0;
|
|
36
35
|
*/
|
37
36
|
const generateComponentTheme = theme => {
|
38
37
|
const colors = theme.colors,
|
39
|
-
|
40
|
-
|
38
|
+
typography = theme.typography,
|
39
|
+
themeName = theme.key;
|
41
40
|
const themeSpecificStyle = {
|
42
41
|
canvas: {
|
43
42
|
color: theme['ic-brand-font-color-dark']
|
@@ -50,10 +49,10 @@ const generateComponentTheme = theme => {
|
|
50
49
|
color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
|
51
50
|
background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest
|
52
51
|
};
|
53
|
-
return {
|
52
|
+
return {
|
53
|
+
...componentVariables,
|
54
54
|
...themeSpecificStyle[themeName]
|
55
55
|
};
|
56
56
|
};
|
57
|
-
|
58
57
|
var _default = generateComponentTheme;
|
59
58
|
exports.default = _default;
|
package/lib/index.js
CHANGED
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@instructure/ui-table",
|
3
|
-
"version": "8.33.
|
3
|
+
"version": "8.33.2",
|
4
4
|
"description": "A styled HTML table component",
|
5
5
|
"author": "Instructure, Inc. Engineering and Product Design",
|
6
6
|
"module": "./es/index.js",
|
@@ -23,24 +23,24 @@
|
|
23
23
|
},
|
24
24
|
"license": "MIT",
|
25
25
|
"devDependencies": {
|
26
|
-
"@instructure/ui-babel-preset": "8.33.
|
27
|
-
"@instructure/ui-color-utils": "8.33.
|
28
|
-
"@instructure/ui-test-utils": "8.33.
|
29
|
-
"@instructure/ui-themes": "8.33.
|
26
|
+
"@instructure/ui-babel-preset": "8.33.2",
|
27
|
+
"@instructure/ui-color-utils": "8.33.2",
|
28
|
+
"@instructure/ui-test-utils": "8.33.2",
|
29
|
+
"@instructure/ui-themes": "8.33.2"
|
30
30
|
},
|
31
31
|
"dependencies": {
|
32
32
|
"@babel/runtime": "^7.13.10",
|
33
|
-
"@instructure/console": "8.33.
|
34
|
-
"@instructure/emotion": "8.33.
|
35
|
-
"@instructure/shared-types": "8.33.
|
36
|
-
"@instructure/ui-a11y-content": "8.33.
|
37
|
-
"@instructure/ui-icons": "8.33.
|
38
|
-
"@instructure/ui-prop-types": "8.33.
|
39
|
-
"@instructure/ui-react-utils": "8.33.
|
40
|
-
"@instructure/ui-simple-select": "8.33.
|
41
|
-
"@instructure/ui-testable": "8.33.
|
42
|
-
"@instructure/ui-utils": "8.33.
|
43
|
-
"@instructure/ui-view": "8.33.
|
33
|
+
"@instructure/console": "8.33.2",
|
34
|
+
"@instructure/emotion": "8.33.2",
|
35
|
+
"@instructure/shared-types": "8.33.2",
|
36
|
+
"@instructure/ui-a11y-content": "8.33.2",
|
37
|
+
"@instructure/ui-icons": "8.33.2",
|
38
|
+
"@instructure/ui-prop-types": "8.33.2",
|
39
|
+
"@instructure/ui-react-utils": "8.33.2",
|
40
|
+
"@instructure/ui-simple-select": "8.33.2",
|
41
|
+
"@instructure/ui-testable": "8.33.2",
|
42
|
+
"@instructure/ui-utils": "8.33.2",
|
43
|
+
"@instructure/ui-view": "8.33.2",
|
44
44
|
"prop-types": "^15"
|
45
45
|
},
|
46
46
|
"peerDependencies": {
|