project-graph-mcp 2.3.1 → 2.4.0

package/vendor/symbiote-node/plugins/History.js

@@ -1,384 +0,0 @@
-/**
- * History — undo/redo action stack for NodeEditor
- *
- * Records editor actions (addNode, removeNode, move, connect, disconnect)
- * and provides undo()/redo() with Ctrl+Z / Ctrl+Shift+Z keyboard bindings.
- * Plugin pattern: attach to editor via history.listen(editor).
- *
- * @module symbiote-node/plugins/History
- */
-
-/**
- * @typedef {object} HistoryAction
- * @property {'addNode'|'removeNode'|'moveNode'|'addConnection'|'removeConnection'|'addFrame'|'removeFrame'} type
- * @property {object} data - Serialized action data for undo/redo
- */
-
-const MAX_STACK = 200;
-
-export class History {
-
-  /** @type {HistoryAction[]} */
-  #undoStack = [];
-
-  /** @type {HistoryAction[]} */
-  #redoStack = [];
-
-  /** @type {import('../core/Editor.js').NodeEditor|null} */
-  #editor = null;
-
-  /** @type {function|null} */
-  #getCanvas = null;
-
-  /** @type {boolean} - prevent recording actions triggered by undo/redo itself */
-  #isApplying = false;
-
-  /** @type {function[]} - unsubscribe functions */
-  #unsubs = [];
-
-  /** @type {object} - injected class constructors */
-  #classes = {};
-
-  /**
-   * Attach history tracking to an editor
-   * @param {import('../core/Editor.js').NodeEditor} editor
-   * @param {object} [options]
-   * @param {function} [options.getCanvas] - returns canvas element for position tracking
-   * @param {object} [options.classes] - class constructors: { Node, Connection, Frame, Socket, Input, Output, InputControl }
-   */
-  listen(editor, options = {}) {
-    this.#editor = editor;
-    this.#getCanvas = options.getCanvas || null;
-    this.#classes = options.classes || {};
-
-    // Track node additions
-    this.#unsubs.push(editor.on('nodecreated', (node) => {
-      if (this.#isApplying) return;
-      const canvas = this.#getCanvas?.();
-      const pos = canvas ? this.#getNodePosition(canvas, node.id) : [0, 0];
-      this.#push({
-        type: 'addNode',
-        data: { node: this.#serializeNode(node), position: pos },
-      });
-    }));
-
-    // Track node removals
-    this.#unsubs.push(editor.on('noderemove', (node) => {
-      if (this.#isApplying) return;
-      const canvas = this.#getCanvas?.();
-      const pos = canvas ? this.#getNodePosition(canvas, node.id) : [0, 0];
-      // Capture connections that will be removed with this node
-      const conns = editor.getNodeConnections(node.id).map(c => this.#serializeConnection(c));
-      this.#push({
-        type: 'removeNode',
-        data: { node: this.#serializeNode(node), position: pos, connections: conns },
-      });
-    }));
-
-    // Track node moves
-    this.#unsubs.push(editor.on('nodepicked', (node) => {
-      if (this.#isApplying) return;
-      const canvas = this.#getCanvas?.();
-      if (!canvas) return;
-      const pos = this.#getNodePosition(canvas, node.id);
-      node._historyStartPos = pos;
-    }));
-
-    this.#unsubs.push(editor.on('nodedragged', ({ id }) => {
-      if (this.#isApplying) return;
-      const node = editor.getNode(id);
-      if (!node?._historyStartPos) return;
-      const canvas = this.#getCanvas?.();
-      const endPos = canvas ? this.#getNodePosition(canvas, id) : [0, 0];
-      const startPos = node._historyStartPos;
-      // Only record if position actually changed
-      if (startPos[0] !== endPos[0] || startPos[1] !== endPos[1]) {
-        this.#push({
-          type: 'moveNode',
-          data: { nodeId: id, from: startPos, to: endPos },
-        });
-      }
-      delete node._historyStartPos;
-    }));
-
-    // Track connections
-    this.#unsubs.push(editor.on('connectioncreated', (conn) => {
-      if (this.#isApplying) return;
-      this.#push({
-        type: 'addConnection',
-        data: { connection: this.#serializeConnection(conn) },
-      });
-    }));
-
-    this.#unsubs.push(editor.on('connectionremove', (conn) => {
-      if (this.#isApplying) return;
-      this.#push({
-        type: 'removeConnection',
-        data: { connection: this.#serializeConnection(conn) },
-      });
-    }));
-
-    // Track frames
-    this.#unsubs.push(editor.on('framecreated', (frame) => {
-      if (this.#isApplying) return;
-      this.#push({
-        type: 'addFrame',
-        data: { frame: { ...frame } },
-      });
-    }));
-
-    this.#unsubs.push(editor.on('frameremove', (frame) => {
-      if (this.#isApplying) return;
-      this.#push({
-        type: 'removeFrame',
-        data: { frame: { ...frame } },
-      });
-    }));
-  }
-
-  /**
-   * Bind Ctrl+Z / Ctrl+Shift+Z keyboard shortcuts
-   * @param {HTMLElement} target - element to listen for keydown
-   */
-  bindKeyboard(target) {
-    const handler = (e) => {
-      if ((e.ctrlKey || e.metaKey) && e.key === 'z') {
-        e.preventDefault();
-        if (e.shiftKey) this.redo();
-        else this.undo();
-      }
-      if ((e.ctrlKey || e.metaKey) && e.key === 'y') {
-        e.preventDefault();
-        this.redo();
-      }
-    };
-    target.addEventListener('keydown', handler);
-    this.#unsubs.push(() => target.removeEventListener('keydown', handler));
-  }
-
-  /** Undo last action */
-  undo() {
-    const action = this.#undoStack.pop();
-    if (!action) return;
-    this.#isApplying = true;
-    try {
-      this.#applyReverse(action);
-      this.#redoStack.push(action);
-    } finally {
-      this.#isApplying = false;
-    }
-  }
-
-  /** Redo last undone action */
-  redo() {
-    const action = this.#redoStack.pop();
-    if (!action) return;
-    this.#isApplying = true;
-    try {
-      this.#applyForward(action);
-      this.#undoStack.push(action);
-    } finally {
-      this.#isApplying = false;
-    }
-  }
-
-  /** @returns {number} */
-  get undoCount() { return this.#undoStack.length; }
-
-  /** @returns {number} */
-  get redoCount() { return this.#redoStack.length; }
-
-  /** Clear all history */
-  clear() {
-    this.#undoStack = [];
-    this.#redoStack = [];
-  }
-
-  /** Destroy and unsubscribe */
-  destroy() {
-    for (const unsub of this.#unsubs) {
-      if (typeof unsub === 'function') unsub();
-    }
-    this.#unsubs = [];
-    this.clear();
-    this.#editor = null;
-  }
-
-  // --- Private ---
-
-  #push(action) {
-    this.#undoStack.push(action);
-    if (this.#undoStack.length > MAX_STACK) this.#undoStack.shift();
-    this.#redoStack = []; // new action invalidates redo
-  }
-
-  #applyReverse(action) {
-    const editor = this.#editor;
-    const canvas = this.#getCanvas?.();
-    if (!editor) return;
-
-    switch (action.type) {
-      case 'addNode':
-        editor.removeNode(action.data.node.id);
-        break;
-
-      case 'removeNode': {
-        const { node: nodeData, position, connections } = action.data;
-        const restoredNode = this.#deserializeNode(nodeData);
-        editor.addNode(restoredNode);
-        if (canvas && position) {
-          canvas.setNodePosition(restoredNode.id, position[0], position[1]);
-        }
-        // Restore connections
-        for (const connData of connections) {
-          const { Connection } = this.#classes;
-          const conn = new Connection(connData.from, connData.out, connData.to, connData.in);
-          conn.id = connData.id;
-          try { editor.addConnection(conn); } catch { /* node may not exist */ }
-        }
-        break;
-      }
-
-      case 'moveNode':
-        if (canvas) {
-          canvas.setNodePosition(action.data.nodeId, action.data.from[0], action.data.from[1]);
-        }
-        break;
-
-      case 'addConnection':
-        editor.removeConnection(action.data.connection.id);
-        break;
-
-      case 'removeConnection': {
-        const connData = action.data.connection;
-        const { Connection } = this.#classes;
-        const conn = new Connection(connData.from, connData.out, connData.to, connData.in);
-        conn.id = connData.id;
-        try { editor.addConnection(conn); } catch { /* already exists */ }
-        break;
-      }
-
-      case 'addFrame':
-        editor.removeFrame(action.data.frame.id);
-        break;
-
-      case 'removeFrame': {
-        const { Frame } = this.#classes;
-        const frame = new Frame(action.data.frame.label, action.data.frame);
-        frame.id = action.data.frame.id;
-        editor.addFrame(frame);
-        break;
-      }
-    }
-  }
-
-  #applyForward(action) {
-    const editor = this.#editor;
-    const canvas = this.#getCanvas?.();
-    if (!editor) return;
-
-    switch (action.type) {
-      case 'addNode': {
-        const restoredNode = this.#deserializeNode(action.data.node);
-        editor.addNode(restoredNode);
-        if (canvas && action.data.position) {
-          canvas.setNodePosition(restoredNode.id, action.data.position[0], action.data.position[1]);
-        }
-        break;
-      }
-
-      case 'removeNode':
-        editor.removeNode(action.data.node.id);
-        break;
-
-      case 'moveNode':
-        if (canvas) {
-          canvas.setNodePosition(action.data.nodeId, action.data.to[0], action.data.to[1]);
-        }
-        break;
-
-      case 'addConnection': {
-        const connData = action.data.connection;
-        const { Connection } = this.#classes;
-        const conn = new Connection(connData.from, connData.out, connData.to, connData.in);
-        conn.id = connData.id;
-        try { editor.addConnection(conn); } catch { /* already exists */ }
-        break;
-      }
-
-      case 'removeConnection':
-        editor.removeConnection(action.data.connection.id);
-        break;
-
-      case 'addFrame': {
-        const { Frame } = this.#classes;
-        const frame = new Frame(action.data.frame.label, action.data.frame);
-        frame.id = action.data.frame.id;
-        editor.addFrame(frame);
-        break;
-      }
-
-      case 'removeFrame':
-        editor.removeFrame(action.data.frame.id);
-        break;
-    }
-  }
-
-  #serializeNode(node) {
-    return {
-      id: node.id,
-      label: node.label,
-      type: node.type,
-      category: node.category,
-      shape: node.shape,
-      params: { ...node.params },
-      inputs: Object.fromEntries(Object.entries(node.inputs).map(([k, v]) => [k, {
-        socket: v.socket ? { type: v.socket.type, color: v.socket.color } : null,
-        label: v.label,
-      }])),
-      outputs: Object.fromEntries(Object.entries(node.outputs).map(([k, v]) => [k, {
-        socket: v.socket ? { type: v.socket.type, color: v.socket.color } : null,
-        label: v.label,
-      }])),
-      controls: Object.fromEntries(Object.entries(node.controls).map(([k, v]) => [k, {
-        label: v.label,
-        value: v.value,
-        type: v.type,
-      }])),
-    };
-  }
-
-  #serializeConnection(conn) {
-    return { id: conn.id, from: conn.from, out: conn.out, to: conn.to, in: conn.in };
-  }
-
-  #deserializeNode(data) {
-    const { Node, Socket, Input, Output, InputControl } = this.#classes;
-    const node = new Node(data.label, {
-      type: data.type,
-      category: data.category,
-      shape: data.shape,
-    });
-    node.id = data.id;
-    node.params = { ...data.params };
-
-    for (const [key, inp] of Object.entries(data.inputs)) {
-      const socket = inp.socket ? new Socket(inp.socket.type, { color: inp.socket.color }) : new Socket('any');
-      node.addInput(key, new Input(socket, inp.label));
-    }
-    for (const [key, out] of Object.entries(data.outputs)) {
-      const socket = out.socket ? new Socket(out.socket.type, { color: out.socket.color }) : new Socket('any');
-      node.addOutput(key, new Output(socket, out.label));
-    }
-    for (const [key, ctrl] of Object.entries(data.controls)) {
-      node.addControl(key, new InputControl(ctrl.type || 'text', { label: ctrl.label, initial: ctrl.value }));
-    }
-
-    return node;
-  }
-
-  #getNodePosition(canvas, nodeId) {
-    const positions = canvas.getPositions();
-    return positions[nodeId] || [0, 0];
-  }
-}

