@tsparticles/basic 4.0.0-beta.0 → 4.0.0-beta.1

package/shapes_circle_dist_browser_CircleDrawer_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-beta.0
+ * v4.0.0-beta.1
  */
 "use strict";
 /*

package/shapes_circle_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-beta.0
+ * 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 */   loadCircleShape: () => (/* binding */ loadCircleShape)\n/* harmony export */ });\nasync function loadCircleShape(engine) {\n    engine.checkVersion(\"4.0.0-beta.0\");\n    await engine.register((e)=>{\n        e.addShape([\n            \"circle\"\n        ], async ()=>{\n            const { CircleDrawer } = await __webpack_require__.e(/*! import() */ \"shapes_circle_dist_browser_CircleDrawer_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./CircleDrawer.js */ \"../../shapes/circle/dist/browser/CircleDrawer.js\"));\n            return new CircleDrawer();\n        });\n    });\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../shapes/circle/dist/browser/index.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   loadCircleShape: () => (/* binding */ loadCircleShape)\n/* harmony export */ });\nasync function loadCircleShape(engine) {\n    engine.checkVersion(\"4.0.0-beta.1\");\n    await engine.pluginManager.register((e)=>{\n        e.pluginManager.addShape([\n            \"circle\"\n        ], async ()=>{\n            const { CircleDrawer } = await __webpack_require__.e(/*! import() */ \"shapes_circle_dist_browser_CircleDrawer_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./CircleDrawer.js */ \"../../shapes/circle/dist/browser/CircleDrawer.js\"));\n            return new CircleDrawer();\n        });\n    });\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../shapes/circle/dist/browser/index.js?\n}");
 
 /***/ }
 

package/tsparticles.basic.bundle.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-beta.0
+ * v4.0.0-beta.1
  */
 /*
  * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
@@ -34,7 +34,7 @@ return /******/ (() => { // webpackBootstrap
   \************************************************/
 (__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 */   Engine: () => (/* binding */ Engine)\n/* harmony export */ });\n/* harmony import */ var _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Utils/Constants.js */ \"../../engine/dist/browser/Core/Utils/Constants.js\");\n/* harmony import */ var _Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Utils/Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n/* harmony import */ var _Utils_EventDispatcher_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Utils/EventDispatcher.js */ \"../../engine/dist/browser/Utils/EventDispatcher.js\");\n/* harmony import */ var _Enums_Types_EventType_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Enums/Types/EventType.js */ \"../../engine/dist/browser/Enums/Types/EventType.js\");\n/* harmony import */ var _Utils_LogUtils_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Utils/LogUtils.js */ \"../../engine/dist/browser/Utils/LogUtils.js\");\n/* harmony import */ var _Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Utils/MathUtils.js */ \"../../engine/dist/browser/Utils/MathUtils.js\");\n\n\n\n\n\n\nconst fullPercent = \"100%\";\nasync function getDataFromUrl(data) {\n    const url = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.itemFromSingleOrMultiple)(data.url, data.index);\n    if (!url) {\n        return data.fallback;\n    }\n    const response = await fetch(url);\n    if (response.ok) {\n        return await response.json();\n    }\n    (0,_Utils_LogUtils_js__WEBPACK_IMPORTED_MODULE_4__.getLogger)().error(`${response.status.toString()} while retrieving config file`);\n    return data.fallback;\n}\nconst getCanvasFromContainer = (domContainer)=>{\n    const documentSafe = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.safeDocument)();\n    let canvasEl;\n    if (domContainer instanceof HTMLCanvasElement || domContainer.tagName.toLowerCase() === _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasTag) {\n        canvasEl = domContainer;\n        canvasEl.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] ??= _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedFalse;\n    } else {\n        const existingCanvases = domContainer.getElementsByTagName(_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasTag), foundCanvas = existingCanvases[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasFirstIndex];\n        if (foundCanvas) {\n            canvasEl = foundCanvas;\n            canvasEl.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] = _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedFalse;\n        } else {\n            canvasEl = documentSafe.createElement(_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasTag);\n            canvasEl.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] = _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedTrue;\n            domContainer.appendChild(canvasEl);\n        }\n    }\n    canvasEl.style.width ||= fullPercent;\n    canvasEl.style.height ||= fullPercent;\n    return canvasEl;\n}, getDomContainer = (id, source)=>{\n    const documentSafe = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.safeDocument)();\n    let domContainer = source ?? documentSafe.getElementById(id);\n    if (domContainer) {\n        return domContainer;\n    }\n    domContainer = documentSafe.createElement(\"div\");\n    domContainer.id = id;\n    domContainer.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] = _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedTrue;\n    documentSafe.body.append(domContainer);\n    return domContainer;\n};\nclass Engine {\n    colorManagers = new Map();\n    easingFunctions = new Map();\n    effectDrawers = new Map();\n    initializers = {\n        effects: new Map(),\n        shapes: new Map(),\n        updaters: new Map()\n    };\n    palettes = new Map();\n    plugins = [];\n    presets = new Map();\n    shapeDrawers = new Map();\n    updaters = new Map();\n    _allLoadersSet = new Set();\n    _configs = new Map();\n    _domArray = [];\n    _eventDispatcher = new _Utils_EventDispatcher_js__WEBPACK_IMPORTED_MODULE_2__.EventDispatcher();\n    _executedSet = new Set();\n    _initialized = false;\n    _isRunningLoaders = false;\n    _loadPromises = new Set();\n    get configs() {\n        const res = {};\n        for (const [name, config] of this._configs){\n            res[name] = config;\n        }\n        return res;\n    }\n    get items() {\n        return this._domArray;\n    }\n    get version() {\n        return \"4.0.0-beta.0\";\n    }\n    addColorManager(name, manager) {\n        this.colorManagers.set(name, manager);\n    }\n    addConfig(config) {\n        const key = config.key ?? config.name ?? \"default\";\n        this._configs.set(key, config);\n        this._eventDispatcher.dispatchEvent(_Enums_Types_EventType_js__WEBPACK_IMPORTED_MODULE_3__.EventType.configAdded, {\n            data: {\n                name: key,\n                config\n            }\n        });\n    }\n    addEasing(name, easing) {\n        if (this.easingFunctions.get(name)) {\n            return;\n        }\n        this.easingFunctions.set(name, easing);\n    }\n    addEffect(effect, drawer) {\n        this.initializers.effects.set(effect, drawer);\n    }\n    addEventListener(type, listener) {\n        this._eventDispatcher.addEventListener(type, listener);\n    }\n    addPalette(name, palette) {\n        this.palettes.set(name, palette);\n    }\n    addParticleUpdater(name, updaterInitializer) {\n        this.initializers.updaters.set(name, updaterInitializer);\n    }\n    addPlugin(plugin) {\n        if (this.getPlugin(plugin.id)) {\n            return;\n        }\n        this.plugins.push(plugin);\n    }\n    addPreset(preset, options, override = false) {\n        if (!(override || !this.getPreset(preset))) {\n            return;\n        }\n        this.presets.set(preset, options);\n    }\n    addShape(shapes, drawer) {\n        for (const shape of shapes){\n            this.initializers.shapes.set(shape, drawer);\n        }\n    }\n    checkVersion(pluginVersion) {\n        if (this.version === pluginVersion) {\n            return;\n        }\n        throw new Error(`The tsParticles version is different from the loaded plugins version. Engine version: ${this.version}. Plugin version: ${pluginVersion}`);\n    }\n    clearPlugins(container) {\n        this.effectDrawers.delete(container);\n        this.shapeDrawers.delete(container);\n        this.updaters.delete(container);\n    }\n    dispatchEvent(type, args) {\n        this._eventDispatcher.dispatchEvent(type, args);\n    }\n    getEasing(name) {\n        return this.easingFunctions.get(name) ?? ((value)=>value);\n    }\n    getEffectDrawers(container, force = false) {\n        return (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.getItemMapFromInitializer)(container, this.effectDrawers, this.initializers.effects, force);\n    }\n    getPalette(name) {\n        return this.palettes.get(name);\n    }\n    getPlugin(plugin) {\n        return this.plugins.find((t)=>t.id === plugin);\n    }\n    getPreset(preset) {\n        return this.presets.get(preset);\n    }\n    async getShapeDrawers(container, force = false) {\n        return (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.getItemMapFromInitializer)(container, this.shapeDrawers, this.initializers.shapes, force);\n    }\n    async getUpdaters(container, force = false) {\n        return (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.getItemsFromInitializer)(container, this.updaters, this.initializers.updaters, force);\n    }\n    async init() {\n        if (this._initialized || this._isRunningLoaders) {\n            return;\n        }\n        this._isRunningLoaders = true;\n        this._executedSet = new Set();\n        this._allLoadersSet = new Set(this._loadPromises);\n        try {\n            for (const loader of this._allLoadersSet){\n                await this._runLoader(loader, this._executedSet, this._allLoadersSet);\n            }\n        } finally{\n            this._loadPromises.clear();\n            this._isRunningLoaders = false;\n            this._initialized = true;\n        }\n    }\n    item(index) {\n        const { items } = this, item = items[index];\n        if (item?.destroyed) {\n            items.splice(index, _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.removeDeleteCount);\n            return;\n        }\n        return item;\n    }\n    async load(params) {\n        await this.init();\n        const { Container } = await __webpack_require__.e(/*! import() */ \"engine_dist_browser_Core_Container_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./Container.js */ \"../../engine/dist/browser/Core/Container.js\")), id = params.id ?? params.element?.id ?? `tsparticles${Math.floor((0,_Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_5__.getRandom)() * _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.loadRandomFactor).toString()}`, { index, url } = params, options = url ? await getDataFromUrl({\n            fallback: params.options,\n            url,\n            index\n        }) : params.options, currentOptions = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.itemFromSingleOrMultiple)(options, index), { items } = this, oldIndex = items.findIndex((v)=>v.id.description === id), newItem = new Container(this, id, currentOptions);\n        if (oldIndex >= _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.loadMinIndex) {\n            const old = this.item(oldIndex), deleteCount = old ? _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.one : _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.none;\n            if (old && !old.destroyed) {\n                old.destroy(false);\n            }\n            items.splice(oldIndex, deleteCount, newItem);\n        } else {\n            items.push(newItem);\n        }\n        const domContainer = getDomContainer(id, params.element), canvasEl = getCanvasFromContainer(domContainer);\n        newItem.canvas.loadCanvas(canvasEl);\n        await newItem.start();\n        return newItem;\n    }\n    loadParticlesOptions(container, options, ...sourceOptions) {\n        const updaters = this.updaters.get(container);\n        if (!updaters) {\n            return;\n        }\n        updaters.forEach((updater)=>updater.loadOptions?.(options, ...sourceOptions));\n    }\n    async refresh(refresh = true) {\n        if (!refresh) {\n            return;\n        }\n        await Promise.all(this.items.map((t)=>t.refresh()));\n    }\n    async register(...loaders) {\n        if (this._initialized) {\n            throw new Error(\"Register plugins can only be done before calling tsParticles.load()\");\n        }\n        for (const loader of loaders){\n            if (this._isRunningLoaders) {\n                await this._runLoader(loader, this._executedSet, this._allLoadersSet);\n            } else {\n                this._loadPromises.add(loader);\n            }\n        }\n    }\n    removeEventListener(type, listener) {\n        this._eventDispatcher.removeEventListener(type, listener);\n    }\n    async _runLoader(loader, executed, allLoaders) {\n        if (executed.has(loader)) return;\n        executed.add(loader);\n        allLoaders.add(loader);\n        await loader(this);\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Core/Engine.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Engine: () => (/* binding */ Engine)\n/* harmony export */ });\n/* harmony import */ var _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Utils/Constants.js */ \"../../engine/dist/browser/Core/Utils/Constants.js\");\n/* harmony import */ var _Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Utils/Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n/* harmony import */ var _Utils_EventDispatcher_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Utils/EventDispatcher.js */ \"../../engine/dist/browser/Utils/EventDispatcher.js\");\n/* harmony import */ var _Utils_PluginManager_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Utils/PluginManager.js */ \"../../engine/dist/browser/Core/Utils/PluginManager.js\");\n/* harmony import */ var _Utils_LogUtils_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Utils/LogUtils.js */ \"../../engine/dist/browser/Utils/LogUtils.js\");\n/* harmony import */ var _Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Utils/MathUtils.js */ \"../../engine/dist/browser/Utils/MathUtils.js\");\n\n\n\n\n\n\nconst fullPercent = \"100%\";\nasync function getDataFromUrl(data) {\n    const url = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.itemFromSingleOrMultiple)(data.url, data.index);\n    if (!url) {\n        return data.fallback;\n    }\n    const response = await fetch(url);\n    if (response.ok) {\n        return await response.json();\n    }\n    (0,_Utils_LogUtils_js__WEBPACK_IMPORTED_MODULE_4__.getLogger)().error(`${response.status.toString()} while retrieving config file`);\n    return data.fallback;\n}\nconst getCanvasFromContainer = (domContainer)=>{\n    const documentSafe = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.safeDocument)();\n    let canvasEl;\n    if (domContainer instanceof HTMLCanvasElement || domContainer.tagName.toLowerCase() === _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasTag) {\n        canvasEl = domContainer;\n        canvasEl.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] ??= _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedFalse;\n    } else {\n        const existingCanvases = domContainer.getElementsByTagName(_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasTag), foundCanvas = existingCanvases[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasFirstIndex];\n        if (foundCanvas) {\n            canvasEl = foundCanvas;\n            canvasEl.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] = _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedFalse;\n        } else {\n            canvasEl = documentSafe.createElement(_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.canvasTag);\n            canvasEl.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] = _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedTrue;\n            domContainer.appendChild(canvasEl);\n        }\n    }\n    canvasEl.style.width ||= fullPercent;\n    canvasEl.style.height ||= fullPercent;\n    return canvasEl;\n}, getDomContainer = (id, source)=>{\n    const documentSafe = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.safeDocument)();\n    let domContainer = source ?? documentSafe.getElementById(id);\n    if (domContainer) {\n        return domContainer;\n    }\n    domContainer = documentSafe.createElement(\"canvas\");\n    domContainer.id = id;\n    domContainer.dataset[_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedAttribute] = _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.generatedTrue;\n    documentSafe.body.append(domContainer);\n    return domContainer;\n};\nclass Engine {\n    pluginManager = new _Utils_PluginManager_js__WEBPACK_IMPORTED_MODULE_3__.PluginManager(this);\n    _domArray = [];\n    _eventDispatcher = new _Utils_EventDispatcher_js__WEBPACK_IMPORTED_MODULE_2__.EventDispatcher();\n    _initialized = false;\n    get items() {\n        return this._domArray;\n    }\n    get version() {\n        return \"4.0.0-beta.1\";\n    }\n    addEventListener(type, listener) {\n        this._eventDispatcher.addEventListener(type, listener);\n    }\n    checkVersion(pluginVersion) {\n        if (this.version === pluginVersion) {\n            return;\n        }\n        throw new Error(`The tsParticles version is different from the loaded plugins version. Engine version: ${this.version}. Plugin version: ${pluginVersion}`);\n    }\n    dispatchEvent(type, args) {\n        this._eventDispatcher.dispatchEvent(type, args);\n    }\n    async init() {\n        if (this._initialized) {\n            return;\n        }\n        await this.pluginManager.init();\n        this._initialized = true;\n    }\n    item(index) {\n        const { items } = this, item = items[index];\n        if (item?.destroyed) {\n            items.splice(index, _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.removeDeleteCount);\n            return;\n        }\n        return item;\n    }\n    async load(params) {\n        await this.init();\n        const { Container } = await __webpack_require__.e(/*! import() */ \"engine_dist_browser_Core_Container_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./Container.js */ \"../../engine/dist/browser/Core/Container.js\")), id = params.id ?? params.element?.id ?? `tsparticles${Math.floor((0,_Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_5__.getRandom)() * _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.loadRandomFactor).toString()}`, { index, url } = params, options = url ? await getDataFromUrl({\n            fallback: params.options,\n            url,\n            index\n        }) : params.options, currentOptions = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_1__.itemFromSingleOrMultiple)(options, index), { items } = this, oldIndex = items.findIndex((v)=>v.id.description === id), newItem = new Container({\n            dispatchCallback: (eventType, args)=>{\n                this.dispatchEvent(eventType, args);\n            },\n            id,\n            onDestroy: (remove)=>{\n                if (!remove) {\n                    return;\n                }\n                const mainArr = this.items, idx = mainArr.indexOf(newItem);\n                if (idx >= _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.removeMinIndex) {\n                    mainArr.splice(idx, _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.removeDeleteCount);\n                }\n            },\n            pluginManager: this.pluginManager,\n            sourceOptions: currentOptions\n        });\n        if (oldIndex >= _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.loadMinIndex) {\n            const old = this.item(oldIndex), deleteCount = old ? _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.one : _Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.none;\n            if (old && !old.destroyed) {\n                old.destroy(false);\n            }\n            items.splice(oldIndex, deleteCount, newItem);\n        } else {\n            items.push(newItem);\n        }\n        const domContainer = getDomContainer(id, params.element), canvasEl = getCanvasFromContainer(domContainer);\n        newItem.canvas.loadCanvas(canvasEl);\n        await newItem.start();\n        return newItem;\n    }\n    async refresh(refresh = true) {\n        if (!refresh) {\n            return;\n        }\n        await Promise.all(this.items.map((t)=>t.refresh()));\n    }\n    removeEventListener(type, listener) {\n        this._eventDispatcher.removeEventListener(type, listener);\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Core/Engine.js?\n}");
 
 /***/ },
 
