@tsparticles/interaction-external-bounce 3.9.1 → 4.0.0-alpha.0

package/85.min.js

@@ -0,0 +1,2 @@
+/*! For license information please see 85.min.js.LICENSE.txt */
+(this.webpackChunk_tsparticles_interaction_external_bounce=this.webpackChunk_tsparticles_interaction_external_bounce||[]).push([[85],{85(t,e,i){i.d(e,{Bouncer:()=>d});var o=i(303);const n=.5,c=Math.PI*n;function a(t,e,i,n,a){const r=t.particles.quadTree.query(n,a);for(const t of r)n instanceof o.Circle?(0,o.circleBounce)((0,o.circleBounceDataFromParticle)(t),{position:e,radius:i,mass:i**2*c,velocity:o.Vector.origin,factor:o.Vector.origin}):n instanceof o.Rectangle&&l(t,(0,o.calculateBounds)(e,i))}function r(t,e,i,c){(0,o.divModeExecute)(i,e,((e,i)=>{!function(t,e,i,c){const a=(0,o.safeDocument)().querySelectorAll(e);a.length&&a.forEach((e=>{const a=e,r=t.retina.pixelRatio,s={x:(a.offsetLeft+a.offsetWidth*n)*r,y:(a.offsetTop+a.offsetHeight*n)*r},l=a.offsetWidth*n*r,u=10*r,m=i.type===o.DivType.circle?new o.Circle(s.x,s.y,l+u):new o.Rectangle(a.offsetLeft*r-u,a.offsetTop*r-u,a.offsetWidth*r+2*u,a.offsetHeight*r+2*u);c(s,l,m)}))}(t,e,i,((e,i,o)=>{a(t,e,i,o,c)}))}))}function s(t){const e={bounced:!1},{pSide:i,pOtherSide:o,rectSide:c,rectOtherSide:a,velocity:r,factor:s}=t;return o.min<a.min||o.min>a.max||o.max<a.min||o.max>a.max||(i.max>=c.min&&i.max<=(c.max+c.min)*n&&r>0||i.min<=c.max&&i.min>(c.max+c.min)*n&&r<0)&&(e.velocity=r*-s,e.bounced=!0),e}function l(t,e){const i=t.getPosition(),n=t.getRadius(),c=(0,o.calculateBounds)(i,n),a=t.options.bounce,r=s({pSide:{min:c.left,max:c.right},pOtherSide:{min:c.top,max:c.bottom},rectSide:{min:e.left,max:e.right},rectOtherSide:{min:e.top,max:e.bottom},velocity:t.velocity.x,factor:(0,o.getRangeValue)(a.horizontal.value)});r.bounced&&(void 0!==r.velocity&&(t.velocity.x=r.velocity),void 0!==r.position&&(t.position.x=r.position));const l=s({pSide:{min:c.top,max:c.bottom},pOtherSide:{min:c.left,max:c.right},rectSide:{min:e.top,max:e.bottom},rectOtherSide:{min:e.left,max:e.right},velocity:t.velocity.y,factor:(0,o.getRangeValue)(a.vertical.value)});l.bounced&&(void 0!==l.velocity&&(t.velocity.y=l.velocity),void 0!==l.position&&(t.position.y=l.position))}var u=i(786);const m="bounce";class d extends o.ExternalInteractorBase{constructor(t){super(t)}clear(){}init(){const t=this.container,e=t.actualOptions.interactivity.modes.bounce;e&&(t.retina.bounceModeDistance=e.distance*t.retina.pixelRatio)}interact(){const t=this.container,e=t.actualOptions.interactivity.events,i=t.interactivity.status===o.mouseMoveEvent,n=e.onHover.enable,c=e.onHover.mode,s=e.onDiv;i&&n&&(0,o.isInArray)(m,c)?function(t,e){const i=10*t.retina.pixelRatio,n=t.interactivity.mouse.position,c=t.retina.bounceModeDistance;!c||c<0||!n||a(t,n,c,new o.Circle(n.x,n.y,c+i),e)}(this.container,(t=>this.isEnabled(t))):r(this.container,s,m,(t=>this.isEnabled(t)))}isEnabled(t){const e=this.container,i=e.actualOptions,n=e.interactivity.mouse,c=(t?.interactivity??i.interactivity).events,a=c.onDiv;return!!n.position&&c.onHover.enable&&(0,o.isInArray)(m,c.onHover.mode)||(0,o.isDivModeEnabled)(m,a)}loadModeOptions(t,...e){t.bounce??=new u.b;for(const i of e)t.bounce.load(i?.bounce)}reset(){}}}}]);

package/85.min.js.LICENSE.txt

