@tsparticles/preset-confetti 3.0.0-alpha.1

package/browser/options.js

@@ -0,0 +1,131 @@
+import { ConfettiOptions } from "./ConfettiOptions";
+export const loadOptions = (confettiOptions) => {
+    const actualOptions = new ConfettiOptions();
+    actualOptions.load(confettiOptions);
+    return {
+        fullScreen: {
+            enable: true,
+            zIndex: actualOptions.zIndex,
+        },
+        fpsLimit: 120,
+        particles: {
+            number: {
+                value: 0,
+            },
+            color: {
+                value: actualOptions.colors,
+            },
+            shape: {
+                type: actualOptions.shapes,
+            },
+            opacity: {
+                value: { min: 0, max: 1 },
+                animation: {
+                    enable: true,
+                    speed: 0.5,
+                    startValue: "max",
+                    destroy: "min",
+                },
+            },
+            size: {
+                value: 5 * actualOptions.scalar,
+            },
+            links: {
+                enable: false,
+            },
+            life: {
+                duration: {
+                    sync: true,
+                    value: actualOptions.ticks / 60,
+                },
+                count: 1,
+            },
+            move: {
+                angle: {
+                    value: actualOptions.spread,
+                    offset: 0,
+                },
+                drift: {
+                    min: -actualOptions.drift,
+                    max: actualOptions.drift,
+                },
+                enable: true,
+                gravity: {
+                    enable: true,
+                    acceleration: actualOptions.gravity * 9.81,
+                },
+                speed: actualOptions.startVelocity,
+                decay: 1 - actualOptions.decay,
+                direction: -actualOptions.angle,
+                random: true,
+                straight: false,
+                outModes: {
+                    default: "none",
+                    bottom: "destroy",
+                },
+            },
+            rotate: {
+                value: {
+                    min: 0,
+                    max: 360,
+                },
+                direction: "random",
+                animation: {
+                    enable: true,
+                    speed: 60,
+                },
+            },
+            tilt: {
+                direction: "random",
+                enable: true,
+                value: {
+                    min: 0,
+                    max: 360,
+                },
+                animation: {
+                    enable: true,
+                    speed: 60,
+                },
+            },
+            roll: {
+                darken: {
+                    enable: true,
+                    value: 25,
+                },
+                enable: true,
+                speed: {
+                    min: 15,
+                    max: 25,
+                },
+            },
+            wobble: {
+                distance: 30,
+                enable: true,
+                speed: {
+                    min: -15,
+                    max: 15,
+                },
+            },
+        },
+        detectRetina: true,
+        motion: {
+            disable: actualOptions.disableForReducedMotion,
+        },
+        emitters: {
+            startCount: actualOptions.count,
+            position: actualOptions.position,
+            size: {
+                width: 0,
+                height: 0,
+            },
+            rate: {
+                delay: 0,
+                quantity: 0,
+            },
+            life: {
+                duration: 0.1,
+                count: 1,
+            },
+        },
+    };
+};

package/cjs/ConfettiOptions.js

@@ -0,0 +1,104 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfettiOptions = void 0;
+class ConfettiOptions {
+    constructor() {
+        this.angle = 90;
+        this.count = 50;
+        this.spread = 45;
+        this.startVelocity = 45;
+        this.decay = 0.9;
+        this.gravity = 1;
+        this.drift = 0;
+        this.ticks = 200;
+        this.position = {
+            x: 50,
+            y: 50,
+        };
+        this.colors = ["#ffffff", "#ff0000"];
+        this.shapes = ["square", "circle"];
+        this.scalar = 1;
+        this.zIndex = 100;
+        this.disableForReducedMotion = true;
+    }
+    get origin() {
+        return {
+            x: this.position.x / 100,
+            y: this.position.y / 100,
+        };
+    }
+    set origin(value) {
+        this.position.x = value.x * 100;
+        this.position.y = value.y * 100;
+    }
+    get particleCount() {
+        return this.count;
+    }
+    set particleCount(value) {
+        this.count = value;
+    }
+    load(data) {
+        var _a, _b;
+        if (!data) {
+            return;
+        }
+        if (data.angle !== undefined) {
+            this.angle = data.angle;
+        }
+        const count = (_a = data.count) !== null && _a !== void 0 ? _a : data.particleCount;
+        if (count !== undefined) {
+            this.count = count;
+        }
+        if (data.spread !== undefined) {
+            this.spread = data.spread;
+        }
+        if (data.startVelocity !== undefined) {
+            this.startVelocity = data.startVelocity;
+        }
+        if (data.decay !== undefined) {
+            this.decay = data.decay;
+        }
+        if (data.gravity !== undefined) {
+            this.gravity = data.gravity;
+        }
+        if (data.drift !== undefined) {
+            this.drift = data.drift;
+        }
+        if (data.ticks !== undefined) {
+            this.ticks = data.ticks;
+        }
+        const position = (_b = data.position) !== null && _b !== void 0 ? _b : this.position;
+        if ((position === null || position === void 0 ? void 0 : position.x) !== undefined) {
+            this.position.x = position.x;
+        }
+        if ((position === null || position === void 0 ? void 0 : position.y) !== undefined) {
+            this.position.y = position.y;
+        }
+        if (data.colors !== undefined) {
+            if (data.colors instanceof Array) {
+                this.colors = [...data.colors];
+            }
+            else {
+                this.colors = data.colors;
+            }
+        }
+        if (data.shapes !== undefined) {
+            if (data.shapes instanceof Array) {
+                this.shapes = [...data.shapes];
+            }
+            else {
+                this.shapes = data.shapes;
+            }
+        }
+        if (data.scalar !== undefined) {
+            this.scalar = data.scalar;
+        }
+        if (data.zIndex !== undefined) {
+            this.zIndex = data.zIndex;
+        }
+        if (data.disableForReducedMotion !== undefined) {
+            this.disableForReducedMotion = data.disableForReducedMotion;
+        }
+    }
+}
+exports.ConfettiOptions = ConfettiOptions;

