@edv4h/usketch-gpu3d-renderer 0.0.0-stage → 0.1.0

package/dist/gpu3d-shapes.js

@@ -0,0 +1,272 @@
+// The board's shapes in the GPU 3D view: each shape's picture (see `shape-raster`) laid
+// flat as a textured quad at the ground's height under its centre, in z-order. Like the
+// CSS 3D renderer's flat shapes they are drawn over the ground and the terrain (not
+// hidden by a hill: the terrain's drawn surface, water included, isn't known here).
+// Pictures are made a few per frame (nearest the camera first) and kept until the shape
+// changes; until then the shape shows as a pale placeholder.
+import { safeRotation, VIEW3D_DEPTH_GLSL, viewMatrix, } from "@edv4h/usketch-shared";
+import { linkProgram } from "./gpu3d-ground.js";
+import { loadSvgImage, nodePictureSvg, PICTURE_PAD, pictureScale, primitivePicture, } from "./shape-raster.js";
+/** Time (ms) a frame may spend making pictures. */
+const PICTURE_BUDGET_MS = 6;
+/** Pictures being loaded at once, at most. */
+const MAX_PENDING = 6;
+/** Frames a picture is kept after its shape stops being drawn. */
+const KEEP_FRAMES = 120;
+const PLACEHOLDER = [0.55, 0.58, 0.65, 0.25];
+/** How high a flat shape lies: the ground under its centre (as the CSS 3D renderer). Pure. */
+export function flatShapeHeight(box, groundAt) {
+    const h = groundAt(box.x + box.width / 2, box.y + box.height / 2);
+    return Number.isFinite(h) && h > 0 ? h : 0;
+}
+const VERTEX = `#version 300 es
+layout(location = 0) in vec2 aCorner;
+uniform mat4 uView;
+uniform vec4 uRect;
+uniform vec2 uRot;
+uniform float uHeight;
+out vec2 vUv;
+${VIEW3D_DEPTH_GLSL}
+void main() {
+	vUv = aCorner;
+	vec2 halfSize = uRect.zw * 0.5;
+	vec2 p = aCorner * uRect.zw - halfSize;
+	p = vec2(p.x * uRot.x - p.y * uRot.y, p.x * uRot.y + p.y * uRot.x);
+	vec2 world = uRect.xy + halfSize + p;
+	gl_Position = view3dPosition(uView * vec4(world, uHeight, 1.0));
+}`;
+const FRAGMENT = `#version 300 es
+precision highp float;
+in vec2 vUv;
+uniform sampler2D uTex;
+uniform float uHasTex;
+uniform vec4 uColor;
+out vec4 outColor;
+void main() {
+	vec4 c = uHasTex > 0.5 ? texture(uTex, vUv) : uColor;
+	if (c.a < 0.004) discard;
+	outColor = c;
+}`;
+export class ShapePainter {
+    gl;
+    onReady;
+    program;
+    vao;
+    buffer;
+    u = {};
+    pictures = new Map();
+    frameNo = 0;
+    /** Anisotropic filtering (sharp pictures seen at a grazing angle), when there is. */
+    aniso;
+    pending = 0;
+    released = false;
+    constructor(gl, 
+    /** Asked for another frame when a picture is ready. */
+    onReady) {
+        this.gl = gl;
+        this.onReady = onReady;
+        this.program = linkProgram(gl, VERTEX, FRAGMENT);
+        const ext = gl.getExtension("EXT_texture_filter_anisotropic");
+        this.aniso = ext
+            ? {
+                ext: ext.TEXTURE_MAX_ANISOTROPY_EXT,
+                max: Math.min(8, gl.getParameter(ext.MAX_TEXTURE_MAX_ANISOTROPY_EXT)),
+            }
+            : null;
+        for (const name of ["uView", "uRect", "uRot", "uHeight", "uTex", "uHasTex", "uColor"]) {
+            this.u[name] = gl.getUniformLocation(this.program, name);
+        }
+        const vao = gl.createVertexArray();
+        const buffer = gl.createBuffer();
+        if (!vao || !buffer)
+            throw new Error("gl objects");
+        this.vao = vao;
+        this.buffer = buffer;
+        gl.bindVertexArray(vao);
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([0, 0, 1, 0, 0, 1, 1, 1]), gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(0);
+        gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 8, 0);
+        gl.bindVertexArray(null);
+    }
+    /** Draw the shapes; `true` when pictures are still to be made (draw again). */
+    draw(frame, source) {
+        const { gl, u } = this;
+        this.frameNo++;
+        const { viewport } = frame.view;
+        const drawn = [];
+        const due = [];
+        for (const shape of source.shapes) {
+            if (shape.hidden)
+                continue;
+            if (!(shape.width > 0 && shape.height > 0))
+                continue;
+            const def = source.registry.get(shape.type);
+            if (!def)
+                continue;
+            const node = source.node(shape.id);
+            if (!node && !def.gpuPrimitive)
+                continue;
+            const scale = pictureScale(viewport.zoom, frame.pixelRatio, shape.width, shape.height);
+            const picture = this.pictures.get(shape.id) ?? null;
+            if (picture)
+                picture.lastFrame = this.frameNo;
+            const fresh = picture && picture.shape === shape && picture.scale === scale;
+            if (!fresh && !picture?.pending) {
+                // Nearer the camera = lower on the flat screen.
+                const nearness = (shape.y + shape.height / 2) * viewport.zoom + viewport.y;
+                due.push({ shape, scale, nearness });
+            }
+            const box = { x: shape.x, y: shape.y, width: shape.width, height: shape.height };
+            drawn.push({ shape, picture, height: flatShapeHeight(box, source.groundAt) });
+        }
+        this.makePictures(due, source);
+        this.forgetOld();
+        if (drawn.length > 0) {
+            const origin = gridOrigin(viewport.x, viewport.y, viewport.zoom);
+            // biome-ignore lint/correctness/useHookAtTopLevel: WebGL's useProgram, not a React hook
+            gl.useProgram(this.program);
+            gl.bindVertexArray(this.vao);
+            gl.uniformMatrix4fv(u.uView, false, viewMatrix(frame.view, origin));
+            gl.uniform1i(u.uTex, 0);
+            gl.uniform4fv(u.uColor, PLACEHOLDER);
+            gl.activeTexture(gl.TEXTURE0);
+            // Over the ground and the terrain, in z-order; leaves the depth to what stands.
+            gl.depthFunc(gl.ALWAYS);
+            gl.depthMask(false);
+            for (const { shape, picture, height } of drawn) {
+                const tex = picture && !picture.failed ? picture.texture : null;
+                if (picture?.failed)
+                    continue;
+                const rad = (safeRotation(shape.rotation) * Math.PI) / 180;
+                gl.uniform4f(u.uRect, shape.x - PICTURE_PAD - origin.x, shape.y - PICTURE_PAD - origin.y, shape.width + 2 * PICTURE_PAD, shape.height + 2 * PICTURE_PAD);
+                gl.uniform2f(u.uRot, Math.cos(rad), Math.sin(rad));
+                gl.uniform1f(u.uHeight, height);
+                gl.uniform1f(u.uHasTex, tex ? 1 : 0);
+                gl.bindTexture(gl.TEXTURE_2D, tex);
+                gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+            }
+            gl.depthFunc(gl.LEQUAL);
+            gl.depthMask(true);
+            gl.bindTexture(gl.TEXTURE_2D, null);
+            gl.bindVertexArray(null);
+        }
+        return due.length > 0 && this.pending < MAX_PENDING;
+    }
+    makePictures(due, source) {
+        if (due.length === 0)
+            return;
+        due.sort((a, b) => b.nearness - a.nearness);
+        const start = now();
+        for (const { shape, scale } of due) {
+            if (this.pending >= MAX_PENDING || now() - start > PICTURE_BUDGET_MS)
+                break;
+            const def = source.registry.get(shape.type);
+            if (!def)
+                continue;
+            const old = this.pictures.get(shape.id);
+            const picture = {
+                shape,
+                scale,
+                // Keep showing the old picture until the new one is ready.
+                texture: old?.texture ?? null,
+                pending: false,
+                failed: false,
+                lastFrame: this.frameNo,
+            };
+            this.pictures.set(shape.id, picture);
+            const node = source.node(shape.id);
+            try {
+                if (node) {
+                    const svg = nodePictureSvg(node, shape.width, shape.height, scale);
+                    picture.pending = true;
+                    this.pending++;
+                    loadSvgImage(svg).then((img) => this.finish(shape.id, picture, img), () => this.finish(shape.id, picture, null));
+                }
+                else {
+                    const prim = def.gpuPrimitive?.(shape) ?? null;
+                    const canvas = prim ? primitivePicture(shape, prim, scale) : null;
+                    this.upload(picture, canvas);
+                }
+            }
+            catch {
+                picture.failed = !picture.texture;
+            }
+        }
+    }
+    finish(id, picture, img) {
+        this.pending--;
+        picture.pending = false;
+        if (this.released || this.pictures.get(id) !== picture)
+            return;
+        this.upload(picture, img);
+        this.onReady();
+    }
+    upload(picture, src) {
+        const { gl } = this;
+        if (!src) {
+            picture.failed = !picture.texture;
+            return;
+        }
+        const tex = picture.texture ?? gl.createTexture();
+        if (!tex)
+            return;
+        gl.bindTexture(gl.TEXTURE_2D, tex);
+        gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
+        try {
+            gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, src);
+            gl.generateMipmap(gl.TEXTURE_2D);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+            if (this.aniso)
+                gl.texParameterf(gl.TEXTURE_2D, this.aniso.ext, this.aniso.max);
+            picture.texture = tex;
+            picture.failed = false;
+        }
+        catch {
+            // A tainted picture (a browser that won't let it on the GPU): the placeholder stays.
+            if (!picture.texture)
+                gl.deleteTexture(tex);
+            picture.failed = !picture.texture;
+        }
+        finally {
+            gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
+            gl.bindTexture(gl.TEXTURE_2D, null);
+        }
+    }
+    forgetOld() {
+        for (const [id, p] of this.pictures) {
+            if (this.frameNo - p.lastFrame > KEEP_FRAMES && !p.pending) {
+                if (p.texture)
+                    this.gl.deleteTexture(p.texture);
+                this.pictures.delete(id);
+            }
+        }
+    }
+    /** Pictures held now (tests, stats). */
+    pictureCount() {
+        return this.pictures.size;
+    }
+    release() {
+        this.released = true;
+        const { gl } = this;
+        for (const p of this.pictures.values())
+            if (p.texture)
+                gl.deleteTexture(p.texture);
+        this.pictures.clear();
+        gl.deleteBuffer(this.buffer);
+        gl.deleteVertexArray(this.vao);
+        gl.deleteProgram(this.program);
+    }
+}
+/** A grid-aligned world point near the view's top-left (keeps float32 vertices small). */
+function gridOrigin(vx, vy, zoom) {
+    const z = zoom > 0 ? zoom : 1;
+    return { x: Math.round(-vx / z / 256) * 256, y: Math.round(-vy / z / 256) * 256 };
+}
+function now() {
+    return typeof performance !== "undefined" ? performance.now() : Date.now();
+}
+//# sourceMappingURL=gpu3d-shapes.js.map

