@tsparticles/interaction-external-bubble 4.0.0-alpha.8 → 4.0.0-beta.0

package/tsparticles.interaction.external.bubble.js

@@ -4,7 +4,7 @@
  * Demo / Generator : https://particles.js.org/
  * GitHub : https://www.github.com/matteobruni/tsparticles
  * How to use? : Check the GitHub README
- * v4.0.0-alpha.8
+ * v4.0.0-beta.0
  */
 /*
  * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
@@ -28,13 +28,33 @@ return /******/ (() => { // webpackBootstrap
 /******/ 	"use strict";
 /******/ 	var __webpack_modules__ = ({
 
+/***/ "@tsparticles/engine"
+/*!*********************************************************************************************************************************!*\
+  !*** external {"commonjs":"@tsparticles/engine","commonjs2":"@tsparticles/engine","amd":"@tsparticles/engine","root":"window"} ***!
+  \*********************************************************************************************************************************/
+(module) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_engine__;
+
+/***/ },
+
+/***/ "@tsparticles/plugin-interactivity"
+/*!***************************************************************************************************************************************************************************!*\
+  !*** external {"commonjs":"@tsparticles/plugin-interactivity","commonjs2":"@tsparticles/plugin-interactivity","amd":"@tsparticles/plugin-interactivity","root":"window"} ***!
+  \***************************************************************************************************************************************************************************/
+(module) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_plugin_interactivity__;
+
+/***/ },
+
 /***/ "./dist/browser/Options/Classes/Bubble.js"
 /*!************************************************!*\
   !*** ./dist/browser/Options/Classes/Bubble.js ***!
   \************************************************/
 (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
 
-eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Bubble: () => (/* binding */ Bubble)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"./dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _BubbleDiv_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BubbleDiv.js */ \"./dist/browser/Options/Classes/BubbleDiv.js\");\n\n\n\nclass Bubble extends _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__.BubbleBase {\n  load(data) {\n    super.load(data);\n    if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n      return;\n    }\n    this.divs = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(data.divs, div => {\n      const tmp = new _BubbleDiv_js__WEBPACK_IMPORTED_MODULE_2__.BubbleDiv();\n      tmp.load(div);\n      return tmp;\n    });\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/Options/Classes/Bubble.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Bubble: () => (/* binding */ Bubble)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"./dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _BubbleDiv_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BubbleDiv.js */ \"./dist/browser/Options/Classes/BubbleDiv.js\");\n\n\n\nclass Bubble extends _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__.BubbleBase {\n    divs;\n    load(data) {\n        super.load(data);\n        if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n            return;\n        }\n        this.divs = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(data.divs, (div)=>{\n            const tmp = new _BubbleDiv_js__WEBPACK_IMPORTED_MODULE_2__.BubbleDiv();\n            tmp.load(div);\n            return tmp;\n        });\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/Options/Classes/Bubble.js?\n}");
 
 /***/ },
 
@@ -44,7 +64,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
   \****************************************************/
 (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
 
-eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BubbleBase: () => (/* binding */ BubbleBase)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nclass BubbleBase {\n  constructor() {\n    this.distance = 200;\n    this.duration = 0.4;\n    this.mix = false;\n  }\n  load(data) {\n    if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n      return;\n    }\n    if (data.distance !== undefined) {\n      this.distance = data.distance;\n    }\n    if (data.duration !== undefined) {\n      this.duration = data.duration;\n    }\n    if (data.mix !== undefined) {\n      this.mix = data.mix;\n    }\n    if (data.opacity !== undefined) {\n      this.opacity = data.opacity;\n    }\n    if (data.color !== undefined) {\n      const sourceColor = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isArray)(this.color) ? undefined : this.color;\n      this.color = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(data.color, color => {\n        return _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.OptionsColor.create(sourceColor, color);\n      });\n    }\n    if (data.size !== undefined) {\n      this.size = data.size;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/Options/Classes/BubbleBase.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BubbleBase: () => (/* binding */ BubbleBase)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nclass BubbleBase {\n    color;\n    distance;\n    duration;\n    mix;\n    opacity;\n    size;\n    constructor(){\n        this.distance = 200;\n        this.duration = 0.4;\n        this.mix = false;\n    }\n    load(data) {\n        if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n            return;\n        }\n        if (data.distance !== undefined) {\n            this.distance = data.distance;\n        }\n        if (data.duration !== undefined) {\n            this.duration = data.duration;\n        }\n        if (data.mix !== undefined) {\n            this.mix = data.mix;\n        }\n        if (data.opacity !== undefined) {\n            this.opacity = data.opacity;\n        }\n        if (data.color !== undefined) {\n            const sourceColor = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isArray)(this.color) ? undefined : this.color;\n            this.color = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(data.color, (color)=>{\n                return _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.OptionsColor.create(sourceColor, color);\n            });\n        }\n        if (data.size !== undefined) {\n            this.size = data.size;\n        }\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/Options/Classes/BubbleBase.js?\n}");
 
 /***/ },
 
@@ -54,7 +74,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
   \***************************************************/
 (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
 
-eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BubbleDiv: () => (/* binding */ BubbleDiv)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"./dist/browser/Options/Classes/BubbleBase.js\");\n\n\nclass BubbleDiv extends _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__.BubbleBase {\n  constructor() {\n    super();\n    this.selectors = [];\n  }\n  load(data) {\n    super.load(data);\n    if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n      return;\n    }\n    if (data.selectors !== undefined) {\n      this.selectors = data.selectors;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/Options/Classes/BubbleDiv.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BubbleDiv: () => (/* binding */ BubbleDiv)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"./dist/browser/Options/Classes/BubbleBase.js\");\n\n\nclass BubbleDiv extends _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__.BubbleBase {\n    selectors;\n    constructor(){\n        super();\n        this.selectors = [];\n    }\n    load(data) {\n        super.load(data);\n        if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n            return;\n        }\n        if (data.selectors !== undefined) {\n            this.selectors = data.selectors;\n        }\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/Options/Classes/BubbleDiv.js?\n}");
 
 /***/ },
 