@@ -48,6 +48,16 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
 
 /***/ },
 
+/***/ "../../engine/dist/browser/Core/Utils/PluginManager.js"
+/*!*************************************************************!*\
+  !*** ../../engine/dist/browser/Core/Utils/PluginManager.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 */   PluginManager: () => (/* binding */ PluginManager)\n/* harmony export */ });\n/* harmony import */ var _Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../Utils/Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n/* harmony import */ var _Enums_Types_EventType_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../Enums/Types/EventType.js */ \"../../engine/dist/browser/Enums/Types/EventType.js\");\n\n\nclass PluginManager {\n    colorManagers = new Map();\n    easingFunctions = new Map();\n    effectDrawers = new Map();\n    initializers = {\n        effects: new Map(),\n        shapes: new Map(),\n        updaters: new Map()\n    };\n    palettes = new Map();\n    plugins = [];\n    presets = new Map();\n    shapeDrawers = new Map();\n    updaters = new Map();\n    _allLoadersSet = new Set();\n    _configs = new Map();\n    _engine;\n    _executedSet = new Set();\n    _initialized = false;\n    _isRunningLoaders = false;\n    _loadPromises = new Set();\n    constructor(engine){\n        this._engine = engine;\n    }\n    get configs() {\n        const res = {};\n        for (const [name, config] of this._configs){\n            res[name] = config;\n        }\n        return res;\n    }\n    addColorManager(name, manager) {\n        this.colorManagers.set(name, manager);\n    }\n    addConfig(config) {\n        const key = config.key ?? config.name ?? \"default\";\n        this._configs.set(key, config);\n        this._engine.dispatchEvent(_Enums_Types_EventType_js__WEBPACK_IMPORTED_MODULE_1__.EventType.configAdded, {\n            data: {\n                name: key,\n                config\n            }\n        });\n    }\n    addEasing(name, easing) {\n        if (this.easingFunctions.get(name)) {\n            return;\n        }\n        this.easingFunctions.set(name, easing);\n    }\n    addEffect(effect, drawer) {\n        this.initializers.effects.set(effect, drawer);\n    }\n    addPalette(name, palette) {\n        this.palettes.set(name, palette);\n    }\n    addParticleUpdater(name, updaterInitializer) {\n        this.initializers.updaters.set(name, updaterInitializer);\n    }\n    addPlugin(plugin) {\n        if (this.getPlugin(plugin.id)) {\n            return;\n        }\n        this.plugins.push(plugin);\n    }\n    addPreset(preset, options, override = false) {\n        if (!(override || !this.getPreset(preset))) {\n            return;\n        }\n        this.presets.set(preset, options);\n    }\n    addShape(shapes, drawer) {\n        for (const shape of shapes){\n            this.initializers.shapes.set(shape, drawer);\n        }\n    }\n    clearPlugins(container) {\n        this.effectDrawers.delete(container);\n        this.shapeDrawers.delete(container);\n        this.updaters.delete(container);\n    }\n    getEasing(name) {\n        return this.easingFunctions.get(name) ?? ((value)=>value);\n    }\n    getEffectDrawers(container, force = false) {\n        return (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.getItemMapFromInitializer)(container, this.effectDrawers, this.initializers.effects, force);\n    }\n    getPalette(name) {\n        return this.palettes.get(name);\n    }\n    getPlugin(plugin) {\n        return this.plugins.find((t)=>t.id === plugin);\n    }\n    getPreset(preset) {\n        return this.presets.get(preset);\n    }\n    async getShapeDrawers(container, force = false) {\n        return (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.getItemMapFromInitializer)(container, this.shapeDrawers, this.initializers.shapes, force);\n    }\n    async getUpdaters(container, force = false) {\n        return (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.getItemsFromInitializer)(container, this.updaters, this.initializers.updaters, force);\n    }\n    async init() {\n        if (this._initialized || this._isRunningLoaders) {\n            return;\n        }\n        this._isRunningLoaders = true;\n        this._executedSet = new Set();\n        this._allLoadersSet = new Set(this._loadPromises);\n        try {\n            for (const loader of this._allLoadersSet){\n                await this._runLoader(loader, this._executedSet, this._allLoadersSet);\n            }\n        } finally{\n            this._loadPromises.clear();\n            this._isRunningLoaders = false;\n            this._initialized = true;\n        }\n    }\n    loadParticlesOptions(container, options, ...sourceOptions) {\n        const updaters = this.updaters.get(container);\n        if (!updaters) {\n            return;\n        }\n        updaters.forEach((updater)=>updater.loadOptions?.(options, ...sourceOptions));\n    }\n    async register(...loaders) {\n        if (this._initialized) {\n            throw new Error(\"Register plugins can only be done before calling tsParticles.load()\");\n        }\n        for (const loader of loaders){\n            if (this._isRunningLoaders) {\n                await this._runLoader(loader, this._executedSet, this._allLoadersSet);\n            } else {\n                this._loadPromises.add(loader);\n            }\n        }\n    }\n    async _runLoader(loader, executed, allLoaders) {\n        if (executed.has(loader)) return;\n        executed.add(loader);\n        allLoaders.add(loader);\n        await loader(this._engine);\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Core/Utils/PluginManager.js?\n}");
+
+/***/ },
+
 /***/ "../../engine/dist/browser/Core/Utils/Ranges.js"
 /*!******************************************************!*\
   !*** ../../engine/dist/browser/Core/Utils/Ranges.js ***!
@@ -294,7 +304,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 */   Options: () => (/* binding */ Options)\n/* harmony export */ });\n/* harmony import */ var _Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../Utils/Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n/* harmony import */ var _Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../Utils/TypeUtils.js */ \"../../engine/dist/browser/Utils/TypeUtils.js\");\n/* harmony import */ var _Background_Background_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Background/Background.js */ \"../../engine/dist/browser/Options/Classes/Background/Background.js\");\n/* harmony import */ var _FullScreen_FullScreen_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./FullScreen/FullScreen.js */ \"../../engine/dist/browser/Options/Classes/FullScreen/FullScreen.js\");\n/* harmony import */ var _ResizeEvent_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ResizeEvent.js */ \"../../engine/dist/browser/Options/Classes/ResizeEvent.js\");\n/* harmony import */ var _Utils_OptionsUtils_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../Utils/OptionsUtils.js */ \"../../engine/dist/browser/Utils/OptionsUtils.js\");\n/* harmony import */ var _Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../Utils/MathUtils.js */ \"../../engine/dist/browser/Utils/MathUtils.js\");\n\n\n\n\n\n\n\nclass Options {\n    autoPlay;\n    background;\n    clear;\n    defaultThemes;\n    delay;\n    detectRetina;\n    duration;\n    fpsLimit;\n    fullScreen;\n    hdr;\n    key;\n    name;\n    palette;\n    particles;\n    pauseOnBlur;\n    pauseOnOutsideViewport;\n    preset;\n    resize;\n    smooth;\n    style;\n    zLayers;\n    _container;\n    _engine;\n    constructor(engine, container){\n        this._engine = engine;\n        this._container = container;\n        this.autoPlay = true;\n        this.background = new _Background_Background_js__WEBPACK_IMPORTED_MODULE_2__.Background();\n        this.clear = true;\n        this.defaultThemes = {};\n        this.delay = 0;\n        this.fullScreen = new _FullScreen_FullScreen_js__WEBPACK_IMPORTED_MODULE_3__.FullScreen();\n        this.detectRetina = true;\n        this.duration = 0;\n        this.fpsLimit = 120;\n        this.hdr = true;\n        this.particles = (0,_Utils_OptionsUtils_js__WEBPACK_IMPORTED_MODULE_5__.loadParticlesOptions)(this._engine, this._container);\n        this.pauseOnBlur = true;\n        this.pauseOnOutsideViewport = true;\n        this.resize = new _ResizeEvent_js__WEBPACK_IMPORTED_MODULE_4__.ResizeEvent();\n        this.smooth = false;\n        this.style = {};\n        this.zLayers = 100;\n    }\n    load(data) {\n        if ((0,_Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_1__.isNull)(data)) {\n            return;\n        }\n        if (data.preset !== undefined) {\n            this.preset = data.preset;\n            (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(this.preset, (preset)=>{\n                this._importPreset(preset);\n            });\n        }\n        if (data.palette !== undefined) {\n            this.palette = data.palette;\n            this._importPalette(this.palette);\n        }\n        if (data.autoPlay !== undefined) {\n            this.autoPlay = data.autoPlay;\n        }\n        if (data.clear !== undefined) {\n            this.clear = data.clear;\n        }\n        if (data.key !== undefined) {\n            this.key = data.key;\n        }\n        if (data.name !== undefined) {\n            this.name = data.name;\n        }\n        if (data.delay !== undefined) {\n            this.delay = (0,_Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_6__.setRangeValue)(data.delay);\n        }\n        const detectRetina = data.detectRetina;\n        if (detectRetina !== undefined) {\n            this.detectRetina = detectRetina;\n        }\n        if (data.duration !== undefined) {\n            this.duration = (0,_Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_6__.setRangeValue)(data.duration);\n        }\n        const fpsLimit = data.fpsLimit;\n        if (fpsLimit !== undefined) {\n            this.fpsLimit = fpsLimit;\n        }\n        if (data.hdr !== undefined) {\n            this.hdr = data.hdr;\n        }\n        if (data.pauseOnBlur !== undefined) {\n            this.pauseOnBlur = data.pauseOnBlur;\n        }\n        if (data.pauseOnOutsideViewport !== undefined) {\n            this.pauseOnOutsideViewport = data.pauseOnOutsideViewport;\n        }\n        if (data.zLayers !== undefined) {\n            this.zLayers = data.zLayers;\n        }\n        this.background.load(data.background);\n        const fullScreen = data.fullScreen;\n        if ((0,_Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_1__.isBoolean)(fullScreen)) {\n            this.fullScreen.enable = fullScreen;\n        } else {\n            this.fullScreen.load(fullScreen);\n        }\n        this.particles.load(data.particles);\n        this.resize.load(data.resize);\n        this.style = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.deepExtend)(this.style, data.style);\n        if (data.smooth !== undefined) {\n            this.smooth = data.smooth;\n        }\n        this._engine.plugins.forEach((plugin)=>{\n            plugin.loadOptions(this._container, this, data);\n        });\n    }\n    _importPalette = (palette)=>{\n        const paletteData = this._engine.getPalette(palette);\n        if (!paletteData) {\n            return;\n        }\n        this.load({\n            background: {\n                color: paletteData.background\n            },\n            blend: {\n                enable: true,\n                mode: paletteData.blendMode\n            },\n            particles: {\n                fill: {\n                    color: paletteData.fill ? {\n                        value: paletteData.colors\n                    } : undefined,\n                    enable: paletteData.fill\n                },\n                stroke: !paletteData.fill ? paletteData.colors.map((color)=>({\n                        color: {\n                            value: color\n                        },\n                        width: 1\n                    })) : undefined\n            }\n        });\n    };\n    _importPreset = (preset)=>{\n        this.load(this._engine.getPreset(preset));\n    };\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Options/Classes/Options.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Options: () => (/* binding */ Options)\n/* harmony export */ });\n/* harmony import */ var _Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../Utils/Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n/* harmony import */ var _Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../Utils/TypeUtils.js */ \"../../engine/dist/browser/Utils/TypeUtils.js\");\n/* harmony import */ var _Background_Background_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Background/Background.js */ \"../../engine/dist/browser/Options/Classes/Background/Background.js\");\n/* harmony import */ var _FullScreen_FullScreen_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./FullScreen/FullScreen.js */ \"../../engine/dist/browser/Options/Classes/FullScreen/FullScreen.js\");\n/* harmony import */ var _ResizeEvent_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ResizeEvent.js */ \"../../engine/dist/browser/Options/Classes/ResizeEvent.js\");\n/* harmony import */ var _Utils_OptionsUtils_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../Utils/OptionsUtils.js */ \"../../engine/dist/browser/Utils/OptionsUtils.js\");\n/* harmony import */ var _Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../Utils/MathUtils.js */ \"../../engine/dist/browser/Utils/MathUtils.js\");\n\n\n\n\n\n\n\nclass Options {\n    autoPlay;\n    background;\n    clear;\n    defaultThemes;\n    delay;\n    detectRetina;\n    duration;\n    fpsLimit;\n    fullScreen;\n    hdr;\n    key;\n    name;\n    palette;\n    particles;\n    pauseOnBlur;\n    pauseOnOutsideViewport;\n    preset;\n    resize;\n    smooth;\n    style;\n    zLayers;\n    _container;\n    _pluginManager;\n    constructor(pluginManager, container){\n        this._pluginManager = pluginManager;\n        this._container = container;\n        this.autoPlay = true;\n        this.background = new _Background_Background_js__WEBPACK_IMPORTED_MODULE_2__.Background();\n        this.clear = true;\n        this.defaultThemes = {};\n        this.delay = 0;\n        this.fullScreen = new _FullScreen_FullScreen_js__WEBPACK_IMPORTED_MODULE_3__.FullScreen();\n        this.detectRetina = true;\n        this.duration = 0;\n        this.fpsLimit = 120;\n        this.hdr = true;\n        this.particles = (0,_Utils_OptionsUtils_js__WEBPACK_IMPORTED_MODULE_5__.loadParticlesOptions)(this._pluginManager, this._container);\n        this.pauseOnBlur = true;\n        this.pauseOnOutsideViewport = true;\n        this.resize = new _ResizeEvent_js__WEBPACK_IMPORTED_MODULE_4__.ResizeEvent();\n        this.smooth = false;\n        this.style = {};\n        this.zLayers = 100;\n    }\n    load(data) {\n        if ((0,_Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_1__.isNull)(data)) {\n            return;\n        }\n        if (data.preset !== undefined) {\n            this.preset = data.preset;\n            (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(this.preset, (preset)=>{\n                this._importPreset(preset);\n            });\n        }\n        if (data.palette !== undefined) {\n            this.palette = data.palette;\n            this._importPalette(this.palette);\n        }\n        if (data.autoPlay !== undefined) {\n            this.autoPlay = data.autoPlay;\n        }\n        if (data.clear !== undefined) {\n            this.clear = data.clear;\n        }\n        if (data.key !== undefined) {\n            this.key = data.key;\n        }\n        if (data.name !== undefined) {\n            this.name = data.name;\n        }\n        if (data.delay !== undefined) {\n            this.delay = (0,_Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_6__.setRangeValue)(data.delay);\n        }\n        const detectRetina = data.detectRetina;\n        if (detectRetina !== undefined) {\n            this.detectRetina = detectRetina;\n        }\n        if (data.duration !== undefined) {\n            this.duration = (0,_Utils_MathUtils_js__WEBPACK_IMPORTED_MODULE_6__.setRangeValue)(data.duration);\n        }\n        const fpsLimit = data.fpsLimit;\n        if (fpsLimit !== undefined) {\n            this.fpsLimit = fpsLimit;\n        }\n        if (data.hdr !== undefined) {\n            this.hdr = data.hdr;\n        }\n        if (data.pauseOnBlur !== undefined) {\n            this.pauseOnBlur = data.pauseOnBlur;\n        }\n        if (data.pauseOnOutsideViewport !== undefined) {\n            this.pauseOnOutsideViewport = data.pauseOnOutsideViewport;\n        }\n        if (data.zLayers !== undefined) {\n            this.zLayers = data.zLayers;\n        }\n        this.background.load(data.background);\n        const fullScreen = data.fullScreen;\n        if ((0,_Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_1__.isBoolean)(fullScreen)) {\n            this.fullScreen.enable = fullScreen;\n        } else {\n            this.fullScreen.load(fullScreen);\n        }\n        this.particles.load(data.particles);\n        this.resize.load(data.resize);\n        this.style = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.deepExtend)(this.style, data.style);\n        if (data.smooth !== undefined) {\n            this.smooth = data.smooth;\n        }\n        this._pluginManager.plugins.forEach((plugin)=>{\n            plugin.loadOptions(this._container, this, data);\n        });\n    }\n    _importPalette = (palette)=>{\n        const paletteData = this._pluginManager.getPalette(palette);\n        if (!paletteData) {\n            return;\n        }\n        this.load({\n            background: {\n                color: paletteData.background\n            },\n            blend: {\n                enable: true,\n                mode: paletteData.blendMode\n            },\n            particles: {\n                fill: {\n                    color: paletteData.fill ? {\n                        value: paletteData.colors\n                    } : undefined,\n                    enable: paletteData.fill\n                },\n                stroke: !paletteData.fill ? paletteData.colors.map((color)=>({\n                        color: {\n                            value: color\n                        },\n                        width: 1\n                    })) : undefined\n            }\n        });\n    };\n    _importPreset = (preset)=>{\n        this.load(this._pluginManager.getPreset(preset));\n    };\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Options/Classes/Options.js?\n}");
 
 /***/ },
 
