From 8813cf2c94af64ad1fcf4c4b56a5a7640faa48a5 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Fri, 22 Aug 2025 09:03:57 +0000 Subject: [PATCH 1/7] Version Packages --- .changeset/crazy-loops-matter.md | 5 ----- packages/mermaid/CHANGELOG.md | 6 ++++++ packages/mermaid/package.json | 2 +- packages/tiny/CHANGELOG.md | 6 ++++++ packages/tiny/package.json | 2 +- 5 files changed, 14 insertions(+), 7 deletions(-) delete mode 100644 .changeset/crazy-loops-matter.md diff --git a/.changeset/crazy-loops-matter.md b/.changeset/crazy-loops-matter.md deleted file mode 100644 index e6377a9e5..000000000 --- a/.changeset/crazy-loops-matter.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'mermaid': patch ---- - -fix: Handle arrows correctly when auto number is enabled diff --git a/packages/mermaid/CHANGELOG.md b/packages/mermaid/CHANGELOG.md index df67f0cfd..12bcb2571 100644 --- a/packages/mermaid/CHANGELOG.md +++ b/packages/mermaid/CHANGELOG.md @@ -1,5 +1,11 @@ # mermaid +## 11.10.1 + +### Patch Changes + +- [#6886](https://github.com/mermaid-js/mermaid/pull/6886) [`e0b45c2`](https://github.com/mermaid-js/mermaid/commit/e0b45c2d2b41c2a9038bf87646fa3ccd7560eb20) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix: Handle arrows correctly when auto number is enabled + ## 11.10.0 ### Minor Changes diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json index 56446c34b..c884b62e9 100644 --- a/packages/mermaid/package.json +++ b/packages/mermaid/package.json @@ -1,6 +1,6 @@ { "name": "mermaid", - "version": "11.10.0", + "version": "11.10.1", "description": "Markdown-ish syntax for generating flowcharts, mindmaps, sequence diagrams, class diagrams, gantt charts, git graphs and more.", "type": "module", "module": "./dist/mermaid.core.mjs", diff --git a/packages/tiny/CHANGELOG.md b/packages/tiny/CHANGELOG.md index df67f0cfd..12bcb2571 100644 --- a/packages/tiny/CHANGELOG.md +++ b/packages/tiny/CHANGELOG.md @@ -1,5 +1,11 @@ # mermaid +## 11.10.1 + +### Patch Changes + +- [#6886](https://github.com/mermaid-js/mermaid/pull/6886) [`e0b45c2`](https://github.com/mermaid-js/mermaid/commit/e0b45c2d2b41c2a9038bf87646fa3ccd7560eb20) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix: Handle arrows correctly when auto number is enabled + ## 11.10.0 ### Minor Changes diff --git a/packages/tiny/package.json b/packages/tiny/package.json index 3d7b307c9..b378ad423 100644 --- a/packages/tiny/package.json +++ b/packages/tiny/package.json @@ -1,6 +1,6 @@ { "name": "@mermaid-js/tiny", - "version": "11.10.0", + "version": "11.10.1", "description": "Tiny version of mermaid", "type": "commonjs", "main": "./dist/mermaid.tiny.js", From 8ba7520accdaff19ed0bd79571b12e3ca8ce8adf Mon Sep 17 00:00:00 2001 From: Maria Stellini Date: Sun, 24 Aug 2025 19:20:02 +0200 Subject: [PATCH 2/7] docs: Update 1 file --- packages/mermaid/src/docs/syntax/xyChart.md | 41 ++++++++++++++++++++- 1 file changed, 39 insertions(+), 2 deletions(-) diff --git a/packages/mermaid/src/docs/syntax/xyChart.md b/packages/mermaid/src/docs/syntax/xyChart.md index 4154fb2f0..c1f3c0591 100644 --- a/packages/mermaid/src/docs/syntax/xyChart.md +++ b/packages/mermaid/src/docs/syntax/xyChart.md @@ -126,7 +126,7 @@ xychart ## Chart Theme Variables -Themes for xychart resides inside xychart attribute so to set the variables use this syntax: +Themes for xychart reside inside the `xychart` attribute, allowing customization through the following syntax: ```yaml --- @@ -149,7 +149,44 @@ config: | yAxisTitleColor | Color of the y-axis title | | yAxisTickColor | Color of the y-axis tick | | yAxisLineColor | Color of the y-axis line | -| plotColorPalette | String of colors separated by comma e.g. "#f3456, #43445" | +| plotColorPalette | String of colors separated by commas, e.g., "#f3456, #43445" | + +Using the `plotColorPalette`, you can apply a set of colors to the lines and bars in the `xyChart`. The order of colors in the palette corresponds to the order of bars or lines in the chart. + +### Example + +Here's how you can configure different colors for lines and bars. To add a legend, use corresponding colors in the legend description: + +```yaml +--- +config: + themeVariables: + xyChart: + plotColorPalette: "#000000, #0000FF, #00FF00, #FF0000" +--- +``` +``` +xychart-beta + title "Different Colors in xyChart" + x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"] + y-axis "valuesY" 0 --> 50 + %% Black line + line [10,20,30,40] + %% Blue bar + bar [20,30,25,35] + %% Green bar + bar [15,25,20,30] + %% Red line + line [5,15,25,35] +``` + +With this setup, the chart will use different colors specified in the palette for each line and bar. + +**Legend Creation** +- Use colors from the `plotColorPalette` in the legend. +- Ensure the description aligns with the order of elements in the chart. + +Thanks to contributors for identifying the need for comprehensive customization examples. ## Example on config and theme From 231fcc700f4d0779447692932b9442b66416bc1f Mon Sep 17 00:00:00 2001 From: Maria Stellini Date: Sun, 24 Aug 2025 19:31:57 +0200 Subject: [PATCH 3/7] xychart: repositioned the colours section --- packages/mermaid/src/docs/syntax/xyChart.md | 21 ++++----------------- 1 file changed, 4 insertions(+), 17 deletions(-) diff --git a/packages/mermaid/src/docs/syntax/xyChart.md b/packages/mermaid/src/docs/syntax/xyChart.md index c1f3c0591..785d95d81 100644 --- a/packages/mermaid/src/docs/syntax/xyChart.md +++ b/packages/mermaid/src/docs/syntax/xyChart.md @@ -149,13 +149,10 @@ config: | yAxisTitleColor | Color of the y-axis title | | yAxisTickColor | Color of the y-axis tick | | yAxisLineColor | Color of the y-axis line | -| plotColorPalette | String of colors separated by commas, e.g., "#f3456, #43445" | +| plotColorPalette | String of colors separated by comma e.g. "#f3456, #43445" | -Using the `plotColorPalette`, you can apply a set of colors to the lines and bars in the `xyChart`. The order of colors in the palette corresponds to the order of bars or lines in the chart. - -### Example - -Here's how you can configure different colors for lines and bars. To add a legend, use corresponding colors in the legend description: +### Setting Colors for Lines and Bars +To set the color for lines and bars, use the `plotColorPalette` parameter. Colors in the palette will correspond sequentially to the elements in your chart (e.g., first bar/line will use the first color specified in the palette). ```yaml --- @@ -164,9 +161,7 @@ config: xyChart: plotColorPalette: "#000000, #0000FF, #00FF00, #FF0000" --- -``` -``` -xychart-beta +xychart title "Different Colors in xyChart" x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"] y-axis "valuesY" 0 --> 50 @@ -180,14 +175,6 @@ xychart-beta line [5,15,25,35] ``` -With this setup, the chart will use different colors specified in the palette for each line and bar. - -**Legend Creation** -- Use colors from the `plotColorPalette` in the legend. -- Ensure the description aligns with the order of elements in the chart. - -Thanks to contributors for identifying the need for comprehensive customization examples. - ## Example on config and theme ```mermaid-example From 11c8848e1fed5e7bc50fb6893a94f54a934b1160 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Sun, 24 Aug 2025 17:49:14 +0000 Subject: [PATCH 4/7] [autofix.ci] apply automated fixes --- docs/syntax/xyChart.md | 27 ++++++++++++++++++- packages/mermaid/src/docs/syntax/xyChart.md | 29 +++++++++++---------- 2 files changed, 41 insertions(+), 15 deletions(-) diff --git a/docs/syntax/xyChart.md b/docs/syntax/xyChart.md index dec16a518..a981fe5e9 100644 --- a/docs/syntax/xyChart.md +++ b/docs/syntax/xyChart.md @@ -138,7 +138,7 @@ xychart ## Chart Theme Variables -Themes for xychart resides inside xychart attribute so to set the variables use this syntax: +Themes for xychart reside inside the `xychart` attribute, allowing customization through the following syntax: ```yaml --- @@ -163,6 +163,31 @@ config: | yAxisLineColor | Color of the y-axis line | | plotColorPalette | String of colors separated by comma e.g. "#f3456, #43445" | +### Setting Colors for Lines and Bars + +To set the color for lines and bars, use the `plotColorPalette` parameter. Colors in the palette will correspond sequentially to the elements in your chart (e.g., first bar/line will use the first color specified in the palette). + +```yaml +--- +config: + themeVariables: + xyChart: + plotColorPalette: '#000000, #0000FF, #00FF00, #FF0000' +--- +xychart +title "Different Colors in xyChart" +x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"] +y-axis "valuesY" 0 --> 50 +%% Black line +line [10,20,30,40] +%% Blue bar +bar [20,30,25,35] +%% Green bar +bar [15,25,20,30] +%% Red line +line [5,15,25,35] +``` + ## Example on config and theme ```mermaid-example diff --git a/packages/mermaid/src/docs/syntax/xyChart.md b/packages/mermaid/src/docs/syntax/xyChart.md index 785d95d81..b070fbafe 100644 --- a/packages/mermaid/src/docs/syntax/xyChart.md +++ b/packages/mermaid/src/docs/syntax/xyChart.md @@ -152,27 +152,28 @@ config: | plotColorPalette | String of colors separated by comma e.g. "#f3456, #43445" | ### Setting Colors for Lines and Bars + To set the color for lines and bars, use the `plotColorPalette` parameter. Colors in the palette will correspond sequentially to the elements in your chart (e.g., first bar/line will use the first color specified in the palette). ```yaml --- config: - themeVariables: - xyChart: - plotColorPalette: "#000000, #0000FF, #00FF00, #FF0000" + themeVariables: + xyChart: + plotColorPalette: '#000000, #0000FF, #00FF00, #FF0000' --- xychart - title "Different Colors in xyChart" - x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"] - y-axis "valuesY" 0 --> 50 - %% Black line - line [10,20,30,40] - %% Blue bar - bar [20,30,25,35] - %% Green bar - bar [15,25,20,30] - %% Red line - line [5,15,25,35] +title "Different Colors in xyChart" +x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"] +y-axis "valuesY" 0 --> 50 +%% Black line +line [10,20,30,40] +%% Blue bar +bar [20,30,25,35] +%% Green bar +bar [15,25,20,30] +%% Red line +line [5,15,25,35] ``` ## Example on config and theme From 202172135d8c49d931011be1db5ad45aa1e0c983 Mon Sep 17 00:00:00 2001 From: Maria Stellini Date: Sun, 24 Aug 2025 20:05:38 +0200 Subject: [PATCH 5/7] Revert "Merge remote-tracking branch 'origin/master' into docs/xychart-plotcolorpalette-example" This reverts commit b94ab243a8d45f94de1f1d0523859bf308d67c33, reversing changes made to 11c8848e1fed5e7bc50fb6893a94f54a934b1160. --- .changeset/crazy-loops-matter.md | 5 +++++ packages/mermaid/CHANGELOG.md | 6 ------ packages/mermaid/package.json | 2 +- packages/tiny/CHANGELOG.md | 6 ------ packages/tiny/package.json | 2 +- 5 files changed, 7 insertions(+), 14 deletions(-) create mode 100644 .changeset/crazy-loops-matter.md diff --git a/.changeset/crazy-loops-matter.md b/.changeset/crazy-loops-matter.md new file mode 100644 index 000000000..e6377a9e5 --- /dev/null +++ b/.changeset/crazy-loops-matter.md @@ -0,0 +1,5 @@ +--- +'mermaid': patch +--- + +fix: Handle arrows correctly when auto number is enabled diff --git a/packages/mermaid/CHANGELOG.md b/packages/mermaid/CHANGELOG.md index 12bcb2571..df67f0cfd 100644 --- a/packages/mermaid/CHANGELOG.md +++ b/packages/mermaid/CHANGELOG.md @@ -1,11 +1,5 @@ # mermaid -## 11.10.1 - -### Patch Changes - -- [#6886](https://github.com/mermaid-js/mermaid/pull/6886) [`e0b45c2`](https://github.com/mermaid-js/mermaid/commit/e0b45c2d2b41c2a9038bf87646fa3ccd7560eb20) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix: Handle arrows correctly when auto number is enabled - ## 11.10.0 ### Minor Changes diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json index c884b62e9..56446c34b 100644 --- a/packages/mermaid/package.json +++ b/packages/mermaid/package.json @@ -1,6 +1,6 @@ { "name": "mermaid", - "version": "11.10.1", + "version": "11.10.0", "description": "Markdown-ish syntax for generating flowcharts, mindmaps, sequence diagrams, class diagrams, gantt charts, git graphs and more.", "type": "module", "module": "./dist/mermaid.core.mjs", diff --git a/packages/tiny/CHANGELOG.md b/packages/tiny/CHANGELOG.md index 12bcb2571..df67f0cfd 100644 --- a/packages/tiny/CHANGELOG.md +++ b/packages/tiny/CHANGELOG.md @@ -1,11 +1,5 @@ # mermaid -## 11.10.1 - -### Patch Changes - -- [#6886](https://github.com/mermaid-js/mermaid/pull/6886) [`e0b45c2`](https://github.com/mermaid-js/mermaid/commit/e0b45c2d2b41c2a9038bf87646fa3ccd7560eb20) Thanks [@darshanr0107](https://github.com/darshanr0107)! - fix: Handle arrows correctly when auto number is enabled - ## 11.10.0 ### Minor Changes diff --git a/packages/tiny/package.json b/packages/tiny/package.json index b378ad423..3d7b307c9 100644 --- a/packages/tiny/package.json +++ b/packages/tiny/package.json @@ -1,6 +1,6 @@ { "name": "@mermaid-js/tiny", - "version": "11.10.1", + "version": "11.10.0", "description": "Tiny version of mermaid", "type": "commonjs", "main": "./dist/mermaid.tiny.js", From 4dd89e439fe3447e330c51116b2c3a3c04399b90 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Wed, 3 Sep 2025 03:37:21 -0700 Subject: [PATCH 6/7] Update packages/mermaid/src/docs/syntax/xyChart.md --- packages/mermaid/src/docs/syntax/xyChart.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/docs/syntax/xyChart.md b/packages/mermaid/src/docs/syntax/xyChart.md index b070fbafe..cfff201d3 100644 --- a/packages/mermaid/src/docs/syntax/xyChart.md +++ b/packages/mermaid/src/docs/syntax/xyChart.md @@ -155,7 +155,7 @@ config: To set the color for lines and bars, use the `plotColorPalette` parameter. Colors in the palette will correspond sequentially to the elements in your chart (e.g., first bar/line will use the first color specified in the palette). -```yaml +```mermaid-example --- config: themeVariables: From 34fc8bddc43872f6f0213b0df2bfb804ae7ff8cb Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Wed, 3 Sep 2025 10:42:22 +0000 Subject: [PATCH 7/7] [autofix.ci] apply automated fixes --- docs/syntax/xyChart.md | 23 ++++++++++++++++++++++- 1 file changed, 22 insertions(+), 1 deletion(-) diff --git a/docs/syntax/xyChart.md b/docs/syntax/xyChart.md index a981fe5e9..742a4f18a 100644 --- a/docs/syntax/xyChart.md +++ b/docs/syntax/xyChart.md @@ -167,7 +167,28 @@ config: To set the color for lines and bars, use the `plotColorPalette` parameter. Colors in the palette will correspond sequentially to the elements in your chart (e.g., first bar/line will use the first color specified in the palette). -```yaml +```mermaid-example +--- +config: + themeVariables: + xyChart: + plotColorPalette: '#000000, #0000FF, #00FF00, #FF0000' +--- +xychart +title "Different Colors in xyChart" +x-axis "categoriesX" ["Category 1", "Category 2", "Category 3", "Category 4"] +y-axis "valuesY" 0 --> 50 +%% Black line +line [10,20,30,40] +%% Blue bar +bar [20,30,25,35] +%% Green bar +bar [15,25,20,30] +%% Red line +line [5,15,25,35] +``` + +```mermaid --- config: themeVariables: