@3driseai/3drise-viewer 0.1.39 → 0.1.41

package/dist/components/gallery/StrataGallery.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { AnimationOptions, MouseMoveDomain, StrataGalleryConfig } from '@3driseai/3drise-core';
+import type { ObjectReadyProps } from '../../types/objectReady';
+export interface StrataGalleryProps extends ObjectReadyProps {
+    config: StrataGalleryConfig;
+    /** Scene object id: the live-edit handle and the gallery's runtime entry are found by it. */
+    id?: string;
+    /** Keyframes on the config knobs (animations.gallery.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on the config knobs (mouseMove.gallery). */
+    mouseMove?: MouseMoveDomain;
+}
+/**
+ * Pictures as stacks of thin horizontal plates lit by the scene, each plate’s front following the picture’s brightness like a laser-cut relief: inactive ones are a flat grey stack, the active one slides forward into relief in full colour; the cursor pushes plates back. Use for architecture, product, interiors and craft showcases.
+ */
+declare const StrataGallery: React.FC<StrataGalleryProps>;
+export default StrataGallery;
+//# sourceMappingURL=StrataGallery.d.ts.map

package/dist/components/gallery/StrataGallery.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StrataGallery.d.ts","sourceRoot":"","sources":["../../../src/components/gallery/StrataGallery.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACpG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAShE,MAAM,WAAW,kBAAmB,SAAQ,gBAAgB;IACxD,MAAM,EAAE,mBAAmB,CAAC;IAC5B,6FAA6F;IAC7F,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,qEAAqE;IACrE,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,gEAAgE;IAChE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED;;GAEG;AACH,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAG/C,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/gallery/StrataGallery.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DEFAULT_GALLERY_OBJECTS, GALLERY_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import GalleryVariant from './kit/GalleryVariant.js';
+import * as LOOK from './looks/strata.js';
+/**
+ * Pictures as stacks of thin horizontal plates lit by the scene, each plate’s front following the picture’s brightness like a laser-cut relief: inactive ones are a flat grey stack, the active one slides forward into relief in full colour; the cursor pushes plates back. Use for architecture, product, interiors and craft showcases.
+ */
+const StrataGallery = ({ config, ...rest }) => (_jsx(GalleryVariant, { look: LOOK, defaults: DEFAULT_GALLERY_OBJECTS.strata, animatable: GALLERY_OBJECTS_ANIMATABLE.strata, config: config, ...rest }));
+export default StrataGallery;

package/dist/components/gallery/TerracesGallery.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { AnimationOptions, MouseMoveDomain, TerracesGalleryConfig } from '@3driseai/3drise-core';
+import type { ObjectReadyProps } from '../../types/objectReady';
+export interface TerracesGalleryProps extends ObjectReadyProps {
+    config: TerracesGalleryConfig;
+    /** Scene object id: the live-edit handle and the gallery's runtime entry are found by it. */
+    id?: string;
+    /** Keyframes on the config knobs (animations.gallery.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on the config knobs (mouseMove.gallery). */
+    mouseMove?: MouseMoveDomain;
+}
+/**
+ * Pictures as topographic models of stacked card lit by the scene: inactive ones are a flat grey contour map, the active one rises into terraces of its own brightness in full colour behind a soft wave; the cursor lifts the terraces higher. Use for architecture, maps, data and craft showcases.
+ */
+declare const TerracesGallery: React.FC<TerracesGalleryProps>;
+export default TerracesGallery;
+//# sourceMappingURL=TerracesGallery.d.ts.map

