@rpg-engine/long-bow 0.8.230 → 0.8.231
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/dist/long-bow.cjs.development.js +38 -18
- package/dist/long-bow.cjs.development.js.map +1 -1
- package/dist/long-bow.cjs.production.min.js +1 -1
- package/dist/long-bow.cjs.production.min.js.map +1 -1
- package/dist/long-bow.esm.js +38 -18
- package/dist/long-bow.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Item/Cards/ItemTooltip.tsx +27 -16
- package/src/components/shared/SimpleTooltip.tsx +32 -19
package/dist/long-bow.esm.js
CHANGED
|
@@ -3732,26 +3732,35 @@ var ItemTooltip = function ItemTooltip(_ref) {
|
|
|
3732
3732
|
atlasJSON = _ref.atlasJSON,
|
|
3733
3733
|
equipmentSet = _ref.equipmentSet;
|
|
3734
3734
|
var ref = useRef(null);
|
|
3735
|
+
var rafId = useRef(null);
|
|
3735
3736
|
useEffect(function () {
|
|
3736
3737
|
var current = ref.current;
|
|
3737
3738
|
if (current) {
|
|
3738
3739
|
var handleMouseMove = function handleMouseMove(event) {
|
|
3740
|
+
if (rafId.current !== null) return;
|
|
3739
3741
|
var clientX = event.clientX,
|
|
3740
3742
|
clientY = event.clientY;
|
|
3741
|
-
|
|
3742
|
-
|
|
3743
|
-
|
|
3744
|
-
|
|
3745
|
-
|
|
3746
|
-
|
|
3747
|
-
|
|
3748
|
-
|
|
3749
|
-
|
|
3750
|
-
|
|
3743
|
+
rafId.current = requestAnimationFrame(function () {
|
|
3744
|
+
rafId.current = null;
|
|
3745
|
+
// Adjust the position of the tooltip based on the mouse position
|
|
3746
|
+
var rect = current.getBoundingClientRect();
|
|
3747
|
+
var tooltipWidth = rect.width;
|
|
3748
|
+
var tooltipHeight = rect.height;
|
|
3749
|
+
var isOffScreenRight = clientX + tooltipWidth + offset > window.innerWidth;
|
|
3750
|
+
var isOffScreenBottom = clientY + tooltipHeight + offset > window.innerHeight;
|
|
3751
|
+
var x = isOffScreenRight ? clientX - tooltipWidth - offset : clientX + offset;
|
|
3752
|
+
var y = isOffScreenBottom ? clientY - tooltipHeight - offset : clientY + offset;
|
|
3753
|
+
current.style.transform = "translate(" + x + "px, " + y + "px)";
|
|
3754
|
+
current.style.opacity = '1';
|
|
3755
|
+
});
|
|
3751
3756
|
};
|
|
3752
3757
|
window.addEventListener('mousemove', handleMouseMove);
|
|
3753
3758
|
return function () {
|
|
3754
3759
|
window.removeEventListener('mousemove', handleMouseMove);
|
|
3760
|
+
if (rafId.current !== null) {
|
|
3761
|
+
cancelAnimationFrame(rafId.current);
|
|
3762
|
+
rafId.current = null;
|
|
3763
|
+
}
|
|
3755
3764
|
};
|
|
3756
3765
|
}
|
|
3757
3766
|
return;
|
|
@@ -5357,6 +5366,7 @@ var SimpleTooltip = function SimpleTooltip(_ref) {
|
|
|
5357
5366
|
var tooltipRef = useRef(null);
|
|
5358
5367
|
var triggerRef = useRef(null);
|
|
5359
5368
|
var timeoutRef = useRef();
|
|
5369
|
+
var rafId = useRef(null);
|
|
5360
5370
|
var calculatePosition = function calculatePosition() {
|
|
5361
5371
|
if (!triggerRef.current || !tooltipRef.current) return;
|
|
5362
5372
|
var triggerRect = triggerRef.current.getBoundingClientRect();
|
|
@@ -5408,15 +5418,21 @@ var SimpleTooltip = function SimpleTooltip(_ref) {
|
|
|
5408
5418
|
};
|
|
5409
5419
|
useEffect(function () {
|
|
5410
5420
|
var handleMouseMove = function handleMouseMove(event) {
|
|
5411
|
-
if (
|
|
5412
|
-
|
|
5413
|
-
|
|
5414
|
-
|
|
5415
|
-
|
|
5416
|
-
if (
|
|
5417
|
-
|
|
5421
|
+
if (rafId.current !== null) return;
|
|
5422
|
+
var clientX = event.clientX,
|
|
5423
|
+
clientY = event.clientY;
|
|
5424
|
+
rafId.current = requestAnimationFrame(function () {
|
|
5425
|
+
rafId.current = null;
|
|
5426
|
+
if (visible && tooltipRef.current && triggerRef.current) {
|
|
5427
|
+
var tooltipRect = tooltipRef.current.getBoundingClientRect();
|
|
5428
|
+
var triggerRect = triggerRef.current.getBoundingClientRect();
|
|
5429
|
+
var isOutsideTooltip = clientX < tooltipRect.left || clientX > tooltipRect.right || clientY < tooltipRect.top || clientY > tooltipRect.bottom;
|
|
5430
|
+
var isOutsideTrigger = clientX < triggerRect.left || clientX > triggerRect.right || clientY < triggerRect.top || clientY > triggerRect.bottom;
|
|
5431
|
+
if (isOutsideTooltip && isOutsideTrigger) {
|
|
5432
|
+
hideTooltip();
|
|
5433
|
+
}
|
|
5418
5434
|
}
|
|
5419
|
-
}
|
|
5435
|
+
});
|
|
5420
5436
|
};
|
|
5421
5437
|
var handleScroll = function handleScroll() {
|
|
5422
5438
|
if (visible) {
|
|
@@ -5435,6 +5451,10 @@ var SimpleTooltip = function SimpleTooltip(_ref) {
|
|
|
5435
5451
|
document.removeEventListener('mousemove', handleMouseMove);
|
|
5436
5452
|
window.removeEventListener('scroll', handleScroll);
|
|
5437
5453
|
window.removeEventListener('resize', handleResize);
|
|
5454
|
+
if (rafId.current !== null) {
|
|
5455
|
+
cancelAnimationFrame(rafId.current);
|
|
5456
|
+
rafId.current = null;
|
|
5457
|
+
}
|
|
5438
5458
|
clearTimeout(timeoutRef.current);
|
|
5439
5459
|
};
|
|
5440
5460
|
}, [visible]);
|