@@ -64,27 +84,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
   \*******************************/
 (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
 
-eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Bubble: () => (/* reexport safe */ _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__.Bubble),\n/* harmony export */   BubbleBase: () => (/* reexport safe */ _Options_Classes_BubbleBase_js__WEBPACK_IMPORTED_MODULE_0__.BubbleBase),\n/* harmony export */   BubbleDiv: () => (/* reexport safe */ _Options_Classes_BubbleDiv_js__WEBPACK_IMPORTED_MODULE_1__.BubbleDiv),\n/* harmony export */   loadExternalBubbleInteraction: () => (/* binding */ loadExternalBubbleInteraction)\n/* harmony export */ });\n/* harmony import */ var _Options_Classes_BubbleBase_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Options/Classes/BubbleBase.js */ \"./dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _Options_Classes_BubbleDiv_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Options/Classes/BubbleDiv.js */ \"./dist/browser/Options/Classes/BubbleDiv.js\");\n/* harmony import */ var _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Bubble.js */ \"./dist/browser/Options/Classes/Bubble.js\");\nasync function loadExternalBubbleInteraction(engine) {\n  engine.checkVersion(\"4.0.0-alpha.8\");\n  await engine.register(async e => {\n    const {\n      loadInteractivityPlugin\n    } = await Promise.resolve(/*! import() */).then(__webpack_require__.t.bind(__webpack_require__, /*! @tsparticles/plugin-interactivity */ \"@tsparticles/plugin-interactivity\", 19));\n    await loadInteractivityPlugin(e);\n    e.addInteractor?.(\"externalBubble\", async container => {\n      const {\n        Bubbler\n      } = await __webpack_require__.e(/*! import() */ \"dist_browser_Bubbler_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./Bubbler.js */ \"./dist/browser/Bubbler.js\"));\n      return new Bubbler(e, container);\n    });\n  });\n}\n\n\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/index.js?\n}");
-
-/***/ },
-
-/***/ "@tsparticles/engine"
-/*!*********************************************************************************************************************************!*\
-  !*** external {"commonjs":"@tsparticles/engine","commonjs2":"@tsparticles/engine","amd":"@tsparticles/engine","root":"window"} ***!
-  \*********************************************************************************************************************************/
-(module) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_engine__;
-
-/***/ },
-
-/***/ "@tsparticles/plugin-interactivity"
-/*!***************************************************************************************************************************************************************************!*\
-  !*** external {"commonjs":"@tsparticles/plugin-interactivity","commonjs2":"@tsparticles/plugin-interactivity","amd":"@tsparticles/plugin-interactivity","root":"window"} ***!
-  \***************************************************************************************************************************************************************************/
-(module) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_plugin_interactivity__;
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Bubble: () => (/* reexport safe */ _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__.Bubble),\n/* harmony export */   BubbleBase: () => (/* reexport safe */ _Options_Classes_BubbleBase_js__WEBPACK_IMPORTED_MODULE_0__.BubbleBase),\n/* harmony export */   BubbleDiv: () => (/* reexport safe */ _Options_Classes_BubbleDiv_js__WEBPACK_IMPORTED_MODULE_1__.BubbleDiv),\n/* harmony export */   loadExternalBubbleInteraction: () => (/* binding */ loadExternalBubbleInteraction)\n/* harmony export */ });\n/* harmony import */ var _Options_Classes_BubbleBase_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Options/Classes/BubbleBase.js */ \"./dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _Options_Classes_BubbleDiv_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Options/Classes/BubbleDiv.js */ \"./dist/browser/Options/Classes/BubbleDiv.js\");\n/* harmony import */ var _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Bubble.js */ \"./dist/browser/Options/Classes/Bubble.js\");\nasync function loadExternalBubbleInteraction(engine) {\n    engine.checkVersion(\"4.0.0-beta.0\");\n    await engine.register(async (e)=>{\n        const { ensureInteractivityPluginLoaded } = await Promise.resolve(/*! import() */).then(__webpack_require__.t.bind(__webpack_require__, /*! @tsparticles/plugin-interactivity */ \"@tsparticles/plugin-interactivity\", 19));\n        ensureInteractivityPluginLoaded(e);\n        e.addInteractor?.(\"externalBubble\", async (container)=>{\n            const { Bubbler } = await __webpack_require__.e(/*! import() */ \"dist_browser_Bubbler_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./Bubbler.js */ \"./dist/browser/Bubbler.js\"));\n            return new Bubbler(e, container);\n        });\n    });\n}\n\n\n\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bubble/./dist/browser/index.js?\n}");
 
 /***/ }
 
@@ -100,12 +100,6 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_plugin_interactivity__;
 /******/ 		if (cachedModule !== undefined) {
 /******/ 			return cachedModule.exports;
 /******/ 		}
-/******/ 		// Check if module exists (development only)
-/******/ 		if (__webpack_modules__[moduleId] === undefined) {
-/******/ 			var e = new Error("Cannot find module '" + moduleId + "'");
-/******/ 			e.code = 'MODULE_NOT_FOUND';
-/******/ 			throw e;
-/******/ 		}
 /******/ 		// Create a new module (and put it into the cache)
 /******/ 		var module = __webpack_module_cache__[moduleId] = {
 /******/ 			// no module.id needed
@@ -114,6 +108,12 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_plugin_interactivity__;
 /******/ 		};
 /******/ 	
 /******/ 		// Execute the module function
+/******/ 		if (!(moduleId in __webpack_modules__)) {
+/******/ 			delete __webpack_module_cache__[moduleId];
+/******/ 			var e = new Error("Cannot find module '" + moduleId + "'");
+/******/ 			e.code = 'MODULE_NOT_FOUND';
+/******/ 			throw e;
+/******/ 		}
 /******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
 /******/ 	
 /******/ 		// Return the exports of the module
@@ -188,6 +188,18 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_plugin_interactivity__;
 /******/ 		};
 /******/ 	})();
 /******/ 	
