From 47313ddc8fc7c7033a1b3a024efc7cd89e8ba869 Mon Sep 17 00:00:00 2001
From: Dan Brown <development@danb.me>
Date: Wed, 16 Sep 2026 17:51:54 +0100
Subject: [PATCH] Content Pointer: Change insert location based on selection
 dir

Updates the content pointer behaviour so it's inserted before/after the
target, instead of just before, depending on selection direction, so it
can stay out of the selection range.
Positioning is absolute relative to a parent content so visually should
be the same result as before.

For #6214
---
 resources/js/components/pointer.ts | 11 +++++++++--
 resources/sass/_pages.scss         |  2 +-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/resources/js/components/pointer.ts b/resources/js/components/pointer.ts
index 4b927045a..37d8cc076 100644
--- a/resources/js/components/pointer.ts
+++ b/resources/js/components/pointer.ts
@@ -105,7 +105,9 @@ export class Pointer extends Component {
      */
     showPointerAtTarget(element: HTMLElement, xPosition: number, keyboardMode: boolean) {
         this.targetElement = element;
-        this.targetSelectionRange = window.getSelection()?.getRangeAt(0) || null;
+        const selectionMade = window.getSelection();
+        const selectionDirection = selectionMade?.direction || '';
+        this.targetSelectionRange = selectionMade?.getRangeAt(0) || null;
         this.updateDomForTarget(element);
 
         this.pointer.style.display = 'block';
@@ -131,7 +133,12 @@ export class Pointer extends Component {
             window.removeEventListener('scroll', scrollListener);
         };
 
-        element.parentElement?.insertBefore(this.pointer, element);
+        if (selectionDirection === 'forward') {
+            element.after(this.pointer);
+        } else {
+            element.before(this.pointer);
+        }
+
         if (!keyboardMode) {
             window.addEventListener('scroll', scrollListener, {passive: true});
         }
diff --git a/resources/sass/_pages.scss b/resources/sass/_pages.scss
index 83aec46f0..9552b14f5 100755
--- a/resources/sass/_pages.scss
+++ b/resources/sass/_pages.scss
@@ -158,7 +158,7 @@ body.tox-fullscreen, body.markdown-fullscreen {
   border-radius: 4px;
   box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.1);
   @include mixins.lightDark(background-color, #fff, #333);
-  width: 328px;
+  width: 344px;
 
   &:before {
     position: absolute;