@thi.ng/pixel - npm Package Compare versions

Comparing version 2.2.0 to 3.0.0

api.d.ts

@@ -45,3 +45,3 @@ import type { FloatArray, Fn, Fn2, Fn3, FnN, FnU2, IGrid2D, IObjectOf, NumericArray, TypedArray, UintType } from "@thi.ng/api";
 }
-export interface PackedChannelSpec {
+export interface IntChannelSpec {
     /**
@@ -55,7 +55,7 @@ * Channel size in bits (1-8)
      * (i.e. only if no-user defined converters are given to
-     * {@link PackedFormatSpec}).
+     * {@link IntFormatSpec}).
      */
     lane?: Lane;
 }
-export interface PackedChannel {
+export interface IntChannel {
     /**
@@ -107,5 +107,5 @@ * Channel size in bits (1-8)
 /**
- * Format configuration passed to {@link defPackedFormat}.
+ * Format configuration passed to {@link defIntFormat}.
  */
-export interface PackedFormatSpec extends Partial<IABGRConvert<number>> {
+export interface IntFormatSpec extends Partial<IABGRConvert<number>> {
     /**
@@ -129,12 +129,12 @@ * Storage / typed array type
      */
-    channels: PackedChannelSpec[];
+    channels: IntChannelSpec[];
 }
 /**
- * Compiled format object returned by {@link defPackedFormat}.
+ * Compiled format object returned by {@link defIntFormat}.
  */
-export interface PackedFormat extends IABGRConvert<number> {
+export interface IntFormat extends IABGRConvert<number> {
     type: UintType;
     size: number;
     alpha: number;
-    channels: PackedChannel[];
+    channels: IntChannel[];
     readonly __packed: true;
@@ -141,0 +141,0 @@ }

CHANGELOG.md

@@ -6,2 +6,28 @@ # Change Log
 
+# [3.0.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/pixel@[e-mail]/pixel@3.0.0) (2021-11-04)
+
+
+### Features
+
+* **pixel:** rename int buffer/format types ([6be02f1](https://github.com/thi-ng/umbrella/commit/6be02f10e5797c101dd0ce1869553d90c1ac6df5))
+
+
+### BREAKING CHANGES
+
+* **pixel:** rename int buffer/format types
+
+- rename:
+  - PackedBuffer => IntBuffer
+  - PackedFormat/Spec => IntFormat/Spec
+  - PackedChannel/Spec => IntChannel/Spec
+- replace static FloatBuffer.fromInt() with
+  standalone fn floatBufferFromInt()
+- add floatBufferFromImage()
+- add floatBufferFromCanvas()
+- update readme
+
+
+
+
+
 # [2.2.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/pixel@[e-mail]/pixel@2.2.0) (2021-11-03)
@@ -8,0 +34,0 @@

checks.d.ts

 import type { TypedArray } from "@thi.ng/api";
-import type { FloatFormat, PackedFormat } from "./api.js";
+import type { FloatFormat, IntFormat } from "./api.js";
 /** @internal */
 export declare const ensureSize: (data: TypedArray, width: number, height: number, stride?: number) => void;
 /** @internal */
-export declare const ensureChannel: (fmt: PackedFormat | FloatFormat, id: number) => import("./api.js").Lane | import("./api.js").PackedChannel;
+export declare const ensureChannel: (fmt: IntFormat | FloatFormat, id: number) => import("./api.js").Lane | import("./api.js").IntChannel;
 /** @internal */
-export declare const ensureSingleChannel: (fmt: PackedFormat | FloatFormat) => void;
+export declare const ensureSingleChannel: (fmt: IntFormat | FloatFormat) => void;
 //# sourceMappingURL=checks.d.ts.map

float.d.ts

 import type { Fn2, ICopy, IEmpty, NumericArray } from "@thi.ng/api";
-import type { BlendFnFloat, BlitOpts, Filter, FloatFormat, FloatFormatSpec, FloatSampler, IBlend, IBlit, IInvert, IPixelBuffer, IResizable, IToImageData, PackedFormat } from "./api.js";
-import { PackedBuffer } from "./packed.js";
+import type { BlendFnFloat, BlitOpts, Filter, FloatFormat, FloatFormatSpec, FloatSampler, IBlend, IBlit, IInvert, IntFormat, IPixelBuffer, IResizable, IToImageData } from "./api.js";
+import { IntBuffer } from "./int.js";
 /**
@@ -13,15 +13,17 @@ * Syntax sugar for {@link FloatBuffer} ctor.
 export declare function floatBuffer(w: number, h: number, fmt: FloatFormat | FloatFormatSpec, data?: Float32Array): FloatBuffer;
-export declare function floatBuffer(src: PackedBuffer, fmt: FloatFormat | FloatFormatSpec): FloatBuffer;
+export declare function floatBuffer(src: IntBuffer, fmt: FloatFormat | FloatFormatSpec): FloatBuffer;
+/**
+ * Creates a new `FloatBuffer` from given {@link IntBuffer} and using
+ * provided {@link FloatFormat}.
+ *
+ * @remarks
+ * See {@link FloatBuffer.as} for reverse operation.
+ *
+ * @param src
+ * @param fmt
+ */
+export declare const floatBufferFromInt: (src: IntBuffer, fmt: FloatFormat | FloatFormatSpec) => FloatBuffer;
+export declare const floatBufferFromImage: (img: HTMLImageElement, fmt?: FloatFormat | FloatFormatSpec, width?: number | undefined, height?: number | undefined) => FloatBuffer;
+export declare const floatBufferFromCanvas: (canvas: HTMLCanvasElement, fmt?: FloatFormat) => FloatBuffer;
 export declare class FloatBuffer implements IPixelBuffer<Float32Array, NumericArray>, IToImageData, IResizable<FloatBuffer, FloatSampler>, IBlend<FloatBuffer, BlendFnFloat>, IBlit<FloatBuffer>, IInvert<FloatBuffer>, ICopy<FloatBuffer>, IEmpty<FloatBuffer> {
-    /**
-     * Creates a new `FloatBuffer` from given {@link PackedBuffer} and using
-     * provided {@link FloatFormat}.
-     *
-     * @remarks
-     * See {@link FloatBuffer.as} for reverse operation.
-     *
-     * @param src
-     * @param fmt
-     */
-    static fromPacked(src: PackedBuffer, fmt: FloatFormat | FloatFormatSpec): FloatBuffer;
     readonly width: number;
@@ -37,3 +39,3 @@ readonly height: number;
     get pixels(): Float32Array;
-    as(fmt: PackedFormat): PackedBuffer;
+    as(fmt: IntFormat): IntBuffer;
     copy(): FloatBuffer;
@@ -40,0 +42,0 @@ empty(): FloatBuffer;

float.js

@@ -8,12 +8,34 @@ import { isNumber } from "@thi.ng/checks/is-number";
 import { FLOAT_GRAY } from "./format/float-gray.js";
+import { FLOAT_RGBA } from "./index.js";
+import { IntBuffer, intBufferFromCanvas, intBufferFromImage } from "./int.js";
 import { __clampRegion, __prepRegions } from "./internal/utils.js";
-import { PackedBuffer } from "./packed.js";
 import { defSampler } from "./sample.js";
 export function floatBuffer(...args) {
-    return args[0] instanceof PackedBuffer
+    return args[0] instanceof IntBuffer
         ? // @ts-ignore
-            FloatBuffer.fromPacked(...args)
+            floatBufferFromInt(...args)
         : // @ts-ignore
             new FloatBuffer(...args);
 }
+/**
+ * Creates a new `FloatBuffer` from given {@link IntBuffer} and using
+ * provided {@link FloatFormat}.
+ *
+ * @remarks
+ * See {@link FloatBuffer.as} for reverse operation.
+ *
+ * @param src
+ * @param fmt
+ */
+export const floatBufferFromInt = (src, fmt) => {
+    const dest = new FloatBuffer(src.width, src.height, fmt);
+    const { data: dbuf, format: dfmt, stride } = dest;
+    const { data: sbuf, format: sfmt } = src;
+    for (let i = sbuf.length; --i >= 0;) {
+        dbuf.set(dfmt.fromABGR(sfmt.toABGR(sbuf[i])), i * stride);
+    }
+    return dest;
+};
+export const floatBufferFromImage = (img, fmt = FLOAT_RGBA, width, height = width) => floatBufferFromInt(intBufferFromImage(img, undefined, width, height), fmt);
+export const floatBufferFromCanvas = (canvas, fmt = FLOAT_RGBA) => floatBufferFromInt(intBufferFromCanvas(canvas), fmt);
 export class FloatBuffer {
@@ -31,21 +53,2 @@ constructor(w, h, fmt, data) {
     }
-    /**
-     * Creates a new `FloatBuffer` from given {@link PackedBuffer} and using
-     * provided {@link FloatFormat}.
-     *
-     * @remarks
-     * See {@link FloatBuffer.as} for reverse operation.
-     *
-     * @param src
-     * @param fmt
-     */
-    static fromPacked(src, fmt) {
-        const dest = new FloatBuffer(src.width, src.height, fmt);
-        const { data: dbuf, format: dfmt, stride } = dest;
-        const { data: sbuf, format: sfmt } = src;
-        for (let i = sbuf.length; --i >= 0;) {
-            dbuf.set(dfmt.fromABGR(sfmt.toABGR(sbuf[i])), i * stride);
-        }
-        return dest;
-    }
     /** @deprecated use `.data` instead */
@@ -57,3 +60,3 @@ get pixels() {
         const { width, height, stride, data, format: sfmt } = this;
-        const dest = new PackedBuffer(width, height, fmt);
+        const dest = new IntBuffer(width, height, fmt);
         const dpixels = dest.data;
@@ -60,0 +63,0 @@ for (let i = 0, j = 0, n = data.length; i < n; i += stride, j++) {

format/abgr8888.d.ts

@@ -1,2 +0,2 @@
-export declare const ABGR8888: import("../api.js").PackedFormat;
+export declare const ABGR8888: import("../api.js").IntFormat;
 //# sourceMappingURL=abgr8888.d.ts.map

format/abgr8888.js

 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
-export const ABGR8888 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const ABGR8888 = defIntFormat({
     type: "u32",
@@ -5,0 +5,0 @@ size: 32,

format/alpha8.d.ts

@@ -1,2 +0,2 @@
-export declare const ALPHA8: import("../api.js").PackedFormat;
+export declare const ALPHA8: import("../api.js").IntFormat;
 //# sourceMappingURL=alpha8.d.ts.map

format/alpha8.js

@@ -1,3 +0,3 @@
-import { defPackedFormat } from "./packed-format.js";
-export const ALPHA8 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const ALPHA8 = defIntFormat({
     type: "u8",
@@ -4,0 +4,0 @@ size: 8,

format/argb1555.d.ts

@@ -1,2 +0,2 @@
-export declare const ARGB1555: import("../api.js").PackedFormat;
+export declare const ARGB1555: import("../api.js").IntFormat;
 //# sourceMappingURL=argb1555.d.ts.map

format/argb1555.js

 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
-export const ARGB1555 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const ARGB1555 = defIntFormat({
     type: "u16",
@@ -5,0 +5,0 @@ size: 16,

format/argb4444.d.ts

@@ -1,2 +0,2 @@
-export declare const ARGB4444: import("../api.js").PackedFormat;
+export declare const ARGB4444: import("../api.js").IntFormat;
 //# sourceMappingURL=argb4444.d.ts.map

format/argb4444.js

 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
-export const ARGB4444 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const ARGB4444 = defIntFormat({
     type: "u16",
@@ -5,0 +5,0 @@ size: 16,

format/argb8888.d.ts

@@ -1,2 +0,2 @@
-export declare const ARGB8888: import("../api.js").PackedFormat;
+export declare const ARGB8888: import("../api.js").IntFormat;
 //# sourceMappingURL=argb8888.d.ts.map

format/argb8888.js

 import { swapLane13 } from "@thi.ng/binary/swizzle";
 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
-export const ARGB8888 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const ARGB8888 = defIntFormat({
     type: "u32",
@@ -6,0 +6,0 @@ size: 32,

format/bgr888.d.ts

@@ -1,2 +0,2 @@
-export declare const BGR888: import("../api.js").PackedFormat;
+export declare const BGR888: import("../api.js").IntFormat;
 //# sourceMappingURL=bgr888.d.ts.map

format/bgr888.js

 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
-export const BGR888 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const BGR888 = defIntFormat({
     type: "u32",
@@ -5,0 +5,0 @@ size: 24,

format/gray-alpha16.d.ts

@@ -1,2 +0,2 @@
-export declare const GRAY_ALPHA16: import("../api.js").PackedFormat;
+export declare const GRAY_ALPHA16: import("../api.js").IntFormat;
 //# sourceMappingURL=gray-alpha16.d.ts.map

format/gray-alpha16.js

 import { Lane } from "../api.js";
 import { __luminanceABGR } from "../internal/utils.js";
-import { defPackedFormat } from "./packed-format.js";
-export const GRAY_ALPHA16 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const GRAY_ALPHA16 = defIntFormat({
     type: "u32",
@@ -6,0 +6,0 @@ size: 32,

format/gray-alpha8.d.ts

@@ -1,2 +0,2 @@
-export declare const GRAY_ALPHA8: import("../api.js").PackedFormat;
+export declare const GRAY_ALPHA8: import("../api.js").IntFormat;
 //# sourceMappingURL=gray-alpha8.d.ts.map

format/gray-alpha8.js

 import { Lane } from "../api.js";
 import { __luminanceABGR } from "../internal/utils.js";
-import { defPackedFormat } from "./packed-format.js";
-export const GRAY_ALPHA8 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const GRAY_ALPHA8 = defIntFormat({
     type: "u16",
@@ -6,0 +6,0 @@ size: 16,

format/gray16.d.ts

@@ -1,2 +0,2 @@
-export declare const GRAY16: import("../api.js").PackedFormat;
+export declare const GRAY16: import("../api.js").IntFormat;
 //# sourceMappingURL=gray16.d.ts.map

format/gray16.js

 import { Lane } from "../api.js";
 import { __luminanceABGR } from "../internal/utils.js";
-import { defPackedFormat } from "./packed-format.js";
-export const GRAY16 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const GRAY16 = defIntFormat({
     type: "u16",
@@ -6,0 +6,0 @@ size: 16,

format/gray8.d.ts

@@ -1,2 +0,2 @@
-export declare const GRAY8: import("../api.js").PackedFormat;
+export declare const GRAY8: import("../api.js").IntFormat;
 //# sourceMappingURL=gray8.d.ts.map

format/gray8.js

 import { Lane } from "../api.js";
 import { __luminanceABGR } from "../internal/utils.js";
-import { defPackedFormat } from "./packed-format.js";
-export const GRAY8 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const GRAY8 = defIntFormat({
     type: "u8",
@@ -6,0 +6,0 @@ size: 8,

format/indexed.d.ts

 import type { NumericArray } from "@thi.ng/api";
 /**
- * Creates an indexed color {@link PackedFormat} using the provided palette (in
+ * Creates an indexed color {@link IntFormat} using the provided palette (in
  * {@link ARGB8888} or {@link ABGR8888} formats, max. 256 colors).
@@ -14,3 +14,3 @@ *
  */
-export declare const defIndexed: (palette: NumericArray, isABGR?: boolean) => import("../api.js").PackedFormat;
+export declare const defIndexed: (palette: NumericArray, isABGR?: boolean) => import("../api.js").IntFormat;
 //# sourceMappingURL=indexed.d.ts.map

format/indexed.js

@@ -5,5 +5,5 @@ import { swapLane13 } from "@thi.ng/binary/swizzle";
 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
+import { defIntFormat } from "./int-format.js";
 /**
- * Creates an indexed color {@link PackedFormat} using the provided palette (in
+ * Creates an indexed color {@link IntFormat} using the provided palette (in
  * {@link ARGB8888} or {@link ABGR8888} formats, max. 256 colors).
@@ -23,3 +23,3 @@ *
     palette = isABGR ? palette : palette.map(swapLane13);
-    return defPackedFormat({
+    return defIntFormat({
         type: "u8",
@@ -26,0 +26,0 @@ size: 8,

format/rgb565.d.ts

@@ -1,2 +0,2 @@
-export declare const RGB565: import("../api.js").PackedFormat;
+export declare const RGB565: import("../api.js").IntFormat;
 //# sourceMappingURL=rgb565.d.ts.map

format/rgb565.js

 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
-export const RGB565 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const RGB565 = defIntFormat({
     type: "u16",
@@ -5,0 +5,0 @@ size: 16,

format/rgb888.d.ts

@@ -1,2 +0,2 @@
-export declare const RGB888: import("../api.js").PackedFormat;
+export declare const RGB888: import("../api.js").IntFormat;
 //# sourceMappingURL=rgb888.d.ts.map

format/rgb888.js

 import { Lane } from "../api.js";
-import { defPackedFormat } from "./packed-format.js";
-export const RGB888 = defPackedFormat({
+import { defIntFormat } from "./int-format.js";
+export const RGB888 = defIntFormat({
     type: "u32",
@@ -5,0 +5,0 @@ size: 24,

index.d.ts

@@ -6,8 +6,8 @@ export * from "./api.js";
 export * from "./float.js";
+export * from "./int.js";
 export * from "./normal-map.js";
-export * from "./packed.js";
 export * from "./pyramid.js";
 export * from "./range.js";
 export * from "./sample.js";
-export * from "./format/packed-format.js";
+export * from "./format/int-format.js";
 export * from "./format/abgr8888.js";
@@ -14,0 +14,0 @@ export * from "./format/alpha8.js";

index.js

@@ -6,8 +6,8 @@ export * from "./api.js";
 export * from "./float.js";
+export * from "./int.js";
 export * from "./normal-map.js";
-export * from "./packed.js";
 export * from "./pyramid.js";
 export * from "./range.js";
 export * from "./sample.js";
-export * from "./format/packed-format.js";
+export * from "./format/int-format.js";
 export * from "./format/abgr8888.js";
@@ -14,0 +14,0 @@ export * from "./format/alpha8.js";

internal/codegen.d.ts

 import type { Fn } from "@thi.ng/api";
-import type { PackedChannel } from "../api.js";
+import type { IntChannel } from "../api.js";
 /** @internal */
@@ -8,5 +8,5 @@ export declare const __compileGrayFromABGR: (size: number) => Fn<number, number>;
 /** @internal */
-export declare const __compileFromABGR: (chans: PackedChannel[]) => Fn<number, number>;
+export declare const __compileFromABGR: (chans: IntChannel[]) => Fn<number, number>;
 /** @internal */
-export declare const __compileToABGR: (chans: PackedChannel[], hasAlpha: boolean) => Fn<number, number>;
+export declare const __compileToABGR: (chans: IntChannel[], hasAlpha: boolean) => Fn<number, number>;
 //# sourceMappingURL=codegen.d.ts.map

internal/utils.d.ts

 import type { Fn, Fn2, FnN, UIntArray } from "@thi.ng/api";
-import type { BlitOpts, PackedFormat } from "../api.js";
+import type { BlitOpts, IntFormat } from "../api.js";
 export declare const __luminanceABGR: FnN;
@@ -27,3 +27,3 @@ /** @internal */
 export declare const __setChannelConvert: (dbuf: UIntArray, sbuf: UIntArray, from: Fn<number, number>, sto: Fn<number, number>, mask: number) => void;
-export declare const __transformABGR: (pix: UIntArray, format: PackedFormat, fn: Fn<number, number>) => void;
+export declare const __transformABGR: (pix: UIntArray, format: IntFormat, fn: Fn<number, number>) => void;
 /** @internal */
@@ -30,0 +30,0 @@ export declare const __asVec: (x: number | [number, number]) => number[];

package.json

 {
     "name": "@thi.ng/pixel",
-    "version": "2.2.0",
+    "version": "3.0.0",
     "description": "Typedarray integer & float pixel buffers w/ customizable formats, blitting, drawing, convolution",
@@ -40,5 +40,5 @@ "type": "module",
         "@thi.ng/checks": "^3.0.6",
-        "@thi.ng/distance": "^2.0.7",
+        "@thi.ng/distance": "^2.0.8",
         "@thi.ng/errors": "^2.0.6",
-        "@thi.ng/k-means": "^0.4.7",
+        "@thi.ng/k-means": "^0.4.8",
         "@thi.ng/math": "^5.0.7",
@@ -57,2 +57,3 @@ "@thi.ng/porter-duff": "^2.0.7"
         "array",
+        "abgr",
         "argb",
@@ -69,3 +70,2 @@ "binary",
         "datastructure",
-        "draw",
         "float",
@@ -76,3 +76,3 @@ "format",
         "image",
-        "interval",
+        "interpolation",
         "k-means",
@@ -82,4 +82,6 @@ "multiformat",
         "pixel",
+        "pyramid",
         "resize",
         "rgb565",
+        "sample",
         "sharpen",
@@ -177,4 +179,4 @@ "typedarray",
         },
-        "./format/packed-format": {
-            "import": "./format/packed-format.js"
+        "./format/int-format": {
+            "import": "./format/int-format.js"
         },
@@ -187,8 +189,8 @@ "./format/rgb565": {
         },
+        "./int": {
+            "import": "./int.js"
+        },
         "./normal-map": {
             "import": "./normal-map.js"
         },
-        "./packed": {
-            "import": "./packed.js"
-        },
         "./pyramid": {
@@ -208,2 +210,3 @@ "import": "./pyramid.js"
             "porter-duff",
+            "rasterize",
             "shader-ast",
@@ -214,3 +217,3 @@ "webgl"
     },
-    "gitHead": "852cd2450617c86d15d18477dc634f17f04202eb"
+    "gitHead": "d6aca4b4edb697613ed6635b1c0b12f0bf27b1f0"
 }

README.md

@@ -13,3 +13,3 @@ <!-- This file is generated - DO NOT EDIT! -->
 - [About](#about)
-  - [Packed integer pixel formats](#packed-integer-pixel-formats)
+  - [Integer pixel formats](#integer-pixel-formats)
   - [Floating point pixel formats](#floating-point-pixel-formats)
@@ -62,13 +62,11 @@ - [Filtered image sampling and resizing](#filtered-image-sampling-and-resizing)
 - Declarative custom format & optimized code generation
-- Basic shape drawing/filling (circle, line, rect)
-- Flood filling (solid or pattern)
 - HTML canvas creation & `ImageData` utilities
 
-### Packed integer pixel formats
+### Integer pixel formats
 
-All packed integer formats use the canvas native ABGR 32bit format as
-common intermediate for conversions. During conversion to ABGR, channels
-with sizes smaller than 8 bits will be scaled appropriately to ensure an
-as full-range and as linear as possible mapping. E.g. a 4 bit channel
-will be scaled by 255 / 15 = 17.
+All integer formats use the canvas native ABGR 32bit format as common
+intermediate for conversions. During conversion to ABGR, channels with sizes
+smaller than 8 bits will be scaled appropriately to ensure an as full-range and
+as linear as possible mapping. E.g. a 4 bit channel will be scaled by 255 / 15 =
+17.
 
@@ -80,3 +78,3 @@ Format specs can freely control channel layout within current limits:
 
-New formats can be defined via `defPackedFormat()`.
+New formats can be defined via `defIntFormat()`.
 
@@ -140,3 +138,3 @@ | Format ID      | Bits per pixel    | Description                                          |
 ```ts
-const src = packedBuffer(4, 4, ABGR8888);
+const src = intBuffer(4, 4, ABGR8888);
 
@@ -315,2 +313,3 @@ // fill w/ random colors
 - [@thi.ng/porter-duff](https://github.com/thi-ng/umbrella/tree/develop/packages/porter-duff) - Porter-Duff operators for packed ints & float-array alpha compositing
+- [@thi.ng/rasterize](https://github.com/thi-ng/umbrella/tree/develop/packages/rasterize) - 2D shape drawing & rasterization
 - [@thi.ng/shader-ast](https://github.com/thi-ng/umbrella/tree/develop/packages/shader-ast) - DSL to define shader code in TypeScript and cross-compile to GLSL, JS and other targets
@@ -342,3 +341,3 @@ - [@thi.ng/webgl](https://github.com/thi-ng/umbrella/tree/develop/packages/webgl) - WebGL & GLSL abstraction layer
 
-Package sizes (gzipped, pre-treeshake): ESM: 8.87 KB
+Package sizes (gzipped, pre-treeshake): ESM: 8.91 KB
 
@@ -395,3 +394,3 @@ ## Dependencies
         // init 16 bit packed RGB pixel buffer from image (resized to 256x256)
-        const buf = pix.PackedBuffer.fromImage(img, pix.RGB565, 256, 256);
+        const buf = intBufferFromImage(img, pix.RGB565, 256, 256);
 
@@ -401,3 +400,3 @@ // create grayscale buffer for logo and use Porter-Duff operator to
         // to premultiply alpha first...
-        pix.PackedBuffer.fromImage(logo, pix.GRAY_ALPHA88)
+        pix.intBufferFromImage(logo, pix.GRAY_ALPHA88)
             .premultiply()
@@ -419,3 +418,3 @@ .blend(SRC_OVER_I, buf, {
         // (returns obj of canvas & 2d context)
-        const ctx = pix.canvas2d(buf.width, buf.height * 3);
+        const ctx = pix.canvas2d(buf.width, buf.height * 3, document.body);
 
@@ -443,4 +442,2 @@ // write pixel buffer to canvas
         buf.as(GRAY8).blitCanvas(ctx.canvas, 0, buf.height * 2);
-
-        document.body.appendChild(ctx.canvas);
 });
@@ -447,0 +444,0 @@ ```

sample.d.ts

 import type { Filter, FloatSampler, IntSampler, Wrap } from "./api.js";
 import type { FloatBuffer } from "./float.js";
-import type { PackedBuffer } from "./packed.js";
-export declare function defSampler(src: PackedBuffer, filter?: Filter, wrap?: Wrap): IntSampler;
+import type { IntBuffer } from "./int.js";
 export declare function defSampler(src: FloatBuffer, filter?: Filter, wrap?: Wrap): FloatSampler;
+export declare function defSampler(src: IntBuffer, filter?: Filter, wrap?: Wrap): IntSampler;
 //# sourceMappingURL=sample.d.ts.map

No alert changes

Improved metrics

Total package byte prevSize

150578

increased by0.47%

Lines of code

2761

increased by0.11%

Worsened metrics

Number of lines in readme file

456

decreased by-0.65%

Dependency changes

• [e-mail]/distance@^2.0.8

• [e-mail]/k-means@^0.4.8