marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-11-18 19:54:17 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge from upstream mermaid OS develop

Browse Source
This commit is contained in:
Ashish Jain
2025-01-28 10:56:26 +01:00
parent 463d42b86d 8dd0e7a794
commit 579d1ee33c
21 changed files with 2430 additions and 1394 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.cspell/libraries.txt
View File

@@ -26,6 +26,7 @@ dompurify
elkjs elkjs
fcose fcose
fontawesome fontawesome
Forgejo
Foswiki Foswiki
Gitea Gitea
graphlib graphlib

2
.github/workflows/autofix.yml vendored
View File

@@ -42,4 +42,4 @@ jobs:
working-directory: ./packages/mermaid working-directory: ./packages/mermaid
run: pnpm run docs:build run: pnpm run docs:build
- uses: autofix-ci/action@ff86a557419858bb967097bfc916833f5647fa8c # main - uses: autofix-ci/action@551dded8c6cc8a1054039c8bc0b8b48c51dfc6ef # main

22
.github/workflows/e2e.yml vendored
View File

@@ -7,6 +7,9 @@ on:
- master - master
- release/** - release/**
pull_request: pull_request:
issue_comment:
types:
- created
merge_group: merge_group:
concurrency: ${{ github.workflow }}-${{ github.ref }} concurrency: ${{ github.workflow }}-${{ github.ref }}
@@ -28,8 +31,12 @@ env:
) || ) ||
github.event.before github.event.before
}} }}
# Check if this is a new comment with '/visual-test'
RUN_VISUAL_TEST: >-
${{ github.event_name == 'issue_comment' && github.event.action == 'created' && contains(github.event.comment.body, '/visual-test') && github.event.issue.pull_request != null }}
jobs: jobs:
cache: cache:
if: ${{ github.event_name != 'issue_comment' || contains(github.event.comment.body, '/visual-test') }}
runs-on: ubuntu-latest runs-on: ubuntu-latest
container: container:
image: cypress/browsers:node-20.11.0-chrome-121.0.6167.85-1-ff-120.0-edge-121.0.2277.83-1 image: cypress/browsers:node-20.11.0-chrome-121.0.6167.85-1-ff-120.0-edge-121.0.2277.83-1
@@ -125,18 +132,19 @@ jobs:
browser: chrome browser: chrome
# Disable recording if we don't have an API key # Disable recording if we don't have an API key
# e.g. if this action was run from a fork # e.g. if this action was run from a fork
record: ${{ secrets.CYPRESS_RECORD_KEY != '' }} record: ${{ env.RUN_VISUAL_TEST == 'true' && secrets.CYPRESS_RECORD_KEY != '' }}
env: env:
CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }} # Only set Argos environment variables if the visual test comment trigger is present
VITEST_COVERAGE: true ARGOS_TOKEN: ${{ env.RUN_VISUAL_TEST == 'true' && secrets.ARGOS_TOKEN || '' }}
ARGOS_PARALLEL: ${{ env.RUN_VISUAL_TEST == 'true' }}
ARGOS_PARALLEL_TOTAL: ${{ env.RUN_VISUAL_TEST == 'true' && strategy.job-total || 1 }}
ARGOS_PARALLEL_INDEX: ${{ env.RUN_VISUAL_TEST == 'true' && matrix.containers || 1 }}
CYPRESS_COMMIT: ${{ github.sha }} CYPRESS_COMMIT: ${{ github.sha }}
ARGOS_TOKEN: ${{ secrets.ARGOS_TOKEN }} CYPRESS_RECORD_KEY: ${{ env.RUN_VISUAL_TEST == 'true' && secrets.CYPRESS_RECORD_KEY || ''}}
ARGOS_PARALLEL: true
ARGOS_PARALLEL_TOTAL: ${{ strategy.job-total }}
ARGOS_PARALLEL_INDEX: ${{ matrix.containers }}
SPLIT: ${{ strategy.job-total }} SPLIT: ${{ strategy.job-total }}
SPLIT_INDEX: ${{ strategy.job-index }} SPLIT_INDEX: ${{ strategy.job-index }}
SPLIT_FILE: 'cypress/timings.json' SPLIT_FILE: 'cypress/timings.json'
VITEST_COVERAGE: true
- name: Upload Coverage to Codecov - name: Upload Coverage to Codecov
uses: codecov/codecov-action@e28ff129e5465c2c0dcc6f003fc735cb6ae0c673 # v4.5.0 uses: codecov/codecov-action@e28ff129e5465c2c0dcc6f003fc735cb6ae0c673 # v4.5.0

2
.github/workflows/scorecard.yml vendored
View File

@@ -26,7 +26,7 @@ jobs:
results_format: sarif results_format: sarif
publish_results: true publish_results: true
- name: Upload artifact - name: Upload artifact
uses: actions/upload-artifact@97a0fba1372883ab732affbe8f94b823f91727db # v3.pre.node20 uses: actions/upload-artifact@65c4c4a1ddee5b72f698fdd19549f0f0fb45cf08 # v4.6.0
with: with:
name: SARIF file name: SARIF file
path: results.sarif path: results.sarif

6
README.md
View File

@@ -95,6 +95,10 @@ In our release process we rely heavily on visual regression tests using [applito
<!-- </Main description> --> <!-- </Main description> -->
## Mermaid AI Bot
[Mermaid](https://codeparrot.ai/oracle?owner=mermaid-js&repo=mermaid) Bot will help you understand this repository better. You can ask for code examples, installation guide, debugging help and much more.
## Examples ## Examples
**The following are some examples of the diagrams, charts and graphs that can be made using Mermaid. Click here to jump into the [text syntax](https://mermaid.js.org/intro/syntax-reference.html).** **The following are some examples of the diagrams, charts and graphs that can be made using Mermaid. Click here to jump into the [text syntax](https://mermaid.js.org/intro/syntax-reference.html).**
@@ -435,7 +439,7 @@ A quick note from Knut Sveidqvist:
> >
> _Thank you to [Tyler Long](https://github.com/tylerlong) who has been a collaborator since April 2017._ > _Thank you to [Tyler Long](https://github.com/tylerlong) who has been a collaborator since April 2017._
> >
> _Thank you to the ever-growing list of [contributors](https://github.com/knsv/mermaid/graphs/contributors) that brought the project this far!_ > _Thank you to the ever-growing list of [contributors](https://github.com/mermaid-js/mermaid/graphs/contributors) that brought the project this far!_
--- ---

2
README.zh-CN.md
View File

@@ -358,7 +358,7 @@ _很不幸的是，鱼与熊掌不可兼得，在这个场景下它意味着在
> _特别感谢 [d3](https://d3js.org/) 和 [dagre-d3](https://github.com/cpettitt/dagre-d3) 这两个优秀的项目，它们提供了图形布局和绘图工具库！_ > _同样感谢 [js-sequence-diagram](https://bramp.github.io/js-sequence-diagrams) 提供了时序图语法的使用。 感谢 Jessica Peter 提供了甘特图渲染的灵感。_ > _感谢 [Tyler Long](https://github.com/tylerlong) 从 2017 年四月开始成为了项目的合作者。_ > _特别感谢 [d3](https://d3js.org/) 和 [dagre-d3](https://github.com/cpettitt/dagre-d3) 这两个优秀的项目，它们提供了图形布局和绘图工具库！_ > _同样感谢 [js-sequence-diagram](https://bramp.github.io/js-sequence-diagrams) 提供了时序图语法的使用。 感谢 Jessica Peter 提供了甘特图渲染的灵感。_ > _感谢 [Tyler Long](https://github.com/tylerlong) 从 2017 年四月开始成为了项目的合作者。_
> >
> _感谢越来越多的 [贡献者们](https://github.com/knsv/mermaid/graphs/contributors)，没有你们，就没有这个项目的今天！_ > _感谢越来越多的 [贡献者们](https://github.com/mermaid-js/mermaid/graphs/contributors)，没有你们，就没有这个项目的今天！_
--- ---

4
cypress.config.ts
View File

@@ -25,7 +25,9 @@ export default eyesPlugin(
config.env.useAppli = process.env.USE_APPLI ? true : false; config.env.useAppli = process.env.USE_APPLI ? true : false;
// only use Argos on CI in the mermaid-js/mermaid repository // only use Argos on CI in the mermaid-js/mermaid repository
config.env.useArgos = config.env.useArgos =
!!process.env.CI && process.env.GITHUB_REPOSITORY === 'mermaid-js/mermaid'; !!process.env.CI &&
process.env.GITHUB_REPOSITORY === 'mermaid-js/mermaid' &&
!!process.env.ARGOS_TOKEN;
if (config.env.useArgos) { if (config.env.useArgos) {
registerArgosTask(on, config, { registerArgosTask(on, config, {

7
cypress/helpers/util.ts
View File

@@ -132,3 +132,10 @@ export const verifyScreenshot = (name: string): void => {
cy.matchImageSnapshot(name); cy.matchImageSnapshot(name);
} }
}; };
export const verifyNumber = (value: number, expected: number, deltaPercent = 10): void => {
expect(value).to.be.within(
expected * (1 - deltaPercent / 100),
expected * (1 + deltaPercent / 100)
);
};

12
cypress/integration/rendering/flowchart-elk.spec.js
View File

@@ -1,4 +1,4 @@
import { imgSnapshotTest, renderGraph } from '../../helpers/util.ts'; import { imgSnapshotTest, renderGraph, verifyNumber } from '../../helpers/util.ts';
describe('Flowchart ELK', () => { describe('Flowchart ELK', () => {
it('1-elk: should render a simple flowchart', () => { it('1-elk: should render a simple flowchart', () => {
@@ -109,7 +109,7 @@ describe('Flowchart ELK', () => {
const style = svg.attr('style'); const style = svg.attr('style');
expect(style).to.match(/^max-width: [\d.]+px;$/); expect(style).to.match(/^max-width: [\d.]+px;$/);
const maxWidthValue = parseFloat(style.match(/[\d.]+/g).join('')); const maxWidthValue = parseFloat(style.match(/[\d.]+/g).join(''));
expect(maxWidthValue).to.be.within(230 * 0.95, 230 * 1.05); verifyNumber(maxWidthValue, 380);
}); });
}); });
it('8-elk: should render a flowchart when useMaxWidth is false', () => { it('8-elk: should render a flowchart when useMaxWidth is false', () => {
@@ -128,7 +128,7 @@ describe('Flowchart ELK', () => {
const width = parseFloat(svg.attr('width')); const width = parseFloat(svg.attr('width'));
// use within because the absolute value can be slightly different depending on the environment ±5% // use within because the absolute value can be slightly different depending on the environment ±5%
// expect(height).to.be.within(446 * 0.95, 446 * 1.05); // expect(height).to.be.within(446 * 0.95, 446 * 1.05);
expect(width).to.be.within(230 * 0.95, 230 * 1.05); verifyNumber(width, 380);
expect(svg).to.not.have.attr('style'); expect(svg).to.not.have.attr('style');
}); });
}); });
@@ -692,7 +692,7 @@ A --> B
{} {}
); );
cy.get('svg').should((svg) => { cy.get('svg').should((svg) => {
const edges = svg.querySelectorAll('.edges > path'); const edges = svg[0].querySelectorAll('.edges > path');
edges.forEach((edge) => { edges.forEach((edge) => {
expect(edge).to.have.class('flowchart-link'); expect(edge).to.have.class('flowchart-link');
}); });
@@ -739,7 +739,7 @@ NL\`") --"\`1o **bold**\`"--> c
{ flowchart: { titleTopMargin: 0 } } { flowchart: { titleTopMargin: 0 } }
); );
}); });
it('Wrapping long text with a new line', () => { it.skip('Wrapping long text with a new line', () => {
imgSnapshotTest( imgSnapshotTest(
`%%{init: {"flowchart": {"htmlLabels": true}} }%% `%%{init: {"flowchart": {"htmlLabels": true}} }%%
flowchart-elk LR flowchart-elk LR
@@ -841,7 +841,7 @@ end
{ flowchart: { titleTopMargin: 0 } } { flowchart: { titleTopMargin: 0 } }
); );
}); });
it('Sub graphs and markdown strings', () => { it('Sub graphs', () => {
imgSnapshotTest( imgSnapshotTest(
`--- `---
config: config:

14
docs/config/faq.md
View File

@@ -6,12 +6,12 @@
# Frequently Asked Questions # Frequently Asked Questions
1. [How to add title to flowchart?](https://github.com/knsv/mermaid/issues/556#issuecomment-363182217) 1. [How to add title to flowchart?](https://github.com/mermaid-js/mermaid/issues/556#issuecomment-363182217)
2. [How to specify custom CSS file?](https://github.com/mermaidjs/mermaid.cli/pull/24#issuecomment-373402785) 2. [How to specify custom CSS file?](https://github.com/mermaidjs/mermaid.cli/pull/24#issuecomment-373402785)
3. [How to fix tooltip misplacement issue?](https://github.com/knsv/mermaid/issues/542#issuecomment-3343564621) 3. [How to fix tooltip misplacement issue?](https://github.com/mermaid-js/mermaid/issues/542#issuecomment-3343564621)
4. [How to specify gantt diagram xAxis format?](https://github.com/knsv/mermaid/issues/269#issuecomment-373229136) 4. [How to specify gantt diagram xAxis format?](https://github.com/mermaid-js/mermaid/issues/269#issuecomment-373229136)
5. [How to bind an event?](https://github.com/knsv/mermaid/issues/372) 5. [How to bind an event?](https://github.com/mermaid-js/mermaid/issues/372)
6. [How to add newline in the text?](https://github.com/knsv/mermaid/issues/384#issuecomment-281339381) 6. [How to add newline in the text?](https://github.com/mermaid-js/mermaid/issues/384#issuecomment-281339381)
7. [How to have special characters in link text?](https://github.com/knsv/mermaid/issues/407#issuecomment-329944735) 7. [How to have special characters in link text?](https://github.com/mermaid-js/mermaid/issues/407#issuecomment-329944735)
8. [How to change Flowchart curve style?](https://github.com/knsv/mermaid/issues/580#issuecomment-373929046) 8. [How to change Flowchart curve style?](https://github.com/mermaid-js/mermaid/issues/580#issuecomment-373929046)
9. [How to create a Flowchart end-Node that says "End"](https://github.com/mermaid-js/mermaid/issues/1444#issuecomment-639528897) 9. [How to create a Flowchart end-Node that says "End"](https://github.com/mermaid-js/mermaid/issues/1444#issuecomment-639528897)

4
docs/ecosystem/integrations-community.md
View File

@@ -44,6 +44,7 @@ To add an integration to this list, see the [Integrations - create page](./integ
- [Deepdwn](https://billiam.itch.io/deepdwn) ✅ - [Deepdwn](https://billiam.itch.io/deepdwn) ✅
- [Doctave](https://www.doctave.com/) ✅ - [Doctave](https://www.doctave.com/) ✅
- [Mermaid in Markdown code blocks](https://docs.doctave.com/components/mermaid) ✅ - [Mermaid in Markdown code blocks](https://docs.doctave.com/components/mermaid) ✅
- [Forgejo](https://forgejo.org/) ✅
- [GitBook](https://gitbook.com) - [GitBook](https://gitbook.com)
- [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid)
- [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf)
@@ -99,8 +100,7 @@ Blogging frameworks and platforms
- [Nextra](https://nextra.site/) - [Nextra](https://nextra.site/)
- [Mermaid](https://nextra.site/docs/guide/mermaid) - [Mermaid](https://nextra.site/docs/guide/mermaid)
- [WordPress](https://wordpress.org) - [WordPress](https://wordpress.org)
- [WordPress Markdown Editor](https://wordpress.org/plugins/wp-githuber-md) - [MerPRess](https://wordpress.org/plugins/merpress/)
- [WP-ReliableMD](https://wordpress.org/plugins/wp-reliablemd/)
### CMS/ECM ### CMS/ECM

4
docs/intro/index.md
View File

@@ -49,7 +49,7 @@ For a more detailed introduction to Mermaid and some of its more basic uses, loo
🌐 [CDN](https://www.jsdelivr.com/package/npm/mermaid) | 📖 [Documentation](https://mermaidjs.github.io) | 🙌 [Contribution](../community/contributing.md) | 🔌 [Plug-Ins](../ecosystem/integrations-community.md) 🌐 [CDN](https://www.jsdelivr.com/package/npm/mermaid) | 📖 [Documentation](https://mermaidjs.github.io) | 🙌 [Contribution](../community/contributing.md) | 🔌 [Plug-Ins](../ecosystem/integrations-community.md)
> 🖖 Keep a steady pulse: mermaid needs more Collaborators, [Read More](https://github.com/knsv/mermaid/issues/866). > 🖖 Keep a steady pulse: mermaid needs more Collaborators, [Read More](https://github.com/mermaid-js/mermaid/issues/866).
:trophy: **Mermaid was nominated and won the [JS Open Source Awards (2019)](https://osawards.com/javascript/#nominees) in the category "The most exciting use of technology"!!!** :trophy: **Mermaid was nominated and won the [JS Open Source Awards (2019)](https://osawards.com/javascript/#nominees) in the category "The most exciting use of technology"!!!**
@@ -453,7 +453,7 @@ A quick note from Knut Sveidqvist:
> >
> _Thank you to [Tyler Long](https://github.com/tylerlong) who has been a collaborator since April 2017._ > _Thank you to [Tyler Long](https://github.com/tylerlong) who has been a collaborator since April 2017._
> >
> _Thank you to the ever-growing list of [contributors](https://github.com/knsv/mermaid/graphs/contributors) that brought the project this far!_ > _Thank you to the ever-growing list of [contributors](https://github.com/mermaid-js/mermaid/graphs/contributors) that brought the project this far!_
--- ---

3
docs/syntax/flowchart.md
View File

@@ -1792,8 +1792,7 @@ graph LR
``` ```
For a full list of available curves, including an explanation of custom curves, refer to For a full list of available curves, including an explanation of custom curves, refer to
the [Shapes](https://github.com/d3/d3-shape/blob/main/README.md#curves) documentation in the the [Shapes](https://d3js.org/d3-shape/curve) documentation in the [d3-shape](https://github.com/d3/d3-shape/) project.
[d3-shape](https://github.com/d3/d3-shape/) project.
### Styling a node ### Styling a node

40
docs/syntax/timeline.md
View File

@@ -18,7 +18,7 @@ timeline
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook 2004 : Facebook
: Google : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -28,7 +28,7 @@ timeline
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook 2004 : Facebook
: Google : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -67,7 +67,7 @@ timeline
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -76,7 +76,7 @@ timeline
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -198,7 +198,7 @@ However, if there is no section defined, then we have two possibilities:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -208,7 +208,7 @@ However, if there is no section defined, then we have two possibilities:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -239,7 +239,7 @@ let us look at same example, where we have disabled the multiColor option.
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -250,7 +250,7 @@ let us look at same example, where we have disabled the multiColor option.
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -278,7 +278,7 @@ Now let's override the default values for the `cScale0` to `cScale2` variables:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -296,7 +296,7 @@ Now let's override the default values for the `cScale0` to `cScale2` variables:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -329,7 +329,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -342,7 +342,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -357,7 +357,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -370,7 +370,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -385,7 +385,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -398,7 +398,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -413,7 +413,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -426,7 +426,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -441,7 +441,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -454,7 +454,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram

1
packages/mermaid/src/diagrams/user-journey/styles.js
View File

@@ -13,6 +13,7 @@ const getStyles = (options) =>
.legend { .legend {
fill: ${options.textColor}; fill: ${options.textColor};
font-family: ${options.fontFamily};
} }
.label text { .label text {

14
packages/mermaid/src/docs/config/faq.md
View File

@@ -1,11 +1,11 @@
# Frequently Asked Questions # Frequently Asked Questions
1. [How to add title to flowchart?](https://github.com/knsv/mermaid/issues/556#issuecomment-363182217) 1. [How to add title to flowchart?](https://github.com/mermaid-js/mermaid/issues/556#issuecomment-363182217)
1. [How to specify custom CSS file?](https://github.com/mermaidjs/mermaid.cli/pull/24#issuecomment-373402785) 1. [How to specify custom CSS file?](https://github.com/mermaidjs/mermaid.cli/pull/24#issuecomment-373402785)
1. [How to fix tooltip misplacement issue?](https://github.com/knsv/mermaid/issues/542#issuecomment-3343564621) 1. [How to fix tooltip misplacement issue?](https://github.com/mermaid-js/mermaid/issues/542#issuecomment-3343564621)
1. [How to specify gantt diagram xAxis format?](https://github.com/knsv/mermaid/issues/269#issuecomment-373229136) 1. [How to specify gantt diagram xAxis format?](https://github.com/mermaid-js/mermaid/issues/269#issuecomment-373229136)
1. [How to bind an event?](https://github.com/knsv/mermaid/issues/372) 1. [How to bind an event?](https://github.com/mermaid-js/mermaid/issues/372)
1. [How to add newline in the text?](https://github.com/knsv/mermaid/issues/384#issuecomment-281339381) 1. [How to add newline in the text?](https://github.com/mermaid-js/mermaid/issues/384#issuecomment-281339381)
1. [How to have special characters in link text?](https://github.com/knsv/mermaid/issues/407#issuecomment-329944735) 1. [How to have special characters in link text?](https://github.com/mermaid-js/mermaid/issues/407#issuecomment-329944735)
1. [How to change Flowchart curve style?](https://github.com/knsv/mermaid/issues/580#issuecomment-373929046) 1. [How to change Flowchart curve style?](https://github.com/mermaid-js/mermaid/issues/580#issuecomment-373929046)
1. [How to create a Flowchart end-Node that says "End"](https://github.com/mermaid-js/mermaid/issues/1444#issuecomment-639528897) 1. [How to create a Flowchart end-Node that says "End"](https://github.com/mermaid-js/mermaid/issues/1444#issuecomment-639528897)

4
packages/mermaid/src/docs/ecosystem/integrations-community.md
View File

@@ -39,6 +39,7 @@ To add an integration to this list, see the [Integrations - create page](./integ
- [Deepdwn](https://billiam.itch.io/deepdwn) ✅ - [Deepdwn](https://billiam.itch.io/deepdwn) ✅
- [Doctave](https://www.doctave.com/) ✅ - [Doctave](https://www.doctave.com/) ✅
- [Mermaid in Markdown code blocks](https://docs.doctave.com/components/mermaid) ✅ - [Mermaid in Markdown code blocks](https://docs.doctave.com/components/mermaid) ✅
- [Forgejo](https://forgejo.org/) ✅
- [GitBook](https://gitbook.com) - [GitBook](https://gitbook.com)
- [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid) - [Mermaid Plugin](https://github.com/JozoVilcek/gitbook-plugin-mermaid)
- [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf) - [Mermaid plugin for GitBook](https://github.com/wwformat/gitbook-plugin-mermaid-pdf)
@@ -94,8 +95,7 @@ Blogging frameworks and platforms
- [Nextra](https://nextra.site/) - [Nextra](https://nextra.site/)
- [Mermaid](https://nextra.site/docs/guide/mermaid) - [Mermaid](https://nextra.site/docs/guide/mermaid)
- [WordPress](https://wordpress.org) - [WordPress](https://wordpress.org)
- [WordPress Markdown Editor](https://wordpress.org/plugins/wp-githuber-md) - [MerPRess](https://wordpress.org/plugins/merpress/)
- [WP-ReliableMD](https://wordpress.org/plugins/wp-reliablemd/)
### CMS/ECM ### CMS/ECM

4
packages/mermaid/src/docs/intro/index.md
View File

@@ -44,7 +44,7 @@ For a more detailed introduction to Mermaid and some of its more basic uses, loo
🌐 [CDN](https://www.jsdelivr.com/package/npm/mermaid) | 📖 [Documentation](https://mermaidjs.github.io) | 🙌 [Contribution](../community/contributing.md) | 🔌 [Plug-Ins](../ecosystem/integrations-community.md) 🌐 [CDN](https://www.jsdelivr.com/package/npm/mermaid) | 📖 [Documentation](https://mermaidjs.github.io) | 🙌 [Contribution](../community/contributing.md) | 🔌 [Plug-Ins](../ecosystem/integrations-community.md)
> 🖖 Keep a steady pulse: mermaid needs more Collaborators, [Read More](https://github.com/knsv/mermaid/issues/866). > 🖖 Keep a steady pulse: mermaid needs more Collaborators, [Read More](https://github.com/mermaid-js/mermaid/issues/866).
:trophy: **Mermaid was nominated and won the [JS Open Source Awards (2019)](https://osawards.com/javascript/#nominees) in the category "The most exciting use of technology"!!!** :trophy: **Mermaid was nominated and won the [JS Open Source Awards (2019)](https://osawards.com/javascript/#nominees) in the category "The most exciting use of technology"!!!**
@@ -208,7 +208,7 @@ A quick note from Knut Sveidqvist:
> >
> _Thank you to [Tyler Long](https://github.com/tylerlong) who has been a collaborator since April 2017._ > _Thank you to [Tyler Long](https://github.com/tylerlong) who has been a collaborator since April 2017._
> >
> _Thank you to the ever-growing list of [contributors](https://github.com/knsv/mermaid/graphs/contributors) that brought the project this far!_ > _Thank you to the ever-growing list of [contributors](https://github.com/mermaid-js/mermaid/graphs/contributors) that brought the project this far!_
--- ---

3
packages/mermaid/src/docs/syntax/flowchart.md
View File

@@ -1135,8 +1135,7 @@ graph LR
``` ```
For a full list of available curves, including an explanation of custom curves, refer to For a full list of available curves, including an explanation of custom curves, refer to
the [Shapes](https://github.com/d3/d3-shape/blob/main/README.md#curves) documentation in the the [Shapes](https://d3js.org/d3-shape/curve) documentation in the [d3-shape](https://github.com/d3/d3-shape/) project.
[d3-shape](https://github.com/d3/d3-shape/) project.
### Styling a node ### Styling a node

20
packages/mermaid/src/docs/syntax/timeline.md
View File

@@ -12,7 +12,7 @@ timeline
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook 2004 : Facebook
: Google : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -51,7 +51,7 @@ timeline
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -134,7 +134,7 @@ However, if there is no section defined, then we have two possibilities:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -165,7 +165,7 @@ let us look at same example, where we have disabled the multiColor option.
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
``` ```
@@ -193,7 +193,7 @@ Now let's override the default values for the `cScale0` to `cScale2` variables:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -226,7 +226,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -241,7 +241,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -256,7 +256,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -271,7 +271,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram
@@ -286,7 +286,7 @@ Let's put them to use, and see how our sample diagram looks in different themes:
title History of Social Media Platform title History of Social Media Platform
2002 : LinkedIn 2002 : LinkedIn
2004 : Facebook : Google 2004 : Facebook : Google
2005 : Youtube 2005 : YouTube
2006 : Twitter 2006 : Twitter
2007 : Tumblr 2007 : Tumblr
2008 : Instagram 2008 : Instagram

3655
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff