@vizij/render 2.0.0 → 3.0.0

package/README.md

@@ -177,11 +177,32 @@ covers the whole page, and every slot already shows the runtime's stages.
   their `WithBundle` forms return the world, its animatables, the
   `VIZIJ_bundle` and the GLB's animations. A blob is parsed in memory, with
   nothing fetched.
+- The elements are the nodes that carry `RobotData`. With `aggressiveImport`,
+  a GLB in which no node does (a plain Blender export) is imported from its
+  meshes instead, framed on `rootBounds` or, absent, on its geometry's
+  bounds; one with no mesh, ellipse or rectangle either fails with
+  `EmptyModelError`.
 - `buildSceneGraph(world, animatables, rootId)` builds the three.js graph of a
   world element with no renderer; `exportScene(root, { bundle, animations })`
   encodes it as GLB bytes. Every node carries its element's `RobotData`, and
   its transform, morph weights and material factors are the element's
   authored defaults.
+- `createExportAnimation({ name, duration, tracks, root })` turns baked
+  tracks — plain data, `ExportAnimationTrack`: a node's name, a
+  `position`, `quaternion`, `scale` or `morphTargetInfluences` property, key
+  times in seconds and flattened values — into one of the `animations`
+  `exportScene` writes. Each track is bound against `root` by node name first,
+  and one that would not bind (no such node, no such morph target, a value
+  count that is not `times × stride`) is left out and returned in `issues`,
+  since the exporter otherwise drops the whole animation or throws.
+  `animation` is `null` when no track binds.
+- An element's compound features — translation, rotation, scale and the
+  colours — are whole (`translation`, a vector), per axis (`translation.x`,
+  `rotation.r`, `color.g`, each a number: the form Semio Studio writes its
+  faces in), or both, a component given per axis standing over the whole
+  value's. Both forms load, build into the scene graph and export unchanged.
+  A rotation is an euler `{ x, y, z }`, or `{ r, p, y }` (roll, pitch, yaw)
+  as Studio names the same angles; either applies in ZYX order.
 - An ellipse or a rectangle exports as a node with no mesh, carrying its
   `RobotData` — `type`, `width`, `height`, `fillColor`, `fillOpacity` — from
   which the Bevy view draws it: a unit circle or square scaled by the width
