babylon.quarks-editor 0.17.8 → 0.17.9

package/dist/core/loadEffectGallery.js

@@ -0,0 +1,97 @@
+import { EffectBinding } from './binding';
+import { disposeLoadedEffect, parseEffectFromJson } from './loadEffect';
+const YIELD_EVERY = 8;
+function yieldToBrowser() {
+    return new Promise((resolve) => requestAnimationFrame(() => resolve()));
+}
+/** Collects `.json` files from a folder picker result, sorted by relative path. */
+export function collectJsonFiles(files) {
+    const list = Array.from(files);
+    return list
+        .filter((file) => file.name.toLowerCase().endsWith('.json'))
+        .sort((a, b) => {
+        const pathA = a.webkitRelativePath || a.name;
+        const pathB = b.webkitRelativePath || b.name;
+        return pathA.localeCompare(pathB);
+    });
+}
+/**
+ * Parses every JSON effect into a hidden catalog — not registered with the renderer until the
+ * user drops the effect into the viewport.
+ */
+export async function loadEffectGallery(scene, files, catalogRoot, onProgress) {
+    const jsonFiles = collectJsonFiles(files);
+    const entries = [];
+    onProgress({ done: 0, total: jsonFiles.length, loaded: 0, failed: 0 });
+    for (let i = 0; i < jsonFiles.length; i++) {
+        const file = jsonFiles[i];
+        try {
+            const json = JSON.parse(await file.text());
+            const { root, systems } = parseEffectFromJson(scene, null, json, {
+                registerRenderer: false,
+                autoplay: false,
+            });
+            if (systems.length === 0) {
+                disposeLoadedEffect(root, systems, null, false);
+                continue;
+            }
+            const relPath = file.webkitRelativePath || file.name;
+            const label = file.name.replace(/\.json$/i, '');
+            if (!root.name || root.name === 'Effect' || root.name === 'Object3D') {
+                root.name = label;
+            }
+            root.parent = catalogRoot;
+            root.setEnabled(false);
+            entries.push({
+                name: label,
+                path: relPath.replace(/\\/g, '/'),
+                root,
+                systems,
+                inScene: false,
+            });
+        }
+        catch (err) {
+            console.warn(`[Quarks editor] Skipped "${file.name}":`, err);
+        }
+        onProgress({
+            done: i + 1,
+            total: jsonFiles.length,
+            loaded: entries.length,
+            failed: i + 1 - entries.length,
+        });
+        if ((i + 1) % YIELD_EVERY === 0) {
+            await yieldToBrowser();
+        }
+    }
+    return entries;
+}
+/** Builds an edit binding for one catalog entry without unloading the rest. */
+export function bindingFromGalleryEntry(entry) {
+    const main = entry.systems.find((s) => !s.onlyUsedByOther) ?? entry.systems[0];
+    return new EffectBinding(main, entry.systems.filter((s) => s !== main), entry.root);
+}
+/** Merges newly loaded catalog entries, skipping duplicate paths. */
+export function mergeGalleryEntries(existing, incoming, renderer) {
+    const paths = new Set(existing.map((entry) => entry.path));
+    const added = [];
+    let skipped = 0;
+    for (const entry of incoming) {
+        if (paths.has(entry.path)) {
+            disposeLoadedEffect(entry.root, entry.systems, renderer, false);
+            skipped++;
+            continue;
+        }
+        paths.add(entry.path);
+        added.push(entry);
+    }
+    return { merged: [...existing, ...added], added, skipped };
+}
+/** Disposes every catalog entry and the hidden catalog root. */
+export function disposeGallery(catalogRoot, entries, renderer) {
+    for (const entry of entries) {
+        disposeLoadedEffect(entry.root, entry.systems, renderer, entry.inScene);
+    }
+    if (catalogRoot && !catalogRoot.isDisposed()) {
+        catalogRoot.dispose(false, true);
+    }
+}

package/dist/core/material.d.ts

