@tsparticles/plugin-canvas-mask 3.1.0 → 3.2.1

package/262.min.js

@@ -0,0 +1,2 @@
+/*! For license information please see 262.min.js.LICENSE.txt */
+(this.webpackChunk_tsparticles_plugin_canvas_mask=this.webpackChunk_tsparticles_plugin_canvas_mask||[]).push([[262],{262:(s,i,t)=>{t.d(i,{CanvasMaskPlugin:()=>d});class e{constructor(){this.color=!0,this.opacity=!1}load(s){s&&(void 0!==s.color&&(this.color=s.color),void 0!==s.opacity&&(this.opacity=s.opacity))}}var o=t(533);class a{constructor(){this.filter=s=>s.a>0,this.offset=4}load(s){if(s){if(void 0!==s.filter)if((0,o.isString)(s.filter)){if(Object.hasOwn(window,s.filter)){const i=window[s.filter];(0,o.isFunction)(i)&&(this.filter=i)}}else this.filter=s.filter;void 0!==s.offset&&(this.offset=s.offset)}}}class n{constructor(){this.src=""}load(s){s&&void 0!==s.src&&(this.src=s.src)}}class l{constructor(){this.family="sans-serif",this.size=100}load(s){s&&(void 0!==s.family&&(this.family=s.family),void 0!==s.size&&(this.size=s.size),void 0!==s.style&&(this.style=s.style),void 0!==s.variant&&(this.variant=s.variant),void 0!==s.weight&&(this.weight=s.weight))}}class c{constructor(){this.separator="\n",this.spacing=10}load(s){s&&(void 0!==s.separator&&(this.separator=s.separator),void 0!==s.spacing&&(this.spacing=s.spacing))}}class r{constructor(){this.color="#000000",this.font=new l,this.lines=new c,this.text=""}load(s){s&&(void 0!==s.color&&(this.color=s.color),this.font.load(s.font),this.lines.load(s.lines),void 0!==s.text&&(this.text=s.text))}}class h{constructor(){this.enable=!1,this.override=new e,this.pixels=new a,this.position={x:50,y:50},this.scale=1}load(s){s&&(void 0!==s.element&&s.element instanceof HTMLCanvasElement&&(this.element=s.element),void 0!==s.enable&&(this.enable=s.enable),s.image&&(this.image||(this.image=new n),this.image.load(s.image)),this.pixels.load(s.pixels),s.position&&(this.position={x:s.position.x??this.position.x,y:s.position.y??this.position.y}),this.override.load(s.override),void 0!==s.scale&&(this.scale=s.scale),void 0!==s.selector&&(this.selector=s.selector),s.text&&(this.text||(this.text=new r),this.text.load(s.text)))}}class d{constructor(){this.id="canvasMask"}async getPlugin(s){const{CanvasMaskInstance:i}=await t.e(73).then(t.bind(t,73));return new i(s)}loadOptions(s,i){if(!this.needsPlugin(s)&&!this.needsPlugin(i))return;let t=s.canvasMask;void 0===t?.load&&(s.canvasMask=t=new h),t.load(i?.canvasMask)}needsPlugin(s){return s?.canvasMask?.enable??!1}}}}]);

package/262.min.js.LICENSE.txt

@@ -0,0 +1 @@
+/*! tsParticles Canvas Mask Plugin v3.2.1 by Matteo Bruni */

package/73.min.js

