@solidtv/renderer 1.0.0

package/dist/src/core/renderers/canvas/CanvasRenderer.js

@@ -0,0 +1,221 @@
+import { SubTexture } from '../../textures/SubTexture.js';
+import { TextureType } from '../../textures/Texture.js';
+import { CoreRenderer, } from '../CoreRenderer.js';
+import { CanvasTexture } from './CanvasTexture.js';
+import { parseColor } from '../../lib/colorParser.js';
+import { CanvasShaderNode } from './CanvasShaderNode.js';
+import { normalizeCanvasColor } from '../../lib/colorCache.js';
+export class CanvasRenderer extends CoreRenderer {
+    context;
+    canvas;
+    pixelRatio;
+    clearColor;
+    renderToTextureActive = false;
+    activeRttNode = null;
+    constructor(options) {
+        super(options);
+        this.mode = 'canvas';
+        const { canvas } = options;
+        this.canvas = canvas;
+        this.context = canvas.getContext('2d');
+        this.pixelRatio = this.stage.pixelRatio;
+        this.clearColor = normalizeCanvasColor(this.stage.clearColor);
+    }
+    reset() {
+        this.canvas.width = this.canvas.width; // quick reset canvas
+        const ctx = this.context;
+        if (this.clearColor) {
+            ctx.fillStyle = this.clearColor;
+            ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
+        }
+        ctx.scale(this.pixelRatio, this.pixelRatio);
+    }
+    render() {
+        // noop
+    }
+    addQuad(node) {
+        const ctx = this.context;
+        const { tx, ty, ta, tb, tc, td } = node.globalTransform;
+        const clippingRect = node.clippingRect;
+        let texture = node.renderTexture;
+        // The Canvas2D renderer only supports image textures, no textures are used for color blocks
+        if (texture !== null) {
+            const textureType = texture.type;
+            if (textureType !== TextureType.image &&
+                textureType !== TextureType.subTexture &&
+                textureType !== TextureType.color &&
+                textureType !== TextureType.noise) {
+                return;
+            }
+        }
+        const hasTransform = ta !== 1;
+        const hasClipping = clippingRect.width !== 0 && clippingRect.height !== 0;
+        const shader = node.props.shader;
+        const hasShader = shader !== null;
+        let saveAndRestore = hasTransform === true || hasClipping === true;
+        if (hasShader === true) {
+            saveAndRestore = saveAndRestore || shader.applySNR;
+        }
+        if (saveAndRestore) {
+            ctx.save();
+        }
+        if (hasClipping === true) {
+            const path = new Path2D();
+            const { x, y, width, height } = clippingRect;
+            path.rect(x, y, width, height);
+            ctx.clip(path);
+        }
+        if (hasTransform === true) {
+            // Quad transform:
+            // | ta tb tx |
+            // | tc td ty |
+            // | 0  0  1  |
+            // C2D transform:
+            // | a  c  e  |
+            // | b  d  f  |
+            // | 0  0  1  |
+            const scale = this.pixelRatio;
+            ctx.setTransform(ta, tc, tb, td, tx * scale, ty * scale);
+            ctx.scale(scale, scale);
+            ctx.translate(-tx, -ty);
+        }
+        if (hasShader === true) {
+            let renderContext = () => {
+                this.renderContext(node);
+            };
+            const quad = {
+                width: node.props.w,
+                height: node.props.h,
+                colorTl: node.premultipliedColorTl,
+                colorTr: node.premultipliedColorTr,
+                colorBl: node.premultipliedColorBl,
+                colorBr: node.premultipliedColorBr,
+                texture: texture,
+                textureOptions: node.props.textureOptions,
+                textureCoords: node.renderTextureCoords,
+                zIndex: node.zIndex, // zIndex usage?
+                shader: shader,
+                alpha: node.worldAlpha,
+                clippingRect: clippingRect,
+                tx,
+                ty,
+                ta,
+                tb,
+                tc,
+                td,
+                renderCoords: node.renderCoords,
+                rtt: node.props.rtt,
+                parentHasRenderTexture: node.parentHasRenderTexture,
+                framebufferDimensions: node.parentHasRenderTexture
+                    ? node.parentFramebufferDimensions
+                    : null,
+            };
+            shader.render(ctx, quad, renderContext);
+            renderContext = null;
+        }
+        else {
+            this.renderContext(node);
+        }
+        if (saveAndRestore) {
+            ctx.restore();
+        }
+    }
+    renderContext(node) {
+        const color = node.premultipliedColorTl;
+        const texture = node.renderTexture;
+        const textureType = texture.type;
+        const tx = node.globalTransform.tx;
+        const ty = node.globalTransform.ty;
+        const width = node.props.w;
+        const height = node.props.h;
+        if (textureType !== TextureType.color) {
+            const tintColor = parseColor(color);
+            if (textureType !== TextureType.subTexture) {
+                const image = texture.ctxTexture.getImage(tintColor);
+                this.context.globalAlpha = tintColor.a ?? node.worldAlpha;
+                this.context.drawImage(image, tx, ty, width, height);
+                this.context.globalAlpha = 1;
+                return;
+            }
+            const image = texture.parentTexture.ctxTexture.getImage(tintColor);
+            const props = texture.props;
+            this.context.globalAlpha = tintColor.a ?? node.worldAlpha;
+            this.context.drawImage(image, props.x, props.y, props.w, props.h, tx, ty, width, height);
+            this.context.globalAlpha = 1;
+            return;
+        }
+        const hasGradient = node.premultipliedColorTl !== node.premultipliedColorTr ||
+            node.premultipliedColorTl !== node.premultipliedColorBr;
+        if (hasGradient === true) {
+            let endX = tx;
+            let endY = ty;
+            let endColor;
+            if (node.premultipliedColorTl === node.premultipliedColorTr) {
+                // vertical
+                endX = tx;
+                endY = ty + height;
+                endColor = node.premultipliedColorBr;
+            }
+            else {
+                // horizontal
+                endX = tx + width;
+                endY = ty;
+                endColor = node.premultipliedColorTr;
+            }
+            const gradient = this.context.createLinearGradient(tx, ty, endX, endY);
+            gradient.addColorStop(0, normalizeCanvasColor(color));
+            gradient.addColorStop(1, normalizeCanvasColor(endColor));
+            this.context.fillStyle = gradient;
+            this.context.fillRect(tx, ty, width, height);
+        }
+        else {
+            this.context.fillStyle = normalizeCanvasColor(color);
+            this.context.fillRect(tx, ty, width, height);
+        }
+    }
+    createShaderNode(shaderKey, shaderType, props) {
+        return new CanvasShaderNode(shaderKey, shaderType, this.stage, props);
+    }
+    createShaderProgram(shaderConfig) {
+        return null;
+    }
+    supportsShaderType(shaderType) {
+        return shaderType.render !== undefined;
+    }
+    createCtxTexture(textureSource) {
+        return new CanvasTexture(this.stage.txMemManager, textureSource);
+    }
+    renderRTTNodes() {
+        // noop
+    }
+    removeRTTNode(node) {
+        // noop
+    }
+    renderToTexture(node) {
+        // noop
+    }
+    getBufferInfo() {
+        return null;
+    }
+    getQuadCount() {
+        return null;
+    }
+    getRenderOpCount() {
+        return null;
+    }
+    /**
+     * Updates the clear color of the canvas renderer.
+     *
+     * @param color - The color to set as the clear color.
+     */
+    updateClearColor(color) {
+        this.clearColor = normalizeCanvasColor(color);
+    }
+    updateViewport() {
+        // noop
+    }
+    getDefaultShaderNode() {
+        return null;
+    }
+}
+//# sourceMappingURL=CanvasRenderer.js.map

