linear-react-components-ui 0.4.76-beta.11 → 0.4.76-beta.12

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 (72) hide show
  1. package/.vscode/settings.json +2 -1
  2. package/README.md +0 -33
  3. package/lib/assets/styles/dropdown.scss +2 -28
  4. package/lib/assets/styles/effects.scss +0 -12
  5. package/lib/assets/styles/floatMenu.scss +1 -0
  6. package/lib/assets/styles/panel.scss +1 -0
  7. package/lib/assets/styles/progress.scss +1 -8
  8. package/lib/assets/styles/select.scss +0 -1
  9. package/lib/assets/styles/table.scss +5 -13
  10. package/lib/assets/styles/tabs.scss +44 -79
  11. package/lib/assets/styles/treeview.scss +0 -32
  12. package/lib/avatar/avatar.spec.js +6 -17
  13. package/lib/avatar/index.js +1 -1
  14. package/lib/buttons/DefaultButton.js +1 -7
  15. package/lib/checkbox/index.js +6 -20
  16. package/lib/dialog/base/index.js +6 -15
  17. package/lib/dialog/form/index.js +3 -16
  18. package/lib/drawer/index.js +1 -4
  19. package/lib/form/Field.js +0 -2
  20. package/lib/form/FieldNumber.js +2 -10
  21. package/lib/form/helpers.js +1 -9
  22. package/lib/form/index.js +222 -209
  23. package/lib/form/withFieldHOC.js +0 -2
  24. package/lib/icons/helper.js +0 -16
  25. package/lib/inputs/base/helpers.js +10 -15
  26. package/lib/inputs/date/Dropdown.js +3 -3
  27. package/lib/inputs/date/index.js +9 -10
  28. package/lib/inputs/number/BaseNumber.js +1 -1
  29. package/lib/inputs/number/index.js +5 -7
  30. package/lib/inputs/select/Dropdown.js +4 -4
  31. package/lib/inputs/select/index.js +3 -26
  32. package/lib/inputs/select/multiple/index.js +7 -9
  33. package/lib/inputs/select/simple/index.js +18 -30
  34. package/lib/internals/withTooltip.js +81 -85
  35. package/lib/list/Item.js +3 -3
  36. package/lib/list/index.js +10 -20
  37. package/lib/list/list.spec.js +85 -129
  38. package/lib/menus/float/MenuItem.js +8 -25
  39. package/lib/menus/sidenav/index.js +3 -7
  40. package/lib/menus/sidenav/popup_menu_search/index.js +1 -1
  41. package/lib/progress/Bar.js +9 -40
  42. package/lib/progress/index.js +4 -12
  43. package/lib/spinner/index.js +1 -6
  44. package/lib/split/Split.js +11 -5
  45. package/lib/table/Row.js +1 -1
  46. package/lib/tabs/Menu.js +5 -18
  47. package/lib/tabs/MenuItems.js +7 -7
  48. package/lib/tabs/Panel.js +3 -1
  49. package/lib/tabs/index.js +20 -151
  50. package/lib/tabs/tabs.spec.js +5 -8
  51. package/lib/toolbar/index.js +4 -8
  52. package/lib/tooltip/index.js +7 -20
  53. package/lib/treeview/Node.js +48 -347
  54. package/lib/treeview/index.js +35 -456
  55. package/package.json +8 -9
  56. package/.tool-versions +0 -1
  57. package/lib/assets/styles/multiSelect.scss +0 -105
  58. package/lib/assets/styles/periodpicker.scss +0 -65
  59. package/lib/checkbox/Label.js +0 -37
  60. package/lib/form/FieldPeriod.js +0 -100
  61. package/lib/form/withFormSecurity.js +0 -106
  62. package/lib/inputs/date/helpers.js +0 -36
  63. package/lib/inputs/multiSelect/ActionButtons.js +0 -68
  64. package/lib/inputs/multiSelect/Dropdown.js +0 -200
  65. package/lib/inputs/multiSelect/helper.js +0 -18
  66. package/lib/inputs/multiSelect/index.js +0 -343
  67. package/lib/inputs/period/Dialog.js +0 -38
  68. package/lib/inputs/period/Dropdown.js +0 -90
  69. package/lib/inputs/period/PeriodList.js +0 -79
  70. package/lib/inputs/period/helper.js +0 -118
  71. package/lib/inputs/period/index.js +0 -490
  72. package/lib/tabs/DropdownItems.js +0 -84
