vizcraft 0.2.2 → 1.0.0

package/dist/edgeLabels.d.ts

@@ -0,0 +1,15 @@
+import type { EdgeLabel, VizEdge } from './types';
+import type { EdgePathResult } from './edgePaths';
+/**
+ * Resolve the (x, y) position of an edge label given an EdgePathResult.
+ * Falls back to `mid` for unknown positions.
+ */
+export declare function resolveEdgeLabelPosition(lbl: EdgeLabel, path: EdgePathResult): {
+    x: number;
+    y: number;
+};
+/**
+ * Collect all labels for an edge, preferring `labels[]` when present
+ * and falling back to the legacy `label` field.
+ */
+export declare function collectEdgeLabels(edge: VizEdge): EdgeLabel[];

package/dist/edgeLabels.js

@@ -0,0 +1,26 @@
+/**
+ * Resolve the (x, y) position of an edge label given an EdgePathResult.
+ * Falls back to `mid` for unknown positions.
+ */
+export function resolveEdgeLabelPosition(lbl, path) {
+    const base = lbl.position === 'start'
+        ? path.start
+        : lbl.position === 'end'
+            ? path.end
+            : path.mid;
+    return {
+        x: base.x + (lbl.dx || 0),
+        y: base.y + (lbl.dy || 0),
+    };
+}
+/**
+ * Collect all labels for an edge, preferring `labels[]` when present
+ * and falling back to the legacy `label` field.
+ */
+export function collectEdgeLabels(edge) {
+    if (edge.labels && edge.labels.length > 0)
+        return edge.labels;
+    if (edge.label)
+        return [edge.label];
+    return [];
+}

package/dist/edgePaths.d.ts

@@ -0,0 +1,43 @@
+/**
+ * Edge path computation helpers.
+ *
+ * Given start/end points, routing mode, and optional waypoints this module
+ * produces:
+ *   1. An SVG `d` attribute string (for `<path>` elements).
+ *   2. A midpoint along the path (for label positioning).
+ */
+import type { Vec2, VizNode, VizEdge, EdgeRouting } from './types';
+export interface EdgePathResult {
+    /** SVG path `d` attribute. */
+    d: string;
+    /** Approximate label position along the path (exact for straight/quadratic, approximated for spline and orthogonal-with-waypoints paths). */
+    mid: Vec2;
+    /** Position near the source end (~15% along the path). */
+    start: Vec2;
+    /** Position near the target end (~85% along the path). */
+    end: Vec2;
+}
+/**
+ * Compute anchor-resolved start/end points for an edge.
+ *
+ * When an edge specifies `fromPort` / `toPort`, the endpoint is resolved
+ * to the port's absolute position. Otherwise the legacy `anchor` mode
+ * (`'center'` | `'boundary'`) is used.
+ *
+ * This replicates the logic used internally by the core builder and
+ * runtime patcher so that external renderers (e.g. React) can
+ * resolve boundary anchors consistently.
+ */
+export declare function computeEdgeEndpoints(start: VizNode, end: VizNode, edge: VizEdge): {
+    start: Vec2;
+    end: Vec2;
+};
+/**
+ * Compute the SVG path for an edge.
+ *
+ * @param start    Start point (already anchor-resolved).
+ * @param end      End point (already anchor-resolved).
+ * @param routing  Routing algorithm (default `'straight'`).
+ * @param waypoints Optional intermediate points.
+ */
+export declare function computeEdgePath(start: Vec2, end: Vec2, routing?: EdgeRouting, waypoints?: Vec2[]): EdgePathResult;

package/dist/edgePaths.js

