@tsparticles/shape-image 3.0.3 → 3.2.0

package/tsparticles.shape.image.min.js

@@ -1,2 +1,2 @@
 /*! For license information please see tsparticles.shape.image.min.js.LICENSE.txt */
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var a="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var o in a)("object"==typeof exports?exports:e)[o]=a[o]}}(this,(e=>(()=>{"use strict";var t={533:t=>{t.exports=e}},a={};function o(e){var i=a[e];if(void 0!==i)return i.exports;var r=a[e]={exports:{}};return t[e](r,r.exports,o),r.exports}o.d=(e,t)=>{for(var a in t)o.o(t,a)&&!o.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};return(()=>{o.r(i),o.d(i,{loadImageShape:()=>u});var e=o(533);const t=[0,4,2,1],a=[8,8,4,2];class r{constructor(e){this.pos=0,this.data=new Uint8ClampedArray(e)}getString(e){const t=this.data.slice(this.pos,this.pos+e);return this.pos+=t.length,t.reduce(((e,t)=>e+String.fromCharCode(t)),"")}nextByte(){return this.data[this.pos++]}nextTwoBytes(){return this.pos+=2,this.data[this.pos-2]+(this.data[this.pos-1]<<8)}readSubBlocks(){let e="",t=0;do{t=this.data[this.pos++];for(let a=t;--a>=0;e+=String.fromCharCode(this.data[this.pos++]));}while(0!==t);return e}readSubBlocksBin(){let e=0,t=0;for(let a=0;0!==(e=this.data[this.pos+a]);a+=e+1)t+=e;const a=new Uint8Array(t);for(let t=0;0!==(e=this.data[this.pos++]);)for(let o=e;--o>=0;a[t++]=this.data[this.pos++]);return a}skipSubBlocks(){for(;0!==this.data[this.pos];this.pos+=this.data[this.pos]+1);this.pos++}}function n(e,t){const a=[];for(let o=0;o<t;o++)a.push({r:e.data[e.pos],g:e.data[e.pos+1],b:e.data[e.pos+2]}),e.pos+=3;return a}async function s(e,o,i,r,s,l){switch(e.nextByte()){case 59:return!0;case 44:await async function(e,o,i,r,s,l){const c=o.frames[r(!0)];c.left=e.nextTwoBytes(),c.top=e.nextTwoBytes(),c.width=e.nextTwoBytes(),c.height=e.nextTwoBytes();const g=e.nextByte(),h=128==(128&g),d=64==(64&g);c.sortFlag=32==(32&g),c.reserved=(24&g)>>>3;const f=1<<1+(7&g);h&&(c.localColorTable=n(e,f));const p=e=>{const{r:t,g:a,b:r}=(h?c.localColorTable:o.globalColorTable)[e];return{r:t,g:a,b:r,a:e===s(null)?i?~~((t+a+r)/3):0:255}},m=(()=>{try{return new ImageData(c.width,c.height,{colorSpace:"srgb"})}catch(e){if(e instanceof DOMException&&"IndexSizeError"===e.name)return null;throw e}})();if(null==m)throw new EvalError("GIF frame size is to large");const u=e.nextByte(),w=e.readSubBlocksBin(),y=1<<u,b=(e,t)=>{const a=e>>>3,o=7&e;return(w[a]+(w[a+1]<<8)+(w[a+2]<<16)&(1<<t)-1<<o)>>>o};if(d){for(let i=0,n=u+1,s=0,g=[[0]],h=0;h<4;h++){if(t[h]<c.height)for(let e=0,o=0;;){const r=i;if(i=b(s,n),s+=n+1,i===y){n=u+1,g.length=y+2;for(let e=0;e<g.length;e++)g[e]=e<y?[e]:[]}else{i>=g.length?g.push(g[r].concat(g[r][0])):r!==y&&g.push(g[r].concat(g[i][0]));for(let r=0;r<g[i].length;r++){const{r:n,g:s,b:l,a:d}=p(g[i][r]);m.data.set([n,s,l,d],t[h]*c.width+a[h]*o+e%(4*c.width)),e+=4}g.length===1<<n&&n<12&&n++}if(e===4*c.width*(o+1)&&(o++,t[h]+a[h]*o>=c.height))break}l?.(e.pos/(e.data.length-1),r(!1)+1,m,{x:c.left,y:c.top},{width:o.width,height:o.height})}c.image=m,c.bitmap=await createImageBitmap(m)}else{for(let e=0,t=u+1,a=0,o=[[0]],i=-4;;){const r=e;if(e=b(a,t),a+=t,e===y){t=u+1,o.length=y+2;for(let e=0;e<o.length;e++)o[e]=e<y?[e]:[]}else{if(e===y+1)break;e>=o.length?o.push(o[r].concat(o[r][0])):r!==y&&o.push(o[r].concat(o[e][0]));for(let t=0;t<o[e].length;t++){const{r:a,g:r,b:n,a:s}=p(o[e][t]);m.data.set([a,r,n,s],i+=4)}o.length>=1<<t&&t<12&&t++}}c.image=m,c.bitmap=await createImageBitmap(m),l?.((e.pos+1)/e.data.length,r(!1)+1,c.image,{x:c.left,y:c.top},{width:o.width,height:o.height})}}(e,o,i,r,s,l);break;case 33:await async function(e,t,a,o){switch(e.nextByte()){case 249:{const i=t.frames[a(!1)];e.pos++;const r=e.nextByte();i.GCreserved=(224&r)>>>5,i.disposalMethod=(28&r)>>>2,i.userInputDelayFlag=2==(2&r);const n=1==(1&r);i.delayTime=10*e.nextTwoBytes();const s=e.nextByte();n&&o(s),e.pos++;break}case 255:{e.pos++;const a={identifier:e.getString(8),authenticationCode:e.getString(3),data:e.readSubBlocksBin()};t.applicationExtensions.push(a);break}case 254:t.comments.push([a(!1),e.readSubBlocks()]);break;case 1:if(0===t.globalColorTable.length)throw new EvalError("plain text extension without global color table");e.pos++,t.frames[a(!1)].plainTextData={left:e.nextTwoBytes(),top:e.nextTwoBytes(),width:e.nextTwoBytes(),height:e.nextTwoBytes(),charSize:{width:e.nextTwoBytes(),height:e.nextTwoBytes()},foregroundColor:e.nextByte(),backgroundColor:e.nextByte(),text:e.readSubBlocks()};break;default:e.skipSubBlocks()}}(e,o,r,s);break;default:throw new EvalError("undefined block found")}return!1}const l=/(#(?:[0-9a-f]{2}){2,4}|(#[0-9a-f]{3})|(rgb|hsl)a?\((-?\d+%?[,\s]+){2,3}\s*[\d.]+%?\))|currentcolor/gi;async function c(t){return new Promise((a=>{t.loading=!0;const o=new Image;t.element=o,o.addEventListener("load",(()=>{t.loading=!1,a()})),o.addEventListener("error",(()=>{t.element=void 0,t.error=!0,t.loading=!1,(0,e.getLogger)().error(`${e.errorPrefix} loading image: ${t.source}`),a()})),o.src=t.source}))}async function g(e){if("gif"===e.type){e.loading=!0;try{e.gifData=await async function(e,t,a){a||(a=!1);const o=await fetch(e);if(!o.ok&&404===o.status)throw new EvalError("file not found");const i=await o.arrayBuffer(),l={width:0,height:0,totalTime:0,colorRes:0,pixelAspectRatio:0,frames:[],sortFlag:!1,globalColorTable:[],backgroundImage:new ImageData(1,1,{colorSpace:"srgb"}),comments:[],applicationExtensions:[]},c=new r(new Uint8ClampedArray(i));if("GIF89a"!==c.getString(6))throw new Error("not a supported GIF file");l.width=c.nextTwoBytes(),l.height=c.nextTwoBytes();const g=c.nextByte(),h=128==(128&g);l.colorRes=(112&g)>>>4,l.sortFlag=8==(8&g);const d=1<<1+(7&g),f=c.nextByte();l.pixelAspectRatio=c.nextByte(),0!==l.pixelAspectRatio&&(l.pixelAspectRatio=(l.pixelAspectRatio+15)/64),h&&(l.globalColorTable=n(c,d));const p=(()=>{try{return new ImageData(l.width,l.height,{colorSpace:"srgb"})}catch(e){if(e instanceof DOMException&&"IndexSizeError"===e.name)return null;throw e}})();if(null==p)throw new Error("GIF frame size is to large");const{r:m,g:u,b:w}=l.globalColorTable[f];p.data.set(h?[m,u,w,255]:[0,0,0,0]);for(let e=4;e<p.data.length;e*=2)p.data.copyWithin(e,0,e);l.backgroundImage=p;let y=-1,b=!0,x=-1;const C=e=>(e&&(b=!0),y),v=e=>(null!=e&&(x=e),x);try{do{b&&(l.frames.push({left:0,top:0,width:0,height:0,disposalMethod:0,image:new ImageData(1,1,{colorSpace:"srgb"}),plainTextData:null,userInputDelayFlag:!1,delayTime:0,sortFlag:!1,localColorTable:[],reserved:0,GCreserved:0}),y++,x=-1,b=!1)}while(!await s(c,l,a,C,v,t));l.frames.length--;for(const e of l.frames){if(e.userInputDelayFlag&&0===e.delayTime){l.totalTime=1/0;break}l.totalTime+=e.delayTime}return l}catch(e){if(e instanceof EvalError)throw new Error(`error while parsing frame ${y} "${e.message}"`);throw e}}(e.source),e.gifLoopCount=function(e){for(const t of e.applicationExtensions)if(t.identifier+t.authenticationCode==="NETSCAPE2.0")return t.data[1]+(t.data[2]<<8);return NaN}(e.gifData)??0,0===e.gifLoopCount&&(e.gifLoopCount=1/0)}catch{e.error=!0}e.loading=!1}else await c(e)}async function h(t){if("svg"!==t.type)return void await c(t);t.loading=!0;const a=await fetch(t.source);a.ok?t.svgData=await a.text():((0,e.getLogger)().error(`${e.errorPrefix} Image not found`),t.error=!0),t.loading=!1}function d(t,a,o,i){const r=function(t,a,o){const{svgData:i}=t;if(!i)return"";const r=(0,e.getStyleFromHsl)(a,o);if(i.includes("fill"))return i.replace(l,(()=>r));const n=i.indexOf(">");return`${i.substring(0,n)} fill="${r}"${i.substring(n)}`}(t,o,i.opacity?.value??1),n={color:o,gif:a.gif,data:{...t,svgData:r},loaded:!1,ratio:a.width/a.height,replaceColor:a.replaceColor,source:a.src};return new Promise((e=>{const a=new Blob([r],{type:"image/svg+xml"}),o=URL||window.URL||window.webkitURL||window,i=o.createObjectURL(a),s=new Image;s.addEventListener("load",(()=>{n.loaded=!0,n.element=s,e(n),o.revokeObjectURL(i)})),s.addEventListener("error",(async()=>{o.revokeObjectURL(i);const a={...t,error:!1,loading:!0};await c(a),n.loaded=!0,n.element=a.element,e(n)})),s.src=i}))}class f{constructor(t){this.loadImageShape=async t=>{if(!this._engine.loadImage)throw new Error(`${e.errorPrefix} image shape not initialized`);await this._engine.loadImage({gif:t.gif,name:t.name,replaceColor:t.replaceColor??!1,src:t.src})},this._engine=t}addImage(e){this._engine.images||(this._engine.images=[]),this._engine.images.push(e)}draw(e){const{context:t,radius:a,particle:o,opacity:i,delta:r}=e,n=o.image,s=n?.element;if(n){if(t.globalAlpha=i,n.gif&&n.gifData){const e=new OffscreenCanvas(n.gifData.width,n.gifData.height),i=e.getContext("2d");if(!i)throw new Error("could not create offscreen canvas context");i.imageSmoothingQuality="low",i.imageSmoothingEnabled=!1,i.clearRect(0,0,e.width,e.height),void 0===o.gifLoopCount&&(o.gifLoopCount=n.gifLoopCount??0);let s=o.gifFrame??0;const l={x:.5*-n.gifData.width,y:.5*-n.gifData.height},c=n.gifData.frames[s];if(void 0===o.gifTime&&(o.gifTime=0),!c.bitmap)return;switch(t.scale(a/n.gifData.width,a/n.gifData.height),c.disposalMethod){case 4:case 5:case 6:case 7:case 0:i.drawImage(c.bitmap,c.left,c.top),t.drawImage(e,l.x,l.y),i.clearRect(0,0,e.width,e.height);break;case 1:i.drawImage(c.bitmap,c.left,c.top),t.drawImage(e,l.x,l.y);break;case 2:i.drawImage(c.bitmap,c.left,c.top),t.drawImage(e,l.x,l.y),i.clearRect(0,0,e.width,e.height),0===n.gifData.globalColorTable.length?i.putImageData(n.gifData.frames[0].image,l.x+c.left,l.y+c.top):i.putImageData(n.gifData.backgroundImage,l.x,l.y);break;case 3:{const a=i.getImageData(0,0,e.width,e.height);i.drawImage(c.bitmap,c.left,c.top),t.drawImage(e,l.x,l.y),i.clearRect(0,0,e.width,e.height),i.putImageData(a,0,0)}}if(o.gifTime+=r.value,o.gifTime>c.delayTime){if(o.gifTime-=c.delayTime,++s>=n.gifData.frames.length){if(--o.gifLoopCount<=0)return;s=0,i.clearRect(0,0,e.width,e.height)}o.gifFrame=s}t.scale(n.gifData.width/a,n.gifData.height/a)}else if(s){const e=n.ratio,o={x:-a,y:-a},i=2*a;t.drawImage(s,o.x,o.y,i,i/e)}t.globalAlpha=1}}getSidesCount(){return 12}async init(e){const t=e.actualOptions;if(t.preload&&this._engine.loadImage)for(const e of t.preload)await this._engine.loadImage(e)}loadShape(e){if("image"!==e.shape&&"images"!==e.shape)return;this._engine.images||(this._engine.images=[]);const t=e.shapeData;if(!t)return;this._engine.images.find((e=>e.name===t.name||e.source===t.src))||this.loadImageShape(t).then((()=>{this.loadShape(e)}))}particleInit(e,t){if("image"!==t.shape&&"images"!==t.shape)return;this._engine.images||(this._engine.images=[]);const a=this._engine.images,o=t.shapeData;if(!o)return;const i=t.getFillColor(),r=a.find((e=>e.name===o.name||e.source===o.src));if(!r)return;const n=o.replaceColor??r.replaceColor;r.loading?setTimeout((()=>{this.particleInit(e,t)})):(async()=>{let e;e=r.svgData&&i?await d(r,o,i,t):{color:i,data:r,element:r.element,gif:r.gif,gifData:r.gifData,gifLoopCount:r.gifLoopCount,loaded:!0,ratio:o.width&&o.height?o.width/o.height:r.ratio??1,replaceColor:n,source:o.src},e.ratio||(e.ratio=1);const a={image:e,fill:o.fill??t.shapeFill,close:o.close??t.shapeClose};t.image=a.image,t.shapeFill=a.fill,t.shapeClose=a.close})()}}class p{constructor(){this.src="",this.gif=!1}load(e){e&&(void 0!==e.gif&&(this.gif=e.gif),void 0!==e.height&&(this.height=e.height),void 0!==e.name&&(this.name=e.name),void 0!==e.replaceColor&&(this.replaceColor=e.replaceColor),void 0!==e.src&&(this.src=e.src),void 0!==e.width&&(this.width=e.width))}}class m{constructor(e){this.id="imagePreloader",this._engine=e}getPlugin(){return{}}loadOptions(e,t){if(!t||!t.preload)return;e.preload||(e.preload=[]);const a=e.preload;for(const e of t.preload){const t=a.find((t=>t.name===e.name||t.src===e.src));if(t)t.load(e);else{const t=new p;t.load(e),a.push(t)}}}needsPlugin(){return!0}}async function u(t,a=!0){!function(t){t.loadImage||(t.loadImage=async a=>{if(!a.name&&!a.src)throw new Error(`${e.errorPrefix} no image source provided`);if(t.images||(t.images=[]),!t.images.find((e=>e.name===a.name||e.source===a.src)))try{const e={gif:a.gif??!1,name:a.name??a.src,source:a.src,type:a.src.substring(a.src.length-3),error:!1,loading:!0,replaceColor:a.replaceColor,ratio:a.width&&a.height?a.width/a.height:void 0};t.images.push(e);const o=a.gif?g:a.replaceColor?h:c;await o(e)}catch{throw new Error(`${e.errorPrefix} ${a.name??a.src} not found`)}})}(t);const o=new m(t);await t.addPlugin(o,a),await t.addShape(["image","images"],new f(t),a)}})(),i})()));
+!function(e,r){if("object"==typeof exports&&"object"==typeof module)module.exports=r(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],r);else{var t="object"==typeof exports?r(require("@tsparticles/engine")):r(e.window);for(var o in t)("object"==typeof exports?exports:e)[o]=t[o]}}(this,(e=>(()=>{var r,t,o={103:(e,r,t)=>{t.d(r,{d:()=>c,loadImage:()=>s,replaceImageColor:()=>l});var o=t(533);const a=0,n=1,i=/(#(?:[0-9a-f]{2}){2,4}|(#[0-9a-f]{3})|(rgb|hsl)a?\((-?\d+%?[,\s]+){2,3}\s*[\d.]+%?\))|currentcolor/gi;async function s(e){return new Promise((r=>{e.loading=!0;const t=new Image;e.element=t,t.addEventListener("load",(()=>{e.loading=!1,r()})),t.addEventListener("error",(()=>{e.element=void 0,e.error=!0,e.loading=!1,(0,o.getLogger)().error(`${o.errorPrefix} loading image: ${e.source}`),r()})),t.src=e.source}))}async function c(e){if("svg"!==e.type)return void await s(e);e.loading=!0;const r=await fetch(e.source);r.ok?e.svgData=await r.text():((0,o.getLogger)().error(`${o.errorPrefix} Image not found`),e.error=!0),e.loading=!1}function l(e,r,t,c){const l=function(e,r,t){const{svgData:n}=e;if(!n)return"";const s=(0,o.getStyleFromHsl)(r,t);if(n.includes("fill"))return n.replace(i,(()=>s));const c=n.indexOf(">");return`${n.substring(a,c)} fill="${s}"${n.substring(c)}`}(e,t,c.opacity?.value??n),d={color:t,gif:r.gif,data:{...e,svgData:l},loaded:!1,ratio:r.width/r.height,replaceColor:r.replaceColor,source:r.src};return new Promise((r=>{const t=new Blob([l],{type:"image/svg+xml"}),o=URL||window.URL||window.webkitURL||window,a=o.createObjectURL(t),n=new Image;n.addEventListener("load",(()=>{d.loaded=!0,d.element=n,r(d),o.revokeObjectURL(a)}));n.addEventListener("error",(()=>{(async()=>{o.revokeObjectURL(a);const t={...e,error:!1,loading:!0};await s(t),d.loaded=!0,d.element=t.element,r(d)})()})),n.src=a}))}},533:r=>{r.exports=e}},a={};function n(e){var r=a[e];if(void 0!==r)return r.exports;var t=a[e]={exports:{}};return o[e](t,t.exports,n),t.exports}n.m=o,n.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return n.d(r,{a:r}),r},n.d=(e,r)=>{for(var t in r)n.o(r,t)&&!n.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},n.f={},n.e=e=>Promise.all(Object.keys(n.f).reduce(((r,t)=>(n.f[t](e,r),r)),[])),n.u=e=>e+".min.js",n.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),n.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),r={},t="@tsparticles/shape-image:",n.l=(e,o,a,i)=>{if(r[e])r[e].push(o);else{var s,c;if(void 0!==a)for(var l=document.getElementsByTagName("script"),d=0;d<l.length;d++){var u=l[d];if(u.getAttribute("src")==e||u.getAttribute("data-webpack")==t+a){s=u;break}}s||(c=!0,(s=document.createElement("script")).charset="utf-8",s.timeout=120,n.nc&&s.setAttribute("nonce",n.nc),s.setAttribute("data-webpack",t+a),s.src=e),r[e]=[o];var g=(t,o)=>{s.onerror=s.onload=null,clearTimeout(f);var a=r[e];if(delete r[e],s.parentNode&&s.parentNode.removeChild(s),a&&a.forEach((e=>e(o))),t)return t(o)},f=setTimeout(g.bind(null,void 0,{type:"timeout",target:s}),12e4);s.onerror=g.bind(null,s.onerror),s.onload=g.bind(null,s.onload),c&&document.head.appendChild(s)}},n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},(()=>{var e;n.g.importScripts&&(e=n.g.location+"");var r=n.g.document;if(!e&&r&&(r.currentScript&&(e=r.currentScript.src),!e)){var t=r.getElementsByTagName("script");if(t.length)for(var o=t.length-1;o>-1&&!e;)e=t[o--].src}if(!e)throw new Error("Automatic publicPath is not supported in this browser");e=e.replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),n.p=e})(),(()=>{var e={852:0};n.f.j=(r,t)=>{var o=n.o(e,r)?e[r]:void 0;if(0!==o)if(o)t.push(o[2]);else{var a=new Promise(((t,a)=>o=e[r]=[t,a]));t.push(o[2]=a);var i=n.p+n.u(r),s=new Error;n.l(i,(t=>{if(n.o(e,r)&&(0!==(o=e[r])&&(e[r]=void 0),o)){var a=t&&("load"===t.type?"missing":t.type),i=t&&t.target&&t.target.src;s.message="Loading chunk "+r+" failed.\n("+a+": "+i+")",s.name="ChunkLoadError",s.type=a,s.request=i,o[1](s)}}),"chunk-"+r,r)}};var r=(r,t)=>{var o,a,i=t[0],s=t[1],c=t[2],l=0;if(i.some((r=>0!==e[r]))){for(o in s)n.o(s,o)&&(n.m[o]=s[o]);if(c)c(n)}for(r&&r(t);l<i.length;l++)a=i[l],n.o(e,a)&&e[a]&&e[a][0](),e[a]=0},t=this.webpackChunk_tsparticles_shape_image=this.webpackChunk_tsparticles_shape_image||[];t.forEach(r.bind(null,0)),t.push=r.bind(null,t.push.bind(t))})();var i={};return(()=>{n.r(i),n.d(i,{loadImageShape:()=>o});var e=n(103),r=n(533);const t=3;async function o(o,a=!0){!function(o){o.loadImage||(o.loadImage=async a=>{if(!a.name&&!a.src)throw new Error(`${r.errorPrefix} no image source provided`);if(o.images||(o.images=[]),!o.images.find((e=>e.name===a.name||e.source===a.src)))try{const r={gif:a.gif??!1,name:a.name??a.src,source:a.src,type:a.src.substring(a.src.length-t),error:!1,loading:!0,replaceColor:a.replaceColor,ratio:a.width&&a.height?a.width/a.height:void 0};let i;if(o.images.push(r),a.gif){const{loadGifImage:e}=await n.e(618).then(n.bind(n,618));i=e}else i=a.replaceColor?e.d:e.loadImage;await i(r)}catch{throw new Error(`${r.errorPrefix} ${a.name??a.src} not found`)}})}(o);const{ImagePreloaderPlugin:i}=await n.e(623).then(n.bind(n,623)),{ImageDrawer:s}=await n.e(21).then(n.bind(n,21)),c=new i(o);await o.addPlugin(c,a),await o.addShape(["image","images"],new s(o),a)}})(),i})()));

package/tsparticles.shape.image.min.js.LICENSE.txt

@@ -1 +1 @@
-/*! tsParticles Image Shape v3.0.3 by Matteo Bruni */
+/*! tsParticles Image Shape v3.2.0 by Matteo Bruni */

package/types/GifUtils/Utils.d.ts

@@ -1,4 +1,8 @@
+import type { IShapeDrawData } from "@tsparticles/engine";
+import type { IImage, ImageParticle } from "../Utils.js";
 import type { GIF } from "./Types/GIF.js";
 import type { GIFProgressCallbackFunction } from "./Types/GIFProgressCallbackFunction.js";
 export declare function getGIFLoopAmount(gif: GIF): number;
 export declare function decodeGIF(gifURL: string, progressCallback?: GIFProgressCallbackFunction, avgAlpha?: boolean): Promise<GIF>;
+export declare function drawGif(data: IShapeDrawData<ImageParticle>): void;
+export declare function loadGifImage(image: IImage): Promise<void>;

package/types/ImageDrawer.d.ts

@@ -5,10 +5,10 @@ export declare class ImageDrawer implements IShapeDrawer<ImageParticle> {
     private readonly _engine;
     constructor(engine: ImageEngine);
     addImage(image: IImage): void;
-    draw(data: IShapeDrawData<ImageParticle>): void;
+    draw(data: IShapeDrawData<ImageParticle>): Promise<void>;
     getSidesCount(): number;
     init(container: ImageContainer): Promise<void>;
-    loadShape(particle: ImageParticle): void;
-    particleInit(container: Container, particle: ImageParticle): void;
+    loadShape(particle: ImageParticle): Promise<void>;
+    particleInit(container: Container, particle: ImageParticle): Promise<void>;
     private readonly loadImageShape;
 }

package/types/ImagePreloader.d.ts

@@ -4,7 +4,7 @@ export declare class ImagePreloaderPlugin implements IPlugin {
     readonly id: string;
     private readonly _engine;
     constructor(engine: Engine);
-    getPlugin(): IContainerPlugin;
+    getPlugin(): Promise<IContainerPlugin>;
     loadOptions(options: PreloadOptions, source?: RecursivePartial<IPreloadOptions>): void;
     needsPlugin(): boolean;
 }

package/types/Utils.d.ts

@@ -35,6 +35,5 @@ export type ImageParticle = Particle & {
     image?: IParticleImage;
 };
 export declare function loadImage(image: IImage): Promise<void>;
-export declare function loadGifImage(image: IImage): Promise<void>;
 export declare function downloadSvgImage(image: IImage): Promise<void>;
 export declare function replaceImageColor(image: IImage, imageData: IImageShape, color: IHsl, particle: Particle): Promise<IParticleImage>;

package/umd/GifUtils/ByteStream.js

@@ -24,32 +24,36 @@
             return this.data[this.pos++];
         }
         nextTwoBytes() {
-            this.pos += 2;
-            return this.data[this.pos - 2] + (this.data[this.pos - 1] << 8);
+            const increment = 2, previous = 1, shift = 8;
+            this.pos += increment;
+            return this.data[this.pos - increment] + (this.data[this.pos - previous] << shift);
         }
         readSubBlocks() {
             let blockString = "", size = 0;
+            const minCount = 0, emptySize = 0;
             do {
                 size = this.data[this.pos++];
-                for (let count = size; --count >= 0; blockString += String.fromCharCode(this.data[this.pos++])) {
+                for (let count = size; --count >= minCount; blockString += String.fromCharCode(this.data[this.pos++])) {
                 }
-            } while (size !== 0);
+            } while (size !== emptySize);
             return blockString;
         }
         readSubBlocksBin() {
-            let size = 0, len = 0;
-            for (let offset = 0; (size = this.data[this.pos + offset]) !== 0; offset += size + 1) {
+            let size = this.data[this.pos], len = 0;
+            const emptySize = 0, increment = 1;
+            for (let offset = 0; size !== emptySize; offset += size + increment, size = this.data[this.pos + offset]) {
                 len += size;
             }
             const blockData = new Uint8Array(len);
-            for (let i = 0; (size = this.data[this.pos++]) !== 0;) {
-                for (let count = size; --count >= 0; blockData[i++] = this.data[this.pos++]) {
+            size = this.data[this.pos++];
+            for (let i = 0; size !== emptySize; size = this.data[this.pos++]) {
+                for (let count = size; --count >= emptySize; blockData[i++] = this.data[this.pos++]) {
                 }
             }
             return blockData;
         }
         skipSubBlocks() {
-            for (; this.data[this.pos] !== 0; this.pos += this.data[this.pos] + 1) {
+            for (const increment = 1, noData = 0; this.data[this.pos] !== noData; this.pos += this.data[this.pos] + increment) {
             }
             this.pos++;
         }

package/umd/GifUtils/Utils.js

@@ -1,3 +1,26 @@
+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;
+};
 (function (factory) {
     if (typeof module === "object" && typeof module.exports === "object") {
         var v = factory(require, exports);
@@ -8,10 +31,15 @@
     }
 })(function (require, exports) {
     "use strict";
+    var __syncRequire = typeof module === "object" && typeof module.exports === "object";
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.decodeGIF = exports.getGIFLoopAmount = void 0;
+    exports.loadGifImage = exports.drawGif = exports.decodeGIF = exports.getGIFLoopAmount = void 0;
     const Constants_js_1 = require("./Constants.js");
     const ByteStream_js_1 = require("./ByteStream.js");
+    const origin = {
+        x: 0,
+        y: 0,
+    }, defaultFrame = 0, half = 0.5, initialTime = 0, firstIndex = 0, defaultLoopCount = 0;
     function parseColorTable(byteStream, count) {
         const colors = [];
         for (let i = 0; i < count; i++) {
@@ -24,7 +52,7 @@
         }
         return colors;
     }
-    async function parseExtensionBlock(byteStream, gif, getFrameIndex, getTransparencyIndex) {
+    function parseExtensionBlock(byteStream, gif, getFrameIndex, getTransparencyIndex) {
         switch (byteStream.nextByte()) {
             case 249: {
                 const frame = gif.frames[getFrameIndex(false)];
@@ -96,7 +124,10 @@
         }
         const getColor = (index) => {
             const { r, g, b } = (localColorTableFlag ? frame.localColorTable : gif.globalColorTable)[index];
-            return { r, g, b, a: index === getTransparencyIndex(null) ? (avgAlpha ? ~~((r + g + b) / 3) : 0) : 255 };
+            if (index !== getTransparencyIndex(null)) {
+                return { r, g, b, a: 255 };
+            }
+            return { r, g, b, a: avgAlpha ? ~~((r + g + b) / 3) : 0 };
         };
         const image = (() => {
             try {
@@ -122,7 +153,8 @@
         if (interlacedFlag) {
             for (let code = 0, size = minCodeSize + 1, pos = 0, dic = [[0]], pass = 0; pass < 4; pass++) {
                 if (Constants_js_1.InterlaceOffsets[pass] < frame.height) {
-                    for (let pixelPos = 0, lineIndex = 0;;) {
+                    let pixelPos = 0, lineIndex = 0, exit = false;
+                    while (!exit) {
                         const last = code;
                         code = readBits(pos, size);
                         pos += size + 1;
@@ -140,8 +172,8 @@
                             else if (last !== clearCode) {
                                 dic.push(dic[last].concat(dic[code][0]));
                             }
-                            for (let i = 0; i < dic[code].length; i++) {
-                                const { r, g, b, a } = getColor(dic[code][i]);
+                            for (const item of dic[code]) {
+                                const { r, g, b, a } = getColor(item);
                                 image.data.set([r, g, b, a], Constants_js_1.InterlaceOffsets[pass] * frame.width +
                                     Constants_js_1.InterlaceSteps[pass] * lineIndex +
                                     (pixelPos % (frame.width * 4)));
@@ -154,7 +186,7 @@
                         if (pixelPos === frame.width * 4 * (lineIndex + 1)) {
                             lineIndex++;
                             if (Constants_js_1.InterlaceOffsets[pass] + Constants_js_1.InterlaceSteps[pass] * lineIndex >= frame.height) {
-                                break;
+                                exit = true;
                             }
                         }
                     }
@@ -165,7 +197,9 @@
             frame.bitmap = await createImageBitmap(image);
         }
         else {
-            for (let code = 0, size = minCodeSize + 1, pos = 0, dic = [[0]], pixelPos = -4;;) {
+            let code = 0, size = minCodeSize + 1, pos = 0, pixelPos = -4, exit = false;
+            const dic = [[0]];
+            while (!exit) {
                 const last = code;
                 code = readBits(pos, size);
                 pos += size;
@@ -178,6 +212,7 @@
                 }
                 else {
                     if (code === clearCode + 1) {
+                        exit = true;
                         break;
                     }
                     if (code >= dic.length) {
@@ -186,8 +221,8 @@
                     else if (last !== clearCode) {
                         dic.push(dic[last].concat(dic[code][0]));
                     }
-                    for (let i = 0; i < dic[code].length; i++) {
-                        const { r, g, b, a } = getColor(dic[code][i]);
+                    for (const item of dic[code]) {
+                        const { r, g, b, a } = getColor(item);
                         image.data.set([r, g, b, a], (pixelPos += 4));
                     }
                     if (dic.length >= 1 << size && size < 0xc) {
@@ -208,7 +243,7 @@
                 await parseImageBlock(byteStream, gif, avgAlpha, getFrameIndex, getTransparencyIndex, progressCallback);
                 break;
             case 33:
-                await parseExtensionBlock(byteStream, gif, getFrameIndex, getTransparencyIndex);
+                parseExtensionBlock(byteStream, gif, getFrameIndex, getTransparencyIndex);
                 break;
             default:
                 throw new EvalError("undefined block found");
@@ -336,4 +371,98 @@
         }
     }
     exports.decodeGIF = decodeGIF;
+    function drawGif(data) {
+        const { context, radius, particle, delta } = data, image = particle.image;
+        if (!image?.gifData || !image.gif) {
+            return;
+        }
+        const offscreenCanvas = new OffscreenCanvas(image.gifData.width, image.gifData.height), offscreenContext = offscreenCanvas.getContext("2d");
+        if (!offscreenContext) {
+            throw new Error("could not create offscreen canvas context");
+        }
+        offscreenContext.imageSmoothingQuality = "low";
+        offscreenContext.imageSmoothingEnabled = false;
+        offscreenContext.clearRect(origin.x, origin.y, offscreenCanvas.width, offscreenCanvas.height);
+        if (particle.gifLoopCount === undefined) {
+            particle.gifLoopCount = image.gifLoopCount ?? defaultLoopCount;
+        }
+        let frameIndex = particle.gifFrame ?? defaultFrame;
+        const pos = { x: -image.gifData.width * half, y: -image.gifData.height * half }, frame = image.gifData.frames[frameIndex];
+        if (particle.gifTime === undefined) {
+            particle.gifTime = initialTime;
+        }
+        if (!frame.bitmap) {
+            return;
+        }
+        context.scale(radius / image.gifData.width, radius / image.gifData.height);
+        switch (frame.disposalMethod) {
+            case 4:
+            case 5:
+            case 6:
+            case 7:
+            case 0:
+                offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
+                context.drawImage(offscreenCanvas, pos.x, pos.y);
+                offscreenContext.clearRect(origin.x, origin.y, offscreenCanvas.width, offscreenCanvas.height);
+                break;
+            case 1:
+                offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
+                context.drawImage(offscreenCanvas, pos.x, pos.y);
+                break;
+            case 2:
+                offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
+                context.drawImage(offscreenCanvas, pos.x, pos.y);
+                offscreenContext.clearRect(origin.x, origin.y, offscreenCanvas.width, offscreenCanvas.height);
+                if (!image.gifData.globalColorTable.length) {
+                    offscreenContext.putImageData(image.gifData.frames[firstIndex].image, pos.x + frame.left, pos.y + frame.top);
+                }
+                else {
+                    offscreenContext.putImageData(image.gifData.backgroundImage, pos.x, pos.y);
+                }
+                break;
+            case 3:
+                {
+                    const previousImageData = offscreenContext.getImageData(origin.x, origin.y, offscreenCanvas.width, offscreenCanvas.height);
+                    offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
+                    context.drawImage(offscreenCanvas, pos.x, pos.y);
+                    offscreenContext.clearRect(origin.x, origin.y, offscreenCanvas.width, offscreenCanvas.height);
+                    offscreenContext.putImageData(previousImageData, origin.x, origin.y);
+                }
+                break;
+        }
+        particle.gifTime += delta.value;
+        if (particle.gifTime > frame.delayTime) {
+            particle.gifTime -= frame.delayTime;
+            if (++frameIndex >= image.gifData.frames.length) {
+                if (--particle.gifLoopCount <= defaultLoopCount) {
+                    return;
+                }
+                frameIndex = firstIndex;
+                offscreenContext.clearRect(origin.x, origin.y, offscreenCanvas.width, offscreenCanvas.height);
+            }
+            particle.gifFrame = frameIndex;
+        }
+        context.scale(image.gifData.width / radius, image.gifData.height / radius);
+    }
+    exports.drawGif = drawGif;
+    async function loadGifImage(image) {
+        if (image.type !== "gif") {
+            const { loadImage } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("../Utils.js"))) : new Promise((resolve_1, reject_1) => { require(["../Utils.js"], resolve_1, reject_1); }).then(__importStar));
+            await loadImage(image);
+            return;
+        }
+        image.loading = true;
+        try {
+            image.gifData = await decodeGIF(image.source);
+            image.gifLoopCount = getGIFLoopAmount(image.gifData) ?? defaultLoopCount;
+            if (!image.gifLoopCount) {
+                image.gifLoopCount = Infinity;
+            }
+        }
+        catch {
+            image.error = true;
+        }
+        image.loading = false;
+    }
+    exports.loadGifImage = loadGifImage;
 });

package/umd/ImageDrawer.js

@@ -1,17 +1,41 @@
+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;
+};
 (function (factory) {
     if (typeof module === "object" && typeof module.exports === "object") {
         var v = factory(require, exports);
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "@tsparticles/engine", "./Utils.js"], factory);
+        define(["require", "exports", "@tsparticles/engine"], factory);
     }
 })(function (require, exports) {
     "use strict";
+    var __syncRequire = typeof module === "object" && typeof module.exports === "object";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ImageDrawer = void 0;
     const engine_1 = require("@tsparticles/engine");
-    const Utils_js_1 = require("./Utils.js");
+    const double = 2, defaultAlpha = 1, sides = 12, defaultRatio = 1;
     class ImageDrawer {
         constructor(engine) {
             this.loadImageShape = async (imageShape) => {
@@ -33,92 +57,27 @@
             }
             this._engine.images.push(image);
         }
-        draw(data) {
-            const { context, radius, particle, opacity, delta } = data, image = particle.image, element = image?.element;
+        async draw(data) {
+            const { context, radius, particle, opacity } = data, image = particle.image, element = image?.element;
             if (!image) {
                 return;
             }
             context.globalAlpha = opacity;
             if (image.gif && image.gifData) {
-                const offscreenCanvas = new OffscreenCanvas(image.gifData.width, image.gifData.height), offscreenContext = offscreenCanvas.getContext("2d");
-                if (!offscreenContext) {
-                    throw new Error("could not create offscreen canvas context");
-                }
-                offscreenContext.imageSmoothingQuality = "low";
-                offscreenContext.imageSmoothingEnabled = false;
-                offscreenContext.clearRect(0, 0, offscreenCanvas.width, offscreenCanvas.height);
-                if (particle.gifLoopCount === undefined) {
-                    particle.gifLoopCount = image.gifLoopCount ?? 0;
-                }
-                let frameIndex = particle.gifFrame ?? 0;
-                const pos = { x: -image.gifData.width * 0.5, y: -image.gifData.height * 0.5 }, frame = image.gifData.frames[frameIndex];
-                if (particle.gifTime === undefined) {
-                    particle.gifTime = 0;
-                }
-                if (!frame.bitmap) {
-                    return;
-                }
-                context.scale(radius / image.gifData.width, radius / image.gifData.height);
-                switch (frame.disposalMethod) {
-                    case 4:
-                    case 5:
-                    case 6:
-                    case 7:
-                    case 0:
-                        offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
-                        context.drawImage(offscreenCanvas, pos.x, pos.y);
-                        offscreenContext.clearRect(0, 0, offscreenCanvas.width, offscreenCanvas.height);
-                        break;
-                    case 1:
-                        offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
-                        context.drawImage(offscreenCanvas, pos.x, pos.y);
-                        break;
-                    case 2:
-                        offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
-                        context.drawImage(offscreenCanvas, pos.x, pos.y);
-                        offscreenContext.clearRect(0, 0, offscreenCanvas.width, offscreenCanvas.height);
-                        if (image.gifData.globalColorTable.length === 0) {
-                            offscreenContext.putImageData(image.gifData.frames[0].image, pos.x + frame.left, pos.y + frame.top);
-                        }
-                        else {
-                            offscreenContext.putImageData(image.gifData.backgroundImage, pos.x, pos.y);
-                        }
-                        break;
-                    case 3:
-                        {
-                            const previousImageData = offscreenContext.getImageData(0, 0, offscreenCanvas.width, offscreenCanvas.height);
-                            offscreenContext.drawImage(frame.bitmap, frame.left, frame.top);
-                            context.drawImage(offscreenCanvas, pos.x, pos.y);
-                            offscreenContext.clearRect(0, 0, offscreenCanvas.width, offscreenCanvas.height);
-                            offscreenContext.putImageData(previousImageData, 0, 0);
-                        }
-                        break;
-                }
-                particle.gifTime += delta.value;
-                if (particle.gifTime > frame.delayTime) {
-                    particle.gifTime -= frame.delayTime;
-                    if (++frameIndex >= image.gifData.frames.length) {
-                        if (--particle.gifLoopCount <= 0) {
-                            return;
-                        }
-                        frameIndex = 0;
-                        offscreenContext.clearRect(0, 0, offscreenCanvas.width, offscreenCanvas.height);
-                    }
-                    particle.gifFrame = frameIndex;
-                }
-                context.scale(image.gifData.width / radius, image.gifData.height / radius);
+                const { drawGif } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./GifUtils/Utils.js"))) : new Promise((resolve_1, reject_1) => { require(["./GifUtils/Utils.js"], resolve_1, reject_1); }).then(__importStar));
+                drawGif(data);
             }
             else if (element) {
                 const ratio = image.ratio, pos = {
                     x: -radius,
                     y: -radius,
-                }, diameter = radius * 2;
+                }, diameter = radius * double;
                 context.drawImage(element, pos.x, pos.y, diameter, diameter / ratio);
             }
-            context.globalAlpha = 1;
+            context.globalAlpha = defaultAlpha;
         }
         getSidesCount() {
-            return 12;
+            return sides;
         }
         async init(container) {
             const options = container.actualOptions;
@@ -129,7 +88,7 @@
                 await this._engine.loadImage(imageData);
             }
         }
-        loadShape(particle) {
+        async loadShape(particle) {
             if (particle.shape !== "image" && particle.shape !== "images") {
                 return;
             }
@@ -142,12 +101,11 @@
             }
             const image = this._engine.images.find((t) => t.name === imageData.name || t.source === imageData.src);
             if (!image) {
-                this.loadImageShape(imageData).then(() => {
-                    this.loadShape(particle);
-                });
+                await this.loadImageShape(imageData);
+                await this.loadShape(particle);
             }
         }
-        particleInit(container, particle) {
+        async particleInit(container, particle) {
             if (particle.shape !== "image" && particle.shape !== "images") {
                 return;
             }
@@ -165,41 +123,42 @@
             const replaceColor = imageData.replaceColor ?? image.replaceColor;
             if (image.loading) {
                 setTimeout(() => {
-                    this.particleInit(container, particle);
+                    void this.particleInit(container, particle);
                 });
                 return;
             }
-            (async () => {
-                let imageRes;
-                if (image.svgData && color) {
-                    imageRes = await (0, Utils_js_1.replaceImageColor)(image, imageData, color, particle);
-                }
-                else {
-                    imageRes = {
-                        color,
-                        data: image,
-                        element: image.element,
-                        gif: image.gif,
-                        gifData: image.gifData,
-                        gifLoopCount: image.gifLoopCount,
-                        loaded: true,
-                        ratio: imageData.width && imageData.height ? imageData.width / imageData.height : image.ratio ?? 1,
-                        replaceColor: replaceColor,
-                        source: imageData.src,
-                    };
-                }
-                if (!imageRes.ratio) {
-                    imageRes.ratio = 1;
-                }
-                const fill = imageData.fill ?? particle.shapeFill, close = imageData.close ?? particle.shapeClose, imageShape = {
-                    image: imageRes,
-                    fill,
-                    close,
+            let imageRes;
+            if (image.svgData && color) {
+                const { replaceImageColor } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./Utils.js"))) : new Promise((resolve_2, reject_2) => { require(["./Utils.js"], resolve_2, reject_2); }).then(__importStar));
+                imageRes = await replaceImageColor(image, imageData, color, particle);
+            }
+            else {
+                imageRes = {
+                    color,
+                    data: image,
+                    element: image.element,
+                    gif: image.gif,
+                    gifData: image.gifData,
+                    gifLoopCount: image.gifLoopCount,
+                    loaded: true,
+                    ratio: imageData.width && imageData.height
+                        ? imageData.width / imageData.height
+                        : image.ratio ?? defaultRatio,
+                    replaceColor: replaceColor,
+                    source: imageData.src,
                 };
-                particle.image = imageShape.image;
-                particle.shapeFill = imageShape.fill;
-                particle.shapeClose = imageShape.close;
-            })();
+            }
+            if (!imageRes.ratio) {
+                imageRes.ratio = 1;
+            }
+            const fill = imageData.fill ?? particle.shapeFill, close = imageData.close ?? particle.shapeClose, imageShape = {
+                image: imageRes,
+                fill,
+                close,
+            };
+            particle.image = imageShape.image;
+            particle.shapeFill = imageShape.fill;
+            particle.shapeClose = imageShape.close;
         }
     }
     exports.ImageDrawer = ImageDrawer;

package/umd/ImagePreloader.js

@@ -16,11 +16,12 @@
             this.id = "imagePreloader";
             this._engine = engine;
         }
-        getPlugin() {
+        async getPlugin() {
+            await Promise.resolve();
             return {};
         }
         loadOptions(options, source) {
-            if (!source || !source.preload) {
+            if (!source?.preload) {
                 return;
             }
             if (!options.preload) {