@lightningtv/renderer 3.0.0-beta1

package/dist/src/core/shaders/webgl/Shadow.js

@@ -0,0 +1,110 @@
+/*
+ * Copyright 2023 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.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { ShadowTemplate, } from '../templates/ShadowTemplate.js';
+export const Shadow = {
+    props: ShadowTemplate.props,
+    update() {
+        this.uniformRGBA('u_color', this.props.color);
+        this.uniform4fa('u_shadow', this.props.projection);
+    },
+    vertex: `
+    # ifdef GL_FRAGMENT_PRECISION_HIGH
+    precision highp float;
+    # else
+    precision mediump float;
+    # endif
+
+    attribute vec2 a_position;
+    attribute vec2 a_textureCoords;
+    attribute vec4 a_color;
+    attribute vec2 a_nodeCoords;
+
+    uniform vec2 u_resolution;
+    uniform float u_pixelRatio;
+    uniform float u_rtt;
+    uniform vec2 u_dimensions;
+
+    uniform vec4 u_shadow;
+
+    varying vec4 v_color;
+    varying vec2 v_textureCoords;
+    varying vec2 v_nodeCoords;
+
+    void main() {
+      vec2 screenSpace = vec2(2.0 / u_resolution.x,  -2.0 / u_resolution.y);
+      vec2 outerEdge = clamp(a_nodeCoords * 2.0 - vec2(1.0), -1.0, 1.0);
+
+      vec2 shadowEdge = outerEdge * ((u_shadow.w * 2.0)+ u_shadow.z) + u_shadow.xy;
+      vec2 normVertexPos = a_position * u_pixelRatio;
+
+      vec2 vertexPos = (a_position + outerEdge + shadowEdge) * u_pixelRatio;
+      gl_Position = vec4(vertexPos.x * screenSpace.x - 1.0, -sign(screenSpace.y) * (vertexPos.y * -abs(screenSpace.y)) + 1.0, 0.0, 1.0);
+
+      v_color = a_color;
+      v_nodeCoords = a_nodeCoords + (screenSpace + shadowEdge) / (u_dimensions);
+      v_textureCoords = a_textureCoords + (screenSpace + shadowEdge) / (u_dimensions);
+    }
+  `,
+    fragment: `
+    # ifdef GL_FRAGMENT_PRECISION_HIGH
+    precision highp float;
+    # else
+    precision mediump float;
+    # endif
+
+    uniform vec2 u_resolution;
+    uniform float u_pixelRatio;
+    uniform float u_alpha;
+    uniform vec2 u_dimensions;
+    uniform sampler2D u_texture;
+
+    uniform vec4 u_color;
+    uniform vec4 u_shadow;
+
+    varying vec4 v_color;
+    varying vec2 v_textureCoords;
+    varying vec2 v_nodeCoords;
+
+    float box(vec2 p, vec2 s) {
+      vec2 q = abs(p) - s;
+      return (min(max(q.x, q.y), 0.0) + length(max(q, 0.0))) + 2.0;
+    }
+
+    float shadowBox(vec2 p, vec2 s, float r) {
+      vec2 q = abs(p) - s + r;
+      float dist = min(max(q.x, q.y), 0.0) + length(max(q, 0.0)) - r;
+      return 1.0 - smoothstep(-u_shadow.w, u_shadow.w + u_shadow.z, dist);
+    }
+
+    void main() {
+      vec4 color = texture2D(u_texture, v_textureCoords) * v_color;
+      vec2 halfDimensions = (u_dimensions * 0.5);
+
+      vec2 boxUv = v_nodeCoords.xy * u_dimensions - halfDimensions;
+      float boxDist = box(boxUv, halfDimensions);
+
+      float boxAlpha = 1.0 - smoothstep(0.0, u_pixelRatio, boxDist);
+      float shadowDist = shadowBox(boxUv - u_shadow.xy, halfDimensions + u_shadow.w, u_shadow.z);
+
+      vec4 resColor = vec4(0.0);
+      resColor = mix(resColor, u_color, shadowDist);
+      resColor = mix(resColor, color, min(color.a, boxAlpha));
+      gl_FragColor = resColor * u_alpha;
+    }
+  `,
+};
+//# sourceMappingURL=Shadow.js.map

package/dist/src/core/shaders/webgl/Shadow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Shadow.js","sourceRoot":"","sources":["../../../../../src/core/shaders/webgl/Shadow.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,EACL,cAAc,GAEf,MAAM,gCAAgC,CAAC;AAExC,MAAM,CAAC,MAAM,MAAM,GAAiC;IAClD,KAAK,EAAE,cAAc,CAAC,KAAK;IAC3B,MAAM;QACJ,IAAI,CAAC,WAAW,CAAC,SAAS,EAAE,IAAI,CAAC,KAAM,CAAC,KAAK,CAAC,CAAC;QAC/C,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,IAAI,CAAC,KAAM,CAAC,UAAU,CAAC,CAAC;IACtD,CAAC;IACD,MAAM,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCP;IACD,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CT;CACF,CAAC"}

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

@@ -0,0 +1,12 @@
+import type { NormalizedFontMetrics } from './font-face-types/TrFontFace.js';
+/**
+ * Calculate the default line height given normalized font metrics
+ *
+ * @remarks
+ * This method may be used for both the WebTrFontFace and SdfTrFontFace font types.
+ *
+ * @param metrics
+ * @param fontSize
+ * @returns
+ */
+export declare function calcDefaultLineHeight(metrics: NormalizedFontMetrics, fontSize: number): number;

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

