@hipay/hipay-material-ui 2.0.0-beta.68 → 2.0.0-beta.70

Sign up to get free protection for your applications and to get access to all the features.
Files changed (40) hide show
  1. package/CHANGELOG.md +152 -0
  2. package/HiCell/CellIcon.js +33 -3
  3. package/HiCell/CellRate.js +1 -1
  4. package/HiCell/CellTextStyled.js +31 -0
  5. package/HiChip/HiChipSwitch.js +1 -1
  6. package/HiExpansionPanel/HiExpansionPanel.js +15 -4
  7. package/HiForm/HiInput.js +10 -4
  8. package/HiPin/HiPin.js +3 -3
  9. package/HiSelect/HiSelect.js +42 -22
  10. package/HiSelect/HiSelectInput.js +3 -2
  11. package/HiSelect/HiSuggestSelect.js +9 -2
  12. package/HiSelectableList/HiSelectableList.js +2 -2
  13. package/HiTable/HiCellBuilder.js +10 -5
  14. package/HiTable/HiTableHeader.js +19 -14
  15. package/HiTable/HiTableRow.js +7 -3
  16. package/es/HiCell/CellIcon.js +32 -3
  17. package/es/HiCell/CellRate.js +1 -1
  18. package/es/HiCell/CellTextStyled.js +30 -0
  19. package/es/HiChip/HiChipSwitch.js +1 -1
  20. package/es/HiExpansionPanel/HiExpansionPanel.js +15 -4
  21. package/es/HiForm/HiInput.js +10 -4
  22. package/es/HiPin/HiPin.js +3 -3
  23. package/es/HiSelect/HiSelect.js +26 -9
  24. package/es/HiSelect/HiSelectInput.js +3 -2
  25. package/es/HiSelect/HiSuggestSelect.js +10 -3
  26. package/es/HiSelectableList/HiSelectableList.js +2 -2
  27. package/es/HiTable/HiCellBuilder.js +10 -5
  28. package/es/HiTable/HiTableHeader.js +16 -12
  29. package/es/HiTable/HiTableRow.js +7 -3
  30. package/es/hi-svg-icons/HiActivity.js +36 -0
  31. package/es/hi-svg-icons/HiPermission.js +36 -0
  32. package/es/hi-svg-icons/index.js +3 -1
  33. package/hi-svg-icons/HiActivity.js +50 -0
  34. package/hi-svg-icons/HiPermission.js +50 -0
  35. package/hi-svg-icons/index.js +17 -1
  36. package/index.es.js +1 -1
  37. package/index.js +1 -1
  38. package/package.json +1 -1
  39. package/umd/hipay-material-ui.development.js +234 -69
  40. package/umd/hipay-material-ui.production.min.js +2 -2