@@ -474,7 +484,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 */   ParticlesOptions: () => (/* binding */ ParticlesOptions)\n/* harmony export */ });\n/* harmony import */ var _Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../Utils/Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n/* harmony import */ var _Effect_Effect_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Effect/Effect.js */ \"../../engine/dist/browser/Options/Classes/Particles/Effect/Effect.js\");\n/* harmony import */ var _Fill_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Fill.js */ \"../../engine/dist/browser/Options/Classes/Particles/Fill.js\");\n/* harmony import */ var _Move_Move_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Move/Move.js */ \"../../engine/dist/browser/Options/Classes/Particles/Move/Move.js\");\n/* harmony import */ var _Opacity_Opacity_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Opacity/Opacity.js */ \"../../engine/dist/browser/Options/Classes/Particles/Opacity/Opacity.js\");\n/* harmony import */ var _Bounce_ParticlesBounce_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Bounce/ParticlesBounce.js */ \"../../engine/dist/browser/Options/Classes/Particles/Bounce/ParticlesBounce.js\");\n/* harmony import */ var _Number_ParticlesNumber_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Number/ParticlesNumber.js */ \"../../engine/dist/browser/Options/Classes/Particles/Number/ParticlesNumber.js\");\n/* harmony import */ var _Shape_Shape_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Shape/Shape.js */ \"../../engine/dist/browser/Options/Classes/Particles/Shape/Shape.js\");\n/* harmony import */ var _Size_Size_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Size/Size.js */ \"../../engine/dist/browser/Options/Classes/Particles/Size/Size.js\");\n/* harmony import */ var _Stroke_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Stroke.js */ \"../../engine/dist/browser/Options/Classes/Particles/Stroke.js\");\n/* harmony import */ var _ZIndex_ZIndex_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./ZIndex/ZIndex.js */ \"../../engine/dist/browser/Options/Classes/Particles/ZIndex/ZIndex.js\");\n/* harmony import */ var _Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../Utils/TypeUtils.js */ \"../../engine/dist/browser/Utils/TypeUtils.js\");\n\n\n\n\n\n\n\n\n\n\n\n\nclass ParticlesOptions {\n    bounce;\n    effect;\n    fill;\n    groups;\n    move;\n    number;\n    opacity;\n    reduceDuplicates;\n    shape;\n    size;\n    stroke;\n    zIndex;\n    _container;\n    _engine;\n    constructor(engine, container){\n        this._engine = engine;\n        this._container = container;\n        this.bounce = new _Bounce_ParticlesBounce_js__WEBPACK_IMPORTED_MODULE_5__.ParticlesBounce();\n        this.effect = new _Effect_Effect_js__WEBPACK_IMPORTED_MODULE_1__.Effect();\n        this.fill = new _Fill_js__WEBPACK_IMPORTED_MODULE_2__.Fill();\n        this.groups = {};\n        this.move = new _Move_Move_js__WEBPACK_IMPORTED_MODULE_3__.Move();\n        this.number = new _Number_ParticlesNumber_js__WEBPACK_IMPORTED_MODULE_6__.ParticlesNumber();\n        this.opacity = new _Opacity_Opacity_js__WEBPACK_IMPORTED_MODULE_4__.Opacity();\n        this.reduceDuplicates = false;\n        this.shape = new _Shape_Shape_js__WEBPACK_IMPORTED_MODULE_7__.Shape();\n        this.size = new _Size_Size_js__WEBPACK_IMPORTED_MODULE_8__.Size();\n        this.stroke = new _Stroke_js__WEBPACK_IMPORTED_MODULE_9__.Stroke();\n        this.zIndex = new _ZIndex_ZIndex_js__WEBPACK_IMPORTED_MODULE_10__.ZIndex();\n    }\n    load(data) {\n        if ((0,_Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_11__.isNull)(data)) {\n            return;\n        }\n        if (data.groups !== undefined) {\n            for (const group of Object.keys(data.groups)){\n                if (!(group in data.groups)) {\n                    continue;\n                }\n                const item = data.groups[group];\n                if (item !== undefined) {\n                    this.groups[group] = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.deepExtend)(this.groups[group] ?? {}, item);\n                }\n            }\n        }\n        if (data.reduceDuplicates !== undefined) {\n            this.reduceDuplicates = data.reduceDuplicates;\n        }\n        this.bounce.load(data.bounce);\n        this.effect.load(data.effect);\n        this.move.load(data.move);\n        this.number.load(data.number);\n        this.opacity.load(data.opacity);\n        this.shape.load(data.shape);\n        this.size.load(data.size);\n        this.zIndex.load(data.zIndex);\n        const fillToLoad = data.fill;\n        if (fillToLoad) {\n            this.fill = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(fillToLoad, (t)=>{\n                const tmp = new _Fill_js__WEBPACK_IMPORTED_MODULE_2__.Fill();\n                tmp.load(t);\n                return tmp;\n            });\n        }\n        const strokeToLoad = data.stroke;\n        if (strokeToLoad) {\n            this.stroke = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(strokeToLoad, (t)=>{\n                const tmp = new _Stroke_js__WEBPACK_IMPORTED_MODULE_9__.Stroke();\n                tmp.load(t);\n                return tmp;\n            });\n        }\n        if (this._container) {\n            for (const plugin of this._engine.plugins){\n                if (plugin.loadParticlesOptions) {\n                    plugin.loadParticlesOptions(this._container, this, data);\n                }\n            }\n            const updaters = this._engine.updaters.get(this._container);\n            if (updaters) {\n                for (const updater of updaters){\n                    if (updater.loadOptions) {\n                        updater.loadOptions(this, data);\n                    }\n                }\n            }\n        }\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Options/Classes/Particles/ParticlesOptions.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ParticlesOptions: () => (/* binding */ ParticlesOptions)\n/* harmony export */ });\n/* harmony import */ var _Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../Utils/Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n/* harmony import */ var _Effect_Effect_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Effect/Effect.js */ \"../../engine/dist/browser/Options/Classes/Particles/Effect/Effect.js\");\n/* harmony import */ var _Fill_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Fill.js */ \"../../engine/dist/browser/Options/Classes/Particles/Fill.js\");\n/* harmony import */ var _Move_Move_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Move/Move.js */ \"../../engine/dist/browser/Options/Classes/Particles/Move/Move.js\");\n/* harmony import */ var _Opacity_Opacity_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Opacity/Opacity.js */ \"../../engine/dist/browser/Options/Classes/Particles/Opacity/Opacity.js\");\n/* harmony import */ var _Bounce_ParticlesBounce_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Bounce/ParticlesBounce.js */ \"../../engine/dist/browser/Options/Classes/Particles/Bounce/ParticlesBounce.js\");\n/* harmony import */ var _Number_ParticlesNumber_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Number/ParticlesNumber.js */ \"../../engine/dist/browser/Options/Classes/Particles/Number/ParticlesNumber.js\");\n/* harmony import */ var _Shape_Shape_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Shape/Shape.js */ \"../../engine/dist/browser/Options/Classes/Particles/Shape/Shape.js\");\n/* harmony import */ var _Size_Size_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Size/Size.js */ \"../../engine/dist/browser/Options/Classes/Particles/Size/Size.js\");\n/* harmony import */ var _Stroke_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Stroke.js */ \"../../engine/dist/browser/Options/Classes/Particles/Stroke.js\");\n/* harmony import */ var _ZIndex_ZIndex_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./ZIndex/ZIndex.js */ \"../../engine/dist/browser/Options/Classes/Particles/ZIndex/ZIndex.js\");\n/* harmony import */ var _Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../Utils/TypeUtils.js */ \"../../engine/dist/browser/Utils/TypeUtils.js\");\n\n\n\n\n\n\n\n\n\n\n\n\nclass ParticlesOptions {\n    bounce;\n    effect;\n    fill;\n    groups;\n    move;\n    number;\n    opacity;\n    reduceDuplicates;\n    shape;\n    size;\n    stroke;\n    zIndex;\n    _container;\n    _pluginManager;\n    constructor(pluginManager, container){\n        this._pluginManager = pluginManager;\n        this._container = container;\n        this.bounce = new _Bounce_ParticlesBounce_js__WEBPACK_IMPORTED_MODULE_5__.ParticlesBounce();\n        this.effect = new _Effect_Effect_js__WEBPACK_IMPORTED_MODULE_1__.Effect();\n        this.fill = new _Fill_js__WEBPACK_IMPORTED_MODULE_2__.Fill();\n        this.groups = {};\n        this.move = new _Move_Move_js__WEBPACK_IMPORTED_MODULE_3__.Move();\n        this.number = new _Number_ParticlesNumber_js__WEBPACK_IMPORTED_MODULE_6__.ParticlesNumber();\n        this.opacity = new _Opacity_Opacity_js__WEBPACK_IMPORTED_MODULE_4__.Opacity();\n        this.reduceDuplicates = false;\n        this.shape = new _Shape_Shape_js__WEBPACK_IMPORTED_MODULE_7__.Shape();\n        this.size = new _Size_Size_js__WEBPACK_IMPORTED_MODULE_8__.Size();\n        this.stroke = new _Stroke_js__WEBPACK_IMPORTED_MODULE_9__.Stroke();\n        this.zIndex = new _ZIndex_ZIndex_js__WEBPACK_IMPORTED_MODULE_10__.ZIndex();\n    }\n    load(data) {\n        if ((0,_Utils_TypeUtils_js__WEBPACK_IMPORTED_MODULE_11__.isNull)(data)) {\n            return;\n        }\n        if (data.groups !== undefined) {\n            for (const group of Object.keys(data.groups)){\n                if (!(group in data.groups)) {\n                    continue;\n                }\n                const item = data.groups[group];\n                if (item !== undefined) {\n                    this.groups[group] = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.deepExtend)(this.groups[group] ?? {}, item);\n                }\n            }\n        }\n        if (data.reduceDuplicates !== undefined) {\n            this.reduceDuplicates = data.reduceDuplicates;\n        }\n        this.bounce.load(data.bounce);\n        this.effect.load(data.effect);\n        this.move.load(data.move);\n        this.number.load(data.number);\n        this.opacity.load(data.opacity);\n        this.shape.load(data.shape);\n        this.size.load(data.size);\n        this.zIndex.load(data.zIndex);\n        const fillToLoad = data.fill;\n        if (fillToLoad) {\n            this.fill = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(fillToLoad, (t)=>{\n                const tmp = new _Fill_js__WEBPACK_IMPORTED_MODULE_2__.Fill();\n                tmp.load(t);\n                return tmp;\n            });\n        }\n        const strokeToLoad = data.stroke;\n        if (strokeToLoad) {\n            this.stroke = (0,_Utils_Utils_js__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(strokeToLoad, (t)=>{\n                const tmp = new _Stroke_js__WEBPACK_IMPORTED_MODULE_9__.Stroke();\n                tmp.load(t);\n                return tmp;\n            });\n        }\n        if (this._container) {\n            for (const plugin of this._pluginManager.plugins){\n                if (plugin.loadParticlesOptions) {\n                    plugin.loadParticlesOptions(this._container, this, data);\n                }\n            }\n            const updaters = this._pluginManager.updaters.get(this._container);\n            if (updaters) {\n                for (const updater of updaters){\n                    if (updater.loadOptions) {\n                        updater.loadOptions(this, data);\n                    }\n                }\n            }\n        }\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Options/Classes/Particles/ParticlesOptions.js?\n}");
 
 /***/ },
 
@@ -554,7 +564,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 */   clear: () => (/* binding */ clear),\n/* harmony export */   drawAfterEffect: () => (/* binding */ drawAfterEffect),\n/* harmony export */   drawBeforeEffect: () => (/* binding */ drawBeforeEffect),\n/* harmony export */   drawParticle: () => (/* binding */ drawParticle),\n/* harmony export */   drawParticlePlugin: () => (/* binding */ drawParticlePlugin),\n/* harmony export */   drawShape: () => (/* binding */ drawShape),\n/* harmony export */   drawShapeAfterDraw: () => (/* binding */ drawShapeAfterDraw),\n/* harmony export */   drawShapeBeforeDraw: () => (/* binding */ drawShapeBeforeDraw),\n/* harmony export */   paintBase: () => (/* binding */ paintBase),\n/* harmony export */   paintImage: () => (/* binding */ paintImage)\n/* harmony export */ });\n/* harmony import */ var _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Core/Utils/Constants.js */ \"../../engine/dist/browser/Core/Utils/Constants.js\");\n\nfunction paintBase(context, dimension, baseColor) {\n    context.fillStyle = baseColor ?? \"rgba(0,0,0,0)\";\n    context.fillRect(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.x, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.y, dimension.width, dimension.height);\n}\nfunction paintImage(context, dimension, image, opacity) {\n    if (!image) {\n        return;\n    }\n    const prevAlpha = context.globalAlpha;\n    context.globalAlpha = opacity;\n    context.drawImage(image, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.x, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.y, dimension.width, dimension.height);\n    context.globalAlpha = prevAlpha;\n}\nfunction clear(context, dimension) {\n    context.clearRect(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.x, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.y, dimension.width, dimension.height);\n}\nfunction drawParticle(data) {\n    const { container, context, particle, delta, colorStyles, radius, opacity, transform } = data, { effectDrawers, shapeDrawers } = container.particles, pos = particle.getPosition(), transformData = particle.getTransformData(transform), drawScale = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.defaultZoom, drawPosition = {\n        x: pos.x,\n        y: pos.y\n    };\n    context.setTransform(transformData.a, transformData.b, transformData.c, transformData.d, pos.x, pos.y);\n    if (colorStyles.fill) {\n        context.fillStyle = colorStyles.fill;\n    }\n    const fillEnabled = !!particle.fillEnabled, strokeWidth = particle.strokeWidth ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.minStrokeWidth;\n    context.lineWidth = strokeWidth;\n    if (colorStyles.stroke) {\n        context.strokeStyle = colorStyles.stroke;\n    }\n    const drawData = {\n        context,\n        particle,\n        radius,\n        drawRadius: radius * drawScale,\n        opacity,\n        delta,\n        pixelRatio: container.retina.pixelRatio,\n        fill: fillEnabled,\n        stroke: strokeWidth > _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.minStrokeWidth,\n        transformData,\n        position: {\n            ...pos\n        },\n        drawPosition,\n        drawScale\n    };\n    for (const plugin of container.plugins){\n        plugin.drawParticleTransform?.(drawData);\n    }\n    const effect = particle.effect ? effectDrawers.get(particle.effect) : undefined, shape = particle.shape ? shapeDrawers.get(particle.shape) : undefined;\n    drawBeforeEffect(effect, drawData);\n    drawShapeBeforeDraw(shape, drawData);\n    drawShape(shape, drawData);\n    drawShapeAfterDraw(shape, drawData);\n    drawAfterEffect(effect, drawData);\n    context.resetTransform();\n}\nfunction drawAfterEffect(drawer, data) {\n    if (!drawer?.drawAfter) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.effect) {\n        return;\n    }\n    drawer.drawAfter(data);\n}\nfunction drawBeforeEffect(drawer, data) {\n    if (!drawer?.drawBefore) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.effect) {\n        return;\n    }\n    drawer.drawBefore(data);\n}\nfunction drawShape(drawer, data) {\n    if (!drawer) {\n        return;\n    }\n    const { context, fill, particle, stroke } = data;\n    if (!particle.shape) {\n        return;\n    }\n    context.beginPath();\n    drawer.draw(data);\n    if (particle.shapeClose) {\n        context.closePath();\n    }\n    if (stroke) {\n        context.stroke();\n    }\n    if (fill) {\n        context.fill();\n    }\n}\nfunction drawShapeAfterDraw(drawer, data) {\n    if (!drawer?.afterDraw) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.shape) {\n        return;\n    }\n    drawer.afterDraw(data);\n}\nfunction drawShapeBeforeDraw(drawer, data) {\n    if (!drawer?.beforeDraw) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.shape) {\n        return;\n    }\n    drawer.beforeDraw(data);\n}\nfunction drawParticlePlugin(context, plugin, particle, delta) {\n    if (!plugin.drawParticle) {\n        return;\n    }\n    plugin.drawParticle(context, particle, delta);\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/CanvasUtils.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   clear: () => (/* binding */ clear),\n/* harmony export */   drawAfterEffect: () => (/* binding */ drawAfterEffect),\n/* harmony export */   drawBeforeEffect: () => (/* binding */ drawBeforeEffect),\n/* harmony export */   drawParticle: () => (/* binding */ drawParticle),\n/* harmony export */   drawParticlePlugin: () => (/* binding */ drawParticlePlugin),\n/* harmony export */   drawShape: () => (/* binding */ drawShape),\n/* harmony export */   drawShapeAfterDraw: () => (/* binding */ drawShapeAfterDraw),\n/* harmony export */   drawShapeBeforeDraw: () => (/* binding */ drawShapeBeforeDraw),\n/* harmony export */   paintBase: () => (/* binding */ paintBase),\n/* harmony export */   paintImage: () => (/* binding */ paintImage)\n/* harmony export */ });\n/* harmony import */ var _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Core/Utils/Constants.js */ \"../../engine/dist/browser/Core/Utils/Constants.js\");\n\nfunction paintBase(context, dimension, baseColor) {\n    context.fillStyle = baseColor ?? \"rgba(0,0,0,0)\";\n    context.fillRect(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.x, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.y, dimension.width, dimension.height);\n}\nfunction paintImage(context, dimension, image, opacity) {\n    if (!image) {\n        return;\n    }\n    const prevAlpha = context.globalAlpha;\n    context.globalAlpha = opacity;\n    context.drawImage(image, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.x, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.y, dimension.width, dimension.height);\n    context.globalAlpha = prevAlpha;\n}\nfunction clear(context, dimension) {\n    context.clearRect(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.x, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.originPoint.y, dimension.width, dimension.height);\n}\nfunction drawParticle(data) {\n    const { container, context, particle, delta, colorStyles, radius, opacity, transform } = data, { effectDrawers, shapeDrawers } = container, pos = particle.getPosition(), transformData = particle.getTransformData(transform), drawScale = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.defaultZoom, drawPosition = {\n        x: pos.x,\n        y: pos.y\n    };\n    context.setTransform(transformData.a, transformData.b, transformData.c, transformData.d, pos.x, pos.y);\n    if (colorStyles.fill) {\n        context.fillStyle = colorStyles.fill;\n    }\n    const fillEnabled = !!particle.fillEnabled, strokeWidth = particle.strokeWidth ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.minStrokeWidth;\n    context.lineWidth = strokeWidth;\n    if (colorStyles.stroke) {\n        context.strokeStyle = colorStyles.stroke;\n    }\n    const drawData = {\n        context,\n        particle,\n        radius,\n        drawRadius: radius * drawScale,\n        opacity,\n        delta,\n        pixelRatio: container.retina.pixelRatio,\n        fill: fillEnabled,\n        stroke: strokeWidth > _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_0__.minStrokeWidth,\n        transformData,\n        position: {\n            ...pos\n        },\n        drawPosition,\n        drawScale\n    };\n    for (const plugin of container.plugins){\n        plugin.drawParticleTransform?.(drawData);\n    }\n    const effect = particle.effect ? effectDrawers.get(particle.effect) : undefined, shape = particle.shape ? shapeDrawers.get(particle.shape) : undefined;\n    drawBeforeEffect(effect, drawData);\n    drawShapeBeforeDraw(shape, drawData);\n    drawShape(shape, drawData);\n    drawShapeAfterDraw(shape, drawData);\n    drawAfterEffect(effect, drawData);\n    context.resetTransform();\n}\nfunction drawAfterEffect(drawer, data) {\n    if (!drawer?.drawAfter) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.effect) {\n        return;\n    }\n    drawer.drawAfter(data);\n}\nfunction drawBeforeEffect(drawer, data) {\n    if (!drawer?.drawBefore) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.effect) {\n        return;\n    }\n    drawer.drawBefore(data);\n}\nfunction drawShape(drawer, data) {\n    if (!drawer) {\n        return;\n    }\n    const { context, fill, particle, stroke } = data;\n    if (!particle.shape) {\n        return;\n    }\n    context.beginPath();\n    drawer.draw(data);\n    if (particle.shapeClose) {\n        context.closePath();\n    }\n    if (stroke) {\n        context.stroke();\n    }\n    if (fill) {\n        context.fill();\n    }\n}\nfunction drawShapeAfterDraw(drawer, data) {\n    if (!drawer?.afterDraw) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.shape) {\n        return;\n    }\n    drawer.afterDraw(data);\n}\nfunction drawShapeBeforeDraw(drawer, data) {\n    if (!drawer?.beforeDraw) {\n        return;\n    }\n    const { particle } = data;\n    if (!particle.shape) {\n        return;\n    }\n    drawer.beforeDraw(data);\n}\nfunction drawParticlePlugin(context, plugin, particle, delta) {\n    if (!plugin.drawParticle) {\n        return;\n    }\n    plugin.drawParticle(context, particle, delta);\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/CanvasUtils.js?\n}");
 
 /***/ },
 
