@tsparticles/shape-image 3.0.0-alpha.1 → 3.0.0-beta.0

package/umd/GifUtils/Utils.js

@@ -0,0 +1,339 @@
+(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", "./Constants", "./ByteStream"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.decodeGIF = exports.getGIFLoopAmount = void 0;
+    const Constants_1 = require("./Constants");
+    const ByteStream_1 = require("./ByteStream");
+    function parseColorTable(byteStream, count) {
+        const colors = [];
+        for (let i = 0; i < count; i++) {
+            colors.push({
+                r: byteStream.data[byteStream.pos],
+                g: byteStream.data[byteStream.pos + 1],
+                b: byteStream.data[byteStream.pos + 2],
+            });
+            byteStream.pos += 3;
+        }
+        return colors;
+    }
+    async function parseExtensionBlock(byteStream, gif, getFrameIndex, getTransparencyIndex) {
+        switch (byteStream.nextByte()) {
+            case 249: {
+                const frame = gif.frames[getFrameIndex(false)];
+                byteStream.pos++;
+                const packedByte = byteStream.nextByte();
+                frame.GCreserved = (packedByte & 0xe0) >>> 5;
+                frame.disposalMethod = (packedByte & 0x1c) >>> 2;
+                frame.userInputDelayFlag = (packedByte & 2) === 2;
+                const transparencyFlag = (packedByte & 1) === 1;
+                frame.delayTime = byteStream.nextTwoBytes() * 0xa;
+                const transparencyIndex = byteStream.nextByte();
+                if (transparencyFlag) {
+                    getTransparencyIndex(transparencyIndex);
+                }
+                byteStream.pos++;
+                break;
+            }
+            case 255: {
+                byteStream.pos++;
+                const applicationExtension = {
+                    identifier: byteStream.getString(8),
+                    authenticationCode: byteStream.getString(3),
+                    data: byteStream.readSubBlocksBin(),
+                };
+                gif.applicationExtensions.push(applicationExtension);
+                break;
+            }
+            case 254: {
+                gif.comments.push([getFrameIndex(false), byteStream.readSubBlocks()]);
+                break;
+            }
+            case 1: {
+                if (gif.globalColorTable.length === 0) {
+                    throw new EvalError("plain text extension without global color table");
+                }
+                byteStream.pos++;
+                gif.frames[getFrameIndex(false)].plainTextData = {
+                    left: byteStream.nextTwoBytes(),
+                    top: byteStream.nextTwoBytes(),
+                    width: byteStream.nextTwoBytes(),
+                    height: byteStream.nextTwoBytes(),
+                    charSize: {
+                        width: byteStream.nextTwoBytes(),
+                        height: byteStream.nextTwoBytes(),
+                    },
+                    foregroundColor: byteStream.nextByte(),
+                    backgroundColor: byteStream.nextByte(),
+                    text: byteStream.readSubBlocks(),
+                };
+                break;
+            }
+            default:
+                byteStream.skipSubBlocks();
+                break;
+        }
+    }
+    async function parseImageBlock(byteStream, gif, avgAlpha, getFrameIndex, getTransparencyIndex, progressCallback) {
+        const frame = gif.frames[getFrameIndex(true)];
+        frame.left = byteStream.nextTwoBytes();
+        frame.top = byteStream.nextTwoBytes();
+        frame.width = byteStream.nextTwoBytes();
+        frame.height = byteStream.nextTwoBytes();
+        const packedByte = byteStream.nextByte(), localColorTableFlag = (packedByte & 0x80) === 0x80, interlacedFlag = (packedByte & 0x40) === 0x40;
+        frame.sortFlag = (packedByte & 0x20) === 0x20;
+        frame.reserved = (packedByte & 0x18) >>> 3;
+        const localColorCount = 1 << ((packedByte & 7) + 1);
+        if (localColorTableFlag) {
+            frame.localColorTable = parseColorTable(byteStream, localColorCount);
+        }
+        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 };
+        };
+        const image = (() => {
+            try {
+                return new ImageData(frame.width, frame.height, { colorSpace: "srgb" });
+            }
+            catch (error) {
+                if (error instanceof DOMException && error.name === "IndexSizeError") {
+                    return null;
+                }
+                throw error;
+            }
+        })();
+        if (image == null) {
+            throw new EvalError("GIF frame size is to large");
+        }
+        const minCodeSize = byteStream.nextByte(), imageData = byteStream.readSubBlocksBin(), clearCode = 1 << minCodeSize;
+        const readBits = (pos, len) => {
+            const bytePos = pos >>> 3, bitPos = pos & 7;
+            return (((imageData[bytePos] + (imageData[bytePos + 1] << 8) + (imageData[bytePos + 2] << 16)) &
+                (((1 << len) - 1) << bitPos)) >>>
+                bitPos);
+        };
+        if (interlacedFlag) {
+            for (let code = 0, size = minCodeSize + 1, pos = 0, dic = [[0]], pass = 0; pass < 4; pass++) {
+                if (Constants_1.InterlaceOffsets[pass] < frame.height) {
+                    for (let pixelPos = 0, lineIndex = 0;;) {
+                        const last = code;
+                        code = readBits(pos, size);
+                        pos += size + 1;
+                        if (code === clearCode) {
+                            size = minCodeSize + 1;
+                            dic.length = clearCode + 2;
+                            for (let i = 0; i < dic.length; i++) {
+                                dic[i] = i < clearCode ? [i] : [];
+                            }
+                        }
+                        else {
+                            if (code >= dic.length) {
+                                dic.push(dic[last].concat(dic[last][0]));
+                            }
+                            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]);
+                                image.data.set([r, g, b, a], Constants_1.InterlaceOffsets[pass] * frame.width +
+                                    Constants_1.InterlaceSteps[pass] * lineIndex +
+                                    (pixelPos % (frame.width * 4)));
+                                pixelPos += 4;
+                            }
+                            if (dic.length === 1 << size && size < 0xc) {
+                                size++;
+                            }
+                        }
+                        if (pixelPos === frame.width * 4 * (lineIndex + 1)) {
+                            lineIndex++;
+                            if (Constants_1.InterlaceOffsets[pass] + Constants_1.InterlaceSteps[pass] * lineIndex >= frame.height) {
+                                break;
+                            }
+                        }
+                    }
+                }
+                progressCallback?.(byteStream.pos / (byteStream.data.length - 1), getFrameIndex(false) + 1, image, { x: frame.left, y: frame.top }, { width: gif.width, height: gif.height });
+            }
+            frame.image = image;
+            frame.bitmap = await createImageBitmap(image);
+        }
+        else {
+            for (let code = 0, size = minCodeSize + 1, pos = 0, dic = [[0]], pixelPos = -4;;) {
+                const last = code;
+                code = readBits(pos, size);
+                pos += size;
+                if (code === clearCode) {
+                    size = minCodeSize + 1;
+                    dic.length = clearCode + 2;
+                    for (let i = 0; i < dic.length; i++) {
+                        dic[i] = i < clearCode ? [i] : [];
+                    }
+                }
+                else {
+                    if (code === clearCode + 1) {
+                        break;
+                    }
+                    if (code >= dic.length) {
+                        dic.push(dic[last].concat(dic[last][0]));
+                    }
+                    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]);
+                        image.data.set([r, g, b, a], (pixelPos += 4));
+                    }
+                    if (dic.length >= 1 << size && size < 0xc) {
+                        size++;
+                    }
+                }
+            }
+            frame.image = image;
+            frame.bitmap = await createImageBitmap(image);
+            progressCallback?.((byteStream.pos + 1) / byteStream.data.length, getFrameIndex(false) + 1, frame.image, { x: frame.left, y: frame.top }, { width: gif.width, height: gif.height });
+        }
+    }
+    async function parseBlock(byteStream, gif, avgAlpha, getFrameIndex, getTransparencyIndex, progressCallback) {
+        switch (byteStream.nextByte()) {
+            case 59:
+                return true;
+            case 44:
+                await parseImageBlock(byteStream, gif, avgAlpha, getFrameIndex, getTransparencyIndex, progressCallback);
+                break;
+            case 33:
+                await parseExtensionBlock(byteStream, gif, getFrameIndex, getTransparencyIndex);
+                break;
+            default:
+                throw new EvalError("undefined block found");
+        }
+        return false;
+    }
+    function getGIFLoopAmount(gif) {
+        for (const extension of gif.applicationExtensions) {
+            if (extension.identifier + extension.authenticationCode !== "NETSCAPE2.0") {
+                continue;
+            }
+            return extension.data[1] + (extension.data[2] << 8);
+        }
+        return NaN;
+    }
+    exports.getGIFLoopAmount = getGIFLoopAmount;
+    async function decodeGIF(gifURL, progressCallback, avgAlpha) {
+        if (!avgAlpha)
+            avgAlpha = false;
+        const res = await fetch(gifURL);
+        if (!res.ok && res.status === 404) {
+            throw new EvalError("file not found");
+        }
+        const buffer = await res.arrayBuffer();
+        const gif = {
+            width: 0,
+            height: 0,
+            totalTime: 0,
+            colorRes: 0,
+            pixelAspectRatio: 0,
+            frames: [],
+            sortFlag: false,
+            globalColorTable: [],
+            backgroundImage: new ImageData(1, 1, { colorSpace: "srgb" }),
+            comments: [],
+            applicationExtensions: [],
+        }, byteStream = new ByteStream_1.ByteStream(new Uint8ClampedArray(buffer));
+        if (byteStream.getString(6) !== "GIF89a") {
+            throw new Error("not a supported GIF file");
+        }
+        gif.width = byteStream.nextTwoBytes();
+        gif.height = byteStream.nextTwoBytes();
+        const packedByte = byteStream.nextByte(), globalColorTableFlag = (packedByte & 0x80) === 0x80;
+        gif.colorRes = (packedByte & 0x70) >>> 4;
+        gif.sortFlag = (packedByte & 8) === 8;
+        const globalColorCount = 1 << ((packedByte & 7) + 1), backgroundColorIndex = byteStream.nextByte();
+        gif.pixelAspectRatio = byteStream.nextByte();
+        if (gif.pixelAspectRatio !== 0) {
+            gif.pixelAspectRatio = (gif.pixelAspectRatio + 0xf) / 0x40;
+        }
+        if (globalColorTableFlag) {
+            gif.globalColorTable = parseColorTable(byteStream, globalColorCount);
+        }
+        const backgroundImage = (() => {
+            try {
+                return new ImageData(gif.width, gif.height, { colorSpace: "srgb" });
+            }
+            catch (error) {
+                if (error instanceof DOMException && error.name === "IndexSizeError") {
+                    return null;
+                }
+                throw error;
+            }
+        })();
+        if (backgroundImage == null) {
+            throw new Error("GIF frame size is to large");
+        }
+        const { r, g, b } = gif.globalColorTable[backgroundColorIndex];
+        backgroundImage.data.set(globalColorTableFlag ? [r, g, b, 255] : [0, 0, 0, 0]);
+        for (let i = 4; i < backgroundImage.data.length; i *= 2) {
+            backgroundImage.data.copyWithin(i, 0, i);
+        }
+        gif.backgroundImage = backgroundImage;
+        let frameIndex = -1, incrementFrameIndex = true, transparencyIndex = -1;
+        const getframeIndex = (increment) => {
+            if (increment) {
+                incrementFrameIndex = true;
+            }
+            return frameIndex;
+        };
+        const getTransparencyIndex = (newValue) => {
+            if (newValue != null) {
+                transparencyIndex = newValue;
+            }
+            return transparencyIndex;
+        };
+        try {
+            do {
+                if (incrementFrameIndex) {
+                    gif.frames.push({
+                        left: 0,
+                        top: 0,
+                        width: 0,
+                        height: 0,
+                        disposalMethod: 0,
+                        image: new ImageData(1, 1, { colorSpace: "srgb" }),
+                        plainTextData: null,
+                        userInputDelayFlag: false,
+                        delayTime: 0,
+                        sortFlag: false,
+                        localColorTable: [],
+                        reserved: 0,
+                        GCreserved: 0,
+                    });
+                    frameIndex++;
+                    transparencyIndex = -1;
+                    incrementFrameIndex = false;
+                }
+            } while (!(await parseBlock(byteStream, gif, avgAlpha, getframeIndex, getTransparencyIndex, progressCallback)));
+            gif.frames.length--;
+            for (const frame of gif.frames) {
+                if (frame.userInputDelayFlag && frame.delayTime === 0) {
+                    gif.totalTime = Infinity;
+                    break;
+                }
+                gif.totalTime += frame.delayTime;
+            }
+            return gif;
+        }
+        catch (error) {
+            if (error instanceof EvalError) {
+                throw new Error(`error while parsing frame ${frameIndex} "${error.message}"`);
+            }
+            throw error;
+        }
+    }
+    exports.decodeGIF = decodeGIF;
+});

