pixel-data-js 0.35.0 → 0.37.0

package/src/PixelData/trimPixelData.ts

@@ -0,0 +1,49 @@
+import type { Rect } from '../Rect/_rect-types'
+import type { MutablePixelData, PixelData, PixelData32 } from './_pixelData-types'
+import { cropPixelData } from './cropPixelData'
+
+export function getPixelDataTransparentTrimmedBounds(target: PixelData32): Rect | null {
+  let minX = target.w
+  let minY = target.h
+  let maxX = -1
+  let maxY = -1
+
+  for (let y = 0; y < target.h; y++) {
+    for (let x = 0; x < target.w; x++) {
+      const alpha = target.data[y * target.w + x] >>> 24
+      if (alpha !== 0) {
+        if (x < minX) minX = x
+        if (x > maxX) maxX = x
+        if (y < minY) minY = y
+        if (y > maxY) maxY = y
+      }
+    }
+  }
+
+  if (maxX === -1) return null
+
+  return {
+    x: minX,
+    y: minY,
+    w: maxX - minX + 1,
+    h: maxY - minY + 1,
+  }
+}
+
+export function trimTransparentPixelData(target: PixelData32): PixelData {
+  const r = getPixelDataTransparentTrimmedBounds(target)
+  if (!r) {
+    throw new Error('PixelData is fully transparent — no crop bounds found')
+  }
+
+  return cropPixelData(target, r.x, r.y, r.w, r.h)
+}
+
+export function trimTransparentPixelDataInPlace(target: MutablePixelData) {
+  const r = getPixelDataTransparentTrimmedBounds(target)
+  if (!r) {
+    throw new Error('PixelData is fully transparent — no crop bounds found')
+  }
+
+  cropPixelData(target, r.x, r.y, r.w, r.h, target)
+}

package/src/PixelData/writePaintBufferToPixelData.ts

@@ -10,17 +10,13 @@ export function writePaintBufferToPixelData(
   paintBuffer: ColorPaintBuffer,
   writePixelDataBufferFn = writePixelDataBuffer,
 ) {
-  const tileShift = paintBuffer.config.tileShift
   const lookup = paintBuffer.lookup
 
   for (let i = 0; i < lookup.length; i++) {
     const tile = lookup[i]
 
     if (tile) {
-      const dx = tile.tx << tileShift
-      const dy = tile.ty << tileShift
-
-      writePixelDataBufferFn(target, tile.data, dx, dy, tile.w, tile.h)
+      writePixelDataBufferFn(target, tile.data, tile.x, tile.y, tile.w, tile.h)
     }
   }
 }

package/src/Tile/MaskTile.ts

