iguazio.dashboard-react-controls 1.3.8 → 1.3.9

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 (3) hide show
  1. package/dist/components/Tooltip/Tooltip.js +57 -43
  2. package/dist/utils/validation.util.js +2 -2
  3. package/package.json +1 -1
package/dist/components/Tooltip/Tooltip.js CHANGED
@@ -65,61 +65,75 @@ var Tooltip = function Tooltip(_ref) {
65
65
  var handleScroll = function handleScroll() {
66
66
  setShow(false);
67
67
  };
68
- var handleMouseLeave = function handleMouseLeave() {
69
- setShow(false);
70
- };
68
+ var handleMouseLeave = (0, _react.useCallback)(function (event) {
69
+ if (tooltipRef.current && !tooltipRef.current.contains(event.relatedTarget) && parentRef.current && !parentRef.current.contains(event.relatedTarget)) {
70
+ setShow(false);
71
+ }
72
+ }, []);
71
73
  var handleMouseEnter = (0, _react.useCallback)(function (event) {
72
- var _parentRef$current$ch = _slicedToArray(parentRef.current.childNodes, 1),
73
- child = _parentRef$current$ch[0];
74
- var show = !hidden && (textShow ? true : !child ? false : child.nodeType !== Node.TEXT_NODE ||
75
- /*
76
- If the child node is a text node and the text of the child node inside the container is greater than the width of the container, then show tooltip.
77
- */
78
- child.nodeType === Node.TEXT_NODE && parentRef.current.scrollWidth > parentRef.current.offsetWidth);
79
- if (show) {
80
- var _parentRef$current$ge, _parentRef$current, _tooltipRef$current$g, _tooltipRef$current;
81
- setShow(true);
82
- var _ref2 = (_parentRef$current$ge = parentRef === null || parentRef === void 0 ? void 0 : (_parentRef$current = parentRef.current) === null || _parentRef$current === void 0 ? void 0 : _parentRef$current.getBoundingClientRect()) !== null && _parentRef$current$ge !== void 0 ? _parentRef$current$ge : {},
83
- height = _ref2.height,
84
- top = _ref2.top,
85
- bottom = _ref2.bottom;
86
- var _ref3 = (_tooltipRef$current$g = (_tooltipRef$current = tooltipRef.current) === null || _tooltipRef$current === void 0 ? void 0 : _tooltipRef$current.getBoundingClientRect()) !== null && _tooltipRef$current$g !== void 0 ? _tooltipRef$current$g : {
87
- height: 0,
88
- width: 0
89
- },
90
- tooltipHeight = _ref3.height,
91
- tooltipWidth = _ref3.width;
92
- var leftPosition = event.x - (event.x + tooltipWidth - window.innerWidth + offset);
93
- var left = event.x + tooltipWidth + offset > window.innerWidth ? leftPosition > offset ? leftPosition : offset : event.x + offset;
94
- if (top + height + offset + tooltipHeight >= window.innerHeight) {
95
- setStyle({
96
- top: bottom - height - offset - tooltipHeight,
97
- left: left
98
- });
99
- } else {
100
- setStyle({
101
- top: top + height + offset,
102
- left: left
103
- });
74
+ if (!show) {
75
+ var _parentRef$current$ch = _slicedToArray(parentRef.current.childNodes, 1),
76
+ child = _parentRef$current$ch[0];
77
+ var _show = !hidden && (textShow ? true : !child ? false : child.nodeType !== Node.TEXT_NODE ||
78
+ /*
79
+ If the child node is a text node and the text of the child node inside the container is greater than the width of the container, then show tooltip.
80
+ */
81
+ child.nodeType === Node.TEXT_NODE && parentRef.current.scrollWidth > parentRef.current.offsetWidth);
82
+ if (_show) {
83
+ var _parentRef$current$ge, _parentRef$current, _tooltipRef$current$g, _tooltipRef$current;
84
+ setShow(true);
85
+ var _ref2 = (_parentRef$current$ge = parentRef === null || parentRef === void 0 ? void 0 : (_parentRef$current = parentRef.current) === null || _parentRef$current === void 0 ? void 0 : _parentRef$current.getBoundingClientRect()) !== null && _parentRef$current$ge !== void 0 ? _parentRef$current$ge : {},
86
+ height = _ref2.height,
87
+ top = _ref2.top,
88
+ bottom = _ref2.bottom;
89
+ var _ref3 = (_tooltipRef$current$g = (_tooltipRef$current = tooltipRef.current) === null || _tooltipRef$current === void 0 ? void 0 : _tooltipRef$current.getBoundingClientRect()) !== null && _tooltipRef$current$g !== void 0 ? _tooltipRef$current$g : {
90
+ height: 0,
91
+ width: 0
92
+ },
93
+ tooltipHeight = _ref3.height,
94
+ tooltipWidth = _ref3.width;
95
+ var leftPosition = event.x - (event.x + tooltipWidth - window.innerWidth + offset);
96
+ var left = event.x + tooltipWidth + offset > window.innerWidth ? leftPosition > offset ? leftPosition : offset : event.x + offset;
97
+ if (top + height + offset + tooltipHeight >= window.innerHeight) {
98
+ var topPosition = bottom - height - offset - tooltipHeight;
99
+ setStyle({
100
+ top: topPosition > 0 ? topPosition : offset,
101
+ left: left
102
+ });
103
+ } else {
104
+ setStyle({
105
+ top: top + height + offset,
106
+ left: left
107
+ });
108
+ }
104
109
  }
105
110
  }
106
- }, [hidden, textShow]);
111
+ }, [hidden, textShow, show]);
107
112
  var clearStyles = (0, _lodash.debounce)(function () {
108
113
  if (!(0, _common.isEveryObjectValueEmpty)(style)) {
109
114
  setStyle({});
110
115
  }
111
116
  }, 100);
112
117
  (0, _react.useEffect)(function () {
113
- var node = parentRef.current;
114
- if (node) {
115
- node.addEventListener('mouseenter', handleMouseEnter);
116
- node.addEventListener('mouseleave', handleMouseLeave);
118
+ var parentNode = parentRef.current;
119
+ if (parentNode) {
120
+ parentNode.addEventListener('mouseenter', handleMouseEnter);
121
+ parentNode.addEventListener('mouseleave', handleMouseLeave);
122
+ return function () {
123
+ parentNode.removeEventListener('mouseenter', handleMouseEnter);
124
+ parentNode.removeEventListener('mouseleave', handleMouseLeave);
125
+ };
126
+ }
127
+ }, [parentRef, handleMouseEnter, handleMouseLeave]);
128
+ (0, _react.useEffect)(function () {
129
+ var tooltipNode = tooltipRef.current;
130
+ if (tooltipNode && show) {
131
+ tooltipNode.addEventListener('mouseleave', handleMouseLeave);
117
132
  return function () {
118
- node.removeEventListener('mouseenter', handleMouseEnter);
119
- node.removeEventListener('mouseleave', handleMouseLeave);
133
+ tooltipNode.removeEventListener('mouseleave', handleMouseLeave);
120
134
  };
121
135
  }
122
- }, [parentRef, handleMouseEnter]);
136
+ }, [tooltipRef, handleMouseEnter, handleMouseLeave, show]);
123
137
  (0, _react.useEffect)(function () {
124
138
  if (show) {
125
139
  window.addEventListener('scroll', handleScroll, true);
package/dist/utils/validation.util.js CHANGED
@@ -228,7 +228,7 @@ var generateRule = {
228
228
  return {
229
229
  name: 'validCharactersWithPrefix',
230
230
  label: _constants.validation.VALID_CHARACTERS + ': ' + convertToLabel(chars),
231
- pattern: new RegExp('^([' + convertToPattern(chars) + ']+\/)?[' + convertToPattern(chars) + ']+$')
231
+ pattern: new RegExp('^([' + convertToPattern(chars) + ']+/)?[' + convertToPattern(chars) + ']+$')
232
232
  };
233
233
  },
234
234
  noConsecutiveCharacters: function noConsecutiveCharacters(chars) {
@@ -318,7 +318,7 @@ var validationRules = {
318
318
  }
319
319
  },
320
320
  function: {
321
- name: [generateRule.validCharacters('a-z A-Z 0-9 - .'), generateRule.beginEndWith('a-z A-Z 0-9'), generateRule.length({
321
+ name: [generateRule.validCharacters('a-z 0-9 - .'), generateRule.beginEndWith('a-z 0-9'), generateRule.length({
322
322
  max: 63
323
323
  }), generateRule.required()]
324
324
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "iguazio.dashboard-react-controls",
3
- "version": "1.3.8",
3
+ "version": "1.3.9",
4
4
  "description": "Collection of resources (such as CSS styles, fonts and images) and ReactJS 17.x components to share among different Iguazio React repos.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",