@tsparticles/engine 3.6.0 → 3.7.1

package/cjs/Utils/ColorUtils.js

@@ -1,6 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addColorManager = addColorManager;
 exports.rangeColorToRgb = rangeColorToRgb;
 exports.colorToRgb = colorToRgb;
 exports.colorToHsl = colorToHsl;
@@ -25,83 +24,63 @@ const TypeUtils_js_1 = require("./TypeUtils.js");
 const Constants_js_1 = require("../Core/Utils/Constants.js");
 const AnimationStatus_js_1 = require("../Enums/AnimationStatus.js");
 const Utils_js_1 = require("./Utils.js");
-var RgbIndexes;
-(function (RgbIndexes) {
-    RgbIndexes[RgbIndexes["r"] = 1] = "r";
-    RgbIndexes[RgbIndexes["g"] = 2] = "g";
-    RgbIndexes[RgbIndexes["b"] = 3] = "b";
-    RgbIndexes[RgbIndexes["a"] = 4] = "a";
-})(RgbIndexes || (RgbIndexes = {}));
-const randomColorValue = "random", midColorValue = "mid", colorManagers = new Map();
-function addColorManager(manager) {
-    colorManagers.set(manager.key, manager);
-}
-function stringToRgba(input) {
-    for (const manager of colorManagers.values()) {
+const randomColorValue = "random", midColorValue = "mid";
+function stringToRgba(engine, input) {
+    if (!input) {
+        return;
+    }
+    for (const manager of engine.colorManagers.values()) {
         if (input.startsWith(manager.stringPrefix)) {
             return manager.parseString(input);
         }
     }
-    const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i, hexFixed = input.replace(shorthandRegex, (_, r, g, b, a) => {
-        return r + r + g + g + b + b + (a !== undefined ? a + a : "");
-    }), regex = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i, result = regex.exec(hexFixed), radix = 16, defaultAlpha = 1, alphaFactor = 0xff;
-    return result
-        ? {
-            a: result[RgbIndexes.a] !== undefined
-                ? parseInt(result[RgbIndexes.a], radix) / alphaFactor
-                : defaultAlpha,
-            b: parseInt(result[RgbIndexes.b], radix),
-            g: parseInt(result[RgbIndexes.g], radix),
-            r: parseInt(result[RgbIndexes.r], radix),
-        }
-        : undefined;
 }
-function rangeColorToRgb(input, index, useIndex = true) {
+function rangeColorToRgb(engine, input, index, useIndex = true) {
     if (!input) {
         return;
     }
     const color = (0, TypeUtils_js_1.isString)(input) ? { value: input } : input;
     if ((0, TypeUtils_js_1.isString)(color.value)) {
-        return colorToRgb(color.value, index, useIndex);
+        return colorToRgb(engine, color.value, index, useIndex);
     }
     if ((0, TypeUtils_js_1.isArray)(color.value)) {
-        return rangeColorToRgb({
+        return rangeColorToRgb(engine, {
             value: (0, Utils_js_1.itemFromArray)(color.value, index, useIndex),
         });
     }
-    for (const manager of colorManagers.values()) {
+    for (const manager of engine.colorManagers.values()) {
         const res = manager.handleRangeColor(color);
         if (res) {
             return res;
         }
     }
 }
-function colorToRgb(input, index, useIndex = true) {
+function colorToRgb(engine, input, index, useIndex = true) {
     if (!input) {
         return;
     }
     const color = (0, TypeUtils_js_1.isString)(input) ? { value: input } : input;
     if ((0, TypeUtils_js_1.isString)(color.value)) {
-        return color.value === randomColorValue ? getRandomRgbColor() : stringToRgb(color.value);
+        return color.value === randomColorValue ? getRandomRgbColor() : stringToRgb(engine, color.value);
     }
     if ((0, TypeUtils_js_1.isArray)(color.value)) {
-        return colorToRgb({
+        return colorToRgb(engine, {
             value: (0, Utils_js_1.itemFromArray)(color.value, index, useIndex),
         });
     }
-    for (const manager of colorManagers.values()) {
+    for (const manager of engine.colorManagers.values()) {
         const res = manager.handleColor(color);
         if (res) {
             return res;
         }
     }
 }
-function colorToHsl(color, index, useIndex = true) {
-    const rgb = colorToRgb(color, index, useIndex);
+function colorToHsl(engine, color, index, useIndex = true) {
+    const rgb = colorToRgb(engine, color, index, useIndex);
     return rgb ? rgbToHsl(rgb) : undefined;
 }
-function rangeColorToHsl(color, index, useIndex = true) {
-    const rgb = rangeColorToRgb(color, index, useIndex);
+function rangeColorToHsl(engine, color, index, useIndex = true) {
+    const rgb = rangeColorToRgb(engine, color, index, useIndex);
     return rgb ? rgbToHsl(rgb) : undefined;
 }
 function rgbToHsl(color) {
@@ -128,11 +107,11 @@ function rgbToHsl(color) {
     }
     return res;
 }
-function stringToAlpha(input) {
-    return stringToRgba(input)?.a;
+function stringToAlpha(engine, input) {
+    return stringToRgba(engine, input)?.a;
 }
-function stringToRgb(input) {
-    return stringToRgba(input);
+function stringToRgb(engine, input) {
+    return stringToRgba(engine, input);
 }
 function hslToRgb(hsl) {
     const hMax = 360, sMax = 100, lMax = 100, sMin = 0, lMin = 0, h = ((hsl.h % hMax) + hMax) % hMax, s = Math.max(sMin, Math.min(sMax, hsl.s)), l = Math.max(lMin, Math.min(lMax, hsl.l)), hNormalized = h / hMax, sNormalized = s / sMax, lNormalized = l / lMax, rgbFactor = 255, triple = 3;
@@ -223,11 +202,11 @@ function getLinkColor(p1, p2, linkColor) {
         return linkColor;
     }
 }
-function getLinkRandomColor(optColor, blink, consent) {
+function getLinkRandomColor(engine, optColor, blink, consent) {
     const color = (0, TypeUtils_js_1.isString)(optColor) ? optColor : optColor.value;
     if (color === randomColorValue) {
         if (consent) {
-            return rangeColorToRgb({
+            return rangeColorToRgb(engine, {
                 value: color,
             });
         }
@@ -240,7 +219,7 @@ function getLinkRandomColor(optColor, blink, consent) {
         return midColorValue;
     }
     else {
-        return rangeColorToRgb({
+        return rangeColorToRgb(engine, {
             value: color,
         });
     }

package/cjs/Utils/NumberUtils.js

@@ -1,7 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addEasing = addEasing;
-exports.getEasing = getEasing;
 exports.setRandom = setRandom;
 exports.getRandom = getRandom;
 exports.setAnimationFunctions = setAnimationFunctions;
@@ -34,16 +32,7 @@ let _random = Math.random;
 const _animationLoop = {
     nextFrame: (cb) => requestAnimationFrame(cb),
     cancel: (idx) => cancelAnimationFrame(idx),
-}, easingFunctions = new Map(), double = 2, doublePI = Math.PI * double;
-function addEasing(name, easing) {
-    if (easingFunctions.get(name)) {
-        return;
-    }
-    easingFunctions.set(name, easing);
-}
-function getEasing(name) {
-    return easingFunctions.get(name) ?? ((value) => value);
-}
+}, double = 2, doublePI = Math.PI * double;
 function setRandom(rnd = Math.random) {
     _random = rnd;
 }

package/cjs/Utils/Utils.js

@@ -29,6 +29,7 @@ exports.initParticleNumericAnimationValue = initParticleNumericAnimationValue;
 exports.getPosition = getPosition;
 exports.getSize = getSize;
 exports.updateAnimation = updateAnimation;
+exports.assertValidVersion = assertValidVersion;
 const NumberUtils_js_1 = require("./NumberUtils.js");
 const Constants_js_1 = require("../Core/Utils/Constants.js");
 const TypeUtils_js_1 = require("./TypeUtils.js");
@@ -445,3 +446,9 @@ function updateAnimation(particle, data, changeDirection, destroyType, delta) {
         data.value = (0, NumberUtils_js_1.clamp)(data.value, minValue, maxValue);
     }
 }
+function assertValidVersion(engine, pluginVersion) {
+    if (engine.version === pluginVersion) {
+        return;
+    }
+    throw new Error(`The tsParticles version is different from the loaded plugins version. Engine version: ${engine.version}. Plugins version: ${pluginVersion}`);
+}

package/cjs/exports.js

@@ -94,9 +94,7 @@ __exportStar(require("./Options/Classes/Theme/ThemeDefault.js"), exports);
 __exportStar(require("./Options/Classes/ValueWithRandom.js"), exports);
 __exportStar(require("./Utils/CanvasUtils.js"), exports);
 __exportStar(require("./Utils/ColorUtils.js"), exports);
-__exportStar(require("./Utils/HslColorManager.js"), exports);
 __exportStar(require("./Utils/NumberUtils.js"), exports);
 __exportStar(require("./Utils/OptionsUtils.js"), exports);
-__exportStar(require("./Utils/RgbColorManager.js"), exports);
 __exportStar(require("./Utils/Utils.js"), exports);
 __exportStar(require("./Utils/TypeUtils.js"), exports);

package/cjs/init.js

@@ -2,13 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.init = init;
 const Engine_js_1 = require("./Core/Engine.js");
-const HslColorManager_js_1 = require("./Utils/HslColorManager.js");
-const RgbColorManager_js_1 = require("./Utils/RgbColorManager.js");
-const ColorUtils_js_1 = require("./Utils/ColorUtils.js");
 function init() {
-    const rgbColorManager = new RgbColorManager_js_1.RgbColorManager(), hslColorManager = new HslColorManager_js_1.HslColorManager();
-    (0, ColorUtils_js_1.addColorManager)(rgbColorManager);
-    (0, ColorUtils_js_1.addColorManager)(hslColorManager);
     const engine = new Engine_js_1.Engine();
     engine.init();
     return engine;

package/esm/Core/Canvas.js

@@ -26,7 +26,7 @@ function setStyle(canvas, style, important = false) {
     }
 }
 export class Canvas {
-    constructor(container) {
+    constructor(container, engine) {
         this.container = container;
         this._applyPostDrawUpdaters = particle => {
             for (const updater of this._postDrawUpdaters) {
@@ -62,10 +62,10 @@ export class Canvas {
             let fColor, sColor;
             for (const plugin of this._colorPlugins) {
                 if (!fColor && plugin.particleFillColor) {
-                    fColor = rangeColorToHsl(plugin.particleFillColor(particle));
+                    fColor = rangeColorToHsl(this._engine, plugin.particleFillColor(particle));
                 }
                 if (!sColor && plugin.particleStrokeColor) {
-                    sColor = rangeColorToHsl(plugin.particleStrokeColor(particle));
+                    sColor = rangeColorToHsl(this._engine, plugin.particleStrokeColor(particle));
                 }
                 if (fColor && sColor) {
                     break;
@@ -76,7 +76,7 @@ export class Canvas {
         this._initCover = async () => {
             const options = this.container.actualOptions, cover = options.backgroundMask.cover, color = cover.color;
             if (color) {
-                const coverRgb = rangeColorToRgb(color);
+                const coverRgb = rangeColorToRgb(this._engine, color);
                 if (coverRgb) {
                     const coverColor = {
                         ...coverRgb,
@@ -135,7 +135,7 @@ export class Canvas {
             }
             const factorNumerator = 1, opacity = factorNumerator / trail.length;
             if (trailFill.color) {
-                const fillColor = rangeColorToRgb(trailFill.color);
+                const fillColor = rangeColorToRgb(this._engine, trailFill.color);
                 if (!fillColor) {
                     return;
                 }
@@ -216,10 +216,16 @@ export class Canvas {
                 height: "100%",
             }, true);
         };
-        this.size = {
+        this._engine = engine;
+        this._standardSize = {
             height: 0,
             width: 0,
         };
+        const pxRatio = container.retina.pixelRatio, stdSize = this._standardSize;
+        this.size = {
+            height: stdSize.height * pxRatio,
+            width: stdSize.width * pxRatio,
+        };
         this._context = null;
         this._generated = false;
         this._preDrawUpdaters = [];
@@ -363,7 +369,7 @@ export class Canvas {
             return;
         }
         if (background.color) {
-            const color = rangeColorToRgb(background.color);
+            const color = rangeColorToRgb(this._engine, background.color);
             elementStyle.backgroundColor = color ? getStyleFromRgb(color, background.opacity) : "";
         }
         else {
@@ -408,8 +414,12 @@ export class Canvas {
         this.element = canvas;
         this.element.ariaHidden = "true";
         this._originalStyle = deepExtend({}, this.element.style);
-        this.size.height = canvas.offsetHeight;
-        this.size.width = canvas.offsetWidth;
+        const standardSize = this._standardSize;
+        standardSize.height = canvas.offsetHeight;
+        standardSize.width = canvas.offsetWidth;
+        const pxRatio = this.container.retina.pixelRatio, retinaSize = this.size;
+        canvas.height = retinaSize.height = standardSize.height * pxRatio;
+        canvas.width = retinaSize.width = standardSize.width * pxRatio;
         this._context = this.element.getContext("2d");
         this._safeMutationObserver(obs => {
             if (!this.element || !(this.element instanceof Node)) {
@@ -444,23 +454,29 @@ export class Canvas {
         if (!this.element) {
             return false;
         }
-        const container = this.container, pxRatio = container.retina.pixelRatio, size = container.canvas.size, newSize = {
-            width: this.element.offsetWidth * pxRatio,
-            height: this.element.offsetHeight * pxRatio,
+        const container = this.container, currentSize = container.canvas._standardSize, newSize = {
+            width: this.element.offsetWidth,
+            height: this.element.offsetHeight,
+        }, pxRatio = container.retina.pixelRatio, retinaSize = {
+            width: newSize.width * pxRatio,
+            height: newSize.height * pxRatio,
         };
-        if (newSize.height === size.height &&
-            newSize.width === size.width &&
-            newSize.height === this.element.height &&
-            newSize.width === this.element.width) {
+        if (newSize.height === currentSize.height &&
+            newSize.width === currentSize.width &&
+            retinaSize.height === this.element.height &&
+            retinaSize.width === this.element.width) {
             return false;
         }
-        const oldSize = { ...size };
-        this.element.width = size.width = this.element.offsetWidth * pxRatio;
-        this.element.height = size.height = this.element.offsetHeight * pxRatio;
+        const oldSize = { ...currentSize };
+        currentSize.height = newSize.height;
+        currentSize.width = newSize.width;
+        const canvasSize = this.size;
+        this.element.width = canvasSize.width = retinaSize.width;
+        this.element.height = canvasSize.height = retinaSize.height;
         if (this.container.started) {
             container.particles.setResizeFactor({
-                width: size.width / oldSize.width,
-                height: size.height / oldSize.height,
+                width: currentSize.width / oldSize.width,
+                height: currentSize.height / oldSize.height,
             });
         }
         return true;

package/esm/Core/Container.js

@@ -88,7 +88,7 @@ export class Container {
         this._sourceOptions = sourceOptions;
         this._initialSourceOptions = sourceOptions;
         this.retina = new Retina(this);
-        this.canvas = new Canvas(this);
+        this.canvas = new Canvas(this, this._engine);
         this.particles = new Particles(this._engine, this);
         this.pathGenerators = new Map();
         this.interactivity = {

package/esm/Core/Engine.js

@@ -71,6 +71,8 @@ export class Engine {
         this._eventDispatcher = new EventDispatcher();
         this._initialized = false;
         this.plugins = [];
+        this.colorManagers = new Map();
+        this.easingFunctions = new Map();
         this._initializers = {
             interactors: new Map(),
             movers: new Map(),
@@ -95,13 +97,24 @@ export class Engine {
         return this._domArray;
     }
     get version() {
-        return "3.6.0";
+        return "3.7.1";
+    }
+    async addColorManager(manager, refresh = true) {
+        this.colorManagers.set(manager.key, manager);
+        await this.refresh(refresh);
     }
     addConfig(config) {
         const key = config.key ?? config.name ?? "default";
         this._configs.set(key, config);
         this._eventDispatcher.dispatchEvent(EventType.configAdded, { data: { name: key, config } });
     }
+    async addEasing(name, easing, refresh = true) {
+        if (this.getEasing(name)) {
+            return;
+        }
+        this.easingFunctions.set(name, easing);
+        await this.refresh(refresh);
+    }
     async addEffect(effect, drawer, refresh = true) {
         executeOnSingleOrMultiple(effect, type => {
             if (!this.getEffectDrawer(type)) {
@@ -175,6 +188,9 @@ export class Engine {
         }
         return res;
     }
+    getEasing(name) {
+        return this.easingFunctions.get(name) ?? ((value) => value);
+    }
     getEffectDrawer(type) {
         return this.effectDrawers.get(type);
     }

package/esm/Core/Particle.js

@@ -325,7 +325,7 @@ export class Particle {
             this.sides = sideCountFunc(this);
         }
         this.spawning = false;
-        this.shadowColor = rangeColorToRgb(this.options.shadow.color);
+        this.shadowColor = rangeColorToRgb(this._engine, this.options.shadow.color);
         for (const updater of particles.updaters) {
             updater.init(this);
         }

package/esm/Types/EasingFunction.js

@@ -0,0 +1 @@
+export {};

package/esm/Utils/ColorUtils.js

@@ -3,83 +3,63 @@ import { isArray, isString } from "./TypeUtils.js";
 import { millisecondsToSeconds, percentDenominator } from "../Core/Utils/Constants.js";
 import { AnimationStatus } from "../Enums/AnimationStatus.js";
 import { itemFromArray } from "./Utils.js";
-var RgbIndexes;
-(function (RgbIndexes) {
-    RgbIndexes[RgbIndexes["r"] = 1] = "r";
-    RgbIndexes[RgbIndexes["g"] = 2] = "g";
-    RgbIndexes[RgbIndexes["b"] = 3] = "b";
-    RgbIndexes[RgbIndexes["a"] = 4] = "a";
-})(RgbIndexes || (RgbIndexes = {}));
-const randomColorValue = "random", midColorValue = "mid", colorManagers = new Map();
-export function addColorManager(manager) {
-    colorManagers.set(manager.key, manager);
-}
-function stringToRgba(input) {
-    for (const manager of colorManagers.values()) {
+const randomColorValue = "random", midColorValue = "mid";
+function stringToRgba(engine, input) {
+    if (!input) {
+        return;
+    }
+    for (const manager of engine.colorManagers.values()) {
         if (input.startsWith(manager.stringPrefix)) {
             return manager.parseString(input);
         }
     }
-    const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i, hexFixed = input.replace(shorthandRegex, (_, r, g, b, a) => {
-        return r + r + g + g + b + b + (a !== undefined ? a + a : "");
-    }), regex = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i, result = regex.exec(hexFixed), radix = 16, defaultAlpha = 1, alphaFactor = 0xff;
-    return result
-        ? {
-            a: result[RgbIndexes.a] !== undefined
-                ? parseInt(result[RgbIndexes.a], radix) / alphaFactor
-                : defaultAlpha,
-            b: parseInt(result[RgbIndexes.b], radix),
-            g: parseInt(result[RgbIndexes.g], radix),
-            r: parseInt(result[RgbIndexes.r], radix),
-        }
-        : undefined;
 }
-export function rangeColorToRgb(input, index, useIndex = true) {
+export function rangeColorToRgb(engine, input, index, useIndex = true) {
     if (!input) {
         return;
     }
     const color = isString(input) ? { value: input } : input;
     if (isString(color.value)) {
-        return colorToRgb(color.value, index, useIndex);
+        return colorToRgb(engine, color.value, index, useIndex);
     }
     if (isArray(color.value)) {
-        return rangeColorToRgb({
+        return rangeColorToRgb(engine, {
             value: itemFromArray(color.value, index, useIndex),
         });
     }
-    for (const manager of colorManagers.values()) {
+    for (const manager of engine.colorManagers.values()) {
         const res = manager.handleRangeColor(color);
         if (res) {
             return res;
         }
     }
 }
-export function colorToRgb(input, index, useIndex = true) {
+export function colorToRgb(engine, input, index, useIndex = true) {
     if (!input) {
         return;
     }
     const color = isString(input) ? { value: input } : input;
     if (isString(color.value)) {
-        return color.value === randomColorValue ? getRandomRgbColor() : stringToRgb(color.value);
+        return color.value === randomColorValue ? getRandomRgbColor() : stringToRgb(engine, color.value);
     }
     if (isArray(color.value)) {
-        return colorToRgb({
+        return colorToRgb(engine, {
             value: itemFromArray(color.value, index, useIndex),
         });
     }
-    for (const manager of colorManagers.values()) {
+    for (const manager of engine.colorManagers.values()) {
         const res = manager.handleColor(color);
         if (res) {
             return res;
         }
     }
 }
-export function colorToHsl(color, index, useIndex = true) {
-    const rgb = colorToRgb(color, index, useIndex);
+export function colorToHsl(engine, color, index, useIndex = true) {
+    const rgb = colorToRgb(engine, color, index, useIndex);
     return rgb ? rgbToHsl(rgb) : undefined;
 }
-export function rangeColorToHsl(color, index, useIndex = true) {
-    const rgb = rangeColorToRgb(color, index, useIndex);
+export function rangeColorToHsl(engine, color, index, useIndex = true) {
+    const rgb = rangeColorToRgb(engine, color, index, useIndex);
     return rgb ? rgbToHsl(rgb) : undefined;
 }
 export function rgbToHsl(color) {
@@ -106,11 +86,11 @@ export function rgbToHsl(color) {
     }
     return res;
 }
-export function stringToAlpha(input) {
-    return stringToRgba(input)?.a;
+export function stringToAlpha(engine, input) {
+    return stringToRgba(engine, input)?.a;
 }
-export function stringToRgb(input) {
-    return stringToRgba(input);
+export function stringToRgb(engine, input) {
+    return stringToRgba(engine, input);
 }
 export function hslToRgb(hsl) {
     const hMax = 360, sMax = 100, lMax = 100, sMin = 0, lMin = 0, h = ((hsl.h % hMax) + hMax) % hMax, s = Math.max(sMin, Math.min(sMax, hsl.s)), l = Math.max(lMin, Math.min(lMax, hsl.l)), hNormalized = h / hMax, sNormalized = s / sMax, lNormalized = l / lMax, rgbFactor = 255, triple = 3;
@@ -201,11 +181,11 @@ export function getLinkColor(p1, p2, linkColor) {
         return linkColor;
     }
 }
-export function getLinkRandomColor(optColor, blink, consent) {
+export function getLinkRandomColor(engine, optColor, blink, consent) {
     const color = isString(optColor) ? optColor : optColor.value;
     if (color === randomColorValue) {
         if (consent) {
-            return rangeColorToRgb({
+            return rangeColorToRgb(engine, {
                 value: color,
             });
         }
@@ -218,7 +198,7 @@ export function getLinkRandomColor(optColor, blink, consent) {
         return midColorValue;
     }
     else {
-        return rangeColorToRgb({
+        return rangeColorToRgb(engine, {
             value: color,
         });
     }

package/esm/Utils/NumberUtils.js

@@ -6,16 +6,7 @@ let _random = Math.random;
 const _animationLoop = {
     nextFrame: (cb) => requestAnimationFrame(cb),
     cancel: (idx) => cancelAnimationFrame(idx),
-}, easingFunctions = new Map(), double = 2, doublePI = Math.PI * double;
-export function addEasing(name, easing) {
-    if (easingFunctions.get(name)) {
-        return;
-    }
-    easingFunctions.set(name, easing);
-}
-export function getEasing(name) {
-    return easingFunctions.get(name) ?? ((value) => value);
-}
+}, double = 2, doublePI = Math.PI * double;
 export function setRandom(rnd = Math.random) {
     _random = rnd;
 }

package/esm/Utils/Utils.js

@@ -414,3 +414,9 @@ export function updateAnimation(particle, data, changeDirection, destroyType, de
         data.value = clamp(data.value, minValue, maxValue);
     }
 }
+export function assertValidVersion(engine, pluginVersion) {
+    if (engine.version === pluginVersion) {
+        return;
+    }
+    throw new Error(`The tsParticles version is different from the loaded plugins version. Engine version: ${engine.version}. Plugins version: ${pluginVersion}`);
+}

package/esm/exports.js

@@ -78,9 +78,7 @@ export * from "./Options/Classes/Theme/ThemeDefault.js";
 export * from "./Options/Classes/ValueWithRandom.js";
 export * from "./Utils/CanvasUtils.js";
 export * from "./Utils/ColorUtils.js";
-export * from "./Utils/HslColorManager.js";
 export * from "./Utils/NumberUtils.js";
 export * from "./Utils/OptionsUtils.js";
-export * from "./Utils/RgbColorManager.js";
 export * from "./Utils/Utils.js";
 export * from "./Utils/TypeUtils.js";

package/esm/init.js

@@ -1,11 +1,5 @@
 import { Engine } from "./Core/Engine.js";
-import { HslColorManager } from "./Utils/HslColorManager.js";
-import { RgbColorManager } from "./Utils/RgbColorManager.js";
-import { addColorManager } from "./Utils/ColorUtils.js";
 export function init() {
-    const rgbColorManager = new RgbColorManager(), hslColorManager = new HslColorManager();
-    addColorManager(rgbColorManager);
-    addColorManager(hslColorManager);
     const engine = new Engine();
     engine.init();
     return engine;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/engine",
-  "version": "3.6.0",
+  "version": "3.7.1",
   "description": "Easily create highly customizable particle, confetti and fireworks animations and use them as animated backgrounds for your website. Ready to use components available also for React, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Riot.js, Inferno.",
   "homepage": "https://particles.js.org",
   "scripts": {

package/report.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8"/>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
-    <title>@tsparticles/engine [18 Nov 2024 at 23:49]</title>
+    <title>@tsparticles/engine [24 Nov 2024 at 23:35]</title>
     <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
 
     <script>