@tsparticles/interaction-external-slow 4.0.0-alpha.2 → 4.0.0-alpha.20

package/642.min.js

@@ -0,0 +1 @@
+"use strict";(this.webpackChunk_tsparticles_interaction_external_slow=this.webpackChunk_tsparticles_interaction_external_slow||[]).push([[642],{642(t,e,i){i.d(e,{Slower:()=>a});var o=i(702),n=i(303),s=i(279);class a extends o.ExternalInteractorBase{constructor(t){super(t)}clear(t,e,i){(!t.slow.inRange||i)&&(t.slow.factor=1)}init(){let t=this.container,e=t.actualOptions.interactivity?.modes.slow;e&&(t.retina.slowModeRadius=e.radius*t.retina.pixelRatio)}interact(){}isEnabled(t,e){let i=this.container,o=t.mouse,s=(e?.interactivity??i.actualOptions.interactivity)?.events;return!!s?.onHover.enable&&!!o.position&&(0,n.isInArray)("slow",s.onHover.mode)}loadModeOptions(t,...e){for(let i of(t.slow??=new s.w,e))t.slow.load(i?.slow)}reset(t,e){e.slow.inRange=!1;let i=this.container,o=i.actualOptions,s=t.mouse.position,a=i.retina.slowModeRadius,r=o.interactivity?.modes.slow;if(!r||!a||a<0||!s)return;let l=e.getPosition(),c=(0,n.getDistance)(s,l),w=r.factor,{slow:u}=e;c>a||(u.inRange=!0,u.factor=c/a/w)}}}}]);

package/README.md

