imagescript 3.0.0 → 3.1.0

package/dist/image.js

@@ -1,6 +1,8 @@
 import * as png from "./codecs/png.js";
 import * as jpeg from "./codecs/jpeg.js";
 import * as tiff from "./codecs/tiff.js";
+import * as webp from "./codecs/webp.js";
+import * as tga from "./codecs/tga.js";
 import * as quantize from "./codecs/quantize.js";
 import * as textRenderer from "./render/text.js";
 import * as svgRenderer from "./render/svg.js";
@@ -606,6 +608,29 @@ export class Image {
         }
         return this;
     }
+    colorToAlpha(color, options = {}) {
+        const { transparencyThreshold = 0, opacityThreshold = 1 } = options;
+        if (!(transparencyThreshold >= 0 && opacityThreshold <= 1 && transparencyThreshold < opacityThreshold))
+            throw new RangeError('Invalid thresholds, they have to satisfy 0 <= transparencyThreshold < opacityThreshold <= 1');
+        const bitmap = this.bitmap;
+        const c = color === undefined ? [bitmap[0], bitmap[1], bitmap[2]] : [color >>> 24, color >> 16 & 255, color >> 8 & 255];
+        for (let i = 0; i < bitmap.length; i += 4) {
+            let distance = 0;
+            for (let k = 0; k < 3; k++) {
+                const d = bitmap[i + k] - c[k];
+                const a = d > 0 ? d / (255 - c[k]) : d < 0 ? -d / c[k] : 0;
+                if (a > distance)
+                    distance = a;
+            }
+            const alpha = distance <= transparencyThreshold ? 0 : distance >= opacityThreshold ? 1
+                : (distance - transparencyThreshold) / (opacityThreshold - transparencyThreshold);
+            if (alpha > 0)
+                for (let k = 0; k < 3; k++)
+                    bitmap[i + k] = Math.round((bitmap[i + k] - c[k]) / alpha + c[k]);
+            bitmap[i + 3] = Math.round(bitmap[i + 3] * alpha);
+        }
+        return this;
+    }
     __map_channels__(map) {
         const lut = new Uint8ClampedArray(256);
         for (let v = 0; v < 256; v++)
@@ -878,6 +903,12 @@ export class Image {
     async encodeJPEG(quality = 90) {
         return jpeg.encode(this.__bytes__(), this.width, this.height, quality);
     }
+    async encodeWebP() {
+        return webp.encode(this.__bytes__(), this.width, this.height);
+    }
+    async encodeTGA() {
+        return tga.encode(this.__bytes__(), this.width, this.height);
+    }
     static async decode(input, options = {}) {
         const { applyOrientation = true } = options;
         const data = view(input);
@@ -889,6 +920,13 @@ export class Image {
             decoded = jpeg.decode(data);
         else if (ImageType.isTIFF(dataView))
             decoded = await tiff.decode(data);
+        else if (ImageType.isWebP(dataView)) {
+            if (webp.isAnimated(data))
+                throw new Error('Animated WebPs have to be decoded with Animation.decode()');
+            decoded = webp.decode(data);
+        }
+        else if (ImageType.isTGA(dataView))
+            decoded = tga.decode(data);
         else
             throw new Error('Unsupported image type');
         const image = new Image(decoded.width, decoded.height);
@@ -963,10 +1001,10 @@ export class Image {
         return image;
     }
     static async renderText(font, size, text, color = 0xffffffff, layout = new TextLayout(), style = {}) {
-        const { strokeWidth = 0, strokeColor = 0x000000ff } = style;
+        const { strokeWidth = 0, strokeColor = 0x000000ff, hinting = true } = style;
         if (isNaN(strokeWidth) || strokeWidth < 0)
             throw new RangeError('Invalid stroke width');
-        const rendered = textRenderer.render(view(font), size, text, layout);
+        const rendered = textRenderer.render(view(font), size, text, layout, hinting);
         const [r, g, b, a] = Image.colorToRGBA(color);
         const pad = Math.ceil(strokeWidth);
         const width = rendered.width + 2 * pad, height = rendered.height + 2 * pad;

package/dist/index.d.ts

@@ -1,19 +1,23 @@
 import { BinaryData } from './util/mem.js';
 import { Image } from './image.js';
 import { GIF } from './gif.js';
+import { Animation } from './animation.js';
 export { Image } from './image.js';
-export type { Color, ColorFunction, ResizeMode, SVGScaleMode, PNGMetadata, TextStyle, DecodeOptions, CompositeOptions, BlendMode, CropCircleOptions, DominantColorOptions, RotateOptions } from './image.js';
+export type { Color, ColorFunction, ResizeMode, SVGScaleMode, PNGMetadata, TextStyle, DecodeOptions, CompositeOptions, BlendMode, CropCircleOptions, DominantColorOptions, RotateOptions, ColorToAlphaOptions } from './image.js';
 export { Frame } from './frame.js';
 export type { FrameDisposalModeName, FrameDisposalModeId } from './frame.js';
 export { GIF } from './gif.js';
+export { Animation } from './animation.js';
 export { TextLayout } from './text-layout.js';
 export type { TextLayoutOptions, WrapStyle, HorizontalAlign, VerticalAlign } from './text-layout.js';
 export { ImageType } from './image-type.js';
 export type { ImageTypeName } from './image-type.js';
 export type { BinaryData } from './util/mem.js';
 /**
- * Decodes any supported image, GIFs are returned as {@link GIF}
+ * Decodes any supported image: GIFs are returned as {@link GIF} (an {@link Animation}), animated WebPs as
+ * {@link Animation}, everything else (including APNGs, as their default image) as {@link Image}.
+ * {@link Animation.decode} decodes the frames of GIFs, APNGs and WebPs
  * @param data The image data
- * @param onlyExtractFirstFrame Whether to end GIF decoding after the first frame
+ * @param onlyExtractFirstFrame Whether to end animation decoding after the first frame
  */
-export declare function decode(data: BinaryData, onlyExtractFirstFrame?: boolean): Promise<GIF | Image>;
+export declare function decode(data: BinaryData, onlyExtractFirstFrame?: boolean): Promise<GIF | Animation | Image>;

package/dist/index.js

@@ -1,13 +1,20 @@
 import { Image } from "./image.js";
 import { GIF } from "./gif.js";
+import { Animation } from "./animation.js";
+import * as webp from "./codecs/webp.js";
+import { view } from "./util/mem.js";
 import { ImageType } from "./image-type.js";
 export { Image } from "./image.js";
 export { Frame } from "./frame.js";
 export { GIF } from "./gif.js";
+export { Animation } from "./animation.js";
 export { TextLayout } from "./text-layout.js";
 export { ImageType } from "./image-type.js";
 export function decode(data, onlyExtractFirstFrame = false) {
-    if (ImageType.getType(data) === 'gif')
+    const type = ImageType.getType(data);
+    if (type === 'gif')
         return GIF.decode(data, onlyExtractFirstFrame);
+    if (type === 'webp' && webp.isAnimated(view(data)))
+        return Animation.decode(data, onlyExtractFirstFrame);
     return Image.decode(data);
 }

package/dist/render/font.d.ts

@@ -3,6 +3,28 @@
  * ['M', x, y], ['L', x, y], ['Q', cx, cy, x, y], ['C', c1x, c1y, c2x, c2y, x, y], ['Z']
  */
 export type PathCommand = [string, ...number[]];
+/** a TrueType glyph's points (font units) and instructions, for hinting */
+export interface GlyfPoints {
+    xs: number[];
+    ys: number[];
+    /** on curve flags */
+    on: boolean[];
+    /** index of the last point of every contour */
+    ends: number[];
+    instructions: Uint8Array;
+    /** glyph bounding box minimum x (the left side bearing's reference) */
+    xMin: number;
+    /** components of composite glyphs (their points are not included in xs/ys) */
+    components: Array<{
+        glyph: number;
+        dx: number;
+        dy: number;
+        matrix: [number, number, number, number];
+        round: boolean;
+        match: [number, number] | null;
+        useMetrics: boolean;
+    }> | null;
+}
 interface CFF {
     charStrings: Uint8Array[];
     globalSubrs: Uint8Array[];
@@ -50,6 +72,12 @@ export declare class Font {
      * @return {number} advance width in font units
      */
     advance(glyph: number): number;
+    /** left side bearing in font units */
+    leftSideBearing(glyph: number): number;
+    /**
+     * A TrueType glyph's points and instructions (null for empty glyphs or CFF fonts)
+     */
+    glyfPoints(glyph: number): GlyfPoints | null;
     /**
      * @param {number} glyph
      * @return {Array} path commands in font units
@@ -60,4 +88,5 @@ export declare class Font {
     compositeGlyph(offset: number, depth: number): PathCommand[];
     cffOutline(glyph: number): PathCommand[];
 }
+export declare function contourToPath(path: PathCommand[], xs: ArrayLike<number>, ys: ArrayLike<number>, flags: ArrayLike<number | boolean>, first: number, last: number): void;
 export {};

package/dist/render/font.js

@@ -73,6 +73,103 @@ export class Font {
         const index = Math.min(glyph, this.numberOfHMetrics - 1);
         return this.u16(hmtx + index * 4);
     }
+    leftSideBearing(glyph) {
+        const hmtx = this.tables.hmtx.offset;
+        if (glyph < this.numberOfHMetrics)
+            return this.i16(hmtx + glyph * 4 + 2);
+        return this.i16(hmtx + this.numberOfHMetrics * 4 + (glyph - this.numberOfHMetrics) * 2);
+    }
+    glyfPoints(glyph) {
+        if (this.outlines !== 'glyf' || glyph >= this.numGlyphs)
+            return null;
+        const loca = this.tables.loca.offset;
+        const start = this.indexToLocFormat ? this.u32(loca + glyph * 4) : this.u16(loca + glyph * 2) * 2;
+        const end = this.indexToLocFormat ? this.u32(loca + glyph * 4 + 4) : this.u16(loca + glyph * 2 + 2) * 2;
+        if (end <= start)
+            return null;
+        const offset = this.tables.glyf.offset + start;
+        const contourCount = this.i16(offset);
+        const xMin = this.i16(offset + 2);
+        if (contourCount < 0) {
+            const components = [];
+            let p = offset + 10, flags = 0;
+            do {
+                flags = this.u16(p);
+                const component = this.u16(p + 2);
+                p += 4;
+                let arg1, arg2;
+                if (flags & 1) {
+                    arg1 = flags & 2 ? this.i16(p) : this.u16(p);
+                    arg2 = flags & 2 ? this.i16(p + 2) : this.u16(p + 2);
+                    p += 4;
+                }
+                else {
+                    arg1 = flags & 2 ? this.i8(p) : this.u8(p);
+                    arg2 = flags & 2 ? this.i8(p + 1) : this.u8(p + 1);
+                    p += 2;
+                }
+                let matrix = [1, 0, 0, 1];
+                const f2dot14 = (o) => this.i16(o) / 16384;
+                if (flags & 8) {
+                    const s = f2dot14(p);
+                    matrix = [s, 0, 0, s];
+                    p += 2;
+                }
+                else if (flags & 0x40) {
+                    matrix = [f2dot14(p), 0, 0, f2dot14(p + 2)];
+                    p += 4;
+                }
+                else if (flags & 0x80) {
+                    matrix = [f2dot14(p), f2dot14(p + 2), f2dot14(p + 4), f2dot14(p + 6)];
+                    p += 8;
+                }
+                components.push({
+                    glyph: component,
+                    dx: flags & 2 ? arg1 : 0,
+                    dy: flags & 2 ? arg2 : 0,
+                    matrix,
+                    round: (flags & 4) !== 0,
+                    match: flags & 2 ? null : [arg1, arg2],
+                    useMetrics: (flags & 0x200) !== 0
+                });
+            } while (flags & 0x20);
+            const instructions = flags & 0x100 ? this.data.subarray(p + 2, p + 2 + this.u16(p)) : new Uint8Array(0);
+            return { xs: [], ys: [], on: [], ends: [], instructions, xMin, components };
+        }
+        const ends = [];
+        for (let i = 0; i < contourCount; i++)
+            ends.push(this.u16(offset + 10 + i * 2));
+        const pointCount = contourCount ? ends[contourCount - 1] + 1 : 0;
+        let p = offset + 10 + contourCount * 2;
+        const instructionLength = this.u16(p);
+        const instructions = this.data.subarray(p + 2, p + 2 + instructionLength);
+        p += 2 + instructionLength;
+        const flags = new Uint8Array(pointCount);
+        for (let i = 0; i < pointCount;) {
+            const flag = this.u8(p++);
+            flags[i++] = flag;
+            if (flag & 8)
+                for (let repeat = this.u8(p++); repeat > 0 && i < pointCount; repeat--)
+                    flags[i++] = flag;
+        }
+        const xs = [], ys = [];
+        for (const [coords, short, same] of [[xs, 2, 16], [ys, 4, 32]]) {
+            let value = 0;
+            for (let i = 0; i < pointCount; i++) {
+                const flag = flags[i];
+                if (flag & short) {
+                    const delta = this.u8(p++);
+                    value += flag & same ? delta : -delta;
+                }
+                else if (!(flag & same)) {
+                    value += this.i16(p);
+                    p += 2;
+                }
+                coords.push(value);
+            }
+        }
+        return { xs, ys, on: Array.from(flags, f => (f & 1) === 1), ends, instructions, xMin, components: null };
+    }
     outline(glyph) {
         if (glyph >= this.numGlyphs)
             glyph = 0;
@@ -190,11 +287,11 @@ export class Font {
         return cffCharString(this.cff, glyph);
     }
 }
-function contourToPath(path, xs, ys, flags, first, last) {
+export function contourToPath(path, xs, ys, flags, first, last) {
     if (last < first)
         return;
     const count = last - first + 1;
-    const on = (i) => flags[first + (i % count)] & 1;
+    const on = (i) => flags[first + (i % count)] === true || (flags[first + (i % count)] & 1) === 1;
     const x = (i) => xs[first + (i % count)];
     const y = (i) => ys[first + (i % count)];
     let start = -1;

package/dist/render/hinting.d.ts

@@ -0,0 +1,110 @@
+/*!
+ * TrueType hinting interpreter. Where the TrueType specification leaves details open, its behavior and parts of its
+ * logic follow FreeType's TrueType interpreter (src/truetype/ttinterp.c): fixed point rounding, original distances
+ * on the unscaled outline (IP, IUP, MDRP, MD), the IUP interpolation, the movement along near-perpendicular vectors
+ * and the tolerance of invalid references. Portions of this software are copyright © 2026 The FreeType Project
+ * (https://freetype.org). All rights reserved. FreeType License, see THIRD_PARTY_NOTICES.md and licenses/FTL.txt
+ */
+import { Font, PathCommand } from './font.js';
+interface Vector {
+    x: number;
+    y: number;
+}
+interface GraphicsState {
+    pv: Vector;
+    fv: Vector;
+    dv: Vector;
+    rp0: number;
+    rp1: number;
+    rp2: number;
+    zp0: number;
+    zp1: number;
+    zp2: number;
+    loop: number;
+    minimumDistance: number;
+    cvtCutIn: number;
+    singleWidthCutIn: number;
+    singleWidth: number;
+    deltaBase: number;
+    deltaShift: number;
+    autoFlip: boolean;
+    /** null: rounding off */
+    round: {
+        period: number;
+        phase: number;
+        threshold: number;
+    } | null;
+    instructControl: number;
+}
+interface Zone {
+    curX: Float64Array;
+    curY: Float64Array;
+    orgX: Float64Array;
+    orgY: Float64Array;
+    /** unscaled original positions (font units), measurements between original glyph points use them */
+    orusX: Float64Array;
+    orusY: Float64Array;
+    touchX: Uint8Array;
+    touchY: Uint8Array;
+    on: Uint8Array;
+    ends: number[];
+}
+interface FunctionDef {
+    code: Uint8Array;
+    start: number;
+    end: number;
+}
+/** state of a font at one size, after the font and control value programs ran */
+interface SizeState {
+    ppem: number;
+    /** 26.6 units per font unit */
+    scale: number;
+    /** the same as 16.16 fixed point number */
+    scaleFixed: number;
+    cvt: Float64Array;
+    storage: Int32Array;
+    state: GraphicsState;
+    twilight: Zone;
+    functions: Map<number, FunctionDef>;
+    instructions: Map<number, FunctionDef>;
+    /** set if the font and control value programs failed, the font is then rendered unhinted */
+    broken: boolean;
+}
+export interface HintedGlyph {
+    /** outline in pixels, relative to the pen position (y up) */
+    path: PathCommand[];
+    /** advance width in whole pixels */
+    advance: number;
+}
+/**
+ * Executes TrueType instructions for one font
+ */
+export declare class Hinter {
+    font: Font;
+    fpgm: Uint8Array;
+    prep: Uint8Array;
+    cvt: Int16Array;
+    maxStack: number;
+    maxStorage: number;
+    maxTwilight: number;
+    sizes: Map<number, SizeState>;
+    /** 26.6 units per font unit (16.16 fixed point) of the glyph being loaded */
+    private scaleFixed;
+    constructor(font: Font);
+    /** whether the font has hinting instructions (a font program, control value program or control values) */
+    get hasInstructions(): boolean;
+    private size;
+    /**
+     * Hints a glyph at a size
+     * @param size pixels per em
+     * @return the hinted outline, or null if the glyph can't be hinted (it is then rendered unhinted)
+     */
+    glyph(glyph: number, size: number): HintedGlyph | null;
+    /**
+     * Loads, scales and hints a glyph (recursively for composites)
+     * @return the glyph zone (with 4 phantom points after the outline points)
+     */
+    private load;
+    private phantoms;
+}
+export {};