@@ -0,0 +1,2 @@
+/*! For license information please see 73.min.js.LICENSE.txt */
+(this.webpackChunk_tsparticles_plugin_canvas_mask=this.webpackChunk_tsparticles_plugin_canvas_mask||[]).push([[73],{73:(t,e,n)=>{n.d(e,{CanvasMaskInstance:()=>r});var i=n(533);const o={x:0,y:0};async function a(t,e,n,o,a,s){const{height:r,width:h}=e,l=r*h,u=function(t){const e=1,n=0;for(let o=t.length-e;o>=n;o--){const e=Math.floor((0,i.getRandom)()*o);[t[o],t[e]]=[t[e],t[o]]}return t}(c(l)),g=Math.min(l,t.actualOptions.particles.number.value),f=t.canvas.size;let x=0;const d=f.width*n.x/i.percentDenominator-h*o*.5,m=f.height*n.y/i.percentDenominator-r*o*.5;for(;x<g&&u.length;){const n=0,i=u.pop()??n,c={x:i%h,y:Math.floor(i/h)},r=e.pixels[c.y][c.x];if(!s(r))continue;const l={x:c.x*o+d,y:c.y*o+m},g={};a.color&&(g.color={value:r}),a.opacity&&(g.opacity={value:r.a}),await t.particles.addParticle(l,g),x++}}function s(t,e,n,i=!0){const a=t.getImageData(o.x,o.y,e.width,e.height).data;i&&t.clearRect(o.x,o.y,e.width,e.height);const s=[];for(let t=0;t<a.length;t+=n){const i=t/n,o={x:i%e.width,y:Math.floor(i/e.width)};s[o.y]||(s[o.y]=[]);const c={r:0,g:1,b:2,a:3},r=255;s[o.y][o.x]={r:a[t+c.r],g:a[t+c.g],b:a[t+c.b],a:a[t+c.a]/r}}return{pixels:s,width:Math.min(...s.map((t=>t.length))),height:s.length}}const c=t=>[...Array(t).keys()];class r{constructor(t){this._container=t}async init(){const t=this._container,e=t.actualOptions.canvasMask;if(!e?.enable)return;let n={pixels:[],height:0,width:0};const c=e.pixels.offset;if(e.image){const t=e.image.src;if(!t)return;n=await function(t,e){const n=new Image;n.crossOrigin="Anonymous";const a=new Promise(((t,a)=>{n.onerror=a,n.onload=()=>{const c=document.createElement("canvas");c.width=n.width,c.height=n.height;const r=c.getContext("2d");if(!r)return a(new Error(`${i.errorPrefix} Could not get canvas context`));r.drawImage(n,o.x,o.y,n.width,n.height,o.x,o.y,c.width,c.height),t(s(r,c,e))}}));return n.src=t,a}(t,c)}else if(e.text){const t=function(t,e){const n=document.createElement("canvas"),a=n.getContext("2d"),{font:c,text:r,lines:h,color:l}=t;if(!r||!a)return;const u=r.split(h.separator),g=(0,i.isNumber)(c.size)?`${c.size}px`:c.size,f=[];let x=0,d=0;for(const t of u){a.font=`${c.style??""} ${c.variant??""} ${c.weight??""} ${g} ${c.family}`;const e=a.measureText(t),n={measure:e,text:t,height:e.actualBoundingBoxAscent+e.actualBoundingBoxDescent,width:e.width};x=Math.max(x||0,n.width),d+=n.height+h.spacing,f.push(n)}n.width=x,n.height=d;let m=0;for(const t of f)a.font=`${c.style??""} ${c.variant??""} ${c.weight??""} ${g} ${c.family}`,a.fillStyle=l,a.fillText(t.text,o.x,m+t.measure.actualBoundingBoxAscent),m+=t.height+h.spacing;return s(a,n,e)}(e.text,c);if(!t)return;n=t}else if(e.element??e.selector){const t=e.element??(e.selector&&document.querySelector(e.selector));if(!t)return;const i=t.getContext("2d");if(!i)return;n=s(i,t,c)}await a(t,n,e.position,e.scale,e.override,e.pixels.filter)}}}}]);

package/73.min.js.LICENSE.txt

@@ -0,0 +1 @@
+/*! tsParticles Canvas Mask Plugin v3.2.1 by Matteo Bruni */

package/browser/CanvasMaskInstance.js

@@ -40,6 +40,6 @@ export class CanvasMaskInstance {
             }
             pixelData = getCanvasImageData(context, canvas, offset);
         }
-        addParticlesFromCanvasPixels(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
+        await addParticlesFromCanvasPixels(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
     }
 }

package/browser/CanvasMaskPlugin.js

@@ -0,0 +1,23 @@
+import { CanvasMask } from "./Options/Classes/CanvasMask.js";
+export class CanvasMaskPlugin {
+    constructor() {
+        this.id = "canvasMask";
+    }
+    async getPlugin(container) {
+        const { CanvasMaskInstance } = await import("./CanvasMaskInstance.js");
+        return new CanvasMaskInstance(container);
+    }
+    loadOptions(options, source) {
+        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
+            return;
+        }
+        let canvasMaskOptions = options.canvasMask;
+        if (canvasMaskOptions?.load === undefined) {
+            options.canvasMask = canvasMaskOptions = new CanvasMask();
+        }
+        canvasMaskOptions.load(source?.canvasMask);
+    }
+    needsPlugin(options) {
+        return options?.canvasMask?.enable ?? false;
+    }
+}

package/browser/index.js

@@ -1,26 +1,4 @@
-import { CanvasMask } from "./Options/Classes/CanvasMask.js";
-import { CanvasMaskInstance } from "./CanvasMaskInstance.js";
-class CanvasMaskPlugin {
-    constructor() {
-        this.id = "canvasMask";
-    }
-    getPlugin(container) {
-        return new CanvasMaskInstance(container);
-    }
-    loadOptions(options, source) {
-        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
-            return;
-        }
-        let canvasMaskOptions = options.canvasMask;
-        if (canvasMaskOptions?.load === undefined) {
-            options.canvasMask = canvasMaskOptions = new CanvasMask();
-        }
-        canvasMaskOptions.load(source?.canvasMask);
-    }
-    needsPlugin(options) {
-        return options?.canvasMask?.enable ?? false;
-    }
-}
 export async function loadCanvasMaskPlugin(engine, refresh = true) {
+    const { CanvasMaskPlugin } = await import("./CanvasMaskPlugin.js");
     await engine.addPlugin(new CanvasMaskPlugin(), refresh);
 }

