@tsparticles/shape-emoji 3.9.1 → 4.0.0-alpha.0

package/508.min.js

@@ -0,0 +1,2 @@
+/*! For license information please see 508.min.js.LICENSE.txt */
+(this.webpackChunk_tsparticles_shape_emoji=this.webpackChunk_tsparticles_shape_emoji||[]).push([[508],{508(e,t,i){i.d(t,{EmojiDrawer:()=>n});var a=i(303);const o='"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"';class n{constructor(){this.validTypes=["emoji"],this._emojiShapeDict=new Map}destroy(){for(const[e,t]of this._emojiShapeDict)t instanceof ImageBitmap&&t.close(),this._emojiShapeDict.delete(e)}draw(e){const t=e.particle.emojiDataKey;if(!t)return;const i=this._emojiShapeDict.get(t);i&&function(e,t){const{context:i,opacity:a}=e,o=i.globalAlpha,n=t.width,s=.5*n;i.globalAlpha=a,i.drawImage(t,-s,-s,n,n),i.globalAlpha=o}(e,i)}async init(e){const t=e.actualOptions,{validTypes:i}=this;if(!i.find((e=>(0,a.isInArray)(e,t.particles.shape.type))))return;const n=[(0,a.loadFont)(o)],s=i.map((e=>t.particles.shape.options[e]))[0];(0,a.executeOnSingleOrMultiple)(s,(e=>{e.font&&n.push((0,a.loadFont)(e.font))})),await Promise.all(n)}particleDestroy(e){e.emojiDataKey=void 0}particleInit(e,t){const i=t.shapeData;if(!i.value)return;const n=(0,a.itemFromSingleOrMultiple)(i.value,t.randomIndexData);if(!n)return;const s="string"==typeof n?{font:i.font??o,padding:i.padding??0,value:n}:{font:o,padding:0,...i,...n},l=s.font,r=s.value,c=`${r}_${l}`;if(this._emojiShapeDict.has(c))return void(t.emojiDataKey=c);const p=2*s.padding,h=(0,a.getRangeMax)(t.size.value),m=h+p,d=2*m;let f;if("undefined"!=typeof OffscreenCanvas){const e=new OffscreenCanvas(d,d),t=e.getContext("2d");if(!t)return;t.font=`400 ${(2*h).toString()}px ${l}`,t.textBaseline="middle",t.textAlign="center",t.fillText(r,m,m),f=e.transferToImageBitmap()}else{const e=(0,a.safeDocument)().createElement("canvas");e.width=d,e.height=d;const t=e.getContext("2d");if(!t)return;t.font=`400 ${(2*h).toString()}px ${l}`,t.textBaseline="middle",t.textAlign="center",t.fillText(r,m,m),f=e}this._emojiShapeDict.set(c,f),t.emojiDataKey=c}}}}]);

package/508.min.js.LICENSE.txt

@@ -0,0 +1 @@
+/*! tsParticles Emoji Shape v4.0.0-alpha.0 by Matteo Bruni */

package/browser/EmojiDrawer.js

@@ -1,6 +1,6 @@
-import { executeOnSingleOrMultiple, getRangeMax, isInArray, itemFromSingleOrMultiple, loadFont, } from "@tsparticles/engine";
+import { executeOnSingleOrMultiple, getRangeMax, isInArray, itemFromSingleOrMultiple, loadFont, safeDocument, } from "@tsparticles/engine";
 import { drawEmoji } from "./Utils.js";