@@ -1,4 +1,4 @@
1
- /** @license HiPay-Material-UI v2.0.0-beta.68
1
+ /** @license HiPay-Material-UI v2.0.0-beta.70
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
@@ -15625,6 +15625,68 @@
15625
15625
  withTheme: true
15626
15626
  })(HiWidget);
15627
15627
 
15628
+ /**
15629
+ * @ignore - internal component.
15630
+ */
15631
+
15632
+ var HiActivity = pure(function (props) {
15633
+ var classes = props.classes,
15634
+ _props$color = props.color,
15635
+ color = _props$color === void 0 ? props.theme.palette.neutral.main : _props$color,
15636
+ theme = props.theme,
15637
+ other = objectWithoutProperties(props, ["classes", "color", "theme"]);
15638
+
15639
+ return React.createElement("svg", _extends_1({
15640
+ viewBox: "0 0 22.75 20.75"
15641
+ }, other), React.createElement("circle", {
15642
+ cx: "9",
15643
+ cy: "11.05",
15644
+ r: "9",
15645
+ opacity: 0.16,
15646
+ fill: color
15647
+ }), React.createElement("g", null, React.createElement("path", {
15648
+ // eslint-disable-next-line max-len
15649
+ d: "M7.33,1.41A7.75,7.75,0,0,0,5.64,3.94,7.91,7.91,0,0,0,5,7.05a7.91,7.91,0,0,0,2.3,5.65L5.92,14.11A10.06,10.06,0,0,1,3.79,11,9.73,9.73,0,0,1,3,7.05a9.72,9.72,0,0,1,.77-3.89A10.06,10.06,0,0,1,5.92,0ZM14,11.06v4h1a1,1,0,0,1,1,1h7v2H16a1,1,0,0,1-1,1H11a1,1,0,0,1-1-1H3V16h7a1,1,0,0,1,1-1h1v-4ZM10.19,4.22A3.84,3.84,0,0,0,9.06,7.05a3.84,3.84,0,0,0,1.13,2.84L8.78,11.3A6.36,6.36,0,0,1,7.47,9.38,5.84,5.84,0,0,1,7,7.05a6,6,0,0,1,.47-2.34,5.62,5.62,0,0,1,1.31-1.9Zm4.22,1.4A2,2,0,0,1,15,7a2,2,0,0,1-.56,1.43,2,2,0,0,1-2.82,0A2,2,0,0,1,11,7a2,2,0,0,1,3.38-1.41Zm4.12-.91A6,6,0,0,1,19,7.05a5.84,5.84,0,0,1-.47,2.33,6.36,6.36,0,0,1-1.31,1.92L15.81,9.89a3.84,3.84,0,0,0,1.13-2.84,3.84,3.84,0,0,0-1.13-2.83l1.41-1.41A5.62,5.62,0,0,1,18.53,4.71Zm3.68-1.55A9.72,9.72,0,0,1,23,7.05a9.73,9.73,0,0,1-.77,3.9,10.06,10.06,0,0,1-2.13,3.16L18.67,12.7A7.91,7.91,0,0,0,21,7.05a7.91,7.91,0,0,0-.61-3.11,7.75,7.75,0,0,0-1.69-2.53L20.08,0A10.06,10.06,0,0,1,22.21,3.16Z",
15650
+ fill: color
15651
+ })));
15652
+ });
15653
+ HiActivity.muiName = 'SvgIcon';
15654
+ var HiActivity$1 = withStyles({}, {
15655
+ hiComponent: true,
15656
+ withTheme: true
15657
+ })(HiActivity);
15658
+
15659
+ /**
15660
+ * @ignore - internal component.
15661
+ */
15662
+
15663
+ var HiPermission = pure(function (props) {
15664
+ var classes = props.classes,
15665
+ _props$color = props.color,
15666
+ color = _props$color === void 0 ? props.theme.palette.neutral.main : _props$color,
15667
+ theme = props.theme,
15668
+ other = objectWithoutProperties(props, ["classes", "color", "theme"]);
15669
+
15670
+ return React.createElement("svg", _extends_1({
15671
+ viewBox: "0 0 22.98 20.05"
15672
+ }, other), React.createElement("circle", {
15673
+ cx: "9",
15674
+ cy: "11.75",
15675
+ r: "9",
15676
+ opacity: 0.16,
15677
+ fill: color
15678
+ }), React.createElement("g", null, React.createElement("path", {
15679
+ // eslint-disable-next-line max-len
15680
+ d: "M11.24,2a6.69,6.69,0,0,1,9.52,0,6.5,6.5,0,0,1,2,4.76,6.5,6.5,0,0,1-2,4.76,6.5,6.5,0,0,1-4.76,2,6.66,6.66,0,0,1-3-.75V15H10.75v2.25H8.5V19.5H3.25V14l.19-.28,5.9-5.86a10.31,10.31,0,0,1-.09-1.08A6.5,6.5,0,0,1,11.24,2ZM19.7,3.05a5.19,5.19,0,0,0-7.4,0,5,5,0,0,0-1.55,3.7A9,9,0,0,0,10.89,8l0,.37-.28.28-5.91,6V18H7V15.75H9.25V13.5H11.5V11.25h1.78l.19.09a5.19,5.19,0,0,0,6.23-.89,5,5,0,0,0,1.55-3.7A5,5,0,0,0,19.7,3.05ZM16.45,4.2a1.45,1.45,0,0,1,2.1,0,1.45,1.45,0,0,1,0,2.1,1.45,1.45,0,0,1-2.1,0,1.45,1.45,0,0,1,0-2.1Z",
15681
+ fill: color
15682
+ })));
15683
+ });
15684
+ HiPermission.muiName = 'SvgIcon';
15685
+ var HiPermission$1 = withStyles({}, {
15686
+ hiComponent: true,
15687
+ withTheme: true
15688
+ })(HiPermission);
15689
+
15628
15690
 
