@tsparticles/pjs 4.0.0-alpha.8 → 4.0.0-beta.1

package/interactions_external_bubble_dist_browser_Bubbler_js.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.1
  */
 "use strict";
 /*
@@ -23,7 +23,7 @@
   \******************************************************************/
 (__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 */   Bubbler: () => (/* binding */ Bubbler)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tsparticles/plugin-interactivity */ \"../../plugins/interactivity/dist/browser/index.js\");\n/* harmony import */ var _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Bubble.js */ \"../../interactions/external/bubble/dist/browser/Options/Classes/Bubble.js\");\n/* harmony import */ var _Enums_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Enums.js */ \"../../interactions/external/bubble/dist/browser/Enums.js\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Utils.js */ \"../../interactions/external/bubble/dist/browser/Utils.js\");\n\n\n\n\n\nconst bubbleMode = \"bubble\",\n  minDistance = 0,\n  defaultClickTime = 0,\n  defaultOpacity = 1,\n  ratioOffset = 1,\n  defaultBubbleValue = 0,\n  minRatio = 0,\n  defaultRatio = 1;\nclass Bubbler extends _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.ExternalInteractorBase {\n  constructor(engine, container) {\n    super(container);\n    this._clickBubble = interactivityData => {\n      const container = this.container,\n        options = container.actualOptions,\n        mouseClickPos = interactivityData.mouse.clickPosition,\n        bubbleOptions = options.interactivity?.modes.bubble;\n      if (!bubbleOptions || !mouseClickPos) {\n        return;\n      }\n      container.bubble ??= {};\n      const distance = container.retina.bubbleModeDistance;\n      if (!distance || distance < minDistance) {\n        return;\n      }\n      const query = container.particles.quadTree.queryCircle(mouseClickPos, distance, p => this.isEnabled(interactivityData, p)),\n        {\n          bubble\n        } = container;\n      for (const particle of query) {\n        if (!bubble.clicking) {\n          continue;\n        }\n        particle.bubble.inRange = !bubble.durationEnd;\n        const pos = particle.getPosition(),\n          distMouse = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos, mouseClickPos),\n          timeSpent = (new Date().getTime() - (interactivityData.mouse.clickTime ?? defaultClickTime)) / _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.millisecondsToSeconds;\n        if (timeSpent > bubbleOptions.duration) {\n          bubble.durationEnd = true;\n        }\n        if (timeSpent > bubbleOptions.duration * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.double) {\n          bubble.clicking = false;\n          bubble.durationEnd = false;\n        }\n        const sizeData = {\n          bubbleObj: {\n            optValue: container.retina.bubbleModeSize,\n            value: particle.bubble.radius\n          },\n          particlesObj: {\n            optValue: (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio,\n            value: particle.size.value\n          },\n          type: _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size\n        };\n        this._process(particle, distMouse, timeSpent, sizeData);\n        const opacityData = {\n          bubbleObj: {\n            optValue: bubbleOptions.opacity,\n            value: particle.bubble.opacity\n          },\n          particlesObj: {\n            optValue: (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(particle.options.opacity.value),\n            value: particle.opacity?.value ?? defaultOpacity\n          },\n          type: _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity\n        };\n        this._process(particle, distMouse, timeSpent, opacityData);\n        if (!bubble.durationEnd && distMouse <= distance) {\n          this._hoverBubbleColor(particle, distMouse);\n        } else {\n          delete particle.bubble.color;\n        }\n      }\n    };\n    this._hoverBubble = interactivityData => {\n      const container = this.container,\n        mousePos = interactivityData.mouse.position,\n        distance = container.retina.bubbleModeDistance;\n      if (!distance || distance < minDistance || !mousePos) {\n        return;\n      }\n      const query = container.particles.quadTree.queryCircle(mousePos, distance, p => this.isEnabled(interactivityData, p));\n      for (const particle of query) {\n        particle.bubble.inRange = true;\n        const pos = particle.getPosition(),\n          pointDistance = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos, mousePos),\n          ratio = ratioOffset - pointDistance / distance;\n        if (pointDistance <= distance) {\n          if (ratio >= minRatio && interactivityData.status === _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.mouseMoveEvent) {\n            this._hoverBubbleSize(particle, ratio);\n            this._hoverBubbleOpacity(particle, ratio);\n            this._hoverBubbleColor(particle, ratio);\n          }\n        } else {\n          this.reset(interactivityData, particle);\n        }\n        if (interactivityData.status === _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.mouseLeaveEvent) {\n          this.reset(interactivityData, particle);\n        }\n      }\n    };\n    this._hoverBubbleColor = (particle, ratio, divBubble) => {\n      const options = this.container.actualOptions,\n        bubbleOptions = divBubble ?? options.interactivity?.modes.bubble;\n      if (!bubbleOptions) {\n        return;\n      }\n      if (!particle.bubble.finalColor) {\n        const modeColor = bubbleOptions.color;\n        if (!modeColor) {\n          return;\n        }\n        const bubbleColor = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.itemFromSingleOrMultiple)(modeColor);\n        particle.bubble.finalColor = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rangeColorToHsl)(this._engine, bubbleColor);\n      }\n      if (!particle.bubble.finalColor) {\n        return;\n      }\n      if (bubbleOptions.mix) {\n        particle.bubble.color = undefined;\n        const pColor = particle.getFillColor();\n        particle.bubble.color = pColor ? (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rgbToHsl)((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.colorMix)(pColor, particle.bubble.finalColor, ratioOffset - ratio, ratio)) : particle.bubble.finalColor;\n      } else {\n        particle.bubble.color = particle.bubble.finalColor;\n      }\n    };\n    this._hoverBubbleOpacity = (particle, ratio, divBubble) => {\n      const container = this.container,\n        options = container.actualOptions,\n        modeOpacity = divBubble?.opacity ?? options.interactivity?.modes.bubble?.opacity;\n      if (!modeOpacity) {\n        return;\n      }\n      const optOpacity = particle.options.opacity.value,\n        pOpacity = particle.opacity?.value ?? defaultOpacity,\n        opacity = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_4__.calculateBubbleValue)(pOpacity, modeOpacity, (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(optOpacity), ratio);\n      if (opacity !== undefined) {\n        particle.bubble.opacity = opacity;\n      }\n    };\n    this._hoverBubbleSize = (particle, ratio, divBubble) => {\n      const container = this.container,\n        modeSize = divBubble?.size ? divBubble.size * container.retina.pixelRatio : container.retina.bubbleModeSize;\n      if (modeSize === undefined) {\n        return;\n      }\n      const optSize = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio,\n        pSize = particle.size.value,\n        size = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_4__.calculateBubbleValue)(pSize, modeSize, optSize, ratio);\n      if (size !== undefined) {\n        particle.bubble.radius = size;\n      }\n    };\n    this._process = (particle, distMouse, timeSpent, data) => {\n      const container = this.container,\n        bubbleParam = data.bubbleObj.optValue,\n        options = container.actualOptions,\n        bubbleOptions = options.interactivity?.modes.bubble;\n      if (!bubbleOptions || bubbleParam === undefined) {\n        return;\n      }\n      const bubbleDuration = bubbleOptions.duration,\n        bubbleDistance = container.retina.bubbleModeDistance,\n        particlesParam = data.particlesObj.optValue,\n        pObjBubble = data.bubbleObj.value,\n        pObj = data.particlesObj.value ?? defaultBubbleValue,\n        type = data.type;\n      if (!bubbleDistance || bubbleDistance < minDistance || bubbleParam === particlesParam) {\n        return;\n      }\n      container.bubble ??= {};\n      if (container.bubble.durationEnd) {\n        if (pObjBubble) {\n          if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size) {\n            delete particle.bubble.radius;\n          }\n          if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity) {\n            delete particle.bubble.opacity;\n          }\n        }\n      } else {\n        if (distMouse <= bubbleDistance) {\n          const obj = pObjBubble ?? pObj;\n          if (obj !== bubbleParam) {\n            const value = pObj - timeSpent * (pObj - bubbleParam) / bubbleDuration;\n            if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size) {\n              particle.bubble.radius = value;\n            }\n            if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity) {\n              particle.bubble.opacity = value;\n            }\n          }\n        } else {\n          if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size) {\n            delete particle.bubble.radius;\n          }\n          if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity) {\n            delete particle.bubble.opacity;\n          }\n        }\n      }\n    };\n    this._singleSelectorHover = (interactivityData, delta, selector, div) => {\n      const container = this.container,\n        selectors = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.safeDocument)().querySelectorAll(selector),\n        bubble = container.actualOptions.interactivity?.modes.bubble;\n      if (!bubble || !selectors.length) {\n        return;\n      }\n      selectors.forEach(item => {\n        const elem = item,\n          pxRatio = container.retina.pixelRatio,\n          pos = {\n            x: (elem.offsetLeft + elem.offsetWidth * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half) * pxRatio,\n            y: (elem.offsetTop + elem.offsetHeight * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half) * pxRatio\n          },\n          repulseRadius = elem.offsetWidth * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half * pxRatio,\n          area = div.type === _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.DivType.circle ? new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle(pos.x, pos.y, repulseRadius) : new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Rectangle(elem.offsetLeft * pxRatio, elem.offsetTop * pxRatio, elem.offsetWidth * pxRatio, elem.offsetHeight * pxRatio),\n          query = container.particles.quadTree.query(area, p => this.isEnabled(interactivityData, p));\n        for (const particle of query) {\n          if (!area.contains(particle.getPosition())) {\n            continue;\n          }\n          particle.bubble.inRange = true;\n          const divs = bubble.divs,\n            divBubble = (0,_tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.divMode)(divs, elem);\n          if (!particle.bubble.div || particle.bubble.div !== elem) {\n            this.clear(particle, delta, true);\n            particle.bubble.div = elem;\n          }\n          this._hoverBubbleSize(particle, defaultRatio, divBubble);\n          this._hoverBubbleOpacity(particle, defaultRatio, divBubble);\n          this._hoverBubbleColor(particle, defaultRatio, divBubble);\n        }\n      });\n    };\n    this._engine = engine;\n    container.bubble ??= {};\n    this.handleClickMode = mode => {\n      if (mode !== bubbleMode) {\n        return;\n      }\n      container.bubble ??= {};\n      container.bubble.clicking = true;\n    };\n  }\n  clear(particle, _delta, force) {\n    if (particle.bubble.inRange && !force) {\n      return;\n    }\n    delete particle.bubble.div;\n    delete particle.bubble.opacity;\n    delete particle.bubble.radius;\n    delete particle.bubble.color;\n  }\n  init() {\n    const container = this.container,\n      bubble = container.actualOptions.interactivity?.modes.bubble;\n    if (!bubble) {\n      return;\n    }\n    container.retina.bubbleModeDistance = bubble.distance * container.retina.pixelRatio;\n    if (bubble.size !== undefined) {\n      container.retina.bubbleModeSize = bubble.size * container.retina.pixelRatio;\n    }\n  }\n  interact(interactivityData, delta) {\n    const options = this.container.actualOptions,\n      events = options.interactivity?.events;\n    if (!events) {\n      return;\n    }\n    const onHover = events.onHover,\n      onClick = events.onClick,\n      hoverEnabled = onHover.enable,\n      hoverMode = onHover.mode,\n      clickEnabled = onClick.enable,\n      clickMode = onClick.mode,\n      divs = events.onDiv;\n    if (hoverEnabled && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, hoverMode)) {\n      this._hoverBubble(interactivityData);\n    } else if (clickEnabled && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, clickMode)) {\n      this._clickBubble(interactivityData);\n    } else {\n      (0,_tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.divModeExecute)(bubbleMode, divs, (selector, div) => {\n        this._singleSelectorHover(interactivityData, delta, selector, div);\n      });\n    }\n  }\n  isEnabled(interactivityData, particle) {\n    const container = this.container,\n      options = container.actualOptions,\n      mouse = interactivityData.mouse,\n      events = (particle?.interactivity ?? options.interactivity)?.events;\n    if (!events) {\n      return false;\n    }\n    const {\n        onClick,\n        onDiv,\n        onHover\n      } = events,\n      divBubble = (0,_tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.isDivModeEnabled)(bubbleMode, onDiv);\n    if (!(divBubble || onHover.enable && !!mouse.position || onClick.enable && mouse.clickPosition)) {\n      return false;\n    }\n    return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, onHover.mode) || (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, onClick.mode) || divBubble;\n  }\n  loadModeOptions(options, ...sources) {\n    options.bubble ??= new _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__.Bubble();\n    for (const source of sources) {\n      options.bubble.load(source?.bubble);\n    }\n  }\n  reset(_interactivityData, particle) {\n    particle.bubble.inRange = false;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/Bubbler.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Bubbler: () => (/* binding */ Bubbler)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tsparticles/plugin-interactivity */ \"../../plugins/interactivity/dist/browser/index.js\");\n/* harmony import */ var _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Bubble.js */ \"../../interactions/external/bubble/dist/browser/Options/Classes/Bubble.js\");\n/* harmony import */ var _Enums_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Enums.js */ \"../../interactions/external/bubble/dist/browser/Enums.js\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Utils.js */ \"../../interactions/external/bubble/dist/browser/Utils.js\");\n\n\n\n\n\nconst bubbleMode = \"bubble\", minDistance = 0, defaultClickTime = 0, defaultOpacity = 1, ratioOffset = 1, defaultBubbleValue = 0, minRatio = 0, defaultRatio = 1;\nclass Bubbler extends _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.ExternalInteractorBase {\n    handleClickMode;\n    _maxDistance;\n    _pluginManager;\n    constructor(pluginManager, container){\n        super(container);\n        this._pluginManager = pluginManager;\n        this._maxDistance = 0;\n        container.bubble ??= {};\n        this.handleClickMode = (mode)=>{\n            if (mode !== bubbleMode) {\n                return;\n            }\n            container.bubble ??= {};\n            container.bubble.clicking = true;\n        };\n    }\n    get maxDistance() {\n        return this._maxDistance;\n    }\n    clear(particle, _delta, force) {\n        if (particle.bubble.inRange && !force) {\n            return;\n        }\n        delete particle.bubble.div;\n        delete particle.bubble.opacity;\n        delete particle.bubble.radius;\n        delete particle.bubble.color;\n    }\n    init() {\n        const container = this.container, bubble = container.actualOptions.interactivity?.modes.bubble;\n        if (!bubble) {\n            return;\n        }\n        this._maxDistance = bubble.distance;\n        container.retina.bubbleModeDistance = bubble.distance * container.retina.pixelRatio;\n        if (bubble.size !== undefined) {\n            container.retina.bubbleModeSize = bubble.size * container.retina.pixelRatio;\n        }\n    }\n    interact(interactivityData, delta) {\n        const options = this.container.actualOptions, events = options.interactivity?.events;\n        if (!events) {\n            return;\n        }\n        const onHover = events.onHover, onClick = events.onClick, hoverEnabled = onHover.enable, hoverMode = onHover.mode, clickEnabled = onClick.enable, clickMode = onClick.mode, divs = events.onDiv;\n        if (hoverEnabled && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, hoverMode)) {\n            this._hoverBubble(interactivityData);\n        } else if (clickEnabled && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, clickMode)) {\n            this._clickBubble(interactivityData);\n        } else {\n            (0,_tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.divModeExecute)(bubbleMode, divs, (selector, div)=>{\n                this._singleSelectorHover(interactivityData, delta, selector, div);\n            });\n        }\n    }\n    isEnabled(interactivityData, particle) {\n        const container = this.container, options = container.actualOptions, mouse = interactivityData.mouse, events = (particle?.interactivity ?? options.interactivity)?.events;\n        if (!events) {\n            return false;\n        }\n        const { onClick, onDiv, onHover } = events, divBubble = (0,_tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.isDivModeEnabled)(bubbleMode, onDiv);\n        if (!(divBubble || onHover.enable && !!mouse.position || onClick.enable && mouse.clickPosition)) {\n            return false;\n        }\n        return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, onHover.mode) || (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bubbleMode, onClick.mode) || divBubble;\n    }\n    loadModeOptions(options, ...sources) {\n        options.bubble ??= new _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__.Bubble();\n        for (const source of sources){\n            options.bubble.load(source?.bubble);\n        }\n    }\n    reset(_interactivityData, particle) {\n        particle.bubble.inRange = false;\n    }\n    _clickBubble = (interactivityData)=>{\n        const container = this.container, options = container.actualOptions, mouseClickPos = interactivityData.mouse.clickPosition, bubbleOptions = options.interactivity?.modes.bubble;\n        if (!bubbleOptions || !mouseClickPos) {\n            return;\n        }\n        container.bubble ??= {};\n        const distance = container.retina.bubbleModeDistance;\n        if (!distance || distance < minDistance) {\n            return;\n        }\n        const query = container.particles.grid.queryCircle(mouseClickPos, distance, (p)=>this.isEnabled(interactivityData, p)), { bubble } = container;\n        for (const particle of query){\n            if (!bubble.clicking) {\n                continue;\n            }\n            particle.bubble.inRange = !bubble.durationEnd;\n            const pos = particle.getPosition(), distMouse = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos, mouseClickPos), timeSpent = (performance.now() - (interactivityData.mouse.clickTime ?? defaultClickTime)) / _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.millisecondsToSeconds;\n            if (timeSpent > bubbleOptions.duration) {\n                bubble.durationEnd = true;\n            }\n            if (timeSpent > bubbleOptions.duration * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.double) {\n                bubble.clicking = false;\n                bubble.durationEnd = false;\n            }\n            const sizeData = {\n                bubbleObj: {\n                    optValue: container.retina.bubbleModeSize,\n                    value: particle.bubble.radius\n                },\n                particlesObj: {\n                    optValue: (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio,\n                    value: particle.size.value\n                },\n                type: _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size\n            };\n            this._process(particle, distMouse, timeSpent, sizeData);\n            const opacityData = {\n                bubbleObj: {\n                    optValue: bubbleOptions.opacity,\n                    value: particle.bubble.opacity\n                },\n                particlesObj: {\n                    optValue: (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(particle.options.opacity.value),\n                    value: particle.opacity?.value ?? defaultOpacity\n                },\n                type: _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity\n            };\n            this._process(particle, distMouse, timeSpent, opacityData);\n            if (!bubble.durationEnd && distMouse <= distance) {\n                this._hoverBubbleColor(particle, distMouse);\n            } else {\n                delete particle.bubble.color;\n            }\n        }\n    };\n    _hoverBubble = (interactivityData)=>{\n        const container = this.container, mousePos = interactivityData.mouse.position, distance = container.retina.bubbleModeDistance;\n        if (!distance || distance < minDistance || !mousePos) {\n            return;\n        }\n        const query = container.particles.grid.queryCircle(mousePos, distance, (p)=>this.isEnabled(interactivityData, p));\n        for (const particle of query){\n            particle.bubble.inRange = true;\n            const pos = particle.getPosition(), pointDistance = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos, mousePos), ratio = ratioOffset - pointDistance / distance;\n            if (pointDistance <= distance) {\n                if (ratio >= minRatio && interactivityData.status === _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.mouseMoveEvent) {\n                    this._hoverBubbleSize(particle, ratio);\n                    this._hoverBubbleOpacity(particle, ratio);\n                    this._hoverBubbleColor(particle, ratio);\n                }\n            } else {\n                this.reset(interactivityData, particle);\n            }\n            if (interactivityData.status === _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.mouseLeaveEvent) {\n                this.reset(interactivityData, particle);\n            }\n        }\n    };\n    _hoverBubbleColor = (particle, ratio, divBubble)=>{\n        const options = this.container.actualOptions, bubbleOptions = divBubble ?? options.interactivity?.modes.bubble;\n        if (!bubbleOptions) {\n            return;\n        }\n        if (!particle.bubble.finalColor) {\n            const modeColor = bubbleOptions.color;\n            if (!modeColor) {\n                return;\n            }\n            const bubbleColor = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.itemFromSingleOrMultiple)(modeColor);\n            particle.bubble.finalColor = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rangeColorToHsl)(this._pluginManager, bubbleColor);\n        }\n        if (!particle.bubble.finalColor) {\n            return;\n        }\n        if (bubbleOptions.mix) {\n            particle.bubble.color = undefined;\n            const pColor = particle.getFillColor();\n            particle.bubble.color = pColor ? (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rgbToHsl)((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.colorMix)(pColor, particle.bubble.finalColor, ratioOffset - ratio, ratio)) : particle.bubble.finalColor;\n        } else {\n            particle.bubble.color = particle.bubble.finalColor;\n        }\n    };\n    _hoverBubbleOpacity = (particle, ratio, divBubble)=>{\n        const container = this.container, options = container.actualOptions, modeOpacity = divBubble?.opacity ?? options.interactivity?.modes.bubble?.opacity;\n        if (!modeOpacity) {\n            return;\n        }\n        const optOpacity = particle.options.opacity.value, pOpacity = particle.opacity?.value ?? defaultOpacity, opacity = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_4__.calculateBubbleValue)(pOpacity, modeOpacity, (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(optOpacity), ratio);\n        if (opacity !== undefined) {\n            particle.bubble.opacity = opacity;\n        }\n    };\n    _hoverBubbleSize = (particle, ratio, divBubble)=>{\n        const container = this.container, modeSize = divBubble?.size ? divBubble.size * container.retina.pixelRatio : container.retina.bubbleModeSize;\n        if (modeSize === undefined) {\n            return;\n        }\n        const optSize = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(particle.options.size.value) * container.retina.pixelRatio, pSize = particle.size.value, size = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_4__.calculateBubbleValue)(pSize, modeSize, optSize, ratio);\n        if (size !== undefined) {\n            particle.bubble.radius = size;\n        }\n    };\n    _process = (particle, distMouse, timeSpent, data)=>{\n        const container = this.container, bubbleParam = data.bubbleObj.optValue, options = container.actualOptions, bubbleOptions = options.interactivity?.modes.bubble;\n        if (!bubbleOptions || bubbleParam === undefined) {\n            return;\n        }\n        const bubbleDuration = bubbleOptions.duration, bubbleDistance = container.retina.bubbleModeDistance, particlesParam = data.particlesObj.optValue, pObjBubble = data.bubbleObj.value, pObj = data.particlesObj.value ?? defaultBubbleValue, type = data.type;\n        if (!bubbleDistance || bubbleDistance < minDistance || bubbleParam === particlesParam) {\n            return;\n        }\n        container.bubble ??= {};\n        if (container.bubble.durationEnd) {\n            if (pObjBubble) {\n                if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size) {\n                    delete particle.bubble.radius;\n                }\n                if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity) {\n                    delete particle.bubble.opacity;\n                }\n            }\n        } else {\n            if (distMouse <= bubbleDistance) {\n                const obj = pObjBubble ?? pObj;\n                if (obj !== bubbleParam) {\n                    const value = pObj - timeSpent * (pObj - bubbleParam) / bubbleDuration;\n                    if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size) {\n                        particle.bubble.radius = value;\n                    }\n                    if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity) {\n                        particle.bubble.opacity = value;\n                    }\n                }\n            } else {\n                if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.size) {\n                    delete particle.bubble.radius;\n                }\n                if (type === _Enums_js__WEBPACK_IMPORTED_MODULE_3__.ProcessBubbleType.opacity) {\n                    delete particle.bubble.opacity;\n                }\n            }\n        }\n    };\n    _singleSelectorHover = (interactivityData, delta, selector, div)=>{\n        const container = this.container, selectors = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.safeDocument)().querySelectorAll(selector), bubble = container.actualOptions.interactivity?.modes.bubble;\n        if (!bubble || !selectors.length) {\n            return;\n        }\n        selectors.forEach((item)=>{\n            const elem = item, pxRatio = container.retina.pixelRatio, pos = {\n                x: (elem.offsetLeft + elem.offsetWidth * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half) * pxRatio,\n                y: (elem.offsetTop + elem.offsetHeight * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half) * pxRatio\n            }, repulseRadius = elem.offsetWidth * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half * pxRatio, area = div.type === _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.DivType.circle ? new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle(pos.x, pos.y, repulseRadius) : new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Rectangle(elem.offsetLeft * pxRatio, elem.offsetTop * pxRatio, elem.offsetWidth * pxRatio, elem.offsetHeight * pxRatio), query = container.particles.grid.query(area, (p)=>this.isEnabled(interactivityData, p));\n            for (const particle of query){\n                if (!area.contains(particle.getPosition())) {\n                    continue;\n                }\n                particle.bubble.inRange = true;\n                const divs = bubble.divs, divBubble = (0,_tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_1__.divMode)(divs, elem);\n                if (!particle.bubble.div || particle.bubble.div !== elem) {\n                    this.clear(particle, delta, true);\n                    particle.bubble.div = elem;\n                }\n                this._hoverBubbleSize(particle, defaultRatio, divBubble);\n                this._hoverBubbleOpacity(particle, defaultRatio, divBubble);\n                this._hoverBubbleColor(particle, defaultRatio, divBubble);\n            }\n        });\n    };\n}\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/Bubbler.js?\n}");
 
 /***/ },
 
