@ntalmagor/3drize-viewer 0.1.26 → 0.1.27

package/dist/components/Bubbles.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
-import type { CreatedObjectSettings } from '@ntalmagor/3drize-core';
+import type { BubblesConfig } from '@ntalmagor/3drize-core';
 export interface BubblesProps {
-    settings: CreatedObjectSettings;
+    config: BubblesConfig;
+    boundingRadius?: number;
 }
 declare const Bubbles: React.FC<BubblesProps>;
 export default Bubbles;

package/dist/components/Bubbles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Bubbles.d.ts","sourceRoot":"","sources":["../../src/components/Bubbles.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAG1D,OAAO,KAAK,EAAiB,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAKnF,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,qBAAqB,CAAC;CACjC;AAED,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA8GnC,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Bubbles.d.ts","sourceRoot":"","sources":["../../src/components/Bubbles.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAG1D,OAAO,KAAK,EAAE,aAAa,EAAyB,MAAM,wBAAwB,CAAC;AAKnF,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,aAAa,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA8GnC,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/Bubbles.js

@@ -4,8 +4,7 @@ import { useFrame } from '@react-three/fiber';
 import * as THREE from 'three';
 import { BubblesPointsMaterial } from '@ntalmagor/3drize-core';
 const MAX_BUBBLES = 256;
-const Bubbles = ({ settings }) => {
-    const config = settings.config;
+const Bubbles = ({ config }) => {
     const positions = useMemo(() => new Float32Array(MAX_BUBBLES * 3), []);
     const velocities = useMemo(() => new Float32Array(MAX_BUBBLES * 3), []);
     const ages = useMemo(() => new Float32Array(MAX_BUBBLES), []);
@@ -99,7 +98,7 @@ const Bubbles = ({ settings }) => {
         geometry.attributes.aBaseSize.needsUpdate = true;
         geometry.attributes.aPhase.needsUpdate = true;
     });
-    if (!settings.meshSettings.visible)
+    if (!config.enabled)
         return null;
     return _jsx("points", { geometry: geometry, material: material, frustumCulled: false });
 };

package/dist/components/Corona.d.ts

