@vitykovskiy/canvas-sprite-animations 0.1.2 → 0.1.4

package/README.md

@@ -13,13 +13,17 @@ npm install @vitykovskiy/canvas-sprite-animations
 - GitHub: https://github.com/Vitykovskiy/sprite-animations
 - Playground: https://vitykovskiy.github.io/sprite-animations/
 
+The hosted playground is a Vue 3 app built on top of the same framework-agnostic runtime API exposed by the package.
+
 ## Usage
 
 ```ts
 import {
   createAnimationPlayer,
   createCanvasSpriteRenderer,
+  createFrameSequence,
   createSpriteSheet,
+  loadFrameSequence,
   loadSpriteSheetImage,
 } from "@vitykovskiy/canvas-sprite-animations";
 
@@ -46,6 +50,33 @@ const player = createAnimationPlayer({
 const renderer = createCanvasSpriteRenderer();
 ```
 
+```ts
+import {
+  createAnimationPlayer,
+  createCanvasSpriteRenderer,
+  createFrameSequence,
+  loadFrameSequence,
+} from "@vitykovskiy/canvas-sprite-animations";
+
+const loadedFrames = await loadFrameSequence([
+  "/assets/run-01.png",
+  "/assets/run-02.png",
+  "/assets/run-03.png",
+]);
+
+const frameSequence = createFrameSequence({
+  frames: loadedFrames.map((frame) => frame.image),
+});
+
+const player = createAnimationPlayer({
+  totalFrames: frameSequence.getFrameCount(),
+  fps: 12,
+  loop: true,
+});
+
+const renderer = createCanvasSpriteRenderer();
+```
+
 ## Entry Points
 
 - `@vitykovskiy/canvas-sprite-animations`
@@ -58,9 +89,15 @@ const renderer = createCanvasSpriteRenderer();
 - `loadSpriteSheetImage(...)`
   Loads a sprite sheet from a URL, `HTMLImageElement`, or `ImageBitmap`.
 
+- `loadFrameSequence(...)`
+  Loads a frame sequence from an array of URLs, `HTMLImageElement`, or `ImageBitmap`.
+
 - `createSpriteSheet(...)`
   Creates a regular-grid sprite sheet model.
 
+- `createFrameSequence(...)`
+  Creates a frame-sequence model from separate images.
+
 - `createAnimationPlayer(...)`
   Controls playback state and frame timing.
 
@@ -78,6 +115,7 @@ const renderer = createCanvasSpriteRenderer();
 Current MVP scope:
 
 - regular grid sprite sheets
+- frame sequences from separate images
 - canvas rendering
 - runtime playback with `fps` and/or `duration`
 - predictable positioning and scaling

package/dist/core/asset-loader.d.ts

@@ -1,3 +1,4 @@
-import type { LoadedSpriteSheetImage, LoadSpriteSheetImageOptions, SpriteSheetImageSource } from "../types.js";
+import type { FrameImageSource, LoadedFrameImage, LoadFrameSequenceOptions, LoadedSpriteSheetImage, LoadSpriteSheetImageOptions, SpriteSheetImageSource } from "../types.js";
 export declare function loadSpriteSheetImage(source: SpriteSheetImageSource, options?: LoadSpriteSheetImageOptions): Promise<LoadedSpriteSheetImage>;
+export declare function loadFrameSequence(sources: readonly FrameImageSource[], options?: LoadFrameSequenceOptions): Promise<LoadedFrameImage[]>;
 //# sourceMappingURL=asset-loader.d.ts.map