@@ -0,0 +1,14 @@
+/**
+ * Calculate the default line height given normalized font metrics
+ *
+ * @remarks
+ * This method may be used for both the WebTrFontFace and SdfTrFontFace font types.
+ *
+ * @param metrics
+ * @param fontSize
+ * @returns
+ */
+export function calcDefaultLineHeight(metrics, fontSize) {
+    return fontSize * (metrics.ascender - metrics.descender + metrics.lineGap);
+}
+//# sourceMappingURL=TextRenderingUtils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TextRenderingUtils.js","sourceRoot":"","sources":["../../../../src/core/text-rendering/TextRenderingUtils.ts"],"names":[],"mappings":"AAoBA;;;;;;;;;GASG;AACH,MAAM,UAAU,qBAAqB,CACnC,OAA8B,EAC9B,QAAgB;IAEhB,OAAO,QAAQ,GAAG,CAAC,OAAO,CAAC,QAAQ,GAAG,OAAO,CAAC,SAAS,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;AAC7E,CAAC"}

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

@@ -0,0 +1,72 @@
+import type { NormalizedFontMetrics } from './font-face-types/TrFontFace.js';
+import type { WebTrFontFace } from './font-face-types/WebTrFontFace.js';
+/**
+ * Returns CSS font setting string for use in canvas context.
+ *
+ * @param fontFace
+ * @param fontStyle
+ * @param fontSize
+ * @param precision
+ * @param defaultFontFace
+ * @returns
+ */
+export declare function getFontSetting(fontFace: string | string[], fontStyle: string, fontSize: number, precision: number, defaultFontFace: string): string;
+/**
+ * Returns true if the given character is a zero-width space.
+ *
+ * @param space
+ */
+export declare function isZeroWidthSpace(space: string): boolean;
+/**
+ * Returns true if the given character is a zero-width space or a regular space.
+ *
+ * @param space
+ */
+export declare function isSpace(space: string): boolean;
+/**
+ * Converts a string into an array of tokens and the words between them.
+ *
+ * @param tokenRegex
+ * @param text
+ */
+export declare function tokenizeString(tokenRegex: RegExp, text: string): string[];
+/**
+ * Measure the width of a string accounting for letter spacing.
+ *
+ * @param context
+ * @param word
+ * @param space
+ */
+export declare function measureText(context: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D, word: string, space?: number): number;
+/**
+ * Get the font metrics for a font face.
+ *
+ * @remarks
+ * This function will attempt to grab the explicitly defined metrics from the
+ * font face first. If the font face does not have metrics defined, it will
+ * attempt to calculate the metrics using the browser's measureText method.
+ *
+ * If the browser does not support the font metrics API, it will use some
+ * default values.
+ *
+ * @param context
+ * @param fontFace
+ * @param fontSize
+ * @returns
+ */
+export declare function getWebFontMetrics(context: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D, fontFace: WebTrFontFace, fontSize: number): NormalizedFontMetrics;
+export interface WrapTextResult {
+    l: string[];
+    n: number[];
+}
+/**
+ * Applies newlines to a string to have it optimally fit into the horizontal
+ * bounds set by the Text object's wordWrapWidth property.
+ *
+ * @param context
+ * @param text
+ * @param wordWrapWidth
+ * @param letterSpacing
+ * @param indent
+ */
+export declare function wrapText(context: CanvasRenderingContext2D, text: string, wordWrapWidth: number, letterSpacing: number, indent: number): WrapTextResult;

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