package/dist/src/core/renderers/canvas/CanvasRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasRenderer.js","sourceRoot":"","sources":["../../../../../src/core/renderers/canvas/CanvasRenderer.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAgB,MAAM,2BAA2B,CAAC;AAEtE,OAAO,EACL,YAAY,GAGb,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAyB,MAAM,uBAAuB,CAAC;AAChF,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAE/D,MAAM,OAAO,cAAe,SAAQ,YAAY;IACtC,OAAO,CAA2B;IAClC,MAAM,CAAoB;IAC1B,UAAU,CAAS;IACnB,UAAU,CAAS;IACpB,qBAAqB,GAAG,KAAK,CAAC;IACrC,aAAa,GAAoB,IAAI,CAAC;IAEtC,YAAY,OAA4B;QACtC,KAAK,CAAC,OAAO,CAAC,CAAC;QAEf,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC;QACrB,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;QAC3B,IAAI,CAAC,MAAM,GAAG,MAA2B,CAAC;QAC1C,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAA6B,CAAC;QACnE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;QACxC,IAAI,CAAC,UAAU,GAAG,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;IAChE,CAAC;IAED,KAAK;QACH,IAAI,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,qBAAqB;QAE5D,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC;QAEzB,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,GAAG,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC;YAChC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QAC5D,CAAC;QAED,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;IAC9C,CAAC;IAED,MAAM;QACJ,OAAO;IACT,CAAC;IAED,OAAO,CAAC,IAAc;QACpB,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC;QACzB,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,IAAI,CAAC,eAAgB,CAAC;QACzD,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC;QACvC,IAAI,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC;QACjC,4FAA4F;QAC5F,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;YACrB,MAAM,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;YACjC,IACE,WAAW,KAAK,WAAW,CAAC,KAAK;gBACjC,WAAW,KAAK,WAAW,CAAC,UAAU;gBACtC,WAAW,KAAK,WAAW,CAAC,KAAK;gBACjC,WAAW,KAAK,WAAW,CAAC,KAAK,EACjC,CAAC;gBACD,OAAO;YACT,CAAC;QACH,CAAC;QAED,MAAM,YAAY,GAAG,EAAE,KAAK,CAAC,CAAC;QAC9B,MAAM,WAAW,GAAG,YAAY,CAAC,KAAK,KAAK,CAAC,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,CAAC;QAC1E,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;QACjC,MAAM,SAAS,GAAG,MAAM,KAAK,IAAI,CAAC;QAElC,IAAI,cAAc,GAAG,YAAY,KAAK,IAAI,IAAI,WAAW,KAAK,IAAI,CAAC;QACnE,IAAI,SAAS,KAAK,IAAI,EAAE,CAAC;YACvB,cAAc,GAAG,cAAc,IAAK,MAA2B,CAAC,QAAQ,CAAC;QAC3E,CAAC;QAED,IAAI,cAAc,EAAE,CAAC;YACnB,GAAG,CAAC,IAAI,EAAE,CAAC;QACb,CAAC;QAED,IAAI,WAAW,KAAK,IAAI,EAAE,CAAC;YACzB,MAAM,IAAI,GAAG,IAAI,MAAM,EAAE,CAAC;YAC1B,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,YAAY,CAAC;YAC7C,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;YAC/B,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACjB,CAAC;QAED,IAAI,YAAY,KAAK,IAAI,EAAE,CAAC;YAC1B,kBAAkB;YAClB,eAAe;YACf,eAAe;YACf,eAAe;YACf,iBAAiB;YACjB,eAAe;YACf,eAAe;YACf,eAAe;YACf,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC;YAC9B,GAAG,CAAC,YAAY,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAK,CAAC,CAAC;YACzD,GAAG,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;YACxB,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC;QAC1B,CAAC;QAED,IAAI,SAAS,KAAK,IAAI,EAAE,CAAC;YACvB,IAAI,aAAa,GAAwB,GAAG,EAAE;gBAC5C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YAC3B,CAAC,CAAC;YACF,MAAM,IAAI,GAAgB;gBACxB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;gBACnB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;gBACpB,OAAO,EAAE,IAAI,CAAC,oBAAoB;gBAClC,OAAO,EAAE,IAAI,CAAC,oBAAoB;gBAClC,OAAO,EAAE,IAAI,CAAC,oBAAoB;gBAClC,OAAO,EAAE,IAAI,CAAC,oBAAoB;gBAClC,OAAO,EAAE,OAAO;gBAChB,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc;gBACzC,aAAa,EAAE,IAAI,CAAC,mBAAmB;gBACvC,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,gBAAgB;gBACrC,MAAM,EAAE,MAAM;gBACd,KAAK,EAAE,IAAI,CAAC,UAAU;gBACtB,YAAY,EAAE,YAAY;gBAC1B,EAAE;gBACF,EAAE;gBACF,EAAE;gBACF,EAAE;gBACF,EAAE;gBACF,EAAE;gBACF,YAAY,EAAE,IAAI,CAAC,YAAY;gBAC/B,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG;gBACnB,sBAAsB,EAAE,IAAI,CAAC,sBAAsB;gBACnD,qBAAqB,EAAE,IAAI,CAAC,sBAAsB;oBAChD,CAAC,CAAC,IAAI,CAAC,2BAA2B;oBAClC,CAAC,CAAC,IAAI;aACT,CAAC;YAED,MAA2B,CAAC,MAAM,CAAC,GAAG,EAAE,IAAI,EAAE,aAAa,CAAC,CAAC;YAC9D,aAAa,GAAG,IAAI,CAAC;QACvB,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAC3B,CAAC;QAED,IAAI,cAAc,EAAE,CAAC;YACnB,GAAG,CAAC,OAAO,EAAE,CAAC;QAChB,CAAC;IACH,CAAC;IAED,aAAa,CAAC,IAAc;QAC1B,MAAM,KAAK,GAAG,IAAI,CAAC,oBAAoB,CAAC;QACxC,MAAM,OAAO,GAAG,IAAI,CAAC,aAAc,CAAC;QACpC,MAAM,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;QACjC,MAAM,EAAE,GAAG,IAAI,CAAC,eAAgB,CAAC,EAAE,CAAC;QACpC,MAAM,EAAE,GAAG,IAAI,CAAC,eAAgB,CAAC,EAAE,CAAC;QACpC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QAE5B,IAAI,WAAW,KAAK,WAAW,CAAC,KAAK,EAAE,CAAC;YACtC,MAAM,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;YACpC,IAAI,WAAW,KAAK,WAAW,CAAC,UAAU,EAAE,CAAC;gBAC3C,MAAM,KAAK,GAAI,OAAO,CAAC,UAA4B,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;gBACxE,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC;gBAC1D,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;gBACrD,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,CAAC;gBAC7B,OAAO;YACT,CAAC;YACD,MAAM,KAAK,GACR,OAAsB,CAAC,aAAa,CAAC,UACvC,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;YACtB,MAAM,KAAK,GAAI,OAAsB,CAAC,KAAK,CAAC;YAE5C,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC;YAC1D,IAAI,CAAC,OAAO,CAAC,SAAS,CACpB,KAAK,EACL,KAAK,CAAC,CAAC,EACP,KAAK,CAAC,CAAC,EACP,KAAK,CAAC,CAAC,EACP,KAAK,CAAC,CAAC,EACP,EAAE,EACF,EAAE,EACF,KAAK,EACL,MAAM,CACP,CAAC;YACF,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,CAAC;YAC7B,OAAO;QACT,CAAC;QACD,MAAM,WAAW,GACf,IAAI,CAAC,oBAAoB,KAAK,IAAI,CAAC,oBAAoB;YACvD,IAAI,CAAC,oBAAoB,KAAK,IAAI,CAAC,oBAAoB,CAAC;QAC1D,IAAI,WAAW,KAAK,IAAI,EAAE,CAAC;YACzB,IAAI,IAAI,GAAW,EAAE,CAAC;YACtB,IAAI,IAAI,GAAW,EAAE,CAAC;YACtB,IAAI,QAAgB,CAAC;YACrB,IAAI,IAAI,CAAC,oBAAoB,KAAK,IAAI,CAAC,oBAAoB,EAAE,CAAC;gBAC5D,WAAW;gBACX,IAAI,GAAG,EAAE,CAAC;gBACV,IAAI,GAAG,EAAE,GAAG,MAAM,CAAC;gBACnB,QAAQ,GAAG,IAAI,CAAC,oBAAoB,CAAC;YACvC,CAAC;iBAAM,CAAC;gBACN,aAAa;gBACb,IAAI,GAAG,EAAE,GAAG,KAAK,CAAC;gBAClB,IAAI,GAAG,EAAE,CAAC;gBACV,QAAQ,GAAG,IAAI,CAAC,oBAAoB,CAAC;YACvC,CAAC;YACD,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;YACvE,QAAQ,CAAC,YAAY,CAAC,CAAC,EAAE,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAC;YACtD,QAAQ,CAAC,YAAY,CAAC,CAAC,EAAE,oBAAoB,CAAC,QAAQ,CAAC,CAAC,CAAC;YACzD,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,QAAQ,CAAC;YAClC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QAC/C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;YACrD,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QAC/C,CAAC;IACH,CAAC;IAED,gBAAgB,CACd,SAAiB,EACjB,UAAsC,EACtC,KAA2B;QAE3B,OAAO,IAAI,gBAAgB,CAAC,SAAS,EAAE,UAAU,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IACxE,CAAC;IAED,mBAAmB,CAAC,YAAY;QAC9B,OAAO,IAAI,CAAC;IACd,CAAC;IAEQ,kBAAkB,CAAC,UAAsC;QAChE,OAAO,UAAU,CAAC,MAAM,KAAK,SAAS,CAAC;IACzC,CAAC;IAED,gBAAgB,CAAC,aAAsB;QACrC,OAAO,IAAI,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC;IACnE,CAAC;IAED,cAAc;QACZ,OAAO;IACT,CAAC;IAED,aAAa,CAAC,IAAc;QAC1B,OAAO;IACT,CAAC;IAED,eAAe,CAAC,IAAc;QAC5B,OAAO;IACT,CAAC;IACD,aAAa;QACX,OAAO,IAAI,CAAC;IACd,CAAC;IAED,YAAY;QACV,OAAO,IAAI,CAAC;IACd,CAAC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAC;IACd,CAAC;IAED;;;;OAIG;IACH,gBAAgB,CAAC,KAAa;QAC5B,IAAI,CAAC,UAAU,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAChD,CAAC;IAEQ,cAAc;QACrB,OAAO;IACT,CAAC;IAED,oBAAoB;QAClB,OAAO,IAAI,CAAC;IACd,CAAC;CACF"}