package/vendor/symbiote-node/plugins/Readonly.js

@@ -1,59 +0,0 @@
-/**
- * Readonly — toggle readonly mode for node editor
- *
- * When enabled, blocks node creation, deletion, connection
- * creation/removal, and node dragging.
- *
- * Adapted from Rete.js readonly plugin (63 LOC).
- * @module symbiote-node/plugins/Readonly
- */
-
-export class Readonly {
-
-  /** @type {boolean} */
-  #enabled = false;
-
-  /** @type {import('../core/Editor.js').NodeEditor|null} */
-  #editor = null;
-
-  /**
-   * @param {import('../core/Editor.js').NodeEditor} editor
-   */
-  constructor(editor) {
-    this.#editor = editor;
-  }
-
-  /** Enable readonly mode */
-  enable() {
-    this.#enabled = true;
-    this.#editor.emit('readonlychanged', true);
-  }
-
-  /** Disable readonly mode */
-  disable() {
-    this.#enabled = false;
-    this.#editor.emit('readonlychanged', false);
-  }
-
-  /** Toggle readonly mode */
-  toggle() {
-    this.#enabled ? this.disable() : this.enable();
-  }
-
-  /**
-   * Whether readonly is currently enabled
-   * @returns {boolean}
-   */
-  get isEnabled() {
-    return this.#enabled;
-  }
-
-  /**
-   * Guard check — throws if readonly
-   * Use before mutation operations
-   * @returns {boolean} true if operation should be blocked
-   */
-  shouldBlock() {
-    return this.#enabled;
-  }
-}

