babylon.quarks-editor 0.26.0 → 0.27.0

package/CHANGELOG.md

@@ -4,6 +4,69 @@ All notable changes to the `babylon.quarks-editor` package are documented here.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and the project follows the `quarks.core` 0.x version line.
 
+## [0.27.0] — 2026-10-23
+
+A 0.27.0 dated 2026-10-21 was prepared but never published; its entries are folded in here.
+
+### Added
+
+- Main module: "Warm-up time", shown while Prewarm is on, the seconds of the cycle simulated
+  before the first frame (`prewarmTime`; 0 warms up a whole cycle).
+- **The Renderer module reaches the 0.25–0.26 texture features.** Map layout (UV channel,
+  tiling, offset, scroll), Flip, a Gradient map section (ramp and channel), an Erosion section
+  (mask with its own layout, softness, edge width and colour) and a UV distortion section (noise
+  with its layout, strength). The ramp, mask and noise are picked the way the texture is: from
+  the host's presets, a URL or a file.
+- Renderer: a swept trail's side axis. A host geometry
+  (`GeometryOption`, `resolveGeometry`) may carry a second UV set, `uvs2`, which mesh particles
+  read on UV channel 1; the demo's glTF loader passes `TEXCOORD_1` through.
+- Main: Scaling mode for world-space systems (shape only, or the hierarchy's motion too).
+- Texture Sheet Animation: time mode (lifetime or FPS), FPS, loop or hold, random frame, cycles,
+  frame count and a random start frame.
+- Attractor module: a point gravity (`GravityForce`) with its centre and strength.
+- Emitter shape wireframes for the Box and Edge shapes: the box outline with its +Z emit
+  direction, and the edge line with its +Y emit direction.
+- `TextureSelect` and `TextureUVField` components, exported from `babylon.quarks-editor/react`.
+- Renderer module, trails: "Tessellation" and "Curve tension".
+
+### Changed
+
+- Renderer, trails: "Texture mode" (stretch, distribute per segment, tile, repeat per segment),
+  "Texture scale", "Min vertex distance" and "Trail time", each left unset at its default so the
+  JSON stays sparse. The "Head width scale" row is gone: it wrote a `headWidthScale` field no
+  runtime read (the head's width comes from the Width over Trail module).
+- **`TimelinePanelProps` and `TransportBarProps` take `RefObject<HTMLElement | null>` refs**, the
+  type `useRef<HTMLElement>(null)` returns, now that the editor compiles with `strict`. Code that
+  passed the old type still compiles.
+
+### Fixed
+
+- An imported effect whose images were inlined from the picked files is saved with those inlined
+  images; `serializeEffect` writes a texture's source path only while the texture still shows the
+  image it was loaded with, and an inlined image has no path. A test covers import → scene → save.
+- **Saving lost mesh nodes and texture settings.** The editor now saves through `serializeEffect`:
+  mesh nodes keep their geometry (so mesh surface emitters still emit after a save and reload),
+  and textures keep their wrap, sampling, repeat, offset and rotation. Textures with no url a file
+  can point at are reported instead of written as an empty entry.
+- The yellow hover ring stayed on the ground after the hovered effect was removed from the scene.
+- **Node ESM and webpack 5 could not import the package.** `dist` was compiled with relative and
+  `@babylonjs` deep imports that had no file extension. Every import now ends in `.js`.
+- The `babylon.quarks` peer range was `>=0.17.0`, but the editor needs current APIs (beam mode,
+  rim fade, culling and sort settings). It is now `~0.27.0`.
+
+### Internal
+
+- Jest tests now cover the whole editor core (`src/core`): systems, material, timeline, scrub,
+  playback and transport, groups, collision, effect tree, assets and asset tree, scene entries,
+  gallery layout, playback, markers and picker, emitter shape wireframes, texture export and the
+  IndexedDB project store. The coverage threshold for the editor is raised to match.
+- Editor tests resolve `babylon.quarks` to its sources, so they pick up library changes made in
+  the same branch without rebuilding it.
+- React modules are tested in jsdom through the DOM, and the whole `EffectEditor` is mounted in
+  every render mode.
+- The README leads with `QuarksEffectEditor.Show`, lists every peer and every module, and the
+  `EffectEditor` snippet carries all of its props.
+
 ## [0.26.0] — 2026-10-21
 
 ### Added

package/README.md

@@ -7,11 +7,30 @@ Shuriken-style effect editor for [babylon.quarks](https://www.npmjs.com/package/
 ## Install
 
 ```bash
-npm install babylon.quarks-editor babylon.quarks @babylonjs/core react @heroicons/react @tanstack/react-virtual
+npm install babylon.quarks-editor babylon.quarks @babylonjs/core @babylonjs/materials react react-dom @heroicons/react @tanstack/react-virtual
 ```
 
 ## Usage
 
+The supported embed is the host: it owns the scene, the timeline, undo/redo, playback and the
+module inspector, and mounts into any element.
+
+```ts
+import {Texture} from '@babylonjs/core/Materials/Textures/texture';
+import {QuarksEffectEditor} from 'babylon.quarks-editor/react';
+
+const editor = QuarksEffectEditor.Show({
+    hostElement: document.getElementById('editor')!,
+    effectJson, // optional: a Quarks JSON export to open; a default effect otherwise
+    textureOptions: [{label: 'Glow', url: '/textures/glow.png'}],
+    resolveTexture: (url, scene) => new Texture(url, scene),
+    onSave: (json) => save(json), // the effect as Quarks JSON, round-trips through QuarksLoader
+});
+editor.dispose();
+```
+
+The module inspector on its own, for a host that already has a scene and a selection:
+
 ```tsx
 import {EffectBinding, EffectHistory} from 'babylon.quarks-editor';
 import {EffectEditor} from 'babylon.quarks-editor/react';
@@ -20,13 +39,25 @@ const binding = new EffectBinding(particleSystem); // your babylon.quarks Partic
 const history = new EffectHistory();
 history.attach(binding);
 
-<EffectEditor binding={binding} />;
+<EffectEditor
+    binding={binding}
+    selectedSystem={binding.system}
+    gizmoTargetNode={binding.system.emitter}
+    gizmoTargetLabel={binding.system.emitter.name}
+/>;
 
 // Serialize to Quarks JSON (round-trips through QuarksLoader):
 const json = binding.exportJSON('MyEffect');
 ```
 
-Modules: Main, Emission (bursts), Shape (7 emitter types), Speed/Limit Speed/Force/Rotation over Lifetime, Gravity, Color over Lifetime (gradient), Size over Lifetime (curve), Noise, Sub Emitters, Texture Sheet Animation, Renderer. Multi-system hierarchy with add/remove/rename, undo/redo via `EffectHistory`.
+Modules, in Unity's order: Main, Emission (rate over time and distance, bursts), Shape (cone,
+sphere, hemisphere, circle, donut, rectangle, grid, box, edge, mesh surface, point), Randomize
+Direction, Velocity / Speed / Limit Speed / Force over Lifetime, Inherit Velocity, Gravity,
+Attractor, Orbit over Lifetime, Color over Lifetime and by Speed, Size over Lifetime and by Speed,
+Rotation over Lifetime (2D and 3D) and by Speed, Noise, Turbulence, Collision, Width over Trail,
+Sub Emitters, Texture Sheet Animation, Sequences, Renderer (render modes incl. trail, mesh and
+beam; material, texture layout, flip, gradient map, erosion, UV distortion, soft particles, sorting).
+Multi-system hierarchy with add/remove/rename, undo/redo via `EffectHistory`.
 
 The `.` export is UI-free (edit model, serialization, value/shape/gradient helpers) — usable headless. The `./react` export ships the components; React is a peer dependency, so the same UI can mount in a standalone page or inside a [BabylonJS Editor](https://github.com/BabylonJS/Editor) plugin.
 
@@ -39,9 +70,11 @@ an opinion on your CDN, asset pipeline, or loader (`@babylonjs/loaders`, your ow
   "Load from file…" in the Renderer module) into whatever object you assign as `system.texture`.
 - `resolveGeometry(file) => Promise<GeometryData>` — turns a picked file (from "Load from file…"
   in the Mesh render mode's geometry dropdown) into vertex buffers: `{positions, indices?, uvs?,
-normals?}` (typed arrays or plain number arrays).
+uvs2?, normals?}` (typed arrays or plain number arrays; `uvs2` is the second UV set textures on
+  UV channel 1 read).
 - `textureOptions?: {label, url}[]` / `geometryOptions?: {label, positions, indices?, uvs?,
-normals?}[]` — preset lists shown alongside "Custom URL…" / "Load from file…".
+uvs2?, normals?}[]` — preset lists shown alongside "Custom URL…" / "Load from file…". The texture
+  presets also serve the gradient map's ramp, the erosion mask and the distortion noise.
 
 **Signature differs by entry point** — a common source of "works in the demo, throws in my
 host" bugs:

package/dist/core/assetDragSession.d.ts

@@ -1,4 +1,4 @@
-import type { AssetDragPayload } from './assetTree';
+import type { AssetDragPayload } from './assetTree.js';
 /** Stores the current asset drag payload for viewport preview (getData is drop-only in most browsers). */
 export declare function setAssetDragSession(payload: AssetDragPayload | null): void;
 export declare function getAssetDragSession(): AssetDragPayload | null;

package/dist/core/assetTree.d.ts

@@ -1,4 +1,4 @@
-import type { EffectAsset } from './assets';
+import type { EffectAsset } from './assets.js';
 export interface AssetTreeFolder {
     kind: 'folder';
     name: string;

package/dist/core/binding.d.ts

@@ -1,6 +1,6 @@
-import type { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import type { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 import type { ParticleSystem } from 'babylon.quarks';
-import type { EffectTreeNode } from './effectTree';
+import type { EffectTreeNode } from './effectTree.js';
 export type EditorListener = () => void;
 /**
  * Headless edit-model over a live ParticleSystem: mutate through apply() so every

package/dist/core/binding.js

@@ -1,4 +1,4 @@
-import { buildEffectTree, serializeEffectTree } from './effectTree';
+import { buildEffectTree, serializeEffectTree } from './effectTree.js';
 /**
  * Headless edit-model over a live ParticleSystem: mutate through apply() so every
  * change notifies subscribers (React UI, save indicators, hosts like BabylonJS Editor).

package/dist/core/defaultEffect.d.ts

@@ -1,6 +1,6 @@
-import type { Scene } from '@babylonjs/core/scene';
+import type { Scene } from '@babylonjs/core/scene.js';
 import { ParticleSystem } from 'babylon.quarks';
-import { type SceneEntry } from './sceneEntries';
+import { type SceneEntry } from './sceneEntries.js';
 export interface CreateSceneDefaultOptions {
     resolveTexture?: (url: string, scene: Scene) => unknown;
     textureUrl?: string;

package/dist/core/defaultEffect.js

@@ -1,7 +1,7 @@
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 import { ColorOverLife, ConeEmitter, ConstantColor, ConstantValue, IntervalValue, ParticleSystem, RenderMode, Vector4, } from 'babylon.quarks';
-import { DEFAULT_GRADIENT_STOPS, buildGradient } from './colors';
-import { uniqueEntryName } from './sceneEntries';
+import { DEFAULT_GRADIENT_STOPS, buildGradient } from './colors.js';
+import { uniqueEntryName } from './sceneEntries.js';
 /** Creates a simple cone burst preset for new editor effects. */
 export function createDefaultEffect(scene, resolveTexture, textureUrl) {
     const system = new ParticleSystem({

package/dist/core/editorScene.d.ts

@@ -1,4 +1,4 @@
-import type { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import type { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 /** Marks meshes/nodes created only for editor interaction or overlays (not part of the effect). */
 export declare const EDITOR_SCENE_NODE_METADATA: {
     quarksEditorSceneNode: true;

package/dist/core/effectTree.d.ts

@@ -1,4 +1,4 @@
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 import type { ParticleSystem } from 'babylon.quarks';
 /** A node in the editor's effect hierarchy: a Group (organizational) or a ParticleEmitter. */
 export interface EffectTreeNode {

package/dist/core/effectTree.js

@@ -1,7 +1,6 @@
-import { Matrix, Quaternion } from '@babylonjs/core/Maths/math.vector';
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import { ParticleEmitter } from 'babylon.quarks';
-import { isEditorSceneNode } from './editorScene';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
+import { ParticleEmitter, serializeEffect } from 'babylon.quarks';
+import { isEditorSceneNode } from './editorScene.js';
 /** Walks a loaded root TransformNode into the editor tree (groups + emitters). */
 export function buildEffectTree(root, depth = 0) {
     const system = root instanceof ParticleEmitter ? root.system : undefined;
@@ -31,100 +30,26 @@ export function collectSystems(tree) {
     walk(tree);
     return out;
 }
-function localMatrix(node) {
-    const rotation = node.rotationQuaternion ?? Quaternion.FromEulerVector(node.rotation);
-    return Matrix.Compose(node.scaling, rotation, node.position).asArray().slice();
-}
-function serializeNode(tree, meta, fallbackUuid) {
-    // Emitter nodes must serialize with the ParticleEmitter's own `.uuid` — that is exactly
-    // what EmitSubParticleSystem.toJSON writes as its target reference, so the two match and
-    // QuarksLoader.linkReferences can re-resolve sub-emitters on reimport.
-    const uuid = tree.system
-        ? tree.node.uuid
-        : (tree.node._quarksUUID ?? fallbackUuid);
-    const children = tree.children.map((child, i) => serializeNode(child, meta, `${fallbackUuid}-${i}`));
-    const base = {
-        uuid,
-        name: tree.name,
-        layers: 1,
-        matrix: localMatrix(tree.node),
-        children: children.length > 0 ? children : undefined,
-    };
-    if (tree.system) {
-        return {
-            ...base,
-            type: 'ParticleEmitter',
-            ps: tree.system.toJSON(meta, { useUrlForImage: true }),
-        };
-    }
-    return { ...base, type: 'Group' };
+/** Writes the effect under `roots`, leaving out the editor's own helper nodes. */
+function serialize(roots, name) {
+    const json = serializeEffect(roots, {
+        name,
+        generator: 'babylon.quarks-editor',
+        filter: (node) => !isEditorSceneNode(node),
+    });
+    return JSON.stringify(json, null, 2);
 }
 /**
  * Serializes an effect tree into the Quarks JSON envelope understood by QuarksLoader,
  * preserving the group/emitter hierarchy (not flattened).
  */
 export function serializeEffectTree(root, name = 'effect') {
-    const meta = { textures: {}, materials: {}, geometries: {} };
-    const object = serializeNode(buildEffectTree(root), meta, `${name}-node`);
-    return finishEnvelope(object, meta);
+    return serialize(root, name);
 }
 /**
  * Serializes several effect roots as children of a synthetic group — used when an effect
  * spans multiple top-level trees (e.g. a demo running several loaded effects at once).
  */
 export function serializeEffectForest(roots, name = 'effect') {
-    if (roots.length === 1) {
-        return serializeEffectTree(roots[0], name);
-    }
-    const meta = { textures: {}, materials: {}, geometries: {} };
-    const children = roots.map((root, i) => serializeNode(buildEffectTree(root), meta, `${name}-node-${i}`));
-    const object = {
-        uuid: `${name}-root`,
-        name,
-        type: 'Group',
-        layers: 1,
-        matrix: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
-        children,
-    };
-    return finishEnvelope(object, meta);
-}
-/** Flattens accumulated meta and wraps the serialized object into the Quarks envelope. */
-function finishEnvelope(object, meta) {
-    // toJSON stashes live Texture instances and material records in meta; flatten them into
-    // the serializable images/textures/materials arrays QuarksLoader expects.
-    const images = [];
-    const textures = [];
-    for (const [uuid, tex] of Object.entries(meta.textures)) {
-        const url = tex?.url ?? tex?.name;
-        const invertY = typeof tex?.invertY === 'boolean' ? tex.invertY : undefined;
-        const isEnvAtlas = tex?.name === 'quarksEnvAtlas' || (typeof tex?.name === 'string' && tex.name.endsWith('_envAtlas'));
-        if (url) {
-            const imageUuid = `${uuid}-image`;
-            images.push({ uuid: imageUuid, url });
-            const entry = {
-                uuid,
-                image: imageUuid,
-            };
-            if (invertY === false || isEnvAtlas) {
-                entry.invertY = false;
-                entry.noMipmap = true;
-            }
-            textures.push(entry);
-        }
-        else {
-            textures.push({ uuid });
-        }
-    }
-    const materials = Object.values(meta.materials).map((material) => {
-        const { sourceMaterial: _sourceMaterial, ...serializable } = material;
-        return serializable;
-    });
-    return JSON.stringify({
-        metadata: { version: 4.5, type: 'Object3D', generator: 'babylon.quarks-editor' },
-        geometries: Object.values(meta.geometries),
-        materials,
-        textures,
-        images,
-        object,
-    }, null, 2);
+    return serialize(roots.length === 1 ? roots[0] : roots, name);
 }

package/dist/core/emitterShapeWireframe.d.ts

@@ -1,6 +1,6 @@
-import type { Scene } from '@babylonjs/core/scene';
+import type { Scene } from '@babylonjs/core/scene.js';
 import type { ParticleSystem } from 'babylon.quarks';
-import './lineShaders';
+import './lineShaders.js';
 /**
  * Optional wireframe overlays for every emitter shape in the current effect.
  * Geometry follows quarks.core spawn math (local XY spawn plane, +Z emit axis).

package/dist/core/emitterShapeWireframe.js

@@ -1,10 +1,10 @@
-import { Color3 } from '@babylonjs/core/Maths/math.color';
-import { Vector3 } from '@babylonjs/core/Maths/math.vector';
-import { MeshBuilder } from '@babylonjs/core/Meshes/meshBuilder';
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import { EDITOR_SCENE_NODE_METADATA } from './editorScene';
-import './lineShaders';
-import { getShapeType, readShapeParams } from './shapes';
+import { Color3 } from '@babylonjs/core/Maths/math.color.js';
+import { Vector3 } from '@babylonjs/core/Maths/math.vector.js';
+import { MeshBuilder } from '@babylonjs/core/Meshes/meshBuilder.js';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
+import { EDITOR_SCENE_NODE_METADATA } from './editorScene.js';
+import './lineShaders.js';
+import { getShapeType, readShapeParams } from './shapes.js';
 const LINE_COLOR = new Color3(0.45, 0.82, 1);
 const DIRECTION_COLOR = new Color3(0.75, 0.92, 1);
 /**
@@ -204,6 +204,38 @@ function buildEmitterWireframe(system, scene) {
             }
             break;
         }
+        case 'box': {
+            // Spawn anywhere in the box (volume), on its faces (shell) or along its edges;
+            // velocity straight +Z, like Unity's Box shape.
+            const halfW = params.width / 2;
+            const halfH = params.height / 2;
+            const halfD = params.depth / 2;
+            lines('wf-box-front', xyRect(params.width, params.height, halfD));
+            lines('wf-box-back', xyRect(params.width, params.height, -halfD));
+            const corners = [
+                [-halfW, -halfH],
+                [halfW, -halfH],
+                [halfW, halfH],
+                [-halfW, halfH],
+            ];
+            corners.forEach(([x, y], i) => {
+                lines(`wf-box-side-${i}`, [new Vector3(x, y, -halfD), new Vector3(x, y, halfD)]);
+            });
+            const ray = Math.max(halfD * 2, 0.25);
+            lines('wf-box-dir', [new Vector3(0, 0, halfD), new Vector3(0, 0, halfD + ray)], DIRECTION_COLOR);
+            break;
+        }
+        case 'edge': {
+            // Spawn on a line along X of half-length `radius`; velocity straight +Y.
+            const radius = Math.max(params.radius, 0.001);
+            lines('wf-edge', [new Vector3(-radius, 0, 0), new Vector3(radius, 0, 0)]);
+            const ray = Math.max(radius * 0.5, 0.25);
+            for (let i = 0; i <= 4; i++) {
+                const x = -radius + (i / 4) * radius * 2;
+                lines(`wf-edge-ray-${i}`, [new Vector3(x, 0, 0), new Vector3(x, ray, 0)], DIRECTION_COLOR);
+            }
+            break;
+        }
         case 'mesh_surface': {
             const source = params.mesh;
             if (source && !source.isDisposed()) {
@@ -305,15 +337,15 @@ function xyArc(radius, arc, segments = 48, z = 0) {
 function arcPoint(radius, theta, z = 0) {
     return new Vector3(Math.cos(theta) * radius, Math.sin(theta) * radius, z);
 }
-function xyRect(width, height) {
+function xyRect(width, height, z = 0) {
     const halfW = width / 2;
     const halfH = height / 2;
     return [
-        new Vector3(-halfW, -halfH, 0),
-        new Vector3(halfW, -halfH, 0),
-        new Vector3(halfW, halfH, 0),
-        new Vector3(-halfW, halfH, 0),
-        new Vector3(-halfW, -halfH, 0),
+        new Vector3(-halfW, -halfH, z),
+        new Vector3(halfW, -halfH, z),
+        new Vector3(halfW, halfH, z),
+        new Vector3(-halfW, halfH, z),
+        new Vector3(-halfW, -halfH, z),
     ];
 }
 function clampArc(arc) {

package/dist/core/galleryDropMarker.d.ts

@@ -1,5 +1,5 @@
-import { Vector3 } from '@babylonjs/core/Maths/math.vector';
-import type { Scene } from '@babylonjs/core/scene';
+import { Vector3 } from '@babylonjs/core/Maths/math.vector.js';
+import type { Scene } from '@babylonjs/core/scene.js';
 /** Ground decal shown while dragging gallery items over the viewport. */
 export declare class GalleryDropMarker {
     private readonly root;

package/dist/core/galleryDropMarker.js

@@ -1,9 +1,9 @@
-import { StandardMaterial } from '@babylonjs/core/Materials/standardMaterial';
-import { Color3 } from '@babylonjs/core/Maths/math.color';
-import { Mesh } from '@babylonjs/core/Meshes/mesh';
-import { MeshBuilder } from '@babylonjs/core/Meshes/meshBuilder';
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import { DEFAULT_GALLERY_SPACING, gallerySpan } from './galleryLayout';
+import { StandardMaterial } from '@babylonjs/core/Materials/standardMaterial.js';
+import { Color3 } from '@babylonjs/core/Maths/math.color.js';
+import { Mesh } from '@babylonjs/core/Meshes/mesh.js';
+import { MeshBuilder } from '@babylonjs/core/Meshes/meshBuilder.js';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
+import { DEFAULT_GALLERY_SPACING, gallerySpan } from './galleryLayout.js';
 /** Ground decal shown while dragging gallery items over the viewport. */
 export class GalleryDropMarker {
     constructor(scene) {

package/dist/core/galleryLayout.d.ts

@@ -1,6 +1,6 @@
-import type { ArcRotateCamera } from '@babylonjs/core/Cameras/arcRotateCamera';
-import type { Mesh } from '@babylonjs/core/Meshes/mesh';
-import type { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import type { ArcRotateCamera } from '@babylonjs/core/Cameras/arcRotateCamera.js';
+import type { Mesh } from '@babylonjs/core/Meshes/mesh.js';
+import type { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 /** Default gap between neighbouring effects in a folder gallery import. */
 export declare const DEFAULT_GALLERY_SPACING = 4;
 /** Square-grid column count for `count` items. */

package/dist/core/galleryLayout.js

@@ -1,4 +1,4 @@
-import { Vector3 } from '@babylonjs/core/Maths/math.vector';
+import { Vector3 } from '@babylonjs/core/Maths/math.vector.js';
 /** Default gap between neighbouring effects in a folder gallery import. */
 export const DEFAULT_GALLERY_SPACING = 4;
 /** Square-grid column count for `count` items. */

package/dist/core/galleryPlayback.d.ts

@@ -1,4 +1,4 @@
-import type { SceneEntry } from './sceneEntries';
+import type { SceneEntry } from './sceneEntries.js';
 /** Freezes every scene entry; unpauses the visible ones (the preview set) when transport is playing. */
 export declare function applyGalleryPlayback(entries: SceneEntry[], previewRootIds: ReadonlySet<number>, transportPlaying: boolean, focusFinishedRootIds?: ReadonlySet<number>): void;
 /** Whether any preview effect on stage should keep simulating. */

package/dist/core/galleryScene.d.ts

@@ -1,8 +1,8 @@
-import '@babylonjs/core/Culling/ray';
-import { Vector3 } from '@babylonjs/core/Maths/math.vector';
-import type { Scene } from '@babylonjs/core/scene';
+import '@babylonjs/core/Culling/ray.js';
+import { Vector3 } from '@babylonjs/core/Maths/math.vector.js';
+import type { Scene } from '@babylonjs/core/scene.js';
 import type { BatchedRenderer } from 'babylon.quarks';
-import type { SceneEntry } from './sceneEntries';
+import type { SceneEntry } from './sceneEntries.js';
 /** Clears live particles and freezes simulation for one scene entry. */
 export declare function clearSceneEntrySimulation(entry: SceneEntry, renderer: BatchedRenderer): void;
 /**

package/dist/core/galleryScene.js

@@ -1,6 +1,6 @@
-import '@babylonjs/core/Culling/ray';
-import { Vector3 } from '@babylonjs/core/Maths/math.vector';
-import { DEFAULT_GALLERY_SPACING, galleryGridPosition } from './galleryLayout';
+import '@babylonjs/core/Culling/ray.js';
+import { Vector3 } from '@babylonjs/core/Maths/math.vector.js';
+import { DEFAULT_GALLERY_SPACING, galleryGridPosition } from './galleryLayout.js';
 /** Clears live particles and freezes simulation for one scene entry. */
 export function clearSceneEntrySimulation(entry, renderer) {
     for (const system of entry.systems) {

package/dist/core/gallerySelectionMarker.d.ts

@@ -1,7 +1,7 @@
-import { Color3 } from '@babylonjs/core/Maths/math.color';
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import type { Scene } from '@babylonjs/core/scene';
-import './lineShaders';
+import { Color3 } from '@babylonjs/core/Maths/math.color.js';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
+import type { Scene } from '@babylonjs/core/scene.js';
+import './lineShaders.js';
 export declare const GROUND_RING_RADIUS = 1.2;
 /** Flat ground ring that tracks a transform on the XZ plane. */
 declare class GroundRingMarker {

package/dist/core/gallerySelectionMarker.js

@@ -1,8 +1,8 @@
-import { Color3 } from '@babylonjs/core/Maths/math.color';
-import { Vector3 } from '@babylonjs/core/Maths/math.vector';
-import { MeshBuilder } from '@babylonjs/core/Meshes/meshBuilder';
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import './lineShaders';
+import { Color3 } from '@babylonjs/core/Maths/math.color.js';
+import { Vector3 } from '@babylonjs/core/Maths/math.vector.js';
+import { MeshBuilder } from '@babylonjs/core/Meshes/meshBuilder.js';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
+import './lineShaders.js';
 export const GROUND_RING_RADIUS = 1.2;
 const RING_SEGMENTS = 64;
 const RING_Y = 0.03;

package/dist/core/groups.d.ts

@@ -1,4 +1,4 @@
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 /**
  * Groups the given nodes under a new organizational TransformNode. Each node's world
  * transform is preserved via `setParent` — grouping never moves anything visually, it only

package/dist/core/groups.js

@@ -1,4 +1,4 @@
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 /**
  * Groups the given nodes under a new organizational TransformNode. Each node's world
  * transform is preserved via `setParent` — grouping never moves anything visually, it only

package/dist/core/history.d.ts

@@ -1,4 +1,4 @@
-import type { EffectBinding } from './binding';
+import type { EffectBinding } from './binding.js';
 /** Undo/redo stacks of one effect, kept by the host while another effect is focused. */
 export interface HistoryStacks {
     undo: string[];

package/dist/core/indexedDbProjectStore.d.ts

@@ -1,4 +1,4 @@
-import type { ProjectMeta, ProjectStore, StorageEstimate, StoredAsset, StoredScene } from './projectStore';
+import type { ProjectMeta, ProjectStore, StorageEstimate, StoredAsset, StoredScene } from './projectStore.js';
 /**
  * Projects in the browser's IndexedDB. Texture data URIs are pulled out of the effect JSON into
  * a per-project file store keyed by content hash — 50 effects sharing a texture store it once —

package/dist/core/lineShaders.d.ts

@@ -1,2 +1,2 @@
-import '@babylonjs/core/Shaders/color.fragment';
-import '@babylonjs/core/Shaders/color.vertex';
+import '@babylonjs/core/Shaders/color.fragment.js';
+import '@babylonjs/core/Shaders/color.vertex.js';

package/dist/core/lineShaders.js

@@ -3,5 +3,5 @@
 // Babylon never looks, it falls back to fetching `src/Shaders/color.fragment.fx`, gets the
 // page's HTML back and the selection rings never render. Registering the shader up front, from
 // the same module graph as the rest of the editor, makes the lookup succeed either way.
-import '@babylonjs/core/Shaders/color.fragment';
-import '@babylonjs/core/Shaders/color.vertex';
+import '@babylonjs/core/Shaders/color.fragment.js';
+import '@babylonjs/core/Shaders/color.vertex.js';

package/dist/core/loadEffect.d.ts

@@ -1,5 +1,5 @@
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import type { Scene } from '@babylonjs/core/scene';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
+import type { Scene } from '@babylonjs/core/scene.js';
 import type { BatchedRenderer, ParticleSystem } from 'babylon.quarks';
 export interface LoadEffectOptions {
     /** Registers systems with the batched renderer (default true). */

package/dist/core/loadEffect.js

@@ -1,4 +1,4 @@
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
 import { ParticleEmitter, QuarksLoader, QuarksUtil } from 'babylon.quarks';
 /** `ParticleEmitter`'s constructor default (see babylon.quarks/src/ParticleEmitter.ts) — the
  * name every emitter gets when the source JSON didn't give it one of its own. */

package/dist/core/pickAssetFiles.js

@@ -1,4 +1,4 @@
-import { isAssetImportFile, relativePathOf } from './assets';
+import { isAssetImportFile, relativePathOf } from './assets.js';
 /**
  * Recursively collects effect `.json` files and the image files they may reference from a
  * directory handle (File System Access API).

package/dist/core/sceneEntries.d.ts

@@ -1,8 +1,8 @@
-import type { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import type { Scene } from '@babylonjs/core/scene';
+import type { TransformNode } from '@babylonjs/core/Meshes/transformNode.js';
+import type { Scene } from '@babylonjs/core/scene.js';
 import type { BatchedRenderer, ParticleSystem } from 'babylon.quarks';
-import type { EffectAsset } from './assets';
-import { EffectBinding } from './binding';
+import type { EffectAsset } from './assets.js';
+import { EffectBinding } from './binding.js';
 /**
  * One effect instance placed in the scene. Every instance is live (its systems are registered
  * with the renderer) and independent: dropping the same asset three times gives three entries

package/dist/core/sceneEntries.js

@@ -1,6 +1,6 @@
 import { QuarksUtil } from 'babylon.quarks';
-import { EffectBinding } from './binding';
-import { disposeLoadedEffect, parseEffectFromJson } from './loadEffect';
+import { EffectBinding } from './binding.js';
+import { disposeLoadedEffect, parseEffectFromJson } from './loadEffect.js';
 /** `name`, or `name (2)`, `name (3)`… when an entry already uses it. */
 export function uniqueEntryName(name, existing) {
     const taken = new Set(existing.map((entry) => entry.name));