@@ -0,0 +1,26 @@
+import * as THREE from "three";
+/**
+ * <Corona />
+ * The halo: an inverted (BackSide) sphere shell driven by SunCoronaMaterial,
+ * additively blended. The shell scale is kept in sync with the material's
+ * u_shellScale so the falloff math stays correct at any size.
+ *
+ * Note: additive blending — reads best against a dark scene background.
+ */
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            sunCoronaMaterial: any;
+        }
+    }
+}
+export type CoronaProps = {
+    /** Radius of the core this corona surrounds. Default 1. */
+    radius?: number;
+    /** Shell size relative to the core. Default 1.25. Synced with u_shellScale. */
+    shellScale?: number;
+    /** Uniform overrides for SunCoronaMaterial (u_intensity, u_innerColor, ...). */
+    uniforms?: Record<string, number | THREE.Vector3 | number[]>;
+};
+export default function Corona({ radius, shellScale, uniforms }: CoronaProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Corona.d.ts.map

package/dist/components/Corona.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Corona.d.ts","sourceRoot":"","sources":["../../src/components/Corona.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;;;;;GAOG;AAEH,OAAO,CAAC,MAAM,CAAC;IAEb,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,iBAAiB,EAAE,GAAG,CAAC;SACxB;KACF;CACF;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,2DAA2D;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,+EAA+E;IAC/E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,KAAK,CAAC,OAAO,GAAG,MAAM,EAAE,CAAC,CAAC;CAC9D,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,MAAU,EACV,UAAiB,EACjB,QAAQ,EACT,EAAE,WAAW,2CAsBb"}

package/dist/components/Corona.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as THREE from "three";
+import { useRef } from "react";
+import { useFrame } from "@react-three/fiber";
+export default function Corona({ radius = 1, shellScale = 1.25, uniforms }) {
+    const matRef = useRef(null);
+    useFrame((_, delta) => {
+        if (matRef.current)
+            matRef.current.u_time += delta;
+    });
+    return (_jsxs("mesh", { scale: radius * shellScale, children: [_jsx("sphereGeometry", { args: [1, 64, 64] }), _jsx("coronaMaterial", { ref: matRef, u_shellScale: shellScale, side: THREE.BackSide, transparent: true, depthWrite: false, blending: THREE.AdditiveBlending, ...uniforms })] }));
+}

package/dist/components/CustomPrimitive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CustomPrimitive.d.ts","sourceRoot":"","sources":["../../src/components/CustomPrimitive.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAEjE,OAAO,EAAoB,KAAK,qBAAqB,EAKzC,MAAM,wBAAwB,CAAC;AAI3C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAMjC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAOrD,UAAU,oBAAoB;IAC5B,aAAa,EAAE,qBAAqB,CAAC;IACrC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,KAAK,IAAI,CAAC;IACvE,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;CAClH;AAED,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAgFlD,CAAC;AAIH,eAAe,eAAe,CAAC"}
+{"version":3,"file":"CustomPrimitive.d.ts","sourceRoot":"","sources":["../../src/components/CustomPrimitive.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAEvD,OAAO,EAEL,KAAK,qBAAqB,EAE3B,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAQ,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGrD,UAAU,oBAAoB;IAC5B,aAAa,EAAE,qBAAqB,CAAC;IACrC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,KAAK,IAAI,CAAC;IACvE,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;CAClH;AAED,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAiFlD,CAAC;AAIH,eAAe,eAAe,CAAC"}

package/dist/components/CustomPrimitive.js

@@ -1,53 +1,59 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useRef, memo } from "react";
-import { ObjectManager } from "@ntalmagor/3drize-core";
+import { useRef, useEffect, memo } from "react";
+import { createMeshByType, ObjectManager, } from "@ntalmagor/3drize-core";
+import { Mesh } from "three";
 import MaterialLibrary from "./MaterialLibrary.js";
 const CustomPrimitive = memo(({ createdObject, onObjectReady, handleObjectClick, }) => {
-    // const { handleObjectClick } = useSceneClick();
-    // console.log("Rendering CustomPrimitive with settings:", createdObject.name, createdObject);
     const meshRef = useRef(null);
-    // const effectStateRef = useRef<EffectState | null>(null);
-    // const [animatedTransform, setAnimatedTransform] = React.useState<AnimatedTransform>({
-    //   position: createdObject.meshSettings.position,
-    //   rotation: createdObject.meshSettings.rotation,
-    //   scale: createdObject.meshSettings.scale,
-    // });
-    // Initialize transform controls
-    // const { handlePointerEnter, handlePointerLeave, hovered } = useFrameEffects(true);
-    // useEffect(() => {
-    //   setAnimatedTransform({
-    //     position: createdObject.meshSettings.position,
-    //     rotation: createdObject.meshSettings.rotation,
-    //     scale: createdObject.meshSettings.scale,
-    //   });
-    // }, [createdObject.meshSettings.position, createdObject.meshSettings.rotation, createdObject.meshSettings.scale]);
+    useEffect(() => {
+        if (createdObject.type !== 'mesh')
+            return;
+        const managedObject = ObjectManager.getObject(createdObject.id);
+        if (!managedObject || !(managedObject.object instanceof Mesh))
+            return;
+        const targetMesh = managedObject.object;
+        const meshType = createdObject.config?.type || managedObject.object.userData?.type || 'box';
+        const meshData = {
+            position: [targetMesh.position.x, targetMesh.position.y, targetMesh.position.z],
+            rotation: [targetMesh.rotation.x, targetMesh.rotation.y, targetMesh.rotation.z],
+            scale: [targetMesh.scale.x, targetMesh.scale.y, targetMesh.scale.z],
+            visible: targetMesh.visible,
+            name: targetMesh.name || createdObject.name,
+            ...createdObject.config,
+            type: meshType,
+            id: createdObject.id,
+        };
+        const generated = createMeshByType(meshData);
+        if (!generated)
+            return;
+        if (targetMesh.geometry !== generated.mesh.geometry) {
+            targetMesh.geometry?.dispose();
+            targetMesh.geometry = generated.mesh.geometry;
+        }
+        targetMesh.userData = {
+            ...targetMesh.userData,
+            type: meshType,
+            id: createdObject.id,
+            options: generated.config,
+        };
+        if (generated.mesh.material && generated.mesh.material !== targetMesh.material) {
+            if (Array.isArray(generated.mesh.material)) {
+                generated.mesh.material.forEach((m) => m.dispose());
+            }
+            else {
+                generated.mesh.material.dispose();
+            }
+        }
+    }, [
+        createdObject.config,
+    ]);
     const useDreiMaterials = createdObject.materialSettings.materialType === "advanced";
-    // const apply3driseMaterials = !useDreiMaterials;
-    // const willApplyMaterial = apply3driseMaterials && !!createdObject.materialSettings.materialVariant;
-    // const [materialReady, setMaterialReady] = useState(!willApplyMaterial);
-    // get initial object from ObjectManager to add to scene with primitive, then use findById to get updated reference with materials applied by useMaterialApplication
     const obj = ObjectManager.getObject(createdObject.id);
-    // const object = findById(createdObject.id);
-    // useMaterialApplication(object ?? null, createdObject.materialSettings, apply3driseMaterials, () => setMaterialReady(true));
     if (!obj) {
         // console.warn(`CustomPrimitive - Object with ID ${createdObject.id} not found.`);
         return null;
     }
-    return (
-    // <Select enabled={isSelected}>
-    // <CreatedObject createdObject={createdObject}
-    //   shouldApply3driseMaterial={false}  // Material is owned by useMaterialApplication above (applied to obj.object directly)
-    //   handleObjectClick={handleObjectClick}
-    //   onObjectReady={(object, ref) => {
-    //     onObjectReady && onObjectReady(object, ref);
-    //   }}
-    // >
-    _jsx("primitive", { ref: meshRef, name: obj.name, object: obj.object, visible: createdObject.meshSettings.visible, position: [0, 0, 0], rotation: [0, 0, 0], scale: [1, 1, 1], children: useDreiMaterials && createdObject.type === 'mesh' && createdObject.meshSettings.visible && (_jsx(MaterialLibrary, { materialSettings: createdObject.materialSettings })) }, obj.id)
-    // {/* <LineEdges object={obj.object} />
-    // <MeshEdges object={obj.object} /> */}
-    // </CreatedObject>
-    // {/* </Select> */}
-    );
+    return (_jsx("primitive", { ref: meshRef, name: obj.name, object: obj.object, visible: createdObject.meshSettings.visible, position: [0, 0, 0], rotation: [0, 0, 0], scale: [1, 1, 1], children: useDreiMaterials && createdObject.type === 'mesh' && createdObject.meshSettings.visible && (_jsx(MaterialLibrary, { materialSettings: createdObject.materialSettings })) }, obj.id));
 });
 CustomPrimitive.displayName = 'CustomPrimitive';
 export default CustomPrimitive;

package/dist/components/Earth.d.ts

@@ -1,18 +1,8 @@
 import React from 'react';
 import * as THREE from 'three';
-export interface EarthProps {
-    sunPosition?: [number, number, number];
-    position?: [number, number, number];
-    scale?: number;
-    radius?: number;
-    segments?: number;
-    enableRotation?: boolean;
-    rotationSpeed?: number;
-    visible?: boolean;
-    atmosphereDayColor?: THREE.ColorRepresentation;
-    atmosphereTwilightColor?: THREE.ColorRepresentation;
+import { EarthConfig } from '@ntalmagor/3drize-core';
+declare const Earth: React.FC<EarthConfig & {
     onMeshReady?: (mesh: THREE.Mesh) => void;
-}
-declare const Earth: React.FC<EarthProps>;
+}>;
 export default Earth;
 //# sourceMappingURL=Earth.d.ts.map

package/dist/components/Earth.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Earth.d.ts","sourceRoot":"","sources":["../../src/components/Earth.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AACvE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,MAAM,WAAW,UAAU;IACzB,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kBAAkB,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC;IAC/C,uBAAuB,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC;IACpD,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC;CAC1C;AAED,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAkF/B,CAAC;AAGF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Earth.d.ts","sourceRoot":"","sources":["../../src/components/Earth.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AACvE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAA0C,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAQ7F,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,GAAG;IAAE,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,KAAK,IAAI,CAAA;CAAE,CA0E/E,CAAC;AAGF,eAAe,KAAK,CAAC"}

package/dist/components/Earth.js

@@ -1,16 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef, useMemo, useCallback, useEffect } from 'react';
 import * as THREE from 'three';