package/dist/src/core/renderers/canvas/CanvasShaderNode.d.ts

@@ -0,0 +1,21 @@
+import type { CoreNode } from '../../CoreNode.js';
+import type { Stage } from '../../Stage.js';
+import type { QuadOptions } from '../CoreRenderer.js';
+import { CoreShaderNode, type CoreShaderType } from '../CoreShaderNode.js';
+export type CanvasShaderType<T extends object = Record<string, unknown>, C extends object = Record<string, unknown>> = CoreShaderType<T> & {
+    render: (this: CanvasShaderNode<T, C>, ctx: CanvasRenderingContext2D, quad: QuadOptions, renderContext: () => void) => void;
+    update?: (this: CanvasShaderNode<T, C>, node: CoreNode) => void;
+    /**
+     * Set this to true when using ctx functions that scale, clip, rotate, etc..
+     */
+    saveAndRestore?: boolean;
+};
+export declare class CanvasShaderNode<Props extends object = Record<string, unknown>, Computed extends object = Record<string, unknown>> extends CoreShaderNode<Props> {
+    private updater;
+    private valueKey;
+    computed: Partial<Computed>;
+    applySNR: boolean;
+    render: CanvasShaderType<Props>['render'];
+    constructor(shaderKey: string, config: CanvasShaderType<Props>, stage: Stage, props?: Props);
+    toColorString(rgba: number): string;
+}