@@ -14,6 +14,8 @@ export const makeAlphaMaskTile: TileFactory<AlphaMaskTile> = (
     data: new Uint8Array(tileArea),
     w: tileSize,
     h: tileSize,
+    x: tx * tileSize,
+    y: ty * tileSize,
     id,
     tx,
     ty,
@@ -33,6 +35,8 @@ export const makeBinaryMaskTile: TileFactory<BinaryMaskTile> = (
     data: new Uint8Array(tileArea),
     w: tileSize,
     h: tileSize,
+    x: tx * tileSize,
+    y: ty * tileSize,
     id,
     tx,
     ty,

package/src/Tile/PixelTile.ts

@@ -15,6 +15,8 @@ export function makePixelTile(
     id,
     tx,
     ty,
+    x: tx * tileSize,
+    y: ty * tileSize,
     w: tileSize,
     h: tileSize,
     data: data32,

package/src/Tile/TilePool.ts

@@ -1,19 +1,17 @@
-import type { PixelEngineConfig } from '../History/PixelEngineConfig'
 import type { Tile, TileFactory } from './_tile-types'
 
 export class TilePool<T extends Tile> {
   public pool: T[]
 
-  private tileSize: number
-  private tileArea: number
+  protected tileArea: number
 
   constructor(
-    config: PixelEngineConfig,
-    private tileFactory: TileFactory<T>,
+    protected tileSize: number,
+    protected tileFactory: TileFactory<T>,
   ) {
     this.pool = []
-    this.tileSize = config.tileSize
-    this.tileArea = config.tileArea
+    this.tileSize = tileSize
+    this.tileArea = tileSize * tileSize
   }
 
   getTile(
@@ -22,11 +20,14 @@ export class TilePool<T extends Tile> {
     ty: number,
   ): T {
     let tile = this.pool.pop()
+    const tileSize = this.tileSize
 
     if (tile) {
       tile.id = id
       tile.tx = tx
       tile.ty = ty
+      tile.x = tx * tileSize
+      tile.y = ty * tileSize
 
       // Wipe dirty memory from previous uses before handing it out
       tile.data.fill(0)
@@ -38,7 +39,7 @@ export class TilePool<T extends Tile> {
       id,
       tx,
       ty,
-      this.tileSize,
+      tileSize,
       this.tileArea,
     )
   }

package/src/Tile/TileTargetConfig.ts

@@ -0,0 +1,27 @@
+import type { PixelData } from '../PixelData/_pixelData-types'
+import type { TileTargetConfig, TileTargetMeta } from './_tile-types'
+
+export function makeTileTargetConfig(
+  tileSize: number,
+  target: PixelData,
+): TileTargetConfig {
+  return {
+    target,
+    ...makeTileTargetMeta(tileSize, target),
+  }
+}
+
+export function makeTileTargetMeta(
+  tileSize: number,
+  target: { w: number, h: number },
+): TileTargetMeta {
+  return {
+    targetWidth: target.w,
+    targetHeight: target.h,
+    tileSize: tileSize,
+    invTileSize: 1 / tileSize,
+    tileArea: tileSize * tileSize,
+    targetColumns: Math.ceil(target.w / tileSize),
+    targetRows: Math.ceil(target.h / tileSize),
+  }
+}

package/src/Tile/_tile-types.ts

@@ -11,6 +11,8 @@ interface BaseTile {
   id: number
   tx: number
   ty: number
+  x: number
+  y: number
 }
 
 export interface PixelTile extends PixelData, BaseTile {
@@ -31,3 +33,17 @@ export type TileFactory<T extends Tile> = (
   tileSize: number,
   tileArea: number,
 ) => T
+
+export interface TileTargetMeta {
+  readonly tileArea: number
+  readonly targetColumns: number
+  readonly targetRows: number
+  readonly targetWidth: number
+  readonly targetHeight: number
+  readonly tileSize: number
+  readonly invTileSize: number
+}
+
+export interface TileTargetConfig extends TileTargetMeta {
+  readonly target: PixelData
+}

package/src/_types.ts

@@ -1,11 +1,6 @@
+import type { Color32 } from './Color/_color-types'
 import type { BinaryMask } from './Mask/_mask-types'
 
-/** ALL values are 0-255 (including alpha which in CSS is 0-1) */
-export type RGBA = { r: number, g: number, b: number, a: number }
-
-/** Represents a 32-bit color in 0xAABBGGRR (Little endian) */
-export type Color32 = number & { readonly __brandColor32: unique symbol }
-
 /**
  * A function that defines how to combine a source color with a destination color.
  * @param src - The incoming color (source).

package/src/index.ts

@@ -1,4 +1,4 @@
-// generated by `npm run re-index` 
+// generated by `npm run re-index`
 
 export * from './_errors'
 export * from './_types'
@@ -24,7 +24,10 @@ export * from './Clipboard/getImageDataFromClipboard'
 export * from './Clipboard/writeImageDataToClipboard'
 export * from './Clipboard/writeImgBlobToClipboard'
 
-export * from './color'
+export * from './Color/_color-types'
+export * from './Color/lerpColor32'
+export * from './Color/convert-color'
+export * from './Color/pack-color'
 
 export * from './Control/BatchedQueue'
 export * from './Control/RenderQueue'
@@ -32,7 +35,6 @@ export * from './Control/RenderQueue'
 export * from './History/HistoryAction'
 export * from './History/HistoryManager'
 export * from './History/PixelAccumulator'
-export * from './History/PixelEngineConfig'
 export * from './History/PixelMutator'
 
 export * from './History/PixelMutator/mutatorApplyAlphaMask'
@@ -152,6 +154,7 @@ export * from './PixelData/blendPixelDataMask'
 export * from './PixelData/blendPixelDataPaintBuffer'
 export * from './PixelData/clearPixelDataFast'
 export * from './PixelData/copyPixelData'
+export * from './PixelData/cropPixelData'
 export * from './PixelData/extractPixelData'
 export * from './PixelData/extractPixelDataBuffer'
 export * from './PixelData/fillPixelData'
@@ -165,6 +168,7 @@ export * from './PixelData/resamplePixelData'
 export * from './PixelData/resizePixelData'
 export * from './PixelData/ReusablePixelData'
 export * from './PixelData/rotatePixelData'
+export * from './PixelData/trimPixelData'
 export * from './PixelData/uInt32ArrayToPixelData'
 export * from './PixelData/writePaintBufferToPixelData'
 export * from './PixelData/writePixelData'
@@ -179,3 +183,5 @@ export * from './Tile/_tile-types'
 export * from './Tile/MaskTile'
 export * from './Tile/PixelTile'
 export * from './Tile/TilePool'
+export * from './Tile/TileTargetConfig'
+export { colorDistance } from './Color/colorDistance'

package/src/History/PixelEngineConfig.ts

@@ -1,28 +0,0 @@
-import type { PixelData } from '../PixelData/_pixelData-types'
-
-export class PixelEngineConfig {
-  readonly tileSize: number
-  // pixelX = tileX << tileShift
-  // pixelY = tileY << tileShift
-  readonly tileShift: number
-  readonly tileMask: number
-  readonly tileArea: number
-  readonly target!: PixelData
-  readonly targetColumns: number = 0
-  readonly targetRows: number = 0
-
-  constructor(tileSize: number, target: PixelData) {
-    // Ensure it's a power of 2 to guarantee bitwise math works
-    if ((tileSize & (tileSize - 1)) !== 0) {
-      throw new Error('tileSize must be a power of 2')
-    }
-
-    this.tileSize = tileSize
-    this.tileShift = 31 - Math.clz32(tileSize)
-    this.tileMask = tileSize - 1
-    this.tileArea = tileSize * tileSize
-    this.target = target
-    this.targetColumns = (target.w + this.tileMask) >> this.tileShift
-    this.targetRows = (target.h + this.tileMask) >> this.tileShift
-  }
-}

package/src/Internal/_constants.ts

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

package/src/color.ts

@@ -1,112 +0,0 @@
-import type { Color32, RGBA } from './_types'
-
-/**
- * Packs RGBA into a 32-bit integer compatible with
- * Little-Endian Uint32Array views on ImageData.
- */
-export function packColor(r: number, g: number, b: number, a: number): Color32 {
-  return ((a << 24) | (b << 16) | (g << 8) | r) >>> 0 as Color32
-}
-
-export function packRGBA({ r, g, b, a }: RGBA): Color32 {
-  return ((a << 24) | (b << 16) | (g << 8) | r) >>> 0 as Color32
-}
-
-export const unpackRed = (packed: Color32): number => (packed >>> 0) & 0xFF
-export const unpackGreen = (packed: Color32): number => (packed >>> 8) & 0xFF
-export const unpackBlue = (packed: Color32): number => (packed >>> 16) & 0xFF
-export const unpackAlpha = (packed: Color32): number => (packed >>> 24) & 0xFF
-
-export function unpackColor(packed: Color32): RGBA {
-  return {
-    r: (packed >>> 0) & 0xFF,
-    g: (packed >>> 8) & 0xFF,
-    b: (packed >>> 16) & 0xFF,
-    a: (packed >>> 24) & 0xFF,
-  }
-}
-
-const SCRATCH_RGBA: RGBA = { r: 0, g: 0, b: 0, a: 0 }
-
-// uses a scratch arg for memory perf. be careful about re-use.
-export function unpackColorTo(packed: Color32, scratch = SCRATCH_RGBA): RGBA {
-  scratch.r = (packed >>> 0) & 0xFF
-  scratch.g = (packed >>> 8) & 0xFF
-  scratch.b = (packed >>> 16) & 0xFF
-  scratch.a = (packed >>> 24) & 0xFF
-  return scratch
-}
-
-export function colorDistance(a: Color32, b: Color32): number {
-  const dr = (a & 0xFF) - (b & 0xFF)
-  const dg = ((a >>> 8) & 0xFF) - ((b >>> 8) & 0xFF)
-  const db = ((a >>> 16) & 0xFF) - ((b >>> 16) & 0xFF)
-  const da = ((a >>> 24) & 0xFF) - ((b >>> 24) & 0xFF)
-  return dr * dr + dg * dg + db * db + da * da
-}
-
-/**
- * Linearly interpolates between two 32-bit colors using a floating-point weight.
- * * This is the preferred method for UI animations or scenarios where high
- * precision is required. It uses the standard `a + t * (b - a)` formula
- * for each channel.
- * @param a - The starting color as a 32-bit integer (AABBGGRR).
- * @param b - The target color as a 32-bit integer (AABBGGRR).
- * @param t - The interpolation factor between 0.0 and 1.0.
- * @returns The interpolated 32-bit color.
- */
-export function lerpColor32(a: Color32, b: Color32, t: number): Color32 {
-  const r = (a & 0xFF) + t * ((b & 0xFF) - (a & 0xFF))
-  const g = ((a >>> 8) & 0xFF) + t * (((b >>> 8) & 0xFF) - ((a >>> 8) & 0xFF))
-  const b_ = ((a >>> 16) & 0xFF) + t * (((b >>> 16) & 0xFF) - ((a >>> 16) & 0xFF))
-  const a_ = ((a >>> 24) & 0xFF) + t * (((b >>> 24) & 0xFF) - ((a >>> 24) & 0xFF))
-
-  return ((a_ << 24) | (b_ << 16) | (g << 8) | r) >>> 0 as Color32
-}
-
-/**
- * Linearly interpolates between two 32-bit colors using integer fixed-point math.
- * Highly optimized for image processing and real-time blitting. It processes
- * channels in parallel using bitmasks (RB and GA pairs).
- * **Note:** Subject to a 1-bit drift (rounding down) due to fast bit-shift division.
- * @param src - The source (foreground) color as a 32-bit integer.
- * @param dst - The destination (background) color as a 32-bit integer.
- * @param w - The blend weight as a byte value from 0 to 255. Where 0 is 100% dst and 255 is 100% src
- * @returns The blended 32-bit color.
- */export function lerpColor32Fast(src: Color32, dst: Color32, w: number): Color32 {
-  const invA = 255 - w
-
-  // Masking Red and Blue: 0x00FF00FF
-  // We process R and B in one go, then shift back down
-  const rb = (((src & 0x00FF00FF) * w + (dst & 0x00FF00FF) * invA) >>> 8) & 0x00FF00FF
-
-  // Masking Green and Alpha: 0xFF00FF00
-  // We shift down first to avoid overflow, then shift back up
-  const ga = ((((src >>> 8) & 0x00FF00FF) * w + ((dst >>> 8) & 0x00FF00FF) * invA) >>> 8) & 0x00FF00FF
-
-  return (rb | (ga << 8)) >>> 0 as Color32
-}
-
-// Convert 0xAABBGGRR to #RRGGBBAA
-export function color32ToHex(color: Color32): string {
-  const r = (color & 0xFF).toString(16).padStart(2, '0')
-  const g = ((color >>> 8) & 0xFF).toString(16).padStart(2, '0')
-  const b = ((color >>> 16) & 0xFF).toString(16).padStart(2, '0')
-  const a = ((color >>> 24) & 0xFF).toString(16).padStart(2, '0')
-  return `#${r}${g}${b}${a}`
-}
-
-/**
- * Converts a 32-bit integer (0xAABBGGRR) to a CSS rgba() string.
- * Example: 0xFF0000FF -> "rgba(255,0,0,1)"
- */
-export function color32ToCssRGBA(color: Color32): string {
-  const r = color & 0xFF
-  const g = (color >>> 8) & 0xFF
-  const b = (color >>> 16) & 0xFF
-  const a = (color >>> 24) & 0xFF
-
-  const alpha = Number((a / 255).toFixed(3))
-
-  return `rgba(${r},${g},${b},${alpha})`
-}