package/vendor/symbiote-node/shapes/CircleShape.js

@@ -1,80 +0,0 @@
-/**
- * CircleShape — circular hub node
- *
- * Sockets distributed around the perimeter of a circle.
- * Inputs on left semicircle, outputs on right semicircle.
- *
- * @module symbiote-node/shapes/CircleShape
- */
-
-import { NodeShape } from './NodeShape.js';
-
-export class CircleShape extends NodeShape {
-  name = 'circle';
-
-  getSocketPosition(side, index, total, { width, height }) {
-    const r = Math.min(width, height) / 2;
-    const cx = width / 2;
-    const cy = height / 2;
-
-    // Inputs: left semicircle (90° to 270°), top to bottom
-    // Outputs: right semicircle (-90° to 90°), top to bottom
-    const arcSpan = Math.PI * 0.8; // 144 degrees
-    const centerAngle = side === 'input' ? Math.PI : 0;
-    const startAngle = centerAngle - arcSpan / 2;
-    const step = total > 1 ? arcSpan / (total - 1) : 0;
-    const angle = startAngle + step * index;
-
-    return {
-      x: cx + r * Math.cos(angle),
-      y: cy + r * Math.sin(angle),
-      angle: (angle * 180) / Math.PI,
-    };
-  }
-
-  /**
-   * Get pin position on a specific side of the circle.
-   * Pins follow an arc in the corresponding quadrant.
-   *
-   * @param {'top'|'right'|'bottom'|'left'} side
-   * @param {number} t - position along the side (0..1)
-   * @param {{ width: number, height: number }} size
-   * @returns {{ x: number, y: number, angle: number }}
-   */
-  getSidePosition(side, t, size) {
-    const r = Math.min(size.width, size.height) / 2;
-    const cx = size.width / 2;
-    const cy = size.height / 2;
-
-    // Each side spans a 90° arc centered on the cardinal direction
-    const CENTERS = { right: 0, bottom: Math.PI / 2, left: Math.PI, top: -Math.PI / 2 };
-    const ARC = Math.PI * 0.8; // 144° arc to avoid exact corners
-    const MARGIN = 0.2;
-    const effectiveT = MARGIN + t * (1 - 2 * MARGIN);
-
-    const center = CENTERS[side];
-    const a = center - ARC / 2 + ARC * effectiveT;
-
-    return {
-      x: cx + r * Math.cos(a),
-      y: cy + r * Math.sin(a),
-      angle: (a * 180) / Math.PI,
-    };
-  }
-
-  getBorderRadius() {
-    return '50%';
-  }
-
-  get hasHeader() {
-    return false;
-  }
-
-  get hasControls() {
-    return false;
-  }
-
-  getMinSize() {
-    return { minWidth: 80, minHeight: 80 };
-  }
-}

