tsparticles 1.37.4 → 1.39.0

package/browser/index.js

@@ -1,25 +1,17 @@
 import { initPjs } from "./pjs";
-import { Main } from "./main";
-import { Circle, CircleWarp, Constants, Point, Rectangle } from "./Utils";
+import { Engine } from "./engine";
 import { loadFull } from "./full";
-const tsParticles = new Main();
+const tsParticles = new Engine();
 tsParticles.init();
 const { particlesJS, pJSDom } = initPjs(tsParticles);
 loadFull(tsParticles);
-export * from "./Core/Particle/Vector";
+export * from "./Core";
 export * from "./Core/Container";
 export * from "./Enums";
 export * from "./Plugins/Absorbers/Enums";
 export * from "./Plugins/Emitters/Enums";
 export * from "./Plugins/PolygonMask/Enums";
-export { Circle, CircleWarp, Constants, Point, Rectangle, Main };
-export * from "./Utils/CanvasUtils";
-export * from "./Utils/ColorUtils";
-export * from "./Utils/NumberUtils";
-export * from "./Utils/Utils";
+export { Engine, Engine as Main };
+export * from "./Utils";
 export * from "./Types";
-export * from "./Core/Interfaces";
-export * from "./Core/Particle";
-export * from "./Core/ExternalInteractorBase";
-export * from "./Core/ParticlesInteractorBase";
 export { particlesJS, pJSDom, tsParticles };

package/browser/index.slim.d.ts

@@ -1,24 +1,14 @@
-import { Circle, CircleWarp, Constants, Point, Rectangle } from "./Utils";
 import type { IOptions } from "./Options/Interfaces/IOptions";
 import type { RecursivePartial } from "./Types";
-import type { IParticle } from "./Core/Interfaces";
-import { Main } from "./main";
-declare const tsParticles: Main;
-declare const particlesJS: import("./pjs").IParticlesJS, pJSDom: import("./Core/Container").Container[];
-export * from "./Core/Particle/Vector";
+import { Engine } from "./engine";
+declare const tsParticles: Engine;
+declare const particlesJS: import("./pjs").IParticlesJS, pJSDom: import("./Core").Container[];
+export * from "./Core";
 export * from "./Core/Container";
 export * from "./Enums";
-export { Circle, CircleWarp, Constants, Point, Rectangle, Main };
-export * from "./Utils/CanvasUtils";
-export * from "./Utils/ColorUtils";
-export * from "./Utils/NumberUtils";
-export * from "./Utils/Utils";
+export { Engine, Engine as Main };
+export * from "./Utils";
 export * from "./Types";
-export * from "./Core/Interfaces";
-export * from "./Core/Particle";
-export * from "./Core/ExternalInteractorBase";
-export * from "./Core/ParticlesInteractorBase";
 export { tsParticles, particlesJS, pJSDom };
 export { IOptions };
-export { IParticle };
 export declare type ISourceOptions = RecursivePartial<IOptions>;

package/browser/index.slim.js

@@ -1,23 +1,15 @@
 import { initPjs } from "./pjs";
-import { Circle, CircleWarp, Constants, Point, Rectangle } from "./Utils";
-import { Main } from "./main";
+import { Engine } from "./engine";
 import { loadSlim } from "./slim";
 /* ---------- tsParticles functions - start ------------ */
-const tsParticles = new Main();
+const tsParticles = new Engine();
 tsParticles.init();
 const { particlesJS, pJSDom } = initPjs(tsParticles);
 loadSlim(tsParticles);
-export * from "./Core/Particle/Vector";
+export * from "./Core";
 export * from "./Core/Container";
 export * from "./Enums";
-export { Circle, CircleWarp, Constants, Point, Rectangle, Main };
-export * from "./Utils/CanvasUtils";
-export * from "./Utils/ColorUtils";
-export * from "./Utils/NumberUtils";
-export * from "./Utils/Utils";
+export { Engine, Engine as Main };
+export * from "./Utils";
 export * from "./Types";