package/browser/utils.js

@@ -3,7 +3,7 @@ const half = 0.5, origin = {
     x: 0,
     y: 0,
 }, defaultWidth = 0;
-export function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
+export async function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
     const { height, width } = data, numPixels = height * width, indexArray = shuffle(range(numPixels)), maxParticles = Math.min(numPixels, container.actualOptions.particles.number.value), canvasSize = container.canvas.size;
     let selectedPixels = 0;
     const positionOffset = {
@@ -32,7 +32,7 @@ export function addParticlesFromCanvasPixels(container, data, position, scale, o
                 value: pixel.a,
             };
         }
-        container.particles.addParticle(pos, pOptions);
+        await container.particles.addParticle(pos, pOptions);
         selectedPixels++;
     }
 }

package/cjs/CanvasMaskInstance.js

@@ -43,7 +43,7 @@ class CanvasMaskInstance {
             }
             pixelData = (0, utils_js_1.getCanvasImageData)(context, canvas, offset);
         }
-        (0, utils_js_1.addParticlesFromCanvasPixels)(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
+        await (0, utils_js_1.addParticlesFromCanvasPixels)(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
     }
 }
 exports.CanvasMaskInstance = CanvasMaskInstance;

package/cjs/CanvasMaskPlugin.js

@@ -0,0 +1,50 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CanvasMaskPlugin = void 0;
+const CanvasMask_js_1 = require("./Options/Classes/CanvasMask.js");
+class CanvasMaskPlugin {
+    constructor() {
+        this.id = "canvasMask";
+    }
+    async getPlugin(container) {
+        const { CanvasMaskInstance } = await Promise.resolve().then(() => __importStar(require("./CanvasMaskInstance.js")));
+        return new CanvasMaskInstance(container);
+    }
+    loadOptions(options, source) {
+        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
+            return;
+        }
+        let canvasMaskOptions = options.canvasMask;
+        if (canvasMaskOptions?.load === undefined) {
+            options.canvasMask = canvasMaskOptions = new CanvasMask_js_1.CanvasMask();
+        }
+        canvasMaskOptions.load(source?.canvasMask);
+    }
+    needsPlugin(options) {
+        return options?.canvasMask?.enable ?? false;
+    }
+}
+exports.CanvasMaskPlugin = CanvasMaskPlugin;

package/cjs/index.js

@@ -1,30 +1,31 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.loadCanvasMaskPlugin = void 0;
-const CanvasMask_js_1 = require("./Options/Classes/CanvasMask.js");
-const CanvasMaskInstance_js_1 = require("./CanvasMaskInstance.js");
-class CanvasMaskPlugin {
-    constructor() {
-        this.id = "canvasMask";
-    }
-    getPlugin(container) {
-        return new CanvasMaskInstance_js_1.CanvasMaskInstance(container);
-    }
-    loadOptions(options, source) {
-        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
-            return;
-        }
-        let canvasMaskOptions = options.canvasMask;
-        if (canvasMaskOptions?.load === undefined) {
-            options.canvasMask = canvasMaskOptions = new CanvasMask_js_1.CanvasMask();
-        }
-        canvasMaskOptions.load(source?.canvasMask);
-    }
-    needsPlugin(options) {
-        return options?.canvasMask?.enable ?? false;
-    }
-}
 async function loadCanvasMaskPlugin(engine, refresh = true) {
+    const { CanvasMaskPlugin } = await Promise.resolve().then(() => __importStar(require("./CanvasMaskPlugin.js")));
     await engine.addPlugin(new CanvasMaskPlugin(), refresh);
 }
 exports.loadCanvasMaskPlugin = loadCanvasMaskPlugin;

package/cjs/utils.js

@@ -6,7 +6,7 @@ const half = 0.5, origin = {
     x: 0,
     y: 0,
 }, defaultWidth = 0;
-function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
+async function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
     const { height, width } = data, numPixels = height * width, indexArray = shuffle(range(numPixels)), maxParticles = Math.min(numPixels, container.actualOptions.particles.number.value), canvasSize = container.canvas.size;
     let selectedPixels = 0;
     const positionOffset = {
@@ -35,7 +35,7 @@ function addParticlesFromCanvasPixels(container, data, position, scale, override
                 value: pixel.a,
             };
         }
-        container.particles.addParticle(pos, pOptions);
+        await container.particles.addParticle(pos, pOptions);
         selectedPixels++;
     }
 }

package/dist_browser_CanvasMaskInstance_js.js

