@3driseai/3drise-viewer 0.1.1

package/dist/components/EffectsGenerator.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { Box3, Sphere } from 'three';
+import MoleculesEffect from './effects/MoleculesEffect.js';
+import ShockwaveEffect from './effects/ShockwaveEffect.js';
+import AuraEffect from './effects/AuraEffect.js';
+import DataStreamEffect from './effects/DataStreamEffect.js';
+import ConstellationEffect from './effects/ConstellationEffect.js';
+import HologramEffect from './effects/HologramEffect.js';
+import PortalEffect from './effects/PortalEffect.js';
+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 ForcefieldEffect from './effects/ForcefieldEffect.js';
+import NeuralNetworkEffect from './effects/NeuralNetworkEffect.js';
+import BlackHoleEffect from './effects/BlackHoleEffect.js';
+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';
+import SmokeRibbon from './effects/SmokeRibbon.js';
+const EffectsGenerator = ({ settings, object }) => {
+    console.log('EffectsGenerator render with settings:', settings, 'and object:', object);
+    const { config } = settings;
+    if (!config.enabled)
+        return null;
+    // console.log('Effect config:', config);  
+    const boundingRadius = useMemo(() => {
+        if (!object)
+            return 1;
+        const box = new Box3().setFromObject(object);
+        const sphere = new Sphere();
+        box.getBoundingSphere(sphere);
+        return sphere.radius || 1;
+    }, [object]);
+    const animations = settings.animations;
+    switch (config.type) {
+        case 'molecules': return _jsx(MoleculesEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'shockwave': return _jsx(ShockwaveEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'aura': return _jsx(AuraEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'dataStream': return _jsx(DataStreamEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'constellation': return _jsx(ConstellationEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'hologram': return _jsx(HologramEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'portal': return _jsx(PortalEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        case 'dnaHelix': return _jsx(DnaHelixEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        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 '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 });
+        case 'iceCrystals': return _jsx(IceCrystalsEffect, { boundingRadius: boundingRadius, config: config, animations: animations });
+        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 });
+        case 'smokeRibbon': return _jsx(SmokeRibbon, { config: config, boundingRadius: boundingRadius });
+        default: return null;
+    }
+};
+export default EffectsGenerator;

package/dist/components/EffectsGroup.d.ts

@@ -0,0 +1,8 @@
+import type { CreatedObjectSettings } from '@3driseai/3drise-core';
+import React from "react";
+interface EffectsGroupProps {
+    createdObject: CreatedObjectSettings;
+}
+declare const EffectsGroup: React.FC<EffectsGroupProps>;
+export default EffectsGroup;
+//# sourceMappingURL=EffectsGroup.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EffectsGroup.d.ts","sourceRoot":"","sources":["../../src/components/EffectsGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAGnE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,UAAU,iBAAiB;IACvB,aAAa,EAAE,qBAAqB,CAAC;CACxC;AAGD,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAK7C,CAAC;AACF,eAAe,YAAY,CAAC"}

package/dist/components/EffectsGroup.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { GEREATIVE_EFFECTS_KEY } from '@3driseai/3drise-core';
+import EffectsGenerator from './EffectsGenerator.js';
+import { findById } from '../utils/sceneQuery.js';
+const EffectsGroup = ({ createdObject }) => {
+    if (!createdObject.effects || createdObject.effects.length === 0)
+        return null;
+    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/EnvironmentManager.d.ts

@@ -0,0 +1,9 @@
+import { type SkySystemProps } from './SkySystem';
+import type { EnvironmentConfig } from '@3driseai/3drise-core';
+export interface EnvironmentManagerProps extends SkySystemProps {
+    environment?: EnvironmentConfig;
+    cubeCameraResolution?: number;
+}
+declare const EnvironmentManager: any;
+export default EnvironmentManager;
+//# sourceMappingURL=EnvironmentManager.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EnvironmentManager.d.ts","sourceRoot":"","sources":["../../src/components/EnvironmentManager.tsx"],"names":[],"mappings":"AAIA,OAAkB,EAAqB,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAIhF,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,MAAM,WAAW,uBAAwB,SAAQ,cAAc;IAC3D,WAAW,CAAC,EAAE,iBAAiB,CAAC;IAChC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CACjC;AAED,QAAA,MAAM,kBAAkB,EA8DlB,GAAI,CAAC;AAEX,eAAe,kBAAkB,CAAC"}

package/dist/components/EnvironmentManager.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, forwardRef } from 'react';
+import { Environment } from '@react-three/drei';
+import { useThree } from '@react-three/fiber';
+import { Vector3 } from 'three';
+import SkySystem from './SkySystem.js';
+import { useCubeCamera } from '../hooks/useCubeCamera.js';
+import HdrPlaylistRenderer from './HdrPlaylistRenderer.js';
+import { getTransitionSettings } from '@3driseai/3drise-core';
+const EnvironmentManager = forwardRef(({ environment, cubeCameraResolution = 512, timeSettings, onTimeOfDayChange, onTimeUpdate, }, ref) => {
+    const { scene } = useThree();
+    const defaultHdr = {
+        visible: false,
+        name: null,
+        settings: {
+            groundRadius: 200,
+            groundHeight: 10,
+            groundScale: 100,
+            blur: 0,
+            backgroundBlurriness: 0,
+            backgroundIntensity: 1,
+            backgroundRotation: 0,
+            environmentIntensity: 1,
+            environmentRotation: 0,
+        },
+    };
+    const hdr = environment?.hdr ?? defaultHdr;
+    const backgroundName = hdr.visible ? hdr.name : null;
+    const urls = hdr.urls;
+    const playlistActive = !!urls && urls.length > 1;
+    const singleUrl = urls && urls.length === 1 ? urls[0] : undefined;
+    const hdrActive = !!(backgroundName || singleUrl || playlistActive);
+    const sky = environment?.sky;
+    const sunSystemVisible = sky?.sunSystem?.visible;
+    const sunSize = sky?.sunSystem?.sunSize;
+    const moonSize = sky?.sunSystem?.moonSize;
+    const skyboxScale = 100000;
+    const sunIntensity = sky?.sunSystem?.intensity;
+    const castShadow = sky?.sunSystem?.castShadow;
+    const shadowMapSize = sky?.sunSystem?.shadowMapSize;
+    const playerPosition = new Vector3(0, 0, 0);
+    const starsSettings = environment?.stars;
+    const cloudsSettings = environment?.clouds;
+    const cloudsMaterialSettings = environment?.clouds?.materialSettings;
+    const skyControllerSettings = sky && !sky.sunSystem.visible ? sky : undefined;
+    const rainSettings = environment?.rain;
+    const fogSettings = environment?.fog;
+    useCubeCamera({
+        hdrSettings: hdr,
+        skyVisible: true,
+        sunSystemVisible: sunSystemVisible ?? false,
+        timeSettings,
+        resolution: cubeCameraResolution,
+    });
+    // While the playlist is active, drei <Environment> unmounts; HdrPlaylistRenderer
+    // owns scene.environment + scene.background for the duration of the transitions.
+    const environmentComponent = useMemo(() => {
+        if (playlistActive)
+            return null;
+        if (!singleUrl && !backgroundName)
+            return null;
+        const sourceProps = singleUrl
+            ? { files: singleUrl }
+            : { preset: backgroundName };
+        return (_jsx(Environment, { ...sourceProps, background: true, scene: scene, backgroundBlurriness: hdr.settings.backgroundBlurriness ?? 0, backgroundIntensity: hdr.settings.backgroundIntensity ?? 1, backgroundRotation: [0, hdr.settings.backgroundRotation ?? Math.PI / 2, 0], environmentIntensity: hdr.settings.environmentIntensity ?? 1, environmentRotation: [0, hdr.settings.environmentRotation ?? Math.PI / 2, 0], blur: hdr.settings.blur ?? 0, ground: {
+                radius: hdr.settings.groundRadius,
+                height: hdr.settings.groundHeight,
+                scale: hdr.settings.groundScale,
+            } }));
+    }, [playlistActive, singleUrl, backgroundName, hdr.settings, scene]);
+    return (_jsxs(_Fragment, { children: [environmentComponent, playlistActive && urls && (_jsx(HdrPlaylistRenderer, { urls: urls, transition: getTransitionSettings(hdr) })), _jsx(SkySystem, { ref: ref, timeSettings: timeSettings, visible: true, sunSystemVisible: sunSystemVisible, sunSize: sunSize, moonSize: moonSize, skyboxScale: skyboxScale, sunIntensity: sunIntensity, castShadow: castShadow, shadowMapSize: shadowMapSize, playerPosition: playerPosition, starsSettings: starsSettings, cloudsSettings: cloudsSettings, cloudsMaterialSettings: cloudsMaterialSettings, skyControllerSettings: skyControllerSettings, rainSettings: rainSettings, fogSettings: fogSettings, onTimeOfDayChange: onTimeOfDayChange, onTimeUpdate: onTimeUpdate })] }));
+});
+EnvironmentManager.displayName = 'EnvironmentManager';
+export default EnvironmentManager;

package/dist/components/EnvironmentObject.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { CreatedObjectSettings } from "@3driseai/3drise-core";
+type EnvironmentObjectProps = {
+    createdObject: CreatedObjectSettings;
+};
+declare const EnvironmentObject: React.FC<EnvironmentObjectProps>;
+export default EnvironmentObject;
+//# sourceMappingURL=EnvironmentObject.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EnvironmentObject.d.ts","sourceRoot":"","sources":["../../src/components/EnvironmentObject.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACnE,KAAK,sBAAsB,GAAG;IAC1B,aAAa,EAAE,qBAAqB,CAAC;CACxC,CAAC;AAGF,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAUvD,CAAC;AACF,eAAe,iBAAiB,CAAC"}

package/dist/components/EnvironmentObject.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Rain from './Rain.js';
+const EnvironmentObject = ({ createdObject }) => {
+    const config = createdObject.config;
+    if (!config || config.enabled === false)
+        return null;
+    switch (config.type) {
+        case 'rain':
+            return _jsx(Rain, { settings: createdObject });
+        default:
+            return null;
+    }
+};
+export default EnvironmentObject;

package/dist/components/Flares.d.ts

@@ -0,0 +1,24 @@
+import { Vector3, Object3D } from "three";
+import { AnimationOptions, FlaresConfig } from "@3driseai/3drise-core";
+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.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":"AAEA,OAAO,EAAwE,OAAO,EAA8B,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5I,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,GAAG,CAAC;QACV,UAAU,iBAAiB;YACvB,aAAa,EAAE,GAAG,CAAC;SACtB;KACJ;CACJ;AAED,MAAM,MAAM,WAAW,GAAG;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAC1B,gFAAgF;IAChF,MAAM,EAAE,YAAY,CAAC;IACrB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,EAAE,CAAC,CAAC;IACvD,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;CACnC,CAAC;AAUF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,WAAW,+BA0HpF"}

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.d.ts

@@ -0,0 +1,23 @@
+import type { Object3D } from 'three';
+import type { CreatedObjectSettings, HoverSettings, GalleryLayoutSettings, TransformEffect, ColorEffect, MaterialSettings } from '@3driseai/3drise-core';
+import type { FrameShapeType } from './FrameGeometry';
+import { type ThreeEvent } from "@react-three/fiber";
+export type { FrameShapeType };
+export interface FrameProps {
+    url: string;
+    isActive: boolean;
+    createdObject: CreatedObjectSettings;
+    position?: [number, number, number];
+    rotation?: [number, number, number];
+    shapeType?: FrameShapeType;
+    hoverSettings: HoverSettings;
+    transformEffects?: TransformEffect[];
+    colorEffects?: ColorEffect[];
+    layoutSettings: GalleryLayoutSettings;
+    side: number;
+    materialSettings: MaterialSettings;
+    children?: React.ReactNode;
+    handleObjectClick?: (createdObject: CreatedObjectSettings, ref: Object3D, event: ThreeEvent<MouseEvent>) => void;
+}
+export default function Frame({ url, isActive, createdObject, position, rotation, shapeType, hoverSettings, transformEffects, colorEffects, layoutSettings, side, materialSettings, children, handleObjectClick, }: FrameProps): import("react").JSX.Element;
+//# sourceMappingURL=Frame.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Frame.d.ts","sourceRoot":"","sources":["../../src/components/Frame.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,KAAK,EAAE,qBAAqB,EAAE,aAAa,EAAE,qBAAqB,EAAE,eAAe,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzJ,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAKtD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,YAAY,EAAE,cAAc,EAAE,CAAC;AAE/B,MAAM,WAAW,UAAU;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,qBAAqB,CAAC;IACrC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,aAAa,EAAE,aAAa,CAAC;IAC7B,gBAAgB,CAAC,EAAE,eAAe,EAAE,CAAC;IACrC,YAAY,CAAC,EAAE,WAAW,EAAE,CAAC;IAC7B,cAAc,EAAE,qBAAqB,CAAC;IACtC,IAAI,EAAE,MAAM,CAAC;IACb,gBAAgB,EAAE,gBAAgB,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;CACpH;AAGD,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAoB,EAAE,aAAa,EAAE,gBAAqB,EAAE,YAAiB,EAAE,cAAc,EAAE,IAAI,EAAE,gBAAgB,EAAE,QAAQ,EAAE,iBAAiB,GAAG,EAAE,UAAU,+BA2ClP"}

package/dist/components/Frame.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useState, useEffect } from "react";
+import { useCursor } from "@react-three/drei";
+import { BackSide, DoubleSide, FrontSide, Mesh } from "three";
+import { texturesManager } from "@3driseai/3drise-core";
+import { FrameGeometry } from "./FrameGeometry.js";
+import { FrameImage } from "./FrameImage.js";
+import MaterialLibrary from "./MaterialLibrary.js";
+import { useFrameEffects } from "../hooks/useFrameEffects.js";
+import { useObjectAnimation } from "../hooks/useObjectAnimation.js";
+export default function Frame({ url, isActive, createdObject, position, rotation, shapeType = 'circle', hoverSettings, transformEffects = [], colorEffects = [], layoutSettings, side, materialSettings, children, handleObjectClick, }) {
+    const frameRef = useRef(new Mesh());
+    const imageRef = useRef(null);
+    const [texture, setTexture] = useState(null);
+    useEffect(() => {
+        let mounted = true;
+        const existing = texturesManager.getTextureByUrl(url);
+        if (existing) {
+            setTexture(existing);
+        }
+        else {
+            const name = url.split('/').pop()?.split('.')[0] || `texture-${Date.now()}`;
+            texturesManager.loadTexture(name, url, 'images')
+                .then((loaded) => { if (mounted)
+                setTexture(loaded); })
+                .catch((err) => console.error('Failed to load texture:', err));
+        }
+        return () => { mounted = false; };
+    }, [url]);
+    const { handlePointerEnter, handlePointerLeave, hovered } = useFrameEffects(isActive);
+    useCursor(hovered);
+    const enabledEffects = transformEffects.filter(e => e.enabled !== false);
+    const animateMaterial = enabledEffects.length > 0 || colorEffects.some(e => e.enabled !== false);
+    useObjectAnimation(createdObject, animateMaterial, { enabled: true, hovered }, frameRef.current);
+    const scale = [
+        0.9 * (layoutSettings.width || 1),
+        0.9 * (layoutSettings.height || 1),
+        0.9,
+    ];
+    const showFront = side === FrontSide || side === DoubleSide;
+    const showBack = side === BackSide || side === DoubleSide;
+    const onClick = (e) => {
+        e.stopPropagation();
+        if (!frameRef.current)
+            return;
+        // const clickedPoint = e.point;
+        handleObjectClick?.(createdObject, frameRef.current, e);
+    };
+    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/FrameGeometry.d.ts

@@ -0,0 +1,10 @@
+import type { GalleryLayoutSettings } from "@3driseai/3drise-core";
+export type FrameShapeType = 'rectangle' | 'ellipse' | 'circle' | 'roundedRectangle';
+interface FrameGeometryProps {
+    shapeType: FrameShapeType;
+    scale?: number;
+    layoutSettings?: GalleryLayoutSettings;
+}
+export declare function FrameGeometry({ shapeType, scale, layoutSettings }: FrameGeometryProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=FrameGeometry.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FrameGeometry.d.ts","sourceRoot":"","sources":["../../src/components/FrameGeometry.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACnE,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,kBAAkB,CAAC;AAErF,UAAU,kBAAkB;IACxB,SAAS,EAAE,cAAc,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,qBAAqB,CAAC;CAC1C;AAGD,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,KAAS,EAAE,cAAc,EAAE,EAAE,kBAAkB,+BAezF"}

package/dist/components/FrameGeometry.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function FrameGeometry({ shapeType, scale = 1, layoutSettings }) {
+    const width = (layoutSettings?.width || 1) * scale;
+    const height = (layoutSettings?.height || 1) * scale;
+    const depth = 0.05;
+    switch (shapeType) {
+        case 'ellipse':
+            return _jsx("circleGeometry", { args: [scale * 0.5, 32] });
+        case 'circle':
+            return _jsx("cylinderGeometry", { args: [scale * 0.5, depth, scale * 0.5, 32] });
+        case 'roundedRectangle':
+            return _jsx("cylinderGeometry", { args: [scale * 0.1, scale * 0.1, 1, 8] });
+        case 'rectangle':
+        default:
+            return _jsx("boxGeometry", { args: [width, height, depth] });
+    }
+}

package/dist/components/FrameImage.d.ts

@@ -0,0 +1,2 @@
+export declare const FrameImage: any;
+//# sourceMappingURL=FrameImage.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FrameImage.d.ts","sourceRoot":"","sources":["../../src/components/FrameImage.tsx"],"names":[],"mappings":"AAeA,eAAO,MAAM,UAAU,EAUjB,GAAI,CAAC"}

package/dist/components/FrameImage.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { FrameGeometry } from "./FrameGeometry.js";
+export const FrameImage = forwardRef(({ texture, shapeType, position, rotation, isBack = false, layoutSettings, }, ref) => {
+    const width = layoutSettings?.width || 1;
+    const height = layoutSettings?.height || 1;
+    const imageScale = 0.9;
+    const scaledSettings = {
+        ...layoutSettings,
+        width: width * imageScale,
+        height: height * imageScale,
+    };
+    return (_jsxs("mesh", { ref: ref, raycast: () => null, position: position, rotation: rotation, children: [_jsx(FrameGeometry, { shapeType: shapeType, layoutSettings: scaledSettings }), _jsx("meshBasicMaterial", { map: texture, toneMapped: false, transparent: true })] }));
+});
+FrameImage.displayName = 'FrameImage';

package/dist/components/Galaxy.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import type { CreatedObjectSettings } from "@3driseai/3drise-core";
+import { Object3D } from "three";
+export interface GalaxyProps {
+    createdObject: CreatedObjectSettings;
+    onObjectReady?: (object: CreatedObjectSettings, ref: Object3D) => void;
+}
+declare const Galaxy: React.FC<GalaxyProps>;
+export default Galaxy;
+//# sourceMappingURL=Galaxy.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Galaxy.d.ts","sourceRoot":"","sources":["../../src/components/Galaxy.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,MAAM,WAAW,WAAW;IACxB,aAAa,EAAE,qBAAqB,CAAC;IACrC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,KAAK,IAAI,CAAC;CAC1E;AAGD,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAsBjC,CAAC;AACF,eAAe,MAAM,CAAC"}

package/dist/components/Galaxy.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Stars from './Stars.js';
+import Earth from './Earth.js';
+import SolarSystem from './SolarSystem.js';
+import ShootingStars from './ShootingStars.js';
+const Galaxy = ({ createdObject, onObjectReady }) => {
+    const config = createdObject.config;
+    console.log('Galaxy config:', config);
+    if (!config)
+        return null;
+    const starsSettings = config.stars;
+    const earthSettings = config.earth;
+    const solarSystemSettings = config.solarSystem;
+    const shootingStarsSettings = config.shootingStars;
+    // const timeSettings = config.time as TimeSettings | undefined;
+    switch (config.type) {
+        case 'stars':
+            return _jsx(Stars, { settings: createdObject, onObjectReady: onObjectReady });
+        case 'earth':
+            return _jsx(Earth, { ...config, onMeshReady: (mesh) => onObjectReady && onObjectReady(createdObject, mesh) });
+        case 'solarSystem':
+            return _jsx(SolarSystem, { ...config, onObjectReady: group => onObjectReady && onObjectReady(createdObject, group) });
+        case 'shootingStars':
+            return _jsx(ShootingStars, { settings: config });
+        default:
+            return null;
+    }
+};
+export default Galaxy;

package/dist/components/GalleryLayout.d.ts

@@ -0,0 +1,12 @@
+import type { CreatedObjectSettings } from '@3driseai/3drise-core';
+import React from "react";
+import { Object3D } from "three";
+import { type ThreeEvent } from "@react-three/fiber";
+export interface GalleryLayoutProps {
+    createdObject: CreatedObjectSettings;
+    selectedFrameUrl?: string;
+    handleObjectClick?: (createdObject: CreatedObjectSettings, ref: Object3D, event: ThreeEvent<MouseEvent>) => void;
+}
+declare const GalleryLayout: React.FC<GalleryLayoutProps>;
+export default GalleryLayout;
+//# sourceMappingURL=GalleryLayout.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryLayout.d.ts","sourceRoot":"","sources":["../../src/components/GalleryLayout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAGnE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,MAAM,WAAW,kBAAkB;IAC/B,aAAa,EAAE,qBAAqB,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;CACpH;AAGD,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAa/C,CAAC;AACF,eAAe,aAAa,CAAC"}

package/dist/components/GalleryLayout.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo, useRef } from 'react';
+import { updateCurrentLayoutSettings } from '@3driseai/3drise-core';
+import Frame from './Frame.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: [],
+        geometryType: 'none',
+        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) => (_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;