+/******/ 	/* webpack/runtime/global */
+/******/ 	(() => {
+/******/ 		__webpack_require__.g = (function() {
+/******/ 			if (typeof globalThis === 'object') return globalThis;
+/******/ 			try {
+/******/ 				return this || new Function('return this')();
+/******/ 			} catch (e) {
+/******/ 				if (typeof window === 'object') return window;
+/******/ 			}
+/******/ 		})();
+/******/ 	})();
+/******/ 	
 /******/ 	/* webpack/runtime/hasOwnProperty shorthand */
 /******/ 	(() => {
 /******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
@@ -252,8 +264,8 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_plugin_interactivity__;
 /******/ 	/* webpack/runtime/publicPath */
 /******/ 	(() => {
 /******/ 		var scriptUrl;
-/******/ 		if (globalThis.importScripts) scriptUrl = globalThis.location + "";
-/******/ 		var document = globalThis.document;
+/******/ 		if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
+/******/ 		var document = __webpack_require__.g.document;
 /******/ 		if (!scriptUrl && document) {
 /******/ 			if (document.currentScript && document.currentScript.tagName.toUpperCase() === 'SCRIPT')
 /******/ 				scriptUrl = document.currentScript.src;

package/tsparticles.interaction.external.bubble.min.js

@@ -1,2 +1,2 @@
-/*! For license information please see tsparticles.interaction.external.bubble.min.js.LICENSE.txt */
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"),require("@tsparticles/plugin-interactivity"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine","@tsparticles/plugin-interactivity"],t);else{var r="object"==typeof exports?t(require("@tsparticles/engine"),require("@tsparticles/plugin-interactivity")):t(e.window,e.window);for(var i in r)("object"==typeof exports?exports:e)[i]=r[i]}}(this,((e,t)=>(()=>{var r,i,o,n,a={52(e,t,r){r.d(t,{C:()=>n});var i=r(303),o=r(618);class n extends o.u{constructor(){super(),this.selectors=[]}load(e){super.load(e),(0,i.isNull)(e)||void 0!==e.selectors&&(this.selectors=e.selectors)}}},303(t){t.exports=e},443(e,t,r){r.d(t,{Z:()=>a});var i=r(303),o=r(618),n=r(52);class a extends o.u{load(e){super.load(e),(0,i.isNull)(e)||(this.divs=(0,i.executeOnSingleOrMultiple)(e.divs,(e=>{const t=new n.C;return t.load(e),t})))}}},618(e,t,r){r.d(t,{u:()=>o});var i=r(303);class o{constructor(){this.distance=200,this.duration=.4,this.mix=!1}load(e){if(!(0,i.isNull)(e)){if(void 0!==e.distance&&(this.distance=e.distance),void 0!==e.duration&&(this.duration=e.duration),void 0!==e.mix&&(this.mix=e.mix),void 0!==e.opacity&&(this.opacity=e.opacity),void 0!==e.color){const t=(0,i.isArray)(this.color)?void 0:this.color;this.color=(0,i.executeOnSingleOrMultiple)(e.color,(e=>i.OptionsColor.create(t,e)))}void 0!==e.size&&(this.size=e.size)}}}},702(e){e.exports=t}},s={};function l(e){var t=s[e];if(void 0!==t)return t.exports;var r=s[e]={exports:{}};return a[e](r,r.exports,l),r.exports}l.m=a,i=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,l.t=function(e,t){if(1&t&&(e=this(e)),8&t)return e;if("object"==typeof e&&e){if(4&t&&e.__esModule)return e;if(16&t&&"function"==typeof e.then)return e}var o=Object.create(null);l.r(o);var n={};r=r||[null,i({}),i([]),i(i)];for(var a=2&t&&e;("object"==typeof a||"function"==typeof a)&&!~r.indexOf(a);a=i(a))Object.getOwnPropertyNames(a).forEach((t=>n[t]=()=>e[t]));return n.default=()=>e,l.d(o,n),o},l.d=(e,t)=>{for(var r in t)l.o(t,r)&&!l.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},l.f={},l.e=e=>Promise.all(Object.keys(l.f).reduce(((t,r)=>(l.f[r](e,t),t)),[])),l.u=e=>e+".min.js",l.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o={},n="@tsparticles/interaction-external-bubble:",l.l=(e,t,r,i)=>{if(o[e])o[e].push(t);else{var a,s;if(void 0!==r)for(var c=document.getElementsByTagName("script"),u=0;u<c.length;u++){var p=c[u];if(p.getAttribute("src")==e||p.getAttribute("data-webpack")==n+r){a=p;break}}a||(s=!0,(a=document.createElement("script")).charset="utf-8",l.nc&&a.setAttribute("nonce",l.nc),a.setAttribute("data-webpack",n+r),a.src=e),o[e]=[t];var d=(t,r)=>{a.onerror=a.onload=null,clearTimeout(f);var i=o[e];if(delete o[e],a.parentNode&&a.parentNode.removeChild(a),i&&i.forEach((e=>e(r))),t)return t(r)},f=setTimeout(d.bind(null,void 0,{type:"timeout",target:a}),12e4);a.onerror=d.bind(null,a.onerror),a.onload=d.bind(null,a.onload),s&&document.head.appendChild(a)}},l.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},(()=>{var e;globalThis.importScripts&&(e=globalThis.location+"");var t=globalThis.document;if(!e&&t&&(t.currentScript&&"SCRIPT"===t.currentScript.tagName.toUpperCase()&&(e=t.currentScript.src),!e)){var r=t.getElementsByTagName("script");if(r.length)for(var i=r.length-1;i>-1&&(!e||!/^http(s?):/.test(e));)e=r[i--].src}if(!e)throw new Error("Automatic publicPath is not supported in this browser");e=e.replace(/^blob:/,"").replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),l.p=e})(),(()=>{var e={108:0};l.f.j=(t,r)=>{var i=l.o(e,t)?e[t]:void 0;if(0!==i)if(i)r.push(i[2]);else{var o=new Promise(((r,o)=>i=e[t]=[r,o]));r.push(i[2]=o);var n=l.p+l.u(t),a=new Error;l.l(n,(r=>{if(l.o(e,t)&&(0!==(i=e[t])&&(e[t]=void 0),i)){var o=r&&("load"===r.type?"missing":r.type),n=r&&r.target&&r.target.src;a.message="Loading chunk "+t+" failed.\n("+o+": "+n+")",a.name="ChunkLoadError",a.type=o,a.request=n,i[1](a)}}),"chunk-"+t,t)}};var t=(t,r)=>{var i,o,[n,a,s]=r,c=0;if(n.some((t=>0!==e[t]))){for(i in a)l.o(a,i)&&(l.m[i]=a[i]);if(s)s(l)}for(t&&t(r);c<n.length;c++)o=n[c],l.o(e,o)&&e[o]&&e[o][0](),e[o]=0},r=this.webpackChunk_tsparticles_interaction_external_bubble=this.webpackChunk_tsparticles_interaction_external_bubble||[];r.forEach(t.bind(null,0)),r.push=t.bind(null,r.push.bind(r))})();var c={};l.r(c),l.d(c,{Bubble:()=>d.Z,BubbleBase:()=>u.u,BubbleDiv:()=>p.C,loadExternalBubbleInteraction:()=>f});var u=l(618),p=l(52),d=l(443);async function f(e){e.checkVersion("4.0.0-alpha.8"),await e.register((async e=>{const{loadInteractivityPlugin:t}=await Promise.resolve().then(l.t.bind(l,702,19));await t(e),e.addInteractor?.("externalBubble",(async t=>{const{Bubbler:r}=await l.e(132).then(l.bind(l,132));return new r(e,t)}))}))}return c})()));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"),require("@tsparticles/plugin-interactivity"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine","@tsparticles/plugin-interactivity"],t);else{var r="object"==typeof exports?t(require("@tsparticles/engine"),require("@tsparticles/plugin-interactivity")):t(e.window,e.window);for(var i in r)("object"==typeof exports?exports:e)[i]=r[i]}}(this,(e,t)=>(()=>{"use strict";var r,i,o,n={303(t){t.exports=e},702(e){e.exports=t},767(e,t,r){r.d(t,{Z:()=>a});var i=r(303),o=r(782),n=r(912);class a extends o.u{divs;load(e){super.load(e),(0,i.isNull)(e)||(this.divs=(0,i.executeOnSingleOrMultiple)(e.divs,e=>{let t=new n.C;return t.load(e),t}))}}},782(e,t,r){r.d(t,{u:()=>o});var i=r(303);class o{color;distance;duration;mix;opacity;size;constructor(){this.distance=200,this.duration=.4,this.mix=!1}load(e){if(!(0,i.isNull)(e)){if(void 0!==e.distance&&(this.distance=e.distance),void 0!==e.duration&&(this.duration=e.duration),void 0!==e.mix&&(this.mix=e.mix),void 0!==e.opacity&&(this.opacity=e.opacity),void 0!==e.color){let t=(0,i.isArray)(this.color)?void 0:this.color;this.color=(0,i.executeOnSingleOrMultiple)(e.color,e=>i.OptionsColor.create(t,e))}void 0!==e.size&&(this.size=e.size)}}}},912(e,t,r){r.d(t,{C:()=>n});var i=r(303),o=r(782);class n extends o.u{selectors;constructor(){super(),this.selectors=[]}load(e){super.load(e),(0,i.isNull)(e)||void 0!==e.selectors&&(this.selectors=e.selectors)}}}},a={};function s(e){var t=a[e];if(void 0!==t)return t.exports;var r=a[e]={exports:{}};return n[e](r,r.exports,s),r.exports}s.m=n,c=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,s.t=function(e,t){if(1&t&&(e=this(e)),8&t||"object"==typeof e&&e&&(4&t&&e.__esModule||16&t&&"function"==typeof e.then))return e;var r=Object.create(null);s.r(r);var i={};l=l||[null,c({}),c([]),c(c)];for(var o=2&t&&e;("object"==typeof o||"function"==typeof o)&&!~l.indexOf(o);o=c(o))Object.getOwnPropertyNames(o).forEach(t=>i[t]=()=>e[t]);return i.default=()=>e,s.d(r,i),r},s.d=(e,t)=>{for(var r in t)s.o(t,r)&&!s.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},s.f={},s.e=e=>Promise.all(Object.keys(s.f).reduce((t,r)=>(s.f[r](e,t),t),[])),s.u=e=>""+e+".min.js",s.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||Function("return this")()}catch(e){if("object"==typeof window)return window}}(),s.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),u={},s.l=(e,t,r,i)=>{if(u[e])return void u[e].push(t);if(void 0!==r)for(var o,n,a=document.getElementsByTagName("script"),l=0;l<a.length;l++){var c=a[l];if(c.getAttribute("src")==e||c.getAttribute("data-webpack")=="@tsparticles/interaction-external-bubble:"+r){o=c;break}}o||(n=!0,(o=document.createElement("script")).charset="utf-8",s.nc&&o.setAttribute("nonce",s.nc),o.setAttribute("data-webpack","@tsparticles/interaction-external-bubble:"+r),o.src=e),u[e]=[t];var p=(t,r)=>{o.onerror=o.onload=null,clearTimeout(d);var i=u[e];if(delete u[e],o.parentNode&&o.parentNode.removeChild(o),i&&i.forEach(e=>e(r)),t)return t(r)},d=setTimeout(p.bind(null,void 0,{type:"timeout",target:o}),12e4);o.onerror=p.bind(null,o.onerror),o.onload=p.bind(null,o.onload),n&&document.head.appendChild(o)},s.r=e=>{"u">typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.g.importScripts&&(p=s.g.location+"");var l,c,u,p,d=s.g.document;if(!p&&d&&(d.currentScript&&"SCRIPT"===d.currentScript.tagName.toUpperCase()&&(p=d.currentScript.src),!p)){var b=d.getElementsByTagName("script");if(b.length)for(var f=b.length-1;f>-1&&(!p||!/^http(s?):/.test(p));)p=b[f--].src}if(!p)throw Error("Automatic publicPath is not supported in this browser");s.p=p=p.replace(/^blob:/,"").replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),r={108:0},s.f.j=(e,t)=>{var i=s.o(r,e)?r[e]:void 0;if(0!==i)if(i)t.push(i[2]);else{var o=new Promise((t,o)=>i=r[e]=[t,o]);t.push(i[2]=o);var n=s.p+s.u(e),a=Error();s.l(n,t=>{if(s.o(r,e)&&(0!==(i=r[e])&&(r[e]=void 0),i)){var o=t&&("load"===t.type?"missing":t.type),n=t&&t.target&&t.target.src;a.message="Loading chunk "+e+` failed.
+(`+o+": "+n+")",a.name="ChunkLoadError",a.type=o,a.request=n,i[1](a)}},"chunk-"+e,e)}},i=(e,t)=>{var i,o,[n,a,l]=t,c=0;if(n.some(e=>0!==r[e])){for(i in a)s.o(a,i)&&(s.m[i]=a[i]);l&&l(s)}for(e&&e(t);c<n.length;c++)o=n[c],s.o(r,o)&&r[o]&&r[o][0](),r[o]=0},(o=this.webpackChunk_tsparticles_interaction_external_bubble=this.webpackChunk_tsparticles_interaction_external_bubble||[]).forEach(i.bind(null,0)),o.push=i.bind(null,o.push.bind(o));var h={};s.r(h),s.d(h,{Bubble:()=>g.Z,BubbleBase:()=>v.u,BubbleDiv:()=>y.C,loadExternalBubbleInteraction:()=>m});var v=s(782),y=s(912),g=s(767);async function m(e){e.checkVersion("4.0.0-beta.0"),await e.register(async e=>{let{ensureInteractivityPluginLoaded:t}=await Promise.resolve().then(s.t.bind(s,702,19));t(e),e.addInteractor?.("externalBubble",async t=>{let{Bubbler:r}=await s.e(537).then(s.bind(s,537));return new r(e,t)})})}return h})());

