@fusion.dev/helix-graph 0.125.0 → 0.127.0

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

@@ -1,6 +1,8 @@
 /** A point in the renderer's own units. */
 export interface GraphPoint {
+    /** Across. */
     x: number;
+    /** Up. */
     y: number;
     /** How near the viewer, for a renderer that draws in three dimensions. */
     z?: number | undefined;
@@ -17,6 +19,13 @@ export interface SeedLink {
     source: string;
     target: string;
 }
+/** The angle between one place and the next on a spiral: the golden angle, which never lines two up. */
+export declare const TURN: number;
+/**
+ * Each note's neighbors across the links, both ways, kept to the links
+ * whose two ends `keep` allows where it is given.
+ */
+export declare const neighborsOf: (links: readonly SeedLink[], keep?: (id: string) => boolean) => Map<string, string[]>;
 /**
  * Where each note starts, and which of them a layout still has to place.
  *

package/dist/connect-graph/seed.js

@@ -1,4 +1,23 @@
-const TURN = Math.PI * (3 - Math.sqrt(5));
+export const TURN = Math.PI * (3 - Math.sqrt(5));
+export const neighborsOf = (links, keep) => {
+    const neighbors = new Map();
+    const add = (from, to) => {
+        const list = neighbors.get(from);
+        if (list) {
+            list.push(to);
+        }
+        else {
+            neighbors.set(from, [to]);
+        }
+    };
+    for (const { source, target } of links) {
+        if (!keep || (keep(source) && keep(target))) {
+            add(source, target);
+            add(target, source);
+        }
+    }
+    return neighbors;
+};
 const NEAR = 0.5;
 const nudge = (id) => {
     let hash = 2166136261;
@@ -26,20 +45,7 @@ export const seedPositions = (nodes, links, known = new Map()) => {
             }
         }
     }
-    const neighbors = new Map();
-    const add = (from, to) => {
-        const list = neighbors.get(from);
-        if (list) {
-            list.push(to);
-        }
-        else {
-            neighbors.set(from, [to]);
-        }
-    };
-    for (const { source, target } of links) {
-        add(source, target);
-        add(target, source);
-    }
+    const neighbors = neighborsOf(links);
     let spiral = positions.size;
     for (const node of nodes) {
         if (positions.has(node.id)) {

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

@@ -1,5 +1,5 @@
+import { type ShapeField } from '../shapes/shape-field.js';
 import type { GraphPoint } from './seed.js';
-import { type ShapeField } from './shape-field.js';
 /**
  * A shape the notes are drawn in. **Any shape field**, flat or solid, such as
  * `inflate` makes; or, flat, an SVG path in a box `width` by `height`, as an
@@ -23,6 +23,14 @@ export type GraphStencil = (ShapeField | {
     place?: 'fill' | 'surface' | undefined;
     /** How thick the surface's shell is, as a share of the shape's size. 0.04 by default. */
     shell?: number | undefined;
+    /**
+     * Which named part of the shape each group's notes go to, by group, such
+     * as `{ Vision: 'occipital' }`, where the shape has named parts: a model's
+     * named meshes, or an SVG's elements with an `id`. A group not named here,
+     * or naming a part the shape does not have, shares the parts no group
+     * claims.
+     */
+    regions?: Readonly<Record<string, string>> | undefined;
 };
 /** The field a stencil is, or is made into. */
 export declare const fieldOf: (stencil: GraphStencil) => ShapeField;