package/dist/src/core/renderers/canvas/CanvasShaderNode.js

@@ -0,0 +1,42 @@
+import { normalizeCanvasColor } from '../../lib/colorCache.js';
+import { CoreShaderNode } from '../CoreShaderNode.js';
+export class CanvasShaderNode extends CoreShaderNode {
+    updater = undefined;
+    valueKey = '';
+    computed = {};
+    applySNR;
+    render;
+    constructor(shaderKey, config, stage, props) {
+        super(shaderKey, config, stage, props);
+        this.applySNR = config.saveAndRestore || false;
+        this.render = config.render;
+        if (config.update !== undefined) {
+            this.updater = config.update;
+            if (this.props === undefined) {
+                this.updater(this.node, this.props);
+                return;
+            }
+            this.update = () => {
+                const prevKey = this.valueKey;
+                this.valueKey = this.createValueKey();
+                if (prevKey === this.valueKey) {
+                    return;
+                }
+                if (prevKey.length > 0) {
+                    this.stage.shManager.mutateShaderValueUsage(prevKey, -1);
+                }
+                const computed = this.stage.shManager.getShaderValues(this.valueKey);
+                if (computed !== undefined) {
+                    this.computed = computed;
+                }
+                this.computed = {};
+                this.updater(this.node);
+                this.stage.shManager.setShaderValues(this.valueKey, this.computed);
+            };
+        }
+    }
+    toColorString(rgba) {
+        return normalizeCanvasColor(rgba, true);
+    }
+}
+//# sourceMappingURL=CanvasShaderNode.js.map