@@ -564,7 +574,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 */   alterHsl: () => (/* binding */ alterHsl),\n/* harmony export */   colorMix: () => (/* binding */ colorMix),\n/* harmony export */   colorToHsl: () => (/* binding */ colorToHsl),\n/* harmony export */   colorToRgb: () => (/* binding */ colorToRgb),\n/* harmony export */   getHslAnimationFromHsl: () => (/* binding */ getHslAnimationFromHsl),\n/* harmony export */   getHslFromAnimation: () => (/* binding */ getHslFromAnimation),\n/* harmony export */   getLinkColor: () => (/* binding */ getLinkColor),\n/* harmony export */   getLinkRandomColor: () => (/* binding */ getLinkRandomColor),\n/* harmony export */   getRandomRgbColor: () => (/* binding */ getRandomRgbColor),\n/* harmony export */   getStyleFromHsl: () => (/* binding */ getStyleFromHsl),\n/* harmony export */   getStyleFromRgb: () => (/* binding */ getStyleFromRgb),\n/* harmony export */   hslToRgb: () => (/* binding */ hslToRgb),\n/* harmony export */   hslaToRgba: () => (/* binding */ hslaToRgba),\n/* harmony export */   rangeColorToHsl: () => (/* binding */ rangeColorToHsl),\n/* harmony export */   rangeColorToRgb: () => (/* binding */ rangeColorToRgb),\n/* harmony export */   rgbToHsl: () => (/* binding */ rgbToHsl),\n/* harmony export */   stringToAlpha: () => (/* binding */ stringToAlpha),\n/* harmony export */   stringToRgb: () => (/* binding */ stringToRgb),\n/* harmony export */   updateColor: () => (/* binding */ updateColor),\n/* harmony export */   updateColorValue: () => (/* binding */ updateColorValue)\n/* harmony export */ });\n/* harmony import */ var _MathUtils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./MathUtils.js */ \"../../engine/dist/browser/Utils/MathUtils.js\");\n/* harmony import */ var _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Core/Utils/Constants.js */ \"../../engine/dist/browser/Core/Utils/Constants.js\");\n/* harmony import */ var _TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./TypeUtils.js */ \"../../engine/dist/browser/Utils/TypeUtils.js\");\n/* harmony import */ var _Enums_Types_AlterType_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Enums/Types/AlterType.js */ \"../../engine/dist/browser/Enums/Types/AlterType.js\");\n/* harmony import */ var _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Enums/AnimationStatus.js */ \"../../engine/dist/browser/Enums/AnimationStatus.js\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n\n\n\n\n\n\nconst styleCache = new Map(), maxCacheSize = 1000, firstIndex = 0, rgbFixedPrecision = 2, hslFixedPrecision = 2;\nfunction getCachedStyle(key, generator) {\n    let cached = styleCache.get(key);\n    if (!cached) {\n        cached = generator();\n        if (styleCache.size >= maxCacheSize) {\n            const keysToDelete = [\n                ...styleCache.keys()\n            ].slice(firstIndex, maxCacheSize * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half);\n            keysToDelete.forEach((k)=>styleCache.delete(k));\n        }\n        styleCache.set(key, cached);\n    }\n    return cached;\n}\nfunction stringToRgba(engine, input) {\n    if (!input) {\n        return;\n    }\n    for (const manager of engine.colorManagers.values()){\n        if (manager.accepts(input)) {\n            return manager.parseString(input);\n        }\n    }\n    return undefined;\n}\nfunction rangeColorToRgb(engine, input, index, useIndex = true) {\n    if (!input) {\n        return;\n    }\n    const color = (0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(input) ? {\n        value: input\n    } : input;\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(color.value)) {\n        return colorToRgb(engine, color.value, index, useIndex);\n    }\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isArray)(color.value)) {\n        const value = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__.itemFromArray)(color.value, index, useIndex);\n        if (!value) {\n            return;\n        }\n        return rangeColorToRgb(engine, {\n            value\n        });\n    }\n    for (const manager of engine.colorManagers.values()){\n        const res = manager.handleRangeColor(color);\n        if (res) {\n            return res;\n        }\n    }\n    return undefined;\n}\nfunction colorToRgb(engine, input, index, useIndex = true) {\n    if (!input) {\n        return;\n    }\n    const color = (0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(input) ? {\n        value: input\n    } : input;\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(color.value)) {\n        return color.value === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue ? getRandomRgbColor() : stringToRgb(engine, color.value);\n    }\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isArray)(color.value)) {\n        const value = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__.itemFromArray)(color.value, index, useIndex);\n        if (!value) {\n            return;\n        }\n        return colorToRgb(engine, {\n            value\n        });\n    }\n    for (const manager of engine.colorManagers.values()){\n        const res = manager.handleColor(color);\n        if (res) {\n            return res;\n        }\n    }\n    return undefined;\n}\nfunction colorToHsl(engine, color, index, useIndex = true) {\n    const rgb = colorToRgb(engine, color, index, useIndex);\n    return rgb ? rgbToHsl(rgb) : undefined;\n}\nfunction rangeColorToHsl(engine, color, index, useIndex = true) {\n    const rgb = rangeColorToRgb(engine, color, index, useIndex);\n    return rgb ? rgbToHsl(rgb) : undefined;\n}\nfunction rgbToHsl(color) {\n    const r1 = color.r / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, g1 = color.g / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, b1 = color.b / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, max = Math.max(r1, g1, b1), min = Math.min(r1, g1, b1), res = {\n        h: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMin,\n        l: (max + min) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half,\n        s: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin\n    };\n    if (max !== min) {\n        res.s = res.l < _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half ? (max - min) / (max + min) : (max - min) / (_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double - max - min);\n        if (r1 === max) {\n            res.h = (g1 - b1) / (max - min);\n        } else if (g1 === max) {\n            res.h = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double + (b1 - r1) / (max - min);\n        } else {\n            res.h = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double + (r1 - g1) / (max - min);\n        }\n    }\n    res.l *= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax;\n    res.s *= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax;\n    res.h *= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hPhase;\n    if (res.h < _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMin) {\n        res.h += _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax;\n    }\n    if (res.h >= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax) {\n        res.h -= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax;\n    }\n    return res;\n}\nfunction stringToAlpha(engine, input) {\n    return stringToRgba(engine, input)?.a;\n}\nfunction stringToRgb(engine, input) {\n    return stringToRgba(engine, input);\n}\nfunction hslToRgb(hsl) {\n    const h = (hsl.h % _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax + _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax) % _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax, s = Math.max(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin, Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax, hsl.s)), l = Math.max(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMin, Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax, hsl.l)), hNormalized = h / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax, sNormalized = s / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax, lNormalized = l / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax;\n    if (s === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin) {\n        const grayscaleValue = Math.round(lNormalized * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax);\n        return {\n            r: grayscaleValue,\n            g: grayscaleValue,\n            b: grayscaleValue\n        };\n    }\n    const channel = (temp1, temp2, temp3)=>{\n        const temp3Min = 0, temp3Max = 1;\n        if (temp3 < temp3Min) {\n            temp3++;\n        }\n        if (temp3 > temp3Max) {\n            temp3--;\n        }\n        if (temp3 * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sextuple < temp3Max) {\n            return temp1 + (temp2 - temp1) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sextuple * temp3;\n        }\n        if (temp3 * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double < temp3Max) {\n            return temp2;\n        }\n        if (temp3 * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.triple < temp3Max * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double) {\n            const temp3Offset = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.triple;\n            return temp1 + (temp2 - temp1) * (temp3Offset - temp3) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sextuple;\n        }\n        return temp1;\n    }, temp1 = lNormalized < _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half ? lNormalized * (_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sNormalizedOffset + sNormalized) : lNormalized + sNormalized - lNormalized * sNormalized, temp2 = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double * lNormalized - temp1, phaseThird = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.phaseNumerator / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.triple, red = Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax * channel(temp2, temp1, hNormalized + phaseThird)), green = Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax * channel(temp2, temp1, hNormalized)), blue = Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax * channel(temp2, temp1, hNormalized - phaseThird));\n    return {\n        r: Math.round(red),\n        g: Math.round(green),\n        b: Math.round(blue)\n    };\n}\nfunction hslaToRgba(hsla) {\n    const rgbResult = hslToRgb(hsla);\n    return {\n        a: hsla.a,\n        b: rgbResult.b,\n        g: rgbResult.g,\n        r: rgbResult.r\n    };\n}\nfunction getRandomRgbColor(min) {\n    const fixedMin = min ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultRgbMin, fixedMax = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax + _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.identity, getRgbInRangeValue = ()=>Math.floor((0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRandomInRange)(fixedMin, fixedMax));\n    return {\n        b: getRgbInRangeValue(),\n        g: getRgbInRangeValue(),\n        r: getRgbInRangeValue()\n    };\n}\nfunction getStyleFromRgb(color, hdr, opacity) {\n    const op = opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity, key = `rgb-${color.r.toFixed(rgbFixedPrecision)}-${color.g.toFixed(rgbFixedPrecision)}-${color.b.toFixed(rgbFixedPrecision)}-${hdr ? \"hdr\" : \"sdr\"}-${op.toString()}`;\n    return getCachedStyle(key, ()=>hdr ? getHdrStyleFromRgb(color, opacity) : getSdrStyleFromRgb(color, opacity));\n}\nfunction getHdrStyleFromRgb(color, opacity) {\n    return `color(display-p3 ${(color.r / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax).toString()} ${(color.g / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax).toString()} ${(color.b / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax).toString()} / ${(opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity).toString()})`;\n}\nfunction getSdrStyleFromRgb(color, opacity) {\n    return `rgba(${color.r.toString()}, ${color.g.toString()}, ${color.b.toString()}, ${(opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity).toString()})`;\n}\nfunction getStyleFromHsl(color, hdr, opacity) {\n    const op = opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity, key = `hsl-${color.h.toFixed(hslFixedPrecision)}-${color.s.toFixed(hslFixedPrecision)}-${color.l.toFixed(hslFixedPrecision)}-${hdr ? \"hdr\" : \"sdr\"}-${op.toString()}`;\n    return getCachedStyle(key, ()=>hdr ? getHdrStyleFromHsl(color, opacity) : getSdrStyleFromHsl(color, opacity));\n}\nfunction getHdrStyleFromHsl(color, opacity) {\n    return getHdrStyleFromRgb(hslToRgb(color), opacity);\n}\nfunction getSdrStyleFromHsl(color, opacity) {\n    return `hsla(${color.h.toString()}, ${color.s.toString()}%, ${color.l.toString()}%, ${(opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity).toString()})`;\n}\nfunction colorMix(color1, color2, size1, size2) {\n    let rgb1 = color1, rgb2 = color2;\n    if (!(\"r\" in rgb1)) {\n        rgb1 = hslToRgb(color1);\n    }\n    if (!(\"r\" in rgb2)) {\n        rgb2 = hslToRgb(color2);\n    }\n    return {\n        b: (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.mix)(rgb1.b, rgb2.b, size1, size2),\n        g: (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.mix)(rgb1.g, rgb2.g, size1, size2),\n        r: (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.mix)(rgb1.r, rgb2.r, size1, size2)\n    };\n}\nfunction getLinkColor(p1, p2, linkColor) {\n    if (linkColor === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue) {\n        return getRandomRgbColor();\n    } else if (linkColor === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue) {\n        const sourceColor = p1.getFillColor() ?? p1.getStrokeColor(), destColor = p2?.getFillColor() ?? p2?.getStrokeColor();\n        if (sourceColor && destColor && p2) {\n            return colorMix(sourceColor, destColor, p1.getRadius(), p2.getRadius());\n        } else {\n            const hslColor = sourceColor ?? destColor;\n            if (hslColor) {\n                return hslToRgb(hslColor);\n            }\n        }\n    } else {\n        return linkColor;\n    }\n    return undefined;\n}\nfunction getLinkRandomColor(engine, optColor, blink, consent) {\n    const color = (0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(optColor) ? optColor : optColor.value;\n    if (color === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue) {\n        if (consent) {\n            return rangeColorToRgb(engine, {\n                value: color\n            });\n        }\n        if (blink) {\n            return _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue;\n        }\n        return _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue;\n    } else if (color === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue) {\n        return _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue;\n    } else {\n        return rangeColorToRgb(engine, {\n            value: color\n        });\n    }\n}\nfunction getHslFromAnimation(animation) {\n    return animation === undefined ? undefined : {\n        h: animation.h.value,\n        s: animation.s.value,\n        l: animation.l.value\n    };\n}\nfunction getHslAnimationFromHsl(hsl, animationOptions, reduceFactor) {\n    const resColor = {\n        h: {\n            enable: false,\n            value: hsl.h,\n            min: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMin,\n            max: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax\n        },\n        s: {\n            enable: false,\n            value: hsl.s,\n            min: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin,\n            max: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax\n        },\n        l: {\n            enable: false,\n            value: hsl.l,\n            min: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMin,\n            max: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax\n        }\n    };\n    if (animationOptions) {\n        setColorAnimation(resColor.h, animationOptions.h, reduceFactor);\n        setColorAnimation(resColor.s, animationOptions.s, reduceFactor);\n        setColorAnimation(resColor.l, animationOptions.l, reduceFactor);\n    }\n    return resColor;\n}\nfunction setColorAnimation(colorValue, colorAnimation, reduceFactor) {\n    colorValue.enable = colorAnimation.enable;\n    colorValue.min = colorAnimation.min;\n    colorValue.max = colorAnimation.max;\n    if (colorValue.enable) {\n        colorValue.velocity = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.speed) / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.percentDenominator * reduceFactor;\n        colorValue.decay = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.decayOffset - (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.decay);\n        colorValue.status = _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.increasing;\n        colorValue.loops = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultLoops;\n        colorValue.maxLoops = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.count);\n        colorValue.time = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultTime;\n        colorValue.delayTime = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.delay) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.millisecondsToSeconds;\n        if (!colorAnimation.sync) {\n            colorValue.velocity *= (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRandom)();\n            colorValue.value *= (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRandom)();\n        }\n        colorValue.initialValue = colorValue.value;\n        colorValue.offset = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.setRangeValue)(colorAnimation.offset);\n    } else {\n        colorValue.velocity = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultVelocity;\n    }\n}\nfunction updateColorValue(data, decrease, delta) {\n    const minLoops = 0, minDelay = 0, identity = 1, minVelocity = 0, minOffset = 0, velocityFactor = 3.6;\n    if (!data.enable || (data.maxLoops ?? minLoops) > minLoops && (data.loops ?? minLoops) > (data.maxLoops ?? minLoops)) {\n        return;\n    }\n    data.time ??= 0;\n    if ((data.delayTime ?? minDelay) > minDelay && data.time < (data.delayTime ?? minDelay)) {\n        data.time += delta.value;\n    }\n    if ((data.delayTime ?? minDelay) > minDelay && data.time < (data.delayTime ?? minDelay)) {\n        return;\n    }\n    const offset = data.offset ? (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.randomInRangeValue)(data.offset) : minOffset, velocity = (data.velocity ?? minVelocity) * delta.factor + offset * velocityFactor, decay = data.decay ?? identity, max = data.max, min = data.min;\n    if (!decrease || data.status === _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.increasing) {\n        data.value += velocity;\n        if (data.value > max) {\n            data.loops ??= 0;\n            data.loops++;\n            if (decrease) {\n                data.status = _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.decreasing;\n            } else {\n                data.value -= max;\n            }\n        }\n    } else {\n        data.value -= velocity;\n        if (data.value < min) {\n            data.loops ??= 0;\n            data.loops++;\n            data.status = _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.increasing;\n        }\n    }\n    if (data.velocity && decay !== identity) {\n        data.velocity *= decay;\n    }\n    data.value = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.clamp)(data.value, min, max);\n}\nfunction updateColor(color, delta) {\n    if (!color) {\n        return;\n    }\n    const { h, s, l } = color;\n    updateColorValue(h, false, delta);\n    updateColorValue(s, true, delta);\n    updateColorValue(l, true, delta);\n}\nfunction alterHsl(color, type, value) {\n    return {\n        h: color.h,\n        s: color.s,\n        l: color.l + (type === _Enums_Types_AlterType_js__WEBPACK_IMPORTED_MODULE_3__.AlterType.darken ? -_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lFactor : _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lFactor) * value\n    };\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/ColorUtils.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   alterHsl: () => (/* binding */ alterHsl),\n/* harmony export */   colorMix: () => (/* binding */ colorMix),\n/* harmony export */   colorToHsl: () => (/* binding */ colorToHsl),\n/* harmony export */   colorToRgb: () => (/* binding */ colorToRgb),\n/* harmony export */   getHslAnimationFromHsl: () => (/* binding */ getHslAnimationFromHsl),\n/* harmony export */   getHslFromAnimation: () => (/* binding */ getHslFromAnimation),\n/* harmony export */   getLinkColor: () => (/* binding */ getLinkColor),\n/* harmony export */   getLinkRandomColor: () => (/* binding */ getLinkRandomColor),\n/* harmony export */   getRandomRgbColor: () => (/* binding */ getRandomRgbColor),\n/* harmony export */   getStyleFromHsl: () => (/* binding */ getStyleFromHsl),\n/* harmony export */   getStyleFromRgb: () => (/* binding */ getStyleFromRgb),\n/* harmony export */   hslToRgb: () => (/* binding */ hslToRgb),\n/* harmony export */   hslaToRgba: () => (/* binding */ hslaToRgba),\n/* harmony export */   rangeColorToHsl: () => (/* binding */ rangeColorToHsl),\n/* harmony export */   rangeColorToRgb: () => (/* binding */ rangeColorToRgb),\n/* harmony export */   rgbToHsl: () => (/* binding */ rgbToHsl),\n/* harmony export */   stringToAlpha: () => (/* binding */ stringToAlpha),\n/* harmony export */   stringToRgb: () => (/* binding */ stringToRgb),\n/* harmony export */   updateColor: () => (/* binding */ updateColor),\n/* harmony export */   updateColorValue: () => (/* binding */ updateColorValue)\n/* harmony export */ });\n/* harmony import */ var _MathUtils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./MathUtils.js */ \"../../engine/dist/browser/Utils/MathUtils.js\");\n/* harmony import */ var _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Core/Utils/Constants.js */ \"../../engine/dist/browser/Core/Utils/Constants.js\");\n/* harmony import */ var _TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./TypeUtils.js */ \"../../engine/dist/browser/Utils/TypeUtils.js\");\n/* harmony import */ var _Enums_Types_AlterType_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Enums/Types/AlterType.js */ \"../../engine/dist/browser/Enums/Types/AlterType.js\");\n/* harmony import */ var _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Enums/AnimationStatus.js */ \"../../engine/dist/browser/Enums/AnimationStatus.js\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Utils.js */ \"../../engine/dist/browser/Utils/Utils.js\");\n\n\n\n\n\n\nconst styleCache = new Map(), maxCacheSize = 1000, firstIndex = 0, rgbFixedPrecision = 2, hslFixedPrecision = 2;\nfunction getCachedStyle(key, generator) {\n    let cached = styleCache.get(key);\n    if (!cached) {\n        cached = generator();\n        if (styleCache.size >= maxCacheSize) {\n            const keysToDelete = [\n                ...styleCache.keys()\n            ].slice(firstIndex, maxCacheSize * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half);\n            keysToDelete.forEach((k)=>styleCache.delete(k));\n        }\n        styleCache.set(key, cached);\n    }\n    return cached;\n}\nfunction stringToRgba(pluginManager, input) {\n    if (!input) {\n        return;\n    }\n    for (const manager of pluginManager.colorManagers.values()){\n        if (manager.accepts(input)) {\n            return manager.parseString(input);\n        }\n    }\n    return undefined;\n}\nfunction rangeColorToRgb(pluginManager, input, index, useIndex = true) {\n    if (!input) {\n        return;\n    }\n    const color = (0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(input) ? {\n        value: input\n    } : input;\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(color.value)) {\n        return colorToRgb(pluginManager, color.value, index, useIndex);\n    }\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isArray)(color.value)) {\n        const value = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__.itemFromArray)(color.value, index, useIndex);\n        if (!value) {\n            return;\n        }\n        return rangeColorToRgb(pluginManager, {\n            value\n        });\n    }\n    for (const manager of pluginManager.colorManagers.values()){\n        const res = manager.handleRangeColor(color);\n        if (res) {\n            return res;\n        }\n    }\n    return undefined;\n}\nfunction colorToRgb(pluginManager, input, index, useIndex = true) {\n    if (!input) {\n        return;\n    }\n    const color = (0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(input) ? {\n        value: input\n    } : input;\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(color.value)) {\n        return color.value === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue ? getRandomRgbColor() : stringToRgb(pluginManager, color.value);\n    }\n    if ((0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isArray)(color.value)) {\n        const value = (0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__.itemFromArray)(color.value, index, useIndex);\n        if (!value) {\n            return;\n        }\n        return colorToRgb(pluginManager, {\n            value\n        });\n    }\n    for (const manager of pluginManager.colorManagers.values()){\n        const res = manager.handleColor(color);\n        if (res) {\n            return res;\n        }\n    }\n    return undefined;\n}\nfunction colorToHsl(pluginManager, color, index, useIndex = true) {\n    const rgb = colorToRgb(pluginManager, color, index, useIndex);\n    return rgb ? rgbToHsl(rgb) : undefined;\n}\nfunction rangeColorToHsl(pluginManager, color, index, useIndex = true) {\n    const rgb = rangeColorToRgb(pluginManager, color, index, useIndex);\n    return rgb ? rgbToHsl(rgb) : undefined;\n}\nfunction rgbToHsl(color) {\n    const r1 = color.r / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, g1 = color.g / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, b1 = color.b / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, max = Math.max(r1, g1, b1), min = Math.min(r1, g1, b1), res = {\n        h: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMin,\n        l: (max + min) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half,\n        s: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin\n    };\n    if (max !== min) {\n        res.s = res.l < _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half ? (max - min) / (max + min) : (max - min) / (_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double - max - min);\n        if (r1 === max) {\n            res.h = (g1 - b1) / (max - min);\n        } else if (g1 === max) {\n            res.h = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double + (b1 - r1) / (max - min);\n        } else {\n            res.h = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double + (r1 - g1) / (max - min);\n        }\n    }\n    res.l *= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax;\n    res.s *= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax;\n    res.h *= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hPhase;\n    if (res.h < _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMin) {\n        res.h += _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax;\n    }\n    if (res.h >= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax) {\n        res.h -= _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax;\n    }\n    return res;\n}\nfunction stringToAlpha(pluginManager, input) {\n    return stringToRgba(pluginManager, input)?.a;\n}\nfunction stringToRgb(pluginManager, input) {\n    return stringToRgba(pluginManager, input);\n}\nfunction hslToRgb(hsl) {\n    const h = (hsl.h % _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax + _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax) % _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax, s = Math.max(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin, Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax, hsl.s)), l = Math.max(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMin, Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax, hsl.l)), hNormalized = h / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax, sNormalized = s / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax, lNormalized = l / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax;\n    if (s === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin) {\n        const grayscaleValue = Math.round(lNormalized * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax);\n        return {\n            r: grayscaleValue,\n            g: grayscaleValue,\n            b: grayscaleValue\n        };\n    }\n    const channel = (temp1, temp2, temp3)=>{\n        const temp3Min = 0, temp3Max = 1;\n        if (temp3 < temp3Min) {\n            temp3++;\n        }\n        if (temp3 > temp3Max) {\n            temp3--;\n        }\n        if (temp3 * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sextuple < temp3Max) {\n            return temp1 + (temp2 - temp1) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sextuple * temp3;\n        }\n        if (temp3 * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double < temp3Max) {\n            return temp2;\n        }\n        if (temp3 * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.triple < temp3Max * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double) {\n            const temp3Offset = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.triple;\n            return temp1 + (temp2 - temp1) * (temp3Offset - temp3) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sextuple;\n        }\n        return temp1;\n    }, temp1 = lNormalized < _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.half ? lNormalized * (_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sNormalizedOffset + sNormalized) : lNormalized + sNormalized - lNormalized * sNormalized, temp2 = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.double * lNormalized - temp1, phaseThird = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.phaseNumerator / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.triple, red = Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax * channel(temp2, temp1, hNormalized + phaseThird)), green = Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax * channel(temp2, temp1, hNormalized)), blue = Math.min(_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax, _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax * channel(temp2, temp1, hNormalized - phaseThird));\n    return {\n        r: Math.round(red),\n        g: Math.round(green),\n        b: Math.round(blue)\n    };\n}\nfunction hslaToRgba(hsla) {\n    const rgbResult = hslToRgb(hsla);\n    return {\n        a: hsla.a,\n        b: rgbResult.b,\n        g: rgbResult.g,\n        r: rgbResult.r\n    };\n}\nfunction getRandomRgbColor(min) {\n    const fixedMin = min ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultRgbMin, fixedMax = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax + _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.identity, getRgbInRangeValue = ()=>Math.floor((0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRandomInRange)(fixedMin, fixedMax));\n    return {\n        b: getRgbInRangeValue(),\n        g: getRgbInRangeValue(),\n        r: getRgbInRangeValue()\n    };\n}\nfunction getStyleFromRgb(color, hdr, opacity) {\n    const op = opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity, key = `rgb-${color.r.toFixed(rgbFixedPrecision)}-${color.g.toFixed(rgbFixedPrecision)}-${color.b.toFixed(rgbFixedPrecision)}-${hdr ? \"hdr\" : \"sdr\"}-${op.toString()}`;\n    return getCachedStyle(key, ()=>hdr ? getHdrStyleFromRgb(color, opacity) : getSdrStyleFromRgb(color, opacity));\n}\nfunction getHdrStyleFromRgb(color, opacity) {\n    return `color(display-p3 ${(color.r / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax).toString()} ${(color.g / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax).toString()} ${(color.b / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.rgbMax).toString()} / ${(opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity).toString()})`;\n}\nfunction getSdrStyleFromRgb(color, opacity) {\n    return `rgba(${color.r.toString()}, ${color.g.toString()}, ${color.b.toString()}, ${(opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity).toString()})`;\n}\nfunction getStyleFromHsl(color, hdr, opacity) {\n    const op = opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity, key = `hsl-${color.h.toFixed(hslFixedPrecision)}-${color.s.toFixed(hslFixedPrecision)}-${color.l.toFixed(hslFixedPrecision)}-${hdr ? \"hdr\" : \"sdr\"}-${op.toString()}`;\n    return getCachedStyle(key, ()=>hdr ? getHdrStyleFromHsl(color, opacity) : getSdrStyleFromHsl(color, opacity));\n}\nfunction getHdrStyleFromHsl(color, opacity) {\n    return getHdrStyleFromRgb(hslToRgb(color), opacity);\n}\nfunction getSdrStyleFromHsl(color, opacity) {\n    return `hsla(${color.h.toString()}, ${color.s.toString()}%, ${color.l.toString()}%, ${(opacity ?? _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultOpacity).toString()})`;\n}\nfunction colorMix(color1, color2, size1, size2) {\n    let rgb1 = color1, rgb2 = color2;\n    if (!(\"r\" in rgb1)) {\n        rgb1 = hslToRgb(color1);\n    }\n    if (!(\"r\" in rgb2)) {\n        rgb2 = hslToRgb(color2);\n    }\n    return {\n        b: (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.mix)(rgb1.b, rgb2.b, size1, size2),\n        g: (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.mix)(rgb1.g, rgb2.g, size1, size2),\n        r: (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.mix)(rgb1.r, rgb2.r, size1, size2)\n    };\n}\nfunction getLinkColor(p1, p2, linkColor) {\n    if (linkColor === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue) {\n        return getRandomRgbColor();\n    } else if (linkColor === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue) {\n        const sourceColor = p1.getFillColor() ?? p1.getStrokeColor(), destColor = p2?.getFillColor() ?? p2?.getStrokeColor();\n        if (sourceColor && destColor && p2) {\n            return colorMix(sourceColor, destColor, p1.getRadius(), p2.getRadius());\n        } else {\n            const hslColor = sourceColor ?? destColor;\n            if (hslColor) {\n                return hslToRgb(hslColor);\n            }\n        }\n    } else {\n        return linkColor;\n    }\n    return undefined;\n}\nfunction getLinkRandomColor(pluginManager, optColor, blink, consent) {\n    const color = (0,_TypeUtils_js__WEBPACK_IMPORTED_MODULE_2__.isString)(optColor) ? optColor : optColor.value;\n    if (color === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue) {\n        if (consent) {\n            return rangeColorToRgb(pluginManager, {\n                value: color\n            });\n        }\n        if (blink) {\n            return _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.randomColorValue;\n        }\n        return _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue;\n    } else if (color === _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue) {\n        return _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.midColorValue;\n    } else {\n        return rangeColorToRgb(pluginManager, {\n            value: color\n        });\n    }\n}\nfunction getHslFromAnimation(animation) {\n    return animation === undefined ? undefined : {\n        h: animation.h.value,\n        s: animation.s.value,\n        l: animation.l.value\n    };\n}\nfunction getHslAnimationFromHsl(hsl, animationOptions, reduceFactor) {\n    const resColor = {\n        h: {\n            enable: false,\n            value: hsl.h,\n            min: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMin,\n            max: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.hMax\n        },\n        s: {\n            enable: false,\n            value: hsl.s,\n            min: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMin,\n            max: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.sMax\n        },\n        l: {\n            enable: false,\n            value: hsl.l,\n            min: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMin,\n            max: _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lMax\n        }\n    };\n    if (animationOptions) {\n        setColorAnimation(resColor.h, animationOptions.h, reduceFactor);\n        setColorAnimation(resColor.s, animationOptions.s, reduceFactor);\n        setColorAnimation(resColor.l, animationOptions.l, reduceFactor);\n    }\n    return resColor;\n}\nfunction setColorAnimation(colorValue, colorAnimation, reduceFactor) {\n    colorValue.enable = colorAnimation.enable;\n    colorValue.min = colorAnimation.min;\n    colorValue.max = colorAnimation.max;\n    if (colorValue.enable) {\n        colorValue.velocity = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.speed) / _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.percentDenominator * reduceFactor;\n        colorValue.decay = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.decayOffset - (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.decay);\n        colorValue.status = _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.increasing;\n        colorValue.loops = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultLoops;\n        colorValue.maxLoops = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.count);\n        colorValue.time = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultTime;\n        colorValue.delayTime = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(colorAnimation.delay) * _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.millisecondsToSeconds;\n        if (!colorAnimation.sync) {\n            colorValue.velocity *= (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRandom)();\n            colorValue.value *= (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.getRandom)();\n        }\n        colorValue.initialValue = colorValue.value;\n        colorValue.offset = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.setRangeValue)(colorAnimation.offset);\n    } else {\n        colorValue.velocity = _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.defaultVelocity;\n    }\n}\nfunction updateColorValue(data, decrease, delta) {\n    const minLoops = 0, minDelay = 0, identity = 1, minVelocity = 0, minOffset = 0, velocityFactor = 3.6;\n    if (!data.enable || (data.maxLoops ?? minLoops) > minLoops && (data.loops ?? minLoops) > (data.maxLoops ?? minLoops)) {\n        return;\n    }\n    data.time ??= 0;\n    if ((data.delayTime ?? minDelay) > minDelay && data.time < (data.delayTime ?? minDelay)) {\n        data.time += delta.value;\n    }\n    if ((data.delayTime ?? minDelay) > minDelay && data.time < (data.delayTime ?? minDelay)) {\n        return;\n    }\n    const offset = data.offset ? (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.randomInRangeValue)(data.offset) : minOffset, velocity = (data.velocity ?? minVelocity) * delta.factor + offset * velocityFactor, decay = data.decay ?? identity, max = data.max, min = data.min;\n    if (!decrease || data.status === _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.increasing) {\n        data.value += velocity;\n        if (data.value > max) {\n            data.loops ??= 0;\n            data.loops++;\n            if (decrease) {\n                data.status = _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.decreasing;\n            } else {\n                data.value -= max;\n            }\n        }\n    } else {\n        data.value -= velocity;\n        if (data.value < min) {\n            data.loops ??= 0;\n            data.loops++;\n            data.status = _Enums_AnimationStatus_js__WEBPACK_IMPORTED_MODULE_4__.AnimationStatus.increasing;\n        }\n    }\n    if (data.velocity && decay !== identity) {\n        data.velocity *= decay;\n    }\n    data.value = (0,_MathUtils_js__WEBPACK_IMPORTED_MODULE_0__.clamp)(data.value, min, max);\n}\nfunction updateColor(color, delta) {\n    if (!color) {\n        return;\n    }\n    const { h, s, l } = color;\n    updateColorValue(h, false, delta);\n    updateColorValue(s, true, delta);\n    updateColorValue(l, true, delta);\n}\nfunction alterHsl(color, type, value) {\n    return {\n        h: color.h,\n        s: color.s,\n        l: color.l + (type === _Enums_Types_AlterType_js__WEBPACK_IMPORTED_MODULE_3__.AlterType.darken ? -_Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lFactor : _Core_Utils_Constants_js__WEBPACK_IMPORTED_MODULE_1__.lFactor) * value\n    };\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/ColorUtils.js?\n}");
 
 /***/ },
 
