From 970cfc1178289c73bfb23fd71a6fe0975838b1c0 Mon Sep 17 00:00:00 2001
From: Alexander Taran <a.taran@outlook.com>
Date: Sat, 12 Apr 2025 13:00:51 +0300
Subject: [PATCH] feat(hover-service) make hover-service use platform
 showPopover()

Signed-off-by: Alexander Taran <a.taran@outlook.com>
---
 packages/core/src/browser/hover-service.ts        | 7 +++++++
 packages/core/src/browser/style/hover-service.css | 7 ++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/core/src/browser/hover-service.ts b/packages/core/src/browser/hover-service.ts
index 8ff2d547e9101..2aabec7d90c81 100644
--- a/packages/core/src/browser/hover-service.ts
+++ b/packages/core/src/browser/hover-service.ts
@@ -92,6 +92,7 @@ export class HoverService {
             this._hoverHost = document.createElement('div');
             this._hoverHost.classList.add(HoverService.hostClassName);
             this._hoverHost.style.position = 'absolute';
+            this._hoverHost.setAttribute('popover', 'hint');
         }
         return this._hoverHost;
     }
@@ -138,6 +139,9 @@ export class HoverService {
         host.style.left = '0px';
         host.style.top = '0px';
         document.body.append(host);
+        if (!host.matches(':popover-open')) {
+            host.showPopover();
+        }
 
         if (request.visualPreview) {
             // If just a string is being rendered use the size of the outer box
@@ -219,6 +223,9 @@ export class HoverService {
     }
 
     protected unRenderHover(): void {
+        if (this.hoverHost.matches(':popover-open')) {
+            this.hoverHost.hidePopover();
+        }
         this.hoverHost.remove();
         this.hoverHost.replaceChildren();
     }
diff --git a/packages/core/src/browser/style/hover-service.css b/packages/core/src/browser/style/hover-service.css
index bcd24dd606284..f8cf25f09318c 100644
--- a/packages/core/src/browser/style/hover-service.css
+++ b/packages/core/src/browser/style/hover-service.css
@@ -29,7 +29,12 @@
   border: 1px solid var(--theia-editorHoverWidget-border);
   padding: var(--theia-ui-padding);
   max-width: var(--theia-hover-max-width);
-  z-index: 1000;
+}
+
+/* user agent style-sheet has overflow:hidden, so pointer is not visible but scroll is */
+.theia-hover[popover] {
+  inset: unset;
+  overflow: visible;
 }
 
 .theia-hover .hover-row:not(:first-child):not(:empty) {