@3driseai/3drise-viewer 0.1.40 → 0.1.42

package/dist/components/gallery/looks/wireRelief.js

@@ -0,0 +1,128 @@
+// The approved lab module, verbatim but for its import paths and the lab's picture loader (Claude outputs/gallery-lab/
+// wire.mjs). Plain JS-shaped code (the viewer compiles non-strict); typed at its one door, kit/GalleryVariant.tsx. Its own DEFAULTS only fill knobs the
+// core defaults (DEFAULT_GALLERY_OBJECTS.wireRelief) do not carry; its own autoplay is never used.
+// wire — "Wire Relief". Every picture is a fine wire mesh lifted by its own brightness (a height field on a
+// regular grid), drawn as hairlines, with colour panels between the wires. An inactive picture is a flat grey wire
+// grid, no panels. When it becomes the active one a soft wave crosses it: behind the wave the grid rises into the
+// picture's relief and the panels fill in with the picture's colour, the wires fading back to a faint tracery over
+// it. Near the cursor the panels lift away and only the wire shows. Self-coloured.
+import * as THREE from 'three';
+import { BASE_DEFAULTS, BASE_GUI_MOTION, BASE_GUI_TAIL, LAYOUT_GUI, baseUniforms, applyBase, baseGlsl, instanced, shaderMaterial, makeGallery, withLean, fragHead } from '../kit/lookBase.js';
+export const catalog = { key: 'wireRelief', name: 'Wire Relief', camera: { position: [1.2, 0.55, 4.3], target: [0, 0, 0] },
+    description: '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.',
+    tags: ['gallery', 'wireframe', 'relief', 'mesh', 'tech', 'interactive'] };
+export const DEFAULTS = {
+    ...BASE_DEFAULTS, type: 'wireRelief', aspect: 1.4, width: 2.2, cells: 56, // structural
+    relief: 0.22, wire: 0.55, wireColor: '#9fb3d9', changeTime: 2.0, dim: 0.5,
+    pointerMode: 'reveal', pointerRadius: 0.5, lift: 0.08,
+};
+export const STRUCTURAL = ['imageUrls', 'aspect', 'width', 'cells'];
+export const POINTER_MODES = ['reveal'];
+export const GUI = [
+    { key: 'lean', min: 0, max: 3, step: 0.01, tip: 'The gallery turns toward the cursor' },
+    { key: 'aspect', min: 0.6, max: 2.5, step: 0.01 }, { key: 'width', min: 1, max: 4, step: 0.01 }, { key: 'cells', min: 12, max: 120, step: 1, tip: 'Grid cells across a picture' },
+    ...LAYOUT_GUI, ...BASE_GUI_MOTION,
+    { key: 'relief', min: 0, max: 0.6, step: 0.005, tip: 'Height of the relief at the brightest point' }, { key: 'wire', min: 0, max: 1.5, step: 0.01, tip: 'Brightness of the wires' },
+    { key: 'pointerMode', options: ['none', ...POINTER_MODES] }, ...BASE_GUI_TAIL, { key: 'lift', min: 0, max: 0.3, step: 0.005, tip: 'How far the panels lift away under the cursor' },
+    { key: 'wireColor', color: true },
+];
+export const PRESETS = [
+    { name: 'Wire', description: 'The default.', patch: {} },
+    { name: 'Survey mesh', description: 'A dense fine grid, low relief.', patch: { cells: 100, relief: 0.12, wire: 0.4 } },
+    { name: 'Terrain', description: 'Coarse grid, deep relief.', patch: { cells: 28, relief: 0.4, wire: 0.8 } },
+];
+export function createUniforms() { return { ...baseUniforms(), uRelief: { value: 0.22 }, uWire: { value: 0.55 }, uLift: { value: 0.08 }, uWireColor: { value: new THREE.Color('#9fb3d9') } }; }
+export function applyConfig(u, c) { const set = applyBase(u, c, POINTER_MODES); set('uRelief', c.relief); set('uWire', c.wire); set('uLift', c.lift); set('uWireColor', c.wireColor); }
+const common = /* glsl */ `
+    precision highp sampler2DArray;
+    uniform sampler2DArray uTex;
+    attribute vec4 aI;
+    ${baseGlsl}
+    uniform float uRelief, uLift;
+    varying vec2 vUv; varying float vImg; varying float vS; varying float vM; varying float vAlpha;
+    vec3 surface(float img, vec2 g, float lift){
+        vec2 p = vec2((g.x - 0.5) * uW, (g.y - 0.5) * uH);
+        float L = lumOf(textureLod(uTex, vec3(g, img), 2.0).rgb);
+        float s = waveAt(actOf(img), g);
+        float m = maskAt(p);
+        vUv = g; vImg = img; vS = s; vM = m; vAlpha = fadeAt(img);
+        return placeAt(img, vec3(p, uRelief * L * s + lift * m * s));
+    }
+`;
+const panelVert = /* glsl */ `
+    ${common}
+    void main(){ gl_Position = projectionMatrix * modelViewMatrix * vec4(surface(aI.x, position.xy + 0.5, uLift), 1.0); }
+`;
+const wireVert = /* glsl */ `
+    ${common}
+    void main(){ gl_Position = projectionMatrix * modelViewMatrix * vec4(surface(aI.x, position.xy + 0.5, 0.0) + vec3(0.0, 0.0, 0.0015), 1.0); }
+`;
+const panelFrag = /* glsl */ `
+    ${fragHead}
+    precision highp sampler2DArray;
+    uniform sampler2DArray uTex;
+    ${baseGlsl}
+    varying vec2 vUv; varying float vImg; varying float vS; varying float vM; varying float vAlpha;
+    void main(){
+        vec3 pic = texture(uTex, vec3(vUv, vImg)).rgb;
+        float a = smoothstep(0.25, 0.95, vS) * (1.0 - 0.95 * vM) * vAlpha * uOpacity;
+        if (a < 0.003) discard;
+        gl_FragColor = vec4(pic * uIntensity * a, a);
+        #include <tonemapping_fragment>
+        #include <colorspace_fragment>
+    }
+`;
+const wireFrag = /* glsl */ `
+    ${fragHead}
+    precision highp sampler2DArray;
+    uniform sampler2DArray uTex;
+    ${baseGlsl}
+    uniform float uWire; uniform vec3 uWireColor;
+    varying vec2 vUv; varying float vImg; varying float vS; varying float vM; varying float vAlpha;
+    void main(){
+        vec3 pic = texture(uTex, vec3(vUv, vImg)).rgb;
+        // grey wire when inactive; over the panels a faint tracery tinted by the picture; full again under the cursor
+        vec3 c = mix(fadedOf(pic) * 1.8 + uWireColor * 0.08, mix(uWireColor, pic, 0.5) * 0.5, vS);
+        float a = uWire * mix(0.9, 0.14, vS * (1.0 - vM)) * vAlpha * uOpacity;
+        if (a < 0.003) discard;
+        gl_FragColor = vec4(c * uIntensity * a, a);
+        #include <tonemapping_fragment>
+        #include <colorspace_fragment>
+    }
+`;
+/** The grid's wires as line segments over a unit plane (-0.5..0.5). */
+function gridLines(cx, cy) {
+    const pos = [];
+    for (let j = 0; j <= cy; j++)
+        for (let i = 0; i < cx; i++) {
+            const y = j / cy - 0.5;
+            pos.push(i / cx - 0.5, y, 0, (i + 1) / cx - 0.5, y, 0);
+        }
+    for (let i = 0; i <= cx; i++)
+        for (let j = 0; j < cy; j++) {
+            const x = i / cx - 0.5;
+            pos.push(x, j / cy - 0.5, 0, x, (j + 1) / cy - 0.5, 0);
+        }
+    const g = new THREE.BufferGeometry();
+    g.setAttribute('position', new THREE.Float32BufferAttribute(pos, 3));
+    return g;
+}
+export function build(u, c) { return withLean(buildGallery(u, c), c); }
+function buildGallery(u, c) {
+    const W = c.width, H = W / c.aspect, cx = Math.max(4, c.cells | 0), cy = Math.max(3, Math.round(cx / c.aspect));
+    const pgeo = instanced(new THREE.PlaneGeometry(1, 1, cx, cy), 1, () => [0, 0]);
+    const wgeo = instanced(gridLines(cx, cy), 1, () => [0, 0]);
+    const pmat = shaderMaterial(u, panelVert, panelFrag);
+    const wmat = shaderMaterial(u, wireVert, wireFrag, { depthWrite: false });
+    const panels = new THREE.Mesh(pgeo, pmat);
+    panels.frustumCulled = false;
+    panels.raycast = () => { };
+    const wires = new THREE.LineSegments(wgeo, wmat);
+    wires.frustumCulled = false;
+    wires.raycast = () => { };
+    wires.renderOrder = 1;
+    const g = makeGallery(u, c, { W, H, meshes: [panels, wires], setCount: (n) => { pgeo.instanceCount = n; wgeo.instanceCount = n; } });
+    const apply = g.apply;
+    g.apply = (k) => { apply(k); applyConfig(u, k); };
+    return g;
+}