@@ -0,0 +1,217 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 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.
+ */
+/**
+ * Returns CSS font setting string for use in canvas context.
+ *
+ * @param fontFace
+ * @param fontStyle
+ * @param fontSize
+ * @param precision
+ * @param defaultFontFace
+ * @returns
+ */
+export function getFontSetting(fontFace, fontStyle, fontSize, precision, defaultFontFace) {
+    let ff = fontFace;
+    if (!Array.isArray(ff)) {
+        ff = [ff];
+    }
+    const ffs = [];
+    for (let i = 0, n = ff.length; i < n; i++) {
+        let curFf = ff[i];
+        // Replace the default font face `null` with the actual default font face set
+        // on the stage.
+        if (curFf === null || curFf === undefined) {
+            curFf = defaultFontFace;
+        }
+        if (curFf === 'serif' || curFf === 'sans-serif') {
+            ffs.push(curFf);
+        }
+        else {
+            ffs.push(`"${curFf}"`);
+        }
+    }
+    return `${fontStyle} ${fontSize * precision}px ${ffs.join(',')}`;
+}
+/**
+ * Returns true if the given character is a zero-width space.
+ *
+ * @param space
+ */
+export function isZeroWidthSpace(space) {
+    return space === '' || space === '\u200B';
+}
+/**
+ * Returns true if the given character is a zero-width space or a regular space.
+ *
+ * @param space
+ */
+export function isSpace(space) {
+    return isZeroWidthSpace(space) || space === ' ';
+}
+/**
+ * Converts a string into an array of tokens and the words between them.
+ *
+ * @param tokenRegex
+ * @param text
+ */
+export function tokenizeString(tokenRegex, text) {
+    const delimeters = text.match(tokenRegex) || [];
+    const words = text.split(tokenRegex) || [];
+    const final = [];
+    for (let i = 0; i < words.length; i++) {
+        final.push(words[i], delimeters[i]);
+    }
+    final.pop();
+    return final.filter((word) => word != '');
+}
+/**
+ * Measure the width of a string accounting for letter spacing.
+ *
+ * @param context
+ * @param word
+ * @param space
+ */
+export function measureText(context, word, space = 0) {
+    if (!space) {
+        return context.measureText(word).width;
+    }
+    return word.split('').reduce((acc, char) => {
+        // Zero-width spaces should not include letter spacing.
+        // And since we know the width of a zero-width space is 0, we can skip
+        // measuring it.
+        if (isZeroWidthSpace(char)) {
+            return acc;
+        }
+        return acc + context.measureText(char).width + space;
+    }, 0);
+}
+/**
+ * Get the font metrics for a font face.
+ *
+ * @remarks
+ * This function will attempt to grab the explicitly defined metrics from the
+ * font face first. If the font face does not have metrics defined, it will
+ * attempt to calculate the metrics using the browser's measureText method.
+ *
+ * If the browser does not support the font metrics API, it will use some
+ * default values.
+ *
+ * @param context
+ * @param fontFace
+ * @param fontSize
+ * @returns
+ */
+export function getWebFontMetrics(context, fontFace, fontSize) {
+    if (fontFace.metrics) {
+        return fontFace.metrics;
+    }
+    // If the font face doesn't have metrics defined, we fallback to using the
+    // browser's measureText method to calculate take a best guess at the font
+    // actual font's metrics.
+    // - fontBoundingBox[Ascent|Descent] is the best estimate but only supported
+    //   in Chrome 87+ (2020), Firefox 116+ (2023), and Safari 11.1+ (2018).
+    //   - It is an estimate as it can vary between browsers.
+    // - actualBoundingBox[Ascent|Descent] is less accurate and supported in
+    //   Chrome 77+ (2019), Firefox 74+ (2020), and Safari 11.1+ (2018).
+    // - If neither are supported, we'll use some default values which will
+    //   get text on the screen but likely not be great.
+    // NOTE: It's been decided not to rely on fontBoundingBox[Ascent|Descent]
+    // as it's browser support is limited and it also tends to produce higher than
+    // expected values. It is instead HIGHLY RECOMMENDED that developers provide
+    // explicit metrics in the font face definition.
+    const browserMetrics = context.measureText('ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz');
+    console.warn(`Font metrics not provided for Canvas Web font ${fontFace.fontFamily}. ` +
+        'Using fallback values. It is HIGHLY recommended you use the latest ' +
+        'version of the Lightning 3 `msdf-generator` tool to extract the default ' +
+        'metrics for the font and provide them in the Canvas Web font definition.');
+    let metrics;
+    if (browserMetrics.actualBoundingBoxDescent &&
+        browserMetrics.actualBoundingBoxAscent) {
+        metrics = {
+            ascender: browserMetrics.actualBoundingBoxAscent / fontSize,
+            descender: -browserMetrics.actualBoundingBoxDescent / fontSize,
+            lineGap: 0.2,
+        };
+    }
+    else {
+        // If the browser doesn't support the font metrics API, we'll use some
+        // default values.
+        metrics = {
+            ascender: 0.8,
+            descender: -0.2,
+            lineGap: 0.2,
+        };
+    }
+    // Save the calculated metrics to the font face for future use.
+    fontFace.metrics = metrics;
+    return metrics;
+}
+/**
+ * Applies newlines to a string to have it optimally fit into the horizontal
+ * bounds set by the Text object's wordWrapWidth property.
+ *
+ * @param context
+ * @param text
+ * @param wordWrapWidth
+ * @param letterSpacing
+ * @param indent
+ */
+export function wrapText(context, text, wordWrapWidth, letterSpacing, indent) {
+    // Greedy wrapping algorithm that will wrap words as the line grows longer.
+    // than its horizontal bounds.
+    const spaceRegex = / |\u200B/g;
+    const lines = text.split(/\r?\n/g);
+    let allLines = [];
+    const realNewlines = [];
+    for (let i = 0; i < lines.length; i++) {
+        const resultLines = [];
+        let result = '';
+        let spaceLeft = wordWrapWidth - indent;
+        const words = lines[i].split(spaceRegex);
+        const spaces = lines[i].match(spaceRegex) || [];
+        for (let j = 0; j < words.length; j++) {
+            const space = spaces[j - 1] || '';
+            const word = words[j];
+            const wordWidth = measureText(context, word, letterSpacing);
+            const wordWidthWithSpace = wordWidth + measureText(context, space, letterSpacing);
+            if (j === 0 || wordWidthWithSpace > spaceLeft) {
+                // Skip printing the newline if it's the first word of the line that is.
+                // greater than the word wrap width.
+                if (j > 0) {
+                    resultLines.push(result);
+                    result = '';
+                }
+                result += word;
+                spaceLeft = wordWrapWidth - wordWidth - (j === 0 ? indent : 0);
+            }
+            else {
+                spaceLeft -= wordWidthWithSpace;
+                result += space + word;
+            }
+        }
+        resultLines.push(result);
+        result = '';
+        allLines = allLines.concat(resultLines);
+        if (i < lines.length - 1) {
+            realNewlines.push(allLines.length);
+        }
+    }
+    return { l: allLines, n: realNewlines };
+}
+//# sourceMappingURL=TextTextureRendererUtils.js.map

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

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

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