package/dist/components/gallery/TerracesGallery.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TerracesGallery.d.ts","sourceRoot":"","sources":["../../../src/components/gallery/TerracesGallery.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACtG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAShE,MAAM,WAAW,oBAAqB,SAAQ,gBAAgB;IAC1D,MAAM,EAAE,qBAAqB,CAAC;IAC9B,6FAA6F;IAC7F,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,qEAAqE;IACrE,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,gEAAgE;IAChE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED;;GAEG;AACH,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAGnD,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/gallery/TerracesGallery.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DEFAULT_GALLERY_OBJECTS, GALLERY_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import GalleryVariant from './kit/GalleryVariant.js';
+import * as LOOK from './looks/terraces.js';
+/**
+ * Pictures as topographic models of stacked card lit by the scene: inactive ones are a flat grey contour map, the active one rises into terraces of its own brightness in full colour behind a soft wave; the cursor lifts the terraces higher. Use for architecture, maps, data and craft showcases.
+ */
+const TerracesGallery = ({ config, ...rest }) => (_jsx(GalleryVariant, { look: LOOK, defaults: DEFAULT_GALLERY_OBJECTS.terraces, animatable: GALLERY_OBJECTS_ANIMATABLE.terraces, config: config, ...rest }));
+export default TerracesGallery;

package/dist/components/gallery/WireReliefGallery.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { AnimationOptions, MouseMoveDomain, WireReliefGalleryConfig } from '@3driseai/3drise-core';
+import type { ObjectReadyProps } from '../../types/objectReady';
+export interface WireReliefGalleryProps extends ObjectReadyProps {
+    config: WireReliefGalleryConfig;
+    /** Scene object id: the live-edit handle and the gallery's runtime entry are found by it. */
+    id?: string;
+    /** Keyframes on the config knobs (animations.gallery.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on the config knobs (mouseMove.gallery). */
+    mouseMove?: MouseMoveDomain;
+}
+/**
+ * Pictures as a fine wire mesh lifted by their own brightness: inactive ones are a flat grey wire grid, the active one rises into relief and fills with colour panels behind a soft wave; near the cursor the panels lift away to the wire. Use for tech, data, architecture and engineering showcases.
+ */
+declare const WireReliefGallery: React.FC<WireReliefGalleryProps>;
+export default WireReliefGallery;
+//# sourceMappingURL=WireReliefGallery.d.ts.map

package/dist/components/gallery/WireReliefGallery.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WireReliefGallery.d.ts","sourceRoot":"","sources":["../../../src/components/gallery/WireReliefGallery.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AACxG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAShE,MAAM,WAAW,sBAAuB,SAAQ,gBAAgB;IAC5D,MAAM,EAAE,uBAAuB,CAAC;IAChC,6FAA6F;IAC7F,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,qEAAqE;IACrE,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,gEAAgE;IAChE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED;;GAEG;AACH,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAGvD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/gallery/WireReliefGallery.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DEFAULT_GALLERY_OBJECTS, GALLERY_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import GalleryVariant from './kit/GalleryVariant.js';
+import * as LOOK from './looks/wireRelief.js';
+/**
+ * Pictures as a fine wire mesh lifted by their own brightness: inactive ones are a flat grey wire grid, the active one rises into relief and fills with colour panels behind a soft wave; near the cursor the panels lift away to the wire. Use for tech, data, architecture and engineering showcases.
+ */
+const WireReliefGallery = ({ config, ...rest }) => (_jsx(GalleryVariant, { look: LOOK, defaults: DEFAULT_GALLERY_OBJECTS.wireRelief, animatable: GALLERY_OBJECTS_ANIMATABLE.wireRelief, config: config, ...rest }));
+export default WireReliefGallery;

package/dist/components/gallery/index.d.ts