@@ -584,7 +594,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 */   getLogger: () => (/* binding */ getLogger),\n/* harmony export */   setLogger: () => (/* binding */ setLogger)\n/* harmony export */ });\nconst errorPrefix = \"tsParticles - Error\";\nconst _logger = {\n    debug: console.debug,\n    error: (message, optionalParams)=>{\n        console.error(`${errorPrefix} - ${message}`, optionalParams);\n    },\n    info: console.info,\n    log: console.log,\n    verbose: console.log,\n    warning: console.warn\n};\nfunction setLogger(logger) {\n    _logger.debug = logger.debug;\n    _logger.error = logger.error;\n    _logger.info = logger.info;\n    _logger.log = logger.log;\n    _logger.verbose = logger.verbose;\n    _logger.warning = logger.warning;\n}\nfunction getLogger() {\n    return _logger;\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/LogUtils.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   getLogger: () => (/* binding */ getLogger),\n/* harmony export */   setLogger: () => (/* binding */ setLogger)\n/* harmony export */ });\nconst errorPrefix = \"tsParticles - Error\";\nconst _logger = {\n    debug: console.debug,\n    error: (message, optionalParams)=>{\n        console.error(`${errorPrefix} - ${message}`, optionalParams);\n    },\n    info: console.info,\n    log: console.log,\n    trace: console.trace,\n    verbose: console.log,\n    warning: console.warn\n};\nfunction setLogger(logger) {\n    _logger.debug = logger.debug;\n    _logger.error = logger.error;\n    _logger.info = logger.info;\n    _logger.log = logger.log;\n    _logger.verbose = logger.verbose;\n    _logger.warning = logger.warning;\n}\nfunction getLogger() {\n    return _logger;\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/LogUtils.js?\n}");
 
 /***/ },
 