package/dist/gpu3d-shapes.js.map

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

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export { GROUND_GRID_SIZE, type GroundLook, GroundPainter, groundRegionPx, linkProgram, parseCssColor, type StageRect, stageRectWorld, } from "./gpu3d-ground.js";
+export { createGpu3dRendererPlugin, drawnCamera, GPU_STAGE_ATTR, GPU3D_LAYER_ID, type Gpu3dRendererApi, type Gpu3dRendererOptions, gpu3dRendererService, hiddenLayerRules, setupGpu3dRenderer, } from "./gpu3d-renderer.js";
+export { flatShapeHeight, ShapePainter, type ShapeSource } from "./gpu3d-shapes.js";
+export { loadSvgImage, MAX_PICTURE_PX, nodePictureSvg, PICTURE_PAD, pictureScale, primitivePicture, } from "./shape-raster.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,gBAAgB,EAChB,KAAK,UAAU,EACf,aAAa,EACb,cAAc,EACd,WAAW,EACX,aAAa,EACb,KAAK,SAAS,EACd,cAAc,GACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACN,yBAAyB,EACzB,WAAW,EACX,cAAc,EACd,cAAc,EACd,KAAK,gBAAgB,EACrB,KAAK,oBAAoB,EACzB,oBAAoB,EACpB,gBAAgB,EAChB,kBAAkB,GAClB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACpF,OAAO,EACN,YAAY,EACZ,cAAc,EACd,cAAc,EACd,WAAW,EACX,YAAY,EACZ,gBAAgB,GAChB,MAAM,mBAAmB,CAAC"}