package/dist/src/core/renderers/canvas/CanvasShaderNode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasShaderNode.js","sourceRoot":"","sources":["../../../../../src/core/renderers/canvas/CanvasShaderNode.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAG/D,OAAO,EAAE,cAAc,EAAuB,MAAM,sBAAsB,CAAC;AAmB3E,MAAM,OAAO,gBAGX,SAAQ,cAAqB;IACrB,OAAO,GACb,SAAS,CAAC;IACJ,QAAQ,GAAW,EAAE,CAAC;IAC9B,QAAQ,GAAsB,EAAE,CAAC;IACjC,QAAQ,CAAU;IAClB,MAAM,CAAoC;IAE1C,YACE,SAAiB,EACjB,MAA+B,EAC/B,KAAY,EACZ,KAAa;QAEb,KAAK,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QACvC,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,cAAc,IAAI,KAAK,CAAC;QAC/C,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;QAC5B,IAAI,MAAM,CAAC,MAAM,KAAK,SAAS,EAAE,CAAC;YAChC,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,MAAO,CAAC;YAC9B,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE,CAAC;gBAC7B,IAAI,CAAC,OAAQ,CAAC,IAAI,CAAC,IAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;gBACjD,OAAO;YACT,CAAC;YAED,IAAI,CAAC,MAAM,GAAG,GAAG,EAAE;gBACjB,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;gBAC9B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;gBAEtC,IAAI,OAAO,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;oBAC9B,OAAO;gBACT,CAAC;gBAED,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;oBACvB,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,sBAAsB,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;gBAC3D,CAAC;gBAED,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,eAAe,CACnD,IAAI,CAAC,QAAQ,CACa,CAAC;gBAC7B,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;oBAC3B,IAAI,CAAC,QAAQ,GAAG,QAAoB,CAAC;gBACvC,CAAC;gBACD,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;gBACnB,IAAI,CAAC,OAAQ,CAAC,IAAI,CAAC,IAAgB,CAAC,CAAC;gBACrC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;YACrE,CAAC,CAAC;QACJ,CAAC;IACH,CAAC;IAED,aAAa,CAAC,IAAY;QACxB,OAAO,oBAAoB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC1C,CAAC;CACF"}

package/dist/src/core/renderers/canvas/CanvasTexture.d.ts

@@ -0,0 +1,17 @@
+import { type IParsedColor } from '../../lib/colorParser.js';
+import { CoreContextTexture } from '../CoreContextTexture.js';
+export declare class CanvasTexture extends CoreContextTexture {
+    protected image: ImageBitmap | HTMLCanvasElement | HTMLImageElement | undefined;
+    protected tintCache: {
+        key: string;
+        image: HTMLCanvasElement;
+    } | undefined;
+    load(): Promise<void>;
+    release(): void;
+    free(): void;
+    updateMemSize(): void;
+    hasImage(): boolean;
+    getImage(color: IParsedColor): ImageBitmap | HTMLCanvasElement | HTMLImageElement;
+    protected tintTexture(source: ImageBitmap | HTMLCanvasElement | HTMLImageElement, color: string): HTMLCanvasElement;
+    private onLoadRequest;
+}

package/dist/src/core/renderers/canvas/CanvasTexture.js

@@ -0,0 +1,110 @@
+import { assertTruthy } from '../../../utils.js';
+import { formatRgba } from '../../lib/colorParser.js';
+import { CoreContextTexture } from '../CoreContextTexture.js';
+export class CanvasTexture extends CoreContextTexture {
+    image;
+    tintCache;
+    async load() {
+        this.textureSource.setState('loading');
+        try {
+            const size = await this.onLoadRequest();
+            this.textureSource.setState('loaded', size);
+            this.textureSource.freeTextureData();
+            this.updateMemSize();
+        }
+        catch (err) {
+            this.textureSource.setState('failed', err);
+            this.textureSource.freeTextureData();
+            throw err;
+        }
+    }
+    release() {
+        this.image = undefined;
+        this.tintCache = undefined;
+    }
+    free() {
+        this.release();
+        this.textureSource.setState('freed');
+        this.setTextureMemUse(0);
+        this.textureSource.freeTextureData();
+    }
+    updateMemSize() {
+        // Counting memory usage for:
+        // - main image
+        // - tinted image
+        const mult = this.tintCache ? 8 : 4;
+        if (this.textureSource.dimensions) {
+            this.setTextureMemUse(this.textureSource.dimensions.w *
+                this.textureSource.dimensions.h *
+                mult);
+        }
+    }
+    hasImage() {
+        return this.image !== undefined;
+    }
+    getImage(color) {
+        const image = this.image;
+        assertTruthy(image, 'Attempt to get unloaded image texture');
+        if (color.isWhite) {
+            if (this.tintCache) {
+                this.tintCache = undefined;
+                this.updateMemSize();
+            }
+            return image;
+        }
+        const key = formatRgba(color);
+        if (this.tintCache?.key === key) {
+            return this.tintCache.image;
+        }
+        const tintedImage = this.tintTexture(image, key);
+        this.tintCache = {
+            key,
+            image: tintedImage,
+        };
+        this.updateMemSize();
+        return tintedImage;
+    }
+    tintTexture(source, color) {
+        const { width, height } = source;
+        const canvas = document.createElement('canvas');
+        canvas.width = width;
+        canvas.height = height;
+        const ctx = canvas.getContext('2d');
+        if (ctx) {
+            // fill with target color
+            ctx.fillStyle = color;
+            ctx.globalCompositeOperation = 'copy';
+            ctx.fillRect(0, 0, width, height);
+            // multiply with image, resulting in non-transparent tinted image
+            ctx.globalCompositeOperation = 'multiply';
+            ctx.drawImage(source, 0, 0, width, height, 0, 0, width, height);
+            // apply original image alpha
+            ctx.globalCompositeOperation = 'destination-in';
+            ctx.drawImage(source, 0, 0, width, height, 0, 0, width, height);
+        }
+        return canvas;
+    }
+    async onLoadRequest() {
+        assertTruthy(this.textureSource?.textureData?.data, 'Texture data is null');
+        const { data } = this.textureSource.textureData;
+        // TODO: canvas from text renderer should be able to provide the canvas directly
+        // instead of having to re-draw it into a new canvas...
+        if (data instanceof ImageData) {
+            const canvas = document.createElement('canvas');
+            canvas.width = data.width;
+            canvas.height = data.height;
+            const ctx = canvas.getContext('2d');
+            if (ctx)
+                ctx.putImageData(data, 0, 0);
+            this.image = canvas;
+            return { w: data.width, h: data.height };
+        }
+        else if ((typeof ImageBitmap !== 'undefined' && data instanceof ImageBitmap) ||
+            data instanceof HTMLImageElement) {
+            this.image = data;
+            return { w: data.width, h: data.height };
+        }
+        return { w: 0, h: 0 };
+    }
+}
+//# sourceMappingURL=CanvasTexture.js.map