@@ -604,7 +614,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 */   loadOptions: () => (/* binding */ loadOptions),\n/* harmony export */   loadParticlesOptions: () => (/* binding */ loadParticlesOptions)\n/* harmony export */ });\n/* harmony import */ var _Options_Classes_Particles_ParticlesOptions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Options/Classes/Particles/ParticlesOptions.js */ \"../../engine/dist/browser/Options/Classes/Particles/ParticlesOptions.js\");\n\nfunction loadOptions(options, ...sourceOptionsArr) {\n    for (const sourceOptions of sourceOptionsArr){\n        options.load(sourceOptions);\n    }\n}\nfunction loadParticlesOptions(engine, container, ...sourceOptionsArr) {\n    const options = new _Options_Classes_Particles_ParticlesOptions_js__WEBPACK_IMPORTED_MODULE_0__.ParticlesOptions(engine, container);\n    loadOptions(options, ...sourceOptionsArr);\n    return options;\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/OptionsUtils.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   loadOptions: () => (/* binding */ loadOptions),\n/* harmony export */   loadParticlesOptions: () => (/* binding */ loadParticlesOptions)\n/* harmony export */ });\n/* harmony import */ var _Options_Classes_Particles_ParticlesOptions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../Options/Classes/Particles/ParticlesOptions.js */ \"../../engine/dist/browser/Options/Classes/Particles/ParticlesOptions.js\");\n\nfunction loadOptions(options, ...sourceOptionsArr) {\n    for (const sourceOptions of sourceOptionsArr){\n        options.load(sourceOptions);\n    }\n}\nfunction loadParticlesOptions(pluginManager, container, ...sourceOptionsArr) {\n    const options = new _Options_Classes_Particles_ParticlesOptions_js__WEBPACK_IMPORTED_MODULE_0__.ParticlesOptions(pluginManager, container);\n    loadOptions(options, ...sourceOptionsArr);\n    return options;\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/../../engine/dist/browser/Utils/OptionsUtils.js?\n}");
 
 /***/ },
 
