@hipay/hipay-material-ui 1.0.0-beta.23 → 1.0.0-beta.26

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 (83) hide show
  1. package/HI-CHANGELOG.md +58 -39
  2. package/HiChip/HiChip.js +67 -8
  3. package/HiDatePicker/HiDateRangePicker.js +27 -13
  4. package/HiDatePicker/HiDateRangeSelector.js +13 -2
  5. package/HiForm/HiInput.js +1 -0
  6. package/HiForm/HiPasswordField.js +2 -2
  7. package/HiPins/HiPins.js +6 -4
  8. package/HiSelect/HiSelect.js +28 -20
  9. package/HiSelect/SelectInput.js +3 -8
  10. package/HiSelectableList/HiSelectableList.js +51 -49
  11. package/HiSelectableList/HiSelectableListItem.js +7 -5
  12. package/HiTable/BodyCellBuilder.js +25 -14
  13. package/HiTable/BodyCells/CellAccount.js +13 -15
  14. package/HiTable/BodyCells/CellAccountNumber.js +12 -3
  15. package/HiTable/BodyCells/CellAddress.js +12 -3
  16. package/HiTable/BodyCells/CellCountry.js +12 -3
  17. package/HiTable/BodyCells/CellDate.js +56 -52
  18. package/HiTable/BodyCells/CellIcon.js +12 -3
  19. package/HiTable/BodyCells/CellImage.js +12 -3
  20. package/HiTable/BodyCells/CellNumeric.js +12 -3
  21. package/HiTable/BodyCells/CellRate.js +12 -3
  22. package/HiTable/BodyCells/CellSentinel.js +17 -7
  23. package/HiTable/BodyCells/CellStatus.js +12 -3
  24. package/HiTable/BodyCells/CellText.js +75 -37
  25. package/HiTable/BodyCells/CellThirdPartySecurity.js +12 -3
  26. package/HiTable/BodyRow.js +12 -3
  27. package/HiTable/ColumnFilter.js +1 -4
  28. package/HiTable/HeaderCell.js +21 -11
  29. package/HiTable/HiStickyRow.js +27 -16
  30. package/HiTable/HiTable.js +30 -69
  31. package/HiTable/HiTableBody.js +99 -29
  32. package/HiTable/HiTableContextMenu.js +31 -16
  33. package/HiTable/HiTableFooter.js +9 -0
  34. package/HiTable/HiTableHead.js +15 -7
  35. package/HiTopBar/HiTopBar.js +6 -0
  36. package/README.md +72 -6
  37. package/es/HiChip/HiChip.js +81 -9
  38. package/es/HiDatePicker/HiDateRangePicker.js +25 -12
  39. package/es/HiDatePicker/HiDateRangeSelector.js +12 -2
  40. package/es/HiForm/HiInput.js +1 -0
  41. package/es/HiForm/HiPasswordField.js +2 -2
  42. package/es/HiPins/HiPins.js +4 -4
  43. package/es/HiSelect/HiSelect.js +25 -16
  44. package/es/HiSelect/SelectInput.js +3 -8
  45. package/es/HiSelectableList/HiSelectableList.js +51 -49
  46. package/es/HiSelectableList/HiSelectableListItem.js +7 -5
  47. package/es/HiTable/BodyCellBuilder.js +11 -4
  48. package/es/HiTable/BodyCells/CellAccount.js +7 -5
  49. package/es/HiTable/BodyCells/CellAccountNumber.js +6 -1
  50. package/es/HiTable/BodyCells/CellAddress.js +6 -1
  51. package/es/HiTable/BodyCells/CellCountry.js +6 -1
  52. package/es/HiTable/BodyCells/CellDate.js +35 -40
  53. package/es/HiTable/BodyCells/CellIcon.js +6 -1
  54. package/es/HiTable/BodyCells/CellImage.js +6 -1
  55. package/es/HiTable/BodyCells/CellNumeric.js +6 -1
  56. package/es/HiTable/BodyCells/CellRate.js +6 -1
  57. package/es/HiTable/BodyCells/CellSentinel.js +6 -1
  58. package/es/HiTable/BodyCells/CellStatus.js +6 -1
  59. package/es/HiTable/BodyCells/CellText.js +50 -20
  60. package/es/HiTable/BodyCells/CellThirdPartySecurity.js +6 -1
  61. package/es/HiTable/BodyRow.js +7 -2
  62. package/es/HiTable/ColumnFilter.js +1 -4
  63. package/es/HiTable/HeaderCell.js +16 -9
  64. package/es/HiTable/HiStickyRow.js +21 -14
  65. package/es/HiTable/HiTable.js +4 -40
  66. package/es/HiTable/HiTableBody.js +78 -26
  67. package/es/HiTable/HiTableContextMenu.js +28 -16
  68. package/es/HiTable/HiTableFooter.js +5 -0
  69. package/es/HiTable/HiTableHead.js +11 -6
  70. package/es/HiTopBar/HiTopBar.js +5 -0
  71. package/es/svg-icons/Cancel.js +2 -0
  72. package/es/svg-icons/HiBriefcaseRescue.js +15 -0
  73. package/es/svg-icons/index.js +2 -1
  74. package/es/utils/HiIconBuilder.js +6 -2
  75. package/index.es.js +1 -1
  76. package/index.js +1 -1
  77. package/package.json +7 -1
  78. package/svg-icons/Cancel.js +2 -0
  79. package/svg-icons/HiBriefcaseRescue.js +30 -0
  80. package/svg-icons/index.js +9 -0
  81. package/umd/hipay-material-ui.development.js +110915 -119592
  82. package/umd/hipay-material-ui.production.min.js +5 -5
  83. package/utils/HiIconBuilder.js +6 -2
