textmode.js 0.6.0-beta.3 → 0.6.0-beta.4

package/dist/types/index.d.ts

@@ -1,11 +1,13 @@
 import { Textmode } from './Textmode';
 export { Textmodifier } from './textmode/Textmodifier';
-export { GLFramebuffer as TextmodeFramebuffer } from './rendering';
+export { GLFramebuffer as TextmodeFramebuffer, Shader } from './rendering';
 export { TextmodeColor } from './textmode/TextmodeColor';
 export { TextmodeCanvas } from './textmode/Canvas';
 export { TextmodeGrid } from './textmode/Grid';
 export type { TextmodeOptions } from './textmode/types';
 export type { TextmodeFramebufferOptions } from './rendering/webgl';
+export { registerConversionStrategy, unregisterConversionStrategy, getConversionStrategy, } from './textmode/conversion';
+export type { TextmodeConversionStrategy, TextmodeConversionContext, TextmodeConversionMode, } from './textmode/conversion';
 export type { TextmodePlugin, TextmodePluginAPI, } from './textmode/managers/PluginManager';
 export { TextmodeErrorLevel } from './errors/ErrorHandler';
 export { Textmode as textmode } from './Textmode';

package/dist/types/rendering/webgl/core/Renderer.d.ts

@@ -2,8 +2,9 @@ import { GLFramebuffer } from "./Framebuffer";
 import type { FramebufferOptions } from './Framebuffer';
 import { GLShader } from "./Shader";
 import { RenderState } from "../state/RenderState";
-import type { TextmodeImage } from "../../../textmode/loadables/TextmodeImage";
+import type { TextmodeSource } from '../../../textmode/loadables/TextmodeSource';
 import type { IRenderer } from "./interfaces/IRenderer";