@@ -33,7 +33,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 */   ProcessBubbleType: () => (/* binding */ ProcessBubbleType)\n/* harmony export */ });\nvar ProcessBubbleType;\n(function (ProcessBubbleType) {\n  ProcessBubbleType[\"color\"] = \"color\";\n  ProcessBubbleType[\"opacity\"] = \"opacity\";\n  ProcessBubbleType[\"size\"] = \"size\";\n})(ProcessBubbleType || (ProcessBubbleType = {}));\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/Enums.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ProcessBubbleType: () => (/* binding */ ProcessBubbleType)\n/* harmony export */ });\nvar ProcessBubbleType;\n(function(ProcessBubbleType) {\n    ProcessBubbleType[\"color\"] = \"color\";\n    ProcessBubbleType[\"opacity\"] = \"opacity\";\n    ProcessBubbleType[\"size\"] = \"size\";\n})(ProcessBubbleType || (ProcessBubbleType = {}));\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/Enums.js?\n}");
 
 /***/ },
 
@@ -43,57 +43,67 @@ 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 */   calculateBubbleValue: () => (/* binding */ calculateBubbleValue)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n\nfunction calculateBubbleValue(particleValue, modeValue, optionsValue, ratio) {\n  if (modeValue >= optionsValue) {\n    const value = particleValue + (modeValue - optionsValue) * ratio;\n    return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.clamp)(value, particleValue, modeValue);\n  } else if (modeValue < optionsValue) {\n    const value = particleValue - (optionsValue - modeValue) * ratio;\n    return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.clamp)(value, modeValue, particleValue);\n  }\n  return undefined;\n}\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/Utils.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   calculateBubbleValue: () => (/* binding */ calculateBubbleValue)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n\nfunction calculateBubbleValue(particleValue, modeValue, optionsValue, ratio) {\n    if (modeValue >= optionsValue) {\n        const value = particleValue + (modeValue - optionsValue) * ratio;\n        return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.clamp)(value, particleValue, modeValue);\n    } else if (modeValue < optionsValue) {\n        const value = particleValue - (optionsValue - modeValue) * ratio;\n        return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.clamp)(value, modeValue, particleValue);\n    }\n    return undefined;\n}\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/Utils.js?\n}");
 
 /***/ },
 
