pixel-data-js 0.28.0 → 0.30.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "pixel-data-js",
   "type": "module",
-  "version": "0.28.0",
+  "version": "0.30.0",
   "packageManager": "pnpm@10.33.0",
   "description": "JS Pixel and ImageData operations",
   "author": {

package/src/Canvas/CanvasFrameRenderer.ts

@@ -7,7 +7,7 @@ export type CanvasFrameRenderer<T extends HTMLCanvasElement | OffscreenCanvas =
 export function makeCanvasFrameRenderer<T extends HTMLCanvasElement | OffscreenCanvas = OffscreenCanvas>(
   reusableCanvasFactory: () => ReusableCanvasFactory<T> = makeReusableOffscreenCanvas as unknown as () => ReusableCanvasFactory<T>,
 ) {
-  const bufferCanvas = reusableCanvasFactory()
+  const getBuffer = reusableCanvasFactory()
 
   return function renderCanvasFrame(
     pixelCanvas: PixelCanvas,
@@ -23,7 +23,7 @@ export function makeCanvasFrameRenderer<T extends HTMLCanvasElement | OffscreenC
     const h = canvas.height
 
     // 1. Clear pixel buffer
-    const buffer = bufferCanvas(w, h)
+    const buffer = getBuffer(w, h)
 
     // 2. Draw pixel data into pixel buffer
     const img = getImageData()

package/src/History/HistoryAction.ts

@@ -14,9 +14,8 @@ export function makeHistoryAction(
   config: PixelEngineConfig,
   accumulator: PixelAccumulator,
   patch: PixelPatchTiles,
-  after?: () => void,
-  afterUndo?: () => void,
-  afterRedo?: () => void,
+  afterUndo?: (patch: PixelPatchTiles) => void,
+  afterRedo?: (patch: PixelPatchTiles) => void,
   applyPatchTilesFn = applyPatchTiles,
 ): HistoryAction {
 
@@ -26,13 +25,11 @@ export function makeHistoryAction(
   return {
     undo: () => {
       applyPatchTilesFn(target, patch.beforeTiles, tileSize)
-      afterUndo?.()
-      after?.()
+      afterUndo?.(patch)
     },
     redo: () => {
       applyPatchTilesFn(target, patch.afterTiles, tileSize)
-      afterRedo?.()
-      after?.()
+      afterRedo?.(patch)
     },
     dispose: () => accumulator.recyclePatch(patch),
   }

package/src/Internal/_constants.ts

@@ -0,0 +1,3 @@
+import type { CanvasObjectFactory } from '../Canvas/_canvas-types'
+
+export const DEFAULT_CANVAS_FACTORY: CanvasObjectFactory<any> = (w, h) => new OffscreenCanvas(w, h)

package/src/Paint/AlphaMaskPaintBuffer.ts

@@ -1,10 +1,6 @@
-import { type Color32 } from '../_types'
 import { forEachLinePoint } from '../Algorithm/forEachLinePoint'
-import { sourceOverPerfect } from '../BlendModes/blend-modes-perfect'
-import type { PixelAccumulator } from '../History/PixelAccumulator'
 import type { PixelEngineConfig } from '../History/PixelEngineConfig'
 import { _macro_paintRectCenterOffset } from '../Internal/macros'
-import { blendColorPixelDataAlphaMask } from '../PixelData/blendColorPixelDataAlphaMask'
 import type { Rect } from '../Rect/_rect-types'
 import { trimRectBounds } from '../Rect/trimRectBounds'
 import type { AlphaMaskTile } from '../Tile/_tile-types'
@@ -16,7 +12,6 @@ export class AlphaMaskPaintBuffer {
   readonly lookup: (AlphaMaskTile | undefined)[]
   private readonly scratchBounds: Rect = { x: 0, y: 0, w: 0, h: 0 }
 
-  private blendColorPixelDataAlphaMaskFn = blendColorPixelDataAlphaMask
   private forEachLinePointFn = forEachLinePoint
   private trimRectBoundsFn = trimRectBounds
   private eachTileInBoundsFn = eachTileInBounds
@@ -282,57 +277,6 @@ export class AlphaMaskPaintBuffer {
     return changed
   }
 
-  private opts = {
-    alpha: 255,
-    blendFn: sourceOverPerfect,
-    x: 0,
-    y: 0,
-    w: 0,
-    h: 0,
-  }
-
-  commit(
-    accumulator: PixelAccumulator,
-    color: Color32,
-    alpha = 255,
-    blendFn = sourceOverPerfect,
-  ) {
-    const blendColorPixelDataAlphaMaskFn = this.blendColorPixelDataAlphaMaskFn
-    const tileShift = this.config.tileShift
-    const lookup = this.lookup
-    const opts = this.opts
-
-    opts.alpha = alpha
-    opts.blendFn = blendFn
-
-    for (let i = 0; i < lookup.length; i++) {
-      const tile = lookup[i]
-
-      if (tile) {
-        const didChange = accumulator.storeTileBeforeState(tile.id, tile.tx, tile.ty)
-
-        const dx = tile.tx << tileShift
-        const dy = tile.ty << tileShift
-
-        opts.x = dx
-        opts.y = dy
-        opts.w = tile.w
-        opts.h = tile.h
-
-        didChange(
-          blendColorPixelDataAlphaMaskFn(
-            this.config.target,
-            color,
-            tile,
-            opts,
-          ),
-        )
-      }
-    }
-
-    this.clear()
-  }
-
   clear(): void {
     this.tilePool.releaseTiles(this.lookup)
   }

package/src/Paint/BinaryMaskPaintBuffer.ts

@@ -1,10 +1,6 @@
-import { type Color32 } from '../_types'
 import { forEachLinePoint } from '../Algorithm/forEachLinePoint'
-import { sourceOverPerfect } from '../BlendModes/blend-modes-perfect'
-import type { PixelAccumulator } from '../History/PixelAccumulator'
 import type { PixelEngineConfig } from '../History/PixelEngineConfig'
 import { _macro_paintRectCenterOffset } from '../Internal/macros'
-import { blendColorPixelDataBinaryMask } from '../PixelData/blendColorPixelDataBinaryMask'
 import type { Rect } from '../Rect/_rect-types'
 import { trimRectBounds } from '../Rect/trimRectBounds'
 import type { BinaryMaskTile } from '../Tile/_tile-types'
@@ -16,7 +12,6 @@ export class BinaryMaskPaintBuffer {
   readonly lookup: (BinaryMaskTile | undefined)[]
   private readonly scratchBounds: Rect = { x: 0, y: 0, w: 0, h: 0 }
 
-  private blendColorPixelDataBinaryMaskFn = blendColorPixelDataBinaryMask
   private forEachLinePointFn = forEachLinePoint
   private trimRectBoundsFn = trimRectBounds
   private eachTileInBoundsFn = eachTileInBounds
@@ -197,57 +192,6 @@ export class BinaryMaskPaintBuffer {
     return changed
   }
 
-  private opts = {
-    alpha: 255,
-    blendFn: sourceOverPerfect,
-    x: 0,
-    y: 0,
-    w: 0,
-    h: 0,
-  }
-
-  commit(
-    accumulator: PixelAccumulator,
-    color: Color32,
-    alpha = 255,
-    blendFn = sourceOverPerfect,
-  ) {
-    const blendColorPixelDataBinaryMaskFn = this.blendColorPixelDataBinaryMaskFn
-    const tileShift = this.config.tileShift
-    const lookup = this.lookup
-    const opts = this.opts
-
-    opts.alpha = alpha
-    opts.blendFn = blendFn
-
-    for (let i = 0; i < lookup.length; i++) {
-      const tile = lookup[i]
-
-      if (tile) {
-        const didChange = accumulator.storeTileBeforeState(tile.id, tile.tx, tile.ty)
-
-        const dx = tile.tx << tileShift
-        const dy = tile.ty << tileShift
-
-        opts.x = dx
-        opts.y = dy
-        opts.w = tile.w
-        opts.h = tile.h
-
-        didChange(
-          blendColorPixelDataBinaryMaskFn(
-            this.config.target,
-            color,
-            tile,
-            opts,
-          ),
-        )
-      }
-    }
-
-    this.clear()
-  }
-
   clear(): void {
     this.tilePool.releaseTiles(this.lookup)
   }

package/src/Paint/ColorPaintBuffer.ts

@@ -1,10 +1,7 @@
 import type { Color32 } from '../_types'
 import { forEachLinePoint } from '../Algorithm/forEachLinePoint'
-import { sourceOverPerfect } from '../BlendModes/blend-modes-perfect'
-import type { PixelAccumulator } from '../History/PixelAccumulator'
 import type { PixelEngineConfig } from '../History/PixelEngineConfig'
 import { _macro_paintRectCenterOffset } from '../Internal/macros'
-import { blendPixelData } from '../PixelData/blendPixelData'
 import type { Rect } from '../Rect/_rect-types'
 import { trimRectBounds } from '../Rect/trimRectBounds'
 import type { PixelTile } from '../Tile/_tile-types'
@@ -19,7 +16,6 @@ export class ColorPaintBuffer {
   constructor(
     readonly config: PixelEngineConfig,
     readonly tilePool: TilePool<PixelTile>,
-    private blendPixelDataFn = blendPixelData,
   ) {
     this.lookup = []
   }
@@ -285,55 +281,6 @@ export class ColorPaintBuffer {
     return changed
   }
 
-  private opts = {
-    alpha: 255,
-    blendFn: sourceOverPerfect,
-    x: 0,
-    y: 0,
-    w: 0,
-    h: 0,
-  }
-
-  commit(
-    accumulator: PixelAccumulator,
-    alpha = 255,
-    blendFn = sourceOverPerfect,
-  ) {
-    const tileShift = this.config.tileShift
-    const lookup = this.lookup
-    const opts = this.opts
-
-    const blendPixelDataFn = this.blendPixelDataFn
-    opts.alpha = alpha
-    opts.blendFn = blendFn
-
-    for (let i = 0; i < lookup.length; i++) {
-      const tile = lookup[i]
-
-      if (tile) {
-        const didChange = accumulator.storeTileBeforeState(tile.id, tile.tx, tile.ty)
-
-        const dx = tile.tx << tileShift
-        const dy = tile.ty << tileShift
-
-        opts.x = dx
-        opts.y = dy
-        opts.w = tile.w
-        opts.h = tile.h
-
-        didChange(
-          blendPixelDataFn(
-            this.config.target,
-            tile,
-            opts,
-          ),
-        )
-      }
-    }
-
-    this.clear()
-  }
-
   clear(): void {
     this.tilePool.releaseTiles(this.lookup)
   }

package/src/Paint/Commit/AlphaMaskPaintBufferCommitter.ts

@@ -0,0 +1,26 @@
+import type { Color32 } from '../../_types'
+import { sourceOverPerfect } from '../../BlendModes/blend-modes-perfect'
+import type { PixelAccumulator } from '../../History/PixelAccumulator'
+import { blendColorPixelDataAlphaMask } from '../../PixelData/blendColorPixelDataAlphaMask'
+import type { AlphaMaskPaintBuffer } from '../AlphaMaskPaintBuffer'
+import { commitMaskPaintBuffer } from './commitMaskPaintBuffer'
+
+export function makeAlphaMaskPaintBufferCommitter(
+  accumulator: PixelAccumulator,
+  paintBuffer: AlphaMaskPaintBuffer,
+) {
+  return function commitAlphaMaskPaintBufferToAccumulator(
+    color: Color32,
+    alpha = 255,
+    blendFn = sourceOverPerfect,
+  ) {
+    return commitMaskPaintBuffer(
+      accumulator,
+      paintBuffer,
+      color,
+      alpha,
+      blendFn,
+      blendColorPixelDataAlphaMask,
+    )
+  }
+}

package/src/Paint/Commit/AlphaMaskPaintBufferManager.ts

@@ -0,0 +1,34 @@
+import type { CanvasObjectFactory } from '../../Canvas/_canvas-types'
+import type { PixelWriter } from '../../History/PixelWriter'
+import { DEFAULT_CANVAS_FACTORY } from '../../Internal/_constants'
+import { makeAlphaMaskTile } from '../../Tile/MaskTile'
+import { TilePool } from '../../Tile/TilePool'
+import { AlphaMaskPaintBuffer } from '../AlphaMaskPaintBuffer'
+import { makeAlphaMaskPaintBufferCanvasRenderer } from '../Render/AlphaMaskPaintBufferCanvasRenderer'
+import { makeAlphaMaskPaintBufferCommitter } from './AlphaMaskPaintBufferCommitter'
+
+export type AlphaMaskPaintBufferManager =
+  Pick<AlphaMaskPaintBuffer, 'paintAlphaMask' | 'paintBinaryMask' | 'paintRect'>
+  & {
+  commit: ReturnType<typeof makeAlphaMaskPaintBufferCommitter>
+  draw: ReturnType<typeof makeAlphaMaskPaintBufferCanvasRenderer>
+  clear: () => void
+}
+
+export function makeAlphaMaskPaintBufferManager(
+  writer: Pick<PixelWriter<any>, 'accumulator' | 'config'>,
+  canvasFactory: CanvasObjectFactory<any> = DEFAULT_CANVAS_FACTORY,
+): AlphaMaskPaintBufferManager {
+  const pool = new TilePool(writer.config, makeAlphaMaskTile)
+  const buffer = new AlphaMaskPaintBuffer(writer.config, pool)
+  const draw = makeAlphaMaskPaintBufferCanvasRenderer(buffer, canvasFactory)
+
+  return {
+    clear: buffer.clear.bind(buffer),
+    paintRect: buffer.paintRect.bind(buffer),
+    paintAlphaMask: buffer.paintAlphaMask.bind(buffer),
+    paintBinaryMask: buffer.paintBinaryMask.bind(buffer),
+    commit: makeAlphaMaskPaintBufferCommitter(writer.accumulator, buffer),
+    draw,
+  }
+}

package/src/Paint/Commit/BinaryMaskPaintBufferCommitter.ts

@@ -0,0 +1,26 @@
+import type { Color32 } from '../../_types'
+import { sourceOverPerfect } from '../../BlendModes/blend-modes-perfect'
+import type { PixelAccumulator } from '../../History/PixelAccumulator'
+import { blendColorPixelDataBinaryMask } from '../../PixelData/blendColorPixelDataBinaryMask'
+import type { BinaryMaskPaintBuffer } from '../BinaryMaskPaintBuffer'
+import { commitMaskPaintBuffer } from './commitMaskPaintBuffer'
+
+export function makeBinaryMaskPaintBufferCommitter(
+  accumulator: PixelAccumulator,
+  paintBuffer: BinaryMaskPaintBuffer,
+) {
+  return function commitBinaryMaskPaintBufferToAccumulator(
+    color: Color32,
+    alpha = 255,
+    blendFn = sourceOverPerfect,
+  ) {
+    return commitMaskPaintBuffer(
+      accumulator,
+      paintBuffer,
+      color,
+      alpha,
+      blendFn,
+      blendColorPixelDataBinaryMask,
+    )
+  }
+}

package/src/Paint/Commit/BinaryMaskPaintBufferManager.ts

@@ -0,0 +1,31 @@
+import type { CanvasObjectFactory } from '../../Canvas/_canvas-types'
+import type { PixelWriter } from '../../History/PixelWriter'
+import { DEFAULT_CANVAS_FACTORY } from '../../Internal/_constants'
+import { makeBinaryMaskTile } from '../../Tile/MaskTile'
+import { TilePool } from '../../Tile/TilePool'
+import { BinaryMaskPaintBuffer } from '../BinaryMaskPaintBuffer'
+import { makeBinaryMaskPaintBufferCanvasRenderer } from '../Render/BinaryMaskPaintBufferCanvasRenderer'
+import { makeBinaryMaskPaintBufferCommitter } from './BinaryMaskPaintBufferCommitter'
+
+export type BinaryMaskPaintBufferManager = Pick<BinaryMaskPaintBuffer, 'paintBinaryMask' | 'paintRect'> & {
+  commit: ReturnType<typeof makeBinaryMaskPaintBufferCommitter>
+  draw: ReturnType<typeof makeBinaryMaskPaintBufferCanvasRenderer>
+  clear: () => void
+}
+
+export function makeBinaryMaskPaintBufferManager(
+  writer: Pick<PixelWriter<any>, 'accumulator' | 'config'>,
+  canvasFactory: CanvasObjectFactory<any> = DEFAULT_CANVAS_FACTORY,
+): BinaryMaskPaintBufferManager {
+  const pool = new TilePool(writer.config, makeBinaryMaskTile)
+  const buffer = new BinaryMaskPaintBuffer(writer.config, pool)
+  const draw = makeBinaryMaskPaintBufferCanvasRenderer(buffer, canvasFactory)
+
+  return {
+    clear: buffer.clear.bind(buffer),
+    paintRect: buffer.paintRect.bind(buffer),
+    paintBinaryMask: buffer.paintBinaryMask.bind(buffer),
+    commit: makeBinaryMaskPaintBufferCommitter(writer.accumulator, buffer),
+    draw,
+  }
+}

package/src/Paint/Commit/ColorPaintBufferCommitter.ts

@@ -0,0 +1,23 @@
+import { sourceOverPerfect } from '../../BlendModes/blend-modes-perfect'
+import type { PixelAccumulator } from '../../History/PixelAccumulator'
+import { blendPixelData } from '../../PixelData/blendPixelData'
+import type { ColorPaintBuffer } from '../ColorPaintBuffer'
+import { commitColorPaintBuffer } from './commitColorPaintBuffer'
+
+export function makeColorPaintBufferCommitter(
+  accumulator: PixelAccumulator,
+  paintBuffer: ColorPaintBuffer,
+) {
+  return function commitColorPaintBufferToAccumulator(
+    alpha = 255,
+    blendFn = sourceOverPerfect,
+  ) {
+    return commitColorPaintBuffer(
+      accumulator,
+      paintBuffer,
+      alpha,
+      blendFn,
+      blendPixelData,
+    )
+  }
+}

package/src/Paint/Commit/ColorPaintBufferManager.ts

@@ -0,0 +1,34 @@
+import type { CanvasObjectFactory } from '../../Canvas/_canvas-types'
+import type { PixelWriter } from '../../History/PixelWriter'
+import { DEFAULT_CANVAS_FACTORY } from '../../Internal/_constants'
+import { makePixelTile } from '../../Tile/PixelTile'
+import { TilePool } from '../../Tile/TilePool'
+import { ColorPaintBuffer } from '../ColorPaintBuffer'
+import { makeColorPaintBufferCanvasRenderer } from '../Render/ColorPaintBufferCanvasRenderer'
+import { makeColorPaintBufferCommitter } from './ColorPaintBufferCommitter'
+
+export type ColorPaintBufferManager =
+  Pick<ColorPaintBuffer, 'paintAlphaMask' | 'paintBinaryMask' | 'paintRect'>
+  & {
+  commit: ReturnType<typeof makeColorPaintBufferCommitter>
+  draw: ReturnType<typeof makeColorPaintBufferCanvasRenderer>
+  clear: () => void
+}
+
+export function makeColorPaintBufferManager(
+  writer: Pick<PixelWriter<any>, 'accumulator' | 'config'>,
+  canvasFactory: CanvasObjectFactory<any> = DEFAULT_CANVAS_FACTORY,
+): ColorPaintBufferManager {
+  const pool = new TilePool(writer.config, makePixelTile)
+  const buffer = new ColorPaintBuffer(writer.config, pool)
+  const draw = makeColorPaintBufferCanvasRenderer(buffer, canvasFactory)
+
+  return {
+    clear: buffer.clear.bind(buffer),
+    paintRect: buffer.paintRect.bind(buffer),
+    paintAlphaMask: buffer.paintAlphaMask.bind(buffer),
+    paintBinaryMask: buffer.paintBinaryMask.bind(buffer),
+    commit: makeColorPaintBufferCommitter(writer.accumulator, buffer),
+    draw,
+  }
+}

package/src/Paint/Commit/commitColorPaintBuffer.ts

@@ -0,0 +1,55 @@
+import { sourceOverPerfect } from '../../BlendModes/blend-modes-perfect'
+import type { PixelAccumulator } from '../../History/PixelAccumulator'
+import { blendPixelData } from '../../PixelData/blendPixelData'
+import type { ColorPaintBuffer } from '../ColorPaintBuffer'
+
+const SCRATCH_OPTS = {
+  alpha: 255,
+  blendFn: sourceOverPerfect,
+  x: 0,
+  y: 0,
+  w: 0,
+  h: 0,
+}
+
+export function commitColorPaintBuffer(
+  accumulator: PixelAccumulator,
+  paintBuffer: ColorPaintBuffer,
+  alpha = 255,
+  blendFn = sourceOverPerfect,
+  blendPixelDataFn = blendPixelData,
+) {
+  const config = accumulator.config
+  const tileShift = config.tileShift
+  const lookup = paintBuffer.lookup
+
+  SCRATCH_OPTS.alpha = alpha
+  SCRATCH_OPTS.blendFn = blendFn
+
+  for (let i = 0; i < lookup.length; i++) {
+    const tile = lookup[i]
+
+    if (tile) {
+      const didChange = accumulator.storeTileBeforeState(tile.id, tile.tx, tile.ty)
+
+      const dx = tile.tx << tileShift
+      const dy = tile.ty << tileShift
+
+      SCRATCH_OPTS.x = dx
+      SCRATCH_OPTS.y = dy
+      SCRATCH_OPTS.w = tile.w
+      SCRATCH_OPTS.h = tile.h
+
+      didChange(
+        blendPixelDataFn(
+          config.target,
+          tile,
+          SCRATCH_OPTS,
+        ),
+      )
+    }
+  }
+
+  paintBuffer.clear()
+}
+

package/src/Paint/Commit/commitMaskPaintBuffer.ts

@@ -0,0 +1,78 @@
+import { type Color32 } from '../../_types'
+import { sourceOverPerfect } from '../../BlendModes/blend-modes-perfect'
+import type { PixelAccumulator } from '../../History/PixelAccumulator'
+import { blendColorPixelDataAlphaMask } from '../../PixelData/blendColorPixelDataAlphaMask'
+import { blendColorPixelDataBinaryMask } from '../../PixelData/blendColorPixelDataBinaryMask'
+import type { AlphaMaskPaintBuffer } from '../AlphaMaskPaintBuffer'
+import type { BinaryMaskPaintBuffer } from '../BinaryMaskPaintBuffer'
+
+const SCRATCH_OPTS = {
+  alpha: 255,
+  blendFn: sourceOverPerfect,
+  x: 0,
+  y: 0,
+  w: 0,
+  h: 0,
+}
+
+export function commitMaskPaintBuffer(
+  accumulator: PixelAccumulator,
+  paintBuffer: BinaryMaskPaintBuffer,
+  color: Color32,
+  alpha: number | undefined,
+  blendFn: typeof sourceOverPerfect | undefined,
+  blendColorPixelDataMaskFn: typeof blendColorPixelDataBinaryMask,
+): void
+
+export function commitMaskPaintBuffer(
+  accumulator: PixelAccumulator,
+  paintBuffer: AlphaMaskPaintBuffer,
+  color: Color32,
+  alpha: number | undefined,
+  blendFn: typeof sourceOverPerfect | undefined,
+  blendColorPixelDataMaskFn: typeof blendColorPixelDataAlphaMask,
+): void
+
+export function commitMaskPaintBuffer(
+  accumulator: PixelAccumulator,
+  paintBuffer: any,
+  color: Color32,
+  alpha = 255,
+  blendFn = sourceOverPerfect,
+  blendColorPixelDataMaskFn: any,
+) {
+  const config = accumulator.config
+  const tileShift = config.tileShift
+  const lookup = paintBuffer.lookup
+
+  SCRATCH_OPTS.alpha = alpha
+  SCRATCH_OPTS.blendFn = blendFn
+
+  for (let i = 0; i < lookup.length; i++) {
+    const tile = lookup[i]
+
+    if (tile) {
+      const didChange = accumulator.storeTileBeforeState(tile.id, tile.tx, tile.ty)
+
+      const dx = tile.tx << tileShift
+      const dy = tile.ty << tileShift
+
+      SCRATCH_OPTS.x = dx
+      SCRATCH_OPTS.y = dy
+      SCRATCH_OPTS.w = tile.w
+      SCRATCH_OPTS.h = tile.h
+
+      didChange(
+        blendColorPixelDataMaskFn(
+          config.target,
+          color,
+          tile,
+          SCRATCH_OPTS,
+        ),
+      )
+    }
+  }
+
+  paintBuffer.clear()
+}
+

package/src/Paint/{AlphaMaskPaintBufferCanvasRenderer.ts → Render/AlphaMaskPaintBufferCanvasRenderer.ts}

@@ -1,13 +1,15 @@
-import type { Color32 } from '../_types'
-import { CANVAS_CTX_FAILED } from '../Internal/_errors'
-import { makePixelData } from '../PixelData/PixelData'
-import type { AlphaMaskPaintBuffer } from './AlphaMaskPaintBuffer'
+import type { Color32 } from '../../_types'
+import type { CanvasObjectFactory } from '../../Canvas/_canvas-types'
+import { DEFAULT_CANVAS_FACTORY } from '../../Internal/_constants'
+import { CANVAS_CTX_FAILED } from '../../Internal/_errors'
+import { makePixelData } from '../../PixelData/PixelData'
+import type { AlphaMaskPaintBuffer } from '../AlphaMaskPaintBuffer'
 
 export type AlphaMaskPaintBufferCanvasRenderer = ReturnType<typeof makeAlphaMaskPaintBufferCanvasRenderer>
 
 export function makeAlphaMaskPaintBufferCanvasRenderer(
   paintBuffer: AlphaMaskPaintBuffer,
-  offscreenCanvasClass = OffscreenCanvas,
+  canvasFactory: CanvasObjectFactory<any> = DEFAULT_CANVAS_FACTORY,
 ) {
   const config = paintBuffer.config
   const tileSize = config.tileSize
@@ -15,18 +17,16 @@ export function makeAlphaMaskPaintBufferCanvasRenderer(
   const tileArea = config.tileArea
   const lookup = paintBuffer.lookup
 
-  const canvas = new offscreenCanvasClass(tileSize, tileSize)
+  const canvas = canvasFactory(tileSize, tileSize)
   const ctx = canvas.getContext('2d')
-
   if (!ctx) throw new Error(CANVAS_CTX_FAILED)
-
   ctx.imageSmoothingEnabled = false
 
   const bridge = makePixelData(new ImageData(tileSize, tileSize))
   const view32 = bridge.data
 
   return function drawPaintBuffer(
-    targetCtx: CanvasRenderingContext2D,
+    targetCtx: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D,
     color: Color32,
     alpha = 255,
     compOperation: GlobalCompositeOperation = 'source-over',