@opsydyn/effect-three 0.3.0 → 0.6.4

package/src/kernel/describeScene.ts

@@ -0,0 +1,224 @@
+/**
+ * What a scene contains, for an assistant (roadmap, "Beyond parity" 3): its camera, its
+ * things with their kind, size, colour and place, its lights, the box they fill and its
+ * staging, as data (`describeScene`) and as a few lines of text (`formatSummary`) an
+ * agent reads before it acts. An agent that reads the Model can describe a scene
+ * without three.js, so sizes come from the geometry's parameters and the node's scale:
+ * close enough to place things beside one another and to frame a shot.
+ *
+ * @module
+ */
+import type {
+  GeometryRef,
+  Rgb,
+  SceneDescription,
+  SceneNode,
+  ShapeGeometry,
+  Vec3,
+} from './description.ts';
+import type { Box } from './orbit.ts';
+
+export type ThingSummary = {
+  readonly key: string;
+  /** The node's kind, with its geometry's for a mesh: `Mesh (Box)`. */
+  readonly kind: string;
+  /** In its parent's space; for things at the top, the world's. */
+  readonly position: Vec3;
+  /** Width, height and depth, from the geometry and scale; `null` when not known. */
+  readonly size: Vec3 | null;
+  readonly colour: Rgb | null;
+  /** The group it is in, `null` at the top. */
+  readonly parent: string | null;
+};
+
+export type LightSummary = {
+  readonly key: string;
+  readonly kind: string;
+  readonly colour: Rgb;
+  readonly intensity: number;
+  readonly position: Vec3 | null;
+};
+
+export type SceneSummary = {
+  readonly camera: {
+    readonly kind: 'Perspective' | 'Orthographic';
+    readonly position: Vec3;
+    readonly lookAt: Vec3;
+  };
+  readonly things: ReadonlyArray<ThingSummary>;
+  readonly lights: ReadonlyArray<LightSummary>;
+  /** The box the top-level things of known size fill, `null` with none. */
+  readonly bounds: Box | null;
+  readonly staging: ReadonlyArray<string>;
+};
+
+/** Width, height and depth of a shape, unscaled; `undefined` for text and shapes. */
+const extentOf = (geometry: ShapeGeometry): Vec3 | undefined => {
+  switch (geometry._tag) {
+    case 'Box':
+    case 'RoundedBox':
+      return [geometry.width, geometry.height, geometry.depth];
+    case 'Sphere':
+      return [geometry.radius * 2, geometry.radius * 2, geometry.radius * 2];
+    case 'Cone':
+      return [geometry.radius * 2, geometry.height, geometry.radius * 2];
+    case 'Cylinder': {
+      const across = Math.max(geometry.radiusTop, geometry.radiusBottom) * 2;
+      return [across, geometry.height, across];
+    }
+    case 'Capsule':
+      return [geometry.radius * 2, geometry.height + geometry.radius * 2, geometry.radius * 2];
+    case 'Torus': {
+      const across = (geometry.radius + geometry.tube) * 2;
+      return [across, across, geometry.tube * 2];
+    }
+    case 'Plane':
+      return [geometry.width, geometry.height, 0];
+    case 'Circle':
+      return [geometry.radius * 2, geometry.radius * 2, 0];
+    case 'Ring':
+      return [geometry.outerRadius * 2, geometry.outerRadius * 2, 0];
+    default:
+      return undefined;
+  }
+};
+
+const scaled = (extent: Vec3, scale: Vec3): Vec3 => [
+  extent[0] * Math.abs(scale[0]),
+  extent[1] * Math.abs(scale[1]),
+  extent[2] * Math.abs(scale[2]),
+];
+
+/** The shape a geometry reference draws: its own, a shared one's, or none (lent). */
+const shapeOf = (
+  geometry: GeometryRef,
+  description: SceneDescription,
+): ShapeGeometry | undefined => {
+  if (geometry._tag === 'LentGeometry') return undefined;
+  if (geometry._tag !== 'SharedGeometry') return geometry;
+  return description.resources.geometries.find((entry) => entry.id === geometry.id)?.geometry;
+};
+
+const sizeOf = (node: SceneNode, description: SceneDescription): Vec3 | null => {
+  if (node._tag !== 'Mesh') return null;
+  const shape = shapeOf(node.geometry, description);
+  const extent = shape === undefined ? undefined : extentOf(shape);
+  return extent === undefined ? null : scaled(extent, node.scale);
+};
+
+const colourOf = (node: SceneNode): Rgb | null =>
+  node._tag === 'Mesh' && 'color' in node.material ? node.material.color : null;
+
+const kindOf = (node: SceneNode): string =>
+  node._tag === 'Mesh' ? `Mesh (${node.geometry._tag})` : node._tag;
+
+const isLight = (node: SceneNode): boolean => node._tag.endsWith('Light');
+
+const lightOf = (node: SceneNode): ReadonlyArray<LightSummary> => {
+  if (!isLight(node) || !('color' in node) || !('intensity' in node)) return [];
+  return [
+    {
+      key: node.key,
+      kind: node._tag,
+      colour: node.color,
+      intensity: node.intensity,
+      position: 'position' in node ? node.position : null,
+    },
+  ];
+};
+
+const thingsIn = (
+  nodes: ReadonlyArray<SceneNode>,
+  parent: string | null,
+  description: SceneDescription,
+): ReadonlyArray<ThingSummary> =>
+  nodes.flatMap((node) => [
+    ...(isLight(node)
+      ? []
+      : [
+          {
+            key: node.key,
+            kind: kindOf(node),
+            position: 'position' in node ? node.position : ([0, 0, 0] as const),
+            size: sizeOf(node, description),
+            colour: colourOf(node),
+            parent,
+          },
+        ]),
+    ...(node._tag === 'Group' ? thingsIn(node.children, node.key, description) : []),
+  ]);
+
+const lightsIn = (nodes: ReadonlyArray<SceneNode>): ReadonlyArray<LightSummary> =>
+  nodes.flatMap((node) => [
+    ...lightOf(node),
+    ...(node._tag === 'Group' ? lightsIn(node.children) : []),
+  ]);
+
+/** The box top-level things of known size fill, each taken as a box round its place. */
+export const thingsBounds = (things: ReadonlyArray<ThingSummary>): Box | null => {
+  const sized = things.filter((thing) => thing.parent === null && thing.size !== null);
+  if (sized.length === 0) return null;
+  const edge = (axis: 0 | 1 | 2, sign: 1 | -1): ReadonlyArray<number> =>
+    sized.map((thing) => thing.position[axis] + sign * ((thing.size?.[axis] ?? 0) / 2));
+  const low = (axis: 0 | 1 | 2) => Math.min(...edge(axis, -1));
+  const high = (axis: 0 | 1 | 2) => Math.max(...edge(axis, 1));
+  return { min: [low(0), low(1), low(2)], max: [high(0), high(1), high(2)] };
+};
+
+const stagingOf = (description: SceneDescription): ReadonlyArray<string> => [
+  ...(description.environment === null ? [] : ['environment lighting']),
+  ...(description.sky === null ? [] : ['sky']),
+  ...(description.render.shadows === 'off' ? [] : [`${description.render.shadows} shadows`]),
+  ...(description.contactShadows === null ? [] : ['contact shadows']),
+  ...description.render.effects.map((effect) => effect._tag.toLowerCase()),
+  ...(description.physics === null ? [] : ['physics']),
+];
+
+/** What `description` contains, for an assistant to read. */
+export const describeScene = (description: SceneDescription): SceneSummary => {
+  const things = thingsIn(description.children, null, description);
+  return {
+    camera: {
+      kind: description.camera._tag,
+      position: description.camera.position,
+      lookAt: description.camera.lookAt,
+    },
+    things,
+    lights: lightsIn(description.children),
+    bounds: thingsBounds(things),
+    staging: stagingOf(description),
+  };
+};
+
+const number = (value: number): string => String(Math.round(value * 100) / 100);
+const point = (at: Vec3): string => `(${at.map(number).join(', ')})`;
+const hex = (colour: Rgb): string => `#${colour.toString(16).padStart(6, '0')}`;
+
+const thingLine = (thing: ThingSummary): string =>
+  [
+    `- ${thing.key}: ${thing.kind}`,
+    thing.size === null ? '' : `, ${thing.size.map(number).join(' × ')}`,
+    thing.colour === null ? '' : `, ${hex(thing.colour)}`,
+    `, at ${point(thing.position)}`,
+    thing.parent === null ? '' : ` in ${thing.parent}`,
+  ].join('');
+
+const lightLine = (light: LightSummary): string =>
+  `- ${light.key}: ${light.kind}, ${hex(light.colour)} × ${number(light.intensity)}${
+    light.position === null ? '' : ` at ${point(light.position)}`
+  }`;
+
+/** The summary as a few lines of text, for a prompt or a tool's answer. */
+export const formatSummary = (summary: SceneSummary): string =>
+  [
+    `Camera: ${summary.camera.kind.toLowerCase()} at ${point(summary.camera.position)}, looking at ${point(summary.camera.lookAt)}`,
+    `Things (${summary.things.length})${
+      summary.bounds === null
+        ? ''
+        : `, within ${point(summary.bounds.min)} to ${point(summary.bounds.max)}`
+    }:`,
+    ...summary.things.map(thingLine),
+    `Lights (${summary.lights.length}):`,
+    ...summary.lights.map(lightLine),
+    `Staging: ${summary.staging.length === 0 ? 'none' : summary.staging.join(', ')}`,
+  ].join('\n');

