@lanaco/lnc-react-ui 2.1.43 → 2.1.45

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.
package/lib/index.esm.js CHANGED
@@ -14692,7 +14692,11 @@ function Modal(props) {
14692
14692
 
14693
14693
  var onClickOutsideModal = function onClickOutsideModal(event) {
14694
14694
  if (event.target !== event.currentTarget) return;
14695
- if (clickOutsideToClose || !showHeader) onClose(event);
14695
+
14696
+ if (clickOutsideToClose || !showHeader) {
14697
+ document.body.style.overflow = "auto";
14698
+ onClose(event);
14699
+ }
14696
14700
  };
14697
14701
  var containerVariant = {
14698
14702
  initial: {
@@ -14708,6 +14712,11 @@ function Modal(props) {
14708
14712
  top: "-50%"
14709
14713
  }
14710
14714
  };
14715
+
14716
+ if (open) {
14717
+ document.body.style.overflow = "hidden";
14718
+ }
14719
+
14711
14720
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, open && /*#__PURE__*/React__default.createElement(Overlay, _extends$d({}, themeProps, {
14712
14721
  onClick: onClickOutsideModal,
14713
14722
  className: className
@@ -14720,7 +14729,8 @@ function Modal(props) {
14720
14729
  icon: "times",
14721
14730
  iconStyle: "solid",
14722
14731
  onClick: function onClick(e) {
14723
- return onClose(e);
14732
+ document.body.style.overflow = "auto";
14733
+ onClose(e);
14724
14734
  },
14725
14735
  color: basic ? "transparent" : themeProps.color
14726
14736
  })))), /*#__PURE__*/React__default.createElement(Content$4, themeProps, children)))));
@@ -42129,7 +42139,18 @@ var DateInput = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
42129
42139
  var jsDate = fromDateStringToJsDate(value);
42130
42140
  setDate(jsDate);
42131
42141
  setText(fromJsDateToDateString(jsDate));
42132
- }, [value]); //=============== METHODS ============================================================
42142
+ }, [value]);
42143
+ useEffect(function () {
42144
+ var wheelListener = function wheelListener(e) {
42145
+ setOpenCalendar(false);
42146
+ };
42147
+
42148
+ if (openCalendar) {
42149
+ window.addEventListener("wheel", wheelListener);
42150
+ } else {
42151
+ window.removeEventListener("wheel", wheelListener);
42152
+ }
42153
+ }, [openCalendar]); //=============== METHODS ============================================================
42133
42154
 
42134
42155
  var validateDateFormat = function validateDateFormat() {
42135
42156
  var _format = format.toLowerCase();
@@ -42242,7 +42263,7 @@ var DateInput = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
42242
42263
  }
42243
42264
 
42244
42265
  if (!openCalendar) {
42245
- var target = targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42266
+ var target = targetID === undefined || targetID === null || targetID === "#" || targetID === "" ? null : targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42246
42267
 
42247
42268
  if (target !== null) {
42248
42269
  target.innerHTML = "";
@@ -42337,7 +42358,7 @@ var DateInput = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
42337
42358
  var calculatedTop = "" + dpContainerDOMRect.top + "px";
42338
42359
  var calculatedWidth = "" + dpContainerDOMRect.width + "px";
42339
42360
  var el = document.createElement("div");
42340
- el.style = "position: absolute;\n background-color: white;\n z-index: 2147483647 !important;\n left: ".concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, " !important;\n min-height: ").concat(heightBySize$a(size));
42361
+ el.style = "position: fixed;\n background-color: white;\n z-index: 2147483647 !important;\n left: ".concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, " !important;\n min-height: ").concat(heightBySize$a(size));
42341
42362
 
42342
42363
  if (target !== null) {
42343
42364
  target.appendChild(el);
@@ -42576,6 +42597,17 @@ var DropdownLookup = function DropdownLookup(props) {
42576
42597
  setValue(selectedOption.value);
42577
42598
  }
42578
42599
  }, [selectedOption]);
42600
+ useEffect(function () {
42601
+ var wheelListener = function wheelListener(e) {
42602
+ setInFocus(false);
42603
+ };
42604
+
42605
+ if (inFocus) {
42606
+ window.addEventListener("wheel", wheelListener);
42607
+ } else {
42608
+ window.removeEventListener("wheel", wheelListener);
42609
+ }
42610
+ }, [inFocus]);
42579
42611
 