@@ -1,12 +1,12 @@
 [![banner](https://particles.js.org/images/banner2.png)](https://particles.js.org)
 
-# tsParticles External Bubble Interaction
+# tsParticles External Slow Interaction
 
-[![jsDelivr](https://data.jsdelivr.com/v1/package/npm/@tsparticles/interaction-external-bubble/badge)](https://www.jsdelivr.com/package/npm/@tsparticles/interaction-external-bubble)
-[![npmjs](https://badge.fury.io/js/@tsparticles/interaction-external-bubble.svg)](https://www.npmjs.com/package/@tsparticles/interaction-external-bubble)
-[![npmjs](https://img.shields.io/npm/dt/@tsparticles/interaction-external-bubble)](https://www.npmjs.com/package/@tsparticles/interaction-external-bubble) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
+[![jsDelivr](https://data.jsdelivr.com/v1/package/npm/@tsparticles/interaction-external-slow/badge)](https://www.jsdelivr.com/package/npm/@tsparticles/interaction-external-slow)
+[![npmjs](https://badge.fury.io/js/@tsparticles/interaction-external-slow.svg)](https://www.npmjs.com/package/@tsparticles/interaction-external-slow)
+[![npmjs](https://img.shields.io/npm/dt/@tsparticles/interaction-external-slow)](https://www.npmjs.com/package/@tsparticles/interaction-external-slow) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
 
-[tsParticles](https://github.com/tsparticles/tsparticles) interaction plugin for bubble effect around mouse or HTML
+[tsParticles](https://github.com/tsparticles/tsparticles) interaction plugin for slow effect around mouse or HTML
 elements.
 
 ## How to use it
@@ -15,11 +15,11 @@ elements.
 
 The CDN/Vanilla version JS has one required file in vanilla configuration:
 
-Including the `tsparticles.interaction.external.bubble.min.js` file will export the function to load the interaction
+Including the `tsparticles.interaction.external.slow.min.js` file will export the function to load the interaction
 plugin:
 
 ```javascript
-loadExternalBubbleInteraction;
+loadExternalSlowInteraction;
 ```
 
 ### Usage
@@ -28,7 +28,8 @@ Once the scripts are loaded you can set up `tsParticles` and the interaction plu
 
 ```javascript
 (async () => {
-  await loadExternalBubbleInteraction(tsParticles);
+  await loadInteractivityPlugin(tsParticles);
+  await loadExternalSlowInteraction(tsParticles);
 
   await tsParticles.load({
     id: "tsparticles",
@@ -44,23 +45,25 @@ Once the scripts are loaded you can set up `tsParticles` and the interaction plu
 This package is compatible also with ES or CommonJS modules, firstly this needs to be installed, like this:
 
 ```shell
-$ npm install @tsparticles/interaction-external-bubble
+$ npm install @tsparticles/interaction-external-slow
 ```
 
 or
 
 ```shell
-$ yarn add @tsparticles/interaction-external-bubble
+$ yarn add @tsparticles/interaction-external-slow
 ```
 
 Then you need to import it in the app, like this:
 
 ```javascript
 const { tsParticles } = require("@tsparticles/engine");
-const { loadExternalBubbleInteraction } = require("@tsparticles/interaction-external-bubble");
+const { loadInteractivityPlugin } = require("@tsparticles/plugin-interactivity");
+const { loadExternalSlowInteraction } = require("@tsparticles/interaction-external-slow");
 
 (async () => {
-  await loadExternalBubbleInteraction(tsParticles);
+  await loadInteractivityPlugin(tsParticles);
+  await loadExternalSlowInteraction(tsParticles);
 })();
 ```
 
@@ -68,9 +71,11 @@ or
 
 ```javascript
 import { tsParticles } from "@tsparticles/engine";
-import { loadExternalBubbleInteraction } from "@tsparticles/interaction-external-bubble";
+import { loadInteractivityPlugin } from "@tsparticles/plugin-interactivity";
+import { loadExternalSlowInteraction } from "@tsparticles/interaction-external-slow";
 
 (async () => {
-  await loadExternalBubbleInteraction(tsParticles);
+  await loadInteractivityPlugin(tsParticles);
+  await loadExternalSlowInteraction(tsParticles);
 })();
 ```

package/browser/Options/Classes/Slow.js

@@ -1,5 +1,7 @@
 import { isNull } from "@tsparticles/engine";
 export class Slow {
+    factor;
+    radius;
     constructor() {
         this.factor = 3;
         this.radius = 200;

package/browser/Slower.js

@@ -1,4 +1,5 @@
-import { ExternalInteractorBase, getDistance, isInArray, } from "@tsparticles/engine";
+import { ExternalInteractorBase, } from "@tsparticles/plugin-interactivity";
+import { getDistance, isInArray } from "@tsparticles/engine";
 import { Slow } from "./Options/Classes/Slow.js";
 const slowMode = "slow", minRadius = 0;
 export class Slower extends ExternalInteractorBase {
@@ -12,7 +13,7 @@ export class Slower extends ExternalInteractorBase {
         particle.slow.factor = 1;
     }
     init() {
-        const container = this.container, slow = container.actualOptions.interactivity.modes.slow;
+        const container = this.container, slow = container.actualOptions.interactivity?.modes.slow;
         if (!slow) {
             return;
         }
@@ -20,9 +21,9 @@ export class Slower extends ExternalInteractorBase {
     }
     interact() {
     }
-    isEnabled(particle) {
-        const container = this.container, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity).events;
-        return events.onHover.enable && !!mouse.position && isInArray(slowMode, events.onHover.mode);
+    isEnabled(interactivityData, particle) {
+        const container = this.container, mouse = interactivityData.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity)?.events;
+        return !!events?.onHover.enable && !!mouse.position && isInArray(slowMode, events.onHover.mode);
     }
     loadModeOptions(options, ...sources) {
         options.slow ??= new Slow();
@@ -30,9 +31,9 @@ export class Slower extends ExternalInteractorBase {
             options.slow.load(source?.slow);
         }
     }
-    reset(particle) {
+    reset(interactivityData, particle) {
         particle.slow.inRange = false;
-        const container = this.container, options = container.actualOptions, mousePos = container.interactivity.mouse.position, radius = container.retina.slowModeRadius, slowOptions = options.interactivity.modes.slow;
+        const container = this.container, options = container.actualOptions, mousePos = interactivityData.mouse.position, radius = container.retina.slowModeRadius, slowOptions = options.interactivity?.modes.slow;
         if (!slowOptions || !radius || radius < minRadius || !mousePos) {
             return;
         }

package/browser/index.js

@@ -1,7 +1,9 @@
-export function loadExternalSlowInteraction(engine) {
-    engine.checkVersion("4.0.0-alpha.2");
-    engine.register(e => {
-        e.addInteractor("externalSlow", async (container) => {
+export async function loadExternalSlowInteraction(engine) {
+    engine.checkVersion("4.0.0-alpha.20");
+    await engine.register(async (e) => {
+        const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
+        ensureInteractivityPluginLoaded(e);
+        e.addInteractor?.("externalSlow", async (container) => {
             const { Slower } = await import("./Slower.js");
             return new Slower(container);
         });

package/cjs/Options/Classes/Slow.js

@@ -1,5 +1,7 @@
 import { isNull } from "@tsparticles/engine";
 export class Slow {
+    factor;
+    radius;
     constructor() {
         this.factor = 3;
         this.radius = 200;

package/cjs/Slower.js

@@ -1,4 +1,5 @@
-import { ExternalInteractorBase, getDistance, isInArray, } from "@tsparticles/engine";
+import { ExternalInteractorBase, } from "@tsparticles/plugin-interactivity";
+import { getDistance, isInArray } from "@tsparticles/engine";
 import { Slow } from "./Options/Classes/Slow.js";
 const slowMode = "slow", minRadius = 0;
 export class Slower extends ExternalInteractorBase {
@@ -12,7 +13,7 @@ export class Slower extends ExternalInteractorBase {
         particle.slow.factor = 1;
     }
     init() {
-        const container = this.container, slow = container.actualOptions.interactivity.modes.slow;
+        const container = this.container, slow = container.actualOptions.interactivity?.modes.slow;
         if (!slow) {
             return;
         }
@@ -20,9 +21,9 @@ export class Slower extends ExternalInteractorBase {
     }
     interact() {
     }
-    isEnabled(particle) {
-        const container = this.container, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity).events;
-        return events.onHover.enable && !!mouse.position && isInArray(slowMode, events.onHover.mode);
+    isEnabled(interactivityData, particle) {
+        const container = this.container, mouse = interactivityData.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity)?.events;
+        return !!events?.onHover.enable && !!mouse.position && isInArray(slowMode, events.onHover.mode);
     }
     loadModeOptions(options, ...sources) {
         options.slow ??= new Slow();
@@ -30,9 +31,9 @@ export class Slower extends ExternalInteractorBase {
             options.slow.load(source?.slow);
         }
     }
-    reset(particle) {
+    reset(interactivityData, particle) {
         particle.slow.inRange = false;
-        const container = this.container, options = container.actualOptions, mousePos = container.interactivity.mouse.position, radius = container.retina.slowModeRadius, slowOptions = options.interactivity.modes.slow;
+        const container = this.container, options = container.actualOptions, mousePos = interactivityData.mouse.position, radius = container.retina.slowModeRadius, slowOptions = options.interactivity?.modes.slow;
         if (!slowOptions || !radius || radius < minRadius || !mousePos) {
             return;
         }

package/cjs/index.js

@@ -1,7 +1,9 @@
-export function loadExternalSlowInteraction(engine) {
-    engine.checkVersion("4.0.0-alpha.2");
-    engine.register(e => {
-        e.addInteractor("externalSlow", async (container) => {
+export async function loadExternalSlowInteraction(engine) {
+    engine.checkVersion("4.0.0-alpha.20");
+    await engine.register(async (e) => {
+        const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
+        ensureInteractivityPluginLoaded(e);
+        e.addInteractor?.("externalSlow", async (container) => {
             const { Slower } = await import("./Slower.js");
             return new Slower(container);
         });

package/dist_browser_Slower_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-alpha.2
+ * v4.0.0-alpha.20
  */
 "use strict";
 /*
@@ -23,7 +23,7 @@
   \********************************/
 (__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 */   Slower: () => (/* binding */ Slower)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Options_Classes_Slow_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Options/Classes/Slow.js */ \"./dist/browser/Options/Classes/Slow.js\");\n\n\nconst slowMode = \"slow\",\n  minRadius = 0;\nclass Slower extends _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.ExternalInteractorBase {\n  constructor(container) {\n    super(container);\n  }\n  clear(particle, _delta, force) {\n    if (particle.slow.inRange && !force) {\n      return;\n    }\n    particle.slow.factor = 1;\n  }\n  init() {\n    const container = this.container,\n      slow = container.actualOptions.interactivity.modes.slow;\n    if (!slow) {\n      return;\n    }\n    container.retina.slowModeRadius = slow.radius * container.retina.pixelRatio;\n  }\n  interact() {}\n  isEnabled(particle) {\n    const container = this.container,\n      mouse = container.interactivity.mouse,\n      events = (particle?.interactivity ?? container.actualOptions.interactivity).events;\n    return events.onHover.enable && !!mouse.position && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(slowMode, events.onHover.mode);\n  }\n  loadModeOptions(options, ...sources) {\n    options.slow ??= new _Options_Classes_Slow_js__WEBPACK_IMPORTED_MODULE_1__.Slow();\n    for (const source of sources) {\n      options.slow.load(source?.slow);\n    }\n  }\n  reset(particle) {\n    particle.slow.inRange = false;\n    const container = this.container,\n      options = container.actualOptions,\n      mousePos = container.interactivity.mouse.position,\n      radius = container.retina.slowModeRadius,\n      slowOptions = options.interactivity.modes.slow;\n    if (!slowOptions || !radius || radius < minRadius || !mousePos) {\n      return;\n    }\n    const particlePos = particle.getPosition(),\n      dist = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(mousePos, particlePos),\n      proximityFactor = dist / radius,\n      slowFactor = slowOptions.factor,\n      {\n        slow\n      } = particle;\n    if (dist > radius) {\n      return;\n    }\n    slow.inRange = true;\n    slow.factor = proximityFactor / slowFactor;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-external-slow/./dist/browser/Slower.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Slower: () => (/* binding */ Slower)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/plugin-interactivity */ \"@tsparticles/plugin-interactivity\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Options_Classes_Slow_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Slow.js */ \"./dist/browser/Options/Classes/Slow.js\");\n\n\n\nconst slowMode = \"slow\", minRadius = 0;\nclass Slower extends _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__.ExternalInteractorBase {\n    constructor(container){\n        super(container);\n    }\n    clear(particle, _delta, force) {\n        if (particle.slow.inRange && !force) {\n            return;\n        }\n        particle.slow.factor = 1;\n    }\n    init() {\n        const container = this.container, slow = container.actualOptions.interactivity?.modes.slow;\n        if (!slow) {\n            return;\n        }\n        container.retina.slowModeRadius = slow.radius * container.retina.pixelRatio;\n    }\n    interact() {}\n    isEnabled(interactivityData, particle) {\n        const container = this.container, mouse = interactivityData.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity)?.events;\n        return !!events?.onHover.enable && !!mouse.position && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.isInArray)(slowMode, events.onHover.mode);\n    }\n    loadModeOptions(options, ...sources) {\n        options.slow ??= new _Options_Classes_Slow_js__WEBPACK_IMPORTED_MODULE_2__.Slow();\n        for (const source of sources){\n            options.slow.load(source?.slow);\n        }\n    }\n    reset(interactivityData, particle) {\n        particle.slow.inRange = false;\n        const container = this.container, options = container.actualOptions, mousePos = interactivityData.mouse.position, radius = container.retina.slowModeRadius, slowOptions = options.interactivity?.modes.slow;\n        if (!slowOptions || !radius || radius < minRadius || !mousePos) {\n            return;\n        }\n        const particlePos = particle.getPosition(), dist = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.getDistance)(mousePos, particlePos), proximityFactor = dist / radius, slowFactor = slowOptions.factor, { slow } = particle;\n        if (dist > radius) {\n            return;\n        }\n        slow.inRange = true;\n        slow.factor = proximityFactor / slowFactor;\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-slow/./dist/browser/Slower.js?\n}");
 
 /***/ }
 

package/esm/Options/Classes/Slow.js

@@ -1,5 +1,7 @@
 import { isNull } from "@tsparticles/engine";
 export class Slow {
+    factor;
+    radius;
     constructor() {
         this.factor = 3;
         this.radius = 200;

package/esm/Slower.js

@@ -1,4 +1,5 @@
-import { ExternalInteractorBase, getDistance, isInArray, } from "@tsparticles/engine";
+import { ExternalInteractorBase, } from "@tsparticles/plugin-interactivity";
+import { getDistance, isInArray } from "@tsparticles/engine";
 import { Slow } from "./Options/Classes/Slow.js";
 const slowMode = "slow", minRadius = 0;
 export class Slower extends ExternalInteractorBase {
@@ -12,7 +13,7 @@ export class Slower extends ExternalInteractorBase {
         particle.slow.factor = 1;
     }
     init() {
-        const container = this.container, slow = container.actualOptions.interactivity.modes.slow;
+        const container = this.container, slow = container.actualOptions.interactivity?.modes.slow;
         if (!slow) {
             return;
         }
@@ -20,9 +21,9 @@ export class Slower extends ExternalInteractorBase {
     }
     interact() {
     }
-    isEnabled(particle) {
-        const container = this.container, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity).events;
-        return events.onHover.enable && !!mouse.position && isInArray(slowMode, events.onHover.mode);
+    isEnabled(interactivityData, particle) {
+        const container = this.container, mouse = interactivityData.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity)?.events;
+        return !!events?.onHover.enable && !!mouse.position && isInArray(slowMode, events.onHover.mode);
     }
     loadModeOptions(options, ...sources) {
         options.slow ??= new Slow();
@@ -30,9 +31,9 @@ export class Slower extends ExternalInteractorBase {
             options.slow.load(source?.slow);
         }
     }
-    reset(particle) {
+    reset(interactivityData, particle) {
         particle.slow.inRange = false;
-        const container = this.container, options = container.actualOptions, mousePos = container.interactivity.mouse.position, radius = container.retina.slowModeRadius, slowOptions = options.interactivity.modes.slow;
+        const container = this.container, options = container.actualOptions, mousePos = interactivityData.mouse.position, radius = container.retina.slowModeRadius, slowOptions = options.interactivity?.modes.slow;
         if (!slowOptions || !radius || radius < minRadius || !mousePos) {
             return;
         }

package/esm/index.js

@@ -1,7 +1,9 @@
-export function loadExternalSlowInteraction(engine) {
-    engine.checkVersion("4.0.0-alpha.2");
-    engine.register(e => {
-        e.addInteractor("externalSlow", async (container) => {
+export async function loadExternalSlowInteraction(engine) {
+    engine.checkVersion("4.0.0-alpha.20");
+    await engine.register(async (e) => {
+        const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
+        ensureInteractivityPluginLoaded(e);
+        e.addInteractor?.("externalSlow", async (container) => {
             const { Slower } = await import("./Slower.js");
             return new Slower(container);
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/interaction-external-slow",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.20",
   "description": "tsParticles slow external interaction",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -87,7 +87,8 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "4.0.0-alpha.2"
+    "@tsparticles/engine": "4.0.0-alpha.20",
+    "@tsparticles/plugin-interactivity": "4.0.0-alpha.20"
   },
   "publishConfig": {
     "access": "public"