package/src/kernel/description.ts

@@ -208,6 +208,11 @@ export type BasicMaterial = {
   readonly transparent: boolean;
   readonly side: MaterialSide;
   readonly wireframe: boolean;
+  /**
+   * Whether it is hidden behind what is nearer, as usual; `false` draws it over
+   * everything (and writes no depth), as three's gizmos and helpers are drawn.
+   */
+  readonly depthTest: boolean;
 };
 
 /** A matte (Lambertian) material: cheap per-vertex lighting, no highlights. */
@@ -390,6 +395,8 @@ export type GroupNode = {
    * distance (Drei's `Detailed`, three's `LOD`), or `null` to show them all.
    */
   readonly detail: Detail | null;
+  /** A ribbon behind the group as it moves (Drei's `Trail`), or `null` for none. */
+  readonly trail: Trail | null;
 };
 
 /**
@@ -470,6 +477,47 @@ export type MeshNode = {
   readonly receiveShadow: boolean;
   /** A rigid body simulating the mesh, when the scene has `physics`; `null` for none. */
   readonly body: Body | null;
+  /** Lines along the mesh's hard edges (Drei's `Edges`), or `null` for none. */
+  readonly edges: Edges | null;
+  /** A ribbon behind the mesh as it moves (Drei's `Trail`), or `null` for none. */
+  readonly trail: Trail | null;
+};
+
+/**
+ * A trail behind a moving node, as Drei's `Trail`: `length × 10` points of where it has
+ * been, a new one every `interval` steps (60 a second of scene time) when it has moved at
+ * least `stride`, `decay` of them at a time; drawn as a ribbon facing the camera, a tenth
+ * of `width` wide in scene units, narrowing (`taper`) and fading (`fade`) to the tail.
+ * `local` follows the node's own position rather than its world position, as Drei's
+ * does; the ribbon is drawn in the scene's space either way.
+ */
+export type Trail = {
+  readonly width: number;
+  readonly length: number;
+  readonly decay: number;
+  readonly local: boolean;
+  readonly stride: number;
+  readonly interval: number;
+  readonly color: Rgb;
+  readonly taper: 'none' | 'linear' | 'quadratic';
+  readonly fade: boolean;
+};
+
+/**
+ * Lines along a mesh's edges where its faces meet at more than `threshold` degrees
+ * (three's `EdgesGeometry`, as Drei's `Edges`), drawn as a line (`width` pixels, or scene
+ * units with `worldUnits`) by the render kit. Never picked: hits go to the mesh.
+ */
+export type Edges = {
+  readonly threshold: number;
+  readonly color: Rgb;
+  readonly width: number;
+  readonly worldUnits: boolean;
+  readonly dashed: boolean;
+  readonly dashSize: number;
+  readonly gapSize: number;
+  readonly opacity: number;
+  readonly transparent: boolean;
 };
 
 /**
@@ -577,12 +625,56 @@ export type Physics = {
   readonly paused: boolean;
   readonly timeStep: number;
   readonly interpolate: boolean;
+  /**
+   * The step the Model lets the world reach, for a simulation that must run alike
+   * wherever it runs (lockstep, replays; ADR-014). The world advances toward it in fixed
+   * steps at scene time's pace (faster when far behind), stops there and reports
+   * `PhysicsReached`; whatever the description changes while it waits applies at that
+   * step, on every peer. Steps count from 0 when the world is made, and the world never
+   * goes back: a lower `until` holds it where it is. `null` (the default): the world runs
+   * on scene time alone, as react-three-rapier's does.
+   */
+  readonly until: number | null;
+  /**
+   * Which run of the simulation this is: a new number throws the world away and starts
+   * another at step 0, for a peer that takes a session's record and replays it, or a
+   * replay starting over. `0` by default.
+   */
+  readonly run: number;
+  /**
+   * A step the world also stops at on its way to `until`, to report there with a
+   * snapshot of itself (`PhysicsReached.snapshot`) for another world to start `from`. It
+   * does not wait there. `null` (the default): no snapshot. An engine that cannot take
+   * one reports there without.
+   */
+  readonly snapshotAt: number | null;
+  /**
+   * Where a run starts: a snapshot and the step it was taken at. The world is made from
+   * it, holding the bodies and joints it held, and counts on from that step, going
+   * straight to `until`; bodies the description has and it lacks are added where
+   * described. Read only when a run starts; `null` (the default): from the description,
+   * at step 0.
+   */
+  readonly from: PhysicsStart | null;
+  /**
+   * How many of its latest stops (each step it reported at) the world keeps a snapshot
+   * of, itself, for a run to start `from` without one in the description: to roll back
+   * a few steps and go again with an input that came late. `0` (the default): none.
+   */
+  readonly keep: number;
   /** Draw every collider and joint as lines, as react-three-rapier's `<Physics debug>`. */
   readonly debug: boolean;
   /** Joints between bodies, each active while both its bodies exist. */
   readonly joints: ReadonlyArray<Joint>;
 };
 