42580
42612
  var updateSelectedValue = function updateSelectedValue(data) {
42581
42613
  var updateText = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
@@ -42664,7 +42696,7 @@ var DropdownLookup = function DropdownLookup(props) {
42664
42696
  };
42665
42697
 
42666
42698
  var renderSuggestions = function renderSuggestions() {
42667
- var target = targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42699
+ var target = targetID === undefined || targetID === null || targetID === "#" || targetID === "" ? null : targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42668
42700
 
42669
42701
  if (!inFocus) {
42670
42702
  if (target !== null) {
@@ -42679,10 +42711,10 @@ var DropdownLookup = function DropdownLookup(props) {
42679
42711
  var calculatedWidth = "" + ddlContainerDOMRect.width + "px";
42680
42712
  var calculatedLeft = "" + ddlContainerDOMRect.left + "px";
42681
42713
  var calculatedTop = "" + ddlContainerDOMRect.top + "px";
42682
- el.style = "position: absolute;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(heightBySize$9(size));
42714
+ el.style = "position: fixed;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(heightBySize$9(size));
42683
42715
 
42684
42716
  if (options !== null && options.length > 0 && inFocus) {
42685
- el.style = "position: absolute;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n overflow: auto;\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(options.length > 5 ? heightBySize$9(size, 5) : heightBySize$9(size, options.length + 1));
42717
+ el.style = "position: fixed;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n overflow: auto;\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(options.length > 5 ? heightBySize$9(size, 5) : heightBySize$9(size, options.length + 1));
42686
42718
 
42687
42719
  if (target !== null) {
42688
42720
  target.appendChild(el);
@@ -45790,7 +45822,8 @@ var PeriodSelector = function PeriodSelector(props) {
45790
45822
  size = props.size,
45791
45823
  color = props.color,
45792
45824
  theme = props.theme,
45793
- className = props.className;
45825
+ className = props.className,
45826
+ targetID = props.targetID;
45794
45827
  var themeProps = {
45795
45828
  size: size,
45796
45829
  color: color,
@@ -45804,13 +45837,15 @@ var PeriodSelector = function PeriodSelector(props) {
45804
45837
  value: startDate,
45805
45838
  onChange: function onChange(_, date) {
45806
45839
  return onStartDateChange(id, date);
45807
- }
45840
+ },
45841
+ targetID: targetID
45808
45842
  })), /*#__PURE__*/React__default.createElement(DateInput, _extends$d({}, themeProps, {
45809
45843
  format: dateFormat,
45810
45844
  value: endDate,
45811
45845
  onChange: function onChange(_, date) {
45812
45846
  return onEndDateChange(id, date);
45813
- }
45847
+ },
45848
+ targetID: targetID
45814
45849
  })));
45815
45850
  };
45816
45851
 
@@ -47072,12 +47107,12 @@ var Tooltip = function Tooltip(props) {
47072
47107
  show = _useState2[0],
47073
47108
  setShow = _useState2[1];
47074
47109
 
47075
- var _useState3 = useState("position: absolute;"),
47110
+ var _useState3 = useState("position: fixed;"),
47076
47111
  _useState4 = _slicedToArray(_useState3, 2),
47077
47112
  style = _useState4[0],
47078
47113
  setStyle = _useState4[1];
47079
47114
 
47080
- var target = targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
47115
+ var target = targetID === undefined || targetID === null || targetID === "#" || targetID === "" ? null : targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
47081
47116
  var el = document.createElement('div');
47082
47117
  el.style = style;
47083
47118
  useEffect(function () {
@@ -47089,13 +47124,13 @@ var Tooltip = function Tooltip(props) {
47089
47124
 
47090
47125
  var CalculateStyle = function CalculateStyle(mouseX, mouseY) {
47091
47126
  if (mouseX <= window.innerWidth / 2 && mouseY <= window.innerHeight / 2) {
47092
- return "position: absolute; \n left: ".concat(mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47127
+ return "position: fixed; \n left: ".concat(mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47093
47128
  } else if (mouseX > window.innerWidth / 2 && mouseY <= window.innerHeight / 2) {
47094
- return "position: absolute; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47129
+ return "position: fixed; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47095
47130
  } else if (mouseX <= window.innerWidth / 2 && mouseY > window.innerHeight / 2) {
47096
- return "position: absolute; \n left: ".concat(mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47131
+ return "position: fixed; \n left: ".concat(mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47097
47132
  } else if (mouseX > window.innerWidth / 2 && mouseY > window.innerHeight / 2) {
47098
- return "position: absolute; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47133
+ return "position: fixed; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47099
47134
  }
47100
47135
  };
47101
47136
 
@@ -47104,7 +47139,7 @@ var Tooltip = function Tooltip(props) {
47104
47139
  onMouseLeave: function onMouseLeave(event) {
47105
47140
  event.stopPropagation();
47106
47141
  target.innerHTML = "";
47107
- setStyle("position: absolute;");
47142
+ setStyle("position: fixed;");
47108
47143
  setShow(false);
47109
47144
  }
47110
47145
  }, renderContent());
@@ -47122,7 +47157,7 @@ var Tooltip = function Tooltip(props) {
47122
47157
  onMouseLeave: function onMouseLeave(event) {
47123
47158
  event.stopPropagation();
47124
47159
  target.innerHTML = "";
47125
- setStyle("position: absolute;");
47160
+ setStyle("position: fixed;");
47126
47161
  setShow(false);
47127
47162
  }
47128
47163
  }, props.children));
package/lib/index.js CHANGED
@@ -14733,7 +14733,11 @@ function Modal(props) {
14733
14733
 
14734
14734
  var onClickOutsideModal = function onClickOutsideModal(event) {
14735
14735
  if (event.target !== event.currentTarget) return;
14736
- if (clickOutsideToClose || !showHeader) onClose(event);
14736
+
14737
+ if (clickOutsideToClose || !showHeader) {
14738
+ document.body.style.overflow = "auto";
14739
+ onClose(event);
14740
+ }
14737
14741
  };
14738
14742
  var containerVariant = {
14739
14743
  initial: {
@@ -14749,6 +14753,11 @@ function Modal(props) {
14749
14753
  top: "-50%"
14750
14754
  }
14751
14755
  };
14756
+
14757
+ if (open) {
14758
+ document.body.style.overflow = "hidden";
14759
+ }
14760
+
14752
14761
  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, open && /*#__PURE__*/React__default['default'].createElement(Overlay, _extends__default['default']({}, themeProps, {
14753
14762
  onClick: onClickOutsideModal,
14754
14763
  className: className
@@ -14761,7 +14770,8 @@ function Modal(props) {
14761
14770
  icon: "times",
14762
14771
  iconStyle: "solid",
14763
14772
  onClick: function onClick(e) {
14764
- return onClose(e);
14773
+ document.body.style.overflow = "auto";
14774
+ onClose(e);
14765
14775
  },
14766
14776
  color: basic ? "transparent" : themeProps.color
14767
14777
  })))), /*#__PURE__*/React__default['default'].createElement(Content$4, themeProps, children)))));
@@ -42170,7 +42180,18 @@ var DateInput = /*#__PURE__*/React__default['default'].forwardRef(function (prop
42170
42180
  var jsDate = fromDateStringToJsDate(value);
42171
42181
  setDate(jsDate);
42172
42182
  setText(fromJsDateToDateString(jsDate));
42173
- }, [value]); //=============== METHODS ============================================================
42183
+ }, [value]);
42184
+ React.useEffect(function () {
42185
+ var wheelListener = function wheelListener(e) {
42186
+ setOpenCalendar(false);
42187
+ };
42188
+
42189
+ if (openCalendar) {
42190
+ window.addEventListener("wheel", wheelListener);
42191
+ } else {
42192
+ window.removeEventListener("wheel", wheelListener);
42193
+ }
42194
+ }, [openCalendar]); //=============== METHODS ============================================================
42174
42195
 
42175
42196
  var validateDateFormat = function validateDateFormat() {
42176
42197
  var _format = format.toLowerCase();
@@ -42283,7 +42304,7 @@ var DateInput = /*#__PURE__*/React__default['default'].forwardRef(function (prop
42283
42304
  }
42284
42305
 
42285
42306
  if (!openCalendar) {
42286
- var target = targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42307
+ var target = targetID === undefined || targetID === null || targetID === "#" || targetID === "" ? null : targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42287
42308
 
42288
42309
  if (target !== null) {
42289
42310
  target.innerHTML = "";
@@ -42378,7 +42399,7 @@ var DateInput = /*#__PURE__*/React__default['default'].forwardRef(function (prop
42378
42399
  var calculatedTop = "" + dpContainerDOMRect.top + "px";
42379
42400
  var calculatedWidth = "" + dpContainerDOMRect.width + "px";
42380
42401
  var el = document.createElement("div");
42381
- el.style = "position: absolute;\n background-color: white;\n z-index: 2147483647 !important;\n left: ".concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, " !important;\n min-height: ").concat(heightBySize$a(size));
42402
+ el.style = "position: fixed;\n background-color: white;\n z-index: 2147483647 !important;\n left: ".concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, " !important;\n min-height: ").concat(heightBySize$a(size));
42382
42403
 
42383
42404
  if (target !== null) {
42384
42405
  target.appendChild(el);
@@ -42617,6 +42638,17 @@ var DropdownLookup = function DropdownLookup(props) {
42617
42638
  setValue(selectedOption.value);
42618
42639
  }
42619
42640
  }, [selectedOption]);
42641
+ React.useEffect(function () {
42642
+ var wheelListener = function wheelListener(e) {
42643
+ setInFocus(false);
42644
+ };
42645
+
42646
+ if (inFocus) {
42647
+ window.addEventListener("wheel", wheelListener);
42648
+ } else {
42649
+ window.removeEventListener("wheel", wheelListener);
42650
+ }
42651
+ }, [inFocus]);
42620
42652
 
42621
42653
  var updateSelectedValue = function updateSelectedValue(data) {
42622
42654
  var updateText = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
@@ -42705,7 +42737,7 @@ var DropdownLookup = function DropdownLookup(props) {
42705
42737
  };
42706
42738
 
42707
42739
  var renderSuggestions = function renderSuggestions() {
42708
- var target = targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42740
+ var target = targetID === undefined || targetID === null || targetID === "#" || targetID === "" ? null : targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
42709
42741
 
42710
42742
  if (!inFocus) {
42711
42743
  if (target !== null) {
@@ -42720,10 +42752,10 @@ var DropdownLookup = function DropdownLookup(props) {
42720
42752
  var calculatedWidth = "" + ddlContainerDOMRect.width + "px";
42721
42753
  var calculatedLeft = "" + ddlContainerDOMRect.left + "px";
42722
42754
  var calculatedTop = "" + ddlContainerDOMRect.top + "px";
42723
- el.style = "position: absolute;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(heightBySize$9(size));
42755
+ el.style = "position: fixed;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(heightBySize$9(size));
42724
42756
 
42725
42757
  if (options !== null && options.length > 0 && inFocus) {
42726
- el.style = "position: absolute;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n overflow: auto;\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(options.length > 5 ? heightBySize$9(size, 5) : heightBySize$9(size, options.length + 1));
42758
+ el.style = "position: fixed;\n background-color: white;\n z-index: 2147483647 !important;\n transform: translateY( ".concat(heightBySize$9(size), ");\n overflow: auto;\n left: ").concat(calculatedLeft, " !important;\n top: ").concat(calculatedTop, " !important;\n width: ").concat(calculatedWidth, ";\n min-height: ").concat(options.length > 5 ? heightBySize$9(size, 5) : heightBySize$9(size, options.length + 1));
42727
42759
 
42728
42760
  if (target !== null) {
42729
42761
  target.appendChild(el);
@@ -45831,7 +45863,8 @@ var PeriodSelector = function PeriodSelector(props) {
45831
45863
  size = props.size,
45832
45864
  color = props.color,
45833
45865
  theme = props.theme,
45834
- className = props.className;
45866
+ className = props.className,
45867
+ targetID = props.targetID;
45835
45868
  var themeProps = {
45836
45869
  size: size,
45837
45870
  color: color,
@@ -45845,13 +45878,15 @@ var PeriodSelector = function PeriodSelector(props) {
45845
45878
  value: startDate,
45846
45879
  onChange: function onChange(_, date) {
45847
45880
  return onStartDateChange(id, date);
45848
- }
45881
+ },
45882
+ targetID: targetID
45849
45883
  })), /*#__PURE__*/React__default['default'].createElement(DateInput, _extends__default['default']({}, themeProps, {
45850
45884
  format: dateFormat,
45851
45885
  value: endDate,
45852
45886
  onChange: function onChange(_, date) {
45853
45887
  return onEndDateChange(id, date);
45854
- }
45888
+ },
45889
+ targetID: targetID
45855
45890
  })));
45856
45891
  };
45857
45892
 
@@ -47113,12 +47148,12 @@ var Tooltip = function Tooltip(props) {
47113
47148
  show = _useState2[0],
47114
47149
  setShow = _useState2[1];
47115
47150
 
47116
- var _useState3 = React.useState("position: absolute;"),
47151
+ var _useState3 = React.useState("position: fixed;"),
47117
47152
  _useState4 = _slicedToArray__default['default'](_useState3, 2),
47118
47153
  style = _useState4[0],
47119
47154
  setStyle = _useState4[1];
47120
47155
 
47121
- var target = targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
47156
+ var target = targetID === undefined || targetID === null || targetID === "#" || targetID === "" ? null : targetID.startsWith('#') ? document.querySelector(targetID) : document.querySelector("#" + targetID);
47122
47157
  var el = document.createElement('div');
47123
47158
  el.style = style;
47124
47159
  React.useEffect(function () {
@@ -47130,13 +47165,13 @@ var Tooltip = function Tooltip(props) {
47130
47165
 
47131
47166
  var CalculateStyle = function CalculateStyle(mouseX, mouseY) {
47132
47167
  if (mouseX <= window.innerWidth / 2 && mouseY <= window.innerHeight / 2) {
47133
- return "position: absolute; \n left: ".concat(mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47168
+ return "position: fixed; \n left: ".concat(mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47134
47169
  } else if (mouseX > window.innerWidth / 2 && mouseY <= window.innerHeight / 2) {
47135
- return "position: absolute; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47170
+ return "position: fixed; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n top: ").concat(mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47136
47171
  } else if (mouseX <= window.innerWidth / 2 && mouseY > window.innerHeight / 2) {
47137
- return "position: absolute; \n left: ".concat(mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47172
+ return "position: fixed; \n left: ".concat(mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47138
47173
  } else if (mouseX > window.innerWidth / 2 && mouseY > window.innerHeight / 2) {
47139
- return "position: absolute; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47174
+ return "position: fixed; \n right: ".concat(window.innerWidth - mouseX - 10, "px; \n bottom: ").concat(window.innerHeight - mouseY - 10, "px; \n width: auto; \n height: auto; \n box-shadow: 0 0 6px #bebebe; \n border-radius: 0.175rem; \n background-color: white; \n overflow: auto; \n max-height: ").concat(window.innerHeight - 20, "px; \n z-index: 999;");
47140
47175
  }
47141
47176
  };
47142
47177
 
@@ -47145,7 +47180,7 @@ var Tooltip = function Tooltip(props) {
47145
47180
  onMouseLeave: function onMouseLeave(event) {
47146
47181
  event.stopPropagation();
47147
47182
  target.innerHTML = "";
47148
- setStyle("position: absolute;");
47183
+ setStyle("position: fixed;");
47149
47184
  setShow(false);
47150
47185
  }
47151
47186
  }, renderContent());
@@ -47163,7 +47198,7 @@ var Tooltip = function Tooltip(props) {
47163
47198
  onMouseLeave: function onMouseLeave(event) {
47164
47199
  event.stopPropagation();
47165
47200
  target.innerHTML = "";
47166
- setStyle("position: absolute;");
47201
+ setStyle("position: fixed;");
47167
47202
  setShow(false);
47168
47203
  }
47169
47204
  }, props.children));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lanaco/lnc-react-ui",
3
- "version": "2.1.43",
3
+ "version": "2.1.45",
4
4
  "description": "component library",
5
5
  "main": "lib/index.js",
6
6
  "module": "lib/index.esm.js",