@@ -0,0 +1,46 @@
+export {};
+export type { LightThreadsGalleryProps } from './LightThreadsGallery';
+export { default as LightThreadsGallery } from './LightThreadsGallery';
+export type { SilkGalleryProps } from './SilkGallery';
+export { default as SilkGallery } from './SilkGallery';
+export type { ParticleShiftGalleryProps } from './ParticleShiftGallery';
+export { default as ParticleShiftGallery } from './ParticleShiftGallery';
+export type { GlassPanesGalleryProps } from './GlassPanesGallery';
+export { default as GlassPanesGallery } from './GlassPanesGallery';
+export type { HaloGalleryProps } from './HaloGallery';
+export { default as HaloGallery } from './HaloGallery';
+export type { LoomGalleryProps } from './LoomGallery';
+export { default as LoomGallery } from './LoomGallery';
+export type { BasicCarouselGalleryProps } from './BasicCarouselGallery';
+export { default as BasicCarouselGallery } from './BasicCarouselGallery';
+export type { PaperLanternsGalleryProps } from './PaperLanternsGallery';
+export { default as PaperLanternsGallery } from './PaperLanternsGallery';
+export type { PinscreenGalleryProps } from './PinscreenGallery';
+export { default as PinscreenGallery } from './PinscreenGallery';
+export type { DepthLayersGalleryProps } from './DepthLayersGallery';
+export { default as DepthLayersGallery } from './DepthLayersGallery';
+export type { ContourLinesGalleryProps } from './ContourLinesGallery';
+export { default as ContourLinesGallery } from './ContourLinesGallery';
+export type { PrismSplitGalleryProps } from './PrismSplitGallery';
+export { default as PrismSplitGallery } from './PrismSplitGallery';
+export type { EngravingGalleryProps } from './EngravingGallery';
+export { default as EngravingGallery } from './EngravingGallery';
+export type { SlatsGalleryProps } from './SlatsGallery';
+export { default as SlatsGallery } from './SlatsGallery';
+export type { FoldGalleryProps } from './FoldGallery';
+export { default as FoldGallery } from './FoldGallery';
+export type { WireReliefGalleryProps } from './WireReliefGallery';
+export { default as WireReliefGallery } from './WireReliefGallery';
+export type { TerracesGalleryProps } from './TerracesGallery';
+export { default as TerracesGallery } from './TerracesGallery';
+export type { ShadowBoxGalleryProps } from './ShadowBoxGallery';
+export { default as ShadowBoxGallery } from './ShadowBoxGallery';
+export type { PopUpGalleryProps } from './PopUpGallery';
+export { default as PopUpGallery } from './PopUpGallery';
+export type { RidgelinesGalleryProps } from './RidgelinesGallery';
+export { default as RidgelinesGallery } from './RidgelinesGallery';
+export type { FlowLinesGalleryProps } from './FlowLinesGallery';
+export { default as FlowLinesGallery } from './FlowLinesGallery';
+export type { StrataGalleryProps } from './StrataGallery';
+export { default as StrataGallery } from './StrataGallery';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/gallery/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/gallery/index.ts"],"names":[],"mappings":"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"}

package/dist/components/gallery/index.js

@@ -0,0 +1,22 @@
+export { default as LightThreadsGallery } from './LightThreadsGallery.js';
+export { default as SilkGallery } from './SilkGallery.js';
+export { default as ParticleShiftGallery } from './ParticleShiftGallery.js';
+export { default as GlassPanesGallery } from './GlassPanesGallery.js';
+export { default as HaloGallery } from './HaloGallery.js';
+export { default as LoomGallery } from './LoomGallery.js';
+export { default as BasicCarouselGallery } from './BasicCarouselGallery.js';
+export { default as PaperLanternsGallery } from './PaperLanternsGallery.js';
+export { default as PinscreenGallery } from './PinscreenGallery.js';
+export { default as DepthLayersGallery } from './DepthLayersGallery.js';
+export { default as ContourLinesGallery } from './ContourLinesGallery.js';
+export { default as PrismSplitGallery } from './PrismSplitGallery.js';
+export { default as EngravingGallery } from './EngravingGallery.js';
+export { default as SlatsGallery } from './SlatsGallery.js';
+export { default as FoldGallery } from './FoldGallery.js';
+export { default as WireReliefGallery } from './WireReliefGallery.js';
+export { default as TerracesGallery } from './TerracesGallery.js';
+export { default as ShadowBoxGallery } from './ShadowBoxGallery.js';
+export { default as PopUpGallery } from './PopUpGallery.js';
+export { default as RidgelinesGallery } from './RidgelinesGallery.js';
+export { default as FlowLinesGallery } from './FlowLinesGallery.js';
+export { default as StrataGallery } from './StrataGallery.js';

package/dist/components/gallery/kit/GalleryVariant.d.ts

@@ -0,0 +1,68 @@
+import React from 'react';
+import * as THREE from 'three';
+import type { AnimationOptions, MouseMoveDomain } from '@3driseai/3drise-core';
+import type { ObjectReadyProps } from '../../../types/objectReady';
+export interface GalleryPointer {
+    x: number;
+    y: number;
+    nx: number;
+    ny: number;
+}
+export interface GalleryLookInstance {
+    object: THREE.Object3D;
+    /** An invisible plane over the active picture's slot (clicks, "over the gallery"). */
+    pickMesh?: THREE.Object3D;
+    controls: {
+        next(): void;
+        prev(): void;
+        goTo(i: number): void;
+        jump(i: number): void;
+        readonly index: number;
+        readonly count: number;
+        readonly busy: boolean;
+        setTexture(tex: THREE.DataArrayTexture, count: number): void;
+        dragBegin?(x: number): void;
+        dragMove?(x: number): void;
+        dragEnd?(dt: number): void;
+        /** The picture under the cursor (-1 = none), for looks with a hover state (Paper Lanterns' glow). */
+        hover?(i: number): void;
+    };
+    /** Looks whose pictures are separate clickable things (Paper Lanterns): the picture a hit is on, else
+     *  undefined. A click on one goes to it; without this a click right / left of the centre goes next / prev. */
+    pickPicture?(hit: {
+        object: THREE.Object3D;
+        instanceId?: number;
+    }): number | undefined;
+    apply(k: Record<string, unknown>): void;
+    update(dt: number, pointer: GalleryPointer | null, state?: {
+        dpr: number;
+        h: number;
+    }): void;
+    dispose(): void;
+}
+export interface GalleryLook {
+    DEFAULTS: Record<string, unknown>;
+    STRUCTURAL: readonly string[];
+    createUniforms(): Record<string, {
+        value: unknown;
+    }>;
+    build(u: Record<string, {
+        value: unknown;
+    }>, c: Record<string, unknown>): GalleryLookInstance;
+}
+export interface GalleryVariantProps extends ObjectReadyProps {
+    look: GalleryLook;
+    /** The variant's defaults from core (DEFAULT_GALLERY_OBJECTS[key]). */
+    defaults: Record<string, unknown>;
+    /** The variant's animatable knobs from core (GALLERY_OBJECTS_ANIMATABLE[key]). */
+    animatable: readonly {
+        value: string;
+    }[];
+    config: Record<string, unknown>;
+    id?: string;
+    keyframes?: AnimationOptions[];
+    mouseMove?: MouseMoveDomain;
+}
+declare const GalleryVariant: React.FC<GalleryVariantProps>;
+export default GalleryVariant;
+//# sourceMappingURL=GalleryVariant.d.ts.map

package/dist/components/gallery/kit/GalleryVariant.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryVariant.d.ts","sourceRoot":"","sources":["../../../../src/components/gallery/kit/GalleryVariant.tsx"],"names":[],"mappings":"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"}

package/dist/components/gallery/kit/GalleryVariant.js

