pacem 0.51.2 → 0.51.3-avaris

package/dist/css/pacem-dark-content.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-dark-shell.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-dark.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-light-content.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-light-shell.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-light.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-phousys-content.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-phousys-shell.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/css/pacem-phousys.min.css

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/js/azure-maps.d.ts

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/js/pacem-2d.d.ts

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/js/pacem-2d.js

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/js/pacem-2d.min.js

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */

package/dist/js/pacem-3d.d.ts

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */
@@ -385,7 +385,8 @@ declare namespace Pacem.Components.Drawing3D {
         disconnectedCallback(): void;
         get size(): Size;
         private _resizeHandler;
-        render(item?: Pacem.Drawing3D.Renderable, deepUpdate?: boolean): void;
+        render(item?: Pacem.Drawing3D.Renderable, deepUpdate?: boolean, now?: number): void;
+        private _doRender;
     }
 }
 declare namespace Pacem.Components.Drawing3D {
@@ -649,7 +650,17 @@ declare namespace Pacem.Drawing3D.WebGPU {
         static createIndexed(device: GPUDevice, data: Uint16Array, label?: string): GPUBuffer;
     }
     class BufferLayouts {
+        /**
+         * Create one {@link GPUVertexBufferLayout} at the provided {@param shaderLocation} having the spcified {@param size}.
+         * @param shaderLocation {Number} Shader location index.
+         * @param size {Number} Float32Array size (defaults to 3 assuming a flattened array of 3D vectors as the most common case).
+         */
         static createVertex(shaderLocation: number, size?: number): GPUVertexBufferLayout;
+        /**
+         * Create one {@link GPUVertexBufferLayout} having the first defined shaderLocation at the provided {@param shaderLocationStart} index and the offsets obeying to the spcified {@param sizes}.
+         * @param shaderLocationStart {Number} First shader location index.
+         * @param sizes {Array} Ordered Float32Array sizes.
+         */
         static createVertex(shaderLocationStart: number, ...sizes: number[]): GPUVertexBufferLayout;
     }
 }
