Merge branch 'mermaid-js:develop' into chore/shorten-flow-huge-test-case

mermaid-js · Sep 22, 2023 · ca960c4 · ca960c4
2 parents bd86197 + 0534d75
commit ca960c4
Show file tree

Hide file tree

Showing 6 changed files with 228 additions and 49 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -49,8 +49,10 @@ module.exports = {
     'no-unused-vars': 'off',
     'cypress/no-async-tests': 'off',
     '@typescript-eslint/consistent-type-imports': 'error',
+    '@typescript-eslint/no-explicit-any': 'warn',
     '@typescript-eslint/no-floating-promises': 'error',
     '@typescript-eslint/no-misused-promises': 'error',
+    '@typescript-eslint/no-unused-vars': 'warn',
     '@typescript-eslint/ban-ts-comment': [
       'error',
       {

diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md
@@ -59,8 +59,8 @@ representative at an online or offline event.
 ## Enforcement
 
 Instances of abusive, harassing, or otherwise unacceptable behavior may be
-reported to the community leaders responsible for enforcement at security@mermaid.live
-.
+reported to the community leaders responsible for enforcement at <security@mermaid.live>.
+
 All complaints will be reviewed and investigated promptly and fairly.
 
 All community leaders are obligated to respect the privacy and security of the

diff --git a/cypress/integration/rendering/quadrantChart.spec.js b/cypress/integration/rendering/quadrantChart.spec.js
@@ -160,4 +160,70 @@ describe('Quadrant Chart', () => {
     );
     cy.get('svg');
   });
+  it('should render x-axis labels in the center, if x-axis has two labels', () => {
+    imgSnapshotTest(
+      `
+  quadrantChart
+    title Reach and engagement of campaigns
+    x-axis Low Reach --> High Reach
+    y-axis Low Engagement
+    quadrant-1 We should expand
+    quadrant-2 Need to promote
+    quadrant-3 Re-evaluate
+    quadrant-4 May be improved
+    Campaign A: [0.3, 0.6]
+    Campaign B: [0.45, 0.23]
+    Campaign C: [0.57, 0.69]
+    Campaign D: [0.78, 0.34]
+    Campaign E: [0.40, 0.34]
+    Campaign F: [0.35, 0.78]
+      `,
+      {}
+    );
+    cy.get('svg');
+  });
+  it('should render y-axis labels in the center, if y-axis has two labels', () => {
+    imgSnapshotTest(
+      `
+  quadrantChart
+    title Reach and engagement of campaigns
+    x-axis Low Reach
+    y-axis Low Engagement --> High Engagement
+    quadrant-1 We should expand
+    quadrant-2 Need to promote
+    quadrant-3 Re-evaluate
+    quadrant-4 May be improved
+    Campaign A: [0.3, 0.6]
+    Campaign B: [0.45, 0.23]
+    Campaign C: [0.57, 0.69]
+    Campaign D: [0.78, 0.34]
+    Campaign E: [0.40, 0.34]
+    Campaign F: [0.35, 0.78]
+      `,
+      {}
+    );
+    cy.get('svg');
+  });
+  it('should render both axes labels on the left and bottom, if both axes have only one label', () => {
+    imgSnapshotTest(
+      `
+  quadrantChart
+    title Reach and engagement of campaigns
+    x-axis Reach -->
+    y-axis Engagement -->
+    quadrant-1 We should expand
+    quadrant-2 Need to promote
+    quadrant-3 Re-evaluate
+    quadrant-4 May be improved
+    Campaign A: [0.3, 0.6]
+    Campaign B: [0.45, 0.23]
+    Campaign C: [0.57, 0.69]
+    Campaign D: [0.78, 0.34]
+    Campaign E: [0.40, 0.34]
+    Campaign F: [0.35, 0.78]
+      `,
+      {}
+    );
+    cy.get('svg');
+  });
 });
diff --git a/package.json b/package.json
@@ -77,8 +77,8 @@
     "@types/node": "^18.16.0",
     "@types/prettier": "^2.7.2",
     "@types/rollup-plugin-visualizer": "^4.2.1",
