@lightningjs/renderer 2.18.4 → 2.19.1

package/dist/src/core/text-rendering/SdfFont.d.ts

@@ -0,0 +1,29 @@
+import type { Stage } from '../Stage.js';
+import type { ImageTexture } from '../textures/ImageTexture.js';
+import { CoreFont, type CoreFontProps } from './CoreFont.js';
+import { type SdfFontData } from './SdfFontHandler.js';
+import type { NormalizedFontMetrics, TextRenderer } from './TextRenderer.js';
+export type SdfFontProps = CoreFontProps & {
+    atlasUrl: string;
+    atlasDataUrl: string;
+};
+export declare class SdfFont extends CoreFont {
+    private stage;
+    type: string;
+    atlasUrl: string;
+    atlasDataUrl: string;
+    atlasTexture?: ImageTexture;
+    private glyphMap?;
+    private kerningTable?;
+    private data?;
+    constructor(textRenderer: TextRenderer, props: SdfFontProps, stage: Stage);
+    load(): void;
+    private hardFail;
+    private processFontData;
+    measureText(text: string, letterSpacing: number): number;
+    getMetrics(fontSize: number): NormalizedFontMetrics;
+    getGlyph(codepoint: number): import("./SdfFontHandler.js").SdfGlyph | null;
+    getKerning(firstGlyph: number, secondGlyph: number): number;
+    getAtlas(): ImageTexture;
+    getData(): SdfFontData;
+}

package/dist/src/core/text-rendering/SdfFont.js

@@ -0,0 +1,142 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2025 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { CoreFont, FontState } from './CoreFont.js';
+import { buildGlyphMap, buildKerningTable, } from './SdfFontHandler.js';
+import { normalizeFontMetrics } from './TextLayoutEngine.js';
+import { hasZeroWidthSpace } from './Utils.js';
+export class SdfFont extends CoreFont {
+    stage;
+    type = 'sdf';
+    atlasUrl;
+    atlasDataUrl;
+    atlasTexture;
+    glyphMap;
+    kerningTable;
+    data;
+    constructor(textRenderer, props, stage) {
+        super(textRenderer, props);
+        this.stage = stage;
+        this.atlasUrl = props.atlasUrl;
+        this.atlasDataUrl = props.atlasDataUrl;
+    }
+    load() {
+        new Promise(async () => {
+            const atlasData = await fetch(this.atlasDataUrl);
+            if (atlasData.ok === false) {
+                this.hardFail(`Failed to load font data: ${atlasData.statusText}`);
+            }
+            const fontData = (await atlasData.json());
+            if (fontData.chars === undefined) {
+                this.hardFail('Invalid SDF font data format');
+            }
+            const atlasTexture = this.stage.txManager.createTexture('ImageTexture', {
+                src: this.atlasUrl,
+                premultiplyAlpha: false,
+            });
+            atlasTexture.setRenderableOwner(this.family, true);
+            atlasTexture.preventCleanup = true;
+            atlasTexture.on('loaded', () => {
+                this.onLoaded();
+            });
+            atlasTexture.on('failed', (error) => {
+                console.error(`Failed to load SDF font: ${this.family}`, error);
+                this.emit('failed');
+            });
+            this.atlasTexture = atlasTexture;
+            this.processFontData(fontData);
+        });
+    }
+    hardFail(message) {
+        this.state = FontState.Failed;
+        throw new Error(message);
+    }
+    processFontData(fontData) {
+        this.glyphMap = buildGlyphMap(fontData.chars);
+        this.kerningTable = buildKerningTable(fontData.kernings);
+        this.metrics = this.metrics ||
+            fontData.lightningMetrics || {
+            ascender: 800,
+            descender: -200,
+            lineGap: 200,
+            unitsPerEm: 1000,
+        };
+        this.data = fontData;
+    }
+    measureText(text, letterSpacing) {
+        if (text.length === 1) {
+            const char = text.charAt(0);
+            const codepoint = text.codePointAt(0);
+            if (codepoint === undefined)
+                return 0;
+            if (hasZeroWidthSpace(char) === true)
+                return 0;
+            const glyph = this.getGlyph(codepoint);
+            if (glyph === null)
+                return 0;
+            return glyph.xadvance + letterSpacing;
+        }
+        let width = 0;
+        let prevCodepoint = 0;
+        for (let i = 0; i < text.length; i++) {
+            const char = text.charAt(i);
+            const codepoint = text.codePointAt(i);
+            if (codepoint === undefined)
+                continue;
+            // Skip zero-width spaces in width calculations
+            if (hasZeroWidthSpace(char)) {
+                continue;
+            }
+            const glyph = this.getGlyph(codepoint);
+            if (glyph === null)
+                continue;
+            let advance = glyph.xadvance;
+            // Add kerning if there's a previous character
+            if (prevCodepoint !== 0) {
+                const kerning = this.getKerning(prevCodepoint, codepoint);
+                advance += kerning;
+            }
+            width += advance + letterSpacing;
+            prevCodepoint = codepoint;
+        }
+        return width;
+    }
+    getMetrics(fontSize) {
+        let m = this.normalizedMetrics[fontSize];
+        if (m !== undefined) {
+            return m;
+        }
+        m = this.normalizedMetrics[fontSize] = normalizeFontMetrics(this.metrics, fontSize);
+        return m;
+    }
+    getGlyph(codepoint) {
+        const gm = this.glyphMap;
+        return gm[codepoint] || gm[63] || null;
+    }
+    getKerning(firstGlyph, secondGlyph) {
+        const seconds = this.kerningTable[secondGlyph];
+        return (seconds !== undefined && seconds[firstGlyph]) || 0;
+    }
+    getAtlas() {
+        return this.atlasTexture;
+    }
+    getData() {
+        return this.data;
+    }
+}
+//# sourceMappingURL=SdfFont.js.map