@@ -0,0 +1,40 @@
+/*!
+ * Author : Matteo Bruni
+ * MIT license: https://opensource.org/licenses/MIT
+ * Demo / Generator : https://particles.js.org/
+ * GitHub : https://www.github.com/matteobruni/tsparticles
+ * How to use? : Check the GitHub README
+ * v3.2.1
+ */
+"use strict";
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+(this["webpackChunk_tsparticles_plugin_canvas_mask"] = this["webpackChunk_tsparticles_plugin_canvas_mask"] || []).push([["dist_browser_CanvasMaskInstance_js"],{
+
+/***/ "./dist/browser/CanvasMaskInstance.js":
+/*!********************************************!*\
+  !*** ./dist/browser/CanvasMaskInstance.js ***!
+  \********************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMaskInstance: () => (/* binding */ CanvasMaskInstance)\n/* harmony export */ });\n/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils.js */ \"./dist/browser/utils.js\");\n\nclass CanvasMaskInstance {\n  constructor(container) {\n    this._container = container;\n  }\n  async init() {\n    const container = this._container,\n      options = container.actualOptions.canvasMask;\n    if (!options?.enable) {\n      return;\n    }\n    let pixelData = {\n      pixels: [],\n      height: 0,\n      width: 0\n    };\n    const offset = options.pixels.offset;\n    if (options.image) {\n      const url = options.image.src;\n      if (!url) {\n        return;\n      }\n      pixelData = await (0,_utils_js__WEBPACK_IMPORTED_MODULE_0__.getImageData)(url, offset);\n    } else if (options.text) {\n      const textOptions = options.text;\n      const data = (0,_utils_js__WEBPACK_IMPORTED_MODULE_0__.getTextData)(textOptions, offset);\n      if (!data) {\n        return;\n      }\n      pixelData = data;\n    } else if (options.element ?? options.selector) {\n      const canvas = options.element ?? (options.selector && document.querySelector(options.selector));\n      if (!canvas) {\n        return;\n      }\n      const context = canvas.getContext(\"2d\");\n      if (!context) {\n        return;\n      }\n      pixelData = (0,_utils_js__WEBPACK_IMPORTED_MODULE_0__.getCanvasImageData)(context, canvas, offset);\n    }\n    await (0,_utils_js__WEBPACK_IMPORTED_MODULE_0__.addParticlesFromCanvasPixels)(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/CanvasMaskInstance.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/utils.js":
+/*!*******************************!*\
+  !*** ./dist/browser/utils.js ***!
+  \*******************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   addParticlesFromCanvasPixels: () => (/* binding */ addParticlesFromCanvasPixels),\n/* harmony export */   getCanvasImageData: () => (/* binding */ getCanvasImageData),\n/* harmony export */   getImageData: () => (/* binding */ getImageData),\n/* harmony export */   getTextData: () => (/* binding */ getTextData)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n\nconst half = 0.5,\n  origin = {\n    x: 0,\n    y: 0\n  },\n  defaultWidth = 0;\nasync function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {\n  const {\n      height,\n      width\n    } = data,\n    numPixels = height * width,\n    indexArray = shuffle(range(numPixels)),\n    maxParticles = Math.min(numPixels, container.actualOptions.particles.number.value),\n    canvasSize = container.canvas.size;\n  let selectedPixels = 0;\n  const positionOffset = {\n    x: canvasSize.width * position.x / _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.percentDenominator - width * scale * half,\n    y: canvasSize.height * position.y / _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.percentDenominator - height * scale * half\n  };\n  while (selectedPixels < maxParticles && indexArray.length) {\n    const defaultIndex = 0,\n      nextIndex = indexArray.pop() ?? defaultIndex,\n      pixelPos = {\n        x: nextIndex % width,\n        y: Math.floor(nextIndex / width)\n      },\n      pixel = data.pixels[pixelPos.y][pixelPos.x],\n      shouldCreateParticle = filter(pixel);\n    if (!shouldCreateParticle) {\n      continue;\n    }\n    const pos = {\n        x: pixelPos.x * scale + positionOffset.x,\n        y: pixelPos.y * scale + positionOffset.y\n      },\n      pOptions = {};\n    if (override.color) {\n      pOptions.color = {\n        value: pixel\n      };\n    }\n    if (override.opacity) {\n      pOptions.opacity = {\n        value: pixel.a\n      };\n    }\n    await container.particles.addParticle(pos, pOptions);\n    selectedPixels++;\n  }\n}\nfunction getCanvasImageData(ctx, size, offset, clear = true) {\n  const imageData = ctx.getImageData(origin.x, origin.y, size.width, size.height).data;\n  if (clear) {\n    ctx.clearRect(origin.x, origin.y, size.width, size.height);\n  }\n  const pixels = [];\n  for (let i = 0; i < imageData.length; i += offset) {\n    const idx = i / offset,\n      pos = {\n        x: idx % size.width,\n        y: Math.floor(idx / size.width)\n      };\n    if (!pixels[pos.y]) {\n      pixels[pos.y] = [];\n    }\n    const indexesOffset = {\n        r: 0,\n        g: 1,\n        b: 2,\n        a: 3\n      },\n      alphaFactor = 255;\n    pixels[pos.y][pos.x] = {\n      r: imageData[i + indexesOffset.r],\n      g: imageData[i + indexesOffset.g],\n      b: imageData[i + indexesOffset.b],\n      a: imageData[i + indexesOffset.a] / alphaFactor\n    };\n  }\n  return {\n    pixels,\n    width: Math.min(...pixels.map(row => row.length)),\n    height: pixels.length\n  };\n}\nfunction getImageData(src, offset) {\n  const image = new Image();\n  image.crossOrigin = \"Anonymous\";\n  const p = new Promise((resolve, reject) => {\n    image.onerror = reject;\n    image.onload = () => {\n      const canvas = document.createElement(\"canvas\");\n      canvas.width = image.width;\n      canvas.height = image.height;\n      const context = canvas.getContext(\"2d\");\n      if (!context) {\n        return reject(new Error(`${_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.errorPrefix} Could not get canvas context`));\n      }\n      context.drawImage(image, origin.x, origin.y, image.width, image.height, origin.x, origin.y, canvas.width, canvas.height);\n      resolve(getCanvasImageData(context, canvas, offset));\n    };\n  });\n  image.src = src;\n  return p;\n}\nfunction getTextData(textOptions, offset) {\n  const canvas = document.createElement(\"canvas\"),\n    context = canvas.getContext(\"2d\"),\n    {\n      font,\n      text,\n      lines: linesOptions,\n      color\n    } = textOptions;\n  if (!text || !context) {\n    return;\n  }\n  const lines = text.split(linesOptions.separator),\n    fontSize = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNumber)(font.size) ? `${font.size}px` : font.size,\n    linesData = [];\n  let maxWidth = 0,\n    totalHeight = 0;\n  for (const line of lines) {\n    context.font = `${font.style ?? \"\"} ${font.variant ?? \"\"} ${font.weight ?? \"\"} ${fontSize} ${font.family}`;\n    const measure = context.measureText(line),\n      lineData = {\n        measure,\n        text: line,\n        height: measure.actualBoundingBoxAscent + measure.actualBoundingBoxDescent,\n        width: measure.width\n      };\n    maxWidth = Math.max(maxWidth || defaultWidth, lineData.width);\n    totalHeight += lineData.height + linesOptions.spacing;\n    linesData.push(lineData);\n  }\n  canvas.width = maxWidth;\n  canvas.height = totalHeight;\n  let currentHeight = 0;\n  for (const line of linesData) {\n    context.font = `${font.style ?? \"\"} ${font.variant ?? \"\"} ${font.weight ?? \"\"} ${fontSize} ${font.family}`;\n    context.fillStyle = color;\n    context.fillText(line.text, origin.x, currentHeight + line.measure.actualBoundingBoxAscent);\n    currentHeight += line.height + linesOptions.spacing;\n  }\n  return getCanvasImageData(context, canvas, offset);\n}\nfunction shuffle(array) {\n  const lengthOffset = 1,\n    minIndex = 0;\n  for (let currentIndex = array.length - lengthOffset; currentIndex >= minIndex; currentIndex--) {\n    const randomIndex = Math.floor((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRandom)() * currentIndex);\n    [array[currentIndex], array[randomIndex]] = [array[randomIndex], array[currentIndex]];\n  }\n  return array;\n}\nconst range = n => [...Array(n).keys()];\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/utils.js?");
+
+/***/ })
+
+}]);