package/dist/components/image/ContourImage.d.ts

@@ -0,0 +1,7 @@
+import type { ContourImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type ContourImageProps = ImageVariantProps<ContourImageConfig>;
+/** The picture as a topographic map of itself: a change opens it into hairline contour lines that lift into a floating stack in depth and flow continuously into the new picture's contours before it fills back in. Use for tech, data, science and architecture. */
+declare const ContourImage: import("react").FC<ImageVariantProps<ContourImageConfig>>;
+export default ContourImage;
+//# sourceMappingURL=ContourImage.d.ts.map

package/dist/components/image/ContourImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContourImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/ContourImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,iBAAiB,GAAG,iBAAiB,CAAC,kBAAkB,CAAC,CAAC;AAEtE,sQAAsQ;AACtQ,QAAA,MAAM,YAAY,2DAAuI,CAAC;AAC1J,eAAe,YAAY,CAAC"}

package/dist/components/image/ContourImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/contour.js';
+/** The picture as a topographic map of itself: a change opens it into hairline contour lines that lift into a floating stack in depth and flow continuously into the new picture's contours before it fills back in. Use for tech, data, science and architecture. */
+const ContourImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.contour, IMAGE_OBJECTS_ANIMATABLE.contour);
+export default ContourImage;

package/dist/components/image/EngravingImage.d.ts

@@ -0,0 +1,7 @@
+import type { EngravingImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type EngravingImageProps = ImageVariantProps<EngravingImageConfig>;
+/** The picture as an ink engraving on paper, fine strokes laid along its own isophotes, dense where it is dark, at a depth set by brightness; a change lifts and turns every stroke to the new picture's flow like filings in a field. Use for luxury, editorial, banknote and art direction. */
+declare const EngravingImage: import("react").FC<ImageVariantProps<EngravingImageConfig>>;
+export default EngravingImage;
+//# sourceMappingURL=EngravingImage.d.ts.map

package/dist/components/image/EngravingImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EngravingImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/EngravingImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;AAE1E,iSAAiS;AACjS,QAAA,MAAM,cAAc,6DAA+I,CAAC;AACpK,eAAe,cAAc,CAAC"}

package/dist/components/image/EngravingImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/engraving.js';
+/** The picture as an ink engraving on paper, fine strokes laid along its own isophotes, dense where it is dark, at a depth set by brightness; a change lifts and turns every stroke to the new picture's flow like filings in a field. Use for luxury, editorial, banknote and art direction. */
+const EngravingImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.engraving, IMAGE_OBJECTS_ANIMATABLE.engraving);
+export default EngravingImage;

package/dist/components/image/FrostImage.d.ts

@@ -0,0 +1,7 @@
+import type { FrostImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type FrostImageProps = ImageVariantProps<FrostImageConfig>;
+/** A print behind a pane of real glass; a change is a breath of frost that feathers in from the edges, blurs the print through the glass, and clears from the centre to reveal the new picture; the cursor wipes the glass. Use for winter, luxury, beauty and calm editorial. */
+declare const FrostImage: import("react").FC<ImageVariantProps<FrostImageConfig>>;
+export default FrostImage;
+//# sourceMappingURL=FrostImage.d.ts.map

package/dist/components/image/FrostImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FrostImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/FrostImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,eAAe,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;AAElE,kRAAkR;AAClR,QAAA,MAAM,UAAU,yDAA+H,CAAC;AAChJ,eAAe,UAAU,CAAC"}

package/dist/components/image/FrostImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/frost.js';
+/** A print behind a pane of real glass; a change is a breath of frost that feathers in from the edges, blurs the print through the glass, and clears from the centre to reveal the new picture; the cursor wipes the glass. Use for winter, luxury, beauty and calm editorial. */
+const FrostImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.frost, IMAGE_OBJECTS_ANIMATABLE.frost);
+export default FrostImage;

package/dist/components/image/LenticularImage.d.ts

@@ -0,0 +1,7 @@
+import type { LenticularImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type LenticularImageProps = ImageVariantProps<LenticularImageConfig>;
+/** A lenticular print: fine lenses over interleaved strips of the old and new picture; a change sweeps the flip across the sheet and depends on the viewing angle, with ribbed clearcoat highlights from the scene light. Use for collectibles, posters, fashion and retail. */
+declare const LenticularImage: import("react").FC<ImageVariantProps<LenticularImageConfig>>;
+export default LenticularImage;
+//# sourceMappingURL=LenticularImage.d.ts.map

package/dist/components/image/LenticularImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LenticularImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/LenticularImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAEnE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,oBAAoB,GAAG,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;AAE5E,gRAAgR;AAChR,QAAA,MAAM,eAAe,8DAAmJ,CAAC;AACzK,eAAe,eAAe,CAAC"}

package/dist/components/image/LenticularImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/lenticular.js';
+/** A lenticular print: fine lenses over interleaved strips of the old and new picture; a change sweeps the flip across the sheet and depends on the viewing angle, with ribbed clearcoat highlights from the scene light. Use for collectibles, posters, fashion and retail. */
+const LenticularImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.lenticular, IMAGE_OBJECTS_ANIMATABLE.lenticular);
+export default LenticularImage;

package/dist/components/image/PinscreenImage.d.ts

@@ -0,0 +1,7 @@
+import type { PinscreenImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type PinscreenImageProps = ImageVariantProps<PinscreenImageConfig>;
+/** The picture as a pinscreen of fine metal pins, each standing out by the brightness under it with a domed head in the picture's colour; a change is a pressure wave that sinks the pins and raises the new relief. Use for tech, product and sculptural heroes. */
+declare const PinscreenImage: import("react").FC<ImageVariantProps<PinscreenImageConfig>>;
+export default PinscreenImage;
+//# sourceMappingURL=PinscreenImage.d.ts.map

package/dist/components/image/PinscreenImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PinscreenImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/PinscreenImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;AAE1E,qQAAqQ;AACrQ,QAAA,MAAM,cAAc,6DAA+I,CAAC;AACpK,eAAe,cAAc,CAAC"}

package/dist/components/image/PinscreenImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/pinscreen.js';
+/** The picture as a pinscreen of fine metal pins, each standing out by the brightness under it with a domed head in the picture's colour; a change is a pressure wave that sinks the pins and raises the new relief. Use for tech, product and sculptural heroes. */
+const PinscreenImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.pinscreen, IMAGE_OBJECTS_ANIMATABLE.pinscreen);
+export default PinscreenImage;

package/dist/components/image/PrismImage.d.ts

@@ -0,0 +1,7 @@
+import type { PrismImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type PrismImageProps = ImageVariantProps<PrismImageConfig>;
+/** The picture printed across a row of slim triangular prisms; a change turns each prism a third of a turn in a travelling wave, its faces passing through the scene light, to show the next picture. Use for signage, retail, product and campaign heroes. */
+declare const PrismImage: import("react").FC<ImageVariantProps<PrismImageConfig>>;
+export default PrismImage;
+//# sourceMappingURL=PrismImage.d.ts.map

package/dist/components/image/PrismImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PrismImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/PrismImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,eAAe,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;AAElE,+PAA+P;AAC/P,QAAA,MAAM,UAAU,yDAA+H,CAAC;AAChJ,eAAe,UAAU,CAAC"}

package/dist/components/image/PrismImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/prism.js';
+/** The picture printed across a row of slim triangular prisms; a change turns each prism a third of a turn in a travelling wave, its faces passing through the scene light, to show the next picture. Use for signage, retail, product and campaign heroes. */
+const PrismImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.prism, IMAGE_OBJECTS_ANIMATABLE.prism);
+export default PrismImage;

package/dist/components/image/ProjectorImage.d.ts

