@tsparticles/engine 3.0.0-beta.0 → 3.0.0-beta.2

package/cjs/Core/Canvas.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Canvas = void 0;
-const CanvasUtils_1 = require("../Utils/CanvasUtils");
-const Utils_1 = require("../Utils/Utils");
-const ColorUtils_1 = require("../Utils/ColorUtils");
-const Constants_1 = require("./Utils/Constants");
+const CanvasUtils_js_1 = require("../Utils/CanvasUtils.js");
+const Utils_js_1 = require("../Utils/Utils.js");
+const ColorUtils_js_1 = require("../Utils/ColorUtils.js");
+const Constants_js_1 = require("./Utils/Constants.js");
 function setTransformValue(factor, newFactor, key) {
     const newValue = newFactor[key];
     if (newValue !== undefined) {
@@ -48,10 +48,10 @@ class Canvas {
             let fColor, sColor;
             for (const plugin of this._colorPlugins) {
                 if (!fColor && plugin.particleFillColor) {
-                    fColor = (0, ColorUtils_1.rangeColorToHsl)(plugin.particleFillColor(particle));
+                    fColor = (0, ColorUtils_js_1.rangeColorToHsl)(plugin.particleFillColor(particle));
                 }
                 if (!sColor && plugin.particleStrokeColor) {
-                    sColor = (0, ColorUtils_1.rangeColorToHsl)(plugin.particleStrokeColor(particle));
+                    sColor = (0, ColorUtils_js_1.rangeColorToHsl)(plugin.particleStrokeColor(particle));
                 }
                 if (fColor && sColor) {
                     break;
@@ -60,13 +60,13 @@ class Canvas {
             return [fColor, sColor];
         };
         this._initCover = () => {
-            const options = this.container.actualOptions, cover = options.backgroundMask.cover, color = cover.color, coverRgb = (0, ColorUtils_1.rangeColorToRgb)(color);
+            const options = this.container.actualOptions, cover = options.backgroundMask.cover, color = cover.color, coverRgb = (0, ColorUtils_js_1.rangeColorToRgb)(color);
             if (coverRgb) {
                 const coverColor = {
                     ...coverRgb,
                     a: cover.opacity,
                 };
-                this._coverColorStyle = (0, ColorUtils_1.getStyleFromRgb)(coverColor, coverColor.a);
+                this._coverColorStyle = (0, ColorUtils_js_1.getStyleFromRgb)(coverColor, coverColor.a);
             }
         };
         this._initStyle = () => {
@@ -75,7 +75,7 @@ class Canvas {
                 return;
             }
             if (this._fullScreen) {
-                this._originalStyle = (0, Utils_1.deepExtend)({}, element.style);
+                this._originalStyle = (0, Utils_js_1.deepExtend)({}, element.style);
                 this._setFullScreenStyle();
             }
             else {
@@ -98,7 +98,7 @@ class Canvas {
                 return;
             }
             if (trailFill.color) {
-                const fillColor = (0, ColorUtils_1.rangeColorToRgb)(trailFill.color);
+                const fillColor = (0, ColorUtils_js_1.rangeColorToRgb)(trailFill.color);
                 if (!fillColor) {
                     return;
                 }
@@ -131,10 +131,10 @@ class Canvas {
             }
         };
         this._paintBase = (baseColor) => {
-            this.draw((ctx) => (0, CanvasUtils_1.paintBase)(ctx, this.size, baseColor));
+            this.draw((ctx) => (0, CanvasUtils_js_1.paintBase)(ctx, this.size, baseColor));
         };
         this._paintImage = (image, opacity) => {
-            this.draw((ctx) => (0, CanvasUtils_1.paintImage)(ctx, this.size, image, opacity));
+            this.draw((ctx) => (0, CanvasUtils_js_1.paintImage)(ctx, this.size, image, opacity));
         };
         this._repairStyle = () => {
             const element = this.element;
@@ -199,7 +199,7 @@ class Canvas {
         }
         else if (trail.enable && trail.length > 0 && trailFill) {
             if (trailFill.color) {
-                this._paintBase((0, ColorUtils_1.getStyleFromRgb)(trailFill.color, trailFill.opacity));
+                this._paintBase((0, ColorUtils_js_1.getStyleFromRgb)(trailFill.color, trailFill.opacity));
             }
             else if (trailFill.image) {
                 this._paintImage(trailFill.image, trailFill.opacity);
@@ -207,7 +207,7 @@ class Canvas {
         }
         else {
             this.draw((ctx) => {
-                (0, CanvasUtils_1.clear)(ctx, this.size);
+                (0, CanvasUtils_js_1.clear)(ctx, this.size);
             });
         }
     }
@@ -253,11 +253,11 @@ class Canvas {
         }
         this.draw((ctx) => {
             const container = this.container, options = container.actualOptions, zIndexOptions = particle.options.zIndex, zOpacityFactor = (1 - particle.zIndexFactor) ** zIndexOptions.opacityRate, opacity = particle.bubble.opacity ?? particle.opacity?.value ?? 1, strokeOpacity = particle.strokeOpacity ?? opacity, zOpacity = opacity * zOpacityFactor, zStrokeOpacity = strokeOpacity * zOpacityFactor, transform = {}, colorStyles = {
-                fill: fColor ? (0, ColorUtils_1.getStyleFromHsl)(fColor, zOpacity) : undefined,
+                fill: fColor ? (0, ColorUtils_js_1.getStyleFromHsl)(fColor, zOpacity) : undefined,
             };
-            colorStyles.stroke = sColor ? (0, ColorUtils_1.getStyleFromHsl)(sColor, zStrokeOpacity) : colorStyles.fill;
+            colorStyles.stroke = sColor ? (0, ColorUtils_js_1.getStyleFromHsl)(sColor, zStrokeOpacity) : colorStyles.fill;
             this._applyPreDrawUpdaters(ctx, particle, radius, zOpacity, colorStyles, transform);
-            (0, CanvasUtils_1.drawParticle)({
+            (0, CanvasUtils_js_1.drawParticle)({
                 container,
                 context: ctx,
                 particle,
@@ -274,14 +274,14 @@ class Canvas {
         });
     }
     drawParticlePlugin(plugin, particle, delta) {
-        this.draw((ctx) => (0, CanvasUtils_1.drawParticlePlugin)(ctx, plugin, particle, delta));
+        this.draw((ctx) => (0, CanvasUtils_js_1.drawParticlePlugin)(ctx, plugin, particle, delta));
     }
     drawPlugin(plugin, delta) {
-        this.draw((ctx) => (0, CanvasUtils_1.drawPlugin)(ctx, plugin, delta));
+        this.draw((ctx) => (0, CanvasUtils_js_1.drawPlugin)(ctx, plugin, delta));
     }
     async init() {
         this._safeMutationObserver((obs) => obs.disconnect());
-        this._mutationObserver = (0, Utils_1.safeMutationObserver)((records) => {
+        this._mutationObserver = (0, Utils_js_1.safeMutationObserver)((records) => {
             for (const record of records) {
                 if (record.type === "attributes" && record.attributeName === "style") {
                     this._repairStyle();
@@ -295,7 +295,7 @@ class Canvas {
             await this._initTrail();
         }
         catch (e) {
-            (0, Utils_1.getLogger)().error(e);
+            (0, Utils_js_1.getLogger)().error(e);
         }
         this.initBackground();
         this._safeMutationObserver((obs) => {
@@ -318,8 +318,8 @@ class Canvas {
             return;
         }
         if (background.color) {
-            const color = (0, ColorUtils_1.rangeColorToRgb)(background.color);
-            elementStyle.backgroundColor = color ? (0, ColorUtils_1.getStyleFromRgb)(color, background.opacity) : "";
+            const color = (0, ColorUtils_js_1.rangeColorToRgb)(background.color);
+            elementStyle.backgroundColor = color ? (0, ColorUtils_js_1.getStyleFromRgb)(color, background.opacity) : "";
         }
         else {
             elementStyle.backgroundColor = "";
@@ -357,12 +357,12 @@ class Canvas {
             this.element.remove();
         }
         this._generated =
-            canvas.dataset && Constants_1.generatedAttribute in canvas.dataset
-                ? canvas.dataset[Constants_1.generatedAttribute] === "true"
+            canvas.dataset && Constants_js_1.generatedAttribute in canvas.dataset
+                ? canvas.dataset[Constants_js_1.generatedAttribute] === "true"
                 : this._generated;
         this.element = canvas;
         this.element.ariaHidden = "true";
-        this._originalStyle = (0, Utils_1.deepExtend)({}, this.element.style);
+        this._originalStyle = (0, Utils_js_1.deepExtend)({}, this.element.style);
         this.size.height = canvas.offsetHeight;
         this.size.width = canvas.offsetWidth;
         this._context = this.element.getContext("2d");
@@ -379,7 +379,7 @@ class Canvas {
         const options = this.container.actualOptions;
         this.draw((ctx) => {
             if (options.backgroundMask.enable && options.backgroundMask.cover) {
-                (0, CanvasUtils_1.clear)(ctx, this.size);
+                (0, CanvasUtils_js_1.clear)(ctx, this.size);
                 this._paintBase(this._coverColorStyle);
             }
             else {
@@ -415,7 +415,7 @@ class Canvas {
     stop() {
         this._safeMutationObserver((obs) => obs.disconnect());
         this._mutationObserver = undefined;
-        this.draw((ctx) => (0, CanvasUtils_1.clear)(ctx, this.size));
+        this.draw((ctx) => (0, CanvasUtils_js_1.clear)(ctx, this.size));
     }
     async windowResize() {
         if (!this.element || !this.resize()) {

package/cjs/Core/Container.js

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Container = void 0;
-const Canvas_1 = require("./Canvas");
-const EventListeners_1 = require("./Utils/EventListeners");
-const Options_1 = require("../Options/Classes/Options");
-const Particles_1 = require("./Particles");
-const Retina_1 = require("./Retina");
-const Constants_1 = require("./Utils/Constants");
-const Utils_1 = require("../Utils/Utils");
-const NumberUtils_1 = require("../Utils/NumberUtils");
-const OptionsUtils_1 = require("../Utils/OptionsUtils");
+const Canvas_js_1 = require("./Canvas.js");
+const EventListeners_js_1 = require("./Utils/EventListeners.js");
+const Options_js_1 = require("../Options/Classes/Options.js");
+const Particles_js_1 = require("./Particles.js");
+const Retina_js_1 = require("./Retina.js");
+const Constants_js_1 = require("./Utils/Constants.js");
+const Utils_js_1 = require("../Utils/Utils.js");
+const NumberUtils_js_1 = require("../Utils/NumberUtils.js");
+const OptionsUtils_js_1 = require("../Utils/OptionsUtils.js");
 function guardCheck(container) {
     return container && !container.destroyed;
 }
@@ -20,8 +20,8 @@ function initDelta(value, fpsLimit = 60, smooth = false) {
     };
 }
 function loadContainerOptions(engine, container, ...sourceOptionsArr) {
-    const options = new Options_1.Options(engine, container);
-    (0, OptionsUtils_1.loadOptions)(options, ...sourceOptionsArr);
+    const options = new Options_js_1.Options(engine, container);
+    (0, OptionsUtils_js_1.loadOptions)(options, ...sourceOptionsArr);
     return options;
 }
 class Container {
@@ -64,7 +64,7 @@ class Container {
                 }
             }
             catch (e) {
-                (0, Utils_1.getLogger)().error(`${Constants_1.errorPrefix} in animation loop`, e);
+                (0, Utils_js_1.getLogger)().error(`${Constants_js_1.errorPrefix} in animation loop`, e);
             }
         };
         this._engine = engine;
@@ -82,9 +82,9 @@ class Container {
         this.pageHidden = false;
         this._sourceOptions = sourceOptions;
         this._initialSourceOptions = sourceOptions;
-        this.retina = new Retina_1.Retina(this);
-        this.canvas = new Canvas_1.Canvas(this);
-        this.particles = new Particles_1.Particles(this._engine, this);
+        this.retina = new Retina_js_1.Retina(this);
+        this.canvas = new Canvas_js_1.Canvas(this);
+        this.particles = new Particles_js_1.Particles(this._engine, this);
         this.pathGenerators = new Map();
         this.interactivity = {
             mouse: {
@@ -96,7 +96,7 @@ class Container {
         this.drawers = new Map();
         this._options = loadContainerOptions(this._engine, this);
         this.actualOptions = loadContainerOptions(this._engine, this);
-        this._eventListeners = new EventListeners_1.EventListeners(this);
+        this._eventListeners = new EventListeners_js_1.EventListeners(this);
         if (typeof IntersectionObserver !== "undefined" && IntersectionObserver) {
             this._intersectionObserver = new IntersectionObserver((entries) => this._intersectionManager(entries));
         }
@@ -243,7 +243,7 @@ class Container {
             }
             return res.blob;
         }
-        (0, Utils_1.getLogger)().error(`${Constants_1.errorPrefix} - Export plugin with type ${type} not found`);
+        (0, Utils_js_1.getLogger)().error(`${Constants_js_1.errorPrefix} - Export plugin with type ${type} not found`);
     }
     getAnimationStatus() {
         return !this._paused && !this.pageHidden && guardCheck(this);
@@ -280,8 +280,8 @@ class Container {
         this.canvas.initBackground();
         this.canvas.resize();
         this.zLayers = this.actualOptions.zLayers;
-        this._duration = (0, NumberUtils_1.getRangeValue)(this.actualOptions.duration) * 1000;
-        this._delay = (0, NumberUtils_1.getRangeValue)(this.actualOptions.delay) * 1000;
+        this._duration = (0, NumberUtils_js_1.getRangeValue)(this.actualOptions.duration) * 1000;
+        this._delay = (0, NumberUtils_js_1.getRangeValue)(this.actualOptions.delay) * 1000;
         this._lifeTime = 0;
         this.fpsLimit = this.actualOptions.fpsLimit > 0 ? this.actualOptions.fpsLimit : 120;
         this.smooth = this.actualOptions.smooth;

package/cjs/Core/Engine.js

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Engine = void 0;
-const Constants_1 = require("./Utils/Constants");
-const Utils_1 = require("../Utils/Utils");
-const Container_1 = require("./Container");
-const EventDispatcher_1 = require("../Utils/EventDispatcher");
-const NumberUtils_1 = require("../Utils/NumberUtils");
+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 NumberUtils_js_1 = require("../Utils/NumberUtils.js");
 function getItemsFromInitializer(container, map, initializers, force = false) {
     let res = map.get(container);
     if (!res || force) {
@@ -15,7 +15,7 @@ function getItemsFromInitializer(container, map, initializers, force = false) {
     return res;
 }
 async function getDataFromUrl(data) {
-    const url = (0, Utils_1.itemFromSingleOrMultiple)(data.url, data.index);
+    const url = (0, Utils_js_1.itemFromSingleOrMultiple)(data.url, data.index);
     if (!url) {
         return data.fallback;
     }
@@ -23,14 +23,14 @@ async function getDataFromUrl(data) {
     if (response.ok) {
         return response.json();
     }
-    (0, Utils_1.getLogger)().error(`${Constants_1.errorPrefix} ${response.status} while retrieving config file`);
+    (0, Utils_js_1.getLogger)().error(`${Constants_js_1.errorPrefix} ${response.status} while retrieving config file`);
     return data.fallback;
 }
 class Engine {
     constructor() {
         this._configs = new Map();
         this._domArray = [];
-        this._eventDispatcher = new EventDispatcher_1.EventDispatcher();
+        this._eventDispatcher = new EventDispatcher_js_1.EventDispatcher();
         this._initialized = false;
         this.plugins = [];
         this._initializers = {
@@ -53,10 +53,10 @@ class Engine {
         return res;
     }
     get version() {
-        return "3.0.0-beta.0";
+        return "3.0.0-beta.2";
     }
     addConfig(nameOrConfig, config) {
-        if ((0, Utils_1.isString)(nameOrConfig)) {
+        if ((0, Utils_js_1.isString)(nameOrConfig)) {
             if (config) {
                 config.name = nameOrConfig;
                 this._configs.set(nameOrConfig, config);
@@ -96,28 +96,28 @@ class Engine {
     async addShape(shape, drawer, initOrRefresh, afterEffectOrRefresh, destroyOrRefresh, refresh = true) {
         let customDrawer;
         let realRefresh = refresh, realInit, realAfterEffect, realDestroy;
-        if ((0, Utils_1.isBoolean)(initOrRefresh)) {
+        if ((0, Utils_js_1.isBoolean)(initOrRefresh)) {
             realRefresh = initOrRefresh;
             realInit = undefined;
         }
         else {
             realInit = initOrRefresh;
         }
-        if ((0, Utils_1.isBoolean)(afterEffectOrRefresh)) {
+        if ((0, Utils_js_1.isBoolean)(afterEffectOrRefresh)) {
             realRefresh = afterEffectOrRefresh;
             realAfterEffect = undefined;
         }
         else {
             realAfterEffect = afterEffectOrRefresh;
         }
-        if ((0, Utils_1.isBoolean)(destroyOrRefresh)) {
+        if ((0, Utils_js_1.isBoolean)(destroyOrRefresh)) {
             realRefresh = destroyOrRefresh;
             realDestroy = undefined;
         }
         else {
             realDestroy = destroyOrRefresh;
         }
-        if ((0, Utils_1.isFunction)(drawer)) {
+        if ((0, Utils_js_1.isFunction)(drawer)) {
             customDrawer = {
                 afterEffect: realAfterEffect,
                 destroy: realDestroy,
@@ -128,7 +128,7 @@ class Engine {
         else {
             customDrawer = drawer;
         }
-        (0, Utils_1.executeOnSingleOrMultiple)(shape, (type) => {
+        (0, Utils_js_1.executeOnSingleOrMultiple)(shape, (type) => {
             !this.getShapeDrawer(type) && this.drawers.set(type, customDrawer);
         });
         await this.refresh(realRefresh);
@@ -190,14 +190,14 @@ class Engine {
         this._initialized = true;
     }
     async load(params) {
-        const id = params.id ?? `tsparticles${Math.floor((0, NumberUtils_1.getRandom)() * 10000)}`, { index, url } = params, options = url ? await getDataFromUrl({ fallback: params.options, url, index }) : params.options;
+        const id = params.id ?? `tsparticles${Math.floor((0, NumberUtils_js_1.getRandom)() * 10000)}`, { 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_1.itemFromSingleOrMultiple)(options, index), dom = this.dom(), oldIndex = dom.findIndex((v) => v.id === id);
+        const currentOptions = (0, Utils_js_1.itemFromSingleOrMultiple)(options, index), dom = this.dom(), oldIndex = dom.findIndex((v) => v.id === id);
         if (oldIndex >= 0) {
             const old = this.domItem(oldIndex);
             if (old && !old.destroyed) {
@@ -208,17 +208,17 @@ class Engine {
         let canvasEl;
         if (domContainer.tagName.toLowerCase() === "canvas") {
             canvasEl = domContainer;
-            canvasEl.dataset[Constants_1.generatedAttribute] = "false";
+            canvasEl.dataset[Constants_js_1.generatedAttribute] = "false";
         }
         else {
             const existingCanvases = domContainer.getElementsByTagName("canvas");
             if (existingCanvases.length) {
                 canvasEl = existingCanvases[0];
-                canvasEl.dataset[Constants_1.generatedAttribute] = "false";
+                canvasEl.dataset[Constants_js_1.generatedAttribute] = "false";
             }
             else {
                 canvasEl = document.createElement("canvas");
-                canvasEl.dataset[Constants_1.generatedAttribute] = "true";
+                canvasEl.dataset[Constants_js_1.generatedAttribute] = "true";
                 domContainer.appendChild(canvasEl);
             }
         }
@@ -228,7 +228,7 @@ class Engine {
         if (!canvasEl.style.height) {
             canvasEl.style.height = "100%";
         }
-        const newItem = new Container_1.Container(this, id, currentOptions);
+        const newItem = new Container_js_1.Container(this, id, currentOptions);
         if (oldIndex >= 0) {
             dom.splice(oldIndex, 0, newItem);
         }
@@ -265,7 +265,7 @@ class Engine {
     setOnClickHandler(callback) {
         const dom = this.dom();
         if (!dom.length) {
-            throw new Error(`${Constants_1.errorPrefix} can only set click handlers after calling tsParticles.load()`);
+            throw new Error(`${Constants_js_1.errorPrefix} can only set click handlers after calling tsParticles.load()`);
         }
         for (const domItem of dom) {
             domItem.addClickHandler(callback);

package/cjs/Core/Particle.js

@@ -1,17 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Particle = void 0;
-const NumberUtils_1 = require("../Utils/NumberUtils");
-const Utils_1 = require("../Utils/Utils");
-const ColorUtils_1 = require("../Utils/ColorUtils");
-const Interactivity_1 = require("../Options/Classes/Interactivity/Interactivity");
-const Vector_1 = require("./Utils/Vector");
-const Vector3d_1 = require("./Utils/Vector3d");
-const CanvasUtils_1 = require("../Utils/CanvasUtils");
-const Constants_1 = require("./Utils/Constants");
-const OptionsUtils_1 = require("../Utils/OptionsUtils");
+const NumberUtils_js_1 = require("../Utils/NumberUtils.js");
+const Utils_js_1 = require("../Utils/Utils.js");
+const ColorUtils_js_1 = require("../Utils/ColorUtils.js");
+const Interactivity_js_1 = require("../Options/Classes/Interactivity/Interactivity.js");
+const Vector_js_1 = require("./Utils/Vector.js");
+const Vector3d_js_1 = require("./Utils/Vector3d.js");
+const CanvasUtils_js_1 = require("../Utils/CanvasUtils.js");
+const Constants_js_1 = require("./Utils/Constants.js");
+const OptionsUtils_js_1 = require("../Utils/OptionsUtils.js");
 const fixOutMode = (data) => {
-    if (!(0, Utils_1.isInArray)(data.outMode, data.checkModes)) {
+    if (!(0, Utils_js_1.isInArray)(data.outMode, data.checkModes)) {
         return;
     }
     const diameter = data.radius * 2;
@@ -29,13 +29,13 @@ class Particle {
             for (const [, plugin] of container.plugins) {
                 const pluginPos = plugin.particlePosition !== undefined ? plugin.particlePosition(position, this) : undefined;
                 if (pluginPos) {
-                    return Vector3d_1.Vector3d.create(pluginPos.x, pluginPos.y, zIndex);
+                    return Vector3d_js_1.Vector3d.create(pluginPos.x, pluginPos.y, zIndex);
                 }
             }
-            const canvasSize = container.canvas.size, exactPosition = (0, NumberUtils_1.calcExactPositionOrRandomFromSize)({
+            const canvasSize = container.canvas.size, exactPosition = (0, NumberUtils_js_1.calcExactPositionOrRandomFromSize)({
                 size: canvasSize,
                 position: position,
-            }), pos = Vector3d_1.Vector3d.create(exactPosition.x, exactPosition.y, zIndex), radius = this.getRadius(), outModes = this.options.move.outModes, fixHorizontal = (outMode) => {
+            }), pos = Vector3d_js_1.Vector3d.create(exactPosition.x, exactPosition.y, zIndex), radius = this.getRadius(), outModes = this.options.move.outModes, fixHorizontal = (outMode) => {
                 fixOutMode({
                     outMode,
                     checkModes: ["bounce", "bounce-horizontal"],
@@ -64,19 +64,19 @@ class Particle {
             return pos;
         };
         this._calculateVelocity = () => {
-            const baseVelocity = (0, NumberUtils_1.getParticleBaseVelocity)(this.direction), res = baseVelocity.copy(), moveOptions = this.options.move;
+            const baseVelocity = (0, NumberUtils_js_1.getParticleBaseVelocity)(this.direction), res = baseVelocity.copy(), moveOptions = this.options.move;
             if (moveOptions.direction === "inside" || moveOptions.direction === "outside") {
                 return res;
             }
-            const rad = (Math.PI / 180) * (0, NumberUtils_1.getRangeValue)(moveOptions.angle.value), radOffset = (Math.PI / 180) * (0, NumberUtils_1.getRangeValue)(moveOptions.angle.offset), range = {
+            const rad = (Math.PI / 180) * (0, NumberUtils_js_1.getRangeValue)(moveOptions.angle.value), radOffset = (Math.PI / 180) * (0, NumberUtils_js_1.getRangeValue)(moveOptions.angle.offset), range = {
                 left: radOffset - rad / 2,
                 right: radOffset + rad / 2,
             };
             if (!moveOptions.straight) {
-                res.angle += (0, NumberUtils_1.randomInRange)((0, NumberUtils_1.setRangeValue)(range.left, range.right));
+                res.angle += (0, NumberUtils_js_1.randomInRange)((0, NumberUtils_js_1.setRangeValue)(range.left, range.right));
             }
             if (moveOptions.random && typeof moveOptions.speed === "number") {
-                res.length *= (0, NumberUtils_1.getRandom)();
+                res.length *= (0, NumberUtils_js_1.getRandom)();
             }
             return res;
         };
@@ -91,9 +91,9 @@ class Particle {
             }
             const retries = overlapOptions.retries;
             if (retries >= 0 && tryCount > retries) {
-                throw new Error(`${Constants_1.errorPrefix} particle is overlapping and can't be placed`);
+                throw new Error(`${Constants_js_1.errorPrefix} particle is overlapping and can't be placed`);
             }
-            return !!this.container.particles.find((particle) => (0, NumberUtils_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) => {
             if (!color || !this.roll || (!this.backColor && !this.roll.alter)) {
@@ -107,21 +107,21 @@ class Particle {
                 return this.backColor;
             }
             if (this.roll.alter) {
-                return (0, CanvasUtils_1.alterHsl)(color, this.roll.alter.type, this.roll.alter.value);
+                return (0, CanvasUtils_js_1.alterHsl)(color, this.roll.alter.type, this.roll.alter.value);
             }
             return color;
         };
         this._initPosition = (position) => {
-            const container = this.container, zIndexValue = (0, NumberUtils_1.getRangeValue)(this.options.zIndex.value);
-            this.position = this._calcPosition(container, position, (0, NumberUtils_1.clamp)(zIndexValue, 0, container.zLayers));
+            const container = this.container, zIndexValue = (0, NumberUtils_js_1.getRangeValue)(this.options.zIndex.value);
+            this.position = this._calcPosition(container, position, (0, NumberUtils_js_1.clamp)(zIndexValue, 0, container.zLayers));
             this.initialPosition = this.position.copy();
             const canvasSize = container.canvas.size;
             this.moveCenter = {
-                ...(0, Utils_1.getPosition)(this.options.move.center, canvasSize),
+                ...(0, Utils_js_1.getPosition)(this.options.move.center, canvasSize),
                 radius: this.options.move.center.radius ?? 0,
                 mode: this.options.move.center.mode ?? "percent",
             };
-            this.direction = (0, NumberUtils_1.getParticleDirectionAngle)(this.options.move.direction, this.position, this.moveCenter);
+            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";
@@ -130,17 +130,17 @@ class Particle {
                     this.outType = "outside";
                     break;
             }
-            this.offset = Vector_1.Vector.origin;
+            this.offset = Vector_js_1.Vector.origin;
         };
         this._loadShapeData = (shapeOptions, reduceDuplicates) => {
             const shapeData = shapeOptions.options[this.shape];
             if (!shapeData) {
                 return;
             }
-            return (0, Utils_1.deepExtend)({
+            return (0, Utils_js_1.deepExtend)({
                 close: shapeOptions.close,
                 fill: shapeOptions.fill,
-            }, (0, Utils_1.itemFromSingleOrMultiple)(shapeData, this.id, reduceDuplicates));
+            }, (0, Utils_js_1.itemFromSingleOrMultiple)(shapeData, this.id, reduceDuplicates));
         };
         this._engine = engine;
         this.init(id, position, overrideOptions, group);
@@ -175,7 +175,7 @@ class Particle {
         canvas.drawParticle(this, delta);
     }
     getFillColor() {
-        return this._getRollColor(this.bubble.color ?? (0, ColorUtils_1.getHslFromAnimation)(this.color));
+        return this._getRollColor(this.bubble.color ?? (0, ColorUtils_js_1.getHslFromAnimation)(this.color));
     }
     getMass() {
         return (this.getRadius() ** 2 * Math.PI) / 2;
@@ -191,7 +191,7 @@ class Particle {
         return this.bubble.radius ?? this.size.value;
     }
     getStrokeColor() {
-        return this._getRollColor(this.bubble.color ?? (0, ColorUtils_1.getHslFromAnimation)(this.strokeColor));
+        return this._getRollColor(this.bubble.color ?? (0, ColorUtils_js_1.getHslFromAnimation)(this.strokeColor));
     }
     init(id, position, overrideOptions, group) {
         const container = this.container, engine = this._engine;
@@ -210,11 +210,11 @@ class Particle {
         };
         this.outType = "normal";
         this.ignoresResizeRatio = true;
-        const pxRatio = container.retina.pixelRatio, mainOptions = container.actualOptions, particlesOptions = (0, OptionsUtils_1.loadParticlesOptions)(this._engine, container, mainOptions.particles), shapeType = particlesOptions.shape.type, { reduceDuplicates } = particlesOptions;
-        this.shape = (0, Utils_1.itemFromSingleOrMultiple)(shapeType, this.id, reduceDuplicates);
+        const pxRatio = container.retina.pixelRatio, mainOptions = container.actualOptions, particlesOptions = (0, OptionsUtils_js_1.loadParticlesOptions)(this._engine, container, mainOptions.particles), shapeType = particlesOptions.shape.type, { reduceDuplicates } = particlesOptions;
+        this.shape = (0, Utils_js_1.itemFromSingleOrMultiple)(shapeType, this.id, reduceDuplicates);
         const shapeOptions = particlesOptions.shape;
         if (overrideOptions && overrideOptions.shape && overrideOptions.shape.type) {
-            const overrideShapeType = overrideOptions.shape.type, shape = (0, Utils_1.itemFromSingleOrMultiple)(overrideShapeType, this.id, reduceDuplicates);
+            const overrideShapeType = overrideOptions.shape.type, shape = (0, Utils_js_1.itemFromSingleOrMultiple)(overrideShapeType, this.id, reduceDuplicates);
             if (shape) {
                 this.shape = shape;
                 shapeOptions.load(overrideOptions.shape);
@@ -226,7 +226,7 @@ class Particle {
         if (shapeData) {
             particlesOptions.load(shapeData.particles);
         }
-        const interactivity = new Interactivity_1.Interactivity(engine, container);
+        const interactivity = new Interactivity_js_1.Interactivity(engine, container);
         interactivity.load(container.actualOptions.interactivity);
         interactivity.load(particlesOptions.interactivity);
         this.interactivity = interactivity;
@@ -234,7 +234,7 @@ class Particle {
         this.close = shapeData?.close ?? particlesOptions.shape.close;
         this.options = particlesOptions;
         const pathOptions = this.options.move.path;
-        this.pathDelay = (0, NumberUtils_1.getValue)(pathOptions.delay) * 1000;
+        this.pathDelay = (0, NumberUtils_js_1.getValue)(pathOptions.delay) * 1000;
         if (pathOptions.generator) {
             this.pathGenerator = this._engine.getPathGenerator(pathOptions.generator);
             if (this.pathGenerator && container.addPath(pathOptions.generator, this.pathGenerator)) {
@@ -242,7 +242,7 @@ class Particle {
             }
         }
         container.retina.initParticle(this);
-        this.size = (0, Utils_1.initParticleNumericAnimationValue)(this.options.size, pxRatio);
+        this.size = (0, Utils_js_1.initParticleNumericAnimationValue)(this.options.size, pxRatio);
         this.bubble = {
             inRange: false,
         };
@@ -253,7 +253,7 @@ class Particle {
         this._initPosition(position);
         this.initialVelocity = this._calculateVelocity();
         this.velocity = this.initialVelocity.copy();
-        this.moveDecay = 1 - (0, NumberUtils_1.getRangeValue)(this.options.move.decay);
+        this.moveDecay = 1 - (0, NumberUtils_js_1.getRangeValue)(this.options.move.decay);
         const particles = container.particles;
         particles.needsSort = particles.needsSort || particles.lastZIndex < this.position.z;
         particles.lastZIndex = this.position.z;
@@ -274,7 +274,7 @@ class Particle {
             this.sides = sideCountFunc(this);
         }
         this.spawning = false;
-        this.shadowColor = (0, ColorUtils_1.rangeColorToRgb)(this.options.shadow.color);
+        this.shadowColor = (0, ColorUtils_js_1.rangeColorToRgb)(this.options.shadow.color);
         for (const updater of container.particles.updaters) {
             updater.init(this);
         }