@@ -674,7 +684,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 */   loadBasic: () => (/* binding */ loadBasic)\n/* harmony export */ });\nasync function loadBasic(engine) {\n    engine.checkVersion(\"4.0.0-beta.0\");\n    await engine.register(async (e)=>{\n        const [{ loadHexColorPlugin }, { loadHslColorPlugin }, { loadRgbColorPlugin }, { loadMovePlugin }, { loadCircleShape }, { loadFillColorUpdater }, { loadOpacityUpdater }, { loadOutModesUpdater }, { loadSizeUpdater }] = await Promise.all([\n            __webpack_require__.e(/*! import() */ \"plugins_colors_hex_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-hex-color */ \"../../plugins/colors/hex/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"plugins_colors_hsl_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-hsl-color */ \"../../plugins/colors/hsl/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"plugins_colors_rgb_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-rgb-color */ \"../../plugins/colors/rgb/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"plugins_move_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-move */ \"../../plugins/move/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"shapes_circle_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/shape-circle */ \"../../shapes/circle/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_fillColor_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-fill-color */ \"../../updaters/fillColor/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_opacity_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-opacity */ \"../../updaters/opacity/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_outModes_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-out-modes */ \"../../updaters/outModes/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_size_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-size */ \"../../updaters/size/dist/browser/index.js\"))\n        ]);\n        await Promise.all([\n            loadHexColorPlugin(e),\n            loadHslColorPlugin(e),\n            loadRgbColorPlugin(e),\n            loadMovePlugin(e),\n            loadCircleShape(e),\n            loadFillColorUpdater(e),\n            loadOpacityUpdater(e),\n            loadOutModesUpdater(e),\n            loadSizeUpdater(e)\n        ]);\n    });\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/./dist/browser/index.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   loadBasic: () => (/* binding */ loadBasic)\n/* harmony export */ });\nasync function loadBasic(engine) {\n    engine.checkVersion(\"4.0.0-beta.1\");\n    await engine.pluginManager.register(async (e)=>{\n        const [{ loadHexColorPlugin }, { loadHslColorPlugin }, { loadRgbColorPlugin }, { loadMovePlugin }, { loadCircleShape }, { loadFillColorUpdater }, { loadOpacityUpdater }, { loadOutModesUpdater }, { loadSizeUpdater }] = await Promise.all([\n            __webpack_require__.e(/*! import() */ \"plugins_colors_hex_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-hex-color */ \"../../plugins/colors/hex/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"plugins_colors_hsl_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-hsl-color */ \"../../plugins/colors/hsl/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"plugins_colors_rgb_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-rgb-color */ \"../../plugins/colors/rgb/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"plugins_move_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/plugin-move */ \"../../plugins/move/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"shapes_circle_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/shape-circle */ \"../../shapes/circle/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_fillColor_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-fill-color */ \"../../updaters/fillColor/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_opacity_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-opacity */ \"../../updaters/opacity/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_outModes_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-out-modes */ \"../../updaters/outModes/dist/browser/index.js\")),\n            __webpack_require__.e(/*! import() */ \"updaters_size_dist_browser_index_js\").then(__webpack_require__.bind(__webpack_require__, /*! @tsparticles/updater-size */ \"../../updaters/size/dist/browser/index.js\"))\n        ]);\n        await Promise.all([\n            loadHexColorPlugin(e),\n            loadHslColorPlugin(e),\n            loadRgbColorPlugin(e),\n            loadMovePlugin(e),\n            loadCircleShape(e),\n            loadFillColorUpdater(e),\n            loadOpacityUpdater(e),\n            loadOutModesUpdater(e),\n            loadSizeUpdater(e)\n        ]);\n    });\n}\n\n\n//# sourceURL=webpack://@tsparticles/basic/./dist/browser/index.js?\n}");
 
 /***/ }