package/types/Bubbler.d.ts

@@ -4,7 +4,9 @@ import { ExternalInteractorBase, type IInteractivityData, type IModes, type Inte
 export declare class Bubbler extends ExternalInteractorBase<BubbleContainer> {
     handleClickMode: (mode: string, interactivityData: IInteractivityData) => void;
     private readonly _engine;
+    private _maxDistance;
     constructor(engine: Engine, container: BubbleContainer);
+    get maxDistance(): number;
     clear(particle: Particle, _delta: IDelta, force?: boolean): void;
     init(): void;
     interact(interactivityData: IInteractivityData, delta: IDelta): void;

package/umd/Bubbler.js

@@ -17,207 +17,13 @@
     const Utils_js_1 = require("./Utils.js");
     const bubbleMode = "bubble", minDistance = 0, defaultClickTime = 0, defaultOpacity = 1, ratioOffset = 1, defaultBubbleValue = 0, minRatio = 0, defaultRatio = 1;
     class Bubbler extends plugin_interactivity_1.ExternalInteractorBase {
+        handleClickMode;
+        _engine;
+        _maxDistance;
         constructor(engine, container) {
             super(container);
-            this._clickBubble = interactivityData => {
-                const container = this.container, options = container.actualOptions, mouseClickPos = interactivityData.mouse.clickPosition, bubbleOptions = options.interactivity?.modes.bubble;
-                if (!bubbleOptions || !mouseClickPos) {
-                    return;
-                }
-                container.bubble ??= {};
-                const distance = container.retina.bubbleModeDistance;
-                if (!distance || distance < minDistance) {
-                    return;
-                }
-                const query = container.particles.quadTree.queryCircle(mouseClickPos, distance, p => this.isEnabled(interactivityData, p)), { bubble } = container;
-                for (const particle of query) {
-                    if (!bubble.clicking) {
-                        continue;
-                    }
-                    particle.bubble.inRange = !bubble.durationEnd;
-                    const pos = particle.getPosition(), distMouse = (0, engine_1.getDistance)(pos, mouseClickPos), timeSpent = (new Date().getTime() - (interactivityData.mouse.clickTime ?? defaultClickTime)) / engine_1.millisecondsToSeconds;
-                    if (timeSpent > bubbleOptions.duration) {
-                        bubble.durationEnd = true;
-                    }
-                    if (timeSpent > bubbleOptions.duration * engine_1.double) {
-                        bubble.clicking = false;
-                        bubble.durationEnd = false;
-                    }
-                    const sizeData = {
-                        bubbleObj: {
-                            optValue: container.retina.bubbleModeSize,
-                            value: particle.bubble.radius,
-                        },
-                        particlesObj: {
-                            optValue: (0, engine_1.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio,
-                            value: particle.size.value,
-                        },
-                        type: Enums_js_1.ProcessBubbleType.size,
-                    };
-                    this._process(particle, distMouse, timeSpent, sizeData);
-                    const opacityData = {
-                        bubbleObj: {
-                            optValue: bubbleOptions.opacity,
-                            value: particle.bubble.opacity,
-                        },
-                        particlesObj: {
-                            optValue: (0, engine_1.getRangeMax)(particle.options.opacity.value),
-                            value: particle.opacity?.value ?? defaultOpacity,
-                        },
-                        type: Enums_js_1.ProcessBubbleType.opacity,
-                    };
-                    this._process(particle, distMouse, timeSpent, opacityData);
-                    if (!bubble.durationEnd && distMouse <= distance) {
-                        this._hoverBubbleColor(particle, distMouse);
-                    }
-                    else {
-                        delete particle.bubble.color;
-                    }
-                }
-            };
-            this._hoverBubble = interactivityData => {
-                const container = this.container, mousePos = interactivityData.mouse.position, distance = container.retina.bubbleModeDistance;
-                if (!distance || distance < minDistance || !mousePos) {
-                    return;
-                }
-                const query = container.particles.quadTree.queryCircle(mousePos, distance, p => this.isEnabled(interactivityData, p));
-                for (const particle of query) {
-                    particle.bubble.inRange = true;
-                    const pos = particle.getPosition(), pointDistance = (0, engine_1.getDistance)(pos, mousePos), ratio = ratioOffset - pointDistance / distance;
-                    if (pointDistance <= distance) {
-                        if (ratio >= minRatio && interactivityData.status === plugin_interactivity_1.mouseMoveEvent) {
-                            this._hoverBubbleSize(particle, ratio);
-                            this._hoverBubbleOpacity(particle, ratio);
-                            this._hoverBubbleColor(particle, ratio);
-                        }
-                    }
-                    else {
-                        this.reset(interactivityData, particle);
-                    }
-                    if (interactivityData.status === plugin_interactivity_1.mouseLeaveEvent) {
-                        this.reset(interactivityData, particle);
-                    }
-                }
-            };
-            this._hoverBubbleColor = (particle, ratio, divBubble) => {
-                const options = this.container.actualOptions, bubbleOptions = divBubble ?? options.interactivity?.modes.bubble;
-                if (!bubbleOptions) {
-                    return;
-                }
-                if (!particle.bubble.finalColor) {
-                    const modeColor = bubbleOptions.color;
-                    if (!modeColor) {
-                        return;
-                    }
-                    const bubbleColor = (0, engine_1.itemFromSingleOrMultiple)(modeColor);
-                    particle.bubble.finalColor = (0, engine_1.rangeColorToHsl)(this._engine, bubbleColor);
-                }
-                if (!particle.bubble.finalColor) {
-                    return;
-                }
-                if (bubbleOptions.mix) {
-                    particle.bubble.color = undefined;
-                    const pColor = particle.getFillColor();
-                    particle.bubble.color = pColor
-                        ? (0, engine_1.rgbToHsl)((0, engine_1.colorMix)(pColor, particle.bubble.finalColor, ratioOffset - ratio, ratio))
-                        : particle.bubble.finalColor;
-                }
-                else {
-                    particle.bubble.color = particle.bubble.finalColor;
-                }
-            };
-            this._hoverBubbleOpacity = (particle, ratio, divBubble) => {
-                const container = this.container, options = container.actualOptions, modeOpacity = divBubble?.opacity ?? options.interactivity?.modes.bubble?.opacity;
-                if (!modeOpacity) {
-                    return;
-                }
-                const optOpacity = particle.options.opacity.value, pOpacity = particle.opacity?.value ?? defaultOpacity, opacity = (0, Utils_js_1.calculateBubbleValue)(pOpacity, modeOpacity, (0, engine_1.getRangeMax)(optOpacity), ratio);
-                if (opacity !== undefined) {
-                    particle.bubble.opacity = opacity;
-                }
-            };
-            this._hoverBubbleSize = (particle, ratio, divBubble) => {
-                const container = this.container, modeSize = divBubble?.size ? divBubble.size * container.retina.pixelRatio : container.retina.bubbleModeSize;
-                if (modeSize === undefined) {
-                    return;
-                }
-                const optSize = (0, engine_1.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio, pSize = particle.size.value, size = (0, Utils_js_1.calculateBubbleValue)(pSize, modeSize, optSize, ratio);
-                if (size !== undefined) {
-                    particle.bubble.radius = size;
-                }
-            };
-            this._process = (particle, distMouse, timeSpent, data) => {
-                const container = this.container, bubbleParam = data.bubbleObj.optValue, options = container.actualOptions, bubbleOptions = options.interactivity?.modes.bubble;
-                if (!bubbleOptions || bubbleParam === undefined) {
-                    return;
-                }
-                const bubbleDuration = bubbleOptions.duration, bubbleDistance = container.retina.bubbleModeDistance, particlesParam = data.particlesObj.optValue, pObjBubble = data.bubbleObj.value, pObj = data.particlesObj.value ?? defaultBubbleValue, type = data.type;
-                if (!bubbleDistance || bubbleDistance < minDistance || bubbleParam === particlesParam) {
-                    return;
-                }
-                container.bubble ??= {};
-                if (container.bubble.durationEnd) {
-                    if (pObjBubble) {
-                        if (type === Enums_js_1.ProcessBubbleType.size) {
-                            delete particle.bubble.radius;
-                        }
-                        if (type === Enums_js_1.ProcessBubbleType.opacity) {
-                            delete particle.bubble.opacity;
-                        }
-                    }
-                }
-                else {
-                    if (distMouse <= bubbleDistance) {
-                        const obj = pObjBubble ?? pObj;
-                        if (obj !== bubbleParam) {
-                            const value = pObj - (timeSpent * (pObj - bubbleParam)) / bubbleDuration;
-                            if (type === Enums_js_1.ProcessBubbleType.size) {
-                                particle.bubble.radius = value;
-                            }
-                            if (type === Enums_js_1.ProcessBubbleType.opacity) {
-                                particle.bubble.opacity = value;
-                            }
-                        }
-                    }
-                    else {
-                        if (type === Enums_js_1.ProcessBubbleType.size) {
-                            delete particle.bubble.radius;
-                        }
-                        if (type === Enums_js_1.ProcessBubbleType.opacity) {
-                            delete particle.bubble.opacity;
-                        }
-                    }
-                }
-            };
-            this._singleSelectorHover = (interactivityData, delta, selector, div) => {
-                const container = this.container, selectors = (0, engine_1.safeDocument)().querySelectorAll(selector), bubble = container.actualOptions.interactivity?.modes.bubble;
-                if (!bubble || !selectors.length) {
-                    return;
-                }
-                selectors.forEach(item => {
-                    const elem = item, pxRatio = container.retina.pixelRatio, pos = {
-                        x: (elem.offsetLeft + elem.offsetWidth * engine_1.half) * pxRatio,
-                        y: (elem.offsetTop + elem.offsetHeight * engine_1.half) * pxRatio,
-                    }, repulseRadius = elem.offsetWidth * engine_1.half * pxRatio, area = div.type === plugin_interactivity_1.DivType.circle
-                        ? new engine_1.Circle(pos.x, pos.y, repulseRadius)
-                        : new engine_1.Rectangle(elem.offsetLeft * pxRatio, elem.offsetTop * pxRatio, elem.offsetWidth * pxRatio, elem.offsetHeight * pxRatio), query = container.particles.quadTree.query(area, p => this.isEnabled(interactivityData, p));
-                    for (const particle of query) {
-                        if (!area.contains(particle.getPosition())) {
-                            continue;
-                        }
-                        particle.bubble.inRange = true;
-                        const divs = bubble.divs, divBubble = (0, plugin_interactivity_1.divMode)(divs, elem);
-                        if (!particle.bubble.div || particle.bubble.div !== elem) {
-                            this.clear(particle, delta, true);
-                            particle.bubble.div = elem;
-                        }
-                        this._hoverBubbleSize(particle, defaultRatio, divBubble);
-                        this._hoverBubbleOpacity(particle, defaultRatio, divBubble);
-                        this._hoverBubbleColor(particle, defaultRatio, divBubble);
-                    }
-                });
-            };
             this._engine = engine;
+            this._maxDistance = 0;
             container.bubble ??= {};
             this.handleClickMode = (mode) => {
                 if (mode !== bubbleMode) {
@@ -227,6 +33,9 @@
                 container.bubble.clicking = true;
             };
         }
+        get maxDistance() {
+            return this._maxDistance;
+        }
         clear(particle, _delta, force) {
             if (particle.bubble.inRange && !force) {
                 return;
@@ -241,6 +50,7 @@
             if (!bubble) {
                 return;
             }
+            this._maxDistance = bubble.distance;
             container.retina.bubbleModeDistance = bubble.distance * container.retina.pixelRatio;
             if (bubble.size !== undefined) {
                 container.retina.bubbleModeSize = bubble.size * container.retina.pixelRatio;
@@ -284,6 +94,204 @@
         reset(_interactivityData, particle) {
             particle.bubble.inRange = false;
         }
+        _clickBubble = interactivityData => {
+            const container = this.container, options = container.actualOptions, mouseClickPos = interactivityData.mouse.clickPosition, bubbleOptions = options.interactivity?.modes.bubble;
+            if (!bubbleOptions || !mouseClickPos) {
+                return;
+            }
+            container.bubble ??= {};
+            const distance = container.retina.bubbleModeDistance;
+            if (!distance || distance < minDistance) {
+                return;
+            }
+            const query = container.particles.grid.queryCircle(mouseClickPos, distance, p => this.isEnabled(interactivityData, p)), { bubble } = container;
+            for (const particle of query) {
+                if (!bubble.clicking) {
+                    continue;
+                }
+                particle.bubble.inRange = !bubble.durationEnd;
+                const pos = particle.getPosition(), distMouse = (0, engine_1.getDistance)(pos, mouseClickPos), timeSpent = (performance.now() - (interactivityData.mouse.clickTime ?? defaultClickTime)) / engine_1.millisecondsToSeconds;
+                if (timeSpent > bubbleOptions.duration) {
+                    bubble.durationEnd = true;
+                }
+                if (timeSpent > bubbleOptions.duration * engine_1.double) {
+                    bubble.clicking = false;
+                    bubble.durationEnd = false;
+                }
+                const sizeData = {
+                    bubbleObj: {
+                        optValue: container.retina.bubbleModeSize,
+                        value: particle.bubble.radius,
+                    },
+                    particlesObj: {
+                        optValue: (0, engine_1.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio,
+                        value: particle.size.value,
+                    },
+                    type: Enums_js_1.ProcessBubbleType.size,
+                };
+                this._process(particle, distMouse, timeSpent, sizeData);
+                const opacityData = {
+                    bubbleObj: {
+                        optValue: bubbleOptions.opacity,
+                        value: particle.bubble.opacity,
+                    },
+                    particlesObj: {
+                        optValue: (0, engine_1.getRangeMax)(particle.options.opacity.value),
+                        value: particle.opacity?.value ?? defaultOpacity,
+                    },
+                    type: Enums_js_1.ProcessBubbleType.opacity,
+                };
+                this._process(particle, distMouse, timeSpent, opacityData);
+                if (!bubble.durationEnd && distMouse <= distance) {
+                    this._hoverBubbleColor(particle, distMouse);
+                }
+                else {
+                    delete particle.bubble.color;
+                }
+            }
+        };
+        _hoverBubble = interactivityData => {
+            const container = this.container, mousePos = interactivityData.mouse.position, distance = container.retina.bubbleModeDistance;
+            if (!distance || distance < minDistance || !mousePos) {
+                return;
+            }
+            const query = container.particles.grid.queryCircle(mousePos, distance, p => this.isEnabled(interactivityData, p));
+            for (const particle of query) {
+                particle.bubble.inRange = true;
+                const pos = particle.getPosition(), pointDistance = (0, engine_1.getDistance)(pos, mousePos), ratio = ratioOffset - pointDistance / distance;
+                if (pointDistance <= distance) {
+                    if (ratio >= minRatio && interactivityData.status === plugin_interactivity_1.mouseMoveEvent) {
+                        this._hoverBubbleSize(particle, ratio);
+                        this._hoverBubbleOpacity(particle, ratio);
+                        this._hoverBubbleColor(particle, ratio);
+                    }
+                }
+                else {
+                    this.reset(interactivityData, particle);
+                }
+                if (interactivityData.status === plugin_interactivity_1.mouseLeaveEvent) {
+                    this.reset(interactivityData, particle);
+                }
+            }
+        };
+        _hoverBubbleColor = (particle, ratio, divBubble) => {
+            const options = this.container.actualOptions, bubbleOptions = divBubble ?? options.interactivity?.modes.bubble;
+            if (!bubbleOptions) {
+                return;
+            }
+            if (!particle.bubble.finalColor) {
+                const modeColor = bubbleOptions.color;
+                if (!modeColor) {
+                    return;
+                }
+                const bubbleColor = (0, engine_1.itemFromSingleOrMultiple)(modeColor);
+                particle.bubble.finalColor = (0, engine_1.rangeColorToHsl)(this._engine, bubbleColor);
+            }
+            if (!particle.bubble.finalColor) {
+                return;
+            }
+            if (bubbleOptions.mix) {
+                particle.bubble.color = undefined;
+                const pColor = particle.getFillColor();
+                particle.bubble.color = pColor
+                    ? (0, engine_1.rgbToHsl)((0, engine_1.colorMix)(pColor, particle.bubble.finalColor, ratioOffset - ratio, ratio))
+                    : particle.bubble.finalColor;
+            }
+            else {
+                particle.bubble.color = particle.bubble.finalColor;
+            }
+        };
+        _hoverBubbleOpacity = (particle, ratio, divBubble) => {
+            const container = this.container, options = container.actualOptions, modeOpacity = divBubble?.opacity ?? options.interactivity?.modes.bubble?.opacity;
+            if (!modeOpacity) {
+                return;
+            }
+            const optOpacity = particle.options.opacity.value, pOpacity = particle.opacity?.value ?? defaultOpacity, opacity = (0, Utils_js_1.calculateBubbleValue)(pOpacity, modeOpacity, (0, engine_1.getRangeMax)(optOpacity), ratio);
+            if (opacity !== undefined) {
+                particle.bubble.opacity = opacity;
+            }
+        };
+        _hoverBubbleSize = (particle, ratio, divBubble) => {
+            const container = this.container, modeSize = divBubble?.size ? divBubble.size * container.retina.pixelRatio : container.retina.bubbleModeSize;
+            if (modeSize === undefined) {
+                return;
+            }
+            const optSize = (0, engine_1.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio, pSize = particle.size.value, size = (0, Utils_js_1.calculateBubbleValue)(pSize, modeSize, optSize, ratio);
+            if (size !== undefined) {
+                particle.bubble.radius = size;
+            }
+        };
+        _process = (particle, distMouse, timeSpent, data) => {
+            const container = this.container, bubbleParam = data.bubbleObj.optValue, options = container.actualOptions, bubbleOptions = options.interactivity?.modes.bubble;
+            if (!bubbleOptions || bubbleParam === undefined) {
+                return;
+            }
+            const bubbleDuration = bubbleOptions.duration, bubbleDistance = container.retina.bubbleModeDistance, particlesParam = data.particlesObj.optValue, pObjBubble = data.bubbleObj.value, pObj = data.particlesObj.value ?? defaultBubbleValue, type = data.type;
+            if (!bubbleDistance || bubbleDistance < minDistance || bubbleParam === particlesParam) {
+                return;
+            }
+            container.bubble ??= {};
+            if (container.bubble.durationEnd) {
+                if (pObjBubble) {
+                    if (type === Enums_js_1.ProcessBubbleType.size) {
+                        delete particle.bubble.radius;
+                    }
+                    if (type === Enums_js_1.ProcessBubbleType.opacity) {
+                        delete particle.bubble.opacity;
+                    }
+                }
+            }
+            else {
+                if (distMouse <= bubbleDistance) {
+                    const obj = pObjBubble ?? pObj;
+                    if (obj !== bubbleParam) {
+                        const value = pObj - (timeSpent * (pObj - bubbleParam)) / bubbleDuration;
+                        if (type === Enums_js_1.ProcessBubbleType.size) {
+                            particle.bubble.radius = value;
+                        }
+                        if (type === Enums_js_1.ProcessBubbleType.opacity) {
+                            particle.bubble.opacity = value;
+                        }
+                    }
+                }
+                else {
+                    if (type === Enums_js_1.ProcessBubbleType.size) {
+                        delete particle.bubble.radius;
+                    }
+                    if (type === Enums_js_1.ProcessBubbleType.opacity) {
+                        delete particle.bubble.opacity;
+                    }
+                }
+            }
+        };
+        _singleSelectorHover = (interactivityData, delta, selector, div) => {
+            const container = this.container, selectors = (0, engine_1.safeDocument)().querySelectorAll(selector), bubble = container.actualOptions.interactivity?.modes.bubble;
+            if (!bubble || !selectors.length) {
+                return;
+            }
+            selectors.forEach(item => {
+                const elem = item, pxRatio = container.retina.pixelRatio, pos = {
+                    x: (elem.offsetLeft + elem.offsetWidth * engine_1.half) * pxRatio,
+                    y: (elem.offsetTop + elem.offsetHeight * engine_1.half) * pxRatio,
+                }, repulseRadius = elem.offsetWidth * engine_1.half * pxRatio, area = div.type === plugin_interactivity_1.DivType.circle
+                    ? new engine_1.Circle(pos.x, pos.y, repulseRadius)
+                    : new engine_1.Rectangle(elem.offsetLeft * pxRatio, elem.offsetTop * pxRatio, elem.offsetWidth * pxRatio, elem.offsetHeight * pxRatio), query = container.particles.grid.query(area, p => this.isEnabled(interactivityData, p));
+                for (const particle of query) {
+                    if (!area.contains(particle.getPosition())) {
+                        continue;
+                    }
+                    particle.bubble.inRange = true;
+                    const divs = bubble.divs, divBubble = (0, plugin_interactivity_1.divMode)(divs, elem);
+                    if (!particle.bubble.div || particle.bubble.div !== elem) {
+                        this.clear(particle, delta, true);
+                        particle.bubble.div = elem;
+                    }
+                    this._hoverBubbleSize(particle, defaultRatio, divBubble);
+                    this._hoverBubbleOpacity(particle, defaultRatio, divBubble);
+                    this._hoverBubbleColor(particle, defaultRatio, divBubble);
+                }
+            });
+        };
     }
     exports.Bubbler = Bubbler;
 });