chore: resolve eslint warnings in packages/parser/src/language/common/valueConverter.ts

cypress/helpers/util.ts

@@ -22,7 +22,7 @@ const batchId: string =
   'mermaid-batch-' +
   (Cypress.env('useAppli')
     ? Date.now().toString()
-    : Cypress.env('CYPRESS_COMMIT') || Date.now().toString());
+    : (Cypress.env('CYPRESS_COMMIT') ?? Date.now().toString()));
 
 export const mermaidUrl = (
   graphStr: string | string[],
@@ -61,9 +61,7 @@ export const imgSnapshotTest = (
     sequence: {
       ...(_options.sequence ?? {}),
       actorFontFamily: 'courier',
-      noteFontFamily: _options.sequence?.noteFontFamily
+      noteFontFamily: _options.sequence?.noteFontFamily ?? 'courier',
-        ? _options.sequence.noteFontFamily
-        : 'courier',
       messageFontFamily: 'courier',
     },
   };

cypress/integration/rendering/iconShape.spec.ts

@@ -14,7 +14,7 @@ looks.forEach((look) => {
   directions.forEach((direction) => {
     forms.forEach((form) => {
       labelPos.forEach((pos) => {
-        describe(`Test iconShape in ${form ? `${form} form,` : ''} ${look} look and dir ${direction} with label position ${pos ? pos : 'not defined'}`, () => {
+        describe(`Test iconShape in ${form ? `${form} form,` : ''} ${look} look and dir ${direction} with label position ${pos ?? 'not defined'}`, () => {
           it(`without label`, () => {
             let flowchartCode = `flowchart ${direction}\n`;
             flowchartCode += `  nA --> nAA@{ icon: 'fa:bell'`;

cypress/integration/rendering/imageShape.spec.ts

@@ -12,7 +12,7 @@ const labelPos = [undefined, 't', 'b'] as const;
 looks.forEach((look) => {
   directions.forEach((direction) => {
     labelPos.forEach((pos) => {
-      describe(`Test imageShape in ${look} look and dir ${direction} with label position ${pos ? pos : 'not defined'}`, () => {
+      describe(`Test imageShape in ${look} look and dir ${direction} with label position ${pos ?? 'not defined'}`, () => {
         it(`without label`, () => {
           let flowchartCode = `flowchart ${direction}\n`;
           flowchartCode += `  nA --> A@{ img: 'https://cdn.pixabay.com/photo/2020/02/22/18/49/paper-4871356_1280.jpg', w: '100', h: '100' }\n`;

cypress/integration/rendering/journey.spec.js

@@ -214,7 +214,7 @@ section Checkout from website
           $lines.each((index, el) => {
             const bbox = el.getBBox();
             expect(bbox.width).to.be.lte(320);
-            maxLineWidth = Math.max(maxLineWidth || 0, bbox.width);
+            maxLineWidth = Math.max(maxLineWidth ?? 0, bbox.width);
           });
 
           /** The expected margin between the diagram and the legend is 150px, as defined by

packages/mermaid-layout-elk/src/render.ts

@@ -190,9 +190,7 @@ export const render = async (
       const children = nodeArr.filter((node: { parentId: any }) => node.parentId === subgraph.id);
       children.forEach((node: any) => {
         parentLookupDb.parentById[node.id] = subgraph.id;
-        if (parentLookupDb.childrenById[subgraph.id] === undefined) {
+        parentLookupDb.childrenById[subgraph.id] ??= [];
-          parentLookupDb.childrenById[subgraph.id] = [];
-        }
         parentLookupDb.childrenById[subgraph.id].push(node);
       });
     });
@@ -381,10 +379,10 @@ export const render = async (
         }
 
         edgeData.labelType = edge.labelType;
-        edgeData.label = (edge?.text || '').replace(common.lineBreakRegex, '\n');
+        edgeData.label = (edge?.text ?? '').replace(common.lineBreakRegex, '\n');
 
         if (edge.style === undefined) {
-          edgeData.style = edgeData.style || 'stroke: #333; stroke-width: 1.5px;fill:none;';
+          edgeData.style = edgeData.style ?? 'stroke: #333; stroke-width: 1.5px;fill:none;';
         }
 
         edgeData.labelStyle = edgeData.labelStyle.replace('color:', 'fill:');
@@ -725,9 +723,7 @@ export const render = async (
             inter = inter2;
           }
         }
-        if (!inter) {
+        inter ??= intersection(bounds, lastPointOutside, point);
-          inter = intersection(bounds, lastPointOutside, point);
-        }
 
         // Check case where the intersection is the same as the last point
         let pointPresent = false;
@@ -840,8 +836,8 @@ export const render = async (
       node.labels = [
         {
           text: node.label,
-          width: node?.labelData?.width || 50,
+          width: node?.labelData?.width ?? 50,
-          height: node?.labelData?.height || 50,
+          height: node?.labelData?.height ?? 50,
         },
         (node.width = node.width + 2 * node.padding),
         log.debug('UIO node label', node?.labelData?.width, node.padding),
@@ -917,7 +913,7 @@ export const render = async (
       if (edge.sections) {
         const src = edge.sections[0].startPoint;
         const dest = edge.sections[0].endPoint;
-        const segments = edge.sections[0].bendPoints ? edge.sections[0].bendPoints : [];
+        const segments = edge.sections[0].bendPoints ?? [];
 
         const segPoints = segments.map((segment: { x: any; y: any }) => {
           return { x: segment.x + offset.x, y: segment.y + offset.y };

packages/mermaid/src/config.ts

@@ -30,7 +30,7 @@ export const updateCurrentConfig = (siteCfg: MermaidConfig, _directives: Mermaid
   if (sumOfDirectives.theme && sumOfDirectives.theme in theme) {
     const tmpConfigFromInitialize = assignWithDepth({}, configFromInitialize);
     const themeVariables = assignWithDepth(
-      tmpConfigFromInitialize.themeVariables || {},
+      tmpConfigFromInitialize.themeVariables ?? {},
       sumOfDirectives.themeVariables
     );
     if (cfg.theme && cfg.theme in theme) {

packages/mermaid/src/dagre-wrapper/clusters.js

@@ -238,7 +238,7 @@ let clusterElems = {};
 
 export const insertCluster = (elem, node) => {
   log.trace('Inserting cluster');
-  const shape = node.shape || 'rect';
+  const shape = node.shape ?? 'rect';
   clusterElems[node.id] = shapes[shape](elem, node);
 };
 export const getClusterTitleWidth = (elem, node) => {

packages/mermaid/src/dagre-wrapper/createLabel.js

@@ -45,7 +45,7 @@ function addHtmlLabel(node) {
  * @deprecated svg-util/createText instead
  */
 const createLabel = (_vertexText, style, isTitle, isNode) => {
-  let vertexText = _vertexText || '';
+  let vertexText = _vertexText ?? '';
   if (typeof vertexText === 'object') {
     vertexText = vertexText[0];
   }

packages/mermaid/src/dagre-wrapper/edges.js

@@ -69,9 +69,7 @@ export const insertEdgeLabel = (elem, edge) => {
     fo = inner.node().appendChild(startLabelElement);
     const slBox = startLabelElement.getBBox();
     inner.attr('transform', 'translate(' + -slBox.width / 2 + ', ' + -slBox.height / 2 + ')');
-    if (!terminalLabels[edge.id]) {
+    terminalLabels[edge.id] ??= {};
-      terminalLabels[edge.id] = {};
-    }
     terminalLabels[edge.id].startLeft = startEdgeLabelLeft;
     setTerminalWidth(fo, edge.startLabelLeft);
   }
@@ -85,9 +83,7 @@ export const insertEdgeLabel = (elem, edge) => {
     const slBox = startLabelElement.getBBox();
     inner.attr('transform', 'translate(' + -slBox.width / 2 + ', ' + -slBox.height / 2 + ')');
 
-    if (!terminalLabels[edge.id]) {
+    terminalLabels[edge.id] ??= {};
-      terminalLabels[edge.id] = {};
-    }
     terminalLabels[edge.id].startRight = startEdgeLabelRight;
     setTerminalWidth(fo, edge.startLabelRight);
   }
@@ -102,9 +98,7 @@ export const insertEdgeLabel = (elem, edge) => {
 
     endEdgeLabelLeft.node().appendChild(endLabelElement);
 
-    if (!terminalLabels[edge.id]) {
+    terminalLabels[edge.id] ??= {};
-      terminalLabels[edge.id] = {};
-    }
     terminalLabels[edge.id].endLeft = endEdgeLabelLeft;
     setTerminalWidth(fo, edge.endLabelLeft);
   }
@@ -119,9 +113,7 @@ export const insertEdgeLabel = (elem, edge) => {
     inner.attr('transform', 'translate(' + -slBox.width / 2 + ', ' + -slBox.height / 2 + ')');
 
     endEdgeLabelRight.node().appendChild(endLabelElement);
-    if (!terminalLabels[edge.id]) {
+    terminalLabels[edge.id] ??= {};
-      terminalLabels[edge.id] = {};
-    }
     terminalLabels[edge.id].endRight = endEdgeLabelRight;
     setTerminalWidth(fo, edge.endLabelRight);
   }
@@ -141,7 +133,7 @@ function setTerminalWidth(fo, value) {
 
 export const positionEdgeLabel = (edge, paths) => {
   log.debug('Moving label abc88 ', edge.id, edge.label, edgeLabels[edge.id], paths);
-  let path = paths.updatedPath ? paths.updatedPath : paths.originalPath;
+  let path = paths.updatedPath ?? paths.originalPath;
   const siteConfig = getConfig();
   const { subGraphTitleTotalMargin } = getSubGraphTitleMargins(siteConfig);
   if (edge.label) {

packages/mermaid/src/dagre-wrapper/mermaid-graphlib.js

@@ -4,7 +4,9 @@ import * as graphlibJson from 'dagre-d3-es/src/graphlib/json.js';
 import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 
 export let clusterDb = {};
+/** @type {Record<string, string[]>} */
 let descendants = {};
+/** @type {Record<string, string>} */
 let parents = {};
 
 export const clear = () => {

packages/mermaid/src/dagre-wrapper/nodes.js

@@ -15,9 +15,7 @@ const formatClass = (str) => {
   return '';
 };
 const getClassesFromNode = (node, otherClasses) => {
-  return `${otherClasses ? otherClasses : 'node default'}${formatClass(node.classes)} ${formatClass(
+  return `${otherClasses ?? 'node default'}${formatClass(node.classes)} ${formatClass(node.class)}`;
-    node.class
-  )}`;
 };
 
 const question = async (parent, node) => {
@@ -57,7 +55,7 @@ const choice = (parent, node) => {
   const shapeSvg = parent
     .insert('g')
     .attr('class', 'node default')
-    .attr('id', node.domId || node.id);
+    .attr('id', node.domId ?? node.id);
 
   const s = 28;
   const points = [
@@ -566,7 +564,7 @@ const rectWithTitle = (parent, node) => {
   const shapeSvg = parent
     .insert('g')
     .attr('class', classes)
-    .attr('id', node.domId || node.id);
+    .attr('id', node.domId ?? node.id);
 
   // Create the title label and insert it after the rect
   const rect = shapeSvg.insert('rect', ':first-child');
@@ -808,7 +806,7 @@ const start = (parent, node) => {
   const shapeSvg = parent
     .insert('g')
     .attr('class', 'node default')
-    .attr('id', node.domId || node.id);
+    .attr('id', node.domId ?? node.id);
   const circle = shapeSvg.insert('circle', ':first-child');
 
   // center the circle around its coordinate
@@ -827,7 +825,7 @@ const forkJoin = (parent, node, dir) => {
   const shapeSvg = parent
     .insert('g')
     .attr('class', 'node default')
-    .attr('id', node.domId || node.id);
+    .attr('id', node.domId ?? node.id);
 
   let width = 70;
   let height = 10;
@@ -859,7 +857,7 @@ const end = (parent, node) => {
   const shapeSvg = parent
     .insert('g')
     .attr('class', 'node default')
-    .attr('id', node.domId || node.id);
+    .attr('id', node.domId ?? node.id);
   const innerCircle = shapeSvg.insert('circle', ':first-child');
   const circle = shapeSvg.insert('circle', ':first-child');
 
@@ -891,7 +889,7 @@ const class_box = (parent, node) => {
   const shapeSvg = parent
     .insert('g')
     .attr('class', classes)
-    .attr('id', node.domId || node.id);
+    .attr('id', node.domId ?? node.id);
 
   // Create the title label and insert it after the rect
   const rect = shapeSvg.insert('rect', ':first-child');

packages/mermaid/src/diagrams/architecture/architectureRenderer.ts

@@ -88,7 +88,7 @@ function positionNodes(db: ArchitectureDB, cy: cytoscape.Core) {
     data.y = node.position().y;
 
     const nodeElem = db.getElementById(data.id);
-    nodeElem.attr('transform', 'translate(' + (data.x || 0) + ',' + (data.y || 0) + ')');
+    nodeElem.attr('transform', 'translate(' + (data.x ?? 0) + ',' + (data.y ?? 0) + ')');
   });
 }
 

packages/mermaid/src/diagrams/block/blockDB.ts

@@ -82,9 +82,7 @@ export const setCssClass = function (itemIds: string, cssClassName: string) {
       foundBlock = { id: trimmedId, type: 'na', children: [] } as Block;
       blockDatabase.set(trimmedId, foundBlock);
     }
-    if (!foundBlock.classes) {
+    foundBlock.classes ??= [];
-      foundBlock.classes = [];
-    }
     foundBlock.classes.push(cssClassName);
   });
 };

packages/mermaid/src/diagrams/block/renderHelpers.ts

@@ -10,7 +10,7 @@ function getNodeFromBlock(block: Block, db: BlockDB, positioned = false) {
   const vertex = block;
 
   let classStr = 'default';
-  if ((vertex?.classes?.length || 0) > 0) {
+  if ((vertex?.classes?.length ?? 0) > 0) {
     classStr = (vertex?.classes ?? []).join(' ');
   }
   classStr = classStr + ' flowchart-label';

packages/mermaid/src/diagrams/class/classDb.ts

@@ -41,7 +41,7 @@ export class ClassDB implements DiagramDB {
   private namespaces = new Map<string, NamespaceNode>();
   private namespaceCounter = 0;
 
-  private functions: any[] = [];
+  private functions: ((element: Element) => void)[] = [];
 
   constructor() {
     this.functions.push(this.setupToolTips.bind(this));
@@ -477,7 +477,7 @@ export class ClassDB implements DiagramDB {
     let tooltipElem: Selection<HTMLDivElement, unknown, HTMLElement, unknown> =
       select('.mermaidTooltip');
     // @ts-expect-error - Incorrect types
-    if ((tooltipElem._groups || tooltipElem)[0][0] === null) {
+    if ((tooltipElem._groups ?? tooltipElem)[0][0] === null) {
       tooltipElem = select('body')
         .append('div')
         .attr('class', 'mermaidTooltip')

packages/mermaid/src/diagrams/class/classDiagram-v2.ts

@@ -13,9 +13,7 @@ export const diagram: DiagramDefinition = {
   renderer,
   styles,
   init: (cnf) => {
-    if (!cnf.class) {
+    cnf.class ??= {};
-      cnf.class = {};
-    }
     cnf.class.arrowMarkerAbsolute = cnf.arrowMarkerAbsolute;
   },
 };

packages/mermaid/src/diagrams/class/classDiagram.ts

@@ -13,9 +13,7 @@ export const diagram: DiagramDefinition = {
   renderer,
   styles,
   init: (cnf) => {
-    if (!cnf.class) {
+    cnf.class ??= {};
-      cnf.class = {};
-    }
     cnf.class.arrowMarkerAbsolute = cnf.arrowMarkerAbsolute;
   },
 };

packages/mermaid/src/diagrams/class/classRenderer-v2.ts

@@ -117,7 +117,7 @@ export const addClasses = function (
         style: styles.style,
         id: vertex.id,
         domId: vertex.domId,
-        tooltip: diagObj.db.getTooltip(vertex.id, parent) || '',
+        tooltip: diagObj.db.getTooltip(vertex.id, parent) ?? '',
         haveCallback: vertex.haveCallback,
         link: vertex.link,
         width: vertex.type === 'group' ? 500 : undefined,

packages/mermaid/src/diagrams/packet/parser.ts

@@ -50,9 +50,7 @@ const getNextFittingBlock = (
   row: number,
   bitsPerRow: number
 ): [Required<PacketBlock>, PacketBlock | undefined] => {
-  if (block.end === undefined) {
+  block.end ??= block.start;
-    block.end = block.start;
-  }
 
   if (block.start > block.end) {
     throw new Error(`Block start ${block.start} is greater than block end ${block.end}.`);

packages/parser/src/language/common/valueConverter.ts

@@ -31,9 +31,8 @@ export abstract class AbstractMermaidValueConverter extends DefaultValueConverte
   ): ValueType {
     let value: ValueType | undefined = this.runCommonConverter(rule, input, cstNode);
 
-    if (value === undefined) {
+    value ??= this.runCustomConverter(rule, input, cstNode);
-      value = this.runCustomConverter(rule, input, cstNode);
+
-    }
     if (value === undefined) {
       return super.runConverter(rule, input, cstNode);
     }