@@ -0,0 +1,7 @@
+import type { ProjectorImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type ProjectorImageProps = ImageVariantProps<ProjectorImageConfig>;
+/** The picture as projected light on a matte screen, thrown from a lens above, with a visible haze beam and dust lit by the image; a change racks focus and slides the next slide through the gate. Use for cinema, exhibitions, moody and nostalgic scenes. */
+declare const ProjectorImage: import("react").FC<ImageVariantProps<ProjectorImageConfig>>;
+export default ProjectorImage;
+//# sourceMappingURL=ProjectorImage.d.ts.map

package/dist/components/image/ProjectorImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectorImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/ProjectorImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;AAE1E,gQAAgQ;AAChQ,QAAA,MAAM,cAAc,6DAA+I,CAAC;AACpK,eAAe,cAAc,CAAC"}

package/dist/components/image/ProjectorImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/projector.js';
+/** The picture as projected light on a matte screen, thrown from a lens above, with a visible haze beam and dust lit by the image; a change racks focus and slides the next slide through the gate. Use for cinema, exhibitions, moody and nostalgic scenes. */
+const ProjectorImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.projector, IMAGE_OBJECTS_ANIMATABLE.projector);
+export default ProjectorImage;

package/dist/components/image/ReliefImage.d.ts

@@ -0,0 +1,7 @@
+import type { ReliefImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type ReliefImageProps = ImageVariantProps<ReliefImageConfig>;
+/** The picture embossed into paper by its own local contrast and lit by the scene; a change is a soft press travelling across the sheet, flattening the old impression and raising the new one as its ink lays down. Use for editorial, print, craft and product heroes. */
+declare const ReliefImage: import("react").FC<ImageVariantProps<ReliefImageConfig>>;
+export default ReliefImage;
+//# sourceMappingURL=ReliefImage.d.ts.map

package/dist/components/image/ReliefImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReliefImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/ReliefImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;AAEpE,4QAA4Q;AAC5Q,QAAA,MAAM,WAAW,0DAAmI,CAAC;AACrJ,eAAe,WAAW,CAAC"}

package/dist/components/image/ReliefImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/relief.js';
+/** The picture embossed into paper by its own local contrast and lit by the scene; a change is a soft press travelling across the sheet, flattening the old impression and raising the new one as its ink lays down. Use for editorial, print, craft and product heroes. */
+const ReliefImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.relief, IMAGE_OBJECTS_ANIMATABLE.relief);
+export default ReliefImage;

package/dist/components/image/RollImage.d.ts

@@ -0,0 +1,7 @@
+import type { RollImageConfig } from '@3driseai/3drise-core';
+import type { ImageVariantProps } from './imageVariant';
+export type RollImageProps = ImageVariantProps<RollImageConfig>;
+/** A print on paper; a change is a slim paper roll travelling across it, winding up the old print and laying down the new one, lit and shadowed by the scene. Use for editorial, stationery, packaging and calm product heroes. */
+declare const RollImage: import("react").FC<ImageVariantProps<RollImageConfig>>;
+export default RollImage;
+//# sourceMappingURL=RollImage.d.ts.map

package/dist/components/image/RollImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RollImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/RollImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQxD,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAAC,eAAe,CAAC,CAAC;AAEhE,mOAAmO;AACnO,QAAA,MAAM,SAAS,wDAA2H,CAAC;AAC3I,eAAe,SAAS,CAAC"}

package/dist/components/image/RollImage.js

@@ -0,0 +1,6 @@
+import { DEFAULT_IMAGE_OBJECTS, IMAGE_OBJECTS_ANIMATABLE } from '@3driseai/3drise-core';
+import { makeImageVariant } from './imageVariant.js';
+import * as variant from './core/roll.js';
+/** A print on paper; a change is a slim paper roll travelling across it, winding up the old print and laying down the new one, lit and shadowed by the scene. Use for editorial, stationery, packaging and calm product heroes. */
+const RollImage = makeImageVariant(variant, DEFAULT_IMAGE_OBJECTS.roll, IMAGE_OBJECTS_ANIMATABLE.roll);
+export default RollImage;

package/dist/components/image/ShardsImage.d.ts

