@hipay/hipay-material-ui 3.4.2 → 3.5.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.
Files changed (9) hide show
  1. package/HiSelect/HiSelect.js +2 -1
  2. package/HiTable/HiTable.js +200 -62
  3. package/HiTable/HiTableRow.js +2 -1
  4. package/es/HiSelect/HiSelect.js +2 -1
  5. package/es/HiTable/HiTable.js +200 -62
  6. package/es/HiTable/HiTableRow.js +2 -1
  7. package/es/styles/createPalette.js +2 -2
  8. package/package.json +4 -3
  9. package/styles/createPalette.js +2 -2
package/HiSelect/HiSelect.js CHANGED
@@ -393,7 +393,8 @@ function (_React$PureComponent) {
393
393
  var key = (0, _keycode.default)(event);
394
394
 
395
395
  if (!_this.state.alertOpen) {
396
- if (key === 'esc') {
396
+ if (key === 'esc' && _this.state.open) {
397
+ event.stopPropagation();
397
398
  event.preventDefault();
398
399
 
399
400
  _this.handleClose();
package/HiTable/HiTable.js CHANGED
@@ -1,5 +1,7 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
+
3
5
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
6
 
5
7
  Object.defineProperty(exports, "__esModule", {
@@ -7,95 +9,231 @@ Object.defineProperty(exports, "__esModule", {
7
9
  });
8
10
  exports.default = void 0;
9
11
 
10
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
12
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
11
13
 
12
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
14
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
13
15
 
14
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
16
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
15
17
 
16
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
18
+ var _react = _interopRequireWildcard(require("react"));
17
19
 
18
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/assertThisInitialized"));
20
+ var _styles = require("@material-ui/core/styles");
19
21
 
20
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
22
+ var _Table = _interopRequireDefault(require("@material-ui/core/Table"));
21
23
 
22
- var _react = _interopRequireDefault(require("react"));
24
+ var _Pagination = _interopRequireDefault(require("@material-ui/lab/Pagination"));
23
25
 
24
- var _styles = require("@material-ui/core/styles");
26
+ var _Skeleton = _interopRequireDefault(require("@material-ui/lab/Skeleton"));
25
27
 
26
- var _Table = _interopRequireDefault(require("@material-ui/core/Table"));
28
+ var _PaginationItem = _interopRequireDefault(require("@material-ui/lab/PaginationItem"));
27
29
 
28
30
  var _HiTableHeader = _interopRequireDefault(require("./HiTableHeader"));
29
31
 
30
32
  var _HiTableBody = _interopRequireDefault(require("./HiTableBody"));
31
33
 
32
34
  // @inheritedComponent Table
33
- var styles = function styles(theme) {
35
+ var useStyles = (0, _styles.makeStyles)(function (theme) {
34
36
  return {
35
37
  root: {
36
38
  backgroundColor: theme.palette.background3
39
+ },
40
+ pagination: {
41
+ display: 'flex',
42
+ flexDirection: 'row-reverse',
43
+ paddingTop: 2
44
+ },
45
+ paginationItem: {
46
+ backgroundColor: "transparent",
47
+ color: theme.palette.neutral.dark,
48
+ fontWeight: theme.typography.fontWeightRegular,
49
+ '&:hover': {
50
+ backgroundColor: theme.palette.neutral.main,
51
+ color: theme.palette.neutral.contrastText,
52
+ fontWeight: theme.typography.fontWeightMedium
53
+ }
54
+ },
55
+ paginationItemActive: {
56
+ backgroundColor: "".concat(theme.palette.primary.main, " !important"),
57
+ color: theme.palette.primary.contrastText,
58
+ fontWeight: theme.typography.fontWeightMedium
59
+ },
60
+ activePage: {
61
+ backgroundColor: theme.palette.primary.main
62
+ },
63
+ skeletonRoot: {
64
+ height: 32,
65
+ margin: '8px 0px'
37
66
  }
38
67
  };
39
- };
68
+ });
69
+
70
+ var HiTable = function HiTable(props) {
71
+ var activePagination = props.activePagination,
72
+ nbPages = props.nbPages,
73
+ data = props.data,
74
+ columns = props.columns,
75
+ locale = props.locale,
76
+ loading = props.loading,
77
+ pageProp = props.page,
78
+ sortable = props.sortable,
79
+ onRowClick = props.onRowClick,
80
+ dense = props.dense,
81
+ order = props.order,
82
+ orderBy = props.orderBy,
83
+ onSort = props.onSort,
84
+ onChangePage = props.onChangePage;
85
+ var classes = useStyles();
86
+
87
+ var _useState = (0, _react.useState)(pageProp || 1),
88
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
89
+ page = _useState2[0],
90
+ setPage = _useState2[1];
91
+
92
+ (0, _react.useEffect)(function () {
93
+ if (pageProp) {
94
+ setPage(pageProp);
95
+ }
96
+ }, [pageProp]);
40
97
 
41
- var HiTable =
42
- /*#__PURE__*/
43
- function (_React$PureComponent) {
44
- (0, _inherits2.default)(HiTable, _React$PureComponent);
98
+ var handleRequestSort = function handleRequestSort(event, property) {
99
+ if (onSort) {
100
+ onSort(property);
101
+ setPage(1);
102
+ }
103
+ };
45
104
 
46
- function HiTable(props) {
47
- var _this;
105
+ var handleChangePage = function handleChangePage(event, page) {
106
+ setPage(page);
48
107
 
49
- (0, _classCallCheck2.default)(this, HiTable);
50
- _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiTable).call(this, props));
108
+ if (onChangePage) {
109
+ onChangePage(event, page);
110
+ }
111
+ };
51
112
 
52
- _this.handleRequestSort = function (event, property) {
53
- if (_this.props.onSort) {
54
- _this.props.onSort(property);
113
+ var renderPaginationItem = function renderPaginationItem(item) {
114
+ return _react.default.createElement(_PaginationItem.default, (0, _extends2.default)({
115
+ classes: {
116
+ root: classes.paginationItem,
117
+ selected: classes.paginationItemActive
55
118
  }
56
- };
119
+ }, item));
120
+ };
57
121
 
58
- _this.handleRequestSort = _this.handleRequestSort.bind((0, _assertThisInitialized2.default)(_this));
59
- return _this;
60
- }
122
+ var displayedData = (0, _react.useMemo)(function () {
123
+ var _data = (0, _toConsumableArray2.default)(data);
124
+
125
+ if (_data.length > 10) {
126
+ var itemFromIndex = (page - 1) * 10;
127
+ var itemToIndex = page * 10;
128
+
129
+ if (itemToIndex > _data.length) {
130
+ itemToIndex = _data.length;
131
+ }
61
132
 
62
- (0, _createClass2.default)(HiTable, [{
63
- key: "render",
64
- value: function render() {
65
- var _this$props = this.props,
66
- classes = _this$props.classes,
67
- data = _this$props.data,
68
- columns = _this$props.columns,
69
- locale = _this$props.locale,
70
- sortable = _this$props.sortable,
71
- onRowClick = _this$props.onRowClick,
72
- dense = _this$props.dense,
73
- order = _this$props.order,
74
- orderBy = _this$props.orderBy;
75
- return _react.default.createElement(_Table.default, {
76
- className: classes.root
77
- }, _react.default.createElement(_HiTableHeader.default, {
78
- columns: columns,
79
- order: order,
80
- orderBy: orderBy,
81
- onRequestSort: this.handleRequestSort,
82
- sortable: sortable,
83
- dense: dense
84
- }), _react.default.createElement(_HiTableBody.default, {
85
- data: data,
86
- columns: columns,
87
- onClick: onRowClick,
88
- dense: dense,
89
- locale: locale
90
- }));
133
+ return _data.slice(itemFromIndex, itemToIndex);
91
134
  }
92
- }]);
93
- return HiTable;
94
- }(_react.default.PureComponent);
95
135
 
96
- var _default = (0, _styles.withStyles)(styles, {
97
- hiComponent: true,
98
- name: 'HmuiHiTable'
99
- })(HiTable);
136
+ return _data;
137
+ }, [page, data, order]);
138
+ var activatePagination = activePagination;
139
+ var pageCount = nbPages;
140
+
141
+ if (data.length > 10) {
142
+ pageCount = Math.ceil(data.length / 10);
143
+ activatePagination = true;
144
+ }
145
+
146
+ return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Table.default, {
147
+ className: classes.root
148
+ }, _react.default.createElement(_HiTableHeader.default, {
149
+ columns: columns,
150
+ order: order,
151
+ orderBy: orderBy,
152
+ onRequestSort: handleRequestSort,
153
+ sortable: sortable,
154
+ dense: dense
155
+ }), !loading && _react.default.createElement(_HiTableBody.default, {
156
+ data: displayedData,
157
+ columns: columns,
158
+ onClick: onRowClick,
159
+ dense: dense,
160
+ locale: locale
161
+ })), loading && _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Skeleton.default, {
162
+ classes: {
163
+ root: classes.skeletonRoot
164
+ },
165
+ variant: "rect",
166
+ height: 32
167
+ }), _react.default.createElement(_Skeleton.default, {
168
+ classes: {
169
+ root: classes.skeletonRoot
170
+ },
171
+ variant: "rect",
172
+ height: 32
173
+ }), _react.default.createElement(_Skeleton.default, {
174
+ classes: {
175
+ root: classes.skeletonRoot
176
+ },
177
+ variant: "rect",
178
+ height: 32
179
+ }), _react.default.createElement(_Skeleton.default, {
180
+ classes: {
181
+ root: classes.skeletonRoot
182
+ },
183
+ variant: "rect",
184
+ height: 32
185
+ }), _react.default.createElement(_Skeleton.default, {
186
+ classes: {
187
+ root: classes.skeletonRoot
188
+ },
189
+ variant: "rect",
190
+ height: 32
191
+ }), _react.default.createElement(_Skeleton.default, {
192
+ classes: {
193
+ root: classes.skeletonRoot
194
+ },
195
+ variant: "rect",
196
+ height: 32
197
+ }), _react.default.createElement(_Skeleton.default, {
198
+ classes: {
199
+ root: classes.skeletonRoot
200
+ },
201
+ variant: "rect",
202
+ height: 32
203
+ }), _react.default.createElement(_Skeleton.default, {
204
+ classes: {
205
+ root: classes.skeletonRoot
206
+ },
207
+ variant: "rect",
208
+ height: 32
209
+ }), _react.default.createElement(_Skeleton.default, {
210
+ classes: {
211
+ root: classes.skeletonRoot
212
+ },
213
+ variant: "rect",
214
+ height: 32
215
+ }), _react.default.createElement(_Skeleton.default, {
216
+ classes: {
217
+ root: classes.skeletonRoot
218
+ },
219
+ variant: "rect",
220
+ height: 32
221
+ })), pageCount > 1 && activatePagination && _react.default.createElement(_Pagination.default, {
222
+ count: pageCount,
223
+ showFirstButton: pageCount > 10,
224
+ showLastButton: pageCount > 10,
225
+ classes: {
226
+ root: classes.pagination
227
+ },
228
+ onChange: handleChangePage,
229
+ page: page,
230
+ renderItem: renderPaginationItem
231
+ }));
232
+ };
100
233
 
234
+ HiTable.defaultProps = {
235
+ activePagination: false,
236
+ nbPages: 1
237
+ };
238
+ var _default = HiTable;
101
239
  exports.default = _default;
package/HiTable/HiTableRow.js CHANGED
@@ -116,7 +116,8 @@ function (_React$PureComponent) {
116
116
  style: {
117
117
  height: dense ? cst.CELL_HEIGHT_DENSE : cst.CELL_HEIGHT
118
118
  },
119
- tabIndex: 0
119
+ tabIndex: 0,
120
+ dataId: rowdata.rowId
120
121
  }, Object.keys(columns).map(function (column) {
121
122
  return _react.default.createElement(_HiCellBuilder.default, {
122
123
  key: columns[column].colId,
package/es/HiSelect/HiSelect.js CHANGED
@@ -393,7 +393,8 @@ function (_React$PureComponent) {
393
393
  var key = (0, _keycode.default)(event);
394
394
 
395
395
  if (!_this.state.alertOpen) {
396
- if (key === 'esc') {
396
+ if (key === 'esc' && _this.state.open) {
397
+ event.stopPropagation();
397
398
  event.preventDefault();
398
399
 
399
400
  _this.handleClose();
package/es/HiTable/HiTable.js CHANGED
@@ -1,5 +1,7 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
+
3
5
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
6
 
5
7
  Object.defineProperty(exports, "__esModule", {
@@ -7,95 +9,231 @@ Object.defineProperty(exports, "__esModule", {
7
9
  });
8
10
  exports.default = void 0;
9
11
 
10
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
12
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
11
13
 
12
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
14
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
13
15
 
14
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
16
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
15
17
 
16
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
18
+ var _react = _interopRequireWildcard(require("react"));
17
19
 
18
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/assertThisInitialized"));
20
+ var _styles = require("@material-ui/core/styles");
19
21
 
20
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
22
+ var _Table = _interopRequireDefault(require("@material-ui/core/Table"));
21
23
 
22
- var _react = _interopRequireDefault(require("react"));
24
+ var _Pagination = _interopRequireDefault(require("@material-ui/lab/Pagination"));
23
25
 
24
- var _styles = require("@material-ui/core/styles");
26
+ var _Skeleton = _interopRequireDefault(require("@material-ui/lab/Skeleton"));
25
27
 
26
- var _Table = _interopRequireDefault(require("@material-ui/core/Table"));
28
+ var _PaginationItem = _interopRequireDefault(require("@material-ui/lab/PaginationItem"));
27
29
 
28
30
  var _HiTableHeader = _interopRequireDefault(require("./HiTableHeader"));
29
31
 
30
32
  var _HiTableBody = _interopRequireDefault(require("./HiTableBody"));
31
33
 
32
34
  // @inheritedComponent Table
33
- var styles = function styles(theme) {
35
+ var useStyles = (0, _styles.makeStyles)(function (theme) {
34
36
  return {
35
37
  root: {
36
38
  backgroundColor: theme.palette.background3
39
+ },
40
+ pagination: {
41
+ display: 'flex',
42
+ flexDirection: 'row-reverse',
43
+ paddingTop: 2
44
+ },
45
+ paginationItem: {
46
+ backgroundColor: "transparent",
47
+ color: theme.palette.neutral.dark,
48
+ fontWeight: theme.typography.fontWeightRegular,
49
+ '&:hover': {
50
+ backgroundColor: theme.palette.neutral.main,
51
+ color: theme.palette.neutral.contrastText,
52
+ fontWeight: theme.typography.fontWeightMedium
53
+ }
54
+ },
55
+ paginationItemActive: {
56
+ backgroundColor: "".concat(theme.palette.primary.main, " !important"),
57
+ color: theme.palette.primary.contrastText,
58
+ fontWeight: theme.typography.fontWeightMedium
59
+ },
60
+ activePage: {
61
+ backgroundColor: theme.palette.primary.main
62
+ },
63
+ skeletonRoot: {
64
+ height: 32,
65
+ margin: '8px 0px'
37
66
  }
38
67
  };
39
- };
68
+ });
69
+
70
+ var HiTable = function HiTable(props) {
71
+ var activePagination = props.activePagination,
72
+ nbPages = props.nbPages,
73
+ data = props.data,
74
+ columns = props.columns,
75
+ locale = props.locale,
76
+ loading = props.loading,
77
+ pageProp = props.page,
78
+ sortable = props.sortable,
79
+ onRowClick = props.onRowClick,
80
+ dense = props.dense,
81
+ order = props.order,
82
+ orderBy = props.orderBy,
83
+ onSort = props.onSort,
84
+ onChangePage = props.onChangePage;
85
+ var classes = useStyles();
86
+
87
+ var _useState = (0, _react.useState)(pageProp || 1),
88
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
89
+ page = _useState2[0],
90
+ setPage = _useState2[1];
91
+
92
+ (0, _react.useEffect)(function () {
93
+ if (pageProp) {
94
+ setPage(pageProp);
95
+ }
96
+ }, [pageProp]);
40
97
 
41
- var HiTable =
42
- /*#__PURE__*/
43
- function (_React$PureComponent) {
44
- (0, _inherits2.default)(HiTable, _React$PureComponent);
98
+ var handleRequestSort = function handleRequestSort(event, property) {
99
+ if (onSort) {
100
+ onSort(property);
101
+ setPage(1);
102
+ }
103
+ };
45
104
 
46
- function HiTable(props) {
47
- var _this;
105
+ var handleChangePage = function handleChangePage(event, page) {
106
+ setPage(page);
48
107
 
49
- (0, _classCallCheck2.default)(this, HiTable);
50
- _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiTable).call(this, props));
108
+ if (onChangePage) {
109
+ onChangePage(event, page);
110
+ }
111
+ };
51
112
 
52
- _this.handleRequestSort = function (event, property) {
53
- if (_this.props.onSort) {
54
- _this.props.onSort(property);
113
+ var renderPaginationItem = function renderPaginationItem(item) {
114
+ return _react.default.createElement(_PaginationItem.default, (0, _extends2.default)({
115
+ classes: {
116
+ root: classes.paginationItem,
117
+ selected: classes.paginationItemActive
55
118
  }
56
- };
119
+ }, item));
120
+ };
57
121
 
58
- _this.handleRequestSort = _this.handleRequestSort.bind((0, _assertThisInitialized2.default)(_this));
59
- return _this;
60
- }
122
+ var displayedData = (0, _react.useMemo)(function () {
123
+ var _data = (0, _toConsumableArray2.default)(data);
124
+
125
+ if (_data.length > 10) {
126
+ var itemFromIndex = (page - 1) * 10;
127
+ var itemToIndex = page * 10;
128
+
129
+ if (itemToIndex > _data.length) {
130
+ itemToIndex = _data.length;
131
+ }
61
132
 
62
- (0, _createClass2.default)(HiTable, [{
63
- key: "render",
64
- value: function render() {
65
- var _this$props = this.props,
66
- classes = _this$props.classes,
67
- data = _this$props.data,
68
- columns = _this$props.columns,
69
- locale = _this$props.locale,
70
- sortable = _this$props.sortable,
71
- onRowClick = _this$props.onRowClick,
72
- dense = _this$props.dense,
73
- order = _this$props.order,
74
- orderBy = _this$props.orderBy;
75
- return _react.default.createElement(_Table.default, {
76
- className: classes.root
77
- }, _react.default.createElement(_HiTableHeader.default, {
78
- columns: columns,
79
- order: order,
80
- orderBy: orderBy,
81
- onRequestSort: this.handleRequestSort,
82
- sortable: sortable,
83
- dense: dense
84
- }), _react.default.createElement(_HiTableBody.default, {
85
- data: data,
86
- columns: columns,
87
- onClick: onRowClick,
88
- dense: dense,
89
- locale: locale
90
- }));
133
+ return _data.slice(itemFromIndex, itemToIndex);
91
134
  }
92
- }]);
93
- return HiTable;
94
- }(_react.default.PureComponent);
95
135
 
96
- var _default = (0, _styles.withStyles)(styles, {
97
- hiComponent: true,
98
- name: 'HmuiHiTable'
99
- })(HiTable);
136
+ return _data;
137
+ }, [page, data, order]);
138
+ var activatePagination = activePagination;
139
+ var pageCount = nbPages;
140
+
141
+ if (data.length > 10) {
142
+ pageCount = Math.ceil(data.length / 10);
143
+ activatePagination = true;
144
+ }
145
+
146
+ return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Table.default, {
147
+ className: classes.root
148
+ }, _react.default.createElement(_HiTableHeader.default, {
149
+ columns: columns,
150
+ order: order,
151
+ orderBy: orderBy,
152
+ onRequestSort: handleRequestSort,
153
+ sortable: sortable,
154
+ dense: dense
155
+ }), !loading && _react.default.createElement(_HiTableBody.default, {
156
+ data: displayedData,
157
+ columns: columns,
158
+ onClick: onRowClick,
159
+ dense: dense,
160
+ locale: locale
161
+ })), loading && _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Skeleton.default, {
162
+ classes: {
163
+ root: classes.skeletonRoot
164
+ },
165
+ variant: "rect",
166
+ height: 32
167
+ }), _react.default.createElement(_Skeleton.default, {
168
+ classes: {
169
+ root: classes.skeletonRoot
170
+ },
171
+ variant: "rect",
172
+ height: 32
173
+ }), _react.default.createElement(_Skeleton.default, {
174
+ classes: {
175
+ root: classes.skeletonRoot
176
+ },
177
+ variant: "rect",
178
+ height: 32
179
+ }), _react.default.createElement(_Skeleton.default, {
180
+ classes: {
181
+ root: classes.skeletonRoot
182
+ },
183
+ variant: "rect",
184
+ height: 32
185
+ }), _react.default.createElement(_Skeleton.default, {
186
+ classes: {
187
+ root: classes.skeletonRoot
188
+ },
189
+ variant: "rect",
190
+ height: 32
191
+ }), _react.default.createElement(_Skeleton.default, {
192
+ classes: {
193
+ root: classes.skeletonRoot
194
+ },
195
+ variant: "rect",
196
+ height: 32
197
+ }), _react.default.createElement(_Skeleton.default, {
198
+ classes: {
199
+ root: classes.skeletonRoot
200
+ },
201
+ variant: "rect",
202
+ height: 32
203
+ }), _react.default.createElement(_Skeleton.default, {
204
+ classes: {
205
+ root: classes.skeletonRoot
206
+ },
207
+ variant: "rect",
208
+ height: 32
209
+ }), _react.default.createElement(_Skeleton.default, {
210
+ classes: {
211
+ root: classes.skeletonRoot
212
+ },
213
+ variant: "rect",
214
+ height: 32
215
+ }), _react.default.createElement(_Skeleton.default, {
216
+ classes: {
217
+ root: classes.skeletonRoot
218
+ },
219
+ variant: "rect",
220
+ height: 32
221
+ })), pageCount > 1 && activatePagination && _react.default.createElement(_Pagination.default, {
222
+ count: pageCount,
223
+ showFirstButton: pageCount > 10,
224
+ showLastButton: pageCount > 10,
225
+ classes: {
226
+ root: classes.pagination
227
+ },
228
+ onChange: handleChangePage,
229
+ page: page,
230
+ renderItem: renderPaginationItem
231
+ }));
232
+ };
100
233
 
234
+ HiTable.defaultProps = {
235
+ activePagination: false,
236
+ nbPages: 1
237
+ };
238
+ var _default = HiTable;
101
239
  exports.default = _default;
package/es/HiTable/HiTableRow.js CHANGED
@@ -116,7 +116,8 @@ function (_React$PureComponent) {
116
116
  style: {
117
117
  height: dense ? cst.CELL_HEIGHT_DENSE : cst.CELL_HEIGHT
118
118
  },
119
- tabIndex: 0
119
+ tabIndex: 0,
120
+ dataId: rowdata.rowId
120
121
  }, Object.keys(columns).map(function (column) {
121
122
  return _react.default.createElement(_HiCellBuilder.default, {
122
123
  key: columns[column].colId,
package/es/styles/createPalette.js CHANGED
@@ -190,7 +190,7 @@ function createPalette(palette) {
190
190
  _palette$type = palette.type,
191
191
  type = _palette$type === void 0 ? 'light' : _palette$type,
192
192
  _palette$contrastThre = palette.contrastThreshold,
193
- contrastThreshold = _palette$contrastThre === void 0 ? 2.2 : _palette$contrastThre,
193
+ contrastThreshold = _palette$contrastThre === void 0 ? 3 : _palette$contrastThre,
194
194
  _palette$tonalOffset = palette.tonalOffset,
195
195
  tonalOffset = _palette$tonalOffset === void 0 ? 0.2 : _palette$tonalOffset,
196
196
  _palette$context = palette.context,
@@ -205,7 +205,7 @@ function createPalette(palette) {
205
205
 
206
206
  if (process.env.NODE_ENV !== 'production') {
207
207
  var contrast = (0, _colorManipulator.getContrastRatio)(background, contrastText);
208
- process.env.NODE_ENV !== "production" ? (0, _warning.default)(contrast >= 2.2, ["Material-UI: the contrast ratio of ".concat(contrast, ":1 for ").concat(contrastText, " on ").concat(background), 'falls below the WACG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\n')) : void 0;
208
+ process.env.NODE_ENV !== "production" ? (0, _warning.default)(contrast >= 3, ["Material-UI: the contrast ratio of ".concat(contrast, ":1 for ").concat(contrastText, " on ").concat(background), 'falls below the WACG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\n')) : void 0;
209
209
  }
210
210
 
211
211
  return contrastText;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@hipay/hipay-material-ui",
3
3
  "private": false,
4
- "version": "3.4.2",
4
+ "version": "3.5.1",
5
5
  "description": "React components that implement Google's Material Design.",
6
6
  "repository": {
7
7
  "type": "git",
@@ -22,7 +22,8 @@
22
22
  "dependencies": {
23
23
  "@babel/plugin-transform-runtime": "^7.8.3",
24
24
  "@babel/runtime": "7.6.3",
25
- "@material-ui/icons": "4.4.3",
25
+ "@material-ui/icons": "4.9.1",
26
+ "@material-ui/lab": "4.0.0-alpha.56",
26
27
  "brcast": "3.0.1",
27
28
  "classnames": "2.2.6",
28
29
  "cross-env": "6.0.3",
@@ -68,4 +69,4 @@
68
69
  },
69
70
  "main": "./index.js",
70
71
  "module": "./esm/index.js"
71
- }
72
+ }
package/styles/createPalette.js CHANGED
@@ -190,7 +190,7 @@ function createPalette(palette) {
190
190
  _palette$type = palette.type,
191
191
  type = _palette$type === void 0 ? 'light' : _palette$type,
192
192
  _palette$contrastThre = palette.contrastThreshold,
193
- contrastThreshold = _palette$contrastThre === void 0 ? 2.2 : _palette$contrastThre,
193
+ contrastThreshold = _palette$contrastThre === void 0 ? 3 : _palette$contrastThre,
194
194
  _palette$tonalOffset = palette.tonalOffset,
195
195
  tonalOffset = _palette$tonalOffset === void 0 ? 0.2 : _palette$tonalOffset,
196
196
  _palette$context = palette.context,
@@ -205,7 +205,7 @@ function createPalette(palette) {
205
205
 
206
206
  if (process.env.NODE_ENV !== 'production') {
207
207
  var contrast = (0, _colorManipulator.getContrastRatio)(background, contrastText);
208
- process.env.NODE_ENV !== "production" ? (0, _warning.default)(contrast >= 2.2, ["Material-UI: the contrast ratio of ".concat(contrast, ":1 for ").concat(contrastText, " on ").concat(background), 'falls below the WACG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\n')) : void 0;
208
+ process.env.NODE_ENV !== "production" ? (0, _warning.default)(contrast >= 3, ["Material-UI: the contrast ratio of ".concat(contrast, ":1 for ").concat(contrastText, " on ").concat(background), 'falls below the WACG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\n')) : void 0;
209
209
  }
210
210
 
211
211
  return contrastText;