codexly-ui 0.5.1 → 0.5.3

package/fesm2022/codexly-ui.mjs

@@ -2322,10 +2322,14 @@ class ClxTooltipDirective {
         host.addEventListener('focus', () => this._scheduleShow(), { signal });
         host.addEventListener('blur', () => this._scheduleHide(), { signal });
         // Touch devices fire 'mouseenter'/'focus' on tap but never a real
-        // 'mouseleave' — hide immediately once the tap completes instead of
-        // leaving the bubble stuck until the next unrelated touch.
-        host.addEventListener('touchend', () => this._hide(), { signal });
-        host.addEventListener('touchcancel', () => this._hide(), { signal });
+        // 'mouseleave' — dismiss immediately (no fade) so the bubble can't
+        // outlive the tap and float over whatever it triggered (e.g. a modal
+        // opening on the same gesture). Capture-phase 'click' fires before the
+        // host's own (click) handler — the one that actually opens the modal —
+        // so the bubble is gone from the DOM before the modal is created.
+        host.addEventListener('touchend', () => this._hideImmediate(), { signal });
+        host.addEventListener('touchcancel', () => this._hideImmediate(), { signal });
+        host.addEventListener('click', () => this._hideImmediate(), { signal, capture: true });
         this._destroyRef.onDestroy(() => {
             this._destroyed = true;
             this._abort.abort();
@@ -2407,6 +2411,18 @@ class ClxTooltipDirective {
             ref.destroy();
         });
     }
+    /** Synchronous teardown, no fade — used on touchend so the bubble can't linger over UI the tap opens. */
+    _hideImmediate() {
+        this._clearTimers();
+        this._destroyBubble();
+        if (this._pendingRef) {
+            const el = this._pendingRef.location.nativeElement;
+            this._animate.stop(el);
+            this._appRef.detachView(this._pendingRef.hostView);
+            this._pendingRef.destroy();
+            this._pendingRef = null;
+        }
+    }
     // ── Positioning ──────────────────────────────────────────────────────────
     _resolvePosition(el) {
         const requested = this.clxTooltipPosition();