@@ -0,0 +1,253 @@
+/**
+ * Edge path computation helpers.
+ *
+ * Given start/end points, routing mode, and optional waypoints this module
+ * produces:
+ *   1. An SVG `d` attribute string (for `<path>` elements).
+ *   2. A midpoint along the path (for label positioning).
+ */
+import { computeNodeAnchor, effectivePos, resolvePortPosition } from './shapes';
+/**
+ * Compute anchor-resolved start/end points for an edge.
+ *
+ * When an edge specifies `fromPort` / `toPort`, the endpoint is resolved
+ * to the port's absolute position. Otherwise the legacy `anchor` mode
+ * (`'center'` | `'boundary'`) is used.
+ *
+ * This replicates the logic used internally by the core builder and
+ * runtime patcher so that external renderers (e.g. React) can
+ * resolve boundary anchors consistently.
+ */
+export function computeEdgeEndpoints(start, end, edge) {
+    const anchor = edge.anchor ?? 'boundary';
+    const startPos = effectivePos(start);
+    const endPos = effectivePos(end);
+    // Port-based resolution takes precedence over anchor mode.
+    const startAnchor = edge.fromPort
+        ? (resolvePortPosition(start, edge.fromPort) ??
+            computeNodeAnchor(start, endPos, anchor))
+        : computeNodeAnchor(start, endPos, anchor);
+    const endAnchor = edge.toPort
+        ? (resolvePortPosition(end, edge.toPort) ??
+            computeNodeAnchor(end, startPos, anchor))
+        : computeNodeAnchor(end, startPos, anchor);
+    return { start: startAnchor, end: endAnchor };
+}
+/**
+ * Compute the SVG path for an edge.
+ *
+ * @param start    Start point (already anchor-resolved).
+ * @param end      End point (already anchor-resolved).
+ * @param routing  Routing algorithm (default `'straight'`).
+ * @param waypoints Optional intermediate points.
+ */
+export function computeEdgePath(start, end, routing = 'straight', waypoints) {
+    switch (routing) {
+        case 'curved':
+            return curvedPath(start, end, waypoints);
+        case 'orthogonal':
+            return orthogonalPath(start, end, waypoints);
+        case 'straight':
+        default:
+            return straightPath(start, end, waypoints);
+    }
+}
+// ── Straight routing ────────────────────────────────────────────────────────
+function straightPath(start, end, waypoints) {
+    const pts = [start, ...(waypoints ?? []), end];
+    const segments = pts.map((p, i) => i === 0 ? `M ${p.x} ${p.y}` : `L ${p.x} ${p.y}`);
+    const positions = polylineLabelPositions(pts);
+    return {
+        d: segments.join(' '),
+        ...positions,
+    };
+}
+// ── Curved routing ──────────────────────────────────────────────────────────
+function curvedPath(start, end, waypoints) {
+    if (waypoints && waypoints.length > 0) {
+        // Use waypoints as control/through points – produce a smooth cubic path.
+        return curvedThroughPoints(start, end, waypoints);
+    }
+    // No waypoints: single quadratic bezier with auto-computed control point.
+    const cp = autoControlPoint(start, end);
+    const d = `M ${start.x} ${start.y} Q ${cp.x} ${cp.y} ${end.x} ${end.y}`;
+    const mid = quadraticAt(start, cp, end, 0.5);
+    const startPos = quadraticAt(start, cp, end, LABEL_FRACTION_START);
+    const endPos = quadraticAt(start, cp, end, LABEL_FRACTION_END);
+    return { d, mid, start: startPos, end: endPos };
+}
+/**
+ * Auto-compute a control point that creates a gentle arc.
+ * The control point is offset perpendicular to the line at the midpoint.
+ */
+function autoControlPoint(start, end) {
+    const mx = (start.x + end.x) / 2;
+    const my = (start.y + end.y) / 2;
+    const dx = end.x - start.x;
+    const dy = end.y - start.y;
+    const len = Math.sqrt(dx * dx + dy * dy) || 1;
+    // Perpendicular offset: 20% of the line length
+    const offset = len * 0.2;
+    return {
+        x: mx + (-dy / len) * offset,
+        y: my + (dx / len) * offset,
+    };
+}
+/** Point on a quadratic bezier at parameter t (0–1). */
+function quadraticAt(p0, cp, p1, t) {
+    const mt = 1 - t;
+    return {
+        x: mt * mt * p0.x + 2 * mt * t * cp.x + t * t * p1.x,
+        y: mt * mt * p0.y + 2 * mt * t * cp.y + t * t * p1.y,
+    };
+}
+/**
+ * Create a smooth cubic bezier path that goes through all waypoints.
+ *
+ * Strategy: use Catmull-Rom → cubic conversion for smooth interpolation
+ * through all points.
+ */
+function curvedThroughPoints(start, end, waypoints) {
+    const allPts = [start, ...waypoints, end];
+    if (allPts.length === 2) {
+        // Degenerate — just a quadratic
+        const cp = autoControlPoint(start, end);
+        return {
+            d: `M ${start.x} ${start.y} Q ${cp.x} ${cp.y} ${end.x} ${end.y}`,
+            mid: quadraticAt(start, cp, end, 0.5),
+            start: quadraticAt(start, cp, end, LABEL_FRACTION_START),
+            end: quadraticAt(start, cp, end, LABEL_FRACTION_END),
+        };
+    }
+    // Convert Catmull-Rom through allPts to cubic bezier segments.
+    let d = `M ${allPts[0].x} ${allPts[0].y}`;
+    const tension = 0.3; // 0 = straight, 0.5 = Catmull-Rom
+    for (let i = 0; i < allPts.length - 1; i++) {
+        const p0 = allPts[Math.max(i - 1, 0)];
+        const p1 = allPts[i];
+        const p2 = allPts[i + 1];
+        const p3 = allPts[Math.min(i + 2, allPts.length - 1)];
+        const cp1x = p1.x + (p2.x - p0.x) * tension;
+        const cp1y = p1.y + (p2.y - p0.y) * tension;
+        const cp2x = p2.x - (p3.x - p1.x) * tension;
+        const cp2y = p2.y - (p3.y - p1.y) * tension;
+        d += ` C ${cp1x} ${cp1y}, ${cp2x} ${cp2y}, ${p2.x} ${p2.y}`;
+    }
+    // Approximate label positions using the through-points polyline
+    const positions = polylineLabelPositions(allPts);
+    return { d, ...positions };
+}
+// ── Orthogonal routing ──────────────────────────────────────────────────────
+function orthogonalPath(start, end, waypoints) {
+    if (waypoints && waypoints.length > 0) {
+        // With waypoints, route through each using orthogonal segments.
+        return orthogonalThroughWaypoints(start, end, waypoints);
+    }
+    // Default: auto-compute an L-shaped or Z-shaped orthogonal route.
+    return autoOrthogonal(start, end);
+}
+/**
+ * Auto-orthogonal routing (no waypoints).
+ * Creates an elbow connector: H → V (or V → H depending on direction).
+ */
+function autoOrthogonal(start, end) {
+    const dx = Math.abs(end.x - start.x);
+    const dy = Math.abs(end.y - start.y);
+    let d;
+    let mid;
+    let startPos;
+    let endPos;
+    if (dx >= dy) {
+        // Horizontal-first elbow:  start → (midX, start.y) → (midX, end.y) → end
+        const midX = (start.x + end.x) / 2;
+        d = `M ${start.x} ${start.y} L ${midX} ${start.y} L ${midX} ${end.y} L ${end.x} ${end.y}`;
+        const pts = [
+            start,
+            { x: midX, y: start.y },
+            { x: midX, y: end.y },
+            end,
+        ];
+        mid = polylinePointAt(pts, 0.5);
+        startPos = polylinePointAt(pts, LABEL_FRACTION_START);
+        endPos = polylinePointAt(pts, LABEL_FRACTION_END);
+    }
+    else {
+        // Vertical-first elbow:  start → (start.x, midY) → (end.x, midY) → end
+        const midY = (start.y + end.y) / 2;
+        d = `M ${start.x} ${start.y} L ${start.x} ${midY} L ${end.x} ${midY} L ${end.x} ${end.y}`;
+        const pts = [
+            start,
+            { x: start.x, y: midY },
+            { x: end.x, y: midY },
+            end,
+        ];
+        mid = polylinePointAt(pts, 0.5);
+        startPos = polylinePointAt(pts, LABEL_FRACTION_START);
+        endPos = polylinePointAt(pts, LABEL_FRACTION_END);
+    }
+    return { d, mid, start: startPos, end: endPos };
+}
+/**
+ * Orthogonal routing through user-specified waypoints.
+ * Each waypoint pair is connected by an elbow (H-V or V-H).
+ */
+function orthogonalThroughWaypoints(start, end, waypoints) {
+    const allPts = [start, ...waypoints, end];
+    let d = `M ${allPts[0].x} ${allPts[0].y}`;
+    // Build the actual rendered points (including elbow intermediaries)
+    const renderedPts = [allPts[0]];
+    for (let i = 1; i < allPts.length; i++) {
+        const prev = allPts[i - 1];
+        const cur = allPts[i];
+        // Elbow: go horizontal first, then vertical
+        d += ` L ${cur.x} ${prev.y} L ${cur.x} ${cur.y}`;
+        renderedPts.push({ x: cur.x, y: prev.y });
+        renderedPts.push(cur);
+    }
+    const positions = polylineLabelPositions(renderedPts);
+    return { d, ...positions };
+}
+// ── Shared helpers ──────────────────────────────────────────────────────────
+/** Fraction along the path for each label position. */
+const LABEL_FRACTION_START = 0.15;
+const LABEL_FRACTION_END = 0.85;
+/**
+ * Point along a polyline at a given fraction (0–1) of total arc length.
+ * Fraction 0 = first point, 1 = last point.
+ */
+function polylinePointAt(pts, fraction) {
+    if (pts.length === 0)
+        return { x: 0, y: 0 };
+    if (pts.length === 1)
+        return pts[0];
+    let totalLen = 0;
+    for (let i = 1; i < pts.length; i++) {
+        const dx = pts[i].x - pts[i - 1].x;
+        const dy = pts[i].y - pts[i - 1].y;
+        totalLen += Math.sqrt(dx * dx + dy * dy);
+    }
+    const target = totalLen * fraction;
+    let accumulated = 0;
+    for (let i = 1; i < pts.length; i++) {
+        const dx = pts[i].x - pts[i - 1].x;
+        const dy = pts[i].y - pts[i - 1].y;
+        const segLen = Math.sqrt(dx * dx + dy * dy);
+        if (accumulated + segLen >= target) {
+            const t = segLen === 0 ? 0 : (target - accumulated) / segLen;
+            return {
+                x: pts[i - 1].x + dx * t,
+                y: pts[i - 1].y + dy * t,
+            };
+        }
+        accumulated += segLen;
+    }
+    return pts[pts.length - 1];
+}
+/** Shorthand: compute start, mid, end label positions for a polyline. */
+function polylineLabelPositions(pts) {
+    return {
+        start: polylinePointAt(pts, LABEL_FRACTION_START),
+        mid: polylinePointAt(pts, 0.5),
+        end: polylinePointAt(pts, LABEL_FRACTION_END),
+    };
+}