package/dist_browser_CanvasMaskPlugin_js.js

@@ -0,0 +1,100 @@
+/*!
+ * Author : Matteo Bruni
+ * MIT license: https://opensource.org/licenses/MIT
+ * Demo / Generator : https://particles.js.org/
+ * GitHub : https://www.github.com/matteobruni/tsparticles
+ * How to use? : Check the GitHub README
+ * v3.2.1
+ */
+"use strict";
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+(this["webpackChunk_tsparticles_plugin_canvas_mask"] = this["webpackChunk_tsparticles_plugin_canvas_mask"] || []).push([["dist_browser_CanvasMaskPlugin_js"],{
+
+/***/ "./dist/browser/CanvasMaskPlugin.js":
+/*!******************************************!*\
+  !*** ./dist/browser/CanvasMaskPlugin.js ***!
+  \******************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMaskPlugin: () => (/* binding */ CanvasMaskPlugin)\n/* harmony export */ });\n/* harmony import */ var _Options_Classes_CanvasMask_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Options/Classes/CanvasMask.js */ \"./dist/browser/Options/Classes/CanvasMask.js\");\n\nclass CanvasMaskPlugin {\n  constructor() {\n    this.id = \"canvasMask\";\n  }\n  async getPlugin(container) {\n    const {\n      CanvasMaskInstance\n    } = await __webpack_require__.e(/*! import() */ \"dist_browser_CanvasMaskInstance_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./CanvasMaskInstance.js */ \"./dist/browser/CanvasMaskInstance.js\"));\n    return new CanvasMaskInstance(container);\n  }\n  loadOptions(options, source) {\n    if (!this.needsPlugin(options) && !this.needsPlugin(source)) {\n      return;\n    }\n    let canvasMaskOptions = options.canvasMask;\n    if (canvasMaskOptions?.load === undefined) {\n      options.canvasMask = canvasMaskOptions = new _Options_Classes_CanvasMask_js__WEBPACK_IMPORTED_MODULE_0__.CanvasMask();\n    }\n    canvasMaskOptions.load(source?.canvasMask);\n  }\n  needsPlugin(options) {\n    return options?.canvasMask?.enable ?? false;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/CanvasMaskPlugin.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/CanvasMask.js":
+/*!****************************************************!*\
+  !*** ./dist/browser/Options/Classes/CanvasMask.js ***!
+  \****************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMask: () => (/* binding */ CanvasMask)\n/* harmony export */ });\n/* harmony import */ var _CanvasMaskOverride_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./CanvasMaskOverride.js */ \"./dist/browser/Options/Classes/CanvasMaskOverride.js\");\n/* harmony import */ var _CanvasMaskPixels_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./CanvasMaskPixels.js */ \"./dist/browser/Options/Classes/CanvasMaskPixels.js\");\n/* harmony import */ var _ImageMask_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ImageMask.js */ \"./dist/browser/Options/Classes/ImageMask.js\");\n/* harmony import */ var _TextMask_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./TextMask.js */ \"./dist/browser/Options/Classes/TextMask.js\");\n\n\n\n\nclass CanvasMask {\n  constructor() {\n    this.enable = false;\n    this.override = new _CanvasMaskOverride_js__WEBPACK_IMPORTED_MODULE_0__.CanvasMaskOverride();\n    this.pixels = new _CanvasMaskPixels_js__WEBPACK_IMPORTED_MODULE_1__.CanvasMaskPixels();\n    this.position = {\n      x: 50,\n      y: 50\n    };\n    this.scale = 1;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.element !== undefined && data.element instanceof HTMLCanvasElement) {\n      this.element = data.element;\n    }\n    if (data.enable !== undefined) {\n      this.enable = data.enable;\n    }\n    if (data.image) {\n      if (!this.image) {\n        this.image = new _ImageMask_js__WEBPACK_IMPORTED_MODULE_2__.ImageMask();\n      }\n      this.image.load(data.image);\n    }\n    this.pixels.load(data.pixels);\n    if (data.position) {\n      this.position = {\n        x: data.position.x ?? this.position.x,\n        y: data.position.y ?? this.position.y\n      };\n    }\n    this.override.load(data.override);\n    if (data.scale !== undefined) {\n      this.scale = data.scale;\n    }\n    if (data.selector !== undefined) {\n      this.selector = data.selector;\n    }\n    if (data.text) {\n      if (!this.text) {\n        this.text = new _TextMask_js__WEBPACK_IMPORTED_MODULE_3__.TextMask();\n      }\n      this.text.load(data.text);\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/CanvasMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/CanvasMaskOverride.js":
+/*!************************************************************!*\
+  !*** ./dist/browser/Options/Classes/CanvasMaskOverride.js ***!
+  \************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMaskOverride: () => (/* binding */ CanvasMaskOverride)\n/* harmony export */ });\nclass CanvasMaskOverride {\n  constructor() {\n    this.color = true;\n    this.opacity = false;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.color !== undefined) {\n      this.color = data.color;\n    }\n    if (data.opacity !== undefined) {\n      this.opacity = data.opacity;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/CanvasMaskOverride.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/CanvasMaskPixels.js":
+/*!**********************************************************!*\
+  !*** ./dist/browser/Options/Classes/CanvasMaskPixels.js ***!
+  \**********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMaskPixels: () => (/* binding */ CanvasMaskPixels)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n\nconst minAlpha = 0;\nclass CanvasMaskPixels {\n  constructor() {\n    this.filter = pixel => pixel.a > minAlpha;\n    this.offset = 4;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.filter !== undefined) {\n      if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isString)(data.filter)) {\n        if (Object.hasOwn(window, data.filter)) {\n          const filter = window[data.filter];\n          if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isFunction)(filter)) {\n            this.filter = filter;\n          }\n        }\n      } else {\n        this.filter = data.filter;\n      }\n    }\n    if (data.offset !== undefined) {\n      this.offset = data.offset;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/CanvasMaskPixels.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/FontTextMask.js":
+/*!******************************************************!*\
+  !*** ./dist/browser/Options/Classes/FontTextMask.js ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   FontTextMask: () => (/* binding */ FontTextMask)\n/* harmony export */ });\nclass FontTextMask {\n  constructor() {\n    this.family = \"sans-serif\";\n    this.size = 100;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.family !== undefined) {\n      this.family = data.family;\n    }\n    if (data.size !== undefined) {\n      this.size = data.size;\n    }\n    if (data.style !== undefined) {\n      this.style = data.style;\n    }\n    if (data.variant !== undefined) {\n      this.variant = data.variant;\n    }\n    if (data.weight !== undefined) {\n      this.weight = data.weight;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/FontTextMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/ImageMask.js":
+/*!***************************************************!*\
+  !*** ./dist/browser/Options/Classes/ImageMask.js ***!
+  \***************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ImageMask: () => (/* binding */ ImageMask)\n/* harmony export */ });\nclass ImageMask {\n  constructor() {\n    this.src = \"\";\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.src !== undefined) {\n      this.src = data.src;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/ImageMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/TextMask.js":
+/*!**************************************************!*\
+  !*** ./dist/browser/Options/Classes/TextMask.js ***!
+  \**************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TextMask: () => (/* binding */ TextMask)\n/* harmony export */ });\n/* harmony import */ var _FontTextMask_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./FontTextMask.js */ \"./dist/browser/Options/Classes/FontTextMask.js\");\n/* harmony import */ var _TextMaskLine_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./TextMaskLine.js */ \"./dist/browser/Options/Classes/TextMaskLine.js\");\n\n\nclass TextMask {\n  constructor() {\n    this.color = \"#000000\";\n    this.font = new _FontTextMask_js__WEBPACK_IMPORTED_MODULE_0__.FontTextMask();\n    this.lines = new _TextMaskLine_js__WEBPACK_IMPORTED_MODULE_1__.TextMaskLine();\n    this.text = \"\";\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.color !== undefined) {\n      this.color = data.color;\n    }\n    this.font.load(data.font);\n    this.lines.load(data.lines);\n    if (data.text !== undefined) {\n      this.text = data.text;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/TextMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/TextMaskLine.js":
+/*!******************************************************!*\
+  !*** ./dist/browser/Options/Classes/TextMaskLine.js ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TextMaskLine: () => (/* binding */ TextMaskLine)\n/* harmony export */ });\nclass TextMaskLine {\n  constructor() {\n    this.separator = \"\\n\";\n    this.spacing = 10;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.separator !== undefined) {\n      this.separator = data.separator;\n    }\n    if (data.spacing !== undefined) {\n      this.spacing = data.spacing;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/TextMaskLine.js?");
+
+/***/ })
+
+}]);