package/dist/src/core/renderers/canvas/CanvasTexture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasTexture.js","sourceRoot":"","sources":["../../../../../src/core/renderers/canvas/CanvasTexture.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,UAAU,EAAqB,MAAM,0BAA0B,CAAC;AACzE,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAE9D,MAAM,OAAO,aAAc,SAAQ,kBAAkB;IACzC,KAAK,CAID;IACJ,SAAS,CAKL;IAEd,KAAK,CAAC,IAAI;QACR,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;QAEvC,IAAI,CAAC;YACH,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC;YACxC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;YAC5C,IAAI,CAAC,aAAa,CAAC,eAAe,EAAE,CAAC;YACrC,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,EAAE,GAAY,CAAC,CAAC;YACpD,IAAI,CAAC,aAAa,CAAC,eAAe,EAAE,CAAC;YACrC,MAAM,GAAG,CAAC;QACZ,CAAC;IACH,CAAC;IAED,OAAO;QACL,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;QACvB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;IAC7B,CAAC;IAED,IAAI;QACF,IAAI,CAAC,OAAO,EAAE,CAAC;QACf,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QACrC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC;QACzB,IAAI,CAAC,aAAa,CAAC,eAAe,EAAE,CAAC;IACvC,CAAC;IAED,aAAa;QACX,6BAA6B;QAC7B,eAAe;QACf,iBAAiB;QACjB,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACpC,IAAI,IAAI,CAAC,aAAa,CAAC,UAAU,EAAE,CAAC;YAClC,IAAI,CAAC,gBAAgB,CACnB,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;gBAC7B,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;gBAC/B,IAAI,CACP,CAAC;QACJ,CAAC;IACH,CAAC;IAED,QAAQ;QACN,OAAO,IAAI,CAAC,KAAK,KAAK,SAAS,CAAC;IAClC,CAAC;IAED,QAAQ,CACN,KAAmB;QAEnB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,YAAY,CAAC,KAAK,EAAE,uCAAuC,CAAC,CAAC;QAE7D,IAAI,KAAK,CAAC,OAAO,EAAE,CAAC;YAClB,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACnB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;gBAC3B,IAAI,CAAC,aAAa,EAAE,CAAC;YACvB,CAAC;YACD,OAAO,KAAK,CAAC;QACf,CAAC;QACD,MAAM,GAAG,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;QAC9B,IAAI,IAAI,CAAC,SAAS,EAAE,GAAG,KAAK,GAAG,EAAE,CAAC;YAChC,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;QAC9B,CAAC;QAED,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACjD,IAAI,CAAC,SAAS,GAAG;YACf,GAAG;YACH,KAAK,EAAE,WAAW;SACnB,CAAC;QACF,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,OAAO,WAAW,CAAC;IACrB,CAAC;IAES,WAAW,CACnB,MAA0D,EAC1D,KAAa;QAEb,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC;QACjC,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAChD,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;QACrB,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC;QACvB,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACpC,IAAI,GAAG,EAAE,CAAC;YACR,yBAAyB;YACzB,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;YACtB,GAAG,CAAC,wBAAwB,GAAG,MAAM,CAAC;YACtC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;YAElC,iEAAiE;YACjE,GAAG,CAAC,wBAAwB,GAAG,UAAU,CAAC;YAC1C,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;YAEhE,6BAA6B;YAC7B,GAAG,CAAC,wBAAwB,GAAG,gBAAgB,CAAC;YAChD,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QAClE,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IAEO,KAAK,CAAC,aAAa;QACzB,YAAY,CAAC,IAAI,CAAC,aAAa,EAAE,WAAW,EAAE,IAAI,EAAE,sBAAsB,CAAC,CAAC;QAC5E,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC;QAEhD,gFAAgF;QAChF,uDAAuD;QACvD,IAAI,IAAI,YAAY,SAAS,EAAE,CAAC;YAC9B,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;YAChD,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;YAC1B,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;YAC5B,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;YACpC,IAAI,GAAG;gBAAE,GAAG,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;YACtC,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC;YACpB,OAAO,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;QAC3C,CAAC;aAAM,IACL,CAAC,OAAO,WAAW,KAAK,WAAW,IAAI,IAAI,YAAY,WAAW,CAAC;YACnE,IAAI,YAAY,gBAAgB,EAChC,CAAC;YACD,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;YAClB,OAAO,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;QAC3C,CAAC;QAED,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;IACxB,CAAC;CACF"}