package/dist/index.d.ts

@@ -3,6 +3,10 @@ export * from './builder';
 export * from './styles';
 export * from './animations';
 export * from './overlays';
+export * from './overlayBuilder';
+export * from './edgePaths';
+export * from './edgeLabels';
+export { getDefaultPorts, getNodePorts, findPort, resolvePortPosition, } from './shapes';
 export * from './anim/spec';
 export * from './anim/animationBuilder';
 export * from './anim/playback';

package/dist/index.js

@@ -3,6 +3,10 @@ export * from './builder';
 export * from './styles';
 export * from './animations';
 export * from './overlays';
+export * from './overlayBuilder';
+export * from './edgePaths';
+export * from './edgeLabels';
+export { getDefaultPorts, getNodePorts, findPort, resolvePortPosition, } from './shapes';
 export * from './anim/spec';
 export * from './anim/animationBuilder';
 export * from './anim/playback';

package/dist/overlayBuilder.d.ts

@@ -0,0 +1,50 @@
+import type { OverlayId, OverlayParams, VizOverlaySpec } from './types';
+import type { CircleOverlayParams, GroupOverlayParams, RectOverlayParams, TextOverlayParams } from './overlays';
+export type OverlayAddOptions = {
+    /** Optional stable key used to uniquely identify an overlay instance. */
+    key?: string;
+    /** Optional class applied by the overlay renderer. */
+    className?: string;
+};
+/**
+ * Fluent overlay authoring.
+ *
+ * - Produces portable `VizOverlaySpec[]` data (rendering remains registry-driven).
+ * - Typed by `OverlayKindRegistry` when available, with a back-compat escape hatch.
+ */
+export declare class OverlayBuilder {
+    private readonly specs;
+    private readonly keyCounters;
+    /**
+     * Add an overlay spec.
+     *
+     * Overload 1: typed overlay ids via `OverlayKindRegistry`.
+     */
+    add<K extends OverlayId>(id: K, params: OverlayParams<K>, options?: OverlayAddOptions): this;
+    /**
+     * Add an overlay spec.
+     *
+     * Overload 2: back-compat escape hatch for arbitrary ids.
+     */
+    add(id: string, params: any, options?: OverlayAddOptions): this;
+    /** Remove overlays by key, or (if unkeyed) by id. */
+    remove(keyOrId: string): this;
+    /** Remove all overlays. */
+    clear(): this;
+    build(): VizOverlaySpec[];
+    /** Add a generic rectangle overlay (built-in, no custom registry needed). */
+    rect(params: RectOverlayParams, options?: OverlayAddOptions): this;
+    /** Add a generic circle overlay (built-in, no custom registry needed). */
+    circle(params: CircleOverlayParams, options?: OverlayAddOptions): this;
+    /** Add a generic text overlay (built-in, no custom registry needed). */
+    text(params: TextOverlayParams, options?: OverlayAddOptions): this;
+    /**
+     * Add a composite group overlay (built-in).
+     *
+     * Children are authored via the callback and rendered inside a single SVG <g>.
+     * You can animate the group by targeting its key and tweening `x`, `y`, `scale`, `rotation`, `opacity`.
+     */
+    group(params: Omit<GroupOverlayParams, 'children'>, buildChildren: (overlay: OverlayBuilder) => unknown, options?: OverlayAddOptions): this;
+}
+/** Convenience helper for one-off overlay list compilation. */
+export declare function buildOverlaySpecs(cb: (overlay: OverlayBuilder) => unknown): VizOverlaySpec[];