+import { MaterialManager } from '../materials/MaterialManager';
 export declare class GLRenderer implements IRenderer {
     private _gl;
     private _currentShader;
@@ -45,7 +46,7 @@ export declare class GLRenderer implements IRenderer {
     $setUniform(name: string, value: any): void;
     $setUserUniforms(uniforms: Record<string, any>): void;
     $createFilterShader(fragmentSource: string): GLShader;
-    $image(source: GLFramebuffer | TextmodeImage, width?: number, height?: number): void;
+    $image(source: GLFramebuffer | TextmodeSource, width?: number, height?: number): void;
     $quad(x: number, y: number, width: number, height: number): void;
     $rect(width: number, height: number): void;
     $line(x1: number, y1: number, x2: number, y2: number): void;
@@ -61,4 +62,5 @@ export declare class GLRenderer implements IRenderer {
     $dispose(): void;
     get context(): WebGLRenderingContext;
     get state(): RenderState;
+    get materialManager(): MaterialManager;
 }

package/dist/types/textmode/TextmodeColor.d.ts

@@ -1,3 +1,6 @@
+type GlyphColor = [number, number, number];
+type GlyphColorResolver = (chars: string) => GlyphColor[];
+type ColorTuple = [number, number, number] | [number, number, number, number];
 /**
  * Represents a color in the `textmode.js` rendering system.
  *
@@ -19,6 +22,13 @@ export declare class TextmodeColor {
     /** Alpha component *(0-255)* */
     readonly a: number;
     private constructor();
+    /**
+     * Create a color from any supported source.
+     * Accepts an existing {@link TextmodeColor}, CSS hex strings, single characters
+     * (resolved through a glyph resolver), grayscale values, RGB(A) tuples, or
+     * normalized component arrays.
+     */
+    static $from(value: TextmodeColor | string | number | ColorTuple, gOrResolver?: number | GlyphColorResolver, b?: number, a?: number): TextmodeColor;
     /**
      * Create a color from RGB or RGBA components (0-255 range).
      * @ignore
@@ -48,10 +58,15 @@ export declare class TextmodeColor {
     get normalized(): [number, number, number, number];
     /** Returns the character encoding *(0-1 range)* if this color was created from a glyph. */
     get character(): [number, number, number] | undefined;
+    /**
+     * Create a copy of this color with a different alpha value.
+     */
+    withAlpha(alpha: number): TextmodeColor;
     /**
      * Runtime type guard.
      * @ignore
      */
     static $isColor(value: unknown): value is TextmodeColor;
 }
-export type ColorLike = TextmodeColor | [number, number, number] | [number, number, number, number];
+export type ColorLike = TextmodeColor | string | number | [number, number, number] | [number, number, number, number];
+export {};

package/dist/types/textmode/Textmodifier.d.ts

@@ -3,6 +3,7 @@ import { TextmodeFont } from './loadables/font';
 import { TextmodeGrid } from './Grid';
 import { TextmodeCanvas } from './Canvas';
 import { TextmodeImage } from './loadables/TextmodeImage';
+import type { TextmodeSource } from './loadables/TextmodeSource';
 import { AnimationController } from './AnimationController';
 import { MouseManager } from './managers/MouseManager';
 import { KeyboardManager } from './managers/KeyboardManager';
@@ -54,6 +55,7 @@ export declare class Textmodifier extends Textmodifier_base implements ITextmodi
     private _resizeObserver?;
     private _isOverlay;
     private _targetCanvasImage?;
+    private _sources;
     /**
      * Create a new Textmodifier instance.
      * @param opts Configuration options for the Textmodifier instance.
@@ -82,6 +84,8 @@ export declare class Textmodifier extends Textmodifier_base implements ITextmodi
     get isDisposed(): boolean;
     get overlay(): TextmodeImage | undefined;
     get loading(): LoadingScreenManager;
+    $registerSource(source: TextmodeSource): void;
+    $notifyFontChange(): void;
 }
 export interface Textmodifier extends IRenderingMixin, IFontMixin, IAnimationMixin, IMouseMixin, ITouchMixin, IKeyboardMixin {
 }

package/dist/types/textmode/conversion/ConversionRegistry.d.ts

@@ -0,0 +1,21 @@
+import type { Shader } from '../../rendering';
+import type { GLRenderer } from '../../rendering/webgl/core/Renderer';
+import type { TextmodeFont } from '../loadables/font/TextmodeFont';
+import type { TextmodeSource } from '../loadables/TextmodeSource';
+export type TextmodeConversionMode = 'brightness' | 'accurate' | (string & {});
+export interface TextmodeConversionContext {
+    renderer: GLRenderer;
+    gl: WebGL2RenderingContext;
+    font: TextmodeFont;
+    source: TextmodeSource;
+    gridWidth: number;
+    gridHeight: number;
+}
+export interface TextmodeConversionStrategy {
+    readonly id: TextmodeConversionMode;
+    createShader(context: TextmodeConversionContext): Shader;
+    createUniforms(context: TextmodeConversionContext): Record<string, any>;
+}
+export declare function registerConversionStrategy(strategy: TextmodeConversionStrategy): void;
+export declare function unregisterConversionStrategy(id: TextmodeConversionMode): void;
+export declare function getConversionStrategy(id: TextmodeConversionMode): TextmodeConversionStrategy | undefined;

package/dist/types/textmode/conversion/index.d.ts

@@ -0,0 +1 @@
+export * from './ConversionRegistry';

package/dist/types/textmode/conversion/strategies/brightness.d.ts

@@ -0,0 +1,2 @@
+import type { TextmodeConversionStrategy } from '../ConversionRegistry';
+export declare const brightnessStrategy: TextmodeConversionStrategy;

package/dist/types/textmode/interfaces/ITextmodifier.d.ts

@@ -1,6 +1,7 @@
 import type { TextmodeGrid } from '../Grid';
 import type { TextmodeFont } from '../loadables/font';
 import type { TextmodeImage } from '../loadables/TextmodeImage';
+import type { TextmodeSource } from '../loadables/TextmodeSource';
 import type { TextmodeCanvas } from '../Canvas';
 import type { AnimationController } from '../AnimationController';
 import type { GLFramebuffer, Shader } from '../../rendering';
@@ -50,6 +51,10 @@ export interface ITextmodifier extends IRenderingMixin, IFontMixin, IAnimationMi
     readonly _presentShader: Shader;
     /** Loading screen manager for boot-time UX @ignore */
     readonly _loading: LoadingScreenManager;
+    /** @ignore */
+    $registerSource(source: TextmodeSource): void;
+    /** @ignore */
+    $notifyFontChange(): void;
     /** Main render method @ignore */
     $render(): void;
     /**

package/dist/types/textmode/loadables/TextmodeImage.d.ts

@@ -1,4 +1,5 @@
 import type { GLRenderer } from '../../rendering/webgl/core/Renderer';
+import type { TextmodeFont } from './font/TextmodeFont';
 import { TextmodeSource } from './TextmodeSource';
 /**
  * Represents an image uploaded for textmode rendering via {@link Textmodifier.loadImage}.
@@ -42,6 +43,6 @@ export declare class TextmodeImage extends TextmodeSource {
      * Texture parameters use NEAREST and CLAMP to align with grid sampling.
      * @ignore
      */
-    static $fromSource(renderer: GLRenderer, source: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement, gridCols: number, gridRows: number, glyphResolver: (s: string) => ([number, number, number])[]): TextmodeImage;
+    static $fromSource(renderer: GLRenderer, font: TextmodeFont, source: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement, gridCols: number, gridRows: number, glyphResolver: (s: string) => ([number, number, number])[]): TextmodeImage;
     protected $getActiveTexture(): WebGLTexture;
 }