+/**
+ * Where a run starts: the step, and a world's snapshot there (base64, as
+ * `PhysicsReached` carries it), or `null` for the one the world kept at that step itself
+ * (`keep`). A step it did not keep starts from the description, at step 0.
+ */
+export type PhysicsStart = { readonly step: number; readonly snapshot: string | null };
+
 /** A body a joint holds: a node's, or one instance's of an instances node. */
 export type BodyRef = { readonly key: string; readonly instance: string | null };
 
@@ -928,8 +1020,106 @@ export type ShaderGridNode = {
   readonly side: MaterialSide;
 };
 
+/**
+ * A line through points, as Drei's `Line` (three's fat lines, `Line2`): `width` pixels
+ * wide on screen, or scene units with `worldUnits`; one colour, or one per point; solid
+ * or dashed. With `segments` each pair of points is its own segment (Drei's `Segments`).
+ * A render kit draws it; without one it is an empty group.
+ */
+export type LineNode = {
+  readonly _tag: 'Line';
+  readonly key: string;
+  readonly position: Vec3;
+  readonly rotation: Rotation;
+  readonly scale: Vec3;
+  readonly transition: Transition;
+  readonly behaviour: Behave | null;
+  /** Makes the line pickable, within its width. */
+  readonly interactive: boolean;
+  readonly points: ReadonlyArray<Vec3>;
+  readonly segments: boolean;
+  readonly color: Rgb;
+  /** A colour for each point, blended along the line, or `null` for `color` throughout. */
+  readonly vertexColors: ReadonlyArray<Rgb> | null;
+  readonly width: number;
+  readonly worldUnits: boolean;
+  readonly dashed: boolean;
+  readonly dashSize: number;
+  readonly gapSize: number;
+  readonly dashScale: number;
+  readonly dashOffset: number;
+  readonly opacity: number;
+  readonly transparent: boolean;
+};
+
+/**
+ * Points, drawn by the render kit as round or square dots, Drei's sparkles or its
+ * stars. The look says which, and carries everything needed to draw them: given
+ * points, or a seed that scatters them the same way every time.
+ */
+export type PointsNode = {
+  readonly _tag: 'Points';
+  readonly key: string;
+  readonly position: Vec3;
+  readonly rotation: Rotation;
+  readonly scale: Vec3;
+  readonly transition: Transition;
+  readonly behaviour: Behave | null;
+  readonly look: PointLook;
+};
+
+/**
+ * What points look like:
+ *
+ * - `Dots`: Drei's `Points` with its `PointMaterial` (three's `PointsMaterial`, `round`
+ *   to circles): `size` pixels across, smaller with distance under `sizeAttenuation`;
+ *   one colour or one a point, one size or a factor a point.
+ * - `Sparkles`: Drei's `Sparkles`: `count` glowing motes scattered through a box of
+ *   `scale`, drifting by `noise` at `speed`.
+ * - `Stars`: Drei's `Stars`: `count` stars in a shell from `radius` to `radius + depth`,
+ *   `factor` sizing them, twinkling at `speed`, `fade` softening their edges.
+ */
+export type PointLook =
+  | {
+      readonly _tag: 'Dots';
+      readonly positions: ReadonlyArray<Vec3>;
+      readonly colors: ReadonlyArray<Rgb> | null;
+      readonly sizes: ReadonlyArray<number> | null;
+      readonly color: Rgb;
+      readonly size: number;
+      readonly sizeAttenuation: boolean;
+      readonly round: boolean;
+      readonly opacity: number;
+      readonly transparent: boolean;
+    }
+  | {
+      readonly _tag: 'Sparkles';
+      readonly count: number;
+      readonly speed: number;
+      readonly opacity: number;
+      readonly scale: Vec3;
+      /** Each mote's size, or `null` for Drei's: random, up to 1. */
+      readonly size: number | null;
+      readonly color: Rgb;
+      readonly noise: Vec3;
+      readonly seed: number;
+    }
+  | {
+      readonly _tag: 'Stars';
+      readonly radius: number;
+      readonly depth: number;
+      readonly count: number;
+      readonly factor: number;
+      readonly saturation: number;
+      readonly fade: boolean;
+      readonly speed: number;
+      readonly seed: number;
+    };
+
 /** Any node in a scene. Keys are unique across the whole scene. */
 export type SceneNode =
