@tsparticles/slim 4.0.2 → 4.0.4

package/tsparticles.slim.bundle.js

@@ -1,5 +1,5 @@
 (function(g){g.__tsParticlesInternals=g.__tsParticlesInternals||{};g.__tsParticlesInternals.bundles=g.__tsParticlesInternals.bundles||{};g.__tsParticlesInternals.effects=g.__tsParticlesInternals.effects||{};g.__tsParticlesInternals.engine=g.__tsParticlesInternals.engine||{};g.__tsParticlesInternals.interactions=g.__tsParticlesInternals.interactions||{};g.__tsParticlesInternals.palettes=g.__tsParticlesInternals.palettes||{};g.__tsParticlesInternals.paths=g.__tsParticlesInternals.paths||{};g.__tsParticlesInternals.plugins=g.__tsParticlesInternals.plugins||{};g.__tsParticlesInternals.plugins=g.__tsParticlesInternals.plugins||{};g.__tsParticlesInternals.plugins.emittersShapes=g.__tsParticlesInternals.plugins.emittersShapes||{};g.__tsParticlesInternals.presets=g.__tsParticlesInternals.presets||{};g.__tsParticlesInternals.shapes=g.__tsParticlesInternals.shapes||{};g.__tsParticlesInternals.updaters=g.__tsParticlesInternals.updaters||{};g.__tsParticlesInternals.utils=g.__tsParticlesInternals.utils||{};g.__tsParticlesInternals.canvas=g.__tsParticlesInternals.canvas||{};g.__tsParticlesInternals.canvas=g.__tsParticlesInternals.canvas||{};g.__tsParticlesInternals.canvas.utils=g.__tsParticlesInternals.canvas.utils||{};g.__tsParticlesInternals.path=g.__tsParticlesInternals.path||{};g.__tsParticlesInternals.path=g.__tsParticlesInternals.path||{};g.__tsParticlesInternals.path.utils=g.__tsParticlesInternals.path.utils||{};var __tsProxyFactory=typeof Proxy!=="undefined"?function(obj){return new Proxy(obj,{get:function(target,key){if(!(key in target)){target[key]={};}return target[key];}});}:function(obj){return obj;};g.__tsParticlesInternals.bundles=__tsProxyFactory(g.__tsParticlesInternals.bundles);g.__tsParticlesInternals.effects=__tsProxyFactory(g.__tsParticlesInternals.effects);g.__tsParticlesInternals.interactions=__tsProxyFactory(g.__tsParticlesInternals.interactions);g.__tsParticlesInternals.palettes=__tsProxyFactory(g.__tsParticlesInternals.palettes);g.__tsParticlesInternals.paths=__tsProxyFactory(g.__tsParticlesInternals.paths);g.__tsParticlesInternals.plugins=__tsProxyFactory(g.__tsParticlesInternals.plugins);g.__tsParticlesInternals.plugins.emittersShapes=__tsProxyFactory(g.__tsParticlesInternals.plugins.emittersShapes);g.__tsParticlesInternals.presets=__tsProxyFactory(g.__tsParticlesInternals.presets);g.__tsParticlesInternals.shapes=__tsProxyFactory(g.__tsParticlesInternals.shapes);g.__tsParticlesInternals.updaters=__tsProxyFactory(g.__tsParticlesInternals.updaters);g.__tsParticlesInternals.utils=__tsProxyFactory(g.__tsParticlesInternals.utils);g.__tsParticlesInternals.canvas=__tsProxyFactory(g.__tsParticlesInternals.canvas);g.__tsParticlesInternals.path=__tsProxyFactory(g.__tsParticlesInternals.path);g.tsparticlesInternalExports=g.tsparticlesInternalExports||{};})(typeof globalThis!=="undefined"?globalThis:typeof window!=="undefined"?window:this);
-/* tsParticles v4.0.2 */
+/* tsParticles v4.0.4 */
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
     typeof define === 'function' && define.amd ? define(['exports'], factory) :