-/***/ "../../plugins/interactivity/dist/browser/DivType.js"
-/*!***********************************************************!*\
-  !*** ../../plugins/interactivity/dist/browser/DivType.js ***!
-  \***********************************************************/
+/***/ "../../plugins/interactivity/dist/browser/BaseClasses/ExternalInteractorBase.js"
+/*!**************************************************************************************!*\
+  !*** ../../plugins/interactivity/dist/browser/BaseClasses/ExternalInteractorBase.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 */   DivType: () => (/* binding */ DivType)\n/* harmony export */ });\nvar DivType;\n(function (DivType) {\n  DivType[\"circle\"] = \"circle\";\n  DivType[\"rectangle\"] = \"rectangle\";\n})(DivType || (DivType = {}));\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/DivType.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ExternalInteractorBase: () => (/* binding */ ExternalInteractorBase)\n/* harmony export */ });\n/* harmony import */ var _Enums_InteractorType_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Enums/InteractorType.js */ \"../../plugins/interactivity/dist/browser/Enums/InteractorType.js\");\n\nclass ExternalInteractorBase {\n    type = _Enums_InteractorType_js__WEBPACK_IMPORTED_MODULE_0__.InteractorType.external;\n    container;\n    constructor(container){\n        this.container = container;\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/BaseClasses/ExternalInteractorBase.js?\n}");
 
 /***/ },
 
-/***/ "../../plugins/interactivity/dist/browser/ExternalInteractorBase.js"
-/*!**************************************************************************!*\
-  !*** ../../plugins/interactivity/dist/browser/ExternalInteractorBase.js ***!
-  \**************************************************************************/
+/***/ "../../plugins/interactivity/dist/browser/BaseClasses/ParticlesInteractorBase.js"
+/*!***************************************************************************************!*\
+  !*** ../../plugins/interactivity/dist/browser/BaseClasses/ParticlesInteractorBase.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 */   ExternalInteractorBase: () => (/* binding */ ExternalInteractorBase)\n/* harmony export */ });\n/* harmony import */ var _InteractorType_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./InteractorType.js */ \"../../plugins/interactivity/dist/browser/InteractorType.js\");\n\nclass ExternalInteractorBase {\n  constructor(container) {\n    this.type = _InteractorType_js__WEBPACK_IMPORTED_MODULE_0__.InteractorType.external;\n    this.container = container;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/ExternalInteractorBase.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ParticlesInteractorBase: () => (/* binding */ ParticlesInteractorBase)\n/* harmony export */ });\n/* harmony import */ var _Enums_InteractorType_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Enums/InteractorType.js */ \"../../plugins/interactivity/dist/browser/Enums/InteractorType.js\");\n\nclass ParticlesInteractorBase {\n    type = _Enums_InteractorType_js__WEBPACK_IMPORTED_MODULE_0__.InteractorType.particles;\n    container;\n    constructor(container){\n        this.container = container;\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/BaseClasses/ParticlesInteractorBase.js?\n}");
 
 /***/ },
 
