canvas-emulator 1.0.0

package/.gitignore

@@ -0,0 +1,233 @@
+/*.ppm
+# Created by https://www.toptal.com/developers/gitignore/api/vim,emacs,yarn,node
+# Edit at https://www.toptal.com/developers/gitignore?templates=vim,emacs,yarn,node
+
+### Emacs ###
+# -*- mode: gitignore; -*-
+*~
+\#*\#
+/.emacs.desktop
+/.emacs.desktop.lock
+*.elc
+auto-save-list
+tramp
+.\#*
+
+# Org-mode
+.org-id-locations
+*_archive
+
+# flymake-mode
+*_flymake.*
+
+# eshell files
+/eshell/history
+/eshell/lastdir
+
+# elpa packages
+/elpa/
+
+# reftex files
+*.rel
+
+# AUCTeX auto folder
+/auto/
+
+# cask packages
+.cask/
+dist/
+
+# Flycheck
+flycheck_*.el
+
+# server auth directory
+/server/
+
+# projectiles files
+.projectile
+
+# directory configuration
+.dir-locals.el
+
+# network security
+/network-security.data
+
+
+### Node ###
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+.pnpm-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Snowpack dependency directory (https://snowpack.dev/)
+web_modules/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional stylelint cache
+.stylelintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variable files
+.env
+.env.development.local
+.env.test.local
+.env.production.local
+.env.local
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+.parcel-cache
+
+# Next.js build output
+.next
+out
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and not Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# vuepress v2.x temp and cache directory
+.temp
+
+# Docusaurus cache and generated files
+.docusaurus
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# yarn v2
+.yarn/cache
+.yarn/unplugged
+.yarn/build-state.yml
+.yarn/install-state.gz
+.pnp.*
+
+### Node Patch ###
+# Serverless Webpack directories
+.webpack/
+
+# Optional stylelint cache
+
+# SvelteKit build / generate output
+.svelte-kit
+
+### Vim ###
+# Swap
+[._]*.s[a-v][a-z]
+!*.svg  # comment out if you don't need vector files
+[._]*.sw[a-p]
+[._]s[a-rt-v][a-z]
+[._]ss[a-gi-z]
+[._]sw[a-p]
+
+# Session
+Session.vim
+Sessionx.vim
+
+# Temporary
+.netrwhist
+# Auto-generated tag files
+tags
+# Persistent undo
+[._]*.un~
+
+### yarn ###
+# https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
+
+.yarn/*
+!.yarn/releases
+!.yarn/patches
+!.yarn/plugins
+!.yarn/sdks
+!.yarn/versions
+
+# if you are NOT using Zero-installs, then:
+# comment the following lines
+!.yarn/cache
+
+# and uncomment the following lines
+# .pnp.*
+
+# End of https://www.toptal.com/developers/gitignore/api/vim,emacs,yarn,node

package/CLAUDE.md

@@ -0,0 +1,61 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Commands
+
+```bash
+pnpm build       # compile to both ESM (dist/esm) and CJS (dist/cjs)
+pnpm check       # type-check without emitting (uses tsconfig.json)
+pnpm test        # run vitest
+pnpm format      # format src/ with prettier
+
+# Run the playground script manually (no test infra needed)
+npx tsx playground.ts
+```
+
+## Architecture
+
+This is a **headless Canvas API emulator** — a TypeScript library that replicates the browser `CanvasRenderingContext2D` API for server-side rendering, outputting to PPM image files or raw pixel buffers.
+
+### Key design conventions
+
+- **All color values are normalized floats `[0, 1]`**, not `[0, 255]`. This applies to pixels stored in `Canvas.data` and all `V3`/`V4` color tuples.
+- **Pixels are RGBA** arrays `[r, g, b, a]` stored flat in `Canvas.data`. The canvas always has 4 channels.
+- `setAt` performs **alpha compositing** using `smoothstep`-based mixing between the existing pixel and the incoming one.
+- Canvas supports both **pixel-space** (`at`, `setAt` using integer x/y) and **UV-space** (`atUV`, `setAtUV` using `[0,1]` coordinates).
+
+### Module structure
+
+- **`src/canvas/`** — Core canvas implementation
+  - `canvas.ts` — `Canvas` interface + `CanvasImpl` class (pixel buffer). `createCanvas(cfg)` is the main entry point.
+  - `context-2d.ts` — `CanvasContext2DImpl`: mimics `CanvasRenderingContext2D`. Maintains a `State` stack for `save()`/`restore()`. Paths are stored as flat pairs of points (`[p1, p2, p3, p4, ...]`) and consumed two at a time for line segments in `stroke()`. `fill()` uses a scanline ray-casting algorithm.
+  - Font rendering (`drawChar`, `fillText`) uses bitmap data from `src/data/font/noto-mono-regular-48.json` — a 48×48px glyph atlas keyed by char code.
+
+- **`src/common/`** — Shared math & utilities
+  - `types.ts` — Vector aliases: `V2`, `V3`, `V4`
+  - `array.ts` — Vector math: `add`, `sub`, `mul`, `div`, `scale`, `dot`, `cross`, `normalize`, `distance`, `toBatched`, `range`, etc.
+  - `scalar.ts` — Scalar math: `clamp`, `lerp`, `remap`, `smoothstep`, `smin`, `smax`, `fract`, `amod`, `sigmoid`, etc.
+  - `colors.ts` — `toRGB(color: string): V3` parses CSS named colors, `#RGB`/`#RRGGBB` hex, and `rgb()`/`rgba()` strings into normalized `[0,1]` triples.
+  - `ppm.ts` — `createPPM(width, height, pixels)` serializes RGB pixels to a P3 PPM string.
+
+### Dual build output
+
+`tsconfig.esm.json` → `dist/esm` (ES modules, NodeNext)
+`tsconfig.cjs.json` → `dist/cjs` (CommonJS)
+Both exclude `*.test.ts` and `*.sample.ts` files.
+
+### Typical usage pattern
+
+```ts
+import { createCanvas, createPPM } from 'canvas-emulator';
+import fs from 'fs';
+
+const canvas = createCanvas({ width: 512, height: 512 });
+const ctx = canvas.getContext2D();
+
+ctx.fillStyle = 'blue';
+ctx.fillRect(10, 10, 100, 100);
+
+fs.writeFileSync('out.ppm', createPPM(canvas.width, canvas.height, canvas.renderRGB()));
+```

package/README.md

@@ -0,0 +1,128 @@
+# canvas-emulator
+
+A headless Canvas 2D rendering library for Node.js. Draw shapes, text, and paths using a familiar `CanvasRenderingContext2D`-style API, then export to PPM image files or raw pixel buffers — no browser required.
+
+## Installation
+
+```bash
+pnpm add canvas-emulator
+```
+
+## Quick start
+
+```ts
+import { createCanvas, createPPM } from 'canvas-emulator';
+import fs from 'fs';
+
+const canvas = createCanvas({ width: 512, height: 512 });
+const ctx = canvas.getContext2D();
+
+// Draw a filled rectangle
+ctx.fillStyle = 'blue';
+ctx.fillRect(50, 50, 200, 150);
+
+// Draw a circle
+ctx.save();
+ctx.beginPath();
+ctx.arc(256, 256, 80, 0);
+ctx.closePath();
+ctx.fillStyle = '#ff6600';
+ctx.fill();
+ctx.restore();
+
+// Render text
+ctx.fillStyle = 'white';
+ctx.fillText('Hello!', 100, 100, 48);
+
+// Write to a PPM image file
+fs.writeFileSync('output.ppm', createPPM(canvas.width, canvas.height, canvas.renderRGB()));
+```
+
+Open PPM files with GIMP, Preview (macOS), or convert them with ImageMagick (`convert output.ppm output.png`).
+
+## API
+
+### Canvas
+
+```ts
+const canvas = createCanvas({ width: number, height: number });
+```
+
+| Member | Description |
+|---|---|
+| `canvas.width / .height` | Dimensions in pixels |
+| `canvas.data` | Raw flat RGBA array, values normalized to `[0, 1]` |
+| `canvas.at([x, y])` | Read pixel at pixel-space coordinates |
+| `canvas.atUV([u, v])` | Read pixel at UV coordinates (`[0,1]` range) |
+| `canvas.setAt([x, y], pixel)` | Write pixel (alpha-composited) |
+| `canvas.each(fn)` | Iterate over every pixel with `(pos, uv)` |
+| `canvas.renderRGB()` | Returns `[r, g, b][]` — suitable for `createPPM` |
+| `canvas.renderRGBA()` | Returns `[r, g, b, a][]` |
+| `canvas.getContext2D()` | Returns a `CanvasContext2D` drawing context |
+
+> **Note:** All color channel values are normalized floats in `[0, 1]`, not `[0, 255]`.
+
+### Context 2D
+
+The context closely mirrors the browser [`CanvasRenderingContext2D`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D):
+
+```ts
+const ctx = canvas.getContext2D();
+
+ctx.fillStyle = 'red';         // CSS color name, #hex, or rgb()/rgba()
+ctx.strokeStyle = '#00ff00';
+
+ctx.save();                    // push state
+ctx.restore();                 // pop state
+
+ctx.fillRect(x, y, w, h);
+ctx.strokeRect(x, y, w, h);
+ctx.clearRect(x, y, w, h);
+
+ctx.beginPath();
+ctx.moveTo(x, y);
+ctx.lineTo(x, y);
+ctx.arc(x, y, radius, startAngle);
+ctx.rect(x, y, w, h);
+ctx.closePath();
+ctx.fill();
+ctx.stroke();
+
+ctx.fillText(text, x, y);
+ctx.fillText(text, x, y, fontSize);  // fontSize in pixels (default: 48)
+ctx.measureText(text);               // returns { width }
+```
+
+**Supported color formats:** CSS named colors (`red`, `blue`, `coral`, etc.), `#RGB`, `#RRGGBB`, `rgb(r, g, b)`, `rgba(r, g, b, a)`.
+
+### Utilities
+
+```ts
+import { createPPM, toRGB, clamp, lerp, remap, smoothstep } from 'canvas-emulator';
+
+// PPM export
+createPPM(width, height, pixels);   // pixels: [r, g, b][] normalized to [0,1]
+
+// Color parsing
+toRGB('coral');      // → [1, 0.498, 0.314]
+toRGB('#ff8800');    // → [1, 0.533, 0]
+
+// Math helpers
+clamp(x, min, max);
+lerp(from, to, t);
+remap(x, [inMin, inMax], [outMin, outMax]);
+smoothstep(edge0, edge1, value);
+```
+
+Vector math (`add`, `sub`, `mul`, `div`, `scale`, `dot`, `normalize`, `distance`, etc.) is also exported for working directly with pixel data.
+
+## Development
+
+```bash
+pnpm build     # compile (outputs dist/esm and dist/cjs)
+pnpm check     # type-check only
+pnpm test      # run tests
+pnpm format    # format source files
+
+npx tsx playground.ts   # run the playground script
+```

package/dist/cjs/playground.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=playground.d.ts.map

package/dist/cjs/playground.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"playground.d.ts","sourceRoot":"","sources":["../../playground.ts"],"names":[],"mappings":""}

package/dist/cjs/playground.js

@@ -0,0 +1,37 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const src_1 = require("./src");
+const canvas_1 = require("./src/canvas/canvas");
+const fs_1 = __importDefault(require("fs"));
+const canvas = (0, canvas_1.createCanvas)({
+    width: 512,
+    height: 512
+});
+const ctx = canvas.getContext2D();
+//ctx.save();
+//ctx.beginPath();
+//ctx.lineTo(canvas.width, canvas.height);
+//ctx.closePath();
+//ctx.stroke();
+//ctx.restore();
+//ctx.save();
+//ctx.beginPath();
+//ctx.arc(512/2, 512/2, 64, 0);
+//ctx.closePath();
+//ctx.fillStyle = 'purple';
+//ctx.fill();
+//ctx.restore();
+//
+//ctx.save();
+//ctx.beginPath();
+//ctx.rect((512/2)-16, (512/2)-16, 32, 32);
+//ctx.closePath();
+//ctx.fill();
+//ctx.restore();
+ctx.fillText('hello', 0, 512 / 4, 128);
+const ppm = (0, src_1.createPPM)(canvas.width, canvas.height, canvas.renderRGB());
+fs_1.default.writeFileSync('image.ppm', ppm, { encoding: 'utf-8' });
+//# sourceMappingURL=playground.js.map

package/dist/cjs/playground.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"playground.js","sourceRoot":"","sources":["../../playground.ts"],"names":[],"mappings":";;;;;AAAA,+BAAkC;AAClC,gDAAmD;AACnD,4CAAoB;AAEpB,MAAM,MAAM,GAAG,IAAA,qBAAY,EAAC;IAC1B,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;CACZ,CAAC,CAAC;AAEH,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,EAAE,CAAC;AAGlC,aAAa;AACb,kBAAkB;AAClB,0CAA0C;AAC1C,kBAAkB;AAClB,eAAe;AACf,gBAAgB;AAIhB,aAAa;AACb,kBAAkB;AAClB,+BAA+B;AAC/B,kBAAkB;AAClB,2BAA2B;AAC3B,aAAa;AACb,gBAAgB;AAChB,EAAE;AACF,aAAa;AACb,kBAAkB;AAClB,2CAA2C;AAC3C,kBAAkB;AAClB,aAAa;AACb,gBAAgB;AAEhB,GAAG,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,EAAE,GAAG,GAAC,CAAC,EAAE,GAAG,CAAC,CAAC;AAErC,MAAM,GAAG,GAAG,IAAA,eAAS,EAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC;AAEvE,YAAE,CAAC,aAAa,CAAC,WAAW,EAAE,GAAG,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,CAAC"}

package/dist/cjs/src/canvas/canvas.d.ts

@@ -0,0 +1,41 @@
+import { type CanvasContext2D } from "./context-2d";
+export type Pixel = [number, number, number, number];
+export type Point = [number, number];
+export interface Canvas {
+    width: number;
+    height: number;
+    channels: number;
+    data: Array<number>;
+    indexAt(p: Point): number;
+    at(p: Point): Pixel;
+    atUV(p: Point): Pixel;
+    setAt(p: Point, px: Pixel | number): void;
+    setAtUV(p: Point, px: Pixel | number): void;
+    each(fn: (pos: Point, uv: Point) => void): void;
+    renderRGBA(): Array<Pixel>;
+    renderRGB(): Array<[number, number, number]>;
+    getContext2D(): CanvasContext2D;
+}
+export type CanvasConfig = {
+    width: number;
+    height: number;
+};
+export declare class CanvasImpl implements Canvas {
+    width: number;
+    height: number;
+    channels: 4;
+    data: Array<number>;
+    private readonly length;
+    constructor(cfg: CanvasConfig);
+    indexAt(p: Point): number;
+    at(p: Point): Pixel;
+    atUV(p: Point): Pixel;
+    setAt(p: Point, px: Pixel | number): void;
+    setAtUV(p: Point, px: Pixel | number): void;
+    each(fn: (pos: Point, uv: Point) => void): void;
+    renderRGBA(): Array<Pixel>;
+    renderRGB(): Array<[number, number, number]>;
+    getContext2D(): CanvasContext2D;
+}
+export declare const createCanvas: (cfg: CanvasConfig) => Canvas;
+//# sourceMappingURL=canvas.d.ts.map

package/dist/cjs/src/canvas/canvas.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas.d.ts","sourceRoot":"","sources":["../../../../src/canvas/canvas.ts"],"names":[],"mappings":"AAGA,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAEzE,MAAM,MAAM,KAAK,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AACrD,MAAM,MAAM,KAAK,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAErC,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAEpB,OAAO,CAAC,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B,EAAE,CAAC,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IACpB,IAAI,CAAC,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAEtB,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI,CAAC;IAC1C,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI,CAAC;IAE5C,IAAI,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,KAAK,IAAI,GAAG,IAAI,CAAC;IAEhD,UAAU,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;IAC3B,SAAS,IAAI,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IAE7C,YAAY,IAAI,eAAe,CAAC;CACjC;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,qBAAa,UAAW,YAAW,MAAM;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,CAAK;IAChB,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAEpB,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAS;gBAEpB,GAAG,EAAE,YAAY;IAQ7B,OAAO,CAAC,CAAC,EAAE,KAAK,GAAG,MAAM;IAMzB,EAAE,CAAC,CAAC,EAAE,KAAK,GAAG,KAAK;IAKnB,IAAI,CAAC,CAAC,EAAE,KAAK,GAAG,KAAK;IAMrB,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI;IAiBzC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI;IAM3C,IAAI,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,KAAK,IAAI,GAAG,IAAI;IAU/C,UAAU,IAAI,KAAK,CAAC,KAAK,CAAC;IAI1B,SAAS,IAAI,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IAW5C,YAAY,IAAI,eAAe;CAGhC;AAED,eAAO,MAAM,YAAY,GAAI,KAAK,YAAY,KAAG,MAEhD,CAAC"}

package/dist/cjs/src/canvas/canvas.js

@@ -0,0 +1,83 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createCanvas = exports.CanvasImpl = void 0;
+const array_1 = require("../common/array");
+const scalar_1 = require("../common/scalar");
+const context_2d_1 = require("./context-2d");
+class CanvasImpl {
+    width;
+    height;
+    channels = 4;
+    data;
+    length;
+    constructor(cfg) {
+        const { width, height } = cfg;
+        this.width = width;
+        this.height = height;
+        this.length = width * height * this.channels;
+        this.data = (0, array_1.range)(this.length).fill(0);
+    }
+    indexAt(p) {
+        const x = Math.floor(p[0]);
+        const y = Math.floor(p[1]);
+        return (0, scalar_1.clamp)((y * this.width + x) * this.channels, 0, this.length - 1);
+    }
+    at(p) {
+        const idx = this.indexAt(p);
+        return this.data.slice(idx, idx + this.channels);
+    }
+    atUV(p) {
+        const x = p[0] * this.width;
+        const y = p[1] * this.height;
+        return this.at([x, y]);
+    }
+    setAt(p, px) {
+        const idx = this.indexAt(p);
+        const nextAlpha = typeof px === "number" ? 1.0 : px[3];
+        const current = this.at(p);
+        const currentAlpha = current[3];
+        const nextData = typeof px === "number" ? [px, px, px, px] : px;
+        const mixCurrent = (0, scalar_1.smoothstep)(0, 1, currentAlpha - nextAlpha);
+        const mixNext = (0, scalar_1.smoothstep)(0, 1, nextAlpha);
+        for (let i = 0; i < nextData.length; i++) {
+            this.data[idx + i] =
+                this.data[idx + i] * mixCurrent + nextData[i] * mixNext;
+        }
+    }
+    setAtUV(p, px) {
+        const x = p[0] * this.width;
+        const y = p[1] * this.height;
+        return this.setAt([x, y], px);
+    }
+    each(fn) {
+        for (let y = 0; y < this.height; y++) {
+            for (let x = 0; x < this.width; x++) {
+                const p = [x, y];
+                const uv = [x / this.width, y / this.height];
+                fn(p, uv);
+            }
+        }
+    }
+    renderRGBA() {
+        return (0, array_1.toBatched)(this.data, this.channels, 0);
+    }
+    renderRGB() {
+        const pixels = [];
+        for (let i = 0; i < this.data.length; i += this.channels) {
+            const r = this.data[i];
+            const g = this.data[i + 1];
+            const b = this.data[i + 2];
+            pixels.push([r, g, b]);
+        }
+        return pixels;
+    }
+    getContext2D() {
+        return new context_2d_1.CanvasContext2DImpl(this);
+    }
+}
+exports.CanvasImpl = CanvasImpl;
+const createCanvas = (cfg) => {
+    return new CanvasImpl(cfg);
+};
+exports.createCanvas = createCanvas;
+//# sourceMappingURL=canvas.js.map

package/dist/cjs/src/canvas/canvas.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas.js","sourceRoot":"","sources":["../../../../src/canvas/canvas.ts"],"names":[],"mappings":"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"}

package/dist/cjs/src/canvas/context-2d.d.ts

@@ -0,0 +1,37 @@
+import { type Canvas } from "./canvas";
+export type TextMetrics = {
+    width: number;
+};
+export type CanvasContext2D = CanvasContext2DImpl;
+export declare class CanvasContext2DImpl {
+    canvas: Canvas;
+    private stack;
+    constructor(canvas: Canvas);
+    private get state();
+    get fillStyle(): string;
+    set fillStyle(value: string);
+    get strokeStyle(): string;
+    set strokeStyle(value: string);
+    save(): void;
+    restore(): void;
+    moveTo(x: number, y: number): void;
+    lineTo(x: number, y: number): void;
+    arc(x: number, y: number, radius: number, startAngle: number): void;
+    rect(x: number, y: number, width: number, height: number): void;
+    fill(): void;
+    stroke(): void;
+    strokeRect(x: number, y: number, width: number, height: number): void;
+    fillRect(x: number, y: number, width: number, height: number): void;
+    clearRect(x: number, y: number, width: number, height: number): void;
+    private drawChar;
+    fillText(text: string, x: number, y: number): void;
+    fillText(text: string, x: number, y: number, maxWidth: number): void;
+    fillText(text: string, x: number, y: number, maxWidth: undefined): void;
+    strokeText(text: string, x: number, y: number): void;
+    strokeText(text: string, x: number, y: number, maxWidth: number): void;
+    strokeText(text: string, x: number, y: number, maxWidth: undefined): void;
+    measureText(text: string): TextMetrics;
+    beginPath(): void;
+    closePath(): void;
+}
+//# sourceMappingURL=context-2d.d.ts.map

package/dist/cjs/src/canvas/context-2d.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-2d.d.ts","sourceRoot":"","sources":["../../../../src/canvas/context-2d.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,UAAU,CAAC;AAKvC,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAsDF,MAAM,MAAM,eAAe,GAAG,mBAAmB,CAAC;AAElD,qBAAa,mBAAmB;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,KAAK,CAA+B;gBAEhC,MAAM,EAAE,MAAM;IAI1B,OAAO,KAAK,KAAK,GAIhB;IAED,IAAI,SAAS,IAAI,MAAM,CAEtB;IACD,IAAI,SAAS,CAAC,KAAK,EAAE,MAAM,EAE1B;IAED,IAAI,WAAW,IAAI,MAAM,CAExB;IACD,IAAI,WAAW,CAAC,KAAK,EAAE,MAAM,EAE5B;IAED,IAAI;IAIJ,OAAO,IAAI,IAAI;IAIf,MAAM,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI;IAIlC,MAAM,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI;IAKlC,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,IAAI;IAkBnE,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAe/D,IAAI,IAAI,IAAI;IAwCZ,MAAM,IAAI,IAAI;IAgCd,UAAU,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAKrE,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAKnE,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAQpE,OAAO,CAAC,QAAQ;IA2ChB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI;IAClD,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI;IACpE,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,GAAG,IAAI;IAUvE,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI;IACpD,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI;IACtE,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,GAAG,IAAI;IAKzE,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW;IAItC,SAAS,IAAI,IAAI;IAGjB,SAAS,IAAI,IAAI;CAGlB"}