15629
15691
 
15630
15692
  var hiSvgIcons = /*#__PURE__*/Object.freeze({
@@ -15642,7 +15704,9 @@
15642
15704
  HiSizeSmall: HiSizeSmall,
15643
15705
  HiTransaction: HiTransaction$1,
15644
15706
  HiUser: HiUser$1,
15645
- HiWidget: HiWidget$1
15707
+ HiWidget: HiWidget$1,
15708
+ HiActivity: HiActivity$1,
15709
+ HiPermission: HiPermission$1
15646
15710
  });
15647
15711
 
15648
15712
  var createIcon = createCommonjsModule(function (module, exports) {
@@ -71197,7 +71261,7 @@
71197
71261
  }(React.PureComponent);
71198
71262
 
71199
71263
  HiChipSwitch.defaultProps = {
71200
- active: true,
71264
+ active: false,
71201
71265
  activeIcon: 'check',
71202
71266
  selection: null,
71203
71267
  selectionTitle: ''
@@ -72635,7 +72699,7 @@
72635
72699
  },
72636
72700
  width: '100%',
72637
72701
  // Ajout d'1px pour ne pas avoir de décalage en mode error avec le border top
72638
- '&:not($error)': {
72702
+ '&:$error': {
72639
72703
  marginTop: 1
72640
72704
  }
72641
72705
  }),
@@ -72923,7 +72987,8 @@
72923
72987
  inputClassName = _this$props.inputClassName,
72924
72988
  onReset = _this$props.onReset,
72925
72989
  spellcheck = _this$props.spellcheck,
72926
- startAdornmentColor = _this$props.startAdornmentColor;
72990
+ startAdornmentColor = _this$props.startAdornmentColor,
72991
+ inputProps = _this$props.inputProps;
72927
72992
  var focused = this.state.focused;
72928
72993
 
72929
72994
  var overlayProps = _extends_1({
@@ -73003,10 +73068,10 @@
73003
73068
  _this2.endAdornmentNode = el;
73004
73069
  }
73005
73070
  }, eraseIcon, endAdornment),
73006
- inputProps: {
73071
+ inputProps: _extends_1({
73007
73072
  spellCheck: spellcheck ? "true" : "false",
73008
73073
  className: classnames(inputClassName, classes.inputPropsClassName, (_classNames4 = {}, defineProperty(_classNames4, classes.inputText, !multiline), defineProperty(_classNames4, classes.inputTextArea, multiline), _classNames4))
73009
- }
73074
+ }, inputProps)
73010
73075
  }));
73011
73076
  }
73012
73077
  }], [{
@@ -73093,6 +73158,11 @@
73093
73158
  */
73094
73159
  inputId: propTypes.string,
73095
73160
 
73161
+ /**
73162
+ * Passe des props directement à l'input
73163
+ */
73164
+ inputProps: propTypes.object,
73165
+
73096
73166
  /**
73097
73167
  * Passe une ref callback au composant input
73098
73168
  */
@@ -77876,8 +77946,6 @@
77876
77946
  var KEYS = 'keys';
77877
77947
  var VALUES = 'values';
77878
77948
 
77879
- var returnThis = function () { return this; };
77880
-
77881
77949
  var _iterDefine = function (Base, NAME, Constructor, next, DEFAULT, IS_SET, FORCED) {
77882
77950
  _iterCreate(Constructor, NAME, next);
77883
77951
  var getMethod = function (kind) {
@@ -77902,8 +77970,6 @@
77902
77970
  if (IteratorPrototype !== Object.prototype && IteratorPrototype.next) {
77903
77971
  // Set @@toStringTag to native iterators
77904
77972
  _setToStringTag(IteratorPrototype, TAG, true);
77905
- // fix for some old engines
77906
- if (!_library && typeof IteratorPrototype[ITERATOR] != 'function') _hide(IteratorPrototype, ITERATOR, returnThis);
77907
77973
  }
77908
77974
  }
77909
77975
  // fix Array#{values, @@iterator}.name in V8 / FF
@@ -77912,7 +77978,7 @@
77912
77978
  $default = function values() { return $native.call(this); };
77913
77979
  }
77914
77980
  // Define iterator
77915
- if ((!_library || FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])) {
77981
+ if ((FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])) {
77916
77982
  _hide(proto, ITERATOR, $default);
77917
77983
  }
77918
77984
  if (DEFAULT) {
@@ -80183,9 +80249,9 @@
80183
80249
  overflow: true,
80184
80250
  placeholder: placeholderContent
80185
80251
  }, itemComponent);
