@dhis2-ui/table 8.2.0 → 8.2.1
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/build/cjs/data-table/__tests__/data-table-row/expanded-row.test.js +2 -2
- package/build/cjs/data-table/data-table-cell.js +23 -22
- package/build/cjs/data-table/data-table-column-header/data-table-column-header.js +60 -57
- package/build/cjs/data-table/data-table-column-header/data-table-column-header.styles.js +1 -1
- package/build/cjs/data-table/data-table-column-header/filter-handle.js +6 -5
- package/build/cjs/data-table/data-table-column-header/sorter.js +9 -8
- package/build/cjs/data-table/data-table-row/data-table-row.js +12 -11
- package/build/cjs/data-table/data-table-row/data-table-row.styles.js +1 -1
- package/build/cjs/data-table/data-table-row/expand-handle-cell.js +15 -12
- package/build/cjs/data-table/data-table-row/expanded-row.js +23 -20
- package/build/cjs/data-table/data-table.js +12 -11
- package/build/cjs/data-table/data-table.stories.e2e.js +1 -1
- package/build/cjs/data-table/data-table.stories.js +147 -145
- package/build/cjs/data-table/table-elements/__tests__/table-data-cell.test.js +3 -3
- package/build/cjs/data-table/table-elements/__tests__/table-header-cell.test.js +4 -4
- package/build/cjs/data-table/table-elements/__tests__/table.test.js +2 -2
- package/build/cjs/data-table/table-elements/index.js +8 -8
- package/build/cjs/data-table/table-elements/table-body.js +21 -18
- package/build/cjs/data-table/table-elements/table-data-cell/table-data-cell.js +40 -37
- package/build/cjs/data-table/table-elements/table-data-cell/table-data-cell.styles.js +1 -1
- package/build/cjs/data-table/table-elements/table-foot.js +15 -12
- package/build/cjs/data-table/table-elements/table-head.js +15 -12
- package/build/cjs/data-table/table-elements/table-header-cell/table-header-cell.js +43 -40
- package/build/cjs/data-table/table-elements/table-header-cell/table-header-cell.styles.js +1 -1
- package/build/cjs/data-table/table-elements/table-header-cell-action.js +20 -17
- package/build/cjs/data-table/table-elements/table-row.js +21 -18
- package/build/cjs/data-table/table-elements/table-scroll-box.js +18 -15
- package/build/cjs/data-table/table-elements/table-toolbar.js +17 -14
- package/build/cjs/data-table/table-elements/table.js +23 -20
- package/build/cjs/data-table/table-elements/table.stories.e2e.js +1 -1
- package/build/cjs/data-table/table-elements/table.stories.internal.js +119 -127
- package/build/cjs/index.js +42 -42
- package/build/cjs/stacked-table/content-with-title.js +14 -11
- package/build/cjs/stacked-table/index.js +10 -10
- package/build/cjs/stacked-table/stacked-table-body.js +13 -10
- package/build/cjs/stacked-table/stacked-table-cell-head.js +20 -17
- package/build/cjs/stacked-table/stacked-table-cell.js +13 -12
- package/build/cjs/stacked-table/stacked-table-foot.js +13 -10
- package/build/cjs/stacked-table/stacked-table-head.js +13 -10
- package/build/cjs/stacked-table/stacked-table-row-head.js +11 -8
- package/build/cjs/stacked-table/stacked-table-row.js +19 -13
- package/build/cjs/stacked-table/stacked-table.js +7 -6
- package/build/cjs/stacked-table/stacked-table.stories.js +3 -20
- package/build/cjs/stacked-table/stacked-table.test.js +24 -15
- package/build/cjs/stacked-table/table-context.js +1 -1
- package/build/cjs/stacked-table/table.js +14 -11
- package/build/cjs/table/index.js +10 -10
- package/build/cjs/table/table-body.js +13 -10
- package/build/cjs/table/table-cell-head.js +22 -19
- package/build/cjs/table/table-cell.js +22 -19
- package/build/cjs/table/table-context.js +1 -1
- package/build/cjs/table/table-foot.js +13 -10
- package/build/cjs/table/table-head.js +13 -10
- package/build/cjs/table/table-row-head.js +15 -12
- package/build/cjs/table/table-row.js +9 -8
- package/build/cjs/table/table.js +19 -16
- package/build/cjs/table/table.stories.js +3 -18
- package/build/es/data-table/__tests__/data-table-row/expanded-row.test.js +2 -2
- package/build/es/data-table/data-table-cell.js +23 -22
- package/build/es/data-table/data-table-column-header/data-table-column-header.js +60 -57
- package/build/es/data-table/data-table-column-header/filter-handle.js +6 -5
- package/build/es/data-table/data-table-column-header/sorter.js +8 -7
- package/build/es/data-table/data-table-row/data-table-row.js +12 -11
- package/build/es/data-table/data-table-row/data-table-row.styles.js +1 -1
- package/build/es/data-table/data-table-row/expand-handle-cell.js +15 -12
- package/build/es/data-table/data-table-row/expanded-row.js +23 -20
- package/build/es/data-table/data-table.js +12 -11
- package/build/es/data-table/data-table.stories.js +146 -144
- package/build/es/data-table/table-elements/__tests__/table-data-cell.test.js +3 -3
- package/build/es/data-table/table-elements/__tests__/table-header-cell.test.js +4 -4
- package/build/es/data-table/table-elements/__tests__/table.test.js +2 -2
- package/build/es/data-table/table-elements/table-body.js +21 -18
- package/build/es/data-table/table-elements/table-data-cell/table-data-cell.js +40 -37
- package/build/es/data-table/table-elements/table-data-cell/table-data-cell.styles.js +1 -1
- package/build/es/data-table/table-elements/table-foot.js +15 -12
- package/build/es/data-table/table-elements/table-head.js +15 -12
- package/build/es/data-table/table-elements/table-header-cell/table-header-cell.js +43 -40
- package/build/es/data-table/table-elements/table-header-cell/table-header-cell.styles.js +1 -1
- package/build/es/data-table/table-elements/table-header-cell-action.js +20 -17
- package/build/es/data-table/table-elements/table-row.js +21 -18
- package/build/es/data-table/table-elements/table-scroll-box.js +18 -15
- package/build/es/data-table/table-elements/table-toolbar.js +17 -14
- package/build/es/data-table/table-elements/table.js +23 -20
- package/build/es/data-table/table-elements/table.stories.internal.js +118 -126
- package/build/es/stacked-table/content-with-title.js +14 -11
- package/build/es/stacked-table/stacked-table-body.js +13 -10
- package/build/es/stacked-table/stacked-table-cell-head.js +20 -17
- package/build/es/stacked-table/stacked-table-cell.js +13 -12
- package/build/es/stacked-table/stacked-table-foot.js +13 -10
- package/build/es/stacked-table/stacked-table-head.js +13 -10
- package/build/es/stacked-table/stacked-table-row-head.js +11 -8
- package/build/es/stacked-table/stacked-table-row.js +19 -13
- package/build/es/stacked-table/stacked-table.js +7 -6
- package/build/es/stacked-table/stacked-table.stories.js +2 -19
- package/build/es/stacked-table/stacked-table.test.js +24 -15
- package/build/es/stacked-table/table.js +14 -11
- package/build/es/table/table-body.js +13 -10
- package/build/es/table/table-cell-head.js +22 -19
- package/build/es/table/table-cell.js +22 -19
- package/build/es/table/table-foot.js +13 -10
- package/build/es/table/table-head.js +13 -10
- package/build/es/table/table-row-head.js +15 -12
- package/build/es/table/table-row.js +9 -8
- package/build/es/table/table.js +19 -16
- package/build/es/table/table.stories.js +2 -17
- package/package.json +3 -3
|
@@ -15,23 +15,26 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
15
15
|
|
|
16
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
17
|
|
|
18
|
-
const StackedTableCellHead =
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
}, children
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
18
|
+
const StackedTableCellHead = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
children,
|
|
21
|
+
className,
|
|
22
|
+
colSpan,
|
|
23
|
+
dataTest,
|
|
24
|
+
rowSpan
|
|
25
|
+
} = _ref;
|
|
26
|
+
return /*#__PURE__*/_react.default.createElement("th", {
|
|
27
|
+
colSpan: colSpan,
|
|
28
|
+
rowSpan: rowSpan,
|
|
29
|
+
"data-test": dataTest,
|
|
30
|
+
className: _style.default.dynamic([["178822310", [_uiConstants.colors.grey300]]]) + " " + (className || "")
|
|
31
|
+
}, children && /*#__PURE__*/_react.default.createElement("div", {
|
|
32
|
+
className: _style.default.dynamic([["178822310", [_uiConstants.colors.grey300]]])
|
|
33
|
+
}, children), /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
34
|
+
id: "178822310",
|
|
35
|
+
dynamic: [_uiConstants.colors.grey300]
|
|
36
|
+
}, ["th.__jsx-style-dynamic-selector{border-bottom:1px solid ".concat(_uiConstants.colors.grey300, ";padding:0 12px;}"), "div.__jsx-style-dynamic-selector{min-height:36px;}"]));
|
|
37
|
+
};
|
|
35
38
|
|
|
36
39
|
exports.StackedTableCellHead = StackedTableCellHead;
|
|
37
40
|
StackedTableCellHead.propTypes = {
|
|
@@ -17,17 +17,18 @@ var _contentWithTitle = require("./content-with-title.js");
|
|
|
17
17
|
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
19
|
|
|
20
|
-
const StackedTableCell =
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
20
|
+
const StackedTableCell = _ref => {
|
|
21
|
+
let {
|
|
22
|
+
children,
|
|
23
|
+
className,
|
|
24
|
+
colSpan,
|
|
25
|
+
column,
|
|
26
|
+
dataTest,
|
|
27
|
+
headerLabels,
|
|
28
|
+
hideTitle,
|
|
29
|
+
rowSpan,
|
|
30
|
+
title
|
|
31
|
+
} = _ref;
|
|
31
32
|
const cellTitle = title || headerLabels[column] || '';
|
|
32
33
|
const realTitle = hideTitle ? '' : cellTitle;
|
|
33
34
|
return /*#__PURE__*/_react.default.createElement("td", {
|
|
@@ -40,7 +41,7 @@ const StackedTableCell = ({
|
|
|
40
41
|
}, children), /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
41
42
|
id: "1368473511",
|
|
42
43
|
dynamic: [_uiConstants.colors.grey300]
|
|
43
|
-
}, [
|
|
44
|
+
}, ["td.__jsx-style-dynamic-selector{border-bottom:1px solid ".concat(_uiConstants.colors.grey300, ";padding:0 12px;font-size:14px;width:100%;display:block;}"), "td.__jsx-style-dynamic-selector:last-child{border-bottom:0;}"]));
|
|
44
45
|
};
|
|
45
46
|
|
|
46
47
|
exports.StackedTableCell = StackedTableCell;
|
|
@@ -13,16 +13,19 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
13
13
|
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
15
|
|
|
16
|
-
const StackedTableFoot =
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
},
|
|
16
|
+
const StackedTableFoot = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
children,
|
|
19
|
+
className,
|
|
20
|
+
dataTest
|
|
21
|
+
} = _ref;
|
|
22
|
+
return /*#__PURE__*/_react.default.createElement("tfoot", {
|
|
23
|
+
"data-test": dataTest,
|
|
24
|
+
className: "jsx-3912324960" + " " + (className || "")
|
|
25
|
+
}, children, /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
26
|
+
id: "3912324960"
|
|
27
|
+
}, ["tfoot.jsx-3912324960{display:block;margin-top:32px;}"]));
|
|
28
|
+
};
|
|
26
29
|
|
|
27
30
|
exports.StackedTableFoot = StackedTableFoot;
|
|
28
31
|
StackedTableFoot.propTypes = {
|
|
@@ -13,16 +13,19 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
13
13
|
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
15
|
|
|
16
|
-
const StackedTableHead =
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
},
|
|
16
|
+
const StackedTableHead = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
children,
|
|
19
|
+
className,
|
|
20
|
+
dataTest
|
|
21
|
+
} = _ref;
|
|
22
|
+
return /*#__PURE__*/_react.default.createElement("thead", {
|
|
23
|
+
"data-test": dataTest,
|
|
24
|
+
className: "jsx-1150407268" + " " + (className || "")
|
|
25
|
+
}, children, /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
26
|
+
id: "1150407268"
|
|
27
|
+
}, ["thead.jsx-1150407268{display:none;}"]));
|
|
28
|
+
};
|
|
26
29
|
|
|
27
30
|
exports.StackedTableHead = StackedTableHead;
|
|
28
31
|
StackedTableHead.propTypes = {
|
|
@@ -13,14 +13,17 @@ var _stackedTableRow = require("./stacked-table-row.js");
|
|
|
13
13
|
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
15
|
|
|
16
|
-
const StackedTableRowHead =
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
16
|
+
const StackedTableRowHead = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
children,
|
|
19
|
+
className,
|
|
20
|
+
dataTest
|
|
21
|
+
} = _ref;
|
|
22
|
+
return /*#__PURE__*/_react.default.createElement(_stackedTableRow.StackedTableRow, {
|
|
23
|
+
className: className,
|
|
24
|
+
dataTest: dataTest
|
|
25
|
+
}, children);
|
|
26
|
+
};
|
|
24
27
|
|
|
25
28
|
exports.StackedTableRowHead = StackedTableRowHead;
|
|
26
29
|
StackedTableRowHead.propTypes = {
|
|
@@ -21,19 +21,25 @@ var _tableContext = require("./table-context.js");
|
|
|
21
21
|
|
|
22
22
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
23
23
|
|
|
24
|
-
const StackedTableRow =
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
}
|
|
24
|
+
const StackedTableRow = _ref => {
|
|
25
|
+
let {
|
|
26
|
+
children,
|
|
27
|
+
className,
|
|
28
|
+
dataTest
|
|
29
|
+
} = _ref;
|
|
30
|
+
return /*#__PURE__*/_react.default.createElement("tr", {
|
|
31
|
+
"data-test": dataTest,
|
|
32
|
+
className: _style.default.dynamic([["2003961452", [_uiConstants.colors.grey300, _uiConstants.colors.white]]]) + " " + (className || "")
|
|
33
|
+
}, /*#__PURE__*/_react.default.createElement(_tableContext.Consumer, null, _ref2 => {
|
|
34
|
+
let {
|
|
35
|
+
headerLabels
|
|
36
|
+
} = _ref2;
|
|
37
|
+
return (0, _supplyHeaderLabelsToChildren.supplyHeaderLabelsToChildren)(headerLabels, (0, _addColNumToChildren.addColNumToChildren)(children));
|
|
38
|
+
}), /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
39
|
+
id: "2003961452",
|
|
40
|
+
dynamic: [_uiConstants.colors.grey300, _uiConstants.colors.white]
|
|
41
|
+
}, ["tr.__jsx-style-dynamic-selector{min-height:45px;display:block;border:1px solid ".concat(_uiConstants.colors.grey300, ";}"), "tr.__jsx-style-dynamic-selector:nth-child(even){background:".concat(_uiConstants.colors.white, ";}"), "thead>tr.__jsx-style-dynamic-selector,tbody>tr.__jsx-style-dynamic-selector{min-height:36px;}", "tr.__jsx-style-dynamic-selector+tr.__jsx-style-dynamic-selector{margin-top:32px;}"]));
|
|
42
|
+
};
|
|
37
43
|
|
|
38
44
|
exports.StackedTableRow = StackedTableRow;
|
|
39
45
|
StackedTableRow.propTypes = {
|
|
@@ -17,12 +17,13 @@ var _table = require("./table.js");
|
|
|
17
17
|
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
19
|
|
|
20
|
-
const StackedTable =
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
20
|
+
const StackedTable = _ref => {
|
|
21
|
+
let {
|
|
22
|
+
children,
|
|
23
|
+
className,
|
|
24
|
+
dataTest,
|
|
25
|
+
headerLabels
|
|
26
|
+
} = _ref;
|
|
26
27
|
const contextHeaderLabels = (0, _extractHeaderLabels.extractHeaderLabels)(children);
|
|
27
28
|
const context = {
|
|
28
29
|
headerLabels: headerLabels || contextHeaderLabels
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.default = exports._CustomCell = exports.MultipleHeaderRows = exports.LongTitle = exports.LargerTable = exports.HiddenLabelInCell = exports.HiddenLabel = exports.Default = exports.CustomCellTitle = exports.ColspanInHeader = exports.ColspanInBody = void 0;
|
|
7
7
|
|
|
8
8
|
var _button = require("@dhis2-ui/button");
|
|
9
9
|
|
|
@@ -27,29 +27,12 @@ var _stackedTable = require("./stacked-table.js");
|
|
|
27
27
|
|
|
28
28
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
29
29
|
|
|
30
|
-
const description =
|
|
31
|
-
Expresses tabular data such that each 'row' becomes a table section with the 'column' header in each cell. Multiple rows become multiple sections.
|
|
32
|
-
|
|
33
|
-
Compose with StackedTable child components, as seen in the examples.
|
|
34
|
-
|
|
35
|
-
\`\`\`js
|
|
36
|
-
import {
|
|
37
|
-
StackedTable,
|
|
38
|
-
StackedTableBody,
|
|
39
|
-
StackedTableCell,
|
|
40
|
-
StackedTableCellHead,
|
|
41
|
-
StackedTableFoot,
|
|
42
|
-
StackedTableHead,
|
|
43
|
-
StackedTableRow,
|
|
44
|
-
StackedTableRowHead,
|
|
45
|
-
} from 'dhis2/ui'
|
|
46
|
-
\`\`\`
|
|
47
|
-
`;
|
|
30
|
+
const description = "\nExpresses tabular data such that each 'row' becomes a table section with the 'column' header in each cell. Multiple rows become multiple sections.\n\nCompose with StackedTable child components, as seen in the examples.\n\n```js\nimport {\n StackedTable,\n StackedTableBody,\n StackedTableCell,\n StackedTableCellHead,\n StackedTableFoot,\n StackedTableHead,\n StackedTableRow,\n StackedTableRowHead,\n} from 'dhis2/ui'\n```\n";
|
|
48
31
|
|
|
49
32
|
const CustomCell = props => /*#__PURE__*/_react.default.createElement("td", null, "Received props:", /*#__PURE__*/_react.default.createElement("code", null, /*#__PURE__*/_react.default.createElement("pre", null, JSON.stringify(props, null, 2))));
|
|
50
33
|
|
|
51
34
|
var _default = {
|
|
52
|
-
title: '
|
|
35
|
+
title: 'Stacked Table',
|
|
53
36
|
component: _stackedTable.StackedTable,
|
|
54
37
|
parameters: {
|
|
55
38
|
docs: {
|
|
@@ -22,20 +22,29 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
22
22
|
|
|
23
23
|
function _extends() { _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; }; return _extends.apply(this, arguments); }
|
|
24
24
|
|
|
25
|
-
const Table =
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
}),
|
|
25
|
+
const Table = _ref => {
|
|
26
|
+
let {
|
|
27
|
+
headerLabels,
|
|
28
|
+
bodyLabels
|
|
29
|
+
} = _ref;
|
|
30
|
+
return /*#__PURE__*/_react.default.createElement(_stackedTable.StackedTable, null, /*#__PURE__*/_react.default.createElement(_stackedTableHead.StackedTableHead, null, /*#__PURE__*/_react.default.createElement(_stackedTableRowHead.StackedTableRowHead, null, headerLabels.map((_ref2, index) => {
|
|
31
|
+
let {
|
|
32
|
+
label,
|
|
33
|
+
...props
|
|
34
|
+
} = _ref2;
|
|
35
|
+
return /*#__PURE__*/_react.default.createElement(_stackedTableCellHead.StackedTableCellHead, _extends({}, props, {
|
|
36
|
+
key: label + index
|
|
37
|
+
}), label);
|
|
38
|
+
}))), /*#__PURE__*/_react.default.createElement(_stackedTableBody.StackedTableBody, null, /*#__PURE__*/_react.default.createElement(_stackedTableRow.StackedTableRow, null, bodyLabels.map(_ref3 => {
|
|
39
|
+
let {
|
|
40
|
+
label,
|
|
41
|
+
...props
|
|
42
|
+
} = _ref3;
|
|
43
|
+
return /*#__PURE__*/_react.default.createElement(_stackedTableCell.StackedTableCell, _extends({}, props, {
|
|
44
|
+
key: label
|
|
45
|
+
}), label);
|
|
46
|
+
}))));
|
|
47
|
+
};
|
|
39
48
|
|
|
40
49
|
describe('StackedTable', () => {
|
|
41
50
|
const headerLabels = [{
|
|
@@ -109,7 +118,7 @@ describe('StackedTable', () => {
|
|
|
109
118
|
const colSpan = 3;
|
|
110
119
|
const originalHeaderLabel = headerLabels[indexWithColspan];
|
|
111
120
|
const headerLabelsWithColspan = [...headerLabels.slice(0, indexWithColspan), { ...originalHeaderLabel,
|
|
112
|
-
colSpan:
|
|
121
|
+
colSpan: "".concat(colSpan)
|
|
113
122
|
}, ...headerLabels.slice(indexWithColspan + colSpan)];
|
|
114
123
|
const table = (0, _enzyme.mount)( /*#__PURE__*/_react.default.createElement(Table, {
|
|
115
124
|
headerLabels: headerLabelsWithColspan,
|
|
@@ -15,17 +15,20 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
15
15
|
|
|
16
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
17
|
|
|
18
|
-
const Table =
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
18
|
+
const Table = _ref => {
|
|
19
|
+
let {
|
|
20
|
+
children,
|
|
21
|
+
className,
|
|
22
|
+
dataTest
|
|
23
|
+
} = _ref;
|
|
24
|
+
return /*#__PURE__*/_react.default.createElement("table", {
|
|
25
|
+
"data-test": dataTest,
|
|
26
|
+
className: _style.default.dynamic([["4278890465", [_uiConstants.colors.white, _uiConstants.colors.grey900]]]) + " " + (className || "")
|
|
27
|
+
}, children, /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
28
|
+
id: "4278890465",
|
|
29
|
+
dynamic: [_uiConstants.colors.white, _uiConstants.colors.grey900]
|
|
30
|
+
}, ["table.__jsx-style-dynamic-selector{display:block;border:0;background-color:".concat(_uiConstants.colors.white, ";min-width:100%;text-align:left;border-collapse:collapse;vertical-align:top;color:").concat(_uiConstants.colors.grey900, ";}")]));
|
|
31
|
+
};
|
|
29
32
|
|
|
30
33
|
exports.Table = Table;
|
|
31
34
|
Table.propTypes = {
|
package/build/cjs/table/index.js
CHANGED
|
@@ -9,34 +9,34 @@ Object.defineProperty(exports, "Table", {
|
|
|
9
9
|
return _table.Table;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
-
Object.defineProperty(exports, "
|
|
12
|
+
Object.defineProperty(exports, "TableBody", {
|
|
13
13
|
enumerable: true,
|
|
14
14
|
get: function () {
|
|
15
|
-
return
|
|
15
|
+
return _tableBody.TableBody;
|
|
16
16
|
}
|
|
17
17
|
});
|
|
18
|
-
Object.defineProperty(exports, "
|
|
18
|
+
Object.defineProperty(exports, "TableCell", {
|
|
19
19
|
enumerable: true,
|
|
20
20
|
get: function () {
|
|
21
|
-
return
|
|
21
|
+
return _tableCell.TableCell;
|
|
22
22
|
}
|
|
23
23
|
});
|
|
24
|
-
Object.defineProperty(exports, "
|
|
24
|
+
Object.defineProperty(exports, "TableCellHead", {
|
|
25
25
|
enumerable: true,
|
|
26
26
|
get: function () {
|
|
27
|
-
return
|
|
27
|
+
return _tableCellHead.TableCellHead;
|
|
28
28
|
}
|
|
29
29
|
});
|
|
30
|
-
Object.defineProperty(exports, "
|
|
30
|
+
Object.defineProperty(exports, "TableFoot", {
|
|
31
31
|
enumerable: true,
|
|
32
32
|
get: function () {
|
|
33
|
-
return
|
|
33
|
+
return _tableFoot.TableFoot;
|
|
34
34
|
}
|
|
35
35
|
});
|
|
36
|
-
Object.defineProperty(exports, "
|
|
36
|
+
Object.defineProperty(exports, "TableHead", {
|
|
37
37
|
enumerable: true,
|
|
38
38
|
get: function () {
|
|
39
|
-
return
|
|
39
|
+
return _tableHead.TableHead;
|
|
40
40
|
}
|
|
41
41
|
});
|
|
42
42
|
Object.defineProperty(exports, "TableRow", {
|
|
@@ -11,16 +11,19 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
11
11
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
13
|
|
|
14
|
-
const TableBody =
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
"
|
|
22
|
-
|
|
23
|
-
|
|
14
|
+
const TableBody = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
children,
|
|
17
|
+
className,
|
|
18
|
+
dataTest,
|
|
19
|
+
role
|
|
20
|
+
} = _ref;
|
|
21
|
+
return /*#__PURE__*/_react.default.createElement("tbody", {
|
|
22
|
+
className: className,
|
|
23
|
+
"data-test": dataTest,
|
|
24
|
+
role: role
|
|
25
|
+
}, children);
|
|
26
|
+
};
|
|
24
27
|
|
|
25
28
|
exports.TableBody = TableBody;
|
|
26
29
|
TableBody.defaultProps = {
|
|
@@ -18,25 +18,28 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
18
18
|
const tableCellHeadStyles = ["th.jsx-1796049005{border-bottom:1px solid #e8edf2;font-size:14px;line-height:18px;padding:13px 12px;height:45px;}", ".dense.jsx-1796049005{padding:9px 12px;height:36px;}"];
|
|
19
19
|
tableCellHeadStyles.__hash = "1796049005";
|
|
20
20
|
|
|
21
|
-
const TableCellHead =
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
},
|
|
21
|
+
const TableCellHead = _ref => {
|
|
22
|
+
let {
|
|
23
|
+
role,
|
|
24
|
+
colSpan,
|
|
25
|
+
rowSpan,
|
|
26
|
+
dense,
|
|
27
|
+
children,
|
|
28
|
+
className,
|
|
29
|
+
dataTest
|
|
30
|
+
} = _ref;
|
|
31
|
+
return /*#__PURE__*/_react.default.createElement("th", {
|
|
32
|
+
colSpan: colSpan,
|
|
33
|
+
rowSpan: rowSpan,
|
|
34
|
+
"data-test": dataTest,
|
|
35
|
+
role: role,
|
|
36
|
+
className: "jsx-".concat(tableCellHeadStyles.__hash) + " " + ((0, _classnames.default)({
|
|
37
|
+
dense
|
|
38
|
+
}, className) || "")
|
|
39
|
+
}, children, /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
40
|
+
id: tableCellHeadStyles.__hash
|
|
41
|
+
}, tableCellHeadStyles));
|
|
42
|
+
};
|
|
40
43
|
|
|
41
44
|
exports.TableCellHead = TableCellHead;
|
|
42
45
|
TableCellHead.defaultProps = {
|
|
@@ -18,25 +18,28 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
18
18
|
const tableCellStyles = ["td.jsx-996330601{border-bottom:1px solid #e8edf2;font-size:14px;line-height:18px;padding:13px 12px;height:45px;}", ".dense.jsx-996330601{padding:9px 12px;height:36px;}"];
|
|
19
19
|
tableCellStyles.__hash = "996330601";
|
|
20
20
|
|
|
21
|
-
const TableCell =
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
},
|
|
21
|
+
const TableCell = _ref => {
|
|
22
|
+
let {
|
|
23
|
+
role,
|
|
24
|
+
className,
|
|
25
|
+
children,
|
|
26
|
+
colSpan,
|
|
27
|
+
rowSpan,
|
|
28
|
+
dense,
|
|
29
|
+
dataTest
|
|
30
|
+
} = _ref;
|
|
31
|
+
return /*#__PURE__*/_react.default.createElement("td", {
|
|
32
|
+
colSpan: colSpan,
|
|
33
|
+
rowSpan: rowSpan,
|
|
34
|
+
"data-test": dataTest,
|
|
35
|
+
role: role,
|
|
36
|
+
className: "jsx-".concat(tableCellStyles.__hash) + " " + ((0, _classnames.default)({
|
|
37
|
+
dense
|
|
38
|
+
}, className) || "")
|
|
39
|
+
}, children, /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
40
|
+
id: tableCellStyles.__hash
|
|
41
|
+
}, tableCellStyles));
|
|
42
|
+
};
|
|
40
43
|
|
|
41
44
|
exports.TableCell = TableCell;
|
|
42
45
|
TableCell.defaultProps = {
|
|
@@ -11,16 +11,19 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
11
11
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
13
|
|
|
14
|
-
const TableFoot =
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
"
|
|
22
|
-
|
|
23
|
-
|
|
14
|
+
const TableFoot = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
children,
|
|
17
|
+
className,
|
|
18
|
+
dataTest,
|
|
19
|
+
role
|
|
20
|
+
} = _ref;
|
|
21
|
+
return /*#__PURE__*/_react.default.createElement("tfoot", {
|
|
22
|
+
className: className,
|
|
23
|
+
"data-test": dataTest,
|
|
24
|
+
role: role
|
|
25
|
+
}, children);
|
|
26
|
+
};
|
|
24
27
|
|
|
25
28
|
exports.TableFoot = TableFoot;
|
|
26
29
|
TableFoot.defaultProps = {
|
|
@@ -11,16 +11,19 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
11
11
|
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
13
|
|
|
14
|
-
const TableHead =
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
"
|
|
22
|
-
|
|
23
|
-
|
|
14
|
+
const TableHead = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
children,
|
|
17
|
+
className,
|
|
18
|
+
dataTest,
|
|
19
|
+
role
|
|
20
|
+
} = _ref;
|
|
21
|
+
return /*#__PURE__*/_react.default.createElement("thead", {
|
|
22
|
+
className: className,
|
|
23
|
+
"data-test": dataTest,
|
|
24
|
+
role: role
|
|
25
|
+
}, children);
|
|
26
|
+
};
|
|
24
27
|
|
|
25
28
|
exports.TableHead = TableHead;
|
|
26
29
|
TableHead.defaultProps = {
|