@@ -31,8 +31,6 @@ var _Dialog = _interopRequireDefault(require("./Dialog"));
31
31
 
32
32
  var _colorStyles = _interopRequireDefault(require("../../internals/colorStyles"));
33
33
 
34
- var _helpers = require("./helpers");
35
-
36
34
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
37
35
 
38
36
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -62,6 +60,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
62
60
  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
63
61
 
64
62
  var CALENDAR_BUTTON_WIDTH = 24;
63
+ var dateFormat = 'DD/MM/YYYY';
65
64
 
66
65
  var DatePicker = /*#__PURE__*/function (_Component) {
67
66
  _inherits(DatePicker, _Component);
@@ -79,7 +78,7 @@ var DatePicker = /*#__PURE__*/function (_Component) {
79
78
 
80
79
  var propsValue = props.value;
81
80
  _this.state = {
82
- value: propsValue ? (0, _helpers.getValue)(propsValue) : undefined,
81
+ value: propsValue ? (0, _moment["default"])(propsValue) : undefined,
83
82
  // eslint-disable-next-line react/no-unused-state
84
83
  propsValue: propsValue,
85
84
  showCalendar: false,
@@ -117,7 +116,7 @@ var DatePicker = /*#__PURE__*/function (_Component) {
117
116
  var required = this.props.required;
118
117
  if (onDenied && onDenied.unvisible) return null;
119
118
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_BaseMask["default"], _extends({}, this.props, {
120
- value: !value ? ' ' : value.format(_helpers.PT_BR_FORMAT),
119
+ value: !value ? ' ' : value.format(dateFormat),
121
120
  mask: "00/00/0000",
122
121
  onComplete: function onComplete(e, date) {
123
122
  _this2.setValue(e, date);
@@ -137,7 +136,7 @@ var DatePicker = /*#__PURE__*/function (_Component) {
137
136
  inputRef: function inputRef(el) {
138
137
  _this2.inputRef = el;
139
138
  },
140
- rightElements: this.getButtonOpen(),
139
+ rightElements: [this.getButtonOpen()],
141
140
  required: required,
142
141
  handlerSetOnDenied: this.setOnDenied
143
142
  })), showCalendar && this.getWrapperComponent());
@@ -155,9 +154,9 @@ Object.defineProperty(DatePicker, "getDerivedStateFromProps", {
155
154
  var value = props.value;
156
155
  var propsValue = state.propsValue;
157
156
 
158
- if (value && (0, _moment["default"])(value, _helpers.EN_US_FORMAT).format() !== 'Invalid date' && (0, _moment["default"])(propsValue, _helpers.EN_US_FORMAT).format() !== (0, _moment["default"])(value, _helpers.EN_US_FORMAT).format()) {
157
+ if (value && (0, _moment["default"])(value, dateFormat).format() !== 'Invalid date' && (0, _moment["default"])(propsValue, dateFormat).format() !== (0, _moment["default"])(value, dateFormat).format()) {
159
158
  return {
160
- value: (0, _moment["default"])(value, _helpers.EN_US_FORMAT),
159
+ value: (0, _moment["default"])(value),
161
160
  propsValue: value
162
161
  };
163
162
  } else if (!value && value !== propsValue) {
@@ -263,8 +262,8 @@ var _initialiseProps = function _initialiseProps() {
263
262
  var onChange = _this3.props.onChange;
264
263
 
265
264
  if (onChange) {
266
- if ((0, _moment["default"])(_value, _helpers.PT_BR_FORMAT, true).isValid()) {
267
- var newValue = (0, _moment["default"])(_value, _helpers.PT_BR_FORMAT).format(_helpers.EN_US_FORMAT);
265
+ if ((0, _moment["default"])(_value, dateFormat, true).isValid()) {
266
+ var newValue = (0, _moment["default"])(_value, dateFormat).format('YYYY-MM-DD');
268
267
  var obj = {
269
268
  target: {
270
269
  value: newValue,
@@ -310,7 +309,7 @@ var _initialiseProps = function _initialiseProps() {
310
309
  if (_this3.props.shouldCloseOnSelect) showCalendar = false;
311
310
 
312
311
  _this3.setState({
313
- value: (0, _moment["default"])(_value2, _helpers.PT_BR_FORMAT),
312
+ value: (0, _moment["default"])(_value2, dateFormat),
314
313
  showCalendar: showCalendar
315
314
  });
316
315
  }
@@ -49,7 +49,7 @@ var BaseNumber = function BaseNumber(props) {
49
49
  };
50
50
 
51
51
  BaseNumber.propTypes = {
52
- value: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
52
+ value: _propTypes["default"].number,
53
53
  leftElements: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].object), _propTypes["default"].element, _propTypes["default"].object]),
54
54
  onBlur: _propTypes["default"].func,
55
55
  returnFormattedValueOnBlur: _propTypes["default"].bool
@@ -40,19 +40,17 @@ var NumberField = function NumberField(props) {
40
40
  value: (0, _format_number.numberToPtBR)(props.value),
41
41
  textAlign: props.textAlign,
42
42
  mask: Number,
43
- isNumeric: true,
44
- scale: 0,
45
- padFractionalZeros: false
43
+ scale: 0
46
44
  }));
47
45
  };
48
46
 
49
47
  NumberField.propTypes = {
50
- value: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
51
- textAlign: _propTypes["default"].string
48
+ textAlign: _propTypes["default"].string,
49
+ value: _propTypes["default"].string
52
50
  };
53
51
  NumberField.defaultProps = {
54
- value: undefined,
55
- textAlign: 'left'
52
+ textAlign: 'right',
53
+ value: ''
56
54
  };
57
55
  var _default = NumberField;
58
56
  exports["default"] = _default;
@@ -105,6 +105,9 @@ var Dropdown = function Dropdown(_ref) {
105
105
  onFocus: function onFocus() {
106
106
  handleOnFocus();
107
107
  },
108
+ onBlur: function onBlur() {
109
+ handleOnBlur();
110
+ },
108
111
  onChange: function onChange(e) {
109
112
  handleOnFilter(e.target.value);
110
113
  },
@@ -129,10 +132,7 @@ var Dropdown = function Dropdown(_ref) {
129
132
  tabIndex: "-1",
130
133
  onKeyPress: function onKeyPress() {},
131
134
  onClick: function onClick() {
132
- if (!disabled) {
133
- handleOnSelect(item);
134
- handleOnBlur(item);
135
- }
135
+ if (!disabled) handleOnSelect(item);
136
136
  }
137
137
  }, item.iconName && /*#__PURE__*/_react["default"].createElement(_icons["default"], {
138
138
  name: item.iconName,
@@ -15,40 +15,17 @@ var _simple = _interopRequireDefault(require("./simple"));
15
15
 
16
16
  require("../../assets/styles/select.scss");
17
17
 
18
- var _gridlayout = _interopRequireDefault(require("../../gridlayout"));
19
-
20
- var _excluded = ["gridLayout", "multiple"];
21
-
22
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
23
19
 
24
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
25
-
26
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
27
-
28
20
  var SelectField = function SelectField(props) {
29
- var gridLayout = props.gridLayout,
30
- multiple = props.multiple,
31
- newProps = _objectWithoutProperties(props, _excluded);
32
-
33
- var component = multiple ? /*#__PURE__*/_react["default"].createElement(_multiple["default"], newProps) : /*#__PURE__*/_react["default"].createElement(_simple["default"], newProps);
34
-
35
- if (gridLayout !== undefined) {
36
- return /*#__PURE__*/_react["default"].createElement(_gridlayout["default"], {
37
- customClass: "-withinput",
38
- cols: gridLayout
39
- }, component);
40
- }
41
-
42
- return component;
21
+ return props.multiple ? /*#__PURE__*/_react["default"].createElement(_multiple["default"], props) : /*#__PURE__*/_react["default"].createElement(_simple["default"], props);
43
22
  };
44
23
 
45
24
  SelectField.propTypes = {
46
- multiple: _propTypes["default"].bool,
47
- gridLayout: _propTypes["default"].string
25
+ multiple: _propTypes["default"].bool
48
26
  };
49
27
  SelectField.defaultProps = {
50
- multiple: false,
51
- gridLayout: undefined
28
+ multiple: false
52
29
  };
53
30
  var _default = SelectField;
54
31
  exports["default"] = _default;
@@ -84,7 +84,6 @@ var MultipleSelect = /*#__PURE__*/function (_Component) {
84
84
  _this.componentId = "select-component".concat(_uuid["default"].v1());
85
85
  _this.componentRef = /*#__PURE__*/_react["default"].createRef();
86
86
  _this.state = {
87
- valueFromProps: null,
88
87
  dataCombo: props.dataSource,
89
88
  currents: [],
90
89
  selected: null,
@@ -386,19 +385,18 @@ Object.defineProperty(MultipleSelect, "getDerivedStateFromProps", {
386
385
  value = props.value,
387
386
  idKey = props.idKey;
388
387
 
389
- if (value !== state.valueFromProps && dataSource.length > 0) {
390
- return {
391
- valueFromProps: value,
392
- currents: dataSource.filter(function (item) {
393
- return value.includes(item[idKey]);
394
- })
395
- };
396
- } else if (dataSource !== state.dataCombo) {
388
+ if (dataSource !== state.dataCombo) {
397
389
  var dataCombo = remoteSearch ? dataSource : (0, _helper.getFilteredMultipleDataCombo)(_extends({}, props, state));
398
390
  return {
399
391
  dataCombo: dataCombo,
400
392
  selected: dataSource.length > 0 && remoteSearch ? dataSource[0] : null
401
393
  };
394
+ } else if (value !== null && dataSource.length > 0) {
395
+ return {
396
+ currents: dataSource.filter(function (item) {
397
+ return value.includes(item[idKey]);
398
+ })
399
+ };
402
400
  }
403
401
 
404
402
  return null;
@@ -127,6 +127,9 @@ var SimpleSelect = /*#__PURE__*/function (_Component) {
127
127
  onFocus: function onFocus() {
128
128
  _this2.onFocus();
129
129
  },
130
+ onBlur: function onBlur(e) {
131
+ _this2.onBlur(e);
132
+ },
130
133
  onChange: function onChange(e) {
131
134
  _this2.onFilter(e.target.value);
132
135
  },
@@ -290,11 +293,18 @@ var _initialiseProps = function _initialiseProps() {
290
293
  enumerable: true,
291
294
  writable: true,
292
295
  value: function value(selected) {
293
- var onChange = _this3.props.onChange;
296
+ var _this3$props2 = _this3.props,
297
+ onChange = _this3$props2.onChange,
298
+ idKey = _this3$props2.idKey,
299
+ name = _this3$props2.name;
294
300
 
295
301
  if (onChange) {
296
- var event = _this3.getSelectEvent(selected);
297
-
302
+ var event = {
303
+ target: {
304
+ name: name,
305
+ value: selected ? selected[idKey] : undefined
306
+ }
307
+ };
298
308
  onChange(event);
299
309
  }
300
310
  }
@@ -354,15 +364,9 @@ var _initialiseProps = function _initialiseProps() {
354
364
  configurable: true,
355
365
  enumerable: true,
356
366
  writable: true,
357
- value: function value(selected) {
367
+ value: function value(e) {
358
368
  var onBlur = _this3.props.onBlur;
359
-
360
- if (onBlur) {
361
- var event = _this3.getSelectEvent(selected);
362
-
363
- onBlur(event);
364
- }
365
-
369
+ if (onBlur) onBlur(e);
366
370
  if (!_this3.state.insideComponent) _this3.setState({
367
371
  opened: false,
368
372
  isTyping: false
@@ -374,9 +378,9 @@ var _initialiseProps = function _initialiseProps() {
374
378
  enumerable: true,
375
379
  writable: true,
376
380
  value: function value(e) {
377
- var _this3$props2 = _this3.props,
378
- dataSource = _this3$props2.dataSource,
379
- idKey = _this3$props2.idKey;
381
+ var _this3$props3 = _this3.props,
382
+ dataSource = _this3$props3.dataSource,
383
+ idKey = _this3$props3.idKey;
380
384
  var _this3$state = _this3.state,
381
385
  selected = _this3$state.selected,
382
386
  isTyping = _this3$state.isTyping;
@@ -417,22 +421,6 @@ var _initialiseProps = function _initialiseProps() {
417
421
  });
418
422
  }
419
423
  });
420
- Object.defineProperty(this, "getSelectEvent", {
421
- configurable: true,
422
- enumerable: true,
423
- writable: true,
424
- value: function value(selected) {
425
- var _this3$props3 = _this3.props,
426
- idKey = _this3$props3.idKey,
427
- name = _this3$props3.name;
428
- return {
429
- target: {
430
- name: name,
431
- value: selected ? selected[idKey] : undefined
432
- }
433
- };
434
- }
435
- });
436
424
  Object.defineProperty(this, "setOnDenied", {
437
425
  configurable: true,
438
426
  enumerable: true,
@@ -33,8 +33,6 @@ function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "und
33
33
 
34
34
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
35
35
 
36
- var TOOLTIP_INITIAL_HEIGHT = 40;
37
-
38
36
  var hasTooltip = function hasTooltip(_ref) {
39
37
  var tooltip = _ref.tooltip;
40
38
  return tooltip;
@@ -47,34 +45,35 @@ var getDisplayName = function getDisplayName(WrappedComponent) {
47
45
  var withTooltip = function withTooltip(WrappedComponent) {
48
46
  var EnhancedComponent = function EnhancedComponent(props) {
49
47
  var tooltip = props.tooltip,
48
+ tooltipPosition = props.tooltipPosition,
50
49
  tooltipWidth = props.tooltipWidth,
51
50
  space = props.space;
52
51
 
53
- var _useState = (0, _react.useState)(props.tooltipPosition),
52
+ var _useState = (0, _react.useState)(false),
54
53
  _useState2 = _slicedToArray(_useState, 2),
55
- tooltipPosition = _useState2[0],
56
- setTooltipPosition = _useState2[1];
54
+ showTooltip = _useState2[0],
55
+ setShowTooltip = _useState2[1];
57
56
 
58
- var _useState3 = (0, _react.useState)(''),
57
+ var _useState3 = (0, _react.useState)({
58
+ width: tooltipWidth,
59
+ height: undefined
60
+ }),
59
61
  _useState4 = _slicedToArray(_useState3, 2),
60
- tooltipStyle = _useState4[0],
61
- setTooltipStyle = _useState4[1];
62
+ tooltipDimensions = _useState4[0],
63
+ setTooltipDimensions = _useState4[1];
62
64
 
63
- var _useState5 = (0, _react.useState)(false),
65
+ var _useState5 = (0, _react.useState)(true),
64
66
  _useState6 = _slicedToArray(_useState5, 2),
65
- showTooltip = _useState6[0],
66
- setShowTooltip = _useState6[1];
67
+ findScrollableParent = _useState6[0],
68
+ setFindScrollableParent = _useState6[1];
67
69
 
68
- var _useState7 = (0, _react.useState)({
69
- width: tooltipWidth,
70
- height: TOOLTIP_INITIAL_HEIGHT
71
- }),
70
+ var _useState7 = (0, _react.useState)(undefined),
72
71
  _useState8 = _slicedToArray(_useState7, 2),
73
- tooltipDimensions = _useState8[0],
74
- setTooltipDimensions = _useState8[1];
72
+ dimensionsTargetElement = _useState8[0],
73
+ setDimensionsTargetElement = _useState8[1];
75
74
 
76
- var targetElement = (0, _react.useRef)(null);
77
- var tooltipElement = (0, _react.useRef)(null);
75
+ var scrollableParent = (0, _react.useRef)();
76
+ var targetElement = (0, _react.useRef)();
78
77
 
79
78
  var onMouseOver = function onMouseOver(e) {
80
79
  if (targetElement && targetElement.current && targetElement.current.contains(e.target)) {
@@ -86,24 +85,58 @@ var withTooltip = function withTooltip(WrappedComponent) {
86
85
  setShowTooltip(false);
87
86
  };
88
87
 
89
- var onAnyScroll = function onAnyScroll() {
90
- setShowTooltip(false);
88
+ var onParentScroll = function onParentScroll() {
89
+ var currentDimensions = targetElement.current.getBoundingClientRect();
90
+
91
+ if (targetElement.current && dimensionsTargetElement !== currentDimensions) {
92
+ return setDimensionsTargetElement(currentDimensions);
93
+ }
94
+
95
+ return null;
96
+ };
97
+
98
+ var getScrollableParent = function getScrollableParent(node) {
99
+ if (node === null || node.nodeName === '#document') {
100
+ return setFindScrollableParent(false);
101
+ }
102
+
103
+ var _window$getComputedSt = window.getComputedStyle(node),
104
+ overflowY = _window$getComputedSt.overflowY;
105
+
106
+ var isScrollable = overflowY !== 'visible' && overflowY !== 'hidden';
107
+
108
+ if (isScrollable && node.scrollHeight > node.clientHeight) {
109
+ scrollableParent.current = node;
110
+ return setFindScrollableParent(false);
111
+ }
112
+
113
+ return getScrollableParent(node.parentNode);
91
114
  };
92
115
 
93
116
  (0, _react.useEffect)(function () {
94
117
  if (hasTooltip(props)) {
95
118
  document.addEventListener('mouseover', onMouseOver);
96
- document.addEventListener('scroll', onAnyScroll, true);
97
119
 
98
120
  if (targetElement && targetElement.current) {
99
121
  targetElement.current.addEventListener('mouseout', onMouseOut);
100
122
  }
123
+
124
+ if (targetElement && targetElement.current && findScrollableParent) {
125
+ getScrollableParent(targetElement.current);
126
+ }
127
+
128
+ if (scrollableParent && scrollableParent.current) {
129
+ scrollableParent.current.addEventListener('scroll', onParentScroll);
130
+ }
101
131
  }
102
132
 
103
133
  return function () {
104
134
  if (hasTooltip(props)) {
105
135
  document.removeEventListener('mouseover', onMouseOver);
106
- document.removeEventListener('scroll', onAnyScroll, true);
136
+
137
+ if (scrollableParent && scrollableParent.current) {
138
+ scrollableParent.current.removeEventListener('scroll', onParentScroll);
139
+ }
107
140
 
108
141
  if (targetElement && targetElement.current) {
109
142
  targetElement.current.removeEventListener('mouseout', onMouseOut);
@@ -111,76 +144,39 @@ var withTooltip = function withTooltip(WrappedComponent) {
111
144
  }
112
145
  };
113
146
  }, []);
114
- (0, _react.useEffect)(function () {
115
- if (targetElement.current) {
116
- var width = tooltipDimensions.width,
117
- height = tooltipDimensions.height;
118
- var targetDimensions = targetElement.current.getBoundingClientRect();
119
- var targetVerticalCenter = (targetDimensions.top + targetDimensions.bottom) / 2;
120
- var tooltipClientWidth = tooltipElement.current && tooltipElement.current.clientWidth;
121
- var style = "width: ".concat(typeof width === 'string' ? width : "".concat(width, "px"));
122
- var left = targetDimensions.left + targetDimensions.width / 2 - tooltipClientWidth / 2;
123
- left = Math.min(left, document.body.clientWidth - tooltipClientWidth - space);
124
- style += "; left: ".concat(Math.max(space, left), "px");
125
-
126
- switch (tooltipPosition) {
127
- case 'top':
128
- if (targetDimensions.top < height) {
129
- setTooltipPosition('bottom');
130
- } else {
131
- style += "; top: ".concat(targetDimensions.top + window.scrollY - height - 5, "px");
132
- }
133
-
134
- break;
135
-
136
- case 'bottom':
137
- if (window.innerHeight - targetDimensions.bottom < height) {
138
- setTooltipPosition('top');
139
- } else {
140
- style += "; top: ".concat(targetDimensions.top + window.scrollY + targetDimensions.height + 5, "px");
141
- }
142
-
143
- break;
144
-
145
- case 'left':
146
- if (targetDimensions.left < tooltipClientWidth) {
147
- setTooltipPosition('right');
148
- } else {
149
- style += "; top: ".concat(targetVerticalCenter + window.scrollY - height / 2, "px");
150
- style += "; left: ".concat(targetDimensions.left - tooltipClientWidth - 6, "px");
151
- }
152
-
153
- break;
154
-
155
- case 'right':
156
- if (window.innerWidth - targetDimensions.right < tooltipClientWidth) {
157
- setTooltipPosition('left');
158
- } else {
159
- style += "; top: ".concat(targetVerticalCenter + window.scrollY - height / 2, "px");
160
- style += "; left: ".concat(targetDimensions.left + targetDimensions.width + 5, "px");
161
- }
162
-
163
- break;
164
-
165
- default:
166
- style += '';
167
- }
168
147
 
169
- setTooltipStyle(style);
148
+ var getStyle = function getStyle() {
149
+ // where on the screen is the target
150
+ var width = tooltipDimensions.width,
151
+ height = tooltipDimensions.height;
152
+ var targetDimensions = dimensionsTargetElement || targetElement.current.getBoundingClientRect();
153
+ var targetVerticalCenter = (targetDimensions.top + targetDimensions.bottom) / 2;
154
+ var style = "width: ".concat(width + 2, "px");
155
+ var left = targetDimensions.left + targetDimensions.width / 2 - width / 2;
156
+ left = Math.min(left, document.body.clientWidth - width - space);
157
+ style += "; left: ".concat(Math.max(space, left), "px"); // when the position is informed
158
+
159
+ if (tooltipPosition === 'top') {
160
+ style += "; top: ".concat(targetDimensions.top + window.scrollY - height - 5, "px");
161
+ } else if (tooltipPosition === 'bottom') {
162
+ style += "; top: ".concat(targetDimensions.top + window.scrollY + targetDimensions.height + 5, "px");
163
+ } else if (tooltipPosition === 'left') {
164
+ style += "; top: ".concat(targetVerticalCenter + window.scrollY - height / 2, "px");
165
+ style += "; left: ".concat(targetDimensions.left - width - 6, "px");
166
+ } else if (tooltipPosition === 'right') {
167
+ style += "; top: ".concat(targetVerticalCenter + window.scrollY - height / 2, "px");
168
+ style += "; left: ".concat(targetDimensions.left + targetDimensions.width + 5, "px");
170
169
  }
171
- }, [tooltipDimensions, tooltipElement.current, targetElement.current, tooltipPosition]);
172
- (0, _react.useEffect)(function () {
173
- setTooltipPosition(props.tooltipPosition);
174
- }, [window.scrollY, window.scrollX, window.innerWidth]);
170
+
171
+ return style;
172
+ };
175
173
 
176
174
  var getTooltip = function getTooltip() {
177
175
  if (tooltip) {
178
176
  return /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
179
177
  text: tooltip,
180
- tooltipRef: tooltipElement,
181
- style: tooltipStyle,
178
+ style: getStyle(),
182
179
  className: tooltipPosition,
183
- tooltipDimensions: tooltipDimensions,
184
180
  handlerSetDimensions: setTooltipDimensions
185
181
  });
186
182
  }
package/lib/list/Item.js CHANGED
@@ -99,12 +99,12 @@ var Item = function Item(props) {
99
99
 
100
100
  var getProps = function getProps() {
101
101
  if (shouldDisable()) return undefined;
102
- if (_onClick === undefined && dropdownContext === undefined && !selectable) return null;
102
+ if (_onClick === undefined && dropdownContext === undefined) return null;
103
103
  return {
104
104
  onClick: function onClick(e) {
105
- if (_onClick !== undefined) _onClick(e, itemId);
105
+ if (_onClick !== undefined) _onClick(e);
106
106
  if (dropdownContext) dropdownContext.handleDropdownClose();
107
- if (selectable) handleSelectItem(itemId, _onClick);
107
+ if (selectable && handleSelectItem(itemId)) ;
108
108
  },
109
109
  onKeyDown: null,
110
110
  role: 'button',
package/lib/list/index.js CHANGED
@@ -58,30 +58,24 @@ function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "und
58
58
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
59
59
 
60
60
  var List = function List(props) {
61
- var children = props.children,
62
- customClass = props.customClass,
63
- condensed = props.condensed,
64
- transparent = props.transparent,
65
- style = props.style,
66
- selectable = props.selectable,
67
- onSelectItem = props.onSelectItem;
68
-
69
61
  var _useState = (0, _react.useState)(''),
70
62
  _useState2 = _slicedToArray(_useState, 2),
71
63
  selectedItemId = _useState2[0],
72
64
  setSelectedItemId = _useState2[1];
73
65
 
66
+ var children = props.children,
67
+ customClass = props.customClass,
68
+ condensed = props.condensed,
69
+ transparent = props.transparent,
70
+ style = props.style,
71
+ selectable = props.selectable;
74
72
  var contextValues = {
75
73
  selectable: selectable,
76
74
  selectedItemId: selectedItemId,
77
- handleSelectItem: function handleSelectItem(selectedId, onClick) {
78
- if (!onSelectItem && onClick) setSelectedItemId(selectedId);
79
- if (onSelectItem) onSelectItem(selectedId);
75
+ handleSelectItem: function handleSelectItem(selectedId) {
76
+ setSelectedItemId(selectedId);
80
77
  }
81
78
  };
82
- (0, _react.useEffect)(function () {
83
- if (onSelectItem && props.selectedItemId) setSelectedItemId(props.selectedItemId);
84
- }, [props.selectedItemId]);
85
79
  return /*#__PURE__*/_react["default"].createElement(_helpers["default"].Provider, {
86
80
  value: contextValues
87
81
  }, /*#__PURE__*/_react["default"].createElement("ul", {
@@ -97,18 +91,14 @@ List.propTypes = {
97
91
  customClass: _propTypes["default"].string,
98
92
  condensed: _propTypes["default"].bool,
99
93
  selectable: _propTypes["default"].bool,
100
- style: _propTypes["default"].object,
101
- onSelectItem: _propTypes["default"].func,
102
- selectedItemId: _propTypes["default"].string
94
+ style: _propTypes["default"].object
103
95
  };
104
96
  List.defaultProps = {
105
97
  customClass: '',
106
98
  condensed: false,
107
99
  transparent: false,
108
100
  selectable: false,
109
- style: {},
110
- onSelectItem: undefined,
111
- selectedItemId: ''
101
+ style: {}
112
102
  };
113
103
  var _default = List;
114
104
  exports["default"] = _default;