80186
- } else {
80187
- return itemComponent;
80188
80252
  }
80253
+
80254
+ return itemComponent;
80189
80255
  };
80190
80256
 
80191
80257
  _this.compareItem = function (a, b) {
@@ -83855,7 +83921,8 @@
83855
83921
  onSearch = _this$props.onSearch,
83856
83922
  translations = _this$props.translations,
83857
83923
  align = _this$props.align,
83858
- otherProps = objectWithoutProperties(_this$props, ["classes", "id", "loading", "showMinLength", "showNoResults", "onSearch", "translations", "align"]);
83924
+ inputClasses = _this$props.inputClasses,
83925
+ otherProps = objectWithoutProperties(_this$props, ["classes", "id", "loading", "showMinLength", "showNoResults", "onSearch", "translations", "align", "inputClasses"]);
83859
83926
 
83860
83927
  var _this$state = this.state,
83861
83928
  focused = _this$state.focused,
@@ -83896,7 +83963,8 @@
83896
83963
  onChange: onSearch,
83897
83964
  onKeyDown: this.handleKeyDownSearch,
83898
83965
  onBlur: this.handleBlur,
83899
- onFocus: this.handleFocus
83966
+ onFocus: this.handleFocus,
83967
+ classes: inputClasses
83900
83968
  })), open && React.createElement(Popper$3, {
83901
83969
  disablePortal: true,
83902
83970
  anchorEl: this.textInput,
@@ -83951,6 +84019,11 @@
83951
84019
  */
83952
84020
  id: propTypes.string,
83953
84021
 
84022
+ /**
84023
+ * Object that contains the style for Input component
84024
+ */
84025
+ inputClasses: propTypes.object,
84026
+
83954
84027
  /**
83955
84028
  * Passe une ref callback au composant input
83956
84029
  */
@@ -91814,13 +91887,21 @@
91814
91887
 
91815
91888
  var ALIGN_RIGHT_TYPES = [TYPE_NUMERIC, TYPE_RATE, TYPE_SENTINEL, TYPE_SENTINEL_SCORE];
91816
91889
 
91817
- var styles$l = {
91818
- icon: {
91819
- color: '#00ADE9'
91820
- },
91821
- headerRoot: {
91822
- cursor: 'inherit'
91823
- }
91890
+ var styles$l = function styles(theme) {
91891
+ return {
91892
+ head: {
91893
+ cursor: 'inherit',
91894
+ borderBottom: "solid 1px ".concat(theme.palette.divider)
91895
+ },
91896
+ cell: {
91897
+ border: 'none',
91898
+ paddingRight: '13px',
91899
+ paddingLeft: '13px'
91900
+ },
91901
+ icon: {
91902
+ color: '#00ADE9'
91903
+ }
91904
+ };
91824
91905
  };
91825
91906
 
91826
91907
  var HiTableHeader =
@@ -91862,7 +91943,9 @@
91862
91943
  orderBy = _this$props.orderBy,
91863
91944
  sortable = _this$props.sortable,
91864
91945
  dense = _this$props.dense;
91865
- return React.createElement(TableHead$2, null, React.createElement(TableRow$4, {
91946
+ return React.createElement(TableHead$2, {
91947
+ className: classes.head
91948
+ }, React.createElement(TableRow$4, {
91866
91949
  style: {
91867
91950
  height: dense ? CELL_HEADER_HEIGHT_DENSE : CELL_HEADER_HEIGHT,
91868
91951
  whiteSpace: 'nowrap'
@@ -91878,13 +91961,8 @@
91878
91961
  var finalLabel = view === 's' ? smallLabel : label;
91879
91962
  return React.createElement(TableCell$2, {
91880
91963
  key: colId,
91964
+ className: classes.cell,
91881
91965
  sortDirection: orderBy === colId ? order : false,
91882
- style: {
91883
- border: 'none',
91884
- borderBottom: orderBy === colId ? 'solid 1px #00ADE9' : 'none',
91885
- paddingRight: '13px',
91886
- paddingLeft: '13px'
91887
- },
91888
91966
  numeric: ALIGN_RIGHT_TYPES.includes(type),
91889
91967
  title: headerTooltip
91890
91968
  }, sortable ? React.createElement(TableSortLabel$2, {
@@ -96901,12 +96979,35 @@
96901
96979
  color = _this$props.color,
96902
96980
  icon = _this$props.icon,
96903
96981
  label = _this$props.label,
96904
- view = _this$props.view,
96905
- size = _this$props.size;
96982
+ onClick = _this$props.onClick,
96983
+ size = _this$props.size,
96984
+ view = _this$props.view;
96985
+
96986
+ if (onClick) {
96987
+ return React.createElement("div", {
96988
+ className: classes.wrapper,
96989
+ title: label
96990
+ }, React.createElement(HiIconButton$1, {
96991
+ color: 'inherit',
96992
+ style: {
96993
+ color: color,
96994
+ fontSize: size || 24,
96995
+ maxHeight: 31,
96996
+ maxWidth: 31
96997
+ },
96998
+ onClick: onClick
96999
+ }, React.createElement(HiIcon$1, {
97000
+ className: classes.icon,
97001
+ icon: icon
97002
+ }), view !== 's' && label && React.createElement("span", {
97003
+ className: classes.label
97004
+ }, label)));
97005
+ }
97006
+
96906
97007
  return React.createElement("div", {
96907
97008
  className: classes.wrapper,
96908
97009
  title: label
96909
- }, icon && React.createElement(HiIcon$1, {
97010
+ }, React.createElement(HiIcon$1, {
96910
97011
  color: 'inherit',
96911
97012
  style: {
96912
97013
  color: color,
@@ -96949,6 +97050,11 @@
96949
97050
  */
96950
97051
  label: propTypes.string,
96951
97052
 
97053
+ /**
97054
+ * Fonction déclenchée lors du clic
97055
+ */
97056
+ onClick: propTypes.func,
97057
+
96952
97058
  /**
96953
97059
  * View (L/M/S)
96954
97060
  */
@@ -97346,12 +97452,18 @@
97346
97452
  whiteSpace: 'pre',
97347
97453
  width: '100%'
97348
97454
  };
97455
+ var styleButton = {
97456
+ padding: '1px 5px',
97457
+ minHeight: '18px',
97458
+ maxHeight: '18px'
97459
+ };
97349
97460
  /**
97350
97461
  * CellText functional component
97351
97462
  * (don't includes complex ellipsis: middle, after-first-word...)
97352
97463
  *
97353
97464
  * @param label
97354
97465
  * @param color
97466
+ * @param isButton
97355
97467
  * @param value
97356
97468
  * @param active
97357
97469
  * @param title
@@ -97362,6 +97474,8 @@
97362
97474
  var CellTextStyled = function CellTextStyled(_ref) {
97363
97475
  var label = _ref.label,
97364
97476
  color = _ref.color,
97477
+ isButton = _ref.isButton,
97478
+ onClick = _ref.onClick,
97365
97479
  _ref$value = _ref.value,
97366
97480
  value = _ref$value === void 0 ? '' : _ref$value,
97367
97481
  _ref$active = _ref.active,
@@ -97369,6 +97483,17 @@
97369
97483
  _ref$title = _ref.title,
97370
97484
  title$$1 = _ref$title === void 0 ? '' : _ref$title;
97371
97485
  var valueString = label ? label.toString() : value.toString();
97486
+
97487
+ if (isButton) {
97488
+ return React.createElement(HiButton$1, {
97489
+ color: color,
97490
+ onClick: onClick,
97491
+ size: "small",
97492
+ style: styleButton,
97493
+ variant: "raised"
97494
+ }, valueString);
97495
+ }
97496
+
97372
97497
  return React.createElement("div", {
97373
97498
  style: styleRoot,
97374
97499
  title: title$$1 || valueString
@@ -97393,11 +97518,21 @@
97393
97518
  */
97394
97519
  color: propTypes.string,
97395
97520
 
97521
+ /**
97522
+ * Définit si la cellule de text
97523
+ */
97524
+ isButton: propTypes.bool,
97525
+
97396
97526
  /**
97397
97527
  * Label
97398
97528
  */
97399
97529
  label: propTypes.oneOfType([propTypes.string, propTypes.number]),
97400
97530
 
97531
+ /**
97532
+ * Fonction déclenchée lors du clic
97533
+ */
97534
+ onClick: propTypes.func,
97535
+
97401
97536
  /**
97402
97537
  * Tooltip
97403
97538
  */
@@ -97418,7 +97553,7 @@
97418
97553
  overflow: 'hidden',
97419
97554
  position: 'relative',
97420
97555
  textAlign: 'right',
97421
- paddingTop: 10
97556
+ maxHeight: '32px'
97422
97557
  },
97423
97558
  trendChipIcon: {
97424
97559
  width: 14,
@@ -97565,9 +97700,9 @@
97565
97700
  return {
97566
97701
  root: {
97567
97702
  display: 'inline-block',
97568
- padding: '1px 9px',
97569
- height: 16,
97570
- lineHeight: '16px',
97703
+ padding: '0px 9px',
97704
+ height: 17,
97705
+ lineHeight: '17px',
97571
97706
  minWidth: 25,
97572
97707
  textAlign: 'center',
97573
97708
  borderRadius: '45px',
@@ -97817,6 +97952,7 @@
97817
97952
  color: datacell.color,
97818
97953
  icon: datacell.icon,
97819
97954
  label: datacell.label,
97955
+ onClick: datacell.handleClick,
97820
97956
  view: cell.view ? cell.view : DEFAULT_VIEWS[cell.type],
97821
97957
  size: cell.size
97822
97958
  });
@@ -97861,6 +97997,8 @@
97861
97997
  active: datacell.active,
97862
97998
  color: datacell.color,
97863
97999
  label: datacell.label,
98000
+ isButton: datacell.isButton,
98001
+ onClick: datacell.handleClick,
97864
98002
  title: cell.title ? cell.title(datacell, cell) : datacell.title,
97865
98003
  value: datacell.value
97866
98004
  });
@@ -97878,15 +98016,12 @@
97878
98016
  key: "render",
97879
98017
  value: function render() {
97880
98018
  var _this$props = this.props,
98019
+ className = _this$props.className,
97881
98020
  column = _this$props.column,
97882
98021
  data = _this$props.data,
97883
98022
  locale = _this$props.locale;
97884
98023
  return React.createElement(TableCell$2, {
97885
- style: {
97886
- border: 'none',
97887
- paddingRight: '13px',
97888
- paddingLeft: '13px'
97889
- }
98024
+ className: className
97890
98025
  }, this.createCell(column, data, locale));
97891
98026
  }
97892
98027
  }]);
@@ -97895,6 +98030,11 @@
97895
98030
  }(React.PureComponent);
97896
98031
 
97897
98032
  HiCellBuilder.propTypes = {
98033
+ /**
98034
+ * Override TableCell style
98035
+ */
98036
+ className: propTypes.object,
98037
+
97898
98038
  /**
97899
98039
  * Propriétés de la colonne
97900
98040
  */
@@ -97917,15 +98057,18 @@
97917
98057
  '&:last-child': {
97918
98058
  borderBottom: 'solid 1px #E4E7E8'
97919
98059
  },
97920
- '&:first-child': {
97921
- borderTop: 'solid 1px #E4E7E8'
97922
- },
97923
98060
  '&:hover, &:focus': {
97924
98061
  backgroundColor: "".concat(theme.palette.action.hover, " !important")
97925
98062
  }
97926
98063
  },
97927
98064
  clickableRow: {
97928
98065
  cursor: 'pointer'
98066
+ },
98067
+ cell: {
98068
+ border: 'none',
98069
+ padding: '0px 13px',
98070
+ minHeight: '32px',
98071
+ maxHeight: '40px'
97929
98072
  }
97930
98073
  };
97931
98074
  };
@@ -97985,6 +98128,7 @@
97985
98128
  }, Object.keys(columns).map(function (column) {
97986
98129
  return React.createElement(HiCellBuilder, {
97987
98130
  key: columns[column].colId,
98131
+ className: classes.cell,
97988
98132
  column: columns[column],
97989
98133
  data: rowdata,
97990
98134
  locale: locale
@@ -108219,8 +108363,9 @@
108219
108363
  overflow: 'hidden',
108220
108364
  textOverflow: 'ellipsis'
108221
108365
  }, theme.typography.b1, {
108222
- display: 'inline-flex',
108223
- width: '100%'
108366
+ display: 'inline-block',
108367
+ width: '100%',
108368
+ maxWidth: 500
108224
108369
  }),
108225
108370
  placeholder: {
108226
108371
  color: theme.palette.grey[400]
@@ -108529,13 +108674,14 @@
108529
108674
  transition: 'none !important'
108530
108675
  },
108531
108676
  labelIcon: {
108532
- marginRight: 10
108677
+ marginRight: 10,
108678
+ verticalAlign: 'text-bottom'
108533
108679
  },
108534
108680
  labelImg: {
108535
108681
  height: 18,
108536
108682
  width: 'auto',
108537
108683
  margin: '0 4px',
108538
- verticalAlign: 'middle'
108684
+ verticalAlign: 'text-bottom'
108539
108685
  },
108540
108686
  selectIconLabel: _extends_1({
108541
108687
  whiteSpace: 'nowrap',
@@ -108543,7 +108689,7 @@
108543
108689
  textOverflow: 'ellipsis',
108544
108690
  paddingRight: 16
108545
108691
  }, theme.typography.b1, {
108546
- display: 'inline-flex',
108692
+ display: 'inline-block',
108547
108693
  width: '100%'
108548
108694
  }),
108549
108695
  selectImgLabel: _extends_1({
@@ -108961,11 +109107,28 @@
108961
109107
  this.inputEl.focus();
108962
109108
  }
108963
109109
  }
109110
+ }, {
109111
+ key: "getLengthItemList",
109112
+ value: function getLengthItemList(itemList) {
109113
+ var _this2 = this;
109114
+
109115
+ var itemListLength = 0;
109116
+ itemList.forEach(function (parent) {
109117
+ if (parent.displayed && itemListLength < 10) {
109118
+ itemListLength += 1;
109119
+
109120
+ if (parent.children && itemListLength < 10) {
109121
+ itemListLength += _this2.getLengthItemList(parent.children);
109122
+ }
109123
+ }
109124
+ });
109125
+ return itemListLength;
109126
+ }
108964
109127
  }, {
108965
109128
  key: "render",
108966
109129
  value: function render() {
108967
109130
  var _classNames,
108968
- _this2 = this;
109131
+ _this3 = this;
108969
109132
 
108970
109133
  var _this$props4 = this.props,
108971
109134
  classes = _this$props4.classes,
@@ -109032,10 +109195,10 @@
109032
109195
  return React.createElement(HiInput$1, _extends_1({
109033
109196
  value: searchValue,
109034
109197
  autoFocus: true,
109035
- inputRef: _this2.getInputElement,
109036
- onKeyDown: _this2.handleKeyDownSearch,
109037
- onChange: _this2.handleSearch,
109038
- onReset: _this2.handleSearchReset,
109198
+ inputRef: _this3.getInputElement,
109199
+ onKeyDown: _this3.handleKeyDownSearch,
109200
+ onChange: _this3.handleSearch,
109201
+ onReset: _this3.handleSearchReset,
109039
109202
  placeholder: translations.search,
109040
109203
  startAdornment: 'search',
109041
109204
  tabIndex: 0,
@@ -109048,8 +109211,10 @@
109048
109211
 
109049
109212
 
109050
109213
  if (this.placement && this.placement.indexOf('top') >= 0 && !!searchable) {
109051
- // +1 for search input
109052
- var nbItems = itemList.length <= 10 ? itemList.length + 1 : 11;
109214
+ // In case we have a nested list
109215
+ var itemListLength = this.getLengthItemList(itemList); // +1 for search input
109216
+
109217
+ var nbItems = itemListLength <= 10 ? itemListLength + 1 : 11;
109053
109218
  popperStyle.transform = "translate3d(-1px, -".concat(nbItems * 40 + 2, "px, 0px)");
109054
109219
  } else if (this.placement && this.placement.indexOf('top') < 0 && !!searchable) {
109055
109220
  popperStyle.transform = 'translate3d(-1px, 40px, 0px)';
@@ -109058,12 +109223,12 @@
109058
109223
  var content = function content(_ref) {
109059
109224
  var placement = _ref.placement;
109060
109225
 
109061
- if (placement !== _this2.placement) {
109062
- _this2.placement = placement;
109226
+ if (placement !== _this3.placement) {
109227
+ _this3.placement = placement;
109063
109228
  }
109064
109229
 
109065
109230
  return React.createElement(ClickAwayListener$2, {
109066
- onClickAway: _this2.handleClickAway
109231
+ onClickAway: _this3.handleClickAway
109067
109232
  }, React.createElement(Grow$2, {
109068
109233
  in: open,
109069
109234
  id: "menu-list",
@@ -109072,29 +109237,29 @@
109072
109237
  }
109073
109238
  }, React.createElement(Paper$2, {
109074
109239
  className: classes.paper
109075
- }, (_this2.placement && _this2.placement.indexOf('bottom') >= 0 || staticPosition) && searchInput('bottom'), startAdornment, React.createElement(Scrollbars, _extends_1({
109240
+ }, (_this3.placement && _this3.placement.indexOf('bottom') >= 0 || staticPosition) && searchInput('bottom'), startAdornment, React.createElement(Scrollbars, _extends_1({
109076
109241
  ref: function ref(contentEl) {
109077
- _this2.optionsContent = contentEl;
109242
+ _this3.optionsContent = contentEl;
109078
109243
  },
109079
109244
  autoHeight: true,
109080
109245
  autoHeightMax: 430
109081
109246
  }, onScrollReachBottom && {
109082
- onScroll: _this2.handleScroll
109247
+ onScroll: _this3.handleScroll
109083
109248
  }), React.createElement(HiSelectableList$1, _extends_1({
109084
109249
  type: type,
109085
109250
  itemList: itemList,
109086
- onSelect: _this2.handleSelect,
109251
+ onSelect: _this3.handleSelect,
109087
109252
  selectedItemIdList: selectedItemIdList,
109088
- fallbackImage: _this2.props.fallbackImage,
109089
- overlay: _this2.overlay,
109253
+ fallbackImage: _this3.props.fallbackImage,
109254
+ overlay: _this3.overlay,
109090
109255
  value: value
109091
- }, hiSelectableListProps))), _this2.placement && _this2.placement.indexOf('top') >= 0 && !staticPosition && searchInput('top'))));
109256
+ }, hiSelectableListProps))), _this3.placement && _this3.placement.indexOf('top') >= 0 && !staticPosition && searchInput('top'))));
109092
109257
  };
109093
109258
 
109094
109259
  return React.createElement("div", {
109095
109260
  className: classes.root,
109096
109261
  ref: function ref(el) {
109097
- _this2.overlay = el;
109262
+ _this3.overlay = el;
109098
109263
  },
109099
109264
  onKeyDown: this.handleKeyDown,
109100
109265
  onKeyDownCapture: this.handleKeyDownCapture
@@ -109117,7 +109282,7 @@
109117
109282
  placeholder: placeholder
109118
109283
  }, hiSelectInputProps, {
109119
109284
  refElement: function refElement(el) {
109120
- _this2.inputEl = el;
109285
+ _this3.inputEl = el;
109121
109286
  }
109122
109287
  })), open && staticPosition ? React.createElement("div", {
109123
109288
  style: popperStyle,