@tsparticles/updater-size 4.0.5 → 4.1.1

package/browser/Options/Classes/Size.js

@@ -0,0 +1,20 @@
+import { RangedAnimationValueWithRandom, isNull } from "@tsparticles/engine";
+import { SizeAnimation } from "./SizeAnimation.js";
+export class Size extends RangedAnimationValueWithRandom {
+    animation;
+    constructor() {
+        super();
+        this.animation = new SizeAnimation();
+        this.value = 3;
+    }
+    load(data) {
+        super.load(data);
+        if (isNull(data)) {
+            return;
+        }
+        const animation = data.animation;
+        if (animation !== undefined) {
+            this.animation.load(animation);
+        }
+    }
+}

package/browser/Options/Classes/SizeAnimation.js

@@ -0,0 +1,18 @@
+import { DestroyType, RangedAnimationOptions, isNull, } from "@tsparticles/engine";
+export class SizeAnimation extends RangedAnimationOptions {
+    destroy;
+    constructor() {
+        super();
+        this.destroy = DestroyType.none;
+        this.speed = 5;
+    }
+    load(data) {
+        super.load(data);
+        if (isNull(data)) {
+            return;
+        }
+        if (data.destroy !== undefined) {
+            this.destroy = data.destroy;
+        }
+    }
+}

package/browser/Options/Interfaces/ISize.js

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

package/browser/Options/Interfaces/ISizeAnimation.js

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

package/browser/SizeUpdater.js