@@ -0,0 +1,13 @@
+import type { ParticleSystem } from 'babylon.quarks';
+export interface RendererMaterialPatch {
+    blendMode?: number;
+    transparent?: boolean;
+    depthTest?: boolean;
+    depthWrite?: boolean;
+    alphaTest?: number;
+    texture?: unknown;
+}
+/** Applies renderer material settings and keeps imported QuarksMaterial JSON in sync for export. */
+export declare function applyRendererMaterial(system: ParticleSystem, patch: RendererMaterialPatch): void;
+/** Human-readable label for an imported or live material reference. */
+export declare function getMaterialLabel(material: unknown): string | null;

package/dist/core/material.js

@@ -0,0 +1,68 @@
+function isEditableMaterialRecord(material) {
+    return !!material && typeof material === 'object' && !('getClassName' in material);
+}
+/** Applies renderer material settings and keeps imported QuarksMaterial JSON in sync for export. */
+export function applyRendererMaterial(system, patch) {
+    const settings = system.getRendererSettings();
+    if (patch.blendMode !== undefined) {
+        system.blending = patch.blendMode;
+    }
+    if (patch.transparent !== undefined) {
+        settings.materialTransparent = patch.transparent;
+    }
+    if (patch.depthTest !== undefined) {
+        settings.materialDepthTest = patch.depthTest;
+    }
+    if (patch.depthWrite !== undefined) {
+        settings.materialDepthWrite = patch.depthWrite;
+    }
+    if (patch.alphaTest !== undefined) {
+        settings.materialAlphaTest = patch.alphaTest;
+    }
+    if (patch.texture !== undefined) {
+        system.texture = patch.texture;
+    }
+    const material = system.material;
+    if (isEditableMaterialRecord(material)) {
+        if (patch.blendMode !== undefined) {
+            material.alphaMode = patch.blendMode;
+            material.blending = patch.blendMode;
+        }
+        if (patch.transparent !== undefined) {
+            material.transparent = patch.transparent;
+        }
+        if (patch.depthTest !== undefined) {
+            material.depthTest = patch.depthTest;
+        }
+        if (patch.depthWrite !== undefined) {
+            material.depthWrite = patch.depthWrite;
+        }
+        if (patch.alphaTest !== undefined) {
+            material.alphaTest = patch.alphaTest;
+        }
+        if (patch.texture !== undefined) {
+            material.texture = patch.texture;
+            material.map = patch.texture;
+        }
+    }
+    system.neededToUpdateRender = true;
+}
+/** Human-readable label for an imported or live material reference. */
+export function getMaterialLabel(material) {
+    if (!material) {
+        return null;
+    }
+    if (isEditableMaterialRecord(material)) {
+        const name = typeof material.name === 'string' ? material.name : null;
+        const type = typeof material.type === 'string' ? material.type : 'QuarksMaterial';
+        return name ? `${name} (${type})` : type;
+    }
+    const named = material;
+    if (named.name) {
+        return named.name;
+    }
+    if (typeof named.getClassName === 'function') {
+        return named.getClassName();
+    }
+    return 'Material';
+}

package/dist/core/pickGalleryFiles.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Opens a native folder picker when the host supports it. Returns `null` when the user
+ * cancels, or when the API is unavailable (caller should fall back to `<input webkitdirectory>`).
+ */
+export declare function pickGalleryJsonFiles(): Promise<File[] | null | undefined>;

package/dist/core/pickGalleryFiles.js