@@ -1118,7 +1118,7 @@
             return this._domArray;
         }
         get version() {
-            return "4.0.2";
+            return "4.0.4";
         }
         addEventListener(type, listener) {
             this._eventDispatcher.addEventListener(type, listener);
@@ -3009,6 +3009,58 @@
 
     const tsParticles = initEngine();
 
+    class Blend {
+        enable;
+        mode;
+        constructor() {
+            this.mode = "destination-out";
+            this.enable = false;
+        }
+        load(data) {
+            if (isNull(data)) {
+                return;
+            }
+            if (data.mode !== undefined) {
+                this.mode = data.mode;
+            }
+            if (data.enable !== undefined) {
+                this.enable = data.enable;
+            }
+        }
+    }
+
+    class BlendPlugin {
+        id = "blend";
+        async getPlugin(container) {
+            const { BlendPluginInstance } = await Promise.resolve().then(function () { return BlendPluginInstance$1; });
+            return new BlendPluginInstance(container);
+        }
+        loadOptions(_container, options, source) {
+            if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
+                return;
+            }
+            let blendOptions = options.blend;
+            if (!blendOptions?.load) {
+                options.blend = blendOptions = new Blend();
+            }
+            blendOptions.load(source?.blend);
+        }
+        loadParticlesOptions(_container, options, source) {
+            options.blend ??= new Blend();
+            options.blend.load(source?.blend);
+        }
+        needsPlugin(options) {
+            return !!options?.blend?.enable || !!options?.particles?.blend?.enable;
+        }
+    }
+
+    async function loadBlendPlugin(engine) {
+        engine.checkVersion("4.0.4");
+        await engine.pluginManager.register(e => {
+            e.pluginManager.addPlugin(new BlendPlugin());
+        });
+    }
+
     const minAngle$1 = 0;
     function drawCircle(data) {
         const { context, particle, radius } = data;
@@ -3040,7 +3092,7 @@
     }
 
     async function loadCircleShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addShape(["circle"], () => {
                 return Promise.resolve(new CircleDrawer());
@@ -3088,7 +3140,7 @@
     }
 
     async function loadHexColorPlugin(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addColorManager("hex", new HexColorManager());
         });
@@ -3141,7 +3193,7 @@
     }
 
     async function loadHslColorPlugin(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addColorManager("hsl", new HslColorManager());
         });
@@ -3165,7 +3217,7 @@
     }
 
     async function loadMovePlugin(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             const moveEngine = e, movePluginManager = moveEngine.pluginManager;
             movePluginManager.initializers.pathGenerators ??= new Map();
@@ -3226,7 +3278,7 @@
     }
 
     async function loadOpacityUpdater(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addParticleUpdater("opacity", container => {
                 return Promise.resolve(new OpacityUpdater(container));
@@ -3578,7 +3630,7 @@
     }
 
     async function loadOutModesUpdater(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addParticleUpdater("outModes", container => {
                 return Promise.resolve(new OutOfCanvasUpdater(container));
@@ -3649,7 +3701,7 @@
     }
 
     async function loadPaintUpdater(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addParticleUpdater("paint", container => {
                 return Promise.resolve(new PaintUpdater(e.pluginManager, container));
@@ -3704,7 +3756,7 @@
     }
 
     async function loadRgbColorPlugin(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addColorManager("rgb", new RgbColorManager());
         });
@@ -3747,7 +3799,7 @@
     }
 
     async function loadSizeUpdater(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addParticleUpdater("size", container => {
                 return Promise.resolve(new SizeUpdater(container));
@@ -3756,9 +3808,10 @@
     }
 
     async function loadBasic(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(async (e) => {
             await Promise.all([
+                loadBlendPlugin(e),
                 loadHexColorPlugin(e),
                 loadHslColorPlugin(e),
                 loadRgbColorPlugin(e),
@@ -3778,7 +3831,7 @@
     easingsFunctions.set(exports.EasingType.easeInOutQuad, value => (value < 0.5 ? 2 * value ** 2 : 1 - (-2 * value + 2) ** 2 / 2));
 
     async function loadEasingQuadPlugin(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             for (const [easing, easingFn] of easingsFunctions) {
                 e.pluginManager.addEasing(easing, easingFn);
@@ -3886,7 +3939,7 @@
     }
 
     async function loadEmojiShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addShape(validTypes, () => Promise.resolve(new EmojiDrawer()));
         });
@@ -4153,7 +4206,7 @@
     }
 
     async function loadInteractivityPlugin(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             const interactivityEngine = e, interactivityPluginManager = interactivityEngine.pluginManager;
             interactivityPluginManager.addPlugin(new InteractivityPlugin(interactivityPluginManager));
@@ -4430,7 +4483,7 @@
     };
 
     async function loadExternalAttractInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalAttract", container => {
@@ -4627,7 +4680,7 @@
     }
 
     async function loadExternalBounceInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalBounce", container => {
@@ -5007,7 +5060,7 @@
     }
 
     async function loadExternalBubbleInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalBubble", container => {
@@ -5152,7 +5205,7 @@
     }
 
     async function loadExternalConnectInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalConnect", container => {
@@ -5264,7 +5317,7 @@
     }
 
     async function loadExternalDestroyInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalDestroy", async (container) => {
@@ -5408,7 +5461,7 @@
     }
 
     async function loadExternalGrabInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalGrab", container => {
@@ -5489,7 +5542,7 @@
     }
 
     async function loadExternalParallaxInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalParallax", container => {
@@ -5532,7 +5585,7 @@
     }
 
     async function loadExternalPauseInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalPause", container => {
@@ -5617,7 +5670,7 @@
     }
 
     async function loadExternalPushInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalPush", container => {
@@ -5680,7 +5733,7 @@
     }
 
     async function loadExternalRemoveInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalRemove", container => {