@@ -0,0 +1,126 @@
+import React from 'react';
+import * as THREE from 'three';
+import type { AnimationOptions, MouseMoveDomain, ShardsImageConfig } from '@3driseai/3drise-core';
+import type { ObjectReadyProps } from '../../types/objectReady';
+export declare const POINTER_MODES: readonly ["tilt", "lift", "ripple"];
+export declare const ORDERS: readonly ["sweep", "radial", "random"];
+type Uniforms = ReturnType<typeof createUniforms>;
+export declare function createUniforms(): {
+    uTexA: {
+        value: THREE.Texture | null;
+    };
+    uTexB: {
+        value: THREE.Texture | null;
+    };
+    /** cover-fit of each picture into the slab: scale.xy, offset.xy */
+    uFitA: {
+        value: THREE.Vector4;
+    };
+    uFitB: {
+        value: THREE.Vector4;
+    };
+    uPhase: {
+        value: number;
+    };
+    uSweep: {
+        value: THREE.Vector2;
+    };
+    uOrder: {
+        value: number;
+    };
+    uSpread: {
+        value: number;
+    };
+    uJitter: {
+        value: number;
+    };
+    uLift: {
+        value: number;
+    };
+    uDrift: {
+        value: number;
+    };
+    uSpin: {
+        value: number;
+    };
+    uBreathe: {
+        value: number;
+    };
+    uSeams: {
+        value: number;
+    };
+    uTime: {
+        value: number;
+    };
+    uHalfH: {
+        value: number;
+    };
+    uKbZoom: {
+        value: number;
+    };
+    uKbPan: {
+        value: THREE.Vector2;
+    };
+    uEdgeColor: {
+        value: THREE.Color;
+    };
+    uRimColor: {
+        value: THREE.Color;
+    };
+    uPointerColor: {
+        value: THREE.Color;
+    };
+    uRim: {
+        value: number;
+    };
+    uIntensity: {
+        value: number;
+    };
+    uOpacity: {
+        value: number;
+    };
+    uPointer: {
+        value: THREE.Vector3;
+    };
+    uPointerVel: {
+        value: THREE.Vector3;
+    };
+    uPointerActive: {
+        value: number;
+    };
+    uPointerMode: {
+        value: number;
+    };
+    uPointerStrength: {
+        value: number;
+    };
+    uPointerRadius: {
+        value: number;
+    };
+    uPointerT: {
+        value: number;
+    };
+    uBackColor: {
+        value: THREE.Color;
+    };
+    uFlight: {
+        value: number;
+    };
+};
+/** Every non-structural knob reaches a uniform here — the single door; the animatable list is what it writes. */
+export declare function applyConfig(u: Uniforms, c: Record<string, unknown>): void;
+export interface ShardsImageProps extends ObjectReadyProps {
+    config: ShardsImageConfig;
+    /** Scene object id: the live-edit handle is found by it. */
+    id?: string;
+    /** Keyframes on the config knobs (animations.image.animations). */
+    keyframes?: AnimationOptions[];
+    /** Pointer bindings on the config knobs (mouseMove.image). */
+    mouseMove?: MouseMoveDomain;
+}
+/**
+ * A picture tessellated into shards that lift, flip edge-on and land as the next picture in a travelling wave whenever the image changes; the cursor tilts, lifts or ripples the shards. Use for hero images, portfolios and product reveals.
+ */
+declare const ShardsImage: React.FC<ShardsImageProps>;
+export default ShardsImage;
+//# sourceMappingURL=ShardsImage.d.ts.map

package/dist/components/image/ShardsImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShardsImage.d.ts","sourceRoot":"","sources":["../../../src/components/image/ShardsImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmE,MAAM,OAAO,CAAC;AACxF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAClG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AA0BhE,eAAO,MAAM,aAAa,qCAAsC,CAAC;AACjE,eAAO,MAAM,MAAM,wCAAyC,CAAC;AAE7D,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAqBlD,wBAAgB,cAAc;;eAEE,KAAK,CAAC,OAAO,GAAG,IAAI;;;eAA4B,KAAK,CAAC,OAAO,GAAG,IAAI;;IAC5F,mEAAmE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmB1E;AAED,iHAAiH;AACjH,wBAAgB,WAAW,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,QAgBlE;AA4OD,MAAM,WAAW,gBAAiB,SAAQ,gBAAgB;IACtD,MAAM,EAAE,iBAAiB,CAAC;IAC1B,4DAA4D;IAC5D,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,mEAAmE;IACnE,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,8DAA8D;IAC9D,SAAS,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED;;GAEG;AACH,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAkG3C,CAAC;AAEF,eAAe,WAAW,CAAC"}