package/esm/CanvasMaskInstance.js

@@ -40,6 +40,6 @@ export class CanvasMaskInstance {
             }
             pixelData = getCanvasImageData(context, canvas, offset);
         }
-        addParticlesFromCanvasPixels(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
+        await addParticlesFromCanvasPixels(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
     }
 }

package/esm/CanvasMaskPlugin.js

@@ -0,0 +1,23 @@
+import { CanvasMask } from "./Options/Classes/CanvasMask.js";
+export class CanvasMaskPlugin {
+    constructor() {
+        this.id = "canvasMask";
+    }
+    async getPlugin(container) {
+        const { CanvasMaskInstance } = await import("./CanvasMaskInstance.js");
+        return new CanvasMaskInstance(container);
+    }
+    loadOptions(options, source) {
+        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
+            return;
+        }
+        let canvasMaskOptions = options.canvasMask;
+        if (canvasMaskOptions?.load === undefined) {
+            options.canvasMask = canvasMaskOptions = new CanvasMask();
+        }
+        canvasMaskOptions.load(source?.canvasMask);
+    }
+    needsPlugin(options) {
+        return options?.canvasMask?.enable ?? false;
+    }
+}

package/esm/index.js

@@ -1,26 +1,4 @@
-import { CanvasMask } from "./Options/Classes/CanvasMask.js";
-import { CanvasMaskInstance } from "./CanvasMaskInstance.js";
-class CanvasMaskPlugin {
-    constructor() {
-        this.id = "canvasMask";
-    }
-    getPlugin(container) {
-        return new CanvasMaskInstance(container);
-    }
-    loadOptions(options, source) {
-        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
-            return;
-        }
-        let canvasMaskOptions = options.canvasMask;
-        if (canvasMaskOptions?.load === undefined) {
-            options.canvasMask = canvasMaskOptions = new CanvasMask();
-        }
-        canvasMaskOptions.load(source?.canvasMask);
-    }
-    needsPlugin(options) {
-        return options?.canvasMask?.enable ?? false;
-    }
-}
 export async function loadCanvasMaskPlugin(engine, refresh = true) {
+    const { CanvasMaskPlugin } = await import("./CanvasMaskPlugin.js");
     await engine.addPlugin(new CanvasMaskPlugin(), refresh);
 }

