CHANGELOG.md

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

index.js

@@ -289,18 +289,6 @@ 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);
                     }
@@ -349,29 +337,39 @@ export const createTooltip = ($el, content, options) => {
         );
     };
 
-    $el._tooltip.hideOnClickListener = ({ target }) => {
+    const hideOnClickListener = ({ target }) => {
         if (
             $el._tooltip.isVisible &&
             (options.hideOnClick === 'all' ||
                 $el.contains(target) ||
                 (options.hideOnClick !== 'toggle' && !$el._tooltip.$tooltip.contains(target)))
         ) {
-            document.body.removeEventListener('click', $el._tooltip.hideOnClickListener);
+            document.body.removeEventListener('click', hideOnClickListener);
             $el._tooltip.hide();
         }
     };
 
-    $el._tooltip.clickListener = () => {
+    const 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,
+                    });
+                });
+            }
         }
     };
 
-    $el._tooltip.mouseEnterListener = () => {
+    const mouseEnterListener = () => {
         $el._tooltip.show();
     };
 
-    $el._tooltip.mouseLeaveListener = ({ relatedTarget }) => {
+    const mouseLeaveListener = ({ relatedTarget }) => {
         if (options.interactive) {
             if ($el._tooltip.$tooltip.contains(relatedTarget)) {
                 $el._tooltip.$tooltip.addEventListener(
@@ -397,36 +395,48 @@ export const createTooltip = ($el, content, options) => {
         for (const trigger of options.trigger.split(' ')) {
             switch (trigger) {
                 case 'mouseenter': {
-                    $el.addEventListener('mouseenter', $el._tooltip.mouseEnterListener);
+                    $el.addEventListener('mouseenter', mouseEnterListener);
                     listeners.push({
                         el: $el,
                         event: 'mouseenter',
-                        listener: $el._tooltip.mouseEnterListener,
+                        listener: mouseEnterListener,
                     });
 
-                    $el.addEventListener('mouseleave', $el._tooltip.mouseLeaveListener);
+                    $el.addEventListener('mouseleave', mouseLeaveListener);
                     listeners.push({
                         el: $el,
                         event: 'mouseleave',
-                        listener: $el._tooltip.mouseLeaveListener,
+                        listener: mouseLeaveListener,
                     });
 
                     break;
                 }
                 case 'click': {
-                    $el.addEventListener('click', $el._tooltip.clickListener);
+                    $el.addEventListener('click', clickListener);
                     listeners.push({
                         el: $el,
                         event: 'click',
-                        listener: $el._tooltip.clickListener,
+                        listener: clickListener,
                     });
 
                     if (!options.interactive) {
-                        $el.addEventListener('mouseleave', $el._tooltip.mouseLeaveListener);
+                        $el.addEventListener('mouseleave', mouseLeaveListener);
                         listeners.push({
                             el: $el,
                             event: 'mouseleave',
-                            listener: $el._tooltip.mouseLeaveListener,
+                            listener: 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.1",
+    "version": "3.0.0",
     "type": "module",
     "packageManager": "yarn@4.5.3",
     "main": "index.js",