@hipay/hipay-material-ui 3.4.2 → 3.5.1

Sign up to get free protection for your applications and to get access to all the features.
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;