@tsparticles/interaction-external-bounce 4.0.0-beta.0 → 4.0.0-beta.10

package/71.min.js

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

package/README.md

@@ -9,6 +9,12 @@
 [tsParticles](https://github.com/tsparticles/tsparticles) interaction plugin for bounce effect around mouse or HTML
 elements.
 
+## Quick checklist
+
+1. Install `@tsparticles/engine` (or use the CDN bundle below)
+2. Call the package loader function(s) before `tsParticles.load(...)`
+3. Apply the package options in your `tsParticles.load(...)` config
+
 ## How to use it
 
 ### CDN / Vanilla JS / jQuery
@@ -79,3 +85,35 @@ import { loadExternalBounceInteraction } from "@tsparticles/interaction-external
   await loadExternalBounceInteraction(tsParticles);
 })();
 ```
+
+## Option mapping
+
+- Event mode key: `interactivity.events.onHover.mode` or `interactivity.events.onClick.mode` with value `"bounce"`
+- Mode options key: `interactivity.modes.bounce`
+
+```json
+{
+  "interactivity": {
+    "events": {
+      "onHover": {
+        "enable": true,
+        "mode": "bounce"
+      }
+    },
+    "modes": {
+      "bounce": {}
+    }
+  }
+}
+```
+
+## Common pitfalls
+
+- Calling `tsParticles.load(...)` before `loadInteractivityPlugin(...)`
+- Verify required peer packages before enabling advanced options
+- Change one option group at a time to isolate regressions quickly
+
+## Related docs
+
+- All packages catalog: <https://github.com/tsparticles/tsparticles>
+- Main docs: <https://particles.js.org/docs/>

package/browser/index.js

@@ -1,9 +1,9 @@
 export async function loadExternalBounceInteraction(engine) {
-    engine.checkVersion("4.0.0-beta.0");
-    await engine.register(async (e) => {
+    engine.checkVersion("4.0.0-beta.10");
+    await engine.pluginManager.register(async (e) => {
         const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
         ensureInteractivityPluginLoaded(e);
-        e.addInteractor?.("externalBounce", async (container) => {
+        e.pluginManager.addInteractor?.("externalBounce", async (container) => {
             const { Bouncer } = await import("./Bouncer.js");
             return new Bouncer(container);
         });

package/cjs/index.js

@@ -1,9 +1,9 @@
 export async function loadExternalBounceInteraction(engine) {
-    engine.checkVersion("4.0.0-beta.0");
-    await engine.register(async (e) => {
+    engine.checkVersion("4.0.0-beta.10");
+    await engine.pluginManager.register(async (e) => {
         const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
         ensureInteractivityPluginLoaded(e);
-        e.addInteractor?.("externalBounce", async (container) => {
+        e.pluginManager.addInteractor?.("externalBounce", async (container) => {
             const { Bouncer } = await import("./Bouncer.js");
             return new Bouncer(container);
         });

package/dist_browser_Bouncer_js.js

@@ -4,7 +4,7 @@
  * Demo / Generator : https://particles.js.org/
  * GitHub : https://www.github.com/matteobruni/tsparticles
  * How to use? : Check the GitHub README
- * v4.0.0-beta.0
+ * v4.0.0-beta.10
  */
 "use strict";
 /*

package/esm/index.js

@@ -1,9 +1,9 @@
 export async function loadExternalBounceInteraction(engine) {
-    engine.checkVersion("4.0.0-beta.0");
-    await engine.register(async (e) => {
+    engine.checkVersion("4.0.0-beta.10");
+    await engine.pluginManager.register(async (e) => {
         const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
         ensureInteractivityPluginLoaded(e);
-        e.addInteractor?.("externalBounce", async (container) => {
+        e.pluginManager.addInteractor?.("externalBounce", async (container) => {
             const { Bouncer } = await import("./Bouncer.js");
             return new Bouncer(container);
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/interaction-external-bounce",
-  "version": "4.0.0-beta.0",
+  "version": "4.0.0-beta.10",
   "description": "tsParticles bounce external interaction",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -81,17 +81,20 @@
       "browser": "./browser/index.js",
       "import": "./esm/index.js",
       "require": "./cjs/index.js",
-      "umd": "./umd/index.js",
-      "default": "./cjs/index.js"
+      "default": "./esm/index.js"
     },
     "./package.json": "./package.json"
   },
-  "dependencies": {
-    "@tsparticles/engine": "4.0.0-beta.0",
-    "@tsparticles/plugin-interactivity": "4.0.0-beta.0"
+  "peerDepdendencies": {
+    "@tsparticles/engine": "4.0.0-beta.1",
+    "@tsparticles/plugin-interactivity": "4.0.0-beta.1"
   },
   "publishConfig": {
     "access": "public"
   },
-  "type": "module"
+  "type": "module",
+  "peerDependencies": {
+    "@tsparticles/engine": "4.0.0-beta.10",
+    "@tsparticles/plugin-interactivity": "4.0.0-beta.10"
+  }
 }