-/***/ "../../plugins/interactivity/dist/browser/InteractivityConstants.js"
-/*!**************************************************************************!*\
-  !*** ../../plugins/interactivity/dist/browser/InteractivityConstants.js ***!
-  \**************************************************************************/
+/***/ "../../plugins/interactivity/dist/browser/Enums/DivType.js"
+/*!*****************************************************************!*\
+  !*** ../../plugins/interactivity/dist/browser/Enums/DivType.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 */   clickEvent: () => (/* binding */ clickEvent),\n/* harmony export */   mouseDownEvent: () => (/* binding */ mouseDownEvent),\n/* harmony export */   mouseLeaveEvent: () => (/* binding */ mouseLeaveEvent),\n/* harmony export */   mouseMoveEvent: () => (/* binding */ mouseMoveEvent),\n/* harmony export */   mouseOutEvent: () => (/* binding */ mouseOutEvent),\n/* harmony export */   mouseUpEvent: () => (/* binding */ mouseUpEvent),\n/* harmony export */   touchCancelEvent: () => (/* binding */ touchCancelEvent),\n/* harmony export */   touchEndEvent: () => (/* binding */ touchEndEvent),\n/* harmony export */   touchMoveEvent: () => (/* binding */ touchMoveEvent),\n/* harmony export */   touchStartEvent: () => (/* binding */ touchStartEvent)\n/* harmony export */ });\nconst clickEvent = \"click\",\n  mouseDownEvent = \"pointerdown\",\n  mouseUpEvent = \"pointerup\",\n  mouseLeaveEvent = \"pointerleave\",\n  mouseOutEvent = \"pointerout\",\n  mouseMoveEvent = \"pointermove\",\n  touchStartEvent = \"touchstart\",\n  touchEndEvent = \"touchend\",\n  touchMoveEvent = \"touchmove\",\n  touchCancelEvent = \"touchcancel\";\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/InteractivityConstants.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DivType: () => (/* binding */ DivType)\n/* harmony export */ });\nvar DivType;\n(function(DivType) {\n    DivType[\"circle\"] = \"circle\";\n    DivType[\"rectangle\"] = \"rectangle\";\n})(DivType || (DivType = {}));\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/Enums/DivType.js?\n}");
 
 /***/ },
 
