@tsparticles/updater-out-modes - npm Package Compare versions

Comparing version 3.0.0-alpha.1 to 3.0.0-beta.0

browser/BounceOutMode.js

@@ -1,2 +0,2 @@
-import { calculateBounds } from "@tsparticles/engine";
+import { calculateBounds, } from "@tsparticles/engine";
 import { bounceHorizontal, bounceVertical } from "./Utils";
@@ -3,0 +3,0 @@ export class BounceOutMode {

browser/DestroyOutMode.js

@@ -1,2 +0,2 @@
-import { Vector, getDistances, isPointInside } from "@tsparticles/engine";
+import { Vector, getDistances, isPointInside, } from "@tsparticles/engine";
 export class DestroyOutMode {
@@ -7,3 +7,3 @@ constructor(container) {
     }
-    update(particle, direction, delta, outMode) {
+    update(particle, direction, _delta, outMode) {
         if (!this.modes.includes(outMode)) {
@@ -10,0 +10,0 @@ return;

browser/index.js

 import { OutOfCanvasUpdater } from "./OutOfCanvasUpdater";
-export async function loadOutModesUpdater(engine) {
-    await engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater(container));
+export async function loadOutModesUpdater(engine, refresh = true) {
+    await engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater(container), refresh);
 }

browser/NoneOutMode.js

@@ -1,2 +0,2 @@
-import { Vector, isPointInside } from "@tsparticles/engine";
+import { Vector, isPointInside, } from "@tsparticles/engine";
 export class NoneOutMode {
@@ -3,0 +3,0 @@ constructor(container) {

browser/OutOfCanvasUpdater.js

@@ -8,2 +8,7 @@ import { BounceOutMode } from "./BounceOutMode";
         this.container = container;
+        this._updateOutMode = (particle, delta, outMode, direction) => {
+            for (const updater of this.updaters) {
+                updater.update(particle, direction, delta, outMode);
+            }
+        };
         this.updaters = [
@@ -22,14 +27,8 @@ new BounceOutMode(container),
     update(particle, delta) {
-        var _a, _b, _c, _d;
         const outModes = particle.options.move.outModes;
-        this.updateOutMode(particle, delta, (_a = outModes.bottom) !== null && _a !== void 0 ? _a : outModes.default, "bottom");
-        this.updateOutMode(particle, delta, (_b = outModes.left) !== null && _b !== void 0 ? _b : outModes.default, "left");
-        this.updateOutMode(particle, delta, (_c = outModes.right) !== null && _c !== void 0 ? _c : outModes.default, "right");
-        this.updateOutMode(particle, delta, (_d = outModes.top) !== null && _d !== void 0 ? _d : outModes.default, "top");
+        this._updateOutMode(particle, delta, outModes.bottom ?? outModes.default, "bottom");
+        this._updateOutMode(particle, delta, outModes.left ?? outModes.default, "left");
+        this._updateOutMode(particle, delta, outModes.right ?? outModes.default, "right");
+        this._updateOutMode(particle, delta, outModes.top ?? outModes.default, "top");
     }
-    updateOutMode(particle, delta, outMode, direction) {
-        for (const updater of this.updaters) {
-            updater.update(particle, direction, delta, outMode);
-        }
-    }
 }

browser/Utils.js

 import { getValue } from "@tsparticles/engine";
 export function bounceHorizontal(data) {
-    if (data.outMode !== "bounce" &&
+    if ((data.outMode !== "bounce" &&
         data.outMode !== "bounce-horizontal" &&
         data.outMode !== "bounceHorizontal" &&
-        data.outMode !== "split") {
+        data.outMode !== "split") ||
+        (data.direction !== "left" && data.direction !== "right")) {
         return;
     }
-    if (data.bounds.right < 0) {
+    if (data.bounds.right < 0 && data.direction === "left") {
         data.particle.position.x = data.size + data.offset.x;
     }
-    else if (data.bounds.left > data.canvasSize.width) {
+    else if (data.bounds.left > data.canvasSize.width && data.direction === "right") {
         data.particle.position.x = data.canvasSize.width - data.size - data.offset.x;
@@ -27,6 +28,6 @@ }
     const minPos = data.offset.x + data.size;
-    if (data.bounds.right >= data.canvasSize.width) {
+    if (data.bounds.right >= data.canvasSize.width && data.direction === "right") {
         data.particle.position.x = data.canvasSize.width - minPos;
     }
-    else if (data.bounds.left <= 0) {
+    else if (data.bounds.left <= 0 && data.direction === "left") {
         data.particle.position.x = minPos;
@@ -39,12 +40,13 @@ }
 export function bounceVertical(data) {
-    if (data.outMode !== "bounce" &&
+    if ((data.outMode !== "bounce" &&
         data.outMode !== "bounce-vertical" &&
         data.outMode !== "bounceVertical" &&
-        data.outMode !== "split") {
+        data.outMode !== "split") ||
+        (data.direction !== "bottom" && data.direction !== "top")) {
         return;
     }
-    if (data.bounds.bottom < 0) {
+    if (data.bounds.bottom < 0 && data.direction === "top") {
         data.particle.position.y = data.size + data.offset.y;
     }
-    else if (data.bounds.top > data.canvasSize.height) {
+    else if (data.bounds.top > data.canvasSize.height && data.direction === "bottom") {
         data.particle.position.y = data.canvasSize.height - data.size - data.offset.y;
@@ -64,6 +66,6 @@ }
     const minPos = data.offset.y + data.size;
-    if (data.bounds.bottom >= data.canvasSize.height) {
+    if (data.bounds.bottom >= data.canvasSize.height && data.direction === "bottom") {
         data.particle.position.y = data.canvasSize.height - minPos;
     }
-    else if (data.bounds.top <= 0) {
+    else if (data.bounds.top <= 0 && data.direction === "top") {
         data.particle.position.y = minPos;
@@ -70,0 +72,0 @@ }

cjs/DestroyOutMode.js

@@ -10,3 +10,3 @@ "use strict";
     }
-    update(particle, direction, delta, outMode) {
+    update(particle, direction, _delta, outMode) {
         if (!this.modes.includes(outMode)) {
@@ -13,0 +13,0 @@ return;

cjs/index.js

 "use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.loadOutModesUpdater = void 0;
 const OutOfCanvasUpdater_1 = require("./OutOfCanvasUpdater");
-function loadOutModesUpdater(engine) {
-    return __awaiter(this, void 0, void 0, function* () {
-        yield engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater_1.OutOfCanvasUpdater(container));
-    });
+async function loadOutModesUpdater(engine, refresh = true) {
+    await engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater_1.OutOfCanvasUpdater(container), refresh);
 }
 exports.loadOutModesUpdater = loadOutModesUpdater;

cjs/OutOfCanvasUpdater.js

@@ -11,2 +11,7 @@ "use strict";
         this.container = container;
+        this._updateOutMode = (particle, delta, outMode, direction) => {
+            for (const updater of this.updaters) {
+                updater.update(particle, direction, delta, outMode);
+            }
+        };
         this.updaters = [
@@ -25,15 +30,9 @@ new BounceOutMode_1.BounceOutMode(container),
     update(particle, delta) {
-        var _a, _b, _c, _d;
         const outModes = particle.options.move.outModes;
-        this.updateOutMode(particle, delta, (_a = outModes.bottom) !== null && _a !== void 0 ? _a : outModes.default, "bottom");
-        this.updateOutMode(particle, delta, (_b = outModes.left) !== null && _b !== void 0 ? _b : outModes.default, "left");
-        this.updateOutMode(particle, delta, (_c = outModes.right) !== null && _c !== void 0 ? _c : outModes.default, "right");
-        this.updateOutMode(particle, delta, (_d = outModes.top) !== null && _d !== void 0 ? _d : outModes.default, "top");
+        this._updateOutMode(particle, delta, outModes.bottom ?? outModes.default, "bottom");
+        this._updateOutMode(particle, delta, outModes.left ?? outModes.default, "left");
+        this._updateOutMode(particle, delta, outModes.right ?? outModes.default, "right");
+        this._updateOutMode(particle, delta, outModes.top ?? outModes.default, "top");
     }
-    updateOutMode(particle, delta, outMode, direction) {
-        for (const updater of this.updaters) {
-            updater.update(particle, direction, delta, outMode);
-        }
-    }
 }
 exports.OutOfCanvasUpdater = OutOfCanvasUpdater;

cjs/Utils.js

@@ -6,12 +6,13 @@ "use strict";
 function bounceHorizontal(data) {
-    if (data.outMode !== "bounce" &&
+    if ((data.outMode !== "bounce" &&
         data.outMode !== "bounce-horizontal" &&
         data.outMode !== "bounceHorizontal" &&
-        data.outMode !== "split") {
+        data.outMode !== "split") ||
+        (data.direction !== "left" && data.direction !== "right")) {
         return;
     }
-    if (data.bounds.right < 0) {
+    if (data.bounds.right < 0 && data.direction === "left") {
         data.particle.position.x = data.size + data.offset.x;
     }
-    else if (data.bounds.left > data.canvasSize.width) {
+    else if (data.bounds.left > data.canvasSize.width && data.direction === "right") {
         data.particle.position.x = data.canvasSize.width - data.size - data.offset.x;
@@ -31,6 +32,6 @@ }
     const minPos = data.offset.x + data.size;
-    if (data.bounds.right >= data.canvasSize.width) {
+    if (data.bounds.right >= data.canvasSize.width && data.direction === "right") {
         data.particle.position.x = data.canvasSize.width - minPos;
     }
-    else if (data.bounds.left <= 0) {
+    else if (data.bounds.left <= 0 && data.direction === "left") {
         data.particle.position.x = minPos;
@@ -44,12 +45,13 @@ }
 function bounceVertical(data) {
-    if (data.outMode !== "bounce" &&
+    if ((data.outMode !== "bounce" &&
         data.outMode !== "bounce-vertical" &&
         data.outMode !== "bounceVertical" &&
-        data.outMode !== "split") {
+        data.outMode !== "split") ||
+        (data.direction !== "bottom" && data.direction !== "top")) {
         return;
     }
-    if (data.bounds.bottom < 0) {
+    if (data.bounds.bottom < 0 && data.direction === "top") {
         data.particle.position.y = data.size + data.offset.y;
     }
-    else if (data.bounds.top > data.canvasSize.height) {
+    else if (data.bounds.top > data.canvasSize.height && data.direction === "bottom") {
         data.particle.position.y = data.canvasSize.height - data.size - data.offset.y;
@@ -69,6 +71,6 @@ }
     const minPos = data.offset.y + data.size;
-    if (data.bounds.bottom >= data.canvasSize.height) {
+    if (data.bounds.bottom >= data.canvasSize.height && data.direction === "bottom") {
         data.particle.position.y = data.canvasSize.height - minPos;
     }
-    else if (data.bounds.top <= 0) {
+    else if (data.bounds.top <= 0 && data.direction === "top") {
         data.particle.position.y = minPos;
@@ -75,0 +77,0 @@ }

esm/BounceOutMode.js

@@ -1,2 +0,2 @@
-import { calculateBounds } from "@tsparticles/engine";
+import { calculateBounds, } from "@tsparticles/engine";
 import { bounceHorizontal, bounceVertical } from "./Utils";
@@ -3,0 +3,0 @@ export class BounceOutMode {

esm/DestroyOutMode.js

@@ -1,2 +0,2 @@
-import { Vector, getDistances, isPointInside } from "@tsparticles/engine";
+import { Vector, getDistances, isPointInside, } from "@tsparticles/engine";
 export class DestroyOutMode {
@@ -7,3 +7,3 @@ constructor(container) {
     }
-    update(particle, direction, delta, outMode) {
+    update(particle, direction, _delta, outMode) {
         if (!this.modes.includes(outMode)) {
@@ -10,0 +10,0 @@ return;

esm/index.js

 import { OutOfCanvasUpdater } from "./OutOfCanvasUpdater";
-export async function loadOutModesUpdater(engine) {
-    await engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater(container));
+export async function loadOutModesUpdater(engine, refresh = true) {
+    await engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater(container), refresh);
 }

esm/NoneOutMode.js

@@ -1,2 +0,2 @@
-import { Vector, isPointInside } from "@tsparticles/engine";
+import { Vector, isPointInside, } from "@tsparticles/engine";
 export class NoneOutMode {
@@ -3,0 +3,0 @@ constructor(container) {

esm/OutOfCanvasUpdater.js

@@ -8,2 +8,7 @@ import { BounceOutMode } from "./BounceOutMode";
         this.container = container;
+        this._updateOutMode = (particle, delta, outMode, direction) => {
+            for (const updater of this.updaters) {
+                updater.update(particle, direction, delta, outMode);
+            }
+        };
         this.updaters = [
@@ -22,14 +27,8 @@ new BounceOutMode(container),
     update(particle, delta) {
-        var _a, _b, _c, _d;
         const outModes = particle.options.move.outModes;
-        this.updateOutMode(particle, delta, (_a = outModes.bottom) !== null && _a !== void 0 ? _a : outModes.default, "bottom");
-        this.updateOutMode(particle, delta, (_b = outModes.left) !== null && _b !== void 0 ? _b : outModes.default, "left");
-        this.updateOutMode(particle, delta, (_c = outModes.right) !== null && _c !== void 0 ? _c : outModes.default, "right");
-        this.updateOutMode(particle, delta, (_d = outModes.top) !== null && _d !== void 0 ? _d : outModes.default, "top");
+        this._updateOutMode(particle, delta, outModes.bottom ?? outModes.default, "bottom");
+        this._updateOutMode(particle, delta, outModes.left ?? outModes.default, "left");
+        this._updateOutMode(particle, delta, outModes.right ?? outModes.default, "right");
+        this._updateOutMode(particle, delta, outModes.top ?? outModes.default, "top");
     }
-    updateOutMode(particle, delta, outMode, direction) {
-        for (const updater of this.updaters) {
-            updater.update(particle, direction, delta, outMode);
-        }
-    }
 }

esm/Utils.js

 import { getValue } from "@tsparticles/engine";
 export function bounceHorizontal(data) {
-    if (data.outMode !== "bounce" &&
+    if ((data.outMode !== "bounce" &&
         data.outMode !== "bounce-horizontal" &&
         data.outMode !== "bounceHorizontal" &&
-        data.outMode !== "split") {
+        data.outMode !== "split") ||
+        (data.direction !== "left" && data.direction !== "right")) {
         return;
     }
-    if (data.bounds.right < 0) {
+    if (data.bounds.right < 0 && data.direction === "left") {
         data.particle.position.x = data.size + data.offset.x;
     }
-    else if (data.bounds.left > data.canvasSize.width) {
+    else if (data.bounds.left > data.canvasSize.width && data.direction === "right") {
         data.particle.position.x = data.canvasSize.width - data.size - data.offset.x;
@@ -27,6 +28,6 @@ }
     const minPos = data.offset.x + data.size;
-    if (data.bounds.right >= data.canvasSize.width) {
+    if (data.bounds.right >= data.canvasSize.width && data.direction === "right") {
         data.particle.position.x = data.canvasSize.width - minPos;
     }
-    else if (data.bounds.left <= 0) {
+    else if (data.bounds.left <= 0 && data.direction === "left") {
         data.particle.position.x = minPos;
@@ -39,12 +40,13 @@ }
 export function bounceVertical(data) {
-    if (data.outMode !== "bounce" &&
+    if ((data.outMode !== "bounce" &&
         data.outMode !== "bounce-vertical" &&
         data.outMode !== "bounceVertical" &&
-        data.outMode !== "split") {
+        data.outMode !== "split") ||
+        (data.direction !== "bottom" && data.direction !== "top")) {
         return;
     }
-    if (data.bounds.bottom < 0) {
+    if (data.bounds.bottom < 0 && data.direction === "top") {
         data.particle.position.y = data.size + data.offset.y;
     }
-    else if (data.bounds.top > data.canvasSize.height) {
+    else if (data.bounds.top > data.canvasSize.height && data.direction === "bottom") {
         data.particle.position.y = data.canvasSize.height - data.size - data.offset.y;
@@ -64,6 +66,6 @@ }
     const minPos = data.offset.y + data.size;
-    if (data.bounds.bottom >= data.canvasSize.height) {
+    if (data.bounds.bottom >= data.canvasSize.height && data.direction === "bottom") {
         data.particle.position.y = data.canvasSize.height - minPos;
     }
-    else if (data.bounds.top <= 0) {
+    else if (data.bounds.top <= 0 && data.direction === "top") {
         data.particle.position.y = minPos;
@@ -70,0 +72,0 @@ }

package.json

 {
   "name": "@tsparticles/updater-out-modes",
-  "version": "3.0.0-alpha.1",
+  "version": "3.0.0-beta.0",
   "description": "tsParticles particles out modes updater",
@@ -76,8 +76,9 @@ "homepage": "https://particles.js.org",
   "types": "types/index.d.ts",
+  "sideEffects": false,
+  "dependencies": {
+    "@tsparticles/engine": "^3.0.0-beta.0"
+  },
   "publishConfig": {
     "access": "public"
-  },
-  "dependencies": {
-    "@tsparticles/engine": "^3.0.0-alpha.1"
   }
-}
+}

README.md

@@ -5,5 +5,5 @@ [![banner](https://particles.js.org/images/banner2.png)](https://particles.js.org)
 
-[![jsDelivr](https://data.jsdelivr.com/v1/package/npm/tsparticles-updater-out-modes/badge)](https://www.jsdelivr.com/package/npm/tsparticles-updater-out-modes)
-[![npmjs](https://badge.fury.io/js/tsparticles-updater-out-modes.svg)](https://www.npmjs.com/package/tsparticles-updater-out-modes)
-[![npmjs](https://img.shields.io/npm/dt/tsparticles-updater-out-modes)](https://www.npmjs.com/package/tsparticles-updater-out-modes) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
+[![jsDelivr](https://data.jsdelivr.com/v1/package/npm/@tsparticles/updater-out-modes/badge)](https://www.jsdelivr.com/package/npm/@tsparticles/updater-out-modes)
+[![npmjs](https://badge.fury.io/js/@tsparticles/updater-out-modes.svg)](https://www.npmjs.com/package/@tsparticles/updater-out-modes)
+[![npmjs](https://img.shields.io/npm/dt/@tsparticles/updater-out-modes)](https://www.npmjs.com/package/@tsparticles/updater-out-modes) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
 
@@ -30,3 +30,3 @@ [tsParticles](https://github.com/matteobruni/tsparticles) updater plugin for out modes animations.
 (async () => {
-  await loadOutModesUpdater();
+  await loadOutModesUpdater(tsParticles);
 
@@ -47,3 +47,3 @@ await tsParticles.load({
 ```shell
-$ npm install tsparticles-updater-out-modes
+$ npm install @tsparticles/updater-out-modes
 ```
@@ -54,3 +54,3 @@
 ```shell
-$ yarn add tsparticles-updater-out-modes
+$ yarn add @tsparticles/updater-out-modes
 ```
@@ -61,6 +61,8 @@
 ```javascript
-const { tsParticles } = require("tsparticles-engine");
-const { loadOutModesUpdater } = require("tsparticles-updater-out-modes");
+const { tsParticles } = require("@tsparticles/engine");
+const { loadOutModesUpdater } = require("@tsparticles/updater-out-modes");
 
-loadOutModesUpdater(tsParticles);
+(async () => {
+  await loadOutModesUpdater(tsParticles);
+})();
 ```
@@ -71,6 +73,8 @@
 ```javascript
-import { tsParticles } from "tsparticles-engine";
-import { loadOutModesUpdater } from "tsparticles-updater-out-modes";
+import { tsParticles } from "@tsparticles/engine";
+import { loadOutModesUpdater } from "@tsparticles/updater-out-modes";
 
-loadOutModesUpdater(tsParticles);
+(async () => {
+  await loadOutModesUpdater(tsParticles);
+})();
 ```

tsparticles.updater.out-modes.js

@@ -7,3 +7,3 @@ /*!
  * How to use? : Check the GitHub README
- * v3.0.0-alpha.1
+ * v3.0.0-beta.0
  */
@@ -95,3 +95,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 __webpack_require__.d(__webpack_exports__, {
-  "loadOutModesUpdater": () => (/* binding */ loadOutModesUpdater)
+  loadOutModesUpdater: () => (/* binding */ loadOutModesUpdater)
 });
@@ -104,8 +104,8 @@
 function bounceHorizontal(data) {
-  if (data.outMode !== "bounce" && data.outMode !== "bounce-horizontal" && data.outMode !== "bounceHorizontal" && data.outMode !== "split") {
+  if (data.outMode !== "bounce" && data.outMode !== "bounce-horizontal" && data.outMode !== "bounceHorizontal" && data.outMode !== "split" || data.direction !== "left" && data.direction !== "right") {
     return;
   }
-  if (data.bounds.right < 0) {
+  if (data.bounds.right < 0 && data.direction === "left") {
     data.particle.position.x = data.size + data.offset.x;
-  } else if (data.bounds.left > data.canvasSize.width) {
+  } else if (data.bounds.left > data.canvasSize.width && data.direction === "right") {
     data.particle.position.x = data.canvasSize.width - data.size - data.offset.x;
@@ -124,5 +124,5 @@ }
   const minPos = data.offset.x + data.size;
-  if (data.bounds.right >= data.canvasSize.width) {
+  if (data.bounds.right >= data.canvasSize.width && data.direction === "right") {
     data.particle.position.x = data.canvasSize.width - minPos;
-  } else if (data.bounds.left <= 0) {
+  } else if (data.bounds.left <= 0 && data.direction === "left") {
     data.particle.position.x = minPos;
@@ -135,8 +135,8 @@ }
 function bounceVertical(data) {
-  if (data.outMode !== "bounce" && data.outMode !== "bounce-vertical" && data.outMode !== "bounceVertical" && data.outMode !== "split") {
+  if (data.outMode !== "bounce" && data.outMode !== "bounce-vertical" && data.outMode !== "bounceVertical" && data.outMode !== "split" || data.direction !== "bottom" && data.direction !== "top") {
     return;
   }
-  if (data.bounds.bottom < 0) {
+  if (data.bounds.bottom < 0 && data.direction === "top") {
     data.particle.position.y = data.size + data.offset.y;
-  } else if (data.bounds.top > data.canvasSize.height) {
+  } else if (data.bounds.top > data.canvasSize.height && data.direction === "bottom") {
     data.particle.position.y = data.canvasSize.height - data.size - data.offset.y;
@@ -155,5 +155,5 @@ }
   const minPos = data.offset.y + data.size;
-  if (data.bounds.bottom >= data.canvasSize.height) {
+  if (data.bounds.bottom >= data.canvasSize.height && data.direction === "bottom") {
     data.particle.position.y = data.canvasSize.height - minPos;
-  } else if (data.bounds.top <= 0) {
+  } else if (data.bounds.top <= 0 && data.direction === "top") {
     data.particle.position.y = minPos;
@@ -222,3 +222,3 @@ }
   }
-  update(particle, direction, delta, outMode) {
+  update(particle, direction, _delta, outMode) {
     if (!this.modes.includes(outMode)) {
@@ -417,2 +417,7 @@ return;
     this.container = container;
+    this._updateOutMode = (particle, delta, outMode, direction) => {
+      for (const updater of this.updaters) {
+        updater.update(particle, direction, delta, outMode);
+      }
+    };
     this.updaters = [new BounceOutMode(container), new DestroyOutMode(container), new OutOutMode(container), new NoneOutMode(container)];
@@ -425,19 +430,13 @@ }
   update(particle, delta) {
-    var _a, _b, _c, _d;
     const outModes = particle.options.move.outModes;
-    this.updateOutMode(particle, delta, (_a = outModes.bottom) !== null && _a !== void 0 ? _a : outModes.default, "bottom");
-    this.updateOutMode(particle, delta, (_b = outModes.left) !== null && _b !== void 0 ? _b : outModes.default, "left");
-    this.updateOutMode(particle, delta, (_c = outModes.right) !== null && _c !== void 0 ? _c : outModes.default, "right");
-    this.updateOutMode(particle, delta, (_d = outModes.top) !== null && _d !== void 0 ? _d : outModes.default, "top");
+    this._updateOutMode(particle, delta, outModes.bottom ?? outModes.default, "bottom");
+    this._updateOutMode(particle, delta, outModes.left ?? outModes.default, "left");
+    this._updateOutMode(particle, delta, outModes.right ?? outModes.default, "right");
+    this._updateOutMode(particle, delta, outModes.top ?? outModes.default, "top");
   }
-  updateOutMode(particle, delta, outMode, direction) {
-    for (const updater of this.updaters) {
-      updater.update(particle, direction, delta, outMode);
-    }
-  }
 }
 ;// CONCATENATED MODULE: ./dist/browser/index.js
 
-async function loadOutModesUpdater(engine) {
-  await engine.addParticleUpdater("outModes", container => new OutOfCanvasUpdater(container));
+async function loadOutModesUpdater(engine, refresh = true) {
+  await engine.addParticleUpdater("outModes", container => new OutOfCanvasUpdater(container), refresh);
 }
@@ -444,0 +443,0 @@ })();

tsparticles.updater.out-modes.min.js

 /*! For license information please see tsparticles.updater.out-modes.min.js.LICENSE.txt */
-!function(t,o){if("object"==typeof exports&&"object"==typeof module)module.exports=o(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],o);else{var e="object"==typeof exports?o(require("@tsparticles/engine")):o(t.window);for(var i in e)("object"==typeof exports?exports:t)[i]=e[i]}}(this,(t=>(()=>{"use strict";var o={533:o=>{o.exports=t}},e={};function i(t){var n=e[t];if(void 0!==n)return n.exports;var s=e[t]={exports:{}};return o[t](s,s.exports,i),s.exports}i.d=(t,o)=>{for(var e in o)i.o(o,e)&&!i.o(t,e)&&Object.defineProperty(t,e,{enumerable:!0,get:o[e]})},i.o=(t,o)=>Object.prototype.hasOwnProperty.call(t,o),i.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var n={};return(()=>{i.r(n),i.d(n,{loadOutModesUpdater:()=>c});var t=i(533);class o{constructor(t){this.container=t,this.modes=["bounce","bounce-vertical","bounce-horizontal","bounceVertical","bounceHorizontal","split"]}update(o,e,i,n){if(!this.modes.includes(n))return;const s=this.container;let a=!1;for(const[,t]of s.plugins)if(void 0!==t.particleBounce&&(a=t.particleBounce(o,i,e)),a)break;if(a)return;const r=o.getPosition(),c=o.offset,d=o.getRadius(),u=(0,t.calculateBounds)(r,d),l=s.canvas.size;!function(o){if("bounce"!==o.outMode&&"bounce-horizontal"!==o.outMode&&"bounceHorizontal"!==o.outMode&&"split"!==o.outMode)return;o.bounds.right<0?o.particle.position.x=o.size+o.offset.x:o.bounds.left>o.canvasSize.width&&(o.particle.position.x=o.canvasSize.width-o.size-o.offset.x);const e=o.particle.velocity.x;let i=!1;if("right"===o.direction&&o.bounds.right>=o.canvasSize.width&&e>0||"left"===o.direction&&o.bounds.left<=0&&e<0){const e=(0,t.getValue)(o.particle.options.bounce.horizontal);o.particle.velocity.x*=-e,i=!0}if(!i)return;const n=o.offset.x+o.size;o.bounds.right>=o.canvasSize.width?o.particle.position.x=o.canvasSize.width-n:o.bounds.left<=0&&(o.particle.position.x=n),"split"===o.outMode&&o.particle.destroy()}({particle:o,outMode:n,direction:e,bounds:u,canvasSize:l,offset:c,size:d}),function(o){if("bounce"!==o.outMode&&"bounce-vertical"!==o.outMode&&"bounceVertical"!==o.outMode&&"split"!==o.outMode)return;o.bounds.bottom<0?o.particle.position.y=o.size+o.offset.y:o.bounds.top>o.canvasSize.height&&(o.particle.position.y=o.canvasSize.height-o.size-o.offset.y);const e=o.particle.velocity.y;let i=!1;if("bottom"===o.direction&&o.bounds.bottom>=o.canvasSize.height&&e>0||"top"===o.direction&&o.bounds.top<=0&&e<0){const e=(0,t.getValue)(o.particle.options.bounce.vertical);o.particle.velocity.y*=-e,i=!0}if(!i)return;const n=o.offset.y+o.size;o.bounds.bottom>=o.canvasSize.height?o.particle.position.y=o.canvasSize.height-n:o.bounds.top<=0&&(o.particle.position.y=n),"split"===o.outMode&&o.particle.destroy()}({particle:o,outMode:n,direction:e,bounds:u,canvasSize:l,offset:c,size:d})}}class e{constructor(t){this.container=t,this.modes=["destroy"]}update(o,e,i,n){if(!this.modes.includes(n))return;const s=this.container;switch(o.outType){case"normal":case"outside":if((0,t.isPointInside)(o.position,s.canvas.size,t.Vector.origin,o.getRadius(),e))return;break;case"inside":{const{dx:e,dy:i}=(0,t.getDistances)(o.position,o.moveCenter),{x:n,y:s}=o.velocity;if(n<0&&e>o.moveCenter.radius||s<0&&i>o.moveCenter.radius||n>=0&&e<-o.moveCenter.radius||s>=0&&i<-o.moveCenter.radius)return;break}}s.particles.remove(o,void 0,!0)}}class s{constructor(t){this.container=t,this.modes=["none"]}update(o,e,i,n){if(!this.modes.includes(n))return;if(o.options.move.distance.horizontal&&("left"===e||"right"===e)||o.options.move.distance.vertical&&("top"===e||"bottom"===e))return;const s=o.options.move.gravity,a=this.container,r=a.canvas.size,c=o.getRadius();if(s.enable){const t=o.position;(!s.inverse&&t.y>r.height+c&&"bottom"===e||s.inverse&&t.y<-c&&"top"===e)&&a.particles.remove(o)}else{if(o.velocity.y>0&&o.position.y<=r.height+c||o.velocity.y<0&&o.position.y>=-c||o.velocity.x>0&&o.position.x<=r.width+c||o.velocity.x<0&&o.position.x>=-c)return;(0,t.isPointInside)(o.position,a.canvas.size,t.Vector.origin,c,e)||a.particles.remove(o)}}}class a{constructor(t){this.container=t,this.modes=["out"]}update(o,e,i,n){if(!this.modes.includes(n))return;const s=this.container;switch(o.outType){case"inside":{const{x:e,y:i}=o.velocity,n=t.Vector.origin;n.length=o.moveCenter.radius,n.angle=o.velocity.angle+Math.PI,n.addTo(t.Vector.create(o.moveCenter));const{dx:a,dy:r}=(0,t.getDistances)(o.position,n);if(e<=0&&a>=0||i<=0&&r>=0||e>=0&&a<=0||i>=0&&r<=0)return;o.position.x=Math.floor((0,t.randomInRange)({min:0,max:s.canvas.size.width})),o.position.y=Math.floor((0,t.randomInRange)({min:0,max:s.canvas.size.height}));const{dx:c,dy:d}=(0,t.getDistances)(o.position,o.moveCenter);o.direction=Math.atan2(-d,-c),o.velocity.angle=o.direction;break}default:if((0,t.isPointInside)(o.position,s.canvas.size,t.Vector.origin,o.getRadius(),e))return;switch(o.outType){case"outside":{o.position.x=Math.floor((0,t.randomInRange)({min:-o.moveCenter.radius,max:o.moveCenter.radius}))+o.moveCenter.x,o.position.y=Math.floor((0,t.randomInRange)({min:-o.moveCenter.radius,max:o.moveCenter.radius}))+o.moveCenter.y;const{dx:e,dy:i}=(0,t.getDistances)(o.position,o.moveCenter);o.moveCenter.radius&&(o.direction=Math.atan2(i,e),o.velocity.angle=o.direction);break}case"normal":{const i=o.options.move.warp,n=s.canvas.size,a={bottom:n.height+o.getRadius()+o.offset.y,left:-o.getRadius()-o.offset.x,right:n.width+o.getRadius()+o.offset.x,top:-o.getRadius()-o.offset.y},r=o.getRadius(),c=(0,t.calculateBounds)(o.position,r);"right"===e&&c.left>n.width+o.offset.x?(o.position.x=a.left,o.initialPosition.x=o.position.x,i||(o.position.y=(0,t.getRandom)()*n.height,o.initialPosition.y=o.position.y)):"left"===e&&c.right<-o.offset.x&&(o.position.x=a.right,o.initialPosition.x=o.position.x,i||(o.position.y=(0,t.getRandom)()*n.height,o.initialPosition.y=o.position.y)),"bottom"===e&&c.top>n.height+o.offset.y?(i||(o.position.x=(0,t.getRandom)()*n.width,o.initialPosition.x=o.position.x),o.position.y=a.top,o.initialPosition.y=o.position.y):"top"===e&&c.bottom<-o.offset.y&&(i||(o.position.x=(0,t.getRandom)()*n.width,o.initialPosition.x=o.position.x),o.position.y=a.bottom,o.initialPosition.y=o.position.y);break}}}}}class r{constructor(t){this.container=t,this.updaters=[new o(t),new e(t),new a(t),new s(t)]}init(){}isEnabled(t){return!t.destroyed&&!t.spawning}update(t,o){var e,i,n,s;const a=t.options.move.outModes;this.updateOutMode(t,o,null!==(e=a.bottom)&&void 0!==e?e:a.default,"bottom"),this.updateOutMode(t,o,null!==(i=a.left)&&void 0!==i?i:a.default,"left"),this.updateOutMode(t,o,null!==(n=a.right)&&void 0!==n?n:a.default,"right"),this.updateOutMode(t,o,null!==(s=a.top)&&void 0!==s?s:a.default,"top")}updateOutMode(t,o,e,i){for(const n of this.updaters)n.update(t,i,o,e)}}async function c(t){await t.addParticleUpdater("outModes",(t=>new r(t)))}})(),n})()));
+!function(t,o){if("object"==typeof exports&&"object"==typeof module)module.exports=o(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],o);else{var e="object"==typeof exports?o(require("@tsparticles/engine")):o(t.window);for(var i in e)("object"==typeof exports?exports:t)[i]=e[i]}}(this,(t=>(()=>{"use strict";var o={533:o=>{o.exports=t}},e={};function i(t){var n=e[t];if(void 0!==n)return n.exports;var s=e[t]={exports:{}};return o[t](s,s.exports,i),s.exports}i.d=(t,o)=>{for(var e in o)i.o(o,e)&&!i.o(t,e)&&Object.defineProperty(t,e,{enumerable:!0,get:o[e]})},i.o=(t,o)=>Object.prototype.hasOwnProperty.call(t,o),i.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var n={};return(()=>{i.r(n),i.d(n,{loadOutModesUpdater:()=>c});var t=i(533);class o{constructor(t){this.container=t,this.modes=["bounce","bounce-vertical","bounce-horizontal","bounceVertical","bounceHorizontal","split"]}update(o,e,i,n){if(!this.modes.includes(n))return;const s=this.container;let r=!1;for(const[,t]of s.plugins)if(void 0!==t.particleBounce&&(r=t.particleBounce(o,i,e)),r)break;if(r)return;const a=o.getPosition(),c=o.offset,d=o.getRadius(),u=(0,t.calculateBounds)(a,d),p=s.canvas.size;!function(o){if("bounce"!==o.outMode&&"bounce-horizontal"!==o.outMode&&"bounceHorizontal"!==o.outMode&&"split"!==o.outMode||"left"!==o.direction&&"right"!==o.direction)return;o.bounds.right<0&&"left"===o.direction?o.particle.position.x=o.size+o.offset.x:o.bounds.left>o.canvasSize.width&&"right"===o.direction&&(o.particle.position.x=o.canvasSize.width-o.size-o.offset.x);const e=o.particle.velocity.x;let i=!1;if("right"===o.direction&&o.bounds.right>=o.canvasSize.width&&e>0||"left"===o.direction&&o.bounds.left<=0&&e<0){const e=(0,t.getValue)(o.particle.options.bounce.horizontal);o.particle.velocity.x*=-e,i=!0}if(!i)return;const n=o.offset.x+o.size;o.bounds.right>=o.canvasSize.width&&"right"===o.direction?o.particle.position.x=o.canvasSize.width-n:o.bounds.left<=0&&"left"===o.direction&&(o.particle.position.x=n),"split"===o.outMode&&o.particle.destroy()}({particle:o,outMode:n,direction:e,bounds:u,canvasSize:p,offset:c,size:d}),function(o){if("bounce"!==o.outMode&&"bounce-vertical"!==o.outMode&&"bounceVertical"!==o.outMode&&"split"!==o.outMode||"bottom"!==o.direction&&"top"!==o.direction)return;o.bounds.bottom<0&&"top"===o.direction?o.particle.position.y=o.size+o.offset.y:o.bounds.top>o.canvasSize.height&&"bottom"===o.direction&&(o.particle.position.y=o.canvasSize.height-o.size-o.offset.y);const e=o.particle.velocity.y;let i=!1;if("bottom"===o.direction&&o.bounds.bottom>=o.canvasSize.height&&e>0||"top"===o.direction&&o.bounds.top<=0&&e<0){const e=(0,t.getValue)(o.particle.options.bounce.vertical);o.particle.velocity.y*=-e,i=!0}if(!i)return;const n=o.offset.y+o.size;o.bounds.bottom>=o.canvasSize.height&&"bottom"===o.direction?o.particle.position.y=o.canvasSize.height-n:o.bounds.top<=0&&"top"===o.direction&&(o.particle.position.y=n),"split"===o.outMode&&o.particle.destroy()}({particle:o,outMode:n,direction:e,bounds:u,canvasSize:p,offset:c,size:d})}}class e{constructor(t){this.container=t,this.modes=["destroy"]}update(o,e,i,n){if(!this.modes.includes(n))return;const s=this.container;switch(o.outType){case"normal":case"outside":if((0,t.isPointInside)(o.position,s.canvas.size,t.Vector.origin,o.getRadius(),e))return;break;case"inside":{const{dx:e,dy:i}=(0,t.getDistances)(o.position,o.moveCenter),{x:n,y:s}=o.velocity;if(n<0&&e>o.moveCenter.radius||s<0&&i>o.moveCenter.radius||n>=0&&e<-o.moveCenter.radius||s>=0&&i<-o.moveCenter.radius)return;break}}s.particles.remove(o,void 0,!0)}}class s{constructor(t){this.container=t,this.modes=["none"]}update(o,e,i,n){if(!this.modes.includes(n))return;if(o.options.move.distance.horizontal&&("left"===e||"right"===e)||o.options.move.distance.vertical&&("top"===e||"bottom"===e))return;const s=o.options.move.gravity,r=this.container,a=r.canvas.size,c=o.getRadius();if(s.enable){const t=o.position;(!s.inverse&&t.y>a.height+c&&"bottom"===e||s.inverse&&t.y<-c&&"top"===e)&&r.particles.remove(o)}else{if(o.velocity.y>0&&o.position.y<=a.height+c||o.velocity.y<0&&o.position.y>=-c||o.velocity.x>0&&o.position.x<=a.width+c||o.velocity.x<0&&o.position.x>=-c)return;(0,t.isPointInside)(o.position,r.canvas.size,t.Vector.origin,c,e)||r.particles.remove(o)}}}class r{constructor(t){this.container=t,this.modes=["out"]}update(o,e,i,n){if(!this.modes.includes(n))return;const s=this.container;switch(o.outType){case"inside":{const{x:e,y:i}=o.velocity,n=t.Vector.origin;n.length=o.moveCenter.radius,n.angle=o.velocity.angle+Math.PI,n.addTo(t.Vector.create(o.moveCenter));const{dx:r,dy:a}=(0,t.getDistances)(o.position,n);if(e<=0&&r>=0||i<=0&&a>=0||e>=0&&r<=0||i>=0&&a<=0)return;o.position.x=Math.floor((0,t.randomInRange)({min:0,max:s.canvas.size.width})),o.position.y=Math.floor((0,t.randomInRange)({min:0,max:s.canvas.size.height}));const{dx:c,dy:d}=(0,t.getDistances)(o.position,o.moveCenter);o.direction=Math.atan2(-d,-c),o.velocity.angle=o.direction;break}default:if((0,t.isPointInside)(o.position,s.canvas.size,t.Vector.origin,o.getRadius(),e))return;switch(o.outType){case"outside":{o.position.x=Math.floor((0,t.randomInRange)({min:-o.moveCenter.radius,max:o.moveCenter.radius}))+o.moveCenter.x,o.position.y=Math.floor((0,t.randomInRange)({min:-o.moveCenter.radius,max:o.moveCenter.radius}))+o.moveCenter.y;const{dx:e,dy:i}=(0,t.getDistances)(o.position,o.moveCenter);o.moveCenter.radius&&(o.direction=Math.atan2(i,e),o.velocity.angle=o.direction);break}case"normal":{const i=o.options.move.warp,n=s.canvas.size,r={bottom:n.height+o.getRadius()+o.offset.y,left:-o.getRadius()-o.offset.x,right:n.width+o.getRadius()+o.offset.x,top:-o.getRadius()-o.offset.y},a=o.getRadius(),c=(0,t.calculateBounds)(o.position,a);"right"===e&&c.left>n.width+o.offset.x?(o.position.x=r.left,o.initialPosition.x=o.position.x,i||(o.position.y=(0,t.getRandom)()*n.height,o.initialPosition.y=o.position.y)):"left"===e&&c.right<-o.offset.x&&(o.position.x=r.right,o.initialPosition.x=o.position.x,i||(o.position.y=(0,t.getRandom)()*n.height,o.initialPosition.y=o.position.y)),"bottom"===e&&c.top>n.height+o.offset.y?(i||(o.position.x=(0,t.getRandom)()*n.width,o.initialPosition.x=o.position.x),o.position.y=r.top,o.initialPosition.y=o.position.y):"top"===e&&c.bottom<-o.offset.y&&(i||(o.position.x=(0,t.getRandom)()*n.width,o.initialPosition.x=o.position.x),o.position.y=r.bottom,o.initialPosition.y=o.position.y);break}}}}}class a{constructor(t){this.container=t,this._updateOutMode=(t,o,e,i)=>{for(const n of this.updaters)n.update(t,i,o,e)},this.updaters=[new o(t),new e(t),new r(t),new s(t)]}init(){}isEnabled(t){return!t.destroyed&&!t.spawning}update(t,o){const e=t.options.move.outModes;this._updateOutMode(t,o,e.bottom??e.default,"bottom"),this._updateOutMode(t,o,e.left??e.default,"left"),this._updateOutMode(t,o,e.right??e.default,"right"),this._updateOutMode(t,o,e.top??e.default,"top")}}async function c(t,o=!0){await t.addParticleUpdater("outModes",(t=>new a(t)),o)}})(),n})()));

tsparticles.updater.out-modes.min.js.LICENSE.txt

@@ -1,8 +0,1 @@
-/*!
- * Author : Matteo Bruni
- * MIT license: https://opensource.org/licenses/MIT
- * Demo / Generator : https://particles.js.org/
- * GitHub : https://www.github.com/matteobruni/tsparticles
- * How to use? : Check the GitHub README
- * v3.0.0-alpha.1
- */
+/*! tsParticles Out Modes Updater v3.0.0-beta.0 by Matteo Bruni */

types/BounceOutMode.d.ts

@@ -1,3 +0,2 @@
-import type { Container, IDelta, OutModeAlt, OutModeDirection, Particle } from "@tsparticles/engine";
-import { OutMode } from "@tsparticles/engine";
+import { type Container, type IDelta, OutMode, type OutModeAlt, type OutModeDirection, type Particle } from "@tsparticles/engine";
 import type { IOutModeManager } from "./IOutModeManager";
@@ -4,0 +3,0 @@ export declare class BounceOutMode implements IOutModeManager {

types/DestroyOutMode.d.ts

@@ -1,3 +0,2 @@
-import type { Container, IDelta, OutModeAlt, OutModeDirection, Particle } from "@tsparticles/engine";
-import { OutMode } from "@tsparticles/engine";
+import { type Container, type IDelta, OutMode, type OutModeAlt, type OutModeDirection, type Particle } from "@tsparticles/engine";
 import type { IOutModeManager } from "./IOutModeManager";
@@ -8,3 +7,3 @@ export declare class DestroyOutMode implements IOutModeManager {
     constructor(container: Container);
-    update(particle: Particle, direction: OutModeDirection, delta: IDelta, outMode: OutMode | OutModeAlt | keyof typeof OutMode): void;
+    update(particle: Particle, direction: OutModeDirection, _delta: IDelta, outMode: OutMode | OutModeAlt | keyof typeof OutMode): void;
 }

types/IBounceData.d.ts

@@ -1,3 +0,2 @@
-import type { IBounds, ICoordinates, IDimension, OutMode, OutModeAlt, OutModeDirection } from "@tsparticles/engine";
-import type { Particle } from "@tsparticles/engine";
+import type { IBounds, ICoordinates, IDimension, OutMode, OutModeAlt, OutModeDirection, Particle } from "@tsparticles/engine";
 export interface IBounceData {
@@ -4,0 +3,0 @@ bounds: IBounds;

types/index.d.ts

 import type { Engine } from "@tsparticles/engine";
-export declare function loadOutModesUpdater(engine: Engine): Promise<void>;
+export declare function loadOutModesUpdater(engine: Engine, refresh?: boolean): Promise<void>;

types/NoneOutMode.d.ts

@@ -1,3 +0,2 @@
-import type { Container, IDelta, OutModeAlt, Particle } from "@tsparticles/engine";
-import { OutMode, OutModeDirection } from "@tsparticles/engine";
+import { type Container, type IDelta, OutMode, type OutModeAlt, OutModeDirection, type Particle } from "@tsparticles/engine";
 import type { IOutModeManager } from "./IOutModeManager";
@@ -4,0 +3,0 @@ export declare class NoneOutMode implements IOutModeManager {

types/OutOfCanvasUpdater.d.ts

@@ -1,2 +0,2 @@
-import type { Container, IDelta, IParticleUpdater, Particle } from "@tsparticles/engine";
+import { type Container, type IDelta, type IParticleUpdater, type Particle } from "@tsparticles/engine";
 import type { IOutModeManager } from "./IOutModeManager";
@@ -10,3 +10,3 @@ export declare class OutOfCanvasUpdater implements IParticleUpdater {
     update(particle: Particle, delta: IDelta): void;
-    private updateOutMode;
+    private readonly _updateOutMode;
 }

types/OutOutMode.d.ts

@@ -1,3 +0,2 @@
-import type { Container, IDelta, OutModeAlt, Particle } from "@tsparticles/engine";
-import { OutMode, OutModeDirection } from "@tsparticles/engine";
+import { type Container, type IDelta, OutMode, type OutModeAlt, OutModeDirection, type Particle } from "@tsparticles/engine";
 import type { IOutModeManager } from "./IOutModeManager";
@@ -4,0 +3,0 @@ export declare class OutOutMode implements IOutModeManager {

umd/DestroyOutMode.js

@@ -19,3 +19,3 @@ (function (factory) {
         }
-        update(particle, direction, delta, outMode) {
+        update(particle, direction, _delta, outMode) {
             if (!this.modes.includes(outMode)) {
@@ -22,0 +22,0 @@ return;

umd/index.js

@@ -14,6 +14,6 @@ (function (factory) {
     const OutOfCanvasUpdater_1 = require("./OutOfCanvasUpdater");
-    async function loadOutModesUpdater(engine) {
-        await engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater_1.OutOfCanvasUpdater(container));
+    async function loadOutModesUpdater(engine, refresh = true) {
+        await engine.addParticleUpdater("outModes", (container) => new OutOfCanvasUpdater_1.OutOfCanvasUpdater(container), refresh);
     }
     exports.loadOutModesUpdater = loadOutModesUpdater;
 });

umd/OutOfCanvasUpdater.js

@@ -20,2 +20,7 @@ (function (factory) {
             this.container = container;
+            this._updateOutMode = (particle, delta, outMode, direction) => {
+                for (const updater of this.updaters) {
+                    updater.update(particle, direction, delta, outMode);
+                }
+            };
             this.updaters = [
@@ -34,16 +39,10 @@ new BounceOutMode_1.BounceOutMode(container),
         update(particle, delta) {
-            var _a, _b, _c, _d;
             const outModes = particle.options.move.outModes;
-            this.updateOutMode(particle, delta, (_a = outModes.bottom) !== null && _a !== void 0 ? _a : outModes.default, "bottom");
-            this.updateOutMode(particle, delta, (_b = outModes.left) !== null && _b !== void 0 ? _b : outModes.default, "left");
-            this.updateOutMode(particle, delta, (_c = outModes.right) !== null && _c !== void 0 ? _c : outModes.default, "right");
-            this.updateOutMode(particle, delta, (_d = outModes.top) !== null && _d !== void 0 ? _d : outModes.default, "top");
+            this._updateOutMode(particle, delta, outModes.bottom ?? outModes.default, "bottom");
+            this._updateOutMode(particle, delta, outModes.left ?? outModes.default, "left");
+            this._updateOutMode(particle, delta, outModes.right ?? outModes.default, "right");
+            this._updateOutMode(particle, delta, outModes.top ?? outModes.default, "top");
         }
-        updateOutMode(particle, delta, outMode, direction) {
-            for (const updater of this.updaters) {
-                updater.update(particle, direction, delta, outMode);
-            }
-        }
     }
     exports.OutOfCanvasUpdater = OutOfCanvasUpdater;
 });

umd/Utils.js

@@ -15,12 +15,13 @@ (function (factory) {
     function bounceHorizontal(data) {
-        if (data.outMode !== "bounce" &&
+        if ((data.outMode !== "bounce" &&
             data.outMode !== "bounce-horizontal" &&
             data.outMode !== "bounceHorizontal" &&
-            data.outMode !== "split") {
+            data.outMode !== "split") ||
+            (data.direction !== "left" && data.direction !== "right")) {
             return;
         }
-        if (data.bounds.right < 0) {
+        if (data.bounds.right < 0 && data.direction === "left") {
             data.particle.position.x = data.size + data.offset.x;
         }
-        else if (data.bounds.left > data.canvasSize.width) {
+        else if (data.bounds.left > data.canvasSize.width && data.direction === "right") {
             data.particle.position.x = data.canvasSize.width - data.size - data.offset.x;
@@ -40,6 +41,6 @@ }
         const minPos = data.offset.x + data.size;
-        if (data.bounds.right >= data.canvasSize.width) {
+        if (data.bounds.right >= data.canvasSize.width && data.direction === "right") {
             data.particle.position.x = data.canvasSize.width - minPos;
         }
-        else if (data.bounds.left <= 0) {
+        else if (data.bounds.left <= 0 && data.direction === "left") {
             data.particle.position.x = minPos;
@@ -53,12 +54,13 @@ }
     function bounceVertical(data) {
-        if (data.outMode !== "bounce" &&
+        if ((data.outMode !== "bounce" &&
             data.outMode !== "bounce-vertical" &&
             data.outMode !== "bounceVertical" &&
-            data.outMode !== "split") {
+            data.outMode !== "split") ||
+            (data.direction !== "bottom" && data.direction !== "top")) {
             return;
         }
-        if (data.bounds.bottom < 0) {
+        if (data.bounds.bottom < 0 && data.direction === "top") {
             data.particle.position.y = data.size + data.offset.y;
         }
-        else if (data.bounds.top > data.canvasSize.height) {
+        else if (data.bounds.top > data.canvasSize.height && data.direction === "bottom") {
             data.particle.position.y = data.canvasSize.height - data.size - data.offset.y;
@@ -78,6 +80,6 @@ }
         const minPos = data.offset.y + data.size;
-        if (data.bounds.bottom >= data.canvasSize.height) {
+        if (data.bounds.bottom >= data.canvasSize.height && data.direction === "bottom") {
             data.particle.position.y = data.canvasSize.height - minPos;
         }
-        else if (data.bounds.top <= 0) {
+        else if (data.bounds.top <= 0 && data.direction === "top") {
             data.particle.position.y = minPos;
@@ -84,0 +86,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

379357

increased by0.14%

Number of lines in readme file

75

increased by5.63%

Worsened metrics

Lines of code

1948

decreased by-0.66%

Dependency changes

• Updated@tsparticles/engine@^3.0.0-beta.0