@tsparticles/engine 3.3.0 → 3.4.0

package/umd/Core/Engine.js

@@ -1,47 +1,25 @@
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 (function (factory) {
     if (typeof module === "object" && typeof module.exports === "object") {
         var v = factory(require, exports);
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./Utils/Constants.js", "../Utils/Utils.js", "../Utils/EventDispatcher.js", "../Utils/NumberUtils.js"], factory);
+        define(["require", "exports", "./Utils/Constants.js", "../Utils/Utils.js", "./Container.js", "../Utils/EventDispatcher.js", "../Enums/Types/EventType.js", "../Utils/NumberUtils.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
-    var __syncRequire = typeof module === "object" && typeof module.exports === "object";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.Engine = void 0;
     const Constants_js_1 = require("./Utils/Constants.js");
     const Utils_js_1 = require("../Utils/Utils.js");
+    const Container_js_1 = require("./Container.js");
     const EventDispatcher_js_1 = require("../Utils/EventDispatcher.js");
+    const EventType_js_1 = require("../Enums/Types/EventType.js");
     const NumberUtils_js_1 = require("../Utils/NumberUtils.js");
     async function getItemsFromInitializer(container, map, initializers, force = false) {
         let res = map.get(container);
         if (!res || force) {
-            res = await Promise.all([...initializers.values()].map((t) => t(container)));
+            res = await Promise.all([...initializers.values()].map(t => t(container)));
             map.set(container, res);
         }
         return res;
@@ -58,6 +36,46 @@ var __importStar = (this && this.__importStar) || function (mod) {
         (0, Utils_js_1.getLogger)().error(`${Constants_js_1.errorPrefix} ${response.status} while retrieving config file`);
         return data.fallback;
     }
+    const generatedTrue = "true", generatedFalse = "false", canvasTag = "canvas", getCanvasFromContainer = (domContainer) => {
+        let canvasEl;
+        if (domContainer instanceof HTMLCanvasElement || domContainer.tagName.toLowerCase() === canvasTag) {
+            canvasEl = domContainer;
+            if (!canvasEl.dataset[Constants_js_1.generatedAttribute]) {
+                canvasEl.dataset[Constants_js_1.generatedAttribute] = generatedFalse;
+            }
+        }
+        else {
+            const existingCanvases = domContainer.getElementsByTagName(canvasTag);
+            if (existingCanvases.length) {
+                const firstIndex = 0;
+                canvasEl = existingCanvases[firstIndex];
+                canvasEl.dataset[Constants_js_1.generatedAttribute] = generatedFalse;
+            }
+            else {
+                canvasEl = document.createElement(canvasTag);
+                canvasEl.dataset[Constants_js_1.generatedAttribute] = generatedTrue;
+                domContainer.appendChild(canvasEl);
+            }
+        }
+        const fullPercent = "100%";
+        if (!canvasEl.style.width) {
+            canvasEl.style.width = fullPercent;
+        }
+        if (!canvasEl.style.height) {
+            canvasEl.style.height = fullPercent;
+        }
+        return canvasEl;
+    }, getDomContainer = (id, source) => {
+        let domContainer = source ?? document.getElementById(id);
+        if (domContainer) {
+            return domContainer;
+        }
+        domContainer = document.createElement("div");
+        domContainer.id = id;
+        domContainer.dataset[Constants_js_1.generatedAttribute] = generatedTrue;
+        document.body.append(domContainer);
+        return domContainer;
+    };
     class Engine {
         constructor() {
             this._configs = new Map();
@@ -85,16 +103,19 @@ var __importStar = (this && this.__importStar) || function (mod) {
             }
             return res;
         }
+        get items() {
+            return this._domArray;
+        }
         get version() {
-            return "3.3.0";
+            return "3.4.0";
         }
         addConfig(config) {
             const key = config.key ?? config.name ?? "default";
             this._configs.set(key, config);
-            this._eventDispatcher.dispatchEvent("configAdded", { data: { name: key, config } });
+            this._eventDispatcher.dispatchEvent(EventType_js_1.EventType.configAdded, { data: { name: key, config } });
         }
         async addEffect(effect, drawer, refresh = true) {
-            (0, Utils_js_1.executeOnSingleOrMultiple)(effect, (type) => {
+            (0, Utils_js_1.executeOnSingleOrMultiple)(effect, type => {
                 if (!this.getEffectDrawer(type)) {
                     this.effectDrawers.set(type, drawer);
                 }
@@ -134,12 +155,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
             }
             await this.refresh(refresh);
         }
-        async addShape(shape, drawer, refresh = true) {
-            (0, Utils_js_1.executeOnSingleOrMultiple)(shape, (type) => {
-                if (!this.getShapeDrawer(type)) {
-                    this.shapeDrawers.set(type, drawer);
+        async addShape(drawer, refresh = true) {
+            for (const validType of drawer.validTypes) {
+                if (this.getShapeDrawer(validType)) {
+                    continue;
                 }
-            });
+                this.shapeDrawers.set(validType, drawer);
+            }
             await this.refresh(refresh);
         }
         clearPlugins(container) {
@@ -151,16 +173,10 @@ var __importStar = (this && this.__importStar) || function (mod) {
             this._eventDispatcher.dispatchEvent(type, args);
         }
         dom() {
-            return this._domArray;
+            return this.items;
         }
         domItem(index) {
-            const dom = this.dom(), item = dom[index];
-            if (!item || item.destroyed) {
-                const deleteCount = 1;
-                dom.splice(index, deleteCount);
-                return;
-            }
-            return item;
+            return this.item(index);
         }
         async getAvailablePlugins(container) {
             const res = new Map();
@@ -175,16 +191,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
             return this.effectDrawers.get(type);
         }
         async getInteractors(container, force = false) {
-            return await getItemsFromInitializer(container, this.interactors, this._initializers.interactors, force);
+            return getItemsFromInitializer(container, this.interactors, this._initializers.interactors, force);
         }
         async getMovers(container, force = false) {
-            return await getItemsFromInitializer(container, this.movers, this._initializers.movers, force);
+            return getItemsFromInitializer(container, this.movers, this._initializers.movers, force);
         }
         getPathGenerator(type) {
             return this.pathGenerators.get(type);
         }
         getPlugin(plugin) {
-            return this.plugins.find((t) => t.id === plugin);
+            return this.plugins.find(t => t.id === plugin);
         }
         getPreset(preset) {
             return this.presets.get(preset);
@@ -199,7 +215,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
             return this.shapeDrawers.keys();
         }
         async getUpdaters(container, force = false) {
-            return await getItemsFromInitializer(container, this.updaters, this._initializers.updaters, force);
+            return getItemsFromInitializer(container, this.updaters, this._initializers.updaters, force);
         }
         init() {
             if (this._initialized) {
@@ -207,90 +223,58 @@ var __importStar = (this && this.__importStar) || function (mod) {
             }
             this._initialized = true;
         }
+        item(index) {
+            const { items } = this, item = items[index];
+            if (!item || item.destroyed) {
+                const deleteCount = 1;
+                items.splice(index, deleteCount);
+                return;
+            }
+            return item;
+        }
         async load(params) {
             const randomFactor = 10000, id = params.id ?? params.element?.id ?? `tsparticles${Math.floor((0, NumberUtils_js_1.getRandom)() * randomFactor)}`, { index, url } = params, options = url ? await getDataFromUrl({ fallback: params.options, url, index }) : params.options;
-            let domContainer = params.element ?? document.getElementById(id);
-            if (!domContainer) {
-                domContainer = document.createElement("div");
-                domContainer.id = id;
-                document.body.append(domContainer);
-            }
-            const currentOptions = (0, Utils_js_1.itemFromSingleOrMultiple)(options, index), dom = this.dom(), oldIndex = dom.findIndex((v) => v.id.description === id), minIndex = 0;
+            const currentOptions = (0, Utils_js_1.itemFromSingleOrMultiple)(options, index), { items } = this, oldIndex = items.findIndex(v => v.id.description === id), minIndex = 0, newItem = new Container_js_1.Container(this, id, currentOptions);
             if (oldIndex >= minIndex) {
-                const old = this.domItem(oldIndex);
+                const old = this.item(oldIndex), one = 1, none = 0, deleteCount = old ? one : none;
                 if (old && !old.destroyed) {
-                    old.destroy();
-                    const deleteCount = 1;
-                    dom.splice(oldIndex, deleteCount);
+                    old.destroy(false);
                 }
-            }
-            let canvasEl;
-            if (domContainer.tagName.toLowerCase() === "canvas") {
-                canvasEl = domContainer;
-                canvasEl.dataset[Constants_js_1.generatedAttribute] = "false";
+                items.splice(oldIndex, deleteCount, newItem);
             }
             else {
-                const existingCanvases = domContainer.getElementsByTagName("canvas");
-                if (existingCanvases.length) {
-                    const firstIndex = 0;
-                    canvasEl = existingCanvases[firstIndex];
-                    canvasEl.dataset[Constants_js_1.generatedAttribute] = "false";
-                }
-                else {
-                    canvasEl = document.createElement("canvas");
-                    canvasEl.dataset[Constants_js_1.generatedAttribute] = "true";
-                    domContainer.appendChild(canvasEl);
-                }
-            }
-            if (!canvasEl.style.width) {
-                canvasEl.style.width = "100%";
-            }
-            if (!canvasEl.style.height) {
-                canvasEl.style.height = "100%";
-            }
-            const { Container } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./Container.js"))) : new Promise((resolve_1, reject_1) => { require(["./Container.js"], resolve_1, reject_1); }).then(__importStar)), newItem = new Container(this, id, currentOptions);
-            if (oldIndex >= minIndex) {
-                const deleteCount = 0;
-                dom.splice(oldIndex, deleteCount, newItem);
-            }
-            else {
-                dom.push(newItem);
+                items.push(newItem);
             }
+            const domContainer = getDomContainer(id, params.element), canvasEl = getCanvasFromContainer(domContainer);
             newItem.canvas.loadCanvas(canvasEl);
             await newItem.start();
             return newItem;
         }
         loadOptions(options, sourceOptions) {
-            for (const plugin of this.plugins) {
-                plugin.loadOptions(options, sourceOptions);
-            }
+            this.plugins.forEach(plugin => plugin.loadOptions?.(options, sourceOptions));
         }
         loadParticlesOptions(container, options, ...sourceOptions) {
             const updaters = this.updaters.get(container);
             if (!updaters) {
                 return;
             }
-            for (const updater of updaters) {
-                updater.loadOptions?.(options, ...sourceOptions);
-            }
+            updaters.forEach(updater => updater.loadOptions?.(options, ...sourceOptions));
         }
         async refresh(refresh = true) {
             if (!refresh) {
                 return;
             }
-            await Promise.all(this.dom().map((t) => t.refresh()));
+            await Promise.all(this.items.map(t => t.refresh()));
         }
         removeEventListener(type, listener) {
             this._eventDispatcher.removeEventListener(type, listener);
         }
         setOnClickHandler(callback) {
-            const dom = this.dom();
-            if (!dom.length) {
+            const { items } = this;
+            if (!items.length) {
                 throw new Error(`${Constants_js_1.errorPrefix} can only set click handlers after calling tsParticles.load()`);
             }
-            for (const domItem of dom) {
-                domItem.addClickHandler(callback);
-            }
+            items.forEach(item => item.addClickHandler(callback));
         }
     }
     exports.Engine = Engine;

package/umd/Core/Particle.js

@@ -4,7 +4,7 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./Utils/Vectors.js", "../Utils/NumberUtils.js", "../Utils/Utils.js", "./Utils/Constants.js", "../Utils/ColorUtils.js", "../Options/Classes/Interactivity/Interactivity.js", "../Utils/CanvasUtils.js", "../Utils/OptionsUtils.js"], factory);
+        define(["require", "exports", "./Utils/Vectors.js", "../Utils/NumberUtils.js", "../Utils/Utils.js", "./Utils/Constants.js", "../Utils/ColorUtils.js", "../Enums/Types/EventType.js", "../Options/Classes/Interactivity/Interactivity.js", "../Enums/Directions/MoveDirection.js", "../Enums/Modes/OutMode.js", "../Enums/Types/ParticleOutType.js", "../Enums/Modes/PixelMode.js", "../Utils/CanvasUtils.js", "../Utils/OptionsUtils.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -15,10 +15,15 @@
     const Utils_js_1 = require("../Utils/Utils.js");
     const Constants_js_1 = require("./Utils/Constants.js");
     const ColorUtils_js_1 = require("../Utils/ColorUtils.js");
+    const EventType_js_1 = require("../Enums/Types/EventType.js");
     const Interactivity_js_1 = require("../Options/Classes/Interactivity/Interactivity.js");
+    const MoveDirection_js_1 = require("../Enums/Directions/MoveDirection.js");
+    const OutMode_js_1 = require("../Enums/Modes/OutMode.js");
+    const ParticleOutType_js_1 = require("../Enums/Types/ParticleOutType.js");
+    const PixelMode_js_1 = require("../Enums/Modes/PixelMode.js");
     const CanvasUtils_js_1 = require("../Utils/CanvasUtils.js");
     const OptionsUtils_js_1 = require("../Utils/OptionsUtils.js");
-    const defaultRetryCount = 0, double = 2, half = 0.5, squareExp = 2;
+    const defaultRetryCount = 0, double = 2, half = 0.5, squareExp = 2, randomString = "random";
     function loadEffectData(effect, effectOptions, id, reduceDuplicates) {
         const effectData = effectOptions.options[effect];
         if (!effectData) {
@@ -67,7 +72,7 @@
                 }), pos = Vectors_js_1.Vector3d.create(exactPosition.x, exactPosition.y, zIndex), radius = this.getRadius(), outModes = this.options.move.outModes, fixHorizontal = (outMode) => {
                     fixOutMode({
                         outMode,
-                        checkModes: ["bounce"],
+                        checkModes: [OutMode_js_1.OutMode.bounce],
                         coord: pos.x,
                         maxCoord: container.canvas.size.width,
                         setCb: (value) => (pos.x += value),
@@ -76,7 +81,7 @@
                 }, fixVertical = (outMode) => {
                     fixOutMode({
                         outMode,
-                        checkModes: ["bounce"],
+                        checkModes: [OutMode_js_1.OutMode.bounce],
                         coord: pos.y,
                         maxCoord: container.canvas.size.height,
                         setCb: (value) => (pos.y += value),
@@ -95,7 +100,7 @@
             };
             this._calculateVelocity = () => {
                 const baseVelocity = (0, NumberUtils_js_1.getParticleBaseVelocity)(this.direction), res = baseVelocity.copy(), moveOptions = this.options.move;
-                if (moveOptions.direction === "inside" || moveOptions.direction === "outside") {
+                if (moveOptions.direction === MoveDirection_js_1.MoveDirection.inside || moveOptions.direction === MoveDirection_js_1.MoveDirection.outside) {
                     return res;
                 }
                 const rad = (0, NumberUtils_js_1.degToRad)((0, NumberUtils_js_1.getRangeValue)(moveOptions.angle.value)), radOffset = (0, NumberUtils_js_1.degToRad)((0, NumberUtils_js_1.getRangeValue)(moveOptions.angle.offset)), range = {
@@ -123,9 +128,9 @@
                 if (retries >= minRetries && tryCount > retries) {
                     throw new Error(`${Constants_js_1.errorPrefix} particle is overlapping and can't be placed`);
                 }
-                return !!this.container.particles.find((particle) => (0, NumberUtils_js_1.getDistance)(pos, particle.position) < radius + particle.getRadius());
+                return !!this.container.particles.find(particle => (0, NumberUtils_js_1.getDistance)(pos, particle.position) < radius + particle.getRadius());
             };
-            this._getRollColor = (color) => {
+            this._getRollColor = color => {
                 if (!color || !this.roll || (!this.backColor && !this.roll.alter)) {
                     return color;
                 }
@@ -141,7 +146,7 @@
                 }
                 return color;
             };
-            this._initPosition = (position) => {
+            this._initPosition = position => {
                 const container = this.container, zIndexValue = (0, NumberUtils_js_1.getRangeValue)(this.options.zIndex.value), minZ = 0;
                 this.position = this._calcPosition(container, position, (0, NumberUtils_js_1.clamp)(zIndexValue, minZ, container.zLayers));
                 this.initialPosition = this.position.copy();
@@ -149,15 +154,15 @@
                 this.moveCenter = {
                     ...(0, Utils_js_1.getPosition)(this.options.move.center, canvasSize),
                     radius: this.options.move.center.radius ?? defaultRadius,
-                    mode: this.options.move.center.mode ?? "percent",
+                    mode: this.options.move.center.mode ?? PixelMode_js_1.PixelMode.percent,
                 };
                 this.direction = (0, NumberUtils_js_1.getParticleDirectionAngle)(this.options.move.direction, this.position, this.moveCenter);
                 switch (this.options.move.direction) {
-                    case "inside":
-                        this.outType = "inside";
+                    case MoveDirection_js_1.MoveDirection.inside:
+                        this.outType = ParticleOutType_js_1.ParticleOutType.inside;
                         break;
-                    case "outside":
-                        this.outType = "outside";
+                    case MoveDirection_js_1.MoveDirection.outside:
+                        this.outType = ParticleOutType_js_1.ParticleOutType.outside;
                         break;
                 }
                 this.offset = Vectors_js_1.Vector.origin;
@@ -180,7 +185,7 @@
                 updater.particleDestroyed?.(this, override);
             }
             pathGenerator?.reset(this);
-            this._engine.dispatchEvent("particleDestroyed", {
+            this._engine.dispatchEvent(EventType_js_1.EventType.particleDestroyed, {
                 container: this.container,
                 data: {
                     particle: this,
@@ -225,14 +230,15 @@
             this.lastPathTime = 0;
             this.destroyed = false;
             this.unbreakable = false;
+            this.isRotating = false;
             this.rotation = 0;
             this.misplaced = false;
             this.retina = {
                 maxDistance: {},
             };
-            this.outType = "normal";
+            this.outType = ParticleOutType_js_1.ParticleOutType.normal;
             this.ignoresResizeRatio = true;
-            const pxRatio = container.retina.pixelRatio, mainOptions = container.actualOptions, particlesOptions = (0, OptionsUtils_js_1.loadParticlesOptions)(this._engine, container, mainOptions.particles), effectType = particlesOptions.effect.type, shapeType = particlesOptions.shape.type, { reduceDuplicates } = particlesOptions;
+            const pxRatio = container.retina.pixelRatio, mainOptions = container.actualOptions, particlesOptions = (0, OptionsUtils_js_1.loadParticlesOptions)(this._engine, container, mainOptions.particles), { reduceDuplicates } = particlesOptions, effectType = particlesOptions.effect.type, shapeType = particlesOptions.shape.type;
             this.effect = (0, Utils_js_1.itemFromSingleOrMultiple)(effectType, this.id, reduceDuplicates);
             this.shape = (0, Utils_js_1.itemFromSingleOrMultiple)(shapeType, this.id, reduceDuplicates);
             const effectOptions = particlesOptions.effect, shapeOptions = particlesOptions.shape;
@@ -252,6 +258,14 @@
                     }
                 }
             }
+            if (this.effect === randomString) {
+                const availableEffects = [...this.container.effectDrawers.keys()];
+                this.effect = availableEffects[Math.floor(Math.random() * availableEffects.length)];
+            }
+            if (this.shape === randomString) {
+                const availableShapes = [...this.container.shapeDrawers.keys()];
+                this.shape = availableShapes[Math.floor(Math.random() * availableShapes.length)];
+            }
             this.effectData = loadEffectData(this.effect, effectOptions, this.id, reduceDuplicates);
             this.shapeData = loadShapeData(this.shape, shapeOptions, this.id, reduceDuplicates);
             particlesOptions.load(overrideOptions);

package/umd/Core/Particles.js

@@ -4,14 +4,16 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "../Utils/Utils.js", "./Utils/InteractionManager.js", "./Particle.js", "./Utils/Point.js", "./Utils/QuadTree.js", "./Utils/Ranges.js", "./Utils/Constants.js"], factory);
+        define(["require", "exports", "../Utils/Utils.js", "../Enums/Types/EventType.js", "./Utils/InteractionManager.js", "../Enums/Modes/LimitMode.js", "./Particle.js", "./Utils/Point.js", "./Utils/QuadTree.js", "./Utils/Ranges.js", "./Utils/Constants.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.Particles = void 0;
     const Utils_js_1 = require("../Utils/Utils.js");
+    const EventType_js_1 = require("../Enums/Types/EventType.js");
     const InteractionManager_js_1 = require("./Utils/InteractionManager.js");
+    const LimitMode_js_1 = require("../Enums/Modes/LimitMode.js");
     const Particle_js_1 = require("./Particle.js");
     const Point_js_1 = require("./Utils/Point.js");
     const QuadTree_js_1 = require("./Utils/QuadTree.js");
@@ -25,9 +27,7 @@
     class Particles {
         constructor(engine, container) {
             this._addToPool = (...particles) => {
-                for (const particle of particles) {
-                    this._pool.push(particle);
-                }
+                this._pool.push(...particles);
             };
             this._applyDensity = (options, manualCount, group) => {
                 const numberOptions = options.number;
@@ -40,7 +40,7 @@
                     }
                     return;
                 }
-                const densityFactor = this._initDensityFactor(numberOptions.density), optParticlesNumber = numberOptions.value, minLimit = 0, optParticlesLimit = numberOptions.limit.value > minLimit ? numberOptions.limit.value : optParticlesNumber, particlesNumber = Math.min(optParticlesNumber, optParticlesLimit) * densityFactor + manualCount, particlesCount = Math.min(this.count, this.filter((t) => t.group === group).length);
+                const densityFactor = this._initDensityFactor(numberOptions.density), optParticlesNumber = numberOptions.value, minLimit = 0, optParticlesLimit = numberOptions.limit.value > minLimit ? numberOptions.limit.value : optParticlesNumber, particlesNumber = Math.min(optParticlesNumber, optParticlesLimit) * densityFactor + manualCount, particlesCount = Math.min(this.count, this.filter(t => t.group === group).length);
                 if (group === undefined) {
                     this._limit = numberOptions.limit.value * densityFactor;
                 }
@@ -54,7 +54,7 @@
                     this.removeQuantity(particlesCount - particlesNumber, group);
                 }
             };
-            this._initDensityFactor = (densityOptions) => {
+            this._initDensityFactor = densityOptions => {
                 const container = this._container, defaultFactor = 1;
                 if (!container.canvas.element || !densityOptions.enable) {
                     return defaultFactor;
@@ -79,7 +79,7 @@
                     this._array.push(particle);
                     this._zArray.push(particle);
                     this._nextId++;
-                    this._engine.dispatchEvent("particleAdded", {
+                    this._engine.dispatchEvent(EventType_js_1.EventType.particleAdded, {
                         container: this._container,
                         data: {
                             particle,
@@ -100,7 +100,7 @@
                 this._array.splice(index, deleteCount);
                 this._zArray.splice(zIdx, deleteCount);
                 particle.destroy(override);
-                this._engine.dispatchEvent("particleRemoved", {
+                this._engine.dispatchEvent(EventType_js_1.EventType.particleRemoved, {
                     container: this._container,
                     data: {
                         particle,
@@ -131,23 +131,24 @@
         }
         addManualParticles() {
             const container = this._container, options = container.actualOptions;
-            for (const particle of options.manualParticles) {
-                this.addParticle(particle.position ? (0, Utils_js_1.getPosition)(particle.position, container.canvas.size) : undefined, particle.options);
-            }
+            options.manualParticles.forEach(p => this.addParticle(p.position ? (0, Utils_js_1.getPosition)(p.position, container.canvas.size) : undefined, p.options));
         }
         addParticle(position, overrideOptions, group, initializer) {
-            const limitOptions = this._container.actualOptions.particles.number.limit, limit = group === undefined ? this._limit : this._groupLimits.get(group) ?? this._limit, currentCount = this.count, minLimit = 0;
+            const limitMode = this._container.actualOptions.particles.number.limit.mode, limit = group === undefined ? this._limit : this._groupLimits.get(group) ?? this._limit, currentCount = this.count, minLimit = 0;
             if (limit > minLimit) {
-                if (limitOptions.mode === "delete") {
-                    const countOffset = 1, minCount = 0, countToRemove = currentCount + countOffset - limit;
-                    if (countToRemove > minCount) {
-                        this.removeQuantity(countToRemove);
-                    }
-                }
-                else if (limitOptions.mode === "wait") {
-                    if (currentCount >= limit) {
-                        return;
+                switch (limitMode) {
+                    case LimitMode_js_1.LimitMode.delete: {
+                        const countOffset = 1, minCount = 0, countToRemove = currentCount + countOffset - limit;
+                        if (countToRemove > minCount) {
+                            this.removeQuantity(countToRemove);
+                        }
+                        break;
                     }
+                    case LimitMode_js_1.LimitMode.wait:
+                        if (currentCount >= limit) {
+                            return;
+                        }
+                        break;
                 }
             }
             return this._pushParticle(position, overrideOptions, group, initializer);
@@ -193,9 +194,7 @@
             await this.initPlugins();
             let handled = false;
             for (const [, plugin] of container.plugins) {
-                if (plugin.particlesInitialization !== undefined) {
-                    handled = plugin.particlesInitialization();
-                }
+                handled = plugin.particlesInitialization?.() ?? handled;
                 if (handled) {
                     break;
                 }
@@ -310,7 +309,7 @@
                 this._array = this.filter(checkDelete);
                 this._zArray = this._zArray.filter(checkDelete);
                 for (const particle of particlesToDelete) {
-                    this._engine.dispatchEvent("particleRemoved", {
+                    this._engine.dispatchEvent(EventType_js_1.EventType.particleRemoved, {
                         container: this._container,
                         data: {
                             particle,