package/dist/overlayBuilder.js

@@ -0,0 +1,80 @@
+/**
+ * Fluent overlay authoring.
+ *
+ * - Produces portable `VizOverlaySpec[]` data (rendering remains registry-driven).
+ * - Typed by `OverlayKindRegistry` when available, with a back-compat escape hatch.
+ */
+export class OverlayBuilder {
+    specs = [];
+    keyCounters = new Map();
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    add(id, params, options) {
+        const className = options?.className;
+        // If a user adds multiple overlays of the same id without keys, they will
+        // collide at reconcile time (since the DOM layer uses `key || id`).
+        // We auto-generate a stable-ish key in that case.
+        let key = options?.key;
+        if (!key) {
+            const hasUnkeyedSameId = this.specs.some((s) => s.id === id && (s.key === undefined || s.key === ''));
+            if (hasUnkeyedSameId) {
+                const next = (this.keyCounters.get(id) ?? 0) + 1;
+                this.keyCounters.set(id, next);
+                key = `${id}#${next}`;
+            }
+        }
+        this.specs.push({ id, params, key, className });
+        return this;
+    }
+    /** Remove overlays by key, or (if unkeyed) by id. */
+    remove(keyOrId) {
+        for (let i = this.specs.length - 1; i >= 0; i--) {
+            const s = this.specs[i];
+            if (!s)
+                continue;
+            const matchesKey = s.key === keyOrId;
+            const matchesUnkeyedId = !s.key && s.id === keyOrId;
+            if (matchesKey || matchesUnkeyedId)
+                this.specs.splice(i, 1);
+        }
+        return this;
+    }
+    /** Remove all overlays. */
+    clear() {
+        this.specs.length = 0;
+        this.keyCounters.clear();
+        return this;
+    }
+    build() {
+        return [...this.specs];
+    }
+    /** Add a generic rectangle overlay (built-in, no custom registry needed). */
+    rect(params, options) {
+        return this.add('rect', params, options);
+    }
+    /** Add a generic circle overlay (built-in, no custom registry needed). */
+    circle(params, options) {
+        return this.add('circle', params, options);
+    }
+    /** Add a generic text overlay (built-in, no custom registry needed). */
+    text(params, options) {
+        return this.add('text', params, options);
+    }
+    /**
+     * Add a composite group overlay (built-in).
+     *
+     * Children are authored via the callback and rendered inside a single SVG <g>.
+     * You can animate the group by targeting its key and tweening `x`, `y`, `scale`, `rotation`, `opacity`.
+     */
+    group(params, buildChildren, options) {
+        const childOverlay = new OverlayBuilder();
+        buildChildren(childOverlay);
+        const children = childOverlay.build();
+        return this.add('group', { ...params, children }, options);
+    }
+}
+/** Convenience helper for one-off overlay list compilation. */
+export function buildOverlaySpecs(cb) {
+    const overlay = new OverlayBuilder();
+    cb(overlay);
+    return overlay.build();
+}

