#6097 Added scaffolding for the new function in all shapes

packages/mermaid/src/rendering-util/rendering-elements/shapes/anchor.ts

@@ -6,6 +6,7 @@ import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import { handleUndefinedAttr } from '../../../utils.js';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export function anchor<T extends SVGGraphicsElement>(parent: D3Selection<T>, node: Node) {
   const { labelStyles } = styles2String(node);
@@ -37,6 +38,11 @@ export function anchor<T extends SVGGraphicsElement>(parent: D3Selection<T>, nod
 
   updateNodeBounds(node, circleElem);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     log.info('Circle intersect', node, radius, point);
     return intersect.circle(node, radius, point);

packages/mermaid/src/rendering-util/rendering-elements/shapes/bowTieRect.ts

@@ -4,6 +4,7 @@ import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 function generateArcPoints(
   x1: number,
@@ -118,6 +119,11 @@ export async function bowTieRect<T extends SVGGraphicsElement>(parent: D3Selecti
 
   updateNodeBounds(node, bowTieRectShape);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
   node.intersect = function (point) {
     const pos = intersect.polygon(node, points, point);
     return pos;

packages/mermaid/src/rendering-util/rendering-elements/shapes/card.ts

@@ -3,16 +3,10 @@ import intersect from '../intersect/index.js';
 import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
-
 import { insertPolygonShape } from './insertPolygonShape.js';
 import { createPathFromPoints } from './util.js';
 import type { D3Selection } from '../../../types.js';
-
-// const createPathFromPoints = (points: { x: number; y: number }[]): string => {
-//   const pointStrings = points.map((p, i) => `${i === 0 ? 'M' : 'L'}${p.x},${p.y}`);
-//   pointStrings.push('Z');
-//   return pointStrings.join(' ');
-// };
+import type { Bounds, Point } from '../../../types.js';
 
 export async function card<T extends SVGGraphicsElement>(parent: D3Selection<T>, node: Node) {
   const { labelStyles, nodeStyles } = styles2String(node);
@@ -62,6 +56,12 @@ export async function card<T extends SVGGraphicsElement>(parent: D3Selection<T>,
 
   updateNodeBounds(node, polygon);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     return intersect.polygon(node, points, point);
   };

packages/mermaid/src/rendering-util/rendering-elements/shapes/choice.ts

@@ -4,6 +4,7 @@ import rough from 'roughjs';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import { createPathFromPoints, getNodeClasses } from './util.js';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export function choice<T extends SVGGraphicsElement>(parent: D3Selection<T>, node: Node) {
   const { nodeStyles } = styles2String(node);
@@ -47,6 +48,12 @@ export function choice<T extends SVGGraphicsElement>(parent: D3Selection<T>, nod
   node.width = 28;
   node.height = 28;
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     return intersect.polygon(node, points, point);
   };

packages/mermaid/src/rendering-util/rendering-elements/shapes/classBox.ts

@@ -9,6 +9,7 @@ import intersect from '../intersect/index.js';
 import { textHelper } from '../../../diagrams/class/shapeUtil.js';
 import { evaluate } from '../../../diagrams/common/common.js';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export async function classBox<T extends SVGGraphicsElement>(parent: D3Selection<T>, node: Node) {
   const config = getConfig();
@@ -199,6 +200,11 @@ export async function classBox<T extends SVGGraphicsElement>(parent: D3Selection
   }
 
   updateNodeBounds(node, rect);
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
   node.intersect = function (point) {
     return intersect.rect(node, point);
   };

packages/mermaid/src/rendering-util/rendering-elements/shapes/crossedCircle.ts

@@ -5,6 +5,7 @@ import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import intersect from '../intersect/index.js';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 function createLine(r: number) {
   const xAxis45 = Math.cos(Math.PI / 4); // cosine of 45 degrees
@@ -57,6 +58,12 @@ export function crossedCircle<T extends SVGGraphicsElement>(parent: D3Selection<
 
   updateNodeBounds(node, crossedCircle);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     log.info('crossedCircle intersect', node, { radius, point });
     const pos = intersect.circle(node, radius, point);

packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceLeft.ts

@@ -4,6 +4,7 @@ import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 function generateCirclePoints(
   centerX: number,
@@ -105,6 +106,12 @@ export async function curlyBraceLeft<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, curlyBraceLeftShape);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     const pos = intersect.polygon(node, rectPoints, point);
 

packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceRight.ts

@@ -4,6 +4,7 @@ import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 function generateCirclePoints(
   centerX: number,
@@ -105,6 +106,12 @@ export async function curlyBraceRight<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, curlyBraceRightShape);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     const pos = intersect.polygon(node, rectPoints, point);
 

packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraces.ts

@@ -4,6 +4,7 @@ import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 function generateCirclePoints(
   centerX: number,
@@ -124,6 +125,12 @@ export async function curlyBraces<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, curlyBracesShape);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     const pos = intersect.polygon(node, rectPoints, point);
 

packages/mermaid/src/rendering-util/rendering-elements/shapes/curvedTrapezoid.ts

@@ -10,6 +10,7 @@ import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export async function curvedTrapezoid<T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
@@ -66,6 +67,12 @@ export async function curvedTrapezoid<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, polygon);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     const pos = intersect.polygon(node, points, point);
     return pos;

packages/mermaid/src/rendering-util/rendering-elements/shapes/cylinder.ts

@@ -5,6 +5,7 @@ import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
 import { handleUndefinedAttr } from '../../../utils.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export const createCylinderPathD = (
   x: number,
@@ -96,6 +97,12 @@ export async function cylinder<T extends SVGGraphicsElement>(parent: D3Selection
     `translate(${-(bbox.width / 2) - (bbox.x - (bbox.left ?? 0))}, ${-(bbox.height / 2) + (node.padding ?? 0) / 1.5 - (bbox.y - (bbox.top ?? 0))})`
   );
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     const pos = intersect.rect(node, point);
     const x = pos.x - (node.x ?? 0);

packages/mermaid/src/rendering-util/rendering-elements/shapes/dividedRect.ts

@@ -4,6 +4,7 @@ import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export async function dividedRectangle<T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
@@ -62,6 +63,12 @@ export async function dividedRectangle<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, polygon);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     const pos = intersect.rect(node, point);
     return pos;

packages/mermaid/src/rendering-util/rendering-elements/shapes/document.ts

@@ -5,6 +5,7 @@ import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
 import { handleUndefinedAttr } from '../../../utils.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export const createCylinderPathD = (
   x: number,
@@ -91,6 +92,12 @@ export async function cylinder<T extends SVGGraphicsElement>(parent: D3Selection
 
   updateNodeBounds(node, cylinder);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     const pos = intersect.rect(node, point);
     const x = pos.x - (node.x ?? 0);

packages/mermaid/src/rendering-util/rendering-elements/shapes/doubleCircle.ts

@@ -6,6 +6,7 @@ import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
 import { handleUndefinedAttr } from '../../../utils.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export async function doublecircle<T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
@@ -62,6 +63,12 @@ export async function doublecircle<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, circleGroup);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     log.info('DoubleCircle intersect', node, outerRadius, point);
     return intersect.circle(node, outerRadius, point);

packages/mermaid/src/rendering-util/rendering-elements/shapes/filledCircle.ts

@@ -5,6 +5,7 @@ import intersect from '../intersect/index.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import { getNodeClasses, updateNodeBounds } from './util.js';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export function filledCircle<T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
@@ -46,6 +47,12 @@ export function filledCircle<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, filledCircle);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     log.info('filledCircle intersect', node, { radius, point });
     const pos = intersect.circle(node, radius, point);

packages/mermaid/src/rendering-util/rendering-elements/shapes/flippedTriangle.ts

@@ -6,6 +6,7 @@ import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import { createPathFromPoints } from './util.js';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export async function flippedTriangle<T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
@@ -59,6 +60,12 @@ export async function flippedTriangle<T extends SVGGraphicsElement>(
     `translate(${-bbox.width / 2 - (bbox.x - (bbox.left ?? 0))}, ${-h / 2 + (node.padding ?? 0) / 2 + (bbox.y - (bbox.top ?? 0))})`
   );
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     log.info('Triangle intersect', node, points, point);
     return intersect.polygon(node, points, point);

packages/mermaid/src/rendering-util/rendering-elements/shapes/forkJoin.ts

@@ -4,6 +4,7 @@ import intersect from '../intersect/index.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import { getNodeClasses, updateNodeBounds } from './util.js';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export function forkJoin<T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
@@ -59,6 +60,12 @@ export function forkJoin<T extends SVGGraphicsElement>(
     node.width += padding / 2 || 0;
     node.height += padding / 2 || 0;
   }
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     return intersect.rect(node, point);
   };

packages/mermaid/src/rendering-util/rendering-elements/shapes/halfRoundedRectangle.ts

@@ -11,6 +11,7 @@ import type { Node } from '../../types.js';
 import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
 import rough from 'roughjs';
 import type { D3Selection } from '../../../types.js';
+import type { Bounds, Point } from '../../../types.js';
 
 export async function halfRoundedRectangle<T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
@@ -63,6 +64,12 @@ export async function halfRoundedRectangle<T extends SVGGraphicsElement>(
 
   updateNodeBounds(node, polygon);
 
+  node.calcIntersect = function (bounds: Bounds, point: Point) {
+    // TODO: Implement intersect for this shape
+    const radius = bounds.width / 2;
+    return intersect.circle(bounds, radius, point);
+  };
+
   node.intersect = function (point) {
     log.info('Pill intersect', node, { radius, point });
     const pos = intersect.polygon(node, points, point);