@solidrt/3d 0.0.48 → 0.0.49

package/src/components.tsx

@@ -21,7 +21,7 @@ import {
   setVisible,
 } from "./scene.ts"
 import type { ShaderParams } from "@solidrt/core/gpu"
-import type { Mesh as MeshNode, Scene as SceneHandle, SceneNode } from "./scene.ts"
+import type { Mesh as MeshNode, Scene as SceneHandle, SceneNode, ScenePointerEvent } from "./scene.ts"
 import type { Geometry } from "./geometry.ts"
 import type { Material } from "./material.ts"
 import type { Quat, Vec3 } from "./math.ts"
@@ -48,7 +48,24 @@ export type TransformProps = {
   visible?: boolean
 }
 
-function syncNode(node: SceneNode, props: TransformProps): void {
+/**
+ * Mesh pointer events, the element vocabulary one tree deeper: the nearest
+ * hit mesh receives the event, down/move/up bubble to ancestor Groups
+ * (stopPropagation stops the walk), enter/leave pair on the mesh alone.
+ * Events flow while the element showing the scene carries scene.handlers -
+ * the built-in <Scene> leaf does (opt out with events={false}); an `output`
+ * leaf spreads them itself.
+ */
+export type PointerEventProps = {
+  onPointerDown?: (event: ScenePointerEvent) => void
+  onPointerMove?: (event: ScenePointerEvent) => void
+  onPointerUp?: (event: ScenePointerEvent) => void
+  /** Meshes only: a Group never receives enter/leave. */
+  onPointerEnter?: (event: ScenePointerEvent) => void
+  onPointerLeave?: (event: ScenePointerEvent) => void
+}
+
+function syncNode(node: SceneNode, props: TransformProps & PointerEventProps): void {
   createEffect(
     () => [props.position, props.rotation, props.quaternion, props.scale, props.visible] as const,
     ([position, rotation, quaternion, scale, visible]) => {
@@ -56,6 +73,16 @@ function syncNode(node: SceneNode, props: TransformProps): void {
       setVisible(node, visible !== false)
     },
   )
+  createEffect(
+    () => [props.onPointerDown, props.onPointerMove, props.onPointerUp, props.onPointerEnter, props.onPointerLeave] as const,
+    ([down, move, up, enter, leave]) => {
+      node.onPointerDown = down
+      node.onPointerMove = move
+      node.onPointerUp = up
+      node.onPointerEnter = enter
+      node.onPointerLeave = leave
+    },
+  )
 }
 
 export type SceneProps = {
@@ -64,6 +91,12 @@ export type SceneProps = {
   width: number
   height: number
   clearColor?: [number, number, number, number]
+  /** Fragment GLSL drawn behind the meshes, inside the scene's own pass
+   * (scene.setBackground): vUV/iResolution/fragColor contract, so a
+   * createShaderTexture backdrop ports verbatim. Reactive - swapping the
+   * source replaces the background; undefined removes it. Three's
+   * `scene.background = color` is `clearColor` here. */
+  background?: string
   label?: string
   ref?: (scene: SceneHandle) => void
   /**
@@ -72,8 +105,16 @@ export type SceneProps = {
    * leaf - a `<d-texture>`, a leaf carrying paint/pointer/layout props, or
    * a post-effect chain (a shader target sampling the id; created in the
    * callback it disposes with the Scene). Return null to render no leaf.
+   * Mesh pointer events then need the scene's handlers on your leaf:
+   * `<texture src={texture} {...useScene().scene.handlers} />`.
    */
   output?: (texture: TextureId) => Element
+  /**
+   * Mesh pointer events (default on): the built-in leaf carries
+   * scene.handlers, so Mesh/Group onPointer* props receive events. `false`
+   * detaches them - the leaf then costs no pointer routing at all.
+   */
+  events?: boolean
 }
 
 /**
@@ -91,14 +132,27 @@ export let Scene: ParentComponent<SceneProps> = props => {
     () => [props.width, props.height] as const,
     ([w, h]) => scene.setSize(w, h),
   )
+  createEffect(
+    () => props.background,
+    b => scene.setBackground(b ?? null),
+  )
   untrack(() => props.ref)?.(scene)
   let output = untrack(() => props.output)
+  let events = untrack(() => props.events) !== false
   return (
     <SceneContext value={{ scene, parent: scene.root }}>
       {output ? (
         untrack(() => output(scene.texture))
       ) : (
-        <texture src={scene.texture} width={props.width} height={props.height} />
+        <texture
+          src={scene.texture}
+          width={props.width}
+          height={props.height}
+          onPointerDown={events ? scene.handlers.onPointerDown : undefined}
+          onPointerMove={events ? scene.handlers.onPointerMove : undefined}
+          onPointerUp={events ? scene.handlers.onPointerUp : undefined}
+          onPointerLeave={events ? scene.handlers.onPointerLeave : undefined}
+        />
       )}
       {props.children}
     </SceneContext>
@@ -106,7 +160,7 @@ export let Scene: ParentComponent<SceneProps> = props => {
 }
 
 /** A transform node: children inherit its position/rotation/scale. */
-export let Group: ParentComponent<TransformProps & { ref?: (node: SceneNode) => void }> = props => {
+export let Group: ParentComponent<TransformProps & PointerEventProps & { ref?: (node: SceneNode) => void }> = props => {
   let ctx = useContext(SceneContext)
   let node = createGroup()
   add(ctx.parent, node)
@@ -116,7 +170,7 @@ export let Group: ParentComponent<TransformProps & { ref?: (node: SceneNode) =>
   return <SceneContext value={{ scene: ctx.scene, parent: node }}>{props.children}</SceneContext>
 }
 
-export type MeshProps = TransformProps & {
+export type MeshProps = TransformProps & PointerEventProps & {
   geometry: Geometry
   material: Material
   /** Per-mesh uniforms for a custom material (setMeshParams as a prop).

package/src/geometry.ts

@@ -63,6 +63,35 @@ export type Geometry = {
   label?: string
   _buffer?: BufferId
   _index?: BufferId
+  _bounds?: Float32Array
+}
+
+/**
+ * The geometry's LOCAL axis-aligned bounds as [minX, minY, minZ, maxX,
+ * maxY, maxZ], computed from the vertices on first use and cached (like
+ * the GPU buffers, geometry is treated as immutable after creation).
+ * Picking's narrowphase volume; a flat geometry legitimately has zero
+ * extent on an axis. An empty geometry yields a zero box at the origin.
+ */
+export function geometryBounds(geometry: Geometry): Float32Array {
+  let bounds = geometry._bounds
+  if (bounds === undefined) {
+    bounds = new Float32Array([Infinity, Infinity, Infinity, -Infinity, -Infinity, -Infinity])
+    let v = geometry.vertices
+    let stride = geometry.layout === "colored" ? COLORED_FLOATS : FLOATS_PER_VERTEX
+    for (let i = 0; i + 2 < v.length; i += stride) {
+      let x = v[i]!, y = v[i + 1]!, z = v[i + 2]!
+      if (x < bounds[0]!) bounds[0] = x
+      if (y < bounds[1]!) bounds[1] = y
+      if (z < bounds[2]!) bounds[2] = z
+      if (x > bounds[3]!) bounds[3] = x
+      if (y > bounds[4]!) bounds[4] = y
+      if (z > bounds[5]!) bounds[5] = z
+    }
+    if (bounds[0]! > bounds[3]!) bounds.fill(0)
+    geometry._bounds = bounds
+  }
+  return bounds
 }
 
 /** The geometry's GPU buffers, created on first use and cached on it,

package/src/index.ts

@@ -6,7 +6,7 @@
 // PerspectiveCamera) on top. See AGENTS.md for the model and the traps.
 
 export { add, createGroup, createMesh, createScene, getRotation, lookAt, remove, setGeometry, setMaterial, setMeshParams, setTransform, setVisible, worldPosition } from "./scene.ts"
-export type { CameraUpdate, Mesh as MeshNode, Scene as SceneHandle, SceneNode, SceneOptions, TransformUpdate } from "./scene.ts"
+export type { CameraUpdate, Hit, Mesh as MeshNode, Scene as SceneHandle, SceneHandlers, SceneNode, SceneOptions, ScenePointerEvent, TransformUpdate } from "./scene.ts"
 export { box, circle, cone, cylinder, disposeGeometry, fillColors, plane, ring, sphere, torus, torusKnot, withColors, FLOATS_PER_VERTEX, VERTEX_LAYOUTS } from "./geometry.ts"
 export type { ColorFill, Geometry, VertexLayout } from "./geometry.ts"
 export { fillet, roundRect, shape, triangulate } from "./profile.ts"
@@ -16,7 +16,7 @@ export type { PathFrames, PathPoint, SweepPath } from "./sweep.ts"
 export { shaderMaterial, unlit } from "./material.ts"
 export type { Material, ShaderMaterialOptions, UnlitOptions } from "./material.ts"
 export { Group, Mesh, PerspectiveCamera, Scene, useScene } from "./components.tsx"
-export type { MeshProps, PerspectiveCameraProps, SceneProps, TransformProps } from "./components.tsx"
+export type { MeshProps, PerspectiveCameraProps, PointerEventProps, SceneProps, TransformProps } from "./components.tsx"
 export { createOrbitCamera } from "./orbit.ts"
 export type { OrbitCamera, OrbitCameraOptions, OrbitPose } from "./orbit.ts"
 // math's lookAt (the camera view matrix) stays on the /math subpath: the

package/src/material.ts

@@ -144,6 +144,43 @@ function needsHeader(source: string): boolean {
   return !source.trimStart().startsWith("#version")
 }
 
+// The scene-background pass (scene.setBackground). The vertex stage is the
+// engine's own attributeless fullscreen triangle (gl_VertexID, no vertex
+// buffer), emitting the SAME vUV the shader-target contract provides: 0..1
+// with origin at the displayed top-left - so a backdrop fragment written
+// for createShaderTexture ports verbatim.
+const BACKGROUND_VERTEX = glsl`
+  out vec2 vUV;
+  void main() {
+    vec2 p = vec2(float((gl_VertexID << 1) & 2), float(gl_VertexID & 2));
+    vUV = p;
+    gl_Position = vec4(p * 2.0 - 1.0, 0.0, 1.0);
+  }
+`
+
+// Pipeline fragments get no vUV from the engine preamble (a pipeline's
+// varyings are its own), so the background slot injects the full
+// shader-target fragment contract itself: vUV, fragColor, iResolution.
+const BACKGROUND_FRAGMENT_PREAMBLE =
+  "#version 300 es\nprecision highp float;\nin vec2 vUV;\nout vec4 fragColor;\nuniform vec2 iResolution;\n"
+
+/** The scene's background pipeline (internal - reached via
+ * scene.setBackground): depth-free, attributeless, drawn as entry zero of
+ * the scene pass. */
+export function backgroundPipeline(fragment: string, label: string): { pipeline: RenderPipelineId; program: ProgramId } {
+  let vs = compileShader("vertex", BACKGROUND_VERTEX, { header: true })
+  let fs = compileShader(
+    "fragment",
+    needsHeader(fragment) ? BACKGROUND_FRAGMENT_PREAMBLE + fragment : fragment,
+    { header: false },
+  )
+  let program = linkProgram(vs, fs, { label })
+  destroyShader(vs)
+  destroyShader(fs)
+  let pipeline = createRenderPipeline(program, { label })
+  return { pipeline, program }
+}
+
 export type ShaderMaterialOptions = {
   /**
    * Vertex stage GLSL. MUST declare and use `uniform mat4 uModel` (the

package/src/math.ts

@@ -57,6 +57,48 @@ export function transformPoint(out: Vec4, m: Mat4, p: Vec3): Vec4 {
   return out
 }
 
+/**
+ * Transform a DIRECTION by m's upper 3x3 (w = 0: rotation and scale apply,
+ * translation does not). The ray-direction counterpart of transformPoint.
+ */
+export function transformVector(out: Vec3, m: Mat4, v: Vec3): Vec3 {
+  let x = v[0], y = v[1], z = v[2]
+  out[0] = m[0] * x + m[4] * y + m[8] * z
+  out[1] = m[1] * x + m[5] * y + m[9] * z
+  out[2] = m[2] * x + m[6] * y + m[10] * z
+  return out
+}
+
+/**
+ * Invert an AFFINE matrix - a world or local matrix whose bottom row is
+ * 0,0,0,1, NOT a projection: the upper 3x3 inverts by cofactors and the
+ * translation is pulled back through it. Picking's world-to-local step.
+ * `out` may alias `m`. A degenerate (zero-scale) matrix yields the raw
+ * cofactors instead of NaNs, the same policy as normalMatrix.
+ */
+export function invertAffine(out: Mat4, m: Mat4): Mat4 {
+  let a = m[0], b = m[4], c = m[8]
+  let d = m[1], e = m[5], f = m[9]
+  let g = m[2], h = m[6], i = m[10]
+  let tx = m[12], ty = m[13], tz = m[14]
+  let c00 = e * i - f * h
+  let c01 = f * g - d * i
+  let c02 = d * h - e * g
+  let det = a * c00 + b * c01 + c * c02
+  let s = 1 / (det || 1)
+  let r00 = c00 * s, r01 = (c * h - b * i) * s, r02 = (b * f - c * e) * s
+  let r10 = c01 * s, r11 = (a * i - c * g) * s, r12 = (c * d - a * f) * s
+  let r20 = c02 * s, r21 = (b * g - a * h) * s, r22 = (a * e - b * d) * s
+  out[0] = r00; out[1] = r10; out[2] = r20; out[3] = 0
+  out[4] = r01; out[5] = r11; out[6] = r21; out[7] = 0
+  out[8] = r02; out[9] = r12; out[10] = r22; out[11] = 0
+  out[12] = -(r00 * tx + r01 * ty + r02 * tz)
+  out[13] = -(r10 * tx + r11 * ty + r12 * tz)
+  out[14] = -(r20 * tx + r21 * ty + r22 * tz)
+  out[15] = 1
+  return out
+}
+
 /** out = a * b (column vectors: b applies first). out may alias a or b. */
 export function multiply(out: Mat4, a: Mat4, b: Mat4): Mat4 {
   let a00 = a[0], a01 = a[1], a02 = a[2], a03 = a[3]