@@ -0,0 +1 @@
+/*! tsParticles Bounce External Interaction v4.0.0-alpha.0 by Matteo Bruni */

package/browser/Bouncer.js

@@ -30,9 +30,7 @@ export class Bouncer extends ExternalInteractorBase {
             isDivModeEnabled(bounceMode, divs));
     }
     loadModeOptions(options, ...sources) {
-        if (!options.bounce) {
-            options.bounce = new Bounce();
-        }
+        options.bounce ??= new Bounce();
         for (const source of sources) {
             options.bounce.load(source?.bounce);
         }

package/browser/IRectSideResult.js

@@ -0,0 +1 @@
+export {};

package/browser/Utils.js

@@ -1,5 +1,5 @@
-import { Circle, DivType, Rectangle, Vector, calculateBounds, circleBounce, circleBounceDataFromParticle, divModeExecute, rectBounce, } from "@tsparticles/engine";
-const squareExp = 2, half = 0.5, halfPI = Math.PI * half, double = 2, toleranceFactor = 10, minRadius = 0;
+import { Circle, DivType, Rectangle, Vector, calculateBounds, circleBounce, circleBounceDataFromParticle, divModeExecute, getRangeValue, safeDocument, } from "@tsparticles/engine";
+const squareExp = 2, half = 0.5, halfPI = Math.PI * half, double = 2, toleranceFactor = 10, minRadius = 0, minVelocity = 0;
 function processBounce(container, position, radius, area, enabledCb) {
     const query = container.particles.quadTree.query(area, enabledCb);
     for (const particle of query) {
@@ -18,7 +18,7 @@ function processBounce(container, position, radius, area, enabledCb) {
     }
 }
 function singleSelectorBounce(container, selector, div, bounceCb) {
-    const query = document.querySelectorAll(selector);
+    const query = safeDocument().querySelectorAll(selector);
     if (!query.length) {
         return;
     }
@@ -33,7 +33,11 @@ function singleSelectorBounce(container, selector, div, bounceCb) {
     });
 }
 export function divBounce(container, divs, bounceMode, enabledCb) {
-    divModeExecute(bounceMode, divs, (selector, div) => singleSelectorBounce(container, selector, div, (pos, radius, area) => processBounce(container, pos, radius, area, enabledCb)));
+    divModeExecute(bounceMode, divs, (selector, div) => {
+        singleSelectorBounce(container, selector, div, (pos, radius, area) => {
+            processBounce(container, pos, radius, area, enabledCb);
+        });
+    });
 }
 export function mouseBounce(container, enabledCb) {
     const pxRatio = container.retina.pixelRatio, tolerance = toleranceFactor * pxRatio, mousePos = container.interactivity.mouse.position, radius = container.retina.bounceModeDistance;
@@ -42,3 +46,76 @@ export function mouseBounce(container, enabledCb) {
     }
     processBounce(container, mousePos, radius, new Circle(mousePos.x, mousePos.y, radius + tolerance), enabledCb);
 }
+function rectSideBounce(data) {
+    const res = { bounced: false }, { pSide, pOtherSide, rectSide, rectOtherSide, velocity, factor } = data;
+    if (pOtherSide.min < rectOtherSide.min ||
+        pOtherSide.min > rectOtherSide.max ||
+        pOtherSide.max < rectOtherSide.min ||
+        pOtherSide.max > rectOtherSide.max) {
+        return res;
+    }
+    if ((pSide.max >= rectSide.min && pSide.max <= (rectSide.max + rectSide.min) * half && velocity > minVelocity) ||
+        (pSide.min <= rectSide.max && pSide.min > (rectSide.max + rectSide.min) * half && velocity < minVelocity)) {
+        res.velocity = velocity * -factor;
+        res.bounced = true;
+    }
+    return res;
+}
+export function rectBounce(particle, divBounds) {
+    const pPos = particle.getPosition(), size = particle.getRadius(), bounds = calculateBounds(pPos, size), bounceOptions = particle.options.bounce, resH = rectSideBounce({
+        pSide: {
+            min: bounds.left,
+            max: bounds.right,
+        },
+        pOtherSide: {
+            min: bounds.top,
+            max: bounds.bottom,
+        },
+        rectSide: {
+            min: divBounds.left,
+            max: divBounds.right,
+        },
+        rectOtherSide: {
+            min: divBounds.top,
+            max: divBounds.bottom,
+        },
+        velocity: particle.velocity.x,
+        factor: getRangeValue(bounceOptions.horizontal.value),
+    });
+    if (resH.bounced) {
+        if (resH.velocity !== undefined) {
+            particle.velocity.x = resH.velocity;
+        }
+        if (resH.position !== undefined) {
+            particle.position.x = resH.position;
+        }
+    }
+    const resV = rectSideBounce({
+        pSide: {
+            min: bounds.top,
+            max: bounds.bottom,
+        },
+        pOtherSide: {
+            min: bounds.left,
+            max: bounds.right,
+        },
+        rectSide: {
+            min: divBounds.top,
+            max: divBounds.bottom,
+        },
+        rectOtherSide: {
+            min: divBounds.left,
+            max: divBounds.right,
+        },
+        velocity: particle.velocity.y,
+        factor: getRangeValue(bounceOptions.vertical.value),
+    });
+    if (resV.bounced) {
+        if (resV.velocity !== undefined) {
+            particle.velocity.y = resV.velocity;
+        }
+        if (resV.position !== undefined) {
+            particle.position.y = resV.position;
+        }
+    }
+}

package/browser/index.js

@@ -1,9 +1,10 @@
-import { Bouncer } from "./Bouncer.js";
-export async function loadExternalBounceInteraction(engine, refresh = true) {
-    engine.checkVersion("3.9.1");
-    await engine.addInteractor("externalBounce", container => {
-        return Promise.resolve(new Bouncer(container));
-    }, refresh);
+export function loadExternalBounceInteraction(engine) {
+    engine.checkVersion("4.0.0-alpha.0");
+    engine.register(e => {
+        e.addInteractor("externalBounce", async (container) => {
+            const { Bouncer } = await import("./Bouncer.js");
+            return new Bouncer(container);
+        });
+    });
 }
 export * from "./Options/Classes/Bounce.js";
-export * from "./Options/Interfaces/IBounce.js";

package/cjs/Bouncer.js

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Bouncer = void 0;
-const engine_1 = require("@tsparticles/engine");
-const Utils_js_1 = require("./Utils.js");
-const Bounce_js_1 = require("./Options/Classes/Bounce.js");
+import { ExternalInteractorBase, isDivModeEnabled, isInArray, mouseMoveEvent, } from "@tsparticles/engine";
+import { divBounce, mouseBounce } from "./Utils.js";
+import { Bounce } from "./Options/Classes/Bounce.js";
 const bounceMode = "bounce";
-class Bouncer extends engine_1.ExternalInteractorBase {
+export class Bouncer extends ExternalInteractorBase {
     constructor(container) {
         super(container);
     }
@@ -19,23 +16,21 @@ class Bouncer extends engine_1.ExternalInteractorBase {
         container.retina.bounceModeDistance = bounce.distance * container.retina.pixelRatio;
     }
     interact() {
-        const container = this.container, options = container.actualOptions, events = options.interactivity.events, mouseMoveStatus = container.interactivity.status === engine_1.mouseMoveEvent, hoverEnabled = events.onHover.enable, hoverMode = events.onHover.mode, divs = events.onDiv;
-        if (mouseMoveStatus && hoverEnabled && (0, engine_1.isInArray)(bounceMode, hoverMode)) {
-            (0, Utils_js_1.mouseBounce)(this.container, p => this.isEnabled(p));
+        const container = this.container, options = container.actualOptions, events = options.interactivity.events, mouseMoveStatus = container.interactivity.status === mouseMoveEvent, hoverEnabled = events.onHover.enable, hoverMode = events.onHover.mode, divs = events.onDiv;
+        if (mouseMoveStatus && hoverEnabled && isInArray(bounceMode, hoverMode)) {
+            mouseBounce(this.container, p => this.isEnabled(p));
         }
         else {
-            (0, Utils_js_1.divBounce)(this.container, divs, bounceMode, p => this.isEnabled(p));
+            divBounce(this.container, divs, bounceMode, p => this.isEnabled(p));
         }
     }
     isEnabled(particle) {
         const container = this.container, options = container.actualOptions, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? options.interactivity).events, divs = events.onDiv;
-        return ((!!mouse.position && events.onHover.enable && (0, engine_1.isInArray)(bounceMode, events.onHover.mode)) ||
-            (0, engine_1.isDivModeEnabled)(bounceMode, divs));
+        return ((!!mouse.position && events.onHover.enable && isInArray(bounceMode, events.onHover.mode)) ||
+            isDivModeEnabled(bounceMode, divs));
     }
     loadModeOptions(options, ...sources) {
-        if (!options.bounce) {
-            options.bounce = new Bounce_js_1.Bounce();
-        }
+        options.bounce ??= new Bounce();
         for (const source of sources) {
             options.bounce.load(source?.bounce);
         }
@@ -43,4 +38,3 @@ class Bouncer extends engine_1.ExternalInteractorBase {
     reset() {
     }
 }
-exports.Bouncer = Bouncer;

package/cjs/IRectSideResult.js

@@ -0,0 +1 @@
+export {};

package/cjs/Options/Classes/Bounce.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Bounce = void 0;
-const engine_1 = require("@tsparticles/engine");
-class Bounce {
+import { isNull } from "@tsparticles/engine";
+export class Bounce {
     constructor() {
         this.distance = 200;
     }
     load(data) {
-        if ((0, engine_1.isNull)(data)) {
+        if (isNull(data)) {
             return;
         }
         if (data.distance !== undefined) {
@@ -15,4 +12,3 @@ class Bounce {
         }
     }
 }
-exports.Bounce = Bounce;

package/cjs/Options/Classes/BounceOptions.js

@@ -1,2 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

package/cjs/Options/Interfaces/IBounce.js

@@ -1,2 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

package/cjs/Types.js

@@ -1,2 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

package/cjs/Utils.js

@@ -1,28 +1,24 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.divBounce = divBounce;
-exports.mouseBounce = mouseBounce;
-const engine_1 = require("@tsparticles/engine");
-const squareExp = 2, half = 0.5, halfPI = Math.PI * half, double = 2, toleranceFactor = 10, minRadius = 0;
+import { Circle, DivType, Rectangle, Vector, calculateBounds, circleBounce, circleBounceDataFromParticle, divModeExecute, getRangeValue, safeDocument, } from "@tsparticles/engine";
+const squareExp = 2, half = 0.5, halfPI = Math.PI * half, double = 2, toleranceFactor = 10, minRadius = 0, minVelocity = 0;
 function processBounce(container, position, radius, area, enabledCb) {
     const query = container.particles.quadTree.query(area, enabledCb);
     for (const particle of query) {
-        if (area instanceof engine_1.Circle) {
-            (0, engine_1.circleBounce)((0, engine_1.circleBounceDataFromParticle)(particle), {
+        if (area instanceof Circle) {
+            circleBounce(circleBounceDataFromParticle(particle), {
                 position,
                 radius,
                 mass: radius ** squareExp * halfPI,
-                velocity: engine_1.Vector.origin,
-                factor: engine_1.Vector.origin,
+                velocity: Vector.origin,
+                factor: Vector.origin,
             });
         }
-        else if (area instanceof engine_1.Rectangle) {
-            (0, engine_1.rectBounce)(particle, (0, engine_1.calculateBounds)(position, radius));
+        else if (area instanceof Rectangle) {
+            rectBounce(particle, calculateBounds(position, radius));
         }
     }
 }
 function singleSelectorBounce(container, selector, div, bounceCb) {
-    const query = document.querySelectorAll(selector);
+    const query = safeDocument().querySelectorAll(selector);
     if (!query.length) {
         return;
     }
@@ -30,19 +26,96 @@ function singleSelectorBounce(container, selector, div, bounceCb) {
         const elem = item, pxRatio = container.retina.pixelRatio, pos = {
             x: (elem.offsetLeft + elem.offsetWidth * half) * pxRatio,
             y: (elem.offsetTop + elem.offsetHeight * half) * pxRatio,
-        }, radius = elem.offsetWidth * half * pxRatio, tolerance = toleranceFactor * pxRatio, area = div.type === engine_1.DivType.circle
-            ? new engine_1.Circle(pos.x, pos.y, radius + tolerance)
-            : new engine_1.Rectangle(elem.offsetLeft * pxRatio - tolerance, elem.offsetTop * pxRatio - tolerance, elem.offsetWidth * pxRatio + tolerance * double, elem.offsetHeight * pxRatio + tolerance * double);
+        }, radius = elem.offsetWidth * half * pxRatio, tolerance = toleranceFactor * pxRatio, area = div.type === DivType.circle
+            ? new Circle(pos.x, pos.y, radius + tolerance)
+            : new Rectangle(elem.offsetLeft * pxRatio - tolerance, elem.offsetTop * pxRatio - tolerance, elem.offsetWidth * pxRatio + tolerance * double, elem.offsetHeight * pxRatio + tolerance * double);
         bounceCb(pos, radius, area);
     });
 }
-function divBounce(container, divs, bounceMode, enabledCb) {
-    (0, engine_1.divModeExecute)(bounceMode, divs, (selector, div) => singleSelectorBounce(container, selector, div, (pos, radius, area) => processBounce(container, pos, radius, area, enabledCb)));
+export function divBounce(container, divs, bounceMode, enabledCb) {
+    divModeExecute(bounceMode, divs, (selector, div) => {
+        singleSelectorBounce(container, selector, div, (pos, radius, area) => {
+            processBounce(container, pos, radius, area, enabledCb);
+        });
+    });
 }
-function mouseBounce(container, enabledCb) {
+export function mouseBounce(container, enabledCb) {
     const pxRatio = container.retina.pixelRatio, tolerance = toleranceFactor * pxRatio, mousePos = container.interactivity.mouse.position, radius = container.retina.bounceModeDistance;
     if (!radius || radius < minRadius || !mousePos) {
         return;
     }
-    processBounce(container, mousePos, radius, new engine_1.Circle(mousePos.x, mousePos.y, radius + tolerance), enabledCb);
+    processBounce(container, mousePos, radius, new Circle(mousePos.x, mousePos.y, radius + tolerance), enabledCb);
+}
+function rectSideBounce(data) {
+    const res = { bounced: false }, { pSide, pOtherSide, rectSide, rectOtherSide, velocity, factor } = data;
+    if (pOtherSide.min < rectOtherSide.min ||
+        pOtherSide.min > rectOtherSide.max ||
+        pOtherSide.max < rectOtherSide.min ||
+        pOtherSide.max > rectOtherSide.max) {
+        return res;
+    }
+    if ((pSide.max >= rectSide.min && pSide.max <= (rectSide.max + rectSide.min) * half && velocity > minVelocity) ||
+        (pSide.min <= rectSide.max && pSide.min > (rectSide.max + rectSide.min) * half && velocity < minVelocity)) {
+        res.velocity = velocity * -factor;
+        res.bounced = true;
+    }
+    return res;
+}
+export function rectBounce(particle, divBounds) {
+    const pPos = particle.getPosition(), size = particle.getRadius(), bounds = calculateBounds(pPos, size), bounceOptions = particle.options.bounce, resH = rectSideBounce({
+        pSide: {
+            min: bounds.left,
+            max: bounds.right,
+        },
+        pOtherSide: {
+            min: bounds.top,
+            max: bounds.bottom,
+        },
+        rectSide: {
+            min: divBounds.left,
+            max: divBounds.right,
+        },
+        rectOtherSide: {
+            min: divBounds.top,
+            max: divBounds.bottom,
+        },
+        velocity: particle.velocity.x,
+        factor: getRangeValue(bounceOptions.horizontal.value),
+    });
+    if (resH.bounced) {
+        if (resH.velocity !== undefined) {
+            particle.velocity.x = resH.velocity;
+        }
+        if (resH.position !== undefined) {
+            particle.position.x = resH.position;
+        }
+    }
+    const resV = rectSideBounce({
+        pSide: {
+            min: bounds.top,
+            max: bounds.bottom,
+        },
+        pOtherSide: {
+            min: bounds.left,
+            max: bounds.right,
+        },
+        rectSide: {
+            min: divBounds.top,
+            max: divBounds.bottom,
+        },
+        rectOtherSide: {
+            min: divBounds.left,
+            max: divBounds.right,
+        },
+        velocity: particle.velocity.y,
+        factor: getRangeValue(bounceOptions.vertical.value),
+    });
+    if (resV.bounced) {
+        if (resV.velocity !== undefined) {
+            particle.velocity.y = resV.velocity;
+        }
+        if (resV.position !== undefined) {
+            particle.position.y = resV.position;
+        }
+    }
 }

package/cjs/index.js

@@ -1,26 +1,10 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.loadExternalBounceInteraction = loadExternalBounceInteraction;
-const Bouncer_js_1 = require("./Bouncer.js");
-async function loadExternalBounceInteraction(engine, refresh = true) {
-    engine.checkVersion("3.9.1");
-    await engine.addInteractor("externalBounce", container => {
-        return Promise.resolve(new Bouncer_js_1.Bouncer(container));
-    }, refresh);
+export function loadExternalBounceInteraction(engine) {
+    engine.checkVersion("4.0.0-alpha.0");
+    engine.register(e => {
+        e.addInteractor("externalBounce", async (container) => {
+            const { Bouncer } = await import("./Bouncer.js");
+            return new Bouncer(container);
+        });
+    });
 }
-__exportStar(require("./Options/Classes/Bounce.js"), exports);
-__exportStar(require("./Options/Interfaces/IBounce.js"), exports);
+export * from "./Options/Classes/Bounce.js";

package/dist_browser_Bouncer_js.js

@@ -0,0 +1,40 @@
+/*!
+ * 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
+ * v4.0.0-alpha.0
+ */
+"use strict";
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+(this["webpackChunk_tsparticles_interaction_external_bounce"] = this["webpackChunk_tsparticles_interaction_external_bounce"] || []).push([["dist_browser_Bouncer_js"],{
+
+/***/ "./dist/browser/Bouncer.js"
+/*!*********************************!*\
+  !*** ./dist/browser/Bouncer.js ***!
+  \*********************************/
+(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Bouncer: () => (/* binding */ Bouncer)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n/* harmony import */ var _Options_Classes_Bounce_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Bounce.js */ \"./dist/browser/Options/Classes/Bounce.js\");\n\n\n\nconst bounceMode = \"bounce\";\nclass Bouncer extends _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.ExternalInteractorBase {\n  constructor(container) {\n    super(container);\n  }\n  clear() {}\n  init() {\n    const container = this.container,\n      bounce = container.actualOptions.interactivity.modes.bounce;\n    if (!bounce) {\n      return;\n    }\n    container.retina.bounceModeDistance = bounce.distance * container.retina.pixelRatio;\n  }\n  interact() {\n    const container = this.container,\n      options = container.actualOptions,\n      events = options.interactivity.events,\n      mouseMoveStatus = container.interactivity.status === _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.mouseMoveEvent,\n      hoverEnabled = events.onHover.enable,\n      hoverMode = events.onHover.mode,\n      divs = events.onDiv;\n    if (mouseMoveStatus && hoverEnabled && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bounceMode, hoverMode)) {\n      (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.mouseBounce)(this.container, p => this.isEnabled(p));\n    } else {\n      (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.divBounce)(this.container, divs, bounceMode, p => this.isEnabled(p));\n    }\n  }\n  isEnabled(particle) {\n    const container = this.container,\n      options = container.actualOptions,\n      mouse = container.interactivity.mouse,\n      events = (particle?.interactivity ?? options.interactivity).events,\n      divs = events.onDiv;\n    return !!mouse.position && events.onHover.enable && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(bounceMode, events.onHover.mode) || (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isDivModeEnabled)(bounceMode, divs);\n  }\n  loadModeOptions(options, ...sources) {\n    options.bounce ??= new _Options_Classes_Bounce_js__WEBPACK_IMPORTED_MODULE_2__.Bounce();\n    for (const source of sources) {\n      options.bounce.load(source?.bounce);\n    }\n  }\n  reset() {}\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bounce/./dist/browser/Bouncer.js?\n}");
+
+/***/ },
+
+/***/ "./dist/browser/Utils.js"
+/*!*******************************!*\
+  !*** ./dist/browser/Utils.js ***!
+  \*******************************/
+(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   divBounce: () => (/* binding */ divBounce),\n/* harmony export */   mouseBounce: () => (/* binding */ mouseBounce),\n/* harmony export */   rectBounce: () => (/* binding */ rectBounce)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nconst squareExp = 2,\n  half = 0.5,\n  halfPI = Math.PI * half,\n  double = 2,\n  toleranceFactor = 10,\n  minRadius = 0,\n  minVelocity = 0;\nfunction processBounce(container, position, radius, area, enabledCb) {\n  const query = container.particles.quadTree.query(area, enabledCb);\n  for (const particle of query) {\n    if (area instanceof _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle) {\n      (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.circleBounce)((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.circleBounceDataFromParticle)(particle), {\n        position,\n        radius,\n        mass: radius ** squareExp * halfPI,\n        velocity: _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Vector.origin,\n        factor: _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Vector.origin\n      });\n    } else if (area instanceof _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Rectangle) {\n      rectBounce(particle, (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.calculateBounds)(position, radius));\n    }\n  }\n}\nfunction singleSelectorBounce(container, selector, div, bounceCb) {\n  const query = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.safeDocument)().querySelectorAll(selector);\n  if (!query.length) {\n    return;\n  }\n  query.forEach(item => {\n    const elem = item,\n      pxRatio = container.retina.pixelRatio,\n      pos = {\n        x: (elem.offsetLeft + elem.offsetWidth * half) * pxRatio,\n        y: (elem.offsetTop + elem.offsetHeight * half) * pxRatio\n      },\n      radius = elem.offsetWidth * half * pxRatio,\n      tolerance = toleranceFactor * pxRatio,\n      area = div.type === _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.DivType.circle ? new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle(pos.x, pos.y, radius + tolerance) : new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Rectangle(elem.offsetLeft * pxRatio - tolerance, elem.offsetTop * pxRatio - tolerance, elem.offsetWidth * pxRatio + tolerance * double, elem.offsetHeight * pxRatio + tolerance * double);\n    bounceCb(pos, radius, area);\n  });\n}\nfunction divBounce(container, divs, bounceMode, enabledCb) {\n  (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.divModeExecute)(bounceMode, divs, (selector, div) => {\n    singleSelectorBounce(container, selector, div, (pos, radius, area) => {\n      processBounce(container, pos, radius, area, enabledCb);\n    });\n  });\n}\nfunction mouseBounce(container, enabledCb) {\n  const pxRatio = container.retina.pixelRatio,\n    tolerance = toleranceFactor * pxRatio,\n    mousePos = container.interactivity.mouse.position,\n    radius = container.retina.bounceModeDistance;\n  if (!radius || radius < minRadius || !mousePos) {\n    return;\n  }\n  processBounce(container, mousePos, radius, new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle(mousePos.x, mousePos.y, radius + tolerance), enabledCb);\n}\nfunction rectSideBounce(data) {\n  const res = {\n      bounced: false\n    },\n    {\n      pSide,\n      pOtherSide,\n      rectSide,\n      rectOtherSide,\n      velocity,\n      factor\n    } = data;\n  if (pOtherSide.min < rectOtherSide.min || pOtherSide.min > rectOtherSide.max || pOtherSide.max < rectOtherSide.min || pOtherSide.max > rectOtherSide.max) {\n    return res;\n  }\n  if (pSide.max >= rectSide.min && pSide.max <= (rectSide.max + rectSide.min) * half && velocity > minVelocity || pSide.min <= rectSide.max && pSide.min > (rectSide.max + rectSide.min) * half && velocity < minVelocity) {\n    res.velocity = velocity * -factor;\n    res.bounced = true;\n  }\n  return res;\n}\nfunction rectBounce(particle, divBounds) {\n  const pPos = particle.getPosition(),\n    size = particle.getRadius(),\n    bounds = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.calculateBounds)(pPos, size),\n    bounceOptions = particle.options.bounce,\n    resH = rectSideBounce({\n      pSide: {\n        min: bounds.left,\n        max: bounds.right\n      },\n      pOtherSide: {\n        min: bounds.top,\n        max: bounds.bottom\n      },\n      rectSide: {\n        min: divBounds.left,\n        max: divBounds.right\n      },\n      rectOtherSide: {\n        min: divBounds.top,\n        max: divBounds.bottom\n      },\n      velocity: particle.velocity.x,\n      factor: (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(bounceOptions.horizontal.value)\n    });\n  if (resH.bounced) {\n    if (resH.velocity !== undefined) {\n      particle.velocity.x = resH.velocity;\n    }\n    if (resH.position !== undefined) {\n      particle.position.x = resH.position;\n    }\n  }\n  const resV = rectSideBounce({\n    pSide: {\n      min: bounds.top,\n      max: bounds.bottom\n    },\n    pOtherSide: {\n      min: bounds.left,\n      max: bounds.right\n    },\n    rectSide: {\n      min: divBounds.top,\n      max: divBounds.bottom\n    },\n    rectOtherSide: {\n      min: divBounds.left,\n      max: divBounds.right\n    },\n    velocity: particle.velocity.y,\n    factor: (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(bounceOptions.vertical.value)\n  });\n  if (resV.bounced) {\n    if (resV.velocity !== undefined) {\n      particle.velocity.y = resV.velocity;\n    }\n    if (resV.position !== undefined) {\n      particle.position.y = resV.position;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-external-bounce/./dist/browser/Utils.js?\n}");
+
+/***/ }
+
+}]);

package/esm/Bouncer.js

@@ -30,9 +30,7 @@ export class Bouncer extends ExternalInteractorBase {
             isDivModeEnabled(bounceMode, divs));
     }
     loadModeOptions(options, ...sources) {
-        if (!options.bounce) {
-            options.bounce = new Bounce();
-        }
+        options.bounce ??= new Bounce();
         for (const source of sources) {
             options.bounce.load(source?.bounce);
         }

package/esm/IRectSideResult.js

@@ -0,0 +1 @@
+export {};

package/esm/Utils.js

@@ -1,5 +1,5 @@
-import { Circle, DivType, Rectangle, Vector, calculateBounds, circleBounce, circleBounceDataFromParticle, divModeExecute, rectBounce, } from "@tsparticles/engine";
-const squareExp = 2, half = 0.5, halfPI = Math.PI * half, double = 2, toleranceFactor = 10, minRadius = 0;
+import { Circle, DivType, Rectangle, Vector, calculateBounds, circleBounce, circleBounceDataFromParticle, divModeExecute, getRangeValue, safeDocument, } from "@tsparticles/engine";
+const squareExp = 2, half = 0.5, halfPI = Math.PI * half, double = 2, toleranceFactor = 10, minRadius = 0, minVelocity = 0;
 function processBounce(container, position, radius, area, enabledCb) {
     const query = container.particles.quadTree.query(area, enabledCb);
     for (const particle of query) {
@@ -18,7 +18,7 @@ function processBounce(container, position, radius, area, enabledCb) {
     }
 }
 function singleSelectorBounce(container, selector, div, bounceCb) {
-    const query = document.querySelectorAll(selector);
+    const query = safeDocument().querySelectorAll(selector);
     if (!query.length) {
         return;
     }
@@ -33,7 +33,11 @@ function singleSelectorBounce(container, selector, div, bounceCb) {
     });
 }
 export function divBounce(container, divs, bounceMode, enabledCb) {
-    divModeExecute(bounceMode, divs, (selector, div) => singleSelectorBounce(container, selector, div, (pos, radius, area) => processBounce(container, pos, radius, area, enabledCb)));
+    divModeExecute(bounceMode, divs, (selector, div) => {
+        singleSelectorBounce(container, selector, div, (pos, radius, area) => {
+            processBounce(container, pos, radius, area, enabledCb);
+        });
+    });
 }
 export function mouseBounce(container, enabledCb) {
     const pxRatio = container.retina.pixelRatio, tolerance = toleranceFactor * pxRatio, mousePos = container.interactivity.mouse.position, radius = container.retina.bounceModeDistance;
@@ -42,3 +46,76 @@ export function mouseBounce(container, enabledCb) {
     }
     processBounce(container, mousePos, radius, new Circle(mousePos.x, mousePos.y, radius + tolerance), enabledCb);
 }
+function rectSideBounce(data) {
+    const res = { bounced: false }, { pSide, pOtherSide, rectSide, rectOtherSide, velocity, factor } = data;
+    if (pOtherSide.min < rectOtherSide.min ||
+        pOtherSide.min > rectOtherSide.max ||
+        pOtherSide.max < rectOtherSide.min ||
+        pOtherSide.max > rectOtherSide.max) {
+        return res;
+    }
+    if ((pSide.max >= rectSide.min && pSide.max <= (rectSide.max + rectSide.min) * half && velocity > minVelocity) ||
+        (pSide.min <= rectSide.max && pSide.min > (rectSide.max + rectSide.min) * half && velocity < minVelocity)) {
+        res.velocity = velocity * -factor;
+        res.bounced = true;
+    }
+    return res;
+}
+export function rectBounce(particle, divBounds) {
+    const pPos = particle.getPosition(), size = particle.getRadius(), bounds = calculateBounds(pPos, size), bounceOptions = particle.options.bounce, resH = rectSideBounce({
+        pSide: {
+            min: bounds.left,
+            max: bounds.right,
+        },
+        pOtherSide: {
+            min: bounds.top,
+            max: bounds.bottom,
+        },
+        rectSide: {
+            min: divBounds.left,
+            max: divBounds.right,
+        },
+        rectOtherSide: {
+            min: divBounds.top,
+            max: divBounds.bottom,
+        },
+        velocity: particle.velocity.x,
+        factor: getRangeValue(bounceOptions.horizontal.value),
+    });
+    if (resH.bounced) {
+        if (resH.velocity !== undefined) {
+            particle.velocity.x = resH.velocity;
+        }
+        if (resH.position !== undefined) {
+            particle.position.x = resH.position;
+        }
+    }
+    const resV = rectSideBounce({
+        pSide: {
+            min: bounds.top,
+            max: bounds.bottom,
+        },
+        pOtherSide: {
+            min: bounds.left,
+            max: bounds.right,
+        },
+        rectSide: {
+            min: divBounds.top,
+            max: divBounds.bottom,
+        },
+        rectOtherSide: {
+            min: divBounds.left,
+            max: divBounds.right,
+        },
+        velocity: particle.velocity.y,
+        factor: getRangeValue(bounceOptions.vertical.value),
+    });
+    if (resV.bounced) {
+        if (resV.velocity !== undefined) {
+            particle.velocity.y = resV.velocity;
+        }
+        if (resV.position !== undefined) {
+            particle.position.y = resV.position;
+        }
+    }
+}

package/esm/index.js

@@ -1,9 +1,10 @@
-import { Bouncer } from "./Bouncer.js";
-export async function loadExternalBounceInteraction(engine, refresh = true) {
-    engine.checkVersion("3.9.1");
-    await engine.addInteractor("externalBounce", container => {
-        return Promise.resolve(new Bouncer(container));
-    }, refresh);
+export function loadExternalBounceInteraction(engine) {
+    engine.checkVersion("4.0.0-alpha.0");
+    engine.register(e => {
+        e.addInteractor("externalBounce", async (container) => {
+            const { Bouncer } = await import("./Bouncer.js");
+            return new Bouncer(container);
+        });
+    });
 }
 export * from "./Options/Classes/Bounce.js";
-export * from "./Options/Interfaces/IBounce.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/interaction-external-bounce",
-  "version": "3.9.1",
+  "version": "4.0.0-alpha.0",
   "description": "tsParticles bounce external interaction",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -87,9 +87,10 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "3.9.1"
+    "@tsparticles/engine": "4.0.0-alpha.0"
   },
   "publishConfig": {
     "access": "public"
-  }
+  },
+  "type": "module"
 }