@@ -218,7 +239,8 @@ pnpm --filter "@vizij/render" size
 ```
 
 The tests run on Node (`node --test`): the loader, the headless export round
-trip of the shipped faces and of an ellipse and a rectangle, the canvas's frame
+trip of the shipped faces and of an ellipse and a rectangle, the binding and
+export of baked animations, the canvas's frame
 loop, and the loading view's stages, labels and overrides, against a stand-in of
 `@vizij/runtime` (`tests/runtime-stand-in.mjs`). `size-limit` guards the bundle
 size.
@@ -227,7 +249,8 @@ Faces are drawn by `@vizij/runtime`'s Bevy view, a peer dependency. `three` is
 imported only by the loader (`src/functions/load-gltf.ts`,
 `src/functions/gltf-loading/`) and the exporter
 (`src/functions/build-scene-graph.ts`, `src/functions/export.ts`,
-`src/functions/vizij-bundle.ts`); the rest imports its types at most. An API
+`src/functions/export-animation.ts`, `src/functions/vizij-bundle.ts`); the
+rest imports its types at most. An API
 change updates the apps that use the package and `@vizij/runtime-react` in the
 same change.
 

package/dist/index.d.mts

@@ -176,6 +176,24 @@ interface StoredAnimatedFeature {
  * @param value - The id of the {@link AnimatableValue} used to populate this value if animated, or the value {@link RawValue} if static.
  */
 type Feature = AnimatedFeature | StaticFeature;
+/**
+ * A compound feature in its per-axis form: one feature per component, named
+ * `<feature>.<axis>` (`translation.x`, `rotation.r`, `color.g`), each a
+ * number. Semio Studio writes its faces this way. An element may carry a
+ * compound feature whole, per axis, or both; a component named per axis
+ * stands over that component of the whole value.
+ */
+type PerAxisFeatures<Name extends string, Axis extends string> = {
+    [Key in `${Name}.${Axis}`]?: Feature;
+};
+/** The components of a translation or a scale. */
+type VectorAxis = "x" | "y" | "z";
+/** The components of a rotation: roll, pitch and yaw, the euler's x, y and z. */
+type RotationAxis = "r" | "p" | "y";
+/** The components of a colour. */
+type ColorAxis = "r" | "g" | "b";
+/** An element's translation, rotation and scale, per axis. */
+type PerAxisTransformFeatures = PerAxisFeatures<"translation", VectorAxis> & PerAxisFeatures<"rotation", RotationAxis> & PerAxisFeatures<"scale", VectorAxis>;
 
 interface RenderableBase {
     id: string;
@@ -218,9 +236,9 @@ interface Ellipse extends RenderableBase {
         strokeColor?: Feature;
         strokeWidth?: Feature;
         strokeOffset?: Feature;
-        translation: Feature;
-        rotation: Feature;
-    };
+        translation?: Feature;
+        rotation?: Feature;
+    } & PerAxisFeatures<"translation", VectorAxis> & PerAxisFeatures<"rotation", RotationAxis> & PerAxisFeatures<"fillColor", ColorAxis> & PerAxisFeatures<"strokeColor", ColorAxis>;
 }
 type EllipseFeature = keyof Ellipse["features"];
 type StoredEllipse = Stored<Ellipse>;
@@ -247,9 +265,9 @@ interface Rectangle extends RenderableBase {
         strokeWidth?: Feature;
         strokeRadius?: Feature;
         strokeOffset?: Feature;
-        translation: Feature;
-        rotation: Feature;
-    };
+        translation?: Feature;
+        rotation?: Feature;
+    } & PerAxisFeatures<"translation", VectorAxis> & PerAxisFeatures<"rotation", RotationAxis> & PerAxisFeatures<"fillColor", ColorAxis> & PerAxisFeatures<"strokeColor", ColorAxis>;
 }
 type RectangleFeature = keyof Rectangle["features"];
 type StoredRectangle = Stored<Rectangle>;
@@ -268,11 +286,12 @@ type StoredRectangle = Stored<Rectangle>;
 interface Group extends RenderableBase {
     type: "group";
     root: boolean;
+    /** Translation and rotation, each whole or per axis. */
     features: {
-        translation: Feature;
-        rotation: Feature;
+        translation?: Feature;
+        rotation?: Feature;
         scale?: Feature;
-    };
+    } & PerAxisTransformFeatures;
     rootBounds?: {
         center: RawVector2;
         size: RawVector2;
@@ -311,10 +330,10 @@ interface Shape extends RenderableBase {
         emissive?: Feature;
         emissiveIntensity?: Feature;
         specular?: Feature;
-        translation: Feature;
-        rotation: Feature;
+        translation?: Feature;
+        rotation?: Feature;
         scale?: Feature;
-    };
+    } & PerAxisTransformFeatures & PerAxisFeatures<"color", ColorAxis> & PerAxisFeatures<"emissive", ColorAxis> & PerAxisFeatures<"specular", ColorAxis>;
     material: ShapeMaterial;
     geometry: BufferGeometry | ShapeGeometry;
     morphTargets?: string[];
@@ -737,9 +756,15 @@ declare function useVizijStoreSetter(): {
 
 declare function useVizijStoreGetter(): () => VizijData & VizijActions;
 
+/**
+ * The error a load ends with when the GLB holds no face: no element carries
+ * `RobotData`, and the aggressive import finds no mesh, ellipse or rectangle
+ * to make one from.
+ */
 declare class EmptyModelError extends Error {
     constructor(message: string);
 }
+
 type ParserJsonFallbackSource = {
     url?: string;
     arrayBuffer?: ArrayBuffer;
@@ -821,6 +846,64 @@ declare function patchVizijBundleMetadata(glb: ArrayBuffer, metadata: Record<str
  */
 declare function exportScene(root: THREE.Object3D, options?: ExportSceneOptions): Promise<ArrayBuffer>;
 
+/** A glTF-animatable node property, under three.js's property name. */
+type ExportAnimationProperty = "position" | "quaternion" | "scale" | "morphTargetInfluences";
+/** One node property's keys, to export as a glTF animation channel. */
+interface ExportAnimationTrack {
+    /**
+     * The property-binding path: `<node>.<property>`, or
+     * `<node>.morphTargetInfluences[<morph target name>]`.
+     */
+    name: string;
+    property: ExportAnimationProperty;
+    /** The name of the node the track drives. */
+    elementName: string;
+    /** Key times, in seconds, ascending. */
+    times: number[];
+    /** Flattened key values, `times.length * stride` of them. */
+    values: number[];
+    /** Values per key: 3 for a position or scale, 4 for a quaternion, 1 for a morph weight. */
+    stride: number;
+}
+interface ExportAnimationIssue {
+    trackName: string;
+    reason: "node-not-found" | "morph-target-not-found" | "bad-stride";
+    detail?: string;
+}
+/**
+ * What a track binds against: the export root and its descendants, found by
+ * name. The graph `buildSceneGraph` returns is one.
+ */
+interface ExportAnimationRoot {
+    name: string;
+    traverse: (callback: (child: ExportAnimationRoot) => void) => void;
+    morphTargetDictionary?: Record<string, number>;
+}
+interface ExportAnimationResult {
+    /** For `exportScene({ animations })`; `null` when no track binds. */
+    animation: AnimationClip | null;
+    /** The tracks left out, each with why. */
+    issues: ExportAnimationIssue[];
+}
+/**
+ * An animation for `exportScene`, from baked tracks, each checked against the
+ * tree it will be exported with.
+ *
+ * The exporter drops a whole animation when one track fails to bind, and
+ * throws when a morph target name is missing from the mesh's
+ * `morphTargetDictionary`. So each track is bound here first, by node name
+ * (`exportScene` clones a root that is not a `Scene`, which keeps names and
+ * changes uuids), and a track that would not bind is left out and reported.
+ */
+declare function createExportAnimation(options: {
+    name: string;
+    /** In seconds. */
+    duration: number;
+    tracks: ReadonlyArray<ExportAnimationTrack>;
+    /** The tree the animation will be exported with. */
+    root: ExportAnimationRoot;
+}): ExportAnimationResult;
+
 /**
  * Build the three.js graph of the world element `rootId` and its descendants,
  * for `exportScene`.
@@ -830,6 +913,12 @@ declare function exportScene(root: THREE.Object3D, options?: ExportSceneOptions)
  * them, with the element's `RobotData` in `userData`. No renderer is involved,
  * so this runs in Node.
  *
+ * A compound feature — translation, rotation, scale, a colour — is read whole,
+ * per axis (`translation.x`, `rotation.r`, `color.g`: Semio Studio's form),
+ * or both, a component given per axis standing over the whole value's. A
+ * rotation is an euler `{ x, y, z }` or, as Studio names it, `{ r, p, y }`
+ * (roll, pitch, yaw), applied in ZYX order.
+ *
  * Every feature takes its authored value: a static feature its value, an
  * animated one its animatable's `default` in `animatables`. Node translation,
  * rotation and scale, morph weights and material factors in the exported file
@@ -886,4 +975,4 @@ declare function sanitizeMorphKey(name: string, fallbackIndex: number, used: Set
  */
 declare function deriveMorphFeatureKeys(names: ReadonlyArray<string>): string[];
 
-export { type AnimatedFeature, DEFAULT_TONE_MAPPING_MODE, type Ellipse, type EllipseFeature, EmptyModelError, type ExportSceneOptions, type Feature, type Group, type GroupFeature, type LoadedVizijAsset, type LoadingStage, type Rectangle, type RectangleFeature, type RenderableBase, type RenderableFeature, type Selection, type Shape, type ShapeFeature, ShapeMaterial, type StaticFeature, type Stored, type StoredAnimatedFeature, type StoredEllipse, type StoredFeatures, type StoredGroup, type StoredRectangle, type StoredRenderable, type StoredShape, TONE_MAPPING_LABELS, TONE_MAPPING_MODES, type ToneMappingMode, Vizij, type VizijActions, type VizijAnimationClipData, type VizijAnimationId, type VizijAnimationTrackData, type VizijBundleAnimationClip, type VizijBundleAnimationEntry, type VizijBundleAnimationKeyframe, type VizijBundleAnimationTrack, type VizijBundleExtension, type VizijBundleGraphEntry, type VizijBundleGraphKind, type VizijBundleGraphMetadata, type VizijBundlePoseSection, type VizijBundleProfile, type VizijBundleStarredSection, type VizijBundleVersion, VizijCanvas, type VizijCanvasProps, VizijContext, type VizijData, type VizijGraphId, type VizijLoading, type VizijPoseDefinition, type VizijPoseId, type VizijPoseRigConfig, type VizijProfileKey, type VizijProgress, type VizijProps, VizijSlice, type VizijSpeechConfig, type VizijStarredItem, type VizijStarredKind, type VizijStore, type VizijStoreGetter, type VizijStoreSetter, type World, applyVizijBundle, buildSceneGraph, canvasMounted, createVizijStore, deriveMorphFeatureKeys, deriveRootBounds, exportScene, extractVizijBundle, isToneMappingMode, loadGLTF, loadGLTFFromBlob, loadGLTFFromBlobWithBundle, loadGLTFWithBundle, normalizeToneMappingMode, parseGlbJsonChunk, patchGlbJson, patchVizijBundleMetadata, sanitizeMorphKey, setVizijProgress, useDefaultVizijStore, useVizijStore, useVizijStoreGetter, useVizijStoreSetter, useVizijStoreSubscription };
+export { type AnimatedFeature, type ColorAxis, DEFAULT_TONE_MAPPING_MODE, type Ellipse, type EllipseFeature, EmptyModelError, type ExportAnimationIssue, type ExportAnimationProperty, type ExportAnimationResult, type ExportAnimationRoot, type ExportAnimationTrack, type ExportSceneOptions, type Feature, type Group, type GroupFeature, type LoadedVizijAsset, type LoadingStage, type PerAxisFeatures, type PerAxisTransformFeatures, type Rectangle, type RectangleFeature, type RenderableBase, type RenderableFeature, type RotationAxis, type Selection, type Shape, type ShapeFeature, ShapeMaterial, type StaticFeature, type Stored, type StoredAnimatedFeature, type StoredEllipse, type StoredFeatures, type StoredGroup, type StoredRectangle, type StoredRenderable, type StoredShape, TONE_MAPPING_LABELS, TONE_MAPPING_MODES, type ToneMappingMode, type VectorAxis, Vizij, type VizijActions, type VizijAnimationClipData, type VizijAnimationId, type VizijAnimationTrackData, type VizijBundleAnimationClip, type VizijBundleAnimationEntry, type VizijBundleAnimationKeyframe, type VizijBundleAnimationTrack, type VizijBundleExtension, type VizijBundleGraphEntry, type VizijBundleGraphKind, type VizijBundleGraphMetadata, type VizijBundlePoseSection, type VizijBundleProfile, type VizijBundleStarredSection, type VizijBundleVersion, VizijCanvas, type VizijCanvasProps, VizijContext, type VizijData, type VizijGraphId, type VizijLoading, type VizijPoseDefinition, type VizijPoseId, type VizijPoseRigConfig, type VizijProfileKey, type VizijProgress, type VizijProps, VizijSlice, type VizijSpeechConfig, type VizijStarredItem, type VizijStarredKind, type VizijStore, type VizijStoreGetter, type VizijStoreSetter, type World, applyVizijBundle, buildSceneGraph, canvasMounted, createExportAnimation, createVizijStore, deriveMorphFeatureKeys, deriveRootBounds, exportScene, extractVizijBundle, isToneMappingMode, loadGLTF, loadGLTFFromBlob, loadGLTFFromBlobWithBundle, loadGLTFWithBundle, normalizeToneMappingMode, parseGlbJsonChunk, patchGlbJson, patchVizijBundleMetadata, sanitizeMorphKey, setVizijProgress, useDefaultVizijStore, useVizijStore, useVizijStoreGetter, useVizijStoreSetter, useVizijStoreSubscription };

package/dist/index.d.ts

@@ -176,6 +176,24 @@ interface StoredAnimatedFeature {
  * @param value - The id of the {@link AnimatableValue} used to populate this value if animated, or the value {@link RawValue} if static.
  */
 type Feature = AnimatedFeature | StaticFeature;
+/**
+ * A compound feature in its per-axis form: one feature per component, named
+ * `<feature>.<axis>` (`translation.x`, `rotation.r`, `color.g`), each a
+ * number. Semio Studio writes its faces this way. An element may carry a
+ * compound feature whole, per axis, or both; a component named per axis
+ * stands over that component of the whole value.
+ */
+type PerAxisFeatures<Name extends string, Axis extends string> = {
+    [Key in `${Name}.${Axis}`]?: Feature;
+};
+/** The components of a translation or a scale. */
+type VectorAxis = "x" | "y" | "z";
+/** The components of a rotation: roll, pitch and yaw, the euler's x, y and z. */
+type RotationAxis = "r" | "p" | "y";
+/** The components of a colour. */
+type ColorAxis = "r" | "g" | "b";
+/** An element's translation, rotation and scale, per axis. */
+type PerAxisTransformFeatures = PerAxisFeatures<"translation", VectorAxis> & PerAxisFeatures<"rotation", RotationAxis> & PerAxisFeatures<"scale", VectorAxis>;
 
 interface RenderableBase {
     id: string;
@@ -218,9 +236,9 @@ interface Ellipse extends RenderableBase {
         strokeColor?: Feature;
         strokeWidth?: Feature;
         strokeOffset?: Feature;
-        translation: Feature;
-        rotation: Feature;
-    };
+        translation?: Feature;
+        rotation?: Feature;
+    } & PerAxisFeatures<"translation", VectorAxis> & PerAxisFeatures<"rotation", RotationAxis> & PerAxisFeatures<"fillColor", ColorAxis> & PerAxisFeatures<"strokeColor", ColorAxis>;
 }
 type EllipseFeature = keyof Ellipse["features"];
 type StoredEllipse = Stored<Ellipse>;
@@ -247,9 +265,9 @@ interface Rectangle extends RenderableBase {
         strokeWidth?: Feature;
         strokeRadius?: Feature;
         strokeOffset?: Feature;
-        translation: Feature;
-        rotation: Feature;
-    };
+        translation?: Feature;
+        rotation?: Feature;
+    } & PerAxisFeatures<"translation", VectorAxis> & PerAxisFeatures<"rotation", RotationAxis> & PerAxisFeatures<"fillColor", ColorAxis> & PerAxisFeatures<"strokeColor", ColorAxis>;
 }
 type RectangleFeature = keyof Rectangle["features"];
 type StoredRectangle = Stored<Rectangle>;
@@ -268,11 +286,12 @@ type StoredRectangle = Stored<Rectangle>;
 interface Group extends RenderableBase {
     type: "group";
     root: boolean;
+    /** Translation and rotation, each whole or per axis. */
     features: {
-        translation: Feature;
-        rotation: Feature;
+        translation?: Feature;
+        rotation?: Feature;
         scale?: Feature;
-    };
+    } & PerAxisTransformFeatures;
     rootBounds?: {
         center: RawVector2;
         size: RawVector2;
@@ -311,10 +330,10 @@ interface Shape extends RenderableBase {
         emissive?: Feature;
         emissiveIntensity?: Feature;
         specular?: Feature;
-        translation: Feature;
-        rotation: Feature;
+        translation?: Feature;
+        rotation?: Feature;
         scale?: Feature;
-    };
+    } & PerAxisTransformFeatures & PerAxisFeatures<"color", ColorAxis> & PerAxisFeatures<"emissive", ColorAxis> & PerAxisFeatures<"specular", ColorAxis>;
     material: ShapeMaterial;
     geometry: BufferGeometry | ShapeGeometry;
     morphTargets?: string[];
@@ -737,9 +756,15 @@ declare function useVizijStoreSetter(): {
 
 declare function useVizijStoreGetter(): () => VizijData & VizijActions;
 
+/**
+ * The error a load ends with when the GLB holds no face: no element carries
+ * `RobotData`, and the aggressive import finds no mesh, ellipse or rectangle
+ * to make one from.
+ */
 declare class EmptyModelError extends Error {
     constructor(message: string);
 }
+
 type ParserJsonFallbackSource = {
     url?: string;
     arrayBuffer?: ArrayBuffer;
@@ -821,6 +846,64 @@ declare function patchVizijBundleMetadata(glb: ArrayBuffer, metadata: Record<str
  */
 declare function exportScene(root: THREE.Object3D, options?: ExportSceneOptions): Promise<ArrayBuffer>;
 
+/** A glTF-animatable node property, under three.js's property name. */
+type ExportAnimationProperty = "position" | "quaternion" | "scale" | "morphTargetInfluences";
+/** One node property's keys, to export as a glTF animation channel. */
+interface ExportAnimationTrack {
+    /**
+     * The property-binding path: `<node>.<property>`, or
+     * `<node>.morphTargetInfluences[<morph target name>]`.
+     */
+    name: string;
+    property: ExportAnimationProperty;
+    /** The name of the node the track drives. */
+    elementName: string;
+    /** Key times, in seconds, ascending. */
+    times: number[];
+    /** Flattened key values, `times.length * stride` of them. */
+    values: number[];
+    /** Values per key: 3 for a position or scale, 4 for a quaternion, 1 for a morph weight. */
+    stride: number;
+}
+interface ExportAnimationIssue {
+    trackName: string;
+    reason: "node-not-found" | "morph-target-not-found" | "bad-stride";
+    detail?: string;
+}
+/**
+ * What a track binds against: the export root and its descendants, found by
+ * name. The graph `buildSceneGraph` returns is one.
+ */
+interface ExportAnimationRoot {
+    name: string;
+    traverse: (callback: (child: ExportAnimationRoot) => void) => void;
+    morphTargetDictionary?: Record<string, number>;
+}
+interface ExportAnimationResult {
+    /** For `exportScene({ animations })`; `null` when no track binds. */
+    animation: AnimationClip | null;
+    /** The tracks left out, each with why. */
+    issues: ExportAnimationIssue[];
+}
+/**
+ * An animation for `exportScene`, from baked tracks, each checked against the
+ * tree it will be exported with.
+ *
+ * The exporter drops a whole animation when one track fails to bind, and
+ * throws when a morph target name is missing from the mesh's
+ * `morphTargetDictionary`. So each track is bound here first, by node name
+ * (`exportScene` clones a root that is not a `Scene`, which keeps names and
+ * changes uuids), and a track that would not bind is left out and reported.
+ */
+declare function createExportAnimation(options: {
+    name: string;
+    /** In seconds. */
+    duration: number;
+    tracks: ReadonlyArray<ExportAnimationTrack>;
+    /** The tree the animation will be exported with. */
+    root: ExportAnimationRoot;
+}): ExportAnimationResult;
+
 /**
  * Build the three.js graph of the world element `rootId` and its descendants,
  * for `exportScene`.
@@ -830,6 +913,12 @@ declare function exportScene(root: THREE.Object3D, options?: ExportSceneOptions)
  * them, with the element's `RobotData` in `userData`. No renderer is involved,
  * so this runs in Node.
  *
+ * A compound feature — translation, rotation, scale, a colour — is read whole,
+ * per axis (`translation.x`, `rotation.r`, `color.g`: Semio Studio's form),
+ * or both, a component given per axis standing over the whole value's. A
+ * rotation is an euler `{ x, y, z }` or, as Studio names it, `{ r, p, y }`
+ * (roll, pitch, yaw), applied in ZYX order.
+ *
  * Every feature takes its authored value: a static feature its value, an
  * animated one its animatable's `default` in `animatables`. Node translation,
  * rotation and scale, morph weights and material factors in the exported file
@@ -886,4 +975,4 @@ declare function sanitizeMorphKey(name: string, fallbackIndex: number, used: Set
  */
 declare function deriveMorphFeatureKeys(names: ReadonlyArray<string>): string[];
 
-export { type AnimatedFeature, DEFAULT_TONE_MAPPING_MODE, type Ellipse, type EllipseFeature, EmptyModelError, type ExportSceneOptions, type Feature, type Group, type GroupFeature, type LoadedVizijAsset, type LoadingStage, type Rectangle, type RectangleFeature, type RenderableBase, type RenderableFeature, type Selection, type Shape, type ShapeFeature, ShapeMaterial, type StaticFeature, type Stored, type StoredAnimatedFeature, type StoredEllipse, type StoredFeatures, type StoredGroup, type StoredRectangle, type StoredRenderable, type StoredShape, TONE_MAPPING_LABELS, TONE_MAPPING_MODES, type ToneMappingMode, Vizij, type VizijActions, type VizijAnimationClipData, type VizijAnimationId, type VizijAnimationTrackData, type VizijBundleAnimationClip, type VizijBundleAnimationEntry, type VizijBundleAnimationKeyframe, type VizijBundleAnimationTrack, type VizijBundleExtension, type VizijBundleGraphEntry, type VizijBundleGraphKind, type VizijBundleGraphMetadata, type VizijBundlePoseSection, type VizijBundleProfile, type VizijBundleStarredSection, type VizijBundleVersion, VizijCanvas, type VizijCanvasProps, VizijContext, type VizijData, type VizijGraphId, type VizijLoading, type VizijPoseDefinition, type VizijPoseId, type VizijPoseRigConfig, type VizijProfileKey, type VizijProgress, type VizijProps, VizijSlice, type VizijSpeechConfig, type VizijStarredItem, type VizijStarredKind, type VizijStore, type VizijStoreGetter, type VizijStoreSetter, type World, applyVizijBundle, buildSceneGraph, canvasMounted, createVizijStore, deriveMorphFeatureKeys, deriveRootBounds, exportScene, extractVizijBundle, isToneMappingMode, loadGLTF, loadGLTFFromBlob, loadGLTFFromBlobWithBundle, loadGLTFWithBundle, normalizeToneMappingMode, parseGlbJsonChunk, patchGlbJson, patchVizijBundleMetadata, sanitizeMorphKey, setVizijProgress, useDefaultVizijStore, useVizijStore, useVizijStoreGetter, useVizijStoreSetter, useVizijStoreSubscription };
+export { type AnimatedFeature, type ColorAxis, DEFAULT_TONE_MAPPING_MODE, type Ellipse, type EllipseFeature, EmptyModelError, type ExportAnimationIssue, type ExportAnimationProperty, type ExportAnimationResult, type ExportAnimationRoot, type ExportAnimationTrack, type ExportSceneOptions, type Feature, type Group, type GroupFeature, type LoadedVizijAsset, type LoadingStage, type PerAxisFeatures, type PerAxisTransformFeatures, type Rectangle, type RectangleFeature, type RenderableBase, type RenderableFeature, type RotationAxis, type Selection, type Shape, type ShapeFeature, ShapeMaterial, type StaticFeature, type Stored, type StoredAnimatedFeature, type StoredEllipse, type StoredFeatures, type StoredGroup, type StoredRectangle, type StoredRenderable, type StoredShape, TONE_MAPPING_LABELS, TONE_MAPPING_MODES, type ToneMappingMode, type VectorAxis, Vizij, type VizijActions, type VizijAnimationClipData, type VizijAnimationId, type VizijAnimationTrackData, type VizijBundleAnimationClip, type VizijBundleAnimationEntry, type VizijBundleAnimationKeyframe, type VizijBundleAnimationTrack, type VizijBundleExtension, type VizijBundleGraphEntry, type VizijBundleGraphKind, type VizijBundleGraphMetadata, type VizijBundlePoseSection, type VizijBundleProfile, type VizijBundleStarredSection, type VizijBundleVersion, VizijCanvas, type VizijCanvasProps, VizijContext, type VizijData, type VizijGraphId, type VizijLoading, type VizijPoseDefinition, type VizijPoseId, type VizijPoseRigConfig, type VizijProfileKey, type VizijProgress, type VizijProps, VizijSlice, type VizijSpeechConfig, type VizijStarredItem, type VizijStarredKind, type VizijStore, type VizijStoreGetter, type VizijStoreSetter, type World, applyVizijBundle, buildSceneGraph, canvasMounted, createExportAnimation, createVizijStore, deriveMorphFeatureKeys, deriveRootBounds, exportScene, extractVizijBundle, isToneMappingMode, loadGLTF, loadGLTFFromBlob, loadGLTFFromBlobWithBundle, loadGLTFWithBundle, normalizeToneMappingMode, parseGlbJsonChunk, patchGlbJson, patchVizijBundleMetadata, sanitizeMorphKey, setVizijProgress, useDefaultVizijStore, useVizijStore, useVizijStoreGetter, useVizijStoreSetter, useVizijStoreSubscription };

package/dist/index.js

@@ -42,6 +42,7 @@ __export(index_exports, {
   applyVizijBundle: () => applyVizijBundle,
   buildSceneGraph: () => buildSceneGraph,
   canvasMounted: () => canvasMounted,
+  createExportAnimation: () => createExportAnimation,
   createVizijStore: () => createVizijStore,
   deriveMorphFeatureKeys: () => deriveMorphFeatureKeys,
   deriveRootBounds: () => deriveRootBounds,
@@ -814,19 +815,10 @@ var VizijSlice = (set, _get) => ({
       (0, import_immer.produce)((state) => {
         const lookupId = (0, import_utils3.getLookup)(namespace, id);
         if (typeof value === "function") {
-          const current = state.values.get(lookupId);
-          if (current !== void 0) {
-            if (value(current !== void 0)) {
-              state.values.set(lookupId, value(current));
-            }
-          } else {
-            const animatableLookup = state.animatables[id];
-            const updatedValue = value(
-              animatableLookup !== void 0 ? animatableLookup.default : void 0
-            );
-            if (updatedValue !== void 0) {
-              state.values.set(lookupId, updatedValue);
-            }
+          const current = state.values.get(lookupId) ?? state.animatables[id]?.default;
+          const updatedValue = value(current);
+          if (updatedValue !== void 0) {
+            state.values.set(lookupId, updatedValue);
           }
         } else {
           state.values.set(lookupId, value);
@@ -1106,6 +1098,14 @@ function recordRenderCounter(key, delta = 1) {
 // src/functions/gltf-loading/traverse-three.ts
 var THREE = __toESM(require("three"));
 
+// src/functions/empty-model-error.ts
+var EmptyModelError = class extends Error {
+  constructor(message) {
+    super(message);
+    this.name = "EmptyModelError";
+  }
+};
+
 // src/functions/gltf-loading/map-features.ts
 function mapFeatures(features) {
   const animatableValues = {};
@@ -1656,7 +1656,9 @@ function traverseThree(group, aggressiveImport = false, rootBounds) {
   } else {
     const derivedRootBounds = rootBounds ?? deriveRootBounds(group);
     if (!derivedRootBounds) {
-      throw new Error("Root bounds are expected if using an aggressive import");
+      throw new EmptyModelError(
+        "The GLB has no RobotData and no mesh, ellipse or rectangle to import"
+      );
     }
     const [newWorldData, newAnimatableData] = importScene(
       group,
@@ -1761,41 +1763,40 @@ function stripMaterialSuffixes(name) {
 function isStoredAnimatedFeature(feature) {
   return Boolean(feature) && typeof feature === "object" && feature.animated === true && "value" in feature;
 }
-function isGroupFeatures(value) {
+var TRANSFORM = [
+  ["translation", ["x", "y", "z"]],
+  ["rotation", ["r", "p", "y"]]
+];
+var REQUIRED_FEATURES = {
+  group: TRANSFORM,
+  shape: TRANSFORM,
+  ellipse: [...TRANSFORM, ["width", []], ["height", []]],
+  rectangle: [...TRANSFORM, ["width", []], ["height", []]]
+};
+function assertRequiredFeatures(kind, value) {
   if (!value || typeof value !== "object") {
     throw new Error("Expected object");
   }
-  if (!["translation", "rotation"].every((key) => key in value)) {
-    throw new Error("Expected translation and rotation keys in features");
+  const missing = REQUIRED_FEATURES[kind].filter(
+    ([name, axes]) => !(name in value) && !axes.some((axis) => `${name}.${axis}` in value)
+  ).map(([name]) => name);
+  if (missing.length > 0) {
+    throw new Error(
+      `An element of type ${kind} lacks ${missing.join(", ")} in its features`
+    );
   }
 }
+function isGroupFeatures(value) {
+  assertRequiredFeatures("group", value);
+}
 function isShapeFeatures(value) {
-  if (!value || typeof value !== "object") {
-    throw new Error("Expected object");
-  }
-  if (!["translation", "rotation"].every((key) => key in value)) {
-    throw new Error("Expected translation and rotation keys in features");
-  }
+  assertRequiredFeatures("shape", value);
 }
 function isEllipseFeatures(value) {
-  if (!value || typeof value !== "object") {
-    throw new Error("Expected object");
-  }
-  if (!["translation", "rotation", "height", "width"].every((key) => key in value)) {
-    throw new Error(
-      "Expected translation, rotation, width, and height keys in features"
-    );
-  }
+  assertRequiredFeatures("ellipse", value);
 }
 function isRectangleFeatures(value) {
-  if (!value || typeof value !== "object") {
-    throw new Error("Expected object");
-  }
-  if (!["translation", "rotation", "height", "width"].every((key) => key in value)) {
-    throw new Error(
-      "Expected translation, rotation, width, and height keys in features"
-    );
-  }
+  assertRequiredFeatures("rectangle", value);
 }
 var PRIMITIVE_HALF_EXTENT = {
   ellipse: 1,
@@ -2357,12 +2358,6 @@ var GLB_VERSION = 2;
 var GLB_HEADER_BYTES = 12;
 var GLB_CHUNK_HEADER_BYTES = 8;
 var GLB_JSON_CHUNK_TYPE = 1313821514;
-var EmptyModelError = class extends Error {
-  constructor(message) {
-    super(message);
-    this.name = "EmptyModelError";
-  }
-};
 function parseGlbJsonChunk(buffer) {
   if (buffer.byteLength < GLB_HEADER_BYTES + GLB_CHUNK_HEADER_BYTES) {
     return void 0;
@@ -2702,6 +2697,71 @@ async function exportScene(root, options = {}) {
   return sanitizeExportedGlb(gltf, root.name?.trim() || void 0);
 }
 
+// src/functions/export-animation.ts
+var import_three4 = require("three");
+function findByName(root, name) {
+  let found = null;
+  root.traverse((child) => {
+    if (!found && child.name === name) {
+      found = child;
+    }
+  });
+  return found;
+}
+function parseMorphTargetName(trackName) {
+  const match = /\.morphTargetInfluences\[(.+)\]$/.exec(trackName);
+  return match ? match[1] : null;
+}
+function createExportAnimation(options) {
+  const { name, duration, tracks, root } = options;
+  const issues = [];
+  const built = [];
+  for (const spec of tracks) {
+    const node = findByName(root, spec.elementName);
+    if (!node) {
+      issues.push({
+        trackName: spec.name,
+        reason: "node-not-found",
+        detail: spec.elementName
+      });
+      continue;
+    }
+    if (spec.values.length !== spec.times.length * spec.stride) {
+      issues.push({
+        trackName: spec.name,
+        reason: "bad-stride",
+        detail: `${spec.values.length} values for ${spec.times.length} times at stride ${spec.stride}`
+      });
+      continue;
+    }
+    if (spec.property === "morphTargetInfluences") {
+      const morphName = parseMorphTargetName(spec.name);
+      const dictionary = node.morphTargetDictionary;
+      if (!morphName || !dictionary || !(morphName in dictionary)) {
+        issues.push({
+          trackName: spec.name,
+          reason: "morph-target-not-found",
+          detail: morphName ?? void 0
+        });
+        continue;
+      }
+      built.push(new import_three4.NumberKeyframeTrack(spec.name, spec.times, spec.values));
+      continue;
+    }
+    if (spec.property === "quaternion") {
+      built.push(
+        new import_three4.QuaternionKeyframeTrack(spec.name, spec.times, spec.values)
+      );
+      continue;
+    }
+    built.push(new import_three4.VectorKeyframeTrack(spec.name, spec.times, spec.values));
+  }
+  if (built.length === 0) {
+    return { animation: null, issues };
+  }
+  return { animation: new import_three4.AnimationClip(name, duration, built), issues };
+}
+
 // src/functions/build-scene-graph.ts
 var THREE4 = __toESM(require("three"));
 var import_utils9 = require("@vizij/utils");
@@ -2807,7 +2867,10 @@ function buildSceneGraph(world, animatables, rootId) {
       const object = new THREE4.Group();
       object.name = entry.name;
       object.userData = { gltfExtensions: { RobotData: robotData } };
-      applyFeatures(entry.features, animatables, groupTransform(object));
+      applyFeatures(entry.features, animatables, {
+        ...groupTransform(object),
+        ...perAxisTransform(object, { scale: true })
+      });
       for (const child of entry.children) {
         object.add(buildSceneGraph(world, animatables, child));
       }
@@ -2825,7 +2888,9 @@ function buildSceneGraph(world, animatables, rootId) {
       object.userData = { gltfExtensions: { RobotData: robotData } };
       applyFeatures(entry.features, animatables, {
         ...shapeTransform(object),
+        ...perAxisTransform(object, { scale: true }),
         ...materialFactors(material),
+        ...perAxisMaterialFactors(material),
         ...morphWeights(object, entry)
       });
       for (const child of entry.children ?? []) {
@@ -2842,6 +2907,7 @@ function buildSceneGraph(world, animatables, rootId) {
       applyFeatures(entry.features, animatables, {
         translation,
         rotation,
+        ...perAxisTransform(object, { scale: false }),
         width: (value) => {
           if ((0, import_utils9.instanceOfRawNumber)(value)) object.scale.x = value;
         },
@@ -2882,8 +2948,9 @@ function groupTransform(object) {
       }
     },
     rotation: (value) => {
-      if ((0, import_utils9.instanceOfRawEuler)(value)) {
-        object.rotation.set(value.x, value.y, value.z, "ZYX");
+      const euler = eulerOf(value);
+      if (euler) {
+        object.rotation.set(...euler, "ZYX");
       } else if ((0, import_utils9.instanceOfRawNumber)(value)) {
         object.rotation.set(0, 0, 0);
         object.rotateZ(value);
@@ -2912,8 +2979,9 @@ function shapeTransform(object) {
       }
     },
     rotation: (value) => {
-      if ((0, import_utils9.instanceOfRawEuler)(value)) {
-        object.rotation.set(value.x, value.y, value.z, "ZYX");
+      const euler = eulerOf(value);
+      if (euler) {
+        object.rotation.set(...euler, "ZYX");
       }
     },
     scale: (value) => {
@@ -2927,6 +2995,58 @@ function shapeTransform(object) {
     }
   };
 }
+function eulerOf(value) {
+  if ((0, import_utils9.instanceOfRawEuler)(value)) {
+    return [value.x, value.y, value.z];
+  }
+  const rpy = value;
+  if (rpy !== null && typeof rpy === "object" && typeof rpy.r === "number" && typeof rpy.p === "number" && typeof rpy.y === "number") {
+    return [rpy.r, rpy.p, rpy.y];
+  }
+  return void 0;
+}
+function perAxis(name, axes, set) {
+  return Object.fromEntries(
+    axes.map((axis, index) => [
+      `${name}.${axis}`,
+      (value) => {
+        if ((0, import_utils9.instanceOfRawNumber)(value)) {
+          set(index, value);
+        }
+      }
+    ])
+  );
+}
+function perAxisTransform(object, { scale }) {
+  return {
+    ...perAxis("translation", ["x", "y", "z"], (index, value) => {
+      object.position.setComponent(index, value);
+    }),
+    ...perAxis("rotation", ["r", "p", "y"], (index, value) => {
+      const euler = [object.rotation.x, object.rotation.y, object.rotation.z];
+      euler[index] = value;
+      object.rotation.set(euler[0], euler[1], euler[2], "ZYX");
+    }),
+    ...scale ? perAxis("scale", ["x", "y", "z"], (index, value) => {
+      object.scale.setComponent(index, value);
+    }) : {}
+  };
+}
+function perAxisMaterialFactors(material) {
+  const standard = material;
+  const phong = material;
+  const channels = ["r", "g", "b"];
+  const component = (color) => (index, value) => {
+    if (color) {
+      color[channels[index]] = value;
+    }
+  };
+  return {
+    ...perAxis("color", channels, component(standard.color)),
+    ...perAxis("emissive", channels, component(standard.emissive)),
+    ...perAxis("specular", channels, component(phong.specular))
+  };
+}
 function materialFactors(material) {
   const standard = material;
   const phong = material;
@@ -3073,6 +3193,7 @@ function authoredDefault(animatable) {
   applyVizijBundle,
   buildSceneGraph,
   canvasMounted,
+  createExportAnimation,
   createVizijStore,
   deriveMorphFeatureKeys,
   deriveRootBounds,

package/dist/index.mjs

@@ -757,19 +757,10 @@ var VizijSlice = (set, _get) => ({
       produce((state) => {
         const lookupId = getLookup(namespace, id);
         if (typeof value === "function") {
-          const current = state.values.get(lookupId);
-          if (current !== void 0) {
-            if (value(current !== void 0)) {
-              state.values.set(lookupId, value(current));
-            }
-          } else {
-            const animatableLookup = state.animatables[id];
-            const updatedValue = value(
-              animatableLookup !== void 0 ? animatableLookup.default : void 0
-            );
-            if (updatedValue !== void 0) {
-              state.values.set(lookupId, updatedValue);
-            }
+          const current = state.values.get(lookupId) ?? state.animatables[id]?.default;
+          const updatedValue = value(current);
+          if (updatedValue !== void 0) {
+            state.values.set(lookupId, updatedValue);
           }
         } else {
           state.values.set(lookupId, value);
@@ -1049,6 +1040,14 @@ function recordRenderCounter(key, delta = 1) {
 // src/functions/gltf-loading/traverse-three.ts
 import * as THREE from "three";
 
+// src/functions/empty-model-error.ts
+var EmptyModelError = class extends Error {
+  constructor(message) {
+    super(message);
+    this.name = "EmptyModelError";
+  }
+};
+
 // src/functions/gltf-loading/map-features.ts
 function mapFeatures(features) {
   const animatableValues = {};
@@ -1601,7 +1600,9 @@ function traverseThree(group, aggressiveImport = false, rootBounds) {
   } else {
     const derivedRootBounds = rootBounds ?? deriveRootBounds(group);
     if (!derivedRootBounds) {
-      throw new Error("Root bounds are expected if using an aggressive import");
+      throw new EmptyModelError(
+        "The GLB has no RobotData and no mesh, ellipse or rectangle to import"
+      );
     }
     const [newWorldData, newAnimatableData] = importScene(
       group,
@@ -1706,41 +1707,40 @@ function stripMaterialSuffixes(name) {
 function isStoredAnimatedFeature(feature) {
   return Boolean(feature) && typeof feature === "object" && feature.animated === true && "value" in feature;
 }
-function isGroupFeatures(value) {
+var TRANSFORM = [
+  ["translation", ["x", "y", "z"]],
+  ["rotation", ["r", "p", "y"]]
+];
+var REQUIRED_FEATURES = {
+  group: TRANSFORM,
+  shape: TRANSFORM,
+  ellipse: [...TRANSFORM, ["width", []], ["height", []]],
+  rectangle: [...TRANSFORM, ["width", []], ["height", []]]
+};
+function assertRequiredFeatures(kind, value) {
   if (!value || typeof value !== "object") {
     throw new Error("Expected object");
   }
-  if (!["translation", "rotation"].every((key) => key in value)) {
-    throw new Error("Expected translation and rotation keys in features");
+  const missing = REQUIRED_FEATURES[kind].filter(
+    ([name, axes]) => !(name in value) && !axes.some((axis) => `${name}.${axis}` in value)
+  ).map(([name]) => name);
+  if (missing.length > 0) {
+    throw new Error(
+      `An element of type ${kind} lacks ${missing.join(", ")} in its features`
+    );
   }
 }
+function isGroupFeatures(value) {
+  assertRequiredFeatures("group", value);
+}
 function isShapeFeatures(value) {
-  if (!value || typeof value !== "object") {
-    throw new Error("Expected object");
-  }
-  if (!["translation", "rotation"].every((key) => key in value)) {
-    throw new Error("Expected translation and rotation keys in features");
-  }
+  assertRequiredFeatures("shape", value);
 }
 function isEllipseFeatures(value) {
-  if (!value || typeof value !== "object") {
-    throw new Error("Expected object");
-  }
-  if (!["translation", "rotation", "height", "width"].every((key) => key in value)) {
-    throw new Error(
-      "Expected translation, rotation, width, and height keys in features"
-    );
-  }
+  assertRequiredFeatures("ellipse", value);
 }
 function isRectangleFeatures(value) {
-  if (!value || typeof value !== "object") {
-    throw new Error("Expected object");
-  }
-  if (!["translation", "rotation", "height", "width"].every((key) => key in value)) {
-    throw new Error(
-      "Expected translation, rotation, width, and height keys in features"
-    );
-  }
+  assertRequiredFeatures("rectangle", value);
 }
 var PRIMITIVE_HALF_EXTENT = {
   ellipse: 1,
@@ -2302,12 +2302,6 @@ var GLB_VERSION = 2;
 var GLB_HEADER_BYTES = 12;
 var GLB_CHUNK_HEADER_BYTES = 8;
 var GLB_JSON_CHUNK_TYPE = 1313821514;
-var EmptyModelError = class extends Error {
-  constructor(message) {
-    super(message);
-    this.name = "EmptyModelError";
-  }
-};
 function parseGlbJsonChunk(buffer) {
   if (buffer.byteLength < GLB_HEADER_BYTES + GLB_CHUNK_HEADER_BYTES) {
     return void 0;
@@ -2647,6 +2641,76 @@ async function exportScene(root, options = {}) {
   return sanitizeExportedGlb(gltf, root.name?.trim() || void 0);
 }
 
+// src/functions/export-animation.ts
+import {
+  AnimationClip,
+  NumberKeyframeTrack,
+  QuaternionKeyframeTrack,
+  VectorKeyframeTrack
+} from "three";
+function findByName(root, name) {
+  let found = null;
+  root.traverse((child) => {
+    if (!found && child.name === name) {
+      found = child;
+    }
+  });
+  return found;
+}
+function parseMorphTargetName(trackName) {
+  const match = /\.morphTargetInfluences\[(.+)\]$/.exec(trackName);
+  return match ? match[1] : null;
+}
+function createExportAnimation(options) {
+  const { name, duration, tracks, root } = options;
+  const issues = [];
+  const built = [];
+  for (const spec of tracks) {
+    const node = findByName(root, spec.elementName);
+    if (!node) {
+      issues.push({
+        trackName: spec.name,
+        reason: "node-not-found",
+        detail: spec.elementName
+      });
+      continue;
+    }
+    if (spec.values.length !== spec.times.length * spec.stride) {
+      issues.push({
+        trackName: spec.name,
+        reason: "bad-stride",
+        detail: `${spec.values.length} values for ${spec.times.length} times at stride ${spec.stride}`
+      });
+      continue;
+    }
+    if (spec.property === "morphTargetInfluences") {
+      const morphName = parseMorphTargetName(spec.name);
+      const dictionary = node.morphTargetDictionary;
+      if (!morphName || !dictionary || !(morphName in dictionary)) {
+        issues.push({
+          trackName: spec.name,
+          reason: "morph-target-not-found",
+          detail: morphName ?? void 0
+        });
+        continue;
+      }
+      built.push(new NumberKeyframeTrack(spec.name, spec.times, spec.values));
+      continue;
+    }
+    if (spec.property === "quaternion") {
+      built.push(
+        new QuaternionKeyframeTrack(spec.name, spec.times, spec.values)
+      );
+      continue;
+    }
+    built.push(new VectorKeyframeTrack(spec.name, spec.times, spec.values));
+  }
+  if (built.length === 0) {
+    return { animation: null, issues };
+  }
+  return { animation: new AnimationClip(name, duration, built), issues };
+}
+
 // src/functions/build-scene-graph.ts
 import * as THREE4 from "three";
 import {
@@ -2759,7 +2823,10 @@ function buildSceneGraph(world, animatables, rootId) {
       const object = new THREE4.Group();
       object.name = entry.name;
       object.userData = { gltfExtensions: { RobotData: robotData } };
-      applyFeatures(entry.features, animatables, groupTransform(object));
+      applyFeatures(entry.features, animatables, {
+        ...groupTransform(object),
+        ...perAxisTransform(object, { scale: true })
+      });
       for (const child of entry.children) {
         object.add(buildSceneGraph(world, animatables, child));
       }
@@ -2777,7 +2844,9 @@ function buildSceneGraph(world, animatables, rootId) {
       object.userData = { gltfExtensions: { RobotData: robotData } };
       applyFeatures(entry.features, animatables, {
         ...shapeTransform(object),
+        ...perAxisTransform(object, { scale: true }),
         ...materialFactors(material),
+        ...perAxisMaterialFactors(material),
         ...morphWeights(object, entry)
       });
       for (const child of entry.children ?? []) {
@@ -2794,6 +2863,7 @@ function buildSceneGraph(world, animatables, rootId) {
       applyFeatures(entry.features, animatables, {
         translation,
         rotation,
+        ...perAxisTransform(object, { scale: false }),
         width: (value) => {
           if (instanceOfRawNumber(value)) object.scale.x = value;
         },
@@ -2834,8 +2904,9 @@ function groupTransform(object) {
       }
     },
     rotation: (value) => {
-      if (instanceOfRawEuler(value)) {
-        object.rotation.set(value.x, value.y, value.z, "ZYX");
+      const euler = eulerOf(value);
+      if (euler) {
+        object.rotation.set(...euler, "ZYX");
       } else if (instanceOfRawNumber(value)) {
         object.rotation.set(0, 0, 0);
         object.rotateZ(value);
@@ -2864,8 +2935,9 @@ function shapeTransform(object) {
       }
     },
     rotation: (value) => {
-      if (instanceOfRawEuler(value)) {
-        object.rotation.set(value.x, value.y, value.z, "ZYX");
+      const euler = eulerOf(value);
+      if (euler) {
+        object.rotation.set(...euler, "ZYX");
       }
     },
     scale: (value) => {
@@ -2879,6 +2951,58 @@ function shapeTransform(object) {
     }
   };
 }
+function eulerOf(value) {
+  if (instanceOfRawEuler(value)) {
+    return [value.x, value.y, value.z];
+  }
+  const rpy = value;
+  if (rpy !== null && typeof rpy === "object" && typeof rpy.r === "number" && typeof rpy.p === "number" && typeof rpy.y === "number") {
+    return [rpy.r, rpy.p, rpy.y];
+  }
+  return void 0;
+}
+function perAxis(name, axes, set) {
+  return Object.fromEntries(
+    axes.map((axis, index) => [
+      `${name}.${axis}`,
+      (value) => {
+        if (instanceOfRawNumber(value)) {
+          set(index, value);
+        }
+      }
+    ])
+  );
+}
+function perAxisTransform(object, { scale }) {
+  return {
+    ...perAxis("translation", ["x", "y", "z"], (index, value) => {
+      object.position.setComponent(index, value);
+    }),
+    ...perAxis("rotation", ["r", "p", "y"], (index, value) => {
+      const euler = [object.rotation.x, object.rotation.y, object.rotation.z];
+      euler[index] = value;
+      object.rotation.set(euler[0], euler[1], euler[2], "ZYX");
+    }),
+    ...scale ? perAxis("scale", ["x", "y", "z"], (index, value) => {
+      object.scale.setComponent(index, value);
+    }) : {}
+  };
+}
+function perAxisMaterialFactors(material) {
+  const standard = material;
+  const phong = material;
+  const channels = ["r", "g", "b"];
+  const component = (color) => (index, value) => {
+    if (color) {
+      color[channels[index]] = value;
+    }
+  };
+  return {
+    ...perAxis("color", channels, component(standard.color)),
+    ...perAxis("emissive", channels, component(standard.emissive)),
+    ...perAxis("specular", channels, component(phong.specular))
+  };
+}
 function materialFactors(material) {
   const standard = material;
   const phong = material;
@@ -3024,6 +3148,7 @@ export {
   applyVizijBundle,
   buildSceneGraph,
   canvasMounted,
+  createExportAnimation,
   createVizijStore,
   deriveMorphFeatureKeys,
   deriveRootBounds,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vizij/render",
   "description": "Vizij faces on a page: the shared canvas and face slots over @vizij/runtime's Bevy view, and the GLB loader, exporter and world model.",
-  "version": "2.0.0",
+  "version": "3.0.0",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",