-import { useFrame } from '@react-three/fiber';
 import { useTexture } from '@react-three/drei';
-const EARTH_CDN_BASE = 'https://3d-rise.sfo3.cdn.digitaloceanspaces.com/app/images/earth';
-const EARTH_DAY_URL = `${EARTH_CDN_BASE}/earth_day_4096.jpg`;
-const EARTH_NIGHT_URL = `${EARTH_CDN_BASE}/earth_night_4096.jpg`;
-const EARTH_BUMP_ROUGHNESS_CLOUDS_URL = `${EARTH_CDN_BASE}/earth_bump_roughness_clouds_4096.jpg`;
-const Earth = ({ sunPosition = [0, 0, 3], position = [0, 0, 0], scale = 1, radius = 1, segments = 64, enableRotation = true, rotationSpeed = 0.025, visible = true, atmosphereDayColor = '#4db2ff', atmosphereTwilightColor = '#bc490b', onMeshReady, }) => {
+const CDN = 'https://3d-rise.sfo3.cdn.digitaloceanspaces.com/app/images/planets';
+const EARTH_DAY_URL = `${CDN}/earth_day_4096.jpg`;
+const EARTH_NIGHT_URL = `${CDN}/earth_night_4096.jpg`;
+const EARTH_BUMP_ROUGHNESS_CLOUDS_URL = `${CDN}/earth_bump_roughness_clouds_4096.jpg`;
+const Earth = ({ sunPosition = [0, 0, 3], atmosphereDayColor = '#4db2ff', atmosphereTwilightColor = '#bc490b', radius = 1, onMeshReady, }) => {
     const globeRef = useRef(null);
     const globeMatRef = useRef(null);
     const atmosphereMatRef = useRef(null);
+    const segments = 64;
     const [dayMap, nightMap, bumpRoughnessClouds] = useTexture([
         EARTH_DAY_URL,
         EARTH_NIGHT_URL,
@@ -32,12 +32,7 @@ const Earth = ({ sunPosition = [0, 0, 3], position = [0, 0, 0], scale = 1, radiu
             onMeshReady?.(mesh);
         }
     }, [onMeshReady]);
-    useFrame((_, delta) => {
-        if (enableRotation && globeRef.current) {
-            globeRef.current.rotation.y += delta * rotationSpeed;
-        }
-    });
-    return (_jsxs("group", { position: position, scale: scale, visible: visible, userData: { id: '3drise-earth' }, children: [_jsxs("mesh", { ref: handleGlobeRef, children: [_jsx("sphereGeometry", { args: [radius, segments, segments] }), _jsx("earthMaterial", { ref: globeMatRef, uDayMap: dayMap, uNightMap: nightMap, uBumpRoughnessClouds: bumpRoughnessClouds, uSunDirection: sunDirection, uAtmosphereDayColor: dayColor, uAtmosphereTwilightColor: twilightColor })] }), _jsxs("mesh", { scale: 1.04, children: [_jsx("sphereGeometry", { args: [radius, segments, segments] }), _jsx("earthAtmosphereMaterial", { ref: atmosphereMatRef, transparent: true, side: THREE.BackSide, depthWrite: false, uSunDirection: sunDirection, uAtmosphereDayColor: dayColor, uAtmosphereTwilightColor: twilightColor })] })] }));
+    return (_jsxs("group", { userData: { id: '3drise-earth' }, children: [_jsxs("mesh", { ref: handleGlobeRef, children: [_jsx("sphereGeometry", { args: [radius, segments, segments] }), _jsx("earthMaterial", { ref: globeMatRef, uDayMap: dayMap, uNightMap: nightMap, uBumpRoughnessClouds: bumpRoughnessClouds, uSunDirection: sunDirection, uAtmosphereDayColor: dayColor, uAtmosphereTwilightColor: twilightColor })] }), _jsxs("mesh", { scale: 1.04, children: [_jsx("sphereGeometry", { args: [radius, segments, segments] }), _jsx("earthAtmosphereMaterial", { ref: atmosphereMatRef, transparent: true, side: THREE.BackSide, depthWrite: false, uSunDirection: sunDirection, uAtmosphereDayColor: dayColor, uAtmosphereTwilightColor: twilightColor })] })] }));
 };
 Earth.displayName = 'Earth';
 export default Earth;

package/dist/components/EffectsGenerator.d.ts

@@ -3,7 +3,7 @@ import { Object3D } from 'three';
 import type { GenerativeEffectSettings } from '@ntalmagor/3drize-core';
 export interface EffectsGeneratorProps {
     settings: GenerativeEffectSettings;
-    object?: Object3D;
+    object?: Object3D | null;
 }
 declare const EffectsGenerator: React.FC<EffectsGeneratorProps>;
 export default EffectsGenerator;

package/dist/components/EffectsGenerator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EffectsGenerator.d.ts","sourceRoot":"","sources":["../../src/components/EffectsGenerator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAgB,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAsBvE,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,wBAAwB,CAAC;IACnC,MAAM,CAAC,EAAE,QAAQ,CAAC;CACnB;AAED,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAoCrD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"EffectsGenerator.d.ts","sourceRoot":"","sources":["../../src/components/EffectsGenerator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAgB,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AA0BvE,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,wBAAwB,CAAC;IACnC,MAAM,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;CAC1B;AAED,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAwCrD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/EffectsGenerator.js

@@ -12,7 +12,6 @@ import DnaHelixEffect from './effects/DnaHelixEffect.js';
 import OrbEffect from './effects/OrbEffect.js';
 import LightningEffect from './effects/LightningEffect.js';
 import AuroraEffect from './effects/AuroraEffect.js';
-import FireEffect from './effects/FireEffect.js';
 import ForcefieldEffect from './effects/ForcefieldEffect.js';
 import NeuralNetworkEffect from './effects/NeuralNetworkEffect.js';
 import BlackHoleEffect from './effects/BlackHoleEffect.js';
@@ -20,6 +19,11 @@ import IceCrystalsEffect from './effects/IceCrystalsEffect.js';
 import SmokePlumeEffect from './effects/SmokePlumeEffect.js';
 import VolumetricFogEffect from './effects/VolumetricFogEffect.js';
 import SmokeRingEffect from './effects/SmokeRingEffect.js';
+import Flares from './Flares.js';
+import SparklesBurst from './SparklesBurst.js';
+import Bubbles from './Bubbles.js';
+import Glyphs from './Glyphs.js';
+import Fire from './effects/Fire.js';
 const EffectsGenerator = ({ settings, object }) => {
     if (!settings.enabled)
         return null;
@@ -45,7 +49,6 @@ const EffectsGenerator = ({ settings, object }) => {
         case 'orb': return _jsx(OrbEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
         case 'lightning': return _jsx(LightningEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
         case 'aurora': return _jsx(AuroraEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
-        case 'fire': return _jsx(FireEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
         case 'forcefield': return _jsx(ForcefieldEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
         case 'neuralNetwork': return _jsx(NeuralNetworkEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
         case 'blackHole': return _jsx(BlackHoleEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
@@ -53,6 +56,11 @@ const EffectsGenerator = ({ settings, object }) => {
         case 'smokePlume': return _jsx(SmokePlumeEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
         case 'volumetricFog': return _jsx(VolumetricFogEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
         case 'smokeRing': return _jsx(SmokeRingEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'fire': return _jsx(Fire, { hostRef: object, config: config, animations: animations });
+        case 'flares': return _jsx(Flares, { hostRef: object, config: config, animations: animations });
+        case 'sparklesBurst': return _jsx(SparklesBurst, { boundingRadius: boundingRadius, config: config });
+        case 'bubbles': return _jsx(Bubbles, { boundingRadius: boundingRadius, config: config });
+        case 'glyphs': return _jsx(Glyphs, { boundingRadius: boundingRadius, config: config });
         default: return null;
     }
 };

package/dist/components/EffectsGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EffectsGroup.d.ts","sourceRoot":"","sources":["../../src/components/EffectsGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAyB,KAAK,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAG3F,UAAU,iBAAiB;IACzB,aAAa,EAAE,qBAAqB,CAAC;CACtC;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAU7C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"EffectsGroup.d.ts","sourceRoot":"","sources":["../../src/components/EffectsGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAyB,KAAK,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAI3F,UAAU,iBAAiB;IACzB,aAAa,EAAE,qBAAqB,CAAC;CACtC;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAW7C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/EffectsGroup.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { GEREATIVE_EFFECTS_KEY } from '@ntalmagor/3drize-core';
 import EffectsGenerator from './EffectsGenerator.js';
+import { findById } from '../utils/sceneQuery.js';
 const EffectsGroup = ({ createdObject }) => {
     if (!createdObject.effects || createdObject.effects.length === 0)
         return null;
-    return (_jsx("group", { name: `${createdObject.id}-effects`, userData: { [GEREATIVE_EFFECTS_KEY]: true }, children: createdObject.effects.map((effect, index) => (_jsx(EffectsGenerator, { settings: effect }, index))) }));
+    const object = findById(createdObject.id);
+    return (_jsx("group", { name: `${createdObject.id}-effects`, userData: { [GEREATIVE_EFFECTS_KEY]: true }, children: createdObject.effects.map((effect, index) => (_jsx(EffectsGenerator, { settings: effect, object: object }, index))) }));
 };
 export default EffectsGroup;

package/dist/components/Flares.d.ts

@@ -0,0 +1,64 @@
+import { Vector3, Object3D } from "three";
+import { AnimationOptions, FlaresConfig } from "@ntalmagor/3drize-core";
+/**
+ * <Flares />
+ * Explosive energy bursts.
+ *
+ * TWO MODES, controlled by the `hostRef` prop:
+ *
+ * hostRef = false (default) — PLANE MODE
+ *   Renders a camera-facing billboard plane with bursts erupting from a
+ *   circular limb (radius 1 in plane units). Auto-fits to the enclosing
+ *   object's bounding sphere if there is one; otherwise size it with
+ *   `radius`. Zero extra cost. Ideal for spheres / round bodies (the Sun).
+ *
+ *     <mesh>
+ *       <sphereGeometry />
+ *       <Flares />
+ *     </mesh>
+ *
+ * hostRef = true — SILHOUETTE MODE
+ *   Treats the enclosing object as the host: each frame the host is
+ *   rendered as a mask into a render target and the shader roots the
+ *   bursts on the host's ACTUAL screen silhouette, whatever its shape.
+ *   Costs one extra (cheap) render pass of the host per frame.
+ *
+ *     <primitive object={gltf.scene}>
+ *       <Flares hostRef fitKey={gltf.scene} />
+ *     </primitive>
+ *
+ * shooting = true — CENTER BURSTS
+ *   The same bursts, rooted at the plane center instead of the limb,
+ *   firing outward from the source. Overrides plane/silhouette rooting.
+ *   Renders over the host (depth test off) so the rays stay visible.
+ *
+ *     <Flares shooting />
+ *
+ * Shared behavior:
+ * - Auto-fits to the enclosing object's bounding sphere (`radius` to
+ *   override, `fitKey` to re-fit after async loads, `padding` to tighten).
+ * - World-space billboarding: correct under rotated/scaled ancestors.
+ * - Additive blending — reads best against a dark scene background.
+ */
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            flareMaterial: any;
+        }
+    }
+}
+export type FlaresProps = {
+    /**
+     * true  -> silhouette mode: bursts root on the enclosing object's actual
+     *          screen silhouette (mask render pass).
+     * false -> plane mode: circular limb billboard (default).
+     */
+    hostRef?: Object3D | null;
+    /** Root the bursts at the center (shooting from source) instead of the limb. */
+    config: FlaresConfig;
+    /** Uniform overrides for FlareMaterial (u_frequency, u_reach, ...). */
+    uniforms?: Record<string, number | Vector3 | number[]>;
+    animations?: AnimationOptions[];
+};
+export default function Flares({ hostRef, config, uniforms, animations }: FlaresProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Flares.d.ts.map

package/dist/components/Flares.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flares.d.ts","sourceRoot":"","sources":["../../src/components/Flares.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,OAAO,EAAqC,QAAQ,EAAwB,MAAM,OAAO,CAAC;AAC5F,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAGxE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AAEH,OAAO,CAAC,MAAM,CAAC;IAEb,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,aAAa,EAAE,GAAG,CAAC;SACpB;KACF;CACF;AAED,MAAM,MAAM,WAAW,GAAG;IACxB;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAC1B,gFAAgF;IAChF,MAAM,EAAE,YAAY,CAAA;IACpB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,EAAE,CAAC,CAAC;IACvD,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;CACjC,CAAC;AAUF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,OAAO,EACP,MAAM,EACN,QAAQ,EACR,UAAU,EACX,EAAE,WAAW,2CAyJb"}

package/dist/components/Flares.js

@@ -0,0 +1,134 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef } from "react";
+import { useFrame, useThree } from "@react-three/fiber";
+import { WebGLRenderTarget, MeshBasicMaterial, AdditiveBlending, Box3, Sphere, Vector3, Vector2, Quaternion, Color, Object3D } from "three";
+const tmpBox = new Box3();
+const tmpSphere = new Sphere();
+const tmpVec = new Vector3();
+const tmpVec2 = new Vector2();
+const tmpQuat = new Quaternion();
+const tmpRight = new Vector3();
+const tmpColor = new Color();
+export default function Flares({ hostRef, config, uniforms, animations }) {
+    const { gl, scene } = useThree();
+    const anchorRef = useRef(null);
+    const meshRef = useRef(null);
+    const matRef = useRef(null);
+    const { radius, padding = 1.2, fitKey, shooting, maskResolution = 512, maskLayer = 31 } = config;
+    const maskTarget = useMemo(() => hostRef
+        ? new WebGLRenderTarget(maskResolution, maskResolution, {
+            depthBuffer: true,
+            stencilBuffer: false,
+            samples: 4 // MSAA mask (WebGL2) -> smooth silhouette edges
+        })
+        : null, [hostRef, maskResolution]);
+    const maskMaterial = useMemo(() => new MeshBasicMaterial({ color: 0xffffff }), []);
+    useEffect(() => () => maskTarget?.dispose(), [maskTarget]);
+    // Fit the billboard to the host object + tag the host for the mask pass.
+    useEffect(() => {
+        const anchor = anchorRef.current;
+        const mesh = meshRef.current;
+        if (!anchor || !mesh)
+            return;
+        const host = hostRef && hostRef instanceof Object3D ? hostRef : anchor;
+        // Silhouette mode: tag every host node (except us) with the mask layer.
+        if (hostRef && host) {
+            host.traverse((o) => o.layers.enable(maskLayer));
+            anchor.traverse((o) => o.layers.disable(maskLayer));
+        }
+        if (radius !== undefined) {
+            anchor.position.set(0, 0, 0);
+            mesh.scale.setScalar(radius * padding);
+            return;
+        }
+        if (!host)
+            return;
+        // Bounding box of every sibling except ourselves (world space).
+        tmpBox.makeEmpty();
+        let hasGeometry = false;
+        for (const child of host.children) {
+            if (child === anchor)
+                continue;
+            const childBox = new Box3().setFromObject(child);
+            if (!childBox.isEmpty()) {
+                tmpBox.union(childBox);
+                hasGeometry = true;
+            }
+        }
+        // Host itself may be a mesh (Flares nested directly inside it).
+        if (host.geometry) {
+            const g = host.geometry;
+            if (!g.boundingBox)
+                g.computeBoundingBox();
+            if (g.boundingBox) {
+                tmpBox.union(g.boundingBox.clone().applyMatrix4(host.matrixWorld));
+                hasGeometry = true;
+            }
+        }
+        if (!hasGeometry)
+            return;
+        tmpBox.getBoundingSphere(tmpSphere);
+        host.updateWorldMatrix(true, false);
+        const localCenter = host.worldToLocal(tmpSphere.center.clone());
+        host.getWorldScale(tmpVec);
+        const worldScale = Math.max(tmpVec.x, tmpVec.y, tmpVec.z) || 1;
+        anchor.position.copy(localCenter);
+        mesh.scale.setScalar((tmpSphere.radius / worldScale) * padding);
+    }, [radius, padding, fitKey, hostRef, maskLayer]);
+    useFrame(({ camera: cam }, delta) => {
+        const mat = matRef.current;
+        const mesh = meshRef.current;
+        if (mat)
+            mat.u_time += delta;
+        // World-space billboard: compensate for inherited rotation.
+        if (mesh && hostRef) {
+            hostRef.getWorldQuaternion(tmpQuat).invert();
+            mesh.quaternion.copy(tmpQuat).multiply(cam.quaternion);
+        }
+        // --- Silhouette mask pass: render only the host, white on black. ---
+        if (hostRef && maskTarget && mat && mesh) {
+            const prevOverride = scene.overrideMaterial;
+            const prevBackground = scene.background;
+            const prevTarget = gl.getRenderTarget();
+            const prevLayers = cam.layers.mask;
+            gl.getClearColor(tmpColor);
+            const prevClearAlpha = gl.getClearAlpha();
+            scene.overrideMaterial = maskMaterial;
+            scene.background = null;
+            cam.layers.set(maskLayer);
+            gl.setRenderTarget(maskTarget);
+            gl.setClearColor(0x000000, 1);
+            gl.clear();
+            gl.render(scene, cam);
+            gl.setRenderTarget(prevTarget);
+            gl.setClearColor(tmpColor, prevClearAlpha);
+            scene.overrideMaterial = prevOverride;
+            scene.background = prevBackground;
+            cam.layers.mask = prevLayers;
+            // Feed the shader: mask, buffer size, host center in screen UV.
+            mat.u_mask = maskTarget.texture;
+            gl.getDrawingBufferSize(tmpVec2);
+            mat.u_resolution.set(tmpVec2.x, tmpVec2.y);
+            const anchor = anchorRef.current;
+            anchor.getWorldPosition(tmpVec).project(cam);
+            const cx = tmpVec.x * 0.5 + 0.5;
+            const cy = tmpVec.y * 0.5 + 0.5;
+            mat.u_center.set(cx, cy);
+            // Bounding-silhouette radius in aspect-corrected screen UV: project a
+            // point one limb-unit to the camera's right of the center.
+            mesh.getWorldScale(tmpVec);
+            const worldLimb = Math.max(tmpVec.x, tmpVec.y, tmpVec.z);
+            tmpRight.setFromMatrixColumn(cam.matrixWorld, 0).multiplyScalar(worldLimb);
+            anchor.getWorldPosition(tmpVec).add(tmpRight).project(cam);
+            const aspect = tmpVec2.x / tmpVec2.y;
+            const dx = (tmpVec.x * 0.5 + 0.5 - cx) * aspect;
+            const dy = tmpVec.y * 0.5 + 0.5 - cy;
+            mat.u_limbScreen = Math.max(Math.hypot(dx, dy), 1e-4);
+            mat.u_maskEnabled = 1;
+        }
+        else if (mat) {
+            mat.u_maskEnabled = 0;
+        }
+    });
+    return (_jsx("group", { ref: anchorRef, children: _jsxs("mesh", { ref: meshRef, renderOrder: 2, children: [_jsx("planeGeometry", { args: [4.4, 4.4] }), _jsx("flareMaterial", { ref: matRef, transparent: true, depthWrite: false, depthTest: !hostRef && !shooting, blending: AdditiveBlending, u_shootEnabled: shooting ? 1 : 0, ...uniforms })] }) }));
+}

package/dist/components/Frame.js

@@ -48,6 +48,7 @@ export default function Frame({ url, isActive, createdObject, position, rotation
     };
     if (!texture)
         return null;
+    // console.log('Rendering Frame - url:', url);
     return (_jsx("mesh", { name: url, ref: frameRef, position: position, rotation: rotation, scale: scale, raycast: () => null, onPointerEnter: handlePointerEnter, onPointerLeave: handlePointerLeave, onClick: onClick, userData: {
             url,
         }, children: children ? children : (_jsxs(_Fragment, { children: [_jsx(FrameGeometry, { shapeType: 'rectangle', layoutSettings: layoutSettings, scale: layoutSettings.outerFrameScale }), _jsx(MaterialLibrary, { materialSettings: materialSettings }), showFront && (_jsx(FrameImage, { ref: imageRef, texture: texture, shapeType: 'rectangle', position: [0, 0, 0.02] })), showBack && (_jsx(FrameImage, { texture: texture, shapeType: 'rectangle', position: [0, 0, -0.02], rotation: [0, Math.PI, 0], isBack: true }))] })) }));

package/dist/components/GalleryLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryLayout.d.ts","sourceRoot":"","sources":["../../src/components/GalleryLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAS,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EAAE,qBAAqB,EAAuC,MAAM,wBAAwB,CAAC;AAKzG,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,WAAW,kBAAkB;IACjC,aAAa,EAAE,qBAAqB,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,qBAAqB,EACvD,GAAG,EAAE,QAAQ,EACb,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;CAC1C;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAmD/C,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"GalleryLayout.d.ts","sourceRoot":"","sources":["../../src/components/GalleryLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAS,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EAAE,qBAAqB,EAAuC,MAAM,wBAAwB,CAAC;AAKzG,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,WAAW,kBAAkB;IACjC,aAAa,EAAE,qBAAqB,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,qBAAqB,EACvD,GAAG,EAAE,QAAQ,EACb,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;CAC1C;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAoD/C,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/GalleryLayout.js

@@ -1,11 +1,11 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo, useRef } from 'react';
 import { updateCurrentLayoutSettings } from '@ntalmagor/3drize-core';
 import Frame from './Frame.js';
-import EffectsGenerator from './EffectsGenerator.js';
 import { ImageGeometry } from './ImageGeometry.js';
 const GalleryLayout = ({ createdObject, selectedFrameUrl, handleObjectClick, }) => {
     const groupRef = useRef(null);
+    console.log('GalleryLayout - createdObject:', createdObject);
     const { config, materialSettings, animations } = createdObject;
     const galleryLayout = config || {
         frames: [],
@@ -13,8 +13,8 @@ const GalleryLayout = ({ createdObject, selectedFrameUrl, handleObjectClick, })
         outerFrameScale: 1,
     };
     const { frames, layoutSettings } = useMemo(() => updateCurrentLayoutSettings(galleryLayout), [galleryLayout]);
-    // console.log('GalleryLayout - frames:', frames);
-    // console.log('GalleryLayout - layoutSettings:', layoutSettings);
-    return (_jsx("group", { ref: groupRef, scale: [1, 1, 1], position: [0, 0, 0], rotation: [0, 0, 0], children: frames.map((frame, index) => (_jsxs(Frame, { url: frame.url, isActive: selectedFrameUrl === frame.url, createdObject: createdObject, position: frame.position, rotation: frame.rotation, hoverSettings: { sensitivity: 0.5, applyToChildren: false }, transformEffects: animations?.transform?.effects || [], layoutSettings: layoutSettings, side: galleryLayout?.side || 2, materialSettings: materialSettings, handleObjectClick: handleObjectClick, children: [layoutSettings.geometryType !== 'none' && (_jsx(ImageGeometry, { url: frame.url, geometryType: layoutSettings.geometryType, outerFrameScale: layoutSettings.outerFrameScale })), createdObject.effects?.map((effect, effectIndex) => (_jsx(EffectsGenerator, { settings: effect }, effectIndex)))] }, index))) }));
+    console.log('GalleryLayout - frames:', frames);
+    console.log('GalleryLayout - layoutSettings:', layoutSettings);
+    return (_jsx("group", { ref: groupRef, scale: [1, 1, 1], position: [0, 0, 0], rotation: [0, 0, 0], children: frames.map((frame, index) => (_jsx(Frame, { url: frame.url, isActive: selectedFrameUrl === frame.url, createdObject: createdObject, position: frame.position, rotation: frame.rotation, hoverSettings: { sensitivity: 0.5, applyToChildren: false }, transformEffects: animations?.transform?.effects || [], layoutSettings: layoutSettings, side: galleryLayout?.side || 2, materialSettings: materialSettings, handleObjectClick: handleObjectClick, children: layoutSettings.geometryType !== 'none' && (_jsx(ImageGeometry, { url: frame.url, geometryType: layoutSettings.geometryType, outerFrameScale: layoutSettings.outerFrameScale })) }, index))) }));
 };
 export default GalleryLayout;

package/dist/components/Glyphs.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
-import type { CreatedObjectSettings } from '@ntalmagor/3drize-core';
+import type { GlyphsConfig } from '@ntalmagor/3drize-core';
 export interface GlyphsProps {
-    settings: CreatedObjectSettings;
+    config: GlyphsConfig;
+    boundingRadius?: number;
 }
 declare const Glyphs: React.FC<GlyphsProps>;
 export default Glyphs;

package/dist/components/Glyphs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Glyphs.d.ts","sourceRoot":"","sources":["../../src/components/Glyphs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAGlD,OAAO,KAAK,EAAE,qBAAqB,EAAgB,MAAM,wBAAwB,CAAC;AAGlF,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,qBAAqB,CAAC;CACjC;AAED,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA0DjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Glyphs.d.ts","sourceRoot":"","sources":["../../src/components/Glyphs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAGlD,OAAO,KAAK,EAAyB,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAGlF,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,YAAY,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAyDjC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/components/Glyphs.js

@@ -3,14 +3,14 @@ import { useEffect, useMemo } from 'react';
 import { useFrame } from '@react-three/fiber';
 import * as THREE from 'three';
 import { GlyphRingMaterial } from '@ntalmagor/3drize-core';
-const Glyphs = ({ settings }) => {
-    const config = settings.config;
+const Glyphs = ({ config, boundingRadius }) => {
     // The ring sits at r=0.55 within UV space, so the plane must span 2 * ringRadius / 0.55
     // for the ring's outer edge to land at the configured `ringRadius` in world units.
     const planeSize = useMemo(() => {
-        const r = Math.max(0.05, config.ringRadius ?? 1);
+        const r = Math.max(0.05, (boundingRadius ?? config.ringRadius ?? 1) * 2);
         return (2 * r) / 0.55;
-    }, [config.ringRadius]);
+    }, [boundingRadius, config.ringRadius]);
+    console.log("Rendering Glyphs with config:", config, "and boundingRadius:", boundingRadius, "resulting in planeSize:", planeSize);
     const geometry = useMemo(() => new THREE.PlaneGeometry(planeSize, planeSize, 1, 1), [planeSize]);
     const material = useMemo(() => {
         const m = new GlyphRingMaterial();
@@ -51,7 +51,7 @@ const Glyphs = ({ settings }) => {
         const rotSpeed = config.rotationSpeed ?? 0.5;
         material.uniforms.uRotation.value += delta * rotSpeed * 0.15;
     });
-    if (!settings.meshSettings.visible)
+    if (!config.enabled)
         return null;
     return _jsx("mesh", { geometry: geometry, material: material, frustumCulled: false });
 };