package/esm/utils.js

@@ -3,7 +3,7 @@ const half = 0.5, origin = {
     x: 0,
     y: 0,
 }, defaultWidth = 0;
-export function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
+export async function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
     const { height, width } = data, numPixels = height * width, indexArray = shuffle(range(numPixels)), maxParticles = Math.min(numPixels, container.actualOptions.particles.number.value), canvasSize = container.canvas.size;
     let selectedPixels = 0;
     const positionOffset = {
@@ -32,7 +32,7 @@ export function addParticlesFromCanvasPixels(container, data, position, scale, o
                 value: pixel.a,
             };
         }
-        container.particles.addParticle(pos, pOptions);
+        await container.particles.addParticle(pos, pOptions);
         selectedPixels++;
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/plugin-canvas-mask",
-  "version": "3.1.0",
+  "version": "3.2.1",
   "description": "tsParticles canvas mask plugin",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -86,7 +86,7 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "^3.1.0"
+    "@tsparticles/engine": "^3.2.1"
   },
   "publishConfig": {
     "access": "public"

package/report.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8"/>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
-    <title>@tsparticles/plugin-canvas-mask [13 Jan 2024 at 23:02]</title>
+    <title>@tsparticles/plugin-canvas-mask [31 Jan 2024 at 09:51]</title>
     <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
 
     <script>
@@ -31,8 +31,8 @@
   <body>
     <div id="app"></div>
     <script>
-      window.chartData = [{"label":"tsparticles.plugin.canvas-mask.js","isAsset":true,"statSize":11137,"parsedSize":14991,"gzipSize":3996,"groups":[{"label":"dist/browser","path":"./dist/browser","statSize":11095,"groups":[{"id":763,"label":"index.js + 9 modules (concatenated)","path":"./dist/browser/index.js + 9 modules (concatenated)","statSize":11095,"parsedSize":14991,"gzipSize":3996,"concatenated":true,"groups":[{"label":"dist/browser","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser","statSize":11095,"groups":[{"id":null,"label":"index.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/index.js","statSize":823,"parsedSize":1111,"gzipSize":296,"inaccurateSizes":true},{"id":null,"label":"CanvasMaskInstance.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/CanvasMaskInstance.js","statSize":1327,"parsedSize":1792,"gzipSize":477,"inaccurateSizes":true},{"label":"Options/Classes","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes","statSize":3895,"groups":[{"id":null,"label":"CanvasMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/CanvasMask.js","statSize":1346,"parsedSize":1818,"gzipSize":484,"inaccurateSizes":true},{"id":null,"label":"CanvasMaskOverride.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/CanvasMaskOverride.js","statSize":314,"parsedSize":424,"gzipSize":113,"inaccurateSizes":true},{"id":null,"label":"CanvasMaskPixels.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/CanvasMaskPixels.js","statSize":659,"parsedSize":890,"gzipSize":237,"inaccurateSizes":true},{"id":null,"label":"ImageMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/ImageMask.js","statSize":190,"parsedSize":256,"gzipSize":68,"inaccurateSizes":true},{"id":null,"label":"TextMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/TextMask.js","statSize":531,"parsedSize":717,"gzipSize":191,"inaccurateSizes":true},{"id":null,"label":"FontTextMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/FontTextMask.js","statSize":534,"parsedSize":721,"gzipSize":192,"inaccurateSizes":true},{"id":null,"label":"TextMaskLine.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/TextMaskLine.js","statSize":321,"parsedSize":433,"gzipSize":115,"inaccurateSizes":true}],"parsedSize":5262,"gzipSize":1402,"inaccurateSizes":true},{"id":null,"label":"utils.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/utils.js","statSize":5050,"parsedSize":6823,"gzipSize":1818,"inaccurateSizes":true}],"parsedSize":14991,"gzipSize":3996,"inaccurateSizes":true}]}],"parsedSize":14991,"gzipSize":3996},{"label":"engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","statSize":42,"groups":[{"id":533,"label":"engine\",\"root\":\"window\"}","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles/engine\",\"root\":\"window\"}","statSize":42}],"parsedSize":0,"gzipSize":0}],"isInitialByEntrypoint":{"tsparticles.plugin.canvas-mask":true}}];
-      window.entrypoints = ["tsparticles.plugin.canvas-mask","tsparticles.plugin.canvas-mask.min"];
+      window.chartData = [];
+      window.entrypoints = ["tsparticles.plugin.canvas-mask.min"];
       window.defaultSizes = "parsed";
     </script>
   </body>