lecodes-viewer 0.20.0 → 1.0.0

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "lecodes-viewer",
-  "version": "0.20.0",
+  "version": "1.0.0",
   "main": "src/createViewer.ts",
   "dependencies": {
-    "lecodes-renderer": "0.20.0",
+    "lecodes-renderer": "1.0.0",
     "ogl": "^1.0.11",
-    "lecodes-viewer-lite": "0.20.0"
+    "lecodes-viewer-lite": "1.0.0"
   },
   "scripts": {
     "dev": "vite",

package/src/createViewer.ts

@@ -18,6 +18,8 @@ export { getBuffer } from './utils/fetch'
 export { decodeKtx2Image, isKtx2Bytes } from 'lecodes-viewer-lite/src/gl/decoders'
 export type { CreatorMethods, EngineMode, Host, HostOptions, Run, RunOptions, UIFactory } from './host'
 export type { PreviewError, MappedFrame } from './sourcemapError'
+// The render tree the canvas UI hands back (`_creatorUI.renderTree()`) — the embedder's verify gates walk it.
+export type { RenderNode } from 'lecodes-renderer'
 export { createCanvasUIRenderer } from './ui/mountCanvasUI'
 export { createBareUI } from './ui/createBareUI'
 export type { SafeAreaEdge, SafeAreaSpec } from './ui/safeAreaSpec'

package/src/ui/vListSystem.ts

@@ -1,212 +1,212 @@
-import type { UIScreen } from './UIScreen'
-
-type MountedItem = {
-    rootPtr: number       // detached yoga root айтема
-    el: HTMLElement       // DOM-корень поддерева
-    jsSubtree: any        // JS-объект поддерева (для null _id при unmount)
-}
-
-export type VListInstance = {
-    nodeId: number
-    el: HTMLElement
-    jsNode: any           // VListElement
-    screen: UIScreen
-    pendingScroll: number | null
-    items: Map<string, MountedItem>
-}
-
-export const createVListSystem = (module: any) => {
-
-    const instances = new Map<number, VListInstance>()   // yogaId vlist-ноды → instance
-
-    // ---------- marshaling ----------
-
-    const withKey = <R>(key: string, fn: (ptr: number) => R): R => {
-        const len = module.lengthBytesUTF8(key) + 1
-        const p = module._malloc(len)
-        module.stringToUTF8(key, p, len)
-        try { return fn(p) } finally { module._free(p) }
-    }
-
-    const withStringArray = <R>(arr: string[], fn: (arrPtr: number) => R): R => {
-        const ptrs = arr.map(s => {
-            const len = module.lengthBytesUTF8(s) + 1
-            const p = module._malloc(len)
-            module.stringToUTF8(s, p, len)
-            return p
-        })
-        const arrPtr = module._malloc(Math.max(4 * ptrs.length, 4))
-        ptrs.forEach((p, i) => { module.HEAPU32[(arrPtr >> 2) + i] = p })
-        try { return fn(arrPtr) } finally {
-            ptrs.forEach(p => module._free(p))
-            module._free(arrPtr)
-        }
-    }
-
-    const withFloatArray = <R>(arr: number[], fn: (ptr: number) => R): R => {
-        const p = module._malloc(Math.max(4 * arr.length, 4))
-        arr.forEach((v, i) => { module.HEAPF32[(p >> 2) + i] = v })
-        try { return fn(p) } finally { module._free(p) }
-    }
-
-    const readStringArray = (arrPtr: number, count: number): string[] => {
-        const out: string[] = []
-        for (let i = 0; i < count; i++) {
-            out.push(module.UTF8ToString(module.HEAPU32[(arrPtr >> 2) + i]))
-        }
-        return out
-    }
-
-    // ---------- layout-проход по айтемам ----------
-        
-    const refresh = (inst: VListInstance) => {
-        for (const [key, item] of inst.items) {
-            inst.screen.updateSizesFor(item.el)
-            item.el.style.top = withKey(key, p => module._vlistOffsetOf(inst.nodeId, p)) + "px"
-            item.el.style.left = "0px"
-        }
-        const h = module._getContentHeight(inst.nodeId)
-        inst.el.style.setProperty("--scroll-height", h + "px")
-        inst.el.style.setProperty("--scroll-width", "0px")
-
-        if (inst.pendingScroll !== null) {
-            if (Math.abs(inst.el.scrollTop - inst.pendingScroll) >= 1) {
-                inst.el.scrollTop = inst.pendingScroll   // высота уже выставлена — кламп не сработает
-            }
-            inst.pendingScroll = null
-        }
-    }
-
-    // ---------- колбэки из C++ (регистрируются один раз) ----------
-
-    // g_vlSync
-    const syncFunc = module.addFunction(
-        (_screenId: number, nodePtr: number, unmountArr: number, unmountCount: number, mountArr: number, mountCount: number) => {
-            const inst = instances.get(nodePtr)
-            if (!inst) return
-            const unmountKeys = readStringArray(unmountArr, unmountCount)
-            const mountKeys = readStringArray(mountArr, mountCount)
-
-            // Контракт: интеграционный слой сносит поддеревья ДО вызова JS _syncWindow
-            for (const key of unmountKeys) {
-                const item = inst.items.get(key)
-                if (!item) continue
-                inst.items.delete(key)
-                item.el.remove()
-                inst.screen.releaseSubtree(item.jsSubtree)            // nodeMap-чистка + _id = 0
-                withKey(key, p => module._vlistItemUnmounted(nodePtr, p))  // free yoga root
-            }
-
-            inst.jsNode._syncWindow(unmountKeys, mountKeys)           // mount: render() → vlistMount()
-            refresh(inst)
-        }, "viiiiii")
-
-    // g_vlAdjust — якорение / кламп
-    const adjustFunc = module.addFunction((_screenId: number, nodePtr: number, scrollY: number) => {
-        const inst = instances.get(nodePtr)
-        if (!inst) return
-        inst.pendingScroll = scrollY      // применим в refresh, после высоты
-    }, "viif")
-
-    // g_vlEdge
-    const edgeFunc = module.addFunction((_screenId: number, nodePtr: number, endEdge: number) => {
-        const inst = instances.get(nodePtr)
-        if (!inst) return
-        const listeners = endEdge ? (inst.jsNode.erl ?? []) : (inst.jsNode.strl ?? [])
-        for (const cb of listeners) cb()
-    }, "viii")
-
-    module._setVListHandlers(syncFunc, adjustFunc, edgeFunc)
-
-    // ---------- создание (из UIScreen.addNodeRecursive для type === "vlist") ----------
-
-    const register = (screen: UIScreen, jsNode: any, el: HTMLElement, yogaId: number) => {
-        const inst: VListInstance = { nodeId: yogaId, el, jsNode, screen, items: new Map(), pendingScroll: null }
-        instances.set(yogaId, inst)
-
-        module._vlistInit(yogaId, jsNode._overscan, jsNode._inverted ? 1 : 0,
-                          jsNode._startThreshold, jsNode._endThreshold)
-
-        if (jsNode._keys.length > 0) {
-            setKeysInternal(yogaId, jsNode._keys, jsNode._estimates)
-        }
-
-        el.addEventListener("scroll", () => {
-            module._vlistOnScroll(yogaId, el.scrollTop)
-            refresh(inst)
-            for (const cb of jsNode.sl ?? []) cb(el.scrollTop)
-        })
-    }
-
-    // Вызывается из UIScreen.updateSizes для vlist-элемента (после выставления его размеров)
-    const updateLayout = (yogaId: number) => {
-        const inst = instances.get(yogaId)
-        if (!inst) return
-        module._vlistUpdateLayout(yogaId)    // внутри может дернуть sync → mount
-        refresh(inst)
-    }
-
-    const unregister = (yogaId: number) => {
-        const inst = instances.get(yogaId)
-        if (!inst) return
-        module._vlistFree(yogaId)            // освобождает detached-корни
-        instances.delete(yogaId)
-    }
-
-    const setKeysInternal = (yogaId: number, keys: string[], estimates: number[]) => {
-        withStringArray(keys, kp =>
-            withFloatArray(estimates, ep =>
-                module._vlistSetKeys(yogaId, kp, ep, keys.length)))
-    }
-
-    // ---------- API для _creatorUI (зовётся из VListElement) ----------
-
-    const api = {
-        vlistSetKeys: (jsNode: any, keys: string[], estimates: number[]) => {
-            setKeysInternal(jsNode._id, keys, estimates)
-        },
-        vlistInsertKeys: (jsNode: any, index: number, keys: string[], estimates: number[]) => {
-            withStringArray(keys, kp =>
-                withFloatArray(estimates, ep =>
-                    module._vlistInsertKeys(jsNode._id, index, kp, ep, keys.length)))
-        },
-        vlistRemoveKeys: (jsNode: any, keys: string[]) => {
-            withStringArray(keys, kp => module._vlistRemoveKeys(jsNode._id, kp, keys.length))
-        },
-        vlistInvalidate: (jsNode: any, key: string) => {
-            withKey(key, p => module._vlistInvalidate(jsNode._id, p))
-        },
-        // Вызывается из _syncWindow на каждый mount-ключ
-        vlistMount: (jsNode: any, key: string, subtree: any) => {
-            const inst = instances.get(jsNode._id)
-            if (!inst) return
-            const rootPtr = withKey(key, p => module._vlistCreateItemRoot(jsNode._id, p))
-            const el = inst.screen.buildSubtree(subtree, rootPtr)     // addNodeRecursive в detached root
-            inst.el.appendChild(el)
-            inst.items.set(key, { rootPtr, el, jsSubtree: subtree })
-            withKey(key, p => module._vlistItemMounted(jsNode._id, p)) // измерение + кэш + якорение
-        },
-        command: (jsNode: any, name: string, ...args: any[]) => {
-            const inst = instances.get(jsNode._id)
-            if (!inst) return
-            const behavior = (animated: boolean) => animated ? "smooth" as const : "auto" as const
-            switch (name) {
-                case "scrollTo":
-                    inst.el.scrollTo({ top: args[0], behavior: behavior(args[1] ?? true) })
-                    break
-                case "scrollToKey": {
-                    const off = withKey(args[0], p => module._vlistOffsetOf(inst.nodeId, p))
-                    if (!isNaN(off)) inst.el.scrollTo({ top: off, behavior: behavior(args[1] ?? true) })
-                    break
-                }
-                case "scrollToEnd": {
-                    const h = module._getContentHeight(inst.nodeId)
-                    inst.el.scrollTo({ top: h - inst.el.clientHeight, behavior: behavior(args[0] ?? true) })
-                    break
-                }
-            }
-        },
-    }
-
-    return { register, updateLayout, unregister, refresh, api, instances }
+import type { UIScreen } from './UIScreen'
+
+type MountedItem = {
+    rootPtr: number       // detached yoga root айтема
+    el: HTMLElement       // DOM-корень поддерева
+    jsSubtree: any        // JS-объект поддерева (для null _id при unmount)
+}
+
+export type VListInstance = {
+    nodeId: number
+    el: HTMLElement
+    jsNode: any           // VListElement
+    screen: UIScreen
+    pendingScroll: number | null
+    items: Map<string, MountedItem>
+}
+
+export const createVListSystem = (module: any) => {
+
+    const instances = new Map<number, VListInstance>()   // yogaId vlist-ноды → instance
+
+    // ---------- marshaling ----------
+
+    const withKey = <R>(key: string, fn: (ptr: number) => R): R => {
+        const len = module.lengthBytesUTF8(key) + 1
+        const p = module._malloc(len)
+        module.stringToUTF8(key, p, len)
+        try { return fn(p) } finally { module._free(p) }
+    }
+
+    const withStringArray = <R>(arr: string[], fn: (arrPtr: number) => R): R => {
+        const ptrs = arr.map(s => {
+            const len = module.lengthBytesUTF8(s) + 1
+            const p = module._malloc(len)
+            module.stringToUTF8(s, p, len)
+            return p
+        })
+        const arrPtr = module._malloc(Math.max(4 * ptrs.length, 4))
+        ptrs.forEach((p, i) => { module.HEAPU32[(arrPtr >> 2) + i] = p })
+        try { return fn(arrPtr) } finally {
+            ptrs.forEach(p => module._free(p))
+            module._free(arrPtr)
+        }
+    }
+
+    const withFloatArray = <R>(arr: number[], fn: (ptr: number) => R): R => {
+        const p = module._malloc(Math.max(4 * arr.length, 4))
+        arr.forEach((v, i) => { module.HEAPF32[(p >> 2) + i] = v })
+        try { return fn(p) } finally { module._free(p) }
+    }
+
+    const readStringArray = (arrPtr: number, count: number): string[] => {
+        const out: string[] = []
+        for (let i = 0; i < count; i++) {
+            out.push(module.UTF8ToString(module.HEAPU32[(arrPtr >> 2) + i]))
+        }
+        return out
+    }
+
+    // ---------- layout-проход по айтемам ----------
+        
+    const refresh = (inst: VListInstance) => {
+        for (const [key, item] of inst.items) {
+            inst.screen.updateSizesFor(item.el)
+            item.el.style.top = withKey(key, p => module._vlistOffsetOf(inst.nodeId, p)) + "px"
+            item.el.style.left = "0px"
+        }
+        const h = module._getContentHeight(inst.nodeId)
+        inst.el.style.setProperty("--scroll-height", h + "px")
+        inst.el.style.setProperty("--scroll-width", "0px")
+
+        if (inst.pendingScroll !== null) {
+            if (Math.abs(inst.el.scrollTop - inst.pendingScroll) >= 1) {
+                inst.el.scrollTop = inst.pendingScroll   // высота уже выставлена — кламп не сработает
+            }
+            inst.pendingScroll = null
+        }
+    }
+
+    // ---------- колбэки из C++ (регистрируются один раз) ----------
+
+    // g_vlSync
+    const syncFunc = module.addFunction(
+        (_screenId: number, nodePtr: number, unmountArr: number, unmountCount: number, mountArr: number, mountCount: number) => {
+            const inst = instances.get(nodePtr)
+            if (!inst) return
+            const unmountKeys = readStringArray(unmountArr, unmountCount)
+            const mountKeys = readStringArray(mountArr, mountCount)
+
+            // Контракт: интеграционный слой сносит поддеревья ДО вызова JS _syncWindow
+            for (const key of unmountKeys) {
+                const item = inst.items.get(key)
+                if (!item) continue
+                inst.items.delete(key)
+                item.el.remove()
+                inst.screen.releaseSubtree(item.jsSubtree)            // nodeMap-чистка + _id = 0
+                withKey(key, p => module._vlistItemUnmounted(nodePtr, p))  // free yoga root
+            }
+
+            inst.jsNode._syncWindow(unmountKeys, mountKeys)           // mount: render() → vlistMount()
+            refresh(inst)
+        }, "viiiiii")
+
+    // g_vlAdjust — якорение / кламп
+    const adjustFunc = module.addFunction((_screenId: number, nodePtr: number, scrollY: number) => {
+        const inst = instances.get(nodePtr)
+        if (!inst) return
+        inst.pendingScroll = scrollY      // применим в refresh, после высоты
+    }, "viif")
+
+    // g_vlEdge
+    const edgeFunc = module.addFunction((_screenId: number, nodePtr: number, endEdge: number) => {
+        const inst = instances.get(nodePtr)
+        if (!inst) return
+        const listeners = endEdge ? (inst.jsNode.erl ?? []) : (inst.jsNode.strl ?? [])
+        for (const cb of listeners) cb()
+    }, "viii")
+
+    module._setVListHandlers(syncFunc, adjustFunc, edgeFunc)
+
+    // ---------- создание (из UIScreen.addNodeRecursive для type === "vlist") ----------
+
+    const register = (screen: UIScreen, jsNode: any, el: HTMLElement, yogaId: number) => {
+        const inst: VListInstance = { nodeId: yogaId, el, jsNode, screen, items: new Map(), pendingScroll: null }
+        instances.set(yogaId, inst)
+
+        module._vlistInit(yogaId, jsNode._overscan, jsNode._inverted ? 1 : 0,
+                          jsNode._startThreshold, jsNode._endThreshold)
+
+        if (jsNode._keys.length > 0) {
+            setKeysInternal(yogaId, jsNode._keys, jsNode._estimates)
+        }
+
+        el.addEventListener("scroll", () => {
+            module._vlistOnScroll(yogaId, el.scrollTop)
+            refresh(inst)
+            for (const cb of jsNode.sl ?? []) cb(el.scrollTop)
+        })
+    }
+
+    // Вызывается из UIScreen.updateSizes для vlist-элемента (после выставления его размеров)
+    const updateLayout = (yogaId: number) => {
+        const inst = instances.get(yogaId)
+        if (!inst) return
+        module._vlistUpdateLayout(yogaId)    // внутри может дернуть sync → mount
+        refresh(inst)
+    }
+
+    const unregister = (yogaId: number) => {
+        const inst = instances.get(yogaId)
+        if (!inst) return
+        module._vlistFree(yogaId)            // освобождает detached-корни
+        instances.delete(yogaId)
+    }
+
+    const setKeysInternal = (yogaId: number, keys: string[], estimates: number[]) => {
+        withStringArray(keys, kp =>
+            withFloatArray(estimates, ep =>
+                module._vlistSetKeys(yogaId, kp, ep, keys.length)))
+    }
+
+    // ---------- API для _creatorUI (зовётся из VListElement) ----------
+
+    const api = {
+        vlistSetKeys: (jsNode: any, keys: string[], estimates: number[]) => {
+            setKeysInternal(jsNode._id, keys, estimates)
+        },
+        vlistInsertKeys: (jsNode: any, index: number, keys: string[], estimates: number[]) => {
+            withStringArray(keys, kp =>
+                withFloatArray(estimates, ep =>
+                    module._vlistInsertKeys(jsNode._id, index, kp, ep, keys.length)))
+        },
+        vlistRemoveKeys: (jsNode: any, keys: string[]) => {
+            withStringArray(keys, kp => module._vlistRemoveKeys(jsNode._id, kp, keys.length))
+        },
+        vlistInvalidate: (jsNode: any, key: string) => {
+            withKey(key, p => module._vlistInvalidate(jsNode._id, p))
+        },
+        // Вызывается из _syncWindow на каждый mount-ключ
+        vlistMount: (jsNode: any, key: string, subtree: any) => {
+            const inst = instances.get(jsNode._id)
+            if (!inst) return
+            const rootPtr = withKey(key, p => module._vlistCreateItemRoot(jsNode._id, p))
+            const el = inst.screen.buildSubtree(subtree, rootPtr)     // addNodeRecursive в detached root
+            inst.el.appendChild(el)
+            inst.items.set(key, { rootPtr, el, jsSubtree: subtree })
+            withKey(key, p => module._vlistItemMounted(jsNode._id, p)) // измерение + кэш + якорение
+        },
+        command: (jsNode: any, name: string, ...args: any[]) => {
+            const inst = instances.get(jsNode._id)
+            if (!inst) return
+            const behavior = (animated: boolean) => animated ? "smooth" as const : "auto" as const
+            switch (name) {
+                case "scrollTo":
+                    inst.el.scrollTo({ top: args[0], behavior: behavior(args[1] ?? true) })
+                    break
+                case "scrollToKey": {
+                    const off = withKey(args[0], p => module._vlistOffsetOf(inst.nodeId, p))
+                    if (!isNaN(off)) inst.el.scrollTo({ top: off, behavior: behavior(args[1] ?? true) })
+                    break
+                }
+                case "scrollToEnd": {
+                    const h = module._getContentHeight(inst.nodeId)
+                    inst.el.scrollTo({ top: h - inst.el.clientHeight, behavior: behavior(args[0] ?? true) })
+                    break
+                }
+            }
+        },
+    }
+
+    return { register, updateLayout, unregister, refresh, api, instances }
 }

package/src/utils/imageNode.ts

@@ -99,6 +99,11 @@ function configureImageSrc(host: ImageHost, el: HTMLElement, src: ImageSrc, tint
       ;(el as any)._canvasSurface = surfaceId
       el.removeAttribute("data-viewbox")
       el.src = host.canvasHost?.surfaceToDataUrl(surfaceId) ?? ""
+    } else if (typeof src === "object" && "scene2d" in src) {
+      // UIImage(scene2d): a live 2D scene drawn into the box — desktop only so far (parity
+      // ui-scene2d-image); a blank box here rather than a bogus blob url.
+      el.removeAttribute("data-viewbox")
+      el.removeAttribute("src")
     } else {
       el.removeAttribute("data-viewbox")
       el.src = typeof src === "object" ? getUrl(src._id) : src

package/src/viewer/createViewer.ts

@@ -233,7 +233,7 @@ export const createViewer = async (canvas: HTMLCanvasElement, options: ViewerOpt
   // Each read-back writes into a caller-owned `out`, so there's no shared-buffer aliasing — we only
   // drop the per-call malloc/free + view allocation. Read module.HEAPF32 FRESH each call (emscripten
   // swaps that view on heap growth; the scratch address survives).
-  const READ_SCRATCH = 64   // largest reader: vehicleGetState = 7 + 3 per wheel
+  const READ_SCRATCH = 128  // largest reader: vehicleGetState = 11 + 11 per wheel
   const readScratchPtr = module._malloc(READ_SCRATCH * 4)
   const readInto = (out: Float32Array, n: number, fn: (ptr: number) => void): void => {
     fn(readScratchPtr)
@@ -396,16 +396,18 @@ export const createViewer = async (canvas: HTMLCanvasElement, options: ViewerOpt
       return id
     },
     vehicleDestroy: (vehicleId: number) => module._vehicleDestroy(vehicleId),
-    vehicleSetTransmission: (vehicleId: number, ratio: number, clutch: number) =>
-      module._vehicleSetTransmission(vehicleId, ratio, clutch),
     vehicleSetTuning: (vehicleId: number, settings: Float32Array) => {
       const ptr = module._malloc(settings.byteLength)
       module.HEAPF32.set(settings, ptr / 4)
       module._vehicleSetTuning(vehicleId, ptr, settings.length)
       module._free(ptr)
     },
-    vehicleSetInput: (vehicleId: number, forward: number, right: number, brake: number, handBrake: number) =>
-      module._vehicleSetInput(vehicleId, forward, right, brake, handBrake),
+    vehicleSetInput: (vehicleId: number, input: Float32Array) => {
+      const ptr = module._malloc(input.length * 4)
+      module.HEAPF32.set(input, ptr >> 2)
+      module._vehicleSetInput(vehicleId, ptr, input.length)
+      module._free(ptr)
+    },
     vehicleGetState: (vehicleId: number, out: Float32Array) =>
       readInto(out, Math.min(out.length, READ_SCRATCH), (ptr) => module._vehicleGetState(vehicleId, ptr, Math.min(out.length, READ_SCRATCH))),
     vehicleReset: (vehicleId: number, x: number, y: number, z: number, qx: number, qy: number, qz: number, qw: number) =>
@@ -440,6 +442,17 @@ export const createViewer = async (canvas: HTMLCanvasElement, options: ViewerOpt
     // Screen inputs are logical px; scale to backing px for the native (viewport-space) pick.
     raycastView: (offsetX: number, offsetY: number) => module._raycastView(offsetX * resFactor, offsetY * resFactor),
     setCulling: module._setCulling,
+    // Draw order / per-instance depth state (Mesh.renderPriority, Material.depthTest / depthWrite) —
+    // only once the wasm carries the exports; the SDK feature-detects them.
+    setRenderPriority: module._setRenderPriority,
+    setMaterialDepthTest: module._setMaterialDepthTest ? (id: number, on: boolean) => module._setMaterialDepthTest(id, on ? 1 : 0) : undefined,
+    setMaterialDepthWrite: module._setMaterialDepthWrite ? (id: number, on: boolean) => module._setMaterialDepthWrite(id, on ? 1 : 0) : undefined,
+    setMaterialCulling: module._setMaterialCulling,
+    setMaterialStencil: module._setMaterialStencil
+      ? (id: number, write: boolean, test: number, ref: number, onPass: number, onFail: number, onDepthFail: number, readMask: number, writeMask: number) =>
+        module._setMaterialStencil(id, write ? 1 : 0, test, ref, onPass, onFail, onDepthFail, readMask, writeMask)
+      : undefined,
+    setSceneStencil: module._setSceneStencil ? (sceneId: number, on: boolean) => module._setSceneStencil(sceneId, on ? 1 : 0) : undefined,
     setGlbCulling: module._setGlbCulling,
     // Culling default for animated GLBs (Model.load): only once the wasm carries the export — an older
     // binary leaves the SDK on the always-draw default (see bridges.d.ts).
@@ -615,7 +628,7 @@ export const createViewer = async (canvas: HTMLCanvasElement, options: ViewerOpt
     createMaterial: (systemId: number) => {
       return module._createMaterialInstance(compileMaterial(systemId))
     },
-    setMesh(entityId: number, materialId: number, vertices: Float32Array, normals: Float32Array, indices: Uint16Array, uv: Float32Array, meshType: number, uv1?: Float32Array) {
+    setMesh(entityId: number, materialId: number, vertices: Float32Array, normals: Float32Array, indices: Uint16Array, uv: Float32Array, meshType: number, uv1?: Float32Array, colors?: Uint8Array) {
       const ptrVertices = module._malloc(vertices.byteLength)
       const ptrNormals = module._malloc(normals.byteLength)
       const ptrIndices = module._malloc(indices.byteLength)
@@ -625,6 +638,15 @@ export const createViewer = async (canvas: HTMLCanvasElement, options: ViewerOpt
       module.HEAPU16.set(indices, ptrIndices/2)
       module.HEAPF32.set(uv, ptrUv/4)
 
+      // the vertex colours ride the newest export (createMeshC); a wasm without it draws white
+      if (colors && module._createMeshC) {
+        const ptrUv1 = uv1 ? module._malloc(uv1.byteLength) : 0
+        if (uv1 && ptrUv1) module.HEAPF32.set(uv1, ptrUv1 / 4)
+        const ptrColors = module._malloc(colors.byteLength)
+        module.HEAPU8.set(colors, ptrColors)
+        module._createMeshC(entityId, materialId, ptrVertices, ptrNormals, ptrIndices, ptrUv, vertices.length / 3, indices.length, meshType, ptrUv1, ptrColors)
+        return
+      }
       // the lightmap UV set rides the newer export; a wasm without it duplicates uv into UV1
       if (uv1 && module._createMeshEx) {
         const ptrUv1 = module._malloc(uv1.byteLength)
@@ -832,7 +854,11 @@ export const createViewer = async (canvas: HTMLCanvasElement, options: ViewerOpt
       return out
     },
     getGlbClipSet: (entityId: number) => module._getGlbClipSet(entityId),
-    sliceClip: (clipSetId: number, clip: number, start: number, end: number) => module._sliceClip(clipSetId, clip, start, end),
+    deriveClip: (clipSetId: number, clip: number, mirror: boolean, start: number, end: number) => {
+      if (typeof module._deriveClip === "function") return module._deriveClip(clipSetId, clip, mirror ? 1 : 0, start, end)
+      if (mirror) { console.warn("creator-gl: this wasm cannot mirror clips — rebuild it"); return 0 }   // a wasm from before 2026-09-06
+      return module._sliceClip(clipSetId, clip, start < 0 ? 0 : start, end < 0 ? 1e9 : end)
+    },
     destroyClipSet: (clipSetId: number) => module._destroyClipSet(clipSetId),
     animatorCreate: (entityId: number) => module._animatorCreate(entityId),
     animatorDestroy: (animatorId: number) => module._animatorDestroy(animatorId),