@dhis2-ui/table 9.12.0-alpha.3 → 9.12.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/build/cjs/data-table/data-table-cell.js +4 -10
- package/build/cjs/data-table/data-table-column-header/data-table-column-header.js +1 -4
- package/build/cjs/data-table/data-table-row/data-table-row.js +1 -4
- package/build/cjs/data-table/data-table.js +3 -8
- package/build/cjs/data-table/table-elements/table-body.js +1 -4
- package/build/cjs/data-table/table-elements/table-data-cell/table-data-cell.js +4 -10
- package/build/cjs/data-table/table-elements/table-foot.js +1 -4
- package/build/cjs/data-table/table-elements/table-head.js +0 -3
- package/build/cjs/data-table/table-elements/table-header-cell/table-header-cell.js +5 -12
- package/build/cjs/data-table/table-elements/table-header-cell-action.js +1 -4
- package/build/cjs/data-table/table-elements/table-row.js +1 -4
- package/build/cjs/data-table/table-elements/table-scroll-box.js +3 -8
- package/build/cjs/data-table/table-elements/table-toolbar.js +2 -6
- package/build/cjs/data-table/table-elements/table.js +3 -8
- package/build/cjs/stacked-table/stacked-table-body.js +1 -4
- package/build/cjs/stacked-table/stacked-table-cell-head.js +2 -6
- package/build/cjs/stacked-table/stacked-table-cell.js +3 -6
- package/build/cjs/stacked-table/stacked-table-foot.js +1 -4
- package/build/cjs/stacked-table/stacked-table-head.js +1 -4
- package/build/cjs/stacked-table/stacked-table-row-head.js +1 -4
- package/build/cjs/stacked-table/stacked-table-row.js +1 -4
- package/build/cjs/stacked-table/stacked-table.js +1 -4
- package/build/cjs/table/table-body.js +1 -4
- package/build/cjs/table/table-cell-head.js +1 -4
- package/build/cjs/table/table-cell.js +1 -4
- package/build/cjs/table/table-foot.js +1 -4
- package/build/cjs/table/table-head.js +1 -4
- package/build/cjs/table/table-row-head.js +1 -4
- package/build/cjs/table/table-row.js +1 -4
- package/build/cjs/table/table.js +1 -4
- package/build/es/data-table/data-table-cell.js +4 -10
- package/build/es/data-table/data-table-column-header/data-table-column-header.js +1 -4
- package/build/es/data-table/data-table-row/data-table-row.js +1 -4
- package/build/es/data-table/data-table.js +3 -8
- package/build/es/data-table/table-elements/table-body.js +1 -4
- package/build/es/data-table/table-elements/table-data-cell/table-data-cell.js +4 -10
- package/build/es/data-table/table-elements/table-foot.js +1 -4
- package/build/es/data-table/table-elements/table-head.js +0 -3
- package/build/es/data-table/table-elements/table-header-cell/table-header-cell.js +5 -12
- package/build/es/data-table/table-elements/table-header-cell-action.js +1 -4
- package/build/es/data-table/table-elements/table-row.js +1 -4
- package/build/es/data-table/table-elements/table-scroll-box.js +3 -8
- package/build/es/data-table/table-elements/table-toolbar.js +2 -6
- package/build/es/data-table/table-elements/table.js +3 -8
- package/build/es/stacked-table/stacked-table-body.js +1 -4
- package/build/es/stacked-table/stacked-table-cell-head.js +2 -6
- package/build/es/stacked-table/stacked-table-cell.js +3 -6
- package/build/es/stacked-table/stacked-table-foot.js +1 -4
- package/build/es/stacked-table/stacked-table-head.js +1 -4
- package/build/es/stacked-table/stacked-table-row-head.js +1 -4
- package/build/es/stacked-table/stacked-table-row.js +1 -4
- package/build/es/stacked-table/stacked-table.js +1 -4
- package/build/es/table/table-body.js +1 -4
- package/build/es/table/table-cell-head.js +1 -4
- package/build/es/table/table-cell.js +1 -4
- package/build/es/table/table-foot.js +1 -4
- package/build/es/table/table-head.js +1 -4
- package/build/es/table/table-row-head.js +1 -4
- package/build/es/table/table-row.js +1 -4
- package/build/es/table/table.js +1 -4
- package/package.json +3 -3
package/build/cjs/table/table.js
CHANGED
|
@@ -16,7 +16,7 @@ const Table = _ref => {
|
|
|
16
16
|
role,
|
|
17
17
|
children,
|
|
18
18
|
className,
|
|
19
|
-
dataTest,
|
|
19
|
+
dataTest = 'dhis2-uicore-table',
|
|
20
20
|
suppressZebraStriping
|
|
21
21
|
} = _ref;
|
|
22
22
|
return /*#__PURE__*/_react.default.createElement(_tableContext.Provider, {
|
|
@@ -32,9 +32,6 @@ const Table = _ref => {
|
|
|
32
32
|
}, tableStyles)));
|
|
33
33
|
};
|
|
34
34
|
exports.Table = Table;
|
|
35
|
-
Table.defaultProps = {
|
|
36
|
-
dataTest: 'dhis2-uicore-table'
|
|
37
|
-
};
|
|
38
35
|
Table.propTypes = {
|
|
39
36
|
/** Should be `<TableHead>`, `<TableBody>`, and `<TableFoot>` components */
|
|
40
37
|
children: _propTypes.default.node,
|
|
@@ -6,17 +6,17 @@ import { TableDataCell, TableHeaderCell } from './table-elements/index.js';
|
|
|
6
6
|
export const DataTableCell = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
7
7
|
let {
|
|
8
8
|
active,
|
|
9
|
-
align,
|
|
9
|
+
align = 'left',
|
|
10
10
|
backgroundColor,
|
|
11
11
|
bordered,
|
|
12
12
|
children,
|
|
13
13
|
className,
|
|
14
14
|
colSpan,
|
|
15
|
-
dataTest,
|
|
15
|
+
dataTest = 'dhis2-uicore-datatablecell',
|
|
16
16
|
error,
|
|
17
17
|
fixed,
|
|
18
18
|
large,
|
|
19
|
-
left,
|
|
19
|
+
left = 'auto',
|
|
20
20
|
muted,
|
|
21
21
|
rowSpan,
|
|
22
22
|
role,
|
|
@@ -24,7 +24,7 @@ export const DataTableCell = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
24
24
|
staticStyle,
|
|
25
25
|
tag,
|
|
26
26
|
valid,
|
|
27
|
-
width,
|
|
27
|
+
width = 'auto',
|
|
28
28
|
onClick,
|
|
29
29
|
...props
|
|
30
30
|
} = _ref;
|
|
@@ -53,12 +53,6 @@ export const DataTableCell = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
53
53
|
}), children);
|
|
54
54
|
});
|
|
55
55
|
DataTableCell.displayName = 'DataTableCell';
|
|
56
|
-
DataTableCell.defaultProps = {
|
|
57
|
-
align: 'left',
|
|
58
|
-
dataTest: 'dhis2-uicore-datatablecell',
|
|
59
|
-
left: 'auto',
|
|
60
|
-
width: 'auto'
|
|
61
|
-
};
|
|
62
56
|
const stylePropType = mutuallyExclusive(['valid', 'error', 'muted'], PropTypes.bool);
|
|
63
57
|
const requiredIfFixedPropType = requiredIf(props => props.fixed, PropTypes.string);
|
|
64
58
|
DataTableCell.propTypes = {
|
|
@@ -18,7 +18,7 @@ export const DataTableColumnHeader = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
18
18
|
children,
|
|
19
19
|
className,
|
|
20
20
|
colSpan,
|
|
21
|
-
dataTest,
|
|
21
|
+
dataTest = 'dhis2-uicore-datatablecellhead',
|
|
22
22
|
filter,
|
|
23
23
|
fixed,
|
|
24
24
|
large,
|
|
@@ -73,9 +73,6 @@ export const DataTableColumnHeader = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
73
73
|
}, [`.label.jsx-3463223249{-webkit-box-pack:${flexboxAlignLookup[align]};-webkit-justify-content:${flexboxAlignLookup[align]};-ms-flex-pack:${flexboxAlignLookup[align]};justify-content:${flexboxAlignLookup[align]};}`]));
|
|
74
74
|
});
|
|
75
75
|
DataTableColumnHeader.displayName = 'DataTableColumnHeader';
|
|
76
|
-
DataTableColumnHeader.defaultProps = {
|
|
77
|
-
dataTest: 'dhis2-uicore-datatablecellhead'
|
|
78
|
-
};
|
|
79
76
|
DataTableColumnHeader.propTypes = {
|
|
80
77
|
align: PropTypes.oneOf(['left', 'center', 'right']),
|
|
81
78
|
children: PropTypes.node,
|
|
@@ -12,7 +12,7 @@ export const DataTableRow = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
12
12
|
let {
|
|
13
13
|
children,
|
|
14
14
|
className,
|
|
15
|
-
dataTest,
|
|
15
|
+
dataTest = 'dhis2-uicore-datatablerow',
|
|
16
16
|
expandableContent,
|
|
17
17
|
expanded,
|
|
18
18
|
selected,
|
|
@@ -49,9 +49,6 @@ export const DataTableRow = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
49
49
|
}, expandableContent));
|
|
50
50
|
});
|
|
51
51
|
DataTableRow.displayName = 'DataTableRow';
|
|
52
|
-
DataTableRow.defaultProps = {
|
|
53
|
-
dataTest: 'dhis2-uicore-datatablerow'
|
|
54
|
-
};
|
|
55
52
|
DataTableRow.propTypes = {
|
|
56
53
|
/** Should be `<DataTableCell>` or `<DataTableCellHead>` components */
|
|
57
54
|
children: PropTypes.node,
|
|
@@ -6,12 +6,12 @@ export const DataTable = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
6
6
|
let {
|
|
7
7
|
children,
|
|
8
8
|
className,
|
|
9
|
-
dataTest,
|
|
10
|
-
layout,
|
|
9
|
+
dataTest = 'dhis2-uicore-datatable',
|
|
10
|
+
layout = 'auto',
|
|
11
11
|
role,
|
|
12
12
|
scrollHeight,
|
|
13
13
|
scrollWidth,
|
|
14
|
-
width
|
|
14
|
+
width = '100%'
|
|
15
15
|
} = _ref;
|
|
16
16
|
const scrollable = !!(scrollHeight || scrollWidth);
|
|
17
17
|
const table = /*#__PURE__*/React.createElement(Table, {
|
|
@@ -31,11 +31,6 @@ export const DataTable = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
31
31
|
}, table);
|
|
32
32
|
});
|
|
33
33
|
DataTable.displayName = 'DataTable';
|
|
34
|
-
DataTable.defaultProps = {
|
|
35
|
-
dataTest: 'dhis2-uicore-datatable',
|
|
36
|
-
width: '100%',
|
|
37
|
-
layout: 'auto'
|
|
38
|
-
};
|
|
39
34
|
DataTable.propTypes = {
|
|
40
35
|
/**
|
|
41
36
|
* Should be `<DataTableHead>`, `<DataTableBody>`, and `<DataTableFoot>` components
|
|
@@ -8,7 +8,7 @@ export const TableBody = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
8
8
|
let {
|
|
9
9
|
children,
|
|
10
10
|
className,
|
|
11
|
-
dataTest,
|
|
11
|
+
dataTest = 'dhis2-uicore-tablebody',
|
|
12
12
|
role,
|
|
13
13
|
loading,
|
|
14
14
|
...props
|
|
@@ -26,9 +26,6 @@ export const TableBody = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
26
26
|
}, ["tbody.__jsx-style-dynamic-selector{position:relative;}", ".loading.__jsx-style-dynamic-selector:before{content:'';position:absolute;top:0;bottom:0;inset-inline-start:0;inset-inline-end:0;background-color:rgba(255,255,255,0.8);}", `.loading.__jsx-style-dynamic-selector:after{content:'';position:absolute;top:calc(50% - 24px);inset-inline-start:calc(50% - 24px);width:48px;height:48px;border:6px solid rgba(110,122,138,0.15);border-bottom-color:${colors.blue600};border-radius:50%;-webkit-animation:rotation-__jsx-style-dynamic-selector 1s linear infinite;animation:rotation-__jsx-style-dynamic-selector 1s linear infinite;}`, "@-webkit-keyframes rotation-__jsx-style-dynamic-selector{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}", "@keyframes rotation-__jsx-style-dynamic-selector{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}"]));
|
|
27
27
|
});
|
|
28
28
|
TableBody.displayName = 'TableBody';
|
|
29
|
-
TableBody.defaultProps = {
|
|
30
|
-
dataTest: 'dhis2-uicore-tablebody'
|
|
31
|
-
};
|
|
32
29
|
TableBody.propTypes = {
|
|
33
30
|
/** Should be `<TableRow>` components */
|
|
34
31
|
children: PropTypes.node,
|
|
@@ -15,23 +15,23 @@ export const TableDataCell = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
15
15
|
var _rtlCorrespondingAlig;
|
|
16
16
|
let {
|
|
17
17
|
active,
|
|
18
|
-
align,
|
|
18
|
+
align = 'left',
|
|
19
19
|
backgroundColor,
|
|
20
20
|
bordered,
|
|
21
21
|
children,
|
|
22
22
|
className,
|
|
23
23
|
colSpan,
|
|
24
|
-
dataTest,
|
|
24
|
+
dataTest = 'dhis2-uicore-tabledatacel',
|
|
25
25
|
error,
|
|
26
26
|
large,
|
|
27
|
-
left,
|
|
27
|
+
left = 'auto',
|
|
28
28
|
muted,
|
|
29
29
|
role,
|
|
30
30
|
rowSpan,
|
|
31
31
|
scope,
|
|
32
32
|
staticStyle,
|
|
33
33
|
valid,
|
|
34
|
-
width,
|
|
34
|
+
width = 'auto',
|
|
35
35
|
onClick,
|
|
36
36
|
...props
|
|
37
37
|
} = _ref;
|
|
@@ -61,12 +61,6 @@ export const TableDataCell = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
61
61
|
}, [`td.__jsx-style-dynamic-selector{inset-inline-start:${left};text-align:${align};width:${width};background-color:${backgroundColor || colors.white};}`, `.__jsx-style-dynamic-selector:dir(rtl){text-align:${rtlAlign};}`, `tr.selected>td.__jsx-style-dynamic-selector{background-color:${backgroundColor || colors.teal100};}`, `tr:hover>td.__jsx-style-dynamic-selector:not(.staticStyle){background-color:${backgroundColor || colors.grey100};}`, `tr:active>td.__jsx-style-dynamic-selector:not(.staticStyle){background-color:${backgroundColor || colors.grey200};}`, `tr.selected:hover>td.__jsx-style-dynamic-selector:not(.staticStyle){background-color:${backgroundColor || '#cdeae8'};}`]));
|
|
62
62
|
});
|
|
63
63
|
TableDataCell.displayName = 'TableDataCell';
|
|
64
|
-
TableDataCell.defaultProps = {
|
|
65
|
-
align: 'left',
|
|
66
|
-
dataTest: 'dhis2-uicore-tabledatacel',
|
|
67
|
-
left: 'auto',
|
|
68
|
-
width: 'auto'
|
|
69
|
-
};
|
|
70
64
|
const stylePropType = mutuallyExclusive(['valid', 'error', 'muted'], PropTypes.bool);
|
|
71
65
|
TableDataCell.propTypes = {
|
|
72
66
|
/** To toggle border color, for example for editing */
|
|
@@ -5,7 +5,7 @@ export const TableFoot = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
5
5
|
let {
|
|
6
6
|
children,
|
|
7
7
|
className,
|
|
8
|
-
dataTest,
|
|
8
|
+
dataTest = 'dhis2-uicore-tablefoot',
|
|
9
9
|
role,
|
|
10
10
|
...props
|
|
11
11
|
} = _ref;
|
|
@@ -17,9 +17,6 @@ export const TableFoot = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
17
17
|
}), children);
|
|
18
18
|
});
|
|
19
19
|
TableFoot.displayName = 'TableFoot';
|
|
20
|
-
TableFoot.defaultProps = {
|
|
21
|
-
dataTest: 'dhis2-uicore-tablefoot'
|
|
22
|
-
};
|
|
23
20
|
TableFoot.propTypes = {
|
|
24
21
|
/** Should be `<TableRow>` components */
|
|
25
22
|
children: PropTypes.node,
|
|
@@ -17,9 +17,6 @@ export const TableHead = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
17
17
|
}), children);
|
|
18
18
|
});
|
|
19
19
|
TableHead.displayName = 'TableHead';
|
|
20
|
-
TableHead.defaultProps = {
|
|
21
|
-
dataTest: 'dhis2-uicore-tablehead'
|
|
22
|
-
};
|
|
23
20
|
TableHead.propTypes = {
|
|
24
21
|
/** Should be `<TableRowHead>` components */
|
|
25
22
|
children: PropTypes.node,
|
|
@@ -10,25 +10,25 @@ const AUTO = 'auto';
|
|
|
10
10
|
export const TableHeaderCell = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
11
11
|
let {
|
|
12
12
|
active,
|
|
13
|
-
align,
|
|
13
|
+
align = 'left',
|
|
14
14
|
backgroundColor,
|
|
15
15
|
bordered,
|
|
16
16
|
children,
|
|
17
17
|
className,
|
|
18
18
|
colSpan,
|
|
19
|
-
dataTest,
|
|
19
|
+
dataTest = 'dhis2-uicore-tablecell',
|
|
20
20
|
error,
|
|
21
21
|
fixed,
|
|
22
22
|
large,
|
|
23
|
-
left,
|
|
23
|
+
left = AUTO,
|
|
24
24
|
muted,
|
|
25
25
|
rowSpan,
|
|
26
26
|
role,
|
|
27
27
|
scope,
|
|
28
28
|
staticStyle,
|
|
29
|
-
top,
|
|
29
|
+
top = AUTO,
|
|
30
30
|
valid,
|
|
31
|
-
width,
|
|
31
|
+
width = AUTO,
|
|
32
32
|
onClick,
|
|
33
33
|
...props
|
|
34
34
|
} = _ref;
|
|
@@ -59,13 +59,6 @@ export const TableHeaderCell = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
59
59
|
}, [`th.__jsx-style-dynamic-selector{inset-inline-start:${left};top:${top};text-align:${align};width:${width};background-color:${backgroundColor || colors.grey200};}`, `thead th.fixedHorizontally.__jsx-style-dynamic-selector{background-color:${backgroundColor || colors.grey300};}`, `tbody>tr:hover>th.__jsx-style-dynamic-selector:not(.staticStyle),tfoot>tr:hover>th.__jsx-style-dynamic-selector:not(.staticStyle){background-color:${backgroundColor || colors.grey300};}`, `tbody>tr:active>th.__jsx-style-dynamic-selector:not(.staticStyle){background-color:${backgroundColor || colors.grey200};}`]));
|
|
60
60
|
});
|
|
61
61
|
TableHeaderCell.displayName = 'TableHeaderCell';
|
|
62
|
-
TableHeaderCell.defaultProps = {
|
|
63
|
-
align: 'left',
|
|
64
|
-
dataTest: 'dhis2-uicore-tablecell',
|
|
65
|
-
left: AUTO,
|
|
66
|
-
width: AUTO,
|
|
67
|
-
top: AUTO
|
|
68
|
-
};
|
|
69
62
|
const stylePropType = mutuallyExclusive(['valid', 'error', 'muted'], PropTypes.bool);
|
|
70
63
|
TableHeaderCell.propTypes = {
|
|
71
64
|
/** To toggle border color, for example for editing */
|
|
@@ -8,7 +8,7 @@ export const TableHeaderCellAction = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
8
8
|
onClick,
|
|
9
9
|
children,
|
|
10
10
|
className,
|
|
11
|
-
dataTest,
|
|
11
|
+
dataTest = 'dhis2-uicore-tableheadercellaction',
|
|
12
12
|
title,
|
|
13
13
|
...props
|
|
14
14
|
} = _ref;
|
|
@@ -24,9 +24,6 @@ export const TableHeaderCellAction = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
24
24
|
}, ["button.__jsx-style-dynamic-selector{border:none;padding:0;background:transparent;width:24px;height:24px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;cursor:pointer;border-radius:4px;margin-inline-start:2px;}", `button.__jsx-style-dynamic-selector:hover,button.__jsx-style-dynamic-selector:focus-visible{background:${colors.grey400};}`, "button.__jsx-style-dynamic-selector:active,button.__jsx-style-dynamic-selector:focus{outline:none;}"]));
|
|
25
25
|
});
|
|
26
26
|
TableHeaderCellAction.displayName = 'TableHeaderCellAction';
|
|
27
|
-
TableHeaderCellAction.defaultProps = {
|
|
28
|
-
dataTest: 'dhis2-uicore-tableheadercellaction'
|
|
29
|
-
};
|
|
30
27
|
TableHeaderCellAction.propTypes = {
|
|
31
28
|
children: PropTypes.node,
|
|
32
29
|
className: PropTypes.string,
|
|
@@ -7,7 +7,7 @@ export const TableRow = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
7
7
|
let {
|
|
8
8
|
children,
|
|
9
9
|
className,
|
|
10
|
-
dataTest,
|
|
10
|
+
dataTest = 'dhis2-uicore-tablerow',
|
|
11
11
|
draggable,
|
|
12
12
|
role,
|
|
13
13
|
selected,
|
|
@@ -26,9 +26,6 @@ export const TableRow = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
26
26
|
}, ["tbody>tr.draggable.jsx-1820444258,tfoot>tr.draggable.jsx-1820444258{cursor:move;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}"]));
|
|
27
27
|
});
|
|
28
28
|
TableRow.displayName = 'TableRow';
|
|
29
|
-
TableRow.defaultProps = {
|
|
30
|
-
dataTest: 'dhis2-uicore-tablerow'
|
|
31
|
-
};
|
|
32
29
|
TableRow.propTypes = {
|
|
33
30
|
/** Should be `<TableDataCell>` or `<TableDataCellHead>` components */
|
|
34
31
|
children: PropTypes.node,
|
|
@@ -7,9 +7,9 @@ export const TableScrollBox = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
7
7
|
let {
|
|
8
8
|
children,
|
|
9
9
|
className,
|
|
10
|
-
dataTest,
|
|
11
|
-
maxHeight,
|
|
12
|
-
maxWidth,
|
|
10
|
+
dataTest = 'dhis2-uicore-tablescrollbox',
|
|
11
|
+
maxHeight = 'auto',
|
|
12
|
+
maxWidth = 'auto',
|
|
13
13
|
...props
|
|
14
14
|
} = _ref;
|
|
15
15
|
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
@@ -22,11 +22,6 @@ export const TableScrollBox = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
22
22
|
}, [`div.__jsx-style-dynamic-selector{border:1px solid ${colors.grey300};border-top:none;box-sizing:border-box;max-height:${maxHeight};max-width:${maxWidth};overflow:auto;}`]));
|
|
23
23
|
});
|
|
24
24
|
TableScrollBox.displayName = 'TableScrollBox';
|
|
25
|
-
TableScrollBox.defaultProps = {
|
|
26
|
-
dataTest: 'dhis2-uicore-tablescrollbox',
|
|
27
|
-
maxHeight: 'auto',
|
|
28
|
-
maxWidth: 'auto'
|
|
29
|
-
};
|
|
30
25
|
TableScrollBox.propTypes = {
|
|
31
26
|
children: PropTypes.node,
|
|
32
27
|
className: PropTypes.string,
|
|
@@ -8,8 +8,8 @@ export const TableToolbar = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
8
8
|
let {
|
|
9
9
|
children,
|
|
10
10
|
className,
|
|
11
|
-
dataTest,
|
|
12
|
-
position,
|
|
11
|
+
dataTest = 'dhis2-uicore-tabletoolbar',
|
|
12
|
+
position = 'top',
|
|
13
13
|
...props
|
|
14
14
|
} = _ref;
|
|
15
15
|
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
@@ -22,10 +22,6 @@ export const TableToolbar = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
22
22
|
}, [`div.__jsx-style-dynamic-selector{width:100%;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;border:1px solid ${colors.grey300};padding:${spacers.dp12};}`, "div.top.__jsx-style-dynamic-selector{border-bottom:none;}", "div.bottom.__jsx-style-dynamic-selector{border-top:none;}"]));
|
|
23
23
|
});
|
|
24
24
|
TableToolbar.displayName = 'TableToolbar';
|
|
25
|
-
TableToolbar.defaultProps = {
|
|
26
|
-
dataTest: 'dhis2-uicore-tabletoolbar',
|
|
27
|
-
position: 'top'
|
|
28
|
-
};
|
|
29
25
|
TableToolbar.propTypes = {
|
|
30
26
|
children: PropTypes.node,
|
|
31
27
|
className: PropTypes.string,
|
|
@@ -8,11 +8,11 @@ export const Table = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
8
8
|
let {
|
|
9
9
|
children,
|
|
10
10
|
className,
|
|
11
|
-
dataTest,
|
|
12
|
-
layout,
|
|
11
|
+
dataTest = 'dhis2-uicore-table',
|
|
12
|
+
layout = 'auto',
|
|
13
13
|
role,
|
|
14
14
|
borderless,
|
|
15
|
-
width,
|
|
15
|
+
width = '100%',
|
|
16
16
|
...props
|
|
17
17
|
} = _ref;
|
|
18
18
|
return /*#__PURE__*/React.createElement("table", _extends({}, props, {
|
|
@@ -28,11 +28,6 @@ export const Table = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
28
28
|
}, [`table.__jsx-style-dynamic-selector{table-layout:${layout};border-collapse:separate;border-spacing:0;width:${width};box-sizing:border-box;border:1px solid ${colors.grey300};}`, "table.borderless.__jsx-style-dynamic-selector{border:none;}"]));
|
|
29
29
|
});
|
|
30
30
|
Table.displayName = 'Table';
|
|
31
|
-
Table.defaultProps = {
|
|
32
|
-
dataTest: 'dhis2-uicore-table',
|
|
33
|
-
width: '100%',
|
|
34
|
-
layout: 'auto'
|
|
35
|
-
};
|
|
36
31
|
Table.propTypes = {
|
|
37
32
|
/**
|
|
38
33
|
* Removes border from the table
|
|
@@ -5,7 +5,7 @@ export const StackedTableBody = _ref => {
|
|
|
5
5
|
let {
|
|
6
6
|
children,
|
|
7
7
|
className,
|
|
8
|
-
dataTest
|
|
8
|
+
dataTest = 'dhis2-uicore-stackedtablebody'
|
|
9
9
|
} = _ref;
|
|
10
10
|
return /*#__PURE__*/React.createElement("tbody", {
|
|
11
11
|
"data-tset": dataTest,
|
|
@@ -18,7 +18,4 @@ StackedTableBody.propTypes = {
|
|
|
18
18
|
children: PropTypes.node,
|
|
19
19
|
className: PropTypes.string,
|
|
20
20
|
dataTest: PropTypes.string
|
|
21
|
-
};
|
|
22
|
-
StackedTableBody.defaultProps = {
|
|
23
|
-
dataTest: 'dhis2-uicore-stackedtablebody'
|
|
24
21
|
};
|
|
@@ -4,10 +4,10 @@ import PropTypes from 'prop-types';
|
|
|
4
4
|
import React from 'react';
|
|
5
5
|
export const StackedTableCellHead = _ref => {
|
|
6
6
|
let {
|
|
7
|
-
children,
|
|
7
|
+
children = '',
|
|
8
8
|
className,
|
|
9
9
|
colSpan,
|
|
10
|
-
dataTest,
|
|
10
|
+
dataTest = 'dhis2-uicore-stackedtablecellhead',
|
|
11
11
|
rowSpan
|
|
12
12
|
} = _ref;
|
|
13
13
|
return /*#__PURE__*/React.createElement("th", {
|
|
@@ -28,8 +28,4 @@ StackedTableCellHead.propTypes = {
|
|
|
28
28
|
colSpan: PropTypes.string,
|
|
29
29
|
dataTest: PropTypes.string,
|
|
30
30
|
rowSpan: PropTypes.string
|
|
31
|
-
};
|
|
32
|
-
StackedTableCellHead.defaultProps = {
|
|
33
|
-
children: '',
|
|
34
|
-
dataTest: 'dhis2-uicore-stackedtablecellhead'
|
|
35
31
|
};
|
|
@@ -3,14 +3,15 @@ import { colors } from '@dhis2/ui-constants';
|
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import { ContentWithTitle } from './content-with-title.js';
|
|
6
|
+
const defaultHeaderLabels = [];
|
|
6
7
|
export const StackedTableCell = _ref => {
|
|
7
8
|
let {
|
|
8
9
|
children,
|
|
9
10
|
className,
|
|
10
11
|
colSpan,
|
|
11
12
|
column,
|
|
12
|
-
dataTest,
|
|
13
|
-
headerLabels,
|
|
13
|
+
dataTest = 'dhis2-uicore-stackedtablecell',
|
|
14
|
+
headerLabels = defaultHeaderLabels,
|
|
14
15
|
hideTitle,
|
|
15
16
|
rowSpan,
|
|
16
17
|
title
|
|
@@ -39,8 +40,4 @@ StackedTableCell.propTypes = {
|
|
|
39
40
|
hideTitle: PropTypes.bool,
|
|
40
41
|
rowSpan: PropTypes.string,
|
|
41
42
|
title: PropTypes.string
|
|
42
|
-
};
|
|
43
|
-
StackedTableCell.defaultProps = {
|
|
44
|
-
dataTest: 'dhis2-uicore-stackedtablecell',
|
|
45
|
-
headerLabels: []
|
|
46
43
|
};
|
|
@@ -5,7 +5,7 @@ export const StackedTableFoot = _ref => {
|
|
|
5
5
|
let {
|
|
6
6
|
children,
|
|
7
7
|
className,
|
|
8
|
-
dataTest
|
|
8
|
+
dataTest = 'dhis2-uicore-stackedtablefoot'
|
|
9
9
|
} = _ref;
|
|
10
10
|
return /*#__PURE__*/React.createElement("tfoot", {
|
|
11
11
|
"data-test": dataTest,
|
|
@@ -18,7 +18,4 @@ StackedTableFoot.propTypes = {
|
|
|
18
18
|
children: PropTypes.node,
|
|
19
19
|
className: PropTypes.string,
|
|
20
20
|
dataTest: PropTypes.string
|
|
21
|
-
};
|
|
22
|
-
StackedTableFoot.defaultProps = {
|
|
23
|
-
dataTest: 'dhis2-uicore-stackedtablefoot'
|
|
24
21
|
};
|
|
@@ -5,7 +5,7 @@ export const StackedTableHead = _ref => {
|
|
|
5
5
|
let {
|
|
6
6
|
children,
|
|
7
7
|
className,
|
|
8
|
-
dataTest
|
|
8
|
+
dataTest = 'dhis2-uicore-stackedtablehead'
|
|
9
9
|
} = _ref;
|
|
10
10
|
return /*#__PURE__*/React.createElement("thead", {
|
|
11
11
|
"data-test": dataTest,
|
|
@@ -18,7 +18,4 @@ StackedTableHead.propTypes = {
|
|
|
18
18
|
children: PropTypes.node,
|
|
19
19
|
className: PropTypes.string,
|
|
20
20
|
dataTest: PropTypes.string
|
|
21
|
-
};
|
|
22
|
-
StackedTableHead.defaultProps = {
|
|
23
|
-
dataTest: 'dhis2-uicore-stackedtablehead'
|
|
24
21
|
};
|
|
@@ -5,7 +5,7 @@ export const StackedTableRowHead = _ref => {
|
|
|
5
5
|
let {
|
|
6
6
|
children,
|
|
7
7
|
className,
|
|
8
|
-
dataTest
|
|
8
|
+
dataTest = 'dhis2-uicore-stackedtablerowhead'
|
|
9
9
|
} = _ref;
|
|
10
10
|
return /*#__PURE__*/React.createElement(StackedTableRow, {
|
|
11
11
|
className: className,
|
|
@@ -16,7 +16,4 @@ StackedTableRowHead.propTypes = {
|
|
|
16
16
|
children: PropTypes.node,
|
|
17
17
|
className: PropTypes.string,
|
|
18
18
|
dataTest: PropTypes.string
|
|
19
|
-
};
|
|
20
|
-
StackedTableRowHead.defaultProps = {
|
|
21
|
-
dataTest: 'dhis2-uicore-stackedtablerowhead'
|
|
22
19
|
};
|
|
@@ -9,7 +9,7 @@ export const StackedTableRow = _ref => {
|
|
|
9
9
|
let {
|
|
10
10
|
children,
|
|
11
11
|
className,
|
|
12
|
-
dataTest
|
|
12
|
+
dataTest = 'dhis2-uicore-stackedtablerow'
|
|
13
13
|
} = _ref;
|
|
14
14
|
return /*#__PURE__*/React.createElement("tr", {
|
|
15
15
|
"data-test": dataTest,
|
|
@@ -28,7 +28,4 @@ StackedTableRow.propTypes = {
|
|
|
28
28
|
children: PropTypes.node,
|
|
29
29
|
className: PropTypes.string,
|
|
30
30
|
dataTest: PropTypes.string
|
|
31
|
-
};
|
|
32
|
-
StackedTableRow.defaultProps = {
|
|
33
|
-
dataTest: 'dhis2-uicore-stackedtablerow'
|
|
34
31
|
};
|
|
@@ -7,7 +7,7 @@ export const StackedTable = _ref => {
|
|
|
7
7
|
let {
|
|
8
8
|
children,
|
|
9
9
|
className,
|
|
10
|
-
dataTest,
|
|
10
|
+
dataTest = 'dhis2-uicore-stackedtable',
|
|
11
11
|
headerLabels
|
|
12
12
|
} = _ref;
|
|
13
13
|
const contextHeaderLabels = extractHeaderLabels(children);
|
|
@@ -27,7 +27,4 @@ StackedTable.propTypes = {
|
|
|
27
27
|
dataTest: PropTypes.string,
|
|
28
28
|
/** Labels for columns. Use an empty string for a column without a header. */
|
|
29
29
|
headerLabels: PropTypes.arrayOf(PropTypes.string)
|
|
30
|
-
};
|
|
31
|
-
StackedTable.defaultProps = {
|
|
32
|
-
dataTest: 'dhis2-uicore-stackedtable'
|
|
33
30
|
};
|
|
@@ -4,7 +4,7 @@ export const TableBody = _ref => {
|
|
|
4
4
|
let {
|
|
5
5
|
children,
|
|
6
6
|
className,
|
|
7
|
-
dataTest,
|
|
7
|
+
dataTest = 'dhis2-uicore-tablebody',
|
|
8
8
|
role
|
|
9
9
|
} = _ref;
|
|
10
10
|
return /*#__PURE__*/React.createElement("tbody", {
|
|
@@ -13,9 +13,6 @@ export const TableBody = _ref => {
|
|
|
13
13
|
role: role
|
|
14
14
|
}, children);
|
|
15
15
|
};
|
|
16
|
-
TableBody.defaultProps = {
|
|
17
|
-
dataTest: 'dhis2-uicore-tablebody'
|
|
18
|
-
};
|
|
19
16
|
TableBody.propTypes = {
|
|
20
17
|
/** Should be `<TableRow>` components */
|
|
21
18
|
children: PropTypes.node,
|
|
@@ -12,7 +12,7 @@ export const TableCellHead = _ref => {
|
|
|
12
12
|
dense,
|
|
13
13
|
children,
|
|
14
14
|
className,
|
|
15
|
-
dataTest
|
|
15
|
+
dataTest = 'dhis2-uicore-tablecellhead'
|
|
16
16
|
} = _ref;
|
|
17
17
|
return /*#__PURE__*/React.createElement("th", {
|
|
18
18
|
colSpan: colSpan,
|
|
@@ -26,9 +26,6 @@ export const TableCellHead = _ref => {
|
|
|
26
26
|
id: tableCellHeadStyles.__hash
|
|
27
27
|
}, tableCellHeadStyles));
|
|
28
28
|
};
|
|
29
|
-
TableCellHead.defaultProps = {
|
|
30
|
-
dataTest: 'dhis2-uicore-tablecellhead'
|
|
31
|
-
};
|
|
32
29
|
TableCellHead.propTypes = {
|
|
33
30
|
children: PropTypes.node,
|
|
34
31
|
className: PropTypes.string,
|
|
@@ -12,7 +12,7 @@ export const TableCell = _ref => {
|
|
|
12
12
|
colSpan,
|
|
13
13
|
rowSpan,
|
|
14
14
|
dense,
|
|
15
|
-
dataTest
|
|
15
|
+
dataTest = 'dhis2-uicore-tablecell'
|
|
16
16
|
} = _ref;
|
|
17
17
|
return /*#__PURE__*/React.createElement("td", {
|
|
18
18
|
colSpan: colSpan,
|
|
@@ -26,9 +26,6 @@ export const TableCell = _ref => {
|
|
|
26
26
|
id: tableCellStyles.__hash
|
|
27
27
|
}, tableCellStyles));
|
|
28
28
|
};
|
|
29
|
-
TableCell.defaultProps = {
|
|
30
|
-
dataTest: 'dhis2-uicore-tablecell'
|
|
31
|
-
};
|
|
32
29
|
TableCell.propTypes = {
|
|
33
30
|
children: PropTypes.node,
|
|
34
31
|
className: PropTypes.string,
|
|
@@ -4,7 +4,7 @@ export const TableFoot = _ref => {
|
|
|
4
4
|
let {
|
|
5
5
|
children,
|
|
6
6
|
className,
|
|
7
|
-
dataTest,
|
|
7
|
+
dataTest = 'dhis2-uicore-tablefoot',
|
|
8
8
|
role
|
|
9
9
|
} = _ref;
|
|
10
10
|
return /*#__PURE__*/React.createElement("tfoot", {
|
|
@@ -13,9 +13,6 @@ export const TableFoot = _ref => {
|
|
|
13
13
|
role: role
|
|
14
14
|
}, children);
|
|
15
15
|
};
|
|
16
|
-
TableFoot.defaultProps = {
|
|
17
|
-
dataTest: 'dhis2-uicore-tablefoot'
|
|
18
|
-
};
|
|
19
16
|
TableFoot.propTypes = {
|
|
20
17
|
/** Should be `<TableRow>` components */
|
|
21
18
|
children: PropTypes.node,
|
|
@@ -4,7 +4,7 @@ export const TableHead = _ref => {
|
|
|
4
4
|
let {
|
|
5
5
|
children,
|
|
6
6
|
className,
|
|
7
|
-
dataTest,
|
|
7
|
+
dataTest = 'dhis2-uicore-tablehead',
|
|
8
8
|
role
|
|
9
9
|
} = _ref;
|
|
10
10
|
return /*#__PURE__*/React.createElement("thead", {
|
|
@@ -13,9 +13,6 @@ export const TableHead = _ref => {
|
|
|
13
13
|
role: role
|
|
14
14
|
}, children);
|
|
15
15
|
};
|
|
16
|
-
TableHead.defaultProps = {
|
|
17
|
-
dataTest: 'dhis2-uicore-tablehead'
|
|
18
|
-
};
|
|
19
16
|
TableHead.propTypes = {
|
|
20
17
|
/** Should be `<TableRowHead>` components */
|
|
21
18
|
children: PropTypes.node,
|
|
@@ -6,7 +6,7 @@ export const TableRowHead = _ref => {
|
|
|
6
6
|
role,
|
|
7
7
|
children,
|
|
8
8
|
className,
|
|
9
|
-
dataTest,
|
|
9
|
+
dataTest = 'dhis2-uicore-tablerowhead',
|
|
10
10
|
suppressZebraStriping
|
|
11
11
|
} = _ref;
|
|
12
12
|
return /*#__PURE__*/React.createElement(TableRow, {
|
|
@@ -16,9 +16,6 @@ export const TableRowHead = _ref => {
|
|
|
16
16
|
role: role
|
|
17
17
|
}, children);
|
|
18
18
|
};
|
|
19
|
-
TableRowHead.defaultProps = {
|
|
20
|
-
dataTest: 'dhis2-uicore-tablerowhead'
|
|
21
|
-
};
|
|
22
19
|
TableRowHead.propTypes = {
|
|
23
20
|
/** Should be `<TableCellHead>` components */
|
|
24
21
|
children: PropTypes.node,
|