@haiilo/catalyst 6.1.4 → 6.2.1

package/dist/cjs/cat-alert_25.cjs.entry.js

@@ -10978,9 +10978,14 @@ const CatTooltip = class {
     this.showDelay = 250;
     this.hideDelay = 0;
     this.longTouchDuration = 1000;
+    this.boundShowListener = this.showListener.bind(this);
+    this.boundHideListener = this.hideListener.bind(this);
+    this.boundWindowTouchStartListener = this.windowTouchStartListener.bind(this);
+    this.boundTouchStartListener = this.touchStartListener.bind(this);
+    this.boundTouchEndListener = this.touchEndListener.bind(this);
   }
   handleKeyDown({ key }) {
-    key === 'Escape' && this.hideListener();
+    key === 'Escape' && this.hideTooltip();
   }
   componentDidLoad() {
     const slot = this.hostElement.shadowRoot?.querySelector('slot');
@@ -10989,15 +10994,15 @@ const CatTooltip = class {
       this.trigger.setAttribute('aria-describedby', this.id);
     }
     if (isTouchDevice) {
-      window.addEventListener('touchstart', this.windowTouchStartListener.bind(this));
-      this.trigger?.addEventListener('touchstart', this.touchStartListener.bind(this));
-      this.trigger?.addEventListener('touchend', this.touchEndListener.bind(this));
+      window.addEventListener('touchstart', this.boundWindowTouchStartListener);
+      this.trigger?.addEventListener('touchstart', this.boundTouchStartListener);
+      this.trigger?.addEventListener('touchend', this.boundTouchEndListener);
     }
     else {
-      this.trigger?.addEventListener('focusin', this.showListener.bind(this));
-      this.trigger?.addEventListener('focusout', this.hideListener.bind(this));
-      this.trigger?.addEventListener('mouseenter', this.showListener.bind(this));
-      this.trigger?.addEventListener('mouseleave', this.hideListener.bind(this));
+      this.trigger?.addEventListener('focusin', this.boundShowListener);
+      this.trigger?.addEventListener('focusout', this.boundHideListener);
+      this.trigger?.addEventListener('mouseenter', this.boundShowListener);
+      this.trigger?.addEventListener('mouseleave', this.boundHideListener);
     }
   }
   componentWillRender() {
@@ -11006,15 +11011,15 @@ const CatTooltip = class {
   }
   disconnectedCallback() {
     if (isTouchDevice) {
-      window.removeEventListener('touchstart', this.windowTouchStartListener.bind(this));
-      this.trigger?.removeEventListener('touchstart', this.touchStartListener.bind(this));
-      this.trigger?.removeEventListener('touchend', this.touchEndListener.bind(this));
+      window.removeEventListener('touchstart', this.boundWindowTouchStartListener);
+      this.trigger?.removeEventListener('touchstart', this.boundTouchStartListener);
+      this.trigger?.removeEventListener('touchend', this.boundTouchEndListener);
     }
     else {
-      this.trigger?.removeEventListener('mouseenter', this.showListener.bind(this));
-      this.trigger?.removeEventListener('mouseleave', this.hideListener.bind(this));
-      this.trigger?.removeEventListener('focusin', this.showListener.bind(this));
-      this.trigger?.removeEventListener('focusout', this.hideListener.bind(this));
+      this.trigger?.removeEventListener('mouseenter', this.boundShowListener);
+      this.trigger?.removeEventListener('mouseleave', this.boundHideListener);
+      this.trigger?.removeEventListener('focusin', this.boundShowListener);
+      this.trigger?.removeEventListener('focusout', this.boundHideListener);
     }
   }
   render() {
@@ -11043,42 +11048,53 @@ const CatTooltip = class {
   }
   showListener() {
     window.clearTimeout(this.hideTimeout);
-    this.showTimeout = window.setTimeout(() => {
-      this.showTooltip();
-    }, this.showDelay);
+    this.hideTimeout = undefined;
+    if (!this.showTimeout) {
+      this.showTimeout = window.setTimeout(() => {
+        this.showTimeout = undefined;
+        this.showTooltip();
+      }, this.showDelay);
+    }
   }
   hideListener() {
     window.clearTimeout(this.showTimeout);
-    this.hideTimeout = window.setTimeout(() => {
-      this.tooltip?.classList.remove('tooltip-show');
-      this.hideTooltip();
-    }, this.hideDelay);
+    this.showTimeout = undefined;
+    if (!this.hideTimeout) {
+      this.hideTimeout = window.setTimeout(() => {
+        this.hideTimeout = undefined;
+        this.hideTooltip();
+      }, this.hideDelay);
+    }
   }
   touchStartListener(event) {
     event.stopPropagation();
-    this.touchTimeout = window.setTimeout(() => {
-      this.showTooltip();
-    }, this.longTouchDuration);
+    if (!this.touchTimeout) {
+      this.touchTimeout = window.setTimeout(() => {
+        this.touchTimeout = undefined;
+        this.showTooltip();
+      }, this.longTouchDuration);
+    }
   }
   touchEndListener() {
-    if (this.touchTimeout) {
-      window.clearTimeout(this.touchTimeout);
-      this.hideTooltip();
-    }
+    window.clearTimeout(this.touchTimeout);
+    this.touchTimeout = undefined;
+    this.hideTooltip();
   }
   windowTouchStartListener() {
-    this.tooltip?.classList.remove('tooltip-show');
+    this.hideTooltip();
   }
   showTooltip() {
     if (this.trigger && this.tooltip) {
       this.cleanupFloatingUi = autoUpdate(this.trigger, this.tooltip, () => this.update());
     }
-    !this.hidden && this.tooltip?.classList.add('tooltip-show');
+    if (!this.hidden) {
+      this.tooltip?.classList.add('tooltip-show');
+    }
   }
   hideTooltip() {
-    if (this.cleanupFloatingUi) {
-      this.cleanupFloatingUi();
-    }
+    this.tooltip?.classList.remove('tooltip-show');
+    this.cleanupFloatingUi?.();
+    this.cleanupFloatingUi = undefined;
   }
   get hostElement() { return index.getElement(this); }
 };