fix: hide tooltip when not hovered (#2153)

reown-com · Apr 15, 2024 · 100b002 · 100b002
1 parent 165c720
commit 100b002
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 0 deletions.
diff --git a/packages/ui/src/composites/wui-tooltip-select/index.ts b/packages/ui/src/composites/wui-tooltip-select/index.ts
@@ -32,6 +32,7 @@ export class WuiTooltipSelect extends LitElement {
   private onMouseEnter() {
     const element = this.shadowRoot?.querySelector('wui-tooltip')
     if (element) {
+      element.style.display = 'flex'
       element?.animate([{ opacity: 0 }, { opacity: 1 }], {
         fill: 'forwards',
         easing: 'ease',
@@ -43,6 +44,7 @@ export class WuiTooltipSelect extends LitElement {
   private onMouseLeave() {
     const element = this.shadowRoot?.querySelector('wui-tooltip')
     if (element) {
+      element.style.display = 'none'
       element?.animate([{ opacity: 1 }, { opacity: 0 }], {
         fill: 'forwards',
         easing: 'ease',

diff --git a/packages/ui/src/composites/wui-tooltip-select/styles.ts b/packages/ui/src/composites/wui-tooltip-select/styles.ts
@@ -25,6 +25,7 @@ export default css`
     left: 50%;
     transform: translate(-50%, -100%);
     opacity: 0;
+    display: none;
   }
 
   @media (hover: hover) and (pointer: fine) {