package/dist/overlays.d.ts

@@ -1,9 +1,115 @@
 import type { VizNode, VizEdge, VizOverlaySpec, VizScene } from './types';
+export type SignalOverlayParams = {
+    from: string;
+    to: string;
+    progress: number;
+    magnitude?: number;
+};
+export type GridLabelsOverlayParams = {
+    colLabels?: Record<number, string>;
+    rowLabels?: Record<number, string>;
+    yOffset?: number;
+    xOffset?: number;
+};
+export interface DataPoint {
+    id: string;
+    currentNodeId: string;
+    [key: string]: any;
+}
+export type DataPointsOverlayParams = {
+    points: DataPoint[];
+};
+export type RectOverlayParams = {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+    rx?: number;
+    ry?: number;
+    opacity?: number;
+    /** SVG fill (defaults to a visible blue). Can be overridden by CSS via className. */
+    fill?: string;
+    /** SVG stroke (defaults to a visible blue). Can be overridden by CSS via className. */
+    stroke?: string;
+    /** SVG stroke-width (defaults to 3). Can be overridden by CSS via className. */
+    strokeWidth?: number;
+};
+export type CircleOverlayParams = {
+    x: number;
+    y: number;
+    r: number;
+    opacity?: number;
+    /** SVG fill (defaults to a visible blue). Can be overridden by CSS via className. */
+    fill?: string;
+    /** SVG stroke (defaults to a visible blue). Can be overridden by CSS via className. */
+    stroke?: string;
+    /** SVG stroke-width (defaults to 3). Can be overridden by CSS via className. */
+    strokeWidth?: number;
+};
+export type TextOverlayParams = {
+    x: number;
+    y: number;
+    text: string;
+    opacity?: number;
+    /** SVG fill color (defaults to #111). Can be overridden by CSS via className. */
+    fill?: string;
+    fontSize?: number;
+    fontWeight?: string | number;
+    textAnchor?: 'start' | 'middle' | 'end';
+    dominantBaseline?: string;
+};
+export type GroupOverlayParams = {
+    /**
+     * Translate (group-local origin).
+     *
+     * If `from`/`to` are provided, these act as an additional offset.
+     */
+    x?: number;
+    y?: number;
+    /**
+     * Optional node ids used to drive the group's position via `progress`.
+     *
+     * When set, the group will translate along the line from `from` to `to`.
+     */
+    from?: string;
+    to?: string;
+    /** Interpolation 0..1 used when `from`/`to` are set. */
+    progress?: number;
+    /**
+     * Optional "pulse" value 0..1.
+     *
+     * When provided, it scales the group slightly (in addition to `scale`).
+     */
+    magnitude?: number;
+    /** Scale around group origin. */
+    scale?: number;
+    /** Rotate (degrees) around group origin. */
+    rotation?: number;
+    /** Group opacity (multiplies with child opacity). */
+    opacity?: number;
+    /** Child overlays rendered inside this group. Coordinates are group-local. */
+    children: VizOverlaySpec[];
+};
+declare module './types' {
+    interface OverlayKindRegistry {
+        signal: SignalOverlayParams;
+        'grid-labels': GridLabelsOverlayParams;
+        'data-points': DataPointsOverlayParams;
+        /** Generic overlay primitives (no custom registry needed). */
+        rect: RectOverlayParams;
+        circle: CircleOverlayParams;
+        text: TextOverlayParams;
+        /** Overlay container that can hold child overlays and be animated as a unit. */
+        group: GroupOverlayParams;
+    }
+}
 export interface CoreOverlayRenderContext<T = any> {
     spec: VizOverlaySpec<T>;
     nodesById: Map<string, VizNode>;
     edgesById: Map<string, VizEdge>;
     scene: VizScene;
+    /** Registry reference (useful for composite overlays like `group`). */
+    registry?: CoreOverlayRegistry;
 }
 export interface CoreOverlayRenderer<T = any> {
     render: (ctx: CoreOverlayRenderContext<T>) => string;
@@ -14,25 +120,11 @@ export declare class CoreOverlayRegistry {
     register(id: string, renderer: CoreOverlayRenderer): this;
     get(id: string): CoreOverlayRenderer<any> | undefined;
 }
-export declare const coreSignalOverlay: CoreOverlayRenderer<{
-    from: string;
-    to: string;
-    progress: number;
-    magnitude?: number;
-}>;
-export declare const coreGridLabelsOverlay: CoreOverlayRenderer<{
-    colLabels?: Record<number, string>;
-    rowLabels?: Record<number, string>;
-    yOffset?: number;
-    xOffset?: number;
-}>;
-interface DataPoint {
-    id: string;
-    currentNodeId: string;
-    [key: string]: any;
-}
-export declare const coreDataPointOverlay: CoreOverlayRenderer<{
-    points: DataPoint[];
-}>;
+export declare const coreSignalOverlay: CoreOverlayRenderer<SignalOverlayParams>;
+export declare const coreGridLabelsOverlay: CoreOverlayRenderer<GridLabelsOverlayParams>;
+export declare const coreDataPointOverlay: CoreOverlayRenderer<DataPointsOverlayParams>;
+export declare const coreRectOverlay: CoreOverlayRenderer<RectOverlayParams>;
+export declare const coreCircleOverlay: CoreOverlayRenderer<CircleOverlayParams>;
+export declare const coreTextOverlay: CoreOverlayRenderer<TextOverlayParams>;
+export declare const coreGroupOverlay: CoreOverlayRenderer<GroupOverlayParams>;
 export declare const defaultCoreOverlayRegistry: CoreOverlayRegistry;
-export {};