package/dist/index.js

@@ -0,0 +1,5 @@
+export { GROUND_GRID_SIZE, GroundPainter, groundRegionPx, linkProgram, parseCssColor, stageRectWorld, } from "./gpu3d-ground.js";
+export { createGpu3dRendererPlugin, drawnCamera, GPU_STAGE_ATTR, GPU3D_LAYER_ID, gpu3dRendererService, hiddenLayerRules, setupGpu3dRenderer, } from "./gpu3d-renderer.js";
+export { flatShapeHeight, ShapePainter } from "./gpu3d-shapes.js";
+export { loadSvgImage, MAX_PICTURE_PX, nodePictureSvg, PICTURE_PAD, pictureScale, primitivePicture, } from "./shape-raster.js";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,gBAAgB,EAEhB,aAAa,EACb,cAAc,EACd,WAAW,EACX,aAAa,EAEb,cAAc,GACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACN,yBAAyB,EACzB,WAAW,EACX,cAAc,EACd,cAAc,EAGd,oBAAoB,EACpB,gBAAgB,EAChB,kBAAkB,GAClB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,eAAe,EAAE,YAAY,EAAoB,MAAM,mBAAmB,CAAC;AACpF,OAAO,EACN,YAAY,EACZ,cAAc,EACd,cAAc,EACd,WAAW,EACX,YAAY,EACZ,gBAAgB,GAChB,MAAM,mBAAmB,CAAC"}