@@ -0,0 +1,231 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import * as THREE from 'three';
+import { useFrame, useThree } from '@react-three/fiber';
+import { withConfigDefaults } from '../../../utils/configAnimations.js';
+import { useObjectReady } from '../../../hooks/useObjectReady.js';
+import { useConfigDriver } from '../../../hooks/useConfigDriver.js';
+import GalleryRuntime from '../../../galleryRuntime.js';
+import { loadPictureArray, pictureTexture, placeholderPictures } from './pictures.js';
+import { createFeeds } from './feeds.js';
+const PLACEHOLDERS = 6;
+const NAV_KEYS = ['autoplay', 'navigation', 'feeds'];
+const GalleryVariant = ({ look, defaults, animatable, config, id, keyframes, mouseMove, onObjectReady, onObjectDispose }) => {
+    const rootRef = useRef(null);
+    useObjectReady(rootRef, config, onObjectReady, onObjectDispose);
+    const { gl, camera, size, events, scene } = useThree();
+    const cfg = useMemo(() => withConfigDefaults(defaults, config), [defaults, config]);
+    const STRUCTURAL = look.STRUCTURAL;
+    const ALLOWED = useMemo(() => new Set(animatable.map((a) => a.value)), [animatable]);
+    const uniforms = useMemo(() => look.createUniforms(), [look]);
+    // ---- the look: rebuilt on a structural change only (imageUrls only reloads the pictures)
+    const buildKey = STRUCTURAL.filter((k) => k !== 'imageUrls').map((k) => JSON.stringify(cfg[k])).join('|');
+    // the look never runs its own autoplay, never leans toward the cursor (a mouse-move binding on the object's
+    // rotation does that, configurably), and structural keys never go live
+    const toLook = (m) => {
+        const out = {};
+        for (const [k, v] of Object.entries(m))
+            if (!STRUCTURAL.includes(k) && !NAV_KEYS.includes(k))
+                out[k] = v;
+        out.autoplay = 0;
+        out.lean = 0;
+        return out;
+    };
+    const instance = useMemo(() => look.build(uniforms, { ...look.DEFAULTS, ...cfg, autoplay: 0, lean: 0 }), [look, uniforms, buildKey]); // eslint-disable-line react-hooks/exhaustive-deps
+    useEffect(() => () => instance.dispose(), [instance]);
+    const instRef = useRef(instance);
+    instRef.current = instance;
+    // ---- pictures
+    const urls = Array.isArray(cfg.imageUrls) ? cfg.imageUrls.filter((u) => typeof u === 'string' && u) : [];
+    const urlsKey = urls.join('\n');
+    const aspect = Number(cfg.aspect) || 1.5;
+    const [pictures, setPictures] = useState(null);
+    useEffect(() => {
+        let alive = true;
+        const sources = urls.length ? urls : placeholderPictures(PLACEHOLDERS, aspect);
+        loadPictureArray(sources, aspect).then((p) => { if (alive)
+            setPictures(p); }).catch(() => { });
+        return () => { alive = false; };
+    }, [urlsKey, aspect]); // eslint-disable-line react-hooks/exhaustive-deps
+    const nav = useRef({ index: 0, paused: false, autoT: 0, lastIndex: -1, dragging: false, autoplay: Number(cfg.autoplay) || 0 });
+    useEffect(() => {
+        if (!pictures)
+            return;
+        const keep = nav.current.lastIndex >= 0 ? nav.current.index : 0;
+        instance.controls.setTexture(pictureTexture(pictures), pictures.count);
+        instance.controls.jump(Math.min(keep, Math.max(0, pictures.count - 1)));
+    }, [instance, pictures]);
+    // ---- config: committed + live + keyframes + pointer bindings, through one push
+    useLayoutEffect(() => { instance.apply(toLook(cfg)); nav.current.autoplay = Number(cfg.autoplay) || 0; }, [instance, cfg]); // eslint-disable-line react-hooks/exhaustive-deps
+    const push = useCallback((merged) => { instRef.current.apply(toLook(merged)); if (merged.autoplay !== undefined)
+        nav.current.autoplay = Number(merged.autoplay) || 0; }, []); // eslint-disable-line react-hooks/exhaustive-deps
+    useConfigDriver({ rootRef, id, family: 'gallery', base: cfg, structural: STRUCTURAL, allowed: ALLOWED, keyframes, mouseMove, push });
+    // ---- navigation: one stable controls object over whichever look is current
+    const urlsRef = useRef(urls);
+    urlsRef.current = urls;
+    const controls = useMemo(() => {
+        const c = () => instRef.current.controls;
+        const wrapI = (i) => { const n = c().count; return n ? ((Math.round(i) % n) + n) % n : 0; };
+        return {
+            next() { nav.current.autoT = 0; c().next(); },
+            prev() { nav.current.autoT = 0; c().prev(); },
+            goTo(i) { nav.current.autoT = 0; c().goTo(wrapI(i)); },
+            jump(i) { nav.current.autoT = 0; c().jump(wrapI(i)); },
+            pause() { nav.current.paused = true; },
+            resume() { nav.current.paused = false; nav.current.autoT = 0; },
+            get index() { return c().index; },
+            get count() { return c().count; },
+            get busy() { return c().busy; },
+            get paused() { return nav.current.paused; },
+            get currentUrl() { return urlsRef.current[c().index]; },
+        };
+    }, []);
+    useEffect(() => {
+        const root = rootRef.current;
+        if (!id) {
+            if (root)
+                root.userData.gallery = controls;
+            return () => { if (root)
+                delete root.userData.gallery; };
+        }
+        return GalleryRuntime.register(id, controls, root);
+    }, [id, controls]);
+    // ---- feeds: the active picture on other objects too (config.feeds; ./feeds.ts). Only real pictures are sent
+    const feeds = useMemo(() => createFeeds(scene), [scene]);
+    useEffect(() => () => feeds.dispose(), [feeds]);
+    const feedIds = Array.isArray(cfg.feeds) ? cfg.feeds.filter((f) => typeof f === 'string' && f && f !== id) : [];
+    const feedRef = useRef({ ids: feedIds, t: 0 });
+    feedRef.current.ids = feedIds;
+    // ---- the cursor
+    const ptr = useRef({ inside: false, ndc: new THREE.Vector2(), down: null });
+    const ray = useMemo(() => new THREE.Raycaster(), []);
+    const tmp = useMemo(() => ({ inv: new THREE.Matrix4(), hit: new THREE.Vector3(), plane: new THREE.Plane(new THREE.Vector3(0, 0, 1), 0) }), []);
+    /** The cursor on the gallery's own z = 0 plane, in gallery units (null if the ray misses it). */
+    const localHit = useCallback((ndc) => {
+        const root = rootRef.current;
+        if (!root)
+            return null;
+        ray.setFromCamera(ndc, camera);
+        root.updateWorldMatrix(true, false);
+        tmp.inv.copy(root.matrixWorld).invert();
+        ray.ray.applyMatrix4(tmp.inv);
+        return ray.ray.intersectPlane(tmp.plane, tmp.hit) ? tmp.hit.clone() : null;
+    }, [camera, ray, tmp]);
+    useEffect(() => {
+        const el = (events.connected ?? gl.domElement);
+        const toNdc = (e) => { const r = el.getBoundingClientRect(); ptr.current.ndc.set(((e.clientX - r.left) / r.width) * 2 - 1, -((e.clientY - r.top) / r.height) * 2 + 1); };
+        const move = (e) => {
+            toNdc(e);
+            ptr.current.inside = true;
+            const d = ptr.current.down, c = instRef.current.controls;
+            if (!d || cfg.navigation !== 'drag' || !c.dragBegin)
+                return;
+            const h = localHit(ptr.current.ndc);
+            if (!d.drag && Math.hypot(e.clientX - d.cx, e.clientY - d.cy) > 6) {
+                d.drag = true;
+                nav.current.dragging = true;
+                c.dragBegin(d.x);
+            }
+            if (d.drag && h) {
+                c.dragMove?.(h.x);
+                d.t = performance.now();
+            }
+        };
+        const leave = () => { ptr.current.inside = false; };
+        const up = () => {
+            const d = ptr.current.down;
+            ptr.current.down = null;
+            if (!d)
+                return;
+            const c = instRef.current.controls;
+            if (d.drag) {
+                nav.current.dragging = false;
+                nav.current.autoT = 0;
+                c.dragEnd?.((performance.now() - d.t) / 1000 + 1 / 60);
+            }
+            else if (cfg.navigation === 'click' || cfg.navigation === 'drag') {
+                if (d.pick !== undefined) {
+                    if (d.pick !== controls.index)
+                        controls.goTo(d.pick);
+                } // a click on a picture brings it in
+                else if (!instRef.current.pickPicture)
+                    (d.x >= 0 ? controls.next : controls.prev)();
+            }
+        };
+        el.addEventListener('pointermove', move, { passive: true });
+        el.addEventListener('pointerleave', leave, { passive: true });
+        window.addEventListener('pointerup', up, { passive: true });
+        return () => { el.removeEventListener('pointermove', move); el.removeEventListener('pointerleave', leave); window.removeEventListener('pointerup', up); };
+    }, [gl, events, cfg.navigation, controls, localHit]);
+    const onPointerDown = useCallback((e) => {
+        if (cfg.navigation !== 'click' && cfg.navigation !== 'drag')
+            return;
+        const root = rootRef.current;
+        if (!root || e.button !== 0)
+            return;
+        if (ptr.current.down?.ev === e.nativeEvent)
+            return; // R3F calls this once per hit: the nearest one counts
+        const p = root.worldToLocal(e.point.clone());
+        const pick = instRef.current.pickPicture?.({ object: e.object, instanceId: e.instanceId });
+        ptr.current.down = { cx: e.nativeEvent.clientX, cy: e.nativeEvent.clientY, x: p.x, drag: false, t: performance.now(), pick, ev: e.nativeEvent };
+    }, [cfg.navigation]);
+    // the picture under the cursor, for looks with a hover state
+    const hovered = useRef(-1), hoverEv = useRef(null);
+    const onPointerHover = useCallback((e) => {
+        const inst = instRef.current;
+        if (!inst.pickPicture || !inst.controls.hover || hoverEv.current === e.nativeEvent)
+            return; // the nearest hit only
+        hoverEv.current = e.nativeEvent;
+        const i = inst.pickPicture({ object: e.object, instanceId: e.instanceId }) ?? -1;
+        if (i !== hovered.current) {
+            hovered.current = i;
+            inst.controls.hover(i);
+        }
+    }, []);
+    const onPointerLeave = useCallback(() => {
+        if (hovered.current < 0)
+            return;
+        hovered.current = -1;
+        instRef.current.controls.hover?.(-1);
+    }, []);
+    useFrame((_, delta) => {
+        const dt = Math.min(delta, 0.1);
+        const inst = instRef.current;
+        let pointer = null;
+        if (ptr.current.inside) {
+            const h = localHit(ptr.current.ndc);
+            if (h)
+                pointer = { x: h.x, y: h.y, nx: ptr.current.ndc.x, ny: ptr.current.ndc.y };
+        }
+        const n = inst.controls.count, a = nav.current.autoplay;
+        if (a > 0 && n > 1 && !nav.current.paused && !nav.current.dragging && !ptr.current.down) {
+            nav.current.autoT += dt;
+            if (nav.current.autoT >= a)
+                controls.next();
+        }
+        else if (a <= 0)
+            nav.current.autoT = 0;
+        inst.update(dt, pointer, { dpr: gl.getPixelRatio(), h: size.height });
+        // every change of index is reported once
+        const i = inst.controls.index;
+        nav.current.index = i;
+        if (i !== nav.current.lastIndex) {
+            const first = nav.current.lastIndex < 0;
+            nav.current.lastIndex = i;
+            nav.current.autoT = 0;
+            if (!first && id)
+                GalleryRuntime.emitChange(id);
+            feedRef.current.t = 1; // sync the feeds now
+        }
+        const fr = feedRef.current;
+        fr.t += dt;
+        if (fr.t >= 0.25) {
+            fr.t = 0;
+            feeds.sync(fr.ids, pictures && urlsRef.current.length ? urlsRef.current[i] : null);
+        }
+    });
+    if (!cfg.enabled)
+        return null;
+    return (_jsx("group", { ref: rootRef, onPointerDown: onPointerDown, onPointerMove: onPointerHover, onPointerOut: onPointerLeave, children: _jsx("primitive", { object: instance.object }) }));
+};
+export default GalleryVariant;