@@ -0,0 +1,42 @@
+import { collectJsonFiles } from './loadEffectGallery';
+/** Recursively collects `.json` files from a directory handle (File System Access API). */
+async function readJsonFilesFromDirectory(dir, prefix = '') {
+    const files = [];
+    for await (const [name, entry] of dir.entries()) {
+        if (entry.kind === 'file') {
+            if (!name.toLowerCase().endsWith('.json'))
+                continue;
+            const file = await entry.getFile();
+            Object.defineProperty(file, 'webkitRelativePath', {
+                value: prefix + name,
+                configurable: true,
+            });
+            files.push(file);
+            continue;
+        }
+        if (entry.kind === 'directory') {
+            files.push(...(await readJsonFilesFromDirectory(entry, `${prefix}${name}/`)));
+        }
+    }
+    return files;
+}
+/**
+ * Opens a native folder picker when the host supports it. Returns `null` when the user
+ * cancels, or when the API is unavailable (caller should fall back to `<input webkitdirectory>`).
+ */
+export async function pickGalleryJsonFiles() {
+    const picker = window.showDirectoryPicker;
+    if (typeof picker !== 'function') {
+        return undefined;
+    }
+    try {
+        const dir = (await picker.call(window, { mode: 'read' }));
+        return collectJsonFiles(await readJsonFilesFromDirectory(dir));
+    }
+    catch (err) {
+        if (err instanceof DOMException && err.name === 'AbortError') {
+            return null;
+        }
+        throw err;
+    }
+}

package/dist/core/playback.d.ts

@@ -0,0 +1,23 @@
+/** Stage transport + per-focus timeline state (decoupled from gallery preview set). */
+export interface PlaybackState {
+    /** When true, all in-scene preview effects simulate. */
+    stagePlaying: boolean;
+    focusRootId: number | null;
+    focusElapsedByRoot: Map<number, number>;
+    focusFinishedByRoot: Set<number>;
+    speed: number;
+    stepQueued: boolean;
+    scrubbing: boolean;
+}
+/** Default playback state for a new editor session. */
+export declare function createPlaybackState(): PlaybackState;
+/** Elapsed timeline time for one focused effect root. */
+export declare function getFocusElapsed(state: PlaybackState, rootId: number): number;
+/** Writes focus elapsed time (playhead position). */
+export declare function setFocusElapsed(state: PlaybackState, rootId: number, elapsed: number): void;
+/** Clears the parked-at-end flag after restart or scrub before the end. */
+export declare function clearFocusFinished(state: PlaybackState, rootId: number): void;
+/** Marks a one-shot focus effect as finished (playhead parked at duration). */
+export declare function markFocusFinished(state: PlaybackState, rootId: number): void;
+/** Whether a one-shot focus effect has reached the end of its timeline. */
+export declare function isFocusFinished(state: PlaybackState, rootId: number): boolean;

package/dist/core/playback.js

@@ -0,0 +1,32 @@
+/** Default playback state for a new editor session. */
+export function createPlaybackState() {
+    return {
+        stagePlaying: true,
+        focusRootId: null,
+        focusElapsedByRoot: new Map(),
+        focusFinishedByRoot: new Set(),
+        speed: 1,
+        stepQueued: false,
+        scrubbing: false,
+    };
+}
+/** Elapsed timeline time for one focused effect root. */
+export function getFocusElapsed(state, rootId) {
+    return state.focusElapsedByRoot.get(rootId) ?? 0;
+}
+/** Writes focus elapsed time (playhead position). */
+export function setFocusElapsed(state, rootId, elapsed) {
+    state.focusElapsedByRoot.set(rootId, elapsed);
+}
+/** Clears the parked-at-end flag after restart or scrub before the end. */
+export function clearFocusFinished(state, rootId) {
+    state.focusFinishedByRoot.delete(rootId);
+}
+/** Marks a one-shot focus effect as finished (playhead parked at duration). */
+export function markFocusFinished(state, rootId) {
+    state.focusFinishedByRoot.add(rootId);
+}
+/** Whether a one-shot focus effect has reached the end of its timeline. */
+export function isFocusFinished(state, rootId) {
+    return state.focusFinishedByRoot.has(rootId);
+}

package/dist/core/scrub.d.ts

@@ -1,5 +1,10 @@
 import type { BatchedRenderer } from 'babylon.quarks';
 import type { EffectBinding } from './binding';