package/cjs/IConfettiOptions.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/cjs/bundle.js

@@ -0,0 +1,20 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tsParticles = exports.loadConfettiPreset = exports.confetti = void 0;
+const index_1 = require("./index");
+Object.defineProperty(exports, "confetti", { enumerable: true, get: function () { return index_1.confetti; } });
+Object.defineProperty(exports, "loadConfettiPreset", { enumerable: true, get: function () { return index_1.loadConfettiPreset; } });
+const engine_1 = require("@tsparticles/engine");
+Object.defineProperty(exports, "tsParticles", { enumerable: true, get: function () { return engine_1.tsParticles; } });
+(() => __awaiter(void 0, void 0, void 0, function* () {
+    yield (0, index_1.loadConfettiPreset)(engine_1.tsParticles);
+}))();

package/cjs/index.js

@@ -0,0 +1,75 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.confetti = exports.loadConfettiPreset = void 0;
+const engine_1 = require("@tsparticles/engine");
+const updater_angle_1 = require("@tsparticles/updater-angle");
+const move_base_1 = require("@tsparticles/move-base");
+const shape_circle_1 = require("@tsparticles/shape-circle");
+const updater_color_1 = require("@tsparticles/updater-color");
+const plugin_emitters_1 = require("@tsparticles/plugin-emitters");
+const updater_life_1 = require("@tsparticles/updater-life");
+const plugin_motion_1 = require("@tsparticles/plugin-motion");
+const updater_opacity_1 = require("@tsparticles/updater-opacity");
+const options_1 = require("./options");
+const updater_out_modes_1 = require("@tsparticles/updater-out-modes");
+const updater_roll_1 = require("@tsparticles/updater-roll");
+const updater_size_1 = require("@tsparticles/updater-size");
+const shape_square_1 = require("@tsparticles/shape-square");
+const updater_tilt_1 = require("@tsparticles/updater-tilt");
+const updater_wobble_1 = require("@tsparticles/updater-wobble");
+function loadPreset(engine, confettiOptions, override = false) {
+    return __awaiter(this, void 0, void 0, function* () {
+        yield (0, move_base_1.loadBaseMover)(engine);
+        yield (0, shape_circle_1.loadCircleShape)(engine);
+        yield (0, shape_square_1.loadSquareShape)(engine);
+        yield (0, updater_color_1.loadColorUpdater)(engine);
+        yield (0, updater_size_1.loadSizeUpdater)(engine);
+        yield (0, updater_opacity_1.loadOpacityUpdater)(engine);
+        yield (0, updater_out_modes_1.loadOutModesUpdater)(engine);
+        yield (0, plugin_emitters_1.loadEmittersPlugin)(engine);
+        yield (0, plugin_motion_1.loadMotionPlugin)(engine);
+        yield (0, updater_wobble_1.loadWobbleUpdater)(engine);
+        yield (0, updater_roll_1.loadRollUpdater)(engine);
+        yield (0, updater_angle_1.loadAngleUpdater)(engine);
+        yield (0, updater_tilt_1.loadTiltUpdater)(engine);
+        yield (0, updater_life_1.loadLifeUpdater)(engine);
+        yield engine.addPreset("confetti", (0, options_1.loadOptions)(confettiOptions), override);
+    });
+}
+function loadConfettiPreset(main) {
+    return __awaiter(this, void 0, void 0, function* () {
+        yield loadPreset(main, {}, true);
+    });
+}
+exports.loadConfettiPreset = loadConfettiPreset;
+function confetti(idOrOptions, confettiOptions) {
+    return __awaiter(this, void 0, void 0, function* () {
+        let options;
+        let id;
+        if (typeof idOrOptions === "string") {
+            id = idOrOptions;
+            options = confettiOptions !== null && confettiOptions !== void 0 ? confettiOptions : {};
+        }
+        else {
+            id = `tsparticles_${Math.floor((0, engine_1.getRandom)() * 1000)}`;
+            options = idOrOptions;
+        }
+        yield loadPreset(engine_1.tsParticles, options, true);
+        yield engine_1.tsParticles.load({
+            id,
+            options: {
+                preset: "confetti",
+            },
+        });
+    });
+}
+exports.confetti = confetti;

