@fusion.dev/helix-graph 0.198.0 → 0.199.0

package/dist/connect-graph/connect-graph.d.ts

@@ -69,10 +69,13 @@ export interface GraphDriver {
     /**
      * Runs a layout over the drawn graph, moving the notes in `unplaced` and
      * holding the rest, and calls `placed` once it has settled with where every
-     * note ended. Returns what stops it early. Without one, notes stay where the
-     * connector started them.
+     * note ended. Returns what stops it early: called with `true`, it ends the
+     * layout where the notes stand and calls `placed` with that, as the frame's
+     * stop control and the page's pause do; with nothing, it ends it unheard, as
+     * a new drawing does. Without one, notes stay where the connector started
+     * them.
      */
-    settle?(unplaced: ReadonlySet<string>, placed: (positions: ReadonlyMap<string, GraphPoint>) => void): () => void;
+    settle?(unplaced: ReadonlySet<string>, placed: (positions: ReadonlyMap<string, GraphPoint>) => void): (keep?: boolean) => void;
     /**
      * Which gestures the renderer takes from the page, as the frame's
      * `gestures` decides. `free` is what the renderer did before it was told

package/dist/connect-graph/connect-graph.js

@@ -1,4 +1,4 @@
-import { HelixGraphPanEvent, HelixGraphPartChangeEvent, HelixGraphSignalEvent, HelixGraphZoomEvent, isRtl, reportRuntime, watchTheme, } from '@fusion.dev/helix-core';
+import { HelixGraphPanEvent, HelixGraphPartChangeEvent, HelixGraphSignalEvent, HelixGraphZoomEvent, isRtl, motionPaused, onMotionChange, reportRuntime, watchTheme, } from '@fusion.dev/helix-core';
 import { arrangeByGroup, hubsOf } from './arrange.js';
 import { diffGraph, isEmpty, linkKey, } from './diff.js';
 import { graphColorsFrom, looksOf, toneColor, } from './looks.js';
@@ -36,6 +36,11 @@ export const connectGraph = (frame, driver, options = {}) => {
     let colors = null;
     let current;
     let stopSettling;
+    const stopPaused = onMotionChange((paused) => {
+        if (paused) {
+            stopSettling?.(true);
+        }
+    });
     let pressed;
     let pending = 0;
     let connected = true;
@@ -129,6 +134,7 @@ export const connectGraph = (frame, driver, options = {}) => {
         if (stopSettling) {
             stopSettling();
             stopSettling = undefined;
+            graph.settling?.();
         }
         cancelAnimationFrame(pending);
         const nodes = graph.nodes ?? [];
@@ -218,8 +224,12 @@ export const connectGraph = (frame, driver, options = {}) => {
         first = false;
         if (unplaced.size > 0 && driver.settle) {
             waiting = unplaced;
+            const unseen = still() || motionPaused();
+            let finished = false;
             stopSettling = driver.settle(unplaced, (settled) => {
+                finished = true;
                 stopSettling = undefined;
+                graph.settling?.();
                 if (!connected) {
                     return;
                 }
@@ -237,6 +247,13 @@ export const connectGraph = (frame, driver, options = {}) => {
                     ready();
                 }
             });
+            const stop = stopSettling;
+            if (finished) {
+                stopSettling = undefined;
+            }
+            else if (stop) {
+                graph.settling?.(() => stop(true), unseen);
+            }
             return;
         }
         waiting = new Set();
@@ -371,6 +388,8 @@ export const connectGraph = (frame, driver, options = {}) => {
             connected = false;
             cancelAnimationFrame(pending);
             stopSettling?.();
+            graph.settling?.();
+            stopPaused();
             stopPress?.();
             stopTheme();
             frame.removeEventListener(HelixGraphPartChangeEvent.eventName, handlePartChange);

package/dist/cosmos/cosmos-driver.js

@@ -425,7 +425,11 @@ export const cosmosDriver = (graph, container, options = {}) => {
             graph.start(1);
             const limit = setTimeout(finish, options.layoutLimit ?? 15000);
             const fitting = setInterval(() => fitAll(FOLLOW), FOLLOW);
-            return () => {
+            return (keep = false) => {
+                if (keep && !done) {
+                    finish();
+                    return;
+                }
                 done = true;
                 clearTimeout(limit);
                 clearInterval(fitting);

package/dist/sigma/sigma-driver.js

@@ -455,10 +455,14 @@ export const sigmaDriver = (sigma, options = {}) => {
                             finish();
                         }
                     }, SAMPLE);
-                    return () => {
+                    return (keep = false) => {
                         if (done) {
                             return;
                         }
+                        if (keep) {
+                            finish();
+                            return;
+                        }
                         done = true;
                         clearInterval(timer);
                         layout.stop();

package/dist/three/three-driver.js

@@ -1,4 +1,4 @@
-import { pageBudget, reportRuntime } from '@fusion.dev/helix-core';
+import { motionPaused, pageBudget, reportRuntime } from '@fusion.dev/helix-core';
 import { AdditiveBlending, BoxGeometry, BufferAttribute, BufferGeometry, DoubleSide, Euler, InstancedBufferAttribute, InstancedMesh, Matrix4, Mesh, NormalBlending, OctahedronGeometry, PerspectiveCamera, Points, Quaternion, Raycaster, Scene, ShaderMaterial, TOUCH, Vector2, Vector3, WebGLRenderer, } from 'three';
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 import { LineMaterial } from 'three/addons/lines/LineMaterial.js';
@@ -306,7 +306,7 @@ export const threeDriver = (container, options = {}) => {
     controls.enableDamping = !still();
     controls.dampingFactor = 0.08;
     controls.rotateSpeed = 0.6;
-    controls.autoRotate = !still() && options.autoRotate !== false;
+    controls.autoRotate = !still() && !motionPaused() && options.autoRotate !== false;
     controls.autoRotateSpeed = 0.5;
     let ids = [];
     let index = new Map();
@@ -1047,6 +1047,7 @@ export const threeDriver = (container, options = {}) => {
         }
         controls.autoRotate =
             !still() &&
+                !motionPaused() &&
                 options.autoRotate !== false &&
                 !touched &&
                 hovered === undefined &&
@@ -1359,7 +1360,17 @@ export const threeDriver = (container, options = {}) => {
                     placed(new Map(nodes.map((node) => [node.id, { x: node.x, y: node.y, z: node.z }])));
                 }
             });
-            return () => {
+            return (keep = false) => {
+                if (keep && !done) {
+                    if (layout) {
+                        layout.done();
+                    }
+                    else {
+                        done = true;
+                        placed(new Map(nodes.map((node) => [node.id, { x: node.x, y: node.y, z: node.z }])));
+                    }
+                    return;
+                }
                 done = true;
                 layout = undefined;
             };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix-graph",
   "description": "Connects the Helix Graph frame to a graph renderer: Sigma.js, cosmos.gl, three.js, or a driver of your own.",
-  "version": "0.198.0",
+  "version": "0.199.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -59,12 +59,12 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.198.0"
+    "@fusion.dev/helix-core": "0.199.0"
   },
   "devDependencies": {
     "@cosmos.gl/graph": "^3.4.2",
-    "@fusion.dev/helix-headless": "0.198.0",
-    "@fusion.dev/helix-testing": "0.198.0",
+    "@fusion.dev/helix-headless": "0.199.0",
+    "@fusion.dev/helix-testing": "0.199.0",
     "@types/bun": "^1.4.2",
     "@types/three": "^0.186.0",
     "d3-force-3d": "^3.0.6",