@@ -112,59 +112,61 @@ var HiSelectableList = function (_React$PureComponent) {
112
112
  _List2.default,
113
113
  { className: classes.root, onKeyDown: this.props.onKeyDown },
114
114
  itemList.map(function (item) {
115
- /**
116
- * Calcul du level de l'item
117
- */
118
- if (hierarchic) {
119
- // On stocke l'id des parents dans un tableau
120
- if (item.parentId && !parents.includes(item.parentId)) {
121
- parents.push(item.parentId);
122
- } else if (item.parentId && parents.includes(item.parentId)) {
123
- // Si l'item n'a pas de parentId ou qu'on l'a déjà stocké :
124
- // Et si le parentId n'est pas le dernier inseré
125
- if (item.parentId !== parents[parents.length - 1]) {
126
- // On est donc redescendu d'un niveau
127
- // donc on supprime le dernier parent
128
- parents.pop();
115
+ if (item.displayed !== false) {
116
+ /**
117
+ * Calcul du level de l'item
118
+ */
119
+ if (hierarchic) {
120
+ // On stocke l'id des parents dans un tableau
121
+ if (item.parentId && !parents.includes(item.parentId)) {
122
+ parents.push(item.parentId);
123
+ } else if (item.parentId && parents.includes(item.parentId)) {
124
+ // Si l'item n'a pas de parentId ou qu'on l'a déjà stocké :
125
+ // Et si le parentId n'est pas le dernier inseré
126
+ if (item.parentId !== parents[parents.length - 1]) {
127
+ // On est donc redescendu d'un niveau
128
+ // donc on supprime le dernier parent
129
+ parents.pop();
130
+ }
131
+ } else if (!item.parentId && parents.length > 0) {
132
+ // Si l'item n'a pas de parent et que le tableau des parent
133
+ // n'est pas vide => on le réinitialise
134
+ parents = [];
129
135
  }
130
- } else if (!item.parentId && parents.length > 0) {
131
- // Si l'item n'a pas de parent et que le tableau des parent
132
- // n'est pas vide => on le réinitialise
133
- parents = [];
134
136
  }
135
- }
136
137
 
137
- /**
138
- * L'élément est-il selectionné ?
139
- */
140
- var selected = false;
141
- if (item.id === '_all') {
142
- selected = allSelected;
143
- } else if (!item.hasChildren) {
144
- selected = selectedIdList.includes(item.id);
145
- } else if (hierarchic && parentItemSelectable) {
146
- selected = hierarchySelected[item.id].length === hierarchy[item.id].length;
147
- }
138
+ /**
139
+ * L'élément est-il selectionné ?
140
+ */
141
+ var selected = false;
142
+ if (item.id === '_all') {
143
+ selected = allSelected;
144
+ } else if (!item.hasChildren) {
145
+ selected = selectedIdList.includes(item.id);
146
+ } else if (hierarchic && parentItemSelectable) {
147
+ selected = hierarchySelected[item.id].length === hierarchy[item.id].length;
148
+ }
148
149
 
149
- return _react2.default.createElement(_HiSelectableListItem2.default, (0, _extends3.default)({
150
- key: item.id,
151
- item: item,
152
- selected: selected,
153
- indeterminate: item.hasChildren && parentItemSelectable ? hierarchySelected[item.id].length > 0 && hierarchySelected[item.id].length !== hierarchy[item.id].length : false,
154
- onSelect: onSelect,
155
- hierarchySelected: hierarchySelected,
156
- parentItemSelectable: parentItemSelectable,
157
- nbChildren: typeof hierarchy !== 'undefined' && typeof hierarchy[item.id] !== 'undefined' ? hierarchy[item.id].length : 0,
158
- hierarchic: hierarchic,
159
- translations: translations,
160
- icon: icon,
161
- parentIcon: parentIcon,
162
- hoverIcon: hoverIcon,
163
- checkedIcon: checkedIcon,
164
- checkbox: checkbox,
165
- level: parents.length,
166
- disabled: disabledIds ? disabledIds.includes(item.id) : false
167
- }, others));
150
+ return _react2.default.createElement(_HiSelectableListItem2.default, (0, _extends3.default)({
151
+ key: item.id,
152
+ item: item,
153
+ selected: selected,
154
+ indeterminate: item.hasChildren && parentItemSelectable ? hierarchySelected[item.id].length > 0 && hierarchySelected[item.id].length !== hierarchy[item.id].length : false,
155
+ onSelect: onSelect,
156
+ hierarchySelected: hierarchySelected,
157
+ parentItemSelectable: parentItemSelectable,
158
+ nbChildren: typeof hierarchy !== 'undefined' && typeof hierarchy[item.id] !== 'undefined' ? hierarchy[item.id].length : 0,
159
+ hierarchic: hierarchic,
160
+ translations: translations,
161
+ icon: icon,
162
+ parentIcon: parentIcon,
163
+ hoverIcon: hoverIcon,
164
+ checkedIcon: checkedIcon,
165
+ checkbox: checkbox,
166
+ level: item.level ? item.level : parents.length,
167
+ disabled: disabledIds ? disabledIds.includes(item.id) : false
168
+ }, others));
169
+ }
168
170
  })
169
171
  )
170
172
  );
@@ -82,9 +82,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
82
82
  var styles = exports.styles = function styles(theme) {
83
83
  return {
84
84
  listItem: {
85
- padding: 9 + 'px 0px',
85
+ padding: '9px 0px',
86
86
  fontWeight: theme.typography.fontWeightRegular,
87
- maxHeight: 40
87
+ maxHeight: 40,
88
+ display: 'flex',
89
+ alignItems: 'flex-start'
88
90
  },
89
91
  listItemTitle: {
90
92
  padding: 9 + 'px 0px',
@@ -396,7 +398,7 @@ var HiSelectableListItem = function (_React$Component) {
396
398
 
397
399
  if (leftPadding) {
398
400
  paddingLeft = leftPadding;
399
- } else if (!hierarchic) {
401
+ } else if (!hierarchic && level === 0) {
400
402
  // Si pas de hiérarchie et sans checkbox, padding de 8px
401
403
  if (!effectiveCheckbox) {
402
404
  paddingLeft = 8;
@@ -413,9 +415,9 @@ var HiSelectableListItem = function (_React$Component) {
413
415
  }
414
416
  } else if (level > 0) {
415
417
  if (effectiveCheckbox) {
416
- paddingLeft = 16 * (level - 1);
417
- } else {
418
418
  paddingLeft = 16 * level;
419
+ } else {
420
+ paddingLeft = 16 * (level + 1);
419
421
  }
420
422
  } else if (!effectiveCheckbox) {
421
423
  if (item.id === '_all') {
@@ -12,6 +12,10 @@ var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProp
12
12
 
13
13
  var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
14
14
 
15
+ var _stringify = require('babel-runtime/core-js/json/stringify');
16
+
17
+ var _stringify2 = _interopRequireDefault(_stringify);
18
+
15
19
  var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
16
20
 
17
21
  var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -57,8 +61,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
57
61
  /**
58
62
  * Construit la cellule correspondante au type demandé
59
63
  */
60
- var BodyCellBuilder = function (_React$PureComponent) {
61
- (0, _inherits3.default)(BodyCellBuilder, _React$PureComponent);
64
+ var BodyCellBuilder = function (_React$Component) {
65
+ (0, _inherits3.default)(BodyCellBuilder, _React$Component);
62
66
 
63
67
  function BodyCellBuilder(props) {
64
68
  (0, _classCallCheck3.default)(this, BodyCellBuilder);
@@ -69,16 +73,21 @@ var BodyCellBuilder = function (_React$PureComponent) {
69
73
  return _this;
70
74
  }
71
75
 
72
- /**
73
- * CollecContextMenuDatas
74
- *
75
- * définit les données utilisées par le context menu (lookup, exclude, copy, redirect)
76
- * - value : valeur sur laquelle on filtre
77
- * - label : label de la value (traduite)
78
- */
76
+ (0, _createClass3.default)(BodyCellBuilder, [{
77
+ key: 'shouldComponentUpdate',
78
+ value: function shouldComponentUpdate(nextProps, nextState) {
79
+ return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
80
+ }
79
81
 
82
+ /**
83
+ * CollecContextMenuDatas
84
+ *
85
+ * définit les données utilisées par le context menu (lookup, exclude, copy, redirect)
86
+ * - value : valeur sur laquelle on filtre
87
+ * - label : label de la value (traduite)
88
+ */
80
89
 
81
- (0, _createClass3.default)(BodyCellBuilder, [{
90
+ }, {
82
91
  key: 'collectContextMenuDatas',
83
92
  value: function collectContextMenuDatas() {
84
93
  var _props$data = this.props.data,
@@ -205,7 +214,8 @@ var BodyCellBuilder = function (_React$PureComponent) {
205
214
  locale: dateLocale,
206
215
  view: view,
207
216
  displayTime: props.displayTime,
208
- sticky: sticky
217
+ sticky: sticky,
218
+ formatShort: this.props.formatShort
209
219
  });
210
220
  break;
211
221
 
@@ -289,10 +299,11 @@ var BodyCellBuilder = function (_React$PureComponent) {
289
299
  default:
290
300
  cellElement = _react2.default.createElement(_BodyCells.CellText, {
291
301
  ukey: ukey,
292
- value: data.value,
302
+ value: data.label ? data.label : data.value,
293
303
  ellipsis: ellipsis,
294
304
  view: view,
295
- sticky: sticky
305
+ sticky: sticky,
306
+ color: data.color
296
307
  });
297
308
  break;
298
309
  }
@@ -315,7 +326,7 @@ var BodyCellBuilder = function (_React$PureComponent) {
315
326
  }
316
327
  }]);
317
328
  return BodyCellBuilder;
318
- }(_react2.default.PureComponent);
329
+ }(_react2.default.Component);
319
330
 
320
331
  BodyCellBuilder.defaultProps = {
321
332
  ellipsis: 'right',
@@ -3,7 +3,10 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.styles = undefined;
6
+
7
+ var _stringify = require('babel-runtime/core-js/json/stringify');
8
+
9
+ var _stringify2 = _interopRequireDefault(_stringify);
7
10
 
8
11
  var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
9
12
 
@@ -41,23 +44,13 @@ var _HiColoredLabel = require('../../HiColoredLabel');
41
44
 
42
45
  var _HiColoredLabel2 = _interopRequireDefault(_HiColoredLabel);
43
46
 
44
- var _withStyles = require('../../styles/withStyles');
45
-
46
- var _withStyles2 = _interopRequireDefault(_withStyles);
47
-
48
47
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
49
48
 
50
- var styles = exports.styles = function styles(theme) {
51
- return {};
52
- };
53
-
54
49
  /**
55
50
  * Cette cellule permet d'afficher le nom d'un compte sous la forme d'un label coloré.
56
51
  */
57
-
58
-
59
- var CellAccount = function (_React$PureComponent) {
60
- (0, _inherits3.default)(CellAccount, _React$PureComponent);
52
+ var CellAccount = function (_React$Component) {
53
+ (0, _inherits3.default)(CellAccount, _React$Component);
61
54
 
62
55
  function CellAccount() {
63
56
  (0, _classCallCheck3.default)(this, CellAccount);
@@ -65,6 +58,11 @@ var CellAccount = function (_React$PureComponent) {
65
58
  }
66
59
 
67
60
  (0, _createClass3.default)(CellAccount, [{
61
+ key: 'shouldComponentUpdate',
62
+ value: function shouldComponentUpdate(nextProps, nextState) {
63
+ return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
64
+ }
65
+ }, {
68
66
  key: 'render',
69
67
  value: function render() {
70
68
  var _props = this.props,
@@ -80,7 +78,7 @@ var CellAccount = function (_React$PureComponent) {
80
78
  }
81
79
  }]);
82
80
  return CellAccount;
83
- }(_react2.default.PureComponent);
81
+ }(_react2.default.Component);
84
82
 
85
83
  CellAccount.defaultProps = {};
86
84
  CellAccount.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -97,4 +95,4 @@ CellAccount.propTypes = process.env.NODE_ENV !== "production" ? {
97
95
  */
98
96
  value: _propTypes2.default.string.isRequired
99
97
  } : {};
100
- exports.default = (0, _withStyles2.default)(styles, { name: 'HmuiCellAccount' })(CellAccount);
98
+ exports.default = CellAccount;
@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.styles = undefined;
7
7
 
8
+ var _stringify = require('babel-runtime/core-js/json/stringify');
9
+
10
+ var _stringify2 = _interopRequireDefault(_stringify);
11
+
8
12
  var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
9
13
 
10
14
  var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -86,8 +90,8 @@ var styles = exports.styles = function styles(theme) {
86
90
  * Le tooltip affiche les informations complémentaires (country, expiration date..)
87
91
  */
88
92
 
89
- var CellAccountNumber = function (_React$PureComponent) {
90
- (0, _inherits3.default)(CellAccountNumber, _React$PureComponent);
93
+ var CellAccountNumber = function (_React$Component) {
94
+ (0, _inherits3.default)(CellAccountNumber, _React$Component);
91
95
 
92
96
  function CellAccountNumber() {
93
97
  (0, _classCallCheck3.default)(this, CellAccountNumber);
@@ -95,6 +99,11 @@ var CellAccountNumber = function (_React$PureComponent) {
95
99
  }
96
100
 
97
101
  (0, _createClass3.default)(CellAccountNumber, [{
102
+ key: 'shouldComponentUpdate',
103
+ value: function shouldComponentUpdate(nextProps, nextState) {
104
+ return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
105
+ }
106
+ }, {
98
107
  key: 'render',
99
108
  value: function render() {
100
109
  var _this2 = this;
@@ -180,7 +189,7 @@ var CellAccountNumber = function (_React$PureComponent) {
180
189
  }
181
190
  }]);
182
191
  return CellAccountNumber;
183
- }(_react2.default.PureComponent);
192
+ }(_react2.default.Component);
184
193
 
185
194
  CellAccountNumber.propTypes = process.env.NODE_ENV !== "production" ? {
186
195
  /**
@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.styles = undefined;
7
7
 
8
+ var _stringify = require('babel-runtime/core-js/json/stringify');
9
+
10
+ var _stringify2 = _interopRequireDefault(_stringify);
11
+
8
12
  var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
9
13
 
10
14
  var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -74,8 +78,8 @@ var styles = exports.styles = function styles(theme) {
74
78
  * - tous les champs définis sont affichés dans le tooltip
75
79
  */
76
80
 
77
- var CellAddress = function (_React$PureComponent) {
78
- (0, _inherits3.default)(CellAddress, _React$PureComponent);
81
+ var CellAddress = function (_React$Component) {
82
+ (0, _inherits3.default)(CellAddress, _React$Component);
79
83
 
80
84
  function CellAddress() {
81
85
  (0, _classCallCheck3.default)(this, CellAddress);
@@ -83,6 +87,11 @@ var CellAddress = function (_React$PureComponent) {
83
87
  }
84
88
 
85
89
  (0, _createClass3.default)(CellAddress, [{
90
+ key: 'shouldComponentUpdate',
91
+ value: function shouldComponentUpdate(nextProps, nextState) {
92
+ return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
93
+ }
94
+ }, {
86
95
  key: 'render',
87
96
  value: function render() {
88
97
  var _props = this.props,
@@ -157,7 +166,7 @@ var CellAddress = function (_React$PureComponent) {
157
166
  }
158
167
  }]);
159
168
  return CellAddress;
160
- }(_react2.default.PureComponent);
169
+ }(_react2.default.Component);
161
170
 
162
171
  CellAddress.defaultProps = {
163
172
  view: 'l'
@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.styles = undefined;
7
7
 
8
+ var _stringify = require('babel-runtime/core-js/json/stringify');
9
+
10
+ var _stringify2 = _interopRequireDefault(_stringify);
11
+
8
12
  var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
9
13
 
10
14
  var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -94,8 +98,8 @@ var styles = exports.styles = function styles(theme) {
94
98
  *
95
99
  */
96
100
 
97
- var CellCountry = function (_React$PureComponent) {
98
- (0, _inherits3.default)(CellCountry, _React$PureComponent);
101
+ var CellCountry = function (_React$Component) {
102
+ (0, _inherits3.default)(CellCountry, _React$Component);
99
103
 
100
104
  function CellCountry() {
101
105
  (0, _classCallCheck3.default)(this, CellCountry);
@@ -103,6 +107,11 @@ var CellCountry = function (_React$PureComponent) {
103
107
  }
104
108
 
105
109
  (0, _createClass3.default)(CellCountry, [{
110
+ key: 'shouldComponentUpdate',
111
+ value: function shouldComponentUpdate(nextProps, nextState) {
112
+ return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
113
+ }
114
+ }, {
106
115
  key: 'render',
107
116
  value: function render() {
108
117
  var _props = this.props,
@@ -120,7 +129,7 @@ var CellCountry = function (_React$PureComponent) {
120
129
  }
121
130
  }]);
122
131
  return CellCountry;
123
- }(_react2.default.PureComponent);
132
+ }(_react2.default.Component);
124
133
 
125
134
  CellCountry.propTypes = process.env.NODE_ENV !== "production" ? {
126
135
  /**
@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.styles = undefined;
7
7
 
8
- var _extends2 = require('babel-runtime/helpers/extends');
8
+ var _stringify = require('babel-runtime/core-js/json/stringify');
9
9
 
10
- var _extends3 = _interopRequireDefault(_extends2);
10
+ var _stringify2 = _interopRequireDefault(_stringify);
11
11
 
12
12
  var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
13
13
 
@@ -37,6 +37,12 @@ var _propTypes = require('prop-types');
37
37
 
38
38
  var _propTypes2 = _interopRequireDefault(_propTypes);
39
39
 
40
+ var _moment = require('moment');
41
+
42
+ var _moment2 = _interopRequireDefault(_moment);
43
+
44
+ require('moment/locale/fr');
45
+
40
46
  var _withStyles = require('../../styles/withStyles');
41
47
 
42
48
  var _withStyles2 = _interopRequireDefault(_withStyles);
@@ -53,16 +59,14 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
53
59
 
54
60
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
55
61
 
56
- var styles = exports.styles = function styles(theme) {
57
- return {
58
- rightEllipsisSpan: {
59
- display: 'inline-block',
60
- overflow: 'hidden',
61
- textOverflow: 'ellipsis',
62
- whiteSpace: 'pre',
63
- width: '100%'
64
- }
65
- };
62
+ var styles = exports.styles = {
63
+ rightEllipsisSpan: {
64
+ display: 'inline-block',
65
+ overflow: 'hidden',
66
+ textOverflow: 'ellipsis',
67
+ whiteSpace: 'pre',
68
+ width: '100%'
69
+ }
66
70
  };
67
71
 
68
72
  /**
@@ -73,11 +77,25 @@ var CellDate = function (_React$Component) {
73
77
  (0, _inherits3.default)(CellDate, _React$Component);
74
78
 
75
79
  function CellDate() {
80
+ var _ref;
81
+
82
+ var _temp, _this, _ret;
83
+
76
84
  (0, _classCallCheck3.default)(this, CellDate);
77
- return (0, _possibleConstructorReturn3.default)(this, (CellDate.__proto__ || (0, _getPrototypeOf2.default)(CellDate)).apply(this, arguments));
85
+
86
+ for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
87
+ args[_key] = arguments[_key];
88
+ }
89
+
90
+ return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = CellDate.__proto__ || (0, _getPrototypeOf2.default)(CellDate)).call.apply(_ref, [this].concat(args))), _this), _this.formatLong = 'dddd DD MMMM YYYY HH:mm:ss', _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
78
91
  }
79
92
 
80
93
  (0, _createClass3.default)(CellDate, [{
94
+ key: 'shouldComponentUpdate',
95
+ value: function shouldComponentUpdate(nextProps, nextState) {
96
+ return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
97
+ }
98
+ }, {
81
99
  key: 'render',
82
100
  value: function render() {
83
101
  var _props = this.props,
@@ -85,44 +103,19 @@ var CellDate = function (_React$Component) {
85
103
  displayTime = _props.displayTime,
86
104
  value = _props.value,
87
105
  locale = _props.locale,
88
- view = _props.view;
89
-
90
-
91
- var date = new Date(value);
92
-
93
- var options = (0, _extends3.default)({
94
- weekday: 'long',
95
- year: 'numeric',
96
- month: 'long',
97
- day: '2-digit'
98
- }, displayTime && {
99
- hour: '2-digit',
100
- minute: '2-digit',
101
- second: '2-digit'
102
- });
103
- var titleValue = date.toLocaleString(locale, options);
106
+ view = _props.view,
107
+ formatShort = _props.formatShort;
108
+
109
+
110
+ var date = (0, _moment2.default)(value);
111
+ date.locale(locale);
112
+
113
+ var titleValue = displayTime ? date.format(this.formatLong) : date.format(this.formatLong.replace(' HH:mm:ss', ''));
104
114
  var displayedValue = titleValue;
105
115
  if (view === cst.VIEWS.SMALL) {
106
- options = (0, _extends3.default)({
107
- year: '2-digit',
108
- month: '2-digit',
109
- day: '2-digit'
110
- }, displayTime && {
111
- hour: '2-digit',
112
- minute: '2-digit'
113
- });
114
- displayedValue = date.toLocaleString(locale, options);
116
+ displayedValue = displayTime ? date.format(formatShort.replace('YYYY', 'YY') + ' HH:mm:ss') : date.format(formatShort.replace('YYYY', 'YY'));
115
117
  } else if (view === cst.VIEWS.MEDIUM) {
116
- options = (0, _extends3.default)({
117
- year: 'numeric',
118
- month: '2-digit',
119
- day: '2-digit'
120
- }, displayTime && {
121
- hour: '2-digit',
122
- minute: '2-digit',
123
- second: '2-digit'
124
- });
125
- displayedValue = date.toLocaleString(locale, options);
118
+ displayedValue = displayTime ? date.format(formatShort + ' HH:mm:ss') : date.format(formatShort);
126
119
  }
127
120
 
128
121
  if (view === cst.VIEWS.LARGE) {
@@ -149,8 +142,9 @@ var CellDate = function (_React$Component) {
149
142
 
150
143
  CellDate.defaultProps = {
151
144
  displayTime: false,
152
- locale: 'en-EN',
153
- view: 'l'
145
+ locale: 'en',
146
+ view: 'l',
147
+ formatShort: 'DD/MM/YYYY'
154
148
  };
155
149
  CellDate.propTypes = process.env.NODE_ENV !== "production" ? {
156
150
  /**
@@ -162,11 +156,21 @@ CellDate.propTypes = process.env.NODE_ENV !== "production" ? {
162
156
  */
163
157
  displayTime: _propTypes2.default.bool,
164
158
  /**
165
- * Locale BCP 47
159
+ * Format de la date en vue small (ex: DD/MM/YYYY)
160
+ * @see https://momentjs.com/docs/#/parsing/string-format/
161
+ */
162
+ formatShort: _propTypes2.default.string.isRequired,
163
+ /**
164
+ * Locale moment
166
165
  */
167
166
  locale: _propTypes2.default.string,
168
167
  /**
169
- * Volume/Amount
168
+ * True si la colonne est la première colonne et
169
+ * doit avoir un comportement "sticky" lors du scroll horizontal
170
+ */
171
+ sticky: _propTypes2.default.bool,
172
+ /**
173
+ * Date as string
170
174
  */
171
175
  value: _propTypes2.default.string.isRequired,
172
176
  /**
@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.styles = undefined;
7
7
 
8
+ var _stringify = require('babel-runtime/core-js/json/stringify');
9
+
10
+ var _stringify2 = _interopRequireDefault(_stringify);
11
+
8
12
  var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
9
13
 
10
14
  var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -75,8 +79,8 @@ var styles = exports.styles = {
75
79
  * En vue small (s) elle affiche uniquement l'icône avec une largeur fixe.
76
80
  */
77
81
 
78
- var CellIcon = function (_React$PureComponent) {
79
- (0, _inherits3.default)(CellIcon, _React$PureComponent);
82
+ var CellIcon = function (_React$Component) {
83
+ (0, _inherits3.default)(CellIcon, _React$Component);
80
84
 
81
85
  function CellIcon() {
82
86
  (0, _classCallCheck3.default)(this, CellIcon);
@@ -84,6 +88,11 @@ var CellIcon = function (_React$PureComponent) {
84
88
  }
85
89
 
86
90
  (0, _createClass3.default)(CellIcon, [{
91
+ key: 'shouldComponentUpdate',
92
+ value: function shouldComponentUpdate(nextProps, nextState) {
93
+ return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
94
+ }
95
+ }, {
87
96
  key: 'render',
88
97
  value: function render() {
89
98
  var _props = this.props,
@@ -124,7 +133,7 @@ var CellIcon = function (_React$PureComponent) {
124
133
  }
125
134
  }]);
126
135
  return CellIcon;
127
- }(_react2.default.PureComponent);
136
+ }(_react2.default.Component);
128
137
 
129
138
  CellIcon.defaultProps = {
130
139
  icon: '',