@@ -768,7 +779,7 @@ declare namespace Pacem.Drawing3D.WebGPU {
         private static _memoizer;
         static dispose(ctx: Context): void;
         static createColorPicking(ctx: Context, items: RenderableBuffer[]): RenderPipeline | null;
-        static create(ctx: Context, items: RenderableBuffer[], pipelineOptions?: Partial<PipelineOptions>): RenderPipeline;
+        static create(ctx: Context, [mesh, camera, ...lights]: RenderableBuffer[], pipelineOptions?: Partial<PipelineOptions>): RenderPipeline;
     }
 }
 declare namespace Pacem.Drawing3D.WebGPU {
@@ -820,6 +831,7 @@ declare namespace Pacem.Components.Drawing3D {
         private _webGPUNotSupported;
         initialize(scene: Pacem3DElement): Promise<HTMLCanvasElement | null>;
         propertyChangedCallback(name: string, old: any, val: any, first?: boolean): void;
+        disconnectedCallback(): void;
         dispose(scene: Pacem3DElement): void;
         enableValidation: boolean;
         private _ensureRenderer;

package/dist/js/pacem-3d.js

@@ -1,5 +1,5 @@
 /**
- * pacem v0.51.2 (https://js.pacem.it)
+ * pacem v0.51.3-avaris (https://js.pacem.it)
  * Copyright 2025 Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */
@@ -825,13 +825,20 @@ var Pacem;
                         me.adapter.raycast(this, pixel, rect, callback);
                     };
                     this._resizeHandler = (evt) => {
-                        const size = this.#size = evt.detail; // { width: evt.detail.width, height: evt.detail.height };
+                        const oldSize = this.#size;
+                        const size = evt.detail;
+                        if (!Pacem.Utils.isNull(oldSize) && oldSize.height === size.height && oldSize.width === size.width) {
+                            return;
+                        }
+                        this.#size = size;
                         const adapter = this.adapter;
                         if (!Pacem.Utils.isNull(adapter)) {
                             this.adapter.invalidateSize(this, size);
                             this.dispatchEvent(new Components.ResizeEvent(size));
                         }
                     };
+                    this.#then = 0;
+                    this.#fps = 1000 / 60;
                     //#endregion
                 }
                 validate(item) {
@@ -962,6 +969,7 @@ var Pacem;
                     return false;
                 }
                 disconnectedCallback() {
+                    cancelAnimationFrame(this.#handle);
                     const resizer = this._resizer, container = this._container;
                     if (!Pacem.Utils.isNull(container)) {
                         container.removeEventListener('click', this._clickHandler, false);
@@ -975,12 +983,11 @@ var Pacem;
                     }
                     super.disconnectedCallback();
                 }
+                #size;
                 get size() {
                     return this.#size;
                 }
-                #size;
-                #handle;
-                render(item, deepUpdate) {
+                render(item, deepUpdate, now = performance.now()) {
                     if (!Pacem.Utils.isNull(item)) {
                         const adapter = this.adapter;
                         if (!Pacem.Utils.isNull(adapter)) {
@@ -988,17 +995,25 @@ var Pacem;
                         }
                     }
                     else {
-                        cancelAnimationFrame(this.#handle);
-                        if (!this.disabled && !Pacem.Utils.isNull(this.adapter)) {
-                            const scene = this.adapter.getScene(this);
-                            let cancelable = new CustomEvent('prerender', { detail: { scene }, cancelable: true });
-                            this.dispatchEvent(cancelable);
-                            if (!cancelable.defaultPrevented) {
-                                this.adapter.render(this);
-                                this.dispatchEvent(new CustomEvent('render', { detail: { scene } }));
-                            }
+                        this._doRender(this.#then);
+                    }
+                }
+                #handle;
+                #then;
+                #fps;
+                _doRender(t = 0) {
+                    this.#handle = requestAnimationFrame(t => this._doRender(t));
+                    const now = t, fps = this.#fps;
+                    const delta = now - this.#then;
+                    if (delta > fps && !this.disabled && !Pacem.Utils.isNull(this.adapter)) {
+                        this.#then = now - (delta % fps);
+                        const scene = this.adapter.getScene(this);
+                        let cancelable = new CustomEvent('prerender', { detail: { scene }, cancelable: true });
+                        this.dispatchEvent(cancelable);
+                        if (!cancelable.defaultPrevented) {
+                            this.adapter.render(this);
+                            this.dispatchEvent(new CustomEvent('render', { detail: { scene } }));
                         }
-                        this.#handle = requestAnimationFrame(() => this.render());
                     }
                 }
             };
@@ -2368,13 +2383,11 @@ var Pacem;
                     const lights = this.#lights;
                     const { hasTexture, shader } = data;
                     // TODO: consider backMap
-                    return `mesh-${shader}-${lights.map(l => l.type).join('-')}${(hasTexture ? '-map' : '-nomap')}`;
+                    //return `mesh-${shader}-${lights.map(l => l.type).join('-')}${(hasTexture ? '-map' : '-nomap')}`;
+                    return `mesh-${shader}${(hasTexture ? '-map' : '-nomap')}`;
                 }
                 bindgroup(type, key, index) {
                     const set = this.#bindgroups;
-                    if (!set.has(type)) {
-                        return null;
-                    }
                     const arr = set.get(type);
                     if (Pacem.Utils.isNull(arr)) {
                         return null;
@@ -2473,8 +2486,8 @@ var Pacem;
                 static { this._memoizer = new WeakMap(); }
                 static dispose(ctx) {
                     const memoizer = this._memoizer;
-                    if (memoizer.has(ctx)) {
-                        const cache = memoizer.get(ctx);
+                    const cache = memoizer.get(ctx);
+                    if (!Pacem.Utils.isNull(cache)) {
                         cache.clear();
                         memoizer.delete(ctx);
                     }
@@ -2488,16 +2501,16 @@ var Pacem;
                     }
                     return null;
                 }
-                static create(ctx, items, pipelineOptions) {
+                static create(ctx, [mesh, camera, ...lights], pipelineOptions) {
                     const memoizer = RenderPipeline._memoizer;
-                    if (!memoizer.has(ctx)) {
-                        memoizer.set(ctx, new Map());
+                    let cache = memoizer.get(ctx);
+                    if (Pacem.Utils.isNull(cache)) {
+                        memoizer.set(ctx, cache = new Map());
                     }
-                    const cache = memoizer.get(ctx);
-                    const camera = items.find(i => Drawing3D.isCamera(i.item));
-                    const lights = items.filter(i => Drawing3D.isLight(i.item));
-                    // find main object
-                    const mesh = items.find(i => Drawing3D.isMesh(i.item));
+                    //const camera = items.find(i => isCamera(i.item));
+                    //const lights = items.filter(i => isLight(i.item));
+                    //// find main object
+                    //const mesh = items.find(i => isMesh(i.item));
                     if (!Pacem.Utils.isNull(mesh)) {
                         const meshPipeline = new MeshRenderPipelineClass(ctx, mesh, camera, ...lights);
                         // cache peek for sudden return
@@ -2680,21 +2693,21 @@ var Pacem;
                     this.draw = (pass, ...buffers) => {
                         throw new Error('Deprecated.');
                     };
-                    this.frame = (pass, ...buffers) => {
-                        let meshBuffer, cameraBuffer, lightBuffers = [];
-                        for (let buffer of buffers) {
-                            if (Pacem.Utils.isNull(meshBuffer) && Drawing3D.isMesh(buffer.item)) {
-                                meshBuffer = buffer;
-                                continue;
-                            }
-                            if (Pacem.Utils.isNull(cameraBuffer) && Drawing3D.isCamera(buffer.item)) {
-                                cameraBuffer = buffer;
-                                continue;
-                            }
-                            if (Drawing3D.isLight(buffer.item)) {
-                                lightBuffers.push(buffer);
-                            }
-                        }
+                    this.frame = (pass, meshBuffer, cameraBuffer, ...lightBuffers) => {
+                        //let meshBuffer: RenderableBuffer, cameraBuffer: RenderableBuffer, lightBuffers: RenderableBuffer[] = [];
+                        //for (let buffer of buffers) {
+                        //    if (Utils.isNull(meshBuffer) && isMesh(buffer.item)) {
+                        //        meshBuffer = buffer;
+                        //        continue;
+                        //    }
+                        //    if (Utils.isNull(cameraBuffer) && isCamera(buffer.item)) {
+                        //        cameraBuffer = buffer;
+                        //        continue;
+                        //    }
+                        //    if (isLight(buffer.item)) {
+                        //        lightBuffers.push(buffer);
+                        //    }
+                        //}
                         // same pass
                         const samePass = pass === this.#previousPass;
                         if (!samePass) {
@@ -4020,7 +4033,7 @@ var Pacem;
                         if (validationScope) {
                             device.pushErrorScope('validation');
                         }
-                        const renderables = [mesh, camera].concat(lights);
+                        const renderables = [mesh, camera, ...lights];
                         const pipeline = WebGPU.RenderPipeline.create(context, renderables, { multisample: true });
                         // render
                         pipeline.frame(pass, ...renderables);
@@ -4077,24 +4090,27 @@ var Pacem;
                 _createOrYieldRenderable(item, geometries = this.#geometries, materials = this.#materials) {
                     item.stage ??= this.#stage;
                     const store = this.#renderables;
-                    if (!store.has(item)) {
-                        store.set(item, WebGPU.RenderableBuffer.create(item, geometries));
+                    let found = store.get(item);
+                    if (Pacem.Utils.isNull(found)) {
+                        store.set(item, found = WebGPU.RenderableBuffer.create(item, geometries));
                     }
-                    return store.get(item);
+                    return found;
                 }
                 _createOrYieldGeometry(item) {
                     const store = this.#geometries;
-                    if (!store.has(item)) {
-                        store.set(item, WebGPU.ManagedBuffer.create(item));
+                    let found = store.get(item);
+                    if (Pacem.Utils.isNull(found)) {
+                        store.set(item, found = WebGPU.ManagedBuffer.create(item));
                     }
-                    return store.get(item);
+                    return found;
                 }
                 _createOrYieldMaterial(item) {
                     const store = this.#materials;
-                    if (!store.has(item)) {
-                        store.set(item, WebGPU.ManagedBuffer.create(item));
+                    let found = store.get(item);
+                    if (Pacem.Utils.isNull(found)) {
+                        store.set(item, found = WebGPU.ManagedBuffer.create(item));
                     }
-                    return store.get(item);
+                    return found;
                 }
                 _unwrapBuffers(grp, accumulator) {
                     accumulator ??= { meshes: [], lights: [], cameras: [], groups: [] };
@@ -4117,8 +4133,7 @@ var Pacem;
                     return accumulator;
                 }
                 ;
-                update(...items) {
-                    const array = Array.from(items);
+                _update(array) {
                     const groupBuffers = [];
                     const meshBuffers = [];
                     const lightBuffers = [];
@@ -4164,6 +4179,10 @@ var Pacem;
                     }
                     this.#looper = new WebGPU.RenderLooper(accumulator);
                 }
+                update(...items) {
+                    const array = Array.from(items);
+                    this._update(array);
+                }
                 dispose() {
                     if (this._disposeContext()) {
                         const { device } = this.#context;
@@ -4269,6 +4288,14 @@ var Pacem;
                         }
                     }
                 }
+                disconnectedCallback() {
+                    const set = this.#renderers;
+                    for (let [_, renderer] of set) {
+                        renderer.dispose();
+                    }
+                    set.clear();
+                    super.disconnectedCallback();
+                }
                 dispose(scene) {
                     const renderers = this.#renderers;
                     if (renderers.has(scene)) {
@@ -4278,10 +4305,6 @@ var Pacem;
                 }
                 _ensureRenderer(scene) {
                     const set = this.#renderers;
-                    if (!set.has(scene)) {
-                        return null;
-                    }
-                    // renderer
                     return set.get(scene);
                 }
                 _updatePipeline(scene) {