refactor: prepare tooltip overlay mixin for using by popover (#7403)

vaadin · May 13, 2024 · c0e9352 · c0e9352
1 parent bb83228
commit c0e9352
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 5 deletions.
diff --git a/packages/tooltip/src/vaadin-lit-tooltip-overlay.js b/packages/tooltip/src/vaadin-lit-tooltip-overlay.js
@@ -40,6 +40,12 @@ class TooltipOverlay extends TooltipOverlayMixin(DirMixin(ThemableMixin(PolylitM
       </div>
     `;
   }
+
+  requestContentUpdate() {
+    super.requestContentUpdate();
+
+    this.toggleAttribute('hidden', this.textContent.trim() === '');
+  }
 }
 
 defineCustomElement(TooltipOverlay);
diff --git a/packages/tooltip/src/vaadin-tooltip-overlay-mixin.js b/packages/tooltip/src/vaadin-tooltip-overlay-mixin.js
@@ -24,18 +24,25 @@ export const TooltipOverlayMixin = (superClass) =>
       };
     }
 
+    /**
+     * Tag name prefix used by custom properties.
+     * @protected
+     * @return {string}
+     */
+    get _tagNamePrefix() {
+      return 'vaadin-tooltip';
+    }
+
     requestContentUpdate() {
       super.requestContentUpdate();
 
-      this.toggleAttribute('hidden', this.textContent.trim() === '');
-
       // Copy custom properties from the tooltip
       if (this.positionTarget && this.owner) {
         const style = getComputedStyle(this.owner);
         ['top', 'bottom', 'start', 'end'].forEach((prop) => {
           this.style.setProperty(
-            `--vaadin-tooltip-offset-${prop}`,
-            style.getPropertyValue(`--vaadin-tooltip-offset-${prop}`),
+            `--${this._tagNamePrefix}-offset-${prop}`,
+            style.getPropertyValue(`--${this._tagNamePrefix}-offset-${prop}`),
           );
         });
       }
@@ -48,7 +55,7 @@ export const TooltipOverlayMixin = (superClass) =>
     _updatePosition() {
       super._updatePosition();
 
-      if (!this.positionTarget) {
+      if (!this.positionTarget || !this.opened) {
         return;
       }
 

diff --git a/packages/tooltip/src/vaadin-tooltip-overlay.js b/packages/tooltip/src/vaadin-tooltip-overlay.js
@@ -49,6 +49,12 @@ class TooltipOverlay extends TooltipOverlayMixin(DirMixin(ThemableMixin(PolymerE
     this.owner = this.__dataHost;
     this.owner._overlayElement = this;
   }
+
+  requestContentUpdate() {
+    super.requestContentUpdate();
+
+    this.toggleAttribute('hidden', this.textContent.trim() === '');
+  }
 }
 
 defineCustomElement(TooltipOverlay);