+/**
+ * Scrub only the focused effect's systems — does not advance other preview effects
+ * via the shared BatchedRenderer.update loop.
+ */
+export declare function scrubFocusTo(binding: EffectBinding, time: number): void;
 /**
  * Approximate timeline scrub: replays every system from t=0 up to `time` using the existing
  * simulation loop. Not frame-exact (spawn/burst randomization is unseeded), but reuses

package/dist/core/scrub.js

@@ -1,4 +1,34 @@
 const WIDE_STEP_THRESHOLD = 8;
+function bindingSystems(binding) {
+    return [binding.system, ...binding.subSystems];
+}
+/**
+ * Scrub only the focused effect's systems — does not advance other preview effects
+ * via the shared BatchedRenderer.update loop.
+ */
+export function scrubFocusTo(binding, time) {
+    const systems = bindingSystems(binding);
+    for (const system of systems) {
+        system.restart();
+        system.play();
+    }
+    if (time <= 0) {
+        return;
+    }
+    const fixedStep = time > WIDE_STEP_THRESHOLD ? 1 / 30 : 1 / 60;
+    const steps = Math.floor(time / fixedStep);
+    for (let i = 0; i < steps; i++) {
+        for (const system of systems) {
+            system.update(fixedStep);
+        }
+    }
+    const remainder = time - steps * fixedStep;
+    if (remainder > 0) {
+        for (const system of systems) {
+            system.update(remainder);
+        }
+    }
+}
 /**
  * Approximate timeline scrub: replays every system from t=0 up to `time` using the existing
  * simulation loop. Not frame-exact (spawn/burst randomization is unseeded), but reuses

package/dist/core/timeline.d.ts

@@ -31,5 +31,7 @@ export declare function computeStartOffset(gen: ValueGenerator | FunctionValueGe
 };
 /** Flattens the effect's group/emitter tree into display rows, preserving tree-walk order. */
 export declare function computeTimelineRows(binding: EffectBinding): TimelineRow[];
-/** Overall timeline span: the furthest track extent (start offset + duration). */
+/**
+ * Overall timeline ruler span — emission window per track (`startOffset + duration`).
+ */
 export declare function computeTimelineSpan(rows: TimelineRow[]): number;

package/dist/core/timeline.js

@@ -58,13 +58,16 @@ export function computeTimelineRows(binding) {
     walk(binding.getTree());
     return rows;
 }