package/dist/shape-raster.d.ts

@@ -0,0 +1,27 @@
+import type { GpuPrimitive, ShapeData } from "@edv4h/usketch-shared";
+/** Longest side of a shape picture, device px. */
+export declare const MAX_PICTURE_PX = 2048;
+/**
+ * World units a picture reaches past the shape's box on each side: what a shape draws
+ * just outside it (half of an edge's stroke, a shadow).
+ */
+export declare const PICTURE_PAD = 8;
+/**
+ * Picture px per world unit for a view zoom and pixel ratio: twice the screen's, as a
+ * power of two (so a little zooming re-uses the pictures), between 1/4 and 4, and small enough that the longest side
+ * of a `width` × `height` shape stays within {@link MAX_PICTURE_PX}. Pure.
+ */
+export declare function pictureScale(zoom: number, pixelRatio: number, width: number, height: number): number;
+/**
+ * The SVG markup of a DOM node's drawing at `scale` picture px per CSS px, `width` ×
+ * `height` CSS px, with {@link PICTURE_PAD} around it. Needs a document (computed styles).
+ */
+export declare function nodePictureSvg(node: Element, width: number, height: number, scale: number): string;
+/** Loads SVG markup as an image (rejects when it can't be decoded). */
+export declare function loadSvgImage(svg: string): Promise<HTMLImageElement>;
+/**
+ * A shape's `gpuPrimitive` drawn on a 2D canvas at `scale` px per world unit (in the
+ * shape's own unrotated box, with {@link PICTURE_PAD} around it). `null` when there is no 2D canvas or nothing to draw.
+ */
+export declare function primitivePicture(shape: ShapeData, prim: GpuPrimitive, scale: number): HTMLCanvasElement | null;
+//# sourceMappingURL=shape-raster.d.ts.map

