v3.0.1

CHANGELOG.md

@@ -1,3 +1,7 @@
+## v3.0.1
+
+- Исправлена работа событий
+
 ## v3.0.0
 
 - Исправлено название опции с `virtialReference` на `virtualReference`

index.js

@@ -289,6 +289,18 @@ export const createTooltip = ($el, content, options) => {
                     $el._tooltip.isVisible = true;
                     autoUpdateCleanup = autoUpdate($el, $el._tooltip.$tooltip, $el._tooltip.updatePosition);
 
+                    if (
+                        options.hideOnClick &&
+                        (options.trigger.includes('click') || options.trigger.includes('manual'))
+                    ) {
+                        document.body.addEventListener('click', $el._tooltip.hideOnClickListener);
+                        listeners.push({
+                            el: document.body,
+                            event: 'click',
+                            listener: $el._tooltip.hideOnClickListener,
+                        });
+                    }
+
                     if (options.onShow) {
                         options.onShow($el._tooltip);
                     }
@@ -337,39 +349,29 @@ export const createTooltip = ($el, content, options) => {
         );
     };
 
-    const hideOnClickListener = ({ target }) => {
+    $el._tooltip.hideOnClickListener = ({ target }) => {
         if (
             $el._tooltip.isVisible &&
             (options.hideOnClick === 'all' ||
                 $el.contains(target) ||
                 (options.hideOnClick !== 'toggle' && !$el._tooltip.$tooltip.contains(target)))
         ) {
-            document.body.removeEventListener('click', hideOnClickListener);
+            document.body.removeEventListener('click', $el._tooltip.hideOnClickListener);
             $el._tooltip.hide();
         }
     };
 
-    const clickListener = () => {
+    $el._tooltip.clickListener = () => {
         if (!$el._tooltip.isVisible) {
             $el._tooltip.show();
-            if (options.hideOnClick) {
-                setTimeout(() => {
-                    document.body.addEventListener('click', hideOnClickListener);
-                    listeners.push({
-                        el: document.body,
-                        event: 'click',
-                        listener: hideOnClickListener,
-                    });
-                });
-            }
         }
     };
 
-    const mouseEnterListener = () => {
+    $el._tooltip.mouseEnterListener = () => {
         $el._tooltip.show();
     };
 
-    const mouseLeaveListener = ({ relatedTarget }) => {
+    $el._tooltip.mouseLeaveListener = ({ relatedTarget }) => {
         if (options.interactive) {
             if ($el._tooltip.$tooltip.contains(relatedTarget)) {
                 $el._tooltip.$tooltip.addEventListener(
@@ -395,48 +397,36 @@ export const createTooltip = ($el, content, options) => {
         for (const trigger of options.trigger.split(' ')) {
             switch (trigger) {
                 case 'mouseenter': {
-                    $el.addEventListener('mouseenter', mouseEnterListener);
+                    $el.addEventListener('mouseenter', $el._tooltip.mouseEnterListener);
                     listeners.push({
                         el: $el,
                         event: 'mouseenter',
-                        listener: mouseEnterListener,
+                        listener: $el._tooltip.mouseEnterListener,
                     });
 
-                    $el.addEventListener('mouseleave', mouseLeaveListener);
+                    $el.addEventListener('mouseleave', $el._tooltip.mouseLeaveListener);
                     listeners.push({
                         el: $el,
                         event: 'mouseleave',
-                        listener: mouseLeaveListener,
+                        listener: $el._tooltip.mouseLeaveListener,
                     });
 
                     break;
                 }
                 case 'click': {
-                    $el.addEventListener('click', clickListener);
+                    $el.addEventListener('click', $el._tooltip.clickListener);
                     listeners.push({
                         el: $el,
                         event: 'click',
-                        listener: clickListener,
+                        listener: $el._tooltip.clickListener,
                     });
 
                     if (!options.interactive) {
-                        $el.addEventListener('mouseleave', mouseLeaveListener);
+                        $el.addEventListener('mouseleave', $el._tooltip.mouseLeaveListener);
                         listeners.push({
                             el: $el,
                             event: 'mouseleave',
-                            listener: mouseLeaveListener,
+                            listener: $el._tooltip.mouseLeaveListener,
-                        });
-                    }
-
-                    break;
-                }
-                case 'manual': {
-                    if (options.hideOnClick) {
-                        document.body.addEventListener('click', hideOnClickListener);
-                        listeners.push({
-                            el: document.body,
-                            event: 'click',
-                            listener: hideOnClickListener,
                         });
                     }
 

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@advdominion/tooltip",
-    "version": "3.0.0",
+    "version": "3.0.1",
     "type": "module",
     "packageManager": "yarn@4.5.3",
     "main": "index.js",