@hipay/hipay-material-ui 1.0.0-beta.12 → 1.0.0-beta.14

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.
@@ -0,0 +1,131 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.styles = undefined;
7
+
8
+ var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
9
+
10
+ var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
11
+
12
+ var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
13
+
14
+ var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
15
+
16
+ var _createClass2 = require('babel-runtime/helpers/createClass');
17
+
18
+ var _createClass3 = _interopRequireDefault(_createClass2);
19
+
20
+ var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
21
+
22
+ var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
23
+
24
+ var _inherits2 = require('babel-runtime/helpers/inherits');
25
+
26
+ var _inherits3 = _interopRequireDefault(_inherits2);
27
+
28
+ var _react = require('react');
29
+
30
+ var _react2 = _interopRequireDefault(_react);
31
+
32
+ var _Table = require('material-ui/Table');
33
+
34
+ var _styles = require('../styles');
35
+
36
+ var _propTypes = require('prop-types');
37
+
38
+ var _propTypes2 = _interopRequireDefault(_propTypes);
39
+
40
+ var _constants = require('./constants');
41
+
42
+ var cst = _interopRequireWildcard(_constants);
43
+
44
+ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
45
+
46
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
47
+
48
+ var styles = exports.styles = function styles(theme) {
49
+ return {
50
+ tfoot: {
51
+ zIndex: 13
52
+ },
53
+ tfootCell: {
54
+ borderTop: '1px solid',
55
+ borderTopColor: theme.palette.line.stepper
56
+ },
57
+ patchDiv: {
58
+ position: 'relative',
59
+ border: 'none',
60
+ width: 0,
61
+ paddingRight: 0,
62
+ paddingTop: 0,
63
+ paddingBottom: 0,
64
+ height: '100%',
65
+ zIndex: 12,
66
+ backgroundColor: 'inherit'
67
+ }
68
+ };
69
+ };
70
+
71
+ var HiTableFooter = function (_React$Component) {
72
+ (0, _inherits3.default)(HiTableFooter, _React$Component);
73
+
74
+ function HiTableFooter() {
75
+ (0, _classCallCheck3.default)(this, HiTableFooter);
76
+ return (0, _possibleConstructorReturn3.default)(this, (HiTableFooter.__proto__ || (0, _getPrototypeOf2.default)(HiTableFooter)).apply(this, arguments));
77
+ }
78
+
79
+ (0, _createClass3.default)(HiTableFooter, [{
80
+ key: 'render',
81
+ value: function render() {
82
+ var _props = this.props,
83
+ classes = _props.classes,
84
+ nbColumnsDisplayed = _props.nbColumnsDisplayed,
85
+ view = _props.view;
86
+
87
+
88
+ return _react2.default.createElement(
89
+ _Table.TableFooter,
90
+ { className: classes.tfoot },
91
+ _react2.default.createElement(
92
+ _Table.TableRow,
93
+ null,
94
+ _react2.default.createElement(_Table.TableCell, {
95
+ style: {
96
+ paddingLeft: cst.DEFAULT_PADDING[view]
97
+ },
98
+ key: 'footer-left-cell',
99
+ className: classes.patchDiv
100
+ }),
101
+ _react2.default.createElement(
102
+ _Table.TableCell,
103
+ { colSpan: nbColumnsDisplayed, classes: { root: classes.tfootCell } },
104
+ this.props.children
105
+ ),
106
+ _react2.default.createElement(_Table.TableCell, {
107
+ style: {
108
+ paddingLeft: cst.DEFAULT_PADDING[view]
109
+ },
110
+ key: 'footer-right-cell',
111
+ className: classes.patchDiv
112
+ })
113
+ )
114
+ );
115
+ }
116
+ }]);
117
+ return HiTableFooter;
118
+ }(_react2.default.Component);
119
+
120
+ HiTableFooter.propTypes = process.env.NODE_ENV !== "production" ? {
121
+ /**
122
+ * Nombre de colonnes affichées
123
+ */
124
+ nbColumnsDisplayed: _propTypes2.default.number.isRequired,
125
+ /**
126
+ * Taille du tableau (L/M/S),
127
+ * définit l'espace entre les cellules et leurs tailles par default
128
+ */
129
+ view: _propTypes2.default.oneOf(['l', 'm', 's'])
130
+ } : {};
131
+ exports.default = (0, _styles.withStyles)(styles, { name: 'HmuiHiTableFooter' })(HiTableFooter);
@@ -6,6 +6,8 @@ import React from 'react';
6
6
  import PropTypes from 'prop-types';