@@ -1,19 +1,25 @@
-import { getRandom, percentDenominator, updateAnimation, } from "@tsparticles/engine";
+import { getRandom, getRangeValue, initParticleNumericAnimationValue, percentDenominator, updateAnimation, } from "@tsparticles/engine";
+import { Size } from "./Options/Classes/Size.js";
 const minLoops = 0;
 export class SizeUpdater {
-    _container;
+    #container;
     constructor(container) {
-        this._container = container;
+        this.#container = container;
     }
     init(particle) {
-        const container = this._container, sizeOptions = particle.options.size, sizeAnimation = sizeOptions.animation;
-        if (sizeAnimation.enable) {
-            particle.size.velocity =
-                (particle.retina.sizeAnimationSpeed / percentDenominator) * container.retina.reduceFactor;
-            if (!sizeAnimation.sync) {
-                particle.size.velocity *= getRandom();
-            }
+        const container = this.#container, sizeOptions = particle.options.size;
+        if (!sizeOptions) {
+            return;
+        }
+        const sizeAnimation = sizeOptions.animation;
+        if (!sizeAnimation.enable) {
+            return;
+        }
+        particle.size.velocity = (particle.retina.sizeAnimationSpeed / percentDenominator) * container.retina.reduceFactor;
+        if (sizeAnimation.sync) {
+            return;
         }
+        particle.size.velocity *= getRandom();
     }
     isEnabled(particle) {
         return (!particle.destroyed &&
@@ -23,12 +29,26 @@ export class SizeUpdater {
                 ((particle.size.maxLoops ?? minLoops) > minLoops &&
                     (particle.size.loops ?? minLoops) < (particle.size.maxLoops ?? minLoops))));
     }
+    loadOptions(options, ...sources) {
+        options.size ??= new Size();
+        for (const source of sources) {
+            options.size.load(source?.size);
+        }
+    }
+    preInit(particle) {
+        const pxRatio = this.#container.retina.pixelRatio, options = particle.options, sizeOptions = options.size;
+        if (!sizeOptions) {
+            return;
+        }
+        particle.size = initParticleNumericAnimationValue(sizeOptions, pxRatio);
+        particle.retina.sizeAnimationSpeed = getRangeValue(sizeOptions.animation.speed) * pxRatio;
+    }
     reset(particle) {
         particle.size.time = 0;
         particle.size.loops = 0;
     }
     update(particle, delta) {
-        if (!this.isEnabled(particle)) {
+        if (!this.isEnabled(particle) || !particle.options.size) {
             return;
         }
         updateAnimation(particle, particle.size, true, particle.options.size.animation.destroy, delta);

package/browser/Types.js

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

package/browser/index.js

@@ -1,6 +1,6 @@
 import { SizeUpdater } from "./SizeUpdater.js";
 export async function loadSizeUpdater(engine) {
-    engine.checkVersion("4.0.5");
+    engine.checkVersion("4.1.1");
     await engine.pluginManager.register(e => {
         e.pluginManager.addParticleUpdater("size", container => {
             return Promise.resolve(new SizeUpdater(container));

package/browser/index.lazy.js

@@ -1,5 +1,5 @@
 export async function loadSizeUpdater(engine) {
-    engine.checkVersion("4.0.5");
+    engine.checkVersion("4.1.1");
     await engine.pluginManager.register(e => {
         e.pluginManager.addParticleUpdater("size", async (container) => {
             const { SizeUpdater } = await import("./SizeUpdater.js");

package/cjs/Options/Classes/Size.js

@@ -0,0 +1,20 @@
+import { RangedAnimationValueWithRandom, isNull } from "@tsparticles/engine";
+import { SizeAnimation } from "./SizeAnimation.js";
+export class Size extends RangedAnimationValueWithRandom {
+    animation;
+    constructor() {
+        super();
+        this.animation = new SizeAnimation();
+        this.value = 3;
+    }
+    load(data) {
+        super.load(data);
+        if (isNull(data)) {
+            return;
+        }
+        const animation = data.animation;
+        if (animation !== undefined) {
+            this.animation.load(animation);
+        }
+    }
+}

package/cjs/Options/Classes/SizeAnimation.js

@@ -0,0 +1,18 @@
+import { DestroyType, RangedAnimationOptions, isNull, } from "@tsparticles/engine";
+export class SizeAnimation extends RangedAnimationOptions {
+    destroy;
+    constructor() {
+        super();
+        this.destroy = DestroyType.none;
+        this.speed = 5;
+    }
+    load(data) {
+        super.load(data);
+        if (isNull(data)) {
+            return;
+        }
+        if (data.destroy !== undefined) {
+            this.destroy = data.destroy;
+        }
+    }
+}

package/cjs/Options/Interfaces/ISize.js

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

package/cjs/Options/Interfaces/ISizeAnimation.js

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

package/cjs/SizeUpdater.js

@@ -1,19 +1,25 @@
-import { getRandom, percentDenominator, updateAnimation, } from "@tsparticles/engine";
+import { getRandom, getRangeValue, initParticleNumericAnimationValue, percentDenominator, updateAnimation, } from "@tsparticles/engine";
+import { Size } from "./Options/Classes/Size.js";
 const minLoops = 0;
 export class SizeUpdater {
-    _container;
+    #container;
     constructor(container) {
-        this._container = container;
+        this.#container = container;
     }
     init(particle) {
-        const container = this._container, sizeOptions = particle.options.size, sizeAnimation = sizeOptions.animation;
-        if (sizeAnimation.enable) {
-            particle.size.velocity =
-                (particle.retina.sizeAnimationSpeed / percentDenominator) * container.retina.reduceFactor;
-            if (!sizeAnimation.sync) {
-                particle.size.velocity *= getRandom();
-            }
+        const container = this.#container, sizeOptions = particle.options.size;
+        if (!sizeOptions) {
+            return;
+        }
+        const sizeAnimation = sizeOptions.animation;
+        if (!sizeAnimation.enable) {
+            return;
+        }
+        particle.size.velocity = (particle.retina.sizeAnimationSpeed / percentDenominator) * container.retina.reduceFactor;
+        if (sizeAnimation.sync) {
+            return;
         }
+        particle.size.velocity *= getRandom();
     }
     isEnabled(particle) {
         return (!particle.destroyed &&
@@ -23,12 +29,26 @@ export class SizeUpdater {
                 ((particle.size.maxLoops ?? minLoops) > minLoops &&
                     (particle.size.loops ?? minLoops) < (particle.size.maxLoops ?? minLoops))));
     }
+    loadOptions(options, ...sources) {
+        options.size ??= new Size();
+        for (const source of sources) {
+            options.size.load(source?.size);
+        }
+    }
+    preInit(particle) {
+        const pxRatio = this.#container.retina.pixelRatio, options = particle.options, sizeOptions = options.size;
+        if (!sizeOptions) {
+            return;
+        }
+        particle.size = initParticleNumericAnimationValue(sizeOptions, pxRatio);
+        particle.retina.sizeAnimationSpeed = getRangeValue(sizeOptions.animation.speed) * pxRatio;
+    }
     reset(particle) {
         particle.size.time = 0;
         particle.size.loops = 0;
     }
     update(particle, delta) {
-        if (!this.isEnabled(particle)) {
+        if (!this.isEnabled(particle) || !particle.options.size) {
             return;
         }
         updateAnimation(particle, particle.size, true, particle.options.size.animation.destroy, delta);

package/cjs/Types.js

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

package/cjs/index.js

@@ -1,6 +1,6 @@
 import { SizeUpdater } from "./SizeUpdater.js";
 export async function loadSizeUpdater(engine) {
-    engine.checkVersion("4.0.5");
+    engine.checkVersion("4.1.1");
     await engine.pluginManager.register(e => {
         e.pluginManager.addParticleUpdater("size", container => {
             return Promise.resolve(new SizeUpdater(container));

package/cjs/index.lazy.js

@@ -1,5 +1,5 @@
 export async function loadSizeUpdater(engine) {
-    engine.checkVersion("4.0.5");
+    engine.checkVersion("4.1.1");
     await engine.pluginManager.register(e => {
         e.pluginManager.addParticleUpdater("size", async (container) => {
             const { SizeUpdater } = await import("./SizeUpdater.js");

package/esm/Options/Classes/Size.js

@@ -0,0 +1,20 @@
+import { RangedAnimationValueWithRandom, isNull } from "@tsparticles/engine";
+import { SizeAnimation } from "./SizeAnimation.js";
+export class Size extends RangedAnimationValueWithRandom {
+    animation;
+    constructor() {
+        super();
+        this.animation = new SizeAnimation();
+        this.value = 3;
+    }
+    load(data) {
+        super.load(data);
+        if (isNull(data)) {
+            return;
+        }
+        const animation = data.animation;
+        if (animation !== undefined) {
+            this.animation.load(animation);
+        }
+    }
+}

package/esm/Options/Classes/SizeAnimation.js

@@ -0,0 +1,18 @@
+import { DestroyType, RangedAnimationOptions, isNull, } from "@tsparticles/engine";
+export class SizeAnimation extends RangedAnimationOptions {
+    destroy;
+    constructor() {
+        super();
+        this.destroy = DestroyType.none;
+        this.speed = 5;
+    }
+    load(data) {
+        super.load(data);
+        if (isNull(data)) {
+            return;
+        }
+        if (data.destroy !== undefined) {
+            this.destroy = data.destroy;
+        }
+    }
+}

package/esm/Options/Interfaces/ISize.js

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

package/esm/Options/Interfaces/ISizeAnimation.js

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

package/esm/SizeUpdater.js

@@ -1,19 +1,25 @@
-import { getRandom, percentDenominator, updateAnimation, } from "@tsparticles/engine";
+import { getRandom, getRangeValue, initParticleNumericAnimationValue, percentDenominator, updateAnimation, } from "@tsparticles/engine";
+import { Size } from "./Options/Classes/Size.js";
 const minLoops = 0;
 export class SizeUpdater {
-    _container;
+    #container;
     constructor(container) {
-        this._container = container;
+        this.#container = container;
     }
     init(particle) {
-        const container = this._container, sizeOptions = particle.options.size, sizeAnimation = sizeOptions.animation;
-        if (sizeAnimation.enable) {
-            particle.size.velocity =
-                (particle.retina.sizeAnimationSpeed / percentDenominator) * container.retina.reduceFactor;
-            if (!sizeAnimation.sync) {
-                particle.size.velocity *= getRandom();
-            }
+        const container = this.#container, sizeOptions = particle.options.size;
+        if (!sizeOptions) {
+            return;
+        }
+        const sizeAnimation = sizeOptions.animation;
+        if (!sizeAnimation.enable) {
+            return;
+        }
+        particle.size.velocity = (particle.retina.sizeAnimationSpeed / percentDenominator) * container.retina.reduceFactor;
+        if (sizeAnimation.sync) {
+            return;
         }
+        particle.size.velocity *= getRandom();
     }
     isEnabled(particle) {
         return (!particle.destroyed &&
@@ -23,12 +29,26 @@ export class SizeUpdater {
                 ((particle.size.maxLoops ?? minLoops) > minLoops &&
                     (particle.size.loops ?? minLoops) < (particle.size.maxLoops ?? minLoops))));
     }
+    loadOptions(options, ...sources) {
+        options.size ??= new Size();
+        for (const source of sources) {
+            options.size.load(source?.size);
+        }
+    }
+    preInit(particle) {
+        const pxRatio = this.#container.retina.pixelRatio, options = particle.options, sizeOptions = options.size;
+        if (!sizeOptions) {
+            return;
+        }
+        particle.size = initParticleNumericAnimationValue(sizeOptions, pxRatio);
+        particle.retina.sizeAnimationSpeed = getRangeValue(sizeOptions.animation.speed) * pxRatio;
+    }
     reset(particle) {
         particle.size.time = 0;
         particle.size.loops = 0;
     }
     update(particle, delta) {
-        if (!this.isEnabled(particle)) {
+        if (!this.isEnabled(particle) || !particle.options.size) {
             return;
         }
         updateAnimation(particle, particle.size, true, particle.options.size.animation.destroy, delta);

package/esm/Types.js

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

package/esm/index.js

@@ -1,6 +1,6 @@
 import { SizeUpdater } from "./SizeUpdater.js";
 export async function loadSizeUpdater(engine) {
-    engine.checkVersion("4.0.5");
+    engine.checkVersion("4.1.1");
     await engine.pluginManager.register(e => {
         e.pluginManager.addParticleUpdater("size", container => {
             return Promise.resolve(new SizeUpdater(container));

package/esm/index.lazy.js

@@ -1,5 +1,5 @@
 export async function loadSizeUpdater(engine) {
-    engine.checkVersion("4.0.5");
+    engine.checkVersion("4.1.1");
     await engine.pluginManager.register(e => {
         e.pluginManager.addParticleUpdater("size", async (container) => {
             const { SizeUpdater } = await import("./SizeUpdater.js");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/updater-size",
-  "version": "4.0.5",
+  "version": "4.1.1",
   "description": "tsParticles particles size updater",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -93,7 +93,7 @@
     "./package.json": "./package.json"
   },
   "peerDependencies": {
-    "@tsparticles/engine": "4.0.5"
+    "@tsparticles/engine": "4.1.1"
   },
   "publishConfig": {
     "access": "public"

package/report.html

@@ -4930,7 +4930,7 @@ var drawChart = (function (exports) {
   </script>
   <script>
     /*<!--*/
-    const data = {"version":2,"tree":{"name":"root","children":[{"name":"tsparticles.updater.size.js","children":[{"name":"dist/browser","children":[{"uid":"bcbdfb06-1","name":"SizeUpdater.js"},{"uid":"bcbdfb06-3","name":"index.js"},{"uid":"bcbdfb06-5","name":"browser.js"}]}]}],"isRoot":true},"nodeParts":{"bcbdfb06-1":{"renderedLength":1409,"gzipLength":0,"brotliLength":0,"metaUid":"bcbdfb06-0"},"bcbdfb06-3":{"renderedLength":305,"gzipLength":0,"brotliLength":0,"metaUid":"bcbdfb06-2"},"bcbdfb06-5":{"renderedLength":173,"gzipLength":0,"brotliLength":0,"metaUid":"bcbdfb06-4"}},"nodeMetas":{"bcbdfb06-0":{"id":"/dist/browser/SizeUpdater.js","moduleParts":{"tsparticles.updater.size.js":"bcbdfb06-1"},"imported":[{"uid":"bcbdfb06-6"}],"importedBy":[{"uid":"bcbdfb06-2"}]},"bcbdfb06-2":{"id":"/dist/browser/index.js","moduleParts":{"tsparticles.updater.size.js":"bcbdfb06-3"},"imported":[{"uid":"bcbdfb06-0"}],"importedBy":[{"uid":"bcbdfb06-4"}]},"bcbdfb06-4":{"id":"/dist/browser/browser.js","moduleParts":{"tsparticles.updater.size.js":"bcbdfb06-5"},"imported":[{"uid":"bcbdfb06-2"}],"importedBy":[],"isEntry":true},"bcbdfb06-6":{"id":"@tsparticles/engine","moduleParts":{},"imported":[],"importedBy":[{"uid":"bcbdfb06-0"}],"isExternal":true}},"env":{"rollup":"4.60.4"},"options":{"gzip":false,"brotli":false,"sourcemap":false}};
+    const data = {"version":2,"tree":{"name":"root","children":[{"name":"tsparticles.updater.size.js","children":[{"name":"dist/browser","children":[{"name":"Options/Classes","children":[{"uid":"b4ba9a13-1","name":"SizeAnimation.js"},{"uid":"b4ba9a13-3","name":"Size.js"}]},{"uid":"b4ba9a13-5","name":"SizeUpdater.js"},{"uid":"b4ba9a13-7","name":"index.js"},{"uid":"b4ba9a13-9","name":"browser.js"}]}]}],"isRoot":true},"nodeParts":{"b4ba9a13-1":{"renderedLength":464,"gzipLength":0,"brotliLength":0,"metaUid":"b4ba9a13-0"},"b4ba9a13-3":{"renderedLength":509,"gzipLength":0,"brotliLength":0,"metaUid":"b4ba9a13-2"},"b4ba9a13-5":{"renderedLength":2161,"gzipLength":0,"brotliLength":0,"metaUid":"b4ba9a13-4"},"b4ba9a13-7":{"renderedLength":305,"gzipLength":0,"brotliLength":0,"metaUid":"b4ba9a13-6"},"b4ba9a13-9":{"renderedLength":173,"gzipLength":0,"brotliLength":0,"metaUid":"b4ba9a13-8"}},"nodeMetas":{"b4ba9a13-0":{"id":"/dist/browser/Options/Classes/SizeAnimation.js","moduleParts":{"tsparticles.updater.size.js":"b4ba9a13-1"},"imported":[{"uid":"b4ba9a13-10"}],"importedBy":[{"uid":"b4ba9a13-2"}]},"b4ba9a13-2":{"id":"/dist/browser/Options/Classes/Size.js","moduleParts":{"tsparticles.updater.size.js":"b4ba9a13-3"},"imported":[{"uid":"b4ba9a13-10"},{"uid":"b4ba9a13-0"}],"importedBy":[{"uid":"b4ba9a13-4"}]},"b4ba9a13-4":{"id":"/dist/browser/SizeUpdater.js","moduleParts":{"tsparticles.updater.size.js":"b4ba9a13-5"},"imported":[{"uid":"b4ba9a13-10"},{"uid":"b4ba9a13-2"}],"importedBy":[{"uid":"b4ba9a13-6"}]},"b4ba9a13-6":{"id":"/dist/browser/index.js","moduleParts":{"tsparticles.updater.size.js":"b4ba9a13-7"},"imported":[{"uid":"b4ba9a13-4"}],"importedBy":[{"uid":"b4ba9a13-8"}]},"b4ba9a13-8":{"id":"/dist/browser/browser.js","moduleParts":{"tsparticles.updater.size.js":"b4ba9a13-9"},"imported":[{"uid":"b4ba9a13-6"}],"importedBy":[],"isEntry":true},"b4ba9a13-10":{"id":"@tsparticles/engine","moduleParts":{},"imported":[],"importedBy":[{"uid":"b4ba9a13-4"},{"uid":"b4ba9a13-2"},{"uid":"b4ba9a13-0"}],"isExternal":true}},"env":{"rollup":"4.60.4"},"options":{"gzip":false,"brotli":false,"sourcemap":false}};
 
     const run = () => {
       const width = window.innerWidth;

package/tsparticles.updater.size.js

@@ -1,26 +1,68 @@
 (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);
-/* Updater v4.0.5 */
+/* Updater v4.1.1 */
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@tsparticles/engine')) :
     typeof define === 'function' && define.amd ? define(['exports', '@tsparticles/engine'], factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.__tsParticlesInternals = global.__tsParticlesInternals || {}, global.__tsParticlesInternals.updaters = global.__tsParticlesInternals.updaters || {}, global.__tsParticlesInternals.updaters.size = global.__tsParticlesInternals.updaters.size || {}), global.__tsParticlesInternals.engine));
 })(this, (function (exports, engine) { 'use strict';
 
+    class SizeAnimation extends engine.RangedAnimationOptions {
+        destroy;
+        constructor() {
+            super();
+            this.destroy = engine.DestroyType.none;
+            this.speed = 5;
+        }
+        load(data) {
+            super.load(data);
+            if (engine.isNull(data)) {
+                return;
+            }
+            if (data.destroy !== undefined) {
+                this.destroy = data.destroy;
+            }
+        }
+    }
+
+    class Size extends engine.RangedAnimationValueWithRandom {
+        animation;
+        constructor() {
+            super();
+            this.animation = new SizeAnimation();
+            this.value = 3;
+        }
+        load(data) {
+            super.load(data);
+            if (engine.isNull(data)) {
+                return;
+            }
+            const animation = data.animation;
+            if (animation !== undefined) {
+                this.animation.load(animation);
+            }
+        }
+    }
+
     const minLoops = 0;
     class SizeUpdater {
-        _container;
+        #container;
         constructor(container) {
-            this._container = container;
+            this.#container = container;
         }
         init(particle) {
-            const container = this._container, sizeOptions = particle.options.size, sizeAnimation = sizeOptions.animation;
-            if (sizeAnimation.enable) {
-                particle.size.velocity =
-                    (particle.retina.sizeAnimationSpeed / engine.percentDenominator) * container.retina.reduceFactor;
-                if (!sizeAnimation.sync) {
-                    particle.size.velocity *= engine.getRandom();
-                }
+            const container = this.#container, sizeOptions = particle.options.size;
+            if (!sizeOptions) {
+                return;
+            }
+            const sizeAnimation = sizeOptions.animation;
+            if (!sizeAnimation.enable) {
+                return;
+            }
+            particle.size.velocity = (particle.retina.sizeAnimationSpeed / engine.percentDenominator) * container.retina.reduceFactor;
+            if (sizeAnimation.sync) {
+                return;
             }
+            particle.size.velocity *= engine.getRandom();
         }
         isEnabled(particle) {
             return (!particle.destroyed &&
@@ -30,12 +72,26 @@
                     ((particle.size.maxLoops ?? minLoops) > minLoops &&
                         (particle.size.loops ?? minLoops) < (particle.size.maxLoops ?? minLoops))));
         }
+        loadOptions(options, ...sources) {
+            options.size ??= new Size();
+            for (const source of sources) {
+                options.size.load(source?.size);
+            }
+        }
+        preInit(particle) {
+            const pxRatio = this.#container.retina.pixelRatio, options = particle.options, sizeOptions = options.size;
+            if (!sizeOptions) {
+                return;
+            }
+            particle.size = engine.initParticleNumericAnimationValue(sizeOptions, pxRatio);
+            particle.retina.sizeAnimationSpeed = engine.getRangeValue(sizeOptions.animation.speed) * pxRatio;
+        }
         reset(particle) {
             particle.size.time = 0;
             particle.size.loops = 0;
         }
         update(particle, delta) {
-            if (!this.isEnabled(particle)) {
+            if (!this.isEnabled(particle) || !particle.options.size) {
                 return;
             }
             engine.updateAnimation(particle, particle.size, true, particle.options.size.animation.destroy, delta);
@@ -43,7 +99,7 @@
     }
 
     async function loadSizeUpdater(engine) {
-        engine.checkVersion("4.0.5");
+        engine.checkVersion("4.1.1");
         await engine.pluginManager.register(e => {
             e.pluginManager.addParticleUpdater("size", container => {
                 return Promise.resolve(new SizeUpdater(container));

package/tsparticles.updater.size.min.js

@@ -1 +1 @@
-!function(s){s.__tsParticlesInternals=s.__tsParticlesInternals||{},s.__tsParticlesInternals.bundles=s.__tsParticlesInternals.bundles||{},s.__tsParticlesInternals.effects=s.__tsParticlesInternals.effects||{},s.__tsParticlesInternals.engine=s.__tsParticlesInternals.engine||{},s.__tsParticlesInternals.interactions=s.__tsParticlesInternals.interactions||{},s.__tsParticlesInternals.palettes=s.__tsParticlesInternals.palettes||{},s.__tsParticlesInternals.paths=s.__tsParticlesInternals.paths||{},s.__tsParticlesInternals.plugins=s.__tsParticlesInternals.plugins||{},s.__tsParticlesInternals.plugins=s.__tsParticlesInternals.plugins||{},s.__tsParticlesInternals.plugins.emittersShapes=s.__tsParticlesInternals.plugins.emittersShapes||{},s.__tsParticlesInternals.presets=s.__tsParticlesInternals.presets||{},s.__tsParticlesInternals.shapes=s.__tsParticlesInternals.shapes||{},s.__tsParticlesInternals.updaters=s.__tsParticlesInternals.updaters||{},s.__tsParticlesInternals.utils=s.__tsParticlesInternals.utils||{},s.__tsParticlesInternals.canvas=s.__tsParticlesInternals.canvas||{},s.__tsParticlesInternals.canvas=s.__tsParticlesInternals.canvas||{},s.__tsParticlesInternals.canvas.utils=s.__tsParticlesInternals.canvas.utils||{},s.__tsParticlesInternals.path=s.__tsParticlesInternals.path||{},s.__tsParticlesInternals.path=s.__tsParticlesInternals.path||{},s.__tsParticlesInternals.path.utils=s.__tsParticlesInternals.path.utils||{};var t="undefined"!=typeof Proxy?function(s){return new Proxy(s,{get:function(s,t){return t in s||(s[t]={}),s[t]}})}:function(s){return s};s.__tsParticlesInternals.bundles=t(s.__tsParticlesInternals.bundles),s.__tsParticlesInternals.effects=t(s.__tsParticlesInternals.effects),s.__tsParticlesInternals.interactions=t(s.__tsParticlesInternals.interactions),s.__tsParticlesInternals.palettes=t(s.__tsParticlesInternals.palettes),s.__tsParticlesInternals.paths=t(s.__tsParticlesInternals.paths),s.__tsParticlesInternals.plugins=t(s.__tsParticlesInternals.plugins),s.__tsParticlesInternals.plugins.emittersShapes=t(s.__tsParticlesInternals.plugins.emittersShapes),s.__tsParticlesInternals.presets=t(s.__tsParticlesInternals.presets),s.__tsParticlesInternals.shapes=t(s.__tsParticlesInternals.shapes),s.__tsParticlesInternals.updaters=t(s.__tsParticlesInternals.updaters),s.__tsParticlesInternals.utils=t(s.__tsParticlesInternals.utils),s.__tsParticlesInternals.canvas=t(s.__tsParticlesInternals.canvas),s.__tsParticlesInternals.path=t(s.__tsParticlesInternals.path),s.tsparticlesInternalExports=s.tsparticlesInternalExports||{}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:this),function(s,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@tsparticles/engine")):"function"==typeof define&&define.amd?define(["exports","@tsparticles/engine"],t):t(((s="undefined"!=typeof globalThis?globalThis:s||self).__tsParticlesInternals=s.__tsParticlesInternals||{},s.__tsParticlesInternals.updaters=s.__tsParticlesInternals.updaters||{},s.__tsParticlesInternals.updaters.size=s.__tsParticlesInternals.updaters.size||{}),s.__tsParticlesInternals.engine)}(this,function(s,t){"use strict";class e{_container;constructor(s){this._container=s}init(s){const e=this._container,n=s.options.size.animation;n.enable&&(s.size.velocity=s.retina.sizeAnimationSpeed/t.percentDenominator*e.retina.reduceFactor,n.sync||(s.size.velocity*=t.getRandom()))}isEnabled(s){return!s.destroyed&&!s.spawning&&s.size.enable&&((s.size.maxLoops??0)<=0||(s.size.maxLoops??0)>0&&(s.size.loops??0)<(s.size.maxLoops??0))}reset(s){s.size.time=0,s.size.loops=0}update(s,e){this.isEnabled(s)&&t.updateAnimation(s,s.size,!0,s.options.size.animation.destroy,e)}}async function n(s){s.checkVersion("4.0.5"),await s.pluginManager.register(s=>{s.pluginManager.addParticleUpdater("size",s=>Promise.resolve(new e(s)))})}const a=globalThis;a.__tsParticlesInternals=a.__tsParticlesInternals??{},a.loadSizeUpdater=n,s.loadSizeUpdater=n}),Object.assign(globalThis.window||globalThis,{loadSizeUpdater:(globalThis.__tsParticlesInternals.updaters.size||{}).loadSizeUpdater}),delete(globalThis.window||globalThis).tsparticlesInternalExports;
+!function(s){s.__tsParticlesInternals=s.__tsParticlesInternals||{},s.__tsParticlesInternals.bundles=s.__tsParticlesInternals.bundles||{},s.__tsParticlesInternals.effects=s.__tsParticlesInternals.effects||{},s.__tsParticlesInternals.engine=s.__tsParticlesInternals.engine||{},s.__tsParticlesInternals.interactions=s.__tsParticlesInternals.interactions||{},s.__tsParticlesInternals.palettes=s.__tsParticlesInternals.palettes||{},s.__tsParticlesInternals.paths=s.__tsParticlesInternals.paths||{},s.__tsParticlesInternals.plugins=s.__tsParticlesInternals.plugins||{},s.__tsParticlesInternals.plugins=s.__tsParticlesInternals.plugins||{},s.__tsParticlesInternals.plugins.emittersShapes=s.__tsParticlesInternals.plugins.emittersShapes||{},s.__tsParticlesInternals.presets=s.__tsParticlesInternals.presets||{},s.__tsParticlesInternals.shapes=s.__tsParticlesInternals.shapes||{},s.__tsParticlesInternals.updaters=s.__tsParticlesInternals.updaters||{},s.__tsParticlesInternals.utils=s.__tsParticlesInternals.utils||{},s.__tsParticlesInternals.canvas=s.__tsParticlesInternals.canvas||{},s.__tsParticlesInternals.canvas=s.__tsParticlesInternals.canvas||{},s.__tsParticlesInternals.canvas.utils=s.__tsParticlesInternals.canvas.utils||{},s.__tsParticlesInternals.path=s.__tsParticlesInternals.path||{},s.__tsParticlesInternals.path=s.__tsParticlesInternals.path||{},s.__tsParticlesInternals.path.utils=s.__tsParticlesInternals.path.utils||{};var t="undefined"!=typeof Proxy?function(s){return new Proxy(s,{get:function(s,t){return t in s||(s[t]={}),s[t]}})}:function(s){return s};s.__tsParticlesInternals.bundles=t(s.__tsParticlesInternals.bundles),s.__tsParticlesInternals.effects=t(s.__tsParticlesInternals.effects),s.__tsParticlesInternals.interactions=t(s.__tsParticlesInternals.interactions),s.__tsParticlesInternals.palettes=t(s.__tsParticlesInternals.palettes),s.__tsParticlesInternals.paths=t(s.__tsParticlesInternals.paths),s.__tsParticlesInternals.plugins=t(s.__tsParticlesInternals.plugins),s.__tsParticlesInternals.plugins.emittersShapes=t(s.__tsParticlesInternals.plugins.emittersShapes),s.__tsParticlesInternals.presets=t(s.__tsParticlesInternals.presets),s.__tsParticlesInternals.shapes=t(s.__tsParticlesInternals.shapes),s.__tsParticlesInternals.updaters=t(s.__tsParticlesInternals.updaters),s.__tsParticlesInternals.utils=t(s.__tsParticlesInternals.utils),s.__tsParticlesInternals.canvas=t(s.__tsParticlesInternals.canvas),s.__tsParticlesInternals.path=t(s.__tsParticlesInternals.path),s.tsparticlesInternalExports=s.tsparticlesInternalExports||{}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:this),function(s,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@tsparticles/engine")):"function"==typeof define&&define.amd?define(["exports","@tsparticles/engine"],t):t(((s="undefined"!=typeof globalThis?globalThis:s||self).__tsParticlesInternals=s.__tsParticlesInternals||{},s.__tsParticlesInternals.updaters=s.__tsParticlesInternals.updaters||{},s.__tsParticlesInternals.updaters.size=s.__tsParticlesInternals.updaters.size||{}),s.__tsParticlesInternals.engine)}(this,function(s,t){"use strict";class e extends t.RangedAnimationOptions{destroy;constructor(){super(),this.destroy=t.DestroyType.none,this.speed=5}load(s){super.load(s),t.isNull(s)||void 0!==s.destroy&&(this.destroy=s.destroy)}}class n extends t.RangedAnimationValueWithRandom{animation;constructor(){super(),this.animation=new e,this.value=3}load(s){if(super.load(s),t.isNull(s))return;const e=s.animation;void 0!==e&&this.animation.load(e)}}class a{#s;constructor(s){this.#s=s}init(s){const e=this.#s,n=s.options.size;if(!n)return;const a=n.animation;a.enable&&(s.size.velocity=s.retina.sizeAnimationSpeed/t.percentDenominator*e.retina.reduceFactor,a.sync||(s.size.velocity*=t.getRandom()))}isEnabled(s){return!s.destroyed&&!s.spawning&&s.size.enable&&((s.size.maxLoops??0)<=0||(s.size.maxLoops??0)>0&&(s.size.loops??0)<(s.size.maxLoops??0))}loadOptions(s,...t){s.size??=new n;for(const e of t)s.size.load(e?.size)}preInit(s){const e=this.#s.retina.pixelRatio,n=s.options.size;n&&(s.size=t.initParticleNumericAnimationValue(n,e),s.retina.sizeAnimationSpeed=t.getRangeValue(n.animation.speed)*e)}reset(s){s.size.time=0,s.size.loops=0}update(s,e){this.isEnabled(s)&&s.options.size&&t.updateAnimation(s,s.size,!0,s.options.size.animation.destroy,e)}}async function i(s){s.checkVersion("4.1.1"),await s.pluginManager.register(s=>{s.pluginManager.addParticleUpdater("size",s=>Promise.resolve(new a(s)))})}const r=globalThis;r.__tsParticlesInternals=r.__tsParticlesInternals??{},r.loadSizeUpdater=i,s.loadSizeUpdater=i}),Object.assign(globalThis.window||globalThis,{loadSizeUpdater:(globalThis.__tsParticlesInternals.updaters.size||{}).loadSizeUpdater}),delete(globalThis.window||globalThis).tsparticlesInternalExports;

package/types/Options/Classes/Size.d.ts

@@ -0,0 +1,8 @@
+import { type IOptionLoader, RangedAnimationValueWithRandom, type RecursivePartial } from "@tsparticles/engine";
+import type { ISize } from "../Interfaces/ISize.js";
+import { SizeAnimation } from "./SizeAnimation.js";
+export declare class Size extends RangedAnimationValueWithRandom implements ISize, IOptionLoader<ISize> {
+    readonly animation: SizeAnimation;
+    constructor();
+    load(data?: RecursivePartial<ISize>): void;
+}

package/types/Options/Classes/SizeAnimation.d.ts

@@ -0,0 +1,7 @@
+import { DestroyType, type IOptionLoader, RangedAnimationOptions, type RecursivePartial } from "@tsparticles/engine";
+import type { ISizeAnimation } from "../Interfaces/ISizeAnimation.js";
+export declare class SizeAnimation extends RangedAnimationOptions implements ISizeAnimation, IOptionLoader<ISizeAnimation> {
+    destroy: DestroyType | keyof typeof DestroyType;
+    constructor();
+    load(data?: RecursivePartial<ISizeAnimation>): void;
+}

package/types/Options/Interfaces/ISize.d.ts

@@ -0,0 +1,5 @@
+import type { ISizeAnimation } from "./ISizeAnimation.js";
+import type { IValueWithRandom } from "@tsparticles/engine";
+export interface ISize extends IValueWithRandom {
+    animation: ISizeAnimation;
+}

package/types/Options/Interfaces/ISizeAnimation.d.ts

@@ -0,0 +1,4 @@
+import type { DestroyType, IRangedAnimation } from "@tsparticles/engine";
+export interface ISizeAnimation extends IRangedAnimation {
+    destroy: DestroyType | keyof typeof DestroyType;
+}

package/types/SizeUpdater.d.ts

@@ -1,9 +1,12 @@
-import { type Container, type IDelta, type IParticleUpdater, type Particle } from "@tsparticles/engine";
+import { type Container, type IDelta, type IParticleUpdater, type RecursivePartial } from "@tsparticles/engine";
+import type { ISizeParticlesOptions, SizeParticle, SizeParticlesOptions } from "./Types.js";
 export declare class SizeUpdater implements IParticleUpdater {
-    private readonly _container;
+    #private;
     constructor(container: Container);
-    init(particle: Particle): void;
-    isEnabled(particle: Particle): boolean;
-    reset(particle: Particle): void;
-    update(particle: Particle, delta: IDelta): void;
+    init(particle: SizeParticle): void;
+    isEnabled(particle: SizeParticle): boolean;
+    loadOptions(options: SizeParticlesOptions, ...sources: (RecursivePartial<ISizeParticlesOptions> | undefined)[]): void;
+    preInit(particle: SizeParticle): void;
+    reset(particle: SizeParticle): void;
+    update(particle: SizeParticle, delta: IDelta): void;
 }

package/types/Types.d.ts

@@ -0,0 +1,12 @@
+import { type IParticlesOptions, type Particle, type ParticlesOptions } from "@tsparticles/engine";
+import type { ISize } from "./Options/Interfaces/ISize.js";
+import type { Size } from "./Options/Classes/Size.js";
+export type SizeParticlesOptions = ParticlesOptions & {
+    size?: Size;
+};
+export type ISizeParticlesOptions = IParticlesOptions & {
+    size?: ISize;
+};
+export type SizeParticle = Particle & {
+    options: SizeParticlesOptions;
+};