package/dist/src/core/renderers/webgl/SdfRenderOp.d.ts

@@ -0,0 +1,41 @@
+import { CoreRenderOp } from '../CoreRenderOp.js';
+import type { WebGlCtxTexture } from './WebGlCtxTexture.js';
+import type { WebGlRenderer } from './WebGlRenderer.js';
+import type { BufferCollection } from './internal/BufferCollection.js';
+import type { WebGlShaderNode } from './WebGlShaderNode.js';
+import type { RectWithValid } from '../../lib/utils.js';
+import type { Dimensions } from '../../../common/CommonTypes.js';
+import type { Stage } from '../../Stage.js';
+/**
+ * A batched SDF text render operation.
+ *
+ * Rather than owning its own WebGL buffer, this op references a range
+ * inside the renderer's shared SDF vertex buffer. Multiple text nodes
+ * that share the same atlas texture and clipping state are merged into
+ * a single SdfRenderOp, producing one draw call for many strings.
+ */
+export declare class SdfRenderOp extends CoreRenderOp {
+    readonly renderer: WebGlRenderer;
+    readonly shader: WebGlShaderNode;
+    readonly quadBufferCollection: BufferCollection;
+    worldAlpha: number;
+    clippingRect: RectWithValid;
+    readonly width: number;
+    readonly height: number;
+    readonly rtt: boolean;
+    parentHasRenderTexture: boolean;
+    framebufferDimensions: Dimensions | null;
+    numQuads: number;
+    readonly isCoreNode: false;
+    renderOpTextures: WebGlCtxTexture[];
+    time: number;
+    readonly stage: Stage;
+    /**
+     * Index of the first quad in the shared SDF buffer.
+     * Used to compute the byte offset into the element index buffer.
+     */
+    startQuad: number;
+    constructor(renderer: WebGlRenderer, shader: WebGlShaderNode, quadBufferCollection: BufferCollection, worldAlpha: number, clippingRect: RectWithValid, width: number, height: number, rtt: boolean, parentHasRenderTexture: boolean, framebufferDimensions: Dimensions | null);
+    addTexture(texture: WebGlCtxTexture): number;
+    draw(): void;
+}

package/dist/src/core/renderers/webgl/SdfRenderOp.js

@@ -0,0 +1,88 @@
+import { CoreRenderOp } from '../CoreRenderOp.js';
+import { USE_RTT } from '../../../utils.js';
+/**
+ * A batched SDF text render operation.
+ *
+ * Rather than owning its own WebGL buffer, this op references a range
+ * inside the renderer's shared SDF vertex buffer. Multiple text nodes
+ * that share the same atlas texture and clipping state are merged into
+ * a single SdfRenderOp, producing one draw call for many strings.
+ */
+export class SdfRenderOp extends CoreRenderOp {
+    renderer;
+    shader;
+    quadBufferCollection;
+    worldAlpha;
+    clippingRect;
+    width;
+    height;
+    rtt;
+    parentHasRenderTexture;
+    framebufferDimensions;
+    numQuads = 0;
+    isCoreNode = false;
+    renderOpTextures = [];
+    time = 0;
+    stage;
+    /**
+     * Index of the first quad in the shared SDF buffer.
+     * Used to compute the byte offset into the element index buffer.
+     */
+    startQuad = 0;
+    constructor(renderer, shader, quadBufferCollection, worldAlpha, clippingRect, width, height, rtt, parentHasRenderTexture, framebufferDimensions) {
+        super();
+        this.renderer = renderer;
+        this.shader = shader;
+        this.quadBufferCollection = quadBufferCollection;
+        this.worldAlpha = worldAlpha;
+        this.clippingRect = clippingRect;
+        this.width = width;
+        this.height = height;
+        this.rtt = rtt;
+        this.parentHasRenderTexture = parentHasRenderTexture;
+        this.framebufferDimensions = framebufferDimensions;
+        this.stage = renderer.stage;
+    }
+    addTexture(texture) {
+        const { renderOpTextures } = this;
+        const length = renderOpTextures.length;
+        for (let i = 0; i < length; i++) {
+            if (renderOpTextures[i] === texture) {
+                return i;
+            }
+        }
+        renderOpTextures.push(texture);
+        return length;
+    }
+    draw() {
+        const { glw, options, stage } = this.renderer;
+        stage.shManager.useShader(this.shader.program);
+        this.shader.program.bindRenderOp(this);
+        // Clipping
+        if (this.clippingRect.valid === true) {
+            const pixelRatio = USE_RTT && this.parentHasRenderTexture ? 1 : stage.pixelRatio;
+            const clipX = Math.round(this.clippingRect.x * pixelRatio);
+            const clipWidth = Math.round(this.clippingRect.width * pixelRatio);
+            const clipHeight = Math.round(this.clippingRect.height * pixelRatio);
+            let clipY = Math.round(options.canvas.height - clipHeight - this.clippingRect.y * pixelRatio);
+            // if parent has render texture, we need to adjust the scissor rect
+            // to be relative to the parent's framebuffer
+            if (USE_RTT && this.parentHasRenderTexture) {
+                clipY = this.framebufferDimensions
+                    ? this.framebufferDimensions.h - this.height
+                    : 0;
+            }
+            glw.setScissorTest(true);
+            glw.scissor(clipX, clipY, clipWidth, clipHeight);
+        }
+        else {
+            glw.setScissorTest(false);
+        }
+        // Draw the batch range from the shared SDF buffer using indexed rendering.
+        // 4 vertices per glyph, 6 indices per glyph (2 triangles).
+        // Byte offset into the shared Uint16 index buffer:
+        const byteOffset = this.startQuad * 6 * 2;
+        glw.drawElements(glw.TRIANGLES, 6 * this.numQuads, glw.UNSIGNED_SHORT, byteOffset);
+    }
+}
+//# sourceMappingURL=SdfRenderOp.js.map