package/vendor/symbiote-node/shapes/CommentShape.js

@@ -1,35 +0,0 @@
-/**
- * CommentShape — wide annotation banner node
- *
- * No sockets, no header, no controls.
- * Just text content with semi-transparent background.
- * Used for annotations and documentation on the canvas.
- *
- * @module symbiote-node/shapes/CommentShape
- */
-
-import { NodeShape } from './NodeShape.js';
-
-export class CommentShape extends NodeShape {
-  name = 'comment';
-
-  getSocketPosition() {
-    return { x: 0, y: 0, angle: 0 };
-  }
-
-  getBorderRadius() {
-    return 'var(--sn-comment-radius, 6px)';
-  }
-
-  get hasHeader() {
-    return false;
-  }
-
-  get hasControls() {
-    return false;
-  }
-
-  getMinSize() {
-    return { minWidth: 200, minHeight: 40 };
-  }
-}

package/vendor/symbiote-node/shapes/DiamondShape.js

@@ -1,115 +0,0 @@
-/**
- * DiamondShape — condition/decision rhombus node
- *
- * Input at top vertex, outputs distributed along bottom edges.
- * Classic if/else, switch/case pattern.
- *
- * @module symbiote-node/shapes/DiamondShape
- */
-
-import { NodeShape } from './NodeShape.js';
-
-export class DiamondShape extends NodeShape {
-  name = 'diamond';
-
-  getSocketPosition(side, index, total, { width, height }) {
-    const cx = width / 2;
-    const cy = height / 2;
-
-    if (side === 'input') {
-      // Inputs distributed along top edges
-      if (total === 1) {
-        return { x: cx, y: 0, angle: 270 };
-      }
-      // Multiple inputs: spread along top-left and top-right edges
-      const t = (index + 1) / (total + 1);
-      return {
-        x: cx * (1 - t),
-        y: cy * t,
-        angle: 225 + 90 * (index / (total - 1)),
-      };
-    }
-
-    // Outputs along bottom edges
-    if (total === 1) {
-      return { x: cx, y: height, angle: 90 };
-    }
-    if (total === 2) {
-      // True: bottom-left, False: bottom-right
-      return index === 0
-        ? { x: cx * 0.35, y: cy + cy * 0.65, angle: 225 }
-        : { x: width - cx * 0.35, y: cy + cy * 0.65, angle: 315 };
-    }
-    // 3+ outputs: spread along bottom edges
-    const t = (index + 1) / (total + 1);
-    return {
-      x: t < 0.5 ? cx * (1 - 2 * t) : cx + cx * (2 * t - 1),
-      y: t < 0.5 ? cy + cy * 2 * t : cy + cy * (2 - 2 * t),
-      angle: 135 + 90 * (index / (total - 1)),
-    };
-  }
-
-  /**
-   * Get pin position on a specific side of the diamond.
-   * Each side maps to two diagonal edges meeting at that cardinal vertex.
-   *
-   * @param {'top'|'right'|'bottom'|'left'} side
-   * @param {number} t - position along the side (0..1)
-   * @param {{ width: number, height: number }} size
-   * @returns {{ x: number, y: number, angle: number }}
-   */
-  getSidePosition(side, t, size) {
-    const cx = size.width / 2;
-    const cy = size.height / 2;
-    const NORMALS = { top: -90, right: 0, bottom: 90, left: 180 };
-    const MARGIN = 0.2;
-    const effectiveT = MARGIN + t * (1 - 2 * MARGIN);
-
-    // Diamond vertices: top(cx,0), right(w,cy), bottom(cx,h), left(0,cy)
-    // Each "side" spans two edges meeting at the cardinal vertex
-    const vertices = {
-      top:    [{ x: 0, y: cy }, { x: cx, y: 0 }, { x: size.width, y: cy }],
-      right:  [{ x: cx, y: 0 }, { x: size.width, y: cy }, { x: cx, y: size.height }],
-      bottom: [{ x: 0, y: cy }, { x: cx, y: size.height }, { x: size.width, y: cy }],
-      left:   [{ x: cx, y: 0 }, { x: 0, y: cy }, { x: cx, y: size.height }],
-    };
-
-    const [p0, p1, p2] = vertices[side];
-
-    // effectiveT spans from p0 → p1 → p2 (two edges)
-    let x, y;
-    if (effectiveT <= 0.5) {
-      const segT = effectiveT * 2;
-      x = p0.x + (p1.x - p0.x) * segT;
-      y = p0.y + (p1.y - p0.y) * segT;
-    } else {
-      const segT = (effectiveT - 0.5) * 2;
-      x = p1.x + (p2.x - p1.x) * segT;
-      y = p1.y + (p2.y - p1.y) * segT;
-    }
-
-    return { x, y, angle: NORMALS[side] };
-  }
-
-  getBorderRadius() {
-    return '0';
-  }
-
-  getClipPath({ width, height }) {
-    const cx = width / 2;
-    const cy = height / 2;
-    return `polygon(${cx}px 0, ${width}px ${cy}px, ${cx}px ${height}px, 0 ${cy}px)`;
-  }
-
-  get hasHeader() {
-    return false;
-  }
-
-  get hasControls() {
-    return false;
-  }
-
-  getMinSize() {
-    return { minWidth: 100, minHeight: 100 };
-  }
-}