-/***/ "../../plugins/interactivity/dist/browser/InteractivityDetect.js"
-/*!***********************************************************************!*\
-  !*** ../../plugins/interactivity/dist/browser/InteractivityDetect.js ***!
-  \***********************************************************************/
+/***/ "../../plugins/interactivity/dist/browser/Enums/InteractivityDetect.js"
+/*!*****************************************************************************!*\
+  !*** ../../plugins/interactivity/dist/browser/Enums/InteractivityDetect.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 */   InteractivityDetect: () => (/* binding */ InteractivityDetect)\n/* harmony export */ });\nvar InteractivityDetect;\n(function (InteractivityDetect) {\n  InteractivityDetect[\"canvas\"] = \"canvas\";\n  InteractivityDetect[\"parent\"] = \"parent\";\n  InteractivityDetect[\"window\"] = \"window\";\n})(InteractivityDetect || (InteractivityDetect = {}));\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/InteractivityDetect.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   InteractivityDetect: () => (/* binding */ InteractivityDetect)\n/* harmony export */ });\nvar InteractivityDetect;\n(function(InteractivityDetect) {\n    InteractivityDetect[\"canvas\"] = \"canvas\";\n    InteractivityDetect[\"parent\"] = \"parent\";\n    InteractivityDetect[\"window\"] = \"window\";\n})(InteractivityDetect || (InteractivityDetect = {}));\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/Enums/InteractivityDetect.js?\n}");
 
 /***/ },
 
-/***/ "../../plugins/interactivity/dist/browser/InteractorType.js"
-/*!******************************************************************!*\
-  !*** ../../plugins/interactivity/dist/browser/InteractorType.js ***!
-  \******************************************************************/
+/***/ "../../plugins/interactivity/dist/browser/Enums/InteractorType.js"
+/*!************************************************************************!*\
+  !*** ../../plugins/interactivity/dist/browser/Enums/InteractorType.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 */   InteractorType: () => (/* binding */ InteractorType)\n/* harmony export */ });\nvar InteractorType;\n(function(InteractorType) {\n    InteractorType[\"external\"] = \"external\";\n    InteractorType[\"particles\"] = \"particles\";\n})(InteractorType || (InteractorType = {}));\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/Enums/InteractorType.js?\n}");
+
+/***/ },
+
+/***/ "../../plugins/interactivity/dist/browser/InteractivityConstants.js"
+/*!**************************************************************************!*\
+  !*** ../../plugins/interactivity/dist/browser/InteractivityConstants.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 */   InteractorType: () => (/* binding */ InteractorType)\n/* harmony export */ });\nvar InteractorType;\n(function (InteractorType) {\n  InteractorType[\"external\"] = \"external\";\n  InteractorType[\"particles\"] = \"particles\";\n})(InteractorType || (InteractorType = {}));\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/InteractorType.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   clickEvent: () => (/* binding */ clickEvent),\n/* harmony export */   mouseDownEvent: () => (/* binding */ mouseDownEvent),\n/* harmony export */   mouseLeaveEvent: () => (/* binding */ mouseLeaveEvent),\n/* harmony export */   mouseMoveEvent: () => (/* binding */ mouseMoveEvent),\n/* harmony export */   mouseUpEvent: () => (/* binding */ mouseUpEvent),\n/* harmony export */   touchCancelEvent: () => (/* binding */ touchCancelEvent),\n/* harmony export */   touchEndEvent: () => (/* binding */ touchEndEvent),\n/* harmony export */   touchMoveEvent: () => (/* binding */ touchMoveEvent),\n/* harmony export */   touchStartEvent: () => (/* binding */ touchStartEvent)\n/* harmony export */ });\nconst clickEvent = \"click\", mouseDownEvent = \"pointerdown\", mouseUpEvent = \"pointerup\", mouseLeaveEvent = \"pointerleave\", mouseMoveEvent = \"pointermove\", touchStartEvent = \"touchstart\", touchEndEvent = \"touchend\", touchMoveEvent = \"touchmove\", touchCancelEvent = \"touchcancel\";\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/InteractivityConstants.js?\n}");
 
 /***/ },
 
@@ -103,7 +113,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 */   DivEvent: () => (/* binding */ DivEvent)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _DivType_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../DivType.js */ \"../../plugins/interactivity/dist/browser/DivType.js\");\n\n\nclass DivEvent {\n  constructor() {\n    this.selectors = [];\n    this.enable = false;\n    this.mode = [];\n    this.type = _DivType_js__WEBPACK_IMPORTED_MODULE_1__.DivType.circle;\n  }\n  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    if (data.enable !== undefined) {\n      this.enable = data.enable;\n    }\n    if (data.mode !== undefined) {\n      this.mode = data.mode;\n    }\n    if (data.type !== undefined) {\n      this.type = data.type;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/Options/Classes/Events/DivEvent.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DivEvent: () => (/* binding */ DivEvent)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _Enums_DivType_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../Enums/DivType.js */ \"../../plugins/interactivity/dist/browser/Enums/DivType.js\");\n\n\nclass DivEvent {\n    enable;\n    mode;\n    selectors;\n    type;\n    constructor(){\n        this.selectors = [];\n        this.enable = false;\n        this.mode = [];\n        this.type = _Enums_DivType_js__WEBPACK_IMPORTED_MODULE_1__.DivType.circle;\n    }\n    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        if (data.enable !== undefined) {\n            this.enable = data.enable;\n        }\n        if (data.mode !== undefined) {\n            this.mode = data.mode;\n        }\n        if (data.type !== undefined) {\n            this.type = data.type;\n        }\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/Options/Classes/Events/DivEvent.js?\n}");
 
 /***/ },
 