package/dist/components/gallery/kit/feeds.d.ts

@@ -0,0 +1,7 @@
+import * as THREE from 'three';
+export declare function createFeeds(scene: THREE.Object3D): {
+    /** Bring every target in line: `ids` fed with `url` (null = no picture: release them all). */
+    sync(ids: readonly string[], url: string | null | undefined): void;
+    dispose(): void;
+};
+//# sourceMappingURL=feeds.d.ts.map

package/dist/components/gallery/kit/feeds.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"feeds.d.ts","sourceRoot":"","sources":["../../../../src/components/gallery/kit/feeds.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA4B/B,wBAAgB,WAAW,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ;IAwBzC,8FAA8F;cACpF,SAAS,MAAM,EAAE,OAAO,MAAM,GAAG,IAAI,GAAG,SAAS;;EAOlE"}

package/dist/components/gallery/kit/feeds.js

@@ -0,0 +1,83 @@
+import { texturesManager } from '@3driseai/3drise-core';
+function findIn(scene, id) {
+    let found = null;
+    scene.traverse((o) => { if (!found && o.userData?.id === id)
+        found = o; });
+    return found;
+}
+function attached(o, scene) {
+    let p = o;
+    while (p) {
+        if (p === scene)
+            return true;
+        p = p.parent;
+    }
+    return false;
+}
+/** The target's own door: an image object's feedImage, else the first mesh material with a map slot. */
+function doorOf(obj) {
+    let feed;
+    let mesh;
+    obj.traverse((c) => {
+        if (!feed && typeof c.userData?.feedImage === 'function')
+            feed = c.userData.feedImage;
+        const m = c.material;
+        if (!mesh && m && !Array.isArray(m) && 'map' in m)
+            mesh = c;
+    });
+    return feed ? { feed } : mesh ? { mesh } : null;
+}
+const loadTexture = (url) => texturesManager.loadTexture(url.split('/').pop()?.split('.')[0] || `feed-${Date.now()}`, url, 'images');
+export function createFeeds(scene) {
+    const fed = new Map();
+    const send = (id, url) => {
+        let f = fed.get(id);
+        if (f && !attached(f.obj, scene)) {
+            fed.delete(id);
+            f = undefined;
+        } // the target remounted: start over
+        if (f && f.url === url)
+            return;
+        const obj = f?.obj ?? findIn(scene, id);
+        if (!obj)
+            return;
+        const door = doorOf(obj);
+        if (!door)
+            return;
+        if (door.feed) {
+            door.feed(url);
+            if (!f)
+                fed.set(id, { obj, url, release: () => door.feed(null) });
+            else
+                f.url = url;
+            return;
+        }
+        const mesh = door.mesh, mat = mesh.material;
+        if (!f) {
+            const own = mat.map;
+            fed.set(id, { obj, url, release: () => { mat.map = own; mat.needsUpdate = true; } });
+        }
+        else
+            f.url = url;
+        loadTexture(url).then((t) => { if (fed.get(id)?.url === url) {
+            mat.map = t;
+            mat.needsUpdate = true;
+        } }).catch(() => { });
+    };
+    return {
+        /** Bring every target in line: `ids` fed with `url` (null = no picture: release them all). */
+        sync(ids, url) {
+            const want = new Set(url ? ids : []);
+            for (const [id, f] of fed)
+                if (!want.has(id)) {
+                    f.release();
+                    fed.delete(id);
+                }
+            if (url)
+                for (const id of want)
+                    send(id, url);
+        },
+        dispose() { for (const f of fed.values())
+            f.release(); fed.clear(); },
+    };
+}