package/cjs/options.js

@@ -0,0 +1,135 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loadOptions = void 0;
+const ConfettiOptions_1 = require("./ConfettiOptions");
+const loadOptions = (confettiOptions) => {
+    const actualOptions = new ConfettiOptions_1.ConfettiOptions();
+    actualOptions.load(confettiOptions);
+    return {
+        fullScreen: {
+            enable: true,
+            zIndex: actualOptions.zIndex,
+        },
+        fpsLimit: 120,
+        particles: {
+            number: {
+                value: 0,
+            },
+            color: {
+                value: actualOptions.colors,
+            },
+            shape: {
+                type: actualOptions.shapes,
+            },
+            opacity: {
+                value: { min: 0, max: 1 },
+                animation: {
+                    enable: true,
+                    speed: 0.5,
+                    startValue: "max",
+                    destroy: "min",
+                },
+            },
+            size: {
+                value: 5 * actualOptions.scalar,
+            },
+            links: {
+                enable: false,
+            },
+            life: {
+                duration: {
+                    sync: true,
+                    value: actualOptions.ticks / 60,
+                },
+                count: 1,
+            },
+            move: {
+                angle: {
+                    value: actualOptions.spread,
+                    offset: 0,
+                },
+                drift: {
+                    min: -actualOptions.drift,
+                    max: actualOptions.drift,
+                },
+                enable: true,
+                gravity: {
+                    enable: true,
+                    acceleration: actualOptions.gravity * 9.81,
+                },
+                speed: actualOptions.startVelocity,
+                decay: 1 - actualOptions.decay,
+                direction: -actualOptions.angle,
+                random: true,
+                straight: false,
+                outModes: {
+                    default: "none",
+                    bottom: "destroy",
+                },
+            },
+            rotate: {
+                value: {
+                    min: 0,
+                    max: 360,
+                },
+                direction: "random",
+                animation: {
+                    enable: true,
+                    speed: 60,
+                },
+            },
+            tilt: {
+                direction: "random",
+                enable: true,
+                value: {
+                    min: 0,
+                    max: 360,
+                },
+                animation: {
+                    enable: true,
+                    speed: 60,
+                },
+            },
+            roll: {
+                darken: {
+                    enable: true,
+                    value: 25,
+                },
+                enable: true,
+                speed: {
+                    min: 15,
+                    max: 25,
+                },
+            },
+            wobble: {
+                distance: 30,
+                enable: true,
+                speed: {
+                    min: -15,
+                    max: 15,
+                },
+            },
+        },
+        detectRetina: true,
+        motion: {
+            disable: actualOptions.disableForReducedMotion,
+        },
+        emitters: {
+            startCount: actualOptions.count,
+            position: actualOptions.position,
+            size: {
+                width: 0,
+                height: 0,
+            },
+            rate: {
+                delay: 0,
+                quantity: 0,
+            },
+            life: {
+                duration: 0.1,
+                count: 1,
+            },
+        },
+    };
+};
+exports.loadOptions = loadOptions;

package/esm/ConfettiOptions.js