-const defaultFont = '"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"', noPadding = 0;
+const defaultFont = '"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"', noPadding = 0, firstItem = 0;
 export class EmojiDrawer {
     constructor() {
         this.validTypes = ["emoji"];
@@ -9,7 +9,7 @@ export class EmojiDrawer {
     destroy() {
         for (const [key, data] of this._emojiShapeDict) {
             if (data instanceof ImageBitmap) {
-                data?.close();
+                data.close();
             }
             this._emojiShapeDict.delete(key);
         }
@@ -30,16 +30,12 @@ export class EmojiDrawer {
         if (!validTypes.find(t => isInArray(t, options.particles.shape.type))) {
             return;
         }
-        const promises = [loadFont(defaultFont)], shapeOptions = validTypes
-            .map(t => options.particles.shape.options[t])
-            .find(t => !!t);
-        if (shapeOptions) {
-            executeOnSingleOrMultiple(shapeOptions, shape => {
-                if (shape.font) {
-                    promises.push(loadFont(shape.font));
-                }
-            });
-        }
+        const promises = [loadFont(defaultFont)], shapeOptions = validTypes.map(t => options.particles.shape.options[t])[firstItem];
+        executeOnSingleOrMultiple(shapeOptions, shape => {
+            if (shape.font) {
+                promises.push(loadFont(shape.font));
+            }
+        });
         await Promise.all(promises);
     }
     particleDestroy(particle) {
@@ -47,7 +43,7 @@ export class EmojiDrawer {
     }
     particleInit(_container, particle) {
         const double = 2, shapeData = particle.shapeData;
-        if (!shapeData?.value) {
+        if (!shapeData.value) {
             return;
         }
         const emoji = itemFromSingleOrMultiple(shapeData.value, particle.randomIndexData);
@@ -78,21 +74,21 @@ export class EmojiDrawer {
             if (!context) {
                 return;
             }
-            context.font = `400 ${maxSize * double}px ${font}`;
+            context.font = `400 ${(maxSize * double).toString()}px ${font}`;
             context.textBaseline = "middle";
             context.textAlign = "center";
             context.fillText(value, fullSize, fullSize);
             image = canvas.transferToImageBitmap();
         }
         else {
-            const canvas = document.createElement("canvas");
+            const canvas = safeDocument().createElement("canvas");
             canvas.width = canvasSize;
             canvas.height = canvasSize;
             const context = canvas.getContext("2d");
             if (!context) {
                 return;
             }
-            context.font = `400 ${maxSize * double}px ${font}`;
+            context.font = `400 ${(maxSize * double).toString()}px ${font}`;
             context.textBaseline = "middle";
             context.textAlign = "center";
             context.fillText(value, fullSize, fullSize);

package/browser/Utils.js

@@ -1,9 +1,5 @@
 export function drawEmoji(data, image) {
-    const { context, opacity } = data, half = 0.5, previousAlpha = context.globalAlpha;
-    if (!image) {
-        return;
-    }
-    const diameter = image.width, radius = diameter * half;
+    const { context, opacity } = data, half = 0.5, previousAlpha = context.globalAlpha, diameter = image.width, radius = diameter * half;
     context.globalAlpha = opacity;
     context.drawImage(image, -radius, -radius, diameter, diameter);
     context.globalAlpha = previousAlpha;

package/browser/index.js

@@ -1,5 +1,7 @@
-import { EmojiDrawer } from "./EmojiDrawer.js";
-export async function loadEmojiShape(engine, refresh = true) {
-    engine.checkVersion("3.9.1");
-    await engine.addShape(new EmojiDrawer(), refresh);
+export function loadEmojiShape(engine) {
+    engine.checkVersion("4.0.0-alpha.0");
+    engine.register(async (e) => {
+        const { EmojiDrawer } = await import("./EmojiDrawer.js");
+        e.addShape(new EmojiDrawer());
+    });
 }

package/cjs/EmojiDrawer.js

@@ -1,10 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.EmojiDrawer = void 0;
-const engine_1 = require("@tsparticles/engine");
-const Utils_js_1 = require("./Utils.js");
-const defaultFont = '"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"', noPadding = 0;
-class EmojiDrawer {
+import { executeOnSingleOrMultiple, getRangeMax, isInArray, itemFromSingleOrMultiple, loadFont, safeDocument, } from "@tsparticles/engine";
+import { drawEmoji } from "./Utils.js";
+const defaultFont = '"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"', noPadding = 0, firstItem = 0;
+export class EmojiDrawer {
     constructor() {
         this.validTypes = ["emoji"];
         this._emojiShapeDict = new Map();
@@ -12,7 +9,7 @@ class EmojiDrawer {
     destroy() {
         for (const [key, data] of this._emojiShapeDict) {
             if (data instanceof ImageBitmap) {
-                data?.close();
+                data.close();
             }
             this._emojiShapeDict.delete(key);
         }
@@ -26,23 +23,19 @@ class EmojiDrawer {
         if (!image) {
             return;
         }
-        (0, Utils_js_1.drawEmoji)(data, image);
+        drawEmoji(data, image);
     }
     async init(container) {
         const options = container.actualOptions, { validTypes } = this;
-        if (!validTypes.find(t => (0, engine_1.isInArray)(t, options.particles.shape.type))) {
+        if (!validTypes.find(t => isInArray(t, options.particles.shape.type))) {
             return;
         }
-        const promises = [(0, engine_1.loadFont)(defaultFont)], shapeOptions = validTypes
-            .map(t => options.particles.shape.options[t])
-            .find(t => !!t);
-        if (shapeOptions) {
-            (0, engine_1.executeOnSingleOrMultiple)(shapeOptions, shape => {
-                if (shape.font) {
-                    promises.push((0, engine_1.loadFont)(shape.font));
-                }
-            });
-        }
+        const promises = [loadFont(defaultFont)], shapeOptions = validTypes.map(t => options.particles.shape.options[t])[firstItem];
+        executeOnSingleOrMultiple(shapeOptions, shape => {
+            if (shape.font) {
+                promises.push(loadFont(shape.font));
+            }
+        });
         await Promise.all(promises);
     }
     particleDestroy(particle) {
@@ -50,10 +43,10 @@ class EmojiDrawer {
     }
     particleInit(_container, particle) {
         const double = 2, shapeData = particle.shapeData;
-        if (!shapeData?.value) {
+        if (!shapeData.value) {
             return;
         }
-        const emoji = (0, engine_1.itemFromSingleOrMultiple)(shapeData.value, particle.randomIndexData);
+        const emoji = itemFromSingleOrMultiple(shapeData.value, particle.randomIndexData);
         if (!emoji) {
             return;
         }
@@ -74,28 +67,28 @@ class EmojiDrawer {
             particle.emojiDataKey = key;
             return;
         }
-        const padding = emojiOptions.padding * double, maxSize = (0, engine_1.getRangeMax)(particle.size.value), fullSize = maxSize + padding, canvasSize = fullSize * double;
+        const padding = emojiOptions.padding * double, maxSize = getRangeMax(particle.size.value), fullSize = maxSize + padding, canvasSize = fullSize * double;
         let image;
         if (typeof OffscreenCanvas !== "undefined") {
             const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d");
             if (!context) {
                 return;
             }
-            context.font = `400 ${maxSize * double}px ${font}`;
+            context.font = `400 ${(maxSize * double).toString()}px ${font}`;
             context.textBaseline = "middle";
             context.textAlign = "center";
             context.fillText(value, fullSize, fullSize);
             image = canvas.transferToImageBitmap();
         }
         else {
-            const canvas = document.createElement("canvas");
+            const canvas = safeDocument().createElement("canvas");
             canvas.width = canvasSize;
             canvas.height = canvasSize;
             const context = canvas.getContext("2d");
             if (!context) {
                 return;
             }
-            context.font = `400 ${maxSize * double}px ${font}`;
+            context.font = `400 ${(maxSize * double).toString()}px ${font}`;
             context.textBaseline = "middle";
             context.textAlign = "center";
             context.fillText(value, fullSize, fullSize);
@@ -105,4 +98,3 @@ class EmojiDrawer {
         particle.emojiDataKey = key;
     }
 }
-exports.EmojiDrawer = EmojiDrawer;

package/cjs/EmojiParticle.js

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

package/cjs/IEmojiShape.js

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

package/cjs/Utils.js

@@ -1,12 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.drawEmoji = drawEmoji;
-function drawEmoji(data, image) {
-    const { context, opacity } = data, half = 0.5, previousAlpha = context.globalAlpha;
-    if (!image) {
-        return;
-    }
-    const diameter = image.width, radius = diameter * half;
+export function drawEmoji(data, image) {
+    const { context, opacity } = data, half = 0.5, previousAlpha = context.globalAlpha, diameter = image.width, radius = diameter * half;
     context.globalAlpha = opacity;
     context.drawImage(image, -radius, -radius, diameter, diameter);
     context.globalAlpha = previousAlpha;

package/cjs/index.js

@@ -1,8 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.loadEmojiShape = loadEmojiShape;
-const EmojiDrawer_js_1 = require("./EmojiDrawer.js");
-async function loadEmojiShape(engine, refresh = true) {
-    engine.checkVersion("3.9.1");
-    await engine.addShape(new EmojiDrawer_js_1.EmojiDrawer(), refresh);
+export function loadEmojiShape(engine) {
+    engine.checkVersion("4.0.0-alpha.0");
+    engine.register(async (e) => {
+        const { EmojiDrawer } = await import("./EmojiDrawer.js");
+        e.addShape(new EmojiDrawer());
+    });
 }

package/dist_browser_EmojiDrawer_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
+ * v4.0.0-alpha.0
+ */
+"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_shape_emoji"] = this["webpackChunk_tsparticles_shape_emoji"] || []).push([["dist_browser_EmojiDrawer_js"],{
+
+/***/ "./dist/browser/EmojiDrawer.js"
+/*!*************************************!*\
+  !*** ./dist/browser/EmojiDrawer.js ***!
+  \*************************************/
+(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   EmojiDrawer: () => (/* binding */ EmojiDrawer)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n\n\nconst defaultFont = '\"Twemoji Mozilla\", Apple Color Emoji, \"Segoe UI Emoji\", \"Noto Color Emoji\", \"EmojiOne Color\"',\n  noPadding = 0,\n  firstItem = 0;\nclass EmojiDrawer {\n  constructor() {\n    this.validTypes = [\"emoji\"];\n    this._emojiShapeDict = new Map();\n  }\n  destroy() {\n    for (const [key, data] of this._emojiShapeDict) {\n      if (data instanceof ImageBitmap) {\n        data.close();\n      }\n      this._emojiShapeDict.delete(key);\n    }\n  }\n  draw(data) {\n    const key = data.particle.emojiDataKey;\n    if (!key) {\n      return;\n    }\n    const image = this._emojiShapeDict.get(key);\n    if (!image) {\n      return;\n    }\n    (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawEmoji)(data, image);\n  }\n  async init(container) {\n    const options = container.actualOptions,\n      {\n        validTypes\n      } = this;\n    if (!validTypes.find(t => (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isInArray)(t, options.particles.shape.type))) {\n      return;\n    }\n    const promises = [(0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.loadFont)(defaultFont)],\n      shapeOptions = validTypes.map(t => options.particles.shape.options[t])[firstItem];\n    (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.executeOnSingleOrMultiple)(shapeOptions, shape => {\n      if (shape.font) {\n        promises.push((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.loadFont)(shape.font));\n      }\n    });\n    await Promise.all(promises);\n  }\n  particleDestroy(particle) {\n    particle.emojiDataKey = undefined;\n  }\n  particleInit(_container, particle) {\n    const double = 2,\n      shapeData = particle.shapeData;\n    if (!shapeData.value) {\n      return;\n    }\n    const emoji = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.itemFromSingleOrMultiple)(shapeData.value, particle.randomIndexData);\n    if (!emoji) {\n      return;\n    }\n    const emojiOptions = typeof emoji === \"string\" ? {\n        font: shapeData.font ?? defaultFont,\n        padding: shapeData.padding ?? noPadding,\n        value: emoji\n      } : {\n        font: defaultFont,\n        padding: noPadding,\n        ...shapeData,\n        ...emoji\n      },\n      font = emojiOptions.font,\n      value = emojiOptions.value;\n    const key = `${value}_${font}`;\n    if (this._emojiShapeDict.has(key)) {\n      particle.emojiDataKey = key;\n      return;\n    }\n    const padding = emojiOptions.padding * double,\n      maxSize = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeMax)(particle.size.value),\n      fullSize = maxSize + padding,\n      canvasSize = fullSize * double;\n    let image;\n    if (typeof OffscreenCanvas !== \"undefined\") {\n      const canvas = new OffscreenCanvas(canvasSize, canvasSize),\n        context = canvas.getContext(\"2d\");\n      if (!context) {\n        return;\n      }\n      context.font = `400 ${(maxSize * double).toString()}px ${font}`;\n      context.textBaseline = \"middle\";\n      context.textAlign = \"center\";\n      context.fillText(value, fullSize, fullSize);\n      image = canvas.transferToImageBitmap();\n    } else {\n      const canvas = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.safeDocument)().createElement(\"canvas\");\n      canvas.width = canvasSize;\n      canvas.height = canvasSize;\n      const context = canvas.getContext(\"2d\");\n      if (!context) {\n        return;\n      }\n      context.font = `400 ${(maxSize * double).toString()}px ${font}`;\n      context.textBaseline = \"middle\";\n      context.textAlign = \"center\";\n      context.fillText(value, fullSize, fullSize);\n      image = canvas;\n    }\n    this._emojiShapeDict.set(key, image);\n    particle.emojiDataKey = key;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/shape-emoji/./dist/browser/EmojiDrawer.js?\n}");
+
+/***/ },
+
+/***/ "./dist/browser/Utils.js"
+/*!*******************************!*\
+  !*** ./dist/browser/Utils.js ***!
+  \*******************************/
+(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
+
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   drawEmoji: () => (/* binding */ drawEmoji)\n/* harmony export */ });\nfunction drawEmoji(data, image) {\n  const {\n      context,\n      opacity\n    } = data,\n    half = 0.5,\n    previousAlpha = context.globalAlpha,\n    diameter = image.width,\n    radius = diameter * half;\n  context.globalAlpha = opacity;\n  context.drawImage(image, -radius, -radius, diameter, diameter);\n  context.globalAlpha = previousAlpha;\n}\n\n//# sourceURL=webpack://@tsparticles/shape-emoji/./dist/browser/Utils.js?\n}");
+
+/***/ }
+
+}]);

package/esm/EmojiDrawer.js

@@ -1,6 +1,6 @@
-import { executeOnSingleOrMultiple, getRangeMax, isInArray, itemFromSingleOrMultiple, loadFont, } from "@tsparticles/engine";
+import { executeOnSingleOrMultiple, getRangeMax, isInArray, itemFromSingleOrMultiple, loadFont, safeDocument, } from "@tsparticles/engine";
 import { drawEmoji } from "./Utils.js";
-const defaultFont = '"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"', noPadding = 0;
+const defaultFont = '"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"', noPadding = 0, firstItem = 0;
 export class EmojiDrawer {
     constructor() {
         this.validTypes = ["emoji"];
@@ -9,7 +9,7 @@ export class EmojiDrawer {
     destroy() {
         for (const [key, data] of this._emojiShapeDict) {
             if (data instanceof ImageBitmap) {
-                data?.close();
+                data.close();
             }
             this._emojiShapeDict.delete(key);
         }
@@ -30,16 +30,12 @@ export class EmojiDrawer {
         if (!validTypes.find(t => isInArray(t, options.particles.shape.type))) {
             return;
         }
-        const promises = [loadFont(defaultFont)], shapeOptions = validTypes
-            .map(t => options.particles.shape.options[t])
-            .find(t => !!t);
-        if (shapeOptions) {
-            executeOnSingleOrMultiple(shapeOptions, shape => {
-                if (shape.font) {
-                    promises.push(loadFont(shape.font));
-                }
-            });
-        }
+        const promises = [loadFont(defaultFont)], shapeOptions = validTypes.map(t => options.particles.shape.options[t])[firstItem];
+        executeOnSingleOrMultiple(shapeOptions, shape => {
+            if (shape.font) {
+                promises.push(loadFont(shape.font));
+            }
+        });
         await Promise.all(promises);
     }
     particleDestroy(particle) {
@@ -47,7 +43,7 @@ export class EmojiDrawer {
     }
     particleInit(_container, particle) {
         const double = 2, shapeData = particle.shapeData;
-        if (!shapeData?.value) {
+        if (!shapeData.value) {
             return;
         }
         const emoji = itemFromSingleOrMultiple(shapeData.value, particle.randomIndexData);
@@ -78,21 +74,21 @@ export class EmojiDrawer {
             if (!context) {
                 return;
             }
-            context.font = `400 ${maxSize * double}px ${font}`;
+            context.font = `400 ${(maxSize * double).toString()}px ${font}`;
             context.textBaseline = "middle";
             context.textAlign = "center";
             context.fillText(value, fullSize, fullSize);
             image = canvas.transferToImageBitmap();
         }
         else {
-            const canvas = document.createElement("canvas");
+            const canvas = safeDocument().createElement("canvas");
             canvas.width = canvasSize;
             canvas.height = canvasSize;
             const context = canvas.getContext("2d");
             if (!context) {
                 return;
             }
-            context.font = `400 ${maxSize * double}px ${font}`;
+            context.font = `400 ${(maxSize * double).toString()}px ${font}`;
             context.textBaseline = "middle";
             context.textAlign = "center";
             context.fillText(value, fullSize, fullSize);

package/esm/Utils.js

@@ -1,9 +1,5 @@
 export function drawEmoji(data, image) {
-    const { context, opacity } = data, half = 0.5, previousAlpha = context.globalAlpha;
-    if (!image) {
-        return;
-    }
-    const diameter = image.width, radius = diameter * half;
+    const { context, opacity } = data, half = 0.5, previousAlpha = context.globalAlpha, diameter = image.width, radius = diameter * half;
     context.globalAlpha = opacity;
     context.drawImage(image, -radius, -radius, diameter, diameter);
     context.globalAlpha = previousAlpha;

package/esm/index.js

@@ -1,5 +1,7 @@
-import { EmojiDrawer } from "./EmojiDrawer.js";
-export async function loadEmojiShape(engine, refresh = true) {
-    engine.checkVersion("3.9.1");
-    await engine.addShape(new EmojiDrawer(), refresh);
+export function loadEmojiShape(engine) {
+    engine.checkVersion("4.0.0-alpha.0");
+    engine.register(async (e) => {
+        const { EmojiDrawer } = await import("./EmojiDrawer.js");
+        e.addShape(new EmojiDrawer());
+    });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/shape-emoji",
-  "version": "3.9.1",
+  "version": "4.0.0-alpha.0",
   "description": "tsParticles emoji shape",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -59,9 +59,10 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "3.9.1"
+    "@tsparticles/engine": "4.0.0-alpha.0"
   },
   "publishConfig": {
     "access": "public"
-  }
+  },
+  "type": "module"
 }