@@ -6013,7 +6066,7 @@
     }
 
     async function loadExternalRepulseInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             const pluginManager = e.pluginManager;
@@ -6095,7 +6148,7 @@
     }
 
     async function loadExternalSlowInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("externalSlow", container => {
@@ -6923,7 +6976,7 @@
         };
     }
     async function loadImageShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             addLoadImageToEngine(e);
             e.pluginManager.addPlugin(new ImagePreloaderPlugin(e));
@@ -7090,7 +7143,7 @@
     }
 
     async function loadLifeUpdater(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addParticleUpdater("life", container => {
                 return Promise.resolve(new LifeUpdater(container));
@@ -7116,7 +7169,7 @@
     }
 
     async function loadLineShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addShape(["line"], () => Promise.resolve(new LineDrawer()));
         });
@@ -7209,7 +7262,7 @@
     }
 
     async function loadParticlesAttractInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addInteractor?.("particlesAttract", container => {
@@ -7449,7 +7502,7 @@
     }
 
     async function loadParticlesCollisionsInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             ensureInteractivityPluginLoaded(e);
             e.pluginManager.addPlugin(new OverlapPlugin());
@@ -7752,7 +7805,7 @@
     }
 
     async function loadParticlesLinksInteraction(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register((e) => {
             const pluginManager = e.pluginManager;
             ensureInteractivityPluginLoaded(e);
@@ -7842,19 +7895,19 @@
     }
 
     async function loadGenericPolygonShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addShape(["polygon"], () => Promise.resolve(new PolygonDrawer()));
         });
     }
     async function loadTriangleShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addShape(["triangle"], () => Promise.resolve(new TriangleDrawer()));
         });
     }
     async function loadPolygonShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await Promise.all([
             loadGenericPolygonShape(engine),
             loadTriangleShape(engine),
@@ -7987,7 +8040,7 @@
     }
 
     async function loadRotateUpdater(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addParticleUpdater("rotate", container => {
                 return Promise.resolve(new RotateUpdater(container));
@@ -8011,7 +8064,7 @@
     }
 
     async function loadSquareShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addShape(["edge", "square"], () => Promise.resolve(new SquareDrawer()));
         });
@@ -8045,14 +8098,14 @@
     }
 
     async function loadStarShape(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(e => {
             e.pluginManager.addShape(["star"], () => Promise.resolve(new StarDrawer()));
         });
     }
 
     async function loadSlim(engine) {
-        engine.checkVersion("4.0.2");
+        engine.checkVersion("4.0.4");
         await engine.pluginManager.register(async (e) => {
             const loadInteractivityForSlim = async (e) => {
                 await loadInteractivityPlugin(e);
@@ -10160,6 +10213,44 @@
         Container: Container
     });
 
+    class BlendPluginInstance {
+        _container;
+        _defaultCompositeValue;
+        constructor(container) {
+            this._container = container;
+        }
+        drawParticleCleanup(context, particle) {
+            if (!particle.options.blend?.enable) {
+                return;
+            }
+            context.globalCompositeOperation = particle.originalBlendMode ?? defaultCompositeValue;
+            particle.originalBlendMode = undefined;
+        }
+        drawParticleSetup(context, particle) {
+            if (!particle.options.blend?.enable) {
+                return;
+            }
+            particle.originalBlendMode = context.globalCompositeOperation;
+            context.globalCompositeOperation = particle.options.blend.mode;
+        }
+        drawSettingsCleanup(context) {
+            if (!this._defaultCompositeValue) {
+                return;
+            }
+            context.globalCompositeOperation = this._defaultCompositeValue;
+        }
+        drawSettingsSetup(context) {
+            const previousComposite = context.globalCompositeOperation, blend = this._container.actualOptions.blend;
+            this._defaultCompositeValue = previousComposite;
+            context.globalCompositeOperation = blend?.enable ? blend.mode : previousComposite;
+        }
+    }
+
+    var BlendPluginInstance$1 = /*#__PURE__*/Object.freeze({
+        __proto__: null,
+        BlendPluginInstance: BlendPluginInstance
+    });
+
     const minVelocity = 0, identity = 1, moveSpeedFactor = 60, minSpinRadius = 0, spinFactor = 0.01, defaultPathDelay = 0, noDecay = 1;
     function applyDistance(particle) {
         const initialPosition = particle.initialPosition, { dx, dy } = getDistances(initialPosition, particle.position), dxFixed = Math.abs(dx), dyFixed = Math.abs(dy), { maxDistance } = particle.retina, hDistance = maxDistance.horizontal, vDistance = maxDistance.vertical;