package/dist/types/textmode/loadables/TextmodeSource.d.ts

@@ -1,7 +1,13 @@
 import type { GLRenderer } from '../../rendering/webgl/core/Renderer';
 import type { Material } from '../../rendering/webgl/materials/Material';
 import { TextmodeColor } from '../TextmodeColor';
+import type { TextmodeFont } from './font/TextmodeFont';
+import { type TextmodeConversionMode } from '../conversion';
+export interface TextmodeConversionOptions {
+    sampleRate?: number;
+}
 type GlyphColor = [number, number, number];
+export type TextmodeColorFilterInput = TextmodeColor | string | [number, number, number] | [number, number, number, number];
 /**
  * Base class for drawable textmode sources (images, videos, canvas, etc.).
  * Handles shared WebGL texture state, material creation, and color/character settings.
@@ -15,6 +21,9 @@ export declare abstract class TextmodeSource {
     protected _width: number;
     protected _height: number;
     protected _material: Material | null;
+    protected _font: TextmodeFont;
+    protected _conversionMode: TextmodeConversionMode;
+    private _cachedConversionStrategy;
     protected _invert: number;
     protected _flipX: number;
     protected _flipY: number;
@@ -26,13 +35,23 @@ export declare abstract class TextmodeSource {
     protected _backgroundColor: [number, number, number, number];
     protected _glyphColors: GlyphColor[];
     protected _glyphColorResolver: (s: string) => GlyphColor[];
-    private static _sharedShader;
-    protected constructor(gl: WebGL2RenderingContext, renderer: GLRenderer, texture: WebGLTexture, originalWidth: number, originalHeight: number, width: number, height: number);
+    private _characterString;
+    private _disposeListeners;
+    private _colorFilterPalette;
+    private _colorFilterSize;
+    protected constructor(gl: WebGL2RenderingContext, renderer: GLRenderer, texture: WebGLTexture, font: TextmodeFont, originalWidth: number, originalHeight: number, width: number, height: number);
+    /**
+     * Select the conversion mode for this source.
+     * `'brightness'` uses single-sample conversion, while `'accurate'` performs glyph matching.
+     * @param mode Conversion mode to use.
+     */
+    conversionMode(mode: TextmodeConversionMode): this;
     /**
      * Dispose of the underlying WebGL texture. Subclasses may extend for additional cleanup.
      * @ignore
      */
     $dispose(): void;
+    $onDispose(callback: () => void): void;
     /**
      * Set the invert flag, swapping character and cell colors when enabled.
      * @param v Invert flag
@@ -96,13 +115,23 @@ export declare abstract class TextmodeSource {
      * @returns This instance for chaining.
      */
     background(colorOrGray: number | TextmodeColor | string, g?: number, b?: number, a?: number): this;
+    /**
+     * Applies an optional color filter palette before MRT conversion.
+     * When a palette is provided, all sampled pixels are quantized to the closest palette color
+     * prior to character/color analysis.
+     *
+     * @param palette A list of colors defined as {@link TextmodeColor} instances, hex strings, or RGBA tuples (0-255).
+     * Providing an empty array or `null` disables the filter.
+     */
+    colorFilter(palette?: TextmodeColorFilterInput[] | null): this;
     /**
      * Define the characters to use for brightness mapping as a string.
-     * Maximum length is 64; excess characters are ignored.
+     * Maximum length is 255; excess characters are ignored.
      * @param chars String of characters to map
      * @returns This instance for chaining.
      */
     characters(chars: string): this;
+    $handleFontChange(font: TextmodeFont): void;
     /** Return the WebGL texture currently backing this source. */
     get texture(): WebGLTexture;
     /** Ideal width in grid cells. */
@@ -124,7 +153,9 @@ export declare abstract class TextmodeSource {
     protected abstract $getActiveTexture(): WebGLTexture;
     private _updateMaterial;
     private _setColor;
-    private _ensureShader;
-    protected _createUniforms(): Record<string, any>;
+    private _applyCharacterPalette;
+    createBaseConversionUniforms(): Record<string, any>;
+    private _getActiveConversionStrategy;
+    private _createConversionContext;
 }
 export {};