@@ -0,0 +1,26 @@
+import type { TrFontFace } from './font-face-types/TrFontFace.js';
+import type { TextRendererMap, TrFontProps } from './renderers/TextRenderer.js';
+/**
+ * Structure mapping font family names to a set of font faces.
+ */
+export interface FontFamilyMap {
+    [familyName: string]: Set<TrFontFace>;
+}
+export declare class TrFontManager {
+    private textRenderers;
+    private fontCache;
+    constructor(textRenderers: Partial<TextRendererMap>);
+    addFontFace(font: TrFontFace): void;
+    /**
+     * Utility method to resolve a single font face from a list of prioritized family maps based on
+     * a set of font properties.
+     *
+     * @remarks
+     * These are to be used by a text renderer to resolve a font face if needed.
+     *
+     * @param familyMapsByPriority
+     * @param props
+     * @returns
+     */
+    resolveFontFace(familyMapsByPriority: FontFamilyMap[], props: TrFontProps, rendererType: 'canvas' | 'sdf'): TrFontFace | undefined;
+}

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

@@ -0,0 +1,131 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 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.
+ */
+const weightConversions = {
+    normal: 400,
+    bold: 700,
+    bolder: 900,
+    lighter: 100,
+};
+const fontWeightToNumber = (weight) => {
+    if (typeof weight === 'number') {
+        return weight;
+    }
+    return weightConversions[weight] || 400;
+};
+function resolveFontToUse(familyMapsByPriority, family, weightIn, style, stretch) {
+    let weight = fontWeightToNumber(weightIn);
+    for (const fontFamiles of familyMapsByPriority) {
+        const fontFaces = fontFamiles[family];
+        if (!fontFaces) {
+            continue;
+        }
+        if (fontFaces.size === 1) {
+            // No Exact match found, find nearest weight match
+            console.warn(`TrFontManager: Only one font face found for family: '${family}' - will be used for all weights and styles`);
+            return fontFaces.values().next().value;
+        }
+        const weightMap = new Map();
+        for (const fontFace of fontFaces) {
+            const fontFamilyWeight = fontWeightToNumber(fontFace.descriptors.weight);
+            if (fontFamilyWeight === weight &&
+                fontFace.descriptors.style === style &&
+                fontFace.descriptors.stretch === stretch) {
+                return fontFace;
+            }
+            weightMap.set(fontFamilyWeight, fontFace);
+        }
+        // No Exact match found, find nearest weight match
+        const msg = `TrFontManager: No exact match: '${family} Weight: ${weight} Style: ${style} Stretch: ${stretch}'`;
+        console.error(msg);
+        // Follow the CSS font-weight algorithm to find the nearest weight match
+        // https://www.w3.org/TR/2018/REC-css-fonts-3-20180920/#font-matching-algorithm
+        if (weight === 400 && weightMap.has(500)) {
+            return weightMap.get(500);
+        }
+        if (weight === 500 && weightMap.has(400)) {
+            return weightMap.get(400);
+        }
+        if (weight < 400) {
+            while (weight > 0) {
+                if (weightMap.has(weight)) {
+                    return weightMap.get(weight);
+                }
+                weight -= 100;
+            }
+            // reset back for the next loop
+            weight = 600;
+        }
+        while (weight < 1000) {
+            if (weightMap.has(weight)) {
+                return weightMap.get(weight);
+            }
+            weight += 100;
+        }
+        // finally check lower again
+        weight = 500;
+        while (weight > 0) {
+            if (weightMap.has(weight)) {
+                return weightMap.get(weight);
+            }
+            weight -= 100;
+        }
+    }
+    return;
+}
+export class TrFontManager {
+    textRenderers;
+    fontCache = new Map();
+    constructor(textRenderers) {
+        this.textRenderers = textRenderers;
+        // Intentionally left blank
+    }
+    addFontFace(font) {
+        // All the font face to all of the text renderers that support it
+        for (const trId in this.textRenderers) {
+            const tr = this.textRenderers[trId];
+            if (tr && tr.isFontFaceSupported(font)) {
+                tr.addFontFace(font);
+            }
+        }
+    }
+    /**
+     * Utility method to resolve a single font face from a list of prioritized family maps based on
+     * a set of font properties.
+     *
+     * @remarks
+     * These are to be used by a text renderer to resolve a font face if needed.
+     *
+     * @param familyMapsByPriority
+     * @param props
+     * @returns
+     */
+    resolveFontFace(familyMapsByPriority, props, rendererType) {
+        const { fontFamily, fontWeight, fontStyle, fontStretch } = props;
+        const fontCacheString = `${rendererType}_${fontFamily}_${fontStyle}_${fontWeight}_${fontStretch}`;
+        if (this.fontCache.has(fontCacheString) === true) {
+            return this.fontCache.get(fontCacheString);
+        }
+        const resolvedFont = resolveFontToUse(familyMapsByPriority, fontFamily, fontWeight, fontStyle, fontStretch);
+        if (resolvedFont !== undefined) {
+            this.fontCache.set(fontCacheString, resolvedFont);
+        }
+        return resolvedFont;
+    }
+}
+//# sourceMappingURL=TrFontManager.js.map

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

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

