@tsparticles/plugin-emitters 3.0.0-beta.2 → 3.0.0-beta.4

package/types/EmitterShapeBase.d.ts

@@ -0,0 +1,13 @@
+import type { ICoordinates, IDimension } from "@tsparticles/engine";
+import type { IEmitterShape } from "./IEmitterShape.js";
+import type { IRandomPositionData } from "./IRandomPositionData.js";
+export declare abstract class EmitterShapeBase<TOptions = unknown> implements IEmitterShape {
+    fill: boolean;
+    options: TOptions;
+    position: ICoordinates;
+    size: IDimension;
+    protected constructor(position: ICoordinates, size: IDimension, fill: boolean, options: TOptions);
+    resize(position: ICoordinates, size: IDimension): void;
+    abstract init(): Promise<void>;
+    abstract randomPosition(): Promise<IRandomPositionData | null>;
+}

package/types/Emitters.d.ts

@@ -12,7 +12,7 @@ export declare class Emitters implements IContainerPlugin {
     interactivityEmitters: EmitterModeOptions;
     private readonly _engine;
     constructor(engine: EmittersEngine, container: EmitterContainer);
-    addEmitter(options: RecursivePartial<IEmitter>, position?: ICoordinates): EmitterInstance;
+    addEmitter(options: RecursivePartial<IEmitter>, position?: ICoordinates): Promise<EmitterInstance>;
     handleClickMode(mode: string): void;
     init(): Promise<void>;
     pause(): void;
@@ -20,5 +20,5 @@ export declare class Emitters implements IContainerPlugin {
     removeEmitter(emitter: EmitterInstance): void;
     resize(): void;
     stop(): void;
-    update(delta: IDelta): void;
+    update(delta: IDelta): Promise<void>;
 }

package/types/EmittersEngine.d.ts

@@ -1,7 +1,7 @@
 import type { Engine } from "@tsparticles/engine";
-import type { IEmitterShape } from "./IEmitterShape.js";
+import type { IEmitterShapeGenerator } from "./IEmitterShapeGenerator.js";
 import type { ShapeManager } from "./ShapeManager.js";
 export type EmittersEngine = Engine & {
-    addEmitterShape?: (name: string, shape: IEmitterShape) => void;
+    addEmitterShapeGenerator?: (name: string, shape: IEmitterShapeGenerator) => void;
     emitterShapeManager?: ShapeManager;
 };

package/types/IEmitterShape.d.ts

@@ -1,4 +1,7 @@
 import type { ICoordinates, IDimension } from "@tsparticles/engine";
+import type { IRandomPositionData } from "./IRandomPositionData.js";
 export interface IEmitterShape {
-    randomPosition(position: ICoordinates, size: IDimension, fill: boolean): ICoordinates;
+    init(): Promise<void>;
+    randomPosition(): Promise<IRandomPositionData | null>;
+    resize(position: ICoordinates, size: IDimension): void;
 }

package/types/IEmitterShapeGenerator.d.ts

@@ -0,0 +1,5 @@
+import type { ICoordinates, IDimension } from "@tsparticles/engine";
+import type { IEmitterShape } from "./IEmitterShape.js";
+export interface IEmitterShapeGenerator<TOptions = unknown> {
+    generate(position: ICoordinates, size: IDimension, fill: boolean, options: TOptions): IEmitterShape;
+}

package/types/IRandomPositionData.d.ts

@@ -0,0 +1,6 @@
+import type { ICoordinates, IRgb } from "@tsparticles/engine";
+export interface IRandomPositionData {
+    color?: IRgb;
+    opacity?: number;
+    position: ICoordinates;
+}

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

@@ -1,7 +1,7 @@
 import { AnimatableColor, type IOptionLoader, type IParticlesOptions, type IRangedCoordinates, type MoveDirection, type MoveDirectionAlt, type RecursivePartial, type SingleOrMultiple } from "@tsparticles/engine";
 import { EmitterLife } from "./EmitterLife.js";
 import { EmitterRate } from "./EmitterRate.js";
-import { EmitterShapeType } from "../../Enums/EmitterShapeType.js";
+import { EmitterShape } from "./EmitterShape.js";
 import { EmitterSize } from "./EmitterSize.js";
 import type { IEmitter } from "../Interfaces/IEmitter.js";
 export declare class Emitter implements IEmitter, IOptionLoader<IEmitter> {
@@ -14,7 +14,7 @@ export declare class Emitter implements IEmitter, IOptionLoader<IEmitter> {
     particles?: SingleOrMultiple<RecursivePartial<IParticlesOptions>>;
     position?: RecursivePartial<IRangedCoordinates>;
     rate: EmitterRate;
-    shape: EmitterShapeType | keyof typeof EmitterShapeType;
+    shape: EmitterShape;
     size?: EmitterSize;
     spawnColor?: AnimatableColor;
     startCount: number;

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

@@ -0,0 +1,10 @@
+import { type IOptionLoader, type RecursivePartial } from "@tsparticles/engine";
+import { EmitterShapeReplace } from "./EmitterShapeReplace.js";
+import type { IEmitterShape } from "../Interfaces/IEmitterShape.js";
+export declare class EmitterShape implements IEmitterShape, IOptionLoader<IEmitterShape> {
+    options: Record<string, unknown>;
+    replace: EmitterShapeReplace;
+    type: string;
+    constructor();
+    load(data?: RecursivePartial<IEmitterShape> | undefined): void;
+}

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

@@ -0,0 +1,8 @@
+import type { IOptionLoader, RecursivePartial } from "@tsparticles/engine";
+import type { IEmitterShapeReplace } from "../Interfaces/IEmitterShapeReplace.js";
+export declare class EmitterShapeReplace implements IEmitterShapeReplace, IOptionLoader<IEmitterShapeReplace> {
+    color: boolean;
+    opacity: boolean;
+    constructor();
+    load(data?: RecursivePartial<IEmitterShapeReplace> | undefined): void;
+}

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

@@ -1,7 +1,7 @@
 import type { IAnimatableColor, IParticlesOptions, IRangedCoordinates, MoveDirection, MoveDirectionAlt, RecursivePartial, SingleOrMultiple } from "@tsparticles/engine";
-import type { EmitterShapeType } from "../../Enums/EmitterShapeType.js";
 import type { IEmitterLife } from "./IEmitterLife.js";
 import type { IEmitterRate } from "./IEmitterRate.js";
+import type { IEmitterShape } from "./IEmitterShape.js";
 import type { IEmitterSize } from "./IEmitterSize.js";
 export interface IEmitter {
     autoPlay: boolean;
@@ -13,7 +13,7 @@ export interface IEmitter {
     particles?: SingleOrMultiple<RecursivePartial<IParticlesOptions>>;
     position?: RecursivePartial<IRangedCoordinates>;
     rate: IEmitterRate;
-    shape: EmitterShapeType | keyof typeof EmitterShapeType;
+    shape: IEmitterShape;
     size?: IEmitterSize;
     spawnColor?: IAnimatableColor;
     startCount: number;

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

@@ -0,0 +1,6 @@
+import type { IEmitterShapeReplace } from "./IEmitterShapeReplace.js";
+export interface IEmitterShape {
+    options: Record<string, unknown>;
+    replace: IEmitterShapeReplace;
+    type: string;
+}

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

@@ -0,0 +1,4 @@
+export interface IEmitterShapeReplace {
+    color: boolean;
+    opacity: boolean;
+}

package/types/ShapeManager.d.ts

@@ -1,9 +1,9 @@
 import type { Engine } from "@tsparticles/engine";
-import type { IEmitterShape } from "./IEmitterShape.js";
+import type { IEmitterShapeGenerator } from "./IEmitterShapeGenerator.js";
 export declare class ShapeManager {
     private readonly _engine;
     constructor(engine: Engine);
-    addShape(name: string, drawer: IEmitterShape): void;
-    getShape(name: string): IEmitterShape | undefined;
-    getSupportedShapes(): IterableIterator<string>;
+    addShapeGenerator(name: string, generator: IEmitterShapeGenerator): void;
+    getShapeGenerator(name: string): IEmitterShapeGenerator | undefined;
+    getSupportedShapeGenerators(): IterableIterator<string>;
 }

package/types/index.d.ts

@@ -1,6 +1,9 @@
 import type { EmittersEngine } from "./EmittersEngine.js";
 export declare function loadEmittersPlugin(engine: EmittersEngine, refresh?: boolean): Promise<void>;
 export * from "./EmitterContainer.js";
+export * from "./EmitterShapeBase.js";
 export * from "./EmittersEngine.js";
+export * from "./IEmitterShape.js";
+export * from "./IEmitterShapeGenerator.js";
 export * from "./Enums/EmitterClickMode.js";
-export * from "./Enums/EmitterShapeType.js";
+export * from "./IRandomPositionData.js";

package/umd/EmitterInstance.js

@@ -13,17 +13,25 @@
     const engine_1 = require("@tsparticles/engine");
     const Emitter_js_1 = require("./Options/Classes/Emitter.js");
     const EmitterSize_js_1 = require("./Options/Classes/EmitterSize.js");
+    function setParticlesOptionsColor(particlesOptions, color) {
+        if (particlesOptions.color) {
+            particlesOptions.color.value = color;
+        }
+        else {
+            particlesOptions.color = {
+                value: color,
+            };
+        }
+    }
     class EmitterInstance {
         constructor(engine, emitters, container, options, position) {
             this.emitters = emitters;
             this.container = container;
-            this._calcPosition = () => {
-                return (0, engine_1.calcPositionOrRandomFromSizeRanged)({
-                    size: this.container.canvas.size,
-                    position: this.options.position,
-                });
-            };
             this._destroy = () => {
+                this._mutationObserver?.disconnect();
+                this._mutationObserver = undefined;
+                this._resizeObserver?.disconnect();
+                this._resizeObserver = undefined;
                 this.emitters.removeEmitter(this);
                 this._engine.dispatchEvent("emitterDestroyed", {
                     container: this.container,
@@ -32,40 +40,6 @@
                     },
                 });
             };
-            this._emit = () => {
-                if (this._paused) {
-                    return;
-                }
-                const quantity = (0, engine_1.getRangeValue)(this.options.rate.quantity);
-                this._emitParticles(quantity);
-            };
-            this._emitParticles = (quantity) => {
-                const position = this.getPosition(), size = this.getSize(), singleParticlesOptions = (0, engine_1.itemFromSingleOrMultiple)(this._particlesOptions);
-                for (let i = 0; i < quantity; i++) {
-                    const particlesOptions = (0, engine_1.deepExtend)({}, singleParticlesOptions);
-                    if (this.spawnColor) {
-                        const hslAnimation = this.options.spawnColor?.animation;
-                        if (hslAnimation) {
-                            this.spawnColor.h = this._setColorAnimation(hslAnimation.h, this.spawnColor.h, 360);
-                            this.spawnColor.s = this._setColorAnimation(hslAnimation.s, this.spawnColor.s, 100);
-                            this.spawnColor.l = this._setColorAnimation(hslAnimation.l, this.spawnColor.l, 100);
-                        }
-                        if (!particlesOptions.color) {
-                            particlesOptions.color = {
-                                value: this.spawnColor,
-                            };
-                        }
-                        else {
-                            particlesOptions.color.value = this.spawnColor;
-                        }
-                    }
-                    if (!position) {
-                        return;
-                    }
-                    const pPosition = this._shape?.randomPosition(position, size, this.fill) ?? position;
-                    this.container.particles.addParticle(pPosition, particlesOptions);
-                }
-            };
             this._prepareToDie = () => {
                 if (this._paused) {
                     return;
@@ -101,7 +75,6 @@
             this._spawnDelay = ((0, engine_1.getRangeValue)(this.options.life.delay ?? 0) * 1000) / this.container.retina.reduceFactor;
             this.position = this._initialPosition ?? this._calcPosition();
             this.name = this.options.name;
-            this._shape = this._engine.emitterShapeManager?.getShape(this.options.shape);
             this.fill = this.options.fill;
             this._firstSpawn = !this.options.life.wait;
             this._startParticlesAdded = false;
@@ -114,19 +87,30 @@
             }
             this._paused = !this.options.autoPlay;
             this._particlesOptions = particlesOptions;
-            this.size =
-                this.options.size ??
-                    (() => {
-                        const size = new EmitterSize_js_1.EmitterSize();
-                        size.load({
-                            height: 0,
-                            mode: "percent",
-                            width: 0,
-                        });
-                        return size;
-                    })();
+            this._size = this._calcSize();
+            this.size = (0, engine_1.getSize)(this._size, this.container.canvas.size);
             this._lifeCount = this.options.life.count ?? -1;
             this._immortal = this._lifeCount <= 0;
+            if (this.options.domId) {
+                const element = document.getElementById(this.options.domId);
+                if (element) {
+                    this._mutationObserver = new MutationObserver(() => {
+                        this.resize();
+                    });
+                    this._resizeObserver = new ResizeObserver(() => {
+                        this.resize();
+                    });
+                    this._mutationObserver.observe(element, {
+                        attributes: true,
+                        attributeFilter: ["style", "width", "height"],
+                    });
+                    this._resizeObserver.observe(element);
+                }
+            }
+            const shapeOptions = this.options.shape, shapeGenerator = this._engine.emitterShapeManager?.getShapeGenerator(shapeOptions.type);
+            if (shapeGenerator) {
+                this._shape = shapeGenerator.generate(this.position, this.size, this.fill, shapeOptions.options);
+            }
             this._engine.dispatchEvent("emitterCreated", {
                 container,
                 data: {
@@ -143,32 +127,8 @@
             this._paused = false;
             this.play();
         }
-        getPosition() {
-            if (this.options.domId) {
-                const container = this.container, element = document.getElementById(this.options.domId);
-                if (element) {
-                    const elRect = element.getBoundingClientRect();
-                    return {
-                        x: (elRect.x + elRect.width / 2) * container.retina.pixelRatio,
-                        y: (elRect.y + elRect.height / 2) * container.retina.pixelRatio,
-                    };
-                }
-            }
-            return this.position;
-        }
-        getSize() {
-            const container = this.container;
-            if (this.options.domId) {
-                const element = document.getElementById(this.options.domId);
-                if (element) {
-                    const elRect = element.getBoundingClientRect();
-                    return {
-                        width: elRect.width * container.retina.pixelRatio,
-                        height: elRect.height * container.retina.pixelRatio,
-                    };
-                }
-            }
-            return (0, engine_1.getSize)(this.size, container.canvas.size);
+        async init() {
+            await this._shape?.init();
         }
         pause() {
             if (this._paused) {
@@ -199,8 +159,11 @@
                 initialPosition && (0, engine_1.isPointInside)(initialPosition, this.container.canvas.size, engine_1.Vector.origin)
                     ? initialPosition
                     : this._calcPosition();
+            this._size = this._calcSize();
+            this.size = (0, engine_1.getSize)(this._size, this.container.canvas.size);
+            this._shape?.resize(this.position, this.size);
         }
-        update(delta) {
+        async update(delta) {
             if (this._paused) {
                 return;
             }
@@ -211,7 +174,7 @@
             }
             if (!this._startParticlesAdded) {
                 this._startParticlesAdded = true;
-                this._emitParticles(this.options.startCount);
+                await this._emitParticles(this.options.startCount);
             }
             if (this._duration !== undefined) {
                 this._currentDuration += delta.value;
@@ -254,6 +217,96 @@
                 }
             }
         }
+        _calcPosition() {
+            if (this.options.domId) {
+                const container = this.container, element = document.getElementById(this.options.domId);
+                if (element) {
+                    const elRect = element.getBoundingClientRect();
+                    return {
+                        x: (elRect.x + elRect.width / 2) * container.retina.pixelRatio,
+                        y: (elRect.y + elRect.height / 2) * container.retina.pixelRatio,
+                    };
+                }
+            }
+            return (0, engine_1.calcPositionOrRandomFromSizeRanged)({
+                size: this.container.canvas.size,
+                position: this.options.position,
+            });
+        }
+        _calcSize() {
+            const container = this.container;
+            if (this.options.domId) {
+                const element = document.getElementById(this.options.domId);
+                if (element) {
+                    const elRect = element.getBoundingClientRect();
+                    return {
+                        width: elRect.width * container.retina.pixelRatio,
+                        height: elRect.height * container.retina.pixelRatio,
+                        mode: "precise",
+                    };
+                }
+            }
+            return (this.options.size ??
+                (() => {
+                    const size = new EmitterSize_js_1.EmitterSize();
+                    size.load({
+                        height: 0,
+                        mode: "percent",
+                        width: 0,
+                    });
+                    return size;
+                })());
+        }
+        async _emit() {
+            if (this._paused) {
+                return;
+            }
+            const quantity = (0, engine_1.getRangeValue)(this.options.rate.quantity);
+            await this._emitParticles(quantity);
+        }
+        async _emitParticles(quantity) {
+            const singleParticlesOptions = (0, engine_1.itemFromSingleOrMultiple)(this._particlesOptions);
+            for (let i = 0; i < quantity; i++) {
+                const particlesOptions = (0, engine_1.deepExtend)({}, singleParticlesOptions);
+                if (this.spawnColor) {
+                    const hslAnimation = this.options.spawnColor?.animation;
+                    if (hslAnimation) {
+                        this.spawnColor.h = this._setColorAnimation(hslAnimation.h, this.spawnColor.h, 360);
+                        this.spawnColor.s = this._setColorAnimation(hslAnimation.s, this.spawnColor.s, 100);
+                        this.spawnColor.l = this._setColorAnimation(hslAnimation.l, this.spawnColor.l, 100);
+                    }
+                    setParticlesOptionsColor(particlesOptions, this.spawnColor);
+                }
+                const shapeOptions = this.options.shape;
+                let position = this.position;
+                if (this._shape) {
+                    const shapePosData = await this._shape.randomPosition();
+                    if (shapePosData) {
+                        position = shapePosData.position;
+                        const replaceData = shapeOptions.replace;
+                        if (replaceData.color && shapePosData.color) {
+                            setParticlesOptionsColor(particlesOptions, shapePosData.color);
+                        }
+                        if (replaceData.opacity) {
+                            if (particlesOptions.opacity) {
+                                particlesOptions.opacity.value = shapePosData.opacity;
+                            }
+                            else {
+                                particlesOptions.opacity = {
+                                    value: shapePosData.opacity,
+                                };
+                            }
+                        }
+                    }
+                    else {
+                        position = null;
+                    }
+                }
+                if (position) {
+                    this.container.particles.addParticle(position, particlesOptions);
+                }
+            }
+        }
     }
     exports.EmitterInstance = EmitterInstance;
 });

package/umd/EmitterShapeBase.js

@@ -0,0 +1,26 @@
+(function (factory) {
+    if (typeof module === "object" && typeof module.exports === "object") {
+        var v = factory(require, exports);
+        if (v !== undefined) module.exports = v;
+    }
+    else if (typeof define === "function" && define.amd) {
+        define(["require", "exports"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.EmitterShapeBase = void 0;
+    class EmitterShapeBase {
+        constructor(position, size, fill, options) {
+            this.position = position;
+            this.size = size;
+            this.fill = fill;
+            this.options = options;
+        }
+        resize(position, size) {
+            this.position = position;
+            this.size = size;
+        }
+    }
+    exports.EmitterShapeBase = EmitterShapeBase;
+});

package/umd/Emitters.js

@@ -29,7 +29,7 @@
             container.getEmitter = (idxOrName) => idxOrName === undefined || (0, engine_1.isNumber)(idxOrName)
                 ? this.array[idxOrName || 0]
                 : this.array.find((t) => t.name === idxOrName);
-            container.addEmitter = (options, position) => this.addEmitter(options, position);
+            container.addEmitter = async (options, position) => this.addEmitter(options, position);
             container.removeEmitter = (idxOrName) => {
                 const emitter = container.getEmitter(idxOrName);
                 if (emitter) {
@@ -49,10 +49,11 @@
                 }
             };
         }
-        addEmitter(options, position) {
+        async addEmitter(options, position) {
             const emitterOptions = new Emitter_js_1.Emitter();
             emitterOptions.load(options);
             const emitter = new EmitterInstance_js_1.EmitterInstance(this._engine, this, this.container, emitterOptions, position);
+            await emitter.init();
             this.array.push(emitter);
             return emitter;
         }
@@ -96,11 +97,11 @@
             }
             if ((0, engine_1.isArray)(this.emitters)) {
                 for (const emitterOptions of this.emitters) {
-                    this.addEmitter(emitterOptions);
+                    await this.addEmitter(emitterOptions);
                 }
             }
             else {
-                this.addEmitter(this.emitters);
+                await this.addEmitter(this.emitters);
             }
         }
         pause() {
@@ -127,9 +128,9 @@
         stop() {
             this.array = [];
         }
-        update(delta) {
+        async update(delta) {
             for (const emitter of this.array) {
-                emitter.update(delta);
+                await emitter.update(delta);
             }
         }
     }

package/umd/IRandomPositionData.js

@@ -0,0 +1,12 @@
+(function (factory) {
+    if (typeof module === "object" && typeof module.exports === "object") {
+        var v = factory(require, exports);
+        if (v !== undefined) module.exports = v;
+    }
+    else if (typeof define === "function" && define.amd) {
+        define(["require", "exports"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});

package/umd/Options/Classes/Emitter.js

@@ -4,7 +4,7 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "@tsparticles/engine", "./EmitterLife.js", "./EmitterRate.js", "./EmitterSize.js"], factory);
+        define(["require", "exports", "@tsparticles/engine", "./EmitterLife.js", "./EmitterRate.js", "./EmitterShape.js", "./EmitterSize.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -13,6 +13,7 @@
     const engine_1 = require("@tsparticles/engine");
     const EmitterLife_js_1 = require("./EmitterLife.js");
     const EmitterRate_js_1 = require("./EmitterRate.js");
+    const EmitterShape_js_1 = require("./EmitterShape.js");
     const EmitterSize_js_1 = require("./EmitterSize.js");
     class Emitter {
         constructor() {
@@ -20,7 +21,7 @@
             this.fill = true;
             this.life = new EmitterLife_js_1.EmitterLife();
             this.rate = new EmitterRate_js_1.EmitterRate();
-            this.shape = "square";
+            this.shape = new EmitterShape_js_1.EmitterShape();
             this.startCount = 0;
         }
         load(data) {
@@ -49,9 +50,7 @@
                 return (0, engine_1.deepExtend)({}, particles);
             });
             this.rate.load(data.rate);
-            if (data.shape !== undefined) {
-                this.shape = data.shape;
-            }
+            this.shape.load(data.shape);
             if (data.position !== undefined) {
                 this.position = {};
                 if (data.position.x !== undefined) {

package/umd/Options/Classes/EmitterShape.js

@@ -0,0 +1,35 @@
+(function (factory) {
+    if (typeof module === "object" && typeof module.exports === "object") {
+        var v = factory(require, exports);
+        if (v !== undefined) module.exports = v;
+    }
+    else if (typeof define === "function" && define.amd) {
+        define(["require", "exports", "@tsparticles/engine", "./EmitterShapeReplace.js"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.EmitterShape = void 0;
+    const engine_1 = require("@tsparticles/engine");
+    const EmitterShapeReplace_js_1 = require("./EmitterShapeReplace.js");
+    class EmitterShape {
+        constructor() {
+            this.options = {};
+            this.replace = new EmitterShapeReplace_js_1.EmitterShapeReplace();
+            this.type = "square";
+        }
+        load(data) {
+            if (!data) {
+                return;
+            }
+            if (data.options !== undefined) {
+                this.options = (0, engine_1.deepExtend)({}, data.options ?? {});
+            }
+            this.replace.load(data.replace);
+            if (data.type !== undefined) {
+                this.type = data.type;
+            }
+        }
+    }
+    exports.EmitterShape = EmitterShape;
+});

package/umd/Options/Classes/EmitterShapeReplace.js

@@ -0,0 +1,31 @@
+(function (factory) {
+    if (typeof module === "object" && typeof module.exports === "object") {
+        var v = factory(require, exports);
+        if (v !== undefined) module.exports = v;
+    }
+    else if (typeof define === "function" && define.amd) {
+        define(["require", "exports"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.EmitterShapeReplace = void 0;
+    class EmitterShapeReplace {
+        constructor() {
+            this.color = false;
+            this.opacity = false;
+        }
+        load(data) {
+            if (!data) {
+                return;
+            }
+            if (data.color !== undefined) {
+                this.color = data.color;
+            }
+            if (data.opacity !== undefined) {
+                this.opacity = data.opacity;
+            }
+        }
+    }
+    exports.EmitterShapeReplace = EmitterShapeReplace;
+});

package/umd/Options/Interfaces/IEmitterShape.js

@@ -0,0 +1,12 @@
+(function (factory) {
+    if (typeof module === "object" && typeof module.exports === "object") {
+        var v = factory(require, exports);
+        if (v !== undefined) module.exports = v;
+    }
+    else if (typeof define === "function" && define.amd) {
+        define(["require", "exports"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});

package/umd/Options/Interfaces/IEmitterShapeReplace.js

@@ -0,0 +1,12 @@
+(function (factory) {
+    if (typeof module === "object" && typeof module.exports === "object") {
+        var v = factory(require, exports);
+        if (v !== undefined) module.exports = v;
+    }
+    else if (typeof define === "function" && define.amd) {
+        define(["require", "exports"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});