@@ -0,0 +1,100 @@
+export class ConfettiOptions {
+    constructor() {
+        this.angle = 90;
+        this.count = 50;
+        this.spread = 45;
+        this.startVelocity = 45;
+        this.decay = 0.9;
+        this.gravity = 1;
+        this.drift = 0;
+        this.ticks = 200;
+        this.position = {
+            x: 50,
+            y: 50,
+        };
+        this.colors = ["#ffffff", "#ff0000"];
+        this.shapes = ["square", "circle"];
+        this.scalar = 1;
+        this.zIndex = 100;
+        this.disableForReducedMotion = true;
+    }
+    get origin() {
+        return {
+            x: this.position.x / 100,
+            y: this.position.y / 100,
+        };
+    }
+    set origin(value) {
+        this.position.x = value.x * 100;
+        this.position.y = value.y * 100;
+    }
+    get particleCount() {
+        return this.count;
+    }
+    set particleCount(value) {
+        this.count = value;
+    }
+    load(data) {
+        var _a, _b;
+        if (!data) {
+            return;
+        }
+        if (data.angle !== undefined) {
+            this.angle = data.angle;
+        }
+        const count = (_a = data.count) !== null && _a !== void 0 ? _a : data.particleCount;
+        if (count !== undefined) {
+            this.count = count;
+        }
+        if (data.spread !== undefined) {
+            this.spread = data.spread;
+        }
+        if (data.startVelocity !== undefined) {
+            this.startVelocity = data.startVelocity;
+        }
+        if (data.decay !== undefined) {
+            this.decay = data.decay;
+        }
+        if (data.gravity !== undefined) {
+            this.gravity = data.gravity;
+        }
+        if (data.drift !== undefined) {
+            this.drift = data.drift;
+        }
+        if (data.ticks !== undefined) {
+            this.ticks = data.ticks;
+        }
+        const position = (_b = data.position) !== null && _b !== void 0 ? _b : this.position;
+        if ((position === null || position === void 0 ? void 0 : position.x) !== undefined) {
+            this.position.x = position.x;
+        }
+        if ((position === null || position === void 0 ? void 0 : position.y) !== undefined) {
+            this.position.y = position.y;
+        }
+        if (data.colors !== undefined) {
+            if (data.colors instanceof Array) {
+                this.colors = [...data.colors];
+            }
+            else {
+                this.colors = data.colors;
+            }
+        }
+        if (data.shapes !== undefined) {
+            if (data.shapes instanceof Array) {
+                this.shapes = [...data.shapes];
+            }
+            else {
+                this.shapes = data.shapes;
+            }
+        }
+        if (data.scalar !== undefined) {
+            this.scalar = data.scalar;
+        }
+        if (data.zIndex !== undefined) {
+            this.zIndex = data.zIndex;
+        }
+        if (data.disableForReducedMotion !== undefined) {
+            this.disableForReducedMotion = data.disableForReducedMotion;
+        }
+    }
+}

package/esm/IConfettiOptions.js

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

package/esm/bundle.js

@@ -0,0 +1,6 @@
+import { confetti, loadConfettiPreset } from "./index";
+import { tsParticles } from "@tsparticles/engine";
+(async () => {
+    await loadConfettiPreset(tsParticles);
+})();
+export { confetti, loadConfettiPreset, tsParticles };

package/esm/index.js

@@ -0,0 +1,55 @@
+import { getRandom, tsParticles } from "@tsparticles/engine";
+import { loadAngleUpdater } from "@tsparticles/updater-angle";
+import { loadBaseMover } from "@tsparticles/move-base";
+import { loadCircleShape } from "@tsparticles/shape-circle";
+import { loadColorUpdater } from "@tsparticles/updater-color";
+import { loadEmittersPlugin } from "@tsparticles/plugin-emitters";
+import { loadLifeUpdater } from "@tsparticles/updater-life";
+import { loadMotionPlugin } from "@tsparticles/plugin-motion";
+import { loadOpacityUpdater } from "@tsparticles/updater-opacity";
+import { loadOptions } from "./options";
+import { loadOutModesUpdater } from "@tsparticles/updater-out-modes";
+import { loadRollUpdater } from "@tsparticles/updater-roll";
+import { loadSizeUpdater } from "@tsparticles/updater-size";
+import { loadSquareShape } from "@tsparticles/shape-square";
+import { loadTiltUpdater } from "@tsparticles/updater-tilt";
+import { loadWobbleUpdater } from "@tsparticles/updater-wobble";
+async function loadPreset(engine, confettiOptions, override = false) {
+    await loadBaseMover(engine);
+    await loadCircleShape(engine);
+    await loadSquareShape(engine);
+    await loadColorUpdater(engine);
+    await loadSizeUpdater(engine);
+    await loadOpacityUpdater(engine);
+    await loadOutModesUpdater(engine);
+    await loadEmittersPlugin(engine);
+    await loadMotionPlugin(engine);
+    await loadWobbleUpdater(engine);
+    await loadRollUpdater(engine);
+    await loadAngleUpdater(engine);
+    await loadTiltUpdater(engine);
+    await loadLifeUpdater(engine);
+    await engine.addPreset("confetti", loadOptions(confettiOptions), override);
+}
+export async function loadConfettiPreset(main) {
+    await loadPreset(main, {}, true);
+}
+export async function confetti(idOrOptions, confettiOptions) {
+    let options;
+    let id;
+    if (typeof idOrOptions === "string") {
+        id = idOrOptions;
+        options = confettiOptions !== null && confettiOptions !== void 0 ? confettiOptions : {};
+    }
+    else {
+        id = `tsparticles_${Math.floor(getRandom() * 1000)}`;
+        options = idOrOptions;
+    }
+    await loadPreset(tsParticles, options, true);
+    await tsParticles.load({
+        id,
+        options: {
+            preset: "confetti",
+        },
+    });
+}