poppygl 0.0.17 → 0.0.19

package/README.md

@@ -50,8 +50,13 @@ const png = await renderGLTFToPNGBufferFromGLBBuffer(glb, {
 `renderGLTFToPNGBufferFromURL` accepts the same render options as the lower-level APIs:
 
 - `width`/`height` (default `512`): output resolution in pixels.
+- `supersampling`: render at `width * supersampling` / `height * supersampling`, then downsample (default `1`).
 - `fov`: vertical field of view in degrees (defaults to `35`).
 - `camPos` and `lookAt`: override the auto-framed camera position and target.
+- `debugPoints`: optional `{ label, position }[]` overlay rendered on top of the final PNG for world-space debugging markers.
+- `debugFontSize`: optional pixel size for `debugPoints` labels; when omitted the renderer derives a size from the image dimensions.
+- `debugPointColor`: optional RGB tuple for debug point markers.
+- `debugLabelColor`: optional RGB tuple for debug point labels.
 - `lightDir`: normalized directional light vector (defaults to a top-right key light).
 - `ambient`: ambient lighting contribution (0–1, defaults to `0.2`).
 - `gamma`: gamma correction applied to the output (defaults to `2.2`).

package/dist/index.d.ts

@@ -53,6 +53,14 @@ interface GLTFScene {
 }
 
 declare const DEFAULT_LIGHT_DIR: readonly [-0.4, -0.9, -0.2];
+interface DebugPoint {
+    label: string;
+    position: {
+        x: number;
+        y: number;
+        z: number;
+    };
+}
 /**
  * Convert a hex color string to RGB array with values 0-1
  * @param hex - Hex color string like "#ffffff" or "ffffff"
@@ -62,6 +70,7 @@ declare function hexToRgb(hex: string): [number, number, number] | null;
 interface RenderOptions {
     width: number;
     height: number;
+    supersampling: number;
     fov: number;
     cull: boolean;
     gamma: boolean;
@@ -71,6 +80,10 @@ interface RenderOptions {
     lookAt?: readonly [number, number, number] | null;
     backgroundColor?: readonly [number, number, number] | string | null;
     grid?: boolean | GridOptions;
+    debugPoints?: DebugPoint[] | null;
+    debugFontSize?: number | null;
+    debugPointColor?: readonly [number, number, number] | null;
+    debugLabelColor?: readonly [number, number, number] | null;
 }
 type RenderOptionsInput = Partial<RenderOptions>;
 declare const DEFAULT_RENDER_OPTIONS: RenderOptions;
@@ -187,4 +200,4 @@ declare function renderGLTFToPNGBuffer(gltfPathOrString: string, options?: Rende
 
 declare function renderSceneFromGLTF(scene: GLTFScene, options?: RenderOptionsInput, imageFactory?: ImageFactory): RenderResult;
 
-export { type BitmapLike, type Camera, DEFAULT_LIGHT_DIR, DEFAULT_RENDER_OPTIONS, type DrawCall, type FetchLike, type GLTFResources, type GLTFScene, type GridOptions, type ImageFactory, type LightSettings, type LoadGLTFWithResourcesFromURLOptions, type Material, type MutableRGBA, type RGBA, type RenderGLTFToPNGBufferFromGLBBufferOptions, type RenderGLTFToPNGBufferFromURLOptions, type RenderOptions, type RenderOptionsInput, type RenderResult, SoftwareRenderer, bufferFromDataURI, buildCamera, computeSmoothNormals, computeWorldAABB, createGrid, createInfiniteGrid, createSceneFromGLTF, createUint8Bitmap, decodeImageFromBuffer, drawInfiniteGrid, encodePNGToBuffer, getDefaultRenderOptions, hexToRgb, isJPG, isPNG, loadGLTFWithResourcesFromURL, pureImageFactory, renderDrawCalls, renderGLTFToPNGBuffer, renderGLTFToPNGBufferFromGLBBuffer, renderGLTFToPNGBufferFromURL, renderSceneFromGLTF, resolveRenderOptions };
+export { type BitmapLike, type Camera, DEFAULT_LIGHT_DIR, DEFAULT_RENDER_OPTIONS, type DebugPoint, type DrawCall, type FetchLike, type GLTFResources, type GLTFScene, type GridOptions, type ImageFactory, type LightSettings, type LoadGLTFWithResourcesFromURLOptions, type Material, type MutableRGBA, type RGBA, type RenderGLTFToPNGBufferFromGLBBufferOptions, type RenderGLTFToPNGBufferFromURLOptions, type RenderOptions, type RenderOptionsInput, type RenderResult, SoftwareRenderer, bufferFromDataURI, buildCamera, computeSmoothNormals, computeWorldAABB, createGrid, createInfiniteGrid, createSceneFromGLTF, createUint8Bitmap, decodeImageFromBuffer, drawInfiniteGrid, encodePNGToBuffer, getDefaultRenderOptions, hexToRgb, isJPG, isPNG, loadGLTFWithResourcesFromURL, pureImageFactory, renderDrawCalls, renderGLTFToPNGBuffer, renderGLTFToPNGBufferFromGLBBuffer, renderGLTFToPNGBufferFromURL, renderSceneFromGLTF, resolveRenderOptions };

package/dist/index.js

@@ -132,35 +132,56 @@ var createUint8Bitmap = (width, height) => ({
   data: new Uint8ClampedArray(width * height * 4)
 });
 
-// lib/render/getDefaultRenderOptions.ts
-var DEFAULT_LIGHT_DIR = [-0.4, -0.9, -0.2];
-function hexToRgb(hex) {
-  const cleanHex = hex.replace(/^#/, "");
-  if (!/^[0-9A-Fa-f]{6}$/.test(cleanHex)) {
-    return null;
+// lib/render/downsampleBitmap.ts
+function downsampleBitmap(source, targetWidth, targetHeight, imageFactory) {
+  const target = imageFactory(targetWidth, targetHeight);
+  const scaleX = source.width / targetWidth;
+  const scaleY = source.height / targetHeight;
+  for (let y = 0; y < targetHeight; y++) {
+    const srcY0 = Math.floor(y * scaleY);
+    const srcY1 = Math.max(
+      srcY0 + 1,
+      Math.min(source.height, Math.floor((y + 1) * scaleY))
+    );
+    for (let x = 0; x < targetWidth; x++) {
+      const srcX0 = Math.floor(x * scaleX);
+      const srcX1 = Math.max(
+        srcX0 + 1,
+        Math.min(source.width, Math.floor((x + 1) * scaleX))
+      );
+      let r = 0;
+      let g = 0;
+      let b = 0;
+      let a = 0;
+      let count = 0;
+      for (let sy = srcY0; sy < srcY1; sy++) {
+        for (let sx = srcX0; sx < srcX1; sx++) {
+          const srcIdx = (sy * source.width + sx) * 4;
+          r += source.data[srcIdx + 0];
+          g += source.data[srcIdx + 1];
+          b += source.data[srcIdx + 2];
+          a += source.data[srcIdx + 3];
+          count++;
+        }
+      }
+      const dstIdx = (y * targetWidth + x) * 4;
+      target.data[dstIdx + 0] = Math.round(r / count);
+      target.data[dstIdx + 1] = Math.round(g / count);
+      target.data[dstIdx + 2] = Math.round(b / count);
+      target.data[dstIdx + 3] = Math.round(a / count);
+    }
   }
-  const r = Number.parseInt(cleanHex.substring(0, 2), 16) / 255;
-  const g = Number.parseInt(cleanHex.substring(2, 4), 16) / 255;
-  const b = Number.parseInt(cleanHex.substring(4, 6), 16) / 255;
-  return [r, g, b];
-}
-var DEFAULT_RENDER_OPTIONS = {
-  width: 800,
-  height: 600,
-  fov: 60,
-  cull: true,
-  gamma: true,
-  ambient: 0.15,
-  lightDir: DEFAULT_LIGHT_DIR,
-  camPos: null,
-  lookAt: null,
-  backgroundColor: null,
-  grid: false
-};
-function getDefaultRenderOptions() {
-  return { ...DEFAULT_RENDER_OPTIONS };
+  return target;
 }
 
+// lib/render/drawDebugPoints.ts
+import {
+  glyphAdvanceRatio,
+  glyphLineAlphabet,
+  textMetrics
+} from "@tscircuit/alphabet";
+import { mat4 as mat44, vec4 as vec43 } from "gl-matrix";
+
 // lib/render/SoftwareRenderer.ts
 import { mat3, mat4 as mat43, vec3 as vec32, vec4 as vec42 } from "gl-matrix";
 
@@ -230,6 +251,40 @@ function computeSmoothNormals(positions, indices) {
   return normals;
 }
 
+// lib/render/getDefaultRenderOptions.ts
+var DEFAULT_LIGHT_DIR = [-0.4, -0.9, -0.2];
+function hexToRgb(hex) {
+  const cleanHex = hex.replace(/^#/, "");
+  if (!/^[0-9A-Fa-f]{6}$/.test(cleanHex)) {
+    return null;
+  }
+  const r = Number.parseInt(cleanHex.substring(0, 2), 16) / 255;
+  const g = Number.parseInt(cleanHex.substring(2, 4), 16) / 255;
+  const b = Number.parseInt(cleanHex.substring(4, 6), 16) / 255;
+  return [r, g, b];
+}
+var DEFAULT_RENDER_OPTIONS = {
+  width: 800,
+  height: 600,
+  supersampling: 1,
+  fov: 60,
+  cull: true,
+  gamma: true,
+  ambient: 0.15,
+  lightDir: DEFAULT_LIGHT_DIR,
+  camPos: null,
+  lookAt: null,
+  backgroundColor: null,
+  grid: false,
+  debugPoints: null,
+  debugFontSize: null,
+  debugPointColor: null,
+  debugLabelColor: null
+};
+function getDefaultRenderOptions() {
+  return { ...DEFAULT_RENDER_OPTIONS };
+}
+
 // lib/utils/mulColor.ts
 function mulColor(a, b) {
   return [a[0] * b[0], a[1] * b[1], a[2] * b[2], a[3] * b[3]];
@@ -603,19 +658,177 @@ function edge(a, b, p) {
   return (p[0] - a[0]) * (b[1] - a[1]) - (p[1] - a[1]) * (b[0] - a[0]);
 }
 
-// lib/render/resolveRenderOptions.ts
-function resolveRenderOptions(options = {}) {
+// lib/render/drawDebugPoints.ts
+var DEFAULT_MARKER_COLOR = [
+  255,
+  0,
+  170,
+  255
+];
+var DEFAULT_TEXT_COLOR = [
+  255,
+  24,
+  170,
+  255
+];
+var CHARACTER_WIDTH_RATIO = 0.62;
+function drawDebugPoints(renderer, camera, debugPoints, debugFontSize, debugPointColor, debugLabelColor) {
+  if (debugPoints.length === 0) return;
+  const viewProj = mat44.create();
+  mat44.multiply(viewProj, camera.proj, camera.view);
+  const markerColor = toColorRGBA(debugPointColor, DEFAULT_MARKER_COLOR);
+  const textColor = toColorRGBA(debugLabelColor, DEFAULT_TEXT_COLOR);
+  const labelScale = typeof debugFontSize === "number" && Number.isFinite(debugFontSize) ? Math.max(1, Math.round(debugFontSize)) : Math.max(
+    12,
+    Math.round(Math.min(renderer.width, renderer.height) * 0.028)
+  );
+  const textThickness = Math.max(
+    2,
+    Math.round(labelScale * textMetrics.strokeWidthRatio)
+  );
+  for (const debugPoint of debugPoints) {
+    const projected = projectWorldToScreen(
+      debugPoint.position,
+      viewProj,
+      renderer
+    );
+    if (!projected) continue;
+    drawMarker(renderer, projected, markerColor);
+    drawLabel(
+      renderer,
+      projected,
+      debugPoint.label,
+      textColor,
+      labelScale,
+      textThickness
+    );
+  }
+}
+function projectWorldToScreen(position, viewProj, renderer) {
+  const clip = vec43.fromValues(position.x, position.y, position.z, 1);
+  vec43.transformMat4(clip, clip, viewProj);
+  if (!Number.isFinite(clip[3]) || clip[3] <= 0) return null;
+  const invW = 1 / clip[3];
+  const ndcX = clip[0] * invW;
+  const ndcY = clip[1] * invW;
+  const ndcZ = clip[2] * invW;
+  if (!Number.isFinite(ndcX) || !Number.isFinite(ndcY) || !Number.isFinite(ndcZ) || ndcZ < -1 || ndcZ > 1) {
+    return null;
+  }
   return {
-    ...DEFAULT_RENDER_OPTIONS,
-    ...options,
-    lightDir: options.lightDir != null ? options.lightDir : DEFAULT_RENDER_OPTIONS.lightDir,
-    camPos: options.camPos !== void 0 ? options.camPos : DEFAULT_RENDER_OPTIONS.camPos,
-    lookAt: options.lookAt !== void 0 ? options.lookAt : DEFAULT_RENDER_OPTIONS.lookAt
+    x: (ndcX * 0.5 + 0.5) * (renderer.width - 1),
+    y: (1 - (ndcY * 0.5 + 0.5)) * (renderer.height - 1)
   };
 }
+function drawMarker(renderer, projected, color) {
+  const centerX = Math.round(projected.x);
+  const centerY = Math.round(projected.y);
+  for (let offset = -5; offset <= 4; offset += 1) {
+    renderer.setPixel(
+      centerX + offset,
+      centerY,
+      color[0],
+      color[1],
+      color[2],
+      color[3]
+    );
+    renderer.setPixel(
+      centerX,
+      centerY + offset,
+      color[0],
+      color[1],
+      color[2],
+      color[3]
+    );
+  }
+}
+function drawLabel(renderer, projected, label, color, scale, textThickness) {
+  if (label.length === 0) return;
+  const scaleX = scale * CHARACTER_WIDTH_RATIO;
+  const labelWidth = measureLabelWidth(label, scaleX);
+  let x = projected.x + scale * 0.6;
+  let y = projected.y - scale * 1.1;
+  if (x + labelWidth > renderer.width - 2) {
+    x = projected.x - scale * 0.6 - labelWidth;
+  }
+  if (y < 2) {
+    y = projected.y + scale * 0.2;
+  }
+  drawStrokeText(renderer, label, x, y, scaleX, scale, color, textThickness);
+}
+function drawStrokeText(renderer, text, x, y, scaleX, scaleY, color, thickness) {
+  let cursorX = x;
+  for (const rawChar of text) {
+    const char = resolveGlyph(rawChar);
+    const glyph = glyphLineAlphabet[char];
+    const advanceRatio = glyphAdvanceRatio[char] ?? (char === " " ? textMetrics.spaceWidthRatio : textMetrics.glyphWidthRatio);
+    if (glyph) {
+      for (const segment of glyph) {
+        drawLine(
+          renderer,
+          cursorX + segment.x1 * scaleX,
+          y + (1 - segment.y1) * scaleY,
+          cursorX + segment.x2 * scaleX,
+          y + (1 - segment.y2) * scaleY,
+          color,
+          thickness
+        );
+      }
+    }
+    cursorX += advanceRatio * scaleX;
+  }
+}
+function resolveGlyph(char) {
+  if (glyphLineAlphabet[char]) return char;
+  const uppercase = char.toUpperCase();
+  if (glyphLineAlphabet[uppercase]) return uppercase;
+  return "?";
+}
+function measureLabelWidth(text, scaleX) {
+  let width = 0;
+  for (const rawChar of text) {
+    const char = resolveGlyph(rawChar);
+    width += glyphAdvanceRatio[char] ?? (char === " " ? textMetrics.spaceWidthRatio : textMetrics.glyphWidthRatio);
+  }
+  return width * scaleX;
+}
+function drawLine(renderer, x0, y0, x1, y1, color, thickness) {
+  const dx = x1 - x0;
+  const dy = y1 - y0;
+  const steps = Math.max(Math.abs(dx), Math.abs(dy));
+  if (steps === 0) {
+    drawBrush(renderer, x0, y0, color, thickness);
+    return;
+  }
+  for (let step = 0; step <= steps; step += 1) {
+    const t = step / steps;
+    drawBrush(renderer, x0 + dx * t, y0 + dy * t, color, thickness);
+  }
+}
+function drawBrush(renderer, x, y, color, thickness) {
+  const radius = Math.max(0, Math.floor((thickness - 1) / 2));
+  const centerX = Math.round(x);
+  const centerY = Math.round(y);
+  for (let offsetY = -radius; offsetY <= radius; offsetY += 1) {
+    for (let offsetX = -radius; offsetX <= radius; offsetX += 1) {
+      renderer.setPixel(
+        centerX + offsetX,
+        centerY + offsetY,
+        color[0],
+        color[1],
+        color[2],
+        color[3]
+      );
+    }
+  }
+}
+function toColorRGBA(color, fallback) {
+  if (!color) return fallback;
+  return [color[0], color[1], color[2], 255];
+}
 
 // lib/render/drawInfiniteGrid.ts
-import { mat4 as mat44, vec4 as vec43 } from "gl-matrix";
+import { mat4 as mat45, vec4 as vec44 } from "gl-matrix";
 function computeGridLineIntensity(params) {
   const rx = params.world_x / params.cell_size;
   const rz = params.world_z / params.cell_size;
@@ -651,23 +864,23 @@ function drawInfiniteGrid(software_renderer, params) {
   const camera = params.camera;
   const view = camera.view;
   const proj = camera.proj;
-  const inv_view = mat44.create();
-  mat44.invert(inv_view, view);
+  const inv_view = mat45.create();
+  mat45.invert(inv_view, view);
   const cam_pos_x = inv_view[12];
   const cam_pos_y = inv_view[13];
   const cam_pos_z = inv_view[14];
-  const vp = mat44.create();
-  mat44.multiply(vp, proj, view);
-  const inv_vp = mat44.create();
-  mat44.invert(inv_vp, vp);
+  const vp = mat45.create();
+  mat45.multiply(vp, proj, view);
+  const inv_vp = mat45.create();
+  mat45.invert(inv_vp, vp);
   for (let y = 0; y < software_renderer.height; y++) {
     for (let x = 0; x < software_renderer.width; x++) {
       const ndc_x = x / (software_renderer.width - 1) * 2 - 1;
       const ndc_y = 1 - y / (software_renderer.height - 1) * 2;
-      const near_point = vec43.fromValues(ndc_x, ndc_y, -1, 1);
-      const far_point = vec43.fromValues(ndc_x, ndc_y, 1, 1);
-      vec43.transformMat4(near_point, near_point, inv_vp);
-      vec43.transformMat4(far_point, far_point, inv_vp);
+      const near_point = vec44.fromValues(ndc_x, ndc_y, -1, 1);
+      const far_point = vec44.fromValues(ndc_x, ndc_y, 1, 1);
+      vec44.transformMat4(near_point, near_point, inv_vp);
+      vec44.transformMat4(far_point, far_point, inv_vp);
       near_point[0] /= near_point[3];
       near_point[1] /= near_point[3];
       near_point[2] /= near_point[3];
@@ -682,9 +895,9 @@ function drawInfiniteGrid(software_renderer, params) {
       if (t < 0 || t > 1) continue;
       const world_x = near_point[0] + t * ray_dir_x;
       const world_z = near_point[2] + t * ray_dir_z;
-      const world_pt = vec43.fromValues(world_x, grid_y, world_z, 1);
-      const clip_pt = vec43.create();
-      vec43.transformMat4(clip_pt, world_pt, vp);
+      const world_pt = vec44.fromValues(world_x, grid_y, world_z, 1);
+      const clip_pt = vec44.create();
+      vec44.transformMat4(clip_pt, world_pt, vp);
       const ndc_z = clip_pt[2] / clip_pt[3];
       const depth_01 = ndc_z * 0.5 + 0.5;
       const di = y * software_renderer.width + x;
@@ -759,22 +972,33 @@ function drawInfiniteGrid(software_renderer, params) {
   }
 }
 
+// lib/render/resolveRenderOptions.ts
+function resolveRenderOptions(options = {}) {
+  const supersampling = typeof options.supersampling === "number" && Number.isFinite(options.supersampling) ? Math.max(1, Math.floor(options.supersampling)) : DEFAULT_RENDER_OPTIONS.supersampling;
+  return {
+    ...DEFAULT_RENDER_OPTIONS,
+    ...options,
+    supersampling,
+    lightDir: options.lightDir != null ? options.lightDir : DEFAULT_RENDER_OPTIONS.lightDir,
+    camPos: options.camPos !== void 0 ? options.camPos : DEFAULT_RENDER_OPTIONS.camPos,
+    lookAt: options.lookAt !== void 0 ? options.lookAt : DEFAULT_RENDER_OPTIONS.lookAt
+  };
+}
+
 // lib/render/renderDrawCalls.ts
 function renderDrawCalls(drawCalls, optionsInput = {}, imageFactory = createUint8Bitmap) {
   const options = resolveRenderOptions(optionsInput);
+  const renderWidth = options.width * options.supersampling;
+  const renderHeight = options.height * options.supersampling;
   const camera = buildCamera(
     drawCalls,
-    options.width,
-    options.height,
+    renderWidth,
+    renderHeight,
     options.fov,
     options.camPos ?? null,
     options.lookAt ?? null
   );
-  const renderer = new SoftwareRenderer(
-    options.width,
-    options.height,
-    imageFactory
-  );
+  const renderer = new SoftwareRenderer(renderWidth, renderHeight, imageFactory);
   let rgb = null;
   if (options.backgroundColor) {
     if (typeof options.backgroundColor === "string") {
@@ -870,11 +1094,27 @@ function renderDrawCalls(drawCalls, optionsInput = {}, imageFactory = createUint
     });
   }
   renderGroup(blendDraws);
-  return { bitmap: renderer.bitmap, camera, options };
+  if (options.debugPoints?.length) {
+    drawDebugPoints(
+      renderer,
+      camera,
+      options.debugPoints,
+      options.debugFontSize,
+      options.debugPointColor,
+      options.debugLabelColor
+    );
+  }
+  const bitmap = options.supersampling > 1 ? downsampleBitmap(
+    renderer.bitmap,
+    options.width,
+    options.height,
+    imageFactory
+  ) : renderer.bitmap;
+  return { bitmap, camera, options };
 }
 
 // lib/gltf/createInfiniteGrid.ts
-import { mat4 as mat45 } from "gl-matrix";
+import { mat4 as mat46 } from "gl-matrix";
 function createInfiniteGrid(options = {}) {
   const cellSize = options.cellSize ?? 1;
   const sectionSize = options.sectionSize ?? 10;
@@ -898,9 +1138,9 @@ function createInfiniteGrid(options = {}) {
     size
   ]);
   const indices = new Uint32Array([0, 1, 2, 0, 2, 3]);
-  const model = mat45.create();
+  const model = mat46.create();
   const offset = options.offset ?? {};
-  mat45.fromTranslation(model, [offset.x ?? 0, offset.y ?? 0, offset.z ?? 0]);
+  mat46.fromTranslation(model, [offset.x ?? 0, offset.y ?? 0, offset.z ?? 0]);
   return {
     positions,
     indices,
@@ -925,7 +1165,7 @@ function createInfiniteGrid(options = {}) {
 }
 
 // lib/gltf/createSceneFromGLTF.ts
-import { mat4 as mat46 } from "gl-matrix";
+import { mat4 as mat47 } from "gl-matrix";
 var COMPONENT_INFO = {
   5120: {
     name: "BYTE",
@@ -1123,17 +1363,17 @@ function readIndices(ctx, accessorIndex) {
 }
 function nodeLocalMatrix(node) {
   if (node.matrix) {
-    const m2 = mat46.create();
+    const m2 = mat47.create();
     for (let i = 0; i < 16; i++) m2[i] = node.matrix[i];
     return m2;
   }
   const translation = node.translation || [0, 0, 0];
   const rotation = node.rotation || [0, 0, 0, 1];
   const scale = node.scale || [1, 1, 1];
-  const m = mat46.create();
-  const tmp = mat46.create();
-  mat46.fromRotationTranslationScale(tmp, rotation, translation, scale);
-  mat46.copy(m, tmp);
+  const m = mat47.create();
+  const tmp = mat47.create();
+  mat47.fromRotationTranslationScale(tmp, rotation, translation, scale);
+  mat47.copy(m, tmp);
   return m;
 }
 function getMaterial(gltf, textures, images, materialIndex) {
@@ -1171,8 +1411,8 @@ function createSceneFromGLTF(gltf, resources) {
     const node = nodes[nodeIndex];
     if (!node) return;
     const local = nodeLocalMatrix(node);
-    const world = mat46.create();
-    mat46.multiply(world, parentMatrix, local);
+    const world = mat47.create();
+    mat47.multiply(world, parentMatrix, local);
     if (Number.isInteger(node.mesh)) {
       const mesh = meshes[node.mesh];
       if (mesh) {
@@ -1210,7 +1450,7 @@ function createSceneFromGLTF(gltf, resources) {
       traverse(childIndex, world);
     }
   }
-  const identity = mat46.create();
+  const identity = mat47.create();
   for (const rootIndex of scene.nodes || []) {
     traverse(rootIndex, identity);
   }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "poppygl",
   "main": "dist/index.js",
-  "version": "0.0.17",
+  "version": "0.0.19",
   "repository": {
     "type": "git",
     "url": "https://github.com/tscircuit/poppygl.git"
@@ -20,6 +20,7 @@
   "type": "module",
   "devDependencies": {
     "@biomejs/biome": "^2.2.4",
+    "@tscircuit/alphabet": "^0.0.22",
     "@types/bun": "^1.2.23",
     "@types/readable-stream": "^4.0.21",
     "looks-same": "^10.0.1",