@@ -55,7 +63,9 @@ export declare const fitToStencil: (positions: ReadonlyMap<string, GraphPoint>,
  * `middle.y - (y - height / 2) * scale` and `middle.z + (z - depth / 2) * scale`.
  */
 export interface StencilFrame {
+    /** The stencil's shape, as a field, whatever form it was given in. */
     field: ShapeField;
+    /** Where the middle of the stencil's box was put, in the places' units. */
     middle: {
         x: number;
         y: number;

package/dist/connect-graph/stencil.js

@@ -1,4 +1,4 @@
-import { fieldFromInside, fieldFromPath } from './shape-field.js';
+import { fieldFromInside, fieldFromPath } from '../shapes/shape-field.js';
 import { surfaceWeb } from './surface-web.js';
 const PROBE = { flat: 64, solid: 32 };
 const SHELL = 0.04;
@@ -78,6 +78,72 @@ export const placesIn = (field, count, { place = 'fill', shell = SHELL } = {}) =
     }
     return [];
 };
+const placesByRegion = (field, asked, options) => {
+    const regionOf = field.regionOf;
+    const count = [...asked.values()].reduce((sum, many) => sum + many, 0);
+    if (!regionOf) {
+        return undefined;
+    }
+    for (let times = 3; times <= 24; times *= 2) {
+        const pool = placesIn(field, count * times, options);
+        if (pool.length === 0) {
+            return undefined;
+        }
+        const byRegion = new Map();
+        const inRegion = pool.map((place) => regionOf(place.x, place.y, place.z));
+        pool.forEach((place, at) => {
+            const region = inRegion[at];
+            const list = byRegion.get(region);
+            if (list) {
+                list.push(place);
+            }
+            else {
+                byRegion.set(region, [place]);
+            }
+        });
+        const found = new Set([...byRegion.keys()].filter((region) => region !== undefined));
+        const missing = [...asked.keys()].filter((region) => region !== undefined && !found.has(region));
+        if (missing.length > 0 && times * 2 <= 24) {
+            continue;
+        }
+        const wanted = new Map();
+        for (const [region, many] of asked) {
+            const part = region !== undefined && found.has(region) ? region : undefined;
+            wanted.set(part, (wanted.get(part) ?? 0) + many);
+        }
+        const claimed = new Set([...wanted.keys()].filter((region) => region !== undefined));
+        const places = [];
+        const regions = [];
+        let short = false;
+        for (const [region, many] of wanted) {
+            if (region === undefined) {
+                continue;
+            }
+            const own = byRegion.get(region) ?? [];
+            if (own.length < many) {
+                short = true;
+                break;
+            }
+            for (const place of own.slice(0, many)) {
+                places.push(place);
+                regions.push(region);
+            }
+        }
+        const rest = wanted.get(undefined) ?? 0;
+        const taken = new Set(places);
+        const free = pool.filter((_, at) => !claimed.has(inRegion[at]));
+        const spare = free.length >= rest ? free : pool.filter((place) => !taken.has(place));
+        if (short || spare.length < rest) {
+            continue;
+        }
+        for (const place of spare.slice(0, rest)) {
+            places.push(place);
+            regions.push(undefined);
+        }
+        return { found, missing, places, regions };
+    }
+    return undefined;
+};
 const nested = (items, keys) => {
     const [key, ...rest] = keys;
     if (!key) {
@@ -101,10 +167,38 @@ export const fitInStencil = (positions, stencil, { clustersOf, } = {}) => {
         return { positions: new Map() };
     }
     const field = fieldOf(stencil);
-    const places = placesIn(field, notes.length, {
-        place: stencil.place ?? 'fill',
-        shell: stencil.shell ?? SHELL,
-    });
+    const options = { place: stencil.place ?? 'fill', shell: stencil.shell ?? SHELL };
+    const groupOf = (id) => clustersOf?.(id)[0];
+    const noteRegion = new Map(notes.map((note) => {
+        const group = groupOf(note.id);
+        return [note.id, group === undefined ? undefined : stencil.regions?.[group]];
+    }));
+    const asked = new Map();
+    for (const region of noteRegion.values()) {
+        asked.set(region, (asked.get(region) ?? 0) + 1);
+    }
+    const regional = [...asked.keys()].some((region) => region !== undefined)
+        ? placesByRegion(field, asked, options)
+        : undefined;
+    if (regional && regional.missing.length > 0) {
+        console.warn(`fitInStencil: the shape has no part named ${regional.missing.map((part) => `"${part}"`).join(', ')}, so the notes sent there are placed with the rest. Its parts: ${[...regional.found].join(', ') || 'none'}.`);
+    }
+    else if (!regional && [...asked.keys()].some((region) => region !== undefined)) {
+        console.warn(field.regionOf
+            ? 'fitInStencil: the parts named in regions are too small for the notes sent to them, so the notes are placed over the whole shape.'
+            : 'fitInStencil: the shape has no named parts, so regions is not used and the notes are placed over the whole shape.');
+    }
+    for (const [id, region] of noteRegion) {
+        if (region !== undefined && !regional?.found.has(region)) {
+            noteRegion.set(id, undefined);
+        }
+    }
+    const wanted = new Map();
+    for (const region of noteRegion.values()) {
+        wanted.set(region, (wanted.get(region) ?? 0) + 1);
+    }
+    const places = regional?.places ?? placesIn(field, notes.length, options);
+    const placeRegion = regional?.regions ?? places.map(() => undefined);
     if (places.length < notes.length) {
         return { positions: new Map(positions) };
     }
@@ -237,13 +331,17 @@ export const fitInStencil = (positions, stencil, { clustersOf, } = {}) => {
             halve(ours.slice(0, half), near, level);
             halve(ours.slice(half), rest, level);
         };
-        halve([...notes], targets.map((_, at) => at));
+        for (const region of wanted.keys()) {
+            halve(notes.filter((note) => noteRegion.get(note.id) === region), targets.flatMap((_, at) => (placeRegion[at] === region ? [at] : [])));
+        }
         return { frame: { field, middle, scale, shell: thickness }, positions: fitted };
     }
-    const ours = nested(notes, [(note) => note.at.x, (note) => note.at.y]);
-    const theirs = nested(spots, [(spot) => spot.across, (spot) => spot.down]);
-    ours.forEach((note, at) => {
-        fitted.set(note.id, theirs[at].at);
-    });
+    for (const region of wanted.keys()) {
+        const ours = nested(notes.filter((note) => noteRegion.get(note.id) === region), [(note) => note.at.x, (note) => note.at.y]);
+        const theirs = nested(spots.filter((_, at) => placeRegion[at] === region), [(spot) => spot.across, (spot) => spot.down]);
+        ours.forEach((note, at) => {
+            fitted.set(note.id, theirs[at].at);
+        });
+    }
     return { frame: { field, middle, scale, shell: thickness }, positions: fitted };
 };

package/dist/cosmos/cosmos-driver.d.ts

@@ -1,5 +1,5 @@
 import type { GraphDriver } from '../connect-graph/connect-graph.js';
-import type { NodeLook } from '../connect-graph/looks.js';
+import { type NodeLook } from '../connect-graph/looks.js';
 /** A cosmos.gl graph, as far as the driver calls it. */
 export interface CosmosGraph {
     fitView(duration?: number, padding?: number): void;
@@ -24,7 +24,7 @@ export interface CosmosGraph {
     setPointShapes(pointShapes: Float32Array): void;
     setPointSizes(pointSizes: Float32Array): void;
     setZoomLevel(value: number, duration?: number): void;
-    setZoomTransformByPointPositions(positions: Float32Array, duration?: number, scale?: number): void;
+    setZoomTransformByPointPositions(positions: Float32Array, duration?: number, scale?: number, padding?: number): void;
     spaceToScreenPosition(spacePosition: [number, number]): [number, number];
     spaceToScreenRadius(spaceRadius: number): number;
     start(alpha?: number): void;
@@ -40,7 +40,7 @@ export interface CosmosDriverOptions {
      * default, past where twenty thousand notes settle on a laptop's GPU.
      */
     layoutLimit?: number | undefined;
-    /** A note's shape where it does not say: `circle` by default, `square` or `diamond`. */
+    /** A note's shape where it does not say: `circle` by default, `square` or `diamond`. A `ring` is drawn as a circle. */
     shape?: NodeLook['shape'];
     /** The size of cosmos.gl's space, as its own `spaceSize` says. 4096 by default. */
     spaceSize?: number | undefined;
@@ -62,6 +62,7 @@ export interface CosmosDriverOptions {
  * each group, over the drawing, as the Sigma driver does.
  *
  * **It is `@cosmos.gl/graph`, which is MIT**, and not Cosmograph, which is
- * licensed for noncommercial use only.
+ * licensed for noncommercial use only. The graph is the page's: after
+ * `disconnect()`, `graph.destroy()` frees it.
  */
 export declare const cosmosDriver: (graph: CosmosGraph, container: HTMLElement, options?: CosmosDriverOptions) => GraphDriver;

package/dist/cosmos/cosmos-driver.js

@@ -1,3 +1,5 @@
+import { linkKey } from '../connect-graph/diff.js';
+import { rgbOf } from '../connect-graph/looks.js';
 import { gesturesHeld, groupsOver, namesOver, signalsOver, } from '../overlay/overlay.js';
 const SHAPES = { circle: 0, diamond: 3, ring: 0, square: 1 };
 const STEP = 250;
@@ -9,8 +11,10 @@ const pixels = (size) => 0.5 * (1.6 + 1.35 * Math.max(size, 0));
 const CLUSTER = 0.1;
 const FOLLOW = 1000;
 const PADDING = 0.08;
+const SIGNALED = 2500;
+const still = () => typeof matchMedia === 'function' && matchMedia('(prefers-reduced-motion: reduce)').matches;
 const channels = (color, alpha = 1) => {
-    const [red = 128, green = 128, blue = 128] = color.match(/[\d.]+/g)?.map(Number) ?? [];
+    const [red, green, blue] = rgbOf(color);
     return [red / 255, green / 255, blue / 255, alpha];
 };
 export const cosmosDriver = (graph, container, options = {}) => {
@@ -25,6 +29,7 @@ export const cosmosDriver = (graph, container, options = {}) => {
     let near = new Set();
     let groupSample = [];
     let following = new Set();
+    const signaled = new Map();
     let moved = false;
     let stopped = false;
     let uploaded = 0;
@@ -51,8 +56,17 @@ export const cosmosDriver = (graph, container, options = {}) => {
         if (hovered !== undefined) {
             next.add(hovered);
         }
+        const now = performance.now();
         for (const at of extra) {
-            next.add(at);
+            signaled.set(at, now + SIGNALED);
+        }
+        for (const [at, until] of signaled) {
+            if (until < now) {
+                signaled.delete(at);
+            }
+            else {
+                next.add(at);
+            }
         }
         if (next.size !== following.size || [...next].some((at) => !following.has(at))) {
             following = next;
@@ -80,7 +94,7 @@ export const cosmosDriver = (graph, container, options = {}) => {
     };
     const held = gesturesHeld(container);
     const signals = signalsOver(container, onScreen);
-    const groups = groupsOver(container, onScreen);
+    const groups = groupsOver(container, onScreen, () => names.boxes());
     const names = namesOver(container, onScreen);
     const drawNames = () => {
         const lit = hovered === undefined ? undefined : ids[hovered];
@@ -96,10 +110,11 @@ export const cosmosDriver = (graph, container, options = {}) => {
     const flatNow = () => live()
         ? graph.getPointPositions()
         : ids.flatMap((id) => toSpace(drawnNow.get(id) ?? { x: 0, y: 0 }));
-    const fitAll = (duration) => {
+    const fitAll = (asked) => {
         if (stopped) {
             return;
         }
+        const duration = still() ? 0 : asked;
         if (!graph.isReady) {
             void graph.ready.then(() => requestAnimationFrame(() => fitAll(duration)));
             return;
@@ -123,30 +138,59 @@ export const cosmosDriver = (graph, container, options = {}) => {
             graph.setConfigPartial({ pointSizeScale: by });
             if (Math.abs(clarity() - painted) > 0.04) {
                 paintLinks();
-                graph.render();
+                graph.render(undefined, 0);
             }
         }
     };
     const clarity = () => FAINT + (1 - FAINT) * Math.min(Math.max((grown - 1) / 0.8, 0), 1);
     let painted = 1;
+    let linkColors = new Float32Array(0);
+    let widths = new Float32Array(0);
+    let linksOf = new Map();
+    const paintLink = (at, lit) => {
+        const link = links[at];
+        const look = looks.link(link.source, link.target);
+        const touches = lit !== undefined && (link.source === lit || link.target === lit);
+        const whole = look.raised || touches;
+        linkColors.set(channels(touches ? looks.node(lit).color : look.color, look.hidden ? 0 : whole ? 1 : painted), at * 4);
+        widths[at] = whole ? 1.6 : 0.8;
+    };
     const paintLinks = () => {
         if (!looks) {
             return;
         }
         painted = clarity();
-        const linkColors = new Float32Array(links.length * 4);
-        const widths = new Float32Array(links.length);
+        if (linkColors.length !== links.length * 4) {
+            linkColors = new Float32Array(links.length * 4);
+            widths = new Float32Array(links.length);
+        }
         const lit = hovered === undefined ? undefined : ids[hovered];
-        links.forEach((link, at) => {
-            const look = looks.link(link.source, link.target);
-            const touches = lit !== undefined && (link.source === lit || link.target === lit);
-            const whole = look.raised || touches;
-            linkColors.set(channels(touches ? looks.node(lit).color : look.color, look.hidden ? 0 : whole ? 1 : painted), at * 4);
-            widths[at] = whole ? 1.6 : 0.8;
-        });
+        for (let at = 0; at < links.length; at++) {
+            paintLink(at, lit);
+        }
+        graph.setLinkColors(linkColors);
+        graph.setLinkWidths(widths);
+    };
+    const hover = (next) => {
+        const was = hovered === undefined ? undefined : ids[hovered];
+        hovered = next;
+        container.style.cursor = next === undefined ? cursor : 'pointer';
+        if (!looks) {
+            return;
+        }
+        const lit = next === undefined ? undefined : ids[next];
+        for (const id of [was, lit]) {
+            for (const at of id === undefined ? [] : (linksOf.get(id) ?? [])) {
+                paintLink(at, lit);
+            }
+        }
         graph.setLinkColors(linkColors);
         graph.setLinkWidths(widths);
+        follow();
+        graph.render(undefined, 0);
+        redraw();
     };
+    const cursor = container.style.cursor;
     const paint = (transition = 0) => {
         if (!looks) {
             return;
@@ -181,12 +225,7 @@ export const cosmosDriver = (graph, container, options = {}) => {
             hoveredPointRingColor: channels(looks.ink, 0.6),
         });
         follow();
-        if (transition > 0) {
-            graph.render(undefined, transition);
-        }
-        else {
-            graph.render();
-        }
+        graph.render(undefined, still() ? 0 : transition);
         redraw();
     };
     const load = (nodes, next, positions, transition = 0) => {
@@ -194,7 +233,20 @@ export const cosmosDriver = (graph, container, options = {}) => {
         index = new Map(ids.map((id, at) => [id, at]));
         drawnNow = new Map(nodes.map((node) => [node.id, node]));
         sizes = nodes.map((node) => pixels(node.size));
+        hovered = undefined;
         links = next.filter((link) => index.has(link.source) && index.has(link.target));
+        linksOf = new Map();
+        links.forEach((link, at) => {
+            for (const end of [link.source, link.target]) {
+                const list = linksOf.get(end);
+                if (list) {
+                    list.push(at);
+                }
+                else {
+                    linksOf.set(end, [at]);
+                }
+            }
+        });
         const pairs = new Float32Array(links.length * 2);
         links.forEach((link, at) => {
             pairs[at * 2] = index.get(link.source);
@@ -215,14 +267,8 @@ export const cosmosDriver = (graph, container, options = {}) => {
     };
     graph.setConfigPartial({
         backgroundColor: [0, 0, 0, 0],
-        onPointMouseOut: () => {
-            hovered = undefined;
-            paint();
-        },
-        onPointMouseOver: (at) => {
-            hovered = at;
-            paint();
-        },
+        onPointMouseOut: () => hover(undefined),
+        onPointMouseOver: (at) => hover(at),
         onSimulationTick: redraw,
         onTransition: redraw,
         onZoom: () => {
@@ -243,11 +289,15 @@ export const cosmosDriver = (graph, container, options = {}) => {
         center: (id, animate) => {
             const at = index.get(id);
             if (at !== undefined) {
+                moved = true;
                 graph.zoomToPointByIndex(at, animate ? STEP * 2 : 0, graph.getZoomLevel(), true);
             }
         },
         draw: ({ links: next, nodes }) => {
-            const reach = Math.max(1, ...nodes.map((node) => Math.max(Math.abs(node.x), Math.abs(node.y))));
+            let reach = 1;
+            for (const node of nodes) {
+                reach = Math.max(reach, Math.abs(node.x), Math.abs(node.y));
+            }
             scale = (space * 0.12) / reach;
             moved = false;
             const positions = new Float32Array(nodes.length * 2);
@@ -259,11 +309,41 @@ export const cosmosDriver = (graph, container, options = {}) => {
             fitAll(0);
         },
         fit: (fitted, animate) => {
-            const indices = fitted.flatMap((id) => {
+            const flat = flatNow();
+            const box = { bottom: -Infinity, left: Infinity, right: -Infinity, top: Infinity };
+            for (const id of fitted) {
                 const at = index.get(id);
-                return at === undefined ? [] : [at];
-            });
-            graph.fitViewByPointIndices(indices, animate ? STEP * 2 : 0, 0.25);
+                if (at !== undefined) {
+                    const x = flat[at * 2] ?? 0;
+                    const y = flat[at * 2 + 1] ?? 0;
+                    box.left = Math.min(box.left, x);
+                    box.right = Math.max(box.right, x);
+                    box.top = Math.min(box.top, y);
+                    box.bottom = Math.max(box.bottom, y);
+                }
+            }
+            if (!Number.isFinite(box.left)) {
+                return;
+            }
+            let low = Infinity;
+            let high = -Infinity;
+            for (let at = 0; at < flat.length; at++) {
+                low = Math.min(low, flat[at]);
+                high = Math.max(high, flat[at]);
+            }
+            const least = Math.max((high - low) * 0.2, 1);
+            const middle = { x: (box.left + box.right) / 2, y: (box.top + box.bottom) / 2 };
+            const half = {
+                x: Math.max(box.right - box.left, least) / 2,
+                y: Math.max(box.bottom - box.top, least) / 2,
+            };
+            moved = true;
+            graph.setZoomTransformByPointPositions(new Float32Array([
+                middle.x - half.x,
+                middle.y - half.y,
+                middle.x + half.x,
+                middle.y + half.y,
+            ]), animate && !still() ? STEP * 2 : 0, undefined, 0.25);
         },
         gestures: (next) => {
             held.set(next);
@@ -309,6 +389,7 @@ export const cosmosDriver = (graph, container, options = {}) => {
         },
         onPress: (press) => {
             graph.setConfigPartial({
+                onBackgroundClick: () => press(undefined),
                 onPointClick: (at) => {
                     const id = ids[at];
                     if (id !== undefined) {
@@ -316,11 +397,12 @@ export const cosmosDriver = (graph, container, options = {}) => {
                     }
                 },
             });
-            return () => graph.setConfigPartial({ onPointClick: undefined });
+            return () => graph.setConfigPartial({ onBackgroundClick: undefined, onPointClick: undefined });
         },
         panBy: (x, y, animate) => {
             const { height, width } = container.getBoundingClientRect();
             const to = graph.screenToSpacePosition([width / 2 + x, height / 2 + y]);
+            moved = true;
             graph.setZoomTransformByPointPositions(new Float32Array(to), animate ? STEP : 0, graph.getZoomLevel());
         },
         settle: (unplaced, placed) => {
@@ -349,6 +431,7 @@ export const cosmosDriver = (graph, container, options = {}) => {
                 clearInterval(fitting);
                 graph.setConfigPartial({ onSimulationEnd: undefined });
                 graph.setPinnedPoints(null);
+                graph.pause();
             };
         },
         signal: (from, to, colors, animate) => {
@@ -359,7 +442,9 @@ export const cosmosDriver = (graph, container, options = {}) => {
         stop: () => {
             stopped = true;
             clearTimeout(overviewing);
+            container.style.cursor = cursor;
             graph.setConfigPartial({
+                onBackgroundClick: undefined,
                 onPointClick: undefined,
                 onPointMouseOut: undefined,
                 onPointMouseOver: undefined,
@@ -396,11 +481,8 @@ export const cosmosDriver = (graph, container, options = {}) => {
             for (const node of changes.addNodes) {
                 kept.set(node.id, node);
             }
-            const removed = new Set(changes.removeLinks.map((link) => `${link.source}\u0000${link.target}`));
-            const next = [
-                ...links.filter((link) => !removed.has(`${link.source}\u0000${link.target}`)),
-                ...changes.addLinks,
-            ];
+            const removed = new Set(changes.removeLinks.map(linkKey));
+            const next = [...links.filter((link) => !removed.has(linkKey(link))), ...changes.addLinks];
             const nodes = [...kept.values()];
             const positions = new Float32Array(nodes.length * 2);
             nodes.forEach((node, at) => {
@@ -413,6 +495,7 @@ export const cosmosDriver = (graph, container, options = {}) => {
             }
         },
         zoomBy: (direction, animate) => {
+            moved = true;
             graph.setZoomLevel(graph.getZoomLevel() * (direction > 0 ? ZOOM : 1 / ZOOM), animate ? STEP : 0);
         },
     };

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export { type ConnectGraphOptions, connectGraph, type DrawnLink, type DrawnNode, type GraphChanges, type GraphConnection, type GraphDriver, type GraphGroup, } from './connect-graph/connect-graph.js';
-export { diffGraph } from './connect-graph/diff.js';
-export { type GraphColors, type GraphLooks, graphColorsFrom, type LinkLook, type NodeLook, } from './connect-graph/looks.js';
-export { type GraphPoint, seedPositions } from './connect-graph/seed.js';
+export { diffGraph, linkKey } from './connect-graph/diff.js';
+export { type GraphColors, type GraphLooks, type GraphTone, graphColorsFrom, type LinkLook, type NodeLook, } from './connect-graph/looks.js';
+export { type GraphPoint, type SeedLink, type SeedNode, seedPositions, } from './connect-graph/seed.js';
 export { fitToStencil, type GraphStencil, type StencilFrame, } from './connect-graph/stencil.js';
+export type { ShapeField } from './shapes/shape-field.js';

package/dist/index.js

@@ -1,5 +1,5 @@
 export { connectGraph, } from './connect-graph/connect-graph.js';
-export { diffGraph } from './connect-graph/diff.js';
+export { diffGraph, linkKey } from './connect-graph/diff.js';
 export { graphColorsFrom, } from './connect-graph/looks.js';
-export { seedPositions } from './connect-graph/seed.js';
+export { seedPositions, } from './connect-graph/seed.js';
 export { fitToStencil, } from './connect-graph/stencil.js';

package/dist/model/index.d.ts

@@ -0,0 +1 @@
+export { shapeFromModel } from './model.js';

package/dist/model/index.js

@@ -0,0 +1 @@
+export { shapeFromModel } from './model.js';

package/dist/model/model.d.ts

@@ -0,0 +1,16 @@
+import type { ShapeField } from '../shapes/shape-field.js';
+import { type TriangleOptions } from '../shapes/triangles.js';
+/**
+ * A solid field from a glTF model, the web's standard format for one: a
+ * URL to a `.glb` or `.gltf` file, or the file's bytes. Every mesh in it is
+ * read, placed as the model places it, and where it has two meshes or more,
+ * each is a part of the field, named as the model names it, which a
+ * stencil's `regions` sends groups to. A mesh the model leaves unnamed is
+ * named as three.js names it, `mesh_0` and on.
+ *
+ * **three.js reads the file**, imported when this is first called, so a page
+ * that draws no model never downloads a loader. It is an optional peer of
+ * this package. A model that cannot be fetched or read is an error that
+ * names it, the loader's own error as its `cause`.
+ */
+export declare const shapeFromModel: (source: string | ArrayBuffer, options?: TriangleOptions) => Promise<ShapeField>;