-/** Overall timeline span: the furthest track extent (start offset + duration). */
+/**
+ * Overall timeline ruler span — emission window per track (`startOffset + duration`).
+ */
 export function computeTimelineSpan(rows) {
     let span = 0;
     for (const row of rows) {
-        if (row.kind === 'track') {
-            span = Math.max(span, row.startOffset + row.duration);
+        if (row.kind !== 'track') {
+            continue;
         }
+        span = Math.max(span, row.startOffset + row.duration);
     }
     return Math.max(span, MIN_TIMELINE_SPAN);
 }

package/dist/core/transformStore.d.ts

@@ -0,0 +1,3 @@
+export declare function subscribeTransform(listener: () => void): () => void;
+export declare function getTransformRevision(): number;
+export declare function notifyTransformChanged(): void;

package/dist/core/transformStore.js

@@ -0,0 +1,16 @@
+/** Lightweight external store so gizmo drags refresh ObjectModule without re-rendering the whole host. */
+let revision = 0;
+const listeners = new Set();
+export function subscribeTransform(listener) {
+    listeners.add(listener);
+    return () => listeners.delete(listener);
+}
+export function getTransformRevision() {
+    return revision;
+}
+export function notifyTransformChanged() {
+    revision++;
+    for (const listener of listeners) {
+        listener();
+    }
+}

package/dist/core/viewportPicker.d.ts

@@ -0,0 +1,25 @@
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import type { Scene } from '@babylonjs/core/scene';
+import type { GalleryEntry } from './loadEffectGallery';
+/**
+ * Viewport pick/hover for in-scene gallery effect roots only (not child emitters).
+ * Hover uses the same ground ring as focus selection, in yellow.
+ */
+export declare class GalleryViewportPicker {
+    private readonly scene;
+    private readonly hoverMarker;
+    private readonly handles;
+    private hoveredRoot;
+    private syncKey;
+    constructor(scene: Scene);
+    /** Rebuilds root pick colliders when the gallery changes. */
+    sync(entries: GalleryEntry[], soloRoot: TransformNode | null, syncKey: string): void;
+    /** Yellow focus-style ring under the hovered effect root. */
+    setHover(effectRoot: TransformNode | null): void;
+    follow(): void;
+    /** Ray-picks an in-scene effect root from canvas coordinates. */
+    pick(clientX: number, clientY: number): TransformNode | null;
+    dispose(): void;
+    private createHandle;
+    private clearHandles;
+}

package/dist/core/viewportPicker.js

@@ -0,0 +1,86 @@
+import { MeshBuilder } from '@babylonjs/core/Meshes/meshBuilder';
+import { EDITOR_SCENE_NODE_METADATA } from './editorScene';
+import { GROUND_RING_RADIUS, GalleryHoverMarker } from './gallerySelectionMarker';
+/** Invisible pick proxy size — matches the ground ring footprint. */
+const PICK_DIAMETER = GROUND_RING_RADIUS * 2;
+/**
+ * Viewport pick/hover for in-scene gallery effect roots only (not child emitters).
+ * Hover uses the same ground ring as focus selection, in yellow.
+ */
+export class GalleryViewportPicker {
+    constructor(scene) {
+        this.handles = new Map();
+        this.hoveredRoot = null;
+        this.syncKey = '';
+        this.scene = scene;
+        this.hoverMarker = new GalleryHoverMarker(scene);
+    }
+    /** Rebuilds root pick colliders when the gallery changes. */
+    sync(entries, soloRoot, syncKey) {
+        if (syncKey === this.syncKey) {
+            return;
+        }
+        this.syncKey = syncKey;
+        this.clearHandles();
+        if (entries.length > 0) {
+            for (const entry of entries) {
+                if (!entry.inScene || entry.root.isDisposed()) {
+                    continue;
+                }
+                this.createHandle(entry.root);
+            }
+        }
+        else if (soloRoot && !soloRoot.isDisposed()) {
+            this.createHandle(soloRoot);
+        }
+        const hovered = this.hoveredRoot;
+        this.hoveredRoot = null;
+        this.setHover(hovered && !hovered.isDisposed() ? hovered : null);
+    }
+    /** Yellow focus-style ring under the hovered effect root. */
+    setHover(effectRoot) {
+        if (effectRoot === this.hoveredRoot) {
+            return;
+        }
+        this.hoveredRoot = effectRoot && !effectRoot.isDisposed() ? effectRoot : null;
+        if (!this.hoveredRoot) {
+            this.hoverMarker.hide();
+            return;
+        }
+        this.hoverMarker.show(this.hoveredRoot);
+    }
+    follow() {
+        this.hoverMarker.follow();
+    }
+    /** Ray-picks an in-scene effect root from canvas coordinates. */
+    pick(clientX, clientY) {
+        const canvas = this.scene.getEngine().getRenderingCanvas();
+        if (!canvas) {
+            return null;
+        }
+        const rect = canvas.getBoundingClientRect();
+        const pickInfo = this.scene.pick(clientX - rect.left, clientY - rect.top, (mesh) => !!mesh.metadata?.quarksEditorPick);
+        const meta = pickInfo?.pickedMesh?.metadata;
+        return meta?.quarksEditorPick ? meta.effectRoot : null;
+    }
+    dispose() {
+        this.clearHandles();
+        this.hoverMarker.dispose();
+    }
+    createHandle(effectRoot) {
+        const mesh = MeshBuilder.CreateSphere(`viewport-pick-root-${effectRoot.uniqueId}`, { diameter: PICK_DIAMETER, segments: 10 }, this.scene);
+        mesh.parent = effectRoot;
+        mesh.position.set(0, 0, 0);
+        mesh.isPickable = true;
+        mesh.visibility = 0;
+        const metadata = { quarksEditorPick: true, effectRoot };
+        mesh.metadata = { ...EDITOR_SCENE_NODE_METADATA, ...metadata };
+        this.handles.set(effectRoot.uniqueId, mesh);
+    }
+    clearHandles() {
+        for (const mesh of this.handles.values()) {
+            mesh.dispose();
+        }
+        this.handles.clear();
+    }
+}

package/dist/index.d.ts

@@ -12,4 +12,6 @@ export type { GradientStop } from './core/colors';
 export { SHAPE_TYPES, SHAPE_PARAM_KEYS, DEFAULT_SHAPE_PARAMS, getShapeType, readShapeParams, createShape, } from './core/shapes';
 export type { ShapeType, ShapeParams } from './core/shapes';
 export { GroundPlaneResolver, ensureGroundResolver } from './core/collision';
+export { applyRendererMaterial, getMaterialLabel } from './core/material';
+export type { RendererMaterialPatch } from './core/material';
 export { ensurePortableTextureUrl } from './core/textureExport';

package/dist/index.js

@@ -6,4 +6,5 @@ export { readScalar, buildScalar, sampleCurve, readPieces, buildCurve, splitPiec
 export { DEFAULT_GRADIENT_STOPS, buildGradient, buildColorOverLife, rgbaToVector4, stopToCss, stopsToCssGradient, hexToRgb, rgbToHex, findBehavior, } from './core/colors';
 export { SHAPE_TYPES, SHAPE_PARAM_KEYS, DEFAULT_SHAPE_PARAMS, getShapeType, readShapeParams, createShape, } from './core/shapes';
 export { GroundPlaneResolver, ensureGroundResolver } from './core/collision';
+export { applyRendererMaterial, getMaterialLabel } from './core/material';
 export { ensurePortableTextureUrl } from './core/textureExport';

package/dist/react/EffectEditor.js

@@ -28,8 +28,5 @@ export function EffectEditor(props) {
     }, [props.binding, activeSystem]);
     useSyncExternalStore((onStoreChange) => binding.subscribe(onStoreChange), () => binding.getRevision());
     const gizmoTargetIsEmitter = allSystems.some((s) => s.emitter === props.gizmoTargetNode);
-    if (!gizmoTargetIsEmitter) {
-        return (_jsx("div", { style: { fontFamily: theme.font, color: theme.text }, children: _jsx(ObjectModule, { node: props.gizmoTargetNode, label: props.gizmoTargetLabel }) }));
-    }
-    return (_jsxs("div", { style: { fontFamily: theme.font, color: theme.text }, children: [_jsx(ObjectModule, { node: props.gizmoTargetNode, label: props.gizmoTargetLabel }), _jsx(MainModule, { binding: binding }), _jsx(EmissionModule, { binding: binding }), _jsx(ShapeModule, { binding: binding }), _jsx(EmitDirectionModule, { binding: binding }), _jsx(VelocityOverLifeModule, { binding: binding }), _jsx(SpeedOverLifeModule, { binding: binding }), _jsx(LimitSpeedOverLifeModule, { binding: binding }), _jsx(InheritVelocityModule, { binding: binding }), _jsx(ForceOverLifeModule, { binding: binding }), _jsx(GravityModule, { binding: binding }), _jsx(OrbitOverLifeModule, { binding: binding }), _jsx(ColorOverLifeModule, { binding: binding }), _jsx(ColorBySpeedModule, { binding: binding }), _jsx(SizeOverLifeModule, { binding: binding }), _jsx(SizeBySpeedModule, { binding: binding }), _jsx(RotationOverLifeModule, { binding: binding }), _jsx(RotationBySpeedModule, { binding: binding }), _jsx(NoiseModule, { binding: binding }), _jsx(TurbulenceModule, { binding: binding }), _jsx(CollisionModule, { binding: binding }), _jsx(WidthOverTrailModule, { binding: binding }), _jsx(SubEmittersModule, { binding: binding, rootBinding: props.binding }), _jsx(TextureSheetModule, { binding: binding }), _jsx(RendererModule, { binding: binding, textureOptions: props.textureOptions, geometryOptions: props.geometryOptions, resolveTexture: props.resolveTexture, resolveGeometry: props.resolveGeometry })] }));
+    return (_jsxs("div", { style: { fontFamily: theme.font, color: theme.text }, children: [_jsx(ObjectModule, { node: props.gizmoTargetNode, label: props.gizmoTargetLabel }), !gizmoTargetIsEmitter && (_jsxs("div", { style: { fontSize: 11, color: theme.textDim, margin: '0 0 10px', lineHeight: 1.45 }, children: ["Modules below edit ", _jsx("strong", { children: activeSystem.emitter.name || 'particle system' }), ". Select its emitter in the timeline to move it with the gizmo."] })), _jsx(MainModule, { binding: binding }), _jsx(EmissionModule, { binding: binding }), _jsx(ShapeModule, { binding: binding }), _jsx(EmitDirectionModule, { binding: binding }), _jsx(VelocityOverLifeModule, { binding: binding }), _jsx(SpeedOverLifeModule, { binding: binding }), _jsx(LimitSpeedOverLifeModule, { binding: binding }), _jsx(InheritVelocityModule, { binding: binding }), _jsx(ForceOverLifeModule, { binding: binding }), _jsx(GravityModule, { binding: binding }), _jsx(OrbitOverLifeModule, { binding: binding }), _jsx(ColorOverLifeModule, { binding: binding }), _jsx(ColorBySpeedModule, { binding: binding }), _jsx(SizeOverLifeModule, { binding: binding }), _jsx(SizeBySpeedModule, { binding: binding }), _jsx(RotationOverLifeModule, { binding: binding }), _jsx(RotationBySpeedModule, { binding: binding }), _jsx(NoiseModule, { binding: binding }), _jsx(TurbulenceModule, { binding: binding }), _jsx(CollisionModule, { binding: binding }), _jsx(WidthOverTrailModule, { binding: binding }), _jsx(SubEmittersModule, { binding: binding, rootBinding: props.binding }), _jsx(TextureSheetModule, { binding: binding }), _jsx(RendererModule, { binding: binding, textureOptions: props.textureOptions, geometryOptions: props.geometryOptions, resolveTexture: props.resolveTexture, resolveGeometry: props.resolveGeometry })] }));
 }

package/dist/react/EffectEditorHost.d.ts

@@ -10,6 +10,8 @@ export interface EffectEditorHostHandle {
     scene: Scene;
     renderer: BatchedRenderer;
     importJson: (json: unknown) => void;
+    /** Loads many JSON effects at once and appends them to the gallery catalog. */
+    importGallery: (files: FileList | File[]) => Promise<void>;
     exportJson: () => string;
 }
 export interface EffectEditorHostProps {
@@ -26,6 +28,11 @@ export interface EffectEditorHostProps {
     resolveTexture?: (url: string, scene: Scene) => unknown;
     /** Host loader for the Mesh "Load from file…" option (e.g. GLB via @babylonjs/loaders). */
     resolveGeometry?: (file: File, scene: Scene) => Promise<GeometryData>;
+    /** Optional link rendered in the viewport's top-left corner (e.g. back to a host gallery page). */
+    backLink?: {
+        href: string;
+        label: string;
+    };
 }
 /**
  * Self-contained effect editor: live Babylon preview + hierarchy/inspector sidebar.