excalibur 0.32.0-alpha.1591 → 0.32.0-alpha.1592

package/build/dist/Graphics/SpriteSheet.d.ts

@@ -1,4 +1,4 @@
-import type { ImageSource } from './ImageSource';
+import { ImageSource } from './ImageSource';
 import type { SourceView } from './Sprite';
 import { Sprite } from './Sprite';
 import type { GraphicOptions } from './Graphic';
@@ -130,6 +130,19 @@ export declare class SpriteSheet {
      * @param options
      */
     getTiledSprite(x: number, y: number, options?: Partial<Omit<TiledSpriteOptions & GraphicOptions, 'image'>>): TiledSprite;
+    /**
+     * Returns a sprite that has a new backing image the exact size of the sprite that tha is a copy of the original sprite slice.
+     *
+     * Useful if you need to apply effects, manipulate, or mutate the image and you don't want to disturb the original sprite sheet.
+     *
+     */
+    getSpriteAsStandalone(x: number, y: number): Promise<Sprite>;
+    /**
+     * Returns a new image exact size and copy of the original sprite slice.
+     *
+     * Useful if you need to apply effects, manipulate, or mutate the image and you don't want to disturb the original sprite sheet.
+     */
+    getSpriteAsImage(x: number, y: number): Promise<HTMLImageElement>;
     /**
      * Create a sprite sheet from a sparse set of {@apilink SourceView} rectangles
      * @param options

package/build/dist/excalibur.development.js

@@ -1,4 +1,4 @@
-/*! excalibur - 0.32.0-alpha.1591+851fc99 - 2025-12-6
+/*! excalibur - 0.32.0-alpha.1592+3ba41a7 - 2025-12-6
 https://github.com/excaliburjs/Excalibur
 Copyright (c) 2025 Excalibur.js <https://github.com/excaliburjs/Excalibur/graphs/contributors>
 Licensed BSD-2-Clause
@@ -11212,6 +11212,104 @@ Read more here: https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/WebGL
       }
       throw Error(`Invalid sprite coordinates (${x}, ${y})`);
     }
+    /**
+     * Returns a sprite that has a new backing image the exact size of the sprite that tha is a copy of the original sprite slice.
+     *
+     * Useful if you need to apply effects, manipulate, or mutate the image and you don't want to disturb the original sprite sheet.
+     *
+     */
+    async getSpriteAsStandalone(x, y) {
+      if (x >= this.columns || x < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), x: ${x} should be between 0 and ${this.columns - 1} columns`);
+      }
+      if (y >= this.rows || y < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), y: ${y} should be between 0 and ${this.rows - 1} rows`);
+      }
+      const spriteIndex = x + y * this.columns;
+      const sprite = this.sprites[spriteIndex];
+      const cnv = document.createElement("canvas");
+      const ctx = cnv.getContext("2d");
+      cnv.width = sprite.width;
+      cnv.height = sprite.height;
+      if (!sprite) {
+        throw Error(`Invalid sprite coordinates (${x}, ${y})`);
+      }
+      if (!ctx) {
+        throw Error("Unable to create canvas context");
+      }
+      ctx.drawImage(
+        sprite.image.image,
+        sprite.sourceView.x,
+        sprite.sourceView.y,
+        sprite.sourceView.width,
+        sprite.sourceView.height,
+        0,
+        0,
+        sprite.sourceView.width,
+        sprite.sourceView.height
+      );
+      const imgSrc = new ImageSource(cnv.toDataURL());
+      await imgSrc.load();
+      return new Sprite({
+        image: imgSrc,
+        sourceView: {
+          x: 0,
+          y: 0,
+          width: sprite.width,
+          height: sprite.height
+        },
+        destSize: {
+          width: sprite.width,
+          height: sprite.height
+        }
+      });
+    }
+    /**
+     * Returns a new image exact size and copy of the original sprite slice.
+     *
+     * Useful if you need to apply effects, manipulate, or mutate the image and you don't want to disturb the original sprite sheet.
+     */
+    async getSpriteAsImage(x, y) {
+      if (x >= this.columns || x < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), x: ${x} should be between 0 and ${this.columns - 1} columns`);
+      }
+      if (y >= this.rows || y < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), y: ${y} should be between 0 and ${this.rows - 1} rows`);
+      }
+      const spriteIndex = x + y * this.columns;
+      const sprite = this.sprites[spriteIndex];
+      const cnv = document.createElement("canvas");
+      const ctx = cnv.getContext("2d");
+      cnv.width = sprite.width;
+      cnv.height = sprite.height;
+      if (!sprite) {
+        throw Error(`Invalid sprite coordinates (${x}, ${y})`);
+      }
+      if (!ctx) {
+        throw Error("Unable to create canvas context");
+      }
+      ctx.drawImage(
+        sprite.image.image,
+        sprite.sourceView.x,
+        sprite.sourceView.y,
+        sprite.sourceView.width,
+        sprite.sourceView.height,
+        0,
+        0,
+        sprite.sourceView.width,
+        sprite.sourceView.height
+      );
+      const imgSrc = new Image(sprite.width, sprite.height);
+      imgSrc.src = cnv.toDataURL();
+      return await new Promise((resolve, reject) => {
+        imgSrc.onload = () => {
+          resolve(imgSrc);
+        };
+        imgSrc.onerror = (e) => {
+          reject(e);
+        };
+      });
+    }
     /**
      * Create a sprite sheet from a sparse set of {@apilink SourceView} rectangles
      * @param options
@@ -33472,7 +33570,7 @@ Read more about this issue at https://excaliburjs.com/docs/performance`
       this._count += count;
     }
   }
-  const EX_VERSION = "0.32.0-alpha.1591+851fc99";
+  const EX_VERSION = "0.32.0-alpha.1592+3ba41a7";
   polyfill();
   exports2.ActionCompleteEvent = ActionCompleteEvent;
   exports2.ActionContext = ActionContext;

package/build/dist/excalibur.js

@@ -1,4 +1,4 @@
-/*! excalibur - 0.32.0-alpha.1591+851fc99 - 2025-12-6
+/*! excalibur - 0.32.0-alpha.1592+3ba41a7 - 2025-12-6
 https://github.com/excaliburjs/Excalibur
 Copyright (c) 2025 Excalibur.js <https://github.com/excaliburjs/Excalibur/graphs/contributors>
 Licensed BSD-2-Clause
@@ -11212,6 +11212,104 @@ Read more here: https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/WebGL
       }
       throw Error(`Invalid sprite coordinates (${x}, ${y})`);
     }
+    /**
+     * Returns a sprite that has a new backing image the exact size of the sprite that tha is a copy of the original sprite slice.
+     *
+     * Useful if you need to apply effects, manipulate, or mutate the image and you don't want to disturb the original sprite sheet.
+     *
+     */
+    async getSpriteAsStandalone(x, y) {
+      if (x >= this.columns || x < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), x: ${x} should be between 0 and ${this.columns - 1} columns`);
+      }
+      if (y >= this.rows || y < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), y: ${y} should be between 0 and ${this.rows - 1} rows`);
+      }
+      const spriteIndex = x + y * this.columns;
+      const sprite = this.sprites[spriteIndex];
+      const cnv = document.createElement("canvas");
+      const ctx = cnv.getContext("2d");
+      cnv.width = sprite.width;
+      cnv.height = sprite.height;
+      if (!sprite) {
+        throw Error(`Invalid sprite coordinates (${x}, ${y})`);
+      }
+      if (!ctx) {
+        throw Error("Unable to create canvas context");
+      }
+      ctx.drawImage(
+        sprite.image.image,
+        sprite.sourceView.x,
+        sprite.sourceView.y,
+        sprite.sourceView.width,
+        sprite.sourceView.height,
+        0,
+        0,
+        sprite.sourceView.width,
+        sprite.sourceView.height
+      );
+      const imgSrc = new ImageSource(cnv.toDataURL());
+      await imgSrc.load();
+      return new Sprite({
+        image: imgSrc,
+        sourceView: {
+          x: 0,
+          y: 0,
+          width: sprite.width,
+          height: sprite.height
+        },
+        destSize: {
+          width: sprite.width,
+          height: sprite.height
+        }
+      });
+    }
+    /**
+     * Returns a new image exact size and copy of the original sprite slice.
+     *
+     * Useful if you need to apply effects, manipulate, or mutate the image and you don't want to disturb the original sprite sheet.
+     */
+    async getSpriteAsImage(x, y) {
+      if (x >= this.columns || x < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), x: ${x} should be between 0 and ${this.columns - 1} columns`);
+      }
+      if (y >= this.rows || y < 0) {
+        throw Error(`No sprite exists in the SpriteSheet at (${x}, ${y}), y: ${y} should be between 0 and ${this.rows - 1} rows`);
+      }
+      const spriteIndex = x + y * this.columns;
+      const sprite = this.sprites[spriteIndex];
+      const cnv = document.createElement("canvas");
+      const ctx = cnv.getContext("2d");
+      cnv.width = sprite.width;
+      cnv.height = sprite.height;
+      if (!sprite) {
+        throw Error(`Invalid sprite coordinates (${x}, ${y})`);
+      }
+      if (!ctx) {
+        throw Error("Unable to create canvas context");
+      }
+      ctx.drawImage(
+        sprite.image.image,
+        sprite.sourceView.x,
+        sprite.sourceView.y,
+        sprite.sourceView.width,
+        sprite.sourceView.height,
+        0,
+        0,
+        sprite.sourceView.width,
+        sprite.sourceView.height
+      );
+      const imgSrc = new Image(sprite.width, sprite.height);
+      imgSrc.src = cnv.toDataURL();
+      return await new Promise((resolve, reject) => {
+        imgSrc.onload = () => {
+          resolve(imgSrc);
+        };
+        imgSrc.onerror = (e) => {
+          reject(e);
+        };
+      });
+    }
     /**
      * Create a sprite sheet from a sparse set of {@apilink SourceView} rectangles
      * @param options
@@ -33472,7 +33570,7 @@ Read more about this issue at https://excaliburjs.com/docs/performance`
       this._count += count;
     }
   }
-  const EX_VERSION = "0.32.0-alpha.1591+851fc99";
+  const EX_VERSION = "0.32.0-alpha.1592+3ba41a7";
   polyfill();
   exports2.ActionCompleteEvent = ActionCompleteEvent;
   exports2.ActionContext = ActionContext;