7
7
  import { formatDate, parseDate } from 'react-day-picker/moment';
8
8
  import DayPickerInput from 'react-day-picker/DayPickerInput';
9
+ import classNames from 'classnames';
10
+
9
11
  import withStyles from '../styles/withStyles';
10
12
  import { capitalizeFirstLetter } from '../utils/helpers';
11
13
  import Caption from './Caption';
@@ -23,11 +25,14 @@ class HiDateRangePicker extends React.Component {
23
25
  constructor(props) {
24
26
  super();
25
27
 
28
+ this.handleDayPickerFocus = name => () => {
29
+ this.setState({ focusedInput: name });
30
+ };
31
+
26
32
  this.state = {
27
- fromOpenedPanel: 'calendar',
28
33
  fromCurrentMonth: props.from ? props.from : new Date(),
29
- toOpenedPanel: 'calendar',
30
- toCurrentMonth: props.to ? props.to : new Date()
34
+ toCurrentMonth: props.to ? props.to : new Date(),
35
+ focusedInput: ''
31
36
  };
32
37
 
33
38
  this.handleReset = this.handleReset.bind(this);
@@ -51,6 +56,8 @@ class HiDateRangePicker extends React.Component {
51
56
  this.handleYearClick = this.handleYearClick.bind(this);
52
57
  this.handleYearClickFrom = this.handleYearClickFrom.bind(this);
53
58
  this.handleYearClickTo = this.handleYearClickTo.bind(this);
59
+ this.handleDayPickerFocus = this.handleDayPickerFocus.bind(this);
60
+ this.handleDayPickerBlur = this.handleDayPickerBlur.bind(this);
54
61
 
55
62
  this.openPanel = this.openPanel.bind(this);
56
63
 
@@ -207,6 +214,10 @@ class HiDateRangePicker extends React.Component {
207
214
  }
208
215
  }
209
216
 
217
+ handleDayPickerBlur() {
218
+ this.setState({ focusedInput: '' });
219
+ }
220
+
210
221
  openPanel(name, panel) {
211
222
  this.setState({
212
223
  [`${name}OpenedPanel`]: panel
@@ -239,9 +250,10 @@ class HiDateRangePicker extends React.Component {
239
250
  return this.renderNavbar('to', propsNavbar);
240
251
  }
241
252
 
242
- renderOverlay(name, propsOverlay) {
253
+ renderOverlay(name, propsOverlay, staticPosition) {
243
254
  const rangeOverlayProps = _extends({}, propsOverlay, {
244
- side: name
255
+ side: name,
256
+ staticPosition
245
257
  });
246
258
 
247
259
  switch (this.state[`${name}OpenedPanel`]) {
@@ -257,10 +269,10 @@ class HiDateRangePicker extends React.Component {
257
269
  }
258
270
  }
259
271
  renderOverlayFrom(propsOverlay) {
260
- return this.renderOverlay('from', propsOverlay);
272
+ return this.renderOverlay('from', propsOverlay, this.props.staticPosition);
261
273
  }
262
274
  renderOverlayTo(propsOverlay) {
263
- return this.renderOverlay('to', propsOverlay);
275
+ return this.renderOverlay('to', propsOverlay, this.props.staticPosition);
264
276
  }
265
277
 
266
278
  renderMonthPickerOverlay(name, propsOverlay) {
@@ -315,9 +327,10 @@ class HiDateRangePicker extends React.Component {
315
327
  onReset,
316
328
  to,
317
329
  translations,
318
- id
330
+ id,
331
+ staticPosition
319
332
  } = _props,
320
- props = _objectWithoutProperties(_props, ['classes', 'disabledDays', 'disablePastDays', 'disableFutureDays', 'enableTime', 'labelFrom', 'labelTo', 'locale', 'format', 'from', 'minimumDate', 'onReset', 'to', 'translations', 'id']);
333
+ props = _objectWithoutProperties(_props, ['classes', 'disabledDays', 'disablePastDays', 'disableFutureDays', 'enableTime', 'labelFrom', 'labelTo', 'locale', 'format', 'from', 'minimumDate', 'onReset', 'to', 'translations', 'id', 'staticPosition']);
321
334
 
322
335
  const { fromCurrentMonth, toCurrentMonth } = this.state;
323
336
 
@@ -429,32 +442,52 @@ class HiDateRangePicker extends React.Component {
429
442
  id: `${id}-to`
430
443
  });
431
444
 
445
+ let fromClass = classNames({
446
+ [classes.absolute]: staticPosition === true && this.state.focusedInput === 'to',
447
+ [classes.dayPickerMargin]: staticPosition === true && this.state.focusedInput === 'to'
448
+ });
449
+ let toClass = classNames(classes.toInput, {
450
+ [classes.absolute]: staticPosition === true && this.state.focusedInput === 'from'
451
+ });
452
+
432
453
  return React.createElement(
433
454
  'div',
434
455
  { className: classes.root },
435
456
  React.createElement(
436
457
  'div',
437
- { className: classes.fromInput },
438
- React.createElement(DayPickerInput, {
439
- ref: el => {
440
- this.fromInput = el;
441
- },
442
- value: from,
443
- hideOnDayClick: false,
444
- overlayComponent: this.renderOverlayFrom,
445
- dayPickerProps: fromDayPickerProps,
446
- component: HiTextField,
447
- inputProps: fromInputProps,
448
- format: enableTime ? `${format} HH:mm` : format,
449
- formatDate: formatDate,
450
- parseDate: parseDate,
451
- onDayChange: this.handleDayChangeFrom,
452
- placeholder: ''
453
- })
458
+ {
459
+ className: classes.fromInput,
460
+ onFocus: this.handleDayPickerFocus('from'),
461
+ onBlur: this.handleDayPickerBlur
462
+ },
463
+ React.createElement(
464
+ 'div',
465
+ { className: fromClass },
466
+ React.createElement(DayPickerInput, {
467
+ ref: el => {
468
+ this.fromInput = el;
469
+ },
470
+ value: from,
471
+ hideOnDayClick: false,
472
+ overlayComponent: this.renderOverlayFrom,
473
+ dayPickerProps: fromDayPickerProps,
474
+ component: HiTextField,
475
+ inputProps: fromInputProps,
476
+ format: enableTime ? `${format} HH:mm` : format,
477
+ formatDate: formatDate,
478
+ parseDate: parseDate,
479
+ onDayChange: this.handleDayChangeFrom,
480
+ placeholder: ''
481
+ })
482
+ )
454
483
  ),
455
484
  React.createElement(
456
485
  'div',
457
- { className: classes.toInput },
486
+ {
487
+ className: toClass,
488
+ onFocus: this.handleDayPickerFocus('to'),
489
+ onBlur: this.handleDayPickerBlur
490
+ },
458
491
  React.createElement(DayPickerInput, {
459
492
  ref: el => {
460
493
  this.toInput = el;
@@ -480,6 +513,7 @@ HiDateRangePicker.defaultProps = {
480
513
  disabledDays: [],
481
514
  disablePastDays: false,
482
515
  disableFutureDays: false,
516
+ staticPosition: false,
483
517
  enableTime: false,
484
518
  format: 'YYYY-DD-MM',
485
519
  labelFrom: 'Start',
@@ -555,6 +589,10 @@ HiDateRangePicker.propTypes = process.env.NODE_ENV !== "production" ? {
555
589
  * Callback au reset de l'input
556
590
  */
557
591
  onReset: PropTypes.func,
592
+ /**
593
+ * Si true, le calendrier sera dans une div static plutot que dans une popper absolute
594
+ */
595
+ staticPosition: PropTypes.bool,
558
596
  /**
559
597
  * Date de fin sélectionnée
560
598
  */
@@ -127,11 +127,11 @@ class HiDateRangeSelector extends React.Component {
127
127
  if (selectedOption) {
128
128
  this.props.onChange('from', selectedOption.from.toDate());
129
129
  this.props.onChange('to', selectedOption.to.toDate());
130
- if (this.props.returnSelectValue === true) {
131
- this.props.onChange('period', value);
132
- }
133
130
  }
134
131
  }
132
+ if (this.props.returnSelectValue === true) {
133
+ this.props.onChange('period', value);
134
+ }
135
135
  };
136
136
 
137
137
  this.state = {
@@ -177,9 +177,10 @@ class HiDateRangeSelector extends React.Component {
177
177
  to,
178
178
  translations,
179
179
  classes,
180
- selectProps
180
+ selectProps,
181
+ staticPosition
181
182
  } = _props,
182
- props = _objectWithoutProperties(_props, ['disabled', 'enableTime', 'error', 'errorText', 'helperIcon', 'helperText', 'idRange', 'idSelect', 'label', 'from', 'onChange', 'required', 'to', 'translations', 'classes', 'selectProps']);
183
+ props = _objectWithoutProperties(_props, ['disabled', 'enableTime', 'error', 'errorText', 'helperIcon', 'helperText', 'idRange', 'idSelect', 'label', 'from', 'onChange', 'required', 'to', 'translations', 'classes', 'selectProps', 'staticPosition']);
183
184
 
184
185
  const { selectedPreset } = this.state;
185
186
 
@@ -209,7 +210,8 @@ class HiDateRangeSelector extends React.Component {
209
210
  translations: translations,
210
211
  value: selectedPreset,
211
212
  containerWidth: this.state.containerWidth,
212
- classes: { root: classes.dateSelect }
213
+ classes: { root: classes.dateSelect },
214
+ staticPosition: staticPosition
213
215
  }, selectProps))
214
216
  ),
215
217
  React.createElement(
@@ -224,7 +226,8 @@ class HiDateRangeSelector extends React.Component {
224
226
  onChange: onChange,
225
227
  onReset: this.handleReset,
226
228
  disabled: disabled || selectedPreset !== 'custom',
227
- translations: translations
229
+ translations: translations,
230
+ staticPosition: staticPosition
228
231
  }, props))
229
232
  )
230
233
  );
@@ -236,6 +239,7 @@ HiDateRangeSelector.defaultProps = {
236
239
  defaultPreset: 'cd',
237
240
  enableTime: false,
238
241
  returnSelectValue: false,
242
+ staticPosition: false,
239
243
  locale: 'fr-FR',
240
244
  format: 'YYYY-DD-MM',
241
245
  translations: {
@@ -337,6 +341,10 @@ HiDateRangeSelector.propTypes = process.env.NODE_ENV !== "production" ? {
337
341
  * Props passées au HiSelectField
338
342
  */
339
343
  selectProps: PropTypes.object,
344
+ /**
345
+ * Si true, le calendrier sera dans une div static plutot que dans une popper absolute
346
+ */
347
+ staticPosition: PropTypes.bool,
340
348
  /**
341
349
  * Date de fin sélectionnée
342
350
  */
@@ -9,10 +9,15 @@ import withStyles from '../../styles/withStyles';
9
9
 
10
10
  export const styles = () => ({
11
11
  paper: {
12
- position: 'absolute',
13
12
  width: '100%',
14
13
  zIndex: 10
15
14
  },
15
+ absolute: {
16
+ position: 'absolute'
17
+ },
18
+ relative: {
19
+ position: 'relative'
20
+ },
16
21
  left: {
17
22
  width: '200%',
18
23
  left: 0
@@ -26,10 +31,12 @@ export const styles = () => ({
26
31
  }
27
32
  });
28
33
 
29
- const Overlay = ({ classes, children, side }) => {
34
+ const Overlay = ({ classes, children, side, staticPosition }) => {
30
35
  const paperClass = classNames(classes.paper, {
31
36
  [classes.left]: side === 'from',
32
- [classes.right]: side === 'to'
37
+ [classes.right]: side === 'to',
38
+ [classes.absolute]: staticPosition !== true,
39
+ [classes.relative]: staticPosition === true
33
40
  });
34
41
 
35
42
  return React.createElement(
@@ -19,6 +19,13 @@ export default (theme => ({
19
19
  width: 'calc(50% - 4px)',
20
20
  marginLeft: 4
21
21
  },
22
+ absolute: {
23
+ position: 'absolute'
24
+ },
25
+ dayPickerMargin: {
26
+ top: -337,
27
+ width: 'calc(100% - 4px)'
28
+ },
22
29
  // The container element
23
30
  container: {
24
31
  width: '100%',
@@ -390,7 +390,7 @@ HiSelect.defaultProps = {
390
390
  };
391
391
 
392
392
  var _initialiseProps = function () {
393
- this.handleClick = event => {
393
+ this.handleClick = () => {
394
394
  if (this.state.open) {
395
395
  this.handleClose();
396
396
  } else {
@@ -75,9 +75,10 @@ export default class BodyCellBuilder extends React.PureComponent {
75
75
  childrenCount,
76
76
  onOpenDetails,
77
77
  lookedUp,
78
- fixedColumnWidth
78
+ fixedColumnWidth,
79
+ disableContextMenu
79
80
  } = _props,
80
- props = _objectWithoutProperties(_props, ['ukey', 'type', 'data', 'view', 'width', 'padding', 'align', 'dense', 'ellipsis', 'onSelect', 'selectable', 'selected', 'sticky', 'dateLocale', 'numberLocale', 'childrenCount', 'onOpenDetails', 'lookedUp', 'fixedColumnWidth']);
81
+ props = _objectWithoutProperties(_props, ['ukey', 'type', 'data', 'view', 'width', 'padding', 'align', 'dense', 'ellipsis', 'onSelect', 'selectable', 'selected', 'sticky', 'dateLocale', 'numberLocale', 'childrenCount', 'onOpenDetails', 'lookedUp', 'fixedColumnWidth', 'disableContextMenu']);
81
82
 
82
83
  const layoutProps = {
83
84
  type,
@@ -99,7 +100,6 @@ export default class BodyCellBuilder extends React.PureComponent {
99
100
  if (typeof data !== 'undefined') {
100
101
 
101
102
  let cellElement;
102
- let hasContextMenu = true;
103
103
 
104
104
  switch (type) {
105
105
  case cst.TYPE_ACCOUNT:
@@ -149,7 +149,6 @@ export default class BodyCellBuilder extends React.PureComponent {
149
149
  displayTime: props.displayTime,
150
150
  sticky: sticky
151
151
  });
152
- hasContextMenu = false;
153
152
  break;
154
153
 
155
154
  case cst.TYPE_ICON:
@@ -178,7 +177,6 @@ export default class BodyCellBuilder extends React.PureComponent {
178
177
  view: view,
179
178
  sticky: sticky
180
179
  });
181
- hasContextMenu = false;
182
180
  break;
183
181
 
184
182
  case cst.TYPE_RATE:
@@ -191,7 +189,6 @@ export default class BodyCellBuilder extends React.PureComponent {
191
189
  view: view,
192
190
  sticky: sticky
193
191
  });
194
- hasContextMenu = false;
195
192
  break;
196
193
 
197
194
  case cst.TYPE_SENTINEL:
@@ -236,14 +233,14 @@ export default class BodyCellBuilder extends React.PureComponent {
236
233
  break;
237
234
  }
238
235
 
239
- cellContent = hasContextMenu ? React.createElement(
236
+ cellContent = disableContextMenu ? cellElement : React.createElement(
240
237
  ContextMenuTrigger,
241
238
  {
242
239
  id: `hitable_context_menu_${this.props.tabId}`,
243
240
  collect: this.collectContextMenuDatas
244
241
  },
245
242
  cellElement
246
- ) : cellElement;
243
+ );
247
244
  }
248
245
 
249
246
  return React.createElement(
@@ -254,7 +251,8 @@ export default class BodyCellBuilder extends React.PureComponent {
254
251
  }
255
252
  }
256
253
  BodyCellBuilder.defaultProps = {
257
- ellipsis: 'right'
254
+ ellipsis: 'right',
255
+ disableContextMenu: true
258
256
  };
259
257
  BodyCellBuilder.propTypes = process.env.NODE_ENV !== "production" ? {
260
258
  /**
@@ -285,6 +283,10 @@ BodyCellBuilder.propTypes = process.env.NODE_ENV !== "production" ? {
285
283
  * Densité, défini la hauteur de la ligne
286
284
  */
287
285
  dense: PropTypes.bool,
286
+ /**
287
+ * Active/désactive le menu contextuel au clic droit sur les cellules du tableau
288
+ */
289
+ disableContextMenu: PropTypes.bool.isRequired,
288
290
  /**
289
291
  * Ellipsis
290
292
  */
@@ -38,6 +38,10 @@ export const styles = theme => ({
38
38
  },
39
39
  center: {
40
40
  textAlign: 'center'
41
+ },
42
+ tooltipContainer: {
43
+ display: 'flex',
44
+ alignItems: 'center'
41
45
  }
42
46
  });
43
47
 
@@ -53,7 +57,7 @@ class CellImage extends React.PureComponent {
53
57
 
54
58
  const tooltipContent = React.createElement(
55
59
  'div',
56
- null,
60
+ { className: classes.tooltipContainer },
57
61
  React.createElement('img', { src: path, alt: value, className: classes.tooltipImg }),
58
62
  React.createElement(
59
63
  'span',
@@ -5,10 +5,11 @@ import ArrowUp from 'mdi-material-ui/ArrowUp';
5
5
  import isRequiredIf from 'react-proptype-conditional-require';
6
6
  import HiButton from '../HiButton';
7
7
 
8
- import { withStyles, withTheme } from '../styles';
8
+ import { withStyles } from '../styles';
9
9
  import HiTableHead from './HiTableHead';
10
10
  import HiTableBody from './HiTableBody';
11
11
  import HiTableFooterScroll from './HiTableFooterScroll';
12
+ import HiTableFooter from './HiTableFooter';
12
13
  import * as cst from './constants';
13
14
  import HiTableContextMenu from './HiTableContextMenu';
14
15
 
@@ -583,13 +584,22 @@ class HiTable extends React.Component {
583
584
  groupBy,
584
585
  lookupColumns,
585
586
  loading,
586
- fixedColumnWidth
587
+ fixedColumnWidth,
588
+ disableContextMenu,
589
+ footerContent
587
590
  } = this.props;
588
591
 
589
592
  const { dateUpdate, isScrollToBottom, groupByIds } = this.state;
590
593
 
591
594
  const headerHeight = dense ? cst.CELL_HEADER_HEIGHT_DENSE : cst.CELL_HEADER_HEIGHT;
592
595
 
596
+ let nbColumnsDisplayed = 0;
597
+ orderedColumns.forEach(column => {
598
+ if (column.displayed !== false) {
599
+ nbColumnsDisplayed += 1;
600
+ }
601
+ });
602
+
593
603
  return React.createElement(
594
604
  'div',
595
605
  { className: classes.root },
@@ -657,7 +667,8 @@ class HiTable extends React.Component {
657
667
  groupByIds: groupByIds,
658
668
  lookupColumns: lookupColumns,
659
669
  loading: loading,
660
- fixedColumnWidth: fixedColumnWidth
670
+ fixedColumnWidth: fixedColumnWidth,
671
+ disableContextMenu: disableContextMenu
661
672
  }),
662
673
  infiniteScroll && React.createElement(HiTableFooterScroll, {
663
674
  tabId: tabId,
@@ -666,7 +677,15 @@ class HiTable extends React.Component {
666
677
  maxAutoRequest: 3,
667
678
  isScrollToBottom: isScrollToBottom,
668
679
  translations: translations
669
- })
680
+ }),
681
+ !infiniteScroll && footerContent && React.createElement(
682
+ HiTableFooter,
683
+ {
684
+ nbColumnsDisplayed: nbColumnsDisplayed,
685
+ view: view
686
+ },
687
+ footerContent
688
+ )
670
689
  ),
671
690
  React.createElement(HiTableContextMenu, {
672
691
  tabId: tabId,
@@ -724,7 +743,8 @@ HiTable.defaultProps = {
724
743
  view: 'l',
725
744
  lookupColumns: [],
726
745
  loading: false,
727
- fixedColumnWidth: true
746
+ fixedColumnWidth: true,
747
+ disableContextMenu: true
728
748
  };
729
749
  HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
730
750
  /**
@@ -751,6 +771,10 @@ HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
751
771
  * Densité d'affichage (joue sur la hauteur des lignes)
752
772
  */
753
773
  dense: PropTypes.bool,
774
+ /**
775
+ * Active/désactive le menu contextuel au clic droit sur les cellules du tableau
776
+ */
777
+ disableContextMenu: PropTypes.bool.isRequired,
754
778
  /**
755
779
  * Active le filtre sur les colonnes filtrables
756
780
  */
@@ -760,6 +784,10 @@ HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
760
784
  * Sinon les colonnes s'adaptent à l'espace disponible
761
785
  */
762
786
  fixedColumnWidth: PropTypes.bool,
787
+ /**
788
+ * Ajoute un footer avec le contenu footerContent à l'intérieur
789
+ */
790
+ footerContent: PropTypes.node,
763
791
  /**
764
792
  * Id de la colonne par laquelle sont regroupé les éléments
765
793
  */
@@ -832,6 +860,9 @@ HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
832
860
  /**
833
861
  * Fonction de callback sur le tri d'une colonne
834
862
  * Passe l'id de la colonne et la direction du tri (ou false si tri par défaut)
863
+ *
864
+ * @param {string} column id
865
+ * @param {string} direction
835
866
  */
836
867
  onSort: PropTypes.func,
837
868
  /**
@@ -194,7 +194,8 @@ class HiTableBody extends React.Component {
194
194
  sortedColumnId,
195
195
  lookupColumns,
196
196
  loading,
197
- fixedColumnWidth
197
+ fixedColumnWidth,
198
+ disableContextMenu
198
199
  } = this.props;
199
200
 
200
201
  const { openedParentRowId, openedDetailsRowIdList } = this.state;
@@ -292,7 +293,8 @@ class HiTableBody extends React.Component {
292
293
  sticky,
293
294
  tabId,
294
295
  view,
295
- fixedColumnWidth
296
+ fixedColumnWidth,
297
+ disableContextMenu
296
298
  });
297
299
 
298
300
  if (hasChildren && openedParentRowId === row.rowId) {
@@ -322,7 +324,8 @@ class HiTableBody extends React.Component {
322
324
  dense,
323
325
  sticky,
324
326
  isDetail: true,
325
- fixedColumnWidth
327
+ fixedColumnWidth,
328
+ disableContextMenu
326
329
  };
327
330
 
328
331
  tableRows.push(React.createElement(BodyRow, _extends({ key: `${row.rowId}-${detailRow.rowId}` }, detailRowProps)));
@@ -363,7 +366,8 @@ HiTableBody.defaultProps = {
363
366
  height: 450,
364
367
  sticky: true,
365
368
  view: 'l',
366
- loading: false
369
+ loading: false,
370
+ disableContextMenu: true
367
371
  };
368
372
  HiTableBody.propTypes = process.env.NODE_ENV !== "production" ? {
369
373
  /**
@@ -391,6 +395,10 @@ HiTableBody.propTypes = process.env.NODE_ENV !== "production" ? {
391
395
  * Densité d'affichage (joue sur la hauteur des lignes)
392
396
  */
393
397
  dense: PropTypes.bool,
398
+ /**
399
+ * Active/désactive le menu contextuel au clic droit sur les cellules du tableau
400
+ */
401
+ disableContextMenu: PropTypes.bool.isRequired,
394
402
  /**
395
403
  * Fixe la taille des colonnes selon le type de vue
396
404
  * Sinon les colonnes s'adaptent à l'espace disponible