package/dist/shape-raster.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shape-raster.d.ts","sourceRoot":"","sources":["../src/shape-raster.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAErE,kDAAkD;AAClD,eAAO,MAAM,cAAc,OAAO,CAAC;AACnC;;;GAGG;AACH,eAAO,MAAM,WAAW,IAAI,CAAC;AAE7B;;;;GAIG;AACH,wBAAgB,YAAY,CAC3B,IAAI,EAAE,MAAM,EACZ,UAAU,EAAE,MAAM,EAClB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACZ,MAAM,CAQR;AAgCD;;;GAGG;AACH,wBAAgB,cAAc,CAC7B,IAAI,EAAE,OAAO,EACb,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,MAAM,GACX,MAAM,CAsBR;AAED,uEAAuE;AACvE,wBAAsB,YAAY,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,gBAAgB,CAAC,CAMzE;AAOD;;;GAGG;AACH,wBAAgB,gBAAgB,CAC/B,KAAK,EAAE,SAAS,EAChB,IAAI,EAAE,YAAY,EAClB,KAAK,EAAE,MAAM,GACX,iBAAiB,GAAG,IAAI,CAsD1B"}

package/dist/shape-raster.js

@@ -0,0 +1,140 @@
+/** Longest side of a shape picture, device px. */
+export const MAX_PICTURE_PX = 2048;
+/**
+ * World units a picture reaches past the shape's box on each side: what a shape draws
+ * just outside it (half of an edge's stroke, a shadow).
+ */
+export const PICTURE_PAD = 8;
+/**
+ * Picture px per world unit for a view zoom and pixel ratio: twice the screen's, as a
+ * power of two (so a little zooming re-uses the pictures), between 1/4 and 4, and small enough that the longest side
+ * of a `width` × `height` shape stays within {@link MAX_PICTURE_PX}. Pure.
+ */
+export function pictureScale(zoom, pixelRatio, width, height) {
+    // Twice the screen's px: the ground is seen at a slant, which squeezes the picture.
+    const want = 2 * (Number.isFinite(zoom) && zoom > 0 ? zoom : 1) * (pixelRatio > 0 ? pixelRatio : 1);
+    let s = 2 ** Math.ceil(Math.log2(Math.min(4, Math.max(0.25, want))));
+    const side = Math.max(width, height, 1) + 2 * PICTURE_PAD;
+    while (s > 1 / 64 && side * s > MAX_PICTURE_PX)
+        s /= 2;
+    return s;
+}
+/** Computed styles left out of the copy (they place the node on the board, or hide it there). */
+const SKIPPED = new Set(["visibility", "pointer-events", "cursor", "transition", "animation"]);
+/** Styles of the copied root that would move it inside the picture. */
+const ROOT_RESET = {
+    position: "relative",
+    left: "0px",
+    top: "0px",
+    right: "auto",
+    bottom: "auto",
+    margin: "0px",
+    transform: "none",
+    "z-index": "auto",
+};
+function copyStyles(from, to) {
+    const cs = getComputedStyle(from);
+    const out = [];
+    for (let i = 0; i < cs.length; i++) {
+        const name = cs[i];
+        if (SKIPPED.has(name) || name.startsWith("transition") || name.startsWith("animation"))
+            continue;
+        const value = cs.getPropertyValue(name);
+        if (value)
+            out.push(`${name}:${value}`);
+    }
+    to.setAttribute("style", out.join(";"));
+    const fromKids = from.children;
+    const toKids = to.children;
+    for (let i = 0; i < fromKids.length && i < toKids.length; i++)
+        copyStyles(fromKids[i], toKids[i]);
+}
+/**
+ * The SVG markup of a DOM node's drawing at `scale` picture px per CSS px, `width` ×
+ * `height` CSS px, with {@link PICTURE_PAD} around it. Needs a document (computed styles).
+ */
+export function nodePictureSvg(node, width, height, scale) {
+    const clone = node.cloneNode(true);
+    copyStyles(node, clone);
+    if (clone instanceof HTMLElement || clone instanceof SVGElement) {
+        for (const [k, v] of Object.entries(ROOT_RESET))
+            clone.style.setProperty(k, v);
+    }
+    // Images from other URLs can't load inside an SVG image: leave them out.
+    for (const img of clone.querySelectorAll("img, image, video, iframe, canvas"))
+        img.remove();
+    const wrap = document.createElementNS("http://www.w3.org/1999/xhtml", "div");
+    wrap.setAttribute("style", `width:${width}px;height:${height}px;padding:${PICTURE_PAD}px;` +
+        `transform:scale(${scale});transform-origin:0 0;`);
+    wrap.appendChild(clone);
+    const xml = new XMLSerializer().serializeToString(wrap);
+    const pw = Math.max(1, Math.ceil((width + 2 * PICTURE_PAD) * scale));
+    const ph = Math.max(1, Math.ceil((height + 2 * PICTURE_PAD) * scale));
+    return (`<svg xmlns="http://www.w3.org/2000/svg" width="${pw}" height="${ph}">` +
+        `<foreignObject x="0" y="0" width="${pw}" height="${ph}">${xml}</foreignObject></svg>`);
+}
+/** Loads SVG markup as an image (rejects when it can't be decoded). */
+export async function loadSvgImage(svg) {
+    const img = new Image();
+    img.decoding = "async";
+    img.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
+    await img.decode();
+    return img;
+}
+function css(c, opacity = 1) {
+    const [r, g, b, a] = c;
+    return `rgba(${Math.round(r * 255)},${Math.round(g * 255)},${Math.round(b * 255)},${(a ?? 1) * opacity})`;
+}
+/**
+ * A shape's `gpuPrimitive` drawn on a 2D canvas at `scale` px per world unit (in the
+ * shape's own unrotated box, with {@link PICTURE_PAD} around it). `null` when there is no 2D canvas or nothing to draw.
+ */
+export function primitivePicture(shape, prim, scale) {
+    if (typeof document === "undefined")
+        return null;
+    const w = Math.max(1, Math.ceil((shape.width + 2 * PICTURE_PAD) * scale));
+    const h = Math.max(1, Math.ceil((shape.height + 2 * PICTURE_PAD) * scale));
+    const canvas = document.createElement("canvas");
+    canvas.width = w;
+    canvas.height = h;
+    const g = canvas.getContext("2d");
+    if (!g)
+        return null;
+    g.scale(scale, scale);
+    g.translate(PICTURE_PAD - shape.x, PICTURE_PAD - shape.y);
+    const { bounds } = prim;
+    const half = prim.strokeWidth / 2;
+    g.beginPath();
+    if (prim.kind === "rect") {
+        const r = Math.min(prim.cornerRadius ?? 0, bounds.width / 2, bounds.height / 2);
+        g.roundRect(bounds.x + half, bounds.y + half, bounds.width - 2 * half, bounds.height - 2 * half, r);
+    }
+    else if (prim.kind === "ellipse") {
+        g.ellipse(bounds.x + bounds.width / 2, bounds.y + bounds.height / 2, Math.max(0, bounds.width / 2 - half), Math.max(0, bounds.height / 2 - half), 0, 0, Math.PI * 2);
+    }
+    else if (prim.vertices && prim.vertices.length >= 4) {
+        const v = prim.vertices;
+        g.moveTo(v[0], v[1]);
+        for (let i = 2; i + 1 < v.length; i += 2)
+            g.lineTo(v[i], v[i + 1]);
+        if (prim.kind === "polygon")
+            g.closePath();
+    }
+    else {
+        return null;
+    }
+    g.globalAlpha = Math.min(1, Math.max(0, prim.opacity));
+    if (prim.kind !== "polyline" && prim.fill[3] > 0) {
+        g.fillStyle = css(prim.fill);
+        g.fill();
+    }
+    if (prim.strokeWidth > 0 && prim.stroke[3] > 0) {
+        g.lineWidth = prim.strokeWidth;
+        g.lineJoin = "round";
+        g.lineCap = "round";
+        g.strokeStyle = css(prim.stroke);
+        g.stroke();
+    }
+    return canvas;
+}
+//# sourceMappingURL=shape-raster.js.map