@@ -113,17 +123,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 */   Modes: () => (/* binding */ Modes)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n\nclass Modes {\n  constructor(engine, container) {\n    this._engine = engine;\n    this._container = container;\n  }\n  load(data) {\n    if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n      return;\n    }\n    if (!this._container) {\n      return;\n    }\n    const interactors = this._engine.interactors?.get(this._container);\n    if (!interactors) {\n      return;\n    }\n    for (const interactor of interactors) {\n      if (!interactor.loadModeOptions) {\n        continue;\n      }\n      interactor.loadModeOptions(this, data);\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/Options/Classes/Modes/Modes.js?\n}");
-
-/***/ },
-
-/***/ "../../plugins/interactivity/dist/browser/ParticlesInteractorBase.js"
-/*!***************************************************************************!*\
-  !*** ../../plugins/interactivity/dist/browser/ParticlesInteractorBase.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 */   ParticlesInteractorBase: () => (/* binding */ ParticlesInteractorBase)\n/* harmony export */ });\n/* harmony import */ var _InteractorType_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./InteractorType.js */ \"../../plugins/interactivity/dist/browser/InteractorType.js\");\n\nclass ParticlesInteractorBase {\n  constructor(container) {\n    this.type = _InteractorType_js__WEBPACK_IMPORTED_MODULE_0__.InteractorType.particles;\n    this.container = container;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/ParticlesInteractorBase.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Modes: () => (/* binding */ Modes)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n\nclass Modes {\n    _container;\n    _pluginManager;\n    constructor(pluginManager, container){\n        this._pluginManager = pluginManager;\n        this._container = container;\n    }\n    load(data) {\n        if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n            return;\n        }\n        if (!this._container) {\n            return;\n        }\n        const interactors = this._pluginManager.interactors?.get(this._container);\n        if (!interactors) {\n            return;\n        }\n        for (const interactor of interactors){\n            if (!interactor.loadModeOptions) {\n                continue;\n            }\n            interactor.loadModeOptions(this, data);\n        }\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/Options/Classes/Modes/Modes.js?\n}");
 
 /***/ },
 