package/dist/src/core/renderers/webgl/SdfRenderOp.js.map

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

package/dist/src/core/renderers/webgl/WebGlCtxRenderTexture.d.ts

@@ -0,0 +1,14 @@
+import type { Dimensions } from '../../../common/CommonTypes.js';
+import type { TextureMemoryManager } from '../../TextureMemoryManager.js';
+import type { WebGlContextWrapper } from '../../lib/WebGlContextWrapper.js';
+import type { Bound } from '../../lib/utils.js';
+import type { RenderTexture } from '../../textures/RenderTexture.js';
+import { WebGlCtxTexture } from './WebGlCtxTexture.js';
+export declare class WebGlCtxRenderTexture extends WebGlCtxTexture {
+    textureSource: RenderTexture;
+    framebuffer: WebGLFramebuffer | null;
+    txCoords: Bound;
+    constructor(glw: WebGlContextWrapper, memManager: TextureMemoryManager, textureSource: RenderTexture);
+    onLoadRequest(): Promise<Dimensions>;
+    free(): void;
+}

package/dist/src/core/renderers/webgl/WebGlCtxRenderTexture.js

@@ -0,0 +1,45 @@
+import { WebGlCtxTexture } from './WebGlCtxTexture.js';
+export class WebGlCtxRenderTexture extends WebGlCtxTexture {
+    framebuffer = null;
+    txCoords = {
+        x1: 0,
+        y1: 1,
+        x2: 1,
+        y2: 0,
+    };
+    constructor(glw, memManager, textureSource) {
+        super(glw, memManager, textureSource);
+    }
+    async onLoadRequest() {
+        const { glw } = this;
+        const nativeTexture = (this._nativeCtxTexture =
+            this.createNativeCtxTexture());
+        if (!nativeTexture) {
+            throw new Error('Failed to create native texture for RenderTexture');
+        }
+        const { w, h } = this.textureSource;
+        // Create Framebuffer object
+        this.framebuffer = glw.createFramebuffer();
+        // Set the dimensions of the render texture
+        glw.texImage2D(0, glw.RGBA, w, h, 0, glw.RGBA, glw.UNSIGNED_BYTE, null);
+        // Update the texture memory manager
+        this.setTextureMemUse(w * h * 4);
+        // Bind the framebuffer
+        glw.bindFramebuffer(this.framebuffer);
+        // Attach the texture to the framebuffer
+        glw.framebufferTexture2D(glw.COLOR_ATTACHMENT0, nativeTexture, 0);
+        // Unbind the framebuffer
+        glw.bindFramebuffer(null);
+        return {
+            w,
+            h,
+        };
+    }
+    free() {
+        super.free();
+        // Delete the framebuffer
+        this.glw.deleteFramebuffer(this.framebuffer);
+        this.framebuffer = null;
+    }
+}
+//# sourceMappingURL=WebGlCtxRenderTexture.js.map

package/dist/src/core/renderers/webgl/WebGlCtxRenderTexture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebGlCtxRenderTexture.js","sourceRoot":"","sources":["../../../../../src/core/renderers/webgl/WebGlCtxRenderTexture.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD,MAAM,OAAO,qBAAsB,SAAQ,eAAe;IAGjD,WAAW,GAA4B,IAAI,CAAC;IAE1C,QAAQ,GAAU;QACzB,EAAE,EAAE,CAAC;QACL,EAAE,EAAE,CAAC;QACL,EAAE,EAAE,CAAC;QACL,EAAE,EAAE,CAAC;KACN,CAAC;IAEF,YACE,GAAwB,EACxB,UAAgC,EAChC,aAA4B;QAE5B,KAAK,CAAC,GAAG,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;IACxC,CAAC;IAEQ,KAAK,CAAC,aAAa;QAC1B,MAAM,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;QACrB,MAAM,aAAa,GAAG,CAAC,IAAI,CAAC,iBAAiB;YAC3C,IAAI,CAAC,sBAAsB,EAAE,CAAC,CAAC;QAEjC,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,MAAM,IAAI,KAAK,CAAC,mDAAmD,CAAC,CAAC;QACvE,CAAC;QAED,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC;QAEpC,4BAA4B;QAC5B,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC,iBAAiB,EAAE,CAAC;QAE3C,2CAA2C;QAC3C,GAAG,CAAC,UAAU,CAAC,CAAC,EAAE,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;QAExE,oCAAoC;QACpC,IAAI,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;QAEjC,uBAAuB;QACvB,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAEtC,wCAAwC;QACxC,GAAG,CAAC,oBAAoB,CAAC,GAAG,CAAC,iBAAiB,EAAE,aAAa,EAAE,CAAC,CAAC,CAAC;QAElE,yBAAyB;QACzB,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QAE1B,OAAO;YACL,CAAC;YACD,CAAC;SACF,CAAC;IACJ,CAAC;IAEQ,IAAI;QACX,KAAK,CAAC,IAAI,EAAE,CAAC;QAEb,yBAAyB;QACzB,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAC7C,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IAC1B,CAAC;CACF"}