package/dist/types/textmode/loadables/TextmodeVideo.d.ts

@@ -1,5 +1,6 @@
 import type { GLRenderer } from '../../rendering/webgl/core/Renderer';
 import type { Material } from '../../rendering/webgl/materials/Material';
+import type { TextmodeFont } from './font/TextmodeFont';
 import { TextmodeSource } from './TextmodeSource';
 type TextmodeVideoPreloadStrategy = 'captureStream' | 'seeking';
 export interface TextmodeVideoPreloadProgress {
@@ -97,7 +98,7 @@ export declare class TextmodeVideo extends TextmodeSource {
      *
      * @ignore
      */
-    constructor(gl: WebGL2RenderingContext, renderer: GLRenderer, texture: WebGLTexture, videoElement: HTMLVideoElement, originalWidth: number, originalHeight: number, gridCols: number, gridRows: number);
+    constructor(gl: WebGL2RenderingContext, renderer: GLRenderer, texture: WebGLTexture, font: TextmodeFont, videoElement: HTMLVideoElement, originalWidth: number, originalHeight: number, gridCols: number, gridRows: number);
     /**
      * Dispose of GPU resources and cleanup video element.
      * @ignore
@@ -175,7 +176,7 @@ export declare class TextmodeVideo extends TextmodeSource {
      * @returns Promise resolving to TextmodeVideo instance
      * @ignore
      */
-    static $fromSource(renderer: GLRenderer, source: string | HTMLVideoElement, gridCols: number, gridRows: number, glyphResolver: (s: string) => ([number, number, number])[], options?: TextmodeVideoOptions): Promise<TextmodeVideo>;
+    static $fromSource(renderer: GLRenderer, font: TextmodeFont, source: string | HTMLVideoElement, gridCols: number, gridRows: number, glyphResolver: (s: string) => ([number, number, number])[], options?: TextmodeVideoOptions): Promise<TextmodeVideo>;
     /**
      * Play the video.
      * @returns Promise that resolves when playback starts

package/dist/types/textmode/loadables/index.d.ts

@@ -1,5 +1,8 @@
 export { TextmodeImage } from './TextmodeImage';
 export { TextmodeVideo } from './TextmodeVideo';
+export { TextmodeSource } from './TextmodeSource';
 export { TextmodeFont } from './font/TextmodeFont';
 export type { TextmodeCharacter } from './font/types';
 export type { TextmodeVideoOptions } from './TextmodeVideo';
+export type { TextmodeConversionOptions } from './TextmodeSource';
+export type { TextmodeConversionMode } from '../conversion';

package/dist/types/textmode/mixins/interfaces/IRenderingMixin.d.ts

@@ -1,5 +1,6 @@
 import type { GLFramebuffer, GLShader, TextmodeFramebufferOptions, UniformValue } from "../../../rendering/webgl";
-import type { TextmodeImage } from "../../loadables/TextmodeImage";
+import type { TextmodeSource } from '../../loadables/TextmodeSource';
+import type { TextmodeImage } from '../../loadables/TextmodeImage';
 import type { TextmodeVideo, TextmodeVideoOptions } from "../../loadables/TextmodeVideo";
 import type { TextmodeColor } from "../../TextmodeColor";
 /**
@@ -117,7 +118,7 @@ export interface IRenderingMixin {
      * });
      * ```
      */
-    image(source: GLFramebuffer | TextmodeImage, width?: number, height?: number): void;
+    image(source: GLFramebuffer | TextmodeSource, width?: number, height?: number): void;
     /**
      * Load an image and return a TextmodeImage that can be drawn with image().
      *

package/dist/types/utils/color.d.ts

@@ -0,0 +1 @@
+export declare function parseHexColor(hexString: string): [number, number, number, number];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "textmode.js",
-  "version": "0.6.0-beta.3",
+  "version": "0.6.0-beta.4",
   "description": "textmode.js is a lightweight creative coding library for creating real-time ASCII art on the web.",
   "type": "module",
   "types": "./dist/types/index.d.ts",
@@ -20,9 +20,8 @@
   },
   "scripts": {
     "dev": "vite --port 5177 --host",
-    "build": "vite build && vite build --mode min && tsc",
+    "build": "vite build && tsc",
     "build:full": "vite build && tsc",
-    "build:min": "vite build --mode min && tsc",
     "build:docs": "typedoc",
     "dev:docs": "typedoc --watch",
     "preview": "vite preview",