From e80d5f3b5b101e4a1b4b65b0545cba33792cf087 Mon Sep 17 00:00:00 2001
From: ComputelessComputer <john@hyprnote.com>
Date: Sun, 22 Feb 2026 22:33:16 +0900
Subject: [PATCH] feat: add hover tooltip positioning for first-child links

Position link hover tooltips below the first child elements in
tiptap editor to prevent them from appearing outside viewport.

Add fadeInBelow animation for smooth tooltip appearance when
displayed below links and adjust tooltip arrow styling to point
upward for proper visual alignment.
---
 packages/tiptap/src/styles/nodes/link.css | 29 +++++++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/packages/tiptap/src/styles/nodes/link.css b/packages/tiptap/src/styles/nodes/link.css
index 8e38c79253..7d325f9070 100644
--- a/packages/tiptap/src/styles/nodes/link.css
+++ b/packages/tiptap/src/styles/nodes/link.css
@@ -51,6 +51,24 @@
   }
 }
 
+.tiptap > :first-child a:hover::after {
+  bottom: auto;
+  top: 100%;
+  margin-bottom: 0;
+  margin-top: 8px;
+  animation: fadeInBelow 0.15s ease-in;
+}
+
+.tiptap > :first-child a:hover::before {
+  bottom: auto;
+  top: 100%;
+  margin-bottom: 0;
+  margin-top: 2px;
+  border-top-color: transparent;
+  border-bottom-color: rgba(0, 0, 0, 0.85);
+  animation: fadeInBelow 0.15s ease-in;
+}
+
 .platform-windows .tiptap a:hover::after,
 .platform-linux .tiptap a:hover::after {
   content: "Ctrl+click to open link";
@@ -66,3 +84,14 @@
     transform: translateX(-50%) translateY(0);
   }
 }
+
+@keyframes fadeInBelow {
+  from {
+    opacity: 0;
+    transform: translateX(-50%) translateY(4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(-50%) translateY(0);
+  }
+}