+  | PointsNode
+  | LineNode
   | GridNode
   | ShaderGridNode
   | GroupNode
@@ -1080,6 +1270,33 @@ export type ViewRect = {
  */
 export type View = { readonly key: string; readonly camera: Camera; readonly rect: ViewRect };
 
+/** Where a HUD's origin sits on the canvas: a corner, an edge's middle, or the centre. */
+export type HudAlignment =
+  | 'top-left'
+  | 'top-center'
+  | 'top-right'
+  | 'center-left'
+  | 'center-center'
+  | 'center-right'
+  | 'bottom-left'
+  | 'bottom-center'
+  | 'bottom-right';
+
+/**
+ * Nodes drawn over the scene, Drei's `Hud`, as data: a scene of their own (keys apart
+ * from the scene's), drawn after it with only its depth cleared, through an orthographic
+ * camera measured in CSS pixels, y up, whose origin sits `margin` pixels in from the
+ * `alignment`'s edges (Drei's `GizmoHelper` places its gizmo so). Pointer events reach
+ * its interactive meshes before anything behind them; their points and rays are in the
+ * HUD's own space. Scene lighting and fog do not reach it.
+ */
+export type Hud = {
+  readonly alignment: HudAlignment;
+  /** CSS pixels in from the aligned edges, `[x, y]`: unused for a centred direction. */
+  readonly margin: readonly [number, number];
+  readonly children: ReadonlyArray<SceneNode>;
+};
+
 /**
  * A small scene rendered into a texture that materials use as `map: id`: Drei's
  * `RenderTexture`, as data. Its nodes have their own key namespace and may use the
@@ -1253,6 +1470,22 @@ export type XrGlide = {
   readonly snapDegrees: number;
 };
 
+/** What an asset is: a glTF or GLB model, a colour texture, an HDR panorama, a typeface font. */
+export type AssetKind = 'model' | 'texture' | 'environment' | 'font';
+
+/**
+ * An asset a scene asks for: its kind, the id it is lent under once loaded, and where it
+ * comes from. `levels` are coarser versions, coarsest first, to show while `url` (the
+ * finest) is on its way: each is lent as it arrives, if finer than what is shown, and
+ * reported as a level of detail (ADR-015).
+ */
+export type Asset = {
+  readonly kind: AssetKind;
+  readonly id: string;
+  readonly url: string;
+  readonly levels: ReadonlyArray<string>;
+};
+
 export type SceneDescription = {
   readonly camera: Camera;
   /** Whether the scene claims the pointer's gestures from the page. */
@@ -1264,6 +1497,8 @@ export type SceneDescription = {
   readonly views: ReadonlyArray<View>;
   /** Scenes rendered into textures for materials to use. */
   readonly renderTextures: ReadonlyArray<RenderTexture>;
+  /** Nodes drawn over the scene, or `null` for none. */
+  readonly hud: Hud | null;
   /** Points to show HTML at, placed every frame the scene draws. */
   readonly overlays: ReadonlyArray<Overlay>;
   /** Image-based lighting and background, or `null` for none. */
@@ -1281,6 +1516,14 @@ export type SceneDescription = {
    * changes: what Drei's `Bounds` measures, for `fitCamera`. Loaded models included.
    */
   readonly measure: ReadonlyArray<string>;
+  /**
+   * Assets the scene asks for, each lent under its id once loaded: a `borrowed({ id })`
+   * node shows a model, a material's `map: id` a texture, `environment({ map: id })` a
+   * panorama and `text({ font: id })` a font. The host loads each once however many
+   * scenes ask, cancels a load no scene asks for any more, and frees an asset when the
+   * last scene stops asking (ADR-015); it reports each as loaded or failed.
+   */
+  readonly assets: ReadonlyArray<Asset>;
   readonly render: RenderSettings;
   readonly resources: ResourceDefinitions;
   readonly children: ReadonlyArray<SceneNode>;

package/src/kernel/diff.ts

@@ -31,6 +31,10 @@ import {
   labelMaterialEquals,
   labelTypeEquals,
   xrSpaceEquals,
+  lineLookEquals,
+  edgesEquals,
+  trailEquals,
+  pointLookEquals,
   detailEquals,
   shaderGridLookEquals,
   instancesEqual,
@@ -82,6 +86,14 @@ export type Field =
   | 'text'
   /** A shader grid's look: anything but where it is. */
   | 'grid'
+  /** A line's points or look: anything but where it is. */
+  | 'line'
+  /** A mesh's edge lines. */
+  | 'edges'
+  /** A group's or mesh's trail. */
+  | 'trail'
+  /** Points' look: what they are and where, within the node. */
+  | 'look'
   /** The tracked space a group follows. */
   | 'follow'
   /** A group's levels of detail. */
@@ -94,6 +106,9 @@ export type Op =
   /** A render texture was created, resized or its scene changed (its own operations). */
   | { readonly _tag: 'UpdateRenderTexture'; readonly id: string; readonly ops: ReadonlyArray<Op> }
   | { readonly _tag: 'RemoveRenderTexture'; readonly id: string }
+  /** The HUD was created or its scene changed (its own operations). */
+  | { readonly _tag: 'UpdateHud'; readonly ops: ReadonlyArray<Op> }
+  | { readonly _tag: 'RemoveHud' }
   | { readonly _tag: 'SetRenderSettings'; readonly settings: RenderSettings }
   | { readonly _tag: 'DefineResources'; readonly resources: ResourceDefinitions }
   | { readonly _tag: 'Create'; readonly node: SceneNode; readonly parent: ParentKey }
@@ -135,6 +150,7 @@ export const changedFields = (
       if (!bodyEquals(prev.body, next.body)) fields.push('body');
       if (!xrSpaceEquals(prev.follow, next.follow)) fields.push('follow');
       if (!detailEquals(prev.detail, next.detail)) fields.push('detail');
+      if (!trailEquals(prev.trail, next.trail)) fields.push('trail');
       return fields;
     }
     case 'Mesh': {
@@ -150,6 +166,8 @@ export const changedFields = (
       if (prev.castShadow !== next.castShadow) fields.push('castShadow');
       if (prev.receiveShadow !== next.receiveShadow) fields.push('receiveShadow');
       if (!bodyEquals(prev.body, next.body)) fields.push('body');
+      if (!edgesEquals(prev.edges, next.edges)) fields.push('edges');
+      if (!trailEquals(prev.trail, next.trail)) fields.push('trail');
       return fields;
     }
     case 'Instances': {
@@ -239,6 +257,27 @@ export const changedFields = (
       if (!Object.is(prev.shadowBias, next.shadowBias)) fields.push('shadowBias');
       return fields;
     }
+    case 'Points': {
+      if (prev._tag !== 'Points') return undefined;
+      if (!behaviourEquals(prev.behaviour, next.behaviour)) fields.push('behaviour');
+      if (!vec3Equals(prev.position, next.position)) fields.push('position');
+      if (!rotationEquals(prev.rotation, next.rotation)) fields.push('rotation');
+      if (!vec3Equals(prev.scale, next.scale)) fields.push('scale');
+      if (!transitionEquals(prev.transition, next.transition)) fields.push('transition');
+      if (!pointLookEquals(prev.look, next.look)) fields.push('look');
+      return fields;
+    }
+    case 'Line': {
+      if (prev._tag !== 'Line') return undefined;
+      if (!behaviourEquals(prev.behaviour, next.behaviour)) fields.push('behaviour');
+      if (!vec3Equals(prev.position, next.position)) fields.push('position');
+      if (!rotationEquals(prev.rotation, next.rotation)) fields.push('rotation');
+      if (!vec3Equals(prev.scale, next.scale)) fields.push('scale');
+      if (!transitionEquals(prev.transition, next.transition)) fields.push('transition');
+      if (prev.interactive !== next.interactive) fields.push('interactive');
+      if (!lineLookEquals(prev, next)) fields.push('line');
+      return fields;
+    }
     case 'ShaderGrid': {
       if (prev._tag !== 'ShaderGrid') return undefined;
       if (!vec3Equals(prev.position, next.position)) fields.push('position');