@@ -133,7 +133,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 */   DivEvent: () => (/* reexport safe */ _Options_Classes_Events_DivEvent_js__WEBPACK_IMPORTED_MODULE_8__.DivEvent),\n/* harmony export */   DivType: () => (/* reexport safe */ _DivType_js__WEBPACK_IMPORTED_MODULE_1__.DivType),\n/* harmony export */   ExternalInteractorBase: () => (/* reexport safe */ _ExternalInteractorBase_js__WEBPACK_IMPORTED_MODULE_2__.ExternalInteractorBase),\n/* harmony export */   InteractivityDetect: () => (/* reexport safe */ _InteractivityDetect_js__WEBPACK_IMPORTED_MODULE_4__.InteractivityDetect),\n/* harmony export */   InteractorType: () => (/* reexport safe */ _InteractorType_js__WEBPACK_IMPORTED_MODULE_5__.InteractorType),\n/* harmony export */   Modes: () => (/* reexport safe */ _Options_Classes_Modes_Modes_js__WEBPACK_IMPORTED_MODULE_9__.Modes),\n/* harmony export */   ParticlesInteractorBase: () => (/* reexport safe */ _ParticlesInteractorBase_js__WEBPACK_IMPORTED_MODULE_6__.ParticlesInteractorBase),\n/* harmony export */   clickEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.clickEvent),\n/* harmony export */   divMode: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.divMode),\n/* harmony export */   divModeExecute: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.divModeExecute),\n/* harmony export */   isDivModeEnabled: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.isDivModeEnabled),\n/* harmony export */   loadInteractivityPlugin: () => (/* binding */ loadInteractivityPlugin),\n/* harmony export */   mouseDownEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseDownEvent),\n/* harmony export */   mouseLeaveEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseLeaveEvent),\n/* harmony export */   mouseMoveEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseMoveEvent),\n/* harmony export */   mouseOutEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseOutEvent),\n/* harmony export */   mouseUpEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseUpEvent),\n/* harmony export */   singleDivModeExecute: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.singleDivModeExecute),\n/* harmony export */   touchCancelEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchCancelEvent),\n/* harmony export */   touchEndEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchEndEvent),\n/* harmony export */   touchMoveEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchMoveEvent),\n/* harmony export */   touchStartEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchStartEvent)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _DivType_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DivType.js */ \"../../plugins/interactivity/dist/browser/DivType.js\");\n/* harmony import */ var _ExternalInteractorBase_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ExternalInteractorBase.js */ \"../../plugins/interactivity/dist/browser/ExternalInteractorBase.js\");\n/* harmony import */ var _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./InteractivityConstants.js */ \"../../plugins/interactivity/dist/browser/InteractivityConstants.js\");\n/* harmony import */ var _InteractivityDetect_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./InteractivityDetect.js */ \"../../plugins/interactivity/dist/browser/InteractivityDetect.js\");\n/* harmony import */ var _InteractorType_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./InteractorType.js */ \"../../plugins/interactivity/dist/browser/InteractorType.js\");\n/* harmony import */ var _ParticlesInteractorBase_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./ParticlesInteractorBase.js */ \"../../plugins/interactivity/dist/browser/ParticlesInteractorBase.js\");\n/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils.js */ \"../../plugins/interactivity/dist/browser/utils.js\");\n/* harmony import */ var _Options_Classes_Events_DivEvent_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Options/Classes/Events/DivEvent.js */ \"../../plugins/interactivity/dist/browser/Options/Classes/Events/DivEvent.js\");\n/* harmony import */ var _Options_Classes_Modes_Modes_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Options/Classes/Modes/Modes.js */ \"../../plugins/interactivity/dist/browser/Options/Classes/Modes/Modes.js\");\n\nasync function loadInteractivityPlugin(engine) {\n  engine.checkVersion(\"4.0.0-alpha.8\");\n  await engine.register(async e => {\n    const interactivityEngine = e,\n      {\n        InteractivityPlugin\n      } = await __webpack_require__.e(/*! import() */ \"plugins_interactivity_dist_browser_InteractivityPlugin_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./InteractivityPlugin.js */ \"../../plugins/interactivity/dist/browser/InteractivityPlugin.js\"));\n    interactivityEngine.addPlugin(new InteractivityPlugin(interactivityEngine));\n    interactivityEngine.interactorsInitializers ??= new Map();\n    interactivityEngine.interactors ??= new Map();\n    interactivityEngine.addInteractor = (name, interactorInitializer) => {\n      interactivityEngine.interactorsInitializers ??= new Map();\n      interactivityEngine.interactorsInitializers.set(name, interactorInitializer);\n    };\n    interactivityEngine.getInteractors = async (container, force = false) => {\n      interactivityEngine.interactors ??= new Map();\n      interactivityEngine.interactorsInitializers ??= new Map();\n      return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getItemsFromInitializer)(container, interactivityEngine.interactors, interactivityEngine.interactorsInitializers, force);\n    };\n    interactivityEngine.setOnClickHandler = callback => {\n      const {\n        items\n      } = interactivityEngine;\n      if (!items.length) {\n        throw new Error(\"Click handlers can only be set after calling tsParticles.load()\");\n      }\n      items.forEach(item => {\n        const interactivityContainer = item;\n        interactivityContainer.addClickHandler?.(callback);\n      });\n    };\n  });\n}\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/index.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DivEvent: () => (/* reexport safe */ _Options_Classes_Events_DivEvent_js__WEBPACK_IMPORTED_MODULE_8__.DivEvent),\n/* harmony export */   DivType: () => (/* reexport safe */ _Enums_DivType_js__WEBPACK_IMPORTED_MODULE_4__.DivType),\n/* harmony export */   ExternalInteractorBase: () => (/* reexport safe */ _BaseClasses_ExternalInteractorBase_js__WEBPACK_IMPORTED_MODULE_1__.ExternalInteractorBase),\n/* harmony export */   InteractivityDetect: () => (/* reexport safe */ _Enums_InteractivityDetect_js__WEBPACK_IMPORTED_MODULE_5__.InteractivityDetect),\n/* harmony export */   InteractorType: () => (/* reexport safe */ _Enums_InteractorType_js__WEBPACK_IMPORTED_MODULE_6__.InteractorType),\n/* harmony export */   Modes: () => (/* reexport safe */ _Options_Classes_Modes_Modes_js__WEBPACK_IMPORTED_MODULE_9__.Modes),\n/* harmony export */   ParticlesInteractorBase: () => (/* reexport safe */ _BaseClasses_ParticlesInteractorBase_js__WEBPACK_IMPORTED_MODULE_2__.ParticlesInteractorBase),\n/* harmony export */   clickEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.clickEvent),\n/* harmony export */   divMode: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.divMode),\n/* harmony export */   divModeExecute: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.divModeExecute),\n/* harmony export */   ensureInteractivityPluginLoaded: () => (/* binding */ ensureInteractivityPluginLoaded),\n/* harmony export */   isDivModeEnabled: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.isDivModeEnabled),\n/* harmony export */   loadInteractivityPlugin: () => (/* binding */ loadInteractivityPlugin),\n/* harmony export */   mouseDownEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseDownEvent),\n/* harmony export */   mouseLeaveEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseLeaveEvent),\n/* harmony export */   mouseMoveEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseMoveEvent),\n/* harmony export */   mouseUpEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.mouseUpEvent),\n/* harmony export */   singleDivModeExecute: () => (/* reexport safe */ _utils_js__WEBPACK_IMPORTED_MODULE_7__.singleDivModeExecute),\n/* harmony export */   touchCancelEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchCancelEvent),\n/* harmony export */   touchEndEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchEndEvent),\n/* harmony export */   touchMoveEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchMoveEvent),\n/* harmony export */   touchStartEvent: () => (/* reexport safe */ _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__.touchStartEvent)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _BaseClasses_ExternalInteractorBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BaseClasses/ExternalInteractorBase.js */ \"../../plugins/interactivity/dist/browser/BaseClasses/ExternalInteractorBase.js\");\n/* harmony import */ var _BaseClasses_ParticlesInteractorBase_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BaseClasses/ParticlesInteractorBase.js */ \"../../plugins/interactivity/dist/browser/BaseClasses/ParticlesInteractorBase.js\");\n/* harmony import */ var _InteractivityConstants_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./InteractivityConstants.js */ \"../../plugins/interactivity/dist/browser/InteractivityConstants.js\");\n/* harmony import */ var _Enums_DivType_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Enums/DivType.js */ \"../../plugins/interactivity/dist/browser/Enums/DivType.js\");\n/* harmony import */ var _Enums_InteractivityDetect_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Enums/InteractivityDetect.js */ \"../../plugins/interactivity/dist/browser/Enums/InteractivityDetect.js\");\n/* harmony import */ var _Enums_InteractorType_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Enums/InteractorType.js */ \"../../plugins/interactivity/dist/browser/Enums/InteractorType.js\");\n/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils.js */ \"../../plugins/interactivity/dist/browser/utils.js\");\n/* harmony import */ var _Options_Classes_Events_DivEvent_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Options/Classes/Events/DivEvent.js */ \"../../plugins/interactivity/dist/browser/Options/Classes/Events/DivEvent.js\");\n/* harmony import */ var _Options_Classes_Modes_Modes_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Options/Classes/Modes/Modes.js */ \"../../plugins/interactivity/dist/browser/Options/Classes/Modes/Modes.js\");\n\nasync function loadInteractivityPlugin(engine) {\n    engine.checkVersion(\"4.0.0-beta.1\");\n    await engine.pluginManager.register(async (e)=>{\n        const interactivityEngine = e, interactivityPluginManager = interactivityEngine.pluginManager, { InteractivityPlugin } = await __webpack_require__.e(/*! import() */ \"plugins_interactivity_dist_browser_InteractivityPlugin_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./InteractivityPlugin.js */ \"../../plugins/interactivity/dist/browser/InteractivityPlugin.js\"));\n        interactivityPluginManager.addPlugin(new InteractivityPlugin(interactivityPluginManager));\n        interactivityPluginManager.initializers.interactors ??= new Map();\n        interactivityPluginManager.interactors ??= new Map();\n        interactivityPluginManager.addInteractor = (name, interactorInitializer)=>{\n            interactivityPluginManager.initializers.interactors ??= new Map();\n            interactivityPluginManager.initializers.interactors.set(name, interactorInitializer);\n        };\n        interactivityPluginManager.getInteractors = async (container, force = false)=>{\n            interactivityPluginManager.interactors ??= new Map();\n            interactivityPluginManager.initializers.interactors ??= new Map();\n            return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getItemsFromInitializer)(container, interactivityPluginManager.interactors, interactivityPluginManager.initializers.interactors, force);\n        };\n        interactivityPluginManager.setOnClickHandler = (callback)=>{\n            const { items } = interactivityEngine;\n            if (!items.length) {\n                throw new Error(\"Click handlers can only be set after calling tsParticles.load()\");\n            }\n            items.forEach((item)=>{\n                const interactivityContainer = item;\n                interactivityContainer.addClickHandler?.(callback);\n            });\n        };\n    });\n}\nfunction ensureInteractivityPluginLoaded(e) {\n    if (!e.pluginManager.addInteractor) {\n        throw new Error(\"tsParticles Interactivity Plugin is not loaded\");\n    }\n}\n\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/index.js?\n}");
 
 /***/ },
 