package/umd/ImageDrawer.js

@@ -4,74 +4,157 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./Utils"], factory);
+        define(["require", "exports", "@tsparticles/engine", "./Utils"], factory);
     }
 })(function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ImageDrawer = void 0;
+    const engine_1 = require("@tsparticles/engine");
     const Utils_1 = require("./Utils");
     class ImageDrawer {
-        constructor() {
-            this._images = [];
-        }
-        addImage(container, image) {
-            const containerImages = this.getImages(container);
-            containerImages === null || containerImages === void 0 ? void 0 : containerImages.images.push(image);
+        constructor(engine) {
+            this.loadImageShape = async (imageShape) => {
+                if (!this._engine.loadImage) {
+                    throw new Error(`${engine_1.errorPrefix} image shape not initialized`);
+                }
+                await this._engine.loadImage({
+                    gif: imageShape.gif,
+                    name: imageShape.name,
+                    replaceColor: imageShape.replaceColor ?? false,
+                    src: imageShape.src,
+                });
+            };
+            this._engine = engine;
         }
-        destroy() {
-            this._images = [];
+        addImage(image) {
+            if (!this._engine.images) {
+                this._engine.images = [];
+            }
+            this._engine.images.push(image);
         }
-        draw(context, particle, radius, opacity) {
-            var _a;
-            const image = particle.image, element = image === null || image === void 0 ? void 0 : image.element;
-            if (!element) {
+        draw(context, particle, radius, opacity, delta) {
+            const image = particle.image, element = image?.element;
+            if (!image) {
                 return;
             }
-            const ratio = (_a = image === null || image === void 0 ? void 0 : image.ratio) !== null && _a !== void 0 ? _a : 1, pos = {
-                x: -radius,
-                y: -radius,
-            };
             context.globalAlpha = opacity;
-            context.drawImage(element, pos.x, pos.y, radius * 2, (radius * 2) / ratio);
-            context.globalAlpha = 1;
-        }
-        getImages(container) {
-            const containerImages = this._images.find((t) => t.id === container.id);
-            if (!containerImages) {
-                this._images.push({
-                    id: container.id,
-                    images: [],
-                });
-                return this.getImages(container);
+            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);
             }
-            else {
-                return containerImages;
+            else if (element) {
+                const ratio = image.ratio, pos = {
+                    x: -radius,
+                    y: -radius,
+                };
+                context.drawImage(element, pos.x, pos.y, radius * 2, (radius * 2) / ratio);
             }
+            context.globalAlpha = 1;
         }
         getSidesCount() {
             return 12;
         }
+        async init(container) {
+            const options = container.actualOptions;
+            if (!options.preload || !this._engine.loadImage) {
+                return;
+            }
+            for (const imageData of options.preload) {
+                await this._engine.loadImage(imageData);
+            }
+        }
         loadShape(particle) {
             if (particle.shape !== "image" && particle.shape !== "images") {
                 return;
             }
-            const container = particle.container, images = this.getImages(container).images, imageData = particle.shapeData, image = images.find((t) => t.source === imageData.src);
+            if (!this._engine.images) {
+                this._engine.images = [];
+            }
+            const imageData = particle.shapeData, image = this._engine.images.find((t) => t.name === imageData.name || t.source === imageData.src);
             if (!image) {
-                this.loadImageShape(container, imageData).then(() => {
+                this.loadImageShape(imageData).then(() => {
                     this.loadShape(particle);
                 });
             }
         }
         particleInit(container, particle) {
-            var _a;
             if (particle.shape !== "image" && particle.shape !== "images") {
                 return;
             }
-            const images = this.getImages(container).images, imageData = particle.shapeData, color = particle.getFillColor(), replaceColor = (_a = imageData.replaceColor) !== null && _a !== void 0 ? _a : imageData.replace_color, image = images.find((t) => t.source === imageData.src);
+            if (!this._engine.images) {
+                this._engine.images = [];
+            }
+            const images = this._engine.images, imageData = particle.shapeData, color = particle.getFillColor(), image = images.find((t) => t.name === imageData.name || t.source === imageData.src);
             if (!image) {
                 return;
             }
+            const replaceColor = imageData.replaceColor ?? image.replaceColor;
             if (image.loading) {
                 setTimeout(() => {
                     this.particleInit(container, particle);
@@ -79,7 +162,6 @@
                 return;
             }
             (async () => {
-                var _a, _b;
                 let imageRes;
                 if (image.svgData && color) {
                     imageRes = await (0, Utils_1.replaceImageColor)(image, imageData, color, particle);
@@ -89,8 +171,11 @@
                         color,
                         data: image,
                         element: image.element,
+                        gif: image.gif,
+                        gifData: image.gifData,
+                        gifLoopCount: image.gifLoopCount,
                         loaded: true,
-                        ratio: imageData.width / imageData.height,
+                        ratio: imageData.width && imageData.height ? imageData.width / imageData.height : image.ratio ?? 1,
                         replaceColor: replaceColor,
                         source: imageData.src,
                     };
@@ -98,7 +183,7 @@
                 if (!imageRes.ratio) {
                     imageRes.ratio = 1;
                 }
-                const fill = (_a = imageData.fill) !== null && _a !== void 0 ? _a : particle.fill, close = (_b = imageData.close) !== null && _b !== void 0 ? _b : particle.close, imageShape = {
+                const fill = imageData.fill ?? particle.fill, close = imageData.close ?? particle.close, imageShape = {
                     image: imageRes,
                     fill,
                     close,
@@ -108,27 +193,6 @@
                 particle.close = imageShape.close;
             })();
         }
-        async loadImageShape(container, imageShape) {
-            var _a;
-            const source = imageShape.src;
-            if (!source) {
-                throw new Error("Error tsParticles - No image.src");
-            }
-            try {
-                const image = {
-                    source: source,
-                    type: source.substring(source.length - 3),
-                    error: false,
-                    loading: true,
-                };
-                this.addImage(container, image);
-                const imageFunc = ((_a = imageShape.replaceColor) !== null && _a !== void 0 ? _a : imageShape.replace_color) ? Utils_1.downloadSvgImage : Utils_1.loadImage;
-                await imageFunc(image);
-            }
-            catch (_b) {
-                throw new Error(`tsParticles error - ${imageShape.src} not found`);
-            }
-        }
     }
     exports.ImageDrawer = ImageDrawer;
 });

package/umd/ImagePreloader.js

@@ -0,0 +1,47 @@
+(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", "./Options/Classes/Preload"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.ImagePreloaderPlugin = void 0;
+    const Preload_1 = require("./Options/Classes/Preload");
+    class ImagePreloaderPlugin {
+        constructor(engine) {
+            this.id = "imagePreloader";
+            this._engine = engine;
+        }
+        getPlugin() {
+            return {};
+        }
+        loadOptions(options, source) {
+            if (!source || !source.preload) {
+                return;
+            }
+            if (!options.preload) {
+                options.preload = [];
+            }
+            const preloadOptions = options.preload;
+            for (const item of source.preload) {
+                const existing = preloadOptions.find((t) => t.name === item.name || t.src === item.src);
+                if (existing) {
+                    existing.load(item);
+                }
+                else {
+                    const preload = new Preload_1.Preload();
+                    preload.load(item);
+                    preloadOptions.push(preload);
+                }
+            }
+        }
+        needsPlugin() {
+            return true;
+        }
+    }
+    exports.ImagePreloaderPlugin = ImagePreloaderPlugin;
+});

package/umd/Options/Classes/Preload.js

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