package/dist/shape-raster.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shape-raster.js","sourceRoot":"","sources":["../src/shape-raster.ts"],"names":[],"mappings":"AASA,kDAAkD;AAClD,MAAM,CAAC,MAAM,cAAc,GAAG,IAAI,CAAC;AACnC;;;GAGG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,CAAC;AAE7B;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAC3B,IAAY,EACZ,UAAkB,EAClB,KAAa,EACb,MAAc;IAEd,oFAAoF;IACpF,MAAM,IAAI,GACT,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACxF,IAAI,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IACrE,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,WAAW,CAAC;IAC1D,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,IAAI,GAAG,CAAC,GAAG,cAAc;QAAE,CAAC,IAAI,CAAC,CAAC;IACvD,OAAO,CAAC,CAAC;AACV,CAAC;AAED,iGAAiG;AACjG,MAAM,OAAO,GAAG,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE,gBAAgB,EAAE,QAAQ,EAAE,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;AAC/F,uEAAuE;AACvE,MAAM,UAAU,GAA2B;IAC1C,QAAQ,EAAE,UAAU;IACpB,IAAI,EAAE,KAAK;IACX,GAAG,EAAE,KAAK;IACV,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;IACd,MAAM,EAAE,KAAK;IACb,SAAS,EAAE,MAAM;IACjB,SAAS,EAAE,MAAM;CACjB,CAAC;AAEF,SAAS,UAAU,CAAC,IAAa,EAAE,EAAW;IAC7C,MAAM,EAAE,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAClC,MAAM,GAAG,GAAa,EAAE,CAAC;IACzB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACpC,MAAM,IAAI,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;QACnB,IAAI,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC;YACrF,SAAS;QACV,MAAM,KAAK,GAAG,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACxC,IAAI,KAAK;YAAE,GAAG,CAAC,IAAI,CAAC,GAAG,IAAI,IAAI,KAAK,EAAE,CAAC,CAAC;IACzC,CAAC;IACD,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;IACxC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;IAC/B,MAAM,MAAM,GAAG,EAAE,CAAC,QAAQ,CAAC;IAC3B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE;QAAE,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AACnG,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,cAAc,CAC7B,IAAa,EACb,KAAa,EACb,MAAc,EACd,KAAa;IAEb,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAY,CAAC;IAC9C,UAAU,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IACxB,IAAI,KAAK,YAAY,WAAW,IAAI,KAAK,YAAY,UAAU,EAAE,CAAC;QACjE,KAAK,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC;YAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAChF,CAAC;IACD,yEAAyE;IACzE,KAAK,MAAM,GAAG,IAAI,KAAK,CAAC,gBAAgB,CAAC,mCAAmC,CAAC;QAAE,GAAG,CAAC,MAAM,EAAE,CAAC;IAC5F,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAC,8BAA8B,EAAE,KAAK,CAAC,CAAC;IAC7E,IAAI,CAAC,YAAY,CAChB,OAAO,EACP,SAAS,KAAK,aAAa,MAAM,cAAc,WAAW,KAAK;QAC9D,mBAAmB,KAAK,yBAAyB,CAClD,CAAC;IACF,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IACxB,MAAM,GAAG,GAAG,IAAI,aAAa,EAAE,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;IACxD,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,KAAK,GAAG,CAAC,GAAG,WAAW,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;IACrE,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;IACtE,OAAO,CACN,kDAAkD,EAAE,aAAa,EAAE,IAAI;QACvE,qCAAqC,EAAE,aAAa,EAAE,KAAK,GAAG,wBAAwB,CACtF,CAAC;AACH,CAAC;AAED,uEAAuE;AACvE,MAAM,CAAC,KAAK,UAAU,YAAY,CAAC,GAAW;IAC7C,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC;IACxB,GAAG,CAAC,QAAQ,GAAG,OAAO,CAAC;IACvB,GAAG,CAAC,GAAG,GAAG,oCAAoC,kBAAkB,CAAC,GAAG,CAAC,EAAE,CAAC;IACxE,MAAM,GAAG,CAAC,MAAM,EAAE,CAAC;IACnB,OAAO,GAAG,CAAC;AACZ,CAAC;AAED,SAAS,GAAG,CAAC,CAAoB,EAAE,OAAO,GAAG,CAAC;IAC7C,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;IACvB,OAAO,QAAQ,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,OAAO,GAAG,CAAC;AAC3G,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAC/B,KAAgB,EAChB,IAAkB,EAClB,KAAa;IAEb,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO,IAAI,CAAC;IACjD,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,GAAG,WAAW,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;IAC1E,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;IAC3E,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAChD,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC;IACjB,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;IAClB,MAAM,CAAC,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IAClC,IAAI,CAAC,CAAC;QAAE,OAAO,IAAI,CAAC;IACpB,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC,SAAS,CAAC,WAAW,GAAG,KAAK,CAAC,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;IAC1D,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACxB,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;IAClC,CAAC,CAAC,SAAS,EAAE,CAAC;IACd,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC1B,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,EAAE,MAAM,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAChF,CAAC,CAAC,SAAS,CACV,MAAM,CAAC,CAAC,GAAG,IAAI,EACf,MAAM,CAAC,CAAC,GAAG,IAAI,EACf,MAAM,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,EACvB,MAAM,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,EACxB,CAAC,CACD,CAAC;IACH,CAAC;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;QACpC,CAAC,CAAC,OAAO,CACR,MAAM,CAAC,CAAC,GAAG,MAAM,CAAC,KAAK,GAAG,CAAC,EAC3B,MAAM,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,EAC5B,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,EACpC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,EACrC,CAAC,EACD,CAAC,EACD,IAAI,CAAC,EAAE,GAAG,CAAC,CACX,CAAC;IACH,CAAC;SAAM,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;QACvD,MAAM,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACxB,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACrB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC;YAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QACnE,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS;YAAE,CAAC,CAAC,SAAS,EAAE,CAAC;IAC5C,CAAC;SAAM,CAAC;QACP,OAAO,IAAI,CAAC;IACb,CAAC;IACD,CAAC,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;IACvD,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;QAClD,CAAC,CAAC,SAAS,GAAG,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7B,CAAC,CAAC,IAAI,EAAE,CAAC;IACV,CAAC;IACD,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;QAChD,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC;QAC/B,CAAC,CAAC,QAAQ,GAAG,OAAO,CAAC;QACrB,CAAC,CAAC,OAAO,GAAG,OAAO,CAAC;QACpB,CAAC,CAAC,WAAW,GAAG,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACjC,CAAC,CAAC,MAAM,EAAE,CAAC;IACZ,CAAC;IACD,OAAO,MAAM,CAAC;AACf,CAAC"}

package/package.json

@@ -1,6 +1,52 @@
 {
   "name": "@edv4h/usketch-gpu3d-renderer",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.1.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "source": "./src/index.ts",
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "dependencies": {
+    "@edv4h/usketch-shared": "4.25.0"
+  },
+  "peerDependencies": {
+    "react": ">=19"
+  },
+  "devDependencies": {
+    "@types/react": "19.3.0",
+    "@types/react-dom": "19.3.0",
+    "jsdom": "31.0.0",
+    "react-dom": "19.3.1",
+    "typescript": "7.0.2",
+    "vitest": "5.1.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/EdV4H/usketch.git",
+    "directory": "packages/gpu3d-renderer"
+  },
+  "homepage": "https://github.com/EdV4H/usketch#readme",
+  "bugs": {
+    "url": "https://github.com/EdV4H/usketch/issues"
+  },
+  "description": "Experimental GPU (WebGL2) renderer for the board 3D view: draws the ground, the terrain and what stands on it on one canvas with a depth buffer",
+  "scripts": {
+    "build": "tsc -p tsconfig.json",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run --passWithNoTests",
+    "clean": "rm -rf dist"
+  }
 }