package/dist/src/core/text-rendering/SdfFont.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SdfFont.js","sourceRoot":"","sources":["../../../../src/core/text-rendering/SdfFont.ts"],"names":[],"mappings":"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"}

package/dist/src/core/text-rendering/SdfFontHandler.d.ts

@@ -1,30 +1,30 @@
-import type { FontFamilyMap, FontMetrics, NormalizedFontMetrics, TrProps, FontLoadOptions } from './TextRenderer.js';
-import type { ImageTexture } from '../textures/ImageTexture.js';
-import type { Stage } from '../Stage.js';
-import type { CoreTextNode } from '../CoreTextNode.js';
+import type { FontMetrics } from './TextRenderer.js';
+export interface SdfGlyph {
+    id: number;
+    char: string;
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    xoffset: number;
+    yoffset: number;
+    xadvance: number;
+    page: number;
+    chnl: number;
+}
+export type SdfGlyphMap = Record<number, SdfGlyph>;
+export interface SdfKerning {
+    first: number;
+    second: number;
+    amount: number;
+}
 /**
  * SDF Font Data structure matching msdf-bmfont-xml output
  */
 export interface SdfFontData {
     pages: string[];
-    chars: Array<{
-        id: number;
-        char: string;
-        x: number;
-        y: number;
-        width: number;
-        height: number;
-        xoffset: number;
-        yoffset: number;
-        xadvance: number;
-        page: number;
-        chnl: number;
-    }>;
-    kernings: Array<{
-        first: number;
-        second: number;
-        amount: number;
-    }>;
+    chars: SdfGlyph[];
+    kernings: SdfKerning[];
     info: {
         face: string;
         size: number;
@@ -75,108 +75,11 @@ export interface SdfFontData {
  * @typedef {Object} KerningTable
  * Fast lookup table for kerning values
  */
-type KerningTable = Record<number, Record<number, number | undefined> | undefined>;
-/**
- * @typedef {Object} SdfFontCache
- * Cached font data for performance
- */
-export interface SdfFont {
-    data: SdfFontData;
-    glyphMap: Map<number, SdfFontData['chars'][0]>;
-    kernings: KerningTable;
-    atlasTexture: ImageTexture;
-    metrics: FontMetrics;
-    maxCharHeight: number;
-}
-/**
- * Check if the SDF font handler can render a font
- * @param {TrProps} trProps - Text rendering properties
- * @returns {boolean} True if the font can be rendered
- */
-export declare const canRenderFont: (trProps: TrProps) => boolean;
-/**
- * Load SDF font from JSON + PNG atlas
- * @param {Object} options - Font loading options
- * @param {string} options.fontFamily - Font family name
- * @param {string} options.fontUrl - JSON font data URL (atlasDataUrl)
- * @param {string} options.atlasUrl - PNG atlas texture URL
- * @param {FontMetrics} options.metrics - Optional font metrics
- */
-export declare const loadFont: (stage: Stage, options: FontLoadOptions) => Promise<void>;
-/**
- * Stop waiting for a font to load
- * @param {string} fontFamily - Font family name
- * @param {CoreTextNode} node - Node that was waiting for the font
- */
-export declare const waitingForFont: (fontFamily: string, node: CoreTextNode) => void;
-/**
- * Stop waiting for a font to load
- *
- * @param fontFamily
- * @param node
- * @returns
- */
-export declare const stopWaitingForFont: (fontFamily: string, node: CoreTextNode) => void;
-/**
- * Get the font families map for resolving fonts
- */
-export declare const getFontFamilies: () => FontFamilyMap;
-/**
- * Initialize the SDF font handler
- */
-export declare const init: (c?: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D) => void;
-export declare const type = "sdf";
-/**
- * Check if a font is already loaded by font family
- */
-export declare const isFontLoaded: (fontFamily: string) => boolean;
-/**
- * Get normalized font metrics for a font family
- */
-export declare const getFontMetrics: (fontFamily: string, fontSize: number) => NormalizedFontMetrics;
-export declare const processFontMetrics: (fontFamily: string, fontSize: number, metrics: FontMetrics) => NormalizedFontMetrics;
-/**
- * Get glyph data for a character in a specific font
- * @param {string} fontFamily - Font family name
- * @param {number} codepoint - Character codepoint
- * @returns {Object|null} Glyph data or null if not found
- */
-export declare const getGlyph: (fontFamily: string, codepoint: number) => SdfFontData["chars"][0] | null;
-/**
- * Get kerning value between two glyphs
- * @param {string} fontFamily - Font family name
- * @param {number} firstGlyph - First glyph ID
- * @param {number} secondGlyph - Second glyph ID
- * @returns {number} Kerning value or 0
- */
-export declare const getKerning: (fontFamily: string, firstGlyph: number, secondGlyph: number) => number;
-/**
- * Get atlas texture for a font family
- * @param {string} fontFamily - Font family name
- * @returns {ImageTexture|null} Atlas texture or null
- */
-export declare const getAtlas: (fontFamily: string) => ImageTexture | null;
-/**
- * Get font data for a font family
- * @param {string} fontFamily - Font family name
- * @returns {SdfFontData|null} Font data or null
- */
-export declare const getFontData: (fontFamily: string) => SdfFont | undefined;
-/**
- * Get maximum character height for a font family
- * @param {string} fontFamily - Font family name
- * @returns {number} Max character height or 0
- */
-export declare const getMaxCharHeight: (fontFamily: string) => number;
-/**
- * Get all loaded font families
- * @returns {string[]} Array of font family names
- */
-export declare const getLoadedFonts: () => string[];
+export type KerningTable = Record<number, Record<number, number | undefined> | undefined>;
 /**
- * Unload a font and free resources
- * @param {string} fontFamily - Font family name
+ * Build kerning lookup table for fast access
+ * @param {Array} kernings - Kerning data from font
+ * @returns {KerningTable} Optimized kerning lookup table
  */
-export declare const unloadFont: (fontFamily: string) => void;
-export declare const measureText: (text: string, fontFamily: string, letterSpacing: number) => number;
-export {};
+export declare const buildKerningTable: (kernings: SdfKerning[]) => KerningTable;
+export declare const buildGlyphMap: (chars: SdfGlyph[]) => SdfGlyphMap;