fix: terms extend beyond right edge of screen (#447)

Fixed a bug where the term pop-up would extend beyond the edge of the screen on mobile devices.

If the pop-up window goes beyond the right edge of the screen (on mobile devices), then the pop-up window is shifted to the left by as many pixels as it went beyond the screen and plus 5 pixels

----------------------------------------------------------------------------------------------------

Co-authored-by: Ruslan Bagautdinov <[email protected]>

Author: JeikZim

src/js/term/utils.ts

@@ -86,16 +86,21 @@ export function setDefinitionPosition(
     const fitDefinitionDocument =
         isAlignSwapped && !definitionOutOfScreenOnLeft ? definitionWidth - termWidth : 0;
     const customHeaderTop = getCoords(definitionParent).top - definitionParent.offsetTop;
+    const offsetRight = 5;
+    const shiftLeft = definitionOutOfScreenOnRight
+        ? definitionRightCoordinate - document.body.clientWidth + offsetRight
+        : 0;
+    const offsetLeft =
+        getCoords(termElement).left -
+        definitionParentLeft +
+        definitionParent.offsetLeft -
+        fitDefinitionDocument;
+
+    const isShiftLeftNeeded = offsetLeft + definitionWidth >= document.body.clientWidth;
 
     definitionElement.style.top =
         Number(getCoords(termElement).top + offsetTop - customHeaderTop) + 'px';
-    definitionElement.style.left =
-        Number(
-            getCoords(termElement).left -
-                definitionParentLeft +
-                definitionParent.offsetLeft -
-                fitDefinitionDocument,
-        ) + 'px';
+    definitionElement.style.left = Number(offsetLeft - (isShiftLeftNeeded ? shiftLeft : 0)) + 'px';
 }
 
 function termOnResize() {