@tsparticles/interaction-external-cannon 4.1.3 → 4.2.1

package/browser/Cannoner.js

@@ -1,5 +1,5 @@
 import { ExternalInteractorBase, } from "@tsparticles/plugin-interactivity";
-import { Vector, degToRad, double, doublePI, getDistance, getRandomInRange, identity, none, } from "@tsparticles/engine";
+import { Vector, degToRad, double, doublePI, getDistance, getRandomInRange, identity, loadOptionProperty, none, } from "@tsparticles/engine";
 import { Cannon } from "./Options/Classes/Cannon.js";
 var CannonState;
 (function (CannonState) {
@@ -72,10 +72,7 @@ export class Cannoner extends ExternalInteractorBase {
         return this.#state !== CannonState.idle || interactivityData.mouse.clicking;
     }
     loadModeOptions(options, ...sources) {
-        options.cannon ??= new Cannon();
-        for (const source of sources) {
-            options.cannon.load(source?.cannon);
-        }
+        loadOptionProperty(options, "cannon", Cannon, ...sources);
     }
     reset(_interactivityData, _particle) {
     }

package/browser/Options/Classes/Cannon.js

@@ -1,49 +1,24 @@
+import { loadProperty } from "@tsparticles/engine";
 export class Cannon {
-    drawVector;
-    maxDragDistance;
-    maxParticles;
-    minParticles;
-    particleFactor;
-    spread;
-    vectorColor;
-    velocityFactor;
-    constructor() {
-        this.spread = 30;
-        this.velocityFactor = 0.5;
-        this.particleFactor = 0.2;
-        this.maxDragDistance = 0;
-        this.minParticles = 5;
-        this.maxParticles = 200;
-        this.drawVector = true;
-        this.vectorColor = "#ffffff80";
-    }
+    drawVector = true;
+    maxDragDistance = 0;
+    maxParticles = 200;
+    minParticles = 5;
+    particleFactor = 0.2;
+    spread = 30;
+    vectorColor = "#ffffff80";
+    velocityFactor = 0.5;
     load(data) {
         if (!data) {
             return;
         }
-        if (data.spread !== undefined) {
-            this.spread = data.spread;
-        }
-        if (data.velocityFactor !== undefined) {
-            this.velocityFactor = data.velocityFactor;
-        }
-        if (data.particleFactor !== undefined) {
-            this.particleFactor = data.particleFactor;
-        }
-        if (data.minParticles !== undefined) {
-            this.minParticles = data.minParticles;
-        }
-        if (data.maxParticles !== undefined) {
-            this.maxParticles = data.maxParticles;
-        }
-        if (data.maxDragDistance !== undefined) {
-            this.maxDragDistance = data.maxDragDistance;
-        }
-        if (data.drawVector !== undefined) {
-            this.drawVector = data.drawVector;
-        }
-        if (data.vectorColor !== undefined) {
-            this.vectorColor = data.vectorColor;
-        }
+        loadProperty(this, "spread", data.spread);
+        loadProperty(this, "velocityFactor", data.velocityFactor);
+        loadProperty(this, "particleFactor", data.particleFactor);
+        loadProperty(this, "minParticles", data.minParticles);
+        loadProperty(this, "maxParticles", data.maxParticles);
+        loadProperty(this, "maxDragDistance", data.maxDragDistance);
+        loadProperty(this, "drawVector", data.drawVector);
+        loadProperty(this, "vectorColor", data.vectorColor);
     }
 }

package/browser/index.js

@@ -2,7 +2,7 @@ import { ensureInteractivityPluginLoaded } from "@tsparticles/plugin-interactivi
 export { Cannon } from "./Options/Classes/Cannon.js";
 import { Cannoner } from "./Cannoner.js";
 export async function loadExternalCannonInteraction(engine) {
-    engine.checkVersion("4.1.3");
+    engine.checkVersion("4.2.1");
     await engine.pluginManager.register((e) => {
         ensureInteractivityPluginLoaded(e);
         e.pluginManager.addInteractor?.("externalCannon", container => {

package/browser/index.lazy.js

@@ -1,6 +1,6 @@
 export { Cannon } from "./Options/Classes/Cannon.js";
 export async function loadExternalCannonInteraction(engine) {
-    engine.checkVersion("4.1.3");
+    engine.checkVersion("4.2.1");
     await engine.pluginManager.register(async (e) => {
         const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity/lazy");
         ensureInteractivityPluginLoaded(e);

package/cjs/Cannoner.js

@@ -1,5 +1,5 @@
 import { ExternalInteractorBase, } from "@tsparticles/plugin-interactivity";
-import { Vector, degToRad, double, doublePI, getDistance, getRandomInRange, identity, none, } from "@tsparticles/engine";
+import { Vector, degToRad, double, doublePI, getDistance, getRandomInRange, identity, loadOptionProperty, none, } from "@tsparticles/engine";
 import { Cannon } from "./Options/Classes/Cannon.js";
 var CannonState;
 (function (CannonState) {
@@ -72,10 +72,7 @@ export class Cannoner extends ExternalInteractorBase {
         return this.#state !== CannonState.idle || interactivityData.mouse.clicking;
     }
     loadModeOptions(options, ...sources) {
-        options.cannon ??= new Cannon();
-        for (const source of sources) {
-            options.cannon.load(source?.cannon);
-        }
+        loadOptionProperty(options, "cannon", Cannon, ...sources);
     }
     reset(_interactivityData, _particle) {
     }

package/cjs/Options/Classes/Cannon.js

@@ -1,49 +1,24 @@
+import { loadProperty } from "@tsparticles/engine";
 export class Cannon {
-    drawVector;
-    maxDragDistance;
-    maxParticles;
-    minParticles;
-    particleFactor;
-    spread;
-    vectorColor;
-    velocityFactor;
-    constructor() {
-        this.spread = 30;
-        this.velocityFactor = 0.5;
-        this.particleFactor = 0.2;
-        this.maxDragDistance = 0;
-        this.minParticles = 5;
-        this.maxParticles = 200;
-        this.drawVector = true;
-        this.vectorColor = "#ffffff80";
-    }
+    drawVector = true;
+    maxDragDistance = 0;
+    maxParticles = 200;
+    minParticles = 5;
+    particleFactor = 0.2;
+    spread = 30;
+    vectorColor = "#ffffff80";
+    velocityFactor = 0.5;
     load(data) {
         if (!data) {
             return;
         }
-        if (data.spread !== undefined) {
-            this.spread = data.spread;
-        }
-        if (data.velocityFactor !== undefined) {
-            this.velocityFactor = data.velocityFactor;
-        }
-        if (data.particleFactor !== undefined) {
-            this.particleFactor = data.particleFactor;
-        }
-        if (data.minParticles !== undefined) {
-            this.minParticles = data.minParticles;
-        }
-        if (data.maxParticles !== undefined) {
-            this.maxParticles = data.maxParticles;
-        }
-        if (data.maxDragDistance !== undefined) {
-            this.maxDragDistance = data.maxDragDistance;
-        }
-        if (data.drawVector !== undefined) {
-            this.drawVector = data.drawVector;
-        }
-        if (data.vectorColor !== undefined) {
-            this.vectorColor = data.vectorColor;
-        }
+        loadProperty(this, "spread", data.spread);
+        loadProperty(this, "velocityFactor", data.velocityFactor);
+        loadProperty(this, "particleFactor", data.particleFactor);
+        loadProperty(this, "minParticles", data.minParticles);
+        loadProperty(this, "maxParticles", data.maxParticles);
+        loadProperty(this, "maxDragDistance", data.maxDragDistance);
+        loadProperty(this, "drawVector", data.drawVector);
+        loadProperty(this, "vectorColor", data.vectorColor);
     }
 }

package/cjs/index.js

@@ -2,7 +2,7 @@ import { ensureInteractivityPluginLoaded } from "@tsparticles/plugin-interactivi
 export { Cannon } from "./Options/Classes/Cannon.js";
 import { Cannoner } from "./Cannoner.js";
 export async function loadExternalCannonInteraction(engine) {
-    engine.checkVersion("4.1.3");
+    engine.checkVersion("4.2.1");
     await engine.pluginManager.register((e) => {
         ensureInteractivityPluginLoaded(e);
         e.pluginManager.addInteractor?.("externalCannon", container => {

package/cjs/index.lazy.js

@@ -1,6 +1,6 @@
 export { Cannon } from "./Options/Classes/Cannon.js";
 export async function loadExternalCannonInteraction(engine) {
-    engine.checkVersion("4.1.3");
+    engine.checkVersion("4.2.1");
     await engine.pluginManager.register(async (e) => {
         const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity/lazy");
         ensureInteractivityPluginLoaded(e);

package/esm/Cannoner.js

@@ -1,5 +1,5 @@
 import { ExternalInteractorBase, } from "@tsparticles/plugin-interactivity";
-import { Vector, degToRad, double, doublePI, getDistance, getRandomInRange, identity, none, } from "@tsparticles/engine";
+import { Vector, degToRad, double, doublePI, getDistance, getRandomInRange, identity, loadOptionProperty, none, } from "@tsparticles/engine";
 import { Cannon } from "./Options/Classes/Cannon.js";
 var CannonState;
 (function (CannonState) {
@@ -72,10 +72,7 @@ export class Cannoner extends ExternalInteractorBase {
         return this.#state !== CannonState.idle || interactivityData.mouse.clicking;
     }
     loadModeOptions(options, ...sources) {
-        options.cannon ??= new Cannon();
-        for (const source of sources) {
-            options.cannon.load(source?.cannon);
-        }
+        loadOptionProperty(options, "cannon", Cannon, ...sources);
     }
     reset(_interactivityData, _particle) {
     }

package/esm/Options/Classes/Cannon.js

@@ -1,49 +1,24 @@
+import { loadProperty } from "@tsparticles/engine";
 export class Cannon {
-    drawVector;
-    maxDragDistance;
-    maxParticles;
-    minParticles;
-    particleFactor;
-    spread;
-    vectorColor;
-    velocityFactor;
-    constructor() {
-        this.spread = 30;
-        this.velocityFactor = 0.5;
-        this.particleFactor = 0.2;
-        this.maxDragDistance = 0;
-        this.minParticles = 5;
-        this.maxParticles = 200;
-        this.drawVector = true;
-        this.vectorColor = "#ffffff80";
-    }
+    drawVector = true;
+    maxDragDistance = 0;
+    maxParticles = 200;
+    minParticles = 5;
+    particleFactor = 0.2;
+    spread = 30;
+    vectorColor = "#ffffff80";
+    velocityFactor = 0.5;
     load(data) {
         if (!data) {
             return;
         }
-        if (data.spread !== undefined) {
-            this.spread = data.spread;
-        }
-        if (data.velocityFactor !== undefined) {
-            this.velocityFactor = data.velocityFactor;
-        }
-        if (data.particleFactor !== undefined) {
-            this.particleFactor = data.particleFactor;
-        }
-        if (data.minParticles !== undefined) {
-            this.minParticles = data.minParticles;
-        }
-        if (data.maxParticles !== undefined) {
-            this.maxParticles = data.maxParticles;
-        }
-        if (data.maxDragDistance !== undefined) {
-            this.maxDragDistance = data.maxDragDistance;
-        }
-        if (data.drawVector !== undefined) {
-            this.drawVector = data.drawVector;
-        }
-        if (data.vectorColor !== undefined) {
-            this.vectorColor = data.vectorColor;
-        }
+        loadProperty(this, "spread", data.spread);
+        loadProperty(this, "velocityFactor", data.velocityFactor);
+        loadProperty(this, "particleFactor", data.particleFactor);
+        loadProperty(this, "minParticles", data.minParticles);
+        loadProperty(this, "maxParticles", data.maxParticles);
+        loadProperty(this, "maxDragDistance", data.maxDragDistance);
+        loadProperty(this, "drawVector", data.drawVector);
+        loadProperty(this, "vectorColor", data.vectorColor);
     }
 }

package/esm/index.js

@@ -2,7 +2,7 @@ import { ensureInteractivityPluginLoaded } from "@tsparticles/plugin-interactivi
 export { Cannon } from "./Options/Classes/Cannon.js";
 import { Cannoner } from "./Cannoner.js";
 export async function loadExternalCannonInteraction(engine) {
-    engine.checkVersion("4.1.3");
+    engine.checkVersion("4.2.1");
     await engine.pluginManager.register((e) => {
         ensureInteractivityPluginLoaded(e);
         e.pluginManager.addInteractor?.("externalCannon", container => {

package/esm/index.lazy.js

@@ -1,6 +1,6 @@
 export { Cannon } from "./Options/Classes/Cannon.js";
 export async function loadExternalCannonInteraction(engine) {
-    engine.checkVersion("4.1.3");
+    engine.checkVersion("4.2.1");
     await engine.pluginManager.register(async (e) => {
         const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity/lazy");
         ensureInteractivityPluginLoaded(e);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/interaction-external-cannon",
-  "version": "4.1.3",
+  "version": "4.2.1",
   "description": "tsParticles cannon external interaction",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -97,7 +97,7 @@
   },
   "type": "module",
   "peerDependencies": {
-    "@tsparticles/engine": "4.1.3",
-    "@tsparticles/plugin-interactivity": "4.1.3"
+    "@tsparticles/engine": "4.2.1",
+    "@tsparticles/plugin-interactivity": "4.2.1"
   }
 }

package/report.html

@@ -4930,7 +4930,7 @@ var drawChart = (function (exports) {
   </script>
   <script>
     /*<!--*/
-    const data = {"version":2,"tree":{"name":"root","children":[{"name":"tsparticles.interaction.external.cannon.js","children":[{"name":"dist/browser","children":[{"name":"Options/Classes/Cannon.js","uid":"a2346b6e-1"},{"uid":"a2346b6e-3","name":"Cannoner.js"},{"uid":"a2346b6e-5","name":"index.js"},{"uid":"a2346b6e-7","name":"browser.js"}]}]}],"isRoot":true},"nodeParts":{"a2346b6e-1":{"renderedLength":1578,"gzipLength":0,"brotliLength":0,"metaUid":"a2346b6e-0"},"a2346b6e-3":{"renderedLength":6101,"gzipLength":0,"brotliLength":0,"metaUid":"a2346b6e-2"},"a2346b6e-5":{"renderedLength":393,"gzipLength":0,"brotliLength":0,"metaUid":"a2346b6e-4"},"a2346b6e-7":{"renderedLength":201,"gzipLength":0,"brotliLength":0,"metaUid":"a2346b6e-6"}},"nodeMetas":{"a2346b6e-0":{"id":"/dist/browser/Options/Classes/Cannon.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"a2346b6e-1"},"imported":[],"importedBy":[{"uid":"a2346b6e-4"},{"uid":"a2346b6e-2"}]},"a2346b6e-2":{"id":"/dist/browser/Cannoner.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"a2346b6e-3"},"imported":[{"uid":"a2346b6e-8"},{"uid":"a2346b6e-9"},{"uid":"a2346b6e-0"}],"importedBy":[{"uid":"a2346b6e-4"}]},"a2346b6e-4":{"id":"/dist/browser/index.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"a2346b6e-5"},"imported":[{"uid":"a2346b6e-8"},{"uid":"a2346b6e-0"},{"uid":"a2346b6e-2"}],"importedBy":[{"uid":"a2346b6e-6"}]},"a2346b6e-6":{"id":"/dist/browser/browser.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"a2346b6e-7"},"imported":[{"uid":"a2346b6e-4"}],"importedBy":[],"isEntry":true},"a2346b6e-8":{"id":"@tsparticles/plugin-interactivity","moduleParts":{},"imported":[],"importedBy":[{"uid":"a2346b6e-4"},{"uid":"a2346b6e-2"}],"isExternal":true},"a2346b6e-9":{"id":"@tsparticles/engine","moduleParts":{},"imported":[],"importedBy":[{"uid":"a2346b6e-2"}],"isExternal":true}},"env":{"rollup":"4.60.4"},"options":{"gzip":false,"brotli":false,"sourcemap":false}};
+    const data = {"version":2,"tree":{"name":"root","children":[{"name":"tsparticles.interaction.external.cannon.js","children":[{"name":"dist/browser","children":[{"name":"Options/Classes/Cannon.js","uid":"7bd041ec-1"},{"uid":"7bd041ec-3","name":"Cannoner.js"},{"uid":"7bd041ec-5","name":"index.js"},{"uid":"7bd041ec-7","name":"browser.js"}]}]}],"isRoot":true},"nodeParts":{"7bd041ec-1":{"renderedLength":932,"gzipLength":0,"brotliLength":0,"metaUid":"7bd041ec-0"},"7bd041ec-3":{"renderedLength":6023,"gzipLength":0,"brotliLength":0,"metaUid":"7bd041ec-2"},"7bd041ec-5":{"renderedLength":393,"gzipLength":0,"brotliLength":0,"metaUid":"7bd041ec-4"},"7bd041ec-7":{"renderedLength":201,"gzipLength":0,"brotliLength":0,"metaUid":"7bd041ec-6"}},"nodeMetas":{"7bd041ec-0":{"id":"/dist/browser/Options/Classes/Cannon.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"7bd041ec-1"},"imported":[{"uid":"7bd041ec-9"}],"importedBy":[{"uid":"7bd041ec-4"},{"uid":"7bd041ec-2"}]},"7bd041ec-2":{"id":"/dist/browser/Cannoner.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"7bd041ec-3"},"imported":[{"uid":"7bd041ec-8"},{"uid":"7bd041ec-9"},{"uid":"7bd041ec-0"}],"importedBy":[{"uid":"7bd041ec-4"}]},"7bd041ec-4":{"id":"/dist/browser/index.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"7bd041ec-5"},"imported":[{"uid":"7bd041ec-8"},{"uid":"7bd041ec-0"},{"uid":"7bd041ec-2"}],"importedBy":[{"uid":"7bd041ec-6"}]},"7bd041ec-6":{"id":"/dist/browser/browser.js","moduleParts":{"tsparticles.interaction.external.cannon.js":"7bd041ec-7"},"imported":[{"uid":"7bd041ec-4"}],"importedBy":[],"isEntry":true},"7bd041ec-8":{"id":"@tsparticles/plugin-interactivity","moduleParts":{},"imported":[],"importedBy":[{"uid":"7bd041ec-4"},{"uid":"7bd041ec-2"}],"isExternal":true},"7bd041ec-9":{"id":"@tsparticles/engine","moduleParts":{},"imported":[],"importedBy":[{"uid":"7bd041ec-0"},{"uid":"7bd041ec-2"}],"isExternal":true}},"env":{"rollup":"4.62.0"},"options":{"gzip":false,"brotli":false,"sourcemap":false}};
 
     const run = () => {
       const width = window.innerWidth;

package/tsparticles.interaction.external.cannon.js

@@ -1,5 +1,5 @@
 (function(g){g.__tsParticlesInternals=g.__tsParticlesInternals||{};g.__tsParticlesInternals.bundles=g.__tsParticlesInternals.bundles||{};g.__tsParticlesInternals.effects=g.__tsParticlesInternals.effects||{};g.__tsParticlesInternals.engine=g.__tsParticlesInternals.engine||{};g.__tsParticlesInternals.interactions=g.__tsParticlesInternals.interactions||{};g.__tsParticlesInternals.palettes=g.__tsParticlesInternals.palettes||{};g.__tsParticlesInternals.paths=g.__tsParticlesInternals.paths||{};g.__tsParticlesInternals.plugins=g.__tsParticlesInternals.plugins||{};g.__tsParticlesInternals.plugins=g.__tsParticlesInternals.plugins||{};g.__tsParticlesInternals.plugins.emittersShapes=g.__tsParticlesInternals.plugins.emittersShapes||{};g.__tsParticlesInternals.presets=g.__tsParticlesInternals.presets||{};g.__tsParticlesInternals.shapes=g.__tsParticlesInternals.shapes||{};g.__tsParticlesInternals.updaters=g.__tsParticlesInternals.updaters||{};g.__tsParticlesInternals.utils=g.__tsParticlesInternals.utils||{};g.__tsParticlesInternals.canvas=g.__tsParticlesInternals.canvas||{};g.__tsParticlesInternals.canvas=g.__tsParticlesInternals.canvas||{};g.__tsParticlesInternals.canvas.utils=g.__tsParticlesInternals.canvas.utils||{};g.__tsParticlesInternals.path=g.__tsParticlesInternals.path||{};g.__tsParticlesInternals.path=g.__tsParticlesInternals.path||{};g.__tsParticlesInternals.path.utils=g.__tsParticlesInternals.path.utils||{};var __tsProxyFactory=typeof Proxy!=="undefined"?function(obj){return new Proxy(obj,{get:function(target,key){if(!(key in target)){target[key]={};}return target[key];}});}:function(obj){return obj;};g.__tsParticlesInternals.bundles=__tsProxyFactory(g.__tsParticlesInternals.bundles);g.__tsParticlesInternals.effects=__tsProxyFactory(g.__tsParticlesInternals.effects);g.__tsParticlesInternals.interactions=__tsProxyFactory(g.__tsParticlesInternals.interactions);g.__tsParticlesInternals.palettes=__tsProxyFactory(g.__tsParticlesInternals.palettes);g.__tsParticlesInternals.paths=__tsProxyFactory(g.__tsParticlesInternals.paths);g.__tsParticlesInternals.plugins=__tsProxyFactory(g.__tsParticlesInternals.plugins);g.__tsParticlesInternals.plugins.emittersShapes=__tsProxyFactory(g.__tsParticlesInternals.plugins.emittersShapes);g.__tsParticlesInternals.presets=__tsProxyFactory(g.__tsParticlesInternals.presets);g.__tsParticlesInternals.shapes=__tsProxyFactory(g.__tsParticlesInternals.shapes);g.__tsParticlesInternals.updaters=__tsProxyFactory(g.__tsParticlesInternals.updaters);g.__tsParticlesInternals.utils=__tsProxyFactory(g.__tsParticlesInternals.utils);g.__tsParticlesInternals.canvas=__tsProxyFactory(g.__tsParticlesInternals.canvas);g.__tsParticlesInternals.path=__tsProxyFactory(g.__tsParticlesInternals.path);g.tsparticlesInternalExports=g.tsparticlesInternalExports||{};})(typeof globalThis!=="undefined"?globalThis:typeof window!=="undefined"?window:this);
-/* External Interaction v4.1.3 */
+/* External Interaction v4.2.1 */
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@tsparticles/plugin-interactivity'), require('@tsparticles/engine')) :
     typeof define === 'function' && define.amd ? define(['exports', '@tsparticles/plugin-interactivity', '@tsparticles/engine'], factory) :
@@ -7,52 +7,26 @@
 })(this, (function (exports, pluginInteractivity, engine) { 'use strict';
 
     class Cannon {
-        drawVector;
-        maxDragDistance;
-        maxParticles;
-        minParticles;
-        particleFactor;
-        spread;
-        vectorColor;
-        velocityFactor;
-        constructor() {
-            this.spread = 30;
-            this.velocityFactor = 0.5;
-            this.particleFactor = 0.2;
-            this.maxDragDistance = 0;
-            this.minParticles = 5;
-            this.maxParticles = 200;
-            this.drawVector = true;
-            this.vectorColor = "#ffffff80";
-        }
+        drawVector = true;
+        maxDragDistance = 0;
+        maxParticles = 200;
+        minParticles = 5;
+        particleFactor = 0.2;
+        spread = 30;
+        vectorColor = "#ffffff80";
+        velocityFactor = 0.5;
         load(data) {
             if (!data) {
                 return;
             }
-            if (data.spread !== undefined) {
-                this.spread = data.spread;
-            }
-            if (data.velocityFactor !== undefined) {
-                this.velocityFactor = data.velocityFactor;
-            }
-            if (data.particleFactor !== undefined) {
-                this.particleFactor = data.particleFactor;
-            }
-            if (data.minParticles !== undefined) {
-                this.minParticles = data.minParticles;
-            }
-            if (data.maxParticles !== undefined) {
-                this.maxParticles = data.maxParticles;
-            }
-            if (data.maxDragDistance !== undefined) {
-                this.maxDragDistance = data.maxDragDistance;
-            }
-            if (data.drawVector !== undefined) {
-                this.drawVector = data.drawVector;
-            }
-            if (data.vectorColor !== undefined) {
-                this.vectorColor = data.vectorColor;
-            }
+            engine.loadProperty(this, "spread", data.spread);
+            engine.loadProperty(this, "velocityFactor", data.velocityFactor);
+            engine.loadProperty(this, "particleFactor", data.particleFactor);
+            engine.loadProperty(this, "minParticles", data.minParticles);
+            engine.loadProperty(this, "maxParticles", data.maxParticles);
+            engine.loadProperty(this, "maxDragDistance", data.maxDragDistance);
+            engine.loadProperty(this, "drawVector", data.drawVector);
+            engine.loadProperty(this, "vectorColor", data.vectorColor);
         }
     }
 
@@ -127,10 +101,7 @@
             return this.#state !== CannonState.idle || interactivityData.mouse.clicking;
         }
         loadModeOptions(options, ...sources) {
-            options.cannon ??= new Cannon();
-            for (const source of sources) {
-                options.cannon.load(source?.cannon);
-            }
+            engine.loadOptionProperty(options, "cannon", Cannon, ...sources);
         }
         reset(_interactivityData, _particle) {
         }
@@ -181,7 +152,7 @@
     }
 
     async function loadExternalCannonInteraction(engine) {
-        engine.checkVersion("4.1.3");
+        engine.checkVersion("4.2.1");
         await engine.pluginManager.register((e) => {
             pluginInteractivity.ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalCannon", container => {

package/tsparticles.interaction.external.cannon.min.js

@@ -1 +1 @@
-!function(t){t.__tsParticlesInternals=t.__tsParticlesInternals||{},t.__tsParticlesInternals.bundles=t.__tsParticlesInternals.bundles||{},t.__tsParticlesInternals.effects=t.__tsParticlesInternals.effects||{},t.__tsParticlesInternals.engine=t.__tsParticlesInternals.engine||{},t.__tsParticlesInternals.interactions=t.__tsParticlesInternals.interactions||{},t.__tsParticlesInternals.palettes=t.__tsParticlesInternals.palettes||{},t.__tsParticlesInternals.paths=t.__tsParticlesInternals.paths||{},t.__tsParticlesInternals.plugins=t.__tsParticlesInternals.plugins||{},t.__tsParticlesInternals.plugins=t.__tsParticlesInternals.plugins||{},t.__tsParticlesInternals.plugins.emittersShapes=t.__tsParticlesInternals.plugins.emittersShapes||{},t.__tsParticlesInternals.presets=t.__tsParticlesInternals.presets||{},t.__tsParticlesInternals.shapes=t.__tsParticlesInternals.shapes||{},t.__tsParticlesInternals.updaters=t.__tsParticlesInternals.updaters||{},t.__tsParticlesInternals.utils=t.__tsParticlesInternals.utils||{},t.__tsParticlesInternals.canvas=t.__tsParticlesInternals.canvas||{},t.__tsParticlesInternals.canvas=t.__tsParticlesInternals.canvas||{},t.__tsParticlesInternals.canvas.utils=t.__tsParticlesInternals.canvas.utils||{},t.__tsParticlesInternals.path=t.__tsParticlesInternals.path||{},t.__tsParticlesInternals.path=t.__tsParticlesInternals.path||{},t.__tsParticlesInternals.path.utils=t.__tsParticlesInternals.path.utils||{};var e="undefined"!=typeof Proxy?function(t){return new Proxy(t,{get:function(t,e){return e in t||(t[e]={}),t[e]}})}:function(t){return t};t.__tsParticlesInternals.bundles=e(t.__tsParticlesInternals.bundles),t.__tsParticlesInternals.effects=e(t.__tsParticlesInternals.effects),t.__tsParticlesInternals.interactions=e(t.__tsParticlesInternals.interactions),t.__tsParticlesInternals.palettes=e(t.__tsParticlesInternals.palettes),t.__tsParticlesInternals.paths=e(t.__tsParticlesInternals.paths),t.__tsParticlesInternals.plugins=e(t.__tsParticlesInternals.plugins),t.__tsParticlesInternals.plugins.emittersShapes=e(t.__tsParticlesInternals.plugins.emittersShapes),t.__tsParticlesInternals.presets=e(t.__tsParticlesInternals.presets),t.__tsParticlesInternals.shapes=e(t.__tsParticlesInternals.shapes),t.__tsParticlesInternals.updaters=e(t.__tsParticlesInternals.updaters),t.__tsParticlesInternals.utils=e(t.__tsParticlesInternals.utils),t.__tsParticlesInternals.canvas=e(t.__tsParticlesInternals.canvas),t.__tsParticlesInternals.path=e(t.__tsParticlesInternals.path),t.tsparticlesInternalExports=t.tsparticlesInternalExports||{}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:this),function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@tsparticles/plugin-interactivity"),require("@tsparticles/engine")):"function"==typeof define&&define.amd?define(["exports","@tsparticles/plugin-interactivity","@tsparticles/engine"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).__tsParticlesInternals=t.__tsParticlesInternals||{},t.__tsParticlesInternals.interactions=t.__tsParticlesInternals.interactions||{},t.__tsParticlesInternals.interactions.externalCannon=t.__tsParticlesInternals.interactions.externalCannon||{}),t.__tsParticlesInternals.plugins.interactivity,t.__tsParticlesInternals.engine)}(this,function(t,e,s){"use strict";class a{drawVector;maxDragDistance;maxParticles;minParticles;particleFactor;spread;vectorColor;velocityFactor;constructor(){this.spread=30,this.velocityFactor=.5,this.particleFactor=.2,this.maxDragDistance=0,this.minParticles=5,this.maxParticles=200,this.drawVector=!0,this.vectorColor="#ffffff80"}load(t){t&&(void 0!==t.spread&&(this.spread=t.spread),void 0!==t.velocityFactor&&(this.velocityFactor=t.velocityFactor),void 0!==t.particleFactor&&(this.particleFactor=t.particleFactor),void 0!==t.minParticles&&(this.minParticles=t.minParticles),void 0!==t.maxParticles&&(this.maxParticles=t.maxParticles),void 0!==t.maxDragDistance&&(this.maxDragDistance=t.maxDragDistance),void 0!==t.drawVector&&(this.drawVector=t.drawVector),void 0!==t.vectorColor&&(this.vectorColor=t.vectorColor))}}var n;!function(t){t[t.idle=0]="idle",t[t.aiming=1]="aiming",t[t.fired=2]="fired"}(n||(n={}));const r="cannon",i=s.identity/20;class l extends e.ExternalInteractorBase{maxDistance=0;#t;#e={origin:s.Vector.origin,current:s.Vector.origin,active:!1};#s=void 0;#a=n.idle;constructor(t){super(t)}clear(t,e){}init(){const t=this.container.actualOptions.interactivity?.modes.cannon??new a;this.#t={spread:s.degToRad(t.spread),maxDragDistance:t.maxDragDistance,velocityFactor:t.velocityFactor,particleFactor:t.particleFactor,minParticles:t.minParticles,maxParticles:t.maxParticles,drawVector:t.drawVector,vectorColor:t.vectorColor}}interact(t,e){const s=t.mouse,a=s.position,r=s.clicking,i=s.downPosition;r&&i&&i!==this.#s&&this.#a===n.idle&&(this.#s=i,this.#e={origin:{x:i.x,y:i.y},current:{x:i.x,y:i.y},active:!0},this.#a=n.aiming),this.#a===n.aiming&&a&&(this.#e.current={x:a.x,y:a.y},this.#n()),r||this.#a!==n.aiming||(this.#e.active=!1,this.#r(),this.#a=n.idle)}isEnabled(t){const e=this.container,s=e.actualOptions.interactivity?.events;if(!s?.onClick.enable)return!1;const a=s.onClick.mode;return!!(Array.isArray(a)?a.includes(r):a===r)&&(this.#a!==n.idle||t.mouse.clicking)}loadModeOptions(t,...e){t.cannon??=new a;for(const s of e)t.cannon.load(s?.cannon)}reset(t,e){}#n(){this.container.canvas.render.draw(t=>{const e=this.#t;if(!e)return;const{origin:a,current:n}=this.#e,r=this.container.retina.pixelRatio,l=s.getDistance(a,n),c=e.maxDragDistance>s.none?Math.min(l,e.maxDragDistance*r):l,o=l>0?c/l:0,_=a.x+(n.x-a.x)*o,P=a.y+(n.y-a.y)*o;t.save(),t.strokeStyle=e.vectorColor,t.lineWidth=s.double*r,t.beginPath(),t.moveTo(a.x,a.y),t.lineTo(_,P),t.stroke();const d=Math.max(4,c*i)*r;t.beginPath(),t.arc(a.x,a.y,d,0,s.doublePI),t.strokeStyle=e.vectorColor,t.lineWidth=s.double*r,t.stroke(),t.restore()})}#r(){const t=this.#t;if(!t)return;const{origin:e,current:a}=this.#e,n=this.container.retina.pixelRatio,r=s.getDistance(e,a),i=t.maxDragDistance>s.none?Math.min(r,t.maxDragDistance*n):r;if(i<2)return;const l=s.identity/n,c=(d=a.x,p=a.y,I=e.x,h=e.y,Math.atan2(h-p,I-d)),o=i*l*t.velocityFactor,_=Math.min(t.maxParticles,Math.max(t.minParticles,Math.round(i*t.particleFactor))),P=180/Math.PI;var d,p,I,h;for(let a=0;a<_;a++){const a=c+s.getRandomInRange(-t.spread,t.spread),n=s.getRandomInRange(.25*o,o);this.container.particles.addParticle(e,{move:{enable:!0,speed:n,direction:a*P}})}}}async function c(t){t.checkVersion("4.1.3"),await t.pluginManager.register(t=>{e.ensureInteractivityPluginLoaded(t),t.pluginManager.addInteractor?.("externalCannon",t=>Promise.resolve(new l(t)))})}const o=globalThis;o.__tsParticlesInternals=o.__tsParticlesInternals??{},o.loadExternalCannonInteraction=c,t.Cannon=a,t.loadExternalCannonInteraction=c}),Object.assign(globalThis.window||globalThis,{loadExternalCannonInteraction:(globalThis.__tsParticlesInternals.interactions.externalCannon||{}).loadExternalCannonInteraction}),delete(globalThis.window||globalThis).tsparticlesInternalExports;
+!function(t){t.__tsParticlesInternals=t.__tsParticlesInternals||{},t.__tsParticlesInternals.bundles=t.__tsParticlesInternals.bundles||{},t.__tsParticlesInternals.effects=t.__tsParticlesInternals.effects||{},t.__tsParticlesInternals.engine=t.__tsParticlesInternals.engine||{},t.__tsParticlesInternals.interactions=t.__tsParticlesInternals.interactions||{},t.__tsParticlesInternals.palettes=t.__tsParticlesInternals.palettes||{},t.__tsParticlesInternals.paths=t.__tsParticlesInternals.paths||{},t.__tsParticlesInternals.plugins=t.__tsParticlesInternals.plugins||{},t.__tsParticlesInternals.plugins=t.__tsParticlesInternals.plugins||{},t.__tsParticlesInternals.plugins.emittersShapes=t.__tsParticlesInternals.plugins.emittersShapes||{},t.__tsParticlesInternals.presets=t.__tsParticlesInternals.presets||{},t.__tsParticlesInternals.shapes=t.__tsParticlesInternals.shapes||{},t.__tsParticlesInternals.updaters=t.__tsParticlesInternals.updaters||{},t.__tsParticlesInternals.utils=t.__tsParticlesInternals.utils||{},t.__tsParticlesInternals.canvas=t.__tsParticlesInternals.canvas||{},t.__tsParticlesInternals.canvas=t.__tsParticlesInternals.canvas||{},t.__tsParticlesInternals.canvas.utils=t.__tsParticlesInternals.canvas.utils||{},t.__tsParticlesInternals.path=t.__tsParticlesInternals.path||{},t.__tsParticlesInternals.path=t.__tsParticlesInternals.path||{},t.__tsParticlesInternals.path.utils=t.__tsParticlesInternals.path.utils||{};var e="undefined"!=typeof Proxy?function(t){return new Proxy(t,{get:function(t,e){return e in t||(t[e]={}),t[e]}})}:function(t){return t};t.__tsParticlesInternals.bundles=e(t.__tsParticlesInternals.bundles),t.__tsParticlesInternals.effects=e(t.__tsParticlesInternals.effects),t.__tsParticlesInternals.interactions=e(t.__tsParticlesInternals.interactions),t.__tsParticlesInternals.palettes=e(t.__tsParticlesInternals.palettes),t.__tsParticlesInternals.paths=e(t.__tsParticlesInternals.paths),t.__tsParticlesInternals.plugins=e(t.__tsParticlesInternals.plugins),t.__tsParticlesInternals.plugins.emittersShapes=e(t.__tsParticlesInternals.plugins.emittersShapes),t.__tsParticlesInternals.presets=e(t.__tsParticlesInternals.presets),t.__tsParticlesInternals.shapes=e(t.__tsParticlesInternals.shapes),t.__tsParticlesInternals.updaters=e(t.__tsParticlesInternals.updaters),t.__tsParticlesInternals.utils=e(t.__tsParticlesInternals.utils),t.__tsParticlesInternals.canvas=e(t.__tsParticlesInternals.canvas),t.__tsParticlesInternals.path=e(t.__tsParticlesInternals.path),t.tsparticlesInternalExports=t.tsparticlesInternalExports||{}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:this),function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@tsparticles/plugin-interactivity"),require("@tsparticles/engine")):"function"==typeof define&&define.amd?define(["exports","@tsparticles/plugin-interactivity","@tsparticles/engine"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).__tsParticlesInternals=t.__tsParticlesInternals||{},t.__tsParticlesInternals.interactions=t.__tsParticlesInternals.interactions||{},t.__tsParticlesInternals.interactions.externalCannon=t.__tsParticlesInternals.interactions.externalCannon||{}),t.__tsParticlesInternals.plugins.interactivity,t.__tsParticlesInternals.engine)}(this,function(t,e,s){"use strict";class a{drawVector=!0;maxDragDistance=0;maxParticles=200;minParticles=5;particleFactor=.2;spread=30;vectorColor="#ffffff80";velocityFactor=.5;load(t){t&&(s.loadProperty(this,"spread",t.spread),s.loadProperty(this,"velocityFactor",t.velocityFactor),s.loadProperty(this,"particleFactor",t.particleFactor),s.loadProperty(this,"minParticles",t.minParticles),s.loadProperty(this,"maxParticles",t.maxParticles),s.loadProperty(this,"maxDragDistance",t.maxDragDistance),s.loadProperty(this,"drawVector",t.drawVector),s.loadProperty(this,"vectorColor",t.vectorColor))}}var n;!function(t){t[t.idle=0]="idle",t[t.aiming=1]="aiming",t[t.fired=2]="fired"}(n||(n={}));const r="cannon",i=s.identity/20;class l extends e.ExternalInteractorBase{maxDistance=0;#t;#e={origin:s.Vector.origin,current:s.Vector.origin,active:!1};#s=void 0;#a=n.idle;constructor(t){super(t)}clear(t,e){}init(){const t=this.container.actualOptions.interactivity?.modes.cannon??new a;this.#t={spread:s.degToRad(t.spread),maxDragDistance:t.maxDragDistance,velocityFactor:t.velocityFactor,particleFactor:t.particleFactor,minParticles:t.minParticles,maxParticles:t.maxParticles,drawVector:t.drawVector,vectorColor:t.vectorColor}}interact(t,e){const s=t.mouse,a=s.position,r=s.clicking,i=s.downPosition;r&&i&&i!==this.#s&&this.#a===n.idle&&(this.#s=i,this.#e={origin:{x:i.x,y:i.y},current:{x:i.x,y:i.y},active:!0},this.#a=n.aiming),this.#a===n.aiming&&a&&(this.#e.current={x:a.x,y:a.y},this.#n()),r||this.#a!==n.aiming||(this.#e.active=!1,this.#r(),this.#a=n.idle)}isEnabled(t){const e=this.container,s=e.actualOptions.interactivity?.events;if(!s?.onClick.enable)return!1;const a=s.onClick.mode;return!!(Array.isArray(a)?a.includes(r):a===r)&&(this.#a!==n.idle||t.mouse.clicking)}loadModeOptions(t,...e){s.loadOptionProperty(t,"cannon",a,...e)}reset(t,e){}#n(){this.container.canvas.render.draw(t=>{const e=this.#t;if(!e)return;const{origin:a,current:n}=this.#e,r=this.container.retina.pixelRatio,l=s.getDistance(a,n),c=e.maxDragDistance>s.none?Math.min(l,e.maxDragDistance*r):l,o=l>0?c/l:0,_=a.x+(n.x-a.x)*o,P=a.y+(n.y-a.y)*o;t.save(),t.strokeStyle=e.vectorColor,t.lineWidth=s.double*r,t.beginPath(),t.moveTo(a.x,a.y),t.lineTo(_,P),t.stroke();const d=Math.max(4,c*i)*r;t.beginPath(),t.arc(a.x,a.y,d,0,s.doublePI),t.strokeStyle=e.vectorColor,t.lineWidth=s.double*r,t.stroke(),t.restore()})}#r(){const t=this.#t;if(!t)return;const{origin:e,current:a}=this.#e,n=this.container.retina.pixelRatio,r=s.getDistance(e,a),i=t.maxDragDistance>s.none?Math.min(r,t.maxDragDistance*n):r;if(i<2)return;const l=s.identity/n,c=(d=a.x,p=a.y,I=e.x,u=e.y,Math.atan2(u-p,I-d)),o=i*l*t.velocityFactor,_=Math.min(t.maxParticles,Math.max(t.minParticles,Math.round(i*t.particleFactor))),P=180/Math.PI;var d,p,I,u;for(let a=0;a<_;a++){const a=c+s.getRandomInRange(-t.spread,t.spread),n=s.getRandomInRange(.25*o,o);this.container.particles.addParticle(e,{move:{enable:!0,speed:n,direction:a*P}})}}}async function c(t){t.checkVersion("4.2.1"),await t.pluginManager.register(t=>{e.ensureInteractivityPluginLoaded(t),t.pluginManager.addInteractor?.("externalCannon",t=>Promise.resolve(new l(t)))})}const o=globalThis;o.__tsParticlesInternals=o.__tsParticlesInternals??{},o.loadExternalCannonInteraction=c,t.Cannon=a,t.loadExternalCannonInteraction=c}),Object.assign(globalThis.window||globalThis,{loadExternalCannonInteraction:(globalThis.__tsParticlesInternals.interactions.externalCannon||{}).loadExternalCannonInteraction}),delete(globalThis.window||globalThis).tsparticlesInternalExports;

package/types/Options/Classes/Cannon.d.ts

@@ -1,5 +1,5 @@
+import { type RecursivePartial } from "@tsparticles/engine";
 import type { ICannon } from "../Interfaces/ICannon.js";
-import type { RecursivePartial } from "@tsparticles/engine";
 export declare class Cannon implements ICannon {
     drawVector: boolean;
     maxDragDistance: number;
@@ -9,6 +9,5 @@ export declare class Cannon implements ICannon {
     spread: number;
     vectorColor: string;
     velocityFactor: number;
-    constructor();
     load(data?: RecursivePartial<ICannon>): void;
 }

package/types/Options/Classes/CannonOptions.d.ts

@@ -1,7 +1,9 @@
-import type { CannonMode } from "../../Types.js";
+import type { Cannon } from "./Cannon.js";
 import type { InteractivityOptions } from "@tsparticles/plugin-interactivity";
 export type CannonOptions = InteractivityOptions & {
     interactivity?: {
-        modes: CannonMode;
+        modes: {
+            cannon?: Cannon;
+        };
     };
 };