@@ -143,7 +143,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 */   divMode: () => (/* binding */ divMode),\n/* harmony export */   divModeExecute: () => (/* binding */ divModeExecute),\n/* harmony export */   isDivModeEnabled: () => (/* binding */ isDivModeEnabled),\n/* harmony export */   singleDivModeExecute: () => (/* binding */ singleDivModeExecute)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n\nfunction checkSelector(element, selectors) {\n  const res = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(selectors, selector => {\n    return element.matches(selector);\n  });\n  return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isArray)(res) ? res.some(t => t) : res;\n}\nfunction isDivModeEnabled(mode, divs) {\n  return !!(0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.findItemFromSingleOrMultiple)(divs, t => t.enable && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(mode, t.mode));\n}\nfunction divModeExecute(mode, divs, callback) {\n  (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(divs, div => {\n    const divMode = div.mode,\n      divEnabled = div.enable;\n    if (divEnabled && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(mode, divMode)) {\n      singleDivModeExecute(div, callback);\n    }\n  });\n}\nfunction singleDivModeExecute(div, callback) {\n  const selectors = div.selectors;\n  (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(selectors, selector => {\n    callback(selector, div);\n  });\n}\nfunction divMode(divs, element) {\n  if (!element || !divs) {\n    return;\n  }\n  return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.findItemFromSingleOrMultiple)(divs, div => {\n    return checkSelector(element, div.selectors);\n  });\n}\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/utils.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   divMode: () => (/* binding */ divMode),\n/* harmony export */   divModeExecute: () => (/* binding */ divModeExecute),\n/* harmony export */   isDivModeEnabled: () => (/* binding */ isDivModeEnabled),\n/* harmony export */   singleDivModeExecute: () => (/* binding */ singleDivModeExecute)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"../../engine/dist/browser/index.js\");\n\nfunction checkSelector(element, selectors) {\n    const res = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(selectors, (selector)=>{\n        return element.matches(selector);\n    });\n    return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isArray)(res) ? res.some((t)=>t) : res;\n}\nfunction isDivModeEnabled(mode, divs) {\n    return !!(0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.findItemFromSingleOrMultiple)(divs, (t)=>t.enable && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(mode, t.mode));\n}\nfunction divModeExecute(mode, divs, callback) {\n    (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(divs, (div)=>{\n        const divMode = div.mode, divEnabled = div.enable;\n        if (divEnabled && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(mode, divMode)) {\n            singleDivModeExecute(div, callback);\n        }\n    });\n}\nfunction singleDivModeExecute(div, callback) {\n    const selectors = div.selectors;\n    (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(selectors, (selector)=>{\n        callback(selector, div);\n    });\n}\nfunction divMode(divs, element) {\n    if (!element || !divs) {\n        return;\n    }\n    return (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.findItemFromSingleOrMultiple)(divs, (div)=>{\n        return checkSelector(element, div.selectors);\n    });\n}\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../plugins/interactivity/dist/browser/utils.js?\n}");
 
 /***/ }
 

package/interactions_external_bubble_dist_browser_index_js.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.1
  */
 "use strict";
 /*
@@ -23,7 +23,7 @@
   \*********************************************************************************/
 (__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 */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"../../interactions/external/bubble/dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _BubbleDiv_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BubbleDiv.js */ \"../../interactions/external/bubble/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/pjs/../../interactions/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 */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"../../interactions/external/bubble/dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _BubbleDiv_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./BubbleDiv.js */ \"../../interactions/external/bubble/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/pjs/../../interactions/external/bubble/dist/browser/Options/Classes/Bubble.js?\n}");
 
 /***/ },
 
@@ -33,7 +33,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 */ \"../../engine/dist/browser/index.js\");\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/pjs/../../interactions/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 */ \"../../engine/dist/browser/index.js\");\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/pjs/../../interactions/external/bubble/dist/browser/Options/Classes/BubbleBase.js?\n}");
 
 /***/ },
 
@@ -43,7 +43,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 */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"../../interactions/external/bubble/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/pjs/../../interactions/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 */ \"../../engine/dist/browser/index.js\");\n/* harmony import */ var _BubbleBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./BubbleBase.js */ \"../../interactions/external/bubble/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/pjs/../../interactions/external/bubble/dist/browser/Options/Classes/BubbleDiv.js?\n}");
 
 /***/ },
 
@@ -53,7 +53,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 */ \"../../interactions/external/bubble/dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _Options_Classes_BubbleDiv_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Options/Classes/BubbleDiv.js */ \"../../interactions/external/bubble/dist/browser/Options/Classes/BubbleDiv.js\");\n/* harmony import */ var _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Bubble.js */ \"../../interactions/external/bubble/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 __webpack_require__.e(/*! import() */ \"plugins_interactivity_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-interactivity */ \"../../plugins/interactivity/dist/browser/index.js\"));\n    await loadInteractivityPlugin(e);\n    e.addInteractor?.(\"externalBubble\", async container => {\n      const {\n        Bubbler\n      } = await __webpack_require__.e(/*! import() */ \"interactions_external_bubble_dist_browser_Bubbler_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./Bubbler.js */ \"../../interactions/external/bubble/dist/browser/Bubbler.js\"));\n      return new Bubbler(e, container);\n    });\n  });\n}\n\n\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/index.js?\n}");
+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 */ \"../../interactions/external/bubble/dist/browser/Options/Classes/BubbleBase.js\");\n/* harmony import */ var _Options_Classes_BubbleDiv_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Options/Classes/BubbleDiv.js */ \"../../interactions/external/bubble/dist/browser/Options/Classes/BubbleDiv.js\");\n/* harmony import */ var _Options_Classes_Bubble_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Bubble.js */ \"../../interactions/external/bubble/dist/browser/Options/Classes/Bubble.js\");\nasync function loadExternalBubbleInteraction(engine) {\n    engine.checkVersion(\"4.0.0-beta.1\");\n    await engine.pluginManager.register(async (e)=>{\n        const { ensureInteractivityPluginLoaded } = await __webpack_require__.e(/*! import() */ \"plugins_interactivity_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-interactivity */ \"../../plugins/interactivity/dist/browser/index.js\"));\n        ensureInteractivityPluginLoaded(e);\n        e.pluginManager.addInteractor?.(\"externalBubble\", async (container)=>{\n            const { Bubbler } = await __webpack_require__.e(/*! import() */ \"interactions_external_bubble_dist_browser_Bubbler_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./Bubbler.js */ \"../../interactions/external/bubble/dist/browser/Bubbler.js\"));\n            return new Bubbler(e.pluginManager, container);\n        });\n    });\n}\n\n\n\n\n\n//# sourceURL=webpack://@tsparticles/pjs/../../interactions/external/bubble/dist/browser/index.js?\n}");
 
 /***/ }