package/dist/core/asset-loader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"asset-loader.d.ts","sourceRoot":"","sources":["../../src/core/asset-loader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,sBAAsB,EACtB,2BAA2B,EAC3B,sBAAsB,EACvB,MAAM,aAAa,CAAC;AAErB,wBAAsB,oBAAoB,CACxC,MAAM,EAAE,sBAAsB,EAC9B,OAAO,GAAE,2BAAgC,GACxC,OAAO,CAAC,sBAAsB,CAAC,CAoBjC"}
+{"version":3,"file":"asset-loader.d.ts","sourceRoot":"","sources":["../../src/core/asset-loader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,gBAAgB,EAChB,gBAAgB,EAChB,wBAAwB,EACxB,sBAAsB,EACtB,2BAA2B,EAC3B,sBAAsB,EACvB,MAAM,aAAa,CAAC;AAErB,wBAAsB,oBAAoB,CACxC,MAAM,EAAE,sBAAsB,EAC9B,OAAO,GAAE,2BAAgC,GACxC,OAAO,CAAC,sBAAsB,CAAC,CAEjC;AAED,wBAAsB,iBAAiB,CACrC,OAAO,EAAE,SAAS,gBAAgB,EAAE,EACpC,OAAO,GAAE,wBAA6B,GACrC,OAAO,CAAC,gBAAgB,EAAE,CAAC,CAQ7B"}

package/dist/core/asset-loader.js

@@ -1,4 +1,13 @@
 export async function loadSpriteSheetImage(source, options = {}) {
+    return loadImageAsset(source, options);
+}
+export async function loadFrameSequence(sources, options = {}) {
+    if (!Array.isArray(sources) || sources.length === 0) {
+        throw new Error("sources must contain at least one frame image.");
+    }
+    return Promise.all(sources.map((source) => loadImageAsset(source, options)));
+}
+async function loadImageAsset(source, options) {
     if (typeof source === "string") {
         return loadImageFromUrl(source, options);
     }
@@ -40,7 +49,7 @@ function waitForImageElement(image) {
         };
         const handleError = () => {
             cleanup();
-            reject(new Error("Failed to load sprite sheet image."));
+            reject(new Error("Failed to load image."));
         };
         const cleanup = () => {
             image.removeEventListener("load", handleLoad);

package/dist/core/asset-loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"asset-loader.js","sourceRoot":"","sources":["../../src/core/asset-loader.ts"],"names":[],"mappings":"AAMA,MAAM,CAAC,KAAK,UAAU,oBAAoB,CACxC,MAA8B,EAC9B,UAAuC,EAAE;IAEzC,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE,CAAC;QAC/B,OAAO,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC3C,CAAC;IAED,IAAI,aAAa,CAAC,MAAM,CAAC,EAAE,CAAC;QAC1B,OAAO;YACL,KAAK,EAAE,MAAM;YACb,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,MAAM,EAAE,MAAM,CAAC,MAAM;SACtB,CAAC;IACJ,CAAC;IAED,MAAM,mBAAmB,CAAC,MAAM,CAAC,CAAC;IAElC,OAAO;QACL,KAAK,EAAE,MAAM;QACb,KAAK,EAAE,MAAM,CAAC,YAAY;QAC1B,MAAM,EAAE,MAAM,CAAC,aAAa;KAC7B,CAAC;AACJ,CAAC;AAED,KAAK,UAAU,gBAAgB,CAC7B,GAAW,EACX,OAAoC;IAEpC,MAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;IAE1B,IAAI,OAAO,CAAC,WAAW,KAAK,SAAS,EAAE,CAAC;QACtC,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;IAC1C,CAAC;IAED,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;IAEhB,MAAM,mBAAmB,CAAC,KAAK,CAAC,CAAC;IAEjC,OAAO;QACL,KAAK;QACL,KAAK,EAAE,KAAK,CAAC,YAAY;QACzB,MAAM,EAAE,KAAK,CAAC,aAAa;KAC5B,CAAC;AACJ,CAAC;AAED,SAAS,mBAAmB,CAAC,KAAuB;IAClD,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,YAAY,GAAG,CAAC,EAAE,CAAC;QAC7C,OAAO,OAAO,CAAC,OAAO,EAAE,CAAC;IAC3B,CAAC;IAED,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QACrC,MAAM,UAAU,GAAG,GAAG,EAAE;YACtB,OAAO,EAAE,CAAC;YACV,OAAO,EAAE,CAAC;QACZ,CAAC,CAAC;QAEF,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,OAAO,EAAE,CAAC;YACV,MAAM,CAAC,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAC,CAAC;QAC1D,CAAC,CAAC;QAEF,MAAM,OAAO,GAAG,GAAG,EAAE;YACnB,KAAK,CAAC,mBAAmB,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;YAC9C,KAAK,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAClD,CAAC,CAAC;QAEF,KAAK,CAAC,gBAAgB,CAAC,MAAM,EAAE,UAAU,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;QAC3D,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;AACL,CAAC;AAED,SAAS,aAAa,CAAC,KAA6B;IAClD,OAAO,OAAO,WAAW,KAAK,WAAW,IAAI,KAAK,YAAY,WAAW,CAAC;AAC5E,CAAC"}
+{"version":3,"file":"asset-loader.js","sourceRoot":"","sources":["../../src/core/asset-loader.ts"],"names":[],"mappings":"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"}

package/dist/core/frame-sequence.d.ts

@@ -0,0 +1,3 @@
+import type { FrameSequence, FrameSequenceConfig } from "../types.js";
+export declare function createFrameSequence(config: FrameSequenceConfig): FrameSequence;
+//# sourceMappingURL=frame-sequence.d.ts.map

package/dist/core/frame-sequence.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-sequence.d.ts","sourceRoot":"","sources":["../../src/core/frame-sequence.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,aAAa,EACb,mBAAmB,EAEpB,MAAM,aAAa,CAAC;AAErB,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,mBAAmB,GAAG,aAAa,CAY9E"}

package/dist/core/frame-sequence.js

@@ -0,0 +1,55 @@
+export function createFrameSequence(config) {
+    const frames = normalizeFrames(config.frames);
+    return {
+        frames,
+        getFrameCount() {
+            return frames.length;
+        },
+        getFrame(frameIndex) {
+            return resolveFrame(frames, frameIndex);
+        },
+    };
+}
+function normalizeFrames(frames) {
+    if (!Array.isArray(frames) || frames.length === 0) {
+        throw new Error("frames must contain at least one image.");
+    }
+    return frames;
+}
+function resolveFrame(frames, frameIndex) {
+    if (!Number.isInteger(frameIndex) || frameIndex < 0) {
+        throw new Error("frameIndex must be a non-negative integer.");
+    }
+    if (frameIndex >= frames.length) {
+        throw new Error("frameIndex is outside the configured frame sequence range.");
+    }
+    const image = frames[frameIndex];
+    if (!image) {
+        throw new Error("frameIndex is outside the configured frame sequence range.");
+    }
+    const dimensions = getImageDimensions(image);
+    return {
+        image,
+        x: 0,
+        y: 0,
+        width: dimensions.width,
+        height: dimensions.height,
+        index: frameIndex,
+    };
+}
+function getImageDimensions(image) {
+    if ("naturalWidth" in image && "naturalHeight" in image) {
+        return {
+            width: image.naturalWidth,
+            height: image.naturalHeight,
+        };
+    }
+    if ("width" in image && "height" in image) {
+        return {
+            width: image.width,
+            height: image.height,
+        };
+    }
+    throw new Error("Frame image must expose width and height.");
+}
+//# sourceMappingURL=frame-sequence.js.map

package/dist/core/frame-sequence.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-sequence.js","sourceRoot":"","sources":["../../src/core/frame-sequence.ts"],"names":[],"mappings":"AAOA,MAAM,UAAU,mBAAmB,CAAC,MAA2B;IAC7D,MAAM,MAAM,GAAG,eAAe,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IAE9C,OAAO;QACL,MAAM;QACN,aAAa;YACX,OAAO,MAAM,CAAC,MAAM,CAAC;QACvB,CAAC;QACD,QAAQ,CAAC,UAAU;YACjB,OAAO,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QAC1C,CAAC;KACF,CAAC;AACJ,CAAC;AAED,SAAS,eAAe,CAAC,MAA4B;IACnD,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAClD,MAAM,IAAI,KAAK,CAAC,yCAAyC,CAAC,CAAC;IAC7D,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,YAAY,CACnB,MAAqC,EACrC,UAAkB;IAElB,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,IAAI,UAAU,GAAG,CAAC,EAAE,CAAC;QACpD,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAC;IAChE,CAAC;IAED,IAAI,UAAU,IAAI,MAAM,CAAC,MAAM,EAAE,CAAC;QAChC,MAAM,IAAI,KAAK,CAAC,4DAA4D,CAAC,CAAC;IAChF,CAAC;IAED,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;IAEjC,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,4DAA4D,CAAC,CAAC;IAChF,CAAC;IAED,MAAM,UAAU,GAAG,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAE7C,OAAO;QACL,KAAK;QACL,CAAC,EAAE,CAAC;QACJ,CAAC,EAAE,CAAC;QACJ,KAAK,EAAE,UAAU,CAAC,KAAK;QACvB,MAAM,EAAE,UAAU,CAAC,MAAM;QACzB,KAAK,EAAE,UAAU;KAClB,CAAC;AACJ,CAAC;AAED,SAAS,kBAAkB,CAAC,KAAyB;IACnD,IAAI,cAAc,IAAI,KAAK,IAAI,eAAe,IAAI,KAAK,EAAE,CAAC;QACxD,OAAO;YACL,KAAK,EAAE,KAAK,CAAC,YAAY;YACzB,MAAM,EAAE,KAAK,CAAC,aAAa;SAC5B,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,IAAI,KAAK,IAAI,QAAQ,IAAI,KAAK,EAAE,CAAC;QAC1C,OAAO;YACL,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,MAAM,EAAE,KAAK,CAAC,MAAM;SACrB,CAAC;IACJ,CAAC;IAED,MAAM,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC;AAC/D,CAAC"}

package/dist/core/index.d.ts

@@ -1,4 +1,5 @@
 export { createSpriteSheet } from "./sprite-sheet.js";
+export { createFrameSequence } from "./frame-sequence.js";
 export { createAnimationPlayer } from "./animation-player.js";
-export { loadSpriteSheetImage } from "./asset-loader.js";
+export { loadFrameSequence, loadSpriteSheetImage } from "./asset-loader.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/core/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/core/index.js

@@ -1,4 +1,5 @@
 export { createSpriteSheet } from "./sprite-sheet.js";
+export { createFrameSequence } from "./frame-sequence.js";
 export { createAnimationPlayer } from "./animation-player.js";
-export { loadSpriteSheetImage } from "./asset-loader.js";
+export { loadFrameSequence, loadSpriteSheetImage } from "./asset-loader.js";
 //# sourceMappingURL=index.js.map

package/dist/core/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/core/sprite-sheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sprite-sheet.d.ts","sourceRoot":"","sources":["../../src/core/sprite-sheet.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAa,WAAW,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAE7E,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,iBAAiB,GAAG,WAAW,CAaxE"}
+{"version":3,"file":"sprite-sheet.d.ts","sourceRoot":"","sources":["../../src/core/sprite-sheet.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAGV,WAAW,EACX,iBAAiB,EAClB,MAAM,aAAa,CAAC;AAErB,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,iBAAiB,GAAG,WAAW,CAqBxE"}

package/dist/core/sprite-sheet.js

@@ -9,6 +9,13 @@ export function createSpriteSheet(config) {
         getFrameRect(frameIndex) {
             return getFrameRect(normalizedGrid, frameIndex);
         },
+        getFrame(frameIndex) {
+            const frame = getFrameRect(normalizedGrid, frameIndex);
+            return {
+                ...frame,
+                image: config.image,
+            };
+        },
     };
 }
 function normalizeGrid(config) {

package/dist/core/sprite-sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sprite-sheet.js","sourceRoot":"","sources":["../../src/core/sprite-sheet.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,iBAAiB,CAAC,MAAyB;IACzD,MAAM,cAAc,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAE7C,OAAO;QACL,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,IAAI,EAAE,cAAc;QACpB,aAAa;YACX,OAAO,cAAc,CAAC,WAAW,CAAC;QACpC,CAAC;QACD,YAAY,CAAC,UAAU;YACrB,OAAO,YAAY,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC;QAClD,CAAC;KACF,CAAC;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,MAAyB;IAC9C,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,MAAM,CAAC,IAAI,CAAC;IAE/D,IAAI,UAAU,IAAI,CAAC,IAAI,WAAW,IAAI,CAAC,EAAE,CAAC;QACxC,MAAM,IAAI,KAAK,CAAC,oDAAoD,CAAC,CAAC;IACxE,CAAC;IAED,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,EAAE,CAAC;QAC/C,MAAM,IAAI,KAAK,CAAC,qCAAqC,CAAC,CAAC;IACzD,CAAC;IAED,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,CAAC;QACzC,MAAM,IAAI,KAAK,CAAC,kCAAkC,CAAC,CAAC;IACtD,CAAC;IAED,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,IAAI,OAAO,GAAG,IAAI,CAAC;IAE9D,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,WAAW,IAAI,CAAC,EAAE,CAAC;QACvD,MAAM,IAAI,KAAK,CAAC,uDAAuD,CAAC,CAAC;IAC3E,CAAC;IAED,IAAI,WAAW,GAAG,OAAO,GAAG,IAAI,EAAE,CAAC;QACjC,MAAM,IAAI,KAAK,CAAC,kEAAkE,CAAC,CAAC;IACtF,CAAC;IAED,OAAO;QACL,UAAU;QACV,WAAW;QACX,OAAO;QACP,IAAI;QACJ,WAAW;KACZ,CAAC;AACJ,CAAC;AAED,SAAS,YAAY,CACnB,IAAyC,EACzC,UAAkB;IAElB,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,IAAI,UAAU,GAAG,CAAC,EAAE,CAAC;QACpD,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAC;IAChE,CAAC;IAED,IAAI,UAAU,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;QACnC,MAAM,IAAI,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IAED,MAAM,WAAW,GAAG,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC;IAC9C,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;IAEvD,OAAO;QACL,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC,UAAU;QAChC,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC,WAAW;QAC9B,KAAK,EAAE,IAAI,CAAC,UAAU;QACtB,MAAM,EAAE,IAAI,CAAC,WAAW;QACxB,KAAK,EAAE,UAAU;KAClB,CAAC;AACJ,CAAC"}
+{"version":3,"file":"sprite-sheet.js","sourceRoot":"","sources":["../../src/core/sprite-sheet.ts"],"names":[],"mappings":"AAOA,MAAM,UAAU,iBAAiB,CAAC,MAAyB;IACzD,MAAM,cAAc,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAE7C,OAAO;QACL,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,IAAI,EAAE,cAAc;QACpB,aAAa;YACX,OAAO,cAAc,CAAC,WAAW,CAAC;QACpC,CAAC;QACD,YAAY,CAAC,UAAU;YACrB,OAAO,YAAY,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC;QAClD,CAAC;QACD,QAAQ,CAAC,UAAU;YACjB,MAAM,KAAK,GAAG,YAAY,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC;YAEvD,OAAO;gBACL,GAAG,KAAK;gBACR,KAAK,EAAE,MAAM,CAAC,KAAK;aACpB,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,MAAyB;IAC9C,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,MAAM,CAAC,IAAI,CAAC;IAE/D,IAAI,UAAU,IAAI,CAAC,IAAI,WAAW,IAAI,CAAC,EAAE,CAAC;QACxC,MAAM,IAAI,KAAK,CAAC,oDAAoD,CAAC,CAAC;IACxE,CAAC;IAED,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,EAAE,CAAC;QAC/C,MAAM,IAAI,KAAK,CAAC,qCAAqC,CAAC,CAAC;IACzD,CAAC;IAED,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,CAAC;QACzC,MAAM,IAAI,KAAK,CAAC,kCAAkC,CAAC,CAAC;IACtD,CAAC;IAED,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,IAAI,OAAO,GAAG,IAAI,CAAC;IAE9D,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,WAAW,IAAI,CAAC,EAAE,CAAC;QACvD,MAAM,IAAI,KAAK,CAAC,uDAAuD,CAAC,CAAC;IAC3E,CAAC;IAED,IAAI,WAAW,GAAG,OAAO,GAAG,IAAI,EAAE,CAAC;QACjC,MAAM,IAAI,KAAK,CAAC,kEAAkE,CAAC,CAAC;IACtF,CAAC;IAED,OAAO;QACL,UAAU;QACV,WAAW;QACX,OAAO;QACP,IAAI;QACJ,WAAW;KACZ,CAAC;AACJ,CAAC;AAED,SAAS,YAAY,CACnB,IAAyC,EACzC,UAAkB;IAElB,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,IAAI,UAAU,GAAG,CAAC,EAAE,CAAC;QACpD,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAC;IAChE,CAAC;IAED,IAAI,UAAU,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;QACnC,MAAM,IAAI,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IAED,MAAM,WAAW,GAAG,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC;IAC9C,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;IAEvD,OAAO;QACL,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC,UAAU;QAChC,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC,WAAW;QAC9B,KAAK,EAAE,IAAI,CAAC,UAAU;QACtB,MAAM,EAAE,IAAI,CAAC,WAAW;QACxB,KAAK,EAAE,UAAU;KAClB,CAAC;AACJ,CAAC"}

package/dist/renderers/create-canvas-sprite-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-canvas-sprite-renderer.d.ts","sourceRoot":"","sources":["../../src/renderers/create-canvas-sprite-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EAGrB,MAAM,aAAa,CAAC;AAErB,wBAAgB,0BAA0B,IAAI,oBAAoB,CA0BjE"}
+{"version":3,"file":"create-canvas-sprite-renderer.d.ts","sourceRoot":"","sources":["../../src/renderers/create-canvas-sprite-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,oBAAoB,EAErB,MAAM,aAAa,CAAC;AAErB,wBAAgB,0BAA0B,IAAI,oBAAoB,CA0BjE"}

package/dist/renderers/create-canvas-sprite-renderer.js

@@ -1,11 +1,11 @@
 export function createCanvasSpriteRenderer() {
     return {
-        draw(context, spriteSheet, options) {
-            const frame = spriteSheet.getFrameRect(options.frameIndex);
+        draw(context, source, options) {
+            const frame = source.getFrame(options.frameIndex);
             const scale = options.scale ?? 1;
             const destinationWidth = options.destinationWidth ?? frame.width * scale;
             const destinationHeight = options.destinationHeight ?? frame.height * scale;
-            context.drawImage(spriteSheet.image, frame.x, frame.y, frame.width, frame.height, options.position.x, options.position.y, destinationWidth, destinationHeight);
+            context.drawImage(frame.image, frame.x, frame.y, frame.width, frame.height, options.position.x, options.position.y, destinationWidth, destinationHeight);
         },
     };
 }

package/dist/renderers/create-canvas-sprite-renderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-canvas-sprite-renderer.js","sourceRoot":"","sources":["../../src/renderers/create-canvas-sprite-renderer.ts"],"names":[],"mappings":"AAMA,MAAM,UAAU,0BAA0B;IACxC,OAAO;QACL,IAAI,CACF,OAAiC,EACjC,WAAwB,EACxB,OAA0B;YAE1B,MAAM,KAAK,GAAG,WAAW,CAAC,YAAY,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;YAC3D,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,IAAI,CAAC,CAAC;YACjC,MAAM,gBAAgB,GAAG,OAAO,CAAC,gBAAgB,IAAI,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;YACzE,MAAM,iBAAiB,GACrB,OAAO,CAAC,iBAAiB,IAAI,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;YAEpD,OAAO,CAAC,SAAS,CACf,WAAW,CAAC,KAAK,EACjB,KAAK,CAAC,CAAC,EACP,KAAK,CAAC,CAAC,EACP,KAAK,CAAC,KAAK,EACX,KAAK,CAAC,MAAM,EACZ,OAAO,CAAC,QAAQ,CAAC,CAAC,EAClB,OAAO,CAAC,QAAQ,CAAC,CAAC,EAClB,gBAAgB,EAChB,iBAAiB,CAClB,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC"}
+{"version":3,"file":"create-canvas-sprite-renderer.js","sourceRoot":"","sources":["../../src/renderers/create-canvas-sprite-renderer.ts"],"names":[],"mappings":"AAMA,MAAM,UAAU,0BAA0B;IACxC,OAAO;QACL,IAAI,CACF,OAAiC,EACjC,MAA4B,EAC5B,OAA0B;YAE1B,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;YAClD,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,IAAI,CAAC,CAAC;YACjC,MAAM,gBAAgB,GAAG,OAAO,CAAC,gBAAgB,IAAI,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;YACzE,MAAM,iBAAiB,GACrB,OAAO,CAAC,iBAAiB,IAAI,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;YAEpD,OAAO,CAAC,SAAS,CACf,KAAK,CAAC,KAAK,EACX,KAAK,CAAC,CAAC,EACP,KAAK,CAAC,CAAC,EACP,KAAK,CAAC,KAAK,EACX,KAAK,CAAC,MAAM,EACZ,OAAO,CAAC,QAAQ,CAAC,CAAC,EAClB,OAAO,CAAC,QAAQ,CAAC,CAAC,EAClB,gBAAgB,EAChB,iBAAiB,CAClB,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC"}

package/dist/types.d.ts

@@ -6,6 +6,8 @@ export interface SpriteSheetGrid {
     totalFrames?: number;
 }
 export type SpriteSheetImageSource = string | HTMLImageElement | ImageBitmap;
+export type FrameImageSource = SpriteSheetImageSource;
+export type FrameSequenceImage = HTMLImageElement | ImageBitmap | HTMLCanvasElement | OffscreenCanvas;
 export interface LoadSpriteSheetImageOptions {
     crossOrigin?: string;
 }
@@ -14,6 +16,11 @@ export interface LoadedSpriteSheetImage {
     width: number;
     height: number;
 }
+export interface LoadedFrameImage {
+    image: HTMLImageElement | ImageBitmap;
+    width: number;
+    height: number;
+}
 export interface SpriteSheetConfig {
     image: CanvasImageSource;
     grid: SpriteSheetGrid;
@@ -25,11 +32,29 @@ export interface FrameRect {
     height: number;
     index: number;
 }
+export interface DrawableFrame extends FrameRect {
+    image: CanvasImageSource;
+}
 export interface SpriteSheet {
     readonly image: CanvasImageSource;
     readonly grid: Required<SpriteSheetGrid>;
     getFrameCount(): number;
     getFrameRect(frameIndex: number): FrameRect;
+    getFrame(frameIndex: number): DrawableFrame;
+}
+export interface FrameSequenceConfig {
+    frames: FrameSequenceImage[];
+}
+export interface FrameSequence {
+    readonly frames: readonly FrameSequenceImage[];
+    getFrameCount(): number;
+    getFrame(frameIndex: number): DrawableFrame;
+}
+export interface LoadFrameSequenceOptions extends LoadSpriteSheetImageOptions {
+}
+export interface AnimationFrameSource {
+    getFrameCount(): number;
+    getFrame(frameIndex: number): DrawableFrame;
 }
 export interface AnimationTimingConfig {
     fps?: number;
@@ -68,6 +93,6 @@ export interface DrawSpriteOptions {
     destinationHeight?: number;
 }
 export interface CanvasSpriteRenderer {
-    draw(context: CanvasRenderingContext2D, spriteSheet: SpriteSheet, options: DrawSpriteOptions): void;
+    draw(context: CanvasRenderingContext2D, source: AnimationFrameSource, options: DrawSpriteOptions): void;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,MAAM,sBAAsB,GAAG,MAAM,GAAG,gBAAgB,GAAG,WAAW,CAAC;AAE7E,MAAM,WAAW,2BAA2B;IAC1C,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,gBAAgB,GAAG,WAAW,CAAC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,iBAAiB,CAAC;IACzB,IAAI,EAAE,eAAe,CAAC;CACvB;AAED,MAAM,WAAW,SAAS;IACxB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,KAAK,EAAE,iBAAiB,CAAC;IAClC,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC;IACzC,aAAa,IAAI,MAAM,CAAC;IACxB,YAAY,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;CAC7C;AAED,MAAM,WAAW,qBAAqB;IACpC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,qBAAsB,SAAQ,qBAAqB;IAClE,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,MAAM,sBAAsB,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE/E,MAAM,WAAW,iBAAiB;IAChC,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,sBAAsB,CAAC;IACtC,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,qBAAqB,CAAC,CAAC;IACjD,IAAI,IAAI,IAAI,CAAC;IACb,KAAK,IAAI,IAAI,CAAC;IACd,IAAI,IAAI,IAAI,CAAC;IACb,KAAK,IAAI,IAAI,CAAC;IACd,MAAM,CAAC,OAAO,EAAE,MAAM,GAAG,iBAAiB,CAAC;IAC3C,WAAW,IAAI,iBAAiB,CAAC;CAClC;AAED,MAAM,WAAW,cAAc;IAC7B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,cAAc,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,oBAAoB;IACnC,IAAI,CACF,OAAO,EAAE,wBAAwB,EACjC,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,iBAAiB,GACzB,IAAI,CAAC;CACT"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitykovskiy/canvas-sprite-animations",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Framework-agnostic sprite animation library for HTML canvas.",
   "type": "module",
   "private": false,
@@ -32,7 +32,7 @@
   },
   "scripts": {
     "clean": "node -e \"import('node:fs/promises').then(fs => fs.rm('dist', { recursive: true, force: true }))\"",
-    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "typecheck": "vue-tsc --noEmit -p tsconfig.json",
     "build": "npm run clean && tsc -p tsconfig.build.json",
     "build:types": "tsc -p tsconfig.build.json",
     "test": "npm run build && node --test tests/**/*.test.mjs",
@@ -61,7 +61,10 @@
     "node": ">=22.0.0"
   },
   "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.1",
     "typescript": "^5.8.3",
-    "vite": "^7.1.5"
+    "vite": "^7.1.5",
+    "vue": "^3.5.13",
+    "vue-tsc": "^3.0.7"
   }
 }