-export * from "./Core/Interfaces";
-export * from "./Core/Particle";
-export * from "./Core/ExternalInteractorBase";
-export * from "./Core/ParticlesInteractorBase";
 export { tsParticles, particlesJS, pJSDom };

package/browser/pjs.d.ts

@@ -3,8 +3,8 @@
  * @packageDocumentation
  */
 import type { IOptions } from "./Options/Interfaces/IOptions";
-import type { Container } from "./Core/Container";
-import type { Main } from "./main";
+import type { Container } from "./Core";
+import type { Engine } from "./engine";
 import type { RecursivePartial } from "./Types";
 /**
  * [[include:pjsMigration.md]]
@@ -34,7 +34,7 @@ export interface IParticlesJS {
      */
     setOnClickHandler(callback: EventListenerOrEventListenerObject): void;
 }
-declare const initPjs: (main: Main) => {
+declare const initPjs: (engine: Engine) => {
     particlesJS: IParticlesJS;
     pJSDom: Container[];
 };

package/browser/pjs.js

@@ -1,4 +1,4 @@
-const initPjs = (main) => {
+const initPjs = (engine) => {
     /**
      * Loads the provided options to create a [[Container]] object.
      * @deprecated this method is obsolete, please use the new tsParticles.load
@@ -6,7 +6,7 @@ const initPjs = (main) => {
      * @param options the options object to initialize the [[Container]]
      */
     const particlesJS = (tagId, options) => {
-        return main.load(tagId, options);
+        return engine.load(tagId, options);
     };
     /**
      * Loads the provided json with a GET request.
@@ -17,7 +17,8 @@ const initPjs = (main) => {
      * @param callback called after the [[Container]] is loaded and it will be passed as a parameter
      */
     particlesJS.load = (tagId, pathConfigJson, callback) => {
-        main.loadJSON(tagId, pathConfigJson)
+        engine
+            .loadJSON(tagId, pathConfigJson)
             .then((container) => {
             if (container) {
                 callback(container);
@@ -33,13 +34,13 @@ const initPjs = (main) => {
      * @param callback the function called after the click event is fired
      */
     particlesJS.setOnClickHandler = (callback) => {
-        main.setOnClickHandler(callback);
+        engine.setOnClickHandler(callback);
     };
     /**
      * All the [[Container]] objects loaded
      * @deprecated this method is obsolete, please use the new tsParticles.dom
      */
-    const pJSDom = main.dom();
+    const pJSDom = engine.dom();
     return { particlesJS, pJSDom };
 };
 export { initPjs };

package/browser/slim.d.ts

@@ -1,2 +1,2 @@
-import type { Main } from "./main";
-export declare function loadSlim(tsParticles: Main): Promise<void>;
+import type { Engine } from "./engine";
+export declare function loadSlim(tsParticles: Engine): Promise<void>;

package/{esm/main.d.ts → engine.d.ts}

@@ -1,9 +1,7 @@
 import type { IOptions } from "./Options/Interfaces/IOptions";
-import type { Container } from "./Core/Container";
+import type { Container, IInteractor, IMovePathGenerator, IParticleUpdater, IPlugin, IShapeDrawer, Particle } from "./Core";
 import type { ShapeDrawerAfterEffectFunction, ShapeDrawerDestroyFunction, ShapeDrawerDrawFunction, ShapeDrawerInitFunction, RecursivePartial, SingleOrMultiple } from "./Types";
-import type { Particle } from "./Core/Particle";
-import type { IInteractor, IMovePathGenerator, IParticleUpdater, IPlugin, IShapeDrawer } from "./Core/Interfaces";
-export declare class Main {
+export declare class Engine {
     #private;
     constructor();
     init(): void;

package/{main.js → engine.js}

@@ -10,44 +10,43 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
     return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
-var _Main_initialized;
+var _Engine_initialized;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Main = void 0;
-const Utils_1 = require("./Utils");
-const Loader_1 = require("./Core/Loader");
-class Main {
+exports.Engine = void 0;
+const Core_1 = require("./Core");
+class Engine {
     constructor() {
-        _Main_initialized.set(this, void 0);
-        __classPrivateFieldSet(this, _Main_initialized, false, "f");
+        _Engine_initialized.set(this, void 0);
+        __classPrivateFieldSet(this, _Engine_initialized, false, "f");
     }
     init() {
-        if (!__classPrivateFieldGet(this, _Main_initialized, "f")) {
-            __classPrivateFieldSet(this, _Main_initialized, true, "f");
+        if (!__classPrivateFieldGet(this, _Engine_initialized, "f")) {
+            __classPrivateFieldSet(this, _Engine_initialized, true, "f");
         }
     }
     async loadFromArray(tagId, options, index) {
-        return Loader_1.Loader.load(tagId, options, index);
+        return Core_1.Loader.load(tagId, options, index);
     }
     async load(tagId, options) {
-        return Loader_1.Loader.load(tagId, options);
+        return Core_1.Loader.load(tagId, options);
     }
     async set(id, element, options) {
-        return Loader_1.Loader.set(id, element, options);
+        return Core_1.Loader.set(id, element, options);
     }
     async loadJSON(tagId, pathConfigJson, index) {
-        return Loader_1.Loader.loadJSON(tagId, pathConfigJson, index);
+        return Core_1.Loader.loadJSON(tagId, pathConfigJson, index);
     }
     async setJSON(id, element, pathConfigJson, index) {
-        return Loader_1.Loader.setJSON(id, element, pathConfigJson, index);
+        return Core_1.Loader.setJSON(id, element, pathConfigJson, index);
     }
     setOnClickHandler(callback) {
-        Loader_1.Loader.setOnClickHandler(callback);
+        Core_1.Loader.setOnClickHandler(callback);
     }
     dom() {
-        return Loader_1.Loader.dom();
+        return Core_1.Loader.dom();
     }
     domItem(index) {
-        return Loader_1.Loader.domItem(index);
+        return Core_1.Loader.domItem(index);
     }
     async refresh() {
         for (const instance of this.dom()) {
@@ -67,29 +66,29 @@ class Main {
         else {
             customDrawer = drawer;
         }
-        Utils_1.Plugins.addShapeDrawer(shape, customDrawer);
+        Core_1.Plugins.addShapeDrawer(shape, customDrawer);
         await this.refresh();
     }
     async addPreset(preset, options, override = false) {
-        Utils_1.Plugins.addPreset(preset, options, override);
+        Core_1.Plugins.addPreset(preset, options, override);
         await this.refresh();
     }
     async addPlugin(plugin) {
-        Utils_1.Plugins.addPlugin(plugin);
+        Core_1.Plugins.addPlugin(plugin);
         await this.refresh();
     }
     async addPathGenerator(name, generator) {
-        Utils_1.Plugins.addPathGenerator(name, generator);
+        Core_1.Plugins.addPathGenerator(name, generator);
         await this.refresh();
     }
     async addInteractor(name, interactorInitializer) {
-        Utils_1.Plugins.addInteractor(name, interactorInitializer);
+        Core_1.Plugins.addInteractor(name, interactorInitializer);
         await this.refresh();
     }
     async addParticleUpdater(name, updaterInitializer) {
-        Utils_1.Plugins.addParticleUpdater(name, updaterInitializer);
+        Core_1.Plugins.addParticleUpdater(name, updaterInitializer);
         await this.refresh();
     }
 }
-exports.Main = Main;
-_Main_initialized = new WeakMap();
+exports.Engine = Engine;
+_Engine_initialized = new WeakMap();

package/esm/Core/Canvas.d.ts

@@ -13,11 +13,11 @@ export declare class Canvas {
     private originalStyle?;
     constructor(container: Container);
     init(): void;
-    loadCanvas(canvas: HTMLCanvasElement, generatedCanvas?: boolean): void;
+    loadCanvas(canvas: HTMLCanvasElement): void;
     destroy(): void;
     paint(): void;
     clear(): void;
-    windowResize(): void;
+    windowResize(): Promise<void>;
     resize(): void;
     drawConnectLine(p1: IParticle, p2: IParticle): void;
     drawGrabLine(particle: IParticle, lineColor: IRgb, opacity: number, mousePos: ICoordinates): void;

package/esm/Core/Canvas.js

@@ -1,5 +1,5 @@
-import { colorToHsl, colorToRgb, Constants, deepExtend, drawConnectLine, drawGrabLine, drawParticle, drawParticlePlugin, drawPlugin, getStyleFromHsl, getStyleFromRgb, gradient, paintBase, } from "../Utils";
-import { clear } from "../Utils";
+import { Constants } from "./Utils";
+import { clear, colorToHsl, colorToRgb, deepExtend, drawConnectLine, drawGrabLine, drawParticle, drawParticlePlugin, drawPlugin, getStyleFromHsl, getStyleFromRgb, gradient, paintBase, } from "../Utils";
 export class Canvas {
     constructor(container) {
         this.container = container;
@@ -18,15 +18,15 @@ export class Canvas {
         this.initBackground();
         this.paint();
     }
-    loadCanvas(canvas, generatedCanvas) {
+    loadCanvas(canvas) {
         var _a;
-        if (!canvas.className) {
-            canvas.className = Constants.canvasClass;
-        }
         if (this.generatedCanvas) {
             (_a = this.element) === null || _a === void 0 ? void 0 : _a.remove();
         }
-        this.generatedCanvas = generatedCanvas !== null && generatedCanvas !== void 0 ? generatedCanvas : this.generatedCanvas;
+        this.generatedCanvas =
+            canvas.dataset && Constants.generatedAttribute in canvas.dataset
+                ? canvas.dataset[Constants.generatedAttribute] === "true"
+                : this.generatedCanvas;
         this.element = canvas;
         this.originalStyle = deepExtend({}, this.element.style);
         this.size.height = canvas.offsetHeight;
@@ -71,7 +71,7 @@ export class Canvas {
             });
         }
     }
-    windowResize() {
+    async windowResize() {
         if (!this.element) {
             return;
         }
@@ -85,7 +85,7 @@ export class Canvas {
             }
         }
         if (needsRefresh) {
-            container.refresh();
+            await container.refresh();
         }
     }
     resize() {
@@ -273,12 +273,12 @@ export class Canvas {
         const originalStyle = this.originalStyle;
         if (options.fullScreen.enable) {
             this.originalStyle = deepExtend({}, element.style);
-            element.style.position = "fixed";
-            element.style.zIndex = options.fullScreen.zIndex.toString(10);
-            element.style.top = "0";
-            element.style.left = "0";
-            element.style.width = "100%";
-            element.style.height = "100%";
+            element.style.setProperty("position", "fixed", "important");
+            element.style.setProperty("z-index", options.fullScreen.zIndex.toString(10), "important");
+            element.style.setProperty("top", "0", "important");
+            element.style.setProperty("left", "0", "important");
+            element.style.setProperty("width", "100%", "important");
+            element.style.setProperty("height", "100%", "important");
         }
         else if (originalStyle) {
             element.style.position = originalStyle.position;
@@ -288,6 +288,16 @@ export class Canvas {
             element.style.width = originalStyle.width;
             element.style.height = originalStyle.height;
         }
+        for (const key in options.style) {
+            if (!key || !options.style) {
+                continue;
+            }
+            const value = options.style[key];
+            if (!value) {
+                continue;
+            }
+            element.style.setProperty(key, value, "important");
+        }
     }
     paintBase(baseColor) {
         this.draw((ctx) => {

package/esm/Core/Container.d.ts

@@ -2,12 +2,11 @@ import { Canvas } from "./Canvas";
 import { Particles } from "./Particles";
 import { Retina } from "./Retina";
 import type { IOptions } from "../Options/Interfaces/IOptions";
-import { FrameManager } from "./FrameManager";
+import { FrameManager, Vector } from "./Utils";
 import type { RecursivePartial } from "../Types";
 import { Options } from "../Options/Classes/Options";
 import { Particle } from "./Particle";
-import { Vector } from "./Particle/Vector";
-import { IAttract, IBubble, IContainerInteractivity, IContainerPlugin, IMovePathGenerator, IRepulse, IShapeDrawer } from "./Interfaces";
+import type { IAttract, IBubble, IContainerInteractivity, IContainerPlugin, IMovePathGenerator, IRepulse, IShapeDrawer } from "./Interfaces";
 export declare class Container {
     readonly id: string;
     started: boolean;

package/esm/Core/Container.js

@@ -1,10 +1,9 @@
 import { Canvas } from "./Canvas";
 import { Particles } from "./Particles";
 import { Retina } from "./Retina";
-import { FrameManager } from "./FrameManager";
+import { EventListeners, FrameManager, Plugins, Vector } from "./Utils";
 import { Options } from "../Options/Classes/Options";
-import { animate, cancelAnimation, EventListeners, getRangeValue, Plugins } from "../Utils";
-import { Vector } from "./Particle/Vector";
+import { animate, cancelAnimation, getRangeValue } from "../Utils";
 export class Container {
     constructor(id, sourceOptions, ...presets) {
         this.id = id;

package/esm/Core/Interfaces/ICircleBouncer.d.ts

@@ -1,4 +1,4 @@
-import type { Vector } from "../Particle/Vector";
+import type { Vector } from "../Utils";
 import type { ICoordinates } from "./ICoordinates";
 export interface ICircleBouncer {
     position: ICoordinates;

package/esm/Core/Interfaces/IMovePathGenerator.d.ts

@@ -1,6 +1,6 @@
 import type { Container } from "../Container";
 import type { Particle } from "../Particle";
-import { Vector } from "../Particle/Vector";
+import { Vector } from "../Utils";
 export interface IMovePathGenerator {
     generate: (particle: Particle) => Vector;
     init: (container: Container) => void;

package/esm/Core/Interfaces/IParticle.d.ts

@@ -7,7 +7,7 @@ import type { IBubbleParticleData } from "./IBubbleParticleData";
 import type { IParticles } from "../../Options/Interfaces/Particles/IParticles";
 import type { IHsl, IRgb } from "./Colors";
 import type { IParticleHslAnimation } from "./IParticleHslAnimation";
-import type { Vector } from "../Particle/Vector";
+import type { Vector } from "../Utils";
 import type { IParticleGradientAnimation } from "./IParticleGradientAnimation";
 import type { IParticleRetinaProps } from "./IParticleRetinaProps";
 import type { IParticleRoll } from "./IParticleRoll";

package/esm/Core/Interfaces/index.d.ts

@@ -19,13 +19,15 @@ export * from "./IParticle";
 export * from "./IParticleGradientAnimation";
 export * from "./IParticleGradientColorAnimation";
 export * from "./IParticleHslAnimation";
+export * from "./IParticlesInteractor";
 export * from "./IParticleLife";
 export * from "./IParticleLoops";
 export * from "./IParticleRetinaProps";
+export * from "./IParticleRoll";
 export * from "./IParticleSpin";
 export * from "./IParticleUpdater";
 export * from "./IParticleValueAnimation";
-export * from "./IParticlesInteractor";
+export * from "./IParticleWobble";
 export * from "./IPlugin";
 export * from "./IRangeValue";
 export * from "./IRectSideResult";

package/esm/Core/Interfaces/index.js

@@ -19,13 +19,15 @@ export * from "./IParticle";
 export * from "./IParticleGradientAnimation";
 export * from "./IParticleGradientColorAnimation";
 export * from "./IParticleHslAnimation";
+export * from "./IParticlesInteractor";
 export * from "./IParticleLife";
 export * from "./IParticleLoops";
 export * from "./IParticleRetinaProps";
+export * from "./IParticleRoll";
 export * from "./IParticleSpin";
 export * from "./IParticleUpdater";
 export * from "./IParticleValueAnimation";
-export * from "./IParticlesInteractor";
+export * from "./IParticleWobble";
 export * from "./IPlugin";
 export * from "./IRangeValue";
 export * from "./IRectSideResult";

package/esm/Core/Loader.js

@@ -1,5 +1,6 @@
 import { Container } from "./Container";
-import { Constants, itemFromArray } from "../Utils";
+import { itemFromArray } from "../Utils";
+import { Constants } from "./Utils";
 const tsParticlesDom = [];
 function fetchError(statusCode) {
     console.error(`Error tsParticles - fetch status: ${statusCode}`);
@@ -38,24 +39,19 @@ export class Loader {
             }
         }
         let canvasEl;
-        let generatedCanvas;
         if (domContainer.tagName.toLowerCase() === "canvas") {
             canvasEl = domContainer;
-            generatedCanvas = false;
+            canvasEl.dataset[Constants.generatedAttribute] = "false";
         }
         else {
             const existingCanvases = domContainer.getElementsByTagName("canvas");
             if (existingCanvases.length) {
                 canvasEl = existingCanvases[0];
-                if (!canvasEl.className) {
-                    canvasEl.className = Constants.canvasClass;
-                }
-                generatedCanvas = false;
+                canvasEl.dataset[Constants.generatedAttribute] = "false";
             }
             else {
-                generatedCanvas = true;
                 canvasEl = document.createElement("canvas");
-                canvasEl.className = Constants.canvasClass;
+                canvasEl.dataset[Constants.generatedAttribute] = "true";
                 canvasEl.style.width = "100%";
                 canvasEl.style.height = "100%";
                 domContainer.appendChild(canvasEl);
@@ -68,7 +64,7 @@ export class Loader {
         else {
             dom.push(newItem);
         }
-        newItem.canvas.loadCanvas(canvasEl, generatedCanvas);
+        newItem.canvas.loadCanvas(canvasEl);
         await newItem.start();
         return newItem;
     }

package/esm/Core/Particle.d.ts

@@ -4,11 +4,8 @@ import { ParticlesOptions } from "../Options/Classes/Particles/ParticlesOptions"
 import { ShapeType } from "../Enums";
 import type { RecursivePartial } from "../Types";
 import type { Stroke } from "../Options/Classes/Particles/Stroke";
-import { Vector } from "./Particle/Vector";
-import type { IBubbleParticleData, ICoordinates, ICoordinates3d, IDelta, IHsl, IParticle, IParticleGradientAnimation, IParticleHslAnimation, IParticleLife, IParticleNumericValueAnimation, IParticleSpin, IParticleTiltValueAnimation, IParticleValueAnimation, IRgb, IShapeValues, IParticleRetinaProps } from "./Interfaces";
-import { Vector3d } from "./Particle/Vector3d";
-import { IParticleRoll } from "./Interfaces/IParticleRoll";
-import { IParticleWobble } from "./Interfaces/IParticleWobble";
+import { Vector, Vector3d } from "./Utils";
+import type { IBubbleParticleData, ICoordinates, ICoordinates3d, IDelta, IHsl, IParticle, IParticleGradientAnimation, IParticleHslAnimation, IParticleLife, IParticleNumericValueAnimation, IParticleSpin, IParticleTiltValueAnimation, IParticleValueAnimation, IRgb, IShapeValues, IParticleRetinaProps, IParticleRoll, IParticleWobble } from "./Interfaces";
 export declare class Particle implements IParticle {
     readonly id: number;
     readonly container: Container;

package/esm/Core/Particle.js

@@ -1,9 +1,7 @@
 import { ParticlesOptions } from "../Options/Classes/Particles/ParticlesOptions";
 import { Shape } from "../Options/Classes/Particles/Shape/Shape";
-import { AnimationStatus, DestroyMode, OutMode, RotateDirection, StartValueType, } from "../Enums";
-import { alterHsl, clamp, colorToRgb, deepExtend, getDistance, getHslFromAnimation, getParticleBaseVelocity, getParticleDirectionAngle, getRangeMax, getRangeMin, getRangeValue, getValue, isInArray, itemFromArray, Plugins, randomInRange, setRangeValue, } from "../Utils";
-import { Vector } from "./Particle/Vector";
-import { Vector3d } from "./Particle/Vector3d";
+import { alterHsl, clamp, colorToRgb, deepExtend, getDistance, getHslFromAnimation, getParticleBaseVelocity, getParticleDirectionAngle, getRangeMax, getRangeMin, getRangeValue, getValue, isInArray, itemFromArray, randomInRange, setRangeValue, } from "../Utils";
+import { Plugins, Vector, Vector3d } from "./Utils";
 const fixOutMode = (data) => {
     if (isInArray(data.outMode, data.checkModes) || isInArray(data.outMode, data.checkModes)) {
         if (data.coord > data.maxCoord - data.radius * 2) {
@@ -77,20 +75,20 @@ export class Particle {
         };
         const sizeAnimation = sizeOptions.animation;
         if (sizeAnimation.enable) {
-            this.size.status = AnimationStatus.increasing;
+            this.size.status = 0;
             switch (sizeAnimation.startValue) {
-                case StartValueType.min:
+                case "min":
                     this.size.value = this.size.min;
-                    this.size.status = AnimationStatus.increasing;
+                    this.size.status = 0;
                     break;
-                case StartValueType.random:
+                case "random":
                     this.size.value = randomInRange(this.size) * pxRatio;
-                    this.size.status = Math.random() >= 0.5 ? AnimationStatus.increasing : AnimationStatus.decreasing;
+                    this.size.status = Math.random() >= 0.5 ? 0 : 1;
                     break;
-                case StartValueType.max:
+                case "max":
                 default:
                     this.size.value = this.size.max;
-                    this.size.status = AnimationStatus.decreasing;
+                    this.size.status = 1;
                     break;
             }
             this.size.velocity =
@@ -141,7 +139,7 @@ export class Particle {
             const distance = getDistance(pos, spinCenter);
             this.spin = {
                 center: spinCenter,
-                direction: this.velocity.x >= 0 ? RotateDirection.clockwise : RotateDirection.counterClockwise,
+                direction: this.velocity.x >= 0 ? "clockwise" : "counter-clockwise",
                 angle: this.velocity.angle,
                 radius: distance,
                 acceleration: (_j = this.retina.spinAcceleration) !== null && _j !== void 0 ? _j : getRangeValue(this.options.move.spin.acceleration),
@@ -231,7 +229,7 @@ export class Particle {
             return;
         }
         const destroyOptions = this.options.destroy;
-        if (destroyOptions.mode === DestroyMode.split) {
+        if (destroyOptions.mode === "split") {
             this.split();
         }
     }
@@ -265,7 +263,7 @@ export class Particle {
         const outModes = this.options.move.outModes, fixHorizontal = (outMode) => {
             fixOutMode({
                 outMode,
-                checkModes: [OutMode.bounce, OutMode.bounceHorizontal],
+                checkModes: ["bounce", "bounce-horizontal"],
                 coord: pos.x,
                 maxCoord: container.canvas.size.width,
                 setCb: (value) => (pos.x += value),
@@ -274,7 +272,7 @@ export class Particle {
         }, fixVertical = (outMode) => {
             fixOutMode({
                 outMode,
-                checkModes: [OutMode.bounce, OutMode.bounceVertical],
+                checkModes: ["bounce", "bounce-vertical"],
                 coord: pos.y,
                 maxCoord: container.canvas.size.height,
                 setCb: (value) => (pos.y += value),

package/esm/Core/Particles.d.ts

@@ -1,9 +1,9 @@
 import type { Container } from "./Container";
 import { Particle } from "./Particle";
-import { QuadTree } from "../Utils";
 import type { RecursivePartial } from "../Types";
 import type { IParticles } from "../Options/Interfaces/Particles/IParticles";
 import type { ICoordinates, IDelta, IMouseData, IParticle, IRgb } from "./Interfaces";
+import { QuadTree } from "./Utils";
 export declare class Particles {
     private readonly container;
     get count(): number;