package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/SdfTrFontFace.d.ts

@@ -0,0 +1,39 @@
+import type { Stage } from '../../../Stage.js';
+import { ImageTexture } from '../../../textures/ImageTexture.js';
+import { TrFontFace, type TrFontFaceOptions } from '../TrFontFace.js';
+import type { FontShaper } from './internal/FontShaper.js';
+import { type SdfFontData } from './internal/SdfFontShaper.js';
+type SdfFontType = 'ssdf' | 'msdf';
+declare module '../TrFontFace.js' {
+    interface TrFontFaceMap {
+        ssdf: SdfTrFontFace<'ssdf'>;
+        msdf: SdfTrFontFace<'msdf'>;
+    }
+}
+interface GlyphAtlasEntry {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export interface SdfTrFontFaceOptions extends TrFontFaceOptions {
+    atlasUrl: string;
+    atlasDataUrl: string;
+    stage: Stage;
+}
+export declare class SdfTrFontFace<FontTypeT extends SdfFontType = SdfFontType> extends TrFontFace {
+    readonly type: FontTypeT;
+    readonly texture: ImageTexture;
+    /**
+     * Height of the tallest character in the font including the whitespace above it
+     * in SDF/vertex units.
+     */
+    readonly maxCharHeight: number;
+    readonly shaper: FontShaper | undefined;
+    readonly glyphMap: Map<number, SdfFontData['chars'][0]>;
+    data: SdfFontData | undefined;
+    constructor(type: FontTypeT, options: SdfTrFontFaceOptions);
+    getAtlasEntry(glyphId: number): GlyphAtlasEntry;
+    private checkLoaded;
+}
+export {};