-    "@typescript-eslint/eslint-plugin": "^5.59.0",
-    "@typescript-eslint/parser": "^5.59.0",
+    "@typescript-eslint/eslint-plugin": "^6.7.2",
+    "@typescript-eslint/parser": "^6.7.2",
     "@vitest/coverage-v8": "^0.34.0",
     "@vitest/spy": "^0.34.0",
     "@vitest/ui": "^0.34.0",

diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantBuilder.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantBuilder.ts
@@ -283,14 +283,17 @@ export class QuadrantBuilder {
       quadrantTop,
       quadrantWidth,
     } = quadrantSpace;
-    const drawAxisLabelInMiddle = this.data.points.length === 0;
+
+    const drawXAxisLabelsInMiddle = Boolean(this.data.xAxisRightText);
+    const drawYAxisLabelsInMiddle = Boolean(this.data.yAxisTopText);
+
     const axisLabels: QuadrantTextType[] = [];
 
     if (this.data.xAxisLeftText && showXAxis) {
       axisLabels.push({
         text: this.data.xAxisLeftText,
         fill: this.themeConfig.quadrantXAxisTextFill,
-        x: quadrantLeft + (drawAxisLabelInMiddle ? quadrantHalfWidth / 2 : 0),
+        x: quadrantLeft + (drawXAxisLabelsInMiddle ? quadrantHalfWidth / 2 : 0),
         y:
           xAxisPosition === 'top'
             ? this.config.xAxisLabelPadding + titleSpace.top
@@ -299,7 +302,7 @@ export class QuadrantBuilder {
               quadrantHeight +
               this.config.quadrantPadding,
         fontSize: this.config.xAxisLabelFontSize,
-        verticalPos: drawAxisLabelInMiddle ? 'center' : 'left',
+        verticalPos: drawXAxisLabelsInMiddle ? 'center' : 'left',
         horizontalPos: 'top',
         rotation: 0,
       });
@@ -308,7 +311,7 @@ export class QuadrantBuilder {
       axisLabels.push({
         text: this.data.xAxisRightText,
         fill: this.themeConfig.quadrantXAxisTextFill,
-        x: quadrantLeft + quadrantHalfWidth + (drawAxisLabelInMiddle ? quadrantHalfWidth / 2 : 0),
+        x: quadrantLeft + quadrantHalfWidth + (drawXAxisLabelsInMiddle ? quadrantHalfWidth / 2 : 0),
         y:
           xAxisPosition === 'top'
             ? this.config.xAxisLabelPadding + titleSpace.top
@@ -317,7 +320,7 @@ export class QuadrantBuilder {
               quadrantHeight +
               this.config.quadrantPadding,
         fontSize: this.config.xAxisLabelFontSize,
-        verticalPos: drawAxisLabelInMiddle ? 'center' : 'left',
+        verticalPos: drawXAxisLabelsInMiddle ? 'center' : 'left',
         horizontalPos: 'top',
         rotation: 0,
       });
@@ -334,9 +337,9 @@ export class QuadrantBuilder {
               quadrantLeft +
               quadrantWidth +
               this.config.quadrantPadding,
-        y: quadrantTop + quadrantHeight - (drawAxisLabelInMiddle ? quadrantHalfHeight / 2 : 0),
+        y: quadrantTop + quadrantHeight - (drawYAxisLabelsInMiddle ? quadrantHalfHeight / 2 : 0),
         fontSize: this.config.yAxisLabelFontSize,
-        verticalPos: drawAxisLabelInMiddle ? 'center' : 'left',
+        verticalPos: drawYAxisLabelsInMiddle ? 'center' : 'left',
         horizontalPos: 'top',
         rotation: -90,
       });
@@ -352,9 +355,10 @@ export class QuadrantBuilder {
               quadrantLeft +
               quadrantWidth +
               this.config.quadrantPadding,
-        y: quadrantTop + quadrantHalfHeight - (drawAxisLabelInMiddle ? quadrantHalfHeight / 2 : 0),
+        y:
+          quadrantTop + quadrantHalfHeight - (drawYAxisLabelsInMiddle ? quadrantHalfHeight / 2 : 0),
         fontSize: this.config.yAxisLabelFontSize,
-        verticalPos: drawAxisLabelInMiddle ? 'center' : 'left',
+        verticalPos: drawYAxisLabelsInMiddle ? 'center' : 'left',
         horizontalPos: 'top',
         rotation: -90,
       });